:root{color-scheme:dark;--bg:#06111b;--white:#e9f7ff;--dim:#7895aa;--cyan:#4df5e8;--line:#284456;--panel:#071521;--font:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Arial,sans-serif}
*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;background:var(--bg);font-family:var(--font);color:var(--white);overflow:hidden}
body{background:radial-gradient(ellipse at 46% 44%,#143047 0%,#091d30 37%,#06121e 65%,#020710 100%)}
button,input{font:inherit}button{cursor:pointer}#app{display:grid;grid-template-columns:minmax(0,1fr) 350px;height:100vh;min-height:440px}
#viewport{position:relative;overflow:hidden;isolation:isolate;min-width:0;background:radial-gradient(ellipse at 52% 48%,rgba(25,75,104,.26),transparent 56%)}
#viewport:after{pointer-events:none;content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,11,19,.5),transparent 29%,transparent 75%,rgba(2,11,19,.15)),linear-gradient(0deg,rgba(2,11,19,.9),transparent 20%,transparent 83%,rgba(2,11,19,.6));}
#stage{width:100%;height:100%;display:block;touch-action:none;cursor:grab;position:absolute;inset:0}#stage:active{cursor:grabbing}
.topLeft{position:absolute;z-index:2;top:30px;left:40px;pointer-events:none}.wordmark{font-size:16px;font-weight:900;letter-spacing:.095em;display:flex;align-items:center;gap:2px}.wordmark>span:nth-of-type(2){color:var(--cyan)}.wordmark small{font-size:10px;color:#7994a5;margin-left:2px}.mark{color:var(--cyan);font-weight:400;font-size:29px;margin-right:8px}.brandLine{display:block;width:34px;height:1px;background:var(--line);margin:0 10px}.prototype{font-size:9px;letter-spacing:.18em;color:var(--dim);font-weight:600}
.machineTitle{margin-top:78px;max-width:490px}.eyebrow{color:var(--cyan);font-size:10px;font-weight:750;letter-spacing:.23em}.machineTitle h1{font-size:clamp(38px,5.6vw,83px);font-weight:850;letter-spacing:-.075em;line-height:.89;margin:15px 0 17px}.machineTitle h1 em{font-style:normal;color:transparent;-webkit-text-stroke:1px #b8e4ef}.machineTitle h1 sup{font-size:15px;vertical-align:top;letter-spacing:.025em;color:var(--cyan);margin-left:12px;font-weight:600}.machineTitle p{font-size:12px;line-height:1.8;color:#9ab6c7;max-width:320px}.machineTitle p b{color:var(--cyan)}.chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:21px}.chips span{border:1px solid #285368;font-size:8px;letter-spacing:.09em;color:#a2c4d2;padding:8px 9px;background:#062334a1}.chips span:first-child{color:var(--cyan)}.chips i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#4bf2af;box-shadow:0 0 8px #4bf2af;margin-right:4px}
.leftScale{position:absolute;z-index:2;top:46%;left:39px;font-size:8px;color:#58758b;letter-spacing:.11em;display:flex;align-items:flex-start;flex-direction:column;gap:10px}.leftScale span{writing-mode:vertical-rl;transform:rotate(180deg);margin-bottom:20px}.leftScale .ruler{height:120px;width:13px;border-left:1px solid #4a6e80;background:repeating-linear-gradient(0deg,transparent 0 8px,#376173 9px 10px,transparent 10px 12px);opacity:.6}
.bottomHud{position:absolute;z-index:2;bottom:43px;left:40px;right:40px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;pointer-events:none}.hudItem{border-top:1px solid #385a67;padding-top:14px;min-width:0}.hudItem>small{font-size:9px;color:#8aaabc;letter-spacing:.13em;white-space:nowrap}.hudItem>strong{display:block;font-variant-numeric:tabular-nums;font-size:clamp(17px,2.2vw,30px);line-height:1.6;font-weight:650}.hudItem>strong small{font-size:11px;color:var(--cyan)}.meter{height:3px;background:#1a394a;margin-top:5px;overflow:hidden}.meter span{height:100%;width:78%;display:block;background:#37e6c9;box-shadow:0 0 6px #37e6c9}.meter.blue span{background:#359feb;width:99%}.tinyText{margin-top:8px;font-size:8px;color:#5f8ca1;letter-spacing:.1em}.viewHints{position:absolute;right:24px;top:27px;z-index:2;display:flex;gap:18px;font-size:9px;color:#557b91;letter-spacing:.1em}
#panel{z-index:3;background:linear-gradient(135deg,#081b28,#071522 58%,#05101b);border-left:1px solid #2a485c;padding:27px 22px 18px;overflow:auto;scrollbar-color:#254458 transparent;scrollbar-width:thin;box-shadow:-15px 0 60px #0004}#panel header{padding-bottom:24px}.sectionIndex{font-size:10px;letter-spacing:.18em;color:var(--cyan);font-weight:700}.panelTitle{font-size:23px;font-weight:850;letter-spacing:-.04em;margin:9px 0 7px}.panelTitle span{font-weight:300;color:#8ccfdf}.panelSub{font-size:9px;letter-spacing:.11em;color:#6f94aa}.sectionHeader{display:flex;justify-content:space-between;border-top:1px solid #294656;padding-top:14px;margin-top:11px;color:#89acbf;font-weight:700;letter-spacing:.14em;font-size:10px}.led{height:7px;width:7px;border-radius:50%;background:#4ae3b4;box-shadow:0 0 8px #4ae3b4}.controls{padding-top:8px}.sliderControl{display:block;padding:10px 0 7px;position:relative}.sliderControl span{font-size:12px;color:#bed2de}.sliderControl output{position:absolute;right:0;top:10px;color:var(--cyan);font-weight:700;font-size:11px;font-variant-numeric:tabular-nums}.sliderControl input{appearance:none;width:100%;height:4px;margin:15px 0 3px;background:linear-gradient(90deg,#44dbce 45%,#284352 45%);cursor:pointer;border-radius:4px}.sliderControl input::-webkit-slider-thumb{appearance:none;width:12px;height:12px;background:#dffdfd;border:2px solid #54dbc9;border-radius:50%;box-shadow:0 0 10px #33cebf55}.sliderControl input::-moz-range-thumb{width:9px;height:9px;background:#dffdfd;border:2px solid #54dbc9;border-radius:50%}
.presets{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;margin-top:16px}.preset{height:36px;border:1px solid #2b4b5a;background:#0d2433;color:#789dae;font-size:10px;letter-spacing:.12em;font-weight:750}.preset.active,.preset:hover{border-color:#42cabf;background:#143b45;color:#9ef6e9}.switches{margin:16px 0}.switchRow{display:flex;align-items:center;justify-content:space-between;padding:10px 0;cursor:pointer}.switchRow>span:first-of-type{font-size:11px;font-weight:600;color:#bfd2dd}.switchRow small{display:block;font-size:9px;letter-spacing:.015em;font-weight:400;color:#7293a6;margin-top:4px}.switchRow input{position:absolute;opacity:0;pointer-events:none}.track{border:1px solid #426173;background:#1a3041;border-radius:20px;width:34px;height:19px;flex:none;position:relative}.track:after{content:'';position:absolute;left:3px;top:3px;width:11px;height:11px;background:#7193a6;border-radius:50%;transition:.18s}.switchRow input:checked+.track{background:#0d6969;border-color:#28a99e}.switchRow input:checked+.track:after{transform:translateX(15px);background:#b6fff6}
.actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.actions button{padding:11px 6px;border:1px solid #315266;border-radius:0;color:#a2c4d5;background:#0d2230;font-size:10px;font-weight:750;letter-spacing:.065em}.actions .primary{grid-column:span 2;background:#3fe1ce;color:#06252c;border:0;font-size:11px}.actions button:hover{filter:brightness(1.2)}.actions button:focus-visible,.preset:focus-visible{outline:2px solid #c8fffa;outline-offset:2px}.legalLine{font-size:8px;line-height:2;color:#64869b;letter-spacing:.1em;border-top:1px solid #284253;margin-top:20px;padding-top:15px}.legalLine b{color:#9dc1d3}.orbitDot{display:inline-block;height:6px;width:6px;background:#3cd4cf;border-radius:50%;margin-right:7px}
#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(100px);z-index:99;transition:transform .25s;background:#0c2f38;color:#d0fff5;border:1px solid #3cd4cf;padding:13px 20px;font-size:12px;pointer-events:none}#toast.visible{transform:translateX(-50%) translateY(0)}
@media(max-height:850px){.machineTitle{margin-top:38px}.leftScale{display:none}.bottomHud{bottom:24px}.machineTitle h1{font-size:52px}}@media(max-width:1050px){#app{grid-template-columns:minmax(0,1fr) 310px}.topLeft{left:26px}.bottomHud{left:26px;right:24px;gap:12px}.machineTitle h1{font-size:49px}.viewHints{display:none}}@media(max-width:750px){html,body{overflow:auto}#app{display:flex;flex-direction:column;height:auto;min-height:100vh}#viewport{height:72vh;min-height:520px;flex:none}#panel{border-top:1px solid #2a485c;border-left:0;max-height:none}.machineTitle{margin-top:55px}.machineTitle h1{font-size:55px}.bottomHud{left:25px;right:20px;bottom:16px;grid-template-columns:repeat(2,1fr);gap:8px}.hudItem:nth-child(n+3){display:none}.topLeft{left:25px;top:22px}.prototype,.brandLine{display:none}.leftScale{display:none}}
