/* ============================================================
   心启能 · 心力赋能 — 统一设计令牌（Design Tokens）2026 重制版
   方向：Soft-Tech 静谧科技（数字薰衣草 + 云感暖中性 + 环境网格渐变）
   对标：Calm / Headspace / Linear / 小红书 质感；规避 Neo-Brutalism（不适配心理品类）
   作用：所有页面与后台共用一套品牌与中性变量，保证视觉一致、支持深色模式、便于换肤。
   用法：页面 <head> 中于业务样式之前引入本文件；业务 CSS 优先引用变量。
   ============================================================ */
:root {
  /* —— 品牌主色（静谧深绿 · 经过提炼的「forest-emerald」，沉稳、高级、有质感）—— */
  --brand-1: #34D399;          /* 主色浅亮（emerald 400）*/
  --brand-2: #059669;          /* 主色（deep emerald）*/
  --brand-3: #10B981;          /* 主色亮 */
  --brand-4: #6EE7B7;          /* 主色浅亮 */
  --brand-5: #A7F3D0;          /* 主色最浅 */
  --brand-deep: #065F46;       /* 深墨绿（文字渐变/深色底）*/
  --brand-grad: linear-gradient(135deg, #10B981 0%, #059669 48%, #0D9488 100%);
  --brand-grad-soft: linear-gradient(135deg, rgba(16,185,129,.12), rgba(13,148,136,.10));
  /* 环境网格渐变（hero / 顶栏光晕）：翡翠绿雾 + 暖橙 + 青绿的柔和弥散光 */
  --brand-mesh:
    radial-gradient(120% 80% at 12% 0%, rgba(110,231,183,.50), transparent 55%),
    radial-gradient(120% 90% at 88% 8%, rgba(251,146,60,.30), transparent 50%),
    radial-gradient(140% 120% at 50% 120%, rgba(13,148,136,.40), transparent 60%),
    linear-gradient(135deg, #0D9488 0%, #059669 50%, #0F766E 100%);

  /* —— 语义色（现代、克制、符合 WCAG AA 对比）—— */
  --c-ink: #1C2B26;            /* 主文字（深墨绿炭，温暖且高对比）*/
  --c-sub: #4A5A52;            /* 次级文字 */
  --c-mut: #6B7B73;            /* 辅助/占位（已调至可满足 AA）*/
  --c-line: #E6EEE9;          /* 描边（暖绿灰）*/
  --c-bg: #F4F8F5;            /* 页面底色（云感暖中性，非冷白）*/
  --c-surface: #FFFFFF;        /* 卡片/表面 */
  --c-surface-2: #EEF5F0;      /* 次级表面（淡绿 tint）*/

  --c-primary: var(--brand-2);
  --c-success: #0EA672;  --c-success-bg: #E6F8F1;
  --c-warn: #E08A0B;     --c-warn-bg: #FDF3E2;
  --c-danger: #F43F5E;   --c-danger-bg: #FEECF0;
  --c-info: #3B82F6;     --c-info-bg: #EAF2FF;
  /* 多巴胺点缀（克制使用：温暖玫瑰 / 蜜桃，仅作记忆点）*/
  --c-rose: #FB7185;  --c-rose-bg: #FEECF1;
  --c-peach: #FF9E7A; --c-peach-bg: #FFF0E8;
  --c-mint: #10B981;   --c-mint-bg: #E7F8F1;

  /* —— 间距（8pt 栅格，扩展至更舒展的尺度）—— */
  --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;

  /* —— 圆角（更友好、更现代）—— */
  --r-xs: 8px; --r-sm: 10px; --r-md: 14px; --r-lg: 18px; --r-xl: 24px; --r-2xl: 28px; --r-pill: 999px;

  /* —— 阴影（分层、带品牌色晕、更柔和）—— */
  --sh-1: 0 1px 2px rgba(15,45,35,.04), 0 2px 8px rgba(15,45,35,.05);
  --sh-2: 0 6px 20px rgba(5,150,105,.10);
  --sh-3: 0 16px 40px rgba(5,150,105,.18);
  --sh-glow: 0 8px 30px rgba(16,185,129,.30);

  /* —— 字体 —— */
  --font: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", sans-serif;
  --fs-display: 30px; --fs-h1: 24px; --fs-h2: 20px; --fs-h3: 17px;
  --fs-body: 15px; --fs-sm: 13px; --fs-xs: 12px;
  --lh-tight: 1.25; --lh-base: 1.6; --lh-relaxed: 1.75;
  --ls-tight: -.4px; --ls-base: .2px;

  /* —— 动效（顺滑、克制回弹）—— */
  --ease: cubic-bezier(.22, 1, .36, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --dur: .24s;

  /* —— 布局 —— */
  --maxw: 960px;               /* 移动端内容最大宽度 */
  --topbar-h: 56px;
}

/* ============================================================
   深色模式（紫雾暗色，保留品牌温度，符合暗色对比规范）
   ============================================================ */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    /* 让原生控件（滚动条/日期选择器/下拉）跟随暗色 */
    color-scheme: dark;

    --c-ink: #E6F2EE; --c-sub: #B8CCC4; --c-mut: #7C948A;
    --c-line: #1F3A30; --c-bg: #071410; --c-surface: #0C221B; --c-surface-2: #123027;
    --sh-1: 0 1px 2px rgba(0,0,0,.4); --sh-2: 0 8px 24px rgba(0,0,0,.5); --sh-3: 0 18px 44px rgba(16,185,129,.20);

    /* --brand-mesh 暗色版（Bug 修复）：
       该令牌被 7 处消费（.app .topbar / .auth-bg / .title-module /
       .login-wrap / .hs-banner / .hs-entry / .hs-hero），
       此前没有暗色定义 → 暗色下这些区域仍是亮绿渐变、发白不可读。*/
    --brand-mesh:
      radial-gradient(120% 80% at 12% 0%, rgba(16, 185, 129, .18), transparent 55%),
      radial-gradient(120% 90% at 88% 8%, rgba(13, 148, 136, .12), transparent 50%),
      radial-gradient(90% 70% at 50% 100%, rgba(110, 231, 183, .06), transparent 60%),
      linear-gradient(180deg, #0A1E18 0%, #071410 100%);

    /* 暗色下的表面浅阶（对齐后台口径，供各业务 CSS 复用）*/
    --bg-0: #071410; --bg-1: #0C221B; --bg-2: #123027;
  }
}

/* ============================================================
   语义色扩展（2026 收口层 · P1·S3）
   ------------------------------------------------------------------
   目的：覆盖审计 Top 漂移色（多为 Tailwind 默认调色板与历史私有紫），
   为 scripts/retokenize.js 提供可收口的受控 token，把"散落硬编码"收编为
   单一来源。原则：只增量补充，不改写/不删除既有 token；纯新增、零功能影响。
   后续如需全站统一到品牌体系，只需在此集中调整映射值。
   ============================================================ */
:root {
  /* 中性/石板灰阶梯（统一替换 #f8fafc…#1e293b 等 slate 漂移色）*/
  --n-50: #F8FAFC;  --n-100: #F1F5F9; --n-200: #E2E8F0; --n-300: #CBD5E1;
  --n-400: #94A3B8; --n-500: #64748B; --n-600: #475569; --n-700: #334155;
  --n-800: #1E293B; --n-900: #0F172A;

  /* 品牌深绿扩展（统一替换 #059669/#047857/#14B8A6/#2DD4BF/#A7F3D0/#D1FAE5/#ECFDF5/#F0FDF4/#F0FDF4 等 Tailwind 紫 → 深绿色阶）*/
  --v-50: #ECFDF5;  --v-100: #D1FAE5; --v-200: #A7F3D0; --v-300: #6EE7B7;
  --v-400: #34D399; --v-500: #10B981; --v-600: #059669; --v-700: #047857;
  --indigo-400: #2DD4BF; --indigo-500: #14B8A6;

  /* 状态色（统一替换 red/amber/green 漂移色；与 --c-danger/--c-warn/--c-success 并存，按需引用）*/
  --s-red-500: #EF4444; --s-red-600: #DC2626; --s-red-700: #B91C1C;
  --s-amber-500: #F59E0B; --s-amber-600: #D97706;
  --s-green-500: #22C55E; --s-green-600: #16A34A; --s-green-50: #ECFDF5;

  /* 补齐状态色阶（阶段四：收敛 admin.css 等硬编码漂移色）
     值均取自原字面量，替换后视觉零变化，但获得可主题化/可暗色化的能力 */
  --s-red-50: #FEF2F2;   --s-red-200: #FECACA;
  --s-green-100: #DCFCE7; --s-green-700: #15803D; --s-green-800: #166534;
  --s-emerald-700: #047857;
  --s-amber-100: #FEF3C7; --s-amber-700: #B45309; --s-amber-800: #92400E;
  --s-blue-700: #1D4ED8;
  /* 第二批补齐：品牌紫深阶 + 琥珀/红浅阶（收敛 admin.css 零散漂移色）*/
  --v-900: #064E3B;
  --s-amber-50: #FFFBEB; --s-amber-200: #FDE68A; --s-amber-400: #FBBF24;
  --s-red-400: #F87171;
  /* 第三批补齐：绿/蓝/红/靛/橙/翠 色阶（收敛 admin.css 长尾漂移色）
     注：--s-green-50 已定义为 #ECFDF5，#f0fdf4 与之视觉等价，统一复用不另立名 */
  --s-green-200: #BBF7D0; --s-emerald-600: #059669;
  --s-blue-50: #EFF6FF;   --s-blue-600: #2563EB;
  --s-red-100: #FEE2E2;
  --s-indigo-50: #ECFDF5; --s-indigo-200: #D1FAE5; --s-indigo-600: #0D9488;
  --s-orange-700: #C2410C;
  /* 第四批补齐：用户端品牌定制色板（t5，收敛 style.css / home.css 高频漂移色）
     #059669 即 --brand-2（主色），此处不另立名 */
  --brand-green: #059669;   --brand-rose: #E11D48;
  --brand-orange: #F97316;  --brand-amber: #F59E0B;
  --brand-purple-deep: #065F46; --brand-purple: #059669; --brand-purple-soft: #ECFDF5;
  --s-sky-100: #E0F2FE; --s-sky-500: #0EA5E9; --s-sky-700: #0369A1;
  --s-teal-700: #0F766E;
  /* 第五批补齐：中性灰阶深段（t6 最大缺口：#94a3b8/#64748b/#475569/#334155 高频漂移）
     + 品牌蓝与靛浅底。原 --n-* 仅定义到 300，深段缺失导致大量 slate 色散落 */
  --n-400: #94A3B8; --n-500: #64748B; --n-600: #475569; --n-700: #334155;
  --brand-blue: #2F6BFF;
  --s-indigo-100: #D1FAE5;
  /* 第六批补齐：深色段（t6 中小文件：#1f2533 深灰 / #16312A 深紫底）*/
  --n-800: #1F2533;
  --ink-deep: #16312A;

  /* 第七批补齐：t4 后台业务页长尾色（统一表格组件 · mini 概览 / 状态徽标）
     值取自原字面量，替换后视觉零变化，但获得可主题化 / 可暗色化能力 */
  --s-teal-50: #F0FDFA;
  --s-yellow-50: #FEFCE8;  --s-yellow-700: #A16207;
  --v-25: #F0FDF4;                 /* 比 --v-50 更浅的绿白（表格列选择 hover）*/

  /* 第八批补齐：后台长尾高频漂移色（admin.css / admin-theme.css，≥3 次）
     值取自原字面量，替换后视觉零变化，获得可主题化 / 可暗色化能力 */
  --v-950: #042F22;   --v-925: #0B3D2E;   /* 侧栏深墨绿（最深处 / 中段） */
  --s-blue-800: #1E40AF;  --s-red-800: #991B1B;   /* 状态深字（蓝 / 红） */
  --s-red-300: #FCA5A5;  --s-amber-25: #FFF7ED;  --s-blue-100: #EAF0FF;  /* 状态浅底（红 / 琥珀 / 蓝） */
  --n-150: #EEF0F4;  --n-60: #F4F6FB;   /* 浅灰（边框/背景） */
  --v-30: #F0FDF4;   --warm-30: #FAFBFF;  /* 浅绿 / 极浅蓝白背景 */

  /* 暖白底（#F0FDF4 等）*/
  --warm-50: #F0FDF4;

  /* 心力四维语义色（测评维度固定语义，统一来源；供 charts.js 雷达维度引用）*/
  --dim-drive: #D9950B; --dim-order: #3B82F6; --dim-connect: #F43F5E; --dim-guard: #0EA672;
}

/* ============================================================
   阶段四 · 表现层 token 增强（纯增量，不改写既有 token）
   ------------------------------------------------------------------
   补齐现代 SaaS 交付标准的组件级 / 动效 / 数字排版 / 暗色三层 / 层级 token。
   原则：只追加，不删除、不改名、不改既有值，保证全站 var() 引用零回归。
   ============================================================ */
:root {
  /* —— 动效标准（150–300ms + Material 标准缓动）—— */
  --ease-out: cubic-bezier(0.4, 0, 0.2, 1);   /* 进入/退出标准缓动 */
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --ease-inout: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 150ms;   /* 微交互：hover / active / 图标 */
  --dur-base: 240ms;   /* 常规过渡：卡片 / 输入框 */
  --dur-slow: 300ms;   /* 面板 / 弹窗 / 页面级 */
  --tr-fast: transform var(--dur-fast) var(--ease-out), opacity var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
  /* 性能修正：原为 `all`，会把 width/height/top/left/margin 等
     会触发重排的属性也纳入过渡，导致 hover 时持续重排。
     改为显式白名单：只过渡 transform / opacity / 颜色 / 阴影 / 边框。 */
  --tr-base: transform var(--dur-base) var(--ease-out),
             opacity var(--dur-base) var(--ease-out),
             box-shadow var(--dur-base) var(--ease-out),
             border-color var(--dur-base) var(--ease-out),
             background-color var(--dur-base) var(--ease-out),
             color var(--dur-base) var(--ease-out);
  --tr-slow: all var(--dur-slow) var(--ease-out);

  /* —— 数字排版（金额 / 计数等宽对齐）—— */
  --font-num: "SF Mono", "SFMono-Regular", "JetBrains Mono", "Roboto Mono", Menlo, Consolas, monospace;
  --tabnum: tabular-nums;

  /* —— 组件级 token（Button / Input / Card / Modal / Tag / Select）—— */
  --btn-h: 40px;   --btn-h-sm: 32px;   --btn-h-lg: 48px;
  --btn-radius: 8px;
  --input-h: 40px;  --input-radius: 8px;
  --card-radius: 14px;   /* 卡片 12–16px 区间 */
  --tag-radius: 6px;     /* 标签 4–6px 区间 */
  --control-h: 36px;     /* select / 小型控件 */
  --modal-radius: 16px;

  /* —— Focus ring（键盘可达性）—— */
  --ring: 0 0 0 3px rgba(16, 185, 129, 0.16);
  --ring-w: 2px;

  /* —— 暗色三层递进背景（不纯黑：靛炭 → 深紫 → 表面）—— */
  --bg-0: #F4F8F5;   /* 页面底色（最底层）*/
  --bg-1: #FFFFFF;   /* 容器 / 面板 */
  --bg-2: #EEF5F0;   /* 表面 / 卡片 */

  /* —— 层级（z-index 阶梯，统一管理避免互相覆盖）—— */
  --z-base: 1; --z-dropdown: 1000; --z-sticky: 1020; --z-overlay: 1040; --z-modal: 1060; --z-toast: 1080;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg-0: #071410;   /* 页面底色（墨绿炭，非纯黑）*/
    --bg-1: #0C221B;   /* 容器 / 面板 */
    --bg-2: #123027;   /* 表面 / 卡片 */
  }
}

/* ============================================================
   手动暗色主题（一键切换）
   ------------------------------------------------------------------
   与系统深色（prefers-color-scheme: dark）使用完全相同的变量值，
   仅把「跟随系统」变为「用户显式选择」，不引入新的视觉分支；
   data-theme="light" 用于在系统深色下强制亮色。
   ============================================================ */
:root[data-theme="dark"] {
  color-scheme: dark;
  --c-ink: #E6F2EE; --c-sub: #B8CCC4; --c-mut: #7C948A;
  --c-line: #1F3A30; --c-bg: #071410; --c-surface: #0C221B; --c-surface-2: #123027;
  --sh-1: 0 1px 2px rgba(0,0,0,.4); --sh-2: 0 8px 24px rgba(0,0,0,.5); --sh-3: 0 18px 44px rgba(16,185,129,.20);
  --brand-mesh:
    radial-gradient(120% 80% at 12% 0%, rgba(16, 185, 129, .18), transparent 55%),
    radial-gradient(120% 90% at 88% 8%, rgba(13, 148, 136, .12), transparent 50%),
    radial-gradient(90% 70% at 50% 100%, rgba(110, 231, 183, .06), transparent 60%),
    linear-gradient(180deg, #0A1E18 0%, #071410 100%);
  --bg-0: #071410; --bg-1: #0C221B; --bg-2: #123027;
}

/* ============================================================
   全站共享 · 无障碍 / 动效尊重 / 质感细节
   （tokens.css 被所有页面加载，一处生效全站受益）
   ============================================================ */

/* 键盘可达：统一焦点环（WCAG 2.4.7）。
   :where() 零特异性，仅对无自定义焦点样式的元素生效，组件可安全覆盖。 */
:where(a[href], button, input, select, textarea, summary, [tabindex]:not([tabindex="-1"])):focus-visible {
  outline: 2px solid var(--brand-2, #059669);
  outline-offset: 2px;
  border-radius: 2px;
}

/* 文本选择：品牌绿着色（原创质感细节，各端一致） */
::selection { background: rgba(16, 185, 129, .20); color: inherit; }

/* 平滑滚动（尊重系统偏好） */
html { scroll-behavior: smooth; }

/* 降动效：尊重运动敏感用户（WCAG 2.3.3），全站动画/过渡一键收敛 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}