.xy{--xy-panel:#1a1a1a;--xy-panel-hi:#232226;--xy-border:#3d3b3e;--xy-text:#f4f4f4;--xy-muted:#8d8c8d;--xy-ring:#93b4ff;--xy-nat-a:#b8683a;--xy-nat-b:#8f4524;--xy-sharp-a:#7d4125;--xy-sharp-b:#55291a;--xy-edge:#00000073;--xy-label:#ffffffd1;--xy-tube-a:#8a8f98;--xy-tube-b:#4a4e56;--xy-rail:#cdb89a;--xy-frame:#1a1411;--xy-frame-edge:#3a2f29;color:var(--xy-text);flex-direction:column;gap:16px;display:flex}.xy[data-instrument=xylophone]{--xy-nat-a:#bb6b3c;--xy-nat-b:#8d4425;--xy-sharp-a:#7e4226;--xy-sharp-b:#53281a;--xy-tube-a:#9a9fa8;--xy-tube-b:#50545c}.xy[data-instrument=marimba]{--xy-nat-a:#9c5b46;--xy-nat-b:#6b3428;--xy-sharp-a:#5d2e24;--xy-sharp-b:#3b1b15;--xy-tube-a:#b59a68;--xy-tube-b:#6c5934;--xy-rail:#d7c3a2}.xy[data-instrument=glockenspiel]{--xy-nat-a:#c6ccd9;--xy-nat-b:#8a93a7;--xy-sharp-a:#b2bacb;--xy-sharp-b:#6c7588;--xy-edge:#0a0e188c;--xy-label:#0f1420c7;--xy-rail:#7f8aa0}.xy[data-instrument=vibraphone]{--xy-nat-a:#c9c3b7;--xy-nat-b:#928c80;--xy-sharp-a:#b3ada1;--xy-sharp-b:#767166;--xy-edge:#14100a80;--xy-label:#1c1812c7;--xy-tube-a:#c2c6cf;--xy-tube-b:#6a6f79;--xy-rail:#8f8a7e}.xy-controls{flex-wrap:wrap;align-items:flex-end;gap:12px 16px;display:flex}.xy .ft-seg{background:var(--xy-panel);border-color:var(--xy-border)}.xy .ft-seg-legend,.xy .ft-seg-item span{color:var(--xy-muted)}.xy .ft-seg-item:hover span{color:var(--xy-text)}.xy .ft-seg-item input:checked+span{color:#fff}.xy-toggles{flex-wrap:wrap;align-self:flex-end;gap:6px;display:flex}.xy-toggle{border:1px solid var(--xy-border);min-height:38px;color:var(--xy-muted);font:inherit;cursor:pointer;background:0 0;border-radius:999px;padding:8px 14px;font-size:14px;font-weight:500;transition:background-color .2s,color .2s,border-color .2s!important}.xy-toggle:hover{color:var(--xy-text);border-color:#5f5e60}.xy-toggle--on,.xy-toggle--on:hover{color:#fff;background:var(--color-primary);border-color:var(--color-primary)}.xy-toggle:focus-visible,.xy-icon-btn:focus-visible,.xy-text-btn:focus-visible,.xy-ghost-btn:focus-visible,.xy-song:focus-visible{outline:2px solid var(--xy-ring);outline-offset:2px}.xy-motor{align-items:center;gap:12px;max-width:420px;display:flex}.xy-motor .ft-range{--ft-track:#3d3b3e;flex:auto}.xy-lbl{color:var(--xy-muted);white-space:nowrap;font-size:13px}.xy-motor-value{font-variant-numeric:tabular-nums;min-width:56px;font-size:14px}.xy-landscape{color:var(--xy-muted);align-items:center;gap:8px;margin:0;font-size:13px;display:none}@media (max-width:600px) and (orientation:portrait){.xy-landscape{display:flex}}.xy-stage{background:radial-gradient(120% 90% at 50% 0,#1f1e22 0%,#121214 70%);border-radius:14px;width:100%;min-height:252px;position:relative;overflow:hidden}.xy-placeholder{height:252px}.xy-svg{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:pointer;font-family:var(--font-family-sans);display:block}.xy-frame{fill:var(--xy-frame);stroke:var(--xy-frame-edge);stroke-width:1.5px;stroke-linejoin:round}.xy-rail{stroke:var(--xy-rail);stroke-width:1.4px;opacity:.55}.xy-shadow{fill:#0000006b}.xy-bar--sharp .xy-shadow{transform:translate(1px,3px)}.xy-body{stroke:var(--xy-edge);stroke-width:1px}.xy-gloss{pointer-events:none}.xy-pin{fill:#00000080;pointer-events:none}.xy-label{fill:var(--xy-label);pointer-events:none;font-size:11px;font-weight:500}.xy-label--sharp{font-size:9.5px}.xy-hit{fill:var(--color-primary);stroke:var(--xy-ring);stroke-width:1.5px;opacity:0;pointer-events:none}.xy-bar--hit .xy-hit{animation:.9s ease-out xy-hit}.xy-bar--down .xy-hit{opacity:.62;animation:none}@keyframes xy-hit{0%{opacity:.92}to{opacity:0}}.xy-tube-body{stroke:#00000080;stroke-width:1px}.xy-tube-mouth{fill:#0000008c}.xy-tube--hit{animation:1s ease-out xy-tube}@keyframes xy-tube{0%{stroke:var(--xy-ring);stroke-width:2.4px}to{stroke:#00000080;stroke-width:1px}}.xy-fan{fill:#0000008c;stroke:#ffffff40;stroke-width:.6px;transform-box:fill-box;transform-origin:50%}.xy-fan--on{animation:xy-fan var(--xy-spin,.18s) linear infinite}@keyframes xy-fan{0%{transform:scaleX(1)}50%{transform:scaleX(.15)}to{transform:scaleX(1)}}.xy-nextring{fill:none;stroke:var(--xy-ring);stroke-width:2.5px;pointer-events:none;animation:1.1s ease-in-out infinite xy-next}@keyframes xy-next{0%,to{opacity:.35}50%{opacity:1}}@media (hover:hover){.xy-bar:hover .xy-body{filter:brightness(1.1)}}@media (prefers-reduced-motion:reduce){.xy-bar--hit .xy-hit{animation-duration:10ms}.xy-fan--on,.xy-tube--hit{animation:none}.xy-nextring{opacity:1;animation:none}}.xy-play{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 24px;display:flex}.xy-readout{align-items:baseline;gap:12px;min-width:0;min-height:52px;display:flex}.xy-readout-big{letter-spacing:-.02em;font-variant-numeric:tabular-nums;min-width:2.2ch;font-size:44px;font-weight:300;line-height:1}.xy-readout-sub{color:var(--xy-muted);font-size:14px}.xy-octave{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.xy-octave-text{min-width:112px;color:var(--xy-text);text-align:center;font-size:14px}.xy-octave-note{color:var(--xy-muted);font-size:13px}.xy-icon-btn,.xy-text-btn,.xy-ghost-btn{min-height:38px;font:inherit;cursor:pointer;justify-content:center;align-items:center;gap:6px;display:inline-flex}.xy-icon-btn{border:1px solid var(--xy-border);background:var(--xy-panel-hi);width:44px;min-height:44px;color:var(--xy-text);border-radius:10px}.xy-icon-btn:hover:not(:disabled){background:#2c2b30}.xy-icon-btn:disabled{opacity:.4;cursor:default}.xy-text-btn{color:var(--xy-muted);background:0 0;border:0;border-radius:8px;padding:6px 8px;font-size:14px}.xy-text-btn:hover{color:var(--xy-text)}.xy-ghost-btn{border:1px solid var(--xy-border);min-height:44px;color:var(--xy-text);background:0 0;border-radius:999px;padding:10px 20px;font-size:15px;font-weight:500}.xy-ghost-btn:hover{background:var(--xy-panel-hi)}.xy-songs{border-top:1px solid #ffffff14;flex-direction:column;gap:14px;padding-top:16px;display:flex}.xy-songs-title{margin:0;font-size:18px;font-weight:500}.xy-song-list{flex-wrap:wrap;gap:8px;display:flex}.xy-song{border:1px solid var(--xy-border);background:var(--xy-panel);min-width:150px;min-height:52px;color:var(--xy-text);font:inherit;text-align:left;cursor:pointer;border-radius:12px;flex-direction:column;align-items:flex-start;gap:2px;padding:8px 16px;display:flex;transition:background-color .2s,border-color .2s!important}.xy-song:hover{border-color:#5f5e60}.xy-song--on,.xy-song--on:hover{border-color:var(--color-primary);background:#012fa759}.xy-song-title{font-size:15px;font-weight:500}.xy-song-by{color:var(--xy-muted);font-size:12px}.xy-song-controls{flex-wrap:wrap;align-items:center;gap:10px 14px;display:flex}.xy-next{color:var(--xy-muted);align-items:center;gap:6px;font-size:14px;display:inline-flex}.xy-kbd{border:1px solid var(--xy-ring);color:#fff;background:#012fa766;border-radius:7px;place-items:center;min-width:28px;height:28px;padding:0 7px;font-family:inherit;font-size:13px;display:inline-grid}.xy-progress{background:#2c2b30;border-radius:999px;height:6px;overflow:hidden}.xy-progress span{background:var(--color-primary);border-radius:999px;height:100%;display:block;transition:width .2s!important}.xy-hint{color:var(--xy-muted);margin:0;font-size:13px;line-height:1.5}.xy-keys{opacity:.85}@media (max-width:600px){.xy-readout-big{font-size:34px}.xy-song{flex:100%}.xy-toggles{width:100%}}