/* The game follows the visible viewport, including mobile browser chrome changes. */
#arena{height:100svh;height:100dvh;min-height:0}
.mobile-screen-entry,.touch-copy{display:none}
[data-fullscreen]{white-space:nowrap}
button,.stick{-webkit-tap-highlight-color:transparent}
.menu [data-fullscreen]{border-color:#c5a96c;color:#ead5a2}
#screenHelp{z-index:20;padding:max(16px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left))}
.screen-help-dialog{max-height:calc(100dvh - 40px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
.screen-help-dialog ol{padding-left:24px;line-height:1.8;color:#e4d3ab}
.screen-help-dialog .screen-help-note{font-size:13px;color:#b4c1aa;margin-top:12px}
@media(pointer:coarse){
 html,body{overflow:hidden}
 .keyboard-copy{display:none}.touch-copy{display:block}
 .mobile-screen-entry{display:flex;align-items:center;gap:12px;margin:14px 0}
 .mobile-screen-entry button{min-width:104px;min-height:44px;border:1px solid #d6bb80;background:#23352a;padding:9px 12px;color:#efd8a4}
 .mobile-screen-entry p{font-size:12px;line-height:1.7;color:#bcc9b4}
 .intro-content{max-height:calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
 .dialog{max-height:calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
 .overlay{padding:max(16px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left))}
 .menu button{min-height:36px}
 .topbar{padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right))}
 #arena{--top:calc(96px + env(safe-area-inset-top))}
 .topbar{padding-top:calc(8px + env(safe-area-inset-top))}
 .shield-value{top:calc(72px + env(safe-area-inset-top))}
 .stick{bottom:calc(14px + env(safe-area-inset-bottom))}
 .move-stick{left:max(15px,env(safe-area-inset-left))}
 .aim-stick{right:max(15px,env(safe-area-inset-right))}
 .touch-actions button{min-height:38px}
 .touch-actions{bottom:calc(14px + env(safe-area-inset-bottom))}
}
/* Two thumb zones with the full scene behind them; the center stays clear. */
@media(pointer:coarse) and (orientation:landscape) and (max-height:620px){
 #arena,#arena.is-practice{--top:calc(54px + env(safe-area-inset-top));--dock:120px}
 #playfield{inset:0}
 .topbar{display:flex;height:var(--top);gap:10px;padding:calc(5px + env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) 5px max(12px,env(safe-area-inset-left));background:#101b16d9;border:0}
 .vitals{display:block;min-width:100px;width:100px;flex:none}
 .player-id{display:none}.vital-track{min-width:0;font-size:9px;margin:0 0 5px}.vital-track>span{margin-bottom:2px}.vital-track i{height:3px}
 .shield-value{position:static;font-size:9px;line-height:1}
 .location{min-width:60px;max-width:180px;gap:1px}.location>b{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.location>span{font-size:9px}.location #stealthText{position:static;margin:0;font-size:9px}
 .match{min-width:58px;gap:1px;font-size:9px}.match b{font-size:16px;margin-left:3px}.match small{font-size:8px;max-width:90px;line-height:1.2}
 .menu{display:flex;gap:4px;align-self:center;flex:none}.menu button{height:44px;min-height:44px;min-width:40px;font-size:11px;padding:4px 6px}.menu [data-fullscreen]{min-width:62px}
 .bottom-dock,#arena.is-practice .bottom-dock{height:calc(120px + env(safe-area-inset-bottom));padding:0;border:0;background:transparent;pointer-events:none}
 .bottom-dock button,.bottom-dock .stick{pointer-events:auto}
 .quickbar{position:absolute;width:min(350px,calc(100% - 224px - env(safe-area-inset-left) - env(safe-area-inset-right)));max-width:none;left:50%;transform:translateX(-50%);bottom:calc(10px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}
 .slot{height:48px;padding:13px 2px 3px;gap:1px;background:#17281eea}.slot.selected{background:#514b2beF}.slot .slot-icon{height:14px!important;width:auto!important;font-size:12px;line-height:14px!important;min-width:0;white-space:nowrap}.slot b{font-size:10px}.slot .quantity{top:2px;right:4px;font-size:11px}.slot kbd{display:none}
 .stick{width:88px;height:88px;bottom:calc(14px + env(safe-area-inset-bottom))}.move-stick{left:max(14px,env(safe-area-inset-left))}.aim-stick{right:max(14px,env(safe-area-inset-right))}.stick-rim{background:#1b2d22b8;box-shadow:inset 0 0 18px #09140f55}.stick small{color:#d0dcc1}
 .touch-actions{display:grid;grid-template-columns:repeat(4,52px);gap:5px;left:50%;right:auto;transform:translateX(-50%);bottom:calc(64px + env(safe-area-inset-bottom))}.touch-actions button{height:44px;min-height:44px;font-size:11px;background:#17281eea}
 .notice{top:0;left:112px;right:112px;height:16px;font-size:10px;line-height:16px;background:#0c1c13c9;border-radius:2px;color:#c6d1bb}
 .practice-bar{top:auto;bottom:calc(126px + env(safe-area-inset-bottom));width:min(460px,calc(100% - 32px - env(safe-area-inset-left) - env(safe-area-inset-right)));height:48px;padding:4px 7px;gap:8px;background:#11241aec;border:1px solid #b69c644d;border-radius:3px}
 .practice-copy strong{font-size:11px;margin-bottom:4px}.practice-steps{gap:3px}.practice-steps span{font-size:9px;padding:2px 3px}#readyBattleButton{min-height:40px;font-size:12px;padding:6px 10px}
 .intro-content{max-width:620px;width:100%;max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
 .intro-mark{display:none}.overlay{padding-top:max(12px,env(safe-area-inset-top));padding-bottom:max(12px,env(safe-area-inset-bottom))}
 .dialog{max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:18px 22px}
 .ending-ui>button{right:max(12px,env(safe-area-inset-right));top:calc(10px + env(safe-area-inset-top))}.ending-copy{bottom:calc(12px + env(safe-area-inset-bottom))}.ending-copy h2{font-size:22px}.ending-copy p{font-size:12px}
}
@media(pointer:coarse) and (orientation:landscape) and (max-width:640px){
 .topbar{gap:6px}.vitals{width:88px;min-width:88px}.location{min-width:40px}.location>span:not(#stealthText){display:none}.match{min-width:50px}.menu{gap:3px}.menu button{min-width:36px;padding:4px;font-size:10px}.menu [data-fullscreen]{min-width:58px}
 .quickbar{width:calc(100% - 212px - env(safe-area-inset-left) - env(safe-area-inset-right));gap:3px}.touch-actions{grid-template-columns:repeat(4,48px);gap:4px}
}
