:root[data-theme="anime-soccer-legends"] {
  color-scheme: light;

  /* ========================= BRAND ========================= */
  --color-brand-primary: #2196ff;
  --color-brand-secondary: #004cff;
  --color-brand-accent: #00cfff;
  --color-brand-highlight: #ffd400;
  --color-brand-gold: #ffb800;
  --color-brand-success: #2ecc71;
  --color-brand-warning: #ff9800;
  --color-brand-danger: #ff3b30;
  --anime-energy-blue: #2196ff;
  --anime-energy-yellow: #ffd400;
  --anime-speed-orange: #ff9800;
  --anime-power-red: #ff3b30;

  /* ========================= BACKGROUNDS ========================= */
  --bg-body: #f4fbff;
  --bg-page: #ffffff;
  --bg-surface-1: #ffffff;
  --bg-surface-2: #f3f9ff;
  --bg-surface-3: #e7f2ff;
  --bg-navbar: rgba(255, 255, 255, 0.9);
  --bg-sidebar: linear-gradient(180deg, #0057ff, #2196ff);
  --bg-footer: #ffffff;
  --bg-card: #ffffff;
  --bg-modal: #ffffff;
  --bg-dropdown: #ffffff;
  --bg-tooltip: #003366;

  /* ========================= HERO BACKGROUNDS ========================= */
  --hero-sky-gradient: linear-gradient(180deg, #4ab6ff 0%, #84d7ff 40%, #ffffff 100%);
  --hero-stadium-gradient: linear-gradient(135deg, #2196ff, #00cfff);

  /* ========================= TEXT ========================= */
  --text-primary: #0d1b2a;
  --text-secondary: #34495e;
  --text-muted: #7f8c8d;
  --text-disabled: #b0bec5;
  --text-inverse: #ffffff;
  --text-link: #0057ff;
  --text-link-hover: #0040cc;

  /* ========================= BORDERS ========================= */
  --border-light: #dbeafe;
  --border-normal: #c4e0ff;
  --border-strong: #99c6ff;
  --border-focus: #2196ff;
  --border-width-normal: 1px;

  /* ========================= STATUS ========================= */
  --success: #2ecc71;
  --warning: #ff9800;
  --danger: #ff3b30;
  --info: #00cfff;
  --success-bg: rgba(46, 204, 113, 0.12);
  --warning-bg: rgba(255, 152, 0, 0.12);
  --danger-bg: rgba(255, 59, 48, 0.12);
  --info-bg: rgba(0, 207, 255, 0.12);

  /* ========================= TYPOGRAPHY ========================= */
  --font-family-primary: "Poppins", "Inter", "Segoe UI", system-ui, sans-serif;
  --font-family-secondary: "Nunito", "Poppins", "Segoe UI", system-ui, sans-serif;
  --font-size-display-xl: 4rem;
  --font-size-display-lg: 3.5rem;
  --font-size-h1: 2.5rem;
  --font-size-h2: 2rem;
  --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: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-2xl: 32px;
  --radius-pill: 999px;

  /* ========================= SHADOWS / GLASS / GLOW ========================= */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.12);
  --shadow-lg: 0 20px 48px rgba(0, 0, 0, 0.15);
  --shadow-xl: 0 32px 80px rgba(0, 0, 0, 0.2);
  --glass-bg: rgba(255, 255, 255, 0.76);
  --glass-border: rgba(33, 150, 255, 0.22);
  --glass-blur: 18px;
  --glow-primary: 0 0 24px rgba(33, 150, 255, 0.35);
  --glow-hover: 0 0 32px rgba(33, 150, 255, 0.24);
  --glow-focus: 0 0 0 4px rgba(33, 150, 255, 0.15);
  --glow-gold: 0 0 28px rgba(255, 212, 0, 0.4);
  --glow-yellow: 0 0 28px rgba(255, 212, 0, 0.4);
  --glow-orange: 0 0 24px rgba(255, 152, 0, 0.4);
  --glow-danger: 0 0 24px rgba(255, 59, 48, 0.35);
  --glow-red: var(--glow-danger);

  /* ========================= NAVBAR / SIDEBAR ========================= */
  --navbar-bg: rgba(255, 255, 255, 0.92);
  --navbar-text: #0d1b2a;
  --navbar-text-active: #0057ff;
  --navbar-item-hover-bg: rgba(33, 150, 255, 0.08);
  --navbar-border: #dbeafe;
  --navbar-backdrop-blur: 18px;
  --sidebar-bg: linear-gradient(180deg, #0057ff, #2196ff);
  --sidebar-text: #ffffff;
  --sidebar-icon: #ffffff;
  --sidebar-item-hover-bg: rgba(255, 255, 255, 0.15);
  --sidebar-item-active-bg: #ffd400;
  --sidebar-item-active-text: #003366;
  --sidebar-border: rgba(0, 76, 255, 0.18);

  /* ========================= BUTTONS ========================= */
  --btn-primary-bg: linear-gradient(135deg, #0057ff, #2196ff);
  --btn-primary-text: #ffffff;
  --btn-primary-border: #0057ff;
  --btn-primary-hover-bg: linear-gradient(135deg, #0040cc, #0077ff);
  --btn-primary-active-bg: #003399;
  --btn-primary-disabled-bg: #99c6ff;
  --btn-secondary-bg: #ffffff;
  --btn-secondary-text: #0057ff;
  --btn-secondary-border: #0057ff;
  --btn-secondary-hover-bg: #eaf5ff;
  --btn-outline-bg: rgba(255, 255, 255, 0);
  --btn-outline-text: #0057ff;
  --btn-outline-border: #0057ff;
  --btn-outline-hover-bg: rgba(33, 150, 255, 0.1);
  --btn-ghost-bg: rgba(255, 255, 255, 0);
  --btn-ghost-text: #34495e;
  --btn-ghost-hover-bg: rgba(33, 150, 255, 0.08);
  --btn-danger-bg: #ff3b30;
  --btn-danger-text: #ffffff;
  --btn-danger-hover-bg: #d92d25;
  --btn-success-bg: #2ecc71;
  --btn-warning-bg: #ffd400;
  --btn-warning-text: #222222;
  --btn-gold-bg: linear-gradient(135deg, #ffd400, #ff9800);
  --btn-gold-text: #222222;
  --btn-gold-border: #ffd400;
  --btn-gold-hover-bg: linear-gradient(135deg, #ffb800, #ff7a00);

  /* ========================= INPUTS ========================= */
  --input-bg: #ffffff;
  --input-text: #0d1b2a;
  --input-placeholder: #90a4ae;
  --input-border: #c4e0ff;
  --input-border-hover: #99c6ff;
  --input-border-focus: #2196ff;
  --input-focus-shadow: 0 0 0 4px rgba(33, 150, 255, 0.15);
  --input-disabled-bg: #f3f9ff;
  --input-disabled-text: #b0bec5;
  --input-error-border: #ff3b30;
  --input-success-border: #2ecc71;

  /* ========================= TABLES ========================= */
  --table-bg: #ffffff;
  --table-header-bg: #f3f9ff;
  --table-header-text: #0057ff;
  --table-row-bg: #ffffff;
  --table-row-alt-bg: #f8fcff;
  --table-row-hover-bg: #eaf5ff;
  --table-row-selected-bg: #d9ecff;
  --table-border: #dbeafe;
  --table-cell-text: #34495e;

  /* ========================= CARDS ========================= */
  --card-bg: #ffffff;
  --card-border: #dbeafe;
  --card-title: #0d1b2a;
  --card-subtitle: #7f8c8d;
  --card-shadow: var(--shadow-md);
  --card-hover-shadow: var(--shadow-lg), var(--glow-hover);
  --card-hover-transform: translateY(-6px) scale(1.02);

  /* ========================= MODALS / DROPDOWNS / TOOLTIPS ========================= */
  --modal-overlay-bg: rgba(13, 27, 42, 0.42);
  --modal-bg: #ffffff;
  --modal-header-bg: #f3f9ff;
  --modal-footer-bg: #f8fcff;
  --modal-border: #dbeafe;
  --modal-shadow: var(--shadow-xl);
  --dropdown-bg: #ffffff;
  --dropdown-text: #34495e;
  --dropdown-hover-bg: #eaf5ff;
  --dropdown-selected-bg: #d9ecff;
  --dropdown-border: #dbeafe;
  --dropdown-shadow: var(--shadow-lg);
  --tooltip-bg: #003366;
  --tooltip-text: #ffffff;
  --tooltip-shadow: var(--shadow-md);

  /* ========================= BADGES / CHIPS / ALERTS ========================= */
  --badge-bg: #eaf5ff;
  --badge-text: #0057ff;
  --badge-border: #c4e0ff;
  --chip-bg: rgba(33, 150, 255, 0.08);
  --chip-text: #0057ff;
  --chip-border: rgba(33, 150, 255, 0.22);
  --chip-hover-bg: rgba(33, 150, 255, 0.14);
  --alert-success-bg: rgba(46, 204, 113, 0.12);
  --alert-success-text: #168a48;
  --alert-success-border: rgba(46, 204, 113, 0.35);
  --alert-warning-bg: rgba(255, 152, 0, 0.12);
  --alert-warning-text: #8a5c00;
  --alert-warning-border: rgba(255, 152, 0, 0.35);
  --alert-danger-bg: rgba(255, 59, 48, 0.12);
  --alert-danger-text: #a61f18;
  --alert-danger-border: rgba(255, 59, 48, 0.35);
  --alert-info-bg: rgba(0, 207, 255, 0.12);
  --alert-info-text: #006d8a;
  --alert-info-border: rgba(0, 207, 255, 0.35);

  /* ========================= SPORTS COMPONENTS ========================= */
  --match-card-bg: #ffffff;
  --match-card-border: #dbeafe;
  --match-card-hover-bg: #f3f9ff;
  --match-live-bg: rgba(255, 59, 48, 0.15);
  --match-live-text: #ff3b30;
  --match-live-glow: var(--glow-red);
  --score-leading: #2ecc71;
  --score-trailing: #ff3b30;
  --score-draw: #7f8c8d;
  --prediction-bg: rgba(255, 212, 0, 0.18);
  --prediction-border: rgba(255, 184, 0, 0.5);
  --prediction-text: #8a5c00;
  --ranking-gold: #ffd400;
  --ranking-silver: #d6dce5;
  --ranking-bronze: #d08b3f;
  --ranking-top-bg: rgba(255, 212, 0, 0.2);
  --ranking-top-border: rgba(255, 184, 0, 0.55);
  --ranking-user-bg: #d9ecff;
  --ranking-user-border: #2196ff;
  --team-home-accent: #2196ff;
  --team-away-accent: #ff3b30;
  --team-draw-accent: #ffd400;

  /* ========================= ACHIEVEMENTS ========================= */
  --achievement-legend: #ffd400;
  --achievement-captain: #2196ff;
  --achievement-master: #ff9800;

  /* ========================= LOGIN ========================= */
  --login-bg: linear-gradient(180deg, #4ab6ff, #ffffff);
  --login-panel-bg: rgba(255, 255, 255, 0.92);
  --login-panel-border: rgba(33, 150, 255, 0.18);
  --login-panel-shadow: 0 25px 80px rgba(0, 0, 0, 0.15);
  --login-hero-bg: linear-gradient(135deg, #2196ff, #00cfff);
  --login-hero-text: #ffffff;
  --login-hero-accent: #ffd400;
  --login-glow: var(--glow-primary);

  /* ========================= CONFETTI TOKENS ========================= */
  --confetti-primary: #2196ff;
  --confetti-secondary: #ffd400;
  --confetti-success: #2ecc71;

  /* ========================= PROGRESS / LOADERS ========================= */
  --progress-track-bg: #eaf5ff;
  --progress-fill-bg: linear-gradient(90deg, #2196ff, #00cfff);
  --progress-radius: 999px;
  --loader-primary: #2196ff;
  --loader-secondary: #ffd400;

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

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

  /* ========================= ACCESSIBILITY ========================= */
  --focus-ring-width: 2px;
  --focus-ring-color: #2196ff;
  --focus-ring-offset: 2px;
  --contrast-minimum: 4.5;
  --reduced-motion: reduce;
  --high-contrast-text: #0d1b2a;
  --high-contrast-bg: #ffffff;

  /* ========================= ENTERPRISE PREMIUM 2026 EXTENDED CONTRACT ========================= */
  --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: var(--bg-surface-2);
  --bg-elevated-1: var(--bg-surface-1);
  --bg-elevated-2: var(--bg-surface-2);
  --bg-elevated-3: var(--bg-surface-3);
  --state-hover-bg: var(--navbar-item-hover-bg);
  --state-active-bg: var(--table-row-selected-bg);
  --state-selected-bg: var(--ranking-user-bg);
  --state-disabled-bg: var(--input-disabled-bg);
  --state-focus-bg: var(--info-bg);
  --state-hover-border: var(--border-normal);
  --state-active-border: var(--border-focus);
  --state-selected-border: var(--ranking-user-border);
  --nav-item-bg: var(--btn-ghost-bg);
  --nav-item-hover-bg: var(--navbar-item-hover-bg);
  --nav-item-active-bg: var(--sidebar-item-active-bg);
  --nav-item-selected-bg: var(--sidebar-item-active-bg);
  --nav-item-text: var(--navbar-text);
  --nav-item-active-text: var(--navbar-text-active);
  --nav-item-border: var(--border-light);
  --nav-item-active-border: var(--border-focus);
  --nav-icon: var(--sidebar-icon);
  --nav-icon-active: var(--navbar-text-active);
  --btn-primary-hover-text: var(--btn-primary-text);
  --btn-primary-hover-border: var(--btn-primary-border);
  --btn-primary-active-text: var(--btn-primary-text);
  --btn-primary-active-border: var(--btn-primary-border);
  --btn-primary-disabled-text: var(--btn-primary-text);
  --btn-primary-disabled-border: var(--btn-primary-disabled-bg);
  --btn-primary-focus-shadow: var(--glow-focus);
  --btn-secondary-hover-text: var(--btn-secondary-text);
  --btn-secondary-hover-border: var(--btn-secondary-border);
  --btn-secondary-active-bg: var(--btn-secondary-hover-bg);
  --btn-secondary-active-text: var(--btn-secondary-text);
  --btn-secondary-active-border: var(--btn-secondary-border);
  --btn-secondary-disabled-bg: var(--input-disabled-bg);
  --btn-secondary-disabled-text: var(--input-disabled-text);
  --btn-secondary-disabled-border: var(--border-light);
  --btn-secondary-focus-shadow: var(--glow-focus);
  --btn-outline-hover-text: var(--btn-outline-text);
  --btn-outline-hover-border: var(--btn-outline-border);
  --btn-outline-active-bg: var(--btn-outline-hover-bg);
  --btn-outline-active-text: var(--btn-outline-text);
  --btn-outline-active-border: var(--btn-outline-border);
  --btn-outline-disabled-bg: var(--btn-outline-bg);
  --btn-outline-disabled-text: var(--text-disabled);
  --btn-outline-disabled-border: var(--border-light);
  --btn-outline-focus-shadow: var(--glow-focus);
  --btn-ghost-border: var(--btn-outline-bg);
  --btn-ghost-hover-text: var(--btn-ghost-text);
  --btn-ghost-hover-border: var(--btn-outline-bg);
  --btn-ghost-active-bg: var(--btn-ghost-hover-bg);
  --btn-ghost-active-text: var(--btn-ghost-text);
  --btn-ghost-active-border: var(--btn-outline-bg);
  --btn-ghost-disabled-bg: var(--btn-ghost-bg);
  --btn-ghost-disabled-text: var(--text-disabled);
  --btn-ghost-disabled-border: var(--btn-outline-bg);
  --btn-ghost-focus-shadow: var(--glow-focus);
  --btn-success-text: var(--btn-primary-text);
  --btn-success-border: var(--success);
  --btn-success-hover-bg: var(--success);
  --btn-success-hover-text: var(--btn-primary-text);
  --btn-success-hover-border: var(--success);
  --btn-success-active-bg: var(--success);
  --btn-success-active-text: var(--btn-primary-text);
  --btn-success-active-border: var(--success);
  --btn-success-disabled-bg: var(--success-bg);
  --btn-success-disabled-text: var(--text-disabled);
  --btn-success-disabled-border: var(--success-bg);
  --btn-success-focus-shadow: var(--glow-focus);
  --btn-warning-border: var(--warning);
  --btn-warning-hover-bg: var(--warning);
  --btn-warning-hover-text: var(--btn-warning-text);
  --btn-warning-hover-border: var(--warning);
  --btn-warning-active-bg: var(--warning);
  --btn-warning-active-text: var(--btn-warning-text);
  --btn-warning-active-border: var(--warning);
  --btn-warning-disabled-bg: var(--warning-bg);
  --btn-warning-disabled-text: var(--text-disabled);
  --btn-warning-disabled-border: var(--warning-bg);
  --btn-warning-focus-shadow: var(--glow-yellow);
  --btn-danger-border: var(--btn-danger-bg);
  --btn-danger-hover-text: var(--btn-danger-text);
  --btn-danger-hover-border: var(--btn-danger-hover-bg);
  --btn-danger-active-bg: var(--btn-danger-hover-bg);
  --btn-danger-active-text: var(--btn-danger-text);
  --btn-danger-active-border: var(--btn-danger-hover-bg);
  --btn-danger-disabled-bg: var(--danger-bg);
  --btn-danger-disabled-text: var(--text-disabled);
  --btn-danger-disabled-border: var(--danger-bg);
  --btn-danger-focus-shadow: var(--glow-red);
  --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);
  --label-text: var(--text-secondary);
  --label-required: var(--danger);
  --help-text: var(--text-muted);
  --validation-error-text: var(--alert-danger-text);
  --validation-success-text: var(--alert-success-text);
  --input-icon: var(--text-muted);
  --input-addon-bg: var(--bg-surface-2);
  --input-addon-border: var(--border-normal);
  --input-readonly-bg: var(--input-disabled-bg);
  --input-readonly-text: var(--text-secondary);
  --table-sort-icon: var(--text-muted);
  --table-filter-bg: var(--bg-surface-1);
  --table-filter-border: var(--border-normal);
  --table-sticky-header-bg: var(--table-header-bg);
  --table-empty-text: var(--text-muted);
  --table-group-header-bg: var(--bg-surface-2);
  --table-summary-row-bg: var(--ranking-user-bg);
  --tab-bg: var(--btn-ghost-bg);
  --tab-text: var(--text-secondary);
  --tab-hover-bg: var(--state-hover-bg);
  --tab-active-bg: var(--bg-surface-1);
  --tab-active-text: var(--text-link);
  --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: var(--btn-primary-text);
  --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: var(--bg-surface-2);
  --skeleton-highlight: var(--bg-surface-3);
  --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: var(--info-bg);
  --notification-dot: var(--color-brand-primary);
  --scrollbar-track: var(--bg-surface-2);
  --scrollbar-thumb: var(--border-normal);
  --scrollbar-thumb-hover: var(--border-strong);
  --motion-duration-instant: 0ms;
  --motion-duration-score-update: 240ms;
  --motion-duration-live-update: 480ms;
  --motion-duration-achievement: 760ms;
  --motion-duration-ranking-change: 420ms;
  --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(255, 59, 48, 0.36);
  --live-dot-bg: var(--danger);
  --live-border: var(--alert-danger-border);
  --live-score-glow: var(--glow-red);
  --live-card-bg: var(--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);
}

html[data-theme="anime-soccer-legends"] body {
  background: var(--hero-sky-gradient);
}

html[data-theme="anime-soccer-legends"] .app-card:hover,
html[data-theme="anime-soccer-legends"] .match-card:hover,
html[data-theme="anime-soccer-legends"] .quiniela-card:hover {
  box-shadow: var(--card-hover-shadow);
  transform: var(--card-hover-transform);
}

html[data-theme="anime-soccer-legends"] .app-button-primary:hover,
html[data-theme="anime-soccer-legends"] .team-save:hover,
html[data-theme="anime-soccer-legends"] .btn-primary:hover {
  box-shadow: var(--glow-primary);
  transform: scale(var(--hover-scale));
}

html[data-theme="anime-soccer-legends"] .ranking-gold,
html[data-theme="anime-soccer-legends"] .ranking-top,
html[data-theme="anime-soccer-legends"] .prediction-chip {
  box-shadow: var(--glow-yellow);
}

html[data-theme="anime-soccer-legends"] .goal-animation {
  animation: goalExplosion var(--motion-duration-hero) var(--motion-ease-emphasized);
}

html[data-theme="anime-soccer-legends"] .achievement-badge {
  animation: pulseHero var(--motion-duration-slow) var(--motion-ease-emphasized) infinite alternate;
}

@keyframes goalExplosion {
  0% {
    transform: scale(var(--active-scale));
    box-shadow: var(--glow-primary);
  }

  60% {
    transform: scale(var(--hover-scale));
    box-shadow: var(--glow-yellow);
  }

  100% {
    transform: scale(1);
    box-shadow: var(--shadow-md);
  }
}

@keyframes pulseHero {
  from {
    box-shadow: var(--shadow-sm);
  }

  to {
    box-shadow: var(--glow-orange);
  }
  /* ========================= 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);
}