:root,[data-theme=comic]{--zth-color-stage-background:#101426;--zth-color-surface:#20283d;--zth-color-surface-elevated:#29344f;--zth-color-text-primary:#fff;--zth-color-text-secondary:#d5d9e4;--zth-color-text-inverse:#17120a;--zth-color-action-primary:#f9c74f;--zth-color-error-surface:#3b1117;--zth-color-error-text:#ffd6dc;--zth-color-tempo-danger:#ff4d6d;--zth-color-focus-indicator:#00e5ff;--zth-color-disabled-surface:#4b5568;--zth-color-disabled-text:#f4f4f5;--zth-color-interactive-boundary:#b8c4e0;--zth-color-lobby-base:#090b1f;--zth-color-lobby-base-deep:#050611;--zth-color-lobby-panel:#151832;--zth-color-lobby-panel-strong:#0d1025;--zth-color-lobby-frame:#8bdcff;--zth-color-lobby-glow:#c084fc;--zth-color-lobby-accent-purple:#a855f7;--zth-color-lobby-accent-cyan:#22d3ee;--zth-color-lobby-accent-amber:#fbbf24;--zth-color-lobby-accent-teal:#2dd4bf;--zth-color-lobby-accent-orange:#fb923c;--zth-color-category-geography:#60a5fa;--zth-color-category-entertainment:#f472b6;--zth-color-category-history:#fbbf24;--zth-color-category-arts-literature:#c084fc;--zth-color-category-science-nature:#4ade80;--zth-color-category-sports-leisure:#fb923c;--zth-color-atmosphere-cloud-bright:#92a0c4;--zth-color-atmosphere-cloud-mid:#7484ac;--zth-color-atmosphere-cloud-muted:#6a7ea2;--zth-color-atmosphere-cloud-deep:#4e6284;--zth-media-lobby-hero-background:url(../../../media/ui/lobby-skin-v1/hero-card-background.webp);--zth-media-lobby-hero-frame:url(../../../media/ui/lobby-skin-v1/hero-card-frame.webp);--zth-media-lobby-hero-nameplate:url(../../../media/ui/lobby-skin-v1/hero-card-name-plate.webp);--zth-space-none:0;--zth-space-xs:.25rem;--zth-space-sm:.5rem;--zth-space-compact:.75rem;--zth-space-md:1rem;--zth-space-lg:1.5rem;--zth-space-xl:2rem;--zth-space-result-list-gap:.25rem;--zth-space-result-row-block:.25rem;--zth-space-result-row-inline:.75rem;--zth-space-display-results-gap:.5rem;--zth-space-display-results-padding-block:1rem;--zth-space-stage-safe:5%;--zth-space-stage-safe-block:5dvh;--zth-space-stage-safe-inline:5vw;--zth-size-control-target:2.75rem;--zth-size-primary-action:3rem;--zth-size-grid-control-min:14rem;--zth-size-grid-card-min:18rem;--zth-size-settings-panel-max:20rem;--zth-size-corner:.5rem;--zth-size-focus-ring:.1875rem;--zth-size-phone-scene-min:calc(100svh - 6.5rem);--zth-size-comic-panel-narrow:28rem;--zth-size-comic-panel-medium:38rem;--zth-size-comic-list-max:68rem;--zth-size-display-content-max:76rem;--zth-size-comic-border:.1rem;--zth-size-comic-hairline:.0625rem;--zth-size-comic-cut:1rem;--zth-size-comic-cut-compact:.55rem;--zth-size-comic-portrait-corner:.4rem;--zth-size-result-row-min:3.25rem;--zth-size-result-portrait:2.5rem;--zth-size-result-featured-portrait:9rem;--zth-size-result-rank-offset:4.35rem;--zth-size-display-results-heading:clamp(2rem, 4vw, 3.75rem);--zth-type-family-interface:system-ui, sans-serif;--zth-type-size-caption:.875rem;--zth-type-size-body:1rem;--zth-type-size-heading:clamp(1.5rem, 3vw, 2.5rem);--zth-type-size-display:clamp(1.75rem, 5vw, 3.5rem);--zth-type-size-result-context:1rem;--zth-type-size-result-label:.68rem;--zth-type-size-result-meta:.76rem;--zth-type-size-result-name:1.05rem;--zth-type-size-result-value:2.15rem;--zth-type-size-lobby-code:clamp(2.25rem, 6vw, 4.5rem);--zth-type-tracking-code:.12em;--zth-type-weight-body:400;--zth-type-weight-action:700;--zth-type-weight-impact:900;--zth-type-line-height-body:1.5;--zth-type-line-height-tight:1.05;--zth-layer-background:0;--zth-layer-content:10;--zth-layer-floating:20;--zth-layer-overlay:30;--zth-layer-recovery:40;--zth-motion-duration-fast:.12s;--zth-motion-duration-standard:.2s;--zth-motion-duration-action-impact:2.4s;--zth-motion-duration-action-impact-poster:2.4s;--zth-motion-duration-stun-twinkle:1.8s;--zth-motion-delay-stun-twinkle-mid:-630ms;--zth-motion-delay-stun-twinkle-late:-1220ms;--zth-motion-duration-lobby-entry:.48s;--zth-motion-duration-atmosphere-emissive:14s;--zth-motion-duration-atmosphere-steam:18s;--zth-motion-duration-atmosphere-rain:9s;--zth-motion-duration-atmosphere-searchlights:14s;--zth-motion-duration-atmosphere-secondary-emissive:17s;--zth-motion-delay-atmosphere-secondary-emissive:1.7s;--zth-motion-duration-atmosphere-lightning:.72s;--zth-motion-duration-atmosphere-sky-primary:11s;--zth-motion-duration-atmosphere-sky-secondary:15s;--zth-motion-delay-atmosphere-sky-secondary:-7s;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:var(--zth-type-family-interface)}[data-question-category=geography]{--zth-question-category-color:var(--zth-color-category-geography)}[data-question-category=entertainment]{--zth-question-category-color:var(--zth-color-category-entertainment)}[data-question-category=history]{--zth-question-category-color:var(--zth-color-category-history)}[data-question-category=arts_literature]{--zth-question-category-color:var(--zth-color-category-arts-literature)}[data-question-category=science_nature]{--zth-question-category-color:var(--zth-color-category-science-nature)}[data-question-category=sports_leisure]{--zth-question-category-color:var(--zth-color-category-sports-leisure)}[data-question-category] .zth-stage-panel{--zth-color-stage-panel-accent:var(--zth-question-category-color)}*,:before,:after{box-sizing:border-box}html,body{margin:var(--zth-space-none);background:var(--zth-color-stage-background);min-block-size:100%;min-inline-size:100%;color:var(--zth-color-text-primary);font-size:var(--zth-type-size-body)}html{scrollbar-gutter:stable}.zth-app-root,#main-content,[data-surface-shell]{min-block-size:100dvh;inline-size:100%;min-inline-size:0}.zth-app-root{isolation:isolate;position:relative}#main-content{z-index:var(--zth-layer-content);position:relative}[data-surface-shell=display]{block-size:100dvh;overflow:hidden}[data-surface-shell=phone],[data-surface-shell=landing]{min-block-size:100dvh;max-inline-size:100%;overflow-x:hidden}.zth-surface-shell-content{min-inline-size:0;max-inline-size:100%}[data-surface-shell=display] .zth-surface-shell-controls{z-index:var(--zth-layer-floating);inline-size:min(var(--zth-size-settings-panel-max), calc(100% - 2 * var(--zth-space-stage-safe-inline)));justify-content:flex-end;display:flex;position:absolute;inset-block-start:var(--zth-space-stage-safe-block);inset-inline-end:var(--zth-space-stage-safe-inline)}[data-surface-shell=phone] .zth-surface-shell-controls{z-index:var(--zth-layer-floating);min-inline-size:0;max-inline-size:100%;justify-content:flex-end;margin-block-start:var(--zth-space-md);display:flex;position:relative}@media (orientation:landscape){[data-surface-shell=phone] .zth-safe-area{padding-block:var(--zth-space-sm)}}:focus-visible,[tabindex="-1"]:focus{outline:var(--zth-size-focus-ring) solid var(--zth-color-focus-indicator);outline-offset:var(--zth-space-xs)}:is(h1,h2,h3,h4,h5,h6)[tabindex="-1"]:focus{outline:none}.zth-stack,.zth-cluster,.zth-grid{gap:var(--zth-space-md);display:flex}.zth-stack{flex-direction:column}.zth-cluster{flex-flow:wrap;align-items:center}.zth-grid{display:grid}.zth-grid[data-min=control]{grid-template-columns:repeat(auto-fit, minmax(min(100%, var(--zth-size-grid-control-min)), 1fr))}.zth-grid[data-min=card]{grid-template-columns:repeat(auto-fit, minmax(min(100%, var(--zth-size-grid-card-min)), 1fr))}[data-gap=sm]{gap:var(--zth-space-sm)}[data-gap=md]{gap:var(--zth-space-md)}[data-gap=lg]{gap:var(--zth-space-lg)}.zth-stage{block-size:100dvh;inline-size:100%;padding-block:var(--zth-space-stage-safe-block);padding-inline:var(--zth-space-stage-safe-inline);background:0 0;position:relative;overflow:hidden}.zth-stage[data-display-mode=full],.zth-stage[data-display-mode=compact]{isolation:isolate}.zth-stage[data-display-mode=compact]{--zth-type-size-heading:clamp(1.25rem, 2.5vw, 2rem);--zth-space-result-list-gap:.125rem;--zth-space-result-row-block:.125rem;--zth-space-result-row-inline:.35rem;--zth-space-display-results-gap:var(--zth-space-xs);--zth-space-display-results-padding-block:var(--zth-space-sm);--zth-size-result-row-min:2rem;--zth-size-result-portrait:1.5rem;--zth-size-result-featured-portrait:4.25rem;--zth-size-result-rank-offset:2.5rem;--zth-size-display-results-heading:clamp(1.5rem, 3vw, 2rem);--zth-type-size-result-context:.78rem;--zth-type-size-result-label:.5rem;--zth-type-size-result-meta:.62rem;--zth-type-size-result-name:.7rem;--zth-type-size-result-value:1.1rem}.zth-stage[data-display-mode=full]{--zth-size-result-row-min:2.5rem;--zth-size-result-portrait:2rem}.zth-stage-content,[data-surface-shell=display] [data-surface-content]{block-size:100%;min-block-size:0}.zth-stage[data-display-mode=below-minimum]>.zth-stage-content,.zth-stage:not([data-display-mode=below-minimum])>.zth-stage-notice{display:none}.zth-stage-notice{border:var(--zth-size-focus-ring) solid var(--zth-color-interactive-boundary);min-block-size:100%;padding:var(--zth-space-lg);background:var(--zth-color-surface);text-align:center;place-content:center;display:grid}.zth-stage-notice h1{overflow-wrap:anywhere;max-inline-size:28ch;margin:0}.zth-surface{border:var(--zth-size-comic-hairline) solid var(--zth-color-interactive-boundary);border-radius:var(--zth-size-corner);padding:var(--zth-space-md);background:var(--zth-color-surface);color:var(--zth-color-text-primary)}.zth-surface[data-tone=elevated]{background:var(--zth-color-surface-elevated)}.zth-surface[data-tone=error]{border-color:var(--zth-color-error-text);background:var(--zth-color-error-surface);color:var(--zth-color-error-text)}.zth-stage-panel{--zth-color-stage-panel-accent:var(--zth-color-lobby-accent-purple);border-block:var(--zth-size-comic-border) solid color-mix(in srgb, var(--zth-color-stage-panel-accent) 58%, transparent);background:color-mix(in srgb, var(--zth-color-lobby-panel-strong) 88%, transparent)}.zth-stage-panel[data-accent=cyan]{--zth-color-stage-panel-accent:var(--zth-color-lobby-accent-cyan)}.zth-stage-panel[data-accent=orange]{--zth-color-stage-panel-accent:var(--zth-color-lobby-accent-orange)}.zth-comic-panel,.zth-surface[data-variant=comic]{border-block:var(--zth-size-comic-border) solid color-mix(in srgb, var(--zth-color-comic-panel-accent) 58%, transparent);clip-path:polygon(var(--zth-size-comic-cut) 0, 100% 0, 100% calc(100% - var(--zth-size-comic-cut)), calc(100% - var(--zth-size-comic-cut)) 100%, 0 100%, 0 var(--zth-size-comic-cut));background:linear-gradient(145deg, color-mix(in srgb, var(--zth-color-lobby-panel-strong) 94%, transparent), color-mix(in srgb, var(--zth-color-lobby-base-deep) 84%, transparent));box-shadow:0 0 1.25rem color-mix(in srgb, var(--zth-color-comic-panel-accent) 12%, transparent)}.zth-comic-panel[data-accent=purple],.zth-surface[data-variant=comic][data-accent=purple]{--zth-color-comic-panel-accent:var(--zth-color-lobby-accent-purple)}.zth-comic-panel[data-accent=cyan],.zth-surface[data-variant=comic][data-accent=cyan]{--zth-color-comic-panel-accent:var(--zth-color-lobby-accent-cyan)}.zth-comic-panel[data-accent=orange],.zth-surface[data-variant=comic][data-accent=orange]{--zth-color-comic-panel-accent:var(--zth-color-lobby-accent-orange)}.zth-safe-area{min-block-size:100dvh;inline-size:100%;min-inline-size:0;max-inline-size:100%;padding-block-start:max(var(--zth-space-md), env(safe-area-inset-top));padding-block-end:max(var(--zth-space-md), env(safe-area-inset-bottom), var(--zth-keyboard-action-inset,var(--zth-space-none)));padding-inline-start:max(var(--zth-space-md), env(safe-area-inset-left));padding-inline-end:max(var(--zth-space-md), env(safe-area-inset-right));overflow-x:hidden}[data-surface-shell=landing] [data-surface-content]{min-block-size:calc(100dvh - 2 * var(--zth-space-md))}.zth-visually-hidden{block-size:.0625rem;inline-size:.0625rem;padding:var(--zth-space-none);clip:rect(0 0 0 0);white-space:nowrap;border:0;margin:-.0625rem;position:absolute;overflow:hidden}.zth-body-text,.zth-text-field,.zth-field-help,.zth-field-error{font-family:var(--zth-type-family-interface);font-size:var(--zth-type-size-body);font-weight:var(--zth-type-weight-body);line-height:var(--zth-type-line-height-body);letter-spacing:normal;text-transform:none}.zth-button,.zth-icon-button,.zth-text-field,.zth-toggle-input{min-inline-size:var(--zth-size-control-target);min-block-size:var(--zth-size-control-target)}.zth-button,.zth-icon-button{border:.125rem solid var(--zth-color-interactive-boundary);border-radius:var(--zth-size-corner);padding:var(--zth-space-sm) var(--zth-space-md);background:var(--zth-color-surface);color:var(--zth-color-text-primary);font:inherit;font-weight:var(--zth-type-weight-action)}.zth-button[data-tone=primary]{min-block-size:var(--zth-size-primary-action);background:var(--zth-color-action-primary);color:var(--zth-color-text-inverse)}.zth-button[data-tone=danger]{border-color:var(--zth-color-error-text);background:var(--zth-color-error-surface);color:var(--zth-color-error-text)}.zth-button[data-size=compact]{padding:var(--zth-space-xs) var(--zth-space-sm)}.zth-button[data-layout=wide]{justify-self:center;min-inline-size:min(100%,18rem)}.zth-button[data-layout=fill]{inline-size:100%}.zth-button[data-emphasis=impact]{text-transform:uppercase}.zth-button[data-emphasis=commit]{font-size:.92rem;font-weight:var(--zth-type-weight-impact);letter-spacing:.09em;text-transform:uppercase}.zth-button:disabled,.zth-icon-button:disabled{background:var(--zth-color-disabled-surface);color:var(--zth-color-disabled-text)}.zth-button[aria-busy=true]{cursor:progress}.zth-field{gap:var(--zth-space-xs);display:grid}.zth-text-field{border:.125rem solid var(--zth-color-interactive-boundary);border-radius:var(--zth-size-corner);inline-size:100%;padding:var(--zth-space-sm);background:var(--zth-color-stage-background);color:var(--zth-color-text-primary);font:inherit}.zth-text-field[data-variant=join-code]{border-color:color-mix(in srgb, var(--zth-color-lobby-accent-cyan) 52%, transparent);background:color-mix(in srgb, var(--zth-color-lobby-base-deep) 92%, transparent);min-block-size:3.5rem;font-size:1.25rem;font-weight:var(--zth-type-weight-impact);letter-spacing:.16em;text-align:center;text-transform:uppercase;padding-inline:3rem}.zth-text-field[data-variant=join-code]::placeholder{color:var(--zth-color-text-secondary);letter-spacing:.08em;opacity:.72}.zth-field-error{color:var(--zth-color-error-text);background:var(--zth-color-error-surface)}.zth-toggle{gap:var(--zth-space-sm);align-items:center;display:inline-flex}.zth-toggle-input{margin:var(--zth-space-none)}[data-reduced-motion=reduce]{--zth-motion-duration-fast:0s;--zth-motion-duration-standard:0s;--zth-motion-duration-action-impact:0s;--zth-motion-duration-lobby-entry:0s;--zth-motion-duration-atmosphere-emissive:0s;--zth-motion-duration-atmosphere-steam:0s;--zth-motion-duration-atmosphere-rain:0s;--zth-motion-duration-atmosphere-searchlights:0s;--zth-motion-duration-atmosphere-secondary-emissive:0s;--zth-motion-delay-atmosphere-secondary-emissive:0s;--zth-motion-duration-atmosphere-lightning:0s}[data-performance-mode=static]{--zth-motion-duration-action-impact:0s;--zth-motion-duration-lobby-entry:0s}@media (prefers-reduced-motion:reduce){:root,[data-theme=comic]{--zth-motion-duration-fast:0s;--zth-motion-duration-standard:0s;--zth-motion-duration-action-impact:0s;--zth-motion-duration-atmosphere-emissive:0s;--zth-motion-duration-atmosphere-steam:0s;--zth-motion-duration-atmosphere-rain:0s;--zth-motion-duration-atmosphere-searchlights:0s;--zth-motion-duration-atmosphere-secondary-emissive:0s;--zth-motion-delay-atmosphere-secondary-emissive:0s;--zth-motion-duration-atmosphere-lightning:0s}}@media (forced-colors:active){:root,[data-theme=comic]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root,[data-theme=comic]{--lightningcss-light: ;--lightningcss-dark:initial}}.zth-stage,.zth-stage-panel,.zth-surface,.zth-surface[data-variant=comic],.zth-comic-panel,.zth-stage-notice{color:canvastext;box-shadow:none;clip-path:none;background:canvas;border-color:canvastext}.zth-button,.zth-icon-button,.zth-text-field{color:buttontext;forced-color-adjust:none;background:buttonface;border-color:buttontext}.zth-button[data-tone=primary]{color:highlighttext;background:highlight;border-color:highlight}.zth-button:disabled,.zth-icon-button:disabled,.zth-text-field:disabled{color:graytext;background:canvas;border-color:graytext}:focus-visible{outline:var(--zth-size-focus-ring) solid Highlight}[tabindex="-1"]:focus{outline-color:highlight}}
