/* ============================================================
   MacCMS 2025 · Design Tokens
   电影感黑暗设计系统 · 全尺寸流体自适应
   基于: Hoyts · Flicks · TCL BrowseHere · Kaleidescape · Backscreen
   ============================================================ */

:root {
  /* ── 色彩系统 ── */
  --bg-primary: #080810;
  --bg-card: #12121E;
  --bg-surface: #1A1A2A;
  --bg-hover: #1E1E32;

  --gold: #E8A838;
  --gold-dim: #C88820;
  --gold-glow: rgba(232,168,56,0.15);

  --purple: #6B5CE7;
  --purple-dim: #4B3CB0;
  --purple-glow: rgba(107,92,231,0.12);

  --teal: #2DC8A8;
  --red: #E8455A;

  --text-primary: #F0EDE8;
  --text-secondary: #7A788A;
  --text-tertiary: #4D4A5C;

  --border: rgba(255,255,255,0.07);
  --border-em: rgba(255,255,255,0.14);

  /* ── 情绪色板 ── */
  --mood-healing: #E8A070;
  --mood-warm: #D8B850;
  --mood-tear: #D47888;
  --mood-relax: #78B8D0;
  --mood-adrenaline: #E8455A;
  --mood-thriller: #8B6BC0;
  --mood-together: #D8B850;
  --mood-bedtime: #6078A0;
  --mood-deep: #509880;

  /* ── 字体栈 ── */
  --serif: 'Instrument Serif', 'Noto Serif SC', 'STSong', 'SimSun', serif;
  --sans: 'Plus Jakarta Sans', 'PingFang SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;

  /* ── 字阶 (流体) ── */
  --fs-d1: clamp(1.75rem, 5vw, 3.25rem);
  --fs-d2: clamp(1.375rem, 3vw, 2.25rem);
  --fs-h1: clamp(1rem, 2vw, 1.25rem);
  --fs-b1: 0.95rem;
  --fs-c1: 0.8rem;
  --fs-c2: 0.7rem;

  /* ── 字重 ── */
  --fw-light: 300;
  --fw-normal: 400;
  --fw-medium: 500;
  --fw-semibold: 600;

  /* ── 间距 (基准, 配合 clamp 使用) ── */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;

  /* ── 页面边距 ── */
  --page-padding: clamp(1rem, 3vw, 2.5rem);
  --content-max: 1280px;

  /* ── 圆角 ── */
  --radius-sm: 0.375rem;
  --radius-md: 0.75rem;
  --radius-lg: 1.125rem;
  --radius-xl: 1.5rem;
  --radius-full: 50%;

  /* ── 阴影 ── */
  --shadow-card: 0 2px 8px rgba(0,0,0,0.4);
  --shadow-card-hover: 0 4px 20px rgba(0,0,0,0.5);
  --shadow-overlay: 0 8px 40px rgba(0,0,0,0.6);
  --shadow-gold: 0 0 30px rgba(232,168,56,0.15);
  --shadow-purple: 0 0 30px rgba(107,92,231,0.12);

  /* ── 动效 ── */
  --ease-out: cubic-bezier(0.25, 0, 0, 1);
  --ease-in:  cubic-bezier(0.4, 0, 1, 1);
  --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-instant: 0.1s;
  --dur-fast: 0.15s;
  --dur-normal: 0.3s;
  --dur-slow: 0.5s;
  --dur-slug: 0.6s;
  --dur-ambient: 10s;

  /* ── Z 轴层级 ── */
  --z-base: 0;
  --z-content: 0;
  --z-card-hover: 10;
  --z-sticky: 20;
  --z-drawer: 30;
  --z-nav: 50;
  --z-toast: 60;
  --z-overlay: 80;
  --z-skeleton: 90;
  --z-modal: 100;
  --z-player-overlay: 100;
  --z-fab: 50;
  --z-debug: 999;
}