fix(game-ui): 로비 새 탭 이동을 지원한다

app/game-frontend/src/components/main/GatewayLobbyLink.vue

@@ -0,0 +1,16 @@
+<script setup lang="ts">
+import { gameFrontendRuntimeConfig } from '../../config/runtimeConfig';
+
+const handleClick = (event: MouseEvent): void => {
+    if (event.button !== 0 || event.ctrlKey || event.metaKey || event.shiftKey || event.altKey) {
+        return;
+    }
+
+    event.preventDefault();
+    window.location.replace(gameFrontendRuntimeConfig.gatewayWebUrl);
+};
+</script>
+
+<template>
+    <a :href="gameFrontendRuntimeConfig.gatewayWebUrl" @click="handleClick"><slot>로비로</slot></a>
+</template>

app/game-frontend/src/components/main/MainMobileBottomBar.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { computed } from 'vue';
 import { legacyNationTextColor } from '../../utils/legacyNationColor';
+import GatewayLobbyLink from './GatewayLobbyLink.vue';
 import MainNavigationLink from './MainNavigationLink.vue';
 import {
     buildGlobalNavigation,
@@ -29,7 +30,6 @@ const props = defineProps<{
 const emit = defineEmits<{
     refresh: [];
     toggleRealtime: [];
-    lobby: [];
     quick: [item: QuickNavigationItem];
     action: [action: NonNullable<MainNavigationLinkItem['action']>];
 }>();
@@ -212,14 +212,12 @@ const onAction = (action: NonNullable<MainNavigationLinkItem['action']>) => {
                     </li>
                 </template>
                 <li class="bottom-lobby" role="none">
-                    <button
+                    <GatewayLobbyLink
                         class="quick-link lobby-link legacy-button legacy-button--navigation"
-                        type="button"
                         role="menuitem"
-                        @click="emit('lobby')"
                     >
                         로비로
-                    </button>
+                    </GatewayLobbyLink>
                 </li>
             </ul>
         </div>

app/game-frontend/src/components/main/MainTurnControls.vue

@@ -1,4 +1,6 @@
 <script setup lang="ts">
+import GatewayLobbyLink from './GatewayLobbyLink.vue';
+
 defineProps<{
     realtimeEnabled: boolean;
     refreshing: boolean;
@@ -7,7 +9,6 @@ defineProps<{
 const emit = defineEmits<{
     refresh: [];
     toggleRealtime: [];
-    lobby: [];
 }>();
 </script>
 
@@ -34,13 +35,11 @@ const emit = defineEmits<{
                 <strong>{{ realtimeEnabled ? 'ON' : 'OFF' }}</strong>
             </button>
         </div>
-        <button
+        <GatewayLobbyLink
             class="main-turn-controls__lobby legacy-button legacy-button--navigation"
-            type="button"
-            @click="emit('lobby')"
         >
             로비로
-        </button>
+        </GatewayLobbyLink>
     </section>
 </template>