@font-face{font-family:Bodoni Moda;font-style:italic;font-weight:500;font-display:swap;src:url(/fonts/bodoni-moda-500-italic.woff2) format("woff2")}html,body{margin:0;background:#000;color:#f3efe6;font-family:Avenir Next,Segoe UI,sans-serif}body{overflow-x:hidden}#stage{position:fixed;inset:0;width:100%;height:100%;display:block;z-index:0;touch-action:none}#runway{position:relative;height:2000vh;z-index:1}#name{position:fixed;z-index:2;left:50%;top:28vh;margin:0;transform:translate(-50%,-100%);font-family:Bodoni Moda,"Bodoni 72",Didot,Didot LT STD,Bodoni MT,serif;font-style:italic;font-weight:500;font-size:clamp(2rem,4.6vw,4.4rem);font-synthesis:none;letter-spacing:.012em;line-height:.8;color:#f4ead7;white-space:nowrap;opacity:0;pointer-events:none;-webkit-user-select:none;user-select:none;text-shadow:0 1px 1px rgba(0,0,0,.85),0 14px 28px rgba(0,0,0,.55)}#name .gap{display:inline-block;width:.28em;overflow:hidden;white-space:nowrap}#name .letter{appearance:none;background:transparent;border:0;margin:0;padding:0 .012em;color:inherit;font:inherit;letter-spacing:inherit;line-height:inherit;cursor:pointer;pointer-events:none;transform-origin:50% 80%}#name.live .letter{pointer-events:auto}#name.live .letter:hover,#name.live .letter:focus-visible,#name .letter.struck{color:var(--ink)}#name.live .letter:hover,#name.live .letter:focus-visible{transform:translateY(-.05em)}#name.live .letter:focus-visible{outline:1px solid rgba(244,234,215,.55);outline-offset:.14em}#name .letter.struck{animation:letter-hit .46s cubic-bezier(.2,.8,.2,1)}@keyframes letter-hit{0%{transform:translateY(0) scale(1)}28%{transform:translateY(-.14em) scale(1.07)}to{transform:translateY(0) scale(1)}}#invite{position:fixed;z-index:2;left:50%;bottom:max(22px,env(safe-area-inset-bottom));transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:.7rem;pointer-events:none}#hint{margin:0;font-size:.82rem;letter-spacing:.06em;color:#f3efe68c;white-space:nowrap;transition:opacity 1.2s ease}#hint.gone{opacity:0}#scroll-cue{display:flex;flex-direction:column;align-items:center;gap:.28rem;margin:0;font-size:.82rem;letter-spacing:.08em;white-space:nowrap;color:#f4ead7e0;transition:opacity .7s ease}#scroll-cue svg{width:.95rem;height:.95rem;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round;animation:scroll-cue 1.8s ease-in-out infinite}#scroll-cue.gone{opacity:0}@keyframes scroll-cue{0%,to{transform:translateY(0);opacity:.72}50%{transform:translateY(5px);opacity:1}}#doors{position:fixed;z-index:4;top:max(18px,env(safe-area-inset-top));right:max(18px,env(safe-area-inset-right));display:flex;gap:1rem;margin:0;opacity:.55;transition:opacity .7s ease}#doors.live{opacity:1}#doors a{color:#f4ead7;text-decoration:none;font-size:.78rem;letter-spacing:.06em}#doors a:hover,#doors a:focus-visible{color:#fff8ee}#doors a:focus-visible{outline:1px solid rgba(244,234,215,.75);outline-offset:4px}::selection{background:#f4ead747;color:#fff8ee}#bench{position:fixed;z-index:3;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:flex-start;gap:.85rem;padding:0 16px max(18px,env(safe-area-inset-bottom));pointer-events:none;opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s cubic-bezier(.16,1,.3,1)}#bench.ready{opacity:1;transform:none}#groove{appearance:none;pointer-events:auto;position:fixed;z-index:5;left:max(18px,env(safe-area-inset-left));bottom:max(18px,env(safe-area-inset-bottom));top:auto;transform:none;display:inline-flex;align-items:center;width:max-content;white-space:nowrap;gap:.7rem;margin:0;padding:.42rem .85rem .48rem;border:1px solid rgba(244,234,215,.2);border-radius:7px;background:#0e0e0c;color:#f4ead7;box-shadow:0 14px 28px #00000080;font-family:Bodoni Moda,"Bodoni 72",Didot,Didot LT STD,Bodoni MT,serif;font-style:italic;font-weight:500;font-size:1.2rem;font-synthesis:none;letter-spacing:.01em;line-height:1;cursor:pointer}#groove .mark{width:.72rem;height:.72rem;flex:none;fill:transparent;stroke:currentColor;stroke-width:1.4}#groove[aria-pressed=true] .mark{fill:currentColor}#groove:hover,#groove:focus-visible{color:#fff8ee}#groove:focus-visible{outline:1px solid rgba(244,234,215,.7);outline-offset:6px}#play-along{appearance:none;pointer-events:none;position:fixed;z-index:5;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));margin:0;padding:.42rem .85rem .48rem;border:1px solid rgba(244,234,215,.2);border-radius:7px;background:#0e0e0c;color:#f4ead7;box-shadow:0 14px 28px #00000080,inset 0 -2px #7eedfa8c;font-family:Bodoni Moda,"Bodoni 72",Didot,Didot LT STD,Bodoni MT,serif;font-style:italic;font-weight:500;font-size:1.2rem;font-synthesis:none;letter-spacing:.01em;line-height:1;cursor:pointer;opacity:0}#bench.ready #play-along{opacity:1;pointer-events:auto}#bench.yours #play-along{opacity:0;pointer-events:none}#play-along:hover,#play-along:focus-visible{color:#fff8ee}#play-along:focus-visible{outline:1px solid rgba(244,234,215,.7);outline-offset:6px}html.chart-on #bench,html.chart-on #name,html.chart-on #doors,html.chart-on #invite,html.chart-on #groove,html.chart-on #kit-dock{visibility:hidden}#kit-dock{position:fixed;z-index:5;top:max(18px,env(safe-area-inset-top));left:max(18px,env(safe-area-inset-left));display:flex;flex-direction:column;align-items:flex-start;gap:8px;opacity:0;pointer-events:none;transition:opacity .7s ease}#kit-dock.live{opacity:1}#kit-dock.live #kit-open,#kit-dock.live #kit-panel{pointer-events:auto}#kit-open{appearance:none;display:inline-flex;align-items:center;gap:.48rem;margin:0;padding:.32rem .72rem .36rem .38rem;border:1px solid rgba(244,234,215,.2);border-radius:7px;background:#0e0e0c;color:#f4ead7;box-shadow:0 14px 28px #00000080;font-family:Bodoni Moda,"Bodoni 72",Didot,Didot LT STD,Bodoni MT,serif;font-style:italic;font-weight:500;font-size:1.05rem;font-synthesis:none;letter-spacing:.01em;line-height:1;cursor:pointer}#kit-open .pip{width:.78rem;height:.78rem;flex:none;border-radius:50%;background:radial-gradient(circle at 32% 30%,#fff 0 .8px,transparent 1.2px),radial-gradient(circle at 64% 58%,var(--flake, #fff3d4) 0 .7px,transparent 1.1px),radial-gradient(circle at 42% 70%,rgba(255,255,255,.85) 0 .5px,transparent .9px),radial-gradient(circle at 50% 42%,rgba(255,255,255,.2),transparent 62%),var(--wrap, #d4923c);box-shadow:inset 0 -3px 4px #00000059}#kit-open:hover,#kit-open:focus-visible,#kit-open[aria-expanded=true]{color:#fff8ee;border-color:#f4ead773}#kit-open:focus-visible{outline:1px solid rgba(244,234,215,.7);outline-offset:6px}#kit-panel{width:max-content;max-width:calc(100vw - 36px);padding:12px;border:1px solid rgba(244,234,215,.2);border-radius:7px;background:#0e0e0c;box-shadow:0 18px 36px #0000008c}#kit-panel .finishes{display:flex;flex-wrap:wrap;gap:8px}#kit-panel .finish{appearance:none;width:28px;height:28px;margin:0;padding:0;border:1px solid rgba(244,234,215,.28);border-radius:50%;background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.95) 0 .9px,transparent 1.3px),radial-gradient(circle at 68% 38%,var(--flake, #fff) 0 .8px,transparent 1.2px),radial-gradient(circle at 46% 66%,rgba(255,255,255,.8) 0 .6px,transparent 1px),radial-gradient(circle at 72% 72%,var(--flake, #fff) 0 .7px,transparent 1.1px),radial-gradient(circle at 38% 48%,rgba(255,255,255,.55) 0 .5px,transparent .9px),radial-gradient(circle at 50% 40%,rgba(255,255,255,.18),transparent 62%),var(--wrap, #d4923c);box-shadow:inset 0 -5px 7px #00000059;cursor:pointer}#kit-panel .finish[aria-pressed=true]{box-shadow:0 0 0 1px #0e0e0c,0 0 0 3px #f4ead7,inset 0 -5px 7px #00000059}#kit-panel .finish:hover,#kit-panel .finish:focus-visible,#kit-panel .setup:hover,#kit-panel .setup:focus-visible{transform:translateY(-2px)}#kit-panel .finish:focus-visible,#kit-panel .setup:focus-visible{outline:1px solid rgba(244,234,215,.75);outline-offset:3px}#kit-panel .choice-label{margin:14px 2px 0;color:#f4ead77a;font-family:Avenir Next,Segoe UI,sans-serif;font-size:.62rem;font-weight:600;letter-spacing:.16em;line-height:1;text-transform:uppercase}#kit-panel .setups{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}#kit-panel .setup{appearance:none;flex:1;margin:0;padding:.42rem .7rem .5rem;border:1px solid rgba(244,234,215,.16);border-radius:7px;background:transparent;color:#f4ead7;font-family:Avenir Next,Segoe UI,sans-serif;font-size:.78rem;font-weight:500;letter-spacing:.04em;line-height:1;cursor:pointer}#kit-panel .setup[aria-pressed=true]{border-color:#f4ead76b;box-shadow:inset 0 -2px 0 var(--flake, #fff3d4)}#lap{align-self:center;display:grid;grid-template-rows:0fr;width:max-content;max-width:calc(100% - 280px);pointer-events:none;transition:grid-template-rows .62s cubic-bezier(.16,1,.3,1)}#bench.yours #lap{grid-template-rows:1fr}#lap-inner{min-height:0;overflow:hidden}#board,#pads{padding:0}#pads{display:none}.row{display:flex;justify-content:center;gap:6px}.row.shown{align-items:stretch}.row+.row{margin-top:6px}.key,.pad{appearance:none;pointer-events:auto;position:relative;margin:0;border:1px solid rgba(244,234,215,.16);border-radius:7px;background:#0e0e0c;color:#f4ead7;box-shadow:0 10px 18px #00000061,inset 0 -3px 0 var(--ink);cursor:pointer;touch-action:manipulation}.key{width:clamp(40px,3.6vw,54px);height:clamp(50px,4.6vw,60px);padding:6px 5px 8px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;flex:none}.key.space{width:clamp(70px,5.8vw,84px)}.key.space .glyph{font-size:1rem}.key[hidden],.pad[hidden]{display:none}.key .glyph,.pad .glyph{font-family:Bodoni Moda,"Bodoni 72",Didot,Didot LT STD,Bodoni MT,serif;font-style:italic;font-weight:500;font-synthesis:none;line-height:.85}.key .glyph{font-size:1.15rem}.key .voice,.pad .voice{font-family:Avenir Next,Segoe UI,sans-serif;font-style:normal;font-size:.62rem;font-weight:500;letter-spacing:.04em;line-height:1;color:#f4ead7c7}.key:hover,.pad:hover,.key:focus-visible,.pad:focus-visible{border-color:#f4ead773;transform:translateY(-2px)}.key:focus-visible,.pad:focus-visible{outline:1px solid rgba(244,234,215,.75);outline-offset:3px}.key.hot,.pad.hot,.key:active,.pad:active{transform:translateY(3px);border-color:var(--ink);box-shadow:0 3px #0000008c,inset 0 -7px 0 var(--ink)}.key.hot .glyph,.pad.hot .glyph{color:var(--read)}.pad-row{display:flex;gap:8px}.pad-row+.pad-row{margin-top:8px}.pad{flex:1;min-height:68px;padding:10px 12px 12px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;text-align:left}.pad .glyph{font-size:1.45rem}.pad.wide{min-height:78px;align-items:center}.pad.wide .glyph{font-size:1.8rem}@media(max-width:900px){#lap{max-width:calc(100% - 24px)}.row.shown{flex-wrap:wrap;max-width:min(440px,calc(100vw - 36px))}#groove{font-size:1.45rem}#invite{bottom:max(96px,14vh)}}@media(prefers-reduced-motion:reduce){#runway{height:100vh}#name .letter.struck,#scroll-cue svg{animation:none}#name.live .letter:hover,#name.live .letter:focus-visible{transform:none}#bench,#lap,#doors,#kit-dock,.key,.pad,#kit-panel .finish,#kit-panel .setup{transition:none}.key:hover,.pad:hover,.key:focus-visible,.pad:focus-visible,.key.hot,.pad.hot,.key:active,.pad:active,#kit-panel .finish:hover,#kit-panel .finish:focus-visible,#kit-panel .setup:hover,#kit-panel .setup:focus-visible{transform:none}}#chart[hidden],#chart [hidden]{display:none!important}#chart{position:fixed;inset:0;z-index:8;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 72%,#08080a2e,#000000b8 52%,#000000e6);color:#f4ead7;font-family:Avenir Next,Segoe UI,sans-serif}#chart .chart-sheet{position:relative;width:min(920px,calc(100% - 28px));height:min(680px,calc(100% - 28px));overflow:hidden;border-radius:18px;border:1px solid rgba(244,234,215,.18);background:#0606089e;box-shadow:0 30px 80px #0000008c,inset 0 0 0 1px #ffffff0a,inset 0 -40px 80px #5c8fff0d}#chart .chart-highway{position:absolute;inset:0;width:100%;height:100%;display:block}#chart .chart-veil{position:absolute;inset:0;pointer-events:none;background:linear-gradient(to bottom,rgba(0,0,0,.55),transparent 22%,transparent 68%,rgba(0,0,0,.45)),radial-gradient(ellipse at 50% 74%,transparent 0 18%,rgba(0,0,0,.18) 70%)}#chart .chart-bar,#chart .chart-menu,#chart .chart-play,#chart .chart-pause,#chart .chart-results{position:relative;z-index:2}#chart .chart-play{position:absolute;inset:0;pointer-events:none}#chart .chart-bar{position:absolute;top:0;left:0;right:0;z-index:4;display:flex;justify-content:space-between;align-items:center;padding:16px 18px 0;pointer-events:none}#chart .chart-bar button,#chart .chart-bar-actions,#chart .chart-menu,#chart .chart-pause,#chart .chart-results,#chart .chart-lanes button{pointer-events:auto}#chart .chart-bar-actions{display:flex;align-items:center;gap:8px}#chart .chart-sheet.is-playing .chart-bar{justify-content:center}#chart .chart-mark,#chart h2,#chart .chart-groove-name,#chart .chart-combo,#chart .chart-word,#chart .chart-grade,#chart .chart-name{font-family:Bodoni Moda,"Bodoni 72",Didot,Bodoni MT,serif;font-style:italic;font-weight:500;font-synthesis:none}#chart .chart-mark{margin:0;letter-spacing:.01em}#chart button{appearance:none;border:1px solid rgba(244,234,215,.18);border-radius:8px;background:#0e0e0c;color:#f4ead7;font:inherit;cursor:pointer}#chart .chart-metronome,#chart .chart-close{padding:.35rem .7rem;background:transparent}#chart .chart-metronome[aria-pressed=true]{border-color:#f4ead7b3;box-shadow:0 0 18px #7eedfa40}#chart .chart-menu,#chart .chart-pause,#chart .chart-results{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:64px 28px 28px;background:#060608c7}#chart .chart-menu h2,#chart .chart-pause h2{margin:0;font-size:clamp(2.4rem,5vw,3.6rem);line-height:.9}#chart .chart-lead,#chart .chart-keys{margin:.7rem 0 0;color:#f4ead7c7}#chart .chart-grooves{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:1.2rem}#chart .chart-groove{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:.15rem .8rem;text-align:left;padding:.75rem .85rem .85rem;background:#08080ab8}#chart .chart-groove-name{font-size:1.55rem;line-height:.9}#chart .chart-groove-diff{font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;align-self:center}#chart .chart-groove-blurb{grid-column:1 / -1;color:#f4ead7b3;font-size:.82rem}#chart .chart-groove.is-easy{box-shadow:inset 0 -3px #7eedfa}#chart .chart-groove.is-medium{box-shadow:inset 0 -3px #ffde99}#chart .chart-groove.is-hard{box-shadow:inset 0 -3px #f25c80}#chart .chart-groove.is-expert{box-shadow:inset 0 -3px #db291f}#chart .chart-speeds{display:flex;gap:8px;margin-top:14px}#chart .chart-speeds button,#chart .chart-actions button,#chart .chart-lanes button{padding:.45rem .75rem}#chart .chart-speeds button[aria-pressed=true]{border-color:#f4ead7b3;box-shadow:0 0 18px #7eedfa40}#chart .chart-hud{position:absolute;top:18px;left:18px;right:18px;display:flex;justify-content:space-between;pointer-events:none}#chart .chart-name{margin:0;font-size:1.8rem;line-height:.9}#chart .chart-diff,#chart .chart-score,#chart .chart-accuracy{margin:.15rem 0 0}#chart .chart-scorebox{text-align:right}#chart .chart-score{font-variant-numeric:tabular-nums;font-size:1.1rem}#chart .chart-combo{position:absolute;left:50%;top:38%;margin:0;transform:translate(-50%,-50%);font-size:clamp(4rem,10vw,7rem);line-height:.8;text-shadow:0 0 24px rgba(255,222,153,.45);pointer-events:none}#chart .chart-judge{position:absolute;left:50%;top:62%;margin:0;transform:translate(-50%,-50%);text-align:center;opacity:0;pointer-events:none}#chart .chart-word{display:block;font-size:2.4rem;line-height:.9}#chart .chart-drift{display:block;min-height:1em;letter-spacing:.08em;text-transform:uppercase;font-size:.72rem}#chart .chart-judge.is-perfect{color:#fff6e8;text-shadow:0 0 18px rgba(255,222,153,.8)}#chart .chart-judge.is-good{color:#d8fbff;text-shadow:0 0 16px rgba(126,237,250,.7)}#chart .chart-judge.is-miss{color:#ffb0a8;text-shadow:0 0 16px rgba(219,41,31,.65)}#chart .chart-judge.chart-judge-on{animation:chart-judge .52s ease}@keyframes chart-judge{0%{opacity:0;transform:translate(-50%,-40%)}20%{opacity:1;transform:translate(-50%,-50%)}70%{opacity:1}to{opacity:0;transform:translate(-50%,-58%)}}#chart .chart-lanes{position:absolute;left:7%;right:7%;bottom:18px;display:grid;grid-template-columns:repeat(5,1fr);gap:8px}#chart .chart-lanes button{min-height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;line-height:1;padding:.3rem .15rem;background:#08080ab8}#chart .chart-lanes .lane-key{font-family:Bodoni Moda,Didot,serif;font-style:italic;font-size:1.25rem}#chart .chart-lanes .lane-name{font-family:Avenir Next,Segoe UI,sans-serif;font-style:normal;font-size:.62rem;letter-spacing:.02em;color:#f4ead7b8}#chart .chart-lanes button:nth-child(1){box-shadow:inset 0 -3px #db291f,0 0 16px #db291f40}#chart .chart-lanes button:nth-child(2){box-shadow:inset 0 -3px #ffde99,0 0 16px #ffde9933}#chart .chart-lanes button:nth-child(3){box-shadow:inset 0 -3px #7eedfa,0 0 16px #7eedfa38}#chart .chart-lanes button:nth-child(4){box-shadow:inset 0 -3px #f25c80,0 0 16px #f25c8038}#chart .chart-lanes button:nth-child(5){box-shadow:inset 0 -3px #5c8fff,0 0 16px #5c8fff40}#chart .chart-progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:#f4ead71f;pointer-events:none}#chart .chart-progress span{display:block;height:100%;width:100%;transform:scaleX(0);transform-origin:left center;background:linear-gradient(90deg,#db291f,#ffde99,#7eedfa,#5c8fff);box-shadow:0 0 12px #7eedfacc}#chart .chart-pause,#chart .chart-results{background:#00000075;text-align:center;align-items:center}#chart .chart-actions{display:flex;gap:10px;margin-top:1.2rem}#chart .chart-grade{margin:0;font-family:Bodoni Moda,Didot,serif;font-style:italic;font-weight:500;font-size:clamp(6rem,16vw,9rem);line-height:.8;text-shadow:0 0 24px rgba(255,222,153,.85),0 0 60px rgba(92,143,255,.35)}#chart .chart-result-name,#chart .chart-result-line,#chart .chart-result-counts{margin:.4rem 0 0}@media(max-width:700px){#chart .chart-sheet.is-playing .chart-hud{top:58px}#chart .chart-grooves{grid-template-columns:1fr}#chart .chart-menu{overflow:auto;justify-content:flex-start;padding-top:58px}}@media(prefers-reduced-motion:reduce){#chart .chart-judge.chart-judge-on{animation:none;opacity:1}}