/* ============================================================================
   Workbench Design Tokens — 唯一真源
   来源：design/mockups/v1-preview.html（用户 2026-07-14 验收的视觉方向 v1）
   规范：design/DESIGN.md（使用规则、对比度验算、组件规范以该文档为准）

   结构：
     :root                                亮色默认值 + 全部尺寸/字体/层级常量
     @media (prefers-color-scheme: dark)  跟随系统的暗色镜像（仅颜色与阴影）
     :root[data-theme="dark"]             用户手动锁定暗色（覆盖系统偏好）
     :root[data-theme="light"]            用户手动锁定亮色（覆盖系统偏好）

   规则：产品 CSS 只允许引用本文件的 var()，不允许出现裸色值；
   尺寸/字体/层级 token 不随主题变化，只在 :root 定义一次。
   ========================================================================== */

:root {
  color-scheme: light;

  /* ---- 表面阶梯（由外到内：外框 → 画布 → 卡片 → 浮层） ---- */
  --shell: oklch(0.960 0.003 286);        /* 应用外框：header、侧栏、body 底色，最安静的一层 */
  --canvas: oklch(0.988 0.001 286);       /* 内容画布：会话主区背景，列表/对话在这层上 */
  --surface: oklch(1 0 0);                /* 卡片表面：最终回答、结果面板、抽屉、composer 盒 */
  --raised: oklch(1 0 0);                 /* 浮层表面：弹出面板、底部 sheet、菜单（亮色与 surface 同值，靠阴影区分） */
  --hover: oklch(0.966 0.002 286);        /* 悬停/行内 code 底色：hover 态、inline code、进度条轨道 */

  /* ---- 边框两级 ---- */
  --border: oklch(0.918 0.004 286);       /* 强边框：输入框、按钮、外框描边等需要明确轮廓处 */
  --border-soft: oklch(0.945 0.003 286);  /* 弱边框：卡片、分区、分割线等只需轻提示的轮廓 */

  /* ---- 文字三级 ---- */
  --ink: oklch(0.185 0.008 286);          /* 主文字：正文、标题、最终回答（对 surface 18.6:1） */
  --ink-2: oklch(0.44 0.012 286);         /* 次文字：时间线正文、说明、按钮文字（对 surface 7.8:1，可作正文） */
  --ink-3: oklch(0.60 0.014 286);         /* 辅助文字：时间戳、占位符、section label（对 surface 4.0:1，仅限非关键辅助信息） */

  /* ---- 品牌与语义色（accent 纪律：每屏可见 brand ≤2 处） ---- */
  --brand: oklch(0.545 0.155 255);        /* 品牌蓝：主按钮填充、运行态、选中态、链接（作文字对 surface 5.0:1） */
  --brand-soft: oklch(0.545 0.155 255 / 9%);   /* 品牌蓝弱底：选中背景、用户气泡、running 徽章底 */
  --ok: oklch(0.56 0.14 150);             /* 成功绿：完成态、PASS 徽章、在线点（作文字 4.4:1，仅限徽章/大字，正文级绿用 --diff-add） */
  --ok-soft: oklch(0.56 0.14 150 / 11%);  /* 成功绿弱底：PASS/completed 徽章底 */
  --warn: oklch(0.66 0.14 80);            /* 警示黄：等待态、降级提示（3.2:1，仅限图形/徽章，禁作正文，正文警示用 --ink + 图标） */
  --warn-soft: oklch(0.66 0.14 80 / 12%); /* 警示黄弱底：waiting/blocked 徽章底 */
  --danger: oklch(0.56 0.20 25);          /* 危险红：失败态、错误文字、删除确认（作文字 5.2:1，正文级可用） */
  --danger-soft: oklch(0.56 0.20 25 / 10%); /* 危险红弱底：failed 徽章底、错误块背景 */
  --info: oklch(0.55 0.13 235);           /* 信息青蓝：中性提示、系统消息（作文字 ≈4.8:1；与 brand 区分，不用于可点元素） */
  --info-soft: oklch(0.55 0.13 235 / 10%); /* 信息青蓝弱底：info 徽章/提示条背景 */

  /* ---- diff 色（代码增删行专用，与语义色分开以便独立调优） ---- */
  --diff-add: oklch(0.50 0.13 150);       /* 新增行文字（对 add-bg 5.1:1） */
  --diff-add-bg: oklch(0.56 0.14 150 / 8%);  /* 新增行背景 */
  --diff-del: oklch(0.52 0.17 25);        /* 删除行文字（对 del-bg 5.3:1） */
  --diff-del-bg: oklch(0.56 0.20 25 / 8%);   /* 删除行背景 */

  /* ---- 阴影三档（层级越高阴影越重；亮色用低透明冷灰） ---- */
  --sh-1: 0 1px 2px oklch(0.25 0.02 286 / 5%), 0 1px 1px oklch(0.25 0.02 286 / 4%); /* 一档：贴地卡片（回答卡、composer 盒） */
  --sh-2: 0 8px 24px oklch(0.25 0.02 286 / 9%), 0 2px 6px oklch(0.25 0.02 286 / 6%); /* 二档：悬浮面板（下拉、popover、桌面外框） */
  --sh-3: 0 16px 40px oklch(0.25 0.02 286 / 15%), 0 3px 10px oklch(0.25 0.02 286 / 8%); /* 三档：窗口级浮层（抽屉、底部 sheet、对话框） */

  /* ---- 焦点环（键盘可达性：禁止裸 outline:none，必须以此替代） ---- */
  --focus-ring: 0 0 0 3px var(--brand-soft); /* 焦点环：focus-visible 与 :focus-within 的统一样式 */

  /* ---- 固定色（不随主题变化，只在 :root 定义一次；R2 收进 token，见 DESIGN §6.5/§6.10） ---- */
  --on-brand: oklch(1 0 0);               /* 语义实底上的白字：主按钮、发送键、删除确认（暗色 brand 底 3.04:1，须 ≥14px/600，见尾注） */
  --scrim: oklch(0.10 0.01 286 / 32%);    /* 抽屉/底部 sheet 背后的遮罩暗化层 */
  --code-bg: oklch(0.21 0.03 262);        /* Markdown 代码块固定暗底（亮暗主题一致） */
  --code-ink: oklch(0.93 0.01 262);       /* Markdown 代码块文字（对 --code-bg ≈13:1 ✓） */

  /* ---- 字体双栈 ---- */
  --sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif; /* 正文栈：UI 与中英混排正文 */
  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace; /* 等宽栈：路径、代码、diff、run id、命令 */

  /* ---- type scale（桌面基准；移动映射见 DESIGN.md §7） ---- */
  --fs-12: 12px;      /* Label/徽章/section header（全大写时必须配 --ls-caps） */
  --fs-mono: 12.5px;  /* 等宽专用字号：时间线目标、diff、代码块 */
  --fs-13: 13px;      /* 次级信息：时间线、说明文字、次按钮 */
  --fs-14: 14px;      /* 桌面正文：会话内容、最终回答 */
  --fs-15: 15px;      /* 区块标题 / 移动端正文 */
  --fs-17: 17px;      /* 页面标题（最高层级，每屏一个） */

  /* ---- 行高与字距 ---- */
  --lh-body: 1.6;     /* 正文行高：中文混排呼吸感的底线，不得调低 */
  --lh-mono: 1.55;    /* 等宽行高：diff/代码块 */
  --lh-tight: 1.3;    /* 紧凑行高：标题、单行标签 */
  --ls-caps: 0.06em;  /* 全大写字距下限（craft 硬规则：ALL CAPS 必须 ≥0.06em） */
  --ls-title: -0.01em; /* 标题字距：17px 标题的轻微收紧 */

  /* ---- 字重三档（+小字号补充档） ---- */
  --fw-body: 400;     /* 阅读：正文 */
  --fw-ui: 550;       /* 强调：按钮、session 名、文件行、任务标题 */
  --fw-title: 650;    /* 宣告：页面/区块标题 */
  --fw-label: 600;    /* 小字补充档：仅 ≤12px 的 label/徽章可用（小字需更重才读得出强调；13px 以上禁用） */

  /* ---- 间距 scale（4px 基数） ---- */
  --sp-1: 4px;        /* 最小间隙：徽章内距、行间微距 */
  --sp-2: 8px;        /* 元素间隙：图标与文字、按钮组内 */
  --sp-3: 12px;       /* 组件内距：卡片小内距、抽屉行距 */
  --sp-4: 16px;       /* 标准内距：卡片/抽屉标准 padding */
  --sp-5: 20px;       /* 区块间距：消息之间、面板段落 */
  --sp-6: 24px;       /* 大区块间距：页面级留白 */
  --sp-8: 32px;       /* 章节间距：主区左右留白、分组之间 */

  /* ---- 圆角比例尺 ---- */
  --r-sm: 6px;        /* 小圆角：按钮、输入行、小卡片、diff 块 */
  --r: 10px;          /* 标准圆角：气泡、回答卡、composer 盒 */
  --r-lg: 14px;       /* 大圆角：桌面外框、大浮层 */
  --r-full: 999px;    /* 全圆：徽章、pill、进度条、圆形按钮 */

  /* ---- 触控最小尺寸 ---- */
  --tap-min: 44px;    /* 移动触控目标下限（iOS HIG 44pt；本产品移动端一律 ≥44px） */
  --tap-aa: 24px;     /* WCAG 2.5.8 AA 法律底线（桌面密集工具条允许，移动禁止贴线） */

  /* ---- z-index 层级表（与现有 apps/web 数值对齐，禁止随手 +1） ---- */
  --z-popover: 20;    /* 弹出面板：settings、下拉菜单 */
  --z-scrim: 30;      /* 遮罩：抽屉/sheet 背后的暗化层 */
  --z-drawer: 40;     /* 抽屉与底部 sheet：tasks/agents/pipeline */
  --z-toast: 50;      /* 顶层通知：toast、全局 banner（预留） */

  /* ---- 动效常量（允许的动效清单见 DESIGN.md §9） ---- */
  --dur-1: 100ms;     /* 即时反馈：按压、toggle、hover */
  --dur-2: 150ms;     /* 状态确认默认时长（跨设计系统收敛值） */
  --dur-3: 250ms;     /* 入场 UI：抽屉、sheet、popover */
  --ease-standard: cubic-bezier(0.2, 0, 0, 1); /* 标准缓动（前载曲线，快出缓收） */
}

/* ============================================================================
   暗色镜像（跟随系统）。只镜像颜色与阴影；尺寸/字体/层级不重复定义。
   ========================================================================== */
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --shell: oklch(0.165 0.006 286);        /* 外框：暗色最深层 */
    --canvas: oklch(0.192 0.006 286);       /* 画布：略浅于外框 */
    --surface: oklch(0.225 0.007 286);      /* 卡片：暗色靠亮度抬升区分层级 */
    --raised: oklch(0.245 0.008 286);       /* 浮层：比卡片再亮一档（暗色无白色阴影可借） */
    --hover: oklch(0.27 0.007 286);         /* 悬停：最亮的中性层 */
    --border: oklch(1 0 0 / 9%);            /* 强边框：暗色用半透明白，读作结构而非噪音 */
    --border-soft: oklch(1 0 0 / 6%);       /* 弱边框：更低透明度的白 */
    --ink: oklch(0.965 0 0);                /* 主文字：近白不纯白（对 surface 15.5:1） */
    --ink-2: oklch(0.76 0.01 286);          /* 次文字：对 surface 8.0:1 */
    --ink-3: oklch(0.60 0.012 286);         /* 辅助文字：对 surface 4.3:1，仅限辅助信息 */
    --brand: oklch(0.66 0.15 255);          /* 品牌蓝提亮（作文字 5.5:1；作按钮填充时白字仅 ≈3.0:1，按钮文字须 ≥14px/600） */
    --brand-soft: oklch(0.66 0.15 255 / 14%); /* 品牌弱底：暗色透明度略升维持可辨 */
    --ok: oklch(0.68 0.13 150);             /* 成功绿提亮（作文字 6.3:1，正文级可用） */
    --ok-soft: oklch(0.68 0.13 150 / 14%);  /* 成功弱底 */
    --warn: oklch(0.72 0.13 80);            /* 警示黄提亮（6.8:1，暗色下可作文字） */
    --warn-soft: oklch(0.72 0.13 80 / 14%); /* 警示弱底 */
    --danger: oklch(0.68 0.17 25);          /* 危险红提亮（5.5:1） */
    --danger-soft: oklch(0.68 0.17 25 / 14%); /* 危险弱底 */
    --info: oklch(0.68 0.12 235);           /* 信息青蓝提亮（≈6:1） */
    --info-soft: oklch(0.68 0.12 235 / 14%); /* 信息弱底 */
    --diff-add: oklch(0.72 0.13 150);       /* 新增行文字（对暗 add-bg 4.8:1） */
    --diff-add-bg: oklch(0.68 0.13 150 / 10%); /* 新增行背景 */
    --diff-del: oklch(0.72 0.15 25);        /* 删除行文字（对暗 del-bg ≈4.5:1） */
    --diff-del-bg: oklch(0.68 0.17 25 / 10%); /* 删除行背景 */
    --sh-1: 0 1px 2px oklch(0 0 0 / 25%);   /* 一档：暗色阴影加重才可见 */
    --sh-2: 0 8px 24px oklch(0 0 0 / 32%), 0 2px 6px oklch(0 0 0 / 20%); /* 二档 */
    --sh-3: 0 20px 48px oklch(0 0 0 / 46%), 0 4px 12px oklch(0 0 0 / 28%); /* 三档 */
    --focus-ring: 0 0 0 3px var(--brand-soft); /* 焦点环：跟随暗色 brand-soft */
  }
}

/* ============================================================================
   手动锁定暗色（data-theme 覆盖系统偏好；值与上方 @media 段完全一致）
   ========================================================================== */
:root[data-theme="dark"] {
  color-scheme: dark;
  --shell: oklch(0.165 0.006 286);          /* 外框 */
  --canvas: oklch(0.192 0.006 286);         /* 画布 */
  --surface: oklch(0.225 0.007 286);        /* 卡片 */
  --raised: oklch(0.245 0.008 286);         /* 浮层 */
  --hover: oklch(0.27 0.007 286);           /* 悬停 */
  --border: oklch(1 0 0 / 9%);              /* 强边框 */
  --border-soft: oklch(1 0 0 / 6%);         /* 弱边框 */
  --ink: oklch(0.965 0 0);                  /* 主文字 */
  --ink-2: oklch(0.76 0.01 286);            /* 次文字 */
  --ink-3: oklch(0.60 0.012 286);           /* 辅助文字 */
  --brand: oklch(0.66 0.15 255);            /* 品牌蓝 */
  --brand-soft: oklch(0.66 0.15 255 / 14%); /* 品牌弱底 */
  --ok: oklch(0.68 0.13 150);               /* 成功绿 */
  --ok-soft: oklch(0.68 0.13 150 / 14%);    /* 成功弱底 */
  --warn: oklch(0.72 0.13 80);              /* 警示黄 */
  --warn-soft: oklch(0.72 0.13 80 / 14%);   /* 警示弱底 */
  --danger: oklch(0.68 0.17 25);            /* 危险红 */
  --danger-soft: oklch(0.68 0.17 25 / 14%); /* 危险弱底 */
  --info: oklch(0.68 0.12 235);             /* 信息青蓝 */
  --info-soft: oklch(0.68 0.12 235 / 14%);  /* 信息弱底 */
  --diff-add: oklch(0.72 0.13 150);         /* 新增行文字 */
  --diff-add-bg: oklch(0.68 0.13 150 / 10%); /* 新增行背景 */
  --diff-del: oklch(0.72 0.15 25);          /* 删除行文字 */
  --diff-del-bg: oklch(0.68 0.17 25 / 10%); /* 删除行背景 */
  --sh-1: 0 1px 2px oklch(0 0 0 / 25%);     /* 阴影一档 */
  --sh-2: 0 8px 24px oklch(0 0 0 / 32%), 0 2px 6px oklch(0 0 0 / 20%); /* 阴影二档 */
  --sh-3: 0 20px 48px oklch(0 0 0 / 46%), 0 4px 12px oklch(0 0 0 / 28%); /* 阴影三档 */
  --focus-ring: 0 0 0 3px var(--brand-soft); /* 焦点环 */
}

/* ============================================================================
   手动锁定亮色（data-theme 覆盖系统暗色偏好；值与 :root 默认段完全一致）
   ========================================================================== */
:root[data-theme="light"] {
  color-scheme: light;
  --shell: oklch(0.960 0.003 286);          /* 外框 */
  --canvas: oklch(0.988 0.001 286);         /* 画布 */
  --surface: oklch(1 0 0);                  /* 卡片 */
  --raised: oklch(1 0 0);                   /* 浮层 */
  --hover: oklch(0.966 0.002 286);          /* 悬停 */
  --border: oklch(0.918 0.004 286);         /* 强边框 */
  --border-soft: oklch(0.945 0.003 286);    /* 弱边框 */
  --ink: oklch(0.185 0.008 286);            /* 主文字 */
  --ink-2: oklch(0.44 0.012 286);           /* 次文字 */
  --ink-3: oklch(0.60 0.014 286);           /* 辅助文字 */
  --brand: oklch(0.545 0.155 255);          /* 品牌蓝 */
  --brand-soft: oklch(0.545 0.155 255 / 9%); /* 品牌弱底 */
  --ok: oklch(0.56 0.14 150);               /* 成功绿 */
  --ok-soft: oklch(0.56 0.14 150 / 11%);    /* 成功弱底 */
  --warn: oklch(0.66 0.14 80);              /* 警示黄 */
  --warn-soft: oklch(0.66 0.14 80 / 12%);   /* 警示弱底 */
  --danger: oklch(0.56 0.20 25);            /* 危险红 */
  --danger-soft: oklch(0.56 0.20 25 / 10%); /* 危险弱底 */
  --info: oklch(0.55 0.13 235);             /* 信息青蓝 */
  --info-soft: oklch(0.55 0.13 235 / 10%);  /* 信息弱底 */
  --diff-add: oklch(0.50 0.13 150);         /* 新增行文字 */
  --diff-add-bg: oklch(0.56 0.14 150 / 8%); /* 新增行背景 */
  --diff-del: oklch(0.52 0.17 25);          /* 删除行文字 */
  --diff-del-bg: oklch(0.56 0.20 25 / 8%);  /* 删除行背景 */
  --sh-1: 0 1px 2px oklch(0.25 0.02 286 / 5%), 0 1px 1px oklch(0.25 0.02 286 / 4%); /* 阴影一档 */
  --sh-2: 0 8px 24px oklch(0.25 0.02 286 / 9%), 0 2px 6px oklch(0.25 0.02 286 / 6%); /* 阴影二档 */
  --sh-3: 0 16px 40px oklch(0.25 0.02 286 / 15%), 0 3px 10px oklch(0.25 0.02 286 / 8%); /* 阴影三档 */
  --focus-ring: 0 0 0 3px var(--brand-soft); /* 焦点环 */
}

/* ============================================================================
   对比度验算结论（WCAG 2.x 相对亮度法，OKLCH→线性 sRGB 手工换算，两位小数）
   门槛：正文 ≥4.5:1；次级/大字/图形 ≥3:1（craft/color.md）。

   亮色（文字色 / 背景）           比值    结论
   --ink / --surface              18.65   正文 ✓
   --ink / --canvas               18.02   正文 ✓
   --ink-2 / --surface             7.79   正文 ✓（次级正文可用）
   --ink-3 / --surface             3.96   仅辅助信息（≥3 ✓，禁作正文）
   --brand / --surface             5.00   正文/链接 ✓
   白字 / --brand 填充              4.86   按钮文字 ✓
   --danger / --surface            5.15   正文 ✓
   --ok / --surface                4.37   仅徽章/大字（≥3 ✓；正文级绿用 --diff-add）
   --warn / --surface              3.16   仅图形/徽章（禁作正文，正文警示用 --ink+图标）
   --diff-add / --diff-add-bg      5.11   代码文字 ✓
   --diff-del / --diff-del-bg      5.32   代码文字 ✓
   --brand / --brand-soft 底       4.44   徽章级 ✓（12px/600）
   --ok / --ok-soft 底             3.81   徽章级 ✓（12px/600）

   暗色（文字色 / 背景）           比值    结论
   --ink / --surface              15.45   正文 ✓
   --ink-2 / --surface             7.96   正文 ✓
   --ink-3 / --surface             4.33   仅辅助信息（≥3 ✓）
   --brand / --surface             5.47   正文/链接 ✓
   白字 / --brand 填充              3.04   仅大字级：暗色主按钮文字必须 ≥14px/600
   --ok / --surface                6.27   正文 ✓
   --warn / --surface              6.80   正文 ✓（暗色下 warn 可作文字）
   --danger / --surface            5.50   正文 ✓
   --diff-add / --diff-add-bg      4.76   代码文字 ✓
   --diff-del / --diff-del-bg      4.46   代码文字（≈4.5，12.5px mono 可接受，继续用色+符号双通道）
   ========================================================================== */