@import "https://fonts.googleapis.com/css2?family=Geist+Mono:wght@300;400;500;600;700&display=swap";@import "https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400&display=swap";:root{--c-type:#7ae093;--c-type-bg:#cfffdf;--c-inversion:#44a8ff;--c-inversion-bg:#d1f0ff;--c-secondary:#e092ff;--c-secondary-bg:#f4daff;--c-play:#8b96ff;--c-play-bg:#e4e7fb;--c-play-ink:#0b188e;--c-play-glow:#8a95ff4d;--key-hi-bg:#cdd0f4;--key-hi-bg-black:#313772;--key-hi-glow:#8a95ff59;--label-transform:none;--label-tracking:0;--label-size:11px;--footer-transform:lowercase;--control-h:37px;--c-select:#0d99ff;--c-ink:#353535;--c-border:#dbdbdb;--c-border-hover:#bbb;--c-card-border:#0003;--tile-selected-border:#999;--tile-selected-bg:#f8f8f8;--tile-sel-ring-w:0px;--surface-card:linear-gradient(-65deg, #fff 1%, #f4f4f4 100%);--surface-panel:linear-gradient(126deg, #fdfdfd 1%, #f2f2f2 100%);--surface-piano:linear-gradient(118deg, #fdfdfd, #f2f2f2);--surface-btn:linear-gradient(180deg, #fff 0%, #f1f1f1 100%);--surface-btn-hover:linear-gradient(180deg, #fff 0%, #eaeaea 100%);--surface-tile:linear-gradient(180deg, #fff 0%, #f6f6f6 100%);--pad-card-top:22px;--pad-card-x:28px;--pad-card-bottom:26px;--gap-card:12px;--gap-grid:10px;--gap-bottom:10px;--gap-btn:9px;--pad-panel-top:10px;--pad-panel-x:20px;--pad-panel-bottom:16px;--pad-tile:6px;--pad-piano-y:16px;--pad-piano-x:12px;--gap-key:2px;--r-card:20px;--r-panel:10px;--r-tile:9px;--r-btn:7px;--r-key:4px;--r-control:8px;--r-pad:12px;--bw-tile:1.4px;--toggle-bg:var(--c-border);--sh-oct:var(--sh-control);--sh-oct-active:inset 0 2px 3px #00000024;--sh-card:0 20px 50px #00000040, inset 0 1px 0 #fffc;--sh-btn:0 2px 0 #dbdbdb, 0 3px 6px #00000024;--sh-btn-active:0 0 0 #dbdbdb, inset 0 2px 3px #00000024;--sh-btn-sel:0 0 0 #dbdbdb, inset 0 2px 3px #00000024;--sh-tile:0 2px 0 #dbdbdb, 0 3px 8px #0000001a;--sh-tile-active:0 0 0 #dbdbdb, inset 0 2px 5px #0000001f, 0 0 10px var(--c-play-glow);--sh-key:0 3px 0 #dbdbdb, 0 5px 6px #00000024;--sh-key-active:0 1px 0 #dbdbdb, inset 0 1px 2px #0000001f, 0 0 8px var(--key-hi-glow);--sh-key-black:none;--sh-key-black-active:0 0 8px var(--key-hi-glow);--sh-control:0 1px 0 #dbdbdb, 0 2px 4px #0000001a;--btn-press-y:2px;--btn-sel-y:2px;--tile-press-y:2px;--key-press-y:2px;--strum-palette:spectrum;--strum-sat:1.6;--strum-frame:0;--strum-frame-alpha:.12;--strum-labels:1;--strum-end-dots:1;--strum-string-w:1.4;--strum-bg-dots:1;--strum-anim:1;--strum-anim-style:center;--strum-anim-stagger:0;--strum-pick:#353535;--strum-pad-top:14;--strum-pad-bottom:8;--strum-label-gap:13;--pluck-flash:lighten;--pluck-flash-ms:700;--pluck-flash-lighten:100;--pluck-flash-mix:100;--pluck-flash-black:darken;--pluck-flash-black-l:38;--pluck-flash-vel:1;--anim-octave:slide;--xhair:1;--xhair-pulse:lines;--xhair-color:#d05050d9}*{box-sizing:border-box;margin:0;padding:0}body{color:#353535;-webkit-tap-highlight-color:transparent;background-color:#111;flex-direction:column;justify-content:center;align-items:center;min-height:100dvh;font-family:Geist Mono,SF Mono,Fira Code,monospace;display:flex}@media (pointer:coarse){body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}input,textarea{-webkit-user-select:text;user-select:text}}.app-card{z-index:2;background:var(--surface-card);border:1px solid var(--c-card-border);border-radius:var(--r-card);box-shadow:var(--sh-card);padding:var(--pad-card-top) var(--pad-card-x) var(--pad-card-bottom);gap:var(--gap-card);flex-direction:column;width:740px;max-width:calc(100vw - 40px);display:flex;position:relative}.app-card.intro-hidden{opacity:0;pointer-events:none;transform:scale(.985)}.app-card.intro-forming{animation:.55s cubic-bezier(.22,.9,.3,1) forwards app-card-form-in}.app-card.intro-forming>*{opacity:0;animation:.42s ease-out forwards app-card-child-in}.app-card.intro-forming>:first-child{animation-delay:.26s}.app-card.intro-forming>:nth-child(2){animation-delay:.34s}.app-card.intro-forming>:nth-child(3){animation-delay:.42s}.app-card.intro-forming>:nth-child(4){animation-delay:.5s}@keyframes app-card-form-in{0%{opacity:0;transform:scale(.985)}to{opacity:1;transform:scale(1)}}@keyframes app-card-child-in{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.app-footer-wrap{display:contents}.app-footer-wrap.intro-pending>.app-footer{opacity:0;pointer-events:none}.app-footer-wrap>.app-footer{transition:opacity .45s}.app-footer-wrap.footer-above>.app-footer{margin-top:0;margin-bottom:20px}.app-footer-wrap.looper-entering:not(.footer-above)>.app-footer{opacity:0}.app-footer-wrap.footer-above.looper-entering>.app-footer{animation:.5s .4s backwards footer-fade-in-top}@keyframes footer-fade-in-top{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.app-footer-wrap.footer-above.looper-leaving>.app-footer{opacity:0}.app-footer-wrap.looper-leaving:not(.footer-above)>.app-footer{animation:.5s .35s backwards footer-fade-in-bottom}@keyframes footer-fade-in-bottom{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.app-footer-wrap.footer-fading>.app-footer{opacity:0;transition:opacity .2s}.app-footer-wrap.footer-topbar{height:37px;display:block}.app-footer-wrap.footer-topbar>.app-footer{z-index:6;width:auto;max-width:none;margin:0;animation:.3s footer-appear;position:fixed;top:18px;left:50%;transform:translate(-50%)}.app-footer-wrap.footer-return-in>.app-footer{animation:.3s footer-appear}@keyframes footer-appear{0%{opacity:0}to{opacity:1}}.instructions-above{width:max-content;animation:.35s 50ms backwards footer-appear;position:absolute;bottom:calc(100% + 24px);left:50%;transform:translate(-50%)}.instructions-above.instr-fading{opacity:0;transition:opacity .2s}.instructions-above .instructions-panel{justify-content:center;margin-top:0;animation:none;position:static;transform:none}.app-footer{z-index:1;color:#fff;flex-direction:column;align-items:center;width:740px;max-width:calc(100vw - 40px);margin-top:20px;font-family:Geist Mono,monospace;font-size:13px;display:flex;position:relative}.app-footer-row{text-transform:var(--footer-transform,lowercase);white-space:nowrap;color:#ffffff80;justify-content:center;align-items:center;gap:14px;display:flex}.app-footer-row span{transition:color .15s}.footer-toggle{color:#ffffff80;font:inherit;text-transform:inherit;cursor:pointer;background:0 0;border:none;padding:0;text-decoration:none;transition:color .15s}.footer-toggle:hover{color:#fff}.instructions-panel{align-items:flex-start;gap:20px;margin-top:18px;animation:.25s ease-out instructions-fade-in;display:flex;position:absolute;top:100%;left:50%;transform:translate(-50%)}.app-footer-row{position:relative}@keyframes instructions-fade-in{0%{opacity:0;transform:translate(-50%)translateY(-4px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.instr-group{flex-direction:column;align-items:stretch;gap:8px;display:flex}.instr-keys{justify-content:center;gap:5px;display:flex}.mac-key{color:#333;-webkit-user-select:none;user-select:none;background:linear-gradient(#d8d8d8 0%,#c2c2c2 100%);border:1px solid #8a8a8a;border-top-color:#9a9a9a;border-radius:4px;justify-content:center;align-items:center;min-width:26px;height:26px;padding:0 6px;font-family:Geist Mono,monospace;font-size:10px;display:flex;box-shadow:0 1px #0006,inset 0 1px #ffffff80}.mac-key.wide{justify-content:flex-start;min-width:48px;padding:0 8px}.mac-key-rot{line-height:1;display:inline-block}.instr-key-plus{color:#ffffff59;align-self:center;margin-top:-18px;font-family:Geist Mono,monospace;font-size:16px}.instr-label-row{align-items:center;gap:6px;display:flex}.instr-line{background:#fff3;flex:1;height:1px}.instr-label{color:#fff9;text-transform:lowercase;letter-spacing:.6px;white-space:nowrap;font-family:Geist Mono,monospace;font-size:9.5px}select{color:var(--c-ink);border:var(--bw-tile) solid var(--c-border);border-radius:var(--r-control);height:var(--control-h,37px);cursor:pointer;box-shadow:var(--sh-control);appearance:none;background:#fff url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 10 10' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 4l3 3 3-3' stroke='%23999' stroke-width='1.2' fill='none'/%3E%3C/svg%3E") right 10px center no-repeat;outline:none;padding:0 28px 0 12px;font-family:Geist Mono,monospace;font-size:12px}select:hover{border-color:var(--c-border-hover)}select:focus{border-color:#999}.bottom-row{gap:var(--gap-bottom);align-items:stretch;display:flex}@media (width<=640px){body{padding:16px 0 calc(20px + env(safe-area-inset-bottom));justify-content:flex-start}.app-card{border-radius:16px;gap:12px;width:100%;max-width:calc(100vw - 24px);padding:16px 14px}.bottom-row{flex-direction:column}.app-footer{width:100%;max-width:calc(100vw - 24px);margin-top:14px;font-size:11px}.app-footer-row{white-space:normal;flex-wrap:wrap;gap:10px}}.feedback-panel{width:340px}.feedback-type-row{gap:6px;padding:12px 14px 0;display:flex}.feedback-type-btn{font:inherit;color:#777;cursor:pointer;background:#fff;border:1px solid #ddd;border-radius:8px;flex:1;padding:6px 0;font-size:12px;transition:border-color .12s,color .12s,background .12s}.feedback-type-btn.active{color:#353535;background:#f5f5f5;border-color:#353535}.feedback-input{resize:none;width:calc(100% - 28px);height:110px;font:inherit;color:#353535;border:1px solid #ddd;border-radius:8px;outline:none;margin:10px 14px 0;padding:9px 10px;font-size:13px;line-height:1.5;display:block}.feedback-input:focus{border-color:#aaa}.feedback-error{color:#e04040;padding:8px 14px 0;font-size:11.5px}.feedback-submit{width:calc(100% - 28px);font:inherit;color:#fff;cursor:pointer;background:#353535;border:none;border-radius:8px;margin:12px 14px 14px;padding:8px 0;font-size:13px;display:block}.feedback-submit:disabled{opacity:.4;cursor:default}.feedback-sent{text-align:center;color:#353535;padding:26px 14px 30px;font-size:13px}.settings-overlay.daw-issue-overlay{z-index:10004}.daw-issue-daw-input{height:auto}.daw-setup-steps{color:#353535d9;text-align:left;background:#fff;border:1.4px solid #ededed;border-radius:8px;padding:10px 12px;font-size:10.5px;line-height:1.5}.daw-setup-steps ol{flex-direction:column;gap:6px;margin:0;padding-left:16px;display:flex}.daw-setup-steps code{background:#f2f2f2;border-radius:3px;padding:0 3px;font-family:Geist Mono,monospace}.daw-setup-note{color:#3535358c;margin:8px 0 0;font-style:italic}.daw-setup-issue-link{font:inherit;color:#3535358c;cursor:pointer;background:0 0;border:none;margin-top:6px;padding:0;text-decoration:underline}.daw-setup-issue-link:hover{color:#353535}.daw-setup-unsupported{font-size:12px}.daw-setup-unsupported p{margin:0 0 14px}.daw-setup-lead{margin:12px 0 8px}.ip-empty .daw-setup-copy-btn{margin-top:10px}.daw-setup-copy-btn{color:#353535;cursor:pointer;text-align:left;background:#fff;border:1.4px solid #dbdbdb;border-radius:7px;margin-bottom:2px;padding:7px 11px;font-family:Geist Mono,monospace;font-size:12px;transition:border-color .1s,background .1s,transform 60ms,box-shadow 60ms;display:inline-block;box-shadow:inset 0 -2px #e4e4ea,0 1.5px #0000001f}.daw-setup-copy-btn:hover{border-color:#bbb}.daw-setup-copy-btn:active{transform:translateY(2px);box-shadow:inset 0 -1px #e4e4ea,0 1px #0000001a}.instrument-anchor{position:relative}.instrument-trigger{width:160px;height:var(--control-h,37px);color:var(--c-ink);border:var(--bw-tile) solid var(--c-border);border-radius:var(--r-control);cursor:pointer;box-shadow:var(--sh-control);background:#fff;outline:none;justify-content:space-between;align-items:center;gap:8px;padding:0 12px;font-family:Geist Mono,monospace;font-size:12px;transition:border-color .1s;display:flex}.instrument-trigger:hover{border-color:#bbb}.instrument-trigger.open{border-color:#999}.instrument-trigger-label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.instrument-trigger-caret{flex-shrink:0;transition:transform .15s}.instrument-trigger.open .instrument-trigger-caret{transform:rotate(180deg)}.instrument-panel{z-index:10002;color:#353535;background:#fff;border:1.4px solid #dbdbdb;border-radius:10px;gap:0;width:760px;max-width:min(94vw,820px);max-height:min(72vh,520px);font-family:Geist Mono,monospace;display:flex;position:fixed;overflow:hidden;box-shadow:0 10px 32px #00000024}.instrument-panel-main{scrollbar-width:thin;scrollbar-color:#cfcfcf transparent;flex-direction:column;flex:auto;gap:12px;min-width:0;max-height:min(72vh,520px);padding:14px;display:flex;overflow-y:auto}.instrument-panel-main::-webkit-scrollbar{width:8px}.instrument-panel-main::-webkit-scrollbar-thumb{background:#d4d4d4;border:2px solid #fff;border-radius:4px}.instrument-panel-main::-webkit-scrollbar-thumb:hover{background:#bcbcbc}.instrument-panel-side{background:#fafafa;border-left:1.4px solid #ededed;flex-direction:column;flex:0 0 300px;gap:12px;min-width:0;max-height:min(72vh,520px);padding:16px;display:flex;overflow-y:auto}.ip-group-label{font-size:var(--label-size,10px);letter-spacing:calc(.3px * var(--label-tracking,1));color:#353535;margin:0 0 6px;font-weight:400}.ip-group+.ip-group{margin-top:12px}.ip-chips{grid-template-columns:1fr 1fr;gap:6px;display:grid}.ip-chip{z-index:1;color:#353535;cursor:pointer;text-align:left;background:#fff;border:1.4px solid #dbdbdb;border-radius:7px;justify-content:space-between;align-items:center;gap:8px;padding:7px 11px;font-family:Geist Mono,monospace;font-size:12px;transition:border-color .1s,background .1s,transform 60ms,box-shadow 60ms;display:flex;position:relative;box-shadow:inset 0 -2px #e4e4ea,0 1.5px #0000001f}.ip-chip-label{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.ip-chip-check{color:var(--c-play,#8b96ff);flex-shrink:0;display:block}.ip-chip:hover{background:#f6f6f6;border-color:#bbb}.ip-chip.selected{z-index:0;border-color:var(--c-play,#8b96ff);color:#353535;background:#fff;transform:translateY(2px);box-shadow:inset 0 -1px #e4e4ea,0 1px #0000001a,0 4px 10px 1px #8b96ff80}.ip-side-header{justify-content:space-between;align-items:center;gap:8px;display:flex}.ip-side-title{letter-spacing:.3px;color:#353535;font-size:11px;font-weight:400}.ip-help-btn{color:#353535;cursor:pointer;background:#fff;border:1.4px solid #dbdbdb;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;padding:0;font-family:Geist Mono,monospace;font-size:11px;line-height:1;transition:border-color .1s,background .1s;display:flex}.ip-help-btn:hover{background:#f0f0f0;border-color:#bbb}.ip-help-btn.active{color:#fff;background:#353535;border-color:#353535}.ip-daw-list{flex-direction:column;gap:6px;display:flex}.ip-daw-row{z-index:1;color:#353535;cursor:pointer;text-align:left;background:#fff;border:1.4px solid #dbdbdb;border-radius:7px;justify-content:space-between;align-items:center;gap:8px;width:100%;padding:8px 10px;font-family:Geist Mono,monospace;font-size:12px;transition:border-color .1s,background .1s,transform 60ms,box-shadow 60ms;display:flex;position:relative;box-shadow:inset 0 -2px #e4e4ea,0 1.5px #0000001f}.ip-daw-row:hover{background:#fff;border-color:#bbb}.ip-daw-row.connected{z-index:0;border-color:var(--c-play,#8b96ff);color:#353535;background:#fff;transform:translateY(2px);box-shadow:inset 0 -1px #e4e4ea,0 1px #0000001a,0 4px 10px 1px #8b96ff80}.ip-daw-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.ip-lock-badge{letter-spacing:.6px;text-transform:uppercase;color:#fff;background:#3a3a3e;border-radius:5px;flex-shrink:0;align-items:center;gap:5px;padding:4px 8px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:10px;font-weight:700;display:inline-flex}.ip-lock-spin{text-align:center;width:1em;font-size:10px;line-height:1;display:inline-block}.ip-empty{color:#35353599;font-size:12px;line-height:1.45}.ip-empty-link{color:#353535;cursor:pointer;background:0 0;border:none;margin-top:4px;padding:0;font-family:Geist Mono,monospace;font-size:12px;text-decoration:underline;display:inline}.ip-instructions{color:#353535d9;background:#fff;border:1.4px solid #ededed;border-radius:8px;padding:10px 12px;font-size:10.5px;line-height:1.5}.ip-instructions ol{flex-direction:column;gap:6px;margin:0;padding-left:16px;display:flex}.ip-instructions code{background:#f2f2f2;border-radius:3px;padding:0 3px;font-family:Geist Mono,monospace}.ip-instructions-note{color:#3535358c;margin-top:8px;font-style:italic}.ip-works-with{flex-direction:column;align-items:center;gap:8px;margin-top:auto;padding-top:12px;display:flex}.ip-works-with-logos{align-items:flex-end;gap:8px;display:flex}.ip-works-with-logos img{object-fit:contain;border-radius:4px;width:28px;height:28px}.ip-works-with-label{color:#3535358c;font-size:12px}@media (width<=860px){.instrument-panel{width:min(94vw,620px)}.instrument-panel-side{flex-basis:260px}}@media (width<=640px){.instrument-trigger{width:100%}.instrument-panel{flex-direction:column;width:auto;max-width:none;max-height:min(82vh,620px);position:fixed;inset:auto 12px 12px;overflow-y:auto}.instrument-panel-main,.instrument-panel-side{flex:none;max-height:none;overflow-y:visible}.instrument-panel-side{border-top:1.4px solid #ededed;border-left:none}}@media (width<=420px){.ip-chips{grid-template-columns:1fr}}.controls{justify-content:space-between;align-items:flex-end;gap:16px;display:flex}.app-title{color:#353535;white-space:nowrap;opacity:.5;flex-shrink:0;font-family:Ubuntu,sans-serif;font-size:24px;font-style:normal;font-weight:400}.app-subtitle{color:#353535;letter-spacing:-.3px;margin-left:-2px;font-family:Georgia,Times New Roman,serif;font-size:12px;font-style:italic;font-weight:400}.controls-right{align-items:flex-end;gap:12px;min-width:0;display:flex}.control-group{flex-direction:column;gap:4px;display:flex}.control-group-account{justify-content:flex-end}.control-group label{font-size:var(--label-size,9px);text-transform:var(--label-transform,uppercase);letter-spacing:calc(1.3px * var(--label-tracking,1));color:#35353566;font-family:Geist Mono,monospace;font-weight:400}.octave-controls{border-radius:var(--r-control);box-shadow:var(--sh-oct);align-items:center;gap:0;display:flex}.octave-controls button{width:32px;height:var(--control-h,37px);background:var(--surface-btn);color:var(--c-ink);border:var(--bw-tile) solid var(--c-border);cursor:pointer;justify-content:center;align-items:center;padding:0;font-family:Geist Mono,monospace;font-size:14px;transition:background .1s;display:flex}.octave-controls button:first-child{border-radius:var(--r-control) 0 0 var(--r-control)}.octave-controls button:last-child{border-radius:0 var(--r-control) var(--r-control) 0}.octave-controls button:hover{background:#f0f0f0}.octave-controls button:active{box-shadow:var(--sh-oct-active)}.octave-display{min-width:36px;height:var(--control-h,37px);background:var(--surface-btn);border-top:var(--bw-tile) solid var(--c-border);border-bottom:var(--bw-tile) solid var(--c-border);color:var(--c-ink);justify-content:center;align-items:center;font-size:12px;font-weight:400;display:flex}.toggle-wrap{align-items:center;height:37px;display:flex}.toggle-label{width:62px;height:var(--control-h,37px);cursor:pointer;display:inline-block;position:relative}.toggle-label input{display:none}.toggle-track{background:var(--toggle-bg);border:var(--bw-tile) solid var(--c-border);border-radius:calc(var(--control-h,37px) / 2);box-shadow:var(--sh-control);transition:background .35s,border-color .35s;position:absolute;inset:0}.toggle-track:after{content:"";border:1px solid var(--c-border);background:#fff;border-radius:50%;width:27px;height:27px;transition:transform .2s,background .2s;position:absolute;top:calc(50% - 14.5px);left:4px}.toggle-label input:checked+.toggle-track:after{transform:translate(24px)}.toggle-track.toggle-flash-on{background:var(--c-play);border-color:var(--c-play)}.toggle-word{letter-spacing:.5px;pointer-events:none;font-family:Geist Mono,monospace;font-size:8px;font-weight:700;animation:1s forwards toggle-word-fade;position:absolute;top:50%;transform:translateY(-50%)}.toggle-flash-on .toggle-word{color:#fff;left:9px}.toggle-flash-off .toggle-word{color:#3535358c;right:7px}@keyframes toggle-word-fade{0%{opacity:0}20%{opacity:1}65%{opacity:1}to{opacity:0}}@media (width<=640px){.controls{flex-direction:column;align-items:stretch;gap:10px}.app-title{font-size:22px}.controls-right{flex-wrap:wrap;gap:12px 10px}.controls-right .control-group{flex:auto}.controls-right .control-group:has(.toggle-wrap){flex:none}.controls-right .control-group[data-tutorial=instrument]{flex:auto}.controls-right .control-group[data-tutorial=instrument] .instrument-anchor,.controls-right .control-group select,.octave-controls{width:100%}.octave-controls button{flex:1}.octave-display{flex:1;min-width:0}}.chords-row{gap:var(--gap-grid);display:flex}.chord-box{aspect-ratio:1;background:var(--surface-tile);border:var(--bw-tile) solid var(--c-border);border-radius:var(--r-tile);box-shadow:var(--sh-tile);outline-offset:calc(-1 * var(--bw-tile) - var(--tile-sel-ring-w));-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none;cursor:pointer;padding:var(--pad-tile);outline:0 solid #0000;flex:1;grid-template-rows:auto 1fr auto;place-items:center;transition:all 80ms,border-color .16s,outline-color .16s,outline-width .16s;display:grid;position:relative;overflow:hidden}.chord-box:hover{border-color:var(--c-border-hover)}.chord-box.selected{border-color:var(--c-select);outline-width:calc(var(--tile-sel-ring-w) + .6px);outline-color:var(--c-select);background:var(--tile-selected-bg)}.chord-box.playing{background:var(--c-play-bg);border-color:var(--c-play);outline-color:var(--c-play);box-shadow:var(--sh-tile-active);transform:translateY(var(--tile-press-y))}.chord-degree{font-size:calc(var(--label-size,10px) - 1px);color:#35353566;letter-spacing:calc(1.3px * var(--label-tracking,1));place-self:start center;padding-top:4px;font-family:Geist Mono,monospace;font-weight:400}.chord-name{color:var(--c-ink);text-align:center;white-space:nowrap;font-family:Geist Mono,monospace;font-weight:700;line-height:1.1}.chord-box.playing .chord-name{color:var(--c-play-ink)}.chord-dots-area{justify-content:center;align-self:end;align-items:center;height:10px;padding-bottom:2px;display:flex}.chord-dots{justify-content:center;display:flex}.chord-dot{opacity:0;border-radius:50%;width:0;height:6px;margin:0;transition:width .15s,opacity .15s,margin .15s}.chord-dot.dot-visible{opacity:1;width:6px;margin:0 2px}.dot-type{background:var(--c-type)}.dot-secondary{background:var(--c-secondary)}.dot-inversion{background:var(--c-inversion)}@media (width<=640px){.chords-row{grid-template-columns:repeat(12,1fr);gap:7px;display:grid}.chord-box{aspect-ratio:auto;border-radius:8px;height:76px;padding:5px 4px}.chord-box:nth-child(-n+3){grid-column:span 4}.chord-box:nth-child(n+4){grid-column:span 3}.chord-degree{font-size:calc(var(--label-size,10px) - 2px);letter-spacing:calc(.5px * var(--label-tracking,1));padding-top:3px}}.props-panel{border:1px solid var(--c-border);border-radius:var(--r-panel);background:var(--surface-panel);padding:var(--pad-panel-top) var(--pad-panel-x) var(--pad-panel-bottom);opacity:1}.props-body{justify-content:space-between;align-items:flex-start;display:flex}.props-section{gap:var(--gap-btn);flex-direction:column;display:flex}.props-section-header{align-items:center;gap:8px;display:flex}.props-line{background:#35353526;flex:1;height:1px}.props-section-label{font-size:var(--label-size,9.5px);text-transform:var(--label-transform,uppercase);letter-spacing:calc(1.3px * var(--label-tracking,1));color:#35353580;white-space:nowrap;font-family:Geist Mono,monospace;font-weight:400}.props-options{gap:var(--gap-btn);display:flex}.prop-btn{background:var(--surface-btn);border:1px solid var(--c-border);border-radius:var(--r-btn);width:34px;height:34px;color:var(--c-ink);cursor:pointer;text-align:center;box-shadow:var(--sh-btn);justify-content:center;align-items:center;padding:0;font-family:Geist Mono,monospace;font-size:9.5px;font-weight:400;transition:all 80ms;display:flex;transform:translateY(0)}.prop-btn:hover{border-color:var(--c-border-hover);background:var(--surface-btn-hover)}.prop-btn:active{transform:translateY(var(--btn-press-y));box-shadow:var(--sh-btn-active)}.prop-btn.active-type,.prop-btn.active-secondary,.prop-btn.active-inversion{transform:translateY(var(--btn-sel-y));box-shadow:var(--sh-btn-sel)}.prop-btn.active-type{background:var(--c-type-bg);border-color:var(--c-type);color:var(--c-ink)}.prop-btn.active-secondary{background:var(--c-secondary-bg);border-color:var(--c-secondary);color:var(--c-ink)}.prop-btn.active-inversion{background:var(--c-inversion-bg);border-color:var(--c-inversion);color:var(--c-ink)}.prop-btn:disabled{opacity:.25;cursor:default}@media (width<=640px){.props-panel{border-radius:14px;padding:10px 14px 14px}.props-body{flex-direction:column;align-items:stretch;gap:12px}.props-options{gap:6px}.prop-btn{flex:1 1 0;width:auto;min-width:0;height:38px}}.mini-laurie{width:300px;max-width:100%;height:auto;margin:0 auto;display:block}.mini-card{fill:#fff;stroke:#dbdbdb;stroke-width:1px}.mini-laurie-text{fill:#35353573;letter-spacing:.3px;font-family:Ubuntu,sans-serif;font-size:14px;font-weight:400}.mini-alpha{fill:#35353566;font-family:Georgia,serif;font-size:10px;font-style:italic}.mini-ctl-pill{fill:#fff;stroke:#dbdbdb;stroke-width:.8px}.mini-chord-box{fill:#fff;stroke:#dbdbdb;stroke-width:.8px;transition:fill .2s,stroke .2s}.mini-chord-box.playing{fill:#e4e7fb;stroke:#8b96ff}.mini-chord-dot{fill:#7ae093;transition:cx .25s}.mini-props-panel{fill:#f5f5f5;stroke:#dbdbdb;stroke-width:.8px}.mini-prop-pill{fill:#fff;stroke:#dbdbdb;stroke-width:.6px;transition:fill .25s,stroke .25s}.mini-prop-pill.active-type{fill:#cfffdf;stroke:#7ae093}.mini-prop-pill.active-inversion{fill:#d1f0ff;stroke:#44a8ff}.mini-prop-pill.active-secondary{fill:#f4daff;stroke:#e092ff}.mini-trackpad{fill:#fff;stroke:#dbdbdb;stroke-width:.8px}.mini-trackpad-grid{stroke:#0000000f;stroke-width:.5px}.mini-trackpad-dot{animation:7s ease-in-out infinite mini-trackpad-drift}.mini-trackpad-plus{stroke:#d05050;stroke-opacity:.85;stroke-width:1.2px;stroke-linecap:round}@keyframes mini-trackpad-drift{0%{transform:translate(-14px,-10px)}20%{transform:translate(12px,-14px)}40%{transform:translate(16px,4px)}60%{transform:translate(6px,14px)}80%{transform:translate(-16px,10px)}to{transform:translate(-14px,-10px)}}.mini-piano-bg{fill:#fafafa;stroke:#dbdbdb;stroke-width:.8px}.mini-white-key{fill:#fff;stroke:#0000001f;stroke-width:.5px;transition:fill .15s}.mini-white-key.highlighted{fill:#cdd0f4}.mini-black-key{fill:#353535}.tutorial-overlay{z-index:10000;pointer-events:none;position:fixed;inset:0}.tutorial-overlay.tutorial-closing{pointer-events:none!important}.tutorial-mask-svg{pointer-events:none;width:100%;height:100%;transition:opacity .2s;position:fixed;inset:0}.tutorial-closing .tutorial-mask-svg{opacity:0}.tutorial-mask-svg rect{transition:x .3s,y .3s,width .3s,height .3s}.tutorial-spotlight{pointer-events:none;border:2px solid #ffffff40;border-radius:10px;transition:left .3s,top .3s,width .3s,height .3s,opacity .2s;position:fixed}.tutorial-closing .tutorial-spotlight{opacity:0}.tutorial-top-bar{pointer-events:auto;z-index:10001;justify-content:space-between;align-items:baseline;width:740px;max-width:calc(100vw - 40px);padding:0 12px;transition:opacity .2s;display:flex;position:fixed;left:50%;transform:translate(-50%)}.tutorial-closing .tutorial-top-bar{opacity:0}.tutorial-top-title{color:#fff;letter-spacing:.5px;font-family:Ubuntu,sans-serif;font-size:26px;font-weight:400}.tutorial-top-subtitle{color:#fff9;font-size:16px;font-weight:300}.tutorial-top-alpha{font-family:Georgia,serif;font-style:italic}.tutorial-exit-btn{color:#ffffff80;cursor:pointer;background:0 0;border:none;padding:0;font-family:Geist Mono,monospace;font-size:13px;transition:color .15s}.tutorial-exit-btn:hover{color:#fff}.tutorial-panel{color:#353535;pointer-events:auto;background:#fff;border:1px solid #0000001f;border-radius:14px;width:740px;max-width:calc(100vw - 40px);padding:24px 28px;font-family:Geist Mono,monospace;transition:opacity .2s;animation:.25s ease-out tutorial-enter;position:fixed;bottom:60px;left:50%;transform:translate(-50%);box-shadow:0 4px 34px #00000026}.tutorial-closing .tutorial-panel{opacity:0}@keyframes tutorial-enter{0%{opacity:0;transform:translate(-50%)translateY(8px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.looper-tutorial .tutorial-panel.lt-side{animation:.25s ease-out lt-enter}@keyframes lt-enter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.looper-tutorial .tutorial-desc{white-space:pre-line}.looper-tutorial .lt-exit{z-index:10001;pointer-events:auto;position:fixed;bottom:18px;left:18px}.tutorial-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.tutorial-title{letter-spacing:.5px;font-size:15px;font-weight:500}.tutorial-counter{color:#00000059;font-size:11px}.tutorial-desc{color:#555;margin-bottom:16px;font-size:13px;line-height:1.5}.tutorial-keys{justify-content:center;gap:20px;margin-bottom:18px;display:flex}.tutorial-instr-line{display:none}.tutorial-instr-label{color:#35353566;letter-spacing:calc(.6px * var(--label-tracking,1));text-transform:none;font-size:12px}.tutorial-keys .mac-key,.instructions-panel .mac-key{color:#353535;background:#fff;border:1.5px solid #454545;border-radius:8px;min-width:38px;height:38px;padding:0 9px;font-size:13px;transition:transform 60ms,box-shadow 60ms;box-shadow:inset 0 -3px #e4e4ea,0 2px #00000038}.tutorial-keys .mac-key.wide,.instructions-panel .mac-key.wide{justify-content:center;min-width:72px}.tutorial-keys .mac-key.mac-key-indicator,.instructions-panel .mac-key.mac-key-indicator{min-width:30px;height:24px;box-shadow:none;color:#0000004d;background:0 0;border-color:#00000026;font-size:11px}.tutorial-keys .mac-key.pressed,.instructions-panel .mac-key.pressed{color:#353535;border-color:var(--key-press-border,var(--c-play,#8b96ff));box-shadow:inset 0 -2px 0 #e4e4ea, 0 1px 0 #0000002e, 0 6px 16px 2px var(--key-press-glow,#8b96ff8c);background:#fff;transform:translateY(3px)}.tutorial-keys .mac-key.pressed-play,.instructions-panel .mac-key.pressed-play{--key-press-border:var(--c-play,#8b96ff);--key-press-glow:#8b96ff99}.tutorial-keys .mac-key.pressed-green,.instructions-panel .mac-key.pressed-green{--key-press-border:#4ab85e;--key-press-glow:#5cc87099}.tutorial-keys .mac-key.pressed-blue,.instructions-panel .mac-key.pressed-blue{--key-press-border:#44a8ff;--key-press-glow:#44a8ff8c}.tutorial-keys .mac-key.pressed-purple,.instructions-panel .mac-key.pressed-purple{--key-press-border:#e092ff;--key-press-glow:#e092ff99}.instr-keys-indicator{margin-bottom:4px}.mac-key.mac-key-indicator{color:#00000059;box-shadow:none;background:0 0;border-color:#0000001f;min-width:26px;height:20px;font-size:10px}.mac-key.pressed,.mac-key.pressed-green{color:#1a3d1f;background:linear-gradient(#7ae093 0%,#5cc870 100%);border-color:#4ab85e}.mac-key.pressed-blue{color:#1a4a6e;background:linear-gradient(#d1f0ff 0%,#a0d8f7 100%);border-color:#44a8ff}.mac-key.pressed-purple{color:#4a1a5e;background:linear-gradient(#f4daff 0%,#e4b8f7 100%);border-color:#e092ff}.mac-key.pressed-play{border-color:var(--c-play,#8b96ff);color:#0b188e;background:linear-gradient(#e4e7fb 0%,#b7bfff 100%)}.tutorial-key-chip{vertical-align:1px;background:#fafafa;border:1px solid #00000040;border-bottom-width:2px;border-radius:4px;padding:0 5px;font-family:Geist Mono,monospace;font-size:11px;line-height:16px;display:inline-block}.tutorial-cycle-num{animation:.7s ease-in-out tutorial-cycle-fade;display:inline-block}@keyframes tutorial-cycle-fade{0%{opacity:0}40%{opacity:1}to{opacity:1}}.tutorial-key-plus{color:#00000073;align-self:center;margin-top:-18px;font-family:Geist Mono,monospace;font-size:30px;font-weight:500}.tutorial-instrument-section{flex-direction:column;align-items:center;gap:16px;margin-bottom:18px;display:flex}.tutorial-daw-logos{justify-content:center;align-items:center;gap:16px;display:flex}.tutorial-daw-logo{object-fit:cover;border-radius:10px;width:56px;height:56px;transition:opacity .3s}.tutorial-midi-status{flex-direction:column;align-items:center;gap:8px;width:100%;display:flex}.tutorial-midi-searching{align-items:center;gap:10px;display:flex}.tutorial-midi-pulse{flex-shrink:0;width:10px;height:10px;position:relative}.tutorial-midi-pulse:before{content:"";background:#e04040;border-radius:50%;position:absolute;inset:0}.tutorial-midi-pulse:after{content:"";border:2px solid #e04040;border-radius:50%;animation:1.5s ease-out infinite midi-ripple;position:absolute;inset:-4px}@keyframes midi-ripple{0%{opacity:.8;transform:scale(1)}to{opacity:0;transform:scale(2.2)}}.tutorial-midi-searching-text{color:#888;font-size:12px}.tutorial-midi-found-row{flex-direction:column;align-items:center;gap:10px;display:flex}.tutorial-midi-found-text{color:#3a7a3a;align-items:center;gap:8px;font-size:13px;font-weight:500;display:flex}.tutorial-midi-check{flex-shrink:0;width:16px;height:16px}.tutorial-nav{justify-content:space-between;display:flex}.tutorial-nav-btn{color:#353535;cursor:pointer;background:0 0;border:1px solid #00000026;border-radius:7px;padding:8px 22px;font-family:Geist Mono,monospace;font-size:12px;transition:background .15s,border-color .15s}.tutorial-nav-btn:hover:not(:disabled){background:#0000000a;border-color:#00000040}.tutorial-nav-btn:disabled{opacity:.25;cursor:default}.tutorial-fullscreen-dim{pointer-events:auto;background:#0000008c;transition:opacity .28s,background .28s,-webkit-backdrop-filter .28s,backdrop-filter .28s;position:fixed;inset:0}.tutorial-fullscreen-blur{-webkit-backdrop-filter:blur(10px)saturate(120%);background:#14141647}.tutorial-closing .tutorial-fullscreen-dim,.welcome-exiting .tutorial-fullscreen-dim{opacity:0;-webkit-backdrop-filter:blur()}.welcome-exiting .tutorial-panel,.welcome-exiting .tutorial-top-bar{opacity:0;transition:opacity .2s}.tutorial-panel-welcome{text-align:center;width:440px;padding:22px 28px;animation:.3s ease-out tutorial-welcome-enter;top:50%;bottom:auto;transform:translate(-50%,-50%)}.tutorial-panel-over-grid{box-shadow:none;background:0 0;border:none}.tutorial-panel-over-grid .tutorial-welcome-title{color:#fff;margin-bottom:12px;font-size:26px}.tutorial-panel-over-grid .tutorial-welcome-subtitle{color:#ffffffbf;max-width:440px;margin-bottom:28px;font-size:15.5px}.tutorial-panel-over-grid .tutorial-welcome-primary{color:#353535;background:#fff;border-color:#ffffff80;min-width:180px;padding:12px 32px;font-size:14px}.tutorial-panel-over-grid .tutorial-welcome-primary:hover{background:#ffffffeb;border-color:#ffffffb3}.tutorial-panel-over-grid .tutorial-welcome-skip{color:#fff6;padding:6px 10px;font-size:13px}.tutorial-panel-over-grid .tutorial-welcome-skip:hover{color:#fffc}.tutorial-welcome-mini{justify-content:center;margin:0 auto 16px;display:flex}@keyframes tutorial-welcome-enter{0%{opacity:0;transform:translate(-50%,calc(8px - 50%))}to{opacity:1;transform:translate(-50%,-50%)}}.tutorial-welcome-title{letter-spacing:.5px;color:#353535;margin:0 0 8px;font-size:20px;font-weight:500}.tutorial-welcome-title.has-avatar{justify-content:center;align-items:center;gap:10px;display:flex}.tutorial-welcome-avatar{border-radius:50%;width:30px;height:30px}.tutorial-welcome-subtitle{color:#777;white-space:pre-line;max-width:380px;margin:0 auto 22px;font-size:13.5px;line-height:1.55}.tutorial-welcome-actions{flex-direction:column;align-items:center;gap:8px;display:flex}.tutorial-welcome-primary{min-width:150px}.tutorial-welcome-skip{color:#0006;cursor:pointer;background:0 0;border:none;padding:4px 10px;font-family:Geist Mono,monospace;font-size:12px;transition:color .15s}.tutorial-welcome-skip:hover{color:#000000b3}.tutorial-daw-checkbox{color:#353535;cursor:pointer;background:#fff;border:1.5px solid #454545;border-radius:8px;align-items:center;gap:10px;padding:10px 18px;font-family:Geist Mono,monospace;font-size:12px;transition:transform 60ms,box-shadow 60ms,border-color .15s;display:inline-flex;box-shadow:inset 0 -3px #e4e4ea,0 2px #00000038}.tutorial-daw-checkbox:hover{border-color:var(--c-play,#8b96ff)}.tutorial-daw-checkbox.checked{border-color:var(--c-play,#8b96ff);transform:translateY(3px);box-shadow:inset 0 -2px #e4e4ea,0 1px #0000002e,0 6px 16px 2px #8b96ff8c}.tutorial-daw-checkbox-mark{border:1.5px solid #0000004d;border-radius:3px;flex-shrink:0;justify-content:center;align-items:center;width:14px;height:14px;transition:background .15s,border-color .15s;display:inline-flex}.tutorial-daw-checkbox.checked .tutorial-daw-checkbox-mark{background:var(--c-play,#8b96ff);border-color:var(--c-play,#8b96ff)}.tutorial-daw-checkbox-mark svg{stroke:#fff;opacity:0;width:10px;height:10px;transition:opacity .15s}.tutorial-daw-checkbox.checked .tutorial-daw-checkbox-mark svg{opacity:1}@media (width<=640px){.tutorial-top-bar{justify-content:flex-end;padding:0 6px;top:calc(10px + env(safe-area-inset-top))!important}.tutorial-top-title{display:none}.tutorial-exit-btn{padding:6px 8px;font-size:12px}.tutorial-panel{bottom:calc(10px + env(safe-area-inset-bottom));max-width:calc(100vw - 24px);padding:16px 18px}.tutorial-desc{margin-bottom:14px;font-size:12px}.tutorial-nav-btn{padding:10px 22px}.tutorial-panel-welcome{padding:18px 20px;bottom:auto}}.tutorial-pro-teaser{color:#353535;cursor:pointer;background:#fff;border:1.4px solid #dbdbdb;border-radius:7px;align-items:center;gap:10px;padding:9px 18px;font-family:Geist Mono,monospace;font-size:12px;transition:border-color .1s,background .1s,transform 60ms,box-shadow 60ms;display:inline-flex;box-shadow:inset 0 -2px #e4e4ea,0 1.5px #0000001f}.tutorial-pro-teaser:hover{border-color:#bbb}.tutorial-pro-teaser:active{transform:translateY(2px);box-shadow:inset 0 -1px #e4e4ea,0 1px #0000001a}.tutorial-pro-teaser-lock{letter-spacing:.6px;text-transform:uppercase;color:#fff;white-space:nowrap;background:#3a3a3e;border-radius:5px;align-items:center;gap:5px;padding:4px 8px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:10px;font-weight:700;display:inline-flex}.tutorial-pro-teaser-spin{text-align:center;width:1em;font-size:10px;line-height:1;display:inline-block}.instructions-panel .mac-key{border-width:1.2px;border-radius:6px;min-width:26px;height:26px;padding:0 6px;font-size:10px;box-shadow:inset 0 -2px #e4e4ea,0 1.5px #00000038}.instructions-panel .mac-key.wide{min-width:48px}.instructions-panel .mac-key.pressed{box-shadow:inset 0 -1px 0 #e4e4ea, 0 1px 0 #0000002e, 0 4px 10px 1px var(--key-press-glow,#8b96ff8c);transform:translateY(2px)}.pro-tutorial-backdrop{background:#0000008c;transition:opacity .2s;position:fixed;inset:0}.tutorial-closing .pro-tutorial-backdrop{opacity:0}.pro-tutorial .tutorial-panel-welcome{pointer-events:auto}.pro-strum-panel{width:500px;animation:none;transform:translate(calc(120px - 50%))}.pro-strum-checks{justify-content:center;gap:18px;margin:4px 0 18px;display:flex}.pro-strum-check{color:#3535358c;border:1px solid #00000026;border-radius:7px;align-items:center;gap:10px;padding:9px 18px;font-size:12.5px;transition:border-color .2s,color .2s;display:inline-flex}.pro-strum-check.done{color:#3a7a3a;border-color:#3a7a3a80}.pro-strum-check-mark{border:1.5px solid #00000040;border-radius:4px;justify-content:center;align-items:center;width:15px;height:15px;transition:background .2s,border-color .2s;display:inline-flex}.pro-strum-check-mark svg{stroke:#fff;opacity:0;width:9px;height:9px;transition:opacity .15s}.pro-strum-check.done .pro-strum-check-mark{background:#3a7a3a;border-color:#3a7a3a}.pro-strum-check.done .pro-strum-check-mark svg{opacity:1}.tutorial-nav-solo{justify-content:flex-end}.pro-tutorial .daw-setup-steps{background:#fafafa;margin-bottom:16px;font-size:12.5px}.trackpad-control{background:var(--surface-tile);border:1px solid var(--c-border);border-radius:var(--r-pad);flex-direction:column;width:160px;min-width:160px;display:flex;position:relative}.trackpad-grid-wrap{border-radius:calc(var(--r-pad) - 1px) calc(var(--r-pad) - 1px) 0 0;flex:1;position:relative;overflow:hidden}.trackpad-canvas{cursor:default;touch-action:none;width:100%;height:100%;display:block}.trackpad-axis-y{color:#35353580;letter-spacing:.5px;pointer-events:none;font-family:Geist Mono,monospace;font-size:9px;position:absolute;top:50%;left:11px;transform:translate(-50%,-50%)rotate(-90deg)}.trackpad-axis-x{color:#35353580;letter-spacing:.5px;pointer-events:none;font-family:Geist Mono,monospace;font-size:9px;position:absolute;bottom:4px;left:50%;transform:translate(-50%)}.strum-help{color:#fff;text-align:center;opacity:0;pointer-events:none;background:#9a9a9a;border:none;border-radius:50%;width:16px;height:16px;padding:0;font-family:Geist Mono,monospace;font-size:10px;line-height:16px;transition:opacity .25s,background .25s;position:absolute;bottom:8px;right:8px}.trackpad-grid-wrap:hover .strum-help{opacity:.5;pointer-events:auto;cursor:pointer}.strum-help:hover{opacity:.7;background:#7f7f7f}.strum-help.strum-help-hidden,.trackpad-grid-wrap:hover .strum-help.strum-help-hidden{opacity:0;pointer-events:none}.trackpad-lock-hint{color:#0006;pointer-events:none;white-space:nowrap;justify-content:center;align-items:center;gap:6px;font-family:Geist Mono,monospace;font-size:10px;display:flex;position:absolute;top:calc(100% + 8px);left:0;right:0}.trackpad-lock-key{color:#0000008c;letter-spacing:.3px;background:#fff;border:1px solid #0003;border-bottom-width:2px;border-radius:3px;justify-content:center;align-items:center;min-width:22px;height:16px;padding:0 5px;font-size:9px;display:inline-flex}@media (width<=640px){.trackpad-control{width:100%;min-width:0;height:128px}.trackpad-grid-wrap{border-radius:9px}}.piano-wrap{padding:var(--pad-piano-y) var(--pad-piano-x);background:var(--surface-piano);border:1px solid var(--c-border);border-radius:var(--r-pad);flex:1;justify-content:center;align-items:center;display:flex;overflow:hidden}.piano-mask{margin:-14px -8px;padding:14px 8px;-webkit-mask:linear-gradient(90deg,#0000 0,#000 8px calc(100% - 8px),#0000 100%) no-repeat;mask:linear-gradient(90deg,#0000 0,#000 8px calc(100% - 8px),#0000 100%) no-repeat}.piano{height:88px;position:relative}.piano-slide{height:100%;display:flex;position:absolute;top:0}.piano-slide.sliding{animation:.24s cubic-bezier(.22,.9,.3,1) forwards piano-slide}@keyframes piano-slide{0%{transform:translateX(var(--slide-from))}to{transform:translate(0)}}.key-in{animation:80ms ease-out backwards key-fade-in}.key-out{animation:80ms ease-out forwards key-fade-out}@keyframes key-fade-in{0%{opacity:0}}@keyframes key-fade-out{to{opacity:0}}.white-key{border-radius:var(--r-key);width:22px;height:88px;box-shadow:var(--sh-key);z-index:1;margin-right:var(--gap-key);background:#fff;transition:background 60ms,box-shadow 60ms,transform 60ms;position:relative}.white-key.highlighted{background:var(--key-hi-bg);box-shadow:var(--sh-key-active);transform:translateY(var(--key-press-y))}.black-key{background:var(--c-ink);border-radius:var(--r-key);width:15px;height:50px;box-shadow:var(--sh-key-black);z-index:2;transition:background 60ms,box-shadow 60ms,transform 60ms;position:absolute;top:2px}.black-key.highlighted{background:var(--key-hi-bg-black);box-shadow:var(--sh-key-black-active);transform:translateY(var(--key-press-y))}.settings-overlay{z-index:10000;-webkit-backdrop-filter:blur(10px)saturate(120%);background:#14141647;justify-content:center;align-items:center;animation:.2s ease-out settings-fade-in;display:flex;position:fixed;inset:0}.settings-overlay.settings-closing{animation:.2s ease-out forwards settings-fade-out}@keyframes settings-fade-in{0%{opacity:0;-webkit-backdrop-filter:blur()}to{opacity:1}}@keyframes settings-fade-out{0%{opacity:1}to{opacity:0}}.settings-panel{color:#353535;background:#fff;border:1px solid #0000001f;border-radius:14px;width:520px;max-width:calc(100vw - 40px);padding:20px 24px 22px;font-family:Geist Mono,monospace;animation:.22s ease-out settings-panel-enter;box-shadow:0 4px 34px #0000002e}@keyframes settings-panel-enter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.settings-header{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.settings-title{letter-spacing:.5px;font-size:15px;font-weight:500}.settings-close{cursor:pointer;color:#00000080;background:0 0;border:1px solid #0000001f;border-radius:6px;justify-content:center;align-items:center;width:26px;height:26px;transition:background .15s,color .15s,border-color .15s;display:inline-flex}.settings-close:hover{color:#353535;background:#0000000a;border-color:#00000040}.settings-close svg{stroke:currentColor;stroke-width:1.4px;stroke-linecap:round}.settings-section-label{font-size:var(--label-size,11px);color:#0006;letter-spacing:calc(.8px * var(--label-tracking,1));text-transform:var(--label-transform,uppercase);margin-bottom:6px}.settings-section-desc{color:#888;margin-bottom:12px;font-size:12px;line-height:1.5}.settings-list{background:#fafafa;border:1px solid #00000014;border-radius:10px;flex-direction:column;display:flex;overflow:hidden}.settings-list-group{flex-direction:column;display:flex}.settings-list-group+.settings-list-group{border-top:1px solid #0000000f}.settings-row{text-align:left;width:100%;color:inherit;cursor:pointer;background:0 0;border:none;align-items:center;gap:12px;padding:10px 12px;font-family:inherit;transition:background .12s;display:flex}.settings-row:hover{background:#00000008}.settings-row-active{background:#f3f4ff}.settings-row-active:hover{background:#edefff}.settings-row-preview{border-radius:6px;flex:none;justify-content:center;align-items:center;width:72px;height:48px;display:flex;overflow:hidden}.settings-row-preview .pv-svg{width:100%;height:100%;display:block}.settings-row-body{flex-direction:column;flex:auto;gap:2px;min-width:0;display:flex}.settings-row-label{letter-spacing:.4px;color:#353535;align-items:center;gap:8px;font-size:12px;font-weight:500;display:flex}.settings-row-locked .settings-row-preview,.settings-row-locked .settings-row-desc{opacity:.55}.settings-row-desc{color:#888;font-size:11px;line-height:1.4}.settings-row-check{width:16px;height:16px;color:var(--c-play,#8b96ff);flex:none;justify-content:center;align-items:center;display:flex}.settings-check-icon{display:block}.pv-svg{overflow:visible}.pv-frame{fill:#fff;stroke:#00000014;stroke-width:1px}.pv-dot-hero{fill:#dc5050}.pv-plus{stroke:#dc5050;stroke-width:1.6px;stroke-linecap:round}.pv-track{stroke:#0000001a;stroke-width:1px;stroke-linecap:round}.pv-grid-dot{fill:#dbdbdb}.pv-xhair{stroke:#dc5050;stroke-width:.8px;stroke-linecap:round}.pv-arp-bar{fill:#0000002e;transition:fill .1s,y .1s,height .1s}.pv-arp-bar-on{fill:var(--c-play,#8b96ff)}.footer-settings-cog{color:#ffffff80;cursor:pointer;font:inherit;text-transform:inherit;background:0 0;border:none;justify-content:center;align-items:center;gap:8px;padding:0;transition:color .15s;display:inline-flex}.footer-settings-cog:hover{color:#fff}.footer-settings-cog:hover svg{transform:rotate(30deg)}.footer-settings-cog svg{stroke:currentColor;fill:none;stroke-width:1.4px;stroke-linecap:round;stroke-linejoin:round;width:14px;height:14px;transition:transform .2s}.about-overlay{z-index:10001;-webkit-backdrop-filter:blur(10px)saturate(120%);background:#14141647;justify-content:center;align-items:center;animation:.2s ease-out about-fade-in;display:flex;position:fixed;inset:0}.about-overlay.about-closing{animation:.2s ease-out forwards about-fade-out}@keyframes about-fade-in{0%{opacity:0;-webkit-backdrop-filter:blur()}to{opacity:1}}@keyframes about-fade-out{0%{opacity:1}to{opacity:0}}.about-panel{color:#353535;background:#fff;border:1px solid #0000001f;border-radius:14px;width:660px;max-width:calc(100vw - 40px);max-height:calc(100vh - 48px);padding:28px;font-family:Geist Mono,monospace;animation:.22s ease-out about-panel-enter;overflow-y:auto;box-shadow:0 4px 34px #0000002e}@keyframes about-panel-enter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.about-header{justify-content:flex-end;margin-bottom:12px;display:flex}.about-close{cursor:pointer;color:#00000080;background:0 0;border:1px solid #0000001f;border-radius:6px;justify-content:center;align-items:center;width:26px;height:26px;transition:background .15s,color .15s,border-color .15s;display:inline-flex}.about-close:hover{color:#353535;background:#0000000a;border-color:#00000040}.about-close svg{stroke:currentColor;stroke-width:1.4px;stroke-linecap:round}.about-manifesto-text{letter-spacing:-.02em;color:#00000073;margin:0;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:21px;font-weight:500;line-height:1.28}.about-manifesto-text+.about-manifesto-text{margin-top:1.15em}.about-hl{color:#111}.about-avatar{object-fit:cover;vertical-align:-.24em;border-radius:50%;width:1.15em;height:1.15em;margin:0 .14em;display:inline-block}.about-name{font:inherit;color:inherit;cursor:pointer;text-underline-offset:.12em;background:0 0;border:0;padding:0;-webkit-text-decoration:underline #00000080;text-decoration:underline #00000080;text-decoration-thickness:.055em;transition:text-decoration-color .2s}.about-name:hover{text-decoration-color:currentColor}.about-watch-pill{z-index:10005;pointer-events:none;color:#17171c;white-space:nowrap;opacity:0;background:#fff;border-radius:999px;align-items:center;gap:8px;padding:6px 12px 6px 7px;font-family:Geist Mono,monospace;font-size:12.5px;font-weight:600;animation:.28s .9s forwards about-watch-pill-in;display:inline-flex;position:fixed;transform:translate(-50%);box-shadow:0 8px 24px #00000059}@keyframes about-watch-pill-in{0%{opacity:0;transform:translate(-50%)translateY(4px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.about-watch-pill-play{color:#fff;background:#17171c;border-radius:5px;flex-shrink:0;justify-content:center;align-items:center;width:18px;height:18px;display:inline-flex}.about-watch-pill-play svg{width:9px;height:9px;margin-left:.5px}.about-video-modal{z-index:10006;-webkit-backdrop-filter:blur(16px);background:#09090cb8;justify-content:center;align-items:center;padding:clamp(16px,4vw,48px);animation:.22s about-video-modal-in;display:flex;position:fixed;inset:0}@keyframes about-video-modal-in{0%{opacity:0}to{opacity:1}}.about-video-modal-video{background:#000;border-radius:12px;width:auto;max-width:min(1100px,94vw);max-height:86vh;box-shadow:0 30px 90px #0009}.about-video-modal-close{color:#ececf2;cursor:pointer;background:#ffffff1a;border:0;border-radius:999px;justify-content:center;align-items:center;width:40px;height:40px;transition:background .2s;display:flex;position:absolute;top:clamp(14px,2.5vw,26px);right:clamp(14px,2.5vw,26px)}.about-video-modal-close:hover{background:#fff3}.about-video-modal-close svg{width:20px;height:20px}.about-footer-note{letter-spacing:-.02em;color:#111;border-top:1px solid #00000024;margin:26px 0 0;padding-top:20px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:21px;font-weight:500;line-height:1.28}.about-footer-link{color:inherit;text-underline-offset:2px;text-decoration:underline;text-decoration-thickness:1px}.about-footer-spin{min-width:.7em;display:inline-block}.daw-wizard-overlay{z-index:10000;pointer-events:auto;position:fixed;inset:0}.daw-wizard-close{position:static}.daw-wizard-panel .daw-setup-steps{background:#fafafa;margin-bottom:16px;font-size:12.5px}.daw-wizard-list{flex-direction:column;gap:7px;display:flex}.daw-wizard-list-item{color:#353535;cursor:pointer;text-align:left;background:0 0;border:1px solid #0000001f;border-radius:9px;align-items:center;gap:14px;width:100%;padding:11px 14px;font-family:Geist Mono,monospace;font-size:13px;transition:background .15s,border-color .15s;display:flex}.daw-wizard-list-item:hover{background:#0000000a;border-color:#0000004d}.daw-wizard-list-logo{object-fit:contain;border-radius:6px;flex-shrink:0;width:26px;height:26px}.daw-wizard-list-logo-other{color:#00000073;background:#0000000f;justify-content:center;align-items:center;font-size:14px;display:inline-flex}.daw-wizard-restart-step{color:#353535;font-weight:600}.daw-wizard-step-done{color:#3a7a3a;-webkit-text-decoration:line-through #3a7a3a80;text-decoration:line-through #3a7a3a80}.daw-wizard-ports{border-top:1px solid #00000014;margin-top:16px;padding-top:12px}.daw-wizard-ports-title{letter-spacing:.5px;text-transform:uppercase;color:#0006;margin-bottom:8px;font-size:11px}.daw-wizard-port-row{border:1px solid #00000014;border-radius:8px;justify-content:space-between;align-items:center;gap:12px;margin-bottom:6px;padding:8px 12px;display:flex}.daw-wizard-port-row.wanted{background:#3a7a3a0d;border-color:#3a7a3a73}.daw-wizard-port-row.wanted .daw-wizard-port-name{color:#3a7a3a;font-weight:500}.daw-wizard-port-row.hardware .daw-wizard-port-name{color:#0000008c}.daw-wizard-port-name{align-items:center;gap:8px;min-width:0;font-size:13px;display:flex}.daw-wizard-port-tag{letter-spacing:.4px;color:#00000080;white-space:nowrap;background:#0000000f;border-radius:20px;padding:2px 8px;font-size:11px}.daw-wizard-port-row.wanted .daw-wizard-port-tag{color:#3a7a3a;background:#3a7a3a1f}.daw-wizard-warn{margin-top:8px}.daw-wizard-nav{justify-content:space-between;margin-top:16px;display:flex}.daw-wizard-primary{color:#fff;background:#353535;border-color:#353535}.daw-wizard-primary:hover:not(:disabled){background:#1f1f1f;border-color:#1f1f1f}.account-wrap{display:inline-flex;position:relative}.account-btn{letter-spacing:.4px;color:#0009;cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #00000024;border-radius:6px;padding:5px 10px;font-family:Geist Mono,monospace;font-size:11px;transition:background .15s,border-color .15s,color .15s}.account-btn:hover{color:#353535;background:#0000000a;border-color:#00000047}.account-btn-pro{color:#353535;border-color:#353535;font-weight:600}.account-btn-loading{opacity:.4;pointer-events:none;width:54px;height:26px}.account-menu-backdrop{z-index:40;position:fixed;inset:0}.account-menu{z-index:41;background:#fff;border:1px solid #0000001f;border-radius:10px;min-width:180px;padding:6px;font-family:Geist Mono,monospace;position:absolute;top:calc(100% + 6px);right:0;box-shadow:0 4px 24px #00000024}.account-menu-email{color:#00000073;text-overflow:ellipsis;white-space:nowrap;border-bottom:1px solid #00000014;margin-bottom:4px;padding:6px 8px 8px;font-size:11px;overflow:hidden}.account-menu-item{text-align:left;color:#353535;cursor:pointer;background:0 0;border:none;border-radius:6px;width:100%;padding:8px;font-family:inherit;font-size:12px;transition:background .12s;display:block}.account-menu-item:hover:not(:disabled){background:#0000000d}.account-menu-item:disabled{opacity:.5;cursor:default}.account-menu-item-accent{color:#353535;font-weight:600}.keep-case{text-transform:none}.prog-corner{z-index:5;font-family:Geist Mono,monospace;font-size:13px;transition:opacity .45s;position:fixed;top:18px;left:20px}.prog-corner-pending{opacity:0;pointer-events:none}.prog-corner-row{text-transform:var(--footer-transform,lowercase);color:#ffffff80;align-items:center;gap:14px;display:flex}.prog-popup{color:#353535;background:#fff;border:1.4px solid #dbdbdb;border-radius:10px;font-size:12px;animation:.15s ease-out prog-popup-in;position:absolute;top:calc(100% + 10px);left:0;box-shadow:0 10px 32px #00000024}@keyframes prog-popup-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.prog-save-popup{flex-wrap:wrap;gap:6px;width:260px;padding:8px;display:flex}.prog-share-hint{color:#353535a6;text-transform:none;width:100%;padding:2px 2px 0;font-size:11px;line-height:1.45}.prog-name-input{min-width:0;font:inherit;color:#353535;background:#fff;border:1px solid #dbdbdb;border-radius:6px;outline:none;flex:1;padding:6px 8px}.prog-name-input:focus{border-color:#999}.prog-name-input::placeholder{color:#aaa}.prog-save-confirm{font:inherit;color:#353535;cursor:pointer;background:#fff;border:1px solid #dbdbdb;border-radius:6px;padding:6px 10px;transition:border-color .1s}.prog-save-confirm:hover:not(:disabled){border-color:#999}.prog-save-confirm:disabled{color:#bbb;cursor:default}.prog-load-popup{width:280px;max-height:240px;padding:5px;overflow-y:auto}.prog-row{cursor:pointer;border-radius:6px;align-items:center;gap:8px;padding:7px 6px 7px 9px;display:flex}.prog-row:hover,.prog-row:focus-visible{background:#f4f4f4;outline:none}.prog-row-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.prog-row-name.marquee{text-overflow:clip}.prog-marquee-track{white-space:nowrap;animation:linear infinite prog-marquee;display:inline-flex}@keyframes prog-marquee{0%{transform:translate(0)}to{transform:translateX(var(--marquee-shift))}}.prog-row-tag{border-radius:4px;flex-shrink:0;padding:3px 5px;font-size:10px;line-height:1}.prog-row-date{color:#a5a5a5;flex-shrink:0;font-size:10px}.prog-row-delete{cursor:pointer;color:#aaa;opacity:0;pointer-events:none;background:0 0;border:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;width:18px;height:18px;padding:0;display:flex}.prog-row:hover .prog-row-delete,.prog-row-delete:focus-visible{opacity:1;pointer-events:auto}.prog-row-delete:hover{color:#353535;background:#e8e8e8}.prog-row-confirm-delete{height:18px;font:inherit;color:#d05050;cursor:pointer;background:#d0505014;border:1px solid #d0505059;border-radius:4px;flex-shrink:0;align-items:center;padding:0 6px;font-size:11px;display:flex}.prog-row-confirm-delete:hover{background:#d0505029;border-color:#d05050}.prog-row-delete svg line{stroke:currentColor;stroke-width:2px;stroke-linecap:round}.prog-active-name{color:#fffc;text-overflow:ellipsis;white-space:nowrap;max-width:160px;overflow:hidden}.prog-confirm{width:250px;padding:12px 14px}.prog-confirm-msg{color:var(--c-ink);text-transform:none;font-size:12px;line-height:1.5}.prog-confirm-btns{gap:6px;margin-top:10px;display:flex}.prog-confirm-btns button{font:inherit;cursor:pointer;border-radius:6px;flex:1;padding:5px 0;font-size:12px}.prog-confirm-save{background:var(--c-play-bg);color:var(--c-play-ink);border:1px solid var(--c-play)}.prog-confirm-save:hover{filter:brightness(.97)}.prog-confirm-discard{color:#35353599;border:1px solid var(--c-border);background:0 0}.prog-confirm-discard:hover{color:#d05050;border-color:#d0505080}.share-toast-body{color:#353535b3;margin-top:10px;font-size:12px;line-height:1.5}@media (width<=640px),(pointer:coarse){.prog-corner{display:none}}.restore-toast{border:var(--bw-tile) solid var(--c-border);border-radius:var(--r-panel);width:320px;box-shadow:0 10px 30px #0000002e, var(--sh-control);z-index:80;background:#fff;padding:14px 16px;font-family:Geist Mono,monospace;animation:.22s ease-out rt-in;position:fixed;bottom:18px;right:18px}@keyframes rt-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.rt-close{color:#35353573;cursor:pointer;background:0 0;border:none;padding:0 2px;font-size:16px;line-height:1;position:absolute;top:8px;right:10px}.rt-close:hover{color:var(--c-ink)}.rt-title{color:var(--c-ink);padding-right:16px;font-size:12px;font-weight:700;line-height:1.45}.rt-sub{color:#35353573;margin-top:3px;font-size:12px}.rt-evs{gap:5px;margin-top:10px;display:flex}.rt-ev{background:var(--surface-tile);border:var(--bw-tile) solid var(--c-border);border-radius:var(--r-btn);width:36px;height:40px;box-shadow:var(--sh-control);flex-direction:column;flex:none;justify-content:center;align-items:center;gap:2px;display:flex;overflow:hidden}.rt-ev-roman{color:var(--c-ink);white-space:nowrap;font-family:Geist Mono,monospace;font-size:12px;font-weight:700;line-height:1}.rt-ev-dots{align-items:center;height:5px;display:flex}.rt-dot{opacity:0;border-radius:50%;width:0;height:4px;margin:0}.rt-dot.rt-dot-on{opacity:1;width:4px;margin:0 1.5px}.rt-dot-type{background:var(--c-type)}.rt-dot-inversion{background:var(--c-inversion)}.rt-dot-secondary{background:var(--c-secondary)}.rt-restore{width:100%;color:var(--c-ink);cursor:pointer;background:#fff;border:1.4px solid #dbdbdb;border-radius:7px;margin-top:12px;padding:7px 11px;font-family:Geist Mono,monospace;font-size:12px;transition:border-color .1s,background .1s,transform 60ms,box-shadow 60ms;box-shadow:inset 0 -2px #e4e4ea,0 1.5px #0000001f}.rt-restore:hover{background:#f6f6f6;border-color:#bbb}.rt-restore:active{transform:translateY(2px);box-shadow:inset 0 -1px #e4e4ea,0 1px #0000001a}@media (width<=640px){.restore-toast{width:auto;bottom:10px;left:10px;right:10px}}.top-right-corner{z-index:5;font-family:Geist Mono,monospace;font-size:13px;transition:opacity .45s;position:fixed;top:18px;right:20px}.top-right-corner-pending{opacity:0;pointer-events:none}.top-right-corner-row{text-transform:var(--footer-transform,lowercase);color:#ffffff80;align-items:center;gap:14px;display:flex}@media (width<=640px),(pointer:coarse){.top-right-corner{display:none}}.dot-grid-canvas{pointer-events:none;z-index:0;width:100vw;height:100vh;position:fixed;inset:0}.auth-overlay{z-index:10000;-webkit-backdrop-filter:blur(10px)saturate(120%);background:#14141647;justify-content:center;align-items:center;animation:.2s ease-out auth-fade-in;display:flex;position:fixed;inset:0}.auth-overlay.auth-closing{animation:.2s ease-out forwards auth-fade-out}@keyframes auth-fade-in{0%{opacity:0}to{opacity:1}}@keyframes auth-fade-out{0%{opacity:1}to{opacity:0}}.auth-panel{color:#353535;background:#fff;border:1px solid #0000001f;border-radius:14px;width:380px;max-width:calc(100vw - 40px);padding:20px 24px 22px;font-family:Geist Mono,monospace;animation:.22s ease-out auth-panel-enter;box-shadow:0 4px 34px #0000002e}@keyframes auth-panel-enter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.auth-header{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.auth-title{letter-spacing:.5px;font-size:15px;font-weight:500}.auth-close{cursor:pointer;color:#00000080;background:0 0;border:1px solid #0000001f;border-radius:6px;justify-content:center;align-items:center;width:26px;height:26px;transition:background .15s,color .15s,border-color .15s;display:inline-flex}.auth-close:hover{color:#353535;background:#0000000a;border-color:#00000040}.auth-close svg{stroke:currentColor;stroke-width:1.4px;stroke-linecap:round}.auth-oauth{flex-direction:column;gap:8px;display:flex}.auth-oauth-btn{color:#353535;cursor:pointer;background:#fff;border:1px solid #00000024;border-radius:8px;justify-content:center;align-items:center;gap:8px;width:100%;padding:10px 12px;font-family:inherit;font-size:13px;transition:background .15s,border-color .15s;display:flex}.auth-google-g{flex:none;width:15px;height:15px}.auth-oauth-btn:hover{background:#0000000a;border-color:#00000040}.auth-divider{text-align:center;color:#00000059;letter-spacing:.8px;text-transform:uppercase;align-items:center;margin:16px 0;font-size:11px;display:flex}.auth-divider:before,.auth-divider:after{content:"";background:#0000001a;flex:1;height:1px}.auth-divider span{padding:0 10px}.auth-form{flex-direction:column;gap:12px;display:flex}.auth-field{flex-direction:column;gap:5px;display:flex}.auth-field span{color:#0006;letter-spacing:.8px;text-transform:uppercase;font-size:11px}.auth-field input{color:#353535;box-sizing:border-box;background:#fafafa;border:1px solid #00000024;border-radius:8px;width:100%;padding:9px 11px;font-family:inherit;font-size:13px}.auth-field input:focus{background:#fff;border-color:#0006;outline:none}.auth-error{color:#c0392b;font-size:12px;line-height:1.4}.auth-notice{color:#2d7a46;font-size:12px;line-height:1.4}.auth-submit{color:#fff;letter-spacing:.4px;cursor:pointer;background:#353535;border:none;border-radius:8px;width:100%;margin-top:2px;padding:11px 12px;font-family:inherit;font-size:13px;font-weight:500;transition:background .15s}.auth-submit:hover:not(:disabled){background:#000}.auth-submit:disabled{opacity:.5;cursor:default}.auth-switch{text-align:center;color:#00000080;margin-top:16px;font-size:12px}.auth-switch button{color:#353535;cursor:pointer;background:0 0;border:none;padding:0;font-family:inherit;font-size:12px;text-decoration:underline}.paywall-overlay{z-index:10003;justify-content:center;align-items:center;animation:.2s ease-out paywall-fade-in;display:flex;position:fixed;inset:0}.paywall-overlay.paywall-closing{animation:.2s ease-out forwards paywall-fade-out}@keyframes paywall-fade-in{0%{opacity:0}to{opacity:1}}@keyframes paywall-fade-out{0%{opacity:1}to{opacity:0}}.paywall-panel{color:#353535;background:#fff;border:1px solid #0000001f;border-radius:16px;width:780px;max-width:calc(100vw - 32px);max-height:calc(100vh - 48px);padding:28px;font-family:Geist Mono,monospace;animation:.22s ease-out paywall-panel-enter;position:relative;overflow-y:auto;box-shadow:0 16px 64px #00000073}@keyframes paywall-panel-enter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.paywall-close{cursor:pointer;color:#00000080;background:0 0;border:1px solid #0000001f;border-radius:6px;justify-content:center;align-items:center;width:26px;height:26px;transition:background .15s,color .15s,border-color .15s;display:inline-flex;position:absolute;top:16px;right:16px}.paywall-close:hover{color:#353535;background:#0000000a;border-color:#00000040}.paywall-close svg{stroke:currentColor;stroke-width:1.4px;stroke-linecap:round}.paywall-hero{grid-template-columns:1fr auto;align-items:start;gap:24px;margin-bottom:22px;padding-right:30px;display:grid}.paywall-headline{color:#111;margin:0 0 8px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:30px;font-weight:700;line-height:1.1}.paywall-lede{color:#0000008c;max-width:260px;margin:0;font-size:12.5px;line-height:1.55}.paywall-features{flex-direction:column;gap:10px;margin:4px 0 0;padding:0;list-style:none;display:flex}.paywall-feature{color:#353535;align-items:center;gap:10px;font-size:12.5px;line-height:1.4;display:flex}.paywall-feature-check{flex:none;width:15px;height:15px;display:inline-flex}.paywall-feature-check svg{width:100%;height:100%}.paywall-buy-grid{grid-template-columns:1fr 1fr;align-items:stretch;gap:14px;display:grid}.paywall-buy-card{background:#f4f4f5;border-radius:14px;flex-direction:column;gap:14px;padding:20px;display:flex;position:relative}.paywall-buy-title{color:#111;margin:0 0 6px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:17px;font-weight:700}.paywall-buy-desc{color:#00000080;margin:0;font-size:11.5px;line-height:1.5}.paywall-buy-price{align-items:baseline;gap:7px;margin:4px 0 6px;display:flex}.paywall-buy-amt{color:#111;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:40px;font-weight:700;line-height:1}.paywall-buy-new{color:#111;white-space:nowrap;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:40px;font-weight:700;line-height:1}.paywall-buy-old{color:#00000059;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:16px;font-weight:700;line-height:1;text-decoration:line-through}.paywall-buy-per{color:#00000073;font-size:12px}.paywall-buy-save{letter-spacing:.5px;text-transform:uppercase;color:#10151a;white-space:nowrap;border-radius:999px;align-self:center;padding:2px 8px;font-size:10px;font-weight:700;animation:6s ease-in-out infinite paywall-save-hue}@keyframes paywall-save-hue{0%,to{background:#44a8ff}33%{background:#7ae093}66%{background:#e092ff}}.paywall-buy-btn{color:#fff;letter-spacing:.4px;cursor:pointer;background:#1a1a1a;border:none;border-radius:10px;width:100%;margin-top:auto;padding:11px 12px;font-family:inherit;font-size:13px;font-weight:500;transition:background .15s}.paywall-buy-btn:hover:not(:disabled){background:#000}.paywall-buy-btn:disabled{opacity:.5;cursor:default}.paywall-detail-grid{grid-template-columns:1fr 1fr 1fr;gap:14px;margin-top:14px;display:grid}.paywall-detail-card{background:#f4f4f5;border-radius:14px;padding:18px}.paywall-detail-icon{color:#1a1a1a;width:20px;height:20px;margin-bottom:12px;display:inline-flex}.paywall-detail-icon svg{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;width:100%;height:100%}.paywall-detail-title{color:#111;margin:0 0 8px;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:13.5px;font-weight:700}.paywall-detail-body{color:#0000008c;margin:0;font-size:12px;line-height:1.4}.paywall-detail-link{color:#353535;text-decoration:underline}.paywall-error{color:#c0392b;text-align:center;margin-top:14px;font-size:12px;line-height:1.4}.paywall-signin-nudge{text-align:center;color:#00000080;margin-top:16px;font-size:12px;line-height:1.5}.paywall-signin-nudge button{color:#353535;cursor:pointer;background:0 0;border:none;padding:0;font-family:inherit;font-size:12px;text-decoration:underline}@media (width<=640px){.paywall-hero{grid-template-columns:1fr;gap:16px}.paywall-buy-grid,.paywall-detail-grid{grid-template-columns:1fr}}.paywall-claim{text-align:center;border:1px solid #e3e3e3;border-radius:12px;margin:4px 0 12px;padding:22px 24px}.paywall-claim .paywall-buy-desc{max-width:420px;margin:6px auto 14px}.paywall-claim .paywall-buy-btn{max-width:240px;margin:0 auto}.looper-card{padding-bottom:var(--pad-card-top);margin-top:18px;transition:opacity .45s,transform .45s}.looper-card:not(.lp-hidden){will-change:transform, opacity;animation:.55s cubic-bezier(.22,.9,.3,1) .14s backwards looper-card-in}@keyframes looper-card-in{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.looper-card.lp-hidden{opacity:0;pointer-events:none;transform:scale(.985)}.lp-controls{justify-content:space-between;align-items:flex-end;gap:16px;display:flex}.lp-controls-right{align-items:flex-end;gap:12px;min-width:0;display:flex}.lp-stepper{border-radius:var(--r-control);box-shadow:var(--sh-control);align-items:center;display:flex}.lp-stepper button{width:30px;height:var(--control-h,37px);background:var(--surface-btn);color:var(--c-ink);border:var(--bw-tile) solid var(--c-border);cursor:pointer;justify-content:center;align-items:center;padding:0;font-family:Geist Mono,monospace;font-size:14px;transition:background .1s;display:flex}.lp-stepper button:first-child{border-radius:var(--r-control) 0 0 var(--r-control)}.lp-stepper button:hover:not(:disabled){background:#f0f0f0}.lp-stepper button:active:not(:disabled){box-shadow:var(--sh-oct-active)}.lp-stepper button:disabled{opacity:.45;cursor:default}.lp-metro:not(:disabled){cursor:ew-resize}.lp-metro{touch-action:none}.lp-metro-pend{transform-origin:10px 16.7px;transform-box:view-box}.lp-bpm-input{width:46px;height:var(--control-h,37px);border:none;border-top:var(--bw-tile) solid var(--c-border);border-right:var(--bw-tile) solid var(--c-border);border-bottom:var(--bw-tile) solid var(--c-border);border-radius:0 var(--r-control) var(--r-control) 0;background:var(--surface-btn);color:var(--c-ink);text-align:center;appearance:textfield;outline:none;font-family:Geist Mono,monospace;font-size:12px}.lp-bpm-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.lp-bpm-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.lp-bpm-input:disabled{opacity:.45}.lp-seg{border-radius:var(--r-control);box-shadow:var(--sh-control);display:flex}.lp-seg button{min-width:34px;height:var(--control-h,37px);background:var(--surface-btn);color:var(--c-ink);border:var(--bw-tile) solid var(--c-border);cursor:pointer;border-left-width:0;padding:0 8px;font-family:Geist Mono,monospace;font-size:12px;transition:background .1s}.lp-seg button:first-child{border-left-width:var(--bw-tile);border-radius:var(--r-control) 0 0 var(--r-control)}.lp-seg button:last-child{border-radius:0 var(--r-control) var(--r-control) 0}.lp-seg button:only-child{border-radius:var(--r-control)}.lp-seg button:hover:not(:disabled):not(.lp-seg-on){background:#f0f0f0}.lp-seg button:disabled{opacity:.45;cursor:default}.lp-seg button.lp-seg-on{background:var(--c-play-bg);color:var(--c-play-ink);box-shadow:var(--sh-btn-sel)}.lp-take-rec{min-width:44px;height:var(--control-h,37px);background:var(--surface-btn);border:var(--bw-tile) solid var(--c-border);border-radius:var(--r-control);box-shadow:var(--sh-control);color:#d05050;justify-content:center;align-items:center;font-size:12px;display:flex}.lp-take-anchor{position:relative}.lp-take-trigger{width:96px;height:var(--control-h,37px);background:var(--surface-btn);color:var(--c-ink);border:var(--bw-tile) solid var(--c-border);border-radius:var(--r-control);box-shadow:var(--sh-control);cursor:pointer;justify-content:space-between;align-items:center;gap:7px;padding:0 10px;font-family:Geist Mono,monospace;font-size:12px;transition:background .1s;display:flex}.lp-take-trigger:hover{background:#f0f0f0}.lp-take-trigger.open{border-color:#999}.lp-take-name{text-overflow:ellipsis;white-space:nowrap;text-align:left;flex:1;min-width:0;overflow:hidden}.lp-take-panel{border:var(--bw-tile) solid var(--c-border);border-radius:var(--r-panel);width:264px;min-width:172px;box-shadow:0 -4px 18px #00000024, var(--sh-control);z-index:30;background:#fff;flex-direction:column;gap:2px;max-height:240px;padding:5px;display:flex;position:absolute;bottom:calc(100% + 6px);right:0;overflow-y:auto}.lp-take-row{border-radius:var(--r-btn);align-items:center;gap:6px;padding:3px 5px 3px 0;font-family:Geist Mono,monospace;transition:background .1s;display:flex}button.lp-take-row{width:100%;font:inherit;cursor:pointer;text-align:left;background:0 0;border:none;justify-content:space-between;gap:10px;padding:7px 9px;font-family:Geist Mono,monospace}button.lp-take-row:hover{background:#f2f2f2}button.lp-take-row.lp-take-row-on,button.lp-take-row.lp-take-row-on:hover{background:var(--c-play-bg)}.lp-take-main{min-width:0;font:inherit;cursor:pointer;text-align:left;background:0 0;border:none;flex:1;align-items:center;gap:8px;padding:4px 4px 4px 9px;display:flex}.lp-take-icons{opacity:0;align-items:center;gap:2px;transition:opacity .1s;display:flex}.lp-take-row:hover .lp-take-icons{opacity:1}.lp-take-icon{color:#35353573;cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;width:18px;height:18px;padding:0;font-size:13px;line-height:1;display:flex}.lp-take-icon:hover{color:var(--c-ink);background:#e8e8e8}.lp-take-row-on .lp-take-icon{color:#242e8f8c}.lp-take-row-on .lp-take-icon:hover{color:var(--c-play-ink);background:#c6caf1}.lp-take-confirm-del{height:18px;font:inherit;color:#d05050;cursor:pointer;background:#d0505014;border:1px solid #d0505066;border-radius:9px;flex-shrink:0;padding:0 7px;font-size:10px}.lp-take-confirm-del:hover{background:#d0505029;border-color:#d05050}.lp-take-new{border-radius:var(--r-btn);color:#35353580;cursor:pointer;text-align:left;background:0 0;border:none;padding:7px 9px;font-family:Geist Mono,monospace;font-size:11px;transition:background .1s,color .1s}.lp-take-new:hover{color:var(--c-ink);background:#f2f2f2}.lp-take-rename{min-width:0;font:inherit;color:var(--c-ink);border:1px solid var(--c-select);background:#fff;border-radius:4px;outline:none;flex:1;margin:2px 4px;padding:2px 4px;font-size:13px;font-weight:700}.lp-take-row:hover{background:#f2f2f2}.lp-take-row-on,.lp-take-row-on:hover{background:var(--c-play-bg)}.lp-take-letter{color:var(--c-ink);font-size:13px;font-weight:700}.lp-take-row-on .lp-take-letter{color:var(--c-play-ink)}.lp-take-meta{color:#35353573;white-space:nowrap;font-size:10px}.lp-take-prog{color:#35353573;white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;font-size:10px;display:block;overflow:hidden}.lp-prog-marquee{text-overflow:clip!important}.lp-take-main .lp-take-letter{text-overflow:ellipsis;white-space:nowrap;flex:0 0 112px;overflow:hidden}.lp-prog-track{white-space:nowrap;animation:linear infinite lp-prog-marquee;display:inline-flex}@keyframes lp-prog-marquee{0%{transform:translate(0)}to{transform:translateX(var(--marquee-shift))}}.lp-drums-panel .props-body{gap:22px}.lp-drums-controls{align-items:center;gap:10px;display:flex}.lp-drums-toggle input:disabled+.toggle-track{opacity:.45}.lp-bass-controls{align-items:center;gap:10px;display:flex}.lp-bass-toggle input:disabled+.toggle-track{opacity:.45}.lp-drum-anchor{position:relative}.lp-drum-trigger{width:128px;height:var(--control-h,37px);background:var(--surface-btn);color:var(--c-ink);border:var(--bw-tile) solid var(--c-border);border-radius:var(--r-control);box-shadow:var(--sh-control);cursor:pointer;justify-content:space-between;align-items:center;gap:7px;padding:0 10px;font-family:Geist Mono,monospace;font-size:12px;transition:background .1s;display:flex}.lp-drum-trigger:hover:not(:disabled){background:#f0f0f0}.lp-drum-trigger.open{border-color:#999}.lp-drum-trigger:disabled{cursor:default;opacity:.6}.lp-bass-trigger{width:96px}.lp-drum-panel{min-width:190px;left:0;right:auto}.lp-transport{gap:6px;display:flex}.lp-tbtn{width:44px;height:var(--control-h,37px);background:var(--surface-btn);border:var(--bw-tile) solid var(--c-border);border-radius:var(--r-control);box-shadow:var(--sh-btn);cursor:pointer;justify-content:center;align-items:center;transition:background .1s,box-shadow .1s,transform .1s;display:flex}.lp-tbtn:hover:not(:disabled){background:var(--surface-btn-hover)}.lp-tbtn:disabled{opacity:.45;cursor:default}.lp-tbtn:active:not(:disabled),.lp-tbtn.lp-active{box-shadow:var(--sh-btn-active);transform:translateY(var(--btn-press-y))}.lp-glyph-rec{background:#d05050;border-radius:50%;width:12px;height:12px}.lp-glyph-play{border-left:11px solid var(--c-ink);border-top:7px solid #0000;border-bottom:7px solid #0000;width:0;height:0;margin-left:2px}.lp-play.lp-active .lp-glyph-play,.lp-play.lp-paused .lp-glyph-play{border-left-color:var(--c-play)}.lp-play.lp-paused{border-color:var(--c-play)}.lp-glyph-stop{background:var(--c-ink);width:11px;height:11px}.lp-rec.lp-active{background:#fbeaea;border-color:#e0a3a3}.lp-blink .lp-glyph-rec{animation:.5s step-end infinite lp-blink}@keyframes lp-blink{50%{opacity:.25}}.lp-export-btns{gap:var(--gap-btn,6px);display:flex}.lp-export{height:var(--control-h,37px);background:var(--surface-btn);color:var(--c-ink);border:var(--bw-tile) solid var(--c-border);border-radius:var(--r-control);box-shadow:var(--sh-control);cursor:pointer;padding:0 12px;font-family:Geist Mono,monospace;font-size:11px;transition:background .1s}.lp-export:hover:not(:disabled){background:#f0f0f0}.lp-export:active:not(:disabled){box-shadow:var(--sh-oct-active)}.lp-export:disabled{opacity:.45;cursor:default}.lp-timeline{border:var(--bw-tile) solid var(--c-border);border-radius:var(--r-panel);background:var(--surface-panel);-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.lp-ruler{border-bottom:var(--bw-tile) solid var(--c-border);touch-action:none;height:21px;display:flex}.lp-ruler-scrub{cursor:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"><g fill=\"none\" stroke-linejoin=\"round\" stroke-linecap=\"round\"><path d=\"M9.5 8 5.5 12l4 4M14.5 8l4 4-4 4\" stroke=\"white\" stroke-width=\"4.4\"/><path d=\"M9.5 8 5.5 12l4 4M14.5 8l4 4-4 4\" stroke=\"%23222222\" stroke-width=\"2\"/></g></svg>") 12 12,ew-resize}.lp-ruler-bar{border-left:var(--bw-tile) solid var(--c-border);flex:1;display:flex;position:relative}.lp-ruler-bar:first-child{border-left:none}.lp-ruler-num{color:#3535358c;pointer-events:none;font-family:Geist Mono,monospace;font-size:10.5px;font-weight:400;position:absolute;top:.5px;left:6px}.lp-ruler-bar span{flex:1;position:relative}.lp-ruler-bar span+span:before{content:"";background:#35353533;width:.5px;height:36%;position:absolute;top:0;left:0}.lp-lane{height:67px;padding:5px 0;position:relative}.lp-ev{background:var(--surface-tile);border:var(--bw-tile) solid var(--c-border);border-radius:var(--r-btn);box-shadow:var(--sh-control);flex-direction:column;justify-content:center;align-items:center;gap:4px;transition:background 80ms,border-color 80ms;display:flex;position:absolute;top:5px;bottom:5px;overflow:hidden}.lp-ev.lp-on{background:var(--c-play-bg);border-color:var(--c-play)}.lp-ev{cursor:pointer}.lp-ev:hover{border-color:var(--c-border-hover)}.lp-mode-rec .lp-ev{cursor:default}.lp-mode-rec .lp-ev:hover{border-color:var(--c-border)}.lp-ev.lp-sel,.lp-ev.lp-sel:hover{border-color:var(--c-select);outline:1px solid var(--c-select);outline-offset:calc(-1 * var(--bw-tile))}.lp-mode-rec .lp-ev.lp-on{background:#fbeaea;border-color:#d05050}.lp-ev-handle{cursor:ew-resize;touch-action:none;width:7px;position:absolute;top:0;bottom:0}.lp-ev-handle-left{left:0}.lp-ev-handle-right{right:0}.lp-ev.lp-grabbing,.lp-ev.lp-grabbing:hover{cursor:grabbing}.lp-ev-ghost{opacity:.5}.lp-ev-ghost:hover{opacity:1;border-color:var(--c-border-hover)}.lp-ev-plus{color:#353535bf;font-family:Geist Mono,monospace;font-size:15px;font-weight:700;line-height:1}.lp-ev-roman{color:var(--c-ink);white-space:nowrap;font-family:Geist Mono,monospace;font-size:15px;font-weight:700;line-height:1}.lp-ev.lp-on .lp-ev-roman{color:var(--c-play-ink)}.lp-mode-rec .lp-ev.lp-on .lp-ev-roman{color:#a03c3c}.lp-ev-note-bar{pointer-events:none;background:#35353517;border-radius:1.5px;height:3px;transition:background .35s;position:absolute;transform:translateY(-50%)}.lp-ev:hover .lp-ev-note-bar{background:var(--note-c)}.lp-ev-roman,.lp-ev-dots{z-index:1;position:relative}.lp-ev{--outline-c:#fbfbfb}.lp-ev.lp-on{--outline-c:var(--c-play-bg)}.lp-mode-rec .lp-ev.lp-on{--outline-c:#fbeaea}.lp-ev .lp-ev-roman{text-shadow:2px 0 0 var(--outline-c), 1.85px .77px 0 var(--outline-c), 1.41px 1.41px 0 var(--outline-c), .77px 1.85px 0 var(--outline-c), 0 2px 0 var(--outline-c), -.77px 1.85px 0 var(--outline-c), -1.41px 1.41px 0 var(--outline-c), -1.85px .77px 0 var(--outline-c), -2px 0 0 var(--outline-c), -1.85px -.77px 0 var(--outline-c), -1.41px -1.41px 0 var(--outline-c), -.77px -1.85px 0 var(--outline-c), 0 -2px 0 var(--outline-c), .77px -1.85px 0 var(--outline-c), 1.41px -1.41px 0 var(--outline-c), 1.85px -.77px 0 var(--outline-c)}.lp-ev .lp-ev-dots{filter:drop-shadow(0 0 2px var(--outline-c)) drop-shadow(0 0 3px var(--outline-c))}.lp-ev-dots{align-items:center;height:6px;display:flex}.lp-dot{opacity:0;border-radius:50%;width:0;height:5px;margin:0}.lp-dot.lp-dot-on{opacity:1;width:5px;margin:0 2px}.lp-dot-type{background:var(--c-type)}.lp-dot-inversion{background:var(--c-inversion)}.lp-dot-secondary{background:var(--c-secondary)}.lp-playhead{opacity:0;pointer-events:none;will-change:transform;width:0;position:absolute;top:0;bottom:0;left:0}.lp-playhead:after{content:"";background:var(--c-ink);width:1.4px;position:absolute;top:0;bottom:0;left:-.7px}.lp-playhead-tri{border-left:5px solid #0000;border-right:5px solid #0000;border-top:7px solid var(--c-ink);width:0;height:0;position:absolute;top:0;left:-5px}.lp-mode-play .lp-playhead:after{background:var(--c-play)}.lp-mode-play .lp-playhead-tri{border-top-color:var(--c-play)}.lp-mode-rec .lp-playhead:after{background:#d05050}.lp-mode-rec .lp-playhead-tri{border-top-color:#d05050}.lp-countin{color:#d05050;justify-content:center;align-items:center;font-family:Geist Mono,monospace;font-size:26px;font-weight:700;animation:.5s ease-out lp-countin-pulse;display:flex;position:absolute;inset:0}@keyframes lp-countin-pulse{0%{opacity:.3;transform:scale(1.25)}to{opacity:1;transform:scale(1)}}.lp-hint{color:#35353559;-webkit-user-select:none;user-select:none;pointer-events:none;justify-content:center;align-items:center;font-family:Geist Mono,monospace;font-size:12px;display:flex;position:absolute;inset:0}.lp-editor{background:var(--surface-card);border:1px solid var(--c-card-border);border-radius:var(--r-panel);width:196px;padding:12px 14px var(--pad-card-top);z-index:20;flex-direction:column;gap:10px;animation:.16s ease-out lp-editor-in;display:flex;position:absolute;bottom:0;left:calc(100% + 14px);box-shadow:0 12px 30px #00000040}@keyframes lp-editor-in{0%{opacity:0;transform:translate(-4px)}to{opacity:1;transform:translate(0)}}.lp-editor-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.lp-editor-name{color:var(--c-ink);white-space:nowrap;text-overflow:ellipsis;align-items:baseline;gap:7px;font-family:Geist Mono,monospace;font-size:14px;font-weight:700;display:flex;overflow:hidden}.lp-editor-meta{color:#35353573;font-size:10px;font-weight:400}.lp-editor-close{color:#35353573;cursor:pointer;background:0 0;border:none;padding:0 2px;font-size:16px;line-height:1}.lp-editor-close:hover{color:var(--c-ink)}.lp-editor-section{flex-direction:column;gap:5px;display:flex}.lp-editor-chips{flex-wrap:wrap;gap:5px;display:flex}.lp-editor-chips .prop-btn{flex:none;min-width:34px}.lp-editor-chips .prop-btn.active-degree{background:var(--c-play-bg);border-color:var(--c-play);color:var(--c-play-ink);box-shadow:var(--sh-btn-sel);transform:translateY(var(--btn-sel-y))}@media (width<=1180px){.lp-editor{bottom:10px;left:auto;right:10px}}@media (width<=640px){.lp-controls{flex-direction:column;align-items:stretch;gap:10px}.lp-controls-right{flex-wrap:wrap;gap:12px 10px}.lp-lane{height:56px}.lp-ev-roman{font-size:13px}}.rotate-hint{top:calc(10px + env(safe-area-inset-top));color:#353535;cursor:pointer;z-index:5;background:#fffffff2;border:1px solid #dbdbdb;border-radius:999px;align-items:center;gap:8px;padding:7px 13px;font-family:Geist Mono,monospace;font-size:11px;animation:.35s rotate-hint-in;display:none;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 4px 14px #00000024}@media (pointer:coarse) and (orientation:portrait){.rotate-hint{display:flex}}.rotate-hint-phone{flex:none;width:14px;height:16px;animation:3.2s ease-in-out infinite rotate-hint-flip}@keyframes rotate-hint-flip{0%,22%{transform:rotate(0)}42%,82%{transform:rotate(-90deg)}to{transform:rotate(0)}}@keyframes rotate-hint-in{0%{opacity:0;transform:translate(-50%)translateY(-6px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.tutorial-choice-panel{width:320px}.tutorial-choice-btns{flex-direction:column;gap:8px;display:flex}.tutorial-choice-btn{color:var(--c-ink);cursor:pointer;text-align:left;background:#fff;border:1.4px solid #dbdbdb;border-radius:7px;flex-direction:column;align-items:flex-start;gap:3px;padding:10px 12px;font-family:Geist Mono,monospace;transition:border-color .1s,background .1s,transform 60ms,box-shadow 60ms;display:flex;box-shadow:inset 0 -2px #e4e4ea,0 1.5px #0000001f}.tutorial-choice-btn:hover{background:#f6f6f6;border-color:#bbb}.tutorial-choice-btn:active{transform:translateY(2px);box-shadow:inset 0 -1px #e4e4ea,0 1px #0000001a}.tutorial-choice-name{font-size:13px;font-weight:500}.tutorial-choice-desc{color:#3535358c;font-size:11px}.share-timeline .lp-ev{cursor:default}.share-wave{border:1px solid var(--c-border);border-radius:var(--r-pad);background:#fff;width:160px;min-width:160px;position:relative;overflow:hidden}.share-wave-canvas{width:100%;height:100%;position:absolute;inset:0}.share-wave-grain{pointer-events:none;opacity:.16;mix-blend-mode:multiply;background-image:repeating-linear-gradient(0deg,#00000007 0 1px,#0000 1px 3px),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");animation:.7s steps(4,end) infinite share-grain;position:absolute;inset:0}.share-wave-grain:after{content:"";border-radius:inherit;position:absolute;inset:0;box-shadow:inset 0 0 34px #1e19142e}@keyframes share-grain{0%{background-position:0 0,0 0}25%{background-position:0 0,-28px 14px}50%{background-position:0 0,17px -22px}75%{background-position:0 0,-9px 31px}to{background-position:0 0,0 0}}.share-page{flex-direction:column;align-items:center;gap:12px;font-family:Geist Mono,monospace;display:flex}.share-page.share-pre>*{opacity:0}.share-page.share-in>*{animation:.45s ease-out backwards share-el-in}.share-page.share-in>:first-child{animation-delay:50ms}.share-page.share-in>:nth-child(2){animation-delay:.13s}.share-page.share-in>:nth-child(3){animation-delay:.21s}.share-page.share-in>:nth-child(4){animation-delay:.32s}.share-page.share-in>:nth-child(5){animation-delay:.4s}@keyframes share-el-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.share-title{color:#fff;text-align:center;overflow-wrap:break-word;max-width:700px;font-size:34px;font-weight:700;line-height:1.25}.share-chips{gap:10px;margin-bottom:6px;display:flex}.share-chip{border:1px solid #0000;border-radius:7px;align-items:center;height:27px;padding:0 12px;font-size:13px;display:inline-flex}.share-chip-bpm{color:#353535bf;border-color:var(--c-border);background:#fff}.share-card{gap:16px}.share-actions{align-items:stretch;gap:10px;margin-top:6px;display:flex}.share-actions .share-tbtn{width:62px;height:46px}.share-actions .share-tbtn:disabled{opacity:1}.share-actions .share-tbtn:disabled>span{opacity:.3}.share-actions .share-tbtn .lp-glyph-play,.share-actions .share-tbtn .lp-glyph-stop{transform:scale(1.25)}.share-actions .share-remix{width:auto;height:46px;color:var(--c-ink);align-items:center;gap:9px;padding:0 24px;font-family:Geist Mono,monospace;font-size:14px;display:flex}.share-actions .share-remix svg{flex-shrink:0}.share-made{color:#ffffff80;margin-top:10px;font-size:20px}.share-made a{color:#ffffffd9;font-family:Ubuntu,sans-serif;font-size:24px;text-decoration:none}.share-made a:hover{color:#fff}.share-status{color:#35353599;text-align:center;padding:40px 0;font-size:13px}@media (width<=640px){.share-page{justify-content:center;gap:16px;min-height:calc(100dvh - 60px);padding:8px 0}.share-title{max-width:calc(100vw - 32px);font-size:24px}.share-page .share-wave{flex:0 0 72px;order:2;width:100%;min-width:0;height:72px}.share-actions{justify-content:center;gap:12px;width:calc(100vw - 24px);margin-top:4px}.share-actions .share-tbtn{flex:0 0 92px;height:62px}.share-actions .share-tbtn .lp-glyph-play,.share-actions .share-tbtn .lp-glyph-stop{transform:scale(1.7)}.share-actions .share-remix{flex:0 auto;justify-content:center;height:62px;padding:0 20px}.share-made{font-size:16px}.share-made a{font-size:19px}}