/* SPA→静态视觉桥 · copper-studio 铜锈工作室 */
:root {
  --pink: #d4a574;
  --blue: #b87333;
  --brand: #d4a574;
  --accent: #b87333;
  --portal-accent: #b87333;
  --copper: #b87333;
  --copper-light: #d4a574;
  --copper-dim: rgba(184, 115, 51, 0.14);
  --brick: #b87333;
  --brick-dim: rgba(184, 115, 51, 0.18);
  --sand: #d4cfc4;
  --bg: #1a1209;
  --surface: #231810;
  --surface-2: #2a1f14;
  --text: #d4cfc4;
  --muted: #8a8175;
  --card: #2a1f14;
  --header-bg: #1a1209;
  --body-bg: #1a1209;
  color-scheme: dark;
}

html,
body {
  background: #1a1209 !important;
  color: #d4cfc4 !important;
}

body,
.page,
.site-wrap,
.app-shell,
.layout,
.main-wrap,
#app,
.page-main {
  background: #1a1209 !important;
  color: #d4cfc4 !important;
}

body.body-tpl-cinema {
  background-image:
    radial-gradient(55% 45% at 50% -5%, rgba(184, 115, 51, 0.1), transparent 62%),
    radial-gradient(40% 38% at 100% 8%, rgba(184, 115, 51, 0.06), transparent 68%),
    linear-gradient(180deg, #14100a, #1a1209 38%, #231810) !important;
}

.site-header,
.header,
.topbar,
.nav-bar,
.header-main,
.portal-header,
header.site-header,
.header-bar,
.sj-head {
  background: color-mix(in srgb, #1a1209 92%, #231810) !important;
  border-bottom-color: color-mix(in srgb, #b87333 22%, transparent) !important;
  color: #d4cfc4 !important;
}

.brand-text,
.brand-mark,
.site-brand,
.logo-text,
.header-brand__title,
.site-title,
.brand a,
.sj-head__brand-text,
.sj-head__title {
  color: #d4a574 !important;
}

.sj-head__tagline {
  color: #8a8175 !important;
}

.main-nav a,
.header-main-nav__link,
.nav a,
.site-nav a,
.sj-head__nav-link {
  color: #8a8175 !important;
}

.main-nav a:hover,
.main-nav a[aria-current="page"],
.header-main-nav__link:hover,
.header-main-nav__link[aria-current="page"],
.nav a:hover,
.nav a.active,
.sj-head__nav-link:hover {
  color: #d4a574 !important;
}

.sj-head__nav-link--active {
  color: #d4a574 !important;
  background: rgba(184, 115, 51, 0.12) !important;
  border-color: rgba(184, 115, 51, 0.28) !important;
}

.nav-search button,
.btn-primary,
.hero-actions .btn:first-child,
button[type="submit"],
.primary-btn,
.btn-accent,
.sj-head__search-btn {
  background: #b87333 !important;
  border-color: transparent !important;
  color: #1a1209 !important;
}

.sj-head__search-input {
  background: rgba(35, 24, 16, 0.9) !important;
  border-color: rgba(168, 159, 143, 0.16) !important;
  color: #d4cfc4 !important;
}

.sj-head__search-input:focus {
  border-color: rgba(184, 115, 51, 0.4) !important;
}

.card,
.movie-card,
.poster-card,
.grid-card,
.media-card,
.item-card,
.sj-movie-card__cover {
  background: #2a1f14 !important;
  border-color: color-mix(in srgb, #d4cfc4 10%, transparent) !important;
  color: #d4cfc4 !important;
}

.section-title,
h1,
h2,
h3,
.home-h1,
.page-title,
.sj-home__title,
.sj-channel__title {
  color: #d4cfc4 !important;
}

.footer,
.site-footer,
footer,
.sj-footer {
  background: linear-gradient(180deg, rgba(35, 24, 16, 0.6), #1a1209 40%, #14100a) !important;
  color: #8a8175 !important;
  border-top-color: rgba(184, 115, 51, 0.14) !important;
}

.sj-footer__tag {
  background: rgba(35, 24, 16, 0.8) !important;
  border-color: rgba(168, 159, 143, 0.14) !important;
  color: #8a8175 !important;
}

.sj-footer__tag:hover {
  color: #d4a574 !important;
  border-color: rgba(184, 115, 51, 0.3) !important;
}

a {
  color: #d4a574;
}

.sj-home__eyebrow,
.sj-channel__eyebrow {
  color: #d4a574 !important;
}

.sj-movie-card__badge,
.card-badge {
  background: #b87333 !important;
  color: #1a1209 !important;
}

.sj-movie-card--top1 .sj-movie-card__rank,
.sj-home__podium-rank--1,
.sj-hot-rank__item--top1 .sj-hot-rank__num,
.rank-badge {
  background: linear-gradient(135deg, #d4a574, #b87333) !important;
  color: #1a1209 !important;
}

.sj-head__logo,
.sj-footer__logo-mark {
  background: linear-gradient(135deg, #d4a574, #b87333) !important;
}

.sj-head__login {
  color: #8a8175 !important;
}

.sj-head__login:hover {
  color: #d4a574 !important;
}

.sj-footer__seo {
  color: #8a8175 !important;
}

.sj-footer__col-title {
  color: #d4cfc4 !important;
}

.sj-footer__links a {
  color: #8a8175 !important;
}

.sj-footer__links a:hover {
  color: #d4a574 !important;
}
