:root{color-scheme:dark;--bg:#0a1012;--panel:#11191c;--edge:#263638;--soft:#1c2a2d;--fg:#eaf4ee;--muted:#96aaa8;--mint:#79efc5;--coral:#ff836e;--gold:#f4bd70;--mono:Consolas,'SFMono-Regular',monospace;--sans:'Segoe UI','Malgun Gothic','Apple SD Gothic Neo',sans-serif}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 36% 9%,#142323 0,transparent 48%),var(--bg);color:var(--fg);font:14px/1.5 var(--sans);min-height:100svh}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button:focus-visible{outline:2px solid var(--mint);outline-offset:3px}button:disabled{cursor:default;opacity:.43}button svg,.metric-label svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.6;fill:none;flex:none}[hidden]{display:none!important}.symbols{position:absolute;width:0;height:0;overflow:hidden}.topbar{border-bottom:1px solid var(--edge);background:#0b1214db}.topinner{max-width:1296px;margin:auto;padding:13px 28px;display:flex;align-items:center;justify-content:space-between;gap:10px}.brand,.header-right,.record{display:flex;align-items:center}.brand{gap:12px}.brand-mark{display:grid;place-items:center;width:46px;height:46px;border:1px solid #315950;background:#122725;border-radius:11px;color:var(--mint)}.brand-mark svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.45}.brand h1{font-size:19px;letter-spacing:-.035em;line-height:1.12;margin:0 0 3px}.brand div>span,.eyebrow,footer>span:first-child,.map-label{font:700 10px/1.3 var(--mono);letter-spacing:.16em;color:var(--mint)}.header-right{gap:10px}.record{gap:9px;padding-right:13px;color:var(--muted);font-size:12px}.record strong{color:var(--fg);font:700 14px var(--mono);white-space:nowrap}.record strong span{color:var(--muted);font-size:11px}.quiet,.primary{display:inline-flex;gap:7px;align-items:center;justify-content:center;border:1px solid var(--edge);border-radius:8px;min-height:39px;padding:0 12px;white-space:nowrap;background:#182225;font-weight:650}.quiet:hover:not(:disabled){background:#233235;border-color:#47716a}.square{width:40px;padding:0}.primary{background:var(--mint);color:#0a2420;border-color:#a1f9d8;box-shadow:0 3px 0 #3d9f84;font-weight:800}.primary:hover:not(:disabled){background:#a0ffdf}.primary:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 #3d9f84}.primary:disabled{box-shadow:none}
.shell{max-width:1296px;margin:auto;padding:19px 28px 10px}.hud{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:13px}.metric{min-width:0;padding:11px 15px 12px;border:1px solid var(--edge);border-radius:10px;background:linear-gradient(135deg,#172224,#10191c 88%)}.metric-label{font-size:12px;color:#b7c9c6;display:flex;align-items:center;gap:7px;white-space:nowrap}.metric-label i,.eyebrow i{display:inline-block;width:6px;height:6px;background:var(--mint);box-shadow:0 0 9px #79efc55e;border-radius:50%;flex:none}.enemy-card .metric-label i{background:var(--coral);box-shadow:0 0 8px #ff836e55}.metric-label svg{width:14px;height:14px;color:var(--gold)}.metric-value{display:flex;gap:7px;align-items:baseline;margin:4px 0 6px;white-space:nowrap}.metric-value b{font:700 clamp(22px,3.1vw,34px)/1 var(--mono);letter-spacing:-.055em}.metric-value small{font:700 12px var(--mono);color:var(--muted)}.money-card b{color:var(--gold)}.metric-caption{display:block;color:var(--muted);font-size:11px;line-height:1.2}.meter{height:5px;border-radius:99px;overflow:hidden;background:#293638;margin:7px 0 4px}.meter i{display:block;width:100%;height:100%;background:var(--mint);transition:width .14s linear;border-radius:inherit}.enemy-card .meter i,.boss-hp .meter i{background:var(--coral)}.enemy-card .meter i{width:0}.enemy-card.danger b,.time-card.danger b{color:var(--coral)}.time-card.danger .meter i{background:var(--coral)}
.console{display:grid;grid-template-columns:minmax(0,1fr) minmax(288px,342px);gap:13px;align-items:start}.panel{border:1px solid var(--edge);border-radius:12px;background:var(--panel);min-width:0}.panel-head{min-height:63px;padding:10px 15px;display:flex;align-items:center;justify-content:space-between;gap:9px;border-bottom:1px solid var(--soft)}.panel-head h2,.dialog-head h2{margin:3px 0 0;font-size:18px;line-height:1.2;letter-spacing:-.03em}.eyebrow{display:flex;align-items:center;gap:6px}.eyebrow i{width:5px;height:5px}.panel-icon{width:21px;height:21px;color:#76938e;stroke:currentColor;stroke-width:1.4;fill:none}.play-controls{display:flex;gap:7px}.play-controls button{font:700 14px var(--mono);min-width:41px;min-height:36px}.board{isolation:isolate;position:relative;background:#080f11;border-bottom:1px solid var(--soft);aspect-ratio:760/590;width:100%;overflow:hidden}.board canvas{display:block;width:100%;height:100%;touch-action:manipulation;cursor:crosshair}.map-label{position:absolute;z-index:1;display:flex;gap:5px;align-items:center;font-size:clamp(6px,1vw,9px);opacity:.74;color:#a2c1bd;pointer-events:none}.map-label i{width:5px;height:5px;border:1px solid var(--mint);transform:rotate(45deg)}.map-tl{top:3.3%;left:7.8%}.map-br{bottom:3.1%;right:7.8%}.battle-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 10px;padding:9px 13px;color:var(--muted);font-size:11px}.battle-foot>span{display:inline-flex;gap:7px;align-items:center}.little{display:inline-block;width:6px;height:6px;border-radius:2px}.mint{background:var(--mint)}.coral{background:var(--coral)}
.overlay{position:absolute;z-index:3;inset:0;display:grid;place-items:center;background:radial-gradient(ellipse at center,#071115bc 4%,#07111551 53%,#07111516 90%);padding:14px;pointer-events:none}.mission{pointer-events:auto;display:grid;justify-items:center;text-align:center;width:min(100%,335px);padding:clamp(12px,2.2vw,25px);border:1px solid #42675e;border-radius:14px;background:linear-gradient(150deg,#1b2c2beF,#101a1ef7 80%);box-shadow:0 15px 65px #000b,inset 0 1px 0 #79efc526}.mission-mark{width:38px;height:38px;stroke:var(--mint);stroke-width:1.4;fill:none;margin-bottom:8px;filter:drop-shadow(0 0 10px #79efc56b)}.mission h2{font-size:clamp(21px,3.05vw,35px);line-height:1.12;letter-spacing:-.07em;margin:7px 0 8px}.mission p{margin:0 0 14px;font-size:13px;color:#c0d4ce;line-height:1.55}.start{min-height:43px;min-width:151px}.wave-signal{position:absolute;top:10%;left:50%;transform:translateX(-50%);z-index:2;pointer-events:none;border:1px solid #3e6c5f;background:#102220ef;color:#aff6db;padding:5px 12px;border-radius:5px;font:700 clamp(9px,1.5vw,12px)/1.45 var(--mono);white-space:nowrap}.wave-signal.boss{background:#331d1bdc;border-color:#a1544a;color:#ffb5a9}
.side{display:grid;gap:11px}.body{padding:11px 14px 13px}.muted{color:var(--muted);margin:0;font-size:13px;line-height:1.5}.factions{display:flex;gap:5px;flex-wrap:wrap;margin:9px 0 12px}.factions span,.type-tag,.cycle b{font-size:11px;border:1px solid color-mix(in srgb,var(--tag) 30%,transparent);background:color-mix(in srgb,var(--tag) 9%,transparent);border-radius:5px;color:var(--tag);white-space:nowrap;padding:2px 7px;font-weight:700}.draw{width:100%;min-height:44px;justify-content:flex-start}.draw strong{margin-left:auto;border-left:1px solid #14352e53;padding-left:10px;font:700 13px var(--mono)}.deploy-note{margin-top:9px;color:var(--muted);font-size:11px;min-height:17px}.squad-count{color:var(--muted);font:700 12px var(--mono);white-space:nowrap}.squad{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;max-height:106px;overflow:auto;scrollbar-width:thin;padding:2px 3px 3px}.unit{display:grid;place-items:center;gap:1px;min-width:0;min-height:43px;padding:3px 1px;background:#182326;border:1px solid #2c3b3f;border-radius:6px;color:var(--unit);font:700 9px var(--mono)}.unit:hover,.unit[aria-pressed=true]{border-color:var(--unit);background:color-mix(in srgb,var(--unit) 13%,#142022)}.unit svg{width:18px;height:18px;stroke-width:1.5}.inspect{margin-top:10px;padding:9px 9px 8px;border:1px solid var(--soft);border-radius:8px;background:#0d1518;min-height:62px}.inspect p{margin:0;color:var(--muted);font-size:11px}.inspect-title{display:flex;align-items:center;gap:6px;margin-bottom:4px}.inspect-title strong{font-size:14px;line-height:1.3}.inspect-title small{margin-left:auto;color:var(--mint);font:700 11px var(--mono)}.inspect-actions{display:flex;gap:5px;margin-top:7px}.inspect-actions button{min-height:35px;padding:0 7px;font-size:11px;flex:1}.inspect-actions button[aria-pressed=true]{color:var(--mint);border-color:var(--mint)}.inspect-actions svg{width:15px;height:15px}.incoming{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:4px;font-weight:750}.incoming .type-tag{padding:2px 8px}.boss-hp{margin-top:9px;color:var(--coral);font-size:11px}.boss-hp>div:first-child{display:flex;justify-content:space-between}.boss-hp strong{font-family:var(--mono)}
.strip{margin-top:13px;min-height:54px;padding:7px 13px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.strip-title{font-weight:750;font-size:12px}.cycle{display:flex;align-items:center;gap:4px;color:var(--muted)}.cycle b{padding:2px 6px}.strip-note{font-size:11px;color:var(--muted);white-space:nowrap}.strip-note b{color:var(--fg);font-family:var(--mono)}.strip-note span{margin:0 2px}.strip button{margin-left:auto;min-height:35px;font-size:12px}footer{display:flex;justify-content:space-between;gap:8px;padding:11px 1px;color:#839b98;font-size:10px}footer>span:first-child{color:#839b98}
dialog{border:1px solid #3b5654;border-radius:14px;background:#111c20;color:var(--fg);padding:0;width:min(calc(100% - 28px),530px);max-height:calc(100% - 24px);box-shadow:0 18px 75px #000b}dialog::backdrop{background:#040a0cd1}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid var(--edge);padding:15px 17px}.dialog-body{padding:14px 17px 19px}.guide-steps{padding-left:22px;margin:0;color:#b5c8c4}.guide-steps li+li{margin-top:10px}.guide-steps strong{color:var(--fg);display:block}.keyboard{color:var(--muted);margin:15px 0 0;font-size:11px;display:flex;align-items:center;gap:5px;flex-wrap:wrap}kbd{font-family:var(--mono);background:#243336;border:1px solid #46605f;border-radius:4px;padding:1px 5px;color:var(--fg)}.dialog-actions{margin-top:15px;display:flex;gap:8px;justify-content:flex-end}.toast{position:fixed;z-index:6;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);max-width:calc(100% - 24px);width:max-content;background:#162b28;color:var(--fg);border:1px solid #567d72;border-radius:8px;padding:8px 13px;box-shadow:0 8px 25px #0008;font-size:12px;pointer-events:none}
@media(min-width:1000px) and (max-height:970px){.shell{max-width:1164px}.topinner{max-width:1164px}}
@media(min-width:861px) and (max-height:850px){.shell,.topinner{max-width:clamp(810px,calc((100svh - 259px)*1.288 + 375px),1164px)}.topinner{padding-block:8px}.shell{padding-top:12px}.console{grid-template-columns:minmax(0,1fr) 306px}.metric{padding-block:8px}.panel-head{min-height:52px;padding-block:7px}.side{gap:8px}.side .body{padding-block:8px 9px}.battle-foot{padding-block:6px}.strip{margin-top:8px}}
@media(max-width:860px){.topinner,.shell{padding-left:16px;padding-right:16px}.console{grid-template-columns:minmax(0,1fr) minmax(244px,278px);gap:9px}.squad{grid-template-columns:repeat(5,minmax(0,1fr))}.body{padding:9px 10px 11px}.panel-head{min-height:57px;padding:8px 11px}}
@media(max-width:660px){.topinner{padding:9px 11px}.shell{padding:10px 9px}.brand{gap:7px}.brand-mark{width:37px;height:37px;border-radius:8px}.brand-mark svg{width:24px;height:24px}.brand h1{font-size:16px}.brand div>span{font-size:8px}.header-right{gap:5px}.header-right button{width:42px;min-height:42px;padding:0}.header-right button span{display:none}.record{gap:1px;padding-right:5px;align-items:flex-end;flex-direction:column;font-size:9px}.record strong{font-size:12px}.record strong span{font-size:9px}.hud{gap:4px;margin-bottom:8px}.metric{border-radius:7px;padding:7px 5px 8px}.metric-label{font-size:10px;gap:3px}.metric-label i{width:4px;height:4px}.metric-label svg{width:11px;height:11px}.metric-value{gap:3px;margin:5px 0 5px}.metric-value b{font-size:clamp(16px,5vw,24px)}.metric-value small{font-size:9px}.metric-caption{font-size:9px}.meter{margin-top:6px}.console{display:block}.side{margin-top:8px;gap:8px;grid-template-columns:1fr 1fr}.lineup{grid-column:1/-1;grid-row:2}.squad{grid-template-columns:repeat(8,minmax(0,1fr))}.intel .panel-head,.command .panel-head{min-height:51px}.intel .body,.command .body{padding:7px 8px 8px}.command .muted,.command .factions,.deploy-note{display:none}.battle-head{min-height:51px}.panel-head h2{font-size:15px}.draw{min-height:44px;padding:0 6px;font-size:13px}.draw strong{padding-left:5px;font-size:10px}.draw svg{width:15px;height:15px}.incoming{font-size:13px}.intel .muted{font-size:10px}.incoming .type-tag{padding:1px 4px;font-size:10px}.mission{max-width:255px;padding:12px}.mission-mark{width:27px;height:27px;margin-bottom:5px}.mission h2{margin:4px 0 6px}.mission p{font-size:11px;margin-bottom:9px}.start{min-height:42px}.battle-foot{font-size:10px;padding:6px 8px}.strip{gap:5px 8px;margin-top:8px;padding:6px 8px}.strip button{min-height:40px}.strip-note{font-size:10px}.cycle b{font-size:10px;padding:1px 4px}.inspect-actions button{min-height:42px}}
@media(max-width:380px){.strip-note{order:5;flex-basis:100%}.squad{grid-template-columns:repeat(7,minmax(0,1fr))}.battle-foot{gap:3px}.intel .muted{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important}}