@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
*{box-sizing:border-box}body{margin:0;background:#101a20;color:#ebeee9;font:14px 'DM Sans',sans-serif}main{max-width:1440px;margin:auto;padding:28px 5vw}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer;font:inherit;border:0}header{display:flex;align-items:center;gap:24px;border-bottom:1px solid #334047;padding-bottom:24px}.brand{font:700 20px 'Space Grotesk',sans-serif;letter-spacing:2px;color:#f4b576;text-decoration:none}.tag{font-size:10px;letter-spacing:2px;color:#8b9b9f}.quiet{margin-left:auto;background:transparent;border:1px solid #4a565d;color:#c6d0cf;padding:10px 16px;border-radius:8px}.intro{display:flex;justify-content:space-between;align-items:center;padding:32px 0 24px}.eyebrow{font-size:10px;letter-spacing:2.5px;color:#b3a28b}h1{font:500 clamp(28px,4vw,48px) 'Space Grotesk',sans-serif;margin:8px 0}h1 em{color:#edb47f;font-style:normal}.intro>p{line-height:1.8;color:#a6b3b6}.arena{position:relative;border-radius:16px;overflow:hidden;background:#273a42;border:1px solid #48545a}.scoreboard{display:flex;justify-content:space-between;gap:24px;padding:23px 28px;background:#18272ce8}.player{width:30%;opacity:.5;transition:opacity .3s}.player.active{opacity:1}.player>div:first-child{display:flex;justify-content:space-between;font-size:11px;letter-spacing:1px;color:#ffd4a5}.player.blue>div:first-child{color:#b6dfed}.health{height:5px;background:#ffffff18;border-radius:6px;margin-top:12px}.health i{display:block;width:100%;height:100%;background:#edaa70;transition:width .4s;border-radius:6px}.blue .health i{background:#84c8e0}.round{text-align:center;display:grid;gap:6px}.round span{font-size:9px;letter-spacing:2px;color:#9dafb5}.round b{font-size:13px}canvas{display:block;width:100%;aspect-ratio:1200/560}.scene-label{position:absolute;bottom:15px;left:24px;right:24px;display:flex;justify-content:space-between;font-size:8px;letter-spacing:2px;color:#b9bca9;pointer-events:none}.controls{display:grid;grid-template-columns:1.25fr 1fr 1fr .9fr;gap:30px;align-items:center;padding:26px 0;border-bottom:1px solid #334047}.status{display:flex;gap:12px;align-items:flex-start}.dot{width:8px;height:8px;border-radius:50%;background:#edaa70;margin-top:5px}.status p{color:#9caeb3;font-size:12px;line-height:1.6;margin:7px 0 0}label{font-size:10px;letter-spacing:1.5px}output{float:right;font:500 19px 'Space Grotesk',sans-serif;letter-spacing:0}input{display:block;width:100%;accent-color:#edaa70;margin:14px 0 9px;cursor:pointer}label>span{display:block;font-size:8px;color:#7e9299;letter-spacing:1px}small{float:right;font-size:inherit}#fire,#again{background:#edb47f;color:#182329;padding:19px 22px;border-radius:9px;font-weight:700;font-size:12px;letter-spacing:1px}#fire span{float:right;font-size:20px}button:disabled{opacity:.45;cursor:default}button:focus-visible,input:focus-visible{outline:3px solid #fff;outline-offset:4px}footer{display:flex;justify-content:space-between;gap:24px;padding:22px 0;color:#7f949c;font-size:11px;line-height:1.7}footer b{color:#bcc7c8}.winner{position:absolute;inset:0;background:#111e29c9;display:flex;align-items:center;justify-content:center;flex-direction:column;backdrop-filter:blur(6px)}.winner[hidden]{display:none}.winner p{font-size:11px;letter-spacing:3px;color:#edb47f}.winner h2{font:500 50px 'Space Grotesk',sans-serif;margin:10px 0 28px}@media(max-width:750px){main{padding:18px 4vw}.tag{display:none}.intro{padding:24px 0 16px}.intro>p{display:none}.scoreboard{padding:16px 12px;gap:10px}.player{width:33%}.player>div:first-child{font-size:8px;letter-spacing:0}.round b{font-size:11px}.controls{grid-template-columns:1fr 1fr;gap:22px}.status{grid-column:1/-1}#fire{grid-column:1/-1}footer{flex-direction:column;gap:7px}.scene-label{font-size:6px;left:12px;right:12px}.winner h2{font-size:32px}}

.online-panel{display:flex;gap:12px;align-items:center;flex-wrap:wrap;background:#1b2a30;padding:18px;border-radius:12px;margin-bottom:18px}.online-panel>div{flex:1;min-width:200px}.online-panel p{color:#9caeb3;font-size:12px;margin:7px 0 0}.online-panel button{padding:12px;border-radius:7px;background:#344a52;color:#ecf0ed}.online-panel input{width:130px;background:#101a20;border:1px solid #52636a;border-radius:7px;color:white;padding:12px;margin:0;font:inherit;text-transform:uppercase}.online-panel button[hidden]{display:none}

[hidden]{display:none!important}.mode-menu{margin-bottom:22px;padding:28px;background:linear-gradient(130deg,#263a40,#18272c);border:1px solid #4a5a5e;border-radius:16px}.mode-menu h2{font:500 30px 'Space Grotesk',sans-serif;margin:10px 0 24px}.mode-options{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.mode-options button{text-align:left;background:#111f2690;color:#e9ede8;border:1px solid #54656a;border-radius:12px;padding:24px;transition:background .2s,transform .2s}.mode-options button:hover{background:#3b4d4f;transform:translateY(-3px)}.mode-options span{color:#ddae82;font-size:9px;letter-spacing:2px}.mode-options strong{display:block;font:500 20px 'Space Grotesk',sans-serif;margin:20px 0 12px}.mode-options p{color:#a6b8bd;line-height:1.7;min-height:42px}.mode-options i{font-style:normal;color:#eac19a}.intro{padding-top:22px}@media(max-width:750px){.mode-options{grid-template-columns:1fr}.mode-options button{padding:18px}.mode-options strong{margin-top:10px}.mode-options p{min-height:0}.mode-menu{padding:20px}}

.movement{display:flex;gap:26px;padding:20px 0;border-bottom:1px solid #334047;align-items:center;flex-wrap:wrap}.movement>div:first-child{flex:1;min-width:220px}.movement b{font-size:10px;letter-spacing:1.5px}.movement p{color:#97acb3;font-size:11px;line-height:1.7;margin:7px 0 0}.move-player span{display:block;font-size:10px;letter-spacing:1px;margin-bottom:9px}.move-player small{margin-left:20px;color:#b8bfba}.move-player button{background:#30464d;color:#eed5b4;font-size:22px;border-radius:6px;padding:5px 19px;margin-right:5px}.move-player:last-child button{color:#a5dcea}

.name-fields{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:22px}.name-fields label{min-width:190px;flex:1}.name-fields input,.online-name input{background:#101e25;border:1px solid #53676e;color:#f4e8d9;border-radius:7px;font:16px 'DM Sans',sans-serif;padding:12px;margin:9px 0 0}.name-fields p{font-size:11px;color:#97a9b0}.credits{color:#c2b097}.online-name{letter-spacing:0}.online-name input{text-transform:none;width:145px}header{flex-wrap:wrap;gap:12px}#sound-toggle{margin-left:auto}#menu-button,#reset{margin-left:0}

#game{touch-action:none;user-select:none;-webkit-user-select:none;cursor:crosshair}.touch-hint{position:absolute;top:102px;left:50%;transform:translateX(-50%);background:#102029bb;color:#fff1d7;padding:8px 13px;border:1px solid #ffffff24;border-radius:24px;pointer-events:none;font-size:10px;white-space:nowrap;z-index:1}.move-player button{min-width:48px;min-height:44px}input[type=range]{height:26px}#fire{min-height:56px}@media(max-width:750px){.touch-hint{top:80px;font-size:8px;padding:6px 10px}}

/* Adapt the play area to the current viewport, including mobile browser chrome. */
html{min-height:100%;background:#101a20}body{min-height:100svh}main{max-width:none;width:100%;padding:16px clamp(10px,2vw,28px)}body.playing main{min-height:100svh;height:100dvh;display:flex;flex-direction:column;gap:8px;padding:max(8px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}body.playing header{flex:none;padding-bottom:8px;gap:10px}body.playing .intro,body.playing footer{display:none}body.playing .arena{flex:1;min-height:220px;display:flex;flex-direction:column;border-radius:10px;background:#0c171e}body.playing .scoreboard{flex:none;padding:12px 18px}body.playing #game{flex:1;min-height:0;width:100%;height:100%;aspect-ratio:auto;object-fit:contain}body.playing .movement{flex:none;padding:8px 0;gap:18px}body.playing .movement p{margin-top:4px}body.playing .controls{flex:none;padding:8px 0;gap:18px}body.playing .touch-hint{top:76px}body.playing .online-panel{flex:none;margin-bottom:0;padding:10px}.player b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player>div:first-child{gap:8px}.player>div:first-child>span{white-space:nowrap}#fullscreen{margin-left:auto}#sound-toggle{margin-left:0}body.expanded main{padding:6px}body.expanded .tag{display:none}
@media(max-width:750px){body.playing .brand{font-size:15px;letter-spacing:1px}body.playing header{gap:6px}body.playing .quiet{font-size:11px;padding:9px 10px;min-height:40px}body.playing .scoreboard{padding:10px 10px}body.playing .touch-hint{top:67px}body.playing .movement{gap:12px}body.playing .movement>div:first-child{min-width:100%;}body.playing .movement p{display:none}body.playing .move-player{flex:1}body.playing .move-player span{margin-bottom:4px}body.playing .controls{gap:8px 16px}body.playing .status{gap:8px}body.playing .status p{margin:2px 0;font-size:10px}body.playing #fire{min-height:44px;padding:12px}body.playing input[type=range]{margin:8px 0 4px}body.playing .arena{min-height:220px}}
@media(max-height:600px) and (min-width:650px){body.playing .brand{font-size:15px}body.playing header{padding-bottom:4px}body.playing .quiet{padding:7px 10px}body.playing .movement>div:first-child,body.playing .status,body.playing .tag,body.playing .touch-hint{display:none}body.playing .movement{padding:4px 0;gap:20px;justify-content:center}body.playing .move-player{display:flex;gap:8px;align-items:center}body.playing .move-player span{margin:0}body.playing .move-player button{min-height:38px;font-size:18px}body.playing .controls{grid-template-columns:1fr 1fr .6fr;gap:20px;padding:4px 0}body.playing .controls label>span{display:none}body.playing #fire{grid-column:auto;min-height:42px;padding:12px}body.playing .arena{min-height:150px}body.playing .scoreboard{padding:7px 12px}body.playing .health{margin-top:6px}body.playing .round{gap:3px}body.playing main{gap:4px}}

.career-summary{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:15px;margin-bottom:20px;background:#0d1a21;border-radius:9px}.career-summary a{color:#f2bb85}.career-summary b{font-size:12px}.career-summary span{font-size:11px;color:#a7bdc5}.loadout-panel{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:12px 0}.loadout-panel label{min-width:160px}.loadout-panel select{display:block;background:#263b43;color:#fff0da;border:1px solid #62777e;border-radius:6px;padding:10px;margin-top:5px;width:100%;font:14px 'DM Sans',sans-serif}.loadout-panel>span{flex:1;color:#adbdc0;font-size:11px}.loadout-panel>b{font-size:10px;color:#e8bd8f}.playing .loadout-panel{flex:none;padding:4px 0}.playing .loadout-panel select{padding:7px}.playing .loadout-panel label{font-size:9px}.playing #weapon-description{display:none}dialog{width:min(860px,95vw);max-height:90dvh;overflow:auto;background:#152831;border:1px solid #667c86;color:#edf0e9;border-radius:16px;padding:24px}dialog::backdrop{background:#061019cc}#career-close{float:right}dialog h2{font:500 30px 'Space Grotesk',sans-serif}dialog p{color:#a9bec6;line-height:1.6}#armory-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}#armory-list article{background:#253c46;padding:15px;border-radius:9px}#armory-list h4{margin:0 0 8px}#armory-list p{font-size:12px;margin:6px 0}.rank-table{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px;border-bottom:1px solid #48606a}td small{float:none;display:block;color:#8ca9b7;font-size:9px;overflow-wrap:anywhere}.playing header .brand{font-size:15px}.playing header .quiet{padding:8px 10px;font-size:11px}.playing header .tag{display:none}@media(max-height:600px){.playing .loadout-panel select{padding:4px}.playing .loadout-panel label{min-width:130px}.playing #match-type{display:none}}@media(max-width:600px){.loadout-panel label{min-width:0;flex:1}.loadout-panel>span{min-width:100%}.playing .loadout-panel{gap:10px}.playing #match-type{width:100%}}

/* Counter Battery main menu */
body:not(.playing) .intro,body:not(.playing) .arena,body:not(.playing) .movement,body:not(.playing) .controls,body:not(.playing) .loadout-panel,body:not(.playing) footer{display:none}body:not(.playing) header #menu-button,body:not(.playing) header #reset,body:not(.playing) header #sound-toggle,body:not(.playing) header #career-button,body:not(.playing) header #settings-button{display:none}body:not(.playing) main{padding:0;min-height:100svh}body:not(.playing) header{padding:18px 28px;border:none;position:absolute;left:0;right:0;top:0;z-index:2}.mode-menu{min-height:100svh;margin:0;border:0;border-radius:0;padding:105px clamp(22px,6vw,100px) 40px;background-image:linear-gradient(90deg,rgba(5,15,22,.92) 0%,rgba(5,15,22,.8) 30%,rgba(5,15,22,.2) 70%),url('/assets/menu.jpg');background-size:cover;background-position:center}.menu-shell{max-width:470px}.menu-title{font:700 clamp(46px,6vw,82px)/.95 'Space Grotesk',sans-serif;letter-spacing:-3px;margin:14px 0 22px}.menu-title em{color:#f0bd86;font-style:normal}.menu-subtitle{color:#becbc9;line-height:1.7;font-size:15px;margin-bottom:22px}.mode-options{display:flex;flex-direction:column;gap:8px}.mode-options button{display:flex;align-items:center;gap:18px;min-height:60px;padding:15px 18px;background:#14262bc4;backdrop-filter:blur(8px);border:1px solid #71817d66;border-radius:6px}.mode-options button:hover{background:#aa794c70;transform:translateX(5px);border-color:#efbd86}.mode-options span{font-size:10px;min-width:22px;color:#d3ac80}.mode-options strong{font:500 18px 'Space Grotesk',sans-serif;margin:0;flex:1}.mode-options i{color:#e4bb91}.career-summary{padding:12px;background:#101e2499;border:1px solid #71817d33;border-radius:6px;gap:7px;line-height:1.6;margin-bottom:18px}.career-summary b{font-weight:400;font-size:11px}.career-summary a{font-size:11px}.menu-note{font-size:9px;color:#b0b6a7;letter-spacing:2px;margin-top:23px}.settings-controls{display:grid;gap:22px;margin:24px 0}.setting-switch{display:flex;align-items:center;gap:12px;font-size:14px;letter-spacing:0}.setting-switch input{width:20px;height:20px;margin:0}.settings-controls>button{justify-self:start}.settings-controls label output{float:right}.settings-controls input[type=range]{width:100%}#settings-dialog .name-fields{margin-top:20px}#settings-dialog h3{border-top:1px solid #425a63;padding-top:20px}.playing .menu-title{display:none}@media(max-width:600px){.mode-menu{padding:92px 20px 28px;background-position:65% center;background-image:linear-gradient(90deg,#051018e8,#051018b0),url('/assets/menu.jpg')}.menu-shell{max-width:420px}.menu-title{font-size:58px}.mode-options button{min-height:54px}.mode-options strong{font-size:16px}body:not(.playing) header{padding:16px 20px}.brand{font-size:15px;letter-spacing:1px}}

#battlefield-banner{position:fixed;top:25%;left:50%;transform:translateX(-50%);z-index:100;background:#142129ed;border:1px solid #d5ae6d;border-radius:12px;padding:24px 32px;color:#ffe5b0;font-size:clamp(18px,3vw,30px);text-align:center;pointer-events:none;box-shadow:0 12px 40px #0008}#battlefield-banner[hidden]{display:none}.commander-emblem{display:inline-block;background:#253b43;border:1px solid #a8915c;border-radius:7px;padding:8px 12px;margin:5px}#commander-name-dialog{max-width:440px}#commander-name-input{width:100%;margin:12px 0}#commander-name-error{color:#ffad8a}

.menu-shell{max-width:880px}.mode-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.mode-options button{min-height:90px;padding:20px;border-radius:10px}.mode-options strong{font-size:21px}.mode-options strong small{display:block;margin-top:9px;font-size:12px;line-height:1.5;font-weight:400;color:#d0dcda}#mode-online{background:linear-gradient(120deg,#784d29e8,#243639e8);border-color:#d0a06a}#menu-invitations{background:linear-gradient(120deg,#254a4ae8,#173039e8);border-color:#78aaaa}#menu-armoury{border-color:#bc9f61}#menu-invitation-count{display:inline-flex;align-items:center;justify-content:center;min-width:25px;height:25px;margin-left:9px;border-radius:50%;background:#edbf79;color:#17232b;font-size:13px}#awards-dialog{width:min(850px,90vw);max-height:85svh;overflow:auto}#awards-content{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}#awards-content article{border:1px solid #6c7f77;border-radius:10px;padding:16px;background:#182b32}#awards-content h3{color:#edc58b;margin-top:0}#awards-content p{line-height:1.65}#computer-loadout-dialog{max-width:520px}#computer-weapon{width:100%;margin:14px 0 24px}@media(max-width:650px){.mode-options,#awards-content{grid-template-columns:1fr}.mode-options button{min-height:76px}.mode-options strong{font-size:18px}}

.armoury-tabs{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0}.armoury-tabs button{padding:12px 17px;background:#1c333d;border:1px solid #627c7e;color:#f7e8c7}.armoury-tabs button[aria-pressed=true]{background:#a5783e;color:#fff}.armoury-weapon-picture{display:block;width:100%;height:155px;object-fit:contain;background:radial-gradient(#36505c,#132630);border-radius:8px;margin-bottom:16px}.armoury-badge-picture{display:block;height:110px;width:110px;object-fit:contain;margin:0 auto 14px}.award-earned{color:#ebc477;display:block}.award-locked{color:#a1adb0;display:block}.commander-emblem{display:inline-flex;flex-direction:column;align-items:center;min-width:115px}.commander-emblem img{width:70px;height:82px;object-fit:contain}#career-emblems{display:flex;flex-wrap:wrap;gap:7px}

/* Command-board menu, with explicit focus/contrast states. */
.mode-menu{position:relative;background-image:linear-gradient(100deg,#081613f2 0%,#0e211ddd 45%,#07152282 100%),url('/assets/menu.jpg');padding:104px clamp(20px,5vw,85px) 48px;background-attachment:fixed}.menu-shell{max-width:960px;padding:30px;background:linear-gradient(135deg,#152820b3,#0d1c25bd);border:1px solid #99a57855;border-top:3px solid #bcaa71;box-shadow:0 24px 70px #020a1099,inset 0 0 0 5px #15231a66;position:relative}.command-heading{display:flex;align-items:center;gap:12px;border-bottom:1px solid #b1a77b55;padding-bottom:15px}.command-insignia{display:inline-flex;align-items:center;justify-content:center;width:36px;height:40px;border:1px solid #cbbd87;color:#e1d2a0;font-size:26px;clip-path:polygon(0 0,100% 0,100% 78%,50% 100%,0 78%)}.command-heading .eyebrow{font-family:monospace;font-size:11px;letter-spacing:2px;color:#d6d3af;margin:0}.command-stamp{margin-left:auto;font:10px monospace;color:#bcbe9d;border:1px solid #b7b68a80;padding:6px 9px;transform:rotate(-4deg);white-space:nowrap}.menu-title{font-family:'Arial Black',Impact,sans-serif;font-weight:900;letter-spacing:1px;font-size:clamp(43px,6vw,78px);text-shadow:0 4px 0 #030e1299;margin:24px 0 15px;color:#e9eddd}.menu-title em{color:#d7bf82}.menu-subtitle{color:#cbd2c5;font-size:15px;line-height:1.65}.command-divider{display:flex;align-items:center;gap:12px;margin:22px 0 18px;color:#c5c8a9;font:11px monospace;letter-spacing:2px}.command-divider:after{content:'';height:1px;background:#a2ab8355;flex:1}.career-summary{background:#091913b8;border:1px solid #aab68b44;border-left:3px solid #9fae77;border-radius:2px;padding:15px}.career-summary b{font-size:13px;color:#e3e8d9}.career-summary a{font-size:13px;border:1px solid #b0b99566;border-radius:3px;padding:6px 10px}.mode-options{gap:14px}.mode-options button{position:relative;min-height:102px;padding:20px;background:linear-gradient(135deg,#354638e8,#182b28f2);border:1px solid #8a9c7866;border-radius:3px;border-left:4px solid #a8b283;box-shadow:0 6px 16px #020b1466,inset 0 1px 0 #d5dec01c;transition:transform .16s,background .16s,box-shadow .16s}.mode-options button:before,.mode-options button:after{content:'';position:absolute;width:5px;height:5px;border-radius:50%;background:#9aa58b77;right:8px;box-shadow:inset 0 1px 2px #0008}.mode-options button:before{top:8px}.mode-options button:after{bottom:8px}.mode-options button:hover{transform:translateY(-2px);background:linear-gradient(135deg,#4d6046,#223b35);box-shadow:0 9px 21px #020b14a6;border-color:#d3c79a}.mode-options button:active{transform:translateY(1px)}.mode-options button:focus-visible{outline:3px solid #ffe0a0;outline-offset:4px}.mode-options button>span{display:inline-flex;width:37px;height:37px;align-items:center;justify-content:center;flex-shrink:0;font:700 13px monospace;color:#ded9af;border:1px solid #b9c19870;background:#07181366;min-width:37px}.mode-options strong{font-family:'Arial Narrow',Arial,sans-serif;font-size:21px;font-weight:700;letter-spacing:.3px;color:#f1f3e7}.mode-options strong small{font:12px/1.5 Arial,sans-serif;letter-spacing:0;color:#c6d1c4}.mode-options i{font-size:23px;color:#d9c48e;margin-right:5px}#mode-online{background:linear-gradient(125deg,#7e6034e8,#394732f2);border-color:#c7af7388;border-left-color:#e3c47d}#menu-invitations{background:linear-gradient(125deg,#365751ed,#1b343bee);border-left-color:#9cc5b1}#menu-armoury{background:linear-gradient(125deg,#544b32ed,#29372eee);border-left-color:#d4bc83}.menu-note{font:10px monospace;letter-spacing:2px;border-top:1px solid #b7be9655;padding-top:21px;display:flex;justify-content:space-between;color:#bac3a9}body:not(.playing) header{background:#071510c9;border-bottom:1px solid #9baf6c44}.command-heading,.mode-options button,.career-summary{backdrop-filter:blur(6px)}@media(max-width:650px){.mode-menu{padding:94px 14px 25px;background-attachment:scroll}.menu-shell{padding:20px 16px}.command-stamp{display:none}.command-heading .eyebrow{font-size:9px;letter-spacing:1px}.menu-title{font-size:52px}.mode-options button{min-height:89px;padding:16px 14px}.mode-options strong{font-size:19px}.menu-note{font-size:8px;letter-spacing:1px}}@media(prefers-reduced-motion:reduce){.mode-options button{transition:none}.mode-options button:hover{transform:none}}

/* Press feedback for touch, mouse and keyboard; reduced motion stays still. */
button{transition:transform .12s ease,filter .12s ease,box-shadow .12s ease}
button:active:not(:disabled){transform:translateY(2px) scale(.97);filter:brightness(1.2)}
button.button-pressed{animation:command-press .26s ease}
@keyframes command-press{0%,100%{filter:brightness(1);transform:scale(1)}40%{filter:brightness(1.35);transform:translateY(2px) scale(.96)}}
.battle-prompt{width:min(620px,94vw);margin:auto;text-align:center;border:2px solid #d8b674;box-shadow:0 20px 100px #000b;background:linear-gradient(145deg,#253a3f,#0d1c24);padding:clamp(20px,4vw,36px)}
.battle-prompt h2{color:#ffe0a1;margin:8px 0 20px}.prompt-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.battle-prompt button{min-height:48px;padding:14px 24px;border-radius:9px;background:#e7ba73;color:#102027;font-weight:700}.battle-prompt button.quiet{margin:0;background:#172a32;color:#f1e7d2}
#battle-award-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:20px 0}#battle-award-list article{display:grid;justify-items:center;gap:12px;background:#07151b88;border:1px solid #b89a5866;border-radius:12px;padding:18px;animation:award-arrive .4s ease-out}#battle-award-list img{width:100px;height:100px;object-fit:contain;filter:drop-shadow(0 4px 10px #eab96144)}#battle-award-list strong{font-size:16px;color:#ffdc9c}@keyframes award-arrive{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}
#invitations-dialog{margin:auto;width:min(640px,94vw);border:2px solid #ddb96f;box-shadow:0 15px 100px #000a}#invitations-dialog article{padding:18px;margin:14px 0;background:#233b44;border:1px solid #667f82;border-radius:12px}#invitations-dialog article p{font-size:20px;color:#ffdfac}#invitations-dialog article button{padding:14px 20px;margin:4px;border-radius:8px;background:#e7ba73;color:#15232a;font-weight:700}
@media(prefers-reduced-motion:reduce){button,button.button-pressed,#battle-award-list article{animation:none;transition:none}button:active:not(:disabled){transform:none;filter:brightness(1.25)}}

/* Battle essentials; secondary actions live in the options dialog. */
#battle-options-button{display:none}body.playing #battle-options-button{display:inline-block}
body.playing header{position:static;display:flex;flex-wrap:wrap;gap:8px;padding:6px 0}body.playing header .tag,body.playing #career-button,body.playing #fullscreen,body.playing #sound-toggle,body.playing #reset{display:none}body.playing header .quiet{margin:0;min-height:40px}body.playing header .brand{margin-right:auto}body.playing #invitations-button{font-size:12px}body.playing .scene-label,body.playing .touch-hint{display:none}
body.playing .controls{grid-template-columns:1fr 1fr minmax(110px,.65fr);gap:12px;padding:8px 0}body.playing .controls .status{grid-column:1/-1;min-height:18px}body.playing .controls .status b,body.playing .controls .status .dot{display:none}body.playing .controls .status p{margin:0;font-size:12px}body.playing #fire{grid-column:auto;min-height:48px}body.playing .controls label>span{display:none}body.playing .loadout-panel{gap:10px;padding:5px 0}body.playing .loadout-panel label{flex:1;min-width:120px}body.playing #match-type{display:none}#battle-options-dialog .online-panel{display:flex;flex-wrap:wrap;margin:18px 0}#battle-options-dialog .online-panel[hidden]{display:none}#battle-options-dialog .movement{display:flex;flex-wrap:wrap;padding:18px 0}#battle-options-dialog .movement>div:first-child{width:100%}#battle-equipment{display:flex;gap:10px;flex-wrap:wrap}#battle-equipment .quiet{margin:0}.build-label{font-size:11px;opacity:.7;border-top:1px solid #45606a;padding-top:16px}
@media(max-width:650px){body.playing header .brand{width:100%;font-size:15px}body.playing header{justify-content:space-between}body.playing header .quiet{font-size:11px;padding:9px 11px}body.playing .controls{grid-template-columns:1fr 1fr;gap:8px}body.playing #fire{grid-column:1/-1}body.playing .scoreboard{padding:9px}body.playing .round b{font-size:11px}body.playing .player>div:first-child{letter-spacing:0;font-size:9px}body.playing .arena{min-height:160px}}

/* Compact chrome, generous battlefield, clear raised controls. */
body.playing main{padding:max(4px,env(safe-area-inset-top)) max(6px,env(safe-area-inset-right)) max(4px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left));gap:4px}body.playing header{flex-wrap:nowrap;padding:3px 0;gap:7px}body.playing header .brand{width:auto;flex:1;font-size:14px;letter-spacing:1px}body.playing header .quiet{padding:9px 13px;min-height:42px;font-size:12px;font-weight:700;color:#fff0c9;border:1px solid #a99b6d;background:linear-gradient(#405447,#22372f);box-shadow:inset 0 1px 0 #ffffff30,0 2px 0 #06150d;border-radius:7px;white-space:nowrap}body.playing #invitations-button{background:linear-gradient(#426875,#25444f);border-color:#8dbbca}body.playing #menu-button{background:linear-gradient(#78613e,#4b3c26);border-color:#c7a269}body.playing .scoreboard{padding:8px 14px}body.playing .health{margin-top:7px}body.playing .controls{padding:4px 0;gap:5px 14px;border:0}body.playing .controls .status{min-height:14px}body.playing .controls .status p{font-size:11px}body.playing .loadout-panel{padding:2px 0}body.playing .loadout-panel select{padding:6px;min-height:34px;margin-top:3px}body.playing input[type=range]{margin:6px 0 3px}body.playing .arena{border-radius:6px}
#invitations-dialog article button{min-height:54px;min-width:155px;font-size:16px;border:2px solid #94c49b;box-shadow:inset 0 1px 0 #ffffff44,0 4px 0 #071512;transition:filter .12s,transform .12s}#invitations-dialog article .invite-accept{background:linear-gradient(#74ba86,#39794e);color:#fff;border-color:#aae7b7;animation:invite-ready 2s ease-in-out infinite}#invitations-dialog article .invite-decline{background:linear-gradient(#855754,#593331);color:#fff1e5;border-color:#c49084}#invitations-dialog article button:hover{filter:brightness(1.2)}#invitations-dialog article button:active{transform:translateY(3px) scale(.97);box-shadow:0 1px 0 #071512}#invitations-dialog article button.button-pressed{animation:command-press .26s ease}#invitations-dialog article button:disabled{animation:none;opacity:.55}@keyframes invite-ready{0%,100%{box-shadow:inset 0 1px 0 #ffffff44,0 4px 0 #071512,0 0 0 0 #8ed3a000}50%{box-shadow:inset 0 1px 0 #ffffff44,0 4px 0 #071512,0 0 0 5px #8ed3a026}}.setting-help{font-size:12px;margin:-12px 0 0}
@media(max-width:650px){body.playing header{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}body.playing header .brand{display:none}body.playing header .quiet{font-size:10px;padding:8px 3px;min-height:42px;letter-spacing:0}body.playing #invitations-button{font-size:10px}body.playing .controls{grid-template-columns:1fr 1fr .7fr;gap:4px 9px}body.playing #fire{grid-column:auto;padding:12px 8px;font-size:11px}body.playing .scoreboard{padding:7px}body.playing .arena{min-height:140px}body.playing output{font-size:16px}}
@media(prefers-reduced-motion:reduce){#invitations-dialog article button,#invitations-dialog article button.button-pressed{animation:none;transition:none}#invitations-dialog article button:active{transform:none}}
#call-air-support{position:absolute;top:70px;left:50%;transform:translateX(-50%);z-index:4;background:linear-gradient(#dc9d35,#9d5622);color:#fff5d8;border:2px solid #ffe9a0;border-radius:9px;padding:12px 20px;font-weight:800;box-shadow:0 3px 20px #0009;animation:support-ready 1.25s ease-in-out infinite;max-width:90%;min-height:46px}#call-air-support[hidden]{display:none}#call-air-support:disabled{animation:none;background:#4b5757}#call-air-support:active{transform:translateX(-50%) scale(.97)}@keyframes support-ready{0%,100%{filter:brightness(1);box-shadow:0 3px 20px #0009}50%{filter:brightness(1.3);box-shadow:0 0 22px #ffc95588}}@media(prefers-reduced-motion:reduce){#call-air-support{animation:none}}

/* Fit the command menu into a single screen at common phone/tablet/desktop sizes. */
body:not(.playing) main{height:100dvh;min-height:0;overflow:hidden}body:not(.playing) header{padding:8px 16px;min-height:44px}body:not(.playing) .mode-menu{height:100dvh;min-height:0;padding:54px 18px 12px;display:flex;align-items:center;justify-content:center;background-attachment:scroll}body:not(.playing) .menu-shell{width:min(100%,980px);max-width:980px;max-height:100%;padding:16px 20px;display:flex;flex-direction:column;gap:8px;min-height:0}body:not(.playing) .command-heading{padding-bottom:6px;flex-shrink:0}body:not(.playing) .command-insignia{width:25px;height:28px;font-size:20px}body:not(.playing) .menu-title{font-size:clamp(28px,4vw,42px);line-height:1.05;letter-spacing:1px;margin:0;flex-shrink:0}body:not(.playing) .menu-title br{display:none}body:not(.playing) .menu-title em{margin-left:8px}body:not(.playing) .menu-subtitle{font-size:12px;line-height:1.4;margin:0}body:not(.playing) .menu-subtitle br{display:none}body:not(.playing) .command-divider{margin:0;font-size:10px}body:not(.playing) .career-summary{margin:0;padding:8px 10px;gap:6px 12px;flex-shrink:0}body:not(.playing) .career-summary b{font-size:11px}body:not(.playing) .career-summary span{font-size:10px}body:not(.playing) .mode-options{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;min-height:0}body:not(.playing) .mode-options button{padding:10px 12px;min-height:64px;display:flex;align-items:center;gap:10px;box-shadow:0 3px 9px #020b1466}body:not(.playing) .mode-options strong{font-size:16px;margin:0;line-height:1.15}body:not(.playing) .mode-options strong small{font-size:10px;line-height:1.25;display:block;margin-top:3px;float:none}body:not(.playing) .mode-options button>span{width:26px;height:28px;min-width:26px;font-size:11px}body:not(.playing) .mode-options i{font-size:17px;margin-left:auto}body:not(.playing) .menu-note{display:none}.studio-brand{text-align:center;margin:2px 0 0;font:700 11px 'Space Grotesk',sans-serif;letter-spacing:3px;color:#e5cf93;flex-shrink:0}
/* The battle stays within the viewport; dialogs alone may scroll. */
body.playing{height:100dvh;overflow:hidden;overscroll-behavior:none;touch-action:none}body.playing main{height:100dvh;min-height:0;max-height:100dvh;overflow:hidden}body.playing dialog{touch-action:pan-y;overscroll-behavior:contain}body.playing .arena{min-height:0}body.playing .controls,body.playing .loadout-panel,body.playing header{flex-shrink:0}
@media(max-width:650px){body:not(.playing) header .brand{font-size:13px}body:not(.playing) .mode-menu{padding:51px 10px 10px}body:not(.playing) .menu-shell{padding:12px;gap:7px}body:not(.playing) .mode-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}body:not(.playing) .mode-options button{min-height:61px;padding:8px;gap:6px}body:not(.playing) .mode-options strong{font-size:14px}body:not(.playing) .mode-options i{display:none}body:not(.playing) .command-heading .eyebrow{font-size:8px;letter-spacing:1px}.studio-brand{font-size:10px;letter-spacing:2px}}
@media(max-height:600px){body:not(.playing) .mode-menu{padding-top:43px;padding-bottom:6px}body:not(.playing) .menu-shell{padding:8px 12px;gap:5px}body:not(.playing) .menu-subtitle,body:not(.playing) .command-divider,body:not(.playing) #career-progress{display:none}body:not(.playing) .menu-title{font-size:26px}body:not(.playing) .mode-options button{min-height:48px;padding:6px 9px}body:not(.playing) .mode-options strong{font-size:13px}body:not(.playing) .mode-options strong small{font-size:9px}body:not(.playing) .career-summary{padding:5px 8px}body:not(.playing) .command-heading{padding-bottom:4px}body:not(.playing) .command-stamp{display:none}body:not(.playing) .studio-brand{font-size:9px}}
@media(max-height:420px){body:not(.playing) .command-heading{display:none}body:not(.playing) .mode-options strong small{display:none}body:not(.playing) .mode-options button{min-height:44px}body:not(.playing) .career-summary{max-height:45px;overflow:auto}}
.studio-brand{display:flex;align-items:center;justify-content:center;gap:13px;padding:7px 16px;background:linear-gradient(#26362c,#10251d);border:1px solid #8e9862;border-top:2px solid #c3b77b;box-shadow:inset 0 0 0 3px #0b1d15,inset 0 0 0 4px #66764b55;font-family:Impact,'Arial Narrow',sans-serif;font-size:13px;letter-spacing:2px;color:#e3d5a4}.studio-brand span{font-size:17px;color:#c3b77b}.studio-brand strong{font-weight:400;text-shadow:0 2px 0 #071109}#commander-name-suggestions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.name-suggestion{padding:10px 16px;border:1px solid #a9bd88;border-radius:6px;color:#f6e4ad;background:#324a37}#leaderboard-close{float:right}.rank-badge{width:38px;height:45px;float:left;object-fit:contain;margin-right:10px}.rank-title{display:block;font-size:11px;color:#d3be82;margin-top:5px}#rank-guide{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px}#rank-guide p{display:flex;align-items:center;gap:10px;margin:0;padding:8px;background:#20363a;border-radius:8px}#rank-guide img{width:32px;height:40px}.rank-table{overflow:auto}#leaderboard-dialog td{vertical-align:middle;white-space:nowrap}@media(max-height:600px){.studio-brand{padding:4px 9px;font-size:10px}.studio-brand span{font-size:12px}}@media(max-width:650px){.studio-brand{font-size:11px;letter-spacing:1.5px;gap:8px}}