:root{--navy:#203b56;--navy-deep:#14273a;--navy-light:#2e5274;--teal:#008bb3;--teal-bright:#33b5d9;--sky:#cce8f0;--ink:#131212;--white:#fff;--text:#f3f7fa;--text-dim:#a9bccb;--line:#ffffff24;--panel:#ffffff0f;--success:#2fb36b;--error:#ff6b5e;--opt-0:#008bb3;--opt-1:#e2574c;--opt-2:#e9a623;--opt-3:#7a5cc7;--slab:"Roboto Slab", Georgia, serif;--sans:"Montserrat", system-ui, sans-serif;--radius:14px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(120% 90% at 50% 0%, var(--navy) 0%, var(--navy-deep) 70%) fixed;background-color:var(--navy-deep);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased}button{font:inherit;color:inherit;cursor:pointer}input{font:inherit}:focus-visible{outline:3px solid var(--teal-bright);outline-offset:3px}.wordmark{font-family:var(--slab);letter-spacing:-.01em;text-shadow:0 6px 0 var(--teal);margin:0;font-size:clamp(48px,7vw,112px);font-weight:800;line-height:1}.wordmark.small{text-shadow:0 4px 0 var(--teal);margin-bottom:32px;font-size:40px}.eyebrow{font-family:var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--teal-bright);margin:0 0 8px;font-size:14px;font-weight:700;display:block}.muted{color:var(--text-dim)}.small{font-size:14px}.error{color:var(--error);font-weight:600}.btn{border:0;border-radius:999px;justify-content:center;align-items:center;padding:14px 28px;font-size:18px;font-weight:700;text-decoration:none;transition:transform 80ms,background .15s;display:inline-flex}.btn:active{transform:translateY(2px)}.btn-primary{background:var(--teal);color:var(--white);box-shadow:0 4px #006582}.btn-primary:hover{background:#0096c2}.btn-primary:disabled{color:#9fb2c2;box-shadow:none;cursor:default;background:#3a5268}.btn-ghost{color:var(--text);border:2px solid var(--line);background:0 0}.btn-ghost:hover{border-color:var(--teal-bright)}.btn-xl{padding:20px 40px;font-size:24px}.btn-block{width:100%}.link{color:var(--text-dim);background:0 0;border:0;padding:4px;text-decoration:underline}.link:hover{color:var(--text)}.chip{background:var(--cat,var(--teal));color:var(--white);text-shadow:0 1px 2px #00000059;border-radius:999px;padding:6px 14px;font-weight:700;display:inline-block}.conn-banner{z-index:10;text-align:center;color:var(--white);background:#8a5a00;padding:8px;font-weight:600;position:fixed;inset:0 0 auto}.home{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:16px;min-height:100%;padding:32px 16px;display:flex}.home-logo{opacity:.9;width:140px}.tagline{color:var(--text-dim);margin:16px 0 8px;font-size:20px}.home-actions{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}.hint{color:var(--text-dim);font-size:14px}.host{min-height:100vh;padding:clamp(24px,3vw,56px);position:relative}.host-corner{color:var(--text-dim);align-items:center;gap:16px;font-size:15px;display:flex;position:fixed;bottom:14px;right:20px}.host-corner strong{color:var(--text);letter-spacing:.08em}.lobby{grid-template-columns:minmax(320px,.9fr) 1.1fr;align-items:center;gap:clamp(24px,4vw,72px);display:grid}.join-panel{text-align:center;flex-direction:column;align-items:center;gap:20px;display:flex}.lobby-logo{width:72px}.qr{background:var(--white);width:min(34vw,46vh);box-shadow:0 10px 0 var(--teal);border-radius:20px;padding:14px}.qr svg{width:100%;height:auto;display:block}.join-how{color:var(--text-dim);margin:8px 0 0;font-size:clamp(18px,1.6vw,26px)}.join-how strong{color:var(--text)}.room-code{gap:10px;display:flex}.room-code span{font-family:var(--slab);background:var(--panel);border:2px solid var(--line);border-radius:12px;width:1.15em;padding:4px 0;font-size:clamp(44px,5vw,84px);font-weight:800}.players-panel h2{font-family:var(--slab);align-items:center;gap:14px;margin:0 0 20px;font-size:clamp(28px,2.6vw,44px);display:flex}.count{font-family:var(--sans);background:var(--teal);border-radius:999px;padding:2px 14px;font-size:.6em}.empty{color:var(--text-dim);min-height:120px;font-size:22px}.player-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin:0 0 28px;padding:0;list-style:none;display:grid}.player-grid li{background:var(--panel);border:2px solid var(--line);border-radius:10px;justify-content:space-between;align-items:center;padding:12px 8px 12px 16px;font-size:clamp(18px,1.5vw,24px);font-weight:700;animation:.35s cubic-bezier(.2,1.4,.4,1) pop;display:flex}.player-grid li.offline{opacity:.45;border-style:dashed}.player-grid span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.kick{color:var(--text-dim);opacity:0;background:0 0;border:0;padding:0 6px;font-size:22px;line-height:1}.player-grid li:hover .kick,.kick:focus-visible{opacity:1}@keyframes pop{0%{opacity:0;transform:scale(.6)}}.settings{gap:12px;margin-bottom:28px;display:grid}.segmented{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.seg-label{width:100px;color:var(--text-dim);font-size:15px;font-weight:600}.segmented>div{background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:4px;display:inline-flex}.segmented button{color:var(--text-dim);background:0 0;border:0;border-radius:999px;padding:8px 16px;font-size:15px;font-weight:600}.segmented button.on{background:var(--teal);color:var(--white)}.stage{flex-direction:column;gap:clamp(16px,2.5vh,32px);padding-bottom:64px;display:flex}.stage-top{align-items:center;gap:20px;font-size:clamp(18px,1.6vw,28px);display:flex}.progress{font-family:var(--slab);font-size:1.3em;font-weight:700}.progress small{color:var(--text-dim);font-size:.6em;font-family:var(--sans)}.card-no{color:var(--text-dim);font-variant-numeric:tabular-nums;font-size:.8em;font-weight:600}.timer{font-family:var(--slab);text-align:right;font-variant-numeric:tabular-nums;min-width:1.6em;margin-left:auto;font-size:clamp(40px,4vw,72px);font-weight:800}.timer.done{color:var(--text-dim);font-size:clamp(24px,2vw,36px)}.timebar{background:linear-gradient(to right, var(--cat,var(--teal)) calc(var(--t) * 100%), #ffffff1a 0);border-radius:999px;height:10px}.question-text{font-family:var(--slab);text-wrap:balance;max-width:28ch;margin:0;font-size:clamp(32px,4.2vw,76px);font-weight:700;line-height:1.15}.question-text .eyebrow{margin-bottom:12px;font-size:clamp(16px,1.3vw,22px)}.options{flex:1;grid-template-columns:1fr 1fr;align-content:start;gap:clamp(12px,1.5vw,24px);margin:0;padding:0;list-style:none;display:grid}.option{border-radius:var(--radius);background:var(--c);min-height:clamp(84px,13vh,150px);color:var(--white);align-items:center;gap:20px;padding:16px 24px;font-size:clamp(22px,2.3vw,42px);font-weight:700;line-height:1.15;transition:opacity .3s,transform .3s,filter .3s;display:flex;position:relative;box-shadow:0 6px #00000047}.option .letter{width:1.6em;height:1.6em;font-family:var(--slab);background:#00000038;border-radius:10px;flex:none;place-items:center;display:grid}.option.wrong{opacity:.28;filter:saturate(.4)}.option.correct{outline:6px solid var(--white);outline-offset:4px;transform:scale(1.03)}.option .tag{background:var(--white);color:var(--navy-deep);letter-spacing:.1em;text-transform:uppercase;border-radius:999px;padding:4px 12px;font-size:16px;position:absolute;top:-14px;right:18px}.pickers{flex-wrap:wrap;justify-content:flex-end;gap:6px;max-width:60%;display:flex;position:absolute;bottom:10px;right:14px}.pickers span{background:#0000004d;border-radius:999px;padding:3px 10px;font-size:14px}.opt-0{--c:var(--opt-0)}.opt-1{--c:var(--opt-1)}.opt-2{--c:var(--opt-2)}.opt-3{--c:var(--opt-3)}.options-tf .opt-0{--c:#1f9a5a}.options-tf .opt-1{--c:var(--opt-1)}.stage-bottom{min-height:72px}.answered{flex-wrap:wrap;align-items:center;gap:20px;font-size:20px;display:flex}.answered>span{font-weight:700}.answered ul{flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;display:flex}.answered li{border:2px dashed var(--line);color:var(--text-dim);border-radius:999px;padding:6px 14px;font-weight:600}.answered li.in{border:2px solid var(--teal-bright);color:var(--text);background:#008bb340}.detail{color:var(--text-dim);max-width:70ch;margin:0 0 16px;font-size:clamp(18px,1.6vw,26px)}.flag-row{color:var(--text-dim);flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 16px;font-size:15px;display:flex}.flag-row.done{color:var(--text)}.flag-btn{border:1px solid var(--line);color:var(--text-dim);background:0 0;border-radius:999px;padding:5px 12px;font-size:14px;font-weight:600}.flag-btn:hover{border-color:var(--teal-bright);color:var(--text)}.flag-btn:disabled{opacity:.5;cursor:default}.next-bar{align-items:center;gap:16px;display:flex}.next-bar .auto{background:linear-gradient(to right, var(--teal-bright) calc(var(--t) * 100%), #ffffff1a 0);border-radius:999px;flex:1;max-width:320px;height:6px}.theme-card{--card-blue:#203b56;--card-cream:#f8f4e6;--card-ink:#222;--card-gold:#f1d044;--page:#e6e6e3;--page-text:#1f2a36;--page-muted:#5f6b77;background:var(--page);color:var(--page-text)}.theme-card .progress small,.theme-card .card-no,.theme-card .timer.done,.theme-card .detail,.theme-card .flag-row{color:var(--page-muted)}.theme-card .flag-row.done{color:var(--page-text)}.theme-card .flag-btn{color:var(--page-muted);border-color:#b9bcbf}.theme-card .flag-btn:hover{border-color:var(--card-blue);color:var(--page-text)}.theme-card .timebar{background:linear-gradient(to right, var(--cat) calc(var(--t) * 100%), #0000001a 0)}.theme-card .answered li{color:var(--page-muted);border-color:#b9bcbf}.theme-card .answered li.in{border-color:var(--card-blue);color:var(--page-text);background:#203b561a}.theme-card~.host-corner,.theme-card .host-corner{color:var(--page-muted)}.theme-card .host-corner strong{color:var(--page-text)}.theme-card .link{color:var(--page-muted)}.card-layout{flex:1;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);align-items:center;gap:clamp(20px,2.5vw,48px);font-family:Georgia,Times New Roman,serif;display:grid}.card-scene{perspective:2000px;aspect-ratio:3/2;justify-self:center;width:100%;max-height:66vh}.tcard{width:100%;height:100%;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.175,.885,.32,1.275);position:relative;box-shadow:0 18px 40px #00000040}.tcard.flipped{transform:rotateY(180deg)}.card-scene{animation:.4s ease-out deal}@keyframes deal{0%{opacity:0;translate:0 -16px}}.card-face{backface-visibility:hidden;background:var(--card-blue);padding:2%;position:absolute;inset:0;overflow:hidden}.card-back{transform:rotateY(180deg)}.inner-border{border:2px solid var(--card-ink);background:var(--card-cream);width:100%;height:100%;display:flex;position:relative}.corner{aspect-ratio:1;z-index:2;width:3.4%;fill:var(--card-gold);stroke:var(--card-ink);stroke-width:2px;position:absolute}.corner.top-left{top:-2px;left:-2px}.corner.top-right{top:-2px;right:-2px;transform:rotate(90deg)}.corner.bottom-right{bottom:-2px;right:-2px;transform:rotate(180deg)}.corner.bottom-left{bottom:-2px;left:-2px;transform:rotate(270deg)}.lines{flex:1;grid-template-rows:repeat(6,1fr);align-items:center;min-width:0;padding:3.5% 4.5%;display:grid}.line{align-items:center;gap:clamp(10px,1.2vw,22px);min-height:0;display:flex}.line .text{color:#111;opacity:.42;font-size:clamp(15px,1.35vw,26px);line-height:1.2;transition:opacity .3s}.line.active .text{opacity:1;font-size:clamp(17px,1.6vw,31px);font-weight:700}.line em{color:#444;font-style:italic;font-weight:400}.card-back .line.hidden .text{color:#0000;text-shadow:0 0 10px #000000bf;opacity:1;-webkit-user-select:none;user-select:none}.card-back .line.active .text{font-size:clamp(20px,2vw,38px)}.oval{border:2px solid var(--card-ink);width:clamp(44px,4.2vw,76px);height:clamp(30px,2.8vw,50px);color:var(--card-ink);border-radius:50%;flex:none;justify-content:center;align-items:center;font-size:clamp(14px,1.25vw,22px);font-weight:700;display:flex;box-shadow:inset 0 0 0 1px #ffffff4d}.oval-g{background:#4ba3c3}.oval-e{background:#d95383}.oval-h{background:#f1d044}.oval-al{background:#8c8163}.oval-sn{background:#3ba363}.oval-sl{background:#e67e3a}.back-left{background:var(--card-blue);border-right:2px solid var(--card-ink);flex:none;place-items:center;width:35%;display:grid;overflow:hidden}.script-logo{color:var(--card-gold);text-shadow:2px 2px #00000080;white-space:nowrap;font-family:Great Vibes,cursive;font-size:clamp(56px,7vw,132px);transform:rotate(-90deg)}.card-back .lines{padding:3.5% 5%}.card-choices{gap:clamp(10px,1.2vw,18px);margin:0;padding:0;list-style:none;display:grid}.card-choices li{background:var(--card-cream);border:2px solid var(--card-ink);color:#111;border-radius:10px;align-items:center;gap:16px;min-height:clamp(64px,9vh,104px);padding:12px 18px;font-size:clamp(20px,1.9vw,36px);line-height:1.2;transition:opacity .3s,background .3s,border-color .3s;display:flex;position:relative}.card-choices .letter{background:var(--card-blue);color:#fff;border-radius:50%;flex:none;place-items:center;width:1.5em;height:1.5em;font-size:.85em;font-weight:700;display:grid}.card-choices li.correct{background:#e3f3e8;border-color:#3ba363;font-weight:700}.card-choices li.correct .letter{background:#3ba363}.card-choices li.wrong{opacity:.5}.card-choices .pickers{bottom:6px;right:10px}.card-choices .pickers span{color:var(--page-text);font-family:var(--sans);background:#203b5624}@media (width<=900px){.card-layout{grid-template-columns:1fr}}.scores{flex-direction:column;align-items:center;gap:20px;padding-top:clamp(32px,6vh,80px);padding-bottom:72px;display:flex}.scores .eyebrow{font-size:18px}.winner{font-family:var(--slab);text-shadow:0 6px 0 var(--teal);margin:0 0 12px;font-size:clamp(48px,6vw,104px)}.winner span{color:var(--text-dim);text-shadow:none;font-size:.5em}.board{gap:10px;width:min(1100px,100%);margin:0 0 16px;padding:0;list-style:none;display:grid}.board li{grid-template-columns:2.4em minmax(120px,14em) 1fr 5em;align-items:center;gap:16px;font-size:clamp(20px,2vw,34px);font-weight:700;display:grid}.board .rank{font-family:var(--slab);color:var(--text-dim);text-align:right}.board li:first-child .rank{color:var(--teal-bright)}.board .name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.board .bar{background:linear-gradient(90deg, var(--teal), var(--teal-bright));height:.9em;width:max(6px, var(--w));border-radius:999px;transition:width .8s}.board .score{text-align:right;font-variant-numeric:tabular-nums}.final-actions{align-items:center;gap:16px;display:flex}.phone{min-height:100dvh;padding:24px 16px calc(24px + env(safe-area-inset-bottom));flex-direction:column;max-width:520px;margin:0 auto;display:flex}.phone.center{text-align:center;justify-content:center;align-items:center}.phone-form{text-align:left;flex-direction:column;gap:14px;width:100%;display:flex}.phone-form label{font-weight:700}.phone-form input{width:100%;color:var(--text);background:#00000040;border:2px solid #8aa1b4;border-radius:12px;padding:16px;font-size:22px}.phone-form input:focus{border-color:var(--teal-bright);outline:none}.code-input{text-align:center;font-family:var(--slab);letter-spacing:.3em;font-weight:800;font-size:44px!important}.phone-form .link{align-self:center}.room-tag{color:var(--text-dim);letter-spacing:.08em;text-transform:uppercase;margin:0;font-size:14px;font-weight:600}.big-line{margin:8px 0;font-size:22px}.me-name{font-family:var(--slab);text-shadow:0 4px 0 var(--teal);word-break:break-word;margin:0 0 16px;font-size:48px}.play{gap:14px}.phone-top{color:var(--text-dim);justify-content:space-between;align-items:center;font-weight:700;display:flex}.phone-top .chip{font-size:14px}.phone-timer{align-items:center;gap:12px;display:flex}.phone-timer .timebar{flex:1}.phone-timer span{font-family:var(--slab);text-align:right;font-variant-numeric:tabular-nums;width:2ch;font-size:22px;font-weight:800}.phone-question{font-family:var(--slab);margin:4px 0;font-size:20px;font-weight:600;line-height:1.3}.phone-question .eyebrow{font-size:13px;display:inline}.pad{flex:1;gap:12px;display:grid}.pad-tf{grid-template-rows:1fr 1fr}.pad-btn{border-radius:var(--radius);background:var(--c);color:var(--white);text-align:left;-webkit-tap-highlight-color:transparent;border:0;align-items:center;gap:14px;min-height:72px;padding:14px 16px;font-size:18px;font-weight:700;line-height:1.2;display:flex;box-shadow:0 5px #0000004d}.pad-btn:active{transform:translateY(3px);box-shadow:0 2px #0000004d}.pad-btn .letter{width:44px;height:44px;font-family:var(--slab);background:#00000038;border-radius:10px;flex:none;place-items:center;font-size:22px;display:grid}.pad-tf .pad-btn{justify-content:center}.pad-tf .pad-btn .letter{background:0 0;width:auto;height:auto;font-size:40px}.pad-tf .opt-0{--c:#1f9a5a}.locked{border-radius:var(--radius);background:var(--c);opacity:.9;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;font-size:22px;font-weight:700;display:flex}.locked .letter{font-family:var(--slab);font-size:72px;line-height:1}.result .verdict{font-family:var(--slab);margin:0;font-size:56px}.result.right .verdict{color:#6fe3a1}.result.wrong .verdict{color:#ffb0a8}.verdict{font-family:var(--slab);margin:0;font-size:56px}.gain{font-family:var(--slab);margin:8px 0;font-size:44px;font-weight:800}.standing{color:var(--text-dim);margin-top:24px;font-size:18px}.standing strong{color:var(--text)}@media (width<=900px){.lobby{grid-template-columns:1fr}.qr{width:min(70vw,360px)}.options{grid-template-columns:1fr}.board li{grid-template-columns:2em 1fr 4em}.board .bar{display:none}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
