/* V66 final pass — compact, game-first UI and resilient mobile viewport. */
html,body{width:100%!important;min-width:100%!important;max-width:100%!important;overflow-x:hidden!important}
#app,.gameColumn,.gamewrap{width:100%!important;max-width:100%!important;min-width:0!important}
#game{width:100%!important;max-width:100%!important;min-width:0!important}

/* Main screen: compact controls, no clipped nickname field. */
#join .homeHero{gap:12px!important;padding:56px clamp(10px,2vw,26px) 10px!important}
#join .heroCopy{min-width:0!important}
#join .heroCopy h1{margin:0 0 9px!important;line-height:.82!important}
#join .entryConsole{width:100%!important;max-width:420px!important;min-width:0!important;padding:8px!important;overflow:visible!important}
#join .entryConsole .nameField{display:grid!important;grid-template-columns:minmax(54px,72px) minmax(0,1fr)!important;width:100%!important;min-width:0!important;overflow:visible!important}
#join .entryConsole .nameField input{width:100%!important;min-width:0!important;max-width:100%!important;height:40px!important;font-size:16px!important;padding:0 10px!important;box-sizing:border-box!important}
#join .entryConsole .primaryBig{min-height:42px!important;height:42px!important;margin-top:6px!important}
#join .roomShelf{min-height:230px!important;max-height:52vh!important}

/* Header controls must always be reachable. Game-time exit is intentionally absent. */
#app>header{z-index:120!important;pointer-events:none!important}
#app>header>div:last-child{display:flex!important;align-items:center!important;gap:5px!important;pointer-events:auto!important}
#quickFullscreenBtn,#settingsBtn{display:inline-grid!important;place-items:center!important;visibility:visible!important;opacity:1!important;min-width:36px!important;width:36px!important;height:36px!important;padding:0!important;border-radius:50%!important;font-size:18px!important}
body:not(.inLobby) #leaveBtn{display:none!important}
body:not(.inLobby) #inviteBtn{display:none!important}
body:not(.inLobby) #backLobby{display:none!important}
body.inLobby #leaveBtn{display:inline-grid!important;place-items:center!important}

/* Lobby status: tiny roster, only identity and state. */
body.inLobby #app #info{width:min(218px,20vw)!important;padding:5px!important;max-height:52vh!important;background:#17353bd9!important;box-shadow:4px 6px 0 #091d224d!important}
body.inLobby #players{display:grid!important;grid-template-columns:1fr!important;gap:2px!important}
body.inLobby #players .player{display:grid!important;grid-template-columns:24px minmax(0,1fr) auto!important;min-height:28px!important;height:28px!important;padding:2px 5px!important;border-left-width:3px!important;box-shadow:none!important;transform:none!important}
body.inLobby #players .avatar{width:22px!important;height:22px!important;overflow:hidden!important}
body.inLobby #players .portraitArt{height:29px!important;transform:translateY(-3px)!important}
body.inLobby #players .playerText b{display:block!important;font-size:9px!important;line-height:10px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
body.inLobby #players .playerText small{font-size:8px!important;line-height:9px!important;color:#6b6253!important}
body.inLobby #players .player>span{font-size:7px!important;padding:1px 3px!important}
body.inLobby #phaseBanner{font-size:clamp(16px,2.2vw,26px)!important;padding:3px 11px!important;min-width:0!important}
body.inLobby #controlsHint{font-size:10px!important;padding:3px 7px!important}
body.inLobby .lobbyCountdown{font-size:12px!important;padding:3px 7px!important}

/* Party box: dense fixed grid; 14 items fit into one landscape mobile screen. */
.partyOverlay{overflow:hidden!important;padding:4px!important}
.partyBoard{width:min(1180px,99vw)!important;height:min(640px,98dvh)!important;max-height:98dvh!important;padding:7px!important;overflow:hidden!important;display:grid!important;grid-template-rows:auto minmax(0,1fr) auto!important;gap:5px!important}
.partyBoardHead{min-height:0!important;margin:0!important;padding:0 3px!important}
.partyBoardHead h2{font-size:20px!important;margin:0!important}.partyBoardHead p{font-size:10px!important;margin:1px 0!important}
.partyCards{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;grid-auto-rows:minmax(0,1fr)!important;gap:4px!important;overflow:hidden!important;min-height:0!important;align-items:stretch!important}
.partyPick{min-width:0!important;min-height:0!important;height:100%!important;padding:3px!important;border-radius:8px!important;display:grid!important;grid-template-columns:36px minmax(0,1fr)!important;grid-template-rows:1fr!important;gap:3px!important;align-items:center!important;overflow:hidden!important}
.partyPick img{width:34px!important;height:34px!important;object-fit:contain!important}.partyPick strong{font-size:10px!important;line-height:1.05!important}.partyPick small,.partyPick em,.partyPick .partyCat{display:none!important}.partyPick i{font-size:7px!important;right:2px!important;bottom:2px!important;padding:1px 3px!important}.partyLive{max-height:42px!important;overflow:hidden!important}.partyLiveRows{display:flex!important;gap:3px!important;flex-wrap:nowrap!important}.partyLiveRows>div{min-width:0!important;padding:2px 4px!important;font-size:8px!important}.partyLiveRows em{display:none!important}

/* Translucent mobile HUD. */
.touchUI #mobile .moveJoystick,.touchUI #mobile button{background:rgba(20,32,36,.30)!important;border:1px solid rgba(255,255,255,.18)!important;box-shadow:0 3px 12px rgba(0,0,0,.12)!important;backdrop-filter:blur(6px)!important;color:rgba(255,247,226,.88)!important}
.touchUI #mobile .moveTrack{background:rgba(255,255,255,.10)!important;border:1px solid rgba(255,255,255,.15)!important}.touchUI #mobile #touchMoveKnob{background:rgba(255,247,220,.52)!important;border:1px solid rgba(255,255,255,.28)!important;box-shadow:none!important}.touchUI #mobile .pressed,.touchUI #mobile .moveJoystick.active{background:rgba(235,203,122,.38)!important;transform:scale(1.025)}
.touchUI #mobile .moveJoystick small{opacity:.58!important;font-size:8px!important}

@media (orientation:landscape) and (pointer:coarse){
 body.touchUI #app>header{position:fixed!important;top:max(3px,env(safe-area-inset-top))!important;right:max(4px,env(safe-area-inset-right))!important;left:auto!important;width:auto!important;max-width:none!important;background:transparent!important;box-shadow:none!important;padding:0!important}
 body.touchUI #app>header>div:first-child,body.touchUI #app>header>#timer,body.touchUI #app>header #ping,body.touchUI #inviteBtn{display:none!important}
 body.touchUI #quickFullscreenBtn,body.touchUI #settingsBtn,body.touchUI #leaveBtn{width:34px!important;min-width:34px!important;height:34px!important;font-size:17px!important;background:#17343aaa!important;border:1px solid #fff2ce22!important;color:#fff1d3!important}
 body.touchUI.inLobby #app #info{top:42px!important;right:max(5px,env(safe-area-inset-right))!important;width:min(180px,24vw)!important;max-height:45vh!important}
 body.touchUI.inLobby #players .player{height:24px!important;min-height:24px!important;grid-template-columns:20px minmax(0,1fr) auto!important}.touchUI.inLobby #players .avatar{width:18px!important;height:18px!important}.touchUI.inLobby #players .portraitArt{height:24px!important}.touchUI.inLobby #players .playerText b{font-size:8px!important}.touchUI.inLobby #players .playerText small{font-size:7px!important}
 .partyBoard{height:calc(var(--visible-vh,100dvh) - 4px)!important;width:calc(var(--visible-vw,100vw) - 4px)!important}.partyBoardHead h2{font-size:15px!important}.partyBoardHead p{font-size:8px!important}.partyCards{grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:2px!important}.partyPick{grid-template-columns:29px minmax(0,1fr)!important;padding:2px!important}.partyPick img{width:28px!important;height:28px!important}.partyPick strong{font-size:8px!important}.partyLive{display:none!important}
 #join .homeHero{height:calc(var(--visible-vh,100dvh) - 48px)!important;min-height:0!important;padding:48px 8px 4px!important;overflow:hidden!important;grid-template-columns:minmax(190px,.8fr) minmax(240px,1.2fr) minmax(155px,.65fr)!important;gap:6px!important}
 #join .heroCopy h1{font-size:clamp(30px,9vh,48px)!important}#join .entryConsole{padding:5px!important}#join .entryConsole .nameField{grid-template-columns:50px minmax(0,1fr)!important}#join .entryConsole .nameField input{height:34px!important}#join .entryConsole .primaryBig{height:34px!important;min-height:34px!important}#join .roomShelf{min-height:0!important;max-height:calc(var(--visible-vh,100dvh) - 60px)!important}
}