:root{--bg: #f4f3ef;--fg: #111111;--muted: #6b6a66;--line: #d9d7d0;--accent: #e4572e}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:var(--bg);color:var(--fg);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}[hidden]{display:none!important}#menu{min-height:100%;display:flex;flex-direction:column;padding:clamp(32px,7vh,72px) clamp(16px,6vw,96px) 20px}.brand{font-size:clamp(56px,13vw,168px);font-weight:800;letter-spacing:-.045em;line-height:.9}.brand .tm{font-size:.16em;font-weight:500;letter-spacing:0;vertical-align:top;margin-left:.15em}.tag{color:var(--muted);margin-top:16px;font-size:18px}.levels{list-style:none;margin-top:clamp(36px,7vh,64px);max-width:720px;border-top:1px solid var(--line)}.level button{all:unset;box-sizing:border-box;cursor:pointer;width:100%;display:grid;grid-template-columns:36px 1fr auto;grid-template-areas:"num name best" "num kind best";column-gap:16px;align-items:baseline;padding:18px 4px;border-bottom:1px solid var(--line)}.level button:hover .name,.level button:focus-visible .name{color:var(--accent)}.level button:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.level .num{grid-area:num;color:var(--muted);font-variant-numeric:tabular-nums}.level .name{grid-area:name;font-size:24px;font-weight:650;letter-spacing:-.01em}.level .kind{grid-area:kind;color:var(--muted);font-size:14px;margin-top:2px}.level .best{grid-area:best;color:var(--muted);font-size:14px;font-variant-numeric:tabular-nums}.soon{color:var(--muted);margin-top:16px}.settings{margin-top:40px;display:flex;flex-wrap:wrap;gap:16px 28px;color:var(--muted);font-size:14px}.settings label{display:flex;gap:8px;align-items:center}.settings input,.settings select{font:inherit;color:var(--fg);background:transparent;border:1px solid var(--line);border-radius:4px;padding:5px 7px}.settings input{width:76px;font-variant-numeric:tabular-nums}.settings input:focus,.settings select:focus{outline:2px solid var(--accent);outline-offset:-1px}.touch-note{display:none;color:var(--muted);font-size:14px;margin-top:20px}@media (hover: none) and (pointer: coarse){.touch-note{display:block}}footer{margin-top:auto;padding-top:48px;font-size:12px;color:var(--muted)}#stage{position:fixed;inset:0;background:#000;cursor:default}#stage canvas{display:block;width:100%;height:100%}#hud{position:absolute;top:18px;left:50%;transform:translate(-50%);display:flex;gap:18px;color:#fff;font-size:20px;font-weight:600;font-variant-numeric:tabular-nums;text-shadow:0 1px 2px rgba(0,0,0,.5);pointer-events:none}#hud-score:not(:empty):before{content:"·";margin-right:18px;opacity:.6}#crosshair{position:absolute;left:50%;top:50%;width:4px;height:4px;margin:-2px 0 0 -2px;border-radius:50%;background:#39ff8a;box-shadow:0 0 0 1px #000000b3;pointer-events:none}#overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0a0a0a8c;color:#fff;text-align:center;padding:16px}#overlay:empty{display:none}#overlay.count{background:none;pointer-events:none}#overlay .big{font-size:clamp(40px,8vw,88px);font-weight:800;letter-spacing:-.03em}#overlay .count-n{font-size:96px;font-weight:800;text-shadow:0 2px 8px rgba(0,0,0,.5)}#overlay .sub{margin-top:10px;font-size:18px;opacity:.8}#overlay .detail{margin-top:6px;font-size:15px;opacity:.7;font-variant-numeric:tabular-nums}#overlay .row{margin-top:28px;display:flex;gap:12px;justify-content:center;flex-wrap:wrap}#overlay button{font:inherit;font-size:15px;font-weight:600;color:#111;background:#fff;border:0;border-radius:4px;padding:10px 18px;cursor:pointer}#overlay button.ghost{color:#fff;background:transparent;box-shadow:inset 0 0 0 1px #ffffff80}#overlay button kbd{font:inherit;font-weight:400;opacity:.55;margin-left:8px}
