/* ═══════════════════════════════════════════════════════════
   CSI MaaS Design Tokens v1.0
   引入方式：<link rel="stylesheet" href="../shared/tokens.css">
   规范来源：MaaS平台全站视觉统一与交互动效优化方案 §4.1
   ═══════════════════════════════════════════════════════════ */
:root{

  /* ── 1. 明度弧线（页面背景，全站统一三段） ────────────── */
  --bg-0:#F7F5F2;        /* 页面基底：Hero / 首要板块 */
  --bg-1:#F1EEE8;        /* 次级带：需要与基底分层的板块 */
  --bg-2:#ECE7DD;        /* 暖砂带：信任区 / 收尾板块 */
  --surface:#FFFFFF;     /* 卡面起点 */
  --surface-2:#FDFBF8;   /* 卡面渐变终点（160deg） */
  --surface-sunk:#F6F4F1;/* 内凹区 / 媒体位底色 */
  --ink-panel:#101319;   /* 深色控制台 / 代码块 */

  /* ── 2. 墨色（文本） ──────────────────────────────────── */
  --ink-1:#0C0E15;       /* 标题（对 --bg-0 对比度 17.8:1） */
  --ink-2:#3F414A;       /* 正文（对 --bg-0 对比度 9.4:1） */
  --ink-3:#6E727C;       /* 辅助文字（对 --bg-0 对比度 4.9:1 ✅AA） */
  --ink-4:#9AA0A9;       /* 占位符 / 禁用（仅用于非文本或 ≥18px） */
  --ink-inv:#FFFFFF;     /* 深底反白 */

  /* ⚠️ 原首页 --ink-3:#7D828C 对比度 4.1:1 未达 AA，已上调为 #6E727C */

  /* ── 3. 品牌金阶（全站唯一一条彩色轴） ────────────────── */
  --gold-50:#FAF6F0;
  --gold-100:#F2E9DB;    /* 图标底板 / 标签底 */
  --gold-200:#E2D0B4;    /* 标签描边 */
  --gold-300:#CBAE82;    /* hover 描边 / 渐变起点 */
  --gold-400:#B08D5E;    /* 短横 rule / 装饰线 */
  --gold-500:#A67C4A;    /* ★ 品牌主色，唯一 */
  --gold-600:#8A6338;    /* 金色文字（对白底 5.1:1 ✅AA） */
  --gold-700:#6B4B2A;    /* 金色文字 hover / 深色标签字 */

  /* ── 4. 冷色副轴（取自月面阴影，仅作平衡） ────────────── */
  --cool-300:#B9C3D1;
  --cool-500:#7C8899;
  --cool-700:#444D5C;

  /* ── 5. 深色控件 ─────────────────────────────────────── */
  --btn-dark:#0B0D12;
  --btn-dark-h:#1C2030;

  /* ── 6. 语义色 ───────────────────────────────────────── */
  --success:#3F8F63;  --success-bg:#E8F3ED;
  --warn:#A9762A;     --warn-bg:#FAF1E0;
  --danger:#C0392F;   --danger-bg:#FAEBE9;
  --info:#4A5C72;     --info-bg:#EDF1F6;

  /* ── 7. 描边 ─────────────────────────────────────────── */
  --line-1:rgba(20,20,30,.08);   /* 常规分割 */
  --line-2:rgba(20,20,30,.14);   /* 强调分割 / 输入框 */
  --line-gold:rgba(176,134,70,.34);

  /* ── 8. 阴影（三档 + 一档金色，色相统一为中性） ────────── */
  --sh-1:0 1px 2px rgba(20,20,30,.04), 0 6px 16px rgba(20,20,30,.045);
  --sh-2:0 2px 4px rgba(20,20,30,.05), 0 18px 38px rgba(20,20,30,.10);
  --sh-3:0 4px 10px rgba(20,20,30,.06), 0 30px 64px rgba(20,20,30,.14);
  --sh-gold:0 8px 24px rgba(166,124,74,.18);
  --sh-inset:inset 0 1px 0 rgba(255,255,255,.9);

  /* ── 9. 圆角（收敛到 6 档，禁止其它值） ────────────────── */
  --r-xs:6px;    /* 标签 pill / 极小按钮 */
  --r-sm:8px;    /* 按钮 / 输入框 */
  --r-md:12px;   /* 图标底板 / 小卡 / 表格 */
  --r-lg:16px;   /* 主卡片 ★默认 */
  --r-xl:24px;   /* CTA 横幅 / 大容器 */
  --r-full:999px;

  /* ── 10. 字体栈（§5.3：Inter 接管西文/数字，雅黑降至末位；
        已删除 YaHei Light / DengXian / SimSun） ─────────── */
  --f-sans:"Inter","Noto Sans SC","PingFang SC","HarmonyOS Sans SC",
           system-ui,-apple-system,"Microsoft YaHei",sans-serif;
  --f-serif:"Noto Serif SC","Source Han Serif SC",
            "Songti SC",serif;
  --f-mono:"JetBrains Mono",ui-monospace,"SF Mono",
           "Cascadia Code",Consolas,monospace;

  /* ── 11. 字号阶梯（流体） ────────────────────────────── */
  --fs-display:clamp(34px,4.4vw,56px);  /* 登录页 / 特殊 Hero */
  --fs-h1:clamp(28px,3.4vw,44px);       /* 页面 Hero 主标 */
  --fs-h2:clamp(24px,2.6vw,34px);       /* 板块标题 */
  --fs-h3:20px;                          /* 卡片主标 */
  --fs-h4:17px;                          /* 卡内小标 */
  --fs-lead:16px;                        /* Hero 描述 / 引导语 */
  --fs-body:15px;                        /* 正文 ★ */
  --fs-sm:13px;                          /* 卡片描述 / 表格 ★下限 */
  --fs-xs:12px;                          /* 标签 / 页脚（仅装饰性） */
  --fs-mono:11px;                        /* eyebrow / 编号 */

  /* ── 12. 行高 ───────────────────────────────────────── */
  --lh-tight:1.25;   /* h1 */
  --lh-title:1.32;   /* h2 / h3 */
  --lh-snug:1.5;     /* h4 / 短句 */
  --lh-body:1.78;    /* 中文正文 ★ */
  --lh-loose:1.85;   /* 长段落 */

  /* ── 13. 字距（中文需正字距，西文需负） ─────────────── */
  --ls-tight:-0.01em; /* 大字号西文 */
  --ls-h:0.015em;     /* 中文标题 */
  --ls-body:0.02em;   /* 中文正文 ★ */
  --ls-label:0.04em;  /* 按钮 / 标签 */
  --ls-mono:0.24em;   /* eyebrow */

  /* ── 14. 字重（仅 4 档，禁止 650/520/380 这类非常规值） ── */
  --fw-regular:400;
  --fw-medium:500;
  --fw-semibold:600;
  --fw-bold:700;

  /* ── 15. 间距（4px 基准） ───────────────────────────── */
  --sp-1:4px;   --sp-2:8px;   --sp-3:12px;  --sp-4:16px;
  --sp-5:24px;  --sp-6:32px;  --sp-7:48px;  --sp-8:64px;
  --sp-9:96px;  --sp-10:128px;

  /* ── 16. 版心与栅格 ─────────────────────────────────── */
  --maxw:1200px;        /* ★ 全站统一内容栏 */
  --maxw-narrow:800px;  /* 长文 / 表单 */
  --maxw-wide:1440px;   /* 通栏媒体 */
  --gutter:40px;        /* 桌面左右边距 */
  --grid-gap:24px;      /* 栅格列间距 */

  /* ── 17. 组件尺寸 ───────────────────────────────────── */
  --header-h:64px;      /* ★ 全站统一导航高 */
  --header-h-m:56px;    /* 移动端 */
  --btn-h-lg:48px;
  --btn-h-md:44px;      /* ★ 默认（满足 44px 触控标准） */
  --btn-h-sm:40px;
  --btn-h-xs:32px;
  --card-pad:24px;
  --card-pad-m:20px;
  --media-h:180px;      /* 卡片媒体位高度（桌面） */
  --media-h-m:160px;

  /* ── 18. 缓动与时长 ─────────────────────────────────── */
  --e-out:cubic-bezier(.2,.7,.2,1);      /* 通用出场 */
  --e-mask:cubic-bezier(.16,1,.3,1);     /* 遮罩 / 绘制 */
  --e-soft:cubic-bezier(.2,.6,.2,1);     /* 颜色 / 状态 */
  --e-back:cubic-bezier(.34,1.56,.64,1); /* 节点弹入（唯一允许的回弹） */
  --d-fast:180ms;
  --d-base:300ms;
  --d-slow:620ms;
  --d-reveal:820ms;
  --d-draw:900ms;

  /* ── 19. 层级 ───────────────────────────────────────── */
  --z-base:1; --z-sticky:50; --z-header:60;
  --z-dropdown:70; --z-modal:100; --z-toast:120;
}

@media (max-width:1023px){ :root{ --gutter:32px; --grid-gap:20px; } }
@media (max-width:767px){
  :root{
    --gutter:20px; --grid-gap:16px;
    --header-h:56px; --card-pad:20px;
    --fs-body:14.5px; --media-h:160px;
  }
}
