:root{--bg:#07090f;--bg-2:#0c1019;--surface:#11162370;--surface-solid:#111623;--line:#1c2436;--line-bright:#2c3a55;--ink:#e8ecf3;--ink-dim:#8893a8;--ink-mute:#4b5571;--gold:#d6a64a;--gold-bright:#f3c969;--danger:#ef4444;--success:#4ade80}[data-game=valorant]{--gold:#ff4655;--gold-bright:#ff7a84;--found:#ff4655;--bg:#0f1923;--bg-2:#151f2b;--surface-solid:#1a242e;--line:#1e2d3d;--line-bright:#2a3d52}[data-game=valorant][data-theme=light]{--bg:#ece8e1;--bg-2:#ddd8cf;--surface-solid:#f5f0e8;--line:#ccc5b6;--line-bright:#b8ae9c;--gold:#ff4655;--gold-bright:#c23}[data-game=overwatch]{--gold:#f99e1a;--gold-bright:#ffbc3b;--bg:#0d0f14;--bg-2:#14161c;--surface-solid:#191b22;--line:#21242e;--line-bright:#2e3240}[data-game=overwatch][data-theme=light]{--bg:#f0ece3;--bg-2:#e8e3d8;--surface-solid:#faf7f0;--line:#d6cfc0;--line-bright:#c0b8a4;--gold:#c97c00;--gold-bright:#a86200}[data-theme=light]{--bg:#f1ece1;--bg-2:#e8e1d0;--surface:#ffffff80;--surface-solid:#fff;--line:#d8d0bd;--line-bright:#b9ad91;--ink:#1a1814;--ink-dim:#5f5849;--ink-mute:#8a8270;--gold:#8a6b1e;--gold-bright:#b78919}*{box-sizing:border-box}html{overflow-anchor:none}html,body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;min-height:100vh;margin:0;padding:0;font-family:Space Grotesk,system-ui,sans-serif}body{background:radial-gradient(ellipse 80% 50% at 50% -10%, color-mix(in oklab, var(--gold) 8%, transparent), transparent 60%), linear-gradient(180deg, var(--bg-2), var(--bg) 40%);background-attachment:fixed}body:before{content:"";background-image:linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);opacity:.18;pointer-events:none;z-index:0;background-size:56px 56px;position:fixed;inset:0;-webkit-mask-image:radial-gradient(#000 30%,#0000 80%);mask-image:radial-gradient(#000 30%,#0000 80%)}.app{z-index:1;max-width:1480px;margin:0 auto;padding:28px 32px 80px;position:relative}.topbar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:24px;margin-bottom:28px;padding-bottom:18px;display:flex}.brand{align-items:center;gap:14px;display:flex}.brand-mark{background:var(--gold);width:38px;height:38px;color:var(--bg);clip-path:polygon(12% 0,100% 0,100% 88%,88% 100%,0 100%,0 12%);letter-spacing:.04em;flex-shrink:0;place-items:center;font-family:Anton,sans-serif;font-size:22px;display:grid}.brand-text{letter-spacing:.18em;text-transform:uppercase;font-family:Anton,sans-serif;font-size:24px}.brand-text .accent{color:var(--gold-bright)}.brand-sub{letter-spacing:.22em;color:var(--ink-dim);text-transform:uppercase;margin-top:3px;font-family:JetBrains Mono,monospace;font-size:10px}.season-chip{letter-spacing:.2em;color:var(--ink-dim);border:1px solid var(--line-bright);text-transform:uppercase;padding:6px 10px;font-family:JetBrains Mono,monospace;font-size:11px}.topbar-right{align-items:center;gap:12px;display:flex}.icon-btn{border:1px solid var(--line-bright);color:var(--ink-dim);letter-spacing:.18em;text-transform:uppercase;cursor:pointer;background:0 0;padding:9px 14px;font-family:JetBrains Mono,monospace;font-size:11px;transition:all .16s}.icon-btn:hover{color:var(--ink);border-color:var(--gold);background:color-mix(in oklab, var(--gold) 8%, transparent)}.theme-btn{border:1px solid var(--line-bright);color:var(--ink-dim);cursor:pointer;background:0 0;place-items:center;width:36px;height:36px;font-size:16px;transition:all .16s;display:grid}.theme-btn:hover{border-color:var(--gold);background:color-mix(in oklab, var(--gold) 8%, transparent)}.lang-btn{border:1px solid var(--line-bright);color:var(--ink-dim);cursor:pointer;background:0 0;place-items:center;width:36px;height:36px;font-size:18px;line-height:1;transition:all .16s;display:grid}.lang-btn:hover{border-color:var(--gold);background:color-mix(in oklab, var(--gold) 8%, transparent)}.game-btn{border:1px solid var(--line-bright);color:var(--ink-mute);cursor:pointer;background:0 0;place-items:center;width:36px;height:36px;transition:all .16s;display:grid}.game-btn:hover{color:var(--ink);border-color:var(--gold);background:color-mix(in oklab, var(--gold) 8%, transparent)}.game-btn.active{color:var(--gold-bright);border-color:var(--gold);background:color-mix(in oklab, var(--gold) 12%, transparent)}.game-dropdown{position:relative}.game-menu{background:var(--surface-solid);border:1px solid var(--line-bright);z-index:100;flex-direction:column;min-width:140px;display:flex;position:absolute;top:calc(100% + 6px);right:0}.game-menu-item{color:var(--ink-dim);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;gap:8px;padding:8px 12px;font-family:JetBrains Mono,monospace;font-size:11px;transition:background .12s,color .12s;display:flex}.game-menu-item:hover{background:color-mix(in oklab, var(--gold) 8%, transparent);color:var(--ink)}.game-menu-item.current{color:var(--gold-bright)}.game-menu-mark{text-align:center;width:16px;color:var(--gold-bright);opacity:.7;font-family:Anton,sans-serif;font-size:14px}.game-menu-item.current .game-menu-mark{opacity:1}.burger-dropdown{position:relative}.burger-btn{border:1px solid var(--line-bright);color:var(--ink-dim);cursor:pointer;background:0 0;place-items:center;width:36px;height:36px;font-size:18px;transition:all .16s;display:none}.burger-btn:hover{border-color:var(--gold);background:color-mix(in oklab, var(--gold) 8%, transparent)}.burger-menu{background:var(--surface-solid);border:1px solid var(--line-bright);z-index:100;flex-direction:column;min-width:160px;display:flex;position:absolute;top:calc(100% + 6px);right:0}.burger-menu-item{color:var(--ink-dim);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;text-align:left;background:0 0;border:none;align-items:center;padding:10px 14px;font-family:JetBrains Mono,monospace;font-size:11px;transition:background .12s,color .12s;display:flex}.burger-menu-item:hover{background:color-mix(in oklab, var(--gold) 8%, transparent);color:var(--ink)}.sticky-command{z-index:10;margin-bottom:24px;position:sticky;top:8px;overflow:visible}.command-bar{background:var(--surface);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--line-bright);align-items:stretch;transition:border-color .2s;display:flex}.command-bar.shake{animation:.32s shake}.command-bar.flash-correct{border-color:var(--success);box-shadow:0 0 0 3px color-mix(in oklab, var(--success) 22%, transparent)}.command-bar.flash-wrong{border-color:var(--danger)}.cmd-stat{border-right:1px solid var(--line);flex-direction:column;flex-shrink:0;justify-content:center;gap:2px;padding:0 20px;display:flex}.cmd-stat:last-child{border-right:0;border-left:1px solid var(--line)}.cmd-lbl{letter-spacing:.28em;color:var(--ink-mute);text-transform:uppercase;font-family:JetBrains Mono,monospace;font-size:8px}.cmd-num{color:var(--ink);font-family:Anton,sans-serif;font-size:20px;line-height:1}.cmd-total{color:var(--ink-mute);font-size:12px}.command-bar input{color:var(--ink);background:0 0;border:0;outline:none;flex:1;padding:20px 24px;font-family:Space Grotesk,sans-serif;font-size:20px;font-weight:500}.command-bar input::placeholder{color:var(--ink-mute);font-size:16px;font-style:italic}.command-bar input:disabled{cursor:not-allowed}.cmd-submit{background:var(--gold);color:var(--bg);letter-spacing:.22em;cursor:pointer;text-transform:uppercase;clip-path:polygon(8% 0,100% 0,100% 100%,0 100%);border:0;flex-shrink:0;justify-content:center;align-items:center;padding:0 36px;font-family:Anton,sans-serif;font-size:18px;transition:background .16s;display:flex}.cmd-submit:hover{background:var(--gold-bright)}.cmd-submit:disabled{background:var(--ink-mute);cursor:not-allowed}.timer-float{background:var(--ink-mute);clip-path:polygon(0% 0%,100% 0%,84% 100%,16% 100%);filter:drop-shadow(0 6px 16px #0006);pointer-events:none;justify-content:center;align-items:center;gap:3px;width:260px;padding:10px 20px 18px;transition:background .3s,filter .3s;display:flex;position:absolute;top:100%;left:50%;transform:translate(-50%)}.timer-float.live{background:var(--gold);filter:drop-shadow(0 6px 20px color-mix(in oklab, var(--gold) 40%, #0006))}.timer-float-num{color:var(--bg);letter-spacing:.06em;font-variant-numeric:tabular-nums;font-family:Anton,sans-serif;font-size:38px;line-height:1}.timer-float-ms{color:var(--bg);opacity:.7;align-self:flex-end;margin-bottom:5px;font-family:JetBrains Mono,monospace;font-size:16px}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.status-row{letter-spacing:.22em;color:var(--ink-mute);text-transform:uppercase;justify-content:space-between;align-items:center;margin-bottom:18px;font-family:JetBrains Mono,monospace;font-size:11px;display:flex}.status-row .controls{gap:10px;display:flex}.status-row .last-found{color:var(--gold-bright)}.status-row .last-found .name{color:var(--ink);letter-spacing:.05em;margin-left:8px}.progress-track{background:var(--line);height:4px;margin-bottom:28px;position:relative;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--gold), var(--gold-bright));transition:width .4s cubic-bezier(.2,.8,.2,1);position:absolute;inset:0 auto 0 0}.progress-track:after{content:"";background-image:linear-gradient(90deg, transparent calc(10% - 1px), var(--line-bright) 10%, transparent calc(10% + 1px));opacity:.4;background-size:10% 100%;position:absolute;inset:0}.grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;display:grid}[data-game=lol] .grid{grid-template-columns:repeat(auto-fill,minmax(68px,1fr));gap:5px}[data-game=lol] .card .name-bar{letter-spacing:.04em;min-height:20px;padding:3px 5px 4px;font-size:9px}[data-game=lol] .card:not(.found) .name-bar{letter-spacing:.1em;font-size:8px}[data-game=lol] .card .num{font-size:7px}[data-game=lol] .card:before{width:10px;height:10px}[data-game=lol] .card:after{width:8px;height:8px}[data-game=lol] .card .portrait .question{font-size:36px}[data-game=lol] .card .hint-letter{font-size:8px}.card{aspect-ratio:3/4;background:var(--surface-solid);border:1px solid var(--line);cursor:default;isolation:isolate;flex-direction:column;justify-content:flex-end;transition:transform .2s,border-color .2s;display:flex;position:relative;overflow:hidden}.card.found{border-color:color-mix(in oklab, var(--gold) 60%, var(--line));animation:.52s cubic-bezier(.2,.8,.2,1) reveal}.card.justfound{border-color:var(--gold-bright);box-shadow:0 0 0 2px var(--gold), 0 10px 24px -8px color-mix(in oklab, var(--gold) 70%, transparent)}@keyframes reveal{0%{opacity:0;transform:scale(.92)}60%{opacity:1;transform:scale(1.03)}to{transform:scale(1)}}.card:before{content:"";background:var(--bg);clip-path:polygon(100% 0,100% 100%,0 0);z-index:2;width:14px;height:14px;position:absolute;top:0;right:0}.card:after{content:"";background:var(--line-bright);clip-path:polygon(100% 0,100% 100%,0 0);z-index:2;width:12px;height:12px;position:absolute;top:1px;right:1px}.card.found:after{background:var(--gold)}.card.found .name-bar{color:#fff}.card .portrait{z-index:1;place-items:center;display:grid;position:absolute;inset:0;overflow:hidden}.card .portrait img{object-fit:cover;object-position:top center;width:100%;height:100%}.card .portrait .question{color:var(--line-bright);filter:blur(2px);font-family:Anton,sans-serif;font-size:60px}.card .name-bar{z-index:2;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);text-align:center;text-wrap:balance;background:linear-gradient(#0000,#000000c7);min-height:32px;padding:8px 10px 9px;font-family:Anton,sans-serif;font-size:14px;line-height:1.1;position:relative}.card:not(.found) .name-bar{color:var(--ink-mute);letter-spacing:.32em;background:linear-gradient(#0000,#00000080);font-family:JetBrains Mono,monospace;font-size:11px}.card .hint-letter{letter-spacing:.2em;color:var(--ink-mute);z-index:2;font-family:JetBrains Mono,monospace;font-size:10px;position:absolute;top:6px;left:8px}.card .num{color:var(--ink-mute);z-index:2;letter-spacing:.1em;opacity:.75;font-family:JetBrains Mono,monospace;font-size:9px;position:absolute;bottom:38px;left:8px}.modal-backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:80;background:#05070cc7;place-items:center;animation:.24s fadein;display:grid;position:fixed;inset:0}@keyframes fadein{0%{opacity:0}to{opacity:1}}.modal{background:var(--surface-solid);border:1px solid var(--gold);clip-path:polygon(3% 0,100% 0,100% 94%,97% 100%,0 100%,0 6%);width:min(520px,92vw);padding:36px 36px 28px;position:relative}.modal h2{letter-spacing:.14em;color:var(--gold-bright);text-transform:uppercase;margin:0 0 4px;font-family:Anton,sans-serif;font-size:42px}.modal .sub{letter-spacing:.28em;color:var(--ink-dim);text-transform:uppercase;margin-bottom:24px;font-family:JetBrains Mono,monospace;font-size:11px}.modal .stats{grid-template-columns:1fr 1fr;gap:22px;margin-bottom:28px;display:grid}.modal .stat-label{letter-spacing:.28em;color:var(--ink-mute);text-transform:uppercase;font-family:JetBrains Mono,monospace;font-size:10px}.modal .stat-value{letter-spacing:.04em;font-family:Anton,sans-serif;font-size:36px}.modal .stat-value.gold{color:var(--gold-bright)}.modal .actions{gap:12px;display:flex}.modal .actions button{background:var(--gold);color:var(--bg);letter-spacing:.2em;cursor:pointer;text-transform:uppercase;border:0;flex:1;padding:14px;font-family:Anton,sans-serif;font-size:14px}.modal .actions button.secondary{color:var(--ink);border:1px solid var(--line-bright);background:0 0}@media (width<=640px){.app{padding:18px 16px 60px}.sticky-command{top:0}.season-chip{display:none}.topbar{gap:8px;padding-bottom:12px}.brand-text{letter-spacing:.12em;font-size:18px}.topbar-right{gap:8px}.desktop-only{display:none!important}.burger-btn{display:grid}.command-bar{flex-wrap:wrap}.command-bar .cmd-stat{box-sizing:border-box;border-right:none;border-bottom:1px solid var(--line);flex-shrink:0;order:1;width:50%;padding:6px 12px}.command-bar .cmd-stat:first-child{border-right:1px solid var(--line)}.command-bar .cmd-stat:last-child{border-left:none;order:2;align-items:flex-end}.command-bar input{order:3;padding:14px 12px;font-size:16px}.command-bar .cmd-submit{clip-path:none;order:4;padding:0 20px}.timer-float{width:200px}.timer-float-num{font-size:30px}.status-row{font-size:13px}.grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}.modal .stats{grid-template-columns:1fr;gap:16px}.modal .actions{flex-direction:column}.modal h2{font-size:32px}.modal .stat-value{font-size:28px}}
