:root{--brand: #ffd43b;--on-brand: #15181d;--font-display: "Bricolage Grotesque", system-ui, sans-serif;--font-body: "DM Sans", system-ui, sans-serif;--radius: 14px}:root,:root[data-theme=dark]{--bg: #0e1116;--surface: #161b22;--surface-2: #1e2530;--border: #2a3340;--text: #f4f1e8;--muted: #9aa4b2;--accent-text: #ffd43b;--correct: #34c77b;--close: #5aa9ff;--wrong: #ff6b81;--ping-colour: #ffd43b;--ping-opacity: .045;--cover-shadow: rgba(0, 0, 0, .45);--grain-opacity: .0125}:root[data-theme=light]{--bg: #faf8f2;--surface: #ffffff;--surface-2: #f1ede2;--border: #e3ddcc;--text: #15181d;--muted: #5b6472;--accent-text: #15181d;--correct: #17794a;--close: #1f6fd1;--wrong: #c8294a;--ping-colour: #ffd43b;--ping-opacity: .12;--cover-shadow: rgba(21, 24, 29, .2);--grain-opacity: .015}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:400 16px/1.55 var(--font-body);transition:background .2s,color .2s;overflow-x:hidden}h1,h2{font-family:var(--font-display);letter-spacing:-.02em;margin:0}:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.page{position:relative;z-index:1;max-width:720px;min-height:100vh;min-height:100dvh;margin:0 auto;padding:20px 16px 40px;display:flex;flex-direction:column}.header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:28px}.main{flex:1}.logo-link{color:inherit;text-decoration:none;border-radius:8px}.lock{--s: 52px;--f: 36px;display:inline-flex;align-items:flex-end;color:var(--brand)}.lock svg{width:var(--s);height:var(--s);margin-right:calc(var(--s) * -.3);overflow:visible}.lock .wm{font:800 var(--f) / 1 var(--font-display);letter-spacing:-.03em;position:relative;color:var(--text)}.lock .wm b{color:var(--brand);font-weight:800}.header-right{display:flex;align-items:center;gap:12px}.countdown{display:flex;flex-direction:column;align-items:flex-end;line-height:1.2}.countdown-label{font-size:11px;color:var(--muted)}.countdown-time{font:700 15px var(--font-body);font-variant-numeric:tabular-nums}.theme-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border-radius:50%;border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer}.theme-btn svg{width:20px;height:20px}.tagline{font-size:clamp(28px,7vw,44px);font-weight:800;line-height:1.1;margin-bottom:24px}.hero{margin-bottom:28px}.hero h1{font-size:clamp(34px,10.5vw,64px);font-weight:800;line-height:1;letter-spacing:-.035em;text-wrap:balance}.hero-accent{color:var(--brand)}.hero-sub{margin:12px 0 0;font-size:clamp(17px,4.6vw,22px);font-weight:500;color:var(--muted)}.games{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:12px}@media (min-width: 600px){.games{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}}.games>li{display:flex}.games-soon{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:12px}@media (min-width: 600px){.games-soon{margin-top:16px}}.soon-strip{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 16px;padding:14px 18px;background:var(--surface);border:1px dashed var(--border);border-radius:var(--radius);opacity:.85}.soon-text h2{font-size:18px;font-weight:800;color:var(--muted)}.soon-text p{margin:2px 0 0;font-size:14px;color:var(--muted)}.game-card{position:relative;display:flex;flex-direction:column;width:100%;overflow:hidden;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:inherit;text-decoration:none;transition:border-color .15s}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px}.cover{position:relative;aspect-ratio:3 / 1;overflow:hidden;container-type:size;pointer-events:none;-webkit-mask-image:linear-gradient(to bottom,#000 55%,transparent 100%);mask-image:linear-gradient(to bottom,#000 55%,transparent 100%)}@media (min-width: 600px){.cover{aspect-ratio:16 / 10}}.cv{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:flex-start;justify-content:center}.cv-icon{display:block;width:100%;height:100%;border-radius:inherit}.cv-icon-wait{background:var(--surface-2)}.cv-icon-fallback{display:flex;align-items:center;justify-content:center;background:var(--brand);color:var(--on-brand);font:800 1.6em var(--font-display)}.cv-tenacity{--s: min(26cqw, 56cqh);align-items:flex-start;gap:3cqw;padding:11cqh 6cqw 0}.cv-rank-tile{position:relative;flex:none;width:var(--s);height:var(--s);border-radius:calc(var(--s) * .16);box-shadow:0 8px 18px var(--cover-shadow)}.cv-left{transform:perspective(calc(var(--s) * 6)) rotateY(20deg)}.cv-right{transform:perspective(calc(var(--s) * 6)) rotateY(-20deg)}.cv-left .cv-icon{border-radius:inherit}.cv-unknown{display:flex;align-items:center;justify-content:center;background:var(--bg);border:1px solid var(--border)}.cv-q{font:800 calc(var(--s) * .62) / 1 var(--font-display);color:var(--brand)}.cv-badge{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;min-width:calc(var(--s) * .38);height:calc(var(--s) * .34);padding:0 calc(var(--s) * .07);border-radius:calc(var(--s) * .17);background:var(--brand);color:var(--on-brand);font:800 calc(var(--s) * .19) / 1 var(--font-display);white-space:nowrap}.cv-title{align-self:center;flex:1;min-width:0;margin:0;text-align:center;font:800 min(5.6cqw,15cqh) / 1.1 var(--font-display);letter-spacing:-.02em;text-wrap:balance;color:var(--text)}.cv-connected{padding-top:7cqh}.cv-grid{--gw: min(88cqw, 112cqh);width:var(--gw);perspective:calc(var(--gw) * 2);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.8cqw}.cv-grid .tile{min-height:0;aspect-ratio:5 / 4;padding:0;align-items:center;justify-content:center;border-width:1.5px;border-radius:min(2.4cqw,4cqh);cursor:default;transform:rotateY(calc(var(--x) * -17deg)) rotateX(calc(var(--y) * 10deg)) translateZ(calc(var(--z) * var(--gw) * .2))}.cv-grid .tile .cv-icon{width:62%;height:auto;aspect-ratio:1;border-radius:6%}.card-body{position:relative;display:flex;flex-direction:column;flex:1;align-items:flex-start;margin-top:-24px;padding:0 16px 16px}@media (min-width: 600px){.card-body{margin-top:-36px;padding:0 20px 20px}}.card-body h2{font-size:24px;font-weight:800;line-height:1.1}.game-desc{margin:6px 0 14px;color:var(--muted)}@media (min-width: 600px){.game-desc{margin:8px 0 18px}}.card-body .btn,.card-body .soon{margin-top:auto}a.game-card:hover{border-color:var(--muted);border-color:color-mix(in srgb,var(--border),var(--text) 30%)}a.game-card:focus-visible{outline:2px solid var(--brand);outline-offset:3px}@media (prefers-reduced-motion: no-preference){.game-card{transition:border-color .15s,transform .15s}a.game-card:hover,a.game-card:focus-visible{transform:translateY(-4px)}}.soon{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border:1px dashed var(--muted);border-radius:10px;color:var(--muted);font-weight:700;font-size:14px}.soon svg{width:18px;height:18px}.btn{display:inline-block;font:700 15px var(--font-body);border:0;border-radius:10px;padding:12px 18px;text-decoration:none;cursor:pointer}.btn.primary{background:var(--brand);color:var(--on-brand)}.btn.secondary{background:var(--surface-2);color:var(--text);border:1px solid var(--border)}.footer{margin-top:48px;color:var(--muted);font-size:13px;line-height:1.5}.footer p{margin:0}.link{color:var(--accent-text);font-weight:700;text-decoration:underline;text-decoration-color:var(--brand);text-decoration-thickness:2px;text-underline-offset:3px}.back{margin:20px 0 0}.game-top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.lives{display:flex;gap:8px;align-items:center;color:var(--wrong)}.lives svg{width:28px;height:28px}.lives .lost{opacity:.25;color:var(--muted)}.info-btn{display:inline-flex;padding:4px;margin:-4px;border:0;border-radius:50%;background:none;color:var(--brand);cursor:pointer}.info-btn svg{width:28px;height:28px}.question{font-size:22px;font-weight:800;line-height:1.3;margin:24px 0 20px}.input{width:100%;font:500 16px var(--font-body);background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:12px 14px}.input:focus{outline:2px solid var(--brand);outline-offset:1px}.btn:disabled{opacity:.45;cursor:not-allowed}.ac-row{display:flex;gap:10px;flex-wrap:wrap}.ac-field{position:relative;flex:1 1 200px;min-width:0}.ac-list{position:absolute;z-index:5;left:0;right:0;top:calc(100% + 4px);list-style:none;margin:0;padding:4px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 24px #00000040;max-height:320px;overflow-y:auto}.ac-opt,.ac-empty{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;font-weight:500}.ac-opt{cursor:pointer}.ac-opt.active{background:var(--brand);color:var(--on-brand)}.ac-opt img,.slot img{border-radius:6px;flex:none}.ac-opt em{margin-left:auto;font-style:normal;font-size:12px;opacity:.8}.ac-empty{color:var(--muted)}.message{min-height:1.55em;margin:12px 0 4px;font-weight:700;color:var(--muted)}.message.good{color:var(--correct)}.message.bad{color:var(--wrong)}.message.info{color:var(--close)}.slots{list-style:none;margin:8px 0 14px;padding:0;display:grid;gap:6px}.slot{position:relative;display:flex;gap:10px;align-items:center;min-height:46px;background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:8px 12px;font-weight:500;transition:border-color .1s,background .1s}.slot .rank{width:26px;font:800 15px var(--font-display);color:var(--muted);flex:none}.slot-name{min-width:0}.slot-name.unknown{color:var(--muted)}.slot em{margin-left:auto;font-style:normal;font-size:13px;font-weight:700;white-space:nowrap}.slot.ok{border-color:var(--correct)}.slot.ok em{color:var(--correct)}.slot.no{border-color:var(--wrong)}.slot.no em{color:var(--wrong)}.slot.marker{border-color:var(--brand);background:var(--surface-2)}.slot.marker-correct{border-color:var(--correct);background:var(--surface-2)}.slot.marker-wrong{border-color:var(--wrong);background:var(--surface-2)}.slot.marker-tie{border-color:var(--close);background:var(--surface-2)}.slot.ok[class*=marker]{border-color:var(--correct)}.marker-dot{position:absolute;right:12px;width:24px;height:24px;color:var(--brand)}.slot.marker-correct .marker-dot{color:var(--correct)}.slot.marker-wrong .marker-dot{color:var(--wrong)}.slot.marker-tie .marker-dot{color:var(--close)}.slot.ok .marker-dot,.slot.no .marker-dot{right:90px}.end{margin-top:18px;padding:16px;border-radius:12px;background:var(--surface-2);border:1px solid var(--border)}.end.won{border-color:var(--correct)}.end.lost{border-color:var(--wrong)}.end h3{font:800 22px var(--font-display);margin:0 0 6px}.end p{margin:4px 0}.end .source{color:var(--muted);font-size:14px;margin-top:10px}:root{--tier-1: #34c77b;--tier-2: #5aa9ff;--tier-3: #b78cff;--tier-4: #ffd43b}.connected-card{padding:14px}@media (min-width: 480px){.connected-card{padding:20px}}.connected-card .question{font-size:18px;margin:18px 0 14px}.bands{display:grid;gap:6px;margin-bottom:6px}.band{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:10px;color:#15181d;text-align:center}.band.tier-1{background:var(--tier-1)}.band.tier-2{background:var(--tier-2)}.band.tier-3{background:var(--tier-3)}.band.tier-4{background:var(--tier-4)}.band-tier{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.band-title{font:800 16px/1.25 var(--font-display)}.band-names{font-size:14px;font-weight:500}.band-missed{opacity:.85;outline:2px dashed #15181d;outline-offset:-4px}.tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;min-height:84px;padding:6px 3px;font:600 11px/1.15 var(--font-body);color:var(--text);text-align:center;background:var(--bg);border:2px solid var(--border);border-radius:10px;cursor:pointer;overflow-wrap:anywhere}.tile img{border-radius:6px;display:block}.tile-noimg{width:44px;height:44px;border-radius:6px;background:var(--surface-2)}.tile.on{background:var(--surface-2);border-color:var(--brand);box-shadow:inset 0 0 0 2px var(--brand)}.tile-tick{position:absolute;top:3px;right:3px;display:flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:var(--brand);color:var(--on-brand);font:800 11px/1 var(--font-body)}.tile:disabled{cursor:default}@media (min-width: 480px){.tiles{gap:8px}.tile{min-height:104px;font-size:13px;padding:8px 4px}.tile img,.tile-noimg{width:56px;height:56px}}@media (prefers-reduced-motion: no-preference){.tile{transition:border-color .1s,background .1s,transform .1s}.tile.on{transform:translateY(-2px)}}.controls{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:8px}.countdown-inline{align-items:flex-start;margin:10px 0 4px}.howto{width:min(440px,calc(100% - 32px));max-height:calc(100% - 32px);padding:0;border-radius:var(--radius);background:var(--surface);color:var(--text);border:1px solid var(--border)}.howto::backdrop{background:#0009}.howto-body{padding:22px}.howto h3{font:800 22px var(--font-display);margin:0 0 12px}.howto ul{margin:0 0 14px;padding-left:20px}.howto li{margin:4px 0}.share{margin-top:14px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.share-status{color:var(--correct);font-weight:700;font-size:14px}.share-text{width:100%;font:500 16px var(--font-body);background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:10px;padding:10px 12px;resize:none}.note{color:var(--muted);font-size:13px;margin:14px 0 0}@media (max-width: 359px){.lock{--s: 40px;--f: 28px}.header-right{margin-left:auto;gap:8px}.tagline{font-size:25px}}.page-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden;pointer-events:none}.ping{position:absolute;color:var(--ping-colour);opacity:var(--ping-opacity)}.ping-left{width:clamp(240px,34vw,520px);left:-11%;top:6%}.ping-right{width:clamp(200px,26vw,400px);right:-6%;bottom:4%}.page-bg[data-variant=game] .ping{opacity:calc(var(--ping-opacity) * .6)}.page-bg .grain{position:absolute;top:0;right:0;bottom:0;left:0;opacity:var(--grain-opacity);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 2 0 0 0 -0.5'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");background-size:160px 160px}:root[data-theme=light] .page-bg .grain{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 2 0 0 0 -0.5'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}