:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-0:#1e2024;--bg-1:#262930;--bg-2:#262930;--bg-3:#33363d;--line-1:#33363d;--line-2:#a0a5af;--ink-0:#e6e6e3;--ink-1:#a0a5af;--ink-2:#8b8f98;--accent:#e9c46a;--accent-text:#e9c46a;--focus:#e9c46a;--accent-ink:#1e2024;--accent-soft:#e9c46a29;--play-field:#16181c;--hand-left:#45a9ff;--hand-right:#3dd68c;--hand-unknown:#a0a5af;--hand-ink:#16181c;--fb-perfect:#e6e6e3;--fb-perfect-ink:#e6e6e3;--fb-timing:#e69f00;--fb-early:#e46fbf;--fb-late:#e8873a;--fb-timing-ink:#f5b335;--fb-wrong:#d55e00;--fb-wrong-ink:#ff8a4c;--fb-missed:#6e7689;--fb-missed-ink:#a9b1c3;--fb-extra:#a0a5af;--fb-extra-ink:#a0a5af;--heat-ink:#0b0c0e;--band-s:#e9c46a;--band-a:#e9c46a;--band-b:#e9c46a;--band-c:#e9c46a;--band-d:#e9c46a;--health:#e9c46a;--health-low:#ff8a4c;--danger:#ff8a4c;--success:#7cc8f2;--font-display:"JetBrains Mono", ui-monospace, Menlo, monospace;--font-body:"JetBrains Mono", ui-monospace, Menlo, monospace;--e-0:none;--e-1:0 1px 0 #ffffff0a inset, 0 0 0 1px var(--line-1);--e-2:0 8px 24px #00000073, 0 0 0 1px var(--line-2);--e-glow:0 0 0 4px var(--accent-soft), 0 0 32px #7c4dff59;--score-paper:#fbf9f4;--score-ink:#242321;--score-line:#777267;--score-playhead:#1f4fbf;--score-history:#f0ece3;--score-perfect:#1a1a1a;--score-timing:#b8860b;--score-wrong:#c03000;--score-missed:#4b5368;--score-extra:#686255;--key-white:#efede7;--key-black:#16181c;--key-line:#9a9a94;--key-bed:#2a2c31;--font-mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--t-hero:120px;--t-hero-line:1;--t-hero-tracking:-.04em;--t-hero-weight:700;--t-xxl:80px;--t-xxl-line:1;--t-xxl-tracking:-.03em;--t-xxl-weight:700;--t-xl:56px;--t-xl-line:1.05;--t-xl-tracking:-.02em;--t-xl-weight:700;--t-lg:40px;--t-lg-line:1.1;--t-lg-tracking:-.02em;--t-lg-weight:700;--t-md:32px;--t-md-line:1.15;--t-md-tracking:-.01em;--t-md-weight:500;--t-h3:24px;--t-h3-line:1.2;--t-h3-tracking:0;--t-h3-weight:500;--t-h4:20px;--t-h4-line:1.3;--t-h4-tracking:0;--t-h4-weight:600;--t-body:16px;--t-body-line:1.5;--t-body-tracking:0;--t-body-weight:400;--t-sm:14px;--t-sm-line:1.45;--t-sm-tracking:0;--t-sm-weight:400;--t-xs:12px;--t-xs-line:1.4;--t-xs-tracking:.04em;--t-xs-weight:500;--t-mono:14px;--t-mono-line:1.4;--t-mono-tracking:0;--t-mono-weight:400;--s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:20px;--s-6:24px;--s-8:32px;--s-10:40px;--s-12:48px;--s-16:64px;--s-24:96px;--r-sm:6px;--r-md:10px;--r-lg:16px;--r-xl:24px;--r-pill:999px;--r-note:4px;--d-1:80ms;--d-2:.16s;--d-3:.24s;--d-4:.4s;--d-5:.8s;--ease-snap:cubic-bezier(.2, .8, .2, 1);--ease-out:cubic-bezier(0, 0, .2, 1);--ease-overshoot:cubic-bezier(.34, 1.56, .64, 1)}[data-reduced-motion=on]{--d-4:var(--d-3);--d-5:var(--d-3);--ease-overshoot:var(--ease-out)}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg-0);color:var(--ink-0);font-family:var(--font-body);-webkit-font-smoothing:antialiased;margin:0;font-size:15px;line-height:1.5}button,input,select{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:0;padding:0}a{color:inherit}:focus{outline:none}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}::selection{background:var(--accent-soft)}.shell{grid-template-rows:auto 1fr auto;min-height:100%;display:grid}.nav{border-bottom:1px solid var(--line-1);justify-content:space-between;align-items:center;height:56px;padding:0 40px;display:flex}.nav .logo{font-family:var(--font-display);color:var(--accent);letter-spacing:-.02em;font-size:22px;font-weight:800}.nav .logo .mark{vertical-align:-.04em;width:.96em;height:.72em;fill:var(--ink-0);margin-right:.36em}.nav .logo .release{color:var(--ink-2);letter-spacing:0;vertical-align:2px;font-size:13px;font-weight:500}.nav nav{gap:28px;display:flex}.nav nav a,.nav nav button{color:var(--ink-1);font-size:22px;text-decoration:none}.nav nav a.on,.nav nav button.on{color:var(--ink-0)}.nav nav button[data-focused],.nav nav a:focus-visible,.nav nav button:focus-visible{color:var(--ink-0);text-underline-offset:6px;text-decoration:underline;-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent)}.page{align-content:start;gap:22px;width:100%;max-width:1120px;margin:0 auto;padding:28px 40px 40px;display:grid}.page.centred{text-align:center;align-content:center;justify-items:center;min-height:60vh}.page.narrow{max-width:720px}.chint{border-top:1px solid var(--line-1);color:var(--ink-1);padding:14px 40px 22px;font-size:17px;line-height:1.7}.chint b{color:var(--ink-0);font-weight:700}.chint .keys{flex-wrap:wrap;gap:22px;display:flex}.chint .alt{color:var(--ink-1)}.eyebrow{color:var(--ink-1);font-size:17px}.title{font-family:var(--font-display);letter-spacing:-.02em;margin:0;font-size:40px;font-weight:700;line-height:1.1}.title.xl{font-size:48px}.h2{font-family:var(--font-display);margin:0;font-size:26px;font-weight:700}.big{font-family:var(--font-display);letter-spacing:-.03em;font-variant-numeric:tabular-nums;font-size:88px;font-weight:800;line-height:1}.band{font-family:var(--font-display);letter-spacing:-.04em;color:var(--accent);font-size:120px;font-weight:800;line-height:.9}.dim{color:var(--ink-1)}.muted{color:var(--ink-1);margin:0}.lbl{color:var(--ink-1);font-size:15px}.small{font-size:13px}.tabular{font-variant-numeric:tabular-nums}.lede{color:var(--ink-1);max-width:40ch;margin:0;font-size:22px;line-height:1.5}p{margin:0}.row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.btn{white-space:nowrap;height:60px;color:var(--ink-0);border:1px solid #0000;border-radius:10px;align-items:center;gap:10px;padding:0 30px;font-size:22px;font-weight:700;display:inline-flex}.btn.primary{background:var(--accent);color:var(--accent-ink)}.btn.secondary{border-color:var(--line-2)}.btn.sm{border-radius:8px;height:44px;padding:0 18px;font-size:17px}.btn.link{height:auto;color:var(--ink-1);text-underline-offset:6px;border:0;padding:0;font-weight:400;text-decoration:underline}.btn:disabled{opacity:.4;cursor:default}.btn .kbd{border:1px solid var(--line-2);color:var(--ink-1);border-radius:4px;padding:2px 8px;font-size:15px;font-weight:400}.btn.primary .kbd{color:var(--accent-ink);opacity:.7;border-color:#00000059}.btn:focus-visible,.btn[data-focused=true]{box-shadow:0 0 0 2px var(--bg-0), 0 0 0 4px var(--accent)}.btn.link:focus-visible,.btn.link[data-focused=true]{box-shadow:none;color:var(--ink-0);-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent)}.rows{display:grid}.line{border-bottom:1px solid var(--line-1);justify-content:space-between;align-items:baseline;gap:16px;padding:16px 0;font-size:22px;display:flex}.line .r{color:var(--ink-1);white-space:nowrap;align-items:baseline;gap:18px;display:flex}.line .r b{color:var(--ink-0);font-weight:700}.line[data-focused=true],.line:focus-visible{box-shadow:inset 3px 0 0 var(--accent);padding-left:14px}.line.clickable{cursor:pointer;text-align:left;width:100%}.line.clickable>span:first-child{text-wrap:balance;min-width:0}.line .meta{white-space:nowrap;text-overflow:ellipsis;font-size:18px;display:block;overflow:hidden}.facts>span+span:before{content:" · ";white-space:pre}.choices{align-items:baseline;gap:14px;display:flex}.choices .sep{color:var(--ink-2)}.choices button{color:var(--ink-1);font-size:22px}.choices button.on{color:var(--ink-0);font-weight:700}.choices button:disabled{color:var(--ink-2);cursor:default;text-decoration:line-through}.choices button:focus-visible{color:var(--ink-0);text-underline-offset:6px;text-decoration:underline;-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent)}.stepper{align-items:center;gap:12px;display:flex}.stepper button{border:1px solid var(--line-2);border-radius:8px;width:46px;height:46px;font-size:22px}.stepper button:focus-visible{box-shadow:0 0 0 2px var(--bg-0), 0 0 0 4px var(--accent)}.dot{background:var(--ink-2);vertical-align:middle;border-radius:50%;width:10px;height:10px;margin-right:8px;display:inline-block}.dot.on{background:var(--accent)}.dot.grey{background:var(--ink-2)}input.text{border:1px solid var(--line-2);background:var(--bg-0);width:100%;height:64px;color:var(--ink-0);border-radius:10px;padding:0 20px;font-size:22px}input.text:focus-visible{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}input.text::placeholder{color:var(--ink-2)}textarea.text{border:1px solid var(--line-2);background:var(--bg-0);width:100%;color:var(--ink-0);font:inherit;resize:vertical;border-radius:10px;padding:16px 20px;font-size:20px;line-height:1.5}textarea.text:focus-visible,textarea.text[data-focused=true]{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}textarea.text::placeholder{color:var(--ink-2)}input.text.feedback-email{width:min(360px,100%);height:48px;font-size:18px}.feedback-attach{cursor:pointer}.feedback-attach input[type=checkbox]{vertical-align:-3px;width:18px;height:18px;accent-color:var(--accent);margin-right:8px}.feedback-promise{max-width:52ch}.feedback-trap{opacity:0;width:1px;height:1px;position:absolute;left:-10000px}.decisions{gap:14px;display:grid}.decision{gap:8px;display:grid}.decision-question{margin:0;font-size:20px}.decision-detail{margin:0}.decision-option{text-align:left;flex-wrap:wrap;position:relative}.decision-option .decision-bar{background:var(--bg-3);border-radius:3px;flex-basis:100%;height:6px;margin-top:8px;display:block;overflow:hidden}.decision-option .decision-bar>i{background:var(--ink-2);border-radius:3px;height:100%;display:block}.decision-option.on .decision-bar>i{background:var(--accent)}.decisions-empty{margin:0}.tabs{gap:22px;font-size:22px;display:flex}.tabs button{color:var(--ink-1)}.tabs button.on{color:var(--ink-0);text-underline-offset:8px;text-decoration:underline}.tabs button:focus-visible{color:var(--ink-0);text-underline-offset:8px;text-decoration:underline;-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent)}.tabs[data-focused=true],.tabs:focus-visible{box-shadow:inset 3px 0 0 var(--accent);padding-left:14px}input.text[data-focused=true]{border-color:var(--accent)}.card{background:var(--bg-1);border:1px solid var(--line-1);border-radius:12px;padding:22px}.formula{color:var(--ink-1);background:var(--bg-2);border-radius:8px;padding:14px 18px;font-size:17px;line-height:1.6}.formula b{color:var(--ink-0)}.bars-heat{flex-wrap:wrap;gap:4px;display:flex}.bars-heat i{background:var(--bg-3);border-radius:4px;place-items:center;width:28px;height:28px;font-size:13px;font-style:normal;display:grid}.bars-heat i[data-n="1"]{background:color-mix(in srgb, var(--fb-wrong) 30%, var(--bg-3))}.bars-heat i[data-n="2"]{background:color-mix(in srgb, var(--fb-wrong) 50%, var(--bg-3))}.bars-heat i[data-n="3"]{background:color-mix(in srgb, var(--fb-wrong) 68%, var(--bg-3))}.bars-heat i[data-n="4"]{background:var(--fb-wrong);color:var(--heat-ink)}.bars-heat i.sel{box-shadow:0 0 0 2px var(--accent)}.chart{gap:8px;display:grid}.chart svg{background:var(--play-field);border-radius:6px;width:100%;height:auto;display:block}.cap{color:var(--ink-1);flex-wrap:wrap;align-items:center;gap:18px;font-size:17px;display:flex}.cap i{vertical-align:middle;border-radius:50%;width:12px;height:12px;margin-right:6px;display:inline-block}.cap i.p{background:var(--fb-perfect)}.cap i.t{background:var(--fb-timing)}.cap .w{color:var(--fb-wrong);font-weight:700}.cap .x{color:var(--fb-extra);font-weight:700}.cap .gap{vertical-align:middle;background:repeating-linear-gradient(90deg, transparent 0 2px, var(--ink-1) 2px 3px);width:12px;height:12px;margin-right:6px;display:inline-block}.stat{color:var(--ink-1);flex-wrap:wrap;gap:22px;font-size:22px;display:flex}.stat b{color:var(--ink-0);font-weight:700}.hero{justify-content:space-between;align-items:flex-end;gap:32px;display:flex}.dropzone{border:1px solid var(--line-2);text-align:center;color:var(--ink-1);background:var(--play-field);cursor:pointer;border-radius:12px;padding:40px;font-size:22px}.dropzone.over,.dropzone:focus-visible{border-color:var(--accent)}.error{color:var(--fb-wrong-ink)}.checkbox{cursor:pointer;align-items:flex-start;gap:14px;font-size:22px;display:flex}.checkbox input{width:22px;height:22px;accent-color:var(--accent);margin-top:8px}.lesson{text-align:left;gap:0;width:100%;max-width:720px;display:grid}.lesson .step{border-bottom:1px solid var(--line-1);color:var(--ink-1);border-left:3px solid #0000;grid-template-columns:auto 1fr;align-items:baseline;gap:20px;padding:18px 0 18px 18px;font-size:22px;display:grid}.lesson .step>:first-child{white-space:nowrap}.lesson .step .r{text-wrap:balance}.lesson .step.active{color:var(--ink-0);border-left-color:var(--accent)}.lesson .step .r{color:var(--ink-1);text-align:right}.keybed-wrap{flex-direction:column;justify-content:flex-end;width:100%;padding-top:30px;display:flex;overflow:hidden}.keybed-hint{text-align:center;color:var(--ink-2);padding:0 16px 48px;font-size:15px}.keybed{background:var(--key-white);border-top:1px solid var(--line-1);flex:1;min-height:120px;max-height:34vh;display:flex;position:relative}@media (max-width:640px){.keybed{max-height:160px}}@media (max-height:820px){.page.centred{gap:14px;min-height:0;padding-top:20px;padding-bottom:12px}.page.centred .title.xl{font-size:40px}.lesson .step{padding-top:12px;padding-bottom:12px}.keybed-wrap{padding-top:12px}.keybed-hint{padding-bottom:14px}}.key-white{background:var(--key-white);border-right:1px solid var(--key-line);color:var(--key-line);flex-direction:column;flex:1;justify-content:flex-end;align-items:flex-start;gap:2px;padding:0 0 8px 6px;font-size:13px;display:flex;position:relative}.key-white.lit{background:var(--accent);color:var(--accent-ink)}.key-black{background:var(--key-black);z-index:2;border-radius:0 0 3px 3px;justify-content:center;align-items:flex-end;width:3.1%;height:62%;padding-bottom:6px;display:flex;position:absolute;top:0}.key-label{color:var(--ink-2);text-transform:lowercase;font-size:15px;font-weight:700;line-height:1}.key-black .key-label{color:var(--ink-1);font-size:13px}.key-name{font-size:12px;line-height:1}@media (max-width:720px){.nav,.page,.chint{padding-left:16px;padding-right:16px}.nav nav{gap:16px}.nav nav a,.nav nav button{font-size:17px}.title{font-size:30px}.band{font-size:88px}.big{font-size:60px}.btn{height:52px;padding:0 20px;font-size:18px}.line,.choices button,.stat,.lede{font-size:17px}}@media (max-width:480px){.nav .logo .release{display:none}.nav nav{gap:12px}.nav nav a,.nav nav button{font-size:14px}.nav nav button[data-section=feedback]{display:none}}.key-white,.key-black{transform-origin:top;cursor:pointer;transition:transform .26s var(--ease-overshoot), background-color .22s var(--ease-out), box-shadow .22s var(--ease-out)}.key-white.down,.key-black.down{transition-duration:45ms,60ms,60ms;transition-timing-function:var(--ease-snap)}.key-white.down{box-shadow:inset 0 -4px 0 var(--accent), inset 0 8px 10px -8px #00000059;background:linear-gradient(#c9c7bf 0%,#dcdad3 38%,#e4e2db 100%);transform:scaleY(.975)}.key-black.down{box-shadow:inset 0 -3px 0 var(--accent), inset 0 6px 8px -6px #0009;background:linear-gradient(#111215 0%,#2b2e34 100%);transform:scaleY(.955)}.key-white.down .key-label,.key-white.down .key-name{color:var(--ink-1)}.key-black.down .key-label{color:var(--accent)}.key-black.lit{background:var(--accent)}.key-rise{bottom:100%;left:var(--left);width:var(--width);z-index:3;pointer-events:none;justify-content:center;height:18px;display:flex;position:absolute}.key-rise:before{content:"";background:var(--accent);width:58%;height:100%;box-shadow:0 0 14px color-mix(in srgb, var(--accent) 55%, transparent);transform-origin:bottom;animation:key-rise .62s var(--ease-out) forwards;border-radius:4px}.key-rise.black:before{width:70%}@keyframes key-rise{0%{opacity:.95;transform:translateY(0)scaleY(.2)}25%{opacity:.9;transform:translateY(-6px)scaleY(1.25)}to{opacity:0;transform:translateY(-28px)scaleY(.7)}}[data-reduced-motion=on] .key-rise{display:none}.loop-page{grid-template-rows:auto 1fr auto;height:100%;display:grid}.loop-head{border-bottom:1px solid var(--line-1);flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:20px;padding:14px 30px;display:flex}.loop-head .h2{font-size:22px}.loop-head .step{color:var(--accent);font-size:17px}.picker{background:var(--score-paper);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;position:relative;overflow:auto}.picker .picker-stage{position:relative}.picker svg{display:block}.picker .pick-bar{pointer-events:none;position:absolute}.picker .pick-bar.in{background:#e9c46a47}.picker .pick-bar.cursor{box-shadow:inset 0 0 0 2px #2f4fd0}.picker .pick-bar.edge{background:#e9c46a80}.loop-foot{border-top:1px solid var(--line-1);color:var(--ink-1);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;padding:14px 30px 20px;font-size:18px;display:flex}.loop-foot b{color:var(--ink-0)}.circle.go{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-size:28px}input.slider{appearance:none;background:var(--line-2);vertical-align:middle;border-radius:2px;outline:none;width:160px;height:4px;margin-right:10px}input.slider::-webkit-slider-thumb{appearance:none;background:var(--accent);cursor:pointer;border-radius:50%;width:16px;height:16px}input.slider::-moz-range-thumb{background:var(--accent);cursor:pointer;border:0;border-radius:50%;width:16px;height:16px}.line .pick{border:1px solid #0000;border-radius:6px;align-items:center;gap:10px;padding:2px 6px;display:inline-flex}.line[data-focused] .pick.on{border-color:var(--line-2)}.line[data-focused] .pick.held{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.line .pick.btn{padding:2px 6px}.gloss{color:var(--ink-1);min-height:1.5em;font-size:17px}.help .card{color:var(--ink-1);gap:12px;font-size:17px;line-height:1.6;display:grid}.help .card b,.help .card .h2{color:var(--ink-0)}.help .card[data-focused=true],.help .card:focus-visible{border-color:var(--accent)}.help .card .btn.link{font-size:inherit}.swatches{flex-wrap:wrap;align-items:center;gap:18px;display:flex}.swatches.inline{margin-left:6px;display:inline-flex}.swatches i{vertical-align:-2px;border:1px solid var(--line-1);border-radius:3px;width:14px;height:14px;margin-right:6px;display:inline-block;position:relative}.keys-list{gap:6px;margin:0;display:grid}.keys-list>div{grid-template-columns:minmax(8ch,14ch) 1fr;align-items:baseline;gap:16px;display:grid}.keys-list dt{color:var(--ink-0)}.keys-list dd{margin:0}kbd{border:1px solid var(--line-2);color:var(--ink-0);white-space:nowrap;border-radius:4px;padding:1px 8px;font-family:inherit;font-size:15px}.keymap{border:1px solid var(--line-2);background:var(--key-white);border-radius:6px;height:132px;display:flex;position:relative;overflow:hidden}.keymap-w{border-right:1px solid var(--key-line);color:#3a3c42;flex-direction:column;justify-content:flex-end;align-items:center;gap:2px;padding-bottom:8px;display:flex;position:relative}.keymap-w:last-child{border-right:0}.keymap .keymap-w b{color:#1e2024;font-size:17px}.keymap-w small{font-size:12px}.keymap-b{z-index:1;background:var(--key-black);border-radius:0 0 3px 3px;justify-content:center;align-items:flex-end;width:62%;height:58%;padding-bottom:6px;display:flex;position:absolute;top:0;right:-31%}.keymap .keymap-b b{color:#e6e6e3;font-size:14px}code{color:var(--ink-0);font-family:inherit}@media (forced-colors:active){.sheet-preview-host,.sheet-browse,.picker,.keybed,.keymap,.canvas-host,.chart svg{forced-color-adjust:none}:root [data-focused=true],:root :focus-visible{outline-offset:2px;outline:2px solid highlight}:root .line[data-focused=true],:root .line:focus-visible{outline-offset:-2px}.nav nav button.on{text-decoration:underline}.choices button.on,.tabs button.on{text-underline-offset:6px;text-decoration:underline}.dot{forced-color-adjust:none;border:1px solid canvastext}.btn.primary{border:1px solid buttontext}.btn:disabled{color:graytext}}.keys-fit{border:1px solid var(--line-2);color:var(--ink-1);border-radius:999px;margin-top:10px;padding:3px 12px;font-size:15px;display:inline-block}.keys-fit.fits{border-color:var(--hand-right);color:var(--ink-0)}.narrow-gate{z-index:100;background:var(--bg-0);position:fixed;inset:0;overflow-y:auto}.narrow-gate-in{width:min(100%,100vw);min-height:min(100%,100vh);min-height:min(100%,100dvh);padding:max(32px, env(safe-area-inset-top)) max(24px, env(safe-area-inset-right)) max(32px, env(safe-area-inset-bottom)) max(24px, env(safe-area-inset-left));align-content:center;justify-items:start;gap:18px;display:grid}.narrow-gate .title{font-size:30px}.narrow-gate .lede{font-size:18px}.narrow-gate .turn{color:var(--ink-0)}.narrow-gate .turn .phone{transform-origin:32px 28px;animation:gate-turn .9s var(--ease-out) .4s both}@keyframes gate-turn{0%{transform:none}to{transform:rotate(90deg)}}[data-reduced-motion=on] .narrow-gate .turn .phone{animation:none;transform:rotate(90deg)}.mic-trouble{z-index:20;border:1px solid var(--danger);background:var(--bg-1);max-width:min(640px,100vw - 32px);color:var(--ink-0);text-align:center;border-radius:6px;margin:0;padding:8px 14px;font-size:14px;position:fixed;bottom:64px;left:50%;transform:translate(-50%)}.mic-trouble.inline{z-index:auto;text-align:left;flex-basis:100%;order:-1;max-width:none;position:static;transform:none}.mic-level{background:var(--bg-3);vertical-align:middle;border-radius:3px;width:96px;height:6px;display:inline-block;overflow:hidden}.mic-level>span{background:var(--accent);height:100%;display:block}.mic-picker{font:inherit;color:var(--ink-0);background:var(--bg-1);border:1px solid var(--line-1);border-radius:4px;max-width:260px;padding:2px 6px}@font-face{font-family:Leipzig;src:url(/assets/leipzig-text-CIN5OLoj.woff2)format("woff2");font-display:block;unicode-range:U+20,U+E1D0-E1EF,U+E26?,U+E520-E54F,U+E56?,U+E650-E6AF,U+EA50-EA6F,U+ECA0-ECBF}.sheet-root{background:var(--score-paper);color:var(--score-ink);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;align-items:center;display:grid;position:absolute;inset:0;overflow:hidden}.score-fit{align-items:center;height:100%;min-height:0;display:flex;position:relative;overflow:hidden}.score-frame{width:100%;position:relative;overflow:hidden}.score-stage{will-change:transform;padding:22px 26px;position:relative}.score-stage svg{z-index:1;width:100%;height:auto;display:block;position:relative}.score-stage g.measure.strip-hidden{display:none}.score-pin{background:var(--score-paper);z-index:2;pointer-events:none;will-change:transform;height:100%;position:absolute;top:0;left:0;overflow:hidden}.score-pin svg{display:block;position:absolute;top:0;left:0}.score-pin path,.score-pin polygon,.score-pin ellipse,.score-pin rect,.score-pin polyline{stroke:currentColor}.score-measure-highlight{pointer-events:none;z-index:0;background:#e9e5d5;position:absolute}.score-cursor{box-sizing:border-box;pointer-events:none;z-index:3;background:#2f4fd029;border-left:1px solid #2f4fd0bf;border-right:1px solid #2f4fd0bf;width:2px;position:absolute}.score-cursor:after{content:"";background:#2f4fd0;width:2px;margin-left:-1px;position:absolute;top:0;bottom:0;left:50%}.score-cursor.plain{background:0 0;border:0}.score-cursor:before{content:"";border-top:8px solid #2f4fd0;border-left:6px solid #0000;border-right:6px solid #0000;position:absolute;top:-1px;left:50%;transform:translate(-50%)}.sheet-root.waiting .score-cursor:after{background:repeating-linear-gradient(#4f9d69 0 5px,#0000 5px 10px)}.sheet-root.waiting .score-cursor:before{border-top-color:#4f9d69}.score-stage g.note[class*=fb-],.score-stage g.note[class*=fb-] *{transition:fill .12s,color .12s}.score-stage g.note.fb-perfect{color:#2f8f52;fill:#2f8f52}.score-stage g.note.fb-perfect *{fill:#2f8f52}.score-stage g.note.fb-early{color:#b0408a;fill:#b0408a}.score-stage g.note.fb-early *{fill:#b0408a}.score-stage g.note.fb-late{color:#d2872a;fill:#d2872a}.score-stage g.note.fb-late *{fill:#d2872a}.score-stage g.note.fb-wrong{color:#c2443c;fill:#c2443c}.score-stage g.note.fb-wrong *{fill:#c2443c}.score-stage g.note.fb-missed{color:#b6b2a4;fill:#b6b2a4}.score-stage g.note.fb-missed *{fill:#b6b2a4}.score-stage g.note.fb-unsure .notehead use,.score-stage g.note.fb-unsure .notehead path{fill:none;stroke:currentColor;stroke-width:26px;stroke-dasharray:34 30}.score-stage g.chord.fb-perfect>:not(g.note),.score-stage g.chord.fb-perfect>:not(g.note) *{color:#2f8f52;fill:#2f8f52}.score-stage g.chord.fb-early>:not(g.note),.score-stage g.chord.fb-early>:not(g.note) *{color:#b0408a;fill:#b0408a}.score-stage g.chord.fb-late>:not(g.note),.score-stage g.chord.fb-late>:not(g.note) *{color:#d2872a;fill:#d2872a}.score-stage g.chord.fb-wrong>:not(g.note),.score-stage g.chord.fb-wrong>:not(g.note) *{color:#c2443c;fill:#c2443c}.score-stage g.chord.fb-missed>:not(g.note),.score-stage g.chord.fb-missed>:not(g.note) *{color:#b6b2a4;fill:#b6b2a4}.score-stage g.beam>polygon{transition:fill .12s}.score-stage g.beam.fb-perfect>polygon{fill:#2f8f52}.score-stage g.beam.fb-early>polygon{fill:#b0408a}.score-stage g.beam.fb-late>polygon{fill:#d2872a}.score-stage g.beam.fb-wrong>polygon{fill:#c2443c}.score-stage g.beam.fb-missed>polygon{fill:#b6b2a4}.score-stage g.played-note{color:#0072b2;fill:#0072b2}.score-stage g.played-note path{stroke:currentColor}.score-stage g.played-note.fading{animation:1.2s ease-in forwards played-fade}.score-stage g.played-note.fading.still{opacity:.8;animation:none}@keyframes played-fade{0%{opacity:.95}55%{opacity:.8}to{opacity:0}}.sheet-root.hide-played g.played-note{display:none}.sheet-legend{color:var(--ink-1);align-items:center;gap:18px;font-size:15px;display:flex}.sheet-legend .swatch{vertical-align:-1px;border-radius:2px;width:12px;height:12px;margin-right:6px;display:inline-block;position:relative}.swatch.mark-cross:before,.swatch.mark-cross:after{content:"";background:#16181c;width:10px;height:2px;margin:-1px 0 0 -5px;position:absolute;top:50%;left:50%;transform:rotate(45deg)}.swatch.mark-cross:after{transform:rotate(-45deg)}.swatch.mark-hatch{background-image:repeating-linear-gradient(135deg,#16181c80 0 1.5px,#0000 1.5px 4px)}.swatch.perfect{background:#2f8f52}.swatch.early{background:#b0408a}.swatch.late{background:#d2872a}.swatch.wrong{background:#c2443c}.swatch.missed{background:#b6b2a4}.swatch.played{background:#0072b2}.swatch.unsure{background:0 0;border:1.5px dashed}.loop-mark{pointer-events:none;z-index:0;position:absolute}.loop-mark.in{background:#e9c46a52}.loop-mark.cursor{background:#e9c46a8c;box-shadow:inset 0 0 0 2px #c9a24a}.loop-mark.in.cursor{background:#e9c46a99}.sheet-preview{background:var(--score-paper);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;border-radius:8px;overflow:hidden}.sheet-preview .score-frame{width:100%;position:relative;overflow:hidden}.sheet-browse{outline:none}.sheet-browse .sheet-preview{transition:box-shadow .12s}.sheet-browse[data-focused=true] .sheet-preview,.sheet-browse:focus-visible .sheet-preview{box-shadow:0 0 0 2px var(--bg-0), 0 0 0 4px var(--accent)}.sheet-browse .foot{color:var(--ink-1);justify-content:space-between;gap:16px;margin:8px 2px 0;font-size:15px;display:flex}.score-stage circle.rival-mark{stroke-width:18px}.score-stage circle.rival-mark.rm-0{fill:#b8860b;stroke:#b8860b}.score-stage circle.rival-mark.rm-1{fill:none;stroke:#b8860b}.score-stage circle.rival-mark.rm-2,.score-stage circle.rival-mark.rm-3{fill:#c2443c;stroke:#c2443c}.play{background:var(--bg-0);grid-template-rows:auto 1fr auto;height:100%;display:grid}.hud{border-bottom:1px solid var(--line-1);background:color-mix(in srgb, var(--bg-0) 85%, transparent);min-height:64px;color:var(--ink-1);font-variant-numeric:tabular-nums;flex-wrap:nowrap;align-items:center;gap:22px;padding:0 30px;font-size:22px;display:flex}.hud>*{white-space:nowrap;flex:none}.hud .road{align-self:stretch;align-items:center;gap:inherit;flex:1 1 0;min-width:0;display:flex}.hud.two-rows{flex-wrap:wrap;row-gap:0}.hud.two-rows:before{content:"";flex-basis:100%;order:1;height:0}.hud.two-rows .road{order:2;min-height:56px}.hud.two-rows .switch{order:2}.hud .combo-slot{align-items:center;gap:12px;display:inline-flex}.hud.has-health .combo-slot{flex-direction:column;align-items:flex-end;gap:2px}.hud.has-health .combo-slot>span:last-child{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);font-size:14px;line-height:1}.hud .where{text-align:right}.hud .pct{text-align:right;min-width:7ch}.hud .progress{background:var(--line-1);border-radius:2px;flex:1;align-self:flex-end;min-width:120px;height:3px;margin-bottom:9px;position:relative}.hud .hud-blob{width:var(--blob);height:var(--blob);margin:0 -10px calc(-.04 * var(--blob)) -6px;pointer-events:none;flex:none;align-self:flex-end}.hud .progress .fill{background:var(--accent);border-radius:2px;position:absolute;top:0;bottom:0;left:0}.hud .progress .mark{background:var(--accent);width:2px;height:15px;position:absolute;top:-6px}.hud .health{align-items:center;gap:3px;display:flex}.hud .health i{background:var(--bg-3);border-radius:2px;width:6px;height:16px}.hud .health i:only-child{border-radius:3px;width:22px;height:12px}.hud .health i.lit{background:var(--health)}.hud .health.low i.lit{background:var(--health-low);animation:1s infinite pulse}.hud .health i.ghost-a{animation:health-ghost-a .9s var(--ease-out) forwards}.hud .health i.ghost-b{animation:health-ghost-b .9s var(--ease-out) forwards}@keyframes health-ghost-a{0%,45%{background:var(--health-low)}to{background:var(--bg-3)}}@keyframes health-ghost-b{0%,45%{background:var(--health-low)}to{background:var(--bg-3)}}@keyframes pulse{50%{opacity:.5}}[data-reduced-motion=on] .hud .health.low i.lit{animation:none}.hud .pct{font-family:var(--font-display);color:var(--ink-0);font-variant-numeric:tabular-nums;font-weight:700}.hud .live{border:1px solid var(--line-1);background:var(--bg-1);border-radius:10px;align-items:baseline;gap:12px;padding:4px 14px;display:inline-flex;position:relative}.hud .live-label{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);font-size:14px}.hud .live-score{font-family:var(--font-display);color:var(--ink-0);text-align:right;min-width:6ch;font-size:38px;font-weight:800;line-height:1.1}.hud .live-band{font-family:var(--font-display);color:var(--accent);text-align:center;min-width:1ch;animation:live-band-pop .32s var(--ease-overshoot);font-size:38px;font-weight:800;line-height:1.1;display:inline-block}@keyframes live-band-pop{0%{opacity:.4;transform:scale(1.6)}to{opacity:1;transform:scale(1)}}.hud .live{--hurt:color-mix(in srgb, var(--fb-wrong-ink) 65%, #ff4d4d);transition:border-color .4s var(--ease-out)}.hud .live-score-wrap{display:inline-block}.hud .live-score{transform-origin:100% 60%;display:inline-block}.hud .live.hurt-a .live-score{animation:.72s linear score-hurt-a}.hud .live.hurt-b .live-score{animation:.72s linear score-hurt-b}.hud .live.hurt-a,.hud .live.hurt-b{animation:.72s linear score-box-hurt}@keyframes score-hurt-a{0%{color:var(--hurt);transform:scale(1.14)translate(0)rotate(0)}8%{transform:scale(1.14)translate(-4px)rotate(-2deg)}16%{transform:scale(1.12)translate(4px)rotate(2deg)}24%{transform:scale(1.1)translate(-3px)rotate(-1deg)}32%{transform:scale(1.07)translate(2px)rotate(.5deg)}45%{color:var(--hurt);transform:scale(1.03)translate(0)rotate(0)}to{color:var(--ink-0);transform:none}}@keyframes score-hurt-b{0%{color:var(--hurt);transform:scale(1.14)translate(0)rotate(0)}8%{transform:scale(1.14)translate(-4px)rotate(-2deg)}16%{transform:scale(1.12)translate(4px)rotate(2deg)}24%{transform:scale(1.1)translate(-3px)rotate(-1deg)}32%{transform:scale(1.07)translate(2px)rotate(.5deg)}45%{color:var(--hurt);transform:scale(1.03)translate(0)rotate(0)}to{color:var(--ink-0);transform:none}}@keyframes score-box-hurt{0%,45%{border-color:var(--hurt)}to{border-color:var(--line-1)}}.hud .live-lost{background:var(--bg-0);font-family:var(--font-display);color:var(--hurt);pointer-events:none;white-space:nowrap;animation:score-lost .76s var(--ease-out) forwards;border-radius:6px;padding:1px 8px;font-size:20px;font-weight:800;line-height:1.2;position:absolute;top:calc(100% + 2px);right:14px}@keyframes score-lost{0%{opacity:0;transform:translateY(-6px)scale(1.2)}12%{opacity:1;transform:translateY(0)scale(1)}65%{opacity:1}to{opacity:0;transform:translateY(16px)}}[data-reduced-motion=on] .hud .live.hurt-a .live-score,[data-reduced-motion=on] .hud .live.hurt-b .live-score{animation:.72s linear score-hurt-still}[data-reduced-motion=on] .hud .live-lost{animation:.76s linear forwards score-lost-still}.hud .live.still.hurt-a .live-score,.hud .live.still.hurt-b .live-score{animation:.72s linear score-hurt-still}.hud .live.still .live-lost{animation:.76s linear forwards score-lost-still}@keyframes score-hurt-still{0%,45%{color:var(--hurt)}to{color:var(--ink-0)}}@keyframes score-lost-still{0%,65%{opacity:1}to{opacity:0}}[data-reduced-motion=on] .hud .live-band,.hud .live-band.blank{animation:none}.hud .switch button{color:var(--ink-1);font-size:22px}.hud .switch button.on{color:var(--ink-0);text-underline-offset:7px;text-decoration:underline;-webkit-text-decoration-color:var(--accent);text-decoration-color:var(--accent)}.hud .switch .sep{color:var(--ink-2);margin:0 8px}.hud .opp{align-items:baseline;gap:12px;display:flex}.hud .opp b{color:var(--ink-0)}.hud .ahead{color:var(--hand-right)}.hud .behind{color:var(--fb-timing-ink)}.field{background:var(--play-field);position:relative;overflow:hidden}.field>.canvas-host{position:absolute;inset:0}.field .count-in{pointer-events:none;z-index:5;font-family:var(--font-display);color:var(--ink-0);justify-content:center;align-items:center;font-size:140px;font-weight:800;line-height:1;display:flex;position:absolute;inset:0}.field .count-in span{text-align:center;background:color-mix(in srgb, var(--bg-0) 88%, transparent);border-radius:28px;min-width:1.3em;padding:.08em .25em .12em;animation:.5s ease-out count-pulse;box-shadow:0 10px 40px #00000073}@keyframes count-pulse{0%{transform:scale(1.22)}to{transform:scale(1)}}[data-reduced-motion=on] .field .count-in span{animation:none}.field .milestone{text-align:center;pointer-events:none;z-index:5;font-family:var(--font-display);color:var(--accent);font-size:64px;font-weight:800;position:absolute;top:24px;left:0;right:0}.field .waiting-for{background:color-mix(in srgb, var(--bg-0) 82%, transparent);color:var(--ink-0);pointer-events:none;white-space:nowrap;border-radius:999px;padding:8px 18px;font-size:22px;position:absolute;top:28%;left:50%;transform:translate(-50%)}.overlay{z-index:10;background:color-mix(in srgb, var(--bg-0) 78%, transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:18px;padding:24px;display:flex;position:absolute;inset:0}.overlay .h2{font-size:26px}.overlay .big{font-size:56px}.overlay .title{font-size:48px}.welcome .overlay{position:fixed}.playfoot{border-top:1px solid var(--line-1);color:var(--ink-1);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px;padding:16px 30px 22px;font-size:20px;display:flex}.playfoot .device{color:var(--ink-0)}.playfoot .device .dot{margin-right:10px}.circle{border:3px solid var(--accent);width:130px;height:130px;font-family:var(--font-display);color:var(--ink-0);font-variant-numeric:tabular-nums;border-radius:50%;place-items:center;font-size:40px;display:grid}.preview{border:1px solid var(--line-1);border-radius:8px;width:100%;height:auto;display:block}.welcome-page .status{font-size:inherit;color:var(--ink-1)}.welcome-page .inputs{text-align:left;gap:10px;width:min(760px,100%);margin:8px auto 12px;display:grid}.welcome-page .input-row{grid-template-columns:260px 1fr;align-items:center;gap:18px;display:grid}.welcome-page .input-act .btn{justify-content:center;width:100%}.welcome-page .input-row .lbl{margin:0}.welcome-page .btn.off{opacity:.5;cursor:default;display:inline-flex}.welcome-page .status b{color:var(--ink-0)}@media (max-width:900px){.hud{gap:14px;padding:0 20px;font-size:18px}.hud .live-score,.hud .live-band{font-size:30px}}@media (max-width:720px){.hud{gap:14px;min-height:56px;padding:0 16px;font-size:16px}.hud .live{padding:2px 10px}.hud .live-score,.hud .live-band{font-size:26px}.playfoot{padding:12px 16px 16px;font-size:15px}.field .count-in{font-size:96px}}.hud .progress .range{background:var(--accent);opacity:.55;border-radius:2px;height:7px;position:absolute;top:-2px}.loop-page .field{min-height:320px}.loop-page .loop-head{gap:10px;display:grid}.loop-page .loop-head .progress{background:var(--line-1);border-radius:2px;height:3px;margin:8px 0;position:relative}.loop-page .loop-head .progress .fill{background:var(--accent);border-radius:2px;position:absolute;top:0;bottom:0;left:0}.loop-page .loop-head .progress .range{background:var(--accent);opacity:.6;border-radius:2px;height:7px;position:absolute;top:-2px}.loop-page .loop-head .progress .mark{background:var(--accent);width:2px;height:15px;position:absolute;top:-6px}.opp-bar{border-top:1px solid var(--line-1);background:var(--bg-0);gap:8px;padding:10px 30px 12px;display:grid}.opp-bar.gone{opacity:.55}.opp-line{color:var(--ink-1);flex-wrap:wrap;align-items:baseline;gap:18px;font-size:18px;display:flex}.opp-name{color:var(--ink-0);font-weight:700}.opp-score{font-family:var(--font-display);color:var(--ink-0);font-size:26px;font-weight:700}.opp-line .ahead{color:var(--hand-right)}.opp-line .behind{color:var(--fb-timing-ink)}.opp-line .over{color:var(--ink-1)}.opp-line .health{vertical-align:middle;gap:3px;display:inline-flex}.opp-line .health i{background:var(--bg-3);border-radius:2px;width:16px;height:9px}.opp-line .health i.lit{background:var(--health)}.opp-flash{font-family:var(--font-display);color:var(--accent);font-weight:800}.opp-road{align-items:flex-end;gap:10px;display:flex}.opp-road .rival-blob{width:var(--blob);height:var(--blob);margin-bottom:calc(4px - .04 * var(--blob));pointer-events:none;flex:none}.opp-road .opp-progress{flex:1}.opp-progress{gap:2px;height:8px;display:flex}.opp-progress i{background:var(--bg-3);border-radius:2px;flex:1}.opp-progress i.now{background:var(--ink-2)}.opp-progress i.clean{background:var(--ink-0)}.opp-progress i.off{background:var(--fb-timing)}.opp-progress i.bad{background:var(--fb-wrong)}.match-strip{gap:6px;display:grid}.match-strip .row-label{color:var(--ink-1);font-size:15px}.match-count{z-index:6;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;gap:8px;display:flex;position:absolute;inset:0}.match-count .num{font-family:var(--font-display);color:var(--accent);font-size:120px;font-weight:800;line-height:1}.cal-page{gap:18px}.cal-field{border:1px solid var(--line-1);border-radius:10px;height:min(50vh,440px)}.cal-field .overlay .big{font-size:72px}.playfoot .octave-chip{border:1px solid var(--line-2);color:var(--ink-0);font-variant-numeric:tabular-nums;white-space:nowrap;border-radius:999px;padding:2px 12px}.play:has(>.duel-bar){grid-template-rows:auto auto 1fr auto}.duel-bar{border-bottom:1px solid var(--line-1);background:var(--bg-0);color:var(--ink-1);grid-template-columns:auto 1fr auto;grid-template-areas:"me meter them""news news gap";align-items:center;gap:2px 14px;padding:6px 30px 8px;font-size:15px;display:grid}.duel-side.me{grid-area:me}.duel-side.them{text-align:right;grid-area:them}.duel-side b{color:var(--ink-0);font-family:var(--font-display);font-size:18px}.duel-news{grid-area:news;animation:2.4s ease-out forwards duel-news}.duel-news.me{color:var(--hand-right)}.duel-news.them{color:var(--fb-timing-ink)}@keyframes duel-news{0%{opacity:0;transform:translateY(3px)}8%,70%{opacity:1;transform:none}to{opacity:.55}}.duel-gap{text-align:right;font-family:var(--font-display);color:var(--hand-right);grid-area:gap;font-weight:700}.duel-gap.behind{color:var(--fb-timing-ink)}.rope{background:linear-gradient(90deg, color-mix(in srgb, var(--hand-right) 30%, var(--bg-3)), var(--bg-3) 50%, color-mix(in srgb, var(--fb-timing) 30%, var(--bg-3)));border-radius:6px;grid-area:meter;height:12px;position:relative}.rope-mid{background:var(--ink-2);width:2px;position:absolute;top:-3px;bottom:-3px;left:50%}.rope-knot{background:var(--accent);width:18px;height:18px;box-shadow:0 0 0 2px var(--bg-0);border-radius:50%;margin:-9px 0 0 -9px;transition:left .6s cubic-bezier(.3,1.4,.5,1);position:absolute;top:50%}.hp-pair{grid-area:meter;grid-template-columns:1fr 1fr;gap:10px;display:grid}.hp{background:var(--bg-3);border-radius:6px;height:12px;display:flex;overflow:hidden}.hp.them{justify-content:flex-end}.hp>span{background:var(--health);transition:width .5s ease-out}.hp.them>span{background:var(--fb-timing)}@media (prefers-reduced-motion:reduce){.duel-news{animation:none}.rope-knot,.hp>span{transition:none}}.hud{--combo-base:40px;z-index:6;position:relative}.hud .combo{min-width:calc(var(--combo-base) * 1.55 * 1.8);font-family:var(--font-display);font-variant-numeric:tabular-nums;font-weight:700;line-height:1;font-size:calc(var(--combo-base) * var(--grow,1));height:var(--combo-base);color:var(--ink-0);transition:font-size .18s var(--ease-snap), color .24s var(--ease-out);justify-content:flex-end;align-items:center;display:inline-flex;position:relative}.hud .combo.zero{color:var(--ink-1)}.hud .combo.clean .combo-kick{text-shadow:0 0 10px color-mix(in srgb, var(--accent) 55%, transparent), 0 0 2px #ffffff80}.hud .combo.t1{color:color-mix(in srgb, var(--accent) 70%, var(--ink-0))}.hud .combo.t2{color:var(--accent)}.hud .combo.t3{color:color-mix(in srgb, var(--fb-late) 78%, var(--accent));text-shadow:0 0 14px #e8873a80}.hud .combo.t4{color:var(--accent);filter:drop-shadow(0 0 9px #e8873a80)}.hud .combo-kick{transform-origin:50% 40%;white-space:nowrap;display:inline-block}.hud .combo .digit-cell{clip-path:inset(-.6em -.4em .13em);display:inline-block}.hud .combo .digit{animation:combo-digit-in .16s var(--ease-out) both;display:inline-block}.hud .combo.t4 .digit{background-image:linear-gradient(100deg, var(--fb-late) 0%, var(--accent) 36%, #fff4d2 50%, var(--accent) 64%, var(--fb-late) 100%);color:#0000;animation:combo-digit-in .16s var(--ease-out) both, combo-sheen 2.8s linear var(--sheen-delay,0s) infinite;background-size:300% 100%;-webkit-background-clip:text;background-clip:text}@keyframes combo-digit-in{0%{opacity:.3;transform:translateY(.45em)scale(.8)}45%{opacity:1;transform:translateY(-.07em)scale(1.05)}to{opacity:1;transform:none}}@keyframes combo-sheen{0%{background-position:100% 0}to{background-position:0 0}}.hud .combo.plain{font-size:var(--combo-base);transition:color .24s var(--ease-out)}.hud .combo.plain .digit{animation:none}.hud .combo.plain.t4 .digit{background-image:linear-gradient(180deg, #fff4d2 0%, var(--accent) 55%, var(--fb-late) 100%);background-size:100% 100%;animation:none}.hud .combo-lost{z-index:1;font-size:calc(var(--combo-base) * var(--grow,1));white-space:nowrap;color:var(--fb-wrong-ink);text-shadow:none;filter:none;pointer-events:none;transform-origin:30% 60%;line-height:1;animation:.45s linear forwards combo-lost;position:absolute;top:88%;right:0}@keyframes combo-lost{0%{opacity:.95;animation-timing-function:cubic-bezier(.3,0,.7,.4);transform:none}30%{opacity:.55;animation-timing-function:cubic-bezier(.5,0,1,.6);transform:translateY(3px)rotate(4deg)scale(.96)}to{opacity:0;transform:translateY(24px)rotate(18deg)scale(.84)}}.field .milestone>span{transform-origin:50% 70%;animation:milestone-callout .9s var(--ease-out) both;display:inline-block}.field .milestone i{color:var(--ink-1);vertical-align:.2em;margin-right:.06em;font-size:.6em;font-style:normal;font-weight:700}.field .milestone.t1{color:color-mix(in srgb, var(--accent) 70%, var(--ink-0))}.field .milestone.t3{color:color-mix(in srgb, var(--fb-late) 78%, var(--accent));text-shadow:0 0 22px #e8873a73}.field .milestone.t4>span{background-image:linear-gradient(180deg, #fff4d2 0%, var(--accent) 50%, var(--fb-late) 100%);color:#0000;filter:drop-shadow(0 0 14px #e8873a73);-webkit-background-clip:text;background-clip:text}.play{position:relative}.play>.milestone{z-index:7;pointer-events:none;height:64px;font-family:var(--font-display);color:var(--accent);justify-content:center;align-items:center;font-size:46px;font-weight:800;line-height:1;display:flex;position:absolute;top:0;left:0;right:0}.play>.milestone>span{background:var(--bg-0);box-shadow:0 0 0 1px var(--line-1), 0 6px 18px #00000073;transform-origin:50% 70%;animation:milestone-callout .9s var(--ease-out) both;border-radius:12px;padding:4px 22px;display:inline-block}.play>.milestone i{color:var(--ink-1);vertical-align:.2em;margin-right:.06em;font-size:.6em;font-style:normal;font-weight:700}.play>.milestone.t1{color:color-mix(in srgb, var(--accent) 70%, var(--ink-0))}.play>.milestone.t3{color:color-mix(in srgb, var(--fb-late) 78%, var(--accent))}.play>.milestone.plain>span,[data-reduced-motion=on] .play>.milestone>span,.field .milestone.plain>span{animation:.9s linear both milestone-fade}@keyframes milestone-callout{0%{opacity:0;transform:translateY(10px)scale(.3)}16%{opacity:1;transform:translateY(0)scale(1.22)}28%{transform:scale(.94)}40%{transform:scale(1.03)}50%{transform:none}70%{opacity:1;animation-timing-function:cubic-bezier(.4,0,1,1);transform:none}to{opacity:0;transform:translateY(-40px)scale(1.05)}}@keyframes milestone-fade{0%{opacity:0}8%,70%{opacity:1}to{opacity:0}}.band.stamp{transform-origin:50% 65%;width:-moz-fit-content;width:fit-content;animation:.48s linear .12s both band-stamp;position:relative}@keyframes band-stamp{0%{opacity:0;animation-timing-function:cubic-bezier(.55,0,1,.45);transform:scale(2)rotate(-9deg)}30%{opacity:1}52%{opacity:1;animation-timing-function:var(--ease-out);transform:scale(.9)rotate(1.5deg)}72%{animation-timing-function:ease-in-out;transform:scale(1.05)rotate(-.5deg)}88%{transform:scale(.985)}to{opacity:1;transform:none}}.band.stamp:after{content:"";border:3px dotted color-mix(in srgb, var(--accent) 70%, transparent);pointer-events:none;opacity:0;width:1.15em;height:1.15em;animation:band-dust .62s var(--ease-out) .36s both;border-radius:50%;margin:-.575em 0 0 -.575em;position:absolute;top:52%;left:50%}@keyframes band-dust{0%{opacity:.85;transform:scale(.55)}to{opacity:0;transform:scale(1.55)}}.new-best{color:var(--accent-text);display:inline-block}.new-best.pulse{animation:new-best .72s var(--ease-out) .9s both}@keyframes new-best{0%{color:var(--ink-1);transform:none}30%{color:var(--accent-text);text-shadow:0 0 14px #e9c46a8c;transform:scale(1.16)}to{color:var(--accent-text);text-shadow:0 0 #e9c46a00;transform:none}}@media (max-width:900px){.hud{--combo-base:34px}}@media (max-width:720px){.hud{--combo-base:30px;padding-top:8px}}[data-reduced-motion=on] .hud .combo{transition:none}[data-reduced-motion=on] .hud .combo-kick,[data-reduced-motion=on] .hud .combo .digit{animation:none}[data-reduced-motion=on] .hud .combo.t4 .digit{background-image:linear-gradient(180deg, #fff4d2 0%, var(--accent) 55%, var(--fb-late) 100%);background-size:100% 100%;animation:none}[data-reduced-motion=on] .hud .combo-lost{display:none}[data-reduced-motion=on] .field .milestone>span{animation:.9s linear both milestone-fade}[data-reduced-motion=on] .band.stamp,[data-reduced-motion=on] .new-best.pulse{animation:none}[data-reduced-motion=on] .band.stamp:after{display:none}.cal{--cal-bg:var(--bg-0);--cell:13px;--gap:3px;--days-w:30px;border:1px solid var(--line-1);background:var(--cal-bg);border-radius:12px;gap:14px;padding:18px 20px 16px;display:grid;position:relative}.cal-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 24px;display:flex}.cal-sum{color:var(--ink-1);font-size:17px}.cal-sum b{color:var(--ink-0);font-weight:700}.cal-busy{color:var(--ink-1);font-size:14px}.cal-busy span{white-space:nowrap}.cal-busy b{color:var(--ink-0);font-weight:600}.cal-scroll{overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent;padding-bottom:4px;overflow:auto hidden;container-type:inline-size}@supports (width:round(down, 10px, 1px)) and (width:1cqw){.cal-scroll .cal-graph{--cell:clamp(12px, round(down, calc((100cqw - var(--days-w) - 8px) / 53 - var(--gap)), 1px), 15px)}}.cal-graph{grid-template-columns:var(--days-w) max-content;grid-template-rows:auto auto;row-gap:6px;width:max-content;margin-left:auto;padding:2px 8px 0 0;display:grid}.cal-months{grid-area:1/2;grid-template-columns:repeat(53, var(--cell));column-gap:var(--gap);height:16px;color:var(--ink-1);font-size:12px;line-height:16px;display:grid}.cal-months span{white-space:nowrap;grid-row:1}.cal-days{grid-area:1/1/3;grid-template-rows:repeat(7, var(--cell));row-gap:var(--gap);color:var(--ink-2);z-index:1;background:var(--cal-bg);align-content:start;padding-top:22px;font-size:11px;display:grid;position:sticky;left:0}.cal-days span{line-height:var(--cell)}.cal-grid{grid-area:2/2;grid-auto-flow:column;grid-template-rows:repeat(7, var(--cell));grid-auto-columns:var(--cell);gap:var(--gap);display:grid}.cal-cell{width:var(--cell);height:var(--cell);background:var(--bg-3);transition:background-color var(--d-3) var(--ease-out) calc(var(--i,0) * 5ms);border-radius:3px;display:block}.cal-cell[data-level="1"]{background:color-mix(in oklab, var(--accent) 32%, var(--bg-3))}.cal-cell[data-level="2"]{background:color-mix(in oklab, var(--accent) 55%, var(--bg-3))}.cal-cell[data-level="3"]{background:color-mix(in oklab, var(--accent) 78%, var(--bg-3))}.cal-cell[data-level="4"]{background:var(--accent)}.cal-cell[data-future]{box-shadow:inset 0 0 0 1px var(--line-1);background:0 0}.cal-cell[data-today]{outline:2px solid var(--ink-0);outline-offset:1px}.cal-cell[data-today=open]{outline-style:dashed;outline-color:var(--ink-1)}.cal-grid .cal-cell:not([data-future]):hover{outline:1px solid var(--ink-0);outline-offset:-1px}.cal-grid .cal-cell{animation:cal-in .36s var(--ease-overshoot) backwards;animation-delay:calc(var(--i,0) * 7ms)}@keyframes cal-in{0%{opacity:0;transform:scale(.35)}}.cal-foot{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 24px;display:flex}.cal-note{color:var(--ink-2);font-size:13px}.cal-legend{align-items:center;gap:var(--gap);color:var(--ink-1);margin-left:auto;font-size:12px;display:flex}.cal-legend .cal-cell{--cell:12px}.cal-legend .cal-cell:first-of-type{margin-left:6px}.cal-legend .cal-cell:last-of-type{margin-right:6px}.cal-tip{--arrow:0px;z-index:5;background:var(--play-field);box-shadow:var(--e-2);color:var(--ink-0);white-space:nowrap;pointer-events:none;animation:cal-tip-in var(--d-1) var(--ease-out) both;border-radius:6px;padding:6px 10px;font-size:13px;line-height:1.35;position:absolute;transform:translate(-50%,calc(-100% - 10px))}.cal-tip:after{content:"";left:calc(50% + var(--arrow));background:var(--play-field);width:8px;height:8px;box-shadow:1px 1px 0 0 var(--line-2);position:absolute;top:100%;transform:translate(-50%,-50%)rotate(45deg)}@keyframes cal-tip-in{0%{opacity:0}}@media (max-width:720px){.cal{gap:12px;padding:14px 14px 12px}.cal-sum{font-size:15px}.cal-busy{font-size:13px}.cal-tip{padding:5px 8px;font-size:12px}}[data-reduced-motion=on] .cal-cell,[data-reduced-motion=on] .cal-grid .cal-cell,[data-reduced-motion=on] .cal-tip{transition:none;animation:none}.blob{-webkit-tap-highlight-color:transparent;flex:none;display:block;overflow:visible}.blob[data-interactive=true]{cursor:pointer}.blob-playground{gap:10px;display:grid}.blob-stage{-webkit-user-select:none;user-select:none;touch-action:manipulation;background:radial-gradient(120% 90% at 50% 100%,#e9c46a0d,#0000 60%),linear-gradient(#0000 0 55%,#0000001f);border-radius:12px;width:100%;position:relative;overflow:visible}.blob-floor{background:linear-gradient(90deg, transparent, var(--line-2) 12%, var(--line-2) 88%, transparent);opacity:.55;height:1px;position:absolute;left:0;right:0}.blob-floor:after{content:"";background:linear-gradient(#ffffff09,#0000);height:16px;position:absolute;top:1px;left:6%;right:6%}.blob-stage[data-held] .blob-floor{background:linear-gradient(90deg, transparent, var(--accent) 12%, var(--accent) 88%, transparent);opacity:.45}.blob-stage[data-grab]{cursor:pointer}.blob-actor{will-change:transform;cursor:pointer;position:absolute;left:0}.blob-actor .blob{width:100%;height:100%}.blob-tag{white-space:nowrap;will-change:transform;color:var(--ink-2);letter-spacing:.02em;font-size:13px;position:absolute;left:0}.blob-tag.local{color:var(--ink-1)}.blob-badge{border-radius:var(--r-pill);background:var(--accent);color:var(--accent-ink);white-space:nowrap;pointer-events:none;padding:2px 10px;font-size:13px;font-weight:700;position:absolute;top:18%;left:50%;transform:translate(-50%,-100%)}.blob-hint{margin:0}.blob-gallery{max-width:1280px}.blob-gallery-head{flex-wrap:wrap;align-items:baseline;gap:18px;display:flex}.blob-gallery-stage{padding:16px 22px 14px}.blob-gallery-controls{gap:12px;display:grid}.blob-acts{flex-wrap:wrap;gap:8px;display:flex}.blob-acts .btn.sm{height:36px;padding:0 14px;font-size:15px;font-weight:500}.blob-moods{flex-wrap:wrap;font-size:17px}.blob-moods button{font-size:17px}.blob-grid{gap:18px 14px;display:grid}.blob-card{background:var(--play-field);border:1px solid var(--line-1);border-radius:12px;justify-items:center;gap:8px;margin:0;padding:18px 10px 14px;display:grid}.blob-card figcaption{text-align:center;color:var(--ink-1);justify-items:center;gap:2px;font-size:13px;display:grid}.blob-card figcaption b{color:var(--ink-0);font-size:14px}.blob-card figcaption .small{max-width:26ch;font-size:11px;line-height:1.35}.blob-card i{font-style:normal}[data-shiny]{color:var(--accent)}.blob-sizes{gap:10px;display:grid}.blob-strip{border-radius:10px;flex-wrap:wrap;align-items:flex-end;gap:22px;padding:18px 20px 14px;display:flex}.blob-strip.hud{background:var(--play-field)}.blob-strip.nav{background:var(--bg-0);border:1px solid var(--line-1)}.blob-rider{--blob-size:34px;border-bottom:1px solid var(--line-2);position:relative}.blob-rider .blob{margin-bottom:calc((.96 - 1) * var(--blob-size))}.blob-navitem{color:var(--ink-1);align-items:center;gap:8px;font-size:22px;display:inline-flex}.char-card{border:1px solid var(--line-1);background:var(--bg-0);border-radius:14px;grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);gap:18px;padding:14px;display:grid}.char-side{align-content:start;gap:8px;min-width:0;display:grid}.char-stage{background:var(--play-field);transition:box-shadow var(--d-2) var(--ease-out);border-radius:10px;outline:none;align-content:end;padding:0 18px 12px;display:grid;position:relative;overflow:hidden}.char-stage[data-focused=true],.char-stage:focus-visible{box-shadow:inset 3px 0 0 var(--accent)}.char-stage .blob-stage{background:radial-gradient(90% 70% at 50% 100%,#e9c46a0f,#0000 70%)}.char-hint{color:var(--ink-2);overflow-wrap:anywhere;margin:0;padding:0 4px;font-size:13px;line-height:1.5}.char-hint span{display:block}.char-hint .alt{opacity:.75}.cert{--cert-hue:var(--accent);box-shadow:inset 0 0 0 1px var(--line-1), inset 0 0 0 5px var(--bg-0), inset 0 0 0 6px color-mix(in oklab, var(--line-1) 55%, transparent);border-radius:10px;align-content:center;gap:12px;padding:22px 22px 18px;display:grid;position:relative}.cert-name{position:relative}.cert-name:before{content:"";background:var(--cert-hue);border-radius:0 4px 4px 0;width:4px;position:absolute;top:.08em;bottom:.08em;left:-22px}.cert-eyebrow{color:var(--ink-2);margin-top:4px;font-size:13px}.cert-name{font-family:var(--font-display);letter-spacing:-.02em;color:var(--ink-0);overflow-wrap:anywhere;margin:-6px 0 0;font-size:34px;font-weight:700;line-height:1.1}.cert-id{color:var(--ink-1);font-size:15px}.cert-facts{border-top:1px solid var(--line-1);grid-template-columns:max-content minmax(0,1fr);align-items:baseline;gap:10px 18px;margin:4px 0 0;padding-top:14px;font-size:15px;display:grid}.cert-facts dt{color:var(--ink-2);font-size:13px}.cert-facts dd{color:var(--ink-0);margin:0}.cert-shiny{color:var(--accent-text)}.cert-traits{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.cert-traits li{border-radius:var(--r-pill);background:var(--bg-1);color:var(--ink-1);white-space:nowrap;padding:0 9px;font-size:13px;line-height:22px}.cert-foot{color:var(--ink-2);font-size:13px}.char-card[data-moved] .cert{animation:char-fade var(--d-5) var(--ease-out) backwards}@media (max-width:860px){.char-card{grid-template-columns:minmax(0,1fr)}}@media (max-width:720px){.char-card{gap:12px;padding:10px}.char-stage{padding:0 10px 10px}.char-hint{padding:0 2px}.cert{padding:20px 16px 16px}.cert-name{font-size:28px}}[data-reduced-motion=on] .char-card[data-moved] .cert{animation:none}.creator{border:1px solid var(--line-1);background:var(--bg-0);border-radius:14px;grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);gap:18px;padding:14px;display:grid}.creator-stage{background:var(--play-field);border-radius:10px;padding:0 18px 12px;position:relative;overflow:hidden}.creator-stage .blob-stage{background:radial-gradient(90% 70% at 50% 100%,#e9c46a0f,#0000 70%)}.creator-side{align-content:start;gap:12px;padding:8px 4px 0;display:grid}.creator-title{font-family:var(--font-display);letter-spacing:-.02em;margin:-4px 0 0;font-size:28px;font-weight:700;line-height:1.1}.creator-name{color:var(--ink-1);min-height:1.5em;font-size:17px}.creator-name b{color:var(--ink-0)}.creator-rolls{flex-wrap:wrap;gap:8px;display:flex}.creator-rolls .btn.sm{height:36px;padding:0 14px;font-size:15px;font-weight:500}.creator-keep{border-top:1px solid var(--line-1);justify-items:start;gap:6px;padding-top:6px;display:grid}.creator-note{min-height:1.5em;color:var(--ink-1)}@media (max-width:860px){.creator{grid-template-columns:minmax(0,1fr)}}@media (max-width:720px){.creator{gap:12px;padding:10px}.creator-stage{padding:0 10px 10px}}.section-label{color:var(--ink-0);margin:8px 0 0;font-size:17px;font-weight:700}.lede.profile-note{text-wrap:pretty;max-width:none;font-size:17px}.lobby-stage{border:1px solid var(--line-1);background:var(--play-field);transition:box-shadow var(--d-2) var(--ease-out), border-color var(--d-2) var(--ease-out);border-radius:12px;outline:none;gap:2px;padding:0 18px 12px;display:grid;position:relative;overflow:hidden}.lobby-stage[data-focused=true],.lobby-stage:focus-visible{box-shadow:0 0 0 2px var(--bg-0), 0 0 0 4px var(--accent)}.lobby-stage[data-room]:not([data-held]){cursor:pointer}.lobby-stage .blob-stage{background:radial-gradient(60% 80% at 50% 100%,#e9c46a0b,#0000 70%);border-radius:0}.lobby-stage .blob-badge{letter-spacing:.04em;padding:1px 9px;font-size:12px;top:14%}.lobby-stage .blob-tag{font-size:13px}.lobby-hint{min-height:1.5em;color:var(--ink-2);font-size:13px}.lobby-stage[data-held] .lobby-hint{color:var(--ink-1)}@media (max-width:640px){.lobby-stage{padding:0 10px 10px}}main[data-reveal=skipped] .band.stamp,main[data-reveal=skipped] .new-best.pulse,main[data-reveal=skipped] .crown,main[data-reveal=skipped] .result-say{animation:none}main[data-reveal=skipped] .band.stamp:after{display:none}.results .hero{flex-wrap:wrap;row-gap:12px}.rank-row{align-items:flex-end;gap:16px;display:flex}.band.rank-none{color:var(--ink-2)}.result-blob.beside-band{margin-bottom:2px}.result-blob{flex:none;display:inline-flex;position:relative}.result-blob[data-tappable]{cursor:pointer}.result-blob .confetti{pointer-events:none;z-index:2;width:0;height:0;position:absolute;top:45%;left:50%}.result-blob .confetti i{background:var(--c);opacity:0;animation:confetti-pop 1.3s cubic-bezier(.2, .7, .4, 1) var(--delay) forwards;border-radius:1px;position:absolute;top:0;left:0}@keyframes confetti-pop{0%{opacity:1;transform:translate(0)rotate(0)scale(.4)}35%{opacity:1;transform:translate(var(--dx), var(--dy)) rotate(calc(var(--spin) * .5)) scale(1)}to{opacity:0;transform:translate(calc(var(--dx) * 1.15), calc(var(--dy) + 70px)) rotate(var(--spin)) scale(.9)}}[data-reduced-motion=on] .result-blob .confetti{display:none}.result-say{z-index:1;background:var(--bg-3);color:var(--ink-0);white-space:nowrap;pointer-events:none;animation:result-say .26s var(--ease-snap) both;border-radius:10px;padding:1px 10px 2px;font-size:15px;font-weight:700;line-height:1.4;position:absolute;bottom:66%}.result-say.to-right{transform-origin:0 100%;border-bottom-left-radius:2px;left:70%}.result-say.to-left{transform-origin:100% 100%;border-bottom-right-radius:2px;right:70%}@keyframes result-say{0%{opacity:0;transform:translateY(6px)scale(.5)}to{opacity:1;transform:none}}.duel-card{gap:14px;display:grid}.duel-head{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.sweep{border-radius:var(--r-pill);background:var(--accent-soft);color:var(--accent-text);align-items:center;gap:2px;padding:2px 12px 2px 4px;font-size:15px;font-weight:700;display:inline-flex}.duel{border-collapse:collapse;table-layout:fixed;width:100%}.duel col.side{width:40%}.duel th,.duel td{padding:0;font-weight:400}.duel-stage[data-locked] .blob-stage{pointer-events:none}.duel-stage:not([data-locked]) .blob-stage{touch-action:pan-y pinch-zoom}.duel-stage[data-midi] .lobby-hint{min-height:4.5em}.duel-vs{color:var(--ink-2);pointer-events:none;transition:opacity var(--d-2) var(--ease-out);font-size:13px;position:absolute;left:50%;transform:translate(-50%)}.duel-stage:not([data-locked]) .duel-vs{opacity:0}.duel-stage[data-swept=me] .blob-stage{background:radial-gradient(22% 30% at 20% 86%, color-mix(in srgb, var(--accent) 26%, transparent), transparent 100%)}.duel-stage[data-swept=them] .blob-stage{background:radial-gradient(22% 30% at 80% 86%, color-mix(in srgb, var(--accent) 26%, transparent), transparent 100%)}.duel-stage[data-gone] .blob-actor~.blob-actor{opacity:.4;filter:saturate(.4)}.duel tbody th{color:var(--ink-1);text-align:center;white-space:nowrap;padding:5px 14px;font-size:15px}.duel tbody td{color:var(--ink-1);font-variant-numeric:tabular-nums;padding:5px 0;font-size:22px}.duel tbody td b{color:var(--ink-0);font-weight:700}.duel tbody td.me{text-align:right}.duel tbody td.them{text-align:left}.duel tbody tr+tr th,.duel tbody tr+tr td{border-top:1px solid var(--line-1)}.crown{color:var(--accent);vertical-align:1px;animation:crown-in .38s var(--ease-snap) .52s both;margin:0 8px;line-height:0;display:inline-block}.crown svg{display:block}.crown path{fill:currentColor}.crown-text{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.sweep .crown{margin:0 4px}@keyframes crown-in{0%{opacity:0;transform:translateY(-9px)scale(.5)rotate(-14deg)}60%{opacity:1;transform:translateY(1px)scale(1.12)rotate(4deg)}to{opacity:1;transform:none}}@media (max-width:720px){.result-blob.beside-band .blob{width:92px;height:92px}.duel tbody td{font-size:17px}.duel tbody th{padding:5px 8px;font-size:13px}.duel col.side{width:34%}}[data-reduced-motion=on] .crown,[data-reduced-motion=on] .result-say{animation:none}.tier-badge{flex:none;overflow:visible}.tier-badge .shield{fill:var(--tier);fill-opacity:.2;stroke:var(--tier);stroke-width:3.4px;stroke-linejoin:round}.tier-badge .keys{fill:var(--tier)}.tier-badge .ornament{fill:var(--tier);stroke:var(--tier);stroke-width:.5px;stroke-linejoin:round}.tier-bronze{--tier:#c08457}.tier-silver{--tier:#b9c0cb}.tier-gold{--tier:#e9c46a}.tier-platinum{--tier:#86d3c7}.tier-diamond{--tier:#8bb8ff}.tier-maestro{--tier:#c9a0f0}.tier-grand-maestro{--tier:#ff9b61}.tier-placing{--tier:var(--ink-2)}.tier-placing .shield{fill:none;stroke-width:2.6px;stroke-dasharray:3.5 4;stroke-linecap:round}.hub{grid-template-columns:1fr 1fr;align-items:stretch;gap:20px;display:grid}.hub .card{align-content:start;gap:16px;display:grid}.hub h2{font:800 26px/1.1 var(--font-display);letter-spacing:-.01em;margin:0}.rank-head{align-items:center;gap:14px;display:flex}.rank-head .rank-name{font:800 22px/1.1 var(--font-display)}.rank-head .rank-num{color:var(--ink-1);font-variant-numeric:tabular-nums}.tier-progress{background:var(--bg-3);border-radius:2px;max-width:220px;height:4px;display:block;overflow:hidden}.tier-progress i{background:var(--accent);height:100%;display:block}.recent .line{font-size:14px}.delta.up{color:var(--hand-right)}.delta.down{color:var(--danger)}@media (max-width:760px){.hub{grid-template-columns:1fr}}.search-state{align-items:center;gap:18px;display:flex}.search-clock{font:800 44px/1 var(--font-display);font-variant-numeric:tabular-nums}.search-pulse{background:var(--accent);width:14px;height:14px;animation:search-pulse 1.4s var(--ease-out) infinite;border-radius:50%}@keyframes search-pulse{0%{box-shadow:0 0 0 0 var(--accent-soft);opacity:1}70%{opacity:.6;box-shadow:0 0 0 16px #0000}to{opacity:1;box-shadow:0 0 #0000}}[data-reduced-motion=on] .search-pulse{animation:none}@media (prefers-reduced-motion:reduce){.search-pulse{animation:none}}.versus{grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;display:grid}.versus .side{align-items:center;gap:12px;display:flex}.versus .side.them{text-align:right;justify-content:flex-end}.versus .who{gap:2px;display:grid}.versus .who b{font-size:18px}.versus .vs{color:var(--ink-2);font:800 18px var(--font-display)}.draw-reveal{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:16px;display:flex}.draw-reveal .piece{font:800 24px/1.15 var(--font-display)}.mode-chip{border-radius:var(--r-pill);border:1px solid var(--line-2);color:var(--ink-0);letter-spacing:.04em;padding:2px 10px;font-size:13px;display:inline-block}.mode-chip.sudden-death{border-color:var(--danger);color:var(--danger)}@media (max-width:640px){.versus{grid-template-columns:1fr}.versus .side.them{text-align:left;flex-direction:row-reverse;justify-content:flex-start}.versus .vs{display:none}}.picker-list{border:1px solid var(--line-1);border-radius:10px;max-height:320px;overflow:auto}.picker-list .line{padding-left:14px;padding-right:14px}.picker-list .line.on{box-shadow:inset 3px 0 0 var(--accent);background:var(--accent-soft)}.ranked-strip{align-items:center;gap:16px;display:flex}.ranked-strip-text{gap:6px;display:grid}.ranked-delta{font:800 34px/1 var(--font-display);font-variant-numeric:tabular-nums}.ranked-delta.up{color:var(--hand-right)}.ranked-delta.down{color:var(--danger)}.placement-pips{gap:6px;display:flex}.placement-pips i{background:var(--bg-3);border-radius:3px;width:22px;height:6px}.placement-pips i.on{background:var(--accent)}.ranked-strip.placed .placed-tier{font:800 30px/1.1 var(--font-display)}.placement-card{padding-top:12px;padding-bottom:12px}.level-pick{gap:8px;display:grid}.level-pick-options{gap:2px;display:grid}.level-pick-options button{text-align:left;color:var(--ink-1);border-radius:8px;padding:6px 10px}.level-pick-options button b{color:var(--ink-0);margin-right:6px}.level-pick-options button.on{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--accent);color:var(--ink-0)}.level-pick-options button:focus-visible,.level-pick-options button[data-focused=true]{color:var(--ink-0);box-shadow:0 0 0 2px var(--bg-0), 0 0 0 4px var(--accent)}.level-pick-options button.on:focus-visible,.level-pick-options button.on[data-focused=true]{box-shadow:inset 3px 0 0 var(--accent), 0 0 0 2px var(--bg-0), 0 0 0 4px var(--accent)}@media (forced-colors:active){.level-pick-options button.on b{text-underline-offset:6px;text-decoration:underline}}.record-meter{border-bottom:1px solid var(--line-1);gap:14px;padding:28px 0;display:grid}.record-meter .big{font-size:72px}.beat-dots{gap:14px;display:flex}.beat-dots .dot{width:18px;height:18px;margin:0}.rec-mark{background:var(--danger);vertical-align:middle;border-radius:50%;width:12px;height:12px;margin-right:6px;display:inline-block}.page.record .btn[aria-disabled=true]{opacity:.4;cursor:default}.lbl .btn.link.record-link{font-size:inherit}.line input.record-title{flex:1;width:auto;max-width:520px;height:52px}.page.record>*{min-width:0}@media (max-width:720px){.page.record .line{flex-wrap:wrap}.page.record .choices{flex-wrap:wrap;row-gap:4px}.record-meter .big{font-size:44px}.line input.record-title{min-width:0;height:44px;font-size:17px}}@media (max-height:500px),(hover:none) and (pointer:coarse){.chint,.btn .kbd,.line.keys-row,.lobby-hint{display:none}.hud .hud-pause{width:44px;height:44px;color:var(--ink-1);border-radius:10px;flex:none;justify-content:center;align-items:center;display:inline-flex}.hud .hud-pause:active{color:var(--ink-0);background:var(--bg-2)}.hud .hud-pause svg{width:20px;height:20px}}@media (hover:none) and (pointer:coarse){html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}.play{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;overscroll-behavior:none;-webkit-tap-highlight-color:transparent}html:has(.play){overflow:hidden}.hud button{touch-action:manipulation}.playfoot .octave-chip,.playfoot .keys-text{display:none}.btn.link,.choices button,.tabs button,.nav nav a,.nav nav button,.nav .logo{align-items:center;min-height:44px;display:inline-flex}.level-pick-options button{min-height:44px}.btn.link,.choices button,.tabs button,.nav nav a,.nav nav button{justify-content:center;min-width:44px}.creator-rolls .btn.sm{height:44px}input.slider{background:linear-gradient(var(--line-2), var(--line-2)) center / 100% 4px no-repeat;height:44px}input.slider::-webkit-slider-thumb{width:28px;height:28px}input.slider::-moz-range-thumb{width:28px;height:28px}}@media (max-height:500px){.play{height:100%;height:100dvh;padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.hud{--combo-base:22px;min-height:44px;box-shadow:inset 0 -1px 0 var(--line-1);border-bottom:0;gap:10px;padding:0 12px;font-size:14px}.hud .hud-pause{width:44px;height:44px;margin-left:-12px}.hud .live{border-radius:8px;gap:6px;padding:0 8px}.hud .live-label{display:none}.hud .live-score,.hud .live-band{font-size:22px}.hud .live-lost{font-size:14px;right:8px}.hud .combo-slot>span:last-child,.hud.has-health .combo-slot>span:last-child{display:none}.hud .health i{height:12px}.hud .where{font-size:13px}.hud .pct{display:none}.hud .progress{min-width:48px;margin-bottom:6px}.hud .switch .sep,.hud .switch button.on,.hud .switch button:disabled{display:none}.hud .switch button{min-width:44px;min-height:44px;font-size:15px}.hud.two-rows{flex-wrap:nowrap}.hud.two-rows:before{display:none}.hud.two-rows .road,.hud.two-rows .switch{order:0}.hud.two-rows .road{min-height:0}.playfoot{border:0;min-height:0;padding:0}.playfoot>:not(.mic-trouble){display:none}.playfoot>.mic-trouble{top:48px;right:max(12px, env(safe-area-inset-right));z-index:3;pointer-events:none;background:var(--bg-1);text-align:left;border-radius:999px;max-width:60%;padding:4px 10px;font-size:12px;position:absolute;bottom:auto;left:auto}.field .count-in{font-size:72px}.field .count-in span{border-radius:16px}.field .milestone{font-size:34px;top:8px}.play>.milestone{height:44px;font-size:26px}.play>.milestone>span{border-radius:8px;padding:2px 14px}.field .waiting-for{padding:4px 12px;font-size:14px}.match-count .num{font-size:56px}.match-count .lede{font-size:15px}.overlay{gap:10px;padding:12px}.overlay .title{font-size:28px}.overlay .h2{font-size:20px}.overlay .lede{font-size:15px}.overlay .lbl{font-size:12px}.overlay .btn{height:44px;padding:0 18px;font-size:16px}.overlay .btn.link{align-items:center;height:auto;min-height:44px;padding:0 6px;display:inline-flex}.opp-bar{align-items:center;gap:12px;padding:4px 12px;display:flex}.opp-line{flex-wrap:nowrap;flex:none;align-items:center;gap:10px;font-size:14px}.opp-line>.dim,.opp-flash{display:none}.opp-score{font-size:18px}.opp-bar>div:last-child{flex:1;min-width:0}.opp-road .rival-blob{display:none}.opp-progress{height:6px}.nav{height:44px;padding-left:max(16px, env(safe-area-inset-left));padding-right:max(16px, env(safe-area-inset-right))}.nav .logo{font-size:17px}.nav .logo .release{display:none}.nav nav{gap:14px}.nav nav a,.nav nav button{align-items:center;min-height:44px;font-size:15px;display:inline-flex}.page{padding:12px max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));gap:12px}.page>*{min-width:0}.title{font-size:24px}.title.xl,.page.centred .title.xl{font-size:30px}.h2{font-size:19px}.big{font-size:44px}.band{font-size:72px}.lede{font-size:15px}.eyebrow,.lbl{font-size:13px}.line,.stat,.choices button,.tabs,.tabs button{font-size:16px}.line{min-height:48px;padding:10px 0}.btn,.btn.sm{height:44px;padding:0 16px;font-size:16px}.btn.link{height:auto;padding:0}.stepper button{width:44px;height:44px}input.text{height:44px;padding:0 14px;font-size:16px}.card{padding:14px}.gloss{font-size:13px}.row.actions{z-index:4;background:var(--bg-0);padding-top:8px;padding-bottom:max(8px, env(safe-area-inset-bottom));border-top:1px solid var(--line-1);margin:0 -8px;padding-left:8px;padding-right:8px;position:sticky;bottom:0}.line{flex-wrap:wrap}.line .r{white-space:normal;flex-wrap:wrap;justify-content:flex-end}:is(.line>.row>.dim,.line .r>.late-note,.line .r>.dim:has(+.pick)){display:none}.line .row{justify-content:flex-end}.mic-picker{max-width:200px}.page>input.text[type=search]{z-index:4;position:sticky;top:0}.page>.tabs{flex-wrap:nowrap;gap:16px;overflow-x:auto}.page>.tabs button{flex:none}.line .meta{font-size:13px}.results .chart svg{max-height:140px}.results .hero{gap:16px}.hub .card{gap:10px}.hub h2{font-size:20px}.search-clock{font-size:32px}.picker-list{max-height:200px}.page.centred{gap:8px;min-height:0;padding-top:8px}.welcome-page .inputs{gap:6px;margin:4px auto 6px}.welcome-page .input-row{grid-template-columns:200px 1fr;gap:12px}.welcome-page .input-row .lbl{white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.welcome .keybed-wrap{display:none}.keybed{min-height:80px;max-height:110px}.keybed-wrap{padding-top:8px}.keybed-hint{padding-bottom:8px}.lesson .step{padding-top:8px;padding-bottom:8px;font-size:16px}}@media (max-height:500px) and (min-width:560px){.hub{grid-template-columns:1fr 1fr}}
