:root{font-family:Inter,"Aptos",system-ui,-apple-system,"Segoe UI",sans-serif;color:#e3ecf4;background:#06101c;font-synthesis:none;text-rendering:optimizeLegibility}
*{box-sizing:border-box}html,body,#app{height:100%;margin:0}body{overflow:hidden}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #69d9ed;outline-offset:2px}
.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 27px;background:#0c1827;border-bottom:1px solid #223449;position:relative;z-index:3}
.brand{display:flex;align-items:center;gap:12px}.brandmark{width:40px;height:40px;display:grid;place-items:center;position:relative;border:1px solid #6b8798;transform:rotate(45deg)}.brandmark span{font-weight:900;font-size:25px;color:#c4dcdf;transform:rotate(-45deg)}.brandtext strong{display:block;font-weight:800;letter-spacing:.17em;font-size:16px}.brandtext strong em{font-style:normal;color:#61acc4}.brandtext small{color:#8595a8;font-size:9px;font-weight:750;letter-spacing:.22em}.topright{display:flex;gap:20px;align-items:center;color:#7890a7}.stamp{font-size:10px;letter-spacing:.12em;color:#e4b47c;background:#3b302e66;padding:10px 14px;border:1px solid #a37a4c55}.projectcode{font-size:10px;letter-spacing:.15em}.projectcode b{color:#d0aa72}.separate{height:22px;width:1px;background:#344053}
.workspace{height:calc(100% - 76px);display:grid;grid-template-columns:302px minmax(0,1fr) 285px}.sidebar,.telemetry{background:#0b1726;overflow:auto;scrollbar-width:thin;scrollbar-color:#34495d transparent}.sidebar{padding:26px 23px 22px;border-right:1px solid #243449}.telemetry{padding:27px 23px;border-left:1px solid #243449}.eyebrow,.smalllabel{display:block;font-weight:800;font-size:10px;letter-spacing:.18em;color:#74adc2}.sectiontop h1{font-weight:760;font-size:28px;letter-spacing:-.042em;line-height:1.12;margin:20px 0 14px}.sectiontop h1 span{color:#dcae75}.sectiontop p{color:#93a5b9;font-size:12px;line-height:1.65;margin:0 0 27px}.smalllabel{margin-bottom:13px}
.buttonrow{display:flex;gap:8px}.buttonrow button{flex:1;min-width:0}.buttonrow button,.presets button,.quality button,.viewcmd button{border:1px solid #35495c;background:#16293a;color:#e0ebf4;font-size:10px;font-weight:800;letter-spacing:.055em;white-space:nowrap;border-radius:3px;padding:13px 10px;transition:background .15s, border-color .15s}.buttonrow button:hover,.quality button:hover,.presets button:hover{border-color:#72bfd2;background:#1c3850}.buttonrow .primary{background:#b98249;color:#101720;border-color:#d2a66d}.buttonrow .accent{background:#26526b;border-color:#4b829b;color:#ccebf5}
.presets{display:grid;grid-template-columns:1fr 1fr;gap:7px}.presets button{font-size:9px;padding:12px 4px;color:#91a5b6}.presets button.selected,.quality button.selected{background:#214b61;color:#b0e6ec;border-color:#69c3d8}.rule{border-top:1px solid #2b3c4f;margin:23px 0}.knob{margin:21px 0 24px}.knob label{display:flex;justify-content:space-between;gap:6px;align-items:center;margin-bottom:13px}.knob label span{font-weight:780;font-size:10px;letter-spacing:.075em;color:#bbc9d7}.knob label i{font-size:10px;font-style:normal;color:#71899e;text-transform:none;letter-spacing:0}.knob output{font-size:13px;font-weight:800;color:#e4b37b;font-variant-numeric:tabular-nums}.knob input{width:100%;accent-color:#e3af6e;height:5px;cursor:pointer;margin:0}.scalebar{display:flex;justify-content:space-between;color:#6d8295;font-size:9px;margin-top:9px}.notes{color:#748b9c;border-left:2px solid #806645;padding-left:12px;font-size:10px;line-height:1.65;margin-top:29px}
.viewport{position:relative;min-width:0;overflow:hidden;background:radial-gradient(ellipse at 50% 45%,#132739,#070f1d 72%)}#scene{position:absolute;inset:0}#scene canvas{display:block;touch-action:none}.viewportTop,.viewportBottom{pointer-events:none;position:absolute;right:20px;left:20px;display:flex;justify-content:space-between;align-items:center;gap:15px;z-index:2}.viewportTop{top:22px}.viewportBottom{bottom:20px}.viewtag{display:flex;align-items:center;gap:8px;background:#0c1c2fc7;border:1px solid #30526d8c;padding:11px 13px;font-size:9px;letter-spacing:.12em;font-weight:800;color:#b1d7e2}.viewtag b{color:#6f9bb0;font-weight:700}.pulse{height:7px;width:7px;background:#7cd5b8;border-radius:50%;box-shadow:0 0 11px #7cd5b8}.viewcmd{display:flex;gap:7px;pointer-events:auto}.viewcmd button{background:#0c1c2fba;color:#b0c5d6;padding:10px 12px}.axis,.hint{font-size:9px;font-weight:750;letter-spacing:.1em;color:#a5bccc;background:#0c1c2fb0;border:1px solid #30435966;padding:10px 13px}.axis span{font-size:11px;margin-left:7px}.axisx{color:#e5a26a}.axisy{color:#b2deb0}.axisz{color:#78bfdf}.hint{color:#8aa3b7}
.metric-main{margin:23px 0}.metric-main small,.metric-main span{display:block;font-size:10px;color:#819bac;letter-spacing:.11em;font-weight:750}.metric-main strong{font-size:68px;letter-spacing:-.08em;font-weight:740;line-height:1.25;color:#d9e9f2;font-variant-numeric:tabular-nums}.metric-main span{font-size:9px;color:#e3b079}select{width:100%;color:#c6d9e6;background:#13283a;border:1px solid #355267;border-radius:3px;padding:11px;font-size:11px;margin-bottom:11px}.readout>div{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid #1f3144;padding:12px 0}.readout span{font-size:9px;letter-spacing:.07em;color:#879cad;font-weight:700}.readout strong{color:#e4edf2;font-size:18px;font-weight:740;font-variant-numeric:tabular-nums;white-space:nowrap}.readout strong em{font-style:normal;color:#819bac;font-size:10px;font-weight:600}.chartHeader{display:flex;justify-content:space-between;gap:4px;align-items:center}.chartHeader .smalllabel{margin:0}.chartHeader small{font-size:8px;color:#819aac;letter-spacing:.06em}.chartHeader>span{font-size:10px;color:#e0af72;font-variant-numeric:tabular-nums}#trace{width:100%;height:118px;display:block;margin:13px 0 0;border:1px solid #223e51;background:#091b2b}.quality{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:22px}.quality button{padding:11px 6px;font-size:9px}.stats{display:flex;justify-content:space-between;align-items:center;color:#819aac;font-size:10px;font-weight:700;letter-spacing:.08em;margin:12px 0}.stats b{font-size:11px;color:#d7e8ef}.footnote{font-size:9px;font-family:ui-monospace,SFMono-Regular,monospace;color:#7791a4;line-height:1.9;border-top:1px solid #2b3c4f;padding-top:17px;margin-top:23px}.footnote span{color:#83cdae;float:right}
@media(max-width:1250px){.workspace{grid-template-columns:278px minmax(0,1fr) 248px}.sidebar,.telemetry{padding:21px 17px}.viewtag b,.hint{display:none}}
@media(max-width:920px){body{overflow:auto}.topbar{height:66px}.topright{display:none}.workspace{height:auto;min-height:calc(100vh - 66px);grid-template-columns:1fr 1fr}.viewport{height:64vh;min-height:390px;grid-column:1 / -1;grid-row:1}.sidebar{grid-column:1;grid-row:2}.telemetry{grid-column:2;grid-row:2}}
@media(max-width:540px){.workspace{display:flex;flex-direction:column}.viewport{order:0;min-height:360px;height:53vh;flex:none}.sidebar{order:1}.telemetry{order:2}.sidebar,.telemetry{border-left:0;border-right:0;border-top:1px solid #26394f}.viewportTop,.viewportBottom{left:10px;right:10px}.viewtag{font-size:8px}.viewcmd button span,.axis{display:none}.sectiontop h1{font-size:27px}}