/* ============================================================
   tokens.css —— 设计变量（色板 / 间距 / 字号 / 圆角 / 断点 / 安全区）
   无构建：全部为原生 CSS 自定义属性
   ============================================================ */
:root {
  /* ---------- 品牌色 ---------- */
  --c-brand: #0a7d5a;          /* Ethio 绿 */
  --c-brand-dark: #066147;
  --c-brand-light: #e6f4ef;
  --c-accent: #f5a623;         /* 金币金 */
  --c-accent-dark: #d98914;
  --c-danger: #c62828;
  --c-danger-light: #fdecec;
  --c-warn: #b26a00;
  --c-info: #1565c0;

  /* ---------- 中性 ---------- */
  --c-bg: #f6f7f9;
  --c-surface: #ffffff;
  --c-surface-2: #eef1f4;
  --c-border: #dfe4e9;
  --c-border-strong: #c3ccd4;
  --c-text: #14181d;
  --c-text-2: #4a5560;
  --c-text-3: #77828d;
  --c-inverse: #ffffff;
  --c-overlay: rgba(10, 14, 18, 0.52);

  /* ---------- 间距（4px 基准） ---------- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-10: 40px;
  --sp-12: 48px;
  --sp-16: 64px;

  /* ---------- 字号（≥16px 避免 iOS 输入缩放） ---------- */
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-base: 16px;
  --fs-md: 18px;
  --fs-lg: 20px;
  --fs-xl: 24px;
  --fs-2xl: 28px;
  --fs-3xl: 34px;

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

  /* ---------- 阴影 ---------- */
  --sh-1: 0 1px 2px rgba(16, 24, 32, 0.06);
  --sh-2: 0 2px 8px rgba(16, 24, 32, 0.08);
  --sh-3: 0 8px 24px rgba(16, 24, 32, 0.12);
  --sh-modal: 0 16px 48px rgba(16, 24, 32, 0.24);

  /* ---------- 触控目标（P0-31） ---------- */
  --tap: 44px;

  /* ---------- 布局 ---------- */
  --container: 1240px;
  --header-h: 60px;

  /* ---------- 断点（媒体查询直写数值，此处仅供文档/JS 读取） ---------- */
  --bp-sm: 360px;
  --bp-md: 390px;
  --bp-lg: 768px;
  --bp-xl: 1280px;

  /* ---------- 安全区 ---------- */
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);

  /* ---------- 动效 ---------- */
  --t-fast: 120ms;
  --t-base: 200ms;
}

/* 后台控制台用略紧凑的密度 */
:root {
  --admin-sidebar: 208px;
}