/* PC chrome overrides for Figma 45557:22204 / 45278:18690.
   Loaded from page templates so it can beat header.css without editing that file. */
@media (min-width: 769px) {
  html body.pc-content-page,
  html body.desktop-search-page,
  html body.person-center-page {
    --pc-accent: var(--color-brand-primary);
    --color-primary-500: var(--color-brand-primary);
    --color-primary-alpha-10: rgba(var(--color-brand-primary-rgb), 0.12);
  }

  html body .site-header {
    --color-primary-500: var(--color-brand-primary);
    --color-primary-alpha-10: rgba(var(--color-brand-primary-rgb), 0.12);
    background: #0e1012;
    border-bottom-color: #ffffff1a;
  }

  html body .site-header__logo-wrap:focus-visible {
    box-shadow: 0 3px 0 var(--color-brand-primary);
  }

  html body .site-header__desktop-nav {
    gap: 32px;
  }

  html body .site-header__desktop-nav-item {
    color: #ffffff8c;
    font-size: 18px;
    line-height: 24px;
  }

  html body a.site-header__desktop-nav-item:hover,
  html body a.site-header__desktop-nav-item:focus-visible,
  html body .site-header__desktop-nav-item.is-active {
    color: var(--color-brand-primary);
  }

  html body .site-header__desktop-nav-item.is-active::after {
    bottom: -11px;
    width: 34px;
    height: 4px;
    border-radius: 12px;
    background: var(--color-brand-primary);
  }

  html body .site-header .site-header__search {
    flex: 0 1 242px;
    width: 242px;
    min-width: 0;
    min-height: 40px;
    height: 40px;
    box-sizing: border-box;
    padding: 10px 18px;
    background: #303030;
    border-color: transparent;
  }

  html body .site-header .site-header__search-input,
  html body .site-header .site-header__search-input::placeholder {
    color: #ffffff8c;
  }

  html body .site-header__right {
    gap: 16px;
  }

  html body .site-header__desktop-download {
    box-sizing: border-box;
    height: 36px;
    padding: 4px 12px;
    border-radius: 100px;
    background: var(--color-brand-primary);
    color: var(--color-brand-secondary);
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    gap: 4px;
  }

  html body .site-header__desktop-download:hover,
  html body .site-header__desktop-download:focus-visible {
    color: var(--color-brand-secondary);
  }

  html body .site-header__download-icon {
    filter: brightness(0);
  }

  html body .site-header__desktop-coins {
    min-width: 83px;
    height: 36px;
    padding: 4px 12px;
    border: 1px solid var(--color-brand-primary);
    border-radius: 100px;
    background: rgba(var(--color-brand-primary-rgb), 0.1490196078);
    color: var(--color-brand-primary);
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
  }

  html body .site-header__desktop-member {
    min-width: 116px;
    height: 36px;
    padding: 4px 12px;
    gap: 4px;
    border-radius: 100px;
    background: linear-gradient(162.76deg, #ffe580 0%, #facc15 100%);
    color: #694923;
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
  }
}

@media (min-width: 769px) and (max-width: 1250px) {
  html body .site-header__desktop-nav { gap: 28px; }
  html body .site-header .site-header__search { width: 190px; }
  html body .site-header__desktop-download span { display: none; }
  html body .site-header__desktop-member { min-width: 108px; padding-inline: 9px; }
}

@media (min-width: 769px) and (max-width: 940px) {
  html body .site-header__desktop-coins { display: none; }
  html body .site-header__desktop-nav { gap: 20px; }
}

/* Search page 45785:269563 — override desktop-search.css gold leftovers. */
@media (min-width: 769px) {
  html body.desktop-search-page,
  html body.desktop-search-page .desktop-search-main {
    background: #010406;
  }

  html body.desktop-search-page .desktop-search-field {
    height: 44px;
    padding: 0 13px;
    border: 1px solid #ffffff1a;
    background: #ffffff1a;
  }

  html body.desktop-search-page .desktop-search-field input:-webkit-autofill,
  html body.desktop-search-page .desktop-search-field input:-webkit-autofill:hover,
  html body.desktop-search-page .desktop-search-field input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #1a1b1e inset;
  }

  html body.desktop-search-page .desktop-search-form button[type="submit"] {
    width: 96px;
    height: 44px;
    padding: 11px 32px;
    border-radius: 999px;
    background: var(--color-brand-primary);
    color: #fff;
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
  }

  html body.desktop-search-page .desktop-search-hot h2 {
    color: #ffffffe5;
    font-size: 20px;
    font-weight: 500;
    line-height: 28px;
  }

  html body.desktop-search-page .desktop-search-hot__tags {
    min-height: 36px;
    gap: 12px;
  }

  html body.desktop-search-page .desktop-search-hot__tags a {
    flex: 0 0 100px;
    width: 100px;
    height: 36px;
    padding: 8px 12px 8px 16px;
    border-radius: 6px;
    background: #ffffff0d;
    color: #ffffffe5;
    font-size: 14px;
    line-height: 20px;
  }

  html body.desktop-search-page .desktop-search-hot__tags a:hover,
  html body.desktop-search-page .desktop-search-hot__tags a.is-active {
    background: rgba(var(--color-brand-primary-rgb), 0.1490196078);
    color: var(--color-brand-primary);
  }

  html body.desktop-search-page .desktop-search-tabs a {
    color: #ffffff8c;
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
  }

  html body.desktop-search-page .desktop-search-tabs a.is-active {
    color: #fff;
    font-weight: 600;
  }

  html body.desktop-search-page .desktop-search-tabs a.is-active::after {
    width: 16px;
    height: 3px;
    border-radius: 12px;
    background: var(--color-brand-primary);
  }

  html body.desktop-search-page .desktop-search-result-count {
    color: #ffffff8c;
  }

  html body.desktop-search-page .desktop-search-result-count strong {
    color: var(--color-brand-primary);
  }
}

/* Person center 45829:14850 — PC-UI purple replaces leftover gold. */
@media (min-width: 769px) {
  html body.person-center-page {
    background: #010406;
  }

  html body.person-center-page .desktop-profile-user .mobile-profile-user__session[data-session-state="login"] {
    background: var(--color-brand-primary);
    color: #fff;
  }

  html body.person-center-page .desktop-profile-user .mobile-profile-stats:focus-visible,
  html body.person-center-page .mobile-profile-empty button:focus-visible,
  html body.person-center-page .mobile-profile-library button:focus-visible,
  html body.person-center-page .mobile-profile-card__action:focus-visible {
    outline-color: var(--color-brand-primary);
  }

  html body.person-center-page .mobile-profile-library__tabs button.is-active::after {
    background: var(--color-brand-primary);
  }

  html body.person-center-page .mobile-profile-library__filters button {
    background: #ffffff1a;
    color: #ffffff8c;
  }

  html body.person-center-page .mobile-profile-library__filters button.is-active {
    background: var(--color-brand-primary);
    color: #fff;
  }

  html body.person-center-page .mobile-profile-empty button {
    border-color: var(--color-brand-primary);
    color: var(--color-brand-primary);
  }

  html body.person-center-page .mobile-profile-card__action:hover {
    border-color: rgba(var(--color-brand-primary-rgb), 0.62);
  }
}