:root {
  --color-bg: #140604;
  --color-bg-2: #230707;
  --color-surface: rgba(55, 13, 13, 0.72);
  --color-surface-strong: rgba(42, 9, 9, 0.96);
  --color-surface-soft: rgba(82, 18, 18, 0.48);
  --color-border: rgba(197, 150, 82, 0.35);
  --color-border-strong: rgba(220, 181, 110, 0.68);
  --color-text: #f4deba;
  --color-text-soft: rgba(244, 222, 186, 0.82);
  --color-text-muted: rgba(244, 222, 186, 0.58);
  --color-accent: #d9b06c;
  --color-accent-strong: #f2cd89;
  --color-accent-deep: #8f5a1d;
  --color-shadow: rgba(0, 0, 0, 0.38);
  --color-overlay: rgba(16, 0, 0, 0.65);
  --gradient-gold: linear-gradient(135deg, #f3ddb2 0%, #d3a45d 45%, #a86f2d 100%);
  --gradient-button: linear-gradient(135deg, #d8b57b 0%, #bb8544 100%);
  --gradient-panel: linear-gradient(180deg, rgba(69, 18, 18, 0.94) 0%, rgba(37, 8, 8, 0.94) 100%);
  --gradient-section: linear-gradient(180deg, rgba(74, 8, 10, 0.92) 0%, rgba(18, 4, 4, 0.98) 100%);
  --font-display: "Noto Serif SC", "Source Han Serif SC", "Songti SC", serif;
  --font-body: "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", sans-serif;
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 5.5rem;
  --radius-sm: 0.875rem;
  --radius-md: 1rem;
  --radius-lg: 1.5rem;
  --radius-pill: 999px;
  --shadow-soft: 0 1.25rem 3rem rgba(0, 0, 0, 0.24);
  --shadow-glow: 0 0 0 1px rgba(222, 180, 102, 0.14), 0 1.5rem 3.5rem rgba(0, 0, 0, 0.34);
  --shadow-gold: 0 0 2rem rgba(223, 175, 92, 0.22);
  --container-max: 1380px;
  --z-header: 30;
  --z-floating: 40;
  --transition-base: 220ms ease;
  --transition-slow: 420ms ease;
}

@media (max-width: 768px) {
  :root {
    --space-2xl: 2.5rem;
    --space-3xl: 3.5rem;
    --space-4xl: 4rem;
  }
}