@import"https://fonts.googleapis.com/css2?family=Bangers&family=IBM+Plex+Sans:wght@400;600;700&display=swap";:root{--bg0: #0c1b14;--bg1: #163325;--ink: #f4f7f2;--muted: #a9c0b2;--accent: #ffc857;--accent-2: #ff5a36;--panel: rgba(8, 22, 16, .82);--line: rgba(255, 255, 255, .12);--ok: #3ddc97;--danger: #ff5a36;--font-display: "Bangers", Impact, sans-serif;--font-body: "IBM Plex Sans", "Segoe UI", sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%;background:radial-gradient(1200px 600px at 10% -10%,rgba(255,200,87,.16),transparent 55%),radial-gradient(900px 500px at 90% 0%,rgba(255,90,54,.12),transparent 50%),linear-gradient(160deg,var(--bg0),var(--bg1) 55%,#0a140f);color:var(--ink);font-family:var(--font-body)}a{color:var(--accent);text-decoration:none}button,input,select,textarea{font:inherit}.app-shell{min-height:100vh;display:grid;grid-template-rows:auto 1fr auto}.topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem 1.25rem;border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#06100c8c}.brand{display:inline-flex;align-items:baseline;gap:.45rem;font-family:var(--font-display);color:var(--accent);text-shadow:2px 2px 0 #000;text-decoration:none}.brand-logo{font-family:var(--font-display);font-weight:700;letter-spacing:.02em;color:var(--accent);text-shadow:2px 2px 0 #000}.brand .brand-logo{font-size:1.85rem;line-height:1}.brand-name{font-size:1.05rem;letter-spacing:.04em;color:var(--ink);text-shadow:none}.hero-logo{margin:0;font-size:clamp(4.5rem,14vw,7.5rem);line-height:.85;animation:brand-pop .7s ease both}.nav{display:flex;flex-wrap:wrap;gap:.75rem}.nav a{color:var(--muted);font-weight:600}.nav a.active,.nav a:hover{color:var(--ink)}.main{width:min(960px,100%);margin:0 auto;padding:1.25rem}.footer{padding:1rem 1.25rem;color:var(--muted);font-size:.85rem;border-top:1px solid var(--line)}.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;align-items:center;min-height:min(70vh,640px);padding:1rem 0 2rem}.hero-title{font-family:var(--font-display);font-size:clamp(2rem,5.5vw,3.25rem);margin:.35rem 0 .5rem;color:var(--ink);text-shadow:2px 2px 0 #000;line-height:1;animation:brand-pop .7s ease both;animation-delay:.08s}.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.8rem;color:var(--muted);margin:0}.lede{font-size:1.2rem;color:var(--ink);max-width:28rem}.hero-visual{display:grid;place-items:center}.timer-ring{width:min(280px,70vw);height:min(280px,70vw);border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--accent) 0 72%,rgba(255,255,255,.08) 0),radial-gradient(circle at 50% 50%,#1a3a28,#0c1b14 70%);box-shadow:0 20px 60px #00000073;animation:ring-pulse 2.4s ease-in-out infinite}.timer-ring span{font-family:var(--font-display);font-size:4rem;color:var(--accent);text-shadow:2px 2px 0 #000}@keyframes brand-pop{0%{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}@keyframes ring-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.03)}}.cta-row{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1rem}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid #111;background:#ffffff14;color:var(--ink);font-weight:700;padding:.7rem 1.1rem;cursor:pointer;box-shadow:3px 3px #000;transition:transform .08s ease,box-shadow .08s ease}.btn.primary{background:var(--accent);color:#111}.btn:hover{transform:translate(-1px,-1px);box-shadow:4px 4px #000}.panel{background:var(--panel);border:1px solid var(--line);padding:1.25rem}.muted{color:var(--muted)}.error{color:var(--danger)}.feedback{color:var(--ok);font-weight:700}.badge{display:inline-block;padding:.15rem .45rem;border:1px solid var(--line);font-size:.75rem;color:var(--muted)}.topbar-right{display:flex;align-items:center;gap:.6rem}.lang-switch select{width:auto;min-width:7.5rem;padding:.35rem .5rem;font-size:.85rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.name-gate{max-width:28rem;margin:2rem auto}.name-gate h1{font-family:var(--font-display);font-size:clamp(2rem,6vw,3rem);color:var(--accent);margin:0 0 .5rem}.mode-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.75rem;margin:1rem 0}.mode-card{display:grid;gap:.4rem;width:100%;padding:1rem 1.05rem;border:1px solid var(--line);border-left:3px solid transparent;background:linear-gradient(165deg,#ffffff0a,#00000047);color:var(--ink);text-align:left;cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .15s ease}.mode-card strong{font-family:var(--font-display);font-size:1.35rem;letter-spacing:.03em;font-weight:400;color:var(--ink)}.mode-card span{color:var(--muted);font-size:.92rem;line-height:1.35}.mode-card:hover{border-color:#ffc85759;transform:translateY(-1px)}.mode-card.selected{border-color:var(--accent);border-left-color:var(--accent);background:linear-gradient(165deg,#ffc85724,#00000059)}.mode-card.selected strong{color:var(--accent)}.mode-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.duration-row,.field-row{display:flex;flex-wrap:wrap;gap:.5rem;margin:.75rem 0}.field{display:grid;gap:.35rem;margin:.5rem 0}input,select,textarea{width:100%;padding:.65rem .75rem;border:1px solid var(--line);background:#00000059;color:var(--ink)}.hud{display:flex;flex-wrap:nowrap;align-items:center;gap:.75rem;font-weight:700;margin-bottom:.75rem}.hud-stats{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;min-width:0;flex:1}.on-fire{color:var(--accent-2);animation:fire .5s ease infinite alternate}@keyframes fire{0%{text-shadow:0 0 0 transparent}to{text-shadow:0 0 12px rgba(255,90,54,.8)}}.diff-pill,.cat-pill{display:inline-block;padding:.15rem .5rem;border:1px solid var(--line);font-size:.75rem;text-transform:uppercase}.diff-easy{color:var(--ok)}.diff-medium{color:var(--accent)}.diff-hard{color:var(--accent-2)}.quiz-board{display:grid;gap:1rem}.quiz-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}.timer-bar{position:relative;flex:1;min-width:120px;height:1.4rem;background:#ffffff14;border:1px solid var(--line);overflow:hidden}.timer-fill{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,var(--accent),var(--accent-2));transform-origin:left center;transition:transform .05s linear}.timer-label{position:relative;z-index:1;display:grid;place-items:center;height:100%;font-weight:700;text-shadow:1px 1px 0 #000}.quiz-prompt{margin:0;font-size:clamp(1.2rem,3vw,1.6rem)}.timer-bar-spacer{visibility:hidden;pointer-events:none}.choices{display:grid;gap:.6rem}.choice{display:flex;gap:.75rem;align-items:center;text-align:left;padding:.85rem 1rem;border:2px solid var(--line);background:#0000004d;color:var(--ink);cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .12s ease,opacity .12s ease}.choice.veiled{border-style:dashed;cursor:default}.choice.veiled .choice-text{visibility:hidden}.choice.veiled .choice-key{opacity:.45}.choice:focus{outline:none}.choice:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media(hover:hover)and (pointer:fine){.choice:hover:not(:disabled){border-color:var(--accent);transform:translate(3px)}}.choice.selected{border-color:var(--accent)}.choice.correct{border-color:var(--ok);background:#3ddc9726}.choice.wrong{border-color:var(--danger);background:#ff5a3626}.choice-key{font-family:var(--font-display);font-size:1.4rem;color:var(--accent);min-width:1.5rem}.score-big,.countdown-big{font-family:var(--font-display);font-size:4rem;color:var(--accent);margin:.5rem 0}.scoreboard{display:grid;gap:.35rem;margin-bottom:1rem}.score-row{display:flex;justify-content:space-between;padding:.4rem .6rem;border:1px solid var(--line);background:#0003}.score-row.me{border-color:var(--accent)}.public-rooms,.private-block{margin-top:1.25rem;display:grid;gap:.6rem}.public-rooms-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.room-list{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}.room-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.65rem .75rem;border:1px solid var(--line);background:#00000040}.room-code-banner{margin:0 0 .75rem;font-size:1.05rem}.room-code-banner strong{letter-spacing:.12em;color:var(--accent)}.stat-list,.history-list{padding-left:1.1rem}.table{width:100%;border-collapse:collapse}.table th,.table td{text-align:left;padding:.55rem .4rem;border-bottom:1px solid var(--line)}.admin-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:1rem}.admin-list{list-style:none;padding:0;margin:0;max-height:70vh;overflow:auto}.admin-list li{border-bottom:1px solid var(--line)}.linkish{background:none;border:0;color:inherit;text-align:left;width:100%;padding:.6rem .2rem;cursor:pointer}@media(max-width:800px){.hero,.admin-grid{grid-template-columns:1fr}.topbar{flex-direction:column;align-items:flex-start}}
