/* ============================================================
   tokens.css —— 设计变量（唯一来源）
   主色取自 design-spec：深钢青 #175450；CTA 橙 #E8833A。
   组件 CSS 只引用这里的变量，禁止裸 HEX（主色/CTA 二色除外）。
   ============================================================ */
:root{
  /* ===== 品牌主色 · 深钢青 ===== */
  --color-brand-50:#EFF7F6; --color-brand-100:#D6EBE9; --color-brand-200:#A9D6D2;
  --color-brand-300:#7BBDB7; --color-brand-400:#4FA29B; --color-brand-500:#2C8580;
  --color-brand-600:#1F6B67; --color-brand-700:#175450; --color-brand-800:#103E3B;
  --color-brand-900:#0A2B29;

  /* ===== 辅助强调 · 高温琥珀 ===== */
  --color-accent-50:#FEF6E7; --color-accent-100:#FCEBC8; --color-accent-300:#F2D08A;
  --color-accent-600:#96550A; --color-accent-700:#8A5A0B;

  /* ===== 中性 · 冷灰 ===== */
  --color-neutral-0:#FFFFFF;  --color-neutral-50:#F7F9FA;  --color-neutral-100:#EDF1F4;
  --color-neutral-200:#DCE3E8;--color-neutral-300:#C3CDD5; --color-neutral-400:#9BA8B3;
  --color-neutral-500:#657380;--color-neutral-600:#52606B; --color-neutral-700:#3B4750;
  --color-neutral-800:#263039;--color-neutral-900:#161E24;

  /* ===== 语义色 ===== */
  --color-success-bg:#E6F4EC; --color-success-border:#A8D5BC;
  --color-success-text:#1F6B45; --color-success-solid:#1F7A52;
  --color-warning-bg:#FEF6E7; --color-warning-border:#F2D08A;
  --color-warning-text:#8A5A0B; --color-warning-solid:#96550A;
  --color-danger-bg:#FDEDEC;  --color-danger-border:#F3B9B4;
  --color-danger-text:#96271D;  --color-danger-solid:#A32E22;
  --color-info-bg:#EAF2F8;    --color-info-border:#AFCBDF;
  --color-info-text:#1C5480;    --color-info-solid:#1B5B86;

  /* ===== 语义角色（组件只引用这些） ===== */
  --color-bg:#FFFFFF; --color-bg-alt:#F7F9FA;
  --color-surface:#FFFFFF; --color-surface-alt:#EDF1F4; --color-surface-strong:#161E24;
  --color-text-title:#263039;      --color-text-body:#3B4750;
  --color-text-secondary:#52606B;  --color-text-tertiary:#657380;
  --color-text-inverse:#DFE5E9;    --color-text-on-brand:#FFFFFF;
  --color-link:#1F6B67; --color-link-hover:#103E3B; --color-link-visited:#175450;
  --color-border:#DCE3E8; --color-border-strong:#C3CDD5; --color-border-input:#85909B;
  --color-disabled-bg:#EDF1F4; --color-disabled-text:#9BA8B3;
  --color-header-bg:#FFFFFF; --color-footer-bg:#161E24;
  --color-focus-ring:#1F6B67; --color-focus-ring-inv:#FFFFFF;

  /* ===== 站点主色 / CTA（规格卡强制值） ===== */
  --color-primary:#175450;     /* 深钢青 */
  --color-primary-dark:#103E3B;
  --color-cta:#E8833A;         /* CTA 橙 */
  --color-cta-dark:#C96C24;
  --color-cta-text:#FFFFFF;

  /* ===== 字体 ===== */
  --font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",
    "Hiragino Sans GB","Microsoft YaHei","Source Han Sans SC","Noto Sans CJK SC",
    "Helvetica Neue",Arial,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono","Courier New",monospace;
  --fs-h1:28px; --fs-h2:22px; --fs-h3:18px; --fs-h4:16px; --fs-lead:16px;
  --fs-body:16px; --fs-sm:14px; --fs-xs:13px; --fs-xxs:12px; --fs-label:14px;
  --fs-figure:40px; --fs-figure-sub:18px;
  --lh-tight:1.25; --lh-heading:1.35; --lh-body:1.75; --lh-relaxed:1.8;
  --lh-compact:1.6; --lh-figure:1.1;
  --ls-cn:0.01em; --ls-cn-title:-0.01em; --ls-tag:0.02em; --ls-num:0;
  --fw-regular:400; --fw-medium:600; --fw-bold:700;

  /* ===== 间距 ===== */
  --space-0:0; --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  --space-5:20px; --space-6:24px; --space-8:32px; --space-10:40px; --space-12:48px;
  --space-16:64px; --space-20:80px; --space-24:96px; --space-32:128px;
  --space-stack-xs:8px; --space-stack-sm:12px; --space-stack-md:16px; --space-stack-lg:24px;
  --space-card-pad:16px; --space-section-sm:48px; --space-section-md:64px;
  --space-section-lg:96px; --space-gutter:16px; --space-safe-x:16px;

  /* ===== 容器与栅格 ===== */
  --container-wide:1200px; --container-prose:720px; --container-narrow:520px;
  --grid-cols:12; --safe-bottom:env(safe-area-inset-bottom,0px);

  /* ===== 圆角 / 阴影 / 描边 ===== */
  --radius-sm:2px; --radius-md:4px; --radius-lg:6px; --radius-xl:8px; --radius-pill:999px;
  --shadow-sm:0 1px 2px rgba(22,30,36,.06);
  --shadow-md:0 -2px 12px rgba(22,30,36,.10);
  --shadow-lg:0 8px 32px rgba(22,30,36,.16);
  --stroke-1:1px; --stroke-2:2px; --stroke-accent:4px;

  /* ===== 层级 ===== */
  --z-base:0; --z-sticky:10; --z-peek:55; --z-cta-bar:60;
  --z-overlay:80; --z-drawer:90; --z-skip:100;

  /* ===== 动效 ===== */
  --ease-decel:cubic-bezier(.2,0,0,1); --ease-std:cubic-bezier(.4,0,.2,1);
  --dur-fast:120ms; --dur-std:200ms; --dur-slow:240ms;

  /* ===== 尺寸常量 ===== */
  --h-header:56px; --h-btn:44px; --h-input:44px; --h-touch:44px;
  --h-cta-bar:56px; --h-result-peek:52px; --h-nav-item-drawer:52px;
  --w-form-col:420px; --w-toc-col:240px;
}

/* 断点覆盖 */
@media (min-width:768px){
  :root{ --space-safe-x:24px; --space-card-pad:24px; --h-header:64px; }
}
@media (min-width:1024px){
  :root{ --fs-h1:40px; --fs-h2:30px; --fs-h3:22px; --fs-h4:18px; --fs-lead:18px;
         --fs-figure:48px; --fs-figure-sub:20px;
         --space-safe-x:32px; --space-gutter:24px;
         --space-section-lg:96px; --w-form-col:420px; }
}
@media (min-width:1280px){
  :root{ --space-section-lg:112px; --w-form-col:440px; }
}
