/* ============================================================
 * 寻诗 · Design Tokens（唯一 Token 源）
 * 版本 v1.1 · 2026-10-12 · 设计师：颜好看
 * 来源：docs/检索站-UIUX方向-v1.md v1.6（Phase 1 方向，已冻结）
 *       docs/DESIGN.md v1.3（Phase 2 契约，本文件为其 §2/§3 的代码化）
 * 运行时位：public/css/design-tokens.css（site/README.md 铁律 4 + Spec §8 锁定，
 *       Phase 3 骨架已由 site/ 根移置于此；site/design-tokens.json 为 DTCG 真值参考）
 * 消费：public/css/app.css 顶部 @import 本文件；
 *       组件样式只允许引用变量，禁止裸 hex（唯一例外 #fff/#000，本设计亦不使用）。
 * 分层：A1-identity / A1-structure / A2 / B-slot / C-extension
 * ============================================================ */

:root {
  /* ==================================================
   * A1 · Surface 表面层（identity）
   * ================================================== */
  --bg: #F7F3EA;              /* 宣纸底：页面背景。功能性选择（内容气质），非默认奶油化 */
  --surface: #FDFBF5;         /* 净纸面：卡片 / 浮层 */
  --surface-warm: #F0EADA;    /* 三级表面：hover / 分区底 / 代码块外框 */
  --surface-ink: #26211A;     /* 墨面：全站唯一深色区域（仅 API 文档代码块） */

  /* ==================================================
   * A1 · Foreground 前景层（identity）
   * 对 --bg 对比度：fg≈15.4:1 / fg-2≈12:1 / muted≈6.0:1 / meta≈4.6:1
   * ================================================== */
  --fg: #26211A;              /* 墨色正文（暖倾向松烟墨，禁纯黑） */
  --fg-2: #3D382E;            /* 次级正文 */
  --muted: #5C564A;           /* 副文本 / 描述 */
  --meta: #756E60;            /* 三级文字 / 元数据（≥12px 非正文可用） */

  /* ==================================================
   * A1 · Border 边框层（identity）
   * ================================================== */
  --border: #DED6C3;          /* 默认分隔线 / 卡片边（装饰性） */
  --border-soft: #EBE4D3;     /* 内部行分隔（更淡） */
  --border-strong: #9A937F;   /* 交互控件边界（输入框 / 可聚焦组件，满足 3:1） */

  /* ==================================================
   * A1 · Accent 强调层（identity，每屏可见 ≤2 处）
   * ================================================== */
  --accent: #B5472F;          /* 朱砂：CTA / 链接 / 选中态。对纸底 4.87:1，白字在上 5.38:1 */
  --accent-on: #FFFFFF;       /* accent 上的前景 */
  --accent-hover: #9E3B27;    /* hover 加深 */
  --accent-active: #87311F;   /* active 再加深 */
  --accent-soft: #F6E3DC;     /* 朱砂淡底（选中行 / tag 底） */
  --accent-2: #31596B;        /* 黛青：辅助强调（次级链接 / 信息标记 / 图表 / 平声数据色） */

  /* ==================================================
   * A2 · Semantic 语义层
   * ================================================== */
  --success: #276B43;         /* 操作成功（竹绿，对纸底 5.8:1） */
  --warn: #866410;            /* 警告 / 待确认（琥珀） */
  --danger: #A62639;          /* 错误 / 删除（绛红，6.4:1） */

  /* ==================================================
   * C · 平仄数据标记色（extension，数据可视化层）
   * 独立于交互 accent：朱砂给交互，赭褐给仄声数据，互不越界
   * ================================================== */
  --tone-ping: #31596B;       /* 平（黛青） */
  --tone-ze: #8C4A2B;         /* 仄（赭褐：与朱砂同族但更深更褐，区隔于 CTA） */
  --tone-zhong: #8F8878;      /* ○ 可平可仄（暖灰实心） */
  --tone-undef: #8F8878;      /* ？未定（暖灰 1.5px 描边空心，与实心 ○ 区分） */

  /* ==================================================
   * C · 代码块语法色（extension，仅 --surface-ink 墨面上）
   * ================================================== */
  --code-fg: #EDE6D6;         /* 米白正文 */
  --code-keyword: #D98064;    /* 关键词（朱砂提亮） */
  --code-string: #85B89A;     /* 字符串（竹绿提亮） */
  --code-comment: #A39E8F;    /* 注释（暖灰提亮） */
  --code-punct: #8F8878;      /* 标点 / 结构符 */

  /* ==================================================
   * A1-structure · Typography 字体
   * 诗正文/标题 = Noto Serif SC（OFL，子集化自托管，禁 CDN 直引）
   * 界面 = 系统黑体栈（0 字节）；数据/代码 = 系统等宽栈
   * 子集化工程方案见 docs/字体子集化方案.md
   * ================================================== */
  --font-verse: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "SimSun", "Noto Serif CJK SC", serif;
  --font-ui: system-ui, -apple-system, "PingFang SC", "HarmonyOS Sans SC", "MiSans", "Microsoft YaHei", sans-serif;
  --font-mono: ui-monospace, "Cascadia Code", "JetBrains Mono", "SF Mono", Consolas, "Liberation Mono", monospace;

  /* 字号阶梯（8 级 + 诗正文特级，rem） */
  --text-xs: 0.75rem;         /* 12 徽章 / 元数据 */
  --text-sm: 0.875rem;        /* 14 辅助文字 / 表格 */
  --text-base: 1rem;          /* 16 UI 正文 */
  --text-md: 1.125rem;        /* 18 强调正文 / 摘要 */
  --text-lg: 1.25rem;         /* 20 小节标题 */
  --text-xl: 1.5rem;          /* 24 区块标题 */
  --text-2xl: 2rem;           /* 32 页面主标题 */
  --text-3xl: 2.5rem;         /* 40 首页诗笺大字 */
  --text-verse: clamp(1.25rem, 2.2vw, 1.5rem);  /* 诗正文 20–24px */

  /* 行高 */
  --leading-verse: 2.0;       /* 诗正文呼吸感 */
  --leading-body: 1.6;        /* UI 正文 */
  --leading-title: 1.25;      /* 标题 */

  /* 字距 */
  --tracking-verse: 0.02em;   /* 诗正文 / 中文正文微字距 */
  --tracking-caps: 0.06em;    /* 英文标签 / 徽章 ALL CAPS */
  --tracking-title: -0.01em;  /* 标题 ≥32px */
  --tracking-display: -0.02em;/* 诗笺大字 ≥40px */

  /* 字重三级 */
  --weight-read: 400;         /* Read 正文 */
  --weight-emphasize: 500;    /* Emphasize 小标题 / 按钮 */
  --weight-announce: 600;     /* Announce 大标题 / 诗题 */

  /* ==================================================
   * A2 · Spacing（4px 基网格，禁非标值）
   * ================================================== */
  --space-1: 4px;   --space-2: 8px;   --space-3: 12px;  --space-4: 16px;
  --space-5: 20px;  --space-6: 24px;  --space-8: 32px;  --space-10: 40px;
  --space-12: 48px; --space-16: 64px; --space-24: 96px;

  /* ==================================================
   * A2 · Radius（小圆角纪律：古风忌大圆角，卡片上限 12px）
   * ================================================== */
  --radius-sm: 4px;           /* 徽标 / 小件 */
  --radius-md: 6px;           /* 按钮 / 输入框 */
  --radius-lg: 12px;          /* 卡片 */
  --radius-xl: 16px;          /* 弹窗 */
  --radius-pill: 9999px;      /* 胶囊 */

  /* ==================================================
   * A2 · Elevation（墨色投影：纸墨世界的物理一致性，禁纯黑投影）
   * ================================================== */
  --elev-flat: none;
  --elev-ring: 0 0 0 1px var(--border);
  --elev-raised: 0 1px 2px rgba(38, 33, 26, 0.04), 0 4px 12px rgba(38, 33, 26, 0.06);
  --elev-overlay: 0 8px 24px rgba(38, 33, 26, 0.10);

  /* ==================================================
   * A2 · Focus & Motion
   * ================================================== */
  --focus-ring: 0 0 0 3px rgba(181, 71, 47, 0.35);   /* 朱砂 focus 环 */
  --motion-fast: 150ms;        /* 即时反馈 / 状态确认（跨系统收敛值） */
  --motion-base: 200ms;        /* 进入 UI */
  --motion-slow: 300ms;        /* 跨屏 / 模式切换 */
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);

  /* ==================================================
   * A1-structure · Layout
   * ================================================== */
  --container-page: 1200px;    /* 首页 / 检索页 / 作者页 */
  --container-reading: 720px;  /* 详情页诗正文（行宽 25–37 字） */
  --container-doc: 1360px;     /* API 文档三栏 */
  --section-y-desktop: 80px;
  --section-y-tablet: 48px;
  --section-y-phone: 32px;
  --nav-height: 56px;

  /* ==================================================
   * A2 · Icon（Lucide 缩放描边补偿，白名单见 DESIGN.md §4.6）
   * ================================================== */
  --icon-sm: 16px;  --icon-md: 20px;  --icon-lg: 24px;
  --icon-stroke-sm: 1.5px;  --icon-stroke-md: 1.75px;  --icon-stroke-lg: 2px;

  /* ==================================================
   * B · 选中态（slot）
   * ================================================== */
  --selection-bg: var(--accent-soft);
  --selection-fg: var(--accent);
}

/* ============================================================
 * 深色模式 v2 预留（v1 只建变量不激活；纸底→墨夜、朱砂提亮）
 * 评估结论见 UIUX 方向 §2.4：深色对"古典气质"是负分项，v1 不做
 * ============================================================ */
:root[data-theme="dark"] {
  --bg: #17140F;
  --surface: #201B14;
  --surface-warm: #2A241A;
  --fg: #EDE6D6;
  --fg-2: #D8CFBB;
  --muted: #A39E8F;
  --meta: #8F8878;
  --border: #3A332A;
  --border-soft: #2E2820;
  --border-strong: #6B6355;
  --accent: #D96A52;
  --accent-on: #17140F;
  --accent-hover: #E07C66;
  --accent-active: #C25B44;
  --accent-soft: #3D2A22;
  --accent-2: #5A8FA6;
  --success: #5FA374;
  --warn: #C9A23F;
  --danger: #D0555F;
  --tone-ping: #5A8FA6;
  --tone-ze: #B87A55;
  --tone-zhong: #8F8878;
  --tone-undef: #8F8878;
  --code-fg: #EDE6D6;
  --code-keyword: #E08A6E;
  --code-string: #9CCBAE;
  --code-comment: #A39E8F;
  --code-punct: #8F8878;
}

/* ============================================================
 * 全局基线（消费 Token，不含裸值）
 * ============================================================ */
::selection {
  background: var(--selection-bg);
  color: var(--selection-fg);
}

:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}