:root{--ground:#1b1035;--panel:#2a1a52;--dim:#3a2c5e;--dim-ink:#9e92c4;--line:#6e5ca8;--muted:#c9beea;--ink:#fff;--gold:#ffc83d;--gold-soft:#ffe08a;--red:#d7263d;--blue:#1d5fd1;--yellow:#f2b705;--green:#1e8a4c;--bad:#b01f33;--display:"Baloo 2", "Trebuchet MS", system-ui, sans-serif;--body:"Nunito", system-ui, -apple-system, "Segoe UI", sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--ground);color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased;font-weight:700}#app{flex-direction:column;min-height:100%;display:flex}h1,h2{font-family:var(--display);margin:0;font-weight:800;line-height:1.05}p{margin:0}a{color:var(--gold)}a:hover{color:var(--gold-soft)}button{font:inherit;cursor:pointer}button:disabled{opacity:.45;cursor:default}:focus-visible{outline:4px solid var(--gold);outline-offset:3px}.logo{font-family:var(--display);letter-spacing:-.02em;font-size:4rem;font-weight:800}.logo span{color:var(--gold)}.muted{color:var(--muted)}.eyebrow{text-transform:uppercase;letter-spacing:.09em;color:var(--muted);font-size:1.1rem;font-weight:800}.btn{font-family:var(--display);background:var(--gold);color:var(--ground);text-align:center;border:0;border-radius:18px;padding:.5em 1.4em .35em;font-size:1.6rem;font-weight:800;text-decoration:none;display:inline-block}.btn:hover:not(:disabled){background:var(--gold-soft);color:var(--ground)}.btn-ghost{color:var(--ink);box-shadow:inset 0 0 0 3px var(--line);background:0 0}.btn-ghost:hover:not(:disabled){background:var(--panel);color:var(--ink)}.c-0{background:var(--red)}.c-1{background:var(--blue)}.c-2{background:var(--yellow);color:var(--ground)}.c-3{background:var(--green)}.center-screen{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:18px;padding:32px 24px;display:flex}.toast{background:var(--ink);color:var(--ground);z-index:10;border-radius:14px;max-width:calc(100% - 32px);padding:12px 20px;font-weight:800;transition:transform .25s;position:fixed;bottom:24px;left:50%;transform:translate(-50%,140%)}.toast.show{transform:translate(-50%)}.confetti{pointer-events:none;z-index:5;position:fixed;inset:0;overflow:hidden}.confetti i{border-radius:3px;width:12px;height:18px;animation:linear forwards fall;position:absolute;top:-20px}@keyframes fall{to{transform:translateY(110vh) rotate(var(--spin));opacity:.8}}.home-choices{flex-wrap:wrap;justify-content:center;gap:16px;margin-top:16px;display:flex}.tagline{color:var(--muted);font-size:1.3rem}.welcome .logo{font-size:clamp(2.6rem,9vw,5rem)}html.tv-root{font-size:min(1.25vw,2.2222vh)}.tv-body{overflow:hidden}.tv-body #app{height:100vh}.tv{flex-direction:column;flex:1;gap:1.75rem;min-height:0;padding:2.5rem 3.5rem;display:flex}.tv .center-screen{gap:1rem}.tv-top{justify-content:space-between;align-items:center;display:flex}.tv-top .logo{font-size:2rem}.tv-top .status{color:var(--muted);font-size:1.125rem}.lobby{flex:1;gap:2.5rem;min-height:0;display:flex}.join-card{background:var(--ink);width:23.75rem;color:var(--ground);border-radius:1.75rem;flex-direction:column;align-items:center;gap:.875rem;padding:2rem;display:flex}.join-card .eyebrow{color:#5b4a8b;font-size:1.1rem}.join-card .qr{width:12.5rem;height:12.5rem;image-rendering:pixelated;border-radius:.75rem}.join-card .join-url{font-size:1.25rem}.room-code{font-family:var(--display);letter-spacing:.1em;font-size:6rem;font-weight:800;line-height:.9}.lobby-side{flex-direction:column;flex:1;gap:1.5rem;min-width:0;display:flex}.lobby-side h2{font-size:2.75rem}.lobby-side h2 span{color:var(--gold)}.chips{flex-wrap:wrap;gap:.875rem;margin:0;padding:0;list-style:none;display:flex}.chip{border-radius:999px;padding:.75rem 1.6rem;font-size:1.625rem;font-weight:800;animation:.35s ease-out pop}.chip.away{opacity:.4}.chip.waiting{box-shadow:inset 0 0 0 3px var(--line);color:var(--muted);background:0 0;font-size:1.5rem;font-weight:700;animation:none}@keyframes pop{0%{opacity:0;transform:scale(.6)}}.lobby-panel{background:var(--panel);border-radius:1.5rem;flex-direction:column;gap:1.25rem;margin-top:auto;padding:1.5rem 1.75rem;display:flex}.settings{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.125rem;display:grid}.settings label{color:var(--muted);flex-direction:column;gap:.5rem;font-size:1rem;display:flex}.settings select{font:inherit;color:var(--ground);background:var(--ink);border:0;border-radius:.75rem;padding:.6rem .75rem;font-size:1.25rem}.lobby-panel .btn{width:100%;font-size:2.125rem}.pill{background:var(--panel);color:var(--muted);border-radius:999px;padding:.6rem 1.4rem;font-size:1.25rem;font-weight:800}.pill.gold{color:var(--gold);font-size:1.375rem}.ring{--progress:1;background:conic-gradient(var(--gold) calc(var(--progress) * 100%), var(--panel) 0);border-radius:50%;place-items:center;width:6.5rem;height:6.5rem;display:grid}.ring.urgent{background:conic-gradient(var(--red) calc(var(--progress) * 100%), var(--panel) 0)}.ring span{background:var(--ground);width:5.25rem;height:5.25rem;font-family:var(--display);border-radius:50%;place-items:center;padding-top:.2rem;font-size:2.75rem;font-weight:800;display:grid}.ring.urgent span{animation:1s ease-in-out infinite throb}@keyframes throb{50%{transform:scale(1.08)}}.q-text{text-align:center;padding:0 2.5rem;font-size:3.75rem;line-height:1.1}.tiles{flex:1;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:1.125rem;min-height:0;margin:0;padding:0;list-style:none;display:grid}.tile{animation:.4s ease-out backwards rise;animation-delay:calc(var(--i) * 70ms);border-radius:1.375rem;align-items:center;gap:1.375rem;padding:0 1.875rem;font-size:2.375rem;font-weight:800;transition:background .3s,color .3s;display:flex}.tile svg{flex:none;width:2.5rem;height:2.5rem}.tile .label{flex:1}.tile .votes{font-size:1.875rem}.tile.wrong{background:var(--dim);color:var(--dim-ink)}.tile.wrong svg{fill:var(--dim-ink)}.tile.correct{outline:.375rem solid var(--ink);outline-offset:.25rem;animation:.5s ease-out bump}.tile .check{display:none}.tile.correct .check{width:2.75rem;height:2.75rem;display:block}@keyframes rise{0%{opacity:0;transform:translateY(1.5rem)}}@keyframes bump{40%{transform:scale(1.04)}}.q-foot{color:var(--muted);flex-wrap:wrap;align-items:center;gap:.875rem;min-height:2.75rem;font-size:1.375rem;font-weight:800;display:flex}.q-foot .dot{width:2.75rem;height:2.75rem;box-shadow:inset 0 0 0 2px var(--line);color:var(--muted);border-radius:50%;place-items:center;display:grid}.q-foot .dot.in{background:var(--gold);color:var(--ground);box-shadow:none;animation:.3s ease-out pop}.q-foot .winner{background:var(--panel);color:var(--ink);border-radius:999px;padding:.5rem 1.25rem;font-size:1.5rem;animation:.35s ease-out backwards pop}.q-foot .winner b{color:var(--gold)}.scoreboard{flex-direction:column;flex:1;gap:1.375rem;padding:.5rem 7.5rem 0;display:flex}.scoreboard .eyebrow,.scoreboard h1{text-align:center}.scoreboard h1{margin-bottom:.75rem;font-size:4rem}.standings{flex-direction:column;gap:.875rem;margin:0;padding:0;list-style:none;display:flex}.standings li{background:var(--panel);animation:.4s ease-out backwards rise;animation-delay:calc(var(--i) * 90ms);border-radius:1.25rem;align-items:center;gap:1.5rem;padding:.85rem 1.75rem;font-size:2.125rem;font-weight:800;display:flex}.standings li.leader{background:var(--gold);color:var(--ground)}.standings .rank{width:3rem;font-family:var(--display);color:var(--muted)}.standings li.leader .rank,.standings li.leader .gain{color:var(--ground)}.standings .name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.standings .gain{color:var(--gold);font-size:1.625rem}.standings .score{text-align:right;width:7.5rem}.standings.compact li{padding:.5rem 1.25rem;font-size:1.5rem}.scoreboard .next{text-align:center;color:var(--muted);margin-top:auto;font-size:1.25rem}.game-over{flex-direction:column;flex:1;align-items:center;gap:1.25rem;display:flex}.game-over h1{font-size:4.75rem}.game-over .sub{color:var(--muted);font-size:1.375rem}.podium{align-items:flex-end;gap:1.25rem;margin-top:auto;display:flex}.step{flex-direction:column;align-items:center;gap:.5rem;width:15rem;animation:.6s ease-out backwards rise;display:flex}.step .name{text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:1.875rem;font-weight:800;overflow:hidden}.step .score{color:var(--muted);font-size:1.375rem}.step .block{width:100%;font-family:var(--display);border-radius:1.125rem 1.125rem 0 0;place-items:center;font-size:3.25rem;font-weight:800;display:grid}.step.place-1{width:16.25rem;animation-delay:.5s}.step.place-1 .name{font-size:2.125rem}.step.place-1 .block{background:var(--gold);height:15rem;color:var(--ground);font-size:4rem}.step.place-2{animation-delay:.25s}.step.place-2 .block{background:var(--blue);height:10.6rem}.step.place-3 .block{background:var(--red);height:7.5rem}.step svg{width:3.5rem;height:3.5rem;fill:var(--gold)}.game-over .actions{gap:1.125rem;display:flex}.game-over .actions .btn{font-size:1.875rem}.game-over .rest{width:40rem}.intro .big{font-size:7rem;animation:.4s ease-out pop}.intro p{font-size:1.6rem}.phone-body{transition:background .25s}.phone{width:100%;max-width:480px;padding:max(28px, env(safe-area-inset-top)) 20px 28px;flex-direction:column;flex:1;gap:18px;margin:0 auto;display:flex}.phone.center-screen{gap:16px}.phone .logo{text-align:center;font-size:30px}.phone-body.bg-0{background:var(--red)}.phone-body.bg-1{background:var(--blue)}.phone-body.bg-2{background:var(--yellow);color:var(--ground)}.phone-body.bg-3,.phone-body.bg-good{background:var(--green)}.phone-body.bg-bad{background:var(--bad)}.phone-body[class*=bg-] .muted{color:#ffffffd9}.phone-body.bg-2 .muted{color:var(--ground)}.join-form{flex-direction:column;gap:20px;margin-top:40px;display:flex}.join-form label{color:var(--muted);flex-direction:column;gap:8px;font-size:16px;font-weight:800;display:flex}.join-form input{font:inherit;color:var(--ground);background:var(--ink);border:0;border-radius:16px;width:100%;padding:14px 16px;font-size:24px}.join-form .code-input{font-family:var(--display);letter-spacing:.25em;text-align:center;text-transform:uppercase;padding:10px 0 4px .25em;font-size:44px}.join-form .btn{margin-top:8px;font-size:30px}.form-error{color:var(--gold);border-radius:10px;min-height:1.4em;font-size:17px}.join-form .form-error{text-align:center;padding:6px 12px;scroll-margin-bottom:24px}.form-error.flash{animation:.9s ease-out error-flash,.4s ease-in-out error-shake}@keyframes error-flash{0%,40%{background:var(--gold);color:var(--ground)}20%,60%{color:var(--gold);background:0 0}}@keyframes error-shake{20%,60%{transform:translate(-8px)}40%,80%{transform:translate(8px)}}@media (prefers-reduced-motion:reduce){.form-error.flash{animation:.9s ease-out error-flash}}.phone .hint{text-align:center;color:var(--muted);margin-top:auto;font-size:16px}.me-chip{font-family:var(--display);text-overflow:ellipsis;border-radius:999px;max-width:100%;padding:10px 34px 6px;font-size:52px;font-weight:800;overflow:hidden}.phone .lead{font-size:22px;line-height:1.35}.link-btn{color:var(--gold);background:0 0;border:0;margin-top:40px;padding:12px;font-size:18px;text-decoration:underline}.bar{--progress:1;align-items:center;gap:12px;width:100%;display:flex}.bar .track{background:var(--panel);border-radius:999px;flex:1;height:14px;overflow:hidden}.bar .fill{height:100%;width:calc(var(--progress) * 100%);background:var(--gold);border-radius:999px}.bar.urgent .fill{background:var(--red)}.bar span{font-family:var(--display);text-align:right;width:34px;font-size:26px;font-weight:800}.phone-body[class*=bg-] .bar .track{background:#0003}.phone-body[class*=bg-] .bar .fill{background:var(--ink)}.phone .q-label{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-size:15px;font-weight:800}.phone .q-small{font-size:22px;font-weight:800;line-height:1.25}.pad{flex:1;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:12px;min-height:320px;display:grid}.pad button{color:var(--ink);overflow-wrap:anywhere;touch-action:manipulation;border:0;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:12px;font-size:22px;font-weight:800;transition:transform 80ms;display:flex}.pad button.c-2{color:var(--ground)}.pad button:active{transform:scale(.96)}.pad svg{width:56px;height:56px}.big-icon{width:130px;height:130px}.big-shape{width:140px;height:140px;animation:.3s ease-out pop}.phone .result{font-family:var(--display);font-size:60px;font-weight:800;line-height:1}.phone .points{font-family:var(--display);color:var(--gold-soft);font-size:44px;font-weight:800}.phone .place{background:#0003;border-radius:999px;margin-top:12px;padding:10px 24px;font-size:20px;font-weight:800}.phone .big-rank{font-family:var(--display);color:var(--gold);font-size:96px;font-weight:800;line-height:1}.phone-body[class*=bg-] .big-rank{color:var(--ink)}.phone .big-rank.won{font-size:64px}.phone .stats{color:var(--muted);font-size:18px}.banner{background:var(--gold);color:var(--ground);text-align:center;padding:8px 16px;padding-top:max(8px, env(safe-area-inset-top));z-index:20;font-weight:800;transition:transform .25s;position:fixed;top:0;left:0;right:0;transform:translateY(-100%)}.banner.show{transform:none}.animals{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}.animal{background:var(--panel);color:var(--ink);border:0;border-radius:18px;flex-direction:column;align-items:center;gap:4px;padding:14px 8px 10px;font-size:18px;font-weight:800;display:flex;box-shadow:inset 0 0 0 3px #0000}.animal-pic{font-size:52px;line-height:1.1}.animal[aria-checked=true]{background:var(--ink);color:var(--ground);box-shadow:inset 0 0 0 4px var(--gold)}.field-label{color:var(--muted);font-size:16px;font-weight:800}.field-help{color:var(--muted);margin-top:-8px;font-size:15px}.rejoin{background:var(--panel);border-radius:18px;flex-direction:column;gap:10px;padding:14px 16px;display:flex}.rejoin[hidden]{display:none}.rejoin p{color:var(--muted);font-size:16px}.rejoin-list{flex-wrap:wrap;gap:10px;display:flex}.rejoin-list button{color:var(--ink);border:0;border-radius:999px;padding:10px 20px;font-size:20px;font-weight:800}.rejoin-list button.c-2{color:var(--ground)}.phone .stack{flex-direction:column;gap:12px;width:100%;display:flex}.phone .stack .btn{width:100%;font-size:26px}.phone .ask{font-family:var(--display);font-size:44px;font-weight:800;line-height:1.05}.chip{align-items:center;gap:.6rem;display:inline-flex}.chip .remove{width:2rem;height:2rem;color:inherit;background:#00000040;border:0;border-radius:50%;place-items:center;margin-right:-.6rem;padding:0;display:grid}.chip .remove:hover{background:#00000073}.chip .remove svg{width:1.1rem;height:1.1rem}
