/* SPA→静态视觉桥 · forest-moss 苔原纪录片 · 骨架布局保留 */
:root {
  --fm-bg: #e8efe6;
  --fm-bg-alt: #dfe8db;
  --fm-surface: #f6faf4;
  --fm-surface-hover: #eef4ea;
  --fm-ink: #2a3d32;
  --fm-muted: #5f7264;
  --fm-moss: #4a7c59;
  --fm-moss-dim: #3d6b4a;
  --fm-amber: #c9933a;
  --fm-amber-dim: #a87a2e;
  --fm-line: rgba(42, 61, 50, 0.1);
  --pink: var(--fm-moss);
  --blue: var(--fm-moss);
  --brand: var(--fm-moss);
  --accent: var(--fm-moss);
  --portal-accent: var(--fm-moss);
  --bg: var(--fm-bg);
  --surface: var(--fm-surface);
  --text: var(--fm-ink);
  --muted: var(--fm-muted);
  --card: var(--fm-surface);
  --header-bg: var(--fm-surface);
  --body-bg: var(--fm-bg);
  color-scheme: light;
}

html,
body {
  background: var(--fm-bg) !important;
  color: var(--fm-ink) !important;
}

body,
.page,
.site-wrap,
.app-shell,
.layout,
.main-wrap,
.page-main,
#app {
  background: var(--fm-bg) !important;
  color: var(--fm-ink) !important;
}

.site-header,
.header,
.topbar,
.nav-bar,
header.bg-white,
header.site-header,
.header-bar {
  background: color-mix(in srgb, var(--fm-surface) 94%, var(--fm-bg)) !important;
  border-bottom: 1px solid var(--fm-line) !important;
  box-shadow: 0 2px 16px rgba(42, 61, 50, 0.06) !important;
  color: var(--fm-ink) !important;
}

.brand-text,
.brand-mark,
.site-brand,
.logo-text,
.header-brand__title,
.site-title,
.brand a,
header .text-xl.font-bold {
  color: var(--fm-moss-dim) !important;
}

header svg.text-blue-600,
header .text-blue-600 {
  color: var(--fm-moss) !important;
}

header .bg-red-500 {
  background: var(--fm-amber) !important;
}

.main-nav a,
.header-main-nav__link,
nav a,
.site-nav a {
  color: var(--fm-muted) !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,
.hover\:text-blue-600:hover {
  color: var(--fm-moss-dim) !important;
}

header input[type="search"],
.nav-search input {
  background: var(--fm-bg) !important;
  border-color: var(--fm-line) !important;
  color: var(--fm-ink) !important;
}

header input[type="search"]::placeholder {
  color: var(--fm-muted) !important;
}

.nav-search button,
.btn-primary,
.hero-actions .btn:first-child,
button[type="submit"],
.primary-btn,
.btn-accent {
  background: linear-gradient(135deg, var(--fm-moss), var(--fm-moss-dim)) !important;
  border-color: transparent !important;
  color: #fff !important;
}

.card,
.movie-card,
.poster-card,
.grid-card,
.media-card,
.item-card,
.bg-white,
.rounded-lg.shadow-sm {
  background: var(--fm-surface) !important;
  border-color: var(--fm-line) !important;
  color: var(--fm-ink) !important;
}

.bg-gray-50,
.min-h-screen.bg-gray-50 {
  background: var(--fm-bg) !important;
}

.min-h-screen.bg-black,
.bg-black {
  background: #1a241c !important;
}

.section-title,
h1,
h2,
h3,
.home-h1,
.page-title,
.text-gray-900 {
  color: var(--fm-ink) !important;
}

.text-gray-700,
.text-gray-600,
.text-gray-500,
.text-gray-400,
.text-gray-300 {
  color: var(--fm-muted) !important;
}

.text-blue-500,
.text-blue-600,
.text-blue-400,
.text-blue-300,
.text-blue-100,
.text-sky-300 {
  color: var(--fm-moss) !important;
}

.bg-gradient-to-r.from-blue-600,
.bg-gradient-to-l.from-blue-600,
.bg-gradient-to-r.from-blue-600.to-purple-600,
section.bg-gradient-to-r {
  background: linear-gradient(135deg, var(--fm-surface), var(--fm-bg-alt)) !important;
  color: var(--fm-ink) !important;
}

.via-purple-600,
.to-pink-600,
.to-purple-600 {
  --tw-gradient-stops: var(--tw-gradient-from), var(--fm-bg-alt), var(--fm-surface) !important;
}

.from-blue-50.to-purple-50,
.hover\:from-blue-100.hover\:to-purple-100,
.bg-gradient-to-br.from-blue-50 {
  background: var(--fm-surface) !important;
}

.footer,
.site-footer,
footer,
footer.bg-gray-900 {
  background: linear-gradient(180deg, var(--fm-moss-dim), #243528) !important;
  border-top: 1px solid color-mix(in srgb, var(--fm-moss) 40%, transparent) !important;
  color: rgba(255, 255, 255, 0.82) !important;
}

footer .text-gray-300,
footer .text-gray-400,
footer .text-gray-500 {
  color: rgba(255, 255, 255, 0.72) !important;
}

footer h3.text-blue-300,
footer .text-sky-300 {
  color: var(--fm-amber) !important;
}

footer a,
.footer-inner a {
  color: color-mix(in srgb, #fff 85%, var(--fm-amber)) !important;
}

footer a:hover {
  color: var(--fm-amber) !important;
}

footer .border-gray-800 {
  border-color: rgba(255, 255, 255, 0.12) !important;
}

a {
  color: var(--fm-moss);
}

.group-hover\:visible + div,
.absolute.bg-white.rounded-md,
.group .absolute.bg-white {
  background: var(--fm-surface) !important;
  border: 1px solid var(--fm-line) !important;
  box-shadow: 0 8px 24px rgba(42, 61, 50, 0.12) !important;
}

.hover\:bg-blue-50:hover {
  background: var(--fm-surface-hover) !important;
}

.fixed.inset-0.overflow-hidden.pointer-events-none,
.animate-blob,
.bg-blue-400.rounded-full,
.bg-purple-400.rounded-full,
.bg-pink-400.rounded-full {
  display: none !important;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--fm-bg);
}

::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--fm-moss) 45%, var(--fm-bg-alt));
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--fm-moss);
}

button:focus,
input:focus,
select:focus,
textarea:focus,
.focus\:ring-blue-500:focus {
  outline-color: var(--fm-moss) !important;
  --tw-ring-color: rgb(74 124 89 / 0.35) !important;
}

.shadow-lg {
  box-shadow: 0 4px 20px rgba(42, 61, 50, 0.08) !important;
}