:root{color-scheme:dark;--bg:#081321;--panel:#101f2e;--line:#294052;--muted:#7f9aaa;--text:#e7f4f7;--accent:#59d5df;--orange:#eda55c}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Inter,"Segoe UI",Arial,sans-serif}button,select,input{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}em{font-style:normal}small{font-weight:500}.app-shell{min-height:100vh;background:radial-gradient(ellipse at 24% 4%,#172c3d 0,transparent 54%),var(--bg)}.topbar{height:77px;border-bottom:1px solid #233b4a;display:flex;align-items:center;justify-content:space-between;padding:0 30px;gap:12px;background:#0b1926e8}.branding{display:flex;gap:13px;align-items:center}.brand-icon{width:43px;height:43px;background:#1b6977;color:#cefbff;border:1px solid #52bacc;border-radius:8px;display:grid;place-items:center;font-size:24px;font-weight:850;position:relative;letter-spacing:-3px}.brand-icon span{font-size:10px;letter-spacing:0;align-self:end;position:absolute;bottom:5px;right:5px;color:#fff}.branding strong{font-size:19px;letter-spacing:2.6px}.branding strong em{font-weight:400;color:#71dbe1}.branding small{display:block;margin-top:4px;font-size:9px;letter-spacing:2.2px;color:#84a5b4}.header-right{display:flex;align-items:center;gap:12px}.head-tag{color:#7e9da9;font-size:10px;letter-spacing:1px;border:1px solid #294456;border-radius:4px;padding:9px 11px}.live{font-size:10px;letter-spacing:1px;font-weight:800;border:1px solid #31695a;background:#143b38;border-radius:4px;padding:11px 12px;color:#7af0ba;white-space:nowrap}.live i,.aside-chip span{display:inline-block;width:7px;height:7px;background:#51dea3;border-radius:50%;margin-right:5px;box-shadow:0 0 12px #54dca1}.live.off{color:#f1b582;background:#3a3029;border-color:#79563e}.live.off i{background:#f0ab72;box-shadow:none}.layout{display:grid;grid-template-columns:minmax(0,1fr) 350px;min-height:calc(100vh - 77px)}.main-column{padding:22px 20px 30px 26px;min-width:0}.viewport-panel{height:clamp(395px,52vh,670px);background:radial-gradient(ellipse at 43% 39%,#183950 0%,#0a1b2b 68%);border:1px solid #2e485a;border-radius:7px;position:relative;overflow:hidden}.viewport-panel canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}.viewport-top,.viewport-bottom{position:absolute;z-index:2;display:flex;justify-content:space-between;left:22px;right:22px;align-items:center;pointer-events:none}.viewport-top{top:17px}.viewport-bottom{bottom:14px;font-size:9px;letter-spacing:1.1px;color:#83aaba}.viewport-bottom b{color:#53d6df}.eyebrow{font-size:10px;font-weight:800;color:#70d5e0;letter-spacing:1.5px}.eyebrow small{font-size:9px;letter-spacing:.7px;color:#608494;margin-left:9px}.viewport-tech{font-size:9px;letter-spacing:1.1px;color:#8da7b7}.viewport-tech span{color:#4ed0dc;margin:0 4px}.pulse-dot{display:inline-block;width:6px;height:6px;background:#4de1ba;border-radius:50%;margin-right:7px;box-shadow:0 0 12px #4de1ba}.scene-label{position:absolute;z-index:2;top:53%;font-size:10px;letter-spacing:1.5px;color:#e6f8f8;background:#0c2536dd;padding:9px 12px;border:1px solid #2a5263;pointer-events:none}.scene-label small{display:block;color:#7fa3b1;font-size:8px;letter-spacing:1px;margin-top:4px}.left-label{left:25px}.right-label{right:24px}.label-dot{width:6px;height:6px;display:inline-block;border-radius:50%;margin-right:4px}.ocean{background:#58dce9}.amber{background:#eca563}.line-sep{color:#427184;margin:0 3px}.error-panel{position:absolute;top:28%;left:20%;right:20%;padding:30px;background:#102d3fe8;border:1px solid #c87753;border-radius:8px;z-index:4;text-align:center}.error-panel p{font-size:13px;color:#a2bbc6}.instrument-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:14px;border:1px solid #294557;border-radius:6px;background:#101e2cf2;overflow:hidden}.stat{min-height:111px;padding:20px 19px;border-right:1px solid #294052}.stat:last-child{border-right:0}.stat-label{color:#8aa6b4;font-size:9px;font-weight:800;letter-spacing:1.2px}.stat div:not(.mini-track){margin-top:7px;display:flex;gap:7px;align-items:baseline}.stat b{font-size:30px;letter-spacing:-1.5px;font-weight:650;font-variant-numeric:tabular-nums}.stat small{color:#93b0bc;font-size:11px}.stat-foot{color:#658594;display:block;font-size:9px;margin-top:9px;letter-spacing:.5px}.mini-track{margin-top:9px;height:3px;width:100%;background:#294957;border-radius:5px;overflow:hidden}.mini-track span{height:100%;background:linear-gradient(90deg,#25a9c1,#92f2d8);display:block;transition:width .1s}.plot-panel{background:#101e2b;margin-top:14px;border:1px solid #294557;border-radius:6px;padding:18px 20px 14px}.section-head{display:flex;justify-content:space-between;gap:15px;align-items:flex-end}.section-head h2{font-size:18px;font-weight:650;margin:7px 0 0}.section-head h2 span{color:#8ba8b6;font-size:14px;font-weight:400}.plot-legend{display:flex;gap:12px;flex-wrap:wrap;font-size:10px;color:#b1c8d1}.plot-legend i,.sensor-list i{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:5px}.color1,.s1{background:#5de8e6}.color2,.s2{background:#a8bfe1}.color3,.s3{background:#ffb875}.color4,.s4{background:#ed7190}#trace{margin-top:9px;width:100%;height:195px;display:block}.graph-footer{border-top:1px solid #263e4e;margin-top:7px;padding-top:11px;display:flex;justify-content:space-between;gap:10px;align-items:center;color:#8ca7b3;font-size:9px;letter-spacing:.6px}.mark{display:inline-block;width:5px;height:5px;background:#55d5dc;border-radius:50%;margin-right:4px}.control-column{border-left:1px solid #294052;background:linear-gradient(180deg,#122438,#0b1a29 61%);padding:22px 20px 28px;overflow:hidden}.aside-head{position:relative}.aside-chip{position:absolute;right:0;top:-2px;font-size:8px;letter-spacing:.8px;color:#78d2a7}.aside-chip span{width:5px;height:5px;margin-left:2px}.aside-head h1{font-size:27px;line-height:1.18;letter-spacing:-.9px;font-weight:680;margin:22px 0 11px}.aside-head h1 span{display:block;color:#5fced8}.aside-head p{font-size:12px;line-height:1.6;color:#9bb7c4;margin:0 0 17px}.test-controls{padding:14px 0 22px;border-bottom:1px solid #294052}.primary-button{width:100%;background:#62d6df;border:1px solid #8ce3e9;color:#06212d;padding:14px 9px;border-radius:4px;font-weight:850;letter-spacing:1px;font-size:11px;box-shadow:0 8px 26px #25a3c026}.primary-button:hover{background:#85e9ed}.primary-button span{font-size:12px;margin-right:8px}.secondary-actions{display:grid;grid-template-columns:1fr 1fr 1.15fr;gap:6px;margin-top:8px}.secondary-actions button{background:#1a3445;color:#b9d3dc;border:1px solid #335266;padding:10px 3px;border-radius:4px;font-weight:750;letter-spacing:.3px;font-size:9px}.secondary-actions button:hover,.preset:hover{border-color:#6fc4ce}.panel-block{padding:20px 0;border-bottom:1px solid #294052}.block-title{font-size:10px;color:#e4f4f5;letter-spacing:1.5px;font-weight:830;margin-bottom:17px}.block-title>span{color:#50cbd7;margin-right:10px}.block-title small{float:right;color:#7c9fab;font-size:9px;text-transform:uppercase}.preset-group{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.preset{border:1px solid #345569;background:#192e3e;padding:11px 2px;color:#94b2c0;font-size:9px;letter-spacing:.3px;border-radius:4px;font-weight:800}.preset.active{color:#8bebec;background:#18414b;border-color:#54aab6}.mode-switch{display:flex;flex-direction:column;gap:7px;margin-top:17px}.mode-switch label,.range-top label{font-size:11px;color:#a9c3cf}.mode-switch select{border-radius:4px;padding:9px 11px;background:#0a1c2c;color:#e1f4f7;border:1px solid #355367;outline:none}.manual-wrap{padding:15px 0 1px}.control{margin:0 0 18px}.control:last-child{margin-bottom:0}.range-top{display:flex;justify-content:space-between;gap:10px;align-items:center}.range-top output{color:#b7e2e6;font-weight:850;font-size:11px;font-variant-numeric:tabular-nums}input[type=range]{display:block;width:100%;height:4px;margin:15px 0 2px;appearance:none;-webkit-appearance:none;outline:none;background:linear-gradient(90deg,#3ca7b4,#385b67);border-radius:10px;cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:13px;height:13px;background:#75e3eb;border:3px solid #15485a;border-radius:50%;box-shadow:0 0 0 1px #79dde5}input[type=range]::-moz-range-thumb{width:9px;height:9px;background:#75e3eb;border:2px solid #15485a;border-radius:50%}.sensor-list>div{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid #264356}.sensor-list>div:last-child{border-bottom:0}.sensor-list span{font-size:11px;color:#d3e8ed;font-weight:700}.sensor-list small{font-size:9px;color:#7294a2;margin-left:8px;font-weight:400}.sensor-list b{font-size:15px;font-variant-numeric:tabular-nums}.theory-panel{margin-top:19px;background:#162d3b;padding:17px 14px;border:1px solid #2c5363;border-radius:4px}.equation{font-size:27px;font-family:Georgia,serif;font-style:italic;margin:12px 0 15px;color:#c7e7ec}.theory-row{display:flex;justify-content:space-between;font-size:10px;color:#a2c0cb;gap:10px;margin-top:9px}.theory-row b{color:#e2f5f8;font-variant-numeric:tabular-nums}.warning{margin-top:14px;color:#ffc39c;font-size:10px;line-height:1.4}.aside-end{font-size:8px;color:#5c8596;letter-spacing:.8px;margin-top:24px;line-height:1.6}.aside-end span{color:#4dc8d5;margin:0 3px}
@media(max-width:1100px){.layout{grid-template-columns:minmax(0,1fr) 310px}.control-column{padding:19px 15px}.main-column{padding:18px 13px}.stat{padding:17px 12px}.stat b{font-size:26px}.scene-label{display:none}}
@media(max-width:850px){.layout{display:flex;flex-direction:column}.control-column{border-left:0;border-top:1px solid #294052}.main-column{padding:14px}.viewport-panel{height:480px}.control-column{padding:20px 23px}.control-column .panel-block{max-width:none}.header-right .desktop-only{display:none}.topbar{padding:0 16px}.branding small{font-size:8px;letter-spacing:.8px}.branding strong{font-size:16px}}
@media(max-width:580px){.topbar{height:65px}.brand-icon{width:35px;height:35px}.head-tag{display:none}.live{padding:8px 7px;font-size:8px}.viewport-panel{height:370px}.viewport-tech,.viewport-bottom span:nth-child(2){display:none}.viewport-bottom{left:10px;right:10px}.viewport-top{left:10px;right:10px}.viewport-top .eyebrow small{display:none}.instrument-strip{grid-template-columns:1fr 1fr}.stat:nth-child(2){border-right:0}.stat:nth-child(-n+2){border-bottom:1px solid #294052}.section-head{align-items:start;flex-direction:column}.graph-footer{font-size:8px}.plot-panel{padding:15px 10px}.branding{gap:6px}.branding strong{letter-spacing:1px}}