:root{--role-surface-page: var(--md-surface-dim);--role-surface-pane: var(--md-surface);--role-surface-card: var(--md-surface-container-low);--role-surface-raised: var(--md-surface-container-high);--role-surface-sunken: var(--md-surface-container-lowest);--role-paper-white: #ffffff;--role-ink: var(--md-on-surface);--role-ink-muted: var(--md-on-surface-variant);--role-ink-link: var(--md-primary);--role-accent: var(--md-primary);--role-accent-container: var(--md-primary-container);--role-on-accent-container: var(--md-on-primary-container);--role-accent-2: var(--md-secondary);--role-accent-2-container: var(--md-secondary-container);--role-on-accent-2-container: var(--md-on-secondary-container);--role-action: var(--btn-primary-bg);--role-on-action: var(--btn-primary-fg);--role-action-hover: var(--btn-primary-hover-bg);--role-on-action-hover: var(--btn-primary-hover-fg);--role-success: var(--md-success);--role-success-container: var(--md-success-container);--role-warning: var(--md-warning);--role-warning-container: var(--md-warning-container);--role-error: var(--md-error);--role-on-error: var(--md-on-error);--role-error-container: var(--md-error-container);--role-on-error-container: var(--md-on-error-container);--role-line: var(--md-outline-variant);--role-line-strong: var(--md-outline);--role-chrome: var(--md-surface-container-low);--role-on-chrome: var(--md-on-surface-variant);--role-chrome-indicator: var(--md-primary-container);--role-on-chrome-indicator: var(--md-on-primary-container);--role-scrim: #000000;--role-glass: #ffffff;--role-tint-error: #ffb4ab;--role-tint-warning: #ffbb33;--role-tint-info: #4285f4;--role-tint-neutral: #969696;--role-tint-extra: #8b7ed8;--role-tint-ink: #102f36;--role-tint-paper: #f8eee3;--role-radius-sm: 8px;--role-radius-md: 16px;--role-radius-lg: 24px;--role-radius-pill: 999px;--role-space-1: 4px;--role-space-2: 8px;--role-space-3: 12px;--role-space-4: 16px;--role-space-5: 24px;--role-space-6: 32px;--role-space-7: 48px;--role-font-display: var(--font-display);--role-font-body: var(--font-body);--role-font-mono: var(--font-mono);--role-text-xs: .75rem;--role-text-sm: .875rem;--role-text-md: 1rem;--role-text-lg: 1.25rem;--role-text-xl: 1.75rem;--role-text-2xl: 2.25rem;--role-motion-rise: var(--motion-rise)}:root:where([data-skin=quadmark]){--font-display: "Satoshi", "Helvetica Neue", Arial, sans-serif;--font-body: "Satoshi", "Helvetica Neue", Arial, sans-serif;--font-alt: "General Sans", "Helvetica Neue", Arial, sans-serif;--font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;--brand: #ff6d66;--brand-pressed: #e65a58;--qm-navy: #102f36;--qm-cream: #f8eee3;--qm-green: #60cd90;--qm-blue: #1863dc;--radius-s: 10px;--radius-m: 16px;--radius-l: 24px;--radius-pill: 999px;--ease-out: cubic-bezier(.2, .8, .2, 1);--motion-rise: quadmark-rise}:root:where([data-skin=quadmark]),:root:where([data-skin=quadmark])[data-theme=dark]{color-scheme:dark;--md-primary: color-mix(in srgb, var(--brand) 60%, #ffffff);--md-primary-light: #ff9a95;--md-primary-dark: var(--brand-pressed);--md-on-primary: #2b0906;--md-primary-container: #7a2a25;--md-on-primary-container: #ffd6d3;--md-secondary: #9fbff6;--md-secondary-light: #a2c1f8;--md-secondary-dark: var(--qm-blue);--md-on-secondary: #00245e;--md-secondary-container: #164a9e;--md-on-secondary-container: #dce7ff;--md-tertiary: #0e2a30;--md-tertiary-light: #1d4852;--md-tertiary-dark: #081a1f;--md-surface: var(--qm-navy);--md-surface-dim: #0b2127;--md-surface-bright: #2a5f6b;--md-surface-container-lowest: #081a1f;--md-surface-container-low: #143740;--md-surface-container: #183f49;--md-surface-container-high: #1d4852;--md-surface-container-highest: #23525d;--md-on-surface: var(--qm-cream);--md-on-surface-variant: #b9c7c3;--md-outline: #728b8e;--md-outline-variant: #274c55;--md-error: #ffa7a0;--md-error-container: #7d1f18;--md-on-error: #410002;--md-on-error-container: #ffdad6;--md-success: #6dd199;--md-success-container: #1c4d33;--md-warning: #f2c14e;--md-warning-container: #4d3b00;--accent-ask: var(--md-secondary);--accent-ask-soft: rgba(111, 160, 242, .14);--accent-roleplay: #ffb49c;--accent-roleplay-soft: rgba(255, 180, 156, .13);--accent-quiz: #6fd9e2;--accent-quiz-soft: rgba(111, 217, 226, .12);--accent-cert: #eecf60;--accent-cert-soft: rgba(238, 207, 96, .12);--accent-vault: var(--md-primary);--accent-vault-soft: rgba(255, 109, 102, .12);--accent-course: var(--md-success);--accent-course-soft: rgba(96, 205, 144, .14);--btn-primary-bg: var(--qm-cream);--btn-primary-fg: var(--qm-navy);--btn-primary-hover-bg: var(--brand);--btn-primary-hover-fg: var(--qm-navy);--shadow-card: 0 1px 2px rgba(0, 0, 0, .35), 0 8px 28px -12px rgba(0, 0, 0, .55);--shadow-raised: 0 2px 6px rgba(0, 0, 0, .4), 0 18px 44px -16px rgba(0, 0, 0, .6);--hairline: color-mix(in srgb, var(--brand) 32%, transparent);--overlay-faint: rgba(248, 238, 227, .025);--overlay-soft: rgba(248, 238, 227, .06);--overlay-strong: rgba(248, 238, 227, .1);--brand-tint-05: color-mix(in srgb, var(--brand) 5%, transparent);--brand-tint-08: color-mix(in srgb, var(--brand) 8%, transparent);--brand-tint-10: color-mix(in srgb, var(--brand) 10%, transparent);--brand-tint-15: color-mix(in srgb, var(--brand) 15%, transparent);--brand-tint-25: color-mix(in srgb, var(--brand) 25%, transparent);--brand-tint-30: color-mix(in srgb, var(--brand) 30%, transparent);--atmosphere: radial-gradient(1100px 520px at 8% -8%, rgba(255, 109, 102, .08), transparent 60%), radial-gradient(900px 480px at 100% 0%, rgba(24, 99, 220, .07), transparent 55%)}:root:where([data-skin=quadmark])[data-theme=light],:root:where([data-skin=quadmark])[data-theme=colour]{color-scheme:light;--md-primary: #a3342f;--md-primary-light: var(--brand);--md-primary-dark: #a3342f;--md-on-primary: #ffffff;--md-primary-container: #ffd9d6;--md-on-primary-container: #4a1210;--md-secondary: #1658b7;--md-secondary-light: #4a86ea;--md-secondary-dark: #0056a7;--md-on-secondary: #ffffff;--md-secondary-container: #d8e5ff;--md-on-secondary-container: #0d2c5e;--md-tertiary: #efe3d5;--md-tertiary-light: var(--qm-cream);--md-tertiary-dark: #e3d3c0;--md-surface: #fbf6ef;--md-surface-dim: #f1e6da;--md-surface-bright: #ffffff;--md-surface-container-lowest: #ffffff;--md-surface-container-low: var(--qm-cream);--md-surface-container: #f2e6d8;--md-surface-container-high: #ebddcc;--md-surface-container-highest: #e3d3c0;--md-on-surface: var(--qm-navy);--md-on-surface-variant: #4a5f64;--md-outline: #72868a;--md-outline-variant: #d6c9ba;--md-error: #ae261f;--md-error-container: #f9dedc;--md-on-error: #ffffff;--md-on-error-container: #410002;--md-success: #1a5f3c;--md-success-container: #cdefdb;--md-warning: #7a5407;--md-warning-container: #ffe3a8;--accent-ask: var(--md-secondary);--accent-ask-soft: rgba(24, 99, 220, .1);--accent-roleplay: #854e0f;--accent-roleplay-soft: rgba(179, 90, 0, .1);--accent-quiz: #06656c;--accent-quiz-soft: rgba(0, 131, 138, .09);--accent-cert: #725804;--accent-cert-soft: rgba(122, 92, 0, .1);--accent-vault: var(--md-primary);--accent-vault-soft: rgba(201, 68, 62, .09);--accent-course: var(--md-success);--accent-course-soft: rgba(46, 155, 98, .12);--btn-primary-bg: var(--qm-navy);--btn-primary-fg: var(--qm-cream);--btn-primary-hover-bg: var(--brand);--btn-primary-hover-fg: var(--qm-navy);--shadow-card: 0 1px 2px rgba(16, 47, 54, .06), 0 10px 30px -14px rgba(16, 47, 54, .18);--shadow-raised: 0 2px 6px rgba(16, 47, 54, .08), 0 22px 48px -18px rgba(16, 47, 54, .25);--hairline: color-mix(in srgb, var(--md-primary) 28%, transparent);--overlay-faint: rgba(16, 47, 54, .025);--overlay-soft: rgba(16, 47, 54, .05);--overlay-strong: rgba(16, 47, 54, .08);--brand-tint-05: color-mix(in srgb, var(--md-primary) 6%, transparent);--brand-tint-08: color-mix(in srgb, var(--md-primary) 9%, transparent);--brand-tint-10: color-mix(in srgb, var(--md-primary) 11%, transparent);--brand-tint-15: color-mix(in srgb, var(--md-primary) 16%, transparent);--brand-tint-25: color-mix(in srgb, var(--md-primary) 24%, transparent);--brand-tint-30: color-mix(in srgb, var(--md-primary) 30%, transparent);--atmosphere: radial-gradient(1100px 520px at 8% -8%, rgba(255, 109, 102, .12), transparent 60%), radial-gradient(900px 480px at 100% 0%, rgba(24, 99, 220, .06), transparent 55%)}:root:where([data-skin=quadmark])[data-theme=colour]{--qm-pop: var(--cw-colour, #ff6d66);--md-primary: color-mix(in srgb, var(--qm-pop) 55%, #000000);--md-primary-dark: var(--md-primary);--md-primary-light: var(--qm-pop);--md-primary-container: color-mix(in srgb, var(--qm-pop) 22%, #ffffff);--md-on-primary-container: color-mix(in srgb, var(--qm-pop) 35%, #000000);--md-surface-dim: color-mix(in srgb, var(--qm-pop) 6%, #fbf6ef);--btn-primary-bg: var(--qm-pop);--btn-primary-fg: var(--cw-colour-ink, #102f36);--btn-primary-hover-bg: var(--md-primary-container);--btn-primary-hover-fg: var(--md-on-primary-container);--accent-vault-soft: color-mix(in srgb, var(--md-primary) 9%, transparent);--atmosphere: radial-gradient(1100px 520px at 8% -8%, color-mix(in srgb, var(--qm-pop) 18%, transparent), transparent 60%), radial-gradient(900px 480px at 100% 0%, color-mix(in srgb, var(--qm-pop) 8%, transparent), transparent 55%)}:root:where([data-skin=quadmark]){--text-muted: var(--md-on-surface-variant);--border-color: var(--md-outline-variant);--surface: var(--md-surface-container-low);--error: var(--md-error);--brand-accent: var(--brand);--md-tertiary-container: var(--md-warning-container);--md-on-tertiary-container: var(--md-on-surface);--role-chrome: var(--md-surface-container-low);--role-on-chrome: var(--md-on-surface-variant);--role-chrome-indicator: var(--accent-vault-soft);--role-on-chrome-indicator: var(--md-primary);--role-radius-sm: var(--radius-s);--role-radius-md: var(--radius-m);--role-radius-lg: var(--radius-l);--role-radius-pill: var(--radius-pill);--role-text-xs: .75rem;--role-text-sm: .875rem;--role-text-md: 1rem;--role-text-lg: 1.25rem;--role-text-xl: 1.75rem;--role-text-2xl: 2.25rem}:root:where([data-skin=quadmark]){--quiz-red: #d81b60;--quiz-blue: #1565c0;--quiz-green: #2e7d32;--quiz-yellow: #fdd835;--quiz-on-red: #ffffff;--quiz-on-blue: #ffffff;--quiz-on-green: #ffffff;--quiz-on-yellow: #102f36;--timer-warning: var(--md-warning);--race-rail: var(--md-outline-variant);--race-leader: var(--brand)}:root:where([data-skin=quadmark]){--bg-primary: var(--md-surface-dim);--bg-secondary: var(--md-surface);--bg-tertiary: var(--md-surface-container);--bg-elevated: var(--md-surface-container-high);--bg-surface: var(--md-surface-container-highest);--surface-elevated: var(--md-surface-container-high);--accent-primary: var(--md-primary);--accent-primary-light: var(--md-primary-light);--accent-primary-dark: var(--md-primary-dark);--accent-glow: var(--hairline);--text-primary: var(--md-on-surface);--text-secondary: var(--md-on-surface-variant);--text-tertiary: var(--md-on-surface-variant);--text-inverse: var(--md-surface);--border-subtle: var(--md-outline-variant);--border-medium: var(--md-outline);--border-strong: var(--md-outline);--border-gold: var(--hairline);--color-success: var(--md-success);--color-success-light: var(--md-success-container);--color-warning: var(--md-warning);--color-warning-light: var(--md-warning-container);--color-error: var(--md-error);--color-error-light: var(--md-error-container);--color-info: var(--md-secondary);--color-info-light: var(--md-secondary-container);--gold: var(--md-primary);--gold-light: var(--md-primary);--gold-dark: var(--md-primary);--gradient-gold: linear-gradient(var(--brand), var(--brand));--radius-xs: var(--radius-s);--radius-sm: var(--radius-s);--radius-md: var(--radius-s);--radius-lg: var(--radius-m);--radius-xl: var(--radius-l);--radius-2xl: var(--radius-l);--radius-full: var(--radius-pill);--shadow-sm: var(--shadow-card);--shadow-md: var(--shadow-card);--shadow-lg: var(--shadow-raised);--shadow-xl: var(--shadow-raised);--shadow-glow-sm: 0 0 0 transparent;--shadow-glow-md: 0 0 0 transparent;--shadow-glow-lg: 0 0 0 transparent;--shadow-glow-gold: 0 0 0 transparent;--glass-bg: var(--md-surface-container-low);--glass-bg-light: var(--md-surface-container);--glass-border: var(--md-outline-variant);--glass-border-light: var(--md-outline-variant);--transition-fast: all .15s var(--ease-out);--transition-base: all .25s var(--ease-out);--transition-slow: all .4s var(--ease-out);--transition-spring: .3s var(--ease-out);--md-on-success: var(--md-surface)}:where([data-skin=quadmark]) input::placeholder,:where([data-skin=quadmark]) textarea::placeholder{color:var(--text-muted);opacity:1}:where([data-skin=quadmark]) body{font-family:var(--font-body);background-color:var(--md-surface-dim);background-image:var(--atmosphere);background-attachment:fixed;color:var(--md-on-surface);transition:background-color .35s var(--ease-out),color .35s var(--ease-out)}:where([data-skin=quadmark]) ::selection{background:var(--md-primary);color:var(--md-on-primary)}:where([data-skin=quadmark]) :focus-visible{outline:2px solid var(--md-primary);outline-offset:2px;border-radius:4px}:where([data-skin=quadmark]) ::-webkit-scrollbar{width:10px;height:10px}:where([data-skin=quadmark]) ::-webkit-scrollbar-track{background:transparent}:where([data-skin=quadmark]) ::-webkit-scrollbar-thumb{background:var(--md-outline-variant);border-radius:999px;border:2px solid transparent;background-clip:content-box}:where([data-skin=quadmark]) ::-webkit-scrollbar-thumb:hover{background-color:var(--md-outline);background-clip:content-box}:where([data-skin=quadmark]) h1,:where([data-skin=quadmark]) h2,:where([data-skin=quadmark]) h3,:where([data-skin=quadmark]) .page-title{font-family:var(--font-display);font-weight:700;letter-spacing:-.015em}:where([data-skin=quadmark]) .page-title{font-weight:600;font-size:clamp(1.7rem,3.5vw,2.4rem)}:where([data-skin=quadmark]) .mono{font-family:var(--font-mono)}:where([data-skin=quadmark]) .kicker{font-family:var(--font-mono);font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.14em;color:var(--md-primary);display:inline-flex;align-items:center;gap:8px}:where([data-skin=quadmark]) .kicker:before{content:"";width:18px;height:2px;border-radius:2px;background:currentColor}@keyframes quadmark-rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}:where([data-skin=quadmark]) .rise{animation:quadmark-rise .5s var(--ease-out) both}:where([data-skin=quadmark]) .stagger>*{animation:quadmark-rise .5s var(--ease-out) both}:where([data-skin=quadmark]) .stagger>*:nth-child(1){animation-delay:.03s}:where([data-skin=quadmark]) .stagger>*:nth-child(2){animation-delay:.09s}:where([data-skin=quadmark]) .stagger>*:nth-child(3){animation-delay:.15s}:where([data-skin=quadmark]) .stagger>*:nth-child(4){animation-delay:.21s}:where([data-skin=quadmark]) .stagger>*:nth-child(5){animation-delay:.27s}:where([data-skin=quadmark]) .stagger>*:nth-child(6){animation-delay:.33s}:where([data-skin=quadmark]) .stagger>*:nth-child(n+7){animation-delay:.39s}@media (prefers-reduced-motion: reduce){:where([data-skin=quadmark]) .rise,:where([data-skin=quadmark]) .stagger>*{animation:none}:where([data-skin=quadmark]) body{transition:none}}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}html,body,#root{height:100%}body{font-family:var(--font-body);font-size:16px;font-weight:400;line-height:1.5;min-height:100vh;overflow-x:hidden}#root{position:relative;z-index:1}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:700;line-height:1.2;color:var(--md-on-surface)}h1{font-size:var(--role-text-2xl);letter-spacing:-.03em}h2{font-size:var(--role-text-xl);letter-spacing:-.03em;line-height:1.25}h3{font-size:var(--role-text-lg);line-height:1.35}a{color:var(--md-primary);text-decoration:underline;text-underline-offset:2px}a:hover{text-decoration-thickness:2px}.app{min-height:100vh;display:flex;justify-content:center;align-items:center;padding:var(--role-space-5)}.app:has(.container-gameplay){padding:0;align-items:stretch}.container{width:100%;max-width:960px;max-height:calc(100vh - 2 * var(--role-space-5));overflow-y:auto;padding:var(--role-space-6);background:var(--md-surface);border:1px solid var(--md-outline-variant);border-radius:var(--radius-l);box-shadow:var(--shadow-card);animation:quadmark-rise .5s var(--ease-out) both}.header{display:flex;justify-content:space-between;align-items:center;gap:var(--role-space-4);margin-bottom:var(--role-space-5)}.header h2{color:var(--md-on-surface)}.home-container{width:100%;max-width:480px;padding:var(--role-space-7) var(--role-space-6);text-align:center;background:var(--md-surface);border:1px solid var(--md-outline-variant);border-radius:var(--radius-l);box-shadow:var(--shadow-card);animation:quadmark-rise .5s var(--ease-out) both}.home-brand{display:flex;justify-content:center;margin-bottom:var(--role-space-6)}.home-avatar{width:28px;height:28px;border-radius:50%}.home-tabs{display:flex;width:100%;margin-bottom:var(--role-space-5);padding:var(--role-space-1);background:var(--md-surface-container-low);border:1px solid var(--md-outline-variant);border-radius:var(--radius-pill)}.home-tab{flex:1;min-height:40px;padding:0 var(--role-space-4);font-family:var(--font-body);font-size:var(--role-text-sm);font-weight:600;color:var(--md-on-surface-variant);background:transparent;border:none;border-radius:var(--radius-pill);cursor:pointer;transition:background-color .2s var(--ease-out),color .2s var(--ease-out)}.home-tab:hover{color:var(--md-on-surface)}.home-tab.active{background:var(--md-primary);color:var(--md-on-primary)}.tab-content{width:100%;animation:quadmark-rise .5s var(--ease-out) both}.tab-description{margin-bottom:var(--role-space-5);font-size:var(--role-text-md);color:var(--md-on-surface-variant)}.btn.btn-hero{width:100%;height:56px;font-size:var(--role-text-lg)}.console-section{margin-top:var(--role-space-4)}.console-toggle{width:100%}.console-menu{display:flex;flex-direction:column;gap:var(--role-space-2);margin-top:var(--role-space-3);animation:quadmark-rise .3s var(--ease-out) both}.console-item{width:100%}.button-container{display:flex;flex-direction:column;gap:var(--role-space-4)}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--role-space-4);padding:var(--role-space-7);color:var(--md-on-surface-variant)}.spinner{width:24px;height:24px;border:3px solid var(--md-outline-variant);border-top-color:var(--md-primary);border-radius:50%;animation:spin .8s linear infinite}.spinner--large{width:48px;height:48px;border-width:4px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes slide-up{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@media (max-width: 768px){.app{padding:var(--role-space-3);padding-top:64px;align-items:flex-start}.home-container,.container{padding:var(--role-space-5) var(--role-space-4);border-radius:var(--radius-m);max-height:none}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--role-space-2);height:40px;padding:0 var(--role-space-5);font-family:var(--font-body);font-size:var(--role-text-sm);font-weight:600;line-height:1;letter-spacing:0;text-transform:none;white-space:nowrap;border:1px solid transparent;border-radius:var(--radius-pill);background:var(--md-surface-container-high);color:var(--md-on-surface);cursor:pointer;transition:transform .15s var(--ease-out),box-shadow .2s var(--ease-out),background-color .2s var(--ease-out),color .2s var(--ease-out),border-color .2s var(--ease-out)}.btn:hover:not(:disabled){transform:translateY(-1px);text-decoration:none}.btn:active:not(:disabled){transform:translateY(0)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-primary,.btn-success{background:var(--btn-primary-bg);color:var(--btn-primary-fg)}.btn-primary:hover:not(:disabled),.btn-success:hover:not(:disabled){background:var(--btn-primary-hover-bg);color:var(--btn-primary-hover-fg);box-shadow:0 6px 18px -6px var(--hairline)}.btn-secondary,.btn-back{background:transparent;border-color:var(--md-outline);color:var(--md-on-surface)}.btn-secondary:hover:not(:disabled),.btn-back:hover:not(:disabled){border-color:var(--md-primary);color:var(--md-primary)}.btn-tonal{background:var(--md-primary-container);color:var(--md-on-primary-container)}.btn-tonal:hover:not(:disabled){background:var(--md-surface-container-highest);color:var(--md-on-surface)}.btn-danger{background:var(--md-error-container);color:var(--md-on-error-container)}.btn-danger:hover:not(:disabled){box-shadow:var(--shadow-card)}.btn-sm{height:32px;padding:0 var(--role-space-3);font-size:var(--role-text-xs)}.btn-lg{height:48px;padding:0 var(--role-space-6);font-size:var(--role-text-md)}.btn-block{width:100%}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:1px solid var(--md-outline);border-radius:var(--radius-pill);background:var(--md-surface-container-low);color:var(--md-on-surface);cursor:pointer;transition:border-color .2s var(--ease-out),color .2s var(--ease-out)}.icon-btn:hover{border-color:var(--md-primary);color:var(--md-primary)}.icon-btn svg{width:20px;height:20px}.card{background:var(--md-surface-container-low);border:1px solid var(--md-outline-variant);border-radius:var(--radius-m);box-shadow:var(--shadow-card);padding:var(--role-space-5);transition:transform .18s var(--ease-out),box-shadow .25s var(--ease-out),border-color .25s var(--ease-out)}.card-clickable{cursor:pointer}.card-clickable:hover{transform:translateY(-2px);border-color:var(--hairline);box-shadow:var(--shadow-raised)}.input-field,.input-group input,.input-group select,.input-group textarea{width:100%;min-height:44px;padding:10px 14px;font-family:var(--font-body);font-size:16px;line-height:1.4;color:var(--md-on-surface);background:var(--md-surface-container-lowest);border:1px solid var(--md-outline);border-radius:var(--radius-s);transition:border-color .15s var(--ease-out)}.input-field:focus,.input-group input:focus,.input-group select:focus,.input-group textarea:focus{border-color:var(--md-primary);box-shadow:inset 0 0 0 1px var(--md-primary)}.input-group{margin-bottom:var(--role-space-4)}.input-group label,.field-label{display:block;margin-bottom:var(--role-space-2);color:var(--md-on-surface-variant);font-size:var(--role-text-sm);font-weight:500}.field-error{margin-top:var(--role-space-2);color:var(--md-error);font-size:var(--role-text-sm);font-weight:500}.input-invalid{border-color:var(--md-error)}.chip{display:inline-flex;align-items:center;gap:var(--role-space-1);height:24px;padding:0 10px;font-family:var(--font-mono);font-size:var(--role-text-xs);font-weight:600;letter-spacing:.04em;text-transform:uppercase;border-radius:var(--radius-pill);background:var(--md-surface-container-high);color:var(--md-on-surface)}.chip-accent{background:var(--md-primary-container);color:var(--md-on-primary-container)}.chip-info{background:var(--md-secondary-container);color:var(--md-on-secondary-container)}.chip-success{background:var(--md-success-container);color:var(--md-on-surface)}.chip-warning{background:var(--md-warning-container);color:var(--md-on-surface)}.chip-error{background:var(--md-error-container);color:var(--md-on-error-container)}.toggle-row{display:flex;align-items:center;gap:var(--role-space-3)}.toggle,.toggle-btn{position:relative;width:48px;height:28px;padding:0;border:none;background:none;cursor:pointer;flex-shrink:0}.toggle-track{display:block;position:relative;width:48px;height:28px;border-radius:var(--radius-pill);border:1px solid var(--md-outline);background:var(--md-surface-container-high);transition:background-color .2s var(--ease-out)}.toggle-on .toggle-track{background:var(--md-primary);border-color:var(--md-primary)}.toggle-thumb{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--md-on-surface-variant);transition:left .2s var(--ease-out)}.toggle-on .toggle-thumb{left:23px;background:var(--md-on-primary)}.toast-container{position:fixed;bottom:var(--role-space-5);right:var(--role-space-5);z-index:3000;display:flex;flex-direction:column;gap:var(--role-space-2);pointer-events:none}.toast{display:flex;align-items:center;gap:var(--role-space-3);max-width:400px;padding:var(--role-space-3) var(--role-space-4);font-size:var(--role-text-sm);color:var(--md-on-surface);background:var(--md-surface-container-high);border:1px solid var(--md-outline-variant);border-left:3px solid var(--md-outline);border-radius:var(--radius-s);box-shadow:var(--shadow-raised);cursor:pointer;pointer-events:auto;animation:quadmark-rise .3s var(--ease-out) both}.toast--success{background:var(--md-success-container);border-left-color:var(--md-success)}.toast--error{background:var(--md-error-container);border-left-color:var(--md-error);color:var(--md-on-error-container)}.toast--warning{background:var(--md-warning-container);border-left-color:var(--md-warning)}.toast--info{border-left-color:var(--md-secondary)}.toast-message{flex:1}.toast-close{padding:2px;font-size:var(--role-text-xs);color:inherit;background:none;border:none;cursor:pointer}.theme-menu{position:fixed;top:var(--role-space-3);right:var(--role-space-3);z-index:2500}.menu{position:absolute;top:calc(100% + var(--role-space-2));right:0;min-width:180px;padding:var(--role-space-2);background:var(--md-surface-container-high);border:1px solid var(--md-outline-variant);border-radius:var(--radius-m);box-shadow:var(--shadow-raised)}.menu-item{display:flex;align-items:center;gap:var(--role-space-3);width:100%;min-height:40px;padding:0 var(--role-space-3);font-family:var(--font-body);font-size:var(--role-text-sm);color:var(--md-on-surface);text-align:left;background:none;border:none;border-radius:var(--radius-s);cursor:pointer}.menu-item svg{width:18px;height:18px;flex-shrink:0}.menu-item:hover,.menu-item:focus-visible{background:var(--overlay-soft)}.menu-item[aria-checked=true]{color:var(--md-primary);font-weight:600}.brand-lockup{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px}.brand-lockup img{display:block;height:22px;width:auto}.brand-subline{font-family:var(--font-mono);font-size:.72rem;font-weight:600;letter-spacing:.14em;color:var(--md-on-surface)}.brand-lockup-center{align-items:center}.brand-lockup-lg img{height:32px}.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--role-space-4);margin-bottom:var(--role-space-5)}.section{margin-bottom:var(--role-space-6)}.section-header{display:flex;align-items:center;justify-content:space-between;gap:var(--role-space-3);margin-bottom:var(--role-space-3)}.empty-state{padding:var(--role-space-7) var(--role-space-5);text-align:center;color:var(--md-on-surface-variant);border:1px dashed var(--md-outline-variant);border-radius:var(--radius-m)}.banner{display:flex;align-items:center;justify-content:space-between;gap:var(--role-space-3);padding:var(--role-space-3) var(--role-space-4);font-size:var(--role-text-sm);border-radius:var(--radius-s);background:var(--md-surface-container-high);color:var(--md-on-surface)}.banner-error{background:var(--md-error-container);color:var(--md-on-error-container)}.banner-success{background:var(--md-success-container)}.banner-warning{background:var(--md-warning-container)}.banner-close{padding:0;font-size:var(--role-text-md);color:inherit;background:none;border:none;cursor:pointer}.row{display:flex;align-items:center;gap:var(--role-space-3)}.row-wrap{flex-wrap:wrap}.row-between{justify-content:space-between}.row-center{justify-content:center}.row-end{justify-content:flex-end}.stack{display:flex;flex-direction:column;gap:var(--role-space-3)}.stack-sm{gap:var(--role-space-2)}.stack-lg{gap:var(--role-space-5)}.grow{flex:1;min-width:0}.gap-sm{gap:var(--role-space-2)}.gap-lg{gap:var(--role-space-5)}.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--role-space-3)}.grid-auto{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--role-space-4)}.mt-sm{margin-top:var(--role-space-2)}.mt-md{margin-top:var(--role-space-4)}.mt-lg{margin-top:var(--role-space-5)}.mb-0{margin-bottom:0}.mb-sm{margin-bottom:var(--role-space-2)}.mb-md{margin-bottom:var(--role-space-4)}.mb-lg{margin-bottom:var(--role-space-5)}.w-full{width:100%}.hidden{display:none}.text-center{text-align:center}.text-right{text-align:right}.text-xs{font-size:var(--role-text-xs)}.text-sm{font-size:var(--role-text-sm)}.text-md{font-size:var(--role-text-md)}.text-lg{font-size:var(--role-text-lg)}.text-xl{font-size:var(--role-text-xl)}.text-muted{color:var(--md-on-surface-variant)}.text-accent{color:var(--md-primary)}.text-success{color:var(--md-success)}.text-warning{color:var(--md-warning)}.text-error{color:var(--md-error)}.text-strong{font-weight:600}.text-mono{font-family:var(--font-mono)}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.num{font-variant-numeric:tabular-nums lining-nums}.code-tracked{font-variant-numeric:tabular-nums lining-nums;letter-spacing:.05em}.density-compact .card{padding:var(--role-space-4)}.density-compact .input-group{margin-bottom:var(--role-space-3)}.density-compact .input-field,.density-compact .input-group input,.density-compact .input-group select,.density-compact .input-group textarea{min-height:40px;padding:8px 12px}@media (prefers-reduced-motion: reduce){.btn,.card,.toast,.toggle-track,.toggle-thumb{transition:none;animation:none}.btn:hover:not(:disabled),.card-clickable:hover{transform:none}}.kicker{font-size:.75rem}.screen-title{font-size:var(--role-text-2xl);font-weight:700;letter-spacing:-.03em;line-height:1.15}a.btn,a.btn:hover,a.btn:visited{text-decoration:none}.game-screen .header h2{font-size:var(--role-text-xl);font-weight:700;letter-spacing:-.03em}.game-screen .header-actions{display:flex;align-items:center;gap:var(--role-space-3)}.game-screen .hidden,.leaderboard .hidden{display:none}.room-code-display{margin:var(--role-space-5) 0;padding:var(--role-space-6);text-align:center;color:var(--md-on-surface);background:var(--md-surface-container-low);border:1px solid var(--md-outline-variant);border-radius:var(--radius-l)}.room-code-display h3{margin-bottom:var(--role-space-2);font-size:var(--role-text-md);font-weight:600;color:var(--md-on-surface-variant)}.room-code-display p{color:var(--md-on-surface-variant)}.room-code{font-family:var(--font-display);font-size:3.5rem;font-weight:700;line-height:1.1;letter-spacing:.05em;font-variant-numeric:tabular-nums lining-nums;color:var(--md-on-surface)}.pin-block{margin-top:var(--role-space-3)}.pin-label{margin-bottom:var(--role-space-1);font-size:var(--role-text-sm);font-weight:600;color:var(--md-on-surface-variant)}.pin-code{font-family:var(--font-display);font-size:var(--role-text-2xl);font-weight:700;line-height:1.1}.player-list{margin:var(--role-space-5) 0}.player-list h3{margin-bottom:var(--role-space-3);color:var(--md-on-surface)}.players{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:var(--role-space-3)}.player-item{display:flex;align-items:center;gap:var(--role-space-3);padding:var(--role-space-3) var(--role-space-4);background:var(--md-surface-container-high);border-radius:var(--radius-m);animation:quadmark-rise .5s var(--ease-out) both}.player-avatar{display:flex;align-items:center;justify-content:center;flex:none;width:36px;height:36px;font-weight:700;font-size:var(--role-text-md);color:var(--md-on-secondary-container);background:var(--md-secondary-container);border-radius:var(--radius-pill);object-fit:cover}.player-avatar-img{background:none;font-size:0}.player-item .player-name{flex:1;min-width:0;font-weight:600;color:var(--md-on-surface);overflow-wrap:anywhere}.question-container{margin:var(--role-space-5) 0;animation:quadmark-rise .5s var(--ease-out) both}.question-header{display:flex;justify-content:space-between;align-items:center;gap:var(--role-space-3);padding:var(--role-space-3) var(--role-space-5);color:var(--md-on-surface);background:var(--md-surface-container-high);border:1px solid var(--md-outline-variant);border-bottom:none;border-radius:var(--radius-l) var(--radius-l) 0 0}.question-number{font-size:var(--role-text-md);font-weight:600;color:var(--md-on-surface-variant)}.timer{min-width:80px;font-family:var(--font-display);font-size:var(--role-text-2xl);font-weight:700;line-height:1.1;text-align:center;color:var(--md-on-surface)}.timer.warning{color:var(--timer-warning);border:2px solid currentColor;border-radius:var(--radius-pill);animation:timer-pulse 1s var(--ease-out) infinite}@keyframes timer-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.question-content{padding:var(--role-space-6);background:var(--md-surface-container-low);border:1px solid var(--md-outline-variant);border-top:none;border-radius:0 0 var(--radius-l) var(--radius-l)}.question-text{margin-bottom:var(--role-space-5);font-family:var(--font-display);font-size:var(--role-text-xl);font-weight:700;line-height:1.25;letter-spacing:-.03em;text-align:center;color:var(--md-on-surface);overflow-wrap:anywhere}.question-image{display:flex;justify-content:center;margin-bottom:var(--role-space-5)}.question-image img{max-width:100%;max-height:200px;object-fit:contain;border-radius:var(--radius-m)}.options-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--role-space-4);margin:0;padding:0;list-style:none}.option-btn{--option-fill: var(--quiz-red);--option-on: var(--quiz-on-red);display:flex;align-items:center;gap:var(--role-space-3);min-height:64px;padding:var(--role-space-4);font-family:var(--font-body);font-size:var(--role-text-lg);font-weight:600;line-height:1.3;text-align:left;color:var(--option-on);background:var(--option-fill);border:0;border-radius:var(--radius-m);transition:transform .15s var(--ease-out),box-shadow .2s var(--ease-out)}.option-btn:nth-child(4n+2){--option-fill: var(--quiz-blue);--option-on: var(--quiz-on-blue)}.option-btn:nth-child(4n+3){--option-fill: var(--quiz-green);--option-on: var(--quiz-on-green)}.option-btn:nth-child(4n+4){--option-fill: var(--quiz-yellow);--option-on: var(--quiz-on-yellow)}button.option-btn{cursor:pointer}button.option-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:var(--shadow-raised)}button.option-btn:active:not(:disabled){transform:translateY(0)}button.option-btn:disabled{cursor:default}button.option-btn:focus-visible{outline:3px solid var(--md-on-surface);outline-offset:3px}.option-badge{display:inline-grid;place-items:center;flex:none;width:2em;height:2em;font-family:var(--font-display);font-size:.85em;font-weight:700;line-height:1;color:var(--option-fill);background:var(--option-on);border-radius:var(--radius-s)}.option-text{flex:1;min-width:0;overflow-wrap:anywhere}.option-mark{display:inline-flex;align-items:center;gap:var(--role-space-1);flex:none;margin-left:auto;font-size:var(--role-text-sm);font-weight:700}.option-mark [aria-hidden=true]{font-size:1.4em;line-height:1}.option-btn.selected,.option-btn.correct{outline:4px solid var(--md-on-surface);outline-offset:3px}.option-btn.dimmed{color:var(--md-on-surface-variant);background:var(--md-surface-container-high)}.option-btn.incorrect{color:var(--md-on-error-container);background:var(--md-error-container)}.option-btn.incorrect .option-badge{color:var(--md-error-container);background:var(--md-on-error-container)}.answer-feedback{display:flex;flex-direction:column;align-items:center;margin:var(--role-space-4) 0;padding:var(--role-space-5);font-size:var(--role-text-lg);font-weight:700;text-align:center;border-radius:var(--radius-l);animation:quadmark-rise .5s var(--ease-out) both}.answer-feedback.correct{color:var(--md-on-surface);background:var(--md-success-container)}.answer-feedback.incorrect{color:var(--md-on-error-container);background:var(--md-error-container)}.feedback-mark{margin-right:var(--role-space-2)}.points-earned{margin-top:var(--role-space-2);font-family:var(--font-display);font-size:var(--role-text-xl);font-variant-numeric:tabular-nums lining-nums}.score-popup{position:fixed;top:40%;left:0;right:0;z-index:2000;width:fit-content;margin-inline:auto;padding:var(--role-space-2) var(--role-space-5);font-family:var(--font-display);font-size:var(--role-text-2xl);font-weight:700;font-variant-numeric:tabular-nums lining-nums;background:var(--md-surface-container-high);border-radius:var(--radius-pill);box-shadow:var(--shadow-raised);pointer-events:none;animation:score-float 1.2s var(--ease-out) forwards}.score-popup.correct{color:var(--md-success)}.score-popup.incorrect{color:var(--md-error)}@keyframes score-float{0%{opacity:0;transform:translateY(14px)}25%{opacity:1;transform:translateY(0)}75%{opacity:1;transform:translateY(-24px)}to{opacity:0;transform:translateY(-40px)}}.streak-badge{display:inline-flex;align-items:center;gap:var(--role-space-1);margin-bottom:var(--role-space-3);padding:var(--role-space-1) var(--role-space-3);font-size:var(--role-text-sm);font-weight:700;font-variant-numeric:tabular-nums lining-nums;color:var(--md-on-surface);background:var(--md-warning-container);border-radius:var(--radius-pill)}.shake{animation:shake .4s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}15%{transform:translate(-6px)}30%{transform:translate(6px)}45%{transform:translate(-4px)}60%{transform:translate(4px)}75%{transform:translate(-2px)}90%{transform:translate(2px)}}.order-options{display:flex;flex-direction:column;gap:var(--role-space-3)}.order-option,.order-reveal-item{display:flex;align-items:center;gap:var(--role-space-3);min-height:56px;padding:var(--role-space-3) var(--role-space-4);font-size:var(--role-text-md);font-weight:600;color:var(--md-on-surface);background:var(--md-surface-container-high);border:2px solid var(--md-outline);border-radius:var(--radius-m)}.order-option{cursor:pointer;transition:border-color .15s var(--ease-out)}.order-option:hover:not(.disabled){border-color:var(--md-primary)}.order-option.selected{border-color:var(--md-primary);border-width:3px}.order-option.disabled{cursor:default}.order-option.correct-pos{border-color:var(--md-success);background:var(--md-success-container)}.order-option.wrong-pos{color:var(--md-on-error-container);background:var(--md-error-container);border-color:var(--md-error)}.order-badge{display:flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;font-size:var(--role-text-sm);font-weight:700;font-variant-numeric:tabular-nums lining-nums;color:var(--md-on-primary);background:var(--md-primary);border-radius:var(--radius-pill)}.order-badge.empty{color:transparent;background:transparent;border:2px dashed var(--md-outline)}.order-badge.correct-badge{color:var(--md-on-surface);background:var(--md-success-container);border:2px solid var(--md-success)}.order-badge.wrong-badge{color:var(--md-on-error-container);background:var(--md-error-container);border:2px solid var(--md-error)}.order-verdict{display:inline-flex;align-items:center;gap:var(--role-space-1);flex:none;margin-left:auto;font-size:var(--role-text-sm);font-weight:700;font-variant-numeric:tabular-nums lining-nums}.order-reset-btn{margin-top:var(--role-space-3)}.slider-question{display:flex;flex-direction:column;align-items:center;gap:var(--role-space-4);padding:var(--role-space-5) var(--role-space-4)}.slider-value-display{display:flex;align-items:center;min-height:56px;font-family:var(--font-display);font-size:var(--role-text-2xl);font-weight:700;font-variant-numeric:tabular-nums lining-nums;color:var(--md-primary)}.slider-input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;max-width:500px;height:10px;background:var(--md-surface-container-highest);border:1px solid var(--md-outline);border-radius:var(--radius-pill);cursor:pointer}.slider-input::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:44px;height:44px;background:var(--md-primary);border:3px solid var(--md-surface);border-radius:50%;box-shadow:var(--shadow-card);cursor:pointer}.slider-input::-moz-range-thumb{width:44px;height:44px;background:var(--md-primary);border:3px solid var(--md-surface);border-radius:50%;box-shadow:var(--shadow-card);cursor:pointer}.slider-range-labels{display:flex;justify-content:space-between;width:100%;max-width:500px;font-size:var(--role-text-sm);font-variant-numeric:tabular-nums lining-nums;color:var(--md-on-surface-variant)}.slider-submit-btn{margin-top:var(--role-space-2)}.slider-result{display:flex;flex-direction:column;align-items:center;gap:var(--role-space-3);width:100%;padding:var(--role-space-5) var(--role-space-4)}.slider-answer{font-size:var(--role-text-lg);font-weight:700;font-variant-numeric:tabular-nums lining-nums;color:var(--md-success)}.slider-yours{font-size:var(--role-text-md);font-weight:600;font-variant-numeric:tabular-nums lining-nums;color:var(--md-on-surface-variant)}.slider-number-line{position:relative;width:100%;max-width:500px;height:40px;margin:var(--role-space-5) 0}.slider-number-line-track{position:absolute;top:50%;left:0;right:0;height:4px;background:var(--md-outline);border-radius:var(--radius-pill);transform:translateY(-50%)}.slider-marker{position:absolute;top:50%;z-index:1;width:16px;height:16px;border:2px solid var(--md-surface);border-radius:50%;transform:translate(-50%,-50%)}.slider-marker.correct-marker{background:var(--md-success)}.slider-marker.player-marker{background:var(--md-primary)}.slider-marker-label{position:absolute;left:50%;font-size:var(--role-text-xs);font-weight:700;font-variant-numeric:tabular-nums lining-nums;white-space:nowrap;transform:translate(-50%)}.slider-marker-label.above{bottom:100%;margin-bottom:var(--role-space-1)}.slider-marker-label.below{top:100%;margin-top:var(--role-space-1)}.slider-marker-label.is-correct{color:var(--md-success)}.slider-marker-label.is-player{color:var(--md-primary)}.order-reveal-item .order-badge{color:var(--md-on-surface);background:var(--md-success-container);border:2px solid var(--md-success)}.host-slider-display{padding:var(--role-space-5) var(--role-space-4);text-align:center}.host-slider-hint{color:var(--md-on-surface-variant)}.host-slider-step{margin-top:var(--role-space-2);font-size:var(--role-text-sm);color:var(--md-on-surface-variant)}.host-slider-range{display:flex;align-items:center;justify-content:center;gap:var(--role-space-4);margin-top:var(--role-space-3);font-size:var(--role-text-lg);color:var(--md-on-surface-variant)}.host-slider-range .range-val{font-family:var(--font-display);font-weight:700;font-variant-numeric:tabular-nums lining-nums;color:var(--md-on-surface)}.race-track{display:flex;flex-direction:column;min-height:0;padding:var(--role-space-4) var(--role-space-5);background:var(--md-surface-container-low);border:1px solid var(--md-outline-variant);border-radius:var(--radius-l);overflow:hidden}.race-track-header{display:flex;justify-content:space-between;align-items:center;flex:none;margin-bottom:var(--role-space-3)}.race-track-title{font-family:var(--font-mono);font-size:var(--role-text-xs);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--md-primary)}.race-track-round{font-size:var(--role-text-sm);font-weight:600;color:var(--md-on-surface-variant)}.race-rail{position:relative;flex:none;height:64px;margin:var(--role-space-2) var(--role-space-5) var(--role-space-5) var(--role-space-2);background:var(--race-rail);border-radius:var(--radius-pill)}.race-rail:after{content:"";position:absolute;top:0;bottom:0;right:calc(-1 * var(--role-space-3));width:4px;background:var(--md-on-surface-variant);border-radius:var(--radius-pill)}.race-racer{position:absolute;top:50%;transition:left 1s var(--ease-out)}.race-racer-avatar{position:relative;display:grid;place-items:center;width:40px;height:40px;font-size:var(--role-text-sm);font-weight:700;color:var(--md-on-secondary-container);background:var(--md-secondary-container);border:3px solid var(--md-surface-container-low);border-radius:50%;transition:width .5s var(--ease-out),height .5s var(--ease-out)}.race-racer-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}.race-racer.leader .race-racer-avatar{width:48px;height:48px;font-size:var(--role-text-md);color:var(--role-tint-ink);background:var(--race-leader);border-color:var(--race-leader)}.race-crown{position:absolute;top:-1.1em;left:50%;font-size:var(--role-text-sm);line-height:1;color:var(--race-leader);transform:translate(-50%)}.race-racer-name{position:absolute;top:100%;left:50%;margin-top:2px;font-size:var(--role-text-xs);font-weight:600;white-space:nowrap;color:var(--md-on-surface-variant);transform:translate(-50%);pointer-events:none}.race-racer.leader .race-racer-name{color:var(--md-primary);font-weight:700}.race-scores{display:flex;flex-wrap:wrap;flex:none;gap:var(--role-space-2) var(--role-space-4);margin-top:var(--role-space-3)}.race-score-item{display:flex;align-items:center;gap:var(--role-space-2);font-size:var(--role-text-sm);color:var(--md-on-surface-variant)}.race-score-rank{min-width:2ch;font-weight:700}.race-score-name{font-weight:600}.race-score-val{font-weight:700;color:var(--md-on-surface)}.race-score-item.leader,.race-score-item.leader .race-score-val{color:var(--md-primary)}.leaderboard{margin:var(--role-space-5) 0}.leaderboard h3{margin-bottom:var(--role-space-4);font-size:var(--role-text-xl);letter-spacing:-.03em;text-align:center;color:var(--md-on-surface)}.leaderboard-list{display:flex;flex-direction:column;gap:var(--role-space-2)}.leaderboard-item{display:flex;align-items:center;padding:var(--role-space-4) var(--role-space-5);color:var(--md-on-surface);background:var(--md-surface-container-high);border:1px solid var(--md-outline-variant);border-radius:var(--radius-m)}.leaderboard-item.rank-1{color:var(--md-on-secondary-container);background:var(--md-secondary-container);border:2px solid var(--md-secondary)}.leaderboard-item.rank-2,.leaderboard-item.rank-3{color:var(--md-on-surface);background:var(--md-surface-container-highest);border-color:var(--md-outline)}.leaderboard-item.is-you{outline:3px solid var(--md-on-surface);outline-offset:2px}.leaderboard .rank{min-width:44px;margin-right:var(--role-space-4);font-family:var(--font-display);font-size:var(--role-text-lg);font-weight:700;color:inherit}.leaderboard-avatar{flex:none;width:32px;height:32px;margin-right:var(--role-space-3);border-radius:50%;object-fit:cover}.leaderboard-avatar-fallback{display:grid;place-items:center;font-size:var(--role-text-sm);font-weight:700;color:var(--md-on-secondary-container);background:var(--md-secondary-container);border:2px solid var(--md-surface)}.leaderboard .player-name{flex:1;min-width:0;font-size:var(--role-text-md);font-weight:600;color:inherit;overflow-wrap:anywhere}.leaderboard .score{font-family:var(--font-display);font-size:var(--role-text-lg);font-weight:700;color:inherit}.waiting-message{padding:var(--role-space-7) var(--role-space-5);font-size:var(--role-text-md);text-align:center;color:var(--md-on-surface-variant)}.waiting-message h3{margin-bottom:var(--role-space-2)}.playing-as{margin-top:var(--role-space-5);font-size:var(--role-text-lg);font-weight:600;color:var(--md-primary)}.game-finished{margin:var(--role-space-6) 0;text-align:center;animation:quadmark-rise .5s var(--ease-out) both}.game-finished h2{margin-bottom:var(--role-space-2);font-size:var(--role-text-2xl);font-weight:700;letter-spacing:-.03em;color:var(--md-on-surface)}.game-finished p{font-size:var(--role-text-md);color:var(--md-on-surface-variant)}.control-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--role-space-3);margin-top:var(--role-space-5)}.player-root .input-group input{min-height:56px}.player-root .input-group input.code-input{font-size:var(--role-text-lg);font-weight:600;letter-spacing:.05em;text-transform:uppercase}.player-root .input-group input.pin-input{min-height:64px;font-size:var(--role-text-2xl);font-weight:700;letter-spacing:.05em;text-align:center}.player-root .input-group input.input-invalid{border-color:var(--md-error)}.player-root .btn-lg{height:56px}.player-identity{display:flex;align-items:center;gap:var(--role-space-3);margin:var(--role-space-3) 0;padding:var(--role-space-3) var(--role-space-4);font-size:var(--role-text-sm);color:var(--md-on-surface-variant);background:var(--md-surface-container-high);border-radius:var(--radius-s)}.player-identity img{width:28px;height:28px;border-radius:50%}.player-root .room-code-display{margin:0 0 var(--role-space-5);padding:var(--role-space-5)}.player-root .room-code-display p{margin-top:var(--role-space-2)}.test-intro,.test-finished{padding:var(--role-space-5) 0;text-align:center}.test-intro .card,.test-summary{margin-bottom:var(--role-space-5)}.test-intro h3{margin-bottom:var(--role-space-2);font-size:var(--role-text-xl)}.test-intro p{font-size:var(--role-text-sm);color:var(--md-on-surface-variant)}.test-intro-lede{margin-bottom:var(--role-space-5)}.test-running-score{font-size:var(--role-text-sm);font-weight:600;color:var(--md-on-surface-variant)}.test-score{margin-bottom:var(--role-space-2);font-family:var(--font-display);font-size:var(--role-text-2xl);font-weight:700;letter-spacing:-.03em;color:var(--md-primary)}.test-score-summary{margin-bottom:var(--role-space-4);font-size:var(--role-text-sm);color:var(--md-on-surface-variant)}.test-breakdown{margin:0;padding:0;list-style:none;text-align:left}.test-row{display:flex;align-items:center;gap:var(--role-space-3);padding:var(--role-space-2) 0;font-size:var(--role-text-sm)}.test-row+.test-row{border-top:1px solid var(--md-outline-variant)}.test-row-mark{display:flex;align-items:center;justify-content:center;flex:none;width:24px;height:24px;font-size:var(--role-text-xs);font-weight:700;border-radius:50%}.test-row-mark.is-correct{color:var(--md-on-surface);background:var(--md-success-container)}.test-row-mark.is-wrong{color:var(--md-on-error-container);background:var(--md-error-container)}.test-row-points{white-space:nowrap;color:var(--md-on-surface-variant)}.host-root{--host-body: clamp(1rem, 2.2vmin, 1.5rem);--host-small: calc(var(--host-body) * .8);--host-title: calc(var(--host-body) * 1.6);--host-display: clamp(3rem, 6.6vmin, 4.5rem);--host-code: clamp(4rem, 11vmin, 8rem);--host-gap: calc(var(--host-body) * .75);--host-pad: calc(var(--host-body) * 1.25);font-size:var(--host-body)}.app:has(.host-root){padding:0;align-items:stretch}.container.host-root{display:flex;flex-direction:column;gap:var(--host-gap);width:100%;max-width:none;height:100vh;height:100dvh;max-height:none;padding:var(--host-pad);overflow-y:auto;background:var(--md-surface);border:0;border-radius:0;box-shadow:none}.container.host-root.container-gameplay{overflow:hidden}.host-root .header{flex:none;margin-bottom:0;padding-right:56px}.host-root .header h2{font-size:var(--host-title)}.host-root .answered-count{font-size:var(--host-body);font-weight:600;color:var(--md-on-surface-variant)}.host-root .btn{height:max(40px,calc(var(--host-body) * 2.5));padding:0 calc(var(--host-body) * 1.25);font-size:var(--host-body)}.host-root .btn.btn-sm{height:max(32px,calc(var(--host-body) * 2));font-size:var(--host-small)}.host-root .control-buttons{flex:none;margin-top:0}.host-lobby{display:grid;flex:1;grid-template-columns:minmax(0,5fr) minmax(0,4fr);grid-template-rows:minmax(0,1fr);gap:calc(var(--host-gap) * 2);min-height:0}.host-root .room-code-display{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--host-gap) * .5);margin:0;padding:var(--host-pad)}.host-root .room-code-display .brand-lockup{margin-bottom:var(--host-gap)}.host-root .brand-lockup img{height:calc(var(--host-body) * 1.6)}.host-root .brand-subline{font-size:var(--host-small)}.host-root .room-code-display h3,.host-root .pin-label{margin:0;font-size:var(--host-body)}.host-root .room-code-display p{font-size:var(--host-body)}.host-root .room-code{font-size:var(--host-code);line-height:1}.host-root .pin-block{margin-top:var(--host-gap)}.host-root .pin-code{font-size:var(--host-display);line-height:1}.host-root .player-list{display:flex;flex-direction:column;min-height:0;margin:0;overflow-y:auto}.host-root .player-list h3{font-size:var(--host-title)}.host-root .player-list .waiting-message{padding:var(--host-pad);font-size:var(--host-body)}.host-root .players{grid-template-columns:repeat(auto-fill,minmax(calc(var(--host-body) * 11),1fr));gap:var(--host-gap)}.host-root .player-item{font-size:var(--host-body)}.host-root .player-avatar{width:calc(var(--host-body) * 2);height:calc(var(--host-body) * 2);font-size:var(--host-body)}.host-root .gameplay-layout{display:flex;flex:1;flex-direction:column;gap:var(--host-gap);min-height:0}.host-root .gameplay-question{display:flex;flex:0 1 auto;flex-direction:column;gap:var(--host-gap);min-height:0}.host-root .question-container{display:flex;flex:0 1 auto;flex-direction:column;min-height:0;margin:0}.host-root .question-header{flex:none;padding:calc(var(--host-body) * .5) var(--host-pad)}.host-root .question-number{font-size:var(--host-body)}.host-root .question-content{min-height:0;padding:var(--host-pad);overflow-y:auto}.host-root .question-text{margin-bottom:var(--host-gap);font-size:var(--host-display);line-height:1.1}.host-root .question-content:has(.question-image){display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:var(--host-pad);align-items:center}.host-root .question-content:has(.question-image)>:not(.question-text):not(.question-image){grid-column:1 / -1}.host-root .question-image{margin-bottom:var(--host-gap)}.host-root .question-image img{max-width:30vw;max-height:calc(var(--host-display) * 2.4)}.host-root .options-grid{gap:var(--host-gap)}.host-root .option-btn{gap:var(--host-gap);min-height:calc(var(--host-title) * 2.25);padding:calc(var(--host-body) * .6) var(--host-body);font-size:var(--host-title);line-height:1.2;border-radius:var(--radius-l)}.host-root .option-mark{font-size:var(--host-title)}.host-root .option-btn.correct{outline-width:calc(var(--host-body) * .3)}.host-root .order-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--host-gap)}.host-root .order-option,.host-root .order-reveal-item{min-height:calc(var(--host-title) * 2);margin:0;font-size:var(--host-title)}.host-root .order-badge{width:calc(var(--host-title) * 1.3);height:calc(var(--host-title) * 1.3);font-size:var(--host-body)}.host-root .host-slider-display,.host-root .slider-result{padding:var(--host-gap)}.host-root .host-slider-hint,.host-root .host-slider-step{font-size:var(--host-body)}.host-root .host-slider-range,.host-root .slider-answer{font-size:var(--host-title)}.host-root .slider-number-line,.host-root .slider-range-labels{max-width:70%}.host-root .slider-range-labels,.host-root .slider-marker-label{font-size:var(--host-body)}.host-root .race-track{flex:1 1 auto;min-height:calc(var(--host-body) * 8);padding:var(--host-gap) var(--host-pad)}.host-root>.race-track{flex:none}.host-root .race-track-title{font-size:var(--host-small)}.host-root .race-track-round{font-size:var(--host-body)}.host-root .race-rail{height:calc(var(--host-body) * 3.5);margin:var(--host-gap) calc(var(--host-pad) * 1.5) calc(var(--host-body) * 1.5) var(--host-gap)}.host-root .race-racer-avatar{width:calc(var(--host-body) * 2.25);height:calc(var(--host-body) * 2.25);font-size:var(--host-body)}.host-root .race-racer.leader .race-racer-avatar{width:calc(var(--host-body) * 2.75);height:calc(var(--host-body) * 2.75);font-size:var(--host-body)}.host-root .race-crown{font-size:var(--host-body)}.host-root .race-racer-name{font-size:var(--host-small)}.host-root .race-scores{gap:calc(var(--host-gap) * .5) var(--host-pad);max-height:calc(var(--host-body) * 3.2);overflow:hidden}.host-root .race-score-item{font-size:var(--host-body)}.host-root .game-finished{margin:0}.host-root .game-finished h2{font-size:var(--host-display);line-height:1.1}.host-root .game-finished p{font-size:var(--host-body)}.host-root .leaderboard{margin:0}.host-root .leaderboard h3{font-size:var(--host-title)}.host-root .leaderboard-item{padding:calc(var(--host-body) * .6) var(--host-pad)}.host-root .leaderboard .rank,.host-root .leaderboard .score{font-size:var(--host-title)}.host-root .leaderboard .player-name{font-size:var(--host-body)}@media (min-aspect-ratio: 16/9) and (max-height: 800px){.host-root{--host-gap: calc(var(--host-body) * .6);--host-pad: var(--host-body)}.host-root .options-grid,.host-root .order-options{grid-template-columns:repeat(4,minmax(0,1fr))}.host-root .option-btn{min-height:calc(var(--host-title) * 2.5)}.host-root .race-track{min-height:calc(var(--host-body) * 7)}.host-root .race-scores{max-height:calc(var(--host-body) * 1.6)}}@media (max-width: 900px){.host-lobby{grid-template-columns:minmax(0,1fr);grid-template-rows:none}}@media (max-width: 768px){.game-screen .options-grid{grid-template-columns:minmax(0,1fr)}.game-screen .option-btn{min-height:56px;padding:var(--role-space-3) var(--role-space-4);font-size:var(--role-text-md)}.game-screen .question-text{font-size:var(--role-text-lg)}.game-screen .question-content{padding:var(--role-space-5) var(--role-space-4)}.game-screen .timer{font-size:var(--role-text-xl);min-width:64px}.game-screen .header h2{font-size:var(--role-text-lg)}.game-screen .control-buttons{flex-wrap:wrap}.container.host-root,.container.host-root.container-gameplay{height:auto;min-height:100vh;overflow:visible}.host-root .gameplay-layout,.host-root .gameplay-question,.host-root .question-container{overflow:visible}.host-root .question-content:has(.question-image){display:block}.host-root .question-image img{max-width:100%}.host-root .order-options{grid-template-columns:minmax(0,1fr)}.host-root .players{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.leaderboard .leaderboard-item{padding:var(--role-space-3) var(--role-space-4)}.leaderboard .rank{min-width:36px;margin-right:var(--role-space-3);font-size:var(--role-text-md)}}@media (prefers-reduced-motion: reduce){.game-screen,.game-screen *,.game-screen *:before,.game-screen *:after,.leaderboard *{animation:none!important;transition:none!important}.game-screen button.option-btn:hover:not(:disabled){transform:none}}.join-share{display:flex;align-items:center;justify-content:center;gap:var(--role-space-5);margin-top:var(--role-space-4)}.join-qr{width:clamp(7rem,22vmin,15rem);height:auto;aspect-ratio:1;border-radius:var(--radius-s)}.join-share-text{display:flex;flex-direction:column;align-items:flex-start;gap:var(--role-space-2);text-align:left}.join-url{font-family:var(--font-mono);font-size:var(--role-text-sm);color:var(--md-on-surface-variant);word-break:break-all}.host-root .join-url{font-size:var(--host-small)}@media (max-width: 640px){.join-share{flex-direction:column}.join-share-text{align-items:center;text-align:center}}.share-scrim{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:var(--role-space-4);background:color-mix(in srgb,var(--role-scrim) 55%,transparent)}.share-dialog{width:min(42rem,100%);max-height:calc(100vh - 2 * var(--role-space-4));overflow-y:auto;padding:var(--role-space-5);text-align:left}.share-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--role-space-4);margin-bottom:var(--role-space-4)}.share-head h3{margin-top:var(--role-space-1);font-size:var(--role-text-lg)}.share-body{display:flex;align-items:center;gap:var(--role-space-5)}.share-qr{width:11rem;height:auto;aspect-ratio:1;flex-shrink:0;border-radius:var(--radius-s)}.share-actions{display:flex;flex-direction:column;gap:var(--role-space-3);min-width:0}.share-lede,.share-tip,.share-off{font-size:var(--role-text-sm);color:var(--md-on-surface-variant)}.share-tip{margin-top:var(--role-space-4);padding-top:var(--role-space-3);border-top:1px solid var(--md-outline-variant)}.share-url{font-family:var(--font-mono);font-size:var(--role-text-sm);color:var(--md-on-surface);word-break:break-all}.lobby-note{max-width:32rem;margin:var(--role-space-3) auto 0;font-size:var(--role-text-sm);color:var(--md-on-surface-variant)}.link-quiz{text-align:center}.link-quiz h3{margin-top:var(--role-space-2);font-size:var(--role-text-xl)}.link-problem p{color:var(--md-on-surface)}@media (max-width: 640px){.share-body{flex-direction:column;align-items:flex-start}}.creator-screen{animation:quadmark-rise .5s var(--ease-out)}.creator-screen .kicker{display:flex}.quiz-list{display:flex;flex-direction:column;gap:var(--role-space-2)}.quiz-card{position:relative;display:flex;justify-content:space-between;align-items:center;gap:var(--role-space-4);padding:var(--role-space-3) var(--role-space-4);background:var(--md-surface-container-low);border:1px solid var(--md-outline-variant);border-radius:var(--radius-m);overflow:hidden;transition:border-color .2s var(--ease-out)}.quiz-card:hover{border-color:var(--md-outline)}.quiz-card--loading{pointer-events:none}.quiz-card-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;align-items:center;justify-content:center;gap:var(--role-space-3);background:color-mix(in srgb,var(--md-surface-container-low) 90%,transparent);color:var(--md-on-surface);font-size:var(--role-text-sm);font-weight:500}.quiz-card-info{flex:1;min-width:0}.quiz-card-title{margin-bottom:2px;font-size:var(--role-text-md);font-weight:700;color:var(--md-on-surface);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.quiz-card-meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--role-space-2);font-size:var(--role-text-sm);color:var(--md-on-surface-variant)}.quiz-card-actions{display:flex;flex-shrink:0;gap:var(--role-space-2)}.question-card{margin-bottom:var(--role-space-4);padding:var(--role-space-5);background:var(--md-surface-container-low);border:1px solid var(--md-outline-variant);border-radius:var(--radius-m)}.density-compact .question-card{padding:var(--role-space-4)}.question-card-header{display:flex;justify-content:space-between;align-items:center;gap:var(--role-space-3);margin-bottom:var(--role-space-3)}.drop-zone{position:relative;display:flex;flex-direction:column;align-items:center;gap:var(--role-space-1);margin-bottom:var(--role-space-4);padding:var(--role-space-5);text-align:center;font-size:var(--role-text-sm);color:var(--md-on-surface-variant);border:1px dashed var(--md-outline);border-radius:var(--radius-m);cursor:pointer;transition:border-color .2s var(--ease-out),background-color .2s var(--ease-out)}.drop-zone:hover{border-color:var(--md-primary);background:var(--md-surface-container);color:var(--md-on-surface)}.drop-zone:focus-within{outline:2px solid var(--md-primary);outline-offset:2px}.drop-zone-active{border-color:var(--md-primary);background:var(--md-primary-container);color:var(--md-on-primary-container)}.drop-zone-busy{cursor:wait}.drop-zone-status{align-items:center}.stack>.drop-zone{margin-bottom:0}.creator-spinner{display:inline-block;flex-shrink:0;width:24px;height:24px;border:3px solid var(--md-outline-variant);border-top-color:var(--md-primary);border-radius:50%;animation:spin .8s linear infinite}.creator-spinner--sm{width:14px;height:14px;border-width:2px;border-color:var(--md-outline);border-top-color:currentColor}.ai-count{min-width:200px}.field-inline{font-size:var(--role-text-sm);font-weight:500;color:var(--md-on-surface-variant);white-space:nowrap}.ai-range{accent-color:var(--md-primary)}.ai-select{width:auto;cursor:pointer}.question-type-tabs{display:flex;margin-bottom:var(--role-space-4);border:1px solid var(--md-outline-variant);border-radius:var(--radius-s);overflow:hidden}.question-type-tab{flex:1;min-height:36px;padding:var(--role-space-2) var(--role-space-3);font-family:var(--font-body);font-size:var(--role-text-xs);font-weight:600;text-align:center;color:var(--md-on-surface-variant);background:var(--md-surface-container);border:none;cursor:pointer;transition:background-color .15s var(--ease-out),color .15s var(--ease-out)}.question-type-tab:not(:last-child){border-right:1px solid var(--md-outline-variant)}.question-type-tab:hover:not(.active){background:var(--md-surface-container-high);color:var(--md-on-surface)}.question-type-tab.active{background:var(--md-primary);color:var(--md-on-primary)}.question-type-tabs .question-type-tab:focus-visible{outline-offset:-4px}.question-type-tabs .question-type-tab.active:focus-visible{outline-color:var(--md-on-primary)}.question-image{position:relative;text-align:center}.question-image-preview{max-width:100%;max-height:160px;border-radius:var(--radius-s);object-fit:contain}.icon-btn-sm{flex-shrink:0;width:32px;height:32px;font-size:var(--role-text-md);line-height:1}.image-remove{position:absolute;top:var(--role-space-1);right:var(--role-space-1);background:var(--md-surface-container-high)}.image-add{position:relative;display:inline-flex;align-items:center;gap:var(--role-space-2);min-height:32px;padding:var(--role-space-1) var(--role-space-3);font-size:var(--role-text-xs);font-weight:600;color:var(--md-on-surface-variant);border:1px dashed var(--md-outline);border-radius:var(--radius-s);cursor:pointer;transition:border-color .15s var(--ease-out),color .15s var(--ease-out)}.image-add:hover{border-color:var(--md-primary);color:var(--md-primary)}.image-add:focus-within{outline:2px solid var(--md-primary);outline-offset:2px}.slider-grid label{font-size:var(--role-text-xs)}.option-row input.option-radio{flex-shrink:0;width:20px;height:20px;min-height:0;margin:0;padding:0;accent-color:var(--md-primary);cursor:pointer}.option-row input.option-radio:focus{box-shadow:none}.option-row input.option-radio:focus-visible{outline:2px solid var(--md-primary);outline-offset:2px}.option-row input.option-position{flex-shrink:0;width:64px;text-align:center}.format-rules{padding:var(--role-space-4);background:var(--md-surface-container);border:1px solid var(--md-outline-variant);border-radius:var(--radius-s)}.format-rules code{padding:2px 6px;font-family:var(--font-mono);font-size:var(--role-text-sm);color:var(--md-primary);background:var(--md-surface-container-low);border-radius:var(--radius-s)}.format-rules-group{margin-top:var(--role-space-2);padding-top:var(--role-space-3);border-top:1px solid var(--md-outline-variant)}.format-code{padding:var(--role-space-4);font-family:var(--font-mono);font-size:var(--role-text-sm);line-height:1.6;white-space:pre;overflow-x:auto;color:var(--md-on-surface-variant);background:var(--md-surface-container);border:1px solid var(--md-outline-variant);border-radius:var(--radius-s)}@media (prefers-reduced-motion: reduce){.creator-screen,.creator-screen *{animation:none!important;transition:none!important}.creator-screen .btn:hover:not(:disabled){transform:none}}.admin-title,.admin-screen-title{margin:0;font-family:var(--font-display);font-weight:700;letter-spacing:-.03em;line-height:1.15;color:var(--md-on-surface)}.admin-title{font-size:var(--role-text-2xl)}.admin-screen-title{margin-bottom:var(--role-space-5);font-size:var(--role-text-xl)}.admin-help{margin:0;font-size:var(--role-text-sm);color:var(--md-on-surface-variant)}.density-compact .card>.input-group:last-child{margin-bottom:0}.admin-layout{width:100%;max-width:1200px;max-height:calc(100vh - 2 * var(--role-space-5));overflow-y:auto;background:var(--md-surface);border:1px solid var(--md-outline-variant);border-radius:var(--radius-l);animation:quadmark-rise .5s var(--ease-out) both}.admin-header{display:flex;justify-content:space-between;align-items:center;gap:var(--role-space-4);padding:var(--role-space-5) var(--role-space-6) 0}.admin-hamburger{display:none;min-width:40px;min-height:40px;padding:var(--role-space-1) var(--role-space-2);font-size:var(--role-text-lg);color:var(--md-on-surface);background:none;border:1px solid var(--md-outline);border-radius:var(--radius-pill);cursor:pointer}.admin-body{display:flex;flex-direction:column;min-height:500px}.admin-sidebar{display:flex;flex-wrap:wrap;align-self:flex-start;gap:var(--role-space-1);margin:var(--role-space-5) var(--role-space-6) 0;padding:var(--role-space-1);background:var(--md-surface-container-low);border:1px solid var(--md-outline-variant);border-radius:var(--radius-pill)}.admin-nav-item{display:inline-flex;align-items:center;height:40px;padding:0 var(--role-space-4);font-size:var(--role-text-sm);font-weight:500;color:var(--md-on-surface-variant);text-decoration:none;border-radius:var(--radius-pill);transition:background-color .2s var(--ease-out),color .2s var(--ease-out)}.admin-nav-item:hover{color:var(--md-on-surface);background:var(--md-surface-container-high);text-decoration:none}.admin-nav-item.active{font-weight:600;color:var(--md-on-primary);background:var(--md-primary)}.admin-content{flex:1;padding:var(--role-space-5) var(--role-space-6) var(--role-space-6);overflow-x:auto}@media (max-width: 768px){.admin-header{padding:var(--role-space-4) var(--role-space-4) 0}.admin-title{font-size:var(--role-text-xl)}.admin-sidebar{flex-direction:column;flex-wrap:nowrap;margin:0;padding:var(--role-space-2);border-width:0 0 1px;border-radius:0}.admin-nav-item{border-radius:var(--radius-s)}}.admin-table-wrap{overflow-x:auto}.admin-table{width:100%;border-collapse:collapse;font-size:var(--role-text-sm);color:var(--md-on-surface)}.admin-table th{padding:var(--role-space-2) var(--role-space-3);font-size:var(--role-text-xs);font-weight:600;letter-spacing:.04em;text-align:left;text-transform:uppercase;white-space:nowrap;color:var(--md-on-surface-variant);border-bottom:1px solid var(--md-outline-variant)}.admin-table td{padding:var(--role-space-2) var(--role-space-3);vertical-align:middle;border-bottom:1px solid var(--md-outline-variant)}.admin-table tbody tr:last-child td{border-bottom:none}.admin-table tbody tr:hover td{background:var(--md-surface-container)}.admin-table .text-right{text-align:right}.admin-role-select{height:32px;padding:0 var(--role-space-3);border:1px solid var(--md-outline-variant);cursor:pointer}.admin-role-select option{font-family:var(--font-body);text-transform:none;color:var(--md-on-surface);background:var(--md-surface-container-high)}.admin-pagination{display:flex;align-items:center;justify-content:center;gap:var(--role-space-4);margin-top:var(--role-space-5)}.stat-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:var(--role-space-3)}.stat-card{min-width:0;padding:var(--role-space-4);background:var(--md-surface-container-low);border:1px solid var(--md-outline-variant);border-radius:var(--radius-m)}.stat-value{margin-bottom:var(--role-space-1);overflow:hidden;font-family:var(--font-display);font-size:var(--role-text-xl);font-weight:700;font-variant-numeric:tabular-nums lining-nums;line-height:1.2;letter-spacing:-.03em;white-space:nowrap;text-overflow:ellipsis;color:var(--md-on-surface)}.stat-value.code-tracked{letter-spacing:.05em}.stat-label{font-size:var(--role-text-sm);font-weight:500;color:var(--md-on-surface-variant)}.bar-chart{display:flex;flex-direction:column;gap:var(--role-space-2)}.bar-row{display:flex;align-items:center;gap:var(--role-space-2)}.bar-label{min-width:88px;font-size:var(--role-text-sm);font-weight:500;white-space:nowrap;color:var(--md-on-surface-variant)}.bar-label.text-accent{color:var(--md-primary);font-weight:600}.bar-track{flex:1;height:16px;overflow:hidden;background:var(--md-surface-container-high);border-radius:var(--radius-pill)}.bar-fill{min-width:2px;height:100%;background:var(--md-secondary);border-radius:var(--radius-pill);transition:width .5s var(--ease-out)}.bar-fill.bar-correct{background:var(--md-success)}.bar-fill.bar-incorrect{background:var(--md-error)}.bar-value{min-width:80px;font-size:var(--role-text-sm);font-variant-numeric:tabular-nums lining-nums;text-align:right;color:var(--md-on-surface-variant)}.analytics-question-title{margin:0;font-size:var(--role-text-md);letter-spacing:-.015em}.analytics-accuracy{flex-shrink:0;min-width:60px;text-align:right}.analytics-list{margin:0;padding-left:var(--role-space-5)}.analytics-list-title{color:var(--md-on-surface)}@media (prefers-reduced-motion: reduce){.admin-layout{animation:none}.admin-nav-item,.bar-fill{transition:none}}.feedback-form{padding:8px 0}.comprehension-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:8px;border-radius:4px;background:linear-gradient(to right,var(--color-error),var(--color-warning),var(--color-success));outline:none;cursor:pointer}.comprehension-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:28px;height:28px;border-radius:50%;background:var(--text-primary);border:3px solid var(--accent-primary);cursor:pointer;box-shadow:0 2px 6px #0000004d}.comprehension-slider::-moz-range-thumb{width:28px;height:28px;border-radius:50%;background:var(--text-primary);border:3px solid var(--accent-primary);cursor:pointer;box-shadow:0 2px 6px #0000004d}.slider-labels{display:flex;justify-content:space-between;margin-top:8px;font-size:11px;color:var(--text-muted)}.slider-labels span.active{color:var(--accent-primary);font-weight:600}.slide-indicator{text-align:center;font-size:1.5rem;font-weight:700;font-family:var(--font-display);color:var(--text-primary);padding:16px 0}.slide-nav{display:flex;gap:12px;justify-content:center;margin:8px 0}.slide-nav .btn{min-width:120px}.slide-bar{width:100%;height:8px;background:var(--bg-elevated);border-radius:4px;overflow:hidden}.slide-bar-fill{height:100%;border-radius:4px;transition:width .3s ease}.score-chip{display:inline-block;padding:2px 8px;border-radius:12px;font-size:12px;font-weight:600;background:color-mix(in srgb,var(--md-primary) 15%,transparent);color:var(--accent-primary-light)}.session-card{display:flex;align-items:center;gap:16px;padding:16px;margin-bottom:8px;background:var(--bg-tertiary);border-radius:var(--radius-sm)}@media (max-width: 768px){.session-card{flex-direction:column;align-items:stretch;gap:12px}.session-card>div:last-child{justify-content:flex-end}.slide-nav .btn{min-width:100px}}@media (max-width: 768px){.quiz-card{flex-direction:column;align-items:flex-start;gap:10px}.quiz-card-actions{width:100%;flex-wrap:wrap}.quiz-card-actions .btn-sm{flex:1;min-width:0}.admin-hamburger{display:block}.admin-sidebar{display:none;position:absolute;left:0;top:100%;width:100%;background:var(--md-surface-container);border-bottom:1px solid var(--md-outline-variant);z-index:100}.admin-sidebar.open{display:flex}.admin-body{flex-direction:column;position:relative}.admin-content{padding:16px}.stat-cards{grid-template-columns:repeat(2,1fr)}.bar-label{min-width:60px;font-size:var(--role-text-xs)}.bar-value{min-width:50px;font-size:var(--role-text-xs)}}@media (max-width: 400px){.stat-cards{grid-template-columns:1fr 1fr}}
