멈춘 게임의 [게임 끝내기]를 방 막대에서 상태 줄 아래로 옮김

방장 + 멈춘 게임에서 막대 버튼이 7개가 되어 320px 휴대폰에서 넘쳤다. 막대는 최대 6개로 두고,
끝내기 버튼은 "오류로 게임이 멈췄어요" 안내 바로 아래에 둔다. 도움말의 "메뉴에서" 문구도 고침.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

apps/web/src/components/GameHelp.tsx

@@ -111,7 +111,7 @@ export function GameHelp({ room, ui, title, me, players }: { room: RoomView; ui:
   const seated = room.seats.some((s) => s?.user.id === me);
   const now =
     room.status === 'paused'
-      ? '오류로 게임이 멈췄어요. 방장이 메뉴에서 게임을 끝낼 수 있어요.'
+      ? '오류로 게임이 멈췄어요. 방장이 [게임 끝내기] 버튼으로 끝낼 수 있어요.'
       : view === undefined
         ? ''
         : (ui.helpNow ?? ui.statusText)(view, me, players);

apps/web/src/pages/RoomPage.tsx

@@ -141,7 +141,6 @@ function Room({ code, me }: { code: string; me: PublicUser }) {
   const inGame = room.status === 'playing' || room.status === 'paused' || (room.status === 'finished' && !!game);
   // Games with their own chat channels (마피아) close the room chat while playing (the server refuses it too).
   const roomChatClosed = !!ui.ownChat && (room.status === 'playing' || room.status === 'paused');
-  const isHost = room.hostId === me.id;
   const doLeave = () => {
     socket.leave();
     nav('/');
@@ -201,12 +200,6 @@ function Room({ code, me }: { code: string; me: PublicUser }) {
             <span className="rb-ico">⚙️</span>
             <span className="rb-lbl">설정</span>
           </button>
-          {isHost && room.status === 'paused' && (
-            <button className="btn btn-danger btn-sm rb-btn" onClick={() => socket.send({ t: 'void' })} aria-label="게임 끝내기(무효)">
-              <span className="rb-ico">⏹</span>
-              <span className="rb-lbl">게임 끝내기</span>
-            </button>
-          )}
           <button className="btn btn-danger btn-sm rb-btn" onClick={askLeave} aria-label="🚪 나가기">
             <span className="rb-ico">🚪</span>
             <span className="rb-lbl">나가기</span>
@@ -610,11 +603,19 @@ function GameView({ room, ui, me, players, pending, slow }: { room: RoomView; ui
     </div>
   );
   // [?] 지금 할 수 있는 것 sits right next to the turn status (docs/07 §5).
+  // The host's way out of a game stopped by an error sits right under the status that explains it.
   const statusRow = (
+    <>
       <div className="row" style={{ flexWrap: 'nowrap', gap: 8, width: '100%', alignItems: 'stretch' }}>
         {status}
         <GameHelp room={room} ui={ui} title={gameName(room.gameId)} me={me.id} players={players} />
       </div>
+      {room.status === 'paused' && room.hostId === me.id && (
+        <button className="btn btn-danger btn-block" onClick={() => socket.send({ t: 'void' })}>
+          ⏹ 게임 끝내기(무효)
+        </button>
+      )}
+    </>
   );
   return (
     <div className="game-layout">

docs/06-lobby-rooms.md

@@ -57,7 +57,8 @@
 
 ## 8. 게임 중
 - 위쪽 상태 줄: 지금 할 일 문장("내 차례예요" / "OO님 차례예요"), 남은 시간 링.
-- 방 막대(메뉴 버튼 없이 모두 밖에): [← 홈] 게임 이름(PC) · [🔗 방 코드 링크 복사] · [💬 채팅](휴대폰) · [📖 규칙] · [⚙️ 설정](글자 크기·소리, `/me`) · [⏹ 게임 끝내기](방장, 오류로 멈춘 게임만) · **[🚪 나가기]**. 휴대폰에서는 아이콘 아래 짧은 글자로 쌓아 한 줄(320px)에 들어가게 한다.
+- 방 막대(메뉴 버튼 없이 모두 밖에): [← 홈] 게임 이름(PC) · [🔗 방 코드 링크 복사] · [💬 채팅](휴대폰) · [📖 규칙] · [⚙️ 설정](글자 크기·소리, `/me`) · **[🚪 나가기]**. 휴대폰에서는 아이콘 아래 짧은 글자로 쌓아 한 줄(320px)에 들어가게 한다(버튼은 최대 6개).
+- 오류로 게임이 멈추면 방장에게만 상태 줄 바로 아래 [⏹ 게임 끝내기(무효)] 버튼이 나온다.
 - [🚪 나가기]와 [← 홈]은 같은 동작이다: 방에서 나가고 홈으로. 한 번 누르면 바로 나가고, 게임 중에 자리에 앉아 있을 때만 "게임 중에 나가면 기권으로 처리돼요" 확인을 한 번 더 묻는다.
 - 무르기 요청·무승부 제안·기권은 게임 화면 안의 버튼으로 한다(지원 게임).
 - 관전자는 [자리 나면 참가] 대기 가능(다음 판부터).