/* ============================================================
   铃音Township · 设计变量（唯一来源）
   ------------------------------------------------------------
   全站只能在这里定义变量。页面内联样式与其它 css 只允许「使用」。
   分两层：
     ① 语义层  —— 新代码一律用这层（--bg / --text / --accent …）
     ② 兼容层  —— 旧名（--cream / --ink / --maple …）指向语义层，
                  方便逐页迁移；迁移完成后可整段删除。
   改配色只需改本文件的语义层。
   配色原则：暖中性底 + 近黑正文 + 单一陶土强调；强调色占屏 < 5%。
   所有文字色均已实测 WCAG 对比度（见 docs/视觉改版方案-20261003.md）。
   ============================================================ */
:root{
  /* ---------- ① 语义层 ---------- */
  /* 底色与容器 */
  --bg:#faf9f5;
  --bg-sunken:#f2efe8;
  --bg-elevated:#ffffff;
  --paper:#f7f4ec;
  --paper-2:#fbf9f4;
  --surface:rgba(255,255,255,.86);
  --surface-solid:#ffffff;
  /* 文字：深 / 中 / 浅 三档
     三档全部实测满足 WCAG AA（正文 4.5:1）：
       --text     / 卡片 17.4:1
       --text-soft/ 卡片  7.8:1
       --text-faint/卡片 4.9:1  ← 本轮由 #8a857c(3.67) 调深，原来不达标 */
  --text:#1f1e1d;
  --text-soft:#55524c;
  --text-faint:#75706a;
  /* 分隔线与描边（色调统一为中性，不再偏棕） */
  --rule:rgba(31,30,29,.18);
  --rule-soft:rgba(31,30,29,.08);
  --hairline:rgba(31,30,29,.10);
  --hairline-strong:rgba(31,30,29,.18);
  /* 强调色（唯一强调，用于主按钮 / 链接 / 关键数字） */
  --accent:#a8502f;
  --accent-deep:#8f4527;
  --accent-2:#c4643c;
  --accent-soft:#f6e9e2;
  /* 状态色 */
  --success:#3f7a5e;
  --success-2:#6f9d85;
  --success-soft:#eaf2ee;
  --warning:#96630f;
  --warning-soft:#f7efe1;
  --danger:#b4322a;
  --info:#4b6e86;
  /* 暗底语义色：用于 hero 封面 / 机器子导航激活态 / toast 这类深色面上的文字与状态。
     这些颜色在浅底上是失真的，只能配 --on-dark-surface 或 --ink 使用。 */
  --on-dark-surface:rgba(31,30,29,.92);
  --on-dark-text:#ffffff;
  /* 暖强调：hero 副标题 / 季节字 / 导航 hover。
     这些位置都是**小字**，必须满足 4.5:1；实测 #f3d3b8 在封面暗底上只有 4.24~4.32，
     不够 → 提亮到 #f7e3cf（实测最差 4.82~4.91）。 */
  --on-dark-accent:#f7e3cf;
  --on-dark-soft:#e8cbbd;     /* 次级字：机器子导航激活态数字 */
  --on-dark-success:#6f9d85;  /* 成功图标：toast 对勾 */
  --on-dark-danger:#d99a86;   /* 危险图标：toast 叉号 */
  /* 装饰色（克制使用） */
  --amber:#c98a2e;
  --amber-soft:#f7efe1;
  --gold:#b08a2e;
  --gold-lo:#946f1f;
  --gold-soft:#f0dfb4;   /* 浅金渐变终点：重点材料卡高亮 */
  --bronze:#a9743f;
  --silver:#8a8f98;
  --violet:#7a6a96;
  --violet-soft:#f0edf5;
  --slate:#7c7a75;
  --slate-soft:#efeee9;
  --beige:#c9c2b6;
  --tint:#eae5da;
  /* 形状与动效：圆角收敛，阴影只用一档极轻的
     圆角只允许这 5 档 + 0 / 2px / inherit / 50%（正圆）。
     6px 行内小控件 · 8px 输入框与小按钮 · 10px 按钮 · 12px 卡片与面板 · 999 胶囊
     禁止再出现 7px / 13px / 14px / 16px / 20px / 22px / .375rem / .6rem 这类散值。 */
  --radius-xs:6px;
  --radius-sm:8px;
  --radius-md:10px;
  --radius:12px;
  --radius-pill:999px;
  --focus-ring:0 0 0 3px var(--accent-soft);
  --shadow-sm:0 1px 2px rgba(31,30,29,.04);
  --shadow-md:0 1px 3px rgba(31,30,29,.05),0 8px 24px -18px rgba(31,30,29,.18);
  --shadow-lg:0 2px 6px rgba(31,30,29,.06),0 20px 48px -28px rgba(31,30,29,.22);
  --ease-out:cubic-bezier(.22,1,.36,1);
  /* 液态玻璃（Apple 风）：半透明面 + 背景模糊 + 一圈几乎看不见的亮边。
     要点：玻璃必须有东西「透过去」才成立 —— 所以用它的页面底一定要有渐变或内容，
     纯色底上的半透明面只会显得发灰（管理页的 body::before 就是为此加的层次）。 */
  --glass:rgba(255,255,255,.58);
  --glass-raised:rgba(255,255,255,.76);
  --glass-line:rgba(255,255,255,.7);
  --glass-edge:rgba(31,30,29,.07);
  --glass-tint:rgba(255,255,255,.5);
  --glass-blur:saturate(180%) blur(22px);
  --glass-blur-soft:saturate(160%) blur(12px);
  --shadow-glass:0 1px 2px rgba(31,30,29,.04),0 10px 30px -16px rgba(31,30,29,.18);
  --shadow-glass-lift:0 2px 4px rgba(31,30,29,.05),0 18px 44px -20px rgba(31,30,29,.26);
  --well:rgba(31,30,29,.045);   /* 输入框这类「凹进去」的底 */
  /* 字体（本轮不动） */
  --serif:'Noto Serif SC','Songti SC',serif;
  --latin:'Cormorant Garamond','Noto Serif SC',serif;
  --sans:-apple-system,'PingFang SC','Microsoft YaHei',sans-serif;
  --mono:'JetBrains Mono','SF Mono',Consolas,'Courier New',monospace;
  /* 装饰用透明度 */
  --ornament-opacity:.12;
  --water-opacity:.07;

  /* ---------- ② 兼容层：旧名 → 语义层 ---------- */
  --cream:var(--bg);
  --cream-deep:var(--bg-sunken);
  --ink:var(--text);
  --ink-soft:var(--text-soft);
  --ink-faint:var(--text-faint);
  --maple:var(--accent);
  --maple-deep:var(--accent-deep);
  --line:var(--rule);
  --line-soft:var(--rule-soft);
  /* 旧名中语义已变化的别名 */
  --green:var(--success);
  --green-2:var(--success-2);
  --green-soft:var(--success-soft);
}
