/* ============================================================================
   绿舟 API · 注入层 v3 ｜ 2026-10-01
   ----------------------------------------------------------------------------
   v3 变更（唯一一处）：**主按钮从「G1 浅绿底」改为「G6 实心 + 白字」**。
     原因：v2 的主按钮填充 = 页面底填充 = G1，ΔE00 = 0.00，
           按钮被背景吞掉（用户报的「按钮被绿色遮挡」）。
     已用 verify.py 全量复核，见 §3 注释。
   ----------------------------------------------------------------------------
   与 v1 的根本区别：**不再逐个按钮打补丁，改成覆盖 new-api 的设计令牌**
   （new-api 在 src/web/src/styles/theme.css 里定义了 --primary / --border /
     --ring / --success … 这些令牌，改令牌所有组件自动跟随）

   取色唯一来源：本文件顶部声明的「绿阶 G1–G7」与「中性阶 N1–N8」。
   任何后续改动都要从这两条阶里取档，不要再手挑颜色。

   色差验收（ΔE00）与可读验收（APCA Lc）由
   ~/.workbuddy/skills/color-contrast-audit/check.py 逐对校验。
   ============================================================================ */

/* ============ 0. 色阶定义（唯一取色来源）============ */

:root {
  /* --- 绿阶：固定色相 h=162°，只沿明度排档。相邻档 ΔE00 8.8–20.7 --- */
  --gb-g1: #EEF9F3;   /* L*97.0  页面底 */
  --gb-g2: #84EBBC;   /* L*85.8  次按钮底 */
  --gb-g3: #30D096;   /* L*74.7  装饰 / 强调 */
  --gb-g4: #06AF7B;   /* L*63.5  装饰 */
  --gb-g5: #0A8E64;   /* L*52.3  描边 / 焦点环 */
  --gb-g6: #126F4E;   /* L*41.2  深色面板 */
  --gb-g7: #125139;   /* L*30.0  深字（用于最浅档 G1 上）*/
  --gb-g8: #082B1F;   /* L*~22   更深字档：仅用于 G2 这类中浅底上（G7 在 G2 上只有 Lc 67.9，不够）*/

  /* --- 中性阶：正文/次要文字/分隔线。彩度极低，不跟品牌绿争注意力 --- */
  --gb-n1: #FFFFFF;   /* 卡片 */
  --gb-n4: #C7D0CC;   /* 分隔线 / 输入框边 */
  --gb-n5: #76827C;   /* 占位符（vs 白 Lc 67.3、vs 页底 Lc 62.1）*/
  --gb-n6: #5B6763;   /* 次要文字（vs 页底 Lc 74.3）*/
  --gb-n8: #14211C;   /* 正文（vs 页底 Lc 98.3）*/

  /* --- 语义色（都按 APCA 校验过，见 verify.py）---
     原 --success 是绿色 #009966，与绿阶最近档 ΔE00 仅 4.1 → 会跟主色撞，故移到青绿。 */
  --gb-success: #007778;  /* 白字 Lc 81.5｜vs 绿阶最小 ΔE00 14.0 */
  --gb-warning: #F7CE73;  /* 亮琥珀 + 深字 Lc 78.0｜vs 绿阶最小 ΔE00 ~29 */
  --gb-danger:  #E7000B;  /* 白字 Lc 75.6｜vs 绿阶最小 ΔE00 52.1 */
  --gb-info:    #0078C0;  /* 白字 Lc 77.6｜vs 绿阶最小 ΔE00 36.7 */

  /* --- 派生（混色得出，不算新增颜色）--- */
  --gb-g1-hover: color-mix(in srgb, var(--gb-g1) 88%, var(--gb-g5));
  /* 实心主按钮 hover：往更深走（白字在其上对比只会更高，不会变差） */
  --gb-g6-hover: color-mix(in srgb, var(--gb-g6) 84%, var(--gb-g7));
  /* 次按钮是浅绿底 + 深字，hover 必须往"更亮"走，往深走会把字的对比吃掉 */
  --gb-g2-hover: color-mix(in srgb, var(--gb-g2) 82%, var(--gb-n1));
  --gb-ring:     color-mix(in srgb, var(--gb-g5) 22%, transparent);
  --gb-plate:    var(--gb-g6);
}

/* ============ 1. 设计令牌覆盖（核心）============
   选择器覆盖浅色与深色两套主题，确保无论用户处于哪个主题都走绿阶。 */

:root,
.dark,
html.dark,
html[data-theme="dark"],
body.dark,
[data-theme-preset] {
  /* 表面 */
  --background: var(--gb-g1) !important;
  --foreground: var(--gb-n8) !important;
  --card: var(--gb-n1) !important;
  --card-foreground: var(--gb-n8) !important;
  --popover: var(--gb-n1) !important;
  --popover-foreground: var(--gb-n8) !important;

  /* 🔴 主色必须是「中等调填充色」，不是浅色。
     它不只给按钮用 —— switch / checkbox / radio / progress / slider 的填充色全走它，
     text-primary 链接色也走它。我一开始错设成极浅的 G1，结果：开关一打开，
     白色滑块压在极浅绿轨道上直接看不见（用户截图报的就是这个）。
     实测候选（需同时满足：白字 ≥75、轨道 vs 白卡 ≥45、链接 vs 页底 ≥75）：
       G4 #06AF7B → 58.9 / 53.7 / 48.5  全废
       G5 #0A8E64 → 73.5 / 68.0 / 62.8  链接不达标
       G6 #126F4E → 85.5 / 80.3 / 75.1  ✅ 唯一四项全过
       G7 #125139 → 95.5 / 91.1 / 85.9  ✅ 但偏深，作填充色过重
     取 G6。（对照：shadcn 默认 --primary 是 L*64.7 的中蓝 #3EA4EC，本来就是中间调。） */
  --primary: var(--gb-g6) !important;
  --primary-foreground: var(--gb-n1) !important;

  /* 次要：G2 是中浅底，深字必须比 G7 更深（G7 在 G2 上只有 Lc 67.9），故用 G8 */
  --secondary: var(--gb-g2) !important;
  --secondary-foreground: var(--gb-g8) !important;

  /* 弱化 */
  --muted: color-mix(in srgb, var(--gb-g2) 30%, var(--gb-n1)) !important;
  --muted-foreground: var(--gb-n6) !important;
  --accent: color-mix(in srgb, var(--gb-g2) 40%, var(--gb-n1)) !important;
  --accent-foreground: var(--gb-g7) !important;

  /* 描边 / 输入框：分隔线用中性档（不把每条线都染成深绿）；
     按钮描边另在 §3 单独指定为 G5，避免整站线条过重。 */
  --border: var(--gb-n4) !important;
  --input: var(--gb-n4) !important;
  --ring: var(--gb-g5) !important;

  /* 侧栏 */
  --sidebar: var(--gb-g1) !important;
  --sidebar-foreground: var(--gb-n8) !important;
  --sidebar-primary: var(--gb-g6) !important;
  --sidebar-primary-foreground: var(--gb-n1) !important;
  --sidebar-accent: color-mix(in srgb, var(--gb-g2) 40%, var(--gb-n1)) !important;
  --sidebar-accent-foreground: var(--gb-g7) !important;
  --sidebar-border: var(--gb-n4) !important;
  --sidebar-ring: var(--gb-g5) !important;

  /* 语义色 */
  --destructive: var(--gb-danger) !important;
  --destructive-foreground: var(--gb-n1) !important;
  --success: var(--gb-success) !important;
  --success-foreground: var(--gb-n1) !important;
  --warning: var(--gb-warning) !important;
  --warning-foreground: var(--gb-n8) !important;
  --info: var(--gb-info) !important;
  --info-foreground: var(--gb-n1) !important;
  --neutral: var(--gb-n5) !important;
  --neutral-foreground: var(--gb-n8) !important;

  /* ---- 补齐 new-api 里原本没被覆盖的 12+ 个令牌 ----
     这些是勘察 theme.css 后发现的漏网之鱼：图表色板 / 概览强调色 / 骨架屏 / 表格。
     不补的话，控制台内页（dashboard、表格、加载态）会继续冒出原本的蓝紫色。 */

  /* 图表色板：取绿阶五档。相邻 ΔE00 = 8.8 / 8.9 / 10.5 / 11.0，全部 ≥ 8，
     任意两档至少能分开（最远的 G2 vs G6 是 50.8）。 */
  --chart-1: var(--gb-g5) !important;   /* #0A8E64 */
  --chart-2: var(--gb-g2) !important;   /* #84EBBC */
  --chart-3: var(--gb-g4) !important;   /* #06AF7B */
  --chart-4: var(--gb-g6) !important;   /* #126F4E */
  --chart-5: var(--gb-g3) !important;   /* #30D096 */

  /* 概览页强调色 */
  --overview-accent-1: var(--gb-g5) !important;
  --overview-accent-2: var(--gb-g6) !important;
  --overview-accent-3: var(--gb-g4) !important;

  /* 骨架屏：底比卡片白略深一点，高亮回到最浅档，形成微弱的微光扫过 */
  --skeleton-base: color-mix(in srgb, var(--gb-g1) 55%, var(--gb-n4)) !important;
  --skeleton-highlight: var(--gb-g1) !important;

  /* 表格：行底用白（表格通常落在白卡片上），表头用绿阶浅档 */
  --table-row: var(--gb-n1) !important;
  --table-header: color-mix(in srgb, var(--gb-g2) 30%, var(--gb-n1)) !important;
  --table-header-hover: color-mix(in srgb, var(--gb-g2) 38%, var(--gb-n1)) !important;
  /* --table-disabled / -hover / -border 刻意保持中性：禁用态不该抢品牌色 */
}

/* ============ 2. 背景层 ============ */

body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  /* 以绿阶最浅档为底 + 极淡的绿晕。
     性能：渐变层从 4 层降到 3 层（去掉最弱的 10% 那层，肉眼几乎无差，
          但全屏固定背景每层都要参与合成）。 */
  background:
    radial-gradient(ellipse 75% 60% at 88% 6%,  color-mix(in srgb, var(--gb-g3) 14%, transparent) 0%, transparent 62%),
    radial-gradient(ellipse 85% 55% at 50% 102%, color-mix(in srgb, var(--gb-g2) 18%, transparent) 0%, transparent 72%),
    linear-gradient(165deg, var(--gb-g1) 0%, color-mix(in srgb, var(--gb-g1) 92%, var(--gb-g2)) 45%, var(--gb-g1) 100%);
  animation: gb-breathe 18s ease-in-out infinite;
  will-change: opacity;
}

@keyframes gb-breathe {
  0%, 100% { opacity: .94; }
  50%      { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  body::before { animation: none; will-change: auto; }
}

/* 窄屏省流：不出渐变，退回最浅档纯色 */
@media (max-width: 768px) {
  body::before {
    background-image: none;
    background-color: var(--gb-g1);
    animation: none;
  }
}

/* ============ 3. 按钮（按 variant × 所在底 分开）============
   令牌已给出主/次的底色与字色，这里只补"分级特征"与深色面板上的例外。 */

/* --- 主按钮：实心 G6 + 白字（与 --primary 同色）---
   🔴 v3 修正（2026-10-01）：v2 曾把主按钮做成「G1 浅绿底 + 深绿字 + 淡绿光环」，
   而**页面底恰好就是 G1** —— 两者 ΔE00 = 0.00，是字面意义上的同一个颜色。
   按钮只剩一圈 22% 透明度的淡绿环撑轮廓，用户看到的即「按钮被绿色遮挡 / 被绿色吃掉」。
   取色依据（必须对「页面底 G1」和「白卡 N1」两种底都成立）：
     · G6 实心 + 白字：vs 页面底 ΔE00 47.13 ✅／白字 Lc 85.5 ✅／vs 白卡同样成立 ✅
   顺带把 --primary 的「填充色」角色与「按钮底色」角色统一，撤掉一条作用域覆盖 hack。 */
button[class*="bg-primary"],
a[class*="bg-primary"] {
  background-color: var(--gb-g6) !important;
  color: var(--gb-n1) !important;
  border-color: transparent !important;
  box-shadow: 0 1px 2px color-mix(in srgb, var(--gb-g7) 22%, transparent) !important;
}
button[class*="bg-primary"]:hover,
a[class*="bg-primary"]:hover {
  background-color: var(--gb-g6-hover) !important;
  box-shadow: 0 3px 10px -4px color-mix(in srgb, var(--gb-g7) 38%, transparent) !important;
}

/* --- 次要按钮（secondary variant）：深一档，无光环 ---
   性能：原来还有一条裸的 `[class*="bg-secondary"]:not(input):not(textarea)`，
   会把 `bg-secondary` 的徽章/图标块也一起加阴影（既不是本意，也要多扫一遍）。
   这里只保留 button / a 两个分支。 */
button[class*="bg-secondary"],
a[class*="bg-secondary"] {
  box-shadow: 0 1px 2px color-mix(in srgb, var(--gb-g7) 10%, transparent) !important;
}
button[class*="bg-secondary"]:hover,
a[class*="bg-secondary"]:hover {
  background-color: var(--gb-g2-hover) !important;
}

/* --- 描边按钮（outline variant: bg-background + border-border）---
   🔴 这是 v1 漏掉的那颗：原来描边是 #E8E8E8 灰白，对着绿底 APCA Lc = 0.0（等于不存在）。
   令牌里的 --border 是给分隔线用的，所以在这里单独给按钮上 G5。 */
button[class*="bg-background"],
a[class*="bg-background"] {
  background-color: var(--gb-n1) !important;
  border: 1.5px solid var(--gb-g5) !important;
  color: var(--gb-g7) !important;
  box-shadow: 0 1px 2px color-mix(in srgb, var(--gb-g7) 10%, transparent) !important;
}
button[class*="bg-background"]:hover,
a[class*="bg-background"]:hover {
  background-color: var(--gb-g1) !important;
  border-color: var(--gb-g7) !important;
}

/* --- 落在深色面板（面板本身就是 G6）上的主按钮：必须反色，否则又变回同色 --- */
[data-gb-plate] button[class*="bg-primary"],
[data-gb-plate] a[class*="bg-primary"] {
  background-color: var(--gb-g1) !important;
  color: var(--gb-g7) !important;
}
[data-gb-plate] button[class*="bg-primary"]:hover,
[data-gb-plate] a[class*="bg-primary"]:hover {
  background-color: var(--gb-g1-hover) !important;
}

/* --- 落在深色面板上的按钮（由 bg.js 打 data-gb-plate）--- */
[data-gb-plate] button[class*="bg-background"],
[data-gb-plate] a[class*="bg-background"] {
  background-color: transparent !important;
  border: 1.5px solid var(--gb-g1) !important;
  color: var(--gb-g1) !important;
  box-shadow: none !important;
}
[data-gb-plate] button[class*="bg-background"]:hover,
[data-gb-plate] a[class*="bg-background"]:hover {
  background-color: color-mix(in srgb, var(--gb-g1) 14%, transparent) !important;
}

/* 深色面板上的文字 */
[data-gb-plate] { color: var(--gb-g1); }
[data-gb-plate] h1, [data-gb-plate] h2, [data-gb-plate] h3, [data-gb-plate] h4 {
  color: var(--gb-n1) !important;
}
[data-gb-plate] p,
[data-gb-plate] [class*="text-muted-foreground"] {
  color: var(--gb-g1) !important;
}

button, a[class*="inline-flex"] {
  transition: background-color .18s ease, color .18s ease,
              border-color .18s ease, box-shadow .18s ease, opacity .18s ease;
}

/* ============ 4. 组件层 ============ */

/* --- 焦点态 --- */
:focus-visible {
  outline: 2px solid var(--gb-g5);
  outline-offset: 2px;
  border-radius: 6px;
}
input:focus, textarea:focus, select:focus {
  border-color: var(--gb-g5) !important;
  box-shadow: 0 0 0 3px var(--gb-ring) !important;
  outline: none;
}

/* --- 代码块 --- */
pre {
  background: #12211C !important;
  border-radius: 10px !important;
  border: 1px solid color-mix(in srgb, var(--gb-g6) 40%, transparent) !important;
  padding: 14px 16px !important;
  overflow-x: auto;
}
pre code { background: none !important; padding: 0 !important; }
code:not(pre code) {
  background: color-mix(in srgb, var(--gb-g2) 40%, var(--gb-n1)) !important;
  color: var(--gb-g7) !important;
  padding: 2px 5px !important;
  border-radius: 5px !important;
  font-size: 0.88em;
}

/* --- 表格 --- */
table tbody tr:nth-child(even) {
  background-color: color-mix(in srgb, var(--gb-g2) 16%, transparent);
}
table th {
  font-weight: 600;
  color: var(--gb-g7);
  background-color: color-mix(in srgb, var(--gb-g2) 30%, var(--gb-n1));
}
table td, table th {
  border-color: var(--gb-n4) !important;
}

/* --- 卡片：白底 + 描边 + 阴影。
   ⚠️ 白卡 vs 页底 G1 的 ΔE00 只有 6.5、Lc = 0，
   ⇒ **卡片不能靠底色和页底分开，必须靠描边/阴影**（这是刻意的设计决定）。
   性能：砍掉了 `[class*="Card"]`（实测命中 0，纯浪费）与 `> *` 继承规则；
        阴影从 4 层降到 2 层、模糊 24px→16px（模糊半径是绘制成本主因）。 */
[class*="card"] {
  border-radius: 12px !important;
  border-color: color-mix(in srgb, var(--gb-g5) 22%, transparent) !important;
  box-shadow:
    0 1px 2px color-mix(in srgb, var(--gb-g7) 6%, transparent),
    0 6px 16px -10px color-mix(in srgb, var(--gb-g7) 14%, transparent) !important;
}

/* --- 滚动条 --- */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--gb-g5) 34%, transparent);
  border-radius: 6px;
  border: 2px solid transparent;
  background-clip: content-box;
}
::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--gb-g5) 52%, transparent);
  background-clip: content-box;
}

/* --- 登录 / 注册卡片：毛玻璃 --- */
form[class*="space-y"],
[class*="auth"] form,
[class*="login"] form,
[class*="sign-in"] form {
  background: rgba(255, 255, 255, 0.82);
  backdrop-filter: saturate(140%) blur(12px);
  -webkit-backdrop-filter: saturate(140%) blur(12px);
  border: 1px solid color-mix(in srgb, var(--gb-g5) 20%, transparent);
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.65),
    0 1px 2px color-mix(in srgb, var(--gb-g7) 6%, transparent),
    0 8px 24px -8px color-mix(in srgb, var(--gb-g7) 12%, transparent);
  padding: 26px 28px;
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  form[class*="space-y"],
  [class*="auth"] form,
  [class*="login"] form,
  [class*="sign-in"] form {
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

/* ============ 5. 冷色统一到绿阶（性能优化版）============
   背景：lib/colors.ts 的 colorToBgClass / TAG_COLORS 是「分类色」，用来区分不同分组/标签。
     · 冷色（蓝 / 天蓝 / 靛 / 紫罗兰 / 紫 / 青 / 青绿）
       → 分别映射到**绿阶不同档位**（相邻 ΔE00 ≥ 8.8），统一到品牌绿但保住区分度
     · 暖色（红 / 橙 / 琥珀 / 黄 / 柠檬 / 粉）→ **保留**。功能色，色盲下靠明度与图标区分

   🔴 性能要点（实测：本层曾让样式重算 +56ms / +39%）：
     1. 半透明底（`bg-blue-500/5`）与实心底（`bg-blue-500`）**同权重 → 靠层叠顺序分胜负**。
        把半透明规则写在**最后**即可，不需要 `:not(...)` 链（原来 11 处 :not 链，
        每个元素每次重算都要多做十几次子串匹配）。
     2. 描边只覆盖真正用到的 4 个色相，砍掉 cyan/teal/sky 的边框规则。
     3. 同类规则合并，减少规则条数。 */

/* ---- 5.1 实心底 ---- */
[class*="bg-blue-"]   { background-color: var(--gb-g5) !important; }
[class*="bg-sky-"]    { background-color: var(--gb-g3) !important; }
[class*="bg-indigo-"] { background-color: var(--gb-g6) !important; }
[class*="bg-violet-"] { background-color: var(--gb-g7) !important; }
[class*="bg-purple-"] { background-color: var(--gb-g4) !important; }
[class*="bg-cyan-"],
[class*="bg-teal-"]   { background-color: var(--gb-g2) !important; }

/* ---- 5.2 文字色 ---- */
[class*="text-blue-"]   { color: var(--gb-g5) !important; }
[class*="text-sky-"]    { color: var(--gb-g3) !important; }
[class*="text-indigo-"] { color: var(--gb-g6) !important; }
[class*="text-violet-"] { color: var(--gb-g7) !important; }
[class*="text-purple-"] { color: var(--gb-g4) !important; }
[class*="text-cyan-"],
[class*="text-teal-"]   { color: color-mix(in srgb, var(--gb-g2) 82%, var(--gb-g7)) !important; }

/* ---- 5.3 描边（只留实际会用到的 4 个色相，减少匹配次数）---- */
[class*="border-blue-"], [class*="border-indigo-"],
[class*="border-violet-"], [class*="border-purple-"] {
  border-color: color-mix(in srgb, var(--gb-g5) 40%, transparent) !important;
}

/* ---- 5.4 🔴 半透明底：**必须放在实心底之后**（同权重靠后赢），
        这样就省掉了全部 :not() 链。用 [class*="/"] 兼容任意色阶与透明度。 ---- */
[class*="bg-blue-"][class*="/"],
[class*="bg-sky-"][class*="/"],
[class*="bg-indigo-"][class*="/"],
[class*="bg-violet-"][class*="/"],
[class*="bg-purple-"][class*="/"],
[class*="bg-cyan-"][class*="/"],
[class*="bg-teal-"][class*="/"] {
  background-color: color-mix(in srgb, var(--gb-g5) 8%, transparent) !important;
}

/* ---- 5.5 渐变端点类（v1 完全漏掉的地方）----
   源码 features/home/components/sections/hero.tsx 的
   `bg-gradient-to-r from-blue-400 via-violet-400 to-purple-500`，
   标题至今是蓝紫渐变。标题文字必须可读，所以只用 G6→G7 这段深绿（对 G1 页底 Lc ≥ 85.9）。 */
[class*="from-blue-400"][class*="bg-clip-text"],
[class*="from-violet-400"][class*="bg-clip-text"],
[class*="from-purple-500"][class*="bg-clip-text"] {
  background-image: linear-gradient(
    95deg,
    var(--gb-g6) 0%,
    var(--gb-g7) 55%,
    color-mix(in srgb, var(--gb-g7) 70%, #000) 100%
  ) !important;
}
[data-gb-plate] [class*="bg-clip-text"] {
  background-image: linear-gradient(
    95deg,
    var(--gb-n1) 0%,
    var(--gb-g2) 60%,
    var(--gb-g1) 100%
  ) !important;
}

/* ---- 保留暖色：红/橙/琥珀/黄/柠檬/粉 一律不动 ----
   （如需连它们也统一成绿，改上面几组即可；但会牺牲分类区分度） */

/* ============ 6. 字体 ============ */

body, input, button, textarea, select, table {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI",
               "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
               "微软雅黑", "Noto Sans SC", sans-serif;
  /* 🔴 不能用 antialiased：按 APCA/ΔΦ* 指引，400 字重 <24px 的小字用 antialiased
     会让笔画变细、感知对比下降。我们按钮文字是 12.5px，必须留 auto。 */
  -webkit-font-smoothing: auto;
  -moz-osx-font-smoothing: auto;
}
code, kbd, samp, pre, .font-mono, [class*="mono"] {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
               "Liberation Mono", "Courier New", monospace;
  font-size: 0.92em;
}
