/** 宋式书斋：暖纸、深墨与少量朱砂。主题可覆盖颜色，组件使用语义变量。 */
:root {
  --header-bg: var(--bg);
  --header-text: var(--ink);
  --control-border: #9B9F95;
  --focus-ring: #293E37;
  --content-width: 1180px;
  /* 基础色彩变量（收敛后的统一色板） */
  --bg: #F7F4ED;            /* 宣纸白 / 暖灰米 —— 主背景 */
  --card: #FFFCF6;          /* 卡片表面 */
  --bg-subtle: #EEE9DF;     /* 嵌套区块色差（替代内层边框） */
  --line: #DCD6CA;          /* 分隔线（更淡，减切割感） */
  --card-border: #DCD6CA;   /* 卡片描边（更淡） */
  --ink: #242B28;           /* 黛青墨色 —— 主文字/主品牌 */
  --ink-soft: #62685F;      /* 次级文字 */
  --ink-subtle: #71766E;    /* 辅助说明 */

  --accent: #A58A55;        /* 收敛的雅致金（替代刺眼明黄） */
  --accent-2: #B9A47D;
  --accent-deep: #293E37;
  --brand: #A74436;         /* 朱砂红 —— 重点/强调 */
  --brand-2: #89372D;
  --brand-light: rgba(167,68,54,.07);
  --accent-light: rgba(165,138,85,.08);

  --color-bg: var(--bg);
  --color-surface: var(--card);
  --color-surface-subtle: var(--bg-subtle);
  --color-surface-hover: rgba(44, 62, 80, 0.04);
  --color-surface-active: rgba(44, 62, 80, 0.07);
  --color-text: var(--ink);
  --color-text-muted: var(--ink-soft);
  --color-text-subtle: var(--ink-subtle);
  --color-line: var(--line);
  --color-line-soft: var(--line);
  --color-border: var(--card-border);

  /* 品牌色系 */
  --color-brand: var(--brand);
  --color-brand-deep: var(--brand-2);
  --color-brand-light: var(--brand-light);
  --color-accent: var(--accent);
  --color-accent-deep: var(--accent-deep);
  --color-accent-light: var(--accent-light);
  --color-accent-2: var(--accent-2);

  /* 状态反馈色（收敛，仅保留必要语义） */
  --color-success: #3A8A4E;
  --color-success-bg: #EDF7EF;
  --color-warning: #B8893A;
  --color-warning-bg: #FBF4E9;
  --color-error: #C24F3D;
  --color-error-bg: #FBEDEA;
  --color-info: #2C3E50;
  --color-info-bg: #EEF1F5;

  /* 按钮语义层：颜色表达操作优先级，而不是装饰 */
  --btn-primary: #293E37;
  --btn-primary-hover: #20312B;
  --btn-secondary: #FFFCF6;
  --btn-secondary-hover: #EEE9DF;
  --btn-tertiary-bg: #FFFCF6;
  --btn-tertiary-border: #9B9F95;
  --btn-tertiary-text: #293E37;
  --btn-success: #52733D;
  --btn-success-hover: #3F602F;
  --btn-warning: #B8781E;
  --btn-warning-bg: #FFF7E6;
  --btn-danger: #A33B32;
  --btn-danger-bg: #FFF4F1;
  --btn-disabled-bg: #D9D4CA;
  --btn-disabled-text: #817967;

  /* 五行标准配色（命理语义，保留） */
  --wu-mu: #4E7B5C;
  --wu-huo: #C24F3D;
  --wu-tu: #B8893A;
  --wu-jin: #82929E;
  --wu-shui: #2B5876;
  --color-wu-mu: var(--wu-mu);
  --color-wu-huo: var(--wu-huo);
  --color-wu-tu: var(--wu-tu);
  --color-wu-jin: var(--wu-jin);
  --color-wu-shui: var(--wu-shui);

  /* 双字体排印体系：标题衬线（国风雅致），正文无衬线（现代通透） */
  --font-title: "Noto Serif SC", "Source Han Serif SC", "思源宋体", "Songti SC", "STSong", serif;
  --font-body: -apple-system, BlinkMacSystemFont, "PingFang SC", "Inter", "Noto Sans SC", "Microsoft YaHei", sans-serif;
  /* —— 区块级字体变量（后台主题可逐块覆盖） —— */
  --f-title: var(--font-title);          /* 标题/品牌/卦象：默认衬线宋体 */
  --f-title-size: 32px;
  --f-title-color: var(--ink, #2C3E50);
  --f-body: var(--font-body);            /* 正文/数据：默认无衬线 */
  --f-body-size: var(--font-size-base);
  --f-body-color: var(--ink);
  --f-score: var(--font-title);          /* 分数/断语：衬线，凸显命理感 */
  --f-score-size: 23px;
  --f-score-color: var(--brand, #C24F3D);
  --f-tag: var(--font-body);              /* 宜忌标签：无衬线，清晰 */
  --f-tag-size: var(--fs-body, 13px);
  --f-tag-color: var(--ink-soft, #666);
  --f-btn: var(--font-body);              /* 按钮 */
  --f-btn-size: 15px;
  --font-family: var(--font-body);
  --font-family-serif: var(--font-title);

  /* 3 级字阶（压缩字重，建立视觉锚点） */
  --fs-display: 32px;   /* 一级大标题 */
  --fs-title: 21px;     /* 二级小标题/标签 */
  --fs-body: 16px;      /* 正文/副文本 */
  --fw-display: 600;    /* Semi-bold */
  --fw-title: 500;      /* Medium */
  --fw-body: 400;       /* Regular */

  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-base: 16px;
  --font-size-md: 15px;
  --font-size-lg: 19px;
  --font-size-xl: 26px;
  --font-size-2xl: 32px;
  --line-height-tight: 1.3;
  --line-height-normal: 1.6;
  --line-height-relaxed: 1.72;   /* 中文正文 1.6–1.75 */

  /* 间距与尺寸 */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;

  /* 圆角（统一 12/16，去掉琐碎小圆角） */
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-card: 12px;
  --radius-full: 9999px;

  /* 阴影（更轻） */
  --shadow-sm: 0 1px 2px rgba(44, 62, 80, 0.04);
  --shadow-md: 0 4px 14px rgba(44, 62, 80, 0.06);
  --shadow-lg: 0 8px 24px rgba(44, 62, 80, 0.08);
  --shadow-drawer: 0 -4px 20px rgba(44, 62, 80, 0.10);

  /* 移动端与交互标准 */
  --touch-target: 44px;
  --touch-target-lg: 48px;
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-top: env(safe-area-inset-top, 0px);
  --bottom-nav-height: 68px;
  --top-bar-height: 80px;
  --z-sticky: 100;
  --z-nav: 500;
  --z-drawer: 1000;
  --z-modal: 1100;
  --z-toast: 1200;
}
