:root{color-scheme:dark;--ink:#e8e4d9;--muted:#9aa9a8;--gold:#eeb746;--line:#2c444b;--dark:#101d24;--panel:#172831}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;font-family:Inter,Segoe UI,Arial,sans-serif;background:#07141a;color:var(--ink)}#stage{display:flex;flex-direction:column;height:100dvh;min-height:650px}.topbar{height:104px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:14px 30px;border-bottom:1px solid var(--line);background:#101f27}.eyebrow{font-size:10px;color:#a5baaa;font-weight:650;letter-spacing:2px}.mark{display:inline-block;width:8px;height:8px;border-radius:100%;background:var(--gold);margin-right:8px;box-shadow:0 0 12px var(--gold)}h1{font-weight:800;font-size:34px;line-height:37px;letter-spacing:2px;margin:3px 0 0}.accent{color:var(--gold)}header p{font-size:11px;color:var(--muted);letter-spacing:1.8px;margin:5px 0 0}.thin{color:#617a80}.topmeta{text-align:right;font-size:12px;color:#c8d1cc}.topmeta .tiny{font-size:10px;letter-spacing:2px;color:var(--gold);margin-bottom:6px}.topmeta span{display:block;color:#708b8f;font-size:9px;letter-spacing:1.5px;margin-top:5px}main{display:grid;grid-template-columns:minmax(350px,1fr) 330px;min-height:0;flex:1}#canvas-wrap{position:relative;overflow:hidden;min-height:0;background:radial-gradient(circle at 50% 45%,#27414b,#13252c 60%,#07151b)}canvas{display:block;width:100%;height:100%;outline:0;cursor:grab}canvas:active{cursor:grabbing}.canvas-caption{position:absolute;bottom:25px;left:26px;right:26px;display:flex;justify-content:space-between;gap:14px;font-size:9px;letter-spacing:1.4px;color:#aac0bf;pointer-events:none}.canvas-caption span:first-child{background:#eab446;color:#18242a;font-weight:800;padding:8px 11px}.canvas-caption b,footer b{color:var(--gold)}#loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;background:#0c1b22dd;color:var(--gold);font-size:11px;letter-spacing:3px}.spin{width:38px;height:38px;border-radius:100%;border:2px solid #31464d;border-top:2px solid var(--gold);animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.controls{background:#13232c;border-left:1px solid var(--line);min-height:0;overflow:auto}.scroller{padding:27px 22px 34px}.section-label{font-size:10px;letter-spacing:2.2px;color:var(--gold);font-weight:750;border-bottom:1px solid #2a4148;padding-bottom:12px;margin-bottom:15px}.topgap{margin-top:30px}.modegrid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.mode{border:1px solid #405761;border-radius:2px;background:#162e39;color:#dae4e1;text-align:left;padding:12px;font-size:13px;font-weight:750;cursor:pointer;transition:.18s}.mode:hover,.mode.selected{border-color:var(--gold);background:#24373a}.mode small{display:block;font-size:9px;font-weight:400;color:#92aab0;margin-top:6px;letter-spacing:.3px}.mode.wide{grid-column:1/-1}.play{display:flex;align-items:center;gap:15px;background:var(--gold);border:0;width:100%;padding:14px;color:#14232a;font-weight:850;letter-spacing:1px;cursor:pointer}.play #play-icon{font-size:17px;width:16px}.status-led{width:8px;height:8px;margin-left:auto;background:#233b3c;border-radius:50%}.fieldhead{display:flex;justify-content:space-between;color:#a1b3b5;font-size:10px;letter-spacing:.6px;margin:22px 0 10px}.fieldhead output{color:#e3e7d3}input[type=range]{width:100%;height:5px;accent-color:var(--gold);cursor:pointer}.datagrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:21px}.datagrid>div{padding:13px;background:#0c1e26;border:1px solid #32434c}.datagrid small{font-size:9px;color:#9eafa8;display:block;letter-spacing:1px}.datagrid strong{display:inline-block;font-size:27px;color:var(--gold);font-weight:700;margin:6px 5px 0 0}.datagrid span{font-size:9px;color:#819fa4}.note{font-size:11px;color:#889da2;line-height:1.5;margin-top:15px}.cameras{display:grid;grid-template-columns:1fr 1fr;gap:8px}.cameras button{padding:10px 6px;font-size:11px;background:transparent;color:#c9d5d1;border:1px solid #3a5059;cursor:pointer}.cameras button:hover{background:#274047;color:var(--gold)}.inspector{background:#0c1b24;border-left:2px solid var(--gold);padding:17px}.insp-tag{color:var(--gold);font-size:9px;letter-spacing:1.8px}.inspector h2{font-size:14px;margin:8px 0;color:#f0f0e8;word-wrap:break-word}.inspector p{color:#91abb0;font-size:11px;line-height:1.5;margin:0}.bottom{border-top:1px solid #2e464e;padding-top:16px}footer{height:35px;padding:11px 25px;flex:none;display:flex;justify-content:space-between;background:#081820;color:#6d858a;font-size:9px;letter-spacing:1.4px}#stage button:focus-visible{outline:2px solid var(--gold)}@media(max-width:900px){#stage{height:auto;min-height:100dvh}.topbar{height:90px;padding:10px 16px}.topmeta{display:none}main{grid-template-columns:1fr;display:flex;flex-direction:column}#canvas-wrap{height:64vh;min-height:440px}.controls{overflow:visible}.canvas-caption span:last-child{display:none}footer{font-size:8px;gap:16px}h1{font-size:28px}.scroller{padding:22px}}
