/* ═══════════════════════════════════════════════════════════════════
 * 夏语 · 设计令牌 (design-tokens.css)
 * 唯一事实来源 —— 必须排在 common.css 之前加载
 *
 * 职责：
 *   1. 定义全站设计令牌（颜色 / 圆角 / 阴影 / 字体 / 动效）
 *   2. 把历史遗留的老变量名桥接到新令牌，使旧组件自动收敛
 *      （无需改动 common.css 的 157KB 既有规则）
 *   3. 施加中文排版基线（正字距 / 行高 / 字重）
 *
 * 设计语言：黑金（炭黑底 + 三级金属金），层级靠描边粗细而非发光
 *   · 金色只占约 10% 面积（主按钮 / logo / 激活态 / 标题点缀 / 分隔线）
 *   · 主色用「暖金」而非「土豪金」：#d9b45a 在 #0e0e11 上对比度 ≈9:1
 *   · 描边用暖灰 #3a3a42，绝不用冷灰 —— 冷灰会立刻变回「黑灰科技风」
 *   · 文字用暖白 #e8e4dc，不用冷白 —— 冷白配金会发灰
 *
 * ⚠️ 改这个文件前先读 _archive/blackgold_before_2026-09-25/design-tokens.css.bak
 * ═══════════════════════════════════════════════════════════════════ */

:root {
  /* ─────────── 品牌色：金属金三级（高光 / 主金 / 暗金） ─────────── */
  --c-gold-hi:    #f7e3a1;   /* 高光金 — 标题描边、图标高光、hover 提亮 */
  --c-gold:       #d9b45a;   /* 主金   — 按钮、链接、激活态（面积最大的金色） */
  --c-gold-deep:  #a8853a;   /* 暗金   — 描边、渐变收尾、hover 加深 */
  --c-accent:     #d9b45a;   /* 主色 · 与主金同源（旧代码都消费 --c-accent） */
  --c-accent-2:   #f7e3a1;   /* 辅色 · 高光金 */
  --c-accent-3:   #a8853a;   /* 点缀 · 暗金 */
  --c-grad: linear-gradient(135deg, #f7e3a1 0%, #d9b45a 48%, #a8853a 100%);
  --c-grad-soft: linear-gradient(135deg, rgba(217, 180, 90, .16), rgba(168, 133, 58, .10));

  /* 语义色（保留但收敛饱和度，避免与金色打架） */
  --c-green:  #6ee7b7;
  --c-red:    #f87171;
  --c-purple: #c4b5fd;
  --c-orange: #fbbf24;
  --c-gold:   #d9b45a;

  /* ─────────── 背景层级：炭黑，带极淡暖调 ─────────── */
  --c-bg-0:      #08080a;     /* 最深（页脚 / 代码区凹底） */
  --c-bg-1:      #0e0e11;     /* 主底 */
  --c-bg-2:      #141418;     /* 抬升（卡片静止） */
  --c-card-solid:#17171c;     /* 实心卡片 */
  --c-card-bg:   rgba(23, 23, 28, .72);

  /* 暖灰描边层级（VoltAgent：用边框粗细代替阴影表达层级） */
  --c-line:        rgba(200, 200, 210, .10);
  --c-line-strong: rgba(217, 180, 90, .30);
  --c-line-accent: rgba(217, 180, 90, .42);

  /* ─────────── 文字层级：暖白系 ─────────── */
  --c-text-hi:  #f0ece4;     /* 暖白 · 标题 */
  --c-text:     #cfc9be;     /* 暖灰白 · 正文 */
  --c-text-mid: #948e83;     /* 次级 */
  --c-text-dim: #6a655c;     /* 弱化 */

  /* ─────────── 形状与动效 ─────────── */
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 18px;
  --r-xl: 24px;
  --r-pill: 999px;
  --ease: cubic-bezier(.22, .61, .36, 1);

  /* 阴影：只用于「抬起」，层级表达交给描边 */
  --sh-card: 0 4px 24px rgba(0, 0, 0, .5);
  --sh-pop: 0 24px 60px rgba(0, 0, 0, .68);

  /* ─────────── 字体：中文优先，避免 Inter 抢先匹配导致字形跳变 ─────────── */
  --font: "MiSans", "HarmonyOS Sans SC", "PingFang SC", "Hiragino Sans GB",
          "Microsoft YaHei", "Source Han Sans SC", "Noto Sans SC",
          system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", "Fira Code", "Cascadia Code", "Consolas",
          "Menlo", "Courier New", monospace;
}

/* ═══════════════════════════════════════════════════════════
 * 老变量桥接层
 * common.css 里已有的旧变量名 → 重定向到新令牌。
 * 这样 157KB 的既有规则无需改动即可跟随新设计系统。
 * ═══════════════════════════════════════════════════════════ */
:root {
  /* 语义色 / 背景 / 文字 */
  --cp: var(--c-gold);
  --cp-dark: var(--c-gold-deep);
  --cp-light: var(--c-gold-hi);
  --bg: var(--c-bg-1);
  --bg-secondary: var(--c-bg-2);
  --bg-tertiary: #1c1c21;
  --card: var(--c-card-solid);
  --card-bg: var(--c-card-bg);
  --text: var(--c-text);
  --text-primary: var(--c-text-hi);
  --text-secondary: var(--c-text-mid);
  --text-muted: var(--c-text-dim);
  --gray: var(--c-text-mid);
  --ink: var(--c-text-hi);
  --border: var(--c-line);
  --border-light: var(--c-line);
  --border-medium: var(--c-line-strong);
  --border-color: var(--c-line);
  --gold: var(--c-gold);
  --gold-light: var(--c-gold-hi);
  --gold-dark: var(--c-gold-deep);
  --vermilion: var(--c-red);
  --jade: var(--c-green);

  /* 发光收敛：旧版是满屏蓝色 text-shadow，这里统一降级为柔和描边表达 */
  --glow-blue: 0 0 20px rgba(217, 180, 90, .22);
  --glow-blue-strong: 0 0 30px rgba(217, 180, 90, .32);
  --shadow: 0 4px 20px rgba(0, 0, 0, .55);
}

/* ═══════════════════════════════════════════════════════════
 * 中文排版基线（Raycast 规则）
 * 拉丁字母才适合负字距；中文方块字必须正字距 + 高行高
 * ═══════════════════════════════════════════════════════════ */
html {
  font-family: var(--font);
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
}

body {
  font-family: var(--font);
  /* 中文行高下限 1.7，全角标点才不显挤 */
  line-height: 1.7;
  /* 中文正字距：屏息感来自留白而非挤压 */
  letter-spacing: .2px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 标题：字重只用 600/700/800，禁用 500 以下的细体做中文标题 */
h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
  letter-spacing: .3px;
  line-height: 1.4;
}

/* 中文段落不下沉字重，只用正字距拉开可读性 */
p { color: var(--c-text); }

/* 代码块：中文注释与西文混排的行高补偿 */
pre, code, code-preview, .code-preview {
  font-family: var(--mono);
  line-height: 1.85;
}

/* ═══════════════════════════════════════════════════════════
 * 旧「发光」样式全局收敛
 * 旧设计用 text-shadow 表达强调，与新的「描边分级」冲突。
 * 这里重置到中性，具体强调仍由 xiayu-design.css 的描边承担。
 * ═══════════════════════════════════════════════════════════ */
header nav a,
header nav a:hover,
.logo,
.search-box button:hover {
  text-shadow: none !important;
}

/* 通用：焦点可见性（无障碍） */
:focus-visible {
  outline: 2px solid var(--c-gold);
  outline-offset: 2px;
}