/* ============================================
   ZhiMo UI 设计令牌 —— 纸张与油墨（编辑部风）
   米白纸底、墨黑文字、衬线标题，
   朱砂印章红是全局唯一的强调色。
   修改这一个文件即可全局换肤。
   ============================================ */

:root {
  --zhimo-font: "Songti SC", "Noto Serif SC", "Noto Serif CJK SC",
    "Source Han Serif SC", "SimSun", Georgia, "Times New Roman", serif;
  --zhimo-font-serif: "Songti SC", "Noto Serif SC", "Noto Serif CJK SC",
    "Source Han Serif SC", "SimSun", Georgia, "Times New Roman", serif;

  /* 纸与墨 */
  --zhimo-bg: #faf7f0;
  --zhimo-bg-subtle: #f3eee1;
  --zhimo-bg-hover: #eee8d8;
  --zhimo-fg: #1a1714;
  --zhimo-fg-muted: #7a7265;
  --zhimo-border: #e0d9c8;
  --zhimo-border-strong: #c6bca6;

  /* 墨色：实心按钮等主操作 */
  --zhimo-accent: #1a1714;
  --zhimo-accent-hover: #3a342c;
  --zhimo-accent-fg: #faf7f0;

  /* 朱砂印章红：全局唯一强调色 */
  --zhimo-seal: #b8432f;
  --zhimo-seal-hover: #a03a28;

  --zhimo-danger: #9e2f1c;
  --zhimo-success: #4a6741;
  --zhimo-warning: #b07d2e;

  /* 形状与阴影：印刷品棱角分明，几乎不用阴影 */
  --zhimo-radius: 4px;
  --zhimo-radius-sm: 2px;
  --zhimo-radius-full: 9999px;
  --zhimo-shadow-sm: 0 1px 2px rgba(26, 23, 20, 0.06);
  --zhimo-shadow-md: 0 2px 10px rgba(26, 23, 20, 0.1);
  --zhimo-shadow-lg: 0 12px 40px rgba(26, 23, 20, 0.18);
  --zhimo-focus-ring: 0 0 0 3px rgba(184, 67, 47, 0.22);

  /* 遮罩：墨色薄雾 + 毛玻璃，给浮层一层高级的纸面景深 */
  --zhimo-overlay-bg: rgba(26, 23, 20, 0.32);
  --zhimo-overlay-blur: blur(8px) saturate(1.2);

  /* 浮层磨砂纸面：所有遮挡水墨背景的面板共用，让墨色透出又不伤可读性 */
  --zhimo-surface-bg: color-mix(in srgb, var(--zhimo-bg) 82%, transparent);
  --zhimo-surface-blur: blur(12px) saturate(1.15);

  /* 动效 */
  --zhimo-transition: 180ms ease;
}

/* 夜读模式：深茶色纸，不是冷冰冰的纯黑 */
[data-theme="dark"] {
  --zhimo-bg: #16140f;
  --zhimo-bg-subtle: #1d1a14;
  --zhimo-bg-hover: #282318;
  --zhimo-fg: #e8e2d4;
  --zhimo-fg-muted: #968d7c;
  --zhimo-border: #353023;
  --zhimo-border-strong: #4d4634;

  --zhimo-accent: #e8e2d4;
  --zhimo-accent-hover: #d6cfbf;
  --zhimo-accent-fg: #16140f;

  --zhimo-seal: #d96a52;
  --zhimo-seal-hover: #e07e68;

  --zhimo-danger: #d96a52;
  --zhimo-success: #7d9a72;
  --zhimo-warning: #cfa050;

  --zhimo-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --zhimo-shadow-md: 0 2px 10px rgba(0, 0, 0, 0.5);
  --zhimo-shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.6);
  --zhimo-focus-ring: 0 0 0 3px rgba(217, 106, 82, 0.28);

  --zhimo-overlay-bg: rgba(0, 0, 0, 0.5);
  --zhimo-overlay-blur: blur(8px) saturate(1.2);

  --zhimo-surface-bg: color-mix(in srgb, var(--zhimo-bg) 80%, transparent);
  --zhimo-surface-blur: blur(12px) saturate(1.15);
}
