/* ==========================================================================
   tokens.css — 设计令牌（全站唯一来源）
   颜色按「用途」拆分：填充 / 文字 / 图形 分开定义，避免一支色两用导致对比度塌陷
   宽度只留两档：--w-container（区块内容）/ --w-prose（长文与问答列表）
   ========================================================================== */

/* ==========================================================================
   自托管字体（原来走 Google Fonts，2026-09-30 本地化）
   --------------------------------------------------------------------------
   为什么必须本地化：原来 head 里用 <link rel="stylesheet"> 引 Google Fonts 的 CSS，
   而它是**渲染阻塞**资源。中国大陆访问不到 Google 的字体域名 → 浏览器要等
   TCP 连接超时才继续渲染 → 首屏白屏数秒。自托管后零外部依赖。
   注：两个字体都是「可变字体」，Google 对 400/700 返回的是同一个文件（md5 相同），
   所以每个字体只存 1 个 woff2；仍写两条声明是为兼容不做可变轴映射的旧浏览器。
   ========================================================================== */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/SpaceGrotesk.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/SpaceGrotesk.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/JetBrainsMono.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/JetBrainsMono.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* ---------- 底色 ---------- */
  --bg: #05060C;
  --bg-footer: #04050A;

  /* ---------- 面（叠加在深底上的半透明白，保持光晕透出） ---------- */
  --surface-1: rgba(255, 255, 255, 0.032);   /* 卡片 */
  --surface-2: rgba(255, 255, 255, 0.055);   /* 卡片 hover / 次级块 */
  --surface-3: rgba(255, 255, 255, 0.024);   /* 声明条、三步条 */
  --surface-inset: rgba(0, 0, 0, 0.25);      /* 命令行内嵌块 */
  --surface-tint: rgba(46, 139, 255, 0.10);  /* 品牌浅底 */
  --surface-tint-2: rgba(46, 139, 255, 0.15);/* 品牌标签底 */
  --line: rgba(255, 255, 255, 0.075);
  --line-strong: rgba(255, 255, 255, 0.14);

  /* ---------- 品牌色（三支，用途互不重叠） ----------
     --brand       仅做装饰：光晕、圆点、图标描边、分隔强调（≥3.0 即可）
     --brand-solid 仅做填充：按钮底、徽章底（考核「白字压得住吗」= 4.98:1）
     --brand-ink   仅做文字：深底上的链接与强调（考核「读得清吗」= 7.4:1）
     把 --brand 直接当按钮底会掉到 3.36:1，低于正文 AA —— 这就是必须拆的原因 */
  --brand: #2E8BFF;
  --brand-solid: #1E6FE0;
  --brand-solid-hover: #175BC4;
  --brand-ink: #5B9DFF;

  /* ---------- 文字（深底三级，全部 ≥4.5:1） ---------- */
  --text: #FFFFFF;                        /* 20.2:1 */
  --text-body: rgba(255, 255, 255, 0.74); /* 10.5:1 */
  --text-mute: rgba(255, 255, 255, 0.56); /*  6.5:1 */

  /* ---------- 语义色（指南页格式支持 / 暂不支持） ---------- */
  --ok: #13DDC4;
  --ok-bg: #0E2416;
  --ok-line: rgba(19, 221, 196, 0.22);
  --warn: #FF8DA1;
  --warn-bg: #241114;
  --warn-line: rgba(255, 77, 109, 0.22);

  /* ---------- 字体 ---------- */
  --font-body: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  --font-display: "Space Grotesk", "Noto Sans SC", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  /* ---------- 字号（桌面档，移动端在 layout.css 里整体降档） ---------- */
  --fs-hero: 76px;
  --fs-page-title: 56px;
  --fs-h2: 46px;
  --fs-h3: 36px;
  --fs-feature: 34px;
  --fs-lead: 20px;
  --fs-body: 16px;
  --fs-card: 21px;
  --fs-item: 19px;
  --fs-meta: 14.5px;
  --fs-sm: 15px;
  --fs-xs: 13px;
  --fs-micro: 12.5px;

  /* ---------- 间距 ---------- */
  --sp-1: 4px;   --sp-2: 8px;   --sp-3: 12px;  --sp-4: 16px;
  --sp-5: 20px;  --sp-6: 24px;  --sp-7: 32px;  --sp-8: 40px;
  --sp-9: 48px;  --sp-10: 56px; --sp-11: 72px; --sp-12: 88px; --sp-13: 96px;

  /* ---------- 区块节奏 ---------- */
  --section-py: 110px;
  --gutter: 24px;
  --header-h: 72px;

  /* ---------- 圆角 ---------- */
  --r-xs: 6px;
  --r-sm: 8px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 16px;
  --r-pill: 999px;

  /* ---------- 宽度：内容列两档 + 引导段一档 ---------- */
  --w-container: 1200px;
  --w-prose: 1000px;
  /* 所有引导段（Hero / 内页页头 / 区块标题下）共用同一行宽。
     分头写 760 / 780 这种差值肉眼看不出来，但正是「宽度各种大小」的来源 */
  --w-lead: 760px;
}