:root {
  --theme-color-scheme: light;
  --font-family-base: "Segoe UI", Tahoma, sans-serif;

  /* Hex colors */
  --color-body-gradient-start: #1f5d77;
  --color-body-gradient-end: #0a1c26;
  --color-text-primary: #f3f9fb;
  --color-text-secondary: #f5f7fa;
  --color-text-muted: #92a9b8;
  --color-text-subtle: #a7c3d3;
  --color-text-section-heading: #eef6fb;
  --color-text-highlight: #f4fbff;
  --color-text-soft: #f7f8f9;
  --color-text-info: #c8d7e2;
  --color-text-inverse: #0d2330;
  --color-text-on-accent: #102030;
  --color-text-contrast: #1b2836;
  --color-text-suit-black: #101820;
  --color-text-gold: #fbedb5;
  --color-text-creator: #fff8e7;
  --color-text-error: #ffb3b3;
  --color-text-error-soft: #ff9b9b;
  --color-text-button-secondary: #f2f7fb;

  --color-accent: #f5931e;
  --color-accent-warm: #f2a01a;
  --color-accent-soft: #ffce54;
  --color-black-theme-red: #ec4141;
  --color-warning: #f7c65f;
  --color-gold: #f8c537;
  --color-success: #1e9d5a;
  --color-success-text: #62d26f;
  --color-success-muted: #7de2a8;
  --color-status-online: #3fe381;
  --color-danger: #c32025;
  --color-card-border: #e2e6e9;
  --color-card-face-text: #000000;
  --color-creator-mid: #fffbe6;
  --color-white: #ffffff;
  --surface-translucent: rgba(255, 255, 255, 0.12);
  --surface-border-translucent: rgba(255, 255, 255, 0.18);
  --surface-translucent-strong: rgba(255, 255, 255, 0.2);

  /* RGB channels */
  --rgb-white: 255, 255, 255;
  --rgb-black: 0, 0, 0;
  --rgb-navy-900: 8, 28, 40;
  --rgb-navy-880: 10, 28, 40;
  --rgb-navy-850: 12, 32, 45;
  --rgb-navy-800: 15, 35, 48;
  --rgb-navy-780: 15, 37, 50;
  --rgb-navy-700: 15, 44, 60;
  --rgb-navy-invited: 38, 89, 110;
  --rgb-muted-blue: 136, 166, 199;
  --rgb-page-light: 243, 249, 251;
  --rgb-accent: 245, 147, 30;
  --rgb-accent-deep: 242, 160, 26;
  --rgb-accent-muted: 244, 166, 35;
  --rgb-black-theme-red: 236, 65, 65;
  --rgb-gold: 248, 197, 55;
  --rgb-amber-bright: 255, 174, 67;
  --rgb-amber-soft: 255, 186, 73;
  --rgb-amber-glow: 255, 195, 96;
  --rgb-amber-light: 255, 210, 128;
  --rgb-amber-pale: 255, 212, 117;
  --rgb-success: 30, 157, 90;
  --rgb-success-soft: 83, 185, 131;
  --rgb-success-glow: 63, 227, 129;
  --rgb-success-border: 98, 210, 144;
  --rgb-info: 90, 200, 250;
  --rgb-danger: 195, 32, 37;
  --rgb-danger-soft: 255, 143, 143;
  --rgb-uncommon-border: 106, 191, 143;
  --rgb-rare-primary: 74, 144, 226;
  --rgb-rare-secondary: 143, 198, 255;
  --rgb-rare-ambient: 192, 212, 242;
  --rgb-epic-primary: 164, 75, 255;
  --rgb-epic-secondary: 172, 146, 255;
  --rgb-epic-glow: 217, 164, 255;
  --rgb-epic-border: 176, 92, 255;
  --rgb-mythic-pulse: 255, 39, 72;
  --rgb-mythic-flare: 255, 94, 98;
  --rgb-fuchsia-glow: 255, 94, 188;
  --rgb-mythic-border: 255, 47, 61;
  --rgb-legendary-border: 255, 198, 73;
  --rgb-uncommon-secondary: 160, 224, 194;

  /* Rarity palette */
  --rarity-common-primary: #88a6c7;
  --rarity-common-secondary: #c0d4f2;
  --rarity-common-border: rgba(var(--rgb-white), 0.06);
  --rarity-common-text: #eaf2ff;
  --rarity-common-gradient: linear-gradient(90deg, var(--rarity-common-primary) 0%, var(--rarity-common-secondary) 100%);

  --rarity-uncommon-primary: #53b983;
  --rarity-uncommon-secondary: #a0e0c2;
  --rarity-uncommon-border: rgba(var(--rgb-uncommon-border), 0.35);
  --rarity-uncommon-text: #e7fff0;
  --rarity-uncommon-gradient: linear-gradient(90deg, var(--rarity-uncommon-primary) 0%, var(--rarity-uncommon-secondary) 100%);

  --rarity-rare-primary: #4a90e2;
  --rarity-rare-secondary: #8fc6ff;
  --rarity-rare-border: rgba(var(--rgb-rare-primary), 0.4);
  --rarity-rare-text: #e7f2ff;
  --rarity-rare-gradient: linear-gradient(90deg, var(--rarity-rare-primary) 0%, var(--rarity-rare-secondary) 100%);

  --rarity-epic-primary: #a44bff;
  --rarity-epic-secondary: #d9a4ff;
  --rarity-epic-border: rgba(var(--rgb-epic-border), 0.5);
  --rarity-epic-text: #f7efff;
  --rarity-epic-gradient: linear-gradient(90deg, var(--rarity-epic-primary) 0%, var(--rarity-epic-secondary) 100%);

  --rarity-legendary-primary: #f4a623;
  --rarity-legendary-secondary: #ffd475;
  --rarity-legendary-border: rgba(var(--rgb-legendary-border), 0.6);
  --rarity-legendary-text: #fff6de;
  --rarity-legendary-gradient: linear-gradient(90deg, var(--rarity-legendary-primary) 0%, var(--rarity-legendary-secondary) 100%);

  --rarity-mythic-primary: #ff2748;
  --rarity-mythic-secondary: #ff8f8f;
  --rarity-mythic-border: rgba(var(--rgb-mythic-border), 0.65);
  --rarity-mythic-text: #ffe6ea;
  --rarity-mythic-gradient: linear-gradient(90deg, var(--rarity-mythic-primary) 0%, var(--rarity-mythic-secondary) 100%);

  /* Title gradients use the default theme palette across all themes */
  --title-base-gradient: linear-gradient(90deg, rgba(136, 166, 199, 0.15) 0%, rgba(192, 212, 242, 0.22) 100%);
  --title-base-glow: rgba(136, 166, 199, 0.25);
  --title-common-gradient: linear-gradient(90deg, rgba(136, 166, 199, 0.22) 0%, rgba(192, 212, 242, 0.34) 100%);
  --title-common-glow: rgba(136, 166, 199, 0.25);
  --title-uncommon-gradient: linear-gradient(90deg, rgba(83, 185, 131, 0.26) 0%, rgba(160, 224, 194, 0.4) 100%);
  --title-uncommon-glow: rgba(83, 185, 131, 0.28);
  --title-rare-gradient: linear-gradient(90deg, rgba(74, 144, 226, 0.26) 0%, rgba(143, 198, 255, 0.4) 100%);
  --title-rare-glow: rgba(74, 144, 226, 0.3);
  --title-epic-gradient: linear-gradient(90deg, rgba(164, 75, 255, 0.28) 0%, rgba(217, 164, 255, 0.42) 100%);
  --title-epic-glow: rgba(164, 75, 255, 0.35);
  --title-legendary-gradient: linear-gradient(90deg, rgba(244, 166, 35, 0.3) 0%, rgba(255, 212, 117, 0.46) 100%);
  --title-legendary-glow: rgba(244, 166, 35, 0.42);
  --title-mythic-gradient: linear-gradient(90deg, rgba(255, 39, 72, 0.32) 0%, rgba(255, 143, 143, 0.48) 100%);
  --title-mythic-glow: rgba(255, 39, 72, 0.4);
}