:root {
  /* Global palette */
  --color-bg-0: #080c10;
  --color-bg-1: #111820;
  --color-bg-2: #1a2228;
  --color-bg-3: #233035;
  --color-text-strong: #fff4db;
  --color-text: #efe4d1;
  --color-text-soft: rgba(239, 228, 209, 0.78);
  --color-text-muted: rgba(239, 228, 209, 0.56);
  --color-ink: #17130e;
  --color-gold: #d1a15d;
  --color-cyan: #6fb0bb;
  --color-stone: #a7ae99;
  --color-danger: #d36f5d;
  --color-success: #8fbf82;

  /* Backwards-compatible aliases used by the existing components */
  --bg-0: var(--color-bg-0);
  --bg-1: var(--color-bg-1);
  --bg-2: var(--color-bg-2);
  --paper: var(--color-text);
  --paper-soft: var(--color-text-soft);
  --ink: var(--color-ink);
  --line: rgba(239, 228, 209, 0.2);
  --line-strong: rgba(239, 228, 209, 0.42);

  --accent-main: var(--color-gold);
  --accent-lingnan: #d08a45;
  --accent-maritime: #69a8b2;
  --accent-rational: #aab199;

  --font-display: "Noto Serif SC", "STSong", "Songti SC", "SimSun", serif;
  --font-body: "Noto Serif SC", "Source Han Serif SC", "STSong", serif;

  --text-xxl: clamp(2rem, 4.6vw, 3.7rem);
  --text-xl: clamp(1.5rem, 2.5vw, 2.3rem);
  --text-lg: 1.15rem;
  --text-md: 1rem;
  --text-sm: 0.86rem;

  --space-1: 0.5rem;
  --space-2: 0.8rem;
  --space-3: 1.2rem;
  --space-4: 1.8rem;
  --space-5: 2.6rem;
  --space-6: 3.6rem;

  --radius-sm: 0.375rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.5rem;
  --radius-xl: 0.5rem;

  --border-glass: rgba(239, 228, 209, 0.18);
  --border-bright: rgba(255, 244, 219, 0.36);
  --glass-weak: rgba(239, 228, 209, 0.04);
  --glass-mid: rgba(239, 228, 209, 0.075);
  --glass-strong: rgba(239, 228, 209, 0.12);
  --blur-panel: 18px;

  --shadow-soft: 0 12px 34px rgba(0, 0, 0, 0.26);
  --shadow-deep: 0 18px 62px rgba(0, 0, 0, 0.4);
  --shadow-panel: 0 22px 58px rgba(2, 6, 10, 0.42);
  --shadow-glow: 0 0 28px color-mix(in srgb, var(--bridge-accent, var(--color-gold)) 28%, transparent);
  --shadow-inner-line: inset 0 0 0 1px rgba(255, 244, 219, 0.06);

  --container: min(1180px, 92vw);
  --nav-h: 84px;

  --easing: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft: cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur-fast: 180ms;
  --dur-mid: 320ms;
  --dur-slow: 720ms;

  /* Scene tokens */
  --bridge-accent: var(--color-gold);
  --bridge-accent-soft: rgba(209, 161, 93, 0.2);
  --bridge-bg-from: #0d1218;
  --bridge-bg-to: #182128;
  --bridge-glow: rgba(209, 161, 93, 0.28);
  --bridge-texture: linear-gradient(135deg, rgba(255, 244, 219, 0.035), transparent 38%);
  --nav-surface: rgba(8, 12, 16, 0.78);
  --panel-surface: linear-gradient(160deg, rgba(239, 228, 209, 0.078), rgba(239, 228, 209, 0.035));
  --tag-surface: rgba(239, 228, 209, 0.065);
  --timeline-axis: color-mix(in srgb, var(--bridge-accent) 42%, rgba(239, 228, 209, 0.22));
  --button-primary-bg: linear-gradient(145deg, color-mix(in srgb, var(--bridge-accent) 88%, #f7dfad), color-mix(in srgb, var(--bridge-accent) 62%, #2f2922));

  /* Finale tokens */
  --finale-bg-deep: #06070a;
  --finale-bg-mid: #10131a;
  --finale-ink: rgba(224, 216, 197, 0.92);
  --finale-muted: rgba(192, 180, 154, 0.62);
  --finale-gold: #b79a63;
  --finale-copper: #8b6a44;
  --finale-river: rgba(123, 147, 184, 0.32);
  --finale-mist: rgba(255, 255, 255, 0.05);
  --finale-grain: rgba(255, 245, 220, 0.03);

  --finale-title-max: 120px;
  --finale-title-min: 48px;
  --finale-body-max-width: 960px;

  --finale-depth-1: 8px;
  --finale-depth-2: 18px;
  --finale-depth-3: 36px;

  --finale-section-min-height: 180vh;
}

body[data-theme="guangji"],
.theme-guangji,
.theme-lingnan {
  --bridge-accent: #d08a45;
  --bridge-accent-soft: rgba(208, 138, 69, 0.22);
  --bridge-bg-from: #09111a;
  --bridge-bg-to: #241913;
  --bridge-glow: rgba(208, 138, 69, 0.34);
  --bridge-texture: radial-gradient(80% 60% at 12% 15%, rgba(255, 190, 104, 0.11), transparent 58%);
}

body[data-theme="luoyang"],
.theme-luoyang,
.theme-maritime {
  --bridge-accent: #69a8b2;
  --bridge-accent-soft: rgba(105, 168, 178, 0.22);
  --bridge-bg-from: #071319;
  --bridge-bg-to: #172b31;
  --bridge-glow: rgba(105, 168, 178, 0.32);
  --bridge-texture: radial-gradient(70% 60% at 86% 12%, rgba(116, 201, 214, 0.11), transparent 58%);
}

body[data-theme="zhaozhou"],
.theme-zhaozhou,
.theme-rational {
  --bridge-accent: #aab199;
  --bridge-accent-soft: rgba(170, 177, 153, 0.2);
  --bridge-bg-from: #0d1114;
  --bridge-bg-to: #22272a;
  --bridge-glow: rgba(185, 191, 166, 0.24);
  --bridge-texture: radial-gradient(68% 54% at 54% 0%, rgba(228, 234, 210, 0.1), transparent 60%);
}