#menuScreen .friends-room input[readonly] { text-transform: none; font-size: 11px; }
#menuScreen #inviteLinkLabel[hidden] { display: none; }
#menuScreen #btnShareRoom, #menuScreen #btnRoomCode { min-height: 44px; }
#menuScreen:has(.friends-room[open]) #lobbyMode { z-index: 16; }
#menuScreen:has(.friends-room[open]) #lobbyNav { visibility: hidden; }
#menuScreen .friends-room[open] { position: fixed; top: calc(50% - 28px); left: 50%; right: auto; bottom: auto; transform: translate(-50%,-50%); box-sizing: border-box; width: min(340px,calc(100vw - 24px)); max-width: none; max-height: calc(100dvh - 120px); overflow-y: auto; margin: 0; padding: 14px; border: 1px solid #8daebc; border-radius: 10px; background: #102936; color: #eef6fa; box-shadow: 0 12px 45px #000b; font-size: 12px; }
#menuScreen .friends-room[open] summary { min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 12px; font-weight: bold; cursor: pointer; }
#menuScreen .friends-room[open] summary::after { content: 'CERRAR'; font-size: 10px; color: #f7ce7d; }
#menuScreen .friends-room[open] label { display: block; margin: 10px 0 6px; font-size: 11px; line-height: 1.5; }
#menuScreen .friends-room[open] input { box-sizing: border-box; display: block; width: 100%; min-height: 44px; padding: 10px; margin-top: 4px; border: 1px solid #6d8d9b; border-radius: 4px; background: #081d29; color: #eef6fa; font-size: 13px; }
#menuScreen .friends-room[open] button { width: 100%; margin: 5px 0; padding: 10px; border: 1px solid #edc16f; border-radius: 4px; background: #173b4d; color: #f7e4ba; font-size: 12px; font-weight: bold; cursor: pointer; }
#menuScreen .friends-room[open] small { display: block; margin-top: 8px; font-size: 11px; line-height: 1.5; color: #cfdee5; }
#hudOverlay[data-phase="lobby"] .state-banner { pointer-events: auto; max-height: 65dvh; overflow-y: auto; }
#hudOverlay[data-phase="lobby"] :is(.supply-panel,.compass,.controls-help,.zone-timer,.minimap,.weapon-panel,.crosshair,.vitals,.ability-status) { display: none; }
#hudOverlay .room-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 12px; }
#hudOverlay .room-actions button { min-height: 44px; padding: 10px 14px; border: 1px solid #e2bb6a; border-radius: 5px; background: #102936; color: #f5e5bd; font-size: 12px; cursor: pointer; }
#hudOverlay #btnStartRoom { background: #e4b554; color: #102430; font-weight: bold; }
#hudOverlay .state-banner p { color: #edf4f7; font-size: 12px; }
#hudOverlay .room-players { display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; }
#hudOverlay .room-players span { overflow-wrap: anywhere; }
#hudOverlay[data-phase="lobby"] .state-banner { max-width: min(90vw,560px); width: max-content; }
@media(max-height:450px) { #hudOverlay[data-phase="lobby"] .state-banner { top: 20%; max-height: 72dvh; } }