/* Command deck art direction. All controls remain live HTML over the battle canvas. */
:root{--bg:#070e19;--panel:#101f31;--border:#2c4358;--text:#eaf4ff;--muted:#98b1c6;--lime:#d3ef9b;--cyan:#74e0f4;--orange:#ffb270}
body{background:radial-gradient(ellipse at 50% -20%,#1c3952 0,transparent 64%),linear-gradient(145deg,#0a1725,#080e17 70%);font-size:14px;min-height:100svh}
.shell{max-width:1920px;padding:0 24px}.masthead{height:90px;border-bottom:1px solid #41637a70;position:relative}.masthead:after{content:'';position:absolute;bottom:-1px;left:0;width:190px;height:2px;background:linear-gradient(90deg,var(--cyan),transparent)}
.brand>svg{stroke:var(--cyan);filter:drop-shadow(0 0 9px #57d7f55c)}.brand>span{font-size:25px;letter-spacing:4px}.brand small{color:#97b6d1;font-size:10px;letter-spacing:2.3px}.header-status{color:#97b4c9}.signal{background:var(--cyan);box-shadow:0 0 12px #74e0f4}
.icon-button,.small-button{height:37px;min-width:38px;border-radius:3px;background:linear-gradient(#22394caa,#142535aa);border-color:#3c566c;box-shadow:inset 0 1px #c8ecff0a}.header-actions{gap:8px}
.command-grid{grid-template-columns:220px minmax(0,1fr) 244px;gap:18px;padding-top:22px}.left-panel,.right-panel{position:relative;padding:18px 14px;background:linear-gradient(135deg,#17304777,#101d2ee8 50%);border:1px solid #344e636b;border-top:2px solid #587b9280;box-shadow:inset 0 1px #d6f5ff08,0 10px 36px #0002;align-self:start;border-radius:3px}
.section-label{font-size:13px;font-weight:600;color:#c1d5e6;letter-spacing:1px;margin-bottom:12px}.section-label>span{color:var(--cyan);font-size:10px}.division{background:linear-gradient(90deg,#52718a66,transparent);margin:18px 0}
.level-button{height:48px;padding:6px 9px;gap:11px;border-radius:2px;border-bottom:1px solid #435a6a22}.level-button .number{font-size:24px;color:#5e7e98;width:26px}.level-button .level-text{font-size:13px}.level-button small{color:#809fb8;font-size:9px}.level-button.active{background:linear-gradient(90deg,#73d7f321,#73d7f305);border-color:#66c9e84d;border-left:3px solid var(--cyan)}.level-button.active .number,.level-button.active .level-text{color:#c5f4ff}.level-button:disabled{opacity:.42}
.build-list{gap:9px}.build-card{grid-template-columns:57px 1fr auto;min-height:91px;padding:8px;gap:7px;background:linear-gradient(130deg,#29435988,#152738);border:1px solid #47617788;border-radius:3px;overflow:hidden;position:relative;box-shadow:inset 0 1px #c7e8fa0b}.build-card:before{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:currentColor;opacity:.3}.build-card:hover{border-color:#82b6ce;background:#223e52}.build-card.active{border-color:var(--cyan);background:linear-gradient(130deg,#22556a,#132c40);box-shadow:inset 0 0 18px #6adeff0a,0 0 14px #49d9ef13}.build-card strong{font-size:13px}.build-card small{font-size:10px;color:#9eb9cd}.build-card .price{font-size:19px;color:#f5cd92}.build-card .price small{color:#789cb8;font-size:10px}.build-icon{width:57px;height:69px}.build-icon svg{width:48px;height:48px}.tower-art{width:66px;height:72px;background-image:url('./assets/combat/tower-cannon-v3.webp');background-repeat:no-repeat;background-size:300% 100%;filter:drop-shadow(0 5px 4px #0009);display:block}.tower-art.cannon{background-position:left center}.tower-art.flak{background-position:center}.tower-art.anchor{background-position:right center}
.mission-top{margin:0 0 17px;min-height:49px}h1{font-size:29px;letter-spacing:4px;font-weight:700;text-shadow:0 2px 16px #74c9ec20}.eyebrow{color:#80a6c3;font-size:10px;letter-spacing:1.9px}.mission-tags{gap:6px}.mission-tags span{background:#182f4280;border:1px solid #45678470;color:#a9c8dd;font-size:10px;border-radius:2px;padding:5px 7px}
.resource-bar{min-height:59px;padding:0 15px;background:linear-gradient(#213b50,#162b3c);border-color:#536d8580;border-top:2px solid #617e9299;box-shadow:inset 0 1px #e1f7ff11}.resource-bar>div{gap:8px;font-size:12px;color:#b4c9d8}.resource-bar>div+div{border-color:#55768b66;padding-left:15px}.resource-bar strong{font-size:28px;color:#eef8ff;font-weight:600;letter-spacing:1px}.resource-icon{font-size:24px;color:#ffbf78;text-shadow:0 0 10px #ffbd7150}.energy-icon{color:var(--cyan)}.core-icon{color:#acf0c9}.mini-meter{width:35px;height:4px}.mini-meter i{background:#98eac2}
.battlefield{border-color:#567b9470;background:#0f2332;aspect-ratio:5/3;max-height:none!important;box-shadow:0 0 0 4px #0c182080,0 14px 36px #0004}.battlefield:after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 38px #071321aa;border:1px solid #77c2e20c;z-index:1}.map-coordinate{color:#95bdcd;text-shadow:0 1px 3px #000;font-size:9px;letter-spacing:1.5px}.coord-top{top:15px;left:17px}.wave-notice{color:#bff3ff;padding:4px 7px;background:#0a1b2a99;border:1px solid #6fa7b52e;font-size:9px;top:10px;right:12px}.wave-bar{min-height:80px;background:linear-gradient(#1a3448,#102536);padding:15px;border-color:#536d8580;box-shadow:inset 0 -2px #49677b26}.wave-readout{gap:9px}.wave-readout strong{font-size:24px;color:#c4dfef}.wave-readout .eyebrow{font-size:11px}.wave-dots i{width:13px;height:5px}.primary-button{background:linear-gradient(135deg,#d4f2a5,#a8d06d);border-color:#d4f2a5;color:#17270d;border-radius:2px;box-shadow:inset 0 1px #efffcf88,0 3px 14px #95da5120;min-height:44px;padding:10px 16px;font-size:13px;letter-spacing:.5px}.primary-button:hover{background:linear-gradient(135deg,#e5ffbe,#b7e27a);box-shadow:0 0 20px #b3ed7050}.gravity-button{min-height:44px;font-size:13px;background:linear-gradient(135deg,#29617666,#12364b);border-color:#70d2e580;border-radius:2px;box-shadow:inset 0 1px #b4f4ff11}.gravity-button:disabled{opacity:.55}.gravity-button:not(:disabled){box-shadow:0 0 22px #65def72a,inset 0 1px #a6f4ff33}.gravity-button kbd{margin-left:4px}
.controls-strip{font-size:10px;color:#97b4cc;gap:6px;margin-top:14px}kbd{background:#20374a;border-color:#466078;color:#c3d9e8;border-radius:2px;font-size:10px}
.objective strong{font-size:14px;color:#f2c896}.objective-marker{border-color:#f3bc7d;box-shadow:0 0 8px #ffb57644}.objective p{font-size:12px;line-height:1.8;color:#a2bacd}.intel{margin-top:16px;font-size:11px}.intel-tag{background:#ffb57708;border-color:#a585683b;color:#e4b78f;font-size:10px}.selection-empty{font-size:12px;color:#849fb7;padding-top:12px}.selection-empty svg{stroke:#527895}.selection-panel{min-height:174px}.selected-title strong{font-size:16px;color:#e8f5ff}.tower-description{font-size:12px;line-height:1.8;color:#a5bdd0}.selected-art{height:112px;display:flex;align-items:center;justify-content:center;margin:8px 0;background:radial-gradient(ellipse,#436a8240,transparent 70%);border-bottom:1px solid #47647a33}.selected-art .tower-art{width:116px;height:112px}.tower-stats{font-size:10px;margin:12px 0}.tower-stats b{font-size:22px;color:#c5ecff}.outline-button{font-size:12px;min-height:40px;border-color:#83ad7180;background:linear-gradient(135deg,#9ec47114,#526c3212);border-radius:2px}.secondary-button{background:linear-gradient(#2a455d,#1b3449);border-color:#547089aa;color:#d2e5f4;border-radius:2px;min-height:38px}.text-button{color:#9cb7ca;font-size:11px}.text-button:hover{color:#d3f2ff}.selection-actions{gap:8px}
.pilot-card{gap:11px;align-items:center}.pilot-portrait{width:65px;height:79px;border-color:#73aacccc;background:#162d42;border-radius:2px;position:relative;box-shadow:0 0 15px #53cff314}.pilot-portrait:after{content:'';position:absolute;inset:0;box-shadow:inset 0 -15px 12px #09243666;pointer-events:none}.pilot-portrait img{width:100%;height:100%;object-fit:cover}.pilot-card strong{font-size:17px;letter-spacing:2px}.pilot-card span{font-size:11px;color:#a0bbd1;line-height:1.7}.pilot-xp{width:100px;height:4px}.mech-status{font-size:12px;margin:14px 0}.mech-status small{font-size:10px}.mission-footer{font-size:10px;padding-top:14px;margin-top:17px;gap:7px}.mission-footer strong{font-size:18px}.page-footer{margin-top:24px;border-color:#40607855;color:#688ba8;letter-spacing:1.5px}
.intro-overlay{background:linear-gradient(90deg,#081725f5 0,#0a1c2cdb 58%,#07132069);backdrop-filter:blur(2px);justify-content:flex-start;padding:5% 6%}.intro-card{text-align:left;padding:0;max-width:485px}.intro-badge{display:table;color:#fed39b;border:1px solid #eebc7950;padding:3px 9px;font-size:10px;letter-spacing:2px;margin-bottom:20px;background:#b97c3110}.intro-card .eyebrow{font-size:10px;color:#83c2d5;letter-spacing:2px}.intro-card h2{font-size:clamp(24px,2.6vw,40px);font-weight:800;line-height:1.5;margin:12px 0 15px;letter-spacing:2px}.intro-card h2 em{font-style:normal;color:#b9e7f8}.intro-card p{font-size:14px;color:#bed0df;max-width:380px;line-height:1.9}.intro-steps{justify-content:flex-start;gap:34px;margin:24px 0;color:#a6c3d9;font-size:11px}.intro-steps b{font-size:24px;color:#85dbee}.intro-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.intro-actions .primary-button{min-width:170px;display:flex;justify-content:space-between;gap:12px}.intro-actions .secondary-button{height:44px;min-width:139px}.intro-card>small{color:#7fa1ba;font-size:10px;margin-top:16px;letter-spacing:1px}.result-overlay{background:#081623dd}.result-card{background:linear-gradient(145deg,#1d3c52e8,#102435ee);border:1px solid #6b9cbe88;box-shadow:0 30px 80px #0008;width:90%;max-width:455px;border-radius:3px}.result-card p{font-size:13px}.result-icon{text-shadow:0 0 24px #b7ef7788}.toast{background:#102a3cf0;border-color:#7fa9b977;box-shadow:0 4px 20px #0005}.boss-hud{background:#0c1b2dcf;padding:9px 12px;border:1px solid #c385603b;z-index:2}.boss-meter{height:6px}.boss-meter i{box-shadow:0 0 8px #ffab7860}.pause-overlay{background:#071522c7;z-index:8}
dialog{background:linear-gradient(140deg,#233e53,#102335 62%);border-color:#6b93b6aa;box-shadow:0 25px 120px #000a;border-radius:3px;padding:28px}dialog h2{font-size:27px}.dialog-note{font-size:12px}.manual-actions{display:flex;gap:12px;margin-top:20px}.manual p{font-size:13px}.hangar-pilot{background:linear-gradient(#294257,#182e40);border-radius:3px}.hangar-pilot p,.module-card p{font-size:12px}.module-card{background:#122a3d88;border-radius:3px}.module-card strong{font-size:14px}
.tutorial-coach{display:grid;grid-template-columns:62px minmax(0,1fr) auto;gap:13px;align-items:center;margin-top:15px;border:1px solid #58bdd68a;border-left:3px solid var(--cyan);background:linear-gradient(115deg,#184b5bbf,#10283dec);padding:15px;box-shadow:0 8px 24px #0003;border-radius:3px;scroll-margin-block:20px}.coach-avatar{height:77px;width:62px;border:1px solid #81b8d2;background:#173346 url('./assets/commander-v4.webp') center 25%/cover no-repeat;border-radius:2px}.coach-heading{display:flex;gap:8px;justify-content:space-between;color:#8acbdc;font-size:9px;letter-spacing:1px}.coach-heading>span:last-child{color:#c9eeff;white-space:nowrap}.coach-content h2{font-size:16px;line-height:1.4;margin:5px 0;color:#ecfaff;letter-spacing:1px}.coach-content p{font-size:12px;color:#bed8e7;line-height:1.7;margin:0}.tutorial-progress{display:flex;gap:4px;margin-top:9px}.tutorial-progress i{height:3px;flex:1;background:#3e6477}.tutorial-progress i.complete{background:#80d7e9}.tutorial-progress i.active{background:#f4c98d}.tutorial-coach>.text-button{align-self:start;font-size:10px;padding:0;white-space:nowrap}.tutorial-coach>.primary-button{grid-column:3;font-size:12px;min-height:37px;padding:7px 12px}.tutorial-target{position:fixed;pointer-events:none;border:2px solid #a3ecff;border-radius:4px;box-shadow:0 0 0 4px #73d8f326,0 0 20px #77d8ff75;z-index:11;transition:left .16s,top .16s,width .16s,height .16s}.tutorial-target>span{position:absolute;top:-25px;left:0;padding:2px 7px;background:#87dfef;color:#062332;font-size:10px;font-weight:700;white-space:nowrap;border-radius:2px}.tutorial-focus{position:relative;z-index:10}.guide-pad{border-radius:50%;box-shadow:0 0 0 6px #76dff41f,0 0 22px #73dbfa7a}.guide-pad>span{left:50%;transform:translateX(-50%)}
@media(min-width:1600px){.command-grid{grid-template-columns:235px minmax(0,1fr) 264px;gap:24px}.shell{padding:0 36px}.left-panel,.right-panel{padding:20px 16px}.build-card strong{font-size:14px}.build-card{min-height:99px}}
@media(max-width:1240px){.command-grid{grid-template-columns:189px minmax(0,1fr) 218px;gap:14px}.shell{padding:0 16px}.left-panel,.right-panel{padding:15px 11px}.build-card{grid-template-columns:47px minmax(0,1fr) auto;padding:7px;gap:5px;min-height:83px}.build-icon{width:47px}.tower-art{width:56px;height:65px}.build-card strong{font-size:12px}.build-card small{font-size:9px}.build-card .price{grid-column:auto;display:block;font-size:17px}.build-card .price small{display:block}.resource-bar{padding:0 10px}.resource-bar>div{font-size:10px;gap:6px}.resource-bar>div+div{padding-left:10px}.resource-bar strong{font-size:24px}.wave-bar{padding:12px 10px}.wave-actions{gap:7px}.gravity-button,.primary-button{font-size:12px;padding:8px 10px}.mission-tags span:first-child{display:none}.intro-steps{gap:27px;margin:17px 0}.intro-badge{margin-bottom:13px}.intro-card p{font-size:13px}.intro-card h2{margin:7px 0 10px}.header-status{display:none}}
@media(max-width:1040px){.command-grid{grid-template-columns:190px minmax(0,1fr)}.right-panel{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:16px 25px;padding:20px;border-top:2px solid #587b9280}.right-panel>.section-label,.right-panel>.division,.right-panel>.intel,.mission-footer{display:none}.objective{grid-column:1;grid-row:1}.selection-panel{grid-column:2;grid-row:1/3}.pilot-card{grid-column:3;grid-row:1}.mech-status{grid-column:3;grid-row:2;margin:0}#hangar-button{grid-column:1;grid-row:2}.battlefield{min-height:285px}.intro-card h2{font-size:28px}}
@media(max-width:700px){.shell{padding:0 12px}.masthead{height:76px}.brand>span{font-size:20px;letter-spacing:2px}.brand small{font-size:8px}.brand>svg{width:32px;height:35px}.header-actions{gap:4px}.icon-button,.small-button{min-width:29px;height:32px;padding:0 5px}.command-grid{display:flex;flex-direction:column;gap:13px;padding-top:14px}.left-panel{display:contents}.left-panel>.section-label,.left-panel>.division,.tip-card{display:none}.level-list{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;order:0}.level-button{height:38px;justify-content:center;padding:4px}.level-button .level-text{display:none}.level-button .number{font-size:21px;width:auto}.level-button .level-mark{margin:0}.battle-section{order:1}.build-list{order:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.build-card{grid-template-columns:1fr auto;min-height:130px;gap:2px 4px;padding:7px;align-items:end}.build-icon{grid-column:1/-1;justify-content:center;width:100%;height:68px}.build-card .tower-art{height:70px;width:78px}.build-card strong{font-size:11px;white-space:nowrap}.build-card small{font-size:9px}.build-card .price{font-size:16px;margin:0}.build-card .price small{display:none}.right-panel{order:3;display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:16px 12px}.objective{grid-column:1;grid-row:1}.pilot-card{grid-column:2;grid-row:1;gap:9px}.pilot-portrait{width:51px;height:67px}.pilot-card strong{font-size:15px}.pilot-card span{font-size:9px}.pilot-xp{width:75px}.selection-panel{grid-column:1;grid-row:2/4}.mech-status{grid-column:2;grid-row:2}#hangar-button{grid-column:2;grid-row:3}.mission-top{min-height:41px;margin:0 0 13px}.mission-top h1{font-size:24px;letter-spacing:3px}.mission-top .eyebrow{font-size:8px;letter-spacing:1px}.mission-tags span{font-size:9px;padding:4px}.resource-bar{min-height:52px;padding:0 8px}.resource-bar>div{font-size:9px;gap:4px;flex-wrap:wrap}.resource-bar>div+div{padding-left:8px}.resource-icon{font-size:19px}.resource-bar strong{font-size:22px;letter-spacing:0}.battlefield{min-height:255px}.coord-top,.wave-notice,.coord-bottom{font-size:8px}.wave-bar{min-height:65px;padding:10px 8px}.wave-readout strong{font-size:21px}.wave-readout .eyebrow,.wave-dots{display:none}.wave-actions{gap:6px}.wave-actions .primary-button,.gravity-button{min-height:40px;font-size:11px;padding:7px 8px}.gravity-button>span{font-size:17px}.gravity-button kbd{display:none}.controls-strip{display:none}.intro-overlay{padding:16px 20px}.intro-card .eyebrow{font-size:8px}.intro-card h2{font-size:24px;line-height:1.5;margin:6px 0}.intro-card p{font-size:11px;line-height:1.7;margin:7px 0}.intro-badge{font-size:8px;padding:2px 7px;margin-bottom:9px}.intro-steps{gap:25px;margin:10px 0;font-size:9px}.intro-steps b{font-size:19px;margin:0}.intro-actions{gap:7px}.intro-actions .primary-button{min-width:155px;min-height:38px;height:38px;font-size:11px}.intro-actions .secondary-button{min-width:125px;min-height:38px;height:38px;font-size:11px;padding:7px}.intro-card>small{display:none}.tutorial-coach{grid-template-columns:43px minmax(0,1fr);gap:10px;padding:12px;margin-top:13px;scroll-margin-block:10px}.coach-avatar{width:43px;height:60px;align-self:start;margin-top:3px}.coach-heading{font-size:8px;letter-spacing:.3px}.coach-content h2{font-size:14px;margin:5px 0}.coach-content p{font-size:11px}.tutorial-coach>.text-button{grid-column:2;justify-self:end;font-size:10px;margin-top:-3px}.tutorial-coach>.primary-button{grid-column:2;justify-self:start}.tutorial-target>span{font-size:9px;top:-22px}.selected-art{height:80px}.selected-art .tower-art{width:90px;height:82px}.tower-description{font-size:11px}.selected-title strong{font-size:14px}.page-footer{font-size:8px;gap:5px}.manual-actions{flex-wrap:wrap}.manual-actions button{flex:1}.manual p{font-size:12px}}
@media(prefers-reduced-motion:reduce){.tutorial-target{transition:none}}
@media(max-width:700px){body.training-active{padding-bottom:175px}.tutorial-coach{position:fixed;left:12px;right:12px;bottom:12px;z-index:12;background:linear-gradient(115deg,#184c60,#102c42);margin:0;box-shadow:0 -4px 24px #0008}.tutorial-coach>.secondary-button{grid-column:2;justify-self:start;font-size:11px;min-height:34px;padding:6px 10px}}
@media(max-width:700px){.battlefield:has(#intro:not([hidden])){min-height:306px}.intro-actions{display:grid;grid-template-columns:1.15fr 1fr;width:100%}.intro-actions .primary-button,.intro-actions .secondary-button{min-width:0;width:100%;white-space:nowrap}.intro-card{width:100%}}
.tutorial-target{transition:none}
