/* 成都区域中心 · 共享 UI 底座 — Design Token（唯一实现源）
 * 规范：cd-center/UI-DESIGN-SYSTEM.md v2.0 §4（Single Source of Truth）
 *       cd-center/design.md v3.0 §03（冲突时以 v2.0 为准）
 * 品牌橙唯一权威值 #7fcc3f（采样自 AnnieKids 经典 logo）
 * 沙盒副本：工作区根 center-ui/（须与本文件保持一致）
 * ⚠️ 本目录 public/center-ui/ 是部署源；缺少它会导致引用方 @import 被 SPA 兜底成 HTML。 */
:root {
  /* ===== Brand（权威取值 = design.md §03 --accent 系列）===== */
  --brand-primary: #7fcc3f; --brand-hover: #66a830; --brand-active: #4e8026; --brand-soft: #f4fbeb; --brand-line: #dcf3ca;

  /* 兼容别名：§03 的 --accent* ↔ center-ui 的 --brand-*（语义等价，只读）
     仅作过渡，新代码一律直接用 --brand-*；同一页面禁止两套混写。 */
  --accent: var(--brand-primary); --accent-hover: var(--brand-hover);
  --accent-active: var(--brand-active); --accent-deep: var(--brand-active);
  --accent-soft: var(--brand-soft); --accent-line: var(--brand-line);
  /* 兼容别名：内联样式里写作 var(--brand) 的历史代码 */
  --brand: var(--brand-primary);

  /* ===== 高级童趣 · 支撑色系（低饱和 / 可共存）=====
     每页只用「1 主 + 1 辅 + 中性」，其余颜色仅用于状态或小面积点缀。 */
  --sf-cream: #EBD9A8;   --sf-cream-soft: #FBF5E4;   /* 奶油黄 */
  --sf-sage: #93AE8B;    --sf-sage-soft: #EDF3EA;    /* 鼠尾草绿 */
  --sf-mist: #8AA6C0;    --sf-mist-soft: #EDF2F7;    /* 雾霾蓝 */
  --sf-apricot: #E3A578; --sf-apricot-soft: #FAEFE6; /* 暖橘 */
  --sf-lilac: #A79BC2;   --sf-lilac-soft: #F1EEF7;   /* 柔和紫 */
  --sf-coral: #E0786C;   --sf-coral-soft: #FBEDEA;   /* 品牌血缘珊瑚 */

  /* ===== Surface（对齐 §03 Neutral；暖奶油底，不再纯白到底）===== */
  --bg-app: #F7F5F1; --bg-elevated: #FFFFFF; --bg-subtle: #FBF9F5; --bg-hover: #F8F6F2; --bg-active: #F2F0EB;
  --bg-cream: #FDFBF7; --card-warm: #FFFDF9;
  /* 兼容别名 */
  --bg-page: var(--bg-app); --bg-panel: var(--bg-elevated);

  /* ===== Text（对齐 §03）===== */
  --text-primary: #1A1D24; --text-secondary: #6E737C; --text-tertiary: #9AA3B2; --text-disabled: #B4BAC3; --text-inverse: #FFFFFF;

  /* ===== Border（对齐 §03）===== */
  --border-primary: #DDE0E5; --border-secondary: #EBEDF0; --divider: #F2F3F5;
  /* 兼容别名 */
  --border: var(--border-secondary); --border-soft: var(--divider); --border-strong: var(--border-primary);

  /* ===== Semantic（对齐 §03）===== */
  --success: #1F7A3A; --warning: #B26A00; --danger: #C0392B; --info: #356AE6;
  /* 语义色浅底（Badge / 状态块用，不用于大面背景） */
  --success-soft: #EAF6EE; --warning-soft: #FDF3E7; --danger-soft: #FDECEA; --info-soft: #EEF3FE;

  /* ===== Radius（高级童趣：比企业 SaaS 略圆润，但不做儿童 App）
     按钮/输入 10-12 · 卡片 14-18 · 大型模块 18-24 ===== */
  --radius-xs: 6px; --radius-sm: 10px; --radius-md: 12px; --radius-lg: 18px; --radius-xl: 22px; --radius-pill: 999px;
  /* 缓动（轻到用户意识不到它在炫技） */
  --ease: cubic-bezier(.22,.61,.36,1); --ease-soft: cubic-bezier(.33,.1,.2,1);

  /* ===== Shadow（对齐 §03）===== */
  --shadow-hover: 0 4px 12px rgba(0,0,0,.06); --shadow-dropdown: 0 8px 24px rgba(0,0,0,.08); --shadow-modal: 0 18px 48px rgba(0,0,0,.14);

  /* ===== Spacing ===== */
  --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;

  /* ===== Motion（对齐 §03）===== */
  --motion-fast: 120ms; --motion-normal: 180ms; --motion-slow: 240ms;

  /* ===== Z-index（对齐 §08 刻度）===== */
  --z-header: 100; --z-dropdown: 200; --z-drawer: 300; --z-modal: 400; --z-toast: 500;

  /* ===== Layout ===== */
  --topbar-h: 60px; --sidebar-w: 232px; --page-max: 1440px; --page-pad-x: 32px;
}
