:root {
  --color-bg: #f5f5f7;
  --color-surface: #ffffff;
  --color-soft: #fafafa;
  --color-border: #e3e3e8;
  --color-border-strong: #d1d1d6;
  --color-text: #1d1d1f;
  --color-muted: #8e8e93;
  --color-accent: var(--accent);
  --color-success: #639922;
  --radius-page: 28px;
  --radius-card: 14px;
  --font-sans: "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;

  /* ===== 安全区（刘海/灵动岛/底部横条）=====
     直接写 env() 无法被覆盖、也无法在桌面调试；
     统一走这两个变量，满屏页面用它做加减即可。 */
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --nav-height: 60px;   /* 底部导航自身高度（不含安全区） */

  /* ===== 字号层级（全站统一规范，按重要性递减） ===== */
  --fs-display: 28px;   /* 页面主视觉：日期、页面标题 */
  --fs-title: 22px;     /* 关键数字：时钟、金额 */
  --fs-heading: 17px;   /* 卡片标题：卦象名、模块名 */
  --fs-lead: 15px;      /* 次级标题：时段标签、分组名 */
  --fs-body: 13px;      /* 正文：说明、列表项 */
  --fs-caption: 11px;   /* 辅助：时间、单位、按钮 */
  --fs-micro: 9px;      /* 微标：英文大写标签 */
  --fs-ring: 38px;      /* 时间环中心数字：加粗加大版 fs-display */

  /* ===== 文字色层级（三级灰，统一收敛） ===== */
  --ink-1: #242321;     /* 主文字：标题、关键数字 */
  --ink-2: #6f6963;     /* 次级：正文、说明 */
  --ink-3: #9c968f;     /* 弱化：标签、注释、单位 */

  /* ===== 强调色（主页只保留一枚红 + 一枚绿） ===== */
  --accent: #b94f49;    /* 强调红 */
  --accent-soft: #d98880;
  --accent-bg: #fff1f0;
  --green: #16a34a;     /* 时间板块绿 */
  --green-deep: #0f6b3d;
  --green-glass: rgba(34, 185, 105, .16);
  --green-line: rgba(22, 163, 74, .26);
}
