@font-face{font-family:Syne;src:url(/fonts/Syne-700-latin.woff2) format("woff2");font-weight:700;font-display:swap}@font-face{font-family:Syne;src:url(/fonts/Syne-800-latin.woff2) format("woff2");font-weight:800;font-display:swap}@font-face{font-family:Figtree;src:url(/fonts/Figtree-400-latin.woff2) format("woff2");font-weight:400;font-display:swap}@font-face{font-family:Figtree;src:url(/fonts/Figtree-500-latin.woff2) format("woff2");font-weight:500;font-display:swap}@font-face{font-family:Figtree;src:url(/fonts/Figtree-600-latin.woff2) format("woff2");font-weight:600;font-display:swap}@font-face{font-family:Michroma;src:url(/fonts/Michroma-Regular.woff2) format("woff2");font-weight:400;font-display:swap}@font-face{font-family:IBM Plex Mono;src:url(/fonts/IBMPlexMono-Regular.woff2) format("woff2");font-weight:400;font-display:swap}@font-face{font-family:IBM Plex Mono;src:url(/fonts/IBMPlexMono-Medium.woff2) format("woff2");font-weight:500;font-display:swap}@font-face{font-family:Barlow Condensed;src:url(/fonts/BarlowCondensed-Medium.woff2) format("woff2");font-weight:500;font-display:swap}@font-face{font-family:Barlow Condensed;src:url(/fonts/BarlowCondensed-SemiBold.woff2) format("woff2");font-weight:600;font-display:swap}:root{--bg: #0b0a0d;--text: #f1ece4;--text-2: #cfc8be;--text-3: #b5ada3;--surface: #18151d;--accent: #f4f1ec;--accent-ink: #120e1a;--accent-fill: #d6d0c6;--glow: #8a8790;--line: #f1ece422;--raised: #1c1b1f;--steel: #8fa6b8;--steel-bright: #b4c6d3;--chassis-top: #1b181d;--chassis-mid: #141216;--chassis-bot: #100e12;--panel-top: #121014;--panel-bot: #17151a;--inset: #0c0b0e;--screen: #08070a;--deep: #030304;--led-off: #2a2630;--cap-hi: #403b45;--cap-lo: #1e1b21;--ink: #d8d0c4;--ink-bright: #e6e1d8;--ink-2: rgba(216, 208, 196, .68);--ink-3: rgba(216, 208, 196, .42);--ink-line: rgba(216, 208, 196, .08);--steel-glow: rgba(143, 166, 184, .6);--f-title: "Syne", "Helvetica Neue", Arial, sans-serif;--f-text: "Figtree", system-ui, "Helvetica Neue", Arial, sans-serif;--f-display: "Michroma", "Arial Black", sans-serif;--f-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;--f-cond: "Barlow Condensed", "Arial Narrow", sans-serif;--r-btn: 14px;--r-sm: 12px;--r-md: 16px;--r-lg: 20px;--radius: 19px;--wrap: 1280px;--gutter: 20px;--max: 720px}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;background:var(--bg);scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font-family:var(--f-text);font-size:17px;line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased}a{color:var(--text)}a:hover{color:#fff}button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}:focus-visible{outline:2px solid var(--text);outline-offset:3px}.demo :focus-visible{outline-color:var(--steel)}[hidden]{display:none!important}.wrap{max-width:var(--wrap);margin:0 auto;padding-left:40px;padding-right:40px}@media(max-width:860px){.wrap{padding-left:20px;padding-right:20px}}.chassis{position:relative;border-radius:var(--radius);background:repeating-linear-gradient(to bottom,rgba(255,255,255,.018) 0 1px,rgba(0,0,0,.05) 1px 2px,transparent 2px 4px),linear-gradient(to bottom,var(--chassis-top),var(--chassis-mid) 55%,var(--chassis-bot));box-shadow:inset 0 1px #ffffff0d,inset 0 -1px #0009,0 0 0 1px #050406,0 18px 40px #00000073}.site-header{display:flex;justify-content:space-between;align-items:center;height:72px;padding-top:env(safe-area-inset-top)}.brand{display:block}.brand img{display:block;height:20px;width:auto}.site-nav{display:flex;gap:28px;align-items:center;font-size:16px}.site-nav a{text-decoration:none}@media(max-width:860px){.site-nav{display:none}}main{overflow-x:clip}.page{max-width:calc(var(--max) + 2 * var(--gutter));margin-left:auto;margin-right:auto;padding-left:var(--gutter);padding-right:var(--gutter)}.hero{container-type:inline-size;padding-top:32px;padding-bottom:140px}.hero__title{margin:0;font-family:var(--f-title);font-weight:800;font-size:min(160px,100cqw / 8.85);letter-spacing:-.04em;line-height:.9;color:var(--accent);white-space:nowrap}.hero__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:64px;align-items:center;margin-top:56px}.hero__side{display:flex;flex-direction:column;gap:28px}.hero__tagline{margin:0;max-width:440px;font-family:var(--f-title);font-weight:700;font-size:clamp(28px,2.6vw,38px);letter-spacing:-.02em;line-height:1.1;color:var(--accent)}.hero__actions{display:flex;flex-direction:column;gap:12px;max-width:380px}.hero__actions .buy{display:flex}.ghost{display:flex;justify-content:center;padding:17px 24px;border:1px solid #f1ece440;border-radius:var(--r-btn);font-size:18px;line-height:1.2;text-decoration:none;transition:border-color .2s}.ghost:hover{border-color:var(--text)}.countdown{display:flex;gap:10px;align-items:stretch}.countdown__cell{min-width:64px;padding:12px 16px;border-radius:var(--r-sm);background:var(--surface);text-align:center}.countdown__num{display:block;font-size:28px;font-weight:500;line-height:1.3;font-variant-numeric:tabular-nums}.countdown__unit{display:block;margin-top:2px;font-size:13px;color:var(--text-3)}.countdown__note{align-self:center;max-width:120px;margin:0;font-size:14px;line-height:1.35;color:var(--text-3)}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.hl{display:inline-block}.intro .hl{animation:intro-letter .22s cubic-bezier(.2,1.4,.4,1) backwards}.intro .hero__tagline,.intro .hero__actions>*,.intro .countdown{animation:intro-rise .7s cubic-bezier(.22,1,.36,1) backwards}.intro .hero__tagline{animation-delay:.75s}.intro .hero__actions>:nth-child(1){animation-delay:.84s}.intro .hero__actions>:nth-child(2){animation-delay:.93s}.intro .countdown{animation-delay:1.02s}.intro .hp{animation:intro-plug .9s cubic-bezier(.22,1,.36,1) .9s backwards}.intro .hp-glow{animation:intro-glow 1.2s cubic-bezier(.22,1,.36,1) .9s backwards}@keyframes intro-letter{0%{opacity:0;transform:translate3d(0,-.25em,0)}}@keyframes intro-rise{0%{opacity:0;transform:translate3d(0,16px,0)}}@keyframes intro-plug{0%{opacity:0;transform:translate3d(0,40px,0) scale(.97)}}@keyframes intro-glow{0%{opacity:0}}.hero__plugin{position:relative;container-type:inline-size;perspective:1600px}.hp,.hp-glow{--u: .1cqw }.hp-glow{position:absolute;top:-12%;right:-8%;bottom:-12%;left:-8%;background:radial-gradient(closest-side,var(--glow),transparent);opacity:.5;pointer-events:none;transition:opacity 1.1s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1);will-change:opacity,transform}.is-tilted .hp-glow{opacity:.8;transition:opacity 1.1s cubic-bezier(.22,1,.36,1),transform .16s ease-out}.hp{position:relative;aspect-ratio:1000 / 600;border-radius:calc(var(--u) * 26);font-family:var(--f-mono);color:#d8d0c4;user-select:none;-webkit-user-select:none;transition:transform .9s cubic-bezier(.22,1,.36,1);will-change:transform;backface-visibility:hidden;box-shadow:0 calc(var(--u) * 30) calc(var(--u) * 60) #000000b3}.is-tilted .hp{transition:transform .16s ease-out}.hp>*{position:absolute}.hp-plate{top:0;right:0;bottom:0;left:0;border-radius:inherit;background:linear-gradient(#0000008c,#0000008c) 0 calc(var(--u) * 92) / 100% 1px no-repeat,linear-gradient(#ffffff09,#ffffff09) 0 calc(var(--u) * 92 + 1px) / 100% 1px no-repeat,repeating-linear-gradient(to right,rgba(255,255,255,.0126) 0 1px,transparent 1px 3px),repeating-linear-gradient(to top,rgba(0,0,0,.162) 0 1px,transparent 1px 4px),linear-gradient(to bottom,var(--chassis-top),var(--chassis-mid) 55%,var(--chassis-bot));box-shadow:inset 0 1px #ffffff12,inset 0 -2px #0009,inset 0 0 0 1px #ffffff08}.hp-screw{width:calc(var(--u) * 14);height:calc(var(--u) * 14);border-radius:50%;background:linear-gradient(#0b0a0c,#0b0a0c) center / calc(var(--u) * 10) calc(var(--u) * 2) no-repeat,radial-gradient(circle at 35% 30%,#4a4550,#1d1a20 70%);box-shadow:inset 0 0 0 1px #000000b3,0 1px 1px #0009}.hp-screw--tl{left:calc(var(--u) * 18);top:calc(var(--u) * 18)}.hp-screw--tr{left:calc(var(--u) * 968);top:calc(var(--u) * 18)}.hp-screw--bl{left:calc(var(--u) * 18);top:calc(var(--u) * 568)}.hp-screw--br{left:calc(var(--u) * 968);top:calc(var(--u) * 568)}.hp-logo{left:calc(var(--u) * 52);top:calc(var(--u) * 29);height:calc(var(--u) * 34);display:flex;align-items:center;font-family:var(--f-display);font-size:calc(var(--u) * 24);letter-spacing:calc(var(--u) * 10);line-height:1;color:#d8d0c4eb}.hp-pill{right:calc(var(--u) * 52);top:calc(var(--u) * 29);height:calc(var(--u) * 34);display:flex;align-items:center;gap:calc(var(--u) * 12);padding:0 calc(var(--u) * 16);border-radius:calc(var(--u) * 17);background:#0c0b0e;box-shadow:inset 0 calc(var(--u) * 1) calc(var(--u) * 3) #000c,0 1px #ffffff0d;font-size:calc(var(--u) * 11);letter-spacing:.22em;white-space:nowrap;color:#d8d0c4ad}.hp-pill i{width:calc(var(--u) * 7);height:calc(var(--u) * 7);border-radius:50%;background:var(--steel);box-shadow:0 0 calc(var(--u) * 8) #8fa6b8d9}.hp-pill b{font-weight:400;color:#d8d0c4e6}.hp-screen{left:calc(var(--u) * 52);top:calc(var(--u) * 114);width:calc(var(--u) * 896);height:calc(var(--u) * 186);overflow:hidden;border-radius:calc(var(--u) * 14);background:linear-gradient(#d8d0c40f,#d8d0c40f) 0 50% / 100% 1px no-repeat,radial-gradient(80% 90% at 50% 50%,#0f0e12,var(--screen));box-shadow:0 1px #ffffff0d}.hp-wave{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.hp-screen__over{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:linear-gradient(#8fa6b8e6,#8fa6b8e6) right / calc(var(--u) * 2) 100% no-repeat,linear-gradient(to right,var(--screen),transparent) left / calc(var(--u) * 160) 100% no-repeat,repeating-linear-gradient(to top,rgba(0,0,0,.22) 0 1px,transparent 1px 3px);box-shadow:inset 0 0 calc(var(--u) * 40) calc(var(--u) * 6) #000000b3,inset 0 calc(var(--u) * 2) calc(var(--u) * 10) #000000f2,inset 0 0 0 1px #0009}.hp-screen__over:after{content:"";position:absolute;top:0;bottom:0;right:0;width:calc(var(--u) * 2);box-shadow:0 0 calc(var(--u) * 10) #8fa6b8cc}.hp-fader{left:calc(var(--u) * 52);top:calc(var(--u) * 320);width:calc(var(--u) * 896);height:calc(var(--u) * 112);border-radius:calc(var(--u) * 16);background:linear-gradient(to bottom,var(--panel-top),var(--panel-bot));box-shadow:inset 0 calc(var(--u) * 2) calc(var(--u) * 8) #000000d9,inset 0 -1px #ffffff0a,0 calc(var(--u) * 14) calc(var(--u) * 30) #00000073,0 1px #ffffff0d}.hp-fader>*{position:absolute}.hp-rail{left:calc(var(--u) * 40);top:calc(var(--u) * 52);width:calc(var(--u) * 816);height:calc(var(--u) * 8);border-radius:calc(var(--u) * 4);background:#040305;box-shadow:inset 0 calc(var(--u) * 2) calc(var(--u) * 3) #000,0 1px #ffffff0f}.hp-tick{width:calc(var(--u) * 2);border-radius:calc(var(--u) * 1);background:#d8d0c424}.hp-tick--major{height:calc(var(--u) * 18)}.hp-tick--mid{height:calc(var(--u) * 12)}.hp-tick--minor{height:calc(var(--u) * 7)}.hp-tick--top{bottom:calc(var(--u) * 80)}.hp-tick--bottom{top:calc(var(--u) * 80)}.hp-tick.is-on{background:#8fa6b8cc;box-shadow:0 0 calc(var(--u) * 5) #8fa6b880}.hp-tick--major.is-on{background:var(--steel)}.hp-fill{left:calc(var(--u) * 41);top:calc(var(--u) * 53);width:calc(var(--u) * 814);height:calc(var(--u) * 6);border-radius:calc(var(--u) * 3);background:linear-gradient(to right,#8fa6b840,#8fa6b8d9);box-shadow:0 0 calc(var(--u) * 14) #8fa6b8a6;transform:scaleX(var(--screw, 1));transform-origin:left center}.hp-cap{left:calc(var(--u) * 16);top:calc(var(--u) * 12);width:calc(var(--u) * 48);height:calc(var(--u) * 84);border-radius:calc(var(--u) * 7);transform:translate(calc(var(--u) * 816 * var(--screw, 1)));background:linear-gradient(var(--steel),var(--steel)) center / calc(var(--u) * 2) calc(var(--u) * 72) no-repeat,repeating-linear-gradient(to bottom,rgba(0,0,0,.45) 0 calc(var(--u) * 2),rgba(255,255,255,.05) calc(var(--u) * 2) calc(var(--u) * 3),transparent calc(var(--u) * 3) calc(var(--u) * 6)) center calc(var(--u) * 7) / calc(var(--u) * 38) calc(var(--u) * 24) no-repeat,repeating-linear-gradient(to bottom,rgba(0,0,0,.45) 0 calc(var(--u) * 2),rgba(255,255,255,.05) calc(var(--u) * 2) calc(var(--u) * 3),transparent calc(var(--u) * 3) calc(var(--u) * 6)) center calc(var(--u) * 53) / calc(var(--u) * 38) calc(var(--u) * 24) no-repeat,linear-gradient(to right,var(--cap-lo),#36323b 22%,var(--cap-hi) 50%,#2e2a32 78%,#19171c);box-shadow:inset 0 1px #ffffff24,inset 0 -2px #00000080,0 calc(var(--u) * 4) calc(var(--u) * 5) #000c,0 calc(var(--u) * 16) calc(var(--u) * 20) #000000a6}.hp-cap:after{content:"";position:absolute;left:calc(var(--u) * 23);top:calc(var(--u) * 6);width:calc(var(--u) * 2);height:calc(var(--u) * 72);border-radius:calc(var(--u) * 1);box-shadow:0 0 calc(var(--u) * 6) #8fa6b8e6}.hp-scale{left:0;top:calc(var(--u) * 126);width:100%;font-size:calc(var(--u) * 10);letter-spacing:.1em;line-height:1.3;color:#d8d0c480}.hp-scale span{position:absolute;transform:translate(-50%)}.hp-show{left:calc(var(--u) * 454);top:calc(var(--u) * 471);width:calc(var(--u) * 92);height:calc(var(--u) * 22);display:flex;align-items:center;justify-content:center;gap:calc(var(--u) * 8);border-radius:calc(var(--u) * 11);background:#0c0b0e;box-shadow:inset 0 calc(var(--u) * 1) calc(var(--u) * 3) #000000d9,0 1px #ffffff0d;font-family:var(--f-cond);font-weight:600;font-size:calc(var(--u) * 11);letter-spacing:.2em;color:#d8d0c4d1}.hp-show svg{width:calc(var(--u) * 14);height:calc(var(--u) * 8);fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.hp-rate-label{left:calc(var(--u) * 52);top:calc(var(--u) * 506);height:calc(var(--u) * 54);display:flex;align-items:center;font-size:calc(var(--u) * 11);letter-spacing:.32em;color:#d8d0c4ad}.hp-rates{left:calc(var(--u) * 150);top:calc(var(--u) * 506);width:calc(var(--u) * 486);height:calc(var(--u) * 54);border-radius:calc(var(--u) * 12);background:#0c0b0e;box-shadow:inset 0 calc(var(--u) * 1) calc(var(--u) * 4) #000000d9,0 1px #ffffff0d,0 calc(var(--u) * 8) calc(var(--u) * 20) #00000080}.hp-thumb{position:absolute;left:calc(var(--u) * 197);top:calc(var(--u) * 5);width:calc(var(--u) * 92);height:calc(var(--u) * 44);border-radius:calc(var(--u) * 8);background:linear-gradient(to bottom,#24212a,#1a181d);box-shadow:inset 0 1px #ffffff0f,0 calc(var(--u) * 1) calc(var(--u) * 2) #000000b3}.hp-rate{position:absolute;top:calc(var(--u) * 5);width:calc(var(--u) * 92);height:calc(var(--u) * 44);display:flex;align-items:center;justify-content:center;gap:calc(var(--u) * 10);font-size:calc(var(--u) * 13);letter-spacing:.14em;white-space:nowrap;color:#d8d0c499}.hp-rate i{flex:none;width:calc(var(--u) * 7);height:calc(var(--u) * 7);border-radius:50%;background:var(--led-off);box-shadow:inset 0 calc(var(--u) * 1) calc(var(--u) * 1) #000c}.hp-rate.is-on{color:#d8d0c4f2}.hp-rate.is-on i{background:var(--steel);box-shadow:0 0 calc(var(--u) * 8) #8fa6b8cc}.hp-foot{right:calc(var(--u) * 52);top:calc(var(--u) * 512);height:calc(var(--u) * 30);display:flex;align-items:center;gap:calc(var(--u) * 22);font-size:calc(var(--u) * 10)}.hp-vfx{height:100%;display:flex;align-items:center;gap:calc(var(--u) * 8);padding:0 calc(var(--u) * 12);border-radius:calc(var(--u) * 15);background:#0c0b0e;box-shadow:inset 0 calc(var(--u) * 1) calc(var(--u) * 3) #000c,0 1px #ffffff0d;letter-spacing:.3em;color:#d8d0c473}.hp-vfx i{width:calc(var(--u) * 6);height:calc(var(--u) * 6);border-radius:50%;background:var(--led-off)}.hp-version{letter-spacing:.4em;color:#d8d0c461}@media(max-width:860px){.hero__grid{grid-template-columns:minmax(0,1fr);gap:36px;margin-top:32px}}@media(prefers-reduced-motion:reduce){.hp,.hp-glow{transition:none}}.buy{position:relative;isolation:isolate;overflow:hidden;display:inline-flex;justify-content:center;align-items:baseline;gap:10px;padding:18px 24px;border-radius:var(--r-btn);background:var(--accent);color:var(--accent-ink);font-weight:600;font-size:20px;line-height:1.2;text-decoration:none;cursor:pointer}.buy:hover{color:var(--accent-ink)}.buy:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:var(--accent-fill);transform:scaleX(0);transform-origin:left center;transition:transform .56s cubic-bezier(.22,1,.36,1)}.buy:after{content:"";position:absolute;top:20%;bottom:20%;left:6px;width:3px;border-radius:2px;background:var(--accent-ink);opacity:0;transition:left .56s cubic-bezier(.22,1,.36,1),opacity .22s ease}.buy:hover:before,.buy:focus-visible:before{transform:scaleX(1)}.buy:hover:after,.buy:focus-visible:after{left:calc(100% - 9px);opacity:.55}.buy[aria-disabled=true]{cursor:default}.buy[aria-disabled=true]:before,.buy[aria-disabled=true]:after{display:none}.buy__old{font-weight:400;opacity:.6}.block{padding-bottom:140px}.block--specs,.block--buy{padding-bottom:120px}.block__title{margin:0;font-family:var(--f-title);font-weight:700;font-size:clamp(40px,4.4vw,68px);letter-spacing:-.03em;line-height:.95;color:var(--text)}.block__title--buy{font-size:clamp(60px,8vw,128px);line-height:.92}#demo{display:flex;flex-direction:column;gap:40px}.block__head{display:flex;flex-direction:column;gap:16px;max-width:760px}.block__lede{margin:0;font-size:21px;line-height:1.6;color:var(--text-2)}.loops{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.loop{display:flex;align-items:center;min-height:84px;padding:16px 22px;border-radius:var(--r-md);background:var(--surface);box-shadow:inset 0 0 0 1px transparent;text-align:left;transition:box-shadow .2s}.loop:hover{box-shadow:inset 0 0 0 1px var(--line)}.loop[aria-pressed=true]{box-shadow:inset 0 0 0 1px var(--accent)}.loop__name{font-size:24px;font-weight:500;line-height:1.25}.sound{display:flex;flex-direction:column;gap:28px;max-width:760px}.sound__text{margin:0;font-size:21px;line-height:1.6;color:var(--text-2)}.block--specs{display:flex;flex-direction:column;gap:40px}.specs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px}.specs__name{margin:0 0 10px;font-size:22px;font-weight:600;color:var(--accent)}.specs__text{margin:0;font-size:19px;line-height:1.5;color:var(--text-2)}.block--faq{max-width:880px}.block__title--faq{margin-bottom:32px}.faq{display:flex;flex-direction:column;gap:12px}.faq__item{padding:20px 24px;border-radius:var(--r-md);background:var(--surface)}.faq__item summary{font-size:19px;font-weight:500;cursor:pointer}.faq__item summary::marker{color:var(--text-3)}.faq__item p{margin:12px 0 0;font-size:17px;line-height:1.55;color:var(--text-2)}.block--buy{display:flex;flex-direction:column;align-items:center;gap:28px;text-align:center}.buy--wide{padding-left:40px;padding-right:40px}@media(max-width:860px){.specs{grid-template-columns:minmax(0,1fr);gap:36px}.loops{grid-template-columns:repeat(2,minmax(0,1fr))}}.rv-on [data-rv]{opacity:0;transform:translate3d(0,28px,0);transition:opacity .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1);transition-delay:var(--rvd, 0ms)}.rv-on [data-rv][data-dir=above]{transform:translate3d(0,-16px,0);transition-duration:.28s;transition-delay:0ms}.rv-on [data-rv].rv-in{opacity:1;transform:none}.rv-on [data-rv=zoom].rv-in:not([data-dir=above]){animation:rv-zoom .9s cubic-bezier(.22,1,.36,1) var(--rvd, 0ms) backwards}@keyframes rv-zoom{0%{opacity:0;transform:translate3d(0,28px,0) scale(.97)}to{opacity:1;transform:none}}.rv-on [data-rv=beat]{opacity:1;transform:none;transition:none}.rv-on [data-rv=beat] .bw{display:inline-block;opacity:0;transform:translate3d(0,-.45em,0);transition:opacity .18s ease-out,transform .36s cubic-bezier(.2,1.5,.4,1)}.rv-on [data-rv=beat].rv-in .bw{opacity:1;transform:none}.rv-on [data-rv=beat][data-dir=above] .bw{transition-duration:.2s;transition-delay:0ms!important}.demo__chassis{padding:16px}.demo{--peek: 76px;--gap: 24px;--outer: 0px;--box: min(720px, 100vw - 2 * (var(--gap) + var(--peek) + var(--outer)));--stage-w: calc(var(--box) + 2 * (var(--gap) + var(--peek)));display:grid;grid-template-columns:minmax(0,1fr) 44px auto 44px minmax(0,1fr);grid-template-areas:"stage stage stage stage stage" ". prev dots next ." "note note note note note"}.demo__stage{display:contents}.demo__viewport{grid-area:stage;position:relative;overflow:hidden;width:var(--stage-w);padding:24px 0 60px;margin:-24px 0 -60px calc((100% - var(--stage-w)) / 2);pointer-events:none}.demo__viewport:before,.demo__viewport:after{content:"";position:absolute;z-index:1;top:0;bottom:0;width:calc(var(--peek) / 2);pointer-events:none;background-color:var(--bg)}.demo__viewport:before{left:0;-webkit-mask-image:linear-gradient(to right,#000,transparent);mask-image:linear-gradient(to right,#000,transparent)}.demo__viewport:after{right:0;-webkit-mask-image:linear-gradient(to left,#000,transparent);mask-image:linear-gradient(to left,#000,transparent)}.demo__viewport>.demo__chassis{width:calc(100% - 2 * (var(--peek) + var(--gap)));margin-left:calc(var(--peek) + var(--gap))}.demo__track{pointer-events:auto;display:flex;align-items:flex-start;width:max-content}.demo__slot{flex:0 0 var(--box-w)}.demo__slot.is-peek{transform:scale(.94);cursor:pointer}.demo__track{touch-action:pan-y}.demo__preview .demo__name,.demo__preview .fader__scale,.demo__preview .demo__play>span:last-child{transition:opacity .2s}.demo__preview .demo__fx button,.demo__preview .demo__bypass{transition:color .2s}.demo__preview.is-muted .demo__name,.demo__preview.is-muted .fader__scale,.demo__preview.is-muted .demo__play>span:last-child{opacity:0}.demo__preview.is-muted .demo__fx button,.demo__preview.is-muted .demo__bypass{color:transparent}.demo .demo__preview .demo__play .demo__icon:before{left:54%;width:0;height:0;border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent var(--ink-bright);border-radius:0;animation:none}.demo .demo__preview .demo__play{color:var(--ink)}.demo .demo__preview .demo__busy,.demo .demo__preview .demo__led{animation:none}.demo__arrow--prev{grid-area:prev}.demo__arrow--next{grid-area:next}.demo__dots{grid-area:dots}.demo__note{grid-area:note}.demo__head{display:flex;justify-content:center;align-items:center;min-height:44px}.demo__arrow{display:grid;place-items:center;width:44px;height:110px;border-radius:999px;color:var(--steel);background:var(--raised);box-shadow:none;transition:transform .06s,box-shadow .06s}.demo__arrow svg{width:12px;height:20px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;opacity:.5;transition:opacity .12s,filter .12s}.demo__arrow:hover:not(:disabled) svg,.demo__arrow:focus-visible svg{opacity:1}.demo__arrow:disabled svg{opacity:.12}.demo__title{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0;text-align:center}.demo__name{font-family:var(--f-cond);font-weight:600;font-size:22px;line-height:1.1;letter-spacing:.16em;margin-right:-.16em;color:var(--ink-bright);white-space:nowrap}.demo__busy{position:absolute;top:50%;right:-16px;margin-top:-3px;width:6px;height:6px;border-radius:50%;background:var(--steel);box-shadow:0 0 6px var(--steel-glow);opacity:0}.demo[data-sound-loading=true] .demo__busy{animation:blink .9s ease-in-out infinite}.demo__screen{position:relative;margin-top:14px;width:100%;aspect-ratio:896 / 186;border-radius:11px;overflow:hidden;background:radial-gradient(ellipse 80% 90% at 50% 50%,#0f0e12,var(--screen));box-shadow:inset 0 2px 10px #000000f2,inset 0 0 0 1px #0009,0 1px #ffffff0d}.demo__screen:before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:#d8d0c40f}.demo__wave{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.demo__screen:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;border-radius:inherit;background:linear-gradient(to left,rgba(143,166,184,.9) 0 2px,transparent 2px),linear-gradient(to right,#08070a,#08070a00 18%),repeating-linear-gradient(to top,rgba(0,0,0,.22) 0 1px,transparent 1px 3px);box-shadow:inset -2px 0 10px -4px #8fa6b8cc,inset 0 0 40px 6px #000000b3}.fader{--inset-x: 26px;margin-top:14px;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none;outline-offset:4px}.fader[data-dragging=true]{cursor:grabbing}.fader__plate{position:relative;height:96px;border-radius:13px;background:linear-gradient(to bottom,var(--panel-top),var(--panel-bot));box-shadow:inset 0 2px 8px #000000d9,inset 0 -1px #ffffff0a,0 1px #ffffff0d}.fader__ticks{position:absolute;left:var(--inset-x);right:var(--inset-x);top:50%;height:64px;transform:translateY(-50%)}.fader__ticks svg{display:block;width:100%;height:100%;fill:#d8d0c424}.fader__ticks--on{clip-path:inset(0 calc((1 - var(--screw, 1)) * 100%) 0 0);filter:drop-shadow(0 0 3px rgba(143,166,184,.5))}.fader__ticks--on svg{fill:var(--steel)}.fader__rail{position:absolute;left:var(--inset-x);right:var(--inset-x);top:50%;height:8px;margin-top:-4px;border-radius:4px;background:#040305;box-shadow:inset 0 2px 3px #000,0 1px #ffffff0f}.fader__fill{position:absolute;left:1px;top:1px;bottom:1px;width:calc(var(--screw, 1) * (100% - 2px));border-radius:3px;background:linear-gradient(to right,#8fa6b840,#8fa6b8d9);box-shadow:0 0 calc(4px + 10px * var(--screw, 1)) #8fa6b873}.demo[data-bypass=true] .fader__fill,.demo[data-bypass=true] .fader__ticks--on{opacity:.35}.fader__cap{position:absolute;top:50%;left:calc(var(--screw, 1) * 100%);width:34px;height:62px;border-radius:6px;transform:translate(-50%,-50%);background:repeating-linear-gradient(to bottom,rgba(0,0,0,.45) 0 2px,rgba(255,255,255,.05) 2px 3px,transparent 3px 5px) center 5px / 26px 17px no-repeat,repeating-linear-gradient(to bottom,rgba(0,0,0,.45) 0 2px,rgba(255,255,255,.05) 2px 3px,transparent 3px 5px) center calc(100% - 5px) / 26px 17px no-repeat,linear-gradient(to right,var(--cap-lo),#36323b 22%,var(--cap-hi) 50%,#2e2a32 78%,#19171c);box-shadow:inset 0 1px #ffffff24,inset 0 -2px #00000080,0 4px 5px #000c,0 12px 18px #0009}.fader__cap:after{content:"";position:absolute;left:50%;top:5px;bottom:5px;width:2px;margin-left:-1px;border-radius:1px;background:var(--steel);box-shadow:0 0 6px #8fa6b8e6}.fader__scale{position:relative;height:18px;margin:6px var(--inset-x) 0;font-family:var(--f-mono);font-size:10px;letter-spacing:.1em;color:var(--ink-3)}.fader__scale span{position:absolute;top:0;transform:translate(-50%)}.fader__scale span:nth-child(1){left:0}.fader__scale span:nth-child(2){left:25%}.fader__scale span:nth-child(3){left:50%}.fader__scale span:nth-child(4){left:75%}.fader__scale span:nth-child(5){left:100%}.demo__fx{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:12px}.demo__fx,.demo__bypass{font-family:var(--f-cond);font-weight:600;font-size:14px;letter-spacing:.12em}.demo__fx button,.demo__bypass{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:0 8px;border-radius:999px;color:var(--ink-3);background:var(--inset);box-shadow:inset 0 1px 2px #000c,0 1px #ffffff0a,0 0 0 1px #050406;transition:color .12s,transform .06s,box-shadow .06s}.demo__fx button:hover,.demo__bypass:hover{color:var(--ink-2)}.demo__led{flex:none;width:7px;height:7px;border-radius:50%;background:var(--led-off)}.demo__fx button[aria-pressed=true],.demo__bypass[aria-pressed=true]{color:var(--ink-bright)}.demo__fx button[aria-pressed=true] .demo__led,.demo__bypass[aria-pressed=true] .demo__led{background:var(--steel);box-shadow:0 0 6px #8fa6b8cc}.demo__fx button:active,.demo__bypass:active{transform:translateY(1px);box-shadow:inset 0 2px 4px #000000f2,0 0 0 1px #050406}.demo__arrow:active:not(:disabled){transform:translateY(1px)}.demo__fx button[data-pending=true] .demo__led{animation:blink .9s ease-in-out infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.2}}.demo__transport{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px}.demo__bypass{padding:0 16px}.demo__play{display:inline-flex;align-items:center;gap:12px;min-height:52px;padding:0 20px 0 7px;border-radius:999px;font-family:var(--f-cond);font-weight:600;font-size:16px;letter-spacing:.16em;text-transform:uppercase;background:linear-gradient(to bottom,#24212a,#1a181d);box-shadow:inset 0 1px #ffffff0f,0 0 0 1px #050406,0 3px 8px #0009}.demo__play:disabled{color:var(--ink-3)}.demo__icon{position:relative;flex:none;width:38px;height:38px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#4a4550,#1d1a20 70%);box-shadow:0 0 0 1px #0b0a0c,0 2px 4px #000000b3}.demo__icon:before{content:"";position:absolute;top:50%;left:54%;width:0;height:0;border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent var(--ink-bright);transform:translate(-50%,-50%)}.demo[data-state=playing] .demo__icon:before{left:50%;width:10px;height:13px;border:0;border-left:3px solid var(--steel-bright);border-right:3px solid var(--steel-bright)}.demo[data-state=loading] .demo__icon:before{left:50%;width:14px;height:14px;border:2px solid var(--ink-3);border-top-color:var(--steel);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}.demo[data-state=loading] .demo__play,.demo[data-state=error] .demo__play{color:var(--ink-3)}.demo__dots{display:flex;justify-content:center;align-items:center;gap:4px;margin-top:16px}.demo__dot{display:grid;place-items:center;width:28px;height:28px}.demo__dot:before{content:"";width:9px;height:9px;border-radius:50%;background:var(--led-off);box-shadow:inset 0 1px 1px #0009}.demo__dot:hover:before{background:#3a3540}.demo__dot[aria-current=true]:before{background:var(--steel);box-shadow:0 0 6px #8fa6b8cc}.demo[data-sound-loading=true] .demo__dot[aria-current=true]:before{animation:blink .9s ease-in-out infinite}.site-footer{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;padding-top:32px;padding-bottom:max(48px,env(safe-area-inset-bottom));font-size:15px;color:var(--text-3)}.site-footer__brand img{display:block;height:15px;width:auto}.site-footer__links{display:flex;flex-wrap:wrap;gap:8px 24px}.page{min-height:60vh;padding-top:48px;padding-bottom:72px}.page__title{margin:0 0 16px;font-family:var(--f-title);font-weight:700;font-size:44px;letter-spacing:-.03em;line-height:1}.notfound{max-width:560px}.notfound__code{margin:0 0 24px;font-family:var(--f-title);font-weight:800;font-size:96px;letter-spacing:-.04em;line-height:.9;color:var(--text-3)}.notfound__text{margin:0 0 32px;font-size:18px;color:var(--text-3)}.notfound__back{display:inline-flex}.legal{max-width:68ch;overflow-wrap:anywhere}.legal__switch,.legal__updated{margin:0 0 8px;font-size:15px;color:var(--text-3)}.legal__switch a{color:var(--text-2)}.legal__lang{margin-top:48px}.legal__lang+.legal__lang{margin-top:88px;padding-top:56px;border-top:1px solid var(--line)}.legal__title{margin:0 0 12px;font-family:var(--f-title);font-weight:700;font-size:30px;letter-spacing:-.02em;line-height:1.1}.legal h3{margin:40px 0 10px;font-family:var(--f-title);font-weight:700;font-size:19px;letter-spacing:-.01em;line-height:1.25}.legal p,.legal ul{margin:0 0 14px;color:var(--text-2)}.legal ul{padding-left:1.2em}.legal li+li{margin-top:6px}.legal a{color:var(--text);text-underline-offset:3px}.legal code{font-family:var(--f-mono);font-size:.88em}.legal__details{margin:0 0 14px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.legal__details summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 0;font-weight:500;cursor:pointer;list-style:none}.legal__details summary::-webkit-details-marker{display:none}.legal__details summary:after{content:"";flex:none;width:11px;height:11px;background:linear-gradient(var(--text-3),var(--text-3)) center / 11px 1.5px no-repeat,linear-gradient(var(--text-3),var(--text-3)) center / 1.5px 11px no-repeat}.legal__details[open] summary:after{background:linear-gradient(var(--text-3),var(--text-3)) center / 11px 1.5px no-repeat}.legal__details .legal__facts{padding-bottom:16px}.legal__facts{display:grid;grid-template-columns:minmax(150px,max-content) 1fr;gap:8px 24px;margin:0 0 14px}.legal__facts dt{color:var(--text-3)}.legal__facts dd{margin:0;color:var(--text)}@media(max-width:519px){.page__title{font-size:36px}.legal__facts{grid-template-columns:1fr;gap:0}.legal__facts dd+dt{margin-top:10px}}@media(max-width:1099px){.demo__arrow,.demo__dots{align-self:center}.demo__arrow{height:44px;margin-top:16px;background:none;box-shadow:none}.demo__arrow:active:not(:disabled){box-shadow:none}.demo__arrow svg{width:9px;height:15px}}@media(max-width:519px){.demo{--peek: 18px;--gap: 12px}.demo__screen{aspect-ratio:auto;height:76px}}@media(min-width:1100px){.demo{--outer: 84px;grid-template-columns:minmax(0,1fr);grid-template-areas:"stage" "dots" "note"}.demo__stage{display:block;grid-area:stage;position:relative;width:var(--stage-w);margin-left:calc((100% - var(--stage-w)) / 2)}.demo__viewport{width:auto;margin:-24px 0 -60px}.demo__arrow{position:absolute;top:50%;translate:0 -50%}.demo__arrow--prev{left:-60px}.demo__arrow--next{right:-60px}}@media(min-width:720px){:root{--gutter: 40px}.demo__chassis{padding:24px}.fader{--inset-x: 32px}.fader__plate{height:112px}.fader__ticks{height:78px}.fader__cap{width:40px;height:74px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation-duration:.01ms!important}}
