/* ==========================================================================
   tokens.css —— 设计令牌（唯一来源）
   改配色 / 字号 / 圆角 / 宽度，只改这里。
   ========================================================================== */

:root {
  /* ---- 品牌色：按「用途」拆开，三种用途三种值 -------------------------- */
  --brand:          #cf3a52; /* 实心底：按钮 / 徽标 / 邮票块 —— 白字压得住 */
  --brand-ink:      #ef5a72; /* 文字：深底上的粉色字（小标签 / 强调 / 数值） */
  --brand-accent:   #e0455e; /* 图形：图标块底、描边、圆点 —— 上面放深色字 */

  --gold:           #c9a45c; /* 描金：描边 / 图形 / 大标题点缀 */
  --gold-ink:       #ddba76; /* 文字：深底上的金色字（kicker / 小标题） */

  /* ---- 深底三级文字（全部 ≥4.5:1） ------------------------------------ */
  --text:           #f4eee3; /* 标题 */
  --text-body:      #c5c2ce; /* 正文 */
  --text-muted:     #9a98a6; /* 次级说明 */
  --text-dim:       #83818f; /* 最弱一级（版权 / 脚注） */
  --text-on-brand:  #ffffff; /* 品牌底上的字 */

  /* ---- 背景层级 -------------------------------------------------------- */
  --bg:             #0a0c13;
  --bg-alt:         #0b0d15;
  --bg-nav:         #0c0e16;
  --bg-card:        #10131d;
  --bg-card-2:      #151827;
  --bg-panel:       #0d0f18;
  --bg-foot:        #080a10;
  --bg-deep:        #06070c;
  --bg-abyss:       #160f14;
  --bg-tint:        #1a1420; /* 提示条 / 粉调胶囊底 */
  --bg-tint-gold:   #161320; /* 金调胶囊底 */

  /* ---- 描边 ------------------------------------------------------------ */
  --line:           #292e42;
  --line-soft:      #1f2130;
  --line-nav:       #1b1e2a;
  --line-ghost:     #5a4a52;
  --line-neutral:   #6b6b80;

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

  /* ---- 宽度：内容三档 + 一档通栏 ---- */
  --w-container: 1248px; /* 内容宽度：所有区块 / 栅格 / 卡片 */
  --w-narrow: 1080px;    /* 收窄内容宽度：只给「下载 / CTA」这类聚焦区块用 */
  --w-prose: 700px;      /* 阅读宽度：长文段落 */
  --w-chrome: 1440px;    /* 通栏骨架：只有站头 / 页脚这类全宽栏用 */

  /* ---- 字体 ------------------------------------------------------------ */
  --font-serif: "Source Han Serif CN", "Noto Serif SC", "Songti SC", "STSong", "SimSun", serif;
  --font-sans: "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
  --font-latin: "Inter", "Segoe UI", system-ui, sans-serif;

  /* ---- 字号 ------------------------------------------------------------ */
  --fs-display: 92px;
  --fs-banner: 56px;
  --fs-dl: 48px;
  --fs-h2: 44px;
  --fs-h3: 40px;
  --fs-split: 38px;
  --fs-region: 34px;
  --fs-name: 44px;
  --fs-26: 26px;
  --fs-24: 24px;
  --fs-20: 20px;
  --fs-18: 18px;
  --fs-17: 17px;
  --fs-16: 16px;
  --fs-15: 15px;
  --fs-14: 14px;
  --fs-13: 13px;
  --fs-12: 12px;
  --fs-11: 11px;

  /* ---- 间距 ------------------------------------------------------------ */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-7: 28px;
  --sp-8: 36px;
  --sp-9: 44px;
  --sp-10: 56px;

  /* ---- 区块节奏（只在 layout.css 的断点里降档） ------------------------ */
  /* ⚠ `--pad-section` 是**唯一**的横向留白来源，别处不要再叠一层：
     之前 .section 和 .container 各加一次，手机上等于 40+40=80px/侧，
     320px 屏幕只剩 160px 宽的内容。 */
  --pad-section: 96px;
  --pad-section-y: 100px;
  --header-h: 72px;      /* 站头高度（抽屉定位靠它，别再写死 72px） */
  --tap: 44px;           /* 最小触控目标（WCAG 2.5.5 / iOS HIG） */
  --z-header: 50;
  --z-dialog: 100;
}

/* 移动端：字号整体降档，改这一处全站生效 */
@media (max-width: 1200px) {
  :root {
    --pad-section: 56px;
    /* 小字地板：11px 在平板/手机上都偏小，一律提到 12px */
    --fs-11: 12px;
  }
}

@media (max-width: 900px) {
  :root {
    --fs-display: 54px;
    --fs-banner: 38px;
    --fs-dl: 34px;
    --fs-h2: 30px;
    --fs-h3: 28px;
    --fs-split: 28px;
    --fs-region: 26px;
    --fs-name: 32px;
    --fs-26: 22px;
    --fs-24: 20px;
    --pad-section: 28px;
    --pad-section-y: 56px;
    --header-h: 64px;
  }
}

@media (max-width: 560px) {
  :root {
    --fs-display: 42px;
    --fs-banner: 30px;
    --fs-dl: 28px;
    --fs-h2: 25px;
    --fs-h3: 24px;
    --fs-split: 24px;
    --fs-region: 22px;
    --fs-name: 26px;
    --pad-section: 20px;
    --pad-section-y: 48px;
    --header-h: 60px;
  }
}

/* 超窄机（iPhone SE 一代 / 老旧安卓）：再收一点，保住内容宽度 */
@media (max-width: 380px) {
  :root { --pad-section: 16px; }
}
