.st-door{display:none}@media (min-width:1080px){.st-door{box-sizing:border-box;width:calc(var(--mat-w) * var(--px) - 8px);min-height:56px;margin:calc(var(--mat-below) * var(--px) + 12px) calc(var(--mat-right) * var(--px) * -1 + 4px) 0 0;border:1px solid rgb(var(--c-navy-4,58 70 144));background-color:rgb(var(--c-navy-1,20 26 68));color:rgb(var(--fg,247 246 242));grid-area:2/1/auto/-1;justify-self:end;align-items:center;gap:16px;padding:10px 20px;text-decoration:none;display:flex}.st-door:hover{background-color:rgb(var(--c-navy-2,30 38 96));border-color:rgb(var(--fg,247 246 242))}.st-door:focus-visible{outline:2px solid rgb(var(--fg,247 246 242));outline-offset:2px}}.st-door-t{font-family:var(--font-ui);font-synthesis:none;letter-spacing:-.01em;font-size:22px;line-height:1}.st-door-s{font-family:var(--font-plex-mono), ui-monospace, monospace;letter-spacing:.06em;text-transform:uppercase;color:rgb(var(--muted,154 166 255));flex:1;font-size:12px;line-height:1.2}.st-door-a{flex:none}.st-sec{--st-bg:rgb(var(--c-navy-1,20 26 68));--st-night:rgb(var(--c-navy,10 15 46));--st-s2:rgb(var(--c-navy-2,30 38 96));--st-s3:rgb(var(--c-navy-3,44 53 112));--st-line:rgb(var(--c-navy-4,58 70 144));--st-lilac:rgb(var(--c-lilac,154 166 255));--st-electric:rgb(var(--c-electric,104 124 255));--st-fg:rgb(var(--fg,247 246 242));--st-hot:rgb(var(--hot,217 86 31));--st-warm:rgb(var(--accent,242 146 86));box-sizing:border-box;border:1px solid var(--st-line);border-top:3px solid var(--st-fg);background-color:var(--st-bg);color:var(--st-fg);font-family:var(--font-inter), system-ui, sans-serif;padding:24px 32px 16px;font-size:16px;line-height:1.3}.st-sec button{color:inherit;font-family:inherit}.st-sec button:focus-visible,.st-sec [tabindex="0"]:focus-visible{outline:2px solid var(--st-fg);outline-offset:2px}.st-sec :is(.st-pad,.st-note):focus-visible{outline-offset:-2px;outline-color:var(--st-lilac)}.st-bar{align-items:center;gap:14px;margin-top:18px;display:flex}.st-tr{display:flex}.st-ib{box-sizing:border-box;border:1px solid var(--st-line);cursor:pointer;background:0 0;justify-content:center;align-items:center;width:56px;height:44px;margin:0;padding:0;display:flex;position:relative}.st-ib+.st-ib{border-left:0}.st-ib[data-on]{background-color:var(--st-fg);border-color:var(--st-fg);color:var(--st-night)}.st-rec:after{content:"";pointer-events:none;border:2px solid #0000;position:absolute;inset:4px}.st-rec[aria-pressed=true]:after{border-color:var(--st-hot)}.st-vr{background-color:var(--st-line);width:1px;height:30px;margin:0 4px}.st-vr-s{height:26px;margin:0}.st-lbl{letter-spacing:.08em;text-transform:uppercase;font-size:13px;font-weight:500}.st-lbl-x{margin-left:10px}.st-grow{flex:1}.st-tempo{box-sizing:border-box;border:1px solid var(--st-line);cursor:ns-resize;-webkit-user-select:none;user-select:none;touch-action:none;align-items:center;gap:10px;height:44px;padding:0 14px 0 16px;display:flex}.st-tempo[data-drag]{border-color:var(--st-hot)}.st-tempo-n{text-align:right;min-width:40px;font-family:var(--font-ui);font-synthesis:none;font-variant-numeric:tabular-nums;font-size:22px;font-weight:400;line-height:1}.st-tempo-u{letter-spacing:.06em;font-size:13px;font-weight:500}.st-tb{box-sizing:border-box;border:1px solid var(--st-line);cursor:pointer;background:0 0;height:44px;margin:0;padding:0 22px;font-size:17px;font-weight:500}.st-tb-x{min-width:82px;padding:0 18px;font-weight:600}.st-tb:disabled{cursor:default;opacity:.6}.st-rule{background-color:var(--st-line);height:1px;margin:20px 0 18px}.st-rule-2{margin:22px 0 18px}.st-rule-3{margin:18px 0 14px}.st-sect{padding-left:1px}.st-sh{justify-content:space-between;align-items:center;gap:16px;display:flex}.st-sh-r{align-items:center;gap:14px;display:flex}.st-h3{font-family:var(--font-ui);font-synthesis:none;letter-spacing:-.01em;margin:0;font-size:24px;font-weight:400;line-height:1}.st-info{font-size:17px}.st-seg{display:flex}.st-seg button{box-sizing:border-box;border:1px solid var(--st-line);cursor:pointer;background:0 0;width:48px;height:36px;margin:0 0 0 -1px;padding:0;font-size:16px;font-weight:500}.st-seg button:first-child{margin-left:0}.st-seg button[aria-checked=true]{background-color:var(--st-fg);border-color:var(--st-fg);color:var(--st-night)}.st-steps{margin-top:2px;display:flex}.st-names{flex-direction:column;flex:none;gap:6px;padding-top:34px;display:flex}.st-name{box-sizing:border-box;background-color:var(--st-s2);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;border:0;justify-content:space-between;align-items:center;height:30px;margin:0;padding:0 14px 0 16px;font-size:15px;font-weight:500;display:flex}.st-name:hover{background-color:var(--st-s3)}.st-drum,.st-roll-box{scrollbar-width:none}.st-drum::-webkit-scrollbar{display:none}.st-roll-box::-webkit-scrollbar{display:none}.st-drum{box-sizing:border-box;width:calc(var(--gw) + 12px);overscroll-behavior-x:contain;clip-path:polygon(0 0,100% 0,100% 12px,calc(100% - 6px) 12px,calc(100% - 6px) 100%,6px 100%,6px 12px,0 12px);flex:none;margin:0 -6px;padding:0 6px;overflow:auto hidden}.st-drum-in{width:var(--dw);position:relative}.st-nums{align-items:flex-end;height:28px;margin-top:6px;display:flex}.st-num{width:var(--dp);text-align:center;font-variant-numeric:tabular-nums;flex:none;font-size:13px;font-weight:400;line-height:20px}.st-num[data-q]{font-weight:700}.st-num[data-now]{color:var(--st-warm)}.st-rows{flex-direction:column;gap:6px;display:flex}.st-row{display:flex}.st-pad{width:calc(var(--dp) - 6px);background-color:var(--st-s2);cursor:pointer;border:0;flex:none;height:30px;margin:0 3px;padding:0}.st-pad[data-g="1"]{background-color:var(--st-s3)}.st-pad[aria-pressed=true]{background-color:var(--st-fg)}.st-bl{background-color:var(--st-lilac);pointer-events:none;width:1px;position:absolute;top:12px;bottom:0}.st-head{background-color:var(--st-hot);pointer-events:none;will-change:transform;width:2px;position:absolute;bottom:0;left:-1px}.st-head-d{top:34px}.st-head-r{z-index:2;top:0}.st-mark{pointer-events:none;will-change:transform;width:12px;height:10px;position:absolute;top:0;left:-6px}.st-hbar{box-sizing:border-box;width:var(--gw);border:1px solid var(--st-line);background-color:var(--st-night);cursor:pointer;touch-action:none;height:14px;margin:10px 0 0 190px;position:relative}.st-vbar{box-sizing:border-box;border:1px solid var(--st-line);background-color:var(--st-night);cursor:pointer;touch-action:none;border-left:0;flex:none;width:14px;height:386px;position:relative}.st-hthumb,.st-vthumb{box-sizing:border-box;border:1px solid var(--st-lilac);background-color:var(--st-line);cursor:grab;touch-action:none;justify-content:center;align-items:center;gap:2px;display:flex;position:absolute}.st-hthumb{top:2px;bottom:2px}.st-vthumb{flex-direction:column;left:2px;right:2px}.st-hthumb>i{background-color:var(--st-fg);width:1px;height:5px}.st-vthumb>i{background-color:var(--st-fg);width:5px;height:1px}.st-sound{position:relative}.st-sound-b{box-sizing:border-box;border:1px solid var(--st-line);cursor:pointer;background:0 0;align-items:center;gap:14px;height:40px;margin:0;padding:0 16px 0 18px;font-size:17px;font-weight:500;display:flex}.st-list{z-index:5;box-sizing:border-box;border:1px solid var(--st-fg);background-color:var(--st-bg);width:220px;padding:4px 0;position:absolute;top:46px;right:0}.st-opt{box-sizing:border-box;text-align:left;cursor:pointer;background:0 0;border:0;border-left:3px solid #0000;width:100%;margin:0;padding:9px 16px 9px 15px;font-size:16px;font-weight:400;display:block}.st-opt:hover{background-color:var(--st-s2)}.st-opt[aria-selected=true]{border-left-color:var(--st-hot);font-weight:600}.st-ruler{box-sizing:content-box;width:var(--gw);height:26px;margin:8px 0 0 191px;overflow:hidden}.st-ruler-in{width:var(--rw);will-change:transform;align-items:flex-end;height:26px;display:flex}.st-tick{box-sizing:border-box;width:var(--rp);border-left:1px solid var(--st-line);flex:none;height:5px;padding-left:6px;font-size:14px;font-weight:500;line-height:14px}.st-tick[data-t=beat]{border-left-color:var(--st-electric);height:10px}.st-tick[data-t=bar]{border-left-color:var(--st-fg);height:22px}.st-roll{margin-top:4px;display:flex}.st-roll-box{box-sizing:border-box;width:calc(190px + var(--gw) + 2px);overscroll-behavior:contain;border:1px solid var(--st-line);height:386px;overflow:auto}.st-roll-in{width:calc(190px + var(--rw));display:flex}.st-keys{z-index:3;width:190px;height:var(--gh);background-color:var(--st-fg);cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;flex:none;position:sticky;left:0;overflow:hidden}.st-wk,.st-bk{box-sizing:border-box;position:absolute;left:0}.st-wk{border-bottom:1px solid color-mix(in srgb, var(--st-night) 35%, var(--st-fg));background-color:var(--st-fg);width:190px;color:var(--st-night);justify-content:flex-end;align-items:center;padding-right:12px;font-size:15px;font-weight:500;display:flex}.st-bk{border-right:6px solid var(--st-s3);background-color:var(--st-night);width:114px}.st-wk[data-down]{background-color:var(--st-lilac)}.st-bk[data-down]{background-color:var(--st-line)}.st-grid{width:var(--rw);height:var(--gh);flex:none;position:relative}.st-gridbg{cursor:pointer;position:absolute;inset:0}.st-note{z-index:1;box-sizing:border-box;background-color:var(--st-lilac);height:22px;color:var(--st-night);text-align:left;white-space:nowrap;cursor:pointer;border:0;margin:0;padding:0 0 0 6px;font-size:13px;font-weight:500;line-height:1;position:absolute;overflow:hidden}.st-note[aria-pressed=true]{border:2px solid var(--st-fg)}.st-foot{color:var(--st-lilac);justify-content:space-between;gap:24px;font-size:16px;display:flex}.st-foot-l{flex-direction:column;gap:6px;display:flex}.st-kept{font-family:var(--font-plex-mono), ui-monospace, monospace;letter-spacing:.06em;text-transform:uppercase;font-size:11px;line-height:1.2}.st-status{white-space:nowrap;flex:none}
