@font-face{font-family:Bricolage Grotesque;font-style:normal;font-weight:500;font-stretch:100%;font-display:swap;src:url(../media/033400d475fad6b1-s.11x_mcju407z-.woff2)format("woff2");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:Bricolage Grotesque;font-style:normal;font-weight:500;font-stretch:100%;font-display:swap;src:url(../media/26daee0352f50a5f-s.456c9vb2_utt8.woff2)format("woff2");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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Bricolage Grotesque;font-style:normal;font-weight:500;font-stretch:100%;font-display:swap;src:url(../media/017d9bea37084d9b-s.p.2fl0vhx7oyatw.woff2)format("woff2");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:Bricolage Grotesque;font-style:normal;font-weight:700;font-stretch:100%;font-display:swap;src:url(../media/033400d475fad6b1-s.11x_mcju407z-.woff2)format("woff2");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:Bricolage Grotesque;font-style:normal;font-weight:700;font-stretch:100%;font-display:swap;src:url(../media/26daee0352f50a5f-s.456c9vb2_utt8.woff2)format("woff2");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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Bricolage Grotesque;font-style:normal;font-weight:700;font-stretch:100%;font-display:swap;src:url(../media/017d9bea37084d9b-s.p.2fl0vhx7oyatw.woff2)format("woff2");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:Bricolage Grotesque;font-style:normal;font-weight:800;font-stretch:100%;font-display:swap;src:url(../media/033400d475fad6b1-s.11x_mcju407z-.woff2)format("woff2");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:Bricolage Grotesque;font-style:normal;font-weight:800;font-stretch:100%;font-display:swap;src:url(../media/26daee0352f50a5f-s.456c9vb2_utt8.woff2)format("woff2");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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Bricolage Grotesque;font-style:normal;font-weight:800;font-stretch:100%;font-display:swap;src:url(../media/017d9bea37084d9b-s.p.2fl0vhx7oyatw.woff2)format("woff2");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:Bricolage Grotesque Fallback;src:local(Arial);ascent-override:88.21%;descent-override:25.61%;line-gap-override:0.0%;size-adjust:105.43%}.bricolage_grotesque_e40ccc44-module__U0pGva__className{font-family:Bricolage Grotesque,Bricolage Grotesque Fallback;font-style:normal}.bricolage_grotesque_e40ccc44-module__U0pGva__variable{--font-display:"Bricolage Grotesque", "Bricolage Grotesque Fallback"}
@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/fef07dbb0973bf53-s.00az9qtie3ho1.woff2)format("woff2");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/8a480f0b521d4e75-s.3j-a226dh71aj.woff2)format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/53b9e256198e5412-s.2gwoz23eiro2t.woff2)format("woff2");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:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/7178b3e590c64307-s.0i3h3th1vs4m7.woff2)format("woff2");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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/caa3a2e1cccd8315-s.p.0zr6hhvz-h9nw.woff2)format("woff2");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:Geist Fallback;src:local(Arial);ascent-override:95.94%;descent-override:28.16%;line-gap-override:0.0%;size-adjust:104.76%}.geist_ff61a596-module__UdeZcG__className{font-family:Geist,Geist Fallback;font-style:normal}.geist_ff61a596-module__UdeZcG__variable{--font-sans:"Geist", "Geist Fallback"}
@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../media/04c5164763c40239-s.1zakzi6q17d4o.woff2)format("woff2");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../media/26f284dcc38c84c0-s.2htf8h-pf57mm.woff2)format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../media/7e7f32a39836f228-s.3skwie1wjplzh.woff2)format("woff2");unicode-range:U+370-377,U+37A-37F,U+384-38A,U+38C,U+38E-3A1,U+3A3-3FF}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../media/fa39153a3fc630ba-s.3zhbgtelpa5ua.woff2)format("woff2");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:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../media/6a5386fd6038edbe-s.3vf5yzuqk3fsd.woff2)format("woff2");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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:400;font-display:swap;src:url(../media/051742360c26797e-s.p.1wmoa0e_blxrz.woff2)format("woff2");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:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(../media/04c5164763c40239-s.1zakzi6q17d4o.woff2)format("woff2");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(../media/26f284dcc38c84c0-s.2htf8h-pf57mm.woff2)format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(../media/7e7f32a39836f228-s.3skwie1wjplzh.woff2)format("woff2");unicode-range:U+370-377,U+37A-37F,U+384-38A,U+38C,U+38E-3A1,U+3A3-3FF}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(../media/fa39153a3fc630ba-s.3zhbgtelpa5ua.woff2)format("woff2");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:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(../media/6a5386fd6038edbe-s.3vf5yzuqk3fsd.woff2)format("woff2");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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:500;font-display:swap;src:url(../media/051742360c26797e-s.p.1wmoa0e_blxrz.woff2)format("woff2");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:JetBrains Mono;font-style:normal;font-weight:700;font-display:swap;src:url(../media/04c5164763c40239-s.1zakzi6q17d4o.woff2)format("woff2");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:700;font-display:swap;src:url(../media/26f284dcc38c84c0-s.2htf8h-pf57mm.woff2)format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:700;font-display:swap;src:url(../media/7e7f32a39836f228-s.3skwie1wjplzh.woff2)format("woff2");unicode-range:U+370-377,U+37A-37F,U+384-38A,U+38C,U+38E-3A1,U+3A3-3FF}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:700;font-display:swap;src:url(../media/fa39153a3fc630ba-s.3zhbgtelpa5ua.woff2)format("woff2");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:JetBrains Mono;font-style:normal;font-weight:700;font-display:swap;src:url(../media/6a5386fd6038edbe-s.3vf5yzuqk3fsd.woff2)format("woff2");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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:JetBrains Mono;font-style:normal;font-weight:700;font-display:swap;src:url(../media/051742360c26797e-s.p.1wmoa0e_blxrz.woff2)format("woff2");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:JetBrains Mono Fallback;src:local(Arial);ascent-override:75.79%;descent-override:22.29%;line-gap-override:0.0%;size-adjust:134.59%}.jetbrains_mono_2e93a1dd-module__styOqW__className{font-family:JetBrains Mono,JetBrains Mono Fallback;font-style:normal}.jetbrains_mono_2e93a1dd-module__styOqW__variable{--font-mono:"JetBrains Mono", "JetBrains Mono Fallback"}
:root{--bg:#0c0c0e;--bg-2:#111114;--surface:#151518;--surface-2:#1c1c21;--surface-3:#25252b;--line:#ffffff12;--line-2:#ffffff21;--ink:#f4f0e8;--ink-2:#cbc5ba;--muted:#918b82;--faint:#5f5a54;--accent:#ff6b1f;--accent-2:#ffa94d;--accent-deep:#b8440a;--accent-ink:#1b0c03;--good:#46e09b;--good-deep:#13824f;--bad:#ff5a5f;--bad-deep:#a3262a;--hint:#ffc94d;--radius:18px;--radius-lg:26px;--shadow:0 30px 60px -30px #000000b3;--ease-out:cubic-bezier(.2, .8, .2, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--font-display:"Bricolage Grotesque", system-ui, sans-serif;--font-sans:"Geist", system-ui, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, monospace;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}.tone-orange{--tone:#ff8a3d}.tone-amber{--tone:#ffb547}.tone-red{--tone:#ff6b6b}.tone-teal{--tone:#3fd4c4}.tone-yellow{--tone:#f2d24b}.tone-blue{--tone:#5aa9ff}.tone-cream{--tone:#e8dcc4}.tone-indigo{--tone:#8f90ff}.tone-green{--tone:#4fd18b}.tone-sky{--tone:#5cc8ff}.tone-violet{--tone:#b28bff}.tone-pink{--tone:#ff7ac6}.tone-lime{--tone:#a8e05f}*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth;min-width:320px}body{min-height:100vh;color:var(--ink);background:radial-gradient(1100px 520px at 75% -120px, #ff6b1f21, transparent 70%), radial-gradient(800px 420px at -10% 10%, #8f90ff0f, transparent 70%), radial-gradient(#ffffff09 1px, transparent 1px) 0 0 / 22px 22px, var(--bg);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;background-attachment:fixed;margin:0;font-size:16px;line-height:1.5}button,select,input{font:inherit;color:inherit}button,a,input{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{cursor:pointer}button:disabled{cursor:default}:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}main:focus,main:focus-visible{outline:none}::selection{color:var(--accent-ink);background:var(--accent-2)}h1,h2,h3,p{margin:0}.display{font-family:var(--font-display);letter-spacing:-.035em;text-wrap:balance;font-weight:800;line-height:.98}.display em,.hero-title em{background:linear-gradient(95deg, var(--accent) 10%, var(--accent-2) 90%);color:#0000;-webkit-background-clip:text;background-clip:text;font-style:normal}.lede{color:var(--ink-2);text-wrap:pretty;font-size:18px;line-height:1.6}.eyebrow,.kicker,.label,.rail-label{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-size:12px;font-weight:500}.eyebrow{color:var(--accent-2);align-items:center;gap:10px;display:inline-flex}.live-dot{background:var(--accent);border-radius:50%;width:8px;height:8px;animation:2s ease-in-out infinite pulse;box-shadow:0 0 0 4px #ff6b1f2e}kbd{min-width:22px;height:22px;font-family:var(--font-mono);color:var(--ink-2);background:var(--surface-3);border-radius:6px;place-items:center;padding:0 6px;font-size:11px;font-weight:500;display:inline-grid;box-shadow:inset 0 1px #ffffff14,0 2px #08080a}.button{--depth:4px;white-space:nowrap;height:46px;transition:transform .12s var(--ease-out), box-shadow .12s var(--ease-out), background .2s, filter .2s;border:0;border-radius:12px;justify-content:center;align-items:center;gap:10px;padding:0 20px;font-size:15px;font-weight:600;display:inline-flex;position:relative}.button:active:not(:disabled){transform:translateY(calc(var(--depth) - 1px))}.button span{transition:transform .2s var(--ease-out)}.button:hover span{transform:translate(3px)}.button-primary{color:var(--accent-ink);background:linear-gradient(180deg, #ff8a45, var(--accent));box-shadow:inset 0 1px 0 #ffffff59, 0 var(--depth) 0 var(--accent-deep), 0 12px 28px -10px #ff6b1f8c}.button-primary:hover{filter:brightness(1.07)}.button-primary:active:not(:disabled){box-shadow:inset 0 1px 0 #ffffff59, 0 1px 0 var(--accent-deep)}.button-primary kbd{color:var(--accent-ink);box-shadow:none;background:#0000002e}.button-secondary{color:var(--ink);box-shadow:inset 0 1px 0 #ffffff17, 0 var(--depth) 0 #08080a;background:linear-gradient(#2c2c33,#232329)}.button-secondary:hover{background:linear-gradient(#34343c,#2a2a31)}.button-secondary:active:not(:disabled){box-shadow:inset 0 1px #ffffff17,0 1px #08080a}.button-ghost{--depth:0px;color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--line-2);background:0 0}.button-ghost:hover:not(:disabled){color:var(--ink);background:var(--surface-2)}.button-ghost:disabled{opacity:.4}.button-lg{border-radius:14px;height:56px;padding:0 26px;font-size:17px}.button-sm{--depth:3px;border-radius:10px;height:34px;padding:0 14px;font-size:13px}.text-button{color:var(--muted);text-decoration:underline;-webkit-text-decoration-color:var(--line-2);text-decoration-color:var(--line-2);text-underline-offset:4px;background:0 0;border:0;padding:4px 2px;font-size:14px}.text-button:hover{color:var(--ink)}.icon-button{background:var(--surface-2);width:40px;height:40px;box-shadow:inset 0 0 0 1px var(--line), 0 2px 0 #08080a;color:var(--ink-2);border:0;border-radius:11px;place-items:center;font-size:15px;display:grid}.icon-button:hover{background:var(--surface-3);color:var(--ink)}.pill{--tone:var(--muted);height:28px;font-family:var(--font-mono);color:var(--tone);background:color-mix(in srgb, var(--tone) 13%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--tone) 22%, transparent);white-space:nowrap;border-radius:999px;align-items:center;gap:7px;padding:0 12px;font-size:12px;font-weight:500;display:inline-flex}.pill-quiet{color:var(--muted);box-shadow:inset 0 0 0 1px var(--line-2);background:0 0}.diff-starter{color:var(--good)}.diff-steady{color:var(--accent-2)}.diff-stretch{color:#ff7ac6}.key-hint{color:var(--faint);align-items:center;gap:6px;font-size:13px;display:inline-flex}.cap{min-width:2.3em;height:2.3em;font-family:var(--font-mono);color:var(--ink);white-space:nowrap;background:linear-gradient(#393941 0%,#2a2a31 100%);border-radius:.42em;place-items:center;padding:0 .65em;font-size:1em;font-weight:700;line-height:1;display:inline-grid;box-shadow:inset 0 1px #ffffff24,inset 0 -.16em #00000047,0 .2em #09090b,0 .45em .9em #00000073}.cap-sm{min-width:2.2em;font-size:13px}.cap-hero{min-width:2.1em;height:2.1em;color:var(--accent-ink);background:linear-gradient(180deg, #ff9455, var(--accent));box-shadow:inset 0 2px 0 #fff6, inset 0 -.12em 0 #0000002e, 0 .16em 0 var(--accent-deep), 0 .6em 1.4em -.2em #ff6b1f80;font-size:40px}.chord{flex-wrap:wrap;justify-content:center;align-items:center;row-gap:.4em;display:inline-flex}.chord-part{align-items:center;display:inline-flex}.chord-plus{color:var(--faint);font-family:var(--font-mono);margin:0 .32em;font-size:.85em;font-weight:500}.chord-sm{font-size:11px}.chord-sm .cap{min-width:2.2em;height:2.2em;padding:0 .55em;box-shadow:inset 0 1px #ffffff1f,0 .18em #09090b}.chord-md{font-size:15px}.chord-lg{font-size:22px}.chord-xl{font-size:clamp(22px,3.4vw,34px)}.chord-lg .chord-part,.chord-xl .chord-part{animation:cap-in .35s var(--ease-spring) both}.chord-lg .chord-part:nth-child(2),.chord-xl .chord-part:nth-child(2){animation-delay:50ms}.chord-lg .chord-part:nth-child(3),.chord-xl .chord-part:nth-child(3){animation-delay:.1s}.chord-lg .chord-part:nth-child(4),.chord-xl .chord-part:nth-child(4){animation-delay:.15s}.chord-correct .cap{color:#04140c;background:linear-gradient(180deg, #6ff0b6, var(--good));box-shadow:inset 0 1px 0 #fff6, 0 .2em 0 var(--good-deep), 0 .5em 1.2em -.2em #46e09b73}.chord-wrong .cap{color:#fff3f3;background:linear-gradient(180deg, #ff7b7f, var(--bad));box-shadow:inset 0 1px 0 #ffffff4d, 0 .2em 0 var(--bad-deep), 0 .5em 1.2em -.2em #ff5a5f66}.chord-hint .cap{color:var(--hint);background:#ffc94d14;box-shadow:inset 0 0 0 1.5px #ffc94d99,0 .2em #ffc94d26}.chord-hint .cap-unknown{color:#ffc94d80;background:repeating-linear-gradient(-45deg,#ffc94d0d 0 6px,#0000 6px 12px);border:0;box-shadow:inset 0 0 0 1.5px #ffc94d4d}.chord-ghost .cap{opacity:.55;transform:translateY(.12em);box-shadow:inset 0 1px #ffffff1a,0 .08em #09090b}.chord-ghost .chord-part{animation:none}.kb-scroll{scrollbar-width:thin;padding-bottom:4px;overflow-x:auto;container-type:inline-size}.kb{--kbw:max(560px, 100cqw);--q:calc(var(--kbw) / 78);column-gap:calc(var(--q) * 2);width:var(--kbw);padding:calc(var(--q) * 2);border-radius:calc(var(--q) * 1.8);box-shadow:inset 0 1px 0 #ffffff0f, inset 0 0 0 1px var(--line), 0 40px 80px -40px #000c;-webkit-user-select:none;user-select:none;background:linear-gradient(#ffffff08,#0000 40%),linear-gradient(#19191d,#111114);grid-template-columns:60fr 12fr;display:grid}.kb-main,.kb-nav{gap:calc(var(--q) * .5);align-content:start;display:grid}.kb-row{column-gap:calc(var(--q) * .5);height:calc(var(--q) * 3.55);grid-template-columns:repeat(60,1fr);display:grid}.kb-nav .kb-row{grid-template-columns:repeat(12,1fr)}.kb-frow{margin-bottom:calc(var(--q) * .9)}.kb-key{justify-content:center;align-items:center;gap:calc(var(--q) * .1);min-width:0;padding:0 calc(var(--q) * .5) calc(var(--q) * .3);border-radius:calc(var(--q) * .65);font-family:var(--font-mono);font-size:calc(var(--q) * 1.02);color:var(--ink-2);box-shadow:inset 0 1px 0 #ffffff17, inset 0 calc(var(--q) * -.28) 0 #00000040, 0 calc(var(--q) * .32) 0 #08080a;transition:transform 80ms var(--ease-out), box-shadow 80ms var(--ease-out), background .15s, color .15s;background:linear-gradient(#2e2e35 0%,#26262c 100%);border:0;flex-direction:column;font-weight:500;line-height:1;display:flex;position:relative}.kb-wide{padding-left:calc(var(--q) * .9);font-size:calc(var(--q) * .92);align-items:flex-start}.kb-mod{color:var(--muted);background:linear-gradient(#24242a 0%,#1d1d22 100%)}.kb-accent{color:var(--accent)}.kb-dead{opacity:.35}.kb-gap{pointer-events:none}.kb-sub{color:var(--faint);font-size:.78em}.kb-legend{white-space:nowrap;text-overflow:clip;max-width:100%;overflow:hidden}.kb-interactive .kb-key:not(.kb-dead){cursor:pointer}.kb-interactive .kb-key:not(.kb-dead):hover{color:var(--ink);background:linear-gradient(#3a3a42,#2e2e35)}.kb-key.is-held,.kb-interactive .kb-key:active{transform:translateY(calc(var(--q) * .26));color:var(--ink);box-shadow:inset 0 1px 0 #ffffff1f, 0 calc(var(--q) * .06) 0 #08080a;background:linear-gradient(#45454e,#393941)}.kb-key.is-selected{transform:translateY(calc(var(--q) * .18));color:var(--accent-ink);background:linear-gradient(180deg, #ff9455, var(--accent));box-shadow:inset 0 1px 0 #ffffff59, 0 calc(var(--q) * .14) 0 var(--accent-deep), 0 0 calc(var(--q) * 2) #ff6b1f73}.kb-key.is-selected .kb-sub{color:#1b0c0399}.kb-key.is-hint{color:var(--hint);box-shadow:inset 0 0 0 1.5px #ffc94db3, 0 calc(var(--q) * .32) 0 #08080a, 0 0 calc(var(--q) * 1.6) #ffc94d40;background:linear-gradient(#3a3222,#2b261b);animation:1.6s ease-in-out infinite hint-glow}.kb-key.is-answer{color:var(--good);box-shadow:inset 0 0 0 1.5px #46e09bbf, 0 calc(var(--q) * .32) 0 #08080a, 0 0 calc(var(--q) * 1.8) #46e09b4d;background:linear-gradient(#1f3a2d,#183026)}.kb-key.is-correct{transform:translateY(calc(var(--q) * .18));color:#04140c;background:linear-gradient(180deg, #6ff0b6, var(--good));box-shadow:inset 0 1px 0 #fff6, 0 calc(var(--q) * .14) 0 var(--good-deep), 0 0 calc(var(--q) * 2.2) #46e09b80}.kb-key.is-wrong{transform:translateY(calc(var(--q) * .18));color:#fff;background:linear-gradient(180deg, #ff7b7f, var(--bad));box-shadow:inset 0 1px 0 #ffffff4d, 0 calc(var(--q) * .14) 0 var(--bad-deep), 0 0 calc(var(--q) * 2) #ff5a5f73}.kb-key.is-correct .kb-sub,.kb-key.is-wrong .kb-sub{color:inherit;opacity:.6}.site-shell{max-width:1240px;margin:0 auto;padding:0 24px 96px}.site-header{z-index:30;-webkit-backdrop-filter:blur(14px)saturate(1.3);backdrop-filter:blur(14px)saturate(1.3);border-bottom:1px solid var(--line);background:linear-gradient(#0c0c0eeb,#0c0c0ebf);align-items:center;gap:28px;height:76px;margin:0 -24px;padding:0 24px;display:flex;position:sticky;top:0}.brand{font-family:var(--font-display);letter-spacing:-.03em;align-items:center;gap:11px;font-size:21px;font-weight:800;display:inline-flex}.brand-cap{width:34px;height:34px;font-family:var(--font-mono);color:var(--accent-ink);background:linear-gradient(180deg, #ff9455, var(--accent));box-shadow:inset 0 1px 0 #ffffff73, inset 0 -3px 0 #00000024, 0 3px 0 var(--accent-deep);transition:transform .15s var(--ease-spring);border-radius:9px;place-items:center;font-size:17px;font-weight:700;display:grid}.brand:hover .brand-cap{transform:translateY(2px)rotate(-4deg)}.site-nav{gap:4px;display:flex}.site-nav a{color:var(--muted);border-radius:10px;padding:8px 14px;font-weight:500;transition:color .2s,background .2s}.site-nav a:hover{color:var(--ink)}.site-nav a[aria-current=page]{color:var(--ink);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line)}.player-chip{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);font-family:var(--font-mono);border-radius:999px;align-items:center;gap:4px;margin-left:auto;padding:4px;font-size:12px;font-weight:500;display:flex}.player-chip>span{border-radius:999px;padding:5px 10px}.chip-level{color:var(--accent-ink);background:var(--accent);font-weight:700}.chip-xp{color:var(--ink-2)}.chip-streak{color:var(--accent-2);background:#ffa94d1a}.site-footer{border-top:1px solid var(--line);color:var(--muted);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-top:96px;padding-top:28px;font-size:14px;display:flex}.footer-credit{color:var(--ink);font-weight:600}.site-footer a:not(.brand):hover{color:var(--accent-2)}.hero{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:center;gap:56px;padding:72px 0 56px;display:grid}.hero-copy{animation:rise .7s var(--ease-out) both;justify-items:start;gap:26px;display:grid}.hero-title{font-family:var(--font-display);letter-spacing:-.045em;font-size:clamp(48px,6.6vw,92px);font-weight:800;line-height:.93}.hero-copy .lede{max-width:520px}.hero-actions{flex-wrap:wrap;gap:12px;margin-top:6px;display:flex}.hero-facts{gap:32px;margin:10px 0 0;display:flex}.hero-facts div{display:grid}.hero-facts dt{font-family:var(--font-display);letter-spacing:-.03em;font-size:30px;font-weight:800}.hero-facts dd{color:var(--muted);margin:0;font-size:13px}.showcase{border-radius:var(--radius-lg);box-shadow:inset 0 0 0 1px var(--line-2), var(--shadow);animation:rise .8s .1s var(--ease-out) both;background:radial-gradient(500px 220px at 50% 0,#ff6b1f1f,#0000 70%),linear-gradient(#17171b,#121215);gap:18px;padding:22px;display:grid;position:relative}.showcase-top{font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;justify-content:space-between;gap:12px;font-size:12px;display:flex}.showcase-label{color:var(--accent-2)}.showcase-try{color:var(--faint)}.showcase .kb{--kbw:100cqw}.showcase-chord{text-align:center;justify-items:center;gap:16px;min-height:150px;padding:18px 0 8px;display:grid}.showcase-chord p{font-family:var(--font-display);letter-spacing:-.02em;color:var(--ink);animation:fade-up .4s var(--ease-out) both;font-size:24px;font-weight:700}.progress-strip{border-radius:var(--radius-lg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);grid-template-columns:minmax(260px,1.5fr) repeat(4,minmax(0,1fr));align-items:center;gap:8px;padding:10px;display:grid}.progress-strip>*{padding:14px 18px}.level-block{align-items:center;gap:16px;display:flex}.level-block>div:last-child{display:grid}.level-block strong{font-family:var(--font-display);letter-spacing:-.02em;font-size:22px}.level-block small{color:var(--muted);font-size:13px}.level-ring{--p:0;background:radial-gradient(closest-side, var(--surface) 78%, transparent 80%), conic-gradient(var(--accent) calc(var(--p) * 1turn), var(--surface-3) 0);border-radius:50%;flex-shrink:0;place-items:center;width:64px;height:64px;display:grid}.level-ring span{font-family:var(--font-display);font-size:24px;font-weight:800}.stat{border-left:1px solid var(--line);display:grid}.stat strong{font-family:var(--font-display);letter-spacing:-.03em;font-size:30px;font-weight:800;line-height:1.1}.stat strong small{color:var(--faint);font-size:15px;font-weight:600}.stat span{color:var(--muted);font-size:13px}.save-note{color:var(--faint);grid-column:1/-1;font-size:12px;padding:0 18px 6px!important}.section{margin-top:80px}.section-head{flex-wrap:wrap;align-items:flex-end;gap:18px;margin-bottom:24px;display:flex}.section-head>div{flex:320px}.section-head h2{font-family:var(--font-display);letter-spacing:-.035em;font-size:clamp(30px,3.6vw,42px);font-weight:800;line-height:1.05}.section-head p{color:var(--muted);margin-top:6px}.step{width:44px;height:44px;font-family:var(--font-mono);color:var(--accent);background:#ff6b1f1a;border-radius:12px;align-self:flex-start;place-items:center;font-size:14px;font-weight:700;display:grid;box-shadow:inset 0 0 0 1px #ff6b1f40}.mode-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;display:grid}.mode-card{border-radius:var(--radius);text-align:left;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);transition:transform .2s var(--ease-out), box-shadow .2s, background .2s;border:0;align-content:start;gap:8px;padding:22px;display:grid;position:relative}.mode-card:hover{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line-2), 0 20px 40px -24px #000c;transform:translateY(-3px)}.mode-card.is-selected{background:radial-gradient(260px 140px at 0% 0%, #ff6b1f29, transparent 70%), var(--surface-2);box-shadow:inset 0 0 0 1.5px var(--accent), 0 20px 50px -24px #ff6b1f73}.mode-cap{justify-self:start;margin-bottom:10px;font-size:20px}.mode-card.is-selected .mode-cap{color:var(--accent-ink);background:linear-gradient(180deg, #ff9455, var(--accent));box-shadow:inset 0 1px 0 #fff6, 0 .2em 0 var(--accent-deep)}.mode-name{font-family:var(--font-display);letter-spacing:-.02em;align-items:center;gap:8px;font-size:22px;font-weight:700;display:flex}.mode-tag{font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--accent-ink);background:var(--accent-2);border-radius:999px;padding:3px 8px;font-size:10px;font-weight:700}.mode-desc{color:var(--ink-2);font-size:15px}.mode-detail{color:var(--muted);font-size:13px}.mode-best{border-top:1px dashed var(--line-2);font-family:var(--font-mono);color:var(--faint);margin-top:8px;padding-top:12px;font-size:12px}.mode-card.is-selected .mode-best{color:var(--accent-2)}.segmented{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);border-radius:12px;gap:2px;padding:4px;display:inline-flex}.segmented button{height:36px;color:var(--muted);background:0 0;border:0;border-radius:9px;padding:0 16px;font-size:14px;font-weight:600;transition:color .2s,background .2s}.segmented button:hover:not(:disabled){color:var(--ink)}.segmented button.is-selected{color:var(--ink);background:var(--surface-3);box-shadow:inset 0 1px #ffffff14,0 2px #08080a}.segmented button:disabled{opacity:.4}.category-grid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px;display:grid}.category-card{text-align:left;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);transition:background .2s, box-shadow .2s, transform .2s var(--ease-out);border:0;border-radius:16px;align-items:center;gap:14px;padding:16px 16px 20px;display:flex;position:relative;overflow:hidden}.category-card:hover:not(:disabled){background:var(--surface-2);transform:translateY(-2px)}.category-card.is-selected{background:radial-gradient(220px 120px at 0% 50%, color-mix(in srgb, var(--tone) 14%, transparent), transparent 70%), var(--surface-2);box-shadow:inset 0 0 0 1.5px var(--tone)}.category-card:disabled:not(.is-selected){opacity:.4}.category-icon{width:44px;height:44px;font-family:var(--font-mono);color:var(--tone);background:color-mix(in srgb, var(--tone) 12%, var(--surface-2));box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--tone) 25%, transparent), 0 3px 0 #08080a;border-radius:12px;flex-shrink:0;place-items:center;font-size:17px;font-weight:700;display:grid}.category-text{flex:1;min-width:0;display:grid}.category-name{font-weight:600}.category-detail{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.category-count{font-family:var(--font-mono);color:var(--faint);font-size:12px}.meter{background:var(--surface-3);border-radius:3px;height:3px;position:absolute;bottom:9px;left:16px;right:16px;overflow:hidden}.meter span{background:var(--tone,var(--accent));border-radius:inherit;height:100%;transition:width .6s var(--ease-out);display:block}.launch-bar{z-index:20;-webkit-backdrop-filter:blur(16px)saturate(1.4);backdrop-filter:blur(16px)saturate(1.4);box-shadow:inset 0 0 0 1px var(--line-2), 0 24px 60px -16px #000c;background:#1c1c21db;border-radius:20px;justify-content:space-between;align-items:center;gap:16px;margin-top:32px;padding:12px 12px 12px 18px;display:flex;position:sticky;bottom:18px}.launch-info{align-items:center;gap:14px;min-width:0;display:flex}.launch-info>span:last-child{min-width:0;display:grid}.launch-info strong{font-family:var(--font-display);letter-spacing:-.02em;font-size:19px}.launch-info small{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.trophy-grid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px;display:grid}.trophy{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);color:var(--faint);border-radius:16px;align-items:center;gap:14px;padding:16px;display:flex}.trophy>div{flex:1;min-width:0;display:grid}.trophy strong{color:var(--muted);font-weight:600}.trophy span{font-size:13px}.trophy-icon{background:var(--surface-2);width:46px;height:46px;box-shadow:inset 0 0 0 1px var(--line);filter:grayscale();opacity:.6;border-radius:50%;flex-shrink:0;place-items:center;font-size:20px;display:grid}.trophy-state{font-family:var(--font-mono);letter-spacing:.05em;text-transform:uppercase;font-size:11px!important}.trophy.is-earned{color:var(--ink-2);background:radial-gradient(200px 100px at 0% 50%, #ffa94d1a, transparent 70%), var(--surface);box-shadow:inset 0 0 0 1px #ffa94d4d}.trophy.is-earned strong{color:var(--ink)}.trophy.is-earned .trophy-icon{filter:none;opacity:1;color:var(--accent-ink);background:linear-gradient(180deg, #ffd27a, var(--accent-2));box-shadow:inset 0 1px #ffffff80,0 3px #a8641a,0 8px 22px -6px #ffa94d80}.trophy.is-earned .trophy-state{color:var(--accent-2)}.library-hero{gap:18px;max-width:760px;padding:64px 0 36px;display:grid}.library-hero h1{font-size:clamp(42px,5.6vw,72px)}.library-tools{z-index:20;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);background:#0c0c0ee0;flex-wrap:wrap;gap:10px;margin:0 -24px;padding:14px 24px;display:flex;position:sticky;top:76px}.search{background:var(--surface);height:46px;box-shadow:inset 0 0 0 1px var(--line-2);color:var(--muted);border-radius:12px;flex:320px;align-items:center;gap:10px;padding:0 10px 0 14px;transition:box-shadow .2s;display:flex}.search:focus-within{box-shadow:inset 0 0 0 1.5px var(--accent), 0 0 0 4px #ff6b1f1f}.search input{min-width:0;height:100%;color:var(--ink);background:0 0;border:0;outline:none;flex:1}.search input::placeholder{color:var(--faint)}.library-tools select{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23918b82' fill='none' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 14px center, var(--surface);height:46px;box-shadow:inset 0 0 0 1px var(--line-2);appearance:none;border:0;border-radius:12px;padding:0 36px 0 14px;font-size:14px}.library-count{color:var(--faint);font-family:var(--font-mono);letter-spacing:.05em;text-transform:uppercase;margin:18px 0 8px;font-size:12px}.library-group{border-radius:var(--radius-lg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);margin-top:28px;overflow:hidden}.library-group-head{background:linear-gradient(90deg, color-mix(in srgb, var(--tone) 8%, transparent), transparent 60%);border-bottom:1px solid var(--line);align-items:center;gap:14px;padding:18px 20px;display:flex}.library-group-head>div{flex:1;display:grid}.library-group-head h2{font-family:var(--font-display);letter-spacing:-.02em;font-size:22px}.library-group-head span:not(.category-icon){color:var(--muted);font-size:13px}.library-list{margin:0;padding:0;list-style:none}.library-list li{border-top:1px solid var(--line);grid-template-columns:10px minmax(0,1fr) auto minmax(180px,auto);align-items:center;gap:16px;padding:12px 20px;transition:background .15s;display:grid}.library-list li:first-child{border-top:0}.library-list li:hover{background:#ffffff05}.library-action{font-weight:500;display:grid}.library-action small{color:var(--muted);font-size:13px;font-weight:400}.library-chords{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;display:flex}.library-chord{align-items:center;gap:8px;display:inline-flex}.or{color:var(--faint);font-size:12px}.mastery-dot{background:var(--surface-3);border-radius:50%;width:10px;height:10px}.mastery-learning{background:var(--accent-2);box-shadow:0 0 10px #ffa94d80}.mastery-mastered{background:var(--good);box-shadow:0 0 10px #46e09b80}.empty{color:var(--muted);justify-items:center;gap:20px;padding:80px 0;display:grid}.page-loading{min-height:100vh;color:var(--muted);font-family:var(--font-mono);place-items:center;display:grid}.game-shell{flex-direction:column;min-height:100vh;display:flex}.hud{z-index:30;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);background:#0c0c0ee0;grid-template-columns:auto 1fr auto;align-items:center;gap:24px;height:72px;padding:0 24px;display:grid;position:sticky;top:0}.hud-mode{align-items:center;gap:12px;min-width:0;display:flex}.hud-mode>span:last-child{min-width:0;display:grid}.hud-mode strong{font-family:var(--font-display);letter-spacing:-.01em;font-size:17px}.hud-mode small{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.hud-mode-icon{width:34px;height:34px;color:var(--accent);background:#ff6b1f1a;border-radius:10px;place-items:center;font-weight:700;display:grid;box-shadow:inset 0 0 0 1px #ff6b1f40}.hud-stats{align-items:center;gap:10px;display:flex}.hud-score,.hud-timer,.hud-lives{background:var(--surface);height:40px;box-shadow:inset 0 0 0 1px var(--line);font-family:var(--font-mono);font-variant-numeric:tabular-nums;border-radius:11px;align-items:baseline;gap:4px;padding:0 14px;font-size:18px;font-weight:700;line-height:40px;display:inline-flex}.hud-score small,.hud-timer small{color:var(--muted);font-size:11px;font-weight:500}.hud-score-value{animation:bump .35s var(--ease-spring);display:inline-block}.hud-timer.urgent{color:var(--bad);animation:1s ease-in-out infinite pulse;box-shadow:inset 0 0 0 1px #ff5a5f66}.hud-lives{color:var(--bad);letter-spacing:.08em;gap:3px}.hud-lives .lost{color:var(--surface-3)}.round-bar{background:var(--surface);height:3px}.round-bar span{background:linear-gradient(90deg, var(--accent), var(--accent-2));height:100%;transition:width .1s linear;display:block;box-shadow:0 0 14px #ff6b1f99}.round-bar span.urgent{background:var(--bad)}.round-bar-idle{background:0 0}.round-steps{gap:5px;width:100%;max-width:1320px;margin:0 auto;padding:14px 24px 0;display:flex}.round-steps span{background:var(--surface-3);border-radius:5px;flex:1;height:5px;transition:background .3s}.round-steps .step-good{background:var(--good)}.round-steps .step-assisted{background:var(--hint)}.round-steps .step-bad{background:var(--bad)}.round-steps .step-current{background:var(--ink-2);animation:1.4s ease-in-out infinite pulse}.arena{grid-template-columns:minmax(0,1fr) 300px;align-items:start;gap:20px;width:100%;max-width:1320px;margin:0 auto;padding:18px 24px 40px;display:grid}.stage{border-radius:var(--radius-lg);background:radial-gradient(700px 260px at 50% -40px, #ffffff09, transparent 70%), var(--surface);box-shadow:inset 0 0 0 1px var(--line), var(--shadow);transition:box-shadow .3s;position:relative;overflow:hidden}.play-stage.is-good{box-shadow:inset 0 0 0 1.5px #46e09b73, 0 0 60px -20px #46e09b59, var(--shadow)}.play-stage.is-bad{box-shadow:inset 0 0 0 1.5px #ff5a5f73, 0 0 60px -20px #ff5a5f4d, var(--shadow);animation:shake .4s var(--ease-out)}.play-card{padding:24px 28px 22px;position:relative}.prompt-meta{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.prompt-count{font-family:var(--font-mono);color:var(--faint);margin-left:auto;font-size:13px}.prompt{text-align:center;animation:fade-up .4s var(--ease-out) both;justify-items:center;gap:14px;padding:30px 0 6px;display:grid}.kicker{align-items:center;gap:6px;display:inline-flex}.lock{color:var(--accent)}.prompt-action{max-width:820px;font-family:var(--font-display);letter-spacing:-.035em;text-wrap:balance;font-size:clamp(30px,4.2vw,54px);font-weight:800;line-height:1.02}.answer-slot{place-items:center;min-height:88px;margin-top:6px;display:grid}.slot-note{color:var(--faint);font-family:var(--font-mono);align-items:center;gap:10px;font-size:14px;display:inline-flex}.caret{background:var(--accent);width:2px;height:20px;animation:1s steps(2,end) infinite blink}.decode-chord{padding:8px 0 2px}.decode-app{color:var(--muted);font-size:14px}.choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:100%;max-width:760px;margin-top:14px;display:grid}.choice{text-align:left;background:var(--surface-2);min-height:64px;box-shadow:inset 0 0 0 1px var(--line-2), 0 3px 0 #08080a;transition:transform .12s var(--ease-out), background .2s, box-shadow .2s, opacity .2s;border:0;border-radius:14px;align-items:center;gap:14px;padding:12px 16px;font-size:15px;font-weight:500;display:flex}.choice:hover:not(:disabled){background:var(--surface-3);box-shadow:inset 0 0 0 1.5px var(--accent), 0 3px 0 #08080a}.choice:active:not(:disabled){transform:translateY(2px)}.choice-num{width:28px;height:28px;font-family:var(--font-mono);color:var(--muted);background:var(--surface-3);border-radius:8px;flex-shrink:0;place-items:center;font-size:13px;font-weight:700;display:grid;box-shadow:0 2px #08080a}.choice-right{color:#04140c;background:linear-gradient(180deg, #6ff0b6, var(--good));box-shadow:0 3px 0 var(--good-deep)}.choice-right .choice-num{color:var(--good-deep);background:#ffffff80}.choice-wrong{color:#fff;background:linear-gradient(180deg, #ff7b7f, var(--bad));box-shadow:0 3px 0 var(--bad-deep)}.choice-wrong .choice-num{color:var(--bad-deep);background:#ffffff80}.choice-dim{opacity:.4}.choice-hidden{opacity:.18;text-decoration:line-through}.score-pop{font-family:var(--font-display);letter-spacing:-.03em;color:var(--good);text-shadow:0 0 30px #46e09b99;pointer-events:none;animation:pop 1.1s var(--ease-out) both;font-size:40px;font-weight:800;position:absolute;top:66px;right:30px}.score-pop-miss{color:var(--bad);text-shadow:0 0 30px #ff5a5f80;font-size:28px}.feedback{max-width:760px;animation:fade-up .3s var(--ease-out) both;border-radius:16px;align-items:center;gap:14px;margin:10px auto 0;padding:14px 16px;display:flex}.feedback-good{background:#46e09b14;box-shadow:inset 0 0 0 1px #46e09b40}.feedback-bad{background:#ff5a5f14;box-shadow:inset 0 0 0 1px #ff5a5f40}.feedback-icon{border-radius:50%;flex-shrink:0;place-items:center;width:36px;height:36px;font-size:18px;font-weight:800;display:grid}.feedback-good .feedback-icon{color:#04140c;background:var(--good)}.feedback-bad .feedback-icon{color:#fff;background:var(--bad)}.feedback-body{flex-wrap:wrap;flex:1;align-items:center;gap:8px 12px;min-width:0;display:flex}.also{color:var(--muted);align-items:center;gap:8px;font-size:13px;display:inline-flex}.feedback-tags{flex-wrap:wrap;justify-content:flex-end;gap:6px;display:flex}.tag{font-family:var(--font-mono);color:var(--muted);background:#ffffff0d;border-radius:8px;padding:4px 9px;font-size:12px;font-weight:600}.tag-speed{color:var(--hint);background:#ffc94d1a}.tag-combo{color:var(--accent-ink);background:var(--accent)}.tip{color:var(--ink-2);text-align:center;justify-content:center;align-items:baseline;gap:10px;margin-top:14px;font-size:15px;display:flex}.tip span{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--accent-2);font-size:11px}.play-controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin-top:22px;display:flex}.key-hint-end{margin-left:6px}.board{padding:0 20px 22px}.pause-overlay{z-index:10;text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0c0c0eb8;place-content:center;justify-items:center;gap:16px;padding:24px;animation:.2s both fade-in;display:grid;position:absolute;inset:0}.pause-overlay h2{font-size:48px}.pause-overlay p{color:var(--muted)}.pause-links{gap:20px;display:flex}.ready-stage,.summary-stage{text-align:center;animation:fade-up .45s var(--ease-out) both;justify-items:center;gap:20px;padding:64px 32px 48px;display:grid}.ready-emblem{margin-bottom:12px;animation:4s ease-in-out infinite float}.ready-stage h1{max-width:700px;font-size:clamp(38px,5vw,64px)}.ready-stage .lede{max-width:560px}.ready-rules{text-align:left;gap:10px;margin:8px 0 14px;display:grid}.ready-rules div{color:var(--ink-2);align-items:center;gap:14px;font-size:15px;display:flex}.ready-rules .cap{flex-shrink:0;min-width:40px}.rail{gap:14px;display:grid;position:sticky;top:92px}.rail-card{border-radius:var(--radius);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);padding:18px}.combo{gap:10px;transition:background .4s,box-shadow .4s;display:grid}.combo-value{align-items:baseline;gap:12px;display:flex}.combo-value strong{font-family:var(--font-display);letter-spacing:-.04em;font-size:54px;font-weight:800;line-height:1}.combo-value span{color:var(--muted);font-size:14px}.combo small{color:var(--faint);font-size:13px}.combo-pips{gap:6px;display:flex}.combo-pips span{background:var(--surface-3);border-radius:4px;flex:1;height:8px;transition:background .3s}.combo-pips .lit{background:linear-gradient(90deg, var(--accent), var(--accent-2));box-shadow:0 0 12px #ff6b1f80}.combo-hot{background:radial-gradient(260px 160px at 100% 0%, #ff6b1f40, transparent 70%), var(--surface);box-shadow:inset 0 0 0 1.5px #ff6b1f80,0 0 50px -20px #ff6b1f80}.combo-hot strong{background:linear-gradient(180deg, #ffd27a, var(--accent));color:#0000;-webkit-background-clip:text;background-clip:text}.rail-stats{text-align:center;grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.rail-stats div{display:grid}.rail-stats strong{font-family:var(--font-display);letter-spacing:-.02em;font-size:24px;font-weight:800}.rail-stats span{color:var(--muted);font-size:12px}.recent ol,.summary-list ol{gap:2px;margin:10px 0 0;padding:0;list-style:none;display:grid}.recent li,.summary-list li{border-top:1px solid var(--line);animation:fade-up .3s var(--ease-out) both;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:10px;padding:7px 0;font-size:13px;display:grid}.recent li:first-child{border-top:0}.recent-mark{text-align:center;font-weight:800}.good .recent-mark{color:var(--good)}.bad .recent-mark{color:var(--bad)}.assisted .recent-mark{color:var(--hint)}.recent-action{color:var(--ink-2);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.recent .chord-sm{font-size:9.5px}.switch{color:var(--ink-2);cursor:pointer;align-items:center;gap:12px;padding:4px;font-size:14px;display:flex}.switch input{opacity:0;pointer-events:none;position:absolute}.switch-track{background:var(--surface-3);width:40px;height:24px;box-shadow:inset 0 0 0 1px var(--line-2);border-radius:999px;transition:background .2s;position:relative}.switch-track:after{content:"";background:var(--ink-2);width:18px;height:18px;transition:transform .2s var(--ease-spring), background .2s;border-radius:50%;position:absolute;top:3px;left:3px;box-shadow:0 2px 4px #0006}.switch input:checked+.switch-track{background:var(--accent)}.switch input:checked+.switch-track:after{background:#fff;transform:translate(16px)}.switch input:focus-visible+.switch-track{outline:2px solid var(--accent);outline-offset:3px}.rail-note{color:var(--faint);padding:0 4px;font-size:12px}.summary-stage{text-align:left;justify-items:stretch;padding:44px 40px}.summary-head{align-items:center;gap:32px;display:flex}.summary-head>div:last-child{justify-items:start;gap:12px;display:grid}.summary-head h1{font-size:clamp(38px,5vw,60px)}.grade{--grade:var(--accent);width:150px;height:150px;animation:pop-in .6s var(--ease-spring) both;flex-shrink:0;place-items:center;display:grid;position:relative}.grade span{font-family:var(--font-display);color:var(--grade);text-shadow:0 0 40px color-mix(in srgb, var(--grade) 50%, transparent);font-size:72px;font-weight:800}.grade svg{position:absolute;inset:0;transform:rotate(-90deg)}.grade circle{fill:none;stroke-width:6px}.grade-track{stroke:var(--surface-3)}.grade-fill{stroke:var(--grade);stroke-linecap:round;stroke-dasharray:283;transition:stroke-dashoffset 1s var(--ease-out)}.grade-S{--grade:#ffd27a}.grade-A{--grade:var(--good)}.grade-B{--grade:#5aa9ff}.grade-C{--grade:var(--accent-2)}.grade-D{--grade:var(--bad)}.badge-best{font-family:var(--font-mono);letter-spacing:.05em;text-transform:uppercase;color:var(--accent-ink);background:linear-gradient(90deg, #ffd27a, var(--accent-2));animation:pop-in .5s .3s var(--ease-spring) both;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:700}.summary-stats{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;display:grid}.summary-stats div{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line);border-radius:14px;padding:16px;display:grid}.summary-stats strong{font-family:var(--font-display);letter-spacing:-.03em;font-size:30px;font-weight:800}.summary-stats span{color:var(--muted);font-size:13px}.summary-list{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line);border-radius:16px;padding:18px}.summary-list li{grid-template-columns:18px minmax(0,1fr) 60px auto;padding:9px 0;font-size:14px}.summary-list li:first-child{border-top:0}.summary-points{font-family:var(--font-mono);color:var(--muted);text-align:right;font-size:13px}.summary-actions{flex-wrap:wrap;gap:12px;display:flex}@keyframes rise{0%{opacity:0;transform:translateY(24px)}}@keyframes fade-up{0%{opacity:0;transform:translateY(10px)}}@keyframes fade-in{0%{opacity:0}}@keyframes cap-in{0%{opacity:0;transform:translateY(-.5em)scale(.85)}}@keyframes pop{0%{opacity:0;transform:translateY(10px)scale(.6)}20%{opacity:1;transform:translateY(0)scale(1.1)}70%{opacity:1;transform:translateY(-14px)scale(1)}to{opacity:0;transform:translateY(-30px)scale(.95)}}@keyframes pop-in{0%{opacity:0;transform:scale(.6)}}@keyframes bump{40%{color:var(--accent-2);transform:scale(1.18)}}@keyframes pulse{50%{opacity:.55}}@keyframes blink{50%{opacity:0}}@keyframes hint-glow{50%{box-shadow:inset 0 0 0 1.5px #ffc94de6, 0 calc(var(--q) * .32) 0 #08080a, 0 0 calc(var(--q) * 2.6) #ffc94d73}}@keyframes shake{20%{transform:translate(-6px)}40%{transform:translate(5px)}60%{transform:translate(-3px)}80%{transform:translate(2px)}}@keyframes float{50%{transform:translateY(-8px)rotate(-2deg)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}@media (max-width:1080px){.arena{grid-template-columns:1fr}.rail{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));align-items:start;position:static}.hero{grid-template-columns:1fr;gap:40px;padding-top:48px}.progress-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.level-block{grid-column:1/-1}.stat:nth-of-type(odd){border-left:0}.summary-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width:720px){.site-shell{padding:0 16px 80px}.site-header,.library-tools{gap:14px;margin:0 -16px;padding-left:16px;padding-right:16px}.brand-word,.chip-xp{display:none}.hud{grid-template-columns:auto minmax(0,1fr);gap:10px 14px;height:auto;padding:10px 16px}.hud .brand{display:none}.hud-stats{flex-wrap:wrap;grid-column:1/-1;justify-content:flex-end}.hud-mode{grid-column:1/-1}.round-steps{padding:12px 16px 0}.arena{padding:14px 16px 32px}.play-card{padding:18px 16px}.board{padding:0 12px 16px}.choices{grid-template-columns:1fr}.feedback{flex-wrap:wrap}.score-pop{font-size:30px;top:52px;right:16px}.summary-stage{padding:32px 18px}.summary-head{flex-direction:column;align-items:flex-start;gap:18px}.grade{width:110px;height:110px}.grade span{font-size:52px}.summary-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.summary-list li{grid-template-columns:18px minmax(0,1fr) auto}.summary-list .chord{grid-column:2/-1;justify-content:flex-start}.ready-stage{padding:44px 18px 36px}.launch-bar{padding:10px 10px 10px 14px;bottom:10px}.launch-info .cap{display:none}.library-list li{grid-template-columns:10px minmax(0,1fr) auto;gap:8px 12px}.library-chords{grid-column:2/-1;justify-content:flex-start}.library-group-head .button{display:none}.hero-facts{gap:22px}.section{margin-top:56px}.progress-strip>*{padding:12px}}
