:root{color-scheme:dark;--amber:#f4c77f;--text:#e8f0f2;--muted:#a1b4bf;--line:#65818e55;--panel:#091720ed;--cyan:#8edbd6;--rail:280px;--bottom:220px}*{box-sizing:border-box}body{margin:0;background:#020609;color:var(--text);font:16px/1.5 system-ui,sans-serif;overflow:hidden}button,a,input,select,summary{touch-action:manipulation}button,select{font:inherit;font-size:14px;color:var(--text);background:#152833;border:1px solid var(--line);border-radius:7px;padding:9px 12px;cursor:pointer;min-height:38px}button:hover,a:hover{color:#fff;border-color:var(--cyan);background:#213944}button:disabled{opacity:.42;cursor:not-allowed}.primary{background:var(--amber);color:#15222a;border-color:var(--amber);font-weight:700}.primary:hover{background:#ffdb9d;color:#15222a}button[aria-pressed=true]{border-color:var(--cyan);color:var(--cyan);background:#14333a}button[data-shortcut]::after{content:attr(data-shortcut);display:inline-block;margin-left:8px;font:12px ui-monospace,monospace;color:inherit;opacity:.7}a{color:var(--amber)}:focus-visible{outline:3px solid #a9efea;outline-offset:4px}button:focus-visible{background:#264652}#space:focus-visible{outline-offset:-4px}kbd{font:12px ui-monospace,monospace;display:inline-block;padding:2px 5px;border:1px solid #728b98;border-radius:4px;color:#eff7f8;background:#16252e;white-space:nowrap}.skip-link{position:fixed;left:16px;top:-80px;z-index:100;background:var(--panel);padding:12px}.skip-link:focus{top:12px}[hidden]{display:none!important}#space{position:fixed;inset:0;width:100vw;height:100vh;display:block;touch-action:none}.hud{position:absolute;inset:0;pointer-events:none;background:linear-gradient(#02080ed9,transparent 30%,transparent 70%,#02080e)}.hud button,.hud a,.hud select,.hud input,.hud details{pointer-events:auto}header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;border-bottom:1px solid var(--line);background:#07121be8;min-height:70px}.brand{display:flex;align-items:center;gap:10px}.brand b{font-size:14px;letter-spacing:2px}.brand>span{font:12px ui-monospace,monospace;color:var(--muted)}.top-actions{display:flex;gap:6px;align-items:center}.home-link{font-size:14px;text-decoration:none;padding:9px;display:inline-block;border-radius:6px}.status{position:absolute;top:84px;left:20px;display:flex;align-items:center;gap:18px;font:12px ui-monospace,monospace;letter-spacing:.7px}#pilotMode{padding:5px 9px;border:1px solid var(--cyan);border-radius:5px;color:var(--cyan)}#pilotMode[data-mode=paused]{border-color:var(--amber);color:var(--amber)}#phase{color:var(--text)}.stage-detail{position:absolute;top:120px;left:20px;color:var(--muted);font-size:12px;max-width:calc(100% - 330px)}.eyebrow{font:12px ui-monospace,monospace;letter-spacing:1.3px;color:var(--muted);margin-bottom:12px}.left-panel{position:absolute;left:20px;top:158px;width:var(--rail);padding:16px;background:var(--panel);border:1px solid var(--line);border-radius:10px;display:grid;grid-template-columns:1fr 1fr;gap:12px}.left-panel>.eyebrow{grid-column:1/-1;margin:0}.readout:nth-child(2){grid-column:1/-1}.readout label,label{display:block;font:12px ui-monospace,monospace;color:var(--muted)}.readout strong{display:block;font:24px ui-monospace,monospace;letter-spacing:-1px}.readout:nth-child(2) strong{font-size:34px}.small-readouts{grid-column:1/-1;display:flex;justify-content:space-between;gap:8px}.small-readouts b{font:16px ui-monospace,monospace}.coordinates{grid-column:1/-1;font:12px ui-monospace,monospace;color:var(--muted)}.vision-bar{position:absolute;top:157px;left:calc(var(--rail) + 40px);right:calc(var(--rail) + 40px);padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:#07141cdd;pointer-events:auto}.vision-bar>span{font:12px ui-monospace,monospace;color:var(--cyan)}.vision-bar>div{display:flex;flex-wrap:wrap;gap:5px;margin:6px 0}.vision-bar button{font-size:14px;padding:6px 8px}.vision-bar small{font-size:12px;display:block;color:var(--muted)}.right-panel{position:absolute;right:20px;top:158px;bottom:calc(var(--bottom) + 20px);width:var(--rail);padding:14px;background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:auto;scrollbar-width:thin;pointer-events:auto}.instrument-tabs{display:flex;gap:5px;margin-bottom:12px}.instrument-tabs button{flex:1;padding:7px 6px;font-size:14px}.screen-title{font:12px ui-monospace,monospace;color:var(--muted);display:flex;justify-content:space-between;margin:12px 0 6px}.screen-title span{color:var(--cyan)}#craftView,#horizon,#hazards,#terrainMap{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:6px}#horizon{max-height:150px;object-fit:contain;margin-top:5px}.instrument-readout{display:flex;flex-wrap:wrap;gap:6px;justify-content:space-between;align-items:center;font:12px ui-monospace,monospace;margin:8px 0}.instrument-readout button{font:14px system-ui}.jet-pad>span{font:12px ui-monospace,monospace;color:var(--muted)}.jet-pad>div{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:8px}.jet-pad button{font-size:14px;padding:7px 3px;touch-action:none}.jet-pad button:active{background:var(--amber);color:#102028}.mission-tools summary{display:none}.mission-tools button{width:100%;margin:5px 0}#hazards{margin:12px 0}#navLock,#landingFootprint{font:12px/1.6 ui-monospace,monospace;color:var(--cyan)}details>summary{cursor:pointer;font-size:14px;color:var(--amber);padding:10px 0}.survey-drawer{border-top:1px solid var(--line);margin-top:14px}.survey-drawer select{width:100%;margin:8px 0}.survey-drawer p{font-size:14px;color:var(--muted)}.map-label{display:flex;justify-content:space-between;font:12px ui-monospace,monospace;color:var(--muted)}.resource{display:flex;gap:8px;align-items:center;font:12px ui-monospace,monospace;margin:8px 0}.resource>span:first-child{width:70px}.bar{flex:1;background:#2d434c;height:4px}.bar i{display:block;background:var(--cyan);height:4px}.site-value{display:flex;justify-content:space-between;font-size:14px}.site-value b{color:var(--amber)}#scan{width:100%;margin:12px 0}.nav-hud{position:absolute;left:20px;bottom:calc(var(--bottom) + 20px);width:var(--rail);background:var(--panel);padding:14px;border:1px solid var(--line);border-radius:10px}.nav-hud .eyebrow{display:flex;justify-content:space-between;gap:8px;letter-spacing:0}.nav-hud .eyebrow span{font-size:12px}#director{font:14px ui-monospace,monospace;color:var(--amber)}#commandThrust,#forecast{font:12px/1.6 ui-monospace,monospace;margin:5px 0}#trajectory{width:100%;height:80px;display:block}.nav-legend{font:12px/1.4 ui-monospace,monospace;color:var(--muted)}.bottom{position:absolute;bottom:0;left:0;right:0;min-height:var(--bottom);display:flex;gap:24px;align-items:start;padding:18px 20px;background:#07131aef;border-top:1px solid var(--line)}.engine-panel{width:var(--rail);flex-shrink:0}.engine-panel .eyebrow{margin-bottom:6px}.engine-values{display:flex;align-items:center;justify-content:space-between}.engine-values strong{font:32px ui-monospace,monospace}.engine-values strong span{font-size:16px}.engine-values>span{font:14px ui-monospace,monospace;color:var(--muted)}input[type=range]{width:100%;accent-color:var(--amber);min-height:32px;margin:6px 0}.fuel-line{display:flex;justify-content:space-between;font:12px ui-monospace,monospace}.fuel-track{height:5px;background:#283f48;margin-top:9px}.fuel-track i{display:block;width:100%;height:100%;background:var(--cyan)}.guidance-panel{flex:1;min-width:0}#message{font-size:16px;min-height:48px;margin-bottom:10px;max-width:850px}.buttons{display:flex;gap:7px;flex-wrap:wrap}.keyhelp{display:flex;gap:7px 12px;flex-wrap:wrap;color:var(--muted);font-size:12px;margin-top:12px}#rcs{font:12px ui-monospace,monospace;color:var(--cyan);margin-top:9px}.crosshair{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);font:30px ui-monospace,monospace;color:#bef1e978}#viewLabel{position:absolute;left:50%;top:calc(44% + 40px);transform:translateX(-50%);font:12px ui-monospace,monospace;color:#c8ddd9;max-width:28vw;text-align:center;text-shadow:0 2px 5px #000}.target-reticle{position:absolute;transform:translate(-50%,-50%);color:var(--amber);font:12px ui-monospace,monospace;text-align:center;white-space:nowrap;text-shadow:0 2px 5px #000}.target-reticle i{display:block;width:22px;height:22px;border:1px solid var(--amber);transform:rotate(45deg);margin:0 auto 10px}
/* Training lives in a stable rail, leaving the forward window unobstructed. */
#tutorialPanel{position:absolute;z-index:5;left:20px;top:410px;bottom:calc(var(--bottom) + 20px);width:var(--rail);overflow:auto;padding:18px;background:#0c202bf5;border:1px solid #b69d72;border-radius:10px;pointer-events:auto;scrollbar-width:thin}#tutorialPanel h2{font-size:23px;line-height:1.15;margin:16px 0 12px}#tutorialPanel p{font-size:16px;line-height:1.55;color:#c6d6df}#tutorialCount{padding-right:18px;color:var(--amber)}#tutorialProgress{width:100%;height:5px;display:block;accent-color:var(--amber)}#tutorialGoal{font-size:14px;line-height:1.5;color:var(--amber);border-left:2px solid var(--amber);padding:8px 10px;margin-bottom:14px;background:#24302c}.tutorial-actions{display:flex;gap:7px;flex-wrap:wrap}.tutorial-actions button{font-size:14px}#tutorialPanel small{display:block;font-size:12px;color:var(--muted);margin-top:14px}.tutorial-exit{position:absolute;right:8px;top:8px;background:transparent;border:0;font-size:22px;min-height:28px;padding:0 7px}.tutorial-highlight{outline:2px solid var(--amber)!important;outline-offset:3px;box-shadow:0 0 18px #f4c77f22}#space.tutorial-highlight{outline-offset:-3px}.tutorial-active .nav-hud{left:calc(var(--rail) + 40px);width:min(330px,calc(100vw - 2*var(--rail) - 80px))}.tutorial-active #viewLabel{opacity:.6}dialog{background:#0c1b25;color:var(--text);border:1px solid #658391;border-radius:14px;width:min(760px,calc(100vw - 32px));max-height:88dvh;overflow:auto;padding:28px;box-shadow:0 25px 100px #000a;pointer-events:auto}dialog::backdrop{background:#01070dce}dialog p{font-size:16px;color:#bdcfd9}dialog h1{font-size:32px;line-height:1.15;font-weight:600}dialog h2{font-size:24px}dialog .close{float:right}.checkpoint-controls{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:20px 0}.checkpoint-controls label{width:100%}#abort{color:#ffc0aa;border-color:#a96955}#commandList{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px}#commandList h3{color:var(--amber);font-size:16px}#commandList p,.flight-key-grid p{display:flex;align-items:center;gap:10px;margin:8px 0;font-size:14px}#commandList kbd{min-width:30px;text-align:center}.flight-key-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;padding:12px;border:1px solid var(--line);border-radius:8px}#resultStats{display:flex;gap:20px;flex-wrap:wrap;margin:24px 0}#resultStats b{display:block;font:24px ui-monospace,monospace;color:var(--amber)}#resultStats span{font-size:12px}#debrief .home-link{display:block;margin-top:14px}body[data-sensor=low] #space{filter:contrast(1.15)}body[data-sensor=thermal] #space{filter:saturate(1.6)}
@media(min-width:1101px) and (max-height:900px){:root{--rail:260px;--bottom:210px}.left-panel{gap:6px;padding:12px;top:150px}.left-panel .coordinates{display:none}.left-panel .readout strong{font-size:22px}.left-panel .readout:nth-child(2) strong{font-size:28px}#tutorialPanel{top:350px}.right-panel{top:150px}.nav-hud #trajectory{height:55px}.nav-hud .nav-legend{display:none}.vision-bar{top:150px}#message{min-height:24px}.keyhelp{display:none}.right-panel #craftView{max-height:120px;object-fit:contain}.right-panel #horizon{max-height:120px}.brand>span{display:none}}
/* Narrow windows and browser zoom use document flow rather than overlapping instruments. */
@media(max-width:1100px),(max-height:650px){body{overflow:auto}.hud{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:12px;min-height:100dvh;padding-top:0}.hud header{grid-column:1/-1;margin:0 -12px;flex-wrap:wrap}.brand>span{display:none}.top-actions{flex-wrap:wrap}.status,.stage-detail,.left-panel,.right-panel,.vision-bar,.nav-hud,.bottom{position:static;width:auto;max-width:none;margin:0}.status{grid-column:1/-1;flex-wrap:wrap;gap:8px;font-size:12px}.stage-detail{grid-column:1/-1}.left-panel{grid-column:1;align-self:start}.vision-bar{grid-column:2;grid-row:4;align-self:start}.right-panel{grid-column:2;grid-row:5 / span 2;max-height:640px}.nav-hud,.tutorial-active .nav-hud{grid-column:1;width:auto}.bottom{grid-column:1/-1;min-height:0;flex-wrap:wrap;border-radius:10px}.engine-panel{width:220px}.guidance-panel{min-width:260px}.hud::after{content:'';height:240px;grid-column:1/-1;grid-row:3;pointer-events:none}.crosshair{top:260px}#viewLabel{top:300px;max-width:70vw}#tutorialPanel{position:relative;inset:auto;width:auto;max-height:none;margin:14px;z-index:5}.tutorial-active .hud{padding-bottom:0}.tutorial-active #tutorialPanel{position:relative}.keyhelp{display:flex}.coordinates{display:block}.readout strong{font-size:24px}}
@media(max-width:620px){.hud{grid-template-columns:1fr}.hud header{align-items:start}.brand{width:100%}.top-actions{gap:4px}.top-actions button,.home-link{font-size:14px;padding:8px}.left-panel,.right-panel,.vision-bar,.nav-hud,.tutorial-active .nav-hud,.bottom{grid-column:1;grid-row:auto}.vision-bar{grid-row:4}.right-panel{max-height:none}.engine-panel,.guidance-panel{width:100%;min-width:0}.bottom{gap:18px}.status{gap:6px}.stage-detail{font-size:14px}#commandList,.flight-key-grid{grid-template-columns:1fr}dialog{padding:20px}.checkpoint-controls>*{max-width:100%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

@media(max-width:1100px),(max-height:650px){#tutorialPanel,.tutorial-active #tutorialPanel{grid-column:1/-1;grid-row:4;margin:0}.tutorial-active .left-panel{grid-row:5}.tutorial-active .vision-bar{grid-row:5}.tutorial-active .right-panel{grid-row:6 / span 2}.tutorial-active .nav-hud{grid-row:6}}
@media(max-width:620px){.tutorial-active .vision-bar{grid-row:5}.tutorial-active .left-panel,.tutorial-active .right-panel,.tutorial-active .nav-hud{grid-row:auto}}

@media(min-width:1101px) and (min-height:651px){.left-panel>.eyebrow,.left-panel>.coordinates{display:none}#tutorialPanel{top:350px}.left-panel{gap:8px;padding:12px}}
@media(max-width:1100px),(max-height:650px){.hud header{grid-row:1}.status{grid-row:2}.stage-detail{grid-row:3}.hud::after{grid-row:4}#tutorialPanel,.tutorial-active #tutorialPanel{grid-row:5}.left-panel,.tutorial-active .left-panel{grid-row:6}.vision-bar,.tutorial-active .vision-bar{grid-row:6}.right-panel,.tutorial-active .right-panel{grid-row:7 / span 2}.nav-hud,.tutorial-active .nav-hud{grid-row:7}.bottom{grid-row:9}}
@media(max-width:620px){.left-panel,.tutorial-active .left-panel{grid-row:7}.vision-bar,.tutorial-active .vision-bar{grid-row:6}.nav-hud,.tutorial-active .nav-hud{grid-row:8}.right-panel,.tutorial-active .right-panel{grid-row:9}.bottom{grid-row:10}}
