From 3cfaa0409835087f651bad689a1190874cbf3dc5 Mon Sep 17 00:00:00 2001 From: JCAI Main Agent Date: Mon, 27 Jul 2026 02:45:42 +0800 Subject: [PATCH] =?UTF-8?q?M6(1/n):=20=E5=B7=A5=E4=BD=9C=E5=8F=B0=E4=BB=BB?= =?UTF-8?q?=E5=8A=A1=E8=A6=81=E7=B4=A0=20=E2=80=94=E2=80=94=20=E5=8E=9F?= =?UTF-8?q?=E5=9E=8B=201:1=20=E5=B9=B3=E7=A7=BB=E7=9A=84=E7=AC=AC=E4=B8=80?= =?UTF-8?q?=E5=B1=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 样式整文件搬(README 平移规则 1):app.css 2767 行 + proto.vendor.css + theme.css + console.css 原样搬,设计令牌与全部 jc-* / g-* 类名不动。 前端(按 §9 重排,渲染输出 1:1): - shared/:Ico / ScrollArea / useChatWidth 自原型搬,去掉 "use client" 等 Next 专有件; 失效的 react-hooks disable 指令按 §17 清掉(不改渲染) - shared/typed-fetch.ts:服务端交互唯一通道,路由契约来自 @contracts/api; 不引 Hono RPC 客户端(那要求前端 import 后端类型,违反 §5.1) - app/query.ts:TanStack Query;缓存失效由订阅层驱动,组件不轮询 - features/desk-task:任务列表(一条 = 一个活动的一次运行,不是一整条工作流)/ 标题区 + 工作区四页签 / 对话区(气泡二元制 + 卡族 + **composer 锁**) - @ui:ViewContainer 用**沙箱 iframe(sandbox 不含 allow-scripts)** —— 结构上无脚本执行权, 不依赖净化算法的完备性;ViewBlocks 渲染十一种视图块 feature 不得自行 dangerouslySetInnerHTML,eslint 有规则守着 后端:工作台路由 /api/desk/*(任务清单 / 任务详情 / 工单回传 / 自由输入 / 消息); 回传与后端校验**同 schema**;任务详情是服务端投影 —— 前端零过程状态,刷新即重建 已验证(真机):任务卡「A1 RFQ需求分析 · 序位 1/7 · awaiting-event」、 预算 2/40 步、1 张工单(LLM 步失败后转人兜底那张)、7 行带归侧标签的任务日志 358 个测试通过,门禁五道全绿;web 构建通过 Co-Authored-By: Claude Opus 5 (1M context) Claude-Session: https://claude.ai/code/session_01KeDBx2PHLavbURXB8LJJ7m --- .../packages/contracts/src/api/workbench.d.ts | 1957 ++++++++++++ apps/api/src/app/routes/desk.ts | 191 ++ apps/api/src/app/server.ts | 2 + apps/web/package.json | 2 + apps/web/src/app/app-shell.tsx | 192 +- apps/web/src/app/main.tsx | 17 +- apps/web/src/app/query.ts | 23 + apps/web/src/app/styles/app.css | 2767 +++++++++++++++++ apps/web/src/app/styles/console.css | 460 +++ apps/web/src/app/styles/proto.vendor.css | 1 + apps/web/src/app/styles/theme.css | 61 + apps/web/src/features/desk-task/contract.ts | 2 + apps/web/src/features/desk-task/index.ts | 8 + .../features/desk-task/internal/TaskChat.tsx | 175 ++ .../features/desk-task/internal/TaskList.tsx | 158 + .../desk-task/internal/ViewRegion.tsx | 223 ++ apps/web/src/shared/Ico.tsx | 112 + apps/web/src/shared/ScrollArea.tsx | 100 + apps/web/src/shared/typed-fetch.ts | 48 + apps/web/src/shared/useChatWidth.ts | 51 + apps/web/vite.config.ts | 1 + packages/contracts/src/api/workbench.ts | 97 + packages/ui-kit/package.json | 8 +- packages/ui-kit/src/ViewBlocks.tsx | 161 + packages/ui-kit/src/ViewContainer.tsx | 24 + packages/ui-kit/src/index.ts | 8 +- pnpm-lock.yaml | 127 +- 27 files changed, 6966 insertions(+), 10 deletions(-) create mode 100644 apps/api/src/app/routes/desk.ts create mode 100644 apps/web/src/app/query.ts create mode 100644 apps/web/src/app/styles/app.css create mode 100644 apps/web/src/app/styles/console.css create mode 100644 apps/web/src/app/styles/proto.vendor.css create mode 100644 apps/web/src/app/styles/theme.css create mode 100644 apps/web/src/features/desk-task/contract.ts create mode 100644 apps/web/src/features/desk-task/index.ts create mode 100644 apps/web/src/features/desk-task/internal/TaskChat.tsx create mode 100644 apps/web/src/features/desk-task/internal/TaskList.tsx create mode 100644 apps/web/src/features/desk-task/internal/ViewRegion.tsx create mode 100644 apps/web/src/shared/Ico.tsx create mode 100644 apps/web/src/shared/ScrollArea.tsx create mode 100644 apps/web/src/shared/typed-fetch.ts create mode 100644 apps/web/src/shared/useChatWidth.ts create mode 100644 packages/ui-kit/src/ViewBlocks.tsx create mode 100644 packages/ui-kit/src/ViewContainer.tsx diff --git a/api-report/packages/contracts/src/api/workbench.d.ts b/api-report/packages/contracts/src/api/workbench.d.ts index edb581d..3240f95 100644 --- a/api-report/packages/contracts/src/api/workbench.d.ts +++ b/api-report/packages/contracts/src/api/workbench.d.ts @@ -67,3 +67,1960 @@ export declare const healthRoute: { }>; }, z.core.$strip>; }; +/** 任务卡 —— 清单里一条 = 一个活动的一次运行,不是一整条工作流 */ +export declare const taskCardSchema: z.ZodObject<{ + id: z.core.$ZodBranded; + activity: z.ZodString; + title: z.ZodString; + runtime: z.ZodEnum<{ + running: "running"; + "awaiting-human": "awaiting-human"; + "awaiting-event": "awaiting-event"; + suspended: "suspended"; + "landing-blocked": "landing-blocked"; + terminal: "terminal"; + }>; + terminal: z.ZodOptional>; + position: z.ZodNumber; + total: z.ZodNumber; + workflowSubject: z.ZodString; + workflowState: z.ZodEnum<{ + terminated: "terminated"; + running: "running"; + waiting: "waiting"; + completed: "completed"; + abnormal: "abnormal"; + }>; + startedAt: z.ZodString; +}, z.core.$strip>; +export type TaskCard = z.infer; +export declare const listTasksRoute: { + readonly method: "GET"; + readonly path: "/api/desk/tasks"; + readonly output: z.ZodObject<{ + tasks: z.ZodArray; + activity: z.ZodString; + title: z.ZodString; + runtime: z.ZodEnum<{ + running: "running"; + "awaiting-human": "awaiting-human"; + "awaiting-event": "awaiting-event"; + suspended: "suspended"; + "landing-blocked": "landing-blocked"; + terminal: "terminal"; + }>; + terminal: z.ZodOptional>; + position: z.ZodNumber; + total: z.ZodNumber; + workflowSubject: z.ZodString; + workflowState: z.ZodEnum<{ + terminated: "terminated"; + running: "running"; + waiting: "waiting"; + completed: "completed"; + abnormal: "abnormal"; + }>; + startedAt: z.ZodString; + }, z.core.$strip>>; + }, z.core.$strip>; +}; +/** 任务详情 —— 工作区与对话区的服务端投影(前端零过程状态,刷新即重建) */ +export declare const taskDetailSchema: z.ZodObject<{ + card: z.ZodObject<{ + id: z.core.$ZodBranded; + activity: z.ZodString; + title: z.ZodString; + runtime: z.ZodEnum<{ + running: "running"; + "awaiting-human": "awaiting-human"; + "awaiting-event": "awaiting-event"; + suspended: "suspended"; + "landing-blocked": "landing-blocked"; + terminal: "terminal"; + }>; + terminal: z.ZodOptional>; + position: z.ZodNumber; + total: z.ZodNumber; + workflowSubject: z.ZodString; + workflowState: z.ZodEnum<{ + terminated: "terminated"; + running: "running"; + waiting: "waiting"; + completed: "completed"; + abnormal: "abnormal"; + }>; + startedAt: z.ZodString; + }, z.core.$strip>; + goal: z.ZodString; + budget: z.ZodObject<{ + steps: z.ZodString; + tokens: z.ZodString; + activeMinutes: z.ZodString; + humanCalls: z.ZodString; + }, z.core.$strip>; + stages: z.ZodArray; + label: z.ZodString; + round: z.ZodOptional; + }, z.core.$strip>>; + deliverables: z.ZodArray; + stage: z.core.$ZodBranded; + round: z.ZodOptional; + title: z.ZodString; + desc: z.ZodOptional; + blocks: z.ZodArray; + tone: z.ZodEnum<{ + ok: "ok"; + warn: "warn"; + danger: "danger"; + brand: "brand"; + muted: "muted"; + }>; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"kv">; + title: z.ZodOptional; + items: z.ZodArray>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"badges">; + title: z.ZodOptional; + items: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"table">; + title: z.ZodOptional; + cols: z.ZodArray; + rows: z.ZodArray>; + editable: z.ZodOptional; + editableCols: z.ZodOptional>; + linkDonut: z.ZodOptional; + unit: z.ZodOptional; + map: z.ZodArray; + }, z.core.$strip>>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"bars">; + title: z.ZodOptional; + max: z.ZodOptional; + redline: z.ZodOptional; + items: z.ZodArray; + tone: z.ZodOptional>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"donut">; + title: z.ZodOptional; + unit: z.ZodOptional; + items: z.ZodArray; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"mail">; + dir: z.ZodEnum<{ + out: "out"; + in: "in"; + }>; + statusLabel: z.ZodOptional; + editable: z.ZodOptional; + from: z.ZodString; + fromAddr: z.ZodOptional; + to: z.ZodString; + cc: z.ZodOptional; + subject: z.ZodString; + time: z.ZodString; + body: z.ZodString; + attachments: z.ZodOptional; + file: z.ZodOptional; + name: z.ZodString; + md: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"excel">; + name: z.ZodString; + sheet: z.ZodString; + rows: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"word">; + name: z.ZodString; + blocks: z.ZodArray; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"ul">; + items: z.ZodArray; + }, z.core.$strip>]>>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"pdf">; + name: z.ZodString; + src: z.ZodString; + }, z.core.$strip>], "kind">>; + }, z.core.$strip>>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"cards">; + title: z.ZodOptional; + items: z.ZodArray; + tone: z.ZodOptional>; + title: z.ZodString; + code: z.ZodOptional; + swap: z.ZodOptional; + }, z.core.$strip>>; + big: z.ZodString; + bigLabel: z.ZodOptional; + meta: z.ZodOptional>>; + note: z.ZodOptional; + from: z.ZodOptional; + time: z.ZodOptional; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"waiting">; + label: z.ZodString; + hint: z.ZodOptional; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"files">; + title: z.ZodOptional; + items: z.ZodArray; + name: z.ZodString; + md: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"excel">; + name: z.ZodString; + sheet: z.ZodString; + rows: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"word">; + name: z.ZodString; + blocks: z.ZodArray; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"ul">; + items: z.ZodArray; + }, z.core.$strip>]>>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"pdf">; + name: z.ZodString; + src: z.ZodString; + }, z.core.$strip>], "kind">; + }, z.core.$strip>>; + }, z.core.$strip>], "t">>; + state: z.ZodEnum<{ + released: "released"; + draft: "draft"; + "pending-acceptance": "pending-acceptance"; + rejected: "rejected"; + }>; + at: z.ZodOptional; + }, z.core.$strip>>; + workOrders: z.ZodArray; + preset: z.ZodOptional>; + ask: z.ZodString; + standard: z.ZodOptional; + steps: z.ZodOptional>; + basedOn: z.ZodOptional>; + blocks: z.ZodOptional; + tone: z.ZodEnum<{ + ok: "ok"; + warn: "warn"; + danger: "danger"; + brand: "brand"; + muted: "muted"; + }>; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"kv">; + title: z.ZodOptional; + items: z.ZodArray>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"badges">; + title: z.ZodOptional; + items: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"table">; + title: z.ZodOptional; + cols: z.ZodArray; + rows: z.ZodArray>; + editable: z.ZodOptional; + editableCols: z.ZodOptional>; + linkDonut: z.ZodOptional; + unit: z.ZodOptional; + map: z.ZodArray; + }, z.core.$strip>>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"bars">; + title: z.ZodOptional; + max: z.ZodOptional; + redline: z.ZodOptional; + items: z.ZodArray; + tone: z.ZodOptional>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"donut">; + title: z.ZodOptional; + unit: z.ZodOptional; + items: z.ZodArray; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"mail">; + dir: z.ZodEnum<{ + out: "out"; + in: "in"; + }>; + statusLabel: z.ZodOptional; + editable: z.ZodOptional; + from: z.ZodString; + fromAddr: z.ZodOptional; + to: z.ZodString; + cc: z.ZodOptional; + subject: z.ZodString; + time: z.ZodString; + body: z.ZodString; + attachments: z.ZodOptional; + file: z.ZodOptional; + name: z.ZodString; + md: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"excel">; + name: z.ZodString; + sheet: z.ZodString; + rows: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"word">; + name: z.ZodString; + blocks: z.ZodArray; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"ul">; + items: z.ZodArray; + }, z.core.$strip>]>>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"pdf">; + name: z.ZodString; + src: z.ZodString; + }, z.core.$strip>], "kind">>; + }, z.core.$strip>>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"cards">; + title: z.ZodOptional; + items: z.ZodArray; + tone: z.ZodOptional>; + title: z.ZodString; + code: z.ZodOptional; + swap: z.ZodOptional; + }, z.core.$strip>>; + big: z.ZodString; + bigLabel: z.ZodOptional; + meta: z.ZodOptional>>; + note: z.ZodOptional; + from: z.ZodOptional; + time: z.ZodOptional; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"waiting">; + label: z.ZodString; + hint: z.ZodOptional; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"files">; + title: z.ZodOptional; + items: z.ZodArray; + name: z.ZodString; + md: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"excel">; + name: z.ZodString; + sheet: z.ZodString; + rows: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"word">; + name: z.ZodString; + blocks: z.ZodArray; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"ul">; + items: z.ZodArray; + }, z.core.$strip>]>>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"pdf">; + name: z.ZodString; + src: z.ZodString; + }, z.core.$strip>], "kind">; + }, z.core.$strip>>; + }, z.core.$strip>], "t">>>; + fields: z.ZodArray; + placeholder: z.ZodOptional; + options: z.ZodOptional; + }, z.core.$strip>>>; + group: z.ZodOptional; + hint: z.ZodOptional; + ai: z.ZodOptional; + unit: z.ZodOptional; + required: z.ZodOptional; + cols: z.ZodOptional, z.ZodLiteral<2>]>>; + }, z.core.$strip>>; + submitLabel: z.ZodOptional; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + title: z.ZodString; + basis: z.ZodArray>; + stage: z.ZodOptional>; + done: z.ZodOptional; + result: z.ZodString; + values: z.ZodOptional>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + mode: z.ZodLiteral<"acceptance">; + deliverable: z.core.$ZodBranded; + criteria: z.ZodArray; + pass: z.ZodBoolean; + }, z.core.$strip>>; + actions: z.ZodOptional; + detail: z.ZodString; + }, z.core.$strip>>>; + fields: z.ZodDefault; + placeholder: z.ZodOptional; + options: z.ZodOptional; + }, z.core.$strip>>>; + group: z.ZodOptional; + hint: z.ZodOptional; + ai: z.ZodOptional; + unit: z.ZodOptional; + required: z.ZodOptional; + cols: z.ZodOptional, z.ZodLiteral<2>]>>; + }, z.core.$strip>>>; + passLabel: z.ZodOptional; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + title: z.ZodString; + basis: z.ZodArray>; + stage: z.ZodOptional>; + done: z.ZodOptional; + result: z.ZodString; + values: z.ZodOptional>; + }, z.core.$strip>>; + }, z.core.$strip>], "mode">>; + chat: z.ZodArray; + text: z.ZodString; + tag: z.ZodOptional>; + ref: z.ZodOptional>; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"human">; + text: z.ZodString; + by: z.core.$ZodBranded; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"system">; + type: z.ZodEnum<{ + human: "human"; + data: "data"; + time: "time"; + control: "control"; + }>; + text: z.ZodString; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"decision">; + ask: z.ZodString; + basis: z.ZodArray>; + recommend: z.ZodOptional; + options: z.ZodArray; + consequence: z.ZodOptional; + recommended: z.ZodOptional; + }, z.core.$strip>>; + allowCustom: z.ZodDefault; + chosen: z.ZodOptional; + note: z.ZodOptional; + }, z.core.$strip>>; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"elicitation">; + ask: z.ZodString; + basis: z.ZodOptional>>; + fields: z.ZodArray; + }, z.core.$strip>>; + done: z.ZodOptional; + values: z.ZodRecord; + reason: z.ZodOptional; + }, z.core.$strip>>; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"rating">; + ask: z.ZodString; + basis: z.ZodOptional>>; + done: z.ZodOptional; + score: z.ZodNumber; + note: z.ZodOptional; + }, z.core.$strip>>; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>], "k">>; + view: z.ZodArray; + tone: z.ZodEnum<{ + ok: "ok"; + warn: "warn"; + danger: "danger"; + brand: "brand"; + muted: "muted"; + }>; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"kv">; + title: z.ZodOptional; + items: z.ZodArray>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"badges">; + title: z.ZodOptional; + items: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"table">; + title: z.ZodOptional; + cols: z.ZodArray; + rows: z.ZodArray>; + editable: z.ZodOptional; + editableCols: z.ZodOptional>; + linkDonut: z.ZodOptional; + unit: z.ZodOptional; + map: z.ZodArray; + }, z.core.$strip>>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"bars">; + title: z.ZodOptional; + max: z.ZodOptional; + redline: z.ZodOptional; + items: z.ZodArray; + tone: z.ZodOptional>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"donut">; + title: z.ZodOptional; + unit: z.ZodOptional; + items: z.ZodArray; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"mail">; + dir: z.ZodEnum<{ + out: "out"; + in: "in"; + }>; + statusLabel: z.ZodOptional; + editable: z.ZodOptional; + from: z.ZodString; + fromAddr: z.ZodOptional; + to: z.ZodString; + cc: z.ZodOptional; + subject: z.ZodString; + time: z.ZodString; + body: z.ZodString; + attachments: z.ZodOptional; + file: z.ZodOptional; + name: z.ZodString; + md: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"excel">; + name: z.ZodString; + sheet: z.ZodString; + rows: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"word">; + name: z.ZodString; + blocks: z.ZodArray; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"ul">; + items: z.ZodArray; + }, z.core.$strip>]>>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"pdf">; + name: z.ZodString; + src: z.ZodString; + }, z.core.$strip>], "kind">>; + }, z.core.$strip>>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"cards">; + title: z.ZodOptional; + items: z.ZodArray; + tone: z.ZodOptional>; + title: z.ZodString; + code: z.ZodOptional; + swap: z.ZodOptional; + }, z.core.$strip>>; + big: z.ZodString; + bigLabel: z.ZodOptional; + meta: z.ZodOptional>>; + note: z.ZodOptional; + from: z.ZodOptional; + time: z.ZodOptional; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"waiting">; + label: z.ZodString; + hint: z.ZodOptional; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"files">; + title: z.ZodOptional; + items: z.ZodArray; + name: z.ZodString; + md: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"excel">; + name: z.ZodString; + sheet: z.ZodString; + rows: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"word">; + name: z.ZodString; + blocks: z.ZodArray; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"ul">; + items: z.ZodArray; + }, z.core.$strip>]>>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"pdf">; + name: z.ZodString; + src: z.ZodString; + }, z.core.$strip>], "kind">; + }, z.core.$strip>>; + }, z.core.$strip>], "t">>; + log: z.ZodArray; + sideLabel: z.ZodString; + title: z.ZodString; + summary: z.ZodOptional; + }, z.core.$strip>>; +}, z.core.$strip>; +export type TaskDetail = z.infer; +export declare const taskDetailRoute: { + readonly method: "GET"; + readonly path: "/api/desk/tasks/:taskId"; + readonly params: z.ZodObject<{ + taskId: z.core.$ZodBranded; + }, z.core.$strip>; + readonly output: z.ZodObject<{ + card: z.ZodObject<{ + id: z.core.$ZodBranded; + activity: z.ZodString; + title: z.ZodString; + runtime: z.ZodEnum<{ + running: "running"; + "awaiting-human": "awaiting-human"; + "awaiting-event": "awaiting-event"; + suspended: "suspended"; + "landing-blocked": "landing-blocked"; + terminal: "terminal"; + }>; + terminal: z.ZodOptional>; + position: z.ZodNumber; + total: z.ZodNumber; + workflowSubject: z.ZodString; + workflowState: z.ZodEnum<{ + terminated: "terminated"; + running: "running"; + waiting: "waiting"; + completed: "completed"; + abnormal: "abnormal"; + }>; + startedAt: z.ZodString; + }, z.core.$strip>; + goal: z.ZodString; + budget: z.ZodObject<{ + steps: z.ZodString; + tokens: z.ZodString; + activeMinutes: z.ZodString; + humanCalls: z.ZodString; + }, z.core.$strip>; + stages: z.ZodArray; + label: z.ZodString; + round: z.ZodOptional; + }, z.core.$strip>>; + deliverables: z.ZodArray; + stage: z.core.$ZodBranded; + round: z.ZodOptional; + title: z.ZodString; + desc: z.ZodOptional; + blocks: z.ZodArray; + tone: z.ZodEnum<{ + ok: "ok"; + warn: "warn"; + danger: "danger"; + brand: "brand"; + muted: "muted"; + }>; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"kv">; + title: z.ZodOptional; + items: z.ZodArray>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"badges">; + title: z.ZodOptional; + items: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"table">; + title: z.ZodOptional; + cols: z.ZodArray; + rows: z.ZodArray>; + editable: z.ZodOptional; + editableCols: z.ZodOptional>; + linkDonut: z.ZodOptional; + unit: z.ZodOptional; + map: z.ZodArray; + }, z.core.$strip>>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"bars">; + title: z.ZodOptional; + max: z.ZodOptional; + redline: z.ZodOptional; + items: z.ZodArray; + tone: z.ZodOptional>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"donut">; + title: z.ZodOptional; + unit: z.ZodOptional; + items: z.ZodArray; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"mail">; + dir: z.ZodEnum<{ + out: "out"; + in: "in"; + }>; + statusLabel: z.ZodOptional; + editable: z.ZodOptional; + from: z.ZodString; + fromAddr: z.ZodOptional; + to: z.ZodString; + cc: z.ZodOptional; + subject: z.ZodString; + time: z.ZodString; + body: z.ZodString; + attachments: z.ZodOptional; + file: z.ZodOptional; + name: z.ZodString; + md: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"excel">; + name: z.ZodString; + sheet: z.ZodString; + rows: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"word">; + name: z.ZodString; + blocks: z.ZodArray; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"ul">; + items: z.ZodArray; + }, z.core.$strip>]>>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"pdf">; + name: z.ZodString; + src: z.ZodString; + }, z.core.$strip>], "kind">>; + }, z.core.$strip>>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"cards">; + title: z.ZodOptional; + items: z.ZodArray; + tone: z.ZodOptional>; + title: z.ZodString; + code: z.ZodOptional; + swap: z.ZodOptional; + }, z.core.$strip>>; + big: z.ZodString; + bigLabel: z.ZodOptional; + meta: z.ZodOptional>>; + note: z.ZodOptional; + from: z.ZodOptional; + time: z.ZodOptional; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"waiting">; + label: z.ZodString; + hint: z.ZodOptional; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"files">; + title: z.ZodOptional; + items: z.ZodArray; + name: z.ZodString; + md: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"excel">; + name: z.ZodString; + sheet: z.ZodString; + rows: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"word">; + name: z.ZodString; + blocks: z.ZodArray; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"ul">; + items: z.ZodArray; + }, z.core.$strip>]>>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"pdf">; + name: z.ZodString; + src: z.ZodString; + }, z.core.$strip>], "kind">; + }, z.core.$strip>>; + }, z.core.$strip>], "t">>; + state: z.ZodEnum<{ + released: "released"; + draft: "draft"; + "pending-acceptance": "pending-acceptance"; + rejected: "rejected"; + }>; + at: z.ZodOptional; + }, z.core.$strip>>; + workOrders: z.ZodArray; + preset: z.ZodOptional>; + ask: z.ZodString; + standard: z.ZodOptional; + steps: z.ZodOptional>; + basedOn: z.ZodOptional>; + blocks: z.ZodOptional; + tone: z.ZodEnum<{ + ok: "ok"; + warn: "warn"; + danger: "danger"; + brand: "brand"; + muted: "muted"; + }>; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"kv">; + title: z.ZodOptional; + items: z.ZodArray>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"badges">; + title: z.ZodOptional; + items: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"table">; + title: z.ZodOptional; + cols: z.ZodArray; + rows: z.ZodArray>; + editable: z.ZodOptional; + editableCols: z.ZodOptional>; + linkDonut: z.ZodOptional; + unit: z.ZodOptional; + map: z.ZodArray; + }, z.core.$strip>>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"bars">; + title: z.ZodOptional; + max: z.ZodOptional; + redline: z.ZodOptional; + items: z.ZodArray; + tone: z.ZodOptional>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"donut">; + title: z.ZodOptional; + unit: z.ZodOptional; + items: z.ZodArray; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"mail">; + dir: z.ZodEnum<{ + out: "out"; + in: "in"; + }>; + statusLabel: z.ZodOptional; + editable: z.ZodOptional; + from: z.ZodString; + fromAddr: z.ZodOptional; + to: z.ZodString; + cc: z.ZodOptional; + subject: z.ZodString; + time: z.ZodString; + body: z.ZodString; + attachments: z.ZodOptional; + file: z.ZodOptional; + name: z.ZodString; + md: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"excel">; + name: z.ZodString; + sheet: z.ZodString; + rows: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"word">; + name: z.ZodString; + blocks: z.ZodArray; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"ul">; + items: z.ZodArray; + }, z.core.$strip>]>>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"pdf">; + name: z.ZodString; + src: z.ZodString; + }, z.core.$strip>], "kind">>; + }, z.core.$strip>>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"cards">; + title: z.ZodOptional; + items: z.ZodArray; + tone: z.ZodOptional>; + title: z.ZodString; + code: z.ZodOptional; + swap: z.ZodOptional; + }, z.core.$strip>>; + big: z.ZodString; + bigLabel: z.ZodOptional; + meta: z.ZodOptional>>; + note: z.ZodOptional; + from: z.ZodOptional; + time: z.ZodOptional; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"waiting">; + label: z.ZodString; + hint: z.ZodOptional; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"files">; + title: z.ZodOptional; + items: z.ZodArray; + name: z.ZodString; + md: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"excel">; + name: z.ZodString; + sheet: z.ZodString; + rows: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"word">; + name: z.ZodString; + blocks: z.ZodArray; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"ul">; + items: z.ZodArray; + }, z.core.$strip>]>>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"pdf">; + name: z.ZodString; + src: z.ZodString; + }, z.core.$strip>], "kind">; + }, z.core.$strip>>; + }, z.core.$strip>], "t">>>; + fields: z.ZodArray; + placeholder: z.ZodOptional; + options: z.ZodOptional; + }, z.core.$strip>>>; + group: z.ZodOptional; + hint: z.ZodOptional; + ai: z.ZodOptional; + unit: z.ZodOptional; + required: z.ZodOptional; + cols: z.ZodOptional, z.ZodLiteral<2>]>>; + }, z.core.$strip>>; + submitLabel: z.ZodOptional; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + title: z.ZodString; + basis: z.ZodArray>; + stage: z.ZodOptional>; + done: z.ZodOptional; + result: z.ZodString; + values: z.ZodOptional>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + mode: z.ZodLiteral<"acceptance">; + deliverable: z.core.$ZodBranded; + criteria: z.ZodArray; + pass: z.ZodBoolean; + }, z.core.$strip>>; + actions: z.ZodOptional; + detail: z.ZodString; + }, z.core.$strip>>>; + fields: z.ZodDefault; + placeholder: z.ZodOptional; + options: z.ZodOptional; + }, z.core.$strip>>>; + group: z.ZodOptional; + hint: z.ZodOptional; + ai: z.ZodOptional; + unit: z.ZodOptional; + required: z.ZodOptional; + cols: z.ZodOptional, z.ZodLiteral<2>]>>; + }, z.core.$strip>>>; + passLabel: z.ZodOptional; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + title: z.ZodString; + basis: z.ZodArray>; + stage: z.ZodOptional>; + done: z.ZodOptional; + result: z.ZodString; + values: z.ZodOptional>; + }, z.core.$strip>>; + }, z.core.$strip>], "mode">>; + chat: z.ZodArray; + text: z.ZodString; + tag: z.ZodOptional>; + ref: z.ZodOptional>; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"human">; + text: z.ZodString; + by: z.core.$ZodBranded; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"system">; + type: z.ZodEnum<{ + human: "human"; + data: "data"; + time: "time"; + control: "control"; + }>; + text: z.ZodString; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"decision">; + ask: z.ZodString; + basis: z.ZodArray>; + recommend: z.ZodOptional; + options: z.ZodArray; + consequence: z.ZodOptional; + recommended: z.ZodOptional; + }, z.core.$strip>>; + allowCustom: z.ZodDefault; + chosen: z.ZodOptional; + note: z.ZodOptional; + }, z.core.$strip>>; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"elicitation">; + ask: z.ZodString; + basis: z.ZodOptional>>; + fields: z.ZodArray; + }, z.core.$strip>>; + done: z.ZodOptional; + values: z.ZodRecord; + reason: z.ZodOptional; + }, z.core.$strip>>; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"rating">; + ask: z.ZodString; + basis: z.ZodOptional>>; + done: z.ZodOptional; + score: z.ZodNumber; + note: z.ZodOptional; + }, z.core.$strip>>; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>], "k">>; + view: z.ZodArray; + tone: z.ZodEnum<{ + ok: "ok"; + warn: "warn"; + danger: "danger"; + brand: "brand"; + muted: "muted"; + }>; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"kv">; + title: z.ZodOptional; + items: z.ZodArray>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"badges">; + title: z.ZodOptional; + items: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"table">; + title: z.ZodOptional; + cols: z.ZodArray; + rows: z.ZodArray>; + editable: z.ZodOptional; + editableCols: z.ZodOptional>; + linkDonut: z.ZodOptional; + unit: z.ZodOptional; + map: z.ZodArray; + }, z.core.$strip>>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"bars">; + title: z.ZodOptional; + max: z.ZodOptional; + redline: z.ZodOptional; + items: z.ZodArray; + tone: z.ZodOptional>; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"donut">; + title: z.ZodOptional; + unit: z.ZodOptional; + items: z.ZodArray; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"mail">; + dir: z.ZodEnum<{ + out: "out"; + in: "in"; + }>; + statusLabel: z.ZodOptional; + editable: z.ZodOptional; + from: z.ZodString; + fromAddr: z.ZodOptional; + to: z.ZodString; + cc: z.ZodOptional; + subject: z.ZodString; + time: z.ZodString; + body: z.ZodString; + attachments: z.ZodOptional; + file: z.ZodOptional; + name: z.ZodString; + md: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"excel">; + name: z.ZodString; + sheet: z.ZodString; + rows: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"word">; + name: z.ZodString; + blocks: z.ZodArray; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"ul">; + items: z.ZodArray; + }, z.core.$strip>]>>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"pdf">; + name: z.ZodString; + src: z.ZodString; + }, z.core.$strip>], "kind">>; + }, z.core.$strip>>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"cards">; + title: z.ZodOptional; + items: z.ZodArray; + tone: z.ZodOptional>; + title: z.ZodString; + code: z.ZodOptional; + swap: z.ZodOptional; + }, z.core.$strip>>; + big: z.ZodString; + bigLabel: z.ZodOptional; + meta: z.ZodOptional>>; + note: z.ZodOptional; + from: z.ZodOptional; + time: z.ZodOptional; + }, z.core.$strip>>; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"waiting">; + label: z.ZodString; + hint: z.ZodOptional; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"files">; + title: z.ZodOptional; + items: z.ZodArray; + name: z.ZodString; + md: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"excel">; + name: z.ZodString; + sheet: z.ZodString; + rows: z.ZodArray>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"word">; + name: z.ZodString; + blocks: z.ZodArray; + text: z.ZodString; + }, z.core.$strip>, z.ZodObject<{ + t: z.ZodLiteral<"ul">; + items: z.ZodArray; + }, z.core.$strip>]>>; + }, z.core.$strip>, z.ZodObject<{ + kind: z.ZodLiteral<"pdf">; + name: z.ZodString; + src: z.ZodString; + }, z.core.$strip>], "kind">; + }, z.core.$strip>>; + }, z.core.$strip>], "t">>; + log: z.ZodArray; + sideLabel: z.ZodString; + title: z.ZodString; + summary: z.ZodOptional; + }, z.core.$strip>>; + }, z.core.$strip>; +}; +/** 回传工单 —— 与后端回传校验同 schema(§9.2) */ +export declare const replyWorkOrderRoute: { + readonly method: "POST"; + readonly path: "/api/desk/work-orders/reply"; + readonly body: z.ZodObject<{ + reply: z.ZodRecord; + }, z.core.$strip>; + readonly output: z.ZodObject<{ + ok: z.ZodBoolean; + producesCompletion: z.ZodBoolean; + }, z.core.$strip>; +}; +/** 负责人的自由输入 —— 人事件的第二形态 */ +export declare const sayRoute: { + readonly method: "POST"; + readonly path: "/api/desk/tasks/:taskId/say"; + readonly params: z.ZodObject<{ + taskId: z.core.$ZodBranded; + }, z.core.$strip>; + readonly body: z.ZodObject<{ + text: z.ZodString; + }, z.core.$strip>; + readonly output: z.ZodDiscriminatedUnion<[z.ZodObject<{ + k: z.ZodLiteral<"ai">; + text: z.ZodString; + tag: z.ZodOptional>; + ref: z.ZodOptional>; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"human">; + text: z.ZodString; + by: z.core.$ZodBranded; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"system">; + type: z.ZodEnum<{ + human: "human"; + data: "data"; + time: "time"; + control: "control"; + }>; + text: z.ZodString; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"decision">; + ask: z.ZodString; + basis: z.ZodArray>; + recommend: z.ZodOptional; + options: z.ZodArray; + consequence: z.ZodOptional; + recommended: z.ZodOptional; + }, z.core.$strip>>; + allowCustom: z.ZodDefault; + chosen: z.ZodOptional; + note: z.ZodOptional; + }, z.core.$strip>>; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"elicitation">; + ask: z.ZodString; + basis: z.ZodOptional>>; + fields: z.ZodArray; + }, z.core.$strip>>; + done: z.ZodOptional; + values: z.ZodRecord; + reason: z.ZodOptional; + }, z.core.$strip>>; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>, z.ZodObject<{ + k: z.ZodLiteral<"rating">; + ask: z.ZodString; + basis: z.ZodOptional>>; + done: z.ZodOptional; + score: z.ZodNumber; + note: z.ZodOptional; + }, z.core.$strip>>; + id: z.core.$ZodBranded; + at: z.ZodISODateTime; + }, z.core.$strip>], "k">; +}; +/** 消息要素 */ +export declare const listMessagesRoute: { + readonly method: "GET"; + readonly path: "/api/desk/messages"; + readonly output: z.ZodObject<{ + messages: z.ZodArray>; + }, z.core.$strip>; +}; diff --git a/apps/api/src/app/routes/desk.ts b/apps/api/src/app/routes/desk.ts new file mode 100644 index 0000000..9829235 --- /dev/null +++ b/apps/api/src/app/routes/desk.ts @@ -0,0 +1,191 @@ +/** + * 工作台路由 —— 五要素是**同一份过程事实的五种投影**(编码规范 §3;语义出处 OS 2.1)。 + * + * 「web 是纯呈现与输入面」:这里出的每一样都是服务端投影,前端零过程状态、刷新即重建(§9.2)。 + */ +import type { Hono } from 'hono'; +import type { ApiError, ChatMessage, TaskCard, ViewBlock } from '@contracts'; +import { + ATTRIBUTION_SIDE_LABEL, + listMessagesRoute, + listTasksRoute, + replyWorkOrderRoute, + sayRoute, + taskDetailRoute, + taskIdSchema, + workOrderReplySchema, +} from '@contracts'; +import { ReplyRejectedError } from '@modules/human-tool'; +import type { Container } from '../container.ts'; +import type { AppEnv } from '../http-env.ts'; + +export function registerDeskRoutes(app: Hono, container: Container): void { + /** 当前登录者;缺会话即 401 */ + async function me(account: string) { + const staff = await container.org.findByAccount(account); + return staff; + } + + /** 任务卡 —— 一条 = 一个活动的一次运行;序位取自工作流的节点实例 */ + async function toCard(task: Awaited>): Promise { + let position = 1; + let total = 1; + let subject = task.title; + let workflowState: TaskCard['workflowState'] = 'running'; + + if (task.workflowId !== undefined) { + const workflow = await container.process.getWorkflow(task.workflowId).catch(() => undefined); + if (workflow !== undefined) { + subject = workflow.subject; + workflowState = workflow.state; + const pkg = await container.process.getPackage(workflow.packageId, workflow.packageVersion); + const activityNodes = (pkg?.nodes ?? []).filter((n) => n.kind === 'activity' || n.kind === 'approval'); + total = Math.max(activityNodes.length, 1); + const index = activityNodes.findIndex((n) => n.id === task.nodeId); + position = index < 0 ? 1 : index + 1; + } + } + + return { + id: task.id, + activity: task.title, + title: task.title, + runtime: task.runtime, + ...(task.terminal === undefined ? {} : { terminal: task.terminal }), + position, + total, + workflowSubject: subject, + workflowState, + startedAt: task.startedAt, + }; + } + + app.get(listTasksRoute.path, async (c) => { + const staff = await me(c.get('account')); + if (staff === undefined) { + const body: ApiError = { code: 'unauthenticated', message: '会话无效' }; + return c.json(body, 401); + } + // 任务要素永远只装「我负责的任务」—— 跨人卡进对方的消息要素,不占任务清单 + const tasks = await container.task.listByOwner(staff.id); + return c.json({ tasks: await Promise.all(tasks.map(toCard)) }); + }); + + app.get(taskDetailRoute.path, async (c) => { + const staff = await me(c.get('account')); + if (staff === undefined) { + const body: ApiError = { code: 'unauthenticated', message: '会话无效' }; + return c.json(body, 401); + } + const taskId = taskIdSchema.parse(c.req.param('taskId')); + const task = await container.task.get(taskId); + + const [workOrders, chat, lines] = await Promise.all([ + container.humanTool.openWorkOrders(taskId), + container.interaction.timeline(taskId), + container.memory.taskLog(taskId), + ]); + const cards = await container.humanTool.chatCards(taskId); + + // 对话流 = 时间线 + 对话卡族,按时间全序 —— 与任务记忆同源、不同筛选 + const merged: ChatMessage[] = [...chat, ...cards].sort((a, b) => (a.at < b.at ? -1 : a.at > b.at ? 1 : 0)); + + // 视图区:活动推送的结构化块(尚无推送时给一份进度概览,不留空屏) + const view: ViewBlock[] = [ + { + t: 'kv', + title: '任务概览', + items: [ + { k: '活动', v: task.activityId }, + { k: '负责人', v: staff.name }, + { k: '状态', v: task.runtime }, + { k: '已用步数', v: `${task.used.steps} / ${task.caps.steps}` }, + ], + }, + ]; + + return c.json({ + card: await toCard(task), + goal: task.title, + budget: { + steps: `${task.used.steps}/${task.caps.steps}`, + tokens: `${task.used.tokens}/${task.caps.tokens}`, + activeMinutes: `${Math.round(task.used.activeMs / 60_000)}/${task.caps.activeMinutes}`, + humanCalls: `${task.used.humanCalls}/${task.caps.humanCalls}`, + }, + stages: [], + deliverables: [], + workOrders, + chat: merged, + view, + log: lines.map((l) => ({ + id: l.id, + at: l.at, + side: l.side, + sideLabel: ATTRIBUTION_SIDE_LABEL[l.side], + title: l.title, + ...(l.summary === undefined ? {} : { summary: l.summary }), + })), + }); + }); + + /** 回传:与后端回传校验**同 schema** —— 前端提交校验用的也是它 */ + app.post(replyWorkOrderRoute.path, async (c) => { + const staff = await me(c.get('account')); + if (staff === undefined) { + const body: ApiError = { code: 'unauthenticated', message: '会话无效' }; + return c.json(body, 401); + } + const parsed = workOrderReplySchema.safeParse((await c.req.json())['reply']); + if (!parsed.success) { + const body: ApiError = { code: 'validation-failed', message: '回传不合协议', detail: parsed.error.issues }; + return c.json(body, 400); + } + try { + const outcome = await container.humanTool.replyWorkOrder(parsed.data, staff.id); + return c.json({ ok: true, producesCompletion: outcome.producesCompletion }); + } catch (error) { + if (error instanceof ReplyRejectedError) { + // 驳回必附意见 / 必填未回填 / 已答不得再答 —— 三规矩的回传面 + const body: ApiError = { code: 'validation-failed', message: error.message, detail: error.violations }; + return c.json(body, 400); + } + throw error; + } + }); + + /** 自由输入 —— 人事件的第二形态:写入任务记忆,loop 作为观察;不驱动 flow 步 */ + app.post(sayRoute.path, async (c) => { + const staff = await me(c.get('account')); + if (staff === undefined) { + const body: ApiError = { code: 'unauthenticated', message: '会话无效' }; + return c.json(body, 401); + } + const taskId = taskIdSchema.parse(c.req.param('taskId')); + const parsed = sayRoute.body.safeParse(await c.req.json()); + if (!parsed.success) { + const body: ApiError = { code: 'validation-failed', message: '入参不合法' }; + return c.json(body, 400); + } + return c.json(await container.interaction.say(taskId, staff.id, parsed.data.text)); + }); + + app.get(listMessagesRoute.path, async (c) => { + const staff = await me(c.get('account')); + if (staff === undefined) { + const body: ApiError = { code: 'unauthenticated', message: '会话无效' }; + return c.json(body, 401); + } + const messages = await container.message.inbox(staff.id); + return c.json({ + messages: messages.map((m) => ({ + id: m.id, + kind: m.kind, + title: m.title, + body: m.body, + at: m.at, + read: m.readAt !== undefined, + })), + }); + }); +} diff --git a/apps/api/src/app/server.ts b/apps/api/src/app/server.ts index 3e93dc2..0e795a1 100644 --- a/apps/api/src/app/server.ts +++ b/apps/api/src/app/server.ts @@ -7,6 +7,7 @@ import type { ApiError } from '@contracts'; import { DEFAULT_LOGIN_ACCOUNT } from '@modules/org'; import type { Container } from './container.ts'; import type { AppEnv } from './http-env.ts'; +import { registerDeskRoutes } from './routes/desk.ts'; import { registerGovernanceRoutes } from './routes/governance.ts'; import { registerIngestRoutes } from './routes/ingest.ts'; import { registerWorkbenchRoutes } from './routes/workbench.ts'; @@ -40,6 +41,7 @@ export function createServer(container: Container): Hono { registerWorkbenchRoutes(app, container); registerGovernanceRoutes(app, container); + registerDeskRoutes(app, container); registerIngestRoutes(app, container); return app; diff --git a/apps/web/package.json b/apps/web/package.json index 64b92c2..35a3b07 100644 --- a/apps/web/package.json +++ b/apps/web/package.json @@ -9,6 +9,8 @@ "preview": "vite preview" }, "dependencies": { + "@tanstack/react-query": "^5.101.4", + "@tanstack/react-router": "^1.170.18", "react": "^19.2.0", "react-dom": "^19.2.0" }, diff --git a/apps/web/src/app/app-shell.tsx b/apps/web/src/app/app-shell.tsx index 9f3b327..ca0379d 100644 --- a/apps/web/src/app/app-shell.tsx +++ b/apps/web/src/app/app-shell.tsx @@ -1,10 +1,196 @@ /** - * 应用壳 —— M0 骨架。工作台五要素 / 治理台九功能的 features 自 M6 起挂入。 + * 工作台外壳 —— 自原型 `(proto)/page.tsx` 平移(README《前端 UI · 原型 1:1 平移》)。 + * + * 左轨 = 品牌 → **工作台五要素**(任务 / 审批 / 消息 / 纪要 / 汇报)→ 轨底身份; + * 任务四区 = 左栏列表区 / 中上标题区 / 中下工作区 / 右栏对话区。 + * + * **前端零过程状态**:数据全部来自服务端投影,刷新即从投影重建(§9.2)。 */ +import { useState } from 'react'; +import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'; +import type { Session, TaskCard, TaskDetail } from '@contracts'; +import { listMessagesRoute, listTasksRoute, replyWorkOrderRoute, sayRoute, sessionRoute, taskDetailRoute } from '@contracts'; +import { TaskChat, TaskList, ViewRegion } from '@features/desk-task'; +import { Ico } from '@web-shared/Ico.tsx'; +import { call } from '@web-shared/typed-fetch.ts'; +import { useChatWidth } from '@web-shared/useChatWidth.ts'; +import { queryKeys } from './query.ts'; + +type ModuleKey = 'tasks' | 'approvals' | 'messages' | 'minutes' | 'report'; + +const NAV_MODULES: ReadonlyArray<{ key: ModuleKey; label: string; icon: string }> = [ + { key: 'tasks', label: '任务', icon: 'list-checks' }, + { key: 'approvals', label: '审批', icon: 'file-check' }, + { key: 'messages', label: '消息', icon: 'messages-square' }, + { key: 'minutes', label: '纪要', icon: 'notebook-pen' }, + { key: 'report', label: '汇报', icon: 'bar-chart' }, +]; + export function AppShell() { + const queryClient = useQueryClient(); + const [module, setModule] = useState('tasks'); + const [taskId, setTaskId] = useState(''); + const [collapsed, setCollapsed] = useState(false); + const split = useChatWidth(); + + const session = useQuery({ + queryKey: queryKeys.session, + queryFn: () => call(sessionRoute), + }); + + const tasks = useQuery({ + queryKey: queryKeys.tasks, + queryFn: () => call<{ tasks: TaskCard[] }>(listTasksRoute), + }); + + const messages = useQuery({ + queryKey: queryKeys.messages, + queryFn: () => call<{ messages: Array<{ id: string; title: string; body: string; at: string; read: boolean }> }>( + listMessagesRoute, + ), + enabled: module === 'messages', + }); + + const list = tasks.data?.tasks ?? []; + const active = list.filter((t) => t.terminal === undefined); + const current = taskId !== '' ? taskId : (active[0]?.id ?? list[0]?.id ?? ''); + + const detail = useQuery({ + queryKey: queryKeys.task(current), + queryFn: () => call(taskDetailRoute, { params: { taskId: current } }), + enabled: current !== '', + }); + + const reply = useMutation({ + mutationFn: (payload: Record) => + call<{ ok: boolean }>(replyWorkOrderRoute, { body: { reply: payload } }), + // 回传后按目标失效缓存 —— 组件不自行轮询 + onSuccess: () => { + void queryClient.invalidateQueries({ queryKey: queryKeys.task(current) }); + void queryClient.invalidateQueries({ queryKey: queryKeys.tasks }); + }, + }); + + const say = useMutation({ + mutationFn: (text: string) => call(sayRoute, { params: { taskId: current }, body: { text } }), + onSuccess: () => void queryClient.invalidateQueries({ queryKey: queryKeys.task(current) }), + }); + + const me = session.data?.staff.name ?? '—'; + // composer 锁:有卡在等作答时锁住自由输入 + const locked = (detail.data?.workOrders ?? []).some((o) => o.done === undefined); + return ( -
-
JCAI · 任务操作系统 —— M0 骨架
+
+
+ + + {module === 'tasks' ? ( +
+ {collapsed && ( + + )} + setCollapsed(true)} + /> + {detail.data !== undefined ? ( + reply.mutate(payload)} /> + ) : ( +
+
+ + {tasks.isLoading ? '载入中…' : '还没有落到你工位的任务'} +
+
+ )} + {detail.data !== undefined && ( + + )} + {detail.data !== undefined && ( + say.mutate(text)} + onDecide={() => undefined} + /> + )} +
+ ) : ( +
+
+
+

{NAV_MODULES.find((m) => m.key === module)?.label}

+ 工作台五要素 —— 同一份过程事实的五种投影 +
+
+ {module === 'messages' ? ( +
    + {(messages.data?.messages ?? []).map((m) => ( +
  • + {m.title} +

    {m.body}

    + +
    • + ))} + {(messages.data?.messages ?? []).length === 0 && ( +
  • 暂无消息
    • + )} +
+ ) : ( +
+ + 该要素随 M6 后续接入 +
+ )} +
+ )} +
); } diff --git a/apps/web/src/app/main.tsx b/apps/web/src/app/main.tsx index b0a999d..d139488 100644 --- a/apps/web/src/app/main.tsx +++ b/apps/web/src/app/main.tsx @@ -1,16 +1,27 @@ /** - * apps/web 唯一组装层(编码规范 §9):路由、Provider、鉴权壳、SSE 连接。 - * M0:骨架 —— 两台原型的 1:1 平移自 M6 起(README《前端 UI · 原型 1:1 平移》)。 + * apps/web 唯一组装层(编码规范 §9):Provider、鉴权壳、SSE 连接。 + * 样式整文件搬自两台原型:设计令牌 + 全部 `jc-*` 组件样式 + vendor 皮肤。 */ import { StrictMode } from 'react'; import { createRoot } from 'react-dom/client'; +import { QueryClientProvider } from '@tanstack/react-query'; +import './styles/proto.vendor.css'; +import './styles/app.css'; +import './styles/theme.css'; +import './styles/console.css'; import { AppShell } from './app-shell.tsx'; +import { queryClient } from './query.ts'; const container = document.getElementById('root'); if (!container) throw new Error('#root 缺失'); createRoot(container).render( - + + {/* .proto-root 是设计令牌的作用域(原型 app.css 的 `.proto-root .app-shell`) */} +
+ +
+ , ); diff --git a/apps/web/src/app/query.ts b/apps/web/src/app/query.ts new file mode 100644 index 0000000..2e89cbb --- /dev/null +++ b/apps/web/src/app/query.ts @@ -0,0 +1,23 @@ +/** + * 服务端状态 —— TanStack Query(编码规范 §1 / §9.2)。 + * 「SSE 事件到达 → 按信封目标失效对应缓存,由订阅层统一做;组件禁止自行轮询或手写缓存。」 + */ +import { QueryClient } from '@tanstack/react-query'; + +export const queryClient = new QueryClient({ + defaultOptions: { + queries: { + // 缓存失效由 SSE 订阅层驱动,不靠组件轮询 + refetchOnWindowFocus: false, + retry: 1, + staleTime: 5_000, + }, + }, +}); + +export const queryKeys = { + session: ['session'] as const, + tasks: ['desk', 'tasks'] as const, + task: (id: string) => ['desk', 'task', id] as const, + messages: ['desk', 'messages'] as const, +}; diff --git a/apps/web/src/app/styles/app.css b/apps/web/src/app/styles/app.css new file mode 100644 index 0000000..d98e9fe --- /dev/null +++ b/apps/web/src/app/styles/app.css @@ -0,0 +1,2767 @@ +/* ============================================================================ + JCAI 设计层（盖在 proto.vendor.css 之上） + —— 设计令牌 + 交互增强 + 逻辑特有组件（里程碑工作区 / 会话流 / 模块占位页）。 + 身份系统： + · 产品主色 = 飞书蓝 #3370FF（Universe Design 蓝阶 B500，深浅按 B600/B700/B100/B50） + · AI 在场 = 蓝→紫渐变（#3370FF → #7F3BF5），用于 AI 头像/品牌标/当前阶段流光 + · 中性色 = 飞书灰阶（#1F2329 正文 / #646A73 次要 / #DEE0E3 描边） + · 数据字符（时间戳/延迟/编号）走等宽字体，强化「agent 控制台」气质 + ========================================================================== */ + +.proto-root { display: contents; } + +.proto-root .app-shell { + /* —— 飞书蓝阶 —— */ + --brand: #3370ff; + --brand-deep: #245bdb; /* hover */ + --brand-pressed: #1c4cba; + --brand-soft: #e1eaff; /* B100 */ + --brand-wash: #f0f4ff; /* B50 */ + /* —— AI 在场渐变 —— */ + --ai-a: #3370ff; + --ai-b: #7f3bf5; + --ai-grad: linear-gradient(135deg, var(--ai-a), var(--ai-b)); + /* —— 飞书中性阶 —— */ + --ink: #1f2329; + --ink-2: #41464e; + --ink-3: #646a73; + --ink-4: #8f959e; + --line: #dee0e3; + --line-soft: #e8eaed; + --canvas: #f0f2f5; + --soft: #f8f9fb; + /* —— 图底三级明度：页面底(最深) < 面板内衬洗底 < 白卡 —— + 页面底加深(覆盖 vendor :root 的 --jcai-bg #f3f5f8)，白面板才「浮」得起来； + 面板内衬(--wl-bg / 对话流)必须明显浅于页面底，读作「卡内洗底」而非页面底串进卡里 */ + --jcai-bg: #e6eaf1; + --wl-bg: #f2f4f8; --cardline: #e1e6ec; --card-shadow: 0 1px 2px rgba(31, 35, 41, .05); + /* —— 功能色（飞书功能色系，文字用加深档保证对比度）—— */ + --ok: #278717; --ok-accent: #34c724; --ok-soft: #e8f8e4; + --warn: #de7802; --warn-accent: #ff8800; --warn-soft: #fff4e5; + --danger: #d83931; --danger-accent: #f54a45; --danger-soft: #feeae9; + /* —— 阶段类型强调色（飞书扩展色板）—— */ + --st-auto: #4954e6; --st-auto-soft: #f0f1fd; + --st-execute: #e07a00; --st-execute-soft: #fff4e5; + --st-decision: #7f3bf5; --st-decision-soft: #f5f0fe; + --st-collab: #0aa294; --st-collab-soft: #e4f8f5; + --st-wait: #6a7590; --st-wait-soft: #eef0f5; + /* —— 字体 / 投影 / 动效 —— */ + --mono: ui-monospace, "SF Mono", SFMono-Regular, "JetBrains Mono", Menlo, Consolas, monospace; + --shadow-1: 0 1px 2px rgba(31, 35, 41, .06); + --shadow-2: 0 6px 20px rgba(31, 35, 41, .08); + --shadow-brand: 0 6px 16px rgba(51, 112, 255, .22); + --t-fast: .16s cubic-bezier(.3, 0, .2, 1); + --t-med: .26s cubic-bezier(.3, 0, .2, 1); + + font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; +} + +/* 焦点可见性：键盘导航统一品牌色描环 */ +.proto-root :where(button, input, textarea, select, a, [tabindex]):focus-visible { + outline: 2px solid var(--brand); + outline-offset: 2px; + border-radius: 8px; +} + +/* 细滚动条（三栏滚动区统一） */ +/* ===== 滚动条 ===== + 主滚动区（清单/视图/对话/消息详情/文件页）一律走自绘 ScrollArea 组件（_components/ScrollArea.tsx）： + 原生滚动条彻底隐藏（零占位、永不挤版面），自绘 thumb 悬浮在内衬/列间隔上—— + 移入立即现身、移出/停止滚动 800ms 淡出、可拖拽。原生滚动条的伪类/变量动态切换在 Blink + 不触发重绘（实测），故不再用任何原生方案做显隐。 + 其余零散原生滚动条（表格横滚等）：静态细条融入设计系统。 */ +.proto-root { scrollbar-width: thin; scrollbar-color: #c9ced6 transparent; } + +/* 自绘滚动区骨架 */ +.proto-root .jc-sa { position: relative; min-width: 0; } +.proto-root .jc-sa--fill { flex: 1 1 auto; min-height: 0; } +.proto-root .jc-sa--full { height: 100%; min-height: 0; } +.proto-root .jc-sa-vp { height: 100%; overflow-y: auto; overflow-x: hidden; scrollbar-width: none; } +.proto-root .jc-sa-vp::-webkit-scrollbar { display: none; } +.proto-root .jc-sa-thumb { position: absolute; top: 0; width: 5px; border-radius: 999px; background: rgba(31, 35, 41, .32); opacity: 0; pointer-events: none; transition: opacity .18s ease; z-index: 8; } +.proto-root .jc-sa-thumb.on { opacity: 1; pointer-events: auto; } +.proto-root .jc-sa-thumb:hover, +.proto-root .jc-sa-thumb:active { background: rgba(31, 35, 41, .5); } + +.proto-root ::selection { background: var(--brand-soft); } + +/* ============================== 外壳 / 导航 ============================== */ +/* 品牌标与 AI 头像共用「AI 在场」渐变 + 呼吸光晕（签名元素之一） */ +.proto-root .app-nav-mark { + background: var(--ai-grad); + animation: aiBreath 4.2s ease-in-out infinite; +} +.proto-root .icon-button { transition: background var(--t-fast), color var(--t-fast); } +.proto-root .top-search { transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .top-search:focus-within { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(51, 112, 255, .14); } + +@keyframes aiBreath { + 0%, 100% { box-shadow: 0 2px 8px rgba(51, 112, 255, .32); } + 50% { box-shadow: 0 3px 18px rgba(127, 59, 245, .38); } +} + +/* ====================== 模块占位页（消息 / 纪要 / 日报） ====================== */ +.proto-root .jc-mod-stage { min-width: 0; min-height: 0; display: grid; place-items: center; padding: 24px; } +.proto-root .jc-mod-hero { width: min(560px, 92%); background: #fff; border: 1px solid var(--line-soft); border-radius: 18px; box-shadow: var(--shadow-2); padding: 44px 48px 38px; text-align: center; position: relative; overflow: hidden; animation: rise var(--t-med) both; } +.proto-root .jc-mod-hero::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--ai-grad); } +.proto-root .jc-mod-hero-ico { width: 60px; height: 60px; margin: 0 auto; border-radius: 17px; display: grid; place-items: center; background: var(--ai-grad); color: #fff; box-shadow: var(--shadow-brand); } +.proto-root .jc-mod-hero-tag { display: inline-flex; margin-top: 16px; font-size: 11px; font-weight: 700; letter-spacing: .1em; color: var(--brand); background: var(--brand-wash); border: 1px solid var(--brand-soft); border-radius: 999px; padding: 3px 12px; } +.proto-root .jc-mod-hero h2 { margin: 10px 0 0; font-size: 22px; font-weight: 800; color: var(--ink); letter-spacing: -.01em; } +.proto-root .jc-mod-hero > p { margin: 10px auto 0; max-width: 40em; font-size: 13.5px; line-height: 1.75; color: var(--ink-2); } +.proto-root .jc-mod-hero-chips { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin-top: 18px; } +.proto-root .jc-mod-hero-chips span { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: var(--ink-2); background: var(--soft); border: 1px solid var(--line-soft); border-radius: 999px; padding: 5px 12px; } +.proto-root .jc-mod-hero-chips svg { color: var(--brand); } +.proto-root .jc-mod-hero-foot { margin: 22px 0 0; padding-top: 16px; border-top: 1px dashed var(--line-soft); font-size: 12px; color: var(--ink-4); } + +/* ===== 三栏衔接：列表区 / 视图区 / 对话区统一为三张等距同规格卡片 ===== + 覆盖 vendor 的「左中融合 + 右侧浮卡」旧结构：等间距 gutter、同圆角、同描边、同投影 */ +/* 对话区宽度 = var(--jc-chat-w)（用户拖拽分隔柄写入 workspace inline style），未拖时走各断点默认 */ +.proto-root .workspace { position: relative; gap: 12px; padding: 12px 14px; --jc-ws-pr: 14px; --jcai-ai-chat-width: var(--jc-chat-w, 440px); grid-template-columns: 310px minmax(0, 1fr) var(--jcai-ai-chat-width); } +/* 收起态 grid：无媒体查询、全断点生效，覆盖 vendor 各断点的三栏定义（修列错位 bug）。 + 清单收起→[视图区 1fr | 会话区]；会话收起→[清单 | 视图区 1fr]；都收起→[视图区 1fr]。 */ +.proto-root .workspace.jc-side-collapsed:not(.jc-chat-collapsed) { grid-template-columns: minmax(0, 1fr) var(--jcai-ai-chat-width, 440px); } +.proto-root .workspace.jc-chat-collapsed:not(.jc-side-collapsed) { grid-template-columns: 256px minmax(0, 1fr); } +.proto-root .workspace.jc-side-collapsed.jc-chat-collapsed { grid-template-columns: minmax(0, 1fr); } +.proto-root .workspace .task-sidebar { + border: 1px solid var(--line-soft) !important; /* 盖掉 vendor 的拼接线(!important) */ + border-radius: 12px; + box-shadow: var(--shadow-1) !important; /* 盖掉 vendor 的 inset 拼接阴影 */ + background: #fff; +} +/* 视图区不再有外层卡：透明容器，画布上直接摆「驾驶舱 + 工作视图」两张卡； + 仅二级文件界面（.jc-panel-card）恢复面板卡外观 */ +.proto-root .workspace .execution-panel:not(.jc-panel-card) { + border: 0 !important; + border-radius: 0; + box-shadow: none !important; + background: transparent; + display: flex; /* 单列填满：ScrollArea(jc-sa--fill) 接管滚动 */ + flex-direction: column; + overflow: visible; /* 放行自绘 thumb 悬进列间 gutter（inset 负值） */ +} +.proto-root .workspace .execution-panel.jc-panel-card { + border: 1px solid var(--line-soft) !important; + border-radius: 12px; + box-shadow: var(--shadow-1); + background: #fff; + overflow: hidden; +} +.proto-root .session-chat { border-radius: 12px; } +/* 窄屏（≤1380 视口）：收窄三栏配比，保证对话区不被裁切（拖拽值 --jc-chat-w 仍优先） */ +@media (max-width: 1380px) { + .proto-root .workspace { --jc-ws-pr: 12px; --jcai-ai-chat-width: var(--jc-chat-w, clamp(430px, 34vw, 560px)); grid-template-columns: 256px minmax(0, 1fr) var(--jcai-ai-chat-width); gap: 10px; padding: 10px 12px; } +} + +/* 对话区/视图区可调比例：workspace 直属分隔柄，锚在「视图区↔对话区」的 12px gutter 上 + （不能放进 .session-chat——其 overflow:hidden 会裁掉负偏移的柄）；拖拽调宽、双击复位 */ +/* 柄贴对话区左缘（跨边 -1/+5px），gutter 左半留给视图区自绘 thumb，两者不抢点击 */ +.proto-root .jc-vsplit { position: absolute; top: 12px; bottom: 12px; width: 6px; right: calc(var(--jcai-ai-chat-width, 440px) + var(--jc-ws-pr, 14px) - 5px); z-index: 7; cursor: col-resize; display: grid; place-items: center; touch-action: none; } +.proto-root .jc-vsplit::before { content: ""; width: 3px; height: 44px; border-radius: 999px; background: var(--ink-4); opacity: 0; transition: opacity var(--t-fast), background var(--t-fast), height var(--t-fast); } +.proto-root .jc-vsplit:hover::before { opacity: .55; } +.proto-root .jc-vsplit.dragging::before { opacity: 1; height: 64px; background: var(--brand); } + +/* ============================== 任务侧栏 ============================== */ +/* 统一 12px 网格节奏：卡间距 = 容器内衬 = 列间 gutter = 12（三栏一个拍子）。 + 滚动统一走自绘 ScrollArea（原生条零占位），padding 即视觉衬，无需滚道补偿 */ +.proto-root .task-sidebar .task-list { background: var(--wl-bg); display: flex; flex-direction: column; gap: 12px; padding: 12px; } +.proto-root .task-sidebar .primary-square { display: grid; place-items: center; transition: transform var(--t-fast), box-shadow var(--t-fast); } +.proto-root .task-sidebar .primary-square:hover { transform: translateY(-1px); box-shadow: var(--shadow-brand); } +.proto-root .task-sidebar .task-card { transition: transform var(--t-fast), box-shadow var(--t-fast), border-color var(--t-fast); } +.proto-root .task-sidebar .task-card:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(31, 35, 41, .09); } +.proto-root .status-filter-row button { transition: background var(--t-fast), color var(--t-fast); } + +/* ===== 任务卡（信息结构：头区[动效图标+域/来源+时效] → 标题 → 摘要 → 状态+进度 → 统计+负责人） ===== */ +.proto-root .task-card.jc-tc { display: flex; flex-direction: column; gap: 7px; margin: 0; padding: 10px 12px 9px; border-radius: 11px; } +.proto-root .task-card.jc-tc:not(.selected) { background: #fff; border: 1px solid var(--cardline); box-shadow: var(--card-shadow); } +.proto-root .task-card.jc-tc:hover:not(.selected) { border-color: #cdd5df; box-shadow: 0 3px 11px -3px rgba(31,35,41,.14); } +.proto-root .jc-tc-top { display: flex; align-items: center; gap: 8px; min-width: 0; } +/* 动效图标：任务色渐变方块，呼吸浮动；选中卡外圈追加旋转光环 */ +.proto-root .jc-tc-ico { position: relative; width: 28px; height: 28px; flex: none; border-radius: 8px; display: grid; place-items: center; color: #fff; background: linear-gradient(140deg, var(--task-color, var(--brand)), color-mix(in srgb, var(--task-color, var(--brand)) 58%, #1c2b6b)); animation: jcIcoBreath 3.6s ease-in-out infinite; } +@keyframes jcIcoBreath { + 0%, 100% { box-shadow: 0 2px 6px color-mix(in srgb, var(--task-color, var(--brand)) 35%, transparent); transform: translateY(0); } + 50% { box-shadow: 0 5px 14px color-mix(in srgb, var(--task-color, var(--brand)) 52%, transparent); transform: translateY(-1.5px); } +} +.proto-root .task-card.selected .jc-tc-ico::after { content: ""; position: absolute; inset: -4px; border-radius: 12px; padding: 1.5px; background: conic-gradient(from 0deg, transparent 12%, var(--task-color, var(--brand)), transparent 62%); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; animation: jcSpin 2.6s linear infinite; } +@keyframes jcSpin { to { transform: rotate(360deg); } } +.proto-root .jc-tc-tag { flex: 1; min-width: 0; font-style: normal; font-size: 10.5px; font-weight: 800; letter-spacing: .05em; color: var(--task-color, var(--brand)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +/* 主题行：小图标 + 主题（图标随任务色） */ +.proto-root .jc-tc-subjrow { display: flex; align-items: center; gap: 8px; min-width: 0; } +.proto-root .jc-tc-subjrow .jc-tc-ico { width: 24px; height: 24px; border-radius: 7px; } +/* 标题最重，摘要最轻 */ +.proto-root .task-card .jc-tc-title { margin: 0; font-size: 12.5px; font-weight: 700; color: var(--ink); line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } +/* 状态 + 任务色渐变进度 + 等宽百分比 */ +/* ================= 消息 / 纪要 / 日报 模块工作区（三栏骨架复用任务模块） ================= */ +/* 中栏滚动容器：统一内边距，彻底告别贴边；内容按分区卡片竖排 */ +.proto-root .jc-mod-scroll { display: flex; flex-direction: column; gap: 18px; padding: 22px 24px 30px; background: #fff; animation: rise var(--t-med) both; } + +/* ---- 通用小件：头像 / 头像组 / 状态胶囊 ---- */ +.proto-root .jc-ava { flex: none; border-radius: 999px; display: grid; place-items: center; color: #fff; font-weight: 800; line-height: 1; box-shadow: 0 1px 3px rgba(31,35,41,.2); } +.proto-root .jc-ava-stack { display: inline-flex; align-items: center; } +.proto-root .jc-ava-slot { margin-left: -8px; border-radius: 999px; box-shadow: 0 0 0 2px #fff; } +.proto-root .jc-ava-slot:first-child { margin-left: 0; } +.proto-root .jc-ava-more { width: 26px; height: 26px; display: grid; place-items: center; font-size: 10px; font-weight: 800; color: var(--ink-3); background: var(--soft); border: 1px solid var(--line); box-shadow: 0 0 0 2px #fff; } +.proto-root .jc-chip { display: inline-flex; align-items: center; gap: 5px; flex: none; font-size: 10px; font-weight: 700; border-radius: 999px; padding: 1px 9px; border: 1px solid; white-space: nowrap; } +.proto-root .jc-chip i { width: 5px; height: 5px; border-radius: 999px; flex: none; animation: wfpulse 1.5s ease-in-out infinite; } +.proto-root .jc-chip.t-todo { color: var(--danger); background: var(--danger-soft); border-color: #f6c6c3; } +.proto-root .jc-chip.t-todo i { background: var(--danger-accent); } +.proto-root .jc-chip.t-doing, .proto-root .jc-chip.t-brand { color: var(--brand-deep); background: var(--brand-wash); border-color: var(--brand-soft); } +.proto-root .jc-chip.t-doing i, .proto-root .jc-chip.t-brand i { background: var(--brand); } +.proto-root .jc-chip.t-done, .proto-root .jc-chip.t-ok { color: var(--ok); background: var(--ok-soft); border-color: #bfedb4; } +.proto-root .jc-chip.t-done i, .proto-root .jc-chip.t-ok i { background: var(--ok-accent); } +.proto-root .jc-chip.t-warn { color: var(--warn); background: var(--warn-soft); border-color: #fbd9a5; } +.proto-root .jc-chip.t-warn i { background: var(--warn-accent); } +.proto-root .jc-dim { color: var(--ink-4); } +.proto-root .jc-mono { font-family: var(--mono); font-size: .92em; color: var(--ink-4); letter-spacing: -.02em; } + +/* ---- 文档头 Hero ---- */ +.proto-root .jc-hero { display: flex; align-items: flex-start; gap: 14px; background: linear-gradient(118deg, var(--brand-wash), #f6f3ff 55%, #fbfcff); border: 1px solid var(--brand-soft); border-radius: 16px; padding: 16px 18px; } +.proto-root .jc-hero-ico { flex: none; width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; color: #fff; box-shadow: 0 8px 18px -5px rgba(51,112,255,.6); } +.proto-root .jc-hero-txt { flex: 1; min-width: 0; } +.proto-root .jc-hero-kicker { display: inline-block; font-size: 10px; font-weight: 800; letter-spacing: .08em; color: var(--brand-deep); background: var(--brand-wash); border-radius: 5px; padding: 1px 7px; margin-bottom: 5px; } +.proto-root .jc-hero-txt h2 { margin: 0; font-size: 18px; font-weight: 800; color: var(--ink); line-height: 1.4; letter-spacing: -.01em; } +.proto-root .jc-hero-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-top: 6px; font-size: 11.5px; color: var(--ink-3); } +.proto-root .jc-hero-meta b { font-weight: 700; color: var(--ink-2); } +.proto-root .jc-hero-chip { flex: none; padding-top: 2px; } + +/* ---- 分区 ---- */ +.proto-root .jc-sec { display: flex; flex-direction: column; gap: 11px; } +.proto-root .jc-sec-head { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; letter-spacing: .02em; color: var(--ink-2); } +.proto-root .jc-sec-head svg { flex: none; width: 22px; height: 22px; padding: 4px; border-radius: 7px; color: var(--brand-deep); background: var(--brand-wash); box-sizing: border-box; } +.proto-root .jc-sec-extra { margin-left: auto; font-size: 10px; font-weight: 600; letter-spacing: 0; color: var(--ink-4); } + +/* ---- 性质横幅 ---- */ +.proto-root .jc-banner { display: flex; align-items: center; gap: 9px; border-radius: 11px; padding: 10px 14px; font-size: 12.5px; font-weight: 600; border: 1px solid; } +.proto-root .jc-banner.t-brand { color: var(--brand-deep); background: var(--brand-wash); border-color: var(--brand-soft); } +.proto-root .jc-banner.t-warn { color: var(--warn); background: var(--warn-soft); border-color: #fbd9a5; } +.proto-root .jc-banner.t-ok { color: var(--ok); background: var(--ok-soft); border-color: #bfedb4; } + +/* ---- 邮件正文卡 ---- */ +.proto-root .jc-letter { border: 1px solid var(--line-soft); border-left: 3px solid var(--brand); border-radius: 0 12px 12px 0; background: linear-gradient(180deg, #fbfcfe, #fff); padding: 14px 16px; } +.proto-root .jc-letter-head { display: flex; align-items: center; gap: 10px; padding-bottom: 11px; margin-bottom: 11px; border-bottom: 1px dashed var(--line-soft); } +.proto-root .jc-letter-from { flex: 1; min-width: 0; line-height: 1.35; } +.proto-root .jc-letter-from strong { display: block; font-size: 13px; font-weight: 700; color: var(--ink); } +.proto-root .jc-letter-from span { display: block; font-size: 10.5px; color: var(--ink-4); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +.proto-root .jc-letter-p { margin: 0 0 9px; font-size: 12.5px; line-height: 1.85; color: var(--ink-2); } +.proto-root .jc-letter-p:last-child { margin-bottom: 0; } +.proto-root .jc-atts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; } +.proto-root .jc-att { display: inline-flex; align-items: center; gap: 7px; background: #fff; border: 1px solid var(--line); border-radius: 9px; padding: 5px 10px 5px 6px; } +.proto-root .jc-att-ico { width: 24px; height: 24px; border-radius: 6px; display: grid; place-items: center; color: #fff; } +.proto-root .jc-att-ico.k-excel { background: linear-gradient(140deg, #34c724, #1a9611); } +.proto-root .jc-att-ico.k-pdf { background: linear-gradient(140deg, #f54a45, #c9302c); } +.proto-root .jc-att-ico.k-word { background: linear-gradient(140deg, #3370ff, #245bdb); } +.proto-root .jc-att em { font-style: normal; font-size: 11.5px; font-weight: 600; color: var(--ink-2); } +.proto-root .jc-att i { font-style: normal; font-size: 10px; color: var(--ink-4); font-family: var(--mono); } + +/* ---- AI 提取要点 ---- */ +.proto-root .jc-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; } +.proto-root .jc-factc { display: flex; align-items: center; gap: 9px; background: var(--soft); border: 1px solid var(--line-soft); border-radius: 10px; padding: 9px 12px; } +.proto-root .jc-factc-ico { flex: none; width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; color: var(--brand-deep); background: var(--brand-wash); } +.proto-root .jc-factc-txt { min-width: 0; line-height: 1.35; } +.proto-root .jc-factc-txt em { display: block; font-style: normal; font-size: 10px; color: var(--ink-4); } +.proto-root .jc-factc-txt strong { display: block; font-size: 12px; font-weight: 700; color: var(--ink); } + +/* ---- 关联任务卡 ---- */ +.proto-root .jc-taskcard { display: flex; align-items: center; gap: 11px; border: 1px solid var(--brand-soft); background: linear-gradient(120deg, var(--brand-wash), #fff 70%); border-radius: 12px; padding: 11px 13px; } +.proto-root .jc-taskcard-ico { flex: none; width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; color: #fff; background: linear-gradient(140deg, var(--brand), var(--brand-deep)); box-shadow: 0 3px 8px -2px rgba(51,112,255,.5); } +.proto-root .jc-taskcard-txt { flex: 1; min-width: 0; line-height: 1.4; } +/* 标题折行显示完整（宁可两行，也不截半句） */ +.proto-root .jc-taskcard-txt strong { display: block; font-size: 12.5px; font-weight: 700; line-height: 1.45; color: var(--ink); } +.proto-root .jc-taskcard-txt span { display: block; font-size: 10.5px; line-height: 1.5; color: var(--ink-4); } +.proto-root .jc-taskcard .card-btn { flex: none; } + +/* ===== 消息（邮件）：收件人行 + 外部徽标 ===== */ +.proto-root .jc-letter-addr { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 11px; color: var(--ink-3); padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dashed var(--line-soft); } +.proto-root .jc-letter-addr em { font-style: normal; font-size: 9.5px; font-weight: 700; color: var(--ink-4); background: var(--soft); border: 1px solid var(--line-soft); border-radius: 5px; padding: 1px 6px; } +.proto-root .jc-ext { margin-left: 7px; font-style: normal; font-size: 9.5px; font-weight: 800; color: var(--warn); background: var(--warn-soft); border-radius: 5px; padding: 1px 6px; vertical-align: middle; } + +/* ===== 下半：AI 分析区（淡品牌渐变分区，与上半原文视觉分离）===== */ +.proto-root .jc-ai-zone { display: flex; flex-direction: column; gap: 16px; margin-top: 4px; padding: 15px; border: 1px solid var(--brand-soft); border-radius: 16px; background: linear-gradient(180deg, var(--brand-wash), #fff 52%); } +.proto-root .jc-ai-head { display: flex; align-items: flex-start; gap: 10px; } +.proto-root .jc-ai-badge { flex: none; display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 800; color: #fff; background: linear-gradient(120deg, var(--brand), #7f3bf5); border-radius: 999px; padding: 4px 11px; box-shadow: 0 2px 7px -2px rgba(51, 112, 255, .6); } +.proto-root .jc-ai-head p { margin: 2px 0 0; font-size: 12.5px; line-height: 1.7; font-weight: 600; color: var(--ink-2); } + +/* 触发任务卡组：白卡浮在 AI 区上，左侧按性质着色 */ +.proto-root .jc-trigs { display: flex; flex-direction: column; gap: 9px; } +.proto-root .jc-trig { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid var(--cardline); border-left: 3px solid var(--line); border-radius: 11px; padding: 11px 13px; box-shadow: var(--card-shadow); } +.proto-root .jc-trig.t-brand { border-left-color: var(--brand); } +.proto-root .jc-trig.t-warn { border-left-color: var(--warn); } +.proto-root .jc-trig.t-doing { border-left-color: #7f3bf5; } +.proto-root .jc-trig.t-ok { border-left-color: var(--ok); } +.proto-root .jc-trig-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 5px; } +.proto-root .jc-trig-top { display: flex; align-items: center; gap: 8px; min-width: 0; } +.proto-root .jc-trig-top strong { font-size: 12.5px; font-weight: 700; color: var(--ink); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-trig-kind { flex: none; display: inline-flex; align-items: center; gap: 3px; font-size: 10px; font-weight: 800; border-radius: 6px; padding: 2px 7px; } +.proto-root .jc-trig-kind.t-brand { color: var(--brand-deep); background: var(--brand-wash); } +.proto-root .jc-trig-kind.t-warn { color: var(--warn); background: var(--warn-soft); } +.proto-root .jc-trig-kind.t-doing { color: #5b21cf; background: #f0e9ff; } +.proto-root .jc-trig-kind.t-ok { color: var(--ok); background: var(--ok-soft); } +.proto-root .jc-trig-owner { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; color: var(--ink-2); } +.proto-root .jc-trig-owner em { font-style: normal; font-size: 9.5px; font-weight: 800; border-radius: 5px; padding: 1px 6px; } +.proto-root .jc-trig-owner em.self { color: var(--brand-deep); background: var(--brand-wash); } +.proto-root .jc-trig-owner em.other { color: var(--warn); background: var(--warn-soft); } +.proto-root .jc-trig-reason { font-size: 11px; line-height: 1.55; color: var(--ink-3); } +.proto-root .jc-trig-act { flex: none; } +.proto-root .jc-trig-act .jc-chip { white-space: nowrap; } + +/* AI 判断无需触发 / 触发之外的补充说明 */ +.proto-root .jc-notrig { display: flex; align-items: flex-start; gap: 8px; font-size: 11.5px; line-height: 1.6; color: var(--ink-3); background: var(--soft); border: 1px dashed var(--line); border-radius: 10px; padding: 10px 13px; } +.proto-root .jc-notrig svg { flex: none; margin-top: 1px; color: var(--ink-4); } + +/* ===== 系统消息：触发事件卡（替代邮件正文卡，紫色系统味）===== */ +.proto-root .jc-sysev { border: 1px solid var(--line-soft); border-left: 3px solid #7f3bf5; border-radius: 0 12px 12px 0; background: linear-gradient(180deg, #fbfaff, #fff); padding: 14px 16px; display: flex; flex-direction: column; gap: 12px; } +.proto-root .jc-sysev-head { display: flex; align-items: center; gap: 10px; } +.proto-root .jc-sysev-ico { flex: none; width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; color: #fff; background: linear-gradient(140deg, #7f3bf5, #5b21cf); box-shadow: 0 3px 8px -2px rgba(127, 59, 245, .5); } +.proto-root .jc-sysev-tt { flex: 1; min-width: 0; line-height: 1.35; } +.proto-root .jc-sysev-tt em { display: block; font-style: normal; font-size: 10px; color: var(--ink-4); } +.proto-root .jc-sysev-tt strong { display: block; font-size: 13px; font-weight: 700; color: var(--ink); } +.proto-root .jc-sysev-cycle { flex: none; display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 700; color: #5b21cf; background: #f0e9ff; border-radius: 999px; padding: 3px 10px; white-space: nowrap; } +.proto-root .jc-sysev-runs { display: flex; flex-wrap: wrap; gap: 8px 20px; padding: 9px 12px; background: var(--soft); border: 1px solid var(--line-soft); border-radius: 10px; } +.proto-root .jc-sysev-runs > span { display: flex; align-items: center; gap: 7px; font-size: 11px; } +.proto-root .jc-sysev-runs em { font-style: normal; color: var(--ink-4); } +.proto-root .jc-sysev-runs b { font-weight: 700; color: var(--ink-2); } +.proto-root .jc-sysev-note { display: flex; align-items: flex-start; gap: 8px; font-size: 11.5px; line-height: 1.6; color: var(--ink-3); } +.proto-root .jc-sysev-note svg { flex: none; margin-top: 1px; color: #7f3bf5; } +/* 事件触发（k-event）= 琥珀色调，与周期触发（k-cycle 紫）区分 */ +.proto-root .jc-sysev.k-event { border-left-color: var(--warn); background: linear-gradient(180deg, #fffaf3, #fff); } +.proto-root .jc-sysev.k-event .jc-sysev-ico { background: linear-gradient(140deg, #ff8800, #de7802); box-shadow: 0 3px 8px -2px rgba(222, 120, 2, .45); } +.proto-root .jc-sysev.k-event .jc-sysev-cycle { color: var(--warn); background: var(--warn-soft); } +.proto-root .jc-sysev.k-event .jc-sysev-note svg { color: var(--warn); } + +/* ===== 纪要 / 日报：待建设占位 ===== */ +.proto-root .workspace.jc-coming-wrap { display: flex; align-items: center; justify-content: center; padding: 40px 24px; } +.proto-root .jc-coming { max-width: 460px; width: 100%; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 13px; padding: 36px 30px; background: #fff; border: 1px solid var(--cardline); border-radius: 20px; box-shadow: var(--card-shadow); } +.proto-root .jc-coming-ico { width: 64px; height: 64px; border-radius: 18px; display: grid; place-items: center; color: #fff; background: linear-gradient(140deg, var(--brand), #7f3bf5); box-shadow: 0 8px 20px -6px rgba(51, 112, 255, .5); } +.proto-root .jc-coming-tag { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 800; color: var(--brand-deep); background: var(--brand-wash); border-radius: 999px; padding: 4px 12px; } +.proto-root .jc-coming-tag i { width: 6px; height: 6px; border-radius: 999px; flex: none; background: var(--brand); animation: wfpulse 1.5s ease-in-out infinite; } +.proto-root .jc-coming h2 { margin: 0; font-size: 19px; font-weight: 800; color: var(--ink); } +.proto-root .jc-coming > p { margin: 0; font-size: 12.5px; line-height: 1.7; color: var(--ink-3); } +.proto-root .jc-coming-list { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; width: 100%; } +.proto-root .jc-coming-list li { display: flex; align-items: center; gap: 9px; font-size: 12px; font-weight: 600; color: var(--ink-2); text-align: left; background: var(--soft); border: 1px solid var(--line-soft); border-radius: 10px; padding: 9px 13px; } +.proto-root .jc-coming-list li svg { flex: none; color: var(--brand); } +.proto-root .jc-coming-foot { display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; font-size: 11px; color: var(--ink-4); } +.proto-root .card-btn svg { vertical-align: -2px; } + +/* ---- 底部动作条 ---- */ +.proto-root .jc-mod-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-top: 4px; } +.proto-root .jc-mod-donehint { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--ok); } + +/* ---- 左清单卡（消息/纪要/日报共用 jc-mcard） ---- */ +.proto-root .jc-mcard { display: flex; align-items: flex-start; gap: 10px; width: 100%; text-align: left; cursor: pointer; padding: 10px 11px; border: 1px solid var(--cardline); border-radius: 12px; background: #fff; box-shadow: var(--card-shadow); transition: border-color var(--t-fast), box-shadow var(--t-fast), background var(--t-fast); } +.proto-root .jc-mcard:hover:not(.selected) { border-color: var(--line); box-shadow: 0 3px 10px -3px rgba(31,35,41,.14); } +.proto-root .jc-mcard.selected { border-color: var(--brand-soft); background: var(--brand-wash); box-shadow: var(--shadow-1); } +.proto-root .jc-mcard.unread { position: relative; } +.proto-root .jc-mcard.unread::before { content: ""; position: absolute; left: -1px; top: 12px; bottom: 12px; width: 3px; border-radius: 3px; background: var(--danger-accent); } +.proto-root .jc-mcard-ico { flex: none; width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color: #fff; margin-top: 1px; box-shadow: 0 2px 6px -1px rgba(31,35,41,.28); } +.proto-root .jc-mcard-datebox { flex: none; width: 34px; height: 38px; border-radius: 9px; display: flex; flex-direction: column; align-items: center; justify-content: center; background: linear-gradient(160deg, var(--brand-wash), #fff); border: 1px solid var(--brand-soft); } +.proto-root .jc-mcard-datebox b { font-size: 15px; font-weight: 800; color: var(--brand-deep); font-family: var(--mono); line-height: 1; } +.proto-root .jc-mcard-datebox i { font-style: normal; font-size: 9px; color: var(--ink-4); margin-top: 1px; } +.proto-root .jc-mcard-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; } +.proto-root .jc-mcard-top { display: flex; align-items: center; gap: 6px; } +.proto-root .jc-mcard-top em { flex: 1; min-width: 0; font-style: normal; font-size: 10px; font-weight: 800; letter-spacing: .04em; color: var(--ink-4); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +.proto-root .jc-mcard-title { font-size: 12.5px; font-weight: 700; color: var(--ink); line-height: 1.4; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-mcard-title.jc-clamp2 { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } +/* 整句折行：标题是卡片的必要信息，不截断（长主题多占一行也认了） */ +.proto-root .jc-mcard-title.jc-wrap { white-space: normal; overflow-wrap: anywhere; } +.proto-root .jc-mcard-foot { display: flex; align-items: center; gap: 5px; font-size: 10.5px; color: var(--ink-4); } +.proto-root .jc-mcard-foot svg { color: var(--ink-4); } +.proto-root .jc-mcard-foot i { font-style: normal; margin-left: auto; font-family: var(--mono); white-space: nowrap; } + +/* ---- 纪要：出席人 / Tab / 议题 / 决议 / 行动项 / 逐字稿 ---- */ +.proto-root .jc-attendees { display: flex; align-items: center; gap: 12px; background: var(--soft); border: 1px solid var(--line-soft); border-radius: 12px; padding: 11px 15px; } +.proto-root .jc-attendees-txt { min-width: 0; line-height: 1.4; } +.proto-root .jc-attendees-txt strong { display: block; font-size: 12px; font-weight: 700; color: var(--ink); } +.proto-root .jc-attendees-txt span { display: block; font-size: 10.5px; color: var(--ink-4); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +.proto-root .jc-tabs2 { display: flex; gap: 4px; padding: 4px; background: var(--soft); border: 1px solid var(--line-soft); border-radius: 11px; } +.proto-root .jc-tabs2 button { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; border: 0; background: transparent; border-radius: 8px; padding: 8px 10px; font-size: 12.5px; font-weight: 700; color: var(--ink-3); cursor: pointer; transition: background var(--t-fast), color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-tabs2 button:hover:not(.active) { color: var(--ink-2); } +.proto-root .jc-tabs2 button.active { background: #fff; color: var(--brand-deep); box-shadow: 0 1px 3px rgba(31,35,41,.1); } +.proto-root .jc-tabs2 button i { font-style: normal; font-size: 10px; font-weight: 700; font-family: var(--mono); color: #fff; background: var(--brand); border-radius: 999px; padding: 0 6px; } +.proto-root .jc-tabs2 button:not(.active) i { background: var(--ink-4); } +.proto-root .jc-topics, .proto-root .jc-res-list, .proto-root .jc-acts { display: flex; flex-direction: column; gap: 10px; } +.proto-root .jc-topic { display: flex; align-items: flex-start; gap: 11px; border: 1px solid var(--line-soft); border-radius: 11px; background: var(--soft); padding: 11px 13px; transition: border-color var(--t-fast), background var(--t-fast); } +.proto-root .jc-topic:hover { border-color: var(--brand-soft); background: #fff; } +.proto-root .jc-topic-n { flex: none; width: 20px; height: 20px; border-radius: 7px; display: grid; place-items: center; font-family: var(--mono); font-size: 11px; font-weight: 800; color: #fff; background: linear-gradient(140deg, var(--brand), #7f3bf5); } +.proto-root .jc-topic-txt { min-width: 0; line-height: 1.45; } +.proto-root .jc-topic-txt strong { display: block; font-size: 12.5px; font-weight: 700; color: var(--ink); } +.proto-root .jc-topic-txt span { display: block; font-size: 11px; color: var(--ink-4); margin-top: 1px; } +.proto-root .jc-res { display: flex; align-items: center; gap: 11px; border: 1px solid var(--line-soft); border-radius: 11px; background: var(--soft); padding: 11px 13px; transition: border-color var(--t-fast), background var(--t-fast); } +.proto-root .jc-res:hover { border-color: var(--brand-soft); background: #fff; } +.proto-root .jc-res-n { flex: none; width: 20px; height: 20px; border-radius: 999px; display: grid; place-items: center; font-family: var(--mono); font-size: 11px; font-weight: 700; color: var(--brand-deep); background: var(--brand-wash); border: 1px solid var(--brand-soft); } +.proto-root .jc-res p { flex: 1; min-width: 0; margin: 0; font-size: 12.5px; line-height: 1.6; color: var(--ink-2); } +.proto-root .jc-res-open { flex: none; width: 24px; height: 24px; border-radius: 7px; border: 1px solid var(--line); background: #fff; color: var(--brand-deep); display: grid; place-items: center; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast); } +.proto-root .jc-res-open:hover { background: var(--brand-wash); border-color: var(--brand-soft); } +.proto-root .jc-act { display: flex; align-items: center; gap: 11px; border: 1px solid var(--line-soft); border-radius: 11px; background: var(--soft); padding: 10px 13px; } +.proto-root .jc-act-dot { flex: none; width: 9px; height: 9px; border-radius: 999px; } +.proto-root .jc-act-dot.d-ok { background: var(--ok-accent); } +.proto-root .jc-act-dot.d-doing { background: var(--brand); box-shadow: 0 0 0 3px var(--brand-wash); } +.proto-root .jc-act-dot.d-todo { background: #c4cad3; } +.proto-root .jc-act-what { flex: 1; min-width: 0; font-size: 12px; font-weight: 600; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +.proto-root .jc-act-who { flex: none; display: inline-flex; align-items: center; gap: 5px; font-size: 11px; color: var(--ink-3); } +.proto-root .jc-act-due { flex: none; font-size: 11px; } +.proto-root .jc-script { display: flex; flex-direction: column; gap: 15px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--soft); padding: 16px 17px; } +.proto-root .jc-scriptline { display: flex; gap: 10px; } +.proto-root .jc-script-body { flex: 1; min-width: 0; } +.proto-root .jc-script-head { display: flex; align-items: baseline; gap: 7px; margin-bottom: 4px; } +.proto-root .jc-script-head strong { font-size: 12px; font-weight: 700; color: var(--ink); } +.proto-root .jc-script-head em { font-style: normal; font-size: 9.5px; font-weight: 700; color: var(--brand-deep); background: var(--brand-wash); border-radius: 4px; padding: 0 5px; } +.proto-root .jc-script-head time { margin-left: auto; font-size: 10px; } +.proto-root .jc-script-bubble { font-size: 12.5px; line-height: 1.7; color: var(--ink-2); background: #fff; border: 1px solid var(--line-soft); border-radius: 3px 11px 11px 11px; padding: 9px 13px; } + +/* ---- 日报：亮点 / 总结 / 统计卡 / 时间轴 ---- */ +.proto-root .jc-highlight { display: flex; align-items: flex-start; gap: 9px; border-radius: 12px; padding: 12px 15px; font-size: 12.5px; font-weight: 600; line-height: 1.7; color: var(--brand-deep); background: linear-gradient(120deg, var(--brand-wash), #f3f0ff); border: 1px solid var(--brand-soft); } +.proto-root .jc-highlight svg { flex: none; margin-top: 2px; color: #7f3bf5; } +.proto-root .jc-summary { font-size: 12.5px; line-height: 1.9; color: var(--ink-2); background: var(--soft); border-radius: 3px 12px 12px 3px; border-left: 3px solid var(--brand-soft); padding: 12px 15px; } +.proto-root .jc-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(114px, 1fr)); gap: 11px; } +.proto-root .jc-stat { position: relative; display: flex; flex-direction: column; gap: 3px; border: 1px solid var(--line-soft); border-radius: 13px; background: var(--soft); padding: 13px 14px; overflow: hidden; } +.proto-root .jc-stat-ico { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; color: var(--brand-deep); background: var(--brand-wash); margin-bottom: 3px; } +.proto-root .jc-stat-v { font-size: 21px; font-weight: 800; color: var(--ink); font-family: var(--mono); line-height: 1; letter-spacing: -.02em; } +.proto-root .jc-stat-v em { font-style: normal; font-size: 10px; font-weight: 600; color: var(--ink-4); font-family: var(--sans); margin-left: 4px; letter-spacing: 0; } +.proto-root .jc-stat-k { font-size: 11px; color: var(--ink-3); } +.proto-root .jc-axis { display: flex; flex-direction: column; padding-left: 2px; } +.proto-root .jc-axis-row { position: relative; display: flex; align-items: baseline; gap: 11px; padding: 7px 0 7px 22px; } +.proto-root .jc-axis-row::before { content: ""; position: absolute; left: 5px; top: 0; bottom: 0; width: 2px; background: var(--line-soft); } +.proto-root .jc-axis-row:first-child::before { top: 11px; } +.proto-root .jc-axis-row:last-child::before { top: -2px; height: 13px; bottom: auto; } +.proto-root .jc-axis-node { position: absolute; left: 0; top: 8px; width: 12px; height: 12px; border-radius: 999px; background: #fff; border: 3px solid var(--nc, var(--brand)); z-index: 1; } +.proto-root .jc-axis-row time { flex: none; width: 42px; font-size: 11px; } +.proto-root .jc-axis-row p { flex: 1; min-width: 0; margin: 0; font-size: 12.5px; line-height: 1.55; color: var(--ink-2); } + +/* ---- 员工补充 ---- */ +.proto-root .jc-sup { display: block; box-sizing: border-box; width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; font: inherit; font-size: 12.5px; line-height: 1.7; color: var(--ink); background: #fff; resize: vertical; transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-sup:focus { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 3px rgba(51,112,255,.12); } +.proto-root .jc-sup:disabled { background: #f3f4f6; color: #5c626b; } + +/* ===== 左侧一体化导航轨（无顶栏）：品牌 → 四大模块 → 轨底动作 + 登录者身份 ===== */ +.proto-root .app-nav { padding: 14px 10px 12px; } +.proto-root .jc-rail-brand { text-align: center; font-size: 10px; font-weight: 800; letter-spacing: .14em; color: var(--ink-3); margin: -4px 0 6px; } +.proto-root .app-nav button { min-height: 58px; transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast); } +.proto-root .app-nav button:active { transform: scale(.97); } +/* 轨底：全局动作（重置/通知/设置）+ 身份，margin-top:auto 吸底 */ +.proto-root .jc-rail-foot { margin-top: auto; display: flex; flex-direction: column; align-items: center; gap: 8px; padding-top: 12px; border-top: 1px solid var(--line-soft); } +/* 覆盖 vendor 对 .app-nav button 的 min-height，避免轨底图标按钮被撑高 */ +.proto-root .jc-rail-foot .icon-button { width: 34px; height: 34px; min-height: 34px; } +.proto-root .jc-nav-user { display: flex; flex-direction: column; align-items: center; gap: 3px; padding-top: 4px; cursor: default; } +.proto-root .jc-nav-ava { width: 32px; height: 32px; border-radius: 999px; display: grid; place-items: center; flex: 0 0 auto; line-height: 1; color: #fff; font-size: 13px; font-weight: 800; background: linear-gradient(140deg, #2bc7d4, #0e9fd8); box-shadow: 0 2px 6px rgba(14, 159, 216, .35); } +.proto-root .jc-nav-name { font-size: 10px; font-weight: 600; color: var(--ink-3); } + +/* 工作清单头：渐变图标点缀 + 两级筛选 */ +.proto-root .jc-wl-head { display: flex; align-items: center; justify-content: flex-start; gap: 10px; } +.proto-root .jc-wl-head > div { flex: 1; min-width: 0; text-align: left; } +.proto-root .jc-wl-collapse { flex: none; margin-left: 4px; } +/* 收起后悬浮边缘拉手（绝对定位，不占列，视图区卡片可贴到最左/最右） */ +/* 展开手柄与「收起」按钮同一高度：贴面板顶部表头行（非竖直居中），高度对齐 icon-button(36px) */ +.proto-root .jc-edge { position: absolute; top: 22px; z-index: 6; width: 16px; height: 36px; display: grid; place-items: center; border: 1px solid var(--line); background: #fff; color: var(--ink-4); cursor: pointer; box-shadow: 0 2px 8px -2px rgba(31,35,41,.2); transition: background var(--t-fast), color var(--t-fast); } +.proto-root .jc-edge:hover { background: var(--brand-wash); color: var(--brand-deep); border-color: var(--brand-soft); } +.proto-root .jc-edge-l { left: 0; border-left: 0; border-radius: 0 9px 9px 0; } +.proto-root .jc-edge-r { right: 0; border-right: 0; border-radius: 9px 0 0 9px; } +.proto-root .jc-edge-r svg { transform: scaleX(-1); } +.proto-root .jc-wl-ico { flex: none; width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color: #fff; background: linear-gradient(140deg, var(--brand), #7f3bf5); box-shadow: 0 3px 8px rgba(51, 112, 255, .28); } +.proto-root .jc-flt-wrap { display: flex; flex-direction: column; gap: 6px; padding: 2px 12px 12px; border-bottom: 1px solid var(--line-soft); background: #fbfdff; } +.proto-root .jc-flt { display: flex; gap: 6px; } +.proto-root .jc-flt button { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-width: 0; border: 1px solid var(--line-soft); background: #fff; border-radius: 8px; padding: 4px 4px; font-size: 11.5px; color: var(--ink-3); cursor: pointer; transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast); } +.proto-root .jc-flt button:hover:not(.active) { background: var(--soft); } +.proto-root .jc-flt button strong { font-family: var(--mono); font-size: 10px; font-weight: 700; color: var(--ink-4); background: var(--soft); border-radius: 999px; padding: 0 6px; } +.proto-root .jc-flt button.active { color: var(--brand-deep); border-color: var(--brand-soft); background: var(--brand-wash); font-weight: 700; } +.proto-root .jc-flt button.active strong { background: #fff; color: var(--brand-deep); } +/* 清单内检索框 */ +.proto-root .jc-search { display: flex; align-items: center; gap: 7px; background: #fff; border: 1px solid var(--line); border-radius: 9px; padding: 5px 9px; transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-search:focus-within { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(51,112,255,.12); } +.proto-root .jc-search svg { flex: none; color: var(--ink-4); } +.proto-root .jc-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 12px; color: var(--ink); } +.proto-root .jc-search input::placeholder { color: var(--ink-4); } +.proto-root .jc-search-x { flex: none; width: 16px; height: 16px; border: 0; border-radius: 999px; background: var(--soft); color: var(--ink-3); font-size: 13px; line-height: 1; cursor: pointer; display: grid; place-items: center; } +.proto-root .jc-search-x:hover { background: var(--line-soft); color: var(--ink); } +.proto-root .jc-list-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 34px 12px; color: var(--ink-4); font-size: 12px; } + +/* 状态胶囊三态：进行(蓝·脉冲) / 等待(橙·脉冲) / 完成(绿) */ +.proto-root .jc-tc-state { flex: none; display: inline-flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 700; border-radius: 999px; padding: 1px 8px; border: 1px solid; } +.proto-root .jc-tc-state i { width: 5px; height: 5px; border-radius: 999px; flex: 0 0 auto; } +.proto-root .jc-tc-state.st-active { color: var(--brand-deep); background: var(--brand-wash); border-color: var(--brand-soft); } +.proto-root .jc-tc-state.st-active i { background: var(--brand); animation: wfpulse 1.8s ease-in-out infinite; } +.proto-root .jc-tc-state.st-waiting { color: var(--warn); background: var(--warn-soft); border-color: #fbd9a5; } +.proto-root .jc-tc-state.st-waiting i { background: var(--warn-accent); animation: wfpulse 1.5s ease-in-out infinite; } +/* 对话区交互状态角标：工作中(蓝) / 待处理(红) / 等待中(橙) */ +.proto-root .jc-tc-state.i-working { color: var(--brand-deep); background: var(--brand-wash); border-color: var(--brand-soft); } +.proto-root .jc-tc-state.i-working i { background: var(--brand); animation: wfpulse 1.6s ease-in-out infinite; } +.proto-root .jc-tc-state.i-todo { color: var(--danger); background: var(--danger-soft); border-color: #f6c6c3; } +.proto-root .jc-tc-state.i-todo i { background: var(--danger-accent); animation: wfpulse 1.35s ease-in-out infinite; } +.proto-root .jc-tc-state.i-waiting { color: var(--warn); background: var(--warn-soft); border-color: #fbd9a5; } +.proto-root .jc-tc-state.i-waiting i { background: var(--warn-accent); animation: wfpulse 1.8s ease-in-out infinite; } +.proto-root .jc-tc-state.st-done { color: var(--ok); background: var(--ok-soft); border-color: #bfedb4; } +.proto-root .jc-tc-state.st-done i { background: var(--ok-accent); } +.proto-root .jc-tc-state.st-warn { color: var(--warn); background: var(--warn-soft); border-color: #fbd9a5; } +.proto-root .jc-tc-state.st-warn i { background: var(--warn-accent); animation: wfpulse 1.8s ease-in-out infinite; } +/* 当前流程 · 节点行（进行中显示当前进度所在流程与节点；已完成显示成交摘要） */ +.proto-root .jc-tc-node { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 11px; color: var(--ink-3); background: var(--soft); border: 1px solid var(--line-soft); border-radius: 8px; padding: 4px 9px; } +.proto-root .jc-tc-node-dot { flex: none; width: 6px; height: 6px; border-radius: 999px; background: var(--st-auto); } +.proto-root .jc-tc-node-dot.n-auto { background: var(--st-auto); } +.proto-root .jc-tc-node-dot.n-execute { background: var(--st-execute); } +.proto-root .jc-tc-node-dot.n-decision { background: var(--st-decision); } +.proto-root .jc-tc-node-dot.n-collaborate { background: var(--st-collab); } +.proto-root .jc-tc-node-dot.n-wait { background: var(--st-wait); } +.proto-root .jc-tc-node-flow { flex: none; font-weight: 700; color: var(--ink-2); } +.proto-root .jc-tc-node-sep { flex: none; color: var(--ink-4); } +.proto-root .jc-tc-node-name { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +.proto-root .jc-tc-node.done { color: var(--ok); background: var(--ok-soft); border-color: #bfedb4; } +.proto-root .jc-tc-node.done svg { flex: none; color: var(--ok); } +.proto-root .jc-tc-node-txt { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; } +.proto-root .jc-tc-meta { display: flex; align-items: center; gap: 8px; min-width: 0; } +.proto-root .jc-tc-src { flex: 1; min-width: 0; font-size: 10.5px; color: var(--ink-4); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +.proto-root .jc-tc-nm { flex: none; display: inline-flex; align-items: center; gap: 3px; font-size: 10.5px; font-weight: 700; color: var(--ink-3); font-family: var(--mono); } +.proto-root .jc-tc-nm svg { color: var(--ok); } +.proto-root .jc-tc-bar { display: block; height: 3px; border-radius: 999px; background: #eceff3; overflow: hidden; } +.proto-root .jc-tc-bar > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--task-color, var(--brand)), color-mix(in srgb, var(--task-color, var(--brand)) 62%, #7f3bf5)); transition: width var(--t-med); } +/* 底部：统计 + 负责人迷你头像 */ + +/* 阶段类型配色（中间里程碑 / 进度 / 会话阶段标签共用） */ +.proto-root .t-auto { --accent: var(--st-auto); --accent-soft: var(--st-auto-soft); } +.proto-root .t-execute { --accent: var(--st-execute); --accent-soft: var(--st-execute-soft); } +.proto-root .t-decision { --accent: var(--st-decision); --accent-soft: var(--st-decision-soft); } +.proto-root .t-collaborate { --accent: var(--st-collab); --accent-soft: var(--st-collab-soft); } +.proto-root .t-wait { --accent: var(--st-wait); --accent-soft: var(--st-wait-soft); } + +/* 任务列表收起态：窄栏（展开按钮 + 任务色点） */ + +/* ===== 中间部分：外层无卡，画布上只有两张卡 —— 驾驶舱 + 工作视图 ===== */ +/* 视图区（透明容器）：自绘 thumb 经 ScrollArea inset 负值悬进列间 gutter， + 卡片两侧衬对称、「视图卡→对话区」间距与「清单→视图卡」相等 */ +.proto-root .wf-scroll { display: flex; flex-direction: column; gap: 12px; padding: 0 2px 8px; min-height: 0; background: transparent; } +/* 短视口下不许压缩内容：整栏滚动而不是把驾驶舱挤扁 */ +.proto-root .wf-scroll > * { flex: 0 0 auto; } + +/* ===== 驾驶舱（固定结构，自上而下主次分明）： + 头区[业务域+状态 | 负责人] → 主题 → 元信息 → 目标条 → 进度区[大数字 | 当前节点 | 分段条] ===== */ +.proto-root .wf-cockpit { position: relative; overflow: hidden; background: #fff; border: 1px solid var(--line-soft); border-radius: 16px; padding: 18px 22px 16px; box-shadow: var(--shadow-2); } +.proto-root .wf-cockpit::after { content: ""; position: absolute; right: -50px; top: -70px; width: 220px; height: 220px; border-radius: 999px; background: radial-gradient(circle, rgba(51, 112, 255, .09), transparent 70%); pointer-events: none; } +.proto-root .wf-cockpit > * { position: relative; z-index: 1; } +/* 头区：左 = 业务域 + 运行状态；右 = 负责人 */ +.proto-root .jc-cp-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; } +.proto-root .jc-cp-chips { display: flex; align-items: center; gap: 8px; min-width: 0; } +.proto-root .jc-cp-tag { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 700; color: var(--brand-deep); background: var(--brand-wash); border: 1px solid var(--brand-soft); border-radius: 999px; padding: 3px 11px; } +.proto-root .jc-cp-tag svg { color: var(--brand); } +.proto-root .jc-cp-state { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700; color: var(--ok); background: var(--ok-soft); border-radius: 999px; padding: 3px 11px; } +.proto-root .jc-cp-state::before { content: ""; width: 7px; height: 7px; border-radius: 999px; background: var(--ok-accent); animation: wfpulse 1.6s ease-in-out infinite; } +.proto-root .jc-cp-state.done { color: var(--brand-deep); background: var(--brand-wash); } +.proto-root .jc-cp-state.done::before { background: var(--brand); animation: none; } +.proto-root .jc-cp-owner { display: flex; align-items: center; gap: 8px; padding: 4px 13px 4px 5px; background: var(--soft); border: 1px solid var(--line-soft); border-radius: 999px; } +.proto-root .jc-cp-avatar { width: 26px; height: 26px; border-radius: 999px; display: grid; place-items: center; background: linear-gradient(140deg, #2bc7d4, #0e9fd8); color: #fff; font-size: 12px; font-weight: 800; } +.proto-root .jc-cp-owner-txt { line-height: 1.15; } +.proto-root .jc-cp-owner-txt strong { display: block; font-size: 12px; font-weight: 700; color: var(--ink); } +.proto-root .jc-cp-owner-txt span { display: block; font-size: 10px; color: var(--ink-4); } +/* 主题（视觉最重）+ 元信息（最轻） */ +.proto-root .jc-cp-title { margin: 12px 0 0; font-size: 22px; font-weight: 800; color: var(--ink); letter-spacing: -.01em; line-height: 1.25; } +.proto-root .jc-cp-meta { margin: 7px 0 0; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 11.5px; color: var(--ink-4); } +.proto-root .jc-cp-meta span { display: inline-flex; align-items: center; gap: 4px; } +/* 目标条：品牌洗底横幅，一句话讲清任务要达成什么 */ +.proto-root .jc-cp-goal { margin-top: 12px; display: flex; align-items: flex-start; gap: 10px; background: linear-gradient(135deg, var(--brand-wash), #fff 72%); border: 1px solid var(--brand-soft); border-radius: 10px; padding: 10px 13px; } +.proto-root .jc-cp-goal-k { flex: none; display: inline-flex; align-items: center; gap: 4px; margin-top: 1px; font-size: 11px; font-weight: 800; color: var(--brand); } +.proto-root .jc-cp-goal p { margin: 0; font-size: 12.5px; color: var(--ink-2); line-height: 1.62; } +/* 进度区：大数字（左）· 当前节点（右）· 分段类型进度条（下） */ +.proto-root .jc-cp-progress { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 14px; padding-top: 13px; border-top: 1px dashed var(--line-soft); } +.proto-root .jc-cp-num { flex: none; display: flex; align-items: baseline; gap: 2px; font-family: var(--mono); } +.proto-root .jc-cp-num b { font-size: 25px; font-weight: 800; color: var(--brand); line-height: 1; } +.proto-root .jc-cp-num i { font-style: normal; font-size: 13px; font-weight: 700; color: var(--ink-4); } +.proto-root .jc-cp-num em { font-style: normal; margin-left: 8px; font-size: 11px; font-weight: 700; color: var(--ink-3); background: var(--soft); border: 1px solid var(--line-soft); border-radius: 999px; padding: 2px 8px; } +.proto-root .jc-cp-cur { display: flex; align-items: center; gap: 7px; min-width: 0; } +.proto-root .jc-cp-cur-k { flex: none; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; color: var(--ink-4); } +.proto-root .jc-cp-cur .stage-num { background: var(--brand); } +.proto-root .jc-cp-cur strong { font-size: 12.5px; font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +/* 任务的输入（暂未挂载——待「工作视图」卡收编） · 文件类：可点开的文件卡 */ +.proto-root .jc-input-files { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px; margin-top: 12px; } +.proto-root .jc-file-card { display: flex; align-items: center; gap: 10px; padding: 9px 11px; border: 1px solid var(--line-soft); border-radius: 11px; background: #fff; font: inherit; text-align: left; cursor: pointer; transition: transform var(--t-fast), box-shadow var(--t-fast), border-color var(--t-fast); } +.proto-root .jc-file-card:hover { border-color: var(--brand-soft); box-shadow: 0 8px 20px rgba(51, 112, 255, .13); transform: translateY(-1px); } +.proto-root .jc-file-card .wf-dlv-ico { width: 34px; height: 34px; border-radius: 9px; } +.proto-root .jc-file-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; } +.proto-root .jc-file-txt strong { font-size: 12.5px; font-weight: 700; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +.proto-root .jc-file-txt span { font-size: 11px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +.proto-root .jc-file-open { flex: none; color: #c3c8cf; display: grid; place-items: center; transition: color var(--t-fast), transform var(--t-fast); } +.proto-root .jc-file-card:hover .jc-file-open { color: var(--brand); transform: translateX(2px); } +/* 任务的输入 · 信息类：KV 事实贴片 */ +.proto-root .jc-input-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 8px; margin-top: 8px; } +.proto-root .jc-fact { display: flex; flex-direction: column; gap: 3px; padding: 8px 11px; border: 1px solid var(--line-soft); border-radius: 10px; background: var(--soft); min-width: 0; } +.proto-root .jc-fact-k { display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 700; letter-spacing: .04em; color: var(--ink-4); } +.proto-root .jc-fact-k svg { color: var(--brand); } +.proto-root .jc-fact-v { font-size: 12px; font-weight: 600; color: var(--ink); line-height: 1.4; } +.proto-root .jc-fact-v.pending { color: var(--ink-4); font-weight: 500; font-style: italic; border-bottom: 1px dashed #c9ced6; align-self: flex-start; } +.proto-root .wf-bar { display: flex; gap: 4px; margin-top: 11px; } +.proto-root .wf-seg { flex: 1; height: 7px; border-radius: 999px; background: #eceff3; transition: background var(--t-med); } +.proto-root .wf-seg.done { background: var(--accent, var(--brand)); } +.proto-root .wf-seg.active { background: var(--accent, var(--brand)); animation: wfpulse 1.5s ease-in-out infinite; } +/* ===== 工作视图卡：双状态（任务里程碑 / 操作日志），分段控件切换 ===== */ +.proto-root .jc-wv-tabs { display: flex; gap: 4px; width: max-content; padding: 3px; margin: 0 0 14px; background: var(--soft); border: 1px solid var(--line-soft); border-radius: 10px; } +.proto-root .jc-wv-tab { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border: 0; border-radius: 8px; background: transparent; color: var(--ink-3); font-size: 12.5px; font-weight: 700; cursor: pointer; transition: background var(--t-fast), color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-wv-tab svg { color: currentColor; } +.proto-root .jc-wv-tab em { font-style: normal; font-size: 10.5px; font-weight: 700; font-family: var(--mono); color: var(--ink-4); background: #fff; border: 1px solid var(--line-soft); border-radius: 999px; padding: 1px 7px; } +.proto-root .jc-wv-tab:hover:not(.active) { color: var(--ink); } +.proto-root .jc-wv-tab.active { background: #fff; color: var(--brand-deep); box-shadow: var(--shadow-1); } +.proto-root .jc-wv-tab.active em { color: var(--brand-deep); background: var(--brand-wash); border-color: var(--brand-soft); } +.proto-root .wf-sec-head { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 800; letter-spacing: 0; color: var(--ink); text-transform: none; margin: 0 0 12px; } +.proto-root .wf-sec-head svg { color: var(--brand); } +.proto-root .wf-card { background: #fff; border: 1px solid var(--line-soft); border-radius: 14px; padding: 16px 18px; box-shadow: var(--shadow-1); } + +/* ===== 任务里程碑：左 1/4 阶段导航 + 右 3/4 HTML+SVG 汇报页 ===== */ +.proto-root .jc-mst-layout { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 12px; align-items: start; } +/* 左：里程碑步进器 —— 状态点 + 名称 + 状态副行，进度连线随达成染色 */ +.proto-root .jc-mst-rail { display: flex; flex-direction: column; gap: 3px; } +.proto-root .jc-mst-item { position: relative; display: flex; align-items: flex-start; gap: 9px; width: 100%; padding: 8px 8px; border: 1px solid transparent; background: transparent; border-radius: 11px; cursor: pointer; text-align: left; transition: background var(--t-fast), border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-mst-item::before { content: ""; position: absolute; left: 20px; top: 37px; bottom: -7px; width: 2px; border-radius: 2px; background: var(--line-soft); } +.proto-root .jc-mst-item:last-child::before { display: none; } +.proto-root .jc-mst-item.st-done::before { background: #bfedb4; } +.proto-root .jc-mst-item:hover:not(.sel) { background: var(--soft); } +.proto-root .jc-mst-item.sel { background: var(--brand-wash); border-color: var(--brand-soft); box-shadow: var(--shadow-1); } +/* 状态点：达成=绿勾软底 / 激活=品牌脉冲环（轨迹语义：未来里程碑不呈现） */ +.proto-root .jc-mst-dot { position: relative; z-index: 1; flex: none; width: 25px; height: 25px; border-radius: 999px; display: grid; place-items: center; font-size: 10.5px; font-weight: 800; font-family: var(--mono); } +.proto-root .jc-mst-item.st-done .jc-mst-dot { background: linear-gradient(180deg, #fff, var(--ok-soft)); border: 1px solid #bfedb4; color: var(--ok-accent); } +.proto-root .jc-mst-item.st-active .jc-mst-dot { background: #fff; border: 2px solid var(--brand); box-shadow: 0 0 0 4px rgba(51, 112, 255, .13); } +.proto-root .jc-mst-item.st-active .jc-mst-dot i { width: 9px; height: 9px; border-radius: 999px; background: var(--brand); animation: wfpulse 1.5s ease-in-out infinite; } +/* 名称 + 状态副行 */ +.proto-root .jc-mst-itxt { flex: 1; min-width: 0; line-height: 1.3; padding-top: 1px; } +.proto-root .jc-mst-itxt strong { display: block; font-size: 12px; font-weight: 700; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-mst-itxt > span { display: block; margin-top: 1px; font-size: 10px; color: var(--ink-4); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-mst-itxt > span.t-time { font-family: var(--mono); letter-spacing: -.02em; } +.proto-root .jc-mst-item.st-active .jc-mst-itxt strong { color: var(--brand-deep); } +.proto-root .jc-mst-item.st-active .jc-mst-itxt > span { color: var(--brand); font-weight: 700; } +.proto-root .jc-mst-item.sel .jc-mst-itxt strong { color: var(--brand-deep); } +/* 右：员工与 AI 共创的汇报页（飞书文档级：白纸、报告头、署名、入场动效） */ +.proto-root .jc-mst-page { min-width: 0; background: #fff; border: 1px solid var(--line-soft); border-radius: 14px; box-shadow: var(--shadow-1); overflow: hidden; } +.proto-root .jc-mst-doc { padding: 16px 20px 12px; animation: rise var(--t-med) both; } +/* 报告头（窄宽时状态章自动换行，标题保持可读宽度） */ +.proto-root .jc-mst-dochead { display: flex; align-items: flex-start; flex-wrap: wrap; gap: 10px 12px; } +.proto-root .jc-mst-docico { flex: none; width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; color: #fff; background: var(--ai-grad); box-shadow: var(--shadow-brand); } +.proto-root .jc-mst-doctit { flex: 1 1 200px; min-width: 0; } +.proto-root .jc-mst-doctit em { display: block; font-style: normal; font-size: 10px; font-weight: 800; letter-spacing: .1em; color: var(--ink-4); font-family: var(--mono); } +.proto-root .jc-mst-doctit h3 { margin: 2px 0 0; font-size: 17px; font-weight: 800; color: var(--ink); letter-spacing: -.01em; } +.proto-root .jc-mst-doctit p { margin: 3px 0 0; font-size: 11.5px; color: var(--ink-3); line-height: 1.55; } +.proto-root .jc-mst-docstate { flex: none; margin-top: 2px; margin-left: auto; } +.proto-root .jc-mst-docstate .st-ok { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; color: var(--ok); background: var(--ok-soft); border: 1px solid #bfedb4; border-radius: 999px; padding: 3px 10px; font-family: var(--mono); } +.proto-root .jc-mst-docstate .st-live { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 700; color: var(--brand-deep); background: var(--brand-wash); border: 1px solid var(--brand-soft); border-radius: 999px; padding: 3px 10px; } +.proto-root .jc-mst-docstate .st-live i { width: 7px; height: 7px; border-radius: 999px; background: var(--brand); animation: wfpulse 1.5s ease-in-out infinite; } +/* 共创署名条：AI × 员工 头像叠放 + 说明 + 激活页的当前节点 */ +.proto-root .jc-mst-coauth { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; margin-top: 11px; padding: 7px 11px; background: var(--soft); border: 1px solid var(--line-soft); border-radius: 9px; font-size: 11.5px; color: var(--ink-3); } +.proto-root .jc-mst-ava { width: 20px; height: 20px; border-radius: 999px; display: grid; place-items: center; color: #fff; font-size: 10px; font-weight: 800; border: 2px solid #fff; box-shadow: 0 1px 3px rgba(31, 35, 41, .18); } +.proto-root .jc-mst-ava.ai { background: var(--ai-grad); } +.proto-root .jc-mst-ava.hu { background: linear-gradient(140deg, #2bc7d4, #0e9fd8); margin-left: -10px; } +.proto-root .jc-mst-coauth-txt { font-weight: 600; } +.proto-root .jc-mst-curnode { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; font-size: 11px; font-weight: 700; color: var(--brand-deep); } +.proto-root .jc-mst-curnode i { width: 6px; height: 6px; border-radius: 999px; background: var(--brand); animation: wfpulse 1.5s ease-in-out infinite; } +/* 正文与页脚 */ +.proto-root .jc-mst-body { margin-top: 4px; } +.proto-root .jc-mst-docfoot { display: flex; align-items: center; gap: 5px; margin-top: 14px; padding-top: 10px; border-top: 1px dashed var(--line-soft); font-size: 10.5px; color: var(--ink-4); } +.proto-root .jc-mst-docfoot svg { color: var(--brand); } +/* 解析中占位：判定节点（自动）执行期间的动画页——图标呼吸 + 旋转光环 + 骨架闪光 */ +.proto-root .jc-mst-pending { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 44px 20px 48px; text-align: center; animation: rise var(--t-med) both; } +.proto-root .jc-mst-pending-ico { position: relative; width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; color: #fff; background: var(--ai-grad); animation: aiBreath 2.2s ease-in-out infinite; } +.proto-root .jc-mst-pending-ico::after { content: ""; position: absolute; inset: -6px; border-radius: 20px; padding: 2px; background: conic-gradient(from 0deg, transparent 15%, var(--brand), transparent 65%); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; animation: jcSpin 1.6s linear infinite; } +.proto-root .jc-mst-pending strong { margin-top: 8px; font-size: 13.5px; color: var(--ink-2); } +.proto-root .jc-mst-pending > span { font-size: 11.5px; color: var(--ink-4); } +.proto-root .jc-mst-skel { width: min(430px, 92%); display: flex; flex-direction: column; gap: 9px; margin-top: 14px; } +.proto-root .jc-mst-skel i { height: 12px; border-radius: 6px; background: linear-gradient(90deg, #eef0f4 25%, #e0e5ec 40%, #eef0f4 60%); background-size: 300% 100%; animation: jcShimmer 1.3s ease-in-out infinite; } +.proto-root .jc-mst-skel i:nth-child(1) { width: 62%; align-self: flex-start; } +.proto-root .jc-mst-skel i:nth-child(2) { width: 100%; } +.proto-root .jc-mst-skel i:nth-child(3) { width: 88%; } +.proto-root .jc-mst-skel i:nth-child(4) { width: 45%; } +@keyframes jcShimmer { 0% { background-position: 120% 0; } 100% { background-position: -80% 0; } } +/* 内容块通用 */ +.proto-root .jc-mst-b { margin-top: 12px; } +.proto-root .jc-mst-bt { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 800; color: var(--ink-2); margin: 0 0 8px; } +.proto-root .jc-mst-bt::before { content: ""; width: 3px; height: 12px; border-radius: 2px; background: var(--brand); } +/* callout 横幅 */ +.proto-root .jc-mst-callout { margin-top: 12px; font-size: 12px; line-height: 1.65; border-radius: 10px; padding: 9px 12px; border: 1px solid; } +.proto-root .jc-mst-callout:first-child { margin-top: 0; } +.proto-root .jc-mst-callout.tone-ok { color: var(--ok); background: var(--ok-soft); border-color: #bfedb4; } +.proto-root .jc-mst-callout.tone-warn { color: var(--warn); background: var(--warn-soft); border-color: #fbd9a5; } +.proto-root .jc-mst-callout.tone-brand { color: var(--brand-deep); background: var(--brand-wash); border-color: var(--brand-soft); } +/* 勾选徽章组 */ +.proto-root .jc-mst-badges { display: flex; flex-wrap: wrap; gap: 8px; } +.proto-root .jc-mst-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: var(--ink-3); background: #fff; border: 1px solid var(--line-soft); border-radius: 999px; padding: 5px 12px; } +.proto-root .jc-mst-badge.on { color: var(--ok); border-color: #bfedb4; background: linear-gradient(180deg, #fff, var(--ok-soft)); } +/* 数据表：白卡内嵌 HTML 表格，行 hover 高亮；editable 时可增删改（取消/保存确认） */ +.proto-root .jc-mst-tbar { display: flex; align-items: center; gap: 8px; } +.proto-root .jc-mst-tbar > span:first-child { flex: 1; min-width: 0; } +.proto-root .jc-edited { font-style: normal; font-size: 10px; font-weight: 700; color: var(--warn); background: var(--warn-soft); border: 1px solid #fbd9a5; border-radius: 999px; padding: 1px 8px; } +.proto-root .jc-live-sync { font-style: normal; margin-left: 8px; font-size: 10px; font-weight: 700; color: var(--brand-deep); background: var(--brand-wash); border: 1px solid var(--brand-soft); border-radius: 999px; padding: 1px 8px; animation: wfpulse 1.6s ease-in-out infinite; } +.proto-root .jc-tbar-actions { display: inline-flex; gap: 6px; } +.proto-root .jc-tbtn { display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 11px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink-2); font-size: 11px; font-weight: 600; cursor: pointer; transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast); } +.proto-root .jc-tbtn:hover { border-color: var(--brand-soft); color: var(--brand-deep); background: var(--brand-wash); } +.proto-root .jc-tbtn.primary { background: var(--brand); border-color: var(--brand); color: #fff; } +.proto-root .jc-tbtn.primary:hover { background: var(--brand-deep); border-color: var(--brand-deep); } +.proto-root .jc-mst-tablewrap { background: #fff; border: 1px solid var(--line-soft); border-radius: 10px; overflow: auto; } +.proto-root .jc-mst-tablewrap.editing { border-color: var(--brand-soft); box-shadow: 0 0 0 2px rgba(51, 112, 255, .08); } +.proto-root .jc-cell-input { width: 100%; min-width: 64px; box-sizing: border-box; border: 1px solid var(--line-soft); border-radius: 6px; padding: 4px 7px; font: inherit; font-size: 11.5px; color: var(--ink); background: #fff; transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-cell-input:focus { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 2px rgba(51, 112, 255, .12); } +.proto-root .jc-mst-table td:first-child .jc-cell-input { font-family: var(--mono); font-size: 11px; } +.proto-root .jc-th-op { width: 34px; } +.proto-root .jc-td-op { text-align: center; } +.proto-root .jc-row-del { display: inline-grid; place-items: center; width: 24px; height: 24px; border: 0; border-radius: 7px; background: transparent; color: var(--ink-4); cursor: pointer; transition: background var(--t-fast), color var(--t-fast); } +.proto-root .jc-row-del:hover { background: var(--danger-soft); color: var(--danger-accent); } +.proto-root .jc-row-add { display: flex; align-items: center; justify-content: center; gap: 5px; width: 100%; padding: 7px; border: 0; border-top: 1px dashed var(--line-soft); background: transparent; color: var(--brand-deep); font-size: 11.5px; font-weight: 600; cursor: pointer; transition: background var(--t-fast); } +.proto-root .jc-row-add:hover { background: var(--brand-wash); } +.proto-root .jc-mst-table { width: 100%; border-collapse: collapse; font-size: 12px; } +.proto-root .jc-mst-table th { text-align: left; font-size: 10.5px; font-weight: 800; letter-spacing: .03em; color: var(--ink-4); background: var(--soft); padding: 7px 11px; border-bottom: 1px solid var(--line-soft); white-space: nowrap; } +.proto-root .jc-mst-table td { padding: 7px 11px; color: var(--ink-2); border-bottom: 1px solid #f1f3f6; white-space: nowrap; } +.proto-root .jc-mst-table td:first-child { font-weight: 700; color: var(--ink); font-family: var(--mono); font-size: 11.5px; } +.proto-root .jc-mst-table tbody tr:last-child td { border-bottom: 0; } +.proto-root .jc-mst-table tbody tr { transition: background var(--t-fast); } +.proto-root .jc-mst-table tbody tr:hover { background: var(--brand-wash); } +/* 横条图（含红线阈值标记） */ +.proto-root .jc-mst-bars { display: flex; flex-direction: column; gap: 7px; background: #fff; border: 1px solid var(--line-soft); border-radius: 10px; padding: 11px 13px; } +.proto-root .jc-mst-barrow { display: flex; align-items: center; gap: 10px; } +.proto-root .jc-mst-barlabel { flex: none; width: 84px; font-size: 11px; font-weight: 600; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--mono); } +.proto-root .jc-mst-track { position: relative; flex: 1; height: 10px; border-radius: 999px; background: #eceff3; overflow: visible; } +.proto-root .jc-mst-track i { position: absolute; inset: 0 auto 0 0; border-radius: 999px; transition: width var(--t-med); } +.proto-root .jc-mst-track i.tone-brand { background: linear-gradient(90deg, #6d97ff, var(--brand)); } +.proto-root .jc-mst-track i.tone-ok { background: linear-gradient(90deg, #7edb6f, var(--ok-accent)); } +.proto-root .jc-mst-track i.tone-warn { background: linear-gradient(90deg, #ffb54d, var(--warn-accent)); } +.proto-root .jc-mst-track i.tone-danger { background: linear-gradient(90deg, #ff8a86, var(--danger-accent)); } +.proto-root .jc-mst-track i.tone-muted { background: #c6cbd3; } +.proto-root .jc-mst-redline { position: absolute; top: -3px; bottom: -3px; width: 0; border-left: 2px dashed var(--danger-accent); opacity: .75; } +.proto-root .jc-mst-barval { flex: none; min-width: 72px; text-align: right; font-size: 10.5px; font-weight: 700; color: var(--ink-3); font-family: var(--mono); } +/* 邮件/企微消息卡：任务触发源（收件）与对外发出（发件），附件芯片可点开 */ +.proto-root .jc-mail { margin-top: 12px; background: #fff; border: 1px solid var(--line-soft); border-radius: 11px; overflow: hidden; } +.proto-root .jc-mail:first-child { margin-top: 0; } +.proto-root .jc-mail-head { display: flex; align-items: flex-start; gap: 10px; padding: 10px 13px 8px; } +.proto-root .jc-mail-ico { flex: none; width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color: #fff; } +.proto-root .jc-mail.dir-in .jc-mail-ico { background: linear-gradient(140deg, #5b8cff, var(--brand)); } +.proto-root .jc-mail.dir-out .jc-mail-ico { background: linear-gradient(140deg, #52ce43, #2ba01c); } +.proto-root .jc-mail-sub { flex: 1; min-width: 0; line-height: 1.3; } +.proto-root .jc-mail-sub em { display: block; font-style: normal; font-size: 10px; font-weight: 800; letter-spacing: .05em; color: var(--ink-4); } +.proto-root .jc-mail.dir-in .jc-mail-sub em { color: var(--brand); } +.proto-root .jc-mail.dir-out .jc-mail-sub em { color: var(--ok); } +.proto-root .jc-mail-sub strong { display: block; margin-top: 1px; font-size: 12.5px; font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-mail-time { flex: none; font-size: 10.5px; color: var(--ink-4); font-family: var(--mono); margin-top: 2px; } +.proto-root .jc-mail-meta { display: flex; flex-wrap: wrap; gap: 3px 16px; padding: 0 13px 8px; font-size: 11px; color: var(--ink-2); } +.proto-root .jc-mail-meta span { display: inline-flex; align-items: center; gap: 5px; min-width: 0; } +.proto-root .jc-mail-meta i { font-style: normal; font-size: 10px; font-weight: 700; color: var(--ink-4); } +.proto-root .jc-mail-meta a { color: var(--brand); font-family: var(--mono); font-size: 10.5px; } +.proto-root .jc-mail-body { margin: 0 13px 10px; padding: 9px 11px; background: var(--soft); border-left: 3px solid var(--line); border-radius: 0 8px 8px 0; font-size: 12px; color: var(--ink-2); line-height: 1.7; } +.proto-root .jc-mail-atts { display: flex; flex-wrap: wrap; gap: 7px; padding: 0 13px 11px; } +.proto-root .jc-mail-att { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border: 1px solid var(--brand-soft); border-radius: 999px; background: var(--brand-wash); color: var(--brand-deep); font-size: 11.5px; font-weight: 600; cursor: pointer; transition: background var(--t-fast), color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-mail-att strong { font-weight: 700; font-family: var(--mono); font-size: 11px; } +.proto-root .jc-mail-att span { font-size: 10px; opacity: .75; } +.proto-root .jc-mail-att:hover:not(.static) { background: var(--brand); border-color: var(--brand); color: #fff; box-shadow: var(--shadow-brand); } +.proto-root .jc-mail-att.static { cursor: default; } + +/* 邮件编辑态：主题/收件人/抄送/正文可改（取消回滚 · 保存确认，同数据表编辑模式） */ +.proto-root .jc-mail.editing { border-color: var(--brand-soft); box-shadow: 0 0 0 2px rgba(51, 112, 255, .08); } +.proto-root .jc-mail.editing .jc-mail-head { flex-wrap: wrap; } +.proto-root .jc-mail.editing .jc-mail-sub { flex: 1 1 180px; } +.proto-root .jc-mail-head .jc-tbar-actions { flex: none; display: inline-flex; gap: 6px; margin-top: 2px; } +.proto-root .jc-mail-input { flex: 1; min-width: 120px; box-sizing: border-box; border: 1px solid var(--line-soft); border-radius: 6px; padding: 4px 8px; font: inherit; font-size: 11.5px; color: var(--ink); background: #fff; transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-mail-input.subj { display: block; width: 100%; margin-top: 3px; font-size: 12.5px; font-weight: 700; } +.proto-root .jc-mail-input:focus { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 2px rgba(51, 112, 255, .12); } +.proto-root .jc-mail.editing .jc-mail-meta span { flex: 1 1 240px; } +.proto-root .jc-mail-bodyedit { display: block; box-sizing: border-box; width: calc(100% - 26px); margin: 0 13px 10px; padding: 9px 11px; border: 1px solid var(--brand-soft); border-left-width: 3px; border-radius: 0 8px 8px 0; background: #fff; font: inherit; font-size: 12px; color: var(--ink); line-height: 1.7; resize: vertical; } +.proto-root .jc-mail-bodyedit:focus { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 2px rgba(51, 112, 255, .12); } + +/* 区块内等待条（如「等待客户回复中」占页面下半部；回齐后让位给结果） */ +.proto-root .jc-mst-waiting { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; margin-top: 12px; padding: 16px 16px; border: 1px dashed var(--line); border-radius: 11px; background: linear-gradient(120deg, var(--soft), #fff 60%); } +.proto-root .jc-mstw-dot { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--st-wait, #6a7590); animation: jc-mstw-pulse 1.4s ease-in-out infinite; } +@keyframes jc-mstw-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(106, 117, 144, .35); } 50% { box-shadow: 0 0 0 7px rgba(106, 117, 144, 0); } } +.proto-root .jc-mstw-txt { flex: 1 1 150px; min-width: 0; line-height: 1.45; } +.proto-root .jc-mstw-txt strong { display: block; font-size: 12.5px; font-weight: 700; color: var(--ink-2); } +.proto-root .jc-mstw-txt span { display: block; font-size: 11px; color: var(--ink-4); } +.proto-root .jc-mstw-skeleton { flex: 1 1 90px; max-width: 130px; display: grid; gap: 5px; } +.proto-root .jc-mstw-skeleton i { height: 7px; border-radius: 4px; background: linear-gradient(90deg, #e8ebf1 25%, #f4f6fa 45%, #e8ebf1 65%); background-size: 200% 100%; animation: jc-mstw-shimmer 1.6s linear infinite; } +.proto-root .jc-mstw-skeleton i:nth-child(2) { width: 78%; animation-delay: .15s; } +.proto-root .jc-mstw-skeleton i:nth-child(3) { width: 56%; animation-delay: .3s; } +@keyframes jc-mstw-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } } + +/* 结果卡组（cards 块）：外部角色提交的最终结论——大数字 + 元信息贴片 + 提交署名 */ +.proto-root .jc-msrc-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(215px, 1fr)); gap: 12px; } +.proto-root .jc-msrc { display: flex; flex-direction: column; gap: 9px; background: #fff; border: 1px solid var(--line-soft); border-top: 3px solid var(--brand); border-radius: 12px; padding: 12px 14px 10px; box-shadow: 0 1px 4px rgba(31, 35, 41, .05); } +.proto-root .jc-msrc.tone-ok { border-top-color: var(--ok-accent); } +.proto-root .jc-msrc.tone-warn { border-top-color: var(--warn-accent); } +.proto-root .jc-msrc.tone-danger { border-top-color: var(--danger-accent); } +.proto-root .jc-msrc-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; } +.proto-root .jc-msrc-tag { display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; font-weight: 700; color: var(--brand-deep); background: var(--brand-wash); border: 1px solid var(--brand-soft); border-radius: 999px; padding: 2px 9px; } +.proto-root .jc-msrc.tone-ok .jc-msrc-tag { color: var(--ok); background: var(--ok-soft); border-color: #bfedb4; } +.proto-root .jc-msrc.tone-warn .jc-msrc-tag { color: var(--warn); background: var(--warn-soft); border-color: #fbd9a5; } +.proto-root .jc-msrc.tone-danger .jc-msrc-tag { color: var(--danger); background: var(--danger-soft); border-color: #f6c6c3; } +.proto-root .jc-msrc-head time { font-size: 10px; color: var(--ink-4); font-family: var(--mono); } +.proto-root .jc-msrc-pn { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; } +.proto-root .jc-msrc-pn strong { font-size: 13.5px; font-weight: 800; color: var(--ink); } +.proto-root .jc-msrc-pn code, .proto-root .jc-msrc-swap em { font-size: 10px; color: var(--ink-4); font-family: var(--mono); background: var(--soft); border: 1px solid var(--line-soft); border-radius: 5px; padding: 1px 6px; } +.proto-root .jc-msrc-swap { display: flex; align-items: baseline; gap: 7px; flex-wrap: wrap; } +.proto-root .jc-msrc-swap s { font-size: 12px; color: var(--ink-4); text-decoration-color: var(--danger-accent); } +.proto-root .jc-msrc-swap i { font-style: normal; font-size: 12px; color: var(--ink-4); } +.proto-root .jc-msrc-swap strong { font-size: 13.5px; font-weight: 800; color: var(--ink); } +.proto-root .jc-msrc-big { display: flex; align-items: baseline; gap: 8px; } +.proto-root .jc-msrc-big em { font-style: normal; font-size: 23px; font-weight: 800; color: var(--ink); font-family: var(--mono); letter-spacing: -.02em; } +.proto-root .jc-msrc-big span { font-size: 10.5px; color: var(--ink-4); } +.proto-root .jc-msrc-meta { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(88px, 1fr)); gap: 6px 10px; } +.proto-root .jc-msrc-meta li { display: flex; flex-direction: column; gap: 1px; border-left: 2px solid var(--line-soft); padding-left: 8px; } +.proto-root .jc-msrc-meta i { font-style: normal; font-size: 10px; color: var(--ink-4); } +.proto-root .jc-msrc-meta b { font-size: 11.5px; font-weight: 700; color: var(--ink-2); font-family: var(--mono); } +.proto-root .jc-msrc-note { margin: 0; font-size: 11px; line-height: 1.6; color: var(--ink-3); background: var(--soft); border-radius: 8px; padding: 7px 10px; } +.proto-root .jc-msrc-from { display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; color: var(--ink-4); border-top: 1px dashed var(--line-soft); padding-top: 7px; margin-top: auto; } + +/* SVG 环图 + 图例 */ +.proto-root .jc-mst-donut { display: flex; align-items: center; gap: 18px; background: #fff; border: 1px solid var(--line-soft); border-radius: 10px; padding: 12px 14px; } +.proto-root .jc-mst-donut-num { font-size: 24px; font-weight: 800; fill: var(--ink); font-family: var(--mono); } +.proto-root .jc-mst-donut-unit { font-size: 10px; font-weight: 700; fill: var(--ink-4); letter-spacing: .08em; } +.proto-root .jc-mst-legend { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; min-width: 0; flex: 1; } +.proto-root .jc-mst-legend li { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--ink-2); } +.proto-root .jc-mst-legend i { flex: none; width: 10px; height: 10px; border-radius: 3px; } +.proto-root .jc-mst-legend span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-mst-legend b { margin-left: auto; font-family: var(--mono); color: var(--ink); } +.proto-root .jc-mst-legend em { flex: none; font-style: normal; font-size: 10.5px; font-weight: 700; color: var(--ink-4); font-family: var(--mono); background: var(--soft); border: 1px solid var(--line-soft); border-radius: 999px; padding: 1px 7px; } +.proto-root .wf-log { display: flex; flex-direction: column; gap: 12px; } +.proto-root .wf-ms { position: relative; padding: 0 0 4px 34px; } +.proto-root .wf-ms::before { content: ""; position: absolute; left: 12px; top: 26px; bottom: -12px; width: 2px; background: var(--line-soft); } +.proto-root .wf-ms:last-child::before { display: none; } +.proto-root .wf-ms-dot { position: absolute; left: 0; top: 0; width: 26px; height: 26px; border-radius: 999px; display: grid; place-items: center; font-size: 9.5px; font-weight: 800; letter-spacing: -.03em; font-family: var(--mono); z-index: 1; border: 2px solid var(--accent, var(--brand)); background: var(--accent, var(--brand)); color: #fff; } +.proto-root .wf-ms-dot.active { background: #fff; color: var(--accent, var(--brand)); box-shadow: 0 0 0 4px var(--accent-soft, var(--brand-wash)); animation: wfpulse 1.7s ease-in-out infinite; } +.proto-root .wf-ms-head { display: flex; align-items: center; gap: 8px; min-height: 26px; } +.proto-root .wf-ms-head strong { font-size: 13.5px; color: var(--ink); } +.proto-root .wf-ms-tag { font-size: 10px; font-weight: 700; padding: 1px 7px; border-radius: 999px; color: var(--accent, var(--brand)); background: var(--accent-soft, var(--brand-wash)); } +.proto-root .wf-live { display: inline-flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 800; color: var(--accent, var(--brand)); } +.proto-root .wf-live i { width: 6px; height: 6px; border-radius: 999px; background: currentColor; animation: wfpulse 1.4s ease-in-out infinite; } +/* 里程碑 · 结论摘要 + 过程明细（逐条展开内容与时间） */ +.proto-root .jc-ms-sum { display: flex; align-items: flex-start; gap: 8px; margin: 8px 0 0; font-size: 12.5px; font-weight: 700; color: var(--ink); line-height: 1.5; } +.proto-root .jc-ms-sum::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 999px; margin-top: 5px; background: var(--accent, var(--brand)); box-shadow: 0 0 0 3px var(--accent-soft, var(--brand-wash)); } +.proto-root .jc-ms-rows { list-style: none; margin: 7px 0 0; padding: 8px 10px; display: flex; flex-direction: column; gap: 6px; background: var(--soft); border: 1px solid var(--line-soft); border-radius: 10px; } +.proto-root .jc-ms-rows li { display: flex; align-items: flex-start; gap: 7px; font-size: 12px; color: var(--ink-2); line-height: 1.5; min-width: 0; } +.proto-root .jc-ms-ico { flex: none; width: 18px; height: 18px; display: grid; place-items: center; border-radius: 5px; background: #fff; border: 1px solid var(--line-soft); color: var(--accent, var(--ink-3)); margin-top: 1px; } +.proto-root .jc-ms-text { flex: 1; min-width: 0; word-break: break-word; } +.proto-root .jc-ms-time { flex: none; font-size: 10.5px; color: var(--ink-4); font-family: var(--mono); margin-top: 2px; } +.proto-root .jc-ms-rows li.neg { color: var(--danger); } +.proto-root .jc-ms-rows li.neg .jc-ms-ico { color: var(--danger-accent); border-color: #f9c1be; background: var(--danger-soft); } +.proto-root .wf-wait { margin: 8px 0 0; font-size: 12px; color: var(--ink-3); } +.proto-root .wf-dlvs { display: grid; grid-template-columns: repeat(2, 1fr); gap: 11px; margin-top: 2px; } +.proto-root .wf-dlv { display: flex; align-items: center; gap: 12px; padding: 13px 14px; border: 1px solid var(--line-soft); border-radius: 13px; background: #fff; } +.proto-root .wf-dlv.ready { border-color: #e2e6ec; background: #fff; } +.proto-root .wf-dlv-ico { width: 38px; height: 38px; flex: none; border-radius: 11px; display: grid; place-items: center; background: #f1f3f6; color: var(--ink-3); box-shadow: inset 0 0 0 1px rgba(31, 35, 41, .03); } +.proto-root .wf-dlv-ico.dlv-markdown { background: linear-gradient(140deg, var(--brand-soft), var(--brand-wash)); color: var(--brand); } +.proto-root .wf-dlv-ico.dlv-excel { background: linear-gradient(140deg, #d5f5cf, var(--ok-soft)); color: #259b16; } +.proto-root .wf-dlv-ico.dlv-word { background: linear-gradient(140deg, #e0e3fc, var(--st-auto-soft)); color: var(--st-auto); } +.proto-root .wf-dlv-ico.dlv-pdf { background: linear-gradient(140deg, #fddede, var(--danger-soft)); color: var(--danger-accent); } +.proto-root .wf-dlv:not(.ready) .wf-dlv-ico { background: #f1f3f6 !important; color: #c3c8cf; } +.proto-root .wf-dlv-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; } +.proto-root .wf-dlv-txt strong { font-size: 13px; font-weight: 700; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +.proto-root .wf-dlv:not(.ready) .wf-dlv-txt strong { color: var(--ink-3); } +.proto-root .wf-dlv-txt span { font-size: 11px; color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +.proto-root .wf-dlv-check { flex: none; color: var(--ok-accent); display: grid; place-items: center; } +/* 任务成果卡可点击（就绪后打开二级文件界面） */ +.proto-root button.wf-dlv { width: 100%; font: inherit; text-align: left; cursor: pointer; transition: transform var(--t-fast), box-shadow var(--t-fast), border-color var(--t-fast); } +.proto-root button.wf-dlv:disabled { cursor: default; } +.proto-root .wf-dlv.ready:hover { border-color: var(--brand-soft); box-shadow: 0 12px 26px rgba(51, 112, 255, .15); transform: translateY(-2px); } +.proto-root .wf-dlv-open { flex: none; color: #c3c8cf; display: grid; place-items: center; transition: color var(--t-fast), transform var(--t-fast); } +.proto-root .wf-dlv.ready:hover .wf-dlv-open { color: var(--brand); transform: translateX(2px); } +@keyframes wfpulse { 0%, 100% { opacity: .55; } 50% { opacity: 1; } } + +/* ===================================================================== */ +/* ===== 二级文件查看界面（成果文件渲染器：md / excel / word / pdf） ===== */ +/* ===================================================================== */ +.proto-root .fileview { display: flex; flex-direction: column; min-height: 0; height: 100%; } +.proto-root .fileview-bar { display: flex; align-items: center; gap: 12px; padding: 11px 16px; border-top: 3px solid var(--brand); border-bottom: 1px solid var(--line-soft); background: linear-gradient(180deg, #fbfcfe, #f5f7fa); flex: none; } +.proto-root .fileview.k-markdown .fileview-bar { border-top-color: var(--brand); } +.proto-root .fileview.k-excel .fileview-bar { border-top-color: #259b16; } +.proto-root .fileview.k-word .fileview-bar { border-top-color: var(--st-auto); } +.proto-root .fileview.k-pdf .fileview-bar { border-top-color: var(--danger-accent); } +.proto-root .fileview-back { display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink-2); font-size: 13px; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast); } +.proto-root .fileview-back:hover { background: var(--soft); border-color: #c9ced6; } +.proto-root .fileview-name { display: flex; align-items: center; gap: 7px; min-width: 0; color: var(--ink); } +.proto-root .fileview-name svg { color: var(--ink-3); flex: none; } +.proto-root .fileview-name strong { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +.proto-root .fileview-kind { margin-left: auto; flex: none; font-size: 11px; font-weight: 700; padding: 3px 9px; border-radius: 999px; } +.proto-root .fileview-kind.k-markdown { color: var(--brand-deep); background: var(--brand-wash); } +.proto-root .fileview-kind.k-excel { color: var(--ok); background: var(--ok-soft); } +.proto-root .fileview-kind.k-word { color: var(--st-auto); background: var(--st-auto-soft); } +.proto-root .fileview-kind.k-pdf { color: var(--danger); background: var(--danger-soft); } +.proto-root .fileview-body { min-height: 0; padding: 26px 22px; background: radial-gradient(120% 80% at 50% 0%, #eef1f6 0%, #e8ecf1 100%); } + +/* 文档纸张（word：居中纸张） */ +.proto-root .doc-paper { max-width: 760px; margin: 0 auto; background: #fff; border: 1px solid var(--line-soft); border-radius: 8px; box-shadow: 0 16px 44px rgba(31, 35, 41, .14), 0 2px 6px rgba(31, 35, 41, .06); padding: 44px 52px; } +/* markdown：铺满中间区全渲染，无窄栏/灰边/纸张感 */ +.proto-root .fileview.k-markdown .fileview-body { background: #fff; padding: 0; } +.proto-root .doc-paper.doc-full { max-width: none; margin: 0; min-height: 100%; border: 0; border-radius: 0; box-shadow: none; padding: 28px 40px; } +.proto-root .word-paper h1 { font-size: 22px; font-weight: 800; color: var(--ink); margin: 0 0 14px; text-align: center; } +.proto-root .word-paper h2 { font-size: 16px; font-weight: 700; color: var(--ink); margin: 20px 0 8px; } +.proto-root .word-paper p { font-size: 14px; line-height: 1.9; color: var(--ink-2); margin: 0 0 10px; text-indent: 2em; } +.proto-root .word-paper ul { margin: 0 0 10px; padding-left: 24px; } +.proto-root .word-paper li { font-size: 14px; line-height: 1.9; color: var(--ink-2); list-style: disc; } + +/* markdown 文档排版 */ +.proto-root .doc-paper .md { font-size: 14px; line-height: 1.85; color: var(--ink-2); } +.proto-root .doc-paper .md > :first-child { margin-top: 0; } +.proto-root .doc-paper .md h1 { font-size: 22px; font-weight: 800; color: var(--ink); margin: 0 0 14px; } +.proto-root .doc-paper .md h2 { font-size: 17px; font-weight: 700; color: var(--ink); margin: 22px 0 8px; } +.proto-root .doc-paper .md h3 { font-size: 15px; font-weight: 700; margin: 16px 0 6px; } +.proto-root .doc-paper .md p { margin: 0 0 12px; } +.proto-root .doc-paper .md ul { list-style: disc; padding-left: 24px; margin: 0 0 12px; } +.proto-root .doc-paper .md ol { list-style: decimal; padding-left: 24px; margin: 0 0 12px; } +.proto-root .doc-paper .md li { margin: 4px 0; } +.proto-root .doc-paper .md blockquote { border-left: 3px solid var(--brand-soft); padding: 4px 14px; margin: 0 0 12px; color: var(--ink-3); background: var(--soft); border-radius: 0 6px 6px 0; } +.proto-root .doc-paper .md code { background: #eef1f5; border-radius: 4px; padding: 1px 5px; font-family: var(--mono); font-size: 13px; } +.proto-root .doc-paper .md strong { font-weight: 700; color: var(--ink); } +.proto-root .doc-paper .md a { color: var(--brand); text-decoration: underline; } +.proto-root .doc-paper .md table { border-collapse: collapse; font-size: 13px; margin: 0 0 12px; } +.proto-root .doc-paper .md th, .proto-root .doc-paper .md td { border: 1px solid var(--line-soft); padding: 5px 9px; text-align: left; } +.proto-root .doc-paper .md th { background: #f1f3f6; } + +/* excel 电子表格网格 */ +.proto-root .xls { max-width: 880px; margin: 0 auto; background: #fff; border: 1px solid #ccd1d9; border-radius: 8px; box-shadow: 0 16px 44px rgba(31, 35, 41, .14), 0 2px 6px rgba(31, 35, 41, .06); overflow: hidden; } +.proto-root .xls-grid { border-collapse: collapse; width: 100%; font-size: 13px; } +.proto-root .xls-grid th, .proto-root .xls-grid td { border: 1px solid #e6e9ee; } +.proto-root .xls-colh, .proto-root .xls-rowh, .proto-root .xls-corner { background: #eef1f4; color: var(--ink-3); font-weight: 700; text-align: center; font-size: 11px; font-family: var(--mono); } +.proto-root .xls-colh { height: 26px; } +.proto-root .xls-rowh { width: 38px; } +.proto-root .xls-grid tbody tr:nth-child(even) .xls-cell { background: #fafbfc; } +.proto-root .xls-cell { padding: 8px 12px; color: var(--ink); white-space: nowrap; } +.proto-root .xls-cell.xls-head { background: linear-gradient(180deg, var(--ok-soft), #d5f5cf); color: #1c6e10; font-weight: 800; border-bottom: 2px solid #8ce07e; } +.proto-root .xls-tabs { display: flex; gap: 2px; padding: 7px 9px 0; background: #eef1f4; border-top: 1px solid var(--line-soft); } +.proto-root .xls-tab { font-size: 12px; padding: 6px 16px; border: 1px solid var(--line-soft); border-bottom: 0; border-radius: 7px 7px 0 0; background: #fff; color: var(--ink-2); } +.proto-root .xls-tab.active { color: var(--ok); font-weight: 800; box-shadow: inset 0 2px 0 var(--ok-accent); } + +/* pdf 内嵌 */ +.proto-root .pdf-frame { width: 100%; height: 100%; min-height: 72vh; border: 0; background: #fff; border-radius: 8px; box-shadow: 0 16px 44px rgba(31, 35, 41, .14); display: block; } + +/* ===================================================================== */ +/* ===== 右侧对话区（独立于原型 chat 皮） ===== */ +/* ===================================================================== */ +@keyframes spin { to { transform: rotate(360deg); } } +@keyframes rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } } +@keyframes shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } } + +.proto-root .session-chat { min-width: 0; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; } +.proto-root .session-chat .copilot-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 12px; border-bottom: 1px solid var(--line-soft); flex: none; } +.proto-root .copilot-head-main { display: flex; align-items: center; gap: 10px; } +.proto-root .copilot-head-main .brand-mark { width: 34px; height: 34px; flex: none; border-radius: 10px; background: var(--ai-grad); color: #fff; display: grid; place-items: center; animation: aiBreath 4.2s ease-in-out infinite; } +.proto-root .session-chat .copilot-head h2 { margin: 0; font-size: 15px; color: var(--ink); } +.proto-root .copilot-agent-status { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ok); margin: 2px 0 0; } +.proto-root .copilot-agent-status span { width: 8px; height: 8px; border-radius: 999px; background: var(--ok-accent); display: inline-block; } +.proto-root .session-chat .copilot-stream { min-height: 0; padding: 12px; display: flex; flex-direction: column; gap: 12px; background: var(--wl-bg); } +.proto-root .session-chat .copilot-stream > * { flex: 0 0 auto; } + +/* 对话气泡(协同/讨论回合)：员工 = 飞书蓝，AI = 白底卡片 */ +.proto-root .session-chat .copilot-msg { display: flex; gap: 8px; max-width: 100%; align-items: flex-start; box-shadow: none; padding: 0; background: transparent; border: 0; } +.proto-root .session-chat .copilot-msg.agent { flex-direction: row; justify-content: flex-start; } +.proto-root .session-chat .copilot-msg.human { flex-direction: row; justify-content: flex-end; } +.proto-root .chat-avatar { width: 30px; height: 30px; flex: none; border-radius: 9px; display: grid; place-items: center; color: #fff; box-shadow: 0 2px 5px rgba(31, 35, 41, .16), inset 0 0 0 1px rgba(255, 255, 255, .14); } +.proto-root .chat-avatar svg { filter: drop-shadow(0 1px 1px rgba(31, 35, 41, .22)); } +.proto-root .chat-avatar-ai { background: var(--ai-grad); } +.proto-root .chat-avatar-user { background: linear-gradient(140deg, #2bc7d4, #0e9fd8); } +.proto-root .session-chat .copilot-msg .chat-avatar.chat-avatar { display: grid; place-items: center; max-width: none; } +.proto-root .session-chat .copilot-msg .copilot-bubble { display: block; max-width: 78%; margin-top: 15px; background: #fff; border: 1px solid var(--line-soft); border-radius: 4px 14px 14px 14px; padding: 10px 12px; font-size: 13px; color: var(--ink); line-height: 1.6; white-space: pre-wrap; word-break: break-word; box-shadow: var(--shadow-1); } +.proto-root .session-chat .copilot-msg.human .copilot-bubble { margin-top: 0; background: linear-gradient(135deg, #3a78ff, var(--brand-deep)); border-color: transparent; color: #fff; border-radius: 14px 4px 14px 14px; box-shadow: 0 6px 16px rgba(51, 112, 255, .24); } +/* 蓝气泡内一律浅色字（修复深灰字压蓝底看不清） */ +.proto-root .session-chat .copilot-msg.human .copilot-bubble * { color: #fff; } +.proto-root .session-chat .copilot-msg.human .hist-kv { margin-top: 8px; gap: 6px 8px; } +.proto-root .session-chat .copilot-msg.human .hist-kv span { background: rgba(255, 255, 255, .18); border-radius: 6px; padding: 2px 8px; font-size: 11px; } + +/* 阶段块：顶部阶段卡（分隔标记）+ 下方对话流（气泡）；推进时整块升入 */ +.proto-root .stage-block { display: flex; flex-direction: column; gap: 10px; animation: rise var(--t-med) both; } +.proto-root .stage-thread { display: flex; flex-direction: column; gap: 10px; } +.proto-root .stage-marker { overflow: visible; } +/* AI 侧承载交互过程的宽气泡：白底，容纳折叠块/表单/分支/控件 */ +.proto-root .session-chat .copilot-msg.agent .copilot-bubble.wide { flex: 1 1 auto; min-width: 0; max-width: 100%; margin-top: 0; background: #fff; border-color: var(--line-soft); white-space: normal; box-shadow: 0 4px 16px rgba(31, 35, 41, .05); } +.proto-root .copilot-bubble.wide .exec-field input, .proto-root .copilot-bubble.wide .exec-field textarea { width: 100%; box-sizing: border-box; } +.proto-root .copilot-bubble.wide > .work-input { margin-bottom: 8px; } +.proto-root .copilot-bubble.wide > .wfold + .wfold, .proto-root .copilot-bubble.wide > .work-input + .wfold { margin-top: 8px; } +.proto-root .copilot-bubble.wide > .wfblock, .proto-root .copilot-bubble.wide > .wfold, .proto-root .copilot-bubble.wide > .output-panel, .proto-root .copilot-bubble.wide > .decision-branches, .proto-root .copilot-bubble.wide > .exec-form { margin-top: 8px; } +.proto-root .copilot-bubble.wide > :first-child { margin-top: 0; } +.proto-root .copilot-bubble.wide > .card-actions { margin-top: 12px; } +.proto-root .copilot-bubble .bubble-ask { font-size: 13px; color: var(--ink-2); font-weight: 600; margin: 0 0 2px; } +.proto-root .copilot-bubble .bubble-intro { font-size: 13px; color: var(--ink-2); line-height: 1.6; margin: 0; } +.proto-root .copilot-bubble.wide .redo-note { margin: 0; } + +/* 节点属性标（落在每个节点第一条 AI 气泡里：类型 + 编号 + 标题 + 结果） */ +.proto-root .jc-btag { display: flex; align-items: center; gap: 7px; margin: 0 0 9px; padding: 0 0 8px; border-bottom: 1px dashed var(--line-soft); min-width: 0; } +.proto-root .jc-btag > b { font-size: 10.5px; font-weight: 800; color: var(--ink-4); font-family: var(--mono); } +.proto-root .jc-btag-title { flex: 1; min-width: 0; font-size: 12px; font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-btag .stage-outcome { flex: none; } +/* 里程碑段卡头部：图标 + 进行中脉冲 */ +.proto-root .jc-msec-ico { width: 22px; height: 22px; flex: none; border-radius: 7px; display: grid; place-items: center; background: var(--ai-grad); color: #fff; } +.proto-root .jc-msec-live { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; color: var(--brand-deep); } +.proto-root .jc-msec-live i { width: 7px; height: 7px; border-radius: 999px; background: var(--brand); animation: wfpulse 1.5s ease-in-out infinite; } + +/* 阶段进度标签 */ +.proto-root .harness-tag { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 999px; color: #fff; } +.proto-root .harness-tag.t-auto { background: var(--st-auto); } +.proto-root .harness-tag.t-execute { background: var(--st-execute); } +.proto-root .harness-tag.t-decision { background: var(--st-decision); } +.proto-root .harness-tag.t-collaborate { background: var(--st-collab); } +.proto-root .harness-tag.t-wait { background: var(--st-wait); } +.proto-root .harness-done { display: flex; align-items: center; gap: 8px; color: var(--ink-3); font-size: 13px; padding: 12px; } + +/* 阶段卡片：当前阶段带「AI 流光」顶边（签名元素之二）。 + 当前节点卡吸顶：会话滚过一屏时吸合在会话栏顶部，标题栏（含 CMMN 工具条）常驻可达 */ +.proto-root .stage-card { border: 1px solid var(--line-soft); border-radius: 14px; background: #fff; overflow: hidden; box-shadow: var(--shadow-1); position: relative; } +/* 当前里程碑段卡不再吸顶：随内容正常滚动（原 position:sticky;top:0 已移除） */ +.proto-root .stage-card.current { border-color: var(--brand-soft); box-shadow: 0 0 0 1px var(--brand-soft), 0 8px 20px rgba(31, 35, 41, .1); } +.proto-root .stage-card.current::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 2px; background: linear-gradient(90deg, transparent, var(--ai-a), var(--ai-b), transparent); background-size: 200% 100%; animation: shimmer 2.8s linear infinite; z-index: 1; } +.proto-root .stage-card-head { display: flex; align-items: center; gap: 8px; width: 100%; padding: 11px 13px; background: #fff; border: 0; cursor: pointer; text-align: left; transition: background var(--t-fast); } +.proto-root .stage-card-head:disabled { cursor: default; } +.proto-root .stage-card:not(.current) .stage-card-head:hover { background: var(--soft); } +.proto-root .stage-card.current > .stage-card-head { background: linear-gradient(180deg, var(--brand-wash), #fff); } +.proto-root .stage-num { min-width: 20px; height: 20px; padding: 0 4px; flex: none; border-radius: 7px; background: var(--ink); color: #fff; font-size: 10.5px; font-weight: 700; display: grid; place-items: center; font-family: var(--mono); } +.proto-root .stage-card.current .stage-num { background: var(--brand); } +.proto-root .stage-card-title { flex: 1; font-size: 13px; font-weight: 600; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .stage-outcome { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 999px; } +.proto-root .stage-outcome.o-ok { color: var(--ok); background: var(--ok-soft); } +.proto-root .stage-outcome.o-rej { color: var(--danger); background: var(--danger-soft); } +.proto-root .stage-outcome.o-dec { color: var(--st-decision); background: var(--st-decision-soft); } +.proto-root .stage-card-body { padding: 0 13px 13px; } + +/* 工作 */ +.proto-root .work { display: flex; flex-direction: column; gap: 8px; } +.proto-root .work-input { font-size: 12px; color: var(--ink-3); display: flex; align-items: center; gap: 6px; background: var(--soft); border: 1px solid var(--line-soft); border-radius: 8px; padding: 7px 10px; } +.proto-root .work-assistant { display: flex; flex-direction: column; gap: 8px; } +.proto-root .work-content { display: flex; gap: 7px; font-size: 13px; color: var(--ink); line-height: 1.62; padding: 10px 12px; background: var(--soft); border: 1px solid var(--line-soft); border-radius: 10px; } +.proto-root .work-content > svg { color: var(--ink-3); flex: none; margin-top: 2px; } +.proto-root .work-intro { font-size: 12px; color: var(--ink-4); margin: 0 0 4px; line-height: 1.5; } +.proto-root .work-hint { font-size: 12px; color: var(--ink-4); } +.proto-root .work-processing { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--brand); padding: 6px 0; } +.proto-root .redo-note { font-size: 12px; color: var(--warn); background: var(--warn-soft); border: 1px solid #fbd9a5; border-radius: 8px; padding: 6px 10px; } + +/* 折叠块(思维链/工具调用) */ +.proto-root .wfold { border: 1px solid var(--line-soft); border-radius: 10px; background: linear-gradient(180deg, #fcfdff, #f6f8fb); overflow: hidden; } +.proto-root .wfold-head { display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px 11px; background: transparent; border: 0; cursor: pointer; text-align: left; font-size: 12px; font-weight: 600; color: var(--ink-2); transition: background var(--t-fast); } +.proto-root .wfold-head:hover { background: var(--brand-wash); } +.proto-root .wfold-ico { width: 20px; height: 20px; flex: none; border-radius: 6px; display: grid; place-items: center; background: #fff; border: 1px solid var(--line-soft); color: var(--ink-3); } +.proto-root .wfold-think .wfold-ico { color: var(--st-auto); border-color: #dfe2fb; background: var(--st-auto-soft); } +.proto-root .wfold-tool .wfold-ico { color: #14c0ff; border-color: #c9edfd; background: #eaf9ff; } +.proto-root .wfold-input .wfold-ico { color: var(--ink-2); border-color: var(--line-soft); background: #f1f3f6; } +.proto-root .wfold-result .wfold-ico { color: var(--ok); border-color: #bfedb4; background: var(--ok-soft); } +.proto-root .wfold-summary .wfold-ico { color: var(--st-decision); border-color: #e4d5fd; background: var(--st-decision-soft); } +.proto-root .wfold-form .wfold-ico { color: var(--warn); border-color: #fbd9a5; background: var(--warn-soft); } +.proto-root .wfold-wait .wfold-ico { color: var(--st-wait); border-color: #dfe3ec; background: var(--st-wait-soft); } +.proto-root .wfold-sum { flex: 1; } +.proto-root .wfold-head > svg:last-child { color: var(--ink-4); transition: transform var(--t-fast); } +.proto-root .wfold-body { padding: 4px 12px 12px; } + +/* 非折叠板块（信息输入 / 工作成果 / 工作总结）：与折叠块同款外观 */ +.proto-root .wfblock { border: 1px solid var(--line-soft); border-radius: 10px; background: linear-gradient(180deg, #fcfdff, #f6f8fb); overflow: hidden; } +.proto-root .wfblock-head { display: flex; align-items: center; gap: 8px; padding: 8px 11px; font-size: 12px; font-weight: 600; color: var(--ink-2); } +.proto-root .wfblock-body { padding: 0 12px 11px; } +.proto-root .wfblock-text { margin: 0; font-size: 12.5px; color: var(--ink-2); line-height: 1.6; } +.proto-root .wfblock-text .md { font-size: 12.5px; line-height: 1.6; } +.proto-root .wfblock-text .md > :first-child { margin-top: 0; } +.proto-root .wfblock-text .md > :last-child { margin-bottom: 0; } +.proto-root .wfblock .output-rows { border: 1px solid var(--line-soft); border-radius: 8px; background: #fff; overflow: hidden; } +/* 时间戳走等宽：数据感 */ +.proto-root .wf-times { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 10px; padding-top: 9px; border-top: 1px dashed var(--line-soft); font-size: 11px; color: var(--ink-3); font-family: var(--mono); } +.proto-root .wf-times span { display: inline-flex; align-items: center; gap: 5px; } +.proto-root .wf-times svg { color: var(--ink-4); } + +/* 思维链:编号时间线 */ +.proto-root .think-steps { list-style: none; margin: 0; padding: 0; } +.proto-root .think-step { position: relative; display: flex; gap: 10px; padding: 0 0 12px; } +.proto-root .think-step::before { content: ""; position: absolute; left: 10px; top: 22px; bottom: -2px; width: 1.5px; background: #dfe2fb; } +.proto-root .think-step:last-child::before { display: none; } +.proto-root .think-step:last-child { padding-bottom: 2px; } +.proto-root .think-step-num { width: 21px; height: 21px; flex: none; border-radius: 999px; display: grid; place-items: center; font-size: 11px; font-weight: 700; background: var(--st-auto-soft); color: var(--st-auto); border: 1px solid #dfe2fb; z-index: 1; font-family: var(--mono); } +.proto-root .think-step-text { font-size: 12px; color: var(--ink-2); line-height: 1.55; padding-top: 2px; } +.proto-root .think-text { font-size: 12px; color: var(--ink-2); line-height: 1.6; white-space: pre-wrap; } + +/* 工具调用:图标行 */ +.proto-root .tool-list { display: flex; flex-direction: column; gap: 7px; } +.proto-root .tool-row { display: flex; align-items: center; gap: 9px; font-size: 12px; padding: 7px 9px; background: #fff; border: 1px solid var(--line-soft); border-radius: 9px; transition: border-color var(--t-fast); } +.proto-root .tool-row:hover { border-color: #c9ced6; } +.proto-root .tool-ico { width: 22px; height: 22px; flex: none; border-radius: 6px; display: grid; place-items: center; background: var(--ink); color: #e2e5e9; } +.proto-root .tool-name { font-family: var(--mono); font-size: 11.5px; color: var(--st-auto); font-weight: 600; flex: none; } +.proto-root .tool-result { flex: 1; min-width: 0; color: var(--ink-3); line-height: 1.4; } +.proto-root .tool-lat { flex: none; display: inline-flex; align-items: center; gap: 3px; color: var(--st-collab); background: var(--st-collab-soft); border: 1px solid #a9e9e0; border-radius: 999px; padding: 1px 7px; font-size: 11px; font-weight: 600; font-family: var(--mono); } +.proto-root .tool-ok { flex: none; width: 18px; height: 18px; border-radius: 999px; display: grid; place-items: center; background: var(--ok-soft); color: var(--ok-accent); } + +/* AI 工作成果输出表(auto：人工确认的对象 = 这份产出) */ +.proto-root .output-panel { border: 1px solid var(--line); border-radius: 11px; background: #fff; overflow: hidden; } +.proto-root .output-panel-head { display: flex; align-items: center; gap: 7px; padding: 9px 12px; font-size: 12px; font-weight: 700; color: var(--ink-2); background: var(--soft); border-bottom: 1px solid var(--line-soft); } +.proto-root .output-panel-head svg { color: var(--ink-3); } +.proto-root .output-rows { list-style: none; margin: 0; padding: 0; } +.proto-root .output-row { display: grid; grid-template-columns: 84px 1fr; gap: 12px; padding: 8px 12px; font-size: 12px; } +.proto-root .output-row:not(:last-child) { border-bottom: 1px solid #f1f3f6; } +.proto-root .ok-label { font-weight: 600; color: var(--ink-3); } +.proto-root .ok-value { color: var(--ink); line-height: 1.5; } + +/* 完整记录(execute 提交 / decision 决策) */ +.proto-root .record-head { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: var(--ink-3); margin-top: 2px; } +.proto-root .record-head svg { color: var(--ink-4); } +.proto-root .record-list { border: 1px solid var(--line-soft); border-radius: 10px; overflow: hidden; } +.proto-root .record-row { display: grid; grid-template-columns: 112px 1fr; gap: 10px; padding: 8px 12px; font-size: 12.5px; } +.proto-root .record-row:not(:last-child) { border-bottom: 1px solid #f1f3f6; } +.proto-root .rec-label { color: var(--ink-4); } +.proto-root .rec-value { color: var(--ink); font-weight: 500; word-break: break-word; } +.proto-root .rec-value.neg { color: var(--danger-accent); } +.proto-root .decision-branches.readonly .decision-branch { cursor: default; } +.proto-root .decision-branch strong em.chosen { background: var(--ok-accent); } + +/* 卡片上的确认/选项动作 */ +.proto-root .card-actions { display: flex; align-items: center; gap: 8px; margin-top: 12px; } +.proto-root .card-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; border-radius: 9px; border: 1px solid var(--line); background: #fff; color: var(--ink-2); font-size: 13px; font-weight: 500; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast), box-shadow var(--t-fast), transform var(--t-fast); } +.proto-root .card-btn:hover:not(:disabled) { background: var(--soft); border-color: #c9ced6; } +.proto-root .card-btn:active:not(:disabled) { transform: scale(.97); } +.proto-root .card-btn.primary { background: var(--brand); border-color: var(--brand); color: #fff; } +.proto-root .card-btn.primary:hover:not(:disabled) { background: var(--brand-deep); border-color: var(--brand-deep); box-shadow: var(--shadow-brand); } +.proto-root .card-btn.danger { color: var(--danger); border-color: #f9c1be; } +.proto-root .card-btn.danger:hover:not(:disabled) { background: var(--danger-soft); } +.proto-root .card-btn.sel { border-color: var(--st-decision); color: var(--st-decision); background: var(--st-decision-soft); } +.proto-root .card-btn:disabled { opacity: .5; cursor: not-allowed; } +.proto-root .card-hint { font-size: 12px; color: var(--warn); background: var(--warn-soft); border: 1px solid #fbd9a5; border-radius: 8px; padding: 7px 10px; margin: 0; } +.proto-root .auto-dot { width: 9px; height: 9px; flex: none; border-radius: 999px; background: var(--ok-accent); } +.proto-root .auto-dot.spin { background: transparent; border: 2px solid var(--brand-soft); border-top-color: var(--brand); animation: spin .7s linear infinite; width: 13px; height: 13px; } + +/* execute 表单 */ +.proto-root .exec-form { display: flex; flex-direction: column; gap: 12px; } +.proto-root .exec-field { display: flex; flex-direction: column; gap: 6px; } +.proto-root .exec-field > span { font-size: 12px; color: var(--ink-2); } +.proto-root .exec-field input, .proto-root .exec-field textarea { resize: vertical; border: 1px solid var(--line); border-radius: 8px; padding: 8px 10px; font-size: 13px; font-family: inherit; color: var(--ink); background: #fff; transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .exec-field input:focus, .proto-root .exec-field textarea:focus { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 3px rgba(51, 112, 255, .14); } +.proto-root .exec-radios { display: flex; gap: 8px; flex-wrap: wrap; } +.proto-root .exec-radio { padding: 7px 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink-2); font-size: 13px; cursor: pointer; transition: border-color var(--t-fast), background var(--t-fast), color var(--t-fast); } +.proto-root .exec-radio:hover:not(:disabled):not(.sel) { border-color: #c9ced6; background: var(--soft); } +.proto-root .exec-radio.sel { border-color: var(--brand); background: var(--brand-wash); color: var(--brand); } +.proto-root .exec-radio.neg.sel { border-color: var(--danger-accent); background: var(--danger-soft); color: var(--danger); } +/* 确认后：表单组件原样保留但禁用灰显 */ +.proto-root .exec-form.readonly .exec-field > span { color: var(--ink-4); } +.proto-root .exec-field input:disabled, .proto-root .exec-field textarea:disabled { background: #f3f4f6; color: #5c626b; -webkit-text-fill-color: #5c626b; border-color: #e6e8eb; cursor: default; } +.proto-root .exec-radio:disabled { cursor: default; color: var(--ink-4); background: #f3f4f6; border-color: #e6e8eb; } +.proto-root .exec-radio.sel:disabled { color: var(--ink-2); background: #e9ecf1; border-color: #c4cad3; font-weight: 600; } +.proto-root .exec-radio.neg.sel:disabled { color: #9a5b5b; background: #f6ebeb; border-color: #e2c6c6; } + +/* ===== execute 翻页卡片（类似考试系统：一页一卡，逐页校验） ===== */ +.proto-root .jc-page-head { display: flex; flex-direction: column; gap: 2px; margin: 2px 0 10px; padding: 9px 11px; background: #fff; border: 1px solid var(--line-soft); border-left: 3px solid var(--st-execute); border-radius: 8px; } +.proto-root .jc-page-head strong { font-size: 13px; color: var(--ink); } +.proto-root .jc-page-head span { font-size: 11.5px; color: var(--ink-3); line-height: 1.5; } +.proto-root .jc-pager { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--line-soft); } +.proto-root .jc-pager .card-btn { padding: 6px 14px; } +.proto-root .jc-page-dots { flex: 1; display: flex; justify-content: center; gap: 6px; } +.proto-root .jc-page-dots i { width: 8px; height: 8px; border-radius: 999px; background: #d9dde3; transition: background var(--t-fast), transform var(--t-fast); } +.proto-root .jc-page-dots i.done { background: var(--st-execute); opacity: .45; } +.proto-root .jc-page-dots i.cur { background: var(--st-execute); transform: scale(1.25); } + +/* ===== wait 等待节点：外部输入清单 + 催办 ===== */ +.proto-root .jc-wait-list { display: flex; flex-direction: column; gap: 8px; } +.proto-root .jc-wait-item { display: flex; align-items: flex-start; gap: 9px; padding: 9px 11px; background: #fff; border: 1px solid var(--line-soft); border-radius: 10px; transition: border-color var(--t-med), background var(--t-med); } +.proto-root .jc-wait-item.ok { border-color: #bfedb4; background: linear-gradient(180deg, #fff, var(--ok-soft)); animation: rise var(--t-med) both; } +.proto-root .jc-wait-ico { flex: none; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 7px; color: var(--st-wait); background: var(--st-wait-soft); } +.proto-root .jc-wait-item.ok .jc-wait-ico { color: var(--ok-accent); background: #fff; } +.proto-root .jc-wait-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; } +.proto-root .jc-wait-txt strong { font-size: 12.5px; color: var(--ink); } +.proto-root .jc-wait-txt > span { font-size: 12px; color: var(--ink-3); line-height: 1.5; } +.proto-root .jc-wait-txt em { font-style: normal; font-size: 11.5px; line-height: 1.55; margin-top: 3px; } +.proto-root .jc-wait-sla { color: var(--ink-4); display: inline-flex; align-items: center; gap: 4px; } +.proto-root .jc-wait-sla::before { content: ""; width: 6px; height: 6px; border-radius: 999px; background: var(--st-wait); animation: wfpulse 1.4s ease-in-out infinite; } +.proto-root .jc-wait-note { color: var(--ok); background: #fff; border: 1px dashed #bfedb4; border-radius: 7px; padding: 4px 8px; } +.proto-root .jc-nudge { flex: none; display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 10px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink-2); font-size: 11.5px; cursor: pointer; transition: border-color var(--t-fast), color var(--t-fast), background var(--t-fast); } +.proto-root .jc-nudge:hover:not(:disabled) { border-color: var(--warn-accent); color: var(--warn); background: var(--warn-soft); } + +/* ===== collaborate · 案例协同节点（追问补全 → AI 提议 → 人批准 → 确定性执行） ===== */ +/* 能力条：固定在协同节点的标题栏里（随节点卡吸顶，能力全程可调用） */ +.proto-root .jc-case-strip { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; padding: 7px 12px 9px; border-top: 1px dashed var(--line-soft); background: #fff; } +.proto-root .jc-strip-count { flex: none; font-size: 10.5px; font-weight: 700; color: var(--brand-deep); background: var(--brand-wash); border: 1px solid var(--brand-soft); border-radius: 999px; padding: 2px 8px; font-family: var(--mono); } +.proto-root .jc-strip-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 999px; font-size: 11px; font-weight: 600; cursor: pointer; border: 1px solid var(--line); background: #fff; color: var(--ink-2); transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast); } +.proto-root .jc-strip-chip.st-open { border-color: var(--brand-soft); background: var(--brand-wash); color: var(--brand-deep); } +.proto-root .jc-strip-chip.st-open:hover:not(:disabled) { background: var(--brand); border-color: var(--brand); color: #fff; } +.proto-root .jc-strip-chip.st-done { border-color: #bfedb4; background: var(--ok-soft); color: var(--ok); cursor: default; } +.proto-root .jc-strip-chip.st-run { border-color: var(--brand-soft); color: var(--brand); animation: wfpulse 1.2s ease-in-out infinite; cursor: default; } +.proto-root .jc-strip-chip.st-locked { border-style: dashed; color: var(--ink-4); cursor: not-allowed; } +/* 执行回合：确定性结果行 + AI 汇报 */ +.proto-root .jc-run-result { display: flex; align-items: flex-start; gap: 9px; padding: 9px 11px; background: linear-gradient(180deg, #fff, var(--ok-soft)); border: 1px solid #bfedb4; border-radius: 10px; } +.proto-root .jc-run-ico { flex: none; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 8px; background: #fff; border: 1px solid #bfedb4; color: var(--ok-accent); } +.proto-root .jc-run-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; } +.proto-root .jc-run-txt strong { font-size: 12.5px; color: var(--ok); } +.proto-root .jc-run-txt span { font-size: 12px; color: var(--ink-2); line-height: 1.5; } +.proto-root .jc-run-time { flex: none; font-style: normal; font-size: 10.5px; color: var(--ink-4); font-family: var(--mono); margin-top: 2px; } +.proto-root .jc-aisay { margin: 0; font-size: 13px; color: var(--ink); line-height: 1.65; } +.proto-root .jc-run-result + .jc-aisay { margin-top: 8px; } +/* 追问的快捷回答（人类补全信息） */ +.proto-root .jc-opts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; } +.proto-root .jc-opt { padding: 7px 14px; border: 1px solid var(--brand-soft); border-radius: 999px; background: var(--brand-wash); color: var(--brand-deep); font-size: 12.5px; font-weight: 600; cursor: pointer; transition: background var(--t-fast), color var(--t-fast), box-shadow var(--t-fast), transform var(--t-fast); } +.proto-root .jc-opt:hover:not(:disabled) { background: var(--brand); border-color: var(--brand); color: #fff; box-shadow: var(--shadow-brand); transform: translateY(-1px); } +.proto-root .jc-opt:active:not(:disabled) { transform: scale(.97); } +.proto-root .jc-opt:disabled { opacity: .5; cursor: not-allowed; } +.proto-root .jc-opt-hint { margin: 8px 0 0; font-size: 11px; color: var(--ink-4); } +.proto-root .composer-locked svg { color: var(--ink-4); margin-right: 5px; flex: none; } + +/* decision 分支 */ +.proto-root .decision-recommend { display: flex; gap: 6px; font-size: 12px; color: #6428cf; background: var(--st-decision-soft); border: 1px solid #e4d5fd; border-radius: 9px; padding: 8px 10px; margin-bottom: 10px; line-height: 1.5; } +.proto-root .decision-branches { display: flex; flex-direction: column; gap: 8px; } +.proto-root .decision-branch { display: flex; flex-direction: column; gap: 3px; text-align: left; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; cursor: pointer; transition: border-color var(--t-fast), background var(--t-fast), box-shadow var(--t-fast); } +.proto-root .decision-branch:hover:not(.sel) { background: var(--soft); border-color: #c9ced6; } +.proto-root .decision-branch.sel { border-color: var(--st-decision); background: var(--st-decision-soft); box-shadow: 0 0 0 1px var(--st-decision) inset; } +.proto-root .decision-branch strong { font-size: 13px; color: var(--ink); display: flex; align-items: center; gap: 6px; } +.proto-root .decision-branch strong em { font-style: normal; font-size: 10px; font-weight: 600; color: #fff; background: var(--st-decision); border-radius: 999px; padding: 1px 6px; } +.proto-root .decision-branch span { font-size: 12px; color: var(--ink-4); } +.proto-root .decision-discuss { margin-top: 10px; display: flex; flex-direction: column; gap: 10px; border-top: 1px dashed var(--line-soft); padding-top: 10px; } + +/* 人工动作记录(完整人机往返) */ +.proto-root .human-action { display: flex; align-items: flex-start; gap: 8px; margin-top: 2px; padding: 8px 10px; background: #eaf9ff; border: 1px solid #c9edfd; border-radius: 9px; } +.proto-root .human-action.ha-rej { background: var(--danger-soft); border-color: #f9c1be; } +.proto-root .ha-mark { width: 18px; height: 18px; flex: none; border-radius: 999px; display: grid; place-items: center; background: #14c0ff; color: #fff; margin-top: 1px; } +.proto-root .human-action.ha-rej .ha-mark { background: var(--danger-accent); } +.proto-root .ha-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; } +.proto-root .ha-text { font-size: 12.5px; font-weight: 500; color: #0a5f80; } +.proto-root .human-action.ha-rej .ha-text { color: var(--danger); } +.proto-root .hist-kv { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 6px; color: var(--ink-3); font-size: 12px; } + +/* 输入区 */ +.proto-root .copilot-composer { display: flex; flex-direction: column; gap: 8px; padding: 12px 12px 14px; border-top: 1px solid var(--line-soft); flex: none; } +/* 输入框与按钮同一排，按钮高度撑满与输入框等高 */ +.proto-root .composer-row { display: flex; align-items: stretch; gap: 8px; } +.proto-root .composer-row > * { box-sizing: border-box; } +.proto-root .session-composer textarea { flex: 1 1 auto; min-width: 0; height: 52px; resize: none; border: 1px solid var(--line); border-radius: 10px; padding: 10px; font-size: 13px; font-family: inherit; color: var(--ink); background: #fff; transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .session-composer textarea:focus { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 3px rgba(51, 112, 255, .14); } +.proto-root .composer-locked { flex: 1 1 auto; height: 52px; display: flex; align-items: center; justify-content: center; font-size: 12px; color: var(--ink-4); background: var(--soft); border: 1px dashed var(--line); border-radius: 10px; padding: 0 12px; text-align: center; } +.proto-root .composer-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; } +.proto-root .reject-link { align-self: flex-start; background: none; border: 0; color: var(--danger); font-size: 13px; cursor: pointer; padding: 0; } +.proto-root .copilot-send { height: auto; align-self: stretch; flex: none; min-width: 92px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; background: var(--brand); color: #fff; border: 0; border-radius: 10px; padding: 0 18px; font-size: 13px; font-weight: 600; cursor: pointer; transition: background var(--t-fast), box-shadow var(--t-fast), transform var(--t-fast); } +.proto-root .copilot-send:hover:not(:disabled) { background: var(--brand-deep); box-shadow: var(--shadow-brand); } +.proto-root .copilot-send:active:not(:disabled) { transform: scale(.98); } +.proto-root .copilot-send:disabled { opacity: .5; cursor: not-allowed; } + +/* ===== AI 回复富文本(Markdown/HTML/SVG) ===== */ +.proto-root .copilot-bubble .md { font-size: 13px; line-height: 1.6; white-space: normal; text-indent: 0; } +.proto-root .copilot-bubble .md p, .proto-root .copilot-bubble .md li { text-indent: 0; } +.proto-root .copilot-bubble .md > :first-child { margin-top: 0; } +.proto-root .copilot-bubble .md > :last-child { margin-bottom: 0; } +.proto-root .copilot-bubble .md p { margin: 0 0 8px; } +.proto-root .copilot-bubble .md ul { list-style: disc; margin: 0 0 8px; padding-left: 22px; } +.proto-root .copilot-bubble .md ol { list-style: decimal; margin: 0 0 8px; padding-left: 22px; } +.proto-root .copilot-bubble .md li { margin: 3px 0; } +.proto-root .copilot-bubble .md h1, .proto-root .copilot-bubble .md h2, .proto-root .copilot-bubble .md h3, .proto-root .copilot-bubble .md h4 { font-size: 14px; font-weight: 700; margin: 10px 0 6px; line-height: 1.3; } +.proto-root .copilot-bubble .md strong { font-weight: 700; } +.proto-root .copilot-bubble .md a { color: var(--brand); text-decoration: underline; } +.proto-root .copilot-bubble .md code { background: #eceff3; border-radius: 4px; padding: 1px 5px; font-family: var(--mono); font-size: 12px; } +.proto-root .copilot-bubble .md pre { background: var(--ink); color: #e2e5e9; border-radius: 8px; padding: 10px 12px; overflow: auto; margin: 0 0 8px; } +.proto-root .copilot-bubble .md pre code { background: none; padding: 0; color: inherit; font-size: 12px; } +.proto-root .copilot-bubble .md table { border-collapse: collapse; font-size: 12px; margin: 0 0 8px; display: block; overflow-x: auto; } +.proto-root .copilot-bubble .md th, .proto-root .copilot-bubble .md td { border: 1px solid var(--line-soft); padding: 4px 8px; text-align: left; } +.proto-root .copilot-bubble .md th { background: #f1f3f6; } +.proto-root .copilot-bubble .md img, .proto-root .copilot-bubble .md svg { max-width: 100%; height: auto; } + +/* ===== 右上角 DeepSeek 设置弹窗 ===== */ +.proto-root .settings-trigger { position: relative; } +.proto-root .settings-dot { position: absolute; top: 4px; right: 4px; width: 8px; height: 8px; border-radius: 999px; background: var(--danger-accent); box-shadow: 0 0 0 2px #fff; } +.proto-root .settings-overlay { position: fixed; inset: 0; background: rgba(31, 35, 41, .45); display: grid; place-items: center; z-index: 1000; } +.proto-root .settings-modal { width: 440px; max-width: 92vw; background: #fff; border-radius: 16px; padding: 20px; box-shadow: 0 24px 60px rgba(31, 35, 41, .22); animation: rise var(--t-med) both; } +.proto-root .settings-modal-head { display: flex; align-items: center; justify-content: space-between; } +.proto-root .settings-modal-head h3 { margin: 0; font-size: 17px; color: var(--ink); } +.proto-root .settings-hint { margin: 4px 0 16px; font-size: 12px; color: var(--ink-3); } +.proto-root .settings-field { display: block; margin-bottom: 14px; } +.proto-root .settings-field > span { display: block; font-size: 12px; color: var(--ink-2); margin-bottom: 6px; } +.proto-root .settings-field input { width: 100%; box-sizing: border-box; height: 38px; border: 1px solid var(--line); border-radius: 10px; padding: 0 12px; font-size: 14px; color: var(--ink); background: #fff; transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .settings-field input:focus { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 3px rgba(51, 112, 255, .14); } +.proto-root .settings-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 8px; } +.proto-root .settings-actions button { height: 38px; padding: 0 18px; border-radius: 10px; border: 1px solid var(--line); background: #fff; color: var(--ink-2); font-size: 14px; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast); } +.proto-root .settings-actions button:hover { background: var(--soft); } +.proto-root .settings-actions button.primary { background: var(--brand); border-color: var(--brand); color: #fff; } +.proto-root .settings-actions button.primary:hover:not(:disabled) { background: var(--brand-deep); border-color: var(--brand-deep); } +.proto-root .settings-actions button.primary:disabled { opacity: .5; cursor: not-allowed; } + +/* ================================================================== + 审批中心（第四投影：等我放行的事项） + 页面按「四问」竖排：规则是什么(决策条) → 量级多大(关键数字) → 依据够不够 + (要点/明细/偏离条/关联任务/审批链) → 我批不批(签批区)。 + 与消息模块共用 Hero / Section / jc-facts / jc-mcard 等件，只补审批特有的表达。 + ================================================================== */ + +/* ---- 决策条：规则 + 系统自检 + SLA（人只做判断，能算的机器先算完）---- */ +.proto-root .jc-apv-rule { display: flex; align-items: center; gap: 12px; padding: 12px 15px; border: 1px solid var(--brand-soft); border-radius: 13px; background: linear-gradient(118deg, var(--brand-wash), #f7f5ff 60%, #fbfcff); } +.proto-root .jc-apv-rule-ico { flex: none; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; color: #fff; background: linear-gradient(140deg, var(--brand), var(--brand-deep)); box-shadow: 0 4px 10px -3px rgba(51, 112, 255, .55); } +.proto-root .jc-apv-rule-t { flex: 1; min-width: 0; line-height: 1.45; } +.proto-root .jc-apv-rule-t em { display: block; font-style: normal; font-size: 10px; font-weight: 800; letter-spacing: .06em; color: var(--brand-deep); } +.proto-root .jc-apv-rule-t strong { display: block; font-size: 12.5px; font-weight: 700; color: var(--ink); } +.proto-root .jc-apv-check { flex: none; display: inline-flex; align-items: center; gap: 5px; max-width: 46%; font-size: 11px; font-weight: 700; color: var(--ok); background: var(--ok-soft); border: 1px solid #bfedb4; border-radius: 999px; padding: 4px 11px; } +.proto-root .jc-apv-sla { flex: none; display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 800; font-family: var(--mono); border-radius: 999px; padding: 4px 11px; border: 1px solid; } +.proto-root .jc-apv-sla.t-warn { color: var(--danger); background: var(--danger-soft); border-color: #f6c6c3; } +.proto-root .jc-apv-sla.t-brand { color: var(--brand-deep); background: #fff; border-color: var(--brand-soft); } +.proto-root .jc-apv-sla.t-ok { color: var(--ink-3); background: var(--soft); border-color: var(--line-soft); } +/* 越线态：整条转橙，图标换警示 */ +.proto-root .jc-apv-rule.is-over { border-color: #f2d3a3; background: linear-gradient(118deg, var(--warn-soft), #fff9f0 62%, #fffdfa); } +.proto-root .jc-apv-rule.is-over .jc-apv-rule-ico { background: linear-gradient(140deg, #ff8800, #de7802); box-shadow: 0 4px 10px -3px rgba(222, 120, 2, .5); } +.proto-root .jc-apv-rule.is-over .jc-apv-rule-t em { color: var(--warn); } +.proto-root .jc-apv-rule.is-over .jc-apv-check { color: var(--danger); background: var(--danger-soft); border-color: #f6c6c3; } + +/* ---- 关键数字：一眼看清这单在批什么量级 ---- */ +.proto-root .jc-apv-nums { display: grid; grid-template-columns: repeat(auto-fit, minmax(152px, 1fr)); gap: 10px; } +.proto-root .jc-apv-num { display: flex; flex-direction: column; gap: 4px; padding: 11px 13px; border: 1px solid var(--line-soft); border-radius: 12px; background: var(--soft); } +.proto-root .jc-apv-num em { font-style: normal; font-size: 10.5px; color: var(--ink-4); } +.proto-root .jc-apv-num strong { font-size: 17px; font-weight: 800; font-family: var(--mono); letter-spacing: -.02em; color: var(--ink); line-height: 1.1; } +.proto-root .jc-apv-num.t-ok { background: var(--ok-soft); border-color: #d6f0cd; } +.proto-root .jc-apv-num.t-ok strong { color: var(--ok); } +.proto-root .jc-apv-num.t-warn { background: var(--warn-soft); border-color: #f4e0bf; } +.proto-root .jc-apv-num.t-warn strong { color: var(--warn); } + +/* ---- 依据明细表（密排、数字等宽）---- */ +/* 与里程碑数据表（jc-mst-table）同一套排版：密排、整行 nowrap、超宽横滚 */ +.proto-root .jc-atbl-wrap { background: #fff; border: 1px solid var(--line-soft); border-radius: 10px; overflow: auto; } +.proto-root .jc-atbl { width: 100%; border-collapse: collapse; font-size: 12px; background: #fff; } +.proto-root .jc-atbl th { text-align: left; font-size: 10.5px; font-weight: 800; letter-spacing: .03em; color: var(--ink-4); background: var(--soft); padding: 7px 11px; border-bottom: 1px solid var(--line-soft); white-space: nowrap; } +.proto-root .jc-atbl td { padding: 7px 11px; color: var(--ink-2); border-bottom: 1px solid #f1f3f6; white-space: nowrap; transition: background var(--t-fast); } +.proto-root .jc-atbl tbody tr:last-child td { border-bottom: 0; } +.proto-root .jc-atbl tbody tr:hover td { background: var(--brand-wash); } +.proto-root .jc-atbl td:first-child { font-weight: 700; color: var(--ink); font-family: var(--mono); font-size: 11.5px; } +.proto-root .jc-atbl td.num { font-family: var(--mono); font-size: 11.5px; color: var(--ink); } +/* 最后一列允许折行：栏宽变窄时行变高，而不是把内容藏进横滚里 */ +.proto-root .jc-atbl th:last-child, .proto-root .jc-atbl td:last-child { white-space: normal; } + +/* ---- 偏离 / 占用条：满格即触红线 ---- */ +.proto-root .jc-dev { display: flex; flex-direction: column; gap: 9px; padding: 13px 15px; border: 1px solid var(--line-soft); border-radius: 12px; background: var(--soft); } +.proto-root .jc-dev-row { display: grid; grid-template-columns: minmax(96px, 168px) minmax(0, 1fr) 62px; align-items: center; gap: 11px; } +.proto-root .jc-dev-l { font-size: 11.5px; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +.proto-root .jc-dev-track { position: relative; height: 8px; border-radius: 999px; background: #e6eaf1; overflow: hidden; } +.proto-root .jc-dev-track i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--brand), #6f9bff); animation: jcDevGrow .5s cubic-bezier(.3, 0, .2, 1) both; } +.proto-root .jc-dev-row.is-over .jc-dev-track i { background: linear-gradient(90deg, var(--danger-accent), #ff8f6b); } +.proto-root .jc-dev-v { font-family: var(--mono); font-size: 11.5px; font-weight: 800; color: var(--ink-2); text-align: right; } +.proto-root .jc-dev-row.is-over .jc-dev-v { color: var(--danger); } +.proto-root .jc-dev-legend { display: flex; align-items: center; gap: 7px; margin-top: 2px; font-size: 10.5px; color: var(--ink-4); } +.proto-root .jc-dev-legend i { width: 14px; height: 3px; border-radius: 2px; background: var(--danger-accent); } +@keyframes jcDevGrow { from { width: 0 !important; } } + +/* ---- 审批链：谁提的、机器查了什么、我在哪一环 ---- */ +.proto-root .jc-chain { display: flex; flex-direction: column; } +.proto-root .jc-chain-row { position: relative; display: grid; grid-template-columns: 26px minmax(84px, auto) minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 9px 0; } +.proto-root .jc-chain-row::before { content: ""; position: absolute; left: 12px; top: 0; bottom: 0; width: 2px; background: var(--line-soft); } +.proto-root .jc-chain-row:first-child::before { top: 50%; } +.proto-root .jc-chain-row:last-child::before { bottom: 50%; } +.proto-root .jc-chain-node { position: relative; z-index: 1; width: 26px; height: 26px; border-radius: 999px; display: grid; place-items: center; color: #fff; background: var(--ok-accent); box-shadow: 0 0 0 3px #fff; } +.proto-root .jc-chain-who { display: flex; flex-direction: column; line-height: 1.3; } +.proto-root .jc-chain-who b { font-size: 12px; font-weight: 700; color: var(--ink); } +.proto-root .jc-chain-who em { font-style: normal; font-size: 10px; color: var(--ink-4); } +.proto-root .jc-chain-act { font-size: 11.5px; line-height: 1.5; color: var(--ink-3); } +.proto-root .jc-chain-row time { font-size: 10.5px; } +.proto-root .jc-chain-row.is-current { background: linear-gradient(90deg, var(--brand-wash), transparent 76%); border-radius: 10px; } +.proto-root .jc-chain-row.is-current .jc-chain-node { background: var(--brand); animation: wfpulse 1.6s ease-in-out infinite; } +.proto-root .jc-chain-row.is-current .jc-chain-act { color: var(--ink); font-weight: 700; } +.proto-root .jc-chain-row.is-current .jc-chain-who b { color: var(--brand-deep); } +.proto-root .jc-chain-row.is-todo .jc-chain-node { background: #fff; border: 2px dashed var(--line); color: var(--ink-4); } +.proto-root .jc-chain-row.is-todo .jc-chain-who b, .proto-root .jc-chain-row.is-todo .jc-chain-act { color: var(--ink-4); } + +/* ---- 签批区：选项 + 意见 + 三个动作 ---- */ +.proto-root .jc-apv-act { display: flex; flex-direction: column; gap: 11px; padding: 15px 16px; border: 1px solid var(--brand-soft); border-radius: 15px; background: linear-gradient(180deg, var(--brand-wash), #fff 58%); } +.proto-root .jc-apv-act-h { display: flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 800; color: var(--ink); } +.proto-root .jc-apv-act-h svg { color: var(--brand-deep); } +.proto-root .jc-apv-act-h em { font-style: normal; margin-left: auto; font-size: 10.5px; font-weight: 700; color: var(--brand-deep); background: #fff; border: 1px solid var(--brand-soft); border-radius: 999px; padding: 2px 10px; } +.proto-root .jc-opt-wrap { display: flex; flex-direction: column; gap: 7px; } +.proto-root .jc-opt-t { font-style: normal; font-size: 11px; font-weight: 700; color: var(--ink-3); } +.proto-root .jc-opts { display: flex; flex-wrap: wrap; gap: 8px; } +.proto-root .jc-opt { display: inline-flex; align-items: center; gap: 8px; padding: 8px 13px; border: 1px solid var(--line); border-radius: 10px; background: #fff; font: inherit; font-size: 12px; color: var(--ink-2); cursor: pointer; transition: border-color var(--t-fast), background var(--t-fast), color var(--t-fast); } +.proto-root .jc-opt i { flex: none; width: 13px; height: 13px; border-radius: 999px; border: 2px solid var(--line); background: #fff; transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-opt b { font-size: 10px; font-weight: 700; font-family: var(--mono); color: var(--ink-4); background: var(--soft); border-radius: 999px; padding: 1px 7px; } +.proto-root .jc-opt:hover:not(.active) { border-color: var(--brand-soft); background: var(--brand-wash); } +.proto-root .jc-opt.active { border-color: var(--brand); background: var(--brand-wash); color: var(--brand-deep); font-weight: 700; } +.proto-root .jc-opt.active i { border-color: var(--brand); box-shadow: inset 0 0 0 2px #fff, inset 0 0 0 8px var(--brand); } +.proto-root .jc-opt.active b { color: var(--brand-deep); background: #fff; } +.proto-root .jc-apv-btns { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; } +.proto-root .jc-btn-danger { color: var(--danger); border-color: #f6c6c3; background: #fff; } +.proto-root .jc-btn-danger:hover { background: var(--danger-soft); border-color: var(--danger-accent); } +.proto-root .jc-apv-hint { display: inline-flex; align-items: center; gap: 5px; margin-left: auto; font-size: 10.5px; color: var(--ink-4); } + +/* ---- 签批结论卡（已处理 / 本次签批后）---- */ +.proto-root .jc-apv-res { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border: 1px solid; border-radius: 15px; animation: rise var(--t-med) both; } +.proto-root .jc-apv-res.t-ok { background: linear-gradient(180deg, var(--ok-soft), #fff 62%); border-color: #bfedb4; } +.proto-root .jc-apv-res.t-danger { background: linear-gradient(180deg, var(--danger-soft), #fff 62%); border-color: #f6c6c3; } +.proto-root .jc-apv-res-ico { flex: none; width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; color: #fff; } +.proto-root .jc-apv-res.t-ok .jc-apv-res-ico { background: linear-gradient(140deg, var(--ok-accent), var(--ok)); box-shadow: 0 4px 10px -3px rgba(39, 135, 23, .5); } +.proto-root .jc-apv-res.t-danger .jc-apv-res-ico { background: linear-gradient(140deg, var(--danger-accent), var(--danger)); box-shadow: 0 4px 10px -3px rgba(216, 57, 49, .45); } +.proto-root .jc-apv-res-txt { flex: 1; min-width: 0; } +.proto-root .jc-apv-res-txt strong { display: block; font-size: 12.5px; font-weight: 800; color: var(--ink); } +.proto-root .jc-apv-res-txt p { margin: 5px 0 0; font-size: 12.5px; line-height: 1.7; color: var(--ink-2); } +.proto-root .jc-apv-res-eff { display: inline-flex; align-items: center; gap: 5px; margin-top: 7px; font-size: 11px; color: var(--ink-3); } + +/* ---- 左清单：审批卡 ---- + 卡上只有元信息：类型 / 主题 / 谁提交 / 提交时间 / 剩余时间。 + 业务数字（金额、偏离、敞口…）一律留给中栏，卡里不放、也就不会显示不全。 + 四行严格对齐（同任务卡节奏）：① 类型 + 状态章 ② 主题 ③ 谁提交 + 提交时间 ④ 时限细条。 + 卡内只有一个胶囊（状态），其余靠字重/字号/一条 3px 细条分层——不再堆小方块 */ +.proto-root .jc-acard .jc-mcard-body { gap: 6px; } +.proto-root .jc-acard .jc-acard-from { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--ink-3); } +.proto-root .jc-acard .jc-acard-from b { font-weight: 700; color: var(--ink-2); } +.proto-root .jc-acard .jc-acard-from > span { font-size: 10px; font-weight: 700; font-family: var(--mono); color: var(--ink-4); } +.proto-root .jc-acard .jc-acard-from time { margin-left: auto; font-size: 10px; white-space: nowrap; } +/* 时限：3px 细条 + 右侧小字，占位与任务卡的进度条同一位置 */ +.proto-root .jc-acard .jc-acard-sla { display: flex; align-items: center; gap: 9px; } +.proto-root .jc-acard .jc-acard-sla i { flex: 1; min-width: 0; height: 3px; border-radius: 3px; background: #e6eaf1; overflow: hidden; } +.proto-root .jc-acard .jc-acard-sla i b { display: block; height: 100%; border-radius: 3px; background: var(--brand); transition: width var(--t-med); } +.proto-root .jc-acard .jc-acard-sla em { flex: none; font-style: normal; font-size: 10px; font-weight: 700; font-family: var(--mono); letter-spacing: -.01em; color: var(--ink-4); white-space: nowrap; } +.proto-root .jc-acard .jc-acard-sla.t-warn i b { background: var(--danger-accent); } +.proto-root .jc-acard .jc-acard-sla.t-warn em { color: var(--danger); } +.proto-root .jc-acard .jc-acard-sla.t-brand em { color: var(--brand-deep); } +.proto-root .jc-acard .jc-acard-sla.is-done i b { background: #c9ced6; } +/* 加急：卡片左缘红条（不再另立「急」徽标） */ +.proto-root .jc-acard.is-urgent { position: relative; } +.proto-root .jc-acard.is-urgent::before { content: ""; position: absolute; left: -1px; top: 12px; bottom: 12px; width: 3px; border-radius: 3px; background: var(--danger-accent); } +.proto-root .jc-urg { flex: none; display: inline-flex; align-items: center; gap: 3px; font-size: 9.5px; font-weight: 800; color: var(--danger); background: var(--danger-soft); border-radius: 5px; padding: 1px 5px; } +.proto-root .jc-apv-self { font-style: normal; font-size: 9.5px; font-weight: 800; color: var(--brand-deep); background: #fff; border: 1px solid var(--brand-soft); border-radius: 5px; padding: 1px 6px; } + +/* 窄屏：决策条折两行（图标+规则一行，自检与 SLA 落第二行） */ +@media (max-width: 1440px) { + .proto-root .jc-apv-rule { flex-wrap: wrap; } + .proto-root .jc-apv-rule-t { flex: 1 1 200px; } + .proto-root .jc-apv-check { max-width: none; } + .proto-root .jc-apv-sla { margin-left: auto; } +} + +/* ===== 动效可及性：用户偏好减弱动效时全部静止 ===== */ +@media (prefers-reduced-motion: reduce) { + .proto-root *, .proto-root *::before, .proto-root *::after { + animation-duration: .01ms !important; + animation-iteration-count: 1 !important; + transition-duration: .01ms !important; + } +} + +/* ══════════════════════════════════════════════════════════════════════════════ + 规范 V2.15 重建：任务对话流（四卡）+ 任务视图区 + 全部用令牌，不写死 hex；动效走 --t-fast/--t-med 并随 prefers-reduced-motion 降级。 + ══════════════════════════════════════════════════════════════════════════════ */ + +.proto-root .jc-tch { display: flex; flex-direction: column; height: 100%; min-height: 0; } +.proto-root .jc-tch-head { + flex: 0 0 auto; padding: 11px 14px; border-bottom: 1px solid var(--line); + background: var(--brand-wash); display: flex; align-items: center; gap: 8px; +} +.proto-root .jc-tch-name { flex: none; font-size: 13.5px; font-weight: 800; color: var(--ink); } +.proto-root .jc-tch-desc { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: right; font-size: 10.5px; color: var(--ink-4); } +.proto-root .jc-tch-id { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } +.proto-root .jc-tch-id b { font-size: 14px; color: var(--ink); } +.proto-root .jc-tch-meta { display: flex; align-items: center; gap: 10px; font-size: 11.5px; color: var(--ink-3); } +.proto-root .jc-tch-meta span { display: inline-flex; align-items: center; gap: 4px; } +.proto-root .jc-tch-bar { flex: 1; height: 3px; border-radius: 2px; background: var(--line); overflow: hidden; } +.proto-root .jc-tch-bar > i { display: block; height: 100%; background: var(--brand); transition: width var(--t-med); } +.proto-root .jc-tch-reset { border: 0; background: none; color: var(--ink-3); cursor: pointer; padding: 2px; border-radius: 5px; } +.proto-root .jc-tch-reset:hover { background: var(--brand-soft); color: var(--brand); } +.proto-root .jc-tch-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 12px; } +.proto-root .jc-tch-scroll > * { flex: 0 0 auto; } + +.proto-root .jc-para { font-size: 10.5px; padding: 1px 7px; border-radius: 999px; font-weight: 600; } +.proto-root .jc-para-loop { background: var(--st-collab-soft); color: var(--st-collab); } +.proto-root .jc-para-flow { background: var(--st-auto-soft); color: var(--st-auto); } +.proto-root .jc-mono { font-family: var(--mono); font-size: 11px; color: var(--ink-3); } + +/* 机器推进 */ +.proto-root .jc-turn { display: flex; gap: 9px; align-items: flex-start; } +.proto-root .jc-bub { flex: 1; min-width: 0; background: #fff; border: 1px solid var(--cardline); border-radius: 10px; padding: 11px 12px; box-shadow: var(--card-shadow); } +.proto-root .jc-bub-h { display: flex; align-items: center; gap: 6px; font-size: 13px; margin-bottom: 7px; color: var(--ink); } +.proto-root .jc-pulse { font-size: 11px; color: var(--brand); animation: jcBlink 1.1s ease-in-out infinite; } +@keyframes jcBlink { 0%,100% { opacity: 1 } 50% { opacity: .35 } } +.proto-root .jc-content { font-size: 12.8px; line-height: 1.75; color: var(--ink); } +.proto-root .jc-dim { color: var(--ink-3); font-size: 12px; line-height: 1.7; } +.proto-root .jc-think { margin: 0; padding-left: 18px; font-size: 12px; line-height: 1.75; color: var(--ink-2); } +.proto-root .jc-think li { margin-bottom: 5px; } +.proto-root .jc-tools { list-style: none; margin: 0; padding: 0; font-size: 11.5px; } +.proto-root .jc-tools li { display: flex; align-items: center; gap: 6px; padding: 4px 0; border-bottom: 1px dashed var(--line-soft); } +.proto-root .jc-tools li:last-child { border-bottom: 0; } +.proto-root .jc-eff { font-size: 10px; padding: 0 5px; border-radius: 3px; font-weight: 700; flex: 0 0 auto; } +.proto-root .jc-eff-r { background: var(--ok-soft); color: var(--ok); } +.proto-root .jc-eff-w { background: var(--warn-soft); color: var(--warn-accent); } + +.proto-root .jc-fold { margin: 5px 0; } +.proto-root .jc-fold > button { width: 100%; display: flex; align-items: center; gap: 5px; background: var(--soft); border: 0; border-radius: 6px; padding: 5px 8px; font-size: 11.5px; color: var(--ink-2); cursor: pointer; } +.proto-root .jc-fold > button:hover { background: var(--brand-soft); color: var(--brand); } +.proto-root .jc-fold.open > button svg:last-child { transform: rotate(180deg); } +.proto-root .jc-fold-b { padding: 8px 4px 2px; } + +/* 事件条 · 监听 */ +.proto-root .jc-evt { display: flex; gap: 8px; align-items: flex-start; background: var(--soft); border-left: 3px solid var(--ink-4); border-radius: 6px; padding: 8px 10px; font-size: 12px; } +.proto-root .jc-evt b { color: var(--ink); } +.proto-root .jc-evt p { margin: 3px 0 0; color: var(--ink-3); line-height: 1.65; } +.proto-root .jc-evt-k { flex: 0 0 auto; font-size: 10.5px; font-weight: 700; padding: 1px 6px; border-radius: 3px; background: var(--brand-soft); color: var(--brand); } +.proto-root .jc-evt-数据 { background: var(--ok-soft); color: var(--ok); } +.proto-root .jc-evt-时间 { background: var(--warn-soft); color: var(--warn-accent); } +.proto-root .jc-evt-控制 { background: var(--danger-soft); color: var(--danger); } + +.proto-root .jc-listen { border: 1px solid var(--st-wait-soft); background: var(--st-wait-soft); border-radius: 10px; padding: 11px 12px; } +.proto-root .jc-listen-h { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink); } +.proto-root .jc-listen-spec { display: flex; flex-direction: column; gap: 3px; margin: 8px 0; font-size: 11.5px; color: var(--ink-3); } +.proto-root .jc-listen-spec i { display: inline-block; min-width: 84px; font-style: normal; color: var(--ink-4); } +.proto-root .jc-listen-items { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; } +.proto-root .jc-listen-items li { display: flex; gap: 7px; align-items: flex-start; background: #fff; border-radius: 7px; padding: 8px 9px; font-size: 12px; } +.proto-root .jc-listen-items p { margin: 2px 0 0; color: var(--ink-3); line-height: 1.6; } +.proto-root .jc-listen-items .jc-arrive { color: var(--ok); } + +/* 人类工具四卡 */ +.proto-root .jc-cardb { padding: 0; overflow: hidden; } +.proto-root .jc-card-h { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--line-soft); flex-wrap: wrap; } +.proto-root .jc-card-h b { font-size: 13px; flex: 1; min-width: 0; } +.proto-root .jc-card-tool { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; } +.proto-root .jc-card-decision .jc-card-tool { background: var(--st-decision-soft); color: var(--st-decision); } +.proto-root .jc-card-execute .jc-card-tool { background: var(--st-execute-soft); color: var(--st-execute); } +.proto-root .jc-card-wait .jc-card-tool { background: var(--st-wait-soft); color: var(--st-wait); } +.proto-root .jc-card-release .jc-card-tool { background: var(--brand-soft); color: var(--brand); } +.proto-root .jc-card-to { font-size: 11px; color: var(--ink-3); display: inline-flex; align-items: center; gap: 4px; } +.proto-root .jc-cardb.cross { border-style: dashed; } + +.proto-root .jc-basis { display: flex; flex-wrap: wrap; gap: 6px 14px; padding: 9px 12px; background: var(--soft); font-size: 11.5px; } +.proto-root .jc-basis > i { font-style: normal; color: var(--ink-4); font-weight: 600; width: 100%; } +.proto-root .jc-basis span { color: var(--ink); } +.proto-root .jc-basis em { font-style: normal; color: var(--ink-4); margin-right: 5px; } + +.proto-root .jc-card-b { padding: 11px 12px; display: flex; flex-direction: column; gap: 10px; } +.proto-root .jc-cross, .proto-root .jc-replied { display: flex; gap: 8px; align-items: flex-start; padding: 11px 12px; font-size: 12px; color: var(--ink-2); line-height: 1.7; } +.proto-root .jc-replied { color: var(--ok); } +.proto-root .jc-replied span { display: block; color: var(--ink-3); } + +.proto-root .jc-ask { font-size: 13px; color: var(--ink); margin: 0; } +.proto-root .jc-rec { display: flex; gap: 6px; align-items: flex-start; background: var(--brand-wash); border-radius: 7px; padding: 8px 10px; font-size: 12px; color: var(--brand-deep); } +.proto-root .jc-branches { display: flex; flex-direction: column; gap: 7px; } +.proto-root .jc-branch { text-align: left; border: 1px solid var(--cardline); border-radius: 8px; padding: 9px 11px; background: #fff; cursor: pointer; transition: all var(--t-fast); } +.proto-root .jc-branch:hover { border-color: var(--brand); background: var(--brand-wash); } +.proto-root .jc-branch.rec { border-color: var(--brand); } +.proto-root .jc-branch b { display: flex; align-items: center; gap: 7px; font-size: 12.5px; } +.proto-root .jc-branch em { font-style: normal; font-size: 10px; background: var(--brand-soft); color: var(--brand); padding: 1px 6px; border-radius: 999px; } +.proto-root .jc-branch p { margin: 4px 0 0; font-size: 11.5px; color: var(--ink-3); line-height: 1.6; } +.proto-root .jc-conseq { color: var(--warn-accent) !important; display: flex; align-items: center; gap: 4px; } + +.proto-root .jc-need, .proto-root .jc-guide { background: var(--soft); border-radius: 7px; padding: 9px 11px; font-size: 12px; } +.proto-root .jc-need p, .proto-root .jc-guide p { margin: 0 0 5px; line-height: 1.7; color: var(--ink-2); } +.proto-root .jc-need p:last-child, .proto-root .jc-guide p:last-child { margin-bottom: 0; } +.proto-root .jc-need i, .proto-root .jc-guide i { font-style: normal; color: var(--ink-4); margin-right: 7px; font-weight: 600; } + +.proto-root .jc-fields { display: flex; flex-direction: column; gap: 9px; } +.proto-root .jc-field { display: flex; flex-direction: column; gap: 4px; font-size: 12px; } +.proto-root .jc-field > span { color: var(--ink-2); font-weight: 600; } +.proto-root .jc-field input, .proto-root .jc-field textarea, .proto-root .jc-note { + border: 1px solid var(--cardline); border-radius: 7px; padding: 7px 9px; font: inherit; font-size: 12px; color: var(--ink); background: #fff; +} +.proto-root .jc-field input:focus, .proto-root .jc-field textarea:focus, .proto-root .jc-note:focus { outline: 2px solid var(--brand-soft); border-color: var(--brand); } +.proto-root .jc-note { width: 100%; min-height: 54px; resize: vertical; } +.proto-root .jc-radios { display: flex; flex-wrap: wrap; gap: 6px; } +.proto-root .jc-radio { border: 1px solid var(--cardline); background: #fff; border-radius: 999px; padding: 5px 11px; font-size: 11.5px; cursor: pointer; transition: all var(--t-fast); } +.proto-root .jc-radio:hover { border-color: var(--brand); } +.proto-root .jc-radio.on { background: var(--brand); color: #fff; border-color: var(--brand); } +.proto-root .jc-radio.neg.on { background: var(--warn-accent); border-color: var(--warn-accent); } + +.proto-root .jc-page { border: 1px solid var(--line-soft); border-radius: 8px; padding: 10px 11px; } +.proto-root .jc-page-h { display: flex; justify-content: space-between; align-items: center; margin-bottom: 5px; font-size: 12.5px; } +.proto-root .jc-page-nav { display: flex; gap: 7px; justify-content: flex-end; } + +.proto-root .jc-deliv, .proto-root .jc-crit, .proto-root .jc-acts { font-size: 12px; } +.proto-root .jc-deliv > i, .proto-root .jc-crit > i, .proto-root .jc-acts > i { font-style: normal; color: var(--ink-4); font-weight: 600; display: block; margin-bottom: 5px; } +.proto-root .jc-deliv ul, .proto-root .jc-crit ul, .proto-root .jc-acts ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 5px; } +.proto-root .jc-deliv li { background: var(--soft); border-radius: 6px; padding: 7px 9px; } +.proto-root .jc-deliv li b { display: block; } +.proto-root .jc-deliv li span { color: var(--ink-3); font-size: 11.5px; } +.proto-root .jc-crit li { display: flex; align-items: center; gap: 7px; padding: 4px 0; } +.proto-root .jc-crit li.ok { color: var(--ok); } +.proto-root .jc-crit li.no { color: var(--danger); } +.proto-root .jc-lv { font-family: var(--mono); font-size: 10px; background: var(--ink-4); color: #fff; padding: 1px 5px; border-radius: 3px; } +.proto-root .jc-acts li { display: flex; align-items: center; gap: 6px; background: var(--warn-soft); border-radius: 6px; padding: 6px 9px; } + +.proto-root .jc-rel-btns { display: flex; gap: 7px; flex-wrap: wrap; } +.proto-root .jc-rel-hint { font-size: 11px; margin: 0; } +.proto-root .jc-btn { display: inline-flex; align-items: center; gap: 5px; border: 0; border-radius: 7px; padding: 7px 13px; font-size: 12px; font-weight: 600; background: var(--brand); color: #fff; cursor: pointer; transition: background var(--t-fast); } +.proto-root .jc-btn:hover:not(:disabled) { background: var(--brand-deep); } +.proto-root .jc-btn:disabled { opacity: .45; cursor: not-allowed; } +.proto-root .jc-btn-ghost { background: var(--soft); color: var(--ink-2); } +.proto-root .jc-btn-ghost:hover:not(:disabled) { background: var(--brand-soft); color: var(--brand); } +.proto-root .jc-btn-ok { background: var(--ok); } +.proto-root .jc-btn-warn { background: var(--warn-accent); } +.proto-root .jc-btn-bad { background: var(--danger); } + +.proto-root .jc-term { display: flex; gap: 10px; align-items: flex-start; border-radius: 10px; padding: 12px 13px; font-size: 12.5px; } +.proto-root .jc-term-ok { background: var(--ok-soft); color: var(--ok); } +.proto-root .jc-term-bad { background: var(--danger-soft); color: var(--danger); } +.proto-root .jc-term p { margin: 4px 0 0; color: var(--ink-2); line-height: 1.7; } + +/* ── 视图区 ── */ +.proto-root .jc-vr { height: 100%; overflow-y: auto; padding: 18px 20px 28px; background: #fff; border-radius: 12px; } +.proto-root .jc-vr > * { flex: 0 0 auto; } +.proto-root .jc-vr-head { display: flex; gap: 12px; align-items: flex-start; padding-bottom: 14px; border-bottom: 1px solid var(--line-soft); } +.proto-root .jc-vr-ico { width: 42px; height: 42px; border-radius: 11px; display: grid; place-items: center; color: #fff; background: var(--ai-grad); flex: 0 0 auto; } +.proto-root .jc-vr-h { flex: 1; min-width: 0; } +.proto-root .jc-vr-kick { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 11px; color: var(--ink-3); margin-bottom: 3px; } +.proto-root .jc-vr-h h2 { margin: 0 0 4px; font-size: 17px; color: var(--ink); } +.proto-root .jc-vr-h p { margin: 0; font-size: 12.5px; color: var(--ink-3); line-height: 1.7; } +.proto-root .jc-vr-sign { display: flex; align-items: center; gap: 8px; padding: 9px 0; font-size: 11.5px; color: var(--ink-3); } +.proto-root .jc-sign-ai, .proto-root .jc-sign-me { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 999px; } +.proto-root .jc-sign-ai { background: var(--brand-soft); color: var(--brand); } +.proto-root .jc-sign-me { background: var(--accent-soft); color: var(--accent); } +.proto-root .jc-vr-body { display: flex; flex-direction: column; gap: 18px; padding-top: 4px; } +.proto-root .jc-sec { display: flex; flex-direction: column; gap: 9px; } +.proto-root .jc-sec > h3 { margin: 0; font-size: 13px; color: var(--ink); } + +.proto-root .jc-pulse-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--brand); display: inline-block; animation: jcBlink 1.1s ease-in-out infinite; } +.proto-root .jc-pending { display: flex; flex-direction: column; align-items: center; gap: 9px; padding: 46px 20px; text-align: center; } +.proto-root .jc-pending-ring { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; color: var(--brand); border: 2px dashed var(--brand); animation: jcSpin 2.4s linear infinite; } +@keyframes jcSpin { to { transform: rotate(360deg) } } +.proto-root .jc-pending b { font-size: 14px; color: var(--ink); } +.proto-root .jc-pending p { margin: 0; font-size: 12px; color: var(--ink-3); max-width: 460px; line-height: 1.7; } +.proto-root .jc-skel { display: flex; flex-direction: column; gap: 7px; width: 100%; max-width: 460px; margin-top: 8px; } +.proto-root .jc-skel > i { height: 9px; border-radius: 5px; background: linear-gradient(90deg, var(--soft), var(--line), var(--soft)); background-size: 200% 100%; animation: jcShim 1.4s ease-in-out infinite; } +.proto-root .jc-skel > i:nth-child(2) { width: 82% } .proto-root .jc-skel > i:nth-child(3) { width: 60% } +@keyframes jcShim { 0% { background-position: 200% 0 } 100% { background-position: -200% 0 } } + +.proto-root .jc-callout { display: flex; gap: 8px; align-items: flex-start; border-radius: 9px; padding: 11px 13px; font-size: 12.5px; line-height: 1.75; } +.proto-root .jc-callout p { margin: 0; } +.proto-root .jc-callout.t-ok { background: var(--ok-soft); color: var(--ok) } +.proto-root .jc-callout.t-warn { background: var(--warn-soft); color: var(--warn-accent) } +.proto-root .jc-callout.t-bad { background: var(--danger-soft); color: var(--danger) } +.proto-root .jc-callout.t-brand { background: var(--brand-wash); color: var(--brand-deep) } +.proto-root .jc-callout.t-mute { background: var(--soft); color: var(--ink-2) } + +.proto-root .jc-kv { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px; } +.proto-root .jc-kv-i { background: var(--soft); border-radius: 8px; padding: 9px 11px; } +.proto-root .jc-kv-i i { display: block; font-style: normal; font-size: 11px; color: var(--ink-4); margin-bottom: 3px; } +.proto-root .jc-kv-i b { font-size: 13px; color: var(--ink); } +.proto-root .jc-kv-i.ph b { color: var(--ink-4); font-style: italic; font-weight: 400; border-bottom: 1px dashed var(--ink-4); } +.proto-root .jc-kv-i.live { background: var(--brand-wash); } +.proto-root .jc-kv-i.live b { color: var(--brand-deep); } + +.proto-root .jc-badges { display: flex; flex-wrap: wrap; gap: 7px; } +.proto-root .jc-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; padding: 4px 10px; border-radius: 999px; background: var(--soft); color: var(--ink-4); } +.proto-root .jc-badge.on { background: var(--ok-soft); color: var(--ok); } + +.proto-root .jc-tbl-wrap { overflow-x: auto; border: 1px solid var(--line-soft); border-radius: 9px; } +.proto-root .jc-tbl { width: 100%; border-collapse: collapse; font-size: 12px; } +.proto-root .jc-tbl th { background: var(--soft); text-align: left; padding: 8px 10px; font-weight: 600; color: var(--ink-2); white-space: nowrap; } +.proto-root .jc-tbl td { padding: 7px 10px; border-top: 1px solid var(--line-soft); color: var(--ink); } +.proto-root .jc-tbl input { width: 100%; border: 1px solid var(--brand); border-radius: 5px; padding: 3px 6px; font: inherit; font-size: 12px; } +.proto-root .jc-tbl-bar { display: flex; gap: 7px; align-items: center; justify-content: flex-end; } + +.proto-root .jc-bars { display: flex; flex-direction: column; gap: 7px; } +.proto-root .jc-bar-row { display: grid; grid-template-columns: 92px 1fr 120px; gap: 9px; align-items: center; font-size: 11.5px; } +.proto-root .jc-bar-l { color: var(--ink-3); } +.proto-root .jc-bar-t { position: relative; height: 14px; background: var(--soft); border-radius: 7px; overflow: hidden; } +.proto-root .jc-bar-t > i { display: block; height: 100%; border-radius: 7px; transition: width var(--t-med); } +.proto-root .jc-bar-t > i.t-ok { background: var(--ok) } .proto-root .jc-bar-t > i.t-warn { background: var(--warn-accent) } +.proto-root .jc-bar-t > i.t-bad { background: var(--danger) } .proto-root .jc-bar-t > i.t-brand { background: var(--brand) } +.proto-root .jc-bar-t > i.t-mute { background: var(--ink-4) } +.proto-root .jc-redline { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--danger); } +.proto-root .jc-bar-v { color: var(--ink-2); } + +.proto-root .jc-donut { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; } +.proto-root .jc-donut-bg { fill: none; stroke: var(--soft); stroke-width: 16; } +.proto-root .jc-donut-seg { fill: none; stroke-width: 16; transform: rotate(-90deg); transform-origin: 70px 70px; transition: stroke-dasharray var(--t-med); } +.proto-root .jc-donut-seg.t-ok { stroke: var(--ok) } .proto-root .jc-donut-seg.t-warn { stroke: var(--warn-accent) } +.proto-root .jc-donut-seg.t-bad { stroke: var(--danger) } .proto-root .jc-donut-seg.t-brand { stroke: var(--brand) } +.proto-root .jc-donut-seg.t-mute { stroke: var(--ink-4) } +.proto-root .jc-donut-n { text-anchor: middle; font-size: 22px; font-weight: 700; fill: var(--ink); font-family: var(--mono); } +.proto-root .jc-donut-u { text-anchor: middle; font-size: 10px; fill: var(--ink-4); } +.proto-root .jc-donut-lg { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: 12px; } +.proto-root .jc-donut-lg li { display: flex; align-items: center; gap: 7px; } +.proto-root .jc-donut-lg em { width: 9px; height: 9px; border-radius: 3px; } +.proto-root .jc-donut-lg em.t-ok { background: var(--ok) } .proto-root .jc-donut-lg em.t-warn { background: var(--warn-accent) } +.proto-root .jc-donut-lg em.t-bad { background: var(--danger) } .proto-root .jc-donut-lg em.t-brand { background: var(--brand) } +.proto-root .jc-donut-lg em.t-mute { background: var(--ink-4) } + +.proto-root .jc-rcards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 11px; } +.proto-root .jc-rcard { border: 1px solid var(--cardline); border-radius: 10px; padding: 12px; background: #fff; box-shadow: var(--card-shadow); } +.proto-root .jc-rcard-h { display: flex; justify-content: space-between; align-items: center; gap: 7px; margin-bottom: 7px; } +.proto-root .jc-rcard-tag { display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: var(--soft); color: var(--ink-2); } +.proto-root .jc-rcard.t-ok .jc-rcard-tag { background: var(--ok-soft); color: var(--ok) } +.proto-root .jc-rcard.t-warn .jc-rcard-tag { background: var(--warn-soft); color: var(--warn-accent) } +.proto-root .jc-rcard-t { font-size: 13px; display: block; } +.proto-root .jc-swap { display: flex; align-items: center; gap: 6px; font-size: 12px; flex-wrap: wrap; } +.proto-root .jc-swap s { color: var(--ink-4) } .proto-root .jc-swap b { color: var(--ink) } +.proto-root .jc-swap em { font-style: normal; font-size: 10px; background: var(--warn-soft); color: var(--warn-accent); padding: 1px 6px; border-radius: 999px; } +.proto-root .jc-rcard-big { margin: 9px 0; } +.proto-root .jc-rcard-big b { font-size: 24px; font-family: var(--mono); color: var(--ink); } +.proto-root .jc-rcard-big span { display: block; font-size: 10.5px; color: var(--ink-4); } +.proto-root .jc-rcard-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; font-size: 11px; } +.proto-root .jc-rcard-meta i { font-style: normal; color: var(--ink-4); margin-right: 5px; } +.proto-root .jc-rcard-note { margin: 8px 0 0; font-size: 11.5px; color: var(--ink-3); line-height: 1.6; } +.proto-root .jc-rcard-sign { margin-top: 9px; padding-top: 7px; border-top: 1px dashed var(--line-soft); display: flex; justify-content: space-between; font-size: 11px; color: var(--ink-4); } + +.proto-root .jc-waitbar { display: flex; gap: 10px; align-items: flex-start; background: var(--soft); border-radius: 9px; padding: 14px; } +.proto-root .jc-waitbar b { font-size: 13px; } .proto-root .jc-waitbar p { margin: 3px 0 0; font-size: 11.5px; color: var(--ink-3); } + +.proto-root .jc-files { display: flex; flex-direction: column; gap: 7px; } +.proto-root .jc-file { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; border: 1px solid var(--cardline); background: #fff; border-radius: 9px; padding: 10px 12px; cursor: pointer; transition: all var(--t-fast); } +.proto-root .jc-file:hover { border-color: var(--brand); background: var(--brand-wash); } +.proto-root .jc-file > div { flex: 1; min-width: 0; } +.proto-root .jc-file b { display: block; font-size: 12.5px; } .proto-root .jc-file span { font-size: 11px; color: var(--ink-3); } + +.proto-root .jc-letter { border: 1px solid var(--cardline); border-radius: 10px; padding: 13px; background: #fff; } +.proto-root .jc-letter.in { border-left: 3px solid var(--accent); } +.proto-root .jc-letter.out { border-left: 3px solid var(--brand); } +.proto-root .jc-letter-h { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; margin-bottom: 9px; } +.proto-root .jc-letter-dir { display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: var(--soft); color: var(--ink-2); } +.proto-root .jc-letter-meta { display: flex; flex-direction: column; gap: 3px; font-size: 11.5px; color: var(--ink-2); margin-bottom: 9px; } +.proto-root .jc-letter-meta p { margin: 0; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; } +.proto-root .jc-letter-meta i { font-style: normal; color: var(--ink-4); min-width: 44px; } +.proto-root .jc-letter-meta input { flex: 1; min-width: 180px; border: 1px solid var(--cardline); border-radius: 5px; padding: 3px 7px; font: inherit; font-size: 11.5px; } +.proto-root .jc-letter-sub { display: block; width: 100%; margin: 0 0 8px; font-size: 13.5px; font-weight: 600; color: var(--ink); } +.proto-root input.jc-letter-sub { border: 1px solid var(--brand); border-radius: 6px; padding: 5px 8px; } +.proto-root .jc-letter-body { margin: 0; font-size: 12.5px; line-height: 1.85; color: var(--ink-2); white-space: pre-wrap; } +.proto-root textarea.jc-letter-body { width: 100%; border: 1px solid var(--brand); border-radius: 7px; padding: 8px 10px; font: inherit; font-size: 12.5px; resize: vertical; } +.proto-root .jc-atts { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; } +.proto-root .jc-att { display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--cardline); background: var(--soft); border-radius: 7px; padding: 5px 9px; font-size: 11.5px; cursor: pointer; } +.proto-root .jc-att:hover:not(:disabled) { border-color: var(--brand); background: var(--brand-wash); } +.proto-root .jc-att b { font-weight: 600 } .proto-root .jc-att span { color: var(--ink-4) } + +.proto-root .jc-chip { font-size: 10.5px; padding: 2px 8px; border-radius: 999px; background: var(--soft); color: var(--ink-2); } +.proto-root .jc-chip.ok { background: var(--ok-soft); color: var(--ok) } +.proto-root .jc-chip.warn { background: var(--warn-soft); color: var(--warn-accent) } +.proto-root .jc-chip.bad { background: var(--danger-soft); color: var(--danger) } +.proto-root .jc-chip.wait { background: var(--st-wait-soft); color: var(--st-wait) } +.proto-root .jc-chip.live { background: var(--brand-soft); color: var(--brand) } +.proto-root .jc-list-empty { display: flex; align-items: center; justify-content: center; gap: 7px; padding: 30px; color: var(--ink-4); font-size: 12px; } + +@media (prefers-reduced-motion: reduce) { + .proto-root .jc-pulse, .proto-root .jc-pulse-dot, .proto-root .jc-pending-ring, .proto-root .jc-skel > i { animation: none; } +} + +/* 对话流自由输入（规范 06 人事件）—— 对话流是一切回环输入的唯一入口 */ +.proto-root .jc-composer { + flex: 0 0 auto; display: flex; gap: 8px; align-items: flex-end; + padding: 10px 12px; border-top: 1px solid var(--line); background: #fff; +} +.proto-root .jc-composer textarea { + flex: 1; min-width: 0; resize: none; border: 1px solid var(--cardline); border-radius: 9px; + padding: 8px 10px; font: inherit; font-size: 12.5px; line-height: 1.6; color: var(--ink); background: #fff; +} +.proto-root .jc-composer textarea:focus { outline: 2px solid var(--brand-soft); border-color: var(--brand); } +.proto-root .jc-composer textarea:disabled { background: var(--soft); color: var(--ink-4); } +.proto-root .jc-turn-me { flex-direction: row; justify-content: flex-end; } +.proto-root .jc-bub-me { background: var(--brand-wash); border-color: var(--brand-soft); } +.proto-root .jc-note-turn { display: flex; flex-direction: column; gap: 9px; } +.proto-root .jc-note-hint { + display: flex; align-items: center; gap: 5px; margin: 0; padding-left: 4px; + font-size: 11px; color: var(--ink-4); line-height: 1.6; +} + +/* ── 主动干预：叫停（控制事件）—— 有仪式感，对比自由留言的零摩擦 ── */ +.proto-root .jc-halt-btn { + display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--danger-soft); + background: #fff; color: var(--danger); border-radius: 6px; padding: 3px 9px; + font-size: 11px; font-weight: 600; cursor: pointer; transition: all var(--t-fast); +} +.proto-root .jc-halt-btn:hover { background: var(--danger-soft); } +.proto-root .jc-halt-ask { + margin-top: 9px; padding: 11px; border-radius: 9px; + background: var(--danger-soft); display: flex; flex-direction: column; gap: 9px; +} +.proto-root .jc-halt-ask p { margin: 0; font-size: 11.5px; line-height: 1.75; color: var(--ink-2); } +.proto-root .jc-halt-ask textarea { + border: 1px solid var(--cardline); border-radius: 7px; padding: 7px 9px; + font: inherit; font-size: 12px; resize: vertical; background: #fff; +} +.proto-root .jc-halt-btns { display: flex; gap: 7px; justify-content: flex-end; } +.proto-root .jc-halted { + border-left: 3px solid var(--danger); background: var(--danger-soft); + border-radius: 9px; padding: 12px 13px; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; +} +.proto-root .jc-halted-h { display: flex; align-items: center; gap: 8px; } +.proto-root .jc-halted-why { margin: 0; font-size: 12.5px; color: var(--ink); font-weight: 600; } +.proto-root .jc-halted-note { margin: 0; font-size: 11.5px; color: var(--ink-2); line-height: 1.7; } + +/* ── 放行卡的草稿层 diff：签字前看得见自己改了什么 ── */ +.proto-root .jc-diff { font-size: 12px; } +.proto-root .jc-diff > i { font-style: normal; color: var(--ink-4); font-weight: 600; display: block; margin-bottom: 5px; } +.proto-root .jc-diff ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 5px; } +.proto-root .jc-diff li { + display: flex; align-items: center; gap: 6px; background: var(--warn-soft); + border-radius: 6px; padding: 6px 9px; +} +.proto-root .jc-diff p { margin: 0; } + +/* ── 等待期 = 预读期：把上下文/思路/将调用的工具摊开，别只转圈 ── */ +.proto-root .jc-pending { align-items: stretch; text-align: left; padding: 22px 6px; } +.proto-root .jc-pending-hd { display: flex; gap: 12px; align-items: center; } +.proto-root .jc-pending-hd b { font-size: 14px; color: var(--ink); display: block; } +.proto-root .jc-pending-hd p { margin: 3px 0 0; font-size: 12px; color: var(--ink-3); line-height: 1.7; } +.proto-root .jc-preread { margin-top: 16px; display: flex; flex-direction: column; gap: 14px; } +.proto-root .jc-preread-tip { + display: inline-flex; align-items: center; gap: 5px; align-self: flex-start; + font-size: 11px; color: var(--brand); background: var(--brand-wash); + padding: 4px 10px; border-radius: 999px; +} +.proto-root .jc-preread section { display: flex; flex-direction: column; gap: 6px; } +.proto-root .jc-preread h4 { + margin: 0; display: flex; align-items: center; gap: 5px; + font-size: 11.5px; color: var(--ink-4); font-weight: 600; +} +.proto-root .jc-preread section > p { margin: 0; font-size: 12.5px; line-height: 1.75; color: var(--ink-2); } +.proto-root .jc-preread-steps { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 6px; } +.proto-root .jc-preread-steps li { font-size: 12.5px; line-height: 1.75; color: var(--ink-2); } +.proto-root .jc-preread-tools { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 5px; } +.proto-root .jc-preread-tools li { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ink-2); } +.proto-root .jc-preread-steps li, .proto-root .jc-preread-tools li { + opacity: 0; animation: jcReveal .5s ease-out forwards; +} +@keyframes jcReveal { from { opacity: 0; transform: translateY(4px) } to { opacity: 1; transform: none } } +@media (prefers-reduced-motion: reduce) { + .proto-root .jc-preread-steps li, .proto-root .jc-preread-tools li { opacity: 1; animation: none; } +} + +/* ── 对话流层次：过去压成痕迹，现在独占注意力 ── */ +.proto-root .jc-trace { + display: flex; align-items: center; gap: 7px; width: 100%; text-align: left; + border: 1px solid var(--line-soft); background: var(--soft); border-radius: 8px; + padding: 6px 10px; font-size: 11.5px; color: var(--ink-3); cursor: pointer; + transition: all var(--t-fast); +} +.proto-root .jc-trace:hover { background: #fff; border-color: var(--cardline); color: var(--ink-2); } +.proto-root .jc-trace b { font-weight: 600; color: var(--ink-2); flex: 0 0 auto; } +.proto-root .jc-trace-sum { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-trace-decision { border-left: 2px solid var(--st-decision); } +.proto-root .jc-trace-execute { border-left: 2px solid var(--st-execute); } +.proto-root .jc-trace-wait { border-left: 2px solid var(--st-wait); } +.proto-root .jc-trace-release { border-left: 2px solid var(--brand); } +.proto-root .jc-trace-fold { + align-self: flex-start; margin-top: 6px; border: 0; background: none; + color: var(--ink-4); font-size: 11px; cursor: pointer; padding: 0; +} +.proto-root .jc-trace-fold:hover { color: var(--brand); } + +/* 当前待答卡：唯一该抢注意力的东西 */ +.proto-root .jc-cardb.now { box-shadow: 0 0 0 3px var(--brand-wash); border-color: var(--brand); } +.proto-root .jc-card.now .jc-card-to { color: var(--brand); font-weight: 600; } + +/* 跨人卡说明压成一行 */ +.proto-root p.jc-cross { + display: flex; align-items: center; gap: 6px; margin: 0; + padding: 9px 12px; font-size: 11.5px; color: var(--ink-3); line-height: 1.6; +} + +/* 头部：身份一行 + 元信息一行，动作靠右 */ +.proto-root .jc-tch-meta { gap: 8px; } +.proto-root .jc-tch-bud { display: inline-flex; align-items: center; gap: 5px; } +.proto-root .jc-tch-bud .jc-tch-bar { width: 46px; flex: 0 0 auto; } +.proto-root .jc-tch-sp { flex: 1; } + +/* ── 恢复聊天气泡语义：卡 = AI 的气泡（左，AI 头像）· 回传 = 人的气泡（右，人头像）── */ + +.proto-root .jc-turn-me > .jc-bub-me { flex: 0 1 auto; max-width: 82%; } +/* 折叠痕迹缩进到气泡的起始位置，保持左侧节奏（头像宽 + 间距） */ +.proto-root .jc-trace-ind { margin-left: 39px; width: calc(100% - 39px); } +.proto-root .jc-trace-fold-in { padding: 9px 12px 11px; } +/* 回传气泡里的回填明细 */ +.proto-root .jc-reply-kv { margin: 7px 0 0; display: flex; flex-direction: column; gap: 4px; } +.proto-root .jc-reply-kv > div { display: flex; gap: 7px; font-size: 11.5px; } +.proto-root .jc-reply-kv dt { color: var(--ink-4); flex: 0 0 auto; } +.proto-root .jc-reply-kv dd { margin: 0; color: var(--ink); } + +/* 卡作为 AI 气泡内容：工具色只描左缘，其余交给 .copilot-bubble 的旧视觉 */ +.proto-root .jc-cardb .jc-card-h { padding: 10px 12px; margin: 0; } +.proto-root .jc-cardb.jc-card-decision { border-left: 3px solid var(--st-decision); } +.proto-root .jc-cardb.jc-card-execute { border-left: 3px solid var(--st-execute); } +.proto-root .jc-cardb.jc-card-wait { border-left: 3px solid var(--st-wait); } +.proto-root .jc-cardb.jc-card-release { border-left: 3px solid var(--brand); } + + +/* Loop 唤醒回执：对话输入 / 外部事件 / 页面交互 三类同级事件 */ +.proto-root .jc-woke { + position: absolute; top: 14px; left: 50%; transform: translateX(-50%); z-index: 20; + display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 999px; + background: var(--brand); color: #fff; font-size: 11.5px; box-shadow: var(--shadow-2); + animation: jcWoke 2.6s ease-out forwards; +} +@keyframes jcWoke { 0%{opacity:0;transform:translate(-50%,-6px)} 12%,80%{opacity:1;transform:translate(-50%,0)} 100%{opacity:0} } +/* 系统 Agent 灰头像 */ +.proto-root .jc-ava-sys { background: var(--ink-4); color: #fff; } +.proto-root .jc-chosen { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 8px 0 0; font-size: 12px; color: var(--ok); } +.proto-root .jc-item-form { display: flex; flex-direction: column; gap: 12px; margin-top: 14px; } + +/* ══ 三层骨架（2026-07-26）：驾驶舱、页签、翻页条**都不滚**，只有事项正文滚 ══ + 之前整个中栏是一个滚动区，驾驶舱既挡在表单前面、滚过去之后又消失—— + 工单派发工作台的做法相反：「你在哪一单 / 哪一件 / 还剩几件」是常驻的框，工作面才滚。 */ +.proto-root .wf-cockpit { flex: 0 0 auto; margin-bottom: 12px; } +.proto-root .wf-card.jc-wc-fill { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; } +.proto-root .wf-card.jc-wc-fill { container-type: inline-size; } +.proto-root .wf-card.jc-wc-fill > .jc-wv-bar { flex: 0 0 auto; } +/* 窄栏：页签藏图标省宽，保证控制囊与页签同一排 */ +@container (max-width: 520px) { + .proto-root .jc-wv-tab svg { display: none; } + .proto-root .jc-wv-tab { padding: 7px 10px; } +} +/* 四项导航（下划线式）+ 点位条同一条基线，底边一条实线收住 */ +.proto-root .jc-wv-bar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px; margin-bottom: 13px; border-bottom: 1px solid var(--line-soft); } +/* （下划线页签旧规则已删——终版导航样式统一在文件尾「工作区导航 · 终版」块） */ +.proto-root .jc-wv-tab em { background: var(--soft); border-color: transparent; } +.proto-root .jc-wv-tab.active em { background: var(--brand-wash); border-color: transparent; } +.proto-root .jc-wv-bar > .jc-pager.top { flex: none; margin: 0; padding: 0; border: 0; gap: 9px; } +.proto-root .jc-wv-bar .jc-page-dots { flex: none; } +/* 顶上的点可点击跳件（原来是纯装饰的 ） */ +.proto-root .jc-page-dots button { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 999px; background: #d9dde3; cursor: pointer; transition: background var(--t-fast), transform var(--t-fast); } +.proto-root .jc-page-dots button:hover { background: var(--brand-soft); transform: scale(1.2); } +.proto-root .jc-page-dots button.done { background: var(--brand); opacity: .32; } +.proto-root .jc-page-dots button.cur { background: var(--brand); transform: scale(1.3); } +/* 正文末尾的翻页：两端各一颗 */ +.proto-root .jc-pager-sp { flex: 1; } +.proto-root .wf-card.jc-wc-fill > .jc-sa { flex: 1 1 auto; min-height: 0; } +/* 正文滚动视口：卡已经有 16/18 的内边距，正文不再重复留白（右侧留一点给自绘 thumb） */ +.proto-root .wf-body { min-height: 0; padding-right: 4px; } +.proto-root .wf-body > .jc-mst-doc { padding: 0 0 6px; animation: rise var(--t-med) both; } +.proto-root .wf-body > .wf-log { padding-top: 2px; } + +/* ══ 顶部导航栏（2026-07-26 重构）══ + 工作流 · 任务 · 主题 · 目标 全收在这一条，常驻不滚。下面才是判据/指导书 + 报告页。 */ +.proto-root .jc-topbar { position: relative; overflow: hidden; flex: 0 0 auto; margin-bottom: 12px; padding: 12px 18px 13px; background: #fff; border: 1px solid var(--line-soft); border-radius: 16px; box-shadow: var(--shadow-2); } +/* 设计感：顶缘 AI 渐变棱线 + 右上品牌光晕；两行定高（≈88px），其余信息在「工作流」页签 */ +.proto-root .jc-topbar::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--ai-grad); } +.proto-root .jc-topbar::after { content: ""; position: absolute; right: -60px; top: -80px; width: 210px; height: 210px; border-radius: 999px; background: radial-gradient(circle, rgba(51,112,255,.08), transparent 70%); pointer-events: none; } +.proto-root .jc-topbar > * { position: relative; z-index: 1; } +/* 面包屑行：工作流 › 任务 …… 状态 · 负责人 */ +.proto-root .jc-tb-crumb { display: flex; align-items: center; flex-wrap: nowrap; overflow: hidden; gap: 8px; font-size: 11.5px; color: var(--ink-3); } +.proto-root .jc-tb-crumb > svg { color: var(--ink-5, #b8bec7); flex: none; } +.proto-root .jc-tb-tag { display: inline-flex; align-items: center; gap: 4px; flex: none; font-size: 10.5px; font-weight: 700; color: var(--brand); background: var(--brand-wash); border: 1px solid var(--brand-soft); border-radius: 999px; padding: 2px 9px; } +.proto-root .jc-tb-wf, .proto-root .jc-tb-task { display: inline-flex; align-items: center; gap: 5px; flex: 0 1 auto; min-width: 0; } +.proto-root .jc-tb-task { flex: none; } +.proto-root .jc-tb-wf svg { color: var(--ink-4); flex: none; } +.proto-root .jc-tb-wf b, .proto-root .jc-tb-task b { font-weight: 700; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-tb-task b { color: var(--ink); } +.proto-root .jc-tb-crumb code { font-size: 10px; color: var(--ink-4); white-space: nowrap; } +/* 窄栏优先级：先裁工作流编号，再裁工作流名（主体信息「任务名+状态+负责人」永远在） */ +.proto-root .jc-tb-wf code { flex: 0 10 auto; min-width: 0; overflow: hidden; } +.proto-root .jc-tb-owner { white-space: nowrap; } +.proto-root .jc-cp-run-st { white-space: nowrap; } +.proto-root .jc-tb-sp { flex: 1 1 auto; min-width: 0; } +.proto-root .jc-tb-owner { display: inline-flex; align-items: center; gap: 5px; flex: none; font-size: 11px; color: var(--ink-3); } +.proto-root .jc-tb-owner em { width: 19px; height: 19px; border-radius: 999px; display: grid; place-items: center; font-style: normal; font-size: 10px; font-weight: 700; color: #fff; background: var(--brand); } +/* 主题 */ +.proto-root .jc-tb-title { margin: 0; font-size: 17px; font-weight: 800; color: var(--ink); letter-spacing: -.02em; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +/* 目标：一行收纳（悬停看全文）；流程图在「工作流」页签 */ +.proto-root .jc-tb-goalrow { display: flex; align-items: center; gap: 5px; margin-top: 6px; font-size: 11.5px; color: var(--ink-3); overflow: hidden; } +.proto-root .jc-tb-goalrow svg { flex: none; color: var(--brand); } +.proto-root .jc-tb-goalrow span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } + +/* ══ 运行状态行（2026-07-26）══ + ⚠️ 这里**没有完成度进度条**：AI 边推进边派工，工作事项没有分母，画成 x/y 是编的。 + 只报绝对数（已派/办完/待办/成果），条只画在**预算**上——那才真有上限。 */ +.proto-root .jc-cp-run { display: flex; align-items: center; flex-wrap: nowrap; overflow: hidden; gap: 14px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--line-soft); } +.proto-root .jc-cp-run-st { display: inline-flex; align-items: center; gap: 6px; flex: none; font-size: 11.5px; font-weight: 700; color: var(--brand-deep); background: var(--brand-wash); border: 1px solid var(--brand-soft); border-radius: 999px; padding: 3px 11px; } +.proto-root .jc-cp-run-st.done { color: var(--ok); background: var(--ok-soft); border-color: #bfedb4; } +.proto-root .jc-cp-run-n { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11.5px; color: var(--ink-3); } +.proto-root .jc-cp-run-n b { font-family: var(--mono); font-weight: 800; color: var(--ink-2); } +.proto-root .jc-cp-run-n b.hot { color: var(--brand); } +.proto-root .jc-cp-run-n em { font-style: normal; color: var(--warn, #b7791f); } + +/* 预算四道闸：唯一有真分母的进度（规范 04） */ +.proto-root .jc-bud { display: flex; flex: none; gap: 6px; } +.proto-root .jc-bud-g { position: relative; display: inline-flex; align-items: center; gap: 3px; overflow: hidden; padding: 3px 8px 5px; border: 1px solid var(--line-soft); border-radius: 7px; background: var(--soft); font-size: 10.5px; color: var(--ink-3); } +.proto-root .jc-bud-g svg { color: var(--ink-4); } +.proto-root .jc-bud-g b { font-weight: 800; color: var(--ink-2); } +.proto-root .jc-bud-g i { font-style: normal; color: var(--ink-4); font-family: var(--mono); } +.proto-root .jc-bud-g em { position: absolute; left: 0; bottom: 0; height: 2px; background: var(--brand); opacity: .8; } +.proto-root .jc-bud-g.warm em { background: #e8a33d; } +.proto-root .jc-bud-g.hot { border-color: #f9c1be; background: var(--danger-soft); } +.proto-root .jc-bud-g.hot em { background: var(--danger); } + +/* ══ 工作流详情：图 + 当前状态 + 上下文 ══ */ +.proto-root .jc-wfd { margin-top: 9px; } +.proto-root .jc-wfd > summary { gap: 7px; } +.proto-root .jc-wfd-more { margin-left: auto; flex: none; font-size: 10.5px; font-weight: 700; color: var(--ink-4); background: var(--soft); border: 1px solid var(--line-soft); border-radius: 999px; padding: 2px 9px; } +.proto-root .jc-wfd[open] > summary .jc-wfd-more { color: var(--brand); background: var(--brand-wash); border-color: var(--brand-soft); } +.proto-root .jc-wfd[open] > summary .jc-cp-nodes { display: none; } /* 展开后图里都有，收起态那行就不重复了 */ +.proto-root .jc-wfd-open-t { display: none; } +.proto-root .jc-wfd[open] > summary .jc-wfd-open-t { display: block; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; color: var(--ink-2); } +.proto-root .jc-wfd-body { margin-top: 11px; animation: rise var(--t-med) both; } + +/* 流程图：一节点一卡 + 连线；活动=品牌蓝，审批点=琥珀（对齐治理台画布，它不是活动） */ +.proto-root .jc-wfg { display: flex; flex-wrap: wrap; gap: 8px 16px; padding: 12px 13px; background: var(--soft); border: 1px solid var(--line-soft); border-radius: 11px; } +.proto-root .jc-wfg-n { position: relative; flex: 1 1 118px; min-width: 108px; display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; background: #fff; border: 1px solid var(--line); border-radius: 9px; } +/* 不画节点间连线：图会换行，行首那颗的连线会悬空指向空白，比没有更糟。 + 顺序靠编号（A1…A6）与阅读序表达。 */ +.proto-root .jc-wfg-n.apr { border-color: #e7d4ab; background: linear-gradient(180deg, #fff, #fbf0dc); } +.proto-root .jc-wfg-n.s-done { border-color: #bfedb4; } +.proto-root .jc-wfg-n.s-cur { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-wash); } +.proto-root .jc-wfg-n.s-todo { opacity: .62; } +.proto-root .jc-wfg-code { font-size: 10px; font-weight: 800; letter-spacing: .06em; color: var(--ink-4); } +.proto-root .jc-wfg-n.apr .jc-wfg-code { color: #b98432; } +.proto-root .jc-wfg-n.s-cur .jc-wfg-code { color: var(--brand); } +.proto-root .jc-wfg-name { font-size: 12px; font-weight: 700; color: var(--ink); line-height: 1.4; } +.proto-root .jc-wfg-who { display: flex; align-items: center; gap: 4px; margin-top: 2px; font-size: 10.5px; color: var(--ink-4); } +.proto-root .jc-wfg-who em { width: 15px; height: 15px; border-radius: 999px; display: grid; place-items: center; font-style: normal; font-size: 9px; font-weight: 700; color: #fff; background: var(--ink-4); } +.proto-root .jc-wfg-n.s-cur .jc-wfg-who em { background: var(--brand); } +.proto-root .jc-wfg-n.apr .jc-wfg-who em { background: #b98432; } +.proto-root .jc-wfg-st { margin-top: 3px; font-size: 10px; font-weight: 700; color: var(--ink-4); } +.proto-root .jc-wfg-n.s-done .jc-wfg-st { color: var(--ok); } +.proto-root .jc-wfg-n.s-cur .jc-wfg-st { color: var(--brand); } + +/* 详情四格：目标 / 怎么起的单 / 起单输入 / 编号 */ +.proto-root .jc-wfd-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 9px; margin-top: 9px; } +.proto-root .jc-wfd-cell.wide { grid-column: 1 / -1; } +.proto-root .jc-wfd-cell .jc-bud { margin-top: 4px; flex-wrap: wrap; } +.proto-root .jc-wfd-cell { padding: 9px 11px; background: #fff; border: 1px solid var(--line-soft); border-radius: 9px; } +.proto-root .jc-wfd-cell > i { display: block; margin-bottom: 4px; font-style: normal; font-size: 10px; font-weight: 800; letter-spacing: .08em; color: var(--ink-4); } +.proto-root .jc-wfd-cell p { margin: 0 0 2px; font-size: 11.5px; color: var(--ink-2); line-height: 1.6; } +.proto-root .jc-wfd-in { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; } +.proto-root .jc-wfd-in li { font-size: 11px; line-height: 1.5; } +.proto-root .jc-wfd-in b { display: block; color: var(--ink-2); } +.proto-root .jc-wfd-in span { color: var(--ink-4); } + +/* ══ 工单报告页（2026-07-26 重设计）：办结的工单 = 一份可归档的汇报页 ══ + 版式取正式汇报件：题头双线 → 元信息一行 → 关键指标带 → 编号章节（一/二/三）→ + 图表正文 → 填报/结论 → 落款与签章。色彩纪律：**结构用品牌蓝，数据才用语义色**。 */ +.proto-root .jc-report { background: #fff; border: 1px solid var(--cardline); border-radius: 14px; box-shadow: var(--card-shadow); overflow: hidden; animation: rise var(--t-med) both; } + +/* 题头：类型行 + 标题 + 状态（待办章 / 印章）；下缘粗细双线 = 正式件题头 */ +.proto-root .jc-rp-head { position: relative; display: flex; align-items: flex-start; gap: 12px; padding: 16px 20px 13px; border-bottom: 2px solid var(--ink); } +.proto-root .jc-rp-head::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 1px; background: var(--line); } +.proto-root .jc-rp-badge { flex: none; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; color: #fff; background: var(--ai-grad); box-shadow: var(--shadow-brand); } +.proto-root .jc-rp-tit { flex: 1; min-width: 0; } +.proto-root .jc-rp-tit em { display: block; font-style: normal; font-size: 10px; font-weight: 800; letter-spacing: .08em; color: var(--ink-4); font-family: var(--mono); } +.proto-root .jc-rp-tit h3 { margin: 4px 0 0; font-size: 18px; font-weight: 800; color: var(--ink); letter-spacing: -.01em; line-height: 1.3; } +.proto-root .jc-rp-wait { display: inline-flex; align-items: center; gap: 6px; flex: none; margin-top: 4px; font-size: 11px; font-weight: 700; color: var(--brand-deep); background: var(--brand-wash); border: 1px solid var(--brand-soft); border-radius: 999px; padding: 4px 12px; } +/* 印章：办结后盖在题头右侧 */ +.proto-root .jc-rp-stamp { flex: none; margin-top: 2px; transform: rotate(-6deg); border: 2px solid currentColor; border-radius: 9px; padding: 4px 8px 3px 12px; font-size: 13px; font-weight: 900; letter-spacing: .28em; color: var(--ok); opacity: .9; } +.proto-root .jc-rp-stamp.bad { color: var(--danger); } + +/* 元信息一行：编号 / 所属 / 编制 / 派发 / 办结（分隔竖线，不做格子） */ +.proto-root .jc-rp-meta { display: flex; flex-wrap: wrap; row-gap: 3px; padding: 8px 20px; margin-top: 4px; border-bottom: 1px solid var(--line-soft); background: #fbfcfe; } +.proto-root .jc-rp-meta > span { display: inline-flex; align-items: baseline; gap: 6px; padding-right: 14px; margin-right: 14px; border-right: 1px solid var(--line-soft); } +.proto-root .jc-rp-meta > span:last-child { border-right: 0; margin-right: 0; } +.proto-root .jc-rp-meta i { font-style: normal; font-size: 9.5px; font-weight: 800; letter-spacing: .08em; color: var(--ink-4); } +.proto-root .jc-rp-meta b { font-size: 11px; font-weight: 700; color: var(--ink-2); } + +/* 关键指标带：依据摆上台面（洗蓝渐变格） */ +.proto-root .jc-rp-stats { display: flex; flex-wrap: wrap; gap: 1px; background: var(--line-soft); border-bottom: 1px solid var(--line-soft); } +.proto-root .jc-rp-stat { flex: 1 1 150px; min-width: 0; padding: 10px 16px 11px; background: linear-gradient(180deg, var(--brand-wash), #fff 85%); } +.proto-root .jc-rp-stat i { display: block; font-style: normal; font-size: 9.5px; font-weight: 800; letter-spacing: .09em; color: var(--ink-4); } +.proto-root .jc-rp-stat b { display: block; margin-top: 3px; font-size: 12.5px; font-weight: 800; color: var(--ink); line-height: 1.5; } + +/* 编号章节：一 / 二 / 三 */ +.proto-root .jc-rp-s { padding: 15px 20px 10px; } +.proto-root .jc-rp-s + .jc-rp-s { border-top: 1px dashed var(--line); } +.proto-root .jc-rp-sh { display: flex; align-items: center; gap: 9px; margin: 0 0 12px; } +.proto-root .jc-rp-sh em { flex: none; width: 24px; height: 24px; border-radius: 7px; display: grid; place-items: center; font-style: normal; font-size: 12px; font-weight: 800; color: #fff; background: var(--brand); box-shadow: var(--shadow-brand); } +.proto-root .jc-rp-sh b { flex: none; font-size: 13.5px; font-weight: 800; color: var(--ink); letter-spacing: .02em; } +.proto-root .jc-rp-sh .ln { flex: 1; height: 1px; background: var(--line-soft); } +.proto-root .jc-rp-sh .aside { flex: none; max-width: 46%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10.5px; font-weight: 700; color: var(--ink-4); font-family: var(--mono); background: var(--soft); border: 1px solid var(--line-soft); border-radius: 999px; padding: 2px 10px; } +.proto-root .jc-rp-sh .aside.ok { color: var(--ok); background: var(--ok-soft); border-color: #bfedb4; } +.proto-root .jc-rp-sh .aside.bad { color: var(--danger); background: var(--danger-soft); border-color: #f9c1be; } + +/* 一 · 任务要求：要求段 + 分步 + 完成标准 */ +.proto-root .jc-rp-ask { margin: 0; font-size: 12.5px; color: var(--ink-2); line-height: 1.7; } +.proto-root .jc-steps { margin: 10px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 7px; } +.proto-root .jc-steps li { display: flex; gap: 9px; align-items: flex-start; font-size: 12.5px; color: var(--ink-2); line-height: 1.65; } +.proto-root .jc-steps em { flex: none; width: 19px; height: 19px; margin-top: 1px; border-radius: 999px; display: grid; place-items: center; font-style: normal; font-size: 10.5px; font-weight: 800; color: var(--brand); background: var(--brand-wash); border: 1px solid var(--brand-soft); font-family: var(--mono); } +.proto-root .jc-rp-std { display: flex; gap: 8px; margin: 12px 0 0; padding: 10px 13px; border-left: 3px solid var(--brand); border-radius: 8px; background: linear-gradient(90deg, var(--brand-wash), #fff 72%); font-size: 12px; color: var(--ink-2); line-height: 1.65; } +.proto-root .jc-rp-std svg { flex: none; margin-top: 2px; color: var(--brand); } +.proto-root .jc-rp-std b { font-weight: 800; color: var(--brand-deep); margin-right: 6px; } + +/* 二 · 验收判据：行表（左判据 · 中级别 · 右达标） */ +.proto-root .jc-rp-crit { margin: 0; padding: 0; list-style: none; border: 1px solid var(--line-soft); border-radius: 10px; overflow: hidden; } +.proto-root .jc-rp-crit li { display: flex; align-items: center; gap: 10px; padding: 8px 13px; background: #fff; font-size: 12.5px; } +.proto-root .jc-rp-crit li + li { border-top: 1px solid var(--line-soft); } +.proto-root .jc-rp-crit .t { flex: 1; min-width: 0; color: var(--ink-2); } +.proto-root .jc-rp-crit .r { display: inline-flex; align-items: center; gap: 5px; flex: none; font-size: 11px; font-weight: 800; color: var(--ok); } +.proto-root .jc-rp-crit li.no .r { color: var(--danger); } + +/* 三 · 验收结论：落地动作 + 结论章 */ +.proto-root .jc-rp-eff { margin-bottom: 12px; padding: 11px 13px; border: 1px solid var(--line-soft); border-radius: 10px; background: var(--soft); } +.proto-root .jc-rp-eff > i { display: inline-flex; align-items: center; gap: 4px; font-style: normal; font-size: 10px; font-weight: 800; letter-spacing: .06em; color: var(--ink-4); } +.proto-root .jc-rp-eff ul { margin: 7px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 5px; } +.proto-root .jc-rp-eff li { display: flex; align-items: baseline; gap: 7px; font-size: 11.5px; color: var(--ink-3); } +.proto-root .jc-rp-eff b { color: var(--ink-2); } +.proto-root .jc-rp-verdict { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 0; padding: 11px 14px; border-radius: 10px; background: var(--ok-soft); border: 1px solid #bfedb4; color: var(--ok); font-size: 13px; font-weight: 800; } +.proto-root .jc-rp-verdict span { font-weight: 500; font-size: 12px; color: var(--ink-2); } +.proto-root .jc-rp-verdict.bad { background: var(--danger-soft); border-color: #f9c1be; color: var(--danger); } + +/* 三 · 处理与填报（在办：表单分节，节头带进度） */ +.proto-root .jc-rp-grp { margin: 0 0 16px; padding: 0; border: 0; } +.proto-root .jc-rp-lg { display: flex; align-items: center; gap: 8px; width: 100%; padding: 0 0 8px; margin: 0 0 11px; border-bottom: 1px solid var(--line-soft); font-size: 12.5px; font-weight: 800; color: var(--brand-deep); } +.proto-root .jc-rp-lg i { margin-left: auto; font-style: normal; font-size: 10px; font-weight: 700; color: var(--ink-4); background: var(--soft); border-radius: 999px; padding: 2px 8px; font-family: var(--mono); } +.proto-root .jc-rp-lg i.ok { color: var(--ok); background: var(--ok-soft); } +.proto-root .jc-fld.done > .jc-fld-l::before { content: ""; display: inline-block; width: 5px; height: 5px; margin-right: 5px; border-radius: 999px; background: var(--ok); vertical-align: middle; } + +/* 填报结果（办结：值排成正文——这一步让工单页变归档汇报页） */ +.proto-root .jc-rp-valgrp { margin: 0 0 14px; } +.proto-root .jc-rp-vals { margin: 0; border: 1px solid var(--line-soft); border-radius: 10px; overflow: hidden; } +.proto-root .jc-rp-vals .row { display: grid; grid-template-columns: minmax(110px, 200px) 1fr; } +.proto-root .jc-rp-vals .row + .row { border-top: 1px solid var(--line-soft); } +.proto-root .jc-rp-vals dt { padding: 8px 12px; background: var(--soft); font-size: 11px; font-weight: 700; color: var(--ink-3); } +.proto-root .jc-rp-vals dd { margin: 0; padding: 8px 12px; font-size: 12px; color: var(--ink); line-height: 1.65; background: #fff; } + +/* 落款 */ +.proto-root .jc-rp-foot { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 13px 20px 15px; border-top: 2px solid var(--line); background: #fbfcfd; } +.proto-root .jc-rp-sign { display: flex; align-items: center; gap: 9px; flex: 1 1 200px; min-width: 0; } +.proto-root .jc-rp-ava { flex: none; width: 30px; height: 30px; border-radius: 999px; display: grid; place-items: center; font-size: 12px; font-weight: 700; color: #fff; background: var(--brand); } +.proto-root .jc-rp-sign b { display: block; font-size: 12px; color: var(--ink-2); } +.proto-root .jc-rp-sign span { display: block; margin-top: 1px; font-size: 10.5px; color: var(--ink-4); } +.proto-root .jc-rp-submit { margin-left: auto; flex: none; } + +/* ══ 已完成列表：一行一份成果报告，点进去看定稿页 ══ */ +.proto-root .jc-dv-row { width: 100%; text-align: left; cursor: pointer; font: inherit; transition: border-color var(--t-fast), box-shadow var(--t-fast), transform var(--t-fast); } +.proto-root .jc-dv-row:hover { border-color: var(--brand); box-shadow: var(--shadow-2); transform: translateY(-1px); } +.proto-root .jc-dv-row .jc-dv-h { display: flex; align-items: center; } +.proto-root .jc-dv-row .jc-dv-h > svg { flex: none; color: var(--ink-4); margin-left: 4px; transition: color var(--t-fast), transform var(--t-fast); } +.proto-root .jc-dv-row:hover .jc-dv-h > svg { color: var(--brand); transform: translateX(2px); } +.proto-root .jc-dv.s-bad .jc-dv-st { color: var(--danger); background: var(--danger-soft); } +.proto-root .jc-dv.s-bad .jc-dv-ico { color: var(--danger); background: var(--danger-soft); } +/* 报告详情顶部的返回 */ +.proto-root .jc-rp-back { display: inline-flex; align-items: center; gap: 4px; margin: 0 0 10px; padding: 5px 12px 5px 8px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink-3); font-size: 12px; font-weight: 600; cursor: pointer; transition: color var(--t-fast), border-color var(--t-fast), background var(--t-fast); } +.proto-root .jc-rp-back:hover { color: var(--brand); border-color: var(--brand-soft); background: var(--brand-wash); } + +/* ══ 过程成果货架 ══ */ +.proto-root .jc-dvs { display: flex; flex-direction: column; gap: 10px; padding-top: 2px; } +.proto-root .jc-dv { padding: 12px 14px; background: #fff; border: 1px solid var(--cardline); border-left: 3px solid var(--line); border-radius: 11px; box-shadow: var(--card-shadow); } +.proto-root .jc-dv.s-ok { border-left-color: var(--ok); } +.proto-root .jc-dv.s-live { border-left-color: var(--brand); } +.proto-root .jc-dv.s-bad { border-left-color: var(--danger); } +.proto-root .jc-dv-h { display: flex; align-items: flex-start; gap: 10px; } +.proto-root .jc-dv-ico { flex: none; width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; color: var(--ink-4); background: var(--soft); } +.proto-root .jc-dv.s-ok .jc-dv-ico { color: var(--ok); background: var(--ok-soft); } +.proto-root .jc-dv.s-live .jc-dv-ico { color: #fff; background: var(--ai-grad); } +.proto-root .jc-dv-t { flex: 1; min-width: 0; } +.proto-root .jc-dv-t em { display: block; font-style: normal; font-size: 10px; font-weight: 700; letter-spacing: .04em; color: var(--ink-4); font-family: var(--mono); } +.proto-root .jc-dv-t b { display: block; margin-top: 2px; font-size: 13.5px; font-weight: 700; color: var(--ink); } +.proto-root .jc-dv-st { flex: none; font-size: 10.5px; font-weight: 700; color: var(--ink-4); background: var(--soft); border-radius: 999px; padding: 3px 10px; } +.proto-root .jc-dv.s-ok .jc-dv-st { color: var(--ok); background: var(--ok-soft); } +.proto-root .jc-dv.s-live .jc-dv-st { color: var(--brand); background: var(--brand-wash); } +.proto-root .jc-dv-d { margin: 8px 0 0; font-size: 11.5px; color: var(--ink-3); line-height: 1.6; } +.proto-root .jc-dv-fold { margin-top: 9px; padding-top: 8px; border-top: 1px dashed var(--line-soft); } +.proto-root .jc-dv-fold > summary em { flex: none; margin-left: 4px; font-size: 10px; color: var(--ink-4); font-family: var(--mono); } +.proto-root .jc-dv-body { margin-top: 4px; } + +/* ══ 驾驶舱瘦身（2026-07-26）：只答「哪单 · 走到哪了 · 还剩几件」 ══ */ +/* 节点链从事项里收上来——任务级的事说一次，不在每条事项里重抄。 + 常驻头必须窄：强制一行（换行会让整个头长高一截），窄到放不下就横向滚 */ +.proto-root .jc-cp-nodes { margin-top: 9px; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; } +.proto-root .jc-cp-nodes::-webkit-scrollbar { display: none; } +.proto-root .jc-cp-nodes .jc-ctx-node { flex: none; } +/* 还剩几件：进度条与那句话并排一行（原先是大数字 + 件名两块，件名与下面的翻页条重复） */ +.proto-root .jc-cp-rest { display: flex; align-items: center; gap: 13px; margin-top: 13px; padding-top: 12px; border-top: 1px dashed var(--line-soft); } +.proto-root .jc-cp-rest .wf-bar { flex: 1; min-width: 0; margin-top: 0; } +.proto-root .jc-cp-rest-t { flex: none; font-size: 11.5px; color: var(--ink-3); } +.proto-root .jc-cp-rest-t b { margin-right: 3px; color: var(--brand); font-family: var(--mono); font-weight: 800; } + +/* ══ 折叠件：读一次就不再看的东西收起来，别把正事顶出首屏 ══ */ +.proto-root .jc-fold > summary { display: flex; align-items: center; gap: 5px; list-style: none; cursor: pointer; font-size: 11.5px; font-weight: 700; color: var(--ink-3); user-select: none; } +.proto-root .jc-fold > summary::-webkit-details-marker { display: none; } +.proto-root .jc-fold > summary svg { flex: none; color: var(--ink-4); transition: transform var(--t-fast); } +.proto-root .jc-fold[open] > summary svg { transform: rotate(90deg); } +.proto-root .jc-fold > summary:hover { color: var(--brand); } +.proto-root .jc-fold > summary:hover svg { color: var(--brand); } +/* 摘要里带一撮内容预览：收起时也知道里面有什么 */ +.proto-root .jc-fold > summary em { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-style: normal; font-weight: 400; color: var(--ink-4); } +.proto-root .jc-cp-fold { margin-top: 11px; } +.proto-root .jc-cp-fold .jc-cp-goal { margin-top: 8px; } +.proto-root .jc-basis-fold { margin-top: 12px; } +.proto-root .jc-basis-fold .jc-basis { margin-top: 7px; border-radius: 9px; } + +/* ══ 事项翻页条：复用「一页一卡」的 .jc-pager，挪到正文顶部（分隔线随之翻到下缘） ══ */ +.proto-root .jc-pager.top { margin-top: 0; margin-bottom: 14px; padding-top: 0; padding-bottom: 10px; border-top: 0; border-bottom: 1px dashed var(--line-soft); } +.proto-root .jc-pager.top .jc-page-dots i.done { background: var(--brand); opacity: .32; } +.proto-root .jc-pager.top .jc-page-dots i.cur { background: var(--brand); } +.proto-root .jc-pager-n { flex: none; font-size: 11px; font-weight: 700; color: var(--ink-4); letter-spacing: -.02em; } + +/* ══ 这一摞翻完了 ══ */ +.proto-root .jc-mst-empty { display: flex; flex-direction: column; align-items: center; gap: 7px; padding: 52px 20px 58px; text-align: center; } +.proto-root .jc-mst-empty svg { color: var(--ink-4); opacity: .45; } +.proto-root .jc-mst-empty b { font-size: 14px; color: var(--ink-2); } +.proto-root .jc-mst-empty p { margin: 0; max-width: 30em; font-size: 12px; color: var(--ink-4); line-height: 1.7; } + +/* ══ 四段结构小节 ══ */ +.proto-root .jc-sec4 { margin-top: 16px; } +.proto-root .jc-sec4-h { display: flex; align-items: center; gap: 7px; margin-bottom: 9px; padding-bottom: 7px; border-bottom: 1px solid var(--line-soft); } +.proto-root .jc-sec4-h b { font-size: 12.5px; color: var(--ink); } +.proto-root .jc-sec4-ico { width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; background: var(--brand-soft); color: var(--brand); } +.proto-root .jc-sec4-tip { margin-left: auto; font-size: 11px; color: var(--ink-4); } + +/* ══ 工作流上下文 ══ */ +.proto-root .jc-ctx { display: flex; flex-direction: column; gap: 8px; } +.proto-root .jc-ctx-line { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; font-size: 12px; } +.proto-root .jc-ctx-k { font-size: 10.5px; color: var(--ink-4); background: var(--soft); padding: 1px 7px; border-radius: 999px; } +.proto-root .jc-ctx-nodes { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 2px; } +.proto-root .jc-ctx-node { font-size: 10.5px; padding: 3px 9px; border-radius: 999px; background: var(--soft); color: var(--ink-4); } +.proto-root .jc-ctx-node.past { background: var(--ok-soft); color: var(--ok); } +.proto-root .jc-ctx-node.me { background: var(--brand); color: #fff; font-weight: 600; } + +/* ══ 表单：分组 + 栅格 + 8 种控件 ══ */ +.proto-root .jc-form { display: flex; flex-direction: column; gap: 16px; } +.proto-root .jc-fs { border: 1px solid var(--line-soft); border-radius: 10px; padding: 12px 13px 14px; margin: 0; background: #fff; } +.proto-root .jc-fs-lg { padding: 0 7px; font-size: 11.5px; font-weight: 700; color: var(--brand); } +.proto-root .jc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } +.proto-root .jc-fld { grid-column: span 2; display: flex; flex-direction: column; gap: 5px; } +.proto-root .jc-fld.half { grid-column: span 1; } +.proto-root .jc-fld-l { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--ink-2); } +.proto-root .jc-req { font-style: normal; font-size: 9.5px; padding: 1px 5px; border-radius: 3px; background: var(--danger-soft); color: var(--danger); } +.proto-root .jc-fld-h { margin: 0; font-size: 11px; color: var(--ink-4); line-height: 1.6; } +.proto-root .jc-inp, .proto-root .jc-ta, .proto-root .jc-sel, .proto-root .jc-num input { + width: 100%; border: 1px solid var(--cardline); border-radius: 7px; padding: 7px 10px; + font: inherit; font-size: 12.5px; color: var(--ink); background: #fff; +} +.proto-root .jc-ta { resize: vertical; line-height: 1.7; } +.proto-root .jc-inp:focus, .proto-root .jc-ta:focus, .proto-root .jc-sel:focus, .proto-root .jc-num input:focus { + outline: 2px solid var(--brand-soft); border-color: var(--brand); +} +.proto-root .jc-sel-wrap { position: relative; display: flex; align-items: center; } +.proto-root .jc-sel { appearance: none; padding-right: 30px; cursor: pointer; } +.proto-root .jc-sel-wrap > svg { position: absolute; right: 10px; pointer-events: none; color: var(--ink-4); } +.proto-root .jc-num { display: flex; align-items: center; gap: 0; position: relative; } +.proto-root .jc-num input { padding-left: 10px; } +.proto-root .jc-num-pre { position: absolute; left: 10px; font-size: 12.5px; color: var(--ink-4); font-family: var(--mono); } +.proto-root .jc-num:has(.jc-num-pre) input { padding-left: 24px; } +.proto-root .jc-num-unit { position: absolute; right: 10px; font-size: 11px; color: var(--ink-4); } +.proto-root .jc-checks { display: flex; flex-wrap: wrap; gap: 7px; } +.proto-root .jc-check { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--cardline); background: #fff; border-radius: 7px; padding: 6px 11px; font-size: 11.5px; cursor: pointer; transition: all var(--t-fast); } +.proto-root .jc-check:hover { border-color: var(--brand); } +.proto-root .jc-check.on { border-color: var(--brand); background: var(--brand-wash); color: var(--brand-deep); } +.proto-root .jc-check-box { width: 14px; height: 14px; border-radius: 4px; border: 1.5px solid var(--cardline); display: grid; place-items: center; } +.proto-root .jc-check.on .jc-check-box { background: var(--brand); border-color: var(--brand); color: #fff; } +.proto-root .jc-radio { display: inline-flex; align-items: center; gap: 5px; } +.proto-root .jc-crit-t { flex: 1; } + +/* ══ 对话区 · 气泡二元制（2026-07-26 定稿）══ + 所有内容都在气泡里。AI 只有两种形态：**纯文本气泡** / **完整表单卡**（不混排、无半结构化条目）。 + 表单卡自带题头（类型+计数）→ 说明 → 参考信息 kv 表 → 字段/选项 → 动作栏。 */ + +/* 画布与列 */ +.proto-root .jc-tch-scroll { background: #f6f7f9; gap: 16px; padding: 16px 14px; } +.proto-root .jc-ag { display: flex; gap: 9px; align-items: flex-start; animation: jcMsgIn var(--t-med) both; } +.proto-root .jc-ag-col { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; } +.proto-root .jc-msg-meta { display: flex; align-items: center; gap: 6px; padding: 2px 1px 0; font-size: 10px; font-weight: 600; letter-spacing: .03em; color: var(--ink-4); font-family: var(--mono); } +.proto-root .jc-msg-meta.r { justify-content: flex-end; } +@keyframes jcMsgIn { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } } + +/* AI 文本气泡（左 · 白）与系统气泡（灰调）；带卡的回复 = 同一气泡里 文字在上、卡嵌其中 */ +.proto-root .jc-ag-b { max-width: 92%; background: #fff; border: 1px solid var(--line-soft); border-radius: 4px 14px 14px 14px; padding: 10px 13px; box-shadow: 0 1px 2px rgba(31,35,41,.04), 0 3px 12px rgba(31,35,41,.05); } +.proto-root .jc-ag-b.card { max-width: 100%; width: 100%; } +.proto-root .jc-ag-b > .jc-fc { margin-top: 10px; box-shadow: none; } +.proto-root .jc-ag-b .jc-content { font-size: 12.8px; line-height: 1.78; color: var(--ink); } +.proto-root .jc-ag-b.sys { background: #eef0f4; border-color: var(--line-soft); } +.proto-root .jc-ag-b.sys .jc-content { color: var(--ink-2); font-size: 12px; } + +/* 类型章（署名行小色章） */ +.proto-root .jc-mtag { display: inline-flex; align-items: center; gap: 3px; font-size: 9.5px; font-weight: 800; letter-spacing: .04em; padding: 1px 7px; border-radius: 999px; } +.proto-root .jc-mtag.m-auto { background: var(--st-auto-soft); color: var(--st-auto); } +.proto-root .jc-mtag.m-exe { background: var(--st-execute-soft); color: var(--st-execute); } +.proto-root .jc-mtag.m-acc { background: var(--st-collab-soft); color: var(--st-collab); } +.proto-root .jc-mtag.m-dec { background: var(--st-decision-soft); color: var(--st-decision); } +.proto-root .jc-mtag.m-fill { background: var(--brand-wash); color: var(--brand); } +.proto-root .jc-mtag.m-sys { background: var(--st-wait-soft); color: var(--st-wait); } + +/* 人的气泡（右 · 品牌渐变，唯一右侧） */ +.proto-root .session-chat .jc-msg-col { display: flex; flex-direction: column; gap: 4px; min-width: 0; max-width: 84%; } +.proto-root .session-chat .jc-msg-col.r { align-items: flex-end; } +.proto-root .session-chat .jc-msg-col .copilot-bubble { margin-top: 0; max-width: 100%; } +.proto-root .session-chat .copilot-msg.human { animation: jcMsgIn var(--t-med) both; } + +/* ── 完整表单卡：对话区唯一的结构化形态 ── */ +.proto-root .jc-fc { --fc: var(--brand); --fc-soft: var(--brand-wash); width: 100%; max-width: 100%; background: #fff; border: 1px solid color-mix(in srgb, var(--fc) 22%, var(--line-soft)); border-radius: 13px; overflow: hidden; box-shadow: 0 1px 2px rgba(31,35,41,.04), 0 4px 14px rgba(31,35,41,.06); } +.proto-root .jc-fc.t-exe { --fc: var(--st-execute); --fc-soft: var(--st-execute-soft); } +.proto-root .jc-fc.t-acc { --fc: var(--st-collab); --fc-soft: var(--st-collab-soft); } +.proto-root .jc-fc.t-dec { --fc: var(--st-decision); --fc-soft: var(--st-decision-soft); } +.proto-root .jc-fc.t-fill { --fc: var(--brand); --fc-soft: var(--brand-wash); } +/* 题头：色染带 + 计数章 */ +.proto-root .jc-fc-h { display: flex; align-items: center; gap: 6px; padding: 8px 13px; background: var(--fc-soft); border-bottom: 1px solid color-mix(in srgb, var(--fc) 14%, transparent); color: var(--fc); } +.proto-root .jc-fc-h svg { color: currentColor; } +.proto-root .jc-fc-h b { flex: 1; font-size: 11.5px; font-weight: 800; letter-spacing: .05em; } +.proto-root .jc-fc-h em { flex: none; font-style: normal; font-size: 10px; font-weight: 800; font-family: var(--mono); color: var(--fc); background: #fff; border-radius: 999px; padding: 1px 8px; } +.proto-root .jc-fc-h em.ok { color: var(--ok); } +.proto-root .jc-fc-h em.bad { color: var(--danger); } +/* 卡体与动作栏 */ +.proto-root .jc-fc-b { padding: 11px 13px; display: flex; flex-direction: column; gap: 10px; } +.proto-root .jc-fc-ft { display: flex; align-items: center; gap: 8px; padding: 9px 13px; border-top: 1px solid var(--line-soft); background: #fbfcfe; } +.proto-root .jc-fc-sp { flex: 1; } +.proto-root .jc-fc-open { width: 100%; justify-content: center; } +/* 说明 / 建议 */ +.proto-root .jc-fc-q { margin: 0; font-size: 12.5px; line-height: 1.7; color: var(--ink); } +.proto-root .jc-fc-q.strong { font-size: 13px; font-weight: 700; } +.proto-root .jc-fc-note { display: flex; gap: 7px; margin: 0; padding: 8px 11px; background: var(--fc-soft); border-radius: 8px; font-size: 12px; line-height: 1.6; color: var(--ink-2); } +.proto-root .jc-fc-note svg { flex: none; margin-top: 2px; color: var(--fc); } +.proto-root .jc-fc-note b { margin-right: 6px; color: var(--fc); } +/* 参考信息：卡内 kv 表（结构化，不是散落小票） */ +.proto-root .jc-fc-kv > i { display: block; margin-bottom: 5px; font-style: normal; font-size: 9.5px; font-weight: 800; letter-spacing: .08em; color: var(--ink-4); } +.proto-root .jc-fc-kv-g { display: grid; grid-template-columns: repeat(auto-fit, minmax(126px, 1fr)); gap: 1px; background: var(--line-soft); border: 1px solid var(--line-soft); border-radius: 9px; overflow: hidden; } +.proto-root .jc-fc-kv-g span { display: flex; flex-direction: column; gap: 1px; padding: 6px 10px 7px; background: #fbfcfe; } +.proto-root .jc-fc-kv-g em { font-style: normal; font-size: 9px; font-weight: 800; letter-spacing: .06em; color: var(--ink-4); } +.proto-root .jc-fc-kv-g b { font-size: 11px; font-weight: 700; color: var(--ink); line-height: 1.5; } +/* 验收单里的报告入口（成果本体在视图区） */ +.proto-root .jc-fc-doc { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; padding: 9px 11px; background: var(--soft); border: 1px solid var(--line-soft); border-radius: 10px; cursor: pointer; transition: all var(--t-fast); } +.proto-root .jc-fc-doc:hover { border-color: var(--fc); background: #fff; box-shadow: var(--shadow-1); } +.proto-root .jc-fc-doc-ico { flex: none; width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; color: #fff; background: var(--fc); } +.proto-root .jc-fc-doc-bd { flex: 1; min-width: 0; } +.proto-root .jc-fc-doc-bd em { display: block; font-style: normal; font-size: 9.5px; font-weight: 800; letter-spacing: .05em; color: var(--ink-4); } +.proto-root .jc-fc-doc-bd b { display: block; margin-top: 1px; font-size: 12.5px; font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-fc-doc > svg { flex: none; color: var(--ink-4); transition: transform var(--t-fast); } +.proto-root .jc-fc-doc:hover > svg { transform: translateX(2px); color: var(--fc); } +/* 判据表（卡内紧凑版） */ +.proto-root .jc-fc .jc-rp-crit.sm li { padding: 6px 11px; font-size: 11.5px; } + +/* 决策选项（卡内） */ +.proto-root .jc-tch .jc-branches { margin: 0; display: flex; flex-direction: column; gap: 7px; } +.proto-root .jc-tch .jc-branch { display: flex; align-items: flex-start; gap: 9px; transition: border-color var(--t-fast), background var(--t-fast), transform var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-tch .jc-branch:hover { border-color: var(--fc, var(--st-decision)); background: var(--fc-soft, var(--st-decision-soft)); transform: translateX(3px); box-shadow: var(--shadow-1); } +.proto-root .jc-tch .jc-branch:active { transform: translateX(3px) scale(.985); } +.proto-root .jc-branch-n { flex: none; width: 20px; height: 20px; margin-top: 1px; border-radius: 6px; display: grid; place-items: center; font-size: 10.5px; font-weight: 800; color: var(--ink-4); background: var(--soft); border: 1px solid var(--line-soft); transition: all var(--t-fast); } +.proto-root .jc-tch .jc-branch:hover .jc-branch-n { color: #fff; background: var(--fc, var(--st-decision)); border-color: var(--fc, var(--st-decision)); } +.proto-root .jc-branch-bd { flex: 1; min-width: 0; } +.proto-root .jc-tch .jc-branch > svg { flex: none; margin-top: 4px; color: var(--ink-4); opacity: 0; transform: translateX(-4px); transition: all var(--t-fast); } +.proto-root .jc-tch .jc-branch:hover > svg { opacity: 1; transform: none; color: var(--fc, var(--st-decision)); } +.proto-root .jc-tch .jc-branch.rec { border-color: var(--fc, var(--st-decision)); background: linear-gradient(135deg, var(--fc-soft, var(--st-decision-soft)), #fff 65%); } +.proto-root .jc-tch .jc-branch.rec .jc-branch-n { color: #fff; background: var(--fc, var(--st-decision)); border-color: var(--fc, var(--st-decision)); } +.proto-root .jc-conseq { display: flex; align-items: center; gap: 4px; color: var(--ink-4); } +/* 自定义收尾项 */ +.proto-root .jc-branch-custom { border-style: dashed; cursor: default; } +.proto-root .jc-branch-custom:hover { transform: none; box-shadow: none; } +.proto-root .jc-custom-row { display: flex; gap: 7px; margin-top: 7px; } +.proto-root .jc-custom-row input { flex: 1; min-width: 0; border: 1px solid var(--line); border-radius: 8px; padding: 7px 10px; font-size: 12px; outline: none; transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-custom-row input:focus { border-color: var(--fc, var(--st-decision)); box-shadow: 0 0 0 3px var(--fc-soft, var(--st-decision-soft)); } +.proto-root .jc-custom-row .jc-btn { flex: none; } + +/* 已选/已补/没法填 */ +.proto-root .jc-tch .jc-chosen { margin: 0; padding: 8px 11px; background: var(--ok-soft); border: 1px solid #bfedb4; border-radius: 8px; animation: jcMsgIn var(--t-med) both; } +.proto-root .jc-tch .jc-chosen b { color: var(--ink); } +.proto-root .jc-tch .jc-chosen code { margin-left: auto; font-size: 10px; color: var(--ink-4); } +.proto-root .jc-tch .jc-chosen.cant { background: var(--st-execute-soft); border-color: #f0d9b8; color: var(--st-execute); } + +/* 补全表单的两条路 */ +.proto-root .jc-cfill-acts { display: flex; align-items: center; gap: 8px; } +.proto-root .jc-cfill-acts .jc-btn { margin-left: auto; } +.proto-root .jc-cant-link { border: 0; background: none; padding: 2px 2px; font-size: 11px; color: var(--ink-4); cursor: pointer; text-decoration: underline dashed; text-underline-offset: 3px; } +.proto-root .jc-cant-link:hover { color: var(--brand); } + +/* composer 锁：卡未办完不能对话 */ +.proto-root .jc-comp-lock { display: flex; align-items: center; gap: 6px; padding: 6px 11px; background: var(--st-execute-soft); border: 1px solid #f0d9b8; border-radius: 9px; font-size: 11px; font-weight: 600; color: var(--st-execute); animation: jcMsgIn var(--t-fast) both; } +.proto-root .session-composer textarea:disabled { background: var(--soft); color: var(--ink-4); cursor: not-allowed; } + +/* AI 输入中 */ +.proto-root .jc-typing { display: inline-flex; gap: 4px; padding: 8px 12px; background: #fff; border: 1px solid var(--line-soft); border-radius: 4px 14px 14px 14px; } +.proto-root .jc-typing i { width: 6px; height: 6px; border-radius: 999px; background: var(--ink-4); opacity: .4; animation: jcTyping 1.1s ease-in-out infinite; } +.proto-root .jc-typing i:nth-child(2) { animation-delay: .18s; } +.proto-root .jc-typing i:nth-child(3) { animation-delay: .36s; } +@keyframes jcTyping { 0%, 60%, 100% { transform: none; opacity: .35; } 30% { transform: translateY(-4px); opacity: 1; } } + +/* 头部与输入区 */ +.proto-root .jc-tch-head { background: #fff; } +.proto-root .session-composer { background: #fff; } +.proto-root .session-composer .composer-row textarea { border: 1.5px solid var(--line); border-radius: 12px; padding: 10px 13px; font-size: 13px; line-height: 1.6; color: var(--ink); background: #fff; outline: none; resize: none; transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .session-composer .composer-row textarea:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-wash); } +.proto-root .session-composer .copilot-send { background: var(--ai-grad); border-radius: 12px; transition: box-shadow var(--t-fast), transform var(--t-fast), filter var(--t-fast); } +.proto-root .session-composer .copilot-send:hover:not(:disabled) { background: var(--ai-grad); filter: brightness(1.07); box-shadow: var(--shadow-brand); transform: translateY(-1px); } +.proto-root .session-composer .copilot-send:active:not(:disabled) { transform: scale(.97); } + +/* ══ 补全信息卡的小表单：就地作答 ══ */ +.proto-root .jc-cfill { display: flex; flex-direction: column; gap: 8px; margin-top: 9px; } +.proto-root .jc-cfill-f { display: flex; flex-direction: column; gap: 4px; } +.proto-root .jc-cfill-f span { font-size: 11px; font-weight: 700; color: var(--ink-3); } +.proto-root .jc-cfill-f input { border: 1px solid var(--line); border-radius: 8px; padding: 7px 11px; font-size: 12.5px; color: var(--ink); background: #fff; outline: none; transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-cfill-f input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-wash); } +.proto-root .jc-cfill > .jc-btn { align-self: flex-end; } + +/* ══ 上传控件（执行工单：真填空、真上传） ══ */ +.proto-root .jc-up { display: flex; flex-direction: column; gap: 7px; } +.proto-root .jc-up-drop { position: relative; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 15px 12px; border: 1.5px dashed var(--line); border-radius: 10px; background: var(--soft); color: var(--ink-4); font-size: 12px; font-weight: 600; cursor: pointer; transition: border-color var(--t-fast), color var(--t-fast), background var(--t-fast); } +.proto-root .jc-up-drop:hover { border-color: var(--brand); color: var(--brand); background: var(--brand-wash); } +.proto-root .jc-up-drop input { position: absolute; inset: 0; opacity: 0; cursor: pointer; } +.proto-root .jc-up-chip { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; padding: 4px 11px; border: 1px solid var(--line-soft); border-radius: 999px; background: #fff; font-size: 11.5px; color: var(--ink-2); } +.proto-root .jc-up-chip svg { color: var(--brand); } +.proto-root .jc-up-chip button { border: 0; background: none; padding: 0 0 0 2px; font-size: 13px; line-height: 1; color: var(--ink-4); cursor: pointer; } +.proto-root .jc-up-chip button:hover { color: var(--danger); } + +/* ══ 视图区微交互（2026-07-26 晚）══ */ +/* 报告章节入场级差 */ +.proto-root .jc-report .jc-rp-s { animation: rise var(--t-med) both; } +.proto-root .jc-report .jc-rp-s:nth-of-type(2) { animation-delay: .05s; } +.proto-root .jc-report .jc-rp-s:nth-of-type(3) { animation-delay: .1s; } +/* 指标带悬停点亮 */ +.proto-root .jc-rp-stat { transition: background var(--t-fast); } +.proto-root .jc-rp-stat:hover { background: #fff; } +/* 表格行悬停 */ +.proto-root .jc-tbl tbody tr { transition: background var(--t-fast); } +.proto-root .jc-tbl tbody tr:hover { background: var(--brand-wash); } +/* 判据行悬停 */ +.proto-root .jc-rp-crit li { transition: background var(--t-fast); } +.proto-root .jc-rp-crit li:hover { background: var(--soft); } +/* 单选/复选选中弹一下 */ +.proto-root .jc-radio.on svg, .proto-root .jc-check.on .jc-check-box svg { animation: jcPop var(--t-fast) both; } +@keyframes jcPop { from { transform: scale(.5); } 60% { transform: scale(1.25); } to { transform: none; } } +/* 提交钮：渐变 + 悬浮 */ +.proto-root .jc-rp-submit { background: var(--ai-grad); border: 0; } +.proto-root .jc-rp-submit:hover:not(:disabled) { filter: brightness(1.07); box-shadow: var(--shadow-brand); transform: translateY(-1px); } +/* 印章入场：盖下去 */ +.proto-root .jc-rp-stamp { animation: jcStamp .32s cubic-bezier(.2, 1.4, .4, 1) both; } +@keyframes jcStamp { from { opacity: 0; transform: rotate(-6deg) scale(1.7); } to { opacity: .9; transform: rotate(-6deg) scale(1); } } +/* 流程图节点悬停 */ +.proto-root .jc-wfg-n { transition: box-shadow var(--t-fast), transform var(--t-fast); } +.proto-root .jc-wfg-n:hover { transform: translateY(-1px); box-shadow: var(--shadow-1); } + +/* ══ 视图区结构件（2026-07-26 重做）══ */ +/* （旧分段器规则已清——现行导航样式在「页签靠左 + 右侧场景控制位」块） */ + +/* 报告内部件分隔：小题字 + 细线 + 右注 */ +.proto-root .jc-rp-bd { padding: 14px 20px 6px; } +.proto-root .jc-rp-part { display: flex; align-items: center; gap: 9px; margin: 16px 0 11px; } +.proto-root .jc-rp-part:first-child { margin-top: 0; } +.proto-root .jc-rp-part > b { flex: none; font-size: 11px; font-weight: 800; letter-spacing: .12em; color: var(--ink-3); } +.proto-root .jc-rp-part > .ln { flex: 1; height: 1px; background: var(--line-soft); } +.proto-root .jc-rp-part > em { flex: none; max-width: 46%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-style: normal; font-size: 10px; font-weight: 700; color: var(--ink-4); font-family: var(--mono); background: var(--soft); border-radius: 999px; padding: 2px 9px; } + +/* 编辑报告开关：AI 填好 → 人一键启动全字段编辑 */ +.proto-root .jc-rp-editbtn { display: inline-flex; align-items: center; gap: 5px; flex: none; margin-top: 2px; padding: 6px 13px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink-2); font-size: 12px; font-weight: 700; cursor: pointer; transition: all var(--t-fast); } +.proto-root .jc-rp-editbtn:hover { border-color: var(--brand); color: var(--brand); background: var(--brand-wash); } +.proto-root .jc-rp-editbtn.on { border-color: var(--brand); background: var(--brand); color: #fff; box-shadow: var(--shadow-brand); } +.proto-root .jc-rp-editbtn em { font-style: normal; font-size: 10px; font-weight: 800; font-family: var(--mono); background: var(--brand); color: #fff; border-radius: 999px; padding: 0 6px; } +.proto-root .jc-mod { display: inline-block; margin-left: 7px; font-style: normal; font-size: 9.5px; font-weight: 800; color: var(--st-execute); background: var(--st-execute-soft); border-radius: 999px; padding: 1px 7px; vertical-align: 1px; } + +/* 卡组二 · 作业指导书 / 验收判据：与报告分明的第二组内嵌卡 */ +.proto-root .jc-side { margin-top: 12px; border-radius: 14px; overflow: hidden; border: 1px solid var(--line-soft); background: #fff; box-shadow: var(--card-shadow); animation: rise var(--t-med) .06s both; } +.proto-root .jc-side-h { display: flex; align-items: center; gap: 8px; padding: 10px 15px; } +.proto-root .jc-side-exe .jc-side-h { background: linear-gradient(90deg, var(--st-execute-soft), #fff 80%); border-bottom: 1px solid color-mix(in srgb, var(--st-execute) 16%, transparent); } +.proto-root .jc-side-acc .jc-side-h { background: linear-gradient(90deg, var(--st-collab-soft), #fff 80%); border-bottom: 1px solid color-mix(in srgb, var(--st-collab) 16%, transparent); } +.proto-root .jc-side-ico { flex: none; width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; color: #fff; } +.proto-root .jc-side-exe .jc-side-ico { background: var(--st-execute); } +.proto-root .jc-side-acc .jc-side-ico { background: var(--st-collab); } +.proto-root .jc-side-h b { flex: 1; font-size: 13px; font-weight: 800; color: var(--ink); letter-spacing: .02em; } +.proto-root .jc-side-h em { flex: none; font-style: normal; font-size: 10.5px; font-weight: 800; font-family: var(--mono); color: var(--ink-4); background: #fff; border: 1px solid var(--line-soft); border-radius: 999px; padding: 2px 9px; } +.proto-root .jc-side-h em.ok { color: var(--ok); border-color: #bfedb4; background: var(--ok-soft); } +.proto-root .jc-side-h em.bad { color: var(--danger); border-color: #f9c1be; background: var(--danger-soft); } +.proto-root .jc-side-b { padding: 13px 15px 15px; display: flex; flex-direction: column; gap: 11px; } +.proto-root .jc-side-b .jc-steps { margin: 0; } +.proto-root .jc-side-b .jc-rp-std { margin: 0; } +.proto-root .jc-side-ask { margin: 0; font-size: 12.5px; color: var(--ink-2); line-height: 1.7; } +.proto-root .jc-side-b .jc-rp-eff { margin: 0; } + +/* ══ 细节修（2026-07-26）══ */ +/* 列表区收起后的展开按钮：悬浮在工作面左上，与标题区首行对齐 */ +/* 列表区收起后的展开把手：贴在边导航右缘、垂直居中的细长半药丸，只占工作面左留白缝，不入侵标题区 */ +.proto-root .jc-wl-expand { position: absolute; left: 0; top: 20px; z-index: 6; width: 12px; height: 30px; display: grid; place-items: center; padding: 0; border: 1px solid var(--line); border-left: none; border-radius: 0 8px 8px 0; background: #fff; color: var(--ink-3); cursor: pointer; box-shadow: var(--shadow-1); transition: width var(--t-fast), color var(--t-fast), background var(--t-fast); } +.proto-root .jc-wl-expand svg { display: block; } +.proto-root .jc-wl-expand:hover { width: 14px; color: var(--brand); background: var(--brand-wash); border-color: var(--brand-soft); } + +/* 页签徽标：只有待处理挂**红色**未完成气泡，其余页签不带数字 */ +.proto-root .jc-wv-tab em.hot { min-width: 17px; height: 17px; padding: 0 5px; display: inline-grid; place-items: center; background: var(--danger); border: 0; border-radius: 999px; color: #fff; font-size: 10px; font-weight: 800; } +.proto-root .jc-wv-tab.active em.hot { background: var(--danger); color: #fff; } + +/* 报告头的翻页囊（与「编辑」胶囊同风格） */ +.proto-root .jc-rp-pgr { display: inline-flex; align-items: center; gap: 2px; flex: none; margin-top: 2px; padding: 3px 4px; border: 1px solid var(--line); border-radius: 999px; background: #fff; } +.proto-root .jc-rp-pgr button { width: 24px; height: 24px; display: grid; place-items: center; border: 0; border-radius: 999px; background: transparent; color: var(--ink-3); cursor: pointer; transition: all var(--t-fast); } +.proto-root .jc-rp-pgr button:hover:not(:disabled) { background: var(--brand-wash); color: var(--brand); } +.proto-root .jc-rp-pgr button:disabled { opacity: .3; cursor: default; } +.proto-root .jc-rp-pgr > b { padding: 0 5px; font-size: 10.5px; font-weight: 800; color: var(--ink-3); } + +/* ══ 对话区精修（去粗糙感）══ */ +.proto-root .jc-tch-head { border-bottom: 1px solid var(--line-soft); } +.proto-root .jc-tch .chat-avatar { box-shadow: 0 0 0 2px #fff, 0 2px 6px rgba(31,35,41,.08); } +.proto-root .jc-ag { gap: 10px; } +.proto-root .jc-msg-meta { gap: 7px; padding-left: 3px; } +.proto-root .jc-ag-b { border-color: #e8ebf0; border-radius: 6px 16px 16px 16px; padding: 11px 14px; box-shadow: 0 1px 2px rgba(31,35,41,.03), 0 4px 16px rgba(31,35,41,.05); } +.proto-root .session-chat .copilot-msg.human .copilot-bubble { border-radius: 16px 6px 16px 16px; } +.proto-root .jc-ag-b > .jc-fc { margin-top: 10px; border-radius: 12px; border-color: color-mix(in srgb, var(--fc) 18%, #e8ebf0); } +.proto-root .jc-fc-h { padding: 8px 14px 7px; } +.proto-root .jc-fc-h em { border: 1px solid color-mix(in srgb, var(--fc) 20%, transparent); } +.proto-root .jc-fc-b { padding: 12px 14px; gap: 11px; } +.proto-root .jc-fc-ft { padding: 10px 14px; } +.proto-root .jc-fc .jc-btn { padding: 7px 15px; font-size: 12.5px; border-radius: 9px; } +.proto-root .jc-fc-kv-g { border-radius: 10px; } +.proto-root .jc-fc-kv-g span { padding: 7px 11px 8px; background: #fcfdfe; } +.proto-root .jc-tch .jc-branch { border-radius: 10px; padding: 10px 12px; border-color: #e6e9ef; background: #fcfdfe; } +.proto-root .jc-tch .jc-note { border: 1px solid var(--line); border-radius: 9px; padding: 8px 11px; font-size: 12px; line-height: 1.6; color: var(--ink); background: #fff; outline: none; resize: vertical; min-height: 54px; transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-tch .jc-note:focus { border-color: var(--fc, var(--brand)); box-shadow: 0 0 0 3px var(--fc-soft, var(--brand-wash)); } +.proto-root .jc-tch .jc-chosen { border-radius: 9px; font-size: 12px; align-items: center; } +.proto-root .jc-cfill-f input { border: 1px solid var(--line); border-radius: 9px; padding: 8px 11px; font-size: 12.5px; outline: none; transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-cfill-f input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-wash); } +.proto-root .jc-cfill-f > span { font-size: 11px; font-weight: 700; color: var(--ink-3); } +.proto-root .jc-cfill { gap: 9px; } + +/* 动作栏成对按钮（修改/提交 · 保存/取消 同一处、同风格） */ +.proto-root .jc-rp-acts2 { display: flex; gap: 8px; margin-left: auto; } +.proto-root .jc-rp-act { margin-left: auto; } + +/* ══ 工作流详情（三版）：蛇形流程图 + 信息卡 + 运行仪表 ══ */ +.proto-root .jc-wfd-sec { display: flex; align-items: center; gap: 8px; margin: 18px 0 12px; } +.proto-root .jc-wfd-sec:first-child { margin-top: 2px; } +.proto-root .jc-wfd-sec-ico { flex: none; width: 22px; height: 22px; border-radius: 7px; display: grid; place-items: center; background: var(--brand-wash); color: var(--brand); } +.proto-root .jc-wfd-sec b { flex: none; font-size: 11px; font-weight: 800; letter-spacing: .12em; color: var(--ink-3); } +.proto-root .jc-wfd-sec .ln { flex: 1; height: 1px; background: var(--line-soft); } + +/* ── 当前节点内部阶段：并在画布卡内的横向步进条（同卡同底，仅一条分隔线） ── */ +.proto-root .jc-stgwrap { margin: 0; padding: 12px 16px 14px; border-top: 1px solid var(--line-soft); background: #fff; border-radius: 0; } +.proto-root .jc-stgwrap-k { display: block; margin-bottom: 9px; font-size: 9.5px; font-weight: 800; letter-spacing: .12em; color: var(--ink-4); } +.proto-root .jc-stgbar { display: flex; align-items: center; gap: 7px; } +.proto-root .jc-stg-ln { flex: 1 1 12px; min-width: 8px; height: 2px; border-radius: 2px; background: var(--line); } +.proto-root .jc-stg-ln.on { background: var(--brand); } +.proto-root .jc-stg2 { display: flex; align-items: center; gap: 7px; min-width: 0; padding: 6px 10px; background: #fff; border: 1px solid var(--line-soft); border-radius: 10px; } +.proto-root .jc-stg2.s-cur { border-color: var(--brand); box-shadow: 0 2px 8px rgba(51,112,255,.14); } +.proto-root .jc-stg2.s-done { opacity: .85; } +.proto-root .jc-stg2-n { flex: none; width: 18px; height: 18px; border-radius: 999px; display: grid; place-items: center; font-size: 10px; font-weight: 800; font-family: var(--mono); background: var(--soft); border: 1px solid var(--line-soft); color: var(--ink-4); } +.proto-root .jc-stg2.s-done .jc-stg2-n { background: var(--ok); border-color: var(--ok); color: #fff; } +.proto-root .jc-stg2.s-cur .jc-stg2-n { background: var(--brand); border-color: var(--brand); color: #fff; } +.proto-root .jc-stg2-t { min-width: 0; display: flex; flex-direction: column; } +.proto-root .jc-stg2-t b { font-size: 11.5px; font-weight: 700; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-stg2.s-cur .jc-stg2-t b { color: var(--brand-deep); } +.proto-root .jc-stg2-t > span { font-size: 9px; color: var(--ink-4); white-space: nowrap; } +.proto-root .jc-stg2.s-cur .jc-stg2-t > span { color: var(--brand); font-weight: 700; } + +/* ── 上下文信息卡 ── */ +.proto-root .jc-ctx2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; } +.proto-root .jc-ctx2-c { display: flex; gap: 11px; padding: 13px 14px; background: #fff; border: 1px solid var(--line-soft); border-radius: 14px; box-shadow: var(--card-shadow); transition: transform var(--t-fast), box-shadow var(--t-fast), border-color var(--t-fast); } +.proto-root .jc-ctx2-c:hover { transform: translateY(-1px); border-color: var(--brand-soft); box-shadow: var(--shadow-2); } +.proto-root .jc-ctx2-ico { flex: none; width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; } +.proto-root .jc-ctx2-ico.i-brand { background: var(--brand-wash); color: var(--brand); } +.proto-root .jc-ctx2-ico.i-violet { background: var(--st-decision-soft); color: var(--st-decision); } +.proto-root .jc-ctx2-ico.i-teal { background: var(--st-collab-soft); color: var(--st-collab); } +.proto-root .jc-ctx2-ico.i-amber { background: var(--st-execute-soft); color: var(--st-execute); } +.proto-root .jc-ctx2-ico.i-ink { background: var(--soft); color: var(--ink-3); } +.proto-root .jc-ctx2-bd { flex: 1; min-width: 0; } +.proto-root .jc-ctx2-bd > i { display: block; margin-bottom: 4px; font-style: normal; font-size: 9.5px; font-weight: 800; letter-spacing: .1em; color: var(--ink-4); } +.proto-root .jc-ctx2-bd p { margin: 0 0 2px; font-size: 12px; color: var(--ink); line-height: 1.62; } +.proto-root .jc-ctx2-bd p.dim { color: var(--ink-4); font-size: 11px; } +.proto-root .jc-ctx2-bd ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 5px; } +.proto-root .jc-ctx2-bd li { font-size: 11.5px; line-height: 1.5; } +.proto-root .jc-ctx2-bd li b { display: block; color: var(--ink); } +.proto-root .jc-ctx2-bd li span { color: var(--ink-4); } + +/* ── 流程链：节点卡**一条线横铺**（左→右自然折行，不做蛇形反向），容器与上下文/仪表同一卡体 ── */ +.proto-root .jc-wfg2 { display: flex; flex-wrap: wrap; gap: 12px 10px; padding: 16px; background: #fff; border: 1px solid var(--line-soft); border-radius: 14px; box-shadow: var(--card-shadow); } +.proto-root .jc-wfg2 > .jc-map-n { flex: 1 1 122px; min-width: 116px; max-width: 200px; } +/* 节点卡 */ +.proto-root .jc-map-n { position: relative; display: flex; flex-direction: column; gap: 3px; padding: 9px 11px 8px; background: #fff; border: 1.5px solid var(--line); border-radius: 12px; box-shadow: 0 1px 2px rgba(31,35,41,.04); transition: transform var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-map-n:hover { transform: translateY(-1px); box-shadow: var(--shadow-1); } +.proto-root .jc-map-n.s-done { border-color: #cdeac4; background: linear-gradient(180deg, #fff 55%, var(--ok-soft)); } +.proto-root .jc-map-n.s-todo { border-style: dashed; opacity: .78; } +.proto-root .jc-map-n.s-cur { border-color: var(--brand); background: linear-gradient(180deg, #fff 40%, var(--brand-wash)); box-shadow: 0 0 0 4px rgba(51,112,255,.12), 0 6px 18px rgba(51,112,255,.16); } +.proto-root .jc-map-n.apr { border-color: #e7d4ab; background: linear-gradient(180deg, #fff 45%, #fbf0dc); } +.proto-root .jc-map-nh { display: flex; align-items: center; justify-content: space-between; gap: 6px; } +.proto-root .jc-map-nh em { font-size: 9.5px; font-weight: 800; letter-spacing: .06em; color: var(--ink-4); } +.proto-root .jc-map-n.s-cur .jc-map-nh em { color: var(--brand); } +.proto-root .jc-map-ok { width: 16px; height: 16px; border-radius: 999px; display: grid; place-items: center; background: var(--ok); color: #fff; } +.proto-root .jc-map-ap { color: #b98432; } +.proto-root .jc-map-n > b { font-size: 12px; font-weight: 700; color: var(--ink-2); line-height: 1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-map-n.s-cur > b { color: var(--ink); } +.proto-root .jc-map-who { display: inline-flex; align-items: center; gap: 5px; font-size: 10px; color: var(--ink-4); } +.proto-root .jc-map-who i { width: 15px; height: 15px; border-radius: 999px; display: grid; place-items: center; font-style: normal; font-size: 8.5px; font-weight: 700; color: #fff; background: var(--ink-4); } +.proto-root .jc-map-n.s-cur .jc-map-who i { background: var(--brand); } +.proto-root .jc-map-n.apr .jc-map-who i { background: #b98432; } +/* 「你在这」浮标 */ +.proto-root .jc-map-me { position: absolute; top: -10px; left: 50%; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; background: var(--brand); color: #fff; font-size: 9.5px; font-weight: 800; border-radius: 999px; box-shadow: var(--shadow-brand); white-space: nowrap; z-index: 1; } +.proto-root .jc-map-me .jc-pulse-dot { background: #fff; width: 5px; height: 5px; } +/* 行内箭头 */ +.proto-root .jc-map-arr { position: relative; align-self: center; height: 2px; background: var(--line); margin: 0 3px; } +.proto-root .jc-map-arr::after { content: ""; position: absolute; top: -3.5px; right: -1px; border: 4.5px solid transparent; border-left: 6px solid var(--line); border-right: 0; } +.proto-root .jc-map-arr.la::after { right: auto; left: -1px; border-left: 0; border-right: 6px solid var(--line); } +.proto-root .jc-map-arr.ghost { visibility: hidden; } +/* 行间折返箭头（贴折返侧节点中线） */ +.proto-root .jc-map-turn { display: flex; height: 24px; padding: 3px 0; } +.proto-root .jc-map-turn.r { justify-content: flex-end; padding-right: calc((100% - 48px) / 6); } +.proto-root .jc-map-turn.l { justify-content: flex-start; padding-left: calc((100% - 48px) / 6); } +.proto-root .jc-map-varr { position: relative; width: 2px; background: var(--line); } +.proto-root .jc-map-varr::after { content: ""; position: absolute; bottom: -1px; left: -3.5px; border: 4.5px solid transparent; border-top: 6px solid var(--line); border-bottom: 0; } +.proto-root .jc-wfd-pos { display: inline-flex; align-items: center; gap: 6px; flex: none; font-size: 10.5px; font-weight: 800; color: var(--brand-deep); background: var(--brand-wash); border: 1px solid var(--brand-soft); border-radius: 999px; padding: 3px 11px; } + +/* ── 运行仪表：与其余三段同一卡体（白卡），数字大而克制，条与分段用既有语义色 ── */ +.proto-root .jc-cockpit { display: flex; align-items: stretch; gap: 16px; padding: 14px 16px 15px; background: #fff; border: 1px solid var(--line-soft); border-radius: 14px; box-shadow: var(--card-shadow); overflow: hidden; } +.proto-root .jc-ck-div { flex: none; width: 1px; background: var(--line-soft); } +.proto-root .jc-ck-cell { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 6px; } +.proto-root .jc-ck-cell.wide { flex: 1.7 1 0; } +.proto-root .jc-ck-k { display: inline-flex; align-items: center; gap: 5px; font-style: normal; font-size: 9.5px; font-weight: 800; letter-spacing: .12em; color: var(--ink-4); } +.proto-root .jc-ck-k svg { color: var(--brand); } +.proto-root .jc-ck-main { display: flex; align-items: baseline; gap: 7px; flex-wrap: wrap; } +.proto-root .jc-ck-main b { white-space: nowrap; font-size: 19px; font-weight: 800; letter-spacing: -.01em; color: var(--ink); } +.proto-root .jc-ck-main em { font-style: normal; font-size: 9.5px; color: var(--ink-4); white-space: nowrap; } +.proto-root .jc-ck-sub { display: flex; align-items: baseline; gap: 6px; font-size: 10.5px; color: var(--ink-3); white-space: nowrap; } +.proto-root .jc-ck-sub b { font-size: 12.5px; font-weight: 800; color: var(--ink-2); } +.proto-root .jc-ck-sub u { text-decoration: none; color: var(--ink-4); font-size: 9.5px; } +.proto-root .jc-ck-bar { display: block; height: 4px; border-radius: 999px; background: var(--line-soft); overflow: hidden; } +.proto-root .jc-ck-bar i { display: block; height: 100%; border-radius: 999px; background: var(--brand); transition: width var(--t-med); } +.proto-root .jc-ck-bar.t-warm i { background: #e8a33d; } +.proto-root .jc-ck-bar.t-hot i { background: var(--danger); } +/* 模型分布：分段条 + 图例（既有语义色，平色不发光） */ +.proto-root .jc-ck-stack { display: flex; height: 9px; border-radius: 999px; overflow: hidden; background: var(--line-soft); } +.proto-root .jc-ck-stack i { display: block; height: 100%; } +.proto-root .jc-ck-stack i + i { box-shadow: inset 2px 0 0 #fff; } +.proto-root .jc-ck-stack .t-brand { background: var(--brand); } +.proto-root .jc-ck-stack .t-ok { background: var(--ok); } +.proto-root .jc-ck-stack .t-warn { background: #e8a33d; } +.proto-root .jc-ck-stack .t-danger { background: var(--danger); } +.proto-root .jc-ck-stack .t-muted { background: var(--ink-4); } +.proto-root .jc-ck-lg { margin: 1px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 3px; } +.proto-root .jc-ck-lg li { display: flex; align-items: center; gap: 7px; font-size: 10.5px; color: var(--ink-2); } +.proto-root .jc-ck-lg em { flex: none; width: 8px; height: 8px; border-radius: 3px; } +.proto-root .jc-ck-lg em.t-brand { background: var(--brand); } +.proto-root .jc-ck-lg em.t-ok { background: var(--ok); } +.proto-root .jc-ck-lg em.t-warn { background: #e8a33d; } +.proto-root .jc-ck-lg em.t-danger { background: var(--danger); } +.proto-root .jc-ck-lg em.t-muted { background: var(--ink-4); } +.proto-root .jc-ck-lg span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-ck-lg b { flex: none; font-size: 10.5px; font-weight: 800; color: var(--ink); } +.proto-root .jc-ck-none { margin: 0; font-size: 11px; color: var(--ink-4); } + +/* ── 旧运行仪表（浅色，弃用类保留位） ── */ +.proto-root .jc-dash { display: grid; grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)); gap: 10px; } +.proto-root .jc-dash-c { display: flex; flex-direction: column; gap: 7px; padding: 12px 14px 13px; background: #fff; border: 1px solid var(--line-soft); border-radius: 13px; box-shadow: var(--card-shadow); transition: transform var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-dash-c:hover { transform: translateY(-1px); box-shadow: var(--shadow-2); } +.proto-root .jc-dash-c.wide { grid-column: 1 / -1; } +.proto-root .jc-dash-k { display: inline-flex; align-items: center; gap: 5px; font-style: normal; font-size: 10px; font-weight: 800; letter-spacing: .1em; color: var(--ink-4); } +.proto-root .jc-dash-k svg { color: var(--brand); } +.proto-root .jc-dash-row { display: flex; align-items: baseline; gap: 7px; } +.proto-root .jc-dash-row em { flex: none; width: 52px; font-style: normal; font-size: 10.5px; color: var(--ink-4); } +.proto-root .jc-dash-row b { font-size: 15px; font-weight: 800; color: var(--ink); letter-spacing: -.01em; } +.proto-root .jc-dash-row u { margin-left: auto; text-decoration: none; font-size: 10px; color: var(--ink-4); } +.proto-root .jc-dash-bar { display: block; height: 4px; border-radius: 999px; background: var(--line-soft); overflow: hidden; } +.proto-root .jc-dash-bar i { display: block; height: 100%; border-radius: 999px; background: var(--brand); transition: width var(--t-med); } +.proto-root .jc-dash-bar.t-warm i { background: #e8a33d; } +.proto-root .jc-dash-bar.t-hot i { background: var(--danger); } +/* 模型分布：分段条 + 图例 */ +.proto-root .jc-dash-stack { display: flex; height: 10px; border-radius: 999px; overflow: hidden; background: var(--line-soft); } +.proto-root .jc-dash-stack i { display: block; height: 100%; } +.proto-root .jc-dash-stack i + i { box-shadow: inset 2px 0 0 #fff; } +.proto-root .jc-dash-stack .t-brand { background: var(--brand); } +.proto-root .jc-dash-stack .t-ok { background: var(--ok); } +.proto-root .jc-dash-stack .t-warn { background: #e8a33d; } +.proto-root .jc-dash-stack .t-danger { background: var(--danger); } +.proto-root .jc-dash-stack .t-muted { background: var(--ink-4); } +.proto-root .jc-dash-lg { margin: 2px 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: 4px 16px; } +.proto-root .jc-dash-lg li { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; color: var(--ink-2); } +.proto-root .jc-dash-lg em { width: 8px; height: 8px; border-radius: 3px; } +.proto-root .jc-dash-lg em.t-brand { background: var(--brand); } +.proto-root .jc-dash-lg em.t-ok { background: var(--ok); } +.proto-root .jc-dash-lg em.t-warn { background: #e8a33d; } +.proto-root .jc-dash-lg em.t-danger { background: var(--danger); } +.proto-root .jc-dash-lg em.t-muted { background: var(--ink-4); } +.proto-root .jc-dash-lg b { margin-left: 2px; font-size: 10.5px; color: var(--ink-3); } + +/* 仪表 · 两维度小件 */ +.proto-root .jc-ck-duo { display: flex; gap: 22px; } +.proto-root .jc-ck-stat { display: flex; flex-direction: column; gap: 1px; min-width: 0; } +.proto-root .jc-ck-stat em { font-style: normal; font-size: 10px; color: var(--ink-4); } +.proto-root .jc-ck-stat b { font-size: 19px; font-weight: 800; letter-spacing: -.01em; color: var(--ink); white-space: nowrap; } +.proto-root .jc-ck-met { display: flex; flex-direction: column; gap: 4px; } +.proto-root .jc-ck-met + .jc-ck-met { margin-top: 6px; } +.proto-root .jc-ck-met-h { display: flex; align-items: baseline; gap: 7px; } +.proto-root .jc-ck-met-h em { font-style: normal; font-size: 10px; color: var(--ink-4); flex: 1; } +.proto-root .jc-ck-met-h b { font-size: 14px; font-weight: 800; color: var(--ink); } +.proto-root .jc-ck-met-h u { text-decoration: none; font-size: 9.5px; color: var(--ink-4); } + +/* ══ 工作流页 · 驾驶舱式（参考 KPI 看板范式）══ */ +/* KPI 指标带：四卡横排置顶；数值最大、名称次之、上下文最小 */ +.proto-root .jc-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(148px, 1fr)); gap: 10px; margin-bottom: 4px; } +.proto-root .jc-kpi { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px 12px; background: #fff; border: 1px solid var(--line-soft); border-radius: 14px; box-shadow: var(--card-shadow); transition: transform var(--t-fast), box-shadow var(--t-fast); } +.proto-root .jc-kpi:hover { transform: translateY(-1px); box-shadow: var(--shadow-2); } +.proto-root .jc-kpi-dim { display: inline-flex; align-items: center; gap: 4px; align-self: flex-start; font-size: 9px; font-weight: 800; letter-spacing: .08em; border-radius: 999px; padding: 1px 8px; } +.proto-root .jc-kpi-dim.d-wf { color: var(--brand); background: var(--brand-wash); } +.proto-root .jc-kpi-dim.d-act { color: var(--st-collab); background: var(--st-collab-soft); } +.proto-root .jc-kpi > em { margin-top: 3px; font-style: normal; font-size: 10px; font-weight: 700; color: var(--ink-4); letter-spacing: .04em; } +.proto-root .jc-kpi > b { font-size: 21px; font-weight: 800; letter-spacing: -.01em; color: var(--ink); line-height: 1.2; white-space: nowrap; } +.proto-root .jc-kpi > b i { font-style: normal; margin-left: 4px; font-size: 10.5px; font-weight: 700; color: var(--ink-4); } +.proto-root .jc-kpi > u { text-decoration: none; font-size: 9.5px; color: var(--ink-4); } +.proto-root .jc-kpi > .jc-ck-bar { margin-top: 4px; } + +/* 辅助层双列 */ +/* 按中栏实际宽度自适应（容器查询，聊天栏拖宽拖窄都跟手）： + 宽 → 窄扇形卡 + 宽档案卡并排；窄 → 堆叠、扇形图居中收拢 */ +.proto-root .wf-body { container-type: inline-size; } +.proto-root .jc-duo2 { display: grid; grid-template-columns: 244px minmax(0, 1fr); gap: 10px; margin-top: 14px; align-items: stretch; } +@container (max-width: 640px) { + .proto-root .jc-duo2 { grid-template-columns: 1fr; } + .proto-root .jc-mdonut { justify-content: center; } +} +.proto-root .jc-panel { display: flex; flex-direction: column; gap: 10px; padding: 13px 15px 14px; background: #fff; border: 1px solid var(--line-soft); border-radius: 14px; box-shadow: var(--card-shadow); } +.proto-root .jc-panel-h { display: flex; align-items: center; gap: 7px; } +.proto-root .jc-panel-ico { flex: none; width: 20px; height: 20px; border-radius: 6px; display: grid; place-items: center; background: var(--brand-wash); color: var(--brand); } +.proto-root .jc-panel-h b { flex: 1; font-size: 11px; font-weight: 800; letter-spacing: .1em; color: var(--ink-3); } +.proto-root .jc-panel-h em { font-style: normal; font-size: 9.5px; color: var(--ink-4); } + +/* 上下文档案卡：分行收纳（图标 · 标签 · 内容），行间发丝线 */ +.proto-root .jc-file-rows { display: flex; flex-direction: column; } +.proto-root .jc-file-row { display: flex; gap: 10px; padding: 8px 0; } +.proto-root .jc-file-row + .jc-file-row { border-top: 1px solid var(--line-soft); } +.proto-root .jc-file-row > i { flex: none; width: 24px; height: 24px; margin-top: 1px; border-radius: 7px; display: grid; place-items: center; background: var(--soft); color: var(--ink-3); } +.proto-root .jc-file-row > em { flex: none; width: 64px; margin-top: 3px; font-style: normal; font-size: 10px; font-weight: 800; color: var(--ink-4); letter-spacing: .04em; } +.proto-root .jc-file-row > p { flex: 1; min-width: 0; margin: 0; font-size: 12px; color: var(--ink); line-height: 1.6; } +.proto-root .jc-file-row > p > span { display: block; font-size: 10.5px; color: var(--ink-4); } +.proto-root .jc-file-in { display: block; font-size: 11.5px; color: var(--ink-4); } +.proto-root .jc-file-in b { margin-right: 6px; color: var(--ink); font-weight: 700; } + +/* 模型分布扇形图（复用报告环图几何）：窄卡竖排——图居中在上、图例整行在下 */ +.proto-root .jc-mdonut { padding: 2px 0 0; flex-direction: column; align-items: center; gap: 10px; } +.proto-root .jc-mdonut .jc-donut-lg { gap: 6px; width: 100%; } +.proto-root .jc-mdonut .jc-donut-lg li { display: flex; align-items: center; gap: 7px; } +.proto-root .jc-mdonut .jc-donut-lg span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } + +/* ══ 空占位（待处理 / 已完成）：层叠光环 + 图标 + 主副文 + 提示囊 ══ */ +.proto-root .jc-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 58px 24px 64px; text-align: center; animation: rise var(--t-med) both; } +.proto-root .jc-empty-art { position: relative; width: 108px; height: 108px; margin-bottom: 6px; } +.proto-root .jc-empty-art i { position: absolute; border-radius: 999px; } +.proto-root .jc-empty-art .r1 { inset: 0; opacity: .55; } +.proto-root .jc-empty-art .r2 { inset: 16px; opacity: .8; } +.proto-root .jc-empty.t-ok .r1 { background: radial-gradient(circle, var(--ok-soft), transparent 72%); } +.proto-root .jc-empty.t-ok .r2 { background: var(--ok-soft); } +.proto-root .jc-empty.t-brand .r1 { background: radial-gradient(circle, var(--brand-wash), transparent 72%); } +.proto-root .jc-empty.t-brand .r2 { background: var(--brand-wash); } +.proto-root .jc-empty-ico { position: absolute; inset: 30px; display: grid; place-items: center; background: #fff; border-radius: 999px; box-shadow: 0 4px 14px rgba(31,35,41,.1); } +.proto-root .jc-empty.t-ok .jc-empty-ico { color: var(--ok); } +.proto-root .jc-empty.t-brand .jc-empty-ico { color: var(--brand); } +.proto-root .jc-empty > b { font-size: 15px; font-weight: 800; color: var(--ink); } +.proto-root .jc-empty > p { margin: 0; max-width: 30em; font-size: 12px; color: var(--ink-3); line-height: 1.8; } +.proto-root .jc-empty-hint { display: inline-flex; align-items: center; gap: 5px; margin-top: 6px; padding: 5px 13px; background: var(--soft); border: 1px solid var(--line-soft); border-radius: 999px; font-size: 11px; font-weight: 600; color: var(--ink-3); } +.proto-root .jc-empty-hint svg { color: var(--brand); } + +/* ══ 任务助理头（对话区） ══ */ +.proto-root .jc-tch-mark { flex: none; width: 27px; height: 27px; border-radius: 9px; display: grid; place-items: center; color: #fff; background: var(--ai-grad); box-shadow: var(--shadow-brand); } +.proto-root .jc-tch-tag { flex: none; margin-left: 0; font-style: normal; font-size: 9px; font-weight: 800; letter-spacing: .08em; color: var(--brand); background: var(--brand-wash); border: 1px solid var(--brand-soft); border-radius: 999px; padding: 1px 7px; vertical-align: 2px; } + +/* 标题区主题行：图标方 + 标题 + 节点章 */ +.proto-root .jc-tb-titlerow { display: flex; align-items: center; gap: 9px; margin-top: 8px; min-width: 0; } +.proto-root .jc-tb-tico { flex: none; width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color: #fff; background: var(--ai-grad); box-shadow: var(--shadow-brand); } +.proto-root .jc-tb-titlerow .jc-tb-title { flex: 0 1 auto; min-width: 0; } +.proto-root .jc-tb-node { flex: none; font-size: 10px; font-weight: 800; letter-spacing: .05em; color: var(--brand); background: var(--brand-wash); border: 1px solid var(--brand-soft); border-radius: 7px; padding: 2px 8px; } + +/* ══ 工作区导航 · 终版（唯一声明处）══ + 每个页签都是**真按钮**：静息 = 白底描边胶囊 + 浅影；hover = 洗蓝亮边；active = 品牌实心。 + 右侧场景控制囊与页签同高同风格。 */ +.proto-root .jc-wv-bar > .jc-wv-tabs { display: inline-flex; flex: none; gap: 6px; padding: 0; background: transparent; border: 0; border-radius: 0; margin: 0; width: auto; } +.proto-root .jc-wv-tab { position: static; justify-content: center; white-space: nowrap; height: 32px; padding: 0 14px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink-2); font-size: 12.5px; font-weight: 700; box-shadow: 0 1px 2px rgba(31,35,41,.05); transition: all var(--t-fast); } +.proto-root .jc-wv-tab:hover:not(.active) { background: var(--brand-wash); color: var(--brand); border-color: var(--brand-soft); box-shadow: 0 2px 6px rgba(51,112,255,.12); transform: translateY(-1px); } +.proto-root .jc-wv-tab:active { transform: scale(.97); } +.proto-root .jc-wv-tab.active { background: var(--brand); color: #fff; border-color: var(--brand); box-shadow: var(--shadow-brand); } +.proto-root .jc-wv-tab.active::after { display: none; } +.proto-root .jc-wv-tab em { background: var(--soft); border: 0; color: var(--ink-4); } +.proto-root .jc-wv-tab.active em { background: rgba(255,255,255,.25); color: #fff; } +.proto-root .jc-wv-tab em.hot { min-width: 17px; height: 17px; padding: 0 5px; display: inline-grid; place-items: center; background: var(--danger); border-radius: 999px; color: #fff; font-size: 10px; font-weight: 800; } +.proto-root .jc-wv-tab.active em.hot { background: #fff; color: var(--danger); } +/* 右侧控制囊：同高同风格的真按钮组 */ +.proto-root .jc-wv-ctl { height: 32px; margin-left: auto; padding: 0 4px; border: 1px solid var(--line); border-radius: 999px; background: #fff; box-shadow: 0 1px 2px rgba(31,35,41,.05); } +.proto-root .jc-wv-ctl button { width: 25px; height: 25px; color: var(--ink-2); } +.proto-root .jc-wv-ctl > b { font-size: 11px; color: var(--ink-2); } +.proto-root .jc-wv-ctl.as-btn { padding: 0 15px 0 11px; font-size: 12.5px; font-weight: 700; color: var(--ink-2); transition: all var(--t-fast); } +.proto-root .jc-wv-ctl.as-btn:hover { border-color: var(--brand-soft); color: var(--brand); background: var(--brand-wash); box-shadow: 0 2px 6px rgba(51,112,255,.12); transform: translateY(-1px); } + +/* ══ 工作区顶部导航 · jc-tnav（全新命名，唯一声明，无历史级联）══ + 几何确定：所有元素 33px 同高、flex 垂直居中、间距 6px；没有任何装饰线。 */ +.proto-root .jc-tnav { display: flex; align-items: center; gap: 6px; margin-bottom: 14px; flex: 0 0 auto; } +.proto-root .wf-card.jc-wc-fill > .jc-tnav { flex: 0 0 auto; } +/* 页签按钮：静息白胶囊 → hover 洗蓝 → 激活品牌实心 */ +.proto-root .jc-tnav-tab { display: inline-flex; align-items: center; gap: 6px; height: 33px; padding: 0 13px; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink-2); font-size: 12.5px; font-weight: 700; line-height: 1; white-space: nowrap; cursor: pointer; box-shadow: 0 1px 2px rgba(31,35,41,.05); transition: all var(--t-fast); } +.proto-root .jc-tnav-tab svg { flex: none; display: block; color: currentColor; } +.proto-root .jc-tnav-tab:hover:not(.on) { border-color: var(--brand-soft); background: var(--brand-wash); color: var(--brand); transform: translateY(-1px); box-shadow: 0 2px 6px rgba(51,112,255,.12); } +.proto-root .jc-tnav-tab:active { transform: scale(.97); } +.proto-root .jc-tnav-tab.on { background: var(--brand); border-color: var(--brand); color: #fff; box-shadow: var(--shadow-brand); } +/* 待处理未完成数：红泡（激活时反白） */ +.proto-root .jc-tnav-tab em { min-width: 17px; height: 17px; padding: 0 5px; display: inline-grid; place-items: center; font-style: normal; font-size: 10px; font-weight: 800; font-family: var(--mono); background: var(--danger); color: #fff; border-radius: 999px; } +.proto-root .jc-tnav-tab.on em { background: #fff; color: var(--danger); } +.proto-root .jc-tnav-sp { flex: 1 1 auto; min-width: 0; } +/* 场景控制：独立方钮 + 居中计数（不再打包进一个囊，杜绝内部换行错位） */ +.proto-root .jc-tnav-pg { display: inline-flex; align-items: center; gap: 6px; flex: none; } +.proto-root .jc-tnav-btn { display: inline-flex; align-items: center; justify-content: center; gap: 5px; width: 33px; height: 33px; padding: 0; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink-2); cursor: pointer; box-shadow: 0 1px 2px rgba(31,35,41,.05); transition: all var(--t-fast); } +.proto-root .jc-tnav-btn:hover:not(:disabled) { border-color: var(--brand-soft); background: var(--brand-wash); color: var(--brand); transform: translateY(-1px); box-shadow: 0 2px 6px rgba(51,112,255,.12); } +.proto-root .jc-tnav-btn:active:not(:disabled) { transform: scale(.95); } +.proto-root .jc-tnav-btn:disabled { opacity: .35; cursor: default; } +.proto-root .jc-tnav-n { min-width: 34px; text-align: center; font-size: 11px; font-weight: 800; color: var(--ink-2); } +.proto-root .jc-tnav-btn.back { width: auto; padding: 0 14px 0 10px; font-size: 12.5px; font-weight: 700; line-height: 1; white-space: nowrap; } +.proto-root .jc-tnav-btn svg { flex: none; display: block; } +/* 窄栏：页签藏图标省宽，保持一排 */ +@container (max-width: 520px) { + .proto-root .jc-tnav-tab svg { display: none; } + .proto-root .jc-tnav-tab { padding: 0 11px; } +} + +/* ══ 列表卡统一规范（2026-07-26）：双行定高，全部单行省略，杜绝显示不完整 ══ */ +/* 两行位：固定占两行高——短则留白、长则收尾省略，卡高恒定且信息尽量完整 */ +.proto-root .jc-clamp2 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; white-space: normal !important; line-height: 1.5; height: 3em; } +/* 任务卡：定高信息卡（112px）——头行 / 主题两行位 / 元行 / 进度条，每行硬约束 */ +.proto-root .task-card.jc-tc.jc-tc3 { display: flex; flex-direction: column; gap: 6px; height: 112px; min-height: 112px; padding: 11px 13px 10px; } +.proto-root .jc-tc3-head { display: flex; align-items: center; gap: 8px; min-width: 0; } +.proto-root .jc-tc3-head .jc-tc-ico { flex: none; } +.proto-root .jc-tc3-head .jc-tc-title { flex: 1; min-width: 0; margin: 0; font-size: 13px; font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-tc3-head .jc-tc-state { flex: none; } +.proto-root .jc-tc3-meta { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; overflow: hidden; } +.proto-root .jc-tc3-meta code { font-size: 10px; color: var(--ink-4); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-tc3-meta b { flex: none; font-size: 10.5px; font-weight: 800; color: var(--ink-3); } +.proto-root .jc-tc2-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; } +.proto-root .jc-tc.jc-tc2 .jc-tc-title { margin: 0; font-size: 13px; font-weight: 700; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-tc2-sub { font-size: 11px; color: var(--ink-3); } +/* 模块卡（消息/审批/纪要）：结构统一（元行 / 标题两行位 / 来源行[/时限条]），同模块每卡同高 */ +.proto-root .jc-mcard-top { flex-wrap: nowrap; overflow: hidden; } +.proto-root .jc-mcard-top > em { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } +.proto-root .jc-mcard-foot { display: flex; align-items: center; flex-wrap: nowrap; white-space: nowrap; overflow: hidden; } +.proto-root .jc-mcard-foot > i { flex: none; white-space: nowrap; } +.proto-root .jc-acard-from { flex-wrap: nowrap; overflow: hidden; white-space: nowrap; } + +/* ══ 任务评价卡（对话区第七类）：金调 + 星级打分 ══ */ +.proto-root .jc-fc.t-rate { --fc: #b98432; --fc-soft: #fbf0dc; } +.proto-root .jc-mtag.m-rate { background: #fbf0dc; color: #b98432; } +.proto-root .jc-stars { display: flex; align-items: center; gap: 3px; } +.proto-root .jc-star { display: inline-grid; place-items: center; border: 0; background: none; padding: 2px; color: #d9dde3; cursor: pointer; transition: color var(--t-fast), transform var(--t-fast); } +.proto-root .jc-star:hover { transform: scale(1.15); } +.proto-root .jc-star.on { color: #f5a623; } +.proto-root .jc-star.on svg { fill: currentColor; } +.proto-root .jc-stars.ro .jc-star { padding: 0 1px; cursor: default; } +.proto-root .jc-stars.ro .jc-star:hover { transform: none; } +.proto-root .jc-stars-txt { margin-left: 8px; font-style: normal; font-size: 11px; font-weight: 700; color: var(--ink-3); } +.proto-root .jc-rate-note { flex-basis: 100%; font-size: 11.5px; color: var(--ink-2); line-height: 1.6; } diff --git a/apps/web/src/app/styles/console.css b/apps/web/src/app/styles/console.css new file mode 100644 index 0000000..8a3764d --- /dev/null +++ b/apps/web/src/app/styles/console.css @@ -0,0 +1,460 @@ +/* ============================================================================ + JCAI 治理台 · 控制台设计层（2026-07-25 二次重做：分级页面） + ———————————————————————————————————————————————— + 治理面 ≠ 工单面。工作台是「一条一条把活干完」；治理台是「看住总体、处置偏差、配置边界」。 + 这一版把「一屏摞四种维度」拆开： + + · 深色轨 + 深色顶栏（与工作台的浅色壳明确区分，一眼知道自己在管理面） + · 区首页 = 面包屑 + 区头 + **页签**，一个页签 = 一个维度（主视图 / 次要清单 / 需处置 / 概览） + · 深挖 = 整页下钻，层层有面包屑：区 → 对象 → 子维度 → 元素；编排画布独占整页 + · 动作 = **就地确认带**（影响预览三必答），不弹窗、不遮挡；抽屉与模态一律不用 + · 密度靠图形承载（分布条、环、迷你柱、泳道），不靠塞列 + ========================================================================== */ + +.gov-root { + --nav: #18222e; + --nav-2: #202c3a; + --nav-line: #2b3a4b; + --nav-ink: #93a3b5; + --nav-on: #ffffff; + --top: #131c26; + --face: #eceff4; /* 工作面 */ + --card: #ffffff; + --cline: #e2e7ee; + --cshadow: 0 1px 2px rgba(19, 28, 38, .05); + --cshadow-2: 0 8px 24px -14px rgba(19, 28, 38, .5); +} + +/* ============ 外壳 ============ */ +.g-shell { height: 100vh; display: grid; grid-template-columns: 76px minmax(0, 1fr); background: var(--face); overflow: hidden; } + +/* ---- 深色左轨 ---- */ +.g-nav { display: flex; flex-direction: column; background: var(--nav); border-right: 1px solid var(--nav-line); padding: 12px 8px 10px; gap: 3px; overflow-y: auto; scrollbar-width: none; } +.g-nav::-webkit-scrollbar { display: none; } +.g-nav-mark { flex: none; width: 40px; height: 40px; margin: 0 auto 6px; border-radius: 11px; display: grid; place-items: center; color: #fff; background: linear-gradient(140deg, #3370ff, #7f3bf5); box-shadow: 0 4px 14px -4px rgba(51, 112, 255, .8); } +.g-nav-brand { text-align: center; font-size: 9px; font-weight: 800; letter-spacing: .18em; color: #5d6f83; margin-bottom: 10px; } +.g-nav-b { position: relative; flex: 0 0 auto; display: grid; justify-items: center; align-content: center; gap: 5px; min-height: 50px; padding: 6px 2px; border: 0; border-radius: 10px; background: transparent; color: var(--nav-ink); font: inherit; font-size: 11px; font-weight: 600; cursor: pointer; transition: background var(--t-fast), color var(--t-fast); } +.g-nav-b:hover { background: var(--nav-2); color: #dbe4ee; } +.g-nav-b.on { background: var(--nav-2); color: var(--nav-on); font-weight: 700; } +.g-nav-b.on::before { content: ""; position: absolute; left: -8px; top: 10px; bottom: 10px; width: 3px; border-radius: 0 3px 3px 0; background: #3370ff; } +.g-nav-ico { position: relative; display: inline-grid; place-items: center; } +.g-nav-badge { position: absolute; top: -7px; right: -12px; min-width: 17px; height: 17px; display: inline-flex; align-items: center; justify-content: center; padding: 0 5px; border-radius: 999px; background: #f54a45; color: #fff; font-size: 10px; font-weight: 800; line-height: 1; border: 2px solid var(--nav); } +.g-nav-foot { margin-top: auto; display: grid; justify-items: center; gap: 5px; padding-top: 12px; border-top: 1px solid var(--nav-line); } +.g-nav-ava { width: 30px; height: 30px; border-radius: 999px; display: grid; place-items: center; color: #fff; font-size: 12px; font-weight: 800; background: linear-gradient(140deg, #2bc7d4, #0e9fd8); } +.g-nav-foot span { font-size: 10px; color: #5d6f83; } + +/* ---- 深色顶栏：环境 + 全局检索 + 时间窗 + 告警 + 事件流 ---- */ +.g-body { min-width: 0; display: flex; flex-direction: column; min-height: 0; } +.g-top { flex: none; height: 52px; display: flex; align-items: center; gap: 14px; padding: 0 18px; background: var(--top); border-bottom: 1px solid #0c141c; } +.g-top-brand { display: flex; align-items: baseline; gap: 8px; color: #fff; font-size: 13.5px; font-weight: 800; letter-spacing: -.01em; } +.g-top-brand em { font-style: normal; font-size: 10.5px; font-weight: 600; color: #6d8199; } +.g-search { flex: 1; max-width: 460px; display: flex; align-items: center; gap: 8px; height: 32px; padding: 0 11px; border-radius: 9px; background: #1d2833; border: 1px solid #2b3a4b; color: #8fa1b4; transition: border-color var(--t-fast); } +.g-search:focus-within { border-color: #3370ff; } +.g-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 12px; color: #e6edf5; } +.g-search input::placeholder { color: #5d6f83; } +.g-search kbd { font-family: var(--mono); font-size: 10px; color: #5d6f83; border: 1px solid #2b3a4b; border-radius: 5px; padding: 1px 5px; } +.g-top-r { margin-left: auto; display: flex; align-items: center; gap: 8px; } +.g-tbtn { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px; border-radius: 8px; border: 1px solid #2b3a4b; background: #1d2833; color: #b9c4d0; font: inherit; font-size: 11.5px; font-weight: 600; cursor: pointer; transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast); } +.g-tbtn:hover { background: #253242; color: #fff; } +.g-tbtn b { font-family: var(--mono); font-size: 11px; color: #fff; } +.g-tbtn.alert { border-color: #5b2a2a; background: #2a1a1c; color: #ff9b96; } +.g-tbtn.alert b { color: #ff6b64; } +.g-tbtn.flash { border-color: #3370ff; background: #1b2c4d; color: #cddffd; } + +/* ---- 工作面 ---- */ +.g-page { flex: 1; min-height: 0; overflow-y: auto; padding: 14px 22px 30px; display: flex; flex-direction: column; gap: 16px; scrollbar-width: thin; } +.g-detail { display: flex; flex-direction: column; gap: 16px; animation: gRise .18s cubic-bezier(.3, 0, .2, 1) both; } +@keyframes gRise { from { opacity: 0; transform: translateY(5px); } } + +/* 面包屑：每一级都能回跳 */ +.g-crumb { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; min-height: 28px; } +.g-back { flex: none; width: 28px; height: 28px; margin-right: 2px; border-radius: 8px; border: 1px solid var(--cline); background: #fff; color: var(--ink-3); display: grid; place-items: center; cursor: pointer; transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast); } +.g-back:hover { background: var(--brand-wash); border-color: #c5d8ff; color: var(--brand-deep); } +.g-crumb-i { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; } +.g-crumb-i .sep { font-style: normal; color: #b6bfc9; } +.g-crumb-i button { border: 0; background: none; padding: 0; font: inherit; font-size: 11.5px; color: var(--ink-3); cursor: pointer; } +.g-crumb-i button:hover { color: var(--brand); text-decoration: underline; } +.g-crumb-i b { font-weight: 700; color: var(--ink-2); } + +/* 区头 */ +.g-head { display: flex; align-items: flex-start; gap: 13px; } +.g-head-i { flex: none; width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; color: #fff; } +.g-head-t { flex: 1; min-width: 0; } +.g-head-t h1 { margin: 0; font-size: 18px; font-weight: 800; letter-spacing: -.015em; color: var(--ink); } +.g-head-t p { margin: 5px 0 0; font-size: 12.5px; line-height: 1.7; color: var(--ink-3); max-width: 108ch; } + +/* 区内页签：一个页签 = 一个维度 */ +.g-tabs { display: flex; flex-wrap: wrap; gap: 3px; padding: 4px; border-radius: 12px; background: #e3e8ef; align-self: flex-start; } +.g-tab { display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 14px; border: 0; border-radius: 9px; background: transparent; color: var(--ink-3); font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: background var(--t-fast), color var(--t-fast); } +.g-tab svg { color: var(--ink-4); } +.g-tab:hover { color: var(--ink); background: rgba(255, 255, 255, .55); } +.g-tab.on { background: #fff; color: var(--ink); font-weight: 700; box-shadow: var(--cshadow); } +.g-tab.on svg { color: var(--brand); } +.g-tab b { min-width: 17px; height: 17px; padding: 0 5px; border-radius: 999px; background: var(--danger-accent); color: #fff; font-family: var(--mono); font-size: 10px; font-weight: 800; display: inline-grid; place-items: center; } + +/* 段标题 */ +.g-band { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; letter-spacing: .01em; color: var(--ink-2); } +.g-band svg { color: var(--ink-4); } +.g-band .x { margin-left: auto; font-size: 10.5px; font-weight: 600; color: var(--ink-4); } +.g-sec { display: flex; flex-direction: column; gap: 10px; } + +/* ============ 详情页头 + 就地确认带 ============ */ +.g-dhwrap { display: flex; flex-direction: column; gap: 10px; } +.g-dh { display: flex; align-items: flex-start; gap: 14px; padding: 16px 18px; background: var(--card); border: 1px solid var(--cline); border-radius: 14px; box-shadow: var(--cshadow); } +.g-dh-i { flex: none; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; color: var(--tone-ink, var(--brand-deep)); background: var(--tone-soft, var(--brand-wash)); } +.g-dh-t { flex: 1; min-width: 0; } +.g-dh-t em { display: block; font-style: normal; font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); } +.g-dh-t h2 { margin: 3px 0 0; font-size: 17px; font-weight: 800; letter-spacing: -.015em; color: var(--ink); } +.g-dh-t .chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 9px; } +.g-dh-t p { margin: 9px 0 0; font-size: 12px; line-height: 1.7; color: var(--ink-3); max-width: 104ch; } +.g-dh-a { flex: none; display: flex; gap: 8px; padding-top: 2px; } + +.g-acts { display: flex; flex-direction: column; gap: 10px; } +.g-acts-r { display: flex; flex-wrap: wrap; gap: 8px; } +/* 就地确认：影响预览三必答，展开在原地，不遮挡上下文 */ +.g-ask { display: flex; flex-direction: column; gap: 11px; padding: 14px 16px; border-radius: 13px; background: #fff; border: 1px solid var(--tone-line, var(--cline)); border-left: 3px solid var(--tone, var(--warn-accent)); box-shadow: var(--cshadow); animation: gDrop .16s cubic-bezier(.3, 0, .2, 1) both; } +.g-ask-h { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 800; color: var(--ink); } +.g-ask-h svg { color: var(--tone, var(--warn)); } +.g-ask-a { display: flex; justify-content: flex-end; gap: 9px; } +.g-impact { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line-soft); border: 1px solid var(--line-soft); border-radius: 11px; overflow: hidden; } +.g-impact > div { background: #fff; padding: 11px 13px; display: flex; flex-direction: column; gap: 4px; } +.g-impact em { font-style: normal; font-size: 10.5px; color: var(--ink-4); } +.g-impact b { font-size: 12px; font-weight: 600; line-height: 1.55; color: var(--ink); } +@keyframes gDrop { from { opacity: 0; transform: translateY(-5px); } } + +/* ============ 概览页签：KPI 块 ============ */ +.g-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(176px, 1fr)); gap: 12px; } +.g-kpi { position: relative; display: flex; flex-direction: column; gap: 7px; padding: 14px 16px; background: var(--card); border: 1px solid var(--cline); border-radius: 13px; box-shadow: var(--cshadow); overflow: hidden; } +.g-kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--tone, #c9d2dd); } +.g-kpi-l { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--ink-4); } +.g-kpi-l svg { color: var(--tone-ink, var(--ink-4)); } +.g-kpi-v { font-size: 26px; font-weight: 800; font-family: var(--mono); letter-spacing: -.03em; line-height: 1; color: var(--ink); } +.g-kpi-v small { font-size: 12px; font-weight: 600; font-family: var(--sans); color: var(--ink-4); margin-left: 4px; } +.g-kpi.t-ok .g-kpi-v { color: var(--ok); } .g-kpi.t-warn .g-kpi-v { color: var(--warn); } +.g-kpi.t-danger .g-kpi-v { color: var(--danger); } .g-kpi.t-brand .g-kpi-v { color: var(--brand-deep); } +.g-kpi-s { font-size: 11px; line-height: 1.5; color: var(--ink-4); } + +/* 环形（比率型指标） */ +.g-dial { display: grid; place-items: center; } +.g-dial svg { transform: rotate(-90deg); } +.g-dial .trk { fill: none; stroke: #eaeef3; } +.g-dial .val { fill: none; stroke-linecap: round; } + +/* 小事实块（预算 / 要素统计 / 负载） */ +.g-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(158px, 1fr)); gap: 10px; } +.g-fact { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; background: var(--card); border: 1px solid var(--cline); border-radius: 12px; box-shadow: var(--cshadow); } +.g-fact em { font-style: normal; font-size: 10.5px; color: var(--ink-4); } +.g-fact b { font-family: var(--mono); font-size: 15px; font-weight: 800; color: var(--ink); letter-spacing: -.01em; } +.g-fact .t { height: 4px; border-radius: 999px; background: #eaeef3; overflow: hidden; } +.g-fact .t i { display: block; height: 100%; border-radius: 999px; background: var(--tone, var(--brand)); } + +/* ============ 需处置页签：偏差 + 就地处置 ============ */ +.g-todo { display: flex; flex-direction: column; gap: 10px; } +/* 一行说清偏差 + 右侧就地处置；确认带展开时整行贯通 */ +.g-todo-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 16px; row-gap: 11px; padding: 13px 15px; background: var(--card); border: 1px solid var(--cline); border-left: 3px solid var(--tone, var(--danger-accent)); border-radius: 12px; box-shadow: var(--cshadow); } +.g-todo-card .g-acts { display: contents; } +.g-todo-card .g-ask { grid-column: 1 / -1; } +.g-todo-row { display: flex; align-items: flex-start; gap: 12px; min-width: 0; } +.g-todo-i { flex: none; width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color: var(--tone-ink, var(--danger)); background: var(--tone-soft, var(--danger-soft)); } +.g-todo-t { flex: 1; min-width: 0; line-height: 1.55; } +.g-todo-t b { display: block; font-size: 13px; font-weight: 700; color: var(--ink); } +.g-todo-t span { display: block; margin-top: 2px; font-size: 11.5px; color: var(--ink-3); } +.g-todo-card .g-acts-r { justify-content: flex-end; } +.g-clear { display: flex; align-items: center; gap: 9px; padding: 13px 15px; border-radius: 11px; background: var(--ok-soft); border: 1px solid #bfedb4; color: var(--ok); font-size: 12.5px; font-weight: 600; } + +/* ============ 运行看板：状态泳道 ============ */ +.g-board { display: grid; grid-template-columns: repeat(auto-fit, minmax(238px, 1fr)); gap: 12px; align-items: start; } +.g-lane { display: flex; flex-direction: column; gap: 9px; padding: 12px; border-radius: 13px; background: #e6eaf0; border: 1px solid #dbe1e9; } +.g-lane-h { display: flex; align-items: center; gap: 7px; font-size: 11.5px; font-weight: 800; color: var(--ink-2); } +.g-lane-h i { width: 8px; height: 8px; border-radius: 999px; background: var(--tone, var(--brand)); } +.g-lane-h b { margin-left: auto; font-family: var(--mono); font-size: 11px; color: var(--ink-4); } +.g-lane-e { padding: 6px 2px; font-size: 11.5px; color: var(--ink-4); } +.g-wf { display: flex; flex-direction: column; gap: 8px; padding: 11px 12px; background: var(--card); border: 1px solid var(--cline); border-radius: 11px; box-shadow: var(--cshadow); cursor: pointer; text-align: left; width: 100%; transition: box-shadow var(--t-fast), border-color var(--t-fast), transform var(--t-fast); } +.g-wf:hover { border-color: #c9d6e6; box-shadow: 0 4px 12px -4px rgba(19, 28, 38, .22); transform: translateY(-1px); } +.g-wf-top { display: flex; align-items: center; gap: 6px; font-size: 10px; font-family: var(--mono); color: var(--ink-4); } +.g-wf-top .r { margin-left: auto; } +.g-wf-t { font-size: 13px; font-weight: 700; line-height: 1.4; color: var(--ink); } +.g-wf-m { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--ink-3); } +.g-wf-m > svg { flex: none; color: var(--ink-4); } +.g-wf-hold { padding-top: 7px; border-top: 1px dashed var(--line-soft); } +.g-wf-hold em { font-style: normal; margin-left: auto; font-size: 10px; color: var(--ink-4); } +.g-wf-track, .g-prog { height: 4px; border-radius: 999px; background: #eaeef3; overflow: hidden; display: flex; } +.g-wf-track i, .g-prog i { display: block; height: 100%; background: var(--tone, var(--brand)); } +.g-prog { height: 6px; } +.g-prog i { background: var(--brand); } + +/* ============ 可下钻清单：清单只导航，动作在详情页 ============ */ +.g-nlist { display: flex; flex-direction: column; background: var(--card); border: 1px solid var(--cline); border-radius: 14px; box-shadow: var(--cshadow); overflow: hidden; } +.g-nrow { display: flex; align-items: center; gap: 13px; width: 100%; padding: 13px 16px; border: 0; border-bottom: 1px solid var(--line-soft); background: transparent; font: inherit; text-align: left; cursor: pointer; transition: background var(--t-fast); } +.g-nrow:last-child { border-bottom: 0; } +.g-nrow:hover { background: #f7f9fc; } +.g-nrow:hover .g-nrow-x { color: var(--brand); transform: translateX(2px); } +.g-nrow-i { flex: none; width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; color: var(--tone-ink, var(--ink-3)); background: var(--tone-soft, var(--soft)); } +.g-nrow-t { flex: 1 1 auto; min-width: 0; line-height: 1.5; } +.g-nrow-t b { display: block; font-size: 13px; font-weight: 700; color: var(--ink); } +.g-nrow-t span { display: block; margin-top: 2px; font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); overflow-wrap: anywhere; } +.g-nrow-m { flex: none; display: flex; align-items: center; gap: 18px; } +.g-nrow-c { display: flex; flex-direction: column; gap: 3px; min-width: 56px; } +.g-nrow-c em { font-style: normal; font-size: 10px; color: var(--ink-4); } +.g-nrow-c b { font-size: 12px; font-weight: 600; color: var(--ink-2); } +.g-nrow-r { flex: none; min-width: 92px; display: flex; justify-content: flex-end; } +.g-nrow-x { flex: none; color: var(--ink-4); display: grid; place-items: center; transition: color var(--t-fast), transform var(--t-fast); } + +/* 下一级入口（详情页里指向子维度页） */ +.g-entries { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 12px; } +.g-entry { display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: var(--card); border: 1px solid var(--cline); border-radius: 13px; box-shadow: var(--cshadow); font: inherit; text-align: left; cursor: pointer; transition: box-shadow var(--t-fast), border-color var(--t-fast), transform var(--t-fast); } +.g-entry:hover { border-color: #c9d6e6; box-shadow: 0 5px 14px -5px rgba(19, 28, 38, .22); transform: translateY(-1px); } +.g-entry:hover .g-entry-x { color: var(--brand); transform: translateX(2px); } +.g-entry-i { flex: none; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; color: var(--tone-ink, var(--brand-deep)); background: var(--tone-soft, var(--brand-wash)); } +.g-entry-t { flex: 1; min-width: 0; line-height: 1.45; } +.g-entry-t b { display: block; font-size: 13px; font-weight: 700; color: var(--ink); } +.g-entry-t em { display: block; margin-top: 2px; font-style: normal; font-size: 11px; color: var(--ink-4); } +.g-entry-m { flex: none; } +.g-entry-x { flex: none; color: var(--ink-4); display: grid; place-items: center; transition: color var(--t-fast), transform var(--t-fast); } + +/* 过滤芯片（日志归侧 / 事件流分区） */ +.g-filter { display: flex; flex-wrap: wrap; gap: 7px; } +.g-fchip { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 11px; border: 1px solid var(--cline); border-radius: 999px; background: #fff; color: var(--ink-3); font: inherit; font-size: 11.5px; font-weight: 600; cursor: pointer; transition: background var(--t-fast), color var(--t-fast), border-color var(--t-fast); } +.g-fchip:hover { border-color: #c9d6e6; color: var(--ink); } +.g-fchip.on { background: var(--brand); border-color: var(--brand); color: #fff; } +.g-fchip b { font-family: var(--mono); font-size: 10.5px; opacity: .8; } + +/* ============ 通用数据卡 ============ */ +.g-card { background: var(--card); border: 1px solid var(--cline); border-radius: 14px; box-shadow: var(--cshadow); overflow: hidden; } +.g-card-h { display: flex; align-items: center; gap: 9px; padding: 12px 16px; border-bottom: 1px solid var(--line-soft); font-size: 12.5px; font-weight: 800; color: var(--ink-2); } +.g-card-h svg { color: var(--ink-4); } +.g-card-h .x { margin-left: auto; font-size: 10.5px; font-weight: 600; color: var(--ink-4); } +.g-card-b { padding: 14px 16px; display: flex; flex-direction: column; gap: 12px; } +.g-code { display: block; padding: 11px 13px; border-radius: 10px; background: #f5f7fa; border: 1px solid var(--line-soft); font-family: var(--mono); font-size: 11.5px; line-height: 1.75; color: var(--ink-2); overflow-wrap: anywhere; } + +/* ============ 矩阵表 ============ */ +.g-matrix { width: 100%; border-collapse: collapse; } +.g-matrix th { text-align: left; font-size: 11px; font-weight: 700; color: var(--ink-4); background: #f7f9fc; padding: 9px 14px; border-bottom: 1px solid var(--line-soft); white-space: nowrap; } +.g-matrix td { padding: 11px 14px; font-size: 12.5px; color: var(--ink-2); border-bottom: 1px solid var(--line-soft); vertical-align: middle; line-height: 1.6; } +.g-matrix tr:last-child td { border-bottom: 0; } +.g-matrix tbody tr:hover td { background: #fbfcfe; } +.g-matrix td.k { font-weight: 700; color: var(--ink); } +.g-matrix td.mono { font-family: var(--mono); font-size: 11.5px; color: var(--ink); white-space: nowrap; } +.g-matrix td.num { font-family: var(--mono); font-size: 12.5px; font-weight: 700; text-align: right; } +.g-matrix .cell-ok { color: var(--ok); } .g-matrix .cell-warn { color: var(--warn); } .g-matrix .cell-mute { color: var(--ink-4); } + +/* 负载条 */ +.g-load { display: flex; align-items: center; gap: 8px; } +.g-load-t { flex: 1; min-width: 46px; max-width: 96px; height: 6px; border-radius: 999px; background: #eaeef3; overflow: hidden; } +.g-load-t i { display: block; height: 100%; border-radius: 999px; background: var(--tone, var(--brand)); } +.g-load b { font-family: var(--mono); font-size: 11.5px; font-weight: 700; color: var(--ink-2); } + +/* ============ 货架：卡片墙 ============ */ +.g-shelf { display: grid; grid-template-columns: repeat(auto-fill, minmax(264px, 1fr)); gap: 12px; } +.g-tile { display: flex; flex-direction: column; gap: 10px; padding: 14px 15px; background: var(--card); border: 1px solid var(--cline); border-radius: 13px; box-shadow: var(--cshadow); cursor: pointer; text-align: left; font: inherit; transition: box-shadow var(--t-fast), border-color var(--t-fast), transform var(--t-fast); } +.g-tile:hover { border-color: #c9d6e6; box-shadow: 0 5px 14px -5px rgba(19, 28, 38, .22); transform: translateY(-1px); } +.g-tile-h { display: flex; align-items: center; gap: 9px; } +.g-tile-i { flex: none; width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; color: var(--tone-ink, var(--brand-deep)); background: var(--tone-soft, var(--brand-wash)); } +.g-tile-t { flex: 1; min-width: 0; line-height: 1.35; } +.g-tile-t b { display: block; font-size: 13.5px; font-weight: 700; color: var(--ink); } +.g-tile-t em { display: block; font-style: normal; font-size: 10.5px; font-family: var(--mono); color: var(--ink-4); } +.g-tile-m { display: flex; flex-wrap: wrap; gap: 6px; } +.g-tile-d { font-size: 11.5px; line-height: 1.6; color: var(--ink-3); } +.g-tile-f { display: flex; align-items: center; gap: 8px; padding-top: 9px; border-top: 1px dashed var(--line-soft); font-size: 11px; color: var(--ink-3); } +.g-tile-f .r { margin-left: auto; font-family: var(--mono); color: var(--ink-4); } + +/* ============ 规则清单（触发器）：整行可下钻 ============ */ +.g-rules { display: flex; flex-direction: column; } +.g-rule { display: grid; grid-template-columns: 30px minmax(0, 1fr) 84px 108px 78px 18px; align-items: center; gap: 12px; width: 100%; padding: 13px 16px; border: 0; border-bottom: 1px solid var(--line-soft); background: transparent; font: inherit; text-align: left; cursor: pointer; transition: background var(--t-fast); } +.g-rule:last-child { border-bottom: 0; } +.g-rule:hover { background: #f7f9fc; } +.g-rule:hover .g-nrow-x { color: var(--brand); transform: translateX(2px); } +.g-rule-i { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color: var(--tone-ink); background: var(--tone-soft); } +.g-rule-t { min-width: 0; } +.g-rule-t b { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; font-size: 13px; font-weight: 700; color: var(--ink); } +.g-rule-t code { display: block; font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); margin-top: 4px; overflow-wrap: anywhere; } +.g-rule-n { font-size: 11.5px; color: var(--ink-3); line-height: 1.5; } +.g-rule-n b { font-size: 13px; color: var(--ink); } +.g-rule-n em { display: block; font-style: normal; font-size: 10.5px; color: var(--ink-4); } +.g-bars { display: flex; align-items: flex-end; gap: 2px; height: 26px; } +.g-bars i { flex: 1; min-width: 3px; border-radius: 2px 2px 0 0; background: var(--tone, var(--brand)); opacity: .55; } +.g-bars i.hot { opacity: 1; } + +/* ============ 分布条 ============ */ +.g-dist { display: flex; flex-direction: column; gap: 9px; } +.g-dist-row { display: grid; grid-template-columns: minmax(84px, 132px) minmax(0, 1fr) 52px; align-items: center; gap: 11px; } +.g-dist-l { font-size: 12px; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } +.g-dist-t { height: 8px; border-radius: 999px; background: #eaeef3; overflow: hidden; } +.g-dist-t i { display: block; height: 100%; border-radius: 999px; background: var(--tone, var(--brand)); } +.g-dist-v { font-family: var(--mono); font-size: 12px; font-weight: 700; text-align: right; color: var(--ink-2); } + +/* ============ 标签 / 状态 / 说明 / 按钮 ============ */ +.g-chip { display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 700; border-radius: 6px; padding: 2px 8px; color: var(--tone-ink, var(--ink-3)); background: var(--tone-soft, var(--soft)); border: 1px solid var(--tone-line, var(--line-soft)); white-space: nowrap; } +.g-st { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 700; color: var(--tone-ink, var(--ink-3)); white-space: nowrap; } +.g-st svg { color: var(--tone, var(--ink-4)); } +.g-mono { font-family: var(--mono); } +.g-note { display: flex; align-items: flex-start; gap: 9px; padding: 11px 14px; border-radius: 10px; font-size: 12px; line-height: 1.7; color: var(--ink-3); background: #f5f7fa; border: 1px solid var(--line-soft); } +.g-note svg { flex: none; margin-top: 2px; color: var(--ink-4); } +.g-note.warn { color: var(--warn); background: var(--warn-soft); border-color: #f0d5a8; } +.g-note.warn svg { color: var(--warn); } +.g-note.ok { color: var(--ok); background: var(--ok-soft); border-color: #bfedb4; } +.g-note.ok svg { color: var(--ok); } +.g-btn { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink-2); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap; transition: background var(--t-fast), border-color var(--t-fast), color var(--t-fast); } +.g-btn:hover { background: var(--soft); border-color: #cdd5df; } +.g-btn.primary { background: var(--brand); border-color: var(--brand); color: #fff; } +.g-btn.primary:hover { background: var(--brand-deep); border-color: var(--brand-deep); } +.g-btn.danger { color: var(--danger); border-color: #f2c4c1; } +.g-btn.danger:hover { background: var(--danger-soft); } +.g-btn.armed { box-shadow: 0 0 0 2px rgba(51, 112, 255, .18); border-color: var(--brand); } +.g-btn.danger.armed { box-shadow: 0 0 0 2px rgba(245, 74, 69, .18); border-color: var(--danger-accent); } +.g-btn.xs { height: 26px; padding: 0 10px; font-size: 11.5px; } +.g-btn:disabled { color: var(--ink-4); background: var(--soft); border-color: var(--line-soft); cursor: default; } +.g-btn:disabled:hover { background: var(--soft); border-color: var(--line-soft); } +.g-avatar { width: 21px; height: 21px; border-radius: 999px; display: inline-grid; place-items: center; color: #fff; font-size: 10px; font-weight: 800; background: linear-gradient(140deg, #2bc7d4, #0e9fd8); } + +/* 标签值行 */ +.g-rows { display: flex; flex-direction: column; background: var(--card); border: 1px solid var(--cline); border-radius: 12px; overflow: hidden; box-shadow: var(--cshadow); } +.g-rows > div { display: grid; grid-template-columns: 116px minmax(0, 1fr); gap: 14px; padding: 11px 15px; border-bottom: 1px solid var(--line-soft); } +.g-rows > div:last-child { border-bottom: 0; } +.g-rows > div:nth-child(even) { background: #fbfcfe; } +.g-rows em { font-style: normal; font-size: 11.5px; color: var(--ink-4); } +.g-rows b { font-size: 12.5px; font-weight: 600; line-height: 1.65; color: var(--ink); overflow-wrap: anywhere; } +.g-rows b.mono { font-family: var(--mono); font-size: 11.5px; } + +/* 事件流条目 */ +.g-ev { display: flex; gap: 11px; padding: 12px 0; border-bottom: 1px solid var(--line-soft); } +.g-ev:last-child { border-bottom: 0; } +.g-ev-r { flex: none; width: 3px; border-radius: 3px; background: var(--tone, var(--brand)); } +.g-ev-b { flex: 1; min-width: 0; } +.g-ev-h { display: flex; align-items: center; gap: 7px; margin-bottom: 4px; } +.g-ev-h b { font-size: 12.5px; font-weight: 700; color: var(--ink); } +.g-ev-h time { margin-left: auto; font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); } +.g-ev-b p { margin: 0; font-size: 12px; line-height: 1.65; color: var(--ink-3); } +.g-ev-b span { display: block; margin-top: 4px; font-size: 10.5px; color: var(--ink-4); } + +/* ============ 编排工作区：左 2/3 画布（整图不裁切）+ 右 1/3 属性栏 ============ */ +.g-orch { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 12px; align-items: start; } +.g-canvas { border: 1px solid var(--cline); border-radius: 14px; overflow: hidden; background: #e9edf2; } +/* 图自身按 aspect-ratio 缩放，整张一定看得全——纸面不再限高、不再内部滚动 */ +.g-canvas .process-desk { height: auto; max-height: none; overflow: visible; padding: 12px 10px 16px; background: transparent; } +.g-canvas .process-doc { max-width: none; padding: 14px 18px 18px; border-radius: 10px; box-shadow: var(--cshadow); } +/* 画布上的选中态（外挂类，_flow 复刻件未改）：命中层描边 = 选中框 */ +.g-canvas .flow-node-sel .djs-hit { fill: rgba(51, 112, 255, .09) !important; stroke: #3370ff !important; stroke-width: 2.5px !important; stroke-opacity: 1 !important; rx: 7px; ry: 7px; } + +/* 右栏：属性卡就地填写，不下钻 */ +.g-side { position: sticky; top: 2px; display: flex; flex-direction: column; gap: 10px; } +.g-side-h { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; color: var(--ink-2); } +.g-side-h svg { color: var(--ink-4); } +.g-side-h .x { margin-left: auto; font-size: 10.5px; font-weight: 600; color: var(--ink-4); } +.g-side .g-props { grid-template-columns: minmax(0, 1fr); } +.g-side .g-prop-b { padding: 12px 13px; gap: 11px; } +.g-picker { display: flex; flex-wrap: wrap; gap: 6px; } +.g-pick { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 11px; border: 1px solid var(--cline); border-radius: 9px; background: #fff; color: var(--ink-2); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; transition: border-color var(--t-fast), background var(--t-fast), color var(--t-fast); } +.g-pick b { font-size: 10.5px; font-weight: 700; color: var(--tone-ink, var(--ink-4)); } +.g-pick:hover { border-color: var(--tone-line, #c9d6e6); background: var(--tone-soft, var(--soft)); } +.g-pick.on { border-color: var(--tone, var(--brand)); background: var(--tone-soft, var(--brand-wash)); color: var(--tone-ink, var(--brand-deep)); box-shadow: 0 0 0 2px color-mix(in srgb, var(--tone, #3370ff) 14%, transparent); } + +.g-props { display: grid; grid-template-columns: repeat(auto-fit, minmax(292px, 1fr)); gap: 12px; align-items: start; } +.g-prop { display: flex; flex-direction: column; background: var(--card); border: 1px solid var(--cline); border-radius: 13px; box-shadow: var(--cshadow); overflow: hidden; } +.g-prop-h { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-bottom: 1px solid var(--line-soft); background: #fbfcfe; font-size: 12px; font-weight: 800; color: var(--ink-2); } +.g-prop-h svg { color: var(--ink-4); } +.g-prop-h .x { margin-left: auto; font-size: 10.5px; font-weight: 600; color: var(--ink-4); } +.g-prop-b { padding: 13px 14px; display: flex; flex-direction: column; gap: 12px; } +.g-prop-ref { display: flex; flex-wrap: wrap; gap: 6px; } + +.g-field { display: flex; flex-direction: column; gap: 6px; } +.g-field > em { display: flex; align-items: baseline; gap: 7px; font-style: normal; font-size: 11px; font-weight: 600; color: var(--ink-3); } +.g-field > em i { font-style: normal; font-weight: 400; font-size: 10.5px; color: var(--ink-4); } +.g-input, .g-select, .g-ta { width: 100%; padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink); font: inherit; font-size: 12.5px; line-height: 1.6; transition: border-color var(--t-fast), box-shadow var(--t-fast); } +.g-input:focus, .g-select:focus, .g-ta:focus { outline: 0; border-color: var(--brand); box-shadow: 0 0 0 3px rgba(51, 112, 255, .12); } +.g-input.mono { font-family: var(--mono); font-size: 11.5px; } +.g-input[readonly] { background: var(--soft); color: var(--ink-3); } +.g-ta { resize: vertical; min-height: 62px; } +.g-select { appearance: none; padding-right: 26px; background-image: linear-gradient(45deg, transparent 50%, #8f959e 50%), linear-gradient(135deg, #8f959e 50%, transparent 50%); background-position: right 13px center, right 8px center; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; cursor: pointer; } + +.g-seg { display: inline-flex; padding: 3px; gap: 2px; border-radius: 9px; background: #eef1f5; } +.g-seg-b { flex: 1; height: 26px; padding: 0 10px; border: 0; border-radius: 7px; background: transparent; color: var(--ink-3); font: inherit; font-size: 11.5px; font-weight: 600; cursor: pointer; white-space: nowrap; transition: background var(--t-fast), color var(--t-fast); } +.g-seg-b:hover { color: var(--ink); } +.g-seg-b.on { background: #fff; color: var(--brand-deep); font-weight: 700; box-shadow: var(--cshadow); } + +.g-listedit { display: flex; flex-direction: column; gap: 7px; } +.g-le-row { display: flex; align-items: center; gap: 7px; } +.g-le-x { flex: none; width: 30px; height: 30px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink-4); display: grid; place-items: center; cursor: pointer; transition: color var(--t-fast), border-color var(--t-fast), background var(--t-fast); } +.g-le-x:hover { color: var(--danger); border-color: #f2c4c1; background: var(--danger-soft); } +.g-le-add { align-self: flex-start; display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 10px; border: 1px dashed var(--line); border-radius: 8px; background: transparent; color: var(--ink-3); font: inherit; font-size: 11.5px; font-weight: 600; cursor: pointer; transition: color var(--t-fast), border-color var(--t-fast); } +.g-le-add:hover { color: var(--brand); border-color: var(--brand); } +.g-le-e { font-size: 11.5px; color: var(--ink-4); } + +/* 色调字典：一个 .t-* 带一整套语义色，组件只读 var(--tone*) */ +.gov-root .t-brand { --tone: #3370ff; --tone-ink: #245bdb; --tone-soft: #f0f4ff; --tone-line: #c5d8ff; } +.gov-root .t-ok { --tone: #34c724; --tone-ink: #278717; --tone-soft: #e8f8e4; --tone-line: #bfedb4; } +.gov-root .t-warn { --tone: #ff8800; --tone-ink: #8a5f1c; --tone-soft: #fff4e5; --tone-line: #ecd9ab; } +.gov-root .t-danger { --tone: #f54a45; --tone-ink: #d83931; --tone-soft: #feeae9; --tone-line: #f6c6c3; } +.gov-root .t-mute { --tone: #8f959e; --tone-ink: #46586a; --tone-soft: #eef2f6; --tone-line: #d8dee6; } +.gov-root .t-auto { --tone: #4954e6; --tone-ink: #3a44c9; --tone-soft: #f0f1fd; --tone-line: #ccd0f7; } +.gov-root .t-decision { --tone: #7f3bf5; --tone-ink: #5b21cf; --tone-soft: #f5f0fe; --tone-line: #ddccfb; } +.gov-root .t-collab { --tone: #0aa294; --tone-ink: #0a6a64; --tone-soft: #e4f8f5; --tone-line: #b6e7e0; } +.gov-root .t-wait { --tone: #6a7590; --tone-ink: #46586a; --tone-soft: #eef0f5; --tone-line: #d5dae4; } + +@media (max-width: 1440px) { + .g-orch { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); } +} +@media (max-width: 1320px) { + .g-nrow-m { gap: 12px; } + .g-nrow-c { min-width: 48px; } +} +@media (max-width: 1150px) { + /* 窄到放不下两栏才叠起来（body 最小宽 1120px，日常不会触发） */ + .g-orch { grid-template-columns: minmax(0, 1fr); } + .g-side { position: static; } + .g-side .g-props { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); } +} +@media (max-width: 1180px) { + .g-shell { grid-template-columns: 64px minmax(0, 1fr); } + .g-search { display: none; } + .g-nrow-m { display: none; } +} +@media (prefers-reduced-motion: reduce) { + .gov-root *, .gov-root *::before, .gov-root *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } +} + +/* ══ 数据区 · CRM/ERP 式库表管理（2026-07-26）══ */ +/* 工具栏：域筛选 chips + 检索 + 计数 */ +.g-dbbar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; } +.g-dbchips { display: inline-flex; gap: 4px; padding: 3px; background: rgba(255,255,255,.6); border: 1px solid var(--line-soft); border-radius: 10px; } +.g-dbchip { display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 11px; border: 0; border-radius: 8px; background: transparent; color: var(--ink-3); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; transition: background var(--t-fast), color var(--t-fast); } +.g-dbchip:hover:not(.on) { color: var(--ink); background: rgba(255,255,255,.8); } +.g-dbchip.on { background: var(--brand); color: #fff; font-weight: 700; } +.g-dbchip em { font-style: normal; font-size: 10px; font-family: var(--mono); opacity: .75; } +.g-dbsearch { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 11px; background: #fff; border: 1px solid var(--line-soft); border-radius: 9px; color: var(--ink-4); } +.g-dbsearch input { border: 0; outline: none; background: none; font: inherit; font-size: 12.5px; color: var(--ink); width: 180px; } +.g-dbcount { margin-left: auto; font-size: 11px; color: var(--ink-3); } +/* 管理表：白卡包表，行可点 */ +.g-dbwrap { padding: 0; overflow: hidden; } +.g-dbtable { width: 100%; border-collapse: collapse; font-size: 12.5px; } +.g-dbtable thead th { text-align: left; padding: 9px 14px; background: #f5f7fa; color: var(--ink-3); font-size: 11px; font-weight: 700; letter-spacing: .03em; border-bottom: 1px solid var(--line-soft); white-space: nowrap; } +.g-dbtable tbody td { padding: 10px 14px; border-bottom: 1px solid var(--line-soft); color: var(--ink); vertical-align: middle; } +.g-dbtable tbody tr:last-child td { border-bottom: 0; } +.g-dbtable tbody tr { transition: background var(--t-fast); } +.g-dbtable tbody tr:hover { background: var(--brand-wash, #f0f4ff); } +.g-dbtable tbody tr[onclick], .g-dbtable tbody tr { cursor: pointer; } +.g-dbtable td.chev { width: 30px; color: var(--ink-4); } +.g-dbtable tr.empty td { text-align: center; color: var(--ink-4); padding: 26px; cursor: default; } +.g-db-ico { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; margin-right: 9px; vertical-align: middle; } +.g-db-ico.t-brand { background: var(--brand-soft, #e1eaff); color: var(--brand); } +.g-db-ico.t-auto { background: #f0f1fd; color: #4954e6; } +.g-db-name { display: inline-flex; flex-direction: column; vertical-align: middle; } +.g-db-name b { font-weight: 700; } +.g-db-name em { font-style: normal; font-size: 10.5px; color: var(--ink-4); } +.g-db-dim { color: var(--ink-4); } +/* Schema 表 / 预览表 */ +.g-schema td.fname { font-weight: 700; } +.g-schema td.ftype { color: var(--ink-3); font-size: 11.5px; } +.g-schema td.fsample { color: var(--ink-2); } +.g-schema tbody tr, .g-preview tbody tr { cursor: default; } +.g-preview td.masked { color: var(--ink-4); letter-spacing: .1em; } +.g-preview thead th { font-family: var(--mono); text-transform: none; } +.g-dbfoot { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 14px; background: #fafbfd; border-top: 1px solid var(--line-soft); font-size: 11px; color: var(--ink-3); } +.g-dbfoot em { font-style: normal; color: var(--ink-4); } + +/* 记录管理器：分页控件 */ +.g-dbpage { display: inline-flex; align-items: center; gap: 4px; } +.g-dbpage button { display: inline-grid; place-items: center; width: 26px; height: 26px; border: 1px solid var(--line-soft); border-radius: 8px; background: #fff; color: var(--ink-3); cursor: pointer; transition: all var(--t-fast); } +.g-dbpage button:hover:not(:disabled) { border-color: var(--brand); color: var(--brand); } +.g-dbpage button:disabled { opacity: .35; cursor: default; } +.g-dbpage b { min-width: 36px; text-align: center; font-size: 11px; color: var(--ink-2); } diff --git a/apps/web/src/app/styles/proto.vendor.css b/apps/web/src/app/styles/proto.vendor.css new file mode 100644 index 0000000..aee7b5d --- /dev/null +++ b/apps/web/src/app/styles/proto.vendor.css @@ -0,0 +1 @@ +.ops-module{--ops-bg: #f3f5f8;--ops-surface: #ffffff;--ops-soft: #f8f9fb;--ops-muted-surface: #f5f7fa;--ops-border: #dee0e3;--ops-border-soft: #e8eaed;--ops-text: #1f2329;--ops-muted: #646a73;--ops-primary: #3370ff;--ops-primary-soft: #f0f4ff;--ops-warning: #b45309;--ops-warning-soft: #fff7ed;--ops-danger: #be123c;--ops-danger-soft: #fff1f2;--ops-success: #047857;--ops-success-soft: #ecfdf5;height:calc(100vh - 68px);min-height:660px;min-width:0;display:grid;gap:12px;padding:12px;background:var(--ops-bg);color:var(--ops-text);font-size:13px}.ops-projects{grid-template-columns:306px minmax(0,1fr) 330px}.ops-projects.chat-collapsed{grid-template-columns:306px minmax(0,1fr) 52px}.ops-mail{grid-template-columns:216px 350px minmax(0,1fr) 318px}.ops-mail.chat-collapsed{grid-template-columns:216px 350px minmax(0,1fr) 52px}.ops-mail.folders-collapsed{grid-template-columns:64px 350px minmax(0,1fr) 318px}.ops-mail.folders-collapsed.chat-collapsed{grid-template-columns:64px 350px minmax(0,1fr) 52px}.ops-message{grid-template-columns:178px 326px minmax(0,1fr) 286px}.ops-knowledge{grid-template-columns:252px 342px minmax(0,1fr) 318px}.ops-pane{min-width:0;min-height:0;border:1px solid var(--ops-border);border-radius:10px;background:var(--ops-surface);box-shadow:0 1px 2px #1f23290d;overflow:hidden}.ops-rail,.ops-list-pane,.ops-inspector{display:flex;flex-direction:column;padding:12px}.ops-main{display:flex;flex-direction:column}.ops-title{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:3px 8px;padding-bottom:10px;border-bottom:1px solid var(--ops-border-soft);margin-bottom:10px}.ops-title.with-action{grid-template-columns:minmax(0,1fr) auto}.ops-title span{grid-column:1;color:var(--ops-muted);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.ops-title strong{grid-column:1;color:var(--ops-text);font-size:18px;line-height:1.1}.ops-title em{grid-row:1 / span 2;grid-column:2;align-self:center;color:var(--ops-muted);font-size:12px;font-style:normal}.ops-icon-action{grid-row:1 / span 2;grid-column:2;width:36px;height:36px;display:grid;place-items:center;border:1px solid #b7caf2;border-radius:8px;background:var(--ops-primary);color:#fff}.ops-search{height:36px;display:flex;align-items:center;gap:8px;padding:0 10px;border:1px solid var(--ops-border);border-radius:8px;background:var(--ops-soft);color:var(--ops-muted)}.ops-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--ops-text);font-size:13px}.ops-segmented{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}.ops-segmented button,.ops-folder,.ops-mini-tabs button{min-height:30px;border:1px solid var(--ops-border);border-radius:8px;background:#fff;color:#41464e;padding:5px 9px;font-size:12px}.ops-segmented button.active,.ops-folder.active,.ops-mini-tabs button.active{border-color:#c7d7f2;background:var(--ops-primary-soft);color:var(--ops-primary);font-weight:750}.ops-checkline{display:flex;align-items:center;gap:7px;min-height:30px;margin-bottom:8px;color:#565c66;font-size:12px}.ops-list,.ops-scroll,.ops-chat-stream{min-height:0;overflow:auto}.ops-list{flex:1;padding-right:2px}.ops-scroll{flex:1;padding:12px 14px 16px}.ops-record,.ops-mail-row,.ops-chat-row,.ops-knowledge-row,.ops-space-row,.ops-row,.ops-card,.ops-section,.ops-confirm-card,.ops-picker-card,.ops-file-line,.ops-member-row{width:100%;border:1px solid var(--ops-border-soft);border-radius:9px;background:#fff;box-shadow:none}.ops-record,.ops-mail-row,.ops-chat-row,.ops-knowledge-row,.ops-space-row{display:block;margin-top:8px;padding:10px;text-align:left}.ops-record:hover,.ops-mail-row:hover,.ops-chat-row:hover,.ops-knowledge-row:hover,.ops-space-row:hover,.ops-row:hover,.ops-file-line:hover,.ops-picker-card:hover,.ops-member-row:hover{border-color:#b8c6d8;background:#fbfcfe}.ops-record.active,.ops-mail-row.active,.ops-chat-row.active,.ops-knowledge-row.active,.ops-space-row.active,.ops-row.active{border-color:#98b8ef;background:#f6f9ff;box-shadow:inset 3px 0 0 var(--ops-primary)}.ops-record strong,.ops-mail-row strong,.ops-chat-row strong,.ops-knowledge-row strong{display:block;margin:5px 0 3px;color:var(--ops-text);font-size:13px;line-height:1.35}.ops-record small,.ops-record footer,.ops-mail-row p,.ops-mail-row small,.ops-chat-row p,.ops-chat-row small,.ops-knowledge-row p,.ops-space-row span,.ops-card p,.ops-row p,.ops-hero p,.ops-section-head span{color:var(--ops-muted);font-size:12px;line-height:1.45}.ops-record footer{display:flex;justify-content:space-between;gap:8px;margin-top:8px}.ops-record footer b{color:#41464e}.ops-progress{height:5px;margin:9px 0 7px;border-radius:999px;background:#e8eaed;overflow:hidden}.ops-progress span{display:block;height:100%;border-radius:inherit;background:var(--ops-primary)}.ops-pill{display:inline-flex;align-items:center;width:fit-content;min-height:22px;border:1px solid transparent;border-radius:999px;padding:2px 8px;font-size:11px;font-weight:750}.ops-pill.running{border-color:#bacefd;background:#f0f4ff;color:#245bdb}.ops-pill.warning{border-color:#fed7aa;background:var(--ops-warning-soft);color:var(--ops-warning)}.ops-pill.pending{border-color:#fecdd3;background:var(--ops-danger-soft);color:var(--ops-danger)}.ops-pill.success{border-color:#a7f3d0;background:var(--ops-success-soft);color:var(--ops-success)}.ops-pill.neutral{border-color:#e2e8f0;background:#f1f5f9;color:#565c66}.ops-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;padding:14px 16px;border-bottom:1px solid var(--ops-border-soft);background:#fff}.ops-kicker{display:inline-flex;margin-bottom:5px;color:var(--ops-primary);font-size:12px;font-weight:750}.ops-hero h2{margin:0;color:var(--ops-text);font-size:18px;line-height:1.25}.ops-actions{display:flex;align-items:flex-start;justify-content:flex-end;gap:8px;flex-wrap:wrap}.ops-actions button,.ops-row button,.ops-inline,.ops-action-grid button,.ops-chat-card button,.ops-confirm-card button,.ops-modal-actions button{min-height:34px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--ops-border);border-radius:8px;background:#fff;color:#41464e;padding:6px 10px;font-size:13px}.ops-actions button.primary,.ops-action-grid button:first-child,.ops-modal-actions button.primary,.ops-confirm-card button:first-child{border-color:var(--ops-primary);background:var(--ops-primary);color:#fff}.ops-actions button.danger{border-color:#fecdd3;background:#fff1f2;color:#be123c}.ops-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:10px 14px;border-bottom:1px solid var(--ops-border-soft)}.ops-metrics article,.ops-meta-grid article{display:grid;grid-template-columns:18px minmax(0,1fr);gap:4px 8px;align-items:center;padding:8px 10px;border:1px solid var(--ops-border-soft);border-radius:8px;background:var(--ops-soft)}.ops-metrics span,.ops-meta-grid span{color:var(--ops-muted);font-size:12px}.ops-metrics strong,.ops-meta-grid strong{grid-column:2;color:var(--ops-text);font-size:15px}.ops-tabs{display:flex;gap:12px;padding:0 14px;border-bottom:1px solid var(--ops-border-soft)}.ops-tabs button{border:0;border-bottom:2px solid transparent;background:transparent;color:var(--ops-muted);padding:10px 2px 9px;font-size:13px}.ops-tabs button.active{border-bottom-color:var(--ops-primary);color:var(--ops-primary);font-weight:750}.ops-section{margin-bottom:10px;padding:12px}.ops-section-head{display:flex;justify-content:space-between;gap:12px;padding-bottom:8px;border-bottom:1px solid var(--ops-border-soft);margin-bottom:10px}.ops-section-head strong,.ops-card h3{color:var(--ops-text);font-size:14px}.ops-gantt{overflow:auto;border:1px solid var(--ops-border-soft);border-radius:9px}.ops-gantt-section{padding:0;overflow:hidden}.ops-gantt-section .ops-section-head{margin:0;padding:12px 14px;background:#fff}.sop-gantt{height:calc(100vh - 312px);min-height:430px;overflow:auto;background:linear-gradient(90deg,rgba(219,228,239,.62) 1px,transparent 1px) 340px 0 / var(--day-width) 100%,#f8f9fb}.sop-gantt-grid{display:grid;grid-template-columns:340px repeat(var(--days),var(--day-width));min-width:calc(340px + var(--days) * var(--day-width))}.sop-gantt-header{position:sticky;top:0;z-index:5;min-height:52px;border-bottom:1px solid var(--ops-border);background:#fffffff5}.sop-gantt-left-head{position:sticky;left:0;z-index:6;display:grid;align-content:center;gap:2px;padding:9px 14px;border-right:1px solid var(--ops-border);background:#fff}.sop-gantt-left-head strong{color:var(--ops-text);font-size:13px}.sop-gantt-left-head span{color:var(--ops-muted);font-size:12px}.sop-gantt-tick{display:grid;place-items:center;min-height:52px;border-right:1px solid rgba(219,228,239,.72);color:#646a73;font-size:11px}.sop-gantt-tick.week{background:#f0f4ff;color:#3370ff;font-weight:750}.sop-gantt-tick em{font-size:10px;font-style:normal}.sop-gantt-body{display:grid}.sop-gantt-row{position:relative;min-height:86px;border:0;border-bottom:1px solid var(--ops-border-soft);background:transparent;padding:0;text-align:left}.sop-gantt-row:hover{background:#f0f4ff57}.sop-gantt-row.active{background:#f0f4ffb8}.sop-gantt-task{position:sticky;left:0;z-index:3;display:grid;align-content:center;gap:4px;min-height:86px;padding:10px 14px;border-right:1px solid var(--ops-border);background:#fff}.sop-gantt-row.active .sop-gantt-task{background:#f6f9ff;box-shadow:inset 3px 0 0 var(--ops-primary)}.sop-gantt-task strong{overflow:hidden;color:var(--ops-text);font-size:13px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.sop-gantt-task small{overflow:hidden;color:var(--ops-muted);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.sop-gantt-task footer{display:flex;gap:10px;align-items:center;color:#565c66;font-size:12px}.sop-gantt-task footer a{color:var(--ops-primary);font-weight:750;text-decoration:none}.sop-gantt-bar{align-self:center;position:relative;z-index:1;height:32px;margin:0 4px;overflow:hidden;border:1px solid #bacefd;border-radius:8px;background:#e1eaff;box-shadow:0 6px 16px #3370ff1f}.sop-gantt-bar span{display:block;height:100%;border-radius:inherit;background:#3370ff}.sop-gantt-bar em{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:#1f2329;font-size:11px;font-style:normal;font-weight:800}.sop-gantt-bar.warning{border-color:#fdba74;background:#ffedd5}.sop-gantt-bar.warning span{background:#f97316}.sop-gantt-bar.pending{border-color:#fecdd3;background:#ffe4e6}.sop-gantt-bar.pending span{background:#e11d48}.sop-gantt-bar.success{border-color:#a7f3d0;background:#d1fae5}.sop-gantt-bar.success span{background:#059669}.ops-project-chat{min-width:0;min-height:0;display:grid;grid-template-rows:auto auto 1fr auto;overflow:hidden;border:1px solid #c9d8ee;border-radius:10px;background:#f7faff;box-shadow:inset 1px 0 #3370ff14,0 10px 28px #1f232914}.ops-project-chat-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:14px;border-bottom:1px solid #d6e3f7;background:#fff}.ops-project-chat-head span{color:#646a73;font-size:11px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}.ops-project-chat-head h2{margin:2px 0;color:var(--ops-text);font-size:18px;line-height:1.15}.ops-project-chat-head p{margin:0;color:var(--ops-muted);font-size:12px}.ops-project-chat-head button,.ops-project-chat-rail{border:1px solid #d6e3f7;border-radius:8px;background:#fff;color:#41464e}.ops-project-chat-head button{width:36px;height:36px;display:grid;place-items:center}.ops-project-chat-prompts{display:flex;flex-wrap:wrap;gap:7px;padding:10px 12px;border-bottom:1px solid #d6e3f7;background:#f8fbff}.ops-project-chat-prompts button{min-height:30px;border:1px solid #d6e3f7;border-radius:8px;background:#fff;color:#41464e;padding:5px 8px;font-size:12px}.ops-project-chat-stream{min-height:0;overflow:auto;padding:12px}.ops-project-chat-bubble{margin-bottom:10px;border:1px solid #d6e3f7;border-radius:10px;background:#fff;padding:10px;box-shadow:0 1px 2px #1f23290d}.ops-project-chat-bubble.user{border-color:#c7d7f2;background:#f4f8ff}.ops-project-chat-bubble.ai{background:#fff}.ops-project-chat-bubble header{display:flex;justify-content:space-between;gap:8px;margin-bottom:5px}.ops-project-chat-bubble strong{color:#1f2329;font-size:12px}.ops-project-chat-bubble time{color:#646a73;font-size:11px}.ops-project-chat-bubble p{margin:0;color:#172033;font-size:13px;line-height:1.5}.ops-project-chat-input{display:grid;grid-template-columns:1fr 42px;gap:8px;padding:12px;border-top:1px solid #d6e3f7;background:#fff}.ops-project-chat-input textarea{min-height:48px;max-height:120px;resize:vertical;border:1px solid #d6e3f7;border-radius:9px;background:#f8fbff;color:#1f2329;padding:9px 10px;font-size:13px}.ops-project-chat-input button{width:42px;height:42px;display:grid;place-items:center;border:0;border-radius:9px;background:var(--ops-primary);color:#fff}.ops-project-chat-rail{display:grid;align-content:center;justify-items:center;gap:10px;min-width:0;min-height:0;color:#3370ff;background:#f7faff}.ops-project-chat-rail span{writing-mode:vertical-rl;color:#3370ff;font-size:12px;font-weight:800;letter-spacing:.08em}.ops-row{display:grid;grid-template-columns:20px minmax(0,1fr) auto auto;align-items:center;gap:10px;margin-bottom:8px;padding:10px}.ops-row strong{color:var(--ops-text);font-size:13px}.ops-row.risk{border-color:#fed7aa;background:#fffaf2}.ops-card{margin-bottom:10px;padding:12px}.ops-card.highlight{background:#f8fbff}.ops-card.compact{margin-top:10px;background:var(--ops-soft)}.ops-card select,.ops-modal input,.ops-modal select,.ops-modal textarea{width:100%;border:1px solid var(--ops-border);border-radius:8px;background:#fff;color:var(--ops-text);padding:8px 10px;font-size:13px}.ops-card dl{display:grid;grid-template-columns:64px 1fr;gap:6px 10px;margin:0}.ops-card dt{color:var(--ops-muted)}.ops-card dd{margin:0;color:var(--ops-text)}.ops-inline,.ops-file{width:fit-content;margin-top:8px}.ops-file,.ops-file-line{display:flex;align-items:center;gap:8px;padding:8px 10px;text-align:left}.ops-file-line div,.ops-file-line strong,.ops-file-line span{min-width:0}.ops-file-line span{color:var(--ops-muted);font-size:12px}.ops-file-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.ops-table-wrap header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.ops-table{width:100%;border-collapse:collapse;overflow:hidden;border:1px solid var(--ops-border-soft);border-radius:9px;background:#fff;font-size:12px}.ops-table th,.ops-table td{border-bottom:1px solid var(--ops-border-soft);padding:9px 10px;text-align:left;vertical-align:top}.ops-table th{background:var(--ops-soft);color:var(--ops-muted);font-weight:750}.ops-table tr{cursor:pointer}.ops-account,.ops-member-row{display:flex;align-items:flex-start;gap:9px;padding:10px;border:1px solid var(--ops-border-soft);border-radius:9px;background:var(--ops-soft);text-align:left}.ops-account strong,.ops-member-row strong{display:block;color:var(--ops-text)}.ops-account span,.ops-member-row span{color:var(--ops-muted);font-size:12px}.ops-folder-list,.ops-space-list{display:grid;gap:5px}.ops-folder{width:100%;display:flex;align-items:center;justify-content:flex-start;gap:8px;margin-top:0;text-align:left}.ops-folder span{min-width:0;flex:1}.ops-folder em{min-width:20px;height:20px;display:inline-grid;place-items:center;border-radius:999px;background:#f1f5f9;color:#565c66;font-size:11px;font-style:normal}.ops-folder.active em{background:#3370ff;color:#fff}.ops-folder-collapse{width:100%;min-height:32px;display:inline-flex;align-items:center;justify-content:center;gap:6px;margin:8px 0;border:1px solid var(--ops-border);border-radius:8px;background:#fff;color:#41464e;font-size:12px}.mail-folders-collapsed{padding:10px 8px}.mail-folders-collapsed .ops-title{display:flex;justify-content:center;padding-bottom:8px}.mail-folders-collapsed .ops-icon-action{position:static}.mail-folders-collapsed .ops-folder-list{gap:8px}.mail-folders-collapsed .ops-folder{position:relative;min-height:44px;justify-content:center;padding:6px 4px}.mail-folders-collapsed .ops-folder em{position:absolute;top:-5px;right:-4px;min-width:18px;height:18px;font-size:10px}.ops-mail-row header,.ops-chat-row header,.ops-message-bubble header{display:flex;justify-content:space-between;gap:8px}.ops-mail-row footer,.ops-knowledge-row footer{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.ops-mail-row em,.ops-knowledge-row em{border-radius:999px;background:#f1f5f9;color:var(--ops-muted);padding:2px 7px;font-style:normal;font-size:11px}.ops-mail-row footer span{display:inline-flex;align-items:center;gap:4px;color:var(--ops-muted)}.mail-body pre,.ops-doc-preview,.ops-preview{white-space:pre-wrap;margin:0;color:var(--ops-text);font-family:inherit;font-size:13px;line-height:1.58}.ops-mail-ai-chat{min-height:0}.mail-case-layout{display:grid;grid-template-columns:1fr;gap:10px}.mail-case-primary,.mail-case-facts article{border:1px solid var(--ops-border-soft);border-radius:9px;background:#f8f9fb}.mail-case-primary{padding:12px}.mail-case-primary h3{margin:8px 0 6px;color:#1f2329;font-size:15px;line-height:1.35}.mail-case-primary p{margin:0;color:#565c66;font-size:13px;line-height:1.55}.mail-case-facts{display:grid;grid-template-columns:repeat(2,minmax(180px,1fr));gap:8px}.mail-case-facts article{display:block;min-height:88px;padding:10px}.mail-case-facts span{display:block;margin-bottom:6px;color:#646a73;font-size:12px;font-weight:750}.mail-case-facts strong{display:block;color:#1f2329;font-size:13px;line-height:1.5;word-break:break-word}.ops-action-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.ops-mail .ops-action-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.ops-confirm-card{margin-top:10px;padding:12px;border-color:#fed7aa;background:#fffaf2}.ops-confirm-card ul{margin:8px 0;padding-left:18px;color:#565c66}.ops-confirm-card div{display:flex;gap:8px}.ops-chat-main{display:grid;grid-template-rows:auto 1fr auto}.ops-chat-stream{padding:14px;background:#fbfdff}.ops-message-bubble{max-width:78%;margin-bottom:10px;border:1px solid var(--ops-border-soft);border-radius:10px;background:#fff;padding:10px 12px}.ops-message-bubble.mine{margin-left:auto;border-color:#c7d7f2;background:#f4f8ff}.ops-message-bubble p{margin:6px 0 0;line-height:1.5}.ops-chat-card,.ops-approval-card{margin-top:8px;border:1px solid var(--ops-border);border-radius:9px;background:var(--ops-soft);padding:10px}.ops-approval-card{display:grid;grid-template-columns:20px 1fr;gap:8px}.ops-approval-card.pending{border-color:#fed7aa;background:#fff7ed}.ops-approval-card.approved{border-color:#a7f3d0;background:#f0fdf4}.ops-approval-card.rejected{border-color:#fecdd3;background:#fff1f2}.ops-approval-card footer{grid-column:2;display:flex;gap:8px;margin-top:8px}.ops-chat-input{display:grid;grid-template-columns:1fr 42px;gap:8px;padding:12px;border-top:1px solid var(--ops-border-soft);background:#fff}.ops-chat-input textarea{min-height:46px;max-height:120px;resize:vertical;border:1px solid var(--ops-border);border-radius:9px;background:#fff;color:var(--ops-text);padding:9px 10px;font-size:13px}.ops-chat-input button{width:42px;height:42px;display:grid;place-items:center;border:0;border-radius:9px;background:var(--ops-primary);color:#fff}.ops-member-list{display:grid;gap:8px;margin-bottom:10px}.ops-member-row{width:100%;background:#fff}.ops-member-row i{width:9px;height:9px;border-radius:999px;margin-top:5px;background:#cbd5e1}.ops-member-row i.online{background:#22c55e}.ops-space-row{display:flex;gap:10px}.ops-meta-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.ops-empty{margin-top:10px;padding:14px;border:1px dashed #cbd5e1;border-radius:9px;background:#f8f9fb}.ops-empty strong{color:var(--ops-text)}.ops-empty p{color:var(--ops-muted);font-size:12px}.ops-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;display:grid;place-items:center;background:#1f23296b}.ops-modal>section{width:min(760px,calc(100vw - 48px));max-height:calc(100vh - 80px);overflow:auto;border:1px solid var(--ops-border);border-radius:12px;background:#fff;box-shadow:0 24px 72px #1f23293d;padding:16px}.ops-modal header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.ops-modal header button{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--ops-border);border-radius:8px;background:#fff}.ops-modal label{display:grid;gap:6px;margin:9px 0;color:var(--ops-muted);font-size:12px}.ops-modal textarea{min-height:160px;resize:vertical}.ops-modal-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:12px}.ops-picker-card{display:block;margin:8px 0;padding:12px;text-align:left}.ops-picker-card strong,.ops-picker-card span{display:block}.ops-picker-card span{margin-top:3px;color:var(--ops-muted);font-size:12px}.ops-toast{position:fixed;right:28px;bottom:28px;z-index:100;border-radius:10px;background:#111827;color:#fff;box-shadow:0 18px 42px #1f232938;padding:11px 14px;font-size:13px}@media(max-width:1380px){.ops-mail,.ops-message,.ops-knowledge{grid-template-columns:220px 330px minmax(0,1fr)}.ops-mail .ops-inspector,.ops-message .ops-inspector,.ops-knowledge .ops-inspector{display:none}}@media(max-width:1180px){.ops-module{height:auto;min-height:calc(100vh - 68px);grid-template-columns:1fr}.ops-pane{min-height:260px}.ops-list{max-height:420px}.ops-hero,.ops-row{grid-template-columns:1fr}.ops-metrics,.ops-action-grid,.ops-file-grid,.ops-meta-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.sop-editor-v04{--bg: #f0f2f5;--panel: #ffffff;--soft: #f8f9fb;--line: #dbe3ee;--line-soft: #e8eaed;--text: #172033;--muted: #646a73;--primary: #2f5bd6;--primary-soft: #eef4ff;--green: #047857;--green-soft: #ecfdf5;--amber: #b45309;--amber-soft: #fffbeb;--red: #be123c;--red-soft: #fff1f2;height:calc(100vh - 68px);min-height:720px;min-width:0;display:grid;grid-template-columns:minmax(760px,1fr) minmax(500px,34vw);gap:10px;padding:12px;background:var(--bg);color:var(--text);font-size:13px}.sop-editor-v04.chat-collapsed{grid-template-columns:minmax(760px,1fr) 52px}.sop-editor-v04 *,.sop-editor-v04 *:before,.sop-editor-v04 *:after{box-sizing:border-box}.sop-editor-v04 h2,.sop-editor-v04 p,.sop-editor-v04 ul{margin:0}.sop-editor-v04 button,.sop-editor-v04 input,.sop-editor-v04 textarea,.sop-editor-v04 select{font:inherit}.sop-editor-v04 button{cursor:pointer}.sop-editor-v04 button:disabled{cursor:not-allowed;opacity:.48}.sop-editor-v04-workspace,.sop-editor-v04-chat,.sop-editor-v04-chat-rail{min-width:0;min-height:0;border:1px solid var(--line);border-radius:10px;background:var(--panel);box-shadow:0 1px 2px #1f23290d;overflow:hidden}.sop-editor-v04-chat{display:flex;flex-direction:column;padding:12px}.section-title{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;padding-bottom:10px;border-bottom:1px solid var(--line-soft)}.section-title span,.sop-editor-v04-header span,.panel-heading span,.chat-head span{display:block;color:var(--primary);font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.section-title strong,.panel-heading strong,.chat-head strong{display:block;margin-top:2px;color:var(--text);font-size:16px;line-height:1.22}.section-title em{color:var(--muted);font-size:12px;font-style:normal}.flow-list-body{min-height:0;flex:1;overflow:auto;display:grid;align-content:start;gap:8px;padding-top:10px}.flow-list-body button{width:100%;display:grid;gap:6px;border:1px solid var(--line-soft);border-radius:9px;background:#fff;padding:10px;text-align:left;transition:.15s ease}.flow-list-body button:hover,.flow-list-body button.active{border-color:#adc4f4;background:#f7faff}.flow-list-body button.active{box-shadow:inset 3px 0 0 var(--primary)}.flow-list-body button>span{width:fit-content;border-radius:999px;background:var(--primary-soft);color:var(--primary);padding:2px 8px;font-size:11px;font-weight:850}.flow-list-body strong{color:var(--text);font-size:13px;line-height:1.35}.flow-list-body p{display:-webkit-box;overflow:hidden;color:var(--muted);font-size:12px;line-height:1.45;-webkit-box-orient:vertical;-webkit-line-clamp:3}.flow-list-body footer{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted);font-size:12px}.flow-list-body footer em{overflow:hidden;font-style:normal;text-overflow:ellipsis;white-space:nowrap}.flow-list-body footer b{color:#41464e}.sop-editor-v04-workspace{display:flex;flex-direction:column}.sop-editor-v04-header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:start;padding:14px 16px;border-bottom:1px solid var(--line-soft)}.sop-editor-v04-header h2{margin-top:4px;color:var(--text);font-size:24px;line-height:1.22;letter-spacing:0}.sop-editor-v04-header p{margin-top:6px;color:var(--muted);font-size:13px;line-height:1.5}.flow-title-picker{position:relative;width:fit-content;max-width:100%}.flow-title-trigger{max-width:min(820px,100%);display:inline-grid;grid-template-columns:minmax(0,1fr) 28px;gap:8px;align-items:center;border:0;background:transparent;color:var(--text);padding:0;text-align:left}.flow-title-trigger h2{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.flow-title-trigger svg{color:var(--primary)}.flow-title-menu{position:absolute;z-index:30;top:46px;left:0;width:min(640px,calc(100vw - 680px));min-width:420px;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:0 22px 58px #1f23292e;padding:8px}.flow-title-menu-list{max-height:330px;overflow:auto;display:grid;gap:6px;padding-right:2px}.flow-title-menu-list button{width:100%;display:grid;grid-template-columns:86px minmax(0,1fr);gap:4px 10px;align-items:center;border:1px solid transparent;border-radius:9px;background:#fff;padding:9px 10px;text-align:left}.flow-title-menu-list button:hover,.flow-title-menu-list button.active{border-color:#c7d7f2;background:#f6f9ff}.flow-title-menu-list span{grid-row:span 2;width:fit-content;border-radius:999px;background:var(--primary-soft);color:var(--primary);padding:2px 8px;font-size:11px;font-weight:850}.flow-title-menu-list strong{min-width:0;overflow:hidden;color:var(--text);font-size:13px;text-overflow:ellipsis;white-space:nowrap}.flow-title-menu-list small{color:var(--muted);font-size:12px}.create-flow-button{width:100%;min-height:38px;display:inline-flex;align-items:center;justify-content:center;gap:7px;margin-top:8px;border:1px solid var(--primary);border-radius:9px;background:var(--primary);color:#fff;font-size:13px;font-weight:800}.header-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.header-actions button,.sop-link-row button,.chat-examples button,.proposal-actions button,.ai-edit-button{min-height:34px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#41464e;padding:6px 10px;font-size:12px;font-weight:750}.header-actions button.primary{border-color:var(--primary);background:var(--primary);color:#fff}.sop-editor-v04-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;padding:6px 14px;border-bottom:1px solid var(--line-soft)}.sop-editor-v04-metrics article{min-height:34px;display:grid;grid-template-columns:16px minmax(0,1fr) auto;gap:6px;align-items:center;border:1px solid var(--line-soft);border-radius:8px;background:var(--soft);padding:5px 8px}.sop-editor-v04-metrics svg{color:var(--primary)}.sop-editor-v04-metrics span{color:var(--muted);font-size:11px;white-space:nowrap}.sop-editor-v04-metrics strong{color:var(--text);font-size:13px}.sop-editor-v04-main{min-height:0;flex:1;display:grid;grid-template-columns:1fr;gap:10px;padding:10px;background:#f8f9fb}.l0-flow-panel,.inspector-panel{min-width:0;min-height:0;border:1px solid var(--line);border-radius:9px;background:#fff;overflow:hidden}.l0-flow-panel,.inspector-panel{display:flex;flex-direction:column}.panel-heading{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;padding:12px;border-bottom:1px solid var(--line-soft);background:#fff}.panel-heading p{color:var(--muted);font-size:12px;line-height:1.45}.l0-flow{min-height:0;flex:1;overflow:auto;padding:14px 18px 28px 24px;background:linear-gradient(90deg,rgba(226,232,240,.5) 1px,transparent 1px),linear-gradient(180deg,rgba(226,232,240,.5) 1px,transparent 1px),#fbfdff;background-size:22px 22px}.l0-card{position:relative;display:grid;gap:8px;margin:0 0 14px}.l0-main{width:100%;display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:12px;align-items:center;border:1px solid #ccd8e8;border-radius:9px;background:#fff;padding:12px;text-align:left;box-shadow:0 8px 18px #1f23290f;transition:.15s ease}.l0-card.active .l0-main,.l0-main:hover{border-color:#9fb8ef;box-shadow:0 12px 24px #2f5bd624}.l0-main>span{width:54px;min-height:38px;display:grid;place-items:center;border-radius:8px;background:var(--primary-soft);color:var(--primary);font-weight:850}.l0-main>span b,.l0-main>span i{display:block;font-style:normal;line-height:1.1}.l0-main>span b{font-size:11px;letter-spacing:.08em}.l0-main>span i{margin-top:3px;font-size:11px}.l0-main strong{color:var(--text);font-size:15px;line-height:1.3}.l0-main p{margin-top:4px;color:#565c66;font-size:12px;line-height:1.45}.l0-main em{max-width:150px;overflow:hidden;border-radius:999px;background:#f1f5f9;color:#565c66;padding:4px 8px;font-size:11px;font-style:normal;font-weight:750;text-overflow:ellipsis;white-space:nowrap}.l0-meta{display:grid;gap:5px;margin-left:70px;border-left:3px solid #dce7fb;padding-left:10px;color:var(--muted);font-size:12px;line-height:1.4}.sop-link-row{display:flex;flex-wrap:wrap;gap:8px;margin-left:70px}.sop-link-row button:first-child{border-color:#bbf7d0;background:var(--green-soft);color:var(--green)}.sop-link-row .sop-summary{width:min(760px,calc(100% - 108px));min-height:58px;display:grid;grid-template-columns:18px 30px minmax(260px,1fr) auto;gap:5px 8px;align-items:center;border:1px solid #bbf7d0;border-radius:8px;background:var(--green-soft);color:var(--green);padding:7px 10px;text-align:left}.sop-link-row .sop-summary>svg{color:var(--green)}.sop-link-row .sop-summary span{grid-row:1 / span 2;grid-column:2;width:28px;height:28px;border-radius:8px;font-size:11px}.sop-link-row .sop-summary strong{display:block;overflow:hidden;color:#153d2a;font-size:13px;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}.sop-link-row .sop-summary p,.sop-link-row .sop-summary footer{color:#477462;font-size:11px;line-height:1.25}.sop-link-row .sop-summary p{display:inline;margin:0 10px 0 0}.sop-link-row .sop-summary footer{grid-row:1 / span 2;grid-column:4;display:flex;flex-direction:column;gap:2px;margin:0;text-align:right;white-space:nowrap}.cross-sop-chip{margin-left:2px;border-radius:999px;background:#ffedd5;color:#c2410c;padding:1px 7px;font-size:11px;font-style:normal;font-weight:850}.sop-expansion{display:grid;gap:8px;margin-left:70px;border-left:3px solid #bbf7d0;padding-left:10px}.sop-summary{width:100%;display:grid;grid-template-columns:64px minmax(0,1fr);gap:6px 14px;align-items:center;border:1px solid #bdebd0;border-radius:10px;background:#f4fff9;padding:16px 18px;text-align:left}.sop-summary span{grid-row:span 2;width:48px;height:48px;display:grid;place-items:center;border-radius:12px;background:#dcfce7;color:var(--green);font-size:14px;font-weight:850}.sop-summary strong{color:#153d2a;font-size:17px;line-height:1.25}.sop-summary p,.sop-summary footer{color:#477462;font-size:13px}.sop-summary p{margin-top:4px;line-height:1.35}.sop-summary p b{color:#166534;font-weight:850}.sop-summary footer{grid-column:2;display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}.sop-summary footer em,.sop-summary footer b,.sop-summary footer i{font-style:normal;font-weight:750}.sop-summary footer i{color:#c2410c}.sop-node-block{display:grid;gap:6px}.sop-node-title{width:100%;display:grid;grid-template-columns:18px 70px minmax(0,1fr) auto;gap:8px;align-items:center;border:1px solid #ddd6fe;border-radius:8px;background:#fbfaff;padding:9px 10px;text-align:left}.sop-node-title span{color:#6d28d9;font-size:11px;font-weight:850}.sop-node-title strong{color:#24144d;font-size:13px}.sop-node-title em{color:var(--muted);font-size:11px;font-style:normal}.cross-sop-transfer{display:grid;grid-template-columns:116px minmax(0,1fr);gap:8px;align-items:stretch;padding-left:28px}.cross-sop-rail{display:grid;place-items:center;align-content:center;gap:4px;border:1px dashed #fdba74;border-radius:8px;background:#fff7ed;color:#b45309;font-size:11px;font-weight:850;text-align:center}.cross-sop-card{border:1px solid #fed7aa;border-radius:9px;background:#fffaf4;padding:9px 10px}.cross-sop-card header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;margin-bottom:5px}.cross-sop-card strong{color:#7c2d12;font-size:13px}.cross-sop-card em{border-radius:999px;background:#ffedd5;color:#9a3412;padding:2px 7px;font-size:11px;font-style:normal;font-weight:800}.cross-sop-card p,.cross-sop-card footer{color:#9a3412;font-size:12px;line-height:1.45}.cross-sop-card footer{margin-top:5px;padding-top:5px;border-top:1px dashed #fed7aa}.l2-step-list{display:grid;gap:6px;padding-left:28px}.l2-step-list button{width:100%;display:grid;grid-template-columns:92px minmax(0,1fr) auto;gap:8px;align-items:center;border:1px solid var(--line-soft);border-radius:8px;background:#fff;padding:8px 10px;text-align:left}.l2-step-list button:hover,.l2-step-list button.active{border-color:#f6c173;background:#fffaf1}.l2-step-list span{width:fit-content;border-radius:999px;background:#fef3c7;color:#92400e;padding:2px 7px;font-size:11px;font-weight:800}.l2-step-list strong{min-width:0;overflow:hidden;color:var(--text);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.l2-step-list em{color:var(--muted);font-size:11px;font-style:normal}.l2-step-list button.cross-wait{border-color:#fdba74;background:#fff7ed}.l2-step-list button.cross-wait span{background:#ffedd5;color:#c2410c}.flow-connector{width:2px;height:18px;margin:-2px 0 0 28px;background:var(--primary)}.inspector-panel{background:#fff}.inspector-body{min-height:0;flex:1;overflow:auto;padding:12px}.object-header{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;align-items:center;margin-bottom:12px;border:1px solid var(--line-soft);border-radius:9px;background:var(--soft);padding:10px}.object-header>span{width:34px;height:34px;display:grid;place-items:center;border-radius:8px;background:var(--primary-soft);color:var(--primary)}.object-header em{display:block;color:var(--muted);font-size:11px;font-style:normal;font-weight:800}.object-header strong{display:block;margin-top:2px;color:var(--text);font-size:14px;line-height:1.32}.editor-field{display:grid;gap:6px;margin-bottom:10px;color:#565c66;font-size:12px;font-weight:750}.editor-field input,.editor-field textarea,.editor-field select{width:100%;min-width:0;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--text);padding:8px 10px;font-size:13px;font-weight:400;outline:0}.editor-field input,.editor-field select{min-height:36px}.editor-field textarea{min-height:82px;resize:vertical;line-height:1.5}.editor-field input:focus,.editor-field textarea:focus,.editor-field select:focus,.chat-composer textarea:focus,.chat-composer select:focus{border-color:#9fb8ef;box-shadow:0 0 0 3px #2f5bd61f}.validation-box{border:1px solid #bbf7d0;border-radius:9px;background:var(--green-soft);padding:10px;margin-bottom:10px}.validation-box strong{color:var(--green);font-size:13px}.validation-box p{margin-top:5px;color:#166534;font-size:12px;line-height:1.45}.ai-edit-button{width:100%;border-color:#adc4f4;background:var(--primary-soft);color:var(--primary)}.sop-editor-v04-chat{overflow:hidden}.sop-editor-v04-chat.right-chat.copilot-chat{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;padding:0;overflow:hidden;background:#fbfbfc;border-color:#d8e2f1}.sop-editor-v04-chat .copilot-head button{width:34px;height:34px;display:grid;place-items:center;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e}.sop-editor-v04-chat .copilot-quick button:disabled{background:#f0f2f5;color:#8f959e}.sop-editor-v04-chat .copilot-action-card.diff{border-color:#bacefd;background:#f8fbff}.sop-editor-v04-chat .copilot-action-card.simulation{border-color:#bbf7d0;background:#f0fdf4}.sop-editor-v04-chat .copilot-action-card.publish{border-color:#ddd6fe;background:#fbfaff}.sop-editor-v04-chat .copilot-action-card.upload{border-color:#fed7aa;background:#fff7ed}.sop-editor-v04-chat .copilot-action-card.question{border-color:#e3e8f0;background:#fff}.sop-editor-v04-diff-list{display:grid;gap:5px;margin:8px 0 0;padding-left:18px;color:#4b5563;font-size:12px;line-height:1.5}.sop-editor-v04-send-actions{display:inline-flex;align-items:center;gap:8px}.sop-editor-v04-send-actions input[type=file]{display:none}.sop-editor-v04-upload-button{min-width:36px;width:36px;padding:0!important;border:1px solid #dee0e3!important;background:#fff!important;color:#2f6fed!important}.sop-editor-v04-chat-rail{display:grid;place-items:center;align-content:center;gap:8px;padding:10px 0;color:var(--primary)}.sop-editor-v04-chat-rail span{writing-mode:vertical-rl;color:#41464e;font-size:12px;font-weight:850;letter-spacing:0}.chat-head{display:grid;grid-template-columns:minmax(0,1fr) 34px;gap:8px;align-items:center;padding-bottom:10px;border-bottom:1px solid var(--line-soft)}.chat-head button{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);border-radius:8px;background:#fff;color:#41464e}.chat-stream{min-height:0;flex:1;overflow:auto;padding:12px 2px 10px 0}.chat-stream article{display:grid;grid-template-columns:28px minmax(0,1fr);gap:8px;margin-bottom:10px}.chat-stream article>span{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:#eef2ff;color:var(--primary)}.chat-stream article.user>span{background:#f1f5f9;color:#41464e}.chat-stream article>div{border:1px solid var(--line-soft);border-radius:9px;background:#fff;padding:9px 10px}.chat-stream article.ai>div{border-color:#e1eaff;background:#f8fbff}.chat-stream article.diff>div,.proposal-card>div{border-color:#bacefd;background:#f8fbff}.chat-stream article.simulation>div{border-color:#bbf7d0;background:#f0fdf4}.chat-stream article.publish>div{border-color:#ddd6fe;background:#fbfaff}.chat-stream em{display:inline-flex;margin-bottom:6px;border-radius:999px;background:var(--primary-soft);color:var(--primary);padding:2px 7px;font-size:11px;font-style:normal;font-weight:850}.chat-stream p{white-space:pre-line;color:#41464e;font-size:13px;line-height:1.55}.chat-stream small{display:block;margin-top:6px;color:#8f959e;font-size:11px}.proposal-card strong{display:block;color:var(--text);font-size:13px;margin-bottom:5px}.proposal-card ul{display:grid;gap:4px;padding-left:18px;margin-top:7px;color:#41464e;font-size:12px;line-height:1.45}.proposal-actions{display:flex;gap:8px;margin-top:10px}.proposal-actions button:first-child{border-color:#bbf7d0;background:var(--green-soft);color:var(--green)}.proposal-actions button:last-child{border-color:var(--primary);background:var(--primary);color:#fff}.chat-composer{display:grid;gap:8px;padding-top:10px;border-top:1px solid var(--line-soft)}.chat-composer label{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;align-items:center;color:var(--muted);font-size:12px;font-weight:750}.chat-composer select{min-height:32px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--text);padding:6px 8px}.composer-row{display:grid;grid-template-columns:38px minmax(0,1fr) 38px;gap:8px}.composer-row input[type=file]{display:none}.composer-row textarea{min-height:68px;max-height:140px;resize:vertical;border:1px solid var(--line);border-radius:9px;padding:9px 10px;color:var(--text);font-size:13px;line-height:1.5;outline:0}.composer-row button{width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:9px;background:var(--primary);color:#fff}.composer-row button.upload{border:1px solid var(--line);background:#fff;color:var(--primary)}@media(max-width:1440px){.sop-editor-v04{grid-template-columns:minmax(680px,1fr) minmax(460px,36vw)}.sop-editor-v04.chat-collapsed{grid-template-columns:minmax(680px,1fr) 52px}}@media(max-width:1220px){.sop-editor-v04,.sop-editor-v04.chat-collapsed{height:auto;min-height:calc(100vh - 68px);grid-template-columns:1fr}.sop-editor-v04-chat-rail{min-height:56px}.sop-editor-v04-chat-rail span{writing-mode:horizontal-tb}.sop-editor-v04-main{grid-template-columns:1fr}.flow-title-menu{width:min(620px,calc(100vw - 48px));min-width:0}.sop-editor-v04-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.sop-editor-v04-header{grid-template-columns:1fr}.header-actions{justify-content:flex-start}}.execution-panel{overflow:auto;padding:16px}.task-hero{display:flex;justify-content:space-between;gap:20px;padding:18px;border:1px solid #dee0e3;border-radius:10px;background:linear-gradient(135deg,#fff,#f7faff)}.hero-kicker{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:12px;color:#646a73}.hero-main h2{font-size:24px;letter-spacing:0;margin-bottom:6px}.hero-actions{gap:9px;align-self:flex-start}.primary-action,.secondary-action,.ghost-action,.artifact-strip button{height:36px;padding:0 12px;font-size:13px}.metric-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:12px 0}.metric-card{display:grid;grid-template-columns:36px 1fr;gap:2px 10px;align-items:center;border:1px solid #e2e8f0;border-radius:10px;padding:12px;background:#fff}.metric-card div{grid-row:span 2;width:36px;height:36px;display:grid;place-items:center;border-radius:8px;background:#f0f4ff;color:#3370ff}.metric-card span{font-size:12px;color:#646a73}.metric-card strong{font-size:14px}.work-surface{display:grid;grid-template-columns:320px minmax(360px,1fr);gap:12px;align-items:start}.node-rail,.node-detail{min-width:0}.node-step{width:100%;display:grid;grid-template-columns:34px 1fr 18px;gap:10px;border:1px solid #e1e7f0;border-radius:10px;background:#fff;padding:12px;text-align:left;margin-bottom:10px}.node-step.active{border-color:#3370ff;background:#f7faff}.node-index{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:#eef2ff;color:#3370ff;font-weight:700}.node-title-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.node-title-row h3{font-size:14px}.node-copy p{display:flex;align-items:center;gap:6px;margin-top:5px;flex-wrap:wrap}.node-copy p span{width:3px;height:3px;border-radius:999px;background:#8f959e}.node-clock{color:#8f959e}.detail-grid,.detail-columns{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:12px}.detail-card{border:1px solid #e1e7f0;border-radius:10px;background:#fff;padding:14px}.ai-card{border-color:#bacefd;background:#f8fbff}.human-card{border-color:#fde68a;background:#fffdf4}.card-title{gap:7px;font-size:13px;font-weight:750;margin-bottom:9px}.detail-card p{font-size:13px;color:#565c66;line-height:1.55}.card-actions,.feedback-box,.context-actions{gap:8px;margin-top:12px;flex-wrap:wrap}.feedback-box button,.context-actions button{height:31px;padding:0 9px;font-size:12px}.step-list{margin:0;padding:0;list-style:none}.step-list li{display:flex;gap:9px;align-items:center;font-size:13px;color:#41464e;padding:8px 0;border-bottom:1px solid #f0f2f5}.step-list li span{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;background:#eef2ff;color:#3370ff;font-size:11px;font-weight:700}.evidence-list{display:grid;gap:8px}.evidence-item{display:flex;justify-content:space-between;padding:9px 10px;border-radius:8px;font-size:13px;background:#f8f9fb}.evidence-item.good{background:#ecfdf5;color:#047857}.evidence-item.warning{background:#fffbeb;color:#b45309}.evidence-item.danger{background:#fff1f2;color:#be123c}.tool-table{display:grid;gap:8px}.tool-row{display:grid;grid-template-columns:10px minmax(120px,1fr) 56px auto;gap:10px;min-height:38px;padding:9px;border-radius:8px;background:#f8f9fb;font-size:12px}.tool-dot{width:8px;height:8px;border-radius:999px;background:#8f959e}.tool-dot.success{background:#10b981}.tool-dot.running{background:#3370ff}.tool-dot.warning{background:#f59e0b}.tool-row p{font-size:12px;grid-column:2 / -1}.tool-row button{height:28px;padding:0 9px}.artifact-strip{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px;padding:12px 14px;border:1px dashed #b8c5d6;border-radius:10px;background:#fbfdff}.artifact-strip strong{display:block;font-size:13px}.artifact-strip span{font-size:12px;color:#646a73}.right-chat{padding-bottom:12px}.context-card{margin:12px;padding:13px;border:1px solid #e1eaff;border-radius:10px;background:#f8fbff}.context-title{display:flex;align-items:center;gap:7px;font-size:12px;color:#3370ff;margin-bottom:8px;font-weight:700}.context-card strong{font-size:13px}.quick-prompts{display:flex;flex-wrap:wrap;gap:7px;padding:0 12px 12px;border-bottom:1px solid #edf1f6}.quick-prompts button{height:30px;padding:0 9px;border:1px solid #dee0e3;border-radius:999px;background:#fff;color:#41464e;font-size:12px}.message-list{padding-top:8px}.message{display:grid;grid-template-columns:28px 1fr;gap:8px;margin-bottom:12px}.message-icon{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:#eef2ff;color:#3370ff}.message.user .message-icon{background:#f1f5f9;color:#41464e}.message div:last-child{padding:9px 10px;border:1px solid #e1e7f0;border-radius:10px;background:#fff}.message.ai div:last-child{background:#f8fbff;border-color:#e1eaff}.message.system div:last-child{background:#f8f9fb}.message p{font-size:13px;line-height:1.5;color:#41464e}.message span{display:block;margin-top:6px;font-size:11px;color:#8f959e}.chat-input{display:grid;grid-template-columns:1fr 40px;gap:8px;padding:12px;border-top:1px solid #edf1f6}.chat-input textarea{min-height:60px;resize:none;border:1px solid #dee0e3;border-radius:9px;padding:10px;outline:none}.chat-input button{border:0;border-radius:9px;background:#3370ff;color:#fff}@media(max-width:1280px){body{min-width:1040px}.workspace{grid-template-columns:300px minmax(540px,1fr) 320px}.work-surface,.detail-grid,.detail-columns{grid-template-columns:1fr}}:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#f0f2f5;color:#172033}*{box-sizing:border-box}body{margin:0;min-width:1180px;background:#f0f2f5}button,input,select,textarea{font:inherit}button{cursor:pointer}.app-shell{height:100vh;display:flex;flex-direction:column}.topbar{height:68px;display:grid;grid-template-columns:340px minmax(360px,620px) auto;gap:16px;align-items:center;padding:0 22px;background:#fff;border-bottom:1px solid #dee0e3}.brand-block,.top-actions,.hero-actions,.card-actions,.context-actions,.task-card-top,.task-bottom,.filter-title,.tool-row,.card-title{display:flex;align-items:center}.brand-block{gap:12px}.brand-mark,.chat-avatar{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;color:#fff;background:#3370ff}h1,h2,h3,p{margin:0}.brand-block h1{font-size:15px;letter-spacing:0}.brand-block p,.hero-main p,.task-card p,.node-copy p,.context-card p{font-size:12px;color:#667389}.top-search-wrap{position:relative;width:100%;max-width:640px}.top-search{height:40px;display:flex;align-items:center;gap:10px;padding:0 12px;border:1px solid #dee0e3;border-radius:8px;background:#f8f9fb;color:#646a73}.search-clear{width:26px;height:26px;display:grid;place-items:center;border:0;border-radius:7px;background:transparent;color:#646a73}.search-popover{position:absolute;z-index:20;top:46px;left:0;right:0;max-height:420px;overflow:auto;padding:8px;border:1px solid #dee0e3;border-radius:10px;background:#fff;box-shadow:0 18px 42px #1f232929}.search-popover button,.search-empty{width:100%;display:grid;gap:4px;padding:10px;border:0;border-radius:8px;background:#fff;text-align:left}.search-popover button:hover{background:#f1f5f9}.search-popover button span{width:fit-content;padding:2px 7px;border-radius:999px;background:#f0f4ff;color:#245bdb;font-size:11px}.search-popover button strong{font-size:13px}.search-popover button p,.search-empty{font-size:12px;color:#646a73}.top-search input{width:100%;border:0;outline:0;background:transparent;color:#1f2937}.top-actions{gap:8px;justify-content:flex-end}.top-user-menu{position:relative}.top-user-button{width:36px;height:36px;display:inline-grid;place-items:center;border:1px solid #dee0e3;border-radius:999px;background:#fff;color:#3370ff}.top-user-button:hover,.top-user-button[aria-expanded=true]{border-color:#bacefd;background:#f0f4ff}.top-user-popover{position:absolute;z-index:30;top:44px;right:0;width:220px;padding:8px;border:1px solid #dee0e3;border-radius:10px;background:#fff;box-shadow:0 18px 42px #1f232929}.top-user-summary{display:grid;grid-template-columns:36px minmax(0,1fr);gap:9px;align-items:center;padding:8px;border-bottom:1px solid #edf1f6}.top-user-avatar{width:36px;height:36px;display:grid;place-items:center;border-radius:999px;background:#3370ff;color:#fff;font-weight:800}.top-user-summary strong{display:block;color:#1f2329;font-size:13px}.top-user-summary small{display:block;margin-top:2px;color:#646a73;font-size:12px}.top-user-logout{width:100%;min-height:34px;display:flex;align-items:center;gap:8px;margin-top:6px;border:0;border-radius:8px;background:#fff;color:#41464e;padding:0 9px;text-align:left}.top-user-logout:hover{background:#f1f5f9;color:#be123c}.nav-button,.icon-button,.primary-action,.secondary-action,.ghost-action,.sort-button,.artifact-strip button,.tool-row button,.context-actions button,.quick-prompts button,.feedback-box button{border:1px solid #dee0e3;background:#fff;color:#41464e;border-radius:8px;display:inline-flex;align-items:center;gap:7px}.nav-button{height:36px;padding:0 12px;font-size:13px}.nav-button.active,.primary-action,.primary-square{border-color:#3370ff;background:#3370ff;color:#fff}.icon-button,.primary-square{width:36px;height:36px;justify-content:center}.primary-square{border:0;border-radius:8px}.workspace{flex:1;min-height:0;display:grid;grid-template-columns:310px minmax(720px,1fr) 340px;gap:14px;padding:14px}.workspace.chat-collapsed{grid-template-columns:310px minmax(880px,1fr)}.task-sidebar,.execution-panel,.right-chat{min-height:0;background:#fff;border:1px solid #dee0e3;border-radius:10px;overflow:hidden}.task-sidebar,.right-chat{display:flex;flex-direction:column}.sidebar-head,.chat-head{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid #edf1f6}.eyebrow{font-size:11px;color:#646a73;text-transform:uppercase;letter-spacing:.08em}.sidebar-head h2,.chat-head h2{font-size:18px;margin-top:3px}.filter-panel{padding:12px 14px;border-bottom:1px solid #edf1f6;background:#f8f9fb}.filter-title{gap:6px;font-size:12px;color:#646a73;margin-bottom:9px}.filter-row{display:grid;grid-template-columns:42px 1fr;align-items:center;gap:8px;margin:7px 0;font-size:12px;color:#646a73}.filter-row select{height:31px;border:1px solid #dee0e3;border-radius:7px;background:#fff;color:#1f2937;padding:0 8px}.sort-button{width:100%;height:32px;justify-content:center;margin-top:8px;font-size:12px}.queue-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:12px 14px;border-bottom:1px solid #edf1f6}.queue-summary div{padding:8px;border:1px solid #edf1f6;border-radius:8px;background:#fbfdff}.queue-summary strong{display:block;font-size:17px}.queue-summary span{font-size:11px;color:#646a73}.task-list,.message-list{flex:1;overflow:auto;padding:12px}.task-card{position:relative;width:100%;text-align:left;border:1px solid #dfe6ef;border-radius:10px;background:#fff;padding:12px;margin-bottom:10px;transition:.16s ease}.task-card:before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:4px;border-radius:0 999px 999px 0;background:var(--task-color, #3370ff)}.task-card:hover,.task-card.selected{border-color:var(--task-color, #3370ff);box-shadow:0 10px 28px #1f23291f}.task-card.selected{background:#fbfdff}.task-card-top{justify-content:space-between;margin-bottom:9px}.task-card h3{font-size:14px;line-height:1.35;margin-bottom:4px}.task-meta,.task-bottom,.task-state-row{display:flex;justify-content:space-between;gap:8px;margin-top:10px;font-size:12px;color:#646a73}.task-state-row{margin-top:9px;color:#565c66}.task-bottom span{display:flex;align-items:center;gap:5px}.progress-line,.mini-progress{height:6px;border-radius:99px;background:#e8edf4;overflow:hidden;margin-top:10px}.progress-line span,.mini-progress i{display:block;height:100%;background:#3370ff;border-radius:inherit}.pill{display:inline-flex;align-items:center;height:24px;padding:0 8px;border-radius:999px;font-size:11px;font-weight:650;border:1px solid transparent}.pill.blue{color:#245bdb;background:#f0f4ff;border-color:#bacefd}.pill.green{color:#047857;background:#ecfdf5;border-color:#a7f3d0}.pill.amber{color:#b45309;background:#fffbeb;border-color:#fde68a}.pill.red{color:#be123c;background:#fff1f2;border-color:#fecdd3}.pill.gray{color:#565c66;background:#f1f5f9;border-color:#e2e8f0}.login-page{min-height:100vh;display:grid;place-items:center;padding:42px;background:linear-gradient(135deg,rgba(51,112,255,.08),transparent 40%),linear-gradient(315deg,rgba(5,150,105,.1),transparent 36%),#f0f2f5}.login-hero{width:min(1060px,100%);display:grid;gap:26px}.login-brand{display:flex;align-items:center;gap:12px}.login-brand>span,.login-role-icon{display:grid;place-items:center;color:#fff;background:#3370ff}.login-brand>span{width:46px;height:46px;border-radius:12px}.login-brand h1{font-size:18px}.login-brand p,.login-copy p,.login-role-card p,.login-role-card small{color:#646a73}.login-copy{max-width:680px}.login-copy h2{margin:6px 0 8px;font-size:34px;line-height:1.1;letter-spacing:0}.login-copy p{font-size:15px;line-height:1.7}.login-role-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.login-role-card{min-height:340px;display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:20px;border:1px solid #dee0e3;border-radius:8px;background:#ffffffeb;color:#172033;text-align:left;box-shadow:0 18px 42px #1f23291a;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.login-role-card:hover{transform:translateY(-2px);border-color:#82a7fc;box-shadow:0 22px 48px #1f232924}.login-role-icon{width:44px;height:44px;border-radius:10px}.login-role-card.admin .login-role-icon{background:#7c2d12}.login-role-card strong{font-size:20px}.login-role-card small{font-size:13px}.login-role-card p{min-height:78px;font-size:14px;line-height:1.6}.login-module-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}.login-module-row i{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border:1px solid #dee0e3;border-radius:999px;background:#f8f9fb;color:#41464e;font-size:12px;font-style:normal}.login-role-card em{width:100%;display:inline-flex;justify-content:center;padding:10px 12px;border-radius:7px;background:#3370ff;color:#fff;font-style:normal;font-weight:700}.login-role-card.admin em{background:#7c2d12}.workspace{position:relative}.task-hero{border-top:4px solid #3370ff}.hero-actions{display:grid;grid-template-columns:repeat(2,auto);align-items:end}.control-field{display:grid;gap:5px;font-size:11px;color:#646a73}.control-field select{height:34px;min-width:170px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#172033;padding:0 9px}.control-field.compact select{min-width:190px}.center-tabs{display:flex;gap:8px;margin-bottom:12px;border-bottom:1px solid #e5edf6}.center-tabs button{height:38px;display:inline-flex;align-items:center;gap:7px;border:0;border-bottom:2px solid transparent;background:transparent;color:#646a73;font-weight:650}.center-tabs button.active{color:#3370ff;border-bottom-color:#3370ff}.node-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px;margin-bottom:12px;border:1px solid #e1e7f0;border-radius:10px;background:#fff}.node-toolbar span{display:block;margin-bottom:4px;font-size:11px;color:#646a73}.node-toolbar strong{font-size:14px}.block-card{display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:start;padding:12px;margin-bottom:12px;border:1px solid #fecdd3;border-radius:10px;background:#fff7f8;color:#9f1239}.block-card svg{margin-top:2px}.block-card p{margin-top:4px;color:#646a73;font-size:12px}.io-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:12px}.io-card{padding:11px;border:1px solid #e1e7f0;border-radius:10px;background:#fff}.io-card span{display:block;margin-bottom:6px;font-size:11px;font-weight:750;color:#3370ff}.io-card p{font-size:12px;line-height:1.5;color:#565c66}.workspace-tab{display:grid;gap:12px}.workspace-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.workspace-card,.workspace-wide{min-width:0;padding:14px;border:1px solid #e1e7f0;border-radius:10px;background:#fff}.workspace-card p{font-size:13px;line-height:1.55;color:#565c66}.tag-list{display:flex;flex-wrap:wrap;gap:8px}.tag-list span{padding:6px 9px;border-radius:999px;background:#f1f5f9;color:#41464e;font-size:12px}.plain-list{margin:0;padding-left:18px;color:#565c66;font-size:13px;line-height:1.65}.flow-overview{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.flow-node{position:relative;min-height:190px;display:grid;gap:8px;align-content:start;padding:12px;border:1px solid #dfe6ef;border-radius:10px;background:#fbfdff;text-align:left}.flow-node.active{border-color:#3370ff;box-shadow:0 10px 24px #3370ff1f}.flow-index{width:26px;height:26px;display:grid;place-items:center;border-radius:8px;background:#eef2ff;color:#3370ff;font-weight:750}.flow-node strong{font-size:13px}.flow-node p,.flow-node small,.flow-node em{font-size:12px;line-height:1.45;color:#646a73}.flow-node em{font-style:normal;color:#be123c}.automation-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.automation-card{display:grid;grid-template-columns:38px 1fr;gap:10px;padding:12px;border:1px solid #dfe6ef;border-radius:10px;background:#fbfdff}.automation-card.fired{border-color:#bacefd;background:#f0f4ff}.automation-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:9px;background:#eef2ff;color:#3370ff}.automation-head{display:flex;justify-content:space-between;gap:8px}.automation-card p,.automation-card span,.automation-card small{display:block;margin-top:5px;font-size:12px;color:#646a73}.automation-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}.automation-actions button{height:29px;padding:0 9px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e;font-size:12px}.chat-tools{display:flex;align-items:center;gap:8px}.chat-input-area{border-top:1px solid #edf1f6;background:#fff}.selected-context,.empty-context{position:relative;margin:12px 12px 0;padding:12px;border:1px solid #e1eaff;border-radius:10px;background:#f8fbff}.selected-context>button{position:absolute;top:8px;right:8px;width:26px;height:26px;display:grid;place-items:center;border:0;border-radius:7px;background:#fff;color:#646a73}.empty-context{font-size:12px;color:#646a73;background:#f8f9fb;border-color:#e2e8f0}.chat-action-card{display:grid;gap:4px;margin-bottom:8px;padding:9px;border:1px solid #bacefd;border-radius:8px;background:#f0f4ff}.chat-action-card strong{font-size:13px;color:#245bdb}.chat-action-card span{margin:0;font-size:12px;color:#565c66}.chat-card-actions{display:flex;gap:7px;margin-top:9px}.chat-card-actions button{height:30px;padding:0 10px;border-radius:8px;border:1px solid #dee0e3;background:#fff;font-size:12px}.chat-card-actions button.primary{border-color:#3370ff;background:#3370ff;color:#fff}.chat-card-actions button.danger{border-color:#fecdd3;background:#fff1f2;color:#be123c}.expand-chat{position:absolute;right:16px;top:84px;height:38px;display:inline-flex;align-items:center;gap:7px;padding:0 12px;border:1px solid #dee0e3;border-radius:10px;background:#fff;color:#3370ff;box-shadow:0 12px 28px #1f232924}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:grid;place-items:center;padding:24px;background:#1f232961}.action-modal{width:min(620px,100%);max-height:min(720px,90vh);display:flex;flex-direction:column;overflow:hidden;border-radius:12px;border:1px solid #dbe3ef;background:#fff;box-shadow:0 28px 80px #1f232947}.action-modal header,.action-modal footer{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:16px;border-bottom:1px solid #edf1f6}.action-modal footer{border-top:1px solid #edf1f6;border-bottom:0;justify-content:flex-end}.action-modal h2{font-size:18px;margin-bottom:4px}.action-modal header p{font-size:12px;color:#646a73}.modal-body{overflow:auto;padding:16px}.detail-list{display:grid;gap:9px}.detail-list div{display:grid;grid-template-columns:128px 1fr;gap:12px;padding:10px;border:1px solid #e5edf6;border-radius:9px;background:#fbfdff}.detail-list span{font-size:12px;color:#646a73}.detail-list strong{font-size:13px;line-height:1.45;color:#172033}.toast-stack{position:fixed;z-index:60;right:18px;top:82px;display:grid;gap:8px;pointer-events:none}.toast-stack div{min-width:240px;max-width:360px;padding:10px 12px;border:1px solid #bacefd;border-radius:10px;background:#f0f4ff;color:#245bdb;box-shadow:0 14px 34px #1f232929;font-size:13px}@media(max-width:1280px){.workspace{grid-template-columns:300px minmax(500px,1fr) 300px}.workspace.chat-collapsed{grid-template-columns:300px minmax(700px,1fr)}.workspace-grid,.automation-grid,.flow-overview,.io-grid{grid-template-columns:1fr}}.workspace{grid-template-columns:310px minmax(620px,1fr) 360px;gap:0;padding:12px}.workspace.left-collapsed{grid-template-columns:52px minmax(760px,1fr) 360px}.task-sidebar{border-right:0;border-radius:12px 0 0 12px;box-shadow:0 14px 36px #1f232914}.execution-panel{min-width:0;display:flex;flex-direction:column;overflow:hidden;border-left:0;border-radius:0 12px 12px 0;box-shadow:0 14px 36px #1f232914}.right-chat{margin-left:14px;border-color:#bacefd;background:#f7fbff;box-shadow:0 16px 42px #3370ff21}.right-chat .chat-head,.right-chat .chat-input-area{background:#f8fbff}.right-chat .chat-avatar{background:#16409e}.side-rail{min-height:0;width:52px;display:grid;justify-items:center;align-content:start;gap:12px;padding:14px 8px;border:1px solid #dee0e3;background:#fff;color:#3370ff;box-shadow:0 14px 36px #1f232914}.side-rail span{writing-mode:vertical-rl;letter-spacing:0;font-size:13px;font-weight:750}.side-rail strong{width:26px;height:26px;display:grid;place-items:center;border-radius:8px;background:#f0f4ff;font-size:12px}.task-rail{border-radius:12px 0 0 12px;border-right:0}.chat-rail{margin-left:14px;border-color:#bacefd;border-radius:12px;background:#f7fbff;color:#16409e}.sidebar-tools{display:flex;gap:7px}.filter-panel.compact{padding:9px 12px}.filter-toggle{width:100%;justify-content:space-between;border:0;background:transparent;padding:0}.filter-toggle span{max-width:150px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11px;color:#8f959e}.filter-chips{display:flex;gap:7px;margin-top:8px}.filter-chips span{height:24px;display:inline-flex;align-items:center;gap:4px;padding:0 8px;border:1px solid #e2e8f0;border-radius:999px;background:#fff;color:#565c66;font-size:11px}.task-card{border-width:1px;padding-left:15px}.task-card.selected{border-width:2px;background:linear-gradient(90deg,color-mix(in srgb,var(--task-color, #3370ff) 10%,#ffffff),#fff 72%);box-shadow:inset 5px 0 0 var(--task-color, #3370ff),0 14px 34px #1f232929;transform:translate(3px)}.task-card.selected h3{color:#1f2329}.center-tabs{flex:0 0 auto;padding:0 16px;margin-bottom:0;background:#fff}.center-tabs .trigger-tab span{min-width:20px;height:20px;display:inline-grid;place-items:center;border-radius:999px;background:#e1eaff;color:#245bdb;font-size:11px}.center-tabs .trigger-tab.active span{background:#3370ff;color:#fff}.center-scroll{flex:1;min-height:0;overflow:auto;padding:14px 16px 16px}.task-hero,.metric-row{flex:0 0 auto;margin-left:16px;margin-right:16px}.task-hero{margin-top:16px}.automation-tab{display:grid;gap:12px}.trigger-hero{display:flex;justify-content:space-between;gap:16px;padding:16px;border:1px solid #bacefd;border-radius:12px;background:linear-gradient(135deg,#f0f4ff,#fff)}.trigger-hero h3{font-size:18px;margin:3px 0 5px}.trigger-hero p{max-width:680px;color:#565c66;font-size:13px;line-height:1.55}.trigger-hero button{height:36px;align-self:start;display:inline-flex;align-items:center;gap:7px;border:1px solid #3370ff;border-radius:9px;background:#3370ff;color:#fff;padding:0 12px}.trigger-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.trigger-stats div{padding:12px;border:1px solid #e1e7f0;border-radius:10px;background:#fff}.trigger-stats span{display:block;color:#646a73;font-size:12px}.trigger-stats strong{font-size:22px}.trigger-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.trigger-card{display:grid;gap:12px;padding:14px;border:1px solid #dfe6ef;border-radius:12px;background:#fff}.trigger-card.fired{border-color:#82a7fc;background:#f0f4ff}.trigger-card-head,.trigger-footer,.trigger-footer div{display:flex;align-items:center;gap:9px}.trigger-card-head{justify-content:space-between}.trigger-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:#eef2ff;color:#3370ff}.trigger-card-head>div:nth-child(2){flex:1}.trigger-card-head p,.trigger-rule p,.trigger-footer small{color:#646a73;font-size:12px;line-height:1.45}.trigger-rule span{display:block;margin-bottom:4px;color:#3370ff;font-size:11px;font-weight:750}.trigger-footer{justify-content:space-between;border-top:1px solid #f0f2f5;padding-top:10px}.trigger-footer button{height:28px;padding:0 9px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e;font-size:12px}.trigger-timeline{display:grid;gap:9px;padding:14px;border:1px solid #e1e7f0;border-radius:12px;background:#fff}.trigger-timeline>div:not(.card-title){display:grid;grid-template-columns:12px 72px 160px 1fr;gap:10px;align-items:center;font-size:12px;color:#646a73}.trigger-timeline i{width:8px;height:8px;border-radius:999px;background:#3370ff}@media(max-width:1280px){.workspace{grid-template-columns:270px minmax(500px,1fr) 300px}.workspace.left-collapsed{grid-template-columns:52px minmax(650px,1fr) 300px}.workspace.chat-collapsed{grid-template-columns:270px minmax(700px,1fr) 52px}.workspace.left-collapsed.chat-collapsed{grid-template-columns:52px minmax(840px,1fr) 52px}.trigger-grid,.trigger-stats{grid-template-columns:1fr}}.app-body{flex:1;min-height:0;display:grid;grid-template-columns:86px minmax(0,1fr);background:#eef0f4}.app-nav{min-height:0;display:flex;flex-direction:column;gap:8px;padding:12px 10px;border-right:1px solid #dee0e3;background:#f8f9fb}.app-nav-mark{width:44px;height:44px;display:grid;place-items:center;margin:0 auto 8px;border-radius:12px;background:#16409e;color:#fff}.app-nav button{position:relative;min-height:66px;display:grid;justify-items:center;align-content:center;gap:6px;border:1px solid transparent;border-radius:12px;background:transparent;color:#646a73;font-size:12px;font-weight:700}.app-nav-icon-wrap{position:relative;display:inline-grid;place-items:center;min-width:24px;min-height:22px}.app-nav-badge{position:absolute;top:-10px;right:-15px;min-width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px;border:2px solid #f8f9fb;border-radius:999px;background:#e11d48;color:#fff;font-size:10px;font-weight:800;line-height:1;box-shadow:0 4px 10px #e11d4847;pointer-events:none}.app-nav button:hover{background:#eef4ff;color:#3370ff}.app-nav button.separated{margin-top:10px}.app-nav button.separated:before{content:"";position:absolute;top:-10px;left:8px;right:8px;height:1px;background:#dee0e3}.app-nav button.active{border-color:#bacefd;background:#eaf0ff;color:#1c4cba;box-shadow:inset 3px 0 #3370ff}.workspace{min-width:0;height:100%}.module-page{min-width:0;min-height:0;overflow:auto;padding:18px}.module-hero{display:flex;justify-content:space-between;gap:20px;padding:20px;border:1px solid #e1eaff;border-radius:14px;background:linear-gradient(135deg,#fff,#f0f4ff);box-shadow:0 16px 42px #1f232914}.module-hero h2{margin:4px 0 6px;font-size:24px}.module-hero p{max-width:760px;color:#565c66;font-size:14px;line-height:1.6}.module-hero button,.module-card-grid button{height:36px;display:inline-flex;align-items:center;gap:7px;border:1px solid #3370ff;border-radius:9px;background:#3370ff;color:#fff;padding:0 12px}.module-hero-icon{width:56px;height:56px;display:grid;place-items:center;border-radius:14px;background:#3370ff;color:#fff}.module-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:14px 0}.module-stats div{padding:14px;border:1px solid #e1e7f0;border-radius:12px;background:#fff}.module-stats span,.module-card-grid span{display:block;color:#646a73;font-size:12px}.module-stats strong{font-size:24px}.trigger-table{display:grid;overflow:hidden;border:1px solid #dfe6ef;border-radius:14px;background:#fff}.trigger-table header,.trigger-table article{display:grid;grid-template-columns:260px 220px minmax(260px,1fr) 90px 160px;gap:12px;align-items:center;padding:12px 14px}.trigger-table header{background:#f8f9fb;color:#646a73;font-size:12px;font-weight:750}.trigger-table article{border-top:1px solid #edf2f7}.trigger-name{display:flex;align-items:center;gap:10px}.trigger-name>span{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#eef2ff;color:#3370ff}.trigger-name small,.trigger-table p{display:block;margin-top:3px;color:#646a73;font-size:12px;line-height:1.45}.task-link{border:0;background:transparent;color:#3370ff;text-align:left;font-weight:700}.row-actions{display:flex;gap:6px;flex-wrap:wrap}.row-actions button{height:28px;padding:0 9px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e;font-size:12px}.global-timeline{display:grid;gap:9px;margin-top:14px;padding:14px;border:1px solid #e1e7f0;border-radius:14px;background:#fff}.global-timeline>div:not(.card-title){display:grid;grid-template-columns:12px 74px 180px 1fr;gap:10px;align-items:center;color:#646a73;font-size:12px}.global-timeline i{width:8px;height:8px;border-radius:999px;background:#3370ff}.module-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:14px}.module-card-grid article{display:grid;gap:10px;align-content:start;min-height:190px;padding:16px;border:1px solid #dfe6ef;border-radius:14px;background:#fff}.module-card-grid strong{font-size:16px}.module-card-grid p{color:#646a73;font-size:13px;line-height:1.55}@media(max-width:1280px){.app-body{grid-template-columns:78px minmax(0,1fr)}.trigger-table{overflow-x:auto}.trigger-table header,.trigger-table article{min-width:980px}.module-card-grid,.module-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}.hero-actions{display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap}.studio-layout,.admin-shell,.trigger-workbench{display:grid;gap:14px;margin-top:14px;min-height:620px}.studio-layout{grid-template-columns:280px minmax(420px,1fr) 300px}.studio-chat,.flow-canvas,.inspector,.trigger-filter,.trigger-list,.event-console,.builder-panel,.admin-tabs,.user-table,.admin-detail,.role-matrix,.team-map,.agent-access,.policy-card,.risk-rules,.auth-link-card,.approval-simulator,.audit-log{border:1px solid #dfe6ef;border-radius:14px;background:#fff;box-shadow:0 12px 30px #1f23290f}.studio-chat,.inspector,.event-console,.admin-tabs,.admin-detail,.policy-card,.risk-rules,.auth-link-card,.approval-simulator,.audit-log{padding:14px}.studio-chat textarea,.inspector textarea,.inspector input,.builder-field textarea,.admin-detail input,.admin-detail textarea,.admin-detail select{width:100%;min-height:38px;border:1px solid #dee0e3;border-radius:9px;background:#f8f9fb;padding:9px 10px;color:#1f2329;font:inherit}.studio-chat textarea,.inspector textarea,.builder-field textarea,.admin-detail textarea{min-height:92px;resize:vertical}.primary-wide{width:100%;height:38px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid #3370ff;border-radius:9px;background:#3370ff;color:#fff;font-weight:750}.primary-wide.ghost{background:#fff;color:#3370ff}.mini-log{margin:10px 0;padding:10px;border:1px solid #bacefd;border-radius:10px;background:#f0f4ff;color:#1e3a8a;font-size:12px;line-height:1.5}.palette{display:grid;gap:8px}.palette button{display:flex;align-items:center;gap:8px;min-height:38px;border:1px solid #e2e8f0;border-left:4px solid #3370ff;border-radius:9px;background:#fff;color:#41464e;text-align:left}.flow-canvas{display:flex;flex-direction:column;overflow:hidden}.canvas-toolbar{height:48px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid #e6edf5;background:#f8f9fb}.canvas-toolbar strong,.card-title{display:flex;align-items:center;gap:7px}.scratch-flow{flex:1;display:grid;align-content:start;gap:14px;overflow:auto;padding:18px;background:linear-gradient(#eef4fb 1px,transparent 1px),linear-gradient(90deg,#eef4fb 1px,transparent 1px);background-size:26px 26px}.scratch-block{position:relative;display:grid;grid-template-columns:34px 1fr;gap:4px 12px;min-height:88px;padding:14px 14px 14px 0;border:2px solid transparent;border-radius:14px 8px 8px 14px;background:#fff;color:#1f2329;text-align:left;box-shadow:inset 8px 0 0 var(--block-color),0 10px 24px #1f232914}.scratch-block:after{content:"";position:absolute;left:48px;bottom:-12px;width:18px;height:18px;border-radius:0 0 8px 8px;background:var(--block-color)}.scratch-block.selected{border-color:#3370ff;box-shadow:inset 8px 0 0 var(--block-color),0 0 0 4px #e1eaff}.scratch-block span{grid-row:span 3;width:24px;height:24px;display:grid;place-items:center;margin-left:12px;border-radius:999px;background:var(--block-color);color:#fff;font-weight:800}.scratch-block small,.scratch-block em,.trigger-card small,.event-line,.risk-rules small,.auth-link-card p,.approval-simulator p,.admin-detail label{color:#646a73;font-size:12px;line-height:1.5}.scratch-block em{font-style:normal}.inspector{display:grid;gap:10px;align-content:start}.inspector label,.admin-detail label,.builder-field{display:grid;gap:6px;font-size:12px;font-weight:750;color:#565c66}.inspector-actions{display:flex;gap:8px;flex-wrap:wrap}.inspector-actions button,.builder-actions button,.admin-tabs button,.role-matrix button,.team-map button,.row-actions button{min-height:32px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e}.validation-box{display:grid;gap:6px;padding:12px;border-radius:10px;background:#f0fdf4;color:#166534}.validation-box p{display:flex;gap:6px;margin:0;font-size:12px}.trigger-workbench{grid-template-columns:180px minmax(430px,1fr) 330px;align-items:start}.trigger-filter{display:grid;gap:8px;padding:10px}.trigger-filter button,.admin-tabs button{display:flex;align-items:center;gap:8px;justify-content:flex-start;min-height:38px;padding:0 10px}.trigger-filter button.active,.admin-tabs button.active,.option-grid button.active{border-color:#3370ff;background:#f0f4ff;color:#1c4cba;font-weight:800}.trigger-list{display:grid;gap:10px;padding:12px}.trigger-card{display:grid;gap:12px;padding:14px;border:1px solid #e6edf5;border-radius:12px;background:#fff}.trigger-card-head{display:grid;grid-template-columns:38px 1fr auto;gap:10px;align-items:center}.trigger-card-head>span{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:#eef2ff;color:#3370ff}.trigger-rule-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.trigger-rule-grid p{margin:0;padding:10px;border-radius:9px;background:#f8f9fb;color:#565c66;font-size:12px}.trigger-rule-grid b{display:block;margin-bottom:5px;color:#1f2329}.event-console{display:grid;gap:10px}.event-line{display:flex;gap:8px;padding:8px;border-radius:8px;background:#f8f9fb}.event-line i,.audit-log i{width:8px;height:8px;flex:0 0 auto;margin-top:5px;border-radius:999px;background:#3370ff}.payload-card,.test-result{display:grid;gap:8px;padding:12px;border-radius:10px;background:#1f2329;color:#fff}.payload-card code,.auth-link-card code{white-space:pre-wrap;word-break:break-all;font-size:12px}.builder-panel{margin-top:14px;padding:14px}.builder-header,.builder-actions{display:flex;align-items:center;justify-content:space-between;gap:10px}.builder-steps,.option-grid{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.builder-steps button,.option-grid button{min-height:34px;border:1px solid #dee0e3;border-radius:999px;background:#fff;padding:0 12px}.builder-steps button.active{background:#3370ff;color:#fff}.test-result{grid-auto-flow:column;justify-content:start;align-items:center;background:#f0fdf4;color:#166534}.admin-shell{grid-template-columns:180px minmax(420px,1fr) 300px;align-items:start}.admin-tabs,.user-table,.role-matrix,.team-map,.agent-access,.admin-detail{display:grid;gap:10px}.user-table{padding:12px}.user-table button{display:grid;gap:4px;padding:12px;border:1px solid #e2e8f0;border-radius:10px;background:#fff;text-align:left}.user-table button.active{border-color:#3370ff;box-shadow:inset 4px 0 #3370ff}.user-table span,.agent-access article div{display:flex;align-items:center;gap:8px}.user-table em,.risk-rules em{width:fit-content;border-radius:999px;background:#ecfeff;color:#0e7490;padding:2px 8px;font-size:11px;font-style:normal}.role-matrix,.team-map,.agent-access{padding:12px}.role-matrix header,.role-matrix div{display:grid;grid-template-columns:150px repeat(5,minmax(86px,1fr));gap:8px;align-items:center}.role-matrix header{color:#646a73;font-size:12px}.team-map{grid-template-columns:repeat(2,minmax(0,1fr))}.team-map article,.agent-access article{display:grid;gap:8px;padding:12px;border:1px solid #e2e8f0;border-radius:10px;background:#fff}.agent-access article{grid-template-columns:1fr 170px;align-items:center}.agent-access select{height:34px;border:1px solid #dee0e3;border-radius:8px}@media(max-width:1380px){.studio-layout,.trigger-workbench,.admin-shell,.trigger-rule-grid,.team-map{grid-template-columns:1fr}}.trigger-redesign{height:100%;padding:12px;overflow:hidden;color:#172033;background:#f0f2f5}.trigger-redesign button,.trigger-redesign input,.trigger-redesign select,.trigger-redesign textarea{font-size:13px}.tc-header,.tc-management,.tc-log-ledger,.tc-modal>section{border:1px solid #dee0e3;border-radius:10px;background:#fff}.tc-header{min-height:68px;display:grid;grid-template-columns:minmax(250px,1.05fr) auto minmax(360px,1.35fr) auto;align-items:center;gap:12px;padding:10px 12px}.tc-header h2{margin:1px 0 2px;font-size:17px;line-height:1.25}.tc-header p{color:#667389;font-size:12px;line-height:1.35}.tc-header-copy{min-width:0}.tc-header-copy .eyebrow{font-size:11px;line-height:1}.tc-header-actions,.tc-action-row,.tc-log-toolbar,.tc-modal footer{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.tc-header-actions{justify-content:flex-end;flex-wrap:nowrap}.tc-main-tabs{display:flex;gap:4px;margin:0;padding:3px;width:fit-content;border:1px solid #dee0e3;border-radius:9px;background:#fff}.tc-main-tabs button{min-height:34px;display:inline-flex;align-items:center;gap:6px;border:0;border-radius:7px;background:transparent;color:#646a73;padding:0 10px;font-weight:700;white-space:nowrap}.tc-main-tabs button.active{background:#3370ff;color:#fff}.tc-metrics{min-width:0;display:grid;grid-template-columns:repeat(4,minmax(82px,1fr));gap:6px;margin:0}.tc-metrics div{display:grid;grid-template-columns:24px minmax(0,1fr);gap:0 7px;align-items:center;min-height:42px;padding:7px 9px;border:1px solid #dee0e3;border-radius:9px;background:#fbfdff}.tc-metrics svg{grid-row:span 2;width:24px;height:24px;padding:5px;border-radius:8px;background:#f0f4ff;color:#3370ff}.tc-metrics span,.tc-kicker,.tc-panel-head span,.tc-trigger-item small,.tc-detail-row span,.tc-log-toolbar span,.tc-modal header span{color:#667389;font-size:12px}.tc-metrics strong{color:#172033;font-size:16px;line-height:1.1}.tc-management{min-height:0;height:calc(100vh - 174px);display:grid;grid-template-columns:360px minmax(0,1fr) 320px;gap:0;overflow:hidden}.tc-list-panel,.tc-main-panel,.tc-inspector{min-width:0;min-height:0;overflow:hidden}.tc-list-panel,.tc-inspector{display:flex;flex-direction:column;padding:12px;background:#fbfdff}.tc-list-panel{border-right:1px solid #edf1f6}.tc-inspector{border-left:1px solid #edf1f6}.tc-panel-head{min-height:30px;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.tc-panel-head strong{font-size:14px}.tc-search{height:36px;display:flex;align-items:center;gap:8px;padding:0 10px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#646a73}.tc-search input{width:100%;border:0;outline:0;background:transparent;color:#172033}.tc-filter-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}.tc-filter-row select,.tc-log-toolbar select,.tc-builder-grid input,.tc-builder-grid select,.tc-builder-grid textarea{min-height:34px;width:100%;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#172033;padding:0 9px;outline:0}.tc-trigger-list{flex:1;min-height:0;overflow:auto;display:grid;align-content:start;gap:8px;padding-right:2px}.tc-trigger-item{width:100%;display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:9px;align-items:center;min-height:78px;border:1px solid #dfe6ef;border-radius:10px;background:#fff;padding:10px;text-align:left;transition:border-color .16s ease,background .16s ease,box-shadow .16s ease}.tc-trigger-item:hover,.tc-trigger-item.active{border-color:#9bbcf3;background:#f7faff}.tc-trigger-item.active{box-shadow:inset 3px 0 #3370ff}.tc-trigger-item strong{display:block;margin-bottom:4px;color:#172033;font-size:13px;line-height:1.35}.tc-source-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#eef4ff;color:#3370ff}.tc-main-panel{overflow:auto;padding:14px;background:#fff}.tc-selected-card{display:grid;gap:12px}.tc-selected-head{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:11px;align-items:start;padding:14px;border:1px solid #e1eaff;border-radius:10px;background:linear-gradient(135deg,#fff,#f7faff)}.tc-selected-head h3{margin:2px 0 5px;color:#111827;font-size:18px;line-height:1.25}.tc-selected-head p{color:#52637a;font-size:12px}.tc-rule-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tc-rule-grid article{min-height:132px;display:grid;align-content:start;gap:8px;padding:12px;border:1px solid #e1e7f0;border-radius:10px;background:#fff}.tc-rule-grid article svg{color:#3370ff}.tc-rule-grid article span{color:#172033;font-size:13px;font-weight:750}.tc-rule-grid article p,.tc-recent-box p,.tc-detail-row p{margin:0;color:#565c66;font-size:12px;line-height:1.55}.tc-recent-box{display:grid;grid-template-columns:150px minmax(180px,.8fr) minmax(0,1fr);gap:10px;align-items:stretch;padding:12px;border:1px dashed #b8c5d6;border-radius:10px;background:#fbfdff}.tc-recent-box div{display:grid;gap:4px}.tc-recent-box span{color:#646a73;font-size:12px}.tc-recent-box strong{color:#172033;font-size:13px}.tc-action-row{padding-top:2px}.tc-action-row .ghost-action{margin-left:auto}.tc-status,.tc-log-result{width:fit-content;display:inline-flex;align-items:center;justify-content:center;min-height:24px;padding:0 8px;border:1px solid transparent;border-radius:999px;font-size:11px;font-weight:750;white-space:nowrap}.tc-status.compact{min-height:22px}.tc-status.enabled,.tc-status.fired,.tc-log-result.success{border-color:#a7f3d0;background:#ecfdf5;color:#047857}.tc-status.paused,.tc-log-result.waiting{border-color:#fde68a;background:#fffbeb;color:#b45309}.tc-log-result.blocked{border-color:#fecdd3;background:#fff1f2;color:#be123c}.tc-detail-row{display:grid;gap:5px;padding:10px 0;border-bottom:1px solid #edf1f6}.tc-payload{display:grid;gap:8px;margin-top:12px;padding:12px;border-radius:10px;background:#1f2329;color:#fff}.tc-payload strong{font-size:13px}.tc-payload code{white-space:pre-wrap;word-break:break-word;color:#e1eaff;font-size:11px;line-height:1.55}.tc-log-ledger{height:calc(100vh - 174px);overflow:hidden}.tc-log-toolbar{justify-content:space-between;padding:12px 14px;border-bottom:1px solid #edf1f6}.tc-log-toolbar>div{display:grid;gap:3px}.tc-log-toolbar label{display:inline-flex;align-items:center;gap:7px;color:#646a73}.tc-log-table{height:calc(100% - 62px);overflow:auto}.tc-log-table header,.tc-log-table article{display:grid;grid-template-columns:112px minmax(160px,.9fr) minmax(210px,1.15fr) minmax(190px,1fr) minmax(200px,1fr) 74px 58px;gap:10px;align-items:start;padding:10px 14px}.tc-log-table header{position:sticky;top:0;z-index:1;border-bottom:1px solid #edf1f6;background:#f8f9fb;color:#646a73;font-size:12px;font-weight:750}.tc-log-table article{border-bottom:1px solid #edf1f6;background:#fff}.tc-log-table time,.tc-log-table article>span{color:#646a73;font-size:12px}.tc-log-table strong{color:#172033;font-size:13px;line-height:1.35}.tc-log-table p{margin:0;color:#565c66;font-size:12px;line-height:1.5}.tc-log-table p b{display:block;color:#172033}.tc-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:70;display:grid;place-items:center;background:#1f232975}.tc-modal>section{width:min(760px,calc(100vw - 48px));max-height:calc(100vh - 80px);display:grid;gap:14px;padding:16px;overflow:auto;box-shadow:0 24px 60px #1f23293d}.tc-modal header{display:flex;align-items:center;justify-content:space-between;gap:12px}.tc-modal header>div{display:grid;gap:3px}.tc-modal header button{min-height:32px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e;padding:0 10px}.tc-builder-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tc-builder-grid label{display:grid;gap:6px;color:#565c66;font-size:12px;font-weight:750}.tc-builder-grid label.wide{grid-column:1 / -1}.tc-builder-grid textarea{min-height:82px;resize:vertical;padding-top:9px}.tc-modal footer{justify-content:flex-end;border-top:1px solid #edf1f6;padding-top:12px}.tc-toast{position:fixed;right:24px;bottom:24px;z-index:90;border-radius:10px;background:#111827;color:#fff;box-shadow:0 18px 42px #1f232933;padding:11px 14px;font-size:13px}@media(max-width:1380px){.tc-header{grid-template-columns:minmax(220px,1fr) auto}.tc-main-tabs,.tc-metrics{grid-column:1 / -1}.tc-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.tc-management{height:calc(100vh - 196px);grid-template-columns:330px minmax(0,1fr)}.tc-log-ledger{height:calc(100vh - 196px)}.tc-inspector{display:none}.tc-rule-grid,.tc-recent-box{grid-template-columns:1fr}.tc-log-table{overflow:auto}.tc-log-table header,.tc-log-table article{grid-template-columns:110px 180px 250px 230px 250px 74px 58px;min-width:1190px}}.security-grid{display:grid;grid-template-columns:300px minmax(360px,1fr) 330px;gap:14px;margin-top:14px}.policy-card,.risk-rules,.auth-link-card,.approval-simulator,.audit-log{display:grid;gap:10px;align-content:start}.policy-card button,.risk-rules button{display:grid;gap:5px;padding:12px;border:1px solid #e2e8f0;border-radius:10px;background:#fff;text-align:left}.policy-card button.active,.risk-rules button.active{border-color:#3370ff;background:#f0f4ff}.auth-link-card,.approval-simulator{grid-column:3}.audit-log{grid-column:1 / -1}.audit-log p{display:flex;gap:8px;margin:0;padding:8px;border-radius:8px;background:#f8f9fb;color:#565c66;font-size:12px}@media(max-width:1380px){.security-grid{grid-template-columns:1fr}.auth-link-card,.approval-simulator,.audit-log{grid-column:auto}}.governance-page{height:100%;padding:12px;overflow:hidden;color:#172033;background:#f0f2f5}.governance-page button,.governance-page input,.governance-page select,.governance-page textarea{font-size:13px}.gov-header,.gov-layout{border:1px solid #dee0e3;border-radius:10px;background:#fff}.gov-header{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px}.gov-header h2{margin:3px 0 4px;font-size:18px;line-height:1.25}.gov-header p,.gov-kicker,.gov-panel-head span,.gov-member-list small,.gov-info-grid p,.gov-role-matrix small,.gov-group-grid small,.gov-agent-grid small,.sec-rule-list small,.sec-approval-list small,.sec-info-line span,.sec-helper{color:#667389;font-size:12px;line-height:1.45}.gov-header-actions,.gov-detail-actions,.sec-action-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.gov-header-actions{justify-content:flex-end}.gov-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:10px 0}.gov-metrics div{min-height:58px;display:grid;grid-template-columns:34px minmax(0,1fr);gap:2px 10px;align-items:center;padding:10px 12px;border:1px solid #dee0e3;border-radius:10px;background:#fff}.gov-metrics svg{grid-row:span 2;width:30px;height:30px;padding:7px;border-radius:8px;background:#f0f4ff;color:#3370ff}.gov-metrics span{color:#667389;font-size:12px}.gov-metrics strong{font-size:17px}.gov-tabs{display:inline-flex;gap:4px;margin-bottom:10px;padding:4px;border:1px solid #dee0e3;border-radius:10px;background:#fff}.gov-tabs button{min-height:32px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:8px;background:transparent;color:#565c66;padding:0 12px;font-weight:700}.gov-tabs button.active{background:#3370ff;color:#fff}.gov-layout{min-height:0;height:calc(100% - 176px);display:grid;grid-template-columns:306px minmax(0,1fr) 330px;overflow:hidden}.gov-list-panel,.gov-main-panel,.gov-detail-panel{min-width:0;min-height:0}.gov-list-panel,.gov-detail-panel{display:flex;flex-direction:column;gap:10px;padding:12px;overflow:hidden}.gov-list-panel{border-right:1px solid #e8eaed}.gov-detail-panel{border-left:1px solid #e8eaed}.gov-main-panel{padding:14px;overflow:auto;background:#fbfdff}.gov-panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.gov-panel-head strong{color:#1f2329}.gov-search{height:36px;display:flex;align-items:center;gap:8px;padding:0 10px;border:1px solid #dee0e3;border-radius:9px;background:#f8f9fb;color:#646a73}.gov-search input{width:100%;border:0;outline:0;background:transparent;color:#172033}.gov-member-list,.sec-rule-list,.sec-approval-list,.sec-audit-list{min-height:0;overflow:auto}.gov-member-list{display:grid;gap:8px}.gov-member-list button,.sec-rule-list button,.sec-approval-list button{width:100%;display:grid;gap:5px;padding:11px;border:1px solid #e1e7f0;border-radius:10px;background:#fff;color:#172033;text-align:left}.gov-member-list button:hover,.gov-member-list button.active,.sec-rule-list button:hover,.sec-rule-list button.active,.sec-approval-list button:hover,.sec-approval-list button.active{border-color:#98b8ef;background:#f6f9ff;box-shadow:inset 3px 0 #3370ff}.gov-member-list span,.gov-selected-head,.gov-agent-grid article,.sec-resource-grid article,.sec-mode-card button{display:flex;align-items:center;gap:9px}.gov-member-list em,.sec-rule-list strong,.sec-approval-list em{width:fit-content;border-radius:999px;padding:2px 8px;font-size:11px;font-style:normal;font-weight:800}.gov-member-list em.success,.sec-approval-list em.success{background:#ecfdf5;color:#047857}.gov-member-list em.warning,.sec-approval-list em.warning,.sec-rule-list strong.warning{background:#fffbeb;color:#b45309}.gov-member-list em.muted{background:#f1f5f9;color:#646a73}.sec-rule-list strong.danger,.sec-approval-list em.danger{background:#fff1f2;color:#be123c}.gov-selected-head{padding:12px;border:1px solid #e1eaff;border-radius:10px;background:#fff}.gov-avatar{width:42px;height:42px;display:grid;place-items:center;border-radius:10px;background:#3370ff;color:#fff;font-size:18px;font-weight:800}.gov-selected-head h3{margin:3px 0 4px;font-size:18px}.gov-selected-head p{margin:0;color:#565c66;font-size:13px}.gov-info-grid,.gov-group-grid,.gov-agent-grid,.sec-resource-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px}.gov-info-grid article,.gov-group-grid article,.gov-agent-grid article,.sec-resource-grid article,.sec-mode-card,.sec-rule-detail,.sec-approval-detail,.sec-policy-summary{border:1px solid #e1e7f0;border-radius:10px;background:#fff}.gov-info-grid article{display:grid;grid-template-columns:28px minmax(0,1fr);gap:4px 9px;padding:12px}.gov-info-grid article svg{grid-row:span 2;color:#3370ff}.gov-info-grid span,.gov-group-grid strong,.gov-agent-grid strong,.sec-resource-grid strong,.sec-mode-card strong,.sec-rule-detail strong,.sec-approval-detail strong{color:#1f2329;font-weight:800}.gov-info-grid p,.gov-group-grid p,.gov-agent-grid p,.sec-resource-grid p{margin:0}.gov-role-matrix{min-width:900px;display:grid;gap:8px}.gov-role-matrix header,.gov-role-matrix article{display:grid;grid-template-columns:190px repeat(5,minmax(92px,1fr));gap:8px;align-items:center}.gov-role-matrix header{color:#667389;font-size:12px}.gov-role-matrix article{padding:10px;border:1px solid #e1e7f0;border-radius:10px;background:#fff}.gov-role-matrix button{min-height:30px;border:1px solid transparent;border-radius:999px;font-weight:800}.gov-role-matrix button.allow{background:#ecfdf5;color:#047857}.gov-role-matrix button.review{background:#fffbeb;color:#b45309}.gov-role-matrix button.readonly{background:#f1f5f9;color:#646a73}.gov-group-grid article,.gov-agent-grid article,.sec-resource-grid article{padding:12px}.gov-group-grid article{display:grid;gap:8px}.gov-group-grid article>div{display:flex;align-items:center;justify-content:space-between;gap:8px}.gov-group-grid button,.gov-agent-grid button,.sec-resource-grid button{width:fit-content;min-height:30px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e;padding:0 10px}.gov-agent-grid article,.sec-resource-grid article{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:start}.gov-agent-grid article>span,.sec-resource-grid article>span{width:32px;height:32px;display:grid;place-items:center;border-radius:8px;background:#f0f4ff;color:#3370ff}.gov-detail-panel label{display:grid;gap:5px;color:#667389;font-size:12px}.gov-detail-panel input,.gov-detail-panel textarea,.gov-detail-panel select{width:100%;min-height:36px;border:1px solid #dee0e3;border-radius:8px;background:#f8f9fb;color:#172033;padding:8px 10px}.gov-detail-panel textarea{min-height:76px;resize:vertical}.gov-detail-actions button,.sec-action-row button{min-height:34px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e;padding:0 10px}.gov-mini-log{margin-top:auto;padding:10px;border:1px solid #bacefd;border-radius:10px;background:#f0f4ff;color:#1e3a8a;font-size:12px;line-height:1.5}.security-layout{grid-template-columns:300px minmax(0,1fr) 330px}.sec-rule-list{display:grid;gap:8px}.sec-policy-view,.sec-approval-view{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:10px}.sec-mode-card,.sec-rule-detail,.sec-approval-detail,.sec-policy-summary{display:grid;gap:10px;padding:12px;align-content:start}.sec-mode-card button{width:100%;align-items:flex-start;padding:12px;border:1px solid #e1e7f0;border-radius:10px;background:#fff;text-align:left}.sec-mode-card button.active{border-color:#98b8ef;background:#f6f9ff;box-shadow:inset 3px 0 #3370ff}.sec-mode-card button svg{color:#3370ff}.sec-mode-card p,.sec-rule-detail p,.sec-approval-detail p,.sec-policy-summary p{margin:0;color:#565c66;font-size:13px;line-height:1.5}.sec-info-line{display:grid;grid-template-columns:84px minmax(0,1fr);gap:10px;padding:9px 0;border-bottom:1px solid #edf1f6}.sec-approval-list{display:grid;max-height:560px;gap:8px}.sec-resource-grid{margin:0}.sec-resource-grid em{display:inline-flex;width:fit-content;margin-top:8px;border-radius:999px;background:#f0f4ff;color:#3370ff;padding:2px 8px;font-size:11px;font-style:normal;font-weight:800}.sec-audit-list{display:grid;gap:8px;max-height:100%}.sec-audit-list p{display:flex;gap:8px;margin:0;padding:10px;border:1px solid #e1e7f0;border-radius:9px;background:#fff;color:#565c66;font-size:13px}.sec-audit-list i{width:8px;height:8px;flex:0 0 auto;margin-top:6px;border-radius:999px;background:#3370ff}.sec-helper{margin:0}.sec-auth-code{display:block;white-space:pre-wrap;overflow-wrap:anywhere;padding:10px;border-radius:9px;background:#1f2329;color:#e1eaff;font-size:12px;line-height:1.45}.sec-policy-summary{margin-top:4px}@media(max-width:1380px){.gov-layout,.security-layout{grid-template-columns:260px minmax(0,1fr)}.gov-detail-panel{display:none}}@media(max-width:1180px){.governance-page{overflow:auto}.gov-header,.gov-layout,.sec-policy-view,.sec-approval-view{grid-template-columns:1fr}.gov-header{display:grid}.gov-layout,.security-layout{height:auto;grid-template-columns:1fr}.gov-list-panel,.gov-detail-panel{border:0}.gov-detail-panel{display:flex}.gov-metrics,.gov-info-grid,.gov-group-grid,.gov-agent-grid,.sec-resource-grid{grid-template-columns:1fr}}.user-ledger-page{height:100%;display:flex;flex-direction:column;gap:10px;padding:12px;overflow:hidden;background:#f0f2f5;color:#172033}.user-ledger-page button,.user-ledger-page input,.user-ledger-page select,.user-ledger-page textarea{font-size:13px}.user-ledger-header,.user-ledger-toolbar,.user-ledger-table-card,.user-ledger-lower article{border:1px solid #dee0e3;border-radius:10px;background:#fff}.user-ledger-header{min-height:82px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px}.user-ledger-header h2{margin:3px 0 4px;font-size:18px;line-height:1.25}.user-ledger-header p,.user-ledger-toolbar span,.user-ledger-table-head span,.user-ledger-table small,.user-ledger-table p,.user-ledger-lower header span,.user-ledger-audit p{color:#667389;font-size:12px;line-height:1.45}.user-ledger-actions,.user-ledger-table-head,.user-ledger-lower header{display:flex;align-items:center;justify-content:space-between;gap:12px}.user-ledger-actions{flex-wrap:wrap;justify-content:flex-end}.user-ledger-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.user-ledger-summary div{min-height:58px;display:grid;grid-template-columns:34px minmax(0,1fr);gap:2px 10px;align-items:center;padding:10px 12px;border:1px solid #dee0e3;border-radius:10px;background:#fff}.user-ledger-summary svg{grid-row:span 2;width:30px;height:30px;padding:7px;border-radius:8px;background:#f0f4ff;color:#3370ff}.user-ledger-summary span{color:#667389;font-size:12px}.user-ledger-summary strong{font-size:17px}.user-ledger-toolbar{min-height:50px;display:grid;grid-template-columns:minmax(320px,1fr) 150px 150px auto;gap:10px;align-items:center;padding:8px 10px}.user-ledger-search{min-width:0;display:flex;align-items:center;gap:8px;height:34px;padding:0 10px;border:1px solid #dee0e3;border-radius:8px;background:#f8f9fb;color:#667389}.user-ledger-search input,.user-ledger-toolbar select,.user-ledger-table input,.user-ledger-table select,.user-ledger-table textarea{min-width:0;width:100%;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#172033;outline:none}.user-ledger-search input{height:100%;border:0;background:transparent}.user-ledger-toolbar select{height:34px;padding:0 8px}.user-ledger-toolbar>span{white-space:nowrap;text-align:right}.user-ledger-table-card{min-height:0;flex:1 1 auto;display:flex;flex-direction:column;overflow:hidden}.user-ledger-table-head{min-height:46px;padding:0 14px;border-bottom:1px solid #e6ebf2}.user-ledger-table-head strong{display:inline-flex;align-items:center;gap:8px}.user-ledger-table-scroll{min-height:0;overflow:auto}.user-ledger-table{width:100%;min-width:1480px;border-collapse:collapse}.user-ledger-table th,.user-ledger-table td{padding:10px;border-bottom:1px solid #e8edf4;vertical-align:top;text-align:left}.user-ledger-table th{position:sticky;top:0;z-index:1;background:#f8f9fb;color:#565c66;font-size:12px;font-weight:800}.user-ledger-table td{font-size:13px}.user-ledger-table td:first-child{width:150px}.user-ledger-table td:nth-child(2),.user-ledger-table td:nth-child(4),.user-ledger-table td:nth-child(8),.user-ledger-table td:nth-child(9){width:150px}.user-ledger-table td:nth-child(3){width:150px}.user-ledger-table td:nth-child(5){width:190px}.user-ledger-table td:nth-child(6),.user-ledger-table td:nth-child(7),.user-ledger-table td:nth-child(10){width:210px}.user-ledger-table td:last-child{width:124px}.user-ledger-table td>strong,.user-ledger-table td>span,.user-ledger-table td>small,.user-ledger-table td>p{display:block}.user-ledger-table td>strong{margin-bottom:4px}.user-ledger-table td>span{color:#565c66;font-size:12px}.user-ledger-table input,.user-ledger-table select{height:32px;padding:0 8px}.user-ledger-table textarea{min-height:54px;resize:vertical;padding:7px 8px}.user-ledger-table td:nth-child(3) input+input,.user-ledger-table td:nth-child(7) small,.user-ledger-table td:nth-child(9) small,.user-ledger-table td:nth-child(10) small{margin-top:6px}.user-ledger-table td:last-child{display:grid;gap:6px}.user-ledger-table td:last-child button{min-height:30px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#3370ff;font-weight:800}.user-ledger-table td:last-child button.is-stop{color:#b42318}.user-ledger-table td:last-child button.is-enable{color:#087443}.user-ledger-table tr.is-disabled{background:#f8f9fb}.user-ledger-table tr.is-disabled td:first-child strong,.user-ledger-table tr.is-disabled td:first-child span,.user-ledger-table tr.is-disabled td:first-child small{color:#8f959e}.user-ledger-lower{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:10px;min-height:190px;max-height:240px}.user-ledger-lower article{min-width:0;overflow:hidden}.user-ledger-lower header{min-height:42px;padding:0 12px;border-bottom:1px solid #e6ebf2}.user-ledger-matrix table{width:100%;border-collapse:collapse}.user-ledger-matrix th,.user-ledger-matrix td{padding:8px 12px;border-bottom:1px solid #edf1f6;text-align:left;font-size:12px}.user-ledger-matrix th{background:#f8f9fb;color:#565c66}.user-ledger-audit{display:flex;flex-direction:column}.user-ledger-audit p{margin:0;padding:9px 12px;border-bottom:1px solid #edf1f6}@media(max-width:1180px){.user-ledger-page{overflow:auto}.user-ledger-header,.user-ledger-toolbar,.user-ledger-lower{grid-template-columns:1fr}.user-ledger-header{display:grid}.user-ledger-summary{grid-template-columns:1fr 1fr}.user-ledger-table-card{min-height:560px}.user-ledger-lower{max-height:none}}.user-ledger-redesign{--ledger-border: #d9e1ec;--ledger-muted: #646a73;--ledger-text: #172033;--ledger-soft: #f7f9fc;--ledger-blue: #3370ff;--ledger-blue-soft: #eaf0ff;gap:8px;background:#f0f2f5}.user-ledger-redesign .user-ledger-header{min-height:70px;border-radius:9px;padding:12px 14px}.user-ledger-redesign .user-ledger-header h2{margin:2px 0 3px;font-size:19px}.user-ledger-redesign .user-ledger-header p{max-width:860px;margin:0}.user-ledger-redesign .user-ledger-summary{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.user-ledger-redesign .user-ledger-summary div{min-height:50px;border-radius:9px;padding:8px 10px;grid-template-columns:30px minmax(0,1fr);background:#fff}.user-ledger-redesign .user-ledger-summary svg{width:28px;height:28px;padding:7px;border-radius:7px;background:var(--ledger-blue-soft)}.user-ledger-redesign .user-ledger-toolbar{min-height:46px;border-radius:9px;grid-template-columns:minmax(320px,1fr) 140px 140px 62px;padding:6px 8px}.user-ledger-redesign .user-ledger-search,.user-ledger-redesign .user-ledger-toolbar select{height:34px;border-radius:7px}.user-ledger-workspace{min-height:0;flex:1 1 auto;display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:10px;overflow:hidden}.user-ledger-main,.user-ledger-detail{min-width:0;min-height:0;border:1px solid var(--ledger-border);border-radius:9px;background:#fff;overflow:hidden}.user-ledger-redesign .user-ledger-table-head{min-height:42px;padding:0 12px}.user-ledger-redesign .user-ledger-table-head span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-ledger-redesign .user-ledger-table-scroll{height:calc(100% - 42px);overflow-y:auto;overflow-x:hidden}.user-ledger-redesign .user-ledger-table{min-width:0;table-layout:fixed}.user-ledger-redesign .user-ledger-table th,.user-ledger-redesign .user-ledger-table td{padding:10px;border-bottom:1px solid #edf1f6}.user-ledger-redesign .user-ledger-table th{height:38px;color:#526076;background:#f9fbfd}.user-ledger-redesign .user-ledger-table td{height:72px;color:var(--ledger-text)}.user-ledger-redesign .user-ledger-table tr{cursor:pointer}.user-ledger-redesign .user-ledger-table tbody tr:hover{background:#f8fbff}.user-ledger-redesign .user-ledger-table tr.is-selected{background:#f0f4ff;box-shadow:inset 3px 0 0 var(--ledger-blue)}.user-ledger-redesign .user-ledger-table th:first-child,.user-ledger-redesign .user-ledger-table td:first-child{width:130px}.user-ledger-redesign .user-ledger-table th:nth-child(2),.user-ledger-redesign .user-ledger-table td:nth-child(2){width:88px}.user-ledger-redesign .user-ledger-table th:nth-child(3),.user-ledger-redesign .user-ledger-table td:nth-child(3){width:130px}.user-ledger-redesign .user-ledger-table th:nth-child(4),.user-ledger-redesign .user-ledger-table td:nth-child(4){width:126px}.user-ledger-redesign .user-ledger-table th:nth-child(5),.user-ledger-redesign .user-ledger-table td:nth-child(5){width:auto}.user-ledger-redesign .user-ledger-table th:nth-child(6),.user-ledger-redesign .user-ledger-table td:nth-child(6){width:80px}.user-ledger-redesign .user-ledger-table th:last-child,.user-ledger-redesign .user-ledger-table td:last-child{width:108px;display:table-cell}.user-ledger-redesign .user-ledger-table td>strong{margin-bottom:3px;color:#111827;font-size:13px}.user-ledger-redesign .user-ledger-table td>span,.user-ledger-redesign .user-ledger-table td>small,.user-ledger-redesign .user-ledger-table td>p{margin:0;color:var(--ledger-muted);font-size:12px}.user-ledger-redesign .user-ledger-table td>p{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}.user-ledger-redesign .user-ledger-table td:last-child button{min-height:28px;padding:0 8px;border-radius:7px}.user-ledger-redesign .user-ledger-table td:last-child button+button{margin-top:6px}.ledger-badge,.ledger-status{display:inline-flex;align-items:center;width:fit-content;max-width:100%;min-height:24px;padding:0 8px;border:1px solid transparent;border-radius:999px;font-size:12px;font-weight:800;line-height:1;white-space:nowrap}.ledger-badge.neutral{border-color:#dee0e3;background:#f8f9fb;color:#41464e}.ledger-badge.admin{border-color:#bacefd;background:#f0f4ff;color:#245bdb}.ledger-badge.owner{border-color:#bbf7d0;background:#f0fdf4;color:#047857}.ledger-badge.warning{border-color:#fde68a;background:#fffbeb;color:#92400e}.ledger-badge.muted{border-color:#e2e8f0;background:#f8f9fb;color:#646a73}.ledger-status.enabled{border-color:#bbf7d0;background:#ecfdf5;color:#047857}.ledger-status.pending{border-color:#fde68a;background:#fffbeb;color:#a16207}.ledger-status.disabled{border-color:#e2e8f0;background:#f1f5f9;color:#646a73}.user-ledger-detail{display:flex;flex-direction:column;overflow:auto}.user-ledger-detail>header{padding:14px 14px 12px;border-bottom:1px solid #e6ebf2;background:#fbfdff}.user-ledger-detail>header span{color:var(--ledger-blue);font-size:12px;font-weight:800}.user-ledger-detail>header h3{margin:3px 0;color:#111827;font-size:20px}.user-ledger-detail>header p{margin:0;color:var(--ledger-muted);font-size:13px}.detail-status-row{display:flex;gap:8px;flex-wrap:wrap;padding:12px 14px 0}.detail-field-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px 14px 0}.user-ledger-detail label{display:grid;gap:5px;color:#565c66;font-size:12px;font-weight:800}.user-ledger-detail input,.user-ledger-detail select,.user-ledger-detail textarea{width:100%;min-width:0;border:1px solid var(--ledger-border);border-radius:7px;background:#fff;color:var(--ledger-text);outline:none}.user-ledger-detail input,.user-ledger-detail select{height:34px;padding:0 8px}.user-ledger-detail textarea{min-height:58px;resize:vertical;padding:8px;line-height:1.45}.detail-wide-field,.detail-module-list,.detail-actions{margin:10px 14px 0}.detail-module-list{display:grid;gap:7px;padding:10px;border:1px solid #e6ebf2;border-radius:8px;background:#f8f9fb}.detail-module-list strong{color:#41464e;font-size:12px}.detail-module-list div{display:flex;flex-wrap:wrap;gap:6px}.detail-module-list span{display:inline-flex;min-height:24px;align-items:center;border-radius:999px;background:#fff;color:#565c66;padding:0 8px;font-size:12px}.detail-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-bottom:14px}.detail-actions button{min-height:36px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--ledger-border);border-radius:8px;background:#fff;color:#3370ff;font-weight:800}.user-ledger-redesign .user-ledger-lower{min-height:160px;max-height:180px;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}.user-ledger-redesign .user-ledger-lower article{border-radius:9px}.user-ledger-redesign .user-ledger-lower header{min-height:38px}.user-ledger-redesign .user-ledger-matrix th,.user-ledger-redesign .user-ledger-matrix td{padding:7px 12px}@media(max-width:1040px){.user-ledger-workspace{grid-template-columns:1fr;overflow:visible}.user-ledger-detail{max-height:none}.user-ledger-redesign{overflow:auto}}@media(max-width:860px){.user-ledger-redesign .user-ledger-summary,.detail-field-grid,.detail-actions,.user-ledger-redesign .user-ledger-toolbar{grid-template-columns:1fr}}.task-sidebar .sidebar-head{min-height:48px;padding:8px 10px 7px 12px}.task-sidebar .sidebar-head h2{margin:0;font-size:15px;line-height:1.1}.task-sidebar .sidebar-head div>span{display:block;margin-top:2px;color:#646a73;font-size:11px}.task-sidebar .sidebar-tools{gap:5px}.task-sidebar .icon-button,.task-sidebar .primary-square{width:30px;height:30px}.status-filter-row{display:flex;gap:5px;overflow-x:auto;min-height:40px;padding:6px 9px;border-bottom:1px solid #edf1f6;background:#fbfdff;scrollbar-width:none}.status-filter-row button{flex:0 0 auto;height:28px;display:inline-flex;align-items:center;gap:5px;border:1px solid #dee0e3;border-radius:999px;background:#fff;color:#565c66;padding:0 8px;font-size:11px;font-weight:700}.status-filter-row button.active{border-color:#3370ff;background:#eaf0ff;color:#1c4cba;box-shadow:inset 0 0 0 1px #bacefd}.status-filter-row strong{min-width:18px;height:18px;display:inline-grid;place-items:center;border-radius:999px;background:#f1f5f9;color:#1f2329;font-size:10px}.status-filter-row button.active strong{background:#3370ff;color:#fff}.task-sidebar .filter-panel.compact{padding:5px 9px}.task-sidebar .filter-title{margin-bottom:0;font-size:11px}.task-sidebar .filter-toggle span{max-width:150px}.task-sidebar .filter-panel.compact .filter-chips{display:none}.task-sidebar .filter-panel.open{padding:8px 10px}.task-sidebar .filter-row{margin:5px 0}.task-sidebar .filter-row select{height:28px}.task-sidebar .sort-button{height:28px;margin-top:6px}.task-sidebar .task-list{padding:8px}.task-sidebar .task-card{padding:7px 9px 7px 14px;margin-bottom:6px;border-radius:9px}.task-sidebar .task-card:before{top:8px;bottom:8px;width:4px}.task-sidebar .task-card.selected:before{width:8px}.task-sidebar .task-card.selected{box-shadow:inset 8px 0 0 var(--task-color, #3370ff),0 10px 24px #1f232924;transform:translate(2px)}.task-sidebar .task-card-top{margin-bottom:4px}.task-sidebar .task-card .pill{height:20px;padding:0 6px;font-size:10px}.task-sidebar .task-card h3{display:-webkit-box;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:2px;font-size:13px;line-height:1.25}.task-sidebar .task-card p{overflow:hidden;margin:0;color:#646a73;font-size:11px;white-space:nowrap;text-overflow:ellipsis}.task-sidebar .task-meta,.task-sidebar .task-bottom,.task-sidebar .task-state-row{margin-top:5px;gap:6px;font-size:11px}.task-sidebar .task-state-row{display:none}.task-sidebar .task-meta span,.task-sidebar .task-state-row span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.task-sidebar .progress-line{height:4px;margin-top:6px}.empty-task-state{padding:16px 10px;border:1px dashed #dee0e3;border-radius:10px;color:#646a73;background:#f8f9fb;font-size:12px;line-height:1.5}.execution-panel .task-hero{gap:14px;padding:10px 12px;margin-top:10px;border-top-width:3px;border-radius:9px;background:#fff}.execution-panel .hero-kicker{gap:6px;margin-bottom:4px;font-size:11px}.execution-panel .hero-kicker .pill{height:20px;padding:0 6px;font-size:10px}.execution-panel .hero-main h2{overflow:hidden;margin-bottom:3px;color:#1f2329;font-size:17px;line-height:1.25;white-space:nowrap;text-overflow:ellipsis}.execution-panel .hero-main p{overflow:hidden;max-width:620px;color:#646a73;font-size:12px;line-height:1.35;white-space:nowrap;text-overflow:ellipsis}.execution-panel .hero-actions{display:grid;grid-template-columns:repeat(2,minmax(126px,auto));gap:6px;align-items:end;align-self:flex-start}.execution-panel .primary-action,.execution-panel .secondary-action{height:30px;padding:0 9px;border-radius:8px;font-size:12px}.execution-panel .control-field{gap:0;font-size:10px}.execution-panel .control-field span{width:1px;height:1px;overflow:hidden;position:absolute;clip:rect(0 0 0 0)}.execution-panel .control-field select{height:30px;min-width:136px;border-radius:8px;font-size:12px}.execution-panel .metric-row{gap:8px;margin:8px 16px}.execution-panel .metric-card{grid-template-columns:28px 1fr;gap:1px 8px;padding:8px 10px;border-radius:9px}.execution-panel .metric-card div{width:28px;height:28px;border-radius:7px}.execution-panel .metric-card span{font-size:11px}.execution-panel .metric-card strong{overflow:hidden;font-size:12px;white-space:nowrap;text-overflow:ellipsis}.execution-panel .center-tabs{padding:0 16px}.execution-panel .center-tabs button{height:32px;font-size:12px}.execution-panel .center-scroll{padding-top:10px}.execution-panel .node-step{position:relative;gap:8px;padding:10px;margin-bottom:8px;border-color:#e5e7eb;border-radius:9px;background:#fff}.execution-panel .node-step.active{border-color:#99f6e4;background:linear-gradient(135deg,#ecfdf5,#fff 78%);box-shadow:inset 0 0 0 1px #ccfbf1,0 8px 18px #0d948814}.execution-panel .node-step.active:before{content:"";position:absolute;left:12px;top:8px;width:7px;height:7px;border-radius:999px;background:#0d9488}.execution-panel .node-step.active .node-index{background:#ccfbf1;color:#0f766e}.execution-panel .node-step.active .node-title-row h3{color:#1f2329}.execution-panel .node-index{width:28px;height:28px;border-radius:7px;font-size:12px}.execution-panel .node-title-row h3{font-size:13px;line-height:1.25}.execution-panel .node-status-wrap{display:flex;align-items:center;gap:5px;flex:0 0 auto}.execution-panel .node-complete-mark{width:18px;height:18px;display:inline-grid;place-items:center;border-radius:999px;background:#dcfce7;color:#16a34a;border:1px solid #bbf7d0}.execution-panel .node-copy p{margin-top:4px;color:#646a73;font-size:11px}.execution-panel .node-copy .mini-progress{height:4px;margin-top:7px}.execution-panel .work-surface{grid-template-columns:180px minmax(0,1fr)}.sop-node-detail{display:grid;gap:10px}.compact-node-toolbar{margin-bottom:0}.node-toolbar-actions{display:flex;align-items:center;gap:8px}.node-block-alert{display:grid;grid-template-columns:24px 1fr auto;gap:10px;align-items:start;padding:10px 12px;border:1px solid #fed7aa;border-radius:10px;background:#fff7ed;color:#9a3412}.node-block-alert p{margin-top:3px;color:#b45309;font-size:12px}.sop-section{overflow:hidden;border:1px solid #dfe6ef;border-radius:10px;background:#fff}.sop-section-head{width:100%;height:38px;display:flex;align-items:center;justify-content:space-between;border:0;background:#f8f9fb;color:#1f2329;padding:0 12px;font-weight:800}.sop-section-head span,.step-console-head,.process-step-head,.node-status-wrap{display:flex;align-items:center;gap:7px}.sop-section-body{display:grid;gap:10px;padding:12px}.node-input-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.node-input-grid article{display:grid;grid-template-columns:24px 1fr;gap:8px;padding:9px;border:1px solid #e6edf5;border-radius:9px;background:#fbfdff}.node-input-grid article>span,.objective-list span,.process-step-head>span{width:22px;height:22px;display:inline-grid;place-items:center;border-radius:999px;background:#e0f2fe;color:#0369a1;font-size:11px;font-weight:800}.node-input-grid strong,.node-output-panel strong{font-size:12px}.node-input-grid p,.objective-list p,.process-step p,.node-output-panel p,.validation-panel p,.rule-suggestion-list p{color:#565c66;font-size:12px;line-height:1.5}.objective-list{display:grid;gap:6px}.objective-list p{display:flex;gap:8px;margin:0}.step-console{display:grid;gap:8px}.step-console-head{justify-content:space-between}.step-console-head button,.process-step button,.node-output-panel button,.rule-suggestion-list button,.node-toolbar-actions button{min-height:30px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e;padding:0 10px;font-size:12px}.process-step{display:grid;gap:8px;padding:10px;border:1px solid #e6edf5;border-radius:10px;background:#fff}.process-step.active{border-color:#bacefd;background:#f0f4ff}.process-step.failed{border-color:#fecdd3;background:#fff1f2}.process-step.waiting{border-color:#fde68a;background:#fffbeb}.process-step-head{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:start}.process-step-head strong{font-size:13px}.step-badge{border-radius:999px;padding:3px 8px;font-size:11px;font-style:normal;background:#f1f5f9;color:#565c66}.step-badge.done{background:#dcfce7;color:#15803d}.step-badge.running{background:#e1eaff;color:#245bdb}.step-badge.waiting{background:#fef3c7;color:#b45309}.step-badge.failed{background:#ffe4e6;color:#be123c}.human-input-box,.yesno-box,.content-review-box,.file-review-box,.step-error-box{display:flex;gap:8px;flex-wrap:wrap;align-items:end;padding:9px;border-radius:9px;background:#ffffffb8}.human-input-box label{display:grid;gap:5px;color:#646a73;font-size:11px}.human-input-box input{height:30px;min-width:220px;border:1px solid #dee0e3;border-radius:8px;padding:0 9px}.yesno-box button:first-child,.file-review-box button:nth-child(2){border-color:#86efac;background:#dcfce7;color:#166534}.yesno-box button:nth-child(2),.step-error-box button{border-color:#fecdd3;background:#fff1f2;color:#be123c}.content-review-box{align-items:center;justify-content:space-between}.content-review-box p{flex:1 1 360px;margin:0}.node-output-panel{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(180px,.8fr) minmax(180px,.8fr);gap:10px}.node-output-panel article{display:grid;gap:8px;align-content:start;padding:10px;border:1px solid #e6edf5;border-radius:9px;background:#fbfdff}.validation-panel{display:grid;grid-template-columns:minmax(140px,.7fr) minmax(220px,1.2fr) 120px auto;gap:10px;align-items:center}.validation-panel span{display:block;color:#646a73;font-size:11px}.validation-score{text-align:center}.validation-score strong{color:#047857;font-size:24px}.rule-suggestion-list{display:grid;gap:8px}.rule-suggestion-list article{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:10px;border:1px solid #e6edf5;border-radius:9px;background:#fbfdff}.rule-suggestion-list em{display:inline-block;margin-top:6px;border-radius:999px;background:#ecfdf5;color:#047857;padding:3px 8px;font-size:11px;font-style:normal}.preview-popover{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:grid;place-items:center;background:#1f232952}.preview-popover>div{width:min(760px,calc(100vw - 64px));max-height:min(680px,calc(100vh - 64px));display:grid;grid-template-rows:auto minmax(0,1fr);border-radius:12px;background:#fff;box-shadow:0 24px 80px #1f23293d}.preview-popover header{display:flex;justify-content:space-between;padding:12px 14px;border-bottom:1px solid #e6edf5}.preview-popover pre{overflow:auto;margin:0;padding:16px;white-space:pre-wrap;color:#1f2329;font-size:13px;line-height:1.6}@media(max-width:1320px){.node-output-panel,.validation-panel,.rule-suggestion-list article{grid-template-columns:1fr}.node-input-grid{grid-template-columns:1fr}}@media(max-width:1280px){.execution-panel .work-surface{grid-template-columns:180px minmax(0,1fr)}}.execution-panel{padding:8px 10px}.execution-panel .task-hero,.execution-panel .metric-row{margin-left:8px;margin-right:8px}.execution-panel .task-hero{margin-top:8px}.execution-panel .hero-kicker{flex-wrap:wrap}.execution-panel .hero-kicker em{display:inline-flex;align-items:center;height:20px;border-radius:999px;background:#f0f4ff;color:#245bdb;padding:0 7px;font-size:10px;font-style:normal;font-weight:750}.execution-panel .hero-actions{grid-template-columns:132px minmax(150px,1fr) minmax(132px,.85fr)}.execution-panel .hero-actions .primary-action,.execution-panel .hero-actions .secondary-action{grid-row:1}.execution-panel .pause-action{border-color:#bacefd;background:#f0f4ff;color:#245bdb}.execution-panel .icon-field{position:relative;grid-template-columns:28px minmax(0,1fr);align-items:center;gap:0}.execution-panel .icon-field>svg{z-index:1;width:28px;height:30px;padding:7px;border:1px solid #dee0e3;border-right:0;border-radius:8px 0 0 8px;background:#f8f9fb;color:#3370ff}.execution-panel .icon-field select{min-width:0;border-radius:0 8px 8px 0}.execution-panel .icon-field select:disabled{background:#f1f5f9;color:#646a73;cursor:not-allowed}.execution-panel .center-tabs{padding:0 8px}.execution-panel .center-scroll{padding:8px 8px 10px}.execution-panel .work-surface{grid-template-columns:220px minmax(0,1fr);gap:14px}.execution-panel .node-rail{position:relative;padding-left:10px}.execution-panel .node-rail:before{content:"";position:absolute;left:23px;top:18px;bottom:18px;width:1px;background:#e1eaff}.execution-panel .node-step{position:relative;grid-template-columns:28px minmax(0,1fr);padding:9px;margin-bottom:10px;border-radius:10px}.execution-panel .node-clock{display:none}.execution-panel .node-title-row{display:grid;grid-template-columns:1fr;gap:6px;align-items:start}.execution-panel .node-title-row h3{display:-webkit-box;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:13px;line-height:1.28}.execution-panel .node-status-wrap{justify-content:flex-start}.execution-panel .node-status-wrap .pill{height:20px;padding:0 7px;font-size:10px}.execution-panel .node-copy .node-meta-line{display:grid;grid-template-columns:14px minmax(0,1fr);gap:4px 5px;align-items:center;margin-top:4px;color:#646a73;font-size:11px}.execution-panel .node-copy .node-meta-line span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;grid-column:2}.execution-panel .node-copy .mini-progress{margin-top:8px}.execution-panel .node-step.active{transform:translate(2px)}.execution-panel .node-step.active:before{left:-2px;top:12px;width:8px;height:8px}.sop-node-detail{min-width:0}.sop-section{border-left:3px solid #bacefd}.sop-section:nth-of-type(3){border-left-color:#99f6e4}.sop-section:nth-of-type(4){border-left-color:#fde68a}.sop-section:nth-of-type(5){border-left-color:#bbf7d0}.sop-section-head{background:linear-gradient(90deg,#f8f9fb,#fff)}.step-console{padding-left:16px;border-left:1px dashed #bacefd}.process-step{position:relative}.process-step:before{content:"";position:absolute;left:-21px;top:20px;width:10px;height:1px;background:#bacefd}.human-input-box,.yesno-box,.content-review-box,.file-review-box,.step-error-box{margin-left:32px;border:1px solid #e0f2fe}.task-detail-tab{display:grid;gap:12px}.task-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.task-detail-card{display:grid;gap:10px;align-content:start;padding:14px;border:1px solid #dfe6ef;border-radius:12px;background:#fff}.task-detail-card.wide{grid-column:1 / -1}.task-detail-card p{color:#565c66;font-size:13px;line-height:1.6}.task-kv-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.task-kv-grid div{padding:10px;border-radius:9px;background:#f8f9fb}.task-kv-grid span{display:block;margin-bottom:4px;color:#646a73;font-size:11px}.task-kv-grid strong{color:#1f2329;font-size:13px}.detail-tag-list{display:flex;flex-wrap:wrap;gap:8px}.detail-tag-list span{border-radius:999px;background:#f0f4ff;color:#245bdb;padding:5px 9px;font-size:12px}.detail-rule-list{display:grid;gap:8px;margin:0;padding-left:18px;color:#565c66;font-size:13px}.task-node-map{display:grid;gap:8px}.task-node-map button{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:10px;align-items:start;border:1px solid #e2e8f0;border-radius:10px;background:#fff;padding:10px;text-align:left}.task-node-map button.active{border-color:#99f6e4;background:#ecfdf5}.task-node-map button>span{width:24px;height:24px;display:grid;place-items:center;border-radius:8px;background:#e1eaff;color:#245bdb;font-weight:800}.task-node-map p,.task-node-map small{display:block;margin-top:4px;color:#646a73;font-size:12px;line-height:1.45}@media(max-width:1280px){.execution-panel .work-surface{grid-template-columns:220px minmax(0,1fr)}.task-kv-grid,.task-detail-grid{grid-template-columns:1fr}}.execution-panel .center-scroll{display:flex;flex-direction:column;overflow:hidden}.execution-panel .work-surface{flex:1;min-height:0;overflow:hidden}.execution-panel .node-rail,.execution-panel .sop-node-detail{min-height:0;max-height:100%;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin}.execution-panel .sop-node-detail{padding-right:2px}.execution-panel .node-step,.execution-panel .node-copy,.execution-panel .node-title-row,.execution-panel .node-copy .node-meta-line{min-width:0}.execution-panel .node-copy .node-meta-line{display:flex!important;align-items:center;flex-wrap:wrap;gap:3px 6px;margin-top:5px}.execution-panel .node-copy .node-meta-line span{min-width:0;overflow:visible;white-space:nowrap;text-overflow:clip;line-height:1.35;word-break:keep-all;display:inline!important;grid-column:auto!important}.execution-panel .node-copy .node-meta-line b{display:inline-block;width:auto;height:auto;min-width:0;margin:0;padding:0;color:#646a73;font-size:11px;font-weight:500;line-height:1.35;white-space:nowrap;word-break:keep-all;writing-mode:horizontal-tb}.execution-panel .node-copy .node-meta-line b+b:before{content:"·";margin-right:6px;color:#cbd5e1}.execution-panel .artifact-strip{flex:0 0 auto}.node-input-stack{display:grid;gap:12px}.input-group{display:grid;gap:8px}.input-group>header{display:grid;gap:3px}.input-group>header strong{color:#1f2329;font-size:13px}.input-group>header span{color:#646a73;font-size:12px;line-height:1.45}.input-group>div{display:grid;grid-template-columns:1fr;gap:8px}.rich-input-grid .input-source-card,.node-input-stack .input-source-card{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start;padding:10px 12px;border:1px solid #e6edf5;border-radius:10px;background:#fff}.node-input-stack .input-source-card>span{width:24px;height:24px;display:inline-grid;place-items:center;border-radius:8px;background:#e0f2fe;color:#0369a1;font-size:12px;font-weight:800;line-height:1;margin-top:2px}.node-input-stack .input-source-card>div{min-width:0;display:grid;gap:5px}.input-title-line{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}.input-title-line strong{min-width:0;color:#1f2329;font-size:13px;line-height:1.35}.input-title-line em{border-radius:999px;background:#f0f4ff;color:#245bdb;padding:2px 7px;font-size:10px;font-style:normal;white-space:nowrap}.input-source-card button{min-height:28px;display:inline-flex;align-items:center;gap:6px;margin-top:8px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e;padding:0 9px;font-size:12px;justify-self:start}.input-source-card p{margin:0;color:#41464e;font-size:13px;line-height:1.45;white-space:normal;overflow:visible;text-overflow:clip}.input-source-card.email{border-color:#bacefd;background:#f8fbff}.input-source-card.file{border-color:#bbf7d0;background:#f7fef9}.process-step-head{width:100%;border:0;background:transparent;padding:0;text-align:left;align-items:start}.process-step-head>div{text-align:left;justify-self:stretch;min-width:0}.process-step-head>div strong,.process-step-head>div p{text-align:left}.process-step.done{background:#f8f9fb;border-color:#e2e8f0}.process-step.done .process-step-head>span{background:#e2e8f0;color:#646a73}.process-step.done .process-step-head strong,.process-step.done .process-step-head p{color:#646a73}.process-step.waiting,.process-step.waiting.active{border-color:#fdba74;background:#fff7ed;box-shadow:inset 3px 0 #f97316}.process-step.waiting .step-badge.waiting{background:#fed7aa;color:#9a3412}.step-expanded{display:grid;gap:10px;padding-top:8px;border-top:1px dashed #dee0e3}.step-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.step-info-box{display:grid;gap:6px;align-content:start;padding:9px;border:1px solid #e6edf5;border-radius:9px;background:#fff}.step-info-box strong{font-size:12px}.step-info-box p{margin:0;color:#565c66;font-size:12px;line-height:1.5}.step-info-box button,.preview-popover header button{min-height:28px;display:inline-flex;align-items:center;gap:6px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e;padding:0 9px;font-size:12px}.process-step.waiting .human-input-box,.process-step.waiting .yesno-box{border-color:#fb923c;background:#ffedd5}.process-step.waiting .human-input-box input{border-color:#fb923c;background:#fff7ed}.process-step.waiting .human-input-box button,.process-step.waiting .yesno-box button,.process-step.waiting .file-review-box button{border-color:#f97316;background:#f97316;color:#fff;font-weight:800}.validation-checklist{display:grid;grid-template-columns:220px minmax(0,1fr) 160px;gap:10px;align-items:start}.validator-card,.validation-actions{display:grid;gap:6px;padding:10px;border:1px solid #e6edf5;border-radius:9px;background:#fbfdff}.validator-card span,.validation-actions span{color:#646a73;font-size:11px}.validator-card p{color:#565c66;font-size:12px;line-height:1.5}.validation-items{display:grid;gap:8px}.validation-items article{display:grid;grid-template-columns:24px minmax(0,1fr) 22px;gap:8px;align-items:center;padding:9px;border:1px solid #e6edf5;border-radius:9px;background:#fff}.validation-items article>span{width:22px;height:22px;display:grid;place-items:center;border-radius:999px;background:#e0f2fe;color:#0369a1;font-weight:800;font-size:11px}.validation-items article.passed{border-color:#bbf7d0;background:#f0fdf4}.validation-items article.passed svg{color:#16a34a}.validation-items article.blocked svg{color:#f97316}.validation-actions .primary-action:disabled{border-color:#e2e8f0;background:#f1f5f9;color:#8f959e;cursor:not-allowed}.ai-rule-list{display:grid;gap:8px}.ai-rule-list article{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:10px;padding:10px;border:1px solid #fde68a;border-left:3px solid #f59e0b;border-radius:9px;background:#fffbeb}.ai-rule-list article.muted{border-color:#e2e8f0;border-left-color:#cbd5e1;background:#f8f9fb;opacity:.78}.rule-dot{width:7px;height:7px;margin-top:7px;border-radius:999px;background:#f59e0b}.ai-rule-list article.muted .rule-dot{background:#8f959e}.rule-title-line{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.rule-title-line span{border-radius:999px;background:#fef3c7;color:#b45309;padding:2px 7px;font-size:11px}.ai-rule-list p,.ai-rule-list small{display:block;margin-top:4px;color:#646a73;font-size:12px}.rule-actions{display:flex;align-items:center;gap:6px}.rule-actions button:first-child{border-color:#86efac;background:#dcfce7;color:#166534}.rule-actions button:nth-child(2){border-color:#e2e8f0;background:#fff;color:#565c66}.preview-popover header>div{display:flex;gap:8px}@media(max-width:1280px){.validation-checklist,.step-detail-grid{grid-template-columns:1fr}}.sop-ai-empty-log{color:#646a73;font-size:12px}.sop-ai-log-shell{border:1px solid #dee0e3;border-radius:10px;background:#f3f5f8;padding:10px}.sop-ai-log-list{display:grid;align-content:start;gap:6px;overflow:visible;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace;font-size:12px;text-align:left}.sop-ai-log-line{width:100%;display:grid;grid-template-columns:max-content minmax(0,1fr) 18px;gap:8px;align-items:center;justify-content:flex-start;border:1px solid #e2e8f0;border-radius:6px;background:#fff;padding:6px 8px;color:#41464e;text-align:left}.process-step .sop-ai-log-line{display:grid!important;justify-content:flex-start!important;text-align:left!important}.sop-ai-log-line:hover{background:#f8f9fb}.sop-ai-log-time{color:#565c66;white-space:nowrap;text-align:left;align-self:center}.sop-ai-log-source{display:inline;margin-right:6px;color:#3370ff;white-space:nowrap;text-align:left}.sop-ai-log-source.warning{color:#b45309}.sop-ai-log-source.error{color:#dc2626}.sop-ai-log-main{min-width:0;display:-webkit-box;overflow:hidden;color:#565c66;line-height:1.45;text-align:left;-webkit-box-orient:vertical;-webkit-line-clamp:3}.sop-ai-log-message{display:inline;color:#565c66;word-break:normal;overflow-wrap:anywhere;text-align:left}.sop-ai-log-message b{color:#41464e;font-weight:700}.sop-ai-log-duration{display:inline-flex;align-items:center;margin-left:6px;border-radius:999px;background:#e2e8f0;color:#41464e;padding:1px 7px;font-size:10px;white-space:nowrap;vertical-align:1px}.sop-ai-log-line svg{color:#646a73;transition:transform .15s ease;justify-self:end;align-self:center}.sop-ai-log-line svg.open{transform:rotate(180deg)}.sop-ai-log-detail{display:grid;gap:8px;margin:6px 6px 10px 0;padding-left:0;text-align:left}.sop-ai-json-viewer{border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e;font-size:11px;line-height:1.55;overflow:auto;max-height:360px;word-break:break-word}.sop-ai-json-head{display:flex;align-items:center;gap:5px;border-bottom:1px solid #e2e8f0;background:#f8f9fb;color:#646a73;padding:6px 9px;font-size:10px;font-weight:800;letter-spacing:0}.sop-ai-json-body{padding:9px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace;white-space:pre-wrap}.json-node,.json-line{display:block;text-align:left}.json-toggle{width:18px;min-height:18px!important;display:inline-flex!important;align-items:center;justify-content:center;margin:0 2px 0 0;border:0!important;background:transparent!important;color:#646a73!important;padding:0!important;vertical-align:middle}.json-children{display:block;margin:2px 0 2px 18px;padding-left:10px;border-left:1px solid #e2e8f0}.json-key{color:#3370ff}.json-string{color:#047857}.json-number{color:#b45309}.json-boolean{color:#7c3aed}.json-null,.json-muted,.json-comma{color:#8f959e}.json-bracket{color:#646a73}.sop-ai-feedback-panel{display:grid;gap:8px;border:1px solid #fdba74;border-radius:9px;background:#fff7ed;padding:10px}.sop-ai-feedback-panel strong{color:#9a3412;font-size:13px}.sop-ai-feedback-panel p{margin:0;color:#7c2d12;font-size:12px;line-height:1.5}.sop-ai-feedback-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}.sop-ai-feedback-fields label{display:grid;gap:4px;color:#9a3412;font-size:11px;font-weight:700}.sop-ai-feedback-fields input{min-height:30px;border:1px solid #fdba74;border-radius:7px;background:#fff;color:#1f2329;padding:0 8px;font-size:12px}.sop-ai-feedback-actions{display:flex;gap:8px;flex-wrap:wrap}.sop-ai-feedback-actions button:first-child{border-color:#f97316;background:#f97316;color:#fff}.sop-ai-feedback-actions button:not(:first-child){border-color:#fdba74;background:#fff;color:#9a3412}.sop-ai-log-detail button{justify-self:start;min-height:28px;border:1px solid #bacefd;border-radius:8px;background:#f0f4ff;color:#245bdb;padding:0 9px;font-size:12px;text-align:left}.step-console,.step-console-head,.process-step,.process-step-head,.process-step-head>div,.process-step-head strong,.process-step-head p,.step-expanded,.step-detail-grid,.step-info-box,.step-info-box p{text-align:left}.step-result-panel{width:100%;display:grid;gap:8px;padding:12px;border:1px solid #bacefd;border-radius:10px;background:#f0f4ff}.step-result-panel.feedback-required{border-color:#fdba74;background:#fff7ed}.step-result-panel>strong{color:#1e3a8a;font-size:13px}.step-result-panel.feedback-required>strong{color:#9a3412}.step-result-panel p{margin:0;color:#1f2329;font-size:13px;line-height:1.55}.step-result-assets{display:flex;gap:8px;flex-wrap:wrap}.step-result-assets button{min-height:30px;display:inline-flex;align-items:center;gap:6px;border:1px solid #82a7fc;border-radius:8px;background:#fff;color:#245bdb;padding:0 10px;font-size:12px;font-weight:700}.step-result-feedback{display:grid;gap:8px;padding:10px;border:1px solid #fdba74;border-radius:9px;background:#fff}.step-result-feedback strong{color:#9a3412;font-size:13px}.step-result-feedback p{margin:3px 0 0;color:#7c2d12;font-size:12px;line-height:1.5}.step-output-json{width:100%;display:grid;gap:8px}.step-output-json>button{justify-self:start;min-height:28px;display:inline-flex;align-items:center;gap:5px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e;padding:0 10px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace;font-size:12px}.process-step-head{justify-items:start}.process-step .step-expanded{margin-left:32px;padding-left:12px;border-left:1px dashed #dee0e3}.process-step .process-step-head{width:100%;display:grid!important;grid-template-columns:24px minmax(0,1fr) auto 16px;align-items:center;justify-content:stretch!important;justify-items:start;text-align:left!important}.process-step .process-step-head>span,.process-step .process-step-head>div,.process-step .process-step-head>em,.process-step .process-step-head>svg{justify-self:start}.node-goal-summary{margin:3px 0 0;color:#646a73;font-size:12px;line-height:1.45}.node-input-stack .input-source-card{width:100%;border:1px solid #e6edf5;background:#fff;color:inherit;font:inherit;text-align:left;cursor:pointer;transition:border-color .14s ease,background .14s ease,box-shadow .14s ease}.node-input-stack .input-source-card:hover{border-color:#82a7fc;background:#f8fbff;box-shadow:0 4px 14px #1c4cba14}.node-input-stack .input-source-card.file:hover{border-color:#86efac;background:#f7fef9}.input-title-line strong{text-decoration:none}.input-source-card.file .input-title-line strong{color:#245bdb}.input-source-card:hover .input-title-line strong{text-decoration:underline;text-underline-offset:3px}.input-row-hint{display:inline-flex;align-items:center;gap:5px;color:#646a73;font-size:11px;line-height:1.2}.ai-supplement-box{display:grid;gap:8px;padding-top:8px;border-top:1px dashed #fed7aa}.ai-supplement-box label{display:grid;gap:5px;color:#9a3412;font-size:11px;font-weight:800}.ai-supplement-box textarea{min-height:64px;resize:vertical;border:1px solid #fdba74;border-radius:8px;background:#fff7ed;color:#1f2329;padding:8px;font:inherit;font-size:12px;line-height:1.45}.ai-supplement-files{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.ai-supplement-files label,.ai-supplement-files button,.ai-supplement-files span{min-height:28px;display:inline-flex;align-items:center;gap:6px;border:1px solid #fdba74;border-radius:8px;background:#fff;color:#9a3412;padding:0 9px;font-size:12px;font-weight:700}.ai-supplement-files label{cursor:pointer}.ai-supplement-files input{display:none}.ai-supplement-files button{border-color:#f97316;background:#f97316;color:#fff}.ai-supplement-files>button:not(.ai-supplement-submit){display:none}.step-feedback-state{display:flex;align-items:center;gap:8px;border:1px solid #bbf7d0;border-radius:8px;background:#f0fdf4;color:#166534;padding:8px 10px;font-size:12px}.step-feedback-state strong{min-width:max-content;color:#047857;font-size:12px}.step-feedback-state span{color:#166534;line-height:1.4}.human-feedback-record{display:grid;gap:8px;border:1px solid #bbf7d0;border-radius:9px;background:#f0fdf4;padding:10px}.human-feedback-record>div:first-child{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.human-feedback-record span{display:inline-flex;align-items:center;min-height:22px;border-radius:999px;background:#dcfce7;color:#047857;padding:0 8px;font-size:11px;font-weight:900}.human-feedback-record strong{color:#064e3b;font-size:13px}.human-feedback-record p{white-space:pre-wrap;color:#14532d;font-size:12px;line-height:1.5}.human-feedback-record>div:last-child{display:flex;gap:7px;flex-wrap:wrap}.human-feedback-record button{min-height:28px;display:inline-flex;align-items:center;gap:5px;border:1px solid #86efac;border-radius:8px;background:#fff;color:#047857;padding:0 9px;font-size:12px;font-weight:800}.manual-feedback-editor{display:grid;gap:8px;border:1px solid #fdba74;border-radius:9px;background:#fff7ed;padding:10px}.manual-feedback-editor>strong{color:#9a3412;font-size:13px}.manual-feedback-editor textarea{min-height:76px;resize:vertical;border:1px solid #fdba74;border-radius:8px;background:#fff;color:#1f2329;padding:8px;font:inherit;font-size:12px;line-height:1.45}.manual-feedback-editor label{width:max-content;min-height:28px;display:inline-flex;align-items:center;gap:6px;border:1px solid #fdba74;border-radius:8px;background:#fff;color:#9a3412;padding:0 9px;font-size:12px;font-weight:800;cursor:pointer}.manual-feedback-editor input{display:none}.manual-feedback-editor>p{color:#7c2d12;font-size:12px}.manual-feedback-editor>div{display:flex;gap:8px;flex-wrap:wrap}.manual-feedback-editor button{min-height:28px;border:1px solid #fdba74;border-radius:8px;background:#fff;color:#9a3412;padding:0 10px;font-size:12px;font-weight:800}.manual-feedback-editor button:first-child{border-color:#f97316;background:#f97316;color:#fff}.node-output-summary{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1fr);gap:10px;margin-bottom:10px}.node-output-card{display:grid;gap:8px;align-content:start;min-width:0;border:1px solid #dee0e3;border-radius:10px;background:#fff;padding:11px}.node-output-card.conclusion{border-color:#bacefd;background:#f0f4ff}.node-output-card>span{color:#646a73;font-size:11px;font-weight:800}.node-output-card strong{color:#1f2329;font-size:13px;line-height:1.45}.node-output-card p,.node-output-card li{color:#565c66;font-size:12px;line-height:1.5}.node-output-feedback-list{display:grid;gap:7px}.node-output-feedback-list button{width:100%;min-height:30px;border:1px solid #e2e8f0;border-radius:8px;background:#fff;color:#41464e;padding:7px 9px;font-size:12px;line-height:1.45;text-align:left}.node-output-feedback-list button:hover{border-color:#82a7fc;background:#f8fbff;color:#245bdb}.node-output-files{display:flex;gap:7px;flex-wrap:wrap}.node-output-files button{min-height:28px;border:1px solid #bacefd;border-radius:8px;background:#f0f4ff;color:#245bdb;padding:0 9px;font-size:12px;font-weight:700}.ai-rule-list{grid-template-columns:repeat(3,minmax(180px,1fr));align-items:stretch;overflow-x:auto;padding-bottom:2px}.ai-rule-list article{grid-template-columns:minmax(0,1fr)!important;gap:10px!important;align-content:start;min-height:150px;padding:12px!important;border-left-width:1px!important}.ai-rule-list .rule-dot{display:none}.ai-rule-list .rule-title-line{align-items:flex-start}.ai-rule-list .rule-title-line strong{font-size:14px;line-height:1.35}.ai-rule-list p,.ai-rule-list small,.ai-rule-list em{font-size:11px;line-height:1.45}.ai-rule-list .rule-actions{margin-top:auto;justify-content:flex-start}.ai-rule-list .rule-actions button{min-height:28px;border-radius:8px;padding:0 10px;font-size:12px;font-weight:800}.ai-rule-list .rule-actions button:first-child{border-color:#f97316;background:#f97316;color:#fff}.ai-rule-list .rule-actions button:nth-child(2){border-color:#fdba74;background:#fff;color:#9a3412}.ai-rule-list article.rule-decided{background:#f8f9fb!important}.ai-rule-list article.rule-decided .rule-actions button{display:none}.ai-rule-list article.rule-decided em{width:max-content;display:inline-flex;align-items:center;min-height:24px;margin-top:4px;border:1px solid #bbf7d0;border-radius:999px;background:#f0fdf4;color:#047857;padding:0 9px;font-style:normal;font-weight:800}@media(max-width:1280px){.node-output-summary{grid-template-columns:1fr}}:root{--jcai-bg: #f3f5f8;--jcai-surface: #ffffff;--jcai-surface-soft: #f8f9fb;--jcai-surface-muted: #f5f7fa;--jcai-border: #dee0e3;--jcai-border-soft: #e8eaed;--jcai-text: #1f2329;--jcai-muted: #646a73;--jcai-primary: #3370ff;--jcai-primary-soft: #f0f4ff;--jcai-warning: #f97316;--jcai-warning-soft: #fff7ed;--jcai-success-soft: #f0fdf4;--jcai-shadow-1: 0 1px 2px rgba(15, 23, 42, .05);--jcai-shadow-2: 0 10px 28px rgba(15, 23, 42, .08)}body,.app-body,.workspace{background:var(--jcai-bg)}.topbar{border-bottom-color:var(--jcai-border);background:#fffffff5}.top-search{border-color:var(--jcai-border);background:var(--jcai-surface-soft)}.app-nav{border-right-color:var(--jcai-border);background:#f7f9fc}.app-nav button.active{border-color:#c7d7f2;background:#eaf0ff;box-shadow:inset 0 0 0 1px #3370ff14}.task-sidebar,.execution-panel{background:var(--jcai-surface);border-color:var(--jcai-border);box-shadow:var(--jcai-shadow-1)}.right-chat{background:#f7faff;border-color:#c9d8ee;box-shadow:inset 1px 0 #3370ff14,var(--jcai-shadow-2)}.task-sidebar .sidebar-head,.chat-head,.center-tabs{border-bottom-color:var(--jcai-border-soft);background:var(--jcai-surface)}.task-sidebar .filter-panel,.status-filter-row,.task-sidebar .task-list,.execution-panel .center-scroll{background:var(--jcai-surface)}.filter-panel,.status-filter-row{border-bottom-color:var(--jcai-border-soft)}.status-filter-row button,.filter-row select,.sort-button,.icon-button,.ghost-action,.secondary-action,.control-field,.control-field select{border-color:var(--jcai-border);background:var(--jcai-surface);color:#41464e;box-shadow:none}.status-filter-row button.active{border-color:#b7c9ed;background:var(--jcai-primary-soft);color:#1c4cba;box-shadow:inset 0 0 0 1px #3370ff14}.status-filter-row button.active strong{background:var(--jcai-primary);color:#fff}.task-sidebar .task-card{border-color:var(--jcai-border);background:var(--jcai-surface);box-shadow:none;transform:none}.task-sidebar .task-card:before{display:none}.task-sidebar .task-card:hover{border-color:#b8c6d8;background:#fbfcfe;box-shadow:var(--jcai-shadow-1);transform:none}.task-sidebar .task-card.selected{border-color:var(--jcai-primary);background:#f8fbff;box-shadow:inset 0 0 0 1px #3370ff2e,0 8px 22px #1f232914;transform:none}.task-sidebar .task-card.selected:before{display:none}.task-sidebar .task-card h3,.task-sidebar .task-card.selected h3,.node-title-row h3,.sop-section-head,.process-step-head strong{color:var(--jcai-text)}.progress-line,.mini-progress{background:#e7edf5}.progress-line span,.mini-progress i{background:var(--jcai-primary)}.task-hero{border:1px solid var(--jcai-border)!important;border-top-color:var(--jcai-border)!important;background:var(--jcai-surface);box-shadow:var(--jcai-shadow-1)}.hero-kicker em{border:1px solid #d6e3f7;border-radius:999px;background:var(--jcai-primary-soft);color:#245bdb;padding:2px 7px;font-style:normal}.center-tabs button{color:var(--jcai-muted)}.center-tabs button.active{color:var(--jcai-primary);border-bottom-color:var(--jcai-primary);background:transparent}.work-surface{background:var(--jcai-surface)}.node-rail{border-right:1px solid var(--jcai-border-soft);padding-right:12px}.node-detail{padding-left:2px}.execution-panel .node-step{border-color:var(--jcai-border);background:var(--jcai-surface);box-shadow:none}.execution-panel .node-step:hover{border-color:#b8c6d8;background:#fbfcfe}.execution-panel .node-step.active{border-color:#b8c6d8;background:#fbfcfe;box-shadow:inset 0 0 0 1px #1f23290d,var(--jcai-shadow-1);transform:none!important}.execution-panel .node-step.active:before{display:none}.execution-panel .node-step.active .node-index,.node-index{background:#eaf0ff;color:var(--jcai-primary)}.node-complete-mark{background:var(--jcai-success-soft)}.node-toolbar,.node-block-alert,.artifact-strip{border-color:var(--jcai-border);background:var(--jcai-surface);box-shadow:var(--jcai-shadow-1)}.sop-section{overflow:hidden;border:1px solid var(--jcai-border)!important;border-left-width:1px!important;border-left-color:var(--jcai-border)!important;border-radius:12px;background:var(--jcai-surface);box-shadow:var(--jcai-shadow-1)}.sop-section:nth-of-type(3),.sop-section:nth-of-type(4),.sop-section:nth-of-type(5){border-left-color:var(--jcai-border)!important}.sop-section-head{background:var(--jcai-surface-soft)!important;border-bottom:1px solid var(--jcai-border-soft)}.sop-section-body{background:var(--jcai-surface)}.input-group,.input-source-card,.node-output-card,.validator-card,.validation-items article,.task-detail-card,.workspace-card,.workspace-wide{border-color:var(--jcai-border);background:var(--jcai-surface);box-shadow:none}.input-group header,.step-console-head{border-bottom-color:var(--jcai-border-soft)}.input-source-card:hover,.node-output-feedback-list button:hover{border-color:#b8c6d8;background:#fbfcfe;box-shadow:var(--jcai-shadow-1)}.node-output-card.conclusion,.step-result-panel{border-color:var(--jcai-border);background:#f8fbff}.step-console{border-left:1px solid var(--jcai-border-soft)!important;padding-left:18px}.process-step:before{background:var(--jcai-border-soft)!important}.process-step{border-color:var(--jcai-border)!important;background:var(--jcai-surface)!important;box-shadow:none!important}.process-step.done{background:#fbfcfe!important}.process-step.waiting,.process-step.waiting.active{border-color:#fdba74!important;background:var(--jcai-warning-soft)!important;box-shadow:none!important}.process-step.active:not(.waiting){border-color:#cbd7e6!important;background:#fbfcfe!important}.process-step .step-expanded{border-left:1px solid var(--jcai-border-soft)!important}.process-step-head{background:transparent!important}.step-result-panel{border-width:1px!important;box-shadow:none!important}.step-result-panel.feedback-required,.step-result-feedback,.manual-feedback-editor,.sop-ai-feedback-panel{border-color:#fdba74!important;background:var(--jcai-warning-soft)!important;box-shadow:none!important}.step-result-feedback,.manual-feedback-editor{border-width:1px!important}.sop-ai-log-shell{border-color:var(--jcai-border);background:var(--jcai-surface-muted)}.sop-ai-log-line{border-color:var(--jcai-border);background:var(--jcai-surface)}.sop-ai-log-line:hover{background:#fbfcfe}.sop-ai-log-duration{background:#e6edf5}.sop-ai-json-viewer,.sop-ai-json-head{border-color:var(--jcai-border)}.sop-ai-json-head{background:var(--jcai-surface-soft)}.validation-checklist{border-color:var(--jcai-border);background:var(--jcai-surface)}.validation-items article.passed{background:#f7fef9}.validation-items article.blocked{background:var(--jcai-warning-soft)}.ai-rule-list article{border-color:var(--jcai-border)!important;background:var(--jcai-surface)!important;box-shadow:var(--jcai-shadow-1)}.ai-rule-list article.warning,.ai-rule-list article.strong{border-color:#f8cf94!important;background:#fffbf5!important}.ai-rule-list article.rule-decided{border-color:var(--jcai-border)!important;background:#fbfcfe!important}.ai-rule-list .rule-actions button{border-color:var(--jcai-border);background:var(--jcai-surface);color:#41464e;box-shadow:none}.ai-rule-list .rule-actions button:first-child{border-color:var(--jcai-primary);background:var(--jcai-primary);color:#fff}.ai-rule-list .rule-actions button:nth-child(2){border-color:var(--jcai-border);background:var(--jcai-surface);color:#41464e}.context-card,.message-bubble,.chat-action-card{border-color:#d6e3f7;background:#fff;box-shadow:var(--jcai-shadow-1)}.chat-input-area,.chat-input{border-color:#d6e3f7;background:#f8fbff}.preview-popover>div,.search-popover{border-color:var(--jcai-border);box-shadow:0 24px 72px #1f23292e}.workspace{--jcai-ai-chat-width: calc(360px + 10vw) ;grid-template-columns:310px minmax(620px,1fr) var(--jcai-ai-chat-width);height:100%;min-height:0;overflow:hidden}.workspace.left-collapsed{grid-template-columns:52px minmax(760px,1fr) var(--jcai-ai-chat-width)}.workspace.chat-collapsed{grid-template-columns:310px minmax(760px,1fr) 52px}.workspace.left-collapsed.chat-collapsed{grid-template-columns:52px minmax(900px,1fr) 52px}.execution-panel .task-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:12px}.execution-panel .hero-main h2,.execution-panel .hero-main p{overflow:visible;white-space:normal;text-overflow:clip}.execution-panel .hero-main p{max-width:none;line-height:1.45}.execution-panel .hero-actions{min-width:240px;display:grid;grid-template-columns:1fr;justify-items:end;gap:8px}.execution-panel .hero-actions>.primary-action,.execution-panel .hero-actions>.secondary-action{width:240px;justify-self:end;justify-content:center}.hero-control-row{width:240px;display:flex;flex-direction:column;justify-content:flex-end;gap:8px}.hero-control-row .control-field{width:100%;min-width:0}.center-tabs button{flex:0 0 auto}.execution-panel .center-scroll:has(.work-surface){overflow:hidden}.execution-panel .task-detail-tab{min-height:0;padding-bottom:18px}.status-filter-row{flex-wrap:wrap;overflow:visible;min-height:0;height:auto;max-height:none;scrollbar-width:auto}.status-filter-row::-webkit-scrollbar{display:none}.node-toolbar-actions{align-self:start}.node-toolbar .node-goal-summary{max-width:none}.step-result-feedback.feedback-required{border-width:1px!important;border-color:#fb923c!important;background:#fff7ed!important;box-shadow:inset 0 0 0 1px #f973161f!important}.execution-panel .center-scroll:has(.sop-flow-shell){overflow:hidden}.sop-flow-shell{position:relative;height:100%;min-height:0;overflow:hidden;border-top:1px solid var(--jcai-border-soft);background:#f7f9fc}.sop-flow-head{display:flex;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--jcai-border);background:#ffffffeb}.sop-flow-head span{color:var(--jcai-primary);font-size:12px;font-weight:800}.sop-flow-head h3{margin:2px 0 3px;color:var(--jcai-text);font-size:15px}.sop-flow-head p{max-width:920px;margin:0;color:var(--jcai-muted);font-size:12px;line-height:1.45}.flow-legend{display:flex;align-items:center;gap:8px;white-space:nowrap;color:#646a73;font-size:12px}.flow-legend i{width:9px;height:9px;border-radius:999px}.flow-legend .done{background:#22c55e}.flow-legend .running{background:#3370ff}.flow-legend .blocked{background:#f97316}.flow-legend .pending{background:#8f959e}.sop-flow-shell .react-flow{height:100%}.sop-flow-shell.drawer-open .react-flow{width:100%}.sop-flow-node{width:300px;min-height:64px;padding:8px;border:1px solid #d8e2ee;border-radius:12px;background:#fff;box-shadow:0 8px 22px #1f23290f;color:#1f2329;cursor:pointer}.sop-flow-node.trigger{border-color:#c4b5fd;background:#fbfaff}.sop-flow-node.active{border-color:#3370ff;box-shadow:inset 0 0 0 2px #3370ff3d,0 14px 34px #3370ff2e}.sop-flow-node.gate{border-style:dashed;border-color:#f59e0b;background:#fffaf0}.sop-flow-node.completed{border-top:4px solid #22c55e}.sop-flow-node.running{border-top:4px solid #3370ff}.sop-flow-node.human_input,.sop-flow-node.event_waiting,.sop-flow-node.permission_waiting{border-top:4px solid #f97316}.sop-flow-node.risk{border-top:4px solid #ef4444}.sop-flow-node.pending{border-top:4px solid #8f959e}.flow-node-title{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:6px}.flow-node-title>span{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:22px;padding:0 6px;border-radius:8px;background:#eaf0ff;color:var(--jcai-primary);font-weight:800}.flow-node-title strong{color:#1f2329;font-size:12.5px;line-height:1.25;white-space:normal;word-break:break-word}.sop-flow-node p,.sop-flow-node li,.flow-node-state{font-size:12px;line-height:1.35}.sop-flow-node p{display:-webkit-box;min-height:0;margin:5px 0;overflow:hidden;color:#565c66;-webkit-box-orient:vertical;-webkit-line-clamp:1}.flow-node-state{display:flex;align-items:center;justify-content:flex-start;gap:8px;margin-bottom:0;color:#646a73}.flow-node-flags{display:flex;align-items:center;gap:6px;margin-top:5px}.flow-node-flags em{padding:2px 7px;border-radius:999px;background:#fff7ed;color:#c2410c;font-size:11px;font-style:normal;font-weight:800}.source-edge-label{position:absolute;padding:1px 6px;border-radius:6px;background:#f8f9fbf0;color:#41464e;font-size:11px;font-weight:800;line-height:16px;pointer-events:none;white-space:nowrap}.sop-node-drawer{position:fixed;top:0;left:0;bottom:0;z-index:120;display:flex;flex-direction:column;width:40vw;height:100vh;border:0;border-right:1px solid #c9d8ee;border-radius:0;background:#fff;box-shadow:24px 0 60px #1f23292e;overflow:hidden}.compact-input-list,.node-input-panel{display:grid;gap:12px}.node-input-brief{display:grid;gap:10px;border:1px solid var(--jcai-border);border-radius:12px;background:#f8fbff;padding:12px}.node-input-brief header{display:flex;align-items:center;justify-content:space-between;gap:8px}.node-input-brief header span{color:#646a73;font-size:12px;font-weight:800}.node-input-brief header strong{border-radius:999px;background:#eaf0ff;color:var(--jcai-primary);padding:2px 8px;font-size:12px}.node-input-brief p{margin:0;color:#41464e;font-size:13px;line-height:1.6}.node-input-brief dl{display:grid;gap:6px;margin:0}.node-input-brief dl>div{display:grid;grid-template-columns:84px minmax(0,1fr);gap:8px;align-items:start}.node-input-brief dt{color:#646a73;font-size:12px;font-weight:800}.node-input-brief dd{min-width:0;margin:0;color:#1f2329;font-size:13px;line-height:1.45;overflow-wrap:anywhere}.node-input-reference-row{display:flex;gap:8px;flex-wrap:wrap}.node-input-reference-row button{min-height:30px;border:1px solid #bacefd;border-radius:8px;background:#fff;color:#245bdb;padding:0 10px;font-size:12px;font-weight:800}.compact-input-list>div{display:grid;gap:6px}.compact-input-list>div>span{color:#646a73;font-size:12px;font-weight:800}.compact-input-item{width:100%;min-height:36px;display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:8px;border:1px solid var(--jcai-border);border-radius:9px;background:#fff;color:#1f2329;padding:7px 9px;font:inherit;text-align:left;cursor:pointer}.compact-input-item:hover{border-color:#b8c6d8;background:#fbfcfe;box-shadow:var(--jcai-shadow-1)}.compact-input-item>span{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:7px;background:#eaf0ff;color:var(--jcai-primary);font-size:12px;font-weight:800}.compact-input-item strong{min-width:0;overflow:hidden;color:#1f2329;font-size:13px;text-overflow:ellipsis;white-space:nowrap}.compact-input-item em{border-radius:999px;background:#f1f5f9;color:#646a73;padding:2px 7px;font-size:11px;font-style:normal;font-weight:800}.compact-input-item.file em{background:#f0f4ff;color:#245bdb}.compact-input-item.email em{background:#f0fdf4;color:#047857}.compact-input-item.rule em{background:#fff7ed;color:#c2410c}.preview-popover{z-index:180}.preview-popover>div{width:min(980px,calc(100vw - 72px))}.file-preview-plain{overflow:auto;margin:0;padding:16px;white-space:pre-wrap;color:#1f2329;font-size:13px;line-height:1.6}.file-preview-table,.file-preview-sheet,.file-preview-email,.file-preview-doc,.file-preview-ppt,.file-preview-md,.file-preview-pdf{min-height:0;overflow:auto;padding:16px}.file-preview-table table,.file-preview-sheet table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--jcai-border);border-radius:10px;overflow:hidden;font-size:12px}.file-preview-table th,.file-preview-table td,.file-preview-sheet th,.file-preview-sheet td{border-right:1px solid #e6edf5;border-bottom:1px solid #e6edf5;padding:8px 10px;text-align:left;vertical-align:top}.file-preview-table th,.file-preview-sheet th{background:#f8f9fb;color:#41464e;font-weight:900}.file-preview-table td,.file-preview-sheet td{color:#1f2329;line-height:1.45}.sheet-toolbar,.pdf-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;border:1px solid var(--jcai-border);border-radius:9px;background:#f8f9fb;padding:8px 10px;color:#646a73;font-size:12px}.sheet-toolbar strong,.pdf-toolbar strong{color:#245bdb}.file-preview-email{display:grid;gap:12px;background:#f8f9fb}.file-preview-email>header,.file-preview-email dl,.file-preview-email section{border:1px solid var(--jcai-border);border-radius:10px;background:#fff;padding:12px}.file-preview-email>header{display:grid;justify-content:stretch;gap:4px}.file-preview-email>header span,.file-preview-email dt{color:#646a73;font-size:12px;font-weight:800}.file-preview-email>header strong{color:#1f2329;font-size:18px}.file-preview-email dl{display:grid;gap:6px;margin:0}.file-preview-email dl>div{display:grid;grid-template-columns:64px minmax(0,1fr);gap:8px}.file-preview-email dd{margin:0;color:#1f2329;font-size:13px}.file-preview-email p,.file-preview-doc p,.file-preview-md p,.file-preview-pdf p{margin:0 0 10px;color:#41464e;font-size:13px;line-height:1.65}.file-preview-doc,.file-preview-pdf{background:#f0f2f5}.doc-page,.file-preview-pdf article{max-width:720px;min-height:520px;margin:0 auto;border:1px solid #dee0e3;border-radius:4px;background:#fff;padding:42px 50px;box-shadow:0 12px 34px #1f23291f}.doc-page h2,.file-preview-pdf h2,.file-preview-md h3{margin:0 0 12px;color:#1f2329}.doc-meta{color:#646a73!important;font-size:12px!important}.file-preview-ppt{display:grid;grid-template-columns:180px minmax(0,1fr);gap:14px;background:#f8f9fb}.file-preview-ppt aside{display:grid;gap:8px;align-content:start}.file-preview-ppt aside div{display:grid;grid-template-columns:24px minmax(0,1fr);gap:6px;border:1px solid var(--jcai-border);border-radius:9px;background:#fff;padding:8px}.file-preview-ppt aside div.active{border-color:#82a7fc;background:#f0f4ff}.file-preview-ppt section{min-height:420px;display:grid;align-content:center;border:1px solid #dee0e3;border-radius:12px;background:linear-gradient(135deg,#fff,#f0f4ff);padding:48px}.file-preview-ppt h2{margin:0 0 18px;color:#1f2329;font-size:28px}.file-preview-ppt li{margin:10px 0;color:#41464e;font-size:16px}.file-preview-md{background:#fff}.file-preview-md h3{border-bottom:1px solid #e6edf5;padding-bottom:8px}.file-preview-md .md-list:before{content:"• ";color:#3370ff;font-weight:900}.process-step.feedback-needed,.process-step.feedback-needed.active{border-color:#fb923c!important;background:#fffaf5!important}.process-step.feedback-needed .process-step-head>span{background:#ffedd5;color:#c2410c}.step-result-feedback.feedback-required{padding:12px}.step-result-feedback.feedback-required>div:first-child{display:grid;gap:4px}.step-result-feedback.feedback-required>div:first-child:before{content:"等待人类反馈";justify-self:start;border-radius:999px;background:#ffedd5;color:#c2410c;padding:2px 8px;font-size:11px;font-weight:900}.validation-checklist{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px;align-items:stretch}.node-output-summary{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:10px;align-items:stretch}.node-output-summary .node-output-card{min-width:0;min-height:0}.node-output-summary .node-output-card.conclusion{grid-column:1 / -1}.node-output-summary .node-output-card.conclusion strong{display:block;max-height:none;overflow:visible;white-space:normal;overflow-wrap:anywhere}.node-output-summary .node-output-files,.node-output-summary .node-output-feedback-list{align-content:start}.node-output-summary .node-output-files{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,max-content));gap:8px}.node-output-summary .node-output-files button{width:fit-content;max-width:100%}.node-output-summary .node-output-feedback-list button{min-height:38px}@media(max-width:1180px){.node-output-summary{grid-template-columns:minmax(0,1fr)!important}.node-output-summary .node-output-card.conclusion{grid-column:auto}}.validator-card{width:100%;display:grid;grid-template-columns:minmax(0,1fr);gap:4px}.validator-card strong,.validator-card p{min-width:0;max-width:none}.validator-card p{margin:0;white-space:normal}.validation-items{width:100%;display:grid;grid-template-columns:minmax(0,1fr);gap:8px}.validation-items article{width:100%;display:grid!important;grid-template-columns:26px minmax(0,1fr) auto!important;gap:8px;align-items:center;min-height:42px}.validation-items article p{min-width:0;margin:0;color:#1f2329;font-size:13px;line-height:1.45;white-space:normal;word-break:normal;overflow-wrap:anywhere}.validation-items article>svg,.validation-items article>button{justify-self:end}.validation-items article.warning{border-color:#fdba74;background:#fff7ed}.validation-items article.failed{border-color:#fecaca;background:#fff1f2}.validation-items article>svg{color:#16a34a}.validation-retry-button{min-height:30px;display:inline-flex;align-items:center;gap:5px;border:1px solid #fdba74;border-radius:8px;background:#fff;color:#c2410c;padding:0 9px;font-size:12px;font-weight:800;white-space:nowrap}.validation-items article.failed .validation-retry-button{border-color:#fecaca;color:#dc2626}.validation-actions{display:none!important}.sop-node-drawer>header{flex:0 0 auto;display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--jcai-border-soft);background:#f8f9fb}.sop-node-drawer>header button{width:32px;height:32px;border:1px solid var(--jcai-border);border-radius:9px;background:#fff}.sop-node-drawer>header span{display:block;color:#646a73;font-size:12px}.sop-node-drawer>header strong{color:#1f2329}.sop-node-drawer .node-detail{flex:1 1 auto;min-height:0;height:auto!important;max-height:none!important;overflow-y:auto!important;overflow-x:hidden;padding:12px 12px 28px;scrollbar-gutter:stable}.sop-node-drawer .sop-node-detail{display:flex;flex-direction:column;gap:10px}.sop-node-drawer .sop-section{flex:0 0 auto;min-height:auto}.sop-node-drawer .sop-section-body{max-height:none!important;overflow:visible!important}.sop-node-drawer .step-console{max-height:none;overflow:visible}.trigger-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.trigger-detail-grid article{padding:12px;border:1px solid var(--jcai-border);border-radius:12px;background:#f8f9fb}.trigger-detail-grid article.wide{grid-column:1 / -1}.trigger-detail-grid span{display:block;margin-bottom:6px;color:#646a73;font-size:12px;font-weight:700}.trigger-detail-grid strong{color:#1f2329;font-size:14px}.trigger-detail-grid p,.trigger-detail-grid li{margin:6px 0 0;color:#565c66;font-size:13px;line-height:1.55}.trigger-detail-grid ul{margin:0;padding-left:18px}.task-sidebar{border-right:1px solid #bdc8d8!important;box-shadow:inset -1px 0 #8f959e40,0 14px 36px #1f232914}.collapsed-task-panel{min-height:0;width:52px;display:flex;flex-direction:column;border:1px solid #cbd5e1;border-right-color:#b6c2d1;border-radius:12px 0 0 12px;background:#fff;box-shadow:inset -1px 0 #8f959e40,0 14px 36px #1f232914;overflow:hidden}.collapsed-task-panel .side-rail{width:100%;min-height:auto;border:0;border-bottom:1px solid #edf1f6;border-radius:0;box-shadow:none;padding:12px 6px}.collapsed-status-stack{min-height:0;display:grid;gap:6px;align-content:start;overflow:auto;padding:8px 6px}.collapsed-status-stack button{min-height:54px;display:grid;justify-items:center;align-content:center;gap:4px;border:1px solid #e2e8f0;border-radius:10px;background:#f8f9fb;color:#41464e;cursor:pointer}.collapsed-status-stack button:hover{border-color:#bacefd;background:#f0f4ff;color:#245bdb}.collapsed-status-stack span{writing-mode:vertical-rl;color:inherit;font-size:11px;font-weight:800;letter-spacing:0}.collapsed-status-stack strong{min-width:22px;height:20px;display:grid;place-items:center;border-radius:999px;background:#fff;color:#245bdb;font-size:11px}.center-tabs{display:flex;align-items:center;justify-content:space-between;gap:12px}.center-tab-buttons{display:flex;align-items:center;gap:14px;min-width:0}.center-tabs .fullscreen-toggle{margin-left:auto;min-height:30px;padding:0 10px;border:1px solid #d6e1ef;border-radius:9px;background:#fff;color:#41464e;font-size:12px;font-weight:800}.center-tabs .fullscreen-toggle:hover{border-color:#82a7fc;background:#f0f4ff;color:#245bdb}.execution-panel.detail-fullscreen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:150;width:100vw;height:100dvh;border:0;border-radius:0;background:#eef3f8;box-shadow:none}.execution-panel.detail-fullscreen .task-hero{margin:12px 12px 0;border-radius:12px}.execution-panel.detail-fullscreen .center-tabs{padding:0 12px}.execution-panel.detail-fullscreen .center-scroll{padding:10px 12px 12px;overflow:hidden}.execution-panel.detail-fullscreen .sop-flow-shell.inline-detail{border:1px solid #c9d8ee;border-radius:12px}.sop-flow-shell.inline-detail{display:grid;grid-template-columns:minmax(0,60%) minmax(360px,40%);gap:0;min-height:0;background:#f3f6fb}.sop-flow-shell.inline-detail .react-flow{min-width:0;border-right:1px solid #c9d8ee}.sop-node-inline-detail{min-width:0;min-height:0;display:flex;flex-direction:column;background:#fff;overflow:hidden}.sop-node-inline-detail>header{flex:0 0 auto;display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--jcai-border-soft);background:#f8f9fb}.sop-node-inline-detail>header span{display:block;color:#646a73;font-size:12px}.sop-node-inline-detail>header strong{color:#1f2329}.sop-node-inline-detail .node-detail{flex:1 1 auto;min-height:0;height:auto!important;max-height:none!important;overflow-y:auto!important;overflow-x:hidden;padding:12px 12px 28px;scrollbar-gutter:stable}.sop-node-inline-detail .sop-node-detail{display:flex;flex-direction:column;gap:10px}.sop-node-inline-detail .sop-section{flex:0 0 auto;min-height:auto}.sop-node-inline-detail .sop-section-body{max-height:none!important;overflow:visible!important}.sop-node-inline-detail .step-console{max-height:none;overflow:visible}.step-output-detail{display:grid;gap:10px;width:100%}.step-output-detail>section{display:grid;gap:8px;border:1px solid #dee0e3;border-radius:10px;background:#f8f9fb;padding:10px}.step-output-detail>section>strong{color:#41464e;font-size:12px;font-weight:800}.step-result-summary{display:grid;gap:8px;border-color:#bacefd;background:#f8fbff}.step-result-summary>strong{color:#1f2329;font-size:13px;line-height:1.5}.step-result-summary ul{display:grid;gap:6px;margin:0;padding:0;list-style:none}.step-result-summary li{position:relative;padding-left:18px;color:#41464e;font-size:13px;line-height:1.55}.step-result-summary li:before{content:"";position:absolute;left:3px;top:9px;width:6px;height:6px;border-radius:999px;background:#3370ff}@media(max-width:1280px){.workspace{--jcai-ai-chat-width: calc(300px + 10vw) ;grid-template-columns:270px minmax(500px,1fr) var(--jcai-ai-chat-width)}.workspace.left-collapsed{grid-template-columns:52px minmax(650px,1fr) var(--jcai-ai-chat-width)}.workspace.chat-collapsed{grid-template-columns:270px minmax(700px,1fr) 52px}.workspace.left-collapsed.chat-collapsed{grid-template-columns:52px minmax(840px,1fr) 52px}}.right-chat.copilot-chat{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;padding-bottom:0;overflow:hidden;background:#fbfbfc;border-color:#d8e2f1}.copilot-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid #edf1f6;background:#fff}.copilot-agent{min-width:0;display:flex;align-items:center;gap:10px}.copilot-avatar,.copilot-mini-avatar{flex:0 0 auto;display:grid;place-items:center;background:linear-gradient(135deg,#2f6fed,#5a8bf0);color:#fff}.copilot-avatar{width:42px;height:42px;border-radius:10px}.copilot-mini-avatar{width:28px;height:28px;border-radius:8px}.copilot-agent h2{margin:0;color:#1f2329;font-size:18px;line-height:1.2}.copilot-agent p{display:flex;align-items:center;gap:6px;margin:3px 0 0;color:#646a73;font-size:12px;line-height:1.35}.copilot-agent p span{width:7px;height:7px;border-radius:999px;background:#16a34a}.copilot-agent-status.thinking span{background:#f59e0b;box-shadow:0 0 0 3px #f59e0b24}.copilot-agent-status.running span{background:#3370ff;box-shadow:0 0 0 3px #3370ff21}.copilot-agent-status.idle span{background:#16a34a;box-shadow:0 0 0 3px #16a34a1f}.copilot-quick{display:flex;flex-wrap:wrap;gap:7px;padding:10px 14px;border-bottom:1px solid #edf1f6;background:#f8fbff}.copilot-quick button,.copilot-draft-card button,.copilot-action-card button,.copilot-feedback-card button{min-height:30px;display:inline-flex;align-items:center;justify-content:center;gap:5px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e;padding:5px 9px;font-size:12px}.copilot-stream{min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:14px;padding:14px;background:#fbfbfc}.copilot-msg{display:flex;gap:9px;max-width:100%}.copilot-sent-message{order:90}.copilot-msg>div:last-child{min-width:0;max-width:88%;display:flex;flex-direction:column}.copilot-msg.user,.copilot-msg.human{flex-direction:row-reverse}.copilot-msg.user>div:last-child,.copilot-msg.human>div:last-child{align-items:flex-end}.copilot-msg.system{justify-content:center}.copilot-bubble{border:1px solid #e5e9f0;border-radius:3px 11px 11px;background:#fff;color:#1f2937;padding:10px 12px;font-size:13px;line-height:1.58;white-space:pre-wrap;word-break:break-word;box-shadow:0 1px 2px #1f23290a}.copilot-msg.user .copilot-bubble,.copilot-msg.human .copilot-bubble{border-color:#2f6fed;border-top-left-radius:11px;border-top-right-radius:3px;background:#2f6fed;color:#fff}.copilot-msg.system .copilot-bubble{border:0;border-radius:999px;background:#f0f2f5;color:#646a73;font-size:12px}.copilot-msg time{margin-top:5px;color:#a0a7b3;font-size:11px}.copilot-email-avatar{flex:0 0 auto;width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:#eef1f5;font-size:15px}.copilot-email-card,.copilot-draft-card,.copilot-action-card,.copilot-feedback-card{border:1px solid #e3e8f0;border-radius:12px;background:#fff;padding:12px 14px;box-shadow:0 1px 2px #1f23290a}.copilot-email-card header,.copilot-draft-card header,.copilot-action-card header,.copilot-feedback-card header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.copilot-email-card header strong,.copilot-draft-card header strong,.copilot-action-card header strong,.copilot-feedback-card header strong{min-width:0;flex:1;color:#4b5563;font-size:13px;line-height:1.35}.copilot-email-card header span,.copilot-draft-card header span,.copilot-action-card header span,.copilot-feedback-card header span{flex:0 0 auto;border-radius:999px;background:#f1f5f9;color:#646a73;padding:2px 8px;font-size:11px;font-weight:750}.copilot-email-card h3,.copilot-draft-card h3{margin:0 0 10px;color:#1f2937;font-size:15px;line-height:1.42}.copilot-email-card section,.copilot-draft-card section{display:grid;gap:5px;margin-top:10px}.copilot-email-card section+section,.copilot-draft-card section label+p+label{padding-top:9px;border-top:1px dashed #e6ebf2}.copilot-email-card label,.copilot-draft-card label{color:#9aa3af;font-size:12px}.copilot-email-card p,.copilot-draft-card p,.copilot-action-card p,.copilot-feedback-card p{margin:0;color:#4b5563;font-size:13px;line-height:1.62;white-space:pre-wrap}.copilot-draft-card{border-color:#f0d7a8;background:#fffaf0}.copilot-msg.draft.sent .copilot-draft-card{border-color:#c7d7f2;background:#f3f7ff}.copilot-draft-card header span,.copilot-action-card.pending header span,.copilot-feedback-card header span{background:#fbefd6;color:#b26a00}.copilot-action-card.approved header span,.copilot-msg.draft.sent .copilot-draft-card header span{background:#e7f6ed;color:#15803d}.copilot-action-card.rejected header span{background:#fff1f2;color:#be123c}.draft-lead{margin-bottom:8px!important;color:#6b7280!important}.copilot-draft-card footer,.copilot-action-card footer,.copilot-feedback-card footer{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:12px}.copilot-draft-card button.primary,.copilot-action-card button.primary,.copilot-feedback-card button.primary,.copilot-send-row button{border-color:#2f6fed;background:#2f6fed;color:#fff}.copilot-draft-card button.danger,.copilot-action-card button.danger{border-color:#fecaca;background:#fff1f2;color:#be123c}.copilot-card-result{color:#15803d;font-size:12px;font-weight:750}.copilot-edit-box,.copilot-feedback-card textarea,.copilot-input-area textarea{width:100%;border:1px solid #dee0e3;border-radius:9px;background:#fff;color:#111827;padding:9px 10px;font-family:inherit;font-size:13px;line-height:1.55;outline:none;resize:vertical}.copilot-edit-box{min-height:130px}.copilot-feedback-card{border-color:#fdba74;background:#fff7ed}.copilot-feedback-card.approved{border-color:#a7f3d0;background:#f0fdf4}.copilot-feedback-card.rejected{border-color:#dee0e3;background:#f8f9fb}.copilot-feedback-card textarea{min-height:84px;margin-top:10px;border-color:#fed7aa;background:#fffaf4}.copilot-feedback-file,.copilot-feedback-notice{margin-top:9px;border-radius:9px;padding:8px 10px;font-size:12px;line-height:1.45}.copilot-feedback-file{display:flex;align-items:center;gap:7px;border:1px solid #bacefd;background:#f0f4ff;color:#245bdb;font-weight:750}.copilot-feedback-notice{border:1px solid #fed7aa;background:#fff7ed;color:#b45309}.copilot-inline-editor{display:grid;gap:8px;margin-top:10px}.copilot-inline-editor textarea{width:100%;min-height:72px;border:1px solid #fed7aa;border-radius:9px;background:#fffaf4;color:#111827;padding:9px 10px;font-family:inherit;font-size:13px;line-height:1.55;resize:vertical;outline:none}.copilot-inline-editor button{justify-self:end}.copilot-input-area{display:grid;gap:9px;padding:12px;border-top:1px solid #edf1f6;background:#fff}.copilot-context,.copilot-empty-context{border:1px solid #e1eaff;border-radius:10px;background:#f8fbff;padding:7px 9px}.copilot-context-agent-row{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}.copilot-context{display:grid;grid-template-columns:minmax(0,1fr) 24px;gap:6px;align-items:center}.copilot-context span,.copilot-empty-context{color:#3370ff;font-size:12px;font-weight:750}.copilot-context strong{display:block;overflow:hidden;color:#1f2329;font-size:13px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.copilot-context p{margin:3px 0 0;overflow:hidden;color:#646a73;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.copilot-context button{width:24px;height:24px;display:grid;place-items:center;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#646a73}.copilot-context>div{min-width:0}.copilot-context>div>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.copilot-input-area>textarea{min-height:54px;max-height:150px;resize:vertical}.copilot-send-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.copilot-send-row span{color:#a0a7b3;font-size:12px}.copilot-send-row button{min-height:36px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:0;border-radius:9px;padding:0 13px;font-size:13px}.copilot-send-row button:disabled{background:#a9bbef;cursor:not-allowed}.copilot-case-stack{width:100%;display:grid;gap:10px}.copilot-case-heading{width:min(88%,100%);justify-self:start;display:grid;gap:2px;padding:0 2px}.copilot-case-heading span{color:#646a73;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.copilot-case-heading strong{color:#1f2329;font-size:13px}.copilot-case-card{width:min(88%,100%);justify-self:start;border:1px solid #dee0e3;border-radius:12px;background:#fff;padding:12px;box-shadow:0 1px 2px #1f23290a}.copilot-case-card.approval{border-color:#fed7aa;background:#fffaf2}.copilot-case-card.fill{border-color:#bacefd;background:#f8fbff}.copilot-case-card.upload{border-color:#d8d5ff;background:#fbfaff}.copilot-case-card.intervention{border-color:#bbf7d0;background:#f7fef9}.copilot-case-card.approved,.copilot-case-card.submitted,.copilot-case-card.uploaded,.copilot-case-card.rerun{border-color:#a7f3d0;background:#f0fdf4}.copilot-case-card.rejected{border-color:#fecaca;background:#fff1f2}.copilot-case-card header{display:grid;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:8px;margin-bottom:8px}.copilot-case-card header svg{color:#3370ff}.copilot-case-card.approval header svg{color:#b45309}.copilot-case-card.upload header svg{color:#6d5bd0}.copilot-case-card.intervention header svg{color:#15803d}.copilot-case-card header strong{min-width:0;color:#1f2329;font-size:13px;line-height:1.35}.copilot-case-card header span{border-radius:999px;background:#f1f5f9;color:#565c66;padding:2px 8px;font-size:11px;font-weight:800}.copilot-case-card.pending header span{background:#fff7ed;color:#b45309}.copilot-case-card.approved header span,.copilot-case-card.submitted header span,.copilot-case-card.uploaded header span,.copilot-case-card.rerun header span{background:#dcfce7;color:#15803d}.copilot-case-card.rejected header span{background:#ffe4e6;color:#be123c}.copilot-case-card p{margin:0;color:#565c66;font-size:13px;line-height:1.58}.copilot-case-card footer{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:11px}.copilot-case-card button,.copilot-file-trigger{min-height:30px;display:inline-flex;align-items:center;justify-content:center;gap:5px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e;padding:5px 9px;font-size:12px;cursor:pointer}.copilot-case-card button.primary{border-color:#3370ff;background:#3370ff;color:#fff}.copilot-case-card button.danger{border-color:#fecaca;background:#fff1f2;color:#be123c}.copilot-case-fields{display:grid;gap:8px;margin-top:10px}.copilot-case-fields label{display:grid;gap:5px}.copilot-case-fields label span{color:#646a73;font-size:12px;font-weight:750}.copilot-case-fields input,.copilot-case-card textarea{width:100%;border:1px solid #dee0e3;border-radius:9px;background:#fff;color:#1f2329;padding:8px 9px;font-family:inherit;font-size:13px;line-height:1.45;outline:none}.copilot-case-card textarea{min-height:82px;margin-top:10px;resize:vertical}.copilot-file-list{display:grid;gap:7px;margin-top:10px}.copilot-file-list button{justify-content:flex-start;width:100%;min-width:0;background:#ffffffbd}.copilot-hidden-file{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;clip-path:inset(50%)}.copilot-case-result{margin-top:10px;border:1px solid #bbf7d0;border-radius:9px;background:#f0fdf4;color:#166534;padding:8px 10px;font-size:12px;font-weight:750;line-height:1.5}.copilot-case-human-reply{max-width:78%;justify-self:end;display:grid;gap:5px}.copilot-case-human-reply>div{border:1px solid #2f6fed;border-radius:11px 3px 11px 11px;background:#2f6fed;color:#fff;padding:10px 12px;font-size:13px;line-height:1.58;white-space:pre-wrap;word-break:break-word}.copilot-case-human-reply time{justify-self:end;color:#a0a7b3;font-size:11px}.workspace{--jcai-ai-chat-width: clamp(500px, 31vw, 680px);grid-template-columns:300px minmax(540px,1fr) var(--jcai-ai-chat-width);gap:0;column-gap:0;overflow:hidden}.workspace.left-collapsed{grid-template-columns:52px minmax(620px,1fr) var(--jcai-ai-chat-width)}.execution-panel{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden;padding:0}.execution-panel .task-hero{min-height:0;padding:12px 14px;grid-template-columns:minmax(0,1fr);gap:12px}.execution-panel .hero-main{min-width:0}.execution-panel .hero-kicker{gap:6px;margin-bottom:6px}.execution-panel .hero-kicker em,.execution-panel .hero-kicker span,.execution-panel .hero-kicker .sop-type-tag{font-size:11px}.execution-panel .hero-main h2{margin:0 0 4px;font-size:20px;line-height:1.18;letter-spacing:0}.execution-panel .hero-main p{max-width:none;margin:0;color:#646a73;font-size:12px;line-height:1.35;white-space:normal;overflow:visible;text-overflow:clip}.execution-panel .hero-actions{display:none!important}.execution-panel .hero-actions>.primary-action,.execution-panel .hero-actions>.secondary-action{display:none!important}.hero-control-row{width:230px;gap:6px}.hero-control-row .control-field{min-height:34px;height:34px;padding:0;border-radius:8px}.hero-control-row .control-field>span{display:none}.hero-control-row .control-field svg{width:14px;height:14px}.hero-control-row .control-field select{min-height:32px;height:32px;font-size:12px}.center-tabs{min-height:42px;padding:0 12px}.center-tab-buttons button{height:40px;padding:0 10px;font-size:13px}.fullscreen-toggle{height:34px;padding:0 10px}.execution-panel .center-scroll{overflow-y:auto;overflow-x:hidden}.current-execution.current-node-work{min-height:100%;padding:8px 12px 16px;display:block;background:#f6f8fb}.current-work-notice{display:flex;align-items:center;gap:8px;margin-bottom:10px;padding:9px 11px;border:1px solid #fed7aa;border-radius:10px;background:#fffaf2;color:#9a3412;font-size:12px;line-height:1.4}.current-node-work .sop-node-detail{gap:8px;padding:0;background:transparent}.current-node-work .node-detail,.current-node-work .sop-node-detail{height:auto!important;max-height:none!important;overflow:visible!important;scrollbar-gutter:auto!important}.current-node-work .node-toolbar{min-height:0;padding:11px 12px;border-radius:10px;box-shadow:0 8px 20px #1f23290a}.current-node-work .node-toolbar span{font-size:11px}.current-node-work .node-toolbar strong{margin-top:2px;font-size:18px;line-height:1.22}.current-node-work .node-goal-summary{margin-top:3px;font-size:12px;line-height:1.4}.current-node-work .node-toolbar-actions .ghost-action{height:30px;padding:0 9px;font-size:12px}.current-node-work .sop-section{border-radius:10px;box-shadow:none}.current-node-work .sop-section-head{min-height:36px;height:36px;padding:0 10px}.current-node-work .sop-section-head span,.current-node-work .sop-section-title,.current-node-work .section-title{font-size:14px}.current-node-work .sop-section-body{gap:8px;padding:10px}.current-node-work .step-console{padding:10px}.current-node-work .step-console-head{margin-bottom:9px}.current-node-work .step-console-head strong{font-size:14px}.current-node-work .step-console-head button{height:30px;padding:0 9px;font-size:12px}.current-node-work .process-step{border-radius:10px;background:#fff}.current-node-work .process-step.active,.current-node-work .process-step.waiting,.current-node-work .process-step.feedback-needed{border-color:#fdba74;background:#fffaf2}.current-node-work .process-step.done{background:#f8f9fb}.current-node-work .process-step-head{min-height:48px;padding:8px 10px}.current-node-work .process-step-head>span:first-child{width:28px;height:28px;font-size:13px}.current-node-work .process-step-head strong{font-size:14px}.current-node-work .process-step-head p{margin-top:2px;font-size:12px;line-height:1.35}.current-node-work .step-expanded{margin-left:10px!important;padding:0 0 10px;border-left:0!important}.current-node-work .process-step:before,.current-node-work .step-expanded:before{display:none!important}.current-node-work .step-result-panel,.current-node-work .step-result-feedback{border-width:1px!important;border-radius:10px}.current-node-work .validation-checklist,.current-node-work .node-output-summary,.current-node-work .ai-rule-list{margin-top:0}.artifact-strip{display:none!important}.sop-type-tag{display:inline-flex;align-items:center;max-width:360px;padding:2px 8px;border:1px solid #c8d7f3;border-radius:999px;background:#f4f8ff;color:#1c4cba;font-size:12px;font-weight:700;line-height:1.4}.execution-panel.detail-fullscreen .task-hero{display:none}.execution-topline{min-height:48px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;padding:4px 10px;border:1px solid #d7e1ef;border-top:3px solid #3370ff;border-radius:12px 12px 0 0;background:#fff}.compact-task-line{min-width:0;display:flex;align-items:center;gap:5px;flex-wrap:nowrap;overflow:visible;white-space:normal}.compact-task-line>span,.compact-task-line>em{flex:0 0 auto;color:#646a73;font-size:11px;font-style:normal}.compact-task-line>em{display:none}.compact-task-line>strong{flex:1 1 auto;min-width:0;overflow:visible;color:#111827;font-size:14px;font-weight:800;line-height:1.18;text-overflow:clip;white-space:normal}.execution-topline .sop-type-tag{flex:0 0 auto;max-width:210px;font-size:10px}.execution-topline .center-tabs{min-height:0;padding:0;display:flex;align-items:center;justify-content:flex-end;gap:8px;border:0}.execution-topline .center-tab-buttons{display:flex;align-items:center;gap:4px}.execution-topline .center-tab-buttons button{height:32px;padding:0 7px;font-size:12px;white-space:nowrap}.execution-topline .fullscreen-toggle{display:none!important}.current-node-work{padding-top:7px!important}.current-node-work .current-work-notice,.current-node-work .node-goal-summary{display:none!important}.current-node-work .node-toolbar{padding:7px 10px}.current-node-work .node-toolbar strong{font-size:15px}.current-node-work .node-toolbar-actions,.current-node-work .step-console-head{display:none!important}.focus-task-context{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 8px;align-items:center;margin-bottom:4px;padding:7px 9px;border:1px solid #dbe5f2;border-radius:10px;background:#fff}.focus-task-context>div:first-child{min-width:0;display:grid;gap:2px}.focus-task-context span{color:#646a73;font-size:11px;font-weight:800}.focus-task-context strong{overflow:visible;color:#1f2329;font-size:14px;line-height:1.2;text-overflow:clip;white-space:normal}.focus-task-context p{grid-column:1 / -1;overflow:hidden;color:#646a73;font-size:11px;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}.focus-task-context .focus-source-line{display:flex;gap:6px;align-items:center;color:#565c66}.focus-task-context .focus-source-line b{flex:0 0 auto;color:#646a73;font-size:11px}.focus-task-context>div:last-child{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.focus-task-context>div:last-child span{border-radius:999px;background:#eef4ff;color:#3370ff;padding:3px 7px}.todo-flow-bookend{display:grid;gap:3px;min-width:0;padding:8px 10px;border:1px solid #dbe5f2;border-radius:9px;background:#fbfdff}.todo-flow-bookend.source{margin-bottom:8px}.todo-flow-bookend.next{margin-top:8px}.todo-flow-bookend span{color:#646a73;font-size:11px;font-weight:900}.todo-flow-bookend strong{min-width:0;overflow:hidden;color:#172033;font-size:13px;text-overflow:ellipsis;white-space:nowrap}.todo-flow-bookend p{min-width:0;margin:0;color:#646a73;font-size:12px;line-height:1.35}.focus-input-panel .node-input-brief{display:none!important}.focus-input-panel .compact-input-list{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}.focus-input-panel .compact-input-list>div:first-child{display:grid;gap:6px}.focus-input-panel .compact-input-list>div:first-child>span{color:#646a73;font-size:12px;font-weight:800}.compact-input-context{margin-top:2px;border:1px dashed #d8e1ef;border-radius:8px;background:#fbfdff}.compact-input-context>summary{cursor:pointer;padding:8px 10px;color:#646a73;font-size:12px;font-weight:800}.compact-input-context>div{display:grid;gap:6px;padding:0 10px 10px}.focus-outcome-summary{display:grid;gap:10px;margin-top:8px;padding:10px;border:1px solid #dbe5f2;border-radius:10px;background:#fff}.focus-final-output{display:grid;gap:7px;padding:9px 10px;border:1px solid #bacefd;border-radius:9px;background:#f8fbff}.focus-final-output span{color:#3370ff;font-size:12px;font-weight:900}.markdown-like-output article{display:grid;gap:3px}.markdown-like-output article+article{padding-top:7px;border-top:1px dashed #d7e3f4}.markdown-like-output p{margin:0;color:#41464e;font-size:12px;line-height:1.55;white-space:pre-line}.final-output-body{display:flex;flex-wrap:wrap;gap:6px 8px}.final-output-body p{width:100%}.final-output-table-block{width:100%;display:grid;gap:5px}.final-output-table-block>b{color:#1e3a8a;font-size:12px}.final-output-table-block>div{max-width:100%;overflow-x:auto;border:1px solid #dbe5f2;border-radius:8px;background:#fff}.final-output-table-block table{width:100%;min-width:640px;border-collapse:collapse;font-size:11px;line-height:1.35}.final-output-table-block th,.final-output-table-block td{padding:7px 8px;border-bottom:1px solid #e7eef8;color:#41464e;text-align:left;vertical-align:top;white-space:nowrap}.final-output-table-block th{background:#f3f7fc;color:#646a73;font-weight:850}.final-output-table-block tr:last-child td{border-bottom:0}.final-output-body button{min-height:28px;display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border:1px solid #b8cdfd;border-radius:8px;background:#fff;color:#3370ff;font-size:12px;font-weight:850;cursor:pointer}.final-output-body button:hover{background:#f0f4ff}.todo-flow-bookend.next>span:not(.next-task-label){display:none}.focus-outcome-summary section{display:grid;gap:8px}.focus-outcome-summary header{display:flex;align-items:center;justify-content:space-between;gap:10px}.focus-outcome-summary header strong{color:#172033;font-size:14px}.focus-outcome-summary header button,.focus-validation-list article button{height:28px;padding:0 9px;border:1px solid #c8d7f3;border-radius:8px;background:#f8fbff;color:#3370ff;font-size:12px;font-weight:800}.focus-outcome-summary>section>p{margin:0;color:#565c66;font-size:12px;line-height:1.45}.focus-validation-list{display:grid;gap:6px}.focus-validation-list article{min-height:34px;display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:8px;padding:7px 9px;border:1px solid #dbe5f2;border-radius:8px;background:#f8f9fb}.focus-validation-list article.passed{border-color:#bbf7d0;background:#f0fdf4}.focus-validation-list article.failed,.focus-validation-list article.warning{border-color:#fed7aa;background:#fff7ed}.focus-validation-list article>span{width:22px;height:22px;display:grid;place-items:center;border-radius:999px;background:#eaf3ff;color:#3370ff;font-size:12px;font-weight:800}.focus-validation-list article p,.focus-rule-summary article p{min-width:0;margin:0;color:#565c66;font-size:12px;line-height:1.4}.focus-rule-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.focus-rule-summary article{display:grid;gap:4px;padding:9px;border:1px solid #fde68a;border-radius:8px;background:#fffbeb}.focus-rule-summary article.decided.accepted{border-color:#bbf7d0;background:#f0fdf4}.focus-rule-summary article.decided.ignored{border-color:#dee0e3;background:#f8f9fb}.focus-rule-summary article strong{color:#172033;font-size:13px}.focus-rule-summary article span{width:max-content;padding:2px 6px;border-radius:999px;background:#fef3c7;color:#b45309;font-size:11px;font-weight:800}.focus-rule-summary article div{display:flex;gap:6px;margin-top:4px}.focus-rule-summary article button{height:26px;padding:0 9px;border:1px solid #dee0e3;border-radius:7px;background:#fff;color:#41464e;font-size:12px;font-weight:800}.focus-rule-summary article button:first-child{border-color:#86efac;color:#15803d}.focus-rule-summary article em,.focus-rule-pending{color:#646a73;font-size:12px;font-style:normal;line-height:1.4}.focus-rule-pending{border:1px dashed #dee0e3;border-radius:8px;background:#f8f9fb;padding:10px}.step-ai-trace{display:grid;gap:7px;margin-bottom:10px;padding:10px 11px;border:1px solid #e1eaff;border-radius:10px;background:linear-gradient(180deg,#f8fbff,#fff)}.step-ai-trace header{display:flex;align-items:center;gap:7px}.step-ai-trace header strong{flex:1;color:#172033;font-size:13px}.step-ai-trace header span{border-radius:999px;background:#f0f4ff;color:#3370ff;padding:2px 7px;font-size:11px;font-weight:900}.step-ai-trace ol{display:grid;gap:6px;margin:0;padding:0;list-style:none}.step-ai-trace li{min-width:0;display:grid;grid-template-columns:40px minmax(0,1fr);gap:10px;align-items:start;padding:8px 0;border-top:1px solid #e8eef7}.step-ai-trace li:first-child{border-top:0;padding-top:0}.step-ai-trace li>span{display:inline-flex;justify-content:center;align-items:center;min-width:32px;height:22px;border-radius:999px;background:#eef4ff;color:#3370ff;font-size:10px;font-weight:900}.step-ai-trace li.tool>span{background:#ecfdf5;color:#047857}.step-ai-trace li.system>span{background:#f1f5f9;color:#565c66}.step-ai-trace li.warning>span,.step-ai-trace li.feedback>span{background:#fff7ed;color:#c2410c}.step-ai-trace li strong{display:inline;color:#172033;font-size:12px;line-height:1.3}.step-ai-trace li em{margin-left:8px;color:#8f959e;font-size:11px;font-style:normal}.step-ai-trace li p{margin:2px 0 0;color:#41464e;font-size:12px;line-height:1.45;white-space:pre-line}.step-waiting-feedback-stack{display:grid;gap:10px}.step-waiting-feedback-stack .step-ai-trace{margin-bottom:0;border-color:#fed7aa;background:linear-gradient(180deg,#fffaf2,#fff)}.risk-level-selector{display:grid;gap:8px;margin-top:10px}.risk-level-selector>span{color:#9a3412;font-size:12px;font-weight:900}.risk-level-selector>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.risk-level-selector button{min-height:76px;display:grid;gap:4px;padding:10px 11px;border:1px solid #fed7aa;border-radius:10px;background:#fff;color:#41464e;text-align:left;cursor:pointer}.risk-level-selector button:hover,.risk-level-selector button.selected{border-color:#f97316;background:#fff7ed;box-shadow:inset 0 0 0 1px #f97316}.risk-level-selector strong{color:#172033;font-size:13px}.risk-level-selector p{margin:0;color:#646a73;font-size:12px;line-height:1.4}.sop-ai-feedback-actions.risk-actions .primary:disabled{opacity:.45;cursor:not-allowed}.step-pending-placeholder{min-height:48px;display:flex;align-items:center;padding:12px 14px;border:1px dashed #dee0e3;border-radius:10px;background:#f8f9fb;color:#646a73;font-size:13px;font-weight:850}.task-create-menu{position:relative;display:inline-flex}.task-create-dropdown{position:absolute;top:calc(100% + 8px);right:0;z-index:80;width:218px;display:grid;gap:4px;padding:6px;border:1px solid #dee0e3;border-radius:12px;background:#fff;box-shadow:0 16px 34px #1f232929}.task-create-dropdown button{width:100%;display:grid;gap:2px;padding:9px 10px;border:0;border-radius:9px;background:transparent;text-align:left;cursor:pointer}.task-create-dropdown button:hover{background:#f6f8fb}.task-create-dropdown strong{color:#172033;font-size:13px;line-height:1.3}.task-create-dropdown span{color:#646a73;font-size:11px;line-height:1.35}.task-card.non-sop{background:linear-gradient(180deg,#fff7ed,#fff 70%)}.task-card.non-sop .task-card-top .status-pill:first-child{border-color:#fed7aa;color:#9a3412;background:#fff7ed}.execution-panel.non-sop-mode .execution-topline{min-height:54px}.non-sop-workbench{display:grid;gap:12px;padding:14px}.non-sop-hero,.non-sop-grid article,.non-sop-open-work{border:1px solid #dee0e3;border-radius:14px;background:#fff;box-shadow:0 10px 24px #1f23290d}.non-sop-hero{display:flex;justify-content:space-between;gap:16px;padding:16px 18px;border-top:4px solid #f97316}.non-sop-kicker{display:inline-flex;align-items:center;gap:6px;color:#9a3412;font-size:12px;font-weight:850}.non-sop-hero h2{margin:6px 0 4px;color:#101827;font-size:22px;line-height:1.25}.non-sop-hero p,.non-sop-grid p,.non-sop-thread p{margin:0;color:#5f6b82;line-height:1.55}.non-sop-state{min-width:130px;display:grid;align-content:center;gap:4px;padding:10px 12px;border-radius:12px;background:#fff7ed;color:#9a3412;text-align:right}.non-sop-state strong{font-size:16px}.non-sop-state span{color:#646a73;font-size:12px}.non-sop-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}.non-sop-grid article,.non-sop-open-work{padding:14px 16px}.non-sop-grid h3,.non-sop-open-work h3{display:flex;align-items:center;gap:7px;margin:0 0 10px;color:#172033;font-size:15px}.non-sop-grid dl{display:grid;gap:8px;margin:12px 0 0}.non-sop-grid dl div{display:grid;grid-template-columns:72px minmax(0,1fr);gap:8px;padding:8px 0;border-top:1px solid #edf2f7}.non-sop-grid dt{color:#646a73;font-weight:800}.non-sop-grid dd{margin:0;color:#172033;font-weight:750}.non-sop-grid ul{display:grid;gap:8px;margin:12px 0 0;padding-left:18px;color:#41464e}.non-sop-thread{display:grid;gap:8px}.non-sop-thread>div{padding:11px 12px;border:1px solid #e3eaf3;border-radius:11px;background:#f8f9fb}.non-sop-thread strong{display:block;margin-bottom:4px;color:#1f3b8f}.non-sop-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;padding-top:12px;border-top:1px dashed #dee0e3}.non-sop-actions button{display:inline-flex;align-items:center;gap:6px;border:1px solid #d6dfeb;border-radius:10px;background:#fff;color:#172033;padding:8px 11px;font-weight:800;cursor:pointer}.non-sop-actions button.primary{border-color:#3370ff;background:#3370ff;color:#fff}.step-inline-validation{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.step-inline-validation span{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:3px 8px;font-size:11px;font-weight:850}.step-inline-validation .passed{background:#ecfdf5;color:#047857}.step-inline-validation .pending{background:#f1f5f9;color:#646a73}.visible-task-detail .visibility-banner{display:flex;gap:10px;align-items:flex-start;margin-bottom:12px;padding:12px;border:1px solid #bacefd;border-radius:10px;background:#f8fbff}.visible-task-detail .visibility-banner strong{color:#172033;font-size:14px}.visible-task-detail .visibility-banner p{margin-top:3px;color:#646a73;font-size:12px;line-height:1.45}.copilot-workbench-actions{display:grid;gap:10px}.copilot-action-card.done,.copilot-action-card.approved{border-color:#bbf7d0;background:#f0fdf4}.copilot-action-card.rejected{border-color:#fecaca;background:#fff1f2}.copilot-action-card.done header span{background:#dcfce7;color:#15803d}.copilot-action-card.rejected header span{background:#ffe4e6;color:#be123c}.copilot-action-card.supplement textarea,.copilot-action-card.intervention textarea{display:block;width:100%;min-height:88px;margin-top:10px;padding:10px 12px;border:1px solid #dee0e3;border-radius:10px;border-color:#dee0e3;background:#fff;color:#172033;font-size:13px;line-height:1.5;resize:vertical}.copilot-action-card.supplement footer,.copilot-action-card.intervention footer{width:100%;align-items:center;justify-content:flex-end}.copilot-card-guide{margin-top:10px;padding:10px 12px;border:1px dashed #cbd5e1;border-radius:10px;background:#f8f9fb;color:#646a73;font-size:13px;line-height:1.55}.copilot-expert-row{display:flex;gap:8px;align-items:center;flex:0 0 auto;min-width:210px;max-width:46%}.copilot-expert-row span{color:#646a73;font-size:12px;font-weight:800;white-space:nowrap}.copilot-expert-row select{height:34px;width:170px;min-width:150px;border:1px solid #dee0e3;border-radius:9px;background:#fff;color:#172033;padding:0 9px;font-size:13px}.copilot-context{padding:6px 8px}.copilot-context-agent-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.copilot-context-compact{min-width:0;max-width:52%;flex:1 1 auto}.copilot-context-compact strong{display:inline;color:inherit;font-size:inherit;line-height:inherit}.copilot-context span{font-size:12px}.copilot-stream{padding-bottom:18px}.copilot-demo-divider{align-self:center;max-width:88%;border-radius:999px;background:#eef2ff;color:#3b5bdb;padding:5px 10px;font-size:11px;font-weight:850}.copilot-demo-card{border:1px solid #dbe5f2;border-radius:12px;background:#fff;padding:12px;box-shadow:0 1px 2px #1f23290d}.copilot-demo-card.confirm,.copilot-demo-card.nonstandard{border-color:#fed7aa;background:#fff8ef}.copilot-demo-card.memory{border-color:#c7d2fe;background:#f7f8ff}.copilot-demo-card.done{border-color:#bbf7d0;background:#f4fdf7}.copilot-demo-card.rejected{border-color:#fecaca;background:#fff5f6}.copilot-demo-card header{display:flex;align-items:center;gap:8px;margin-bottom:9px}.copilot-demo-card header svg{color:#2f6fed}.copilot-demo-card.confirm header svg,.copilot-demo-card.nonstandard header svg{color:#c76a00}.copilot-demo-card header strong{min-width:0;flex:1;color:#172033;font-size:14px;line-height:1.35}.copilot-demo-card header span{flex:0 0 auto;border-radius:999px;background:#f0f4ff;color:#2f6fed;padding:2px 8px;font-size:11px;font-weight:850}.copilot-demo-card.confirm header span,.copilot-demo-card.nonstandard header span{background:#fbefd6;color:#b45309}.copilot-demo-card.done header span,.copilot-demo-card.done .copilot-card-result{background:transparent;color:#15803d}.copilot-demo-card.rejected header span,.copilot-demo-card.rejected .copilot-card-result{background:transparent;color:#be123c}.copilot-demo-card>p{margin:0;color:#565c66;font-size:13px;line-height:1.65}.copilot-report-sections{display:grid;gap:8px}.copilot-report-sections section{border:1px solid #e6edf7;border-radius:10px;background:#f8fbff;padding:8px 10px}.copilot-report-sections b{display:block;margin-bottom:3px;color:#41464e;font-size:12px}.copilot-report-sections p{margin:0;color:#172033;font-size:13px;line-height:1.55}.copilot-table-wrap{overflow-x:auto;border:1px solid #e6edf7;border-radius:10px}.copilot-mini-table{width:100%;min-width:420px;border-collapse:collapse;background:#fff;font-size:12px}.copilot-mini-table th,.copilot-mini-table td{border-bottom:1px solid #edf2f7;padding:7px 8px;text-align:left;vertical-align:top;color:#41464e}.copilot-mini-table th{background:#f8f9fb;color:#646a73;font-weight:850}.copilot-mini-table tr:last-child td{border-bottom:0}.copilot-tool-steps{display:grid;gap:7px;margin:0;padding:0;list-style:none}.copilot-tool-steps li{display:grid;grid-template-columns:26px minmax(0,1fr);gap:8px;align-items:flex-start;border:1px solid #e6edf7;border-radius:10px;background:#f8fbff;padding:8px}.copilot-tool-steps li.warn{border-color:#fed7aa;background:#fff8ef}.copilot-tool-steps li.danger{border-color:#fecaca;background:#fff5f6}.copilot-tool-steps li>span{display:grid;place-items:center;width:24px;height:24px;border-radius:999px;background:#eaf0ff;color:#2f6fed;font-size:12px;font-weight:900}.copilot-tool-steps b{color:#41464e;font-size:12px}.copilot-tool-steps p{margin:2px 0 0;color:#565c66;font-size:12px;line-height:1.45}.copilot-email-preview{display:grid;gap:8px;border:1px solid #f0d7a8;border-radius:11px;background:#fffaf0;padding:10px}.copilot-email-preview h3{margin:0;color:#172033;font-size:14px;line-height:1.4}.copilot-email-preview label{color:#9a6a21;font-size:11px;font-weight:850}.copilot-email-preview p{margin:0;color:#565c66;font-size:13px;line-height:1.55}.copilot-file-list{display:grid;gap:7px}.copilot-file-list button{width:100%;min-height:42px;display:grid;grid-template-columns:18px minmax(0,1fr);gap:8px;align-items:center;border:1px solid #e1eaff;border-radius:10px;background:#f8fbff;color:#245bdb;padding:8px 10px;text-align:left}.copilot-file-list b,.copilot-file-list small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.copilot-file-list b{color:#245bdb;font-size:12px}.copilot-file-list small{margin-top:2px;color:#646a73;font-size:11px}.copilot-memory-list{display:grid;gap:7px;margin:0;padding:0;list-style:none}.copilot-memory-list li{position:relative;border:1px solid #e0e7ff;border-radius:10px;background:#fff;padding:8px 10px 8px 24px;color:#565c66;font-size:12px;line-height:1.48}.copilot-memory-list li:before{position:absolute;left:10px;top:14px;width:6px;height:6px;border-radius:999px;background:#6366f1;content:""}.copilot-demo-card footer{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:12px}.copilot-demo-card button{min-height:30px;border:1px solid #dee0e3;border-radius:8px;background:#fff;color:#41464e;padding:5px 10px;font-size:12px;font-weight:750}.copilot-demo-card button.primary{border-color:#2f6fed;background:#2f6fed;color:#fff}.copilot-demo-card button.danger{border-color:#fecaca;background:#fff1f2;color:#be123c}.copilot-live-message{order:80}.execution-panel.detail-fullscreen .execution-topline{display:none}@media(max-width:1280px){.workspace{--jcai-ai-chat-width: clamp(460px, 35vw, 560px);grid-template-columns:270px minmax(460px,1fr) var(--jcai-ai-chat-width)}.workspace.left-collapsed{grid-template-columns:52px minmax(560px,1fr) var(--jcai-ai-chat-width)}}._3_ygE{display:table;border-bottom:#e6e4e4 1px solid;border-top:#e6e4e4 1px solid;border-left:#e6e4e4 1px solid}._1nBOt{display:table-row;list-style:none}._2eZzQ{border-right:1px solid rgb(196,196,196);opacity:1;margin-left:-2px}._WuQ0f{display:table-cell;vertical-align:-webkit-baseline-middle;vertical-align:middle}._3ZbQT{display:table;border-bottom:#e6e4e4 1px solid;border-left:#e6e4e4 1px solid}._34SS0{display:table-row;text-overflow:ellipsis}._34SS0:nth-of-type(2n){background-color:#f5f5f5}._3lLk3{display:table-cell;vertical-align:middle;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}._nI1Xw{display:flex}._2QjE6{color:#565656;font-size:.6rem;padding:.15rem .2rem 0rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer}._2TfEi{font-size:.6rem;padding-left:1rem;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}._3T42e{background:#fff;padding:12px;box-shadow:0 3px 6px #00000029,0 3px 6px #0000003b}._29NTg{font-size:12px;margin-bottom:6px;color:#666}._25P-K{position:absolute;display:flex;flex-shrink:0;pointer-events:none;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}._3gVAq{visibility:hidden;position:absolute;display:flex;pointer-events:none}._1eT-t{overflow:hidden auto;width:1rem;flex-shrink:0;scrollbar-width:thin}._1eT-t::-webkit-scrollbar{width:1.1rem;height:1.1rem}._1eT-t::-webkit-scrollbar-corner{background:transparent}._1eT-t::-webkit-scrollbar-thumb{border:6px solid transparent;background:#0003;background:var(--palette-black-alpha-20, rgba(0, 0, 0, .2));border-radius:10px;background-clip:padding-box}._1eT-t::-webkit-scrollbar-thumb:hover{border:4px solid transparent;background:#0000004d;background:var(--palette-black-alpha-30, rgba(0, 0, 0, .3));background-clip:padding-box}._2dZTy{fill:#fff}._2dZTy:nth-child(2n){fill:#f5f5f5}._3rUKi{stroke:#ebeff2}._RuwuK{stroke:#e6e4e4}._9w8d5{text-anchor:middle;fill:#333;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none}._1rLuZ{stroke:#e6e4e4}._2q1Kt{text-anchor:middle;fill:#555;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none}._35nLX{fill:#fff;stroke:#e0e0e0;stroke-width:1.4}._KxSXS{cursor:pointer;outline:none}._KxSXS:hover ._3w_5u{visibility:visible;opacity:1}._3w_5u{fill:#ddd;cursor:ew-resize;opacity:0;visibility:hidden}._31ERP{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;stroke-width:0}._RRr13{cursor:pointer;outline:none}._2P2B1{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}._1KJ6x{cursor:pointer;outline:none}._2RbVy{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;opacity:.6}._2pZMF{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}._3zRJQ{fill:#fff;text-anchor:middle;font-weight:lighter;dominant-baseline:central;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none}._3KcaM{fill:#555;text-anchor:start;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none}._CZjuD{overflow:hidden;font-size:0;margin:0;padding:0}._2B2zv{margin:0;padding:0;overflow:hidden}._3eULf{display:flex;padding:0;margin:0;list-style:none;outline:none;position:relative}._2k9Ys{overflow:auto;max-width:100%;scrollbar-width:thin;height:1.2rem}._2k9Ys::-webkit-scrollbar{width:1.1rem;height:1.1rem}._2k9Ys::-webkit-scrollbar-corner{background:transparent}._2k9Ys::-webkit-scrollbar-thumb{border:6px solid transparent;background:#0003;background:var(--palette-black-alpha-20, rgba(0, 0, 0, .2));border-radius:10px;background-clip:padding-box}._2k9Ys::-webkit-scrollbar-thumb:hover{border:4px solid transparent;background:#0000004d;background:var(--palette-black-alpha-30, rgba(0, 0, 0, .3));background-clip:padding-box}._19jgW{height:1px}.react-flow{direction:ltr;--xy-edge-stroke-default: #b1b1b7;--xy-edge-stroke-width-default: 1;--xy-edge-stroke-selected-default: #555;--xy-connectionline-stroke-default: #b1b1b7;--xy-connectionline-stroke-width-default: 1;--xy-attribution-background-color-default: rgba(255, 255, 255, .5);--xy-minimap-background-color-default: #fff;--xy-minimap-mask-background-color-default: rgba(240, 240, 240, .6);--xy-minimap-mask-stroke-color-default: transparent;--xy-minimap-mask-stroke-width-default: 1;--xy-minimap-node-background-color-default: #e2e2e2;--xy-minimap-node-stroke-color-default: transparent;--xy-minimap-node-stroke-width-default: 2;--xy-background-color-default: transparent;--xy-background-pattern-dots-color-default: #91919a;--xy-background-pattern-lines-color-default: #eee;--xy-background-pattern-cross-color-default: #e2e2e2;background-color:var(--xy-background-color, var(--xy-background-color-default));--xy-node-color-default: inherit;--xy-node-border-default: 1px solid #1a192b;--xy-node-background-color-default: #fff;--xy-node-group-background-color-default: rgba(240, 240, 240, .25);--xy-node-boxshadow-hover-default: 0 1px 4px 1px rgba(0, 0, 0, .08);--xy-node-boxshadow-selected-default: 0 0 0 .5px #1a192b;--xy-node-border-radius-default: 3px;--xy-handle-background-color-default: #1a192b;--xy-handle-border-color-default: #fff;--xy-selection-background-color-default: rgba(0, 89, 220, .08);--xy-selection-border-default: 1px dotted rgba(0, 89, 220, .8);--xy-controls-button-background-color-default: #fefefe;--xy-controls-button-background-color-hover-default: #f4f4f4;--xy-controls-button-color-default: inherit;--xy-controls-button-color-hover-default: inherit;--xy-controls-button-border-color-default: #eee;--xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, .08);--xy-edge-label-background-color-default: #ffffff;--xy-edge-label-color-default: inherit;--xy-resize-background-color-default: #3367d9}.react-flow.dark{--xy-edge-stroke-default: #3e3e3e;--xy-edge-stroke-width-default: 1;--xy-edge-stroke-selected-default: #727272;--xy-connectionline-stroke-default: #b1b1b7;--xy-connectionline-stroke-width-default: 1;--xy-attribution-background-color-default: rgba(150, 150, 150, .25);--xy-minimap-background-color-default: #141414;--xy-minimap-mask-background-color-default: rgba(60, 60, 60, .6);--xy-minimap-mask-stroke-color-default: transparent;--xy-minimap-mask-stroke-width-default: 1;--xy-minimap-node-background-color-default: #2b2b2b;--xy-minimap-node-stroke-color-default: transparent;--xy-minimap-node-stroke-width-default: 2;--xy-background-color-default: #141414;--xy-background-pattern-dots-color-default: #777;--xy-background-pattern-lines-color-default: #777;--xy-background-pattern-cross-color-default: #777;--xy-node-color-default: #f8f8f8;--xy-node-border-default: 1px solid #3c3c3c;--xy-node-background-color-default: #1e1e1e;--xy-node-group-background-color-default: rgba(240, 240, 240, .25);--xy-node-boxshadow-hover-default: 0 1px 4px 1px rgba(255, 255, 255, .08);--xy-node-boxshadow-selected-default: 0 0 0 .5px #999;--xy-handle-background-color-default: #bebebe;--xy-handle-border-color-default: #1e1e1e;--xy-selection-background-color-default: rgba(200, 200, 220, .08);--xy-selection-border-default: 1px dotted rgba(200, 200, 220, .8);--xy-controls-button-background-color-default: #2b2b2b;--xy-controls-button-background-color-hover-default: #3e3e3e;--xy-controls-button-color-default: #f8f8f8;--xy-controls-button-color-hover-default: #fff;--xy-controls-button-border-color-default: #5b5b5b;--xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, .08);--xy-edge-label-background-color-default: #141414;--xy-edge-label-color-default: #f8f8f8}.react-flow__background{background-color:var(--xy-background-color-props, var(--xy-background-color, var(--xy-background-color-default)));pointer-events:none;z-index:-1}.react-flow__container{position:absolute;width:100%;height:100%;top:0;left:0}.react-flow__pane{z-index:1;touch-action:none}.react-flow__pane.draggable{cursor:grab}.react-flow__pane.dragging{cursor:grabbing}.react-flow__pane.selection{cursor:pointer}.react-flow__viewport{transform-origin:0 0;z-index:2;pointer-events:none}.react-flow__renderer{z-index:4}.react-flow__selection{z-index:6}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible{outline:none}.react-flow__edge-path{stroke:var(--xy-edge-stroke, var(--xy-edge-stroke-default));stroke-width:var(--xy-edge-stroke-width, var(--xy-edge-stroke-width-default));fill:none}.react-flow__connection-path{stroke:var(--xy-connectionline-stroke, var(--xy-connectionline-stroke-default));stroke-width:var(--xy-connectionline-stroke-width, var(--xy-connectionline-stroke-width-default));fill:none}.react-flow .react-flow__edges{position:absolute}.react-flow .react-flow__edges svg{overflow:visible;position:absolute;pointer-events:none}.react-flow__edge{pointer-events:visibleStroke}.react-flow__edge.selectable{cursor:pointer}.react-flow__edge.animated path{stroke-dasharray:5;animation:dashdraw .5s linear infinite}.react-flow__edge.animated path.react-flow__edge-interaction{stroke-dasharray:none;animation:none}.react-flow__edge.inactive{pointer-events:none}.react-flow__edge.selected,.react-flow__edge:focus,.react-flow__edge:focus-visible{outline:none}.react-flow__edge.selected .react-flow__edge-path,.react-flow__edge.selectable:focus .react-flow__edge-path,.react-flow__edge.selectable:focus-visible .react-flow__edge-path{stroke:var(--xy-edge-stroke-selected, var(--xy-edge-stroke-selected-default))}.react-flow__edge-textwrapper{pointer-events:all}.react-flow__edge .react-flow__edge-text{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__arrowhead polyline{stroke:var(--xy-edge-stroke, var(--xy-edge-stroke-default))}.react-flow__arrowhead polyline.arrowclosed{fill:var(--xy-edge-stroke, var(--xy-edge-stroke-default))}.react-flow__connection{pointer-events:none}.react-flow__connection .animated{stroke-dasharray:5;animation:dashdraw .5s linear infinite}svg.react-flow__connectionline{z-index:1001;overflow:visible;position:absolute}.react-flow__nodes{pointer-events:none;transform-origin:0 0}.react-flow__node{position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:all;transform-origin:0 0;box-sizing:border-box;cursor:default}.react-flow__node.selectable{cursor:pointer}.react-flow__node.draggable{cursor:grab;pointer-events:all}.react-flow__node.draggable.dragging{cursor:grabbing}.react-flow__nodesselection{z-index:3;transform-origin:left top;pointer-events:none}.react-flow__nodesselection-rect{position:absolute;pointer-events:all;cursor:grab}.react-flow__handle{position:absolute;pointer-events:none;min-width:5px;min-height:5px;width:6px;height:6px;background-color:var(--xy-handle-background-color, var(--xy-handle-background-color-default));border:1px solid var(--xy-handle-border-color, var(--xy-handle-border-color-default));border-radius:100%}.react-flow__handle.connectingfrom{pointer-events:all}.react-flow__handle.connectionindicator{pointer-events:all;cursor:crosshair}.react-flow__handle-bottom{top:auto;left:50%;bottom:0;transform:translate(-50%,50%)}.react-flow__handle-top{top:0;left:50%;transform:translate(-50%,-50%)}.react-flow__handle-left{top:50%;left:0;transform:translate(-50%,-50%)}.react-flow__handle-right{top:50%;right:0;transform:translate(50%,-50%)}.react-flow__edgeupdater{cursor:move;pointer-events:all}.react-flow__pane.selection .react-flow__panel{pointer-events:none}.react-flow__panel{position:absolute;z-index:5;margin:15px}.react-flow__panel.top{top:0}.react-flow__panel.bottom{bottom:0}.react-flow__panel.top.center,.react-flow__panel.bottom.center{left:50%;transform:translate(-15px) translate(-50%)}.react-flow__panel.left{left:0}.react-flow__panel.right{right:0}.react-flow__panel.left.center,.react-flow__panel.right.center{top:50%;transform:translateY(-15px) translateY(-50%)}.react-flow__attribution{font-size:10px;background:var(--xy-attribution-background-color, var(--xy-attribution-background-color-default));padding:2px 3px;margin:0}.react-flow__attribution a{text-decoration:none;color:#999}@keyframes dashdraw{0%{stroke-dashoffset:10}}.react-flow__edgelabel-renderer{position:absolute;width:100%;height:100%;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;left:0;top:0}.react-flow__viewport-portal{position:absolute;width:100%;height:100%;left:0;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__minimap{background:var( --xy-minimap-background-color-props, var(--xy-minimap-background-color, var(--xy-minimap-background-color-default)) )}.react-flow__minimap-svg{display:block}.react-flow__minimap-mask{fill:var( --xy-minimap-mask-background-color-props, var(--xy-minimap-mask-background-color, var(--xy-minimap-mask-background-color-default)) );stroke:var( --xy-minimap-mask-stroke-color-props, var(--xy-minimap-mask-stroke-color, var(--xy-minimap-mask-stroke-color-default)) );stroke-width:var( --xy-minimap-mask-stroke-width-props, var(--xy-minimap-mask-stroke-width, var(--xy-minimap-mask-stroke-width-default)) )}.react-flow__minimap-node{fill:var( --xy-minimap-node-background-color-props, var(--xy-minimap-node-background-color, var(--xy-minimap-node-background-color-default)) );stroke:var( --xy-minimap-node-stroke-color-props, var(--xy-minimap-node-stroke-color, var(--xy-minimap-node-stroke-color-default)) );stroke-width:var( --xy-minimap-node-stroke-width-props, var(--xy-minimap-node-stroke-width, var(--xy-minimap-node-stroke-width-default)) )}.react-flow__background-pattern.dots{fill:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-dots-color-default)) )}.react-flow__background-pattern.lines{stroke:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-lines-color-default)) )}.react-flow__background-pattern.cross{stroke:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-cross-color-default)) )}.react-flow__controls{display:flex;flex-direction:column;box-shadow:var(--xy-controls-box-shadow, var(--xy-controls-box-shadow-default))}.react-flow__controls.horizontal{flex-direction:row}.react-flow__controls-button{display:flex;justify-content:center;align-items:center;height:26px;width:26px;padding:4px;border:none;background:var(--xy-controls-button-background-color, var(--xy-controls-button-background-color-default));border-bottom:1px solid var( --xy-controls-button-border-color-props, var(--xy-controls-button-border-color, var(--xy-controls-button-border-color-default)) );color:var( --xy-controls-button-color-props, var(--xy-controls-button-color, var(--xy-controls-button-color-default)) );cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__controls-button svg{width:100%;max-width:12px;max-height:12px;fill:currentColor}.react-flow__edge.updating .react-flow__edge-path{stroke:#777}.react-flow__edge-text{font-size:10px}.react-flow__node.selectable:focus,.react-flow__node.selectable:focus-visible{outline:none}.react-flow__node-input,.react-flow__node-default,.react-flow__node-output,.react-flow__node-group{padding:10px;border-radius:var(--xy-node-border-radius, var(--xy-node-border-radius-default));width:150px;font-size:12px;color:var(--xy-node-color, var(--xy-node-color-default));text-align:center;border:var(--xy-node-border, var(--xy-node-border-default));background-color:var(--xy-node-background-color, var(--xy-node-background-color-default))}.react-flow__node-input.selectable:hover,.react-flow__node-default.selectable:hover,.react-flow__node-output.selectable:hover,.react-flow__node-group.selectable:hover{box-shadow:var(--xy-node-boxshadow-hover, var(--xy-node-boxshadow-hover-default))}.react-flow__node-input.selectable.selected,.react-flow__node-input.selectable:focus,.react-flow__node-input.selectable:focus-visible,.react-flow__node-default.selectable.selected,.react-flow__node-default.selectable:focus,.react-flow__node-default.selectable:focus-visible,.react-flow__node-output.selectable.selected,.react-flow__node-output.selectable:focus,.react-flow__node-output.selectable:focus-visible,.react-flow__node-group.selectable.selected,.react-flow__node-group.selectable:focus,.react-flow__node-group.selectable:focus-visible{box-shadow:var(--xy-node-boxshadow-selected, var(--xy-node-boxshadow-selected-default))}.react-flow__node-group{background-color:var(--xy-node-group-background-color, var(--xy-node-group-background-color-default))}.react-flow__nodesselection-rect,.react-flow__selection{background:var(--xy-selection-background-color, var(--xy-selection-background-color-default));border:var(--xy-selection-border, var(--xy-selection-border-default))}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible,.react-flow__selection:focus,.react-flow__selection:focus-visible{outline:none}.react-flow__controls-button:hover{background:var( --xy-controls-button-background-color-hover-props, var(--xy-controls-button-background-color-hover, var(--xy-controls-button-background-color-hover-default)) );color:var( --xy-controls-button-color-hover-props, var(--xy-controls-button-color-hover, var(--xy-controls-button-color-hover-default)) )}.react-flow__controls-button:disabled{pointer-events:none}.react-flow__controls-button:disabled svg{fill-opacity:.4}.react-flow__controls-button:last-child{border-bottom:none}.react-flow__controls.horizontal .react-flow__controls-button{border-bottom:none;border-right:1px solid var( --xy-controls-button-border-color-props, var(--xy-controls-button-border-color, var(--xy-controls-button-border-color-default)) )}.react-flow__controls.horizontal .react-flow__controls-button:last-child{border-right:none}.react-flow__resize-control{position:absolute}.react-flow__resize-control.left,.react-flow__resize-control.right{cursor:ew-resize}.react-flow__resize-control.top,.react-flow__resize-control.bottom{cursor:ns-resize}.react-flow__resize-control.top.left,.react-flow__resize-control.bottom.right{cursor:nwse-resize}.react-flow__resize-control.bottom.left,.react-flow__resize-control.top.right{cursor:nesw-resize}.react-flow__resize-control.handle{width:5px;height:5px;border:1px solid #fff;border-radius:1px;background-color:var(--xy-resize-background-color, var(--xy-resize-background-color-default));translate:-50% -50%}.react-flow__resize-control.handle.left{left:0;top:50%}.react-flow__resize-control.handle.right{left:100%;top:50%}.react-flow__resize-control.handle.top{left:50%;top:0}.react-flow__resize-control.handle.bottom{left:50%;top:100%}.react-flow__resize-control.handle.top.left,.react-flow__resize-control.handle.bottom.left{left:0}.react-flow__resize-control.handle.top.right,.react-flow__resize-control.handle.bottom.right{left:100%}.react-flow__resize-control.line{border-color:var(--xy-resize-background-color, var(--xy-resize-background-color-default));border-width:0;border-style:solid}.react-flow__resize-control.line.left,.react-flow__resize-control.line.right{width:1px;transform:translate(-50%);top:0;height:100%}.react-flow__resize-control.line.left{left:0;border-left-width:1px}.react-flow__resize-control.line.right{left:100%;border-right-width:1px}.react-flow__resize-control.line.top,.react-flow__resize-control.line.bottom{height:1px;transform:translateY(-50%);left:0;width:100%}.react-flow__resize-control.line.top{top:0;border-top-width:1px}.react-flow__resize-control.line.bottom{border-bottom-width:1px;top:100%}.react-flow__edge-textbg{fill:var(--xy-edge-label-background-color, var(--xy-edge-label-background-color-default))}.react-flow__edge-text{fill:var(--xy-edge-label-color, var(--xy-edge-label-color-default))}.sg-module{height:calc(100vh - 54px);min-height:680px;min-width:0;display:grid;grid-template-columns:300px minmax(0,1fr) 330px;gap:12px;padding:12px;background:var(--jcai-bg);color:var(--jcai-text)}.sg-mail{grid-template-columns:220px 360px minmax(0,1fr) 320px}.sg-message{grid-template-columns:180px 320px minmax(0,1fr) 280px}.sg-knowledge{grid-template-columns:260px 340px minmax(0,1fr) 320px}.sg-editor{grid-template-columns:280px minmax(0,1fr) 340px}.sg-rail,.sg-list-panel,.sg-main-panel,.sg-inspector{min-width:0;min-height:0;border:1px solid var(--jcai-border);border-radius:12px;background:var(--jcai-surface);box-shadow:var(--jcai-shadow-1)}.sg-rail,.sg-list-panel,.sg-inspector{padding:12px;overflow:hidden}.sg-main-panel{display:flex;flex-direction:column;overflow:hidden}.sg-panel-head,.sg-page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:10px;border-bottom:1px solid var(--jcai-border-soft)}.sg-panel-head{margin-bottom:10px}.sg-page-head{padding:12px 14px}.sg-panel-head strong,.sg-page-head h2,.sg-card h3,.sg-section-head strong{color:var(--jcai-text);font-weight:750}.sg-page-head h2{margin:2px 0;font-size:18px;line-height:1.25}.sg-panel-head span,.sg-page-head span,.sg-page-head p,.sg-card p,.sg-row p,.sg-mail-row p,.sg-chat-row p,.sg-knowledge-row p,.sg-space-row span,.sg-list-card small,.sg-list-card footer,.sg-section-head span{color:var(--jcai-muted)}.sg-head-actions,.sg-toolbar,.sg-section-head,.sg-modal-actions{display:flex;align-items:center;justify-content:space-between;gap:8px}.sg-head-actions button,.sg-toolbar button,.sg-inline-action,.sg-primary-mini,.sg-action-grid button,.sg-modal-actions button,.sg-row button,.sg-chat-card button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:32px;border:1px solid var(--jcai-border);border-radius:8px;background:#fff;color:var(--jcai-text);padding:6px 10px;font-size:13px}.sg-head-actions button:first-child,.sg-primary-mini,.sg-modal-actions button:last-child{border-color:#b7caf2;background:var(--jcai-primary);color:#fff}.sg-search{display:flex;align-items:center;gap:8px;height:34px;padding:0 10px;border:1px solid var(--jcai-border);border-radius:9px;background:var(--jcai-surface-soft)}.sg-search input{width:100%;border:0;outline:0;background:transparent;color:var(--jcai-text)}.sg-filter-wrap{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}.sg-filter-wrap button,.sg-folder,.sg-block-row{min-height:30px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--jcai-muted);padding:6px 8px}.sg-filter-wrap button.active,.sg-folder.active,.sg-block-row:hover,.sg-toolbar button.active{border-color:#c7d7f2;background:var(--jcai-primary-soft);color:var(--jcai-primary);font-weight:700}.sg-rail-list,.sg-content-scroll,.sg-chat-stream{min-height:0;overflow:auto}.sg-rail-list{height:calc(100% - 94px);padding-right:2px}.sg-content-scroll{flex:1;padding:12px 14px 16px}.sg-list-card,.sg-mail-row,.sg-chat-row,.sg-knowledge-row,.sg-space-row,.sg-row,.sg-card,.sg-section,.sg-file-line,.sg-picker-card,.sg-confirm-card{width:100%;border:1px solid var(--jcai-border-soft);border-radius:10px;background:#fff;box-shadow:none}.sg-list-card,.sg-mail-row,.sg-chat-row,.sg-knowledge-row,.sg-space-row{display:block;margin-top:8px;padding:10px;text-align:left}.sg-list-card.active,.sg-mail-row.active,.sg-chat-row.active,.sg-knowledge-row.active,.sg-space-row.active,.sg-row.active{border-color:#98b8ef;background:#f6f9ff;box-shadow:inset 3px 0 0 var(--jcai-primary)}.sg-list-card strong,.sg-mail-row strong,.sg-chat-row strong,.sg-knowledge-row strong{display:block;margin:5px 0 3px;line-height:1.35}.sg-progress{height:5px;margin:10px 0 8px;border-radius:999px;background:#e8eaed}.sg-progress span{display:block;height:100%;border-radius:inherit;background:var(--jcai-primary)}.sg-status{display:inline-flex;align-items:center;width:fit-content;min-height:22px;border-radius:999px;padding:2px 8px;background:#f0f2f5;color:#565c66;font-size:12px;font-weight:700}.sg-status.running{background:#eaf0ff;color:#3370ff}.sg-status.warning{background:#fff7ed;color:#b45309}.sg-status.pending{background:#fff1f2;color:#be123c}.sg-status.success{background:#f0fdf4;color:#15803d}.sg-status.neutral{background:#f1f5f9;color:#565c66}.sg-kpi-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:10px 14px;border-bottom:1px solid var(--jcai-border-soft)}.sg-kpi-strip div,.sg-meta-grid article{border:1px solid var(--jcai-border-soft);border-radius:9px;background:var(--jcai-surface-soft);padding:8px 10px}.sg-kpi-strip span,.sg-meta-grid span{display:block;color:var(--jcai-muted);font-size:12px}.sg-kpi-strip strong,.sg-meta-grid strong{display:block;margin-top:2px;color:var(--jcai-text);font-size:15px}.sg-tabs{display:flex;gap:12px;padding:0 14px;border-bottom:1px solid var(--jcai-border-soft)}.sg-tabs button{border:0;border-bottom:2px solid transparent;background:transparent;color:var(--jcai-muted);padding:10px 2px 9px}.sg-tabs button.active{border-bottom-color:var(--jcai-primary);color:var(--jcai-primary);font-weight:750}.sg-section{margin-bottom:10px;padding:12px}.sg-section-head{padding-bottom:8px;border-bottom:1px solid var(--jcai-border-soft);margin-bottom:10px}.sg-gantt{overflow:auto;border:1px solid var(--jcai-border-soft);border-radius:9px}.sg-row{display:grid;grid-template-columns:20px minmax(0,1fr) auto auto;align-items:center;gap:10px;margin-bottom:8px;padding:10px}.sg-row.risk{background:#fffaf2}.sg-card{margin-bottom:10px;padding:12px}.sg-card.flat{margin-top:10px;background:var(--jcai-surface-soft)}.sg-card dl{display:grid;grid-template-columns:64px 1fr;gap:6px 10px;margin:0}.sg-card dt{color:var(--jcai-muted)}.sg-card dd{margin:0;color:var(--jcai-text)}.sg-file-chip,.sg-file-line{display:flex;align-items:center;gap:8px;margin-top:7px;padding:8px 10px;text-align:left}.sg-file-chip{width:fit-content}.sg-table-wrap header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.sg-table{width:100%;border-collapse:collapse;overflow:hidden;border:1px solid var(--jcai-border-soft);border-radius:9px;background:#fff}.sg-table th,.sg-table td{border-bottom:1px solid var(--jcai-border-soft);padding:9px 10px;text-align:left;vertical-align:top}.sg-table th{background:var(--jcai-surface-soft);color:var(--jcai-muted);font-weight:700}.sg-account,.sg-member-row{display:flex;align-items:flex-start;gap:9px;padding:10px;border:1px solid var(--jcai-border-soft);border-radius:10px;background:var(--jcai-surface-soft);text-align:left}.sg-folder{width:100%;display:flex;align-items:center;justify-content:space-between;margin-top:4px;text-align:left}.sg-mail-row header,.sg-chat-row header,.sg-message-bubble header{display:flex;justify-content:space-between;gap:8px}.sg-mail-row footer,.sg-knowledge-row footer{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.sg-mail-row em,.sg-knowledge-row em{border-radius:999px;background:#f1f5f9;color:var(--jcai-muted);padding:2px 7px;font-style:normal;font-size:11px}.mail-body pre,.sg-doc-preview,.sg-json-preview,.sg-log-list pre,.sg-modal pre{white-space:pre-wrap;margin:0;color:var(--jcai-text);font-family:inherit;line-height:1.55}.sg-action-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.sg-action-grid.single{grid-template-columns:1fr 1fr}.sg-confirm-card{margin-top:10px;padding:12px;background:#fffaf2;border-color:#fed7aa}.sg-chat-stream{flex:1;padding:14px;background:#fbfdff}.sg-main-panel.chat{display:grid;grid-template-rows:auto 1fr auto}.sg-message-bubble{max-width:78%;margin-bottom:10px;border:1px solid var(--jcai-border-soft);border-radius:12px;background:#fff;padding:10px 12px}.sg-message-bubble.mine{margin-left:auto;border-color:#c7d7f2;background:#f4f8ff}.sg-chat-card,.sg-approval-card{margin-top:8px;border:1px solid var(--jcai-border);border-radius:10px;background:var(--jcai-surface-soft);padding:10px}.sg-approval-card{display:grid;grid-template-columns:20px 1fr;gap:8px}.sg-approval-card.pending{border-color:#fed7aa;background:#fff7ed}.sg-approval-card footer{grid-column:2;display:flex;gap:8px}.sg-chat-input{display:grid;grid-template-columns:1fr 42px;gap:8px;padding:12px;border-top:1px solid var(--jcai-border-soft)}.sg-chat-input textarea,.sg-editor-prompt textarea,.sg-modal textarea,.sg-card textarea,.sg-modal input,.sg-modal select,.sg-wide-select,.sg-card select{width:100%;border:1px solid var(--jcai-border);border-radius:9px;background:#fff;color:var(--jcai-text);padding:9px 10px}.sg-chat-input textarea{min-height:46px;resize:none}.sg-member-row{width:100%;margin-bottom:8px;background:#fff}.sg-member-row i{width:9px;height:9px;border-radius:999px;margin-top:6px;background:#cbd5e1}.sg-member-row i.online{background:#22c55e}.sg-space-row{display:flex;gap:10px}.sg-meta-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.sg-editor-prompt{display:grid;grid-template-columns:22px minmax(0,1fr) 96px;gap:10px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--jcai-border-soft)}.sg-editor-prompt textarea{min-height:42px;resize:vertical}.sg-flow-canvas{display:grid;gap:8px}.sg-flow-node{display:grid;grid-template-columns:30px minmax(0,1fr) auto 20px;align-items:center;gap:10px;border:1px solid var(--jcai-border-soft);border-radius:10px;background:#fff;padding:10px;text-align:left}.sg-flow-node.active{border-color:#98b8ef;background:#f6f9ff}.sg-flow-node>span{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:var(--jcai-primary-soft);color:var(--jcai-primary);font-weight:750}.sg-flow-node em{border-radius:999px;background:#f1f5f9;color:var(--jcai-muted);padding:3px 7px;font-style:normal}.sg-section.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}.sg-log-list,.sg-json-preview{border:1px solid var(--jcai-border-soft);border-radius:9px;background:var(--jcai-surface-soft);padding:10px}.sg-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:grid;place-items:center;background:#1f232947}.sg-modal>section{width:min(760px,calc(100vw - 48px));max-height:calc(100vh - 80px);overflow:auto;border:1px solid var(--jcai-border);border-radius:14px;background:#fff;box-shadow:var(--jcai-shadow-2);padding:16px}.sg-modal header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.sg-modal label,.sg-card label{display:grid;gap:6px;margin:9px 0;color:var(--jcai-muted);font-size:12px}.sg-modal textarea{min-height:160px}.sg-picker-card{display:block;margin:8px 0;padding:12px;text-align:left}.sg-toast{position:fixed;right:28px;bottom:28px;z-index:80;border-radius:10px;background:#111827;color:#fff;box-shadow:var(--jcai-shadow-2);padding:11px 14px}@media(max-width:1280px){.sg-mail,.sg-message,.sg-knowledge{grid-template-columns:220px 320px minmax(0,1fr)}.sg-mail .sg-inspector,.sg-message .sg-inspector,.sg-knowledge .sg-inspector{display:none}} diff --git a/apps/web/src/app/styles/theme.css b/apps/web/src/app/styles/theme.css new file mode 100644 index 0000000..9c8c495 --- /dev/null +++ b/apps/web/src/app/styles/theme.css @@ -0,0 +1,61 @@ +/* ============================================================================ + JCAI 治理台 · 令牌与基座 + —— 只放设计令牌 + 页面基座；治理台的外壳与全部组件在 console.css。 + 令牌与工作台同源（飞书蓝阶 + 中性阶 + 功能色 + 类型强调色），但**壳不同**： + 工作台是浅色三栏工作面，治理台是深色轨 + 深色顶栏的控制台。 + ========================================================================== */ + +:root { + /* —— 飞书蓝阶 —— */ + --brand: #3370ff; + --brand-deep: #245bdb; + --brand-pressed: #1c4cba; + --brand-soft: #e1eaff; + --brand-wash: #f0f4ff; + /* —— AI 在场渐变 —— */ + --ai-a: #3370ff; + --ai-b: #7f3bf5; + --ai-grad: linear-gradient(135deg, var(--ai-a), var(--ai-b)); + /* —— 中性阶 —— */ + --ink: #1f2329; + --ink-2: #41464e; + --ink-3: #646a73; + --ink-4: #8f959e; + --line: #dee0e3; + --line-soft: #e8eaed; + --canvas: #f0f2f5; + --soft: #f8f9fb; + --cardline: #e1e6ec; + --card-shadow: 0 1px 2px rgba(31, 35, 41, .05); + /* —— 功能色 —— */ + --ok: #278717; --ok-accent: #34c724; --ok-soft: #e8f8e4; + --warn: #de7802; --warn-accent: #ff8800; --warn-soft: #fff4e5; + --danger: #d83931; --danger-accent: #f54a45; --danger-soft: #feeae9; + /* —— 活动 / 节点类型强调色 —— */ + --st-auto: #4954e6; --st-execute: #e07a00; --st-decision: #7f3bf5; + --st-collab: #0aa294; --st-wait: #6a7590; + /* —— 字体 / 动效 —— */ + --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; + --mono: ui-monospace, "SF Mono", SFMono-Regular, "JetBrains Mono", Menlo, Consolas, monospace; + --t-fast: .16s cubic-bezier(.3, 0, .2, 1); + --t-med: .26s cubic-bezier(.3, 0, .2, 1); +} + +/* ============================== 基座 ============================== */ +* { box-sizing: border-box; } +html, body { height: 100%; } +body { + margin: 0; + min-width: 1120px; + background: #eceff4; + color: var(--ink); + font-family: var(--sans); + -webkit-font-smoothing: antialiased; +} +:root { scrollbar-width: thin; scrollbar-color: #c9ced6 transparent; } +::selection { background: var(--brand-soft); } +:where(button, input, textarea, select, a, [tabindex]):focus-visible { + outline: 2px solid var(--brand); + outline-offset: 2px; + border-radius: 8px; +} diff --git a/apps/web/src/features/desk-task/contract.ts b/apps/web/src/features/desk-task/contract.ts new file mode 100644 index 0000000..bc51289 --- /dev/null +++ b/apps/web/src/features/desk-task/contract.ts @@ -0,0 +1,2 @@ +/** feature: desk-task —— 对外类型(编码规范 §9.1) */ +export type { TaskCard, TaskDetail } from '@contracts'; diff --git a/apps/web/src/features/desk-task/index.ts b/apps/web/src/features/desk-task/index.ts new file mode 100644 index 0000000..8f71080 --- /dev/null +++ b/apps/web/src/features/desk-task/index.ts @@ -0,0 +1,8 @@ +/** + * feature: desk-task —— 唯一出口(编码规范 §9.1)。 + * 任务要素四区:任务列表 / 标题区 / 工作区(工单两模式)/ 对话区(卡族 + composer 锁)。 + */ +export type { TaskCard, TaskDetail } from './contract.ts'; +export { TaskList } from './internal/TaskList.tsx'; +export { ViewRegion } from './internal/ViewRegion.tsx'; +export { TaskChat } from './internal/TaskChat.tsx'; diff --git a/apps/web/src/features/desk-task/internal/TaskChat.tsx b/apps/web/src/features/desk-task/internal/TaskChat.tsx new file mode 100644 index 0000000..df55816 --- /dev/null +++ b/apps/web/src/features/desk-task/internal/TaskChat.tsx @@ -0,0 +1,175 @@ +/** + * 对话区 —— 自原型 `_components/TaskChat.tsx` 平移。 + * + * 「对话区**只承载非结构化消息 + 决策选择题**;事件由系统 Agent(灰头像)发进来。」 + * 对话流是**一切回环输入的唯一入口**(OS 4.1);输入侧不参与控制权转交(AM 07)。 + */ +import { useState } from 'react'; +import type { ChatMessage } from '@contracts'; +import { AI_TAG_LABEL, EVENT_TYPE_LABEL } from '@contracts'; +import { Ico } from '@web-shared/Ico.tsx'; +import ScrollArea from '@web-shared/ScrollArea.tsx'; + +export type TaskChatProps = { + readonly chat: readonly ChatMessage[]; + readonly locked: boolean; + onSay(text: string): void; + onDecide(cardId: string, value: string, note?: string): void; +}; + +export function TaskChat({ chat, locked, onSay, onDecide }: TaskChatProps) { + const [draft, setDraft] = useState(''); + + const submit = () => { + const text = draft.trim(); + if (text === '' || locked) return; + onSay(text); + setDraft(''); + }; + + return ( +
+
+ + + +
+

任务助理

+ 对话流 · 唯一回环输入口 +
+
+ + + {chat.map((msg) => ( + + ))} + {chat.length === 0 && ( +
+ + 还没有对话 +
+ )} + + + {/* composer 锁:有卡在等作答时锁住自由输入,逼回卡上作答 */} +