:root{color-scheme:dark;--background:#07101b;--panel:#101e2b;--outline:#24374a;--text:#e9f0f4;--sub:#8fa9ba;--muted:#638096;--amber:#ffb77a;--teal:#54ded3;--deep:#0c1724;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse 100% 52% at 42% -20%,#1c3b51 0,transparent 85%),var(--background);min-height:100vh;color:var(--text)}button,select,input{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--teal);outline-offset:3px}.app{max-width:1680px;margin:auto;padding:0 26px}.topbar{display:flex;justify-content:space-between;align-items:center;height:98px;border-bottom:1px solid #263a48;gap:20px}.identity,.topright{display:flex;align-items:center;gap:17px}.logo{font-size:35px;line-height:1;font-weight:800;color:#f2b178;letter-spacing:-7px;border:1px solid #7b6a54;border-radius:13px;width:58px;height:58px;display:flex;align-items:center;justify-content:center;padding-right:5px}.logo span{font-size:15px;vertical-align:super;margin-top:-23px;margin-left:3px;color:#5ce3d3}.eyebrow{color:#79a9b7;text-transform:uppercase;letter-spacing:2px;font-size:10px;font-weight:700;margin:0 0 5px}.identity h1{margin:0;font-size:24px;letter-spacing:2px;font-weight:750}.identity h1 span{font-weight:400;color:#aec0ca}.topright{font-size:10px;letter-spacing:1.2px;color:#adbec8;font-weight:750;white-space:nowrap}.statusdot,.live-dot{width:8px;height:8px;border-radius:50%;background:#63eac4;box-shadow:0 0 12px #35c7ad}.edition{background:#152636;border:1px solid #2b4253;padding:10px 13px;border-radius:4px;margin-left:14px;color:#91a8b8}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px;padding:22px 0}.left-column{min-width:0;display:flex;flex-direction:column;gap:16px}.panel{border:1px solid var(--outline);background:linear-gradient(135deg,#112334,#0b1724 75%);border-radius:9px;overflow:hidden}.viewhead{display:flex;justify-content:space-between;align-items:flex-start;padding:23px 25px 14px;gap:15px}.viewhead h2,.control-intro h2{margin:0;font-size:20px;letter-spacing:-.4px;font-weight:650}.description{margin:9px 0 0;font-size:12px;color:var(--sub)}.live{font-size:9px;letter-spacing:1.3px;font-weight:800;color:#89e7d8;padding:8px 10px;border:1px solid #265652;border-radius:5px;white-space:nowrap;display:flex;align-items:center;gap:9px}.live-dot{height:6px;width:6px}.viewer #stage{height:500px;position:relative;overflow:hidden;background:radial-gradient(ellipse 42% 35% at 52% 48%,#21415b85,transparent),linear-gradient(140deg,#0e1c2b 0%,#0a1624 75%)}#stage canvas{width:100%;height:100%;display:block}#fallbackCanvas{position:absolute;inset:0}#stage canvas.webgl{position:absolute;inset:0;touch-action:none;cursor:grab}#stage canvas.webgl:active{cursor:grabbing}.stage-grain{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 47px,#8bb6c606 48px 49px);border-top:1px solid #1e374c}.stage-caption{position:absolute;bottom:16px;left:20px;right:20px;display:flex;justify-content:space-between;gap:14px;font-family:ui-monospace,monospace;font-size:10px;color:#78a4b8;letter-spacing:1.1px;pointer-events:none}.stage-caption span:first-child{color:#dcab7c}.coords{position:absolute;top:23px;right:24px;line-height:1.6;font:12px ui-monospace,monospace;color:#86abc0;pointer-events:none}.coords b{color:#f4b57f}.toolbar{border-top:1px solid #21384a;display:flex;align-items:center;flex-wrap:wrap;gap:9px;padding:14px 18px;background:#111f2d}.toolbar button{background:#1a2c3b;border:1px solid #365066;color:#d4e5ed;border-radius:5px;padding:10px 14px;font-weight:750;letter-spacing:.7px;font-size:10px;white-space:nowrap;transition:background .2s}.toolbar button:hover{background:#274459}.toolbar button.primary{background:#3b7772;color:#e1fffa;border-color:#45968d}.toolbar button.accent{background:#5a3b2c;border-color:#9b6645;color:#ffcd9e}.toolspacer{flex:1}.toggle{font-size:10px;font-weight:750;letter-spacing:.5px;white-space:nowrap;display:flex;align-items:center;gap:5px;color:#abc1d0}.toggle input{accent-color:#40cdc2}.telemetry-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.metric{padding:17px 17px 15px;border-radius:7px;border:1px solid #294253;background:linear-gradient(155deg,#1a2b3a,#101c2a)}.metric p{color:#90acbc;margin:0 0 11px;font-size:10px;letter-spacing:1.2px;font-weight:800}.metric strong{display:block;font:600 clamp(21px,2.2vw,28px) ui-monospace,monospace;letter-spacing:-1.1px;color:#f2f4f0}.metric:first-child strong{color:#74e8db}.metric:nth-child(3) strong{color:#f8bc83}.metric span{display:block;color:#88a0b1;font-size:10px;margin-top:5px}.charts{padding:19px 21px 15px}.chart-header{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.chart-header h3{margin:0;font-size:17px}.legend{display:flex;gap:16px;color:#aac0ca;font-size:11px}.legend span{display:flex;align-items:center;gap:7px}.legend i{display:inline-block;height:3px;width:20px}.legend .teal{background:var(--teal)}.legend .amber{background:var(--amber)}#scope{display:block;width:100%;height:210px;margin-top:15px}.footnotes{border-top:1px solid #283b4b;padding:15px 2px 2px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;font-size:10px;letter-spacing:.6px;color:#759bad}.footnotes b{color:#dceaf1}.controls{padding:0;max-height:calc(100vh - 132px);overflow:auto;scrollbar-color:#315469 #111e2b;scrollbar-width:thin}.control-intro{padding:23px 23px 18px;border-bottom:1px solid #223747}.control-intro p:last-child{color:#9ab3c2;font-size:12px;line-height:1.55;margin:10px 0 0}.controlgroup{padding:17px 23px 8px;border-bottom:1px solid #243a4b}.grouphead{font:600 10px ui-monospace,monospace;color:var(--amber);display:flex;gap:13px;margin-bottom:18px;letter-spacing:1.3px}.grouphead span{color:#e4edf3}.selectlabel{display:grid;gap:7px;color:#b4c8d3;font-size:11px;margin-bottom:17px}select{padding:9px;background:#0d1d2a;color:#dcebf2;border:1px solid #344d5e;border-radius:4px;width:100%}.control-field{margin-bottom:16px}.control-field .pair{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:11px;color:#aec2ce;margin-bottom:9px}.control-field output{color:#79ebda;font-family:ui-monospace,monospace;font-size:12px;font-weight:750}.control-field input{appearance:none;width:100%;height:4px;border-radius:4px;background:linear-gradient(90deg,#48bcaf var(--progress),#314458 var(--progress));display:block;cursor:pointer}.control-field input::-webkit-slider-thumb{appearance:none;width:13px;height:13px;border-radius:50%;background:#87e9db;border:2px solid #0c2630;box-shadow:0 0 0 1px #46a79d}.control-field input::-moz-range-thumb{width:10px;height:10px;border-radius:50%;background:#87e9db;border:2px solid #0c2630}.control-field[data-disabled="true"]{opacity:.4}.control-note{padding:19px 23px 23px;color:#91aaba;font-size:11px;line-height:1.6}.control-note strong{color:#f0bc8b;letter-spacing:1.3px;font-size:10px}.control-note p{margin:10px 0}.control-note #validationMessage{border-left:2px solid #5ed9bd;padding-left:10px;color:#c9dce4}.control-note #validationMessage.error{border-color:#ff9c88;color:#ffb3a4}footer{border-top:1px solid #284050;padding:19px 0 27px;color:#7894a5;font-size:11px}footer a{color:#8de5d9}@media(max-width:1100px){.workspace{grid-template-columns:minmax(0,1fr) 300px}.controls{max-height:none}.metric{padding:14px}.metric strong{font-size:22px}.viewer #stage{height:450px}}@media(max-width:860px){.workspace{display:flex;flex-direction:column}.controls{order:1}.topright .edition{display:none}.viewer #stage{height:470px}.telemetry-row{grid-template-columns:repeat(2,minmax(0,1fr))}.controlgroup{display:block}.control-intro{padding:22px}.controls{max-height:none}}@media(max-width:530px){.app{padding:0 12px}.topbar{height:82px}.identity h1{font-size:19px}.logo{width:47px;height:47px;font-size:27px}.identity .eyebrow{font-size:8px}.topright{font-size:8px}.viewhead{padding:18px 15px 12px;display:block}.viewhead .live{margin-top:14px;width:max-content}.viewhead h2{font-size:18px}.viewer #stage{height:400px}.toolbar{padding:12px}.toolbar button{padding:9px 11px}.toolspacer{flex-basis:100%}.stage-caption{font-size:8px;left:10px;right:10px}.stage-caption span:last-child{display:none}.chart-header{align-items:flex-start;flex-direction:column;gap:10px}.charts{padding:15px}.telemetry-row{gap:7px}.metric p{font-size:9px}.metric strong{font-size:23px}}
