@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&family=IBM+Plex+Mono:wght@400;500&display=swap";:root{--bg:#020407;--panel:#04080d;--line:#dceeff29;--text-strong:#eef6ff;--text-soft:#c2d2df;--text-muted:#718494;--cyan:#58cfff;--pink:#ff58c7;--amber:#ffaf4c;--font-ui:"Space Grotesk", "Avenir Next", "Segoe UI", sans-serif;--font-mono:"IBM Plex Mono", "SFMono-Regular", Consolas, monospace;font-family:var(--font-ui);color:var(--text-soft);background:linear-gradient(#dceeff07 1px, transparent 1px), linear-gradient(90deg, #dceeff05 1px, transparent 1px), radial-gradient(circle at top left, #58cfff1c, transparent 34%), radial-gradient(circle at bottom right, #ff58c714, transparent 30%), var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background-size:42px 42px,42px 42px,auto,auto,auto}*{box-sizing:border-box}html,body,#root{min-height:100%}body{min-height:100vh;margin:0}.synth-shell{grid-template-rows:auto minmax(150px,22vh) minmax(0,1fr) auto;gap:10px;width:min(1680px,100vw - 20px);height:100vh;margin:0 auto;padding:10px 0;display:grid;overflow:hidden}.topline{border-bottom:1px solid var(--line);grid-template-columns:minmax(190px,auto) minmax(520px,1fr) auto;align-items:center;gap:12px;padding-bottom:8px;display:grid}.eyebrow{color:var(--cyan);font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;margin:0 0 4px;font-size:.72rem}h1{color:var(--text-strong);letter-spacing:0;margin:0;font-size:clamp(1.3rem,1.4vw,2rem);line-height:.98}.header-actions{color:var(--text-muted);font-family:var(--font-mono);align-items:center;gap:10px;font-size:.82rem;display:flex}button{cursor:pointer;font:inherit}.preset-rack{grid-template-columns:minmax(118px,.8fr) auto minmax(138px,1fr) auto auto minmax(150px,1fr) auto minmax(130px,.9fr) auto minmax(88px,auto);align-items:center;gap:7px;min-width:0;display:grid}.preset-rack input,.preset-rack select{border:1px solid var(--line);min-width:0;min-height:32px;color:var(--text-strong);font:inherit;font-family:var(--font-mono);background:#ffffff06;border-radius:3px;font-size:.78rem}.preset-rack input{padding:0 9px}.preset-rack select{padding:0 7px}.preset-rack small{min-width:0;color:var(--text-muted);font-family:var(--font-mono);font-size:.68rem;line-height:1.2}.preset-rack button{min-height:32px;color:var(--cyan);padding:0 10px}.header-actions button,.preset-rack button,.wave-selector button,.control-strip,.key{border:1px solid var(--line);color:var(--text-soft);background:#ffffff06;border-radius:3px}.header-actions button{min-height:32px;color:var(--pink);padding:0 13px}button:disabled{cursor:not-allowed;opacity:.45}.scope-deck{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;min-height:0;display:grid}.scope-window,.shape-panel,.control-board,.keyboard-panel{border:1px solid var(--line);background-color:#03070cc2;background-image:linear-gradient(90deg,#eef6ff07 1px,#0000 1px),linear-gradient(0deg,#eef6ff05 1px,#0000 1px),none;background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:32px 32px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;border-radius:6px}.scope-window{grid-template-rows:auto minmax(0,1fr);display:grid;overflow:hidden}.scope-window header,.panel-heading{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:10px;padding:8px 10px;display:flex}.scope-window header span,.panel-heading span,.focus-readout span{color:var(--text-muted);font-family:var(--font-mono);letter-spacing:.12em;text-transform:uppercase;font-size:.72rem}.scope-window header strong,.panel-heading strong,.focus-readout strong{color:var(--text-strong);font-size:.94rem}.source-scope header strong{color:var(--cyan)}.filter-scope header strong{color:var(--pink)}.scope-window canvas{width:100%;height:100%;display:block}.instrument-panel{grid-template-columns:minmax(170px,220px) minmax(0,1fr);gap:10px;min-height:0;display:grid}.shape-panel{align-content:start;display:grid;overflow:hidden}.wave-selector{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:10px;display:grid}.wave-selector button{min-height:42px;color:var(--text-strong);font-family:var(--font-mono);text-transform:uppercase}.wave-selector button.is-selected{border-color:var(--cyan);color:var(--cyan);background:#58cfff1f}.focus-readout{border:1px solid #eef6ff21;border-radius:4px;gap:5px;margin:0 10px 10px;padding:10px;display:grid}.focus-readout p{color:var(--text-muted);margin:0;font-size:.82rem;line-height:1.3}.focus-readout small{color:var(--text-muted);font-size:.72rem;line-height:1.3}.control-board{grid-template-columns:repeat(6,minmax(0,1fr));gap:0;min-height:0;display:grid;overflow:hidden}.control-group{border-right:1px solid var(--line);min-width:0}.control-group:last-child{border-right:0}.control-stack{gap:5px;padding:8px;display:grid}.control-strip{text-align:left;touch-action:none;grid-template-columns:minmax(58px,1fr) 44px;align-items:center;gap:6px;min-height:34px;padding:0 8px;display:grid;position:relative;overflow:hidden}.control-strip i{background:var(--cyan);block-size:3px;position:absolute;inset:auto auto 0 0}.control-strip span,.control-strip strong{z-index:1;position:relative}.control-strip span{color:var(--text-soft);font-size:.76rem}.control-strip strong{color:var(--text-strong);font-family:var(--font-mono);text-align:right;font-size:.76rem}.control-strip.is-focused{border-color:var(--amber);background:#ffaf4c14}.control-strip.is-focused i{background:var(--amber)}.keyboard-panel{overflow:hidden}.keyboard{grid-template-columns:repeat(26,minmax(34px,1fr));gap:4px;padding:8px;display:grid}.key{height:104px;min-height:0;color:var(--text-strong);font-family:var(--font-mono);padding:8px 3px;font-size:.76rem;position:relative}.key span{color:var(--amber);font-size:.68rem;line-height:1;position:absolute;top:6px;left:7px}.key strong{white-space:nowrap;place-items:center;height:100%;font-weight:500;line-height:1;display:grid}.key.is-sharp{color:var(--cyan);background:#00000094}.key.is-held,.key:active{border-color:var(--pink);color:var(--pink);background:#ff58c729}.key:focus,.key:focus-visible{outline:none}button:not(.key):focus-visible{outline:2px solid var(--amber);outline-offset:2px}@media (width<=1060px){.topline{grid-template-columns:1fr auto}.preset-rack{order:3;grid-column:1/-1;grid-template-columns:minmax(130px,1fr) auto minmax(150px,1fr) auto auto minmax(150px,1fr) auto}.preset-rack select[aria-label="Factory pattern list"],.preset-rack button:last-of-type,.preset-rack small{grid-column:auto}.preset-rack small{justify-self:end}.scope-deck,.instrument-panel{grid-template-columns:1fr}.control-board{grid-template-columns:repeat(3,minmax(0,1fr))}.control-group:nth-child(2){border-right:0}.keyboard{grid-template-columns:repeat(13,minmax(36px,1fr))}}@media (width<=680px){.synth-shell{width:min(100vw,100vw - 18px);height:auto;min-height:100vh;padding-top:12px;overflow:visible}.topline{grid-template-columns:1fr;align-items:stretch}.header-actions{flex-wrap:wrap}.preset-rack{grid-column:auto;grid-template-columns:1fr auto auto}.preset-rack select{grid-column:1/-1}.preset-rack button{min-width:0}.preset-rack small{grid-column:1/-1;justify-self:start}.scope-deck{min-height:360px}.control-board{grid-template-columns:1fr}.control-group,.control-group:nth-child(2){border-right:0;border-bottom:1px solid var(--line)}.keyboard{grid-template-columns:repeat(7,minmax(38px,1fr))}}