/* Angels identity. The source layouts, type, photographs and spacing stay intact. */
:root {
  --angels-black: #0e0d0b;
  --angels-charcoal: #171510;
  --angels-surface: #242119;
  --angels-panel: #3c3020;
  --angels-gold: #d3b477;
  --angels-yellow: #f4cd67;
  --angels-orange: #e7973f;
  --angels-bronze: #795322;
  --angels-paper: #f8f3e9;
  --angels-cream: #efe3cd;
  --angels-sand: #e0cfaf;
  --angels-muted: #c5b99f;
  --angels-muted-dark: #74664f;
  --angels-black-rgb: 14 13 11;
  --angels-charcoal-rgb: 23 21 16;
  --angels-surface-rgb: 36 33 25;
  --angels-panel-rgb: 60 48 32;
  --angels-gold-rgb: 211 180 119;
  --angels-yellow-rgb: 244 205 103;
  --angels-orange-rgb: 231 151 63;
  --angels-bronze-rgb: 121 83 34;
  --angels-paper-rgb: 248 243 233;
  --angels-cream-rgb: 239 227 205;
  --angels-sand-rgb: 224 207 175;
  --angels-muted-rgb: 197 185 159;
  --angels-muted-dark-rgb: 116 102 79;
}

/* PSG's source utilities read their palette as comma-separated RGB channels. */
html[data-angels-theme="psg"] {
  --neutral-2: 253, 250, 245;
  --neutral-5: 248, 243, 233;
  --neutral-10: 239, 227, 205;
  --neutral-13: 232, 217, 190;
  --neutral-20: 224, 207, 175;
  --neutral-40: 183, 162, 126;
  --neutral-60: 116, 102, 79;
  --neutral-80: 153, 132, 98;
  --bleu-paris: 121, 83, 34;
  --or-paris: 211, 180, 119;
  --rouge-paris: 231, 151, 63;
  --red-20: 249, 223, 185;
  --dark-red: 121, 69, 25;
  --darkest-red: 49, 31, 15;
  --dark-blue: 14, 13, 11;
  --background-blue: 23, 21, 16;
  --dark-gold: 121, 83, 34;
  --bleu-premium: 36, 33, 25;
  --bleu-second-1: 36, 33, 25;
  --bleu-second-2: 121, 83, 34;
  --bleu-hero: 157, 104, 37;
  --cold-blue: 60, 48, 32;
  --bright-silver: 250, 247, 240;
  --light-silver: 239, 227, 205;
  --cold-grey: 224, 207, 175;
}

html[data-angels-theme="team-vitality"] {
  --color-highlight: 244, 205, 103;
  --color-keyboard-focus: 231, 151, 63;
  --color-shadow: 211, 180, 119;
}

html[data-angels-theme="aman"] .main-header__right .button,
html[data-angels-theme="aman"] .button--dark,
html[data-angels-theme="aman"] .button--charcoal {
  background-color: var(--angels-gold);
  border-color: var(--angels-gold);
  color: var(--angels-charcoal);
}
html[data-angels-theme="aman"] .main-header__right .button:hover,
html[data-angels-theme="aman"] .button--dark:hover,
html[data-angels-theme="aman"] .button--charcoal:hover {
  background-color: var(--angels-orange);
  border-color: var(--angels-orange);
  color: var(--angels-charcoal);
}

.club-study .club-hero__content .meta,
.club-study .hero-slide-label,
.club-study .club-tv .meta {
  color: var(--angels-gold);
}
.club-study .club-result {
  background: var(--angels-paper);
  color: var(--angels-charcoal);
}
.club-study .club-result strong {
  color: var(--angels-bronze);
}
.club-study .club-result .meta,
.club-study .club-result > span:last-child {
  color: var(--angels-muted-dark);
}
.club-study .club-team {
  background: var(--angels-cream);
}
.club-study .club-footer__name {
  color: var(--angels-gold);
}

.arena-study {
  --gold: var(--angels-gold);
  --yellow: var(--angels-yellow);
}
.arena-study .arena-ticker span:nth-child(even),
.arena-study .arena-tv__copy .meta {
  color: var(--angels-orange);
}
.arena-study .filter-tabs button.active {
  background: var(--angels-orange);
  border-color: var(--angels-orange);
  color: var(--angels-charcoal);
}
.arena-study .arena-roster {
  background: var(--angels-paper);
}
.arena-study .arena-footer {
  background: var(--angels-gold);
}

.editorial-study {
  background: var(--angels-paper);
  color: var(--angels-charcoal);
}
.editorial-study .editorial-header .study-nav {
  background: var(--angels-paper);
  color: var(--angels-charcoal);
}
.editorial-study .editorial-header .action,
.editorial-study .editorial-tv .action {
  background: var(--angels-gold);
  color: var(--angels-charcoal);
}
.editorial-study .editorial-header .action:hover,
.editorial-study .editorial-tv .action:hover {
  background: var(--angels-orange);
}
.editorial-study .editorial-intro .meta,
.editorial-study .editorial-card .meta,
.editorial-study .editorial-tv .meta,
.editorial-study .editorial-close .meta {
  color: var(--angels-bronze);
}
.editorial-study .editorial-tv {
  background: var(--angels-cream);
}
.editorial-study .editorial-footer {
  background: var(--angels-charcoal);
  color: var(--angels-paper);
}
.editorial-study .editorial-footer .brand-word,
.editorial-study .editorial-footer .footer-links {
  color: var(--angels-gold);
}

.action:hover {
  background-color: var(--angels-orange);
  color: var(--angels-charcoal);
}
::selection {
  background: var(--angels-yellow);
  color: var(--angels-charcoal);
}
