:root{color-scheme:dark;--bg:#06101b;--panel:#0b1a29;--panel2:#0f2434;--edge:#1d3648;--muted:#7a9daf;--text:#e9f6fa;--cyan:#60eaf0;--orange:#f9a756;--green:#80e2ae;--red:#ff7080;--font:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:var(--font)}body{background-image:radial-gradient(ellipse at 48% -30%,#16384a 0%,transparent 62%)}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}.app-shell{max-width:1920px;margin:auto;min-height:100vh;display:flex;flex-direction:column}.topbar{min-height:88px;border-bottom:1px solid #193449;display:flex;align-items:center;gap:32px;padding:0 28px;background:linear-gradient(110deg,#0b1c2b,#081626 68%)}.identity{display:flex;align-items:center;gap:13px;min-width:264px}.identity img{filter:drop-shadow(0 0 13px #29c7d555)}.eyebrow{font-size:9px;font-weight:800;letter-spacing:.15em;color:#7cabb8}.hairline{opacity:.4;padding:0 3px}.wordmark{font-size:25px;font-weight:850;letter-spacing:.08em;line-height:1.1}.wordmark b{color:var(--cyan);font-weight:550}.title-header{display:flex;flex-direction:column;gap:4px;font-size:14px;font-weight:620;letter-spacing:.02em}.subhead{color:#7093a7;font-size:9px;letter-spacing:.17em}.header-actions{margin-left:auto;display:flex;align-items:center;gap:17px}.status{white-space:nowrap;border:1px solid #255e5f;border-radius:30px;padding:8px 12px;color:#80e2b5;font-size:10px;font-weight:800;letter-spacing:.08em}.status:before{content:'●';padding-right:7px}.status.danger{border-color:#873f4b;color:#ff8188;background:#531e2d45}.status.paused{color:#e8c379;border-color:#755934}.workspace{flex:1;display:grid;grid-template-columns:minmax(260px,308px) minmax(440px,1fr) minmax(275px,315px);gap:14px;padding:14px;min-height:800px}.panel{border:1px solid var(--edge);background:linear-gradient(155deg,#0d1e2c,#081723);border-radius:10px;min-width:0;box-shadow:0 6px 30px #00000018}.controls-panel,.telemetry-panel{padding:19px 19px 16px}.panel-head,.module-heading{display:flex;align-items:center;gap:7px}.panel-head h2,.module-heading h2{font-size:14px;margin:0;letter-spacing:.015em}.index{font-size:11px;font-weight:800;color:var(--cyan);font-family:ui-monospace,Consolas,monospace}.tiny-tag{font-size:9px;border:1px solid #234154;color:#80a5ba;letter-spacing:.08em;padding:5px 7px;border-radius:4px;margin-left:auto;white-space:nowrap}.panel-intro{font-size:11.5px;line-height:1.7;color:#90aabc;margin:18px 0 20px}.control-section{border-top:1px solid #1b3346;padding:20px 0 0;margin-top:17px}.section-title{font-size:10px;color:#a6c4d3;letter-spacing:.11em;font-weight:800;display:flex;justify-content:space-between;margin-bottom:15px}.section-title>span{color:#608091;font-size:9px;font-weight:650}.pattern-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.pattern{border:1px solid #264252;background:#112838;color:#8bb4c6;border-radius:5px;height:38px;text-align:left;padding:0 12px;font-size:17px;display:flex;align-items:center;gap:9px}.pattern span{font-size:11px}.pattern:hover,.pattern.selected{border-color:#40c9d0;background:#0e3c47;color:#abfaff}.slider-row{display:flex;justify-content:space-between;gap:8px;margin:12px 0 2px;color:#a8bdca;font-size:11px}.slider-row b{font-size:9px;color:#60eaf0;margin-left:4px}.slider-row output{color:#ecfaff;font-family:ui-monospace,Consolas,monospace;white-space:nowrap}input[type=range]{display:block;width:100%;margin:10px 0 13px;accent-color:#62dae0;cursor:ew-resize;height:4px}.action-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}.button{border:1px solid #2b5060;border-radius:5px;min-height:37px;padding:0 12px;color:#bce1e9;background:#132a39;font-size:11px;font-weight:700;white-space:nowrap}.button:hover{filter:brightness(1.2)}.button.primary{background:#47cdd2;color:#06202a;border-color:#47cdd2}.button.stop{background:#48242e;color:#ffadb2;border-color:#7b3b47}.button.stop.tripped{background:#bd4755;color:white}.button.ghost{background:#0e2130}.button.subtle{background:#132a39;font-size:11px}.smallprint{color:#5d8295;font-size:9px;line-height:1.7;margin-top:18px}.scene-column{display:flex;flex-direction:column;gap:14px;min-width:0}.stage{position:relative;overflow:hidden;flex:1;min-height:490px;background:radial-gradient(circle at 60% 45%,#12354a,#061522 70%)}#scene{width:100%;height:100%;display:block;touch-action:none;cursor:grab}#scene:active{cursor:grabbing}.stage-overlay-top,.stage-overlay-bottom{position:absolute;pointer-events:none;left:18px;right:18px;display:flex;align-items:center;justify-content:space-between}.stage-overlay-top{top:17px}.stage-overlay-bottom{bottom:14px}.micro-label,.view-status{font-size:10px;font-weight:750;letter-spacing:.13em;color:#add2e0;text-shadow:0 2px 5px #06101b}.view-status{font-size:9px;color:#678fa1}.live-dot{width:7px;height:7px;display:inline-block;background:#6ff6c5;border-radius:50%;box-shadow:0 0 11px #73ffc1;margin-right:6px}.view-hint{display:flex;gap:14px;color:#93b8c7;font-size:10px}.capture{pointer-events:auto;color:#c5e9f1;border:1px solid #2d5365;border-radius:5px;background:#0b2539cc;padding:8px 12px;font-size:11px}.capture:hover{background:#1d4b61}.left-ruler{position:absolute;top:24%;left:18px;height:48%;display:flex;flex-direction:column;justify-content:space-between;color:#62899a;font:9px ui-monospace,monospace}.axis-legend{position:absolute;bottom:57px;left:19px;display:flex;gap:12px;font:10px ui-monospace,monospace}.axis-legend .x{color:#ff8088}.axis-legend .y{color:#a4f7b0}.axis-legend .z{color:#79b9ff}.fallback{position:absolute;inset:25% 10%;color:white;background:#482534;border:1px solid #d8667d;border-radius:8px;padding:30px}.lower-grid{display:grid;grid-template-columns:1.07fr .93fr;gap:14px;height:260px}.graph-panel,.geometry-panel{padding:18px;overflow:hidden}.module-heading{justify-content:space-between}.module-heading>div{display:flex;align-items:center;gap:9px}.graph-panel canvas{display:block;width:100%;height:180px;margin-top:15px}.coord-list{margin-top:14px}.coord-list>div{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #1b3546;padding:9px 0;font-size:10px;gap:5px}.coord-list span{color:#83a4b6}.coord-list strong{font-family:ui-monospace,Consolas,monospace;color:#cce5ee;font-weight:550;white-space:nowrap}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:22px 0 24px}.metric{background:#102636;border:1px solid #254253;border-radius:6px;padding:13px 10px;min-height:82px}.metric span{font-size:8px;letter-spacing:.09em;font-weight:800;color:#8aa9b9;display:block}.metric strong{display:block;margin-top:14px;color:#e4faff;font:700 19px ui-monospace,Consolas,monospace;white-space:nowrap}.tension-title{margin:0 0 15px;padding-top:16px;border-top:1px solid #1b3546}.winches{display:flex;flex-direction:column;gap:17px}.winch-row{display:flex;justify-content:space-between;font:10px ui-monospace,Consolas,monospace;color:#9dbbca;margin-bottom:8px}.winch-row strong{color:#deedf7;font-weight:550}.dot{height:6px;width:6px;display:inline-block;border-radius:50%;margin-right:6px}.cyan{background:#59dce5}.orange{background:#f6a25e}.bar{height:6px;border-radius:3px;background:#1c3948;overflow:hidden}.bar span{display:block;height:100%;width:0%;background:linear-gradient(90deg,#327e99,#66eef0);border-radius:3px;transition:width .08s linear}.bar span.warm{background:linear-gradient(90deg,#55d8de,#ffab65)}.info-card{margin-top:30px;border:1px solid #254656;background:#102a39;border-radius:7px;padding:15px}.info-title{font-size:9px;font-weight:800;color:#86d9e1;letter-spacing:.12em}.info-card p{color:#93b4c3;font-size:11px;line-height:1.7}.legend{display:flex;gap:15px;color:#8aaabc;font-size:10px}.keyboard-note{font-size:9px;color:#739bad;margin-top:18px;line-height:2}.keyboard-note kbd{border:1px solid #2f5566;border-radius:3px;padding:2px 5px;margin:0 1px;color:#bce8ee;background:#122a38}footer{display:flex;gap:12px;align-items:center;border-top:1px solid #193449;color:#6d91a2;font:10px ui-monospace,Consolas,monospace;padding:14px 25px}footer span{color:#32607a}.footer-right{margin-left:auto}.status:before{vertical-align:middle}
@media(max-width:1400px){.workspace{grid-template-columns:265px minmax(400px,1fr) 276px;gap:9px;padding:9px}.controls-panel,.telemetry-panel{padding:14px}.metric strong{font-size:16px}.view-hint{gap:7px}.topbar{gap:18px;padding:0 15px}.identity{min-width:220px}}
@media(max-width:1100px){.workspace{grid-template-columns:minmax(235px,280px) minmax(0,1fr)}.telemetry-panel{grid-column:1 / -1}.metric-grid{grid-template-columns:repeat(4,1fr)}.winches{display:grid;grid-template-columns:repeat(4,1fr)}.info-card{margin-top:20px}.topbar{flex-wrap:wrap;padding:14px}.title-header{display:none}}
@media(max-width:720px){.workspace{display:flex;flex-direction:column}.controls-panel{order:2}.scene-column{order:1}.telemetry-panel{order:3}.stage{min-height:390px;height:390px}.lower-grid{grid-template-columns:1fr;height:auto}.graph-panel,.geometry-panel{min-height:240px}.metric-grid{grid-template-columns:1fr 1fr}.winches{grid-template-columns:1fr 1fr}.view-hint span:nth-child(3){display:none}.topbar{gap:7px}.identity{min-width:0}.wordmark{font-size:18px}.eyebrow{font-size:7px}.header-actions{gap:7px}.header-actions .button{display:none}footer{font-size:8px;flex-wrap:wrap}.footer-right{display:none}}
@media(prefers-reduced-motion:reduce){.bar span{transition:none}}
