@import"https://fonts.googleapis.com/css2?family=Chakra+Petch:ital,wght@0,400;0,600;0,700;1,700&family=IBM+Plex+Mono:wght@400;500;600&display=swap";:root{--bg: #0c0d0f;--panel: #1a1c1f;--panel-edge: #26292d;--steel: #2e3236;--ink: #e8e4da;--ink-dim: #8b8578;--silkscreen: #b8b2a4;--quad-0: #ff4d33;--quad-1: #ff9d2e;--quad-2: #ffd24d;--quad-3: #f2ead8;--go: #4dff6a;--font-display: "Chakra Petch", sans-serif;--font-mono: "IBM Plex Mono", monospace;--key-face: linear-gradient(180deg, #383c41 0%, var(--steel) 45%, #232629 100%);--key-face-hover: linear-gradient(180deg, #41464c 0%, #34383d 45%, #26292d 100%);--key-raised: inset 0 1px 0 rgba(255, 255, 255, .14), inset 0 -3px 4px rgba(0, 0, 0, .45), 0 3px 5px rgba(0, 0, 0, .5);--key-pressed: inset 0 1px 0 rgba(255, 255, 255, .08), inset 0 -1px 2px rgba(0, 0, 0, .45), 0 1px 2px rgba(0, 0, 0, .5);--well-bg: #0d0f10;--well-shadow: inset 0 2px 6px rgba(0, 0, 0, .8), 0 1px 0 rgba(255, 255, 255, .05);--strip-face: linear-gradient(180deg, var(--panel-edge) 0%, var(--panel) 100%);--strip-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 12px 30px rgba(0, 0, 0, .4);--focus: var(--quad-2);--deck-gap: 14px;--pulse: 0;--breathe: 0;--cool: 0;--cool-a: #ff2ea6;--cool-b: #2ee6ff;--cool-c: #8a5cff}*{box-sizing:border-box;margin:0}body{min-height:100vh;display:grid;place-items:center;background:radial-gradient(135% 105% at 50% 8%,transparent 52%,rgba(0,0,0,.62) 100%),radial-gradient(1200px 600px at 50% -10%,#131519 0%,var(--bg) 60%),var(--bg);color:var(--ink);font-family:var(--font-mono);padding:24px}body:before{content:"";position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.5;background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.012) 0px,rgba(255,255,255,.012) 1px,transparent 1px,transparent 3px)}.room{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}.room-wash{position:absolute;width:62vmax;aspect-ratio:1;border-radius:50%;mix-blend-mode:screen;will-change:opacity}.room-wash-a{top:-22%;left:-16%;background:radial-gradient(circle,color-mix(in srgb,var(--quad-0) 62%,transparent) 0%,transparent 68%);opacity:calc((.13 + var(--pulse) * .3 + var(--breathe) * .08) * (1 - var(--cool)))}.room-wash-a-cool{top:-22%;left:-16%;background:radial-gradient(circle,color-mix(in srgb,var(--cool-a) 62%,transparent) 0%,transparent 68%);opacity:calc((.13 + var(--pulse) * .3 + var(--breathe) * .08) * var(--cool))}.room-wash-b{top:-26%;right:-18%;background:radial-gradient(circle,color-mix(in srgb,var(--quad-1) 55%,transparent) 0%,transparent 68%);opacity:calc((.11 + var(--pulse) * .26 + var(--breathe) * .07) * (1 - var(--cool)))}.room-wash-b-cool{top:-26%;right:-18%;background:radial-gradient(circle,color-mix(in srgb,var(--cool-b) 55%,transparent) 0%,transparent 68%);opacity:calc((.11 + var(--pulse) * .26 + var(--breathe) * .07) * var(--cool))}.room-wash-c{bottom:-26%;left:50%;transform:translate(-50%);background:radial-gradient(circle,color-mix(in srgb,var(--quad-2) 36%,transparent) 0%,transparent 70%);opacity:calc((.1 + var(--pulse) * .24 + var(--breathe) * .1) * (1 - var(--cool)))}.room-wash-c-cool{bottom:-26%;left:50%;transform:translate(-50%);background:radial-gradient(circle,color-mix(in srgb,var(--cool-c) 38%,transparent) 0%,transparent 70%);opacity:calc((.1 + var(--pulse) * .24 + var(--breathe) * .1) * var(--cool))}.room-beam{position:absolute;top:-42vh;width:20vw;min-width:160px;height:175vh;mix-blend-mode:screen;clip-path:polygon(46% 0,54% 0,100% 100%,0 100%);transform-origin:50% 0;will-change:transform,opacity}.room-beam-a{left:24%;background:linear-gradient(180deg,color-mix(in srgb,var(--cool-c) 30%,transparent) 0%,transparent 72%);opacity:calc(.05 + var(--pulse) * .06 + var(--breathe) * .04);animation:beam-sweep-a 47s ease-in-out infinite alternate}.room-beam-b{right:20%;background:linear-gradient(180deg,color-mix(in srgb,var(--cool-b) 26%,transparent) 0%,transparent 72%);opacity:calc(.045 + var(--pulse) * .05 + var(--breathe) * .035);animation:beam-sweep-b 61s ease-in-out infinite alternate}@keyframes beam-sweep-a{0%{transform:rotate(-13deg)}to{transform:rotate(17deg)}}@keyframes beam-sweep-b{0%{transform:rotate(12deg)}to{transform:rotate(-16deg)}}@media(prefers-reduced-motion:reduce){.room-wash-a{opacity:.1}.room-wash-b{opacity:.08}.room-wash-c{opacity:.1}.room-wash-a-cool{opacity:.06}.room-wash-b-cool{opacity:.05}.room-wash-c-cool{opacity:.06}.room-beam{animation:none;opacity:.05}.deck:after{opacity:.3}.brand em{text-shadow:0 0 18px rgba(255,77,51,.45)}}.deck{position:relative;z-index:2;width:min(920px,100%);margin-inline:auto;display:flex;flex-direction:column;gap:var(--deck-gap)}.deck:after{content:"";position:absolute;inset:6% 0 -12%;z-index:-1;pointer-events:none;background:radial-gradient(67% 56% at 50% 60%,color-mix(in srgb,var(--quad-0) 24%,transparent) 0%,transparent 72%);opacity:calc(.24 + var(--pulse) * .4 + var(--breathe) * .14)}.skip-links{position:absolute;top:0;left:0;z-index:6}.skip-link{position:absolute;top:0;left:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;padding:9px 16px;border-radius:0 0 9px 9px;background:var(--key-face);box-shadow:var(--key-raised);color:var(--ink);font-family:var(--font-display);font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;text-decoration:none}.skip-link:focus{width:auto;height:auto;overflow:visible;clip-path:none;outline:2px solid var(--focus);outline-offset:2px}.deck [tabindex="-1"]:focus-visible{outline:2px solid var(--focus);outline-offset:3px}.deck-header{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:0 6px;flex-wrap:wrap}.brand{font-family:var(--font-display);font-weight:700;font-size:clamp(1.6rem,4vw,2.2rem);letter-spacing:.04em;text-transform:uppercase}.brand em{font-style:italic;color:var(--quad-0);text-shadow:0 0 18px rgb(255 77 51 / calc(.45 + var(--pulse) * .2)),0 0 52px rgb(255 77 51 / calc(var(--pulse) * .18))}.deck-model{font-family:var(--font-display);font-size:.7rem;font-weight:600;letter-spacing:.28em;color:var(--ink-dim)}.share-controls{margin:-4px 6px 0}.share-action{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:10px}.share-action+.share-action{margin-top:9px}.share-bundle-controls{display:flex;align-items:center;gap:8px}.share-hint{flex-basis:100%;margin:3px 0 0;text-align:right;color:var(--ink-dim);font-size:.6rem;line-height:1.5}.share-notice .share-degraded{margin-top:6px;padding-left:9px;border-left:2px solid var(--quad-1);color:var(--ink)}.share-action-label{font-family:var(--font-display);font-size:.58rem;font-weight:600;letter-spacing:.22em;color:var(--ink-dim)}.share-button,.share-keep,.share-restore,.sampler-notice-dismiss{border:1px solid #000;border-radius:5px;font-family:var(--font-display);font-weight:700;letter-spacing:.08em;cursor:pointer;box-shadow:var(--key-raised)}.share-button{padding:7px 12px;background:var(--key-face);color:var(--ink);text-transform:uppercase;font-size:.64rem}.share-button:hover:not(:disabled){background:var(--key-face-hover)}.share-keep:hover,.share-restore:hover{filter:brightness(1.16)}.share-button:active:not(:disabled),.share-keep:active,.share-restore:active{transform:translateY(1px);box-shadow:var(--key-pressed)}.share-button:disabled{cursor:wait;color:var(--ink-dim)}.share-button:focus-visible,.share-keep:focus-visible,.share-restore:focus-visible,.sampler-notice-dismiss:focus-visible,.share-result input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.share-notice,.sampler-notice,.share-result{margin-top:10px;border:1px solid rgba(255,255,255,.1);border-left:4px solid var(--quad-1);border-radius:7px;background:linear-gradient(110deg,rgba(255,157,46,.09),transparent 46%),#15171a;box-shadow:inset 0 1px #ffffff0b}.share-notice,.sampler-notice{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 14px}.share-notice strong{display:block;margin-bottom:3px;font-family:var(--font-display);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}.share-notice p,.sampler-notice p,.share-result{color:var(--silkscreen);font-size:.68rem;line-height:1.5}.share-notice.is-error,.sampler-notice.is-error{border-left-color:var(--quad-0);background:linear-gradient(110deg,rgba(255,77,51,.11),transparent 48%),#15171a}.share-notice-actions{display:flex;flex:none;gap:8px}.share-keep,.share-restore,.sampler-notice-dismiss{padding:7px 10px;font-size:.64rem;color:#101113}.share-keep{background:linear-gradient(180deg,#ffd96a,var(--quad-1))}.share-restore,.sampler-notice-dismiss{background:linear-gradient(180deg,#d5d1c7,#8e8a82)}.share-result{padding:10px 12px}.share-result label{display:grid;gap:6px;font-size:.62rem;letter-spacing:.06em;text-transform:uppercase}.share-result input{width:100%;border:1px solid #000;border-radius:4px;background:var(--well-bg);box-shadow:var(--well-shadow);color:var(--ink);padding:7px 9px;font-family:var(--font-mono);font-size:.65rem;text-transform:none}@media(max-width:640px){.share-notice{align-items:stretch;flex-direction:column}.share-notice-actions{flex-wrap:wrap}.share-keep,.share-restore{flex:1 1 auto}}.panel{background:linear-gradient(180deg,var(--panel-edge) 0%,var(--panel) 8%,#141619 100%);border:1px solid #000;border-radius:14px;padding:26px 24px 18px;box-shadow:inset 0 1px #ffffff12,inset 0 -2px 6px #0009,0 24px 60px #0000008c}.panel-hint{margin-top:18px;padding-top:12px;border-top:1px solid rgba(255,255,255,.05);font-size:.68rem;letter-spacing:.08em;color:var(--ink-dim);text-transform:uppercase}.transport{display:flex;align-items:center;gap:16px;padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid rgba(255,255,255,.05)}.transport-play{display:flex;align-items:center;gap:10px;padding:10px 22px;border:1px solid #000;border-radius:6px;background:var(--key-face);box-shadow:var(--key-raised);color:var(--ink);font-family:var(--font-display);font-weight:600;font-size:.82rem;letter-spacing:.24em;text-transform:uppercase;cursor:pointer;transition:transform 60ms ease,box-shadow 60ms ease}.transport-play:hover{background:var(--key-face-hover)}.transport-play:active{transform:translateY(1px);box-shadow:var(--key-pressed)}.transport-play:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.transport-play-led{width:9px;height:9px;border-radius:50%;background:color-mix(in srgb,var(--go) 15%,#101113);box-shadow:inset 0 1px 2px #000c;transition:background 80ms ease,box-shadow 80ms ease}.transport-play[aria-pressed=true] .transport-play-led{background:var(--go);box-shadow:0 0 8px var(--go),0 0 18px #4dff6a80}.transport-tempo{display:flex;align-items:center;gap:12px;flex:1;min-width:140px}.transport-tempo-label{font-family:var(--font-display);font-size:.6rem;font-weight:600;letter-spacing:.24em;color:var(--ink-dim);text-transform:uppercase}.transport-tempo-fader{-webkit-appearance:none;appearance:none;flex:1;height:6px;border-radius:3px;border:1px solid #000;background:var(--well-bg);box-shadow:var(--well-shadow);cursor:pointer}.transport-tempo-fader::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:26px;border-radius:3px;border:1px solid #000;background:linear-gradient(180deg,#41464c 0%,var(--steel) 48%,#232629 52%,#383c41 100%);box-shadow:inset 0 1px #ffffff24,0 3px 5px #00000080}.transport-tempo-fader::-moz-range-thumb{width:14px;height:26px;border-radius:3px;border:1px solid #000;background:linear-gradient(180deg,#41464c 0%,var(--steel) 48%,#232629 52%,#383c41 100%);box-shadow:inset 0 1px #ffffff24,0 3px 5px #00000080}.transport-tempo-fader:focus-visible{outline:2px solid var(--focus);outline-offset:3px}.transport-bpm{display:flex;align-items:baseline;gap:8px;padding:8px 14px;border-radius:5px;border:1px solid #000;background:var(--well-bg);box-shadow:var(--well-shadow)}.transport-bpm-value{font-family:var(--font-mono);font-weight:600;font-size:1.15rem;letter-spacing:.08em;color:var(--quad-1);text-shadow:0 0 10px rgba(255,157,46,.55)}.transport-bpm-unit{font-family:var(--font-display);font-size:.6rem;font-weight:600;letter-spacing:.24em;color:var(--ink-dim);text-transform:uppercase}.master-out{display:flex;align-items:center;gap:26px;padding-top:16px;margin-top:16px;border-top:1px solid rgba(255,255,255,.05)}.master-out .scope{flex:1;min-width:0;height:clamp(96px,10vw,124px)}.master-out .knob-row.master-knobs{padding-top:0;margin-top:0;border-top:none;flex:none}@media(max-width:640px){.master-out{flex-direction:column;align-items:stretch}.master-out .scope{height:clamp(58px,9vw,78px)}.master-out .knob-row.master-knobs{justify-content:center;gap:34px}}.fx-bus{padding-top:16px;margin-top:16px;border-top:1px solid rgba(255,255,255,.05)}.fx-bus-name{display:block;margin-bottom:4px;font-size:10px;font-weight:600;letter-spacing:.18em;color:var(--ink-dim);text-transform:uppercase}.fx-bus .knob-row.fx-knobs{padding-top:0;margin-top:0;border-top:none;flex-wrap:wrap}.scope{position:relative;height:clamp(58px,9vw,78px);padding:9px 12px;overflow:hidden;border:1px solid #000;border-radius:7px;background:var(--well-bg);box-shadow:inset 0 3px 8px #000000d9,0 1px #ffffff0d}.scope-canvas{display:block;width:100%;height:100%}.scope:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(104deg,rgba(255,255,255,.055) 0%,transparent 34%)}.scope-label{position:absolute;top:7px;right:12px;font-family:var(--font-display);font-size:.52rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--ink-dim)}.step-row{display:flex;align-items:center;gap:18px}.lane-label{display:flex;align-items:center;gap:8px;flex:0 0 176px;font-family:var(--font-display);font-weight:600;font-size:.8rem;letter-spacing:.22em;text-transform:uppercase;color:var(--silkscreen)}.lane-led{width:7px;height:7px;border-radius:50%;background:var(--quad-0);box-shadow:0 0 8px #ff4d33cc}.lane-mix{display:inline-flex;gap:4px;margin-left:auto}.lane-mix-btn{width:20px;height:20px;border:1px solid #000;border-radius:4px;background:var(--key-face);box-shadow:var(--key-raised);color:var(--ink-dim);font-family:var(--font-mono);font-size:.62rem;font-weight:700;line-height:1;cursor:pointer;transition:background 90ms ease,color 90ms ease,box-shadow 90ms ease}.lane-mix-btn:hover{color:var(--ink);background:var(--key-face-hover)}.lane-mix-btn:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.lane-mix-btn.is-mute[aria-pressed=true]{background:linear-gradient(180deg,#ff6b52,#d63a24);color:#fff;box-shadow:0 0 10px #ff4d3399}.lane-mix-btn.is-solo[aria-pressed=true]{background:linear-gradient(180deg,#ffd24a,#e0a71f);color:#1c1f23;box-shadow:0 0 10px #ffc83c99}.step-row.is-silenced .step-grid{opacity:.32;transition:opacity .12s ease}.step-grid{display:grid;grid-template-columns:repeat(16,1fr);gap:6px;flex:1}:is(.step[data-quad="1"],.step[data-quad="2"],.step[data-quad="3"]):nth-child(4n+1){margin-left:8px}.step{--led: var(--quad-0);position:relative;display:flex;flex-direction:column;align-items:center;justify-content:space-between;aspect-ratio:5 / 7;min-width:0;padding:16% 0 10%;border:1px solid #000;border-radius:5px;background:var(--key-face);box-shadow:var(--key-raised);cursor:pointer;transition:transform 60ms ease,box-shadow 60ms ease}.step[data-quad="1"]{--led: var(--quad-1)}.step[data-quad="2"]{--led: var(--quad-2)}.step[data-quad="3"]{--led: var(--quad-3)}.step:hover{background:var(--key-face-hover)}.step:active{transform:translateY(1px);box-shadow:var(--key-pressed)}.step:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.step-led{width:62%;height:6px;border-radius:2px;background:color-mix(in srgb,var(--led) 18%,#101113);box-shadow:inset 0 1px 2px #000c;transition:background 80ms ease,box-shadow 80ms ease}.step-num{font-family:var(--font-mono);font-size:clamp(.5rem,1.2vw,.66rem);font-weight:500;color:var(--ink-dim);-webkit-user-select:none;user-select:none}.step.is-playhead{background:linear-gradient(180deg,#4a5057,#3b4046 45%,#2b2f33);box-shadow:inset 0 1px #fff3,inset 0 -3px 4px #00000073,0 3px 5px #00000080,0 0 0 1px color-mix(in srgb,var(--led) 55%,transparent),0 0 12px color-mix(in srgb,var(--led) 35%,transparent)}.step.is-playhead .step-led{background:color-mix(in srgb,var(--led) 50%,#101113);box-shadow:0 0 6px color-mix(in srgb,var(--led) 40%,transparent)}.step.is-playhead .step-num{color:var(--ink)}.step[aria-pressed=true] .step-led{background:var(--led);box-shadow:0 0 10px var(--led),0 0 22px color-mix(in srgb,var(--led) 55%,transparent),inset 0 1px 1px #ffffff80}.step[aria-pressed=true] .step-num{color:var(--ink)}.step[data-accent] .step-led{height:10px;background:#fff;box-shadow:0 0 12px var(--led),0 0 28px color-mix(in srgb,var(--led) 75%,transparent),inset 0 1px 1px #ffffffd9}.step[data-accent]{box-shadow:var(--key-raised),0 0 0 1px color-mix(in srgb,var(--led) 70%,transparent)}@media(max-width:640px){.lane-label{display:none}.step-grid{gap:4px}}.lesson-panel{padding:16px 20px;background:var(--strip-face);border:1px solid #000;border-left:3px solid var(--quad-2);border-radius:10px;box-shadow:var(--strip-shadow)}.lesson-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.lesson-dismiss{padding:2px 8px;border:1px solid #000;border-radius:4px;background:var(--key-face);box-shadow:var(--key-raised);color:var(--ink-dim);font-family:var(--font-mono);font-size:.7rem;line-height:1.4;cursor:pointer;transition:transform 60ms ease,box-shadow 60ms ease,color 80ms ease}.lesson-dismiss:hover{color:var(--ink);background:var(--key-face-hover)}.lesson-dismiss:active{transform:translateY(1px);box-shadow:var(--key-pressed)}.lesson-dismiss:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.lesson-tag{font-family:var(--font-display);font-size:.62rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--quad-2)}.lesson-title{margin-top:4px;font-family:var(--font-display);font-weight:700;font-size:1.05rem;letter-spacing:.06em;text-transform:uppercase}.lesson-intro{margin-top:6px;font-size:.78rem;line-height:1.55;color:var(--silkscreen)}.lesson-panel.is-complete{border-left-color:var(--go);animation:lesson-complete-pop .5s cubic-bezier(.34,1.56,.64,1);box-shadow:inset 0 1px #ffffff0f,0 12px 30px #0006,0 0 26px color-mix(in srgb,var(--go) 18%,transparent)}.lesson-panel.is-complete .lesson-tag{color:var(--go);text-shadow:0 0 10px color-mix(in srgb,var(--go) 60%,transparent)}.lesson-check{display:inline-block;margin-left:10px;color:var(--go);text-shadow:0 0 8px var(--go),0 0 20px color-mix(in srgb,var(--go) 55%,transparent);animation:lesson-check-in .6s cubic-bezier(.34,1.56,.64,1) .12s backwards}.lesson-celebration{margin-top:6px;font-size:.78rem;line-height:1.55;color:var(--ink)}@keyframes lesson-complete-pop{0%{transform:scale(.985);box-shadow:inset 0 1px #ffffff0f,0 12px 30px #0006,0 0 #4dff6a00}45%{transform:scale(1.008);box-shadow:inset 0 1px #ffffff0f,0 12px 30px #0006,0 0 44px color-mix(in srgb,#4dff6a 45%,transparent)}to{transform:scale(1)}}@keyframes lesson-check-in{0%{opacity:0;transform:scale(2.4)}to{opacity:1;transform:scale(1)}}.lesson-resume{display:flex;align-items:center;gap:10px;padding:9px 16px;border:1px solid #000;border-radius:8px;background:var(--strip-face);box-shadow:var(--strip-shadow);color:var(--silkscreen);font-family:var(--font-display);font-weight:600;font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;cursor:pointer;transition:transform 60ms ease,color 80ms ease}.lesson-resume:hover{color:var(--ink)}.lesson-resume:active{transform:translateY(1px)}.lesson-resume:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.lesson-resume-led{width:7px;height:7px;border-radius:50%;background:var(--quad-2);box-shadow:0 0 8px color-mix(in srgb,var(--quad-2) 80%,transparent)}@media(prefers-reduced-motion:reduce){.lesson-panel.is-complete,.lesson-check{animation:none}}.deck[inert]{filter:saturate(.45) brightness(.42)}.finale{position:fixed;inset:0;z-index:20;display:grid;place-items:center;overflow:auto;padding:clamp(18px,4vw,48px);isolation:isolate;background:radial-gradient(circle at 50% 42%,rgba(255,77,51,.1),transparent 34%),#050608e0;animation:finale-curtain-in .32s ease-out both}.finale-glow{position:fixed;inset:-28vmax;z-index:-1;pointer-events:none;background:conic-gradient(from 218deg at 50% 50%,transparent 0 21%,color-mix(in srgb,var(--cool-a) 30%,transparent) 27%,transparent 34% 55%,color-mix(in srgb,var(--cool-b) 24%,transparent) 62%,transparent 70% 82%,color-mix(in srgb,var(--quad-1) 34%,transparent) 88%,transparent 96%);filter:blur(52px);opacity:.5;animation:finale-room-bloom 1.25s cubic-bezier(.16,1,.3,1) both}.finale-card{position:relative;width:min(760px,100%);overflow:hidden;padding:clamp(28px,6vw,64px);border:1px solid #050607;border-radius:18px;background:linear-gradient(115deg,rgba(255,255,255,.075),transparent 24%),repeating-linear-gradient(0deg,transparent 0,transparent 3px,rgba(255,255,255,.012) 3px,rgba(255,255,255,.012) 4px),linear-gradient(145deg,#292d31,#17191c 48%,#0f1113);box-shadow:inset 0 1px #ffffff21,inset 0 -4px 10px #000000b3,0 32px 100px #000000b8,0 0 0 1px #ffd24d29,0 0 74px #ff4d3329;animation:finale-plate-land .68s cubic-bezier(.16,1,.3,1) 80ms both}.finale-card:before{content:"";position:absolute;top:-42%;right:-12%;width:42%;height:184%;pointer-events:none;transform:rotate(12deg);background:linear-gradient(180deg,color-mix(in srgb,var(--quad-0) 54%,transparent),color-mix(in srgb,var(--cool-a) 22%,transparent) 48%,transparent 82%);opacity:.3;mix-blend-mode:screen}.finale-card:after{content:"ELEVATED BPM  /  GRADUATION OUTPUT";position:absolute;right:-62px;bottom:76px;transform:rotate(-90deg);transform-origin:center;font-family:var(--font-mono);font-size:.52rem;letter-spacing:.22em;color:#e8e4da3d}.finale-kicker{position:relative;z-index:1;font-family:var(--font-mono);font-size:clamp(.58rem,1.5vw,.7rem);font-weight:600;letter-spacing:.24em;line-height:1.5;text-transform:uppercase;color:var(--quad-2);text-shadow:0 0 14px color-mix(in srgb,var(--quad-2) 45%,transparent);animation:finale-copy-rise .5s ease-out .48s both}.finale-step-run{position:relative;z-index:1;display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:clamp(3px,.8vw,8px);width:min(600px,92%);margin-top:clamp(18px,3vw,30px)}.finale-step-run span{aspect-ratio:1;border:1px solid #050607;border-radius:clamp(2px,.5vw,5px);background:#151719;box-shadow:inset 0 1px 1px #ffffff14,inset 0 -2px 3px #000000b3;animation:finale-step-fire .7s cubic-bezier(.34,1.56,.64,1) both;animation-delay:calc(.25s + var(--finale-step) * 38ms)}.finale-step-run span:nth-child(-n+4){--step-color: var(--quad-0)}.finale-step-run span:nth-child(n+5):nth-child(-n+8){--step-color: var(--quad-1)}.finale-step-run span:nth-child(n+9):nth-child(-n+12){--step-color: var(--quad-2)}.finale-step-run span:nth-child(n+13){--step-color: var(--quad-3)}.finale-title{position:relative;z-index:1;max-width:620px;margin-top:clamp(28px,6vw,54px);font-family:var(--font-display);font-size:clamp(3.2rem,11vw,7.7rem);font-style:italic;font-weight:700;letter-spacing:-.055em;line-height:.72;text-transform:uppercase;color:var(--quad-3);text-shadow:3px 3px 0 #111315,0 0 24px rgba(255,77,51,.28);animation:finale-title-hit .72s cubic-bezier(.16,1,.3,1) .52s both}.finale-title span{display:block;margin-bottom:.25em;padding-left:.12em;font-family:var(--font-mono);font-size:.12em;font-style:normal;font-weight:600;letter-spacing:.6em;line-height:1;color:var(--quad-0);text-shadow:0 0 12px rgba(255,77,51,.55)}.finale-copy{position:relative;z-index:1;max-width:570px;margin-top:clamp(28px,5vw,44px);font-size:clamp(.76rem,2vw,.9rem);line-height:1.7;color:var(--silkscreen);animation:finale-copy-rise .5s ease-out .72s both}.finale-close{position:relative;z-index:1;display:inline-flex;align-items:center;gap:12px;margin-top:clamp(24px,4vw,38px);padding:12px 22px;border:1px solid #050607;border-radius:6px;background:linear-gradient(180deg,#40454a 0%,var(--steel) 48%,#202326 100%);box-shadow:inset 0 1px #ffffff29,inset 0 -3px 4px #00000085,0 4px 8px #00000080;color:var(--ink);font-family:var(--font-display);font-size:.72rem;font-weight:700;letter-spacing:.24em;text-transform:uppercase;cursor:pointer;animation:finale-copy-rise .5s ease-out .82s both}.finale-close:hover{background:linear-gradient(180deg,#4b5157,#373c41 48%,#24272a)}.finale-close:active{transform:translateY(1px);box-shadow:inset 0 1px #ffffff14,inset 0 -1px 2px #00000085,0 1px 2px #00000080}.finale-close:focus-visible{outline:2px solid var(--focus);outline-offset:4px}.finale-close-led{width:8px;height:8px;border-radius:50%;background:var(--go);box-shadow:0 0 8px var(--go),0 0 20px #4dff6a7a}@keyframes finale-curtain-in{0%{opacity:0}}@keyframes finale-room-bloom{0%{opacity:0;transform:scale(.68) rotate(-9deg)}55%{opacity:.82}to{opacity:.5;transform:scale(1) rotate(0)}}@keyframes finale-plate-land{0%{opacity:0;transform:translateY(44px) scale(.94) rotate(-.8deg)}to{opacity:1;transform:translateY(0) scale(1) rotate(0)}}@keyframes finale-step-fire{0%{background:#151719;transform:translateY(7px) scale(.72)}58%{transform:translateY(0) scale(1.18)}to{background:var(--step-color);transform:translateY(0) scale(1);box-shadow:inset 0 1px 1px #ffffff3d,inset 0 -2px 3px #0000006b,0 0 13px color-mix(in srgb,var(--step-color) 60%,transparent)}}@keyframes finale-title-hit{0%{opacity:0;transform:translate(-34px) skew(-5deg)}to{opacity:1;transform:translate(0) skew(0)}}@keyframes finale-copy-rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(max-width:520px){.finale{place-items:start center}.finale-card{padding:28px 22px 32px}.finale-card:after{display:none}.finale-step-run{width:100%;gap:3px}.finale-title{font-size:clamp(3rem,18vw,5rem)}.finale-close{width:100%;justify-content:center}}@media(prefers-reduced-motion:reduce){.finale,.finale-glow,.finale-card,.finale-kicker,.finale-step-run span,.finale-title,.finale-copy,.finale-close{animation:none}}.step-row.is-spotlit{padding:10px 12px;margin:-10px -12px;border-radius:10px;background:color-mix(in srgb,var(--quad-2) 5%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--quad-2) 55%,transparent),0 0 22px color-mix(in srgb,var(--quad-2) 22%,transparent),inset 0 0 18px color-mix(in srgb,var(--quad-2) 6%,transparent);animation:spotlight-breathe 2.4s ease-in-out infinite}.step-row.is-spotlit .lane-label{color:var(--quad-2)}.step-row.is-spotlit .lane-led{background:var(--quad-2);box-shadow:0 0 10px color-mix(in srgb,var(--quad-2) 80%,transparent)}@keyframes spotlight-breathe{50%{box-shadow:0 0 0 1px color-mix(in srgb,var(--quad-2) 85%,transparent),0 0 30px color-mix(in srgb,var(--quad-2) 38%,transparent),inset 0 0 22px color-mix(in srgb,var(--quad-2) 10%,transparent)}}.transport-tempo.is-spotlit,.stab-keyboard.is-spotlit{border-radius:10px;box-shadow:0 0 0 1px color-mix(in srgb,var(--quad-2) 55%,transparent),0 0 22px color-mix(in srgb,var(--quad-2) 22%,transparent);animation:spotlight-breathe 2.4s ease-in-out infinite}.transport-tempo.is-spotlit{padding:6px 10px;margin:-6px -10px}.transport-tempo.is-spotlit .transport-tempo-label{color:var(--quad-2)}.sampler-pad-strip[data-spotlit],.sampler-intake[data-spotlit]{border-radius:10px;box-shadow:0 0 0 1px color-mix(in srgb,var(--quad-2) 55%,transparent),0 0 22px color-mix(in srgb,var(--quad-2) 22%,transparent);animation:spotlight-breathe 2.4s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.step-row.is-spotlit,.transport-tempo.is-spotlit,.stab-keyboard.is-spotlit,.sampler-pad-strip[data-spotlit],.sampler-intake[data-spotlit]{animation:none}}.arc{padding:12px 16px 14px;background:var(--strip-face);border:1px solid #000;border-radius:10px;box-shadow:var(--strip-shadow)}.arc-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.arc-tag{margin:0;font-family:var(--font-display);font-size:.62rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-dim)}.arc-count{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.12em;color:var(--ink-dim)}.arc-count-done{color:var(--go);font-weight:600}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.arc-tracks{display:flex;gap:6px;margin:10px 0 2px}.arc-track{display:flex;align-items:baseline;gap:7px;padding:6px 11px;border:1px solid #000;border-radius:6px;background:var(--key-face);box-shadow:var(--key-raised);color:var(--silkscreen);font-family:var(--font-display);font-size:.64rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;cursor:pointer}.arc-track:active{box-shadow:var(--key-pressed)}.arc-track:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.arc-track[data-current]{color:var(--quad-2);box-shadow:var(--key-raised),0 0 0 1px color-mix(in srgb,var(--quad-2) 80%,transparent),0 0 14px color-mix(in srgb,var(--quad-2) 32%,transparent)}.arc-track-count{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.06em;color:var(--ink-dim)}.arc-track[data-current] .arc-track-count{color:var(--go)}.arc-meter{position:relative;height:3px;margin:9px 0 11px;border-radius:2px;background:var(--well-bg);box-shadow:inset 0 1px 2px #000c;overflow:hidden}.arc-meter-fill{display:block;height:100%;border-radius:2px;background:linear-gradient(90deg,#2fbf47 0%,var(--go) 100%);box-shadow:0 0 10px color-mix(in srgb,var(--go) 60%,transparent);transition:width .26s cubic-bezier(.34,1.2,.64,1)}.arc-path{display:flex;flex-wrap:wrap;gap:6px;padding:0;margin:0;list-style:none}.arc-stop{position:relative;display:flex;align-items:center;justify-content:center;width:30px;height:26px;padding:0;border:1px solid #000;border-radius:5px;background:var(--key-face);box-shadow:var(--key-raised);color:var(--ink-dim);font-family:var(--font-mono);font-size:.66rem;cursor:pointer;transition:transform 60ms ease,color 90ms ease,box-shadow 90ms ease}.arc-stop:hover{color:var(--ink)}.arc-stop:active{transform:translateY(1px)}.arc-stop:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.arc-stop-led{position:absolute;top:3px;right:3px;width:4px;height:4px;border-radius:50%;background:var(--well-bg);box-shadow:inset 0 0 2px #000000e6}.arc-stop[data-complete]{color:var(--ink)}.arc-stop[data-complete] .arc-stop-led{background:var(--go);box-shadow:0 0 7px color-mix(in srgb,var(--go) 85%,transparent)}.arc-stop[data-current]{color:var(--quad-2);box-shadow:var(--key-raised),0 0 0 1px color-mix(in srgb,var(--quad-2) 80%,transparent),0 0 14px color-mix(in srgb,var(--quad-2) 32%,transparent)}.arc-here{margin-top:10px;display:flex;align-items:baseline;gap:8px;font-family:var(--font-display);font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--silkscreen)}.arc-here-position{color:var(--quad-2);font-family:var(--font-mono);letter-spacing:.06em}@media(max-width:640px){.arc-stop{width:26px;height:24px}}.sampler-panel{background:linear-gradient(115deg,rgba(255,157,46,.045),transparent 34%),linear-gradient(180deg,var(--panel-edge) 0%,var(--panel) 8%,#141619 100%)}.sampler-intake{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:10px}.sampler-load,.share-bundle-open{position:relative;display:inline-flex;align-items:center;flex:none;padding:8px 14px;border:1px solid #000;border-radius:5px;background:var(--key-face);box-shadow:var(--key-raised);color:var(--ink);font-family:var(--font-display);font-size:.6rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;cursor:pointer}.sampler-load:hover,.share-bundle-open:hover{background:var(--key-face-hover)}.sampler-load:active,.share-bundle-open:active{transform:translateY(1px);box-shadow:var(--key-pressed)}.sampler-load input[type=file],.share-bundle-open input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.sampler-load:focus-within,.share-bundle-open:focus-within{outline:2px solid var(--focus);outline-offset:2px}.share-bundle-open{padding:7px 12px;font-size:.64rem;letter-spacing:.08em}.sampler-intake-hint{flex:1;min-width:220px;color:var(--ink-dim);font-size:.64rem;line-height:1.5}.sampler-record{flex:1 0 100%;display:flex;align-items:center;gap:14px;flex-wrap:wrap}.sampler-record-start{flex:none;padding:8px 14px;border:1px solid #000;border-radius:5px;background:var(--key-face);box-shadow:var(--key-raised);color:var(--ink);font-family:var(--font-display);font-size:.6rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;cursor:pointer}.sampler-record-start:not([aria-disabled=true]):hover{background:var(--key-face-hover)}.sampler-record-start:not([aria-disabled=true]):active{transform:translateY(1px);box-shadow:var(--key-pressed)}.sampler-record-start[aria-disabled=true],.sampler-record-stop[aria-disabled=true]{color:var(--ink-dim);cursor:progress}.sampler-record-start:focus-visible,.sampler-record-stop:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.sampler-recording{flex:1;min-width:200px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:10px 14px;border:1px solid var(--quad-0);border-radius:6px;background:var(--well-bg);box-shadow:var(--well-shadow),0 0 18px #ff4d3359}.sampler-recording-dot{width:14px;height:14px;border-radius:50%;background:var(--quad-0);box-shadow:0 0 10px var(--quad-0);animation:recording-pulse 1.2s ease-in-out infinite}@keyframes recording-pulse{50%{opacity:.25}}@media(prefers-reduced-motion:reduce){.sampler-recording-dot{animation:none}}.sampler-recording-label{color:var(--quad-0);font-family:var(--font-display);font-size:.7rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase}.sampler-recording-elapsed{color:var(--ink);font-family:var(--font-mono);font-size:1.1rem;font-variant-numeric:tabular-nums}.sampler-record-stop{padding:12px 26px;border:1px solid #000;border-radius:6px;background:var(--key-face);box-shadow:var(--key-raised);color:var(--quad-0);font-family:var(--font-display);font-size:.85rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;cursor:pointer}.sampler-record-stop:not([aria-disabled=true]):hover{background:var(--key-face-hover)}.sampler-record-stop:not([aria-disabled=true]):active{transform:translateY(1px);box-shadow:var(--key-pressed)}.sampler-recording-announcement{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.sampler-notice{margin-top:0;margin-bottom:10px}.sampler-assign:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.sampler-panel[data-drop-active],.sampler-pad-strip[data-drop-active]{outline:2px dashed var(--quad-1);outline-offset:-4px}.sampler-source-bank{display:flex;align-items:center;gap:14px;min-height:44px;padding:9px 12px;border:1px solid #000;border-radius:6px;background:var(--well-bg);box-shadow:var(--well-shadow)}.sampler-source-label{flex:none;font-family:var(--font-display);font-size:.58rem;font-weight:700;letter-spacing:.24em;color:var(--ink-dim);text-transform:uppercase}.sampler-source-bank ul{display:flex;flex:1;flex-wrap:wrap;gap:8px;padding:0;list-style:none}.sampler-source-bank li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;min-width:min(100%,200px);padding:5px 8px;border-left:2px solid var(--quad-1);color:var(--quad-1);font-size:.68rem;letter-spacing:.06em;text-shadow:0 0 9px rgba(255,157,46,.35)}.sampler-source-origin{color:var(--ink-dim);font-size:.52rem;letter-spacing:.15em;text-transform:uppercase;text-shadow:none}.sampler-pad-bank{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0 20px}.sampler-pad-strip{display:grid;grid-template-columns:minmax(76px,1fr) 74px;grid-template-rows:auto auto;align-items:center;gap:7px 8px;min-width:0;padding:10px;border:1px solid #0a0b0c;border-radius:9px;background:linear-gradient(180deg,#202327,#151719);box-shadow:inset 0 1px #ffffff0e,inset 0 -2px 5px #0000008c}.sampler-pad{position:relative;grid-row:1 / 3;display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 1fr;align-items:end;min-width:0;min-height:92px;padding:11px;border:1px solid #050607;border-radius:8px;background:linear-gradient(145deg,rgba(255,255,255,.055),transparent 38%),#2a2d31;box-shadow:inset 0 1px #ffffff1c,inset 0 -6px 10px #0000005c,0 4px 7px #0000007a;color:var(--ink);cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;transition:transform 60ms ease,filter 80ms ease,box-shadow 80ms ease}.sampler-pad:hover{filter:brightness(1.08)}.sampler-pad:active,.sampler-pad[data-sounding]{transform:translateY(2px);background:linear-gradient(145deg,rgba(255,214,136,.12),transparent 38%),#352b20;box-shadow:inset 0 5px 10px #00000080,0 0 18px #ff9d2e5c}.sampler-pad:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.sampler-pad-led{align-self:start;width:8px;height:8px;border-radius:50%;background:color-mix(in srgb,var(--quad-1) 16%,#101113);box-shadow:inset 0 1px 2px #000c}.sampler-pad[data-sounding] .sampler-pad-led{background:var(--quad-1);box-shadow:0 0 9px var(--quad-1),0 0 22px #ff9d2e99}.sampler-pad-number{grid-row:1 / 3;align-self:center;font-family:var(--font-display);font-size:clamp(1.65rem,3vw,2.35rem);font-weight:700;line-height:1;color:var(--quad-3)}.sampler-pad-name{max-width:100%;overflow:hidden;color:var(--ink-dim);font-size:.54rem;letter-spacing:.06em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.sampler-pad-strip .knob{width:64px}.sampler-pad-strip .knob-dial{width:50px;height:50px}.sampler-pad-strip .knob-label{font-size:.5rem;letter-spacing:.09em;text-align:center}.sampler-pad-strip .knob-readout{font-size:.58rem}.sampler-assign{align-self:stretch;appearance:none;padding:5px 16px 5px 6px;border:1px solid #000;border-radius:4px;background:linear-gradient(45deg,transparent 50%,var(--ink-dim) 50%) calc(100% - 9px) 52% / 4px 4px no-repeat,linear-gradient(135deg,var(--ink-dim) 50%,transparent 50%) calc(100% - 5px) 52% / 4px 4px no-repeat,var(--key-face);box-shadow:var(--key-raised);color:var(--ink-dim);font-family:var(--font-display);font-size:.48rem;font-weight:600;letter-spacing:.08em;text-overflow:ellipsis;text-transform:uppercase;cursor:pointer}.sampler-assign:hover{color:var(--ink)}.sampler-assign option{background:#15171a;color:var(--ink)}.sampler-sequencer{display:grid;gap:5px}.sampler-sequencer .lane-led{background:var(--quad-1);box-shadow:0 0 8px #ff9d2ebf}@media(max-width:820px){.sampler-pad-bank{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){.sampler-pad-bank{grid-template-columns:1fr}.sampler-pad-strip{grid-template-columns:minmax(120px,1fr) 74px}}.panel-title{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-bottom:16px;margin-bottom:18px;border-bottom:1px solid rgba(255,255,255,.05)}.panel-title-name{margin:0;font-family:var(--font-display);font-weight:700;font-size:.9rem;letter-spacing:.22em;text-transform:uppercase;color:var(--silkscreen)}.panel-title-model{font-family:var(--font-display);font-size:.6rem;font-weight:600;letter-spacing:.24em;color:var(--ink-dim)}.stab-keyboard{position:relative;margin-top:18px;height:clamp(142px,24vw,210px);overflow:hidden;border:1px solid #000;border-radius:7px;background:var(--well-bg);box-shadow:inset 0 3px 8px #000000d9,0 1px #ffffff0d;touch-action:none}.stab-key{position:absolute;top:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:7px;padding:0 4px 13px;border:1px solid #08090a;border-top:0;font-family:var(--font-mono);cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none}.stab-key-white{height:100%;z-index:1;border-radius:0 0 5px 5px;background:linear-gradient(96deg,#aaa69b,#f4efe4 10%,#d8d2c6 88%,#969287);box-shadow:inset 0 -7px 8px #0003,inset 1px 0 #ffffffa6;color:#1a1c1f}.stab-key-black{left:0;width:7.2%;height:62%;z-index:2;transform:translate(-50%);border-radius:0 0 5px 5px;background:linear-gradient(96deg,#090a0b,#30343a 14%,#17191c 74%,#050606);box-shadow:inset 0 -6px 5px #000c,inset 1px 0 #ffffff1a,0 5px 7px #0000009e;color:var(--ink)}.stab-key:hover{filter:brightness(1.06)}.stab-key:active{padding-bottom:10px;filter:brightness(.88);box-shadow:inset 0 7px 10px #00000052}.stab-key[data-sounding]{padding-bottom:10px;filter:brightness(1.04)}.stab-key-white[data-sounding]{background:linear-gradient(96deg,#c78325,#ffd786 10%,#f0b94e 88%,#9f681a);box-shadow:inset 0 7px 10px #68340047,inset 1px 0 #ffffffa6,0 0 18px #ff9d2ea8}.stab-key-black[data-sounding]{background:linear-gradient(96deg,#502500,#c76413 14%,#6d3107 74%,#261000);box-shadow:inset 0 6px 8px #ffb74f29,inset 1px 0 #ffffff2e,0 0 18px #ff9d2ebf}.stab-key[data-sounding] .stab-computer-key{color:#fff3d6;text-shadow:0 0 8px rgba(255,243,214,.8)}.stab-key:focus-visible{outline:4px solid var(--focus);outline-offset:-4px}.stab-key:focus-visible:before{content:"";position:absolute;inset:0;border:4px solid rgba(6,7,8,.92);border-radius:inherit;pointer-events:none}.stab-note-name{font-size:clamp(.54rem,1.2vw,.68rem);font-weight:600;color:currentColor;opacity:.72}.stab-computer-key{display:grid;place-items:center;width:24px;height:24px;border:1px solid currentColor;border-radius:4px;font-size:.7rem;font-weight:700;line-height:1;opacity:.86}.stab-key-black .stab-note-name{display:none}.note-step{justify-content:center;gap:4%;padding:12% 0 8%}.note-name{font-family:var(--font-mono);font-size:clamp(.45rem,1.1vw,.6rem);font-weight:600;letter-spacing:.02em;color:var(--ink-dim);-webkit-user-select:none;user-select:none}.note-step[aria-pressed=true] .note-name{color:var(--ink)}.note-length{height:.5em;font-family:var(--font-mono);font-size:clamp(.5rem,1.2vw,.7rem);line-height:.5;letter-spacing:.06em;color:var(--led);-webkit-user-select:none;user-select:none}.knob-row{display:flex;gap:34px;padding-top:20px;margin-top:18px;border-top:1px solid rgba(255,255,255,.05)}.knob{display:flex;flex-direction:column;align-items:center;gap:4px;width:74px}.knob-dial{width:58px;height:58px;border-radius:50%;cursor:ns-resize;touch-action:none}.knob-dial:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.knob-dial svg{width:100%;height:100%;display:block}.knob-track{fill:none;stroke:var(--well-bg);stroke-width:4;stroke-linecap:round}.knob-value{fill:none;stroke:var(--quad-1);stroke-width:4;stroke-linecap:round;filter:drop-shadow(0 0 4px color-mix(in srgb,var(--quad-1) 70%,transparent))}.knob-cap{fill:var(--steel);stroke:#000;stroke-width:1}.knob-pointer{stroke:var(--ink);stroke-width:2.5;stroke-linecap:round}.knob-label{font-family:var(--font-display);font-size:.62rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--silkscreen)}.knob-readout{font-family:var(--font-mono);font-size:.66rem;font-weight:500;color:var(--quad-1);text-shadow:0 0 8px rgba(255,157,46,.4)}.knob.is-spotlit .knob-dial{border-radius:50%;background:color-mix(in srgb,var(--quad-2) 6%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--quad-2) 55%,transparent),0 0 22px color-mix(in srgb,var(--quad-2) 22%,transparent);animation:knob-spotlight-breathe 2.4s ease-in-out infinite}.knob.is-spotlit .knob-label{color:var(--quad-2)}@keyframes knob-spotlight-breathe{50%{box-shadow:0 0 0 1px color-mix(in srgb,var(--quad-2) 85%,transparent),0 0 30px color-mix(in srgb,var(--quad-2) 38%,transparent)}}@media(prefers-reduced-motion:reduce){.knob.is-spotlit .knob-dial{animation:none}}@media(max-width:640px){.knob-row{gap:16px;justify-content:space-between}}.region-editor{position:fixed;inset:0;z-index:20;display:grid;place-items:center;overflow:auto;padding:clamp(14px,3vw,40px);background:#050608db}.region-editor-card{width:min(880px,100%);padding:clamp(18px,3vw,30px);border:1px solid #050607;border-radius:14px;background:var(--strip-face);box-shadow:var(--strip-shadow)}.region-editor-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:10px}.region-editor-head h2{font-family:var(--font-display);font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink)}.region-editor-summary{margin-bottom:14px;font-family:var(--font-mono);font-size:11px;line-height:1.6;color:var(--ink-dim)}.region-editor-track{position:relative;height:152px;border-radius:6px;background:var(--well-bg);box-shadow:var(--well-shadow);touch-action:none}.region-waveform{display:block;width:100%;height:100%}.region-editor-selection{position:absolute;top:0;bottom:0;pointer-events:none;background:color-mix(in srgb,var(--quad-1) 12%,transparent);border-inline:1px solid color-mix(in srgb,var(--quad-1) 60%,transparent)}.region-handle{position:absolute;top:-4px;bottom:-4px;width:18px;margin-left:-9px;display:grid;place-items:center;cursor:ew-resize;touch-action:none}.region-handle-grip{width:8px;height:100%;border-radius:3px;background:var(--key-face);box-shadow:var(--key-raised)}.region-handle:hover .region-handle-grip{background:var(--key-face-hover)}.region-handle:focus-visible{outline:none}.region-handle:focus-visible .region-handle-grip{box-shadow:var(--key-raised),0 0 0 2px #05060a,0 0 0 4px var(--focus)}.region-editor-edges{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px 20px;margin:14px 0;font-family:var(--font-mono);font-size:11px}.region-editor-edges dt{color:var(--ink-dim);text-transform:uppercase;letter-spacing:.1em;font-size:9px}.region-editor-edges dd{color:var(--ink)}.region-editor-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.region-editor-target{display:flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--ink-dim)}.region-editor-close,.region-editor-audition,.region-editor-commit,.sampler-chop{padding:7px 14px;border:none;border-radius:5px;font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);background:var(--key-face);box-shadow:var(--key-raised);cursor:pointer}.region-editor-close:hover,.region-editor-audition:hover,.region-editor-commit:hover,.sampler-chop:hover:not(:disabled){background:var(--key-face-hover)}.region-editor-close:active,.region-editor-audition:active,.region-editor-commit:active,.sampler-chop:active:not(:disabled){box-shadow:var(--key-pressed)}.sampler-chop:disabled{opacity:.4;cursor:default}.region-editor-commit{color:#08120a;background:linear-gradient(180deg,color-mix(in srgb,var(--go) 78%,#ffffff) 0%,var(--go) 100%)}.sampler-pad-rate{font-family:var(--font-mono);font-size:9px;letter-spacing:.04em;color:var(--ink-dim)}.sampler-source-delete{padding:7px 10px;border:none;border-radius:5px;font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--quad-0);background:var(--key-face);box-shadow:var(--key-raised);cursor:pointer}.sampler-source-delete:hover{background:var(--key-face-hover)}.sampler-source-delete:active{box-shadow:var(--key-pressed)}.sampler-source-delete:focus-visible,.sampler-relink:focus-within{outline:2px solid var(--focus);outline-offset:2px}.sampler-delete-warning{display:flex;align-items:center;gap:10px;flex:1 0 100%;flex-wrap:wrap;margin-top:8px;padding:9px 10px;border-left:4px solid var(--quad-0);border-radius:6px;background:linear-gradient(110deg,rgba(255,77,51,.11),transparent 48%),#15171a}.sampler-delete-warning p{flex:1;min-width:180px;color:var(--silkscreen);font-size:.66rem;line-height:1.5;text-shadow:none}.sampler-pad-state{grid-column:1 / -1;font-family:var(--font-mono);font-size:9px;line-height:1.5;letter-spacing:.04em;color:var(--quad-0)}.sampler-relink{position:relative;grid-column:1 / -1;display:inline-flex;align-items:center;justify-content:center;padding:7px 10px;border:none;border-radius:5px;font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#101113;background:linear-gradient(180deg,#ffd96a,var(--quad-1));box-shadow:var(--key-raised);cursor:pointer}.sampler-relink input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}