:root{--bg: #1b2733;--panel: #223240;--card: #2a3d4d;--card-2: #31495b;--text: #e8eef3;--muted: #9fb3c2;--accent: #ff9800;--accent-2: #29b6f6;--ok: #43a047;--border: #3a4f61}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}:root{--panel-w: 312px;--jog-w: 300px;--edge: 12px}#app{position:relative;height:100vh;width:100vw;overflow:hidden}#stage{position:absolute;inset:0;overflow:hidden}#scene{display:block;width:100%;height:100%}#brand{position:absolute;top:12px;left:14px;display:flex;align-items:baseline;gap:8px;pointer-events:none;text-shadow:0 1px 4px rgba(0,0,0,.6)}#brand h1{margin:0;font-size:20px;letter-spacing:.5px;color:var(--accent)}#brand .sub{color:var(--muted);font-size:12px}#panel,#jogpanel{position:absolute;top:var(--edge);z-index:5;display:flex;flex-direction:column;gap:10px;max-height:calc(100vh - var(--edge) * 2);overflow-y:auto;padding:6px;margin:-6px}#panel{right:var(--edge);width:var(--panel-w)}#jogpanel{right:calc(var(--panel-w) + var(--edge));width:var(--jog-w)}.card{background:#223240eb;backdrop-filter:blur(3px);box-shadow:0 6px 20px #00000059;border:1px solid var(--border);border-radius:10px;padding:10px}.card h2{margin:0 0 8px;font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted)}.jog-row,.grip-row{display:grid;grid-template-columns:60px 1fr 36px;align-items:center;gap:4px;margin-bottom:8px}.jog-row label,.grip-row label{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.val{font-size:12px;text-align:right;font-variant-numeric:tabular-nums}.jog-row input[type=range],.grip-row input[type=range]{height:18px}input[type=range]{width:100%;accent-color:var(--accent)}.btn-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}button{flex:1 1 auto;background:var(--card-2);color:var(--text);border:1px solid var(--border);border-radius:7px;padding:7px 9px;font-size:12px;cursor:pointer;transition:background .12s,border-color .12s}button:hover:not(:disabled){background:#3b566b}button:disabled{opacity:.4;cursor:not-allowed}button.primary{background:var(--accent);color:#1b2733;border-color:var(--accent);font-weight:600}button.primary:hover{background:#ffac33}.chk{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);flex:1 1 auto}.steps{list-style:none;margin:0;padding:0;max-height:200px;overflow-y:auto;display:flex;flex-direction:column;gap:3px}.step{display:flex;justify-content:space-between;align-items:center;padding:7px 9px;background:var(--card-2);border:1px solid transparent;border-radius:6px;cursor:pointer;font-size:12px}.step:hover{background:#3b566b}.step.selected{border-color:var(--accent-2)}.step.active{background:#3a5a3f;border-color:var(--ok)}.step-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.step-meta{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}.editor{margin-top:10px;display:flex;flex-direction:column;gap:7px;border-top:1px solid var(--border);padding-top:10px}.editor.hidden{display:none}.editor label{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted);gap:8px}.editor input[type=text],.editor input[type=number]{width:130px;background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:5px;padding:5px 7px;font-size:12px}#hud{position:fixed;bottom:18px;left:18px;background:#000000b3;color:#fff;padding:8px 14px;border-radius:8px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .2s}#hud.show{opacity:1}@media (max-width: 1100px){:root{--panel-w: 280px;--jog-w: 250px}}@media (max-width: 760px){:root{--panel-w: 44vw;--jog-w: 44vw}#jogpanel{right:auto;left:var(--edge);top:44px}}