:root{--bg-obsidian:#100f15;--bg-metal:#1a1820;--bg-panel:#24212ca6;--bg-panel-solid:#24212c;--bg-card:#2b283373;--border-subtle:#ffffff14;--border-medium:#ffffff26;--border-strong:#ffffff4d;--neon-purple:#b54cff;--neon-purple-dim:#b54cff40;--neon-purple-glow:#b54cff1f;--neon-teal:#00ffea;--neon-teal-dim:#00ffea40;--neon-teal-glow:#00ffea1f;--neon-emerald:#1aff79;--neon-emerald-dim:#1aff7940;--neon-emerald-glow:#1aff791f;--neon-pink:#f39;--neon-pink-dim:#ff339940;--neon-pink-glow:#ff33991f;--module-accent-purple:var(--neon-purple);--module-accent-purple-dim:var(--neon-purple-dim);--module-accent-purple-glow:var(--neon-purple-glow);--module-accent-pink:var(--neon-pink);--module-accent-pink-dim:var(--neon-pink-dim);--module-accent-pink-glow:var(--neon-pink-glow);--module-accent-emerald:var(--neon-emerald);--module-accent-emerald-dim:var(--neon-emerald-dim);--module-accent-emerald-glow:var(--neon-emerald-glow);--module-accent-teal:var(--neon-teal);--module-accent-teal-dim:var(--neon-teal-dim);--module-accent-teal-glow:var(--neon-teal-glow);--text-primary:#dcdfe5;--text-secondary:#9da3af;--text-dim:#676f7e;--text-bright:#fff;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-display:"Outfit", sans-serif;--font-mono:"JetBrains Mono", "Fira Code", "Courier New", monospace;--spring-snappy:cubic-bezier(.19, 1, .22, 1);--spring-responsive:cubic-bezier(.175, .885, .32, 1.275);--spring-fluid:cubic-bezier(.25, 1, .5, 1);font-family:var(--font-sans);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:var(--bg-obsidian);color:var(--text-primary)}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;margin:0;padding:0}body{background:var(--bg-obsidian);color:var(--text-primary);min-height:100vh;font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-obsidian)}::-webkit-scrollbar-thumb{background:var(--bg-metal);border:2px solid var(--bg-obsidian);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--neon-purple-dim)}.glass-container{background:var(--bg-panel);-webkit-backdrop-filter:blur(24px)saturate(180%);border:1px solid var(--border-subtle);will-change:transform, backdrop-filter;--module-accent:var(--module-accent-purple);--module-accent-dim:var(--module-accent-purple-dim);--module-accent-glow:var(--module-accent-purple-glow);--card-glow-scale:calc(.35 + .65 * cos(var(--coord-time,0deg) * 1.4 + var(--card-phase-offset,0deg)));transform:translate(0,0);transform:translate3d(0, calc(sin(var(--coord-time,0deg) + var(--card-phase-offset,0deg)) * 3.5px), 0);transition:border-color .3s var(--spring-fluid);border-radius:20px;position:relative;overflow:hidden}.accent-purple{--module-accent:var(--module-accent-purple);--module-accent-dim:var(--module-accent-purple-dim);--module-accent-glow:var(--module-accent-purple-glow)}.accent-pink{--module-accent:var(--module-accent-pink);--module-accent-dim:var(--module-accent-pink-dim);--module-accent-glow:var(--module-accent-pink-glow)}.accent-emerald{--module-accent:var(--module-accent-emerald);--module-accent-dim:var(--module-accent-emerald-dim);--module-accent-glow:var(--module-accent-emerald-glow)}.accent-teal{--module-accent:var(--module-accent-teal);--module-accent-dim:var(--module-accent-teal-dim);--module-accent-glow:var(--module-accent-teal-glow)}.glass-container:before{content:"";background:linear-gradient(135deg, #ffffff40 0%, #ffffff05 50%, var(--module-accent-dim) 100%);-webkit-mask-composite:xor;pointer-events:none;z-index:10;border-radius:20px;padding:1.5px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.glass-container-purple{--module-accent:var(--module-accent-purple);--module-accent-dim:var(--module-accent-purple-dim);--module-accent-glow:var(--module-accent-purple-glow)}.glass-container-teal{--module-accent:var(--module-accent-teal);--module-accent-dim:var(--module-accent-teal-dim);--module-accent-glow:var(--module-accent-teal-glow)}.glass-container-pink{--module-accent:var(--module-accent-pink);--module-accent-dim:var(--module-accent-pink-dim);--module-accent-glow:var(--module-accent-pink-glow)}.glass-container-emerald{--module-accent:var(--module-accent-emerald);--module-accent-dim:var(--module-accent-emerald-dim);--module-accent-glow:var(--module-accent-emerald-glow)}.glass-container.bloom,.bloom{box-shadow:0 0 calc(20px + 20px * var(--card-glow-scale,.5)) -5px var(--module-accent-glow), inset 0 0 calc(8px + 6px * var(--card-glow-scale,.5)) -2px var(--module-accent-glow)}.bloom-purple{box-shadow:0 0 calc(20px + 20px * var(--card-glow-scale,.5)) -5px var(--module-accent-purple-glow), inset 0 0 calc(8px + 6px * var(--card-glow-scale,.5)) -2px var(--module-accent-purple-glow)}.bloom-teal{box-shadow:0 0 calc(20px + 20px * var(--card-glow-scale,.5)) -5px var(--module-accent-teal-glow), inset 0 0 calc(8px + 6px * var(--card-glow-scale,.5)) -2px var(--module-accent-teal-glow)}h1,h2,h3,.brand-font{font-family:var(--font-display);letter-spacing:-.02em;color:var(--text-bright);font-weight:700}.flex-center{justify-content:center;align-items:center;display:flex}.glow-text-purple{text-shadow:0 0 12px var(--neon-purple-dim)}.glow-text-teal{text-shadow:0 0 12px var(--neon-teal-dim)}@keyframes float{0%{transform:translateY(0)}to{transform:translateY(-8px)}}@keyframes pulse-glow{0%{opacity:.6;text-shadow:0 0 4px var(--neon-pink-dim)}to{opacity:1;text-shadow:0 0 10px var(--neon-pink)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.animate-float{animation:float 4s var(--spring-fluid) infinite}.pulse-led{animation:pulse-glow 2s var(--spring-fluid) infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.console-wrapper{background:radial-gradient(circle at center, #15121c 0%, var(--bg-obsidian) 100%);flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:40px 20px;display:flex;position:relative}.console-wrapper:after{content:"";pointer-events:none;z-index:0;background-image:linear-gradient(#ffffff04 1px,#0000 1px),linear-gradient(90deg,#ffffff04 1px,#0000 1px);background-size:20px 20px;position:absolute;inset:0}.synth-rack{z-index:1;background:#15131b;border-radius:12px;grid-template-columns:40px 1fr 40px;width:100%;max-width:1200px;display:grid;position:relative;overflow:hidden;box-shadow:0 25px 70px -10px #000c,0 0 0 1px #ffffff0d}.rack-ear{background:linear-gradient(90deg,#18161d 0%,#24222b 100%);border-right:1px solid #ffffff0d;flex-direction:column;justify-content:space-between;align-items:center;padding:30px 0;display:flex;position:relative}.rack-ear-right{background:linear-gradient(-90deg,#18161d 0%,#24222b 100%);border-left:1px solid #ffffff0d;border-right:none}.rack-bolt{background:radial-gradient(circle at 35% 35%,#8c8c8c 0%,#404040 100%);border-radius:50%;width:16px;height:16px;position:relative;box-shadow:inset -1px -1px 2px #0009,inset 1px 1px 2px #fff6,0 2px 4px #00000080}.rack-bolt:before{content:"";background:#262626;height:2px;position:absolute;top:50%;left:10%;right:10%;transform:translateY(-50%)rotate(45deg)}.console-main{background:linear-gradient(#1c1a23 0%,#100f15 100%);flex-direction:column;gap:24px;padding:30px;display:flex}.console-header{border-bottom:2px solid #ffffff08;justify-content:space-between;align-items:center;padding-bottom:20px;display:flex}.console-brand{flex-direction:column;display:flex}.brand-title{letter-spacing:.1em;background:linear-gradient(90deg, var(--text-bright) 0%, var(--neon-purple) 50%, var(--neon-teal) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;align-items:center;gap:12px;font-size:26px;font-weight:800;display:flex}.brand-subtitle{text-transform:uppercase;letter-spacing:.25em;color:var(--text-secondary);font-size:11px;font-family:var(--font-mono);margin-top:4px}.console-indicators{align-items:center;gap:20px;display:flex}.indicator{font-family:var(--font-mono);color:var(--text-secondary);-webkit-backdrop-filter:blur(8px);border:1px solid var(--border-subtle);background:#13111773;border-radius:20px;align-items:center;gap:8px;padding:6px 12px;font-size:11px;display:flex}.led{width:8px;height:8px;transition:background-color .3s var(--spring-fluid), box-shadow .3s var(--spring-fluid);background-color:#3d3946;border-radius:50%}.led-power{background-color:var(--neon-teal);box-shadow:0 0 10px var(--neon-teal)}.led-voice{background-color:var(--neon-purple);box-shadow:0 0 10px var(--neon-purple)}.led-pulse{animation:pulse-glow 1s var(--spring-fluid) infinite alternate}.console-grid{grid-template-columns:1.2fr 1fr 1.2fr;gap:20px;display:grid}.console-grid>:first-child{--card-phase-offset:0deg}.console-grid>:nth-child(2){--card-phase-offset:20.0535deg}.console-grid>:nth-child(3){--card-phase-offset:40.107deg}.console-grid>:nth-child(4){--card-phase-offset:60.1606deg}.console-grid>:nth-child(5){--card-phase-offset:80.2141deg}.console-grid>:nth-child(6){--card-phase-offset:100.268deg}.console-grid>:nth-child(7){--card-phase-offset:120.321deg}.console-grid>:nth-child(8){--card-phase-offset:140.375deg}.console-grid>:nth-child(9){--card-phase-offset:160.428deg}.console-grid>:nth-child(10){--card-phase-offset:180.482deg}.console-grid>:nth-child(11){--card-phase-offset:200.535deg}.console-grid>:nth-child(12){--card-phase-offset:220.589deg}.console-grid>:nth-child(13){--card-phase-offset:240.642deg}.synth-module{flex-direction:column;height:100%;padding:20px;display:flex}.module-header{border-bottom:1px solid #ffffff0d;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:8px;display:flex}.module-title{text-transform:uppercase;letter-spacing:.15em;color:var(--text-secondary);font-size:12px;font-family:var(--font-mono)}.module-icon{width:14px;height:14px;color:var(--text-dim)}.module-content{flex-direction:column;flex-grow:1;justify-content:space-around;gap:20px;display:flex}.controls-row{justify-content:space-around;align-items:center;gap:16px;display:flex}.knob-container{cursor:ns-resize;flex-direction:column;align-items:center;display:flex;position:relative}.knob-wrapper{justify-content:center;align-items:center;width:68px;height:68px;display:flex;position:relative}.knob-ring{width:100%;height:100%;position:absolute;top:0;left:0;transform:rotate(-90deg)}.knob-ring-bg{fill:none;stroke:#ffffff0d;stroke-width:4px}.knob-ring-val{fill:none;stroke-width:4px;stroke-linecap:round;transition:stroke-dashoffset var(--knob-duration,80ms) var(--spring-fluid);will-change:stroke-dashoffset}.knob-dial{transform-origin:50%;width:46px;height:46px;transition:transform var(--knob-duration,80ms) var(--spring-fluid);will-change:transform;background:radial-gradient(circle at 35% 35%,#3a3645 0%,#1a1820 100%);border:1.5px solid #ffffff08;border-radius:50%;position:relative;box-shadow:0 4px 10px #0006,inset -1px -1px 3px #000c,inset 1px 1px 3px #ffffff1a}.knob-pointer{background-color:var(--text-bright);border-radius:2px;width:3px;height:12px;position:absolute;top:6px;left:50%;transform:translate(-50%);box-shadow:0 0 6px #fffc}.knob-label{font-family:var(--font-display);color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;text-align:center;margin-top:8px;font-size:11px;font-weight:500}.knob-value{font-family:var(--font-mono);color:var(--text-dim);margin-top:2px;font-size:10px}.selector-group{-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-subtle);background:#0c0b0f99;border-radius:8px;width:100%;padding:3px;display:flex}.selector-btn{color:var(--text-secondary);font-family:var(--font-mono);text-transform:uppercase;cursor:pointer;transition:background-color .2s var(--spring-snappy), color .2s var(--spring-snappy);text-align:center;background:0 0;border:none;border-radius:6px;flex:1;padding:8px 4px;font-size:10px;font-weight:600}.selector-btn:hover{color:var(--text-bright)}.selector-btn.active{background:var(--bg-panel-solid);color:var(--text-bright);box-shadow:inset 0 1px #ffffff1a,0 2px 8px #0006}.selector-btn.active.purple{border-bottom:2px solid var(--neon-purple);color:var(--neon-purple)}.selector-btn.active.teal{border-bottom:2px solid var(--neon-teal);color:var(--neon-teal)}.selector-btn.active.pink{border-bottom:2px solid var(--neon-pink);color:var(--neon-pink)}.selector-btn.active.emerald{border-bottom:2px solid var(--neon-emerald);color:var(--neon-emerald)}.faders-container{justify-content:space-between;gap:12px;width:100%;padding-top:10px;display:flex}.fader-wrapper{flex-direction:column;flex:1;align-items:center;height:180px;display:flex}.fader-track{border:1px solid var(--border-subtle);cursor:pointer;background:#09090cb3;border-radius:5px;width:10px;height:120px;margin-bottom:10px;position:relative;box-shadow:inset 0 2px 8px #000c}.fader-fill{width:100%;transition:height var(--fader-duration,80ms) var(--spring-fluid);will-change:height;border-radius:4px;position:absolute;bottom:0}.fader-fill-purple{background:linear-gradient(180deg, var(--neon-purple) 0%, #b54cff66 100%);box-shadow:0 0 8px var(--neon-purple-dim)}.fader-fill-teal{background:linear-gradient(180deg, var(--neon-teal) 0%, #00ffea66 100%);box-shadow:0 0 8px var(--neon-teal-dim)}.fader-handle{cursor:grab;width:24px;height:14px;transition:bottom var(--fader-duration,80ms) var(--spring-fluid);will-change:bottom;z-index:5;background:linear-gradient(#737373 0%,#262626 100%);border:1.5px solid #999;border-radius:3px;position:absolute;left:50%;transform:translate(-50%,50%);box-shadow:0 3px 6px #0009}.fader-handle:after{content:"";background-color:var(--neon-pink);height:2px;position:absolute;top:50%;left:2px;right:2px;transform:translateY(-50%)}.fader-label{font-family:var(--font-display);color:var(--text-secondary);font-size:10px;font-weight:600}.fader-value{font-family:var(--font-mono);color:var(--text-dim);margin-top:2px;font-size:9px}.adsr-graph-wrapper{-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-subtle);background:#09090c99;border-radius:10px;justify-content:center;align-items:center;padding:10px;display:flex;overflow:hidden}.adsr-graph{will-change:transform;width:100%;height:60px;display:block;transform:translate(0,0)}.adsr-path{fill:none;stroke:var(--neon-purple);stroke-width:2px;filter:drop-shadow(0 0 4px var(--neon-purple-dim));will-change:transform;transform:translate(0,0)}.adsr-fill-path{fill:url(#adsr-grad);stroke:none;will-change:transform;transform:translate(0,0)}.visualizer-card{flex-direction:column;grid-column:span 3;padding:20px;display:flex}.visualizer-container{-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-subtle);background:#070609bf;border-radius:12px;width:100%;height:130px;position:relative;overflow:hidden;box-shadow:inset 0 4px 20px #000c}.visualizer-canvas{width:100%;height:100%;display:block}.visualizer-overlay{pointer-events:none;flex-direction:column;display:flex;position:absolute;top:10px;left:15px}.visualizer-title{font-family:var(--font-mono);text-transform:uppercase;color:var(--neon-teal);letter-spacing:.1em;font-size:9px}.visualizer-db{font-family:var(--font-mono);color:var(--text-dim);margin-top:2px;font-size:8px}.audio-activation-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;text-align:center;background:#0b0a10e0;flex-direction:column;justify-content:center;align-items:center;padding:20px;display:flex;position:absolute;inset:0}.activation-btn{background:linear-gradient(135deg, var(--neon-purple) 0%, var(--neon-teal) 100%);color:var(--text-bright);font-family:var(--font-display);text-transform:uppercase;letter-spacing:.1em;cursor:pointer;box-shadow:0 10px 25px var(--neon-purple-glow), 0 0 0 1px #fff3;transition:transform .3s var(--spring-snappy), box-shadow .3s var(--spring-snappy);border:none;border-radius:30px;padding:12px 32px;font-size:14px;font-weight:700}.activation-btn:hover{box-shadow:0 15px 35px var(--neon-purple-dim), 0 0 20px var(--neon-teal-dim);transform:translateY(-2px)}.activation-btn:active{transform:translateY(0)}.synth-slider-container{flex-direction:column;width:100%;display:flex}.synth-slider-label-row{font-family:var(--font-display);color:var(--text-secondary);text-transform:uppercase;justify-content:space-between;margin-bottom:8px;font-size:11px;font-weight:500;display:flex}.synth-range-input{appearance:none;border:1px solid var(--border-subtle);background:#0006;border-radius:3px;outline:none;width:100%;height:6px}.synth-range-input::-webkit-slider-thumb{appearance:none;cursor:pointer;width:18px;height:18px;transition:border-color .15s var(--spring-snappy), box-shadow .15s var(--spring-snappy);background:radial-gradient(circle at 35% 35%,#999 0%,#333 100%);border:1.5px solid #b3b3b3;border-radius:50%;box-shadow:0 2px 5px #0009}.synth-range-input::-webkit-slider-thumb:hover{box-shadow:0 0 8px var(--neon-teal-dim);border-color:var(--neon-teal)}.keyboard-card{grid-column:span 3;padding:24px 30px}.keyboard-container{background:#131117;border:1.5px solid #0c0b0e;border-radius:8px;width:100%;height:180px;padding:6px;display:flex;position:relative;overflow-x:auto;box-shadow:inset 0 8px 16px #000c}.key-white{cursor:pointer;z-index:1;min-width:45px;height:100%;transition:background-color .12s var(--spring-responsive), border-color .12s var(--spring-responsive), padding-bottom .12s var(--spring-responsive), transform .12s var(--spring-responsive), box-shadow .12s var(--spring-responsive);background:linear-gradient(#efeef1 0%,#cfcdd6 100%);border:1px solid #a19daf;border-radius:0 0 5px 5px;flex-direction:column;flex:1;justify-content:flex-end;align-items:center;padding-bottom:12px;display:flex;position:relative;box-shadow:0 4px 4px #0000004d,inset 0 1px #fffc}.key-white:hover{background:linear-gradient(#fff 0%,#dfdde3 100%)}.key-white.active{background:linear-gradient(180deg, var(--neon-purple-glow) 0%, var(--neon-purple-dim) 100%);border-color:var(--neon-purple);height:calc(100% - 2px);box-shadow:0 0 15px var(--neon-purple-glow), inset 0 2px 10px #0006;padding-bottom:8px;transform:translateY(2px)}.key-black{z-index:2;cursor:pointer;width:28px;height:108px;transition:background-color .12s var(--spring-responsive), border-color .12s var(--spring-responsive), padding-bottom .12s var(--spring-responsive), transform .12s var(--spring-responsive), box-shadow .12s var(--spring-responsive);background:linear-gradient(#2b2833 0%,#131117 100%);border:1.5px solid #09090c;border-radius:0 0 4px 4px;flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:8px;display:flex;position:absolute;box-shadow:0 3px 6px #00000080,inset 0 1px #ffffff1a}.key-black:hover{background:linear-gradient(#3a3645 0%,#1c1a23 100%)}.key-black.active{background:linear-gradient(180deg, var(--neon-teal-glow) 0%, var(--neon-teal-dim) 100%);border-color:var(--neon-teal);height:106px;box-shadow:0 0 15px var(--neon-teal-glow), inset 0 2px 10px #0009;transform:translateY(2px)}.key-note{font-family:var(--font-display);color:#3d3946;font-size:11px;font-weight:700}.key-white.active .key-note{color:var(--neon-purple);text-shadow:0 0 8px #a78bfa80}.key-black .key-note{color:#bcb9c6;font-size:9px}.key-black.active .key-note{color:var(--neon-teal);text-shadow:0 0 8px #06b6d480}.key-trigger{font-family:var(--font-mono);color:#79738c;margin-top:4px;font-size:9px}.key-black .key-trigger{color:#615c70}.synth-footer{font-family:var(--font-mono);color:var(--text-dim);border-top:1px solid #ffffff08;justify-content:space-between;align-items:center;margin-top:10px;padding-top:15px;font-size:10px;display:flex}.instruction-hint{align-items:center;gap:6px;display:flex}.keycap{background:var(--bg-metal);border:1px solid var(--border-medium);color:var(--text-bright);border-radius:4px;padding:2px 6px;font-size:9px}.sequencer-module{flex-direction:column;padding:24px 30px;display:flex}.sequencer-controls{border:1px solid var(--border-subtle);background:#0c0b0f59;border-radius:12px;justify-content:space-between;align-items:center;gap:30px;margin-bottom:24px;padding:16px 20px;display:flex}@media (width<=768px){.sequencer-controls{flex-direction:column;align-items:stretch;gap:16px}}.sequencer-btn-group{gap:12px;display:flex}.seq-play-btn{background:linear-gradient(135deg, var(--neon-teal) 0%, #00ffeab3 100%);color:var(--bg-obsidian);font-family:var(--font-display);letter-spacing:.05em;cursor:pointer;box-shadow:0 4px 15px var(--neon-teal-glow);transition:transform .25s var(--spring-responsive), box-shadow .25s var(--spring-responsive), background-color .25s var(--spring-responsive), color .25s var(--spring-responsive);border:none;border-radius:8px;padding:10px 24px;font-size:12px;font-weight:800}.seq-play-btn:hover{box-shadow:0 6px 20px var(--neon-teal-dim);transform:translateY(-2px)}.seq-play-btn:active{transform:translateY(0)}.seq-play-btn.playing{background:linear-gradient(135deg, var(--neon-pink) 0%, #ff3399b3 100%);color:var(--text-bright);box-shadow:0 4px 15px var(--neon-pink-dim)}.seq-sub-btn{background:var(--bg-metal);border:1px solid var(--border-medium);color:var(--text-secondary);font-family:var(--font-display);cursor:pointer;transition:color .2s var(--spring-snappy), border-color .2s var(--spring-snappy), background-color .2s var(--spring-snappy);border-radius:8px;padding:10px 18px;font-size:11px;font-weight:700}.seq-sub-btn:hover{color:var(--text-bright);border-color:var(--border-strong);background:var(--bg-panel-solid)}.seq-midi-clock-btn{transition:color .25s var(--spring-responsive), border-color .25s var(--spring-responsive), background-color .25s var(--spring-responsive), box-shadow .25s var(--spring-responsive);position:relative}.seq-midi-clock-btn.active-midi-clock{color:var(--neon-teal);border-color:var(--neon-teal);box-shadow:0 0 15px var(--neon-teal-glow), inset 0 0 8px var(--neon-teal-glow);text-shadow:0 0 8px var(--neon-teal-dim);background:#00ffea0d}.seq-midi-clock-btn.active-midi-clock:hover{border-color:var(--neon-teal);box-shadow:0 0 20px var(--neon-teal-dim), inset 0 0 12px var(--neon-teal-glow);background:#00ffea1a}.seq-bpm-slider-container{flex-direction:column;flex-grow:1;max-width:320px;display:flex}.seq-bpm-label{font-family:var(--font-display);color:var(--text-secondary);letter-spacing:.05em;justify-content:space-between;margin-bottom:8px;font-size:11px;font-weight:600;display:flex}.seq-bpm-value{color:var(--neon-teal);font-family:var(--font-mono)}.sequencer-grid-container{flex-direction:column;gap:12px;padding-bottom:8px;display:flex;overflow-x:auto}.sequencer-playhead-row{align-items:center;display:flex}.track-header-spacer{flex-shrink:0;width:200px}.steps-indicators{flex-grow:1;justify-content:space-between;gap:10px;padding:0 10px;display:flex}.step-indicator{height:4px;transition:background-color .15s var(--spring-snappy), box-shadow .15s var(--spring-snappy);will-change:transform, opacity;background:#ffffff0d;border-radius:2px;flex:1;transform:translate(0,0)}.step-indicator.active{background:var(--neon-teal);box-shadow:0 0 10px var(--neon-teal)}.sequencer-tracks{flex-direction:column;gap:12px;display:flex}.sequencer-track-row{align-items:center;display:flex}.track-info{flex-direction:column;flex-shrink:0;gap:4px;width:200px;padding-right:20px;display:flex}.track-name{font-family:var(--font-display);letter-spacing:.05em;text-transform:uppercase;font-size:11px;font-weight:700}.track-note-select{border:1px solid var(--border-subtle);color:var(--text-primary);font-family:var(--font-mono);cursor:pointer;transition:border-color .2s var(--spring-snappy), color .2s var(--spring-snappy);background:#0c0b0fcc;border-radius:6px;outline:none;padding:4px 8px;font-size:11px}.track-note-select:hover{border-color:var(--border-medium);color:var(--text-bright)}.track-steps{flex-grow:1;justify-content:space-between;gap:10px;display:flex}.seq-step-btn{aspect-ratio:1.5;border:1px solid var(--border-subtle);cursor:pointer;min-height:42px;transition:background-color .2s var(--spring-responsive), border-color .2s var(--spring-responsive), transform .2s var(--spring-responsive);will-change:transform, border-color, box-shadow;background:#2b283359;border-radius:8px;flex:1;position:relative;overflow:hidden;transform:translate(0,0)}.seq-step-btn:hover{border-color:var(--border-medium);background:#3a364573;transform:scale(1.03)}.step-btn-inner{transition:background-color .2s var(--spring-responsive);background:0 0;border-radius:5px;position:absolute;inset:4px}.seq-step-btn.active{border-color:var(--step-color);box-shadow:0 0 12px var(--step-glow), inset 0 1px 0 #ffffff1a}.seq-step-btn.active .step-btn-inner{background:linear-gradient(135deg, var(--step-color) 0%, #ffffff1a 100%)}.seq-step-btn.playhead{border-color:var(--text-bright);box-shadow:0 0 15px #ffffff40}.seq-step-btn.playhead.active{border-color:var(--text-bright);box-shadow:0 0 18px var(--step-color), 0 0 8px #fff}.preset-manager-card{flex-direction:column;height:100%;padding:20px;display:flex}.preset-manager-content{flex-direction:column;flex-grow:1;gap:12px;display:flex}.active-preset-hud{border:1px solid var(--border-subtle);background:#070609a6;border-radius:10px;flex-direction:column;gap:2px;padding:10px 14px;display:flex;box-shadow:inset 0 2px 8px #0009}.hud-label{font-family:var(--font-mono);color:var(--text-dim);letter-spacing:.15em;font-size:8px}.hud-value{font-family:var(--font-display);color:var(--neon-purple);white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:700;overflow:hidden}.preset-list-container{flex-direction:column;flex-grow:1;gap:6px;max-height:155px;padding-right:4px;display:flex;overflow-y:auto}.preset-list-container::-webkit-scrollbar{width:4px}.preset-list-container::-webkit-scrollbar-thumb{background:var(--neon-purple-dim);border:none;border-radius:2px}.preset-section-header{font-family:var(--font-mono);text-transform:uppercase;color:var(--text-dim);letter-spacing:.1em;border-bottom:1px solid #ffffff08;margin-top:4px;padding-bottom:2px;font-size:8px}.preset-list{flex-direction:column;gap:4px;display:flex}.preset-item-btn,.preset-item-custom-wrapper{border:1px solid var(--border-subtle);cursor:pointer;text-align:left;width:100%;transition:background-color .2s var(--spring-snappy), border-color .2s var(--spring-snappy), transform .2s var(--spring-snappy), box-shadow .2s var(--spring-snappy);background:#2b283340;border-radius:6px;align-items:center;padding:8px 10px;display:flex;position:relative}.preset-item-btn:hover,.preset-item-custom-wrapper:hover{border-color:var(--border-medium);background:#3a364566;transform:translate(2px)}.preset-item-btn.active,.preset-item-custom-wrapper.active{border-color:var(--neon-purple);box-shadow:0 0 10px var(--neon-purple-glow);background:#b54cff14}.preset-dot{background:var(--text-dim);width:6px;height:6px;transition:background-color .2s var(--spring-snappy), box-shadow .2s var(--spring-snappy);border-radius:50%;margin-right:8px}.preset-item-btn.active .preset-dot,.preset-item-custom-wrapper.active .preset-dot{background:var(--neon-purple);box-shadow:0 0 8px var(--neon-purple)}.preset-name{font-family:var(--font-display);color:var(--text-secondary);transition:color .2s var(--spring-snappy);font-size:11px;font-weight:600}.preset-item-btn.active .preset-name,.preset-item-custom-wrapper.active .preset-name{color:var(--text-bright)}.preset-item-custom-wrapper{padding-right:32px}.preset-delete-btn{width:18px;height:18px;color:var(--text-dim);cursor:pointer;transition:color .2s var(--spring-snappy), background-color .2s var(--spring-snappy);background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:14px;display:flex;position:absolute;top:50%;right:6px;transform:translateY(-50%)}.preset-delete-btn:hover{color:var(--neon-pink);background:#ff339926}.preset-save-form{flex-direction:column;gap:8px;margin-top:auto;display:flex}.preset-input{border:1px solid var(--border-subtle);width:100%;color:var(--text-bright);font-family:var(--font-sans);transition:border-color .2s var(--spring-snappy), box-shadow .2s var(--spring-snappy);background:#07060973;border-radius:8px;outline:none;padding:8px 12px;font-size:11px}.preset-input:focus{border-color:var(--neon-purple);box-shadow:0 0 10px var(--neon-purple-glow)}.preset-save-submit-btn{background:linear-gradient(135deg, var(--neon-purple) 0%, #b54cffb3 100%);width:100%;color:var(--text-bright);font-family:var(--font-display);letter-spacing:.05em;cursor:pointer;box-shadow:0 4px 12px var(--neon-purple-glow);transition:transform .25s var(--spring-responsive), box-shadow .25s var(--spring-responsive);border:none;border-radius:8px;padding:8px 12px;font-size:10px;font-weight:800}.preset-save-submit-btn:hover{box-shadow:0 6px 16px var(--neon-purple-dim);transform:translateY(-1px)}.preset-save-submit-btn:active{transform:translateY(0)}.preset-error-msg{font-family:var(--font-mono);color:var(--neon-pink);text-align:center;margin-top:2px;font-size:8px}.keyboard-rack-layout{grid-template-columns:260px 1fr;gap:20px;margin-top:10px;display:grid}@media (width<=768px){.keyboard-rack-layout{grid-template-columns:1fr}}.midi-panel{border:1px solid var(--border-subtle);background:#0c0b0f66;border-radius:12px;flex-direction:column;gap:12px;padding:16px;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 2px 8px #0006}.midi-panel:before{content:"";background:linear-gradient(135deg, #ffffff1a 0%, #ffffff03 50%, var(--neon-teal-dim) 100%);-webkit-mask-composite:xor;pointer-events:none;border-radius:12px;padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.midi-title-row{border-bottom:1px solid #ffffff0d;justify-content:space-between;align-items:center;padding-bottom:8px;display:flex}.midi-title{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.15em;color:var(--neon-teal);text-shadow:0 0 8px var(--neon-teal-glow);font-size:10px}.midi-status-led{width:8px;height:8px;transition:background-color .3s var(--spring-fluid), box-shadow .3s var(--spring-fluid);border-radius:50%}.midi-status-led.connected{background-color:var(--neon-teal);box-shadow:0 0 10px var(--neon-teal);animation:pulse-glow 1.5s var(--spring-fluid) infinite alternate}.midi-status-led.supported{background-color:var(--neon-purple);box-shadow:0 0 8px var(--neon-purple)}.midi-status-led.disabled,.midi-status-led.error{background-color:var(--neon-pink);box-shadow:0 0 8px var(--neon-pink)}.midi-device-list{flex-direction:column;flex-grow:1;gap:8px;max-height:100px;padding-right:4px;display:flex;overflow-y:auto}.midi-device-item{border:1px solid var(--border-subtle);font-family:var(--font-mono);color:var(--text-primary);transition:border-color .2s var(--spring-snappy), background-color .2s var(--spring-snappy), transform .2s var(--spring-snappy);background:#2b28334d;border-radius:6px;align-items:center;gap:8px;padding:8px;font-size:9px;display:flex}.midi-device-item:hover{border-color:var(--neon-teal-dim);background:#2b283380;transform:translate(2px)}.midi-device-indicator{background-color:var(--neon-teal);width:6px;height:6px;box-shadow:0 0 6px var(--neon-teal);border-radius:50%}.midi-empty{font-family:var(--font-sans);color:var(--text-dim);text-align:center;margin:auto 0;font-size:10px;font-style:italic}.midi-connection-desc{font-family:var(--font-sans);color:var(--text-secondary);border-left:2px solid var(--neon-teal);background:#00000026;border-radius:4px;padding:6px 8px;font-size:9px;line-height:1.4}.midi-wheels-container{border:1px solid var(--border-subtle);background:#0c0b0f73;border-radius:12px;align-items:center;gap:16px;height:100%;min-height:180px;padding:12px 14px;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 4px 12px #00000080,0 10px 30px #0000004d}.midi-wheels-container:before{content:"";-webkit-mask-composite:xor;pointer-events:none;background:linear-gradient(135deg,#ffffff14 0%,#ffffff03 50%,#26d9d926 100%);border-radius:12px;padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.midi-wheel-wrapper{flex-direction:column;align-items:center;gap:10px;width:48px;display:flex}.midi-wheel-label{font-family:var(--font-mono);letter-spacing:.1em;color:var(--text-dim);text-transform:uppercase;text-align:center;white-space:nowrap;font-size:8px;font-weight:700}.midi-wheel-track{cursor:ns-resize;background:linear-gradient(#070609 0%,#110f15 100%);border:1px dashed #6040bf26;border-radius:4px;justify-content:center;align-items:center;width:24px;height:120px;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 2px 8px #000c}.midi-wheel-handle{width:20px;height:38px;transition:transform 50ms var(--spring-snappy), box-shadow .2s var(--spring-snappy);z-index:2;background:linear-gradient(90deg,#292929 0%,#424242 50%,#1f1f1f 100%);border:1px solid #ffffff1a;border-radius:3px;flex-direction:column;justify-content:space-between;padding:4px 0;display:flex;position:absolute;box-shadow:0 4px 10px #0009,inset 0 1px 1px #ffffff26}.midi-wheel-handle:before{content:"";background:#ffffff26;width:100%;height:2px;box-shadow:0 6px #ffffff26,0 12px #ffffff26,0 18px #ffffff26,0 24px #ffffff26}.pitch-bend-glow{border-color:#20dfdf4d;box-shadow:0 0 12px #20dfdf40,0 4px 10px #0009}.mod-wheel-glow{border-color:#8020df4d;box-shadow:0 0 12px #8020df40,0 4px 10px #0009}.midi-wheel-center-line{height:1px;box-shadow:0 0 4px var(--neon-teal);pointer-events:none;z-index:1;background:#20dfdf66;position:absolute;top:50%;left:0;right:0}.midi-wheel-grooves{pointer-events:none;opacity:.15;z-index:1;flex-direction:column;justify-content:space-around;display:flex;position:absolute;inset:0}.midi-wheel-grooves .groove{background:var(--text-bright);height:1px}.keyboard-rack-interactive-zone{flex-grow:1;gap:20px;display:flex}@media (width<=640px){.keyboard-rack-interactive-zone{flex-direction:column}.midi-wheels-container{flex-direction:row;justify-content:center;height:auto;min-height:auto}.midi-wheel-wrapper{flex-direction:row;gap:12px;width:auto}}.glass-container-emerald:before{background:linear-gradient(135deg, #ffffff40 0%, #ffffff05 50%, var(--neon-emerald-dim) 100%)}.bloom-emerald{box-shadow:0 0 35px -5px #1aff791f,inset 0 0 12px -2px #1aff791f}.glow-text-emerald{text-shadow:0 0 12px var(--neon-emerald-dim)}.recorder-module{height:100%}.recorder-content{flex-direction:column;flex-grow:1;justify-content:space-around;gap:20px;display:flex}.tape-deck-display{border:1px solid var(--border-subtle);background:#070609a6;border-radius:12px;justify-content:space-between;align-items:center;gap:20px;min-height:110px;padding:16px 24px;display:flex;box-shadow:inset 0 3px 12px #000c}.tape-deck-reels{background:#131117;border:1px solid #ffffff08;border-radius:8px;align-items:center;gap:12px;padding:8px 16px;display:flex;box-shadow:inset 0 1px 4px #00000080}.tape-reel{background:radial-gradient(circle,#2b2833 0% 30%,#544f64 31%,#35313f 35%,#1d1b22 95%,#605a72 100%);border:1.5px solid #0d0d0d;border-radius:50%;justify-content:center;align-items:center;width:54px;height:54px;display:flex;position:relative;box-shadow:0 2px 5px #00000080,inset 0 1px 2px #ffffff1a}.tape-reel.spinning{animation:3s linear infinite spin}.reel-center{background:#131117;border:1px solid #0d0d0d;border-radius:50%;width:22px;height:22px;position:relative}.spoke{transform-origin:50% 0;background:#595959;width:2px;height:8px;position:absolute;top:50%;left:50%}.spoke-1{transform:translate(-50%,-50%)rotate(0)translateY(-4px)}.spoke-2{transform:translate(-50%,-50%)rotate(120deg)translateY(-4px)}.spoke-3{transform:translate(-50%,-50%)rotate(240deg)translateY(-4px)}.tape-window{background:#00000080;border:1px solid #ffffff0d;border-radius:4px;width:40px;height:18px;position:relative;overflow:hidden}.tape-bridge{background:#666;height:2px;position:absolute;top:50%;left:10%;right:10%;transform:translateY(-50%);box-shadow:0 0 3px #000c}.recorder-timer-hud{text-align:right;flex-direction:column;flex-grow:1;align-items:flex-end;display:flex}.hud-label{font-family:var(--font-mono);letter-spacing:.1em;color:var(--text-dim);font-size:9px}.time-digits{font-family:var(--font-display);letter-spacing:.05em;transition:text-shadow .3s var(--spring-fluid);margin:4px 0;font-size:26px;font-weight:700;line-height:1.2}.hud-status{font-family:var(--font-mono);color:var(--text-secondary);align-items:center;gap:6px;font-size:9px;display:flex}.status-indicator{background:#3d3946;border-radius:50%;width:6px;height:6px}.status-indicator.active{background:var(--neon-pink);box-shadow:0 0 8px var(--neon-pink);animation:pulse-glow .8s var(--spring-fluid) infinite alternate}.recorder-controls{justify-content:center;align-items:center;gap:16px;width:100%;display:flex}.recorder-btn-tap{border:1px solid var(--border-subtle);color:var(--text-secondary);font-family:var(--font-display);text-transform:uppercase;letter-spacing:.05em;cursor:pointer;min-width:110px;transition:background-color .2s var(--spring-snappy), color .2s var(--spring-snappy), box-shadow .2s var(--spring-snappy);background:#0c0b0f99;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-size:11px;font-weight:700;display:flex}.recorder-btn-tap:hover:not(:disabled){background:var(--bg-panel-solid);color:var(--text-bright);box-shadow:inset 0 1px #ffffff1a,0 4px 12px #0006}.recorder-btn-tap:active:not(:disabled){transform:translateY(1px)}.recorder-btn-tap:disabled{opacity:.3;cursor:not-allowed}.record-btn .btn-icon-red-dot{width:8px;height:8px;transition:background-color .3s var(--spring-fluid), box-shadow .3s var(--spring-fluid);background:#b81414;border-radius:50%}.record-btn:hover:not(:disabled) .btn-icon-red-dot{background:var(--neon-pink);box-shadow:0 0 8px var(--neon-pink)}.record-btn.recording{border-color:var(--neon-pink);color:var(--neon-pink);box-shadow:0 0 15px var(--neon-pink-glow);background:#ff33991a}.record-btn.recording .btn-icon-red-dot{background:var(--neon-pink);box-shadow:0 0 10px var(--neon-pink);animation:pulse-glow .8s var(--spring-fluid) infinite alternate}.stop-btn .btn-icon-square{background:var(--text-secondary);border-radius:1px;width:8px;height:8px}.stop-btn:hover:not(:disabled) .btn-icon-square{background:var(--text-bright);box-shadow:0 0 6px #fff9}.download-btn{border-color:var(--border-subtle)}.download-btn:not(:disabled){border-color:var(--neon-teal);color:var(--neon-teal);background:#00ffea0d}.download-btn:hover:not(:disabled){box-shadow:0 0 12px var(--neon-teal-glow);background:#00ffea26}.download-btn .btn-icon-arrow-down{font-size:13px;line-height:1}.tape-reel.spinning{will-change:transform;transform:translate(0,0)}.knob-dial{will-change:transform;transform:translateZ(0)}.fader-handle,.synth-range-input{will-change:transform;transform:translate(0,0)}.keyboard-midi-device-details{flex-direction:column;gap:2px;display:flex}.keyboard-midi-device-name{color:var(--text-bright);font-weight:600}.keyboard-midi-device-manufacturer{color:var(--text-dim);font-size:8px}.keyboard-interactive-container{flex-grow:1;position:relative}.lfo-module-span{grid-column:span 2}.lfo-header-margin{margin-bottom:14px}.flex-wrap-row{flex-wrap:wrap}.selector-group-width{max-width:280px}.arpeggiator-module{grid-column:span 3}.arpeggiator-sequencer-controls{gap:15px!important}.arpeggiator-btn-group{min-width:320px}.arpeggiator-bpm-container{flex-grow:1}.arpeggiator-bpm-label{margin-bottom:4px}.arpeggiator-workspace{grid-template-columns:1.2fr 1fr;align-items:center;gap:30px;margin-top:15px;display:grid}.arpeggiator-canvas-box{border:1px solid var(--border-subtle);background:#070609b3;border-radius:16px;justify-content:center;align-items:center;height:310px;padding:15px;display:flex;position:relative;box-shadow:inset 0 4px 20px #000c}.arpeggiator-canvas-box canvas{width:100%;height:100%;display:block}.arpeggiator-activation-overlay{border-radius:15px}.arpeggiator-activation-subtext{color:var(--text-dim);font-size:10px;font-family:var(--font-mono);margin-top:6px}.arpeggiator-sidebar-box{border:1px solid var(--border-subtle);background:#13111759;border-radius:16px;flex-direction:column;justify-content:space-around;gap:20px;height:310px;padding:20px 24px;display:flex}.arpeggiator-value-display{font-family:var(--font-mono)}.arpeggiator-custom-builder{border-top:1px solid var(--border-subtle);animation:fadeIn .35s var(--spring-fluid);margin-top:25px;padding-top:20px}.arpeggiator-builder-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:15px;margin-bottom:15px;display:flex}.arpeggiator-builder-title{color:var(--text-primary);letter-spacing:.05em;margin:0;font-size:12px;font-weight:600}.arpeggiator-builder-subtitle{color:var(--text-dim);margin:4px 0 0;font-size:10px}.arpeggiator-builder-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.arpeggiator-scale-grid{grid-template-columns:1.5fr 3fr;align-items:start;gap:20px;display:grid}.arpeggiator-scale-left-controls{border:1px solid var(--border-subtle);background:#07060966;border-radius:12px;flex-direction:column;gap:15px;padding:15px;display:flex}.arpeggiator-scale-label{color:var(--text-dim);letter-spacing:.05em;margin-bottom:4px;font-size:9px;display:block}.arpeggiator-scale-input{border:1px solid var(--border-subtle);color:#fff;width:100%;font-size:11px;font-family:var(--font-sans);background:#09090ccc;border-radius:6px;padding:6px 10px}.arpeggiator-base-freq-row{align-items:center;gap:10px;display:flex}.arpeggiator-base-freq-text{font-size:11px;font-family:var(--font-mono);text-align:right;min-width:60px;color:var(--neon-pink)}.arpeggiator-presets-label{color:var(--text-dim);letter-spacing:.05em;margin-bottom:6px;font-size:9px;display:block}.arpeggiator-presets-row{flex-wrap:wrap;gap:6px;display:flex}.arpeggiator-preset-btn{border:1px solid var(--border-subtle);color:var(--text-primary);cursor:pointer;transition:border-color .15s var(--spring-snappy), background-color .15s var(--spring-snappy), color .15s var(--spring-snappy);background:#24222a66;border-radius:4px;padding:3px 6px;font-size:9px}.arpeggiator-cents-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;max-height:170px;padding-right:6px;display:grid;overflow-y:auto}.arpeggiator-cents-card{border:1px solid var(--border-subtle);background:#0e0d1280;border-radius:8px;flex-direction:column;gap:4px;padding:8px;display:flex;position:relative}.arpeggiator-cents-card-header{justify-content:space-between;align-items:center;display:flex}.arpeggiator-cents-note-label{color:var(--text-dim);font-size:9px;font-family:var(--font-mono)}.arpeggiator-cents-delete-btn{color:var(--neon-pink);cursor:pointer;background:0 0;border:none;padding:0;font-size:9px}.arpeggiator-cents-values{justify-content:space-between;align-items:baseline;display:flex}.arpeggiator-cents-value-text{font-size:11px;font-family:var(--font-mono);color:var(--text-primary);font-weight:600}.arpeggiator-cents-hz-text{font-size:9px;font-family:var(--font-mono);color:var(--text-dim)}.seq-play-btn-orbit{min-width:150px;transition:background-color .2s var(--spring-snappy), box-shadow .2s var(--spring-snappy), color .2s var(--spring-snappy);background:#13111799}.seq-play-btn-orbit.playing{background:linear-gradient(135deg, var(--neon-purple) 0%, var(--neon-pink) 100%)!important;box-shadow:0 0 15px var(--neon-purple-dim)!important;color:#fff!important}.arpeggiator-scale-select{border:1px solid var(--border-subtle);font-family:var(--font-mono);height:38px;color:var(--text-primary);background:#09090ccc;border-radius:8px;padding:6px 12px;font-size:11px}.arpeggiator-scale-option{background:var(--bg-obsidian);color:#fff}.glass-container-pink:before{background:linear-gradient(135deg, #ffffff40 0%, #ffffff05 50%, var(--neon-pink-dim) 100%)}.bloom-pink{box-shadow:0 0 35px -5px #ff4ca61f,inset 0 0 12px -2px #ff4ca61f}.cyber-mod-matrix-module{animation:fadeIn .4s var(--spring-fluid);grid-column:span 3;margin-top:15px}.mod-matrix-header{border-bottom:1px solid var(--border-subtle);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px;padding-bottom:15px;display:flex}.mod-matrix-header .header-left{flex-direction:column;gap:4px;display:flex}.mod-matrix-header .module-title{letter-spacing:.05em;color:var(--text-bright);font-size:15px;font-weight:700}.mod-matrix-header .subtitle{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;font-size:9px}.mod-matrix-header .header-actions{gap:10px;display:flex}.neon-action-btn{border:1px solid var(--border-subtle);font-family:var(--font-display);letter-spacing:.05em;text-transform:uppercase;color:var(--text-secondary);cursor:pointer;transition:background-color .2s var(--spring-snappy), color .2s var(--spring-snappy), box-shadow .2s var(--spring-snappy), border-color .2s var(--spring-snappy);background:#0c0b0f99;border-radius:6px;padding:8px 16px;font-size:10px;font-weight:700}.neon-action-btn:hover{background:var(--bg-panel-solid);color:var(--text-bright);box-shadow:0 4px 12px #0006}.neon-action-btn.chaos-btn{border-color:var(--neon-purple);color:var(--neon-purple);background:#9933ff0d}.neon-action-btn.chaos-btn:hover{box-shadow:0 0 15px var(--neon-purple-glow);background:#9933ff26}.neon-action-btn.clear-btn{border-color:var(--neon-pink);color:var(--neon-pink);background:#ff33990d}.neon-action-btn.clear-btn:hover{box-shadow:0 0 15px var(--neon-pink-glow);background:#ff339926}.cyber-mod-row{grid-template-columns:1.2fr 1.8fr;gap:25px;display:grid}@media (width<=1024px){.cyber-mod-row{grid-template-columns:1fr}}.modulator-panel,.patch-connections-panel{border:1px solid var(--border-subtle);background:#13111759;border-radius:16px;flex-direction:column;gap:15px;padding:20px;display:flex}.panel-sub-header{border-bottom:1px dashed #ffffff0d;justify-content:space-between;align-items:center;margin-bottom:5px;padding-bottom:10px;display:flex}.panel-sub-header .sub-title{font-family:var(--font-mono);letter-spacing:.1em;color:var(--text-dim);font-size:10px;font-weight:700}.engine-controls{flex-direction:column;gap:20px;display:flex}.engine-section{background:#07060966;border:1px solid #ffffff05;border-radius:12px;flex-direction:column;gap:10px;padding:15px;display:flex}.engine-section .section-label{font-family:var(--font-mono);letter-spacing:.1em;color:var(--text-dim);text-transform:uppercase;font-size:8px;font-weight:700}.lfo-selectors{margin-bottom:5px}.selector-btn.mini-btn{border-radius:4px;padding:4px 10px;font-size:8px}.knob-grid{grid-template-columns:repeat(2,1fr);justify-items:center;gap:15px;display:grid}.connections-scroll-container{flex-direction:column;gap:12px;max-height:380px;padding-right:6px;display:flex;overflow-y:auto}.empty-connections-state{text-align:center;background:#07060933;border:1px dashed #6040bf26;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;height:240px;display:flex}.empty-connections-state .empty-icon{filter:drop-shadow(0 0 10px #8020df4d);animation:float 3s var(--spring-fluid) infinite alternate;margin-bottom:12px;font-size:32px}.empty-connections-state .empty-text{color:var(--text-secondary);margin-bottom:4px;font-size:12px;font-weight:600}.empty-connections-state .empty-subtext{color:var(--text-dim);max-width:200px;font-size:10px;line-height:1.4}.add-connection-btn{border:1px solid var(--neon-teal);color:var(--neon-teal);font-family:var(--font-display);text-transform:uppercase;letter-spacing:.05em;cursor:pointer;transition:background-color .2s var(--spring-snappy), box-shadow .2s var(--spring-snappy);background:#00ffea0d;border-radius:6px;padding:5px 12px;font-size:9px;font-weight:700}.add-connection-btn:hover{box-shadow:0 0 10px var(--neon-teal-glow);background:#00ffea26}.patch-route-card{border:1px solid var(--border-subtle);transition:border-color .2s var(--spring-snappy), box-shadow .2s var(--spring-snappy);background:#070609a6;border-radius:12px;grid-template-columns:1fr auto 1.2fr 1fr auto;align-items:center;gap:15px;padding:12px 16px;display:grid;position:relative;box-shadow:inset 0 1px #ffffff0d,0 4px 10px #0006}.patch-route-card:hover{border-color:#8040bf4d;box-shadow:inset 0 1px #ffffff0d,0 0 12px #8020df14}.card-dropdown-group{flex-direction:column;gap:4px;display:flex}.dropdown-label{font-family:var(--font-mono);letter-spacing:.1em;font-size:7px;font-weight:700}.neon-select{border:1px solid var(--border-subtle);color:var(--text-primary);cursor:pointer;transition:border-color .2s var(--spring-snappy), box-shadow .2s var(--spring-snappy);background:#0c0b0fd9;border-radius:6px;outline:none;padding:6px 10px;font-size:10px}.neon-select:focus{border-color:var(--neon-purple);box-shadow:0 0 8px var(--neon-purple-dim)}.connector-arrow{color:var(--text-dim);text-shadow:0 0 4px #ffffff1a;justify-content:center;font-size:14px;display:flex}.card-depth-control{flex-direction:column;gap:4px;display:flex}.depth-header{justify-content:space-between;align-items:center;display:flex}.depth-label{font-family:var(--font-mono);letter-spacing:.1em;color:var(--text-dim);font-size:7px;font-weight:700}.depth-val{font-family:var(--font-mono);font-size:9px;font-weight:700}.depth-val.positive{color:var(--neon-teal)}.depth-val.negative{color:var(--neon-pink)}.cyber-range-input{-webkit-appearance:none;border:1px solid var(--border-subtle);background:#0c0b0fe6;border-radius:2px;outline:none;width:100%;height:4px}.cyber-range-input::-webkit-slider-thumb{appearance:none;background:var(--text-bright);border:1px solid var(--border-subtle);cursor:pointer;width:10px;height:10px;transition:transform .1s var(--spring-snappy);border-radius:50%;box-shadow:0 0 5px #fffc}.cyber-range-input::-webkit-slider-thumb:hover{transform:scale(1.2)}.remove-patch-btn{color:var(--text-dim);cursor:pointer;transition:color .2s var(--spring-snappy), background-color .2s var(--spring-snappy);background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;font-size:11px;display:flex}.remove-patch-btn:hover{color:var(--neon-pink);background:#ff00501a}@media (width<=768px){.patch-route-card{grid-template-columns:1fr;gap:10px}.connector-arrow{margin:2px 0;transform:rotate(90deg)}.remove-patch-btn{position:absolute;top:8px;right:8px}}.console-wrapper.purple-aether{--module-accent-purple:#b54cff;--module-accent-purple-dim:#b54cff40;--module-accent-purple-glow:#b54cff1f;--module-accent-pink:#f39;--module-accent-pink-dim:#ff339940;--module-accent-pink-glow:#ff33991f;--module-accent-emerald:#1aff79;--module-accent-emerald-dim:#1aff7940;--module-accent-emerald-glow:#1aff791f;--module-accent-teal:#00ffea;--module-accent-teal-dim:#00ffea40;--module-accent-teal-glow:#00ffea1f}.console-wrapper.volcano-pink{--neon-purple:#f39;--neon-purple-dim:#ff339940;--neon-purple-glow:#ff33991f;--neon-teal:#00ffea;--neon-teal-dim:#00ffea40;--neon-teal-glow:#00ffea1f;--module-accent-purple:#f39;--module-accent-purple-dim:#ff339940;--module-accent-purple-glow:#ff33991f;--module-accent-pink:#f35;--module-accent-pink-dim:#ff335540;--module-accent-pink-glow:#ff33551f;--module-accent-emerald:#f73;--module-accent-emerald-dim:#ff773340;--module-accent-emerald-glow:#ff77331f;--module-accent-teal:#ffc61a;--module-accent-teal-dim:#ffc61a40;--module-accent-teal-glow:#ffc61a1f}.console-wrapper.emerald-green{--neon-purple:#1aff79;--neon-purple-dim:#1aff7940;--neon-purple-glow:#1aff791f;--neon-teal:#b54cff;--neon-teal-dim:#b54cff40;--neon-teal-glow:#b54cff1f;--module-accent-purple:#1aff79;--module-accent-purple-dim:#1aff7940;--module-accent-purple-glow:#1aff791f;--module-accent-pink:#00ffbf;--module-accent-pink-dim:#00ffbf40;--module-accent-pink-glow:#00ffbf1f;--module-accent-emerald:#00e600;--module-accent-emerald-dim:#00e60040;--module-accent-emerald-glow:#00e6001f;--module-accent-teal:#00d4ff;--module-accent-teal-dim:#00d4ff40;--module-accent-teal-glow:#00d4ff1f}.console-wrapper.amber-sunburst{--neon-purple:#ff9f1a;--neon-purple-dim:#ff9f1a40;--neon-purple-glow:#ff9f1a1f;--neon-teal:#f39;--neon-teal-dim:#ff339940;--neon-teal-glow:#ff33991f;--module-accent-purple:#ff9f1a;--module-accent-purple-dim:#ff9f1a40;--module-accent-purple-glow:#ff9f1a1f;--module-accent-pink:#f73;--module-accent-pink-dim:#ff773340;--module-accent-pink-glow:#ff77331f;--module-accent-emerald:#ffd500;--module-accent-emerald-dim:#ffd50040;--module-accent-emerald-glow:#ffd5001f;--module-accent-teal:#f37;--module-accent-teal-dim:#ff337740;--module-accent-teal-glow:#ff33771f}.console-skin-selector{-webkit-backdrop-filter:blur(8px);border:1px solid var(--border-subtle);transition:border-color .3s var(--spring-fluid), box-shadow .3s var(--spring-fluid);background:#13111773;border-radius:20px;align-items:center;gap:12px;padding:6px 12px;display:flex}.skin-label{font-family:var(--font-mono);color:var(--text-secondary);letter-spacing:.05em;font-size:10px;font-weight:700}.skin-options{align-items:center;gap:8px;display:flex}.skin-btn{cursor:pointer;width:14px;height:14px;transition:transform .2s var(--spring-snappy), border-color .2s var(--spring-snappy);background-color:#0000;border:1.5px solid #ffffff26;border-radius:50%;padding:0;position:relative}.skin-btn:after{content:"";transition:background-color .2s var(--spring-snappy);border-radius:50%;position:absolute;inset:2px}.skin-purple:after{background-color:#b54cff}.skin-pink:after{background-color:#f39}.skin-green:after{background-color:#1aff79}.skin-amber:after{background-color:#ff9f1a}.skin-btn:hover{border-color:#fff6;transform:scale(1.2)}.skin-btn.active{border-color:var(--text-bright);transform:scale(1.1);box-shadow:0 0 8px}.skin-purple.active{color:#b54cff}.skin-pink.active{color:#f39}.skin-green.active{color:#1aff79}.skin-amber.active{color:#ff9f1a}.dsp-subgrid{width:100%;transition:opacity .25s var(--spring-fluid);grid-template-columns:repeat(4,1fr);gap:16px;display:grid}@media (width<=1200px){.dsp-subgrid{grid-template-columns:repeat(3,1fr)!important}}@media (width<=900px){.dsp-subgrid{grid-template-columns:repeat(2,1fr)!important}}@media (width<=600px){.dsp-subgrid{grid-template-columns:1fr!important}}@media (width<=1200px){.console-grid{grid-template-columns:repeat(2,1fr)!important;gap:18px!important}.visualizer-card,.keyboard-card,.arpeggiator-module,.cyber-mod-matrix-module,.lfo-module-span{grid-column:span 2!important}}@media (width<=768px){.console-wrapper{padding:10px 5px!important}.synth-rack{box-shadow:none!important;border-radius:0!important;grid-template-columns:1fr!important}.rack-ear{display:none!important}.console-main{gap:16px!important;padding:16px 12px!important}.console-header{flex-direction:column!important;align-items:flex-start!important;gap:12px!important;padding-bottom:12px!important}.console-indicators{flex-wrap:wrap!important;justify-content:space-between!important;gap:10px!important;width:100%!important}.console-grid{grid-template-columns:1fr!important;gap:16px!important}.visualizer-card,.keyboard-card,.arpeggiator-module,.cyber-mod-matrix-module,.lfo-module-span{grid-column:span 1!important}.keyboard-container{height:140px!important;padding:4px!important}.key-white{min-width:32px!important;padding-bottom:8px!important}.key-white.active{padding-bottom:6px!important}.key-black{width:20px!important;height:80px!important;padding-bottom:6px!important}.key-black.active{height:78px!important}.visualizer-content,.arpeggiator-workspace{grid-template-columns:1fr!important;gap:15px!important}.arpeggiator-canvas-box{height:240px!important}.arpeggiator-sidebar-box{padding:15px!important}.arpeggiator-btn-group{flex-wrap:wrap!important;gap:8px!important;width:100%!important;min-width:auto!important}.track-header-spacer,.track-info{width:130px!important;padding-right:8px!important}.track-note-select{padding:3px 6px!important;font-size:9.5px!important}}@media (width<=600px){.knob-wrapper{width:58px!important;height:58px!important}.knob-dial{width:38px!important;height:38px!important}.knob-pointer{height:10px!important;top:4px!important}.knob-label{font-size:9.5px!important}.knob-value{font-size:8.5px!important}.fader-wrapper{height:150px!important}.fader-track{height:90px!important}.fader-handle{width:20px!important;height:12px!important}.fader-label{font-size:9px!important}.fader-value{font-size:8px!important}}@media (width<=480px){.brand-title{font-size:20px!important}.synth-module{padding:14px!important}.controls-row{flex-wrap:wrap!important;gap:6px!important}.knob-wrapper{width:50px!important;height:50px!important}.knob-dial{width:32px!important;height:32px!important}.knob-pointer{width:2px!important;height:8px!important;top:3px!important}.knob-label{font-size:8.5px!important}.knob-value{font-size:8px!important}.fader-wrapper{height:130px!important}.fader-track{height:75px!important}.fader-handle{width:18px!important;height:10px!important}.fader-label{font-size:8px!important}.fader-value{font-size:7.5px!important}.faders-container{gap:6px!important}}