*,*::before,*::after{box-sizing:border-box}:root{--bg:#F0EDE6;--control-bg:#E2DDD4;--footer-bg:#E6E2D9;--accent:#E8622A;--accent-glow:rgba(232,98,42,0.22);--accent-hover:#df571d;--text:#1A1916;--text-mid:#8C8A84;--text-dim:#C8C4BB;--invert:#FDFBF7;--hairline:rgba(26,25,22,0.12);color-scheme:light}html[data-theme="stage"]{--bg:#080c12;--control-bg:#0a0f18;--footer-bg:#0a0f18;--accent:#2a7fff;--accent-glow:rgba(42,127,255,0.3);--accent-hover:#1f6fe6;--text:#cfe2fb;--text-mid:#5a82b0;--text-dim:#28425f;--invert:#06121f;--hairline:rgba(42,127,255,0.18);color-scheme:dark}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);transition:background-color .4s cubic-bezier(.22, 1, .36, 1),color .4s cubic-bezier(.22, 1, .36, 1);font-family:"Space Grotesk",system-ui,sans-serif;font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}h1,h2,h3{font-family:"EB Garamond",Georgia,serif;font-weight:600;line-height:1.06;letter-spacing:-0.02em;margin:0 0 .4em}h1{font-size:clamp(2.6rem, 6vw, 4.4rem)}h2{font-size:clamp(1.9rem, 3.5vw, 2.8rem)}h3{font-size:1.3rem}p{margin:0 0 1em}a{color:var(--accent);text-decoration:none;transition:opacity .15s cubic-bezier(.22, 1, .36, 1)}a:hover{opacity:.7}img,svg{max-width:100%;display:block}.eyebrow{font-family:"DM Mono",ui-monospace,monospace;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin:0 0 1.2em}.container{width:100%;max-width:1080px;margin:0 auto;padding:0 24px}.section{padding:clamp(64px, 10vw, 128px) 0}.section:nth-child(even){background:var(--control-bg)}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.btn{display:inline-flex;align-items:center;gap:.5em;min-height:54px;padding:0 26px;border-radius:9px;font-family:"Space Grotesk",system-ui,sans-serif;font-size:1rem;font-weight:600;cursor:pointer;border:1px solid transparent;transition:transform .15s cubic-bezier(.22, 1, .36, 1),box-shadow .15s cubic-bezier(.22, 1, .36, 1),background .15s cubic-bezier(.22, 1, .36, 1)}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{transform:translateY(-1px);opacity:1;background:var(--accent-hover)}.btn-ghost{background:transparent;color:var(--text);border-color:var(--hairline)}.btn-ghost:hover{opacity:1;border-color:var(--accent);color:var(--accent)}.badge{display:inline-block}.badge img{height:54px;width:auto}.badge:hover{opacity:.85}.coming-soon{display:inline-flex;align-items:center;min-height:54px;padding:0 22px;border-radius:9px;border:1px solid var(--hairline);font-family:"DM Mono",ui-monospace,monospace;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--text-dim);cursor:default;user-select:none}.nav{position:sticky;top:0;z-index:50;background:var(--bg);border-bottom:1px solid var(--hairline)}.nav-inner{display:flex;align-items:center;justify-content:space-between;height:64px}.brand{display:inline-flex;align-items:center;gap:10px;color:var(--text);font-family:"Space Grotesk",system-ui,sans-serif;font-weight:600;font-size:1.25rem;letter-spacing:-0.01em}.brand .mark{width:39px;height:39px;color:var(--accent)}.brand:hover{opacity:1}.nav-links{display:flex;align-items:center;gap:22px}.nav-links a:not(.btn){color:var(--text-mid);font-size:.95rem;font-weight:500}.nav-links a:not(.btn):hover{color:var(--text)}.footer{background:var(--footer-bg);border-top:1px solid var(--hairline);padding:48px 0;color:var(--text-mid);font-size:.9rem}.footer-inner{display:flex;flex-wrap:wrap;gap:18px;justify-content:space-between;align-items:center}.footer a{color:var(--text-mid)}.footer a:hover{color:var(--accent)}.footer-links{display:flex;gap:20px;flex-wrap:wrap}.footer-legal-text{color:var(--text-mid);font-size:.8rem;line-height:1.6}.footer-legal-text time{color:var(--text-mid)}.colophon-sha{font-family:"DM Mono",ui-monospace,monospace;font-size:.78rem}.card{background:var(--control-bg);border:1px solid var(--hairline);border-radius:14px;padding:28px}.prose{max-width:720px;margin:0 auto;padding:clamp(56px, 8vw, 96px) 24px}.prose h1{margin-bottom:.2em}.prose .updated{font-family:"DM Mono",ui-monospace,monospace;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-mid);margin-bottom:2.4em}.prose h2{font-size:1.5rem;margin-top:1.8em}.prose ul{padding-left:1.2em}.prose li{margin-bottom:.4em}@media (max-width:620px){.nav-links a:not(.btn){display:none}}.hero{padding:clamp(72px, 12vw, 150px) 0 clamp(56px, 9vw, 110px)}.hero-inner{max-width:760px}.hero h1 .accent{color:var(--accent)}.hero-sub{font-size:clamp(1.1rem, 2.2vw, 1.4rem);color:var(--text-mid);max-width:540px;margin-bottom:2em}.hero-cta{display:flex;flex-wrap:wrap;gap:14px;align-items:center}.hero-note{font-family:"DM Mono",ui-monospace,monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim);margin-top:1.6em}.steps{display:grid;grid-template-columns:repeat(3, 1fr);gap:20px}.step .num{font-family:"DM Mono",ui-monospace,monospace;font-size:.78rem;letter-spacing:.14em;color:var(--accent);margin-bottom:.8em}.step h3{margin-bottom:.3em}.step p{color:var(--text-mid);font-size:.97rem;margin:0}.features{display:grid;grid-template-columns:repeat(2, 1fr);gap:20px}.feature h3{margin-bottom:.25em}.feature p{color:var(--text-mid);margin:0}.feature .ic{width:30px;height:30px;color:var(--accent);margin-bottom:14px}.cta-final{text-align:center}.cta-final h2{max-width:18ch;margin:0 auto .6em}.cta-final p{color:var(--text-mid);max-width:44ch;margin:0 auto 1.8em}@media (max-width:760px){.steps,.features{grid-template-columns:1fr}}.showcase{text-align:center}.showcase-inner{display:flex;flex-direction:column;align-items:center}.showcase-title{max-width:18ch}.mode-toggle{display:inline-flex;gap:2px;padding:4px;margin:8px 0 36px;background:var(--control-bg);border:1px solid var(--hairline);border-radius:999px}.mode-btn{display:inline-flex;align-items:center;min-height:36px;padding:0 18px;border:none;background:transparent;border-radius:999px;font-family:"DM Mono",ui-monospace,monospace;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mid);cursor:pointer;transition:color .18s cubic-bezier(.22, 1, .36, 1),background .18s cubic-bezier(.22, 1, .36, 1)}.mode-btn:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.mode-btn[data-mode="practice"].is-active{background:var(--accent);color:var(--invert)}.mode-btn[data-mode="stage"].is-active{background:#2a7fff;color:var(--invert)}.device-stage{width:100%;display:flex;justify-content:center;--d-bg:#F0EDE6;--d-controls:#E2DDD4;--d-panel:#E6E2D9;--d-text:#1A1916;--d-mid:#8C8A84;--d-accent:#E8622A;--d-line:rgba(26,25,22,0.14);--d-pill-on:rgba(232,98,42,0.14);--d-accent-soft:rgba(232,98,42,0.55);--d-glow:rgba(232,98,42,0.34)}html[data-theme="stage"] .device-stage{--d-bg:#080c12;--d-controls:#0e151f;--d-panel:#0b1019;--d-text:#cfe2fb;--d-mid:#3a6090;--d-accent:#2a7fff;--d-line:rgba(42,127,255,0.22);--d-pill-on:rgba(42,127,255,0.16);--d-accent-soft:rgba(42,127,255,0.55);--d-glow:rgba(42,127,255,0.48)}.ipad{width:100%;padding:16px;background:linear-gradient(160deg, #2b2b2d, #131315);border-radius:30px;box-shadow:0 1px 0 rgba(255,255,255,0.08) inset,0 18px 50px rgba(0,0,0,0.34)}.ipad--portrait{max-width:768px}.ipad-screen{position:relative;aspect-ratio:834 / 1194;border-radius:14px;overflow:hidden;background:var(--d-bg);color:var(--d-text);transition:background .18s cubic-bezier(.22, 1, .36, 1),color .18s cubic-bezier(.22, 1, .36, 1)}.app{position:absolute;inset:0;display:flex;flex-direction:column;text-align:left}.app-score{flex:1;min-height:0;overflow:hidden;padding:clamp(12px, 2.6vw, 22px) clamp(15px, 3vw, 28px) 4px}.at-wrap{position:relative;width:100%;height:100%;overflow:hidden}.at-score{width:100%}.at-score svg{display:block}.at-wrap::before,.at-wrap::after{content:"";position:absolute;left:0;right:0;height:40px;z-index:3;pointer-events:none}.at-wrap::before{top:0;background:linear-gradient(var(--d-bg), transparent)}.at-wrap::after{bottom:0;background:linear-gradient(transparent, var(--d-bg))}.at-ph{position:absolute;top:0;left:0;width:1.6px;z-index:2;background:var(--d-accent);border-radius:2px;box-shadow:0 0 3px var(--d-glow);opacity:0;pointer-events:none;will-change:transform, height}.at-ph::before{content:"";position:absolute;top:-2px;left:50%;transform:translateX(-50%);width:5px;height:5px;border-radius:50%;background:var(--d-accent)}.loop-mark{position:absolute;top:0;left:0;width:3px;z-index:1;background:var(--d-accent);border-radius:1px;opacity:.9;pointer-events:none;display:none;will-change:transform, height}.loop-mark::before,.loop-mark::after{content:"";position:absolute;width:9px;height:3px;background:var(--d-accent);border-radius:1px}.loop-mark-in::before{top:0;left:0}.loop-mark-in::after{bottom:0;left:0}.loop-mark-out::before{top:0;right:0}.loop-mark-out::after{bottom:0;right:0}.app-controls{display:flex;flex-direction:column;gap:11px;flex-shrink:0;padding:11px clamp(15px, 3vw, 28px);background:var(--d-controls);border-top:1px solid var(--d-line)}.progress-row{display:flex;align-items:center;gap:10px}.progress-row .t{font-family:"DM Mono",ui-monospace,monospace;font-size:.6rem;letter-spacing:.04em;color:var(--d-mid);min-width:28px}.progress-row .t.cur{color:var(--d-accent)}.progress-row .t.tot{text-align:right}.prog{position:relative;flex:1;height:16px;display:flex;align-items:center;cursor:pointer;touch-action:none}.prog::before{content:"";position:absolute;left:0;right:0;height:2px;border-radius:2px;background:var(--d-line)}.prog-loop{position:absolute;height:5px;border-radius:2px;background:var(--d-pill-on);display:none}.prog-fill{position:absolute;left:0;height:2px;border-radius:2px;background:var(--d-accent);width:16%}.prog-dot{position:absolute;left:16%;transform:translateX(-50%);width:11px;height:11px;border-radius:50%;background:var(--d-accent);box-shadow:0 0 6px var(--d-glow)}.prog:active .prog-dot{transform:translateX(-50%) scale(1.18)}.buttons-row{display:flex;align-items:center;gap:10px}.play-btn{flex:none;width:38px;height:38px;border-radius:50%;background:var(--d-accent);box-shadow:0 4px 16px var(--d-glow);border:none;padding:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;transition:transform .1s cubic-bezier(.22, 1, .36, 1)}.play-btn:active{transform:scale(.93)}.play-btn svg{width:19px;height:19px;fill:#fff}.play-btn .play-ic{margin-left:.5px}.play-btn .pause-ic{display:none}.play-btn.playing .play-ic{display:none}.play-btn.playing .pause-ic{display:inline}.stem-seg{display:inline-flex;padding:2px;border-radius:9px;background:var(--d-panel);border:1px solid var(--d-line)}.stem-seg .seg{display:inline-flex;align-items:center;justify-content:center;width:30px;height:28px;border-radius:7px;color:var(--d-mid)}.stem-seg .seg.on{color:var(--d-accent);background:var(--d-pill-on)}.stem-seg .ic{width:16px;height:16px;fill:currentColor}.right-cluster{margin-left:auto;display:inline-flex;align-items:center;gap:6px}.tunekit{display:inline-flex;align-items:center;gap:5px;height:32px;padding:0 11px;border-radius:999px;border:1px solid var(--d-line);color:var(--d-text);font-family:"Space Grotesk",system-ui,sans-serif;font-size:.66rem;font-weight:500;white-space:nowrap}.tunekit .tk{width:15px;height:15px;flex:none}.speed2{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;height:32px;padding:0 11px;border-radius:999px;border:1px solid var(--d-line);background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent}.speed2:active{transform:scale(.96)}.speed2 .x{font-family:"Space Grotesk",system-ui,sans-serif;font-size:.74rem;font-weight:600;color:var(--d-text)}.speed2 .bpm{font-family:"DM Mono",ui-monospace,monospace;font-size:.44rem;letter-spacing:.06em;text-transform:uppercase;color:var(--d-accent);margin-top:2px}.loop-pill{display:inline-flex;align-items:center;justify-content:center;height:32px;padding:0 11px;border-radius:999px;border:1px solid var(--d-line);background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:none}.loop-pill:active{transform:scale(.96)}.loop-pill .loop-ic{width:23px;height:12px}.loop-pill .lb,.loop-pill .rb{stroke:var(--d-mid)}.loop-pill .dots circle{fill:var(--d-mid)}.loop-pill.loop-in .lb{stroke:var(--d-accent)}.loop-pill.loop-in .dots circle{fill:var(--d-accent);opacity:.5}.loop-pill.loop-active .lb,.loop-pill.loop-active .rb{stroke:var(--d-accent)}.loop-pill.loop-active .dots circle{fill:var(--d-accent)}.loop-pill.loop-paused .lb,.loop-pill.loop-paused .rb{stroke:var(--d-accent)}.loop-pill.loop-paused .dots circle{fill:var(--d-accent);opacity:.6}.loop-pill.is-armed{background:var(--d-pill-on);border-color:var(--d-accent-soft)}.track-footer{display:flex;align-items:center;gap:10px;flex-shrink:0;padding:11px clamp(15px, 3vw, 28px) 13px;background:var(--d-panel);border-top:1px solid var(--d-line)}.track-footer .chev{display:inline-flex;align-items:center;color:var(--d-mid);flex:none}.track-footer .chev svg{width:11px;height:18px}.tf-info{flex:1;min-width:0}.tf-title{font-family:"EB Garamond",Georgia,serif;font-size:clamp(.95rem, 2.4vw, 1.3rem);font-weight:600;letter-spacing:-0.01em;color:var(--d-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tf-sub{font-family:"Space Grotesk",system-ui,sans-serif;font-size:.62rem;color:var(--d-mid);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tf-meta{margin-left:auto;text-align:right;white-space:nowrap}.tf-bpm{font-family:"DM Mono",ui-monospace,monospace;font-size:.62rem;letter-spacing:.06em;color:var(--d-mid)}.tf-sig{font-family:"DM Mono",ui-monospace,monospace;font-size:.56rem;color:var(--d-mid);opacity:.7;margin-top:1px}@media (prefers-reduced-motion:reduce){.ipad-screen,.mode-toggle label,.play-btn{transition:none}}@media (max-width:520px){.tunekit span{display:none}.ipad{padding:11px;border-radius:22px}}