:root{--bg:#05070d;--bg-2:#0b0f1a;--panel:#0a0e1ad1;--line:#7df9ff2e;--line-strong:#7df9ff73;--fg:#d7e3ea;--fg-dim:#7f8ea3;--accent:#7df9ff;--accent-2:#ff7df9;--accent-3:#9dff7d;--warn:#ffb347;--danger:#ff5c7a;--mono:ui-monospace, "JetBrains Mono", "SF Mono", Menlo, Consolas, monospace;--sans:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--radius:6px}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--fg);font-family:var(--sans);-webkit-user-select:none;user-select:none;margin:0;overflow:hidden}button,input,select,textarea{font:inherit;color:inherit}input,textarea,select{-webkit-user-select:text;user-select:text}#app{position:fixed;inset:0}.layer{position:absolute;inset:0}#scene{width:100%;height:100%;display:block}#cam{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.hud{pointer-events:none;font-family:var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--fg-dim);grid-template-rows:auto 1fr auto;padding:14px 18px;font-size:12px;display:grid}.hud>*{pointer-events:none}.hud .row{flex-wrap:wrap;align-items:center;gap:18px;display:flex}.hud .row.bottom{justify-content:space-between;align-items:flex-end}.hud .pill{border:1px solid var(--line);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#05070d8c;border-radius:999px;padding:3px 10px}.hud .pill.on{border-color:var(--accent);color:var(--accent)}.hud .pill.warn{border-color:var(--warn);color:var(--warn)}.hud .pill.rec{border-color:var(--danger);color:var(--danger);animation:1s steps(2,end) infinite blink}.hud .big{color:var(--fg);letter-spacing:.02em;text-transform:none;font-size:40px;line-height:1}.hud .sub{color:var(--accent);font-size:13px}.hud .stack{flex-direction:column;gap:6px;display:flex}.hud .diag{color:var(--fg-dim);white-space:pre;text-transform:none;letter-spacing:0;font-size:11px}@keyframes blink{50%{opacity:.35}}.panel{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(#05070deb,#05070df7);padding:24px;display:none;position:absolute;inset:0;overflow:auto}.panel.open{display:block}.panel h1{letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin:0 0 18px;font-size:20px;font-weight:500}.panel h2{letter-spacing:.15em;text-transform:uppercase;color:var(--fg-dim);border-bottom:1px solid var(--line);margin:22px 0 10px;padding-bottom:6px;font-size:13px;font-weight:500}.modebar{border-bottom:1px solid var(--line);z-index:5;font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;background:#05070dcc;gap:2px;padding:10px 18px;font-size:12px;display:flex;position:absolute;top:0;left:0;right:0}.modebar button{color:var(--fg-dim);cursor:pointer;border-radius:var(--radius);background:0 0;border:1px solid #0000;padding:6px 14px}.modebar button:hover{color:var(--fg)}.modebar button.active{color:var(--accent);border-color:var(--line-strong)}.modebar .spacer{flex:1}.with-modebar{padding-top:64px}.btn{border:1px solid var(--line-strong);color:var(--fg);border-radius:var(--radius);cursor:pointer;font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;background:#7df9ff0f;padding:8px 16px;font-size:12px}.btn:hover{background:#7df9ff24}.btn.primary{background:var(--accent);color:#05070d;border-color:var(--accent);font-weight:600}.btn.primary:hover{filter:brightness(1.1)}.btn.danger{border-color:var(--danger);color:var(--danger)}.btn.small{padding:4px 10px;font-size:11px}.btn.active{background:var(--accent);color:#05070d}.btn:disabled{opacity:.4;cursor:default}.row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;display:grid}.card{border:1px solid var(--line);border-radius:var(--radius);background:#0b0f1a99;padding:14px}.card h3{letter-spacing:.1em;text-transform:uppercase;color:var(--fg);margin:0 0 10px;font-size:13px;font-weight:500}label.field{color:var(--fg-dim);grid-template-columns:1fr auto;align-items:center;gap:8px;padding:4px 0;font-size:12px;display:grid}label.field>span:first-child{text-transform:uppercase;letter-spacing:.08em;font-family:var(--mono);font-size:11px}label.field .val{font-family:var(--mono);color:var(--accent);text-align:right;min-width:54px}label.field.wide{grid-template-columns:1fr}input[type=range]{width:100%;accent-color:var(--accent);grid-column:1/-1}select,input[type=text],input[type=number]{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius);color:var(--fg);font-family:var(--mono);max-width:100%;padding:5px 8px;font-size:12px}input[type=checkbox]{accent-color:var(--accent)}table{border-collapse:collapse;width:100%;font-family:var(--mono);font-size:12px}th,td{text-align:left;border-bottom:1px solid var(--line);padding:6px 8px}th{color:var(--fg-dim);letter-spacing:.1em;text-transform:uppercase;font-size:11px;font-weight:500}.muted{color:var(--fg-dim)}.mono{font-family:var(--mono)}.notice{border:1px solid var(--warn);color:var(--warn);border-radius:var(--radius);margin:10px 0;padding:10px 14px;font-size:13px}.notice.error{border-color:var(--danger);color:var(--danger)}.notice.ok{border-color:var(--accent-3);color:var(--accent-3)}kbd{font-family:var(--mono);border:1px solid var(--line-strong);color:var(--accent);border-radius:4px;padding:1px 6px;font-size:11px}.onboard{text-align:center;background:radial-gradient(ellipse at center, #0c1222 0%, var(--bg) 70%);z-index:20;justify-content:center;align-items:center;display:flex}.onboard .inner{max-width:560px;padding:32px}.onboard h1{letter-spacing:.35em;color:var(--fg);text-indent:.35em;margin:0 0 8px;font-size:64px;font-weight:300}.onboard h2{margin:0 0 20px;font-size:22px;font-weight:400}.onboard p{color:var(--fg-dim);font-size:15px;line-height:1.55}.onboard .btn{margin-top:18px;padding:12px 36px;font-size:14px}.onboard .steps{font-family:var(--mono);color:var(--fg-dim);letter-spacing:.2em;margin-top:30px;font-size:11px}.onboard .hands{justify-content:center;gap:40px;margin:20px 0;display:flex}.onboard .hands div{border:1px dashed var(--line-strong);width:160px;height:110px;color:var(--accent);font-family:var(--mono);letter-spacing:.15em;border-radius:10px;place-items:center;font-size:11px;display:grid}.toast{background:var(--panel);border:1px solid var(--line-strong);border-radius:var(--radius);z-index:30;pointer-events:auto;align-items:center;gap:12px;padding:10px 18px;font-size:13px;display:flex;position:absolute;bottom:70px;left:50%;transform:translate(-50%)}.hidden{display:none!important}@media (max-width:900px){.hud .big{font-size:28px}.onboard h1{font-size:40px}.panel{padding:16px}}.debug{background:var(--panel);border-left:1px solid var(--line);z-index:15;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);width:420px;max-width:100vw;padding:12px 14px;font-size:12px;position:absolute;top:0;bottom:0;right:0;overflow:auto}.debug h2{letter-spacing:.15em;text-transform:uppercase;color:var(--fg-dim);border-bottom:1px solid var(--line);margin:14px 0 6px;font-size:11px}.debug pre{white-space:pre-wrap;color:var(--fg);margin:0;font-size:11px}.debug .sig{font-family:var(--mono);grid-template-columns:92px 1fr 90px;align-items:center;gap:8px;font-size:10px;display:grid}.debug .sig .n{color:var(--fg-dim)}.debug .sig .v{color:var(--accent);text-align:right}.debug .track{background:#ffffff0d;border-radius:2px;height:8px;position:relative}.debug .bar{border-radius:2px;height:100%;position:absolute;top:0;left:0}.debug .bar.raw{background:#ff7df959}.debug .bar.val{background:var(--accent);height:50%;top:25%}.audio-gate{text-align:center;z-index:18;cursor:pointer;font-family:var(--mono);letter-spacing:.2em;background:#05070dbf;place-items:center;display:grid}.audio-gate .big{color:var(--accent);margin-bottom:8px;font-size:22px}.patch-layout{grid-template-columns:240px 1fr;gap:20px;display:grid}.patch-list h2{margin-top:8px}.patch-item{text-align:left;width:100%;color:var(--fg);border-radius:var(--radius);cursor:pointer;background:0 0;border:1px solid #0000;justify-content:space-between;align-items:baseline;padding:7px 10px;font-size:13px;display:flex}.patch-item:hover{border-color:var(--line)}.patch-item.active{border-color:var(--accent);color:var(--accent)}.patch-item small{font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;font-size:10px}.patch-editor>.card,.patch-editor .grid{margin-bottom:14px}.modtrack{background:#ffffff0d;grid-column:1/-1;height:2px;margin-top:-4px}.modbar{background:var(--accent-2);width:0;height:100%;transition:opacity .2s}@media (max-width:900px){.patch-layout{grid-template-columns:1fr}}table.matrix td{padding:3px 4px}table.matrix select{max-width:150px}.rowtrack{background:#ffffff0f;border-radius:3px;width:60px;height:6px}.rowbar{background:var(--accent);border-radius:3px;width:0;height:100%}.cond-live{font-family:var(--mono);color:var(--accent);margin:4px 0 8px;font-size:11px}.midi-monitor{max-height:180px;font-family:var(--mono);color:var(--fg-dim);font-size:11px;overflow:auto}.midi-monitor .hex{color:var(--accent);margin-right:10px}.gest-row{border-bottom:1px solid var(--line);grid-template-columns:140px 1fr 70px;align-items:center;gap:10px;padding:6px 0;display:grid}.gest-row .conf{background:#ffffff0d;border-radius:2px;height:8px;position:relative}.gest-row .conf>div{background:var(--accent);border-radius:2px;height:100%;position:absolute;top:0;left:0}.gest-row .conf.active>div{background:var(--accent-3)}.gest-row .st{font-family:var(--mono);color:var(--fg-dim);text-transform:uppercase;font-size:10px}.gest-detail{padding:6px 0 10px}.gest-capture{background:#ffffff0d;border-radius:2px;height:8px;margin:8px 0}.gest-capture>div{background:var(--accent-2);border-radius:2px;width:0;height:100%}.lanes{gap:10px;display:grid}.lane{border-left:3px solid var(--accent)}.lane.selected{background:#7df9ff14}.lane-head{gap:14px}.lane-head label.field{padding:0}.lane-head .spacer{flex:1}.lane-status{color:var(--fg-dim);font-size:11px}.lane-canvas{border:1px solid var(--line);border-radius:var(--radius);cursor:crosshair;width:100%;height:90px;margin-top:8px;display:block}