/* vgogo 设计令牌（C 风格「写给长辈的一封信」）
 * 全站唯一的颜色、字体、尺寸来源。新样式只引用 --vg-*，不再写十六进制色值。
 * 说明见 docs/design-system.md。前缀 --vg- 是为了和迁移期仍在使用的旧变量（--black/--gel/--paper 等）共存。
 */
:root {
  /* 纸面与墨色 */
  --vg-bg: #f4f3ef;          /* 页面底，近白带一点暖 */
  --vg-paper: #ffffff;       /* 卡片、输入框、稿纸 */
  --vg-soft: #ebe9e2;        /* 次级底：悬停、占位、骨架 */
  --vg-ink: #141414;         /* 正文与标题 */
  --vg-ink2: #575650;        /* 次要文字（在 --vg-bg 上对比度约 6.6:1） */
  --vg-ink3: #7a7970;        /* 更弱的提示，只用于不承载信息的装饰文字 */
  --vg-line: rgba(20, 20, 20, .16);
  --vg-line-strong: rgba(20, 20, 20, .42);

  /* 朱砂红：章号、印章、主按钮、关键状态。不要大面积铺色。 */
  --vg-seal: #b8321f;
  --vg-seal-dk: #9c2a19;
  --vg-seal-soft: rgba(184, 50, 31, .08);
  --vg-on-seal: #ffffff;

  /* 语义色，与朱砂红分开 */
  --vg-ok: #2c6a3f;
  --vg-ok-soft: rgba(44, 106, 63, .08);
  --vg-wait: #8a5b0c;
  --vg-wait-soft: rgba(138, 91, 12, .08);
  --vg-info: #245d79;        /* 焦点环与链接强调 */
  --vg-danger: #a3281a;

  /* 深底区域：照片画布、结尾大图、对比条 */
  --vg-night: #141414;
  --vg-on-night: #ffffff;
  --vg-on-night-dim: #c4c3bc;

  /* 字体 */
  --vg-serif: var(--vg-sans);      /* 单一字体：标题也用无衬线，保留变量名是为了旧样式不报错 */
  --vg-sans: Geist, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", system-ui, sans-serif;
  --vg-hand: var(--vg-sans);

  /* 字号阶梯（落在 Tailwind 字阶上；正文不小于 16px，阅读正文 18px） */
  --vg-fs-xs: 12px;
  --vg-fs-sm: 14px;
  --vg-fs-base: 16px;
  --vg-fs-lg: 18px;
  --vg-fs-h3: 20px;
  --vg-fs-h2: clamp(24px, 2.6vw, 30px);
  --vg-fs-h1: clamp(30px, 4.2vw, 48px);

  /* 形状与间距 */
  --vg-r-sm: 6px;
  --vg-r-md: 12px;
  --vg-r-pill: 9999px;
  --vg-tap: 44px;            /* 最小触控高度 */
  --vg-gutter: 24px;
  --vg-wrap: 1180px;
  --vg-shadow-card: 0 1px 0 rgba(20, 20, 20, .04);
  --vg-shadow-pop: 0 18px 40px -16px rgba(20, 20, 20, .35);
  --vg-ease: cubic-bezier(0.22, 1, 0.36, 1);   /* 全站统一缓动：先快后慢，落定有分量 */
  --vg-z-nav: 30;
  --vg-z-pop: 50;
}

/* 流式留白改成两档间距：小屏取下限，≥64rem 取上限 */
@media (min-width: 64rem) {
  :root { --vg-gutter: 40px; }
}