:root{color-scheme:dark;--bg:#07101a;--panel:#0d1a28;--line:#263648;--muted:#71849a;--txt:#e7f1f8;--teal:#64ddda;--orange:#ffad78;--blue:#73aaf2;--gold:#efd49b}
*{box-sizing:border-box}html,body{margin:0;min-width:320px;background:radial-gradient(ellipse 68% 36% at 42% -16%,#184256 0%,transparent 100%),#08111c;color:var(--txt);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:13px}button,select,input{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--teal);outline-offset:2px}.shell{max-width:1650px;margin:0 auto;padding:0 39px}.topbar{height:79px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #203145}.wordmark{display:flex;align-items:center;gap:13px}.logo{height:36px;width:37px;display:grid;place-items:center;border:1px solid #3a5a68;background:#122835;border-radius:9px}.wordmark strong{letter-spacing:.19em;font-size:15px;font-weight:850}.wordmark strong span{color:#83cdcf}.wordmark small{display:block;font-size:9px;letter-spacing:.21em;color:var(--muted);padding-top:5px}.header-right{display:flex;gap:23px;align-items:center}.session-label{font-size:10px;letter-spacing:.14em;color:#738a9b}.session-label b{color:#becdd7}.live-pill{font-size:10px;letter-spacing:.13em;border:1px solid #315f54;background:#12332878;border-radius:30px;padding:9px 13px;color:#9deec5}.live-pill i,.small-dot{display:inline-block;width:7px;height:7px;background:#64d69d;border-radius:50%;margin-right:8px;box-shadow:0 0 12px #64d69d}.heading{padding:32px 0 23px}.eyebrow,.overline{font-size:10px;color:#94a9bc;letter-spacing:.18em;font-weight:700}.eyebrow{color:#72bfc1}.accent-line{display:inline-block;width:21px;height:1px;background:#6fe0dd;vertical-align:middle;margin-right:10px}.separator{margin:0 7px;color:#4b6373}.heading h1{font-size:34px;letter-spacing:.035em;line-height:1.25;margin:12px 0 6px;font-weight:780}.heading h1>span{color:var(--teal)}.heading h1 em{font-style:normal;color:#98aabb;font-size:19px;font-weight:400;letter-spacing:0}.heading p{margin:0;color:#869bad;font-size:13px;line-height:1.5}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 345px;gap:18px;align-items:start}.main-column{min-width:0}.panel{border:1px solid var(--line);border-radius:11px;background:linear-gradient(125deg,#0e1e2df9,#0b1824fa);box-shadow:0 18px 44px #0000001b}.stage{height:460px;position:relative;overflow:hidden;background:radial-gradient(ellipse 65% 95% at 54% 42%,#1b3247 0%,#102236 54%,#0b1826 90%)}.stage:before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;background:linear-gradient(transparent 98%,#5d79941a 100%),linear-gradient(90deg,transparent 98%,#5d79941a 100%);background-size:39px 39px;mask-image:linear-gradient(to bottom,transparent 8%,black 40%,transparent 100%)}.stage:after{content:"";pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 120px 20px #07111d90}.stage-top,.stage-bottom{position:absolute;left:23px;right:23px;display:flex;align-items:center;justify-content:space-between;z-index:3}.stage-top{top:22px}.stage-bottom{bottom:18px}.stage-left>div{margin-top:10px;font-size:10px;letter-spacing:.09em;font-weight:700}.stage-count{font-size:9px;color:#8aa2b6;font-weight:500;letter-spacing:.12em;margin-left:8px}.view-buttons,.chart-actions{display:flex;gap:8px;align-items:center}.mini-button{background:#122638;border:1px solid #324a5e;color:#a8bdce;font-size:9px;letter-spacing:.07em;font-weight:700;border-radius:6px;padding:9px 10px;white-space:nowrap}.mini-button.active{border-color:#357977;color:#8be6dd;background:#10323c}.mini-button:hover,.transport-row button:hover,.preset-grid button:hover{border-color:#68b8c4;color:white}.stage canvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab;position:relative;z-index:1}.stage canvas:active{cursor:grabbing}.stage-hint{font-size:9px;font-weight:700;letter-spacing:.11em;color:#879fb3;display:flex;gap:6px;align-items:center}.hint-sep{margin:0 7px;color:#4f6377}.legend{font-size:9px;color:#9fb1c1;display:flex;gap:8px;align-items:center}.legend-bar{width:118px;height:7px;background:linear-gradient(to right,#196ebc,#4fe2ce,#ffe15c,#ff9f43,#f3442a);border-radius:10px}.probe-labels{position:absolute;inset:0;pointer-events:none;z-index:2;overflow:hidden}.probe-tag{position:absolute;display:flex;flex-direction:column;gap:2px;transform:translate(-50%,-100%);border:1px solid #38536dbd;background:#091a2acb;border-radius:5px;padding:5px 7px;box-shadow:0 3px 9px #0004;min-width:49px;align-items:center;white-space:nowrap}.probe-tag:after{content:'';position:absolute;width:1px;height:12px;top:100%;background:#6c9ca1}.probe-tag b{color:#8bcde3;font-size:9px;letter-spacing:.12em}.probe-tag span{color:#f1f7fc;font-size:10px;font-weight:800}.render-fallback{position:absolute;z-index:4;top:46%;left:9%;right:9%;background:#171e29ee;border:1px solid #b98570;padding:22px;line-height:1.6;text-align:center}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin:13px 0 17px}.metric{padding:19px 18px 16px}.metric-title{color:#97acbc;letter-spacing:.13em;font-size:9px;font-weight:800;display:flex;align-items:center;justify-content:space-between}.metric-indicator{height:6px;width:6px;border-radius:50%}.metric-indicator.orange{background:var(--orange)}.metric-indicator.teal{background:var(--teal)}.metric-indicator.blue{background:var(--blue)}.metric-indicator.gold{background:var(--gold)}.metric-value{margin:9px 0 3px;font-size:28px;letter-spacing:-.035em;font-variant-numeric:tabular-nums;font-weight:700}.metric-value small{color:#92a8b8;font-size:15px;font-weight:450}.metric-desc{font-size:9px;color:#778ea0}.chart-panel{padding:21px 22px 16px}.chart-heading{display:flex;justify-content:space-between;align-items:center}.chart-heading h2,.side-title h2{font-size:18px;margin:7px 0 0;font-weight:700;letter-spacing:-.02em}.muted-text{color:#8aa0b2;font-weight:400;font-size:12px}.chart-window{font-size:9px;font-weight:700;letter-spacing:.11em;color:#8097a9}.graph-wrap{height:219px;position:relative;margin-top:15px}.graph-wrap canvas{width:100%;height:100%}.chart-footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #26394b;padding-top:12px;margin-top:6px;gap:12px}.channel-legend{display:flex;flex-wrap:wrap;gap:12px}.channel-legend span{font-size:9px;font-weight:800;letter-spacing:.04em;color:#9dacc0;display:flex;gap:5px;align-items:center}.channel-legend i{height:3px;width:14px;border-radius:3px}.simtime{font-size:9px;white-space:nowrap;color:#8b9baa;letter-spacing:.1em}.simtime b{font-variant-numeric:tabular-nums;color:#e7eff4;font-size:11px;margin-left:6px}.sidebar{padding:24px 23px 22px}.side-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.side-title h2{font-size:21px;margin-top:7px}.gear-icon{font-size:23px;color:#647f92;border:1px solid #314659;border-radius:8px;width:37px;height:37px;display:grid;place-items:center}.control-label,.control-group label{font-size:10px;letter-spacing:.1em;color:#aec1ce;font-weight:750}.control-group{margin-bottom:23px}.control-group label{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.control-group output{color:var(--teal);letter-spacing:0;text-transform:none;font-size:11px;font-variant-numeric:tabular-nums}.control-group select{width:100%;background:#122535;color:#e4eff5;border:1px solid #304558;padding:11px 12px;border-radius:7px;margin-top:13px;outline-offset:1px;font-weight:650}.material-props{margin-top:10px;font-size:10px;color:#8195a5;white-space:normal}.material-props span{padding:0 7px}.divider{height:1px;background:#2a3b4c;margin:23px 0}.segmented{display:flex;background:#0a1421;border:1px solid #2a4052;border-radius:7px;margin-top:11px;padding:3px}.segmented button{border:0;border-radius:5px;flex:1;padding:10px 8px;font-size:10px;letter-spacing:.09em;color:#758da0;background:transparent;font-weight:800}.segmented button.selected{background:#23475a;color:#a9ebe4;box-shadow:0 1px 6px #0005}.control-group input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:5px;border-radius:9px;background:linear-gradient(to right,#3abdbb,#477389);outline:0;cursor:pointer}.control-group input[type=range]::-webkit-slider-thumb{appearance:none;width:15px;height:15px;border-radius:50%;border:3px solid #7ce5df;background:#103444;box-shadow:0 0 0 3px #65d9d914}.control-group input[type=range]::-moz-range-thumb{width:10px;height:10px;border-radius:50%;border:3px solid #7ce5df;background:#103444}.range-ends{display:flex;justify-content:space-between;color:#6c8396;font-size:9px;letter-spacing:.025em;margin-top:11px}.hidden{display:none!important}.transport{margin-top:18px}.primary{background:linear-gradient(110deg,#59c6bc,#2f8e98);color:#031b24;border:0;border-radius:7px;padding:15px 8px;width:100%;letter-spacing:.08em;font-size:11px;font-weight:900;box-shadow:0 7px 28px #2c9f9433}.primary:hover{filter:brightness(1.11)}.primary span:first-child{margin-right:9px}.transport-row{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:9px}.transport-row button,.preset-grid button{background:#152637;border:1px solid #334a5e;color:#a6b8c9;padding:11px 5px;border-radius:6px;letter-spacing:.055em;font-size:9px;font-weight:800}.quick-setup{margin-top:24px}.preset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:11px}.preset-grid button{font-size:8px;padding:11px 4px}.status-grid{display:grid;grid-template-columns:1fr 1fr;row-gap:17px;column-gap:12px}.status-grid>div{display:flex;flex-direction:column;gap:6px}.status-grid span{color:#728a9c;font-size:9px;letter-spacing:.07em;font-weight:700}.status-grid b{font-size:12px;color:#d0e3eb;font-variant-numeric:tabular-nums;font-weight:650}footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:20px;margin-bottom:24px;color:#607b8e;font-size:9px;font-weight:750;letter-spacing:.12em}.footer-divider{margin:0 5px}
@media(max-width:1180px){.shell{padding:0 22px}.workspace{grid-template-columns:minmax(0,1fr) 310px}.sidebar{padding:19px 16px}.metrics{gap:9px}.metric{padding:15px 12px}.metric-value{font-size:25px}.stage{height:420px}.stage-top,.stage-bottom{left:15px;right:15px}.probe-tag{padding:4px;min-width:39px}.probe-tag b{font-size:8px}}
@media(max-width:940px){.workspace{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:25px}.sidebar .side-title{grid-column:1/-1}.sidebar .divider{grid-column:1/-1;margin:10px 0}.sidebar .status-grid{grid-column:1/-1}.sidebar .transport{align-self:center}.sidebar .quick-setup{margin-top:12px}.stage{height:445px}}
@media(max-width:650px){.shell{padding:0 12px}.topbar{height:65px}.wordmark strong{font-size:12px}.wordmark small{font-size:7px}.logo{width:31px;height:31px}.header-right{gap:6px}.session-label{display:none}.heading{padding:22px 0}.heading h1{font-size:29px}.heading h1 em{font-size:15px;display:block;margin-top:2px}.heading p{font-size:12px}.workspace{gap:11px}.stage{height:385px}.stage-top{top:15px;align-items:flex-start}.stage-count{display:block;margin:5px 0 0}.view-buttons{gap:4px;flex-direction:column;align-items:stretch}.mini-button{padding:7px;font-size:8px}.stage-bottom{bottom:12px}.stage-hint{font-size:8px}.legend{font-size:8px}.legend-bar{width:60px;height:5px}.probe-tag{padding:3px 4px;min-width:30px}.probe-tag b{font-size:7px}.probe-tag span{font-size:8px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr));margin:10px 0}.chart-panel{padding:15px 12px}.chart-heading h2{font-size:16px}.chart-window{display:none}.chart-actions .mini-button{font-size:8px}.graph-wrap{height:210px}.chart-footer{flex-direction:column;align-items:flex-start}.sidebar{display:block;padding:20px}.sidebar .divider{margin:23px 0}.sidebar .status-grid{margin:0}footer{flex-direction:column;align-items:flex-start;line-height:1.6;font-size:8px}}
