:root{--bg:#0a0e14;--panel:rgba(12,18,26,.76);--line:rgba(198,172,121,.28);--gold:#c6ac79;--cyan:#62e7ed;--muted:#74808d;--danger:#c76b60}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:#d7dde3;font-family:Consolas,"Roboto Mono",monospace}body{overflow-x:hidden;background:radial-gradient(circle at 50% 42%,#16212c 0,#0a0e14 42%,#070a0e 100%)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 49.9%,rgba(98,231,237,.04) 50%,transparent 50.1%),linear-gradient(rgba(255,255,255,.015) 1px,transparent 1px);background-size:100% 100%,100% 4px}
.scanlines{position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.12;background:repeating-linear-gradient(0deg,transparent 0 3px,#000 4px)}
.topbar,footer{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,3vw,52px);border-bottom:1px solid var(--line);background:rgba(6,9,13,.86);letter-spacing:.12em;font-size:12px}.brand{display:flex;align-items:center;gap:14px;color:var(--gold);font-weight:700}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border:1px solid var(--gold);clip-path:polygon(15% 0,85% 0,100% 50%,85% 100%,15% 100%,0 50%)}sup{font-size:8px}.system-state{color:var(--muted)}.system-state i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px var(--gold);margin-right:8px}
.command-grid{min-height:calc(100vh - 100px);display:grid;grid-template-columns:minmax(220px,280px) minmax(360px,1fr) minmax(220px,280px);gap:clamp(14px,2vw,30px);align-items:center;padding:26px clamp(18px,3vw,52px)}
.intel-column{display:grid;gap:14px;z-index:3}.panel{position:relative;padding:18px;border:1px solid var(--line);background:linear-gradient(135deg,rgba(20,28,38,.83),rgba(8,12,17,.73));clip-path:polygon(0 0,calc(100% - 13px) 0,100% 13px,100% 100%,13px 100%,0 calc(100% - 13px));box-shadow:inset 0 0 24px rgba(0,0,0,.28)}.panel:before{content:"";position:absolute;left:0;top:0;width:46px;height:2px;background:var(--cyan)}.panel-label{color:var(--cyan);font-size:10px;letter-spacing:.16em;margin-bottom:13px}.panel strong{display:block;color:#edf2f4;font-size:14px;letter-spacing:.06em}.panel>span,.panel p,.panel li{color:var(--muted);font-size:10px;line-height:1.7}.metric strong{font-size:38px;color:var(--gold)}.telemetry p{display:flex;justify-content:space-between;margin:8px 0}.telemetry b{color:var(--gold);font-size:10px}.readiness{text-align:center}.readiness .panel-label{text-align:left}.ring{width:112px;height:112px;border:2px solid rgba(198,172,121,.22);border-top-color:var(--gold);border-radius:50%;display:grid;place-content:center;margin:6px auto 12px;box-shadow:inset 0 0 22px rgba(198,172,121,.08)}.ring span{font-size:34px;color:var(--gold)}.ring small{color:var(--muted)}ol{padding-left:19px;margin-bottom:0}
.helm-stage{position:relative;min-height:min(78vh,780px);display:grid;place-items:center;isolation:isolate}#helm-canvas{position:absolute;inset:0;width:100%;height:100%;outline:none}.helm-stage:before{content:"";position:absolute;width:min(66vw,650px);aspect-ratio:1;border:1px solid rgba(98,231,237,.11);border-radius:50%;box-shadow:0 0 80px rgba(98,231,237,.04),inset 0 0 80px rgba(98,231,237,.025)}.reticle{position:absolute;inset:10% 8%;pointer-events:none}.reticle i{position:absolute;width:34px;height:34px;border-color:var(--gold);opacity:.55}.reticle i:nth-child(1){left:0;top:0;border-left:1px solid;border-top:1px solid}.reticle i:nth-child(2){right:0;top:0;border-right:1px solid;border-top:1px solid}.reticle i:nth-child(3){left:0;bottom:0;border-left:1px solid;border-bottom:1px solid}.reticle i:nth-child(4){right:0;bottom:0;border-right:1px solid;border-bottom:1px solid}.load-state{position:absolute;z-index:4;color:var(--cyan);font-size:10px;letter-spacing:.14em}.load-state span{color:var(--gold)}.helm-status{position:absolute;z-index:3;bottom:4%;text-align:center;pointer-events:none}.helm-status small{color:var(--cyan);letter-spacing:.25em}.helm-status h1{margin:7px 0 13px;color:var(--gold);font:600 clamp(26px,3vw,42px)/1 Arial,sans-serif;letter-spacing:.28em;text-indent:.28em;text-shadow:0 0 20px rgba(198,172,121,.22)}button{pointer-events:auto;border:1px solid var(--gold);background:rgba(10,14,20,.8);color:var(--gold);padding:12px 24px;font:11px Consolas,monospace;letter-spacing:.13em;cursor:pointer;clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px)}button:hover:not(:disabled){color:#071014;background:var(--cyan);border-color:var(--cyan);box-shadow:0 0 28px rgba(98,231,237,.28)}button:disabled{opacity:.35;cursor:default}.interaction-hint{position:absolute;right:5%;bottom:3%;font-size:9px;color:var(--muted);letter-spacing:.14em}
footer{height:42px;border-top:1px solid var(--line);border-bottom:0;color:#596470;font-size:9px}
body.armed .system-state{color:var(--cyan)}body.armed .system-state i{background:var(--cyan);box-shadow:0 0 14px var(--cyan)}body.armed .helm-status h1{color:var(--cyan);text-shadow:0 0 24px rgba(98,231,237,.45)}body.armed .helm-stage:before{border-color:rgba(98,231,237,.3);box-shadow:0 0 120px rgba(98,231,237,.1),inset 0 0 100px rgba(98,231,237,.06)}
@media(max-width:960px){.command-grid{grid-template-columns:1fr 1fr}.helm-stage{grid-column:1/-1;grid-row:1;min-height:65vh}.intel-column{align-self:start}.interaction-hint{display:none}}
@media(max-width:620px){.system-state{display:none}.command-grid{display:flex;flex-direction:column;padding:12px}.helm-stage{width:100%;min-height:62vh;order:0}.intel-column{width:100%;grid-template-columns:1fr}.left{order:1}.right{order:2}.topbar{height:52px}.panel{padding:15px}.helm-status{bottom:1%}footer{padding:0 14px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}