:root{--fg:#e9e6df;--dim:#8d8a83;--accent:#f2b25c;--bar:#000;--font:"SF Mono", "JetBrains Mono", "Menlo", "Consolas", monospace;--sans:"Helvetica Neue", "Inter", "Segoe UI", Arial, sans-serif}*{box-sizing:border-box}html,body{height:100%;color:var(--fg);font-family:var(--sans);background:#000;margin:0;overflow:hidden}#stage{position:fixed;top:0;bottom:0;left:0;right:0}#view{position:absolute;left:0;right:0}#view canvas{width:100%;height:100%;display:block}#hud{pointer-events:none;transition:opacity .6s;position:absolute;top:0;bottom:0;left:0;right:0}#hud.hidden{opacity:0}#hud .bar{justify-content:space-between;align-items:center;padding:0 2.2vw;display:flex;position:absolute;left:0;right:0}#hud .bar.top{height:var(--barTop,60px);top:0}#hud .bar.bottom{height:var(--barBot,120px);align-items:center;bottom:0}#hud button{pointer-events:auto}.brand{font:600 12px/1 var(--sans);letter-spacing:.32em;color:var(--fg);white-space:nowrap;align-items:center;gap:10px;display:flex}.brand .dim{color:var(--dim)}.brand .mark{background:var(--accent);width:8px;height:8px;box-shadow:0 0 10px var(--accent);border-radius:50%}.cams,.time{align-items:center;gap:4px;display:flex}#hud button{color:var(--dim);font:600 10.5px/1 var(--sans);letter-spacing:.14em;cursor:pointer;background:#ffffff0a;border:1px solid #ffffff1a;border-radius:2px;padding:7px 10px;transition:color .2s,border-color .2s,background .2s}#hud button:hover{color:var(--fg);border-color:#ffffff4d}#hud button.on{color:#000;background:var(--fg);border-color:var(--fg)}#hud button .k{opacity:.5;font-family:var(--font);margin-right:6px}#hud button.icon{min-width:34px}#hud button.replay{color:var(--accent);border-color:#f2b25c66;margin-left:8px}#hud button.replay:disabled{opacity:.3;cursor:default}.stage{flex-direction:column;gap:6px;min-width:330px;display:flex}.stage.ship{align-items:flex-end}.stage .label{font:600 11px/1 var(--sans);letter-spacing:.3em;color:var(--dim)}.stage .row{align-items:center;gap:22px;display:flex}.read{grid-template-rows:auto auto;grid-template-columns:auto auto;align-items:baseline;column-gap:6px;display:grid}.read .v{font:500 30px/1 var(--font);color:var(--fg);text-align:right;font-variant-numeric:tabular-nums;min-width:4.2ch}.read .u{font:600 10px/1 var(--sans);letter-spacing:.14em;color:var(--dim)}.read .n{font:600 9px/1.6 var(--sans);letter-spacing:.3em;color:var(--dim);text-align:right;grid-column:1/3}#hud.ship-gone .stage.ship .read .v{color:var(--dim)}svg.engines circle{fill:#ffffff14;stroke:#ffffff40;stroke-width:.6px;transition:fill .15s}svg.engines circle.ring{fill:none;stroke:#ffffff40;stroke-width:1px}svg.engines circle.on{fill:var(--fg);stroke:var(--fg);filter:drop-shadow(0 0 2px #ffdcaacc)}.center{flex-direction:column;flex:1;align-items:center;gap:6px;max-width:640px;margin:0 2vw;display:flex}.clock{font:500 34px/1 var(--font);letter-spacing:.06em;font-variant-numeric:tabular-nums}.phase{font:600 11px/1 var(--sans);letter-spacing:.38em;color:var(--accent);min-height:11px}.timeline{width:100%;height:30px;margin-top:4px;position:relative}.timeline .track{background:#ffffff38;height:1px;position:absolute;top:7px;left:0;right:0}.timeline .fill{background:var(--fg);width:0;height:3px;position:absolute;top:6px;left:0}.timeline .mark{flex-direction:column;align-items:center;display:flex;position:absolute;top:0;transform:translate(-50%)}.timeline .mark i{background:#000;border:1px solid #ffffff73;border-radius:50%;width:9px;height:9px;margin-top:3px}.timeline .mark.past i{background:var(--fg);border-color:var(--fg)}.timeline .mark span{font:600 8px/1 var(--sans);letter-spacing:.2em;color:var(--dim);white-space:nowrap;margin-top:5px}.timeline .mark.past span{color:var(--fg)}.caption{left:50%;bottom:calc(var(--barBot,120px) + 28px);font:600 13px/1 var(--sans);letter-spacing:.5em;color:#fff;text-shadow:0 1px 12px #000c;opacity:0;white-space:nowrap;transition:opacity .8s,transform .8s;position:absolute;transform:translate(-50%,8px)}.caption.show{opacity:.95;transform:translate(-50%)}.badge{right:2.2vw;top:calc(var(--barTop,60px) + 18px);font:600 10px/1 var(--sans);letter-spacing:.3em;color:var(--accent);opacity:0;text-shadow:0 1px 8px #000c;transition:opacity .3s;position:absolute}.badge.show{opacity:.9}.help{left:2.2vw;top:calc(var(--barTop,60px) + 18px);font:500 10px/1 var(--sans);letter-spacing:.12em;color:#ffffff73;text-shadow:0 1px 6px #000000e6;transition:opacity 1.2s;position:absolute}.help.fade{opacity:0}#intro{z-index:10;background:radial-gradient(at 50% 120%,#2a1a10 0%,#050505 60%);justify-content:center;align-items:center;transition:opacity 1.4s;display:flex;position:fixed;top:0;bottom:0;left:0;right:0}#intro.gone{opacity:0;pointer-events:none}#intro .inner{text-align:center}#intro .kicker{font:600 11px/1 var(--sans);letter-spacing:.5em;color:var(--dim)}#intro h1{font:300 68px/1 var(--sans);letter-spacing:.5em;margin:26px 0 14px;padding-left:.5em}#intro .sub{font:400 14px/1.4 var(--sans);letter-spacing:.12em;color:#b9b5ad}#intro button{color:#fff;font:600 12px/1 var(--sans);letter-spacing:.4em;cursor:pointer;background:0 0;border:1px solid #ffffff80;margin-top:44px;padding:16px 34px 16px 40px;transition:background .3s,color .3s}#intro button:hover{color:#000;background:#fff}#intro button:disabled{opacity:.3;cursor:wait}#intro .hint{font:500 10px/1 var(--sans);letter-spacing:.25em;color:var(--dim);margin-top:22px}#intro .keys{opacity:.6}#fade{pointer-events:none;opacity:1;z-index:5;background:#000;transition:opacity 2.4s;position:fixed;top:0;bottom:0;left:0;right:0}#fade.clear{opacity:0}.timeline .mark.up{flex-direction:column-reverse;top:-14px}.timeline .mark.up span{margin:0 0 5px}.timeline .mark.up i{margin-top:0}.timeline .mark.nolabel span{display:none}