:root{--bg:#0a0a14;--panel:#121222;--cell:#23233f;--cell-border:#3d3d68;--neon:#00f0ff;--neon-dim:#00f0ff59;--magenta:#ff2d95;--lime:#b6ff00;--done:#101020;--done-text:#3a3a5c;--text:#e8e8ff;font-size:16px}*{box-sizing:border-box;margin:0;padding:0}body{background:radial-gradient(ellipse at 50% -20%, #1c1040 0%, transparent 60%), radial-gradient(ellipse at 80% 110%, #041a2e 0%, transparent 55%), var(--bg);min-height:100dvh;color:var(--text);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;flex-direction:column;align-items:center;padding:1rem .75rem 2rem;font-family:SF Mono,Menlo,Consolas,monospace;display:flex}h1{letter-spacing:.35em;text-transform:uppercase;color:var(--neon);text-shadow:0 0 8px var(--neon-dim), 0 0 30px var(--neon-dim);text-align:center;margin-bottom:.25rem;font-size:clamp(1.2rem,4vw,2rem)}.subtitle{color:#7a7aa8;letter-spacing:.15em;text-align:center;margin-bottom:.9rem;font-size:clamp(.6rem,2vw,.8rem)}.hud{flex-wrap:wrap;justify-content:center;align-items:stretch;gap:.5rem;margin-bottom:.75rem;display:flex}.hud-box{background:var(--panel);border:1px solid var(--cell-border);text-align:center;border-radius:10px;min-width:5.8rem;padding:.4rem .9rem}.hud-label{letter-spacing:.2em;text-transform:uppercase;color:#7a7aa8;margin-bottom:.15rem;font-size:.6rem}.hud-value{font-variant-numeric:tabular-nums;font-size:clamp(1.15rem,4vw,1.5rem);font-weight:700;line-height:1.2}#next-value{color:var(--lime);text-shadow:0 0 12px #b6ff0080}#timer-value{color:var(--neon);text-shadow:0 0 12px var(--neon-dim)}#best-value{color:var(--magenta);text-shadow:0 0 12px #ff2d9566}.controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;margin-bottom:.9rem;display:flex}.size-picker{background:var(--panel);border:1px solid var(--cell-border);border-radius:10px;display:flex;overflow:hidden}.size-btn{color:#7a7aa8;letter-spacing:.08em;cursor:pointer;background:0 0;border:none;padding:.55rem .9rem;font-family:inherit;font-size:.8rem;font-weight:700;transition:background .15s,color .15s}.size-btn:not(:last-child){border-right:1px solid var(--cell-border)}.size-btn.active{color:var(--neon);text-shadow:0 0 10px var(--neon-dim);background:#00f0ff1f}.ctrl-btn{border:1px solid var(--neon);color:var(--neon);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;background:0 0;border-radius:10px;padding:.55rem 1.1rem;font-family:inherit;font-size:.8rem;transition:background .15s,box-shadow .15s}.ctrl-btn:hover{box-shadow:0 0 14px var(--neon-dim);background:#00f0ff1a}.ctrl-btn.danger{border-color:var(--magenta);color:var(--magenta)}.ctrl-btn.danger:hover{background:#ff2d951a;box-shadow:0 0 14px #ff2d9559}#mute{min-width:3rem}svg.lucide{vertical-align:-.18em;width:1.1em;height:1.1em}#mute svg.lucide{width:1.15rem;height:1.15rem}.btn-row{gap:.5rem;display:flex}.btn-row .ctrl-btn{white-space:nowrap;flex:1;justify-content:center;align-items:center;gap:.45rem;padding-left:.5rem;padding-right:.5rem;font-size:.75rem;display:inline-flex}body.in-pvp #size-picker,body.in-pvp #restart,body.in-pvp #daily-open,body.in-pvp #pvp-open,body:not(.in-pvp) #pvp-leave,body.in-ghost #size-picker,body.in-ghost #restart,body.in-ghost #daily-open,body.in-ghost #pvp-open,body:not(.in-ghost) #ghost-exit,body.in-daily #size-picker,body.in-daily #restart,body.in-daily #daily-open,body.in-daily #pvp-open,body:not(.in-daily) #daily-quit{display:none}#progress-track{background:var(--panel);border:1px solid var(--cell-border);border-radius:99px;width:min(94vw,620px);height:8px;margin-bottom:.9rem;position:relative;overflow:hidden}#progress-fill{background:linear-gradient(90deg, var(--neon), var(--lime));width:0%;height:100%;box-shadow:0 0 10px var(--neon-dim);border-radius:99px;transition:width .15s ease-out}#progress-track.milestone-pulse{animation:.6s ease-out milestone-glow}@keyframes milestone-glow{0%{box-shadow:0 0 #b6ff0000}30%{box-shadow:0 0 24px #b6ff00e6}to{box-shadow:0 0 #b6ff0000}}#opponents{flex-direction:column;gap:.3rem;width:min(94vw,620px);display:flex}#opponents:not(:empty){margin-bottom:.9rem}.opp-row{letter-spacing:.08em;grid-template-columns:7rem 1fr 4.5rem;align-items:center;gap:.6rem;font-size:.7rem;display:grid}.opp-name{text-overflow:ellipsis;white-space:nowrap;color:#9a9ac8;text-transform:uppercase;overflow:hidden}.opp-row.self .opp-name{color:var(--lime)}.opp-bar{background:var(--panel);border:1px solid var(--cell-border);border-radius:99px;height:6px;overflow:hidden}.opp-fill{background:linear-gradient(90deg, var(--magenta), var(--neon));width:0%;height:100%;transition:width .2s ease-out}.opp-row.self .opp-fill{background:linear-gradient(90deg, var(--neon), var(--lime))}.opp-row.ghost .opp-name{color:var(--magenta)}.opp-row.ghost .opp-fill{background:linear-gradient(90deg, #8a5cff, var(--magenta))}.opp-status{text-align:right;color:#9a9ac8;font-variant-numeric:tabular-nums}#milestone-flash{pointer-events:none;opacity:0;z-index:5;background:radial-gradient(#b6ff001f 0%,#0000 70%);position:fixed;inset:0}#milestone-flash.flash{animation:.5s ease-out screen-flash}@keyframes screen-flash{0%{opacity:0}25%{opacity:1}to{opacity:0}}#grid-wrap{width:min(94vw,620px);position:relative}#grid{grid-template-columns:repeat(var(--size), 1fr);gap:5px;width:100%;display:grid}#grid.concealed .square{filter:blur(.45em);opacity:.65;pointer-events:none}#grid-veil{z-index:4;background:radial-gradient(#05050f8c 0%,#05050f40 100%);border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:.9rem;display:none;position:absolute;inset:0}#grid-veil.visible{display:flex}body.in-pvp #grid-veil{display:none}#grid-veil .btn-primary{box-shadow:0 0 24px var(--neon-dim);align-items:center;gap:.5rem;display:inline-flex}.square{aspect-ratio:1;background:var(--cell);border:1px solid var(--cell-border);color:#fff;text-shadow:0 0 6px #e8e8ff66;cursor:pointer;font-variant-numeric:tabular-nums;border-radius:8px;justify-content:center;align-items:center;padding:0;font-family:inherit;font-weight:700;transition:background .1s,transform 80ms,color .1s,border-color .1s;display:flex}.square:before{content:attr(data-n)}#grid.size-5 .square{border-radius:12px;font-size:clamp(1.3rem,6vw,2rem)}#grid.size-6 .square{border-radius:11px;font-size:clamp(1.15rem,5vw,1.75rem)}#grid.size-7 .square{border-radius:10px;font-size:clamp(1rem,4.2vw,1.5rem)}#grid.size-8 .square{border-radius:9px;font-size:clamp(.95rem,3.7vw,1.35rem)}#grid.size-9 .square{font-size:clamp(.85rem,3.2vw,1.25rem)}#grid.size-10 .square{font-size:clamp(.8rem,2.8vw,1.15rem)}@media (hover:hover){.square:hover:not(.done){border-color:var(--neon-dim);background:#2e2e55;transform:scale(1.06)}}.square.done{background:var(--done);color:var(--done-text);text-shadow:none;cursor:default;border-color:#0000;transform:scale(.94)}.square.correct-flash{animation:.3s ease-out correct-pop}@keyframes correct-pop{0%{background:var(--lime);color:#0a0a14;box-shadow:0 0 20px #b6ff00cc}to{background:var(--done)}}.square.wrong{animation:.3s ease-in-out wrong-shake}@keyframes wrong-shake{0%,to{background:var(--cell);transform:translate(0)}20%,60%{border-color:var(--magenta);background:#4a1030;transform:translate(-4px)}40%,80%{border-color:var(--magenta);background:#4a1030;transform:translate(4px)}}.overlay{z-index:10;background:#05050fd9;justify-content:center;align-items:center;padding:1rem;display:none;position:fixed;inset:0}.overlay.visible{display:flex}.overlay.transparent{pointer-events:none;background:0 0}.card{background:var(--panel);border:1px solid var(--neon);text-align:center;box-shadow:0 0 40px var(--neon-dim);border-radius:16px;flex-direction:column;gap:.75rem;width:24rem;max-width:100%;padding:clamp(1.5rem,5vw,2.5rem) clamp(1.75rem,6vw,3rem);animation:.35s ease-out card-in;display:flex}@keyframes card-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.card h2{color:var(--lime);letter-spacing:.25em;text-transform:uppercase;text-shadow:0 0 16px #b6ff0080;font-size:clamp(1.1rem,4vw,1.4rem)}#results-title.win,#ghost-results-title.win{animation:.5s ease-out win-pop}#results-title.lose,#ghost-results-title.lose{color:var(--magenta);text-shadow:0 0 16px #ff2d9580}@keyframes win-pop{0%{opacity:0;transform:scale(1.5)}60%{opacity:1;transform:scale(.95)}to{transform:scale(1)}}.final-time{color:var(--neon);text-shadow:0 0 20px var(--neon-dim);font-variant-numeric:tabular-nums;font-size:clamp(2.2rem,9vw,3rem);font-weight:700}.record{color:var(--magenta);letter-spacing:.15em;min-height:1.2em;font-size:.9rem}.btn-primary{background:var(--neon);color:#0a0a14;letter-spacing:.15em;text-transform:uppercase;cursor:pointer;border:none;border-radius:10px;padding:.7rem 2rem;font-family:inherit;font-size:.9rem;font-weight:700}.btn-primary:hover{box-shadow:0 0 20px var(--neon-dim)}.btn-primary:disabled{opacity:.4;cursor:default;box-shadow:none}.btn-text{color:#7a7aa8;letter-spacing:.15em;text-transform:uppercase;cursor:pointer;background:0 0;border:none;font-family:inherit;font-size:.75rem}.btn-text:hover{color:var(--text)}.field-label{letter-spacing:.2em;text-transform:uppercase;color:#7a7aa8;text-align:left;font-size:.65rem}.card input{background:var(--bg);border:1px solid var(--cell-border);color:var(--text);letter-spacing:.1em;border-radius:10px;outline:none;padding:.6rem .9rem;font-family:inherit;font-size:1rem}.card input:focus{border-color:var(--neon);box-shadow:0 0 10px var(--neon-dim)}#code-input{text-transform:uppercase;letter-spacing:.5em;text-align:center}.divider{color:#7a7aa8;letter-spacing:.2em;font-size:.7rem}.error-msg{color:var(--magenta);letter-spacing:.1em;min-height:1em;font-size:.75rem}.hint{color:#7a7aa8;letter-spacing:.15em;font-size:.7rem}.players-list,.results-list{text-align:left;flex-direction:column;gap:.4rem;list-style:none;display:flex}.players-list li,.results-list li{background:var(--bg);border:1px solid var(--cell-border);border-radius:8px;justify-content:space-between;gap:.5rem;padding:.5rem .8rem;font-size:.85rem;display:flex}.players-list li.self,.results-list li.self{border-color:var(--lime);color:var(--lime)}.badge{color:#7a7aa8;letter-spacing:.15em;text-transform:uppercase;align-self:center;align-items:center;gap:.45rem;font-size:.65rem;display:inline-flex}.ready-state{color:#7a7aa8;display:inline-flex}.ready-state svg.lucide{width:.9rem;height:.9rem}.ready-state.is-ready{color:var(--lime)}#ready-toggle.is-ready{border:1px solid var(--lime);color:var(--lime);background:0 0}#start-race.override:not(:disabled){border:1px solid var(--magenta);color:var(--magenta);background:0 0}#start-race.override:not(:disabled):hover{box-shadow:0 0 20px #ff2d9566}.card .size-picker{width:100%}.card .size-btn{flex:1;padding:.5rem .15rem;font-size:.7rem}.results-list .r-name{align-items:center;gap:.5rem;min-width:0;display:inline-flex}.results-list .r-time{font-variant-numeric:tabular-nums;color:var(--neon);align-self:center}.rank{border:1px solid var(--cell-border);color:#9a9ac8;border-radius:50%;flex:none;justify-content:center;align-items:center;width:1.5rem;height:1.5rem;font-size:.7rem;display:inline-flex}.rank svg.lucide{width:.85rem;height:.85rem}.rank-1{color:#ffd75e;border-color:#ffd75e;box-shadow:0 0 10px #ffd75e59}.rank-2{color:#c9d1e8;border-color:#c9d1e8}.rank-3{color:#d98c4a;border-color:#d98c4a}#toast{white-space:nowrap;background:var(--panel);border:1px solid var(--magenta);color:var(--magenta);letter-spacing:.12em;text-transform:uppercase;pointer-events:none;z-index:20;border-radius:10px;align-items:center;gap:.5rem;padding:.6rem 1.2rem;font-size:.8rem;transition:transform .3s;display:inline-flex;position:fixed;top:.9rem;left:50%;transform:translate(-50%,-250%);box-shadow:0 0 20px #ff2d9559}#toast.show{transform:translate(-50%)}.countdown-text{color:var(--lime);text-shadow:0 0 40px #b6ff00b3,0 0 80px #b6ff0066;font-size:clamp(5rem,25vw,10rem);font-weight:700;animation:.4s ease-out count-pop}@keyframes count-pop{0%{opacity:.2;transform:scale(1.6)}to{opacity:1;transform:scale(1)}}