:root{--color-primary:#2563EB;--color-secondary:#7C3AED;--color-accent:#F97316;--color-info:#06B6D4;--color-bg:#0B1020;--color-surface:#111827;--color-text:#FFFFFF;--color-text-muted:#CBD5E1;--color-success:#10B981;--color-danger:#F43F5E;--player-1:#FF5C7A;--player-2:#3BA9FF;--player-3:#7BE06A;--player-4:#FFB13B;--player-5:#B07BFF;--player-6:#2DD4BF;--fam-knowledge:#3BA9FF;--fam-lifestyle:#2DD4BF;--fam-funny:#FFB13B;--fam-risk:#FF5C7A;--radius-host:20px;--radius-controller:14px;--radius-pill:9999px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px;--space-12:48px;--space-16:64px;--elevation-1:0 8px 24px rgba(0,0,0,.35);--elevation-2:0 14px 40px rgba(0,0,0,.5)}@font-face{font-family:Space Grotesk;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/spacegrotesk-400-DPT1xrvW.woff2) format("woff2")}@font-face{font-family:Space Grotesk;font-style:normal;font-weight:500;font-display:swap;src:url(/assets/spacegrotesk-400-DPT1xrvW.woff2) format("woff2")}@font-face{font-family:Space Grotesk;font-style:normal;font-weight:700;font-display:swap;src:url(/assets/spacegrotesk-400-DPT1xrvW.woff2) format("woff2")}@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/inter-400-8kRkwJBP.woff2) format("woff2")}@font-face{font-family:Inter;font-style:normal;font-weight:500;font-display:swap;src:url(/assets/inter-400-8kRkwJBP.woff2) format("woff2")}@font-face{font-family:Inter;font-style:normal;font-weight:700;font-display:swap;src:url(/assets/inter-400-8kRkwJBP.woff2) format("woff2")}@font-face{font-family:Inter;font-style:normal;font-weight:900;font-display:swap;src:url(/assets/inter-400-8kRkwJBP.woff2) format("woff2")}@font-face{font-family:OpenDyslexic;font-style:normal;font-weight:400;font-display:swap;src:url(/assets/opendyslexic-400-nUhe5EwG.woff2) format("woff2")}@font-face{font-family:OpenDyslexic;font-style:normal;font-weight:700;font-display:swap;src:url(/assets/opendyslexic-700-Bnmt45Ln.woff2) format("woff2")}:root{--font-display: "Space Grotesk", "Avenir Next", -apple-system, BlinkMacSystemFont, sans-serif;--font-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--surface-0: #070a16;--surface-1: #0e1426;--surface-2: #151d34;--surface-3: #1d2742;--line: #26314e;--line-soft: rgba(255, 255, 255, .07);--line-strong: #39466b;--glass-bg: rgba(20, 28, 52, .55);--glass-bg-strong: rgba(20, 28, 52, .78);--glass-border: rgba(255, 255, 255, .1);--glass-blur: 18px;--grad-brand: linear-gradient(100deg, #5b8cff 0%, #a06bff 50%, #ff8a4c 100%);--grad-brand-soft: linear-gradient(100deg, #3BA9FF, #7C3AED 55%, #F97316);--grad-cta: linear-gradient(100deg, #2f6bff, #7C3AED);--grad-accent: linear-gradient(100deg, #F97316, #FF5C7A);--grad-gold: linear-gradient(100deg, #ffe169, #ff8a4c);--grad-success: linear-gradient(100deg, #10B981, #2DD4BF);--glow-primary: 0 0 28px rgba(37, 99, 235, .55);--glow-secondary: 0 0 28px rgba(124, 58, 237, .55);--glow-accent: 0 0 28px rgba(249, 115, 22, .6);--glow-success: 0 0 26px rgba(16, 185, 129, .6);--glow-gold: 0 0 34px rgba(255, 210, 74, .6);--elev-1: 0 2px 8px rgba(0, 0, 0, .35);--elev-2: 0 12px 32px rgba(0, 0, 0, .45), 0 2px 6px rgba(0, 0, 0, .3);--elev-3: 0 24px 64px rgba(0, 0, 0, .55), 0 4px 12px rgba(0, 0, 0, .4);--spring: cubic-bezier(.22, 1.2, .36, 1);--ease-out: cubic-bezier(.16, 1, .3, 1)}@keyframes ds-rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes ds-pop{0%{opacity:0;transform:scale(.8)}60%{opacity:1;transform:scale(1.06)}to{transform:scale(1)}}@keyframes ds-glow-pulse{0%,to{opacity:.55}50%{opacity:1}}@keyframes ds-shimmer{0%{background-position:-160% 0}to{background-position:260% 0}}@keyframes ds-float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.ds-grad-text{background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent}.ds-glass{background:var(--glass-bg);border:1px solid var(--glass-border);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur))}.ds-tnum{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%;-webkit-tap-highlight-color:transparent;touch-action:manipulation}body{font-family:var(--font-ui);background:var(--surface-0);color:var(--color-text);-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;background-image:radial-gradient(ellipse 120% 50% at 50% -10%,rgba(37,99,235,.28),transparent 55%),radial-gradient(ellipse 90% 40% at 50% 112%,rgba(124,58,237,.18),transparent 60%);background-attachment:fixed}.app{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top) + 8px) var(--space-4) calc(env(safe-area-inset-bottom) + 8px) var(--space-4);gap:var(--space-4)}.colorbar{height:6px;border-radius:var(--radius-pill);margin:var(--space-2) calc(-1 * var(--space-4)) 0;box-shadow:0 0 18px currentColor}.topline{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) 0;font-size:12px;color:var(--color-text-muted)}.topline .me{display:flex;align-items:center;gap:var(--space-2);font-weight:600;color:#d6e0f5}.topline .av{width:30px;height:30px;border-radius:50%;border:2px solid}.topline .timer{margin-left:auto;font-family:var(--font-display);font-weight:700;font-size:18px;font-variant-numeric:tabular-nums}.timer.calm{color:var(--color-info)}.timer.warn{color:var(--color-accent);text-shadow:0 0 14px rgba(249,115,22,.7);animation:ds-glow-pulse 1s ease-in-out infinite}.prompt{font-family:var(--font-display);font-size:22px;font-weight:600;text-align:center;margin:var(--space-2) 0 var(--space-3);letter-spacing:-.3px}.question-card{background:var(--glass-bg);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border-radius:var(--radius-controller);padding:var(--space-4);color:#c7d2e8;text-align:center;font-size:15px;line-height:1.45}.role-tag{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;background:#f9731629;color:var(--color-accent);border:1px solid rgba(249,115,22,.45);border-radius:var(--radius-pill);padding:5px 12px}.role-tag.guesser{background:#2563eb2e;color:#7eacff;border-color:#2563eb73}.field{background:var(--surface-1);border:1px solid var(--line);border-radius:var(--radius-controller);padding:var(--space-4);font-size:18px;font-weight:600;color:var(--color-text);width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;transition:border-color .15s,box-shadow .15s}.field::placeholder{color:#64748b}.field:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #2563eb47}.pill{border:none;cursor:pointer;font-family:var(--font-display);font-weight:700;font-size:18px;padding:17px 24px;border-radius:var(--radius-pill);color:#fff;background:var(--grad-cta);box-shadow:var(--glow-primary),var(--elev-1);width:100%;transition:transform .1s var(--spring),filter .15s}.pill:active:not(:disabled){transform:translateY(1px) scale(.99);filter:brightness(1.05)}.pill:disabled{background:var(--surface-2);color:#64748b;box-shadow:none;cursor:not-allowed}.section-label{font-size:11px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--color-text-muted);margin:var(--space-2) 0}.avatar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-3)}.avatar-cell{background:var(--surface-1);border:2px solid var(--line);border-radius:var(--radius-controller);padding:var(--space-2);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .12s var(--spring),border-color .12s,box-shadow .15s}.avatar-cell.selected{border-color:var(--color-primary);background:#2563eb24;transform:scale(1.05);box-shadow:var(--glow-primary)}.av-svg{display:inline-block;line-height:0;overflow:hidden}.av-svg>svg{width:100%;height:100%;display:block}.avatar-cell .av-svg{width:100%;aspect-ratio:1}.color-row{display:flex;gap:var(--space-3);justify-content:space-between}.color-swatch{width:46px;height:46px;border-radius:50%;border:3px solid rgba(255,255,255,.16);cursor:pointer;position:relative;transition:transform .12s var(--spring),box-shadow .15s}.color-swatch.selected{border-color:#fff;transform:scale(1.1);box-shadow:0 0 0 3px #ffffff29,0 0 22px currentColor}.color-swatch.taken{opacity:.25;cursor:not-allowed}.color-swatch.taken:after{content:"✕";position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:900;color:#fff}.center-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-4);text-align:center;animation:ds-rise .4s var(--ease-out)}.you-token{display:flex;flex-direction:column;align-items:center;gap:var(--space-2)}.you-token .av-svg{width:100px;height:100px;border-radius:50%;border:4px solid;padding:5px;background:var(--surface-2);box-shadow:0 0 28px -4px currentColor}.you-name{font-family:var(--font-display);font-size:24px;font-weight:600}.lobby-count{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-pill);padding:8px 18px;font-weight:600;font-size:14px;color:var(--color-text-muted);font-variant-numeric:tabular-nums}.cat-card-list{display:flex;flex-direction:column;gap:var(--space-3)}.cat-card{position:relative;background:var(--glass-bg-strong);border-radius:var(--radius-controller);padding:var(--space-4) var(--space-4) var(--space-4) calc(var(--space-4) + 6px);border:1px solid var(--glass-border);cursor:pointer;text-align:left;font-family:inherit;color:var(--color-text);width:100%;overflow:hidden;transition:transform .1s var(--spring)}.cat-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--card-accent, var(--color-primary));box-shadow:0 0 14px var(--card-accent, var(--color-primary))}.cat-card:active{transform:scale(.98)}.cat-card.selected{background:color-mix(in srgb,var(--card-accent, var(--color-primary)) 14%,var(--glass-bg-strong));box-shadow:0 0 0 1px var(--card-accent, var(--color-primary)),0 0 24px -6px var(--card-accent, var(--color-primary))}.cat-card .fam{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.cat-card .name{font-family:var(--font-display);font-size:18px;font-weight:600;margin-top:2px}.cat-card.locked{opacity:.6;pointer-events:none}.keypad{display:flex;flex-direction:column;gap:var(--space-3)}.keypad .readout{background:var(--surface-0);border:1px solid var(--line);border-radius:var(--radius-controller);padding:var(--space-4);text-align:right;font-family:var(--font-display);font-size:42px;font-weight:700;font-variant-numeric:tabular-nums;min-height:80px;color:#fff;text-shadow:0 0 22px rgba(59,169,255,.5);letter-spacing:.5px;box-shadow:inset 0 2px 12px #00000080}.keypad .readout.empty{color:#475569;text-shadow:none}.keypad .keys{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-2)}.keypad .keys button{border:1px solid var(--line-soft);font-family:var(--font-display);background:linear-gradient(180deg,var(--surface-2),var(--surface-1));color:var(--color-text);font-weight:700;font-size:28px;padding:18px 0;border-radius:var(--radius-controller);cursor:pointer;transition:transform .05s ease,filter .1s;min-height:44pt;box-shadow:0 2px #00000059,inset 0 1px #ffffff0f}.keypad .keys button:active{transform:translateY(2px);filter:brightness(1.15);box-shadow:0 0 #0000}.keypad .keys button.del{color:var(--color-accent);font-size:22px}.keypad-mask{background:var(--surface-0);border:1px dashed var(--line);border-radius:var(--radius-controller);padding:var(--space-6);color:var(--color-text-muted);text-align:center;font-size:14px}.mag-chips{display:flex;gap:var(--space-2);margin-bottom:var(--space-2)}.mag-chips button{flex:1;background:var(--surface-1);color:var(--color-info);border:1px solid var(--line);border-radius:var(--radius-controller);padding:10px;font-family:var(--font-display);font-weight:700;font-size:14px;cursor:pointer}.mag-chips button:active{filter:brightness(1.2)}.app:has(.keypad-screen){height:100dvh;min-height:0;overflow:hidden}.keypad-screen{flex:1 1 0;min-height:0;display:flex;flex-direction:column}.ks-top{flex:0 1 auto;min-height:0;overflow-y:auto}.ks-top .question-card{margin-top:var(--space-3)}.keypad-screen .keypad{flex:0 0 auto;margin-top:var(--space-3);gap:var(--space-2)}.keypad-screen .readout{min-height:56px;font-size:36px;padding:var(--space-3)}.keypad-screen .keys{gap:var(--space-2)}.keypad-screen .keys button{min-height:52px;padding:12px 0;font-size:26px}.keypad-screen .keypad .pill{padding:14px 24px}@media (max-height: 760px){.app:has(.keypad-screen){gap:var(--space-2)}.app:has(.keypad-screen) .topline{padding:2px 0}.keypad-screen .prompt{font-size:18px;margin:0 0 var(--space-2)}.ks-top .question-card{margin-top:var(--space-2);padding:var(--space-3);font-size:14px}.keypad-screen .readout{min-height:46px;font-size:30px;padding:8px var(--space-3)}.keypad-screen .keys button{min-height:44px;padding:8px 0;font-size:24px}.keypad-screen .keypad{margin-top:var(--space-2)}.keypad-screen .keypad .pill{padding:11px 24px;font-size:16px}}.locked-card{background:var(--glass-bg);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border-radius:var(--radius-controller);padding:var(--space-6);text-align:center}.locked-card .label{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--color-text-muted)}.locked-card .val{font-family:var(--font-display);font-size:44px;font-weight:700;font-variant-numeric:tabular-nums;margin-top:var(--space-2);letter-spacing:.5px}.result-card{background:var(--glass-bg);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border-radius:var(--radius-controller);padding:var(--space-6);text-align:center;box-shadow:var(--elev-2)}.result-card .top{font-family:var(--font-display);font-size:22px;font-weight:600;color:var(--color-text-muted)}.result-card .pts{font-family:var(--font-display);font-size:60px;font-weight:700;font-variant-numeric:tabular-nums;margin:var(--space-3) 0;line-height:1}.result-card.scored .pts{color:var(--color-success);text-shadow:var(--glow-success)}.result-card.missed .pts{color:var(--color-text-muted)}.result-card.exact .pts{color:#ffe169;text-shadow:var(--glow-gold)}.result-card .below{font-size:14px;color:var(--color-text-muted)}.note{color:var(--color-text-muted);font-size:13px;text-align:center}.connection-warn{background:#f43f5e29;color:#fda4af;border:1px solid rgba(244,63,94,.4);border-radius:var(--radius-controller);padding:var(--space-2) var(--space-3);font-size:12px;text-align:center}.emote-row{display:flex;gap:var(--space-2);justify-content:center;margin-top:var(--space-4)}.emote-btn{flex:1;max-width:64px;aspect-ratio:1;border:1px solid var(--glass-border);background:var(--glass-bg);border-radius:var(--radius-controller);font-size:28px;cursor:pointer;min-height:44pt;transition:transform .08s ease,background .1s}.emote-btn:active{transform:scale(.86);background:var(--surface-2)}.reveal-pop{animation:ds-pop .45s var(--spring)}.result-card.exact{animation:ds-pop .45s var(--spring),jackpotglow .9s ease-in-out .45s infinite alternate}@keyframes jackpotglow{0%{box-shadow:var(--elev-2)}to{box-shadow:var(--glow-gold),var(--elev-2)}}.paused-veil{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;background:#070a16eb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-3)}.paused-title{font-size:80px}.paused-sub{font-size:18px;font-weight:800;color:var(--color-text-muted);letter-spacing:.08em}.help-btn{margin-left:auto;flex:none;width:28px;height:28px;border-radius:50%;font-family:var(--font-display);font-weight:700;font-size:15px;color:var(--color-text-muted);background:var(--glass-bg);border:1px solid var(--glass-border);cursor:pointer;line-height:1}.help-btn:active{transform:scale(.94)}.timer+.help-btn{margin-left:var(--space-2)}.tut-veil{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#070a16eb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:20px;animation:ds-rise .25s var(--ease-out)}.tut-card{width:min(440px,94vw);background:var(--glass-bg-strong);border:1px solid var(--glass-border);border-radius:20px;box-shadow:var(--elev-3);padding:26px 22px;display:flex;flex-direction:column;gap:20px}.tut-title{font-family:var(--font-display);font-weight:700;font-size:26px;background:var(--grad-brand);-webkit-background-clip:text;background-clip:text;color:transparent;text-align:center}.tut-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:15px}.tut-steps li{display:flex;align-items:flex-start;gap:12px;font-size:15px;line-height:1.42;color:#d6e0f5}.tut-steps strong{color:#fff}.tut-num{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-family:var(--font-display);font-weight:700;font-size:15px;color:#fff;background:var(--grad-brand)}.a11y-toggle{position:fixed;top:calc(env(safe-area-inset-top) + 6px);right:6px;z-index:60;display:flex;gap:6px;opacity:.55}.a11y-toggle button{font-family:inherit;font-size:10px;font-weight:700;color:var(--color-text-muted);background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-pill);padding:5px 9px;cursor:pointer}.a11y-toggle button.on{color:#fff;border-color:var(--color-primary);background:#2563eb33}html[data-motion=reduced] *,html[data-motion=reduced] *:before,html[data-motion=reduced] *:after{animation-duration:.01ms!important;animation-delay:0ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}html[data-contrast=high]{--surface-0: #000000;--surface-1: #0a0f1c;--surface-2: #0d1320;--glass-bg: #0a0f1c;--glass-bg-strong: #0a0f1c;--glass-border: #6679a0;--color-text-muted: #E8EEF7;--line: #6679a0}html[data-contrast=high] body{background-image:none;background:#000}html[data-contrast=high] *{text-shadow:none!important;box-shadow:none!important}html[data-contrast=high] .field,html[data-contrast=high] .cat-card,html[data-contrast=high] .avatar-cell,html[data-contrast=high] .result-card,html[data-contrast=high] .locked-card,html[data-contrast=high] .emote-btn,html[data-contrast=high] .keypad .keys button{border:2px solid #6679a0}html[data-contrast=high] .note,html[data-contrast=high] .question-card{color:var(--color-text)}html[data-font=dyslexic] body{font-family:OpenDyslexic,Comic Sans MS,Verdana,sans-serif;letter-spacing:.03em;word-spacing:.08em}
