:root{font-family:Inter,Arial,sans-serif;color:#d8ebf0;background:#07111d;font-synthesis:none}*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden}body{font-size:12px}button,select,input{font:inherit}button{cursor:pointer;transition:background .16s,border-color .16s,color .16s,box-shadow .16s}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #23d9ef;outline-offset:2px}button:disabled{opacity:.4;cursor:not-allowed}
#app{position:relative;background:radial-gradient(ellipse at 50% 48%,#12304b 0%,#07111d 69%)}#viewport{width:100%;height:100%;position:absolute;inset:0;display:block;outline:0;touch-action:none}.scan-lines{pointer-events:none;position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0px,transparent 4px,#fff 5px);opacity:.011}.noise{pointer-events:none;position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 40%,rgba(1,7,13,.65));opacity:.8}.ui-panel{background:linear-gradient(135deg,rgba(9,24,38,.94),rgba(7,19,31,.88));border:1px solid rgba(57,103,123,.31);box-shadow:0 14px 45px rgba(0,0,0,.19);backdrop-filter:blur(18px)}
.topbar{height:76px;position:absolute;top:0;left:0;right:0;display:flex;align-items:center;padding:0 30px;gap:25px;border-top:0;border-left:0;border-right:0;background:linear-gradient(90deg,rgba(6,18,31,.96),rgba(6,17,28,.80))}.identity{display:flex;align-items:center;gap:12px}.mark{height:37px;width:37px;border:1px solid #129db6;display:grid;place-items:center;color:#5ff7fa;font-size:26px;box-shadow:inset 0 0 12px #0c7f9633;transform:rotate(45deg)}.mark span{transform:rotate(-45deg);font-size:23px}.eyebrow,.mono,.section-eyebrow,.panel-heading,.group-label,.model-kicker,.status-dot,.system-status,.schematic-header,.telemetry-heading,.metric-label,.disclaimer,.transport-top,.control-help,.bottom-brand,.mode,.camera-btn,.graphics-row,.mini-toggle,.mute,.audio-row,.joint,.transport-small,.transport-primary,.speed-control,.focus-callout,.number-tag,.timeline-marks,.subtle-btn{font-family:'IBM Plex Mono',monospace}.eyebrow{font-size:9px;letter-spacing:1.65px;color:#7392a0}.brand{font-family:'Barlow Condensed',sans-serif;font-size:28px;line-height:1;font-weight:800;letter-spacing:2px;color:#f5fcff}.brand>span:first-child{color:#26d3e7}.brand-version{font:500 10px 'IBM Plex Mono',monospace;letter-spacing:0;color:#537b8c;margin-left:9px}.top-divider{width:1px;height:38px;background:#264757}.model-name{font-family:'Barlow Condensed',sans-serif;font-size:24px;letter-spacing:1px;font-weight:700;color:#e4f7fa}.model-name span{font-weight:400;color:#9ec3cb}.model-identity .eyebrow strong{font-weight:600;color:#7ed9e6}.grow{flex:1}.top-stat .mono{font-size:14px;letter-spacing:1px;margin-top:5px}.system-status{border:1px solid #205b64;background:rgba(4,74,73,.13);height:32px;padding:0 12px;display:flex;align-items:center;gap:8px;color:#67e8d2;letter-spacing:.7px;font-size:10px}.status-dot{width:6px;height:6px;border-radius:50%;background:#43e2ba;box-shadow:0 0 9px #35e0ae;animation:blip 2s infinite}@keyframes blip{50%{opacity:.45}}
.left,.right{position:absolute;top:94px;border:1px solid rgba(68,113,134,.31);padding:21px 21px 17px;max-height:calc(100% - 264px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#1b5260 transparent}.left{left:25px;width:315px}.right{right:25px;width:286px}.section-eyebrow{font-size:9px;color:#93bac4;letter-spacing:1px;display:flex;align-items:center;gap:9px}.little-cyan{display:inline-block;width:7px;height:7px;background:#36dff1;box-shadow:0 0 10px #2fd1ea}.super-title{margin-top:15px;font:800 43px/.92 'Barlow Condensed',sans-serif;letter-spacing:.5px;color:#f1f7f5}.super-title span{color:#2ad7e5}.model-kicker{font-size:9px;letter-spacing:1.1px;color:#a2c2ca;line-height:1.8;margin-top:13px}.mini-line{height:2px;background:linear-gradient(90deg,#1bc4d7 0%,transparent 85%);margin-top:17px;opacity:.65}.summary{font-size:11px;line-height:1.85;color:#8cabb9;margin:12px 0 16px}.schematic{border:1px solid #1e4553;background:radial-gradient(ellipse at center,rgba(17,67,75,.3),rgba(4,18,29,.4));padding:8px 9px 2px}.schematic-header,.telemetry-heading{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;color:#7ca5b1}.schematic svg{width:100%;display:block;height:auto;margin:2px 0}.telemetry-heading{margin:18px 0 11px}.green-indicator{color:#6adab5;font-size:8px}.telemetry-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;border:1px solid #1f3c49;background:#1f3c49}.metric{background:#071b29;padding:12px 11px 10px;min-height:75px}.metric-label{font-size:8px;color:#7d9fad;letter-spacing:.5px;white-space:nowrap}.metric-value{font:600 24px 'Barlow Condensed',sans-serif;display:flex;align-items:baseline;gap:3px;color:#e6f8f8;margin-top:4px}.metric-value small{font-size:12px;color:#2bbcc8}.meter{height:3px;margin-top:5px;background:#1c4350;overflow:hidden}.meter span{height:100%;width:0;display:block;background:#27d9ed;transition:width .10s}.disclaimer{font-size:8px;line-height:1.7;color:#5e8394;margin:12px 0 0}
.panel-heading{display:flex;align-items:center;justify-content:space-between;color:#f1fbfb;font-size:11px;font-weight:600;letter-spacing:.8px;border-bottom:1px solid #244452;padding-bottom:17px}.number-tag{color:#30c4d6;font-size:9px}.group-label{font-size:9px;letter-spacing:1.25px;color:#7195a4;margin:16px 0 10px}.group-label.spaced{margin-top:22px}.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.mode{border:1px solid #244555;background:rgba(17,40,54,.43);color:#83a8b4;height:58px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font-size:9px;letter-spacing:.3px}.mode .mode-icon{font-family:Arial;font-size:22px;line-height:1}.mode.active,.mode:hover{color:#dffbfc;border-color:#1fc0d6;background:rgba(14,108,124,.24);box-shadow:inset 0 0 18px rgba(25,187,205,.08)}.mode.active .mode-icon{color:#42e4ec}.camera-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.camera-btn{font-size:8px;letter-spacing:.2px;padding:10px 0;background:#0b2130;border:1px solid #264553;color:#90aebd}.camera-btn:hover,.camera-btn.active{background:#153c4b;border-color:#35a5b7;color:#defaff}.toggles{display:flex;gap:7px;margin-top:11px}.mini-toggle{flex:1;background:transparent;border:1px solid #294a58;color:#8daebb;font-size:8px;min-height:34px;padding:4px 4px}.mini-toggle span{color:#39cada;font-size:13px}.mini-toggle.active{border-color:#35b9cf;background:#0d3541;color:#dcf9f9}.graphics-row{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #284c5b}.graphics-row button{padding:10px;background:#0b2030;border:0;border-right:1px solid #284c5b;color:#698e9e;font-size:9px}.graphics-row button:last-child{border-right:0}.graphics-row button.active{background:#15485b;color:#ddfaff}.manual-controls{padding-top:1px}.joint{display:block;margin:10px 0;color:#8cabb4;font-size:9px}.joint span{display:flex;justify-content:space-between;margin-bottom:5px}.joint b{color:#55d5e2}.joint input{width:100%}.subtle-btn{font-size:8px;color:#cbe4e6;border:1px solid #28505e;background:#102b3b;width:100%;padding:11px}.audio-row{margin-top:20px;border-top:1px solid #234453;padding-top:13px;display:flex;align-items:center;gap:10px}.mute{border:1px solid #2a4e5b;padding:9px;background:#0d2938;color:#7bb8bf;font-size:9px;white-space:nowrap}.audio-row label{display:flex;align-items:center;gap:5px;font-size:8px;color:#7399a5}.audio-row input{width:74px}input[type=range]{accent-color:#2bd6e9;cursor:pointer}
.focus-callout{position:absolute;left:50%;top:95px;transform:translateX(-50%);font:10px 'IBM Plex Mono',monospace;letter-spacing:1px;color:#8ccbd0;padding:10px 14px;background:rgba(5,18,29,.75);display:flex;gap:7px;align-items:center;pointer-events:none}.focus-dot{border:1px solid #26c6dc;width:8px;height:8px;transform:rotate(45deg)}.control-help{position:absolute;bottom:157px;left:50%;transform:translateX(-50%);font-size:8px;white-space:nowrap;color:#67909b;letter-spacing:.6px;text-shadow:0 2px 3px #09111b}.control-help i{color:#2bc3d1;font-style:normal;padding:0 6px}
.transport{position:absolute;bottom:29px;left:50%;transform:translateX(-50%);width:min(790px,calc(100% - 680px));min-width:520px;padding:14px 22px 13px;background:linear-gradient(120deg,rgba(7,23,35,.97),rgba(9,28,42,.94))}.transport-top{display:flex;align-items:center;gap:12px}.transport-top .eyebrow{font-size:9px;white-space:nowrap}.transport-top #sequence-phase{color:#33cddd;font-size:9px;letter-spacing:.8px;flex:1;text-align:center}.timeline-number{color:#a5c5cf;font-size:10px}.timeline-wrap{position:relative;margin-top:15px}.timeline-marks{position:absolute;top:-3px;width:100%;display:flex;justify-content:space-between;font-size:7px;color:#527d8f;transform:translateY(-100%)}#timeline{width:100%;margin:11px 0 5px;appearance:none;height:5px;background:linear-gradient(90deg,#33d7ec 0%,#164658 0%);border-radius:0;outline:none;position:relative;z-index:2}#timeline::-webkit-slider-thumb{appearance:none;width:12px;height:18px;background:#bdf8fc;box-shadow:0 0 9px #18bfda;border:2px solid #2893aa}#timeline::-moz-range-thumb{width:12px;height:18px;background:#bdf8fc;border-radius:0;border:2px solid #2893aa}.timeline-cues{position:absolute;bottom:11px;left:0;width:100%;pointer-events:none}.timeline-cues i{position:absolute;bottom:-5px;width:2px;height:10px;background:#3b778a}.transport-actions{display:flex;gap:7px;margin-top:8px;align-items:center}.transport-small{padding:12px 8px;font-size:10px;border:1px solid #274a5b;background:#0d2535;color:#95b5bd;white-space:nowrap}.transport-small span{font-size:8px;letter-spacing:.5px;margin-left:4px}.transport-small:hover,.transport-small.active{border-color:#30c7dd;color:#d6fbfc}.transport-primary{background:linear-gradient(90deg,#0eb5ce,#1586a6);border:1px solid #25bfcf;color:#eaffff;padding:12px 16px;font-size:10px;font-weight:600;letter-spacing:.8px;min-width:160px}.transport-primary:hover{background:#20cde4}.transport-spacer{flex:1}.speed-control{display:flex;align-items:center;gap:7px;color:#7b9eaa;font-size:8px}select{border:1px solid #2c5360;background:#102f40;color:#bde5ec;padding:9px 4px}.bottom-brand{position:absolute;bottom:8px;text-align:center;left:0;right:0;color:#507386;font-size:8px;letter-spacing:.8px}
.annotations{position:absolute;inset:0;pointer-events:none;overflow:hidden}.label-lines{width:100%;height:100%;position:absolute;inset:0;pointer-events:none}.part-label{position:absolute;pointer-events:auto;border:1px solid #2b8192;color:#8ce4eb;background:rgba(4,23,35,.81);padding:8px 10px;font:9px 'IBM Plex Mono',monospace;white-space:nowrap;letter-spacing:.5px;box-shadow:0 6px 20px #0610187d}.part-label:hover{color:#fff;border-color:#50def0;background:#0e3c4c}.error-screen{z-index:999;position:absolute;inset:0;background:#050c14e8;display:grid;place-items:center}.error-screen[hidden]{display:none}.error-dialog{width:min(480px,90vw);border:1px solid #2d6d78;background:#0b202e;padding:32px}.error-dialog h2{font-family:'Barlow Condensed',sans-serif;font-size:32px}.error-dialog p{color:#9fc2ce;line-height:1.6}.error-dialog button{padding:10px 18px;background:#127f9f;color:white;border:0}
@media(min-width:1650px){.left{width:335px}.right{width:310px}.transport{width:820px}.super-title{font-size:48px}}@media(max-width:1290px){.left{width:255px;left:12px;padding:16px}.right{right:12px;width:245px;padding:15px}.super-title{font-size:35px}.transport{width:calc(100% - 550px);min-width:420px;padding:11px}.transport-small span{display:none}.transport-primary{min-width:110px}.control-help{display:none}.model-name{font-size:20px}}@media(max-width:900px){.topbar{height:62px;padding:0 13px;gap:12px}.model-identity,.top-divider,.hide-small{display:none}.left{top:75px;width:218px;max-height:calc(100% - 255px)}.right{top:75px;width:216px;max-height:calc(100% - 255px)}.brand{font-size:23px}.super-title{font-size:30px}.summary{font-size:10px}.camera-grid{grid-template-columns:repeat(2,1fr)}.transport{bottom:14px;width:calc(100% - 22px);min-width:0;max-width:680px}.focus-callout{top:73px}}@media(max-width:620px){.topbar{height:57px}.top-stat{display:none}.system-status{margin-left:auto;font-size:8px;padding:0 8px;height:29px}.brand{font-size:21px}.left{top:66px;left:7px;width:calc(50% - 11px);max-height:220px;overflow:auto;padding:10px}.right{top:66px;right:7px;width:calc(50% - 11px);max-height:220px;overflow:auto;padding:10px}.super-title{font-size:25px;margin-top:10px}.left .summary,.left .schematic,.left .disclaimer{display:none}.model-kicker{font-size:8px}.telemetry-heading{margin:10px 0}.metric{padding:7px}.metric-label{white-space:normal}.metric-value{font-size:19px}.panel-heading{font-size:8px;padding-bottom:8px}.mode{height:40px;font-size:7px}.mode .mode-icon{font-size:13px}.group-label{font-size:8px;margin:10px 0 6px}.group-label.spaced{margin-top:11px}.camera-grid{grid-template-columns:repeat(4,1fr)}.camera-btn{font-size:7px;padding:7px 0}.toggles{display:none}.audio-row{margin-top:10px}.audio-row label{display:none}.focus-callout{top:302px;font-size:8px}.transport{padding:11px;bottom:20px}.transport-top .eyebrow{font-size:7px}.transport-top #sequence-phase{font-size:7px}.timeline-number{font-size:8px}.transport-small{font-size:9px;padding:10px 6px}.transport-primary{padding:10px 6px;min-width:92px;font-size:8px}.speed-control{font-size:7px}.speed-control select{font-size:8px;padding:7px 0}.bottom-brand{font-size:6px}.part-label{padding:5px;font-size:7px}}