:root{color-scheme:dark;--bg:#0d151b;--panel:#131c24;--line:#293741;--muted:#788d9a;--foreground:#e7e7df;--cyan:#78cbd5;--copper:#c89970}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--foreground);font-family:Inter,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}button,select,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}#app{min-height:100vh;display:flex;flex-direction:column}.topbar{height:78px;flex-shrink:0;border-bottom:1px solid #2a3842;display:flex;align-items:center;gap:4.4vw;padding:0 3.4%;background:#0c151b}.brand{display:flex;gap:16px;align-items:center}.brandmark{height:37px;width:35px;display:grid;place-items:center;border:1px solid #9db4b8;position:relative;font:700 27px Georgia,serif;letter-spacing:-4px;padding-right:5px;color:#e4f4eb}.brandpulse{display:block;position:absolute;width:9px;height:9px;right:-5px;top:-5px;background:var(--cyan)}.brand-name{font-size:11px;letter-spacing:.22em;white-space:nowrap}.brand-name b{color:var(--cyan);font-weight:500}.topbar-meta{display:flex;align-items:center;gap:21px;color:#768994;font-size:10px;letter-spacing:.14em}.tiny-separator{height:18px;width:1px;background:#3b4a53}.version-tag{color:#bfcdc9}.topbar-right{margin-left:auto;color:#a8b6ba;font-size:10px;letter-spacing:.17em;white-space:nowrap}.live-light{width:6px;height:6px;border-radius:50%;background:#82d0ab;box-shadow:0 0 12px #82d0ab;display:inline-block;margin-right:9px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 385px;max-width:2048px;width:100%;margin:auto;flex:1}.maincol{min-width:0;padding:31px 36px 38px;display:flex;flex-direction:column;background:radial-gradient(ellipse at 37% 29%,#18232b 0,#101920 45%,#101920 100%)}.intro{position:relative;z-index:1;padding-bottom:14px}.eyebrow{font-size:11px;letter-spacing:.23em;display:flex;align-items:center;gap:15px;color:#b6d1d6}.eyebrow>span:first-child{font-weight:750;color:#7dcfda}.mini-line{height:1px;background:#526571;width:24px}.small-index{color:#586c77;margin-left:auto}.intro h1{font-size:clamp(46px,4.1vw,80px);line-height:.94;letter-spacing:-.055em;margin:26px 0 19px;font-weight:540}.intro h1 em,.sidebar-title em{font-family:Georgia,Times,serif;font-weight:400;color:#b8c7c5}.intro p{font-size:13px;line-height:1.8;color:#c2cfd2;margin:0}.intro p span{font-size:10px;color:#758c99;letter-spacing:.15em}.viewport{position:relative;height:clamp(405px,43vw,620px);overflow:hidden;border:1px solid #30424c;background:radial-gradient(circle at 55% 47%,#283941 0%,#141f27 46%,#0a141c 100%);margin:10px 0 0;isolation:isolate}.render{position:absolute;inset:0}.render canvas{width:100%;height:100%;display:block;outline:none}.viewport-top,.viewport-bottom{position:absolute;left:25px;right:25px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.viewport-top{top:24px}.viewport-bottom{bottom:19px}.view-id{font-size:10px;letter-spacing:.16em;color:#c6d7d8}.plus-icon{color:var(--cyan);font-size:17px;vertical-align:middle;margin-right:8px}.view-index{color:#75909b;margin-left:8px}.view-dot{color:#8bd2b1;font-size:9px;letter-spacing:.14em}.view-dot.paused{color:#e2ae81}.view-dot span{color:#cad6d5;margin-left:4px}.viewport-side{position:absolute;left:20px;top:45%;display:flex;align-items:center;gap:12px;writing-mode:vertical-rl;transform:rotate(180deg);font-size:9px;letter-spacing:.22em;color:#8097a0;pointer-events:none}.viewport-side div{height:37px;width:1px;background:#6b8792}.camera-controls{display:flex;gap:8px;pointer-events:auto}.camera-controls button{border:1px solid #4a6570;background:#13232bd9;color:#d7e5e5;padding:11px 14px;font-size:10px;letter-spacing:.11em}.camera-controls button:hover{background:#29414d}.camera-tip{font-size:9px;letter-spacing:.13em;color:#9aadb4}.telemetry{margin-top:32px}.telemetry-head,.below-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.section-marker,.blocklabel{font-size:10px;letter-spacing:.19em;color:#abc2c8;font-weight:670}.tick{color:#8fa9b4;font-size:10px;letter-spacing:.13em}.tick:first-letter{color:var(--cyan)}.telemetry-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid #34414a}.reading{padding:20px 21px 18px;border-right:1px solid #34414a;min-width:0}.reading:last-child{border:0}.reading-label{display:flex;justify-content:space-between;color:#a8c1c6;font-size:9px;letter-spacing:.1em;white-space:nowrap;gap:6px}.reading-label span{color:#657d89}.reading-value{display:flex;align-items:baseline;gap:7px;margin-top:13px}.reading-value strong{font-size:clamp(25px,2.2vw,36px);letter-spacing:-.07em;font-weight:480;font-variant-numeric:tabular-nums}.reading-value>span{font-size:10px;color:var(--cyan)}.reading-bottom{margin-top:8px;color:#738c98;font-size:9px;letter-spacing:.08em}.below{margin-top:28px}.legend{font-size:9px;letter-spacing:.10em;color:#98abb3}.legend i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--cyan);margin-right:5px}.legend i.legend-copper{background:var(--copper)}.chart-wrap{height:99px;position:relative;border:1px solid #2d3e48;overflow:hidden;background:linear-gradient(#18273088 1px,transparent 1px);background-size:100% 25%}.chart-wrap canvas{width:100%;height:100%;display:block}.chart-label{position:absolute;bottom:8px;right:12px;color:#516b78;font-size:8px;letter-spacing:.12em;pointer-events:none}.sidebar{background:#141e25;border-left:1px solid #31414a;padding:32px 27px 28px}.panel-head{display:flex;justify-content:space-between;gap:8px}.panel-version{font-size:10px;color:#69838f;letter-spacing:.08em}.sidebar-title{font-size:45px;line-height:.98;margin:28px 0 19px;letter-spacing:-.055em;font-weight:500}.sidebar-note{font-size:12px;line-height:1.75;color:#93a7af;margin:0 0 29px;max-width:320px}.blocklabel{color:#738b97;font-size:10px}.presetrow{margin:13px 0 32px;position:relative}.presetrow select{width:100%;appearance:none;border:1px solid #425560;border-radius:0;padding:13px 35px 13px 13px;background:#1c2a33;color:#d7e4e4;font-size:13px;cursor:pointer}.selectarrow{position:absolute;right:17px;top:8px;color:#9bb0b7;font-size:20px;pointer-events:none}.parameter-heading{display:flex;justify-content:space-between}.parameter-heading>span{color:#80bbbc}.controls{margin-top:18px;display:flex;flex-direction:column;gap:22px}.ctrl-title{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:10px}.ctrl-title label{font-size:10px;letter-spacing:.11em;color:#b7cbd0}.ctrl-title output{font-size:12px;color:#d2e1de;font-variant-numeric:tabular-nums}.control input[type=range]{--fill:50%;width:100%;margin:0;cursor:pointer;appearance:none;height:3px;border-radius:0;background:linear-gradient(to right,#83d1d4 var(--fill),#39505b var(--fill));outline-offset:8px}.control input::-webkit-slider-thumb{appearance:none;width:11px;height:11px;background:#dce7e5;border:2px solid #2a434c;border-radius:50%;box-shadow:0 0 0 2px #80cbd4}.control input::-moz-range-thumb{width:9px;height:9px;background:#dce7e5;border:2px solid #2a434c;border-radius:50%}.toggles{margin-top:27px;border-top:1px solid #32424b;border-bottom:1px solid #32424b}.switchline{padding:15px 0;display:flex;justify-content:space-between;align-items:center;gap:10px;cursor:pointer}.switchline+.switchline{border-top:1px solid #273640}.switchline b{display:block;font-weight:560;font-size:10px;letter-spacing:.11em;color:#c8dadb}.switchline small{display:block;font-size:10px;color:#77909b;margin-top:5px}.toggle{position:relative}.toggle input{position:absolute;opacity:0;inset:0}.toggle-ui{display:block;width:36px;height:21px;border-radius:20px;background:#425057;position:relative;transition:.15s}.toggle-ui:after{content:"";position:absolute;top:3px;left:3px;width:15px;height:15px;background:#aebbc0;border-radius:50%;transition:.15s}.toggle input:checked+.toggle-ui{background:#33666c}.toggle input:checked+.toggle-ui:after{left:18px;background:#a2eef0}.toggle input:focus-visible+.toggle-ui{outline:2px solid white}.sim-label{margin-top:27px}.transport{display:grid;grid-template-columns:1fr 46px 46px;gap:7px;margin-top:13px}.transport button{height:47px;border:1px solid #536772;background:#1e303a;color:#d0dadd;font-size:20px}.transport button.primary{font-size:11px;letter-spacing:.11em;background:#8ecdd0;color:#14272d;border-color:#8ecdd0;font-weight:700;display:flex;align-items:center;justify-content:center;gap:11px}.transport button:hover{filter:brightness(1.16)}.transport-sub{display:flex;justify-content:space-between;color:#68828c;font-size:9px;letter-spacing:.08em;margin-top:9px}.quality-heading{margin-top:32px}.quality-row{display:flex;align-items:center;justify-content:space-between;margin-top:13px;gap:10px}.quality{display:flex;gap:4px}.quality button{font-size:9px;letter-spacing:.1em;border:1px solid #3b515d;color:#9cb1b8;background:#18262f;padding:10px 12px}.quality button.selected{border-color:#91cfd4;color:#e2f8f7;background:#24424c}.quality-row>span{font-size:9px;letter-spacing:.07em;color:#74909b}.engineering{border:1px solid #43515a;background:#1a2931;margin-top:30px;padding:17px 18px}.engr-head{font-size:10px;letter-spacing:.15em;color:#ddbf9f}.engr-head span{font-size:15px;vertical-align:middle;margin-right:6px}.engineering p{font-size:11px;line-height:1.7;color:#91a8b1;margin:11px 0 0}footer{min-height:57px;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:16px 3.4%;border-top:1px solid #293944;font-size:9px;letter-spacing:.12em;color:#79919a}.slash{color:#527684;padding:0 8px}@media(max-width:1200px){.workspace{grid-template-columns:minmax(0,1fr) 350px}.maincol{padding:26px}.reading{padding:17px 13px}.reading-label{font-size:8px}.sidebar{padding:27px 23px}.topbar-meta{display:none}}@media(max-width:900px){.workspace{display:block}.maincol{padding:24px}.viewport{height:540px}.intro h1{font-size:65px}.sidebar{border-left:0;border-top:1px solid #31414a;display:grid;grid-template-columns:1fr 1fr;column-gap:35px}.panel-head,.sidebar-title,.sidebar-note,.parameter-heading,.controls,.toggles,.engineering{grid-column:1/-1}.controls{display:grid;grid-template-columns:1fr 1fr}.presetrow{grid-column:1/-1}.blocklabel{grid-column:1/-1}.transport,.transport-sub,.quality-row{grid-column:1/-1}.sidebar-title{margin-bottom:12px}.sidebar-note{max-width:none}}@media(max-width:570px){.topbar{height:63px}.brand-name{font-size:9px}.topbar-right{font-size:8px}.maincol{padding:19px}.intro h1{font-size:56px}.viewport{height:430px}.viewport-top,.viewport-bottom{left:12px;right:12px}.camera-tip{display:none}.viewport-side{display:none}.telemetry-grid{grid-template-columns:1fr 1fr}.reading:nth-child(2){border-right:0}.reading:nth-child(-n+2){border-bottom:1px solid #34414a}.reading-value strong{font-size:30px}.sidebar{display:block;padding:28px 20px}.controls{display:flex}.transport,.transport-sub,.quality-row{display:flex}.transport{display:grid}.footer{display:block}footer{flex-wrap:wrap}.topbar-right{display:none}}
