/* ============================================================================
   设计 Token —— 原始值（与主题无关）
   ----------------------------------------------------------------------------
   这里只放"不随主题变化"的原始值：色阶、字阶、间距、圆角、动效、字体栈。
   "语义变量"（--bg / --text / --accent …）在 themes.css 里按主题映射。

   取值来源：matrees.cn 与 vvd.world 实测的 computed style。
   色值后标 [M] = 来自 matrees 实测；[V] = 来自 vvd 实测；无标 = 由实测值推导。
   ============================================================================ */

:root {
  /* ---------- 中性灰阶（以 matrees 的深灰体系为骨架） ---------- */
  --gray-950: #141414;   /* 比 matrees 最深色再深一档，用于整页底 */
  --gray-900: #1f1f1f;   /* [M] */
  --gray-850: #262626;   /* [M] */
  --gray-800: #2e2e2e;   /* [M] */
  --gray-750: #383838;
  --gray-700: #454545;
  --gray-600: #5c5c5c;
  --gray-500: #737373;
  --gray-400: #a3a3a3;   /* [M] */
  --gray-300: #bfbfbf;   /* [M] */
  --gray-200: #e6e6e6;   /* [M] */
  --gray-100: #fafafa;   /* [M] */
  --white:    #ffffff;

  /* ---------- 强调色（两个参考站各自的品牌色，均保留） ---------- */
  --green-500:  #21c45d;                    /* [M] matrees 品牌绿 */
  --green-600:  #1aa84e;
  --green-soft: rgba(33, 196, 93, 0.14);
  --indigo-500: #6366f1;                    /* [M] matrees 点缀靛蓝 */
  --indigo-soft: rgba(99, 102, 241, 0.14);
  --gold-500:   #f4b23e;                    /* [V] vvd 暖金 */
  --gold-600:   #d99a2b;
  --gold-soft:  rgba(244, 178, 62, 0.16);
  --brick-500:  #d94a33;                    /* [V] vvd 砖红 */
  --brick-soft: rgba(217, 74, 51, 0.14);

  /* ---------- 纸面色阶（以 vvd 的米白为基准） ---------- */
  --paper-50:  #fdfbf6;
  --paper-100: #f9f4ea;
  --paper-200: #f3e6d0;                     /* [V] vvd 阅读视图底色 */
  --paper-300: #e9dcc3;
  --paper-400: #d8c7a6;
  --paper-500: #b6ad9c;                     /* [V] */

  /* ---------- 纸面墨色（深色文字，用于米白底） ---------- */
  --ink-900: #241f18;
  --ink-800: #3a3329;
  --ink-700: #4d453a;
  --ink-600: #6b6255;
  --ink-500: #8c8474;
  --ink-400: #a89f8d;

  /* ---------- 字体栈 ---------- */
  /* UI / 标题 / 数字：Latin 走 Space Grotesk，中文自动回退系统无衬线 */
  --font-ui: "Space Grotesk", "PingFang SC", "Microsoft YaHei", "Noto Sans SC",
             -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  /* 中文正文：中文优先，避免中英混排时基线抖动 */
  --font-text: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", "Hiragino Sans GB",
               "Space Grotesk", -apple-system, "Segoe UI", Roboto, sans-serif;
  /* 等宽（数字对齐、代码） */
  --font-mono: "Space Grotesk", ui-monospace, "SFMono-Regular", Consolas,
               "Liberation Mono", Menlo, monospace;

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semibold: 600;
  --fw-bold:     700;

  /* ---------- 字阶 ----------
     单位一律用 rem（根字号 16px 时换算见右侧注释），不用 px。
     原因：这样【设置】里换字号档位只需改 <html> 的根字号一处，
          全站字号整体缩放，不必逐个改值。
          —— 这是"加选项不改代码"的一部分。
     ⚠️ 间距/圆角等"尺寸"仍用 px，不跟着缩放，避免大字号下版式被撑破。 */
  --fs-2xs: 0.6875rem;   /* 11px */
  --fs-xs:  0.75rem;     /* 12px */
  --fs-sm:  0.8125rem;   /* 13px */
  --fs-md:  0.875rem;    /* 14px */
  --fs-base: 0.9375rem;  /* 15px —— UI 默认 */
  --fs-lg:  1.0625rem;   /* 17px —— 长文正文 */
  --fs-xl:  1.25rem;     /* 20px */
  --fs-2xl: 1.5rem;      /* 24px */
  --fs-3xl: 1.875rem;    /* 30px */
  --fs-4xl: 2.5rem;      /* 40px */
  --fs-display: 3.5rem;  /* 56px */

  /* ---------- 行高 ---------- */
  --lh-tight: 1.25;  /* 大标题 */
  --lh-snug:  1.4;   /* 小标题 */
  --lh-ui:    1.5;   /* 界面文字（vvd 实测 16.8/25.2 = 1.5） */
  --lh-read:  1.85;  /* 中文长文，比常规更松，减少串行 */

  /* ---------- 字距 ---------- */
  --ls-tight: -0.01em;
  --ls-normal: 0;
  --ls-wide: 0.02em;
  --ls-wider: 0.08em;   /* 小标签、全大写 */

  /* ---------- 间距（8px 基底） ---------- */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  20px;
  --sp-6:  24px;
  --sp-8:  32px;
  --sp-10: 40px;
  --sp-12: 48px;
  --sp-16: 64px;
  --sp-20: 80px;
  --sp-24: 96px;

  /* ---------- 圆角（介于 matrees 的方正规整与 vvd 的圆润之间） ---------- */
  --r-xs:   4px;
  --r-sm:   6px;    /* matrees 实测量级 */
  --r-md:   10px;
  --r-lg:   14px;
  --r-xl:   20px;
  --r-full: 999px;

  /* ---------- 描边宽度 ---------- */
  --bw-1: 1px;
  --bw-2: 2px;

  /* ---------- 动效 ---------- */
  --t-fast: 120ms;
  --t-base: 200ms;
  --t-slow: 320ms;
  --ease:        cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);

  /* ---------- 层级（z-index 只在定位元素上生效） ---------- */
  --z-base:     0;
  --z-sticky:   100;
  --z-dropdown: 200;
  --z-drawer:   300;
  --z-modal:    400;
  --z-toast:    500;

  /* ---------- 布局尺寸 ---------- */
  --topbar-h:   56px;
  --sidebar-w:  240px;
  --aside-w:    300px;
  --read-w:     720px;   /* 长文单栏最大宽度，保证每行 30–40 字 */
  --page-max:   1680px;

  /* ---------- 断点（仅作文档记录，媒体查询里需写具体数值） ---------- */
  /* sm 640 / md 768 / lg 1024 / xl 1280 / 2xl 1536 */
}
