.sy{--sy-panel:#1a1a1a;--sy-panel-hi:#232226;--sy-border:#3d3b3e;--sy-text:#f4f4f4;--sy-muted:#8d8c8d;--sy-ring:#93b4ff;min-width:0;color:var(--sy-text);font-family:var(--font-family-sans);flex-direction:column;gap:14px;display:flex}.sy button,.sy select{font-family:inherit}.sy .ft-seg{border-color:var(--sy-border);background:var(--sy-panel-hi);border-radius:12px;gap:2px;padding:3px}.sy .ft-seg-item span{color:var(--sy-muted);border-radius:9px;padding:7px 11px;font-size:13px}.sy .ft-seg-item:hover span{color:var(--sy-text)}.sy .ft-seg-item input:checked+span{color:#fff}.sy-lbl{color:var(--sy-muted);font-size:12px;font-weight:500}.sy-lbl--inline{align-self:center;margin-left:4px}.sy-btn,.sy-icon-btn,.sy-chip,.sy-wave{border:1px solid var(--sy-border);color:var(--sy-muted);cursor:pointer;background:0 0;transition:background-color .2s,color .2s,border-color .2s!important}.sy-btn{min-height:40px;color:var(--sy-text);background:var(--sy-panel-hi);border-radius:999px;align-items:center;gap:8px;padding:8px 16px;font-size:14px;font-weight:500;text-decoration:none;display:inline-flex}.sy-icon-btn{width:40px;height:40px;color:var(--sy-text);background:var(--sy-panel-hi);border-radius:50%;place-items:center;padding:0;display:inline-grid}.sy-btn:hover,.sy-icon-btn:hover:not(:disabled),.sy-chip:hover,.sy-wave:hover{color:#fff;border-color:#5f5e60}.sy-icon-btn:disabled{opacity:.4;cursor:default}.sy-btn--rec{color:#fff;background:var(--color-primary);border-color:var(--color-primary)}.sy-btn--rec:hover{background:#0139c7;border-color:#0139c7}.sy-chip{white-space:nowrap;border-radius:999px;align-items:center;gap:6px;min-height:34px;padding:6px 12px;font-size:13px;font-weight:500;display:inline-flex}.sy-chip--sq{justify-content:center;min-width:36px;padding:6px 8px}.sy-chip--solo{align-self:center;margin-top:4px}.sy-chip--on,.sy-chip--on:hover,.sy-wave--on,.sy-wave--on:hover{color:#fff;background:var(--color-primary);border-color:var(--color-primary)}.sy-btn:focus-visible,.sy-icon-btn:focus-visible,.sy-chip:focus-visible,.sy-wave:focus-visible,.sy-select:focus-visible,.sy-knob-dial:focus-visible,.sy-wheel-track:focus-visible{outline:2px solid var(--sy-ring);outline-offset:2px}.sy-head{grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:14px;display:grid}.sy-head-main,.sy-display{border:1px solid var(--sy-border);background:var(--sy-panel);border-radius:12px;min-width:0}.sy-head-main{flex-direction:column;justify-content:space-between;gap:14px;padding:14px 16px;display:flex}.sy-preset{flex-direction:column;gap:6px;display:flex}.sy-preset-row,.sy-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.sy-actions{gap:8px 10px}.sy-select{border:1px solid var(--sy-border);background:var(--sy-panel-hi);min-width:0;min-height:40px;color:var(--sy-text);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;border-radius:12px;flex:170px;padding:8px 12px;font-size:15px;font-weight:500}.sy-note{color:var(--sy-muted);margin:0;font-size:13px;line-height:1.4}.sy-display{min-height:150px;position:relative;overflow:hidden}.sy-scope{width:100%;height:100%;display:block;position:absolute;inset:0}.sy-display-view{position:absolute;bottom:8px;right:8px}.sy-panel{flex-wrap:wrap;gap:10px;display:flex}.sy-row{display:contents}.sy-mod{flex:1 1 var(--sy-basis,260px);border:1px solid var(--sy-border);background:var(--sy-panel);border-radius:12px;flex-direction:column;align-items:flex-start;gap:10px;min-width:0;padding:12px 14px 10px;display:flex}.sy-mod-title{color:var(--sy-muted);letter-spacing:.09em;text-transform:uppercase;font-size:11px;font-weight:600}.sy-knobs{flex-wrap:wrap;gap:4px;display:flex}.sy-waves{gap:4px;display:flex}.sy-wave{border-radius:9px;place-items:center;width:42px;height:34px;padding:0;display:inline-grid}.sy-inline{align-items:center;gap:8px;display:flex}.sy-chips{flex-wrap:wrap;gap:6px;display:flex}.sy-mod--osc{--sy-basis:290px}.sy-mod--mixer{--sy-basis:330px}.sy-mod--voice{--sy-basis:220px}.sy-mod--filter{--sy-basis:400px}.sy-mod--env{--sy-basis:270px}.sy-mod--lfo{--sy-basis:300px}.sy-mod--arp{--sy-basis:330px}.sy-mod--delay{--sy-basis:290px}.sy-mod--fx{--sy-basis:110px}.sy-mod--reverb{--sy-basis:170px}.sy-mod--filter .ft-seg-group,.sy-mod--arp .ft-seg-group,.sy-mod--voice .ft-seg-group{max-width:100%}.sy-knob{flex-direction:column;align-items:center;gap:2px;width:64px;display:flex}.sy-knob-dial{cursor:ns-resize;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;border-radius:50%;width:52px;height:52px}.sy-knob-dial svg{width:100%;height:100%;display:block}.sy-knob-track{fill:none;stroke:#3a393c;stroke-width:3.5px;stroke-linecap:round}.sy-knob-fill{fill:none;stroke:var(--sy-ring);stroke-width:3.5px;stroke-linecap:round}.sy-knob-cap{fill:#2b2a2e;stroke:#4a484c;stroke-width:1px}.sy-knob-tick{stroke:#fff;stroke-width:2.4px;stroke-linecap:round}.sy-knob-dial:hover .sy-knob-cap{fill:#323136}.sy-knob-label{max-width:64px;color:var(--sy-muted);text-align:center;font-size:11px;line-height:1.15}.sy-knob-value{color:var(--sy-text);font-variant-numeric:tabular-nums;font-size:11px;line-height:1.2}.sy-env{background:#121214;border-radius:8px;width:100%;min-width:200px;height:56px;display:block}.sy-env-base{stroke:#3a393c;stroke-width:1px}.sy-env-area{fill:#93b4ff1f}.sy-env-line{fill:none;stroke:var(--sy-ring);stroke-width:1.6px;stroke-linejoin:round;stroke-linecap:round}.sy-env-dot{fill:#fff;stroke:var(--sy-ring);stroke-width:1px}.sy-landscape{color:var(--sy-muted);align-items:center;gap:8px;margin:0;font-size:13px;display:none}.sy-play{border:1px solid var(--sy-border);background:var(--sy-panel);border-radius:12px;flex-direction:column;gap:10px;padding:12px;display:flex}.sy-play-bar{flex-wrap:wrap;align-items:center;gap:8px 10px;display:flex}.sy-octave{align-items:center;gap:6px;display:inline-flex}.sy-octave-value{min-width:72px;color:var(--sy-text);text-align:center;font-variant-numeric:tabular-nums;font-size:13px;font-weight:500}.sy-play-main{align-items:stretch;gap:12px;display:flex}.sy-wheels{flex:none;gap:8px;display:flex}.sy-wheel{flex-direction:column;align-items:center;gap:6px;display:flex}.sy-wheel-track{border:1px solid var(--sy-border);cursor:ns-resize;touch-action:none;-webkit-user-select:none;user-select:none;background:#121214;border-radius:10px;width:34px;height:168px;position:relative}.sy-wheel-ridges{background:repeating-linear-gradient(#2b2a2e 0 2px,#1a1a1a 2px 7px);border-radius:6px;position:absolute;inset:4px 7px}.sy-wheel-thumb{background:var(--sy-ring);border-radius:6px;height:14px;transition:bottom .12s ease-out;position:absolute;left:3px;right:3px;box-shadow:0 0 10px #93b4ff66}.sy-wheel-label{color:var(--sy-muted);font-size:11px}.sy-keyboard{flex:1 1 0;min-width:0;position:relative}.sy-keys{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:pointer;display:block}.sy-key{fill:#e9e9ec;stroke:#16161a;stroke-width:1px;transition:fill 80ms}.sy-key--black{fill:#1c1c20;stroke:#000}.sy-key--on{fill:var(--sy-ring)}.sy-key--black.sy-key--on{fill:#4f7bff}.sy-key--arp{fill:#fff;stroke:var(--sy-ring);stroke-width:2px}.sy-key--black.sy-key--arp{fill:var(--color-primary)}.sy-key-note{fill:#6d6c72;pointer-events:none;font-size:11px;font-weight:500}.sy-key-letter{fill:#9a99a0;pointer-events:none;font-size:10px;font-weight:500}.sy-key-letter--black{fill:#7d7c84}.sy-hint{color:var(--sy-muted);margin:0;font-size:13px;line-height:1.5}@media (max-width:980px){.sy-head{grid-template-columns:minmax(0,1fr)}}@media (max-width:700px){.sy-mod{flex-basis:100%}.sy-knobs{gap:6px 2px}.sy-wheel-track{height:118px}.sy-hide-sm{display:none}.sy-play{gap:8px;padding:8px}.sy-play-bar{flex-wrap:nowrap;gap:6px}.sy-octave{gap:2px}.sy-octave .sy-icon-btn{width:34px;height:34px}.sy-octave-value{min-width:62px}.sy-play-main{gap:8px}.sy-wheels{gap:4px}.sy-key-letter{display:none}.sy-env{min-width:0}.sy-head-main{gap:10px;padding:12px}.sy-display,.sy-scope{min-height:120px}.sy-btn{padding:8px 14px}}.sy-play--docked{z-index:30;position:fixed;bottom:8px;box-shadow:0 -10px 28px #0000008c}.sy-play--docked .sy-wheel-track{height:104px}body:has(.sy-play--docked) .gs-support-wrap{opacity:0;pointer-events:none}@media (max-width:600px) and (orientation:portrait){.sy-landscape{display:flex}}@media (prefers-reduced-motion:reduce){.sy-wheel-thumb,.sy-key{transition:none}}