:root{--accent:#36e0ff;--accent-dim:#1c7b91;--purple:#9d6bff;--green:#37ff8b;--red:#ff4d6d;--ink:#e8eefc;--ink-dim:#7d8aa6;--panel:#0a0e16d1;--mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;color:var(--ink);font-family:var(--mono);-webkit-font-smoothing:antialiased;background:#05070c;overflow:hidden}#viewport{cursor:none;width:100vw;height:100vh;display:block}#hud{pointer-events:none;-webkit-user-select:none;user-select:none;position:fixed;inset:0}.crosshair{width:22px;height:22px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.crosshair:before,.crosshair:after{content:"";background:var(--accent);box-shadow:0 0 6px var(--accent);position:absolute}.crosshair:before{width:2px;height:100%;top:0;left:50%;transform:translate(-50%)}.crosshair:after{width:100%;height:2px;top:50%;left:0;transform:translateY(-50%)}.crosshair .dot{background:#05070c;width:6px;height:6px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.timer{letter-spacing:.04em;font-variant-numeric:tabular-nums;text-shadow:0 0 18px #36e0ff80;font-size:46px;font-weight:700;position:absolute;top:28px;left:50%;transform:translate(-50%)}.timer[data-state=idle]{color:var(--ink-dim);text-shadow:none}.timer[data-state=finished]{color:var(--green);text-shadow:0 0 22px #37ff8b99}.splits{color:var(--ink-dim);flex-direction:column;align-items:center;gap:4px;font-size:13px;display:flex;position:absolute;top:96px;left:50%;transform:translate(-50%)}.split{font-variant-numeric:tabular-nums;gap:12px;display:flex}.split .label{color:var(--purple);text-align:right;min-width:62px}.split .value{text-align:left;min-width:72px;color:var(--ink)}.split .delta{min-width:70px}.split .delta[data-sign=ahead]{color:var(--green)}.split .delta[data-sign=behind]{color:var(--red)}.speed{text-align:center;width:340px;position:absolute;bottom:42px;left:50%;transform:translate(-50%)}.speed .value{font-variant-numeric:tabular-nums;letter-spacing:.03em;font-size:30px;font-weight:700}.speed .unit{color:var(--ink-dim);margin-left:6px;font-size:13px}.speed .bar{background:#e8eefc1f;height:4px;margin-top:8px;overflow:hidden}.speed .fill{background:linear-gradient(90deg, var(--accent-dim), var(--accent));width:0%;height:100%;box-shadow:0 0 12px var(--accent);transition:width 60ms linear}.speed .fill[data-over=true]{background:linear-gradient(90deg, var(--accent), var(--green));box-shadow:0 0 16px var(--green)}.state{letter-spacing:.08em;flex-direction:column;align-items:flex-end;gap:6px;font-size:12px;display:flex;position:absolute;bottom:42px;right:42px}.chip{color:var(--ink-dim);background:var(--panel);border:1px solid #e8eefc2e;padding:4px 10px}.chip[data-active=true]{color:var(--accent);border-color:var(--accent);box-shadow:0 0 10px #36e0ff59}.board{background:var(--panel);pointer-events:auto;z-index:3;border:1px solid #e8eefc24;min-width:240px;padding:14px 16px;font-size:12px;position:absolute;top:42px;right:42px}.board h2{letter-spacing:.18em;color:var(--ink-dim);margin-bottom:10px;font-size:11px;font-weight:500}.board ol{flex-direction:column;gap:5px;list-style:none;display:flex}.board li{font-variant-numeric:tabular-nums;grid-template-columns:auto 1fr auto 10px;gap:14px;display:grid}.board li[data-run-id]{cursor:pointer;margin:-2px -6px;padding:2px 6px}.board li[data-run-id]:hover{color:var(--accent);background:#36e0ff24}.board li[data-run-id]:hover .who,.board li[data-run-id]:hover .rank{color:var(--accent)}.board .play{color:var(--accent);opacity:0;align-self:center;font-size:9px}.board li[data-run-id]:hover .play{opacity:1}.board .who{color:var(--ink-dim);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.board li[data-self=true] .who,.board li[data-self=true]{color:var(--green)}.board .rank,.board .empty{color:var(--ink-dim)}.replay{background:var(--panel);border:1px solid var(--purple);pointer-events:auto;z-index:3;align-items:center;gap:14px;padding:10px 14px;font-size:12px;display:flex;position:absolute;top:42px;left:42px;box-shadow:0 0 18px #9d6bff40}.replay[hidden]{display:none}.replay .tag{color:var(--purple);letter-spacing:.18em;font-weight:700}.replay .label{color:var(--ink);font-variant-numeric:tabular-nums}.replay .sub{color:var(--ink-dim)}.replay .exit{font-family:var(--mono);letter-spacing:.1em;color:var(--ink);cursor:pointer;background:#e8eefc14;border:1px solid #e8eefc3d;padding:5px 10px;font-size:11px}.replay .exit:hover{border-color:var(--accent);color:var(--accent)}.overlay{z-index:2;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);pointer-events:auto;cursor:pointer;background:radial-gradient(circle at 50% 45%,#05070c8c,#05070cf0);place-items:center;display:grid;position:absolute;inset:0}.overlay[hidden]{display:none}.overlay .inner{text-align:center;max-width:520px}.overlay .title{letter-spacing:.22em;color:var(--ink);text-shadow:0 0 30px #36e0ff73;font-size:64px;font-weight:800}.overlay .sub{color:var(--accent);letter-spacing:.2em;margin-top:10px;font-size:13px}.namefield{flex-direction:column;align-items:center;gap:8px;margin-top:28px;display:flex}.namefield span{letter-spacing:.18em;color:var(--ink-dim);font-size:10px}.namefield input{text-align:center;width:220px;font-family:var(--mono);letter-spacing:.1em;color:var(--ink);background:#e8eefc0f;border:1px solid #e8eefc2e;outline:none;padding:8px 12px;font-size:14px}.namefield input:focus{border-color:var(--accent);box-shadow:0 0 10px #36e0ff4d}.overlay .keys{color:var(--ink-dim);text-align:left;grid-template-columns:auto auto;gap:8px 22px;margin-top:30px;font-size:13px;display:grid}.overlay .keys b{color:var(--ink);font-weight:600}.overlay .cta{color:var(--ink);letter-spacing:.12em;margin-top:34px;font-size:14px;animation:1.9s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:.55}50%{opacity:1}}