:root{--bg: #111113;--bg-2: #16161a;--surface: #1c1c21;--surface-2: #25252b;--line: #2f2f37;--text: #eeeeea;--muted: #9a9aa3;--dim: #6b6b74;--player: #96de28;--player-ink: #0f1a04;--danger: #ff4d6d;--accent: #96c8f0;--amber: #ffc24b;--radius: 16px;--radius-sm: 10px;--font: "Inter", "Roboto", system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif;--mono: "Roboto Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;--ease: cubic-bezier(.2, .8, .2, 1);color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}body{overflow-x:hidden}button,input{font:inherit;color:inherit}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.muted{color:var(--muted)}.noscript{padding:2rem;text-align:center}:focus-visible{outline:3px solid var(--accent);outline-offset:3px}kbd{display:inline-block;font-family:var(--font);font-size:.68em;font-weight:700;letter-spacing:.04em;padding:.18em .5em;border-radius:6px;background:#0000002e;border:1px solid rgba(0,0,0,.18);vertical-align:.15em;margin-left:.5em;text-transform:none}.btn-ghost kbd{background:#ffffff0f;border-color:#ffffff14;color:var(--muted)}.screen{min-height:100vh;min-height:100dvh;animation:screen-in .35s var(--ease)}@keyframes screen-in{0%{opacity:0;transform:translateY(6px)}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border:0;border-radius:14px;padding:.8rem 1.3rem;font-weight:800;letter-spacing:.01em;cursor:pointer;transition:transform .12s var(--ease),box-shadow .2s var(--ease),background .2s;user-select:none;white-space:nowrap}.btn:active{transform:translateY(2px) scale(.99)}.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.btn-play{background:var(--player);color:var(--player-ink);box-shadow:0 6px #5f9a10,0 14px 30px -10px #96de288c;text-transform:uppercase}.btn-play:hover{transform:translateY(-2px);box-shadow:0 8px #5f9a10,0 18px 36px -10px #96de28b3}.btn-play:active{transform:translateY(4px);box-shadow:0 2px #5f9a10,0 8px 18px -10px #96de2899}.btn-xl{font-size:1.45rem;padding:1.05rem 2.2rem;border-radius:18px}.btn-lg{font-size:1.15rem;padding:.95rem 1.8rem}.btn-sm{font-size:.85rem;padding:.55rem .9rem}.btn-ghost{background:var(--surface-2);color:var(--text);box-shadow:inset 0 0 0 1px var(--line)}.btn-ghost:hover{background:#2c2c33}.icon-btn{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:12px;border:0;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);color:var(--text);cursor:pointer;transition:background .15s,transform .12s}.icon-btn:hover{background:var(--surface-2)}.icon-btn:active{transform:scale(.94)}.icon-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}#btn-pause svg{fill:currentColor;stroke:none}#btn-sound .ico-on{display:none}#btn-sound[aria-pressed=true] .ico-on{display:block}#btn-sound[aria-pressed=true] .ico-off{display:none}#btn-sound[aria-pressed=true]{color:var(--player)}.logo-dot{display:inline-block;width:.72em;height:.72em;border-radius:50%;background:var(--player);box-shadow:0 0 0 .08em #96de2826,0 0 .6em #96de288c;vertical-align:baseline;margin:0 .03em;animation:dot-bob 2.4s ease-in-out infinite}@keyframes dot-bob{50%{transform:translateY(-.06em) scale(1.04)}}.logo{margin:0;font-weight:900;line-height:.86;letter-spacing:-.035em;font-size:clamp(3rem,7.2vw,6.2rem);text-transform:uppercase;display:flex;flex-direction:column}.logo-fall{display:inline-block;color:var(--danger);transform-origin:50% 100%;animation:letter-fall 4s ease-in-out infinite}@keyframes letter-fall{0%,70%,to{transform:none}80%{transform:translateY(.04em) rotate(6deg)}90%{transform:translateY(-.02em) rotate(-3deg)}}.tagline{margin:1.1rem 0 0;font-size:clamp(1.05rem,1.6vw,1.3rem);color:var(--muted);font-weight:500}.home{display:flex;flex-direction:column;max-width:1160px;margin:0 auto;padding:0 clamp(16px,4vw,48px)}.topbar{display:flex;justify-content:space-between;align-items:center;padding:18px 0 6px}.topbar-note{font-size:.8rem;color:var(--dim);letter-spacing:.02em}.home-main{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,1fr);gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(12px,3vh,36px) 0 clamp(24px,4vh,48px)}.hero{position:relative}.hero-art{position:absolute;inset:-40px -20px auto auto;width:300px;height:200px;opacity:.55;pointer-events:none;mask-image:radial-gradient(closest-side,#000 40%,transparent);-webkit-mask-image:radial-gradient(closest-side,#000 40%,transparent)}.mini-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;width:100%;height:100%}.mini-grid span{border-radius:4px;background:var(--surface-2);transition:background .4s}.mini-grid span.w{background:#5a2232}.mini-grid span.d{background:var(--danger)}.cta{display:flex;flex-wrap:wrap;gap:16px;align-items:stretch;margin-top:clamp(22px,4vh,36px)}.btn-daily{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);border-radius:18px;padding:.7rem 1.2rem .7rem .8rem;text-align:left;gap:.8rem}.btn-daily:hover{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--accent)}.daily-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#96c8f01f;color:var(--accent)}.daily-icon svg{width:22px;height:22px}.daily-text{display:flex;flex-direction:column;gap:2px}.daily-title{font-weight:800;font-size:1.05rem}.daily-sub{font-weight:500;font-size:.82rem;color:var(--muted)}.card{background:linear-gradient(180deg,var(--surface),var(--bg-2));border-radius:22px;box-shadow:inset 0 0 0 1px var(--line),0 30px 60px -30px #0009}.stats{padding:24px;display:flex;flex-direction:column;gap:18px}.stat{display:flex;flex-direction:column;gap:4px}.stat-label{font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.stat-value{font-weight:900;font-size:3.2rem;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--player)}.stat-value small{font-size:.45em;margin-left:.15em;color:var(--muted)}.stat-value.sm{font-size:1.6rem;color:var(--text)}.stat-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.stat-row .stat{background:#ffffff06;border-radius:14px;padding:12px 14px;box-shadow:inset 0 0 0 1px var(--line)}.records-title{margin:0 0 8px;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.records-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.records-list li{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:8px;padding:7px 10px;border-radius:10px;font-size:.92rem;font-variant-numeric:tabular-nums}.records-list li:nth-child(odd){background:#ffffff06}.records-list .rank{color:var(--dim);font-weight:800}.records-list .time{font-weight:800}.records-list .meta{color:var(--muted);font-size:.8rem}.records-list .tag-daily{color:var(--accent)}.records-list .empty{display:block;color:var(--muted);background:none;padding:6px 0}.records-note{margin:10px 0 0;font-size:.78rem;color:var(--dim)}.howto{padding:8px 0 24px}.howto h2{font-size:1.1rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 16px}.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.step{background:var(--surface);border-radius:18px;padding:20px;box-shadow:inset 0 0 0 1px var(--line)}.step h3{margin:14px 0 6px;font-size:1.1rem}.step p{margin:0;color:var(--muted);line-height:1.45;font-size:.95rem}.step b{color:var(--text)}.step b.red{color:var(--danger)}.step-art{height:64px;display:flex;align-items:center}.keys{display:grid;grid-template-columns:repeat(3,30px);grid-template-rows:repeat(2,30px);gap:4px;align-items:stretch;align-content:center}.key{display:grid;place-items:center;border-radius:7px;background:#34343c;box-shadow:inset 0 -3px #00000059,inset 0 0 0 1px var(--line);font-size:.75rem;font-weight:800}.k-up{grid-column:2;grid-row:1}.k-left{grid-column:1;grid-row:2}.k-down{grid-column:2;grid-row:2}.k-right{grid-column:3;grid-row:2}.tiles{gap:6px}.tiles .t{width:40px;height:40px;border-radius:8px;background:var(--surface-2);position:relative;overflow:hidden}.tiles .t.warn{background:#47202b}.tiles .t.warn:after{content:"";position:absolute;inset:0;margin:auto;width:60%;height:60%;border-radius:6px;background:var(--danger);opacity:.6;animation:warn-grow 1.4s ease-in infinite}@keyframes warn-grow{0%{width:15%;height:15%;opacity:.3}to{width:100%;height:100%;opacity:.85}}.tiles .t.dead{background:var(--danger);box-shadow:0 0 18px #ff4d6d80}.clock span{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;font-weight:900;font-size:.95rem;background:conic-gradient(var(--danger) 0 25%,#ff8a3d 0 50%,var(--amber) 0 75%,var(--accent) 0);position:relative}.clock span:before{content:"";position:absolute;inset:5px;background:var(--surface);border-radius:50%}.clock span{isolation:isolate}.clock span:before{z-index:-1}.footer{margin-top:auto;padding:12px 0 28px;border-top:1px solid var(--line)}.teachers summary{cursor:pointer;color:var(--muted);font-weight:700;font-size:.9rem;padding:8px 0}.teachers-body{color:var(--muted);font-size:.9rem;line-height:1.5;max-width:720px}.teachers-body b{color:var(--text)}.footer-note{font-size:.8rem;color:var(--dim);margin:10px 0 0}.game{display:flex;flex-direction:column;height:100vh;height:100dvh;min-height:0;background:var(--bg)}.hud{flex:none;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:10px clamp(12px,2vw,24px)}.hud-left,.hud-right{display:flex;align-items:center;gap:8px}.hud-right{justify-content:flex-end}.chip,.phase{font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;padding:6px 10px;border-radius:999px;white-space:nowrap}.chip{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);color:var(--muted)}.chip.daily{color:var(--accent);box-shadow:inset 0 0 0 1px #96c8f059}.phase{--phase: var(--accent);color:var(--phase);background:color-mix(in srgb,var(--phase) 14%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--phase) 45%,transparent);transition:color .3s,background .3s}.phase.bump{animation:bump .45s var(--ease)}@keyframes bump{40%{transform:scale(1.18)}}.timer{font-weight:900;font-size:clamp(1.8rem,3.6vw,2.6rem);font-variant-numeric:tabular-nums;letter-spacing:-.02em;line-height:1;min-width:5ch;text-align:center}.timer.pb{color:var(--player);text-shadow:0 0 18px rgba(150,222,40,.45)}.hud-best{font-size:.8rem;font-weight:700;color:var(--muted);letter-spacing:.06em;text-transform:uppercase;margin-right:6px;white-space:nowrap}.hud-best b{color:var(--text);font-variant-numeric:tabular-nums;margin-left:4px}.fps{font-family:var(--mono);font-size:.75rem;color:var(--dim);min-width:6ch}.stage{position:relative;flex:1;min-height:0;margin:0 clamp(8px,1.5vw,20px) clamp(8px,1.5vw,20px)}#game-host{position:absolute;inset:0}#game-host canvas{display:block;border-radius:18px}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:#0a0a0c9e;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:5;animation:fade-in .2s var(--ease)}@keyframes fade-in{0%{opacity:0}}.loader{display:flex;flex-direction:column;align-items:center;gap:10px;color:var(--muted);font-size:2rem}.loader p{font-size:.95rem;margin:0}.panel{background:linear-gradient(180deg,#1f1f25,#18181c);border-radius:24px;box-shadow:inset 0 0 0 1px var(--line),0 40px 80px -20px #000000bf;padding:28px 32px;min-width:min(420px,calc(100vw - 32px));max-width:calc(100vw - 32px);text-align:center;animation:panel-in .32s var(--ease)}@keyframes panel-in{0%{opacity:0;transform:translateY(14px) scale(.97)}}.panel h2{margin:0 0 18px;font-size:1.8rem;font-weight:900}.panel-actions{display:flex;flex-direction:column;gap:10px;margin-top:20px}.panel-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.over-kicker{margin:0;font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--danger)}.over-kicker.daily{color:var(--accent)}.over-time{font-weight:900;font-size:clamp(3.4rem,9vw,5.2rem);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;margin:8px 0 4px}.over-time small{font-size:.38em;color:var(--muted);margin-left:.1em}.over.is-best .over-time{color:var(--player);text-shadow:0 0 30px rgba(150,222,40,.4)}.newbest{display:inline-block;margin:4px 0 2px;padding:6px 14px;border-radius:999px;background:var(--player);color:var(--player-ink);font-weight:900;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;animation:newbest .7s var(--ease) both,glow 1.6s ease-in-out .7s infinite}@keyframes newbest{0%{transform:scale(.3) rotate(-6deg);opacity:0}60%{transform:scale(1.12) rotate(2deg);opacity:1}}@keyframes glow{50%{box-shadow:0 0 26px #96de2899}}.over-compare{margin:6px 0 0;color:var(--muted);font-size:1rem;font-variant-numeric:tabular-nums}.over-compare b{color:var(--text)}.over-meta{display:flex;justify-content:center;gap:18px;margin-top:10px;font-size:.85rem;color:var(--dim)}.over-meta b{color:var(--muted)}.gate{display:grid;place-items:center;padding:16px}.gate-card{width:min(400px,100%);display:flex;flex-direction:column;align-items:center;gap:14px;padding:36px 28px;border-radius:24px;background:linear-gradient(180deg,var(--surface),var(--bg-2));box-shadow:inset 0 0 0 1px var(--line),0 40px 80px -30px #000000b3;text-align:center}.gate-card h1{margin:0;font-size:1.6rem;font-weight:900}.gate-card p{margin:0}.gate-logo{font-size:2.6rem}#gate-input{width:100%;text-align:center;font-size:1.5rem;font-weight:800;letter-spacing:.25em;text-transform:uppercase;padding:14px;border-radius:14px;border:0;background:var(--bg);box-shadow:inset 0 0 0 2px var(--line);outline:none;transition:box-shadow .15s}#gate-input:focus{box-shadow:inset 0 0 0 2px var(--accent)}#gate-input.invalid{box-shadow:inset 0 0 0 2px var(--danger);animation:shake .4s}@keyframes shake{20%,60%{transform:translate(-8px)}40%,80%{transform:translate(8px)}}#gate-submit{width:100%}#gate-submit[disabled]{opacity:.6;pointer-events:none}.gate-error{min-height:1.3em;color:var(--danger);font-weight:600;font-size:.92rem}.dialog{border:0;padding:0;border-radius:22px;background:#1c1c21;color:var(--text);width:min(460px,calc(100vw - 32px));box-shadow:inset 0 0 0 1px var(--line),0 40px 80px -20px #000c}.dialog::backdrop{background:#08080a99;backdrop-filter:blur(4px)}.dialog[open]{animation:panel-in .25s var(--ease)}.dialog-body{padding:18px 22px 22px;display:flex;flex-direction:column;gap:4px}.dialog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.dialog-head h2{margin:0;font-size:1.3rem}.toggle{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);cursor:pointer}.toggle span{display:flex;flex-direction:column;gap:2px}.toggle small{color:var(--muted);font-size:.82rem}.toggle input{position:absolute;opacity:0;pointer-events:none}.toggle i{flex:none;position:relative;width:46px;height:28px;border-radius:999px;background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line);transition:background .2s}.toggle i:after{content:"";position:absolute;top:4px;left:4px;width:20px;height:20px;border-radius:50%;background:#8b8b93;transition:transform .2s var(--ease),background .2s}.toggle input:checked+i{background:#96de2840}.toggle input:checked+i:after{transform:translate(18px);background:var(--player)}.toggle input:focus-visible+i{outline:3px solid var(--accent);outline-offset:2px}.danger-zone{display:flex;align-items:center;gap:12px;margin-top:14px;font-size:.8rem}.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);background:var(--text);color:var(--bg);font-weight:700;padding:12px 18px;border-radius:12px;opacity:0;pointer-events:none;transition:opacity .2s,transform .25s var(--ease);z-index:100;max-width:calc(100vw - 32px);text-align:center}.toast.show{opacity:1;transform:translate(-50%)}@media(max-width:900px){.home-main{grid-template-columns:1fr}.hero-art{display:none}.steps{grid-template-columns:1fr}}@media(max-width:640px){.hud{grid-template-columns:auto 1fr auto}.hud-best,.chip{display:none}.cta .btn{width:100%}.panel{padding:22px 18px}}@media(max-height:560px){.hud{padding-top:6px;padding-bottom:6px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}html.reduced-motion *,html.reduced-motion *:before,html.reduced-motion *:after{animation-duration:.01ms!important;animation-iteration-count:1!important}