/*
 * KenSure Design Tokens
 * 品牌视觉系统的唯一真相来源 (single source of truth)
 * 所有页面、文档、组件统一引用此文件
 *
 * 配色方案：深海蓝 + 古铜金（方案 B 的蓝 × 方案 C 的金）
 */

:root {
  /* ── 色彩 ── */
  --ks-primary:       #1B4965;   /* 深海蓝 — 主色，按钮、标题强调、数据卡底色 */
  --ks-accent:        #B8976A;   /* 古铜暖金 — 点缀，引用线、引号、小标签 */
  --ks-accent-light:  #C9A97E;   /* 古铜金亮色 — 深色底上的辅助文字 */
  --ks-bg:            #F7F3ED;   /* 和纸白 — 内容区/卡片背景 */
  --ks-bg-page:       #E4DFD8;   /* 页面底色 — 比和纸白深一档，营造层次 */
  --ks-bg-card:       #EAE5DC;   /* 卡片底色 — 用于次级内容卡片 */
  --ks-text:          #1A1A2E;   /* 深墨 — 主文字色（浅色底用） */
  --ks-text-muted:    #2A2A3E;   /* 次级文字 — 引用正文等 */
  --ks-text-inverse:  #F7F3ED;   /* 反色文字 — 深色底（如主色卡片）上的主文字 */
  --ks-text-inverse-muted: rgba(247, 243, 237, 0.7); /* 反色次级文字 — 深色底上的说明文字 */
  --ks-divider:       rgba(27, 73, 101, 0.15); /* 分割线 — 主色的低透明度 */
  --ks-accent-bg:     rgba(184, 151, 106, 0.08); /* 引用块底色 — 金色的微透明 */

  /* ── 字体 ── */
  --ks-font-heading:  'Noto Serif SC', serif;   /* 标题 — 衬线，有质感 */
  --ks-font-body:     'Noto Sans SC', sans-serif; /* 正文 — 无衬线，易读 */

  /* ── 字号 ── */
  --ks-text-hero:     34px;   /* 主标题 */
  --ks-text-section:  22px;   /* 章节标题 / 数据数字 */
  --ks-text-card:     15px;   /* 卡片标题 / 引用正文 */
  --ks-text-body:     13px;   /* 正文 / 副标题 */
  --ks-text-caption:  12px;   /* 卡片描述 */
  --ks-text-label:    11px;   /* 小标签 / 眉头文字 */
  --ks-text-micro:    10px;   /* 分类标签 / 页脚 */

  /* ── 字重 ── */
  --ks-weight-light:  300;
  --ks-weight-normal: 400;
  --ks-weight-medium: 500;

  /* ── 行高 ── */
  --ks-leading-tight:   1.35;  /* 标题 */
  --ks-leading-normal:  1.65;  /* 一般内容 */
  --ks-leading-relaxed: 1.75;  /* 卡片描述 */
  --ks-leading-loose:   1.95;  /* 引用正文，最宽松 */

  /* ── 字间距 ── */
  --ks-tracking-tight:  0.02em;
  --ks-tracking-normal: 0.04em;  /* 标题默认 */
  --ks-tracking-wide:   0.08em;  /* 副标题 */
  --ks-tracking-wider:  0.18em;  /* 眉头/按钮 */
  --ks-tracking-widest: 0.20em;  /* 品牌名/微标签 */

  /* ── 间距 ── */
  --ks-space-xs:    8px;
  --ks-space-sm:    12px;
  --ks-space-md:    18px;
  --ks-space-lg:    24px;
  --ks-space-xl:    36px;
  --ks-space-2xl:   44px;
  --ks-space-3xl:   52px;

  /* ── 圆角 ── */
  --ks-radius:      2px;   /* 克制的微圆角，不是完全直角也不圆润 */

  /* ── 布局 ── */
  --ks-max-width:   420px;  /* 移动端优先的内容最大宽度 */
  --ks-padding-x:   36px;   /* 内容区水平内边距 */
}
