:root{--w-kick: #00CD9C;--w-snare: #56B4E9;--w-hat: #E6C84F;--w-hatopen: #F0A04B;--w-clap: #E88AA8;--w-tom: #A68CF0;--w-rim: #B8B6AE}:root[data-theme=light]{--w-kick: #00876A;--w-snare: #1F78B4;--w-hat: #A98500;--w-hatopen: #C0610F;--w-clap: #C2416F;--w-tom: #6E4FC7;--w-rim: #6E6C66}.w{container-type:inline-size;display:grid;gap:12px;margin:var(--space-3) 0;padding:14px 16px 12px;border-radius:var(--radius-media);background:var(--color-surface);border:1px solid var(--color-border);box-shadow:var(--shadow-card);font-size:var(--fs-base);line-height:1.4;color:var(--color-ink);min-width:0;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.w *{min-width:0}.w__row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.w__spacer{flex:1 1 auto}.w__bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;min-height:28px}.w__hint{font-size:var(--fs-xs);color:var(--color-gray)}.w .play--sm{width:52px;height:52px}.w .play--sm svg{width:22px;height:22px}.w-midi.is-on{border-color:var(--color-accent);color:var(--color-accent-ink)}@media (max-width: 600px){.w{padding:12px;margin:var(--space-2) 0}}.w[data-w=pulse]{min-height:168px}.w[data-w=pulse][data-cfg*='"tap": true']{min-height:262px}.w[data-w=drum]{min-height:236px}.w[data-w=piano]{min-height:214px}.w[data-w=synth]{min-height:420px}.w[data-w=roll]{min-height:380px}.w-pulse__bpm,.w-drum__bpm{display:inline-flex;align-items:center;gap:8px}.w-pulse__val,.w-drum__val{display:inline-flex;align-items:baseline;gap:4px;min-width:64px;justify-content:center}.w-pulse__val b,.w-drum__val b{font-family:var(--font-heading);font-weight:700;font-size:1.6rem;line-height:1;font-variant-numeric:tabular-nums}.w-pulse__val small,.w-drum__val small{font-size:var(--fs-xs);font-weight:700;letter-spacing:.1em;color:var(--color-gray)}.w-drum__bpmin{width:3.2ch;border:0;background:transparent;font-family:var(--font-heading);font-weight:700;font-size:1.6rem;line-height:1;text-align:center;color:var(--color-ink);padding:0;border-radius:4px;font-variant-numeric:tabular-nums}.w-drum__bpmin:focus{outline:2px solid var(--color-accent);outline-offset:2px;background:var(--color-surface-2)}.w-pulse__range{max-width:100%}.w-pulse__subs button{min-height:36px;padding:0 12px;font-size:var(--fs-sm)}.w-pulse__beats{display:grid;grid-template-columns:repeat(auto-fit,minmax(44px,1fr));gap:8px}.w-pulse__beat{position:relative;display:grid;gap:6px;justify-items:center;padding:10px 6px 8px;border-radius:var(--radius);background:var(--color-surface-2);border:1px solid var(--color-hairline);transition:background .25s ease,border-color .25s ease}.w-pulse__beat i{font-style:normal;font-family:var(--font-heading);font-weight:700;font-size:1.25rem;line-height:1;color:var(--color-gray)}.w-pulse__beat.is-first i{color:var(--color-accent-ink)}.w-pulse__beat.is-on{border-color:var(--color-accent);background:var(--color-accent-dim);transition:none}.w-pulse__beat.is-on i{color:var(--color-ink)}.w-pulse__beat.is-hit{animation:w-pop .22s ease-out}.w-pulse__subs-dots{display:flex;gap:4px}.w-pulse__subs-dots b{width:6px;height:6px;border-radius:50%;background:var(--color-surface-3)}.w-pulse__subs-dots b.is-on{background:var(--color-accent)}.w-pulse__tap{display:grid;gap:8px;justify-items:center;padding-top:4px}.w-pulse__tapbtn{width:100%;min-height:64px;font-size:var(--fs-md);touch-action:manipulation}.w-pulse__tapbtn.is-hit{animation:w-pop .18s ease-out;border-color:var(--color-accent)}.w-pulse__fb{margin:0;min-height:1.4em;font-size:var(--fs-sm);font-weight:700;color:var(--color-ink-soft);text-align:center}.w-pulse__fb.is-good{color:var(--color-accent-ink)}@keyframes w-pop{0%{transform:scale(1.06)}to{transform:scale(1)}}.w-drum__swing{display:inline-flex;align-items:center;gap:8px;font-size:var(--fs-sm);font-weight:700;color:var(--color-ink-soft)}.w-drum__swing b{min-width:3.4ch;text-align:center;color:var(--color-ink);font-variant-numeric:tabular-nums}.w-drum__grid{display:grid;gap:6px;--label: 84px}.w-drum__row{display:grid;grid-template-columns:var(--label) minmax(0,1fr);gap:8px;align-items:center;transition:opacity .2s ease}.w-drum__row.is-muted{opacity:.38}.w-drum__name{display:flex;align-items:center;gap:6px;min-height:34px;padding:0 8px;border:1px solid var(--color-hairline);border-radius:var(--radius);background:var(--color-surface-2);color:var(--color-ink);font-weight:700;font-size:var(--fs-sm);text-align:left;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.w-drum__name:before{content:"";flex:0 0 auto;width:8px;height:8px;border-radius:2px;background:var(--c)}.w-drum__name[aria-pressed=true]{text-decoration:line-through;color:var(--color-gray)}.w-drum__name.is-hit:before{animation:w-flash .2s ease-out}.w-drum__name--blank{border:0;background:none;min-height:0}.w-drum__name--blank:before{display:none}.w-drum__short{display:none}.w-drum__cells{display:grid;grid-template-columns:repeat(var(--steps),minmax(0,1fr));gap:3px}.w-drum__nums .w-drum__cells span{text-align:center;font-size:var(--fs-xs);color:var(--color-gray);font-variant-numeric:tabular-nums;line-height:1.2}.w-drum__nums .w-drum__cells span.is-beat{color:var(--color-ink);font-weight:700}.w-drum__cell{position:relative;height:34px;padding:0;border:1px solid var(--color-hairline);border-radius:5px;background:var(--color-surface-2);touch-action:none;transition:background .08s ease,transform .08s ease}.w-drum__cell.is-beat{background:var(--color-surface-3)}.w-drum__cell[data-v="1"]{background:color-mix(in srgb,var(--c) 32%,var(--color-surface-2));border-color:var(--c);border-style:dashed}.w-drum__cell[data-v="2"]{background:color-mix(in srgb,var(--c) 72%,var(--color-surface));border-color:var(--c)}.w-drum__cell[data-v="3"]{background:var(--c);border-color:var(--c);box-shadow:inset 0 0 0 2px #ffffff59}.w-drum__cell[data-v="3"]:after{content:"";position:absolute;left:50%;top:5px;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:#0000008c}.w-drum__cell.is-now{outline:2px solid var(--color-ink);outline-offset:-2px}.w-drum__cell:disabled{cursor:default}.w-drum__goal{display:flex;align-items:center;gap:8px;margin:0;font-size:var(--fs-sm);font-weight:700;color:var(--color-ink-soft)}.w-drum__goalicon{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1px dashed var(--color-gray);color:transparent}.w-drum__goalicon svg{width:14px;height:14px}.w.is-goal{border-color:var(--color-accent)}.w.is-goal .w-drum__goal{color:var(--color-accent-ink)}.w.is-goal .w-drum__goalicon{border:0;background:var(--color-accent);color:var(--color-on-accent);animation:w-pop .3s ease-out}.w-drum__open{min-height:36px}@keyframes w-flash{0%{transform:scale(1.8)}to{transform:scale(1)}}@container (max-width: 520px){.w-drum__grid{--label: 46px}.w-drum__long{display:none}.w-drum__short{display:inline}.w-drum__name{padding:0 5px;font-size:var(--fs-xs)}.w-drum__cells{grid-template-columns:repeat(var(--half, 8),minmax(0,1fr));row-gap:4px}.w-drum__cell{height:30px}.w-drum__open span{display:none}}.wk{position:relative;display:flex;height:150px;border-radius:6px;overflow:hidden;border:1px solid var(--color-border);background:var(--color-border);gap:1px;touch-action:none}.wk__key{position:relative;display:flex;align-items:flex-end;justify-content:center}.wk__key--w{flex:1 1 0;background:#f7f6f2;color:#3d3b36;padding-bottom:8px;border-radius:0 0 4px 4px;transition:background .06s ease}.wk__key--b{position:absolute;top:0;width:calc(100% / var(--whites) * .62);margin-left:calc(100% / var(--whites) * -.31);height:60%;background:#1b1a17;color:#c7c5bd;border-radius:0 0 4px 4px;z-index:2;padding-bottom:6px;box-shadow:0 2px 4px #00000059}.wk__lbl{font-size:var(--fs-xs);font-weight:700;line-height:1.1;text-align:center;pointer-events:none}.wk__lbl small{display:block;font-size:var(--fs-xs);font-weight:700;opacity:.7}.wk__kbd{position:absolute;top:6px;left:0;right:0;text-align:center;font-size:var(--fs-xs);font-weight:700;line-height:1;color:#8a8780;pointer-events:none}.wk__key--w .wk__kbd{top:auto;bottom:30px}.wk__key--b .wk__kbd{top:5px;color:#9c9a93}.wk__key.is-down .wk__kbd{color:#121212}@media (hover: none),(pointer: coarse){.wk__kbd{display:none}}.wk__key--w.is-hl{background:color-mix(in srgb,var(--color-accent) 30%,#F7F6F2)}.wk__key--b.is-hl{background:color-mix(in srgb,var(--color-accent) 55%,#1B1A17)}.wk__key.is-root.is-hl{box-shadow:inset 0 -5px 0 var(--color-accent)}.wk__key--w.is-down{background:var(--color-accent);color:#121212}.wk__key--b.is-down{background:var(--color-accent-hover);color:#121212}@container (max-width: 520px){.wk{height:124px}.wk__lbl small{display:none}}.w-synth__top{justify-content:space-between}.w-synth__presets button{min-height:36px;padding:0 12px;font-size:var(--fs-sm)}.w-synth__scope{width:160px;height:40px;border-radius:6px;background:var(--color-surface-2);border:1px solid var(--color-hairline)}.w-synth__panel{display:grid;grid-template-columns:auto 1fr 1.6fr;gap:12px 18px;align-items:start}.w-synth__group{display:grid;gap:6px;align-content:start}.w-synth__group--env{grid-template-columns:1fr 1fr;column-gap:14px}.w-synth__group--env .w-synth__gt,.w-synth__adsr{grid-column:1 / -1}.w-synth__gt{font-size:var(--fs-xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--color-gray)}.w-synth__waves{flex-wrap:nowrap}.w-synth__waves button{min-width:40px;padding:0 8px}.w-synth__knob{display:grid;gap:0}.w-synth__klbl{display:flex;justify-content:space-between;gap:6px;font-size:var(--fs-xs);font-weight:700;color:var(--color-ink-soft)}.w-synth__klbl b{color:var(--color-ink);font-variant-numeric:tabular-nums}.w-synth__adsr{width:100%;height:34px}.w-synth__adsr path{fill:var(--color-accent-dim);stroke:var(--color-accent);stroke-width:2;vector-effect:non-scaling-stroke}@container (max-width: 640px){.w-synth__panel{grid-template-columns:1fr 1fr}.w-synth__group--env{grid-column:1 / -1}.w-synth__scope{display:none}}@container (max-width: 420px){.w-synth__panel{grid-template-columns:1fr;gap:10px}.w-synth__group:not(.w-synth__group--env):has(.w-synth__knob){grid-template-columns:1fr 1fr;column-gap:14px}.w-synth__group:not(.w-synth__group--env):has(.w-synth__knob) .w-synth__gt{grid-column:1 / -1}.w-synth__adsr{height:24px}.w-synth__presets{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.w-synth__presets::-webkit-scrollbar{display:none}.w-synth__presets button{flex:0 0 auto}}.w-roll__drums button{min-height:36px;padding:0 12px;font-size:var(--fs-sm)}.w-roll__wrap{display:grid;grid-template-columns:44px minmax(0,1fr);gap:6px}.w-roll__keys{display:grid;grid-template-rows:repeat(var(--rows),1fr);gap:2px}.w-roll__keys span{display:flex;align-items:center;justify-content:flex-end;padding-right:4px;font-size:var(--fs-xs);font-weight:700;color:var(--color-gray)}.w-roll__keys span.is-root{color:var(--color-accent-ink)}.w-roll__grid{position:relative;display:grid;grid-template-rows:repeat(var(--rows),24px);gap:2px;touch-action:none;border-radius:6px;outline-offset:3px}.w-roll__row{display:grid;grid-template-columns:repeat(var(--steps),minmax(0,1fr));gap:2px}.w-roll__cell{background:var(--color-surface-2);border-radius:3px}.w-roll__cell.is-beat{background:var(--color-surface-3)}.w-roll__row.is-root .w-roll__cell{box-shadow:inset 0 0 0 1px var(--color-accent-dim)}.w-roll__notes,.w-roll__head{position:absolute;inset:0;pointer-events:none}.w-roll__note{position:absolute;pointer-events:auto;left:calc(var(--st) / var(--steps) * 100%);width:calc(var(--len) / var(--steps) * 100% - 2px);top:calc(var(--r) * (24px + 2px));height:24px;border-radius:4px;background:var(--color-accent);box-shadow:inset 0 -3px #0000002e;cursor:grab}.w-roll__note:after{content:"";position:absolute;top:5px;bottom:5px;right:3px;width:3px;border-radius:2px;background:#0000004d;cursor:ew-resize}.w-roll__note.is-playing{background:var(--color-accent-hover);box-shadow:0 0 0 2px var(--color-accent-glow)}.w-roll__head{left:calc(var(--st, 0) / var(--steps) * 100%);width:calc(100% / var(--steps));right:auto;background:color-mix(in srgb,var(--color-ink) 9%,transparent);border-radius:3px;opacity:0}.w-roll__head.is-on{opacity:1}.w-roll__grid.has-cursor:after{content:"";position:absolute;left:calc(var(--cst, 0) / var(--steps) * 100%);top:calc(var(--cr, 0) * 26px);width:calc(100% / var(--steps));height:24px;border:2px solid var(--color-ink);border-radius:4px;pointer-events:none}@container (max-width: 520px){.w-roll__wrap{grid-template-columns:34px minmax(0,1fr)}.w-roll__grid{grid-template-rows:repeat(var(--rows),22px)}.w-roll__note{top:calc(var(--r) * (22px + 2px));height:22px}.w-roll__grid.has-cursor:after{top:calc(var(--cr, 0) * 24px);height:22px}.w-roll__drums{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.w-roll__drums button{flex:0 0 auto}}@media (prefers-reduced-motion: reduce){.w *{animation:none!important}}.w[data-w=scope]{min-height:330px}.w[data-w=chords]{min-height:360px}.w[data-w=chords][data-cfg*='"showPiano": false']{min-height:240px}.w[data-w=fx]{min-height:230px}.w[data-w=mixer]{min-height:420px}.w[data-w=estudio]{min-height:600px}.w[data-w=estudio].w--full{min-height:900px}.w-scope__read{display:inline-flex;align-items:baseline;gap:6px}.w-scope__hz{font-family:var(--font-heading);font-weight:700;font-size:1.7rem;line-height:1;font-variant-numeric:tabular-nums}.w-scope__read small{font-size:var(--fs-xs);font-weight:700;color:var(--color-gray);letter-spacing:.08em}.w-scope__note{font-size:var(--fs-sm);font-weight:700;color:var(--color-accent-ink);margin-left:4px}.w-scope__canvas{display:block;width:100%;height:140px;border-radius:var(--radius);background:var(--color-surface-2);border:1px solid var(--color-hairline)}.w-scope__field{display:grid;gap:4px}.w-scope__field>span:first-child,.w-scope__vol span{font-size:var(--fs-sm);font-weight:700;color:var(--color-ink-soft)}.w-scope__ends{display:flex;justify-content:space-between}.w-scope__ends small{font-size:var(--fs-xs);color:var(--color-gray)}.w-scope__waves button{gap:6px}.w-scope__waves button svg{width:18px;height:18px}.w-scope__vol{display:grid;gap:2px;flex:1 1 160px}@container (max-width: 520px){.w-scope__waves button span{display:none}.w-scope__canvas{height:120px}}.w-keys{display:block;width:100%;height:auto;max-height:120px}.w-keys__w{fill:#eceae4;stroke:#8e8c85;stroke-width:1}.w-keys__b{fill:#1a1a18;stroke:#000;stroke-width:.5}:root[data-theme=light] .w-keys__w{fill:#fff;stroke:#b5b2aa}.w-keys__w.is-on{fill:var(--color-accent-dim);stroke:var(--color-accent);stroke-width:1.5}.w-keys__b.is-on{fill:var(--color-accent);opacity:1}.w-keys__w.is-root{fill:var(--color-accent)}.w-keys__t{font-family:var(--font-body);font-size:9px;font-weight:700;fill:#161614;pointer-events:none}.w-keys__w.is-root+.w-keys__t{fill:#fff}.w-keys__tb{font-family:var(--font-body);font-size:7px;font-weight:700;fill:#fff;pointer-events:none}.w-keys__w.is-on,:root[data-theme=light] .w-keys__w.is-on{fill:color-mix(in srgb,var(--color-accent) 35%,#ECEAE4)}:root[data-theme=light] .w-keys__w.is-root{fill:var(--color-accent)}.w-chords__key{font-size:var(--fs-sm);font-weight:700;color:var(--color-ink-soft);padding:4px 10px;border-radius:999px;border:1px solid var(--color-hairline)}.w-chords__sound button{min-height:var(--tap-sm);font-size:var(--fs-sm)}.w-chords__slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.w-chords__slot{position:relative;display:grid;justify-items:center;gap:2px;padding:12px 6px 10px;border-radius:var(--radius-media);border:1px solid var(--color-hairline);background:var(--color-surface-2);color:var(--color-ink);box-shadow:var(--shadow-sm);transition:border-color .15s ease,background .15s ease,transform .1s ease;touch-action:manipulation}.w-chords__slot:hover{border-color:var(--color-accent)}.w-chords__slot strong{font-family:var(--font-heading);font-size:1.35rem;line-height:1.1}.w-chords__rom{font-size:var(--fs-sm);font-weight:700;color:var(--color-accent-ink)}.w-chords__slot small{font-size:var(--fs-xs);color:var(--color-gray)}.w-chords__n{position:absolute;top:5px;left:8px;font-size:var(--fs-xs);font-weight:700;color:var(--color-gray)}.w-chords__slot.is-now{border-color:var(--color-accent);background:var(--color-accent-dim);box-shadow:0 0 0 3px var(--color-accent-dim)}.w-chords__slot.is-pick{border-color:var(--color-warn);border-style:dashed}.w-chords__pick{display:grid;gap:6px;padding:10px;border-radius:var(--radius);background:var(--color-surface-2)}.w-chords__pal{display:flex;flex-wrap:wrap;gap:8px}.w-chords__pal .chip b{font-family:var(--font-heading)}.w-chords__pal .chip span{color:var(--color-accent-ink);font-size:var(--fs-xs)}.w-chords__notes b{color:var(--color-ink)}.w-chords__drums[aria-pressed=true]{background:var(--color-accent-dim);border-color:var(--color-accent);color:var(--color-accent-ink)}@container (max-width: 520px){.w-chords__slot strong{font-size:1.1rem}.w-chords__slot small{display:none}.w-chords__key{order:5}}.w-fx__title{display:grid;line-height:1.2}.w-fx__title strong{font-family:var(--font-heading);font-size:1.15rem}.w-fx__title small{font-size:var(--fs-xs);color:var(--color-gray)}.w-fx__ab button{min-height:var(--tap-sm);font-size:var(--fs-sm)}.w-fx__ctrls{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px 18px}.w-fx__field{display:grid;gap:4px}.w-fx__lab{display:flex;justify-content:space-between;gap:8px;font-size:var(--fs-sm);font-weight:700;color:var(--color-ink-soft)}.w-fx__v{color:var(--color-ink);font-variant-numeric:tabular-nums}.w-fx__figs button,.w-fx__types button{min-height:var(--tap-sm);font-size:var(--fs-sm);padding:0 10px}.w-fx.is-bypass .w-fx__ctrls{opacity:.5}.w-mixer__strips{display:grid;gap:8px}.w-mixer__strip{display:grid;grid-template-columns:82px 64px minmax(0,1fr) minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--radius);background:var(--color-surface-2);border:1px solid var(--color-hairline);transition:opacity .15s ease}.w-mixer__strip.is-off{opacity:.5}.w-mixer__name{font-weight:700}.w-mixer__meter,.w-studio__meter{position:relative;height:8px;border-radius:999px;background:var(--color-surface-3);overflow:hidden}.w-mixer__meter span,.w-studio__meter span{position:absolute;inset:0;background:linear-gradient(90deg,var(--color-accent) 70%,var(--color-warn) 88%,var(--color-danger));transform-origin:left;transform:scaleX(0)}.w-mixer__ctl{display:grid;gap:2px}.w-mixer__ctl span{display:flex;justify-content:space-between;font-size:var(--fs-xs);font-weight:700;color:var(--color-gray)}.w-mixer__ctl b{color:var(--color-ink);font-variant-numeric:tabular-nums}.w-mixer__btns{display:inline-flex;gap:6px}.w-mixer__ms{width:var(--tap-sm);height:var(--tap-sm);border-radius:var(--radius);border:1px solid var(--color-hairline);background:var(--color-surface);color:var(--color-ink-soft);font-weight:700;font-size:var(--fs-sm);box-shadow:var(--shadow-sm);touch-action:manipulation}.w-mixer__ms[aria-pressed=true]{background:var(--color-warn);border-color:var(--color-warn);color:#161614}.w-mixer__ms--solo[aria-pressed=true]{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-on-accent)}.w-mixer__status{display:flex;align-items:center;gap:10px;margin:0;padding:10px 12px;border-radius:var(--radius);background:var(--color-surface-2);font-size:var(--fs-base);color:var(--color-ink-soft)}.w-mixer__icon{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;border:2px solid var(--color-hairline);color:transparent;flex:0 0 auto}.w-mixer__icon svg{width:14px;height:14px}.w-mixer.is-ok .w-mixer__status{color:var(--color-ink);background:var(--color-accent-dim)}.w-mixer.is-ok .w-mixer__icon{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-on-accent)}@container (max-width: 560px){.w-mixer__strip{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"n b" "m m" "v v" "p p";gap:8px}.w-mixer__name{grid-area:n}.w-mixer__btns{grid-area:b}.w-mixer__meter{grid-area:m}.w-mixer__ctl:nth-of-type(1){grid-area:v}.w-mixer__ctl:nth-of-type(2){grid-area:p}}.w-studio{gap:10px}.w-studio__transport,.w-studio__tools{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px}.w-studio__tools{padding-bottom:10px;border-bottom:1px solid var(--color-hairline)}.w-studio__sel select.input{height:var(--tap-sm);min-width:0;width:auto;padding-left:10px;font-size:var(--fs-sm);font-weight:700}.w-studio__bars button{min-height:var(--tap-sm);min-width:40px;font-size:var(--fs-sm)}.w-studio__bars:before{content:"Compases";align-self:center;font-size:var(--fs-xs);font-weight:700;color:var(--color-gray);margin-right:2px}.w-studio__swing{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-xs);font-weight:700;color:var(--color-gray)}.w-studio__swing b{font-size:var(--fs-sm);color:var(--color-ink);min-width:3ch;text-align:center;font-variant-numeric:tabular-nums}.w-studio__saves{display:grid;gap:8px;padding:10px;border-radius:var(--radius);background:var(--color-surface-2)}.w-studio__tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.w-studio__tabs button{min-height:var(--tap-sm);font-size:var(--fs-sm);gap:6px;padding:0 8px}.w-studio__dot{width:7px;height:7px;border-radius:50%;background:var(--color-hairline);flex:0 0 auto}.w-studio__dot.is-on{background:var(--color-accent)}.w-studio__tabs button[aria-pressed=true] .w-studio__dot.is-on{background:var(--color-on-accent)}.w-studio--full .w-studio__tabs{display:none}.w-studio__tracks{display:grid;gap:12px}.w-studio__track{display:grid;gap:8px;padding:10px 12px 12px;border-radius:var(--radius-media);background:var(--color-surface-2);border:1px solid var(--color-hairline)}.w-studio--compact .w-studio__track{padding:0;background:none;border:0}.w-studio__track.is-off .w-studio__body{opacity:.45}.w-studio__thead{display:flex;align-items:center;gap:8px 10px;flex-wrap:wrap}.w-studio__thead strong{font-family:var(--font-heading);font-size:1.1rem}.w-studio__thead .w-studio__snd{height:var(--tap-sm);width:auto;font-size:var(--fs-sm);padding-left:10px}.w-studio__meter{flex:0 1 70px;min-width:40px}.w-studio__vol{flex:1 1 90px;max-width:160px}.w-studio__body{display:grid;gap:8px;transition:opacity .15s ease}.w-studio__pages button{min-height:32px;font-size:var(--fs-xs);padding:0 10px}.w-studio__grid{display:grid;gap:3px;touch-action:pan-y}.w-studio__row{display:grid;grid-template-columns:104px minmax(0,1fr);gap:6px;align-items:stretch}.w-studio__inst{white-space:nowrap}.w-studio__pages{align-items:center}.w-studio__plab{font-size:var(--fs-xs);font-weight:700;color:var(--color-gray);margin-right:2px}.w-studio__pages button{min-width:36px}.w-studio__cells{display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:3px}.w-studio__nums span{font-size:var(--fs-xs);text-align:center;color:var(--color-gray)}.w-studio__nums span.is-beat{font-weight:700;color:var(--color-ink-soft)}.w-studio__cell{min-height:30px;border-radius:4px;border:1px solid transparent;background:var(--color-surface);padding:0;touch-action:manipulation;transition:background .08s ease}.w-studio--compact .w-studio__cell{background:var(--color-surface-2)}.w-studio__cell.is-beat{box-shadow:inset 2px 0 0 var(--color-hairline)}.w-studio__cell:hover{border-color:var(--color-accent)}.w-studio__cell.is-now{outline:2px solid color-mix(in srgb,var(--color-ink) 35%,transparent);outline-offset:-2px}.w-studio__cell[data-v="1"]{background:color-mix(in srgb,var(--c) 30%,transparent)}.w-studio__cell[data-v="2"]{background:color-mix(in srgb,var(--c) 72%,transparent)}.w-studio__cell[data-v="3"]{background:var(--c);box-shadow:0 0 10px color-mix(in srgb,var(--c) 45%,transparent)}.w-studio__grid--roll .w-studio__cell{min-height:26px}.w-studio__cell.is-chordtone{background:color-mix(in srgb,var(--color-accent) 7%,var(--color-surface))}.w-studio--compact .w-studio__cell.is-chordtone{background:color-mix(in srgb,var(--color-accent) 8%,var(--color-surface-2))}.w-studio__cell.is-hold{background:color-mix(in srgb,var(--color-accent) 38%,transparent);border-radius:0 4px 4px 0}.w-studio__cell.is-note{background:var(--color-accent);box-shadow:inset 0 -3px #0000002e}.w-studio__inst,.w-studio__note{display:flex;align-items:center;justify-content:flex-end;padding:0 8px;border:0;border-radius:4px;background:none;font-size:var(--fs-xs);font-weight:700;color:var(--color-ink-soft);text-align:right;touch-action:manipulation}.w-studio__inst{position:relative;padding-left:12px}.w-studio__inst:before{content:"";position:absolute;left:2px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--c)}.w-studio__inst:hover,.w-studio__note:hover{background:var(--color-surface-3);color:var(--color-ink)}.w-studio__note.is-tonic{color:var(--color-accent-ink)}.w-studio__short{display:none}.w-studio__rec{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.w-studio__recbtn svg{color:var(--color-danger)}.w-studio__recbtn.is-rec{border-color:var(--color-danger);color:var(--color-danger);animation:w-rec 1s ease-in-out infinite}@keyframes w-rec{50%{box-shadow:0 0 0 4px color-mix(in srgb,var(--color-danger) 25%,transparent)}}.w-studio__chordrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center}.w-studio__sev{min-height:0;gap:10px;font-size:var(--fs-sm)}.w-studio__cnotes b{color:var(--color-ink)}@container (max-width: 600px){.w-studio__row{grid-template-columns:40px minmax(0,1fr);gap:4px}.w-studio__cells{gap:2px}.w-studio__cell{min-height:32px}.w-studio__grid--roll .w-studio__cell{min-height:26px}.w-studio__long{display:none}.w-studio__short{display:inline}.w-studio__inst,.w-studio__note{padding:0 3px 0 4px;justify-content:center}.w-studio__inst{padding-left:9px}.w-studio__nums span{font-size:var(--fs-xs);letter-spacing:-.02em}.w-studio__nums span:not(.is-beat){visibility:hidden}.w-studio__chordrow{grid-template-columns:minmax(0,1fr)}.w-studio__tools .btn{padding:0 10px}.w-studio__tools [data-act=save] span,.w-studio__meter{display:none}.w-studio__thead{flex-wrap:nowrap}.w-studio__vol{flex:1 1 60px;min-width:50px}.w-studio__thead{gap:6px}.w-studio__thead strong{flex:0 0 auto;font-size:1rem}.w-studio__thead .w-studio__snd{flex:0 1 auto;max-width:104px}.w-studio__vol{flex:1 1 40px;min-width:40px}.w-studio__tabs button{font-size:var(--fs-xs);padding:0 4px}.w-studio__bars:before{display:none}.w-studio__vol{flex-basis:70px}}@media (max-width: 600px){.w-studio__grid{overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px}.w-studio__cells{grid-template-columns:repeat(var(--steps, 16),minmax(24px,1fr));min-width:calc(var(--steps, 16) * 26px)}}:root{--key-play: #FF8000;--key-play-ink: #121212;--key-hl: #1F91DC;--key-hl-ink: #0E0E0D;--key-root: var(--plum-fill, #8E4E6B);--key-root-ink: #FFFFFF;--key-w: #F2F1ED;--key-w-hover: #E2E0D9;--key-b: #1A1A18;--key-b-hover: #3A3936;--key-line: #6E6C66;--w-line: #6E6C66;--w-kick: #00CD9C;--w-snare: #1F91DC;--w-hat: #E5B000;--w-hatopen: #FF8000;--w-clap: #E0457B;--w-tom: #8B6CF0;--w-rim: #A8A69E}:root[data-theme=light]{--key-root: #351E28;--key-w: #FFFFFF;--key-w-hover: #ECECE6;--key-b: #1A1A18;--key-b-hover: #45433E;--key-line: #77756E;--w-line: #8A8880;--w-kick: #00876A;--w-snare: #1F91DC;--w-hat: #C99700;--w-hatopen: #FF8000;--w-clap: #D6336C;--w-tom: #6E4FC7;--w-rim: #6E6C66}.wk{background:var(--key-line);border-color:var(--key-line)}.wk__key--w{background:var(--key-w);color:#2a2a28}.wk__key--b{background:var(--key-b);color:#d9d8d2}@media (hover: hover){.wk__key--w:hover{background:var(--key-w-hover);box-shadow:inset 0 0 0 2px var(--color-ink)}.wk__key--b:hover{background:var(--key-b-hover)}}.wk__key--w.is-hl,.wk__key--b.is-hl{background:var(--key-hl);color:var(--key-hl-ink)}.wk__key.is-root.is-hl,.wk__key.is-root{background:var(--key-root);color:var(--key-root-ink);box-shadow:none}.wk__key.wk__key--w.is-down,.wk__key.wk__key--b.is-down{background:var(--key-play);color:var(--key-play-ink);box-shadow:inset 0 -4px #0000002e}.wk__key.is-hl .wk__kbd,.wk__key.is-root .wk__kbd{color:inherit;opacity:.8}.w-keys__w,:root[data-theme=light] .w-keys__w{fill:var(--key-w);stroke:var(--key-line);stroke-width:1}.w-keys__b{fill:var(--key-b);stroke:var(--key-line)}.w-keys__w.is-on,:root[data-theme=light] .w-keys__w.is-on,.w-keys__b.is-on{fill:var(--key-hl);stroke:var(--key-line)}.w-keys__w.is-root,:root[data-theme=light] .w-keys__w.is-root,.w-keys__b.is-root{fill:var(--key-root)}.w-keys__w.is-on+.w-keys__t{fill:var(--key-hl-ink)}.w-keys__w.is-root+.w-keys__t{fill:var(--key-root-ink)}.w-legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin:8px 0 0;padding:0;list-style:none;font-size:var(--fs-xs);font-weight:700;color:var(--color-ink-soft)}.w-legend li{display:inline-flex;align-items:center;gap:6px}.w-legend i{width:12px;height:12px;border-radius:3px;display:inline-block}.w-legend .is-play{background:var(--key-play)}.w-legend .is-hl{background:var(--key-hl)}.w-legend .is-root{background:var(--key-root)}.w-drum__cell{border:1px solid var(--w-line)}.w-drum__cell[data-v="1"]{background:color-mix(in srgb,var(--c) 28%,var(--color-surface));border-color:var(--c);border-style:dashed;border-width:2px}.w-drum__cell[data-v="2"]{background:var(--c);border-color:var(--c)}.w-drum__cell[data-v="3"]{background:var(--c);border-color:var(--color-ink);border-width:2px}@media (hover: hover){.w-drum__cell:not(:disabled):hover{outline:2px solid var(--color-ink);outline-offset:-2px}}.w-drum__cell.is-now{outline:3px solid var(--orange);outline-offset:-3px}.w-drum__cell:focus-visible,.w-studio__cell:focus-visible,.w-roll__cell:focus-visible{outline:3px solid var(--blue);outline-offset:1px}.w-roll__cell{border:1px solid color-mix(in srgb,var(--w-line) 55%,transparent)}.w-roll__row.is-root .w-roll__cell{background:var(--plum-dim);box-shadow:none}.w-roll__note{background:var(--blue);color:#0e0e0d}.w-roll__note.is-playing{background:var(--orange);box-shadow:0 0 0 2px color-mix(in srgb,var(--orange) 45%,transparent)}.w-roll__keys span.is-root{color:var(--plum-ink)}.w-studio__cell{border-color:color-mix(in srgb,var(--w-line) 60%,transparent)}@media (hover: hover){.w-studio__cell:hover{border-color:var(--color-ink);outline:1px solid var(--color-ink);outline-offset:-1px}}.w-studio__cell.is-now{outline:2px solid var(--orange);outline-offset:-2px}.w-studio__cell.is-note{background:var(--blue)}.w-studio__cell.is-hold{background:color-mix(in srgb,var(--blue) 45%,transparent)}.w-studio__cell.is-chordtone{background:color-mix(in srgb,var(--blue) 10%,var(--color-surface))}.w-chords__slot{border:2px solid var(--w-line)}@media (hover: hover){.w-chords__slot:hover{border-color:var(--color-ink)}}.w-chords__slot.is-now{border-color:var(--orange);background:var(--orange-dim)}