/* 设计令牌 —— 视觉语言的唯一来源（PRD 10.1）。
 *
 * 约定：
 * 1. 颜色、字体、字号、行高、间距、圆角、阴影、动效时长一律在此定义；
 *    其他样式文件与模板只写 var(--token)，不出现硬编码色值。
 * 2. 七个领域色成对出现：`--domain-<code>` 为主色，`--domain-<code>-soft` 为浅底。
 *    令牌名与种子数据 `domains.color_token` 一致，主色在对应浅底上的对比度均 ≥ 4.5:1；
 *    `--domain-network` 与 `--domain-general` 在 PRD 建议值基础上略作压暗以满足该要求。
 * 3. 断点无法写在 @media 的条件里（自定义属性在媒体查询中不展开），因此三档断点
 *    以 `--bp-*` 变量记录数值供脚本与文档引用，真正的 @media 条件写在 base.css 中，
 *    数值必须与此处一致：≤639px 移动 / 640–1023px 平板 / ≥1024px 桌面。
 */

:root {
  color-scheme: light;

  /* 基础色板（PRD 10.1 色彩令牌） */
  --ink-950: #081522; /* 顶部导航 / 深色区域背景 */
  --ink-900: #0e2238; /* 标题文字 */
  --ink-700: #29435c; /* 正文文字 */
  --ink-500: #5b7186; /* 次要文字 */
  --ink-300: #9db0c2; /* 占位 / 禁用 */
  --line: #dce5ee; /* 分隔线 / 边框 */
  --surface: #ffffff; /* 卡片 / 内容背景 */
  --canvas: #f4f7fa; /* 页面背景 */
  --brand-700: #0b3d6b; /* 主品牌深蓝（按钮 hover、链接） */
  --brand-600: #125a9c; /* 主色（主按钮、选中态） */
  --brand-100: #e3eef9; /* 主色浅底（徽标、选中背景） */
  --cyan-500: #00a6b8; /* 科技青（强调线、图表） */
  --cyan-700: #00646f; /* 青色浅底上的文字色（对比度 ≥ 4.5:1） */
  --cyan-100: #dff6f8; /* 青色浅底 */
  --amber-500: #c77a12; /* 少量强调（示例徽标、警示） */
  --amber-700: #8a5300; /* 琥珀浅底上的文字色（对比度 ≥ 4.5:1） */
  --amber-100: #fbf0de; /* 琥珀浅底 */
  --danger-600: #b42318; /* 危险操作 */
  --danger-100: #fdecea; /* 危险浅底 */
  --success-600: #137a4b; /* 成功状态 */
  --success-100: #e6f4ec; /* 成功浅底 */

  /* 领域色（七对：主色 + 浅底）。
   * 领域图标 `app/static/icons/domain-*.svg` 以 `<img>` 引入，取不到 CSS 变量，
   * 因此把主色写成同样的小写十六进制值 —— 改这里的主色要同步改对应 SVG 的 stroke。 */
  --domain-datacenter: #125a9c;
  --domain-datacenter-soft: #e3eef9;
  --domain-network: #0d767f;
  --domain-network-soft: #dff6f8;
  --domain-compute: #5b4bc4;
  --domain-compute-soft: #ece9fb;
  --domain-cloud: #1f7a5a;
  --domain-cloud-soft: #e3f4ec;
  --domain-token-ai: #9a5b00;
  --domain-token-ai-soft: #fbf0de;
  --domain-fde: #8a3e6b;
  --domain-fde-soft: #f7e8f0;
  --domain-general: #566c80;
  --domain-general-soft: #edf1f5;

  /* 字体栈：只用系统字体，不加载 Web Font */
  --font-sans: "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei", "Noto Sans SC",
    "Source Han Sans SC", system-ui, -apple-system, sans-serif;
  --font-mono: "JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  /* 字号四级标题 + 正文 / 摘要 / 辅助 */
  --text-h1: 32px;
  --text-h2: 24px;
  --text-h3: 20px;
  --text-h4: 17px;
  --text-body: 17px;
  --text-summary: 15px;
  --text-small: 13px;

  --leading-body: 1.85;
  --leading-summary: 1.75;
  --leading-heading: 1.35;
  --tracking-body: 0.01em;
  --tracking-caps: 0.08em;

  /* 间距 */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* 圆角 */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-pill: 999px;

  /* 阴影 */
  --shadow-sm: 0 1px 2px rgb(8 21 34 / 6%);
  --shadow-md: 0 2px 8px rgb(8 21 34 / 10%);

  /* 遮罩：确认对话框的 ::backdrop，压暗背后页面 */
  --overlay-scrim: rgb(8 21 34 / 55%);

  /* 动效（≤ 200ms，仅用于 hover / focus / 展开） */
  --duration-fast: 120ms;
  --duration-base: 180ms;
  --easing-standard: cubic-bezier(0.2, 0, 0.2, 1);

  /* 布局 */
  --content-max: 1200px;
  --article-max: 720px;
  --gutter: 24px;
  --section-gap: 32px;
  --tap-target: 44px;

  /* 断点（供脚本与文档引用；@media 里用同样的数值） */
  --bp-mobile-max: 639px;
  --bp-tablet-min: 640px;
  --bp-tablet-max: 1023px;
  --bp-desktop-min: 1024px;
}