:root{color-scheme:dark;--md-sys-color-primary: #C9B3FF;--md-sys-color-on-primary: #2C1C6A;--md-sys-color-primary-container: #4A37A8;--md-sys-color-on-primary-container: #EDE4FF;--md-sys-color-secondary: #FFB4A2;--md-sys-color-on-secondary: #5C1A0C;--md-sys-color-secondary-container: #7A3124;--md-sys-color-on-secondary-container: #FFDAD0;--md-sys-color-tertiary: #76DBC7;--md-sys-color-on-tertiary: #00382F;--md-sys-color-tertiary-container: #005044;--md-sys-color-on-tertiary-container: #94F7E3;--md-sys-color-error: #FFB4AB;--md-sys-color-on-error: #690005;--md-sys-color-error-container: #93000A;--md-sys-color-on-error-container: #FFDAD6;--md-sys-color-background: #0D0B1F;--md-sys-color-on-background: #ECE4FF;--md-sys-color-surface: #0D0B1F;--md-sys-color-on-surface: #ECE4FF;--md-sys-color-surface-variant: #2A2540;--md-sys-color-on-surface-variant: #C9C3DE;--md-sys-color-surface-container-lowest: #080615;--md-sys-color-surface-container-low: #15112A;--md-sys-color-surface-container: #1C1832;--md-sys-color-surface-container-high: #251F3F;--md-sys-color-surface-container-highest: #2E2749;--md-sys-color-outline: #5F5880;--md-sys-color-outline-variant: #3E3957;--md-sys-color-inverse-surface: #ECE4FF;--md-sys-color-inverse-on-surface: #322F45;--md-sys-color-scrim: #000000;--answer-red: #FF4D6D;--answer-blue: #3D8BFD;--answer-yellow: #FFC93C;--answer-green: #2DD4BF;--md-ref-typeface-brand: "Google Sans", "Inter", system-ui, sans-serif;--md-ref-typeface-plain: "Google Sans Text", "Inter", system-ui, sans-serif;--md-sys-typescale-display-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-headline-large-font: var(--md-ref-typeface-brand);--md-sys-typescale-body-large-font: var(--md-ref-typeface-plain);--gradient-hero: radial-gradient(60% 80% at 20% 10%, #5B3CFF33 0%, transparent 60%), radial-gradient(50% 70% at 80% 30%, #FF4D6D33 0%, transparent 60%), radial-gradient(70% 80% at 50% 100%, #2DD4BF22 0%, transparent 60%);--gradient-brand: linear-gradient(135deg, #8B5CF6 0%, #EC4899 50%, #F59E0B 100%);--shadow-1: 0 1px 2px rgba(0,0,0,.25), 0 1px 3px rgba(0,0,0,.4);--shadow-2: 0 4px 8px rgba(0,0,0,.25), 0 2px 4px rgba(0,0,0,.3);--quiz-primary: #C9B3FF;--quiz-accent: #FFB4A2;--quiz-bg: #0D0B1F;--shadow-3: 0 16px 40px rgba(0,0,0,.45), 0 6px 16px rgba(0,0,0,.35);--shadow-glow: 0 0 0 1px rgba(201,179,255,.2), 0 20px 60px rgba(139,92,246,.25)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--md-ref-typeface-plain);color:var(--md-sys-color-on-background);background:var(--gradient-hero),radial-gradient(1200px 700px at 50% -10%,#1C1639 0%,transparent 70%),var(--md-sys-color-background);background-attachment:fixed;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}a{color:var(--md-sys-color-primary);text-decoration:none}a:hover{text-decoration:underline}.app-shell{min-height:100%;display:flex;flex-direction:column;position:relative;z-index:1}.topbar{display:flex;align-items:center;gap:12px;padding:14px 20px;background:#1c183299;backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);border-bottom:1px solid var(--md-sys-color-outline-variant);color:var(--md-sys-color-on-surface);position:sticky;top:0;z-index:10}.topbar .title{font-family:var(--md-ref-typeface-brand);font-size:22px;font-weight:600;letter-spacing:-.01em;background:var(--gradient-brand);-webkit-background-clip:text;background-clip:text;color:transparent}.topbar .spacer{flex:1}.topbar a{color:inherit}.page{flex:1;padding:32px 24px;max-width:1200px;width:100%;margin:0 auto}.hero{text-align:center;padding:72px 16px 48px;position:relative}.hero h1{font-family:var(--md-ref-typeface-brand);font-size:clamp(48px,9vw,96px);line-height:1.02;letter-spacing:-.03em;margin:0 0 16px;font-weight:700;background:var(--gradient-brand);-webkit-background-clip:text;background-clip:text;color:transparent}.hero p{color:var(--md-sys-color-on-surface-variant);font-size:20px;margin:0 0 40px}.blobs{position:absolute;inset:-80px 0 0;pointer-events:none;z-index:-1;overflow:hidden}.blob{position:absolute;width:520px;height:520px;border-radius:50%;filter:blur(80px);opacity:.5;animation:drift 22s ease-in-out infinite}.blob.b1{background:#8b5cf6;left:-140px;top:-80px}.blob.b2{background:#ec4899;right:-100px;top:60px;animation-delay:-8s}.blob.b3{background:#2dd4bf;left:40%;top:180px;animation-delay:-14s;transform:translate(-50%)}@keyframes drift{0%,to{transform:translate(0) scale(1)}33%{transform:translate(40px,-30px) scale(1.08)}66%{transform:translate(-30px,40px) scale(.95)}}.card{background:#1c1832a8;backdrop-filter:blur(14px) saturate(130%);-webkit-backdrop-filter:blur(14px) saturate(130%);border:1px solid rgba(255,255,255,.06);border-radius:20px;padding:24px;box-shadow:var(--shadow-1)}.card.elevated{background:#251f3fd9;box-shadow:var(--shadow-3)}.card.glow{box-shadow:var(--shadow-glow)}.grid{display:grid;gap:16px}.grid.cols-2{grid-template-columns:repeat(2,1fr)}.grid.cols-3{grid-template-columns:repeat(3,1fr)}.grid.cols-4{grid-template-columns:repeat(4,1fr)}@media (max-width: 820px){.grid.cols-2,.grid.cols-3,.grid.cols-4{grid-template-columns:1fr}}.row{display:flex;gap:12px;align-items:center}.row.wrap{flex-wrap:wrap}.col{display:flex;flex-direction:column;gap:14px}.center{display:flex;align-items:center;justify-content:center}.pin-display{font-family:var(--md-ref-typeface-brand);font-size:clamp(64px,14vw,144px);letter-spacing:.12em;font-weight:800;line-height:1;padding:24px 48px;border-radius:28px;display:inline-block;background:var(--gradient-brand);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 8px 20px rgba(139,92,246,.35));animation:pop-in .55s cubic-bezier(.2,.9,.2,1.15)}.qr-card{display:inline-flex;flex-direction:column;align-items:center;gap:12px;background:#fff;border-radius:20px;padding:20px;box-shadow:var(--shadow-2)}.qr-card canvas{display:block;border-radius:8px}.qr-card .caption{color:#111;font-size:13px;font-weight:500}.answer-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.answer-tile{border:none;border-radius:20px;color:#fff;font-family:var(--md-ref-typeface-brand);font-size:22px;font-weight:600;padding:28px 22px;min-height:140px;cursor:pointer;display:flex;align-items:center;gap:16px;text-align:left;transition:transform .15s ease,filter .25s ease,opacity .25s ease,box-shadow .25s ease;position:relative;overflow:hidden;box-shadow:0 6px #00000040,0 10px 30px #0000004d;isolation:isolate}.answer-tile:before{content:"";position:absolute;inset:0;background:linear-gradient(140deg,#ffffff40,#fff0 50%);pointer-events:none}.answer-tile:hover:not(:disabled){transform:translateY(-3px);filter:brightness(1.08);box-shadow:0 10px #00000040,0 16px 40px #00000059}.answer-tile:active:not(:disabled){transform:translateY(1px);filter:brightness(.95)}.answer-tile:disabled{opacity:.35;cursor:default;filter:grayscale(.4)}.answer-tile.correct{outline:4px solid #fff;animation:pulse-glow 1.4s ease-in-out infinite}.answer-tile.dim{opacity:.25}.answer-tile .shape{font-size:32px;filter:drop-shadow(0 2px 0 rgba(0,0,0,.3))}.answer-tile.red{background:linear-gradient(160deg,#ff4d6d,#c9184a)}.answer-tile.blue{background:linear-gradient(160deg,#3d8bfd,#1d4ed8)}.answer-tile.yellow{background:linear-gradient(160deg,#ffc93c,#e8a100);color:#0d0b1f}.answer-tile.green{background:linear-gradient(160deg,#2dd4bf,#0b7a6a)}@keyframes pulse-glow{0%,to{box-shadow:0 6px #00000040,0 10px 30px #ffffff4d}50%{box-shadow:0 6px #00000040,0 14px 50px #ffffff8c}}.countdown{position:relative;width:112px;height:112px;display:inline-grid;place-items:center;font-family:var(--md-ref-typeface-brand);font-size:48px;font-weight:700;color:var(--md-sys-color-on-surface)}.countdown svg{position:absolute;inset:0;transform:rotate(-90deg)}.countdown circle{fill:none;stroke-width:10;stroke-linecap:round}.countdown .bg{stroke:#ffffff14}.countdown .fg{stroke:var(--md-sys-color-primary);transition:stroke-dashoffset .2s linear,stroke .3s ease}.countdown.warn .fg{stroke:#ffc93c}.countdown.danger .fg{stroke:#ff4d6d}.countdown.danger{animation:heartbeat .9s ease-in-out infinite}@keyframes heartbeat{0%,to{transform:scale(1)}50%{transform:scale(1.07)}}.lb{display:flex;flex-direction:column;gap:10px}.lb-row{display:grid;grid-template-columns:52px 40px 1fr auto;gap:14px;align-items:center;background:#251f3fd9;padding:14px 20px;border-radius:16px;font-size:18px;border:1px solid rgba(255,255,255,.04);animation:slide-in .45s cubic-bezier(.2,.9,.2,1.1) backwards}.lb-row:nth-child(1){animation-delay:0s}.lb-row:nth-child(2){animation-delay:.05s}.lb-row:nth-child(3){animation-delay:.1s}.lb-row:nth-child(4){animation-delay:.15s}.lb-row:nth-child(5){animation-delay:.2s}.lb-row:nth-child(n+6){animation-delay:.25s}.lb-row.me{border-color:var(--md-sys-color-primary);box-shadow:0 0 0 2px var(--md-sys-color-primary-container)}.lb-row .rank{font-family:var(--md-ref-typeface-brand);font-weight:800;font-size:24px;background:var(--gradient-brand);-webkit-background-clip:text;background-clip:text;color:transparent}.lb-row .score{font-family:var(--md-ref-typeface-brand);font-weight:700;font-size:22px;color:var(--md-sys-color-primary)}.lb-row .delta{color:var(--md-sys-color-tertiary);font-size:14px;margin-left:6px;font-weight:600}.avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-family:var(--md-ref-typeface-brand);font-weight:700;font-size:16px;color:#fff;box-shadow:inset 0 -4px #0003,0 2px 6px #0000004d;flex:0 0 40px}.player-pill{display:inline-flex;align-items:center;gap:10px;background:#251f3fe6;border:1px solid rgba(255,255,255,.06);border-radius:999px;padding:6px 14px 6px 6px;font-weight:500;animation:pop-in .4s cubic-bezier(.2,.9,.2,1.4)}.player-pill .avatar{width:32px;height:32px;font-size:14px}.podium{display:flex;align-items:flex-end;justify-content:center;gap:20px;margin:32px 0}.podium-step{flex:1;max-width:200px;border-radius:20px 20px 6px 6px;padding:22px 14px 18px;text-align:center;position:relative;box-shadow:0 12px 40px #00000059;animation:rise .7s cubic-bezier(.2,.9,.2,1.1) backwards}.podium-step .avatar{margin:0 auto 8px;width:56px;height:56px;font-size:24px}.podium-step .place{font-family:var(--md-ref-typeface-brand);font-size:44px;font-weight:800;line-height:1}.podium-step .name{font-weight:700;font-size:20px;margin:6px 0 4px}.podium-step .score{font-size:16px;opacity:.85;font-variant-numeric:tabular-nums}.podium-step.first{height:240px;background:linear-gradient(180deg,#ffe066,#ffb800);color:#2a1a00;animation-delay:.25s}.podium-step.second{height:190px;background:linear-gradient(180deg,#e5e7eb,#9ca3af);color:#111827;animation-delay:.1s}.podium-step.third{height:160px;background:linear-gradient(180deg,#f3a26d,#b45309);color:#3a1f00;animation-delay:0s}.podium-step.first .place{font-size:56px}@keyframes rise{0%{transform:translateY(60px);opacity:0}to{transform:translateY(0);opacity:1}}.question-card{background:linear-gradient(180deg,#251f3ff2,#1c1832d9);border:1px solid rgba(255,255,255,.06);border-radius:28px;padding:36px;text-align:center;box-shadow:var(--shadow-3)}.question-card h2{font-family:var(--md-ref-typeface-brand);font-weight:600;font-size:clamp(28px,4vw,48px);margin:20px 0 28px;line-height:1.15;letter-spacing:-.01em}.question-meta{display:flex;justify-content:space-between;align-items:center;color:var(--md-sys-color-on-surface-variant);font-size:14px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;margin-bottom:12px}.reveal-bar{height:14px;border-radius:8px;background:#ffffff0f;overflow:hidden;flex:1;box-shadow:inset 0 1px 2px #0006}.reveal-bar>div{height:100%;transition:width .7s cubic-bezier(.2,.9,.2,1);border-radius:8px}.feedback-screen{min-height:60vh;display:grid;place-items:center;text-align:center;border-radius:28px;color:#fff;padding:32px;animation:pop-in .5s cubic-bezier(.2,.9,.2,1.1);position:relative;overflow:hidden}.feedback-screen.correct{background:radial-gradient(ellipse at center,#34d399,#059669 70%);box-shadow:0 20px 80px #10b9814d}.feedback-screen.incorrect{background:radial-gradient(ellipse at center,#f87171,#b91c1c 70%);box-shadow:0 20px 80px #dc26264d}.feedback-screen .emoji{font-size:104px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.3))}.feedback-screen .points{font-family:var(--md-ref-typeface-brand);font-size:clamp(40px,7vw,72px);font-weight:800;margin-top:12px;font-variant-numeric:tabular-nums}md-outlined-text-field,md-filled-text-field{--md-outlined-text-field-container-shape: 12px;--md-outlined-text-field-outline-color: rgba(255,255,255,.14);--md-outlined-text-field-hover-outline-color: rgba(255,255,255,.28);--md-outlined-text-field-input-text-color: var(--md-sys-color-on-surface);--md-outlined-text-field-label-text-color: var(--md-sys-color-on-surface-variant)}md-filled-button,md-filled-tonal-button{--md-filled-button-container-shape: 999px;--md-filled-tonal-button-container-shape: 999px}md-outlined-button,md-text-button{--md-outlined-button-container-shape: 999px;--md-text-button-container-shape: 999px}.muted{color:var(--md-sys-color-on-surface-variant)}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.big{font-family:var(--md-ref-typeface-brand);font-size:30px;font-weight:600;letter-spacing:-.01em}.huge{font-family:var(--md-ref-typeface-brand);font-size:clamp(36px,5vw,64px);font-weight:700;letter-spacing:-.02em;line-height:1.05}.gradient-text{background:var(--gradient-brand);-webkit-background-clip:text;background-clip:text;color:transparent}.stack>*+*{margin-top:16px}.tabular{font-variant-numeric:tabular-nums}.lobby-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:12px}@keyframes pop-in{0%{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}@keyframes slide-in{0%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-6px)}80%{transform:translate(6px)}}.shake{animation:shake .45s ease-in-out}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:#c9b3ff2e;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#c9b3ff4d}::-webkit-scrollbar-track{background:transparent}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}.reaction-bar{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;padding:6px 10px;background:#0d0b1fb8;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.08);border-radius:999px;box-shadow:var(--shadow-2);width:fit-content;margin:0 auto}.reaction-btn{background:none;border:none;cursor:pointer;font-size:28px;line-height:1;padding:4px 6px;border-radius:12px;transition:transform .12s,background .12s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.reaction-btn:hover{background:#ffffff12;transform:scale(1.2)}.reaction-btn:active{transform:scale(.9)}.reaction-overlay{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:100}.reaction-floater{position:absolute;bottom:0;font-size:36px;line-height:1;animation:floater-rise 3s ease-out forwards;will-change:transform,opacity;user-select:none}.reaction-floater--drift-right{animation-name:floater-rise-right}.reaction-floater--drift-left{animation-name:floater-rise-left}@keyframes floater-rise-right{0%{transform:translateY(0) translate(0) scale(.6);opacity:0}10%{transform:translateY(-5vh) translate(4px) scale(1);opacity:1}80%{opacity:1}to{transform:translateY(-80vh) translate(28px) scale(.9);opacity:0}}@keyframes floater-rise-left{0%{transform:translateY(0) translate(0) scale(.6);opacity:0}10%{transform:translateY(-5vh) translate(-4px) scale(1);opacity:1}80%{opacity:1}to{transform:translateY(-80vh) translate(-28px) scale(.9);opacity:0}}[data-colorblind=on]{--cb-grey-1: #D1D1D1;--cb-grey-2: #9A9A9A;--cb-grey-3: #636363;--cb-grey-4: #3A3A3A}[data-colorblind=on] .answer-tile.red{background:var(--cb-grey-1);color:#0d0b1f}[data-colorblind=on] .answer-tile.blue{background:var(--cb-grey-2);color:#fff}[data-colorblind=on] .answer-tile.yellow{background:var(--cb-grey-3);color:#fff}[data-colorblind=on] .answer-tile.green{background:var(--cb-grey-4);color:#fff}[data-colorblind=on] .podium-step.first{background:#251f3fd9;color:var(--md-sys-color-on-surface);border:3px solid var(--md-sys-color-outline)}[data-colorblind=on] .podium-step.second{background:#251f3fb3;color:var(--md-sys-color-on-surface);border:3px solid var(--md-sys-color-outline)}[data-colorblind=on] .podium-step.third{background:#251f3f8c;color:var(--md-sys-color-on-surface);border:3px solid var(--md-sys-color-outline)}