/* Phone/tablet presentation. Desktop layout is untouched without touch-ui. */
#touch-controls{display:none}body.touch-ui.playing #touch-controls:not([hidden]){display:flex;position:fixed;right:max(5px,env(safe-area-inset-right));top:96px;bottom:62px;width:94px;z-index:7;flex-direction:column;gap:6px;pointer-events:none}#touch-controls button,#touch-controls select{pointer-events:auto;touch-action:manipulation;min-height:44px;border:1px solid #a7baa2;border-radius:8px;background:#f1f0e5f5;color:#203e35;padding:6px;font:700 12px system-ui;box-sizing:border-box;max-width:100%}.touch-tools{display:grid;grid-template-columns:1fr 1fr;gap:4px;pointer-events:auto}#touch-actions{overflow-y:auto;overscroll-behavior:contain;pointer-events:auto;display:grid;gap:6px;padding:2px;scrollbar-width:thin}#touch-actions button{width:100%}.touch-action b{display:block}.touch-action.selected{background:#d8edbd!important;outline:2px solid #678b41;outline-offset:-2px}.touch-action:disabled{opacity:.5}.touch-rounds{display:flex;flex-wrap:wrap;justify-content:center;gap:3px;margin:6px 0}.touch-rounds i{display:block;width:11px;height:11px;border-radius:50%;background:conic-gradient(#deb95c var(--fill),#4c6059 0);border:1px solid #334d3c}.touch-rounds i.loaded{background:#5ca766}#touch-actions small{font-size:10px;font-weight:500}#touch-hint{font:11px/1.4 system-ui;padding:7px;margin:0;background:#f1f0e5ed;border-radius:6px;color:#294638}.touch-deploy-label,.touch-commander{display:grid;gap:4px;font:11px system-ui;background:#f1f0e5;padding:5px;border-radius:6px}
body.touch-ui #battlefield{touch-action:none;user-select:none;-webkit-user-select:none}body.touch-ui.playing #app{height:100dvh;min-height:0}body.touch-ui.playing{height:100dvh;overscroll-behavior:none}body.touch-ui button,body.touch-ui select,body.touch-ui summary{touch-action:manipulation}body.touch-ui input,body.touch-ui select{font-size:16px}
body.touch-ui.playing #players-hud{display:none}body.touch-ui.touch-army-open.playing #players-hud{display:block}body.touch-ui.playing #players-hud .hud-player{position:fixed;top:96px!important;left:max(5px,env(safe-area-inset-left))!important;bottom:auto!important;right:auto!important;width:min(260px,calc(100vw - 112px));max-height:calc(100dvh - 162px);overflow-y:auto;z-index:8}body.touch-ui.playing #players-hud .hud-player:not(.touch-active-commander){display:none}body.touch-ui .hud-controls{display:none}
body.touch-ui.playing #match-ui #loss-counters{top:env(safe-area-inset-top,0px);height:43px;max-width:calc(100% - 10px);padding:3px 5px;overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;pointer-events:auto;gap:4px}body.touch-ui.playing #match-ui #loss-counters .loss-badge{flex-shrink:0;padding:3px;gap:3px}body.touch-ui.playing #match-ui #loss-counters .loss-badge strong{font-size:12px!important}body.touch-ui.playing #match-ui .phase-bar{top:48px;min-height:34px;height:38px;padding:3px 9px;gap:10px;max-width:calc(100% - 12px)}body.touch-ui.playing #match-ui .phase-bar h2{font-size:16px;margin:0}body.touch-ui.playing #match-ui .phase-bar .clock>span{font-size:24px}body.touch-ui .battle-caption{display:none}body.touch-ui.playing .phase-toast{top:100px;max-width:calc(100% - 116px)}body.touch-ui.playing .phase-toast h2{font-size:27px}
body.touch-ui.playing .masthead,body.touch-ui.playing.wide-match .masthead{left:50%;bottom:max(4px,env(safe-area-inset-bottom));transform:translateX(-50%);max-width:calc(100% - 8px);padding:3px 5px;gap:4px}body.touch-ui.playing .masthead .wordmark,body.touch-ui.playing .masthead #fullscreen,body.touch-ui.playing .masthead #edit-controls,body.touch-ui.playing .masthead #players-online{display:none}body.touch-ui.playing .masthead .header-actions{gap:4px}body.touch-ui.playing .masthead button,body.touch-ui.playing .masthead #upgrades{min-height:40px;font-size:11px;padding:5px 7px}
body.touch-ui #upgrade-guide,body.touch-ui #control-settings,body.touch-ui #tutorial-chapters,body.touch-ui #changelog-dialog{max-width:96vw;max-height:90dvh;padding:14px;overflow:auto}body.touch-ui #doctrine-panel{position:fixed!important;top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;width:min(780px,96vw)!important;max-height:92dvh;overflow:auto;padding:12px;z-index:30}body.touch-ui #doctrine-panel .doctrine-options{gap:5px}body.touch-ui #doctrine-panel .doctrine-options button{min-height:150px;padding:8px}body.touch-ui #doctrine-panel .doctrine-illustration{height:65px}body.touch-ui #doctrine-panel h2{font-size:22px}body.touch-ui #doctrine-panel h3{font-size:15px}body.touch-ui .sub-doctrine-options{grid-template-columns:repeat(2,minmax(0,1fr))}body.touch-ui .howitzer-card{position:fixed!important;top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;max-width:94vw!important;max-height:80dvh;overflow:auto;z-index:35}body.touch-ui #round-report{max-width:94vw;max-height:80dvh;overflow:auto}body.touch-ui #tutorial-panel{max-width:calc(100% - 110px);max-height:40dvh;overflow:auto;left:5px;bottom:62px}
@media(max-width:700px){body.touch-ui:not(.playing) .masthead{padding:12px;flex-wrap:wrap;gap:12px}body.touch-ui:not(.playing) .header-actions{flex-wrap:wrap;gap:5px}body.touch-ui:not(.playing) .header-actions button{min-height:42px}body.touch-ui #lobby{padding:18px 12px 110px}body.touch-ui #menu-navigation{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}body.touch-ui .menu-card{padding:12px 10px 16px;min-height:0}body.touch-ui .menu-card strong{font-size:20px}body.touch-ui .menu-squad{height:104px}body.touch-ui .mode-categories{display:grid;grid-template-columns:1fr;gap:7px}body.touch-ui .setup-panel{padding:12px;min-width:0}body.touch-ui .mode-options{flex-wrap:wrap}body.touch-ui .mode-options button{min-height:44px}body.touch-ui #online-entry{display:flex;flex-direction:column;align-items:stretch}body.touch-ui .online-slots{grid-template-columns:1fr}body.touch-ui #version-tag{font-size:10px}body.touch-ui #menu-studio-logo{width:45px;height:45px}body.touch-ui .intro h1{font-size:clamp(24px,7vw,40px)}}
@media(orientation:landscape) and (max-height:550px){body.touch-ui.playing #touch-controls:not([hidden]){top:88px;bottom:52px;width:105px}body.touch-ui.playing .touch-tools{grid-template-columns:repeat(4,1fr)}#touch-hint{font-size:10px;padding:3px}body.touch-ui .touch-tools button{min-height:32px;font-size:10px;padding:2px}body.touch-ui.playing .phase-toast{top:90px}body.touch-ui #doctrine-panel .doctrine-illustration{height:45px}body.touch-ui #doctrine-panel .doctrine-options button{min-height:100px}}

body.touch-ui .howitzer-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}body.touch-ui .howitzer-options button{min-width:0;min-height:70px}body.touch-ui #presence-stats{max-width:94vw;max-height:85dvh;overflow:auto}
/* Mobile command deck v2: stable thumb targets, compact cooldowns and precision placement. */
body.touch-ui.playing #touch-controls:not([hidden]){top:auto;bottom:max(54px,calc(env(safe-area-inset-bottom) + 50px));left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));width:auto;max-height:38dvh;gap:5px}
body.touch-ui.playing .touch-tools{position:fixed;left:max(8px,env(safe-area-inset-left));top:94px;display:flex;flex-direction:column;gap:5px;width:48px}
body.touch-ui.playing .touch-tools button{min-height:44px;font-size:12px;padding:4px;background:#edf1e8ed}
body.touch-ui.playing #touch-actions{display:flex;align-items:stretch;gap:7px;overflow-x:auto;overflow-y:auto;background:#183d36ed;border:1px solid #b0c0ac;border-radius:12px;padding:8px;box-shadow:0 3px 16px #0004;scrollbar-width:thin}
body.touch-ui.playing #touch-actions button{flex:1 0 76px;width:auto;min-height:54px;font-size:13px;border-radius:9px;box-shadow:0 2px 3px #0003}
body.touch-ui.playing #touch-actions button.selected{background:#e9c967!important;color:#1d332b;outline:2px solid #fff1b2}
body.touch-ui.playing #touch-actions button[data-touch="place"]{background:#90d0a0;color:#103b27;min-width:106px;font-size:16px}
body.touch-ui.playing #touch-hint{padding:5px 10px;text-align:center;font-size:12px;background:#f1f0e5f0;pointer-events:none}
body.touch-ui.playing .touch-rounds{gap:4px;max-width:128px;margin:5px auto}
body.touch-ui.playing .touch-rounds i{width:12px;height:12px}
body.touch-ui.playing .touch-action small{font-size:12px!important}
body.touch-ui.playing #touch-controls[data-phase="build"] #touch-actions,body.touch-ui.playing #touch-controls[data-phase="artillery"] #touch-actions,body.touch-ui.playing #touch-controls[data-phase="hq"] #touch-actions{flex-wrap:wrap}
.touch-build-actions{display:flex;gap:6px;flex:1;min-width:250px}.touch-deploy-list{display:flex;flex-basis:100%;gap:5px;overflow-x:auto}.touch-nudge{display:grid;grid-template-columns:repeat(2,42px);gap:3px}
body.touch-ui.playing #touch-actions .touch-nudge button{min-height:32px;padding:2px;font-size:22px;width:42px}
body.touch-ui.playing #touch-actions .touch-deploy-list button{min-height:40px;flex:1 0 76px;font-size:12px}
body.touch-ui.playing #tutorial-panel{bottom:220px;max-width:calc(100% - 76px);max-height:32dvh}
body.touch-ui.playing #players-hud .hud-player{left:62px!important;max-height:calc(100dvh - 240px)}
@media(orientation:landscape) and (max-height:550px){body.touch-ui.playing #touch-controls:not([hidden]){left:66px;bottom:48px;max-height:43dvh}body.touch-ui.playing .touch-tools{top:90px}body.touch-ui.playing #touch-actions{padding:5px}body.touch-ui.playing #touch-hint{padding:2px;font-size:10px}body.touch-ui.playing #touch-actions button{min-height:45px}body.touch-ui.playing #touch-actions .touch-deploy-list button{min-height:32px}body.touch-ui.playing #players-hud .hud-player{max-height:calc(100dvh - 160px)}}
/* Thumb layout: transparent surfaces, no backdrop blur or large compositing layers. */
body.touch-ui.playing #touch-controls:not([hidden]){left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));max-height:42dvh}
body.touch-ui.playing #touch-actions{background:transparent;border:0;box-shadow:none;padding:0;pointer-events:none}
body.touch-ui.playing #touch-actions button,body.touch-ui.playing .touch-tools button,body.touch-ui.playing .masthead button,body.touch-ui.playing .masthead #upgrades{background:rgba(241,240,229,.42);color:#163b32;border:1px solid #3152478c;box-shadow:0 1px 2px #0002;text-shadow:0 1px 2px #fff9;pointer-events:auto}
body.touch-ui.playing #touch-actions button.selected{background:#e9c96766!important;outline:2px solid #c49e3e;color:#183b30}
body.touch-ui.playing #touch-actions button[data-touch="place"]{background:#76c88c66;min-width:0}
body.touch-ui.playing .masthead,body.touch-ui.playing.wide-match .masthead{background:#f1f0e533;border-color:#31524744;box-shadow:none}
body.touch-ui.playing #touch-hint{background:#f1f0e54d;color:#163b32;text-shadow:0 1px 2px #fff9;font-weight:650}
body.touch-ui.playing .touch-commander,body.touch-ui.playing .touch-deploy-label{background:#f1f0e54d;pointer-events:auto}
body.touch-ui.playing #touch-controls select{background:#f1f0e580}
body.touch-ui.playing #touch-controls:is([data-phase="hq"],[data-phase="build"],[data-phase="artillery"]) #touch-actions{display:grid;grid-template-columns:minmax(104px,124px) minmax(0,1fr) minmax(128px,156px);align-items:end;overflow:visible;gap:7px}
body.touch-ui.playing #touch-actions .touch-commander,body.touch-ui.playing #touch-actions .touch-deploy-list{grid-column:1/-1;min-width:0}
body.touch-ui.playing #touch-actions .touch-commander{justify-self:center;max-width:160px}
body.touch-ui.playing #touch-actions .touch-nudge{grid-column:1;display:grid;grid-template-columns:1fr 1fr;gap:6px;align-self:end;pointer-events:none}
body.touch-ui.playing #touch-actions .touch-nudge button{width:100%;height:56px;min-height:56px;font-size:30px;padding:0;touch-action:none;user-select:none;-webkit-user-select:none}
body.touch-ui.playing #touch-actions .touch-build-actions{grid-column:3;min-width:0;display:grid;grid-template-columns:1fr 1fr;gap:6px;pointer-events:none}
body.touch-ui.playing #touch-actions .touch-build-actions button{min-width:0;min-height:44px;font-size:11px;padding:5px}
body.touch-ui.playing #touch-actions .touch-build-actions button[data-touch="place"],body.touch-ui.playing #touch-actions .touch-build-actions button[data-touch="rotate"]{grid-column:1/-1;min-height:52px;font-size:16px}
body.touch-ui.playing #touch-actions .touch-build-actions button[data-touch="adjust"]{grid-row:3}
@media(orientation:landscape) and (max-height:550px){body.touch-ui.playing #touch-controls:not([hidden]){left:max(8px,env(safe-area-inset-left));bottom:48px;max-height:60dvh}body.touch-ui.playing #touch-actions .touch-nudge button{height:48px;min-height:48px}body.touch-ui.playing #touch-actions .touch-build-actions button[data-touch="rotate"],body.touch-ui.playing #touch-actions .touch-build-actions button[data-touch="place"]{min-height:44px}body.touch-ui.playing .touch-tools{flex-direction:row;top:90px;width:auto}body.touch-ui.playing .touch-tools button{width:44px;min-height:36px}body.touch-ui.playing #touch-actions .touch-deploy-list{max-width:70%;justify-self:center}}
body.touch-ui.playing .masthead button,body.touch-ui.playing .masthead #upgrades{background:rgba(241,240,229,.42)!important}
