:root{--bg: #06080c;--surface: #0e1219;--panel: #11161f;--border: #232c3a;--text: #dfe9f5;--dim: #6b7a8f;--accent: #35e0d0;--tone: #ffc74d;--space: #9b86ff;--grid: #1a2230;--ghost: #223046;--panel-w: 262px;--nums-w: 272px;--scanline: rgba(90,140,180,0.035);--title-color: var(--accent);--glitch-tint-1: rgba(53,224,208,0.22);--glitch-tint-2: rgba(155,134,255,0.22);--chrome-tint-1: rgba(53,224,208,0.3);--chrome-tint-2: rgba(155,134,255,0.3);--stat-font: "Courier Prime", monospace;--stat-size: 13px;--backlink-glow: rgba(53,224,208,0.3);--backlink-hover-border: var(--accent)}body{user-select:none}.sys-stat.lit{color:var(--accent);border-color:var(--accent);text-shadow:0 0 8px rgba(53,224,208,0.45)}.panel{background:var(--panel);border-right:1px solid var(--border);padding:14px 14px 20px;overflow-y:auto;flex-shrink:0}.panel.controls{width:var(--panel-w)}.panel.numbers{width:var(--nums-w);border-right:none;border-left:1px solid var(--border);display:flex;flex-direction:column}.panel-label{font-family:"Press Start 2P",monospace;font-size:8px;letter-spacing:0.1em;color:var(--dim);margin-bottom:6px}.panel-label.shared{color:var(--accent)}.panel-label.tone{color:var(--tone)}.panel-label.space{color:var(--space)}.panel-hint{font-family:"Courier Prime",monospace;font-size:11px;line-height:1.45;color:var(--dim);margin-bottom:12px}.panel-divider{height:1px;background:var(--border);margin:18px 0 14px}.panel-note{font-family:"Courier Prime",monospace;font-size:11px;line-height:1.5;color:var(--dim);margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}.ctl{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:5px}.ctl-name{font-family:"Press Start 2P",monospace;font-size:7px;letter-spacing:0.08em;color:var(--dim);line-height:1.5}.ctl-val{font-family:"Courier Prime",monospace;font-size:13px;color:var(--text);white-space:nowrap}.ctl.big .ctl-name{color:var(--accent);font-size:8px}.ctl.big .ctl-val{color:var(--accent);font-size:17px}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:3px;background:var(--border);outline:none;margin-bottom:14px;cursor:pointer}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:11px;height:15px;background:var(--text);border:none;cursor:pointer}input[type=range]::-moz-range-thumb{width:11px;height:15px;background:var(--text);border:none;border-radius:0;cursor:pointer}.shared-range{height:5px;margin-bottom:10px}.shared-range::-webkit-slider-thumb{background:var(--accent);width:13px;height:19px}.shared-range::-moz-range-thumb{background:var(--accent);width:13px;height:19px}.preset-row{display:flex;gap:5px}.preset{flex:1;background:var(--surface);border:1px solid var(--border);color:var(--dim);font-family:"Courier Prime",monospace;font-size:11px;padding:5px 2px;cursor:pointer;transition:color 0.12s,border-color 0.12s}.preset:hover{color:var(--accent);border-color:var(--accent)}.patch-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:8px}.patch-grid .preset{font-family:"Press Start 2P",monospace;font-size:6px;letter-spacing:0.06em;padding:7px 2px}.preset.on{color:var(--bg);background:var(--tone);border-color:var(--tone)}.patch-grid .preset:hover:not(.on),.play-row .preset:hover:not(.on){color:var(--tone);border-color:var(--tone)}.play-row{display:flex;align-items:center;gap:5px;margin-bottom:6px}.play-row .preset{font-family:"Press Start 2P",monospace;font-size:7px;padding:7px 2px}.oct{flex:0 0 44px;text-align:center;font-family:"Courier Prime",monospace;font-size:13px;color:var(--text)}#noteStat.live{color:var(--tone);border-color:var(--tone)}.action-btn{width:100%;background:var(--surface);border:1px solid var(--border);color:var(--text);font-family:"Press Start 2P",monospace;font-size:8px;letter-spacing:0.08em;padding:10px 6px;margin:6px 0 10px;cursor:pointer;transition:color 0.12s,border-color 0.12s,background 0.12s}.action-btn:hover{border-color:var(--tone);color:var(--tone)}.action-btn.on{border-color:var(--tone);color:var(--bg);background:var(--tone)}.derived{display:flex;justify-content:space-between;gap:8px;font-family:"Courier Prime",monospace;font-size:11px;color:var(--dim);padding:3px 0}.derived span:last-child{color:var(--text)}.derived.check span:last-child{color:var(--accent)}.stage{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--bg)}.dom{flex:1;display:flex;flex-direction:column;min-height:0;padding:12px 18px 10px}.dom-time{border-bottom:1px solid var(--border)}.dom-head{display:flex;align-items:baseline;gap:12px;margin-bottom:8px}.dom-title{font-family:"Press Start 2P",monospace;font-size:10px;letter-spacing:0.12em}.dom-time .dom-title{color:var(--tone)}.dom-space .dom-title{color:var(--space)}.dom-rule{font-family:"Courier Prime",monospace;font-size:12px;color:var(--dim)}.dom-hand{margin-left:auto;font-family:"Courier Prime",monospace;font-size:11px;color:var(--dim);opacity:0.8}.strip.hand{cursor:ns-resize;touch-action:none}.strip.hand:hover{border-color:var(--dim)}.strip.hand.pressed{border-color:var(--accent);box-shadow:0 0 10px rgba(53,224,208,0.25)}.strip{width:100%;height:62px;flex-shrink:0;background:var(--surface);border:1px solid var(--border);display:block}.spectrum{width:100%;flex:1;min-height:90px;display:block;margin-top:8px}.keybed{flex-shrink:0;padding:8px 18px 10px;border-top:1px solid var(--border);background:var(--panel)}.keys{position:relative;height:92px;touch-action:none;user-select:none}.key{position:absolute;top:0;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:5px;font-family:"Courier Prime",monospace}.key.white{height:100%;background:#c9d3df;border:1px solid var(--bg);z-index:1}.key.black{height:58%;background:#141a24;border:1px solid var(--border);z-index:2}.key.white.down{background:var(--tone)}.key.black.down{background:#b8862a;border-color:var(--tone)}.key-label{font-size:10px;text-transform:uppercase;color:#5a6678;pointer-events:none}.key.black .key-label{color:var(--dim)}.key-name{font-size:9px;color:#7a8698;pointer-events:none}.key-hint{font-family:"Courier Prime",monospace;font-size:11px;color:var(--dim);margin-top:6px}.key-hint b{color:var(--tone);font-weight:normal}.table-wrap{flex:1;min-height:0;overflow-y:auto;border:1px solid var(--border);background:var(--surface)}table.orders{width:100%;table-layout:fixed;border-collapse:collapse;font-family:"Courier Prime",monospace;font-size:10px}table.orders th{position:sticky;top:0;background:var(--panel);color:var(--dim);font-weight:normal;text-align:right;padding:5px 4px;border-bottom:1px solid var(--border)}table.orders th.c-m{width:12%}table.orders th.c-j{width:26%}table.orders th.c-sq{width:22%}table.orders th.c-f{width:20%}table.orders th.c-t{width:20%}table.orders th.j{color:var(--accent)}table.orders td{text-align:right;padding:3px 4px;color:var(--dim);white-space:nowrap;overflow:hidden}table.orders td.j{color:var(--accent)}table.orders td.f{color:var(--tone)}table.orders td.t{color:var(--space)}table.orders td.m{color:var(--text)}table.orders tr.carrier{background:rgba(53,224,208,0.07)}table.orders td.flag{opacity:0.45;font-style:italic}@media(max-width:768px){html,body{height:auto;overflow:auto}.workspace{flex-direction:column}.panel{overflow-y:visible;border-right:none;border-bottom:1px solid var(--border)}.panel.controls,.panel.numbers{width:auto}.panel.numbers{border-left:none;border-bottom:none}.table-wrap{max-height:320px}.dom{padding:14px 16px 12px}.spectrum{height:200px;flex:none}}