@font-face{font-family:Space Grotesk;src:url(SpaceGrotesk.woff2) format("woff2");font-weight:300 700;font-display:block}:root{--ink: #050507;--text: rgba(255, 255, 255, .94);--dim: rgba(255, 255, 255, .44);--faint: rgba(255, 255, 255, .2);--hairline: rgba(255, 255, 255, .09);--divider: rgba(255, 255, 255, .055);--pane: rgba(255, 255, 255, .035);--knob-face: rgba(255, 255, 255, .028);--knob-edge: rgba(255, 255, 255, .09);--glow: #8ce8ff;--glow-warm: #ffb27a;--panel-height: 296px;--roll-row: 22.5px;--rows: 8;--roll-gutter: 13px;--roll-gap: 7px;--roll-slit: 2px;--track-corner: 8px;--header-height: 92px;--panel-inset: 42px;--mark-lift: 6px;--ease: cubic-bezier(.22, .61, .36, 1)}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:var(--ink);color:var(--text);font-family:Space Grotesk,-apple-system,BlinkMacSystemFont,sans-serif;font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;user-select:none;-webkit-user-select:none;cursor:default}input,textarea,select,[contenteditable]:not([contenteditable=false]){user-select:text;-webkit-user-select:text;cursor:text}#gl,#particles,#wave{position:fixed;inset:0;width:100%;height:100%;display:block}#gl{z-index:0}#particles{z-index:1}#wave{z-index:2}#scrub{position:fixed;left:0;right:0;top:calc(var(--header-height) + 24px);bottom:calc(var(--panel-height) + 22px);z-index:8;pointer-events:none;touch-action:none}body.dragging-control,body.dragging-control *{cursor:none!important}body.loaded #scrub{pointer-events:auto}#vignette{position:fixed;inset:0;z-index:3;pointer-events:none;background:radial-gradient(140% 95% at 50% 40%,transparent 38%,rgba(0,0,0,.42) 80%,rgba(0,0,0,.8) 100%)}#grain{position:fixed;inset:0;z-index:4;pointer-events:none;opacity:.05;mix-blend-mode:overlay}#header{position:fixed;top:0;left:0;right:0;height:var(--header-height);z-index:30;display:flex;align-items:center;gap:22px;padding:0 26px}#themeToggle{position:relative;flex:0 0 auto;width:22px;height:22px;margin-right:-10px;padding:0;border:0;background:none;color:var(--text);cursor:pointer;opacity:.45;transition:opacity .22s var(--ease)}#themeToggle:hover{opacity:.95}#themeToggle svg{position:absolute;inset:0;width:21px;height:21px;transition:opacity .34s var(--ease),transform .42s var(--ease)}#themeToggle .moon{opacity:1;transform:rotate(0) scale(1)}#themeToggle .sun{opacity:0;transform:rotate(-80deg) scale(.55)}body.light #themeToggle .moon{opacity:0;transform:rotate(80deg) scale(.55)}body.light #themeToggle .sun{opacity:1;transform:rotate(0) scale(1)}.identity{flex:0 0 auto}.corner{flex:0 0 auto;margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:7px}body.standalone .corner{align-self:flex-start;padding-top:max(22px,calc(var(--titlebar, 0px) + 6px))}.tempo{display:none;align-items:center;gap:6px;padding-right:12px;cursor:ns-resize;user-select:none}body.owns-tempo .tempo{display:flex}.tempo-label{font-size:8px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}.tempo-value{font-size:11px;font-variant-numeric:tabular-nums;color:var(--text-2);min-width:22px;text-align:right}.tempo-field{display:none;width:30px;padding:0;border:0;border-bottom:1px solid var(--text-2);border-radius:0;background:none;font:inherit;font-size:11px;font-variant-numeric:tabular-nums;color:var(--text);text-align:right;outline:none;-webkit-appearance:none;appearance:none}.tempo.typing{cursor:text}.tempo.typing .tempo-value{display:none}.tempo.typing .tempo-field{display:block}.tempo:hover .tempo-value,.tempo.turning .tempo-value{color:var(--text)}.tempo.turning .tempo-label{color:var(--text-2)}.load{display:flex;align-items:center;gap:8px;padding-right:2px}.load-label{font-size:8px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}.load-track{position:relative;width:56px;height:2px;background:#ffffff12;border-radius:2px;overflow:hidden}body.light .load-track{background:#0e0f1417}.load-fill{height:100%;width:0%;background:var(--glow);border-radius:2px;transition:width .09s linear,background .25s var(--ease)}.load.busy .load-fill{background:var(--glow-warm)}.load.over .load-fill{background:#ff6b5e}.load-value{font-size:9.5px;letter-spacing:.06em;color:var(--dim);font-variant-numeric:tabular-nums;min-width:30px;transition:color .25s var(--ease)}.load-value i{font-style:normal;font-size:7.5px;color:var(--faint);margin-left:1px}.load.busy .load-value{color:var(--text)}.load.over .load-value{color:#ff6b5e}.by{font-size:8.5px;font-weight:500;letter-spacing:.28em;text-transform:uppercase;color:var(--faint);line-height:1;white-space:nowrap;align-self:flex-end;margin-left:-4px}.mark{position:relative;font-size:15px;font-weight:500;letter-spacing:.42em;text-transform:uppercase;line-height:1;color:#fff}.identity{position:relative;display:flex;align-items:center;gap:10px}.newer{appearance:none;position:absolute;top:calc(100% + 7px);left:0;display:inline-flex;align-items:center;gap:6px;border:0;background:none;padding:0;font-family:inherit;font-size:8.5px;font-weight:500;letter-spacing:.28em;text-transform:uppercase;color:var(--dim);white-space:nowrap;cursor:pointer}.newer:before{content:"";flex:0 0 4px;width:4px;height:4px;border-radius:50%;background:var(--glow);box-shadow:0 0 6px -1px color-mix(in srgb,var(--glow) 55%,transparent);transition:box-shadow .25s var(--ease)}body.light .newer:before{background:color-mix(in srgb,var(--glow) 50%,#0e0f14);box-shadow:none}.newer:hover{color:var(--text)}.newer:hover:before{box-shadow:0 0 9px -1px color-mix(in srgb,var(--glow) 80%,transparent)}body.light .newer:hover:before{box-shadow:none}.newer[hidden]{display:none}.newer{opacity:0;transform:translateY(-2px);transition:opacity .45s var(--ease),transform .45s var(--ease),color .25s var(--ease)}.newer.in{opacity:1;transform:none}.looking{position:absolute;top:calc(100% + 7px);left:0;right:.42em;height:1px;overflow:hidden;background:var(--divider);opacity:0;transition:opacity .35s var(--ease)}.looking:before{content:"";position:absolute;top:0;bottom:0;left:0;width:34%;background:var(--text);animation:looking 1.15s cubic-bezier(.45,0,.55,1) infinite}.looking.in{opacity:1}.looking[hidden]{display:none}@keyframes looking{0%{transform:translate(-100%)}to{transform:translate(calc(100% / .34))}}.source{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:46%;text-align:center;min-width:0;-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 40%,transparent 66%);mask-image:linear-gradient(90deg,#000 0%,#000 40%,transparent 66%);-webkit-mask-size:300% 100%;mask-size:300% 100%;-webkit-mask-position:0% 0;mask-position:0% 0;transition:-webkit-mask-position .85s var(--ease),mask-position .85s var(--ease)}.source.veiled{-webkit-mask-position:100% 0;mask-position:100% 0;transition:-webkit-mask-position .3s var(--ease),mask-position .3s var(--ease)}.source-name{font-size:12px;font-weight:400;letter-spacing:.16em;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .5s var(--ease)}body.loaded .source-name{color:var(--text)}.source-meta{margin-top:5px;font-size:9.5px;font-weight:300;letter-spacing:.15em;color:#ffffff42}.actions{flex:0 0 auto;display:flex;gap:8px}.preset{position:relative;flex:0 0 auto;display:flex;align-items:center;gap:1px;margin-right:12px}.preset-step,.preset-name,.preset-confirm{font-family:inherit;background:none;border:0;color:var(--dim);cursor:pointer;transition:color .25s var(--ease),opacity .2s var(--ease),max-width .3s var(--ease),min-width .3s var(--ease),padding .3s var(--ease)}.preset-step:hover,.preset-name:hover,.preset-confirm:hover{color:var(--text)}.preset-with{display:none;padding:0 4px;border:0;background:none;color:var(--faint);cursor:pointer;transition:color .2s var(--ease)}.preset-with svg{width:13px;height:11px;display:block}.preset-with:hover{color:var(--dim)}.preset-with.on{color:var(--glow)}body.loaded #preset.naming .preset-with{display:block}.preset-tip{position:absolute;top:calc(100% + 4px);left:50%;transform:translate(-50%,-6px);white-space:nowrap;pointer-events:none;font-size:8px;font-weight:300;letter-spacing:.14em;text-transform:uppercase;color:#ffffff52;opacity:0;transition:opacity .2s var(--ease),transform .3s var(--ease)}body.light .preset-tip{color:#0e0f1473}#presetWith:hover~.preset-tip{opacity:1;transform:translate(-50%)}.preset-item .carries{display:inline-block;width:11px;margin-left:6px;color:var(--faint);vertical-align:-1px}.preset-step{display:flex;align-items:center;justify-content:center;padding:6px 3px;max-width:20px;overflow:hidden}.preset-step svg{width:12px;height:12px;display:block;flex:none}.preset-name{font-size:9.5px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;text-align:center;padding:7px 4px;min-width:104px;max-width:150px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.preset.open .preset-name{color:var(--text)}.preset-field{font-family:inherit;font-size:9.5px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:var(--text);background:none;border:0;border-bottom:1px solid var(--hairline);outline:none;max-width:0;padding:0;opacity:0;pointer-events:none;transition:max-width .32s var(--ease),opacity .24s var(--ease),padding .32s var(--ease),border-color .25s var(--ease)}.preset-field::placeholder{color:var(--faint);text-transform:uppercase}.preset-field:focus{border-bottom-color:var(--glow)}.preset-confirm{display:flex;align-items:center;justify-content:center;max-width:0;padding:0;opacity:0;overflow:hidden;pointer-events:none}.preset-confirm svg{width:14px;height:14px;display:block;flex:none}.preset.naming .preset-step,.preset.naming .preset-name{min-width:0;max-width:0;padding-left:0;padding-right:0;opacity:0;pointer-events:none}.preset.naming .preset-field{max-width:160px;padding:5px 2px;opacity:1;pointer-events:auto}.preset.naming .preset-confirm{max-width:26px;padding:5px 6px;opacity:1;pointer-events:auto}.preset-menu{position:absolute;top:calc(100% + 12px);right:0;min-width:196px;padding:6px;z-index:40;overflow:visible;background:#09090c;border:1px solid var(--hairline);border-radius:12px;box-shadow:0 20px 48px #0009;overscroll-behavior:contain;opacity:0;transform:translateY(-8px) scale(.985);transform-origin:top right;pointer-events:none;transition:opacity .2s var(--ease),transform .28s var(--ease)}.preset.open .preset-menu{opacity:1;transform:none;pointer-events:auto}.preset-submenu::-webkit-scrollbar{width:10px}.preset-submenu::-webkit-scrollbar-track{background:transparent}.preset-submenu::-webkit-scrollbar-thumb{background-color:#ffffff29;background-clip:content-box;border:2px solid transparent;border-radius:5px}.preset-submenu:hover::-webkit-scrollbar-thumb{background-color:#ffffff42}.preset-item{display:block;width:100%;text-align:left;font-family:inherit;font-size:9px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);background:none;border:0;border-radius:7px;padding:8px 10px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .18s var(--ease),background .18s var(--ease)}.preset-item:hover{color:var(--text);background:#ffffff0e}.preset-item.naming{color:var(--text);background:#ffffff0f;box-shadow:inset 0 0 0 1px var(--glow);outline:none;cursor:text}.preset-item.on{color:var(--glow)}.preset-item.is-init{color:color-mix(in srgb,var(--glow) 58%,transparent)}.preset-item.is-init.on{color:var(--glow)}.preset-group{position:relative}.preset-item.drawer{display:flex;align-items:center;justify-content:space-between;gap:10px}.drawer-arrow{width:12px;height:12px;flex:0 0 auto;opacity:.45;transition:opacity .18s var(--ease),transform .22s var(--ease)}.preset-group:hover>.drawer,.preset-group.open>.drawer{color:var(--text);background:#ffffff0e}.preset-group:hover>.drawer .drawer-arrow,.preset-group.open>.drawer .drawer-arrow{opacity:1;transform:translate(2px)}.preset-group.holding>.drawer{color:var(--glow)}.preset-submenu{position:absolute;right:calc(100% + 7px);top:-7px;min-width:180px;max-height:326px;overflow-y:auto;overscroll-behavior:contain;padding:6px;z-index:41;background:#09090c;border:1px solid var(--hairline);border-radius:12px;box-shadow:0 20px 48px #0009;opacity:0;transform:translate(6px) scale(.985);transform-origin:top right;pointer-events:none;transition:opacity .16s var(--ease),transform .2s var(--ease)}.preset-group:hover>.preset-submenu,.preset-group.open>.preset-submenu{opacity:1;transform:none;pointer-events:auto}.preset-group:after{content:"";position:absolute;right:100%;top:-7px;width:9px;height:340px;pointer-events:none}.preset-group:hover:after,.preset-group.open:after{pointer-events:auto}.preset-rule{height:1px;margin:5px 8px;background:var(--hairline)}.preset-empty{padding:9px 10px;font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}.ghost{font-family:inherit;font-size:9.5px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);background:none;border:0;padding:7px 6px;cursor:pointer;transition:color .25s var(--ease)}.ghost:hover{color:var(--text)}.corner-top{display:flex;align-items:center;gap:10px}#audioButton{display:none;padding:0;border:0;background:none;cursor:pointer;color:#ffffffe6;opacity:.42;transition:opacity .22s var(--ease),color .22s var(--ease)}body.standalone #audioButton{display:block}#audioButton svg{width:15px;height:13px;display:block}#audioButton:hover{opacity:.9}body.audio-open #audioButton{opacity:1;color:var(--glow)}body.light #audioButton{color:#0e0f14d9}#audio{position:fixed;top:calc(var(--header-height) - 6px);right:26px;z-index:40;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .22s var(--ease),transform .26s var(--ease),visibility 0s linear .22s}body.audio-open #audio{opacity:1;visibility:visible;transform:none;transition:opacity .22s var(--ease),transform .26s var(--ease),visibility 0s linear 0s}.audio-inner{display:flex;flex-direction:column;gap:12px;width:258px;padding:14px 16px 15px;border:1px solid var(--hairline);border-radius:12px;background:#0a0a0df0;backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);box-shadow:0 24px 60px #0009}body.light .audio-inner{background:#f6f6f8f5}.audio-head{display:flex;align-items:center;justify-content:space-between}.audio-mark{font-size:8px;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:#ffffff57}.audio-close{padding:0;border:0;background:none;cursor:pointer;color:#fff6;transition:color .18s var(--ease)}.audio-close:hover{color:var(--text)}.audio-close svg{width:11px;height:11px;display:block}#ask{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .24s var(--ease),visibility 0s linear .24s}body.asking #ask{opacity:1;visibility:visible;transition:opacity .24s var(--ease),visibility 0s linear 0s}.ask-scrim{position:absolute;inset:0;background:#00000085;cursor:default}body.light .ask-scrim{background:#0e0f1438}.ask-inner{position:relative;display:flex;flex-direction:column;gap:14px;width:314px;padding:16px 18px 17px;border:1px solid var(--hairline);border-radius:12px;background:#0a0a0df0;backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);box-shadow:0 24px 60px #0009;transform:translateY(-4px) scale(.988);transition:transform .28s var(--ease)}body.asking .ask-inner{transform:none}body.light .ask-inner{background:#f6f6f8f5}.ask-head{display:flex;align-items:center;justify-content:space-between}.ask-mark{font-size:8px;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:#ffffff57}body.light .ask-mark{color:#0e0f1466}.ask-said{margin:0;font-size:10.5px;line-height:1.55;letter-spacing:.01em;text-transform:none;color:var(--dim)}.ask-keep{display:flex;align-items:center;gap:9px;cursor:pointer;user-select:none}.ask-keep input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.ask-box{flex:0 0 auto;width:13px;height:13px;display:flex;align-items:center;justify-content:center;border:1px solid var(--hairline);border-radius:4px;color:transparent;transition:color .16s var(--ease),border-color .16s var(--ease),background .16s var(--ease)}.ask-box svg{width:11px;height:11px;display:block}.ask-keep:hover .ask-box{border-color:#ffffff38}body.light .ask-keep:hover .ask-box{border-color:#0e0f1442}.ask-keep input:checked+.ask-box{color:var(--glow);border-color:color-mix(in srgb,var(--glow) 45%,transparent);background:color-mix(in srgb,var(--glow) 10%,transparent)}.ask-keep input:focus-visible+.ask-box{border-color:var(--glow)}.ask-keep-word{font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);transition:color .16s var(--ease)}.ask-keep:hover .ask-keep-word{color:var(--dim)}.ask-doing{display:flex;align-items:center;justify-content:flex-end;gap:16px;margin-top:2px}.ask-doing .ghost{padding:0}.ask-yes{color:var(--glow)!important}.ask-yes:hover{color:var(--glow)!important;filter:brightness(1.25)}#audio .picker{display:flex;align-items:center;justify-content:space-between;gap:10px}#audio .picker-face{flex:0 1 auto;min-width:0;max-width:175px}#audio .picker-face span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#audio .picker-menu{max-height:260px;overflow-y:auto;scrollbar-width:none}#audio .picker-menu::-webkit-scrollbar{display:none}.audio-said{font-size:8.5px;letter-spacing:.1em;color:#ffffff4d}body.light .audio-said{color:#0e0f146b}#dropzone{position:fixed;inset:var(--header-height) 0 var(--panel-height) 0;z-index:10;display:flex;align-items:center;justify-content:center;pointer-events:none;opacity:1;background:#050508ad;backdrop-filter:blur(7px) saturate(.8);-webkit-backdrop-filter:blur(7px) saturate(.8);transition:opacity .7s var(--ease)}body.loaded #dropzone{opacity:0}body.dragging #dropzone{opacity:1}body:not(.loaded):not(.analysing) #dropzone{pointer-events:auto;cursor:pointer}body:not(.loaded) #dropzone:hover .drop-ring{border-color:#fff6}body:not(.loaded) #dropzone:hover .drop-title{color:#fff}.drop-inner{position:relative;display:flex;flex-direction:column;align-items:center;gap:26px}.drop-ring{width:84px;height:84px;border-radius:50%;border:1px solid rgba(255,255,255,.16);position:relative;transition:all .4s var(--ease)}.drop-ring:after{content:"";position:absolute;inset:-14px;border-radius:50%;border:1px solid rgba(255,255,255,.06);animation:breathe 3.4s ease-in-out infinite}body.dragging .drop-ring{border-color:var(--glow);box-shadow:0 0 44px -4px var(--glow);transform:scale(1.1)}@keyframes breathe{0%,to{transform:scale(1);opacity:.5}50%{transform:scale(1.14);opacity:.12}}.drop-text{display:flex;align-items:center}.drop-title{font-size:13px;font-weight:400;letter-spacing:.34em;text-transform:uppercase;color:#ffffffd1}#analysing{position:fixed;left:50%;top:calc(50% - 60px);transform:translate(-50%,-50%);z-index:11;opacity:0;pointer-events:none;transition:opacity .35s var(--ease)}body.analysing #dropzone{opacity:0;transition-duration:.26s}body.analysing #analysing{opacity:1;transition:opacity .32s var(--ease) .3s}.analysing-inner{display:flex;flex-direction:column;align-items:center;gap:15px}.analysing-label{font-size:10px;font-weight:300;letter-spacing:.4em;text-transform:uppercase;color:var(--dim)}.analysing-track{width:190px;height:1px;background:#ffffff1a;overflow:hidden}.analysing-fill{height:100%;width:0%;background:var(--glow);box-shadow:0 0 12px var(--glow);transition:width .2s linear}#panel{position:fixed;left:0;right:0;bottom:0;height:var(--panel-height);transition:height var(--fold-time, .28s) var(--ease);z-index:20;display:flex;align-items:stretch;padding:0 22px 10px;gap:0;background:linear-gradient(to bottom,#0a0a0d6b,#08080ba8);backdrop-filter:blur(24px) saturate(1.25);-webkit-backdrop-filter:blur(24px) saturate(1.25)}#panel:after{content:"";position:absolute;left:0;right:0;top:0;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent 0,var(--hairline) clamp(30px,11vw,190px),var(--hairline) calc(100% - clamp(30px,11vw,190px)),transparent 100%)}#panel:before{content:"";position:absolute;left:0;right:0;top:-60px;height:60px;pointer-events:none;background:linear-gradient(to bottom,transparent,rgba(8,8,11,.34))}.group{position:relative;flex:1 1 0;display:flex;flex-direction:column;padding:18px 20px 0;min-width:0}.group.sequencer{--sequencer-air: 8px;padding-left:calc(var(--sequencer-air) + var(--roll-gutter, 13px) + var(--roll-gap, 7px));padding-right:var(--sequencer-air)}.group:not(.last):after{content:"";position:absolute;right:0;top:20px;bottom:0;width:1px;pointer-events:none;background:linear-gradient(180deg,transparent 0,var(--divider) 15%,var(--divider) 85%,transparent 100%)}.group-head{margin-bottom:12px}.group-name{font-size:8.5px;font-weight:500;letter-spacing:.34em;text-transform:uppercase;color:#ffffff4d}.knobs{flex:1 1 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:13px 2px;justify-items:center;align-content:start}.knob{--step-ink: var(--glow-rgb, 150, 226, 255);position:relative;width:100%;max-width:78px;display:flex;flex-direction:column;align-items:center;cursor:default;padding-top:2px;touch-action:none}.knob.large{grid-column:1 / -1;max-width:100px;margin-bottom:2px}.knob svg{display:block;overflow:visible}.knob-label{margin-top:5px;font-size:8.5px;font-weight:400;letter-spacing:.15em;text-transform:uppercase;color:#ffffff57;transition:color .2s var(--ease);white-space:nowrap}.knob-value{margin-top:2px;font-size:10px;font-weight:400;letter-spacing:.04em;color:#ffffff9e;font-variant-numeric:tabular-nums;transition:color .2s var(--ease);white-space:nowrap}.knob:hover .knob-label,.knob.active .knob-label{color:#ffffffb8}.knob:hover .knob-value,.knob.active .knob-value{color:var(--text)}.row{display:flex;align-items:center;justify-content:center;gap:10px;padding:8px 0 4px}.select-wrap{display:flex;align-items:center;gap:7px}.mini-label{font-size:8.5px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:#ffffff4d}.stepper{font-family:inherit;font-size:10px;font-weight:400;letter-spacing:.06em;color:var(--dim);font-variant-numeric:tabular-nums;padding:4px 2px;min-width:34px;text-align:center;cursor:ns-resize;touch-action:none;transition:color .18s var(--ease)}.stepper:hover,.stepper.active{color:var(--text)}.toggle{display:flex;align-items:center;gap:7px;font-family:inherit;font-size:8.5px;font-weight:400;letter-spacing:.18em;text-transform:uppercase;color:#ffffff4d;background:#ffffff0a;border:1px solid var(--hairline);border-radius:100px;padding:5px 11px 5px 8px;cursor:pointer;transition:all .25s var(--ease)}.toggle .dot{width:5px;height:5px;border-radius:50%;background:#fff3;transition:all .3s var(--ease)}.toggle.on{color:var(--text);border-color:#ffffff38}.toggle.on .dot{background:var(--glow);box-shadow:0 0 9px var(--glow)}.meter{height:2px;margin:10px 2px 2px;background:#ffffff12;border-radius:2px;overflow:hidden}.meter-fill{height:100%;width:0%;background:var(--glow);border-radius:2px;transition:width .07s linear}:root{--piano-height: 36px}#pianoToggle{position:fixed;left:var(--panel-inset);bottom:calc(var(--panel-height) + var(--mark-lift));z-index:22;display:block;padding:0;border:0;background:none;cursor:pointer;color:#ffffffe6;opacity:.5;transition:transform .34s var(--ease),opacity .22s var(--ease),color .22s var(--ease)}#pianoToggle svg{width:21px;height:21px;display:block}#pianoToggle:hover{opacity:.92}body.piano-open #pianoToggle{transform:translateY(calc(-1 * var(--piano-height) - 6px));opacity:1;color:var(--glow)}#piano{position:fixed;left:0;right:0;bottom:var(--panel-height);height:var(--piano-height);z-index:15;background:transparent;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,.28) 26%,rgba(0,0,0,.78) 56%,rgba(0,0,0,1) 82%);mask-image:linear-gradient(to bottom,#0000,#00000047 26%,#000000c7 56%,#000 82%);opacity:0;pointer-events:none;transform:translateY(16px) scaleY(.92);transform-origin:bottom;transition:opacity .28s var(--ease),transform .32s var(--ease)}body.piano-open #piano{opacity:1;pointer-events:auto;transform:translateY(0) scaleY(1)}.pkey{position:absolute;top:0;cursor:pointer;touch-action:none;transition:background .09s var(--ease),box-shadow .09s var(--ease),opacity .42s var(--ease)}.pkey.natural{height:100%;border-right:1px solid rgba(0,0,0,.5);background:#ffffff8f}.pkey.sharp{height:62%;z-index:2;border-radius:0 0 2px 2px;background:#06060a}.pkey.outside{opacity:.34}.pkey.natural:hover{background:#ffffffbd}.pkey.sharp:hover{background:#17171f}.pkey.natural.down,.pkey.sharp.down{background:rgb(var(--key-ink, var(--glow-rgb, 150, 226, 255)));box-shadow:0 0 12px -3px rgb(var(--key-ink, var(--glow-rgb, 150, 226, 255)))}#fault{position:fixed;left:12px;bottom:12px;z-index:90;display:none;max-width:70vw;padding:9px 13px;border:1px solid rgba(255,110,110,.4);border-radius:7px;background:#280808e6;color:#ffbebef2;font-size:10px;letter-spacing:.05em;line-height:1.5;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);user-select:text;-webkit-user-select:text}#fault.visible{display:block}@media(max-width:1080px){:root{--panel-height: 252px;--panel-inset: 33px}.group{padding:15px 11px 0}.knob{max-width:66px}.knob.large{max-width:86px}.knobs{gap:10px 2px}}.group-head{display:flex;align-items:baseline;gap:12px}.group-hint{font-size:8px;font-weight:300;letter-spacing:.1em;color:#ffffff30;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;transition:opacity .16s var(--ease)}.group-hint.fading{opacity:0}.sequencer .head-cap{display:none;align-items:center;align-self:center;gap:6px;font-size:8.5px;font-weight:500;letter-spacing:.34em;text-transform:uppercase;color:#ffffff4d;white-space:nowrap;user-select:none}.head-cap-icon{width:9px;height:9px;flex:0 0 auto}body.pattern-focus:not(.no-clock) .sequencer .group-name,body.pattern-focus:not(.no-clock) .sequencer .group-hint{display:none}body.pattern-focus:not(.no-clock) .sequencer .head-cap{display:flex}#patternClear{display:none}body.pattern-focus:not(.no-clock) #bounce,body.pattern-focus:not(.no-clock) #resetButton{display:none}body.pattern-focus:not(.no-clock) #patternClear{display:inline-flex;align-self:center;margin-left:auto}.group-head{min-width:0}.sequencer .group-head{align-items:center}.ghost.small.reset{margin-left:auto;flex:0 0 auto;padding:2px 0 2px 10px;font-size:8px;letter-spacing:.16em}.sequencer .foot{margin-top:auto;display:flex;align-items:center;gap:10px}.seq-controls{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding-bottom:1px}.sequencer .group-head{margin-bottom:9px}.field{position:relative;display:inline-flex;align-items:stretch;border:1px solid var(--hairline);border-radius:100px;overflow:hidden;transition:border-color .15s var(--ease)}.field:hover{border-color:rgba(var(--glow-rgb, 140, 232, 255),.45)}body.light .field:hover{border-color:rgba(var(--glow-rgb, 140, 232, 255),.75)}.pick-menu{position:absolute;z-index:30;box-sizing:content-box;display:flex;flex-direction:column;border:1px solid var(--hairline);border-radius:2px;background:#0c0d11f5;box-shadow:0 6px 16px #00000073;overflow:hidden;opacity:0;clip-path:inset(33% 0);pointer-events:none;transition:opacity .16s var(--ease),clip-path .2s var(--ease)}.pick-menu.on{opacity:1;clip-path:inset(0 0);pointer-events:auto}.pick-option{display:flex;align-items:center;justify-content:center;gap:5px;height:var(--row, 23px);padding:0 8px;border:0;background:none;font-family:inherit;font-size:9px;font-weight:400;letter-spacing:.1em;text-transform:uppercase;color:#ffffff70;cursor:pointer;white-space:nowrap;transition:color .14s var(--ease),box-shadow .14s var(--ease)}.pick-option:hover{color:var(--text);box-shadow:inset 0 0 0 999px #ffffff0f}.pick-option.now,.pick-option.now:hover{color:#090b0feb;background:var(--glow)}.pick-option.now:hover{box-shadow:inset 0 0 0 999px #ffffff29}.pick-option svg{display:block;width:12px;height:12px;flex:0 0 12px}.pick-option>span{min-width:var(--pick-word, auto);text-align:center}#gridMenu .pick-option{font-size:10px;letter-spacing:.06em;font-variant-numeric:tabular-nums}.field.picking .field-label{color:var(--text)}body.light .pick-menu{background:#fafafcf7}body.light .pick-option{color:#0e0f1480}body.light .pick-option.now,body.light .pick-option.now:hover{color:#090b0feb;background:var(--glow)}body.light .pick-option:hover{color:#0e0f14f2;box-shadow:inset 0 0 0 999px #0e0f140f}.field-label{display:flex;align-items:center;padding:0 6px;font-size:8.5px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:#ffffff52;background:#ffffff09;user-select:none;white-space:nowrap;transition:color .15s var(--ease)}#modeField .field-label,#gridField .field-label{cursor:pointer}#modeField .field-label:hover,#gridField .field-label:hover{color:#ffffffb8}.field .stepper{padding:5.25px 0;min-width:48px;text-align:center;color:#090b0feb;background:var(--glow);transition:box-shadow .15s var(--ease)}#gridField .stepper{min-width:30px}#clockField{border-color:var(--hairline)}#clockField .stepper,#clockField .stepper:hover,#clockField .stepper.active{min-width:34px;background:none;box-shadow:none;color:rgb(var(--glow-rgb, 140, 232, 255));font-variant-numeric:tabular-nums}#clockField .stepper:hover,#clockField .stepper.active{opacity:.72}body.light #clockField .stepper,body.light #clockField .stepper:hover,body.light #clockField .stepper.active{color:rgb(var(--glow-rgb, 40, 120, 160))}#modeField .stepper{display:flex;align-items:center;justify-content:center;gap:5px;min-width:78px;padding:5.25px 8px}#modeField .field-text{text-transform:uppercase;letter-spacing:.1em;font-size:9px}.mode-icon{display:none;width:12px;height:12px;flex:0 0 auto}#modeValue[data-mode="0"] .mode-icon[data-for="0"],#modeValue[data-mode="1"] .mode-icon[data-for="1"],#modeValue[data-mode="2"] .mode-icon[data-for="2"]{display:block}#modeField .stepper,#gridField .stepper{cursor:pointer}.field .stepper:hover,.field .stepper.active{box-shadow:inset 0 0 0 999px #ffffff29}body.light .field-label{color:#0e0f146b;background:#0e0f140a}.segment{display:flex;border:1px solid var(--hairline);border-radius:100px;overflow:hidden;background:#ffffff05}.segment button{font-family:inherit;font-size:8.5px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:#ffffff57;background:transparent;border:0;padding:6px 9px;cursor:pointer;transition:all .2s var(--ease)}.segment button:hover{color:#ffffffb3}.segment button.on{color:var(--ink);background:var(--glow)}.ghost.small{font-size:8.5px;padding:6px 10px;letter-spacing:.14em}@keyframes cellFlash{0%{box-shadow:0 0 0 1px var(--glow),0 0 12px color-mix(in srgb,var(--glow) 55%,transparent)}to{box-shadow:0 0 0 1px transparent,0 0 0 transparent}}.cell.flash{animation:cellFlash .42s var(--ease)}@keyframes knobFlash{0%{filter:drop-shadow(0 0 7px color-mix(in srgb,var(--glow) 80%,transparent))}to{filter:drop-shadow(0 0 0 transparent)}}.knob.flash svg{animation:knobFlash .42s var(--ease)}body.no-steps .cells,body.no-steps #gridField,body.no-clock #clockField{opacity:.28;pointer-events:none;filter:saturate(.2);transition:opacity .25s var(--ease)}.cells{--cell-h: 36px;flex:0 0 auto;display:grid;grid-template-columns:repeat(8,1fr);margin-top:14px;column-gap:0;row-gap:8px;align-content:start}.cell-slot{--step-ink: var(--glow-rgb, 150, 226, 255);--step-mix: 0;position:relative;display:flex;flex-direction:column;gap:3px;min-width:0;padding-bottom:14px}body:not(.no-clock) .cell-slot{padding-bottom:0}body:not(.no-clock) .cell-note{display:none}.cell-slot.hidden{display:none}.cell{position:relative;height:var(--cell-h, 34px);border:1px solid rgba(var(--step-ink),.52);border-radius:3.5px;background:rgba(var(--step-ink),.05);cursor:default;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:background .15s var(--ease),border-color .15s var(--ease),transform .12s var(--ease);touch-action:none}.lane-cap{grid-column:1 / -1;display:flex;align-items:center;gap:5px;height:11px;margin-top:4px;margin-bottom:-13px;overflow:hidden;transition:height var(--fold-time) var(--fold-ease),margin var(--fold-time) var(--fold-ease),opacity calc(var(--fold-time) * .5) var(--fold-ease) calc(var(--fold-time) * .45),transform var(--fold-time) var(--fold-ease) calc(var(--fold-time) * .25);color:#ffffff52;font-size:8.5px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;user-select:none;pointer-events:none}.lane-cap-icon{width:9px;height:9px;flex:0 0 auto}body.light .lane-cap{color:#00000061}.lane-roll{grid-column:1 / -1;display:flex;align-items:flex-start;gap:var(--roll-gap, 6px);min-width:0;height:calc(var(--roll-row) * min(var(--rows, 8),8));overflow-y:auto;overflow-x:hidden;margin-left:calc(-1 * (var(--roll-gutter, 13px) + var(--roll-gap, 7px)));width:calc(100% + var(--roll-gutter, 13px) + var(--roll-gap, 7px));overscroll-behavior:contain;scrollbar-width:none;margin-top:10px}.lane-roll::-webkit-scrollbar{width:0;height:0}.roll-gutter{flex:0 0 auto;display:flex;flex-direction:column;width:var(--roll-gutter, 13px);height:calc(var(--roll-row, 16px) * var(--rows, 8))}.roll-mark{flex:1 1 0;min-height:0;overflow:hidden;display:flex;align-items:center;justify-content:flex-end;padding-bottom:var(--roll-slit, 2px);font-size:11px;font-weight:400;letter-spacing:.02em;font-variant-numeric:tabular-nums;color:rgb(var(--step-ink, 150, 226, 255));opacity:.62;pointer-events:none;transition:opacity .15s var(--ease)}body.pattern-focus:not(.no-clock) .roll-mark{pointer-events:auto}body.pattern-focus:not(.no-clock) .roll-mark:hover{opacity:1}body.pattern-focus:not(.no-clock) .roll-mark.mute:hover{opacity:.5}.roll-mark.hidden{display:none}.lane{flex:1 1 auto;min-width:0;position:relative;flex:1 0 auto;height:calc(var(--roll-row, 13px) * var(--rows, 8));border:0;border-radius:0;background:none;overflow:hidden;cursor:default;touch-action:none;transition:opacity .25s var(--ease),border-color .15s var(--ease),height var(--fold-time, .34s) var(--fold-ease)}.lane.panning,.lane.panning *{cursor:grabbing}.lane.erasing,.lane.erasing *{cursor:-webkit-image-set(url(NoDragCursor@2x.png) 2x) 1 1,not-allowed;cursor:image-set(url(NoDragCursor@2x.png) 2x) 1 1,not-allowed}body.no-clock .lane-cap,body.no-clock .lane-roll,body.no-clock .lane-foot{display:none}body.no-clock .roll-gutter{visibility:hidden}.roll-gutter{opacity:1;transition:height var(--fold-time) var(--fold-ease),opacity calc(var(--fold-time) * .55) var(--fold-ease) calc(var(--fold-time) * .4)}body.flat-roll .roll-gutter{height:34px;opacity:0;transition:height var(--fold-time) var(--fold-ease),opacity calc(var(--fold-time) * .4) var(--fold-ease)}body.no-clock .lane{opacity:0;visibility:hidden;transition:opacity .22s var(--ease),visibility 0s linear .22s;pointer-events:none}.lane-field{position:absolute;inset:0}.lane-scrub{position:absolute;left:0;right:0;top:0;height:11px;display:none;touch-action:none;cursor:pointer;background:#ffffff06;border-radius:var(--track-corner)}body.light .lane-scrub{background:#0e0f1408}body.pattern-focus .lane-scrub{display:block}.lane-scrub:hover{background:#ffffff0a}body.light .lane-scrub:hover{background:#0e0f140d}body.pattern-focus .lane-field{top:14px}body.pattern-focus .lane-head-line{top:-6px}body.pattern-focus .roll-gutter{padding-top:14px}.scrub-grid{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;fill:none;stroke-width:1;vector-effect:non-scaling-stroke}.scrub-bar{stroke:#ffffff29}.scrub-beat{stroke:#ffffff16}.scrub-snap{stroke:#ffffff0b}body.light .scrub-bar{stroke:#0e0f1433}body.light .scrub-beat{stroke:#0e0f141c}body.light .scrub-snap{stroke:#0e0f140f}.lane-scrub-pin{position:absolute;bottom:3px;left:0;width:0;height:0;margin-left:-3.5px;border-left:4px solid transparent;border-right:4px solid transparent;border-top:6px solid rgba(255,255,255,.8);pointer-events:none;z-index:3;opacity:0;transition:opacity .2s var(--ease)}.lane-scrub-pin.on,body.pattern-focus .lane-scrub-pin,body.pattern-focus .lane-head-line{opacity:.8}body.light .lane-scrub-pin{border-top-color:#0e0f14cc}.lane-scrub.dragging .lane-scrub-pin{border-top-color:#fff}.lane-loop{position:absolute;top:0;bottom:0;z-index:2;display:none;cursor:grab;background:#ffffff0d;border-left:1px solid rgba(255,255,255,.2);border-right:1px solid rgba(255,255,255,.2);transition:background .16s var(--ease),border-color .16s var(--ease)}body.light .lane-loop{background:#0e0f140d;border-left-color:#0e0f1438;border-right-color:#0e0f1438}.lane-loop.there{display:block}.lane-loop:active{cursor:grabbing}.lane-loop.on{background:color-mix(in srgb,var(--glow) 15%,transparent);border-left-color:color-mix(in srgb,var(--glow) 62%,transparent);border-right-color:color-mix(in srgb,var(--glow) 62%,transparent)}.lane-loop-edge{position:absolute;top:0;bottom:-1000px;width:7px;background:none;cursor:ew-resize;pointer-events:auto}.lane-loop-edge.start{left:-4px}.lane-loop-edge.end{right:-4px}.lane-loop-edge:after{content:"";position:absolute;left:3px;top:11px;bottom:0;width:1px;background:#ffffff29}.lane-loop.on .lane-loop-edge:after{background:color-mix(in srgb,var(--glow) 40%,transparent)}body.light .lane-loop-edge:after{background:#0e0f142e}.lane-scrub.shaping .lane-scrub-pin{opacity:.25}.lane-grid{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;fill:none;--roll-pitch: calc(100% / var(--rows, 8));--roll-hem: 1px;-webkit-mask:repeating-linear-gradient(to bottom,transparent 0 var(--roll-hem),#000 var(--roll-hem) calc(var(--roll-pitch) - var(--roll-slit, 2px) - var(--roll-hem)),transparent calc(var(--roll-pitch) - var(--roll-slit, 2px) - var(--roll-hem)) var(--roll-pitch));mask:repeating-linear-gradient(to bottom,transparent 0 var(--roll-hem),#000 var(--roll-hem) calc(var(--roll-pitch) - var(--roll-slit, 2px) - var(--roll-hem)),transparent calc(var(--roll-pitch) - var(--roll-slit, 2px) - var(--roll-hem)) var(--roll-pitch));z-index:0;transform:translate(.5px)}.lane-bar,.lane-beat,.lane-snap{stroke:var(--ruler-paint, rgb(var(--glow-rgb, 140, 232, 255)))}.lane-bar{stroke-opacity:.5}.lane-beat{stroke-opacity:.15}.lane-snap{stroke-opacity:.07}body.light .lane-bar,body.light .lane-beat,body.light .lane-snap{stroke:var(--ruler-paint, rgb(14, 15, 20))}body.light .lane-bar{stroke-opacity:.42}body.light .lane-beat{stroke-opacity:.13}body.light .lane-snap{stroke-opacity:.06}.hit{position:absolute;top:0;bottom:0;z-index:1;border:1px solid rgba(var(--step-ink),.26);border-radius:2px;background-color:#07080b9e;background-image:linear-gradient(rgba(var(--step-ink),.09),rgba(var(--step-ink),.09));cursor:grab;overflow:hidden;transition:border-color .15s var(--ease),box-shadow .15s var(--ease),background-image .15s var(--ease),border-radius .2s var(--ease)}.hit.hidden{display:none}.hit:active{cursor:grabbing}.hit:hover{border-color:rgba(var(--step-ink),.6);background-image:linear-gradient(rgba(var(--step-ink),.17),rgba(var(--step-ink),.17))}.hit-fill{position:absolute;left:0;right:0;bottom:0;background:rgba(var(--step-ink),.14);border-top:1px solid rgba(var(--step-ink),.62);pointer-events:none;transition:height .12s var(--ease),background .15s var(--ease),border-top-color .15s var(--ease)}.hit-cell{position:absolute;top:1px;left:3px;font-size:8px;font-weight:400;letter-spacing:.04em;line-height:1;color:#ffffff80;font-variant-numeric:tabular-nums;pointer-events:none;transition:color .15s var(--ease)}.tip-sweep.tip-up{width:9px;height:15px}.hit-start,.hit-end{position:absolute;top:0;bottom:0;width:8px;cursor:ew-resize}.hit-start{left:0}.hit-end{right:0}.hit-start:after,.hit-end:after{content:"";position:absolute;top:5px;bottom:5px;width:2px;border-radius:1px;background:#ffffff8c;opacity:0;transition:opacity .15s var(--ease)}.hit-start:after{left:2px}.hit-end:after{right:2px}.hit:hover .hit-start:after,.hit:hover .hit-end:after{opacity:1}.hit.playing,.hit.chosen{border-color:rgb(var(--step-ink));box-shadow:inset 0 0 0 1px rgb(var(--step-ink));background-color:#07080b8c;background-image:linear-gradient(rgba(var(--step-ink),.3),rgba(var(--step-ink),.3))}.hit.playing .hit-fill,.hit.chosen .hit-fill{background:rgba(var(--step-ink),.4);border-top-color:rgb(var(--step-ink))}.hit.playing .hit-cell,.hit.chosen .hit-cell{color:#fff}.hit.mute{border-style:dashed;border-color:rgba(var(--step-ink),.14);background-color:transparent;background-image:none}.hit.mute .hit-fill{background:transparent;border-top-color:rgba(var(--step-ink),.2);border-top-style:dashed}.hit.mute .hit-cell{color:#fff3}.wake{position:absolute;top:0;bottom:0;z-index:2;pointer-events:none}.wake-body{position:absolute;inset:0;border-radius:2px;background:rgba(var(--step-ink),.16);overflow:hidden;animation:wakeBody .26s var(--ease) forwards}.wake-body .hit-fill{animation:wakeFall .26s var(--ease) forwards}.wake-ring{position:absolute;inset:0;border:1px solid rgba(var(--step-ink),.95);border-radius:2px;animation:wakeRing .3s var(--ease) forwards}@keyframes wakeBody{0%{opacity:1}to{opacity:0}}@keyframes wakeFall{to{height:0}}@keyframes wakeRing{0%{inset:0;border-radius:2px;opacity:.95}55%{inset:-1.6px;border-radius:3.6px;opacity:.4}to{inset:-2.5px;border-radius:4.5px;opacity:0}}.lane-ghost{position:absolute;top:0;bottom:0;z-index:2;border:1px solid rgba(var(--step-ink),.55);border-radius:2px;overflow:hidden;opacity:0;pointer-events:none;transition:opacity .12s var(--ease)}.lane-ghost.on{opacity:.7}.lane-ghost.mute{border-style:dashed;border-color:rgba(var(--step-ink),.4)}.lane-ghost.mute .hit-fill{background:transparent;border-top-style:dashed;border-top-color:rgba(var(--step-ink),.35)}.lane-ghost .hit-fill{background:rgba(var(--step-ink),.12);border-top-color:rgba(var(--step-ink),.5)}.lane-head-line{position:absolute;top:-3px;bottom:-3px;z-index:4;width:1px;background:#fffc;opacity:0;pointer-events:none;transition:opacity .2s var(--ease)}.lane-head-line.on{opacity:.8}.cell-note{position:absolute;left:0;right:0;bottom:0;height:11px;display:flex;align-items:center;justify-content:center;font-size:8.5px;font-weight:400;letter-spacing:.08em;color:#ffffff57;color:color-mix(in srgb,rgba(var(--step-ink),.42) calc(var(--step-mix, 0) * 100%),rgba(255,255,255,.34));font-variant-numeric:tabular-nums;pointer-events:none;opacity:0;transition:opacity .22s var(--ease)}body.keys-mode .cell-note,body.recording .cell-note{opacity:1}body.keys-mode .cell.playing~.cell-note,body.keys-mode .cell.selected~.cell-note,body.recording .cell.playing~.cell-note,body.recording .cell.selected~.cell-note{color:rgb(var(--step-ink))}body.keys-mode .cell.off~.cell-note,body.recording .cell.off~.cell-note{color:#fff3}.cell.off{background:transparent;border-color:rgba(var(--step-ink),.11)}.cell-dir{position:absolute;top:3px;right:4px;width:9px;height:9px;color:rgb(var(--step-ink, 150, 226, 255));opacity:0;transform:rotate(180deg);transform-origin:50% 50%;pointer-events:none;transition:opacity .22s var(--ease),transform .36s var(--ease)}.cell.flipped .cell-dir{opacity:.85}.cell.flipped:not(.backwards) .cell-dir{transform:rotate(0)}.lane-foot{grid-column:1 / -1;display:flex;align-items:center;gap:10px;height:16px;margin-top:-4px;min-width:0;padding-left:0}.rec{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;height:16px;padding:0;border:none;background:none;font-family:inherit;font-size:8px;font-weight:300;letter-spacing:.14em;text-transform:uppercase;color:#ffffff57;cursor:pointer;transition:color .18s var(--ease),opacity .25s var(--ease)}.rec:hover{color:#ffffffc7}.rec-word{white-space:nowrap}.loop{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;height:16px;padding:0;border:none;background:none;font-family:inherit;font-size:8px;font-weight:300;letter-spacing:.14em;text-transform:uppercase;color:#ffffff57;cursor:pointer;transition:color .18s var(--ease),opacity .25s var(--ease)}.loop:hover{color:#ffffffc7}.loop-word{white-space:nowrap}.loop-mark{width:11px;height:7px;display:block;flex:0 0 auto}body.light .loop{color:#0e0f1466}body.light .loop:hover{color:#0e0f14cc}.loop[aria-pressed=true],.loop[aria-pressed=true]:hover{color:var(--glow)}body.no-clock .loop{opacity:0;pointer-events:none}.rec-dot{width:6px;height:6px;border-radius:50%;background:#ffffff47;transition:background .18s var(--ease),box-shadow .18s var(--ease)}.rec:hover .rec-dot{background:#fff9}.rec[data-rec="1"],.rec[data-rec="1"]:hover{color:#ffab4a}.rec[data-rec="1"] .rec-dot,.rec[data-rec="1"]:hover .rec-dot{background:#ffab4a;box-shadow:0 0 7px #ffab4aa6}.rec[data-rec="2"],.rec[data-rec="2"]:hover{color:#ff4d45}.rec[data-rec="2"] .rec-dot,.rec[data-rec="2"]:hover .rec-dot{background:#ff4d45;box-shadow:0 0 8px #ff4d45bf}body.no-clock .rec{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s var(--ease),visibility 0s linear .22s}body.light .rec{color:#0e0f146b}body.light .rec:hover{color:#0e0f14d9}body.light .rec-dot{background:#0e0f1447}.cell-tip{grid-column:1 / -1;height:16px;margin-top:0;display:grid;grid-template-columns:minmax(0,1fr);clip-path:inset(-8px 0px);align-items:center;justify-items:center;font-size:8px;font-weight:300;letter-spacing:.11em;text-transform:uppercase;color:#ffffff3d;white-space:nowrap;pointer-events:none;opacity:0;transform:translateY(-6px);transition:opacity .2s var(--ease),transform .3s var(--ease)}.tip-line{grid-area:1 / 1;display:flex;align-items:center;gap:5px;width:max-content;margin-inline:auto;opacity:0;transition:opacity .13s var(--ease);pointer-events:none}.group.sequencer.hovering .tip-flip,.group.sequencer.hovering.on-pos .tip-pos,.group.sequencer.hovering.on-bar .tip-bar{opacity:1;transition:opacity .17s var(--ease) .12s}.group.sequencer.hovering.on-pos .tip-flip,.group.sequencer.hovering.on-bar .tip-flip{opacity:0;transition:opacity .13s var(--ease)}.tip-second{margin-left:2px}.tip-sweep{width:15px;height:9px;display:block;flex:none}.tip-sweep.tip-updown{width:9px;height:15px}.tip-combo{display:flex;align-items:center;gap:2px;color:#ffffffeb}.tip-key{width:17px;height:11px;display:block;flex:none}.tip-click{width:11px;height:16px;display:block;flex:none}.tip-plus{font-size:10px;line-height:1;letter-spacing:0}.tip-what{margin-left:1px}.cell-tip .tip-word,.cell-tip.win .tip-key{display:none}.cell-tip.win .tip-word{display:inline;font-size:8.5px;letter-spacing:.1em}body.light .tip-combo{color:#0e0f14e0}.group.sequencer.hovering .cell-tip{opacity:1;transform:none}body:not(.no-clock) .cell-tip{display:none}body:not(.no-clock){--panel-height: 296px}body.pattern-focus{--panel-height: 296px}body.light .cell-tip{color:#0e0f146b}.cells.hinting .cell:not(.flipped) .cell-dir{opacity:.24}.cells.hinting .cell:not(.flipped).backwards .cell-dir{transform:rotate(0)}.cell.off .cell-slice{color:#ffffff29}.cell-slice{position:absolute;top:1px;left:3px;font-size:8px;font-weight:400;letter-spacing:.04em;color:#ffffff61;font-variant-numeric:tabular-nums;transition:color .15s var(--ease);pointer-events:none}body.mapping .cell-slice{position:static;font-size:10px;letter-spacing:.06em}body.recording .cell-slice{font-size:10px;letter-spacing:.04em}.cell.off .cell-offset{opacity:.15}.cell.off.flipped .cell-dir{opacity:.3}.cell.playing,.cell.selected{background:rgba(var(--step-ink),.26);border-color:rgb(var(--step-ink));box-shadow:none}.cell.playing{transform:scale(.94)}.cell.playing .cell-slice,.cell.selected .cell-slice{color:#fff}.cell.off.playing .cell-slice,.cell.off.selected .cell-slice{color:#ffffff29}.cell-offset{position:absolute;left:4px;right:4px;bottom:5px;height:2px;background:#fff3;border-radius:2px;pointer-events:none}.cell-offset-mark{position:absolute;top:-2px;width:3px;height:6px;margin-left:-1.5px;border-radius:2px;background:rgb(var(--step-ink))}.cell{display:grid;grid-template-rows:1fr 12px;align-items:center;grid-template-columns:minmax(0,1fr);justify-content:stretch;border-top:1px solid rgba(var(--step-ink),.26);border-bottom:1px solid rgba(var(--step-ink),.26);border-left:0;border-right:0;border-radius:0}.cell:before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background:rgba(var(--step-ink),.12);pointer-events:none}.cell-slot.run-start .cell:before{display:none}.cell-slot:has(.cell.playing)+.cell-slot .cell:before,.cell-slot:has(.cell.selected)+.cell-slot .cell:before{display:none}.cell-slot.run-start .cell{border-left:1px solid rgba(var(--step-ink),.26);border-top-left-radius:8px;border-bottom-left-radius:8px}.cell-slot.run-end .cell{border-right:1px solid rgba(var(--step-ink),.26);border-top-right-radius:8px;border-bottom-right-radius:8px}.cell-slice{position:relative;top:auto;left:auto;display:flex;align-items:center;justify-content:center;width:100%;height:100%;line-height:1;text-align:center;font-size:11px;letter-spacing:.02em;color:#ffffff85;pointer-events:auto;transition:background .15s var(--ease),color .15s var(--ease);padding-right:1px}.cell-slot.run-end .cell .cell-slice{padding-right:0}.cell-slice:after{display:none}.cell-grab{position:relative;align-self:stretch;display:flex;align-items:center;touch-action:none;transition:background .15s var(--ease)}.cell:where(:not(.playing):not(.selected)):hover{background:rgba(var(--step-ink),.1)}.cell-offset{position:relative;left:auto;right:auto;bottom:auto;flex:1 1 auto;margin:0 5px;height:2px;border-radius:2px;background:#ffffff21;pointer-events:none;transition:background .16s var(--ease)}.cell.playing{transform:none}.cell-dir{top:4px;right:3px}.cell-slot .cell.playing,.cell-slot .cell.selected{border-color:transparent;box-shadow:none;outline:1px solid rgb(var(--step-ink));outline-offset:-1px}.cell-slot .cell.off:where(:not(.playing):not(.selected)){border-top-color:rgba(var(--step-ink),.26);border-bottom-color:rgba(var(--step-ink),.26)}.cell-slot.run-start .cell.off:where(:not(.playing):not(.selected)){border-left-color:rgba(var(--step-ink),.26)}.cell-slot.run-end .cell.off:where(:not(.playing):not(.selected)){border-right-color:rgba(var(--step-ink),.26)}.cell-slot .cell.playing .cell-slice:after,.cell-slot .cell.selected .cell-slice:after{right:1px}.cell-slot.run-end .cell.playing .cell-slice:after,.cell-slot.run-end .cell.selected .cell-slice:after{right:0}body.light .cell-slice:after{background:rgba(var(--step-ink),.3)}.bounce{display:flex;align-items:center;gap:5px;flex:0 0 auto;margin-left:auto;padding:2px 0;cursor:grab;align-self:center;transition:opacity .22s var(--ease),visibility 0s linear 0s,width .22s var(--ease),padding .22s var(--ease)}.bounce~.ghost.small.reset{align-self:center;margin-left:0}body.no-clock .bounce{opacity:0;visibility:hidden;pointer-events:none;width:0;min-width:0;padding-left:0;padding-right:0;overflow:hidden;transition:none}.bounce.holding{cursor:grabbing}.mapkeys{display:none;align-items:center;gap:5px;flex:0 0 auto;align-self:center;padding:2px 0}body.keys-mode.owns-tempo .mapkeys{display:flex}.ghost.small.mapkeys{font-size:8px;letter-spacing:.16em}.mapkeys-mark{width:14px;height:10px;display:block;opacity:.7}.mapkeys[aria-pressed=true]{color:var(--glow)}body.mapping .cells .cell{border-color:rgba(var(--glow-rgb),.34);background:rgba(var(--glow-rgb),.07);cursor:pointer}body.mapping .cells .cell:hover{border-color:rgba(var(--glow-rgb),.6);background:rgba(var(--glow-rgb),.12)}body.mapping .cell.listening{border-color:var(--glow);background:rgba(var(--glow-rgb),.18);animation:listening 1.3s var(--ease) infinite}@keyframes listening{0%,to{box-shadow:0 0 rgba(var(--glow-rgb),.34)}50%{box-shadow:0 0 0 3px rgba(var(--glow-rgb),0)}}@media(prefers-reduced-motion:reduce){body.mapping .cell.listening{animation:none}}body.mapping .cell .cell-slice{font-size:9px;letter-spacing:.04em;text-transform:uppercase;color:var(--text)}body.mapping .cell.unbound .cell-slice{color:#ffffff42}body.mapping .cell-tip .tip-line{display:none}body.mapping .cell-tip:before{content:attr(data-mapping);font-size:8.5px;letter-spacing:.1em;color:#fff6}body.mapping .cell-tip{opacity:1;transform:none}.ghost.small.bounce{font-size:8px;letter-spacing:.16em}.bounce.working{color:var(--glow)}.bounce-mark{width:13px;height:13px;display:block;flex:none;opacity:.75}.bounce.failed{color:#ffaa8ce6}@media(max-width:1180px){.cells{--cell-h: 32px}.cells{row-gap:6px}.cells{--lane-h: 34px}}body.light{--ink: #f4f4f6;--text: rgba(14, 15, 19, .94);--dim: rgba(14, 15, 19, .58);--faint: rgba(14, 15, 19, .4);--hairline: rgba(14, 15, 19, .12);--divider: rgba(14, 15, 20, .08);--pane: rgba(14, 15, 19, .035)}body.light .mark{color:#0e0f14}body.light,html:has(body.light){background:#f4f4f6}body.light #gl{opacity:1;mix-blend-mode:normal}body.light #particles{opacity:.42;filter:invert(1);mix-blend-mode:multiply}body.light #vignette{background:radial-gradient(140% 95% at 50% 40%,transparent 42%,rgba(14,15,20,.09) 82%,rgba(14,15,20,.18) 100%)}body.light #grain{opacity:.022;mix-blend-mode:multiply}body.light #panel{background:linear-gradient(to bottom,#fff9,#ffffffd1)}body.light #panel:before{background:linear-gradient(to bottom,transparent,rgba(255,255,255,.42))}body.light .group-name{color:#0e0f1480}body.light .group-hint{color:#0e0f1470}body.light .mini-label,body.light .knob-label{color:#0e0f1480}body.light .knob-value{color:#0e0f14b8}body.light .knob:hover .knob-label,body.light .knob.active .knob-label{color:#0e0f14c7}body.light{--knob-face: rgba(14, 15, 19, .03);--knob-edge: rgba(14, 15, 19, .13)}body.light .knob .k0{stop-color:#fff}body.light .knob .k1{stop-color:#e4e6ec}body.light .knob .k2{stop-color:#cfd2db}body.light .knob .pointer{stroke:#0e0f14cc}body.light .knob .body{stroke:#0e0f1424}body.light .knob .track{stroke:#0e0f141f}body.light .ghost{color:var(--dim)}body.light .ghost:hover{color:var(--text)}body.light .preset-step,body.light .preset-name,body.light .preset-confirm,body.light .preset-item{color:var(--dim)}body.light .preset-step:hover,body.light .preset-name:hover,body.light .preset-confirm:hover{color:var(--text)}body.light .preset-item:hover{color:var(--text);background:#0e0f140f}body.light .preset-item.on{color:var(--glow)}body.light .preset-item.is-init{color:color-mix(in srgb,var(--glow) 58%,transparent)}body.light .preset-item.is-init.on{color:var(--glow)}body.light .preset-field{color:var(--text)}body.light .preset-menu,body.light .preset-submenu{background:#fafafc;box-shadow:0 20px 48px #0e0f1429}body.light .preset-group:hover>.drawer,body.light .preset-group.open>.drawer{color:var(--text);background:#0e0f140f}body.light .preset-group.holding>.drawer{color:var(--glow)}body.light .preset-submenu::-webkit-scrollbar-thumb{background-color:#0e0f142e}body.light .preset-submenu:hover::-webkit-scrollbar-thumb{background-color:#0e0f144d}body.light .toggle,body.light .segment{color:var(--dim);background:#fff9;border-color:var(--hairline)}body.light .stepper{color:var(--dim)}body.light .stepper:hover,body.light .stepper.active{color:var(--text)}body.light .segment button{color:#0e0f1485}body.light .segment button:hover{color:#0e0f14cc}body.light .segment button.on{color:#0e0f13f0;background:var(--glow)}body.light .toggle .dot{background:#0e0f1433}body.light .toggle.on{color:var(--text);border-color:#0e0f1447}body.light .meter{background:#0e0f1414}body.light .cell{background:#ffffffb8;border-color:rgba(var(--step-ink),.62)}body.light .cell-slice:hover,body.light .cell-grab:hover{background:#fff}body.light .cell.off{background:transparent;border-color:rgba(var(--step-ink),.4)}body.light .cell.off .cell-slice{color:#0e0f145c}body.light .cell-slice{color:#0e0f14ad}body.light .lane{background:#0e0f1406}body.light .lane{background:#0e0f140f}body.light .hit-cell{color:#0e0f14a8}body.light .hit.playing .hit-cell,body.light .hit.chosen .hit-cell{color:#0e0f14eb}body.light .hit.mute .hit-cell{color:#0e0f144d}body.light .lane-head-line{background:#0e0f14bf}body.light .cell-offset{background:#0e0f1433}body.light .cell.playing,body.light .cell.selected{background:#fffffff2}body.light .cell.playing .cell-slice,body.light .cell.selected .cell-slice{color:#0e0f14eb}body.light .cell.off.playing .cell-slice,body.light .cell.off.selected .cell-slice{color:#0e0f145c}body.light .pkey.natural{background:#ffffffb8}body.light .pkey.natural:hover{background:#fff}body.light .pkey.sharp{background:#14151ae0}body.light .pkey.sharp:hover{background:#14151af5}body.light #dropzone{background:#f4f4f6c7}body.light #pianoToggle,body.light #motionToggle,body.light #cropToggle{color:#0e0f14d9}body.light #cropReadout{color:var(--dim)}body.light .drop-title{color:#0e0f14d1}body.light .drop-ring{border-color:#0e0f1433}body.light .drop-ring:after{border-color:#0e0f1414}body.light .analysing-track{background:#0e0f141f}body.light .source-meta{color:#0e0f1475}body.light #fault{background:#ffececf2;border-color:#b4282859;color:#781414f2}#dimensionToggle{position:fixed;left:calc(var(--panel-inset) + 34px);bottom:calc(var(--panel-height) + var(--mark-lift));height:21px;align-items:center;line-height:1;z-index:22;display:none;padding:0;border:0;background:none;font-family:inherit;font-size:9px;font-weight:400;letter-spacing:.18em;color:#ffffffe6;cursor:pointer;opacity:.42;font-variant-numeric:tabular-nums;transition:transform .34s var(--ease),opacity .22s var(--ease),color .22s var(--ease)}body.piano-open #dimensionToggle,body.piano-open #motionToggle,body.piano-open #cropToggle,body.piano-open #cropReadout,body.piano-open #zoomReadout{transform:translateY(calc(-1 * var(--piano-height) - 6px))}body.loaded #dimensionToggle{display:flex}#dimensionToggle:hover{opacity:.95}#dimensionToggle.on{opacity:1;color:var(--glow)}body.rounded #cropToggle,body.rounded #zoomReadout{opacity:0;pointer-events:none}body.light #dimensionToggle{color:#0e0f14d9}#motionToggle{position:fixed;right:calc(var(--panel-inset) + 32px);bottom:calc(var(--panel-height) + var(--mark-lift));z-index:22;display:none;padding:0;border:0;background:none;cursor:pointer;color:#ffffffe6;opacity:.5;transition:transform .34s var(--ease),opacity .22s var(--ease),color .22s var(--ease)}body.loaded #motionToggle,body.glitch #motionToggle{display:block}#motionToggle svg{width:20px;height:20px;display:block}#motionToggle:hover{opacity:.95}#motionToggle.on{opacity:1;color:var(--glow)}#motionToggle:after{content:"";position:absolute;top:-1px;right:-3px;width:5px;height:5px;border-radius:50%;background:var(--glow);box-shadow:0 0 7px var(--glow);opacity:0;transition:opacity .2s var(--ease)}#motionToggle.live:after{opacity:1}body.light #motionToggle{color:#0e0f14d9}body.glitch #cropToggle,body.glitch #zoomReadout,body.glitch #pianoToggle,body.glitch #dimensionToggle{opacity:0;pointer-events:none}body.glitch #piano{opacity:0;pointer-events:none;transform:translateY(16px) scaleY(.92)}#motion{position:fixed;left:0;right:0;top:calc(var(--header-height) + 26px);bottom:calc(var(--panel-height) + 26px);z-index:14;padding:0 clamp(24px,5vw,76px);display:flex;flex-direction:column;gap:16px;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .28s var(--ease),transform .34s var(--ease)}#motion.picking{z-index:22}body.glitch #motion{opacity:1;transform:none;pointer-events:auto}.curve-view{position:relative;flex:1 1 auto;min-height:0}.curve-view svg{width:100%;height:100%;display:block}#curveGrid line{stroke:#ffffff08;stroke-width:1}#curveGrid line.beat{stroke:#ffffff1f}body.light #curveGrid line{stroke:#0e0f140b}body.light #curveGrid line.beat{stroke:#0e0f1429}#mainPath{fill:none;stroke:var(--glow);stroke-width:2.2;stroke-linejoin:round;vector-effect:non-scaling-stroke}#mainGlowPath{fill:none;stroke:var(--glow);stroke-width:7;opacity:.18;stroke-linejoin:round;vector-effect:non-scaling-stroke}#ghostPath{fill:none;stroke:#ffffff29;stroke-width:1.2;stroke-linejoin:round;vector-effect:non-scaling-stroke}#motion.vol-hand #mainPath,#motion.vol-hand #mainGlowPath{stroke:#ffffffd9}body.light #ghostPath{stroke:#0e0f1433}body.light #motion.vol-hand #mainPath,body.light #motion.vol-hand #mainGlowPath{stroke:#0e0f14cc}#curveFreeze{stroke:#ffffff17;stroke-width:1;stroke-dasharray:5 6}body.light #curveFreeze{stroke:#0e0f141f}#curvePlay{stroke:var(--glow);stroke-width:2;opacity:.9}#curveScale text{font-family:inherit;font-size:9px;letter-spacing:.06em;fill:#ffffff4d}body.light #curveScale text{fill:#0e0f1466}.curve-caption{position:absolute;left:6px;bottom:2px;font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--dim);pointer-events:none}.curve-bar{flex:0 0 auto;display:flex;align-items:center;gap:14px}.power{width:30px;height:30px;padding:0;flex:0 0 auto;display:flex;align-items:center;justify-content:center;color:var(--dim);background:none;border:0;cursor:pointer;transition:color .18s var(--ease),filter .18s var(--ease)}.power svg{width:17px;height:17px;display:block}.power svg path{fill:none;stroke:currentColor;stroke-width:1;stroke-linecap:round}.power:hover{color:var(--text)}.power.on{color:var(--glow);filter:drop-shadow(0 0 5px color-mix(in srgb,var(--glow) 55%,transparent))}#motion.off,#motionPanel.off{--glow: #5f646b;--text: rgba(255, 255, 255, .62);--dim: rgba(255, 255, 255, .3);--faint: rgba(255, 255, 255, .14);--hairline: rgba(255, 255, 255, .05);--pane: rgba(255, 255, 255, .018)}body.light #motion.off,body.light #motionPanel.off{--glow: #9aa0a8;--text: rgba(14, 15, 19, .6);--dim: rgba(14, 15, 19, .34);--faint: rgba(14, 15, 19, .22);--hairline: rgba(14, 15, 19, .07);--pane: rgba(14, 15, 19, .02)}#motion.off .curve-view,#motionPanel.off .curve-view,#motionPanel.off .bank-grid,#motionPanel.off .motion-side-knobs{opacity:.55}#motion.off .curve-view,#motionPanel.off .curve-view{transition:opacity .24s var(--ease)}#curveGuides line{stroke:#ffffff0b;stroke-width:1}body.light #curveGuides line{stroke:#0e0f140f}.curve-handles{position:absolute;inset:0;pointer-events:none}.curve-handles i{position:absolute;transform:translate(-50%,-50%);border-radius:50%;pointer-events:auto;cursor:grab;transition:background .14s var(--ease),border-color .14s var(--ease),transform .1s var(--ease)}.curve-point{width:9px;height:9px;background:var(--ink);border:1.6px solid var(--glow);box-shadow:0 0 8px color-mix(in srgb,var(--glow) 55%,transparent)}.curve-point:hover{transform:translate(-50%,-50%) scale(1.25)}.curve-point.on{background:var(--glow)}.curve-tension-handle{width:7px;height:7px;background:transparent;border:1.4px solid rgba(255,255,255,.34);cursor:ns-resize}.curve-tension-handle:hover,.curve-tension-handle.on{border-color:var(--text);background:#ffffff24}#motion.vol-hand .curve-point{border-color:#ffffffd9;box-shadow:none}#motion.vol-hand .curve-point.on{background:#ffffffd9}body.light .curve-tension-handle{border-color:#0e0f1459}body.light #motion.vol-hand .curve-point{border-color:#0e0f14cc}body.light #motion.vol-hand .curve-point.on{background:#0e0f14cc}.curve-readout{position:absolute;right:8px;top:6px;font-size:10px;font-variant-numeric:tabular-nums;letter-spacing:.1em;color:var(--glow);opacity:0;pointer-events:none;transition:opacity .12s var(--ease)}.curve-readout.on{opacity:1}.curve-tools{display:flex;align-items:center;gap:clamp(12px,2vw,26px);margin-left:auto;opacity:0;pointer-events:none;transition:opacity .2s var(--ease)}#motion.editing .curve-tools{opacity:1;pointer-events:auto}.curve-tool-group,.picker{display:flex;align-items:center;gap:7px;position:relative}.curve-tool-label{font-size:8px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}.curve-tension{font-size:9.5px;font-variant-numeric:tabular-nums;color:var(--text);min-width:38px}.picker-face{position:relative;font-family:inherit;font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text);background:#ffffff0a;border:1px solid var(--hairline);border-radius:5px;padding:5px 20px 5px 8px;cursor:pointer;white-space:nowrap;display:flex;align-items:center;gap:7px;transition:color .14s var(--ease),background .14s var(--ease),border-color .14s var(--ease)}.picker-face:after{content:"";position:absolute;right:8px;width:5px;height:5px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-1px) rotate(45deg);opacity:.5}.picker.small .picker-face{min-width:52px}.picker-face:hover:not(:disabled){background:#ffffff14;border-color:#fff3}.picker-face:disabled{opacity:.35;cursor:default}.picker.open .picker-face{border-color:var(--glow);color:var(--glow)}.picker-icon{width:30px;height:14px;display:block;flex:0 0 auto}.picker-icon path{fill:none;stroke:currentColor;stroke-width:1;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}.picker-menu{position:absolute;top:calc(100% + 8px);left:0;z-index:40;min-width:100%;padding:5px;display:none;flex-direction:column;gap:1px;background:#09090ce0;backdrop-filter:blur(24px) saturate(1.25);-webkit-backdrop-filter:blur(24px) saturate(1.25);border:1px solid var(--hairline);border-radius:9px;box-shadow:0 18px 40px #0009}.picker.open .picker-menu{display:flex}.picker-item{font-family:inherit;font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);background:none;border:0;border-radius:5px;padding:5px 9px;cursor:pointer;white-space:nowrap;text-align:left;display:flex;align-items:center;gap:9px;transition:color .12s var(--ease),background .12s var(--ease)}.picker-item:hover{color:var(--text);background:#ffffff12}.picker-item.on{color:var(--glow)}#curveRevert{flex:0 0 auto;padding:5px 9px;font-size:8px}#syncPicker{flex:0 0 auto;margin-left:14px}#syncPicker.armed .picker-face{color:var(--glow);border-color:var(--glow)}body.light .picker-face{background:#ffffff8c}body.light .picker-menu{background:#fafafceb;box-shadow:0 18px 40px #0e0f142e}#motionPanel{position:fixed;left:0;right:0;bottom:0;height:var(--panel-height);z-index:21;padding:22px 30px 24px;display:flex;align-items:stretch;gap:clamp(18px,4vw,56px);background:linear-gradient(to bottom,#0a0a0d6b,#08080ba8);backdrop-filter:blur(24px) saturate(1.25);-webkit-backdrop-filter:blur(24px) saturate(1.25);opacity:0;visibility:hidden;transform:translateY(6px);pointer-events:none;transition:opacity .26s var(--ease),transform .3s var(--ease),visibility 0s linear .26s}body.light #motionPanel{background:linear-gradient(to bottom,#fff9,#ffffffd1)}#motionPanel:after{content:"";position:absolute;left:0;right:0;top:0;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent 0,var(--hairline) clamp(30px,11vw,190px),var(--hairline) calc(100% - clamp(30px,11vw,190px)),transparent 100%)}body.glitch #motionPanel{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition:opacity .26s var(--ease),transform .3s var(--ease),visibility 0s linear 0s}#panel{transition:opacity .26s var(--ease),transform .3s var(--ease),visibility 0s linear 0s}body.glitch #panel{opacity:0;visibility:hidden;transform:translateY(6px);pointer-events:none;transition:opacity .26s var(--ease),transform .3s var(--ease),visibility 0s linear .26s}.bank-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:10px}.bank-title{font-size:8.5px;font-weight:500;letter-spacing:.3em;text-transform:uppercase}.bank-title.time-key{color:var(--glow)}.bank-title.vol-key{color:var(--dim)}.bank-pages{height:13px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:8px;font-weight:300;letter-spacing:.14em;color:var(--faint);font-variant-numeric:tabular-nums}.bank-pages.one{visibility:hidden}.bank-pages button{width:13px;height:13px;padding:0;border:0;background:none;color:var(--dim);cursor:default;transition:color .15s var(--ease),opacity .15s var(--ease)}.bank-pages button:hover{color:var(--text)}.bank-pages button[disabled]{opacity:.22}.bank-pages button svg{width:13px;height:13px;display:block}.bank-grid{display:grid;grid-template-columns:repeat(5,1fr);grid-auto-rows:28px;gap:3px;max-height:100%;overflow-y:auto;scrollbar-width:none}.bank-grid::-webkit-scrollbar{display:none}.bank-grid button.slot-hole{color:#ffffff29;background:transparent;pointer-events:none}body.light .bank-grid button.slot-hole{color:#0e0f142e}.bank-grid button.blank{color:#ffffff29;background:transparent}body.light .bank-grid button.blank{color:#0e0f142e}.bank-grid button{font-family:inherit;font-size:8.5px;font-weight:400;letter-spacing:.1em;text-transform:uppercase;color:#ffffff6b;background:#ffffff07;border:1px solid var(--hairline);border-radius:5px;padding:3px 4px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:1px;transition:color .16s var(--ease),background .16s var(--ease),border-color .16s var(--ease)}.slot-icon{display:block;width:100%;height:13px;flex:0 0 auto}.slot-icon path{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}.slot-name{font-size:6.5px;line-height:1.05;letter-spacing:.1em;opacity:.7;flex:0 0 auto;overflow:hidden;text-overflow:ellipsis}.bank-grid button.slot-off{display:flex;align-items:center;justify-content:center;font-size:8.5px;letter-spacing:.18em}.bank-grid button.blank .slot-icon{opacity:0}.bank-grid button.blank .slot-name{font-size:9px;opacity:1}.bank-grid button:hover{color:var(--text);background:#ffffff14}#gridTime button.on{color:var(--glow);border-color:var(--glow);background:color-mix(in srgb,var(--glow) 12%,transparent)}#gridVol button.on{color:var(--text);border-color:#ffffff8c;background:#ffffff17}body.light .bank-grid button{color:#0e0f1480;background:#ffffff8c}body.light .bank-grid button:hover{color:var(--text);background:#fff}body.light #gridVol button.on{color:var(--text);border-color:#0e0f1499;background:#0e0f1412}.motion-side{flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}.motion-side-knobs{display:flex;align-items:flex-start;gap:clamp(10px,2.6vw,34px)}.motion-side-knobs .knob{max-width:none;width:46px}#motionClear{padding:2px 0;font-size:8px;letter-spacing:.16em}#cropToggle{position:fixed;right:var(--panel-inset);bottom:calc(var(--panel-height) + var(--mark-lift));z-index:22;display:none;padding:0;border:0;background:none;cursor:pointer;color:#ffffffe6;opacity:.5;transition:transform .34s var(--ease),opacity .22s var(--ease),color .22s var(--ease)}body.loaded #cropToggle{display:block}#cropToggle svg{width:20px;height:20px;display:block}#cropToggle:hover{opacity:.95}#cropToggle.on{opacity:1;color:var(--glow)}#cropReadout{position:fixed;right:84px;bottom:calc(var(--panel-height) + var(--mark-lift) + 1px);z-index:22;pointer-events:none;font-size:9px;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);font-variant-numeric:tabular-nums;white-space:nowrap;opacity:0;transition:transform .34s var(--ease),opacity .3s var(--ease)}body.cropping #cropReadout{opacity:1}#particles{transition:opacity .4s var(--ease)}body.cropping #particles,body.rounded #particles,body.glitch #particles{opacity:0}#gl{transition:opacity .45s var(--ease)}body.rounded #gl,body.glitch #gl{opacity:0}#grain{transition:opacity .4s var(--ease)}body.glitch #grain{opacity:0!important}body.cropping .group.grain .lead,body.cropping .knobs.five,body.cropping #modeField,body.cropping #gridField,body.cropping .select-wrap,body.cropping .cells,body.cropping .cell-tip,body.cropping .knob[data-param=spread],body.cropping .knob[data-param=reverb],body.cropping .knob[data-param=shimmer],body.cropping #filterZone,body.cropping #envelopePicker{opacity:.28;pointer-events:none;transition:opacity .3s var(--ease)}body.travelling .knob[data-param=density],body.travelling .knob[data-param=size],body.travelling .knob[data-param=spray],body.travelling .knob[data-param=detune],body.travelling #syncToggle,body.travelling #envelopePicker>:not(.tint){opacity:.28;pointer-events:none;transition:opacity .3s var(--ease)}.knob[data-param=density],.knob[data-param=size],.knob[data-param=spray],.knob[data-param=detune],#syncToggle,#travelToggle,#envelopePicker>:not(.tint){will-change:opacity}#cropSurface{position:fixed;left:0;right:0;top:calc(var(--header-height) + 24px);bottom:calc(var(--panel-height) + 22px);z-index:21;display:none;touch-action:none;cursor:grab}body.cropping #cropSurface{display:block}body.cropping #cropSurface.dragging{cursor:grabbing}body.cropping #cropSurface.edge{cursor:ew-resize}body.cropping #zoomReadout{opacity:0!important}body.cropping #pianoToggle,body.cropping #dimensionToggle,body.cropping #motionToggle{opacity:0;pointer-events:none}body.cropping #piano{opacity:0;pointer-events:none;transform:translateY(16px) scaleY(.92)}#zoomReadout{position:fixed;right:calc(var(--panel-inset) + 32px + 20px + 14px);bottom:calc(var(--panel-height) + var(--mark-lift));height:20px;display:flex;align-items:center;z-index:22;pointer-events:none;font-size:9px;font-weight:400;letter-spacing:.14em;color:var(--dim);font-variant-numeric:tabular-nums;opacity:0;transition:transform .34s var(--ease),opacity .45s var(--ease)}#zoomReadout.visible{opacity:1}.group.output,.group.grain,.group.sequencer{flex:1 1 0}.group.grain .lead{position:relative;display:flex;justify-content:center;padding-bottom:4px}.group.grain .lead .toggle.icon{position:absolute;top:46px;left:50%;margin:-15px 0 0 55px}.group.grain .lead .toggle.icon.direction{margin-left:-85px}.group.grain .lead .toggle.icon.travel{margin-left:81px}.toggle.icon.direction svg{transform-origin:50% 50%;transition:transform .42s var(--ease)}.toggle.icon.direction.on svg{transform:rotate(180deg)}.toggle.icon{width:30px;height:30px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:50%;border-color:transparent;background:none;color:#ffffff61}.toggle.icon svg{width:17px;height:17px;display:block}.toggle.icon:hover{color:#ffffffd9}#syncToggle>svg{position:absolute;inset:0;margin:auto}#syncToggle .free{position:absolute;inset:0;display:grid;place-items:center;font-size:10px;font-weight:400;letter-spacing:.05em;text-transform:none;text-indent:.05em}#syncToggle>svg,#syncToggle .free{transition:opacity .3s var(--ease),transform .38s var(--ease)}#syncToggle>svg{opacity:0;transform:scale(.55)}#syncToggle .free{opacity:1;transform:scale(1)}#syncToggle.on>svg{opacity:1;transform:scale(1)}#syncToggle.on .free{opacity:0;transform:scale(.55)}.toggle.icon.on{color:var(--glow);border-color:transparent;background:none}body.light .toggle.icon{color:#0e0f1466}body.light .toggle.icon.on{color:var(--glow)}.group.grain .knobs{flex:0 0 auto}.readout{margin-top:auto;display:flex;flex-direction:column}#scope{display:block;width:100%;height:15px;margin-top:3px;-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.48) 4.5%,rgba(0,0,0,.86) 9.2%,#000 14%,#000 86%,rgba(0,0,0,.86) 90.8%,rgba(0,0,0,.48) 95.5%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.48) 4.5%,rgba(0,0,0,.86) 9.2%,#000 14%,#000 86%,rgba(0,0,0,.86) 90.8%,rgba(0,0,0,.48) 95.5%,transparent 100%)}.readout .meter{margin-top:5px}.meters{display:flex;flex-direction:column;gap:3px;padding:0 2px 2px}.meters .meter{margin:0}.knob.huge{max-width:118px;margin-bottom:2px}.knobs.three{grid-template-columns:repeat(3,1fr);gap:12px 2px}.knobs.three .knob.middle{grid-column:1 / -1;justify-self:center}.group.output .knobs{row-gap:6px}.knobs.three .filter{grid-column:1 / -1;justify-self:stretch;display:flex;flex-direction:column;gap:7px;min-width:0;margin-top:5px;margin-bottom:16px}.filter{position:relative;height:54px;--trace-rgb: var(--glow-rgb, 140, 232, 255)}.filter.open{--trace-rgb: 95, 100, 107}body.light .filter.open{--trace-rgb: 154, 160, 168}.filter-head{position:absolute;left:-4px;top:0;right:auto;display:flex;gap:5px;padding:4px 4px 0 0;background:none;border:0;cursor:pointer;transform:translateY(32px);align-items:center;transition:transform .3s var(--ease) .3s}.filter.open .filter-head{transform:none;transition-delay:0s}.filter-lip{position:relative;width:112px;height:22px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;gap:5px;padding:3px 14px 0}.filter-rail{position:absolute;left:0;top:0;display:block;fill:none;stroke:url(#filterRailFade);stroke-width:1;stroke-linecap:round;color:rgba(var(--trace-rgb),.5);pointer-events:none;transition:color .18s var(--ease)}.filter-head:hover .filter-rail{color:rgb(var(--trace-rgb))}.rail-tip{stop-opacity:0;transition:stop-opacity .22s var(--ease) .3s}.filter.open .rail-tip{stop-opacity:1;transition:stop-opacity .1s var(--ease) 0s}.filter-trace{position:absolute;left:-20px;top:0;display:block;fill:none;stroke-width:1;stroke-linecap:round;stroke:url(#filterTraceFade);color:rgba(var(--trace-rgb),.5);pointer-events:none;transform:translateY(32px);transition:color .18s var(--ease),transform .3s var(--ease) .3s}.filter.open .filter-trace{transform:none;transition:color .18s var(--ease),transform .3s var(--ease) 0s}.filter:has(.filter-head:hover) .filter-trace{color:rgb(var(--trace-rgb))}.trace-arm{stroke-dasharray:var(--arm-len, 0);stroke-dashoffset:var(--arm-len, 0);transition:stroke-dashoffset .3s var(--ease) 0s}.filter.open .trace-arm{stroke-dashoffset:0;transition:stroke-dashoffset .44s var(--ease) .1s}.filter.remeasuring .trace-arm{transition:none}.filter-arrow{width:9px;height:9px;margin-left:-12px;display:block;fill:none;stroke:rgba(var(--glow-rgb, 140, 232, 255),.8);stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;opacity:0;transform:rotate(-90deg);transition:opacity .18s var(--ease),transform .3s var(--ease)}.filter.open .filter-arrow{transform:rotate(90deg)}.filter-head:hover .filter-arrow{opacity:1}.filter-name{font-size:8.5px;font-weight:500;letter-spacing:.34em;text-transform:uppercase;color:#ffffff26;transition:color .18s var(--ease)}.filter.on .filter-name{color:#ffffff4d}body.light .filter-name{color:#0e0f143d}body.light .filter.on .filter-name{color:#0e0f1480}.power.small{width:18px;height:18px}.power.small,.power.small.on{filter:none;transition:color .18s var(--ease)}span.power{display:flex;align-items:center;justify-content:center;flex:0 0 auto}.power.small svg{width:13px;height:13px}.knobs.three .filter+.knob{margin-top:8px}.cut-row{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:flex-start;gap:7px;opacity:0;transform:translateY(5px);pointer-events:none;transition:opacity .22s var(--ease) .3s,transform .3s var(--ease) .3s}.filter.open .cut-row{opacity:1;transform:none;pointer-events:auto;transition-delay:0s}.slope{flex:0 0 auto;padding:0 2px;background:none;border:0;align-self:flex-start;margin-top:-4px;cursor:pointer;display:flex;align-items:center;color:rgba(var(--glow-rgb, 140, 232, 255),.62);transition:color .18s var(--ease)}.slope:hover{color:rgb(var(--glow-rgb, 140, 232, 255))}.slope svg{width:26px;height:14px;display:block}.slope svg path{fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.mode-name{font-size:7.5px;letter-spacing:.16em;text-transform:uppercase;color:#ffffff38;white-space:nowrap}.cut-holder{flex:1 1 auto;min-width:0}.cut-frame{position:relative;width:100%;height:16px;display:flex;align-items:flex-start}.cut-well{position:relative;width:100%;height:8px;background:#ffffff12;border:0;border-radius:4px;overflow:hidden;cursor:default}body.light .cut-well{background:#0e0f1417}.cut-band{position:absolute;top:0;bottom:0;background:var(--glow);pointer-events:none}.cut-pin{position:absolute;bottom:0;width:0;height:0;margin-left:-3.5px;border-left:3.5px solid transparent;border-right:3.5px solid transparent;border-bottom:5px solid rgba(255,255,255,.86);cursor:default;transition:border-bottom-color .14s var(--ease)}.cut-pin:hover,.cut-pin.holding{border-bottom-color:#fff}body.light .cut-pin{border-bottom-color:#0e0f14c7}body.light .cut-pin:hover,body.light .cut-pin.holding{border-bottom-color:#0e0f14}.filter:not(.on){--glow: #5f646b;--glow-rgb: 95, 100, 107;--hairline: rgba(255, 255, 255, .05);--pane: rgba(255, 255, 255, .018)}.filter:not(.on) .cut-pin{border-bottom-color:#ffffff4d}body.light .filter:not(.on){--glow: #9aa0a8;--glow-rgb: 154, 160, 168;--hairline: rgba(14, 15, 19, .07);--pane: rgba(14, 15, 19, .02)}body.light .filter:not(.on) .cut-pin{border-bottom-color:#0e0f134d}.knobs.five{display:flex;flex-wrap:nowrap;justify-content:center;align-items:flex-start}.knobs.five:before{content:"";flex:0 1 24px;width:24px;min-width:0}.knobs.five .knob{flex:none;width:46px;max-width:none;margin:0 clamp(1px,calc(3.33vw - 33.3px),8px)}.knobs.five .knob-label{font-size:8px;letter-spacing:.07em}.knobs.five .knob.extra{width:0;margin-left:0;margin-right:0;opacity:0;overflow:hidden;pointer-events:none;transition:width .42s var(--ease),margin .42s var(--ease),opacity .26s var(--ease)}.group.grain.open .knobs.five .knob.extra{width:46px;margin:0 clamp(1px,calc(3.33vw - 33.3px),8px);opacity:1;pointer-events:auto;transition:width .42s var(--ease),margin .42s var(--ease),opacity .3s var(--ease) .12s}body.travelling .group.grain.open .knobs.five .knob.extra{opacity:.28;pointer-events:none}.more{flex:none;align-self:flex-start;margin-top:12px;width:22px;height:22px;padding:0;display:flex;align-items:center;justify-content:center;border:none;border-radius:50%;background:none;color:#ffffff42;cursor:pointer;transition:color .25s var(--ease)}.more svg{width:15px;height:15px;display:block;transition:transform .42s var(--ease)}.more:hover{color:var(--text)}.more:active{transform:scale(.94)}.group.grain.open .more svg{transform:rotate(180deg)}.more.marked{color:var(--glow)}body.light .more{color:#0e0f144d}body.light .more:hover{color:var(--text)}body.light .more.marked{color:var(--glow)}.envelope{margin-top:auto;display:flex;align-items:center;justify-content:center;gap:4px;padding:1px 0;border:0;background:none;opacity:1;transform:none;transition:opacity .22s var(--ease),transform .26s var(--ease),visibility 0s}body.two-runs{--roll-slit: 1.5px}.envelope .mini-label{margin-right:10px}.tint{margin-left:18px;padding:4px 2px 4px 18px;border:0;border-left:1px solid var(--hairline);background:none;cursor:pointer;display:flex;align-items:center;gap:8px;font-family:inherit;color:var(--dim);transition:color .22s var(--ease)}.tint:hover{color:var(--text)}.tint-word{font-size:8px;letter-spacing:.2em;text-transform:uppercase}.tint-swatches{display:flex;gap:2px}.tint-swatches i{width:4px;height:9px;border-radius:1px;background:currentColor;opacity:.55;transition:background .22s var(--ease),opacity .22s var(--ease)}.tint[aria-pressed=true]{color:var(--text)}.tint[aria-pressed=true] .tint-swatches i{opacity:1}.tint[aria-pressed=true] .tint-swatches i:nth-child(1){background:#21c7ff}.tint[aria-pressed=true] .tint-swatches i:nth-child(2){background:#e38eff}.tint[aria-pressed=true] .tint-swatches i:nth-child(3){background:#ff9470}.tint[aria-pressed=true] .tint-swatches i:nth-child(4){background:#37db00}.envelope .step{display:flex;align-items:center;justify-content:center;color:var(--dim);background:none;border:0;padding:4px 2px;cursor:pointer;transition:color .18s var(--ease)}.envelope .step svg{width:12px;height:12px;display:block;flex:none}.envelope .step:hover{color:var(--text)}.envelope-face{display:flex;flex-direction:column;align-items:center;gap:1px;padding:0 2px}.envelope-face svg{display:block;width:74px;height:21px;overflow:visible}.envelope-face path{fill:none;stroke:var(--glow);stroke-width:1;stroke-linecap:round;stroke-linejoin:round}.envelope-name{font-size:8px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:#ffffff57}body.light .envelope-name{color:#0e0f1473}#unlock{position:fixed;inset:0;z-index:120;cursor:default;display:flex;align-items:center;justify-content:center;background:var(--ink);opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility 0s linear .45s}body.locked #unlock{opacity:1;visibility:visible;transition:opacity .45s var(--ease),visibility 0s linear 0s}.unlock-inner{display:flex;flex-direction:column;align-items:center;gap:0;padding:0 40px}.unlock-mark{font-size:15px;font-weight:500;letter-spacing:.42em;text-transform:uppercase;line-height:1;margin:0;color:#fff}.unlock-line{margin:18px 0 26px;font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}.unlock-row{display:flex;align-items:stretch;gap:10px;width:min(520px,70vw)}#unlockKey{flex:1 1 auto;min-width:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;letter-spacing:.02em;color:var(--text);background:#ffffff09;border:1px solid var(--hairline);border-radius:7px;padding:0 12px;height:34px;outline:none;transition:border-color .2s var(--ease),background .2s var(--ease)}#unlockKey::placeholder{color:var(--faint);letter-spacing:.16em}#unlockKey:focus{border-color:#ffffff38;background:#ffffff0e}body.light #unlockKey{background:#ffffffb3}.unlock-go{flex:0 0 auto;font-family:inherit;font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);background:var(--glow);border:0;border-radius:7px;padding:0 20px;height:34px;cursor:pointer;transition:opacity .2s var(--ease),transform .12s var(--ease)}.unlock-go:hover{opacity:.9}.unlock-go:active{transform:scale(.97)}.unlock-word{margin:20px 0 0;min-height:12px;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);transition:color .2s var(--ease)}.unlock-word.bad{color:#ff6b5e}.unlock-machine{margin:26px 0 0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:8px;letter-spacing:.16em;color:var(--faint);user-select:text;cursor:text}#licensed{position:fixed;left:26px;bottom:7px;z-index:25;font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);pointer-events:none;max-width:300px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;opacity:0;transition:opacity .5s var(--ease)}#licensed.said{opacity:1}#licensed .glyph{--glyph: url(mark.png);display:inline-block;width:1.4em;height:1.2em;margin-right:.75em;vertical-align:-.25em;background-color:currentColor;-webkit-mask-image:var(--glyph);mask-image:var(--glyph);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}#licensed i{font-style:normal;margin:0 8px;opacity:.45}body.locked #licensed,body.glitch #licensed{opacity:0}.lane-foot .preset.bars{margin-left:auto;margin-right:0;gap:0}.lane-foot .preset.bars .preset-name{font-size:8.5px;letter-spacing:.14em;padding:1px 3px;min-width:72px;max-width:110px}.lane-foot .preset.bars .preset-step{padding:2px 1px;max-width:14px}.lane-foot .preset.bars .preset-step svg{width:10px;height:10px}.lane-foot .preset.bars .preset-field{font-size:8.5px}.lane-foot .preset.bars.naming .preset-field{padding:2px 4px}.lane-foot .preset.bars.naming .preset-confirm{padding:2px}.lane-foot .preset.bars .preset-confirm svg{width:12px;height:12px}body.no-clock .lane-foot .preset.bars{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .22s var(--ease),visibility 0s linear .22s}body.bar-list #panel{z-index:30}.lane-foot .preset.bars .preset-menu{top:auto;bottom:calc(100% + 6px);transform-origin:bottom center}.lane-foot .preset.bars .preset-submenu{top:auto;bottom:-7px;transform-origin:bottom right}.lane-foot .preset.bars .preset-group:after{top:auto;bottom:-7px}:root{--fold-time: 0s;--fold-ease: cubic-bezier(.32, .72, 0, 1);--fold-out: .19s;--fold-in: .26s;--fold-travel: 16px}body:not(.no-clock) .cell-slot{height:var(--cell-h, 34px);overflow:hidden;transition:height var(--fold-time) var(--fold-ease)}body:not(.no-clock) .cell-slot .cell{flex:none;transition:transform var(--fold-time) var(--fold-ease) calc(var(--fold-time) * .25),opacity calc(var(--fold-time) * .5) var(--fold-ease) calc(var(--fold-time) * .45),background .15s var(--ease),border-color .15s var(--ease)}body.pattern-focus .cell-slot{height:0;pointer-events:none}body.pattern-focus .cell-slot .cell{opacity:0;transform:translateY(-100%);transition:transform var(--fold-time) var(--fold-ease),opacity calc(var(--fold-time) * .45) var(--fold-ease)}.envelope,.colour{max-height:80px;overflow:hidden;transition:max-height var(--fold-time) var(--fold-ease),padding var(--fold-time) var(--fold-ease),opacity calc(var(--fold-time) * .5) var(--fold-ease) calc(var(--fold-time) * .45),transform var(--fold-time) var(--fold-ease) calc(var(--fold-time) * .3)}body.pattern-focus .envelope,body.pattern-focus .colour{max-height:0;padding-top:0;padding-bottom:0;opacity:0;transform:translateY(var(--fold-travel));pointer-events:none;transition:max-height var(--fold-time) var(--fold-ease),padding var(--fold-time) var(--fold-ease),opacity calc(var(--fold-time) * .45) var(--fold-ease),transform var(--fold-time) var(--fold-ease)}body.pattern-focus .lane-cap{height:0;margin-top:0;margin-bottom:0;opacity:0;transform:translateY(-11px);transition:height var(--fold-time) var(--fold-ease),margin var(--fold-time) var(--fold-ease),opacity calc(var(--fold-time) * .45) var(--fold-ease),transform var(--fold-time) var(--fold-ease)}body.pattern-focus .cell-tip{display:none}.seq-controls{max-height:40px;overflow:hidden;transition:max-height var(--fold-time) var(--fold-ease),padding var(--fold-time) var(--fold-ease),opacity calc(var(--fold-time) * .5) var(--fold-ease) calc(var(--fold-time) * .45),transform var(--fold-time) var(--fold-ease) calc(var(--fold-time) * .3)}.cells{transition:margin-top var(--fold-time) var(--fold-ease),row-gap var(--fold-time) var(--fold-ease)}.sequencer .group-head{transition:margin-bottom var(--fold-time) var(--fold-ease)}.lane-roll{transition:height var(--fold-time) var(--fold-ease),margin-top var(--fold-time) var(--fold-ease)}.lane-foot{transition:margin-top var(--fold-time) var(--fold-ease)}body.pattern-focus .cells{margin-top:0}body.pattern-focus .cells{row-gap:0}body.pattern-focus .lane-roll{margin-top:0}body.pattern-focus .lane-foot{margin-top:2px}body.pattern-focus .sequencer .group-head{margin-bottom:4px}body.pattern-focus .seq-controls{max-height:0;padding-bottom:0;opacity:0;transform:translateY(calc(-1 * var(--fold-travel)));pointer-events:none;transition:max-height var(--fold-time) var(--fold-ease),padding var(--fold-time) var(--fold-ease),opacity calc(var(--fold-time) * .45) var(--fold-ease),transform var(--fold-time) var(--fold-ease)}body.folding .cells{clip-path:inset(-400px 0 -400px -40px)}body.folding:not(.pattern-focus) .cell-slot,body.folding:not(.pattern-focus) .lane-cap{overflow:visible}body.folding .lane-roll,body.folding .lane-foot,body.folding .lane-cap,body.folding .cell-slot .cell,body.folding .seq-controls,body.folding .sequencer .group-name,body.folding .sequencer .group-hint,body.folding .sequencer .head-cap,body.folding .sequencer #bounce,body.folding .sequencer #resetButton,body.folding .sequencer #patternClear,body.folding .envelope,body.folding .colour{animation-fill-mode:forwards;animation-timing-function:var(--fold-ease)}body.folding .sequencer .group-head{clip-path:inset(-14px -400px -400px -400px)}body.fold-out .lane-roll,body.fold-out .lane-foot{animation:foldBarOut var(--fold-out)}body.fold-out .cell-slot .cell,body.fold-out .lane-cap,body.fold-out .sequencer .group-name,body.fold-out .sequencer .group-hint,body.fold-out .sequencer .head-cap,body.fold-out .sequencer #bounce,body.fold-out .sequencer #resetButton,body.fold-out .sequencer #patternClear,body.fold-out .seq-controls{animation:foldLiftOut var(--fold-out)}body.fold-out .envelope,body.fold-out .colour{animation:foldSinkOut var(--fold-out)}body.fold-in .lane-roll,body.fold-in .lane-foot{animation:foldBarIn var(--fold-in)}body.fold-in .cell-slot .cell,body.fold-in .lane-cap,body.fold-in .sequencer .group-name,body.fold-in .sequencer .group-hint,body.fold-in .sequencer .head-cap,body.fold-in .sequencer #bounce,body.fold-in .sequencer #resetButton,body.fold-in .sequencer #patternClear,body.fold-in .seq-controls{animation:foldLiftIn var(--fold-in)}body.fold-in .envelope,body.fold-in .colour{animation:foldSinkIn var(--fold-in)}@keyframes foldBarOut{to{transform:translate(34%);opacity:0}}@keyframes foldBarIn{0%{transform:translate(34%);opacity:0}to{transform:none;opacity:1}}@keyframes foldLiftOut{to{transform:translateY(calc(-1 * var(--fold-travel)));opacity:0}}@keyframes foldLiftIn{0%{transform:translateY(calc(-1 * var(--fold-travel)));opacity:0}to{transform:none;opacity:1}}@keyframes foldSinkOut{to{transform:translateY(var(--fold-travel));opacity:0}}@keyframes foldSinkIn{0%{transform:translateY(var(--fold-travel));opacity:0}to{transform:none;opacity:1}}body.flat-roll .lane-roll,body.flat-roll .lane{height:32px}body.flat-roll .lane-cap{padding-left:1px}body.flat-roll .lane-foot{padding:0 1px}body.flat-roll{--roll-slit: 0px}body.flat-roll .roll-row:after{display:none}body.flat-roll{--block-corner: calc(var(--track-corner) - 1px)}body.pattern-focus{--block-corner: var(--track-corner)}body.flat-roll .lane{background:#00000052;border:1px solid var(--hairline);border-radius:var(--track-corner)}.lane-roll .hit.at-start{border-top-left-radius:var(--block-corner);border-bottom-left-radius:var(--block-corner)}.lane-roll .hit.at-end{border-top-right-radius:var(--block-corner);border-bottom-right-radius:var(--block-corner)}body.light.flat-roll .lane{background:#0e0f140d}body.flat-roll .lane-grid{-webkit-mask:none;mask:none}body.pattern-focus{--roll-row: 24.5px}body.pattern-focus.two-runs{--roll-slit: 2px}.fold{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:18px;height:16px;padding:0;border:0;background:none;color:#ffffff57;cursor:pointer;transition:color .18s var(--ease),opacity .25s var(--ease)}.fold svg{width:12px;height:12px;display:block}.fold{position:relative}.fold svg{transition:opacity calc(var(--fold-time) * .6) var(--fold-ease)}.fold .fold-shut{position:absolute;inset:0;margin:auto}.fold .fold-shut,body.pattern-focus .fold .fold-open{opacity:0}.fold .fold-open,body.pattern-focus .fold .fold-shut{opacity:1}.lane-foot .preset.bars{margin-right:8px}.fold:hover{color:#ffffffc7}body.light .fold{color:#0e0f146b}body.light .fold:hover{color:#0e0f14d9}body.no-clock .fold{opacity:0;visibility:hidden;pointer-events:none}.roll-rows,.roll-wash{position:absolute;inset:0;pointer-events:none}.roll-wash,.roll-rows{z-index:0}.roll-row{position:absolute;left:0;right:0}.roll-row:after{content:"";position:absolute;inset:0 0 var(--roll-slit, 2px) 0;border-radius:var(--track-corner);background:#00000052;box-shadow:inset 0 0 0 1px var(--hairline)}.roll-mark.mute{opacity:.22}.roll-row.mute:after{opacity:.38}.roll-row.hidden,.roll-band,.roll-band.hidden{display:none}.lane-roll .hit{margin:0;border-radius:0;border-color:rgba(var(--step-ink),.42);background-color:#07080b80;background-image:linear-gradient(rgba(var(--step-ink),.13),rgba(var(--step-ink),.13))}body.light .lane-roll .hit{background-color:#ffffffc7;background-image:linear-gradient(rgba(var(--step-ink),.15),rgba(var(--step-ink),.15))}body.light .lane-roll .hit.playing,body.light .lane-roll .hit.chosen{background-image:linear-gradient(rgba(var(--step-ink),.42),rgba(var(--step-ink),.42))}body.light .lane-roll .hit.mute{background-color:transparent}.lane-roll .hit.playing,.lane-roll .hit.chosen{border-color:rgb(var(--step-ink));box-shadow:0 0 5px rgba(var(--step-ink),.28);background-image:linear-gradient(rgba(var(--step-ink),.4),rgba(var(--step-ink),.4))}.lane-roll .hit-fill{top:auto;bottom:0;height:26%;min-height:3px;border-top:1px solid rgba(var(--step-ink),.45);background:rgba(var(--step-ink),.16)}.lane-roll .hit.playing .hit-fill,.lane-roll .hit.chosen .hit-fill{border-top-color:rgb(var(--step-ink));background:rgba(var(--step-ink),.45)}.lane-roll .hit.playing .hit-fill,.lane-roll .hit.chosen .hit-fill{background:rgb(var(--step-ink))}.lane-roll .hit-cell{display:block;top:auto;bottom:26%;left:3px;line-height:1.1;color:rgb(var(--step-ink));opacity:.5;font-size:11px;letter-spacing:.02em}.lane-roll .hit.playing .hit-cell,.lane-roll .hit.chosen .hit-cell{opacity:1}.lane-roll .lane-ghost{margin:0;border-radius:0}.lane-roll .lane-ghost.at-start{border-top-left-radius:var(--block-corner);border-bottom-left-radius:var(--block-corner)}.lane-roll .lane-ghost.at-end{border-top-right-radius:var(--block-corner);border-bottom-right-radius:var(--block-corner)}.lane-roll .lane-ghost .hit-fill{top:auto;bottom:0;height:26%;min-height:3px}body.light .roll-row:after{background:#0e0f140d}