:root{color-scheme:dark;--bg:#060b16;--panel:#0d1523;--line:#203045;--text:#e5edf4;--dim:#8e9fb4;--cyan:#75e8e2;--amber:#ffbd6b;font-family:Arial,Helvetica,sans-serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 0,#14283a 0,transparent 55%),var(--bg);color:var(--text);min-height:100dvh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:var(--text);border:1px solid var(--line);background:#152132;border-radius:8px;padding:14px 18px;cursor:pointer;touch-action:manipulation;transition:background .15s,border-color .15s}button:hover{background:#20364b;border-color:#5b7b91}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}button:disabled{opacity:.4;cursor:default}button small{display:block;font-size:11px;color:var(--dim);margin-top:6px}.topbar{height:76px;display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--line);padding:0 42px;background:#070d17b3}.brand{color:var(--text);text-decoration:none;font-size:26px;font-weight:900;letter-spacing:-1px;line-height:.9}.brand span{display:block;font-size:9px;letter-spacing:5px;color:var(--cyan);margin-top:6px}.brand-line{height:28px;width:1px;background:var(--line)}.name{font-size:12px;letter-spacing:2px;font-weight:bold}.name span{display:block;font-size:9px;color:var(--dim);margin-top:5px;letter-spacing:1.4px}.online{margin-left:auto;font-size:9px;letter-spacing:1.4px;color:var(--dim)}.online i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--cyan);margin-right:8px}.command-deck{display:grid;grid-template-columns:minmax(210px,280px) auto minmax(210px,270px);justify-content:center;align-items:center;gap:42px;padding:26px 30px;min-height:calc(100dvh - 76px)}.panel{align-self:center}.eyebrow{font-size:10px;line-height:1.4;font-weight:700;letter-spacing:2px;color:var(--cyan);margin:0 0 18px}h1{font-size:clamp(34px,3.4vw,49px);letter-spacing:-2px;line-height:1.08;margin:0 0 20px}h1 span{color:var(--cyan)}.intro{color:var(--dim);font-size:14px;line-height:1.75;margin:0 0 32px}.route{list-style:none;margin:0;padding:0;display:grid;gap:22px}.route li{display:flex;align-items:center;gap:16px;position:relative;color:#adc0d1}.route li:not(:last-child):after{content:'';position:absolute;left:17px;top:35px;width:1px;height:22px;background:var(--line)}.route b{font-size:11px;color:#74889f;border:1px solid var(--line);border-radius:50%;width:34px;height:34px;display:grid;place-items:center}.route span{font-size:13px;font-weight:bold}.route small{display:block;color:var(--dim);font-size:11px;font-weight:normal;margin-top:5px}.route li.active b{background:var(--cyan);border-color:var(--cyan);color:var(--bg)}.route li.done b{color:var(--cyan);border-color:#33767c}.dispatch{border-top:1px solid var(--line);margin-top:32px;padding-top:22px}.dispatch .eyebrow{font-size:9px;color:var(--amber)}.dispatch p{font-size:13px;line-height:1.7;color:var(--dim);min-height:44px}.flight{width:clamp(265px,calc((100dvh - 222px)*.6),480px);max-width:100%;border:1px solid #2a4156;border-radius:12px;overflow:hidden;box-shadow:0 24px 80px #0007;background:#070d19}.stage{width:100%;aspect-ratio:480/800;position:relative;isolation:isolate;background:#03050c}canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;user-select:none}.overlay{position:absolute;inset:0;background:linear-gradient(180deg,#071222a6,#050c17ed 48%,#071222eb);display:flex;align-items:center;justify-content:center;padding:22px;overflow-y:auto}.overlay[hidden],[hidden]{display:none!important}.screen{width:100%;text-align:center}.screen h2{font-size:clamp(28px,2.8vw,39px);line-height:1.08;letter-spacing:-1px;margin:14px 0 8px;font-weight:800}em{font-style:normal;color:var(--cyan)}.screen .eyebrow{font-size:8px;letter-spacing:2px;margin:10px 0}.insignia{font-size:38px;line-height:1;color:var(--cyan);text-shadow:0 0 35px #75e8e280}.subtitle{font-size:12px;color:var(--dim);line-height:1.5;margin:8px 0 22px}.mission-summary{padding:14px 10px;margin:20px 0;border-top:1px solid #39506766;border-bottom:1px solid #39506766}.mission-summary span{font-size:8px;letter-spacing:2px;color:var(--amber)}.mission-summary p{margin:8px 0 0;font-size:14px;line-height:1.5}.screen button{width:100%;margin-bottom:10px;font-size:13px}.primary{background:var(--cyan);border:1px solid var(--cyan);color:#062227;font-weight:700;text-align:left;padding:15px 17px;box-shadow:0 4px 24px #4edac514}.primary:hover{background:#a2faf2;border-color:#a2faf2}.primary span{float:right}.primary small{color:#21585a;font-weight:normal;font-size:10px}.hard-modes{display:flex;gap:10px}.hard-modes button{font-size:12px;padding:12px 5px;text-align:center;background:#101e30}.hard-modes small{font-size:9px}.text-button{background:transparent;border-color:transparent;color:var(--dim)}.auto-note{font-size:10px;color:var(--dim);margin:8px 0}.screen .text-button{font-size:11px;margin:0;padding:10px}.tactical-strip{background:#111c2b;border-top:1px solid var(--line);padding:10px 12px;display:flex;align-items:center;gap:10px;min-height:53px}.tactical-strip>span{font-size:8px;letter-spacing:1px;color:var(--amber);writing-mode:vertical-rl}.tactical-strip p{font-size:11px;line-height:1.45;margin:0;color:#bdcbd8}.controls{display:flex;gap:5px;padding:8px;background:#090f1a}.controls button{flex:1;padding:7px 2px;border-radius:6px;min-height:45px;font-size:12px}.controls small{font-size:8px;margin-top:4px}.controls .bomb{flex:1.5;border-color:#604c33;color:var(--amber)}.controls #focus{flex:1.3}.controls button[aria-pressed=true]{background:#163d45;border-color:var(--cyan);color:var(--cyan)}.instruments h3{font-size:23px;letter-spacing:-.6px;margin:0 0 30px}.tactic{display:flex;gap:15px;padding-bottom:24px;margin-bottom:22px;border-bottom:1px solid var(--line)}.symbol{font-size:27px;min-width:28px;line-height:1}.white{color:white}.cyan{color:var(--cyan)}.amber{color:var(--amber)}.green{color:#91e5a9}.tactic h4{font-size:13px;margin:0 0 8px}.tactic p{font-size:12px;line-height:1.7;color:var(--dim);margin:0 0 10px}kbd{font-family:inherit;font-size:8px;letter-spacing:.8px;color:#b4c3d0;padding:4px 6px;border:1px solid #344458;border-radius:3px}.legend{font-size:11px;color:var(--dim)}.legend b{font-size:13px;display:inline-block;width:26px}.legend .eyebrow{color:var(--dim);font-size:8px}.fine{font-size:10px;line-height:1.8;color:#667c94;margin-top:24px}.score strong{font-size:40px;display:block;color:var(--cyan)}.score span{font-size:9px;letter-spacing:2px;color:var(--dim)}.results{margin:24px 0;display:grid;gap:12px;font-size:12px}.results div{display:flex;justify-content:space-between}.results dt{color:var(--dim)}.results dd{margin:0}.close{float:right;font-size:24px;line-height:1;padding:8px 14px}dialog{border:1px solid #38576f;border-radius:14px;background:#0b1624;color:var(--text);max-width:680px;width:calc(100% - 24px);max-height:90dvh;padding:26px;box-shadow:0 24px 100px #000b}dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}dialog h2{font-size:28px;margin:0 0 26px;line-height:1.2}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 28px}.help-grid b{font-size:13px;color:var(--cyan)}.help-grid p{font-size:12px;line-height:1.7;color:var(--dim)}.help-goal{font-size:12px;line-height:1.7;border-top:1px solid var(--line);padding-top:18px;color:var(--amber)}#help-done{width:100%;margin-top:12px;text-align:center}
@media(max-width:1150px){.command-deck{grid-template-columns:minmax(200px,270px) auto;gap:34px}.instruments{display:none}.online{display:none}}
@media(max-width:720px){.topbar{height:52px;padding:0 15px;gap:16px}.brand{font-size:20px}.brand span{font-size:7px;letter-spacing:3.5px}.name{font-size:10px;letter-spacing:1px}.name span{font-size:7px}.command-deck{padding:10px 6px;min-height:0;display:flex;justify-content:center}.briefing{display:none}.flight{width:min(100%,calc((100dvh - 184px)*.6));min-width:265px;border-radius:9px}.overlay{padding:18px}.screen h2{font-size:31px}.insignia{font-size:27px}.mission-summary{margin:14px 0;padding:10px}.mission-summary p{font-size:13px}.screen .eyebrow{font-size:7px}.screen button{font-size:12px}.primary{padding:13px}.tactical-strip{min-height:49px}.controls{padding:6px}.help-grid{grid-template-columns:1fr}.screen .subtitle{margin-bottom:10px}.results{margin:16px 0;gap:8px}}
@media(max-height:760px) and (min-width:721px){.command-deck{padding-top:16px;padding-bottom:16px}.flight{width:clamp(265px,calc((100dvh - 222px)*.6),340px)}.briefing .intro{margin-bottom:22px}.route{gap:14px}.route li:not(:last-child):after{height:14px}.dispatch{margin-top:24px}.instruments .tactic{padding-bottom:15px;margin-bottom:15px}.screen .insignia{font-size:28px}.screen h2{font-size:31px}.mission-summary{margin:14px 0;padding:10px}}
@media(max-width:720px) and (max-height:700px){.flight{min-width:255px}.overlay{padding:12px}.screen h2{font-size:26px}.insignia{display:none}.mission-summary{margin:10px 0;padding:8px}.primary{padding:11px}.screen button{margin-bottom:7px}.hard-modes button{padding:9px 5px}.screen .text-button{padding:5px}.auto-note{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}dialog::backdrop{backdrop-filter:none}}

@media(min-width:721px) and (max-height:800px){.screen .insignia{font-size:24px}.screen h2{font-size:28px}.screen .mission-summary{margin:12px 0;padding:9px}.screen .subtitle{margin-bottom:10px}.screen button{padding:11px 12px}.screen .text-button{padding:5px}.screen .auto-note{font-size:9px}.overlay{padding:16px}.instruments .tactic{margin-bottom:16px;padding-bottom:16px}.instruments h3{margin-bottom:22px}.fine{margin-top:12px}.command-deck{align-items:start}.panel{align-self:start}}
@media(max-height:500px) and (min-aspect-ratio:1/1){.topbar{height:38px;padding:0 18px}.brand{font-size:18px}.brand span{display:none}.name{font-size:9px}.name span{display:none}.command-deck{padding:6px;display:flex;min-height:0;height:calc(100dvh - 38px)}.panel{display:none}.flight{position:relative;display:grid;grid-template-columns:auto 175px;grid-template-rows:1fr auto;width:auto;height:calc(100dvh - 50px);min-width:0;overflow:visible}.stage{height:calc(100dvh - 52px);width:auto;grid-row:1/3;position:static;min-width:0}.stage canvas{position:relative;height:100%;width:auto;aspect-ratio:480/800}.tactical-strip{grid-column:2;border-left:1px solid var(--line);min-height:0;align-self:stretch;align-items:start;padding-top:18px}.controls{grid-column:2;flex-wrap:wrap}.controls button{flex:1 1 40%;min-height:44px}.overlay{inset:0;border-radius:10px;padding:14px;overflow:auto}.screen{max-width:420px}.screen .insignia,.screen>.eyebrow,.screen>.subtitle,.auto-note{display:none}.screen h2{font-size:25px;margin:6px}.screen h2 br{display:none}.mission-summary{margin:8px 0;padding:6px}.mission-summary p br{display:none}.mission-summary p{font-size:12px}.mission-summary span{font-size:7px}.screen button{margin-bottom:6px;padding:9px 12px}.screen .text-button{padding:4px}.results{margin:10px 0;gap:5px}.score strong{font-size:26px}}
@media(max-width:720px) and (max-height:620px) and (orientation:portrait){.flight{min-width:220px}.overlay{align-items:safe center}.screen h2{font-size:23px}.screen .mission-summary p{font-size:11px}.screen .hard-modes small{font-size:8px}.screen .primary small{font-size:9px}.screen>.subtitle{margin:4px 0}.screen .mission-summary{margin:6px 0;padding:5px}}
