/* ============================================================
   tokens.css —— 设计令牌（六组：色/字号/间距/圆角/阴影/时长）
   视觉基调：Linear + Stripe Dashboard + Ant Design 5
   低饱和主色 / 8px 网格 / 12-16 圆角 / 单层低透明阴影 / 无边框卡片
   ============================================================ */

:root {
  /* ---------- 组1：色彩（12 项，低饱和主色系） ---------- */
  --color-primary: #4263eb;          /* 主色：低饱和靛蓝（白底对比 4.98:1） */
  --color-primary-hover: #3b5bdb;
  --color-primary-active: #2f4bc0;
  --color-primary-bg: #eef1fd;       /* 主色弱背景 */
  --color-success: #1e7a52;          /* 成功/低风险（低饱和绿，弱底对比 4.74:1） */
  --color-success-bg: #e6f6ef;
  --color-warning: #8a5a12;          /* 警示/中风险（低饱和琥珀，弱底对比 5.36:1） */
  --color-warning-bg: #fbf3e4;
  --color-danger: #c0392b;           /* 失败/高风险（低饱和红） */
  --color-danger-bg: #fbeae8;
  --color-neutral: #566070;          /* 中性状态色（弱底对比 ≥4.5:1） */
  --color-neutral-bg: #f1f3f7;
  --color-bg-page: #f6f7fa;          /* 页面底色 */
  --color-bg-card: #ffffff;          /* 卡片底色（无边框卡片） */

  /* ---------- 组2：字号（6 项，正文 14/16px） ---------- */
  --font-size-xs: 12px;
  --font-size-sm: 13px;
  --font-size-base: 14px;            /* 正文 */
  --font-size-md: 16px;              /* 正文大/标题 */
  --font-size-lg: 20px;              /* 页面标题 */
  --font-size-xl: 26px;              /* 数字指标 */

  /* ---------- 组3：间距（8 项，8px 网格） ---------- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 40px;
  --space-8: 48px;

  /* ---------- 组4：圆角（4 项，12/16 圆角） ---------- */
  --radius-sm: 8px;                  /* 小控件 */
  --radius-md: 12px;                 /* 输入框/标签/按钮 */
  --radius-lg: 16px;                 /* 卡片 */
  --radius-full: 999px;              /* 胶囊 */

  /* ---------- 组5：阴影（2 项，单层低透明） ---------- */
  --shadow-card: 0 1px 3px rgba(28, 39, 64, 0.06);       /* 卡片单层低透明 */
  --shadow-pop: 0 4px 12px rgba(28, 39, 64, 0.10);       /* 浮层单层 */

  /* ---------- 组6：时长（3 项，禁超 250ms / 禁 linear） ---------- */
  --duration-fast: 150ms;
  --duration-base: 200ms;
  --duration-slow: 250ms;
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);

  /* ---------- --el-* 变量覆盖（13 项：主色5/文字3/圆角2/边框背景2+1） ---------- */
  --el-color-primary: var(--color-primary);
  --el-color-primary-light-3: #7b93f8;
  --el-color-primary-light-5: #a5b5fa;
  --el-color-primary-light-7: #d0d9fd;
  --el-color-primary-light-9: var(--color-primary-bg);
  --el-text-color-primary: #1d2129;   /* 对比度 15.1:1 */
  --el-text-color-regular: #4e5969;   /* 对比度 7.4:1 */
  --el-text-color-secondary: #626a76; /* 对比度 5.5:1 */
  --el-border-radius-base: 8px;
  --el-border-radius-round: 999px;
  --el-border-color: #e4e7ee;         /* 边框（仅分隔线用，卡片无边框） */
  --el-border-color-light: #eef0f5;
  --el-bg-color: #ffffff;
  --el-fill-color-light: #f4f6f9;
}

/* 正文基准 14/16px */
body {
  font-family: "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  line-height: 1.6;
  color: var(--el-text-color-primary);
  background: var(--color-bg-page);
}