:root{font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,sans-serif;color:#e0e8de;background:#101a20;font-synthesis:none;--mint:#9ad8b5;--gold:#d8be7b;--line:#344747;--muted:#8eaaa6}*{box-sizing:border-box}body{margin:0;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:2px solid #e5c989;outline-offset:3px}button:disabled{cursor:default}#app{height:100dvh;min-height:0;display:flex;flex-direction:column;background:#142127}header{height:70px;flex-shrink:0;display:flex;align-items:center;padding:0 23px;gap:27px;border-bottom:1px solid #426057;background:#122127;z-index:3}.brand{display:flex;gap:11px;align-items:center;min-width:185px}.brand-mark{width:31px;height:33px;position:relative;color:var(--mint)}.brand-mark:before,.brand-mark:after{content:"";position:absolute;inset:1px 3px 14px;border-left:6px solid;border-top:6px solid;transform:rotate(45deg)}.brand-mark:after{inset:13px 3px 2px}.brand strong{font-size:21px;font-weight:650;letter-spacing:3px}.eyebrow{font-family:Barlow Condensed,Arial,sans-serif;font-size:11px;letter-spacing:2.8px;color:var(--muted);display:block;margin-top:2px}.top-control{min-width:170px;flex:1;max-width:330px}.stat-caption{font-size:10px;color:var(--muted);letter-spacing:2px}.control-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.control-row b{font-family:Barlow Condensed,sans-serif;font-size:22px;color:var(--mint);line-height:1}.control-track{height:4px;background:#b6735f;position:relative}.control-track i{display:block;height:100%;width:50%;background:var(--mint);transition:width .4s}.supply{display:flex;align-items:center;gap:10px;margin-left:auto}.supply .symbol{font-size:25px;color:var(--gold)}.supply b{color:var(--gold);font:600 29px Barlow Condensed,sans-serif}.supply small{font-size:10px;color:#91a99c}.clock{font:500 24px Barlow Condensed,sans-serif;letter-spacing:1px;white-space:nowrap;color:#c6d2c8}.header-buttons{display:flex;gap:6px}.icon-button{width:34px;height:34px;background:#1c2e32;border:1px solid #40534e;border-radius:4px;font-size:16px;color:#b4c8bb}.icon-button:hover{background:#2c4242;color:#fff}.icon-button.active{color:var(--gold);border-color:var(--gold)}.stage{position:relative;flex:1;min-height:0;overflow:hidden}.stage canvas{width:100%;height:100%;display:block;touch-action:none;outline:none;cursor:grab}.stage canvas:active{cursor:grabbing}.mission-strip{position:absolute;top:19px;left:23px;pointer-events:none;display:flex;gap:11px;align-items:center}.live-dot{width:6px;height:6px;border-radius:50%;background:var(--mint);box-shadow:0 0 10px #7acdab}.mission-strip span{font-size:11px;letter-spacing:1.5px;color:#d0dcd0;text-shadow:0 2px 7px #000}.mission-strip small{font-size:10px;color:#a2b5b0}.camera-tools{position:absolute;right:19px;top:18px;display:flex;gap:6px}.camera-tools button{background:#182a30e0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);width:34px;height:32px;font-size:16px;border:1px solid #4a6460;border-radius:4px;color:#c1d0c1}.camera-tools button:hover{border-color:var(--gold);color:#fff}.camera-help{position:absolute;bottom:14px;right:20px;font-size:10px;letter-spacing:1px;color:#b6c5b7;text-shadow:0 2px 7px #000;pointer-events:none}.battle-status{position:absolute;left:23px;bottom:16px;display:flex;gap:18px;font-size:11px;color:#c8d6c9;text-shadow:0 2px 7px #000}.battle-status b{font:600 18px Barlow Condensed,sans-serif;color:var(--gold);padding-left:5px}.target-banner{position:absolute;left:50%;top:70px;transform:translate(-50%);padding:12px 17px;background:#172a2dee;border:1px solid var(--gold);box-shadow:0 8px 35px #0005;font-size:13px;display:flex;align-items:center;gap:20px;white-space:nowrap;border-radius:3px}.target-banner button{border:0;background:#31423e;color:#e5cf9c;padding:6px 10px;border-radius:3px}.target-banner[hidden]{display:none}.toast{position:absolute;left:50%;bottom:20px;transform:translate(-50%);background:#142729e8;border:1px solid #718675;color:#e1e9d5;font-size:12px;line-height:1.6;padding:10px 18px;max-width:82%;text-align:center;pointer-events:none;border-radius:4px;transition:opacity .4s}.toast.hide{opacity:0}.dock{flex-shrink:0;background:#122127;border-top:1px solid #426057;padding:15px 22px 17px;display:grid;grid-template-columns:168px 218px 1fr;gap:22px;z-index:3;box-shadow:0 -8px 40px #09171b33}.panel-label{font-size:10px;letter-spacing:2px;color:#93aaa1;display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.panel-label b{color:var(--gold);font-family:Barlow Condensed,sans-serif;font-size:12px;letter-spacing:1px;font-weight:500}.radar-wrap{position:relative;width:141px;height:141px;margin:auto}.radar-wrap svg{width:100%;height:100%;overflow:visible}.radar-wrap:before{content:"N";position:absolute;top:3px;left:67px;font:10px Barlow Condensed,sans-serif;color:#aabfaf}.radar-wrap:after{content:"";position:absolute;inset:14px;border-radius:50%;background:conic-gradient(from 20deg,transparent 0deg,#8bddb218 40deg,transparent 41deg);animation:sweep 12s linear infinite;pointer-events:none}@keyframes sweep{to{transform:rotate(360deg)}}.sector-panel{border-right:1px solid #2b4242;padding-right:22px}.sector-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.sector-buttons button{min-width:0;padding:9px 4px 8px;background:#1a2c32;border:1px solid #334c4d;color:#a3b7ad;border-radius:3px;font-size:11px}.sector-buttons button span{display:block;font:600 18px Barlow Condensed,sans-serif;margin-top:4px}.sector-buttons button.active{background:#263c37;border-color:#81bda0;color:#c7ead6}.sector-bars{display:flex;align-items:flex-end;gap:5px;height:30px;margin-top:12px}.sector-bars i{flex:1;background:var(--mint);opacity:.5;min-height:4px}.sector-bars i:nth-child(3n){background:var(--gold)}.sector-caption{font-size:10px;color:#8da29a;line-height:1.7;margin:10px 0 0}.command-panel{min-width:0}.command-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:10px}.orders{display:flex;gap:4px}.orders button{font-size:11px;background:#203037;border:1px solid #3b4e4b;padding:6px 11px;border-radius:3px;color:#aabbb1}.orders button.active{background:#385446;border-color:#a0c2a1;color:#e4f4dc}.orders kbd{font:10px Barlow Condensed,sans-serif;color:#8ea095;margin-left:7px}.command-label{font-size:10px;letter-spacing:2px;color:#92aaa0}.cards{display:grid;grid-template-columns:repeat(8,minmax(58px,1fr));gap:7px}.unit-card{min-width:0;border:1px solid #425652;border-radius:4px;background:linear-gradient(155deg,#2a3c40,#1c2e34);position:relative;height:110px;padding:7px 3px 5px;text-align:center;transition:background .15s,border-color .15s,transform .15s}.unit-card:hover{border-color:#bacda4;background:linear-gradient(155deg,#36524b,#253f3d);transform:translateY(-2px)}.unit-card:active{transform:translateY(0)}.unit-card svg{display:block;height:31px;width:47px;max-width:100%;margin:7px auto;color:#b7c8ac;filter:drop-shadow(0 2px 1px #0003)}.unit-card .hotkey{position:absolute;left:6px;top:4px;color:#91a097;font:10px Barlow Condensed,sans-serif}.unit-card .unit-name{font-size:11px;font-weight:500;white-space:nowrap}.unit-card .unit-cost{display:block;font:600 18px Barlow Condensed,sans-serif;color:#e4cc8c;margin-top:3px}.unit-card .unit-cost:before{content:"◇";font:10px system-ui;padding-right:3px}.unit-card.unavailable{opacity:.42;filter:saturate(.5)}.unit-card.targeting{border-color:var(--gold);background:#454631}.unit-card .cooldown{position:absolute;inset:0;background:#122427d9;display:flex;align-items:center;justify-content:center;font:600 23px Barlow Condensed,sans-serif;color:#dacb96;pointer-events:none;border-radius:4px}.unit-card .cooldown[hidden]{display:none}.deploy-foot{font-size:10px;color:#859d95;margin-top:9px;display:flex;justify-content:space-between;gap:8px}.deploy-foot strong{color:#b7cbbd;font-weight:400}.overlay{position:absolute;inset:0;background:#09141966;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:grid;place-items:center;padding:20px;z-index:10}.overlay[hidden]{display:none}.briefing{max-height:100%;overflow:auto;width:min(560px,100%);background:linear-gradient(135deg,#172c31f5,#132227f5);border:1px solid #72857a;box-shadow:0 30px 100px #0008;padding:32px 37px;position:relative;border-radius:5px}.briefing:before{content:"";height:3px;width:78px;background:var(--gold);position:absolute;top:-1px;left:37px}.briefing .overline{font:500 12px Barlow Condensed,sans-serif;letter-spacing:3px;color:var(--gold)}.briefing h1{margin:13px 0 9px;font-size:42px;font-weight:600;letter-spacing:7px;color:#e2ebdc}.briefing h2{margin:14px 0 9px;font-size:28px;letter-spacing:4px;font-weight:500}.briefing .subtitle{font-size:13px;color:#bacdbd;line-height:1.8;margin:9px 0 24px}.briefing .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:17px;margin:0 0 25px;padding-top:21px;border-top:1px solid #3c514d}.briefing .steps b{display:block;font:500 12px Barlow Condensed,sans-serif;color:var(--gold);margin-bottom:8px;letter-spacing:2px}.briefing .steps strong{display:block;font-size:14px;letter-spacing:2px;margin-bottom:7px;font-weight:500}.briefing .steps p{font-size:11px;color:#94aaa0;line-height:1.8;margin:0}.primary{width:100%;padding:13px 20px;background:#b2c59e;color:#1b302d;font-size:14px;font-weight:600;letter-spacing:3px;border:1px solid #d1ddbc;border-radius:3px}.primary:hover{background:#d1ddbc}.secondary{width:100%;padding:12px;border:1px solid #567064;background:transparent;margin-top:10px;font-size:12px;letter-spacing:2px;color:#a7c1b1;border-radius:3px}.briefing .legend{font-size:10px;text-align:center;color:#91a99d;margin:13px 0 0;letter-spacing:.6px}.result-stats{display:flex;justify-content:space-between;gap:20px;margin:20px 0 27px}.result-stats div{font-size:11px;color:#9ab0a6}.result-stats b{display:block;font:600 30px Barlow Condensed,sans-serif;color:#e0ca91;margin-top:5px}.help-lines{font-size:12px;line-height:2.1;color:#bdcbbd;margin:18px 0 22px}.help-lines b{color:var(--gold);font-weight:500}.dev-error{position:absolute;inset:20%;padding:24px;background:#283e3b;color:#fff}@media(min-width:1550px){.dock{grid-template-columns:190px 270px 1fr;padding:18px 30px 21px;gap:27px}.cards{gap:10px}.unit-card{height:123px}.unit-card svg{height:37px;width:56px}.unit-card .unit-name{font-size:12px}.radar-wrap{width:155px;height:155px}.radar-wrap:before{left:73px}.sector-buttons button{font-size:12px}}@media(max-width:1100px){header{gap:16px;padding:0 17px}.brand{min-width:160px}.brand strong{font-size:18px}.clock{display:none}.dock{grid-template-columns:118px 165px 1fr;padding:12px 15px;gap:15px}.radar-wrap{width:115px;height:115px;margin-top:10px}.radar-wrap:before{left:54px}.sector-panel{padding-right:15px}.cards{grid-template-columns:repeat(4,1fr);gap:5px}.unit-card{height:69px;text-align:left;padding:5px 6px 5px 34px}.unit-card svg{position:absolute;left:5px;top:15px;width:25px;height:25px;margin:0}.unit-card .hotkey{top:3px;left:5px;font-size:9px}.unit-card .unit-name{font-size:10px;padding-top:10px;display:block;letter-spacing:-.4px}.unit-card .unit-cost{font-size:17px;margin-top:2px}.orders button{padding:5px 8px}.orders kbd{margin-left:3px}.command-row{margin-bottom:7px}.command-label{display:none}.deploy-foot{margin-top:7px;font-size:9px}.sector-caption{font-size:9px}.sector-bars{margin-top:19px;height:41px}}@media(max-width:700px){header{height:59px;padding:0 12px;gap:13px}.brand{min-width:auto}.brand-mark{width:22px;height:27px}.brand-mark:before,.brand-mark:after{border-width:4px;inset:2px 2px 12px}.brand-mark:after{inset:12px 2px 2px}.brand strong{font-size:16px;letter-spacing:2px}.brand .eyebrow{font-size:8px;letter-spacing:1.3px}.top-control{min-width:62px;max-width:120px}.stat-caption{font-size:8px;letter-spacing:0}.control-row b{font-size:19px}.control-row .stat-caption{display:none}.supply{gap:4px;margin-left:0}.supply .symbol{font-size:18px}.supply b{font-size:24px}.supply small{display:none}.supply .stat-caption{font-size:8px}.header-buttons{gap:5px}.icon-button{width:28px;height:29px;font-size:12px}#sound-btn{display:none}.mission-strip{left:12px;top:13px}.mission-strip span{font-size:9px;letter-spacing:.7px}.mission-strip small{display:none}.camera-tools{right:10px;top:10px;gap:4px}.camera-tools button{width:26px;height:27px;font-size:13px}#focus-btn,.camera-help{display:none}.battle-status{bottom:11px;left:12px;font-size:9px;gap:12px}.battle-status b{font-size:15px}.dock{display:grid;grid-template-columns:1fr;padding:9px 11px max(11px,env(safe-area-inset-bottom));gap:8px}.radar-panel{display:none}.sector-panel{padding:0;border:0;display:flex;gap:9px;align-items:center}.sector-panel .panel-label{margin:0;font-size:9px;letter-spacing:1px;min-width:45px}.sector-panel .panel-label b,.sector-bars,.sector-caption{display:none}.sector-buttons{flex:1;gap:5px}.sector-buttons button{padding:6px;font-size:10px;display:flex;align-items:center;justify-content:center;gap:9px}.sector-buttons button span{font-size:14px;margin:0}.command-row{margin-bottom:7px}.orders{width:100%}.orders button{flex:1;font-size:10px;padding:6px 8px}.orders kbd{display:none}.cards{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.unit-card{height:60px;padding-left:37px}.unit-card svg{width:28px;left:4px;top:14px}.unit-card .unit-name{font-size:10px;padding-top:6px}.unit-card .unit-cost{font-size:16px}.unit-card .hotkey{display:none}.deploy-foot{font-size:8px;margin-top:6px;line-height:1.5}.toast{font-size:10px;padding:8px 12px;bottom:37px;max-width:90%;width:max-content}.target-banner{top:50px;max-width:94%;width:max-content;font-size:11px;padding:10px;gap:10px}.briefing{padding:24px 25px;width:min(470px,100%)}.briefing h1{font-size:32px;letter-spacing:5px}.briefing .overline{font-size:10px;letter-spacing:2px}.briefing .subtitle{font-size:11px;margin-bottom:19px}.briefing .steps{gap:11px;margin-bottom:20px;padding-top:16px}.briefing .steps strong{font-size:12px}.briefing .steps p,.briefing .steps b{font-size:10px}.briefing .legend{font-size:9px}.overlay{padding:17px}.primary{padding:12px}.help-lines{font-size:11px}.briefing .steps{display:none}}@media(max-height:650px)and (min-width:701px){header{height:54px}.dock{padding-top:8px;padding-bottom:8px;grid-template-columns:100px 140px 1fr;gap:12px}.radar-wrap{width:90px;height:90px;margin-top:0}.radar-wrap:before{left:41px}.cards{grid-template-columns:repeat(8,minmax(49px,1fr))}.unit-card{height:76px;text-align:center;padding:4px}.unit-card svg{position:static;width:31px;height:22px;margin:4px auto}.unit-card .unit-name{padding:0;font-size:9px}.unit-card .unit-cost{font-size:14px}.sector-bars,.sector-caption{display:none}.briefing{padding:23px 30px}.briefing .steps{display:none}.briefing h1{font-size:32px}.briefing .subtitle{margin-bottom:16px}}@media(max-height:650px)and (min-width:701px){.sector-buttons button{padding:7px 1px}.sector-buttons button span{font-size:15px}.sector-panel .panel-label{font-size:9px;letter-spacing:1px}.sector-panel .panel-label b{font-size:9px;letter-spacing:0}}.briefing{scrollbar-width:thin;scrollbar-color:#50675d transparent}@media(max-height:800px)and (min-width:701px){.briefing{padding:24px 30px}.briefing h1{font-size:32px;margin:9px 0}.briefing .subtitle{margin-bottom:15px}.briefing .steps{margin-bottom:17px;padding-top:13px}.briefing .steps p{font-size:10px;line-height:1.55}.briefing .steps b{margin-bottom:6px}.briefing .legend{margin-top:8px}}