// Design Token — CSS 自定义属性（校准后）
// 基于全量审计：600+ font-size 声明的频率分布
// 页面样式应引用 var(--tk-*) 而非硬编码 px 值
// 关怀模式通过 .elder-mode 覆盖 token 值自动生效

// ═══════════════════════════════════════
// 正常模式 Token
// ═══════════════════════════════════════
page {
  // ─── 字号（11 级，覆盖 92.5% 场景）───
  --tk-font-display: 72px;     // 大型装饰数值（积分余额、空状态图标）
  --tk-font-hero: 48px;        // 装饰图标、空状态字符
  --tk-font-h1: 26px;          // 页面/区块标题
  --tk-font-h2: 24px;          // 副标题、日期、菜单组
  --tk-font-body-lg: 28px;     // 大正文、按钮（页面默认字号）
  --tk-font-body: 22px;        // 正文、标签
  --tk-font-body-sm: 16px;     // 中等正文、列表项
  --tk-font-num: 30px;         // 数值
  --tk-font-num-lg: 34px;      // 大数值、统计
  --tk-font-cap: 13px;         // 说明文字、时间戳
  --tk-font-micro: 11px;       // 角标、标签

  // ─── 结构 ───
  --tk-line-height: 1.5;
  --tk-touch-min: 48px;
  --tk-btn-primary-h: 56px;
  --tk-text-secondary: #78716C;  // $tx3 — 关怀模式提升对比度
}

// ═══════════════════════════════════════
// 关怀模式 Token（非线性放大）
// 标题 ×1.15 / 正文 ×1.35 / 辅助 ×1.55
// ═══════════════════════════════════════
.elder-mode {
  --tk-font-display: 80px;
  --tk-font-hero: 56px;
  --tk-font-h1: 30px;
  --tk-font-h2: 28px;
  --tk-font-body-lg: 34px;
  --tk-font-body: 30px;
  --tk-font-body-sm: 22px;
  --tk-font-num: 34px;
  --tk-font-num-lg: 40px;
  --tk-font-cap: 18px;
  --tk-font-micro: 17px;

  --tk-line-height: 1.7;
  --tk-touch-min: 56px;
  --tk-btn-primary-h: 64px;
  --tk-text-secondary: #5A554F;  // $tx2 — 对比度提升
}