.drum-machine-surface-module__Z0DA8a__surface{inline-size:100%;color:var(--ink,#212d37);background:radial-gradient(circle at 92% -12%, color-mix(in oklch, var(--accent-soft,#ffd8c3) 68%, transparent), transparent 30%), linear-gradient(145deg, var(--paper-bright,#fefbf6), var(--paper,#f9f5ec));border-block-start:.3rem solid var(--accent-strong,#d75a21);box-shadow:0 1.4rem 3rem color-mix(in oklch, var(--ink,#212d37) 9%, transparent), inset 0 1px 0 #ffffffd1;border-radius:clamp(1.25rem,3vw,2rem);gap:1rem;padding:clamp(1rem,2.6vw,1.75rem);display:grid;overflow:hidden}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__surface{color:var(--ink,lab(17.6216% -2.87226 -8.38296));background:radial-gradient(circle at 92% -12%, color-mix(in oklch, var(--accent-soft,lab(89.2683% 13.8752 17.9256)) 68%, transparent), transparent 30%), linear-gradient(145deg, var(--paper-bright,lab(98.8742% .176996 3.05097)), var(--paper,lab(96.565% .42212 4.57387)));border-block-start:.3rem solid var(--accent-strong,lab(54.6103% 47.8597 55.2265));box-shadow:0 1.4rem 3rem color-mix(in oklch, var(--ink,lab(17.6216% -2.87226 -8.38296)) 9%, transparent), inset 0 1px 0 lab(100% 0 0/.82)}}.drum-machine-surface-module__Z0DA8a__heading{justify-content:space-between;align-items:flex-start;gap:1.5rem;display:flex}.drum-machine-surface-module__Z0DA8a__heading h2{letter-spacing:-.045em;max-inline-size:18ch;margin:0;font-size:clamp(1.65rem,4vw,2.7rem);line-height:.98}.drum-machine-surface-module__Z0DA8a__eyebrow{color:var(--accent-dark,#83330d);letter-spacing:.14em;text-transform:uppercase;margin:0 0 .4rem;font-size:.75rem;font-weight:760}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__eyebrow{color:var(--accent-dark,lab(32.9517% 33.8357 39.3813))}}.drum-machine-surface-module__Z0DA8a__description{max-inline-size:48ch;color:var(--ink-muted,#525f6b);margin:.65rem 0 0;font-size:.94rem;line-height:1.55}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__description{color:var(--ink-muted,lab(39.6742% -3.12503 -8.47623))}}.drum-machine-surface-module__Z0DA8a__transport{flex:none;justify-content:flex-end;align-items:center;gap:.65rem;min-block-size:2.75rem;display:flex}.drum-machine-surface-module__Z0DA8a__playButton,.drum-machine-surface-module__Z0DA8a__clearButton,.drum-machine-surface-module__Z0DA8a__confirmClearButton,.drum-machine-surface-module__Z0DA8a__cancelClearButton,.drum-machine-surface-module__Z0DA8a__cellEditorChoice,.drum-machine-surface-module__Z0DA8a__muteButton{min-block-size:2.75rem;font:inherit;cursor:pointer;border:0;border-radius:.85rem;font-weight:680;transition:transform .13s cubic-bezier(.2,.8,.2,1),background-color .15s,box-shadow .15s}.drum-machine-surface-module__Z0DA8a__playButton,.drum-machine-surface-module__Z0DA8a__clearButton{justify-content:center;align-items:center;gap:.48rem;padding-inline:1rem;display:inline-flex}.drum-machine-surface-module__Z0DA8a__playButton{color:var(--paper-bright,white);background:var(--accent-dark,#83330d);box-shadow:0 .35rem .9rem color-mix(in oklch, var(--accent-dark,#83330d) 22%, transparent)}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__playButton{background:var(--accent-dark,lab(32.9517% 33.8357 39.3813));box-shadow:0 .35rem .9rem color-mix(in oklch, var(--accent-dark,lab(32.9517% 33.8357 39.3813)) 22%, transparent)}}.drum-machine-surface-module__Z0DA8a__clearButton,.drum-machine-surface-module__Z0DA8a__cancelClearButton{color:var(--ink,#212d37);background:color-mix(in oklch, var(--paper-deep,#ede7dc) 80%, transparent)}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__clearButton,.drum-machine-surface-module__Z0DA8a__cancelClearButton{color:var(--ink,lab(17.6216% -2.87226 -8.38296));background:color-mix(in oklch, var(--paper-deep,lab(91.9387% .585377 6.11395)) 80%, transparent)}}.drum-machine-surface-module__Z0DA8a__playButton:hover:not(:disabled),.drum-machine-surface-module__Z0DA8a__confirmClearButton:hover:not(:disabled){background:var(--accent-strong,#d75a21)}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__playButton:hover:not(:disabled),.drum-machine-surface-module__Z0DA8a__confirmClearButton:hover:not(:disabled){background:var(--accent-strong,lab(54.6103% 47.8597 55.2265))}}.drum-machine-surface-module__Z0DA8a__clearButton:hover:not(:disabled),.drum-machine-surface-module__Z0DA8a__cancelClearButton:hover:not(:disabled),.drum-machine-surface-module__Z0DA8a__cellEditorChoice:hover:not(:disabled){background:var(--accent-soft,#ffd8c3)}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__clearButton:hover:not(:disabled),.drum-machine-surface-module__Z0DA8a__cancelClearButton:hover:not(:disabled),.drum-machine-surface-module__Z0DA8a__cellEditorChoice:hover:not(:disabled){background:var(--accent-soft,lab(89.2683% 13.8752 17.9256))}}.drum-machine-surface-module__Z0DA8a__playButton:active:not(:disabled),.drum-machine-surface-module__Z0DA8a__clearButton:active:not(:disabled),.drum-machine-surface-module__Z0DA8a__confirmClearButton:active:not(:disabled),.drum-machine-surface-module__Z0DA8a__cancelClearButton:active:not(:disabled),.drum-machine-surface-module__Z0DA8a__cellEditorChoice:active:not(:disabled),.drum-machine-surface-module__Z0DA8a__muteButton:active:not(:disabled),.drum-machine-surface-module__Z0DA8a__stepCell:active:not(:disabled){transform:translateY(1px)scale(.97)}.drum-machine-surface-module__Z0DA8a__playButton:focus-visible,.drum-machine-surface-module__Z0DA8a__clearButton:focus-visible,.drum-machine-surface-module__Z0DA8a__confirmClearButton:focus-visible,.drum-machine-surface-module__Z0DA8a__cancelClearButton:focus-visible,.drum-machine-surface-module__Z0DA8a__cellEditorChoice:focus-visible,.drum-machine-surface-module__Z0DA8a__muteButton:focus-visible,.drum-machine-surface-module__Z0DA8a__stepCell:focus-visible,.drum-machine-surface-module__Z0DA8a__settings input:focus-visible,.drum-machine-surface-module__Z0DA8a__selectTrigger:focus-visible{outline:3px solid var(--accent-strong,#d75a21);outline-offset:2px}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__playButton:focus-visible,.drum-machine-surface-module__Z0DA8a__clearButton:focus-visible,.drum-machine-surface-module__Z0DA8a__confirmClearButton:focus-visible,.drum-machine-surface-module__Z0DA8a__cancelClearButton:focus-visible,.drum-machine-surface-module__Z0DA8a__cellEditorChoice:focus-visible,.drum-machine-surface-module__Z0DA8a__muteButton:focus-visible,.drum-machine-surface-module__Z0DA8a__stepCell:focus-visible,.drum-machine-surface-module__Z0DA8a__settings input:focus-visible,.drum-machine-surface-module__Z0DA8a__selectTrigger:focus-visible{outline:3px solid var(--accent-strong,lab(54.6103% 47.8597 55.2265))}}.drum-machine-surface-module__Z0DA8a__playButton:disabled,.drum-machine-surface-module__Z0DA8a__clearButton:disabled,.drum-machine-surface-module__Z0DA8a__confirmClearButton:disabled,.drum-machine-surface-module__Z0DA8a__cellEditorChoice:disabled,.drum-machine-surface-module__Z0DA8a__muteButton:disabled,.drum-machine-surface-module__Z0DA8a__stepCell:disabled,.drum-machine-surface-module__Z0DA8a__settings input:disabled{cursor:not-allowed;opacity:.5}.drum-machine-surface-module__Z0DA8a__playheadStatus{color:var(--accent-dark,#83330d);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.78rem;font-weight:720}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__playheadStatus{color:var(--accent-dark,lab(32.9517% 33.8357 39.3813))}}.drum-machine-surface-module__Z0DA8a__transportStatus{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;padding:0;position:absolute;overflow:hidden}.drum-machine-surface-module__Z0DA8a__startingIcon{animation:.9s linear infinite drum-machine-surface-module__Z0DA8a__drum-machine-spin}@keyframes drum-machine-surface-module__Z0DA8a__drum-machine-spin{to{transform:rotate(1turn)}}.drum-machine-surface-module__Z0DA8a__clearArea{align-items:center;display:flex}.drum-machine-surface-module__Z0DA8a__clearConfirmation{background:var(--paper-bright,white);box-shadow:inset 0 0 0 1px var(--line,#c6cfd7);border-radius:1rem;grid-template-columns:minmax(8rem,1fr) auto auto;align-items:center;gap:.45rem;padding:.35rem;display:grid}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__clearConfirmation{box-shadow:inset 0 0 0 1px var(--line,lab(82.6039% -2.02116 -5.15384))}}.drum-machine-surface-module__Z0DA8a__clearConfirmation>span{padding-inline:.45rem;font-size:.75rem;line-height:1.25}.drum-machine-surface-module__Z0DA8a__confirmClearButton,.drum-machine-surface-module__Z0DA8a__cancelClearButton{min-block-size:2.75rem;padding-inline:.7rem;font-size:.75rem}.drum-machine-surface-module__Z0DA8a__confirmClearButton{color:#fff;background:var(--accent-dark,#83330d)}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__confirmClearButton{background:var(--accent-dark,lab(32.9517% 33.8357 39.3813))}}.drum-machine-surface-module__Z0DA8a__audioError{color:var(--error,#c21919);background:color-mix(in oklch, var(--error,#c21919) 8%, white);border-inline-start:.25rem solid;border-radius:.7rem;margin:0;padding:.75rem .9rem;font-size:.86rem}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__audioError{color:var(--error,lab(42.332% 62.8445 47.7885));background:color-mix(in oklch, var(--error,lab(42.332% 62.8445 47.7885)) 8%, white)}}.drum-machine-surface-module__Z0DA8a__settings{background:color-mix(in oklch, var(--paper-deep,#ede7dc) 72%, transparent);box-shadow:inset 0 0 0 1px color-mix(in oklch, var(--line,#c6cfd7) 72%, transparent);border-radius:1rem;grid-template-columns:.78fr 1.25fr repeat(3,minmax(8rem,1fr));align-items:end;gap:.65rem;padding:.75rem;display:grid}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__settings{background:color-mix(in oklch, var(--paper-deep,lab(91.9387% .585377 6.11395)) 72%, transparent);box-shadow:inset 0 0 0 1px color-mix(in oklch, var(--line,lab(82.6039% -2.02116 -5.15384)) 72%, transparent)}}.drum-machine-surface-module__Z0DA8a__tempoControl,.drum-machine-surface-module__Z0DA8a__swingControl,.drum-machine-surface-module__Z0DA8a__selectControl{min-inline-size:0;color:var(--ink-muted,#525f6b);letter-spacing:.03em;gap:.38rem;font-size:.75rem;font-weight:720;display:grid}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__tempoControl,.drum-machine-surface-module__Z0DA8a__swingControl,.drum-machine-surface-module__Z0DA8a__selectControl{color:var(--ink-muted,lab(39.6742% -3.12503 -8.47623))}}.drum-machine-surface-module__Z0DA8a__tempoControl input,.drum-machine-surface-module__Z0DA8a__selectTrigger{min-block-size:2.75rem;inline-size:100%;min-inline-size:0;color:var(--ink,#212d37);background:var(--paper-bright,white);box-shadow:inset 0 0 0 1px var(--line,#c6cfd7);border:0;border-radius:.75rem;overflow:hidden}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__tempoControl input,.drum-machine-surface-module__Z0DA8a__selectTrigger{color:var(--ink,lab(17.6216% -2.87226 -8.38296));box-shadow:inset 0 0 0 1px var(--line,lab(82.6039% -2.02116 -5.15384))}}.drum-machine-surface-module__Z0DA8a__selectTrigger [data-slot=select-value]{text-overflow:clip;white-space:normal;line-height:1.05;display:block;overflow:visible}.drum-machine-surface-module__Z0DA8a__tempoControl input{font-variant-numeric:tabular-nums;padding-inline:.8rem;font-size:1rem;font-weight:720}.drum-machine-surface-module__Z0DA8a__selectTrigger{letter-spacing:0;justify-content:space-between;padding-inline:.8rem;font-size:.84rem}.drum-machine-surface-module__Z0DA8a__swingControl>span{justify-content:space-between;gap:.5rem;display:flex}.drum-machine-surface-module__Z0DA8a__swingControl output{color:var(--accent-dark,#83330d);font-variant-numeric:tabular-nums}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__swingControl output{color:var(--accent-dark,lab(32.9517% 33.8357 39.3813))}}.drum-machine-surface-module__Z0DA8a__swingControl input{min-block-size:2.75rem;inline-size:100%;min-inline-size:0;accent-color:var(--accent-strong,oklch(62% .17 42))}.drum-machine-surface-module__Z0DA8a__patternPanel{background:color-mix(in oklch, var(--ink,#212d37) 94%, black);min-inline-size:0;box-shadow:inset 0 1px 0 #ffffff1a, 0 .7rem 1.5rem color-mix(in oklch, var(--ink,#212d37) 11%, transparent);border-radius:1.25rem;gap:.75rem;padding:.65rem;display:grid}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__patternPanel{background:color-mix(in oklch, var(--ink,lab(17.6216% -2.87226 -8.38296)) 94%, black);box-shadow:inset 0 1px 0 lab(100% 0 0/.1), 0 .7rem 1.5rem color-mix(in oklch, var(--ink,lab(17.6216% -2.87226 -8.38296)) 11%, transparent)}}.drum-machine-surface-module__Z0DA8a__gridViewport{overscroll-behavior-inline:contain;scrollbar-color:color-mix(in oklch, var(--accent-strong,oklch(62% .17 42)) 75%, white) color-mix(in oklch, var(--ink,oklch(29% .025 245)) 88%, white);scrollbar-width:thin;max-inline-size:100%;overflow:auto}.drum-machine-surface-module__Z0DA8a__sequenceGrid{--drum-row-label-track:minmax(8.75rem, 10rem);gap:.28rem;inline-size:max-content;min-inline-size:100%;padding-block-end:.2rem;display:grid}.drum-machine-surface-module__Z0DA8a__headerRow,.drum-machine-surface-module__Z0DA8a__gridRow{align-items:center;gap:.28rem;display:grid}.drum-machine-surface-module__Z0DA8a__headerRow{z-index:4;background:color-mix(in oklch, var(--ink,#212d37) 94%, black);padding-block-end:.2rem;position:sticky;inset-block-start:0}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__headerRow{background:color-mix(in oklch, var(--ink,lab(17.6216% -2.87226 -8.38296)) 94%, black)}}.drum-machine-surface-module__Z0DA8a__gridCorner,.drum-machine-surface-module__Z0DA8a__rowHeader{z-index:3;position:sticky;inset-inline-start:0}.drum-machine-surface-module__Z0DA8a__gridCorner{background:color-mix(in oklch, var(--ink,#212d37) 94%, black);block-size:1.55rem}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__gridCorner{background:color-mix(in oklch, var(--ink,lab(17.6216% -2.87226 -8.38296)) 94%, black)}}.drum-machine-surface-module__Z0DA8a__stepHeader{color:color-mix(in oklch, white 62%, var(--accent-soft,#ffd8c3));font-variant-numeric:tabular-nums;text-align:center;text-overflow:clip;white-space:nowrap;font-size:.75rem;font-weight:680;line-height:1.55rem;overflow:hidden}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__stepHeader{color:color-mix(in oklch, white 62%, var(--accent-soft,lab(89.2683% 13.8752 17.9256)))}}.drum-machine-surface-module__Z0DA8a__rowHeader{background:color-mix(in oklch, var(--ink,#212d37) 94%, black);padding-inline-end:.25rem}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__rowHeader{background:color-mix(in oklch, var(--ink,lab(17.6216% -2.87226 -8.38296)) 94%, black)}}.drum-machine-surface-module__Z0DA8a__muteButton{inline-size:100%;color:color-mix(in oklch, white 88%, var(--accent-soft,#ffd8c3));background:color-mix(in oklch, var(--ink,#212d37) 88%, white);text-align:start;grid-template-columns:1.3rem minmax(0,1fr);align-items:center;padding-inline:.7rem;display:grid;overflow:hidden}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__muteButton{color:color-mix(in oklch, white 88%, var(--accent-soft,lab(89.2683% 13.8752 17.9256)));background:color-mix(in oklch, var(--ink,lab(17.6216% -2.87226 -8.38296)) 88%, white)}}.drum-machine-surface-module__Z0DA8a__muteButton span{overflow-wrap:anywhere;white-space:normal;font-size:.75rem;line-height:1.08}.drum-machine-surface-module__Z0DA8a__muteButton[aria-pressed=true]{color:color-mix(in oklch, white 46%, var(--ink,#212d37));text-decoration:line-through}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__muteButton[aria-pressed=true]{color:color-mix(in oklch, white 46%, var(--ink,lab(17.6216% -2.87226 -8.38296)))}}.drum-machine-surface-module__Z0DA8a__stepCell{color:#fff;background:color-mix(in oklch, var(--ink,#212d37) 86%, white);cursor:pointer;border:0;border-radius:.66rem;place-items:center;block-size:2.75rem;inline-size:100%;min-inline-size:2.75rem;padding:0;transition:transform .12s cubic-bezier(.2,.8,.2,1),background-color .13s,box-shadow .13s;display:grid;box-shadow:inset 0 1px #ffffff12;box-shadow:inset 0 1px lab(100% 0 0/.07)}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__stepCell{background:color-mix(in oklch, var(--ink,lab(17.6216% -2.87226 -8.38296)) 86%, white)}}.drum-machine-surface-module__Z0DA8a__stepCell[data-beat-start=true]{background:color-mix(in oklch, var(--ink,#212d37) 78%, white)}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__stepCell[data-beat-start=true]{background:color-mix(in oklch, var(--ink,lab(17.6216% -2.87226 -8.38296)) 78%, white)}}.drum-machine-surface-module__Z0DA8a__stepCell:hover:not(:disabled){background:color-mix(in oklch, var(--accent-dark,#83330d) 52%, var(--ink,#212d37))}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__stepCell:hover:not(:disabled){background:color-mix(in oklch, var(--accent-dark,lab(32.9517% 33.8357 39.3813)) 52%, var(--ink,lab(17.6216% -2.87226 -8.38296)))}}.drum-machine-surface-module__Z0DA8a__stepCell[data-selected=true]{box-shadow:inset 0 0 0 2px var(--accent-soft,#ffd8c3), 0 0 0 1px var(--accent-strong,#d75a21)}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__stepCell[data-selected=true]{box-shadow:inset 0 0 0 2px var(--accent-soft,lab(89.2683% 13.8752 17.9256)), 0 0 0 1px var(--accent-strong,lab(54.6103% 47.8597 55.2265))}}.drum-machine-surface-module__Z0DA8a__stepCell[data-playhead=true]{background:color-mix(in oklch, var(--accent-dark,#83330d) 74%, var(--ink,#212d37));box-shadow:inset 0 0 0 2px var(--accent-strong,#d75a21)}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__stepCell[data-playhead=true]{background:color-mix(in oklch, var(--accent-dark,lab(32.9517% 33.8357 39.3813)) 74%, var(--ink,lab(17.6216% -2.87226 -8.38296)));box-shadow:inset 0 0 0 2px var(--accent-strong,lab(54.6103% 47.8597 55.2265))}}.drum-machine-surface-module__Z0DA8a__stepMark,.drum-machine-surface-module__Z0DA8a__choiceMark{box-sizing:border-box;opacity:.72;background:#ffffff52;background:lab(100% 0 0/.32);border-radius:999px;block-size:1.12rem;inline-size:1.12rem;transition:transform .14s cubic-bezier(.2,.8,.2,1),background-color .14s,border-color .14s,opacity .14s;display:block;position:relative;transform:scale(.3)}.drum-machine-surface-module__Z0DA8a__stepCell[data-step=primary] .drum-machine-surface-module__Z0DA8a__stepMark,.drum-machine-surface-module__Z0DA8a__choiceMark[data-step=primary]{background:var(--accent-strong,#d75a21);opacity:1;box-shadow:inset 0 1px 0 #ffffff61, 0 .2rem .5rem color-mix(in oklch, var(--accent-strong,#d75a21) 34%, transparent);transform:scale(1)}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__stepCell[data-step=primary] .drum-machine-surface-module__Z0DA8a__stepMark,.drum-machine-surface-module__Z0DA8a__choiceMark[data-step=primary]{background:var(--accent-strong,lab(54.6103% 47.8597 55.2265));box-shadow:inset 0 1px 0 lab(100% 0 0/.38), 0 .2rem .5rem color-mix(in oklch, var(--accent-strong,lab(54.6103% 47.8597 55.2265)) 34%, transparent)}}.drum-machine-surface-module__Z0DA8a__stepCell[data-step=alternate] .drum-machine-surface-module__Z0DA8a__stepMark,.drum-machine-surface-module__Z0DA8a__choiceMark[data-step=alternate]{border:.18rem solid var(--accent-soft,#ffd8c3);opacity:1;background:0 0;transform:scale(1)}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__stepCell[data-step=alternate] .drum-machine-surface-module__Z0DA8a__stepMark,.drum-machine-surface-module__Z0DA8a__choiceMark[data-step=alternate]{border:.18rem solid var(--accent-soft,lab(89.2683% 13.8752 17.9256))}}.drum-machine-surface-module__Z0DA8a__stepCell[data-step=alternate] .drum-machine-surface-module__Z0DA8a__stepMark:after,.drum-machine-surface-module__Z0DA8a__choiceMark[data-step=alternate]:after{background:var(--accent-strong,#d75a21);content:"";border-radius:99px;block-size:.13rem;inline-size:.42rem;position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%)rotate(-35deg)}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__stepCell[data-step=alternate] .drum-machine-surface-module__Z0DA8a__stepMark:after,.drum-machine-surface-module__Z0DA8a__choiceMark[data-step=alternate]:after{background:var(--accent-strong,lab(54.6103% 47.8597 55.2265))}}.drum-machine-surface-module__Z0DA8a__cellEditor{color:#fff;background:color-mix(in oklch, var(--ink,#212d37) 84%, white);border:0;border-radius:.9rem;align-items:center;gap:.65rem;min-inline-size:0;margin:0;padding:.55rem;display:flex}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__cellEditor{background:color-mix(in oklch, var(--ink,lab(17.6216% -2.87226 -8.38296)) 84%, white)}}.drum-machine-surface-module__Z0DA8a__cellEditor legend{float:inline-start;max-inline-size:15rem;color:color-mix(in oklch, white 74%, var(--accent-soft,#ffd8c3));padding-inline:.45rem;font-size:.72rem;font-weight:670}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__cellEditor legend{color:color-mix(in oklch, white 74%, var(--accent-soft,lab(89.2683% 13.8752 17.9256)))}}.drum-machine-surface-module__Z0DA8a__cellEditorChoices{flex:auto;justify-content:flex-end;gap:.4rem;display:flex}.drum-machine-surface-module__Z0DA8a__cellEditorChoice{color:#fff;background:color-mix(in oklch, var(--ink,#212d37) 70%, white);align-items:center;gap:.42rem;min-inline-size:5.5rem;padding-inline:.7rem;font-size:.75rem;display:inline-flex}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__cellEditorChoice{background:color-mix(in oklch, var(--ink,lab(17.6216% -2.87226 -8.38296)) 70%, white)}}.drum-machine-surface-module__Z0DA8a__cellEditorChoice[data-active=true]{color:var(--ink,#212d37);background:var(--accent-soft,#ffd8c3)}@supports (color:lab(0% 0 0)){.drum-machine-surface-module__Z0DA8a__cellEditorChoice[data-active=true]{color:var(--ink,lab(17.6216% -2.87226 -8.38296));background:var(--accent-soft,lab(89.2683% 13.8752 17.9256))}}.drum-machine-surface-module__Z0DA8a__cellEditorChoice .drum-machine-surface-module__Z0DA8a__choiceMark{flex:none}@media (max-width:760px){.drum-machine-surface-module__Z0DA8a__heading{gap:1rem;display:grid}.drum-machine-surface-module__Z0DA8a__transport{flex-wrap:wrap;justify-content:flex-start}.drum-machine-surface-module__Z0DA8a__settings{grid-template-columns:repeat(2,minmax(0,1fr))}.drum-machine-surface-module__Z0DA8a__selectControl:last-child{grid-column:1/-1}.drum-machine-surface-module__Z0DA8a__cellEditor{display:grid}.drum-machine-surface-module__Z0DA8a__cellEditorChoices{grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.drum-machine-surface-module__Z0DA8a__cellEditorChoice{justify-content:center;min-inline-size:0}}@media (max-width:390px){.drum-machine-surface-module__Z0DA8a__surface{border-radius:1.25rem;gap:.8rem;padding:.85rem}.drum-machine-surface-module__Z0DA8a__settings{gap:.5rem;padding:.6rem}.drum-machine-surface-module__Z0DA8a__sequenceGrid{--drum-row-label-track:8.5rem}.drum-machine-surface-module__Z0DA8a__clearConfirmation{grid-template-columns:repeat(2,auto)}.drum-machine-surface-module__Z0DA8a__clearConfirmation>span{grid-column:1/-1}.drum-machine-surface-module__Z0DA8a__cellEditorChoices{gap:.3rem}.drum-machine-surface-module__Z0DA8a__cellEditorChoice{padding-inline:.35rem}}@media (min-width:500px) and (max-height:400px){.drum-machine-surface-module__Z0DA8a__surface{border-radius:1rem;gap:.4rem;padding:.4rem}.drum-machine-surface-module__Z0DA8a__heading{display:block}.drum-machine-surface-module__Z0DA8a__heading>div:first-child{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;padding:0;position:absolute;overflow:hidden}.drum-machine-surface-module__Z0DA8a__transport{flex-wrap:nowrap;justify-content:flex-start}.drum-machine-surface-module__Z0DA8a__playButton,.drum-machine-surface-module__Z0DA8a__clearButton{padding-inline:.75rem;font-size:.8rem}.drum-machine-surface-module__Z0DA8a__playheadStatus{font-size:.75rem}.drum-machine-surface-module__Z0DA8a__settings{grid-template-columns:4rem 6.5rem 6rem 5.5rem minmax(7.5rem,1fr);gap:.4rem;padding:.2rem .45rem}.drum-machine-surface-module__Z0DA8a__selectControl:last-child{grid-column:auto}.drum-machine-surface-module__Z0DA8a__selectTrigger{padding-inline:.35rem;font-size:.76rem}.drum-machine-surface-module__Z0DA8a__selectControl>span{overflow-wrap:anywhere;-webkit-hyphens:auto;hyphens:auto;max-inline-size:100%;line-height:1.1}.drum-machine-surface-module__Z0DA8a__swingControl>span{gap:.2rem}.drum-machine-surface-module__Z0DA8a__patternPanel{gap:.45rem;padding:.45rem}.drum-machine-surface-module__Z0DA8a__patternPanel[data-editor-open=true]{grid-template-columns:minmax(0,1fr) 12rem;align-items:stretch}.drum-machine-surface-module__Z0DA8a__gridViewport{max-block-size:9.2rem}.drum-machine-surface-module__Z0DA8a__cellEditor{align-content:center;min-block-size:9.2rem;padding:.35rem;display:grid}.drum-machine-surface-module__Z0DA8a__cellEditorChoices{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.drum-machine-surface-module__Z0DA8a__cellEditorChoice:last-child{grid-column:1/-1}.drum-machine-surface-module__Z0DA8a__cellEditorChoice{overflow-wrap:normal;min-inline-size:0;padding-inline:.25rem;font-size:.75rem;line-height:1.05}}@media (prefers-reduced-motion:reduce){.drum-machine-surface-module__Z0DA8a__playButton,.drum-machine-surface-module__Z0DA8a__clearButton,.drum-machine-surface-module__Z0DA8a__confirmClearButton,.drum-machine-surface-module__Z0DA8a__cancelClearButton,.drum-machine-surface-module__Z0DA8a__cellEditorChoice,.drum-machine-surface-module__Z0DA8a__muteButton,.drum-machine-surface-module__Z0DA8a__stepCell,.drum-machine-surface-module__Z0DA8a__stepMark,.drum-machine-surface-module__Z0DA8a__choiceMark{transition-duration:.01ms}.drum-machine-surface-module__Z0DA8a__startingIcon{animation:none}.drum-machine-surface-module__Z0DA8a__playButton:active:not(:disabled),.drum-machine-surface-module__Z0DA8a__clearButton:active:not(:disabled),.drum-machine-surface-module__Z0DA8a__confirmClearButton:active:not(:disabled),.drum-machine-surface-module__Z0DA8a__cancelClearButton:active:not(:disabled),.drum-machine-surface-module__Z0DA8a__cellEditorChoice:active:not(:disabled),.drum-machine-surface-module__Z0DA8a__muteButton:active:not(:disabled),.drum-machine-surface-module__Z0DA8a__stepCell:active:not(:disabled){transform:none}}
.drum-machine-share-module__x1UcbW__shareControl{gap:.35rem;min-inline-size:0;display:grid}.drum-machine-share-module__x1UcbW__shareButton{min-block-size:2.75rem;color:var(--ink,#212d37);background:color-mix(in oklch, var(--paper-deep,#ede7dc) 80%, transparent);font:inherit;cursor:pointer;border:0;border-radius:.85rem;justify-content:center;align-items:center;gap:.48rem;padding-inline:1rem;font-weight:680;transition:transform .13s cubic-bezier(.2,.8,.2,1),background-color .15s;display:inline-flex}@supports (color:lab(0% 0 0)){.drum-machine-share-module__x1UcbW__shareButton{color:var(--ink,lab(17.6216% -2.87226 -8.38296));background:color-mix(in oklch, var(--paper-deep,lab(91.9387% .585377 6.11395)) 80%, transparent)}}.drum-machine-share-module__x1UcbW__shareButton svg{flex:none;block-size:1.1rem;inline-size:1.1rem}.drum-machine-share-module__x1UcbW__shareButton:hover{background:var(--accent-soft,#ffd8c3)}@supports (color:lab(0% 0 0)){.drum-machine-share-module__x1UcbW__shareButton:hover{background:var(--accent-soft,lab(89.2683% 13.8752 17.9256))}}.drum-machine-share-module__x1UcbW__shareButton:active{transform:translateY(1px)scale(.97)}.drum-machine-share-module__x1UcbW__shareButton:focus-visible{outline:3px solid var(--accent-strong,#d75a21);outline-offset:2px}@supports (color:lab(0% 0 0)){.drum-machine-share-module__x1UcbW__shareButton:focus-visible{outline:3px solid var(--accent-strong,lab(54.6103% 47.8597 55.2265))}}.drum-machine-share-module__x1UcbW__shareButton[data-copied=true]{color:var(--paper-bright,white);background:var(--accent-dark,#83330d)}@supports (color:lab(0% 0 0)){.drum-machine-share-module__x1UcbW__shareButton[data-copied=true]{background:var(--accent-dark,lab(32.9517% 33.8357 39.3813))}}.drum-machine-share-module__x1UcbW__shareStatus{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;padding:0;position:absolute;overflow:hidden}.drum-machine-share-module__x1UcbW__clipboardFallback{inline-size:min(20rem,100%);color:var(--error,#c21919);text-align:start;gap:.3rem;font-size:.74rem;font-weight:650;display:grid}@supports (color:lab(0% 0 0)){.drum-machine-share-module__x1UcbW__clipboardFallback{color:var(--error,lab(42.332% 62.8445 47.7885))}}.drum-machine-share-module__x1UcbW__clipboardFallback textarea{inline-size:100%;color:var(--ink,#212d37);background:var(--paper-bright,white);box-shadow:inset 0 0 0 1px var(--line,#c6cfd7);font:inherit;resize:none;border:0;border-radius:.6rem;padding:.4rem .55rem;font-size:.75rem}@supports (color:lab(0% 0 0)){.drum-machine-share-module__x1UcbW__clipboardFallback textarea{color:var(--ink,lab(17.6216% -2.87226 -8.38296));box-shadow:inset 0 0 0 1px var(--line,lab(82.6039% -2.02116 -5.15384))}}@media (max-width:760px){.drum-machine-share-module__x1UcbW__shareControl{flex:auto}.drum-machine-share-module__x1UcbW__shareButton{inline-size:100%}}@media (min-width:500px) and (max-height:400px){.drum-machine-share-module__x1UcbW__shareButton{padding-inline:.75rem;font-size:.8rem}}@media (prefers-reduced-motion:reduce){.drum-machine-share-module__x1UcbW__shareButton{transition-duration:.01ms}.drum-machine-share-module__x1UcbW__shareButton:active{transform:none}}
.drum-machine-experience-module__qdIeKW__fallback{border:1px solid color-mix(in oklch, var(--border) 78%, transparent);background:linear-gradient(135deg, color-mix(in oklch, var(--accent) 9%, transparent), transparent 42%), var(--card);border-radius:1.5rem;min-block-size:38rem;padding:clamp(1rem,2.5vw,2rem)}.drum-machine-experience-module__qdIeKW__fallbackEyebrow{color:var(--muted-foreground);letter-spacing:.09em;text-transform:uppercase;margin:0 0 .45rem;font-size:.75rem;font-weight:700}.drum-machine-experience-module__qdIeKW__fallback h2{color:var(--foreground);letter-spacing:-.035em;margin:0;font-size:clamp(1.5rem,3vw,2.25rem)}.drum-machine-experience-module__qdIeKW__fallbackDescription{max-inline-size:42rem;color:var(--muted-foreground);margin:.65rem 0 0;line-height:1.55}.drum-machine-experience-module__qdIeKW__fallbackPanel{background:repeating-linear-gradient(90deg, transparent 0 2.6rem, color-mix(in oklch, var(--border) 58%, transparent) 2.6rem 2.66rem), color-mix(in oklch, var(--ink-muted) 68%, transparent);border-radius:1.1rem;min-block-size:25rem;margin-block-start:2rem}@media (max-width:390px){.drum-machine-experience-module__qdIeKW__fallback{border-radius:1.1rem;min-block-size:34rem}}@media (max-height:360px) and (orientation:landscape){.drum-machine-experience-module__qdIeKW__fallback{min-block-size:19rem;padding:.75rem}.drum-machine-experience-module__qdIeKW__fallbackDescription{display:none}.drum-machine-experience-module__qdIeKW__fallbackPanel{min-block-size:12rem;margin-block-start:.75rem}}
.drum-machine-page-content-module__IF3G3W__page{min-width:0}.drum-machine-page-content-module__IF3G3W__article{gap:clamp(2.5rem,6vw,5rem);width:100%;max-width:84rem;margin-inline:auto;padding:clamp(1.25rem,3vw,3rem) clamp(1rem,4vw,4rem) clamp(4rem,8vw,7rem);display:grid}.drum-machine-page-content-module__IF3G3W__toolLead{gap:clamp(.9rem,2vw,1.4rem);display:grid}.drum-machine-page-content-module__IF3G3W__hero{gap:.6rem;max-width:68rem;display:grid}.drum-machine-page-content-module__IF3G3W__hero h1{letter-spacing:-.05em;max-width:22ch;margin:0;font-size:clamp(2.2rem,4vw,3.1rem);font-weight:640;line-height:1}.drum-machine-page-content-module__IF3G3W__lede{max-width:58ch;color:var(--ink-soft);margin:0;font-size:clamp(1.05rem,2vw,1.3rem)}.drum-machine-page-content-module__IF3G3W__instrument{min-width:0;scroll-margin-block-start:2rem}.drum-machine-page-content-module__IF3G3W__guide{gap:clamp(3.5rem,7vw,6rem);display:grid}.drum-machine-page-content-module__IF3G3W__guide section>h2,.drum-machine-page-content-module__IF3G3W__sources>h2,.drum-machine-page-content-module__IF3G3W__related>h2{letter-spacing:-.045em;max-width:24ch;margin:0;font-size:clamp(1.8rem,3.6vw,3rem);font-weight:630;line-height:1.06}.drum-machine-page-content-module__IF3G3W__guide section>p,.drum-machine-page-content-module__IF3G3W__sources>p,.drum-machine-page-content-module__IF3G3W__related>p{max-width:66ch;color:var(--ink-soft);margin-block-start:1rem}.drum-machine-page-content-module__IF3G3W__guide section>ol{background:var(--line);border:1px solid var(--line);grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;max-width:62rem;margin-block-start:2rem;list-style:none;display:grid}.drum-machine-page-content-module__IF3G3W__guide section>ol li{min-height:8rem;color:var(--ink-soft);background:var(--paper-bright);padding:1.35rem}.drum-machine-page-content-module__IF3G3W__guide table{border-collapse:collapse;text-align:start;width:100%;margin-block-start:2rem}.drum-machine-page-content-module__IF3G3W__guide thead th{border-block-end:1px solid var(--line);text-align:start;padding:.75rem 1.25rem .75rem 0;font-size:.85rem;font-weight:700}.drum-machine-page-content-module__IF3G3W__guide tbody th{text-align:start;vertical-align:baseline;width:30%;padding:1rem 1.25rem 1rem 0;font-weight:700}.drum-machine-page-content-module__IF3G3W__guide tbody td{color:var(--ink-soft);vertical-align:baseline;padding-block:1rem;font-size:.95rem}.drum-machine-page-content-module__IF3G3W__guide tbody tr{border-block-start:1px solid var(--line)}.drum-machine-page-content-module__IF3G3W__twoColumn{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(2rem,5vw,5rem);display:grid}.drum-machine-page-content-module__IF3G3W__faqGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 2rem;margin-block-start:2rem;display:grid}.drum-machine-page-content-module__IF3G3W__faqGrid details{border-block-start:1px solid var(--line);padding-block:1rem}.drum-machine-page-content-module__IF3G3W__faqGrid summary{cursor:pointer;align-items:center;min-height:2.75rem;font-weight:700;display:flex}.drum-machine-page-content-module__IF3G3W__faqGrid details p{max-width:60ch;color:var(--ink-soft);padding-block-end:.75rem}.drum-machine-page-content-module__IF3G3W__sources{border-block-start:1px solid var(--line);padding-block-start:2rem}.drum-machine-page-content-module__IF3G3W__provenance{color:var(--ink-soft);flex-wrap:wrap;gap:.25rem 1.5rem;margin-block-start:1.25rem;font-size:.85rem;display:flex}.drum-machine-page-content-module__IF3G3W__sources>ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem;margin-block-start:2rem;list-style:none;display:grid}.drum-machine-page-content-module__IF3G3W__sources li{border-block-start:1px solid var(--line);padding-block-start:1rem}.drum-machine-page-content-module__IF3G3W__sources a,.drum-machine-page-content-module__IF3G3W__related a{min-height:2.75rem;color:var(--accent-dark);align-items:center;font-weight:700;text-decoration:underline;display:inline-flex}.drum-machine-page-content-module__IF3G3W__sources li p{color:var(--ink-soft);margin-block-start:.45rem;font-size:.85rem}.drum-machine-page-content-module__IF3G3W__related{background:color-mix(in oklch, var(--accent-soft) 36%, var(--paper-bright));border-radius:1.2rem;padding:clamp(1.5rem,4vw,3rem)}.drum-machine-page-content-module__IF3G3W__related>div{flex-wrap:wrap;gap:.75rem 2rem;margin-block-start:1.2rem;display:flex}@media (max-width:44rem){.drum-machine-page-content-module__IF3G3W__guide section>ol,.drum-machine-page-content-module__IF3G3W__twoColumn,.drum-machine-page-content-module__IF3G3W__faqGrid,.drum-machine-page-content-module__IF3G3W__sources>ul{grid-template-columns:minmax(0,1fr)}.drum-machine-page-content-module__IF3G3W__guide tbody th{width:40%}}@media (max-width:22rem){.drum-machine-page-content-module__IF3G3W__article{gap:1.75rem;padding-block-start:.8rem}:is(.drum-machine-page-content-module__IF3G3W__hero .breadcrumbs,.drum-machine-page-content-module__IF3G3W__hero .eyebrow){display:none}.drum-machine-page-content-module__IF3G3W__hero h1{font-size:2.2rem}.drum-machine-page-content-module__IF3G3W__lede{font-size:1rem}.drum-machine-page-content-module__IF3G3W__guide tbody th,.drum-machine-page-content-module__IF3G3W__guide tbody td{width:100%;padding-inline-end:0;display:block}.drum-machine-page-content-module__IF3G3W__guide tbody td{padding-block-start:.25rem}}@media (max-height:26.25rem) and (orientation:landscape){.drum-machine-page-content-module__IF3G3W__article{gap:0;padding:0}.drum-machine-page-content-module__IF3G3W__toolLead{gap:0}.drum-machine-page-content-module__IF3G3W__hero,.drum-machine-page-content-module__IF3G3W__lede{display:none}.drum-machine-page-content-module__IF3G3W__guide{padding:2rem max(1rem, env(safe-area-inset-right)) 4rem max(1rem, env(safe-area-inset-left))}}