:root{--bg: #0e1015;--panel: #161a22;--panel-2: #1f2530;--fg: #e6e8ee;--muted: #8b93a4;--accent: #7cd1ff;--accent-2: #ffb86b;--danger: #ff6b8a}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--fg);font-family:ui-sans-serif,-apple-system,Segoe UI,Roboto,sans-serif;font-size:14px;line-height:1.4}main{max-width:980px;margin:0 auto;padding:20px 24px 64px}h1{font-size:22px;margin:0 0 4px;letter-spacing:.2px}.sub{color:var(--muted);margin:0 0 18px}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.name-row{align-items:stretch}.name-row textarea{flex:1;min-width:220px;padding:10px 12px;font-size:16px;line-height:1.6;border-radius:8px;border:1px solid #2a3140;background:var(--panel);color:var(--fg);font-family:ui-monospace,JetBrains Mono,Menlo,monospace;resize:vertical}.name-row-buttons{display:flex;flex-direction:column;gap:8px;min-width:120px}.name-row-buttons button{width:100%}button{padding:10px 16px;border-radius:8px;border:1px solid #2a3140;background:var(--panel-2);color:var(--fg);cursor:pointer;font-size:14px}button:hover{border-color:var(--accent)}button.primary{background:var(--accent);color:#06121c;border-color:transparent;font-weight:600}button.danger{background:transparent;color:var(--danger);border-color:#432128}.panels{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}@media(max-width:720px){.panels{grid-template-columns:1fr}}.panel{background:var(--panel);border:1px solid #232a36;border-radius:10px;padding:14px 16px}.panel h2{font-size:13px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);margin:0 0 10px}.field{display:grid;grid-template-columns:110px 1fr 56px;gap:10px;align-items:center;margin-bottom:8px}.field label{color:var(--muted)}.field .val{text-align:right;font-family:ui-monospace,Menlo,monospace;font-size:12px;color:var(--accent)}.field input[type=range]{width:100%}.field select,.field input[type=text]{background:var(--panel-2);border:1px solid #2a3140;color:var(--fg);border-radius:6px;padding:6px 8px;font:inherit}.field.toggle{grid-template-columns:110px 1fr}.field.toggle input{justify-self:start}.adsr-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.adsr-grid .cell{display:flex;flex-direction:column;align-items:center;gap:2px}.adsr-grid label{color:var(--muted);font-size:11px}.adsr-grid input[type=range]{width:100%;writing-mode:bt-lr}.adsr-grid .val{font-size:11px;color:var(--accent)}.code-panel{margin-top:16px}.code-panel header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.code-panel h2{margin:0}.code-panel .actions{display:flex;gap:8px}textarea{width:100%;min-height:220px;background:#0a0d12;color:#d6e3f0;border:1px solid #232a36;border-radius:10px;padding:14px;font-family:ui-monospace,JetBrains Mono,Menlo,monospace;font-size:13px;line-height:1.5;resize:vertical}.status{margin-top:8px;color:var(--muted);font-size:12px;min-height:16px}.status.dirty{color:var(--accent-2)}.char-viz{margin-top:10px;display:flex;flex-wrap:wrap;gap:4px;min-height:36px;font-family:ui-monospace,JetBrains Mono,Menlo,monospace}.char-viz .char{padding:4px 8px;border-radius:6px;background:var(--panel);border:1px solid #232a36;color:var(--muted);font-size:16px;transition:background-color 80ms linear,color 80ms linear,border-color 80ms linear,transform 80ms ease-out;white-space:pre}.char-viz .char.active{background:var(--accent);color:#06121c;border-color:var(--accent);transform:translateY(-1px)}.scope{display:block;width:100%;height:100px;margin-top:12px;background:#0a0d12;border:1px solid #232a36;border-radius:8px}button.small{padding:6px 10px;font-size:12px;color:var(--muted)}button.small:hover{color:var(--fg);border-color:var(--accent)}.midi-btn{position:relative}.midi-btn.connected{border-color:var(--accent);color:var(--accent)}.midi-btn.connected:before{content:"● ";color:#6bdc8e}.midi-btn.learn{background:var(--accent-2);color:#06121c;border-color:transparent;font-weight:600}.hidden{display:none!important}.midi-cc-tag{display:inline-block;font-family:ui-monospace,Menlo,monospace;font-size:10px;color:var(--accent);background:#7cd1ff1f;padding:1px 6px;border-radius:6px;margin-left:6px;cursor:pointer;-webkit-user-select:none;user-select:none}.midi-cc-tag:hover{background:#7cd1ff3d}body.midi-learn .field input[type=range],body.midi-learn .field input[type=checkbox],body.midi-learn .adsr-grid input[type=range]{outline:1px dashed rgba(255,184,107,.5);outline-offset:2px;cursor:crosshair}body.midi-learn .field input.midi-arm,body.midi-learn .adsr-grid input.midi-arm{outline:2px solid var(--accent-2);animation:midi-pulse .8s ease-in-out infinite}@keyframes midi-pulse{0%,to{outline-offset:2px}50%{outline-offset:5px}}.nibble-map-log{margin-top:8px;display:flex;flex-wrap:wrap;gap:4px 10px;font-family:ui-monospace,JetBrains Mono,Menlo,monospace;font-size:11px;color:var(--muted)}.nibble-map-log span{color:var(--accent)}.nibble-map-log b{color:var(--fg);font-weight:600;margin-right:2px}.tweaks-panel{margin-top:16px}.tweaks-panel summary{cursor:pointer;color:var(--muted);font-size:13px;text-transform:uppercase;letter-spacing:1px}.tweaks-panel[open] summary{color:var(--fg)}.tweaks{list-style:none;padding:0;margin:12px 0 0;font-family:ui-monospace,JetBrains Mono,Menlo,monospace;font-size:12px}.tweaks li{padding:4px 0;border-bottom:1px solid #1a1f29}.tweaks li:last-child{border-bottom:0}.tweaks code{color:var(--accent)}.tweaks b{color:var(--fg);font-weight:600}.muted{color:var(--muted)}.examples{margin-top:6px;display:flex;gap:6px;flex-wrap:wrap}.examples .pill{background:var(--panel-2);border:1px solid #2a3140;color:var(--muted);padding:4px 10px;border-radius:999px;cursor:pointer;font-size:12px}.examples .pill:hover{color:var(--fg);border-color:var(--accent)}