@font-face{font-family:Fraunces Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/fraunces-vietnamese-full-normal-7BpKI3vF.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Fraunces Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/fraunces-latin-ext-full-normal-YHFkNujK.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Fraunces Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/fraunces-latin-full-normal-CFFu7zhK.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Fraunces Variable;font-style:italic;font-display:swap;font-weight:100 900;src:url(/assets/fraunces-vietnamese-full-italic-BHALq22K.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Fraunces Variable;font-style:italic;font-display:swap;font-weight:100 900;src:url(/assets/fraunces-latin-ext-full-italic-B8-t4Nou.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Fraunces Variable;font-style:italic;font-display:swap;font-weight:100 900;src:url(/assets/fraunces-latin-full-italic-D2JnYqd-.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-cyrillic-ext-wght-normal-BOeWTOD4.woff2)format("woff2-variations");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-cyrillic-wght-normal-DqGufNeO.woff2)format("woff2-variations");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-greek-ext-wght-normal-DlzME5K_.woff2)format("woff2-variations");unicode-range:U+1F??}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-greek-wght-normal-CkhJZR-_.woff2)format("woff2-variations");unicode-range:U+370-377,U+37A-37F,U+384-38A,U+38C,U+38E-3A1,U+3A3-3FF}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-vietnamese-wght-normal-CBcvBZtf.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-latin-ext-wght-normal-DO1Apj_S.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Inter Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/inter-latin-wght-normal-Dx4kXJAl.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--ink:#0e0f12;--ink-2:#15171c;--surface:#ffffff09;--surface-2:#ffffff0f;--line:#ffffff17;--text:#f1efe9;--muted:#a3a29d;--faint:#6f6e6a;--accent:#fb923c;--accent-deep:#ea580c;--ok:#4ade80;--bad:#f87171;--serif:"Fraunces Variable", Georgia, serif;--sans:"Inter Variable", system-ui, -apple-system, "Segoe UI", sans-serif;--radius:22px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{background:var(--ink);color:var(--text);font:400 17px/1.6 var(--sans);-webkit-font-smoothing:antialiased;margin:0;overflow-x:hidden}body:after{content:"";pointer-events:none;z-index:100;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}.glow{pointer-events:none;background:radial-gradient(600px 420px at 78% 18%,#fb923c29,#0000 70%),radial-gradient(520px 380px at 12% 8%,#ea580c1a,#0000 70%),radial-gradient(700px 500px at 60% 75%,#4ade800d,#0000 70%);height:1100px;position:absolute;inset:0 0 auto}a{color:inherit}.container{width:100%;max-width:1160px;margin:0 auto;padding:0 24px}.muted{color:var(--muted)}h1,h2,h3{font-family:var(--serif);font-variation-settings:"SOFT" 50, "opsz" 96;letter-spacing:-.02em;margin:0;font-weight:500;line-height:1.05}h1 em,h2 em{font-variation-settings:"SOFT" 100, "WONK" 1;color:var(--accent);font-style:italic}h2{font-size:clamp(32px,4.4vw,54px)}h3{font-size:24px;line-height:1.2}.eyebrow{letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin:0 0 16px;font-size:13px;font-weight:600}.btn{background:linear-gradient(180deg, #fdba74, var(--accent) 45%, var(--accent-deep));color:#1a0d03;border-radius:999px;align-items:center;gap:8px;padding:15px 26px;font-weight:650;text-decoration:none;transition:transform .2s,box-shadow .2s;display:inline-flex;box-shadow:inset 0 1px #ffffff59,0 10px 30px -8px #fb923c99}.btn:hover{transform:translateY(-1px);box-shadow:inset 0 1px #ffffff59,0 14px 36px -8px #fb923cbf}.btn-ghost{background:var(--surface-2);color:var(--text);box-shadow:inset 0 0 0 1px var(--line)}.btn-ghost:hover{box-shadow:inset 0 0 0 1px #fff3}.btn-small{padding:9px 18px;font-size:15px}.nav{z-index:50;-webkit-backdrop-filter:blur(14px)saturate(140%);backdrop-filter:blur(14px)saturate(140%);border-bottom:1px solid var(--line);background:#0e0f12b8;position:sticky;top:0}.nav-inner{align-items:center;gap:32px;height:68px;display:flex}.logo{font-family:var(--serif);align-items:center;gap:10px;font-size:22px;font-weight:600;text-decoration:none;display:inline-flex}.nav-links{gap:28px;margin-left:auto;display:flex}.nav-links a{color:var(--muted);font-size:15px;text-decoration:none;transition:color .2s}.nav-links a:hover{color:var(--text)}.nav-actions{align-items:center;gap:12px;display:flex}.lang{border:1px solid var(--line);color:var(--muted);font:600 13px var(--sans);cursor:pointer;background:0 0;border-radius:999px;padding:6px 12px}.lang:hover{color:var(--text)}.hero{grid-template-columns:1.05fr 1fr;align-items:center;gap:56px;padding-top:88px;padding-bottom:96px;display:grid;position:relative}.hero h1{letter-spacing:-.035em;font-size:clamp(52px,8vw,104px);font-weight:450;line-height:.95}.lead{max-width:34em;color:var(--muted);margin:28px 0 0;font-size:19px}.cta-row{flex-wrap:wrap;gap:12px;margin-top:36px;display:flex}.hero-meta{color:var(--faint);margin:22px 0 0;font-size:14px}.device{border:1px solid var(--line);background:linear-gradient(160deg,#ffffff12,#ffffff05);border-radius:28px;padding:18px;position:relative;transform:perspective(1400px)rotateY(-6deg)rotateX(3deg);box-shadow:0 40px 100px -30px #000c,inset 0 0 0 1px #ffffff08}.device-bar{align-items:center;gap:7px;margin-bottom:16px;font-size:14px;display:flex}.device-bar span{background:#ffffff1f;border-radius:50%;width:10px;height:10px}.device-bar strong{font-family:var(--serif);margin-left:10px;font-size:16px;font-weight:500}.demo-hint{grid-template-columns:auto 1fr;align-items:center;gap:18px;display:grid}.demo-target,.ill-card{background:var(--ink-2);border:1px solid var(--line);border-radius:16px;min-width:140px;padding:14px 18px;display:grid}.demo-eyebrow{letter-spacing:.12em;text-transform:uppercase;color:var(--faint);font-size:11px}.demo-target strong,.ill-card strong{letter-spacing:-.02em;font-size:40px;font-weight:700;line-height:1.15}.demo-where{color:var(--muted);white-space:nowrap;font-size:13px}.demo-fretboard{width:100%;height:auto;overflow:visible}.fb-frets line,.fb-strings line{stroke:#fff3;stroke-width:1.2px}.fb-frets .fb-nut{stroke:#ffffffbf;stroke-width:4px}.fb-dot circle{fill:var(--accent);transition:fill .2s}.fb-dot{transition:transform .35s cubic-bezier(.3,.7,.2,1)}.fb-dot text{fill:#1a0d03;font:700 11px var(--sans);text-anchor:middle}.fb-dot.open circle{fill:#0000;stroke:var(--accent);stroke-width:2.5px;r:6}.fb-dot.miss circle{fill:var(--bad)}.fb-dot.on circle{fill:var(--ok)}.fb-open{fill:none;stroke:var(--muted);stroke-width:2px}.fb-open.on{stroke:var(--ok)}.demo-tab{height:112px;margin:22px 0 6px;padding:12px 0;position:relative}.demo-lines{flex-direction:column;justify-content:space-between;display:flex;position:absolute;inset:12px 0}.demo-lines i{background:#ffffff29;height:1px}.demo-notes{position:absolute;inset:12px 0}.tab-note{background:var(--ink-2);font:600 14px var(--sans);color:var(--faint);border-radius:4px;padding:0 4px;transition:color .25s,transform .25s;position:absolute;transform:translate(-50%,-50%)}.tab-note.done{color:var(--ok)}.tab-note.current{color:var(--text);transform:translate(-50%,-50%)scale(1.25)}.demo-cursor{background:var(--accent);width:3px;box-shadow:0 0 18px var(--accent);border-radius:2px;margin-left:-1.5px;transition:left .35s cubic-bezier(.3,.7,.2,1);position:absolute;top:0;bottom:0}.demo-footer{justify-content:space-between;align-items:center;font-size:14px;display:flex}.demo-feedback{min-height:1.6em;font-weight:600}.demo-feedback.hit{color:var(--ok)}.demo-feedback.miss{color:var(--bad)}.demo-progress{color:var(--faint);font-variant-numeric:tabular-nums}.strip{border-block:1px solid var(--line);background:#ffffff04}.strip-inner{color:var(--muted);flex-wrap:wrap;justify-content:center;gap:10px 36px;padding-block:22px;font-size:15px;display:flex}.strip-inner span:before{content:"♪";color:var(--accent);margin-right:10px}.section{padding-block:120px 40px}.section>h2{max-width:16em}.steps{grid-template-columns:repeat(3,1fr);gap:20px;margin:56px 0 0;padding:0;list-style:none;display:grid}.step{border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);padding:30px}.step-n{font-family:var(--serif);color:var(--accent);margin-bottom:40px;font-size:15px;display:block}.step p{color:var(--muted);margin:12px 0 0}.features{gap:140px;display:grid}.feature{grid-template-columns:1fr 1.1fr;align-items:center;gap:72px;display:grid}.feature-flip .feature-copy{order:2}.feature-copy>p:not(.eyebrow){color:var(--muted);max-width:30em;margin:22px 0 0;font-size:18px}.ticks{gap:12px;margin:28px 0 0;padding:0;list-style:none;display:grid}.ticks li{color:var(--text);padding-left:30px;position:relative}.ticks li:before{content:"";border-left:2px solid var(--ok);border-bottom:2px solid var(--ok);width:16px;height:9px;position:absolute;top:.45em;left:0;transform:rotate(-45deg)}.soon{color:var(--accent);white-space:nowrap;border:1px solid #fb923c66;border-radius:999px;margin-left:6px;padding:2px 9px;font-size:12px;font-weight:600}.media{background:radial-gradient(420px 260px at 70% 20%, #fb923c1a, transparent 70%), var(--surface);border:1px solid var(--line);border-radius:28px;place-items:center;min-height:340px;padding:40px;display:grid;position:relative;overflow:hidden}.media.has-video,.hero-visual.has-video{background:#000;min-height:0;padding:0}.slot-video{object-fit:contain;border-radius:inherit;width:100%;max-height:72vh;display:block}.hero-visual.has-video{border:1px solid var(--line);border-radius:28px;overflow:hidden}.ill{gap:18px;width:100%;max-width:400px;display:grid}.ill-miss{color:var(--bad);margin:0;font-weight:600}.ill-progress{background:var(--surface-2);border-radius:10px;height:30px;font-size:13px;position:relative;overflow:hidden}.ill-progress i{background:#4ade802e;position:absolute;inset:0 auto 0 0}.ill-progress span{color:var(--muted);padding:0 12px;line-height:30px;position:relative}.ill-chord-head{align-items:baseline;gap:14px;display:flex}.ill-chord-head strong,.ill-tuner strong{letter-spacing:-.02em;font-size:44px;font-weight:700;line-height:1}.tones,.chips{gap:6px;display:flex}.tones i,.chips i{border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:2px 11px;font-size:13px;font-style:normal;font-weight:600}.tones i.on,.chips i.ok{color:var(--ok);background:#4ade8026;border-color:#4ade8080}.chips i.cur{background:var(--accent);border-color:var(--accent);color:#1a0d03}.ill-tools .bars{grid-template-columns:repeat(4,1fr);gap:6px;padding-top:34px;display:grid;position:relative}.ill-tools .bars span{border:1px solid var(--line);background:repeating-linear-gradient(#0000 0 10px,#ffffff24 10px 11px);border-radius:8px;height:64px}.ill-tools .bars span.sel{background-color:#fb923c1f;border-color:#fb923c80}.loop-bracket{text-align:center;width:calc(50% - 6px);color:var(--accent);border-top:2px solid var(--accent);padding-top:6px;font-size:13px;font-weight:600;position:absolute;top:0;left:calc(25% + 3px)}.tempo-row{color:var(--muted);grid-template-columns:auto 1fr auto;align-items:center;gap:14px;font-size:14px;display:grid}.tempo-row strong{color:var(--text)}.slider{background:var(--surface-2);border-radius:3px;height:6px;position:relative}.slider i{background:var(--accent);border-radius:3px;position:absolute;inset:0 auto 0 0}.slider b{background:var(--text);border-radius:50%;width:18px;height:18px;margin:-9px 0 0 -9px;position:absolute;top:50%;box-shadow:0 2px 8px #00000080}.metro{gap:10px;display:flex}.metro i{background:var(--surface-2);border-radius:50%;width:12px;height:12px;animation:2.4s infinite beat}.metro i:nth-child(2){animation-delay:.6s}.metro i:nth-child(3){animation-delay:1.2s}.metro i:nth-child(4){animation-delay:1.8s}@keyframes beat{0%,20%{background:var(--accent);box-shadow:0 0 14px var(--accent)}30%,to{background:var(--surface-2);box-shadow:none}}.ill-tuner{text-align:center;justify-items:center;gap:6px}.gauge{width:100%;max-width:280px}.gauge-track{fill:none;stroke:var(--surface-2);stroke-width:14px;stroke-linecap:round}.gauge-zone{fill:none;stroke:var(--ok);stroke-width:14px}.gauge-needle{stroke:var(--ok);stroke-width:4px;stroke-linecap:round;transform-origin:120px 118px;animation:5s ease-in-out infinite settle}.gauge-hub{fill:var(--ok)}@keyframes settle{0%{stroke:var(--accent);transform:rotate(-38deg)}25%{stroke:var(--accent);transform:rotate(14deg)}45%,90%{stroke:var(--ok);transform:rotate(0)}to{stroke:var(--accent);transform:rotate(-38deg)}}.ill-intune{color:var(--ok);font-weight:600}.ill-teacher .upload{color:var(--muted);border:2px dashed #ffffff29;border-radius:16px;align-items:center;gap:12px;padding:22px;display:flex}.ill-teacher .upload svg{width:26px;fill:var(--accent)}.ill-note{border-left:3px solid var(--accent);background:var(--ink-2);border-radius:0 14px 14px 0;padding:14px 18px}.ill-note p{margin:4px 0 0}.ill-ok{color:var(--ok);background:#4ade801f;border-radius:12px;margin:0;padding:10px 14px;font-weight:600}.privacy{border-radius:var(--radius);background:linear-gradient(120deg,#4ade801a,#4ade8005);border:1px solid #4ade8033;align-items:center;gap:28px;margin-top:140px;padding:44px 48px;display:flex}.privacy svg{width:52px;fill:var(--ok);flex:none}.privacy h2{font-size:clamp(26px,3vw,36px)}.privacy p{color:var(--muted);margin:8px 0 0}.faq-list{border-top:1px solid var(--line);margin-top:48px}.faq details{border-bottom:1px solid var(--line)}.faq summary{font-family:var(--serif);cursor:pointer;padding:24px 40px 24px 0;font-size:22px;list-style:none;position:relative}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"+";font-family:var(--sans);color:var(--accent);font-size:26px;transition:transform .25s;position:absolute;top:50%;right:4px;transform:translateY(-50%)}.faq details[open] summary:after{transform:translateY(-50%)rotate(45deg)}.faq details p{max-width:44em;color:var(--muted);margin:-6px 0 24px}.final{text-align:center;margin-block:140px 100px}.final h2{font-size:clamp(48px,7vw,92px);font-weight:450}.final p{color:var(--muted);margin:18px 0 36px;font-size:19px}.footer{border-top:1px solid var(--line);padding-block:32px;font-size:14px}.footer-inner{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px;display:flex}.footer .logo{font-size:18px}.footer nav{gap:24px;display:flex}.footer nav a{color:var(--muted);text-decoration:none}.footer nav a:hover{color:var(--text)}.js .reveal{opacity:0;transition:opacity .8s,transform .8s cubic-bezier(.2,.7,.2,1);transform:translateY(22px)}.js .reveal.in{opacity:1;transform:none}.hero .reveal:nth-child(2){transition-delay:80ms}.hero .reveal:nth-child(3){transition-delay:.16s}.hero .reveal:nth-child(4){transition-delay:.24s}.hero .reveal:nth-child(5){transition-delay:.32s}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition:none!important;animation:none!important}}@media (width<=960px){.hero,.feature{grid-template-columns:1fr;gap:48px}.feature-flip .feature-copy{order:0}.device{transform:none}.steps{grid-template-columns:1fr}.nav-links{display:none}.nav-actions{margin-left:auto}.features{gap:100px}}@media (width<=560px){body{font-size:16px}.container{padding:0 16px}.hero{padding-top:48px}.demo-hint{grid-template-columns:1fr}.media{min-height:0;padding:24px}.privacy{flex-direction:column;align-items:flex-start;padding:32px 24px}.section{padding-top:88px}}
