/* ============================================================
   三国小杀 · 设计令牌（Design Tokens）
   视觉方向：原创 Q 版中国风「墨夜鎏金」——深墨蓝夜空 × 宣纸米白 × 鎏金 × 朱砂
   Hallmark · macrostructure: game-stage · tone: 富丽而克制 · anchor hue: 朱砂红/鎏金
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Ma+Shan+Zheng&family=Noto+Serif+SC:wght@400;500;600;700;900&display=swap');

:root {
  /* —— 纸与墨 —— */
  --ink-950: #0a0f1a;            /* 夜空最深 */
  --ink-900: #101827;            /* 页面底 */
  --ink-800: #16202f;            /* 面板底 */
  --ink-700: #1e2c40;            /* 面板浮起 */
  --ink-600: #2a3b55;
  --paper-50: #f7efdd;           /* 宣纸 */
  --paper-100: #f2e6cc;
  --paper-200: #e6d5b0;
  --paper-300: #d4bd8e;

  /* —— 主题色 —— */
  --gold-300: #eed59a;
  --gold-400: #dfbe72;
  --gold-500: #c9a227;          /* 鎏金主 */
  --gold-600: #a5821c;
  --cinnabar-400: #d24a3e;      /* 朱砂 */
  --cinnabar-500: #b93529;
  --cinnabar-600: #a4161a;
  --jade-400: #3f9d7a;          /* 青瓷 */
  --jade-500: #2e7d5b;
  --azure-400: #5b8dc9;         /* 黛蓝（魏） */
  --azure-600: #33567f;
  --plum-400: #b06a8f;          /* 黛紫点缀（延时锦囊，非渐变主色） */
  --grey-jian: #8a93a3;         /* 群灰 */

  /* —— 阵营 —— */
  --k-wei: #4a7fb5;
  --k-shu: #c04a3a;
  --k-wu: #3f9d6e;
  --k-qun: #8a93a3;

  /* —— 卡牌类型 —— */
  --card-basic: #b93529;
  --card-trick: #b8860b;
  --card-delay: #4a6f9e;
  --card-equip: #4f7d6b;

  /* —— 语义 —— */
  --bg: var(--ink-900);
  --fg: var(--paper-50);
  --fg-dim: color-mix(in oklab, var(--paper-50) 62%, transparent);
  --panel: color-mix(in oklab, var(--ink-800) 88%, transparent);
  --line: color-mix(in oklab, var(--gold-500) 34%, transparent);
  --line-strong: color-mix(in oklab, var(--gold-500) 62%, transparent);
  --danger: var(--cinnabar-500);
  --ok: var(--jade-400);

  /* —— 字体 —— */
  --font-display: 'Ma Shan Zheng', 'Kaiti SC', 'STKaiti', 'KaiTi', serif;
  --font-body: 'Noto Serif SC', 'Songti SC', 'STSong', 'SimSun', serif;

  /* —— 字号（4pt 阶）—— */
  --text-xs: 12px; --text-sm: 13px; --text-md: 15px; --text-lg: 18px;
  --text-xl: 24px; --text-2xl: 32px; --text-display: clamp(40px, 6vw, 72px);

  /* —— 间距 —— */
  --space-2xs: 4px; --space-xs: 8px; --space-sm: 12px; --space-md: 16px;
  --space-lg: 24px; --space-xl: 32px; --space-2xl: 48px;

  /* —— 圆角 —— */
  --radius-sm: 6px; --radius-md: 10px; --radius-lg: 16px; --radius-xl: 24px;

  /* —— 动效 —— */
  --ease-out: cubic-bezier(.22, .8, .3, 1);
  --ease-in: cubic-bezier(.5, 0, .8, .4);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --dur-fast: 140ms; --dur: 260ms; --dur-slow: 520ms;

  /* —— 阴影 —— */
  --shadow-1: 0 2px 8px rgb(0 0 0 / .35);
  --shadow-2: 0 8px 24px rgb(0 0 0 / .45);
  --shadow-gold: 0 0 0 1px color-mix(in oklab, var(--gold-500) 55%, transparent), 0 6px 22px rgb(0 0 0 / .5);
  --focus-ring: 0 0 0 3px color-mix(in oklab, var(--gold-400) 80%, transparent);
}