:root[data-theme="legacy-modern-premium"] {
  color-scheme: light;

  /* ========================= BRAND ========================= */
  --color-brand-primary: #0760ba;
  --color-brand-secondary: #009688;
  --color-brand-accent: #1aa7d9;
  --color-brand-highlight: #f2b705;

  /* ========================= BACKGROUNDS ========================= */
  --bg-body: #edf3f7;
  --bg-page: #ffffff;
  --bg-surface-1: #ffffff;
  --bg-surface-2: #f4f7f9;
  --bg-surface-3: #e4ecef;
  --bg-navbar: rgba(255, 255, 255, 0.92);
  --bg-sidebar: #ffffff;
  --bg-footer: #edf3f7;
  --bg-card: #ffffff;
  --bg-modal: #ffffff;
  --bg-dropdown: #ffffff;
  --bg-tooltip: #064f99;

  /* ========================= TEXT ========================= */
  --text-primary: #263238;
  --text-secondary: #4a5c63;
  --text-muted: #78878d;
  --text-disabled: #a8b4ba;
  --text-inverse: #ffffff;
  --text-link: #0760ba;
  --text-link-hover: #064f99;

  /* ========================= BORDERS ========================= */
  --border-light: #dce6eb;
  --border-normal: #c7d3d8;
  --border-strong: #8ea1a9;
  --border-focus: #0760ba;
  --border-width-normal: 1px;

  /* ========================= STATUS ========================= */
  --success: #009688;
  --warning: #f2b705;
  --danger: #c23b32;
  --info: #0760ba;
  --success-bg: #dff6f3;
  --warning-bg: #fff6d8;
  --danger-bg: #fde8e5;
  --info-bg: #e3f1fb;

  /* ========================= TYPOGRAPHY ========================= */
  --font-family-primary: "Roboto", "Inter", "Segoe UI", system-ui, sans-serif;
  --font-family-secondary: "Segoe UI", "Roboto", system-ui, sans-serif;
  --font-size-display-xl: 3.5rem;
  --font-size-display-lg: 3rem;
  --font-size-h1: 2.25rem;
  --font-size-h2: 1.875rem;
  --font-size-h3: 1.5rem;
  --font-size-h4: 1.25rem;
  --font-size-body-lg: 1.125rem;
  --font-size-body: 1rem;
  --font-size-body-sm: 0.875rem;
  --font-size-caption: 0.75rem;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;
  --line-height-tight: 1.15;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.7;

  /* ========================= SPACING ========================= */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;

  /* ========================= RADIUS ========================= */
  --radius-sm: 0.35rem;
  --radius-md: 0.55rem;
  --radius-lg: 0.75rem;
  --radius-xl: 1rem;
  --radius-2xl: 1.35rem;
  --radius-pill: 999px;

  /* ========================= SHADOWS / GLASS / GLOW ========================= */
  --shadow-sm: 0 1px 2px rgba(38, 50, 56, 0.06);
  --shadow-md: 0 10px 24px rgba(38, 50, 56, 0.1);
  --shadow-lg: 0 20px 48px rgba(38, 50, 56, 0.14);
  --shadow-xl: 0 30px 86px rgba(38, 50, 56, 0.18);
  --glass-bg: rgba(255, 255, 255, 0.78);
  --glass-border: rgba(199, 211, 216, 0.72);
  --glass-blur: 18px;
  --glow-primary: 0 0 0 rgba(7, 96, 186, 0);
  --glow-hover: 0 0 28px rgba(7, 96, 186, 0.18);
  --glow-focus: 0 0 0 4px rgba(7, 96, 186, 0.16);

  /* ========================= NAVBAR / SIDEBAR ========================= */
  --navbar-bg: var(--bg-navbar);
  --navbar-text: var(--text-secondary);
  --navbar-text-active: var(--color-brand-primary);
  --navbar-item-hover-bg: #e8f3fb;
  --navbar-border: var(--border-light);
  --navbar-backdrop-blur: 18px;
  --sidebar-bg: var(--bg-sidebar);
  --sidebar-text: var(--text-secondary);
  --sidebar-icon: #78878d;
  --sidebar-item-hover-bg: #f4f7f9;
  --sidebar-item-active-bg: #e8f3fb;
  --sidebar-item-active-text: #064f99;
  --sidebar-border: var(--border-light);

  /* ========================= BUTTONS ========================= */
  --btn-primary-bg: #009688;
  --btn-primary-text: #ffffff;
  --btn-primary-border: #009688;
  --btn-primary-hover-bg: #00796b;
  --btn-primary-active-bg: #00695c;
  --btn-primary-disabled-bg: #9de4da;
  --btn-secondary-bg: #f4f7f9;
  --btn-secondary-text: #263238;
  --btn-secondary-border: #c7d3d8;
  --btn-secondary-hover-bg: #dce6eb;
  --btn-outline-bg: transparent;
  --btn-outline-text: #0760ba;
  --btn-outline-border: #0760ba;
  --btn-outline-hover-bg: #e8f3fb;
  --btn-ghost-bg: transparent;
  --btn-ghost-text: #4a5c63;
  --btn-ghost-hover-bg: #f4f7f9;
  --btn-danger-bg: #c23b32;
  --btn-danger-text: #ffffff;
  --btn-danger-hover-bg: #9f2d26;

  /* ========================= INPUTS ========================= */
  --input-bg: #ffffff;
  --input-text: #263238;
  --input-placeholder: #a8b4ba;
  --input-border: #c7d3d8;
  --input-border-hover: #a8b4ba;
  --input-border-focus: #0760ba;
  --input-focus-shadow: 0 0 0 4px rgba(7, 96, 186, 0.14);
  --input-disabled-bg: #f4f7f9;
  --input-disabled-text: #a8b4ba;
  --input-error-border: #c23b32;
  --input-success-border: #009688;

  /* ========================= TABLES ========================= */
  --table-bg: #ffffff;
  --table-header-bg: #edf3f7;
  --table-header-text: #4a5c63;
  --table-row-bg: #ffffff;
  --table-row-alt-bg: #edf3f7;
  --table-row-hover-bg: #e8f3fb;
  --table-row-selected-bg: #d7ebf8;
  --table-border: #dce6eb;
  --table-cell-text: #4a5c63;

  /* ========================= CARDS ========================= */
  --card-bg: #ffffff;
  --card-border: #dce6eb;
  --card-title: #263238;
  --card-subtitle: #78878d;
  --card-shadow: var(--shadow-md);
  --card-hover-shadow: var(--shadow-lg);
  --card-hover-transform: translateY(-3px);

  /* ========================= MODALS / DROPDOWNS / TOOLTIPS ========================= */
  --modal-overlay-bg: rgba(15, 23, 42, 0.45);
  --modal-bg: #ffffff;
  --modal-header-bg: #ffffff;
  --modal-footer-bg: #edf3f7;
  --modal-border: #dce6eb;
  --modal-shadow: var(--shadow-xl);
  --dropdown-bg: #ffffff;
  --dropdown-text: #4a5c63;
  --dropdown-hover-bg: #f4f7f9;
  --dropdown-selected-bg: #e8f3fb;
  --dropdown-border: #dce6eb;
  --dropdown-shadow: var(--shadow-lg);
  --tooltip-bg: #263238;
  --tooltip-text: #ffffff;
  --tooltip-shadow: var(--shadow-md);

  /* ========================= BADGES / ALERTS ========================= */
  --badge-bg: #dce6eb;
  --badge-text: #4a5c63;
  --badge-border: #c7d3d8;
  --alert-success-bg: #dff6f3;
  --alert-success-text: #00695c;
  --alert-success-border: #9de4da;
  --alert-warning-bg: #fff6d8;
  --alert-warning-text: #92400e;
  --alert-warning-border: #fcd34d;
  --alert-danger-bg: #fde8e5;
  --alert-danger-text: #7f241f;
  --alert-danger-border: #efb0aa;
  --alert-info-bg: #e3f1fb;
  --alert-info-text: #064f99;
  --alert-info-border: #9dcbe8;

  /* ========================= SPORTS COMPONENTS ========================= */
  --match-card-bg: #ffffff;
  --match-card-border: #dce6eb;
  --match-card-hover-bg: #edf3f7;
  --match-live-bg: #fde8e5;
  --match-live-text: #c23b32;
  --match-live-glow: var(--glow-hover);
  --score-leading: #009688;
  --score-trailing: #c23b32;
  --score-draw: #78878d;
  --prediction-bg: #fff6d8;
  --prediction-border: #f6d761;
  --prediction-text: #7b5d00;
  --ranking-top-bg: #fff6d8;
  --ranking-top-border: #f6d761;
  --ranking-user-bg: #d7ebf8;
  --ranking-user-border: #94c7e8;

  /* ========================= LOGIN ========================= */
  --login-bg: radial-gradient(circle at top left, #d7ebf8 0%, #edf3f7 45%, #ffffff 100%);
  --login-panel-bg: rgba(255, 255, 255, 0.9);
  --login-panel-border: rgba(199, 211, 216, 0.86);
  --login-panel-shadow: var(--shadow-xl);
  --login-hero-bg: linear-gradient(135deg, #0760ba, #009688);
  --login-hero-text: #ffffff;
  --btn-gold-bg: linear-gradient(135deg, #f2b705, #fbbf24);
  --btn-gold-text: #263238;
  --btn-gold-border: #f2b705;
  --btn-gold-hover-bg: linear-gradient(135deg, #c99100, #f2b705);
  --glow-gold: 0 0 28px rgba(242, 183, 5, 0.22);
  --progress-track-bg: #dce6eb;
  --progress-fill-bg: linear-gradient(90deg, #0760ba, #1aa7d9);
  --progress-radius: var(--radius-pill);

  /* ========================= ANIMATION / MOTION ========================= */
  --motion-duration-fast: 120ms;
  --motion-duration-normal: 220ms;
  --motion-duration-slow: 420ms;
  --motion-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --motion-ease-emphasized: cubic-bezier(0.16, 1, 0.3, 1);
  --hover-scale: 1.015;
  --active-scale: 0.985;
  --transition-default: all var(--motion-duration-normal) var(--motion-ease-standard);

  /* ========================= RESPONSIVE ========================= */
  --container-max-width: 1280px;
  --mobile-sidebar-width: 84vw;
  --desktop-sidebar-width: 280px;
  --desktop-sidebar-collapsed-width: 88px;
  --navbar-height: 64px;
  --navbar-height-mobile: 56px;
  --card-min-height: 96px;

  /* ========================= COMPLETE THEME CONTRACT ========================= */
  --color-brand-gold: var(--color-brand-highlight);
  --color-brand-success: var(--success);
  --color-brand-warning: var(--warning);
  --color-brand-danger: var(--danger);
  --anime-energy-blue: var(--color-brand-primary);
  --anime-energy-yellow: var(--color-brand-highlight);
  --anime-speed-orange: var(--warning);
  --anime-power-red: var(--danger);
  --hero-sky-gradient: var(--login-bg);
  --hero-stadium-gradient: var(--login-hero-bg);
  --glow-yellow: var(--glow-gold);
  --glow-orange: var(--glow-gold);
  --glow-red: 0 0 28px rgba(220, 38, 38, 0.2);
  --glow-danger: var(--glow-red);
  --btn-success-bg: var(--success);
  --btn-warning-bg: var(--warning);
  --btn-warning-text: var(--text-inverse);
  --chip-bg: var(--badge-bg);
  --chip-text: var(--badge-text);
  --chip-border: var(--badge-border);
  --chip-hover-bg: var(--btn-ghost-hover-bg);
  --ranking-gold: var(--color-brand-highlight);
  --ranking-silver: var(--border-strong);
  --ranking-bronze: #9a6d00;
  --team-home-accent: var(--color-brand-primary);
  --team-away-accent: var(--danger);
  --team-draw-accent: var(--color-brand-highlight);
  --achievement-legend: var(--color-brand-highlight);
  --achievement-captain: var(--color-brand-primary);
  --achievement-master: var(--warning);
  --login-hero-accent: var(--color-brand-highlight);
  --login-glow: var(--glow-hover);
  --confetti-primary: var(--color-brand-primary);
  --confetti-secondary: var(--color-brand-highlight);
  --confetti-success: var(--success);
  --loader-primary: var(--color-brand-accent);
  --loader-secondary: var(--color-brand-highlight);
  --motion-duration-hero: 800ms;
  --focus-ring-width: 2px;
  --focus-ring-color: var(--border-focus);
  --focus-ring-offset: 2px;
  --contrast-minimum: 4.5;
  --reduced-motion: reduce;
  --high-contrast-text: #263238;
  --high-contrast-bg: #ffffff;

  /* ========================= ENTERPRISE PREMIUM 2026 SURFACES ========================= */
  --bg-surface-base: var(--bg-page);
  --bg-surface-muted: var(--bg-surface-2);
  --bg-surface-raised: var(--bg-card);
  --bg-surface-overlay: var(--glass-bg);
  --bg-surface-inset: #edf3f7;
  --bg-elevated-1: #ffffff;
  --bg-elevated-2: #edf3f7;
  --bg-elevated-3: #f4f7f9;

  /* ========================= ENTERPRISE PREMIUM 2026 STATES ========================= */
  --state-hover-bg: #e8f3fb;
  --state-active-bg: #d7ebf8;
  --state-selected-bg: #d7ebf8;
  --state-disabled-bg: #f4f7f9;
  --state-focus-bg: #e8f3fb;
  --state-hover-border: #b8d9ef;
  --state-active-border: #94c7e8;
  --state-selected-border: var(--color-brand-primary);

  /* ========================= ENTERPRISE PREMIUM 2026 NAVIGATION ========================= */
  --nav-item-bg: transparent;
  --nav-item-hover-bg: var(--state-hover-bg);
  --nav-item-active-bg: var(--state-active-bg);
  --nav-item-selected-bg: var(--state-selected-bg);
  --nav-item-text: var(--text-secondary);
  --nav-item-active-text: var(--color-brand-primary);
  --nav-item-border: transparent;
  --nav-item-active-border: var(--color-brand-primary);
  --nav-icon: var(--text-muted);
  --nav-icon-active: var(--color-brand-primary);

  /* ========================= ENTERPRISE PREMIUM 2026 BUTTON STATES ========================= */
  --btn-primary-hover-text: #ffffff;
  --btn-primary-hover-border: #00796b;
  --btn-primary-active-text: #ffffff;
  --btn-primary-active-border: #00695c;
  --btn-primary-disabled-text: #ffffff;
  --btn-primary-disabled-border: #9de4da;
  --btn-primary-focus-shadow: var(--glow-focus);
  --btn-secondary-hover-text: #263238;
  --btn-secondary-hover-border: #a8b4ba;
  --btn-secondary-active-bg: #c7d3d8;
  --btn-secondary-active-text: #263238;
  --btn-secondary-active-border: #a8b4ba;
  --btn-secondary-disabled-bg: #edf3f7;
  --btn-secondary-disabled-text: #a8b4ba;
  --btn-secondary-disabled-border: #dce6eb;
  --btn-secondary-focus-shadow: 0 0 0 4px rgba(100, 116, 139, 0.14);
  --btn-outline-hover-text: #064f99;
  --btn-outline-hover-border: #064f99;
  --btn-outline-active-bg: #d7ebf8;
  --btn-outline-active-text: #043f78;
  --btn-outline-active-border: #043f78;
  --btn-outline-disabled-bg: transparent;
  --btn-outline-disabled-text: #a8b4ba;
  --btn-outline-disabled-border: #c7d3d8;
  --btn-outline-focus-shadow: var(--glow-focus);
  --btn-ghost-border: transparent;
  --btn-ghost-hover-text: #263238;
  --btn-ghost-hover-border: transparent;
  --btn-ghost-active-bg: #dce6eb;
  --btn-ghost-active-text: #263238;
  --btn-ghost-active-border: transparent;
  --btn-ghost-disabled-bg: transparent;
  --btn-ghost-disabled-text: #a8b4ba;
  --btn-ghost-disabled-border: transparent;
  --btn-ghost-focus-shadow: 0 0 0 4px rgba(100, 116, 139, 0.14);
  --btn-success-text: #ffffff;
  --btn-success-border: #009688;
  --btn-success-hover-bg: #00796b;
  --btn-success-hover-text: #ffffff;
  --btn-success-hover-border: #00796b;
  --btn-success-active-bg: #00695c;
  --btn-success-active-text: #ffffff;
  --btn-success-active-border: #00695c;
  --btn-success-disabled-bg: #9de4da;
  --btn-success-disabled-text: #ffffff;
  --btn-success-disabled-border: #9de4da;
  --btn-success-focus-shadow: 0 0 0 4px rgba(0, 150, 136, 0.16);
  --btn-warning-border: #f2b705;
  --btn-warning-hover-bg: #c99100;
  --btn-warning-hover-text: #ffffff;
  --btn-warning-hover-border: #c99100;
  --btn-warning-active-bg: #9a6d00;
  --btn-warning-active-text: #ffffff;
  --btn-warning-active-border: #9a6d00;
  --btn-warning-disabled-bg: #fcd34d;
  --btn-warning-disabled-text: #92400e;
  --btn-warning-disabled-border: #fcd34d;
  --btn-warning-focus-shadow: 0 0 0 4px rgba(242, 183, 5, 0.18);
  --btn-danger-border: #c23b32;
  --btn-danger-hover-text: #ffffff;
  --btn-danger-hover-border: #9f2d26;
  --btn-danger-active-bg: #7f241f;
  --btn-danger-active-text: #ffffff;
  --btn-danger-active-border: #7f241f;
  --btn-danger-disabled-bg: #efb0aa;
  --btn-danger-disabled-text: #ffffff;
  --btn-danger-disabled-border: #efb0aa;
  --btn-danger-focus-shadow: 0 0 0 4px rgba(194, 59, 50, 0.16);
  --btn-neutral-bg: var(--btn-secondary-bg);
  --btn-neutral-text: var(--btn-secondary-text);
  --btn-neutral-border: var(--btn-secondary-border);
  --btn-neutral-hover-bg: var(--btn-secondary-hover-bg);
  --btn-neutral-hover-text: var(--btn-secondary-hover-text);
  --btn-neutral-hover-border: var(--btn-secondary-hover-border);
  --btn-neutral-active-bg: var(--btn-secondary-active-bg);
  --btn-neutral-active-text: var(--btn-secondary-active-text);
  --btn-neutral-active-border: var(--btn-secondary-active-border);
  --btn-neutral-disabled-bg: var(--btn-secondary-disabled-bg);
  --btn-neutral-disabled-text: var(--btn-secondary-disabled-text);
  --btn-neutral-disabled-border: var(--btn-secondary-disabled-border);
  --btn-neutral-focus-shadow: var(--btn-secondary-focus-shadow);

  /* ========================= ENTERPRISE PREMIUM 2026 FORMS ========================= */
  --label-text: var(--text-secondary);
  --label-required: var(--danger);
  --help-text: var(--text-muted);
  --validation-error-text: #7f241f;
  --validation-success-text: #00695c;
  --input-icon: var(--text-muted);
  --input-addon-bg: var(--bg-surface-2);
  --input-addon-border: var(--border-normal);
  --input-readonly-bg: var(--bg-surface-2);
  --input-readonly-text: var(--text-secondary);

  /* ========================= ENTERPRISE PREMIUM 2026 TABLES ========================= */
  --table-sort-icon: var(--text-muted);
  --table-filter-bg: var(--bg-surface-1);
  --table-filter-border: var(--border-normal);
  --table-sticky-header-bg: rgba(237, 243, 247, 0.94);
  --table-empty-text: var(--text-muted);
  --table-group-header-bg: var(--bg-surface-2);
  --table-summary-row-bg: #e8f3fb;

  /* ========================= ENTERPRISE PREMIUM 2026 COMPONENTS ========================= */
  --tab-bg: transparent;
  --tab-text: var(--text-secondary);
  --tab-hover-bg: var(--state-hover-bg);
  --tab-active-bg: var(--bg-surface-1);
  --tab-active-text: var(--color-brand-primary);
  --tab-indicator: var(--color-brand-primary);
  --pagination-bg: var(--bg-surface-1);
  --pagination-text: var(--text-secondary);
  --pagination-hover-bg: var(--state-hover-bg);
  --pagination-active-bg: var(--color-brand-primary);
  --pagination-active-text: #ffffff;
  --pagination-disabled-text: var(--text-disabled);
  --accordion-header-bg: var(--bg-surface-1);
  --accordion-header-text: var(--text-primary);
  --accordion-body-bg: var(--bg-page);
  --accordion-border: var(--border-light);
  --accordion-icon: var(--text-muted);
  --toast-bg: var(--bg-surface-raised);
  --toast-text: var(--text-primary);
  --toast-border: var(--border-light);
  --skeleton-bg: #dce6eb;
  --skeleton-highlight: #edf3f7;
  --empty-state-bg: var(--bg-surface-2);
  --empty-state-icon: var(--text-muted);
  --empty-state-title: var(--text-primary);
  --empty-state-text: var(--text-muted);
  --avatar-bg: var(--bg-surface-2);
  --avatar-border: var(--border-light);
  --avatar-ring: var(--glow-focus);
  --profile-stat-bg: var(--bg-surface-1);
  --profile-stat-border: var(--border-light);
  --notification-bg: var(--bg-surface-1);
  --notification-border: var(--border-light);
  --notification-unread-bg: #e8f3fb;
  --notification-dot: var(--color-brand-primary);
  --scrollbar-track: var(--bg-surface-2);
  --scrollbar-thumb: #c7d3d8;
  --scrollbar-thumb-hover: #a8b4ba;

  /* ========================= ENTERPRISE PREMIUM 2026 MOTION ========================= */
  --motion-duration-instant: 0ms;
  --motion-duration-score-update: 220ms;
  --motion-duration-live-update: 420ms;
  --motion-duration-achievement: 620ms;
  --motion-duration-ranking-change: 360ms;
  --motion-ease-decelerate: cubic-bezier(0, 0, 0.2, 1);
  --motion-ease-accelerate: cubic-bezier(0.4, 0, 1, 1);

  /* ========================= SPORTS PREMIUM EXTENDED CONTRACT ========================= */
  --team-neutral-accent: var(--color-brand-accent);
  --team-logo-bg: var(--bg-surface-1);
  --team-logo-border: var(--border-light);
  --team-logo-shadow: var(--shadow-sm);
  --team-name-text: var(--text-primary);
  --team-meta-text: var(--text-muted);
  --live-pulse-color: rgba(194, 59, 50, 0.36);
  --live-dot-bg: var(--danger);
  --live-border: var(--alert-danger-border);
  --live-score-glow: 0 0 0 4px rgba(194, 59, 50, 0.12);
  --live-card-bg: var(--alert-danger-bg);
  --live-card-border: var(--alert-danger-border);
  --live-badge-bg: var(--match-live-bg);
  --live-badge-text: var(--match-live-text);
  --prediction-input-bg: var(--input-bg);
  --prediction-input-border: var(--input-border);
  --prediction-input-focus: var(--input-focus-shadow);
  --prediction-correct-bg: var(--success-bg);
  --prediction-correct-border: var(--alert-success-border);
  --prediction-correct-text: var(--alert-success-text);
  --prediction-wrong-bg: var(--danger-bg);
  --prediction-wrong-border: var(--alert-danger-border);
  --prediction-wrong-text: var(--alert-danger-text);
  --prediction-pending-bg: var(--warning-bg);
  --prediction-pending-border: var(--alert-warning-border);
  --prediction-pending-text: var(--alert-warning-text);
  --badge-live-bg: var(--live-badge-bg);
  --badge-live-text: var(--live-badge-text);
  --badge-prediction-bg: var(--prediction-bg);
  --badge-prediction-text: var(--prediction-text);
  --badge-ranking-bg: var(--ranking-user-bg);
  --badge-ranking-text: var(--text-link);
  --badge-achievement-bg: var(--ranking-top-bg);
  --badge-achievement-text: var(--alert-warning-text);
  --achievement-elite: var(--color-brand-accent);
  --achievement-rookie: var(--text-muted);
  --stat-positive: var(--success);
  --stat-negative: var(--danger);
  --stat-neutral: var(--text-muted);
  --stat-highlight: var(--color-brand-highlight);
  --stat-card-bg: var(--bg-surface-1);
  --stat-card-border: var(--border-light);
  --match-card-mobile-height: 132px;
  --match-card-desktop-height: 156px;
  --ranking-mobile-layout: stacked;
  --dashboard-mobile-spacing: var(--space-4);
  /* ========================= GAME EXPERIENCE ========================= */
  --game-hero-bg: var(--hero-stadium-gradient);
  --game-hero-border: var(--border-strong);
  --game-hero-shadow: var(--shadow-xl);
  --game-hero-title: var(--text-primary);
  --game-hero-subtitle: var(--text-secondary);
  --player-card-bg: var(--bg-surface-1);
  --player-card-border: var(--border-light);
  --player-card-shadow: var(--shadow-md);
  --player-level-bg: var(--btn-gold-bg);
  --player-level-text: var(--btn-gold-text);
  --match-card-bg: var(--bg-card);
  --match-card-border: var(--border-light);
  --match-card-shadow: var(--shadow-md);
  --match-card-hover-shadow: var(--shadow-lg);
  --match-header-bg: var(--bg-surface-2);
  --match-date-chip-bg: var(--chip-bg);
  --match-date-chip-text: var(--chip-text);
  --match-status-bg: var(--info-bg);
  --match-status-text: var(--info);
  --score-editor-bg: var(--bg-surface-inset);
  --score-editor-border: var(--border-normal);
  --score-editor-shadow: var(--shadow-sm);
  --score-input-bg: var(--input-bg);
  --score-input-text: var(--input-text);
  --score-input-border: var(--input-border);
  --score-input-focus: var(--border-focus);
  --prediction-available-bg: var(--info-bg);
  --prediction-available-text: var(--info);
  --prediction-saved-bg: var(--success-bg);
  --prediction-saved-text: var(--success);
  --prediction-closed-bg: var(--warning-bg);
  --prediction-closed-text: var(--warning);
  --prediction-correct-bg: var(--success-bg);
  --prediction-correct-text: var(--success);
  --prediction-wrong-bg: var(--danger-bg);
  --prediction-wrong-text: var(--danger);
  --ranking-podium-bg: var(--bg-card);
  --ranking-podium-border: var(--border-strong);
  --ranking-first-bg: var(--btn-gold-bg);
  --ranking-second-bg: var(--bg-surface-2);
  --ranking-third-bg: var(--warning-bg);
  --ranking-current-user-bg: var(--ranking-user-bg);
  --achievement-bg: var(--success-bg);
  --achievement-border: var(--border-light);
  --achievement-icon-bg: var(--btn-gold-bg);
  --achievement-title: var(--text-primary);
  --achievement-text: var(--text-secondary);
  --game-mode-bg: var(--bg-card);
  --game-mode-border: var(--border-strong);
  --game-mode-shadow: var(--shadow-lg);
  --game-mode-cta-bg: var(--btn-primary-bg);
  --game-mode-cta-text: var(--btn-primary-text);
}