.tuning-panel{padding:16px 18px;flex:1.2;min-width:260px}.tuning-header{display:flex;align-items:center;gap:14px;margin-bottom:14px;flex-wrap:wrap}.tuning-header .tuning-field{display:flex;align-items:center;gap:6px}.tuning-header input[type=text]{width:60px;font-size:12px}.tuning-header select{font-size:12px}.tuning-field.raga-field select{min-width:140px}.tuning-section-label{font-family:Rajdhani,sans-serif;font-weight:600;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--amber);margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid var(--amber-dim)}.swara-grid{display:flex;flex-wrap:wrap;gap:6px}.swara-cell{display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 8px;background:#00000040;border-radius:3px;border:1px solid var(--amber-dim);min-width:48px}.swara-name{font-family:Rajdhani,sans-serif;font-weight:700;font-size:13px;color:var(--amber);letter-spacing:1px}.swara-ratio{font-family:Courier Prime,monospace;font-size:10px;color:var(--cream-dim)}.synth-params{display:flex;gap:0;flex:3}.synth-params .panel{padding:16px 18px;border-right:1px solid #333;flex:1;min-width:0}.synth-params .panel:last-child{border-right:none}.synth-params .panel-volume{flex:.8}.synth-params .panel-envelope{flex:1.4}.synth-params .panel-stack{display:flex;flex-direction:column;flex:1;border-right:1px solid #333}.synth-params .panel-stacked{padding:12px 18px;border-right:none;flex:none}.synth-params .panel-stacked+.panel-stacked{border-top:1px solid #333}.synth-params .panel-eq{flex:.8}.param-section-label{font-family:Rajdhani,sans-serif;font-weight:600;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--amber);margin-bottom:14px;padding-bottom:6px;border-bottom:1px solid var(--amber-dim)}.param-row{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap;margin-bottom:12px}.param-control{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:60px}.param-control label{font-family:Rajdhani,sans-serif;font-weight:500;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--text-label);text-align:center;white-space:nowrap;margin:0;cursor:default}.param-control .param-value{font-family:Courier Prime,monospace;font-size:10px;color:var(--amber);min-height:14px;text-align:center}.param-control input[type=range]{width:70px}.param-control select{font-size:11px;padding:2px 6px;width:80px}.param-sub-label{font-family:Rajdhani,sans-serif;font-weight:500;font-size:9px;letter-spacing:2px;text-transform:uppercase;color:var(--text-dim);margin-top:10px;margin-bottom:6px}.param-section-label .panel-toggle{float:right;width:18px;height:18px;padding:0;border-radius:50%;font-size:0;border:2px solid #333;background:radial-gradient(circle at 40% 35%,#444,#1a1a1a 70%);box-shadow:0 1px 3px #0009,inset 0 1px #ffffff14;position:relative;top:-1px;cursor:pointer;transition:box-shadow .15s}.param-section-label .panel-toggle.active{border-color:var(--amber-dim);background:radial-gradient(circle at 40% 35%,var(--amber),#5a3010 70%);box-shadow:0 0 6px #d4882b80,0 1px 3px #0009,inset 0 1px #ffffff26}.panel-disabled .param-row{opacity:.3;pointer-events:none}.keyboard-input{padding:16px 24px 12px;background:linear-gradient(180deg,#141414,#0e0e0e);display:flex;flex-direction:column;align-items:center}.keyboard-visual{position:relative;height:140px;width:548px;perspective:800px;touch-action:none;user-select:none;-webkit-user-select:none}.white-keys{display:flex;position:absolute;bottom:0;left:0}.white-key{width:38px;height:140px;background:linear-gradient(180deg,#faf6ee,#f0ead8 8%,#ede6d2 50%,#e4dcc8 85%,#d8ceb8);border:none;border-left:1px solid #c4b898;border-right:1px solid #b8aa8c;border-bottom:1px solid #a89878;border-radius:0 0 4px 4px;margin-right:1px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:8px;cursor:pointer;transform-origin:top center;transition:transform .08s ease-out,box-shadow .08s ease-out,background .06s ease-out;box-shadow:0 4px #b8a888,0 5px #a09070,0 6px 8px #00000059,inset 0 1px #ffffffb3,inset 2px 0 3px #00000005,inset -2px 0 3px #00000005}.white-key.active{background:linear-gradient(180deg,#f0ead8,#e6dec8 8%,#ddd5bd 50%,#d4cbb2 85%,#ccc0a8);transform:rotateX(1.5deg);box-shadow:0 2px #b8a888,0 3px #a09070,0 3px 5px #0000004d,inset 0 1px #fff6,inset 2px 0 3px #00000008,inset -2px 0 3px #00000008}.black-keys{position:absolute;top:0;left:0;height:80px;pointer-events:none}.black-key{position:absolute;width:24px;height:76px;background:linear-gradient(180deg,#303030,#1c1c1c 30%,#141414 70%,#0c0c0c);border:none;border-radius:0 0 3px 3px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:5px;cursor:pointer;pointer-events:auto;z-index:1;transform-origin:top center;transition:transform .06s ease-out,box-shadow .06s ease-out,background .05s ease-out;box-shadow:-1px 0 #1a1a1a,1px 0 #1a1a1a,0 4px #080808,0 5px #050505,0 6px 10px #0009,inset 0 1px #ffffff14,inset 0 -8px 12px #0000004d}.black-key.active{background:linear-gradient(180deg,#282828,#161616 30%,#0e0e0e 70%,#080808);transform:rotateX(1.2deg);box-shadow:-1px 0 #1a1a1a,1px 0 #1a1a1a,0 2px #080808,0 3px 5px #00000080,inset 0 1px #ffffff0a,inset 0 -6px 10px #0006}.key-label{font-family:Rajdhani,sans-serif;font-size:10px;font-weight:600;color:#a09878;margin-bottom:2px;opacity:.6}.black-key .key-label{color:#444;opacity:.5}.black-key.active .key-label,.white-key.active .key-label{color:#fff;opacity:.8}.note-name{font-family:Courier Prime,monospace;font-size:9px;color:#999080;opacity:.5}.black-key .note-name{color:#3a3a3a;opacity:.5}.black-key.active .note-name,.white-key.active .note-name{color:#fff9;opacity:1}.octave-indicator{margin-top:12px;display:flex;align-items:center;gap:8px}.octave-btn{width:32px;height:28px;background:linear-gradient(180deg,#2a2520,#1e1a16);border:1px solid #3a3228;border-radius:3px;color:#a09070;font-family:Rajdhani,sans-serif;font-size:12px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px #0a0806,0 3px 4px #0000004d,inset 0 1px #ffffff0d;transition:transform .06s ease-out,box-shadow .06s ease-out}.octave-btn:active:not(:disabled){transform:translateY(1px);box-shadow:0 1px #0a0806,0 1px 2px #0000004d,inset 0 1px #ffffff08}.octave-btn:disabled{opacity:.3;cursor:default}.octave-btn-label{letter-spacing:0}.octave-display{display:flex;flex-direction:column;align-items:center;min-width:52px;padding:4px 10px;background:linear-gradient(180deg,#0c0a08,#141210);border:1px solid #2a2420;border-radius:3px;box-shadow:inset 0 1px 3px #00000080,0 1px #ffffff08}.octave-display-label{font-family:Rajdhani,sans-serif;font-size:9px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:#5a5040}.octave-display-value{font-family:Courier Prime,monospace;font-size:18px;font-weight:700;color:#d4a030;text-shadow:0 0 6px rgba(212,160,48,.3);line-height:1}.white-key.dimmed{opacity:.25;cursor:default;pointer-events:none}.black-key.dimmed{opacity:.2;cursor:default;pointer-events:none}:root{--wood-dark: #3d2b1f;--wood-mid: #5c3a21;--wood-light: #7a5230;--panel-bg: #1a1a1a;--panel-surface: #2a2a2a;--panel-raised: #333;--panel-inset: #111;--cream: #e8dcc8;--cream-dim: #b8a88c;--amber: #d4882b;--amber-glow: #e8a030;--amber-dim: #8a5a1a;--led-green: #44cc44;--led-red: #dd3333;--text-label: #c8b89c;--text-value: #e8dcc8;--text-dim: #706050;--metal-light: #555;--metal-mid: #3a3a3a;--metal-dark: #222;--metal-shine: rgba(255,255,255,.06);--border-groove: #444;--border-ridge: #555;--shadow-inset: inset 0 1px 3px rgba(0,0,0,.6);--shadow-raised: 0 2px 4px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.05) inset}*{margin:0;padding:0;box-sizing:border-box}body{font-size:14px;font-family:Rajdhani,Courier Prime,monospace;background:#0a0a0a;color:var(--cream);padding:20px;min-height:100vh}.synth-chassis{max-width:1140px;margin:0 auto;display:flex;box-shadow:0 8px 32px #000000b3;border-radius:10px}.wood-panel{width:22px;min-width:22px;background:repeating-linear-gradient(180deg,rgba(0,0,0,.08) 0px,transparent 2px,transparent 4px,rgba(0,0,0,.05) 6px),linear-gradient(180deg,var(--wood-dark) 0%,var(--wood-mid) 8%,var(--wood-light) 20%,var(--wood-mid) 35%,var(--wood-light) 50%,var(--wood-mid) 65%,var(--wood-light) 80%,var(--wood-mid) 92%,var(--wood-dark) 100%)}.wood-left{border-radius:10px 0 0 10px;box-shadow:inset -2px 0 4px #0006}.wood-right{border-radius:0 10px 10px 0;box-shadow:inset 2px 0 4px #0006}.App{flex:1;min-width:0;background:var(--panel-bg);overflow:hidden;position:relative}.App:before{content:"";display:block;height:5px;background:linear-gradient(90deg,var(--metal-dark) 0%,var(--metal-mid) 10%,var(--metal-light) 25%,var(--metal-mid) 40%,var(--metal-light) 55%,var(--metal-mid) 70%,var(--metal-light) 85%,var(--metal-mid) 90%,var(--metal-dark) 100%);box-shadow:inset 0 1px 0 var(--metal-shine),0 1px 2px #0006}.App:after{content:"";display:block;height:5px;background:linear-gradient(90deg,var(--metal-dark) 0%,var(--metal-mid) 10%,var(--metal-light) 25%,var(--metal-mid) 40%,var(--metal-light) 55%,var(--metal-mid) 70%,var(--metal-light) 85%,var(--metal-mid) 90%,var(--metal-dark) 100%);box-shadow:inset 0 -1px 0 var(--metal-shine),0 -1px 2px #0006}.synth-header{padding:16px 30px 12px;display:flex;align-items:baseline;gap:16px;border-bottom:2px solid #444;background:linear-gradient(180deg,#222 0%,var(--panel-bg) 100%)}.synth-header h1{font-family:Rajdhani,sans-serif;font-weight:700;font-size:28px;letter-spacing:6px;text-transform:uppercase;color:var(--cream);text-shadow:0 0 12px rgba(212,136,43,.3)}.synth-header .subtitle{font-family:Rajdhani,sans-serif;font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--amber-dim)}.panels-container{display:flex;gap:0;padding:0}.panel{padding:16px 18px;border-right:1px solid #333;flex:1;min-width:0}.panel:last-child{border-right:none}.panel-label{font-family:Rajdhani,sans-serif;font-weight:600;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--amber);margin-bottom:14px;padding-bottom:6px;border-bottom:1px solid var(--amber-dim)}.control-group{display:flex;flex-direction:column;align-items:center;gap:4px}.control-group label{font-family:Rajdhani,sans-serif;font-weight:500;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;color:var(--text-label);text-align:center;white-space:nowrap}.control-group .value-display{font-family:Courier Prime,monospace;font-size:11px;color:var(--amber);min-height:16px;text-align:center}.controls-row{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:80px;height:6px;background:var(--panel-inset);border-radius:3px;outline:none;box-shadow:var(--shadow-inset);margin:8px 0}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#888,#444 60%,#222);border:1px solid #555;cursor:pointer;box-shadow:0 1px 4px #0009,inset 0 1px #ffffff26}input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#888,#444 60%,#222);border:1px solid #555;cursor:pointer;box-shadow:0 1px 4px #0009,inset 0 1px #ffffff26}input[type=range]:active::-webkit-slider-thumb{background:radial-gradient(circle at 35% 35%,#aaa,#555 60%,#333);box-shadow:0 0 8px #d4882b4d,0 1px 4px #0009}input[type=text]{font-family:Courier Prime,monospace;font-size:13px;padding:4px 6px;background:var(--panel-inset);color:var(--amber);border:1px solid #333;border-radius:2px;box-shadow:var(--shadow-inset);outline:none;text-align:center}input[type=text]:focus{border-color:var(--amber-dim);box-shadow:var(--shadow-inset),0 0 6px #d4882b33}input[type=text]::placeholder{color:var(--amber-dim)}select{font-family:Rajdhani,sans-serif;font-weight:500;font-size:13px;padding:4px 8px;background:var(--panel-inset);color:var(--cream);border:1px solid #333;border-radius:2px;box-shadow:var(--shadow-inset);outline:none;cursor:pointer}select:focus{border-color:var(--amber-dim)}button{font-family:Rajdhani,sans-serif;font-weight:600;font-size:12px;letter-spacing:1px;text-transform:uppercase;padding:6px 14px;border:1px solid #444;border-radius:3px;cursor:pointer;background:linear-gradient(180deg,#3a3a3a,#252525);color:var(--cream-dim);box-shadow:var(--shadow-raised);transition:all .15s}button:hover{background:linear-gradient(180deg,#444,#2a2a2a);color:var(--cream)}button:active{box-shadow:var(--shadow-inset);transform:translateY(1px)}.control-bar{display:flex;align-items:center;gap:16px;padding:10px 24px;background:linear-gradient(180deg,#1e1e1e,#161616);border-top:1px solid #333;border-bottom:1px solid #333;flex-wrap:wrap}.control-bar-group{display:flex;align-items:center;gap:8px}.control-bar-group .divider{width:1px;height:24px;background:#333;margin:0 4px}.keyboard-toggle{display:flex;align-items:center;gap:10px;margin:0}.keyboard-toggle button.active{background:linear-gradient(180deg,#4a3510,#2a1f0a);color:var(--amber);border-color:var(--amber-dim);box-shadow:0 0 8px #d4882b33,var(--shadow-raised)}.keyboard-toggle button.inactive{background:linear-gradient(180deg,#2a2a2a,#1a1a1a);color:#555}.octave-control{display:flex;align-items:center;gap:6px;font-size:12px;letter-spacing:1px;color:var(--cream-dim)}.octave-control span{font-family:Courier Prime,monospace;color:var(--amber);min-width:20px;text-align:center}.octave-control button{width:24px;height:24px;padding:0;font-size:14px;line-height:1;border-radius:2px}.octave-control button:disabled{opacity:.25;cursor:not-allowed}.panic-btn{color:var(--led-red);border-color:#422;background:linear-gradient(180deg,#2a1515,#1a0a0a)}.panic-btn:hover{background:linear-gradient(180deg,#3a1818,#2a0e0e);box-shadow:0 0 8px #d333,var(--shadow-raised)}.midi-learn-btn{margin-left:auto}.midi-learn-btn.active{background:linear-gradient(180deg,#4a1010,#2a0a0a);color:var(--led-red);border-color:#622;box-shadow:0 0 10px #dd33334d,var(--shadow-raised);animation:pulse-red 1.5s ease-in-out infinite}@keyframes pulse-red{0%,to{box-shadow:0 0 8px #d333,var(--shadow-raised)}50%{box-shadow:0 0 14px #d336,var(--shadow-raised)}}.learn{color:var(--led-red)!important;font-weight:700;cursor:pointer;animation:pulse-red-text 1.5s ease-in-out infinite}@keyframes pulse-red-text{0%,to{opacity:1}50%{opacity:.6}}.user-mappings{padding:12px 24px;background:var(--panel-inset);border-bottom:1px solid #333;font-size:12px}.user-mappings p{color:var(--cream-dim);margin-bottom:8px}.user-mappings h4{font-family:Rajdhani,sans-serif;font-size:12px;letter-spacing:1px;color:var(--amber);margin-bottom:6px}.user-mappings ul{list-style:none;padding:0}.user-mappings li{margin-bottom:4px;font-family:Courier Prime,monospace;font-size:12px;color:var(--cream-dim)}h3{font-family:Rajdhani,sans-serif;font-weight:600;font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--amber);margin:0 0 10px}label{font-family:Rajdhani,sans-serif;font-weight:500;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--text-label);margin-right:6px}