:root{--bg-color:#00000c;--bg-subtle:#000510;--panel-bg:#000612f5;--panel-bg-solid:#00060e;--panel-border:#00c8ff2e;--panel-border-focus:#00c8ff8c;--panel-border-strong:#00c8ff4d;--sub-block-bg:#000a1cd9;--sub-block-border:#00c8ff1a;--text-primary:#d8f0ff;--text-secondary:#00c8ffb8;--text-muted:#00c8ff61;--text-dim:#00c8ff29;--knob-track-color:#00c8ff1a;--input-bg:#000816fa;--input-border:#00c8ff24;--input-border-focus:#00c8ff8c;--sys-bar-bg:#00050fe0;--sys-bar-border:#00c8ff1f;--header-divider:#00c8ff1f;--cyan:#00c8ff;--cyan-glow:#00c8ff38;--magenta:#ff1e8e;--magenta-glow:#ff1e8e38;--gold:#ffd000;--gold-glow:#ffd0002e;--amber:#ff9200;--amber-glow:#ff92002e;--btn-active-cyan:#00e5ff;--btn-active-cyan-glow:#00e5ff61;--btn-active-magenta:#ff1a6e;--btn-active-magenta-glow:#ff1a6e61;--btn-active-yellow:#ffe000;--btn-active-yellow-glow:#ffe00061;--btn-active-green:#00ff9d;--btn-active-green-glow:#00ff9d61;--font-display:var(--font-display-next,"Orbitron"),"Orbitron",system-ui,sans-serif;--font-body:var(--font-body-next,"Outfit"),"Outfit",system-ui,sans-serif;--shadow-sm:0 2px 10px #000c,0 0 0 1px #00c8ff0a;--shadow-md:0 8px 28px #000000e6,0 0 20px #0064c80f;--shadow-lg:0 16px 48px #000000f2,0 0 40px #0064c814;--gap:14px;--radius-lg:10px;--radius-md:6px;--radius-sm:4px}body.light-theme{--bg-color:#d0cfc8;--bg-subtle:#c4c3bc;--panel-bg:#e4e2dafa;--panel-bg-solid:#e4e2da;--panel-border:#503c1438;--panel-border-focus:#b464008c;--panel-border-strong:#503c1459;--sub-block-bg:#d2d0c8e6;--sub-block-border:#503c1424;--text-primary:#1a1208;--text-secondary:#3d2e10;--text-muted:#7a6040;--text-dim:#b0a080;--knob-track-color:#503c1424;--input-bg:#c8c6be;--input-border:#503c1433;--input-border-focus:#b4640099;--sys-bar-bg:#c8c6bef2;--sys-bar-border:#503c142e;--header-divider:#503c1429;--cyan:#005a8c;--cyan-glow:#005a8c1f;--magenta:#8c0040;--magenta-glow:#8c00401a;--gold:#8c5800;--gold-glow:#8c58001a;--amber:#994d00;--amber-glow:#994d001a;--shadow-sm:0 2px 6px #0000002e;--shadow-md:0 6px 18px #00000038;--shadow-lg:0 12px 36px #00000047}*,:before,:after{box-sizing:border-box;-webkit-user-select:none;user-select:none;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-primary);font-family:var(--font-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;font-size:14px;line-height:1.4;transition:background-color .3s,color .3s;overflow-x:hidden}body:not(.light-theme){background-image:linear-gradient(#00c8ff07 1px,#0000 1px),linear-gradient(90deg,#00c8ff07 1px,#0000 1px),radial-gradient(at 50% 0,#00285073 0,#0000 55%),radial-gradient(at 80% 100%,#00143c4d 0,#0000 50%);background-size:44px 44px,44px 44px,100% 100%,100% 100%}body.light-theme{background-image:linear-gradient(#503c140f 1px,#0000 1px),linear-gradient(90deg,#503c140f 1px,#0000 1px),radial-gradient(at 30% 0,#ffc8781f 0,#0000 50%);background-size:44px 44px,44px 44px,100% 100%}#app-container{gap:var(--gap);flex-direction:column;width:100%;max-width:100%;margin:0 auto;padding:16px;display:flex}.panel{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:16px;transition:border-color .2s,box-shadow .2s;position:relative}body:not(.light-theme) .panel{box-shadow:var(--shadow-sm),inset 0 0 0 1px #00c8ff0a,0 0 0 1px #0009}.panel.glass{-webkit-backdrop-filter:blur(16px)}.panel:hover{border-color:var(--section-color,var(--panel-border-focus))}body:not(.light-theme) .panel:hover{box-shadow:var(--shadow-sm),0 0 18px var(--section-glow,#00c8ff14),inset 0 0 0 1px #00c8ff0f}.osc-panel{--section-color:#00e5ff;--section-glow:#00e5ff24}.filter-panel{--section-color:#ff1a6e;--section-glow:#ff1a6e24}.env-panel{--section-color:#ff9200;--section-glow:#ff920024}.lfo-panel{--section-color:#00ff9d;--section-glow:#00ff9d24}.fx-panel{--section-color:#c566ff;--section-glow:#c566ff24}.xy-pad-panel{--section-color:#ff1a6e;--section-glow:#ff1a6e24}.dist-lab-panel{--section-color:#ff6a00;--section-glow:#ff6a0024}.seq-panel{--section-color:#ffe000;--section-glow:#ffe00024}.keyboard-panel{--section-color:#00e5ff;--section-glow:#00e5ff1a}body.light-theme .osc-panel{--section-color:#005a8c;--section-glow:#005a8c1a}body.light-theme .filter-panel{--section-color:#8c0030;--section-glow:#8c00301a}body.light-theme .env-panel{--section-color:#940;--section-glow:#9944001a}body.light-theme .lfo-panel{--section-color:#006640;--section-glow:#0066401a}body.light-theme .fx-panel{--section-color:#5c2d91;--section-glow:#5c2d911a}body.light-theme .dist-lab-panel{--section-color:#8c3000;--section-glow:#8c30001a}body.light-theme .seq-panel{--section-color:#7a6000;--section-glow:#7a60001a}.panel-header{font-family:var(--font-display);letter-spacing:.22em;color:var(--section-color,var(--text-muted));text-transform:uppercase;border-bottom:1px solid var(--section-color,var(--header-divider));opacity:.85;align-items:center;gap:8px;margin-bottom:14px;padding-bottom:8px;font-size:.65rem;font-weight:800;display:flex}body:not(.light-theme) .panel-header{text-shadow:0 0 10px var(--section-glow,transparent)}.panel-header:before{content:"";background:var(--section-color,var(--text-muted));opacity:1;width:3px;height:11px;box-shadow:0 0 6px var(--section-color,transparent);border-radius:1px;display:inline-block}.osc-block,.mixer-subblock,.filter-subblock,.env-block,.lfo-block,.dist-lab-controls-col,.dist-lab-curve-col,.dist-lab-scope-col{background:var(--sub-block-bg);border:1px solid var(--section-color,var(--sub-block-border));border-radius:var(--radius-md);opacity:1;padding:10px}body:not(.light-theme) .osc-block,body:not(.light-theme) .mixer-subblock,body:not(.light-theme) .filter-subblock,body:not(.light-theme) .env-block,body:not(.light-theme) .lfo-block,body:not(.light-theme) .dist-lab-controls-col,body:not(.light-theme) .dist-lab-curve-col,body:not(.light-theme) .dist-lab-scope-col{border-color:#00c8ff1f;box-shadow:inset 0 0 0 1px #00c8ff08}.block-label{font-family:var(--font-display);letter-spacing:.2em;color:var(--section-color,var(--text-muted));text-transform:uppercase;opacity:.75;margin-bottom:10px;font-size:.56rem;font-weight:700}body:not(.light-theme) .block-label{text-shadow:0 0 8px var(--section-glow,transparent)}.theme-toggle-container{align-items:center;margin-left:8px;display:flex}.theme-btn{background:var(--sub-block-bg);border:1px solid var(--panel-border-strong);color:var(--text-secondary);cursor:pointer;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:34px;height:34px;padding:0;transition:all .2s;display:flex}.theme-btn:hover{background:var(--panel-border-strong);border-color:var(--panel-border-focus);color:var(--text-primary);transform:scale(1.08)}.theme-btn svg{width:15px;height:15px}.theme-btn svg.hide{display:none}header.panel.synth-header{flex-direction:column;gap:12px;padding:14px 18px 0;display:flex}.header-top{grid-template-columns:190px 1fr 44px;align-items:center;gap:14px;display:grid}.logo-area{flex-direction:column;gap:0;padding-right:6px;display:flex}.logo-wordmark{align-items:baseline;margin-bottom:4px;line-height:1;display:flex}.logo-jr{font-family:var(--font-display);letter-spacing:-.03em;background:linear-gradient(#fff 0%,#e0e0e0 20%,#a0a0a0 45%,#d8d8d8 60%,#f5f5f5 75%,#bdbdbd 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 6px #000c);-webkit-background-clip:text;background-clip:text;font-size:2.55rem;font-weight:900;line-height:1}.logo-num{font-family:var(--font-display);letter-spacing:-.03em;background:linear-gradient(#ffbd4f 0%,#ff9200 30%,#cc6a00 60%,#ff9e1a 80%,#ffbd4f 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 8px #ff92008c)drop-shadow(0 2px 4px #000000b3);-webkit-background-clip:text;background-clip:text;font-size:2.55rem;font-weight:900;line-height:1}body.light-theme .logo-jr{background:linear-gradient(#181818 0%,#3a3a3a 50%,#181818 100%);filter:none;-webkit-background-clip:text;background-clip:text}body.light-theme .logo-num{background:linear-gradient(#c50 0%,#930 50%,#c25200 100%);filter:none;-webkit-background-clip:text;background-clip:text}.logo-rule{background:linear-gradient(90deg,#0000,#ff920099 40%,#fff3 100%);width:100%;height:1px;margin-bottom:5px}body.light-theme .logo-rule{background:linear-gradient(90deg,#0000,#b4500073 40%,#0000001a 100%)}.logo-tagline{font-family:var(--font-display);letter-spacing:.25em;color:#ff9200;white-space:nowrap;text-shadow:0 0 8px #ff920059;margin-bottom:2px;font-size:.46rem;font-weight:700}body.light-theme .logo-tagline{color:#930;text-shadow:none}.logo-osc-count{font-family:var(--font-display);letter-spacing:.18em;color:var(--text-dim);font-size:.4rem;font-weight:400}.header-matrix{border:1px solid var(--panel-border-strong);border-radius:var(--radius-md);background:var(--panel-border);grid-template-columns:1fr 160px 180px;gap:1px;display:grid;overflow:hidden}.matrix-section{background:var(--panel-bg-solid);flex-direction:column;display:flex}.matrix-section-label{font-family:var(--font-display);letter-spacing:.26em;color:#00c8ff8c;text-align:center;text-transform:uppercase;text-shadow:0 0 8px #00c8ff4d;background:#0000008c;border-bottom:1px solid #00c8ff24;padding:4px 8px;font-size:.44rem;font-weight:700}body.light-theme .matrix-section-label{color:#7a5020;text-shadow:none;background:#503c1412;border-bottom-color:#503c1429}.matrix-section-body{flex:1;justify-content:center;align-items:center;gap:7px;padding:9px 12px;display:flex}.lcd-display{text-align:center;cursor:default;-webkit-user-select:none;user-select:none;background:#090600;border:1px solid #ff8a0033;border-radius:3px;flex:1;min-width:0;padding:7px 14px;overflow:hidden;box-shadow:inset 0 2px 8px #000000e6,0 0 12px #ff8a000a}#preset-display-text{font-family:var(--font-display);letter-spacing:.12em;color:#ff9200;text-shadow:0 0 12px #ff9200bf;white-space:nowrap;text-overflow:ellipsis;font-size:.75rem;font-weight:700;transition:color .12s,text-shadow .12s;display:block;overflow:hidden}body.light-theme .lcd-display{background:#fff7e0;border-color:#a05a0047;box-shadow:inset 0 1px 3px #00000012}body.light-theme #preset-display-text{color:#994d00;text-shadow:none}.bpm-lcd{color:#ff9200;font-family:var(--font-display);letter-spacing:.06em;text-align:center;text-shadow:0 0 10px #ff9200a6;-moz-appearance:textfield;background:#090600;border:1px solid #ff8a0033;border-radius:3px;outline:none;width:70px;padding:6px 4px;font-size:1.15rem;font-weight:700;transition:border-color .15s;box-shadow:inset 0 2px 6px #000000d9}.bpm-lcd::-webkit-inner-spin-button{-webkit-appearance:none}.bpm-lcd::-webkit-outer-spin-button{-webkit-appearance:none}.bpm-lcd:focus{border-color:#ff920080}body.light-theme .bpm-lcd{color:#994d00;text-shadow:none;background:#fff7e0;border-color:#a05a0047;box-shadow:inset 0 1px 2px #00000012}.matrix-arrow-btn{background:var(--sub-block-bg);border:1px solid var(--panel-border-strong);color:var(--text-secondary);cursor:pointer;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;padding:0;font-size:.65rem;transition:all .12s;display:flex}.matrix-arrow-btn:hover{background:var(--panel-border-strong);color:#ff9200;border-color:#ff8a0066}.matrix-arrow-btn:active{background:#ff8a001a;transform:scale(.88)}.matrix-btn{font-family:var(--font-display);letter-spacing:.06em;cursor:pointer;background:var(--sub-block-bg);border:1px solid var(--panel-border);color:var(--text-secondary);border-radius:4px;padding:6px 12px;font-size:.68rem;font-weight:700;transition:all .12s}.matrix-btn:hover{background:var(--panel-border);color:var(--text-primary);border-color:var(--panel-border-strong)}.matrix-play-btn.active{background:var(--btn-active-green-glow);border-color:var(--btn-active-green);color:var(--btn-active-green);box-shadow:0 0 12px var(--btn-active-green-glow)}.matrix-play-btn:not(.active):hover,.matrix-play-btn:hover{background:var(--btn-active-green-glow);border-color:var(--btn-active-green);color:var(--btn-active-green)}.preset-select-hidden{display:none!important}.header-right-controls{justify-content:flex-end;align-items:center;display:flex}.scope-row{align-items:stretch;gap:8px;padding-bottom:14px;display:flex}.scope-channel-label{font-family:var(--font-display);color:var(--text-dim);writing-mode:vertical-lr;text-orientation:mixed;letter-spacing:.1em;flex-shrink:0;justify-content:center;align-items:center;width:12px;font-size:.52rem;font-weight:700;display:flex}.visualizer-container{border-radius:var(--radius-md);background:#000308;border:1px solid #00c8ff40;flex:1;height:96px;position:relative;overflow:hidden;box-shadow:0 0 14px #00c8ff14,inset 0 0 20px #0009}body:not(.light-theme) .visualizer-container:after{content:"";pointer-events:none;z-index:2;border-radius:inherit;background:repeating-linear-gradient(0deg,#0000,#0000 2px,#0000002e 2px 4px);position:absolute;inset:0}body.light-theme .visualizer-container{background:#f5f0e8;border-color:#503c144d;box-shadow:inset 0 1px 4px #0000001a}canvas#visualizer-canvas{width:100%;height:100%;display:block}select{background:var(--input-bg);border:1px solid var(--input-border);color:var(--text-primary);font-family:var(--font-body);border-radius:var(--radius-sm);cursor:pointer;appearance:none;outline:none;min-width:175px;padding:6px 10px;font-size:.82rem;font-weight:600;transition:border-color .15s}select:focus,select:hover{border-color:var(--input-border-focus)}input[type=number]{background:var(--input-bg);border:1px solid var(--input-border);color:var(--text-primary);font-family:var(--font-body);border-radius:var(--radius-sm);text-align:center;outline:none;width:62px;padding:6px 8px;font-size:.82rem;font-weight:600;transition:border-color .15s}input[type=number]:focus{border-color:var(--input-border-focus)}#seq-swing-slider{width:90px;accent-color:var(--text-primary)}.bpm-control{gap:6px;display:flex}button{background:var(--sub-block-bg);border:1px solid var(--panel-border);color:var(--text-secondary);font-family:var(--font-display);letter-spacing:.06em;border-radius:var(--radius-sm);cursor:pointer;padding:6px 13px;font-size:.72rem;font-weight:700;transition:background .15s,border-color .15s,color .15s,box-shadow .15s}button:hover{background:var(--panel-border);border-color:var(--panel-border-strong);color:var(--text-primary)}button.active{background:var(--btn-active-cyan-glow);border-color:var(--btn-active-cyan);color:var(--btn-active-cyan);box-shadow:0 0 10px var(--btn-active-cyan-glow)}.seq-transport{flex-shrink:0;gap:6px;margin-left:auto;display:flex}.glow-btn-cyan{border:1px solid var(--panel-border);color:var(--text-secondary);background:0 0}.glow-btn-cyan:hover,.glow-btn-cyan.active{background:var(--btn-active-green-glow);border-color:var(--btn-active-green);color:var(--btn-active-green);box-shadow:0 0 14px var(--btn-active-green-glow)}.synth-grid{gap:var(--gap);grid-template-columns:1.15fr 1fr;align-items:start;display:grid}body:not(.light-theme) .panel:before,body:not(.light-theme) .panel:after{content:"";border-color:var(--section-color,#00c8ff80);pointer-events:none;z-index:1;border-style:solid;width:10px;height:10px;position:absolute}body:not(.light-theme) .panel:before{border-width:1.5px 0 0 1.5px;border-radius:2px 0 0;top:4px;left:4px}body:not(.light-theme) .panel:after{border-width:0 1.5px 1.5px 0;border-radius:0 0 2px;bottom:4px;right:4px}.oscillator-blocks{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.osc-block .knobs-row{grid-template-columns:1fr 1fr;justify-items:center;gap:6px 4px;display:grid}.wave-selector{background:var(--input-bg);border-radius:var(--radius-sm);border:1px solid var(--sub-block-border);gap:3px;margin-bottom:10px;padding:3px;display:flex}.wave-btn{color:var(--text-muted);background:0 0;border:none;border-radius:4px;flex:1;justify-content:center;align-items:center;padding:5px 0;transition:color .15s,background .15s;display:flex}.wave-btn svg{width:15px;height:15px}.wave-btn:hover{color:var(--text-primary);background:var(--panel-border)}.wave-btn.active{color:var(--btn-active-yellow);box-shadow:0 0 10px var(--btn-active-yellow-glow),inset 0 0 6px #ffe00014;background:#ffe00026;border:1px solid #ffe00073}body:not(.light-theme) .wave-btn.active{text-shadow:0 0 8px var(--btn-active-yellow)}body.light-theme .wave-btn.active{color:#7a5800;box-shadow:none;background:#c896001f;border-color:#a06e0080}.mic-btn{background:var(--sub-block-bg);color:var(--text-secondary);border:1px solid var(--panel-border);font-family:var(--font-display);letter-spacing:.1em;border-radius:var(--radius-sm);cursor:pointer;width:100%;margin-top:8px;padding:7px 10px;font-size:.62rem;font-weight:700;transition:all .15s}.mic-btn:hover{border-color:var(--panel-border-focus);color:var(--text-primary)}.mic-btn.enabled{background:var(--btn-active-green-glow)\!important;color:var(--btn-active-green)\!important;border-color:var(--btn-active-green)\!important;box-shadow:0 0 10px var(--btn-active-green-glow)\!important}.wavetable-display-container{background:var(--input-bg);border:1px solid var(--sub-block-border);border-radius:var(--radius-sm);align-items:center;gap:8px;margin-bottom:8px;padding:4px 8px;display:flex}.wt-label{font-family:var(--font-display);color:var(--text-muted);letter-spacing:.08em;font-size:.55rem}.wt-val{font-family:var(--font-display);color:var(--text-primary);font-size:.75rem;font-weight:700}.knobs-row{flex-wrap:wrap;justify-content:space-around;align-items:flex-start;gap:6px;display:flex}.knob-container{cursor:ns-resize;flex-direction:column;align-items:center;width:52px;display:flex;position:relative}.knob-container.large{width:72px}.knob-svg{width:40px;height:40px;display:block}.knob-container.large .knob-svg{width:56px;height:56px}.knob-track{fill:none;stroke:var(--knob-track-color);stroke-width:4px;stroke-linecap:round}.knob-val-arc{fill:none;stroke:var(--section-color,var(--cyan));stroke-width:4px;stroke-linecap:round;filter:drop-shadow(0 0 4px var(--section-glow,var(--cyan-glow)));transition:stroke .25s,filter .25s}.knob-body{stroke:#ffffff12;stroke-width:1px}body.light-theme .knob-body{stroke:#0000001f}.knob-pointer{stroke:var(--text-primary);stroke-width:2.5px;stroke-linecap:round;filter:drop-shadow(0 0 1px #000000e6);transition:stroke .15s}.knob-container:hover .knob-pointer{stroke:var(--btn-active-cyan);filter:drop-shadow(0 0 3px var(--btn-active-cyan))}.knob-label{font-family:var(--font-display);color:var(--text-muted);text-align:center;letter-spacing:.04em;white-space:nowrap;margin-top:3px;font-size:.5rem;font-weight:700}.knob-value{font-family:var(--font-display);color:var(--text-primary);opacity:0;pointer-events:none;text-shadow:0 0 4px var(--panel-bg-solid);font-size:.52rem;font-weight:700;transition:opacity .12s;position:absolute;top:14px}.knob-container.large .knob-value{top:21px}.knob-container:hover .knob-value{opacity:1}.filter-controls{flex-direction:column;gap:12px;display:flex}.mixer-knobs-grid{grid-template-columns:repeat(3,1fr);justify-items:center;gap:10px 6px;margin-top:8px;display:grid}.filter-type-selector{gap:5px;margin-bottom:10px;display:flex}.filter-btn{letter-spacing:.04em;white-space:nowrap;text-overflow:ellipsis;flex:1;padding:7px 0;font-size:.6rem;overflow:hidden}.filter-btn.active{border-color:var(--btn-active-magenta);color:var(--btn-active-magenta);box-shadow:0 0 10px var(--btn-active-magenta-glow);background:#ff1a6e24}body.light-theme .filter-btn.active{color:#c04;box-shadow:none;background:#c8003c14;border-color:#c04}.oberheim-mode-selector{justify-content:center;gap:4px;margin-bottom:10px;animation:.2s ease-out slideDown;display:flex}.oberheim-mode-selector.hide{display:none}.mode-btn{padding:4px 10px;font-size:.6rem}.mode-btn.active{border-color:var(--btn-active-magenta);color:var(--btn-active-magenta);box-shadow:0 0 8px var(--btn-active-magenta-glow);background:#ff1a6e24}.knobs-grid{grid-template-columns:repeat(5,1fr);justify-items:center;gap:8px 4px;margin-top:8px;display:grid}.envelope-controls{grid-template-columns:1fr 1fr;gap:12px;display:grid}.env-visualizer{background:var(--input-bg);border-radius:var(--radius-sm);border:1px solid var(--sub-block-border);height:110px;margin-bottom:10px;overflow:hidden}.env-visualizer canvas{width:100%;height:100%;display:block}.sliders-row{justify-content:space-around;height:100px;padding-bottom:4px;display:flex}.slider-group{flex-direction:column;align-items:center;gap:5px;display:flex}.slider-group label{font-family:var(--font-display);color:var(--text-muted);font-size:.62rem;font-weight:700}.vertical-slider{appearance:none;background:var(--knob-track-color);writing-mode:vertical-lr;border:1px solid var(--sub-block-border);direction:rtl;border-radius:3px;outline:none;width:5px;height:66px}.vertical-slider::-webkit-slider-thumb{appearance:none;background:var(--text-secondary);cursor:pointer;border-radius:3px;width:15px;height:10px;transition:background .12s;box-shadow:0 1px 4px #00000080}.vertical-slider::-webkit-slider-thumb:hover{background:var(--text-primary)}.vertical-slider::-moz-range-thumb{background:var(--text-secondary);cursor:pointer;border:none;border-radius:3px;width:15px;height:10px}.lfo-controls{grid-template-columns:1fr 1fr;gap:10px;display:grid}.lfo-wave-row{background:var(--input-bg);border-radius:var(--radius-sm);border:1px solid var(--sub-block-border);gap:3px;margin-bottom:10px;padding:3px;display:flex}.lfo-wave-btn{color:var(--text-muted);letter-spacing:.04em;background:0 0;border:none;flex:1;padding:5px 0;font-size:.52rem}.lfo-wave-btn:hover{color:var(--text-primary);background:var(--panel-border)}.lfo-wave-btn.active{color:var(--btn-active-green);box-shadow:0 0 10px var(--btn-active-green-glow),inset 0 0 6px #00ff9d0f;background:#00ff9d1f;border:1px solid #00ff9d6b}body:not(.light-theme) .lfo-wave-btn.active{text-shadow:0 0 8px var(--btn-active-green)}body.light-theme .lfo-wave-btn.active{color:#005030;box-shadow:none;background:#0078461a;border-color:#005a3273}.fx-controls{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.fx-block{padding:4px 10px}.border-right{border-right:1px solid var(--panel-border)}.voice-buttons{gap:6px;display:flex}.voice-btn{flex:1;padding:7px 0;font-size:.62rem}.dist-lab-panel{grid-column:span 2}.dist-lab-layout{grid-template-columns:1.4fr 1.3fr 1.3fr;align-items:stretch;gap:12px;display:grid}.dist-lab-controls-col{flex-direction:column;justify-content:center;gap:14px;display:flex}.dist-type-selector{gap:4px;display:flex}.dist-btn{background:var(--sub-block-bg);border:1px solid var(--panel-border);color:var(--text-muted);border-radius:var(--radius-sm);font-family:var(--font-display);cursor:pointer;flex:1;padding:5px 0;font-size:.62rem;font-weight:700;transition:all .15s}.dist-btn:hover{border-color:var(--panel-border-focus);color:var(--text-primary)}.dist-btn.active{background:var(--btn-active-green-glow);color:var(--btn-active-green);border-color:var(--btn-active-green);box-shadow:0 0 10px var(--btn-active-green-glow)}body.light-theme .dist-btn.active{color:#063;box-shadow:none;background:#00a0501a;border-color:#084}.dist-lab-knobs{grid-template-columns:repeat(6,1fr);place-items:center;gap:10px 6px;display:grid}.dist-lab-knobs .knob-container{width:50px}.curve-drawer-container{background:var(--input-bg);border:1px solid var(--panel-border);border-radius:var(--radius-sm);height:210px;position:relative;overflow:hidden}body:not(.light-theme) .curve-drawer-container{box-shadow:inset 0 0 16px #00d4ff0a}.curve-drawer-container canvas{z-index:2;cursor:crosshair;width:100%;height:100%;display:block;position:absolute;top:0;left:0}.canvas-grid-overlay{pointer-events:none;background-image:linear-gradient(to right,var(--sub-block-border)1px,transparent 1px),linear-gradient(to bottom,var(--sub-block-border)1px,transparent 1px);z-index:1;background-size:10% 10%;width:100%;height:100%;position:absolute;top:0;left:0}.curve-actions{gap:4px;margin-top:8px;display:flex}.dist-action-btn{background:var(--sub-block-bg);border:1px solid var(--panel-border);font-family:var(--font-display);color:var(--text-muted);cursor:pointer;text-align:center;border-radius:4px;flex:1;padding:5px 0;font-size:.52rem;font-weight:700;transition:all .12s}.dist-action-btn:hover{border-color:var(--panel-border-focus);color:var(--text-primary);background:var(--panel-border)}#curve-reset-btn:hover{border-color:var(--btn-active-magenta);color:var(--btn-active-magenta)}.scope-container{background:var(--input-bg);border-radius:var(--radius-sm);border:1px solid #ffd7002e;height:210px;position:relative;overflow:hidden}body:not(.light-theme) .scope-container{box-shadow:inset 0 0 16px #ffd7000a}body.light-theme .scope-container{border-color:#b48c0040}.scope-container canvas{z-index:2;width:100%;height:100%;display:block;position:absolute;top:0;left:0}.scope-grid-overlay{pointer-events:none;background-image:linear-gradient(to right,var(--sub-block-border)1px,transparent 1px),linear-gradient(to bottom,var(--sub-block-border)1px,transparent 1px);z-index:1;background-size:12.5% 12.5%;width:100%;height:100%;position:absolute;top:0;left:0}.scope-legend{z-index:3;font-family:var(--font-display);gap:8px;font-size:.48rem;font-weight:700;display:flex;position:absolute;top:6px;right:6px}.scope-legend span{align-items:center;gap:3px;display:flex}.scope-legend .bullet{border-radius:50%;width:4px;height:4px;display:inline-block}.scope-legend .legend-pre{color:var(--text-muted)}.scope-legend .legend-pre .bullet{background:var(--text-muted)}.scope-legend .legend-post{color:var(--btn-active-cyan)}.scope-legend .legend-post .bullet{background:var(--btn-active-cyan);box-shadow:0 0 3px var(--btn-active-cyan)}.seq-panel{grid-column:span 2}.seq-settings-bar{background:var(--sys-bar-bg);border-radius:var(--radius-md);border:1px solid var(--sys-bar-border);align-items:center;gap:18px;margin-bottom:14px;padding:8px 14px;display:flex}.seq-lane-selector{gap:5px;margin-left:auto;display:flex}.lane-tab{padding:5px 11px;font-size:.62rem}.lane-tab.active{background:var(--text-muted);border-color:var(--text-muted);color:var(--panel-bg-solid);box-shadow:none}body.light-theme .lane-tab.active{background:var(--text-primary);border-color:var(--text-primary);color:#fff}.sequencer-grid-container{grid-template-columns:76px 1fr;gap:10px;display:grid;overflow-x:auto}.seq-grid-labels{flex-direction:column;gap:10px;padding-top:12px;display:flex}.seq-row-label{font-family:var(--font-display);color:var(--text-muted);letter-spacing:.06em;align-items:center;height:28px;font-size:.52rem;font-weight:700;display:flex}.seq-row-label.label-val{height:100px}.seq-step-cols{grid-template-columns:repeat(16,1fr);gap:5px;min-width:680px;display:grid}.seq-col{flex-direction:column;align-items:center;gap:10px;display:flex;position:relative}.seq-led{background:var(--text-dim);border-radius:50%;width:5px;height:5px;margin-bottom:3px;transition:all 80ms}.seq-led.active{background:var(--btn-active-green);box-shadow:0 0 8px var(--btn-active-green),0 0 16px var(--btn-active-green)}.step-trigger-btn{background:var(--sub-block-bg);border:1px solid var(--panel-border);width:26px;height:26px;color:var(--text-muted);font-family:var(--font-display);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:.5rem;transition:all .12s;display:flex}.step-trigger-btn:hover{background:var(--panel-border);color:var(--text-primary);border-color:var(--panel-border-strong)}.step-trigger-btn.step-on{background:var(--btn-active-cyan);border-color:var(--btn-active-cyan);color:#000;box-shadow:0 0 8px var(--btn-active-cyan-glow)}.step-trigger-btn.step-tie{background:var(--btn-active-yellow);border-color:var(--btn-active-yellow);color:#000;box-shadow:0 0 8px var(--btn-active-yellow-glow)}.step-slider-container{justify-content:center;align-items:center;width:100%;height:100px;display:flex;position:relative}.seq-step-slider{appearance:none;background:var(--knob-track-color);writing-mode:vertical-lr;border:1px solid var(--sub-block-border);direction:rtl;border-radius:2px;width:4px;height:100px}.seq-step-slider::-webkit-slider-thumb{appearance:none;background:var(--text-secondary);cursor:pointer;border-radius:50%;width:11px;height:11px;transition:background .1s;box-shadow:0 1px 4px #00000080}.seq-step-slider::-webkit-slider-thumb:hover{background:var(--text-primary)}.seq-step-slider::-moz-range-thumb{background:var(--text-secondary);cursor:pointer;border:none;border-radius:50%;width:11px;height:11px}.step-tooltip{font-family:var(--font-display);color:var(--text-muted);height:11px;margin-top:3px;font-size:.48rem;font-weight:700}.step-extra-btn{background:var(--sub-block-bg);border:1px solid var(--panel-border);color:var(--text-muted);border-radius:3px;padding:2px 5px;font-size:.48rem}.step-extra-btn.active{background:var(--text-muted);border-color:var(--text-muted);color:var(--panel-bg-solid)}.xy-pad-panel{flex-direction:column;gap:8px;display:flex}.xy-selectors{flex-direction:column;gap:5px;display:flex}.xy-selector-row{align-items:center;gap:6px;display:flex}.xy-axis-tag{font-family:var(--font-display);letter-spacing:.04em;text-align:center;flex-shrink:0;width:14px;font-size:.6rem;font-weight:700}.xy-axis-x{color:var(--btn-active-cyan)}.xy-axis-y{color:var(--btn-active-magenta)}body.light-theme .xy-axis-x{color:#06b}body.light-theme .xy-axis-y{color:#c04}.xy-param-select{background:var(--input-bg);border:1px solid var(--input-border);border-radius:var(--radius-sm);color:var(--text-primary);font-family:var(--font-display);cursor:pointer;outline:none;flex:1;min-width:0;padding:3px 6px;font-size:.5rem;transition:border-color .12s}.xy-param-select:hover,.xy-param-select:focus{border-color:var(--input-border-focus)}.xy-pad-container{border-radius:var(--radius-sm);border:1px solid var(--panel-border);background:var(--input-bg);cursor:crosshair;flex:1;min-height:155px;position:relative;overflow:hidden}.xy-pad-container canvas{touch-action:none;width:100%;height:100%;display:block;position:absolute;top:0;left:0}.xy-pad-container.active{border-color:var(--btn-active-magenta);box-shadow:0 0 10px var(--btn-active-magenta-glow)}.xy-readout{justify-content:space-between;gap:5px;display:flex}.xy-readout-item{background:var(--sub-block-bg);border:1px solid var(--sub-block-border);border-radius:var(--radius-sm);font-family:var(--font-display);flex:1;align-items:center;gap:5px;padding:3px 7px;font-size:.52rem;display:flex;overflow:hidden}.xy-readout-axis{flex-shrink:0;font-size:.48rem;font-weight:700}.xy-readout-x .xy-readout-axis{color:var(--btn-active-cyan)}.xy-readout-y .xy-readout-axis{color:var(--btn-active-magenta)}body.light-theme .xy-readout-x .xy-readout-axis{color:#06b}body.light-theme .xy-readout-y .xy-readout-axis{color:#c04}.xy-readout-item span:last-child{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}footer.panel.keyboard-panel{flex-direction:row;align-items:stretch;gap:14px;padding:13px 16px;display:flex}.kb-left-controls{flex-direction:column;flex-shrink:0;align-items:center;gap:8px;width:122px;display:flex}.kb-main{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.transpose-section{border-bottom:1px solid var(--header-divider);flex-direction:column;align-items:center;gap:5px;width:100%;padding-bottom:8px;display:flex}.transpose-label{font-family:var(--font-display);letter-spacing:.14em;color:var(--text-muted);font-size:.48rem}.transpose-row{align-items:center;gap:5px;display:flex}.transpose-btn{border-radius:var(--radius-sm);border:1px solid var(--panel-border);background:var(--sub-block-bg);width:21px;height:21px;color:var(--text-secondary);cursor:pointer;justify-content:center;align-items:center;font-size:.95rem;line-height:1;transition:all .12s;display:flex}.transpose-btn:hover{border-color:var(--panel-border-focus);color:var(--text-primary)}.transpose-display{font-family:var(--font-display);color:var(--text-primary);text-align:center;min-width:26px;font-size:.82rem;font-weight:700}.transpose-display.active{color:var(--btn-active-magenta)}.transpose-reset-btn{font-family:var(--font-display);letter-spacing:.08em;border:1px solid var(--panel-border);background:var(--sub-block-bg);color:var(--text-muted);cursor:pointer;border-radius:3px;padding:2px 8px;font-size:.46rem;transition:all .12s}.transpose-reset-btn:hover{border-color:var(--panel-border-focus);color:var(--text-primary)}.hold-btn{background:var(--sub-block-bg);border:1px solid var(--panel-border);border-radius:var(--radius-sm);width:100%;font-family:var(--font-display);color:var(--text-muted);cursor:pointer;letter-spacing:.08em;padding:4px 10px;font-size:.62rem;font-weight:700;transition:all .15s}.hold-btn:hover{border-color:var(--panel-border-focus);color:var(--text-primary)}.hold-btn.active{border-color:var(--btn-active-magenta);color:var(--btn-active-magenta);box-shadow:0 0 8px var(--btn-active-magenta-glow);background:#ff1a6e24}.strips-area{flex:1;justify-content:center;align-items:stretch;gap:10px;display:flex}.strip-wrapper{flex-direction:column;flex:1;align-items:center;gap:5px;display:flex}.strip-label{font-family:var(--font-display);letter-spacing:.12em;color:var(--text-muted);font-size:.44rem}.strip-track{background:var(--input-bg);border:1px solid var(--panel-border-strong);cursor:ns-resize;touch-action:none;-webkit-user-select:none;user-select:none;border-radius:13px;flex:1;width:26px;min-height:52px;position:relative;box-shadow:inset 0 2px 8px #0009}.strip-track:before{content:"";pointer-events:none;background:#000000b3;border-radius:2px;width:3px;position:absolute;top:10px;bottom:10px;left:50%;transform:translate(-50%)}.strip-center-mark{z-index:2;pointer-events:none;background:#ffd70073;height:1px;position:absolute;top:50%;left:5px;right:5px;transform:translateY(-50%)}.strip-thumb{border:1px solid var(--panel-border-strong);z-index:3;pointer-events:none;background:linear-gradient(#3a3a3a 0%,#1a1a1a 100%);border-radius:8px;height:15px;transition:top .18s cubic-bezier(.25,.46,.45,.94),box-shadow .1s,border-color .1s;position:absolute;left:4px;right:4px;transform:translateY(-50%);box-shadow:0 2px 5px #0009}body.light-theme .strip-thumb{background:linear-gradient(#c8c8c8 0%,#888 100%);border-color:#00000040}.strip-track.dragging .strip-thumb{box-shadow:0 2px 8px #000000b3,0 0 12px var(--btn-active-cyan-glow);border-color:var(--btn-active-cyan);transition:box-shadow .1s,border-color .1s}.midi-indicator{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-muted);align-self:flex-end;align-items:center;gap:5px;padding-right:2px;font-size:.62rem;font-weight:700;display:flex}.midi-indicator.online{color:var(--btn-active-green)}.midi-indicator.online:before{content:"";background:var(--btn-active-green);width:5px;height:5px;box-shadow:0 0 6px var(--btn-active-green);border-radius:50%;display:inline-block}.piano-keyboard{border-radius:var(--radius-md);height:155px;box-shadow:0 0 16px #00c8ff14,var(--shadow-md);-webkit-user-select:none;user-select:none;background:#00020a;border:1px solid #00c8ff47;position:relative;overflow:hidden}body.light-theme .piano-keyboard{box-shadow:var(--shadow-md);background:#e8e6de;border-color:#503c144d}.white-keys-container{width:100%;height:100%;display:flex}.key{cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-display);box-sizing:border-box;font-weight:700}.key.white{z-index:1;color:#5b6270;background:linear-gradient(#fcfcfc 0%,#f4f4f6 82%,#e2e4e8 100%);border-bottom:4px solid #b0b4bc;border-right:1px solid #bfc2c8;border-radius:0 0 5px 5px;flex-direction:column;flex:1;justify-content:flex-end;align-items:center;height:100%;padding-bottom:11px;transition:background 40ms,border-bottom-width 40ms,padding-bottom 40ms;display:flex;position:relative}.key.white:hover{background:linear-gradient(#fff 0%,#eeeff2 82%,#d6d8e0 100%)}.key.white.active{background:var(--btn-active-green);color:#000;border-bottom-width:1px;border-bottom-color:var(--btn-active-green);box-shadow:inset 0 6px 12px #00000038,0 0 18px var(--btn-active-green-glow);text-shadow:none;padding-bottom:9px}.key.black{z-index:2;color:#7a8090;background:linear-gradient(#252830 0%,#131620 72%,#070809 100%);border-bottom:5px solid #000;border-left:1px solid #000;border-right:1px solid #000;border-radius:0 0 4px 4px;flex-direction:column;justify-content:flex-end;align-items:center;width:4.4%;height:98px;padding-bottom:9px;transition:background 40ms,border-bottom-width 40ms,padding-bottom 40ms;display:flex;position:absolute;top:0;transform:translate(-50%);box-shadow:2px 4px 6px #00000073,inset 0 1px #ffffff1f}.key.black:hover{background:linear-gradient(#33363e 0%,#1e2028 72%,#0c0d10 100%)}.key.black.active{background:var(--btn-active-green);color:#000;box-shadow:inset 0 4px 8px #0006,0 0 18px var(--btn-active-green-glow);border-bottom-width:1px;padding-bottom:5px}.key-shortcut{opacity:.5;margin-bottom:5px;font-family:monospace;font-size:.62rem;font-weight:700}.key.white .key-shortcut{color:#6c7585}.key.black .key-shortcut{color:#a4adc1}.key-note{letter-spacing:.5px;font-size:.62rem;font-weight:800}.overlay{-webkit-backdrop-filter:blur(20px);z-index:9999;background:#020203e6;justify-content:center;align-items:center;width:100vw;height:100vh;transition:opacity .4s;display:flex;position:fixed;top:0;left:0}.overlay.hide{opacity:0;pointer-events:none}.activation-card{text-align:center;background:var(--panel-bg);border:1px solid var(--panel-border-focus);border-radius:var(--radius-lg);width:460px;box-shadow:var(--shadow-lg);padding:44px;animation:.35s ease-out zoomIn}.activation-card h2{font-family:var(--font-display);letter-spacing:.1em;color:var(--text-primary);margin-bottom:18px;font-size:2.3rem}.activation-card p{color:var(--text-secondary);margin-bottom:28px;font-size:.9rem;line-height:1.65}.activation-card button{border-radius:var(--radius-md);background:var(--text-primary);border-color:var(--text-primary);color:var(--panel-bg-solid);padding:11px 28px;font-size:.9rem}.activation-card button:hover{opacity:.88}@keyframes slideDown{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}@keyframes zoomIn{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}.dist-block{grid-column:span 1}.dist-layout{justify-content:space-between;align-items:center;gap:14px;height:100%;margin-top:5px;display:flex}.dist-controls{flex-direction:column;flex:1;gap:7px;display:flex}.dist-knobs-grid{grid-template-columns:repeat(3,1fr);gap:7px;display:grid}.dist-knobs-grid .knob-container{width:46px}@media (max-width:1280px){.synth-grid{grid-template-columns:1fr}header.panel.synth-header{gap:10px}.header-top{grid-template-columns:130px 1fr 44px}.header-matrix{grid-template-columns:1fr 140px 160px}.dist-lab-layout{grid-template-columns:1fr 1fr}.dist-lab-scope-col{grid-column:1/-1}.fx-controls{grid-template-columns:1fr 1fr}}@media (max-width:860px){:root{--gap:10px}header.panel.synth-header{padding:12px 14px 0}.header-top{grid-template-rows:auto auto;grid-template-columns:1fr auto}.logo-area{grid-column:1}.header-right-controls{grid-area:1/2}.header-matrix{grid-area:2/1/auto/-1;grid-template-columns:1fr}.tempo-section,.transport-section{flex-direction:row;align-items:stretch;display:flex}.oscillator-blocks{grid-template-columns:repeat(2,1fr)}.lfo-controls,.dist-lab-layout{grid-template-columns:1fr}.fx-controls{grid-template-columns:1fr 1fr}.envelope-controls{grid-template-columns:1fr}}
