@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Space+Grotesk:wght@600;700&display=swap";:root{--color-night-990: #02040a;--color-night-980: #050914;--color-night-970: #060b18;--color-night-960: #08111e;--color-night-950: #0a1324;--color-night-940: #0c162a;--color-night-930: #0e1a32;--color-night-920: #111e38;--color-night-910: #14223e;--color-night-900: #182644;--color-white: #ffffff;--color-slate-50: #f8fafc;--color-slate-100: #f1f5f9;--color-slate-200: #e2e8f0;--color-slate-300: #cbd5e1;--color-slate-400: #94a3b8;--color-slate-500: #64748b;--color-slate-600: #475569;--color-indigo-300: #a5b4fc;--color-indigo-400: #818cf8;--color-indigo-500: #6366f1;--color-indigo-600: #4f46e5;--color-violet-500: #8b5cf6;--color-blue-400: #60a5fa;--color-blue-500: #3b82f6;--color-blue-300: #75afff;--color-success-500: #22c55e;--color-success-600: #16a34a;--color-warning-500: #f59e0b;--color-error-500: #ef4444;--font-body: "Inter", system-ui, -apple-system, sans-serif;--font-heading: "Space Grotesk", "Inter", system-ui, sans-serif;--font-mono: "SF Mono", "Fira Code", "Cascadia Code", monospace;--tracking-tight: -.03em;--tracking-normal: -.01em;--tracking-wide: .04em;--tracking-caps: .1em;--type-display-xl-size: clamp(2.5rem, 5vw, 3.5rem);--type-display-xl-weight: 600;--type-display-lg-size: 1.2rem;--type-display-lg-weight: 700;--type-panel-title-size: 1.2rem;--type-panel-title-weight: 700;--type-section-label-size: .625rem;--type-section-label-weight: 700;--type-body-size: .875rem;--type-body-weight: 500;--type-body-sm-size: .8125rem;--type-body-sm-weight: 500;--type-helper-size: .6875rem;--type-helper-weight: 400;--type-status-size: .8125rem;--type-status-weight: 600;--type-meta-size: .625rem;--type-meta-weight: 600;--type-numeric-size: 1.125rem;--type-numeric-weight: 700;--sp-xs: 4px;--sp-sm: 8px;--sp-md: 12px;--sp-base: 16px;--sp-lg: 20px;--sp-xl: 24px;--sp-2xl: 32px;--sp-3xl: 40px;--sp-4xl: 48px;--sp-5xl: 64px;--radius-xs: 6px;--radius-sm: 10px;--radius-md: 14px;--radius-lg: 20px;--radius-xl: 24px;--radius-2xl: 28px;--radius-full: 999px;--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--transition-smooth: .25s var(--ease-out);--motion-enter-duration: .22s;--motion-emphasis-duration: .16s;--motion-status-pulse-duration: 2s;--motion-toast-duration: 3s;--motion-enter-distance: 8px;--motion-hover-lift-distance: -1px;--motion-reduced-duration: .01ms;--blur-panel: blur(12px);--blur-overlay: blur(8px);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .25);--shadow-md: 0 4px 16px rgba(0, 0, 0, .3);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--shadow-xl: 0 16px 48px rgba(0, 0, 0, .5);--shadow-glow: 0 0 20px rgba(98, 125, 255, .15);--shadow-glow-strong: 0 0 32px rgba(98, 125, 255, .25);--shadow-button: 0 4px 16px rgba(95, 123, 255, .3), 0 0 12px rgba(104, 140, 255, .15);--shadow-button-hover: 0 8px 24px rgba(95, 123, 255, .38), 0 0 20px rgba(104, 140, 255, .2);--shadow-inset-top: inset 0 1px 0 rgba(148, 163, 200, .07);--control-height-xs: 28px;--control-height-sm: 40px;--control-height-md: 44px;--control-height-lg: 64px;--control-icon-size-sm: 32px;--control-icon-size-md: 36px;--control-icon-size-lg: 44px;--control-padding-inline-sm: 12px;--control-padding-inline-md: 16px;--control-padding-inline-lg: 24px;--control-gap: 12px;--control-toggle-width: 40px;--control-toggle-height: 22px;--control-toggle-knob-size: 16px;--control-toggle-offset: 2px;--status-toggle-width: 28px;--status-toggle-height: 14px;--status-toggle-knob-size: 10px;--status-toggle-knob-translate: 14px;--status-surface-min-height: 40px;--status-surface-padding-block: 4px;--status-surface-padding-inline: 16px;--status-pill-padding-block: 3px;--status-pill-padding-inline: 8px;--layout-compact-card-padding-x: 8px;--layout-compact-card-padding-y: 4px;--layout-sheet-padding-inline: 24px;--layout-sheet-padding-inline-compact: 16px;--layout-sheet-footer-padding-x: 24px;--layout-sheet-footer-padding-y: 12px;--layout-sheet-footer-padding-bottom: 20px;--layout-sheet-footer-padding-bottom-compact: 16px}:root,:root[data-theme=night]{--theme-name: night;--theme-color: #0a1428;--theme-background-color: var(--color-night-980);--theme-bg-page: linear-gradient(180deg, var(--color-night-980) 0%, var(--color-night-930) 50%, var(--color-night-970) 100%);--theme-bg-canvas: linear-gradient(to bottom, var(--color-night-940), var(--color-night-900));--theme-bg-atmosphere: radial-gradient(circle at 50% 35%, rgba(98, 125, 255, .15), transparent 50%), radial-gradient(circle at 50% 15%, rgba(123, 156, 255, .08), transparent 40%), radial-gradient(ellipse 100% 100% at 50% 50%, transparent 40%, rgba(2, 4, 10, .48) 100%);--theme-text-primary: var(--color-slate-100);--theme-text-secondary: var(--color-slate-300);--theme-text-muted: var(--color-slate-400);--theme-text-dim: var(--color-slate-500);--theme-text-faint: var(--color-slate-600);--theme-text-inverse: var(--color-white);--theme-text-ghost: rgba(255, 255, 255, .2);--theme-accent-primary: var(--color-indigo-500);--theme-accent-primary-strong: var(--color-indigo-600);--theme-accent-secondary: var(--color-blue-500);--theme-accent-violet: var(--color-violet-500);--theme-accent-soft: rgba(99, 102, 241, .15);--theme-accent-soft-strong: rgba(99, 102, 241, .3);--theme-gradient-primary: linear-gradient(135deg, var(--color-indigo-500), var(--color-indigo-600));--theme-gradient-accent: linear-gradient(135deg, var(--color-indigo-500), var(--color-blue-500));--theme-gradient-violet: linear-gradient(135deg, var(--color-indigo-500), var(--color-violet-500));--theme-gradient-cta: linear-gradient(90deg, #6875ff 0%, #5d8fff 52%, #75afff 100%);--surface-hero-bg: linear-gradient(180deg, var(--color-night-950) 0%, var(--color-night-930) 55%, var(--color-night-960) 100%);--surface-hero-border: rgba(148, 163, 200, .14);--surface-hero-shadow: 0 30px 90px rgba(0, 0, 0, .55), 0 0 0 1px rgba(99, 102, 241, .04), inset 0 1px 0 rgba(255, 255, 255, .08);--surface-standard-bg: radial-gradient(ellipse 80% 80% at 50% 0%, rgba(98, 125, 255, .1), transparent 60%), linear-gradient(180deg, var(--color-night-910) 0%, var(--color-night-950) 55%, var(--color-night-970) 100%);--surface-standard-border: rgba(148, 163, 200, .13);--surface-standard-shadow: 0 40px 100px rgba(0, 0, 0, .6), 0 0 0 1px rgba(99, 102, 241, .05), 0 0 60px rgba(98, 125, 255, .07), inset 0 1px 0 rgba(255, 255, 255, .08);--surface-utility-bg: linear-gradient(180deg, rgba(20, 30, 54, .95), rgba(12, 20, 38, .97));--surface-utility-border: rgba(148, 163, 200, .13);--surface-utility-shadow: 0 20px 40px rgba(0, 0, 0, .3), 0 0 0 1px rgba(99, 102, 241, .03), inset 0 1px 0 rgba(255, 255, 255, .07);--surface-dock-bg: linear-gradient(180deg, rgba(16, 24, 44, .97) 0%, rgba(10, 16, 32, .98) 100%);--surface-dock-border: rgba(148, 163, 200, .1);--surface-dock-shadow: 0 -8px 32px rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .07);--surface-sheet-bg: radial-gradient(ellipse 90% 75% at 50% 0%, rgba(98, 125, 255, .12), transparent 58%), linear-gradient(180deg, rgba(14, 22, 42, .98) 0%, rgba(9, 15, 30, .99) 100%);--surface-sheet-border: rgba(148, 163, 200, .13);--surface-sheet-shadow: 0 24px 72px rgba(0, 0, 0, .52), 0 0 0 1px rgba(99, 102, 241, .06), inset 0 1px 0 rgba(255, 255, 255, .08);--surface-highlight-bg: linear-gradient(180deg, color-mix(in srgb, var(--theme-accent-primary) 12%, transparent), transparent 100%), var(--surface-utility-bg);--surface-highlight-border: color-mix(in srgb, var(--theme-accent-primary) 38%, var(--surface-utility-border));--surface-highlight-shadow: var(--surface-utility-shadow), 0 0 18px color-mix(in srgb, var(--theme-accent-primary) 16%, transparent);--surface-attention-bg: linear-gradient(180deg, color-mix(in srgb, var(--color-warning) 14%, transparent), transparent 100%), var(--surface-utility-bg);--surface-attention-border: color-mix(in srgb, var(--color-warning) 30%, var(--surface-utility-border));--surface-attention-shadow: var(--surface-utility-shadow), 0 0 18px color-mix(in srgb, var(--color-warning) 14%, transparent);--surface-sticky-footer-bg: linear-gradient(180deg, rgba(10, 16, 32, .82) 0%, rgba(8, 14, 28, .95) 22%, rgba(6, 11, 24, .995) 100%);--surface-sticky-footer-border: rgba(148, 163, 200, .05);--surface-play-canvas-bg: radial-gradient(circle at 50% 20%, rgba(98, 125, 255, .06), transparent 40%), var(--theme-bg-canvas);--surface-play-side-bg: radial-gradient(circle at 50% 30%, rgba(98, 125, 255, .05), transparent 45%), linear-gradient(135deg, rgba(10, 16, 32, .65) 0%, rgba(14, 22, 42, .55) 50%, rgba(6, 10, 22, .7) 100%);--board-surface-iso-cell-fill: rgba(255, 255, 255, .04);--board-surface-iso-cell-stroke: rgba(140, 148, 210, .44);--board-surface-classic-cell-fill: rgba(13, 21, 41, .72);--board-surface-classic-cell-stroke: rgba(140, 148, 210, .46);--board-surface-classic-grid-stroke: rgba(182, 192, 240, .78);--board-surface-classic-frame-fill: rgba(8, 13, 28, .38);--board-surface-classic-frame-stroke: rgba(140, 148, 210, .28);--board-surface-connect4-frame-fill: rgba(24, 40, 92, .92);--board-surface-connect4-frame-stroke: rgba(134, 158, 255, .34);--board-surface-connect4-slot-fill: rgba(3, 6, 16, .72);--board-surface-connect4-slot-stroke: rgba(255, 255, 255, .08);--surface-divider-bg: linear-gradient(180deg, rgba(255, 255, 255, .02) 0%, rgba(255, 255, 255, .08) 18%, rgba(255, 255, 255, .12) 50%, rgba(255, 255, 255, .08) 82%, rgba(255, 255, 255, .02) 100%);--surface-divider-bg-hover: linear-gradient(180deg, rgba(255, 255, 255, .04) 0%, rgba(255, 255, 255, .14) 18%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .14) 82%, rgba(255, 255, 255, .04) 100%);--surface-divider-shadow: inset 0 0 0 1px rgba(255, 255, 255, .06), 0 0 10px rgba(255, 255, 255, .04);--surface-divider-shadow-hover: inset 0 0 0 1px rgba(255, 255, 255, .1), 0 0 14px rgba(255, 255, 255, .06);--surface-divider-grip-bg: linear-gradient(180deg, rgba(255, 255, 255, .2) 0%, rgba(255, 255, 255, .42) 50%, rgba(255, 255, 255, .2) 100%);--surface-divider-grip-bg-hover: linear-gradient(180deg, rgba(255, 255, 255, .28) 0%, rgba(255, 255, 255, .56) 50%, rgba(255, 255, 255, .28) 100%);--surface-divider-grip-shadow: 0 0 10px rgba(255, 255, 255, .08);--surface-divider-grip-shadow-hover: 0 0 12px rgba(170, 196, 255, .18);--control-secondary-bg: rgba(255, 255, 255, .05);--control-secondary-bg-hover: rgba(255, 255, 255, .09);--control-secondary-bg-active: rgba(255, 255, 255, .07);--control-secondary-border: rgba(255, 255, 255, .1);--control-secondary-border-hover: rgba(255, 255, 255, .17);--control-secondary-fg: var(--theme-text-muted);--control-secondary-fg-hover: var(--theme-text-secondary);--control-secondary-shadow: var(--shadow-sm), inset 0 1px 0 rgba(255, 255, 255, .05);--control-primary-bg: var(--theme-gradient-cta);--control-primary-fg: var(--theme-text-inverse);--control-primary-shadow: var(--shadow-button);--control-primary-shadow-hover: var(--shadow-button-hover);--control-slider-track-bg: rgba(255, 255, 255, .1);--control-slider-thumb-bg: var(--theme-gradient-accent);--control-slider-thumb-border: rgba(255, 255, 255, .25);--control-slider-thumb-shadow: 0 2px 10px rgba(95, 123, 255, .35);--control-slider-thumb-shadow-hover: 0 2px 14px rgba(95, 123, 255, .5);--control-danger-bg: linear-gradient(180deg, rgba(239, 68, 68, .18) 0%, rgba(127, 29, 29, .32) 100%);--control-danger-bg-hover: linear-gradient(180deg, rgba(248, 113, 113, .22) 0%, rgba(153, 27, 27, .38) 100%);--control-danger-border: rgba(239, 68, 68, .28);--control-danger-border-hover: rgba(248, 113, 113, .38);--control-danger-fg: #ffe2e2;--control-danger-fg-hover: var(--theme-text-inverse);--control-danger-shadow: 0 10px 24px rgba(127, 29, 29, .22);--field-bg: rgba(255, 255, 255, .05);--field-bg-hover: rgba(255, 255, 255, .07);--field-border: rgba(255, 255, 255, .1);--field-border-hover: rgba(255, 255, 255, .15);--field-border-selected: rgba(129, 140, 248, .48);--field-selected-bg: rgba(99, 102, 241, .12);--field-selected-shadow: 0 8px 24px rgba(35, 40, 88, .22);--field-inset-shadow: inset 0 2px 4px rgba(0, 0, 0, .15);--status-surface-bg: var(--surface-utility-bg);--status-surface-border: var(--surface-utility-border);--status-surface-shadow: var(--surface-utility-shadow);--status-surface-live-shadow: var(--surface-utility-shadow), 0 0 18px rgba(98, 125, 255, .14), inset 0 1px 0 rgba(255, 255, 255, .06);--status-surface-result-shadow: var(--surface-utility-shadow), var(--shadow-glow), inset 0 1px 0 rgba(255, 255, 255, .06);--status-pill-bg: var(--control-secondary-bg);--status-pill-border: var(--control-secondary-border);--status-pill-fg: var(--control-secondary-fg);--status-pill-bg-hover: var(--control-secondary-bg-hover);--status-pill-border-hover: var(--control-secondary-border-hover);--status-pill-active-bg: var(--field-selected-bg);--status-pill-active-border: var(--field-border-selected);--status-pill-active-fg: var(--theme-text-primary);--status-chat-button-bg: color-mix(in srgb, var(--theme-accent-secondary) 22%, var(--control-secondary-bg));--status-chat-button-border: color-mix(in srgb, var(--theme-accent-secondary) 46%, var(--control-secondary-border));--status-chat-button-fg: color-mix(in srgb, var(--theme-accent-secondary) 55%, var(--theme-text-primary));--status-chat-button-bg-hover: color-mix(in srgb, var(--theme-accent-secondary) 32%, var(--control-secondary-bg-hover));--status-chat-button-border-hover: color-mix(in srgb, var(--theme-accent-secondary) 62%, var(--control-secondary-border-hover));--status-chat-button-fg-hover: var(--theme-text-primary);--status-chat-button-shadow: 0 0 0 1px color-mix(in srgb, var(--theme-accent-secondary) 14%, transparent), 0 10px 24px color-mix(in srgb, var(--theme-accent-secondary) 18%, transparent);--focus-ring: rgba(99, 102, 241, .5);--selected-ring: rgba(99, 102, 241, .18);--disabled-opacity: .35;--pressed-scale: .97;--color-success: var(--color-success-500);--color-success-hover: var(--color-success-600);--color-error: var(--color-error-500);--color-error-soft: rgba(239, 68, 68, .12);--color-warning: var(--color-warning-500);--state-success-bg: rgba(34, 197, 94, .1);--state-success-border: rgba(34, 197, 94, .3);--state-success-fg: #4ade80;--state-error-bg: rgba(239, 68, 68, .08);--state-error-border: rgba(239, 68, 68, .18);--state-error-fg: #fca5a5;--state-playable-bg: linear-gradient(180deg, rgba(16, 24, 44, .96), rgba(12, 18, 34, .98));--state-playable-border: rgba(96, 165, 250, .32);--state-pending-border: rgba(250, 204, 21, .72);--state-pending-shadow: 0 0 0 1px rgba(250, 204, 21, .24), 0 0 20px rgba(250, 204, 21, .14);--state-winning-border: rgba(74, 222, 128, .76);--state-winning-shadow: 0 0 0 1px rgba(74, 222, 128, .2), 0 0 18px rgba(74, 222, 128, .16);--bg-base: var(--color-night-980);--bg-mid: var(--color-night-930);--bg-deep: var(--color-night-970);--bg-surface: rgba(14, 22, 42, .88);--bg-elevated: rgba(18, 26, 48, .92);--panel-bg: var(--surface-standard-bg);--panel-border: var(--surface-dock-border);--panel-border-hover: var(--control-secondary-border-hover);--panel-shadow: 0 8px 32px rgba(0, 0, 0, .4), inset 0 1px 0 rgba(148, 163, 200, .07);--panel-shadow-lg: 0 16px 48px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(148, 163, 200, .07);--accent-primary: var(--theme-accent-primary);--accent-primary-light: color-mix(in srgb, var(--theme-accent-primary) 78%, var(--theme-text-inverse));--accent-secondary: var(--theme-accent-secondary);--accent-violet: var(--theme-accent-violet);--accent-glow: var(--theme-accent-soft);--accent-glow-strong: var(--theme-accent-soft-strong);--gradient-primary: var(--theme-gradient-primary);--gradient-accent: var(--theme-gradient-accent);--gradient-violet: var(--theme-gradient-violet);--gradient-cta: var(--theme-gradient-cta);--text-primary: var(--theme-text-primary);--text-secondary: var(--theme-text-secondary);--text-muted: var(--theme-text-muted);--text-dim: var(--theme-text-dim);--text-faint: var(--theme-text-faint);--text-ghost: var(--theme-text-ghost);--surface-interactive: var(--control-secondary-bg);--surface-interactive-hover: var(--control-secondary-bg-hover);--surface-interactive-active: var(--control-secondary-bg-active);--border-interactive: var(--control-secondary-border);--border-interactive-hover: var(--control-secondary-border-hover);--border-interactive-focus: var(--focus-ring)}:root[data-theme=day]{--theme-name: day;--theme-color: #f0f2f7;--theme-background-color: #f2f4f8;--theme-bg-page: linear-gradient(180deg, #f7f8fb 0%, #eceef4 48%, #f1f3f7 100%);--theme-bg-canvas: linear-gradient(to bottom, #eef0f6, #dce1eb);--theme-bg-atmosphere: radial-gradient(circle at 50% 18%, rgba(92, 75, 184, .1), transparent 38%), radial-gradient(circle at 50% 12%, rgba(88, 116, 184, .09), transparent 32%), radial-gradient(ellipse 100% 100% at 50% 50%, transparent 40%, rgba(130, 128, 160, .12) 100%);--theme-text-primary: #1c1917;--theme-text-secondary: #3d3733;--theme-text-muted: #5c554e;--theme-text-dim: #78706a;--theme-text-faint: #9a928b;--theme-text-inverse: var(--color-white);--theme-text-ghost: rgba(28, 25, 23, .12);--theme-accent-primary: #5c4bb8;--theme-accent-primary-strong: #4e3fa0;--theme-accent-secondary: #5874b8;--theme-accent-violet: #7644b8;--theme-accent-soft: rgba(92, 75, 184, .1);--theme-accent-soft-strong: rgba(92, 75, 184, .18);--theme-gradient-primary: linear-gradient(135deg, #6858c6, #5c4bb8);--theme-gradient-accent: linear-gradient(135deg, #6858c6, #5874b8);--theme-gradient-violet: linear-gradient(135deg, #6858c6, #7644b8);--theme-gradient-cta: linear-gradient(90deg, #6258c0 0%, #5770be 55%, #7094cc 100%);--surface-hero-bg: linear-gradient(180deg, rgba(255, 255, 255, .99) 0%, rgba(248, 249, 253, .99) 58%, rgba(243, 245, 250, .99) 100%);--surface-hero-border: rgba(80, 70, 196, .16);--surface-hero-shadow: 0 30px 72px rgba(80, 80, 120, .14), 0 2px 6px rgba(80, 80, 120, .06), 0 0 0 1px rgba(92, 75, 184, .04), inset 0 1px 0 rgba(255, 255, 255, .9);--surface-standard-bg: radial-gradient(ellipse 80% 80% at 50% 0%, rgba(92, 75, 184, .06), transparent 60%), linear-gradient(180deg, rgba(255, 255, 255, .99) 0%, rgba(249, 250, 253, .99) 58%, rgba(243, 245, 250, 1) 100%);--surface-standard-border: rgba(92, 75, 184, .18);--surface-standard-shadow: 0 28px 68px rgba(80, 80, 120, .12), 0 2px 6px rgba(80, 80, 120, .06), 0 0 0 1px rgba(92, 75, 184, .05), inset 0 1px 0 rgba(255, 255, 255, .9);--surface-utility-bg: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(247, 248, 252, .99));--surface-utility-border: rgba(92, 75, 184, .2);--surface-utility-shadow: 0 18px 36px rgba(80, 80, 120, .1), 0 1px 4px rgba(80, 80, 120, .06), 0 0 0 1px rgba(92, 75, 184, .04), inset 0 1px 0 rgba(255, 255, 255, .9);--surface-dock-bg: linear-gradient(180deg, rgba(253, 253, 255, .98) 0%, rgba(245, 247, 252, .98) 100%);--surface-dock-border: rgba(92, 75, 184, .14);--surface-dock-shadow: 0 -8px 28px rgba(80, 80, 120, .1), inset 0 1px 0 rgba(255, 255, 255, .9);--surface-sheet-bg: radial-gradient(ellipse 90% 75% at 50% 0%, rgba(92, 75, 184, .05), transparent 58%), linear-gradient(180deg, rgba(255, 255, 255, .99) 0%, rgba(247, 248, 253, .99) 100%);--surface-sheet-border: rgba(92, 75, 184, .16);--surface-sheet-shadow: 0 22px 56px rgba(80, 80, 120, .1), 0 2px 6px rgba(80, 80, 120, .06), 0 0 0 1px rgba(92, 75, 184, .05), inset 0 1px 0 rgba(255, 255, 255, .9);--surface-highlight-bg: linear-gradient(180deg, color-mix(in srgb, var(--theme-accent-primary) 8%, transparent), transparent 100%), var(--surface-utility-bg);--surface-highlight-border: color-mix(in srgb, var(--theme-accent-primary) 22%, var(--surface-utility-border));--surface-highlight-shadow: var(--surface-utility-shadow), 0 0 16px color-mix(in srgb, var(--theme-accent-primary) 8%, transparent);--surface-attention-bg: linear-gradient(180deg, color-mix(in srgb, var(--color-warning) 8%, transparent), transparent 100%), var(--surface-utility-bg);--surface-attention-border: color-mix(in srgb, var(--color-warning) 18%, var(--surface-utility-border));--surface-attention-shadow: var(--surface-utility-shadow), 0 0 14px color-mix(in srgb, var(--color-warning) 8%, transparent);--surface-sticky-footer-bg: linear-gradient(180deg, rgba(247, 248, 253, .86) 0%, rgba(243, 245, 250, .94) 24%, rgba(238, 240, 248, .98) 100%);--surface-sticky-footer-border: rgba(92, 75, 184, .1);--surface-play-canvas-bg: radial-gradient(circle at 50% 14%, rgba(255, 255, 255, .38), transparent 28%), radial-gradient(circle at 18% 22%, rgba(240, 242, 255, .28), transparent 22%), linear-gradient(180deg, #eaecf4 0%, #d4dae8 52%, #bfc8da 100%);--surface-play-side-bg: radial-gradient(circle at 24% 14%, rgba(255, 255, 255, .55), transparent 24%), radial-gradient(circle at 76% 20%, rgba(235, 240, 255, .2), transparent 24%), linear-gradient(135deg, rgba(247, 248, 253, .98) 0%, rgba(228, 232, 244, .98) 54%, rgba(210, 216, 232, 1) 100%);--board-surface-iso-cell-fill: rgba(235, 238, 248, .25);--board-surface-iso-cell-stroke: rgba(78, 64, 118, .62);--board-surface-classic-cell-fill: rgba(245, 246, 252, .88);--board-surface-classic-cell-stroke: rgba(88, 76, 128, .52);--board-surface-classic-grid-stroke: rgba(72, 60, 112, .88);--board-surface-classic-frame-fill: rgba(190, 195, 215, .22);--board-surface-classic-frame-stroke: rgba(88, 76, 128, .32);--board-surface-connect4-frame-fill: rgba(88, 114, 194, .94);--board-surface-connect4-frame-stroke: rgba(74, 68, 124, .44);--board-surface-connect4-slot-fill: rgba(245, 235, 221, .88);--board-surface-connect4-slot-stroke: rgba(74, 68, 124, .14);--surface-divider-bg: linear-gradient(180deg, rgba(110, 98, 139, .1) 0%, rgba(110, 98, 139, .18) 18%, rgba(110, 98, 139, .28) 50%, rgba(110, 98, 139, .18) 82%, rgba(110, 98, 139, .1) 100%);--surface-divider-bg-hover: linear-gradient(180deg, rgba(110, 98, 139, .14) 0%, rgba(110, 98, 139, .24) 18%, rgba(110, 98, 139, .36) 50%, rgba(110, 98, 139, .24) 82%, rgba(110, 98, 139, .14) 100%);--surface-divider-shadow: inset 0 0 0 1px rgba(110, 98, 139, .12), 0 0 12px rgba(110, 98, 139, .08);--surface-divider-shadow-hover: inset 0 0 0 1px rgba(110, 98, 139, .16), 0 0 16px rgba(110, 98, 139, .12);--surface-divider-grip-bg: linear-gradient(180deg, rgba(110, 98, 139, .24) 0%, rgba(110, 98, 139, .4) 50%, rgba(110, 98, 139, .24) 100%);--surface-divider-grip-bg-hover: linear-gradient(180deg, rgba(110, 98, 139, .3) 0%, rgba(110, 98, 139, .5) 50%, rgba(110, 98, 139, .3) 100%);--surface-divider-grip-shadow: 0 0 10px rgba(110, 98, 139, .1);--surface-divider-grip-shadow-hover: 0 0 14px rgba(110, 98, 139, .14);--control-secondary-bg: rgba(255, 255, 253, .9);--control-secondary-bg-hover: rgba(255, 255, 255, .97);--control-secondary-bg-active: rgba(244, 239, 232, .95);--control-secondary-border: rgba(92, 75, 184, .18);--control-secondary-border-hover: rgba(92, 75, 184, .28);--control-secondary-fg: var(--theme-text-muted);--control-secondary-fg-hover: var(--theme-text-secondary);--control-secondary-shadow: 0 10px 24px rgba(120, 100, 80, .11), 0 1px 3px rgba(120, 100, 80, .05), inset 0 1px 0 rgba(255, 255, 255, .86);--control-primary-bg: var(--theme-gradient-cta);--control-primary-fg: var(--theme-text-inverse);--control-primary-shadow: 0 8px 20px rgba(98, 88, 192, .18), 0 0 16px rgba(87, 112, 190, .1);--control-primary-shadow-hover: 0 12px 26px rgba(98, 88, 192, .24), 0 0 18px rgba(87, 112, 190, .14);--control-slider-track-bg: rgba(92, 75, 184, .1);--control-slider-thumb-bg: var(--theme-gradient-accent);--control-slider-thumb-border: rgba(255, 255, 255, .82);--control-slider-thumb-shadow: 0 2px 10px rgba(92, 75, 140, .15);--control-slider-thumb-shadow-hover: 0 2px 14px rgba(92, 75, 140, .22);--control-danger-bg: linear-gradient(180deg, rgba(254, 230, 226, .92) 0%, rgba(254, 210, 202, .96) 100%);--control-danger-bg-hover: linear-gradient(180deg, rgba(254, 218, 215, .96) 0%, rgba(252, 172, 165, .96) 100%);--control-danger-border: rgba(220, 68, 55, .2);--control-danger-border-hover: rgba(220, 68, 55, .3);--control-danger-fg: #8b1a1a;--control-danger-fg-hover: #721c1c;--control-danger-shadow: 0 10px 22px rgba(220, 68, 55, .08);--field-bg: rgba(255, 255, 255, .92);--field-bg-hover: rgba(255, 255, 255, .98);--field-border: rgba(92, 75, 184, .2);--field-border-hover: rgba(92, 75, 184, .32);--field-border-selected: rgba(92, 75, 184, .48);--field-selected-bg: rgba(92, 75, 184, .12);--field-selected-shadow: 0 12px 28px rgba(92, 75, 140, .1);--field-inset-shadow: inset 0 2px 4px rgba(120, 100, 80, .05);--status-surface-bg: var(--surface-utility-bg);--status-surface-border: var(--surface-utility-border);--status-surface-shadow: var(--surface-utility-shadow);--status-surface-live-shadow: var(--surface-utility-shadow), 0 0 18px rgba(92, 75, 184, .09), inset 0 1px 0 rgba(255, 255, 255, .76);--status-surface-result-shadow: var(--surface-utility-shadow), 0 0 16px rgba(92, 75, 184, .09), inset 0 1px 0 rgba(255, 255, 255, .78);--status-pill-bg: var(--control-secondary-bg);--status-pill-border: var(--control-secondary-border);--status-pill-fg: var(--control-secondary-fg);--status-pill-bg-hover: var(--control-secondary-bg-hover);--status-pill-border-hover: var(--control-secondary-border-hover);--status-pill-active-bg: var(--field-selected-bg);--status-pill-active-border: var(--field-border-selected);--status-pill-active-fg: var(--theme-text-primary);--status-chat-button-bg: color-mix(in srgb, var(--theme-accent-primary) 12%, var(--control-secondary-bg));--status-chat-button-border: color-mix(in srgb, var(--theme-accent-primary) 36%, var(--control-secondary-border));--status-chat-button-fg: color-mix(in srgb, var(--theme-accent-primary) 58%, var(--theme-text-primary));--status-chat-button-bg-hover: color-mix(in srgb, var(--theme-accent-primary) 18%, var(--control-secondary-bg-hover));--status-chat-button-border-hover: color-mix(in srgb, var(--theme-accent-primary) 54%, var(--control-secondary-border-hover));--status-chat-button-fg-hover: var(--theme-text-primary);--status-chat-button-shadow: 0 0 0 1px color-mix(in srgb, var(--theme-accent-primary) 12%, transparent), 0 10px 20px color-mix(in srgb, var(--theme-accent-primary) 12%, transparent);--focus-ring: rgba(92, 75, 184, .38);--selected-ring: rgba(92, 75, 184, .16);--disabled-opacity: .42;--pressed-scale: .97;--color-success: #1a8f45;--color-success-hover: #167a3a;--color-error: #c92a2a;--color-error-soft: rgba(200, 42, 42, .1);--color-warning: #c27006;--state-success-bg: rgba(26, 143, 69, .08);--state-success-border: rgba(26, 143, 69, .18);--state-success-fg: #166534;--state-error-bg: rgba(200, 42, 42, .06);--state-error-border: rgba(200, 42, 42, .16);--state-error-fg: #a51c1c;--state-playable-bg: linear-gradient(180deg, rgba(245, 248, 255, .98), rgba(229, 236, 252, .98));--state-playable-border: rgba(88, 116, 184, .42);--state-pending-border: rgba(194, 112, 6, .68);--state-pending-shadow: 0 0 0 1px rgba(194, 112, 6, .18), 0 0 18px rgba(194, 112, 6, .12);--state-winning-border: rgba(26, 143, 69, .62);--state-winning-shadow: 0 0 0 1px rgba(26, 143, 69, .16), 0 0 16px rgba(26, 143, 69, .1);--bg-base: #f2f4f8;--bg-mid: #eceef4;--bg-deep: #dce1eb;--bg-surface: rgba(255, 255, 255, .92);--bg-elevated: rgba(248, 249, 253, .96);--panel-shadow: 0 8px 32px rgba(80, 80, 120, .1), 0 1px 4px rgba(80, 80, 120, .05), inset 0 1px 0 rgba(255, 255, 255, .8);--panel-shadow-lg: 0 16px 48px rgba(80, 80, 120, .13), 0 2px 6px rgba(80, 80, 120, .06), inset 0 1px 0 rgba(255, 255, 255, .84)}body[data-viewport-width=compact]{--control-height-sm: 44px;--control-height-md: 44px;--control-icon-size-sm: 44px;--control-icon-size-md: 44px;--control-icon-size-lg: 44px;--control-padding-inline-sm: 14px;--control-padding-inline-md: 18px;--control-padding-inline-lg: 24px;--control-toggle-width: 44px;--control-toggle-height: 24px;--control-toggle-knob-size: 18px;--status-surface-min-height: 44px;--status-surface-padding-inline: 12px;--status-pill-padding-inline: 6px;--layout-sheet-footer-padding-x: 16px;--layout-sheet-footer-padding-bottom: calc(8px + var(--safe-area-bottom))}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight]{--control-height-sm: 44px;--control-height-md: 44px;--control-icon-size-sm: 44px;--control-icon-size-md: 44px;--control-icon-size-lg: 44px;--status-surface-min-height: 44px}.ui-surface{position:relative;border-radius:var(--radius-lg);border:1px solid var(--surface-standard-border);box-shadow:var(--surface-standard-shadow)}.ui-surface--hero{background:var(--surface-hero-bg);border-color:var(--surface-hero-border);box-shadow:var(--surface-hero-shadow)}.ui-surface--standard{background:var(--surface-standard-bg);border-color:var(--surface-standard-border);box-shadow:var(--surface-standard-shadow)}.ui-surface--utility{background:var(--surface-utility-bg);border-color:var(--surface-utility-border);box-shadow:var(--surface-utility-shadow)}.ui-surface--dock{background:var(--surface-dock-bg);border-color:var(--surface-dock-border);box-shadow:var(--surface-dock-shadow)}.ui-surface--sheet{background:var(--surface-sheet-bg);border-color:var(--surface-sheet-border);box-shadow:var(--surface-sheet-shadow)}.ui-surface--highlighted{background:var(--surface-highlight-bg);border-color:var(--surface-highlight-border);box-shadow:var(--surface-highlight-shadow)}.ui-surface--attention{background:var(--surface-attention-bg);border-color:var(--surface-attention-border);box-shadow:var(--surface-attention-shadow)}.ui-btn,.ui-icon-btn,.ui-choice,.ui-field{font-family:var(--font-body)}.ui-btn{display:inline-flex;align-items:center;justify-content:center;min-height:var(--control-height-md);padding:0 var(--control-padding-inline-md);border-radius:var(--radius-md);border:1px solid transparent;font-size:var(--type-body-sm-size);font-weight:600;line-height:1;cursor:pointer;text-align:center;transition:background var(--transition-fast),color var(--transition-fast),opacity var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast),border-color var(--transition-fast),filter var(--transition-fast)}.ui-btn:active{transform:scale(var(--pressed-scale))}.ui-btn:focus-visible,.ui-icon-btn:focus-visible,.ui-choice:focus-visible,.ui-field:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.ui-btn:disabled,.ui-icon-btn:disabled{opacity:var(--disabled-opacity);cursor:not-allowed}.ui-btn--primary{border:none;background:var(--control-primary-bg);color:var(--control-primary-fg);font-weight:700;box-shadow:var(--control-primary-shadow);text-shadow:0 1px 2px rgba(0,0,0,.2);letter-spacing:var(--tracking-normal)}.ui-btn--primary:hover:not(:disabled){transform:translateY(var(--motion-hover-lift-distance));filter:brightness(1.06);box-shadow:var(--control-primary-shadow-hover)}.ui-btn--secondary{background:var(--control-secondary-bg);border-color:var(--control-secondary-border);color:var(--control-secondary-fg);box-shadow:var(--control-secondary-shadow)}.ui-btn--secondary:hover:not(:disabled){background:var(--control-secondary-bg-hover);border-color:var(--control-secondary-border-hover);color:var(--control-secondary-fg-hover);transform:translateY(var(--motion-hover-lift-distance))}.ui-btn--danger{background:var(--control-danger-bg);border-color:var(--control-danger-border);color:var(--control-danger-fg);box-shadow:var(--control-danger-shadow)}.ui-btn--danger:hover:not(:disabled){background:var(--control-danger-bg-hover);border-color:var(--control-danger-border-hover);color:var(--control-danger-fg-hover);transform:translateY(var(--motion-hover-lift-distance))}.ui-btn--sm{min-height:var(--control-height-sm);padding-inline:var(--control-padding-inline-sm)}.ui-btn--md{min-height:var(--control-height-md);padding-inline:var(--control-padding-inline-md)}.ui-btn--full{width:100%}.ui-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:var(--control-icon-size-sm);min-width:var(--control-icon-size-sm);height:var(--control-icon-size-sm);padding:0;border-radius:var(--radius-sm);border:1px solid var(--control-secondary-border);background:var(--control-secondary-bg);color:var(--control-secondary-fg);cursor:pointer;transition:background var(--transition-fast),color var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast);box-shadow:inset 0 1px #ffffff08}.ui-icon-btn:hover:not(:disabled){background:var(--control-secondary-bg-hover);border-color:var(--control-secondary-border-hover);color:var(--control-secondary-fg-hover);transform:translateY(var(--motion-hover-lift-distance));box-shadow:var(--shadow-sm),inset 0 1px #ffffff08}.ui-icon-btn--sm{width:var(--control-icon-size-sm);min-width:var(--control-icon-size-sm);height:var(--control-icon-size-sm)}.ui-icon-btn--md{width:var(--control-icon-size-md);min-width:var(--control-icon-size-md);height:var(--control-icon-size-md)}.ui-icon-btn--subtle{background:transparent;border-color:transparent;box-shadow:none}.ui-icon-btn--subtle:hover:not(:disabled){background:var(--control-secondary-bg);border-color:var(--control-secondary-border)}.ui-choice{min-height:var(--control-height-sm);border-radius:var(--radius-sm);border:1px solid var(--field-border);background:var(--field-bg);color:var(--text-secondary);position:relative;transition:background var(--transition-fast),border-color var(--transition-fast),box-shadow var(--transition-fast),color var(--transition-fast),transform var(--transition-fast)}.ui-choice:hover:not(:disabled){background:var(--field-bg-hover);border-color:var(--field-border-hover);transform:translateY(var(--motion-hover-lift-distance))}.ui-choice--selected,.ui-choice--selected:hover:not(:disabled){background:linear-gradient(180deg,color-mix(in srgb,var(--theme-accent-primary) 38%,transparent),color-mix(in srgb,var(--theme-accent-primary) 18%,transparent)),var(--field-selected-bg);border-color:color-mix(in srgb,var(--theme-accent-primary) 68%,white);color:var(--text-primary);box-shadow:inset 0 0 0 1px color-mix(in srgb,white 28%,var(--theme-accent-primary)),inset 0 1px #ffffff24,0 0 0 2px color-mix(in srgb,var(--theme-accent-primary) 30%,transparent),0 10px 24px color-mix(in srgb,var(--theme-accent-primary) 20%,transparent),var(--field-selected-shadow)}.ui-field{border:1px solid var(--field-border);background:var(--field-bg);color:var(--text-secondary);transition:border-color var(--transition-base),box-shadow var(--transition-base),background var(--transition-base);box-shadow:inset 0 1px #ffffff08}.ui-field:hover:not(:disabled){background:var(--field-bg-hover);border-color:var(--field-border-hover)}.ui-status-surface{min-height:var(--status-surface-min-height);padding:var(--status-surface-padding-block) var(--status-surface-padding-inline);border-radius:var(--radius-md);background:var(--status-surface-bg);border:1px solid var(--status-surface-border);box-shadow:var(--status-surface-shadow)}.ui-status-surface--live{box-shadow:var(--status-surface-live-shadow)}.ui-status-surface--result{box-shadow:var(--status-surface-result-shadow)}.ui-status-pill{display:inline-flex;align-items:center;gap:6px;padding:var(--status-pill-padding-block) var(--status-pill-padding-inline);border-radius:var(--radius-full);background:var(--status-pill-bg);border:1px solid var(--status-pill-border);color:var(--status-pill-fg);font-size:var(--type-meta-size);font-weight:var(--type-meta-weight);letter-spacing:var(--tracking-caps);text-transform:uppercase;transition:border-color var(--transition-fast),color var(--transition-fast),background var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast)}.ui-status-pill:hover:not(:disabled){background:var(--status-pill-bg-hover);border-color:var(--status-pill-border-hover)}.ui-status-pill:active:not(:disabled){transform:scale(var(--pressed-scale))}.ui-status-pill--active{background:var(--status-pill-active-bg);border-color:var(--status-pill-active-border);color:var(--status-pill-active-fg);box-shadow:0 0 0 1px var(--selected-ring)}.ui-sheet-footer{padding:var(--layout-sheet-footer-padding-y) var(--layout-sheet-footer-padding-x) var(--layout-sheet-footer-padding-bottom);display:flex;align-items:center;gap:12px;flex-shrink:0}.ui-toggle{position:relative;width:var(--control-toggle-width);min-width:var(--control-toggle-width);height:var(--control-toggle-height);border-radius:var(--radius-full);border:1px solid var(--field-border);background:var(--field-bg-hover);cursor:pointer;padding:0;flex-shrink:0;transition:background var(--transition-base),box-shadow var(--transition-base),border-color var(--transition-base),transform var(--transition-fast)}.ui-toggle:hover:not(:disabled){border-color:var(--field-border-hover)}.ui-toggle--on{background:var(--control-primary-bg);border-color:var(--field-border-selected);box-shadow:var(--field-selected-shadow)}.ui-toggle:disabled{opacity:var(--disabled-opacity);cursor:not-allowed}.ui-toggle__knob{position:absolute;top:var(--control-toggle-offset);left:var(--control-toggle-offset);width:var(--control-toggle-knob-size);height:var(--control-toggle-knob-size);border-radius:50%;background:linear-gradient(180deg,var(--color-white),var(--color-slate-200));box-shadow:var(--shadow-sm);transition:transform var(--transition-smooth)}.ui-toggle--on .ui-toggle__knob{transform:translate(calc(var(--control-toggle-width) - var(--control-toggle-knob-size) - (var(--control-toggle-offset) * 2)))}@media(prefers-reduced-motion:reduce){.ui-btn,.ui-icon-btn,.ui-choice,.ui-field,.ui-status-pill,.ui-toggle,.ui-toggle__knob{transition-duration:var(--motion-reduced-duration);animation-duration:var(--motion-reduced-duration)}}:root{--safe-area-top: env(safe-area-inset-top, 0px);--safe-area-right: env(safe-area-inset-right, 0px);--safe-area-bottom: env(safe-area-inset-bottom, 0px);--safe-area-left: env(safe-area-inset-left, 0px);--app-width: 100vw;--app-height: 100vh;--app-height: 100dvh;--usable-width: calc(var(--app-width) - var(--safe-area-left) - var(--safe-area-right));--usable-height: calc(var(--app-height) - var(--safe-area-top) - var(--safe-area-bottom));--native-keyboard-height: 0px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{background-color:var(--theme-background-color)}html,body,#root{width:100%;height:100%;overflow:hidden}body{font-family:var(--font-body);font-variant-numeric:tabular-nums;background:var(--theme-background-color) var(--theme-bg-page);color:var(--text-secondary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}input,textarea,[contenteditable]{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}body.platform-ios-app-shell .player-card-input,body.platform-ios-app-shell .scoreboard-name-input,body.platform-ios-app-shell .status-bar-inline-input,body.platform-ios-app-shell .about-feedback-textarea{font-size:16px}body.native-keyboard-open{overscroll-behavior:none}#root:before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:var(--theme-bg-atmosphere)}#root:after{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-repeat:repeat;background-size:256px 256px}.lobby{--lobby-keyboard-offset: 0px;position:fixed;inset:0;display:flex;flex-direction:column;padding-top:var(--safe-area-top);background:var(--theme-bg-page);overflow:hidden;-webkit-user-select:none;user-select:none}body.platform-ios.platform-native.native-keyboard-open .lobby{--lobby-keyboard-offset: var(--native-keyboard-height, 0px)}.lobby input[type=text],.lobby textarea{-webkit-user-select:text;user-select:text}.lobby:before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:var(--theme-bg-atmosphere)}.lobby:after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse 100% 100% at 50% 50%,transparent 35%,rgba(2,4,10,.6) 100%)}.lobby-grid-texture{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:var(--theme-grid-texture-opacity);background-image:linear-gradient(var(--theme-grid-texture-line) 1px,transparent 1px),linear-gradient(90deg,var(--theme-grid-texture-line) 1px,transparent 1px);background-size:24px 24px}.lobby-scroll{position:relative;z-index:1;flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;justify-content:center;align-items:flex-start;padding:40px 24px;padding-bottom:calc(40px + var(--safe-area-bottom) + var(--lobby-keyboard-offset));scroll-padding-bottom:calc(24px + var(--safe-area-bottom) + var(--lobby-keyboard-offset))}.lobby-panel{position:relative;width:100%;max-width:640px;display:flex;flex-direction:column;align-items:center;gap:32px;padding:48px 32px 36px;border-radius:var(--radius-2xl);border:1px solid var(--surface-hero-border);background:var(--surface-hero-bg);box-shadow:var(--surface-hero-shadow);animation:lobbyFadeIn .5s ease both}.lobby-gear-btn{position:absolute;top:var(--sp-lg);right:var(--sp-lg);z-index:2}.lobby-change-game-btn{position:absolute;top:var(--sp-lg);left:var(--sp-lg);z-index:2;width:32px;padding:0}.lobby-change-game-btn svg{flex-shrink:0}.lobby-header{text-align:center;position:relative;flex-shrink:0;width:100%;box-sizing:border-box}.lobby-title{font-family:var(--font-heading);font-size:var(--type-display-xl-size);font-weight:var(--type-display-xl-weight);letter-spacing:var(--tracking-tight);color:var(--text-primary);margin:0;line-height:1.1;overflow-wrap:anywhere;text-wrap:balance;filter:drop-shadow(0 0 18px rgba(120,150,255,.22))}.lobby-title--single-line{white-space:nowrap}.lobby-title--join-shortcut{font-size:clamp(1.85rem,4vw,2.65rem)}.lobby-subtitle{font-size:.75rem;color:var(--text-dim);margin:10px 0 0;font-weight:500;letter-spacing:.35em;text-transform:uppercase}.lobby-subtitle--body{max-width:520px;margin-inline:auto;font-size:.95rem;font-weight:500;letter-spacing:normal;line-height:1.5;text-transform:none}.game-selection-panel{--game-selection-card-width: 320px;max-width:1120px;gap:20px;padding:28px 24px 22px}.game-selection-header{width:100%;text-align:center;padding-inline:46px}.game-selection-eyebrow{display:inline-flex;align-items:center;justify-content:center;margin-bottom:10px;color:var(--text-secondary);font-size:.62rem;font-weight:700;letter-spacing:.28em;text-transform:uppercase}.game-selection-subtitle{max-width:560px;margin:8px auto 0;color:var(--text-muted);font-size:.9rem;line-height:1.45}.game-selection-grid{width:100%;display:grid;grid-template-columns:minmax(0,1fr);justify-content:center;justify-items:center;align-content:start;gap:12px;flex:1 1 auto;min-height:0}.game-selection-join-row{width:min(100%,var(--game-selection-card-width));margin:0 auto}.game-selection-join-btn{width:100%}.game-selection-toggle-row{width:min(100%,var(--game-selection-card-width));margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:4px 2px 0}.game-selection-toggle-copy{display:flex;flex-direction:column;gap:2px;min-width:0}.game-selection-toggle-label{color:var(--text-secondary);font-size:.8125rem;font-weight:500;line-height:1.3}.game-selection-toggle-hint{color:var(--text-dim);font-size:.6875rem;line-height:1.3}.game-selection-card{display:flex;flex-direction:column;gap:12px;width:min(100%,var(--game-selection-card-width));max-width:var(--game-selection-card-width);min-height:0;padding:16px;border-radius:28px;border:1px solid var(--surface-standard-border);background:var(--surface-standard-bg);box-shadow:var(--surface-standard-shadow),inset 0 0 0 1px #536fb014;text-align:left;cursor:pointer;transition:transform var(--transition-smooth),border-color var(--transition-smooth),box-shadow var(--transition-smooth),background var(--transition-smooth)}.game-selection-card:hover{transform:translateY(-3px);border-color:var(--control-secondary-border-hover);box-shadow:var(--surface-standard-shadow),0 0 0 1px #ffffff0d,var(--shadow-glow)}.game-selection-card:active{transform:translateY(-1px)}.game-selection-card:focus-visible{outline:none;border-color:var(--field-border-selected);box-shadow:0 0 0 2px var(--selected-ring),var(--surface-standard-shadow)}.game-selection-preview-shell{display:flex;flex-direction:column;gap:10px;min-height:0}.game-selection-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.game-selection-card-kicker{flex:1 1 auto;color:var(--text-primary);font-family:var(--font-heading);font-size:1.28rem;font-weight:600;letter-spacing:-.02em;line-height:1.1}.game-selection-preview{position:relative;flex:1 1 auto;min-height:0;overflow:hidden;border-radius:24px;border:1px solid var(--surface-utility-border);background:radial-gradient(circle at 50% 22%,color-mix(in srgb,var(--theme-accent-secondary) 20%,transparent),transparent 34%),var(--surface-utility-bg);transition:filter var(--transition-smooth),border-color var(--transition-smooth);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--theme-accent-secondary) 18%,transparent),inset 0 12px 24px color-mix(in srgb,var(--theme-accent-primary) 10%,transparent)}.game-selection-preview:before{content:"";position:absolute;inset:0;background-image:linear-gradient(color-mix(in srgb,var(--theme-accent-secondary) 22%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--theme-accent-secondary) 22%,transparent) 1px,transparent 1px);background-size:22px 22px;opacity:.36;pointer-events:none}.game-selection-preview:after{content:"";position:absolute;inset:16px;border-radius:18px;border:1px solid color-mix(in srgb,var(--surface-utility-border) 85%,transparent);pointer-events:none}.game-selection-card:hover .game-selection-preview,.game-selection-card:focus-visible .game-selection-preview{filter:brightness(1.08);border-color:color-mix(in srgb,var(--theme-accent-secondary) 24%,var(--surface-utility-border))}.gateway-preview-svg{display:block;width:100%;height:auto;position:relative;z-index:1}.game-selection-copy{display:flex;flex-direction:column;gap:8px}.game-selection-meta{color:var(--text-dim);font-size:.56rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase}.game-selection-card-description{margin:0;color:var(--text-secondary);font-size:.88rem;line-height:1.45}.game-selection-card-arrow{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:40px;height:40px;border-radius:999px;border:1px solid var(--control-secondary-border);background:var(--control-secondary-bg);color:var(--text-secondary);box-shadow:inset 0 1px #ffffff0f;pointer-events:none;transition:transform var(--transition-smooth),border-color var(--transition-smooth),background var(--transition-smooth)}.game-selection-card:hover .game-selection-card-arrow,.game-selection-card:focus-visible .game-selection-card-arrow{transform:translate(2px,-2px);border-color:var(--control-secondary-border-hover);background:var(--control-secondary-bg-hover)}@media(min-width:1080px){.game-selection-grid{grid-template-columns:repeat(3,var(--game-selection-card-width))}}.mode-selector,.match-setup-card{width:100%}.match-setup-card--join-shortcut{max-width:100%}.mode-selector{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-sm);flex:0 0 auto;border-radius:var(--radius-md);padding:var(--sp-md);box-sizing:border-box;background:var(--surface-utility-bg);border-color:var(--surface-utility-border);box-shadow:var(--surface-utility-shadow),var(--field-inset-shadow)}.mode-segment{display:flex;min-height:56px;min-width:0;align-items:center;justify-content:center;padding:10px 6px;font-size:var(--type-body-sm-size);font-weight:var(--type-status-weight);color:var(--text-muted);text-transform:uppercase;letter-spacing:var(--tracking-caps);line-height:1.15;text-align:center;white-space:nowrap;transition:color var(--transition-base),background var(--transition-fast),border-color var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast);border-radius:var(--radius-sm);box-sizing:border-box}.mode-segment--stacked{flex-direction:column;gap:4px}.mode-segment-label{display:block}.mode-segment-meta{font-size:.625rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim)}.mode-segment:hover{color:var(--text-secondary)}.mode-segment:disabled{cursor:not-allowed;color:var(--text-dim);background:var(--control-secondary-bg);border-color:var(--field-border);box-shadow:none;transform:none}.mode-segment--checking .mode-segment-meta{color:var(--color-warning)}.mode-segment--unavailable .mode-segment-meta{color:var(--color-error)}.mode-segment.active{color:var(--text-primary);transform:translateY(-1px)}.mode-segment.active:disabled{transform:none}.match-setup-card{display:flex;flex-direction:column;gap:var(--sp-base);padding:var(--sp-base);border-radius:var(--radius-xl);border:1px solid var(--surface-standard-border);background:var(--surface-standard-bg);box-shadow:var(--surface-standard-shadow)}.board-config{position:relative;width:100%;display:flex;flex-direction:column;gap:var(--sp-sm);border-radius:var(--radius-md);border:1px solid var(--field-border);background:var(--field-bg);padding:var(--sp-md);cursor:pointer;text-align:left;font-family:var(--font-body);transition:border-color var(--transition-fast),background var(--transition-fast),box-shadow var(--transition-fast)}.board-config:hover{border-color:var(--field-border-hover);background:var(--field-bg-hover)}.board-config:focus-visible{outline:none;border-color:var(--field-border-selected);box-shadow:0 0 0 2px var(--selected-ring)}.board-config--disabled,.board-config--disabled:hover{cursor:not-allowed;border-color:#ffffff0d;background:#ffffff05;box-shadow:none}.board-config--disabled .board-config-title,.board-config--disabled .board-config-label,.board-config--disabled .board-config-connect-hint{color:#94a3b88c}.board-config--disabled .board-config-detail-value{color:#f1f5f9b8}.board-config--disabled .board-config-edit-icon{color:#64748b8c}.board-config-title{font-size:.5625rem;font-weight:700;text-transform:uppercase;letter-spacing:var(--tracking-caps);color:var(--text-dim)}.board-config-edit-icon{position:absolute;top:var(--sp-xs);right:var(--sp-xs);width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:var(--text-faint);pointer-events:none;transition:color var(--transition-fast)}.board-config:hover .board-config-edit-icon{color:var(--text-secondary)}.board-config-details{display:flex;gap:var(--sp-sm)}.board-config-detail{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;border-radius:var(--radius-sm);border:1px solid var(--field-border);background:var(--control-secondary-bg)}.board-config-label{font-size:.5rem;font-weight:600;text-transform:uppercase;letter-spacing:var(--tracking-caps);color:var(--text-dim)}.board-config-detail-value{font-size:1rem;font-weight:700;color:var(--text-primary);font-family:var(--font-mono)}.board-config-connect-hint{font-size:.6875rem;color:var(--text-muted);text-align:center;letter-spacing:var(--tracking-wide);padding:10px 0 0;margin-top:4px;margin-bottom:-4px;border-top:1px solid var(--field-border)}.board-size-slider{flex:1;-webkit-appearance:none;appearance:none;height:6px;border-radius:var(--radius-full);background:linear-gradient(90deg,rgba(93,143,255,.7) var(--slider-fill, 14%),rgba(255,255,255,.08) var(--slider-fill, 14%));outline:none}.board-size-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#6875ff,#75afff);cursor:pointer;border:2px solid rgba(255,255,255,.3);box-shadow:0 2px 12px #6366f180,0 0 24px #6366f133,0 0 0 4px #6366f114;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.board-size-slider::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 2px 16px #6366f199,0 0 32px #6366f14d,0 0 0 6px #6366f11f}.board-size-slider::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#6875ff,#75afff);cursor:pointer;border:2px solid rgba(255,255,255,.3);box-shadow:0 2px 12px #6366f180,0 0 24px #6366f133}.lobby-players{display:flex;flex-direction:column;gap:var(--sp-base)}.lobby-players--join-shortcut{gap:var(--sp-lg)}.player-card{display:flex;flex-direction:column;gap:var(--sp-md)}.player-card.player-1 .player-card-subcell{border-top:2px solid rgba(96,165,250,.5)}.player-card.player-2 .player-card-subcell{border-top:2px solid rgba(251,146,60,.5)}.player-card.online-card{position:relative;padding:var(--sp-base);transition:border-color var(--transition-base),box-shadow var(--transition-base);border-top:2px solid rgba(251,146,60,.5)}.player-card.online-card:hover{border-color:var(--control-secondary-border-hover);border-top-color:#fb923c80}.player-card.online-card.online-card--shortcut:hover{border-color:var(--surface-utility-border);border-top-color:#fb923c80}.player-card-label{font-size:.625rem;font-weight:600;text-transform:uppercase;letter-spacing:var(--tracking-caps);color:var(--text-dim)}.player-card-edit-btn{position:absolute;top:var(--sp-xs);right:var(--sp-xs);width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:var(--text-faint);pointer-events:none;transition:color var(--transition-fast)}.player-card-subcell:hover .player-card-edit-btn{color:var(--text-secondary)}.player-card-columns{display:flex;gap:var(--sp-md)}.player-card-subcell{flex:1;min-width:0;border-radius:var(--radius-md);border-color:var(--surface-utility-border);background:var(--surface-utility-bg);padding:var(--sp-md);display:flex;flex-direction:column;gap:var(--sp-sm);box-shadow:var(--surface-utility-shadow)}.player-card-subcell-label{font-size:.625rem;font-weight:600;text-transform:uppercase;letter-spacing:var(--tracking-caps);color:var(--text-dim);align-self:flex-start}.player-card-name-cell{position:relative;transition:background var(--transition-base),border-color var(--transition-base)}.player-card-name-cell:hover{background:var(--control-secondary-bg-hover);border-color:var(--control-secondary-border-hover)}.player-card-input{margin:auto 0;height:42px;padding:0 var(--sp-sm);border-radius:var(--radius-sm);color:var(--text-primary);font-family:var(--font-body);font-size:.875rem;font-weight:500;outline:none;transition:border-color var(--transition-base),box-shadow var(--transition-base);width:100%;box-sizing:border-box}.player-card-input:focus{border-color:var(--field-border-selected);box-shadow:0 0 0 3px var(--selected-ring)}.player-card-input--default{color:var(--text-dim);font-style:italic}.player-card-input:disabled{opacity:.6;cursor:not-allowed}.player-card-input::placeholder{color:var(--text-faint);font-style:italic}.player-card-piece-cell{position:relative;cursor:pointer;transition:background var(--transition-base),border-color var(--transition-base);font-family:var(--font-body)}.player-card-piece-cell:hover{background:var(--control-secondary-bg-hover);border-color:var(--control-secondary-border-hover)}.player-card-piece-row{display:flex;align-items:center;gap:var(--sp-md)}.player-card-piece-info{display:flex;flex-direction:column;gap:2px}.player-card-piece-frame{width:64px;height:64px;border-radius:var(--radius-md);overflow:hidden;flex-shrink:0;background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 100%),var(--surface-utility-bg);border-color:var(--surface-utility-border);box-shadow:var(--surface-utility-shadow);pointer-events:none}.player-card-piece-canvas{width:100%;height:100%}.player-card-piece-canvas canvas{display:block}.player-card-piece-name{font-size:.8125rem;color:var(--text-secondary);font-weight:600}.player-card-piece-color{font-size:.6875rem;color:var(--text-dim);font-weight:500}.lobby-footer{width:100%;padding:var(--sp-base)}.lobby-actions{width:100%;display:flex;flex-direction:column;align-items:center}.lobby-cta{height:64px;font-size:1.15rem}.lobby-version{font-size:.625rem;color:var(--text-faint);font-weight:400;letter-spacing:var(--tracking-wide);margin-top:-16px}.lobby-version-btn{border:none;background:none;cursor:pointer;padding:0;transition:color var(--transition-fast),opacity var(--transition-fast)}.lobby-version-btn:hover{color:var(--text-muted)}.lobby-version-btn:focus-visible{outline:2px solid var(--border-interactive-focus);outline-offset:6px;border-radius:var(--radius-xs)}.player-card-token-row{display:flex;align-items:center;gap:10px;width:100%;padding:var(--sp-sm) var(--sp-md);margin-top:6px;background:none;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition-fast);box-sizing:border-box;font-family:var(--font-body)}.player-card-token-row:hover{background:var(--surface-interactive)}.player-card-token-label{font-size:.625rem;font-weight:600;text-transform:uppercase;letter-spacing:var(--tracking-caps);color:var(--text-dim)}.player-card-token-preview{width:20px;height:20px;border-radius:50%;border:2px solid var(--field-border);flex-shrink:0;box-shadow:inset 0 2px 4px #ffffff24,var(--shadow-sm)}.player-card-color-name{font-size:.8125rem;color:var(--text-muted);font-weight:500}.token-popover{position:absolute;bottom:-8px;left:0;transform:translateY(100%);z-index:50;background:var(--surface-standard-bg);border:1px solid var(--surface-standard-border);border-radius:var(--radius-lg);padding:var(--sp-base);box-shadow:var(--surface-standard-shadow);animation:popoverIn .2s var(--ease-out)}@keyframes popoverIn{0%{opacity:0;transform:translateY(calc(100% + 4px)) scale(.96)}to{opacity:1;transform:translateY(100%) scale(1)}}.token-backdrop{position:fixed;inset:0;z-index:100;background:#000000b8;backdrop-filter:var(--blur-overlay);-webkit-backdrop-filter:var(--blur-overlay);animation:backdropIn .2s ease}@keyframes backdropIn{0%{opacity:0}to{opacity:1}}.token-sheet{position:absolute;bottom:0;left:0;right:0;background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(98,125,255,.06),transparent 50%),var(--surface-standard-bg);border:1px solid var(--surface-standard-border);border-bottom:none;border-radius:var(--radius-2xl) var(--radius-2xl) 0 0;padding:var(--sp-md) var(--sp-xl) calc(var(--sp-2xl) + var(--safe-area-bottom));display:flex;flex-direction:column;align-items:center;gap:var(--sp-base);animation:sheetSlideUp .3s var(--ease-out);box-shadow:0 -12px 40px #00000080,var(--surface-standard-shadow),var(--shadow-inset-top)}@keyframes sheetSlideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.token-sheet-handle{width:36px;height:4px;border-radius:2px;background:var(--field-border-hover);flex-shrink:0}.token-sheet-title{font-family:var(--font-heading);font-size:1.2rem;font-weight:700;color:var(--text-primary);letter-spacing:var(--tracking-tight);margin:0}.token-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:10px}.token-swatch{width:36px;height:36px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:transform var(--transition-fast),border-color var(--transition-fast),box-shadow var(--transition-fast);display:flex;align-items:center;justify-content:center;padding:0}.token-swatch:hover:not(.disabled){transform:scale(1.15)}.token-swatch.selected{border-color:var(--text-primary);box-shadow:0 0 0 2px var(--selected-ring),0 0 12px #ffffff14}.token-swatch.disabled{opacity:.2;cursor:not-allowed}.token-check{width:16px;height:16px}.adv-backdrop{position:fixed;inset:0;z-index:100;background:#000000b3;backdrop-filter:var(--blur-overlay);-webkit-backdrop-filter:var(--blur-overlay);display:flex;align-items:center;justify-content:center;animation:backdropIn .2s ease}.adv-modal{position:relative;width:min(480px,calc(var(--usable-width, 100vw) - 24px));max-height:min(88vh,calc(var(--usable-height, 100vh) - 24px));display:flex;flex-direction:column;border-radius:var(--radius-2xl);animation:modalIn .25s var(--ease-out);overflow:hidden}.adv-modal:before{content:"";position:absolute;top:0;left:0;right:0;height:120px;background:radial-gradient(ellipse 80% 100% at 50% 0%,rgba(98,125,255,.1),transparent);pointer-events:none;z-index:0;border-radius:var(--radius-2xl) var(--radius-2xl) 0 0}@keyframes modalIn{0%{opacity:0;transform:scale(.96) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}.adv-backdrop .confirm-overlay{z-index:102}.adv-sheet{position:fixed;inset:0;z-index:101;display:flex;flex-direction:column;border-radius:0;padding-top:var(--safe-area-top);box-sizing:border-box;animation:sheetSlideUp .3s var(--ease-out);overflow:hidden}.adv-sheet:before{content:"";position:absolute;top:0;left:0;right:0;height:120px;background:radial-gradient(ellipse 80% 100% at 50% 0%,rgba(98,125,255,.1),transparent);pointer-events:none;z-index:0}.adv-sheet-handle{width:36px;height:4px;border-radius:2px;background:#ffffff1f;margin:var(--sp-md) auto 0}.adv-content{position:relative;z-index:1;display:flex;flex-direction:column;flex:1;min-height:0;padding:0}.adv-modal .adv-content{max-height:min(88vh,calc(var(--usable-height, 100vh) - 24px))}.panel-head{display:flex;align-items:center;justify-content:space-between;padding:22px 24px 14px;flex-shrink:0}.panel-head-copy{display:flex;flex-direction:column;gap:2px}.panel-heading{font-family:var(--font-heading);font-size:var(--type-panel-title-size);font-weight:var(--type-panel-title-weight);color:var(--text-primary);margin:0;letter-spacing:var(--tracking-tight)}.panel-subheading{font-size:var(--type-helper-size);color:var(--text-dim);font-weight:var(--type-helper-weight);letter-spacing:var(--tracking-wide)}.panel-dismiss-btn{flex-shrink:0}.adv-scroll-area{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:0 24px 8px}.adv-section{display:flex;flex-direction:column;gap:2px;margin-bottom:14px;padding:14px 16px;border-radius:22px}.adv-section.disabled{opacity:.4;pointer-events:none;-webkit-user-select:none;user-select:none}.adv-section:last-of-type{margin-bottom:0}.adv-section-notice{margin:0 0 10px;padding:10px 14px;border-radius:18px;background:var(--surface-utility-bg);border:1px solid var(--state-error-border);box-shadow:0 6px 20px #0000002e,inset 0 1px #ffffff08;color:var(--state-error-fg);font-size:.75rem;font-weight:500;line-height:1.45}.adv-tabs{display:inline-flex;align-items:center;gap:6px;margin:0 0 14px;padding:4px;border-radius:18px;background:var(--surface-utility-bg);border:1px solid var(--surface-utility-border);box-shadow:var(--surface-utility-shadow)}.adv-tab{min-height:var(--control-height-xs);padding:0 16px;border-radius:14px;border:1px solid transparent;background:transparent;color:var(--text-muted);font-size:.8125rem;font-weight:600}.adv-tab:hover:not(:disabled){background:var(--control-secondary-bg-hover);border-color:var(--control-secondary-border-hover);color:var(--text-secondary)}.adv-tab.ui-choice--selected{color:var(--text-primary)}.adv-tab-panel{display:flex;flex-direction:column}.adv-tab-panel[hidden]{display:none}.adv-section-label{font-size:var(--type-section-label-size);font-weight:var(--type-section-label-weight);text-transform:uppercase;letter-spacing:.12em;color:var(--text-dim);padding-bottom:8px;margin-bottom:4px;border-bottom:1px solid rgba(255,255,255,.04)}.adv-section-hint{text-transform:none;letter-spacing:normal;font-weight:400;font-size:.65rem;color:var(--text-dim);margin-left:8px;font-style:italic}.adv-toggle-row{display:flex;align-items:center;justify-content:space-between;min-height:34px;cursor:pointer;padding:4px 0;transition:opacity var(--transition-fast)}.adv-toggle-row.disabled{opacity:.4;cursor:not-allowed}.adv-toggle-label-wrap{display:flex;flex-direction:column;gap:1px}.adv-toggle-label{font-size:.8125rem;font-weight:500;color:var(--text-secondary);line-height:1.3}.adv-toggle-hint{font-size:.6875rem;color:var(--text-dim);font-weight:400;line-height:1.3}.adv-row{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-md);min-height:34px;padding:4px 0}.adv-row-stack{flex-direction:column;align-items:stretch}.adv-select-field{width:100%;min-height:44px;border-radius:14px;padding:0 14px;font-size:.8125rem;font-weight:500;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--text-dim) 50%),linear-gradient(135deg,var(--text-dim) 50%,transparent 50%);background-position:calc(100% - 20px) calc(50% - 3px),calc(100% - 14px) calc(50% - 3px);background-size:6px 6px,6px 6px;background-repeat:no-repeat}.adv-select-field:disabled{opacity:var(--disabled-opacity);cursor:not-allowed}.toggle-pill{flex-shrink:0}.adv-segment-track{display:inline-flex;background:var(--field-bg);border:1px solid var(--field-border);border-radius:var(--radius-sm);padding:3px;gap:3px;box-shadow:inset 0 2px 4px #00000026}.adv-segment-btn{min-height:var(--control-height-xs);padding:0 14px;border-radius:var(--radius-xs);font-size:.75rem;font-weight:600;border-color:transparent;background:transparent;color:var(--text-muted);box-shadow:none}.adv-segment-btn:hover:not(:disabled){background:var(--control-secondary-bg-hover);border-color:var(--control-secondary-border-hover);color:var(--text-secondary)}.adv-segment-btn.active,.adv-segment-btn.ui-choice--selected{background:linear-gradient(180deg,color-mix(in srgb,var(--theme-accent-primary) 28%,transparent),color-mix(in srgb,var(--theme-accent-primary) 16%,transparent)),var(--field-bg);border-color:color-mix(in srgb,var(--theme-accent-primary) 52%,var(--field-border-selected));color:var(--text-primary);box-shadow:inset 0 1px #ffffff1f,0 0 0 1px color-mix(in srgb,var(--theme-accent-primary) 14%,transparent),0 10px 20px color-mix(in srgb,var(--theme-accent-primary) 18%,transparent);text-shadow:0 1px 1px rgba(0,0,0,.14);transform:translateY(-1px)}.adv-segment-btn.active:hover:not(:disabled),.adv-segment-btn.ui-choice--selected:hover:not(:disabled){background:linear-gradient(180deg,color-mix(in srgb,var(--theme-accent-primary) 34%,transparent),color-mix(in srgb,var(--theme-accent-primary) 20%,transparent)),var(--field-bg-hover)}.adv-pill-group{display:flex;flex-wrap:wrap;gap:6px}.adv-pill{min-height:var(--control-height-xs);padding:0 12px;border-radius:var(--radius-xs);font-size:.75rem}.adv-radio-list{display:flex;flex-direction:column;gap:8px;width:100%}.adv-radio-option{position:relative;display:block;cursor:pointer}.adv-radio-option.disabled{cursor:not-allowed}.adv-radio-input{position:absolute;opacity:0;pointer-events:none}.adv-radio-card{display:flex;align-items:center;gap:12px;width:100%;min-height:42px;padding:10px 12px;border-radius:14px;box-sizing:border-box}.adv-radio-control{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:999px;border:2px solid color-mix(in srgb,var(--field-border-selected) 80%,white);background:color-mix(in srgb,var(--surface-utility-bg) 88%,transparent);flex-shrink:0;transition:border-color var(--transition-fast),box-shadow var(--transition-fast),background var(--transition-fast)}.adv-radio-control-dot{width:8px;height:8px;border-radius:999px;background:transparent;transform:scale(.5);transition:transform var(--transition-fast),background var(--transition-fast)}.adv-radio-option.active .adv-radio-control{border-color:color-mix(in srgb,var(--field-border-selected) 92%,white);background:var(--field-selected-bg);box-shadow:0 0 0 4px var(--selected-ring)}.adv-radio-option.active .adv-radio-control-dot{background:linear-gradient(180deg,var(--color-indigo-300) 0%,var(--color-white) 100%);transform:scale(1)}.adv-radio-label{font-size:.8125rem;font-weight:600;line-height:1.35}.adv-board-size-control{display:flex;align-items:center;gap:10px;flex:1;max-width:180px}.adv-board-size-value{font-size:1.125rem;font-weight:700;color:var(--text-primary);font-family:var(--font-mono);min-width:20px;text-align:center}.adv-board-size-slider{flex:1;-webkit-appearance:none;appearance:none;height:4px;border-radius:var(--radius-full);background:linear-gradient(90deg,rgba(93,143,255,.7) var(--slider-fill, 14%),rgba(255,255,255,.08) var(--slider-fill, 14%));outline:none}.adv-board-size-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,#6875ff,#75afff);cursor:pointer;border:2px solid rgba(255,255,255,.3);box-shadow:0 2px 8px #6366f166;transition:transform var(--transition-fast)}.adv-board-size-slider::-webkit-slider-thumb:hover{transform:scale(1.15)}.adv-board-size-slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:linear-gradient(135deg,#6875ff,#75afff);cursor:pointer;border:2px solid rgba(255,255,255,.3);box-shadow:0 2px 8px #6366f166}.adv-chip-group{display:flex;gap:4px}.adv-chip{padding:7px 14px;border-radius:var(--radius-xs);border:1px solid var(--border-interactive);background:transparent;color:var(--text-muted);font-family:var(--font-body);font-size:.75rem;font-weight:600;cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast),box-shadow var(--transition-fast)}.adv-chip:hover:not(.active){background:var(--surface-interactive);color:var(--text-secondary)}.adv-chip.active{background:linear-gradient(180deg,#5878ff4d,#6366f133);border-color:#6366f180;color:var(--text-primary);box-shadow:0 0 16px #6366f133,inset 0 1px #ffffff14}.adv-section-audio{overflow:hidden}.adv-audio-master{position:relative}.adv-audio-controls{display:flex;align-items:center;gap:8px;flex-shrink:0}.adv-audio-expand-btn{width:var(--control-height-xs);height:var(--control-height-xs);display:flex;align-items:center;justify-content:center;background:var(--control-secondary-bg);border:1px solid var(--control-secondary-border);border-radius:var(--radius-xs);color:var(--text-dim);cursor:pointer;transition:background var(--transition-fast),color var(--transition-fast),border-color var(--transition-fast);padding:0}.adv-audio-expand-btn:hover:not(:disabled){background:var(--control-secondary-bg-hover);border-color:var(--control-secondary-border-hover);color:var(--control-secondary-fg-hover)}.adv-audio-expand-btn:disabled{opacity:.3;cursor:not-allowed}.adv-audio-expand-btn:focus-visible{outline:2px solid var(--border-interactive-focus);outline-offset:2px}.adv-chevron{transition:transform var(--transition-smooth)}.adv-chevron.expanded{transform:rotate(180deg)}.adv-audio-details{display:grid;grid-template-rows:0fr;transition:grid-template-rows .25s var(--ease-out)}.adv-audio-details.open{grid-template-rows:1fr}.adv-audio-details-inner{overflow:hidden;display:flex;flex-direction:column;gap:2px;padding-left:16px;border-left:2px solid var(--field-border-selected);margin-top:2px}.adv-audio-details-inner .adv-toggle-label{font-size:.75rem;color:var(--text-muted)}.adv-footer{padding:12px 24px 20px;flex-shrink:0;display:flex;align-items:center;gap:12px}.adv-about-link{flex:1}.adv-about-link.highlighted{background:var(--field-selected-bg);border-color:var(--field-border-selected);color:var(--text-secondary)}.adv-about-link.highlighted:hover{background:var(--field-selected-bg);border-color:var(--field-border-selected);color:var(--text-primary)}.adv-restore-btn{flex:1}.adv-restore-btn:disabled{opacity:.35;cursor:default;pointer-events:none}.adv-save-btn{flex:1;font-size:.8125rem}.adv-save-btn:disabled{background:var(--control-secondary-bg);border:1px solid var(--control-secondary-border);color:var(--control-secondary-fg);opacity:var(--disabled-opacity);cursor:default;pointer-events:none;box-shadow:none;text-shadow:none;filter:none}body[data-viewport-width=compact] .panel-head{padding:14px 16px 10px}body[data-viewport-width=compact] .adv-scroll-area{padding:0 16px 8px}body[data-viewport-width=compact] .adv-footer{padding:12px 16px 16px;padding-bottom:calc(8px + var(--safe-area-bottom))}body[data-viewport-width=compact] .adv-section{padding:12px 14px;border-radius:18px}body[data-viewport-width=compact] .adv-tabs{display:flex;width:100%}body[data-viewport-width=compact] .adv-tab{flex:1;justify-content:center}body[data-viewport-width=compact] .adv-toggle-row{min-height:38px}body[data-viewport-width=compact] .adv-segment-track{display:flex;width:100%}body[data-viewport-width=compact] .adv-segment-btn{flex:1;height:34px}body[data-viewport-width=compact] .adv-row:not(.adv-row-inline){flex-direction:column;align-items:flex-start;gap:6px}body[data-viewport-width=compact] .adv-pill{height:34px}body[data-viewport-width=compact] .adv-audio-details-inner{padding-left:14px}body[data-viewport-width=compact] .adv-select-field{min-height:42px}body[data-viewport-width=compact] .adv-save-btn,body[data-viewport-width=compact] .adv-restore-btn,body[data-viewport-width=compact] .adv-about-link{font-size:.875rem}body[data-viewport-width=compact][data-viewport-inset-bottom=true] .adv-footer{position:sticky;bottom:0;z-index:2;margin-top:auto;padding:10px 16px calc(8px + var(--safe-area-bottom));background:var(--surface-sticky-footer-bg);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-top:1px solid var(--surface-sticky-footer-border)}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .adv-content,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .adv-content{min-height:0}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .panel-head,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .panel-head{padding:12px 16px 8px}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .panel-heading,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .panel-heading{font-size:1rem}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .panel-subheading,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .panel-subheading{font-size:.625rem}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .adv-scroll-area,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .adv-scroll-area{padding:0 16px 12px}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .adv-section,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .adv-section{margin-bottom:10px;padding:12px 14px}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .adv-toggle-row,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .adv-toggle-row{min-height:34px;padding:2px 0}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .adv-toggle-label,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .adv-toggle-label{font-size:.76rem}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .adv-toggle-hint,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .adv-toggle-hint{font-size:.625rem}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .adv-pill,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .adv-segment-btn,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .adv-pill,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .adv-segment-btn{height:32px;font-size:.76rem}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .adv-board-size-control,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .adv-board-size-control{gap:10px}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .adv-board-size-value,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .adv-board-size-value{font-size:.9rem}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .adv-footer,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .adv-footer{position:sticky;bottom:0;z-index:2;margin-top:auto;padding:10px 16px calc(8px + var(--safe-area-bottom));background:var(--surface-sticky-footer-bg);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-top:1px solid var(--surface-sticky-footer-border)}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .adv-save-btn,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .adv-restore-btn,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .adv-about-link,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .adv-save-btn,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .adv-restore-btn,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .adv-about-link{font-size:.8rem}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .about-content,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .about-content{min-height:0}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .about-scroll-area,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .about-scroll-area{padding:0 16px 12px}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .about-info-card,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .about-highlight-row,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .about-info-card,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .about-highlight-row{padding:10px 12px}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .about-highlight-text,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .about-info-card-value,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .about-credit-name,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .about-highlight-text,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .about-info-card-value,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .about-credit-name{font-size:.76rem}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .about-credit-role,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .about-info-card-label,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .about-credit-role,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .about-info-card-label{font-size:.65rem}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .about-footer,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .about-footer{position:sticky;bottom:0;z-index:2;margin-top:auto;padding:10px 16px calc(8px + var(--safe-area-bottom));background:var(--surface-sticky-footer-bg);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-top:1px solid var(--surface-sticky-footer-border)}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .about-primary-btn,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .about-secondary-btn,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .about-primary-btn,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .about-secondary-btn{font-size:.8rem}body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=medium] .about-feedback-textarea,body[data-viewport-width=compact].platform-ios-app-shell[data-viewport-height=compact] .about-feedback-textarea{min-height:132px}.online-card{min-height:180px}.online-error{background:linear-gradient(135deg,var(--state-error-bg),color-mix(in srgb,var(--state-error-bg) 60%,transparent));border:1px solid var(--state-error-border);border-radius:var(--radius-md);padding:var(--sp-md) var(--sp-base);color:var(--state-error-fg);font-size:.8125rem;font-weight:500;text-align:center;box-shadow:inset 0 1px #ffffff05}.online-menu{display:flex;flex-direction:column;gap:var(--sp-sm)}.online-action-btn{width:100%;padding:var(--sp-md) var(--sp-base);font-size:.8125rem;display:flex;align-items:center;justify-content:center;gap:10px}.online-action-btn.primary.ready{font-weight:700}.online-action-btn.primary.ready:hover{transform:translateY(-1px)}.online-action-btn svg{opacity:.5;flex-shrink:0}.online-helper-text{color:var(--text-dim);font-size:.75rem;text-align:center;margin:2px 0 0}.online-status{display:flex;flex-direction:column;align-items:center;gap:var(--sp-md);padding:var(--sp-sm) 0}.online-code-label{font-size:.625rem;text-transform:uppercase;letter-spacing:var(--tracking-caps);color:var(--text-dim);font-weight:600;margin:0}.online-code-display{display:flex;gap:6px;justify-content:center}.online-code-char{width:40px;height:48px;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 100%),var(--surface-utility-bg);border:1px solid var(--surface-utility-border);border-radius:var(--radius-sm);font-size:1.2rem;font-weight:800;color:var(--text-primary);font-family:var(--font-mono);box-shadow:var(--shadow-sm),inset 0 1px #ffffff0f,0 0 8px #6366f10f}.online-copy-row{display:flex;gap:6px}.online-copy-btn{padding:7px 14px;font-size:.75rem}.online-copy-btn.copied{background:var(--state-success-bg);border-color:var(--state-success-border);color:var(--state-success-fg)}.online-waiting-row{display:flex;align-items:center;gap:6px}.online-status-text{color:var(--text-muted);font-size:.8125rem;font-weight:500}.online-spinner{width:28px;height:28px;border:3px solid rgba(99,102,241,.12);border-top-color:var(--accent-primary);border-radius:50%;animation:onlineSpin .8s linear infinite;box-shadow:0 0 12px #6366f11a}@keyframes onlineSpin{to{transform:rotate(360deg)}}.ai-thinking-dots{display:inline-flex;gap:3px;margin-left:2px;vertical-align:middle}.ai-thinking-dots span{width:4px;height:4px;border-radius:50%;background:var(--text-muted);animation:aiDotPulse 1.2s ease-in-out infinite}.ai-thinking-dots span:nth-child(2){animation-delay:.2s}.ai-thinking-dots span:nth-child(3){animation-delay:.4s}@keyframes aiDotPulse{0%,80%,to{opacity:.3;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}.online-back-link{background:none;border:none;color:var(--text-muted);font-size:.8125rem;font-weight:500;cursor:pointer;padding:4px 0;transition:color var(--transition-fast),transform var(--transition-fast)}.online-back-link:hover{color:var(--text-secondary);transform:translateY(-1px)}.online-back-link:active{transform:scale(.97)}.online-back-link:focus-visible{outline:2px solid var(--border-interactive-focus);outline-offset:2px}.online-join{display:flex;flex-direction:column;gap:var(--sp-sm)}.online-join-actions{display:flex;gap:var(--sp-sm)}.online-join-actions .online-action-btn.primary{flex:1 1 auto;min-width:0}.online-back-btn{flex:0 0 auto;min-width:132px;padding-inline:var(--sp-lg)}.online-shortcut-helper{margin:0;color:var(--text-secondary);font-size:.875rem;line-height:1.45}.online-join-label{font-size:.625rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);font-weight:600}.online-join-input{height:52px;padding:0 var(--sp-base);border-radius:var(--radius-md);color:var(--text-primary);font-size:1.2rem;font-weight:700;text-align:center;letter-spacing:.2em;outline:none;transition:border-color var(--transition-base),box-shadow var(--transition-base);font-family:var(--font-mono);width:100%;box-sizing:border-box}.online-join-input:focus{border-color:var(--field-border-selected);box-shadow:0 0 0 3px var(--selected-ring)}.online-join-input::placeholder{color:var(--text-faint);font-weight:500}@keyframes lobbyFadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}body[data-viewport-width=compact] .lobby-scroll,.lobby.lobby--compact-browser .lobby-scroll{padding:16px;padding-bottom:calc(16px + var(--safe-area-bottom) + var(--lobby-keyboard-offset));scroll-padding-bottom:calc(16px + var(--safe-area-bottom) + var(--lobby-keyboard-offset));align-items:flex-start}body[data-viewport-width=compact] .lobby-panel,.lobby.lobby--compact-browser .lobby-panel{min-height:max(0px,calc(var(--usable-height, 100dvh) - 32px - var(--lobby-keyboard-offset)));padding:var(--sp-2xl) var(--sp-base) var(--sp-xl);gap:var(--sp-xl)}.lobby.lobby--compact-browser .lobby-panel{padding:28px var(--sp-base) 20px;gap:22px}body[data-viewport-width=compact] .game-selection-panel,.lobby.lobby--compact-browser .game-selection-panel{justify-content:space-between;gap:12px;padding:18px 14px 14px;overflow:hidden}body[data-viewport-width=compact] .game-selection-header,.lobby.lobby--compact-browser .game-selection-header{flex-shrink:0}body[data-viewport-width=compact] .game-selection-eyebrow,.lobby.lobby--compact-browser .game-selection-eyebrow{margin-bottom:6px;font-size:.52rem;letter-spacing:.26em}body[data-viewport-width=compact] .game-selection-subtitle,.lobby.lobby--compact-browser .game-selection-subtitle{margin-top:6px;font-size:.76rem;line-height:1.3;max-width:310px}body[data-viewport-width=compact] .game-selection-grid,.lobby.lobby--compact-browser .game-selection-grid{gap:10px;grid-template-rows:none}body[data-viewport-width=compact] .game-selection-toggle-row,.lobby.lobby--compact-browser .game-selection-toggle-row{gap:12px;padding-top:2px}body[data-viewport-width=compact] .game-selection-toggle-label,.lobby.lobby--compact-browser .game-selection-toggle-label{font-size:.76rem}body[data-viewport-width=compact] .game-selection-toggle-hint,.lobby.lobby--compact-browser .game-selection-toggle-hint{font-size:.64rem}body[data-viewport-width=compact] .game-selection-card,.lobby.lobby--compact-browser .game-selection-card{gap:8px;padding:12px;border-radius:24px}body[data-viewport-width=compact] .game-selection-preview-shell,.lobby.lobby--compact-browser .game-selection-preview-shell{gap:6px}body[data-viewport-width=compact] .game-selection-card-kicker,.lobby.lobby--compact-browser .game-selection-card-kicker{font-size:1.04rem}body[data-viewport-width=compact] .game-selection-preview,.lobby.lobby--compact-browser .game-selection-preview{border-radius:20px}body[data-viewport-width=compact] .game-selection-preview:after,.lobby.lobby--compact-browser .game-selection-preview:after{inset:12px;border-radius:14px}body[data-viewport-width=compact] .game-selection-meta,.lobby.lobby--compact-browser .game-selection-meta{font-size:.48rem}body[data-viewport-width=compact] .game-selection-card-description,.lobby.lobby--compact-browser .game-selection-card-description{font-size:.72rem;line-height:1.28}body[data-viewport-width=compact] .game-selection-card-arrow,.lobby.lobby--compact-browser .game-selection-card-arrow{width:30px;height:30px}body[data-viewport-width=compact] .lobby-gear-btn,.lobby.lobby--compact-browser .lobby-gear-btn{position:absolute;top:14px;right:14px}body[data-viewport-width=compact] .lobby-change-game-btn,.lobby.lobby--compact-browser .lobby-change-game-btn{top:14px;left:14px}body[data-viewport-width=compact] .lobby-header,.lobby.lobby--compact-browser .lobby-header{padding-inline:46px}body[data-viewport-width=compact] .lobby-title,.lobby.lobby--compact-browser .lobby-title{font-size:clamp(2rem,10.6vw,2.8rem)}body[data-viewport-width=compact] .lobby-title--join-shortcut,.lobby.lobby--compact-browser .lobby-title--join-shortcut{font-size:clamp(1.5rem,7vw,2rem)}body[data-viewport-width=compact] .lobby-subtitle,.lobby.lobby--compact-browser .lobby-subtitle{margin-top:6px;font-size:.6875rem;letter-spacing:.22em}body[data-viewport-width=compact] .match-setup-card,.lobby.lobby--compact-browser .match-setup-card{flex:1 0 auto;gap:var(--sp-base)}body[data-viewport-width=compact] .mode-selector,.lobby.lobby--compact-browser .mode-selector{padding:12px;gap:6px}body[data-viewport-width=compact] .mode-segment,.lobby.lobby--compact-browser .mode-segment{min-height:42px;padding:8px 4px;font-size:.6875rem;letter-spacing:.06em}body[data-viewport-width=compact] .player-card.online-card,.lobby.lobby--compact-browser .player-card.online-card{border-radius:var(--radius-md);padding:var(--sp-md)}body[data-viewport-width=compact] .lobby-actions,.lobby.lobby--compact-browser .lobby-actions{margin-top:auto;flex-shrink:0;gap:12px;padding-top:10px}body[data-viewport-width=compact] .board-config,.lobby.lobby--compact-browser .board-config{padding:18px 16px}body[data-viewport-width=compact] .board-config-details,.lobby.lobby--compact-browser .board-config-details{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}body[data-viewport-width=compact] .board-config-detail,.lobby.lobby--compact-browser .board-config-detail{padding:12px 8px}body[data-viewport-width=compact] .lobby-players,.lobby.lobby--compact-browser .lobby-players{gap:18px}body[data-viewport-width=compact] .player-card,.lobby.lobby--compact-browser .player-card{gap:14px}body[data-viewport-width=compact] .player-card-columns,.lobby.lobby--compact-browser .player-card-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}body[data-viewport-width=compact] .player-card-subcell,.lobby.lobby--compact-browser .player-card-subcell{padding:16px}body[data-viewport-width=compact] .player-card-input,.lobby.lobby--compact-browser .player-card-input{height:46px}body[data-viewport-width=compact] .player-card-piece-frame,.lobby.lobby--compact-browser .player-card-piece-frame{width:58px;height:58px}body[data-viewport-width=compact] .lobby-footer,.lobby.lobby--compact-browser .lobby-footer{border-radius:var(--radius-lg);padding:16px}body[data-viewport-width=compact] .lobby-cta,.lobby.lobby--compact-browser .lobby-cta{height:68px}body[data-viewport-width=compact] .lobby-version,.lobby.lobby--compact-browser .lobby-version{margin-top:0}body[data-viewport-width=compact] .token-grid{grid-template-columns:repeat(8,1fr)}body[data-viewport-width=compact][data-viewport-height=medium] .lobby-panel,body[data-viewport-width=compact][data-viewport-height=tall] .lobby-panel{min-height:max(0px,calc(var(--usable-height, 100dvh) - 32px - var(--lobby-keyboard-offset)))}body[data-viewport-width=compact][data-viewport-height=medium] .match-setup-card,body[data-viewport-width=compact][data-viewport-height=tall] .match-setup-card{justify-content:space-evenly}body[data-viewport-width=compact][data-viewport-height=medium] .lobby-players,body[data-viewport-width=compact][data-viewport-height=tall] .lobby-players{flex:1 1 auto;justify-content:space-evenly}body[data-viewport-width=compact][data-viewport-height=medium] .board-config,body[data-viewport-width=compact][data-viewport-height=medium] .player-card.online-card{padding:20px 18px}body[data-viewport-width=compact][data-viewport-height=medium] .mode-selector{padding:14px}body[data-viewport-width=compact][data-viewport-height=medium] .board-config-detail,body[data-viewport-width=compact][data-viewport-height=medium] .player-card-subcell{padding:18px 16px}body[data-viewport-width=compact][data-viewport-height=medium] .mode-segment{min-height:44px}body[data-viewport-width=compact][data-viewport-height=medium] .player-card-piece-frame{width:64px;height:64px}body[data-viewport-width=compact][data-viewport-height=tall] .lobby-panel{gap:calc(var(--sp-xl) + 6px)}body[data-viewport-width=compact][data-viewport-height=tall] .match-setup-card{gap:18px}body[data-viewport-width=compact][data-viewport-height=tall] .board-config,body[data-viewport-width=compact][data-viewport-height=tall] .player-card.online-card{padding:22px 20px}body[data-viewport-width=compact][data-viewport-height=tall] .mode-selector{padding:16px;gap:8px}body[data-viewport-width=compact][data-viewport-height=tall] .board-config-details{gap:12px}body[data-viewport-width=compact][data-viewport-height=tall] .board-config-detail,body[data-viewport-width=compact][data-viewport-height=tall] .player-card-subcell{padding:20px 18px}body[data-viewport-width=compact][data-viewport-height=tall] .mode-segment{min-height:46px}body[data-viewport-width=compact][data-viewport-height=tall] .lobby-players{gap:20px}body[data-viewport-width=compact][data-viewport-height=tall] .player-card,body[data-viewport-width=compact][data-viewport-height=tall] .player-card-columns{gap:16px}body[data-viewport-width=compact][data-viewport-height=tall] .player-card-input{height:48px}body[data-viewport-width=compact][data-viewport-height=tall] .player-card-piece-frame{width:68px;height:68px}body[data-viewport-width=compact][data-viewport-height=tall] .lobby-actions{gap:14px;padding-top:20px}body[data-viewport-width=compact][data-viewport-height=tall] .lobby-footer{padding:22px 20px}body[data-viewport-width=compact][data-viewport-height=tall] .lobby-cta{height:74px}body[data-viewport-width=compact][data-viewport-height=compact] .lobby-scroll{padding:12px 14px;padding-bottom:calc(12px + var(--safe-area-bottom) + var(--lobby-keyboard-offset));scroll-padding-bottom:calc(12px + var(--safe-area-bottom) + var(--lobby-keyboard-offset))}body[data-viewport-width=compact][data-viewport-height=compact] .lobby-panel{padding:20px 14px 16px;gap:18px}body[data-viewport-width=compact][data-viewport-height=compact] .game-selection-panel{padding:12px 12px 10px;gap:8px}body[data-viewport-width=compact][data-viewport-height=compact] .game-selection-eyebrow{margin-bottom:4px;font-size:.48rem}body[data-viewport-width=compact][data-viewport-height=compact] .game-selection-header .lobby-title{font-size:clamp(1.45rem,8.1vw,2rem)}body[data-viewport-width=compact][data-viewport-height=compact] .game-selection-subtitle{font-size:.68rem;line-height:1.2;max-width:280px}body[data-viewport-width=compact][data-viewport-height=compact] .game-selection-grid{gap:8px}body[data-viewport-width=compact][data-viewport-height=compact] .game-selection-toggle-row{gap:10px}body[data-viewport-width=compact][data-viewport-height=compact] .game-selection-toggle-label{font-size:.72rem}body[data-viewport-width=compact][data-viewport-height=compact] .game-selection-toggle-hint{font-size:.6rem;line-height:1.2}body[data-viewport-width=compact][data-viewport-height=compact] .game-selection-card{padding:10px;gap:7px}body[data-viewport-width=compact][data-viewport-height=compact] .game-selection-card-kicker{font-size:.92rem}body[data-viewport-width=compact][data-viewport-height=compact] .game-selection-meta{font-size:.44rem}body[data-viewport-width=compact][data-viewport-height=compact] .game-selection-card-description{font-size:.64rem;line-height:1.18}body[data-viewport-width=compact][data-viewport-height=compact] .game-selection-card-arrow{width:26px;height:26px}body[data-viewport-width=compact][data-viewport-height=compact] .lobby-title{font-size:clamp(2.1rem,12vw,2.8rem)}body[data-viewport-width=compact][data-viewport-height=compact] .lobby-title--join-shortcut{font-size:clamp(1.35rem,7.4vw,1.7rem)}body[data-viewport-width=compact][data-viewport-height=compact] .lobby-subtitle{margin-top:6px;letter-spacing:.22em}body[data-viewport-width=compact][data-viewport-height=compact] .board-config{padding:12px}body[data-viewport-width=compact][data-viewport-height=compact] .mode-selector{padding:10px;gap:6px}body[data-viewport-width=compact][data-viewport-height=compact] .board-config-details{gap:8px}body[data-viewport-width=compact][data-viewport-height=compact] .board-config-detail{padding:8px 4px}body[data-viewport-width=compact][data-viewport-height=compact] .mode-segment{min-height:40px;padding:6px 3px;font-size:.65625rem;letter-spacing:.05em}body[data-viewport-width=compact][data-viewport-height=compact] .player-card,body[data-viewport-width=compact][data-viewport-height=compact] .player-card-columns{gap:12px}body[data-viewport-width=compact][data-viewport-height=compact] .player-card-subcell{padding:12px}body[data-viewport-width=compact][data-viewport-height=compact] .player-card-input{height:38px;font-size:.8125rem}body[data-viewport-width=compact][data-viewport-height=compact] .player-card-piece-frame{width:44px;height:44px}body[data-viewport-width=compact][data-viewport-height=compact] .lobby-footer{padding:12px}body[data-viewport-width=compact][data-viewport-height=compact] .lobby-cta{height:56px;font-size:1rem}body[data-viewport-width=compact][data-viewport-height=compact] .lobby-actions{gap:8px;padding-top:12px}body[data-viewport-width=compact][data-viewport-height=compact] .lobby-version{margin-top:0}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .lobby-scroll{padding:12px 14px;padding-bottom:calc(12px + var(--safe-area-bottom) + var(--lobby-keyboard-offset));scroll-padding-bottom:calc(12px + var(--safe-area-bottom) + var(--lobby-keyboard-offset))}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .lobby-panel{min-height:max(0px,calc(var(--usable-height, 100dvh) - 24px - var(--lobby-keyboard-offset)));padding:24px 14px 16px;gap:16px}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .lobby-header{padding-inline:50px}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .match-setup-card,body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .lobby-players{justify-content:flex-start}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .mode-selector{padding:10px;gap:6px}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .mode-segment{min-height:40px;padding:7px 4px;font-size:.65625rem;letter-spacing:.05em}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .board-config,body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .player-card.online-card,body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .player-card-subcell,body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .lobby-footer{padding:12px}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .board-config-details,body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .lobby-players,body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .player-card,body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .player-card-columns{gap:12px}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .board-config-detail{padding:10px 6px}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .board-config-label{font-size:.46875rem}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .board-config-detail-value{font-size:.9375rem}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .board-config-connect-hint{font-size:.625rem;padding-top:8px}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .player-card-input{height:40px;font-size:.8125rem}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .player-card-piece-frame{width:48px;height:48px}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .player-card-piece-row{gap:10px}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .player-card-piece-name{font-size:.75rem}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .player-card-piece-color{font-size:.625rem}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .lobby-actions{gap:8px;padding-top:8px}body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .lobby-cta{height:56px;font-size:1rem}body.platform-ios.platform-native[data-viewport-width=compact] .lobby-scroll{padding:12px 14px;padding-bottom:calc(12px + var(--safe-area-bottom) + var(--lobby-keyboard-offset));scroll-padding-bottom:calc(12px + var(--safe-area-bottom) + var(--lobby-keyboard-offset))}body.platform-ios.platform-native[data-viewport-width=compact] .lobby-panel{min-height:max(0px,calc(var(--usable-height, 100dvh) - 24px - var(--lobby-keyboard-offset)));padding:22px 14px 14px;gap:14px}body.platform-ios.platform-native[data-viewport-width=compact] .lobby-header{padding-inline:48px}body.platform-ios.platform-native[data-viewport-width=compact] .lobby-title{font-size:clamp(1.85rem,9.8vw,2.5rem)}body.platform-ios.platform-native[data-viewport-width=compact] .lobby-title--join-shortcut{font-size:clamp(1.35rem,7.2vw,1.8rem)}body.platform-ios.platform-native[data-viewport-width=compact] .lobby-subtitle{margin-top:4px;font-size:.625rem;letter-spacing:.18em}body.platform-ios.platform-native[data-viewport-width=compact] .mode-selector,body.platform-ios.platform-native[data-viewport-width=compact] .board-config,body.platform-ios.platform-native[data-viewport-width=compact] .player-card.online-card,body.platform-ios.platform-native[data-viewport-width=compact] .player-card-subcell,body.platform-ios.platform-native[data-viewport-width=compact] .lobby-footer{padding:12px}body.platform-ios.platform-native[data-viewport-width=compact] .match-setup-card,body.platform-ios.platform-native[data-viewport-width=compact] .lobby-players,body.platform-ios.platform-native[data-viewport-width=compact] .player-card,body.platform-ios.platform-native[data-viewport-width=compact] .player-card-columns{gap:12px}body.platform-ios.platform-native[data-viewport-width=compact] .board-config{gap:10px}body.platform-ios.platform-native[data-viewport-width=compact] .board-config-details{gap:8px}body.platform-ios.platform-native[data-viewport-width=compact] .board-config-detail{padding:8px 4px}body.platform-ios.platform-native[data-viewport-width=compact] .board-config-label{font-size:.46875rem}body.platform-ios.platform-native[data-viewport-width=compact] .board-config-detail-value{font-size:.9375rem}body.platform-ios.platform-native[data-viewport-width=compact] .board-config-connect-hint{font-size:.625rem;padding-top:8px}body.platform-ios.platform-native[data-viewport-width=compact] .mode-segment{min-height:38px;padding:6px 4px;font-size:.65625rem;letter-spacing:.05em}body.platform-ios.platform-native[data-viewport-width=compact] .mode-segment-meta{font-size:.5625rem}body.platform-ios.platform-native[data-viewport-width=compact] .player-card-input{height:40px}body.platform-ios.platform-native[data-viewport-width=compact] .player-card-subcell{min-height:104px}body.platform-ios.platform-native[data-viewport-width=compact] .player-card-piece-row{gap:10px}body.platform-ios.platform-native[data-viewport-width=compact] .player-card-piece-frame{width:48px;height:48px}body.platform-ios.platform-native[data-viewport-width=compact] .player-card-piece-name{font-size:.75rem}body.platform-ios.platform-native[data-viewport-width=compact] .player-card-piece-color{font-size:.625rem}body.platform-ios.platform-native[data-viewport-width=compact] .lobby-actions{gap:8px;padding-top:6px}body.platform-ios.platform-native[data-viewport-width=compact] .lobby-cta{height:56px;font-size:1rem}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .lobby-panel{padding:26px 16px 18px;gap:18px}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .match-setup-card,body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .lobby-players{justify-content:flex-start}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .mode-selector{padding:14px;gap:8px}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .mode-segment{min-height:44px;padding:8px 5px;font-size:.6875rem}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .board-config,body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .player-card.online-card,body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .player-card-subcell,body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .lobby-footer{padding:16px}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .match-setup-card,body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .lobby-players,body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .player-card,body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .player-card-columns{gap:14px}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .board-config,body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .board-config-details{gap:12px}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .board-config-detail{padding:12px 8px}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .board-config-label{font-size:.5rem}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .board-config-detail-value{font-size:1rem}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .board-config-connect-hint{font-size:.6875rem;padding-top:10px}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .player-card-input{height:46px}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .player-card-subcell{min-height:112px}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .player-card-piece-row{gap:12px}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .player-card-piece-frame{width:58px;height:58px}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .player-card-piece-name{font-size:.8125rem}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .player-card-piece-color{font-size:.6875rem}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .lobby-actions{gap:10px;padding-top:12px}body.platform-ios.platform-native[data-viewport-width=compact][data-viewport-height=tall] .lobby-cta{height:64px;font-size:1.08rem}body[data-viewport-height=medium] .lobby.lobby--compact-browser .lobby-scroll,body[data-viewport-height=compact] .lobby.lobby--compact-browser .lobby-scroll{padding:12px 14px;padding-bottom:calc(12px + var(--safe-area-bottom) + var(--lobby-keyboard-offset));scroll-padding-bottom:calc(12px + var(--safe-area-bottom) + var(--lobby-keyboard-offset))}body[data-viewport-height=medium] .lobby.lobby--compact-browser .lobby-panel,body[data-viewport-height=compact] .lobby.lobby--compact-browser .lobby-panel{min-height:max(0px,calc(var(--usable-height, 100dvh) - 24px - var(--lobby-keyboard-offset)));padding:22px 14px 14px;gap:14px}body[data-viewport-height=medium] .lobby.lobby--compact-browser .lobby-header,body[data-viewport-height=compact] .lobby.lobby--compact-browser .lobby-header{padding-inline:48px}body[data-viewport-height=medium] .lobby.lobby--compact-browser .lobby-title,body[data-viewport-height=compact] .lobby.lobby--compact-browser .lobby-title{font-size:clamp(1.85rem,9.8vw,2.5rem)}body[data-viewport-height=medium] .lobby.lobby--compact-browser .lobby-title--join-shortcut,body[data-viewport-height=compact] .lobby.lobby--compact-browser .lobby-title--join-shortcut{font-size:clamp(1.35rem,7.2vw,1.8rem)}body[data-viewport-height=medium] .lobby.lobby--compact-browser .lobby-subtitle,body[data-viewport-height=compact] .lobby.lobby--compact-browser .lobby-subtitle{margin-top:4px;font-size:.625rem;letter-spacing:.18em}body[data-viewport-height=medium] .lobby.lobby--compact-browser .mode-selector,body[data-viewport-height=medium] .lobby.lobby--compact-browser .board-config,body[data-viewport-height=medium] .lobby.lobby--compact-browser .player-card.online-card,body[data-viewport-height=medium] .lobby.lobby--compact-browser .player-card-subcell,body[data-viewport-height=medium] .lobby.lobby--compact-browser .lobby-footer,body[data-viewport-height=compact] .lobby.lobby--compact-browser .mode-selector,body[data-viewport-height=compact] .lobby.lobby--compact-browser .board-config,body[data-viewport-height=compact] .lobby.lobby--compact-browser .player-card.online-card,body[data-viewport-height=compact] .lobby.lobby--compact-browser .player-card-subcell,body[data-viewport-height=compact] .lobby.lobby--compact-browser .lobby-footer{padding:12px}body[data-viewport-height=medium] .lobby.lobby--compact-browser .match-setup-card,body[data-viewport-height=medium] .lobby.lobby--compact-browser .lobby-players,body[data-viewport-height=medium] .lobby.lobby--compact-browser .player-card,body[data-viewport-height=medium] .lobby.lobby--compact-browser .player-card-columns,body[data-viewport-height=compact] .lobby.lobby--compact-browser .match-setup-card,body[data-viewport-height=compact] .lobby.lobby--compact-browser .lobby-players,body[data-viewport-height=compact] .lobby.lobby--compact-browser .player-card,body[data-viewport-height=compact] .lobby.lobby--compact-browser .player-card-columns{gap:12px}body[data-viewport-height=medium] .lobby.lobby--compact-browser .board-config,body[data-viewport-height=compact] .lobby.lobby--compact-browser .board-config{gap:10px}body[data-viewport-height=medium] .lobby.lobby--compact-browser .board-config-details,body[data-viewport-height=compact] .lobby.lobby--compact-browser .board-config-details{gap:8px}body[data-viewport-height=medium] .lobby.lobby--compact-browser .board-config-detail,body[data-viewport-height=compact] .lobby.lobby--compact-browser .board-config-detail{padding:8px 4px}body[data-viewport-height=medium] .lobby.lobby--compact-browser .board-config-label,body[data-viewport-height=compact] .lobby.lobby--compact-browser .board-config-label{font-size:.46875rem}body[data-viewport-height=medium] .lobby.lobby--compact-browser .board-config-detail-value,body[data-viewport-height=compact] .lobby.lobby--compact-browser .board-config-detail-value{font-size:.9375rem}body[data-viewport-height=medium] .lobby.lobby--compact-browser .board-config-connect-hint,body[data-viewport-height=compact] .lobby.lobby--compact-browser .board-config-connect-hint{font-size:.625rem;padding-top:8px}body[data-viewport-height=medium] .lobby.lobby--compact-browser .mode-segment,body[data-viewport-height=compact] .lobby.lobby--compact-browser .mode-segment{min-height:38px;padding:6px 4px;font-size:.65625rem;letter-spacing:.05em}body[data-viewport-height=medium] .lobby.lobby--compact-browser .mode-segment-meta,body[data-viewport-height=compact] .lobby.lobby--compact-browser .mode-segment-meta{font-size:.5625rem}body[data-viewport-height=medium] .lobby.lobby--compact-browser .player-card-input,body[data-viewport-height=compact] .lobby.lobby--compact-browser .player-card-input{height:40px;font-size:.8125rem}body[data-viewport-height=medium] .lobby.lobby--compact-browser .player-card-subcell,body[data-viewport-height=compact] .lobby.lobby--compact-browser .player-card-subcell{min-height:104px}body[data-viewport-height=medium] .lobby.lobby--compact-browser .player-card-piece-row,body[data-viewport-height=compact] .lobby.lobby--compact-browser .player-card-piece-row{gap:10px}body[data-viewport-height=medium] .lobby.lobby--compact-browser .player-card-piece-frame,body[data-viewport-height=compact] .lobby.lobby--compact-browser .player-card-piece-frame{width:48px;height:48px}body[data-viewport-height=medium] .lobby.lobby--compact-browser .player-card-piece-name,body[data-viewport-height=compact] .lobby.lobby--compact-browser .player-card-piece-name{font-size:.75rem}body[data-viewport-height=medium] .lobby.lobby--compact-browser .player-card-piece-color,body[data-viewport-height=compact] .lobby.lobby--compact-browser .player-card-piece-color{font-size:.625rem}body[data-viewport-height=medium] .lobby.lobby--compact-browser .lobby-actions,body[data-viewport-height=compact] .lobby.lobby--compact-browser .lobby-actions{gap:8px;padding-top:6px}body[data-viewport-height=medium] .lobby.lobby--compact-browser .lobby-cta,body[data-viewport-height=compact] .lobby.lobby--compact-browser .lobby-cta{height:56px;font-size:1rem}body[data-viewport-width=compact][data-viewport-height=compact] .player-card-input,body[data-viewport-width=compact][data-viewport-height=compact] .online-join-input,body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .player-card-input,body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=compact] .online-join-input,body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=tight] .player-card-input,body.platform-ios-app-shell[data-viewport-width=compact][data-ios-control-density=tight] .online-join-input,body[data-viewport-height=medium] .lobby.lobby--compact-browser .player-card-input,body[data-viewport-height=medium] .lobby.lobby--compact-browser .online-join-input,body[data-viewport-height=compact] .lobby.lobby--compact-browser .player-card-input,body[data-viewport-height=compact] .lobby.lobby--compact-browser .online-join-input{font-size:16px}@media(min-width:768px){.lobby-panel{padding:var(--sp-5xl) var(--sp-3xl) var(--sp-4xl)}.lobby-cta{height:68px;font-size:1.2rem}}@media(prefers-reduced-motion:reduce){.lobby-panel{animation:none}.mode-segment,.player-card,.lobby-cta,.player-card-edit-btn,.player-card-piece-cell,.token-swatch{transition:none}.token-sheet,.token-popover,.adv-modal,.adv-sheet,.token-backdrop,.adv-backdrop{animation:none}.adv-chevron,.adv-audio-details,.adv-save-btn,.panel-dismiss-btn,.adv-audio-expand-btn,.toggle-pill,.toggle-knob{transition:none}}.game-piece-row{display:flex;align-items:center;gap:var(--sp-md);width:100%;padding:var(--sp-md);margin-top:6px;background:var(--surface-utility-bg);border:1px solid var(--surface-utility-border);border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition-base),border-color var(--transition-base),box-shadow var(--transition-base);box-sizing:border-box;font-family:var(--font-body);min-height:60px}.game-piece-row:hover{background:var(--surface-interactive-hover);border-color:var(--border-interactive-hover);box-shadow:var(--surface-utility-shadow)}.game-piece-row:focus-visible{outline:2px solid var(--border-interactive-focus);outline-offset:2px}.game-piece-row-label{font-size:.625rem;font-weight:600;text-transform:uppercase;letter-spacing:var(--tracking-caps);color:var(--text-dim);white-space:nowrap;min-width:70px}.game-piece-row-preview-wrap{width:44px;height:44px;border-radius:var(--radius-sm);overflow:hidden;flex-shrink:0;background:radial-gradient(circle at 50% 60%,color-mix(in srgb,var(--theme-accent-primary) 14%,transparent),transparent 70%),var(--surface-utility-bg);border:1px solid var(--surface-utility-border);pointer-events:none;transition:box-shadow var(--transition-base),border-color var(--transition-base)}.game-piece-row:hover .game-piece-row-preview-wrap{border-color:color-mix(in srgb,var(--theme-accent-primary) 32%,var(--surface-utility-border));box-shadow:0 0 16px color-mix(in srgb,var(--theme-accent-primary) 16%,transparent)}.game-piece-row-canvas{width:100%;height:100%}.game-piece-row-canvas canvas{display:block}.game-piece-row-info{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}.game-piece-row-object{font-size:.8125rem;color:var(--text-secondary);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.game-piece-row-color{font-size:.6875rem;color:var(--text-dim);font-weight:500}.game-piece-row-wrench{flex-shrink:0;color:var(--text-muted);transition:color var(--transition-base),transform var(--transition-base)}.game-piece-row:hover .game-piece-row-wrench{color:var(--text-secondary);transform:rotate(-12deg)}.cpm-content{display:flex;flex-direction:column;max-height:min(88vh,calc(var(--usable-height, 100vh) - 24px));padding:0 28px;overflow:hidden}.cpm-content .panel-head{flex-shrink:0;margin:0 -28px;padding:22px 28px 14px}.cpm-content .cpm-scroll-area{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding-bottom:var(--sp-sm)}.cpm-content .cpm-done-btn{flex-shrink:0;margin:var(--sp-sm) 0 28px}.adv-sheet .cpm-content{height:100%;max-height:none;padding:0 var(--sp-base)}.adv-sheet .cpm-content .adv-sheet-handle{flex-shrink:0}.adv-sheet .cpm-content .panel-head{margin:0 calc(-1 * var(--sp-base));padding:14px var(--sp-base) 10px}.adv-sheet .cpm-content .cpm-done-btn{margin-bottom:calc(var(--sp-sm) + var(--safe-area-bottom))}.cpm-preview{position:relative;width:100%;height:clamp(140px,22vh,240px);border-radius:var(--radius-lg);overflow:hidden;background:radial-gradient(ellipse 70% 50% at 50% 65%,color-mix(in srgb,var(--theme-accent-primary) 12%,transparent),transparent),radial-gradient(ellipse 100% 80% at 50% 50%,rgba(255,255,255,.02),transparent),var(--surface-standard-bg);border:1px solid var(--surface-standard-border);margin-bottom:var(--sp-lg);box-shadow:var(--shadow-md),var(--shadow-inset-top);flex-shrink:0}.cpm-preview canvas{display:block;width:100%!important;height:100%!important}.piece-preview-reset{position:absolute;bottom:10px;right:10px;display:inline-flex;align-items:center;gap:5px;padding:6px 12px;background:color-mix(in srgb,var(--surface-standard-bg) 92%,rgba(8,12,25,.78));backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:.6875rem;font-weight:500;transition:background var(--transition-fast),color var(--transition-fast),border-color var(--transition-fast)}.piece-preview-reset:hover{background:color-mix(in srgb,var(--surface-standard-bg) 98%,rgba(8,12,25,.9))}.piece-preview-wrap{position:relative;width:100%;height:100%}.piece-preview-fallback{width:100%;height:100%;display:grid;place-items:center;border-radius:inherit;background:radial-gradient(circle at 50% 38%,color-mix(in srgb,var(--piece-preview-color) 18%,transparent),transparent 35%),linear-gradient(180deg,#ffffff08,#ffffff03)}.piece-preview-fallback-orb{width:min(58%,72px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.92),var(--piece-preview-color, #94a3b8) 58%,rgba(15,23,42,.7) 100%);box-shadow:0 0 18px color-mix(in srgb,var(--piece-preview-color, #94a3b8) 28%,transparent),inset -10px -12px 20px #00000040}.cpm-section{display:flex;flex-direction:column;gap:10px;margin-bottom:var(--sp-lg);padding:var(--sp-base)}.cpm-section:last-child{margin-bottom:0}.cpm-section .adv-section-label{padding-bottom:var(--sp-sm);border-bottom:1px solid color-mix(in srgb,var(--surface-utility-border) 72%,transparent);margin-bottom:var(--sp-xs)}.cpm-object-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-sm)}.cpm-object-tile{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 4px 8px;font-size:.6875rem}.cpm-object-tile:hover:not(.active){color:var(--text-secondary)}.cpm-object-tile.active{color:var(--text-primary);transform:scale(1.02)}.cpm-object-tile-preview{width:60px;height:60px;border-radius:var(--radius-sm);overflow:hidden;pointer-events:none;background:radial-gradient(circle at 50% 55%,color-mix(in srgb,var(--theme-accent-primary) 10%,transparent),transparent 70%),color-mix(in srgb,var(--surface-utility-bg) 92%,transparent)}.cpm-object-tile-preview canvas{display:block}.cpm-color-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:10px;justify-items:center}.cpm-color-swatch{width:32px;height:32px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:transform var(--transition-fast),border-color var(--transition-fast),box-shadow var(--transition-fast);display:flex;align-items:center;justify-content:center;padding:0;position:relative}.cpm-color-swatch:hover:not(.disabled){transform:scale(1.18)}.cpm-color-swatch.selected{border-color:var(--text-primary);box-shadow:0 0 0 3px var(--selected-ring),0 0 16px #ffffff14}.cpm-color-swatch.disabled{opacity:.18;cursor:not-allowed}.cpm-color-swatch:focus-visible{outline:2px solid var(--border-interactive-focus);outline-offset:3px}.cpm-color-check{width:14px;height:14px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.4))}.cpm-size-wrap{display:flex;flex-direction:column;gap:6px;padding:0 2px}.cpm-size-slider{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:var(--radius-full);background:var(--control-slider-track-bg);outline:none;position:relative}.cpm-size-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;border-radius:50%;background:var(--control-slider-thumb-bg);cursor:pointer;border:2px solid var(--control-slider-thumb-border);box-shadow:var(--control-slider-thumb-shadow),0 0 16px #6366f126;transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.cpm-size-slider::-webkit-slider-thumb:hover{transform:scale(1.12);box-shadow:var(--control-slider-thumb-shadow-hover),0 0 24px #6366f133}.cpm-size-slider::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:var(--control-slider-thumb-bg);cursor:pointer;border:2px solid var(--control-slider-thumb-border);box-shadow:var(--control-slider-thumb-shadow),0 0 16px #6366f126}.cpm-size-ticks{display:flex;justify-content:space-between;padding:0 10px;pointer-events:none}.cpm-size-tick{display:flex;flex-direction:column;align-items:center;gap:3px}.cpm-size-tick-mark{width:1px;height:6px;background:var(--field-border);border-radius:1px}.cpm-size-tick-label{font-size:.625rem;font-weight:500;color:var(--text-faint);letter-spacing:var(--tracking-wide)}.cpm-done-btn{height:48px;font-size:.8125rem}body[data-viewport-width=compact] .game-piece-row{min-height:64px;padding:12px var(--sp-md)}body[data-viewport-width=compact] .cpm-object-grid{grid-template-columns:repeat(2,1fr);gap:var(--sp-sm)}body[data-viewport-width=compact] .cpm-object-tile{padding:10px 6px 8px;font-size:.75rem}body[data-viewport-width=compact] .cpm-object-tile-preview{width:52px;height:52px}body[data-viewport-width=compact] .cpm-color-grid{grid-template-columns:repeat(8,1fr);gap:var(--sp-sm)}body[data-viewport-width=compact] .cpm-color-swatch{width:30px;height:30px}body[data-viewport-width=compact] .cpm-done-btn{height:52px;font-size:.875rem}@media(max-height:700px){.cpm-preview{height:clamp(100px,16vh,160px);margin-bottom:var(--sp-md)}.cpm-section{gap:8px;margin-bottom:var(--sp-md);padding:var(--sp-sm) var(--sp-md)}.cpm-object-tile{padding:6px 4px 5px;gap:4px}.cpm-object-tile-preview{width:44px;height:44px}.cpm-color-swatch{width:28px;height:28px}.cpm-color-grid{gap:6px}}@media(max-height:500px){.cpm-preview{height:90px;margin-bottom:var(--sp-sm)}.cpm-object-grid{grid-template-columns:repeat(4,1fr)}.cpm-object-tile-preview{width:36px;height:36px}.cpm-object-tile{padding:4px 2px 3px;gap:2px;font-size:.625rem}}@media(prefers-reduced-motion:reduce){.game-piece-row,.game-piece-row-preview-wrap,.game-piece-row-wrench,.cpm-object-tile,.cpm-color-swatch,.cpm-done-btn,.piece-preview-reset{transition:none}}.loading-screen{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:var(--safe-area-top);padding-bottom:clamp(72px,calc(var(--usable-height, 100vh) * .18),160px);overflow:hidden;isolation:isolate;background:var(--theme-bg-page);z-index:100;transition:opacity .6s var(--ease-out)}.loading-screen:before{content:"";position:absolute;inset:0;background:var(--theme-bg-atmosphere);pointer-events:none}.loading-screen.fade-out{opacity:0}.loading-tagline{position:absolute;top:max(calc(var(--safe-area-top) + 56px),calc(var(--usable-height, 100vh) * .12));left:50%;z-index:1;margin:0;transform:translate(-50%);transform-origin:center;font-family:var(--font-heading);font-size:clamp(.95rem,2.6vw,1.2rem);font-weight:600;letter-spacing:.14em;color:color-mix(in srgb,var(--theme-text-primary) 92%,transparent);text-align:center;text-shadow:0 0 24px color-mix(in srgb,var(--theme-accent-primary) 22%,transparent);max-width:calc(var(--usable-width, 100vw) - 32px);animation:loadingTaglineAppear .95s cubic-bezier(.18,.9,.24,1) .55s both}.loading-canvas{width:220px;height:220px}.loading-title{margin-top:var(--sp-base);font-family:var(--font-heading);font-size:2.25rem;font-weight:700;letter-spacing:var(--tracking-tight);color:var(--text-primary);filter:drop-shadow(0 0 18px color-mix(in srgb,var(--theme-accent-primary) 18%,transparent));animation:fadeInUp .8s ease .3s both}.loading-subtitle{margin-top:var(--sp-sm);font-size:1rem;color:var(--text-dim);font-weight:500;animation:fadeInUp .8s ease .5s both}.loading-logo{position:absolute;bottom:calc(32px + var(--safe-area-bottom));width:400px;max-width:min(400px,calc(var(--usable-width, 100vw) * .7));height:auto;mix-blend-mode:screen;opacity:.6;animation:fadeInUp .8s ease .7s both}.loading-screen[data-theme=day] .loading-logo{mix-blend-mode:multiply;opacity:.38}.loading-copyright{position:absolute;bottom:calc(16px + var(--safe-area-bottom));font-size:.6875rem;color:var(--text-ghost);font-weight:400;letter-spacing:var(--tracking-wide);animation:fadeInUp .8s ease .9s both}@keyframes fadeInUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes loadingTaglineAppear{0%{opacity:0;transform:translate(-50%) scale(.2);filter:blur(14px)}to{opacity:1;transform:translate(-50%) scale(1);filter:blur(0)}}.app-layout{display:flex;flex-direction:column;width:100%;height:100%;min-height:100%;padding-top:var(--safe-area-top);box-sizing:border-box;position:relative;z-index:1;-webkit-user-select:none;user-select:none}.app-header{position:sticky;top:0;z-index:20;background:var(--surface-dock-bg);backdrop-filter:var(--blur-panel);-webkit-backdrop-filter:var(--blur-panel);border-bottom:1px solid var(--surface-dock-border);flex-shrink:0;box-shadow:var(--surface-dock-shadow)}.header-inner{display:flex;align-items:center;justify-content:center;padding:var(--sp-sm) var(--sp-lg);position:relative;max-width:1400px;margin:0 auto;width:100%;gap:var(--sp-xl)}.scoreboard{display:flex;align-items:center;gap:var(--sp-md)}.scoreboard-shell{display:flex;flex-direction:column;align-items:center;gap:var(--sp-sm);width:min(100%,560px)}.score-card{position:relative;display:flex;align-items:center;gap:var(--sp-sm);padding:6px 14px;border-radius:var(--radius-sm);transition:opacity var(--transition-base),border-color var(--transition-smooth),box-shadow var(--transition-smooth),background var(--transition-base)}.score-card.leading{opacity:1}.score-card.trailing{opacity:.5}.score-card.active{border-color:color-mix(in srgb,var(--card-color) 50%,transparent);box-shadow:0 0 16px color-mix(in srgb,var(--card-color) 30%,transparent),var(--surface-utility-shadow),inset 0 1px #ffffff0f;background:linear-gradient(180deg,color-mix(in srgb,var(--card-color) 10%,transparent),transparent 100%),var(--surface-utility-bg);opacity:1}.score-card.active .player-dot{box-shadow:0 0 8px currentColor,0 0 16px currentColor;animation:activeDotPulse 2s ease-in-out infinite}@keyframes activeDotPulse{0%,to{box-shadow:0 0 6px currentColor,0 0 12px color-mix(in srgb,currentColor 40%,transparent)}50%{box-shadow:0 0 10px currentColor,0 0 20px color-mix(in srgb,currentColor 50%,transparent)}}.score-card.winner{border-color:color-mix(in srgb,var(--card-color) 55%,transparent);box-shadow:0 0 18px color-mix(in srgb,var(--card-color) 35%,transparent),0 0 36px color-mix(in srgb,var(--card-color) 12%,transparent),var(--surface-utility-shadow),inset 0 1px #ffffff0f;background:linear-gradient(180deg,color-mix(in srgb,var(--card-color) 13%,transparent),transparent 100%),var(--surface-utility-bg);opacity:1}.player-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;box-shadow:0 0 6px currentColor}.score-card-name{font-size:var(--type-body-sm-size);font-weight:var(--type-body-weight);color:var(--text-secondary)}.score-card-name-group{display:inline-flex;align-items:center;min-width:0}.score-card-trigger{cursor:pointer;text-align:inherit;font:inherit;appearance:none}.score-card-trigger:hover{transform:translateY(var(--motion-hover-lift-distance))}.score-card-edit-badge{position:absolute;top:-4px;display:inline-flex;align-items:center;justify-content:center;color:var(--text-secondary);filter:drop-shadow(0 6px 14px color-mix(in srgb,var(--card-color) 18%,transparent));pointer-events:none}.score-card-trigger:hover .score-card-edit-badge,.score-card-trigger:focus-visible .score-card-edit-badge{color:var(--text-primary)}.score-card-edit-badge--player1{left:-8px}.score-card-edit-badge--player2{right:-8px}.score-card-score{font-size:var(--type-numeric-size);font-weight:var(--type-numeric-weight);color:var(--text-primary);min-width:1ch;text-align:center}.score-divider{width:1px;height:20px;background:linear-gradient(180deg,transparent,var(--surface-utility-border),transparent);flex-shrink:0}.scoreboard-name-editor{width:min(100%,320px);align-self:flex-start;display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:8px;padding:8px;border-color:color-mix(in srgb,var(--card-color, var(--surface-utility-border)) 36%,var(--surface-utility-border));border-radius:calc(var(--radius-lg) + 10px);box-shadow:0 10px 24px color-mix(in srgb,var(--card-color, rgba(255, 255, 255, .16)) 12%,transparent),var(--surface-utility-shadow)}.scoreboard-name-input{min-width:0;min-height:42px;padding:0 12px;font-size:var(--type-body-sm-size);border-radius:999px;background:color-mix(in srgb,var(--field-bg) 88%,black 12%)}.scoreboard-name-action{border-radius:999px}.header-actions{position:absolute;right:var(--sp-lg);top:50%;transform:translateY(-50%)}.play-area{flex:1;display:flex;position:relative;overflow:hidden;min-height:0}.play-area--stacked{flex-direction:column}.canvas-container{flex:1;min-width:400px;position:relative;overflow:hidden;background:var(--surface-play-canvas-bg)}.canvas-container--visual-only{pointer-events:none;-webkit-user-select:none;user-select:none}.split-handle{width:14px;flex-shrink:0;cursor:col-resize;background:var(--surface-divider-bg);display:flex;align-items:center;justify-content:center;transition:background var(--transition-fast),box-shadow var(--transition-fast);z-index:2;margin:0 -2px;box-shadow:var(--surface-divider-shadow)}.split-handle:hover,.split-handle:active{background:var(--surface-divider-bg-hover);box-shadow:var(--surface-divider-shadow-hover)}.split-handle-grip{width:4px;height:36px;border-radius:2px;background:var(--surface-divider-grip-bg);transition:background var(--transition-fast),box-shadow var(--transition-fast);box-shadow:var(--surface-divider-grip-shadow)}.split-handle:hover .split-handle-grip,.split-handle:active .split-handle-grip{background:var(--surface-divider-grip-bg-hover);box-shadow:var(--surface-divider-grip-shadow-hover)}.iso-panel{flex:1;min-width:200px;background:var(--surface-play-side-bg);display:flex;align-items:center;justify-content:center;padding:var(--sp-base) 0;overflow:hidden;border-left:none}.iso-panel--accessible{align-items:stretch;justify-content:stretch;padding:var(--sp-base);overflow:auto}.iso-container{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.iso-pending-pulse{animation:isoPendingPulse 1.5s ease-in-out infinite}.accessible-board{width:min(100%,820px);display:flex;flex-direction:column;gap:var(--sp-base);padding:var(--sp-base);border-radius:calc(var(--radius-lg) + 2px);background:radial-gradient(circle at top right,rgba(56,189,248,.12),transparent 42%),var(--status-surface-bg)}.accessible-board-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-sm)}.accessible-board-header-copy{display:flex;flex-direction:column;gap:4px}.accessible-board-title{margin:0;font-size:var(--type-panel-title-size);font-weight:var(--type-panel-title-weight);color:var(--text-primary)}.accessible-board-copy{margin:0;font-size:var(--type-body-sm-size);color:var(--text-muted)}.accessible-board-status{font-size:var(--type-body-sm-size);font-weight:var(--type-status-weight);color:var(--text-secondary)}.accessible-board-layers{display:flex;flex-direction:column;gap:var(--sp-base)}.accessible-board-layer{display:flex;flex-direction:column;gap:var(--sp-sm)}.accessible-board-layer-head{display:flex;align-items:center;justify-content:space-between}.accessible-board-layer-title{margin:0;font-size:calc(var(--type-body-size) + .025rem);font-weight:var(--type-panel-title-weight);color:var(--text-secondary);letter-spacing:.02em}.accessible-board-grid{display:grid;grid-template-columns:auto repeat(var(--board-columns),minmax(0,1fr));gap:8px;align-items:center}.accessible-board-grid-row{display:contents}.accessible-board-corner,.accessible-board-axis{display:flex;align-items:center;justify-content:center;min-height:34px;font-size:var(--type-helper-size);font-weight:var(--type-status-weight);color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em}.accessible-board-axis--row{justify-content:flex-start;padding-left:4px}.accessible-board-cell{aspect-ratio:1;min-height:46px;border-radius:var(--radius-md);border:1px solid var(--field-border);background:var(--surface-utility-bg);color:var(--text-secondary);font:inherit;font-size:.75rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color var(--transition-fast),box-shadow var(--transition-fast),background var(--transition-fast),transform var(--transition-fast)}.accessible-board-cell:hover{border-color:var(--field-border-hover);transform:translateY(-1px)}.accessible-board-cell:focus-visible{outline:2px solid var(--border-interactive-focus);outline-offset:2px;border-color:var(--field-border-selected);box-shadow:0 0 0 2px var(--selected-ring)}.accessible-board-cell[aria-disabled=true]{cursor:default;opacity:.72}.accessible-board-cell[aria-disabled=true]:hover{transform:none}.accessible-board-cell--playable{border-color:var(--state-playable-border);background:var(--state-playable-bg)}.accessible-board-cell--pending{border-color:var(--state-pending-border);box-shadow:var(--state-pending-shadow)}.accessible-board-cell--winning{border-color:var(--state-winning-border);box-shadow:var(--state-winning-shadow)}.accessible-board-cell--player1{color:var(--text-primary)}.accessible-board-cell--player2{color:var(--color-warning)}.accessible-board-cell-marker{min-width:2ch;text-align:center}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes isoPendingPulse{0%,to{opacity:.6}50%{opacity:.85}}.status-bar{flex-shrink:0;width:100%;max-width:520px;margin:var(--sp-sm) auto 0;padding:0 var(--sp-base);box-sizing:border-box}.status-bar-main{display:flex;align-items:center;justify-content:center;backdrop-filter:var(--blur-panel);-webkit-backdrop-filter:var(--blur-panel);gap:var(--sp-sm);transition:border-color var(--transition-slow),box-shadow var(--transition-slow),background var(--transition-base)}.status-bar-main--message{align-items:stretch;justify-content:flex-start;background:var(--surface-attention-bg);border-color:var(--surface-attention-border);box-shadow:var(--surface-attention-shadow)}.status-bar-content{display:flex;align-items:center;gap:var(--sp-sm);min-height:24px}.status-bar-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;box-shadow:0 0 8px currentColor,0 0 14px color-mix(in srgb,currentColor 35%,transparent);animation:statusDotGlow var(--motion-status-pulse-duration) ease-in-out infinite}@keyframes statusDotGlow{0%,to{box-shadow:0 0 6px currentColor,0 0 10px color-mix(in srgb,currentColor 25%,transparent)}50%{box-shadow:0 0 10px currentColor,0 0 18px color-mix(in srgb,currentColor 40%,transparent)}}.status-bar-label{font-size:var(--type-status-size);font-weight:var(--type-status-weight);color:var(--text-primary);white-space:nowrap;letter-spacing:var(--tracking-normal)}.status-bar-label--result{font-size:calc(var(--type-status-size) + .125rem);font-weight:var(--type-panel-title-weight);color:var(--text-primary)}.status-bar-label--dim{font-size:var(--type-status-size);font-weight:var(--type-status-weight);color:var(--text-dim)}.status-bar-dots{display:flex;gap:3px;margin-left:2px}.status-bar-dots span{width:4px;height:4px;border-radius:50%;background:var(--text-muted);animation:statusDotPulse 1.2s ease-in-out infinite}.status-bar-dots span:nth-child(2){animation-delay:.2s}.status-bar-dots span:nth-child(3){animation-delay:.4s}@keyframes statusDotPulse{0%,80%,to{opacity:.3;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}.status-bar--thinking .status-bar-main{animation:statusBarGlow var(--motion-status-pulse-duration) ease-in-out infinite}@keyframes statusBarGlow{0%,to{box-shadow:0 8px 32px #0000004d,inset 0 1px #ffffff0a,0 0 8px 1px color-mix(in srgb,var(--glow-color, #9ca3af) 20%,transparent)}50%{box-shadow:0 8px 32px #0000004d,inset 0 1px #ffffff0a,0 0 20px 4px color-mix(in srgb,var(--glow-color, #9ca3af) 30%,transparent)}}.status-bar--result .status-bar-main{border-color:var(--control-secondary-border-hover);box-shadow:var(--status-surface-result-shadow)}.status-bar-message-banner{flex:1 1 auto;width:100%;min-width:0;display:flex;align-items:flex-start;gap:var(--sp-xs)}.status-bar-message-copy{display:flex;align-items:flex-start;gap:6px;min-width:0;flex:1 1 auto}.status-bar-message-copy .status-bar-dot{margin-top:5px}.status-bar-message-meta{display:flex;flex:1 1 auto;flex-wrap:wrap;align-items:baseline;column-gap:8px;row-gap:2px;min-width:0}.status-bar-message-copy .status-bar-message-label{font-size:var(--type-status-size);font-weight:var(--type-status-weight);color:var(--text-primary);min-width:0;overflow-wrap:anywhere}.status-bar-chat-icon{flex-shrink:0;color:var(--text-dim);margin-top:2px}.status-bar-msg-text{font-size:var(--type-body-sm-size);color:var(--text-secondary);min-width:0;overflow-wrap:anywhere}.status-bar-message-actions{display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-end;gap:2px;flex-shrink:0}.status-bar-message-action{color:var(--text-dim)}.status-bar-message-action:hover:not(:disabled),.status-bar-message-action:focus-visible{color:var(--text-primary)}.status-bar-chat-btn{flex-shrink:0;margin-left:auto;background:var(--status-chat-button-bg);border-color:var(--status-chat-button-border);color:var(--status-chat-button-fg);box-shadow:var(--status-chat-button-shadow)}.status-bar-chat-btn:hover:not(:disabled){background:var(--status-chat-button-bg-hover);border-color:var(--status-chat-button-border-hover);color:var(--status-chat-button-fg-hover)}.status-bar-chat-btn:disabled{opacity:var(--disabled-opacity);cursor:not-allowed}.status-bar-confirm-toggle{white-space:nowrap;flex-shrink:0;margin-left:auto}.status-bar-confirm-toggle--on{box-shadow:0 0 0 1px var(--selected-ring)}.status-bar-confirm-label{line-height:1}.status-bar-confirm-switch{position:relative;width:var(--status-toggle-width);height:var(--status-toggle-height);border-radius:99px;background:var(--text-faint);flex-shrink:0;transition:background-color var(--transition-fast)}.status-bar-confirm-toggle--on .status-bar-confirm-switch{background:var(--accent-primary)}.status-bar-confirm-knob{position:absolute;top:2px;left:2px;width:var(--status-toggle-knob-size);height:var(--status-toggle-knob-size);border-radius:50%;background:#fff;transition:transform var(--transition-fast)}.status-bar-confirm-toggle--on .status-bar-confirm-knob{transform:translate(var(--status-toggle-knob-translate))}.status-bar-hint{color:var(--text-dim);font-weight:500;animation:confirmHintFadeIn .5s ease}@keyframes confirmHintFadeIn{0%{opacity:0}to{opacity:1}}.status-bar-inline-input{flex:1;min-width:0;padding:0;border:none;background:transparent;color:var(--text-primary);font-size:var(--type-body-sm-size);font-family:inherit;outline:none}.status-bar--compact-browser .status-bar-inline-input{font-size:16px}.status-bar-inline-input::placeholder{color:var(--text-dim)}.status-bar-inline-send{padding:4px 12px;font-size:var(--type-body-sm-size);flex-shrink:0}.status-bar-inline-close{flex-shrink:0}.status-bar--shake .status-bar-main{animation:statusBarShake .4s ease}@keyframes statusBarShake{0%,to{transform:translate(0)}15%{transform:translate(-6px)}30%{transform:translate(5px)}45%{transform:translate(-4px)}60%{transform:translate(3px)}75%{transform:translate(-2px)}}.play-area .canvas-container,.play-area .iso-panel{transition:opacity var(--transition-slow)}.play-area.ai-thinking .canvas-container,.play-area.ai-thinking .iso-panel{opacity:.6;pointer-events:none}.action-bar{flex-shrink:0;display:flex;align-items:center;gap:var(--sp-sm);width:100%;max-width:520px;margin:var(--sp-xs) auto 0;padding:0 var(--sp-base) var(--sp-sm);box-sizing:border-box}.action-bar-btn{flex:1;padding:8px var(--sp-base);white-space:nowrap}.control-dock{flex-shrink:0;display:flex;flex-direction:column;gap:var(--sp-md);padding:var(--sp-base) var(--sp-base);padding-bottom:calc(var(--sp-base) + var(--safe-area-bottom));background:var(--surface-dock-bg);border-top:1px solid var(--surface-dock-border);border-radius:var(--radius-xl) var(--radius-xl) 0 0;box-shadow:var(--surface-dock-shadow);overflow:hidden;position:relative;z-index:10}.control-dock-row{display:flex;align-items:center;width:100%}.control-dock-panels{flex-wrap:wrap;justify-content:center;gap:var(--sp-sm)}.control-dock-actions{gap:var(--sp-sm)}.control-dock-actions .action-bar-btn{min-height:var(--control-height-md);font-size:.875rem;padding:10px var(--sp-sm);border-radius:var(--radius-sm)}.game-action-confirm{width:100%;display:flex;align-items:center;gap:var(--sp-sm);animation:gameActionConfirmIn .18s var(--ease-out)}@keyframes gameActionConfirmIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.game-action-confirm .action-bar-btn{flex:1}.layer-slicer-dock{background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border:none;border-radius:0;padding:0;box-shadow:none}.layer-slicer-dock .layer-slicer-btn:disabled{opacity:.35;cursor:not-allowed}.control-dock .spread-slider-panel{background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border:none;border-radius:0;padding:0;box-shadow:none}.control-dock .spread-slider-input{flex:1;width:auto}.spread-slider-disabled{opacity:.4;pointer-events:none}.bottom-panels{position:absolute;bottom:var(--sp-sm);left:var(--sp-sm);right:var(--sp-sm);z-index:10;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--sp-sm);pointer-events:none}.bottom-panels>*{pointer-events:auto}.spread-slider-panel{z-index:10;background:var(--surface-utility-bg);backdrop-filter:var(--blur-panel);-webkit-backdrop-filter:var(--blur-panel);border-color:var(--surface-utility-border);border-radius:var(--radius-md);padding:10px var(--sp-base);display:flex;align-items:center;gap:var(--sp-md);box-shadow:var(--surface-utility-shadow)}.spread-slider-label{font-size:var(--type-meta-size);text-transform:uppercase;letter-spacing:var(--tracking-caps);color:var(--text-muted);font-weight:var(--type-meta-weight);white-space:nowrap}.spread-slider-input{-webkit-appearance:none;appearance:none;width:100px;height:6px;border-radius:var(--radius-full);background:var(--control-slider-track-bg);outline:none;cursor:pointer}.spread-slider-input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--control-slider-thumb-bg);border:2px solid var(--control-slider-thumb-border);cursor:pointer;box-shadow:var(--control-slider-thumb-shadow);transition:transform var(--transition-fast),box-shadow var(--transition-fast)}.spread-slider-input::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--control-slider-thumb-bg);border:2px solid var(--control-slider-thumb-border);cursor:pointer;box-shadow:var(--control-slider-thumb-shadow)}.spread-slider-input::-webkit-slider-thumb:hover{transform:scale(1.12);box-shadow:var(--control-slider-thumb-shadow-hover)}.spread-slider-value{font-size:.75rem;color:var(--text-secondary);min-width:30px;text-align:right;font-variant-numeric:tabular-nums}.layer-slicer-panel{z-index:10;background:var(--surface-utility-bg);backdrop-filter:var(--blur-panel);-webkit-backdrop-filter:var(--blur-panel);border-color:var(--surface-utility-border);border-radius:var(--radius-md);padding:10px var(--sp-md);display:flex;align-items:center;gap:var(--sp-sm);box-shadow:var(--surface-utility-shadow)}.layer-slicer-label{font-size:var(--type-meta-size);text-transform:uppercase;letter-spacing:var(--tracking-caps);color:var(--text-muted);font-weight:var(--type-meta-weight);white-space:nowrap}.layer-slicer-buttons{display:flex;gap:4px}.layer-slicer-btn{min-width:32px;min-height:32px;padding:4px var(--sp-sm);border-radius:var(--radius-xs);font-size:.78rem;font-weight:600;transition:background var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast),transform var(--transition-fast),box-shadow var(--transition-fast)}.layer-slicer-btn:hover{transform:translateY(-1px)}.layer-slicer-btn:active{transform:translateY(0) scale(.96)}.layer-slicer-btn.active{color:var(--text-primary)}.layer-slicer-all{margin-left:2px}.transient-toast-backdrop{position:fixed;inset:0;z-index:65;pointer-events:none;background:radial-gradient(circle at 50% 46%,color-mix(in srgb,var(--theme-accent-primary) 10%,transparent),#060a1680 38%,#030610ad);animation:transientToastBackdropInOut var(--motion-toast-duration) var(--ease-out) both}@keyframes transientToastBackdropInOut{0%{opacity:0}12%,88%{opacity:1}to{opacity:0}}.transient-toast-overlay{position:fixed;inset:0;z-index:65;touch-action:none}.match-start-toast{position:fixed;top:50%;left:50%;z-index:70;width:min(400px,calc(var(--usable-width, 100vw) - 32px));padding:24px 22px 20px;border-color:color-mix(in srgb,var(--match-start-accent, #7e9aff) 26%,var(--surface-hero-border));border-radius:var(--radius-2xl);background:radial-gradient(circle at top,color-mix(in srgb,var(--match-start-accent, #7e9aff) 18%,transparent),transparent 58%),var(--surface-hero-bg);box-shadow:var(--surface-hero-shadow),0 0 32px color-mix(in srgb,var(--match-start-accent, #7e9aff) 22%,transparent);display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;pointer-events:auto;animation:matchStartToastInOut var(--motion-toast-duration) var(--ease-out) both}@keyframes matchStartToastInOut{0%{opacity:0;transform:translate(-50%,calc(-50% - 10px)) scale(.97)}12%,88%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,calc(-50% - 10px)) scale(.98)}}.match-start-toast-piece-shell{width:132px;height:132px;padding:10px;border-radius:28px;background:radial-gradient(circle at 50% 24%,color-mix(in srgb,var(--match-start-accent, #7e9aff) 18%,transparent),transparent 64%),var(--surface-utility-bg);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--match-start-accent, #7e9aff) 20%,transparent),inset 0 1px #ffffff0f}.match-start-toast-piece{width:100%;height:100%}.match-start-toast-title,.match-start-toast-cta{margin:0}.match-start-toast-title{color:var(--text-primary);font-family:var(--font-heading);font-size:var(--type-panel-title-size);font-weight:var(--type-panel-title-weight);letter-spacing:var(--tracking-tight);line-height:1.3}.ai-farewell-toast{gap:10px;cursor:pointer}.ai-farewell-toast-backdrop{backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.ai-farewell-toast:hover{box-shadow:var(--surface-hero-shadow),0 0 32px color-mix(in srgb,var(--match-start-accent, #7e9aff) 22%,transparent),0 0 0 1px color-mix(in srgb,var(--match-start-accent, #7e9aff) 24%,transparent)}.ai-farewell-toast:active{transform:translate(-50%,-50%) scale(.985)}.ai-farewell-toast-name{font-size:1.16rem}.ai-farewell-toast-piece-label,.ai-farewell-toast-tagline{margin:0}.ai-farewell-toast-piece-label{color:color-mix(in srgb,var(--match-start-accent, #7e9aff) 42%,white);font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.ai-farewell-toast-tagline{color:var(--text-primary);font-family:var(--font-heading);font-size:.98rem;font-weight:var(--type-panel-title-weight);letter-spacing:.18em;text-transform:uppercase;text-shadow:0 0 18px color-mix(in srgb,var(--match-start-accent, #7e9aff) 18%,transparent)}.tie-toast{gap:14px}.tie-toast-players{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}.tie-toast-player{display:flex;flex-direction:column;align-items:center;gap:10px}.tie-toast-piece-shell{width:110px;height:110px}.tie-toast-player:last-child .tie-toast-piece-shell{background:radial-gradient(circle at 50% 24%,color-mix(in srgb,var(--tie-toast-accent-secondary, #f59e0b) 18%,transparent),transparent 64%),var(--surface-utility-bg);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tie-toast-accent-secondary, #f59e0b) 20%,transparent),inset 0 1px #ffffff0f}.tie-toast-player-name,.tie-toast-line{margin:0}.tie-toast-player-name{color:var(--text-secondary);font-size:var(--type-body-sm-size);font-weight:var(--type-status-weight);letter-spacing:.08em;text-transform:uppercase}.tie-toast-line{color:var(--text-primary);font-family:var(--font-heading);font-size:calc(var(--type-panel-title-size) - .12rem);font-weight:var(--type-panel-title-weight);line-height:1.35;text-wrap:balance}.tie-toast-line--secondary{max-width:22ch;color:color-mix(in srgb,white 88%,var(--match-start-accent, #7e9aff))}.match-start-toast-cta{min-width:180px;padding:0 18px;font-size:var(--type-body-sm-size);font-weight:700;letter-spacing:.08em;text-transform:uppercase}.confirm-overlay{position:fixed;inset:0;z-index:100;background:#000000b8;backdrop-filter:var(--blur-overlay);-webkit-backdrop-filter:var(--blur-overlay);display:flex;align-items:center;justify-content:center;animation:confirmFadeIn .2s ease}@keyframes confirmFadeIn{0%{opacity:0}to{opacity:1}}.confirm-dialog{position:relative;border-radius:var(--radius-2xl);padding:var(--sp-2xl) var(--sp-xl);max-width:380px;width:min(380px,calc(var(--usable-width, 100vw) - 24px));animation:confirmSlideIn .25s var(--ease-out)}@keyframes confirmSlideIn{0%{opacity:0;transform:scale(.96) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}.confirm-title{font-family:var(--font-heading);font-size:1.2rem;font-weight:700;letter-spacing:var(--tracking-tight);color:var(--text-primary);margin:0 0 var(--sp-sm);text-align:center}.confirm-text{color:var(--text-muted);font-size:.8125rem;line-height:1.5;margin:0 0 var(--sp-xl);text-align:center}.confirm-actions{display:flex;gap:var(--sp-sm)}.confirm-actions-col{display:flex;flex-direction:column;gap:var(--sp-sm)}.confirm-actions-col .confirm-btn{flex:none}.confirm-btn{flex:1;padding:0 var(--sp-base);font-size:.8125rem}.confirm-primary:hover{box-shadow:var(--control-primary-shadow-hover);filter:brightness(1.06);transform:translateY(-1px)}.gameover-dialog{text-align:center;padding:var(--sp-3xl) var(--sp-xl) var(--sp-2xl)}.gameover-title{color:var(--text-primary);font-family:var(--font-heading);font-size:1.2rem;font-weight:700;letter-spacing:var(--tracking-tight);margin:0 0 var(--sp-sm);filter:drop-shadow(0 0 10px rgba(120,150,255,.1))}.gameover-dialog .confirm-text{margin-bottom:var(--sp-xl)}.adv-modal.about-modal{width:min(440px,calc(var(--usable-width, 100vw) - 24px))}.about-section-tag{font-size:.5625rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:color-mix(in srgb,var(--theme-accent-primary) 78%,var(--theme-text-inverse));line-height:1}.about-content{position:relative;z-index:1;display:flex;flex-direction:column;height:100%}.about-modal .about-content{max-height:min(88vh,calc(var(--usable-height, 100vh) - 24px))}.about-scroll-area{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:0 24px 8px}.about-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.about-info-card{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border-radius:18px;border:1px solid var(--field-border);background:var(--control-secondary-bg);box-shadow:var(--control-secondary-shadow)}.about-info-card-label{font-size:.5625rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--text-dim);line-height:1.2}.about-info-card-value{font-size:.8125rem;font-weight:600;color:var(--text-secondary);line-height:1.3}.about-highlights{display:flex;flex-direction:column;gap:4px}.about-resource-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}.about-link-copy{margin:0 0 12px;color:var(--text-muted);font-size:.8125rem;line-height:1.5}.about-document-meta{margin-bottom:2px}.about-document-view{gap:4px}.about-document-section{gap:0;margin-bottom:4px;padding:8px 14px}.about-document-section .adv-section-label{padding-bottom:4px;margin-bottom:0}.about-document-section .about-link-copy{margin-bottom:0}.about-section-heading{margin-top:0}.about-highlight-row{display:flex;align-items:flex-start;gap:10px;padding:8px 12px;border-radius:var(--radius-sm);border:1px solid var(--field-border);background:var(--control-secondary-bg)}.about-highlight-dot{width:5px;height:5px;border-radius:50%;background:var(--gradient-cta);flex-shrink:0;margin-top:5px;box-shadow:0 0 6px #627dff59}.about-highlight-text{font-size:.8125rem;font-weight:500;color:var(--text-muted);line-height:1.4}.about-credits-view{display:flex;flex-direction:column;gap:14px}.about-credit-row{display:flex;align-items:center;justify-content:space-between;padding:6px 0;min-height:32px}.about-credit-name{font-size:.875rem;font-weight:600;color:var(--text-secondary)}.about-credit-role{font-size:.75rem;font-weight:500;color:var(--text-dim)}.about-secondary-btn{flex:1;padding:0 20px;font-size:.8125rem;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.about-primary-btn{flex:1;padding:0 28px;font-size:.8125rem}.about-primary-btn:disabled,.about-secondary-btn:disabled{cursor:default;opacity:.6;transform:none}.about-feedback-view{display:flex;flex-direction:column;gap:14px}.about-feedback-field{display:flex;flex-direction:column;gap:10px}.about-feedback-copy{font-size:.8125rem;line-height:1.45;color:var(--text-muted)}.about-feedback-textarea{width:100%;min-height:164px;resize:vertical;border:1px solid var(--field-border);border-radius:18px;background:var(--field-bg);color:var(--text-secondary);font:inherit;line-height:1.45;padding:14px 16px;box-sizing:border-box;box-shadow:inset 0 1px #ffffff08}.about-feedback-textarea::placeholder{color:var(--text-dim)}.about-feedback-textarea:focus-visible{outline:2px solid var(--border-interactive-focus);outline-offset:2px}.about-feedback-textarea:disabled{opacity:.75}.about-feedback-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:.75rem;color:var(--text-dim)}.about-feedback-status{padding:12px 14px;border-radius:16px;border:1px solid var(--field-border);background:var(--control-secondary-bg);color:var(--text-secondary);font-size:.8125rem;line-height:1.4}.about-feedback-status.success{border-color:var(--state-success-border);background:var(--state-success-bg);color:var(--state-success-fg)}.about-feedback-status.error{border-color:var(--state-error-border);background:var(--state-error-bg);color:var(--state-error-fg)}body[data-viewport-width=compact] .about-scroll-area{padding:0 16px 8px}body[data-viewport-width=compact] .about-info-grid{grid-template-columns:1fr}body[data-viewport-width=compact] .about-footer{padding-bottom:var(--layout-sheet-footer-padding-bottom)}body[data-viewport-width=compact] .about-feedback-meta{flex-direction:column;align-items:flex-start}body[data-viewport-width=compact][data-viewport-inset-bottom=true] .about-footer{position:sticky;bottom:0;z-index:2;margin-top:auto;background:var(--surface-sticky-footer-bg);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-top:1px solid var(--surface-sticky-footer-border)}body[data-viewport-width=compact] .header-inner{padding:var(--sp-sm) var(--sp-md);gap:var(--sp-sm)}body[data-viewport-width=compact] .scoreboard{gap:var(--sp-sm)}body[data-viewport-width=compact] .scoreboard-shell{width:min(100%,calc(100% - 44px))}body[data-viewport-width=compact] .score-card{padding:var(--layout-compact-card-padding-y) var(--layout-compact-card-padding-x);gap:var(--sp-xs)}body[data-viewport-width=compact] .score-card-name{font-size:.72rem;max-width:58px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}body[data-viewport-width=compact] .score-card-name-group{min-width:0}body[data-viewport-width=compact] .score-card-edit-badge{top:-2px;width:24px;height:24px}body[data-viewport-width=compact] .score-card-edit-badge--player1{left:-6px}body[data-viewport-width=compact] .score-card-edit-badge--player2{right:-6px}body[data-viewport-width=compact] .score-card-score{font-size:1rem}body[data-viewport-width=compact] .scoreboard-name-editor{grid-template-columns:minmax(0,1fr) auto auto}body[data-viewport-width=compact] .scoreboard-name-input{font-size:16px}body[data-viewport-width=compact] .scoreboard-name-action{width:40px;min-width:40px;height:40px}body[data-viewport-width=compact] .header-actions{right:var(--sp-md)}.play-area--stacked,body[data-viewport-width=compact] .play-area{flex-direction:column}.play-area--stacked .canvas-container,body[data-viewport-width=compact] .canvas-container{min-width:0;min-height:200px}.play-area--stacked .iso-panel,body[data-viewport-width=compact] .iso-panel{min-width:0;padding:var(--sp-sm) 0;border-left:none;border-top:1px solid var(--surface-utility-border)}.play-area--stacked .split-handle,body[data-viewport-width=compact] .split-handle{width:100%;height:10px;cursor:row-resize}.play-area--stacked .split-handle-grip,body[data-viewport-width=compact] .split-handle-grip{width:40px;height:3px}body[data-viewport-width=compact] .bottom-panels{display:none}body[data-viewport-width=compact] .status-bar{max-width:none;padding:0 var(--sp-sm);margin-top:0;margin-bottom:0;position:relative;z-index:18}body[data-viewport-width=compact] .status-bar-main{min-height:var(--status-surface-min-height);padding:var(--status-surface-padding-block) var(--status-surface-padding-inline);box-shadow:var(--shadow-md),inset 0 -1px #ffffff05}body[data-viewport-width=compact] .status-bar-label{font-size:.8rem}body[data-viewport-width=compact] .status-bar-label--result{font-size:.88rem}body[data-viewport-width=compact] .status-bar--mobile-chat{position:fixed;left:var(--mobile-chat-left, 0px);right:var(--mobile-chat-right, 0px);bottom:max(var(--mobile-chat-bottom, 0px),var(--native-keyboard-height, 0px));z-index:40;margin:0;padding-bottom:calc(var(--sp-xs) + var(--safe-area-bottom))}body .status-bar--compact-browser.status-bar--mobile-chat{position:fixed;left:var(--mobile-chat-left, 0px);right:var(--mobile-chat-right, 0px);bottom:max(var(--mobile-chat-bottom, 0px),var(--native-keyboard-height, 0px));z-index:40;max-width:none;margin:0;padding:0 var(--sp-sm) calc(var(--sp-xs) + var(--safe-area-bottom))}body[data-viewport-width=compact].mobile-chat-open .play-area,body.mobile-chat-open .play-area{transform:translateY(var(--mobile-chat-offset-top, 0px))}body[data-viewport-width=compact] .status-bar-inline-input{font-size:16px}body[data-viewport-width=compact] .status-bar-confirm-toggle{padding-inline:var(--status-pill-padding-inline)}body[data-viewport-width=compact] .status-bar-confirm-label{display:inline}body[data-viewport-width=compact] .status-bar-main--message .status-bar-message-banner{width:100%}body[data-viewport-width=compact] .status-bar-main--message .status-bar-message-actions{justify-content:flex-end}body[data-viewport-width=compact] .match-start-toast{width:min(360px,calc(var(--usable-width, 100vw) - 24px));padding:20px 18px 18px;gap:12px}body[data-viewport-width=compact] .match-start-toast-piece-shell{width:116px;height:116px}body[data-viewport-width=compact] .match-start-toast-title{font-size:.92rem}body[data-viewport-width=compact] .ai-farewell-toast-name{font-size:1.02rem}body[data-viewport-width=compact] .ai-farewell-toast-piece-label{font-size:.72rem}body[data-viewport-width=compact] .ai-farewell-toast-tagline{font-size:.86rem;letter-spacing:.16em}body[data-viewport-width=compact] .tie-toast-players{gap:10px}body[data-viewport-width=compact] .tie-toast-piece-shell{width:92px;height:92px}body[data-viewport-width=compact] .tie-toast-player-name{font-size:.68rem}body[data-viewport-width=compact] .tie-toast-line{font-size:.94rem}body[data-viewport-width=compact] .match-start-toast-cta{width:100%;font-size:.74rem}body[data-viewport-width=compact] .confirm-dialog{padding:var(--sp-xl) var(--sp-lg)}body[data-viewport-width=compact] .gameover-dialog{padding:var(--sp-2xl) var(--sp-lg) var(--sp-xl)}body[data-viewport-width=compact] .confirm-btn{font-size:.875rem}body[data-viewport-width=compact] .game-action-confirm{gap:var(--sp-sm)}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .header-inner,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .header-inner{padding:8px 12px;gap:8px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .scoreboard,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .scoreboard{gap:8px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .scoreboard-shell,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .scoreboard-shell{width:min(100%,calc(100% - 40px))}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .score-card,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .score-card{padding:6px 10px;gap:6px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .score-card-name,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .score-card-name{max-width:48px;font-size:.68rem}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .score-card-edit-badge,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .score-card-edit-badge{width:22px;height:22px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .score-card-score,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .score-card-score{font-size:.94rem}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .scoreboard-name-input,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .scoreboard-name-input{font-size:16px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .header-actions,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .header-actions{right:12px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .play-area,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .play-area{justify-content:flex-start}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .control-dock,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .control-dock{gap:10px;padding:10px 12px calc(10px + var(--safe-area-bottom))}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .control-dock-row,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .control-dock-row,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .control-dock-panels,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .control-dock-panels{gap:8px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .status-bar,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .status-bar{padding:0 2px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .status-bar-main,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .status-bar-main{min-height:var(--status-surface-min-height);padding:var(--status-surface-padding-block) 10px;gap:8px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .status-bar-content,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .status-bar-content{gap:8px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .status-bar-label,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .status-bar-label{font-size:.76rem}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .status-bar-label--result,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .status-bar-label--result{font-size:.82rem}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .status-bar-confirm-toggle,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .status-bar-confirm-toggle{padding-inline:4px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .status-bar-confirm-label,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .status-bar-confirm-label{font-size:.64rem}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .spread-slider-panel,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .layer-slicer-panel,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .spread-slider-panel,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .layer-slicer-panel{padding:8px 12px;gap:10px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .spread-slider-label,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .layer-slicer-label,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .spread-slider-label,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .layer-slicer-label{font-size:.6rem}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .spread-slider-input,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .spread-slider-input{width:88px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .spread-slider-value,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .spread-slider-value{min-width:26px;font-size:.72rem}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=compact] .layer-slicer-btn,body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .layer-slicer-btn{min-width:28px;min-height:28px;padding:4px 8px;font-size:.72rem}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .control-dock{gap:8px;padding:8px 12px calc(12px + var(--safe-area-bottom))}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight][data-ios-viewport-profile=home-button] .control-dock{padding-bottom:10px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .control-dock-actions{gap:8px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .status-bar-main{min-height:var(--status-surface-min-height);padding:var(--status-surface-padding-block) 8px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .status-bar-dot{width:10px;height:10px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .status-bar-confirm-switch{width:34px;height:20px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .status-bar-confirm-knob{width:16px;height:16px;top:1px;left:1px}body[data-viewport-width=compact].platform-ios-app-shell[data-ios-control-density=tight] .status-bar-confirm-toggle--on .status-bar-confirm-knob{transform:translate(14px)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.loading-screen{transition:none}}.error-boundary-alert{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:2rem;color:var(--text-secondary);text-align:center}.error-boundary-title{font-size:1.1rem;font-weight:600;margin-bottom:8px}.error-boundary-message{font-size:.8125rem;color:var(--text-muted);margin-bottom:16px}.error-boundary-reload{padding:0 var(--sp-base);height:44px;font-family:var(--font-body);font-size:.8125rem;font-weight:700;color:#fff;background:var(--gradient-cta);border:none;border-radius:var(--radius-md);cursor:pointer;box-shadow:var(--shadow-button);transition:transform var(--transition-fast),box-shadow var(--transition-fast),filter var(--transition-fast)}.error-boundary-reload:hover{transform:translateY(-1px);filter:brightness(1.06);box-shadow:var(--shadow-button-hover)}.error-boundary-reload:active{transform:scale(.97)}.error-boundary-reload:focus-visible{outline:2px solid var(--border-interactive-focus);outline-offset:2px}.debug-overlay{position:fixed;top:calc(var(--safe-area-top) + 12px);left:calc(var(--safe-area-left) + 12px);z-index:9999;width:min(320px,calc(100vw - var(--safe-area-left) - var(--safe-area-right) - 24px));padding:12px;border-radius:14px;border:1px solid rgba(96,165,250,.35);background:#080e1ceb;color:#e2e8f0;font-size:12px;pointer-events:auto;font-family:var(--font-mono);line-height:1.45;box-shadow:0 18px 40px #0000006b;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.debug-overlay-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.debug-overlay-header strong{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}.debug-overlay-actions{display:flex;align-items:center;gap:8px}.debug-overlay-icon-btn,.debug-overlay-close{border:none;background:#94a3b81f;color:#cbd5e1;font:inherit;cursor:pointer;transition:background var(--transition-base),color var(--transition-base),transform var(--transition-base)}.debug-overlay-icon-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;padding:0;border-radius:10px}.debug-overlay-icon-btn.copied{color:#93c5fd}.debug-overlay-close{border-radius:999px;padding:4px 10px}.debug-overlay-icon-btn:hover,.debug-overlay-close:hover{background:#94a3b833}.debug-overlay-icon-btn:active,.debug-overlay-close:active{transform:scale(.98)}.debug-overlay-row{display:grid;grid-template-columns:56px 1fr;gap:8px;align-items:start}.debug-overlay-row+.debug-overlay-row{margin-top:6px}.debug-overlay-row span{color:#93c5fd;text-transform:uppercase;letter-spacing:.06em;font-size:.68rem}.debug-overlay-row code,.debug-overlay-meta{word-break:break-word}.debug-overlay-meta{margin-top:10px;color:#94a3b8}