/* Compact touch HUD: essential stats above, pixel shortcuts beside the city. */
@media(max-width:600px),(pointer:coarse){
 #game{--hud-top:max(10px,env(safe-area-inset-top));--hud-left:max(10px,env(safe-area-inset-left));--hud-right:max(10px,env(safe-area-inset-right));--hud-bottom:max(18px,env(safe-area-inset-bottom));--hud-rail-top:max(calc(var(--hud-top) + 128px),calc(50dvh - 126px))}
 .topbar,.topbar:has(#room-rank:not([hidden])){top:var(--hud-top);left:var(--hud-left);right:auto;width:min(430px,calc(100vw - var(--hud-left) - var(--hud-right) - 56px));max-width:none;min-height:54px;padding:0;gap:0;align-items:stretch;overflow:visible;border:2px solid var(--px-edge);border-radius:1px;box-shadow:3px 3px 0 var(--px-shadow);background-color:var(--px-paper);background-image:linear-gradient(90deg,#38534605 1px,transparent 1px),linear-gradient(#38534605 1px,transparent 1px);background-size:8px 8px}
 .topbar .place,.topbar:has(#room-rank:not([hidden])) .place{min-width:0;padding:8px;gap:0;flex:1}
 .topbar .place .pin,.topbar .chevron{display:none}
 .topbar .place small{font:700 7px var(--px-micro);letter-spacing:0;line-height:1.4}
 .topbar .place strong,.topbar:has(#room-rank:not([hidden])) .place strong{font-size:20px;line-height:1.15}
 .topbar .stats,.topbar:has(#room-rank:not([hidden])) .stats{min-width:0;gap:8px;padding:4px 8px;border-left:1px solid #38534635!important;align-items:center;flex:none}
 .topbar .stats>div:first-child{min-width:0}.topbar .stats strong,.topbar:has(#room-rank:not([hidden])) .stats strong{font-size:23px;line-height:1.1;white-space:nowrap}
 .topbar .stats small{font:800 7px var(--px-micro);letter-spacing:0}.topbar .stat-divider{height:27px}
 .topbar #mode-button{min-width:43px;min-height:44px;padding:0}.topbar #score{display:block;max-width:75px;overflow:hidden;text-overflow:ellipsis}
 .topbar #room-rank{min-width:41px;padding:0 0 0 7px}.topbar #room-rank strong{font-size:15px!important}
 #mobile-menu-button{position:fixed;top:var(--hud-top);right:var(--hud-right);left:auto;width:44px;height:44px;min-height:44px;margin:0;padding:0;display:grid;place-items:center;font-size:21px}
 #share-room{position:fixed;top:calc(var(--hud-top) + 66px);right:var(--hud-right);left:auto;width:auto;height:44px;min-width:145px;padding:0 10px;display:flex;align-items:center;justify-content:center;gap:7px;border:2px solid var(--px-edge);border-radius:1px;background:var(--px-gold);box-shadow:2px 2px 0 var(--px-shadow)}
 #share-room>span{font-size:22px;line-height:1}#share-room>small{display:block;margin:0;font:800 9px var(--px-micro);letter-spacing:0;white-space:nowrap}#share-room .invite-friends{display:inline}
 #share-room>b{position:static;padding:3px 4px;border:1px solid #8d813e;border-radius:0;background:#fff6d1;color:var(--px-ink);font:800 9px var(--px-micro)}#share-room:hover{background:#ffe9ad}
 #game-shortcuts{position:fixed;top:var(--hud-rail-top);right:var(--hud-right);left:auto;width:44px;display:flex;flex-direction:column;gap:8px;padding:0;border:0;background:none;box-shadow:none}
 #game-shortcuts button{width:44px;height:44px;min-height:44px;flex:none;display:flex;align-items:center;justify-content:center;padding:0}
 #game-shortcuts button>span,#game-shortcuts kbd{display:none}#game-shortcuts svg{width:19px;height:19px}
 #progress-strip{position:fixed;top:calc(var(--hud-rail-top) + 156px);right:var(--hud-right);left:auto;width:44px;max-width:none;display:flex;flex-direction:column;gap:8px;padding:0}
 #progress-strip #mission-chip,#progress-strip #alert-chip{width:44px;height:44px;min-height:44px;flex:none;padding:0;text-align:center}
 #progress-strip small,#mission-chip>span,#progress-strip #passport-chip{display:none}
 #mission-chip::before{content:'☆';font-size:26px;line-height:1}
 #progress-strip #alert-chip[data-level='0']{display:none}#alert-chip::before{content:'!';display:block;font-size:21px;font-weight:900;line-height:1}#alert-chip>span{display:block;font-size:7px;line-height:1.4;letter-spacing:-1px;white-space:nowrap}
 .mobile-map-open .minimap{top:calc(var(--hud-top) + 124px);left:var(--hud-left);right:auto;bottom:auto;width:min(186px,calc(100vw - 86px));padding:8px;border:2px solid var(--px-edge);border-radius:1px;box-shadow:2px 2px 0 var(--px-shadow)}
 .minimap #map{height:118px}.minimap .map-caption{display:none}.minimap-heading{font-size:7px}#map-close{width:36px;min-width:36px;height:36px;font-size:24px}
 #touch-controls{left:calc(var(--hud-left) + 4px);right:auto;bottom:var(--hud-bottom);width:100px;height:100px;display:block}
 #joystick{width:100px;height:100px}#joystick-knob{width:42px;height:42px}
 #action-dock{left:auto;right:var(--hud-right);bottom:var(--hud-bottom);width:164px;transform:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:0;border:0;background:none;background-image:none;box-shadow:none;border-radius:0}
 #action-dock>button{height:56px;min-height:56px;padding:10px 5px 9px;border:2px solid var(--px-edge);border-radius:1px;box-shadow:2px 2px 0 var(--px-shadow);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden}
 #action-dock strong{font:800 9px var(--px-micro);letter-spacing:0;line-height:1.2}#action-dock small{font-size:7px;margin:4px 0 2px;line-height:1.2;max-width:100%}
 #action-dock .action-shortcut,#action-dock .ultimate-control[data-state=idle] small,#action-dock .sprint-control[data-state=ready] small,#action-dock :is(#touch-roar,#touch-stomp)::after{display:none}
 #action-dock :is(.ultimate-track,.sprint-track){position:absolute;left:6px;right:6px;bottom:5px;width:auto;max-width:none;height:3px;margin:0;border:0;box-shadow:none}
 #action-dock>button:active,#action-dock>button[data-touch-active=true]{transform:translate(2px,2px);box-shadow:none}
 
 
 .toast{bottom:calc(var(--hud-bottom) + 136px);max-width:calc(100vw - 32px);padding:8px 12px;font-size:10px}
 .desktop-movement{display:none}
}
@media(max-width:360px){
 .topbar .place,.topbar:has(#room-rank:not([hidden])) .place{padding-left:5px;padding-right:5px}.topbar .place strong,.topbar:has(#room-rank:not([hidden])) .place strong{font-size:18px}
 .topbar .stats,.topbar:has(#room-rank:not([hidden])) .stats{gap:5px;padding-left:5px;padding-right:5px}.topbar .stats strong,.topbar:has(#room-rank:not([hidden])) .stats strong{font-size:21px}.topbar #room-rank{padding-left:5px;min-width:38px}.topbar #score{max-width:62px}
 #action-dock{width:156px}
}
/* On short screens, move shortcuts into a row above the play area. */
@media(max-width:600px) and (max-height:560px),(pointer:coarse) and (max-height:560px){
 #game-shortcuts{top:calc(var(--hud-top) + 66px);left:var(--hud-left);right:auto;width:auto;flex-direction:row}
 #progress-strip{top:calc(var(--hud-top) + 66px);left:calc(var(--hud-left) + 156px);right:auto;width:auto;flex-direction:row}
 .mobile-map-open .minimap{top:calc(var(--hud-top) + 120px);left:50%;transform:translateX(-50%);width:174px;max-height:calc(100dvh - var(--hud-top) - 132px);overflow:auto}.minimap #map{height:86px}
 
}
@media(max-width:420px) and (max-height:560px){
 #game-shortcuts,#progress-strip{top:calc(var(--hud-top) + 124px)}
 .mobile-map-open .minimap{top:calc(var(--hud-top) + 182px);max-height:calc(100dvh - var(--hud-top) - var(--hud-bottom) - 310px)}
 
}