:root{--red:#d52b1e;--red-bright:#ff3b2f;--white:#f5f5f0;--ink:#0a0e14;--ink-2:#111722;--pitch:#1f7a4d;--muted:#8b94a3}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{color:var(--white);background:radial-gradient(1200px 600px at 50% -10%, #d52b1e38, transparent 60%), linear-gradient(180deg, var(--ink-2), var(--ink));justify-content:center;align-items:center;min-height:100dvh;font-family:Sora,system-ui,sans-serif;display:flex;position:relative;overflow:hidden}body:after{content:"";pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");position:fixed;inset:0}.stage{z-index:2;text-align:center;width:min(440px,94vw);position:relative}.screen{animation:.5s both fade}@keyframes fade{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.kicker{letter-spacing:.18em;color:var(--red-bright);text-transform:uppercase;margin-bottom:10px;font-family:Anton,sans-serif;font-size:.8rem}h1{text-transform:uppercase;font-family:Anton,sans-serif;font-weight:400;line-height:.95}.title-xl{font-size:clamp(2.4rem,11vw,4rem)}.sub{color:var(--muted);white-space:pre-line;max-width:32ch;margin:16px auto 0;line-height:1.55}.btn{letter-spacing:.08em;text-transform:uppercase;background:var(--red);color:#fff;cursor:pointer;border:none;border-radius:999px;margin-top:26px;padding:15px 30px;font-family:Anton,sans-serif;font-size:1.1rem;transition:transform .15s,background .15s;box-shadow:0 10px 30px #d52b1e73}.btn:hover{background:var(--red-bright);transform:translateY(-2px)}.btn:active{transform:translateY(0)}.start-row{flex-direction:column;align-items:center;gap:10px;display:flex}.btn-ghost{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);cursor:pointer;background:0 0;border:1px solid #ffffff2e;border-radius:999px;padding:9px 22px;font-family:Anton,sans-serif;font-size:.9rem;transition:all .15s}.btn-ghost:hover{color:#fff;border-color:var(--red);background:#d52b1e26}.hud{grid-template-columns:1fr auto 1fr;align-items:center;margin:0 4px 10px;display:grid}.hud-left{justify-self:start;align-items:center;gap:10px;display:inline-flex}.hud-right{justify-self:end}.combo{color:#ffd23f;text-shadow:0 0 12px #ffd23f80;font-family:Anton,sans-serif;font-size:1.15rem;animation:.3s cubic-bezier(.2,.9,.2,1.4) comboPop}.streak{color:#ff8a3d;font-family:Anton,sans-serif;font-size:1.1rem}@keyframes comboPop{0%{opacity:0;transform:scale(.4)}70%{transform:scale(1.2)}to{opacity:1;transform:scale(1)}}.hud .pts{color:#fff;font-family:Anton,sans-serif;font-size:1.5rem}.hud .pts b{color:var(--red-bright)}.hud .goal-of{letter-spacing:.16em;color:var(--muted);text-transform:uppercase;font-size:.72rem}.restart-btn{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);cursor:pointer;background:#ffffff0f;border:1px solid #ffffff24;border-radius:999px;padding:7px 14px;font-family:Anton,sans-serif;font-size:.82rem;transition:all .15s}.restart-btn:hover{color:#fff;border-color:var(--red);background:#d52b1e40}.bar{background:#ffffff1a;border-radius:99px;height:8px;margin:0 4px 10px;overflow:hidden}.bar>i{background:linear-gradient(90deg, var(--red), var(--red-bright));border-radius:99px;width:0;height:100%;transition:width .35s cubic-bezier(.2,.8,.2,1);display:block}canvas#game{touch-action:none;cursor:crosshair;background:#0d3b24;border-radius:16px;width:100%;height:auto;display:block;box-shadow:0 20px 50px #00000080}.hint{color:var(--muted);letter-spacing:.02em;min-height:20px;margin-top:12px;font-size:.85rem}.hint b{color:#fff}.gift-emoji{margin:8px auto 16px;font-size:clamp(4rem,18vw,6rem);line-height:1;animation:.7s cubic-bezier(.2,.8,.2,1.1) both drop}@keyframes drop{0%{opacity:0;transform:translateY(-60px)rotate(-4deg)}to{opacity:1;transform:none}}.reveal h1{font-size:clamp(1.9rem,9vw,3.2rem)}.reveal .msg{color:#e8e8e2;white-space:pre-line;max-width:36ch;margin:16px auto 0;line-height:1.7}.small{color:var(--muted);letter-spacing:.04em;margin-top:22px;font-size:.8rem}.best-streak{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin-top:16px;font-family:Anton,sans-serif;font-size:.8rem}.seg{background:#ffffff12;border:1px solid #ffffff1f;border-radius:999px;grid-template-columns:repeat(2,1fr);margin-top:24px;padding:4px;display:inline-grid;position:relative}.seg-btn{z-index:1;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);cursor:pointer;background:0 0;border:none;border-radius:999px;padding:10px 24px;font-family:Anton,sans-serif;font-size:.95rem;transition:color .2s;position:relative}.seg-btn.active{color:#fff}.seg-ind{background:var(--red);z-index:0;pointer-events:none;border-radius:999px;width:calc(50% - 4px);transition:transform .3s cubic-bezier(.2,.8,.2,1);position:absolute;top:4px;bottom:4px;left:4px;box-shadow:0 6px 18px #d52b1e66}.seg-hard .seg-ind{transform:translate(100%)}.seg-note{color:var(--muted);min-height:18px;margin-top:10px;font-size:.8rem;animation:.3s segNoteFade}@keyframes segNoteFade{0%{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}.lang{z-index:60;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#00000073;border:1px solid #ffffff29;border-radius:999px;gap:3px;padding:3px;display:inline-flex;position:fixed;top:14px;right:14px}.lang-btn{letter-spacing:.08em;color:var(--muted);cursor:pointer;background:0 0;border:none;border-radius:999px;padding:6px 12px;font-family:Anton,sans-serif;font-size:.8rem;transition:all .15s}.lang-btn.active{background:var(--red);color:#fff}.debug{z-index:60;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);cursor:pointer;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);opacity:.45;background:#00000059;border:1px solid #ffffff1a;border-radius:999px;align-items:center;gap:6px;padding:3px 8px;font-family:Anton,sans-serif;font-size:.55rem;transition:all .15s;display:inline-flex;position:fixed;bottom:8px;left:8px}.debug:hover{opacity:1;color:#fff}.debug .dot{background:#ffffff2e;border-radius:999px;width:20px;height:11px;transition:all .18s;position:relative}.debug .dot:after{content:"";background:#fff;border-radius:50%;width:7px;height:7px;transition:all .18s;position:absolute;top:2px;left:2px}.debug.on{opacity:.8;color:#fff;border-color:var(--red)}.debug.on:hover{opacity:1}.debug.on .dot{background:var(--red)}.debug.on .dot:after{left:11px}canvas#confetti{pointer-events:none;z-index:40;position:fixed;inset:0}.flash{z-index:50;justify-content:center;align-items:center;display:none;position:fixed;inset:0}.flash.show{animation:.12s flashIn;display:flex}.flash span{color:#fff;letter-spacing:.04em;font-family:Anton,sans-serif;font-size:clamp(2.4rem,14vw,5.5rem);animation:.55s cubic-bezier(.2,.9,.2,1.3) goalText}.flash.goal{background:#d52b1ed9}.flash.miss{background:#0a0e14db}.flash.miss span{color:var(--red-bright)}@keyframes flashIn{0%{opacity:0}to{opacity:1}}@keyframes goalText{0%{opacity:0;transform:scale(.3)rotate(-5deg)}60%{transform:scale(1.1)}to{opacity:1;transform:scale(1)}}