/* ==========================================================================
   tokens.css — 设计令牌。全站唯一来源，改这里就够。
   颜色按「用途」拆开：同一支主色既当按钮底又当链接字，必有一头不达标。
   ========================================================================== */

:root {
  color-scheme: light;

  /* 品牌色 ---------------------------------------------------------------- */
  --brand: #d2335c;          /* 只做填充：按钮底 / 选中片底（白字 4.8:1） */
  --brand-ink: #c2264f;      /* 只做文字：浅底上的链接与强调（5.7:1） */
  --brand-mark: #d2335c;     /* 只做图形：圆点 / 图标描边（≥3:1 即可） */
  --brand-surface: #fff0f4;  /* 浅粉面：图标块 / 标签底 */
  --brand-tint: #fff7f9;     /* 最浅粉底：首屏与页头带 */

  /* 浅底文本 -------------------------------------------------------------- */
  --text: #1a171c;           /* 标题 15.9:1 */
  --text-body: #6e6572;      /* 正文 5.6:1 */
  --text-muted: #6f6775;     /* 次级 5.4:1 —— 全站收敛成这一支 */
  --text-large: #8a818f;     /* 仅限 ≥24px 大字号（3.7:1，够 3:1 门槛） */

  /* 深底文本 -------------------------------------------------------------- */
  --text-invert: #ffffff;
  --text-invert-link: #c3b9c8;  /* 9.6:1 */
  --text-invert-mute: #9a8fa0;  /* 5.9:1 */
  --text-invert-head: #8a7f90;  /* 4.8:1 */

  /* 线与面 ---------------------------------------------------------------- */
  --line: #f2e7eb;
  --line-soft: #f4eaf0;
  --surface: #ffffff;
  --surface-soft: #fdfbfc;
  --surface-dark: #17141a;
  --surface-dark-2: #1a171c;

  /* 宽度：只有两档 -------------------------------------------------------- */
  --w-container: 1440px;     /* 页面外框（含两侧留白，内容宽 = 1440 − 2×80） */
  --w-prose: 680px;          /* 长文阅读宽度 */

  /* 间距 ------------------------------------------------------------------ */
  --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: 56px;
  --sp-10: 72px;
  --sp-11: 92px;

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

  /* 字号 ------------------------------------------------------------------ */
  --f-display: 62px;
  --f-h1: 52px;
  --f-h2: 44px;
  --f-h3: 32px;
  --f-h4: 26px;
  --f-h5: 21px;
  --f-lead: 16px;
  --f-body: 14.5px;
  --f-sm: 13px;
  --f-xs: 12.5px;
  --f-2xs: 11.5px;

  /* 字体 ------------------------------------------------------------------ */
  /* 不引外链字体：中文字体动辄数 MB，交给系统栈既快又不闪字。 */
  --font-sans: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB",
    "Microsoft YaHei", system-ui, -apple-system, sans-serif;
  --font-display: "Archivo Black", "Arial Black", "Helvetica Neue", var(--font-sans);
  --font-num: "Bebas Neue", "Oswald", "Arial Narrow", "Roboto Condensed", var(--font-sans);

  /* 阴影 ------------------------------------------------------------------ */
  --shadow-card: 0 18px 46px -12px rgba(212, 51, 92, 0.1);
  --shadow-cover: 0 22px 48px -14px rgba(212, 51, 92, 0.22);

  /* 节奏 ------------------------------------------------------------------ */
  --gutter: 80px;
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
}

/* 字号整体降档：改这一处，全站生效 ---------------------------------------- */
@media (max-width: 1024px) {
  :root {
    --gutter: 40px;
    --f-display: 46px;
    --f-h1: 40px;
    --f-h2: 34px;
    --f-h3: 27px;
    --f-h4: 22px;
    --f-h5: 19px;
  }
}

@media (max-width: 640px) {
  :root {
    --gutter: 20px;
    --f-display: 34px;
    --f-h1: 32px;
    --f-h2: 27px;
    --f-h3: 23px;
    --f-h4: 20px;
    --f-h5: 18px;
    --f-lead: 15px;
  }
}