diff --git a/.github/workflows/taskboard-build.yml b/.github/workflows/taskboard-build.yml
new file mode 100644
index 000000000..4f95c9f7c
--- /dev/null
+++ b/.github/workflows/taskboard-build.yml
@@ -0,0 +1,48 @@
+name: Taskboard checks
+
+on:
+  pull_request:
+    paths:
+      - "apps/codex-taskboard/**"
+      - ".github/workflows/taskboard-build.yml"
+  push:
+    branches:
+      - main
+    paths:
+      - "apps/codex-taskboard/**"
+      - ".github/workflows/taskboard-build.yml"
+  workflow_dispatch:
+
+permissions:
+  contents: read
+
+jobs:
+  taskboard:
+    name: Taskboard checks
+    runs-on: ubuntu-latest
+    timeout-minutes: 10
+    defaults:
+      run:
+        working-directory: apps/codex-taskboard
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: "22"
+          cache: npm
+          cache-dependency-path: apps/codex-taskboard/package-lock.json
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: TypeScript check
+        run: npm run typecheck
+
+      - name: Build frontend
+        run: npm run build:web
+
+      - name: Test
+        run: npm test
diff --git a/apps/codex-taskboard/.gitignore b/apps/codex-taskboard/.gitignore
new file mode 100644
index 000000000..f6ee3fb48
--- /dev/null
+++ b/apps/codex-taskboard/.gitignore
@@ -0,0 +1,13 @@
+node_modules/
+dist/
+.data/
+.idea/
+.codex-install-source
+.git-original-removed-by-codex/
+.wrangler/
+.dev.vars*
+.tmp/
+cloud-migration-exports/
+.playwright-cli/
+*.log
+.DS_Store
diff --git a/apps/codex-taskboard/AGENTS.md b/apps/codex-taskboard/AGENTS.md
new file mode 100644
index 000000000..403084c6c
--- /dev/null
+++ b/apps/codex-taskboard/AGENTS.md
@@ -0,0 +1,13 @@
+# Project Development Rules
+
+For feature work in this repository, use this order:
+
+1. Before implementation, prove the real operation path to the user: entry point → user or agent action → data change or other side effect → observable result. Cite the actual component, API, and file involved, or demonstrate the path in the product. This proof is not a test.
+2. Implement the requested main path with the smallest direct change that makes it work.
+3. After implementation, demonstrate or verify only that direct operation path and give the result to the user for confirmation.
+4. Before the user confirms the feature works, do not proactively add guardrails, mutation or regression tests, legacy compatibility protection, defensive extensions, or speculative fallback behavior.
+5. User confirmation does not automatically authorize that follow-up work. Add targeted protection or tests only when the user explicitly asks for them, or when the user reports a concrete failure scenario that requires them.
+
+The primary objective is to make the requested function work. Focus on the feature implementation itself and avoid over-design; safety, guardrails, and testing must not dominate the work or turn the feature into a surrounding engineering project. This rule supersedes the earlier standing instruction that every feature must be developed test-first. Test-first language in older issues does not apply unless the user restates it for that issue after this rule.
+
+This ordering does not waive higher-priority safety or security requirements. Keep validation that is necessary at real external boundaries, such as user input or external APIs, but do not expand it into hypothetical protection beyond the requested path.
diff --git a/apps/codex-taskboard/README.md b/apps/codex-taskboard/README.md
new file mode 100644
index 000000000..6648fdbb3
--- /dev/null
+++ b/apps/codex-taskboard/README.md
@@ -0,0 +1,142 @@
+# Codex Taskboard
+
+A local-first issue board that runs in a browser and can be embedded in Codex through the standalone CDP launcher or its injection script. The same HTTP API powers the React UI and the `taskctl` CLI used by the bundled Codex Skill.
+
+## Requirements
+
+- Node.js 22.5 or newer
+
+## Clone or download
+
+Download the repository ZIP from GitHub, or clone it with Git:
+
+```bash
+git clone https://github.com/BigPizzaV3/CodexPlusPlus.git
+cd CodexPlusPlus/apps/codex-taskboard
+```
+
+## Run locally
+
+```bash
+npm install
+npm run build
+npm start
+```
+
+Open <http://127.0.0.1:47823>. The SQLite database is stored at `.data/taskboard.sqlite`.
+
+For development with live frontend reload:
+
+```bash
+npm run dev
+```
+
+The Vite UI runs at <http://127.0.0.1:5173> and proxies API requests to the local service.
+
+## Use the CLI
+
+Run it from the project:
+
+```bash
+npm run taskctl -- project create \
+  --id my-project \
+  --name "My project" \
+  --workspace-path /absolute/path/to/repository
+
+npm run taskctl -- issue create \
+  --project my-project \
+  --title "Implement the next slice" \
+  --status todo \
+  --priority high \
+  --labels product,mvp
+```
+
+Use `npm link` if you want `taskctl` on your shell path. Set `CODEX_TASKBOARD_URL` to point the CLI at another local service. Cloud deployments are configured through the loopback companion with `taskctl cloud login`.
+
+## Install the Codex Skill
+
+Copy or symlink `skills/manage-taskboard` into the Codex skills directory, then start a new Codex task:
+
+```bash
+ln -s /absolute/path/to/codex-taskboard/skills/manage-taskboard \
+  ~/.codex/skills/manage-taskboard
+```
+
+The Skill teaches Codex to inspect an issue, move it to `in_progress`, use optimistic versions, verify the work, and then move it to `in_review`; it moves the issue to `done` only after the user explicitly confirms acceptance or asks to mark it complete.
+
+## Embed in Codex
+
+### Recommended: keep your current window and open a separate Taskboard window
+
+Keep the existing Codex window open. From the Taskboard repository, start a second Codex instance with a dedicated CDP port:
+
+```bash
+open -n -a /Applications/ChatGPT.app --args \
+  --remote-debugging-port=9231 \
+  --remote-allow-origins=http://127.0.0.1:9231
+```
+
+After the new Codex window appears, run the injector in another terminal:
+
+```bash
+CODEX_TASKBOARD_HOST=127.0.0.1 \
+npm run codex:inject -- --port 9231 --open
+```
+
+Keep the injector terminal running while using the embedded panel. The original Codex window remains unchanged, and the new window receives the Taskboard sidebar entry. If port `9231` is occupied, use another port in both commands.
+
+### Alternative: restart Codex with the standalone launcher
+
+Quit every running Codex window, then run:
+
+```bash
+CODEX_TASKBOARD_HOST=127.0.0.1 npm run codex
+```
+
+This starts the local Taskboard service when needed, launches the official macOS Codex app with a loopback-only CDP port, injects a native-looking Taskboard entry after Plugins, and keeps watching both the service and replacement renderers. Opening Taskboard asks this launcher to health-check the fixed local service, restart it when needed, and rebuild a failed iframe. Keep this command running while using the embedded panel. The launcher does not modify `ChatGPT.app` or its `app.asar`.
+
+Codex 26.715.52143 ships a renderer CSP that blocks arbitrary HTTP iframes. The launcher therefore enables CDP CSP bypass, reloads that renderer once, installs the document-start script, and waits until the Taskboard OOPIF is actually loaded. CDP is unauthenticated to other processes on the same machine, so only run trusted local code while the launcher is active.
+
+To inject into a Codex instance that was already launched with CDP by another method, run:
+
+```bash
+npm run codex:inject -- --port 9229 --open
+```
+
+This command also stays resident so the injected tab can restart Taskboard after a service exit. Stop it with `Ctrl-C`.
+
+The script adds a Taskboard entry to the Codex sidebar and renders the iframe across Codex's complete main workspace, including the contextual titlebar area so Taskboard's own header does not leave an empty strip. That full rectangular header is placed above Electron's draggable layer and marked `no-drag`; because the native contextual actions are suppressed while Taskboard is active, its own actions use their normal edge padding without an artificial right-side gap. The native sidebar stays mounted, while the previous page selection and contextual header are temporarily suppressed; choosing another Codex page restores them.
+
+The "Open in conversation" action selects the corresponding native Codex project when one is available and opens an unsent native composer with `$manage-taskboard ISSUE-ID`. A conversation is attributed only after it actually processes the issue: `taskctl` reads Codex's `CODEX_THREAD_ID` and records that ID on the issue or comment mutation. Recorded IDs are clickable through Codex's native route bridge. Each issue can bind either one Git branch or one worktree; the options are scanned from the selected Codex project's repository instead of being typed by hand. The integration uses Codex's existing project, composer, and route markers; it does not patch React, replace `fetch`, load private chunks, or edit Codex data files.
+
+To use a different UI origin, set `window.__CODEX_TASKBOARD_URL__` before the user script runs.
+
+## Configuration
+
+| Variable | Default | Purpose |
+| --- | --- | --- |
+| `CODEX_TASKBOARD_HOST` | `127.0.0.1` | HTTP bind address; set `0.0.0.0` only to explicitly share on a private LAN |
+| `TASKBOARD_SHARED_SECRET` | unset | Required for `0.0.0.0`; protects every request with Basic authentication |
+| `CODEX_TASKBOARD_PORT` | `47823` | Local HTTP port |
+| `CODEX_TASKBOARD_DATA_DIR` | `.data` | SQLite data directory |
+| `CODEX_TASKBOARD_URL` | `http://127.0.0.1:47823` | CLI API origin |
+
+By default, the service binds only to `127.0.0.1`. LAN sharing is opt-in: set `CODEX_TASKBOARD_HOST=0.0.0.0` and a non-empty `TASKBOARD_SHARED_SECRET`. Startup prints a warning before binding and then lists detected LAN URLs. Every LAN request must use Basic authentication and an HTTP `Origin` matching its `Host`; cross-origin requests are rejected and the server does not emit wildcard CORS headers. Do not expose the service to the public internet.
+
+Task, comment, and attachment changes are broadcast to every open client through server-sent events; reconnecting clients perform a full refresh so changes made while disconnected are not missed. `taskctl` remains configured for the local companion URL; use the browser UI or an authenticated deployment boundary for shared access.
+
+## Share through Cloudflare
+
+For two trusted collaborators, the taskboard can run on Cloudflare with Worker Static Assets and API routes, D1 as the authoritative business database, and a private R2 bucket for attachments. The deployment uses HTTPS Basic Authentication with a shared password and refreshes open boards after a global revision changes.
+
+Each device keeps its own project checkout mapping and continues to use a local companion for Codex, Git/worktree, Skill, and MCP capabilities. Cloud mode never falls back to or double-writes the local SQLite database.
+
+See [Cloud collaboration](docs/cloud-collaboration.md) for owner deployment, existing GitHub installation setup, password rotation, local path mapping, and the one-time local-data migration flow.
+
+## Verify
+
+```bash
+npm run check
+```
+
+This runs TypeScript checking, a production frontend build, and the server/CLI/injection test suite.
diff --git a/apps/codex-taskboard/cli/taskctl.mjs b/apps/codex-taskboard/cli/taskctl.mjs
new file mode 100644
index 000000000..afe01f6e0
--- /dev/null
+++ b/apps/codex-taskboard/cli/taskctl.mjs
@@ -0,0 +1,855 @@
+#!/usr/bin/env node
+
+import { realpathSync } from "node:fs";
+import { readFile, writeFile } from "node:fs/promises";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+
+import { normalizeCloudUrl } from "../server/cloud-config.mjs";
+import {
+  DEFAULT_PROJECT_ID,
+  TASK_STATUSES,
+  isTaskPriority,
+  isTaskStatus,
+} from "../shared/domain.mjs";
+
+export const SCHEMA_VERSION = 2;
+export const DEFAULT_API_URL = "http://127.0.0.1:47823";
+
+const BOOLEAN_OPTIONS = new Set(["json"]);
+
+const COMMAND_OPTIONS = new Map([
+  ["project list", new Set(["json"])],
+  ["project create", new Set(["id", "name", "workspace-path", "json"])],
+  ["project map", new Set(["workspace-path", "json"])],
+  ["cloud login", new Set(["url", "actor-name", "json"])],
+  ["cloud status", new Set(["json"])],
+  ["cloud logout", new Set(["json"])],
+  ["issue list", new Set(["project", "status", "json"])],
+  ["issue get", new Set(["json"])],
+  [
+    "issue create",
+    new Set([
+      "project",
+      "title",
+      "description",
+      "description-file",
+      "status",
+      "priority",
+      "labels",
+      "thread-id",
+      "git-branch",
+      "worktree-path",
+      "worktree-branch",
+      "due-date",
+      "recurrence-interval",
+      "recurrence-unit",
+      "json",
+    ]),
+  ],
+  [
+    "issue update",
+    new Set([
+      "title",
+      "description",
+      "description-file",
+      "status",
+      "priority",
+      "labels",
+      "thread-id",
+      "git-branch",
+      "worktree-path",
+      "worktree-branch",
+      "due-date",
+      "recurrence-interval",
+      "recurrence-unit",
+      "if-version",
+      "json",
+    ]),
+  ],
+  ["issue move", new Set(["status", "thread-id", "if-version", "json"])],
+  ["issue archive", new Set(["thread-id", "if-version", "json"])],
+  ["issue restore", new Set(["thread-id", "if-version", "json"])],
+  ["issue relation", new Set(["type", "issue", "thread-id", "if-version", "json"])],
+  ["comment list", new Set(["json"])],
+  ["comment add", new Set(["body", "thread-id", "json"])],
+  ["comment update", new Set(["body", "thread-id", "if-version", "json"])],
+  ["comment delete", new Set(["thread-id", "if-version", "json"])],
+  ["attachment download", new Set(["output", "json"])],
+  ["context current", new Set(["cwd", "json"])],
+]);
+
+class TaskctlError extends Error {
+  constructor(message, { code = "TASKCTL_ERROR", exitCode = 2, details } = {}) {
+    super(message);
+    this.name = "TaskctlError";
+    this.code = code;
+    this.exitCode = exitCode;
+    this.details = details;
+  }
+}
+
+export function parseArgs(argv) {
+  if (!Array.isArray(argv)) {
+    throw new TypeError("argv must be an array");
+  }
+
+  const positionals = [];
+  const options = {};
+
+  for (let index = 0; index < argv.length; index += 1) {
+    const token = argv[index];
+    if (token === "--") {
+      positionals.push(...argv.slice(index + 1));
+      break;
+    }
+
+    if (!token.startsWith("--")) {
+      positionals.push(token);
+      continue;
+    }
+
+    const equalsIndex = token.indexOf("=");
+    const name = token.slice(2, equalsIndex === -1 ? undefined : equalsIndex);
+    if (!name) {
+      throw usageError("Invalid empty option");
+    }
+
+    if (Object.hasOwn(options, name)) {
+      throw usageError(`Option --${name} may only be specified once`);
+    }
+
+    if (BOOLEAN_OPTIONS.has(name)) {
+      if (equalsIndex !== -1) {
+        throw usageError(`Option --${name} does not accept a value`);
+      }
+      options[name] = true;
+      continue;
+    }
+
+    if (equalsIndex !== -1) {
+      options[name] = token.slice(equalsIndex + 1);
+      continue;
+    }
+
+    const value = argv[index + 1];
+    if (value === undefined || value.startsWith("--")) {
+      throw usageError(`Option --${name} requires a value`);
+    }
+    options[name] = value;
+    index += 1;
+  }
+
+  return {
+    resource: positionals[0],
+    action: positionals[1],
+    operands: positionals.slice(2),
+    options,
+  };
+}
+
+export async function main(argv = process.argv.slice(2), overrides = {}) {
+  const stdout = overrides.stdout ?? process.stdout;
+  const stderr = overrides.stderr ?? process.stderr;
+
+  try {
+    const parsed = parseArgs(argv);
+    const result = await execute(parsed, overrides);
+    writeJson(stdout, { ...result, schemaVersion: SCHEMA_VERSION });
+    return 0;
+  } catch (error) {
+    const normalized = normalizeError(error);
+    const payload = {
+      schemaVersion: SCHEMA_VERSION,
+      error: {
+        code: normalized.code,
+        message: normalized.message,
+      },
+    };
+    if (normalized.details !== undefined) {
+      payload.error.details = normalized.details;
+    }
+    writeJson(stderr, payload);
+    return normalized.exitCode;
+  }
+}
+
+async function execute(parsed, overrides) {
+  const command = `${parsed.resource ?? ""} ${parsed.action ?? ""}`.trim();
+  const allowedOptions = COMMAND_OPTIONS.get(command);
+  if (!allowedOptions) {
+    throw usageError(
+      "Expected one of: project list/create/map, cloud login/status/logout, issue list/get/create/update/move/archive/restore/relation, comment list/add/update/delete, attachment download, context current",
+    );
+  }
+  validateOptions(parsed.options, allowedOptions);
+
+  const env = overrides.env ?? process.env;
+  const usesCompanionControl = command.startsWith("cloud ") || command === "project map";
+  const api = createApiClient(overrides, {
+    baseUrl: usesCompanionControl || env.CODEX_TASKBOARD_COMPANION_URL !== undefined
+      ? resolveCompanionUrl(env)
+      : undefined,
+  });
+  switch (command) {
+    case "project list":
+      expectOperandCount(parsed, 0);
+      return api.request("GET", "/api/projects");
+    case "project create":
+      expectOperandCount(parsed, 0);
+      return api.request("POST", "/api/projects", {
+        ...optionalField("id", parsed.options.id),
+        name: requiredOption(parsed.options, "name"),
+        ...optionalField(
+          "workspacePath",
+          parsed.options["workspace-path"] === undefined
+            ? undefined
+            : resolveInputPath(parsed.options["workspace-path"], overrides),
+        ),
+      });
+    case "project map":
+      expectOperandCount(parsed, 1);
+      return api.request(
+        "PUT",
+        `/api/local/project-mappings/${encodeURIComponent(parsed.operands[0])}`,
+        {
+          workspacePath: resolveInputPath(
+            requiredOption(parsed.options, "workspace-path"),
+            overrides,
+          ),
+        },
+      );
+    case "cloud login":
+      expectOperandCount(parsed, 0);
+      return cloudLogin(
+        api,
+        requiredOption(parsed.options, "url"),
+        requiredOption(parsed.options, "actor-name"),
+        overrides,
+      );
+    case "cloud status":
+      expectOperandCount(parsed, 0);
+      return api.request("GET", "/api/local/cloud-session");
+    case "cloud logout":
+      expectOperandCount(parsed, 0);
+      return api.request("DELETE", "/api/local/cloud-session");
+    case "issue list":
+      expectOperandCount(parsed, 0);
+      return listIssues(api, parsed.options);
+    case "issue get":
+      expectOperandCount(parsed, 1);
+      return api.request("GET", taskPath(parsed.operands[0]));
+    case "issue create":
+      expectOperandCount(parsed, 0);
+      return createIssue(api, parsed.options, overrides);
+    case "issue update":
+      expectOperandCount(parsed, 1);
+      return updateIssue(api, parsed.operands[0], parsed.options, overrides);
+    case "issue move":
+      expectOperandCount(parsed, 1);
+      return moveIssue(api, parsed.operands[0], parsed.options, overrides);
+    case "issue archive":
+      expectOperandCount(parsed, 1);
+      return archiveIssue(api, parsed.operands[0], parsed.options, overrides, "archive");
+    case "issue restore":
+      expectOperandCount(parsed, 1);
+      return archiveIssue(api, parsed.operands[0], parsed.options, overrides, "restore");
+    case "issue relation":
+      expectOperandCount(parsed, 2);
+      return mutateIssueRelation(
+        api,
+        parsed.operands[0],
+        parsed.operands[1],
+        parsed.options,
+        overrides,
+      );
+    case "comment list":
+      expectOperandCount(parsed, 1);
+      return api.request("GET", `${taskPath(parsed.operands[0])}/comments`);
+    case "comment add":
+      expectOperandCount(parsed, 1);
+      return api.request("POST", `${taskPath(parsed.operands[0])}/comments`, {
+        body: requiredOption(parsed.options, "body"),
+        threadId: resolveThreadId(parsed.options, overrides),
+      });
+    case "comment update":
+      expectOperandCount(parsed, 1);
+      return api.request("PATCH", commentPath(parsed.operands[0]), {
+        body: requiredOption(parsed.options, "body"),
+        threadId: resolveThreadId(parsed.options, overrides),
+        version: explicitVersion(parsed.options["if-version"]),
+      });
+    case "comment delete":
+      expectOperandCount(parsed, 1);
+      return api.request("DELETE", commentPath(parsed.operands[0]), {
+        threadId: resolveThreadId(parsed.options, overrides),
+        version: explicitVersion(parsed.options["if-version"]),
+      });
+    case "attachment download":
+      expectOperandCount(parsed, 1);
+      return downloadAttachment(api, parsed.operands[0], parsed.options, overrides);
+    case "context current":
+      expectOperandCount(parsed, 0);
+      return currentContext(api, parsed.options, overrides);
+    default:
+      throw usageError(`Unsupported command: ${command}`);
+  }
+}
+
+function createApiClient(overrides, { baseUrl: explicitBaseUrl } = {}) {
+  const fetchImplementation = overrides.fetch ?? globalThis.fetch;
+  if (typeof fetchImplementation !== "function") {
+    throw new TaskctlError("fetch is not available", {
+      code: "CLIENT_UNAVAILABLE",
+      exitCode: 3,
+    });
+  }
+
+  const env = overrides.env ?? process.env;
+  const baseUrl = normalizeBaseUrl(explicitBaseUrl ?? env.CODEX_TASKBOARD_URL ?? DEFAULT_API_URL);
+
+  return {
+    async request(method, pathname, body) {
+      let response;
+      try {
+        response = await fetchImplementation(new URL(pathname, `${baseUrl}/`), {
+          method,
+          headers: {
+            accept: "application/json",
+            "x-taskboard-client": "taskctl",
+            ...(body === undefined ? {} : { "content-type": "application/json" }),
+          },
+          ...(body === undefined ? {} : { body: JSON.stringify(body) }),
+        });
+      } catch (error) {
+        throw new TaskctlError(`Cannot reach taskboard service at ${baseUrl}`, {
+          code: "SERVICE_UNAVAILABLE",
+          exitCode: 3,
+          details: error instanceof Error ? error.message : String(error),
+        });
+      }
+
+      const payload = await readResponse(response);
+      if (!response.ok) {
+        const apiError = extractApiError(payload, response.status);
+        throw new TaskctlError(apiError.message, {
+          code: apiError.code,
+          exitCode: response.status === 409 ? 5 : 4,
+          details: apiError.details,
+        });
+      }
+      if (!payload || typeof payload !== "object" || Array.isArray(payload)) {
+        throw new TaskctlError("Taskboard service returned an invalid JSON response", {
+          code: "INVALID_RESPONSE",
+          exitCode: 4,
+        });
+      }
+      return payload;
+    },
+    async download(pathname) {
+      let response;
+      try {
+        response = await fetchImplementation(new URL(pathname, `${baseUrl}/`), {
+          headers: {
+            accept: "*/*",
+            "x-taskboard-client": "taskctl",
+          },
+        });
+      } catch (error) {
+        throw new TaskctlError(`Cannot reach taskboard service at ${baseUrl}`, {
+          code: "SERVICE_UNAVAILABLE",
+          exitCode: 3,
+          details: error instanceof Error ? error.message : String(error),
+        });
+      }
+
+      if (!response.ok) {
+        const payload = await readResponse(response);
+        const apiError = extractApiError(payload, response.status);
+        throw new TaskctlError(apiError.message, {
+          code: apiError.code,
+          exitCode: response.status === 409 ? 5 : 4,
+          details: apiError.details,
+        });
+      }
+
+      const bytes = new Uint8Array(await response.arrayBuffer());
+      return {
+        bytes,
+        contentType: response.headers.get("content-type"),
+        size: Number(response.headers.get("content-length")) || bytes.byteLength,
+      };
+    },
+  };
+}
+
+async function downloadAttachment(api, attachmentId, options, overrides) {
+  const output = resolveInputPath(requiredOption(options, "output"), overrides);
+  const downloaded = await api.download(attachmentContentPath(attachmentId));
+  const write = overrides.writeFile ?? writeFile;
+  try {
+    await write(output, downloaded.bytes);
+  } catch (error) {
+    throw new TaskctlError(`Cannot write attachment file: ${output}`, {
+      code: "FILE_WRITE_FAILED",
+      exitCode: 2,
+      details: error instanceof Error ? error.message : String(error),
+    });
+  }
+  return {
+    attachmentId,
+    output,
+    contentType: downloaded.contentType,
+    size: downloaded.size,
+  };
+}
+
+async function cloudLogin(api, rawUrl, actorName, overrides) {
+  let remoteUrl;
+  try {
+    remoteUrl = normalizeCloudUrl(rawUrl);
+  } catch (error) {
+    throw new TaskctlError(error instanceof Error ? error.message : String(error), {
+      code: error?.code ?? "INVALID_CLOUD_URL",
+      exitCode: 2,
+    });
+  }
+  const sharedKey = overrides.readSecret
+    ? await overrides.readSecret()
+    : await readSecretFromInput(
+      overrides.stdin ?? process.stdin,
+      overrides.stderr ?? process.stderr,
+    );
+  if (typeof sharedKey !== "string" || !sharedKey) {
+    throw usageError("Cloud shared key cannot be empty");
+  }
+  return api.request("PUT", "/api/local/cloud-session", {
+    remoteUrl,
+    actorName,
+    sharedKey,
+  });
+}
+
+async function readSecretFromInput(input, output) {
+  if (!input.isTTY) {
+    let value = "";
+    for await (const chunk of input) value += chunk;
+    return value.replace(/\r?\n$/, "");
+  }
+
+  return new Promise((resolve, reject) => {
+    let value = "";
+    const wasRaw = input.isRaw;
+    const wasPaused = input.isPaused();
+    const finish = (error) => {
+      input.off("data", onData);
+      input.setRawMode(wasRaw);
+      if (wasPaused) input.pause();
+      output.write("\n");
+      if (error) reject(error);
+      else resolve(value);
+    };
+    const onData = (chunk) => {
+      for (const character of String(chunk)) {
+        if (character === "\r" || character === "\n") return finish();
+        if (character === "\u0003") {
+          return finish(new TaskctlError("Cloud login canceled", {
+            code: "CANCELED",
+            exitCode: 2,
+          }));
+        }
+        if (character === "\u007f" || character === "\b") {
+          value = value.slice(0, -1);
+        } else {
+          value += character;
+        }
+      }
+    };
+    output.write("Shared key: ");
+    input.setRawMode(true);
+    input.setEncoding("utf8");
+    input.resume();
+    input.on("data", onData);
+  });
+}
+
+async function listIssues(api, options) {
+  if (options.status !== undefined) {
+    assertStatus(options.status);
+  }
+  const search = new URLSearchParams();
+  if (options.project !== undefined) search.set("projectId", options.project);
+  if (options.status !== undefined) search.set("status", options.status);
+  const query = search.size > 0 ? `?${search}` : "";
+  return api.request("GET", `/api/tasks${query}`);
+}
+
+async function createIssue(api, options, overrides) {
+  const status = options.status ?? "backlog";
+  const priority = options.priority ?? "none";
+  assertStatus(status);
+  assertPriority(priority);
+
+  const developmentContext = developmentContextFromOptions(options, overrides);
+  const recurrence = recurrenceFromOptions(options);
+  const threadId = resolveThreadId(options, overrides);
+  return api.request("POST", "/api/tasks", {
+    projectId: requiredOption(options, "project"),
+    title: requiredOption(options, "title"),
+    description: await resolveDescription(options, overrides),
+    status,
+    priority,
+    labels: parseLabels(options.labels),
+    threadId,
+    ...optionalField("developmentContext", developmentContext),
+    ...optionalField("dueDate", options["due-date"]),
+    ...optionalField("recurrence", recurrence),
+  });
+}
+
+async function updateIssue(api, taskId, options, overrides) {
+  if (options.status !== undefined) assertStatus(options.status);
+  if (options.priority !== undefined) assertPriority(options.priority);
+
+  const developmentContext = developmentContextFromOptions(options, overrides);
+  const recurrence = recurrenceFromOptions(options);
+  const threadId = resolveThreadId(options, overrides);
+  const patch = {
+    ...optionalField("title", options.title),
+    ...optionalField("status", options.status),
+    ...optionalField("priority", options.priority),
+    ...optionalField("labels", options.labels === undefined ? undefined : parseLabels(options.labels)),
+    ...optionalField("developmentContext", developmentContext),
+    ...optionalField("dueDate", options["due-date"]),
+    ...optionalField("recurrence", recurrence),
+  };
+  if (options.description !== undefined || options["description-file"] !== undefined) {
+    patch.description = await resolveDescription(options, overrides);
+  }
+
+  if (Object.keys(patch).length === 0) {
+    throw usageError("issue update requires at least one field to update");
+  }
+  patch.threadId = threadId;
+  patch.version = await resolveVersion(api, taskId, options["if-version"]);
+  return api.request("PATCH", taskPath(taskId), patch);
+}
+
+async function moveIssue(api, taskId, options, overrides) {
+  const status = requiredOption(options, "status");
+  assertStatus(status);
+  const threadId = resolveThreadId(options, overrides);
+  return api.request("POST", `${taskPath(taskId)}/move`, {
+    status,
+    threadId,
+    version: await resolveVersion(api, taskId, options["if-version"]),
+  });
+}
+
+async function archiveIssue(api, taskId, options, overrides, action) {
+  const threadId = resolveThreadId(options, overrides);
+  return api.request("POST", `${taskPath(taskId)}/${action}`, {
+    threadId,
+    version: await resolveVersion(api, taskId, options["if-version"]),
+  });
+}
+
+async function mutateIssueRelation(api, action, taskId, options, overrides) {
+  if (action !== "add" && action !== "remove") {
+    throw usageError("issue relation action must be add or remove");
+  }
+  const type = requiredOption(options, "type");
+  if (!["parent", "blocks", "blocked_by", "related"].includes(type)) {
+    throw usageError("--type must be parent, blocks, blocked_by, or related");
+  }
+  const relatedTaskId = requiredOption(options, "issue");
+  const threadId = resolveThreadId(options, overrides);
+  const version = await resolveVersion(api, taskId, options["if-version"]);
+  return api.request(
+    action === "add" ? "POST" : "DELETE",
+    `${taskPath(taskId)}/relations/${type}/${encodeURIComponent(relatedTaskId)}`,
+    { threadId, version },
+  );
+}
+
+async function currentContext(api, options, overrides) {
+  const cwd = path.resolve(options.cwd ?? overrides.cwd ?? process.cwd());
+  const response = await api.request("GET", "/api/projects");
+  const projects = Array.isArray(response.projects) ? response.projects : [];
+  const matchingProjects = projects
+    .filter((candidate) => workspaceContains(candidate?.workspacePath, cwd))
+    .sort((left, right) => right.workspacePath.length - left.workspacePath.length);
+  const project = matchingProjects[0]
+    ?? projects.find((candidate) => candidate?.id === DEFAULT_PROJECT_ID)
+    ?? projects[0]
+    ?? null;
+  return { cwd, project };
+}
+
+function workspaceContains(workspacePath, cwd) {
+  if (typeof workspacePath !== "string" || workspacePath.length === 0) return false;
+  const relative = path.relative(path.resolve(workspacePath), cwd);
+  return relative === "" || (!relative.startsWith(`..${path.sep}`) && relative !== ".." && !path.isAbsolute(relative));
+}
+
+function resolveInputPath(value, overrides) {
+  return path.resolve(overrides.cwd ?? process.cwd(), value);
+}
+
+async function resolveVersion(api, taskId, rawVersion) {
+  if (rawVersion !== undefined) {
+    const version = Number(rawVersion);
+    if (!Number.isSafeInteger(version) || version < 1) {
+      throw usageError("--if-version must be a positive integer");
+    }
+    return version;
+  }
+
+  const response = await api.request("GET", taskPath(taskId));
+  const version = response.task?.version;
+  if (!Number.isSafeInteger(version) || version < 1) {
+    throw new TaskctlError("Taskboard service returned a task without a valid version", {
+      code: "INVALID_RESPONSE",
+      exitCode: 4,
+    });
+  }
+  return version;
+}
+
+async function resolveDescription(options, overrides) {
+  if (options.description !== undefined && options["description-file"] !== undefined) {
+    throw usageError("Use either --description or --description-file, not both");
+  }
+  if (options["description-file"] === undefined) {
+    return options.description ?? "";
+  }
+
+  const read = overrides.readFile ?? readFile;
+  try {
+    return await read(options["description-file"], "utf8");
+  } catch (error) {
+    throw new TaskctlError(`Cannot read description file: ${options["description-file"]}`, {
+      code: "FILE_READ_FAILED",
+      exitCode: 2,
+      details: error instanceof Error ? error.message : String(error),
+    });
+  }
+}
+
+function parseLabels(rawLabels) {
+  if (rawLabels === undefined || rawLabels === "") return [];
+  return [...new Set(rawLabels.split(",").map((label) => label.trim()).filter(Boolean))];
+}
+
+function developmentContextFromOptions(options, overrides) {
+  const branch = options["git-branch"];
+  const worktreePath = options["worktree-path"];
+  const worktreeBranch = options["worktree-branch"];
+  if (branch !== undefined && (worktreePath !== undefined || worktreeBranch !== undefined)) {
+    throw usageError("Use either --git-branch or --worktree-path/--worktree-branch, not both");
+  }
+  if (worktreeBranch !== undefined && worktreePath === undefined) {
+    throw usageError("--worktree-branch requires --worktree-path");
+  }
+  if (branch !== undefined) return { type: "branch", branch };
+  if (worktreePath !== undefined) {
+    return {
+      type: "worktree",
+      path: resolveInputPath(worktreePath, overrides),
+      branch: worktreeBranch ?? null,
+    };
+  }
+  return undefined;
+}
+
+function recurrenceFromOptions(options) {
+  const rawInterval = options["recurrence-interval"];
+  const unit = options["recurrence-unit"];
+  if (rawInterval === undefined && unit === undefined) return undefined;
+  if (rawInterval === undefined || unit === undefined) {
+    throw usageError("Use --recurrence-interval and --recurrence-unit together");
+  }
+  const interval = Number(rawInterval);
+  if (!Number.isSafeInteger(interval) || interval < 1 || interval > 365) {
+    throw usageError("--recurrence-interval must be an integer from 1 to 365");
+  }
+  if (!["day", "week", "month", "year"].includes(unit)) {
+    throw usageError("--recurrence-unit must be day, week, month, or year");
+  }
+  return { interval, unit };
+}
+
+function resolveThreadId(options, overrides) {
+  const env = overrides.env ?? process.env;
+  const value = options["thread-id"] ?? env.CODEX_THREAD_ID;
+  if (typeof value !== "string" || value.trim().length === 0) {
+    throw usageError("Codex conversation attribution requires --thread-id or CODEX_THREAD_ID");
+  }
+  const threadId = value.trim();
+  if (threadId.length > 256) {
+    throw usageError("--thread-id and CODEX_THREAD_ID cannot exceed 256 characters");
+  }
+  return threadId;
+}
+
+function requiredOption(options, name) {
+  const value = options[name];
+  if (value === undefined || value === "") {
+    throw usageError(`Missing required option --${name}`);
+  }
+  return value;
+}
+
+function optionalField(name, value) {
+  return value === undefined ? {} : { [name]: value };
+}
+
+function validateOptions(options, allowedOptions) {
+  for (const name of Object.keys(options)) {
+    if (!allowedOptions.has(name)) {
+      throw usageError(`Unknown option --${name}`);
+    }
+  }
+}
+
+function expectOperandCount(parsed, expected) {
+  if (parsed.operands.length !== expected) {
+    throw usageError(
+      expected === 0
+        ? `${parsed.resource} ${parsed.action} does not accept positional arguments`
+        : `${parsed.resource} ${parsed.action} requires exactly ${expected} positional ${
+            expected === 1 ? "argument" : "arguments"
+          }`,
+    );
+  }
+}
+
+function assertStatus(status) {
+  if (!isTaskStatus(status)) {
+    throw usageError(`Invalid status: ${status}. Expected one of: ${TASK_STATUSES.join(", ")}`);
+  }
+}
+
+function assertPriority(priority) {
+  if (!isTaskPriority(priority)) {
+    throw usageError(`Invalid priority: ${priority}`);
+  }
+}
+
+function taskPath(taskId) {
+  if (!taskId) throw usageError("Missing issue id");
+  return `/api/tasks/${encodeURIComponent(taskId)}`;
+}
+
+function commentPath(commentId) {
+  if (!commentId) throw usageError("Missing comment id");
+  return `/api/comments/${encodeURIComponent(commentId)}`;
+}
+
+function attachmentContentPath(attachmentId) {
+  if (!attachmentId) throw usageError("Missing attachment id");
+  return `/api/attachments/${encodeURIComponent(attachmentId)}/content`;
+}
+
+function explicitVersion(rawVersion) {
+  if (rawVersion === undefined) throw usageError("Missing required option --if-version");
+  const version = Number(rawVersion);
+  if (!Number.isSafeInteger(version) || version < 1) {
+    throw usageError("--if-version must be a positive integer");
+  }
+  return version;
+}
+
+function normalizeBaseUrl(rawUrl) {
+  let url;
+  try {
+    url = new URL(rawUrl);
+  } catch {
+    throw usageError("CODEX_TASKBOARD_URL must be a valid URL");
+  }
+  if (url.protocol !== "http:" && url.protocol !== "https:") {
+    throw usageError("CODEX_TASKBOARD_URL must use http or https");
+  }
+  url.pathname = url.pathname.replace(/\/$/, "");
+  url.search = "";
+  url.hash = "";
+  return url.toString().replace(/\/$/, "");
+}
+
+function resolveCompanionUrl(env) {
+  const rawUrl = env.CODEX_TASKBOARD_COMPANION_URL
+    ?? env.CODEX_TASKBOARD_URL
+    ?? DEFAULT_API_URL;
+  let url;
+  try {
+    url = new URL(rawUrl);
+  } catch {
+    throw usageError("Local companion URL must be a valid URL");
+  }
+  const isLoopback = url.hostname === "localhost"
+    || url.hostname === "127.0.0.1"
+    || url.hostname === "[::1]";
+  if (
+    !isLoopback
+    || (url.protocol !== "http:" && url.protocol !== "https:")
+    || url.username
+    || url.password
+    || (url.pathname !== "/" && url.pathname !== "")
+    || url.search
+    || url.hash
+  ) {
+    throw usageError("Local companion URL must be a loopback HTTP or HTTPS origin");
+  }
+  return url.origin;
+}
+
+async function readResponse(response) {
+  const text = await response.text();
+  if (!text) return {};
+  try {
+    return JSON.parse(text);
+  } catch {
+    throw new TaskctlError("Taskboard service returned invalid JSON", {
+      code: "INVALID_RESPONSE",
+      exitCode: 4,
+    });
+  }
+}
+
+function extractApiError(payload, status) {
+  if (payload?.error && typeof payload.error === "object") {
+    return {
+      code: payload.error.code ?? `HTTP_${status}`,
+      message: payload.error.message ?? `Taskboard service returned HTTP ${status}`,
+      details: payload.error.details,
+    };
+  }
+  return {
+    code: payload?.code ?? `HTTP_${status}`,
+    message:
+      payload?.message ??
+      (typeof payload?.error === "string" ? payload.error : `Taskboard service returned HTTP ${status}`),
+    details: payload?.details,
+  };
+}
+
+function normalizeError(error) {
+  if (error instanceof TaskctlError) return error;
+  return new TaskctlError(error instanceof Error ? error.message : String(error), {
+    code: "INTERNAL_ERROR",
+    exitCode: 1,
+  });
+}
+
+function usageError(message) {
+  return new TaskctlError(message, { code: "USAGE_ERROR", exitCode: 2 });
+}
+
+function writeJson(stream, payload) {
+  stream.write(`${JSON.stringify(payload)}\n`);
+}
+
+const entrypoint = process.argv[1] ? realpathSync(process.argv[1]) : "";
+if (entrypoint === realpathSync(fileURLToPath(import.meta.url))) {
+  process.exitCode = await main();
+}
diff --git a/apps/codex-taskboard/cloud/migrations/0001_initial.sql b/apps/codex-taskboard/cloud/migrations/0001_initial.sql
new file mode 100644
index 000000000..edc013434
--- /dev/null
+++ b/apps/codex-taskboard/cloud/migrations/0001_initial.sql
@@ -0,0 +1,33 @@
+CREATE TABLE projects (id TEXT PRIMARY KEY, name TEXT NOT NULL, workspace_path TEXT CHECK (workspace_path IS NULL), next_task_number INTEGER NOT NULL DEFAULT 1 CHECK (next_task_number > 0), created_at TEXT NOT NULL, updated_at TEXT NOT NULL);
+CREATE TABLE tasks (id TEXT PRIMARY KEY, identifier TEXT NOT NULL UNIQUE, project_id TEXT NOT NULL REFERENCES projects(id), title TEXT NOT NULL, description TEXT NOT NULL DEFAULT '', status TEXT NOT NULL CHECK (status IN ('backlog', 'todo', 'in_progress', 'in_review', 'blocked', 'done', 'canceled')), priority TEXT NOT NULL CHECK (priority IN ('none', 'urgent', 'high', 'medium', 'low')), labels TEXT NOT NULL DEFAULT '[]', sort_order REAL NOT NULL, thread_id TEXT, creator_type TEXT NOT NULL CHECK (creator_type IN ('user', 'agent')), creator_id TEXT NOT NULL, creator_name TEXT NOT NULL, creator_avatar_url TEXT, assignee_type TEXT NOT NULL CHECK (assignee_type IN ('user', 'agent')), assignee_id TEXT NOT NULL, assignee_name TEXT NOT NULL, assignee_avatar_url TEXT, workflow_id TEXT, development_context_type TEXT CHECK (development_context_type IS NULL OR development_context_type IN ('branch', 'worktree')), development_branch TEXT, due_date TEXT, recurrence_interval INTEGER, recurrence_unit TEXT, archived_at TEXT, version INTEGER NOT NULL DEFAULT 1 CHECK (version > 0), created_at TEXT NOT NULL, updated_at TEXT NOT NULL);
+CREATE INDEX tasks_project_status_sort ON tasks(project_id, archived_at, status, sort_order, created_at);
+CREATE TABLE task_relations (relation_type TEXT NOT NULL CHECK (relation_type IN ('parent', 'blocks', 'related')), source_task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE, target_task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE, created_at TEXT NOT NULL, CHECK (source_task_id <> target_task_id), CHECK (relation_type <> 'related' OR source_task_id < target_task_id), PRIMARY KEY (relation_type, source_task_id, target_task_id));
+CREATE INDEX task_relations_target ON task_relations(relation_type, target_task_id);
+CREATE UNIQUE INDEX task_relations_one_parent ON task_relations(target_task_id) WHERE relation_type = 'parent';
+CREATE TRIGGER task_relations_prevent_parent_cycle BEFORE INSERT ON task_relations WHEN NEW.relation_type = 'parent' BEGIN SELECT RAISE(ABORT, 'RELATION_CYCLE') WHERE EXISTS (WITH RECURSIVE ancestors(id) AS (SELECT source_task_id FROM task_relations WHERE relation_type = 'parent' AND target_task_id = NEW.source_task_id UNION SELECT task_relations.source_task_id FROM task_relations JOIN ancestors ON task_relations.target_task_id = ancestors.id WHERE task_relations.relation_type = 'parent') SELECT 1 FROM ancestors WHERE id = NEW.target_task_id); END;
+CREATE TABLE comments (id TEXT PRIMARY KEY, task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE, body TEXT NOT NULL, thread_id TEXT, author_type TEXT NOT NULL CHECK (author_type IN ('user', 'agent')), author_id TEXT NOT NULL, author_name TEXT NOT NULL, author_avatar_url TEXT, version INTEGER NOT NULL DEFAULT 1 CHECK (version > 0), created_at TEXT NOT NULL, updated_at TEXT NOT NULL);
+CREATE INDEX comments_task_created ON comments(task_id, created_at, id);
+CREATE TABLE attachments (id TEXT PRIMARY KEY, task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE, comment_id TEXT REFERENCES comments(id) ON DELETE CASCADE, filename TEXT NOT NULL, content_type TEXT NOT NULL, size INTEGER NOT NULL CHECK (size >= 0), created_at TEXT NOT NULL);
+CREATE INDEX attachments_task_created ON attachments(task_id, created_at, id);
+CREATE INDEX attachments_comment_created ON attachments(comment_id, created_at, id);
+CREATE TABLE workflow_workspaces (project_id TEXT PRIMARY KEY REFERENCES projects(id) ON DELETE CASCADE, workspace TEXT NOT NULL, version INTEGER NOT NULL DEFAULT 1 CHECK (version > 0), updated_at TEXT NOT NULL);
+CREATE TABLE global_revision (singleton INTEGER PRIMARY KEY CHECK (singleton = 1), revision INTEGER NOT NULL DEFAULT 0 CHECK (revision >= 0));
+INSERT INTO global_revision (singleton, revision) VALUES (1, 0);
+CREATE TRIGGER projects_revision_insert AFTER INSERT ON projects BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER projects_revision_update AFTER UPDATE ON projects BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER projects_revision_delete AFTER DELETE ON projects BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER tasks_revision_insert AFTER INSERT ON tasks BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER tasks_revision_update AFTER UPDATE ON tasks BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER tasks_revision_delete AFTER DELETE ON tasks BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER task_relations_revision_insert AFTER INSERT ON task_relations BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER task_relations_revision_update AFTER UPDATE ON task_relations BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER task_relations_revision_delete AFTER DELETE ON task_relations BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER comments_revision_insert AFTER INSERT ON comments BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER comments_revision_update AFTER UPDATE ON comments BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER comments_revision_delete AFTER DELETE ON comments BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER attachments_revision_insert AFTER INSERT ON attachments BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER attachments_revision_update AFTER UPDATE ON attachments BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER attachments_revision_delete AFTER DELETE ON attachments BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER workflow_workspaces_revision_insert AFTER INSERT ON workflow_workspaces BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER workflow_workspaces_revision_update AFTER UPDATE ON workflow_workspaces BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
+CREATE TRIGGER workflow_workspaces_revision_delete AFTER DELETE ON workflow_workspaces BEGIN UPDATE global_revision SET revision = revision + 1 WHERE singleton = 1; END;
diff --git a/apps/codex-taskboard/cloud/migrations/0002_project_archive.sql b/apps/codex-taskboard/cloud/migrations/0002_project_archive.sql
new file mode 100644
index 000000000..5a4f5c431
--- /dev/null
+++ b/apps/codex-taskboard/cloud/migrations/0002_project_archive.sql
@@ -0,0 +1,2 @@
+ALTER TABLE projects ADD COLUMN archived_at TEXT;
+CREATE INDEX projects_archived_created ON projects(archived_at, created_at, id);
diff --git a/apps/codex-taskboard/cloud/src/index.mjs b/apps/codex-taskboard/cloud/src/index.mjs
new file mode 100644
index 000000000..6e8c64dbf
--- /dev/null
+++ b/apps/codex-taskboard/cloud/src/index.mjs
@@ -0,0 +1,2274 @@
+import { normalizeWorkflowSnapshot } from "../../shared/workflow-control-flow.mjs";
+import { DEFAULT_PROJECT_ID } from "../../shared/domain.mjs";
+
+const JSON_BODY_LIMIT = 1024 * 1024;
+const ATTACHMENT_BODY_LIMIT = 25 * 1024 * 1024;
+const PROJECT_ID_PATTERN = /^[a-z0-9](?:[a-z0-9-]{0,62}[a-z0-9])?$/;
+const TASK_STATUSES = [
+  "backlog",
+  "todo",
+  "in_progress",
+  "in_review",
+  "blocked",
+  "done",
+  "canceled",
+];
+const TASK_PRIORITIES = ["none", "urgent", "high", "medium", "low"];
+const INLINE_ATTACHMENT_TYPES = new Set([
+  "application/pdf",
+  "image/avif",
+  "image/gif",
+  "image/jpeg",
+  "image/png",
+  "image/webp",
+  "text/plain",
+]);
+
+class ApiError extends Error {
+  constructor(status, code, message, details) {
+    super(message);
+    this.status = status;
+    this.code = code;
+    this.details = details;
+  }
+}
+
+function json(status, value, headers = {}) {
+  return new Response(JSON.stringify(value), {
+    status,
+    headers: {
+      "cache-control": "no-store",
+      "content-type": "application/json; charset=utf-8",
+      ...headers,
+    },
+  });
+}
+
+function empty(status, headers = {}) {
+  return new Response(null, {
+    status,
+    headers: { "cache-control": "no-store", ...headers },
+  });
+}
+
+function methodNotAllowed(allowed) {
+  throw new ApiError(405, "METHOD_NOT_ALLOWED", "Method not allowed", {
+    allowed,
+  });
+}
+
+function assertPlainObject(value) {
+  if (value === null || typeof value !== "object" || Array.isArray(value)) {
+    throw new ApiError(400, "INVALID_BODY", "Request body must be a JSON object");
+  }
+}
+
+function assertAllowedKeys(value, allowed) {
+  const unknown = Object.keys(value).filter((key) => !allowed.has(key));
+  if (unknown.length > 0) {
+    throw new ApiError(
+      400,
+      "UNKNOWN_FIELD",
+      `Unknown field${unknown.length === 1 ? "" : "s"}: ${unknown.join(", ")}`,
+    );
+  }
+}
+
+function stringField(value, name, {
+  required = false,
+  nullable = false,
+  maxLength,
+} = {}) {
+  if (value === undefined) {
+    if (required) {
+      throw new ApiError(400, "INVALID_FIELD", `'${name}' is required`);
+    }
+    return undefined;
+  }
+  if (nullable && value === null) return null;
+  if (typeof value !== "string") {
+    throw new ApiError(
+      400,
+      "INVALID_FIELD",
+      `'${name}' must be a string${nullable ? " or null" : ""}`,
+    );
+  }
+  const normalized = value.trim();
+  if (required && normalized.length === 0) {
+    throw new ApiError(400, "INVALID_FIELD", `'${name}' cannot be empty`);
+  }
+  if (normalized.length > maxLength) {
+    throw new ApiError(400, "INVALID_FIELD", `'${name}' cannot exceed ${maxLength} characters`);
+  }
+  return normalized;
+}
+
+function parseVersion(value, { allowZero = false } = {}) {
+  if (!Number.isSafeInteger(value) || value < (allowZero ? 0 : 1)) {
+    throw new ApiError(
+      400,
+      "INVALID_FIELD",
+      `'version' must be a ${allowZero ? "non-negative" : "positive"} integer`,
+    );
+  }
+  return value;
+}
+
+function parseStatus(value, fallback) {
+  const status = value ?? fallback;
+  if (!TASK_STATUSES.includes(status)) {
+    throw new ApiError(
+      400,
+      "INVALID_FIELD",
+      `'status' must be one of: ${TASK_STATUSES.join(", ")}`,
+    );
+  }
+  return status;
+}
+
+function parsePriority(value, fallback) {
+  const priority = value ?? fallback;
+  if (!TASK_PRIORITIES.includes(priority)) {
+    throw new ApiError(
+      400,
+      "INVALID_FIELD",
+      "'priority' must be none, urgent, high, medium, or low",
+    );
+  }
+  return priority;
+}
+
+function parseLabels(value) {
+  if (!Array.isArray(value) || value.length > 20) {
+    throw new ApiError(400, "INVALID_FIELD", "'labels' must be an array with at most 20 entries");
+  }
+  const labels = value.map((label) => {
+    if (typeof label !== "string") {
+      throw new ApiError(400, "INVALID_FIELD", "Every label must be a string");
+    }
+    const normalized = label.trim();
+    if (normalized.length === 0 || normalized.length > 64) {
+      throw new ApiError(400, "INVALID_FIELD", "Labels must contain 1 to 64 characters");
+    }
+    return normalized;
+  });
+  if (new Set(labels).size !== labels.length) {
+    throw new ApiError(400, "INVALID_FIELD", "Labels must be unique");
+  }
+  return labels;
+}
+
+function parseSortOrder(value) {
+  if (
+    typeof value !== "number"
+    || !Number.isFinite(value)
+    || Math.abs(value) > 1_000_000_000_000
+  ) {
+    throw new ApiError(
+      400,
+      "INVALID_FIELD",
+      "'sortOrder' must be a finite number between -1000000000000 and 1000000000000",
+    );
+  }
+  return value;
+}
+
+function parseDueDate(value) {
+  const date = stringField(value, "dueDate", { nullable: true, maxLength: 10 });
+  if (date !== null && date !== undefined && !/^\d{4}-\d{2}-\d{2}$/.test(date)) {
+    throw new ApiError(400, "INVALID_FIELD", "'dueDate' must use YYYY-MM-DD");
+  }
+  return date;
+}
+
+function parseRecurrence(value) {
+  if (value === null) return null;
+  assertPlainObject(value);
+  assertAllowedKeys(value, new Set(["interval", "unit"]));
+  if (!Number.isSafeInteger(value.interval) || value.interval < 1 || value.interval > 365) {
+    throw new ApiError(
+      400,
+      "INVALID_FIELD",
+      "'recurrence.interval' must be an integer from 1 to 365",
+    );
+  }
+  if (!["day", "week", "month", "year"].includes(value.unit)) {
+    throw new ApiError(
+      400,
+      "INVALID_FIELD",
+      "'recurrence.unit' must be day, week, month, or year",
+    );
+  }
+  return { interval: value.interval, unit: value.unit };
+}
+
+function parseDevelopmentContext(value) {
+  if (value === null) return null;
+  assertPlainObject(value);
+  if (value.type === "branch") {
+    assertAllowedKeys(value, new Set(["type", "branch"]));
+    return {
+      type: "branch",
+      branch: stringField(value.branch, "developmentContext.branch", {
+        required: true,
+        maxLength: 512,
+      }),
+    };
+  }
+  if (value.type === "worktree") {
+    assertAllowedKeys(value, new Set(["type", "path", "branch"]));
+    const worktreePath = stringField(value.path, "developmentContext.path", {
+      maxLength: 4096,
+    });
+    if (worktreePath?.includes("\0")) {
+      throw new ApiError(
+        400,
+        "INVALID_FIELD",
+        "'developmentContext.path' cannot contain null bytes",
+      );
+    }
+    return {
+      type: "worktree",
+      branch: stringField(value.branch ?? null, "developmentContext.branch", {
+        nullable: true,
+        maxLength: 512,
+      }),
+    };
+  }
+  throw new ApiError(
+    400,
+    "INVALID_FIELD",
+    "'developmentContext.type' must be branch or worktree",
+  );
+}
+
+function parseThreadId(value) {
+  if (value === undefined) return undefined;
+  return stringField(value, "threadId", { required: true, maxLength: 256 });
+}
+
+function parseWorkflowId(value) {
+  const workflowId = stringField(value, "workflowId", {
+    nullable: true,
+    maxLength: 128,
+  });
+  if (workflowId === "") {
+    throw new ApiError(400, "INVALID_FIELD", "'workflowId' cannot be empty");
+  }
+  return workflowId;
+}
+
+function parseAssigneeTarget(value) {
+  if (value === undefined) return undefined;
+  if (!["current-user", "codex-agent"].includes(value)) {
+    throw new ApiError(
+      400,
+      "INVALID_FIELD",
+      "'assigneeTarget' must be current-user or codex-agent",
+    );
+  }
+  return value;
+}
+
+function slugify(value) {
+  return value
+    .toLowerCase()
+    .replace(/[^a-z0-9]+/g, "-")
+    .replace(/^-+|-+$/g, "")
+    .slice(0, 64);
+}
+
+function validateProjectId(value) {
+  const id = stringField(value, "id", { required: true, maxLength: 64 });
+  if (!PROJECT_ID_PATTERN.test(id)) {
+    throw new ApiError(
+      400,
+      "INVALID_FIELD",
+      "'id' must be a lowercase slug containing letters, numbers, or hyphens",
+    );
+  }
+  return id;
+}
+
+function projectPrefix(projectId) {
+  const prefix = projectId.toUpperCase().replace(/[^A-Z0-9]+/g, "");
+  return (prefix || "TASK").slice(0, 12);
+}
+
+function now() {
+  return new Date().toISOString();
+}
+
+function uuid() {
+  return crypto.randomUUID();
+}
+
+function decodeBasicCredentials(header) {
+  if (!header?.startsWith("Basic ")) return null;
+  let bytes;
+  try {
+    const binary = atob(header.slice(6).trim());
+    bytes = Uint8Array.from(binary, (character) => character.charCodeAt(0));
+  } catch {
+    return null;
+  }
+  let value;
+  try {
+    value = new TextDecoder("utf-8", { fatal: true }).decode(bytes);
+  } catch {
+    return null;
+  }
+  const separator = value.indexOf(":");
+  if (separator < 1) return null;
+  return {
+    username: value.slice(0, separator),
+    password: value.slice(separator + 1),
+  };
+}
+
+function unauthorized() {
+  return json(
+    401,
+    { error: { code: "UNAUTHORIZED", message: "Valid Basic credentials are required" } },
+    { "www-authenticate": 'Basic realm="Codex Taskboard", charset="UTF-8"' },
+  );
+}
+
+async function authenticate(request, env) {
+  if (typeof env.TASKBOARD_SHARED_SECRET !== "string" || env.TASKBOARD_SHARED_SECRET === "") {
+    throw new ApiError(
+      500,
+      "SERVER_MISCONFIGURED",
+      "TASKBOARD_SHARED_SECRET is not configured",
+    );
+  }
+  const credentials = decodeBasicCredentials(request.headers.get("authorization"));
+  if (!credentials) return null;
+  const encoder = new TextEncoder();
+  const [providedSecret, configuredSecret] = await Promise.all([
+    crypto.subtle.digest("SHA-256", encoder.encode(credentials.password)),
+    crypto.subtle.digest("SHA-256", encoder.encode(env.TASKBOARD_SHARED_SECRET)),
+  ]);
+  if (!crypto.subtle.timingSafeEqual(providedSecret, configuredSecret)) return null;
+  const username = stringField(credentials.username, "Basic username", {
+    required: true,
+    maxLength: 120,
+  });
+  const userId = `basic:${encodeURIComponent(username.toLowerCase())}`;
+  if (request.headers.get("x-taskboard-client") === "taskctl") {
+    return {
+      type: "agent",
+      id: `${userId}:codex-agent`,
+      name: `Codex Agent (${username})`,
+      avatarUrl: null,
+      username,
+    };
+  }
+  return {
+    type: "user",
+    id: userId,
+    name: username,
+    avatarUrl: null,
+    username,
+  };
+}
+
+function resolveAssignee(target, actor) {
+  if (target === undefined || target === "current-user") return actor;
+  const userId = `basic:${encodeURIComponent(actor.username.toLowerCase())}`;
+  return {
+    type: "agent",
+    id: `${userId}:codex-agent`,
+    name: `Codex Agent (${actor.username})`,
+    avatarUrl: null,
+  };
+}
+
+async function readJson(request) {
+  const contentType = request.headers.get("content-type") ?? "";
+  if (!contentType.toLowerCase().startsWith("application/json")) {
+    throw new ApiError(
+      415,
+      "UNSUPPORTED_MEDIA_TYPE",
+      "Content-Type must be application/json",
+    );
+  }
+  const contentLength = Number(request.headers.get("content-length") ?? 0);
+  if (contentLength > JSON_BODY_LIMIT) {
+    throw new ApiError(413, "BODY_TOO_LARGE", "JSON body cannot exceed 1 MiB");
+  }
+  const text = await request.text();
+  if (new TextEncoder().encode(text).byteLength > JSON_BODY_LIMIT) {
+    throw new ApiError(413, "BODY_TOO_LARGE", "JSON body cannot exceed 1 MiB");
+  }
+  try {
+    return JSON.parse(text);
+  } catch {
+    throw new ApiError(400, "INVALID_JSON", "Request body is not valid JSON");
+  }
+}
+
+async function readAttachment(request) {
+  const contentLength = Number(request.headers.get("content-length") ?? 0);
+  if (contentLength > ATTACHMENT_BODY_LIMIT) {
+    throw new ApiError(413, "BODY_TOO_LARGE", "Attachment cannot exceed 25 MiB");
+  }
+  const body = await request.arrayBuffer();
+  if (body.byteLength > ATTACHMENT_BODY_LIMIT) {
+    throw new ApiError(413, "BODY_TOO_LARGE", "Attachment cannot exceed 25 MiB");
+  }
+  return body;
+}
+
+function parseAttachmentHeaders(request) {
+  const encodedFilename = request.headers.get("x-taskboard-filename");
+  if (encodedFilename === null) {
+    throw new ApiError(400, "INVALID_FILENAME", "X-Taskboard-Filename is required");
+  }
+  let filename;
+  try {
+    filename = decodeURIComponent(encodedFilename).trim();
+  } catch {
+    throw new ApiError(
+      400,
+      "INVALID_FILENAME",
+      "Attachment filename contains invalid encoding",
+    );
+  }
+  if (
+    filename.length === 0
+    || filename.length > 240
+    || filename === "."
+    || filename === ".."
+    || /[\u0000-\u001f\u007f/\\]/.test(filename)
+  ) {
+    throw new ApiError(400, "INVALID_FILENAME", "Attachment filename is invalid");
+  }
+  const rawContentType = request.headers.get("content-type");
+  const contentType = rawContentType
+    ? rawContentType.split(";", 1)[0].trim().toLowerCase()
+    : "application/octet-stream";
+  if (
+    contentType.length === 0
+    || contentType.length > 200
+    || !/^[!#$%&'*+.^_`|~0-9a-z-]+\/[!#$%&'*+.^_`|~0-9a-z-]+$/.test(contentType)
+  ) {
+    throw new ApiError(
+      415,
+      "UNSUPPORTED_MEDIA_TYPE",
+      "Attachment Content-Type is invalid",
+    );
+  }
+  return { filename, contentType };
+}
+
+function projectFromRow(row) {
+  return {
+    id: row.id,
+    name: row.name,
+    workspacePath: null,
+    archivedAt: row.archived_at,
+    issueCount: Number(row.issue_count ?? 0),
+    createdAt: row.created_at,
+    updatedAt: row.updated_at,
+  };
+}
+
+function developmentContextFromRow(row) {
+  if (row.development_context_type === "worktree") {
+    return {
+      type: "worktree",
+      path: null,
+      branch: row.development_branch,
+    };
+  }
+  if (row.development_context_type === "branch") {
+    return { type: "branch", branch: row.development_branch };
+  }
+  return null;
+}
+
+function taskFromRow(row) {
+  return {
+    id: row.id,
+    identifier: row.identifier,
+    projectId: row.project_id,
+    title: row.title,
+    description: row.description,
+    status: row.status,
+    priority: row.priority,
+    labels: JSON.parse(row.labels),
+    sortOrder: row.sort_order,
+    threadId: row.thread_id,
+    creatorType: row.creator_type,
+    creatorId: row.creator_id,
+    creatorName: row.creator_name,
+    creatorAvatarUrl: row.creator_avatar_url,
+    assignee: {
+      type: row.assignee_type,
+      id: row.assignee_id,
+      name: row.assignee_name,
+      avatarUrl: row.assignee_avatar_url,
+    },
+    workflowId: row.workflow_id,
+    developmentContext: developmentContextFromRow(row),
+    dueDate: row.due_date,
+    recurrence: row.recurrence_interval && row.recurrence_unit
+      ? { interval: row.recurrence_interval, unit: row.recurrence_unit }
+      : null,
+    archivedAt: row.archived_at,
+    version: row.version,
+    createdAt: row.created_at,
+    updatedAt: row.updated_at,
+  };
+}
+
+function taskRelationSummaryFromRow(row) {
+  return {
+    id: row.id,
+    identifier: row.identifier,
+    projectId: row.project_id,
+    title: row.title,
+    status: row.status,
+    priority: row.priority,
+    threadId: row.thread_id,
+    assignee: {
+      type: row.assignee_type,
+      id: row.assignee_id,
+      name: row.assignee_name,
+      avatarUrl: row.assignee_avatar_url,
+    },
+    archivedAt: row.archived_at,
+  };
+}
+
+function commentFromRow(row, attachments = []) {
+  return {
+    id: row.id,
+    taskId: row.task_id,
+    body: row.body,
+    threadId: row.thread_id,
+    authorType: row.author_type,
+    authorId: row.author_id,
+    authorName: row.author_name,
+    authorAvatarUrl: row.author_avatar_url,
+    attachments,
+    version: row.version,
+    createdAt: row.created_at,
+    updatedAt: row.updated_at,
+  };
+}
+
+function attachmentFromRow(row) {
+  return {
+    id: row.id,
+    taskId: row.task_id,
+    commentId: row.comment_id,
+    filename: row.filename,
+    contentType: row.content_type,
+    size: row.size,
+    createdAt: row.created_at,
+  };
+}
+
+async function all(statement) {
+  return (await statement.all()).results;
+}
+
+function changed(result) {
+  if (typeof result?.meta?.changes !== "number") {
+    throw new Error("D1 mutation did not return change metadata");
+  }
+  return result.meta.changes > 0;
+}
+
+async function requireProject(env, id) {
+  const row = await env.DB.prepare(
+    "SELECT * FROM projects WHERE id = ? AND archived_at IS NULL",
+  ).bind(id).first();
+  if (!row) {
+    throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${id}' does not exist`);
+  }
+  return row;
+}
+
+async function taskRow(env, id) {
+  return env.DB.prepare(
+    "SELECT * FROM tasks WHERE id = ? OR identifier = ?",
+  ).bind(id, id).first();
+}
+
+async function requireTaskRow(env, id) {
+  const row = await taskRow(env, id);
+  if (!row) throw new ApiError(404, "TASK_NOT_FOUND", `Task '${id}' does not exist`);
+  return row;
+}
+
+function assertTaskVersion(row, expectedVersion) {
+  if (row.version !== expectedVersion) {
+    throw new ApiError(
+      409,
+      "VERSION_CONFLICT",
+      "Task was changed by another client",
+      { expectedVersion, actualVersion: row.version },
+    );
+  }
+}
+
+async function attachmentsForComment(env, commentId) {
+  return (
+    await all(
+      env.DB.prepare(
+        "SELECT * FROM attachments WHERE comment_id = ? ORDER BY created_at, id",
+      ).bind(commentId),
+    )
+  ).map(attachmentFromRow);
+}
+
+async function hydrateComment(env, row) {
+  return commentFromRow(row, await attachmentsForComment(env, row.id));
+}
+
+async function hydrateTask(env, row) {
+  const task = taskFromRow(row);
+  const [parent, subIssues, blockedBy, blocks, related] = await Promise.all([
+    env.DB.prepare(`
+      SELECT tasks.*
+      FROM task_relations
+      JOIN tasks ON tasks.id = task_relations.source_task_id
+      WHERE task_relations.relation_type = 'parent'
+        AND task_relations.target_task_id = ?
+    `).bind(task.id).first(),
+    all(env.DB.prepare(`
+      SELECT tasks.*
+      FROM task_relations
+      JOIN tasks ON tasks.id = task_relations.target_task_id
+      WHERE task_relations.relation_type = 'parent'
+        AND task_relations.source_task_id = ?
+      ORDER BY tasks.sort_order, tasks.created_at, tasks.id
+    `).bind(task.id)),
+    all(env.DB.prepare(`
+      SELECT tasks.*
+      FROM task_relations
+      JOIN tasks ON tasks.id = task_relations.source_task_id
+      WHERE task_relations.relation_type = 'blocks'
+        AND task_relations.target_task_id = ?
+      ORDER BY tasks.sort_order, tasks.created_at, tasks.id
+    `).bind(task.id)),
+    all(env.DB.prepare(`
+      SELECT tasks.*
+      FROM task_relations
+      JOIN tasks ON tasks.id = task_relations.target_task_id
+      WHERE task_relations.relation_type = 'blocks'
+        AND task_relations.source_task_id = ?
+      ORDER BY tasks.sort_order, tasks.created_at, tasks.id
+    `).bind(task.id)),
+    all(env.DB.prepare(`
+      SELECT tasks.*
+      FROM task_relations
+      JOIN tasks ON tasks.id = CASE
+        WHEN task_relations.source_task_id = ? THEN task_relations.target_task_id
+        ELSE task_relations.source_task_id
+      END
+      WHERE task_relations.relation_type = 'related'
+        AND (
+          task_relations.source_task_id = ?
+          OR task_relations.target_task_id = ?
+        )
+      ORDER BY tasks.sort_order, tasks.created_at, tasks.id
+    `).bind(task.id, task.id, task.id)),
+  ]);
+  task.relations = {
+    parent: parent ? taskRelationSummaryFromRow(parent) : null,
+    subIssues: subIssues.map(taskRelationSummaryFromRow),
+    blockedBy: blockedBy.map(taskRelationSummaryFromRow),
+    blocks: blocks.map(taskRelationSummaryFromRow),
+    related: related.map(taskRelationSummaryFromRow),
+  };
+  return task;
+}
+
+async function getTask(env, id) {
+  const row = await taskRow(env, id);
+  return row ? hydrateTask(env, row) : null;
+}
+
+function parseProjectCreate(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set(["id", "name", "workspacePath"]));
+  const name = stringField(body.name, "name", { required: true, maxLength: 120 });
+  const id = validateProjectId(body.id ?? slugify(name));
+  if (body.workspacePath !== undefined && body.workspacePath !== null) {
+    const workspacePath = stringField(body.workspacePath, "workspacePath", {
+      required: true,
+      maxLength: 4096,
+    });
+    if (workspacePath.includes("\0")) {
+      throw new ApiError(400, "INVALID_FIELD", "'workspacePath' cannot contain null bytes");
+    }
+  }
+  return { id, name };
+}
+
+function parseTaskCreate(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set([
+    "projectId",
+    "title",
+    "description",
+    "status",
+    "priority",
+    "labels",
+    "sortOrder",
+    "threadId",
+    "assigneeTarget",
+    "workflowId",
+    "developmentContext",
+    "dueDate",
+    "recurrence",
+  ]));
+  const input = {
+    projectId: validateProjectId(body.projectId ?? "local"),
+    title: stringField(body.title, "title", { required: true, maxLength: 240 }),
+    description: stringField(body.description ?? "", "description", { maxLength: 100_000 }),
+    status: parseStatus(body.status, "backlog"),
+    priority: parsePriority(body.priority, "none"),
+    labels: body.labels === undefined ? [] : parseLabels(body.labels),
+    sortOrder: body.sortOrder === undefined ? undefined : parseSortOrder(body.sortOrder),
+    threadId: parseThreadId(body.threadId),
+    assigneeTarget: parseAssigneeTarget(body.assigneeTarget),
+    workflowId: parseWorkflowId(body.workflowId ?? null),
+    developmentContext: parseDevelopmentContext(body.developmentContext ?? null),
+    dueDate: parseDueDate(body.dueDate ?? null),
+    recurrence: parseRecurrence(body.recurrence ?? null),
+  };
+  if (input.recurrence && !input.dueDate) {
+    throw new ApiError(400, "INVALID_FIELD", "A recurring issue requires 'dueDate'");
+  }
+  return input;
+}
+
+function parseTaskPatch(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set([
+    "version",
+    "title",
+    "description",
+    "status",
+    "priority",
+    "labels",
+    "threadId",
+    "assigneeTarget",
+    "workflowId",
+    "developmentContext",
+    "dueDate",
+    "recurrence",
+  ]));
+  const changes = {};
+  if (body.title !== undefined) {
+    changes.title = stringField(body.title, "title", { required: true, maxLength: 240 });
+  }
+  if (body.description !== undefined) {
+    changes.description = stringField(body.description, "description", { maxLength: 100_000 });
+  }
+  if (body.status !== undefined) changes.status = parseStatus(body.status);
+  if (body.priority !== undefined) changes.priority = parsePriority(body.priority);
+  if (body.labels !== undefined) changes.labels = parseLabels(body.labels);
+  if (body.workflowId !== undefined) changes.workflowId = parseWorkflowId(body.workflowId);
+  if (body.developmentContext !== undefined) {
+    changes.developmentContext = parseDevelopmentContext(body.developmentContext);
+  }
+  if (body.dueDate !== undefined) changes.dueDate = parseDueDate(body.dueDate);
+  if (body.recurrence !== undefined) changes.recurrence = parseRecurrence(body.recurrence);
+  const assigneeTarget = parseAssigneeTarget(body.assigneeTarget);
+  if (Object.keys(changes).length === 0 && assigneeTarget === undefined) {
+    throw new ApiError(400, "INVALID_BODY", "PATCH requires at least one task field");
+  }
+  return {
+    version: parseVersion(body.version),
+    changes,
+    threadId: parseThreadId(body.threadId),
+    assigneeTarget,
+  };
+}
+
+function parseMove(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set(["version", "status", "sortOrder", "threadId"]));
+  return {
+    version: parseVersion(body.version),
+    status: parseStatus(body.status),
+    sortOrder: body.sortOrder === undefined ? undefined : parseSortOrder(body.sortOrder),
+    threadId: parseThreadId(body.threadId),
+  };
+}
+
+function parseVersionMutation(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set(["version", "threadId"]));
+  return {
+    version: parseVersion(body.version),
+    threadId: parseThreadId(body.threadId),
+  };
+}
+
+function parseCommentCreate(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set(["body", "threadId"]));
+  return {
+    body: stringField(body.body ?? "", "body", { maxLength: 100_000 }),
+    threadId: parseThreadId(body.threadId),
+  };
+}
+
+function parseCommentPatch(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set(["version", "body", "threadId"]));
+  if (body.body === undefined) {
+    throw new ApiError(400, "INVALID_FIELD", "'body' is required");
+  }
+  return {
+    version: parseVersion(body.version),
+    body: stringField(body.body, "body", { maxLength: 100_000 }),
+    threadId: parseThreadId(body.threadId),
+  };
+}
+
+function parseTaskFilters(searchParams) {
+  const allowed = new Set(["projectId", "status", "archived"]);
+  for (const key of searchParams.keys()) {
+    if (!allowed.has(key)) {
+      throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", `Unknown query parameter: ${key}`);
+    }
+    if (searchParams.getAll(key).length > 1) {
+      throw new ApiError(400, "INVALID_QUERY_PARAMETER", `'${key}' cannot be repeated`);
+    }
+  }
+  const projectId = searchParams.get("projectId");
+  const status = searchParams.get("status");
+  const archived = searchParams.get("archived") ?? "false";
+  if (projectId !== null) validateProjectId(projectId);
+  if (status !== null) parseStatus(status);
+  if (!["false", "true", "all"].includes(archived)) {
+    throw new ApiError(
+      400,
+      "INVALID_QUERY_PARAMETER",
+      "'archived' must be false, true, or all",
+    );
+  }
+  return { projectId, status, archived };
+}
+
+function sanitizeWorkflowNodeData(value) {
+  if (Array.isArray(value)) return value.map(sanitizeWorkflowNodeData);
+  if (value === null || typeof value !== "object") return value;
+
+  return Object.fromEntries(
+    Object.entries(value)
+      .filter(([key]) => key !== "gitWorktreePath")
+      .map(([key, child]) => [key, sanitizeWorkflowNodeData(child)]),
+  );
+}
+
+function parseWorkflowWorkspace(value) {
+  assertPlainObject(value);
+  assertAllowedKeys(value, new Set(["version", "tabs", "activeWorkflowId", "snapshots"]));
+  if (value.version !== 1) {
+    throw new ApiError(400, "INVALID_FIELD", "'workspace.version' must be 1");
+  }
+  if (!Array.isArray(value.tabs) || value.tabs.length === 0 || value.tabs.length > 100) {
+    throw new ApiError(
+      400,
+      "INVALID_FIELD",
+      "'workspace.tabs' must contain 1 to 100 workflows",
+    );
+  }
+  const tabs = value.tabs.map((tab, index) => {
+    assertPlainObject(tab);
+    assertAllowedKeys(tab, new Set(["id", "name"]));
+    return {
+      id: stringField(tab.id, `workspace.tabs[${index}].id`, {
+        required: true,
+        maxLength: 128,
+      }),
+      name: stringField(tab.name, `workspace.tabs[${index}].name`, {
+        required: true,
+        maxLength: 120,
+      }),
+    };
+  });
+  if (new Set(tabs.map((tab) => tab.id)).size !== tabs.length) {
+    throw new ApiError(400, "INVALID_FIELD", "'workspace.tabs' ids must be unique");
+  }
+  const activeWorkflowId = stringField(
+    value.activeWorkflowId,
+    "workspace.activeWorkflowId",
+    { required: true, maxLength: 128 },
+  );
+  if (!tabs.some((tab) => tab.id === activeWorkflowId)) {
+    throw new ApiError(
+      400,
+      "INVALID_FIELD",
+      "'workspace.activeWorkflowId' must reference a workflow tab",
+    );
+  }
+  assertPlainObject(value.snapshots);
+  const snapshots = {};
+  for (const tab of tabs) {
+    const snapshot = value.snapshots[tab.id];
+    assertPlainObject(snapshot);
+    assertAllowedKeys(snapshot, new Set(["nodes", "edges", "flow", "selectedNodeId"]));
+    if (!Array.isArray(snapshot.nodes) || snapshot.nodes.length > 10_000) {
+      throw new ApiError(
+        400,
+        "INVALID_FIELD",
+        `'workspace.snapshots.${tab.id}.nodes' must be an array`,
+      );
+    }
+    if (
+      snapshot.flow === undefined
+      && (!Array.isArray(snapshot.edges) || snapshot.edges.length > 20_000)
+    ) {
+      throw new ApiError(
+        400,
+        "INVALID_FIELD",
+        `'workspace.snapshots.${tab.id}.edges' must be an array`,
+      );
+    }
+    if (snapshot.flow !== undefined && snapshot.edges !== undefined) {
+      throw new ApiError(
+        400,
+        "INVALID_FIELD",
+        `'workspace.snapshots.${tab.id}' cannot contain both 'flow' and 'edges'`,
+      );
+    }
+    const selectedNodeId = stringField(
+      snapshot.selectedNodeId ?? null,
+      `workspace.snapshots.${tab.id}.selectedNodeId`,
+      { nullable: true, maxLength: 256 },
+    );
+    const nodes = snapshot.nodes.map((node) => {
+      if (
+        node === null
+        || Array.isArray(node)
+        || typeof node !== "object"
+        || node.data === null
+        || Array.isArray(node.data)
+        || typeof node.data !== "object"
+      ) {
+        return node;
+      }
+      return { ...node, data: sanitizeWorkflowNodeData(node.data) };
+    });
+    try {
+      snapshots[tab.id] = normalizeWorkflowSnapshot({
+        nodes,
+        edges: snapshot.edges,
+        flow: snapshot.flow,
+        selectedNodeId,
+      });
+    } catch (error) {
+      throw new ApiError(
+        400,
+        "INVALID_FIELD",
+        `'workspace.snapshots.${tab.id}' is not a valid workflow: ${error.message}`,
+      );
+    }
+  }
+  return { version: 1, tabs, activeWorkflowId, snapshots };
+}
+
+async function listProjects(env) {
+  const rows = await all(env.DB.prepare(`
+    SELECT
+      projects.id,
+      projects.name,
+      projects.workspace_path,
+      projects.archived_at,
+      projects.created_at,
+      projects.updated_at,
+      COUNT(tasks.id) AS issue_count
+    FROM projects
+    LEFT JOIN tasks
+      ON tasks.project_id = projects.id
+      AND tasks.archived_at IS NULL
+    WHERE projects.archived_at IS NULL
+    GROUP BY
+      projects.id,
+      projects.name,
+      projects.workspace_path,
+      projects.archived_at,
+      projects.created_at,
+      projects.updated_at
+    ORDER BY projects.created_at, projects.id
+  `));
+  return rows.map(projectFromRow);
+}
+
+async function getProject(env, id) {
+  const row = await env.DB.prepare(`
+    SELECT
+      projects.id,
+      projects.name,
+      projects.workspace_path,
+      projects.archived_at,
+      projects.created_at,
+      projects.updated_at,
+      COUNT(tasks.id) AS issue_count
+    FROM projects
+    LEFT JOIN tasks
+      ON tasks.project_id = projects.id
+      AND tasks.archived_at IS NULL
+    WHERE projects.id = ? AND projects.archived_at IS NULL
+    GROUP BY
+      projects.id,
+      projects.name,
+      projects.workspace_path,
+      projects.archived_at,
+      projects.created_at,
+      projects.updated_at
+  `).bind(id).first();
+  return row ? projectFromRow(row) : null;
+}
+
+async function createProject(env, input) {
+  const timestamp = now();
+  try {
+    await env.DB.prepare(`
+      INSERT INTO projects (
+        id, name, workspace_path, next_task_number, created_at, updated_at
+      ) VALUES (?, ?, NULL, 1, ?, ?)
+    `).bind(input.id, input.name, timestamp, timestamp).run();
+  } catch (error) {
+    if (String(error.message).includes("UNIQUE constraint failed")) {
+      throw new ApiError(409, "PROJECT_EXISTS", `Project '${input.id}' already exists`);
+    }
+    throw error;
+  }
+  return getProject(env, input.id);
+}
+
+async function archiveProject(env, id) {
+  if (id === DEFAULT_PROJECT_ID) {
+    throw new ApiError(409, "DEFAULT_PROJECT_PROTECTED", "The default project cannot be archived or deleted");
+  }
+  const project = await getProject(env, id);
+  if (!project) throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${id}' does not exist`);
+
+  const timestamp = now();
+  const result = await env.DB.prepare(`
+    UPDATE projects
+    SET archived_at = ?, updated_at = ?
+    WHERE id = ? AND archived_at IS NULL
+  `).bind(timestamp, timestamp, id).run();
+  if (!changed(result)) {
+    throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${id}' does not exist`);
+  }
+  return { ...project, archivedAt: timestamp, updatedAt: timestamp };
+}
+
+async function deleteProject(env, id) {
+  if (id === DEFAULT_PROJECT_ID) {
+    throw new ApiError(409, "DEFAULT_PROJECT_PROTECTED", "The default project cannot be archived or deleted");
+  }
+  const project = await getProject(env, id);
+  if (!project) throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${id}' does not exist`);
+
+  const attachments = await all(env.DB.prepare(`
+    SELECT attachments.*
+    FROM attachments
+    JOIN tasks ON tasks.id = attachments.task_id
+    WHERE tasks.project_id = ?
+  `).bind(id));
+  const results = await env.DB.batch([
+    env.DB.prepare("DELETE FROM tasks WHERE project_id = ?").bind(id),
+    env.DB.prepare("DELETE FROM projects WHERE id = ?").bind(id),
+  ]);
+  if (!changed(results[1])) {
+    throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${id}' does not exist`);
+  }
+  await Promise.all(attachments.map((attachment) => env.ATTACHMENTS.delete(attachment.id)));
+  return project;
+}
+
+async function listTasks(env, filters) {
+  const where = [];
+  const values = [];
+  if (filters.projectId) {
+    where.push("project_id = ?");
+    values.push(filters.projectId);
+  }
+  if (filters.status) {
+    where.push("status = ?");
+    values.push(filters.status);
+  }
+  if (filters.archived === "false") {
+    where.push("archived_at IS NULL");
+  } else if (filters.archived === "true") {
+    where.push("archived_at IS NOT NULL");
+  }
+  const rows = await all(
+    env.DB.prepare(`
+      SELECT * FROM tasks
+      ${where.length > 0 ? `WHERE ${where.join(" AND ")}` : ""}
+      ORDER BY
+        CASE status
+          WHEN 'backlog' THEN 1
+          WHEN 'todo' THEN 2
+          WHEN 'in_progress' THEN 3
+          WHEN 'in_review' THEN 4
+          WHEN 'blocked' THEN 5
+          WHEN 'done' THEN 6
+          WHEN 'canceled' THEN 7
+        END,
+        sort_order,
+        created_at,
+        id
+    `).bind(...values),
+  );
+  return Promise.all(rows.map((row) => hydrateTask(env, row)));
+}
+
+async function createTask(env, input, actor) {
+  await requireProject(env, input.projectId);
+  let sortOrder = input.sortOrder;
+  if (sortOrder === undefined) {
+    const row = await env.DB.prepare(`
+      SELECT COALESCE(MAX(sort_order), 0) AS maximum
+      FROM tasks
+      WHERE project_id = ? AND status = ? AND archived_at IS NULL
+    `).bind(input.projectId, input.status).first();
+    sortOrder = row.maximum + 1000;
+  }
+  const id = uuid();
+  const timestamp = now();
+  const assignee = resolveAssignee(input.assigneeTarget, actor);
+  const results = await env.DB.batch([
+    env.DB.prepare(`
+      INSERT INTO tasks (
+        id, identifier, project_id, title, description, status, priority, labels,
+        sort_order, thread_id, creator_type, creator_id, creator_name, creator_avatar_url,
+        assignee_type, assignee_id, assignee_name, assignee_avatar_url,
+        workflow_id, development_context_type, development_branch,
+        due_date, recurrence_interval, recurrence_unit,
+        archived_at, version, created_at, updated_at
+      )
+      SELECT
+        ?,
+        ? || '-' || CAST(next_task_number AS TEXT),
+        projects.id,
+        ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?,
+        ?, ?, ?, ?, ?, ?, ?, ?, ?, ?,
+        NULL, 1, ?, ?
+      FROM projects
+      WHERE projects.id = ? AND projects.archived_at IS NULL
+    `).bind(
+      id,
+      projectPrefix(input.projectId),
+      input.title,
+      input.description,
+      input.status,
+      input.priority,
+      JSON.stringify(input.labels),
+      sortOrder,
+      input.threadId ?? null,
+      actor.type,
+      actor.id,
+      actor.name,
+      actor.avatarUrl,
+      assignee.type,
+      assignee.id,
+      assignee.name,
+      assignee.avatarUrl,
+      input.workflowId,
+      input.developmentContext?.type ?? null,
+      input.developmentContext?.branch ?? null,
+      input.dueDate,
+      input.recurrence?.interval ?? null,
+      input.recurrence?.unit ?? null,
+      timestamp,
+      timestamp,
+      input.projectId,
+    ),
+    env.DB.prepare(`
+      UPDATE projects
+      SET next_task_number = next_task_number + 1, updated_at = ?
+      WHERE id = ? AND archived_at IS NULL
+    `).bind(timestamp, input.projectId),
+  ]);
+  if (!changed(results[0]) || !changed(results[1])) {
+    throw new ApiError(
+      404,
+      "PROJECT_NOT_FOUND",
+      `Project '${input.projectId}' does not exist`,
+    );
+  }
+  return getTask(env, id);
+}
+
+async function updateTask(env, id, input, actor) {
+  const current = await requireTaskRow(env, id);
+  assertTaskVersion(current, input.version);
+  const currentTask = taskFromRow(current);
+  const dueDate = Object.hasOwn(input.changes, "dueDate")
+    ? input.changes.dueDate
+    : currentTask.dueDate;
+  const recurrence = Object.hasOwn(input.changes, "recurrence")
+    ? input.changes.recurrence
+    : currentTask.recurrence;
+  if (recurrence && !dueDate) {
+    throw new ApiError(400, "INVALID_FIELD", "A recurring issue requires a due date");
+  }
+
+  const assignments = [];
+  const values = [];
+  const columns = {
+    title: "title",
+    description: "description",
+    status: "status",
+    priority: "priority",
+    labels: "labels",
+    workflowId: "workflow_id",
+    dueDate: "due_date",
+  };
+  for (const [key, value] of Object.entries(input.changes)) {
+    if (key === "developmentContext") {
+      assignments.push("development_context_type = ?", "development_branch = ?");
+      values.push(value?.type ?? null, value?.branch ?? null);
+    } else if (key === "recurrence") {
+      assignments.push("recurrence_interval = ?", "recurrence_unit = ?");
+      values.push(value?.interval ?? null, value?.unit ?? null);
+    } else {
+      assignments.push(`${columns[key]} = ?`);
+      values.push(key === "labels" ? JSON.stringify(value) : value);
+    }
+  }
+  if (input.assigneeTarget !== undefined) {
+    const assignee = resolveAssignee(input.assigneeTarget, actor);
+    assignments.push(
+      "assignee_type = ?",
+      "assignee_id = ?",
+      "assignee_name = ?",
+      "assignee_avatar_url = ?",
+    );
+    values.push(assignee.type, assignee.id, assignee.name, assignee.avatarUrl);
+  }
+  if (input.threadId !== undefined) {
+    assignments.push("thread_id = ?");
+    values.push(input.threadId);
+  }
+  assignments.push("version = version + 1", "updated_at = ?");
+  values.push(now(), current.id, input.version);
+  const result = await env.DB.prepare(`
+    UPDATE tasks
+    SET ${assignments.join(", ")}
+    WHERE id = ? AND version = ?
+  `).bind(...values).run();
+  if (!changed(result)) {
+    const latest = await requireTaskRow(env, current.id);
+    throw new ApiError(
+      409,
+      "VERSION_CONFLICT",
+      "Task was changed by another client",
+      { expectedVersion: input.version, actualVersion: latest.version },
+    );
+  }
+  return getTask(env, current.id);
+}
+
+async function moveTask(env, id, input) {
+  const current = await requireTaskRow(env, id);
+  assertTaskVersion(current, input.version);
+  if (current.archived_at !== null) {
+    throw new ApiError(409, "TASK_ARCHIVED", "Archived tasks cannot be moved");
+  }
+  let sortOrder = input.sortOrder;
+  if (sortOrder === undefined) {
+    const row = await env.DB.prepare(`
+      SELECT COALESCE(MAX(sort_order), 0) AS maximum
+      FROM tasks
+      WHERE project_id = ? AND status = ? AND archived_at IS NULL AND id != ?
+    `).bind(current.project_id, input.status, current.id).first();
+    sortOrder = row.maximum + 1000;
+  }
+  const result = await env.DB.prepare(`
+    UPDATE tasks
+    SET
+      status = ?,
+      sort_order = ?,
+      thread_id = COALESCE(?, thread_id),
+      version = version + 1,
+      updated_at = ?
+    WHERE id = ? AND version = ?
+  `).bind(
+    input.status,
+    sortOrder,
+    input.threadId ?? null,
+    now(),
+    current.id,
+    input.version,
+  ).run();
+  if (!changed(result)) {
+    const latest = await requireTaskRow(env, current.id);
+    throw new ApiError(
+      409,
+      "VERSION_CONFLICT",
+      "Task was changed by another client",
+      { expectedVersion: input.version, actualVersion: latest.version },
+    );
+  }
+  return getTask(env, current.id);
+}
+
+async function archiveTask(env, id, input) {
+  const current = await requireTaskRow(env, id);
+  assertTaskVersion(current, input.version);
+  const timestamp = now();
+  const result = await env.DB.prepare(`
+    UPDATE tasks
+    SET
+      archived_at = ?,
+      thread_id = COALESCE(?, thread_id),
+      version = version + 1,
+      updated_at = ?
+    WHERE id = ? AND version = ?
+  `).bind(timestamp, input.threadId ?? null, timestamp, current.id, input.version).run();
+  if (!changed(result)) {
+    const latest = await requireTaskRow(env, current.id);
+    throw new ApiError(
+      409,
+      "VERSION_CONFLICT",
+      "Task was changed by another client",
+      { expectedVersion: input.version, actualVersion: latest.version },
+    );
+  }
+  return getTask(env, current.id);
+}
+
+async function restoreTask(env, id, input) {
+  const current = await requireTaskRow(env, id);
+  assertTaskVersion(current, input.version);
+  if (current.archived_at === null) {
+    throw new ApiError(409, "TASK_NOT_ARCHIVED", "Only archived tasks can be restored");
+  }
+  const result = await env.DB.prepare(`
+    UPDATE tasks
+    SET
+      archived_at = NULL,
+      thread_id = COALESCE(?, thread_id),
+      version = version + 1,
+      updated_at = ?
+    WHERE id = ? AND version = ?
+  `).bind(input.threadId ?? null, now(), current.id, input.version).run();
+  if (!changed(result)) {
+    const latest = await requireTaskRow(env, current.id);
+    throw new ApiError(
+      409,
+      "VERSION_CONFLICT",
+      "Task was changed by another client",
+      { expectedVersion: input.version, actualVersion: latest.version },
+    );
+  }
+  return getTask(env, current.id);
+}
+
+function relationEndpoints(type, taskId, relatedTaskId) {
+  if (type === "parent") {
+    return {
+      relationType: "parent",
+      sourceTaskId: relatedTaskId,
+      targetTaskId: taskId,
+    };
+  }
+  if (type === "blocks") {
+    return {
+      relationType: "blocks",
+      sourceTaskId: taskId,
+      targetTaskId: relatedTaskId,
+    };
+  }
+  if (type === "blocked_by") {
+    return {
+      relationType: "blocks",
+      sourceTaskId: relatedTaskId,
+      targetTaskId: taskId,
+    };
+  }
+  if (type === "related") {
+    const [sourceTaskId, targetTaskId] = [taskId, relatedTaskId].sort();
+    return { relationType: "related", sourceTaskId, targetTaskId };
+  }
+  throw new ApiError(
+    400,
+    "INVALID_FIELD",
+    "'relation type' must be parent, blocks, blocked_by, or related",
+  );
+}
+
+async function assertRelationTasks(env, taskId, relatedTaskId, expectedVersion) {
+  const task = await requireTaskRow(env, taskId);
+  const relatedTask = await requireTaskRow(env, relatedTaskId);
+  assertTaskVersion(task, expectedVersion);
+  if (task.id === relatedTask.id) {
+    throw new ApiError(400, "SELF_RELATION", "An issue cannot be related to itself");
+  }
+  if (task.project_id !== relatedTask.project_id) {
+    throw new ApiError(
+      400,
+      "CROSS_PROJECT_RELATION",
+      "Issue relations must stay within one project",
+    );
+  }
+  return { task, relatedTask };
+}
+
+async function addRelation(env, taskId, type, relatedTaskId, input) {
+  const { task, relatedTask } = await assertRelationTasks(
+    env,
+    taskId,
+    relatedTaskId,
+    input.version,
+  );
+  const endpoints = relationEndpoints(type, task.id, relatedTask.id);
+  const statements = [];
+  if (endpoints.relationType === "parent") {
+    const cycle = await env.DB.prepare(`
+      WITH RECURSIVE ancestors(id) AS (
+        SELECT source_task_id
+        FROM task_relations
+        WHERE relation_type = 'parent' AND target_task_id = ?
+        UNION
+        SELECT task_relations.source_task_id
+        FROM task_relations
+        JOIN ancestors ON task_relations.target_task_id = ancestors.id
+        WHERE task_relations.relation_type = 'parent'
+      )
+      SELECT 1 AS found FROM ancestors WHERE id = ?
+    `).bind(relatedTask.id, task.id).first();
+    if (cycle) {
+      throw new ApiError(409, "RELATION_CYCLE", "This parent would create a cycle");
+    }
+    const existing = await env.DB.prepare(`
+      SELECT source_task_id
+      FROM task_relations
+      WHERE relation_type = 'parent' AND target_task_id = ?
+    `).bind(task.id).first();
+    if (existing?.source_task_id === relatedTask.id) {
+      throw new ApiError(409, "RELATION_EXISTS", "This parent relation already exists");
+    }
+    if (existing) {
+      statements.push(
+        env.DB.prepare(`
+          DELETE FROM task_relations
+          WHERE relation_type = 'parent'
+            AND target_task_id = ?
+            AND EXISTS (
+              SELECT 1 FROM tasks WHERE id = ? AND version = ?
+            )
+        `).bind(task.id, task.id, input.version),
+      );
+    }
+  } else {
+    const existing = await env.DB.prepare(`
+      SELECT 1 AS found
+      FROM task_relations
+      WHERE relation_type = ? AND source_task_id = ? AND target_task_id = ?
+    `).bind(
+      endpoints.relationType,
+      endpoints.sourceTaskId,
+      endpoints.targetTaskId,
+    ).first();
+    if (existing) {
+      throw new ApiError(409, "RELATION_EXISTS", "This issue relation already exists");
+    }
+  }
+  statements.push(
+    env.DB.prepare(`
+      INSERT INTO task_relations (
+        relation_type, source_task_id, target_task_id, created_at
+      )
+      SELECT ?, ?, ?, ?
+      WHERE EXISTS (
+        SELECT 1 FROM tasks WHERE id = ? AND version = ?
+      )
+    `).bind(
+      endpoints.relationType,
+      endpoints.sourceTaskId,
+      endpoints.targetTaskId,
+      now(),
+      task.id,
+      input.version,
+    ),
+    env.DB.prepare(`
+      UPDATE tasks
+      SET
+        thread_id = COALESCE(?, thread_id),
+        version = version + 1,
+        updated_at = ?
+      WHERE id = ? AND version = ?
+    `).bind(input.threadId ?? null, now(), task.id, input.version),
+  );
+  let results;
+  try {
+    results = await env.DB.batch(statements);
+  } catch (error) {
+    const message = String(error.message);
+    if (message.includes("RELATION_CYCLE")) {
+      throw new ApiError(409, "RELATION_CYCLE", "This parent would create a cycle");
+    }
+    if (
+      message.includes("UNIQUE constraint failed")
+      && message.includes("task_relations")
+    ) {
+      throw new ApiError(409, "RELATION_EXISTS", "This issue relation already exists");
+    }
+    throw error;
+  }
+  if (!changed(results.at(-1))) {
+    const latest = await requireTaskRow(env, task.id);
+    throw new ApiError(
+      409,
+      "VERSION_CONFLICT",
+      "Task was changed by another client",
+      { expectedVersion: input.version, actualVersion: latest.version },
+    );
+  }
+  return {
+    task: await getTask(env, task.id),
+    relatedTask: await getTask(env, relatedTask.id),
+  };
+}
+
+async function removeRelation(env, taskId, type, relatedTaskId, input) {
+  const { task, relatedTask } = await assertRelationTasks(
+    env,
+    taskId,
+    relatedTaskId,
+    input.version,
+  );
+  const endpoints = relationEndpoints(type, task.id, relatedTask.id);
+  const exists = await env.DB.prepare(`
+    SELECT 1 AS found
+    FROM task_relations
+    WHERE relation_type = ? AND source_task_id = ? AND target_task_id = ?
+  `).bind(
+    endpoints.relationType,
+    endpoints.sourceTaskId,
+    endpoints.targetTaskId,
+  ).first();
+  if (!exists) {
+    throw new ApiError(404, "RELATION_NOT_FOUND", "This issue relation does not exist");
+  }
+  const results = await env.DB.batch([
+    env.DB.prepare(`
+      DELETE FROM task_relations
+      WHERE relation_type = ?
+        AND source_task_id = ?
+        AND target_task_id = ?
+        AND EXISTS (
+          SELECT 1 FROM tasks WHERE id = ? AND version = ?
+        )
+    `).bind(
+      endpoints.relationType,
+      endpoints.sourceTaskId,
+      endpoints.targetTaskId,
+      task.id,
+      input.version,
+    ),
+    env.DB.prepare(`
+      UPDATE tasks
+      SET
+        thread_id = COALESCE(?, thread_id),
+        version = version + 1,
+        updated_at = ?
+      WHERE id = ? AND version = ?
+    `).bind(input.threadId ?? null, now(), task.id, input.version),
+  ]);
+  if (!changed(results.at(-1))) {
+    const latest = await requireTaskRow(env, task.id);
+    throw new ApiError(
+      409,
+      "VERSION_CONFLICT",
+      "Task was changed by another client",
+      { expectedVersion: input.version, actualVersion: latest.version },
+    );
+  }
+  return {
+    task: await getTask(env, task.id),
+    relatedTask: await getTask(env, relatedTask.id),
+  };
+}
+
+async function getWorkflow(env, projectId) {
+  await requireProject(env, projectId);
+  const row = await env.DB.prepare(`
+    SELECT project_id, workspace, version, updated_at
+    FROM workflow_workspaces
+    WHERE project_id = ?
+  `).bind(projectId).first();
+  return row
+    ? {
+        projectId: row.project_id,
+        workspace: JSON.parse(row.workspace),
+        version: row.version,
+        updatedAt: row.updated_at,
+      }
+    : { projectId, workspace: null, version: 0, updatedAt: null };
+}
+
+async function saveWorkflow(env, projectId, expectedVersion, workspace) {
+  await requireProject(env, projectId);
+  const current = await env.DB.prepare(`
+    SELECT version FROM workflow_workspaces WHERE project_id = ?
+  `).bind(projectId).first();
+  const actualVersion = current?.version ?? 0;
+  if (actualVersion !== expectedVersion) {
+    throw new ApiError(
+      409,
+      "VERSION_CONFLICT",
+      "Workflow was changed by another client",
+      { expectedVersion, actualVersion },
+    );
+  }
+  const timestamp = now();
+  if (current) {
+    const result = await env.DB.prepare(`
+      UPDATE workflow_workspaces
+      SET workspace = ?, version = version + 1, updated_at = ?
+      WHERE project_id = ? AND version = ?
+    `).bind(
+      JSON.stringify(workspace),
+      timestamp,
+      projectId,
+      expectedVersion,
+    ).run();
+    if (!changed(result)) {
+      const latest = await env.DB.prepare(`
+        SELECT version FROM workflow_workspaces WHERE project_id = ?
+      `).bind(projectId).first();
+      throw new ApiError(
+        409,
+        "VERSION_CONFLICT",
+        "Workflow was changed by another client",
+        { expectedVersion, actualVersion: latest?.version ?? 0 },
+      );
+    }
+  } else {
+    try {
+      await env.DB.prepare(`
+        INSERT INTO workflow_workspaces (project_id, workspace, version, updated_at)
+        VALUES (?, ?, 1, ?)
+      `).bind(projectId, JSON.stringify(workspace), timestamp).run();
+    } catch (error) {
+      if (String(error.message).includes("UNIQUE constraint failed")) {
+        const latest = await env.DB.prepare(`
+          SELECT version FROM workflow_workspaces WHERE project_id = ?
+        `).bind(projectId).first();
+        throw new ApiError(
+          409,
+          "VERSION_CONFLICT",
+          "Workflow was changed by another client",
+          { expectedVersion, actualVersion: latest.version },
+        );
+      }
+      throw error;
+    }
+  }
+  return getWorkflow(env, projectId);
+}
+
+async function listComments(env, taskId) {
+  const task = await requireTaskRow(env, taskId);
+  const rows = await all(env.DB.prepare(`
+    SELECT * FROM comments
+    WHERE task_id = ?
+    ORDER BY created_at, id
+  `).bind(task.id));
+  return Promise.all(rows.map((row) => hydrateComment(env, row)));
+}
+
+async function createComment(env, taskId, input, actor) {
+  const task = await requireTaskRow(env, taskId);
+  const id = uuid();
+  const timestamp = now();
+  await env.DB.prepare(`
+    INSERT INTO comments (
+      id, task_id, body, thread_id, author_type, author_id, author_name,
+      author_avatar_url, version, created_at, updated_at
+    ) VALUES (?, ?, ?, ?, ?, ?, ?, ?, 1, ?, ?)
+  `).bind(
+    id,
+    task.id,
+    input.body,
+    input.threadId ?? null,
+    actor.type,
+    actor.id,
+    actor.name,
+    actor.avatarUrl,
+    timestamp,
+    timestamp,
+  ).run();
+  const row = await env.DB.prepare("SELECT * FROM comments WHERE id = ?").bind(id).first();
+  return hydrateComment(env, row);
+}
+
+async function requireCommentRow(env, id) {
+  const row = await env.DB.prepare("SELECT * FROM comments WHERE id = ?").bind(id).first();
+  if (!row) {
+    throw new ApiError(404, "COMMENT_NOT_FOUND", `Comment '${id}' does not exist`);
+  }
+  return row;
+}
+
+function assertCommentVersion(row, expectedVersion) {
+  if (row.version !== expectedVersion) {
+    throw new ApiError(
+      409,
+      "VERSION_CONFLICT",
+      "Comment was changed by another client",
+      { expectedVersion, actualVersion: row.version },
+    );
+  }
+}
+
+async function updateComment(env, id, input) {
+  const current = await requireCommentRow(env, id);
+  assertCommentVersion(current, input.version);
+  const result = await env.DB.prepare(`
+    UPDATE comments
+    SET
+      body = ?,
+      thread_id = COALESCE(?, thread_id),
+      version = version + 1,
+      updated_at = ?
+    WHERE id = ? AND version = ?
+  `).bind(
+    input.body,
+    input.threadId ?? null,
+    now(),
+    current.id,
+    input.version,
+  ).run();
+  if (!changed(result)) {
+    const latest = await requireCommentRow(env, current.id);
+    throw new ApiError(
+      409,
+      "VERSION_CONFLICT",
+      "Comment was changed by another client",
+      { expectedVersion: input.version, actualVersion: latest.version },
+    );
+  }
+  const row = await requireCommentRow(env, current.id);
+  return hydrateComment(env, row);
+}
+
+async function deleteComment(env, id, expectedVersion) {
+  const current = await requireCommentRow(env, id);
+  assertCommentVersion(current, expectedVersion);
+  const attachments = await attachmentsForComment(env, current.id);
+  const result = await env.DB.prepare(`
+    DELETE FROM comments WHERE id = ? AND version = ?
+  `).bind(current.id, expectedVersion).run();
+  if (!changed(result)) {
+    const latest = await requireCommentRow(env, current.id);
+    throw new ApiError(
+      409,
+      "VERSION_CONFLICT",
+      "Comment was changed by another client",
+      { expectedVersion, actualVersion: latest.version },
+    );
+  }
+  await Promise.all(attachments.map((attachment) => env.ATTACHMENTS.delete(attachment.id)));
+}
+
+async function listTaskAttachments(env, taskId) {
+  const task = await requireTaskRow(env, taskId);
+  return (
+    await all(env.DB.prepare(`
+      SELECT * FROM attachments
+      WHERE task_id = ? AND comment_id IS NULL
+      ORDER BY created_at, id
+    `).bind(task.id))
+  ).map(attachmentFromRow);
+}
+
+async function listCommentAttachments(env, commentId) {
+  await requireCommentRow(env, commentId);
+  return attachmentsForComment(env, commentId);
+}
+
+async function uploadAttachment(env, ownerType, ownerId, request) {
+  let taskId;
+  let commentId = null;
+  if (ownerType === "task") {
+    taskId = (await requireTaskRow(env, ownerId)).id;
+  } else {
+    const comment = await requireCommentRow(env, ownerId);
+    taskId = comment.task_id;
+    commentId = comment.id;
+  }
+  const metadata = parseAttachmentHeaders(request);
+  const body = await readAttachment(request);
+  const id = uuid();
+  await env.ATTACHMENTS.put(id, body, {
+    httpMetadata: { contentType: metadata.contentType },
+  });
+  try {
+    await env.DB.prepare(`
+      INSERT INTO attachments (
+        id, task_id, comment_id, filename, content_type, size, created_at
+      ) VALUES (?, ?, ?, ?, ?, ?, ?)
+    `).bind(
+      id,
+      taskId,
+      commentId,
+      metadata.filename,
+      metadata.contentType,
+      body.byteLength,
+      now(),
+    ).run();
+  } catch (error) {
+    await env.ATTACHMENTS.delete(id);
+    throw error;
+  }
+  const row = await env.DB.prepare("SELECT * FROM attachments WHERE id = ?").bind(id).first();
+  return attachmentFromRow(row);
+}
+
+async function requireAttachment(env, id) {
+  const row = await env.DB.prepare("SELECT * FROM attachments WHERE id = ?").bind(id).first();
+  if (!row) {
+    throw new ApiError(404, "ATTACHMENT_NOT_FOUND", `Attachment '${id}' does not exist`);
+  }
+  return attachmentFromRow(row);
+}
+
+async function deleteAttachment(env, id) {
+  const attachment = await requireAttachment(env, id);
+  await env.DB.prepare("DELETE FROM attachments WHERE id = ?").bind(attachment.id).run();
+  await env.ATTACHMENTS.delete(attachment.id);
+  return attachment;
+}
+
+function requireNoQuery(url, routeName) {
+  if ([...url.searchParams.keys()].length > 0) {
+    throw new ApiError(
+      400,
+      "UNKNOWN_QUERY_PARAMETER",
+      `${routeName} does not accept query parameters`,
+    );
+  }
+}
+
+function decodePathPart(value, label) {
+  let decoded;
+  try {
+    decoded = decodeURIComponent(value);
+  } catch {
+    throw new ApiError(400, "INVALID_PATH", `${label} contains invalid encoding`);
+  }
+  if (decoded.length === 0 || decoded.length > 128) {
+    throw new ApiError(400, "INVALID_PATH", `${label} is invalid`);
+  }
+  return decoded;
+}
+
+async function attachmentContent(env, id, request) {
+  const attachment = await requireAttachment(env, id);
+  const object = await env.ATTACHMENTS.get(attachment.id);
+  if (!object) {
+    throw new ApiError(
+      404,
+      "ATTACHMENT_NOT_FOUND",
+      `Attachment '${id}' does not exist`,
+    );
+  }
+  const encodedFilename = encodeURIComponent(attachment.filename).replace(
+    /['()*]/g,
+    (character) => `%${character.charCodeAt(0).toString(16).toUpperCase()}`,
+  );
+  const canOpenInline = INLINE_ATTACHMENT_TYPES.has(attachment.contentType);
+  return new Response(request.method === "HEAD" ? null : object.body, {
+    status: 200,
+    headers: {
+      "cache-control": "private, no-store",
+      "content-disposition": `${
+        canOpenInline ? "inline" : "attachment"
+      }; filename*=UTF-8''${encodedFilename}`,
+      "content-length": String(attachment.size),
+      "content-security-policy": "sandbox; default-src 'none'",
+      "content-type": canOpenInline
+        ? attachment.contentType
+        : "application/octet-stream",
+    },
+  });
+}
+
+async function routeApi(request, env, actor, url) {
+  const { pathname } = url;
+
+  if (pathname === "/api/meta") {
+    if (request.method !== "GET") methodNotAllowed(["GET"]);
+    requireNoQuery(url, "GET /api/meta");
+    return json(200, {
+      mode: "cloud",
+      manageTaskboardSkillPath: null,
+      realtime: { transport: "poll", intervalMs: 2000 },
+      localCapabilities: { available: false },
+    });
+  }
+
+  if (pathname === "/api/revisions") {
+    if (request.method !== "GET") methodNotAllowed(["GET"]);
+    const unknown = [...url.searchParams.keys()].filter((key) => key !== "since");
+    if (unknown.length > 0) {
+      throw new ApiError(
+        400,
+        "UNKNOWN_QUERY_PARAMETER",
+        `Unknown query parameter: ${unknown[0]}`,
+      );
+    }
+    if (url.searchParams.getAll("since").length !== 1) {
+      throw new ApiError(
+        400,
+        "INVALID_QUERY_PARAMETER",
+        "'since' must be provided once",
+      );
+    }
+    const rawSince = url.searchParams.get("since");
+    if (!/^\d+$/.test(rawSince ?? "")) {
+      throw new ApiError(
+        400,
+        "INVALID_QUERY_PARAMETER",
+        "'since' must be a non-negative integer",
+      );
+    }
+    const since = Number(rawSince);
+    if (!Number.isSafeInteger(since)) {
+      throw new ApiError(
+        400,
+        "INVALID_QUERY_PARAMETER",
+        "'since' must be a non-negative integer",
+      );
+    }
+    const revision = await env.DB.prepare(`
+      SELECT revision FROM global_revision WHERE singleton = 1
+    `).first("revision");
+    return json(200, { changed: revision > since, revision });
+  }
+
+  if (
+    pathname === "/api/device-workspaces"
+    || pathname === "/api/workflow-capabilities"
+    || /^\/api\/projects\/[^/]+\/development-contexts$/.test(pathname)
+  ) {
+    if (request.method !== "GET") methodNotAllowed(["GET"]);
+    throw new ApiError(
+      409,
+      "LOCAL_COMPANION_REQUIRED",
+      "This capability requires the local Codex companion",
+    );
+  }
+
+  if (pathname === "/api/events") {
+    if (request.method !== "GET") methodNotAllowed(["GET"]);
+    throw new ApiError(
+      409,
+      "POLLING_REQUIRED",
+      "Cloud collaboration uses revision polling",
+    );
+  }
+
+  if (pathname === "/api/projects") {
+    if (request.method === "GET") {
+      requireNoQuery(url, "GET /api/projects");
+      return json(200, { projects: await listProjects(env) });
+    }
+    if (request.method === "POST") {
+      return json(201, {
+        project: await createProject(env, parseProjectCreate(await readJson(request))),
+      });
+    }
+    methodNotAllowed(["GET", "POST"]);
+  }
+
+  const projectArchiveMatch = pathname.match(/^\/api\/projects\/([^/]+)\/archive$/);
+  if (projectArchiveMatch) {
+    requireNoQuery(url, "Project archive route");
+    const projectId = validateProjectId(
+      decodePathPart(projectArchiveMatch[1], "Project id"),
+    );
+    if (request.method === "POST") {
+      return json(200, { project: await archiveProject(env, projectId) });
+    }
+    methodNotAllowed(["POST"]);
+  }
+
+  const projectDeleteMatch = pathname.match(/^\/api\/projects\/([^/]+)$/);
+  if (projectDeleteMatch) {
+    requireNoQuery(url, "Project delete route");
+    const projectId = validateProjectId(
+      decodePathPart(projectDeleteMatch[1], "Project id"),
+    );
+    if (request.method === "DELETE") {
+      await deleteProject(env, projectId);
+      return empty(204);
+    }
+    methodNotAllowed(["DELETE"]);
+  }
+
+  const workflowMatch = pathname.match(
+    /^\/api\/projects\/([^/]+)\/workflow-workspace$/,
+  );
+  if (workflowMatch) {
+    requireNoQuery(url, "Workflow workspace routes");
+    const projectId = validateProjectId(
+      decodePathPart(workflowMatch[1], "Project id"),
+    );
+    if (request.method === "GET") {
+      return json(200, { workflow: await getWorkflow(env, projectId) });
+    }
+    if (request.method === "PUT") {
+      const body = await readJson(request);
+      assertPlainObject(body);
+      assertAllowedKeys(body, new Set(["version", "workspace"]));
+      const version = parseVersion(body.version, { allowZero: true });
+      const workspace = parseWorkflowWorkspace(body.workspace);
+      return json(200, {
+        workflow: await saveWorkflow(env, projectId, version, workspace),
+      });
+    }
+    methodNotAllowed(["GET", "PUT"]);
+  }
+
+  if (pathname === "/api/tasks") {
+    if (request.method === "GET") {
+      return json(200, {
+        tasks: await listTasks(env, parseTaskFilters(url.searchParams)),
+      });
+    }
+    if (request.method === "POST") {
+      return json(201, {
+        task: await createTask(env, parseTaskCreate(await readJson(request)), actor),
+      });
+    }
+    methodNotAllowed(["GET", "POST"]);
+  }
+
+  const relationMatch = pathname.match(
+    /^\/api\/tasks\/([^/]+)\/relations\/([^/]+)\/([^/]+)$/,
+  );
+  if (relationMatch) {
+    requireNoQuery(url, "Issue relation routes");
+    const taskId = decodePathPart(relationMatch[1], "Task id");
+    const type = decodePathPart(relationMatch[2], "Relation type");
+    const relatedTaskId = decodePathPart(relationMatch[3], "Related task id");
+    const input = parseVersionMutation(await readJson(request));
+    if (request.method === "POST") {
+      return json(200, await addRelation(env, taskId, type, relatedTaskId, input));
+    }
+    if (request.method === "DELETE") {
+      return json(200, await removeRelation(env, taskId, type, relatedTaskId, input));
+    }
+    methodNotAllowed(["POST", "DELETE"]);
+  }
+
+  const taskCommentsMatch = pathname.match(/^\/api\/tasks\/([^/]+)\/comments$/);
+  if (taskCommentsMatch) {
+    requireNoQuery(url, "Comment routes");
+    const taskId = decodePathPart(taskCommentsMatch[1], "Task id");
+    if (request.method === "GET") {
+      return json(200, { comments: await listComments(env, taskId) });
+    }
+    if (request.method === "POST") {
+      return json(201, {
+        comment: await createComment(
+          env,
+          taskId,
+          parseCommentCreate(await readJson(request)),
+          actor,
+        ),
+      });
+    }
+    methodNotAllowed(["GET", "POST"]);
+  }
+
+  const commentAttachmentsMatch = pathname.match(
+    /^\/api\/comments\/([^/]+)\/attachments$/,
+  );
+  if (commentAttachmentsMatch) {
+    requireNoQuery(url, "Attachment routes");
+    const commentId = decodePathPart(commentAttachmentsMatch[1], "Comment id");
+    if (request.method === "GET") {
+      return json(200, {
+        attachments: await listCommentAttachments(env, commentId),
+      });
+    }
+    if (request.method === "POST") {
+      return json(201, {
+        attachment: await uploadAttachment(env, "comment", commentId, request),
+      });
+    }
+    methodNotAllowed(["GET", "POST"]);
+  }
+
+  const commentMatch = pathname.match(/^\/api\/comments\/([^/]+)$/);
+  if (commentMatch) {
+    requireNoQuery(url, "Comment routes");
+    const commentId = decodePathPart(commentMatch[1], "Comment id");
+    if (request.method === "PATCH") {
+      return json(200, {
+        comment: await updateComment(
+          env,
+          commentId,
+          parseCommentPatch(await readJson(request)),
+        ),
+      });
+    }
+    if (request.method === "DELETE") {
+      const { version } = parseVersionMutation(await readJson(request));
+      await deleteComment(env, commentId, version);
+      return empty(204);
+    }
+    methodNotAllowed(["PATCH", "DELETE"]);
+  }
+
+  const taskAttachmentsMatch = pathname.match(
+    /^\/api\/tasks\/([^/]+)\/attachments$/,
+  );
+  if (taskAttachmentsMatch) {
+    requireNoQuery(url, "Attachment routes");
+    const taskId = decodePathPart(taskAttachmentsMatch[1], "Task id");
+    if (request.method === "GET") {
+      return json(200, {
+        attachments: await listTaskAttachments(env, taskId),
+      });
+    }
+    if (request.method === "POST") {
+      return json(201, {
+        attachment: await uploadAttachment(env, "task", taskId, request),
+      });
+    }
+    methodNotAllowed(["GET", "POST"]);
+  }
+
+  const attachmentContentMatch = pathname.match(
+    /^\/api\/attachments\/([^/]+)\/content$/,
+  );
+  if (attachmentContentMatch) {
+    requireNoQuery(url, "Attachment routes");
+    if (!["GET", "HEAD"].includes(request.method)) methodNotAllowed(["GET", "HEAD"]);
+    return attachmentContent(
+      env,
+      decodePathPart(attachmentContentMatch[1], "Attachment id"),
+      request,
+    );
+  }
+
+  const attachmentMatch = pathname.match(/^\/api\/attachments\/([^/]+)$/);
+  if (attachmentMatch) {
+    requireNoQuery(url, "Attachment routes");
+    if (request.method !== "DELETE") methodNotAllowed(["DELETE"]);
+    await deleteAttachment(
+      env,
+      decodePathPart(attachmentMatch[1], "Attachment id"),
+    );
+    return empty(204);
+  }
+
+  const taskMatch = pathname.match(
+    /^\/api\/tasks\/([^/]+)(?:\/(archive|restore|move))?$/,
+  );
+  if (taskMatch) {
+    const taskId = decodePathPart(taskMatch[1], "Task id");
+    const action = taskMatch[2];
+    requireNoQuery(url, "Task routes");
+    if (!action && request.method === "GET") {
+      const task = await getTask(env, taskId);
+      if (!task) {
+        throw new ApiError(404, "TASK_NOT_FOUND", `Task '${taskId}' does not exist`);
+      }
+      return json(200, { task });
+    }
+    if (!action && request.method === "PATCH") {
+      return json(200, {
+        task: await updateTask(
+          env,
+          taskId,
+          parseTaskPatch(await readJson(request)),
+          actor,
+        ),
+      });
+    }
+    if (action === "move" && request.method === "POST") {
+      return json(200, {
+        task: await moveTask(env, taskId, parseMove(await readJson(request))),
+      });
+    }
+    if (action === "archive" && request.method === "POST") {
+      return json(200, {
+        task: await archiveTask(
+          env,
+          taskId,
+          parseVersionMutation(await readJson(request)),
+        ),
+      });
+    }
+    if (action === "restore" && request.method === "POST") {
+      return json(200, {
+        task: await restoreTask(
+          env,
+          taskId,
+          parseVersionMutation(await readJson(request)),
+        ),
+      });
+    }
+    methodNotAllowed(action ? ["POST"] : ["GET", "PATCH"]);
+  }
+
+  throw new ApiError(404, "NOT_FOUND", "API route not found");
+}
+
+function withSecurityHeaders(response) {
+  const secured = new Response(response.body, response);
+  secured.headers.set("x-content-type-options", "nosniff");
+  secured.headers.set("referrer-policy", "no-referrer");
+  return secured;
+}
+
+export default {
+  async fetch(request, env) {
+    const url = new URL(request.url);
+    try {
+      if (url.pathname === "/health") {
+        if (request.method !== "GET") methodNotAllowed(["GET"]);
+        return withSecurityHeaders(json(200, { status: "ok" }));
+      }
+
+      const actor = await authenticate(request, env);
+      if (!actor) return withSecurityHeaders(unauthorized());
+
+      const response = url.pathname.startsWith("/api/")
+        ? await routeApi(request, env, actor, url)
+        : env.ASSETS
+          ? await env.ASSETS.fetch(request)
+          : json(404, { error: { code: "NOT_FOUND", message: "Resource not found" } });
+      return withSecurityHeaders(response);
+    } catch (error) {
+      if (error instanceof ApiError) {
+        const payload = {
+          error: { code: error.code, message: error.message },
+        };
+        if (error.details !== undefined) payload.error.details = error.details;
+        const headers = error.status === 405 && error.details?.allowed
+          ? { allow: error.details.allowed.join(", ") }
+          : {};
+        return withSecurityHeaders(json(error.status, payload, headers));
+      }
+      console.error(error);
+      return withSecurityHeaders(json(500, {
+        error: { code: "INTERNAL_ERROR", message: "Internal server error" },
+      }));
+    }
+  },
+};
diff --git a/apps/codex-taskboard/docs/cloud-collaboration.md b/apps/codex-taskboard/docs/cloud-collaboration.md
new file mode 100644
index 000000000..853fdd23a
--- /dev/null
+++ b/apps/codex-taskboard/docs/cloud-collaboration.md
@@ -0,0 +1,194 @@
+# Cloud collaboration
+
+Codex Taskboard can run as a small shared Cloudflare deployment for two trusted collaborators:
+
+- one Worker serves the built UI and the JSON API;
+- D1 is the authoritative business database;
+- a private R2 bucket stores attachments;
+- UI, API, and attachment routes use HTTPS Basic Authentication; `/health` is public;
+- open boards poll a global revision every two seconds and refresh after a change.
+
+The production resource names are:
+
+| Resource | Name |
+| --- | --- |
+| Worker | `codex-taskboard` |
+| D1 database | `codex-taskboard-db` |
+| R2 bucket | `codex-taskboard-attachments` |
+
+This is intentionally a shared-password trust model. The Basic username is only the actor name displayed in task and comment attribution, not a verified identity. Anyone who knows the shared password has full read and write access and can choose any actor name. Use it only with the other trusted collaborator.
+
+## What stays local
+
+The cloud stores project, issue, comment, relation, workflow, and attachment data. It does not store a device's absolute project or worktree paths.
+
+Each collaborator runs the local companion for Codex, Git/worktree scanning, installed Skill/MCP discovery, and project path mapping. The companion keeps the cloud URL, actor name, shared password, and device-specific project mappings in `.data/cloud-companion.json` with mode `0600`.
+
+When cloud mode is active, the cloud is the only business-data source. A failed cloud request fails visibly. The companion does not fall back to the local SQLite database and does not write to both databases. `taskctl cloud logout` returns that device to its separate local mode; it does not merge local and cloud data.
+
+## Owner: validate locally
+
+Install dependencies and build the frontend:
+
+```bash
+npm ci
+npm run build:web
+```
+
+Create an ignored `.dev.vars` file containing a local-only value for `TASKBOARD_SHARED_SECRET`, apply the D1 migration to Wrangler's local state, and start the Worker:
+
+```bash
+npm run cloud:migrate:local
+npm run dev:cloud
+```
+
+Open the printed loopback URL. The browser shows its native Basic Authentication prompt. Enter any local actor name as the username and the value from `.dev.vars` as the password.
+
+Local Wrangler state lives under `.wrangler/` and is not committed.
+
+## Owner: deploy
+
+Authenticate Wrangler first:
+
+```bash
+npx wrangler login
+npx wrangler whoami
+```
+
+Provision the production D1 database and private R2 bucket using the exact names above.
+
+```bash
+npx wrangler d1 create codex-taskboard-db
+npx wrangler r2 bucket create codex-taskboard-attachments
+```
+
+`wrangler.jsonc` contains one production configuration and identifies the D1 binding by its resource name and `database_id`. A D1 database ID is public metadata and does not grant access, so it can be committed. Wrangler local development creates persistent local equivalents under `.wrangler/`; those are local simulations, not additional Cloudflare environments.
+
+Apply the remote D1 migration and validate the deployment bundle:
+
+```bash
+npm run cloud:migrate
+npm run cloud:deploy:dry-run
+```
+
+Set the shared password through Wrangler's private interactive prompt after the database schema is ready. Do not put the value in `wrangler.jsonc`, a shell command, a log, or a committed file. Then deploy the production Worker:
+
+```bash
+npx wrangler secret put TASKBOARD_SHARED_SECRET
+npm run cloud:deploy
+```
+
+These commands create or update Cloudflare resources. This repository contains the production D1 database ID for the binding, but it does not contain the shared password or any API or OAuth token. Keep those credentials out of Git; cloning the repository does not grant access or mean the Worker has already been deployed.
+
+Give the other collaborator the deployed Worker HTTPS origin and shared password through a trusted channel. Never publish the password in the repository, an issue, or logs.
+
+Current Cloudflare references:
+
+- [Workers Static Assets binding](https://developers.cloudflare.com/workers/static-assets/binding/)
+- [D1 migrations](https://developers.cloudflare.com/d1/reference/migrations/)
+- [Create an R2 bucket](https://developers.cloudflare.com/r2/buckets/create-buckets/)
+- [Workers secrets](https://developers.cloudflare.com/workers/configuration/secrets/)
+
+## Friend: connect an existing GitHub installation
+
+The owner follows this device setup too, using the owner's own actor name and checkout path. The friend does not need your local database or your filesystem paths. They update their existing clone and build the current UI:
+
+```bash
+git pull --ff-only
+npm ci
+npm run build:web
+```
+
+Start the local companion:
+
+```bash
+CODEX_TASKBOARD_HOST=127.0.0.1 npm start
+```
+
+In a second terminal, configure cloud mode. Use the deployed HTTPS Worker origin, choose the actor name that should appear on their actions, and enter the shared password only at the private `Shared key:` prompt:
+
+```bash
+npm run taskctl -- cloud login \
+  --url https://YOUR-WORKER-ORIGIN \
+  --actor-name "FRIEND-DISPLAY-NAME"
+
+npm run taskctl -- cloud status
+npm run taskctl -- project list
+```
+
+The shared password is not part of the command and is not echoed by the prompt.
+
+For every cloud project used with Codex, map its project ID to that friend's own absolute checkout path:
+
+```bash
+npm run taskctl -- project map PROJECT_ID \
+  --workspace-path /absolute/path/on/their/device
+```
+
+The owner runs the same mapping command with the owner's own path. Mappings are intentionally different on each device and are never synchronized to D1.
+
+Launch the injected Codex window:
+
+```bash
+CODEX_TASKBOARD_HOST=127.0.0.1 npm run codex
+```
+
+`npm run codex` reuses or starts the loopback companion. Keep it running while using the embedded board. The companion supplies local Codex/Git/Skill/MCP capabilities and sends the shared password to the Worker only in the HTTPS Basic `Authorization` header. It does not write that password to D1 or R2, return it to the browser UI, or print it in logs. Device paths also stay off Cloudflare.
+
+Do not point `CODEX_TASKBOARD_URL` directly at the cloud origin for this workflow. `taskctl` talks to the loopback companion, which applies Basic Authentication and the device's local project mapping. If the companion uses a non-default loopback port, set `CODEX_TASKBOARD_COMPANION_URL` to that loopback origin.
+
+## Browser-only access
+
+Either collaborator can open the deployed HTTPS Worker URL directly. The browser's native Basic Authentication prompt asks for:
+
+- username: the actor display name for that browser;
+- password: the shared password.
+
+The browser view supports the shared board and attachments. Device-only Codex, Git/worktree, Skill, and MCP capabilities still require the local companion.
+
+## Rotate or revoke the shared password
+
+The owner rotates the Worker secret using Wrangler's interactive prompt:
+
+```bash
+npx wrangler secret put TASKBOARD_SHARED_SECRET
+```
+
+After rotation, both devices rerun `taskctl cloud login` and enter the new password. Browser-only users must authenticate again; closing the authenticated browser session or clearing site authentication may be necessary because browsers cache Basic credentials.
+
+Because both collaborators share one password, rotation affects both at once. There is no individual-user revocation in this two-person trust model.
+
+## Advanced: one-time import of existing local data
+
+The migration tool takes a consistent SQLite snapshot with `VACUUM INTO`, removes structured device-only paths, exports attachment hashes, and writes a private bundle. The default local paths are:
+
+```bash
+npm run cloud:data -- export \
+  --database .data/taskboard.sqlite \
+  --attachments .data/attachments \
+  --output cloud-migration-exports/initial
+```
+
+The output directory contains issue content and attachment bytes. It is mode-restricted and ignored by Git, but it must still be handled as private data. This export is optional when starting with an empty cloud board.
+
+Before importing, authenticate Wrangler, provision the named D1 and R2 resources, and run `npm run cloud:migrate` so the remote D1 schema exists. The target D1 must contain no projects, and none of the bundle's attachment keys may already exist in R2. Import refuses a non-empty target instead of merging or overwriting it.
+
+Run the one-time Wrangler adapter with an explicit remote-operation acknowledgement:
+
+```bash
+TASKBOARD_MIGRATION_REMOTE=1 npm run cloud:data -- import \
+  --bundle cloud-migration-exports/initial \
+  --adapter ./scripts/wrangler-cloud-adapter.mjs
+
+TASKBOARD_MIGRATION_REMOTE=1 npm run cloud:data -- verify \
+  --bundle cloud-migration-exports/initial \
+  --adapter ./scripts/wrangler-cloud-adapter.mjs
+```
+
+`TASKBOARD_MIGRATION_REMOTE=1` is a deliberate safety gate for these two commands. The adapter uses the current Wrangler login and the production resource names from `wrangler.jsonc`; it does not add a migration HTTP endpoint or store Cloudflare credentials. The commands are not run automatically by deployment, so having the repository does not mean data has already been imported.
+
+The adapter has a local-persistence integration test that does not access remote Cloudflare resources:
+
+```bash
+node --test test/cloud-migration.test.mjs
+```
diff --git a/apps/codex-taskboard/inject/codex-taskboard.user.js b/apps/codex-taskboard/inject/codex-taskboard.user.js
new file mode 100644
index 000000000..06d905458
--- /dev/null
+++ b/apps/codex-taskboard/inject/codex-taskboard.user.js
@@ -0,0 +1,1870 @@
+(() => {
+  "use strict";
+
+  const VERSION = "0.6.8";
+  const SOURCE_HASH = window.__CODEX_TASKBOARD_SOURCE_HASH__;
+  const SENTINEL_KEY = "__codexTaskboardInjection__";
+  const DEFAULT_TASKBOARD_URL = "http://127.0.0.1:47823/?host=codex";
+  const ENTRY_ID = "codex-taskboard-entry";
+  const PAGE_ID = "codex-taskboard-page";
+  const FRAME_ID = "codex-taskboard-frame";
+  const NATIVE_THREAD_PANEL_ID = "codex-taskboard-native-thread-panel";
+  const NATIVE_THREAD_PANEL_BODY_ID = "codex-taskboard-native-thread-panel-body";
+  const DRAG_REGION_ID = "codex-taskboard-drag-region";
+  const NO_DRAG_LEFT_ID = "codex-taskboard-no-drag-left";
+  const NO_DRAG_RIGHT_ID = "codex-taskboard-no-drag-right";
+  const STATUS_ID = "codex-taskboard-status";
+  const STYLE_ID = "codex-taskboard-inject-style";
+  const OWNED_ATTRIBUTE = "data-codex-taskboard-owned";
+  const HIDDEN_ATTRIBUTE = "data-codex-taskboard-native-hidden";
+  const HOST_ATTRIBUTE = "data-codex-taskboard-page-host";
+  const NATIVE_SELECTED_ATTRIBUTE = "data-codex-taskboard-native-selected";
+  const NATIVE_THREAD_HOST_ATTRIBUTE = "data-codex-taskboard-native-thread-host";
+  const HOST_BINDING_NAME = "__codexTaskboardHostV1";
+  const HOST_HEARTBEAT_NAME = "__codexTaskboardHostHeartbeatV1";
+  const REATTACH_DELAY_MS = 160;
+  const FRAME_READY_TIMEOUT_MS = 12_000;
+  const HOST_REQUEST_TIMEOUT_MS = 12_000;
+  const HOST_HEARTBEAT_MAX_AGE_MS = 8_000;
+  const MACOS_TITLEBAR_SAFE_LEFT = 80;
+  const FRAME_REFRESH_PARAM = "__codex_taskboard_refresh";
+  const PLUGIN_LABELS = ["插件", "plugins"];
+  const NATIVE_PAGE_LABELS = [
+    "新建任务",
+    "新对话",
+    "new task",
+    "new chat",
+    "new conversation",
+    "拉取请求",
+    "pull requests",
+    "站点",
+    "sites",
+    "已安排",
+    "scheduled",
+    "插件",
+    "plugins",
+  ];
+  const PROJECT_SECTION_LABELS = ["projects", "项目"];
+  const TASK_SECTION_LABELS = ["tasks", "任务", "chats", "对话"];
+  const CODEX_ICONS = {
+    chevronDown: {
+      viewBox: "0 0 16 16",
+      content: `<path d="M4.53 5.47a.75.75 0 0 0-1.06 1.06l4 4a.75.75 0 0 0 1.054.007l4-3.903a.75.75 0 0 0-1.048-1.073l-3.47 3.385L4.53 5.47Z"></path>`,
+    },
+    close: {
+      viewBox: "0 0 16 16",
+      content: `<path d="M2.96967 2.96967C3.26256 2.67678 3.73744 2.67678 4.03033 2.96967L8 6.939L11.9697 2.96967C12.2626 2.67678 12.7374 2.67678 13.0303 2.96967C13.3232 3.26256 13.3232 3.73744 13.0303 4.03033L9.061 8L13.0303 11.9697C13.2966 12.2359 13.3208 12.6526 13.1029 12.9462L13.0303 13.0303C12.7374 13.3232 12.2626 13.3232 11.9697 13.0303L8 9.061L4.03033 13.0303C3.73744 13.3232 3.26256 13.3232 2.96967 13.0303C2.67678 12.7374 2.67678 12.2626 2.96967 11.9697L6.939 8L2.96967 4.03033C2.7034 3.76406 2.6792 3.3474 2.89705 3.05379L2.96967 2.96967Z"></path>`,
+    },
+    expand: {
+      viewBox: "0 0 16 16",
+      content: `<path d="M6.2168 8.72266C6.50798 8.42824 6.98279 8.4257 7.27734 8.7168C7.57154 9.00799 7.57423 9.48287 7.2832 9.77734L4.59863 12.5H6.2998C6.71402 12.5 7.0498 12.8358 7.0498 13.25C7.04964 13.6641 6.71392 14 6.2998 14H2.75C2.55116 14 2.36036 13.9208 2.21973 13.7803C2.07915 13.6397 2.00008 13.4488 2 13.25V9.75C2 9.33579 2.33579 9 2.75 9C3.16421 9 3.5 9.33579 3.5 9.75V11.4775L6.2168 8.72266Z"></path><path d="M13.25 2C13.4488 2.00006 13.6397 2.07917 13.7803 2.21973C13.9208 2.36033 14 2.55119 14 2.75V6.25C14 6.66414 13.6641 6.99988 13.25 7C12.8358 7 12.5 6.66421 12.5 6.25V4.52246L9.7832 7.27734C9.49206 7.57173 9.01721 7.57419 8.72266 7.2832C8.42838 6.99201 8.42575 6.51716 8.7168 6.22266L11.4014 3.5H9.7002C9.28598 3.5 8.9502 3.16421 8.9502 2.75C8.95028 2.33586 9.28603 2 9.7002 2H13.25Z"></path>`,
+    },
+    openExternal: {
+      viewBox: "0 0 16 16",
+      content: `<path d="M6.413 1.313c.241 0 .472-.005.643.166.17.17.266.342.266.583a.817.817 0 0 1-.266.602c-.17.17-.402.166-.643.166h-1.43c-.635-.018-1.144.292-1.485.633-.34.34-.632 1.003-.632 1.485v6.06c0 .481.192 1.044.532 1.384.341.341.904.733 1.386.733h6.259c.482 0 1.144-.292 1.485-.633.341-.34.633-1.003.633-1.485V9.721c0-.24-.005-.472.166-.642.17-.17.301-.267.542-.267a.91.91 0 0 1 .643.267c.17.17.166.401.166.642v1.286a3.635 3.635 0 0 1-3.449 3.63c-.072.004-.113.004-.186.005-2.366.06-3.694.06-6.06 0-.072-.001-.113 0-.186-.004a3.636 3.636 0 0 1-3.444-3.444c-.004-.073-.003-.114-.005-.187-.06-2.365 0-3.693 0-6.059a3.635 3.635 0 0 1 3.636-3.635h1.429Z"></path><path d="M14.675 6.063a.75.75 0 1 1-1.5 0v-2.19l-4.148 4.5a.75.75 0 1 1-1.06-1.06l4.148-4.5h-2.19a.75.75 0 0 1 0-1.5h4a.75.75 0 0 1 .75.75v4Z"></path>`,
+    },
+    panel: {
+      viewBox: "0 0 16 16",
+      content: `<path fill-rule="evenodd" clip-rule="evenodd" d="M4.25 2C2.45508 2 1 3.45508 1 5.25V10.75C1 12.5449 2.45508 14 4.25 14H11.75C13.5449 14 15 12.5449 15 10.75V5.25C15 3.45508 13.5449 2 11.75 2H4.25ZM2.5 5.5C2.5 4.39543 3.39543 3.5 4.5 3.5H11.5C12.6046 3.5 13.5 4.39543 13.5 5.5V10.5C13.5 11.6046 12.6046 12.5 11.5 12.5H4.5C3.39543 12.5 2.5 11.6046 2.5 10.5V5.5Z"></path><rect x="10" y="5" width="1.5" height="6" rx=".75"></rect>`,
+    },
+  };
+
+  const previous = window[SENTINEL_KEY];
+  if (previous?.sourceHash === SOURCE_HASH && typeof previous.refresh === "function") {
+    previous.refresh();
+    return;
+  }
+  try {
+    previous?.destroy?.();
+  } catch (_) {}
+
+  let entry = null;
+  let page = null;
+  let frame = null;
+  let dragRegion = null;
+  let noDragLeft = null;
+  let noDragRight = null;
+  let status = null;
+  let frameOrigin = "";
+  let frameReady = false;
+  let frameReadyWaiters = new Set();
+  let hostRequests = new Map();
+  let hostRequestSequence = 0;
+  let observer = null;
+  let reattachTimer = null;
+  let lastFocusedElement = null;
+  let hostContextSnapshot = null;
+  let mutedNativeSelections = new Map();
+  let openGeneration = 0;
+  let pendingThreadCreation = null;
+  let lastNativeThreadId = "";
+  let active = false;
+  let destroyed = false;
+  let nativeThreadPanel = null;
+  let nativeThreadPanelBody = null;
+  let nativeThreadPanelHost = null;
+  let nativeThreadPanelHostStyle = "";
+  let nativeThreadPanelSize = "compact";
+  let nativeThreadPanelThreadId = "";
+  let nativeThreadPanelWorkspacePath = "";
+  let nativeThreadPanelThreadTitle = "";
+  let nativeThreadPanelCanAttach = false;
+  let nativeThreadPanelResizeObserver = null;
+  let suppressNativeCloseUntil = 0;
+
+  function normalizedLabel(value) {
+    return String(value || "").replace(/\s+/g, " ").trim().toLowerCase();
+  }
+
+  function normalizeThreadId(value) {
+    return String(value || "").trim().replace(/^(?:local|cloud):/i, "");
+  }
+
+  function resolveTaskboardUrl() {
+    const configured = typeof window.__CODEX_TASKBOARD_URL__ === "string"
+      ? window.__CODEX_TASKBOARD_URL__.trim()
+      : "";
+    try {
+      const url = new URL(configured || DEFAULT_TASKBOARD_URL);
+      if (url.protocol !== "http:" && url.protocol !== "https:") {
+        throw new Error("Unsupported taskboard URL protocol");
+      }
+      if (!url.searchParams.has("host")) url.searchParams.set("host", "codex");
+      return url;
+    } catch (_) {
+      return new URL(DEFAULT_TASKBOARD_URL);
+    }
+  }
+
+  function isLocalTaskboardOrigin(origin) {
+    try {
+      const { protocol, hostname } = new URL(origin);
+      return (protocol === "http:" || protocol === "https:")
+        && (hostname === "127.0.0.1" || hostname === "localhost");
+    } catch (_) {
+      return false;
+    }
+  }
+
+  function installStyles() {
+    if (document.getElementById(STYLE_ID)) return;
+    const style = document.createElement("style");
+    style.id = STYLE_ID;
+    style.setAttribute(OWNED_ATTRIBUTE, "true");
+    style.textContent = `
+      #${ENTRY_ID}[aria-current="page"] {
+        background: var(--color-token-list-hover-background, color-mix(in srgb, currentColor 8%, transparent));
+        color: var(--color-token-foreground, inherit);
+      }
+      #${ENTRY_ID}:focus-visible {
+        outline: 2px solid var(--color-token-border, Highlight);
+        outline-offset: 2px;
+      }
+      [${HOST_ATTRIBUTE}="true"] {
+        position: relative !important;
+        z-index: 31 !important;
+        pointer-events: none !important;
+      }
+      [${HIDDEN_ATTRIBUTE}="true"] {
+        visibility: hidden !important;
+        pointer-events: none !important;
+      }
+      [${NATIVE_SELECTED_ATTRIBUTE}="true"] {
+        background-color: transparent !important;
+      }
+      [${NATIVE_SELECTED_ATTRIBUTE}="true"] [class*="text-token-list-active-selection"] {
+        color: var(--color-token-foreground, inherit) !important;
+      }
+      #${PAGE_ID} {
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        z-index: 1;
+        min-width: 0;
+        min-height: 0;
+        overflow: hidden;
+        background: Canvas;
+        color: CanvasText;
+        pointer-events: auto;
+      }
+      #${PAGE_ID}[hidden] {
+        display: none !important;
+      }
+      #${FRAME_ID} {
+        display: block;
+        width: 100%;
+        height: 100%;
+        border: 0;
+        background: Canvas;
+      }
+      #${FRAME_ID}[hidden] {
+        display: none !important;
+      }
+      #${DRAG_REGION_ID} {
+        position: absolute;
+        z-index: 2;
+        background: transparent;
+        pointer-events: none;
+        -webkit-app-region: drag;
+      }
+      #${NO_DRAG_LEFT_ID},
+      #${NO_DRAG_RIGHT_ID} {
+        position: absolute;
+        z-index: 2;
+        background: transparent;
+        pointer-events: none;
+        -webkit-app-region: no-drag;
+      }
+      #${DRAG_REGION_ID}[hidden],
+      #${NO_DRAG_LEFT_ID}[hidden],
+      #${NO_DRAG_RIGHT_ID}[hidden] {
+        display: none !important;
+      }
+      #${STATUS_ID} {
+        position: absolute;
+        inset: 0;
+        display: grid;
+        place-items: center;
+        padding: 24px;
+        color: var(--color-token-text-secondary, color-mix(in srgb, CanvasText 60%, transparent));
+        font: 13px/1.5 system-ui, sans-serif;
+        text-align: center;
+      }
+      #${STATUS_ID}[hidden] {
+        display: none !important;
+      }
+      #${STATUS_ID} button {
+        margin-top: 10px;
+        border: 1px solid var(--color-token-border, color-mix(in srgb, CanvasText 16%, transparent));
+        border-radius: 7px;
+        padding: 5px 10px;
+        background: var(--color-token-main-surface-secondary, Canvas);
+        color: var(--color-token-foreground, CanvasText);
+        cursor: pointer;
+      }
+      #${NATIVE_THREAD_PANEL_ID} {
+        position: fixed;
+        right: 12px;
+        bottom: 12px;
+        width: min(440px, calc(100vw - 24px));
+        height: min(620px, calc(100vh - 24px));
+        max-width: calc(100vw - 24px);
+        max-height: calc(100vh - 24px);
+        box-sizing: border-box;
+        z-index: 8;
+        display: grid;
+        grid-template-rows: 38px minmax(0, 1fr);
+        pointer-events: none;
+        color: var(--color-token-foreground, CanvasText);
+        font: 13px/1.4 system-ui, sans-serif;
+      }
+      #${NATIVE_THREAD_PANEL_ID}[hidden] {
+        display: none !important;
+      }
+      #${NATIVE_THREAD_PANEL_ID}[data-size="maximized"] {
+        right: 12px;
+        bottom: 12px;
+        width: min(760px, calc(100vw - 24px));
+        height: min(760px, calc(100vh - 24px));
+        max-width: calc(100vw - 24px);
+        max-height: calc(100vh - 24px);
+        grid-template-rows: 40px minmax(0, 1fr);
+      }
+      #${NATIVE_THREAD_PANEL_ID} .codex-taskboard-native-thread-header {
+        display: flex;
+        align-items: center;
+        gap: 6px;
+        min-width: 0;
+        min-height: 0;
+        padding: 0 7px 0 11px;
+        border: 1px solid var(--color-token-border, color-mix(in srgb, CanvasText 14%, transparent));
+        border-bottom: 0;
+        border-radius: 14px 14px 0 0;
+        background: var(--color-token-main-surface-primary, Canvas);
+        box-shadow: 0 10px 30px color-mix(in srgb, CanvasText 15%, transparent);
+        pointer-events: auto;
+        -webkit-app-region: no-drag;
+      }
+      #${NATIVE_THREAD_PANEL_ID} .codex-taskboard-native-thread-title {
+        min-width: 0;
+        flex: 1;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        font-weight: 650;
+        font-size: 13px;
+      }
+      #${NATIVE_THREAD_PANEL_ID} .codex-taskboard-native-thread-id {
+        display: none;
+        color: var(--color-token-text-secondary, color-mix(in srgb, CanvasText 58%, transparent));
+        font-size: 12px;
+        font-weight: 500;
+      }
+      #${NATIVE_THREAD_PANEL_ID} button {
+        border: 1px solid transparent;
+        border-radius: 8px;
+        width: 28px;
+        height: 28px;
+        padding: 0;
+        background: transparent;
+        color: var(--color-token-text-secondary, color-mix(in srgb, CanvasText 68%, transparent));
+        cursor: pointer;
+        display: grid;
+        place-items: center;
+        flex: 0 0 auto;
+        font: 16px/1 system-ui, sans-serif;
+      }
+      #${NATIVE_THREAD_PANEL_ID} button:hover {
+        background: var(--color-token-list-hover-background, color-mix(in srgb, CanvasText 8%, transparent));
+        color: var(--color-token-foreground, CanvasText);
+      }
+      #${NATIVE_THREAD_PANEL_ID} button svg {
+        display: block;
+        width: 16px;
+        height: 16px;
+      }
+      #${NATIVE_THREAD_PANEL_BODY_ID} {
+        min-width: 0;
+        min-height: 0;
+        border-radius: 0 0 14px 14px;
+        pointer-events: none;
+      }
+      #${NATIVE_THREAD_PANEL_ID}[data-native-host="false"] #${NATIVE_THREAD_PANEL_BODY_ID} {
+        display: grid;
+        place-items: center;
+        padding: 20px;
+        border: 1px solid var(--color-token-border, color-mix(in srgb, CanvasText 14%, transparent));
+        border-top: 0;
+        background: var(--color-token-main-surface-primary, Canvas);
+        box-shadow: 0 14px 42px color-mix(in srgb, CanvasText 16%, transparent);
+        pointer-events: auto;
+      }
+      #${NATIVE_THREAD_PANEL_ID} .codex-taskboard-native-thread-fallback {
+        max-width: 320px;
+        display: grid;
+        justify-items: center;
+        gap: 12px;
+        color: var(--color-token-text-secondary, color-mix(in srgb, CanvasText 62%, transparent));
+        text-align: center;
+      }
+      #${NATIVE_THREAD_PANEL_ID} .codex-taskboard-native-thread-fallback p {
+        margin: 0;
+        font: 13px/1.55 system-ui, sans-serif;
+      }
+      #${NATIVE_THREAD_PANEL_ID} .codex-taskboard-native-thread-fallback button {
+        width: auto;
+        height: 32px;
+        padding: 0 12px;
+        border: 1px solid var(--color-token-border, color-mix(in srgb, CanvasText 16%, transparent));
+        border-radius: 8px;
+        background: var(--color-token-main-surface-secondary, Canvas);
+        color: var(--color-token-foreground, CanvasText);
+        font: 13px/1 system-ui, sans-serif;
+      }
+      [${NATIVE_THREAD_HOST_ATTRIBUTE}="true"] {
+        visibility: visible !important;
+        pointer-events: auto !important;
+        margin: 0 !important;
+        min-width: 0 !important;
+        min-height: 0 !important;
+        --thread-content-max-width: 100% !important;
+        overflow: hidden !important;
+        background: var(--color-token-main-surface-primary, Canvas) !important;
+        border: 1px solid var(--color-token-border, color-mix(in srgb, CanvasText 14%, transparent)) !important;
+        border-top: 0 !important;
+        border-radius: 0 0 14px 14px !important;
+        box-shadow: 0 14px 42px color-mix(in srgb, CanvasText 16%, transparent) !important;
+      }
+      [${NATIVE_THREAD_HOST_ATTRIBUTE}="true"] .thread-scroll-container > .flex.min-h-full.shrink-0.flex-col.justify-start {
+        transform: none !important;
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+      [${NATIVE_THREAD_HOST_ATTRIBUTE}="true"] .thread-scroll-container {
+        scrollbar-color: color-mix(in srgb, CanvasText 36%, transparent) transparent !important;
+      }
+      [${NATIVE_THREAD_HOST_ATTRIBUTE}="true"] .thread-scroll-container .mx-auto.w-full[class*="max-w-"] {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+      [${NATIVE_THREAD_HOST_ATTRIBUTE}="true"] .thread-scroll-container .px-toolbar {
+        padding-left: 12px !important;
+        padding-right: 12px !important;
+      }
+      [${NATIVE_THREAD_HOST_ATTRIBUTE}="true"] .pointer-events-none.absolute[class*="right-0"][class*="z-40"] {
+        display: none !important;
+      }
+      @media (max-width: 720px) {
+        #${NATIVE_THREAD_PANEL_ID} {
+          right: 8px;
+          bottom: 8px;
+          width: calc(100vw - 16px);
+          max-width: calc(100vw - 16px);
+        }
+        #${NATIVE_THREAD_PANEL_ID}[data-size="maximized"] {
+          right: 8px;
+          bottom: 8px;
+          width: calc(100vw - 16px);
+          height: min(760px, calc(100vh - 16px));
+          max-width: calc(100vw - 16px);
+          max-height: calc(100vh - 16px);
+        }
+      }
+      @media (max-height: 680px) {
+        #${NATIVE_THREAD_PANEL_ID} {
+          bottom: 8px;
+          height: calc(100vh - 16px);
+          max-height: calc(100vh - 16px);
+        }
+        #${NATIVE_THREAD_PANEL_ID}[data-size="maximized"] {
+          right: 8px;
+          bottom: 8px;
+          width: min(760px, calc(100vw - 16px));
+          height: calc(100vh - 16px);
+          max-width: calc(100vw - 16px);
+          max-height: calc(100vh - 16px);
+        }
+      }
+    `;
+    (document.head || document.documentElement).appendChild(style);
+  }
+
+  function buttonMatches(button, labels) {
+    if (!button) return false;
+    const text = normalizedLabel(button.textContent || button.getAttribute("aria-label"));
+    return labels.includes(text);
+  }
+
+  function findReferenceButton() {
+    const scroll = document.querySelector("[data-app-action-sidebar-scroll]");
+    if (!scroll) return null;
+    const buttons = Array.from(scroll.querySelectorAll("button"));
+    const plugin = buttons.find((button) => buttonMatches(button, PLUGIN_LABELS));
+    if (plugin?.parentElement) return plugin;
+
+    const firstSection = scroll.querySelector("[data-app-action-sidebar-section]");
+    const sectionTop = firstSection?.getBoundingClientRect().top ?? Number.POSITIVE_INFINITY;
+    const groups = Array.from(scroll.querySelectorAll("div")).filter((element) => {
+      const directButtons = Array.from(element.children).filter((child) => child.tagName === "BUTTON");
+      return directButtons.length >= 3 && element.getBoundingClientRect().top < sectionTop;
+    });
+    const group = groups.sort((left, right) => right.children.length - left.children.length)[0];
+    return Array.from(group?.children || []).filter((child) => child.tagName === "BUTTON").at(-1) || null;
+  }
+
+  function applyCodexIcon(svg, name) {
+    const icon = CODEX_ICONS[name];
+    if (!icon) return;
+    svg.setAttribute("viewBox", icon.viewBox);
+    svg.setAttribute("fill", "currentColor");
+    svg.removeAttribute("stroke");
+    svg.removeAttribute("stroke-width");
+    svg.removeAttribute("stroke-linecap");
+    svg.removeAttribute("stroke-linejoin");
+    svg.style.fill = "currentColor";
+    svg.style.stroke = "none";
+    svg.innerHTML = icon.content;
+  }
+
+  function createCodexIcon(name) {
+    const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+    svg.setAttribute("width", "16");
+    svg.setAttribute("height", "16");
+    svg.setAttribute("aria-hidden", "true");
+    svg.setAttribute("focusable", "false");
+    applyCodexIcon(svg, name);
+    return svg;
+  }
+
+  function setIconButton(button, name) {
+    button.replaceChildren(createCodexIcon(name));
+  }
+
+  function replaceEntryIcon(button) {
+    const icon = button.querySelector("svg");
+    if (!icon) return;
+    applyCodexIcon(icon, "panel");
+  }
+
+  function createEntry(reference) {
+    const button = reference.cloneNode(true);
+    button.id = ENTRY_ID;
+    button.type = "button";
+    button.removeAttribute("disabled");
+    button.removeAttribute("aria-expanded");
+    button.removeAttribute("aria-controls");
+    button.removeAttribute("aria-describedby");
+    button.removeAttribute("data-state");
+    button.setAttribute("aria-label", "打开任务面板");
+    button.setAttribute("title", "任务面板");
+    button.setAttribute(OWNED_ATTRIBUTE, "true");
+    button.querySelectorAll("[id]").forEach((node) => node.removeAttribute("id"));
+    const label = button.querySelector(".text-fade-truncate")
+      || Array.from(button.querySelectorAll("span")).find((node) => buttonMatches(node, PLUGIN_LABELS));
+    if (label) label.textContent = "任务面板";
+    else button.textContent = "任务面板";
+    replaceEntryIcon(button);
+    button.addEventListener("click", (event) => {
+      event.preventDefault();
+      event.stopPropagation();
+      openTaskboard();
+    });
+    return button;
+  }
+
+  function syncEntryState() {
+    if (!entry) return;
+    if (active && entry.getAttribute("aria-current") !== "page") {
+      entry.setAttribute("aria-current", "page");
+    } else if (!active && entry.hasAttribute("aria-current")) {
+      entry.removeAttribute("aria-current");
+    }
+  }
+
+  function ensureEntry() {
+    if (destroyed || !document.body) return;
+    installStyles();
+    const reference = findReferenceButton();
+    if (!reference?.parentElement) return;
+    if (!entry) entry = createEntry(reference);
+    if (entry.parentElement !== reference.parentElement || entry.previousElementSibling !== reference) {
+      reference.after(entry);
+    }
+    syncEntryState();
+  }
+
+  function findPageHost() {
+    const direct = document.querySelector(".app-shell-main-content-frame");
+    if (direct?.closest?.("[data-app-shell-main-content-layout]")) return direct;
+
+    const viewport = document.querySelector("[data-app-shell-main-content-layout]");
+    if (!viewport) return null;
+    const viewportRect = viewport.getBoundingClientRect();
+    const headerBottom = document.querySelector("main > header")?.getBoundingClientRect().bottom
+      ?? viewportRect.top;
+    return Array.from(viewport.children).find((candidate) => {
+      const rect = candidate.getBoundingClientRect();
+      return rect.width >= viewportRect.width * 0.8
+        && rect.height >= viewportRect.height * 0.7
+        && rect.top >= headerBottom - 1;
+    }) || null;
+  }
+
+  function findPageMount() {
+    const frameHost = findPageHost();
+    const viewport = frameHost?.closest?.("[data-app-shell-main-content-layout]");
+    const surface = viewport?.parentElement;
+    if (!frameHost || !viewport || !surface || !surface.closest("main")) return null;
+    return { frameHost, surface };
+  }
+
+  function muteNativeSelection() {
+    if (!active) return;
+    document.querySelectorAll('aside nav[role="navigation"] [aria-current]')
+      .forEach((node) => {
+        if (node === entry || node.closest(`#${ENTRY_ID}`)) return;
+        if (!mutedNativeSelections.has(node)) {
+          mutedNativeSelections.set(node, node.getAttribute("aria-current"));
+        }
+        node.removeAttribute("aria-current");
+        node.setAttribute(NATIVE_SELECTED_ATTRIBUTE, "true");
+      });
+  }
+
+  function restoreNativeSelection() {
+    mutedNativeSelections.forEach((ariaCurrent, node) => {
+      if (!node.isConnected) return;
+      node.setAttribute("aria-current", ariaCurrent);
+      node.removeAttribute(NATIVE_SELECTED_ATTRIBUTE);
+    });
+    mutedNativeSelections.clear();
+    document.querySelectorAll(`[${NATIVE_SELECTED_ATTRIBUTE}="true"]`)
+      .forEach((node) => node.removeAttribute(NATIVE_SELECTED_ATTRIBUTE));
+  }
+
+  function hideNativeHeader() {
+    document.querySelectorAll('[data-testid="app-shell-header-context-menu-surface"]')
+      .forEach((surface) => {
+        Array.from(surface.children).forEach((child) => {
+          if (child.getAttribute(OWNED_ATTRIBUTE) !== "true") {
+            child.setAttribute(HIDDEN_ATTRIBUTE, "true");
+          }
+        });
+      });
+  }
+
+  function currentTheme() {
+    const root = document.documentElement;
+    const explicit = String(root.dataset.theme || root.getAttribute("data-color-theme") || "").toLowerCase();
+    if (explicit.includes("dark") || root.classList.contains("dark")) return "dark";
+    if (explicit.includes("light") || root.classList.contains("light")) return "light";
+    try {
+      return window.getComputedStyle(root).colorScheme.includes("dark") ? "dark" : "light";
+    } catch (_) {
+      return "light";
+    }
+  }
+
+  function threadIdFromLocation() {
+    const source = `${window.location.pathname || ""}${window.location.search || ""}${window.location.hash || ""}`;
+    const match = source.match(/(?:session|conversation|thread)(?:\/|=|:|-)([A-Za-z0-9_.-]+)/i)
+      || source.match(/\/([0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12})(?:[/?#]|$)/)
+      || source.match(/\/([A-Za-z0-9_-]{24,})(?:[/?#]|$)/);
+    return match ? decodeURIComponent(match[1]) : "";
+  }
+
+  function activeThreadRow() {
+    const rows = Array.from(document.querySelectorAll("[data-app-action-sidebar-thread-id]"));
+    return rows.find((row) => row.getAttribute("data-app-action-sidebar-thread-active") === "true")
+      || rows.find((row) => ["page", "true"].includes(row.getAttribute("aria-current")))
+      || null;
+  }
+
+  function readCodexProjects() {
+    const seen = new Set();
+    return Array.from(document.querySelectorAll("[data-app-action-sidebar-project-row]"))
+      .flatMap((row) => {
+        const id = row.getAttribute("data-app-action-sidebar-project-id")?.trim();
+        const name = (
+          row.getAttribute("data-app-action-sidebar-project-label")
+          || row.getAttribute("aria-label")
+          || ""
+        ).trim();
+        if (!id || !name || seen.has(id)) return [];
+        seen.add(id);
+        return [{ id, name }];
+      });
+  }
+
+  function readVisibleThreadIds(scope) {
+    const seen = new Set();
+    const root = scope && typeof scope.querySelectorAll === "function" ? scope : document;
+    return Array.from(root.querySelectorAll("[data-app-action-sidebar-thread-id]"))
+      .flatMap((row) => {
+        const threadId = normalizeThreadId(row.getAttribute("data-app-action-sidebar-thread-id"));
+        if (!threadId || threadId.startsWith("client-new-thread:") || seen.has(threadId)) return [];
+        seen.add(threadId);
+        return [threadId];
+      })
+      .sort();
+  }
+
+  function findProjectsSection() {
+    return Array.from(document.querySelectorAll("[data-app-action-sidebar-section-heading]"))
+      .find((node) => PROJECT_SECTION_LABELS.includes(normalizedLabel(
+        node.getAttribute("data-app-action-sidebar-section-heading") || node.textContent,
+      )))
+      ?.closest("[data-app-action-sidebar-section]") || null;
+  }
+
+  function findTasksSection() {
+    return Array.from(document.querySelectorAll("[data-app-action-sidebar-section]"))
+      .find((section) => {
+        const heading = section.querySelector("[data-app-action-sidebar-section-heading]");
+        const label = heading?.getAttribute("data-app-action-sidebar-section-heading")
+          || heading?.textContent
+          || section.textContent;
+        return TASK_SECTION_LABELS.includes(normalizedLabel(label));
+      }) || null;
+  }
+
+  async function captureHostContext() {
+    let projects = readCodexProjects();
+    let section = findProjectsSection();
+    const sectionDeadline = Date.now() + 1_200;
+    while (!section && Date.now() < sectionDeadline) {
+      await new Promise((resolve) => window.setTimeout(resolve, 40));
+      section = findProjectsSection();
+    }
+    const tasksSection = findTasksSection();
+    const expandedSections = [section, tasksSection].filter((candidate) => (
+      candidate?.getAttribute("data-app-action-sidebar-section-collapsed") === "true"
+    ));
+    expandedSections.forEach((candidate) => (
+      candidate.querySelector("[data-app-action-sidebar-section-toggle]")?.click()
+    ));
+    if (expandedSections.length > 0) {
+      const deadline = Date.now() + 1_200;
+      do {
+        await new Promise((resolve) => window.setTimeout(resolve, 40));
+        projects = readCodexProjects();
+      } while ((projects.length === 0 || !activeThreadRow()) && Date.now() < deadline);
+    }
+    const context = readHostContext(projects);
+    expandedSections.forEach((candidate) => {
+      if (candidate.isConnected && candidate.getAttribute("data-app-action-sidebar-section-collapsed") === "false") {
+        candidate.querySelector("[data-app-action-sidebar-section-toggle]")?.click();
+      }
+    });
+    return context;
+  }
+
+  function workspaceFromLocation() {
+    try {
+      const url = new URL(window.location.href);
+      return url.searchParams.get("workspace") || url.searchParams.get("cwd") || "";
+    } catch (_) {
+      return "";
+    }
+  }
+
+  function titlebarLeftInset() {
+    if (!/Macintosh|Mac OS X/.test(navigator.userAgent)) return 0;
+    if (nativeSidebarCollapsed()) return MACOS_TITLEBAR_SAFE_LEFT;
+    const surfaceLeft = findPageMount()?.surface.getBoundingClientRect().left;
+    if (!Number.isFinite(surfaceLeft)) return 0;
+    return Math.max(0, Math.ceil(MACOS_TITLEBAR_SAFE_LEFT - surfaceLeft));
+  }
+
+  function nativeSidebarTrigger() {
+    const triggers = Array.from(
+      document.querySelectorAll('[data-app-shell-sidebar-trigger="true"]'),
+    );
+    return triggers.find((trigger) => getComputedStyle(trigger).visibility !== "hidden")
+      || triggers[0]
+      || null;
+  }
+
+  function nativeSidebarCollapsed() {
+    const label = normalizedLabel(nativeSidebarTrigger()?.getAttribute("aria-label"));
+    return label.startsWith("显示") || label.startsWith("show ");
+  }
+
+  function expandNativeSidebar() {
+    const trigger = nativeSidebarTrigger();
+    if (!trigger || !nativeSidebarCollapsed()) return;
+    trigger.click();
+    window.setTimeout(postHostContext, REATTACH_DELAY_MS);
+  }
+
+  function userIdFromName(name) {
+    const slug = name.normalize("NFKD")
+      .toLowerCase()
+      .replace(/[^a-z0-9]+/g, "-")
+      .replace(/^-+|-+$/g, "")
+      .slice(0, 96);
+    if (slug) return slug;
+    let hash = 2166136261;
+    for (const character of name) {
+      hash ^= character.codePointAt(0);
+      hash = Math.imul(hash, 16777619);
+    }
+    return `codex-user-${(hash >>> 0).toString(36)}`;
+  }
+
+  function readCodexUser() {
+    const avatar = Array.from(document.querySelectorAll("img"))
+      .find((image) => image.src.includes("cdn.auth0.com/avatars/"));
+    const profileButton = avatar?.closest("button")
+      || Array.from(document.querySelectorAll('button[aria-haspopup="menu"]')).find((button) => (
+        normalizedLabel(button.getAttribute("aria-label")).includes("profile")
+        || normalizedLabel(button.getAttribute("aria-label")).includes("个人资料")
+      ));
+    const name = profileButton?.textContent?.replace(/\s+/g, " ").trim();
+    if (!name) return null;
+    const avatarUrl = avatar?.currentSrc || avatar?.src || null;
+    return {
+      type: "user",
+      id: userIdFromName(name),
+      name,
+      avatarUrl,
+    };
+  }
+
+  function readHostContext(projects = readCodexProjects()) {
+    const row = activeThreadRow();
+    const activeThreadId = normalizeThreadId(row?.getAttribute("data-app-action-sidebar-thread-id"));
+    if (activeThreadId) lastNativeThreadId = activeThreadId;
+    const threadId = activeThreadId || lastNativeThreadId || normalizeThreadId(threadIdFromLocation());
+    const projectList = row?.closest?.("[data-app-action-sidebar-project-list-id]");
+    const projectRow = row?.closest?.("[data-app-action-sidebar-project-id]")
+      || document.querySelector('[data-app-action-sidebar-project-row][aria-current="page"]')
+      || document.querySelector('[data-app-action-sidebar-project-row][data-app-action-sidebar-project-active="true"]');
+    const projectId = projectList?.getAttribute("data-app-action-sidebar-project-list-id")
+      || projectRow?.getAttribute("data-app-action-sidebar-project-id")
+      || "";
+    const workspacePath = workspaceFromLocation();
+    const payload = {
+      theme: currentTheme(),
+      projects,
+      user: readCodexUser() ?? undefined,
+      visibleThreadIds: readVisibleThreadIds(projectList),
+      titlebarLeftInset: titlebarLeftInset(),
+      sidebarCollapsed: nativeSidebarCollapsed(),
+    };
+    if (workspacePath) payload.workspacePath = workspacePath;
+    if (projectId) payload.projectId = projectId;
+    if (threadId) payload.threadId = threadId;
+    return payload;
+  }
+
+  function postToFrame(message) {
+    if (!frame?.contentWindow || !frameOrigin) return;
+    frame.contentWindow.postMessage(message, frameOrigin);
+  }
+
+  function dispatchHostMessage(message) {
+    window.postMessage(message, window.location.origin);
+  }
+
+  function postHostContext() {
+    if (!frame) return;
+    const liveContext = readHostContext();
+    const payload = hostContextSnapshot
+      ? {
+          ...hostContextSnapshot,
+          ...liveContext,
+          projects: liveContext.projects.length > 0
+            ? liveContext.projects
+            : hostContextSnapshot.projects,
+        }
+      : liveContext;
+    postToFrame({ type: "taskboard:host-context", payload });
+    postToFrame({ type: "taskboard:theme", theme: payload.theme });
+  }
+
+  function threadRowTitle(row) {
+    return typeof row?.getAttribute === "function"
+      ? row.getAttribute("data-app-action-sidebar-thread-title") || ""
+      : "";
+  }
+
+  function findThreadRow(threadId, threadTitle = "") {
+    const normalizedThreadId = normalizeThreadId(threadId);
+    const rows = Array.from(document.querySelectorAll("[data-app-action-sidebar-thread-id]"));
+    if (normalizedThreadId) {
+      const exact = rows.find((row) => normalizeThreadId(row.getAttribute("data-app-action-sidebar-thread-id")) === normalizedThreadId);
+      if (exact) return exact;
+    }
+    const normalizedThreadTitle = normalizedLabel(threadTitle);
+    if (!normalizedThreadTitle) return null;
+    return rows.find((row) => normalizedLabel(threadRowTitle(row)) === normalizedThreadTitle) || null;
+  }
+
+  function routeForThread(threadId) {
+    return `/local/${encodeURIComponent(threadId)}`;
+  }
+
+  function deepLinkForThread(threadId) {
+    const normalizedThreadId = normalizeThreadId(threadId);
+    return normalizedThreadId ? `codex://threads/${encodeURIComponent(normalizedThreadId)}` : "";
+  }
+
+  function openThreadDeepLink(threadId) {
+    const deepLink = deepLinkForThread(threadId);
+    if (deepLink) window.location.assign(deepLink);
+  }
+
+  function normalizeWorkspacePath(value) {
+    return typeof value === "string" ? value.trim() : "";
+  }
+
+  async function setActiveWorkspaceRoot(workspacePath) {
+    const root = normalizeWorkspacePath(workspacePath);
+    if (!root) return false;
+    const bridge = window.electronBridge;
+    if (!bridge || typeof bridge.sendMessageFromView !== "function") return false;
+    await bridge.sendMessageFromView({
+      type: "electron-set-active-workspace-root",
+      root,
+    });
+    return true;
+  }
+
+  function nativeThreadIsActive(threadId, threadTitle = "") {
+    const normalizedThreadId = normalizeThreadId(threadId);
+    if (!normalizedThreadId) return false;
+    const normalizedThreadTitle = normalizedLabel(threadTitle);
+    const activeThreadId = normalizeThreadId(
+      activeThreadRow()?.getAttribute("data-app-action-sidebar-thread-id"),
+    );
+    return activeThreadId === normalizedThreadId
+      || normalizeThreadId(threadIdFromLocation()) === normalizedThreadId
+      || (
+        normalizedThreadTitle
+        && normalizedLabel(threadRowTitle(activeThreadRow())) === normalizedThreadTitle
+      );
+  }
+
+  async function waitForNativeThread(threadId, threadTitle = "", timeoutMs = 1_500) {
+    const deadline = Date.now() + timeoutMs;
+    do {
+      if (nativeThreadIsActive(threadId, threadTitle)) return true;
+      await new Promise((resolve) => window.setTimeout(resolve, 80));
+    } while (Date.now() < deadline);
+    return nativeThreadIsActive(threadId, threadTitle);
+  }
+
+  async function waitForThreadRow(threadId, threadTitle = "", timeoutMs = 800) {
+    const deadline = Date.now() + timeoutMs;
+    do {
+      const row = findThreadRow(threadId, threadTitle);
+      if (row?.isConnected) return row;
+      await new Promise((resolve) => window.setTimeout(resolve, 80));
+    } while (Date.now() < deadline);
+    return findThreadRow(threadId, threadTitle);
+  }
+
+  async function navigateNativeThread(
+    threadId,
+    { closeCurrentTaskboard, workspacePath, threadTitle } = { closeCurrentTaskboard: false, workspacePath: "", threadTitle: "" },
+  ) {
+    if (typeof threadId !== "string" || !threadId.trim()) return false;
+    const normalizedThreadId = normalizeThreadId(threadId);
+    lastNativeThreadId = normalizedThreadId;
+    const normalizedWorkspacePath = normalizeWorkspacePath(workspacePath);
+    const normalizedThreadTitle = normalizedLabel(threadTitle);
+    if (normalizedWorkspacePath) {
+      try {
+        await setActiveWorkspaceRoot(normalizedWorkspacePath);
+      } catch (_) {}
+    }
+    const row = normalizedWorkspacePath
+      ? await waitForThreadRow(normalizedThreadId, normalizedThreadTitle)
+      : findThreadRow(normalizedThreadId, normalizedThreadTitle);
+    if (closeCurrentTaskboard) closeTaskboard(false);
+
+    if (row?.isConnected) {
+      if (!closeCurrentTaskboard) suppressNativeCloseUntil = Date.now() + 1_000;
+      row.click?.();
+      return true;
+    }
+
+    try {
+      if (!closeCurrentTaskboard) suppressNativeCloseUntil = Date.now() + 1_000;
+      await dispatchHostMessage({
+        type: "navigate-to-route",
+        path: routeForThread(normalizedThreadId),
+      });
+    } catch (_) {
+      return false;
+    }
+    return waitForNativeThread(normalizedThreadId, normalizedThreadTitle);
+  }
+
+  async function openThread(threadId, workspacePath = "", threadTitle = "") {
+    const targetWorkspacePath = normalizeWorkspacePath(workspacePath) || nativeThreadPanelWorkspacePath;
+    const targetThreadTitle = normalizedLabel(threadTitle) || nativeThreadPanelThreadTitle;
+    const opened = await navigateNativeThread(threadId, {
+      closeCurrentTaskboard: true,
+      workspacePath: targetWorkspacePath,
+      threadTitle: targetThreadTitle,
+    });
+    if (!opened) openThreadDeepLink(threadId);
+  }
+
+  function restoreNativeThreadHost() {
+    nativeThreadPanelResizeObserver?.disconnect?.();
+    nativeThreadPanelResizeObserver = null;
+    if (!nativeThreadPanelHost) return;
+    nativeThreadPanelHost.style.cssText = nativeThreadPanelHostStyle;
+    nativeThreadPanelHost.removeAttribute(NATIVE_THREAD_HOST_ATTRIBUTE);
+    nativeThreadPanelHost = null;
+    nativeThreadPanelHostStyle = "";
+  }
+
+  function clearNativeThreadFallback() {
+    if (nativeThreadPanel) nativeThreadPanel.dataset.nativeHost = "true";
+    nativeThreadPanelBody?.replaceChildren();
+  }
+
+  function showNativeThreadFallback(threadId) {
+    if (!nativeThreadPanel || !nativeThreadPanelBody) return;
+    nativeThreadPanel.dataset.nativeHost = "false";
+    nativeThreadPanelBody.replaceChildren();
+
+    const fallback = document.createElement("div");
+    fallback.className = "codex-taskboard-native-thread-fallback";
+
+    const message = document.createElement("p");
+    message.textContent = "当前 Codex 侧栏没有加载这个原对话，已停止挂载当前新对话页面。请完整打开后继续。";
+
+    const action = document.createElement("button");
+    action.type = "button";
+    action.textContent = "完整打开";
+    action.addEventListener("click", () => void openThread(threadId, "", nativeThreadPanelThreadTitle));
+
+    fallback.append(message, action);
+    nativeThreadPanelBody.append(fallback);
+  }
+
+  function mountNativeThreadPanel() {
+    const mount = findPageMount();
+    if (!mount || !nativeThreadPanel) return null;
+    if (nativeThreadPanel.parentElement !== mount.surface) {
+      mount.surface.appendChild(nativeThreadPanel);
+    }
+    return mount;
+  }
+
+  function syncNativeThreadPanelLayout() {
+    if (
+      !active
+      || !nativeThreadPanel
+      || nativeThreadPanel.hidden
+      || !nativeThreadPanelBody
+      || !nativeThreadPanelHost
+      || !nativeThreadPanelHost.isConnected
+    ) return;
+    const surface = nativeThreadPanel.parentElement;
+    if (!surface) return;
+    const surfaceRect = surface.getBoundingClientRect();
+    const bodyRect = nativeThreadPanelBody.getBoundingClientRect();
+    if (bodyRect.width <= 0 || bodyRect.height <= 0) return;
+    Object.assign(nativeThreadPanelHost.style, {
+      position: "absolute",
+      left: `${Math.max(0, bodyRect.left - surfaceRect.left)}px`,
+      top: `${Math.max(0, bodyRect.top - surfaceRect.top)}px`,
+      width: `${bodyRect.width}px`,
+      height: `${bodyRect.height}px`,
+      zIndex: "7",
+      boxSizing: "border-box",
+    });
+    nativeThreadPanelHost.removeAttribute(HIDDEN_ATTRIBUTE);
+    nativeThreadPanelHost.setAttribute(NATIVE_THREAD_HOST_ATTRIBUTE, "true");
+  }
+
+  function scheduleNativeThreadPanelAttach() {
+    for (const delay of [80, 220, 500, 1_000]) {
+      window.setTimeout(() => {
+        if (nativeThreadPanelThreadId && nativeThreadPanelCanAttach) attachNativeThreadHost();
+      }, delay);
+    }
+  }
+
+  function attachNativeThreadHost() {
+    if (!nativeThreadPanelCanAttach) return false;
+    const mount = mountNativeThreadPanel();
+    if (!mount || !nativeThreadPanel || nativeThreadPanel.hidden) return false;
+    if (nativeThreadPanelHost !== mount.frameHost) {
+      restoreNativeThreadHost();
+      nativeThreadPanelHost = mount.frameHost;
+      nativeThreadPanelHostStyle = nativeThreadPanelHost.getAttribute("style") || "";
+      if (typeof ResizeObserver === "function") {
+        nativeThreadPanelResizeObserver = new ResizeObserver(syncNativeThreadPanelLayout);
+        nativeThreadPanelResizeObserver.observe(nativeThreadPanel);
+      }
+    }
+    clearNativeThreadFallback();
+    syncNativeThreadPanelLayout();
+    return true;
+  }
+
+  function closeNativeThreadPanel({ remountTaskboard = true } = {}) {
+    nativeThreadPanelThreadId = "";
+    nativeThreadPanelWorkspacePath = "";
+    nativeThreadPanelThreadTitle = "";
+    nativeThreadPanelCanAttach = false;
+    if (nativeThreadPanel) nativeThreadPanel.hidden = true;
+    nativeThreadPanelBody?.replaceChildren();
+    restoreNativeThreadHost();
+    if (remountTaskboard && active) mountActivePage();
+  }
+
+  function updateNativeThreadPanelTitle(title, threadId) {
+    if (!nativeThreadPanel) return;
+    const titleNode = nativeThreadPanel.querySelector(".codex-taskboard-native-thread-title");
+    const idNode = nativeThreadPanel.querySelector(".codex-taskboard-native-thread-id");
+    if (titleNode) {
+      titleNode.textContent = "继续对话";
+      titleNode.title = title || normalizeThreadId(threadId) || "继续对话";
+    }
+    if (idNode) idNode.textContent = normalizeThreadId(threadId);
+  }
+
+  function toggleNativeThreadPanelSize() {
+    nativeThreadPanelSize = nativeThreadPanelSize === "maximized" ? "compact" : "maximized";
+    if (nativeThreadPanel) {
+      nativeThreadPanel.dataset.size = nativeThreadPanelSize;
+      const button = nativeThreadPanel.querySelector("[data-codex-taskboard-native-thread-size]");
+      if (button) {
+        setIconButton(button, nativeThreadPanelSize === "maximized" ? "chevronDown" : "expand");
+        button.setAttribute("aria-label", nativeThreadPanelSize === "maximized" ? "缩小对话浮窗" : "放大对话浮窗");
+      }
+    }
+    requestAnimationFrame(syncNativeThreadPanelLayout);
+  }
+
+  function createNativeThreadPanel() {
+    const panel = document.createElement("section");
+    panel.id = NATIVE_THREAD_PANEL_ID;
+    panel.hidden = true;
+    panel.dataset.size = nativeThreadPanelSize;
+    panel.dataset.nativeHost = "true";
+    panel.setAttribute(OWNED_ATTRIBUTE, "true");
+    panel.setAttribute("role", "dialog");
+    panel.setAttribute("aria-label", "继续 Codex 对话");
+
+    const header = document.createElement("div");
+    header.className = "codex-taskboard-native-thread-header";
+
+    const title = document.createElement("div");
+    title.className = "codex-taskboard-native-thread-title";
+    title.textContent = "继续对话";
+
+    const id = document.createElement("span");
+    id.className = "codex-taskboard-native-thread-id";
+
+    const full = document.createElement("button");
+    full.type = "button";
+    setIconButton(full, "openExternal");
+    full.title = "跳转到完整 Codex 对话";
+    full.setAttribute("aria-label", "完整打开 Codex 对话");
+    full.addEventListener("click", () => {
+      const threadId = nativeThreadPanelThreadId;
+      if (threadId) void openThread(threadId);
+    });
+
+    const size = document.createElement("button");
+    size.type = "button";
+    size.dataset.codexTaskboardNativeThreadSize = "true";
+    setIconButton(size, nativeThreadPanelSize === "maximized" ? "chevronDown" : "expand");
+    size.title = "放大或缩小浮窗";
+    size.setAttribute("aria-label", nativeThreadPanelSize === "maximized" ? "缩小对话浮窗" : "放大对话浮窗");
+    size.addEventListener("click", toggleNativeThreadPanelSize);
+
+    const close = document.createElement("button");
+    close.type = "button";
+    setIconButton(close, "close");
+    close.title = "关闭对话浮窗";
+    close.setAttribute("aria-label", "关闭对话浮窗");
+    close.addEventListener("click", () => closeNativeThreadPanel());
+
+    header.append(title, id, full, size, close);
+
+    const body = document.createElement("div");
+    body.id = NATIVE_THREAD_PANEL_BODY_ID;
+    panel.append(header, body);
+    nativeThreadPanel = panel;
+    nativeThreadPanelBody = body;
+    return panel;
+  }
+
+  async function showNativeThreadPanel(payload) {
+    const threadId = normalizeThreadId(payload?.threadId);
+    if (!threadId) return;
+    const title = typeof payload?.title === "string" ? payload.title.trim() : "";
+    const workspacePath = normalizeWorkspacePath(payload?.workspacePath);
+    const threadTitle = typeof payload?.threadTitle === "string" ? payload.threadTitle.trim() : "";
+    const inferredThreadTitle = title.replace(/^[A-Z][A-Z0-9_-]*-\d+\s+/, "").trim();
+    nativeThreadPanelThreadId = threadId;
+    nativeThreadPanelWorkspacePath = workspacePath;
+    nativeThreadPanelThreadTitle = threadTitle || inferredThreadTitle;
+    nativeThreadPanelCanAttach = false;
+    if (!active) openTaskboard();
+    if (!nativeThreadPanel) createNativeThreadPanel();
+    nativeThreadPanel.hidden = false;
+    nativeThreadPanel.dataset.size = nativeThreadPanelSize;
+    nativeThreadPanel.dataset.nativeHost = "true";
+    updateNativeThreadPanelTitle(title, threadId);
+    clearNativeThreadFallback();
+    mountActivePage();
+    mountNativeThreadPanel();
+    const opened = await navigateNativeThread(threadId, {
+      closeCurrentTaskboard: false,
+      workspacePath,
+      threadTitle: threadTitle || title,
+    });
+    if (!opened) {
+      restoreNativeThreadHost();
+      nativeThreadPanelCanAttach = false;
+      showNativeThreadFallback(threadId);
+      return;
+    }
+    nativeThreadPanelCanAttach = true;
+    attachNativeThreadHost();
+    scheduleNativeThreadPanelAttach();
+  }
+
+  function projectRowById(projectId) {
+    if (typeof projectId !== "string" || !projectId.trim()) return null;
+    return Array.from(document.querySelectorAll("[data-app-action-sidebar-project-row]"))
+      .find((row) => row.getAttribute("data-app-action-sidebar-project-id") === projectId.trim()) || null;
+  }
+
+  function projectRowByLabel(label) {
+    if (typeof label !== "string" || !label.trim()) return null;
+    const expected = normalizedLabel(label);
+    return Array.from(document.querySelectorAll("[data-app-action-sidebar-project-row]"))
+      .find((row) => normalizedLabel(row.getAttribute("data-app-action-sidebar-project-label")) === expected) || null;
+  }
+
+  async function ensureProjectRows() {
+    let section = findProjectsSection();
+    const deadline = Date.now() + 1_200;
+    while (!section && Date.now() < deadline) {
+      await new Promise((resolve) => window.setTimeout(resolve, 40));
+      section = findProjectsSection();
+    }
+    if (section?.getAttribute("data-app-action-sidebar-section-collapsed") === "true") {
+      section.querySelector("[data-app-action-sidebar-section-toggle]")?.click();
+    }
+    while (readCodexProjects().length === 0 && Date.now() < deadline) {
+      await new Promise((resolve) => window.setTimeout(resolve, 40));
+    }
+  }
+
+  async function waitForPreparedComposer(identifier, skillPath) {
+    const deadline = Date.now() + 8_000;
+    while (Date.now() < deadline) {
+      const editor = document.querySelector('[data-codex-composer="true"][contenteditable="true"]');
+      if (editor && editor.getClientRects().length > 0) {
+        const containsIdentifier = normalizedLabel(editor.textContent).includes(normalizedLabel(identifier));
+        const skillMention = Array.from(editor.querySelectorAll("[skill-mention-name]"))
+          .find((mention) => (
+            mention.getAttribute("skill-mention-name") === "manage-taskboard"
+            && mention.getAttribute("skill-mention-path") === skillPath
+          ));
+        if (containsIdentifier && skillMention) return editor;
+      }
+      await new Promise((resolve) => window.setTimeout(resolve, 80));
+    }
+    throw new Error("Codex 对话输入框没有生成 manage-taskboard Skill 引用");
+  }
+
+  async function createThreadForTask(payload) {
+    const taskId = typeof payload?.taskId === "string" ? payload.taskId.trim() : "";
+    const identifier = typeof payload?.identifier === "string" ? payload.identifier.trim() : "";
+    const instruction = typeof payload?.instruction === "string" ? payload.instruction.trim() : "";
+    const skillName = typeof payload?.skillName === "string" ? payload.skillName.trim() : "";
+    const skillDisplayName = typeof payload?.skillDisplayName === "string"
+      ? payload.skillDisplayName.trim()
+      : "";
+    const skillPath = typeof payload?.skillPath === "string" ? payload.skillPath.trim() : "";
+    const workspacePath = typeof payload?.workspacePath === "string"
+      ? payload.workspacePath.trim()
+      : "";
+    if (
+      !taskId
+      || !identifier
+      || !instruction
+      || !skillName
+      || !skillDisplayName
+      || !skillPath
+      || pendingThreadCreation
+    ) return;
+    pendingThreadCreation = taskId;
+    try {
+      const bridge = window.electronBridge;
+      if (!bridge || typeof bridge.sendMessageFromView !== "function") {
+        throw new Error("当前 Codex 版本没有提供原生对话导航能力");
+      }
+
+      if (workspacePath) {
+        await bridge.sendMessageFromView({
+          type: "electron-set-active-workspace-root",
+          root: workspacePath,
+        });
+      } else {
+        await ensureProjectRows();
+        const snapshotProjectId = hostContextSnapshot?.projectId || "";
+        const requestedProjectId = typeof payload.codexProjectId === "string"
+          ? payload.codexProjectId.trim()
+          : "";
+        const row = projectRowByLabel(payload.workspaceLabel)
+          || projectRowById(requestedProjectId)
+          || projectRowById(snapshotProjectId)
+          || projectRowByLabel(payload.projectName);
+        if (row?.getAttribute("data-app-action-sidebar-project-collapsed") === "true") {
+          row.click?.();
+          await new Promise((resolve) => window.setTimeout(resolve, 120));
+        }
+        const selectProject = row?.querySelector("[data-app-action-sidebar-select-project]");
+        selectProject?.click?.();
+        if (selectProject) await new Promise((resolve) => window.setTimeout(resolve, 120));
+      }
+
+      closeTaskboard(false);
+      await dispatchHostMessage({
+        type: "navigate-to-route",
+        path: "/",
+        state: {
+          focusComposerNonce: Date.now(),
+        },
+      });
+      await requestHostTaskComposerPrefill({
+        instruction,
+        skillDisplayName,
+        skillName,
+        skillPath,
+      });
+      await waitForPreparedComposer(identifier, skillPath);
+      postToFrame({ type: "taskboard:thread-prepared", payload: { taskId } });
+    } catch (error) {
+      postToFrame({
+        type: "taskboard:thread-create-error",
+        payload: { taskId, error: error instanceof Error ? error.message : "无法创建 Codex 对话" },
+      });
+    } finally {
+      pendingThreadCreation = null;
+    }
+  }
+
+  function buildAutomationHostPayload(payload) {
+    return {
+      requestId: payload.requestId,
+      operation: payload.operation,
+      taskboardProjectId: payload.taskboardProjectId,
+      codexProjectId: payload.codexProjectId,
+      projectName: payload.projectName,
+      workspacePath: payload.workspacePath,
+      skillPath: payload.skillPath,
+      ...(payload.automationId === undefined ? {} : { automationId: payload.automationId }),
+      enabledByUser: payload.enabledByUser,
+      quotaAware: payload.quotaAware,
+      intervalMinutes: payload.intervalMinutes,
+      model: payload.model,
+      reasoningEffort: payload.reasoningEffort,
+    };
+  }
+
+  async function handleAutomationRequest(payload) {
+    const requestId = typeof payload?.requestId === "string" ? payload.requestId : "";
+    if (!requestId) return;
+    if (!isLocalTaskboardOrigin(frameOrigin)) {
+      postToFrame({
+        type: "taskboard:automation-response",
+        payload: { requestId, ok: false, error: "仅本地任务面板可用" },
+      });
+      return;
+    }
+    try {
+      const response = await requestHost(
+        "automation",
+        buildAutomationHostPayload(payload),
+      );
+      postToFrame({
+        type: "taskboard:automation-response",
+        payload: response.error
+          ? { requestId, ok: false, error: response.error }
+          : {
+              requestId,
+              ok: true,
+              item: response.item,
+              items: response.items,
+              quota: response.quota,
+              policy: response.policy,
+            },
+      });
+    } catch (error) {
+      postToFrame({
+        type: "taskboard:automation-response",
+        payload: {
+          requestId,
+          ok: false,
+          error: error instanceof Error ? error.message : "Codex 自动任务操作失败",
+        },
+      });
+    }
+  }
+
+  function onFrameMessage(event) {
+    if (!frame || event.source !== frame.contentWindow || event.origin !== frameOrigin) return;
+    const message = event.data;
+    if (!message || typeof message !== "object") return;
+    if (message.type === "taskboard:ready") {
+      frameReady = true;
+      frameReadyWaiters.forEach(({ resolve, timer }) => {
+        window.clearTimeout(timer);
+        resolve();
+      });
+      frameReadyWaiters.clear();
+      if (active) showFrame();
+      postHostContext();
+      return;
+    }
+    if (message.type === "taskboard:drag-region") {
+      updateDragRegion(message.payload);
+      return;
+    }
+    if (message.type === "taskboard:open-thread") {
+      void openThread(message.payload?.threadId, message.payload?.workspacePath, message.payload?.threadTitle);
+      return;
+    }
+    if (message.type === "taskboard:show-thread-panel") {
+      void showNativeThreadPanel(message.payload);
+      return;
+    }
+    if (message.type === "taskboard:expand-sidebar") {
+      expandNativeSidebar();
+      return;
+    }
+    if (message.type === "taskboard:automation-request") {
+      void handleAutomationRequest(message.payload);
+      return;
+    }
+    if (message.type === "taskboard:create-thread") void createThreadForTask(message.payload);
+  }
+
+  function updateDragRegion(payload) {
+    if (!dragRegion || !noDragLeft || !noDragRight) return;
+    const [x, y, width, height] = [payload?.x, payload?.y, payload?.width, payload?.height];
+    if (![x, y, width, height].every((value) => Number.isFinite(value)) || width <= 0 || height <= 0) {
+      dragRegion.hidden = true;
+      noDragLeft.hidden = true;
+      noDragRight.hidden = true;
+      return;
+    }
+    const left = Math.max(0, x);
+    const right = left + width;
+    dragRegion.style.left = `${left}px`;
+    dragRegion.style.top = `${Math.max(0, y)}px`;
+    dragRegion.style.width = `${width}px`;
+    dragRegion.style.height = `${height}px`;
+    noDragLeft.style.left = "0";
+    noDragLeft.style.top = `${Math.max(0, y)}px`;
+    noDragLeft.style.width = `${left}px`;
+    noDragLeft.style.height = `${height}px`;
+    noDragRight.style.left = `${right}px`;
+    noDragRight.style.top = `${Math.max(0, y)}px`;
+    noDragRight.style.right = "0";
+    noDragRight.style.height = `${height}px`;
+    dragRegion.hidden = false;
+    noDragLeft.hidden = left <= 0;
+    noDragRight.hidden = right >= page.clientWidth;
+  }
+
+  function createPage() {
+    const section = document.createElement("section");
+    section.id = PAGE_ID;
+    section.hidden = true;
+    section.setAttribute(OWNED_ATTRIBUTE, "true");
+    section.setAttribute("role", "region");
+    section.setAttribute("aria-label", "任务面板");
+
+    status = document.createElement("div");
+    status.id = STATUS_ID;
+    status.setAttribute("role", "status");
+    status.setAttribute("aria-live", "polite");
+    section.appendChild(status);
+
+    dragRegion = document.createElement("div");
+    dragRegion.id = DRAG_REGION_ID;
+    dragRegion.hidden = true;
+    dragRegion.setAttribute(OWNED_ATTRIBUTE, "true");
+    dragRegion.setAttribute("aria-hidden", "true");
+    section.appendChild(dragRegion);
+
+    noDragLeft = document.createElement("div");
+    noDragLeft.id = NO_DRAG_LEFT_ID;
+    noDragLeft.hidden = true;
+    noDragLeft.setAttribute(OWNED_ATTRIBUTE, "true");
+    noDragLeft.setAttribute("aria-hidden", "true");
+    section.appendChild(noDragLeft);
+
+    noDragRight = document.createElement("div");
+    noDragRight.id = NO_DRAG_RIGHT_ID;
+    noDragRight.hidden = true;
+    noDragRight.setAttribute(OWNED_ATTRIBUTE, "true");
+    noDragRight.setAttribute("aria-hidden", "true");
+    section.appendChild(noDragRight);
+    return section;
+  }
+
+  function showLoading() {
+    if (!status) return;
+    status.replaceChildren(document.createTextNode("正在启动任务面板…"));
+    status.hidden = false;
+    if (frame) frame.hidden = true;
+  }
+
+  function showFrame() {
+    if (status) status.hidden = true;
+    if (frame) {
+      frame.hidden = false;
+      frame.focus?.();
+    }
+  }
+
+  function showLoadError(message) {
+    if (!status) return;
+    const content = document.createElement("div");
+    const text = document.createElement("div");
+    text.textContent = message;
+    const retry = document.createElement("button");
+    retry.type = "button";
+    retry.textContent = "重新启动";
+    retry.addEventListener("click", openTaskboard, { once: true });
+    content.append(text, retry);
+    status.replaceChildren(content);
+    status.hidden = false;
+    if (frame) frame.hidden = true;
+  }
+
+  function cancelFrameReadyWaiters(error) {
+    frameReadyWaiters.forEach(({ reject, timer }) => {
+      window.clearTimeout(timer);
+      reject(error);
+    });
+    frameReadyWaiters.clear();
+  }
+
+  function waitForFrameReady() {
+    if (frameReady) return Promise.resolve();
+    return new Promise((resolve, reject) => {
+      const waiter = {
+        resolve,
+        reject,
+        timer: window.setTimeout(() => {
+          frameReadyWaiters.delete(waiter);
+          reject(new Error("任务面板页面加载超时"));
+        }, FRAME_READY_TIMEOUT_MS),
+      };
+      frameReadyWaiters.add(waiter);
+    });
+  }
+
+  function loadTaskboardFrame(cacheBust = false) {
+    cancelFrameReadyWaiters(new Error("任务面板正在重新加载"));
+    frame?.remove();
+    frame = null;
+    frameReady = false;
+    if (dragRegion) dragRegion.hidden = true;
+    if (noDragLeft) noDragLeft.hidden = true;
+    if (noDragRight) noDragRight.hidden = true;
+
+    const taskboardUrl = resolveTaskboardUrl();
+    if (cacheBust) {
+      taskboardUrl.searchParams.set(FRAME_REFRESH_PARAM, Date.now().toString(36));
+    }
+    frameOrigin = taskboardUrl.origin;
+    const nextFrame = document.createElement("iframe");
+    nextFrame.id = FRAME_ID;
+    nextFrame.hidden = true;
+    nextFrame.src = taskboardUrl.href;
+    nextFrame.title = "任务面板";
+    nextFrame.referrerPolicy = "no-referrer";
+    nextFrame.setAttribute("allow", "clipboard-read; clipboard-write");
+    nextFrame.addEventListener("load", postHostContext);
+    frame = nextFrame;
+    page.appendChild(nextFrame);
+  }
+
+  function reloadFrame() {
+    if (!frame) return false;
+    const generation = ++openGeneration;
+    if (active) showLoading();
+    loadTaskboardFrame(true);
+    if (active) {
+      void waitForFrameReady()
+        .then(() => {
+          if (!active || generation !== openGeneration) return;
+          showFrame();
+          postHostContext();
+        })
+        .catch((error) => {
+          if (!active || generation !== openGeneration) return;
+          showLoadError(error.message);
+        });
+    }
+    return true;
+  }
+
+  function managedTaskboardOrigin() {
+    const configured = typeof window.__CODEX_TASKBOARD_MANAGED_ORIGIN__ === "string"
+      ? window.__CODEX_TASKBOARD_MANAGED_ORIGIN__.trim()
+      : "";
+    try {
+      return new URL(configured || DEFAULT_TASKBOARD_URL).origin;
+    } catch (_) {
+      return new URL(DEFAULT_TASKBOARD_URL).origin;
+    }
+  }
+
+  function hasLiveHostBinding() {
+    const heartbeat = Number(window[HOST_HEARTBEAT_NAME]);
+    return typeof window[HOST_BINDING_NAME] === "function"
+      && Number.isFinite(heartbeat)
+      && Date.now() - heartbeat <= HOST_HEARTBEAT_MAX_AGE_MS;
+  }
+
+  function requestHost(action, payload = {}) {
+    const binding = window[HOST_BINDING_NAME];
+    if (!hasLiveHostBinding()) {
+      return Promise.reject(new Error("Taskboard 启动器未运行，无法操作 Codex 对话输入框"));
+    }
+
+    const id = `${Date.now().toString(36)}-${(++hostRequestSequence).toString(36)}`;
+    return new Promise((resolve, reject) => {
+      const timeout = window.setTimeout(() => {
+        hostRequests.delete(id);
+        reject(new Error("任务面板启动器没有响应"));
+      }, HOST_REQUEST_TIMEOUT_MS);
+      hostRequests.set(id, { resolve, reject, timeout });
+      try {
+        binding(JSON.stringify({ ...payload, id, action }));
+      } catch (error) {
+        window.clearTimeout(timeout);
+        hostRequests.delete(id);
+        reject(error);
+      }
+    });
+  }
+
+  function requestHostEnsure(taskboardUrl) {
+    if (taskboardUrl.origin !== managedTaskboardOrigin() || !hasLiveHostBinding()) {
+      return Promise.resolve({ managed: false, restarted: false });
+    }
+    return requestHost("ensure");
+  }
+
+  function requestHostTaskComposerPrefill({
+    instruction,
+    skillDisplayName,
+    skillName,
+    skillPath,
+  }) {
+    return requestHost("prefill-task-composer", {
+      instruction,
+      skillDisplayName,
+      skillName,
+      skillPath,
+    });
+  }
+
+  function frameMatchesTaskboardUrl(taskboardUrl) {
+    if (!frame) return false;
+    try {
+      const loadedUrl = new URL(frame.getAttribute("src") || frame.src);
+      loadedUrl.searchParams.delete(FRAME_REFRESH_PARAM);
+      const expectedUrl = new URL(taskboardUrl.href);
+      expectedUrl.searchParams.delete(FRAME_REFRESH_PARAM);
+      return loadedUrl.href === expectedUrl.href;
+    } catch (_) {
+      return false;
+    }
+  }
+
+  function onHostResponse(response) {
+    if (!response || typeof response !== "object" || typeof response.id !== "string") return;
+    const pending = hostRequests.get(response.id);
+    if (!pending) return;
+    window.clearTimeout(pending.timeout);
+    hostRequests.delete(response.id);
+    if (response.ok) pending.resolve(response);
+    else pending.reject(new Error(response.error || "任务面板服务启动失败"));
+  }
+
+  async function prepareTaskboard(generation) {
+    const taskboardUrl = resolveTaskboardUrl();
+    const canReuseFrame = Boolean(
+      frameReady
+      && frame?.isConnected
+      && frameMatchesTaskboardUrl(taskboardUrl),
+    );
+    if (canReuseFrame) showFrame();
+    else showLoading();
+
+    try {
+      const [result, context] = await Promise.all([
+        requestHostEnsure(taskboardUrl),
+        captureHostContext(),
+      ]);
+      if (!active || generation !== openGeneration) return;
+      hostContextSnapshot = context;
+      if (!frameReady || result.restarted || !frameMatchesTaskboardUrl(taskboardUrl)) {
+        showLoading();
+        loadTaskboardFrame();
+        await waitForFrameReady();
+      }
+      if (!active || generation !== openGeneration) return;
+      showFrame();
+      postHostContext();
+    } catch (error) {
+      if (!active || generation !== openGeneration) return;
+      const bindingAvailable = hasLiveHostBinding();
+      showLoadError(bindingAvailable
+        ? error.message
+        : "任务面板服务未就绪。请保持 Taskboard 启动器运行后重试。");
+    }
+  }
+
+  function restoreNativeContent() {
+    document.querySelectorAll(`[${HIDDEN_ATTRIBUTE}="true"]`)
+      .forEach((node) => node.removeAttribute(HIDDEN_ATTRIBUTE));
+    document.querySelectorAll(`[${HOST_ATTRIBUTE}="true"]`)
+      .forEach((node) => node.removeAttribute(HOST_ATTRIBUTE));
+  }
+
+  function mountActivePage() {
+    if (!active) return;
+    if (!page) page = createPage();
+    const mount = findPageMount();
+    if (!mount) return;
+    const { surface } = mount;
+
+    if (page.parentElement !== surface) {
+      restoreNativeContent();
+      surface.appendChild(page);
+    }
+    surface.setAttribute(HOST_ATTRIBUTE, "true");
+    Array.from(surface.children).forEach((child) => {
+      if (child === nativeThreadPanelHost) {
+        child.removeAttribute(HIDDEN_ATTRIBUTE);
+        child.setAttribute(NATIVE_THREAD_HOST_ATTRIBUTE, "true");
+        return;
+      }
+      if (child !== page && child.getAttribute(OWNED_ATTRIBUTE) !== "true") {
+        child.setAttribute(HIDDEN_ATTRIBUTE, "true");
+      }
+    });
+    hideNativeHeader();
+    muteNativeSelection();
+    page.hidden = false;
+    syncNativeThreadPanelLayout();
+    document.documentElement.setAttribute("data-codex-taskboard-open", "true");
+  }
+
+  function closeTaskboard(restoreFocus = true) {
+    if (!active && page?.hidden !== false) return;
+    openGeneration += 1;
+    active = false;
+    closeNativeThreadPanel({ remountTaskboard: false });
+    if (page) page.hidden = true;
+    restoreNativeContent();
+    restoreNativeSelection();
+    document.documentElement.removeAttribute("data-codex-taskboard-open");
+    syncEntryState();
+    if (restoreFocus) lastFocusedElement?.focus?.();
+    lastFocusedElement = null;
+    hostContextSnapshot = null;
+  }
+
+  function openTaskboard() {
+    if (destroyed) return;
+    if (!active) {
+      lastFocusedElement = document.activeElement;
+      hostContextSnapshot = null;
+    }
+    const generation = ++openGeneration;
+    active = true;
+    ensureEntry();
+    mountActivePage();
+    syncEntryState();
+    void prepareTaskboard(generation);
+  }
+
+  function isNativePageNavigation(target) {
+    const clickable = target?.closest?.("button,a,[role='button'],[data-app-action-sidebar-thread-id]");
+    if (!clickable || clickable === entry || clickable.closest(`#${ENTRY_ID}`)) return false;
+    if (!clickable.closest("aside nav[role='navigation']")) return false;
+    if (clickable.hasAttribute("data-app-action-sidebar-section-toggle")) return false;
+    if (buttonMatches(clickable, NATIVE_PAGE_LABELS)) return true;
+    return Boolean(clickable.closest(
+      "[data-app-action-sidebar-thread-id],"
+      + "[data-app-action-sidebar-project-row],"
+      + "[data-app-action-sidebar-project-id]",
+    ));
+  }
+
+  function onDocumentClick(event) {
+    const threadRow = event.target?.closest?.("[data-app-action-sidebar-thread-id]");
+    const clickedThreadId = normalizeThreadId(threadRow?.getAttribute?.("data-app-action-sidebar-thread-id"));
+    if (clickedThreadId) lastNativeThreadId = clickedThreadId;
+    if (clickedThreadId && clickedThreadId === normalizeThreadId(nativeThreadPanelThreadId)) return;
+    if (Date.now() < suppressNativeCloseUntil) return;
+    if (!active || !isNativePageNavigation(event.target)) return;
+    closeTaskboard(false);
+  }
+
+  function scheduleRefresh() {
+    if (destroyed || reattachTimer !== null) return;
+    reattachTimer = window.setTimeout(() => {
+      reattachTimer = null;
+      ensureEntry();
+      mountActivePage();
+      postHostContext();
+    }, REATTACH_DELAY_MS);
+  }
+
+  function refresh() {
+    ensureEntry();
+    mountActivePage();
+    postHostContext();
+  }
+
+  function mount() {
+    document.removeEventListener("DOMContentLoaded", mount);
+    if (destroyed || observer || !document.documentElement) return;
+    ensureEntry();
+    observer = new MutationObserver(scheduleRefresh);
+    observer.observe(document.documentElement, {
+      childList: true,
+      subtree: true,
+      attributes: true,
+      attributeFilter: [
+        "class",
+        "data-theme",
+        "data-color-theme",
+        "data-app-action-sidebar-project-label",
+        "data-app-action-sidebar-thread-active",
+        "aria-label",
+        "aria-current",
+      ],
+    });
+  }
+
+  function destroy() {
+    if (destroyed) return;
+    destroyed = true;
+    if (reattachTimer !== null) window.clearTimeout(reattachTimer);
+    reattachTimer = null;
+    observer?.disconnect();
+    observer = null;
+    cancelFrameReadyWaiters(new Error("任务面板已关闭"));
+    hostRequests.forEach(({ reject, timeout }) => {
+      window.clearTimeout(timeout);
+      reject(new Error("任务面板已关闭"));
+    });
+    hostRequests.clear();
+    pendingThreadCreation = null;
+    document.removeEventListener("DOMContentLoaded", mount);
+    document.removeEventListener("click", onDocumentClick, true);
+    window.removeEventListener("message", onFrameMessage);
+    window.removeEventListener("popstate", onNativeRouteChange);
+    window.removeEventListener("hashchange", onNativeRouteChange);
+    window.removeEventListener("resize", scheduleRefresh);
+    closeTaskboard(false);
+    document.querySelectorAll(`[${OWNED_ATTRIBUTE}="true"]`).forEach((node) => node.remove());
+    entry = null;
+    page = null;
+    frame = null;
+    dragRegion = null;
+    noDragLeft = null;
+    noDragRight = null;
+    status = null;
+    frameOrigin = "";
+    if (window[SENTINEL_KEY] === api) delete window[SENTINEL_KEY];
+  }
+
+  function onNativeRouteChange() {
+    if (nativeThreadPanelThreadId) {
+      suppressNativeCloseUntil = Date.now() + 1_000;
+      if (nativeThreadPanelCanAttach) scheduleNativeThreadPanelAttach();
+      return;
+    }
+    if (active) closeTaskboard(false);
+  }
+
+  const api = {
+    version: VERSION,
+    sourceHash: SOURCE_HASH,
+    refresh,
+    reloadFrame,
+    open: openTaskboard,
+    close: closeTaskboard,
+    destroy,
+    hostResponse: onHostResponse,
+  };
+  window[SENTINEL_KEY] = api;
+
+  window.addEventListener("message", onFrameMessage);
+  window.addEventListener("popstate", onNativeRouteChange);
+  window.addEventListener("hashchange", onNativeRouteChange);
+  window.addEventListener("resize", scheduleRefresh);
+  document.addEventListener("click", onDocumentClick, true);
+  if (document.documentElement) mount();
+  else document.addEventListener("DOMContentLoaded", mount, { once: true });
+})();
diff --git a/apps/codex-taskboard/package-lock.json b/apps/codex-taskboard/package-lock.json
new file mode 100644
index 000000000..65e30cfeb
--- /dev/null
+++ b/apps/codex-taskboard/package-lock.json
@@ -0,0 +1,4647 @@
+{
+  "name": "codex-taskboard",
+  "version": "0.1.0",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "codex-taskboard",
+      "version": "0.1.0",
+      "dependencies": {
+        "@lobehub/icons-static-svg": "^1.94.0",
+        "@xyflow/react": "^12.11.2",
+        "react": "^19.2.7",
+        "react-dom": "^19.2.7",
+        "react-markdown": "^10.1.0",
+        "remark-gfm": "^4.0.1"
+      },
+      "bin": {
+        "taskctl": "cli/taskctl.mjs"
+      },
+      "devDependencies": {
+        "@types/react": "^19.2.17",
+        "@types/react-dom": "^19.2.3",
+        "@vitejs/plugin-react": "^6.0.3",
+        "miniflare": "^4.20260722.0",
+        "typescript": "^7.0.2",
+        "vite": "^8.1.5",
+        "wrangler": "^4.114.0"
+      },
+      "engines": {
+        "node": ">=22.5"
+      }
+    },
+    "node_modules/@cloudflare/kv-asset-handler": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/@cloudflare/kv-asset-handler/-/kv-asset-handler-0.5.0.tgz",
+      "integrity": "sha512-jxQYkj8dSIzc0cD6cMMNdOc1UVjqSqu8BZdor5s8cGjW2I8BjODt/kWPVdY+u9zj3ms75Q5qaZgnxUad83+eAg==",
+      "dev": true,
+      "license": "MIT OR Apache-2.0",
+      "engines": {
+        "node": ">=22.0.0"
+      }
+    },
+    "node_modules/@cloudflare/unenv-preset": {
+      "version": "2.16.1",
+      "resolved": "https://registry.npmjs.org/@cloudflare/unenv-preset/-/unenv-preset-2.16.1.tgz",
+      "integrity": "sha512-ECxObrMfyTl5bhQf/lZCXwo5G6xX9IAUo+nDMKK4SZ8m4Jvvxp52vilxyySSWh2YTZz8+HQ07qGH/2rEom1vDw==",
+      "dev": true,
+      "license": "MIT OR Apache-2.0",
+      "peerDependencies": {
+        "unenv": "2.0.0-rc.24",
+        "workerd": ">1.20260305.0 <2.0.0-0"
+      },
+      "peerDependenciesMeta": {
+        "workerd": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@cloudflare/workerd-darwin-64": {
+      "version": "1.20260722.1",
+      "resolved": "https://registry.npmjs.org/@cloudflare/workerd-darwin-64/-/workerd-darwin-64-1.20260722.1.tgz",
+      "integrity": "sha512-vZOP8vIS3NwnuaO+gz0FZ7kIGeiO3bZmxV35Ph9zOXKSREhDFlH7wQ7mkCdhW3O4jnXsew+XT7b+DNEI2CcJGQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/@cloudflare/workerd-darwin-arm64": {
+      "version": "1.20260722.1",
+      "resolved": "https://registry.npmjs.org/@cloudflare/workerd-darwin-arm64/-/workerd-darwin-arm64-1.20260722.1.tgz",
+      "integrity": "sha512-EmIQymihDq6WNdER4+LF8Qn80yqayBUpJ+tkOO7wmY8pmgfyXjIUFNXotl21AHovTeu2seR7HdVUgeN/BilCWw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/@cloudflare/workerd-linux-64": {
+      "version": "1.20260722.1",
+      "resolved": "https://registry.npmjs.org/@cloudflare/workerd-linux-64/-/workerd-linux-64-1.20260722.1.tgz",
+      "integrity": "sha512-jvZ3k9fxcnEn04s80CgIYxQfpOyAiz/8qC42DP8EBa9tR27qWyg9wmm31zIobVlrgBZn/+8NfdP73avRGcQOjQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/@cloudflare/workerd-linux-arm64": {
+      "version": "1.20260722.1",
+      "resolved": "https://registry.npmjs.org/@cloudflare/workerd-linux-arm64/-/workerd-linux-arm64-1.20260722.1.tgz",
+      "integrity": "sha512-BOSB55SMNdy+DA5uj2WirgiNanpHGis5PVvXH1wSfvjRKr4JGgWK+EZzxz0RFUo6QjjQQC/NimEzNZ7va7jmKg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/@cloudflare/workerd-windows-64": {
+      "version": "1.20260722.1",
+      "resolved": "https://registry.npmjs.org/@cloudflare/workerd-windows-64/-/workerd-windows-64-1.20260722.1.tgz",
+      "integrity": "sha512-sYM8YgUpKnRz2xjvdJLX1Ojzoi4MlA4gk8WTTExhGydjYB2UTs5NIbv0ZmpKgMoK9io3ixgmiW56ZnTbcWOdiA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/@cspotcode/source-map-support": {
+      "version": "0.8.1",
+      "resolved": "https://registry.npmjs.org/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz",
+      "integrity": "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/trace-mapping": "0.3.9"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@emnapi/core": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.11.1.tgz",
+      "integrity": "sha512-RSvbQmHzdKzNsLYa/wHrbc3KN4sYLKAdPZxqiM2HATqv/SBk2/ENSHpvXGaLOMcsAyz0poEGqkmmKYG3OWiJEQ==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@emnapi/wasi-threads": "1.2.2",
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@emnapi/runtime": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.11.1.tgz",
+      "integrity": "sha512-vgj7R3y3Wgx24IQaGPA/R6YFXLHVMOZ0uVEyIQPaWs+rd1AzfEMXlAC22FYwO1XkKR6NPsq7mUandH8oIRdZFw==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@emnapi/wasi-threads": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.2.tgz",
+      "integrity": "sha512-c95qOXkHdydNKhscBTebqEC1CVAZpyqOfVfBzQ1qgzyl3gfeldUjIggDbIZgDKsHLgnsM+igH7TJ/eAasaVuMA==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@esbuild/aix-ppc64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.28.1.tgz",
+      "integrity": "sha512-Svl7tq8k/08+p6CXPpRjQ1fKX+1odH/BQbb48fV6fj3CWHhsoIOoY87w1oHXm0qEpkIK3ZfVgp0hed3XBXzXMQ==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "aix"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-arm": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.28.1.tgz",
+      "integrity": "sha512-0k2F129Xdio1TdJfzJ8sy1Q47vUD2NnwdhiAf7drUN1EBTfPf4hsFCtmMgu/6m8JSzsBrlmVjudMBQqOfG8usQ==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-arm64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.28.1.tgz",
+      "integrity": "sha512-34EGEbCIAgosYz6goLcopX6Mo7NyGv9tfwEM2/7Ce2VcVRk568iSvniGWcUXIy7wEDR1wzolcxcriFVrWYcwBg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-x64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.28.1.tgz",
+      "integrity": "sha512-dbwY7ltSMDWsRatcRpCnES4F+im88OCUgGZjy52shC7GqHRE/cYlxNbB4Z4UpJswpcc4Qxd2oE/ufM0p61IKng==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/darwin-arm64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.28.1.tgz",
+      "integrity": "sha512-TZbWkQY7kvTAXbXUT7uVACR5cMHsDiSz9z7ZKAX/RTq/WJEk3QyRr0wZpNhBDX+/0CtdqUIJlOiodQcta6tY3Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/darwin-x64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.28.1.tgz",
+      "integrity": "sha512-zfdzgK9ACBNZLI/CyHTOx81SyNbM6YXn7rxSgX97VjyiPl9W1i4Ka4fgKECEoFCKGpvBj5qArWIGgQjOwkgskQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/freebsd-arm64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.28.1.tgz",
+      "integrity": "sha512-wG2EA8ENdEI0qhkSZMjfqrdY+ziCYCPMmtZjjIwOmXFjmyzEHn+UUxk5of+SYsjtfs3VpnlC7QLzSI5hY/rOAw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/freebsd-x64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.28.1.tgz",
+      "integrity": "sha512-i7dZ9vQgnvSCzi/rYCXNgtF/U+eKZNJBzu3eTQbRgHnM7tNSizLOkRFAl3qzVc/Op/u5YkHHa4pf/3DOYHthLQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-arm": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.28.1.tgz",
+      "integrity": "sha512-qVXBOHQS+d5Y722GwJzJUtOLlX7km3CraOaGormF1pDtPd2C/l1SHRPgjLunLGe51Sh5YYWKMFDyV4SxgMQYTQ==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-arm64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.28.1.tgz",
+      "integrity": "sha512-yHs+0uc8+nvEAfAfxrWQKK5peSNzBc4PegcMO0EJ2hT71uA7vB8Ihg2e77R2P7SG5uYjPbHlLLmve4LLLRCf0g==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-ia32": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.28.1.tgz",
+      "integrity": "sha512-d1z4ZuP0ajrfz/FhGT4vv278rX8KnPPJx8i5+AtK7TYbx9Le9F1hyzurZpkEyjkGa9dUGhQow4C1NmeGvqxN2w==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-loong64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.28.1.tgz",
+      "integrity": "sha512-M5sRjUVZrkm1OAPR3dlOYzNmN+loZKGVi1VUQGrwuqLcbR6qeAz+famMhjASeH3YVKvZz+zT1jlh/keC3Rj/lg==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-mips64el": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.28.1.tgz",
+      "integrity": "sha512-mRObBZeHh2OxcBFPWE/FjylkRgZdYuiTR3vaTozquCGOH14iP9oN4x4Ge81CoIDYQrXmIxpFumJBu5MtZpnQJQ==",
+      "cpu": [
+        "mips64el"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-ppc64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.28.1.tgz",
+      "integrity": "sha512-slScBsMAb3GFDcdrCgLwZtPYRoH2H/youv10QiZyRjmsP48fznoveWytSgCI/R0ZcUgpc0ZhIUEx6LHts8yrfQ==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-riscv64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.28.1.tgz",
+      "integrity": "sha512-kw0owk1o0GFETUJyW0jc0G4Yzs0BHZn0JDZ8JRT088vjJYX777BAs1fDGxAC+q831qOs2DTC96mNsG2opdfyyQ==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-s390x": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.28.1.tgz",
+      "integrity": "sha512-/lAIjX8aYFRByhh6L5rYtPEDRqa9de/4V/juOXcta5frjvzXO4/sqEtyytse0g3zZFuWu5cDN0MkLz2qRDD2Ag==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-x64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.28.1.tgz",
+      "integrity": "sha512-u/anNYF2mmVOEDwLtnQ1wOr3EZ9sTNGLWrsYGYwHWzGA3Si84IOkHXlbWTD1NB+9/1lcnweYKO54uhxZydNzfA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/netbsd-arm64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.28.1.tgz",
+      "integrity": "sha512-oks0DYbLwWMmaakTsCb+zL4E+aHRVLom9IJZOAthMQEPiQmydXHkziYEsGYRx0uNV/IjEKGAV941JzH02pflqw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/netbsd-x64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.28.1.tgz",
+      "integrity": "sha512-aeL6lAnN89Hz43Mlh1G8ARasbuoYvSITDEx0tHh5b7jJnHcssqgjy9Yx430GDpmCa6OyrKoS0aNRjKundRizGg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openbsd-arm64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.28.1.tgz",
+      "integrity": "sha512-MEFJe5C3R8pwXdZ5Y21oo6m7ePiS0d9pWucn99O/wvyJZChoIQKrQDxKrGeW8F5+T0okTHesAmDeiHDTIq0V/Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openbsd-x64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.28.1.tgz",
+      "integrity": "sha512-i/ZLIOafE0Z8cI/XANJAixoJL/uRAoS2xOA3rb0xN+KK0K177cMAsQYkzHtBrtMXAKuAc7HGgcWiZ/sRC1Nxgw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openharmony-arm64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.28.1.tgz",
+      "integrity": "sha512-ge+Z7EXFNt2BO1oAMsVpiQ8EwndV9i1xXerAeTIK7AtPs3bKFXQM7nlRxDSIUIMeueR1CNXxqztLzdNeReKBJg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openharmony"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/sunos-x64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.28.1.tgz",
+      "integrity": "sha512-BEjgtECkL3vY+SaSQ6nzVfiALUeFxpawyp8Jmf5PtYhf1Ug40N1h/hxlhts+f1FvSvarEigdxS3BlSMI2PJLcQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "sunos"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-arm64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.28.1.tgz",
+      "integrity": "sha512-lCv9eK/H6ZJWbE7bh2nw54CZ9M2nupBxJcTsdk/QQnWkdSjKGuxmmH8/GWrlT1eMmZfn4dGcCjRte397WqfQXA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-ia32": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.28.1.tgz",
+      "integrity": "sha512-zvb/mB2bSCoJOpoCBgYKKpX6YM6mJBlBUVUtVj41DlZJVEB6/0CKlRYxP5wWl1C1ILiCoAU5wZZ4q1P3qeS6Eg==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-x64": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.28.1.tgz",
+      "integrity": "sha512-bm4Mowrv+GXMlpWX++EcXw/iLyd1o3+bJkC2DkWXYVvgZCqD/bSj9ctZeAMC3cIxgjRVR2Dufaiu4YPxr5gW1A==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@img/colour": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@img/colour/-/colour-1.1.0.tgz",
+      "integrity": "sha512-Td76q7j57o/tLVdgS746cYARfSyxk8iEfRxewL9h4OMzYhbW4TAcppl0mT4eyqXddh6L/jwoM75mo7ixa/pCeQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@img/sharp-darwin-arm64": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-darwin-arm64/-/sharp-darwin-arm64-0.35.2.tgz",
+      "integrity": "sha512-eEieHsMksAW4IiO5NzauESRl2D2qz3J/kwUxUrSfV06A93eEaRfMpHXyUb1mAqrR7i8U9A0GRqE9pjn6u1Jjpg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-darwin-arm64": "1.3.1"
+      }
+    },
+    "node_modules/@img/sharp-darwin-x64": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-darwin-x64/-/sharp-darwin-x64-0.35.2.tgz",
+      "integrity": "sha512-BaktuGPCeHJMARpodR8jK4uKiZrPAy9WrfQW0sdI37clracq8Bp01AYS3SZgi5FS/y5twa9t4+LIuuxQjqRrWw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-darwin-x64": "1.3.1"
+      }
+    },
+    "node_modules/@img/sharp-freebsd-wasm32": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-freebsd-wasm32/-/sharp-freebsd-wasm32-0.35.2.tgz",
+      "integrity": "sha512-YoAxdnd8hPUkvLHd3bWY+YA8nw3xM/RyRopYucNsWHVSan8NLVM3X2volsfoRDcXdUJPg6tXahSd7HXPK7lRnw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "dependencies": {
+        "@img/sharp-wasm32": "0.35.2"
+      },
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-darwin-arm64": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-arm64/-/sharp-libvips-darwin-arm64-1.3.1.tgz",
+      "integrity": "sha512-4V/M3roRMTYjiwZY9IOVQOE8OyeCxFAkYmyZDrZl51uOKjibm3oeEJ4WAmLxutAfzFbC9jqUiPs2gbnGflH+7g==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-darwin-x64": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-x64/-/sharp-libvips-darwin-x64-1.3.1.tgz",
+      "integrity": "sha512-c0/DxItpJv2+dGhgycJBBgotdqruGYDvA79drdh0MD1dFpy7JzJ/PlXwi1H4rFf0eTy8tgbI91aHDnZIceY3jQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-linux-arm": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm/-/sharp-libvips-linux-arm-1.3.1.tgz",
+      "integrity": "sha512-aGGy9aWzXgHBG7HNyQPWorZthlp7+x6fDRoPAQbGO3ThcttuTyKIx3NuSHb6zb4gBNq6/yNn9f1cy9nFKS/Vmg==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-linux-arm64": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm64/-/sharp-libvips-linux-arm64-1.3.1.tgz",
+      "integrity": "sha512-JznefmcK9j1JKPz8AkQDh89kjojubyfOasWBPKfzMIhPwsgDy9evpE/naJTXXXmghS1iFwR8u/kTwh/I2/+GCw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-linux-ppc64": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-ppc64/-/sharp-libvips-linux-ppc64-1.3.1.tgz",
+      "integrity": "sha512-1EkwGNCZk6iWNCMWqrvdJ+r1j0PT1zIz60CNPhYnJlK/zyeWqlsPZIe+ocBVqPF8k/Ssee/NCk+tE9Ryrko6ng==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-linux-riscv64": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-riscv64/-/sharp-libvips-linux-riscv64-1.3.1.tgz",
+      "integrity": "sha512-Ilays+w2bXdnxzxtQdmXR62u8o8GYa3eL4+Gr+1KiE4xperMZUslRaVPJwwPkzlHEjGfXAfRVAa/7CYCtSqsBw==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-linux-s390x": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-s390x/-/sharp-libvips-linux-s390x-1.3.1.tgz",
+      "integrity": "sha512-VfBwVHQTbRoj4XlpA/KLZ7ltgMpz+4WSejFzQ+GnoImjo1PtEJ59QB2qR1xQEeRPYIkNrPIm2L4cICMvz4C2ew==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-linux-x64": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-x64/-/sharp-libvips-linux-x64-1.3.1.tgz",
+      "integrity": "sha512-+c8ukgwU62DS54nCAjw7keOfHUkmr0B5QHEdcOqRnodF/MNXJbVI8Eopoj4B/0H8Asr65I+A4Amrn7a85/md6A==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-linuxmusl-arm64": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-arm64/-/sharp-libvips-linuxmusl-arm64-1.3.1.tgz",
+      "integrity": "sha512-qlKb/pwbkAi1WMsJrYHk7CuDrd12s27U2QnRhFYUoJNrRCmkosMTttuRFat/DDB3IlDm5qE1TJgZ4JDnHX8Ldw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "libc": [
+        "musl"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-libvips-linuxmusl-x64": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-x64/-/sharp-libvips-linuxmusl-x64-1.3.1.tgz",
+      "integrity": "sha512-yO21HwoUVLN8Qa+/SBjQLMYwBWAVJjeGPNe+hc0OUeMeifEtJqu5a1c4HayE1nNpDih9y3/KkoltfkDodmKAlg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "libc": [
+        "musl"
+      ],
+      "license": "LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-linux-arm": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-arm/-/sharp-linux-arm-0.35.2.tgz",
+      "integrity": "sha512-SE4kzF2mepn6z+6E7L6lsV8FzuLL6IPQdyX8ZiwROAG/G8td+hP/m7FsFPwidtrF19gvajuC9l6TxAVcsA4S7A==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linux-arm": "1.3.1"
+      }
+    },
+    "node_modules/@img/sharp-linux-arm64": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-arm64/-/sharp-linux-arm64-0.35.2.tgz",
+      "integrity": "sha512-af12Pnd0ZGu2HfP8NayB0kk6eC/lrfbQE6HlR4jD+34wdJ1Vw9TF6TMn6ZvffT+WgqVsl0hRbmNvz2u/23VmwA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linux-arm64": "1.3.1"
+      }
+    },
+    "node_modules/@img/sharp-linux-ppc64": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-ppc64/-/sharp-linux-ppc64-0.35.2.tgz",
+      "integrity": "sha512-hYSBm7zcNtDCozCxQHYZJiu63b/bXsgRZuOxCIBZsStMM9Vap47iFHdbX4kCvQsblPB/k+clhELpdQJHQLSHvg==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linux-ppc64": "1.3.1"
+      }
+    },
+    "node_modules/@img/sharp-linux-riscv64": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-riscv64/-/sharp-linux-riscv64-0.35.2.tgz",
+      "integrity": "sha512-qQt0Kc13+Hoan/Awq/qMSQw3L+RI1NCRPgD5cUJ/1WSSmIoysLOc72jlRM3E0OHN9Yr313jgeQ2T+zW+F03QFA==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linux-riscv64": "1.3.1"
+      }
+    },
+    "node_modules/@img/sharp-linux-s390x": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-s390x/-/sharp-linux-s390x-0.35.2.tgz",
+      "integrity": "sha512-E4fLLfRPzDLlEeDaTzI98OFLcv++WL5ChLLMwPoVd0CIoZQqupBSNbOisPL5am9XsbQ9T84+iiMpUvbFtkunbA==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linux-s390x": "1.3.1"
+      }
+    },
+    "node_modules/@img/sharp-linux-x64": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linux-x64/-/sharp-linux-x64-0.35.2.tgz",
+      "integrity": "sha512-gi0zFJJRLswfCZmHtJdikXPOc5u7qamSOS3NHedLqLd4W8Q0NqjdBr6TTRIgsfFjqfTsHFgdfvJ9LwqSgcHiAA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linux-x64": "1.3.1"
+      }
+    },
+    "node_modules/@img/sharp-linuxmusl-arm64": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-arm64/-/sharp-linuxmusl-arm64-0.35.2.tgz",
+      "integrity": "sha512-siWbOW1u6HFnFLrp0waKyW7VEf7jYvcDWdrXEFa8AkdAQgEvuu5Fz8/Y70w9EeqAdwDtfU012BhEHHaDqvQNzg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "libc": [
+        "musl"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linuxmusl-arm64": "1.3.1"
+      }
+    },
+    "node_modules/@img/sharp-linuxmusl-x64": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-x64/-/sharp-linuxmusl-x64-0.35.2.tgz",
+      "integrity": "sha512-YBqMMcjDi4QGYiSn4vNOYBhmlC4z5AXqkOUUqI2e0AFA4urNv4ESgOgwNl3K+4etQhha0twXlzeF20bbULm9Yg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "libc": [
+        "musl"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-libvips-linuxmusl-x64": "1.3.1"
+      }
+    },
+    "node_modules/@img/sharp-wasm32": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-wasm32/-/sharp-wasm32-0.35.2.tgz",
+      "integrity": "sha512-Mrv4JQNYVQ94xH+jzZ9r+gowleN8mv2FTgKT+PI6bx5C0G8TdNYndu161pg2i7uoBwxy2ImPMHrJOM2LZef7Bw==",
+      "dev": true,
+      "license": "Apache-2.0 AND LGPL-3.0-or-later AND MIT",
+      "optional": true,
+      "dependencies": {
+        "@emnapi/runtime": "^1.11.1"
+      },
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-webcontainers-wasm32": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-webcontainers-wasm32/-/sharp-webcontainers-wasm32-0.35.2.tgz",
+      "integrity": "sha512-QNV27pxs9wpApEiCfvHM1RDoP1w1+2KrUWWDPEhEwg+latvOrfuhWrHWZKwdSFwU6jh3myjw/yOCRsUIuOft3g==",
+      "cpu": [
+        "wasm32"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "dependencies": {
+        "@img/sharp-wasm32": "0.35.2"
+      },
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-win32-arm64": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-win32-arm64/-/sharp-win32-arm64-0.35.2.tgz",
+      "integrity": "sha512-BiVRYc/t6/Vl3e1hBx0hugG4oN9Pydf4fgMSpxTQJmwGUg/YoXTWHiFeRymHfCZzifxu4F4rpk/I67D0LQ20wQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0 AND LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-win32-ia32": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-win32-ia32/-/sharp-win32-ia32-0.35.2.tgz",
+      "integrity": "sha512-YYEhx9PImCC7T0tI8JDMi4DB9LwLCXCU5OWNYEXAxh5Q1ShKkyC6byxzoBJ3gEFDnH2lQckWuDe70G7mB2XJog==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "Apache-2.0 AND LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": "^20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@img/sharp-win32-x64": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/@img/sharp-win32-x64/-/sharp-win32-x64-0.35.2.tgz",
+      "integrity": "sha512-imoOyBcoM/iiUr4J6VPpCNjPnjvP/Gks95898yB8YqoGGYmHYbOyCuNv9FMhFgtaiHFGbHW8bxKqRV6VjtXThQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0 AND LGPL-3.0-or-later",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      }
+    },
+    "node_modules/@jridgewell/resolve-uri": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
+      "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@jridgewell/sourcemap-codec": {
+      "version": "1.5.5",
+      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz",
+      "integrity": "sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@jridgewell/trace-mapping": {
+      "version": "0.3.9",
+      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz",
+      "integrity": "sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/resolve-uri": "^3.0.3",
+        "@jridgewell/sourcemap-codec": "^1.4.10"
+      }
+    },
+    "node_modules/@lobehub/icons-static-svg": {
+      "version": "1.94.0",
+      "resolved": "https://registry.npmjs.org/@lobehub/icons-static-svg/-/icons-static-svg-1.94.0.tgz",
+      "integrity": "sha512-Inx1TYkjLH6YeHOIHeVW9+OM/xxRnk8TmcQVKquFUDBmE3X9sUuRGt7kALrrDBNNAbrWz7Qq6fAiFj9E9Mmw9Q==",
+      "license": "MIT"
+    },
+    "node_modules/@napi-rs/wasm-runtime": {
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/@napi-rs/wasm-runtime/-/wasm-runtime-1.1.6.tgz",
+      "integrity": "sha512-ZLv/JdUfkvOy9eCnnBaGfiO+XimbjebAeO+MRQqD/B+FR1tnRN0tpKSJHRbE8sFfS6aqsXZ67TQjfwfsxULVbg==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@tybys/wasm-util": "^0.10.3"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/Brooooooklyn"
+      },
+      "peerDependencies": {
+        "@emnapi/core": "^1.7.1",
+        "@emnapi/runtime": "^1.7.1"
+      }
+    },
+    "node_modules/@oxc-project/types": {
+      "version": "0.139.0",
+      "resolved": "https://registry.npmjs.org/@oxc-project/types/-/types-0.139.0.tgz",
+      "integrity": "sha512-r9gHphtCs+1M7J0pw6Sn/hh/Wpa/iQrOOkrNAlVLF/gHq+/CJmHIWKKUUhdWjcD6CIa8idarspCsASiXCXvFUw==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/Boshen"
+      }
+    },
+    "node_modules/@poppinss/colors": {
+      "version": "4.1.6",
+      "resolved": "https://registry.npmjs.org/@poppinss/colors/-/colors-4.1.6.tgz",
+      "integrity": "sha512-H9xkIdFswbS8n1d6vmRd8+c10t2Qe+rZITbbDHHkQixH5+2x1FDGmi/0K+WgWiqQFKPSlIYB7jlH6Kpfn6Fleg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "kleur": "^4.1.5"
+      }
+    },
+    "node_modules/@poppinss/dumper": {
+      "version": "0.6.5",
+      "resolved": "https://registry.npmjs.org/@poppinss/dumper/-/dumper-0.6.5.tgz",
+      "integrity": "sha512-NBdYIb90J7LfOI32dOewKI1r7wnkiH6m920puQ3qHUeZkxNkQiFnXVWoE6YtFSv6QOiPPf7ys6i+HWWecDz7sw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@poppinss/colors": "^4.1.5",
+        "@sindresorhus/is": "^7.0.2",
+        "supports-color": "^10.0.0"
+      }
+    },
+    "node_modules/@poppinss/exception": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/@poppinss/exception/-/exception-1.2.3.tgz",
+      "integrity": "sha512-dCED+QRChTVatE9ibtoaxc+WkdzOSjYTKi/+uacHWIsfodVfpsueo3+DKpgU5Px8qXjgmXkSvhXvSCz3fnP9lw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@rolldown/binding-android-arm64": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-android-arm64/-/binding-android-arm64-1.1.5.tgz",
+      "integrity": "sha512-lZg8fqIv2v7FF237bwMgzGZEJvGL79/s5knJ/i6FmsGF4XXlzccZ4jb+TrFIxtSSxFtIpdsgrPZeMk1I9AFcyQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-darwin-arm64": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-arm64/-/binding-darwin-arm64-1.1.5.tgz",
+      "integrity": "sha512-51Bnx9pNiMRKSUNtBfySkNJ9vMU9Hh3I1ozDd6gyPPYzaXCfnptUcEZxXGYFn+ul2dtcMUiqGR1Yai2K10uoTw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-darwin-x64": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-x64/-/binding-darwin-x64-1.1.5.tgz",
+      "integrity": "sha512-Tm+gbfC0aHu1tBA/JvKQh32S0K6YgCHkiAF4/W6xX0K0RmNuc94VeK419dJoE65R5aRxmo+noZQSWrAMF6yb6g==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-freebsd-x64": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-freebsd-x64/-/binding-freebsd-x64-1.1.5.tgz",
+      "integrity": "sha512-JMzDKCCXq93YccG5gz3hvOs1oXRKAf0XYpfOS88e+wZrC8Iugj6j68867vrYZkvpDDpKn/KoKORThmchMpF6TA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-arm-gnueabihf": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm-gnueabihf/-/binding-linux-arm-gnueabihf-1.1.5.tgz",
+      "integrity": "sha512-uML21j2K5TfPGutKxub+M+nLjZIrWjXQ5Grx4lCe/nimTj9B4L63zHpjXLl4y0L3mcm2htEQIb06oCG/szerNw==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-arm64-gnu": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-1.1.5.tgz",
+      "integrity": "sha512-navSiuTMogvnQoZoM/v+l3ZWo50/NTwSHSzheABx/RCnmUPaKwq9qSo4Br2OYRs21+Fz8uFqITZM3H4opOB0/Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-arm64-musl": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-musl/-/binding-linux-arm64-musl-1.1.5.tgz",
+      "integrity": "sha512-lAryqH7IteztmCXQXk0etKj4wBQ7Gx5S6LjKhsgp9zb8I5bsuvU/2llH1hDQcjsFeqIsovMVN339/8pUDDBXxA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "libc": [
+        "musl"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-ppc64-gnu": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-ppc64-gnu/-/binding-linux-ppc64-gnu-1.1.5.tgz",
+      "integrity": "sha512-fsK/sNBnxzBlL4O1JNrZakVQxPspqpED5dLtNsZS9oOKmtSpdNIzxH2kkol5HYTWJN47sE20ztMJPxfZ89qGOg==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-s390x-gnu": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-s390x-gnu/-/binding-linux-s390x-gnu-1.1.5.tgz",
+      "integrity": "sha512-gLYb4BIadlfTOYT5gO503n8zQjXflgzpD0FcyKh0Mzx3rqCZKnHoJWV9xe1KXUJ5lx2JfcSHr/mhzS0PC/McAA==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-x64-gnu": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-gnu/-/binding-linux-x64-gnu-1.1.5.tgz",
+      "integrity": "sha512-FjcpEKUyJygHgs1o50VYNvkt5+7Le/VEdYt0AkRpkL33MnyQfwr8l5mXwMmfmTbyMPr5vJLC+8/Gd9gXnwU1QQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-x64-musl": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-musl/-/binding-linux-x64-musl-1.1.5.tgz",
+      "integrity": "sha512-Me+PfPI2TMeOQk0gYWfLQZtTktrmzbr8cDboqX83XKc7UrgAi55gF+2dUkWdxd19n55Essp2yeca+O9N5rBxHg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "libc": [
+        "musl"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-openharmony-arm64": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-openharmony-arm64/-/binding-openharmony-arm64-1.1.5.tgz",
+      "integrity": "sha512-yc5WrLzXks6zCQfn9Oxr8pORKyl/pF+QjHmW/Qx3qu0oyrrNC+y2JLTU1E2rcWYAmzlnqngWXHQjy51VzW70Vw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openharmony"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-wasm32-wasi": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-wasm32-wasi/-/binding-wasm32-wasi-1.1.5.tgz",
+      "integrity": "sha512-VbQGPX2b4r48TAMIM2cjgluIM1HYutm4pcTEJsle7iEP7sB1dFqtPLBVbdLAZCxy1txCcPxf4QFf4v8uvltPqA==",
+      "cpu": [
+        "wasm32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@emnapi/core": "1.11.1",
+        "@emnapi/runtime": "1.11.1",
+        "@napi-rs/wasm-runtime": "^1.1.6"
+      },
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-win32-arm64-msvc": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-1.1.5.tgz",
+      "integrity": "sha512-gHv82k63z4qpV5+Q1y/12KrK0ltWBukVDI8nZcbT7Tt/ZlOIVwppazneq0F93oDxTo3IgAMEDIoQh3E2n6mVsw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-win32-x64-msvc": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-x64-msvc/-/binding-win32-x64-msvc-1.1.5.tgz",
+      "integrity": "sha512-tTZuDBPw85tEN5PQi1pnEBzDy0Z49HtScLAbD5t6hyeU92A95pRWaSMw1GZZi/RwgSgUIl0xrSlXIT/9QzvYSA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/pluginutils": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.1.tgz",
+      "integrity": "sha512-2j9bGt5Jh8hj+vPtgzPtl72j0yRxHAyumoo6TNfAjsLB04UtpSvPbPcDcBMxz7n+9CYB0c1GxQFxYRg2jimqGw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@sindresorhus/is": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-7.2.0.tgz",
+      "integrity": "sha512-P1Cz1dWaFfR4IR+U13mqqiGsLFf1KbayybWwdd2vfctdV6hDpUkgCY0nKOLLTMSoRd/jJNjtbqzf13K8DCCXQw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sindresorhus/is?sponsor=1"
+      }
+    },
+    "node_modules/@speed-highlight/core": {
+      "version": "1.2.17",
+      "resolved": "https://registry.npmjs.org/@speed-highlight/core/-/core-1.2.17.tgz",
+      "integrity": "sha512-Z92FwKpCtfaW1V0jTU/fh3QzYEZN8wDwrzRIBoADCJfn4mJCNcJN/XegifX7BDrQ8/h9Xh/JnbyMchL0FqXrkg==",
+      "dev": true,
+      "license": "CC0-1.0"
+    },
+    "node_modules/@tybys/wasm-util": {
+      "version": "0.10.3",
+      "resolved": "https://registry.npmjs.org/@tybys/wasm-util/-/wasm-util-0.10.3.tgz",
+      "integrity": "sha512-F3fo1MYrRJYL3zER0OUOmkutjr1Vp23m7OsSgp7nq4SP6OqX6C/56XFIPAl5bt3zaBRjmW7SGz3u/6LwFpYcOg==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@types/d3-color": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/@types/d3-color/-/d3-color-3.1.3.tgz",
+      "integrity": "sha512-iO90scth9WAbmgv7ogoq57O9YpKmFBbmoEoCHDB2xMBY0+/KVrqAaCDyCE16dUspeOvIxFFRI+0sEtqDqy2b4A==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-drag": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@types/d3-drag/-/d3-drag-3.0.7.tgz",
+      "integrity": "sha512-HE3jVKlzU9AaMazNufooRJ5ZpWmLIoc90A37WU2JMmeq28w1FQqCZswHZ3xR+SuxYftzHq6WU6KJHvqxKzTxxQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-selection": "*"
+      }
+    },
+    "node_modules/@types/d3-interpolate": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-interpolate/-/d3-interpolate-3.0.4.tgz",
+      "integrity": "sha512-mgLPETlrpVV1YRJIglr4Ez47g7Yxjl1lj7YKsiMCb27VJH9W8NVM6Bb9d8kkpG/uAQS5AmbA48q2IAolKKo1MA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-color": "*"
+      }
+    },
+    "node_modules/@types/d3-selection": {
+      "version": "3.0.11",
+      "resolved": "https://registry.npmjs.org/@types/d3-selection/-/d3-selection-3.0.11.tgz",
+      "integrity": "sha512-bhAXu23DJWsrI45xafYpkQ4NtcKMwWnAC/vKrd2l+nxMFuvOT3XMYTIj2opv8vq8AO5Yh7Qac/nSeP/3zjTK0w==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-transition": {
+      "version": "3.0.9",
+      "resolved": "https://registry.npmjs.org/@types/d3-transition/-/d3-transition-3.0.9.tgz",
+      "integrity": "sha512-uZS5shfxzO3rGlu0cC3bjmMFKsXv+SmZZcgp0KD22ts4uGXp5EVYGzu/0YdwZeKmddhcAccYtREJKkPfXkZuCg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-selection": "*"
+      }
+    },
+    "node_modules/@types/d3-zoom": {
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/@types/d3-zoom/-/d3-zoom-3.0.8.tgz",
+      "integrity": "sha512-iqMC4/YlFCSlO8+2Ii1GGGliCAY4XdeG748w5vQUbevlbDu0zSjH/+jojorQVBK/se0j6DUFNPBGSqD3YWYnDw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-interpolate": "*",
+        "@types/d3-selection": "*"
+      }
+    },
+    "node_modules/@types/debug": {
+      "version": "4.1.13",
+      "resolved": "https://registry.npmjs.org/@types/debug/-/debug-4.1.13.tgz",
+      "integrity": "sha512-KSVgmQmzMwPlmtljOomayoR89W4FynCAi3E8PPs7vmDVPe84hT+vGPKkJfThkmXs0x0jAaa9U8uW8bbfyS2fWw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/ms": "*"
+      }
+    },
+    "node_modules/@types/estree": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.9.tgz",
+      "integrity": "sha512-GhdPgy1el4/ImP05X05Uw4cw2/M93BCUmnEvWZNStlCzEKME4Fkk+YpoA5OiHNQmoS7Cafb8Xa3Pya8m1Qrzeg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/estree-jsx": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/@types/estree-jsx/-/estree-jsx-1.0.5.tgz",
+      "integrity": "sha512-52CcUVNFyfb1A2ALocQw/Dd1BQFNmSdkuC3BkZ6iqhdMfQz7JWOFRuJFloOzjk+6WijU56m9oKXFAXc7o3Towg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "*"
+      }
+    },
+    "node_modules/@types/hast": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/@types/hast/-/hast-3.0.5.tgz",
+      "integrity": "sha512-rp/ezSWaD1m44dPKICGhiskI13nVr7qTloFwDa/IYkhhf5nzwP+zIQcIJh3WIFSBOy/H1PzB40jPjMDksN4F+g==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "*"
+      }
+    },
+    "node_modules/@types/mdast": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/@types/mdast/-/mdast-4.0.4.tgz",
+      "integrity": "sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "*"
+      }
+    },
+    "node_modules/@types/ms": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/@types/ms/-/ms-2.1.0.tgz",
+      "integrity": "sha512-GsCCIZDE/p3i96vtEqx+7dBUGXrc7zeSK3wwPHIaRThS+9OhWIXRqzs4d6k1SVU8g91DrNRWxWUGhp5KXQb2VA==",
+      "license": "MIT"
+    },
+    "node_modules/@types/react": {
+      "version": "19.2.17",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.17.tgz",
+      "integrity": "sha512-MXfmqaVPEVgkBT/aY0aGCkRWWtByiYQXo3xdQ8r5RzuFrPiRn8Gar2tQdXSUQ2GKV3bkXckek89V8wQBY2Q/Aw==",
+      "license": "MIT",
+      "dependencies": {
+        "csstype": "^3.2.2"
+      }
+    },
+    "node_modules/@types/react-dom": {
+      "version": "19.2.3",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.2.3.tgz",
+      "integrity": "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ==",
+      "devOptional": true,
+      "license": "MIT",
+      "peerDependencies": {
+        "@types/react": "^19.2.0"
+      }
+    },
+    "node_modules/@types/unist": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.3.tgz",
+      "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==",
+      "license": "MIT"
+    },
+    "node_modules/@typescript/typescript-aix-ppc64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-aix-ppc64/-/typescript-aix-ppc64-7.0.2.tgz",
+      "integrity": "sha512-MTKKkWB7p/0E9xi1d1tHtZ5PiLkGEMIq88pK2CubZjOsLtYTLqhgIgi6zepFa+9GHZ6h05NMCkQxGKiPXMxXtQ==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "aix"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-darwin-arm64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-darwin-arm64/-/typescript-darwin-arm64-7.0.2.tgz",
+      "integrity": "sha512-gowzar9MwS/aRWp6f3a4KUqzRjAZjOsmGNCM6LcTgXum+dBfgsBVMN+AgvOCCbguXyick6LJhpBszxMebJ8syA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-darwin-x64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-darwin-x64/-/typescript-darwin-x64-7.0.2.tgz",
+      "integrity": "sha512-SZ9xZInqApNlNGc9s0W1VSsktYSOe9cFqNOIqmN1Gs8SmkjKZYFt017G4VwPxASInODuAdbTW7sXiFUf893RgA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-freebsd-arm64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-freebsd-arm64/-/typescript-freebsd-arm64-7.0.2.tgz",
+      "integrity": "sha512-W5NH4y/J0plIIS5b2xvTEkU7JFxyqdMAOgf+Ilhl0vHQXKO5dZoxd+C/jEtq56c4F3wk71RB4BMRQ2XdI+bwYQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-freebsd-x64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-freebsd-x64/-/typescript-freebsd-x64-7.0.2.tgz",
+      "integrity": "sha512-UMGDx5sTpzNw3WiPebH7l90IWfJggEd+egHt/q6p7/Cm3zqoV7VxkGXt+3DxPIw8CcmvAB0j3sVVfbhX+M4Tpw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-linux-arm": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-linux-arm/-/typescript-linux-arm-7.0.2.tgz",
+      "integrity": "sha512-gffT3xPz9sR7j/YJExkyPntrI0P2EP9XbOyWzth2/Gs0RstK+90RBcO0ncXoXy/beYll1SXw846Nf2zdnEz0QQ==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-linux-arm64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-linux-arm64/-/typescript-linux-arm64-7.0.2.tgz",
+      "integrity": "sha512-Qh4eU4/y3yDjnfjjyPYihMj5/ODIlmt+Bzu17OI+fiSRDW57QmU5SiN63exPRNJPKUzcc1INa1NXdrJ+MqHjUQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-linux-loong64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-linux-loong64/-/typescript-linux-loong64-7.0.2.tgz",
+      "integrity": "sha512-uEHck9i8hoAzXPiYRib1O7miOnz23SxIeVl6F4LXox+qov1K35jHcEW6VHKvZI+pyvl7fZEP4MCU5LYvIq1GuQ==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-linux-mips64el": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-linux-mips64el/-/typescript-linux-mips64el-7.0.2.tgz",
+      "integrity": "sha512-R4KvAMnE43W5Qeqb0Ly56O3mWMWIAgsMyz36DCaycd5nbg/9kzm0liw3JocfRqyJY0KPmzFjbswozXyW0DnIYA==",
+      "cpu": [
+        "mips64el"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-linux-ppc64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-linux-ppc64/-/typescript-linux-ppc64-7.0.2.tgz",
+      "integrity": "sha512-DORx5b3sd/4S7eayxm4FQv+A7CrkUIGRaHiwI8oiHTAI1fAPWhF4J0vAlkC8biAlHSVVwxMQ3tjZ2/DVbnQiiA==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-linux-riscv64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-linux-riscv64/-/typescript-linux-riscv64-7.0.2.tgz",
+      "integrity": "sha512-wf0jqEDOjrPRnKwYRyyJDRo11KMbvMFrU+q4zqKyChODBzvlkbhNQfKvLxQCcwTpdDaXSHZTVuh0JoCrKCUMHQ==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-linux-s390x": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-linux-s390x/-/typescript-linux-s390x-7.0.2.tgz",
+      "integrity": "sha512-IkwJc3L7yhytWd/ewjyxNDfOmswCm9GWMJT/ue/dU4aZNbwZeYAetq42VyLmsmSjvoX7z74X6ZaYCtzAr0EuGw==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-linux-x64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-linux-x64/-/typescript-linux-x64-7.0.2.tgz",
+      "integrity": "sha512-EYdf2cNg7rgCWJnxCdJ+F3V39O8ihb37eHAu1LK8oAFizgTQbPOK7zHHXbPt8rX24COqODXeI3sIf0fCXG7H/A==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-netbsd-arm64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-netbsd-arm64/-/typescript-netbsd-arm64-7.0.2.tgz",
+      "integrity": "sha512-+polYF4MF04aPpO5FTkHran9yUQDSXqy5GiSDKpsll5jy3l3+g9QLhpf39T+ePtefhXLOGrLl0QIjkQP6VnelA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-netbsd-x64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-netbsd-x64/-/typescript-netbsd-x64-7.0.2.tgz",
+      "integrity": "sha512-8YIT0EHM/3dq10ZOVF/A7pc/YSMtbcecct4rWtexrnSCHOPcpC2KTLXfTCR6vDpnSiY12heNb1GiN/wu+T/FyA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-openbsd-arm64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-openbsd-arm64/-/typescript-openbsd-arm64-7.0.2.tgz",
+      "integrity": "sha512-APT8+ClYnuYm1u9+kgGXoMj2VzWzcymwh2gNSQVySHfkRDGOTVkoWLjCmOQSaO+PoqQ57B0flRp9SA+7GnnkzQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-openbsd-x64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-openbsd-x64/-/typescript-openbsd-x64-7.0.2.tgz",
+      "integrity": "sha512-yX7s+Q0Dln0Dt9tEzZsAjXXR/+ytBM7AlglaqyeMPxQszJ1JhlJdZ6jLA+IzldHtflX81em7lDao1xXu+aRRkg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-sunos-x64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-sunos-x64/-/typescript-sunos-x64-7.0.2.tgz",
+      "integrity": "sha512-dLJDGaLZ1D4HPQn62u1n8mBDkJREwMsAkCdkwd4Ieqw+x3TUyTsqY0YiBCtE6H6OzzgGk3iuZ3vFWRS+E8/d1g==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "sunos"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-win32-arm64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-win32-arm64/-/typescript-win32-arm64-7.0.2.tgz",
+      "integrity": "sha512-Gyl1Vy6OsWesLzmq+EP0Fb7b4Nid5232AvcA2SFcdYreldpNtYFFofPjnt62y9hQy7VTaZp65ICJjuAQRaVcIQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@typescript/typescript-win32-x64": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@typescript/typescript-win32-x64/-/typescript-win32-x64-7.0.2.tgz",
+      "integrity": "sha512-0BQ3HkAHHlKLSp1qRvf3SUhGpGsDuhB/jgFw75guyqbxJqEaS0Cw/VFO8i2nHglJUzQCRtMMR/IBAKE3ETMC4g==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/@ungap/structured-clone": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.3.3.tgz",
+      "integrity": "sha512-60YRaenCQcVjYEKOcG824+DRGGIQ3VKErcBoAEDJZz5bKIs2ZG+X/H9Nk+Q6EVkwJk5QNApxbrc5QtBSwtrXAg==",
+      "license": "ISC"
+    },
+    "node_modules/@vitejs/plugin-react": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-6.0.3.tgz",
+      "integrity": "sha512-vmFvco5/QuC2f9Oj+wTk0+9XeDFkHxSamwZKYc7MxYwKICfvUvlMhqKI0VuICPltGqh1neqBKDvO4kes1ya8vg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@rolldown/pluginutils": "^1.0.1"
+      },
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      },
+      "peerDependencies": {
+        "@rolldown/plugin-babel": "^0.1.7 || ^0.2.0",
+        "babel-plugin-react-compiler": "^1.0.0",
+        "vite": "^8.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@rolldown/plugin-babel": {
+          "optional": true
+        },
+        "babel-plugin-react-compiler": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@xyflow/react": {
+      "version": "12.11.2",
+      "resolved": "https://registry.npmjs.org/@xyflow/react/-/react-12.11.2.tgz",
+      "integrity": "sha512-eLAlDWJfWnQEhJwGMjlWdAXO9eYllKpliUmPQlAmOLxz6mExXuzMVDUKLMquixgkrtmMFFtug3jGKmYYld12cA==",
+      "license": "MIT",
+      "dependencies": {
+        "@xyflow/system": "0.0.79",
+        "classcat": "^5.0.3",
+        "zustand": "^4.4.0"
+      },
+      "peerDependencies": {
+        "@types/react": ">=17",
+        "@types/react-dom": ">=17",
+        "react": ">=17",
+        "react-dom": ">=17"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "@types/react-dom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@xyflow/system": {
+      "version": "0.0.79",
+      "resolved": "https://registry.npmjs.org/@xyflow/system/-/system-0.0.79.tgz",
+      "integrity": "sha512-czLyOh91NF0hIzbNzwi8I6GlqG23BHh2435OddfI6uiaLH3xdrdygO93gqgH1Bv9mhy8XPFQJOBn1FTq4LvEWA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-drag": "^3.0.7",
+        "@types/d3-interpolate": "^3.0.4",
+        "@types/d3-selection": "^3.0.10",
+        "@types/d3-transition": "^3.0.8",
+        "@types/d3-zoom": "^3.0.8",
+        "d3-drag": "^3.0.0",
+        "d3-interpolate": "^3.0.1",
+        "d3-selection": "^3.0.0",
+        "d3-zoom": "^3.0.0"
+      }
+    },
+    "node_modules/bail": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/bail/-/bail-2.0.2.tgz",
+      "integrity": "sha512-0xO6mYd7JB2YesxDKplafRpsiOzPt9V02ddPCLbY1xYGPOX24NTyN50qnUxgCPcSoYMhKpAuBTjQoRZCAkUDRw==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/blake3-wasm": {
+      "version": "2.1.5",
+      "resolved": "https://registry.npmjs.org/blake3-wasm/-/blake3-wasm-2.1.5.tgz",
+      "integrity": "sha512-F1+K8EbfOZE49dtoPtmxUQrpXaBIl3ICvasLh+nJta0xkz+9kF/7uet9fLnwKqhDrmj6g+6K3Tw9yQPUg2ka5g==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/ccount": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/ccount/-/ccount-2.0.1.tgz",
+      "integrity": "sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/character-entities": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/character-entities/-/character-entities-2.0.2.tgz",
+      "integrity": "sha512-shx7oQ0Awen/BRIdkjkvz54PnEEI/EjwXDSIZp86/KKdbafHh1Df/RYGBhn4hbe2+uKC9FnT5UCEdyPz3ai9hQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/character-entities-html4": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/character-entities-html4/-/character-entities-html4-2.1.0.tgz",
+      "integrity": "sha512-1v7fgQRj6hnSwFpq1Eu0ynr/CDEw0rXo2B61qXrLNdHZmPKgb7fqS1a2JwF0rISo9q77jDI8VMEHoApn8qDoZA==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/character-entities-legacy": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/character-entities-legacy/-/character-entities-legacy-3.0.0.tgz",
+      "integrity": "sha512-RpPp0asT/6ufRm//AJVwpViZbGM/MkjQFxJccQRHmISF/22NBtsHqAWmL+/pmkPWoIUJdWyeVleTl1wydHATVQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/character-reference-invalid": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/character-reference-invalid/-/character-reference-invalid-2.0.1.tgz",
+      "integrity": "sha512-iBZ4F4wRbyORVsu0jPV7gXkOsGYjGHPmAyv+HiHG8gi5PtC9KI2j1+v8/tlibRvjoWX027ypmG/n0HtO5t7unw==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/classcat": {
+      "version": "5.0.5",
+      "resolved": "https://registry.npmjs.org/classcat/-/classcat-5.0.5.tgz",
+      "integrity": "sha512-JhZUT7JFcQy/EzW605k/ktHtncoo9vnyW/2GspNYwFlN1C/WmjuV/xtS04e9SOkL2sTdw0VAZ2UGCcQ9lR6p6w==",
+      "license": "MIT"
+    },
+    "node_modules/comma-separated-tokens": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/comma-separated-tokens/-/comma-separated-tokens-2.0.3.tgz",
+      "integrity": "sha512-Fu4hJdvzeylCfQPp9SGWidpzrMs7tTrlu6Vb8XGaRGck8QSNZJJp538Wrb60Lax4fPwR64ViY468OIUTbRlGZg==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/cookie": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.1.1.tgz",
+      "integrity": "sha512-ei8Aos7ja0weRpFzJnEA9UHJ/7XQmqglbRwnf2ATjcB9Wq874VKH9kfjjirM6UhU2/E5fFYadylyhFldcqSidQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/csstype": {
+      "version": "3.2.3",
+      "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.3.tgz",
+      "integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==",
+      "license": "MIT"
+    },
+    "node_modules/d3-color": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-3.1.0.tgz",
+      "integrity": "sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-dispatch": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-dispatch/-/d3-dispatch-3.0.1.tgz",
+      "integrity": "sha512-rzUyPU/S7rwUflMyLc1ETDeBj0NRuHKKAcvukozwhshr6g6c5d8zh4c2gQjY2bZ0dXeGLWc1PF174P2tVvKhfg==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-drag": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-drag/-/d3-drag-3.0.0.tgz",
+      "integrity": "sha512-pWbUJLdETVA8lQNJecMxoXfH6x+mO2UQo8rSmZ+QqxcbyA3hfeprFgIT//HW2nlHChWeIIMwS2Fq+gEARkhTkg==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-dispatch": "1 - 3",
+        "d3-selection": "3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-ease": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-ease/-/d3-ease-3.0.1.tgz",
+      "integrity": "sha512-wR/XK3D3XcLIZwpbvQwQ5fK+8Ykds1ip7A2Txe0yxncXSdq1L9skcG7blcedkOX+ZcgxGAmLX1FrRGbADwzi0w==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-interpolate": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-3.0.1.tgz",
+      "integrity": "sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-color": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-selection": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-selection/-/d3-selection-3.0.0.tgz",
+      "integrity": "sha512-fmTRWbNMmsmWq6xJV8D19U/gw/bwrHfNXxrIN+HfZgnzqTHp9jOmKMhsTUjXOJnZOdZY9Q28y4yebKzqDKlxlQ==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-timer": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-timer/-/d3-timer-3.0.1.tgz",
+      "integrity": "sha512-ndfJ/JxxMd3nw31uyKoY2naivF+r29V+Lc0svZxe1JvvIRmi8hUsrMvdOwgS1o6uBHmiz91geQ0ylPP0aj1VUA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-transition": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-transition/-/d3-transition-3.0.1.tgz",
+      "integrity": "sha512-ApKvfjsSR6tg06xrL434C0WydLr7JewBB3V+/39RMHsaXTOG0zmt/OAXeng5M5LBm0ojmxJrpomQVZ1aPvBL4w==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-color": "1 - 3",
+        "d3-dispatch": "1 - 3",
+        "d3-ease": "1 - 3",
+        "d3-interpolate": "1 - 3",
+        "d3-timer": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "peerDependencies": {
+        "d3-selection": "2 - 3"
+      }
+    },
+    "node_modules/d3-zoom": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-zoom/-/d3-zoom-3.0.0.tgz",
+      "integrity": "sha512-b8AmV3kfQaqWAuacbPuNbL6vahnOJflOhexLzMMNLga62+/nh0JzvJ0aO/5a5MVgUFGS7Hu1P9P03o3fJkDCyw==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-dispatch": "1 - 3",
+        "d3-drag": "2 - 3",
+        "d3-interpolate": "1 - 3",
+        "d3-selection": "2 - 3",
+        "d3-transition": "2 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/debug": {
+      "version": "4.4.3",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
+      "integrity": "sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==",
+      "license": "MIT",
+      "dependencies": {
+        "ms": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/decode-named-character-reference": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/decode-named-character-reference/-/decode-named-character-reference-1.3.0.tgz",
+      "integrity": "sha512-GtpQYB283KrPp6nRw50q3U9/VfOutZOe103qlN7BPP6Ad27xYnOIWv4lPzo8HCAL+mMZofJ9KEy30fq6MfaK6Q==",
+      "license": "MIT",
+      "dependencies": {
+        "character-entities": "^2.0.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/dequal": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.3.tgz",
+      "integrity": "sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/detect-libc": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz",
+      "integrity": "sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/devlop": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/devlop/-/devlop-1.1.0.tgz",
+      "integrity": "sha512-RWmIqhcFf1lRYBvNmr7qTNuyCt/7/ns2jbpp1+PalgE/rDQcBT0fioSMUpJ93irlUhC5hrg4cYqe6U+0ImW0rA==",
+      "license": "MIT",
+      "dependencies": {
+        "dequal": "^2.0.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/error-stack-parser-es": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/error-stack-parser-es/-/error-stack-parser-es-1.0.5.tgz",
+      "integrity": "sha512-5qucVt2XcuGMcEGgWI7i+yZpmpByQ8J1lHhcL7PwqCwu9FPP3VUXzT4ltHe5i2z9dePwEHcDVOAfSnHsOlCXRA==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/esbuild": {
+      "version": "0.28.1",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.28.1.tgz",
+      "integrity": "sha512-HrJrvZv5ayxBzPfwphOoNzkzOIIlifzk0KJrGK2c8R4+LKpMtpYLQeUdjnwjWv/LZlkH2laZk+4w78pi99D4Vw==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "bin": {
+        "esbuild": "bin/esbuild"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "optionalDependencies": {
+        "@esbuild/aix-ppc64": "0.28.1",
+        "@esbuild/android-arm": "0.28.1",
+        "@esbuild/android-arm64": "0.28.1",
+        "@esbuild/android-x64": "0.28.1",
+        "@esbuild/darwin-arm64": "0.28.1",
+        "@esbuild/darwin-x64": "0.28.1",
+        "@esbuild/freebsd-arm64": "0.28.1",
+        "@esbuild/freebsd-x64": "0.28.1",
+        "@esbuild/linux-arm": "0.28.1",
+        "@esbuild/linux-arm64": "0.28.1",
+        "@esbuild/linux-ia32": "0.28.1",
+        "@esbuild/linux-loong64": "0.28.1",
+        "@esbuild/linux-mips64el": "0.28.1",
+        "@esbuild/linux-ppc64": "0.28.1",
+        "@esbuild/linux-riscv64": "0.28.1",
+        "@esbuild/linux-s390x": "0.28.1",
+        "@esbuild/linux-x64": "0.28.1",
+        "@esbuild/netbsd-arm64": "0.28.1",
+        "@esbuild/netbsd-x64": "0.28.1",
+        "@esbuild/openbsd-arm64": "0.28.1",
+        "@esbuild/openbsd-x64": "0.28.1",
+        "@esbuild/openharmony-arm64": "0.28.1",
+        "@esbuild/sunos-x64": "0.28.1",
+        "@esbuild/win32-arm64": "0.28.1",
+        "@esbuild/win32-ia32": "0.28.1",
+        "@esbuild/win32-x64": "0.28.1"
+      }
+    },
+    "node_modules/escape-string-regexp": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-5.0.0.tgz",
+      "integrity": "sha512-/veY75JbMK4j1yjvuUxuVsiS/hr/4iHs9FTT6cgTexxdE0Ly/glccBAkloH/DofkjRbZU3bnoj38mOmhkZ0lHw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/estree-util-is-identifier-name": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/estree-util-is-identifier-name/-/estree-util-is-identifier-name-3.0.0.tgz",
+      "integrity": "sha512-hFtqIDZTIUZ9BXLb8y4pYGyk6+wekIivNVTcmvk8NoOh+VeRn5y6cEHzbURrWbfp1fIqdVipilzj+lfaadNZmg==",
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/extend": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
+      "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==",
+      "license": "MIT"
+    },
+    "node_modules/fdir": {
+      "version": "6.5.0",
+      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
+      "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "peerDependencies": {
+        "picomatch": "^3 || ^4"
+      },
+      "peerDependenciesMeta": {
+        "picomatch": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/fsevents": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
+    "node_modules/hast-util-to-jsx-runtime": {
+      "version": "2.3.6",
+      "resolved": "https://registry.npmjs.org/hast-util-to-jsx-runtime/-/hast-util-to-jsx-runtime-2.3.6.tgz",
+      "integrity": "sha512-zl6s8LwNyo1P9uw+XJGvZtdFF1GdAkOg8ujOw+4Pyb76874fLps4ueHXDhXWdk6YHQ6OgUtinliG7RsYvCbbBg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "^1.0.0",
+        "@types/hast": "^3.0.0",
+        "@types/unist": "^3.0.0",
+        "comma-separated-tokens": "^2.0.0",
+        "devlop": "^1.0.0",
+        "estree-util-is-identifier-name": "^3.0.0",
+        "hast-util-whitespace": "^3.0.0",
+        "mdast-util-mdx-expression": "^2.0.0",
+        "mdast-util-mdx-jsx": "^3.0.0",
+        "mdast-util-mdxjs-esm": "^2.0.0",
+        "property-information": "^7.0.0",
+        "space-separated-tokens": "^2.0.0",
+        "style-to-js": "^1.0.0",
+        "unist-util-position": "^5.0.0",
+        "vfile-message": "^4.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/hast-util-whitespace": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/hast-util-whitespace/-/hast-util-whitespace-3.0.0.tgz",
+      "integrity": "sha512-88JUN06ipLwsnv+dVn+OIYOvAuvBMy/Qoi6O7mQHxdPXpjy+Cd6xRkWwux7DKO+4sYILtLBRIKgsdpS2gQc7qw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/html-url-attributes": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/html-url-attributes/-/html-url-attributes-3.0.1.tgz",
+      "integrity": "sha512-ol6UPyBWqsrO6EJySPz2O7ZSr856WDrEzM5zMqp+FJJLGMW35cLYmmZnl0vztAZxRUoNZJFTCohfjuIJ8I4QBQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/inline-style-parser": {
+      "version": "0.2.7",
+      "resolved": "https://registry.npmjs.org/inline-style-parser/-/inline-style-parser-0.2.7.tgz",
+      "integrity": "sha512-Nb2ctOyNR8DqQoR0OwRG95uNWIC0C1lCgf5Naz5H6Ji72KZ8OcFZLz2P5sNgwlyoJ8Yif11oMuYs5pBQa86csA==",
+      "license": "MIT"
+    },
+    "node_modules/is-alphabetical": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/is-alphabetical/-/is-alphabetical-2.0.1.tgz",
+      "integrity": "sha512-FWyyY60MeTNyeSRpkM2Iry0G9hpr7/9kD40mD/cGQEuilcZYS4okz8SN2Q6rLCJ8gbCt6fN+rC+6tMGS99LaxQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/is-alphanumerical": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/is-alphanumerical/-/is-alphanumerical-2.0.1.tgz",
+      "integrity": "sha512-hmbYhX/9MUMF5uh7tOXyK/n0ZvWpad5caBA17GsC6vyuCqaWliRG5K1qS9inmUhEMaOBIW7/whAnSwveW/LtZw==",
+      "license": "MIT",
+      "dependencies": {
+        "is-alphabetical": "^2.0.0",
+        "is-decimal": "^2.0.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/is-decimal": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/is-decimal/-/is-decimal-2.0.1.tgz",
+      "integrity": "sha512-AAB9hiomQs5DXWcRB1rqsxGUstbRroFOPPVAomNk/3XHR5JyEZChOyTWe2oayKnsSsr/kcGqF+z6yuH6HHpN0A==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/is-hexadecimal": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/is-hexadecimal/-/is-hexadecimal-2.0.1.tgz",
+      "integrity": "sha512-DgZQp241c8oO6cA1SbTEWiXeoxV42vlcJxgH+B3hi1AiqqKruZR3ZGF8In3fj4+/y/7rHvlOZLZtgJ/4ttYGZg==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/is-plain-obj": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-4.1.0.tgz",
+      "integrity": "sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/kleur": {
+      "version": "4.1.5",
+      "resolved": "https://registry.npmjs.org/kleur/-/kleur-4.1.5.tgz",
+      "integrity": "sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/lightningcss": {
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.33.0.tgz",
+      "integrity": "sha512-WkUDrojuJs0xkgGf2udWxa3yGBRxPtxUkB79i6aCZLRgc7PM8fZe9TosfPDcvEpQZbuFASnHYmRLBLUbmLOIIA==",
+      "dev": true,
+      "license": "MPL-2.0",
+      "dependencies": {
+        "detect-libc": "^2.0.3"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      },
+      "optionalDependencies": {
+        "lightningcss-android-arm64": "1.33.0",
+        "lightningcss-darwin-arm64": "1.33.0",
+        "lightningcss-darwin-x64": "1.33.0",
+        "lightningcss-freebsd-x64": "1.33.0",
+        "lightningcss-linux-arm-gnueabihf": "1.33.0",
+        "lightningcss-linux-arm64-gnu": "1.33.0",
+        "lightningcss-linux-arm64-musl": "1.33.0",
+        "lightningcss-linux-x64-gnu": "1.33.0",
+        "lightningcss-linux-x64-musl": "1.33.0",
+        "lightningcss-win32-arm64-msvc": "1.33.0",
+        "lightningcss-win32-x64-msvc": "1.33.0"
+      }
+    },
+    "node_modules/lightningcss-android-arm64": {
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-android-arm64/-/lightningcss-android-arm64-1.33.0.tgz",
+      "integrity": "sha512-gEpRTalKdosp4Bb8qWtc2iOgE5SeIHlpS1up9bFq2wAyYhl1UdTObYiHe98zEM9SQvSoqQZ1IQD0JNpg3Ml5pg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-darwin-arm64": {
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.33.0.tgz",
+      "integrity": "sha512-Sciaz8eenNTKn9b3t7+xr0ipTp9YxKQY4npwQ3mrRuL0BAVHBLyZxofhaKBAVtzmtRZ/zTyo0/to4B1uWG/Djg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-darwin-x64": {
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.33.0.tgz",
+      "integrity": "sha512-Z5UPAxzrjlWNNyGy6i65cJzzvgJ5D3T6wMvs+gWpY9d7qRhANrxqAp6LhxIgZhWEw18RfJTGcRxjuLIBr+m8XQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-freebsd-x64": {
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.33.0.tgz",
+      "integrity": "sha512-QQM/Ti/hQajJwCY+RiWuCZ9sdtI/XQk7nDK5vC8kkdwixezOlDgvDx7+RT+QjK6FcFT4MpsuoBnHIo/O3StRRg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm-gnueabihf": {
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.33.0.tgz",
+      "integrity": "sha512-N7FVBe6iS24MlM6R/4RBTxGhQheZGs7tiQ9U32UtF75NzP5Q7xWPRqLBCKxlRQRk3rY1jCIPLzx7WzOhuUIRLQ==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm64-gnu": {
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.33.0.tgz",
+      "integrity": "sha512-j2v/itmy4HlNxlc6voKXYgBqNi0Ng2LShg4z7GufpEgs05P+2suBVyi9I6YHq5uoVFx9ETin3eCEhLVyXGQnKg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm64-musl": {
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.33.0.tgz",
+      "integrity": "sha512-yiO5ROMuYQgXbC60yjZU5CYSFZGKXL0HFATXt9mHJn1+zW55oCtMI9NfcVhYLMFDL7gV7oBPon/EmMMGg2OvtQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "libc": [
+        "musl"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-x64-gnu": {
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.33.0.tgz",
+      "integrity": "sha512-ar+Ju7LmcN0Jo4FpL4hpFybwNG9/3A/Br5KW2n2jyODg3MEZXaDYADdemoNS+BDNfMgKvylJLj4S5tyRActuAg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "libc": [
+        "glibc"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-x64-musl": {
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.33.0.tgz",
+      "integrity": "sha512-RYiYbkokw0trfKqqzfF55lginwEPrD3OJDfTuJzFs1MK6iFnDenaz1fqLLtX4ITG3OktJQXOeTaw1awrBAlZPw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "libc": [
+        "musl"
+      ],
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-win32-arm64-msvc": {
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.33.0.tgz",
+      "integrity": "sha512-1K+MPfLSFVpphzpdbfkhlWk6wBrTObBzS2T6db10PNOZgR9GoVsAWzwNyuhUYYbTp23j+4RrncfujZ4uAzXvwA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-win32-x64-msvc": {
+      "version": "1.33.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.33.0.tgz",
+      "integrity": "sha512-OlEICDx/Xl0FqSp4bry8zFnCvGpig3Gl4gCquvYwHuqJKEC1+n9NgDniFvqHGmMv1ZkqDJrDqKKSykTDX+ehuA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/longest-streak": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/longest-streak/-/longest-streak-3.1.0.tgz",
+      "integrity": "sha512-9Ri+o0JYgehTaVBBDoMqIl8GXtbWg711O3srftcHhZ0dqnETqLaoIK0x17fUw9rFSlK/0NlsKe0Ahhyl5pXE2g==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/markdown-table": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/markdown-table/-/markdown-table-3.0.4.tgz",
+      "integrity": "sha512-wiYz4+JrLyb/DqW2hkFJxP7Vd7JuTDm77fvbM8VfEQdmSMqcImWeeRbHwZjBjIFki/VaMK2BhFi7oUUZeM5bqw==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/mdast-util-find-and-replace": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/mdast-util-find-and-replace/-/mdast-util-find-and-replace-3.0.2.tgz",
+      "integrity": "sha512-Tmd1Vg/m3Xz43afeNxDIhWRtFZgM2VLyaf4vSTYwudTyeuTneoL3qtWMA5jeLyz/O1vDJmmV4QuScFCA2tBPwg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "escape-string-regexp": "^5.0.0",
+        "unist-util-is": "^6.0.0",
+        "unist-util-visit-parents": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-from-markdown": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/mdast-util-from-markdown/-/mdast-util-from-markdown-2.0.3.tgz",
+      "integrity": "sha512-W4mAWTvSlKvf8L6J+VN9yLSqQ9AOAAvHuoDAmPkz4dHf553m5gVj2ejadHJhoJmcmxEnOv6Pa8XJhpxE93kb8Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "@types/unist": "^3.0.0",
+        "decode-named-character-reference": "^1.0.0",
+        "devlop": "^1.0.0",
+        "mdast-util-to-string": "^4.0.0",
+        "micromark": "^4.0.0",
+        "micromark-util-decode-numeric-character-reference": "^2.0.0",
+        "micromark-util-decode-string": "^2.0.0",
+        "micromark-util-normalize-identifier": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0",
+        "unist-util-stringify-position": "^4.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-gfm": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/mdast-util-gfm/-/mdast-util-gfm-3.1.0.tgz",
+      "integrity": "sha512-0ulfdQOM3ysHhCJ1p06l0b0VKlhU0wuQs3thxZQagjcjPrlFRqY215uZGHHJan9GEAXd9MbfPjFJz+qMkVR6zQ==",
+      "license": "MIT",
+      "dependencies": {
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-gfm-autolink-literal": "^2.0.0",
+        "mdast-util-gfm-footnote": "^2.0.0",
+        "mdast-util-gfm-strikethrough": "^2.0.0",
+        "mdast-util-gfm-table": "^2.0.0",
+        "mdast-util-gfm-task-list-item": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-gfm-autolink-literal": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/mdast-util-gfm-autolink-literal/-/mdast-util-gfm-autolink-literal-2.0.1.tgz",
+      "integrity": "sha512-5HVP2MKaP6L+G6YaxPNjuL0BPrq9orG3TsrZ9YXbA3vDw/ACI4MEsnoDpn6ZNm7GnZgtAcONJyPhOP8tNJQavQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "ccount": "^2.0.0",
+        "devlop": "^1.0.0",
+        "mdast-util-find-and-replace": "^3.0.0",
+        "micromark-util-character": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-gfm-footnote": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/mdast-util-gfm-footnote/-/mdast-util-gfm-footnote-2.1.0.tgz",
+      "integrity": "sha512-sqpDWlsHn7Ac9GNZQMeUzPQSMzR6Wv0WKRNvQRg0KqHh02fpTz69Qc1QSseNX29bhz1ROIyNyxExfawVKTm1GQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "devlop": "^1.1.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0",
+        "micromark-util-normalize-identifier": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-gfm-strikethrough": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/mdast-util-gfm-strikethrough/-/mdast-util-gfm-strikethrough-2.0.0.tgz",
+      "integrity": "sha512-mKKb915TF+OC5ptj5bJ7WFRPdYtuHv0yTRxK2tJvi+BDqbkiG7h7u/9SI89nRAYcmap2xHQL9D+QG/6wSrTtXg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-gfm-table": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/mdast-util-gfm-table/-/mdast-util-gfm-table-2.0.0.tgz",
+      "integrity": "sha512-78UEvebzz/rJIxLvE7ZtDd/vIQ0RHv+3Mh5DR96p7cS7HsBhYIICDBCu8csTNWNO6tBWfqXPWekRuj2FNOGOZg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "devlop": "^1.0.0",
+        "markdown-table": "^3.0.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-gfm-task-list-item": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/mdast-util-gfm-task-list-item/-/mdast-util-gfm-task-list-item-2.0.0.tgz",
+      "integrity": "sha512-IrtvNvjxC1o06taBAVJznEnkiHxLFTzgonUdy8hzFVeDun0uTjxxrRGVaNFqkU1wJR3RBPEfsxmU6jDWPofrTQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "devlop": "^1.0.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-mdx-expression": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/mdast-util-mdx-expression/-/mdast-util-mdx-expression-2.0.1.tgz",
+      "integrity": "sha512-J6f+9hUp+ldTZqKRSg7Vw5V6MqjATc+3E4gf3CFNcuZNWD8XdyI6zQ8GqH7f8169MM6P7hMBRDVGnn7oHB9kXQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree-jsx": "^1.0.0",
+        "@types/hast": "^3.0.0",
+        "@types/mdast": "^4.0.0",
+        "devlop": "^1.0.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-mdx-jsx": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/mdast-util-mdx-jsx/-/mdast-util-mdx-jsx-3.2.0.tgz",
+      "integrity": "sha512-lj/z8v0r6ZtsN/cGNNtemmmfoLAFZnjMbNyLzBafjzikOM+glrjNHPlf6lQDOTccj9n5b0PPihEBbhneMyGs1Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree-jsx": "^1.0.0",
+        "@types/hast": "^3.0.0",
+        "@types/mdast": "^4.0.0",
+        "@types/unist": "^3.0.0",
+        "ccount": "^2.0.0",
+        "devlop": "^1.1.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0",
+        "parse-entities": "^4.0.0",
+        "stringify-entities": "^4.0.0",
+        "unist-util-stringify-position": "^4.0.0",
+        "vfile-message": "^4.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-mdxjs-esm": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/mdast-util-mdxjs-esm/-/mdast-util-mdxjs-esm-2.0.1.tgz",
+      "integrity": "sha512-EcmOpxsZ96CvlP03NghtH1EsLtr0n9Tm4lPUJUBccV9RwUOneqSycg19n5HGzCf+10LozMRSObtVr3ee1WoHtg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree-jsx": "^1.0.0",
+        "@types/hast": "^3.0.0",
+        "@types/mdast": "^4.0.0",
+        "devlop": "^1.0.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "mdast-util-to-markdown": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-phrasing": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/mdast-util-phrasing/-/mdast-util-phrasing-4.1.0.tgz",
+      "integrity": "sha512-TqICwyvJJpBwvGAMZjj4J2n0X8QWp21b9l0o7eXyVJ25YNWYbJDVIyD1bZXE6WtV6RmKJVYmQAKWa0zWOABz2w==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "unist-util-is": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-to-hast": {
+      "version": "13.2.1",
+      "resolved": "https://registry.npmjs.org/mdast-util-to-hast/-/mdast-util-to-hast-13.2.1.tgz",
+      "integrity": "sha512-cctsq2wp5vTsLIcaymblUriiTcZd0CwWtCbLvrOzYCDZoWyMNV8sZ7krj09FSnsiJi3WVsHLM4k6Dq/yaPyCXA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "@types/mdast": "^4.0.0",
+        "@ungap/structured-clone": "^1.0.0",
+        "devlop": "^1.0.0",
+        "micromark-util-sanitize-uri": "^2.0.0",
+        "trim-lines": "^3.0.0",
+        "unist-util-position": "^5.0.0",
+        "unist-util-visit": "^5.0.0",
+        "vfile": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-to-markdown": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/mdast-util-to-markdown/-/mdast-util-to-markdown-2.1.2.tgz",
+      "integrity": "sha512-xj68wMTvGXVOKonmog6LwyJKrYXZPvlwabaryTjLh9LuvovB/KAH+kvi8Gjj+7rJjsFi23nkUxRQv1KqSroMqA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "@types/unist": "^3.0.0",
+        "longest-streak": "^3.0.0",
+        "mdast-util-phrasing": "^4.0.0",
+        "mdast-util-to-string": "^4.0.0",
+        "micromark-util-classify-character": "^2.0.0",
+        "micromark-util-decode-string": "^2.0.0",
+        "unist-util-visit": "^5.0.0",
+        "zwitch": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/mdast-util-to-string": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/mdast-util-to-string/-/mdast-util-to-string-4.0.0.tgz",
+      "integrity": "sha512-0H44vDimn51F0YwvxSJSm0eCDOJTRlmN0R1yBh4HLj9wiV1Dn0QoXGbvFAWj2hSItVTlCmBF1hqKlIyUBVFLPg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/micromark/-/micromark-4.0.2.tgz",
+      "integrity": "sha512-zpe98Q6kvavpCr1NPVSCMebCKfD7CA2NqZ+rykeNhONIJBpc1tFKt9hucLGwha3jNTNI8lHpctWJWoimVF4PfA==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@types/debug": "^4.0.0",
+        "debug": "^4.0.0",
+        "decode-named-character-reference": "^1.0.0",
+        "devlop": "^1.0.0",
+        "micromark-core-commonmark": "^2.0.0",
+        "micromark-factory-space": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-chunked": "^2.0.0",
+        "micromark-util-combine-extensions": "^2.0.0",
+        "micromark-util-decode-numeric-character-reference": "^2.0.0",
+        "micromark-util-encode": "^2.0.0",
+        "micromark-util-normalize-identifier": "^2.0.0",
+        "micromark-util-resolve-all": "^2.0.0",
+        "micromark-util-sanitize-uri": "^2.0.0",
+        "micromark-util-subtokenize": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-core-commonmark": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/micromark-core-commonmark/-/micromark-core-commonmark-2.0.3.tgz",
+      "integrity": "sha512-RDBrHEMSxVFLg6xvnXmb1Ayr2WzLAWjeSATAoxwKYJV94TeNavgoIdA0a9ytzDSVzBy2YKFK+emCPOEibLeCrg==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "decode-named-character-reference": "^1.0.0",
+        "devlop": "^1.0.0",
+        "micromark-factory-destination": "^2.0.0",
+        "micromark-factory-label": "^2.0.0",
+        "micromark-factory-space": "^2.0.0",
+        "micromark-factory-title": "^2.0.0",
+        "micromark-factory-whitespace": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-chunked": "^2.0.0",
+        "micromark-util-classify-character": "^2.0.0",
+        "micromark-util-html-tag-name": "^2.0.0",
+        "micromark-util-normalize-identifier": "^2.0.0",
+        "micromark-util-resolve-all": "^2.0.0",
+        "micromark-util-subtokenize": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-extension-gfm": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/micromark-extension-gfm/-/micromark-extension-gfm-3.0.0.tgz",
+      "integrity": "sha512-vsKArQsicm7t0z2GugkCKtZehqUm31oeGBV/KVSorWSy8ZlNAv7ytjFhvaryUiCUJYqs+NoE6AFhpQvBTM6Q4w==",
+      "license": "MIT",
+      "dependencies": {
+        "micromark-extension-gfm-autolink-literal": "^2.0.0",
+        "micromark-extension-gfm-footnote": "^2.0.0",
+        "micromark-extension-gfm-strikethrough": "^2.0.0",
+        "micromark-extension-gfm-table": "^2.0.0",
+        "micromark-extension-gfm-tagfilter": "^2.0.0",
+        "micromark-extension-gfm-task-list-item": "^2.0.0",
+        "micromark-util-combine-extensions": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark-extension-gfm-autolink-literal": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/micromark-extension-gfm-autolink-literal/-/micromark-extension-gfm-autolink-literal-2.1.0.tgz",
+      "integrity": "sha512-oOg7knzhicgQ3t4QCjCWgTmfNhvQbDDnJeVu9v81r7NltNCVmhPy1fJRX27pISafdjL+SVc4d3l48Gb6pbRypw==",
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-sanitize-uri": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark-extension-gfm-footnote": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/micromark-extension-gfm-footnote/-/micromark-extension-gfm-footnote-2.1.0.tgz",
+      "integrity": "sha512-/yPhxI1ntnDNsiHtzLKYnE3vf9JZ6cAisqVDauhp4CEHxlb4uoOTxOCJ+9s51bIB8U1N1FJ1RXOKTIlD5B/gqw==",
+      "license": "MIT",
+      "dependencies": {
+        "devlop": "^1.0.0",
+        "micromark-core-commonmark": "^2.0.0",
+        "micromark-factory-space": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-normalize-identifier": "^2.0.0",
+        "micromark-util-sanitize-uri": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark-extension-gfm-strikethrough": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/micromark-extension-gfm-strikethrough/-/micromark-extension-gfm-strikethrough-2.1.0.tgz",
+      "integrity": "sha512-ADVjpOOkjz1hhkZLlBiYA9cR2Anf8F4HqZUO6e5eDcPQd0Txw5fxLzzxnEkSkfnD0wziSGiv7sYhk/ktvbf1uw==",
+      "license": "MIT",
+      "dependencies": {
+        "devlop": "^1.0.0",
+        "micromark-util-chunked": "^2.0.0",
+        "micromark-util-classify-character": "^2.0.0",
+        "micromark-util-resolve-all": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark-extension-gfm-table": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/micromark-extension-gfm-table/-/micromark-extension-gfm-table-2.1.1.tgz",
+      "integrity": "sha512-t2OU/dXXioARrC6yWfJ4hqB7rct14e8f7m0cbI5hUmDyyIlwv5vEtooptH8INkbLzOatzKuVbQmAYcbWoyz6Dg==",
+      "license": "MIT",
+      "dependencies": {
+        "devlop": "^1.0.0",
+        "micromark-factory-space": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark-extension-gfm-tagfilter": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/micromark-extension-gfm-tagfilter/-/micromark-extension-gfm-tagfilter-2.0.0.tgz",
+      "integrity": "sha512-xHlTOmuCSotIA8TW1mDIM6X2O1SiX5P9IuDtqGonFhEK0qgRI4yeC6vMxEV2dgyr2TiD+2PQ10o+cOhdVAcwfg==",
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-types": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark-extension-gfm-task-list-item": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/micromark-extension-gfm-task-list-item/-/micromark-extension-gfm-task-list-item-2.1.0.tgz",
+      "integrity": "sha512-qIBZhqxqI6fjLDYFTBIa4eivDMnP+OZqsNwmQ3xNLE4Cxwc+zfQEfbs6tzAo2Hjq+bh6q5F+Z8/cksrLFYWQQw==",
+      "license": "MIT",
+      "dependencies": {
+        "devlop": "^1.0.0",
+        "micromark-factory-space": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/micromark-factory-destination": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-factory-destination/-/micromark-factory-destination-2.0.1.tgz",
+      "integrity": "sha512-Xe6rDdJlkmbFRExpTOmRj9N3MaWmbAgdpSrBQvCFqhezUn4AHqJHbaEnfbVYYiexVSs//tqOdY/DxhjdCiJnIA==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-factory-label": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-factory-label/-/micromark-factory-label-2.0.1.tgz",
+      "integrity": "sha512-VFMekyQExqIW7xIChcXn4ok29YE3rnuyveW3wZQWWqF4Nv9Wk5rgJ99KzPvHjkmPXF93FXIbBp6YdW3t71/7Vg==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "devlop": "^1.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-factory-space": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-factory-space/-/micromark-factory-space-2.0.1.tgz",
+      "integrity": "sha512-zRkxjtBxxLd2Sc0d+fbnEunsTj46SWXgXciZmHq0kDYGnck/ZSGj9/wULTV95uoeYiK5hRXP2mJ98Uo4cq/LQg==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-factory-title": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-factory-title/-/micromark-factory-title-2.0.1.tgz",
+      "integrity": "sha512-5bZ+3CjhAd9eChYTHsjy6TGxpOFSKgKKJPJxr293jTbfry2KDoWkhBb6TcPVB4NmzaPhMs1Frm9AZH7OD4Cjzw==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-factory-space": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-factory-whitespace": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-factory-whitespace/-/micromark-factory-whitespace-2.0.1.tgz",
+      "integrity": "sha512-Ob0nuZ3PKt/n0hORHyvoD9uZhr+Za8sFoP+OnMcnWK5lngSzALgQYKMr9RJVOWLqQYuyn6ulqGWSXdwf6F80lQ==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-factory-space": "^2.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-character": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/micromark-util-character/-/micromark-util-character-2.1.1.tgz",
+      "integrity": "sha512-wv8tdUTJ3thSFFFJKtpYKOYiGP2+v96Hvk4Tu8KpCAsTMs6yi+nVmGh1syvSCsaxz45J6Jbw+9DD6g97+NV67Q==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-chunked": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-util-chunked/-/micromark-util-chunked-2.0.1.tgz",
+      "integrity": "sha512-QUNFEOPELfmvv+4xiNg2sRYeS/P84pTW0TCgP5zc9FpXetHY0ab7SxKyAQCNCc1eK0459uoLI1y5oO5Vc1dbhA==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-symbol": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-classify-character": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-util-classify-character/-/micromark-util-classify-character-2.0.1.tgz",
+      "integrity": "sha512-K0kHzM6afW/MbeWYWLjoHQv1sgg2Q9EccHEDzSkxiP/EaagNzCm7T/WMKZ3rjMbvIpvBiZgwR3dKMygtA4mG1Q==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-combine-extensions": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-util-combine-extensions/-/micromark-util-combine-extensions-2.0.1.tgz",
+      "integrity": "sha512-OnAnH8Ujmy59JcyZw8JSbK9cGpdVY44NKgSM7E9Eh7DiLS2E9RNQf0dONaGDzEG9yjEl5hcqeIsj4hfRkLH/Bg==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-chunked": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-decode-numeric-character-reference": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/micromark-util-decode-numeric-character-reference/-/micromark-util-decode-numeric-character-reference-2.0.2.tgz",
+      "integrity": "sha512-ccUbYk6CwVdkmCQMyr64dXz42EfHGkPQlBj5p7YVGzq8I7CtjXZJrubAYezf7Rp+bjPseiROqe7G6foFd+lEuw==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-symbol": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-decode-string": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-util-decode-string/-/micromark-util-decode-string-2.0.1.tgz",
+      "integrity": "sha512-nDV/77Fj6eH1ynwscYTOsbK7rR//Uj0bZXBwJZRfaLEJ1iGBR6kIfNmlNqaqJf649EP0F3NWNdeJi03elllNUQ==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "decode-named-character-reference": "^1.0.0",
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-decode-numeric-character-reference": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-encode": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-util-encode/-/micromark-util-encode-2.0.1.tgz",
+      "integrity": "sha512-c3cVx2y4KqUnwopcO9b/SCdo2O67LwJJ/UyqGfbigahfegL9myoEFoDYZgkT7f36T0bLrM9hZTAaAyH+PCAXjw==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/micromark-util-html-tag-name": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-util-html-tag-name/-/micromark-util-html-tag-name-2.0.1.tgz",
+      "integrity": "sha512-2cNEiYDhCWKI+Gs9T0Tiysk136SnR13hhO8yW6BGNyhOC4qYFnwF1nKfD3HFAIXA5c45RrIG1ub11GiXeYd1xA==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/micromark-util-normalize-identifier": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-util-normalize-identifier/-/micromark-util-normalize-identifier-2.0.1.tgz",
+      "integrity": "sha512-sxPqmo70LyARJs0w2UclACPUUEqltCkJ6PhKdMIDuJ3gSf/Q+/GIe3WKl0Ijb/GyH9lOpUkRAO2wp0GVkLvS9Q==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-symbol": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-resolve-all": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-util-resolve-all/-/micromark-util-resolve-all-2.0.1.tgz",
+      "integrity": "sha512-VdQyxFWFT2/FGJgwQnJYbe1jjQoNTS4RjglmSjTUlpUMa95Htx9NHeYW4rGDJzbjvCsl9eLjMQwGeElsqmzcHg==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-sanitize-uri": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-util-sanitize-uri/-/micromark-util-sanitize-uri-2.0.1.tgz",
+      "integrity": "sha512-9N9IomZ/YuGGZZmQec1MbgxtlgougxTodVwDzzEouPKo3qFWvymFHWcnDi2vzV1ff6kas9ucW+o3yzJK9YB1AQ==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "micromark-util-character": "^2.0.0",
+        "micromark-util-encode": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-subtokenize": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/micromark-util-subtokenize/-/micromark-util-subtokenize-2.1.0.tgz",
+      "integrity": "sha512-XQLu552iSctvnEcgXw6+Sx75GflAPNED1qx7eBJ+wydBb2KCbRZe+NwvIEEMM83uml1+2WSXpBAcp9IUCgCYWA==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "devlop": "^1.0.0",
+        "micromark-util-chunked": "^2.0.0",
+        "micromark-util-symbol": "^2.0.0",
+        "micromark-util-types": "^2.0.0"
+      }
+    },
+    "node_modules/micromark-util-symbol": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/micromark-util-symbol/-/micromark-util-symbol-2.0.1.tgz",
+      "integrity": "sha512-vs5t8Apaud9N28kgCrRUdEed4UJ+wWNvicHLPxCa9ENlYuAY31M0ETy5y1vA33YoNPDFTghEbnh6efaE8h4x0Q==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/micromark-util-types": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/micromark-util-types/-/micromark-util-types-2.0.2.tgz",
+      "integrity": "sha512-Yw0ECSpJoViF1qTU4DC6NwtC4aWGt1EkzaQB8KPPyCRR8z9TWeV0HbEFGTO+ZY1wB22zmxnJqhPyTpOVCpeHTA==",
+      "funding": [
+        {
+          "type": "GitHub Sponsors",
+          "url": "https://github.com/sponsors/unifiedjs"
+        },
+        {
+          "type": "OpenCollective",
+          "url": "https://opencollective.com/unified"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/miniflare": {
+      "version": "4.20260722.0",
+      "resolved": "https://registry.npmjs.org/miniflare/-/miniflare-4.20260722.0.tgz",
+      "integrity": "sha512-LW6ABMhCx/yIEFBLC/DO4yAhdm2T/G7jp7pr5T2kj895+CCIaHZqpMXdW9O6YE48LcYcCJChwWc8aEs1vpbTXw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@cspotcode/source-map-support": "0.8.1",
+        "sharp": "0.35.2",
+        "undici": "7.28.0",
+        "workerd": "1.20260722.1",
+        "ws": "8.21.0",
+        "youch": "4.1.0-beta.10"
+      },
+      "bin": {
+        "miniflare": "bootstrap.js"
+      },
+      "engines": {
+        "node": ">=22.0.0"
+      }
+    },
+    "node_modules/ms": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
+      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
+      "license": "MIT"
+    },
+    "node_modules/nanoid": {
+      "version": "3.3.16",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.16.tgz",
+      "integrity": "sha512-bzlKTyNJ7+LdGIIwy8ijFpIqEQIvafahV7eYykJ8Cvh42EdJeODoJ6gUJXpQJvej1BddH8OqTXZNE/KfbWAu8Q==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "bin": {
+        "nanoid": "bin/nanoid.cjs"
+      },
+      "engines": {
+        "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
+      }
+    },
+    "node_modules/parse-entities": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/parse-entities/-/parse-entities-4.0.2.tgz",
+      "integrity": "sha512-GG2AQYWoLgL877gQIKeRPGO1xF9+eG1ujIb5soS5gPvLQ1y2o8FL90w2QWNdf9I361Mpp7726c+lj3U0qK1uGw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^2.0.0",
+        "character-entities-legacy": "^3.0.0",
+        "character-reference-invalid": "^2.0.0",
+        "decode-named-character-reference": "^1.0.0",
+        "is-alphanumerical": "^2.0.0",
+        "is-decimal": "^2.0.0",
+        "is-hexadecimal": "^2.0.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/parse-entities/node_modules/@types/unist": {
+      "version": "2.0.11",
+      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-2.0.11.tgz",
+      "integrity": "sha512-CmBKiL6NNo/OqgmMn95Fk9Whlp2mtvIv+KNpQKN2F4SjvrEesubTRWGYSg+BnWZOnlCaSTU1sMpsBOzgbYhnsA==",
+      "license": "MIT"
+    },
+    "node_modules/path-to-regexp": {
+      "version": "6.3.0",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-6.3.0.tgz",
+      "integrity": "sha512-Yhpw4T9C6hPpgPeA28us07OJeqZ5EzQTkbfwuhsUg0c237RomFoETJgmp2sa3F/41gfLE6G5cqcYwznmeEeOlQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/pathe": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/pathe/-/pathe-2.0.3.tgz",
+      "integrity": "sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/picocolors": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
+      "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/picomatch": {
+      "version": "4.0.5",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.5.tgz",
+      "integrity": "sha512-RvwwcruNjI1ncT5xRakeyS9Lf8lcItv34KD+aif+VH9kduAyfYBipGh12274xtenIPZ119/R9BdTBa8gAwSh0A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/postcss": {
+      "version": "8.5.20",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.20.tgz",
+      "integrity": "sha512-lW616l85ucIQL+FocMmL7pQFPqBmwejrCMg+iPxyImlrANNJG9NHq/RkyCZopDhd8C3LA03PHRJDjkbGu8vvug==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/postcss"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "nanoid": "^3.3.16",
+        "picocolors": "^1.1.1",
+        "source-map-js": "^1.2.1"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >=14"
+      }
+    },
+    "node_modules/property-information": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/property-information/-/property-information-7.2.0.tgz",
+      "integrity": "sha512-IAtzIB6sUiWaJYrX9smp3V46pBGbBeLFRGdh25kg1334VcBlD8HzhPeNIWQH9zhGmo2itIe25EHt9dQP7G5hmg==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/react": {
+      "version": "19.2.7",
+      "resolved": "https://registry.npmjs.org/react/-/react-19.2.7.tgz",
+      "integrity": "sha512-HNe9WslTbXmFK8o8cmwgAeJFSBvt1bPdHCVKtaaV+WlAN36mpT4hcRpwbf3fY56ar2oIXzsBpOAiIRHAdY0OlQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/react-dom": {
+      "version": "19.2.7",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.7.tgz",
+      "integrity": "sha512-t0BRVXvbiE/o20Hfw669rLbMCDWtYZLvmJigy2f0MxsXF+71pxhR3xOkspmsO8h3ZlNzyibAmtCa3l4lYKk6gQ==",
+      "license": "MIT",
+      "dependencies": {
+        "scheduler": "^0.27.0"
+      },
+      "peerDependencies": {
+        "react": "^19.2.7"
+      }
+    },
+    "node_modules/react-markdown": {
+      "version": "10.1.0",
+      "resolved": "https://registry.npmjs.org/react-markdown/-/react-markdown-10.1.0.tgz",
+      "integrity": "sha512-qKxVopLT/TyA6BX3Ue5NwabOsAzm0Q7kAPwq6L+wWDwisYs7R8vZ0nRXqq6rkueboxpkjvLGU9fWifiX/ZZFxQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "@types/mdast": "^4.0.0",
+        "devlop": "^1.0.0",
+        "hast-util-to-jsx-runtime": "^2.0.0",
+        "html-url-attributes": "^3.0.0",
+        "mdast-util-to-hast": "^13.0.0",
+        "remark-parse": "^11.0.0",
+        "remark-rehype": "^11.0.0",
+        "unified": "^11.0.0",
+        "unist-util-visit": "^5.0.0",
+        "vfile": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      },
+      "peerDependencies": {
+        "@types/react": ">=18",
+        "react": ">=18"
+      }
+    },
+    "node_modules/remark-gfm": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/remark-gfm/-/remark-gfm-4.0.1.tgz",
+      "integrity": "sha512-1quofZ2RQ9EWdeN34S79+KExV1764+wCUGop5CPL1WGdD0ocPpu91lzPGbwWMECpEpd42kJGQwzRfyov9j4yNg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "mdast-util-gfm": "^3.0.0",
+        "micromark-extension-gfm": "^3.0.0",
+        "remark-parse": "^11.0.0",
+        "remark-stringify": "^11.0.0",
+        "unified": "^11.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/remark-parse": {
+      "version": "11.0.0",
+      "resolved": "https://registry.npmjs.org/remark-parse/-/remark-parse-11.0.0.tgz",
+      "integrity": "sha512-FCxlKLNGknS5ba/1lmpYijMUzX2esxW5xQqjWxw2eHFfS2MSdaHVINFmhjo+qN1WhZhNimq0dZATN9pH0IDrpA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "mdast-util-from-markdown": "^2.0.0",
+        "micromark-util-types": "^2.0.0",
+        "unified": "^11.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/remark-rehype": {
+      "version": "11.1.2",
+      "resolved": "https://registry.npmjs.org/remark-rehype/-/remark-rehype-11.1.2.tgz",
+      "integrity": "sha512-Dh7l57ianaEoIpzbp0PC9UKAdCSVklD8E5Rpw7ETfbTl3FqcOOgq5q2LVDhgGCkaBv7p24JXikPdvhhmHvKMsw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "@types/mdast": "^4.0.0",
+        "mdast-util-to-hast": "^13.0.0",
+        "unified": "^11.0.0",
+        "vfile": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/remark-stringify": {
+      "version": "11.0.0",
+      "resolved": "https://registry.npmjs.org/remark-stringify/-/remark-stringify-11.0.0.tgz",
+      "integrity": "sha512-1OSmLd3awB/t8qdoEOMazZkNsfVTeY4fTsgzcQFdXNq8ToTN4ZGwrMnlda4K6smTFKD+GRV6O48i6Z4iKgPPpw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "mdast-util-to-markdown": "^2.0.0",
+        "unified": "^11.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/rolldown": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/rolldown/-/rolldown-1.1.5.tgz",
+      "integrity": "sha512-t9z29cJjXf/vxQ8dyhCSpt6H6aSwHTk8cT5I3iy6SMXuFpk5mB6PL6XfC8PCwrPTx93udwKUm9HRteAlTGBLiA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@oxc-project/types": "=0.139.0",
+        "@rolldown/pluginutils": "^1.0.0"
+      },
+      "bin": {
+        "rolldown": "bin/cli.mjs"
+      },
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      },
+      "optionalDependencies": {
+        "@rolldown/binding-android-arm64": "1.1.5",
+        "@rolldown/binding-darwin-arm64": "1.1.5",
+        "@rolldown/binding-darwin-x64": "1.1.5",
+        "@rolldown/binding-freebsd-x64": "1.1.5",
+        "@rolldown/binding-linux-arm-gnueabihf": "1.1.5",
+        "@rolldown/binding-linux-arm64-gnu": "1.1.5",
+        "@rolldown/binding-linux-arm64-musl": "1.1.5",
+        "@rolldown/binding-linux-ppc64-gnu": "1.1.5",
+        "@rolldown/binding-linux-s390x-gnu": "1.1.5",
+        "@rolldown/binding-linux-x64-gnu": "1.1.5",
+        "@rolldown/binding-linux-x64-musl": "1.1.5",
+        "@rolldown/binding-openharmony-arm64": "1.1.5",
+        "@rolldown/binding-wasm32-wasi": "1.1.5",
+        "@rolldown/binding-win32-arm64-msvc": "1.1.5",
+        "@rolldown/binding-win32-x64-msvc": "1.1.5"
+      }
+    },
+    "node_modules/scheduler": {
+      "version": "0.27.0",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.27.0.tgz",
+      "integrity": "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==",
+      "license": "MIT"
+    },
+    "node_modules/semver": {
+      "version": "7.8.5",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.5.tgz",
+      "integrity": "sha512-Y7/KDsb8LjooZpwaqGyulO6DQlksgCncchHGk+sZIY4SBvUocMBEFH5Ur1fI4dV+Jvl0w6cjvucaIi40puRioA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/sharp": {
+      "version": "0.35.2",
+      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.35.2.tgz",
+      "integrity": "sha512-FVtFjtBCMiJS6yb5CX7Sop45WFMpeGw6oRKuJnXYgf/f1ms/D7LE/ZUSNxnW7rZ/dbslQWYkoqFHGPaDBtaK4w==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@img/colour": "^1.1.0",
+        "detect-libc": "^2.1.2",
+        "semver": "^7.8.4"
+      },
+      "engines": {
+        "node": ">=20.9.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/libvips"
+      },
+      "optionalDependencies": {
+        "@img/sharp-darwin-arm64": "0.35.2",
+        "@img/sharp-darwin-x64": "0.35.2",
+        "@img/sharp-freebsd-wasm32": "0.35.2",
+        "@img/sharp-libvips-darwin-arm64": "1.3.1",
+        "@img/sharp-libvips-darwin-x64": "1.3.1",
+        "@img/sharp-libvips-linux-arm": "1.3.1",
+        "@img/sharp-libvips-linux-arm64": "1.3.1",
+        "@img/sharp-libvips-linux-ppc64": "1.3.1",
+        "@img/sharp-libvips-linux-riscv64": "1.3.1",
+        "@img/sharp-libvips-linux-s390x": "1.3.1",
+        "@img/sharp-libvips-linux-x64": "1.3.1",
+        "@img/sharp-libvips-linuxmusl-arm64": "1.3.1",
+        "@img/sharp-libvips-linuxmusl-x64": "1.3.1",
+        "@img/sharp-linux-arm": "0.35.2",
+        "@img/sharp-linux-arm64": "0.35.2",
+        "@img/sharp-linux-ppc64": "0.35.2",
+        "@img/sharp-linux-riscv64": "0.35.2",
+        "@img/sharp-linux-s390x": "0.35.2",
+        "@img/sharp-linux-x64": "0.35.2",
+        "@img/sharp-linuxmusl-arm64": "0.35.2",
+        "@img/sharp-linuxmusl-x64": "0.35.2",
+        "@img/sharp-webcontainers-wasm32": "0.35.2",
+        "@img/sharp-win32-arm64": "0.35.2",
+        "@img/sharp-win32-ia32": "0.35.2",
+        "@img/sharp-win32-x64": "0.35.2"
+      }
+    },
+    "node_modules/source-map-js": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
+      "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/space-separated-tokens": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/space-separated-tokens/-/space-separated-tokens-2.0.2.tgz",
+      "integrity": "sha512-PEGlAwrG8yXGXRjW32fGbg66JAlOAwbObuqVoJpv/mRgoWDQfgH1wDPvtzWyUSNAXBGSk8h755YDbbcEy3SH2Q==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/stringify-entities": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/stringify-entities/-/stringify-entities-4.0.4.tgz",
+      "integrity": "sha512-IwfBptatlO+QCJUo19AqvrPNqlVMpW9YEL2LIVY+Rpv2qsjCGxaDLNRgeGsQWJhfItebuJhsGSLjaBbNSQ+ieg==",
+      "license": "MIT",
+      "dependencies": {
+        "character-entities-html4": "^2.0.0",
+        "character-entities-legacy": "^3.0.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/style-to-js": {
+      "version": "1.1.21",
+      "resolved": "https://registry.npmjs.org/style-to-js/-/style-to-js-1.1.21.tgz",
+      "integrity": "sha512-RjQetxJrrUJLQPHbLku6U/ocGtzyjbJMP9lCNK7Ag0CNh690nSH8woqWH9u16nMjYBAok+i7JO1NP2pOy8IsPQ==",
+      "license": "MIT",
+      "dependencies": {
+        "style-to-object": "1.0.14"
+      }
+    },
+    "node_modules/style-to-object": {
+      "version": "1.0.14",
+      "resolved": "https://registry.npmjs.org/style-to-object/-/style-to-object-1.0.14.tgz",
+      "integrity": "sha512-LIN7rULI0jBscWQYaSswptyderlarFkjQ+t79nzty8tcIAceVomEVlLzH5VP4Cmsv6MtKhs7qaAiwlcp+Mgaxw==",
+      "license": "MIT",
+      "dependencies": {
+        "inline-style-parser": "0.2.7"
+      }
+    },
+    "node_modules/supports-color": {
+      "version": "10.2.2",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-10.2.2.tgz",
+      "integrity": "sha512-SS+jx45GF1QjgEXQx4NJZV9ImqmO2NPz5FNsIHrsDjh2YsHnawpan7SNQ1o8NuhrbHZy9AZhIoCUiCeaW/C80g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/supports-color?sponsor=1"
+      }
+    },
+    "node_modules/tinyglobby": {
+      "version": "0.2.17",
+      "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.17.tgz",
+      "integrity": "sha512-wXR/dYpcqKmfWpEdZjiKJOwCNFndD0DMnrW/cYjVGttEkBfVgcLFHoNrlj47mjOVic9yyNu65alsgF4NQyTa2g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fdir": "^6.5.0",
+        "picomatch": "^4.0.4"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/SuperchupuDev"
+      }
+    },
+    "node_modules/trim-lines": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/trim-lines/-/trim-lines-3.0.1.tgz",
+      "integrity": "sha512-kRj8B+YHZCc9kQYdWfJB2/oUl9rA99qbowYYBtr4ui4mZyAQ2JpvVBd/6U2YloATfqBhBTSMhTpgBHtU0Mf3Rg==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/trough": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/trough/-/trough-2.2.0.tgz",
+      "integrity": "sha512-tmMpK00BjZiUyVyvrBK7knerNgmgvcV/KLVyuma/SC+TQN167GrMRciANTz09+k3zW8L8t60jWO1GpfkZdjTaw==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/tslib": {
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
+      "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
+      "dev": true,
+      "license": "0BSD",
+      "optional": true
+    },
+    "node_modules/typescript": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-7.0.2.tgz",
+      "integrity": "sha512-8FYau96o3NKOhbjKi/qNvG/W5jhzxkbdm5sj9AbZ/5T5sWqn3hJgLfGx27sRKZWTvyzCP8dLRBTf5tBTSRVUNA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "tsc": "bin/tsc"
+      },
+      "engines": {
+        "node": ">=16.20.0"
+      },
+      "optionalDependencies": {
+        "@typescript/typescript-aix-ppc64": "7.0.2",
+        "@typescript/typescript-darwin-arm64": "7.0.2",
+        "@typescript/typescript-darwin-x64": "7.0.2",
+        "@typescript/typescript-freebsd-arm64": "7.0.2",
+        "@typescript/typescript-freebsd-x64": "7.0.2",
+        "@typescript/typescript-linux-arm": "7.0.2",
+        "@typescript/typescript-linux-arm64": "7.0.2",
+        "@typescript/typescript-linux-loong64": "7.0.2",
+        "@typescript/typescript-linux-mips64el": "7.0.2",
+        "@typescript/typescript-linux-ppc64": "7.0.2",
+        "@typescript/typescript-linux-riscv64": "7.0.2",
+        "@typescript/typescript-linux-s390x": "7.0.2",
+        "@typescript/typescript-linux-x64": "7.0.2",
+        "@typescript/typescript-netbsd-arm64": "7.0.2",
+        "@typescript/typescript-netbsd-x64": "7.0.2",
+        "@typescript/typescript-openbsd-arm64": "7.0.2",
+        "@typescript/typescript-openbsd-x64": "7.0.2",
+        "@typescript/typescript-sunos-x64": "7.0.2",
+        "@typescript/typescript-win32-arm64": "7.0.2",
+        "@typescript/typescript-win32-x64": "7.0.2"
+      }
+    },
+    "node_modules/undici": {
+      "version": "7.28.0",
+      "resolved": "https://registry.npmjs.org/undici/-/undici-7.28.0.tgz",
+      "integrity": "sha512-cRZYrTDwWznlnRiPjggAGxZXanty6M8RV1ff8Wm4LWXBp7/IG8v5DnOm74DtUBp9OONpK75YlPnIjQqX0dBDtA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.18.1"
+      }
+    },
+    "node_modules/unenv": {
+      "version": "2.0.0-rc.24",
+      "resolved": "https://registry.npmjs.org/unenv/-/unenv-2.0.0-rc.24.tgz",
+      "integrity": "sha512-i7qRCmY42zmCwnYlh9H2SvLEypEFGye5iRmEMKjcGi7zk9UquigRjFtTLz0TYqr0ZGLZhaMHl/foy1bZR+Cwlw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "pathe": "^2.0.3"
+      }
+    },
+    "node_modules/unified": {
+      "version": "11.0.5",
+      "resolved": "https://registry.npmjs.org/unified/-/unified-11.0.5.tgz",
+      "integrity": "sha512-xKvGhPWw3k84Qjh8bI3ZeJjqnyadK+GEFtazSfZv/rKeTkTjOJho6mFqh2SM96iIcZokxiOpg78GazTSg8+KHA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0",
+        "bail": "^2.0.0",
+        "devlop": "^1.0.0",
+        "extend": "^3.0.0",
+        "is-plain-obj": "^4.0.0",
+        "trough": "^2.0.0",
+        "vfile": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-is": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/unist-util-is/-/unist-util-is-6.0.1.tgz",
+      "integrity": "sha512-LsiILbtBETkDz8I9p1dQ0uyRUWuaQzd/cuEeS1hoRSyW5E5XGmTzlwY1OrNzzakGowI9Dr/I8HVaw4hTtnxy8g==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-position": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/unist-util-position/-/unist-util-position-5.0.0.tgz",
+      "integrity": "sha512-fucsC7HjXvkB5R3kTCO7kUjRdrS0BJt3M/FPxmHMBOm8JQi2BsHAHFsy27E0EolP8rp0NzXsJ+jNPyDWvOJZPA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-stringify-position": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/unist-util-stringify-position/-/unist-util-stringify-position-4.0.0.tgz",
+      "integrity": "sha512-0ASV06AAoKCDkS2+xw5RXJywruurpbC4JZSm7nr7MOt1ojAzvyyaO+UxZf18j8FCF6kmzCZKcAgN/yu2gm2XgQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-visit": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/unist-util-visit/-/unist-util-visit-5.1.0.tgz",
+      "integrity": "sha512-m+vIdyeCOpdr/QeQCu2EzxX/ohgS8KbnPDgFni4dQsfSCtpz8UqDyY5GjRru8PDKuYn7Fq19j1CQ+nJSsGKOzg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0",
+        "unist-util-is": "^6.0.0",
+        "unist-util-visit-parents": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-visit-parents": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/unist-util-visit-parents/-/unist-util-visit-parents-6.0.2.tgz",
+      "integrity": "sha512-goh1s1TBrqSqukSc8wrjwWhL0hiJxgA8m4kFxGlQ+8FYQ3C/m11FcTs4YYem7V664AhHVvgoQLk890Ssdsr2IQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0",
+        "unist-util-is": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/use-sync-external-store": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.6.0.tgz",
+      "integrity": "sha512-Pp6GSwGP/NrPIrxVFAIkOQeyw8lFenOHijQWkUTrDvrF4ALqylP2C/KCkeS9dpUM3KvYRQhna5vt7IL95+ZQ9w==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
+    "node_modules/vfile": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/vfile/-/vfile-6.0.3.tgz",
+      "integrity": "sha512-KzIbH/9tXat2u30jf+smMwFCsno4wHVdNmzFyL+T/L3UGqqk6JKfVqOFOZEpZSHADH1k40ab6NUIXZq422ov3Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0",
+        "vfile-message": "^4.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/vfile-message": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/vfile-message/-/vfile-message-4.0.3.tgz",
+      "integrity": "sha512-QTHzsGd1EhbZs4AsQ20JX1rC3cOlt/IWJruk893DfLRr57lcnOeMaWG4K0JrRta4mIJZKth2Au3mM3u03/JWKw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/unist": "^3.0.0",
+        "unist-util-stringify-position": "^4.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/vite": {
+      "version": "8.1.5",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-8.1.5.tgz",
+      "integrity": "sha512-7ULLwsCdYx/nRyrpiEwvqb5TFHrMVZyBt+rg/OAXT7rgj/z+DtTDyKFeLAdDkubDVDKD8jOsndmy7m55XcfUsw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "lightningcss": "^1.32.0",
+        "picomatch": "^4.0.5",
+        "postcss": "^8.5.17",
+        "rolldown": "~1.1.5",
+        "tinyglobby": "^0.2.17"
+      },
+      "bin": {
+        "vite": "bin/vite.js"
+      },
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      },
+      "funding": {
+        "url": "https://github.com/vitejs/vite?sponsor=1"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.3"
+      },
+      "peerDependencies": {
+        "@types/node": "^20.19.0 || >=22.12.0",
+        "@vitejs/devtools": "^0.3.0",
+        "esbuild": "^0.27.0 || ^0.28.0",
+        "jiti": ">=1.21.0",
+        "less": "^4.0.0",
+        "sass": "^1.70.0",
+        "sass-embedded": "^1.70.0",
+        "stylus": ">=0.54.8",
+        "sugarss": "^5.0.0",
+        "terser": "^5.16.0",
+        "tsx": "^4.8.1",
+        "yaml": "^2.4.2"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        },
+        "@vitejs/devtools": {
+          "optional": true
+        },
+        "esbuild": {
+          "optional": true
+        },
+        "jiti": {
+          "optional": true
+        },
+        "less": {
+          "optional": true
+        },
+        "sass": {
+          "optional": true
+        },
+        "sass-embedded": {
+          "optional": true
+        },
+        "stylus": {
+          "optional": true
+        },
+        "sugarss": {
+          "optional": true
+        },
+        "terser": {
+          "optional": true
+        },
+        "tsx": {
+          "optional": true
+        },
+        "yaml": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/workerd": {
+      "version": "1.20260722.1",
+      "resolved": "https://registry.npmjs.org/workerd/-/workerd-1.20260722.1.tgz",
+      "integrity": "sha512-NycKuc1x2onvsRfGGpM093vRlLFU2zHDAM0+APpccfg4+gZxDGCH27RmdDvkeBuoZyYqgLo3oAfF6re4mvC3vQ==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "workerd": "bin/workerd"
+      },
+      "engines": {
+        "node": ">=16"
+      },
+      "optionalDependencies": {
+        "@cloudflare/workerd-darwin-64": "1.20260722.1",
+        "@cloudflare/workerd-darwin-arm64": "1.20260722.1",
+        "@cloudflare/workerd-linux-64": "1.20260722.1",
+        "@cloudflare/workerd-linux-arm64": "1.20260722.1",
+        "@cloudflare/workerd-windows-64": "1.20260722.1"
+      }
+    },
+    "node_modules/wrangler": {
+      "version": "4.114.0",
+      "resolved": "https://registry.npmjs.org/wrangler/-/wrangler-4.114.0.tgz",
+      "integrity": "sha512-M65P25t5UHA1TIJfgZXDcj+YzVobgKdRguM2QPz0xnxLFuOcuE3ErgllDht0iaho7MS4o0g/Bb4YK2+GT+bibg==",
+      "dev": true,
+      "license": "MIT OR Apache-2.0",
+      "dependencies": {
+        "@cloudflare/kv-asset-handler": "0.5.0",
+        "@cloudflare/unenv-preset": "2.16.1",
+        "blake3-wasm": "2.1.5",
+        "esbuild": "0.28.1",
+        "miniflare": "4.20260722.0",
+        "path-to-regexp": "6.3.0",
+        "unenv": "2.0.0-rc.24",
+        "workerd": "1.20260722.1"
+      },
+      "bin": {
+        "cf-wrangler": "bin/cf-wrangler.js",
+        "wrangler": "bin/wrangler.js",
+        "wrangler2": "bin/wrangler.js"
+      },
+      "engines": {
+        "node": ">=22.0.0"
+      },
+      "optionalDependencies": {
+        "fsevents": "2.3.3"
+      },
+      "peerDependencies": {
+        "@cloudflare/workers-types": "^5.20260722.1"
+      },
+      "peerDependenciesMeta": {
+        "@cloudflare/workers-types": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/ws": {
+      "version": "8.21.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.21.0.tgz",
+      "integrity": "sha512-Vsp28b7DRcimFQvrqu2Wek3z1iYxDCWqHYB8Qsnk/S4RfaCQzPGPyBNuVjJV3cd6UiKtUtp6sNM77gWvzcCH+g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10.0.0"
+      },
+      "peerDependencies": {
+        "bufferutil": "^4.0.1",
+        "utf-8-validate": ">=5.0.2"
+      },
+      "peerDependenciesMeta": {
+        "bufferutil": {
+          "optional": true
+        },
+        "utf-8-validate": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/youch": {
+      "version": "4.1.0-beta.10",
+      "resolved": "https://registry.npmjs.org/youch/-/youch-4.1.0-beta.10.tgz",
+      "integrity": "sha512-rLfVLB4FgQneDr0dv1oddCVZmKjcJ6yX6mS4pU82Mq/Dt9a3cLZQ62pDBL4AUO+uVrCvtWz3ZFUL2HFAFJ/BXQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@poppinss/colors": "^4.1.5",
+        "@poppinss/dumper": "^0.6.4",
+        "@speed-highlight/core": "^1.2.7",
+        "cookie": "^1.0.2",
+        "youch-core": "^0.3.3"
+      }
+    },
+    "node_modules/youch-core": {
+      "version": "0.3.3",
+      "resolved": "https://registry.npmjs.org/youch-core/-/youch-core-0.3.3.tgz",
+      "integrity": "sha512-ho7XuGjLaJ2hWHoK8yFnsUGy2Y5uDpqSTq1FkHLK4/oqKtyUU1AFbOOxY4IpC9f0fTLjwYbslUz0Po5BpD1wrA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@poppinss/exception": "^1.2.2",
+        "error-stack-parser-es": "^1.0.5"
+      }
+    },
+    "node_modules/zustand": {
+      "version": "4.5.7",
+      "resolved": "https://registry.npmjs.org/zustand/-/zustand-4.5.7.tgz",
+      "integrity": "sha512-CHOUy7mu3lbD6o6LJLfllpjkzhHXSBlX8B9+qPddUsIfeF5S/UZ5q0kmCsnRqT1UHFQZchNFDDzMbQsuesHWlw==",
+      "license": "MIT",
+      "dependencies": {
+        "use-sync-external-store": "^1.2.2"
+      },
+      "engines": {
+        "node": ">=12.7.0"
+      },
+      "peerDependencies": {
+        "@types/react": ">=16.8",
+        "immer": ">=9.0.6",
+        "react": ">=16.8"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "immer": {
+          "optional": true
+        },
+        "react": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/zwitch": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/zwitch/-/zwitch-2.0.4.tgz",
+      "integrity": "sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    }
+  }
+}
diff --git a/apps/codex-taskboard/package.json b/apps/codex-taskboard/package.json
new file mode 100644
index 000000000..30dd4173c
--- /dev/null
+++ b/apps/codex-taskboard/package.json
@@ -0,0 +1,52 @@
+{
+  "name": "codex-taskboard",
+  "version": "0.1.0",
+  "private": true,
+  "type": "module",
+  "engines": {
+    "node": ">=22.5"
+  },
+  "bin": {
+    "taskctl": "./cli/taskctl.mjs"
+  },
+  "scripts": {
+    "codex": "node scripts/codex-injector.mjs --launch --watch --open",
+    "codex:inject": "node scripts/codex-injector.mjs --watch",
+    "codex:daemon": "node scripts/codex-injector.mjs --daemon --open",
+    "codex:refresh": "node scripts/codex-injector.mjs --refresh",
+    "dev": "node scripts/dev.mjs",
+    "dev:server": "node --watch server/index.mjs --dev",
+    "dev:web": "vite --config web/vite.config.ts",
+    "dev:cloud": "npm run build:web && wrangler dev --local",
+    "build": "vite build --config web/vite.config.ts && node scripts/codex-injector.mjs --refresh-if-running",
+    "build:web": "vite build --config web/vite.config.ts",
+    "typecheck": "tsc -p web/tsconfig.json --noEmit",
+    "start": "node server/index.mjs",
+    "taskctl": "node cli/taskctl.mjs",
+    "test": "node --test",
+    "test:cloud": "node --test test/cloud-shared-worker.test.mjs",
+    "cloud:migrate:local": "wrangler d1 migrations apply codex-taskboard-db --local",
+    "cloud:migrate": "wrangler d1 migrations apply codex-taskboard-db --remote",
+    "cloud:deploy:dry-run": "npm run build:web && wrangler deploy --dry-run",
+    "cloud:deploy": "npm run build:web && wrangler deploy",
+    "cloud:data": "node scripts/migrate-to-cloud.mjs",
+    "check": "npm run typecheck && npm run build && npm test"
+  },
+  "dependencies": {
+    "@lobehub/icons-static-svg": "^1.94.0",
+    "@xyflow/react": "^12.11.2",
+    "react": "^19.2.7",
+    "react-dom": "^19.2.7",
+    "react-markdown": "^10.1.0",
+    "remark-gfm": "^4.0.1"
+  },
+  "devDependencies": {
+    "@types/react": "^19.2.17",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^6.0.3",
+    "miniflare": "^4.20260722.0",
+    "typescript": "^7.0.2",
+    "vite": "^8.1.5",
+    "wrangler": "^4.114.0"
+  }
+}
diff --git a/apps/codex-taskboard/scripts/codex-injector-runtime.mjs b/apps/codex-taskboard/scripts/codex-injector-runtime.mjs
new file mode 100644
index 000000000..7d9814388
--- /dev/null
+++ b/apps/codex-taskboard/scripts/codex-injector-runtime.mjs
@@ -0,0 +1,165 @@
+const HOST_REQUEST_ERROR = "自动认领配置暂时无法应用，请刷新后重试";
+const AUTOMATION_SCHEMA_DIAGNOSTIC = "AUTOMATION_SCHEMA_MISMATCH";
+
+function parseHostRequest(payload, parseAutomationRequest) {
+  if (typeof payload !== "string" || payload.length > 4_096) {
+    return { id: null, request: null, error: HOST_REQUEST_ERROR };
+  }
+
+  let request;
+  try {
+    request = JSON.parse(payload);
+  } catch {
+    return { id: null, request: null, error: HOST_REQUEST_ERROR };
+  }
+
+  const id = (
+    request
+    && typeof request.id === "string"
+    && /^[a-z0-9-]{1,80}$/i.test(request.id)
+  ) ? request.id : null;
+  if (!id) return { id: null, request: null, error: HOST_REQUEST_ERROR };
+  if (request.action === "ensure") return { id, request, error: null };
+  if (request.action === "automation") {
+    const parsed = parseAutomationRequest(request);
+    return parsed
+      ? { id, request: parsed, error: null }
+      : {
+          id,
+          request: null,
+          error: HOST_REQUEST_ERROR,
+          diagnosticCode: AUTOMATION_SCHEMA_DIAGNOSTIC,
+        };
+  }
+  if (
+    request.action === "prefill-task-composer"
+    && typeof request.instruction === "string"
+    && request.instruction.length > 0
+    && request.instruction.length <= 1_024
+    && typeof request.skillName === "string"
+    && /^[a-z0-9][a-z0-9-]{0,79}$/i.test(request.skillName)
+    && typeof request.skillDisplayName === "string"
+    && request.skillDisplayName.length > 0
+    && request.skillDisplayName.length <= 120
+    && typeof request.skillPath === "string"
+    && request.skillPath.length > 0
+    && request.skillPath.length <= 1_024
+  ) {
+    return { id, request, error: null };
+  }
+  return { id, request: null, error: HOST_REQUEST_ERROR };
+}
+
+export async function handleHostBindingPayload(params, handlers) {
+  const parsed = parseHostRequest(params.payload, handlers.parseAutomationRequest);
+  if (!parsed.request) {
+    if (!parsed.id) return { responded: false, accepted: false };
+    await handlers.sendResponse(params.executionContextId, {
+      id: parsed.id,
+      ok: false,
+      error: parsed.error,
+      ...(parsed.diagnosticCode ? { diagnosticCode: parsed.diagnosticCode } : {}),
+    });
+    return { responded: true, accepted: false };
+  }
+
+  try {
+    let result;
+    if (parsed.request.action === "ensure") {
+      result = await handlers.ensure();
+    } else if (parsed.request.action === "automation") {
+      result = await handlers.runAutomation(parsed.request, params.executionContextId);
+    } else {
+      result = await handlers.prefill(parsed.request, params.executionContextId);
+    }
+    await handlers.sendResponse(params.executionContextId, {
+      id: parsed.request.id,
+      ok: true,
+      ...result,
+    });
+  } catch (error) {
+    await handlers.sendResponse(params.executionContextId, {
+      id: parsed.request.id,
+      ok: false,
+      error: error.message,
+    });
+  }
+  return { responded: true, accepted: true };
+}
+
+export async function reconcileInjectionRuntime({
+  currentStatus,
+  source,
+  sourceHash,
+  removeRegisteredSource,
+  registerCurrentSource,
+  evaluateCurrentSource,
+  publishRegistration,
+  reopen,
+}) {
+  if (currentStatus.scriptIdentifier) {
+    try {
+      await removeRegisteredSource(currentStatus.scriptIdentifier);
+    } catch {}
+  }
+  const scriptIdentifier = await registerCurrentSource(source);
+  await evaluateCurrentSource(source);
+  await publishRegistration(scriptIdentifier);
+  const replaced = currentStatus.sourceHash !== sourceHash;
+  const shouldRemainOpen = currentStatus.pageVisible === true;
+  if (replaced && shouldRemainOpen) await reopen();
+  return { replaced, scriptIdentifier, shouldRemainOpen };
+}
+
+export function findResidentInjectorPids({
+  processList,
+  currentPid,
+  injectorPath,
+  projectRoot,
+  port,
+  defaultPort,
+  cwdForPid,
+}) {
+  const absoluteScript = new RegExp(
+    `(?:^|\\s)${escapeRegExp(injectorPath)}(?=\\s|$)`,
+  );
+  const relativeScript = /(?:^|\s)(?:\.\/)?scripts\/codex-injector\.mjs(?=\s|$)/;
+  const residents = [];
+
+  for (const line of processList.split("\n")) {
+    const match = line.trim().match(/^(\d+)\s+(.+)$/);
+    if (!match) continue;
+    const pid = Number(match[1]);
+    const command = match[2];
+    if (pid === currentPid || !/(?:^|\s)--watch(?=\s|$)/.test(command)) continue;
+    const scriptMatches = absoluteScript.test(command)
+      || (relativeScript.test(command) && cwdForPid(pid) === projectRoot);
+    if (!scriptMatches || commandPort(command, defaultPort) !== port) continue;
+    residents.push(pid);
+  }
+  return residents;
+}
+
+export async function restartResidentInjector(port, handlers) {
+  const previousPids = handlers.findResidents(port);
+  if (previousPids.length === 0) return { previousPids: [], pid: null, restarted: false };
+
+  for (const pid of previousPids) await handlers.stopResident(pid);
+  const startupToken = handlers.createStartupToken();
+  const started = handlers.startResident(port, startupToken);
+  await handlers.waitUntilReady(port, started.pid, startupToken);
+  return {
+    previousPids,
+    pid: started.pid,
+    restarted: true,
+  };
+}
+
+function commandPort(command, defaultPort) {
+  const match = command.match(/(?:^|\s)--port(?:=(\d+)|\s+(\d+))(?=\s|$)/);
+  return match ? Number(match[1] ?? match[2]) : defaultPort;
+}
+
+function escapeRegExp(value) {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
diff --git a/apps/codex-taskboard/scripts/codex-injector.mjs b/apps/codex-taskboard/scripts/codex-injector.mjs
new file mode 100644
index 000000000..50072853d
--- /dev/null
+++ b/apps/codex-taskboard/scripts/codex-injector.mjs
@@ -0,0 +1,1425 @@
+#!/usr/bin/env node
+
+import { spawn, spawnSync } from "node:child_process";
+import { createHash, randomUUID } from "node:crypto";
+import { mkdir, readFile, writeFile } from "node:fs/promises";
+import { fileURLToPath } from "node:url";
+import path from "node:path";
+
+import { resolvePort } from "../server/app.mjs";
+import {
+  parseTaskboardAutomationHostRequest,
+  reconcileTaskboardAutomation,
+} from "../shared/taskboard-automation.mjs";
+import {
+  findResidentInjectorPids,
+  handleHostBindingPayload,
+  reconcileInjectionRuntime,
+  restartResidentInjector,
+} from "./codex-injector-runtime.mjs";
+import { readCodexQuotaStatus } from "./codex-rate-limits.mjs";
+
+const injectorPath = fileURLToPath(import.meta.url);
+const projectRoot = path.resolve(path.dirname(injectorPath), "..");
+const defaultCodexDebuggingPort = 9229;
+const injectionPath = path.join(projectRoot, "inject", "codex-taskboard.user.js");
+const automationPoliciesPath = path.join(projectRoot, ".data", "codex-automation-policies.json");
+const taskboardOrigin = `http://127.0.0.1:${resolvePort()}`;
+const taskboardHealthUrl = `${taskboardOrigin}/health`;
+const taskboardPageUrl = `${taskboardOrigin}/?host=codex`;
+const cdpHosts = [...new Set([process.env.CODEX_CDP_HOST, "localhost", "127.0.0.1"].filter(Boolean))];
+const hostBindingName = "__codexTaskboardHostV1";
+const hostHeartbeatName = "__codexTaskboardHostHeartbeatV1";
+const hostStartupTokenName = "__codexTaskboardHostStartupTokenV1";
+const injectionSourceHashName = "__CODEX_TASKBOARD_SOURCE_HASH__";
+const injectionScriptIdentifierName = "__CODEX_TASKBOARD_SCRIPT_IDENTIFIER__";
+const codexAutomationMethods = new Set([
+  "list-automations",
+  "automation-create",
+  "automation-update",
+]);
+let codexAutomationRequestSequence = 0;
+const quotaPolicyTimers = new Map();
+const quotaPolicyRecords = new Map();
+const quotaPolicyQueues = new Map();
+let quotaPoliciesLoadPromise = null;
+let quotaPoliciesWritePromise = Promise.resolve();
+let quotaPoliciesRestored = false;
+
+function parseArgs(argv) {
+  const options = {
+    port: defaultCodexDebuggingPort,
+    portExplicit: false,
+    launch: false,
+    watch: false,
+    open: false,
+    refresh: false,
+    refreshIfRunning: false,
+    attachExisting: false,
+    startupToken: null,
+    daemon: false,
+    backgroundTaskboard: false,
+    screenshot: null,
+    appPath: "/Applications/ChatGPT.app",
+  };
+
+  for (let index = 0; index < argv.length; index += 1) {
+    const arg = argv[index];
+    if (arg === "--launch") options.launch = true;
+    else if (arg === "--watch") options.watch = true;
+    else if (arg === "--open") options.open = true;
+    else if (arg === "--refresh") options.refresh = true;
+    else if (arg === "--refresh-if-running") options.refreshIfRunning = true;
+    else if (arg === "--attach-existing") options.attachExisting = true;
+    else if (arg === "--startup-token") {
+      options.startupToken = argv[++index];
+      if (!/^[a-z0-9-]{1,100}$/i.test(options.startupToken || "")) {
+        throw new Error("--startup-token must be an identifier");
+      }
+    }
+    else if (arg === "--daemon") options.daemon = true;
+    else if (arg === "--background-taskboard") options.backgroundTaskboard = true;
+    else if (arg === "--port") {
+      options.port = Number(argv[++index]);
+      options.portExplicit = true;
+    }
+    else if (arg === "--screenshot") options.screenshot = path.resolve(argv[++index]);
+    else if (arg === "--app-path") options.appPath = path.resolve(argv[++index]);
+    else throw new Error(`Unknown option: ${arg}`);
+  }
+
+  if (!Number.isInteger(options.port) || options.port < 1 || options.port > 65535) {
+    throw new Error("--port must be an integer between 1 and 65535");
+  }
+  return options;
+}
+
+async function fetchJson(url) {
+  const response = await fetch(url);
+  if (!response.ok) throw new Error(`${response.status} ${response.statusText}`);
+  return response.json();
+}
+
+async function isReachable(url) {
+  try {
+    const response = await fetch(url, { signal: AbortSignal.timeout(1_500) });
+    return response.ok;
+  } catch {
+    return false;
+  }
+}
+
+async function waitUntilReachable(url, timeoutMs) {
+  const deadline = Date.now() + timeoutMs;
+  while (Date.now() < deadline) {
+    if (await isReachable(url)) return;
+    await new Promise((resolve) => setTimeout(resolve, 250));
+  }
+  throw new Error(`Timed out waiting for ${url}`);
+}
+
+function cdpHttpUrl(host, port, pathname = "") {
+  return `http://${host}:${port}${pathname}`;
+}
+
+async function resolveCdpBaseUrl(port) {
+  for (const host of cdpHosts) {
+    const url = cdpHttpUrl(host, port, "/json/version");
+    if (await isReachable(url)) return cdpHttpUrl(host, port);
+  }
+  return null;
+}
+
+async function waitUntilCdpReachable(port, timeoutMs) {
+  const deadline = Date.now() + timeoutMs;
+  while (Date.now() < deadline) {
+    const baseUrl = await resolveCdpBaseUrl(port);
+    if (baseUrl) return baseUrl;
+    await new Promise((resolve) => setTimeout(resolve, 250));
+  }
+  throw new Error(`Timed out waiting for Codex CDP on ${cdpHosts.map((host) => `${host}:${port}`).join(" or ")}`);
+}
+
+async function fetchCdpJson(port, pathname) {
+  const baseUrl = await resolveCdpBaseUrl(port);
+  if (!baseUrl) {
+    throw new Error(`Codex CDP is not listening on ${cdpHosts.map((host) => `${host}:${port}`).join(" or ")}`);
+  }
+  return fetchJson(`${baseUrl}${pathname}`);
+}
+
+function startTaskboard({ detached }) {
+  return spawn(process.execPath, [path.join(projectRoot, "server", "index.mjs")], {
+    cwd: projectRoot,
+    detached,
+    stdio: detached ? "ignore" : "inherit",
+    windowsHide: process.platform === "win32",
+  });
+}
+
+function createTaskboardSupervisor({ detached }) {
+  let child = null;
+  let ensureInFlight = null;
+  let retryAfter = 0;
+  let stopping = false;
+
+  async function ensure({ force = false } = {}) {
+    if (await isReachable(taskboardHealthUrl)) {
+      return { status: "ok", restarted: false };
+    }
+    if (ensureInFlight) return ensureInFlight;
+    if (!force && Date.now() < retryAfter) {
+      throw new Error("Taskboard restart is waiting before its next attempt");
+    }
+
+    ensureInFlight = (async () => {
+      if (child?.exitCode === null && !child.killed) {
+        try {
+          await waitUntilReachable(taskboardHealthUrl, 3_000);
+          return { status: "ok", restarted: false };
+        } catch (_) {}
+      }
+
+      const started = startTaskboard({ detached });
+      child = started;
+      if (detached) started.unref();
+      started.once("error", (error) => {
+        if (!stopping) console.error(`Taskboard process error: ${error.message}`);
+      });
+      started.once("exit", (code, signal) => {
+        if (child === started) child = null;
+        if (!stopping && !detached && code !== 0) {
+          console.error(`Taskboard exited (${signal || code}); it will be restarted automatically.`);
+        }
+      });
+
+      try {
+        await waitUntilReachable(taskboardHealthUrl, 10_000);
+        retryAfter = 0;
+        return { status: "ok", restarted: true };
+      } catch (error) {
+        retryAfter = Date.now() + 2_000;
+        throw error;
+      }
+    })();
+
+    try {
+      return await ensureInFlight;
+    } finally {
+      ensureInFlight = null;
+    }
+  }
+
+  function stop() {
+    stopping = true;
+    if (child?.exitCode === null && !child.killed) child.kill("SIGTERM");
+  }
+
+  return { ensure, stop };
+}
+
+function codexIsRunning() {
+  return spawnSync("/usr/bin/pgrep", ["-x", "ChatGPT"], { stdio: "ignore" }).status === 0;
+}
+
+function launchCodex(appPath, port) {
+  return spawn(
+    "/usr/bin/open",
+    [
+      "-W",
+      "-a",
+      appPath,
+      "--args",
+      `--remote-debugging-port=${port}`,
+      `--remote-allow-origins=http://localhost:${port},http://127.0.0.1:${port}`,
+    ],
+    { stdio: "ignore" },
+  );
+}
+
+function windowsProcessRows() {
+  const script = "Get-CimInstance Win32_Process | ForEach-Object { if ($_.CommandLine) { '{0} {1}' -f $_.ProcessId, $_.CommandLine } }";
+  const result = spawnSync("powershell.exe", [
+    "-NoProfile",
+    "-ExecutionPolicy",
+    "Bypass",
+    "-Command",
+    script,
+  ], {
+    encoding: "utf8",
+    maxBuffer: 4 * 1024 * 1024,
+    windowsHide: process.platform === "win32",
+  });
+  return result.status === 0 ? result.stdout : "";
+}
+
+function unixProcessRows() {
+  const result = spawnSync("/bin/ps", ["-axo", "pid=,command="], {
+    encoding: "utf8",
+    maxBuffer: 4 * 1024 * 1024,
+  });
+  return result.status === 0 ? result.stdout : "";
+}
+
+function processRows() {
+  return process.platform === "win32" ? windowsProcessRows() : unixProcessRows();
+}
+
+class CdpConnection {
+  constructor(url) {
+    this.socket = new WebSocket(url);
+    this.sequence = 0;
+    this.pending = new Map();
+    this.eventWaiters = new Map();
+    this.eventHandlers = new Map();
+    this.closed = false;
+  }
+
+  async open() {
+    await new Promise((resolve, reject) => {
+      this.socket.addEventListener("open", resolve, { once: true });
+      this.socket.addEventListener("error", () => reject(new Error("CDP WebSocket connection failed")), {
+        once: true,
+      });
+    });
+    this.socket.addEventListener("message", (event) => {
+      const message = JSON.parse(String(event.data));
+      if (!message.id) {
+        const waiters = this.eventWaiters.get(message.method) || [];
+        this.eventWaiters.delete(message.method);
+        waiters.forEach((waiter) => waiter.resolve(message.params));
+        const handlers = this.eventHandlers.get(message.method) || [];
+        handlers.forEach((handler) => {
+          try {
+            Promise.resolve(handler(message.params)).catch((error) => {
+              console.error(`CDP ${message.method} handler failed: ${error.message}`);
+            });
+          } catch (error) {
+            console.error(`CDP ${message.method} handler failed: ${error.message}`);
+          }
+        });
+        return;
+      }
+      const pending = this.pending.get(message.id);
+      if (!pending) return;
+      this.pending.delete(message.id);
+      if (message.error) pending.reject(new Error(message.error.message));
+      else pending.resolve(message.result);
+    });
+    this.socket.addEventListener("close", () => {
+      this.closed = true;
+      const error = new Error("CDP WebSocket closed");
+      this.pending.forEach((pending) => pending.reject(error));
+      this.pending.clear();
+      this.eventWaiters.forEach((waiters) => waiters.forEach((waiter) => waiter.reject(error)));
+      this.eventWaiters.clear();
+      this.eventHandlers.clear();
+    });
+  }
+
+  send(method, params = {}) {
+    const id = ++this.sequence;
+    return new Promise((resolve, reject) => {
+      this.pending.set(id, { resolve, reject });
+      this.socket.send(JSON.stringify({ id, method, params }));
+    });
+  }
+
+  waitFor(method, timeoutMs) {
+    return new Promise((resolve, reject) => {
+      const waiters = this.eventWaiters.get(method) || [];
+      const timeout = setTimeout(() => {
+        this.eventWaiters.set(
+          method,
+          (this.eventWaiters.get(method) || []).filter((waiter) => waiter.resolve !== wrappedResolve),
+        );
+        reject(new Error(`Timed out waiting for CDP event ${method}`));
+      }, timeoutMs);
+      const wrappedResolve = (value) => {
+        clearTimeout(timeout);
+        resolve(value);
+      };
+      waiters.push({ resolve: wrappedResolve, reject });
+      this.eventWaiters.set(method, waiters);
+    });
+  }
+
+  on(method, handler) {
+    const handlers = this.eventHandlers.get(method) || [];
+    handlers.push(handler);
+    this.eventHandlers.set(method, handlers);
+    return () => {
+      this.eventHandlers.set(
+        method,
+        (this.eventHandlers.get(method) || []).filter((candidate) => candidate !== handler),
+      );
+    };
+  }
+
+  close() {
+    this.socket.close();
+  }
+}
+
+async function codexTargets(port) {
+  const targets = await fetchCdpJson(port, "/json/list");
+  return targets.filter(
+    (target) =>
+      target.type === "page" &&
+      target.webSocketDebuggerUrl &&
+      !target.url?.includes("initialRoute=%2Fglobal-dictation") &&
+      (target.url?.startsWith("app://") || target.title === "Codex"),
+  );
+}
+
+function codexDebuggingPorts(preferredPort) {
+  const ports = new Set([preferredPort]);
+
+  for (const line of processRows().split("\n")) {
+    const command = line.trim().replace(/^\d+\s+/, "");
+    if (!/(?:ChatGPT|Codex)(?:\.exe|\.app)?/i.test(command)) continue;
+    const match = command.match(/--remote-debugging-port=(\d+)/);
+    if (match) ports.add(Number(match[1]));
+  }
+  return [...ports];
+}
+
+function processCwd(pid) {
+  if (process.platform === "win32") return null;
+  const result = spawnSync("/usr/sbin/lsof", [
+    "-a",
+    "-p",
+    String(pid),
+    "-d",
+    "cwd",
+    "-Fn",
+  ], {
+    encoding: "utf8",
+    maxBuffer: 64 * 1024,
+  });
+  if (result.status !== 0) return null;
+  const cwd = result.stdout.split("\n").find((line) => line.startsWith("n"))?.slice(1);
+  return cwd ? path.resolve(cwd) : null;
+}
+
+function residentInjectorPids(port) {
+  return findResidentInjectorPids({
+    processList: processRows(),
+    currentPid: process.pid,
+    injectorPath,
+    projectRoot,
+    port,
+    defaultPort: defaultCodexDebuggingPort,
+    cwdForPid: processCwd,
+  });
+}
+
+function startResidentInjector(
+  port,
+  shouldOpen,
+  attachExisting = false,
+  startupToken = null,
+) {
+  const [existingPid] = residentInjectorPids(port);
+  if (existingPid) return { pid: existingPid, started: false };
+  const args = [injectorPath, "--watch", "--port", String(port)];
+  args.push("--background-taskboard");
+  if (shouldOpen) args.push("--open");
+  if (attachExisting) args.push("--attach-existing");
+  if (startupToken) args.push("--startup-token", startupToken);
+  const child = spawn(process.execPath, args, {
+    cwd: projectRoot,
+    detached: true,
+    stdio: "ignore",
+    windowsHide: process.platform === "win32",
+  });
+  child.unref();
+  return { pid: child.pid, started: true };
+}
+
+async function stopResidentInjector(pid) {
+  process.kill(pid, "SIGTERM");
+  const deadline = Date.now() + 5_000;
+  while (Date.now() < deadline) {
+    try {
+      process.kill(pid, 0);
+      await new Promise((resolve) => setTimeout(resolve, 50));
+    } catch {
+      return;
+    }
+  }
+  throw new Error(`Timed out stopping resident Taskboard injector ${pid}`);
+}
+
+async function waitForResidentInjectorReady(port, pid, startupToken, expectedSourceHash) {
+  const deadline = Date.now() + 15_000;
+  while (Date.now() < deadline) {
+    try {
+      process.kill(pid, 0);
+      const targets = await codexTargets(port);
+      for (const target of targets) {
+        const cdp = new CdpConnection(target.webSocketDebuggerUrl);
+        await cdp.open();
+        try {
+          const readiness = await cdp.send("Runtime.evaluate", {
+            expression: `({
+              token: window[${JSON.stringify(hostStartupTokenName)}],
+              taskboardEntryMounted: Boolean(document.getElementById("codex-taskboard-entry")),
+              sourceHash: window.__codexTaskboardInjection__?.sourceHash || null
+            })`,
+            returnByValue: true,
+          });
+          if (
+            readiness.result.value?.token === startupToken
+            && readiness.result.value.taskboardEntryMounted
+            && readiness.result.value.sourceHash === expectedSourceHash
+          ) return;
+        } finally {
+          cdp.close();
+        }
+      }
+    } catch {}
+    await new Promise((resolve) => setTimeout(resolve, 100));
+  }
+  throw new Error(`Timed out waiting for resident Taskboard injector ${pid}`);
+}
+
+async function restartResidentInjectorForRefresh(port) {
+  const { sourceHash } = await currentInjectionSource();
+  return restartResidentInjector(port, {
+    findResidents: residentInjectorPids,
+    stopResident: stopResidentInjector,
+    createStartupToken: randomUUID,
+    startResident: (targetPort, startupToken) => (
+      startResidentInjector(targetPort, false, true, startupToken)
+    ),
+    waitUntilReady: (targetPort, pid, startupToken) => (
+      waitForResidentInjectorReady(targetPort, pid, startupToken, sourceHash)
+    ),
+  });
+}
+
+async function refreshTaskboardFrames(port) {
+  const targets = await codexTargets(port);
+  const results = [];
+
+  for (const target of targets) {
+    const cdp = new CdpConnection(target.webSocketDebuggerUrl);
+    await cdp.open();
+    try {
+      await cdp.send("Runtime.enable");
+      const evaluation = await cdp.send("Runtime.evaluate", {
+        expression: `(() => {
+          const taskboard = window.__codexTaskboardInjection__;
+          if (typeof taskboard?.reloadFrame === "function") {
+            return { refreshed: taskboard.reloadFrame(), via: "injection" };
+          }
+          const frame = document.getElementById("codex-taskboard-frame");
+          if (!frame) return { refreshed: false, via: "not-mounted" };
+          const url = new URL(frame.getAttribute("src") || frame.src);
+          url.searchParams.set("__codex_taskboard_refresh", Date.now().toString(36));
+          frame.setAttribute("src", url.href);
+          return { refreshed: true, via: "fallback", frameUrl: url.href };
+        })()`,
+        returnByValue: true,
+      });
+      if (evaluation.exceptionDetails) {
+        throw new Error(
+          evaluation.exceptionDetails.exception?.description || "Taskboard frame refresh failed",
+        );
+      }
+      results.push({
+        targetId: target.id,
+        title: target.title,
+        url: target.url,
+        ...evaluation.result.value,
+      });
+    } finally {
+      cdp.close();
+    }
+  }
+
+  return results;
+}
+
+function frameTreeContains(frameTree, expectedUrl) {
+  if (frameTree.frame?.url === expectedUrl) return true;
+  return frameTree.childFrames?.some((child) => frameTreeContains(child, expectedUrl)) || false;
+}
+
+async function waitForFrame(cdp, expectedUrl, timeoutMs) {
+  const deadline = Date.now() + timeoutMs;
+  while (Date.now() < deadline) {
+    const [{ targetInfos }, { frameTree }] = await Promise.all([
+      cdp.send("Target.getTargets"),
+      cdp.send("Page.getFrameTree"),
+    ]);
+    if (
+      targetInfos.some((target) => target.type === "iframe" && target.url === expectedUrl) ||
+      frameTreeContains(frameTree, expectedUrl)
+    ) {
+      return true;
+    }
+    await new Promise((resolve) => setTimeout(resolve, 250));
+  }
+  return false;
+}
+
+async function requestCodexAutomationViaCdp(cdp, executionContextId, method, params) {
+  if (!codexAutomationMethods.has(method)) {
+    throw new Error(`Unsupported Codex automation method: ${method}`);
+  }
+  const requestId = [
+    "taskboard-automation",
+    process.pid,
+    Date.now().toString(36),
+    (++codexAutomationRequestSequence).toString(36),
+  ].join("-");
+  const evaluation = await cdp.send("Runtime.evaluate", {
+    expression: `(() => new Promise((resolve) => {
+      const method = ${JSON.stringify(method)};
+      const params = ${JSON.stringify(params)};
+      const requestId = ${JSON.stringify(requestId)};
+      const bridge = window.electronBridge;
+      if (!bridge || typeof bridge.sendMessageFromView !== "function") {
+        resolve({ ok: false, error: "当前 Codex 版本没有提供原生自动任务能力" });
+        return;
+      }
+      let settled = false;
+      const finish = (result) => {
+        if (settled) return;
+        settled = true;
+        window.clearTimeout(timeout);
+        window.removeEventListener("message", onMessage);
+        resolve(result);
+      };
+      const onMessage = (event) => {
+        const message = event.data;
+        if (
+          !message
+          || typeof message !== "object"
+          || message.type !== "fetch-response"
+          || message.requestId !== requestId
+        ) return;
+        finish({
+          ok: true,
+          responseType: message.responseType,
+          status: message.status,
+          bodyJsonString: message.bodyJsonString,
+        });
+      };
+      const timeout = window.setTimeout(
+        () => finish({ ok: false, error: "Codex 自动任务接口没有响应" }),
+        10_000,
+      );
+      window.addEventListener("message", onMessage);
+      Promise.resolve(bridge.sendMessageFromView({
+        type: "fetch",
+        requestId,
+        method: "POST",
+        url: \`vscode://codex/${method}\`,
+        body: JSON.stringify(params),
+      })).catch((error) => {
+        finish({
+          ok: false,
+          error: error instanceof Error ? error.message : String(error),
+        });
+      });
+    }))()`,
+    ...(Number.isInteger(executionContextId) ? { contextId: executionContextId } : {}),
+    awaitPromise: true,
+    returnByValue: true,
+  });
+  if (evaluation.exceptionDetails) {
+    throw new Error(
+      evaluation.exceptionDetails.exception?.description
+      || "Codex automation request failed",
+    );
+  }
+  const response = evaluation.result.value;
+  if (!response?.ok) throw new Error(response?.error || "Codex automation request failed");
+  if (!Number.isInteger(response.status) || response.status < 200 || response.status >= 300) {
+    throw new Error(`Codex automation request returned HTTP ${response.status}`);
+  }
+  if (typeof response.bodyJsonString !== "string" || response.bodyJsonString.length === 0) {
+    return {};
+  }
+  try {
+    return JSON.parse(response.bodyJsonString);
+  } catch {
+    throw new Error("Codex automation request returned invalid JSON");
+  }
+}
+
+async function applyTaskboardAutomationPolicy(request, rpc, stillCurrent = () => true) {
+  const quota = request.quotaAware
+    ? await readCodexQuotaStatus(request.model)
+    : null;
+  if (!stillCurrent()) return { quota, stale: true };
+  const shouldRun = request.enabledByUser
+    && (!request.quotaAware || quota?.state === "available");
+  const result = await reconcileTaskboardAutomation(
+    { ...request, operation: shouldRun ? "ensure-active" : "pause" },
+    rpc,
+  );
+  if (result?.error === "not-found") {
+    return { ...(quota ? { quota } : {}) };
+  }
+  return { ...result, ...(quota ? { quota } : {}) };
+}
+
+function storedAutomationPolicy(request) {
+  return {
+    taskboardProjectId: request.taskboardProjectId,
+    codexProjectId: request.codexProjectId,
+    projectName: request.projectName,
+    workspacePath: request.workspacePath,
+    skillPath: request.skillPath,
+    ...(request.automationId ? { automationId: request.automationId } : {}),
+    enabledByUser: request.enabledByUser,
+    quotaAware: request.quotaAware,
+    intervalMinutes: request.intervalMinutes,
+    model: request.model,
+    reasoningEffort: request.reasoningEffort,
+  };
+}
+
+function restoredAutomationPolicy(value) {
+  return parseTaskboardAutomationHostRequest({
+    ...value,
+    id: "restored-policy",
+    action: "automation",
+    requestId: "restored-policy",
+    operation: "apply-policy",
+  });
+}
+
+async function ensureQuotaPoliciesLoaded() {
+  if (quotaPoliciesLoadPromise) return quotaPoliciesLoadPromise;
+  quotaPoliciesLoadPromise = (async () => {
+    let stored = {};
+    try {
+      stored = JSON.parse(await readFile(automationPoliciesPath, "utf8"));
+    } catch (error) {
+      if (error.code !== "ENOENT") throw error;
+    }
+    if (!stored || typeof stored !== "object" || Array.isArray(stored)) return;
+    for (const value of Object.values(stored)) {
+      const request = restoredAutomationPolicy(value);
+      if (!request) continue;
+      quotaPolicyRecords.set(request.taskboardProjectId, { version: 1, request });
+    }
+  })();
+  return quotaPoliciesLoadPromise;
+}
+
+function persistQuotaPolicies() {
+  const data = Object.fromEntries(
+    [...quotaPolicyRecords.entries()].map(([projectId, record]) => [
+      projectId,
+      storedAutomationPolicy(record.request),
+    ]),
+  );
+  quotaPoliciesWritePromise = quotaPoliciesWritePromise
+    .catch(() => {})
+    .then(async () => {
+      await mkdir(path.dirname(automationPoliciesPath), { recursive: true });
+      await writeFile(automationPoliciesPath, `${JSON.stringify(data, null, 2)}\n`, {
+        mode: 0o600,
+      });
+    });
+  return quotaPoliciesWritePromise;
+}
+
+function scheduleQuotaPolicyCheck(record, cdp, result) {
+  const { request, version } = record;
+  const key = request.taskboardProjectId;
+  const previous = quotaPolicyTimers.get(key);
+  if (previous) clearTimeout(previous);
+  quotaPolicyTimers.delete(key);
+  if (!request.enabledByUser || !request.quotaAware) return;
+
+  const nextRunAt = Number(result.item?.nextRunAt);
+  const nextRunDelay = Number.isFinite(nextRunAt) && nextRunAt > Date.now()
+    ? Math.max(1_000, nextRunAt - Date.now() - 15_000)
+    : 60_000;
+  const resetDelay = result.quota?.state === "blocked"
+    && Number.isFinite(result.quota.resetsAt)
+    ? Math.max(1_000, result.quota.resetsAt * 1_000 - Date.now() + 1_000)
+    : nextRunDelay;
+  const timer = setTimeout(async () => {
+    if (quotaPolicyRecords.get(key)?.version !== version) return;
+    try {
+      await enqueueCurrentQuotaPolicy(key, cdp);
+    } catch (error) {
+      console.error(`Taskboard quota policy check failed: ${error.message}`);
+      const current = quotaPolicyRecords.get(key);
+      if (current?.version === version) {
+        scheduleQuotaPolicyCheck(current, cdp, { quota: { state: "unknown" } });
+      }
+    }
+  }, Math.min(nextRunDelay, resetDelay));
+  timer.unref();
+  quotaPolicyTimers.set(key, timer);
+}
+
+function enqueueQuotaPolicyMutation(record, cdp, rpc) {
+  const key = record.request.taskboardProjectId;
+  const previous = quotaPolicyQueues.get(key) ?? Promise.resolve();
+  const run = previous
+    .catch(() => {})
+    .then(async () => {
+      const current = quotaPolicyRecords.get(key);
+      if (!current || current.version !== record.version) return { stale: true };
+      const result = await applyTaskboardAutomationPolicy(
+        current.request,
+        rpc,
+        () => quotaPolicyRecords.get(key)?.version === current.version,
+      );
+      if (result.stale) return result;
+      if (result.item?.id && quotaPolicyRecords.get(key)?.version === current.version) {
+        current.request = { ...current.request, automationId: result.item.id };
+        await persistQuotaPolicies();
+      }
+      scheduleQuotaPolicyCheck(current, cdp, result);
+      return result;
+    });
+  const tracked = run.finally(() => {
+    if (quotaPolicyQueues.get(key) === tracked) quotaPolicyQueues.delete(key);
+  });
+  quotaPolicyQueues.set(key, tracked);
+  return tracked;
+}
+
+async function updateAndApplyQuotaPolicy(request, cdp, rpc) {
+  await ensureQuotaPoliciesLoaded();
+  const previous = quotaPolicyRecords.get(request.taskboardProjectId);
+  const record = {
+    version: (previous?.version ?? 0) + 1,
+    request,
+  };
+  quotaPolicyRecords.set(request.taskboardProjectId, record);
+  try {
+    await persistQuotaPolicies();
+    return await enqueueQuotaPolicyMutation(record, cdp, rpc);
+  } catch (error) {
+    if (quotaPolicyRecords.get(request.taskboardProjectId)?.version === record.version) {
+      if (previous) quotaPolicyRecords.set(request.taskboardProjectId, previous);
+      else quotaPolicyRecords.delete(request.taskboardProjectId);
+      await persistQuotaPolicies();
+    }
+    throw error;
+  }
+}
+
+async function readStoredAutomationPolicy(projectId) {
+  await ensureQuotaPoliciesLoaded();
+  const record = quotaPolicyRecords.get(projectId);
+  return record ? storedAutomationPolicy(record.request) : null;
+}
+
+async function enqueueCurrentQuotaPolicy(projectId, cdp) {
+  await ensureQuotaPoliciesLoaded();
+  const record = quotaPolicyRecords.get(projectId);
+  if (!record) return { stale: true };
+  return enqueueQuotaPolicyMutation(
+    record,
+    cdp,
+    (method, body) => requestCodexAutomationViaCdp(cdp, undefined, method, body),
+  );
+}
+
+async function restoreQuotaPolicies(cdp) {
+  if (quotaPoliciesRestored) return;
+  quotaPoliciesRestored = true;
+  await ensureQuotaPoliciesLoaded();
+  for (const [projectId, record] of quotaPolicyRecords) {
+    if (record.request.enabledByUser && record.request.quotaAware) {
+      void enqueueCurrentQuotaPolicy(projectId, cdp).catch((error) => {
+        console.error(`Taskboard quota policy restore failed: ${error.message}`);
+      });
+    }
+  }
+}
+
+async function prefillTaskComposerViaCdp(cdp, executionContextId, request) {
+  const {
+    instruction,
+    skillDisplayName,
+    skillName,
+    skillPath,
+  } = request;
+  const deadline = Date.now() + 8_000;
+  while (Date.now() < deadline) {
+    const prepared = await cdp.send("Runtime.evaluate", {
+      expression: `(() => {
+        const instruction = ${JSON.stringify(instruction)};
+        const skillName = ${JSON.stringify(skillName)};
+        const skillPath = ${JSON.stringify(skillPath)};
+        const editor = Array.from(document.querySelectorAll(
+          '[data-codex-composer="true"][contenteditable="true"]'
+        )).find((candidate) => candidate.getClientRects().length > 0);
+        if (!editor) return { ready: false };
+        const mention = Array.from(editor.querySelectorAll("[skill-mention-name]"))
+          .find((candidate) => (
+            candidate.getAttribute("skill-mention-name") === skillName
+            && candidate.getAttribute("skill-mention-path") === skillPath
+          ));
+        if (mention && (editor.textContent || "").includes(instruction)) {
+          return { ready: true, matches: true };
+        }
+        editor.focus();
+        const selection = window.getSelection();
+        const range = document.createRange();
+        range.selectNodeContents(editor);
+        selection?.removeAllRanges();
+        selection?.addRange(range);
+        return { ready: true, matches: false };
+      })()`,
+      contextId: executionContextId,
+      returnByValue: true,
+    });
+    if (!prepared.result.value?.ready) {
+      await new Promise((resolve) => setTimeout(resolve, 80));
+      continue;
+    }
+    if (prepared.result.value.matches) return { prefilled: true };
+
+    await cdp.send("Input.insertText", { text: "$" });
+    break;
+  }
+
+  let selectedSkill = false;
+  while (Date.now() < deadline) {
+    const selection = await cdp.send("Runtime.evaluate", {
+      expression: `(() => {
+        const displayName = ${JSON.stringify(skillDisplayName)};
+        const overlay = Array.from(document.querySelectorAll(
+          '[data-composer-overlay-floating-ui="true"]'
+        )).find((candidate) => candidate.getClientRects().length > 0);
+        if (!overlay) return { ready: false };
+        const button = Array.from(overlay.querySelectorAll(
+          'button[data-list-navigation-item="true"]'
+        )).find((candidate) => Array.from(candidate.querySelectorAll("span"))
+          .some((label) => (label.textContent || "").trim() === displayName));
+        if (!button) return { ready: true, found: false };
+        button.click();
+        return { ready: true, found: true };
+      })()`,
+      contextId: executionContextId,
+      returnByValue: true,
+    });
+    if (selection.result.value?.found) {
+      selectedSkill = true;
+      break;
+    }
+    await new Promise((resolve) => setTimeout(resolve, 80));
+  }
+  if (!selectedSkill) {
+    throw new Error(`Timed out while selecting the ${skillDisplayName} Skill`);
+  }
+
+  let mentionReady = false;
+  while (Date.now() < deadline) {
+    const mention = await cdp.send("Runtime.evaluate", {
+      expression: `(() => {
+        const skillName = ${JSON.stringify(skillName)};
+        const skillPath = ${JSON.stringify(skillPath)};
+        const editor = Array.from(document.querySelectorAll(
+          '[data-codex-composer="true"][contenteditable="true"]'
+        )).find((candidate) => candidate.getClientRects().length > 0);
+        if (!editor) return { ready: false };
+        const selected = Array.from(editor.querySelectorAll("[skill-mention-name]"))
+          .find((candidate) => candidate.getAttribute("skill-mention-name") === skillName);
+        return {
+          ready: Boolean(selected),
+          pathMatches: selected?.getAttribute("skill-mention-path") === skillPath,
+        };
+      })()`,
+      contextId: executionContextId,
+      returnByValue: true,
+    });
+    if (mention.result.value?.ready) {
+      if (!mention.result.value.pathMatches) {
+        throw new Error(`Codex selected a different ${skillDisplayName} Skill`);
+      }
+      mentionReady = true;
+      break;
+    }
+    await new Promise((resolve) => setTimeout(resolve, 80));
+  }
+  if (!mentionReady) {
+    throw new Error(`Timed out while creating the ${skillDisplayName} Skill mention`);
+  }
+
+  await cdp.send("Input.insertText", { text: instruction });
+  while (Date.now() < deadline) {
+    const verified = await cdp.send("Runtime.evaluate", {
+      expression: `(() => {
+        const instruction = ${JSON.stringify(instruction)};
+        const skillName = ${JSON.stringify(skillName)};
+        const skillPath = ${JSON.stringify(skillPath)};
+        const editor = Array.from(document.querySelectorAll(
+          '[data-codex-composer="true"][contenteditable="true"]'
+        )).find((candidate) => candidate.getClientRects().length > 0);
+        const mention = editor && Array.from(editor.querySelectorAll("[skill-mention-name]"))
+          .find((candidate) => (
+            candidate.getAttribute("skill-mention-name") === skillName
+            && candidate.getAttribute("skill-mention-path") === skillPath
+          ));
+        return Boolean(mention && (editor.textContent || "").includes(instruction));
+      })()`,
+      contextId: executionContextId,
+      returnByValue: true,
+    });
+    if (verified.result.value === true) return { prefilled: true };
+    await new Promise((resolve) => setTimeout(resolve, 80));
+  }
+  throw new Error("Timed out while writing the issue instruction into the Codex composer");
+}
+
+async function sendHostResponse(cdp, executionContextId, response) {
+  await cdp.send("Runtime.evaluate", {
+    expression: `window.__codexTaskboardInjection__?.hostResponse(${JSON.stringify(response)})`,
+    contextId: executionContextId,
+    returnByValue: true,
+  });
+}
+
+async function installTaskboardHostBinding(cdp, supervisor) {
+  cdp.on("Runtime.bindingCalled", async (params) => {
+    if (params.name !== hostBindingName) return;
+    await handleHostBindingPayload(params, {
+      parseAutomationRequest: parseTaskboardAutomationHostRequest,
+      ensure: () => supervisor.ensure({ force: true }),
+      runAutomation: (request, executionContextId) => (
+        (async () => {
+          const rpc = (method, body) => requestCodexAutomationViaCdp(
+            cdp,
+            executionContextId,
+            method,
+            body,
+          );
+          const result = request.operation === "apply-policy"
+            ? await updateAndApplyQuotaPolicy(request, cdp, rpc)
+            : await reconcileTaskboardAutomation(request, rpc);
+          if (request.operation === "list") {
+            const policy = await readStoredAutomationPolicy(request.taskboardProjectId);
+            return { ...result, ...(policy ? { policy } : {}) };
+          }
+          return result;
+        })()
+      ),
+      prefill: (request, executionContextId) => (
+        prefillTaskComposerViaCdp(cdp, executionContextId, request)
+      ),
+      sendResponse: (executionContextId, response) => (
+        sendHostResponse(cdp, executionContextId, response)
+      ),
+    });
+  });
+  await cdp.send("Runtime.addBinding", { name: hostBindingName });
+  await restoreQuotaPolicies(cdp);
+}
+
+async function publishHostHeartbeat(cdp, startupToken) {
+  await cdp.send("Runtime.evaluate", {
+    expression: `(() => {
+      window[${JSON.stringify(hostHeartbeatName)}] = Date.now();
+      window[${JSON.stringify(hostStartupTokenName)}] = ${JSON.stringify(startupToken)};
+    })()`,
+    returnByValue: true,
+  });
+}
+
+async function readInjectionStatus(cdp) {
+  const status = await cdp.send("Runtime.evaluate", {
+    expression: `({
+      version: window.__codexTaskboardInjection__?.version || null,
+      sourceHash: window.__codexTaskboardInjection__?.sourceHash || null,
+      scriptIdentifier: window[${JSON.stringify(injectionScriptIdentifierName)}] || null,
+      entryMounted: Boolean(document.getElementById("codex-taskboard-entry")),
+      pageMounted: Boolean(document.getElementById("codex-taskboard-page")),
+      pageVisible: document.getElementById("codex-taskboard-page")?.hidden === false,
+      frameUrl: document.getElementById("codex-taskboard-frame")?.src || null
+    })`,
+    returnByValue: true,
+  });
+  return status.result.value;
+}
+
+async function waitForInjectionStatus(cdp, shouldOpen, expectedSourceHash, timeoutMs) {
+  const deadline = Date.now() + timeoutMs;
+  let status = await readInjectionStatus(cdp);
+  while (
+    Date.now() < deadline
+    && (
+      status.sourceHash !== expectedSourceHash
+      || !status.entryMounted
+      || (shouldOpen && (!status.pageVisible || !status.frameUrl))
+    )
+  ) {
+    await new Promise((resolve) => setTimeout(resolve, 250));
+    status = await readInjectionStatus(cdp);
+  }
+  return status;
+}
+
+async function evaluateInjectionSource(cdp, source) {
+  const evaluation = await cdp.send("Runtime.evaluate", {
+    expression: source,
+    awaitPromise: true,
+    returnByValue: true,
+  });
+  if (evaluation.exceptionDetails) {
+    throw new Error(
+      evaluation.exceptionDetails.exception?.description || "Taskboard injection failed",
+    );
+  }
+}
+
+async function publishInjectionScriptIdentifier(cdp, scriptIdentifier) {
+  await cdp.send("Runtime.evaluate", {
+    expression: `window[${JSON.stringify(injectionScriptIdentifierName)}] = ${JSON.stringify(scriptIdentifier)}`,
+    returnByValue: true,
+  });
+}
+
+async function registerInjectionSource(cdp, source) {
+  const registration = await cdp.send("Page.addScriptToEvaluateOnNewDocument", {
+    source: `${source}\n//# sourceURL=codex-taskboard.user.js`,
+  });
+  return registration.identifier;
+}
+
+async function injectTarget(
+  target,
+  source,
+  sourceHash,
+  shouldOpen,
+  screenshotPath,
+  keepAlive,
+  supervisor,
+  attachExisting,
+  startupToken,
+) {
+  const cdp = new CdpConnection(target.webSocketDebuggerUrl);
+  let retained = false;
+  await cdp.open();
+  try {
+    await cdp.send("Page.enable");
+    await cdp.send("Page.setBypassCSP", { enabled: true });
+    await cdp.send("Runtime.enable");
+    if (keepAlive) await installTaskboardHostBinding(cdp, supervisor);
+    if (keepAlive && attachExisting) {
+      const currentStatus = await readInjectionStatus(cdp);
+      const reconciled = await reconcileInjectionRuntime({
+        currentStatus,
+        source,
+        sourceHash,
+        removeRegisteredSource: (identifier) => cdp.send(
+          "Page.removeScriptToEvaluateOnNewDocument",
+          { identifier },
+        ),
+        registerCurrentSource: (currentSource) => registerInjectionSource(cdp, currentSource),
+        evaluateCurrentSource: (currentSource) => evaluateInjectionSource(cdp, currentSource),
+        publishRegistration: (identifier) => publishInjectionScriptIdentifier(cdp, identifier),
+        reopen: () => cdp.send("Runtime.evaluate", {
+          expression: "window.__codexTaskboardInjection__?.open()",
+          returnByValue: true,
+        }),
+      });
+      cdp.on("Page.loadEventFired", () => (
+        publishInjectionScriptIdentifier(cdp, reconciled.scriptIdentifier)
+      ));
+      await publishHostHeartbeat(cdp, startupToken);
+      const status = await waitForInjectionStatus(
+        cdp,
+        reconciled.shouldRemainOpen,
+        sourceHash,
+        15_000,
+      );
+      const frameLoaded = status.frameUrl
+        ? await waitForFrame(cdp, status.frameUrl, 15_000)
+        : false;
+      retained = true;
+      return {
+        result: { ...status, cspBypassed: true, frameLoaded },
+        connection: cdp,
+      };
+    }
+    const scriptIdentifier = await registerInjectionSource(cdp, source);
+    cdp.on("Page.loadEventFired", () => (
+      publishInjectionScriptIdentifier(cdp, scriptIdentifier)
+    ));
+    const reloaded = cdp.waitFor("Page.loadEventFired", 15_000);
+    await cdp.send("Page.reload");
+    await reloaded;
+    await evaluateInjectionSource(cdp, source);
+    await publishInjectionScriptIdentifier(cdp, scriptIdentifier);
+    if (keepAlive) await publishHostHeartbeat(cdp, startupToken);
+    if (shouldOpen) {
+      await cdp.send("Runtime.evaluate", {
+        expression: `(() => {
+          const taskboard = window.__codexTaskboardInjection__;
+          taskboard?.close();
+          taskboard?.open();
+        })()`,
+      });
+      await new Promise((resolve) => setTimeout(resolve, 500));
+    }
+    const status = await waitForInjectionStatus(cdp, shouldOpen, sourceHash, 15_000);
+    const frameLoaded = status.frameUrl
+      ? await waitForFrame(cdp, status.frameUrl, 15_000)
+      : false;
+    if (shouldOpen && !frameLoaded) {
+      throw new Error("Taskboard iframe did not finish loading in the Codex renderer");
+    }
+    const result = {
+      ...status,
+      cspBypassed: true,
+      frameLoaded,
+    };
+    if (screenshotPath) {
+      const screenshot = await cdp.send("Page.captureScreenshot", { format: "png" });
+      await writeFile(screenshotPath, Buffer.from(screenshot.data, "base64"));
+      result.screenshot = screenshotPath;
+    }
+    retained = keepAlive;
+    return { result, connection: retained ? cdp : null };
+  } finally {
+    if (!retained) cdp.close();
+  }
+}
+
+async function injectAll(
+  port,
+  source,
+  sourceHash,
+  shouldOpen,
+  screenshotPath,
+  injectedTargets,
+  keepAlive,
+  supervisor,
+  attachExisting,
+  startupToken,
+) {
+  const targets = await codexTargets(port);
+  if (targets.length === 0) throw new Error("No Codex renderer target found");
+
+  const activeIds = new Set(targets.map((target) => target.id));
+  for (const [id, connection] of injectedTargets) {
+    if (!activeIds.has(id) || connection.closed) {
+      connection.close();
+      injectedTargets.delete(id);
+    }
+  }
+
+  const results = [];
+  for (const target of targets) {
+    if (injectedTargets.has(target.id)) continue;
+    const firstTarget = injectedTargets.size === 0 && results.length === 0;
+    const { result, connection } = await injectTarget(
+      target,
+      source,
+      sourceHash,
+      shouldOpen && firstTarget,
+      firstTarget ? screenshotPath : null,
+      keepAlive,
+      supervisor,
+      attachExisting,
+      startupToken,
+    );
+    if (connection) injectedTargets.set(target.id, connection);
+    results.push({ targetId: target.id, title: target.title, url: target.url, ...result });
+  }
+  return results;
+}
+
+async function injectInitialWhenRendererReady(options) {
+  const deadline = Date.now() + (options.keepAlive ? 30_000 : 0);
+  while (true) {
+    try {
+      return await injectAll(
+        options.port,
+        options.source,
+        options.sourceHash,
+        options.shouldOpen,
+        options.screenshotPath,
+        options.injectedTargets,
+        options.keepAlive,
+        options.supervisor,
+        options.attachExisting,
+        options.startupToken,
+      );
+    } catch (error) {
+      if (
+        !options.keepAlive
+        || error.message !== "No Codex renderer target found"
+        || Date.now() >= deadline
+      ) {
+        throw error;
+      }
+      console.error(`Waiting for Codex renderer: ${error.message}`);
+      await new Promise((resolve) => setTimeout(resolve, 500));
+    }
+  }
+}
+
+async function currentInjectionSource() {
+  const userScript = await readFile(injectionPath, "utf8");
+  const runtimeSource = `window.__CODEX_TASKBOARD_MANAGED_ORIGIN__ = ${JSON.stringify(taskboardOrigin)};
+if (typeof window.__CODEX_TASKBOARD_URL__ !== "string" || !window.__CODEX_TASKBOARD_URL__.trim()) {
+  window.__CODEX_TASKBOARD_URL__ = ${JSON.stringify(taskboardPageUrl)};
+}
+${userScript}`;
+  const sourceHash = createHash("sha256").update(runtimeSource).digest("hex");
+  return {
+    sourceHash,
+    source: `window[${JSON.stringify(injectionSourceHashName)}] = ${JSON.stringify(sourceHash)};
+${runtimeSource}`,
+  };
+}
+
+async function main() {
+  const options = parseArgs(process.argv.slice(2));
+
+  if (options.daemon) {
+    let port = options.port;
+    if (!options.portExplicit) {
+      const candidates = codexDebuggingPorts(options.port);
+      const activePort = await Promise.any(candidates.map(async (candidate) => {
+        if (!(await resolveCdpBaseUrl(candidate))) {
+          throw new Error("unreachable");
+        }
+        if ((await codexTargets(candidate)).length === 0) throw new Error("not Codex");
+        return candidate;
+      })).catch(() => null);
+      if (!activePort) throw new Error("No debuggable Codex window found");
+      port = activePort;
+    }
+    console.log(JSON.stringify({ launcher: startResidentInjector(port, options.open), port }, null, 2));
+    return;
+  }
+
+  if (options.refresh || options.refreshIfRunning) {
+    const ports = options.portExplicit
+      ? [options.port]
+      : codexDebuggingPorts(options.port);
+    const refreshed = [];
+    for (const port of ports) {
+      if (!(await resolveCdpBaseUrl(port))) continue;
+      if (options.refreshIfRunning) await restartResidentInjectorForRefresh(port);
+      const results = await refreshTaskboardFrames(port);
+      refreshed.push(...results.map((result) => ({ port, ...result })));
+    }
+    if (refreshed.length === 0) {
+      if (options.refreshIfRunning) {
+        console.log(JSON.stringify({ refreshed: [], skipped: "No debuggable Codex window is running" }));
+        return;
+      }
+      throw new Error(`No debuggable Codex window found on ports: ${ports.join(", ")}`);
+    }
+    console.log(JSON.stringify({ refreshed }, null, 2));
+    return;
+  }
+
+  let codexProcess = null;
+  const supervisor = createTaskboardSupervisor({
+    detached: !options.watch || options.backgroundTaskboard,
+  });
+
+  try {
+    const cdpReachable = Boolean(await resolveCdpBaseUrl(options.port));
+    if (!cdpReachable) {
+      if (!options.launch) {
+        throw new Error(`Codex CDP is not listening on ${cdpHosts.map((host) => `${host}:${options.port}`).join(" or ")}`);
+      }
+      if (codexIsRunning()) {
+        throw new Error(
+          "Codex is already running without this CDP port. Quit Codex completely, then run this command again.",
+        );
+      }
+    }
+
+    await supervisor.ensure({ force: true });
+
+    if (!cdpReachable) {
+      codexProcess = launchCodex(options.appPath, options.port);
+      await waitUntilCdpReachable(options.port, 30_000);
+    }
+
+    const { source, sourceHash } = await currentInjectionSource();
+    const injectedTargets = new Map();
+    const firstResults = await injectInitialWhenRendererReady({
+      port: options.port,
+      source,
+      sourceHash,
+      shouldOpen: options.open,
+      screenshotPath: options.screenshot,
+      injectedTargets,
+      keepAlive: options.watch,
+      supervisor,
+      attachExisting: options.attachExisting,
+      startupToken: options.startupToken,
+    });
+    console.log(JSON.stringify({ injected: firstResults }, null, 2));
+
+    if (!options.watch) {
+      codexProcess?.unref();
+      return;
+    }
+
+    const stop = () => {
+      injectedTargets.forEach((connection) => connection.close());
+      supervisor.stop();
+      process.exit(0);
+    };
+    process.once("SIGINT", stop);
+    process.once("SIGTERM", stop);
+
+    while (true) {
+      await new Promise((resolve) => setTimeout(resolve, 2_000));
+      if (!(await resolveCdpBaseUrl(options.port))) break;
+      try {
+        await supervisor.ensure();
+      } catch (error) {
+        console.error(`Waiting for Taskboard service: ${error.message}`);
+      }
+      for (const connection of injectedTargets.values()) {
+        try {
+          await publishHostHeartbeat(connection, options.startupToken);
+        } catch (_) {}
+      }
+      try {
+        const results = await injectAll(
+          options.port,
+          source,
+          sourceHash,
+          false,
+          null,
+          injectedTargets,
+          true,
+          supervisor,
+          options.attachExisting,
+          options.startupToken,
+        );
+        if (results.length > 0) console.log(JSON.stringify({ injected: results }, null, 2));
+      } catch (error) {
+        if ((codexProcess && codexProcess.exitCode !== null) || !(await resolveCdpBaseUrl(options.port))) {
+          break;
+        }
+        console.error(`Waiting for Codex renderer: ${error.message}`);
+      }
+    }
+    supervisor.stop();
+  } catch (error) {
+    supervisor.stop();
+    throw error;
+  }
+}
+
+main().catch((error) => {
+  console.error(error.message);
+  process.exitCode = 1;
+});
diff --git a/apps/codex-taskboard/scripts/codex-rate-limits.mjs b/apps/codex-taskboard/scripts/codex-rate-limits.mjs
new file mode 100644
index 000000000..9a54fc8e3
--- /dev/null
+++ b/apps/codex-taskboard/scripts/codex-rate-limits.mjs
@@ -0,0 +1,156 @@
+import { spawn } from "node:child_process";
+import readline from "node:readline";
+
+const REQUEST_TIMEOUT_MS = 8_000;
+
+export async function readCodexQuotaStatus(model) {
+  const checkedAt = Date.now();
+  try {
+    const session = startAppServer();
+    try {
+      await session.request("initialize", {
+        clientInfo: { name: "codex-taskboard", version: "0.1.0" },
+      });
+      session.notify("initialized", {});
+      const account = await session.request("account/read", { refreshToken: false });
+      if (account?.account?.type === "apiKey") {
+        return { state: "unavailable", reason: "api-key", checkedAt };
+      }
+      if (account?.account?.type !== "chatgpt") {
+        return { state: "unknown", checkedAt };
+      }
+      const result = await session.request("account/rateLimits/read", {});
+      return evaluateRateLimits(result, model, checkedAt);
+    } finally {
+      session.close();
+    }
+  } catch {
+    return { state: "unknown", checkedAt };
+  }
+}
+
+function startAppServer() {
+  const child = spawn("codex", ["app-server", "--stdio"], {
+    stdio: ["pipe", "pipe", "ignore"],
+  });
+  const pending = new Map();
+  let sequence = 0;
+  let closed = false;
+  const lines = readline.createInterface({ input: child.stdout });
+
+  lines.on("line", (line) => {
+    let message;
+    try {
+      message = JSON.parse(line);
+    } catch {
+      return;
+    }
+    if (!Number.isInteger(message?.id)) return;
+    const request = pending.get(message.id);
+    if (!request) return;
+    pending.delete(message.id);
+    clearTimeout(request.timeout);
+    if (message.error) request.reject(new Error("Codex App Server request failed"));
+    else request.resolve(message.result);
+  });
+
+  const failPending = () => {
+    if (closed) return;
+    closed = true;
+    for (const request of pending.values()) {
+      clearTimeout(request.timeout);
+      request.reject(new Error("Codex App Server stopped"));
+    }
+    pending.clear();
+  };
+  child.once("error", failPending);
+  child.once("exit", failPending);
+
+  function write(message) {
+    child.stdin.write(`${JSON.stringify(message)}\n`);
+  }
+
+  return {
+    request(method, params) {
+      const id = ++sequence;
+      return new Promise((resolve, reject) => {
+        const timeout = setTimeout(() => {
+          pending.delete(id);
+          reject(new Error("Codex App Server request timed out"));
+        }, REQUEST_TIMEOUT_MS);
+        pending.set(id, { resolve, reject, timeout });
+        write({ id, method, params });
+      });
+    },
+    notify(method, params) {
+      write({ method, params });
+    },
+    close() {
+      closed = true;
+      lines.close();
+      child.stdin.end();
+      child.kill("SIGTERM");
+      for (const request of pending.values()) {
+        clearTimeout(request.timeout);
+        request.reject(new Error("Codex App Server stopped"));
+      }
+      pending.clear();
+    },
+  };
+}
+
+function evaluateRateLimits(result, model, checkedAt) {
+  const snapshots = result?.rateLimitsByLimitId;
+  const entries = snapshots && typeof snapshots === "object" && !Array.isArray(snapshots)
+    ? Object.entries(snapshots).filter(([, snapshot]) => (
+    snapshot && typeof snapshot === "object"
+    ))
+    : [];
+  const normalizedModel = normalizeName(model);
+  const snapshot = entries.find(([, value]) => (
+    normalizeName(value.limitName) === normalizedModel
+  ))?.[1]
+    ?? entries.find(([limitId]) => limitId === "codex")?.[1]
+    ?? (
+      result?.rateLimits
+      && typeof result.rateLimits === "object"
+      && !Array.isArray(result.rateLimits)
+        ? result.rateLimits
+        : null
+    );
+  if (!snapshot) return { state: "unknown", checkedAt };
+
+  const windows = [snapshot.primary, snapshot.secondary].filter(Boolean);
+  const creditsAvailable = snapshot.credits?.unlimited === true
+    || snapshot.credits?.hasCredits === true;
+  const exhaustedWindows = windows.filter((window) => (
+    Number(window.usedPercent) >= 100
+  ));
+  const individuallyExhausted = Number(snapshot.individualLimit?.remainingPercent) <= 0;
+  const blocked = Boolean(snapshot.rateLimitReachedType)
+    || snapshot.spendControlReached === true
+    || individuallyExhausted
+    || (exhaustedWindows.length > 0 && !creditsAvailable);
+
+  if (!blocked) return { state: "available", checkedAt };
+
+  const resetCandidates = [
+    ...exhaustedWindows.map((window) => Number(window.resetsAt)),
+    Number(snapshot.individualLimit?.resetsAt),
+  ];
+  if (snapshot.rateLimitReachedType || snapshot.spendControlReached === true) {
+    resetCandidates.push(...windows.map((window) => Number(window.resetsAt)));
+  }
+  const resetsAt = Math.max(...resetCandidates.filter(Number.isFinite));
+  return {
+    state: "blocked",
+    checkedAt,
+    ...(Number.isFinite(resetsAt) ? { resetsAt } : {}),
+  };
+}
+
+function normalizeName(value) {
+  return typeof value === "string"
+    ? value.toLowerCase().replace(/[^a-z0-9]+/g, "")
+    : "";
+}
diff --git a/apps/codex-taskboard/scripts/dev.mjs b/apps/codex-taskboard/scripts/dev.mjs
new file mode 100644
index 000000000..34929e9a1
--- /dev/null
+++ b/apps/codex-taskboard/scripts/dev.mjs
@@ -0,0 +1,28 @@
+import { spawn } from "node:child_process";
+
+const children = [
+  spawn(process.execPath, ["--watch", "server/index.mjs", "--dev"], {
+    stdio: "inherit",
+  }),
+  spawn(process.platform === "win32" ? "npm.cmd" : "npm", ["run", "dev:web"], {
+    stdio: "inherit",
+  }),
+];
+
+let shuttingDown = false;
+
+function stop(exitCode = 0) {
+  if (shuttingDown) return;
+  shuttingDown = true;
+  for (const child of children) child.kill("SIGTERM");
+  process.exitCode = exitCode;
+}
+
+for (const child of children) {
+  child.on("exit", (code, signal) => {
+    if (!shuttingDown && code !== 0 && signal !== "SIGTERM") stop(code ?? 1);
+  });
+}
+
+process.on("SIGINT", () => stop());
+process.on("SIGTERM", () => stop());
diff --git a/apps/codex-taskboard/scripts/migrate-to-cloud.mjs b/apps/codex-taskboard/scripts/migrate-to-cloud.mjs
new file mode 100644
index 000000000..3eab1289c
--- /dev/null
+++ b/apps/codex-taskboard/scripts/migrate-to-cloud.mjs
@@ -0,0 +1,787 @@
+#!/usr/bin/env node
+
+import { createHash } from "node:crypto";
+import {
+  chmod,
+  lstat,
+  mkdir,
+  mkdtemp,
+  readFile,
+  rm,
+  writeFile,
+} from "node:fs/promises";
+import os from "node:os";
+import path from "node:path";
+import { pathToFileURL } from "node:url";
+import { DatabaseSync } from "node:sqlite";
+
+const SCHEMA_VERSION = 1;
+const WRANGLER_D1_STATEMENT_MAX_BYTES = 90_000;
+const TABLE_ORDER = [
+  "projects",
+  "tasks",
+  "comments",
+  "task_relations",
+  "attachments",
+  "workflow_workspaces",
+];
+const LOCAL_WORKFLOW_PATH_FIELDS = new Set(["gitWorktreePath"]);
+const SORT_FIELDS = {
+  projects: ["id"],
+  tasks: ["project_id", "identifier", "id"],
+  comments: ["task_id", "created_at", "id"],
+  task_relations: ["source_task_id", "target_task_id", "relation_type"],
+  attachments: ["task_id", "comment_id", "created_at", "id"],
+  workflow_workspaces: ["project_id"],
+};
+function compareValues(left, right) {
+  if (left === right) return 0;
+  if (left == null) return -1;
+  if (right == null) return 1;
+  return String(left) < String(right) ? -1 : 1;
+}
+
+function sortRows(table, rows) {
+  const fields = SORT_FIELDS[table];
+  return rows.sort((left, right) => {
+    for (const field of fields) {
+      const comparison = compareValues(left[field], right[field]);
+      if (comparison !== 0) return comparison;
+    }
+    return 0;
+  });
+}
+
+function sqliteString(value) {
+  return `'${String(value).replaceAll("'", "''")}'`;
+}
+
+function sanitizeWorkflowValue(value) {
+  if (Array.isArray(value)) return value.map(sanitizeWorkflowValue);
+  if (!value || typeof value !== "object") return value;
+
+  return Object.fromEntries(
+    Object.entries(value).map(([key, child]) => [
+      key,
+      LOCAL_WORKFLOW_PATH_FIELDS.has(key) ? null : sanitizeWorkflowValue(child),
+    ]),
+  );
+}
+
+function sanitizeWorkflowRow(row) {
+  let workspace;
+  try {
+    workspace = JSON.parse(row.workspace);
+  } catch {
+    throw new Error(`Workflow workspace for project '${row.project_id}' is not valid JSON`);
+  }
+  return {
+    ...row,
+    workspace: JSON.stringify(sanitizeWorkflowValue(workspace)),
+  };
+}
+
+function buildProjectCounts(tables) {
+  const counts = {};
+  for (const project of tables.projects) {
+    counts[project.id] = {
+      projects: 1,
+      tasks: 0,
+      comments: 0,
+      attachments: 0,
+      task_relations: 0,
+      workflow_workspaces: 0,
+    };
+  }
+
+  const taskProjects = new Map();
+  for (const task of tables.tasks) {
+    if (!counts[task.project_id]) {
+      throw new Error(`Task '${task.id}' references unknown project '${task.project_id}'`);
+    }
+    taskProjects.set(task.id, task.project_id);
+    counts[task.project_id].tasks += 1;
+  }
+  for (const comment of tables.comments) {
+    const projectId = taskProjects.get(comment.task_id);
+    if (!projectId) throw new Error(`Comment '${comment.id}' references unknown task '${comment.task_id}'`);
+    counts[projectId].comments += 1;
+  }
+  for (const attachment of tables.attachments) {
+    const projectId = taskProjects.get(attachment.task_id);
+    if (!projectId) {
+      throw new Error(`Attachment '${attachment.id}' references unknown task '${attachment.task_id}'`);
+    }
+    counts[projectId].attachments += 1;
+  }
+  for (const relation of tables.task_relations) {
+    const projectId = taskProjects.get(relation.source_task_id);
+    if (!projectId) {
+      throw new Error(
+        `Task relation references unknown source task '${relation.source_task_id}'`,
+      );
+    }
+    counts[projectId].task_relations += 1;
+  }
+  for (const workspace of tables.workflow_workspaces) {
+    if (!counts[workspace.project_id]) {
+      throw new Error(`Workflow workspace references unknown project '${workspace.project_id}'`);
+    }
+    counts[workspace.project_id].workflow_workspaces += 1;
+  }
+
+  return Object.fromEntries(
+    Object.entries(counts).sort(([left], [right]) => (left < right ? -1 : 1)),
+  );
+}
+
+function assertSafeAttachmentId(id) {
+  if (
+    typeof id !== "string"
+    || id.length === 0
+    || id === "."
+    || id === ".."
+    || id.includes("/")
+    || id.includes("\\")
+    || id.includes("\0")
+  ) {
+    throw new Error(`Attachment id '${id}' is not safe to migrate`);
+  }
+}
+
+function attachmentObjectKey(attachmentId) {
+  return attachmentId;
+}
+
+async function readAttachmentPayloads(tables, attachmentsDirectory) {
+  const taskProjects = new Map(tables.tasks.map((task) => [task.id, task.project_id]));
+  const payloads = [];
+
+  for (const attachment of tables.attachments) {
+    assertSafeAttachmentId(attachment.id);
+    const sourcePath = path.join(attachmentsDirectory, attachment.id);
+    let file;
+    try {
+      file = await lstat(sourcePath);
+    } catch (error) {
+      if (error?.code === "ENOENT") {
+        throw new Error(`Attachment '${attachment.id}' is missing from '${attachmentsDirectory}'`);
+      }
+      throw error;
+    }
+    if (!file.isFile()) {
+      throw new Error(`Attachment '${attachment.id}' is not a regular file`);
+    }
+
+    const body = await readFile(sourcePath);
+    if (attachment.size !== body.byteLength) {
+      throw new Error(
+        `Attachment '${attachment.id}' size mismatch: SQLite=${attachment.size}, file=${body.byteLength}`,
+      );
+    }
+    const projectId = taskProjects.get(attachment.task_id);
+    payloads.push({
+      id: attachment.id,
+      projectId,
+      objectKey: attachmentObjectKey(attachment.id),
+      size: body.byteLength,
+      sha256: createHash("sha256").update(body).digest("hex"),
+      body,
+    });
+  }
+
+  return payloads;
+}
+
+async function readSnapshot(databasePath) {
+  const snapshotDirectory = await mkdtemp(path.join(os.tmpdir(), "taskboard-cloud-snapshot-"));
+  const snapshotPath = path.join(snapshotDirectory, "taskboard.sqlite");
+  let source;
+  let snapshot;
+  try {
+    source = new DatabaseSync(databasePath, { readOnly: true });
+    source.exec(`PRAGMA busy_timeout = 5000; VACUUM INTO ${sqliteString(snapshotPath)}`);
+    source.close();
+    source = null;
+
+    snapshot = new DatabaseSync(snapshotPath, { readOnly: true });
+    const integrity = snapshot.prepare("PRAGMA integrity_check").all();
+    if (
+      integrity.length !== 1
+      || String(Object.values(integrity[0])[0]).toLowerCase() !== "ok"
+    ) {
+      throw new Error("SQLite snapshot failed PRAGMA integrity_check");
+    }
+    const foreignKeyViolations = snapshot.prepare("PRAGMA foreign_key_check").all();
+    if (foreignKeyViolations.length > 0) {
+      throw new Error(
+        `SQLite snapshot failed PRAGMA foreign_key_check (${foreignKeyViolations.length} violation(s))`,
+      );
+    }
+    const tables = Object.fromEntries(
+      TABLE_ORDER.map((table) => [
+        table,
+        sortRows(table, snapshot.prepare(`SELECT * FROM "${table}"`).all()),
+      ]),
+    );
+    snapshot.close();
+    snapshot = null;
+    return tables;
+  } finally {
+    snapshot?.close();
+    source?.close();
+    await rm(snapshotDirectory, { recursive: true, force: true });
+  }
+}
+
+function assertCountsMatch(expected, actual) {
+  const expectedProjects = Object.keys(expected).sort();
+  const actualProjects = Object.keys(actual ?? {}).sort();
+  if (JSON.stringify(expectedProjects) !== JSON.stringify(actualProjects)) {
+    throw new Error(
+      `Cloud count mismatch: expected projects ${expectedProjects.join(", ")}, got ${actualProjects.join(", ")}`,
+    );
+  }
+  for (const projectId of expectedProjects) {
+    for (const table of TABLE_ORDER) {
+      const expectedCount = Number(expected[projectId][table]);
+      const actualCount = Number(actual[projectId]?.[table]);
+      if (actualCount !== expectedCount) {
+        throw new Error(
+          `Cloud count mismatch for project '${projectId}' table '${table}': expected ${expectedCount}, got ${actualCount}`,
+        );
+      }
+    }
+  }
+}
+
+function validateBundle(bundle) {
+  if (!bundle || bundle.schemaVersion !== SCHEMA_VERSION) {
+    throw new Error(`Unsupported cloud migration schema version '${bundle?.schemaVersion}'`);
+  }
+  for (const table of TABLE_ORDER) {
+    if (!Array.isArray(bundle.tables?.[table])) {
+      throw new Error(`Cloud migration bundle is missing table '${table}'`);
+    }
+  }
+  if (!Array.isArray(bundle.attachments)) {
+    throw new Error("Cloud migration bundle is missing attachment payloads");
+  }
+
+  const calculatedCounts = buildProjectCounts(bundle.tables);
+  assertCountsMatch(calculatedCounts, bundle.counts?.byProject);
+  const attachmentRows = new Map(bundle.tables.attachments.map((row) => [row.id, row]));
+  const attachmentPayloads = new Map(
+    bundle.attachments.map((attachment) => [attachment.id, attachment]),
+  );
+  if (
+    attachmentRows.size !== bundle.tables.attachments.length
+    || attachmentPayloads.size !== bundle.attachments.length
+    || attachmentRows.size !== attachmentPayloads.size
+  ) {
+    throw new Error("Cloud migration attachment metadata and payload counts do not match");
+  }
+  const taskProjects = new Map(
+    bundle.tables.tasks.map((task) => [task.id, task.project_id]),
+  );
+  for (const row of attachmentRows.values()) {
+    const attachment = attachmentPayloads.get(row.id);
+    if (!attachment) {
+      throw new Error(`Attachment metadata '${row.id}' has no payload`);
+    }
+    const body = Buffer.from(attachment.body);
+    const sha256 = createHash("sha256").update(body).digest("hex");
+    if (body.byteLength !== attachment.size) {
+      throw new Error(`Attachment '${attachment.id}' size verification failed`);
+    }
+    if (sha256 !== attachment.sha256) {
+      throw new Error(`Attachment '${attachment.id}' SHA-256 verification failed`);
+    }
+    if (Number(row.size) !== attachment.size) {
+      throw new Error(`Attachment '${attachment.id}' metadata size does not match its payload`);
+    }
+    const projectId = taskProjects.get(row.task_id);
+    if (attachment.projectId !== projectId) {
+      throw new Error(
+        `Attachment '${attachment.id}' project does not match its task project`,
+      );
+    }
+    if (attachment.objectKey !== attachmentObjectKey(attachment.id)) {
+      throw new Error(`Attachment '${attachment.id}' object key must match its id`);
+    }
+    if (
+      typeof attachment.objectKey !== "string"
+      || path.posix.isAbsolute(attachment.objectKey)
+      || attachment.objectKey.split("/").includes("..")
+    ) {
+      throw new Error(`Attachment '${attachment.id}' has an unsafe object key`);
+    }
+  }
+}
+
+export async function createCloudMigrationBundle({
+  databasePath,
+  attachmentsDirectory,
+}) {
+  const tables = await readSnapshot(databasePath);
+  tables.projects = tables.projects.map((project) => ({
+    ...project,
+    workspace_path: null,
+  }));
+  tables.tasks = tables.tasks.map((task) => ({
+    ...task,
+    worktree_path: null,
+  }));
+  tables.workflow_workspaces = tables.workflow_workspaces.map(sanitizeWorkflowRow);
+
+  return {
+    schemaVersion: SCHEMA_VERSION,
+    createdAt: new Date().toISOString(),
+    counts: {
+      byProject: buildProjectCounts(tables),
+    },
+    tables,
+    attachments: await readAttachmentPayloads(tables, attachmentsDirectory),
+  };
+}
+
+const CLOUD_COLUMNS = {
+  projects: ["id", "name", "workspace_path", "next_task_number", "created_at", "updated_at"],
+  tasks: [
+    "id", "identifier", "project_id", "title", "description", "status", "priority", "labels",
+    "sort_order", "thread_id", "creator_type", "creator_id", "creator_name",
+    "creator_avatar_url", "assignee_type", "assignee_id", "assignee_name",
+    "assignee_avatar_url", "workflow_id", "development_context_type", "development_branch",
+    "due_date", "recurrence_interval", "recurrence_unit", "archived_at", "version",
+    "created_at", "updated_at",
+  ],
+  comments: [
+    "id", "task_id", "body", "thread_id", "author_type", "author_id", "author_name",
+    "author_avatar_url", "version", "created_at", "updated_at",
+  ],
+  task_relations: ["relation_type", "source_task_id", "target_task_id", "created_at"],
+  attachments: ["id", "task_id", "comment_id", "filename", "content_type", "size", "created_at"],
+  workflow_workspaces: ["project_id", "workspace", "version", "updated_at"],
+};
+
+function cloudTaskRow(task) {
+  const isWorktree = task.worktree_branch != null;
+  return {
+    ...task,
+    development_context_type: isWorktree
+      ? "worktree"
+      : task.git_branch != null
+        ? "branch"
+        : null,
+    development_branch: isWorktree ? task.worktree_branch : task.git_branch,
+  };
+}
+
+function cloudRows(table, rows) {
+  return table === "tasks" ? rows.map(cloudTaskRow) : rows;
+}
+
+function insertTableSql(table) {
+  const columns = CLOUD_COLUMNS[table];
+  return `INSERT INTO "${table}" (${columns.map((column) => `"${column}"`).join(", ")})
+       SELECT ${columns.map((column) => `json_extract(value, '$.${column}')`).join(", ")}
+       FROM json_each(?)`;
+}
+
+export function createCloudD1ImportPlan(tables) {
+  return TABLE_ORDER.map((table) => {
+    const columns = CLOUD_COLUMNS[table];
+    const values = cloudRows(table, tables[table]).map((row) => (
+      Object.fromEntries(columns.map((column) => [column, row[column] ?? null]))
+    ));
+    return { table, sql: insertTableSql(table), json: JSON.stringify(values) };
+  });
+}
+
+function inlineD1InsertStatement(table, values) {
+  const json = JSON.stringify(values);
+  if (json.includes("\0")) throw new Error("D1 migration JSON cannot contain null bytes");
+  return `${insertTableSql(table).replace("?", sqliteString(json))};`;
+}
+
+export function createCloudD1ImportSql(tables) {
+  const statements = [];
+  for (const { table, json } of createCloudD1ImportPlan(tables)) {
+    const values = JSON.parse(json);
+    if (values.length === 0) {
+      statements.push(inlineD1InsertStatement(table, values));
+      continue;
+    }
+
+    let chunk = [];
+    for (const row of values) {
+      const candidate = [...chunk, row];
+      const statement = inlineD1InsertStatement(table, candidate);
+      if (Buffer.byteLength(statement, "utf8") < WRANGLER_D1_STATEMENT_MAX_BYTES) {
+        chunk = candidate;
+        continue;
+      }
+      if (chunk.length === 0) {
+        const identity = row.id ?? row.project_id ?? "unknown";
+        throw new Error(
+          `D1 import single row '${table}:${identity}' exceeds 90,000 bytes`,
+        );
+      }
+      statements.push(inlineD1InsertStatement(table, chunk));
+      chunk = [row];
+      if (
+        Buffer.byteLength(
+          inlineD1InsertStatement(table, chunk),
+          "utf8",
+        ) >= WRANGLER_D1_STATEMENT_MAX_BYTES
+      ) {
+        const identity = row.id ?? row.project_id ?? "unknown";
+        throw new Error(
+          `D1 import single row '${table}:${identity}' exceeds 90,000 bytes`,
+        );
+      }
+    }
+    statements.push(inlineD1InsertStatement(table, chunk));
+  }
+  return statements.join("\n");
+}
+
+export const CLOUD_PROJECT_COUNTS_SQL = `
+  SELECT p.id AS project_id, 1 AS projects,
+    (SELECT COUNT(*) FROM tasks t WHERE t.project_id = p.id) AS tasks,
+    (SELECT COUNT(*) FROM comments c JOIN tasks t ON t.id = c.task_id
+      WHERE t.project_id = p.id) AS comments,
+    (SELECT COUNT(*) FROM attachments a JOIN tasks t ON t.id = a.task_id
+      WHERE t.project_id = p.id) AS attachments,
+    (SELECT COUNT(*) FROM task_relations r JOIN tasks t ON t.id = r.source_task_id
+      WHERE t.project_id = p.id) AS task_relations,
+    (SELECT COUNT(*) FROM workflow_workspaces w
+      WHERE w.project_id = p.id) AS workflow_workspaces
+  FROM projects p ORDER BY p.id
+`;
+
+export function createCloudBindingMigrationAdapters({ d1, r2 }) {
+  return {
+    d1: {
+      async importTables(tables) {
+        await d1.batch(
+          createCloudD1ImportPlan(tables).map(({ sql, json }) => (
+            d1.prepare(sql).bind(json)
+          )),
+        );
+      },
+      async countByProject() {
+        const result = await d1.prepare(CLOUD_PROJECT_COUNTS_SQL).all();
+        return Object.fromEntries(result.results.map((row) => [
+          row.project_id,
+          Object.fromEntries(TABLE_ORDER.map((table) => [table, Number(row[table])])),
+        ]));
+      },
+    },
+    r2: {
+      put: (key, body, options) => r2.put(key, body, options),
+      head: (key) => r2.head(key),
+      delete: (key) => r2.delete(key),
+    },
+  };
+}
+
+async function verifyR2Attachments(bundle, r2) {
+  let verified = 0;
+  for (const attachment of bundle.attachments) {
+    const object = await r2.head(attachment.objectKey);
+    if (!object) throw new Error(`R2 object '${attachment.objectKey}' is missing`);
+    if (Number(object.size) !== attachment.size) {
+      throw new Error(`R2 size verification failed for attachment '${attachment.id}'`);
+    }
+    if (object.customMetadata?.sha256 !== attachment.sha256) {
+      throw new Error(`R2 SHA-256 hash verification failed for attachment '${attachment.id}'`);
+    }
+    verified += 1;
+  }
+  return verified;
+}
+
+export async function verifyCloudMigrationBundle(bundle, { d1, r2 }) {
+  validateBundle(bundle);
+  const counts = await d1.countByProject();
+  assertCountsMatch(bundle.counts.byProject, counts);
+  const verified = await verifyR2Attachments(bundle, r2);
+  return {
+    counts: { byProject: structuredClone(bundle.counts.byProject) },
+    attachments: { verified },
+  };
+}
+
+export async function importCloudMigrationBundle(bundle, { d1, r2 }) {
+  validateBundle(bundle);
+
+  const existingCounts = await d1.countByProject();
+  if (Object.keys(existingCounts).length > 0) {
+    throw new Error("Cloud migration target D1 is not empty");
+  }
+  for (const attachment of bundle.attachments) {
+    if (await r2.head(attachment.objectKey)) {
+      throw new Error(`R2 object '${attachment.objectKey}' already exists`);
+    }
+  }
+
+  const attachmentRows = new Map(bundle.tables.attachments.map((row) => [row.id, row]));
+  const uploadedKeys = [];
+  let d1Committed = false;
+  try {
+    for (const attachment of bundle.attachments) {
+      const row = attachmentRows.get(attachment.id);
+      await r2.put(attachment.objectKey, Buffer.from(attachment.body), {
+        customMetadata: { sha256: attachment.sha256 },
+        httpMetadata: { contentType: row.content_type },
+      });
+      uploadedKeys.push(attachment.objectKey);
+    }
+    const verified = await verifyR2Attachments(bundle, r2);
+
+    await d1.importTables(bundle.tables);
+    d1Committed = true;
+    const counts = await d1.countByProject();
+    assertCountsMatch(bundle.counts.byProject, counts);
+    return {
+      counts: { byProject: structuredClone(bundle.counts.byProject) },
+      attachments: { verified },
+    };
+  } catch (error) {
+    if (!d1Committed && typeof r2.delete === "function") {
+      const cleanup = await Promise.allSettled(uploadedKeys.map((key) => r2.delete(key)));
+      const failures = cleanup.filter((result) => result.status === "rejected");
+      if (failures.length > 0) {
+        throw new AggregateError(
+          [error, ...failures.map((result) => result.reason)],
+          `${error.message}; cleanup failed for ${failures.length} R2 object(s)`,
+        );
+      }
+    }
+    throw error;
+  }
+}
+
+function bundleFile(outputDirectory, relativePath) {
+  const resolvedRoot = path.resolve(outputDirectory);
+  const resolved = path.resolve(resolvedRoot, relativePath);
+  if (!resolved.startsWith(`${resolvedRoot}${path.sep}`)) {
+    throw new Error(`Unsafe bundle path '${relativePath}'`);
+  }
+  return resolved;
+}
+
+async function writePrivateFile(filename, contents) {
+  await writeFile(filename, contents, { mode: 0o600, flag: "wx" });
+  await chmod(filename, 0o600);
+}
+
+export async function writeCloudMigrationBundle(bundle, outputDirectory) {
+  validateBundle(bundle);
+  const parent = path.dirname(path.resolve(outputDirectory));
+  await mkdir(parent, { recursive: true });
+  await mkdir(outputDirectory, { mode: 0o700 });
+  try {
+    const dataDirectory = path.join(outputDirectory, "data");
+    const attachmentsDirectory = path.join(outputDirectory, "attachments");
+    await mkdir(dataDirectory, { mode: 0o700 });
+    await mkdir(attachmentsDirectory, { mode: 0o700 });
+
+    const tableFiles = {};
+    for (const table of TABLE_ORDER) {
+      const relativePath = `data/${table}.json`;
+      await writePrivateFile(
+        bundleFile(outputDirectory, relativePath),
+        `${JSON.stringify(bundle.tables[table], null, 2)}\n`,
+      );
+      tableFiles[table] = {
+        file: relativePath,
+        rows: bundle.tables[table].length,
+      };
+    }
+
+    const attachmentFiles = [];
+    for (const attachment of bundle.attachments) {
+      const relativePath = `attachments/${encodeURIComponent(attachment.id)}`;
+      await writePrivateFile(
+        bundleFile(outputDirectory, relativePath),
+        Buffer.from(attachment.body),
+      );
+      attachmentFiles.push({
+        id: attachment.id,
+        projectId: attachment.projectId,
+        objectKey: attachment.objectKey,
+        file: relativePath,
+        size: attachment.size,
+        sha256: attachment.sha256,
+      });
+    }
+
+    const manifest = {
+      schemaVersion: SCHEMA_VERSION,
+      createdAt: bundle.createdAt,
+      counts: bundle.counts,
+      tables: tableFiles,
+      attachments: attachmentFiles,
+    };
+    await writePrivateFile(
+      path.join(outputDirectory, "manifest.json"),
+      `${JSON.stringify(manifest, null, 2)}\n`,
+    );
+    return path.resolve(outputDirectory);
+  } catch (error) {
+    await rm(outputDirectory, { recursive: true, force: true });
+    throw error;
+  }
+}
+
+async function readJsonFile(filename, label) {
+  try {
+    return JSON.parse(await readFile(filename, "utf8"));
+  } catch (error) {
+    throw new Error(`Cannot read ${label}: ${error.message}`);
+  }
+}
+
+export async function readCloudMigrationBundle(inputDirectory) {
+  const manifest = await readJsonFile(
+    path.join(inputDirectory, "manifest.json"),
+    "cloud migration manifest",
+  );
+  if (manifest.schemaVersion !== SCHEMA_VERSION) {
+    throw new Error(`Unsupported cloud migration schema version '${manifest.schemaVersion}'`);
+  }
+
+  const tables = {};
+  for (const table of TABLE_ORDER) {
+    const entry = manifest.tables?.[table];
+    if (!entry?.file) throw new Error(`Cloud migration manifest is missing table '${table}'`);
+    const rows = await readJsonFile(
+      bundleFile(inputDirectory, entry.file),
+      `table '${table}'`,
+    );
+    if (!Array.isArray(rows) || rows.length !== entry.rows) {
+      throw new Error(`Cloud migration row count mismatch for table '${table}'`);
+    }
+    tables[table] = rows;
+  }
+
+  const attachments = [];
+  for (const entry of manifest.attachments ?? []) {
+    const body = await readFile(bundleFile(inputDirectory, entry.file));
+    attachments.push({ ...entry, body });
+  }
+  const bundle = {
+    schemaVersion: manifest.schemaVersion,
+    createdAt: manifest.createdAt,
+    counts: manifest.counts,
+    tables,
+    attachments,
+  };
+  validateBundle(bundle);
+  return bundle;
+}
+
+function parseOptions(args, allowed, required) {
+  const options = {};
+  for (let index = 0; index < args.length; index += 2) {
+    const flag = args[index];
+    const value = args[index + 1];
+    if (!flag?.startsWith("--") || value == null || value.startsWith("--")) {
+      throw new Error(`Expected a value after '${flag ?? ""}'`);
+    }
+    const name = flag.slice(2);
+    if (!allowed.has(name)) throw new Error(`Unknown option '--${name}'`);
+    if (Object.hasOwn(options, name)) throw new Error(`Duplicate option '--${name}'`);
+    options[name] = value;
+  }
+  for (const name of required) {
+    if (!options[name]) throw new Error(`Missing required option '--${name}'`);
+  }
+  return options;
+}
+
+const HELP = `Usage:
+  node scripts/migrate-to-cloud.mjs export --database <sqlite> --attachments <directory> --output <directory>
+  node scripts/migrate-to-cloud.mjs import --bundle <directory> --adapter <module>
+  node scripts/migrate-to-cloud.mjs verify --bundle <directory> --adapter <module>
+
+The bundled Wrangler adapter uses Wrangler authentication without reading or
+storing credentials. Remote operations require TASKBOARD_MIGRATION_REMOTE=1.`;
+
+async function loadAdapterModule(modulePath, context) {
+  const loaded = await import(pathToFileURL(path.resolve(modulePath)).href);
+  const factory = loaded.createCloudMigrationAdapters ?? loaded.default;
+  if (typeof factory !== "function") {
+    throw new Error(
+      "Adapter module must export createCloudMigrationAdapters or a default factory",
+    );
+  }
+  return factory(context);
+}
+
+export async function runCli(
+  argv,
+  {
+    stdout = process.stdout,
+    loadAdapters = loadAdapterModule,
+  } = {},
+) {
+  const [command, ...args] = argv;
+  if (!command || command === "--help" || command === "help") {
+    stdout.write(`${HELP}\n`);
+    return 0;
+  }
+
+  if (command === "export") {
+    const options = parseOptions(
+      args,
+      new Set(["database", "attachments", "output"]),
+      ["database", "attachments", "output"],
+    );
+    const bundle = await createCloudMigrationBundle({
+      databasePath: options.database,
+      attachmentsDirectory: options.attachments,
+    });
+    const output = await writeCloudMigrationBundle(bundle, options.output);
+    stdout.write(`${JSON.stringify({ output, counts: bundle.counts })}\n`);
+    return 0;
+  }
+
+  if (command !== "import" && command !== "verify") {
+    throw new Error(`Unknown command '${command}'`);
+  }
+  const options = parseOptions(
+    args,
+    new Set(["bundle", "adapter"]),
+    ["bundle", "adapter"],
+  );
+  const bundle = await readCloudMigrationBundle(options.bundle);
+  const adapters = await loadAdapters(options.adapter, { bundle, command });
+  if (!adapters?.d1 || !adapters?.r2) {
+    throw new Error("Adapter factory must return d1 and r2 adapters");
+  }
+  if (command === "import" && typeof adapters.d1.importTables !== "function") {
+    throw new Error("Import adapter must provide atomic d1.importTables");
+  }
+  if (command === "import" && typeof adapters.r2.delete !== "function") {
+    throw new Error("Import adapter must provide r2.delete for failed-migration cleanup");
+  }
+  try {
+    const result = command === "import"
+      ? await importCloudMigrationBundle(bundle, adapters)
+      : await verifyCloudMigrationBundle(bundle, adapters);
+    stdout.write(`${JSON.stringify(result)}\n`);
+  } finally {
+    await adapters.cleanup?.();
+  }
+  return 0;
+}
+
+if (process.argv[1] && import.meta.url === pathToFileURL(process.argv[1]).href) {
+  runCli(process.argv.slice(2)).catch((error) => {
+    process.stderr.write(`${error.message}\n`);
+    process.exitCode = 1;
+  });
+}
diff --git a/apps/codex-taskboard/scripts/wrangler-cloud-adapter.mjs b/apps/codex-taskboard/scripts/wrangler-cloud-adapter.mjs
new file mode 100644
index 000000000..1ba8e8790
--- /dev/null
+++ b/apps/codex-taskboard/scripts/wrangler-cloud-adapter.mjs
@@ -0,0 +1,222 @@
+import { execFile as execFileCallback } from "node:child_process";
+import { createHash } from "node:crypto";
+import {
+  chmod,
+  mkdtemp,
+  readFile,
+  rm,
+  writeFile,
+} from "node:fs/promises";
+import os from "node:os";
+import path from "node:path";
+import { promisify } from "node:util";
+import { fileURLToPath } from "node:url";
+
+import {
+  CLOUD_PROJECT_COUNTS_SQL,
+  createCloudD1ImportSql,
+} from "./migrate-to-cloud.mjs";
+
+const execFile = promisify(execFileCallback);
+const projectRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "..");
+
+const defaultWrangler = process.platform === "win32"
+  ? process.execPath
+  : path.join(projectRoot, "node_modules", ".bin", "wrangler");
+const defaultWranglerArgs = process.platform === "win32"
+  ? [path.join(projectRoot, "node_modules", "wrangler", "bin", "wrangler.js")]
+  : [];
+
+function parseD1Results(stdout) {
+  const parsed = JSON.parse(stdout);
+  const resultSets = Array.isArray(parsed) ? parsed : [parsed];
+  return resultSets.flatMap((result) => result.results ?? result.result?.[0]?.results ?? []);
+}
+
+function missingR2Object(error) {
+  const output = `${error?.message ?? ""}\n${error?.stdout ?? ""}\n${error?.stderr ?? ""}`;
+  return /not found|does not exist|NoSuchKey|10007/i.test(output);
+}
+
+export function createWranglerCloudAdapters({
+  remote,
+  persistTo,
+  configPath,
+  wranglerExecutable = defaultWrangler,
+  database = "codex-taskboard-db",
+  bucket = "codex-taskboard-attachments",
+  preparedImportSql,
+  environment = process.env,
+  runCommand = execFile,
+} = {}) {
+  const remoteEnabled = environment.TASKBOARD_MIGRATION_REMOTE === "1";
+  const useRemote = remote ?? remoteEnabled;
+  if (useRemote && !remoteEnabled) {
+    throw new Error("Remote migration requires TASKBOARD_MIGRATION_REMOTE=1");
+  }
+
+  const resolvedPersistTo = persistTo ?? environment.TASKBOARD_MIGRATION_PERSIST_TO;
+  if (!useRemote && !resolvedPersistTo) {
+    throw new Error(
+      "Local migration requires TASKBOARD_MIGRATION_PERSIST_TO",
+    );
+  }
+  const resolvedConfig = path.resolve(
+    configPath
+      ?? environment.TASKBOARD_MIGRATION_CONFIG
+      ?? path.join(projectRoot, "wrangler.jsonc"),
+  );
+  const modeArguments = useRemote
+    ? ["--remote"]
+    : ["--local", "--persist-to", path.resolve(resolvedPersistTo)];
+  const temporaryDirectory = mkdtemp(
+    path.join(os.tmpdir(), "taskboard-wrangler-migration-"),
+  ).then(async (directory) => {
+    await chmod(directory, 0o700);
+    return directory;
+  });
+  let commandQueue = Promise.resolve();
+  let sequence = 0;
+
+  function run(args) {
+    const commandArgs = runCommand === execFile && wranglerExecutable === defaultWrangler
+      ? [...defaultWranglerArgs, ...args]
+      : args;
+    const result = commandQueue.then(() => runCommand(wranglerExecutable, commandArgs, {
+      cwd: projectRoot,
+      encoding: "utf8",
+      maxBuffer: 16 * 1024 * 1024,
+    }));
+    commandQueue = result.catch(() => {});
+    return result;
+  }
+
+  async function privateFile(extension, contents) {
+    const directory = await temporaryDirectory;
+    const filename = path.join(directory, `${sequence += 1}${extension}`);
+    await writeFile(filename, contents, { flag: "wx", mode: 0o600 });
+    await chmod(filename, 0o600);
+    return filename;
+  }
+
+  const d1 = {
+    async importTables(tables) {
+      const sqlPath = await privateFile(
+        ".sql",
+        `${preparedImportSql ?? createCloudD1ImportSql(tables)}\n`,
+      );
+      await run([
+        "d1",
+        "execute",
+        database,
+        ...modeArguments,
+        "--file",
+        sqlPath,
+        "--yes",
+        "--config",
+        resolvedConfig,
+      ]);
+    },
+    async countByProject() {
+      const result = await run([
+        "d1",
+        "execute",
+        database,
+        ...modeArguments,
+        "--command",
+        CLOUD_PROJECT_COUNTS_SQL,
+        "--json",
+        "--config",
+        resolvedConfig,
+      ]);
+      return Object.fromEntries(parseD1Results(result.stdout).map((row) => [
+        row.project_id,
+        {
+          projects: Number(row.projects),
+          tasks: Number(row.tasks),
+          comments: Number(row.comments),
+          task_relations: Number(row.task_relations),
+          attachments: Number(row.attachments),
+          workflow_workspaces: Number(row.workflow_workspaces),
+        },
+      ]));
+    },
+  };
+
+  const r2 = {
+    async put(key, body, options) {
+      const bodyPath = await privateFile(".attachment", Buffer.from(body));
+      const contentType = options?.httpMetadata?.contentType;
+      await run([
+        "r2",
+        "object",
+        "put",
+        `${bucket}/${key}`,
+        ...modeArguments,
+        "--file",
+        bodyPath,
+        "--force",
+        ...(contentType ? ["--content-type", contentType] : []),
+        "--config",
+        resolvedConfig,
+      ]);
+    },
+    async head(key) {
+      const directory = await temporaryDirectory;
+      const outputPath = path.join(directory, `${sequence += 1}.download`);
+      try {
+        await run([
+          "r2",
+          "object",
+          "get",
+          `${bucket}/${key}`,
+          ...modeArguments,
+          "--file",
+          outputPath,
+          "--config",
+          resolvedConfig,
+        ]);
+      } catch (error) {
+        if (missingR2Object(error)) return null;
+        throw error;
+      }
+      await chmod(outputPath, 0o600);
+      const body = await readFile(outputPath);
+      return {
+        size: body.byteLength,
+        customMetadata: {
+          sha256: createHash("sha256").update(body).digest("hex"),
+        },
+      };
+    },
+    async delete(key) {
+      await run([
+        "r2",
+        "object",
+        "delete",
+        `${bucket}/${key}`,
+        ...modeArguments,
+        "--force",
+        "--config",
+        resolvedConfig,
+      ]);
+    },
+  };
+
+  return {
+    d1,
+    r2,
+    async cleanup() {
+      await rm(await temporaryDirectory, { recursive: true, force: true });
+    },
+  };
+}
+
+export function createCloudMigrationAdapters({ bundle, command } = {}) {
+  const preparedImportSql = command === "import"
+    ? createCloudD1ImportSql(bundle.tables)
+    : undefined;
+  return createWranglerCloudAdapters({ preparedImportSql });
+}
+
+export default createCloudMigrationAdapters;
diff --git a/apps/codex-taskboard/server/ai-chat-catalog.mjs b/apps/codex-taskboard/server/ai-chat-catalog.mjs
new file mode 100644
index 000000000..70c4f0495
--- /dev/null
+++ b/apps/codex-taskboard/server/ai-chat-catalog.mjs
@@ -0,0 +1,253 @@
+import { readFile, realpath, stat } from "node:fs/promises";
+import path from "node:path";
+
+import { ApiError } from "./database.mjs";
+import { execFileExecutable, spawnExecutable } from "./executable.mjs";
+const CATALOG_TIMEOUT_MS = 10_000;
+const CATALOG_MAX_BUFFER = 2 * 1024 * 1024;
+
+async function existingDirectory(value) {
+  if (typeof value !== "string" || !path.isAbsolute(value.trim())) return null;
+  try {
+    const resolved = await realpath(value.trim());
+    return (await stat(resolved)).isDirectory() ? resolved : null;
+  } catch {
+    return null;
+  }
+}
+
+export async function loadDeviceWorkspaces(codexStatePath, database) {
+  const workspaces = new Map();
+  let localProjects = {};
+  try {
+    const state = JSON.parse(await readFile(codexStatePath, "utf8"));
+    if (
+      state?.["local-projects"]
+      && typeof state["local-projects"] === "object"
+      && !Array.isArray(state["local-projects"])
+    ) {
+      localProjects = state["local-projects"];
+    }
+  } catch {}
+
+  for (const [projectId, project] of Object.entries(localProjects)) {
+    if (!Array.isArray(project?.rootPaths)) continue;
+    for (const rootPath of project.rootPaths) {
+      const workspacePath = await existingDirectory(rootPath);
+      if (!workspacePath) continue;
+      workspaces.set(projectId, workspacePath);
+      break;
+    }
+  }
+
+  for (const project of await database.listProjects()) {
+    if (workspaces.has(project.id)) continue;
+    const workspacePath = await existingDirectory(project.workspacePath);
+    if (workspacePath) workspaces.set(project.id, workspacePath);
+  }
+  return workspaces;
+}
+
+export async function resolveAiWorkspace(projectId, codexStatePath, database) {
+  const project = await database.getProject(projectId);
+  if (!project) {
+    throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${projectId}' does not exist`);
+  }
+  const workspaces = await loadDeviceWorkspaces(codexStatePath, database);
+  const workspacePath = workspaces.get(projectId);
+  if (!workspacePath) {
+    throw new ApiError(
+      409,
+      "PROJECT_WORKSPACE_UNAVAILABLE",
+      `Project '${projectId}' has no available device workspace`,
+    );
+  }
+  return {
+    workspacePath,
+    addDirectories: [...new Set(workspaces.values())].filter((candidate) => candidate !== workspacePath),
+    project,
+  };
+}
+
+function sanitizeModels(value) {
+  if (!Array.isArray(value)) throw new Error("Codex returned an invalid model catalog");
+  return value.flatMap((model) => {
+    if (
+      !model
+      || typeof model !== "object"
+      || (model.visibility !== undefined && model.visibility !== "list")
+      || typeof model.slug !== "string"
+      || !model.slug.trim()
+    ) {
+      return [];
+    }
+    const slug = model.slug.trim();
+    const efforts = Array.isArray(model.supported_reasoning_levels)
+      ? [...new Set(model.supported_reasoning_levels.flatMap((level) => (
+          typeof level?.effort === "string" && level.effort.trim() ? [level.effort.trim()] : []
+        )))]
+      : [];
+    const serviceTiers = Array.isArray(model.service_tiers)
+      ? model.service_tiers.flatMap((tier) => (
+          typeof tier?.id === "string"
+          && tier.id.trim()
+          && typeof tier.name === "string"
+          && tier.name.trim()
+            ? [{ id: tier.id.trim(), name: tier.name.trim() }]
+            : []
+        ))
+      : [];
+    return [{
+      slug,
+      displayName: typeof model.display_name === "string" && model.display_name.trim()
+        ? model.display_name.trim()
+        : slug,
+      description: typeof model.description === "string" ? model.description : "",
+      defaultReasoningEffort: typeof model.default_reasoning_level === "string"
+        ? model.default_reasoning_level.trim()
+        : "",
+      supportedReasoningEfforts: efforts,
+      serviceTiers,
+    }];
+  });
+}
+
+function listSkills(codexExecutable, workspacePath, processEnv) {
+  return new Promise((resolve, reject) => {
+    const child = spawnExecutable(codexExecutable, ["app-server", "--stdio"], {
+      cwd: workspacePath,
+      env: processEnv,
+      stdio: ["pipe", "pipe", "ignore"],
+    });
+    let buffer = "";
+    let settled = false;
+    const timeout = setTimeout(
+      () => finish(new Error("Timed out while reading Codex skills")),
+      CATALOG_TIMEOUT_MS,
+    );
+
+    function finish(error, value) {
+      if (settled) return;
+      settled = true;
+      clearTimeout(timeout);
+      child.stdin.end();
+      child.kill("SIGTERM");
+      if (error) reject(error);
+      else resolve(value);
+    }
+
+    function send(message) {
+      child.stdin.write(`${JSON.stringify(message)}\n`);
+    }
+
+    function handleMessage(message) {
+      if (message?.id === 1) {
+        if (message.error) return finish(new Error("Codex app-server rejected initialization"));
+        send({ method: "initialized" });
+        send({
+          id: 2,
+          method: "skills/list",
+          params: { cwds: [workspacePath], forceReload: false },
+        });
+        return;
+      }
+      if (message?.id !== 2) return;
+      if (message.error) return finish(new Error("Codex app-server could not list skills"));
+      finish(null, Array.isArray(message.result?.data) ? message.result.data : []);
+    }
+
+    child.stdout.setEncoding("utf8");
+    child.stdout.on("data", (chunk) => {
+      buffer += chunk;
+      if (buffer.length > CATALOG_MAX_BUFFER) {
+        finish(new Error("Codex skills response exceeded the catalog size limit"));
+        return;
+      }
+      let newlineIndex = buffer.indexOf("\n");
+      while (newlineIndex >= 0 && !settled) {
+        const line = buffer.slice(0, newlineIndex).trim();
+        buffer = buffer.slice(newlineIndex + 1);
+        if (line) {
+          try {
+            handleMessage(JSON.parse(line));
+          } catch {}
+        }
+        newlineIndex = buffer.indexOf("\n");
+      }
+    });
+    child.stdin.on("error", (error) => finish(error));
+    child.once("error", (error) => finish(error));
+    child.once("exit", (code, signal) => {
+      if (!settled) {
+        finish(new Error(`Codex app-server exited before listing skills (${signal || code})`));
+      }
+    });
+    child.once("spawn", () => {
+      send({
+        id: 1,
+        method: "initialize",
+        params: {
+          clientInfo: { name: "codex-taskboard", version: "0.1.0" },
+          capabilities: { experimentalApi: true },
+        },
+      });
+    });
+  });
+}
+
+function sanitizeSkills(entries) {
+  const unique = new Map();
+  for (const entry of entries) {
+    if (!Array.isArray(entry?.skills)) continue;
+    for (const skill of entry.skills) {
+      if (
+        !skill
+        || typeof skill !== "object"
+        || skill.enabled === false
+        || typeof skill.name !== "string"
+        || !skill.name.trim()
+      ) {
+        continue;
+      }
+      const id = skill.name.trim();
+      if (unique.has(id)) continue;
+      const displayName = typeof skill.interface?.displayName === "string"
+        ? skill.interface.displayName.trim()
+        : "";
+      unique.set(id, {
+        id,
+        label: displayName || id,
+        description: typeof skill.description === "string" ? skill.description.trim() : "",
+        path: typeof skill.path === "string" ? skill.path.trim() : "",
+        scope: ["user", "repo", "system", "admin"].includes(skill.scope) ? skill.scope : "user",
+      });
+    }
+  }
+  return [...unique.values()].sort((left, right) => left.label.localeCompare(right.label));
+}
+
+export async function discoverAiCatalog({
+  codexExecutable,
+  codexStatePath,
+  database,
+  projectId,
+  processEnv,
+}) {
+  const { workspacePath } = await resolveAiWorkspace(projectId, codexStatePath, database);
+  const [modelResult, skillEntries] = await Promise.all([
+    execFileExecutable(codexExecutable, ["debug", "models"], {
+      cwd: workspacePath,
+      env: processEnv,
+      encoding: "utf8",
+      timeout: CATALOG_TIMEOUT_MS,
+      maxBuffer: CATALOG_MAX_BUFFER,
+    }),
+    listSkills(codexExecutable, workspacePath, processEnv),
+  ]);
+  const modelCatalog = JSON.parse(modelResult.stdout);
+  return {
+    models: sanitizeModels(modelCatalog?.models),
+    skills: sanitizeSkills(skillEntries),
+    sandboxes: ["read-only", "workspace-write", "danger-full-access"],
+  };
+}
diff --git a/apps/codex-taskboard/server/ai-chat-process.mjs b/apps/codex-taskboard/server/ai-chat-process.mjs
new file mode 100644
index 000000000..3c36e9d9a
--- /dev/null
+++ b/apps/codex-taskboard/server/ai-chat-process.mjs
@@ -0,0 +1,465 @@
+import { spawnExecutable } from "./executable.mjs";
+
+const VISIBLE_TEXT_LIMIT = 65_536;
+const STDERR_LIMIT = 65_536;
+const SKILL_MARKER = "\uFFFC";
+const ITEM_TYPES = new Set([
+  "agent_message",
+  "command_execution",
+  "file_change",
+  "mcp_tool_call",
+  "web_search",
+  "todo_list",
+  "error",
+]);
+
+function cappedText(value) {
+  return typeof value === "string" ? value.slice(0, VISIBLE_TEXT_LIMIT) : "";
+}
+
+function errorMessage(value) {
+  if (typeof value === "string") return cappedText(value);
+  if (value && typeof value === "object") return cappedText(value.message);
+  return "";
+}
+
+function detailText(value) {
+  if (value === undefined || value === null) return "";
+  if (typeof value === "string") return cappedText(value);
+  try {
+    return cappedText(JSON.stringify(value));
+  } catch {
+    return "";
+  }
+}
+
+function itemStatus(rawType, item) {
+  if (typeof item.status === "string") return cappedText(item.status);
+  return rawType.slice("item.".length);
+}
+
+function normalizedItem(rawType, item) {
+  const status = itemStatus(rawType, item);
+  const itemId = cappedText(item.id);
+  const baseData = {
+    status,
+    ...(itemId ? { itemId } : {}),
+  };
+
+  if (item.type === "agent_message") {
+    return {
+      kind: "event",
+      type: item.type,
+      role: "assistant",
+      content: cappedText(item.text),
+      data: baseData,
+    };
+  }
+
+  if (item.type === "command_execution") {
+    const command = cappedText(item.command);
+    const output = cappedText(item.aggregated_output);
+    return {
+      kind: "event",
+      type: item.type,
+      role: "activity",
+      content: command,
+      data: {
+        ...baseData,
+        command,
+        ...(output ? { output } : {}),
+        ...(Number.isInteger(item.exit_code) ? { exitCode: item.exit_code } : {}),
+      },
+    };
+  }
+
+  if (item.type === "file_change") {
+    const changes = Array.isArray(item.changes)
+      ? item.changes.map((change) => ({
+          path: cappedText(change?.path),
+          kind: cappedText(change?.kind),
+        })).filter((change) => change.path)
+      : [];
+    const content = cappedText(changes.map((change) => change.path).join("\n"));
+    return {
+      kind: "event",
+      type: item.type,
+      role: "activity",
+      content,
+      data: {
+        ...baseData,
+        files: cappedText(changes.map((change) => change.path).join("\n")).split("\n").filter(Boolean),
+        ...(changes.length > 0 ? { detail: detailText(changes) } : {}),
+      },
+    };
+  }
+
+  if (item.type === "mcp_tool_call") {
+    const server = cappedText(item.server);
+    const tool = cappedText(item.tool);
+    const detail = detailText({
+      ...(item.arguments !== undefined ? { arguments: item.arguments } : {}),
+      ...(item.result !== undefined ? { result: item.result } : {}),
+      ...(item.error !== undefined ? { error: item.error } : {}),
+    });
+    return {
+      kind: "event",
+      type: item.type,
+      role: item.error ? "error" : "activity",
+      content: cappedText([server, tool].filter(Boolean).join(".")),
+      data: {
+        ...baseData,
+        ...(server ? { server } : {}),
+        ...(tool ? { tool } : {}),
+        ...(detail && detail !== "{}" ? { detail } : {}),
+      },
+    };
+  }
+
+  if (item.type === "web_search") {
+    const query = cappedText(item.query);
+    return {
+      kind: "event",
+      type: item.type,
+      role: "activity",
+      content: query,
+      data: { ...baseData, ...(query ? { query } : {}) },
+    };
+  }
+
+  if (item.type === "todo_list") {
+    const items = Array.isArray(item.items)
+      ? item.items.map((todo) => ({
+          text: cappedText(todo?.text),
+          ...(typeof todo?.completed === "boolean" ? { completed: todo.completed } : {}),
+        })).filter((todo) => todo.text)
+      : [];
+    return {
+      kind: "event",
+      type: item.type,
+      role: "activity",
+      content: cappedText(items.map((todo) => todo.text).join("\n")),
+      data: {
+        ...baseData,
+        ...(items.length > 0 ? { detail: detailText(items) } : {}),
+      },
+    };
+  }
+
+  const message = errorMessage(item.message ?? item.error);
+  return {
+    kind: "event",
+    type: item.type,
+    role: "error",
+    content: message,
+    data: baseData,
+  };
+}
+
+export function buildCodexArgs(thread, addDirectories, imagePaths = []) {
+  const permission = thread.sandbox === "read-only"
+    ? {
+        sandbox: "workspace-write",
+        approvalPolicy: "on-request",
+        reviewer: "user",
+      }
+    : thread.sandbox === "workspace-write"
+      ? {
+          sandbox: "workspace-write",
+          approvalPolicy: "on-request",
+          reviewer: "auto_review",
+        }
+      : {
+          sandbox: "danger-full-access",
+          approvalPolicy: "never",
+          reviewer: null,
+        };
+  const args = [
+    "exec",
+    "--json",
+    "--color",
+    "never",
+    "-C",
+    thread.origin.workspacePath,
+    "-s",
+    permission.sandbox,
+    "-c",
+    `approval_policy="${permission.approvalPolicy}"`,
+  ];
+  if (permission.reviewer) {
+    args.push("-c", `approvals_reviewer="${permission.reviewer}"`);
+  }
+  for (const directory of addDirectories) {
+    args.push("--add-dir", directory);
+  }
+  if (thread.model) {
+    args.push("-m", thread.model);
+  }
+  if (thread.reasoningEffort) {
+    args.push("-c", `model_reasoning_effort="${thread.reasoningEffort}"`);
+  }
+  if (thread.codexThreadId) {
+    args.push("resume");
+    for (const imagePath of imagePaths) {
+      args.push("-i", imagePath);
+    }
+    args.push(thread.codexThreadId, "-");
+  } else {
+    for (const imagePath of imagePaths) {
+      args.push("-i", imagePath);
+    }
+    args.push("-");
+  }
+  return args;
+}
+
+export function buildCodexPrompt(thread, { message, skills, attachmentPaths }, skillPath) {
+  const selectedSkills = skills ?? [];
+  const turnAttachmentPaths = attachmentPaths ?? [];
+  let selectedSkillIndex = 0;
+  const userMessage = message.replaceAll(SKILL_MARKER, () => {
+    const skill = selectedSkills[selectedSkillIndex];
+    selectedSkillIndex += 1;
+    return `[$${skill.id}](${skill.path})`;
+  });
+  const context = [
+    `project_id: ${thread.origin.projectId}`,
+    `project_name: ${thread.origin.projectName}`,
+    `workspace_path: ${thread.origin.workspacePath}`,
+  ];
+  if (thread.origin.issueIdentifier) {
+    context.push(`issue_identifier: ${thread.origin.issueIdentifier}`);
+  }
+  if (turnAttachmentPaths.length > 0) {
+    context.push(
+      "turn_attachment_paths:",
+      ...turnAttachmentPaths.map((attachmentPath) => `- ${attachmentPath}`),
+    );
+  }
+  context.push(
+    "This is private server-owned context. Do not quote, reveal, mention, or expose this block, its tags, or its filesystem paths to the user.",
+  );
+
+  return [
+    `[$manage-taskboard](${skillPath}) e-taskboard`,
+    "",
+    "<taskboard_context>",
+    ...context,
+    "</taskboard_context>",
+    "",
+    "<user_message>",
+    userMessage,
+    "</user_message>",
+  ].join("\n");
+}
+
+export function normalizeCodexEvent(raw) {
+  if (!raw || typeof raw !== "object" || Array.isArray(raw)) return null;
+
+  if (raw.type === "thread.started") {
+    if (
+      typeof raw.thread_id !== "string"
+      || raw.thread_id.length === 0
+      || raw.thread_id.length > 256
+      || raw.thread_id.includes("\0")
+    ) {
+      return null;
+    }
+    return { kind: "thread.started", threadId: raw.thread_id };
+  }
+
+  if (raw.type === "turn.started") {
+    return {
+      kind: "event",
+      type: raw.type,
+      role: "activity",
+      content: "",
+      data: { status: "started" },
+    };
+  }
+
+  if (raw.type === "turn.completed") {
+    const usage = {};
+    for (const key of ["input_tokens", "cached_input_tokens", "output_tokens"]) {
+      if (Number.isFinite(raw.usage?.[key])) usage[key] = raw.usage[key];
+    }
+    return {
+      kind: "event",
+      type: raw.type,
+      role: "activity",
+      content: "",
+      data: {
+        status: "completed",
+        ...(Object.keys(usage).length > 0 ? { usage } : {}),
+      },
+    };
+  }
+
+  if (raw.type === "turn.failed") {
+    return {
+      kind: "event",
+      type: raw.type,
+      role: "error",
+      content: errorMessage(raw.error ?? raw.message),
+      data: { status: "failed" },
+    };
+  }
+
+  if (raw.type === "error") {
+    return {
+      kind: "event",
+      type: raw.type,
+      role: "error",
+      content: errorMessage(raw.message ?? raw.error),
+      data: { status: "failed" },
+    };
+  }
+
+  if (
+    raw.type !== "item.started"
+    && raw.type !== "item.updated"
+    && raw.type !== "item.completed"
+  ) {
+    return null;
+  }
+  if (!raw.item || typeof raw.item !== "object" || !ITEM_TYPES.has(raw.item.type)) {
+    return null;
+  }
+  return normalizedItem(raw.type, raw.item);
+}
+
+export function spawnCodexTurn({
+  executable,
+  args,
+  prompt,
+  env,
+  onRawEvent,
+  maxLineBytes = 1_048_576,
+}) {
+  const child = spawnExecutable(executable, args, {
+    detached: true,
+    env,
+    stdio: ["pipe", "pipe", "pipe"],
+  });
+
+  let stdoutBuffer = Buffer.alloc(0);
+  let stderrBuffer = Buffer.alloc(0);
+  let settled = false;
+  let fatalError = null;
+  let stdoutEnded = false;
+  let resolveCompletion;
+  let rejectCompletion;
+
+  const completion = new Promise((resolve, reject) => {
+    resolveCompletion = resolve;
+    rejectCompletion = reject;
+  });
+
+  function terminateProcessGroup() {
+    if (Number.isInteger(child.pid)) {
+      try {
+        process.kill(-child.pid, "SIGKILL");
+        return;
+      } catch {}
+    }
+    child.kill("SIGKILL");
+  }
+
+  function rejectWithDiagnostic(error) {
+    if (settled || fatalError) return;
+    fatalError = error instanceof Error ? error : new Error(String(error));
+    terminateProcessGroup();
+  }
+
+  function consumeLine(line) {
+    if (fatalError) return;
+    if (line.length > maxLineBytes) {
+      rejectWithDiagnostic(new Error(`Codex JSONL line exceeded ${maxLineBytes} bytes`));
+      return;
+    }
+    if (line.at(-1) === 13) line = line.subarray(0, -1);
+    if (line.toString("utf8").trim() === "") return;
+    let raw;
+    try {
+      raw = JSON.parse(line.toString("utf8"));
+    } catch {
+      rejectWithDiagnostic(new Error("Codex emitted malformed JSONL"));
+      return;
+    }
+    try {
+      onRawEvent(raw);
+    } catch (error) {
+      rejectWithDiagnostic(error);
+    }
+  }
+
+  function consumeChunk(chunk) {
+    if (settled) return;
+    const bytes = Buffer.isBuffer(chunk) ? chunk : Buffer.from(chunk);
+    let offset = 0;
+    while (offset < bytes.length && !settled && !fatalError) {
+      const newline = bytes.indexOf(10, offset);
+      if (newline === -1) {
+        const remainder = bytes.subarray(offset);
+        if (stdoutBuffer.length + remainder.length > maxLineBytes) {
+          rejectWithDiagnostic(new Error(`Codex JSONL line exceeded ${maxLineBytes} bytes`));
+          return;
+        }
+        stdoutBuffer = stdoutBuffer.length === 0
+          ? Buffer.from(remainder)
+          : Buffer.concat([stdoutBuffer, remainder]);
+        return;
+      }
+      const segment = bytes.subarray(offset, newline);
+      if (stdoutBuffer.length + segment.length > maxLineBytes) {
+        rejectWithDiagnostic(new Error(`Codex JSONL line exceeded ${maxLineBytes} bytes`));
+        return;
+      }
+      const line = stdoutBuffer.length === 0
+        ? segment
+        : Buffer.concat([stdoutBuffer, segment]);
+      stdoutBuffer = Buffer.alloc(0);
+      consumeLine(line);
+      offset = newline + 1;
+    }
+  }
+
+  function finishStdout() {
+    if (stdoutEnded) return;
+    stdoutEnded = true;
+    if (!fatalError && stdoutBuffer.length > 0) {
+      const line = stdoutBuffer;
+      stdoutBuffer = Buffer.alloc(0);
+      consumeLine(line);
+    }
+  }
+
+  child.stdout.on("data", consumeChunk);
+  child.stdout.on("end", finishStdout);
+  child.stderr.on("data", (chunk) => {
+    if (stderrBuffer.length >= STDERR_LIMIT) return;
+    const bytes = Buffer.isBuffer(chunk) ? chunk : Buffer.from(chunk);
+    stderrBuffer = Buffer.concat([
+      stderrBuffer,
+      bytes.subarray(0, STDERR_LIMIT - stderrBuffer.length),
+    ]);
+  });
+  child.on("error", rejectWithDiagnostic);
+  child.on("close", (exitCode, signal) => {
+    finishStdout();
+    if (settled) return;
+    settled = true;
+    if (fatalError) {
+      if (stderrBuffer.length > 0) {
+        fatalError.stderr = stderrBuffer.toString("utf8");
+      }
+      rejectCompletion(fatalError);
+      return;
+    }
+    resolveCompletion({ exitCode, signal });
+  });
+  child.stdin.on("error", () => {});
+  child.stdin.end(prompt);
+
+  return { child, completion };
+}
diff --git a/apps/codex-taskboard/server/ai-chat.mjs b/apps/codex-taskboard/server/ai-chat.mjs
new file mode 100644
index 000000000..138a9506e
--- /dev/null
+++ b/apps/codex-taskboard/server/ai-chat.mjs
@@ -0,0 +1,585 @@
+import { mkdtemp, rm, writeFile } from "node:fs/promises";
+import os from "node:os";
+import path from "node:path";
+
+import { ApiError } from "./database.mjs";
+import { discoverAiCatalog, resolveAiWorkspace } from "./ai-chat-catalog.mjs";
+import {
+  buildCodexArgs,
+  buildCodexPrompt,
+  normalizeCodexEvent,
+  spawnCodexTurn,
+} from "./ai-chat-process.mjs";
+
+const SANDBOXES = new Set(["read-only", "workspace-write", "danger-full-access"]);
+const ERROR_CONTENT_LIMIT = 65_536;
+const CODEX_IMAGE_TYPES = new Set([
+  "image/gif",
+  "image/jpeg",
+  "image/png",
+  "image/webp",
+]);
+
+function cappedError(value) {
+  const message = value instanceof Error ? value.message : String(value ?? "");
+  return message.slice(0, ERROR_CONTENT_LIMIT);
+}
+
+function signalProcessGroup(child, signal) {
+  if (Number.isInteger(child?.pid)) {
+    try {
+      process.kill(-child.pid, signal);
+      return;
+    } catch {}
+  }
+  try {
+    child?.kill(signal);
+  } catch {}
+}
+
+function wait(milliseconds) {
+  return new Promise((resolve) => {
+    const timer = setTimeout(resolve, milliseconds);
+    timer.unref();
+  });
+}
+
+export class AiChatService {
+  constructor(options) {
+    this.database = options.database;
+    this.codexExecutable = options.codexExecutable;
+    this.codexStatePath = options.codexStatePath;
+    this.manageTaskboardSkillPath = options.manageTaskboardSkillPath;
+    this.processEnv = options.processEnv ?? process.env;
+    this.killGraceMs = options.killGraceMs ?? 1_000;
+    this.active = new Map();
+    this.listeners = new Map();
+    this.completions = new Map();
+  }
+
+  listThreads() {
+    return this.database.listAiChatThreads();
+  }
+
+  getThread(threadId) {
+    const thread = this.database.getAiChatThread(threadId);
+    if (!thread) {
+      throw new ApiError(
+        404,
+        "AI_CHAT_THREAD_NOT_FOUND",
+        `AI chat thread '${threadId}' does not exist`,
+      );
+    }
+    return thread;
+  }
+
+  getThreadSnapshot(threadId) {
+    const thread = this.getThread(threadId);
+    return {
+      thread,
+      events: this.database.listAiChatEvents(threadId),
+      runs: this.database.listAiChatRuns(threadId),
+    };
+  }
+
+  getRun(runId) {
+    const run = this.database.getAiChatRun(runId);
+    if (!run) {
+      throw new ApiError(404, "AI_CHAT_RUN_NOT_FOUND", `AI chat run '${runId}' does not exist`);
+    }
+    return run;
+  }
+
+  subscribe(threadId, listener) {
+    let listeners = this.listeners.get(threadId);
+    if (!listeners) {
+      listeners = new Set();
+      this.listeners.set(threadId, listeners);
+    }
+    listeners.add(listener);
+    return () => {
+      listeners.delete(listener);
+      if (listeners.size === 0) this.listeners.delete(threadId);
+    };
+  }
+
+  async getCatalog(projectId) {
+    return discoverAiCatalog({
+      codexExecutable: this.codexExecutable,
+      codexStatePath: this.codexStatePath,
+      database: this.database,
+      projectId,
+      processEnv: this.processEnv,
+    });
+  }
+
+  async createThread(input) {
+    const [catalog, resolved] = await Promise.all([
+      this.getCatalog(input.projectId),
+      resolveAiWorkspace(input.projectId, this.codexStatePath, this.database),
+    ]);
+    const model = this.#resolveModel(catalog, input.model);
+    const reasoningEffort = input.reasoningEffort ?? model.defaultReasoningEffort;
+    this.#validateReasoningEffort(model, reasoningEffort);
+    const sandbox = input.sandbox ?? "workspace-write";
+    this.#validateSandbox(sandbox);
+
+    let issue;
+    if (input.issueId !== undefined) {
+      issue = this.database.getTask(input.issueId);
+      if (!issue || issue.projectId !== input.projectId || issue.archivedAt != null) {
+        throw new ApiError(
+          404,
+          "AI_CHAT_ISSUE_NOT_FOUND",
+          `Task '${input.issueId}' is not an active task in project '${input.projectId}'`,
+        );
+      }
+    }
+
+    return this.database.createAiChatThread({
+      title: input.title ?? issue?.identifier ?? "New conversation",
+      origin: {
+        projectId: resolved.project.id,
+        projectName: resolved.project.name,
+        workspacePath: resolved.workspacePath,
+        ...(issue ? { issueId: issue.id, issueIdentifier: issue.identifier } : {}),
+      },
+      ...(input.codexThreadId ? { codexThreadId: input.codexThreadId } : {}),
+      model: model.slug,
+      reasoningEffort,
+      sandbox,
+    });
+  }
+
+  async updateThread(threadId, changes) {
+    let thread = this.getThread(threadId);
+    const changesSettings = ["model", "reasoningEffort", "sandbox"].some(
+      (key) => Object.hasOwn(changes, key),
+    );
+    const wasActive = changesSettings && this.#threadIsActive(thread);
+
+    if (Object.hasOwn(changes, "sandbox")) this.#validateSandbox(changes.sandbox);
+    if (Object.hasOwn(changes, "model") || Object.hasOwn(changes, "reasoningEffort")) {
+      const catalog = await this.getCatalog(thread.origin.projectId);
+      thread = this.getThread(threadId);
+      const model = this.#resolveModel(catalog, changes.model ?? thread.model);
+      const reasoningEffort = changes.reasoningEffort ?? thread.reasoningEffort;
+      this.#validateReasoningEffort(model, reasoningEffort);
+    }
+    if (wasActive || (changesSettings && this.#threadIsActive(thread))) {
+      throw new ApiError(
+        409,
+        "THREAD_BUSY",
+        `AI chat thread '${threadId}' has a running turn`,
+      );
+    }
+
+    return this.database.updateAiChatThread(threadId, changes);
+  }
+
+  deleteThread(threadId) {
+    const thread = this.getThread(threadId);
+    if (this.#threadIsActive(thread)) {
+      throw new ApiError(
+        409,
+        "THREAD_BUSY",
+        `AI chat thread '${threadId}' has a running turn`,
+      );
+    }
+    return this.database.deleteAiChatThread(threadId);
+  }
+
+  async startTurn(threadId, input) {
+    let thread = this.getThread(threadId);
+    if (this.#threadIsActive(thread)) {
+      throw new ApiError(
+        409,
+        "THREAD_BUSY",
+        `AI chat thread '${threadId}' has a running turn`,
+      );
+    }
+    this.#validateTurnInput(input);
+    if (thread.sandbox === "danger-full-access" && input.dangerFullAccessConfirmed !== true) {
+      throw new ApiError(
+        400,
+        "DANGER_CONFIRMATION_REQUIRED",
+        "danger-full-access must be confirmed for every turn",
+      );
+    }
+
+    const [catalog, resolved] = await Promise.all([
+      this.getCatalog(thread.origin.projectId),
+      resolveAiWorkspace(thread.origin.projectId, this.codexStatePath, this.database),
+    ]);
+
+    thread = this.getThread(threadId);
+    if (this.#threadIsActive(thread)) {
+      throw new ApiError(
+        409,
+        "THREAD_BUSY",
+        `AI chat thread '${threadId}' has a running turn`,
+      );
+    }
+    if (thread.sandbox === "danger-full-access" && input.dangerFullAccessConfirmed !== true) {
+      throw new ApiError(
+        400,
+        "DANGER_CONFIRMATION_REQUIRED",
+        "danger-full-access must be confirmed for every turn",
+      );
+    }
+    const model = this.#resolveModel(catalog, thread.model);
+    this.#validateReasoningEffort(model, thread.reasoningEffort);
+    if (resolved.workspacePath !== thread.origin.workspacePath) {
+      throw new ApiError(
+        409,
+        "PROJECT_WORKSPACE_CHANGED",
+        "The project's device workspace no longer matches this conversation",
+      );
+    }
+
+    const skillIds = input.skillIds ?? [];
+    const availableSkills = new Map(
+      catalog.skills
+        .filter((skill) => skill.id !== "manage-taskboard")
+        .map((skill) => [skill.id, skill]),
+    );
+    for (const skillId of skillIds) {
+      if (!availableSkills.has(skillId)) {
+        throw new ApiError(400, "INVALID_SKILL", `Unknown or unavailable skill '${skillId}'`);
+      }
+    }
+    const selectedSkills = skillIds.map((skillId) => availableSkills.get(skillId));
+
+    const attachments = input.attachments ?? [];
+    const {
+      temporaryDirectory,
+      attachmentPaths,
+      imagePaths,
+    } = await this.#writeTurnAttachments(attachments);
+    try {
+      const args = buildCodexArgs(thread, resolved.addDirectories, imagePaths);
+      const prompt = buildCodexPrompt(
+        thread,
+        {
+          message: input.message,
+          skills: selectedSkills,
+          attachmentPaths,
+        },
+        this.manageTaskboardSkillPath,
+      );
+      const run = this.database.createAiChatRun({ threadId });
+      this.#emit(threadId, { type: "ai.run", run });
+      const userEventData = {};
+      if (skillIds.length > 0) userEventData.skillIds = skillIds;
+      if (attachments.length > 0) {
+        userEventData.attachments = attachments.map(({ filename, contentType, size }) => ({
+          filename,
+          contentType,
+          size,
+        }));
+      }
+      const userEvent = this.database.insertAiChatEvent({
+        threadId,
+        runId: run.id,
+        type: "user_message",
+        role: "user",
+        content: input.message,
+        data: Object.keys(userEventData).length > 0 ? userEventData : undefined,
+      });
+      this.#emit(threadId, { type: "ai.event", event: userEvent });
+
+      const resumingThreadId = thread.codexThreadId;
+      let startedThreadId = null;
+      let terminalOutcome = null;
+      let terminalError = "";
+      const { child, completion } = spawnCodexTurn({
+        executable: this.codexExecutable,
+        args,
+        prompt,
+        env: this.processEnv,
+        onRawEvent: (raw) => {
+          const normalized = normalizeCodexEvent(raw);
+          if (!normalized) return;
+          if (normalized.kind === "thread.started") {
+            if (
+              (resumingThreadId && normalized.threadId !== resumingThreadId)
+              || (startedThreadId && normalized.threadId !== startedThreadId)
+            ) {
+              throw new Error("Codex returned an unexpected thread id");
+            }
+            startedThreadId = normalized.threadId;
+            this.database.updateAiChatThread(threadId, { codexThreadId: normalized.threadId });
+            return;
+          }
+          const event = this.database.insertAiChatEvent({
+            threadId,
+            runId: run.id,
+            type: normalized.type,
+            role: normalized.role,
+            content: normalized.content,
+            data: normalized.data,
+          });
+          if (raw.type === "turn.completed" && terminalOutcome === null) {
+            terminalOutcome = "completed";
+          } else if (raw.type === "turn.failed" || raw.type === "error") {
+            terminalOutcome = "failed";
+            terminalError ||= normalized.content;
+          }
+          this.#emit(threadId, { type: "ai.event", event });
+        },
+      });
+
+      const active = { child, threadId, interrupted: false, temporaryDirectory };
+      this.active.set(run.id, active);
+      const finalization = completion.then(
+        (result) => this.#finishRun({
+          run,
+          active,
+          result,
+          resumingThreadId,
+          startedThreadId: () => startedThreadId,
+          terminalOutcome: () => terminalOutcome,
+          terminalError: () => terminalError,
+        }),
+        (error) => this.#finishRun({
+          run,
+          active,
+          error,
+          resumingThreadId,
+          startedThreadId: () => startedThreadId,
+          terminalOutcome: () => terminalOutcome,
+          terminalError: () => terminalError,
+        }),
+      );
+      this.completions.set(run.id, finalization);
+      void finalization.finally(() => this.completions.delete(run.id)).catch(() => {});
+      return run;
+    } catch (error) {
+      if (temporaryDirectory) {
+        await rm(temporaryDirectory, { recursive: true, force: true });
+      }
+      throw error;
+    }
+  }
+
+  async interrupt(runId) {
+    let run = this.getRun(runId);
+    if (run.status !== "running") return run;
+
+    const active = this.active.get(runId);
+    if (!active) {
+      run = this.database.updateAiChatRun(runId, {
+        status: "interrupted",
+        error: "Interrupted",
+        finishedAt: new Date().toISOString(),
+      });
+      this.#emit(run.threadId, { type: "ai.run", run });
+      return run;
+    }
+
+    active.interrupted = true;
+    signalProcessGroup(active.child, "SIGTERM");
+    const timer = setTimeout(() => {
+      if (this.active.has(runId)) signalProcessGroup(active.child, "SIGKILL");
+    }, this.killGraceMs);
+    timer.unref();
+
+    const completion = this.completions.get(runId);
+    if (completion) {
+      await Promise.race([completion.catch(() => {}), wait(this.killGraceMs + 25)]);
+    }
+    return this.getRun(runId);
+  }
+
+  async close() {
+    const entries = [...this.active.entries()];
+    for (const [, active] of entries) {
+      active.interrupted = true;
+      signalProcessGroup(active.child, "SIGTERM");
+    }
+
+    const completions = entries
+      .map(([runId]) => this.completions.get(runId))
+      .filter(Boolean);
+    if (completions.length > 0) {
+      const settled = Promise.allSettled(completions);
+      await Promise.race([settled, wait(this.killGraceMs)]);
+      for (const [runId, active] of entries) {
+        if (this.active.has(runId)) signalProcessGroup(active.child, "SIGKILL");
+      }
+      await settled;
+    }
+    this.listeners.clear();
+  }
+
+  #resolveModel(catalog, requestedModel) {
+    const model = requestedModel === undefined
+      ? catalog.models[0]
+      : catalog.models.find((candidate) => candidate.slug === requestedModel);
+    if (!model) {
+      throw new ApiError(
+        400,
+        "INVALID_MODEL",
+        requestedModel === undefined
+          ? "Codex did not provide an available model"
+          : `Unknown model '${requestedModel}'`,
+      );
+    }
+    return model;
+  }
+
+  #validateReasoningEffort(model, reasoningEffort) {
+    if (!model.supportedReasoningEfforts.includes(reasoningEffort)) {
+      throw new ApiError(
+        400,
+        "INVALID_REASONING_EFFORT",
+        `Reasoning effort '${reasoningEffort}' is not supported by model '${model.slug}'`,
+      );
+    }
+  }
+
+  #validateSandbox(sandbox) {
+    if (!SANDBOXES.has(sandbox)) {
+      throw new ApiError(
+        400,
+        "INVALID_SANDBOX",
+        "'sandbox' must be read-only, workspace-write, or danger-full-access",
+      );
+    }
+  }
+
+  #validateTurnInput(input) {
+    if (
+      !input
+      || typeof input.message !== "string"
+      || input.message.length > 100_000
+      || (
+        input.message.trim() === ""
+        && (!Array.isArray(input.attachments) || input.attachments.length === 0)
+      )
+    ) {
+      throw new ApiError(
+        400,
+        "INVALID_MESSAGE",
+        "A message or at least one attachment is required",
+      );
+    }
+    if (
+      input.skillIds !== undefined
+      && (
+        !Array.isArray(input.skillIds)
+        || input.skillIds.length > 20
+        || input.skillIds.some((skillId) => typeof skillId !== "string" || !skillId)
+      )
+    ) {
+      throw new ApiError(
+        400,
+        "INVALID_SKILL",
+        "'skillIds' must contain at most 20 skill ids",
+      );
+    }
+  }
+
+  async #writeTurnAttachments(attachments) {
+    if (attachments.length === 0) {
+      return { temporaryDirectory: null, attachmentPaths: [], imagePaths: [] };
+    }
+    const temporaryDirectory = await mkdtemp(
+      path.join(os.tmpdir(), "codex-taskboard-ai-turn-"),
+    );
+    try {
+      const attachmentPaths = [];
+      const imagePaths = [];
+      for (const [index, attachment] of attachments.entries()) {
+        const attachmentPath = path.join(
+          temporaryDirectory,
+          `attachment-${index + 1}-${attachment.filename}`,
+        );
+        await writeFile(attachmentPath, attachment.data, { flag: "wx", mode: 0o600 });
+        attachmentPaths.push(attachmentPath);
+        if (CODEX_IMAGE_TYPES.has(attachment.contentType)) imagePaths.push(attachmentPath);
+      }
+      return { temporaryDirectory, attachmentPaths, imagePaths };
+    } catch (error) {
+      await rm(temporaryDirectory, { recursive: true, force: true });
+      throw error;
+    }
+  }
+
+  #threadIsActive(thread) {
+    return Boolean(thread.currentRun)
+      || [...this.active.values()].some((active) => active.threadId === thread.id);
+  }
+
+  async #finishRun({
+    run,
+    active,
+    result,
+    error,
+    resumingThreadId,
+    startedThreadId,
+    terminalOutcome,
+    terminalError,
+  }) {
+    let status;
+    let publicError = null;
+    if (active.interrupted) {
+      status = "interrupted";
+      publicError = "Interrupted";
+    } else if (error) {
+      status = "failed";
+      publicError = cappedError(error) || "Codex turn failed";
+    } else if (terminalOutcome() === "failed") {
+      status = "failed";
+      publicError = terminalError() || "Codex reported a failed turn";
+    } else if (result.exitCode !== 0) {
+      status = "failed";
+      publicError = result.exitCode === null
+        ? `Codex exited due to signal ${result.signal ?? "unknown"}`
+        : `Codex exited with code ${result.exitCode}`;
+    } else if (terminalOutcome() !== "completed") {
+      status = "failed";
+      publicError = "Codex exited without reporting turn completion";
+    } else if (!resumingThreadId && !startedThreadId()) {
+      status = "failed";
+      publicError = "Codex did not provide a thread id";
+    } else {
+      status = "completed";
+    }
+
+    try {
+      if (status === "failed" && terminalOutcome() !== "failed") {
+        const errorEvent = this.database.insertAiChatEvent({
+          threadId: run.threadId,
+          runId: run.id,
+          type: "error",
+          role: "error",
+          content: cappedError(publicError),
+          data: { status: "failed" },
+        });
+        this.#emit(run.threadId, { type: "ai.event", event: errorEvent });
+      }
+      const updated = this.database.updateAiChatRun(run.id, {
+        status,
+        exitCode: result?.exitCode ?? null,
+        error: publicError === null ? null : cappedError(publicError),
+        finishedAt: new Date().toISOString(),
+      });
+      this.#emit(run.threadId, { type: "ai.run", run: updated });
+      return updated;
+    } finally {
+      this.active.delete(run.id);
+      if (active.temporaryDirectory) {
+        await rm(active.temporaryDirectory, { recursive: true, force: true });
+      }
+    }
+  }
+
+  #emit(threadId, event) {
+    for (const listener of this.listeners.get(threadId) ?? []) {
+      try {
+        listener(event);
+      } catch {}
+    }
+  }
+}
diff --git a/apps/codex-taskboard/server/app.mjs b/apps/codex-taskboard/server/app.mjs
new file mode 100644
index 000000000..055124d8f
--- /dev/null
+++ b/apps/codex-taskboard/server/app.mjs
@@ -0,0 +1,2418 @@
+import { randomUUID, timingSafeEqual } from "node:crypto";
+import { mkdir, readFile, readdir, stat, unlink, writeFile } from "node:fs/promises";
+import { createServer } from "node:http";
+import { isIP } from "node:net";
+import os from "node:os";
+import path from "node:path";
+import { Readable } from "node:stream";
+import { fileURLToPath } from "node:url";
+
+import {
+  DEFAULT_PROJECT_ID,
+  TASK_STATUSES,
+  isTaskPriority,
+  isTaskStatus,
+} from "../shared/domain.mjs";
+import { normalizeWorkflowSnapshot } from "../shared/workflow-control-flow.mjs";
+import { AiChatService } from "./ai-chat.mjs";
+import { execFileExecutable, spawnExecutable } from "./executable.mjs";
+import { createCloudConfigStore } from "./cloud-config.mjs";
+import {
+  CloudProxyError,
+  createCloudProxy,
+  isLocalCompanionRoute,
+} from "./cloud-proxy.mjs";
+import { ApiError, TaskboardDatabase } from "./database.mjs";
+
+const PROJECT_ROOT = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "..");
+const JSON_BODY_LIMIT = 1024 * 1024;
+const ATTACHMENT_BODY_LIMIT = 25 * 1024 * 1024;
+const AI_CHAT_TURN_BODY_LIMIT = 25 * 1024 * 1024;
+const AI_CHAT_ATTACHMENT_LIMIT = 10;
+const AI_CHAT_SKILL_MARKER = "\uFFFC";
+const INLINE_ATTACHMENT_TYPES = new Set([
+  "application/pdf",
+  "image/avif",
+  "image/gif",
+  "image/jpeg",
+  "image/png",
+  "image/webp",
+  "text/plain",
+]);
+const PROJECT_ID_PATTERN = /^[a-z0-9](?:[a-z0-9-]{0,62}[a-z0-9])?$/;
+const TRUSTED_EMBED_ORIGINS = new Set(["app://-"]);
+const LOOPBACK_TASKBOARD_HOST = "127.0.0.1";
+const LAN_TASKBOARD_HOST = "0.0.0.0";
+const TASKBOARD_SHARED_SECRET_ENV = "TASKBOARD_SHARED_SECRET";
+const TASKBOARD_BIND_HOST_HEADER = "x-taskboard-bind-host";
+export const LAN_SHARING_WARNING =
+  "LAN sharing is enabled; requests require Basic auth and same-origin protection.";
+const CODEX_AGENT_ACTOR = {
+  type: "agent",
+  id: "codex-agent",
+  name: "Codex Agent",
+  avatarUrl: null,
+};
+const CONTENT_TYPES = new Map([
+  [".css", "text/css; charset=utf-8"],
+  [".html", "text/html; charset=utf-8"],
+  [".ico", "image/x-icon"],
+  [".jpeg", "image/jpeg"],
+  [".jpg", "image/jpeg"],
+  [".js", "text/javascript; charset=utf-8"],
+  [".json", "application/json; charset=utf-8"],
+  [".map", "application/json; charset=utf-8"],
+  [".png", "image/png"],
+  [".svg", "image/svg+xml"],
+  [".webp", "image/webp"],
+  [".woff", "font/woff"],
+  [".woff2", "font/woff2"],
+]);
+
+function sendJson(response, status, value, headers = {}) {
+  const body = JSON.stringify(value);
+  response.writeHead(status, {
+    "cache-control": "no-store",
+    "content-length": Buffer.byteLength(body),
+    "content-type": "application/json; charset=utf-8",
+    ...headers,
+  });
+  response.end(body);
+}
+
+function sendEmpty(response, status, headers = {}) {
+  response.writeHead(status, { "cache-control": "no-store", ...headers });
+  response.end();
+}
+
+function toFetchRequest(request) {
+  const headers = new Headers();
+  for (const [name, value] of Object.entries(request.headers)) {
+    if (Array.isArray(value)) {
+      for (const entry of value) headers.append(name, entry);
+    } else if (value !== undefined) {
+      headers.set(name, value);
+    }
+  }
+  const init = { method: request.method, headers };
+  if (request.method !== "GET" && request.method !== "HEAD") {
+    init.body = Readable.toWeb(request);
+    init.duplex = "half";
+  }
+  return new Request(`http://127.0.0.1${request.url}`, init);
+}
+
+async function sendFetchResponse(response, upstream) {
+  response.statusCode = upstream.status;
+  response.statusMessage = upstream.statusText;
+  for (const [name, value] of upstream.headers) {
+    if (
+      name === "connection"
+      || name === "content-encoding"
+      || name === "content-length"
+      || name === "set-cookie"
+      || name === "transfer-encoding"
+    ) {
+      continue;
+    }
+    response.setHeader(name, value);
+  }
+  const cookies = upstream.headers.getSetCookie?.() ?? [];
+  if (cookies.length > 0) response.setHeader("set-cookie", cookies);
+  if (!upstream.body) {
+    response.end();
+    return;
+  }
+  await new Promise((resolve, reject) => {
+    const body = Readable.fromWeb(upstream.body);
+    body.once("error", reject);
+    response.once("finish", resolve);
+    body.pipe(response);
+  });
+}
+
+async function deleteTaskAndAttachments(database, task, attachmentsDirectory) {
+  const result = database.deleteTask(task.id, task.version);
+  for (const attachment of result.attachments) {
+    try {
+      await unlink(path.join(attachmentsDirectory, attachment.id));
+    } catch (error) {
+      if (error.code !== "ENOENT") throw error;
+    }
+  }
+  return result.task;
+}
+
+function normalizeHostname(hostname) {
+  return hostname.toLowerCase().replace(/^\[|\]$/g, "");
+}
+
+function isTrustedNetworkHost(hostname) {
+  const host = normalizeHostname(hostname);
+  if (host === "localhost" || host === "::1" || host.endsWith(".local")) return true;
+  if (isIP(host) === 4) {
+    const octets = host.split(".").map(Number);
+    return octets[0] === 127
+      || octets[0] === 10
+      || (octets[0] === 172 && octets[1] >= 16 && octets[1] <= 31)
+      || (octets[0] === 192 && octets[1] === 168)
+      || (octets[0] === 169 && octets[1] === 254);
+  }
+  if (isIP(host) === 6) {
+    return host.startsWith("fc")
+      || host.startsWith("fd")
+      || /^fe[89ab]/.test(host);
+  }
+  return false;
+}
+
+function assertTrustedNetworkRequest(request) {
+  let requestUrl;
+  try {
+    requestUrl = new URL(`http://${request.headers.host ?? ""}`);
+  } catch {
+    throw new ApiError(403, "INVALID_HOST", "Request Host must be local or private");
+  }
+  const host = requestUrl.hostname;
+  if (!isTrustedNetworkHost(host)) {
+    throw new ApiError(403, "INVALID_HOST", "Request Host must be local or private");
+  }
+
+  const origin = request.headers.origin;
+  if (!origin) return requestUrl.host;
+  if (TRUSTED_EMBED_ORIGINS.has(origin)) return requestUrl.host;
+  let originHost;
+  try {
+    originHost = new URL(origin).hostname;
+  } catch {
+    throw new ApiError(403, "INVALID_ORIGIN", "Request Origin must be local or private");
+  }
+  if (!isTrustedNetworkHost(originHost)) {
+    throw new ApiError(403, "INVALID_ORIGIN", "Request Origin must be local or private");
+  }
+  return requestUrl.host;
+}
+
+function assertLanSameOriginRequest(request, requestAuthority) {
+  const origin = request.headers.origin;
+  if (!origin || TRUSTED_EMBED_ORIGINS.has(origin)) return;
+  let originUrl;
+  try {
+    originUrl = new URL(origin);
+  } catch {
+    throw new ApiError(403, "INVALID_ORIGIN", "Request Origin must be local or private");
+  }
+  if (originUrl.protocol !== "http:" || originUrl.host !== requestAuthority) {
+    throw new ApiError(403, "INVALID_ORIGIN", "LAN Origin must match the request Host");
+  }
+}
+
+function resolveSharedSecret(value = process.env[TASKBOARD_SHARED_SECRET_ENV]) {
+  const secret = String(value ?? "").trim();
+  return secret.length > 0 ? secret : null;
+}
+
+function basicAuthChallenge() {
+  const error = new ApiError(401, "LAN_AUTH_REQUIRED", "LAN sharing requires valid Basic auth");
+  error.headers = { "www-authenticate": "Basic realm=\"Codex Taskboard\", charset=\"UTF-8\"" };
+  return error;
+}
+
+function parseBasicAuth(value) {
+  if (typeof value !== "string" || !value.toLowerCase().startsWith("basic ")) return null;
+  const encoded = value.slice(6).trim();
+  let decoded;
+  try {
+    decoded = Buffer.from(encoded, "base64").toString("utf8");
+  } catch {
+    return null;
+  }
+  const separator = decoded.indexOf(":");
+  if (separator < 1) return null;
+  return {
+    username: decoded.slice(0, separator),
+    password: decoded.slice(separator + 1),
+  };
+}
+
+function secretEquals(actual, expected) {
+  const actualBytes = Buffer.from(actual);
+  const expectedBytes = Buffer.from(expected);
+  return actualBytes.length === expectedBytes.length
+    && timingSafeEqual(actualBytes, expectedBytes);
+}
+
+function assertLanAuthorization(request, sharedSecret) {
+  if (!sharedSecret) {
+    throw new ApiError(403, "LAN_SECRET_REQUIRED", `${TASKBOARD_SHARED_SECRET_ENV} is required for LAN sharing`);
+  }
+  const credentials = parseBasicAuth(request.headers.authorization);
+  if (!credentials || !secretEquals(credentials.password, sharedSecret)) {
+    throw basicAuthChallenge();
+  }
+}
+
+function assertLoopbackRequest(request) {
+  const address = request.socket.remoteAddress;
+  if (
+    address !== "127.0.0.1"
+    && address !== "::1"
+    && address !== "::ffff:127.0.0.1"
+  ) {
+    throw new ApiError(403, "LOCAL_ONLY", "This endpoint is only available on this device");
+  }
+}
+
+function assertPlainObject(value) {
+  if (value === null || typeof value !== "object" || Array.isArray(value)) {
+    throw new ApiError(400, "INVALID_BODY", "Request body must be a JSON object");
+  }
+}
+
+function assertAllowedKeys(value, allowed) {
+  const unknown = Object.keys(value).filter((key) => !allowed.has(key));
+  if (unknown.length > 0) {
+    throw new ApiError(400, "UNKNOWN_FIELD", `Unknown field${unknown.length === 1 ? "" : "s"}: ${unknown.join(", ")}`);
+  }
+}
+
+function assertAllowedQuery(searchParams, allowed, routeLabel) {
+  for (const key of searchParams.keys()) {
+    if (!allowed.has(key)) {
+      throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", `${routeLabel} does not accept query parameter '${key}'`);
+    }
+    if (searchParams.getAll(key).length !== 1) {
+      throw new ApiError(400, "INVALID_QUERY_PARAMETER", `Query parameter '${key}' cannot be repeated`);
+    }
+  }
+}
+
+function assertNoQuery(searchParams, routeLabel) {
+  assertAllowedQuery(searchParams, new Set(), routeLabel);
+}
+
+function decodeRouteSegment(value, name) {
+  let decoded;
+  try {
+    decoded = decodeURIComponent(value);
+  } catch {
+    throw new ApiError(400, "INVALID_PATH", `${name} contains invalid encoding`);
+  }
+  if (!decoded || decoded.length > 256 || decoded.includes("\0")) {
+    throw new ApiError(400, "INVALID_PATH", `${name} is invalid`);
+  }
+  return decoded;
+}
+
+function isLoopbackAddress(value) {
+  if (typeof value !== "string") return false;
+  const address = value.toLowerCase().split("%", 1)[0];
+  return address === "::1"
+    || address === "127.0.0.1"
+    || address.startsWith("127.")
+    || address === "::ffff:127.0.0.1"
+    || address.startsWith("::ffff:127.");
+}
+
+function assertAiLoopbackRequest(request) {
+  if (!isLoopbackAddress(request.socket.remoteAddress)) {
+    throw new ApiError(403, "LOCAL_AI_LOOPBACK_REQUIRED", "Local AI routes are only available from this device");
+  }
+}
+
+function stringField(value, name, { required = false, nullable = false, maxLength }) {
+  if (value === undefined) {
+    if (required) {
+      throw new ApiError(400, "INVALID_FIELD", `'${name}' is required`);
+    }
+    return undefined;
+  }
+  if (nullable && value === null) {
+    return null;
+  }
+  if (typeof value !== "string") {
+    throw new ApiError(400, "INVALID_FIELD", `'${name}' must be a string${nullable ? " or null" : ""}`);
+  }
+  const normalized = value.trim();
+  if (required && normalized.length === 0) {
+    throw new ApiError(400, "INVALID_FIELD", `'${name}' cannot be empty`);
+  }
+  if (normalized.length > maxLength) {
+    throw new ApiError(400, "INVALID_FIELD", `'${name}' cannot exceed ${maxLength} characters`);
+  }
+  return normalized;
+}
+
+function pathField(value, name) {
+  const normalized = stringField(value, name, { nullable: true, maxLength: 4096 });
+  if (normalized === "") {
+    throw new ApiError(400, "INVALID_FIELD", `'${name}' cannot be empty`);
+  }
+  if (normalized?.includes("\0")) {
+    throw new ApiError(400, "INVALID_FIELD", `'${name}' cannot contain null bytes`);
+  }
+  return normalized;
+}
+
+function parseDueDate(value, name = "dueDate") {
+  const date = stringField(value, name, { nullable: true, maxLength: 10 });
+  if (date !== null && date !== undefined && !/^\d{4}-\d{2}-\d{2}$/.test(date)) {
+    throw new ApiError(400, "INVALID_FIELD", `'${name}' must use YYYY-MM-DD`);
+  }
+  return date;
+}
+
+function parseDevelopmentContext(value) {
+  if (value === null) return null;
+  assertPlainObject(value);
+  if (value.type === "branch") {
+    assertAllowedKeys(value, new Set(["type", "branch"]));
+    return {
+      type: "branch",
+      branch: stringField(value.branch, "developmentContext.branch", { required: true, maxLength: 512 }),
+    };
+  }
+  if (value.type === "worktree") {
+    assertAllowedKeys(value, new Set(["type", "path", "branch"]));
+    const worktreePath = stringField(value.path, "developmentContext.path", { required: true, maxLength: 4096 });
+    if (worktreePath.includes("\0")) {
+      throw new ApiError(400, "INVALID_FIELD", "'developmentContext.path' cannot contain null bytes");
+    }
+    return {
+      type: "worktree",
+      path: worktreePath,
+      branch: stringField(value.branch ?? null, "developmentContext.branch", { nullable: true, maxLength: 512 }),
+    };
+  }
+  throw new ApiError(400, "INVALID_FIELD", "'developmentContext.type' must be branch or worktree");
+}
+
+function parseRecurrence(value) {
+  if (value === null) return null;
+  assertPlainObject(value);
+  assertAllowedKeys(value, new Set(["interval", "unit"]));
+  if (!Number.isSafeInteger(value.interval) || value.interval < 1 || value.interval > 365) {
+    throw new ApiError(400, "INVALID_FIELD", "'recurrence.interval' must be an integer from 1 to 365");
+  }
+  if (!["day", "week", "month", "year"].includes(value.unit)) {
+    throw new ApiError(400, "INVALID_FIELD", "'recurrence.unit' must be day, week, month, or year");
+  }
+  return { interval: value.interval, unit: value.unit };
+}
+
+function parseVersion(value) {
+  if (!Number.isSafeInteger(value) || value < 1) {
+    throw new ApiError(400, "INVALID_FIELD", "'version' must be a positive integer");
+  }
+  return value;
+}
+
+function parseWorkflowVersion(value) {
+  if (!Number.isSafeInteger(value) || value < 0) {
+    throw new ApiError(400, "INVALID_FIELD", "'version' must be a non-negative integer");
+  }
+  return value;
+}
+
+function parseWorkflowWorkspace(value) {
+  assertPlainObject(value);
+  assertAllowedKeys(value, new Set(["version", "tabs", "activeWorkflowId", "snapshots"]));
+  if (value.version !== 1) {
+    throw new ApiError(400, "INVALID_FIELD", "'workspace.version' must be 1");
+  }
+  if (!Array.isArray(value.tabs) || value.tabs.length === 0 || value.tabs.length > 100) {
+    throw new ApiError(400, "INVALID_FIELD", "'workspace.tabs' must contain 1 to 100 workflows");
+  }
+  const tabs = value.tabs.map((tab, index) => {
+    assertPlainObject(tab);
+    assertAllowedKeys(tab, new Set(["id", "name"]));
+    return {
+      id: stringField(tab.id, `workspace.tabs[${index}].id`, { required: true, maxLength: 128 }),
+      name: stringField(tab.name, `workspace.tabs[${index}].name`, { required: true, maxLength: 120 }),
+    };
+  });
+  if (new Set(tabs.map((tab) => tab.id)).size !== tabs.length) {
+    throw new ApiError(400, "INVALID_FIELD", "'workspace.tabs' ids must be unique");
+  }
+  const activeWorkflowId = stringField(value.activeWorkflowId, "workspace.activeWorkflowId", {
+    required: true,
+    maxLength: 128,
+  });
+  if (!tabs.some((tab) => tab.id === activeWorkflowId)) {
+    throw new ApiError(400, "INVALID_FIELD", "'workspace.activeWorkflowId' must reference a workflow tab");
+  }
+  assertPlainObject(value.snapshots);
+  const snapshots = {};
+  for (const tab of tabs) {
+    const snapshot = value.snapshots[tab.id];
+    assertPlainObject(snapshot);
+    assertAllowedKeys(snapshot, new Set(["nodes", "edges", "flow", "selectedNodeId"]));
+    if (!Array.isArray(snapshot.nodes) || snapshot.nodes.length > 10_000) {
+      throw new ApiError(400, "INVALID_FIELD", `'workspace.snapshots.${tab.id}.nodes' must be an array`);
+    }
+    if (snapshot.flow === undefined && (!Array.isArray(snapshot.edges) || snapshot.edges.length > 20_000)) {
+      throw new ApiError(400, "INVALID_FIELD", `'workspace.snapshots.${tab.id}.edges' must be an array`);
+    }
+    if (snapshot.flow !== undefined && snapshot.edges !== undefined) {
+      throw new ApiError(400, "INVALID_FIELD", `'workspace.snapshots.${tab.id}' cannot contain both 'flow' and 'edges'`);
+    }
+    const selectedNodeId = stringField(
+      snapshot.selectedNodeId ?? null,
+      `workspace.snapshots.${tab.id}.selectedNodeId`,
+      { nullable: true, maxLength: 256 },
+    );
+    try {
+      snapshots[tab.id] = normalizeWorkflowSnapshot({
+        nodes: snapshot.nodes,
+        edges: snapshot.edges,
+        flow: snapshot.flow,
+        selectedNodeId,
+      });
+    } catch (error) {
+      throw new ApiError(
+        400,
+        "INVALID_FIELD",
+        `'workspace.snapshots.${tab.id}' is not a valid workflow: ${error.message}`,
+      );
+    }
+  }
+  return { version: 1, tabs, activeWorkflowId, snapshots };
+}
+
+function parseWorkflowWorkspaceSave(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set(["version", "workspace"]));
+  return {
+    version: parseWorkflowVersion(body.version),
+    workspace: parseWorkflowWorkspace(body.workspace),
+  };
+}
+
+function parseSortOrder(value) {
+  if (typeof value !== "number" || !Number.isFinite(value) || Math.abs(value) > 1_000_000_000_000) {
+    throw new ApiError(400, "INVALID_FIELD", "'sortOrder' must be a finite number between -1000000000000 and 1000000000000");
+  }
+  return value;
+}
+
+function parseLabels(value) {
+  if (!Array.isArray(value) || value.length > 20) {
+    throw new ApiError(400, "INVALID_FIELD", "'labels' must be an array with at most 20 entries");
+  }
+  const labels = value.map((label) => {
+    if (typeof label !== "string") {
+      throw new ApiError(400, "INVALID_FIELD", "Every label must be a string");
+    }
+    const normalized = label.trim();
+    if (normalized.length === 0 || normalized.length > 64) {
+      throw new ApiError(400, "INVALID_FIELD", "Labels must contain 1 to 64 characters");
+    }
+    return normalized;
+  });
+  if (new Set(labels).size !== labels.length) {
+    throw new ApiError(400, "INVALID_FIELD", "Labels must be unique");
+  }
+  return labels;
+}
+
+function parseStatus(value, fallback) {
+  const result = value ?? fallback;
+  if (!isTaskStatus(result)) {
+    throw new ApiError(400, "INVALID_FIELD", `'status' must be one of: ${TASK_STATUSES.join(", ")}`);
+  }
+  return result;
+}
+
+function parsePriority(value, fallback) {
+  const result = value ?? fallback;
+  if (!isTaskPriority(result)) {
+    throw new ApiError(400, "INVALID_FIELD", "'priority' must be none, urgent, high, medium, or low");
+  }
+  return result;
+}
+
+function slugify(value) {
+  return value.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "").slice(0, 64);
+}
+
+function validateProjectId(value, { required = true } = {}) {
+  const id = stringField(value, "id", { required, maxLength: 64 });
+  if (id !== undefined && !PROJECT_ID_PATTERN.test(id)) {
+    throw new ApiError(400, "INVALID_FIELD", "'id' must be a lowercase slug containing letters, numbers, or hyphens");
+  }
+  return id;
+}
+
+function parseProjectCreate(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set(["id", "name", "workspacePath"]));
+  const name = stringField(body.name, "name", { required: true, maxLength: 120 });
+  const id = validateProjectId(body.id ?? slugify(name));
+  if (!id) {
+    throw new ApiError(400, "INVALID_FIELD", "Project name must contain at least one letter or number when 'id' is omitted");
+  }
+  const workspacePath = stringField(body.workspacePath ?? null, "workspacePath", { nullable: true, maxLength: 4096 });
+  if (workspacePath === "") {
+    throw new ApiError(400, "INVALID_FIELD", "'workspacePath' cannot be empty");
+  }
+  if (workspacePath?.includes("\0")) {
+    throw new ApiError(400, "INVALID_FIELD", "'workspacePath' cannot contain null bytes");
+  }
+  return { id, name, workspacePath };
+}
+
+function parseThreadId(value) {
+  if (value === undefined) return undefined;
+  return stringField(value, "threadId", { required: true, maxLength: 256 });
+}
+
+function normalizeCodexThreadId(value) {
+  return String(value ?? "").trim().replace(/^(?:local|cloud):/i, "");
+}
+
+function parseCodexThreadSync(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set(["projectId", "visibleThreadIds"]));
+  const projectId = validateProjectId(body.projectId);
+  if (!Array.isArray(body.visibleThreadIds) || body.visibleThreadIds.length > 1000) {
+    throw new ApiError(400, "INVALID_FIELD", "'visibleThreadIds' must be an array of at most 1000 items");
+  }
+  const seen = new Set();
+  const visibleThreadIds = [];
+  for (const value of body.visibleThreadIds) {
+    if (typeof value !== "string") {
+      throw new ApiError(400, "INVALID_FIELD", "'visibleThreadIds' must contain strings");
+    }
+    const threadId = normalizeCodexThreadId(value);
+    if (!threadId || threadId.startsWith("client-new-thread:") || seen.has(threadId)) continue;
+    seen.add(threadId);
+    visibleThreadIds.push(threadId);
+  }
+  return { projectId, visibleThreadIds };
+}
+
+function requestHeader(request, name) {
+  const value = request.headers[name];
+  return Array.isArray(value) ? value[0] : value;
+}
+
+function actorFromRequest(request) {
+  if (request.headers["x-taskboard-client"] === "taskctl") {
+    return CODEX_AGENT_ACTOR;
+  }
+
+  const rawId = requestHeader(request, "x-taskboard-user-id");
+  const rawName = requestHeader(request, "x-taskboard-user-name");
+  const rawAvatarUrl = requestHeader(request, "x-taskboard-user-avatar");
+  if (rawId === undefined && rawName === undefined && rawAvatarUrl === undefined) {
+    return { type: "user", id: "local-user", name: "本地用户", avatarUrl: null };
+  }
+  if (rawId === undefined || rawName === undefined) {
+    throw new ApiError(400, "INVALID_ACTOR", "User identity requires both an ID and name");
+  }
+
+  const id = stringField(rawId, "X-Taskboard-User-Id", { required: true, maxLength: 96 });
+  if (!/^[a-z0-9](?:[a-z0-9._-]*[a-z0-9])?$/.test(id)) {
+    throw new ApiError(400, "INVALID_ACTOR", "User ID contains unsupported characters");
+  }
+  let decodedName;
+  try {
+    decodedName = decodeURIComponent(rawName);
+  } catch {
+    throw new ApiError(400, "INVALID_ACTOR", "User name is not valid URL-encoded text");
+  }
+  const name = stringField(decodedName, "X-Taskboard-User-Name", { required: true, maxLength: 120 });
+
+  let avatarUrl = null;
+  if (rawAvatarUrl !== undefined) {
+    const value = stringField(rawAvatarUrl, "X-Taskboard-User-Avatar", { required: true, maxLength: 2048 });
+    let parsed;
+    try {
+      parsed = new URL(value);
+    } catch {
+      throw new ApiError(400, "INVALID_ACTOR", "User avatar URL is invalid");
+    }
+    if (!["http:", "https:"].includes(parsed.protocol)) {
+      throw new ApiError(400, "INVALID_ACTOR", "User avatar URL must use HTTP or HTTPS");
+    }
+    avatarUrl = parsed.toString();
+  }
+  return { type: "user", id, name, avatarUrl };
+}
+
+function parseAssigneeTarget(value) {
+  if (value === undefined) return undefined;
+  if (value !== "current-user" && value !== "codex-agent") {
+    throw new ApiError(400, "INVALID_FIELD", "'assigneeTarget' must be current-user or codex-agent");
+  }
+  return value;
+}
+
+function resolveAssignee(target, actor) {
+  if (target === undefined) return actor;
+  if (target === "codex-agent") return CODEX_AGENT_ACTOR;
+  if (actor.type !== "user") {
+    throw new ApiError(400, "INVALID_FIELD", "'current-user' requires a user request identity");
+  }
+  return actor;
+}
+
+function parseWorkflowId(value) {
+  const workflowId = stringField(value, "workflowId", { nullable: true, maxLength: 128 });
+  if (workflowId === "") {
+    throw new ApiError(400, "INVALID_FIELD", "'workflowId' cannot be empty");
+  }
+  return workflowId;
+}
+
+function parseTaskCreate(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set([
+    "projectId", "title", "description", "status", "priority", "labels", "sortOrder", "threadId",
+    "assigneeTarget", "workflowId", "developmentContext", "dueDate", "recurrence",
+  ]));
+  const projectId = validateProjectId(body.projectId ?? DEFAULT_PROJECT_ID);
+  const task = {
+    projectId,
+    title: stringField(body.title, "title", { required: true, maxLength: 240 }),
+    description: stringField(body.description ?? "", "description", { maxLength: 100_000 }),
+    status: parseStatus(body.status, "backlog"),
+    priority: parsePriority(body.priority, "none"),
+    labels: body.labels === undefined ? [] : parseLabels(body.labels),
+    sortOrder: body.sortOrder === undefined ? undefined : parseSortOrder(body.sortOrder),
+    threadId: parseThreadId(body.threadId),
+    assigneeTarget: parseAssigneeTarget(body.assigneeTarget),
+    workflowId: parseWorkflowId(body.workflowId ?? null),
+    developmentContext: parseDevelopmentContext(body.developmentContext ?? null),
+    dueDate: parseDueDate(body.dueDate ?? null),
+    recurrence: parseRecurrence(body.recurrence ?? null),
+  };
+  if (task.recurrence && !task.dueDate) {
+    throw new ApiError(400, "INVALID_FIELD", "A recurring issue requires 'dueDate'");
+  }
+  return task;
+}
+
+function parseTaskPatch(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set([
+    "version", "title", "description", "status", "priority", "labels", "threadId",
+    "assigneeTarget", "workflowId", "developmentContext", "dueDate", "recurrence",
+  ]));
+  const version = parseVersion(body.version);
+  const threadId = parseThreadId(body.threadId);
+  const assigneeTarget = parseAssigneeTarget(body.assigneeTarget);
+  const changes = {};
+  if (body.title !== undefined) changes.title = stringField(body.title, "title", { required: true, maxLength: 240 });
+  if (body.description !== undefined) changes.description = stringField(body.description, "description", { maxLength: 100_000 });
+  if (body.status !== undefined) changes.status = parseStatus(body.status);
+  if (body.priority !== undefined) changes.priority = parsePriority(body.priority);
+  if (body.labels !== undefined) changes.labels = parseLabels(body.labels);
+  if (body.workflowId !== undefined) changes.workflowId = parseWorkflowId(body.workflowId);
+  if (body.developmentContext !== undefined) changes.developmentContext = parseDevelopmentContext(body.developmentContext);
+  if (body.dueDate !== undefined) changes.dueDate = parseDueDate(body.dueDate);
+  if (body.recurrence !== undefined) changes.recurrence = parseRecurrence(body.recurrence);
+  if (changes.recurrence && body.dueDate === null) {
+    throw new ApiError(400, "INVALID_FIELD", "A recurring issue requires 'dueDate'");
+  }
+  if (Object.keys(changes).length === 0 && assigneeTarget === undefined) {
+    throw new ApiError(400, "INVALID_BODY", "PATCH requires at least one task field");
+  }
+  return { version, changes, threadId, assigneeTarget };
+}
+
+function parseMove(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set(["version", "status", "sortOrder", "threadId", "projectId"]));
+  return {
+    version: parseVersion(body.version),
+    status: parseStatus(body.status),
+    sortOrder: body.sortOrder === undefined ? undefined : parseSortOrder(body.sortOrder),
+    threadId: parseThreadId(body.threadId),
+    projectId: body.projectId === undefined ? undefined : validateProjectId(body.projectId),
+  };
+}
+
+function parseArchive(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set(["version", "threadId"]));
+  return { version: parseVersion(body.version), threadId: parseThreadId(body.threadId) };
+}
+
+function parseIssueRelationType(value) {
+  if (!["parent", "blocks", "blocked_by", "related"].includes(value)) {
+    throw new ApiError(
+      400,
+      "INVALID_FIELD",
+      "'relation type' must be parent, blocks, blocked_by, or related",
+    );
+  }
+  return value;
+}
+
+function parseCommentCreate(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set(["body", "threadId"]));
+  return {
+    body: stringField(body.body ?? "", "body", { maxLength: 100_000 }),
+    threadId: parseThreadId(body.threadId),
+  };
+}
+
+function parseCommentPatch(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set(["version", "body", "threadId"]));
+  if (body.body === undefined) {
+    throw new ApiError(400, "INVALID_FIELD", "'body' is required");
+  }
+  return {
+    version: parseVersion(body.version),
+    body: stringField(body.body, "body", { maxLength: 100_000 }),
+    threadId: parseThreadId(body.threadId),
+  };
+}
+
+function parseAttachmentHeaders(request) {
+  const encodedFilename = request.headers["x-taskboard-filename"];
+  if (typeof encodedFilename !== "string") {
+    throw new ApiError(400, "INVALID_FILENAME", "X-Taskboard-Filename is required");
+  }
+  let filename;
+  try {
+    filename = decodeURIComponent(encodedFilename).trim();
+  } catch {
+    throw new ApiError(400, "INVALID_FILENAME", "Attachment filename contains invalid encoding");
+  }
+  if (
+    filename.length === 0
+    || filename.length > 240
+    || filename === "."
+    || filename === ".."
+    || /[\u0000-\u001f\u007f/\\]/.test(filename)
+  ) {
+    throw new ApiError(400, "INVALID_FILENAME", "Attachment filename is invalid");
+  }
+
+  const rawContentType = request.headers["content-type"];
+  const contentType = typeof rawContentType === "string"
+    ? rawContentType.split(";", 1)[0].trim().toLowerCase()
+    : "application/octet-stream";
+  if (contentType.length === 0 || contentType.length > 200 || !/^[!#$%&'*+.^_`|~0-9a-z-]+\/[!#$%&'*+.^_`|~0-9a-z-]+$/.test(contentType)) {
+    throw new ApiError(415, "UNSUPPORTED_MEDIA_TYPE", "Attachment Content-Type is invalid");
+  }
+  return { filename, contentType };
+}
+
+async function readBody(request, limit, tooLargeMessage) {
+  const declaredLength = Number(request.headers["content-length"] ?? 0);
+  if (Number.isFinite(declaredLength) && declaredLength > limit) {
+    throw new ApiError(413, "BODY_TOO_LARGE", tooLargeMessage);
+  }
+
+  const chunks = [];
+  let length = 0;
+  for await (const chunk of request) {
+    length += chunk.length;
+    if (length > limit) {
+      throw new ApiError(413, "BODY_TOO_LARGE", tooLargeMessage);
+    }
+    chunks.push(chunk);
+  }
+  return Buffer.concat(chunks);
+}
+
+async function readJson(
+  request,
+  limit = JSON_BODY_LIMIT,
+  tooLargeMessage = "Request body cannot exceed 1 MiB",
+) {
+  const contentType = request.headers["content-type"]?.split(";", 1)[0].trim().toLowerCase();
+  if (contentType !== "application/json") {
+    throw new ApiError(415, "UNSUPPORTED_MEDIA_TYPE", "Content-Type must be application/json");
+  }
+  const body = await readBody(request, limit, tooLargeMessage);
+  const length = body.length;
+  if (length === 0) {
+    throw new ApiError(400, "INVALID_JSON", "Request body cannot be empty");
+  }
+  try {
+    return JSON.parse(body.toString("utf8"));
+  } catch {
+    throw new ApiError(400, "INVALID_JSON", "Request body must contain valid JSON");
+  }
+}
+
+async function assertEmptyRequestBody(request, routeLabel) {
+  const body = await readBody(request, JSON_BODY_LIMIT, "Request body cannot exceed 1 MiB");
+  if (body.length > 0) {
+    throw new ApiError(400, "INVALID_BODY", `${routeLabel} does not accept a request body`);
+  }
+}
+
+function parseTaskFilters(searchParams) {
+  const allowed = new Set(["projectId", "status", "archived"]);
+  for (const key of searchParams.keys()) {
+    if (!allowed.has(key)) {
+      throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", `Unknown query parameter '${key}'`);
+    }
+    if (searchParams.getAll(key).length !== 1) {
+      throw new ApiError(400, "INVALID_QUERY_PARAMETER", `Query parameter '${key}' cannot be repeated`);
+    }
+  }
+
+  const projectIdValue = searchParams.get("projectId");
+  const statusValue = searchParams.get("status");
+  const archived = searchParams.get("archived") ?? "false";
+  if (statusValue !== null && !isTaskStatus(statusValue)) {
+    throw new ApiError(400, "INVALID_QUERY_PARAMETER", "Invalid task status");
+  }
+  if (!new Set(["true", "false", "all"]).has(archived)) {
+    throw new ApiError(400, "INVALID_QUERY_PARAMETER", "'archived' must be true, false, or all");
+  }
+  const projectId = projectIdValue === null ? undefined : validateProjectId(projectIdValue);
+  return { projectId, status: statusValue ?? undefined, archived };
+}
+
+function parseAiSandbox(value) {
+  if (value === undefined) return undefined;
+  if (!["read-only", "workspace-write", "danger-full-access"].includes(value)) {
+    throw new ApiError(
+      400,
+      "INVALID_SANDBOX",
+      "'sandbox' must be read-only, workspace-write, or danger-full-access",
+    );
+  }
+  return value;
+}
+
+function parseAiSetting(value, name, maxLength) {
+  const setting = stringField(value, name, { maxLength });
+  if (setting === "") {
+    throw new ApiError(400, "INVALID_FIELD", `'${name}' cannot be empty`);
+  }
+  return setting;
+}
+
+function parseAiThreadCreate(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set([
+    "projectId",
+    "issueId",
+    "title",
+    "codexThreadId",
+    "model",
+    "reasoningEffort",
+    "sandbox",
+  ]));
+  return {
+    projectId: validateProjectId(body.projectId),
+    issueId: parseAiSetting(body.issueId, "issueId", 128),
+    title: parseAiSetting(body.title, "title", 160),
+    codexThreadId: body.codexThreadId === undefined
+      ? undefined
+      : stringField(body.codexThreadId, "codexThreadId", { required: true, maxLength: 256 }),
+    model: parseAiSetting(body.model, "model", 128),
+    reasoningEffort: parseAiSetting(body.reasoningEffort, "reasoningEffort", 64),
+    sandbox: parseAiSandbox(body.sandbox),
+  };
+}
+
+function parseAiThreadPatch(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set(["title", "model", "reasoningEffort", "sandbox"]));
+  const input = {};
+  if (body.title !== undefined) input.title = parseAiSetting(body.title, "title", 160);
+  if (body.model !== undefined) input.model = parseAiSetting(body.model, "model", 128);
+  if (body.reasoningEffort !== undefined) {
+    input.reasoningEffort = parseAiSetting(body.reasoningEffort, "reasoningEffort", 64);
+  }
+  if (body.sandbox !== undefined) input.sandbox = parseAiSandbox(body.sandbox);
+  if (Object.keys(input).length === 0) {
+    throw new ApiError(400, "INVALID_BODY", "PATCH requires at least one thread setting");
+  }
+  return input;
+}
+
+function parseAiSkillIds(value) {
+  if (value === undefined) return undefined;
+  if (!Array.isArray(value) || value.length > 20) {
+    throw new ApiError(400, "INVALID_FIELD", "'skillIds' must be an array with at most 20 entries");
+  }
+  const skillIds = value.map((skillId, index) => (
+    stringField(skillId, `skillIds[${index}]`, { required: true, maxLength: 256 })
+  ));
+  return skillIds;
+}
+
+function parseAiAttachments(value) {
+  if (value === undefined) return [];
+  if (!Array.isArray(value) || value.length > AI_CHAT_ATTACHMENT_LIMIT) {
+    throw new ApiError(
+      400,
+      "INVALID_ATTACHMENT",
+      `'attachments' must be an array with at most ${AI_CHAT_ATTACHMENT_LIMIT} files`,
+    );
+  }
+  return value.map((attachment, index) => {
+    assertPlainObject(attachment);
+    assertAllowedKeys(attachment, new Set(["filename", "contentType", "dataBase64"]));
+    const filename = stringField(attachment.filename, `attachments[${index}].filename`, {
+      required: true,
+      maxLength: 240,
+    });
+    if (/[\u0000-\u001f\u007f/\\]/.test(filename)) {
+      throw new ApiError(
+        400,
+        "INVALID_ATTACHMENT",
+        `'attachments[${index}].filename' is invalid`,
+      );
+    }
+    const contentType = stringField(
+      attachment.contentType,
+      `attachments[${index}].contentType`,
+      { required: true, maxLength: 256 },
+    ).toLowerCase();
+    const dataBase64 = stringField(
+      attachment.dataBase64,
+      `attachments[${index}].dataBase64`,
+      { required: true, maxLength: AI_CHAT_TURN_BODY_LIMIT },
+    );
+    if (
+      dataBase64.length % 4 !== 0
+      || !/^[A-Za-z0-9+/]+={0,2}$/.test(dataBase64)
+    ) {
+      throw new ApiError(
+        400,
+        "INVALID_ATTACHMENT",
+        `'attachments[${index}].dataBase64' must contain valid base64`,
+      );
+    }
+    const data = Buffer.from(dataBase64, "base64");
+    if (data.length === 0 || data.toString("base64") !== dataBase64) {
+      throw new ApiError(
+        400,
+        "INVALID_ATTACHMENT",
+        `'attachments[${index}].dataBase64' must contain valid base64`,
+      );
+    }
+    return { filename, contentType, data, size: data.length };
+  });
+}
+
+function parseAiTurn(body) {
+  assertPlainObject(body);
+  assertAllowedKeys(body, new Set([
+    "message",
+    "skillIds",
+    "dangerFullAccessConfirmed",
+    "attachments",
+  ]));
+  if (
+    body.dangerFullAccessConfirmed !== undefined
+    && typeof body.dangerFullAccessConfirmed !== "boolean"
+  ) {
+    throw new ApiError(400, "INVALID_FIELD", "'dangerFullAccessConfirmed' must be a boolean");
+  }
+  const message = stringField(body.message ?? "", "message", { maxLength: 100_000 });
+  const skillIds = parseAiSkillIds(body.skillIds) ?? [];
+  if (message.split(AI_CHAT_SKILL_MARKER).length - 1 !== skillIds.length) {
+    throw new ApiError(400, "INVALID_FIELD", "'skillIds' must match the Skill markers in 'message'");
+  }
+  const attachments = parseAiAttachments(body.attachments);
+  if (message === "" && attachments.length === 0) {
+    throw new ApiError(
+      400,
+      "INVALID_MESSAGE",
+      "A message or at least one attachment is required",
+    );
+  }
+  return {
+    message,
+    skillIds,
+    dangerFullAccessConfirmed: body.dangerFullAccessConfirmed,
+    attachments,
+  };
+}
+
+class EventHub {
+  constructor() {
+    this.clients = new Set();
+    this.keepAlive = setInterval(() => {
+      for (const response of this.clients) response.write(": keep-alive\n\n");
+    }, 20_000);
+    this.keepAlive.unref();
+  }
+
+  connect(request, response) {
+    response.writeHead(200, {
+      connection: "keep-alive",
+      "cache-control": "no-cache, no-transform",
+      "content-type": "text/event-stream; charset=utf-8",
+      "x-accel-buffering": "no",
+    });
+    response.write(": connected\n\n");
+    this.clients.add(response);
+    request.once("close", () => this.clients.delete(response));
+  }
+
+  emit(type, value) {
+    const event = {
+      type,
+      projectId: value.projectId ?? value.project?.id ?? value.task?.projectId,
+      taskId: value.task?.id ?? value.comment?.taskId ?? value.attachment?.taskId,
+      ...value,
+      at: new Date().toISOString(),
+    };
+    const message = `event: ${type}\ndata: ${JSON.stringify(event)}\n\n`;
+    for (const response of this.clients) response.write(message);
+  }
+
+  close() {
+    clearInterval(this.keepAlive);
+    for (const response of this.clients) response.end();
+    this.clients.clear();
+  }
+}
+
+async function serveStatic(request, response, pathname, staticDirectory) {
+  if (request.method !== "GET" && request.method !== "HEAD") return false;
+  let decodedPath;
+  try {
+    decodedPath = decodeURIComponent(pathname);
+  } catch {
+    throw new ApiError(400, "INVALID_PATH", "URL path contains invalid encoding");
+  }
+  if (decodedPath.includes("\0")) {
+    throw new ApiError(400, "INVALID_PATH", "URL path is invalid");
+  }
+
+  const root = path.resolve(staticDirectory);
+  const relativePath = decodedPath === "/" ? "index.html" : decodedPath.replace(/^\/+/, "");
+  let filename = path.resolve(root, relativePath);
+  if (filename !== root && !filename.startsWith(`${root}${path.sep}`)) {
+    throw new ApiError(400, "INVALID_PATH", "URL path is outside the static directory");
+  }
+
+  let fileStats;
+  try {
+    fileStats = await stat(filename);
+  } catch (error) {
+    if (error.code !== "ENOENT") throw error;
+  }
+  if (!fileStats?.isFile() && !path.extname(relativePath)) {
+    filename = path.join(root, "index.html");
+    try {
+      fileStats = await stat(filename);
+    } catch (error) {
+      if (error.code !== "ENOENT") throw error;
+    }
+  }
+  if (!fileStats?.isFile()) return false;
+
+  const body = await readFile(filename);
+  const headers = {
+    "cache-control": path.basename(filename) === "index.html" ? "no-cache" : "public, max-age=31536000, immutable",
+    "content-length": body.length,
+    "content-type": CONTENT_TYPES.get(path.extname(filename).toLowerCase()) ?? "application/octet-stream",
+  };
+  response.writeHead(200, headers);
+  response.end(request.method === "HEAD" ? undefined : body);
+  return true;
+}
+
+function methodNotAllowed(response, allowed) {
+  sendJson(response, 405, {
+    error: { code: "METHOD_NOT_ALLOWED", message: `Allowed methods: ${allowed.join(", ")}` },
+  }, { allow: allowed.join(", ") });
+}
+
+function codexProjectRoot(state, projectId) {
+  if (!projectId || !state || typeof state !== "object") return null;
+  const project = state["local-projects"]?.[projectId];
+  const root = Array.isArray(project?.rootPaths) ? project.rootPaths[0] : null;
+  return typeof root === "string" && root.trim() ? root : null;
+}
+
+async function readCodexProjectWorkspaces(codexStatePath) {
+  try {
+    const state = JSON.parse(await readFile(codexStatePath, "utf8"));
+    const projects = state["local-projects"];
+    if (!projects || typeof projects !== "object" || Array.isArray(projects)) return {};
+    return Object.fromEntries(Object.keys(projects).flatMap((projectId) => {
+      const root = codexProjectRoot(state, projectId);
+      return root ? [[projectId, root]] : [];
+    }));
+  } catch {
+    return {};
+  }
+}
+
+async function readCodexProjectMetadata(codexStatePath) {
+  try {
+    const state = JSON.parse(await readFile(codexStatePath, "utf8"));
+    const projects = state["local-projects"];
+    if (!projects || typeof projects !== "object" || Array.isArray(projects)) return {};
+    return Object.fromEntries(Object.entries(projects).flatMap(([projectId, project]) => {
+      if (!project || typeof project !== "object" || Array.isArray(project)) return [];
+      const name = typeof project.name === "string" && project.name.trim()
+        ? project.name.trim()
+        : null;
+      const workspacePath = codexProjectRoot(state, projectId);
+      if (!name && !workspacePath) return [];
+      return [[projectId, { name, workspacePath }]];
+    }));
+  } catch {
+    return {};
+  }
+}
+
+async function listProjectsWithCodexMetadata(database, codexStatePath) {
+  const projects = database.listProjects();
+  const codexProjects = await readCodexProjectMetadata(codexStatePath);
+  return projects.map((project) => {
+    const codexProject = codexProjects[project.id];
+    const name = codexProject?.name ?? project.name;
+    const workspacePath = project.workspacePath ?? codexProject?.workspacePath ?? null;
+    return name === project.name && workspacePath === project.workspacePath
+      ? project
+      : { ...project, name, workspacePath };
+  });
+}
+
+async function readCodexThreadTitle(codexSessionIndexPath, threadId) {
+  try {
+    const lines = (await readFile(codexSessionIndexPath, "utf8")).split(/\r?\n/);
+    let title = null;
+    for (const line of lines) {
+      if (!line.trim()) continue;
+      let record;
+      try {
+        record = JSON.parse(line);
+      } catch {
+        continue;
+      }
+      if (
+        record?.id === threadId
+        && typeof record.thread_name === "string"
+        && record.thread_name.trim()
+      ) {
+        title = record.thread_name.trim();
+      }
+    }
+    return title;
+  } catch {
+    return null;
+  }
+}
+
+function addCodexThreadId(target, value) {
+  const threadId = normalizeCodexThreadId(value);
+  if (threadId && !threadId.startsWith("client-new-thread:")) target.add(threadId);
+}
+
+async function readCodexThreadSyncState(resolved, projectId) {
+  const sidebarThreadIds = new Set();
+  const deletedThreadIds = new Set();
+  const knownThreadIds = new Set();
+  let hasSidebarProject = false;
+  try {
+    const state = JSON.parse(await readFile(resolved.codexStatePath, "utf8"));
+    const projectOrder = state["sidebar-project-thread-orders"]?.[projectId];
+    if (projectOrder && typeof projectOrder === "object" && Array.isArray(projectOrder.threadIds)) {
+      hasSidebarProject = true;
+      for (const threadId of projectOrder.threadIds) addCodexThreadId(sidebarThreadIds, threadId);
+    }
+    const deletedPrefix = "codex-writing-block-deleted-thread-v1:";
+    for (const key of Object.keys(state)) {
+      if (key.startsWith(deletedPrefix) && state[key]) addCodexThreadId(deletedThreadIds, key.slice(deletedPrefix.length));
+    }
+  } catch {}
+
+  try {
+    const lines = (await readFile(resolved.codexSessionIndexPath, "utf8")).split(/\r?\n/);
+    for (const line of lines) {
+      if (!line.trim()) continue;
+      try {
+        addCodexThreadId(knownThreadIds, JSON.parse(line)?.id);
+      } catch {}
+    }
+  } catch {}
+
+  try {
+    for (const filename of await readdir(resolved.codexArchivedSessionsPath)) {
+      const match = /([0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12})\.jsonl$/i.exec(filename);
+      if (match) addCodexThreadId(knownThreadIds, match[1]);
+    }
+  } catch {}
+
+  return { hasSidebarProject, sidebarThreadIds, knownThreadIds, deletedThreadIds };
+}
+
+async function syncTasksForCodexThreads(database, resolved, input, events) {
+  const state = await readCodexThreadSyncState(resolved, input.projectId);
+  const visibleThreadIds = state.hasSidebarProject
+    ? state.sidebarThreadIds
+    : new Set(input.visibleThreadIds);
+  if (!state.hasSidebarProject && visibleThreadIds.size === 0) return;
+
+  const tasks = database.listTasks({ projectId: input.projectId, archived: "false" });
+  for (const task of tasks) {
+    const threadId = normalizeCodexThreadId(task.threadId);
+    if (!threadId || visibleThreadIds.has(threadId)) continue;
+    if (state.deletedThreadIds.has(threadId) || !state.knownThreadIds.has(threadId)) {
+      const deleted = await deleteTaskAndAttachments(database, task, resolved.attachmentsDirectory);
+      events.emit("task.deleted", { task: deleted });
+    } else {
+      const archived = database.archiveTask(task.id, task.version, task.threadId);
+      events.emit("task.archived", { task: archived });
+    }
+  }
+}
+
+function latestThreadCwd(value, threadId) {
+  const matches = [];
+  const stack = [value];
+  while (stack.length > 0) {
+    const candidate = stack.pop();
+    if (!candidate || typeof candidate !== "object") continue;
+    if (candidate.conversationId === threadId && typeof candidate.cwd === "string" && candidate.cwd.trim()) {
+      matches.push(candidate);
+    }
+    stack.push(...(Array.isArray(candidate) ? candidate : Object.values(candidate)));
+  }
+  matches.sort((left, right) => Number(right.updatedAtMs ?? 0) - Number(left.updatedAtMs ?? 0));
+  return matches[0]?.cwd ?? null;
+}
+
+async function resolveProjectWorkspace(project, codexProjectId, codexThreadId, codexStatePath, codexProcessesPath) {
+  try {
+    const state = JSON.parse(await readFile(codexStatePath, "utf8"));
+    const assignment = state["thread-project-assignments"]?.[codexThreadId];
+    const root = codexProjectRoot(state, project.id)
+      ?? codexProjectRoot(state, codexProjectId)
+      ?? codexProjectRoot(state, assignment?.projectId)
+      ?? (typeof assignment?.cwd === "string" ? assignment.cwd : null);
+    if (root) return root;
+  } catch {}
+  if (project.workspacePath) return project.workspacePath;
+  if (!codexThreadId) return null;
+  try {
+    const processes = JSON.parse(await readFile(codexProcessesPath, "utf8"));
+    return latestThreadCwd(processes, codexThreadId);
+  } catch {
+    return null;
+  }
+}
+
+function parseWorktrees(output) {
+  const contexts = [];
+  for (const block of output.trim().split(/\n\s*\n/)) {
+    if (!block) continue;
+    let worktreePath = "";
+    let branch = null;
+    for (const line of block.split("\n")) {
+      if (line.startsWith("worktree ")) worktreePath = line.slice(9);
+      if (line.startsWith("branch refs/heads/")) branch = line.slice(18);
+    }
+    if (worktreePath) contexts.push({ type: "worktree", path: worktreePath, branch });
+  }
+  return contexts;
+}
+
+async function scanDevelopmentContexts(workspacePath) {
+  if (!workspacePath) return { workspacePath: null, contexts: [] };
+  try {
+    const rootResult = await execFileExecutable("git", ["-C", workspacePath, "rev-parse", "--show-toplevel"], {
+      timeout: 4_000,
+      maxBuffer: 1024 * 1024,
+    });
+    const root = rootResult.stdout.trim();
+    const [branchesResult, worktreesResult] = await Promise.all([
+      execFileExecutable("git", ["-C", root, "for-each-ref", "--format=%(refname:short)", "refs/heads"], {
+        timeout: 4_000,
+        maxBuffer: 1024 * 1024,
+      }),
+      execFileExecutable("git", ["-C", root, "worktree", "list", "--porcelain"], {
+        timeout: 4_000,
+        maxBuffer: 1024 * 1024,
+      }),
+    ]);
+    const branches = branchesResult.stdout.split("\n").map((branch) => branch.trim()).filter(Boolean);
+    return {
+      workspacePath: root,
+      contexts: [
+        ...branches.map((branch) => ({ type: "branch", branch })),
+        ...parseWorktrees(worktreesResult.stdout),
+      ],
+    };
+  } catch {
+    return { workspacePath, contexts: [] };
+  }
+}
+
+async function discoverSkills(codexExecutable, workspacePath) {
+  const entries = await new Promise((resolve, reject) => {
+    const child = spawnExecutable(codexExecutable, ["app-server", "--stdio"], {
+      cwd: workspacePath,
+      stdio: ["pipe", "pipe", "ignore"],
+    });
+    let settled = false;
+    let buffer = "";
+    const timeout = setTimeout(() => {
+      finish(new Error("Timed out while reading Codex skills"));
+    }, 10_000);
+
+    function finish(error, value) {
+      if (settled) return;
+      settled = true;
+      clearTimeout(timeout);
+      child.stdin.end();
+      child.kill("SIGTERM");
+      if (error) reject(error);
+      else resolve(value);
+    }
+
+    function send(message) {
+      child.stdin.write(`${JSON.stringify(message)}\n`);
+    }
+
+    function handleMessage(message) {
+      if (message?.id === 1) {
+        if (message.error) {
+          finish(new Error("Codex app-server rejected initialization"));
+          return;
+        }
+        send({ method: "initialized" });
+        send({
+          id: 2,
+          method: "skills/list",
+          params: { cwds: [workspacePath], forceReload: false },
+        });
+        return;
+      }
+      if (message?.id !== 2) return;
+      if (message.error) {
+        finish(new Error("Codex app-server could not list skills"));
+        return;
+      }
+      finish(null, Array.isArray(message.result?.data) ? message.result.data : []);
+    }
+
+    child.stdout.setEncoding("utf8");
+    child.stdout.on("data", (chunk) => {
+      buffer += chunk;
+      let newlineIndex = buffer.indexOf("\n");
+      while (newlineIndex >= 0) {
+        const line = buffer.slice(0, newlineIndex).trim();
+        buffer = buffer.slice(newlineIndex + 1);
+        if (line) {
+          try {
+            handleMessage(JSON.parse(line));
+          } catch {}
+        }
+        newlineIndex = buffer.indexOf("\n");
+      }
+    });
+    child.stdin.on("error", (error) => finish(error));
+    child.once("error", (error) => finish(error));
+    child.once("exit", (code, signal) => {
+      if (!settled) {
+        finish(new Error(`Codex app-server exited before listing skills (${signal || code})`));
+      }
+    });
+    child.once("spawn", () => {
+      send({
+        id: 1,
+        method: "initialize",
+        params: {
+          clientInfo: { name: "codex-taskboard", version: "0.1.0" },
+          capabilities: { experimentalApi: true },
+        },
+      });
+    });
+  });
+
+  const unique = new Map();
+  for (const entry of entries) {
+    if (!Array.isArray(entry?.skills)) continue;
+    for (const skill of entry.skills) {
+      if (
+        !skill
+        || typeof skill !== "object"
+        || skill.enabled === false
+        || typeof skill.name !== "string"
+        || !skill.name.trim()
+      ) {
+        continue;
+      }
+      const id = skill.name.trim();
+      if (unique.has(id)) continue;
+      const displayName = typeof skill.interface?.displayName === "string"
+        ? skill.interface.displayName.trim()
+        : "";
+      unique.set(id, {
+        id,
+        label: displayName || id,
+        description: typeof skill.description === "string" ? skill.description.trim() : "",
+        path: typeof skill.path === "string" ? skill.path.trim() : "",
+        scope: ["user", "repo", "system", "admin"].includes(skill.scope)
+          ? skill.scope
+          : "user",
+      });
+    }
+  }
+  return [...unique.values()].sort((left, right) => left.label.localeCompare(right.label));
+}
+
+async function discoverMcpServers(codexExecutable) {
+  const result = await execFileExecutable(codexExecutable, ["mcp", "list", "--json"], {
+    timeout: 8_000,
+    maxBuffer: 2 * 1024 * 1024,
+  });
+  const entries = JSON.parse(result.stdout);
+  if (!Array.isArray(entries)) throw new Error("Codex returned an invalid MCP server list");
+  return entries
+    .filter((entry) => (
+      entry
+      && typeof entry === "object"
+      && typeof entry.name === "string"
+      && entry.name.trim()
+      && entry.enabled !== false
+    ))
+    .map((entry) => ({
+      id: entry.name.trim(),
+      label: entry.name.trim(),
+      transport: typeof entry.transport?.type === "string"
+        ? entry.transport.type
+        : "unknown",
+    }))
+    .sort((left, right) => left.label.localeCompare(right.label));
+}
+
+async function discoverWorkflowCapabilities(resolved, workspacePath) {
+  const [skills, mcpServers] = await Promise.all([
+    discoverSkills(resolved.codexExecutable, workspacePath),
+    discoverMcpServers(resolved.codexExecutable),
+  ]);
+  return { skills, mcpServers };
+}
+
+export function resolveServerOptions(options = {}) {
+  const configuredDataDirectory = options.dataDirectory ?? process.env.CODEX_TASKBOARD_DATA_DIR;
+  const dataDirectory = configuredDataDirectory
+    ? path.resolve(configuredDataDirectory)
+    : path.join(PROJECT_ROOT, ".data");
+  const codexHome = process.env.CODEX_HOME || path.join(os.homedir(), ".codex");
+  return {
+    dataDirectory,
+    databasePath: options.databasePath ?? path.join(dataDirectory, "taskboard.sqlite"),
+    attachmentsDirectory: options.attachmentsDirectory ?? path.join(dataDirectory, "attachments"),
+    cloudConfigPath: options.cloudConfigPath ?? path.join(dataDirectory, "cloud-companion.json"),
+    staticDirectory: options.staticDirectory ?? path.join(PROJECT_ROOT, "dist", "web"),
+    skillPath: options.skillPath ?? path.join(PROJECT_ROOT, "skills", "manage-taskboard", "SKILL.md"),
+    codexExecutable: options.codexExecutable ?? process.env.CODEX_EXECUTABLE ?? "codex",
+    codexStatePath: options.codexStatePath
+      ?? path.join(codexHome, ".codex-global-state.json"),
+    codexSessionIndexPath: options.codexSessionIndexPath
+      ?? path.join(codexHome, "session_index.jsonl"),
+    codexArchivedSessionsPath: options.codexArchivedSessionsPath
+      ?? path.join(codexHome, "archived_sessions"),
+    codexProcessesPath: options.codexProcessesPath
+      ?? path.join(codexHome, "process_manager", "chat_processes.json"),
+  };
+}
+
+export function resolvePort(value = process.env.CODEX_TASKBOARD_PORT ?? "47823") {
+  const port = typeof value === "number" ? value : Number(value);
+  if (!Number.isInteger(port) || port < 1 || port > 65535) {
+    throw new Error("CODEX_TASKBOARD_PORT must be an integer between 1 and 65535");
+  }
+  return port;
+}
+
+export function resolveHost(value = process.env.CODEX_TASKBOARD_HOST ?? LOOPBACK_TASKBOARD_HOST) {
+  const host = String(value).trim();
+  if (host !== LOOPBACK_TASKBOARD_HOST && host !== LAN_TASKBOARD_HOST) {
+    throw new Error(`CODEX_TASKBOARD_HOST must be ${LOOPBACK_TASKBOARD_HOST} or ${LAN_TASKBOARD_HOST}`);
+  }
+  return host;
+}
+
+export function createTaskboardServer(options = {}) {
+  const resolved = resolveServerOptions(options);
+  const sharedSecret = resolveSharedSecret(options.sharedSecret);
+  const database = new TaskboardDatabase(resolved.databasePath);
+  const events = new EventHub();
+  const cloudConfig = options.cloudConfigStore ?? createCloudConfigStore({
+    configPath: resolved.cloudConfigPath,
+  });
+  const cloudProxy = createCloudProxy({
+    configStore: cloudConfig,
+    fetch: options.remoteFetch ?? globalThis.fetch,
+    resolveDevelopmentContext: async (projectId, context) => {
+      if (!context.branch) return null;
+      const config = await cloudConfig.read();
+      const workspacePath = config.projectMappings[projectId];
+      if (!workspacePath) return null;
+      const result = await scanDevelopmentContexts(workspacePath);
+      return result.contexts.find((candidate) => (
+        candidate.type === "worktree" && candidate.branch === context.branch
+      )) ?? null;
+    },
+  });
+  const aiChat = new AiChatService({
+    database,
+    codexExecutable: resolved.codexExecutable,
+    codexStatePath: resolved.codexStatePath,
+    manageTaskboardSkillPath: resolved.skillPath,
+  });
+  const aiEventResponses = new Set();
+  let activeHost = LOOPBACK_TASKBOARD_HOST;
+
+  const server = createServer(async (request, response) => {
+    response.setHeader("x-content-type-options", "nosniff");
+    response.setHeader("referrer-policy", "no-referrer");
+    try {
+      const requestHost = assertTrustedNetworkRequest(request);
+      if (activeHost === LAN_TASKBOARD_HOST) {
+        assertLanSameOriginRequest(request, requestHost);
+        assertLanAuthorization(request, sharedSecret);
+      }
+      const url = new URL(request.url, "http://127.0.0.1");
+      const pathname = url.pathname;
+      const isLocalAiRoute = pathname === "/api/local/ai" || pathname.startsWith("/api/local/ai/");
+      if (isLocalAiRoute) {
+        assertAiLoopbackRequest(request);
+      } else if (pathname.startsWith("/api/local/")) {
+        assertLoopbackRequest(request);
+      }
+      const isMachineCapabilityRoute = pathname === "/api/meta"
+        || pathname === "/api/device-workspaces"
+        || pathname === "/api/workflow-capabilities"
+        || /^\/api\/projects\/[^/]+\/development-contexts$/.test(pathname);
+      const capabilityCloudConfig = isMachineCapabilityRoute
+        ? await cloudConfig.read()
+        : null;
+      if (capabilityCloudConfig?.remoteUrl) assertLoopbackRequest(request);
+
+      if (pathname === "/health") {
+        if (request.method !== "GET") return methodNotAllowed(response, ["GET"]);
+        return sendJson(response, 200, { status: "ok" }, {
+          [TASKBOARD_BIND_HOST_HEADER]: activeHost,
+        });
+      }
+
+      if (pathname === "/api/local/cloud-session") {
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "Cloud session routes do not accept query parameters");
+        }
+        if (request.method === "GET") {
+          const config = await cloudConfig.read();
+          return sendJson(response, 200, config.remoteUrl
+            ? {
+              mode: "cloud",
+              remoteUrl: config.remoteUrl,
+              actorName: config.actorName,
+              authenticated: true,
+            }
+            : { mode: "local", authenticated: false });
+        }
+        if (request.method === "PUT") {
+          const body = await readJson(request);
+          assertPlainObject(body);
+          assertAllowedKeys(body, new Set(["remoteUrl", "actorName", "sharedKey"]));
+          try {
+            const config = await cloudConfig.configure({
+              remoteUrl: body.remoteUrl,
+              actorName: body.actorName,
+              sharedKey: body.sharedKey,
+            });
+            return sendJson(response, 200, {
+              mode: "cloud",
+              remoteUrl: config.remoteUrl,
+              actorName: config.actorName,
+              authenticated: true,
+            });
+          } catch (error) {
+            throw new ApiError(400, error.code ?? "INVALID_CLOUD_CONFIG", error.message);
+          }
+        }
+        if (request.method === "DELETE") {
+          await cloudConfig.clearCloud();
+          return sendJson(response, 200, { mode: "local", authenticated: false });
+        }
+        return methodNotAllowed(response, ["GET", "PUT", "DELETE"]);
+      }
+
+      const projectMappingRoute = pathname.match(/^\/api\/local\/project-mappings\/([^/]+)$/);
+      if (projectMappingRoute) {
+        if (request.method !== "PUT") return methodNotAllowed(response, ["PUT"]);
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "Project mapping routes do not accept query parameters");
+        }
+        let projectId;
+        try {
+          projectId = decodeURIComponent(projectMappingRoute[1]);
+        } catch {
+          throw new ApiError(400, "INVALID_PATH", "Project id contains invalid encoding");
+        }
+        validateProjectId(projectId);
+        const body = await readJson(request);
+        assertPlainObject(body);
+        assertAllowedKeys(body, new Set(["workspacePath"]));
+        const workspacePath = pathField(body.workspacePath, "workspacePath");
+        if (!workspacePath || !path.isAbsolute(workspacePath)) {
+          throw new ApiError(400, "INVALID_FIELD", "'workspacePath' must be absolute");
+        }
+        const config = await cloudConfig.read();
+        if (config.remoteUrl) {
+          await cloudConfig.setProjectWorkspace(projectId, workspacePath);
+          return sendJson(response, 200, { projectId, workspacePath });
+        }
+        const project = database.mapProjectWorkspace(projectId, workspacePath);
+        return sendJson(response, 200, { projectId, workspacePath, project });
+      }
+
+      if (pathname === "/api/meta") {
+        if (request.method !== "GET") return methodNotAllowed(response, ["GET"]);
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "GET /api/meta does not accept query parameters");
+        }
+        return sendJson(response, 200, {
+          manageTaskboardSkillPath: resolved.skillPath,
+          capabilities: { localAiChat: isLoopbackAddress(request.socket.remoteAddress) },
+          ...(capabilityCloudConfig?.remoteUrl
+            ? {
+              mode: "cloud",
+              realtime: { transport: "poll", intervalMs: 2000 },
+              localCapabilities: { available: true },
+            }
+          : {}),
+        });
+      }
+
+      if (pathname === "/api/local/codex/threads/sync") {
+        if (request.method !== "POST") return methodNotAllowed(response, ["POST"]);
+        assertNoQuery(url.searchParams, "POST /api/local/codex/threads/sync");
+        await syncTasksForCodexThreads(database, resolved, parseCodexThreadSync(await readJson(request)), events);
+        return sendEmpty(response, 204);
+      }
+
+      const codexThreadRoute = pathname.match(/^\/api\/local\/codex\/threads\/([^/]+)$/);
+      if (codexThreadRoute) {
+        if (request.method !== "GET") return methodNotAllowed(response, ["GET"]);
+        assertNoQuery(url.searchParams, "GET /api/local/codex/threads/:id");
+        const threadId = parseThreadId(decodeRouteSegment(codexThreadRoute[1], "Thread id"));
+        return sendJson(response, 200, {
+          thread: {
+            id: threadId,
+            title: await readCodexThreadTitle(resolved.codexSessionIndexPath, threadId),
+          },
+        });
+      }
+
+      if (pathname === "/api/local/ai/catalog") {
+        if (request.method !== "GET") return methodNotAllowed(response, ["GET"]);
+        assertAllowedQuery(url.searchParams, new Set(["projectId"]), "GET /api/local/ai/catalog");
+        const projectId = validateProjectId(url.searchParams.get("projectId") ?? undefined);
+        return sendJson(response, 200, await aiChat.getCatalog(projectId));
+      }
+
+      if (pathname === "/api/local/ai/threads") {
+        assertNoQuery(url.searchParams, "/api/local/ai/threads");
+        if (request.method === "GET") {
+          return sendJson(response, 200, { threads: await aiChat.listThreads() });
+        }
+        if (request.method === "POST") {
+          const thread = await aiChat.createThread(parseAiThreadCreate(await readJson(request)));
+          return sendJson(response, 201, { thread });
+        }
+        return methodNotAllowed(response, ["GET", "POST"]);
+      }
+
+      const aiThreadEventsRoute = pathname.match(/^\/api\/local\/ai\/threads\/([^/]+)\/events$/);
+      if (aiThreadEventsRoute) {
+        if (request.method !== "GET") return methodNotAllowed(response, ["GET"]);
+        assertNoQuery(url.searchParams, "GET /api/local/ai/threads/:id/events");
+        const threadId = decodeRouteSegment(aiThreadEventsRoute[1], "Thread id");
+        await aiChat.getThreadSnapshot(threadId);
+        response.writeHead(200, {
+          connection: "keep-alive",
+          "cache-control": "no-cache, no-transform",
+          "content-type": "text/event-stream; charset=utf-8",
+          "x-accel-buffering": "no",
+        });
+        aiEventResponses.add(response);
+        const unsubscribe = aiChat.subscribe(threadId, (event) => {
+          const type = event?.type === "ai.run" ? "ai.run" : "ai.event";
+          response.write(`event: ${type}\ndata: ${JSON.stringify(event)}\n\n`);
+        });
+        response.write(": connected\n\n");
+        response.write('event: ai.event\ndata: {"type":"ai.event"}\n\n');
+        const keepAlive = setInterval(() => response.write(": keep-alive\n\n"), 20_000);
+        keepAlive.unref();
+        request.once("close", () => {
+          clearInterval(keepAlive);
+          unsubscribe();
+          aiEventResponses.delete(response);
+        });
+        return;
+      }
+
+      const aiThreadTurnRoute = pathname.match(/^\/api\/local\/ai\/threads\/([^/]+)\/turns$/);
+      if (aiThreadTurnRoute) {
+        if (request.method !== "POST") return methodNotAllowed(response, ["POST"]);
+        assertNoQuery(url.searchParams, "POST /api/local/ai/threads/:id/turns");
+        const threadId = decodeRouteSegment(aiThreadTurnRoute[1], "Thread id");
+        const run = await aiChat.startTurn(
+          threadId,
+          parseAiTurn(await readJson(
+            request,
+            AI_CHAT_TURN_BODY_LIMIT,
+            "AI chat turn body cannot exceed 25 MiB",
+          )),
+        );
+        return sendJson(response, 202, { run });
+      }
+
+      const aiThreadRoute = pathname.match(/^\/api\/local\/ai\/threads\/([^/]+)$/);
+      if (aiThreadRoute) {
+        assertNoQuery(url.searchParams, "/api/local/ai/threads/:id");
+        const threadId = decodeRouteSegment(aiThreadRoute[1], "Thread id");
+        if (request.method === "GET") {
+          return sendJson(response, 200, await aiChat.getThreadSnapshot(threadId));
+        }
+        if (request.method === "PATCH") {
+          const thread = await aiChat.updateThread(threadId, parseAiThreadPatch(await readJson(request)));
+          return sendJson(response, 200, { thread });
+        }
+        if (request.method === "DELETE") {
+          await assertEmptyRequestBody(request, "DELETE /api/local/ai/threads/:id");
+          const thread = await aiChat.deleteThread(threadId);
+          const linkedTask = thread.origin.issueId ? database.getTask(thread.origin.issueId) : null;
+          if (linkedTask) {
+            const deleted = await deleteTaskAndAttachments(database, linkedTask, resolved.attachmentsDirectory);
+            events.emit("task.deleted", { task: deleted });
+          }
+          return sendEmpty(response, 204);
+        }
+        return methodNotAllowed(response, ["GET", "PATCH", "DELETE"]);
+      }
+
+      const aiInterruptRoute = pathname.match(/^\/api\/local\/ai\/runs\/([^/]+)\/interrupt$/);
+      if (aiInterruptRoute) {
+        if (request.method !== "POST") return methodNotAllowed(response, ["POST"]);
+        assertNoQuery(url.searchParams, "POST /api/local/ai/runs/:id/interrupt");
+        const runId = decodeRouteSegment(aiInterruptRoute[1], "Run id");
+        await assertEmptyRequestBody(request, "POST /api/local/ai/runs/:id/interrupt");
+        const run = await aiChat.interrupt(runId);
+        return sendJson(response, 200, { run });
+      }
+
+      if (pathname === "/api/device-workspaces") {
+        if (request.method !== "GET") return methodNotAllowed(response, ["GET"]);
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "GET /api/device-workspaces does not accept query parameters");
+        }
+        return sendJson(response, 200, {
+          workspaces: await readCodexProjectWorkspaces(resolved.codexStatePath),
+        });
+      }
+
+      if (pathname === "/api/workflow-capabilities") {
+        if (request.method !== "GET") return methodNotAllowed(response, ["GET"]);
+        const unknownQuery = [...url.searchParams.keys()].filter((key) => key !== "workspacePath");
+        if (unknownQuery.length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", `Unknown query parameter: ${unknownQuery[0]}`);
+        }
+        const workspacePath = stringField(
+          url.searchParams.get("workspacePath") ?? null,
+          "workspacePath",
+          { nullable: true, maxLength: 4096 },
+        );
+        if (workspacePath?.includes("\0")) {
+          throw new ApiError(400, "INVALID_FIELD", "'workspacePath' cannot contain null bytes");
+        }
+        if (workspacePath && !path.isAbsolute(workspacePath)) {
+          throw new ApiError(400, "INVALID_FIELD", "'workspacePath' must be absolute");
+        }
+        return sendJson(
+          response,
+          200,
+          await discoverWorkflowCapabilities(resolved, workspacePath ?? PROJECT_ROOT),
+        );
+      }
+
+      let currentCloudConfig = null;
+      if (pathname.startsWith("/api/")) {
+        currentCloudConfig = await cloudConfig.read();
+        if (currentCloudConfig.remoteUrl) {
+          assertLoopbackRequest(request);
+          if (!isLocalCompanionRoute(pathname)) {
+            return sendFetchResponse(
+              response,
+              await cloudProxy.forward(toFetchRequest(request)),
+            );
+          }
+        }
+      }
+
+      if (pathname === "/api/projects") {
+        if (request.method === "GET") {
+          if ([...url.searchParams.keys()].length > 0) {
+            throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "GET /api/projects does not accept query parameters");
+          }
+          return sendJson(response, 200, {
+            projects: await listProjectsWithCodexMetadata(database, resolved.codexStatePath),
+          });
+        }
+        if (request.method === "POST") {
+          const project = database.createProject(parseProjectCreate(await readJson(request)));
+          events.emit("project.created", { project });
+          return sendJson(response, 201, { project });
+        }
+        return methodNotAllowed(response, ["GET", "POST"]);
+      }
+
+      const projectArchiveRoute = pathname.match(/^\/api\/projects\/([^/]+)\/archive$/);
+      if (projectArchiveRoute) {
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "Project archive route does not accept query parameters");
+        }
+        let projectId;
+        try {
+          projectId = decodeURIComponent(projectArchiveRoute[1]);
+        } catch {
+          throw new ApiError(400, "INVALID_PATH", "Project id contains invalid encoding");
+        }
+        validateProjectId(projectId);
+        if (request.method === "POST") {
+          const project = database.archiveProject(projectId);
+          events.emit("project.archived", { project });
+          return sendJson(response, 200, { project });
+        }
+        return methodNotAllowed(response, ["POST"]);
+      }
+
+      const projectDeleteRoute = pathname.match(/^\/api\/projects\/([^/]+)$/);
+      if (projectDeleteRoute) {
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "Project delete route does not accept query parameters");
+        }
+        let projectId;
+        try {
+          projectId = decodeURIComponent(projectDeleteRoute[1]);
+        } catch {
+          throw new ApiError(400, "INVALID_PATH", "Project id contains invalid encoding");
+        }
+        validateProjectId(projectId);
+        if (request.method === "DELETE") {
+          const result = database.deleteProject(projectId);
+          for (const attachment of result.attachments) {
+            try {
+              await unlink(path.join(resolved.attachmentsDirectory, attachment.id));
+            } catch (error) {
+              if (error.code !== "ENOENT") throw error;
+            }
+          }
+          events.emit("project.deleted", { project: result.project });
+          return sendEmpty(response, 204);
+        }
+        return methodNotAllowed(response, ["DELETE"]);
+      }
+
+      const workflowWorkspaceRoute = pathname.match(/^\/api\/projects\/([^/]+)\/workflow-workspace$/);
+      if (workflowWorkspaceRoute) {
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "Workflow workspace routes do not accept query parameters");
+        }
+        let projectId;
+        try {
+          projectId = decodeURIComponent(workflowWorkspaceRoute[1]);
+        } catch {
+          throw new ApiError(400, "INVALID_PATH", "Project id contains invalid encoding");
+        }
+        validateProjectId(projectId);
+        if (request.method === "GET") {
+          return sendJson(response, 200, { workflow: database.getWorkflowWorkspace(projectId) });
+        }
+        if (request.method === "PUT") {
+          const input = parseWorkflowWorkspaceSave(await readJson(request));
+          const workflow = database.saveWorkflowWorkspace(projectId, input.version, input.workspace);
+          events.emit("workflow.updated", {
+            projectId,
+            workflowVersion: workflow.version,
+          });
+          return sendJson(response, 200, { workflow });
+        }
+        return methodNotAllowed(response, ["GET", "PUT"]);
+      }
+
+      const developmentContextsRoute = pathname.match(/^\/api\/projects\/([^/]+)\/development-contexts$/);
+      if (developmentContextsRoute) {
+        if (request.method !== "GET") return methodNotAllowed(response, ["GET"]);
+        const unknownQuery = [...url.searchParams.keys()].filter((key) => (
+          !["codexProjectId", "codexThreadId", "workspacePath"].includes(key)
+        ));
+        if (unknownQuery.length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", `Unknown query parameter: ${unknownQuery[0]}`);
+        }
+        let projectId;
+        try {
+          projectId = decodeURIComponent(developmentContextsRoute[1]);
+        } catch {
+          throw new ApiError(400, "INVALID_PATH", "Project id contains invalid encoding");
+        }
+        validateProjectId(projectId);
+        const project = currentCloudConfig.remoteUrl
+          ? {
+            id: projectId,
+            workspacePath: currentCloudConfig.projectMappings[projectId] ?? null,
+          }
+          : database.getProject(projectId);
+        if (!project) throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${projectId}' does not exist`);
+        const codexProjectId = stringField(url.searchParams.get("codexProjectId") ?? null, "codexProjectId", {
+          nullable: true,
+          maxLength: 128,
+        });
+        const codexThreadId = stringField(url.searchParams.get("codexThreadId") ?? null, "codexThreadId", {
+          nullable: true,
+          maxLength: 256,
+        });
+        const deviceWorkspacePath = stringField(
+          url.searchParams.get("workspacePath") ?? null,
+          "workspacePath",
+          { nullable: true, maxLength: 4096 },
+        );
+        if (deviceWorkspacePath?.includes("\0")) {
+          throw new ApiError(400, "INVALID_FIELD", "'workspacePath' cannot contain null bytes");
+        }
+        const workspacePath = deviceWorkspacePath ?? await resolveProjectWorkspace(
+          project,
+          codexProjectId,
+          codexThreadId,
+          resolved.codexStatePath,
+          resolved.codexProcessesPath,
+        );
+        return sendJson(response, 200, await scanDevelopmentContexts(workspacePath));
+      }
+
+      if (pathname === "/api/tasks") {
+        if (request.method === "GET") {
+          return sendJson(response, 200, { tasks: database.listTasks(parseTaskFilters(url.searchParams)) });
+        }
+        if (request.method === "POST") {
+          const actor = actorFromRequest(request);
+          const { assigneeTarget, ...input } = parseTaskCreate(await readJson(request));
+          const task = database.createTask({
+            ...input,
+            actor,
+            assignee: resolveAssignee(assigneeTarget, actor),
+          });
+          events.emit("task.created", { task });
+          return sendJson(response, 201, { task });
+        }
+        return methodNotAllowed(response, ["GET", "POST"]);
+      }
+
+      if (pathname === "/api/events") {
+        if (request.method !== "GET") return methodNotAllowed(response, ["GET"]);
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "GET /api/events does not accept query parameters");
+        }
+        events.connect(request, response);
+        return;
+      }
+
+      const taskRelationRoute = pathname.match(
+        /^\/api\/tasks\/([^/]+)\/relations\/([^/]+)\/([^/]+)$/,
+      );
+      if (taskRelationRoute) {
+        let taskId;
+        let type;
+        let relatedTaskId;
+        try {
+          taskId = decodeURIComponent(taskRelationRoute[1]);
+          type = decodeURIComponent(taskRelationRoute[2]);
+          relatedTaskId = decodeURIComponent(taskRelationRoute[3]);
+        } catch {
+          throw new ApiError(400, "INVALID_PATH", "Issue relation path contains invalid encoding");
+        }
+        if (
+          taskId.length === 0
+          || taskId.length > 128
+          || relatedTaskId.length === 0
+          || relatedTaskId.length > 128
+        ) {
+          throw new ApiError(400, "INVALID_PATH", "Issue relation task id is invalid");
+        }
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "Issue relation routes do not accept query parameters");
+        }
+        const relationType = parseIssueRelationType(type);
+        if (request.method === "POST") {
+          const { version, threadId } = parseArchive(await readJson(request));
+          const result = database.addTaskRelation(
+            taskId,
+            version,
+            relationType,
+            relatedTaskId,
+            threadId,
+          );
+          events.emit("task.relation.updated", result);
+          return sendJson(response, 200, result);
+        }
+        if (request.method === "DELETE") {
+          const { version, threadId } = parseArchive(await readJson(request));
+          const result = database.removeTaskRelation(
+            taskId,
+            version,
+            relationType,
+            relatedTaskId,
+            threadId,
+          );
+          events.emit("task.relation.updated", result);
+          return sendJson(response, 200, result);
+        }
+        return methodNotAllowed(response, ["POST", "DELETE"]);
+      }
+
+      const taskCommentsRoute = pathname.match(/^\/api\/tasks\/([^/]+)\/comments$/);
+      if (taskCommentsRoute) {
+        let taskId;
+        try {
+          taskId = decodeURIComponent(taskCommentsRoute[1]);
+        } catch {
+          throw new ApiError(400, "INVALID_PATH", "Task id contains invalid encoding");
+        }
+        if (taskId.length === 0 || taskId.length > 128) {
+          throw new ApiError(400, "INVALID_PATH", "Task id is invalid");
+        }
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "Comment routes do not accept query parameters");
+        }
+        if (request.method === "GET") {
+          return sendJson(response, 200, { comments: database.listComments(taskId) });
+        }
+        if (request.method === "POST") {
+          const comment = database.createComment(taskId, {
+            ...parseCommentCreate(await readJson(request)),
+            actor: actorFromRequest(request),
+          });
+          const task = database.getTask(taskId);
+          events.emit("comment.created", { comment, task });
+          return sendJson(response, 201, { comment });
+        }
+        return methodNotAllowed(response, ["GET", "POST"]);
+      }
+
+      const commentRoute = pathname.match(/^\/api\/comments\/([^/]+)$/);
+      if (commentRoute) {
+        let id;
+        try {
+          id = decodeURIComponent(commentRoute[1]);
+        } catch {
+          throw new ApiError(400, "INVALID_PATH", "Comment id contains invalid encoding");
+        }
+        if (id.length === 0 || id.length > 128) {
+          throw new ApiError(400, "INVALID_PATH", "Comment id is invalid");
+        }
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "Comment routes do not accept query parameters");
+        }
+        if (request.method === "PATCH") {
+          const patch = parseCommentPatch(await readJson(request));
+          const comment = database.updateComment(id, patch.version, patch.body, patch.threadId);
+          const task = database.getTask(comment.taskId);
+          events.emit("comment.updated", { comment, task });
+          return sendJson(response, 200, { comment });
+        }
+        if (request.method === "DELETE") {
+          const { version } = parseArchive(await readJson(request));
+          const comment = database.deleteComment(id, version);
+          for (const attachment of comment.attachments) {
+            try {
+              await unlink(path.join(resolved.attachmentsDirectory, attachment.id));
+            } catch (error) {
+              if (error.code !== "ENOENT") throw error;
+            }
+          }
+          const task = database.getTask(comment.taskId);
+          events.emit("comment.deleted", { comment, task });
+          return sendEmpty(response, 204);
+        }
+        return methodNotAllowed(response, ["PATCH", "DELETE"]);
+      }
+
+      const commentAttachmentsRoute = pathname.match(/^\/api\/comments\/([^/]+)\/attachments$/);
+      if (commentAttachmentsRoute) {
+        let commentId;
+        try {
+          commentId = decodeURIComponent(commentAttachmentsRoute[1]);
+        } catch {
+          throw new ApiError(400, "INVALID_PATH", "Comment id contains invalid encoding");
+        }
+        if (commentId.length === 0 || commentId.length > 128) {
+          throw new ApiError(400, "INVALID_PATH", "Comment id is invalid");
+        }
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "Attachment routes do not accept query parameters");
+        }
+        if (request.method === "GET") {
+          return sendJson(response, 200, { attachments: database.listCommentAttachments(commentId) });
+        }
+        if (request.method === "POST") {
+          const comment = database.getComment(commentId);
+          if (!comment) throw new ApiError(404, "COMMENT_NOT_FOUND", `Comment '${commentId}' does not exist`);
+          const metadata = parseAttachmentHeaders(request);
+          const body = await readBody(request, ATTACHMENT_BODY_LIMIT, "Attachment cannot exceed 25 MiB");
+          const id = randomUUID();
+          await mkdir(resolved.attachmentsDirectory, { recursive: true });
+          const storagePath = path.join(resolved.attachmentsDirectory, id);
+          await writeFile(storagePath, body, { flag: "wx" });
+          let attachment;
+          try {
+            attachment = database.createCommentAttachment(commentId, { id, ...metadata, size: body.length });
+          } catch (error) {
+            await unlink(storagePath);
+            throw error;
+          }
+          const task = database.getTask(comment.taskId);
+          events.emit("attachment.created", { attachment, comment: database.getComment(commentId), task });
+          return sendJson(response, 201, { attachment });
+        }
+        return methodNotAllowed(response, ["GET", "POST"]);
+      }
+
+      const taskAttachmentsRoute = pathname.match(/^\/api\/tasks\/([^/]+)\/attachments$/);
+      if (taskAttachmentsRoute) {
+        let taskId;
+        try {
+          taskId = decodeURIComponent(taskAttachmentsRoute[1]);
+        } catch {
+          throw new ApiError(400, "INVALID_PATH", "Task id contains invalid encoding");
+        }
+        if (taskId.length === 0 || taskId.length > 128) {
+          throw new ApiError(400, "INVALID_PATH", "Task id is invalid");
+        }
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "Attachment routes do not accept query parameters");
+        }
+        if (request.method === "GET") {
+          return sendJson(response, 200, { attachments: database.listAttachments(taskId) });
+        }
+        if (request.method === "POST") {
+          const task = database.getTask(taskId);
+          if (!task) throw new ApiError(404, "TASK_NOT_FOUND", `Task '${taskId}' does not exist`);
+          const metadata = parseAttachmentHeaders(request);
+          const body = await readBody(request, ATTACHMENT_BODY_LIMIT, "Attachment cannot exceed 25 MiB");
+          const id = randomUUID();
+          await mkdir(resolved.attachmentsDirectory, { recursive: true });
+          const storagePath = path.join(resolved.attachmentsDirectory, id);
+          await writeFile(storagePath, body, { flag: "wx" });
+          let attachment;
+          try {
+            attachment = database.createAttachment(taskId, { id, ...metadata, size: body.length });
+          } catch (error) {
+            await unlink(storagePath);
+            throw error;
+          }
+          events.emit("attachment.created", { attachment, task });
+          return sendJson(response, 201, { attachment });
+        }
+        return methodNotAllowed(response, ["GET", "POST"]);
+      }
+
+      const attachmentContentRoute = pathname.match(/^\/api\/attachments\/([^/]+)\/content$/);
+      if (attachmentContentRoute) {
+        let id;
+        try {
+          id = decodeURIComponent(attachmentContentRoute[1]);
+        } catch {
+          throw new ApiError(400, "INVALID_PATH", "Attachment id contains invalid encoding");
+        }
+        if (id.length === 0 || id.length > 128) {
+          throw new ApiError(400, "INVALID_PATH", "Attachment id is invalid");
+        }
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "Attachment routes do not accept query parameters");
+        }
+        if (request.method !== "GET" && request.method !== "HEAD") {
+          return methodNotAllowed(response, ["GET", "HEAD"]);
+        }
+        const attachment = database.getAttachment(id);
+        if (!attachment) throw new ApiError(404, "ATTACHMENT_NOT_FOUND", `Attachment '${id}' does not exist`);
+        const body = await readFile(path.join(resolved.attachmentsDirectory, attachment.id));
+        const encodedFilename = encodeURIComponent(attachment.filename).replace(/['()*]/g, (character) => (
+          `%${character.charCodeAt(0).toString(16).toUpperCase()}`
+        ));
+        const canOpenInline = INLINE_ATTACHMENT_TYPES.has(attachment.contentType);
+        response.writeHead(200, {
+          "cache-control": "private, no-store",
+          "content-disposition": `${canOpenInline ? "inline" : "attachment"}; filename*=UTF-8''${encodedFilename}`,
+          "content-length": body.length,
+          "content-security-policy": "sandbox; default-src 'none'",
+          "content-type": canOpenInline ? attachment.contentType : "application/octet-stream",
+        });
+        response.end(request.method === "HEAD" ? undefined : body);
+        return;
+      }
+
+      const attachmentRoute = pathname.match(/^\/api\/attachments\/([^/]+)$/);
+      if (attachmentRoute) {
+        let id;
+        try {
+          id = decodeURIComponent(attachmentRoute[1]);
+        } catch {
+          throw new ApiError(400, "INVALID_PATH", "Attachment id contains invalid encoding");
+        }
+        if (id.length === 0 || id.length > 128) {
+          throw new ApiError(400, "INVALID_PATH", "Attachment id is invalid");
+        }
+        if ([...url.searchParams.keys()].length > 0) {
+          throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "Attachment routes do not accept query parameters");
+        }
+        if (request.method !== "DELETE") return methodNotAllowed(response, ["DELETE"]);
+        const attachment = database.getAttachment(id);
+        if (!attachment) throw new ApiError(404, "ATTACHMENT_NOT_FOUND", `Attachment '${id}' does not exist`);
+        try {
+          await unlink(path.join(resolved.attachmentsDirectory, attachment.id));
+        } catch (error) {
+          if (error.code !== "ENOENT") throw error;
+        }
+        database.deleteAttachment(id);
+        const task = database.getTask(attachment.taskId);
+        events.emit("attachment.deleted", { attachment, task });
+        return sendEmpty(response, 204);
+      }
+
+      const taskRoute = pathname.match(/^\/api\/tasks\/([^/]+)(?:\/(archive|restore|move))?$/);
+      if (taskRoute) {
+        let id;
+        try {
+          id = decodeURIComponent(taskRoute[1]);
+        } catch {
+          throw new ApiError(400, "INVALID_PATH", "Task id contains invalid encoding");
+        }
+        if (id.length === 0 || id.length > 128) {
+          throw new ApiError(400, "INVALID_PATH", "Task id is invalid");
+        }
+        const action = taskRoute[2];
+        if (!action && request.method === "GET") {
+          if ([...url.searchParams.keys()].length > 0) {
+            throw new ApiError(400, "UNKNOWN_QUERY_PARAMETER", "GET /api/tasks/:id does not accept query parameters");
+          }
+          const task = database.getTask(id);
+          if (!task) throw new ApiError(404, "TASK_NOT_FOUND", `Task '${id}' does not exist`);
+          return sendJson(response, 200, { task });
+        }
+        if (!action && request.method === "PATCH") {
+          const { version, changes, threadId, assigneeTarget } = parseTaskPatch(await readJson(request));
+          if (assigneeTarget !== undefined) {
+            changes.assignee = resolveAssignee(assigneeTarget, actorFromRequest(request));
+          }
+          const task = database.updateTask(id, version, changes, threadId);
+          events.emit("task.updated", { task });
+          return sendJson(response, 200, { task });
+        }
+        if (!action && request.method === "DELETE") {
+          const { version } = parseArchive(await readJson(request));
+          const task = await deleteTaskAndAttachments(database, { id, version }, resolved.attachmentsDirectory);
+          events.emit("task.deleted", { task });
+          return sendEmpty(response, 204);
+        }
+        if (action === "move" && request.method === "POST") {
+          const move = parseMove(await readJson(request));
+          const previousProjectId = move.projectId === undefined ? undefined : database.getTask(id).projectId;
+          const task = database.moveTask(id, move.version, move.status, move.sortOrder, move.threadId, move.projectId);
+          events.emit("task.moved", { task, previousProjectId });
+          return sendJson(response, 200, { task });
+        }
+        if (action === "archive" && request.method === "POST") {
+          const { version, threadId } = parseArchive(await readJson(request));
+          const task = database.archiveTask(id, version, threadId);
+          events.emit("task.archived", { task });
+          return sendJson(response, 200, { task });
+        }
+        if (action === "restore" && request.method === "POST") {
+          const { version, threadId } = parseArchive(await readJson(request));
+          const task = database.restoreTask(id, version, threadId);
+          events.emit("task.restored", { task });
+          return sendJson(response, 200, { task });
+        }
+        return methodNotAllowed(response, action ? ["POST"] : ["GET", "PATCH", "DELETE"]);
+      }
+
+      if (pathname.startsWith("/api/")) {
+        throw new ApiError(404, "NOT_FOUND", "API route not found");
+      }
+      if (await serveStatic(request, response, pathname, resolved.staticDirectory)) return;
+      throw new ApiError(404, "NOT_FOUND", "Resource not found");
+    } catch (error) {
+      if (response.headersSent) {
+        response.destroy(error);
+        return;
+      }
+      if (error instanceof ApiError) {
+        const payload = { error: { code: error.code, message: error.message } };
+        if (error.details !== undefined) payload.error.details = error.details;
+        sendJson(response, error.status, payload, error.headers);
+        return;
+      }
+      if (error instanceof CloudProxyError) {
+        const payload = { error: { code: error.code, message: error.message } };
+        if (error.details !== undefined) payload.error.details = error.details;
+        sendJson(response, error.status, payload);
+        return;
+      }
+      console.error(error);
+      sendJson(response, 500, { error: { code: "INTERNAL_ERROR", message: "Internal server error" } });
+    }
+  });
+
+  let listening = false;
+  return {
+    database,
+    aiChat,
+    server,
+    options: resolved,
+    async listen({ host = LOOPBACK_TASKBOARD_HOST, port = resolvePort() } = {}) {
+      if (host !== LOOPBACK_TASKBOARD_HOST && host !== LAN_TASKBOARD_HOST) {
+        throw new Error(`Taskboard server must bind to ${LOOPBACK_TASKBOARD_HOST} or ${LAN_TASKBOARD_HOST}`);
+      }
+      if (host === LAN_TASKBOARD_HOST && !sharedSecret) {
+        throw new Error(`${TASKBOARD_SHARED_SECRET_ENV} is required when CODEX_TASKBOARD_HOST=${LAN_TASKBOARD_HOST}`);
+      }
+      activeHost = host;
+      await new Promise((resolve, reject) => {
+        const onError = (error) => {
+          server.off("listening", onListening);
+          reject(error);
+        };
+        const onListening = () => {
+          server.off("error", onError);
+          resolve();
+        };
+        server.once("error", onError);
+        server.once("listening", onListening);
+        server.listen(port, host);
+      });
+      listening = true;
+      return server.address();
+    },
+    async close() {
+      const serverClosed = listening
+        ? new Promise((resolve, reject) => {
+            server.close((error) => error ? reject(error) : resolve());
+          })
+        : Promise.resolve();
+      events.close();
+      for (const response of aiEventResponses) response.end();
+      aiEventResponses.clear();
+      await aiChat.close();
+      await serverClosed;
+      listening = false;
+      database.close();
+    },
+  };
+}
diff --git a/apps/codex-taskboard/server/cloud-config.mjs b/apps/codex-taskboard/server/cloud-config.mjs
new file mode 100644
index 000000000..a8a500767
--- /dev/null
+++ b/apps/codex-taskboard/server/cloud-config.mjs
@@ -0,0 +1,189 @@
+import { chmod, mkdir, readFile, rename, writeFile } from "node:fs/promises";
+import path from "node:path";
+
+const CONFIG_VERSION = 1;
+
+class CloudConfigError extends Error {
+  constructor(code, message) {
+    super(message);
+    this.name = "CloudConfigError";
+    this.code = code;
+  }
+}
+
+function emptyConfig() {
+  return {
+    version: CONFIG_VERSION,
+    remoteUrl: null,
+    actorName: null,
+    sharedKey: null,
+    projectMappings: {},
+  };
+}
+
+export function normalizeCloudUrl(value) {
+  let url;
+  try {
+    url = new URL(value);
+  } catch {
+    throw new CloudConfigError("INVALID_CLOUD_URL", "Cloud taskboard URL must be a valid URL");
+  }
+  const isLoopback = url.hostname === "localhost"
+    || url.hostname === "127.0.0.1"
+    || url.hostname === "[::1]";
+  if (
+    (url.protocol !== "https:" && !(url.protocol === "http:" && isLoopback))
+    || url.username
+    || url.password
+    || url.pathname !== "/"
+    || url.search
+    || url.hash
+  ) {
+    throw new CloudConfigError(
+      "INVALID_CLOUD_URL",
+      "Cloud taskboard URL must be an HTTPS origin (loopback HTTP is allowed for development)",
+    );
+  }
+  return url.origin;
+}
+
+function validateCredentials(actorName, sharedKey) {
+  if (
+    typeof actorName !== "string"
+    || !actorName.trim()
+    || actorName.length > 120
+    || actorName.includes(":")
+  ) {
+    throw new CloudConfigError(
+      "INVALID_CLOUD_ACTOR",
+      "Cloud actor name must be 1 to 120 characters and cannot contain ':'",
+    );
+  }
+  if (typeof sharedKey !== "string" || !sharedKey || sharedKey.length > 4096) {
+    throw new CloudConfigError(
+      "INVALID_CLOUD_KEY",
+      "Cloud shared key must be 1 to 4096 characters",
+    );
+  }
+  return { actorName: actorName.trim(), sharedKey };
+}
+
+function validateProjectMappings(value) {
+  if (value === null || typeof value !== "object" || Array.isArray(value)) {
+    throw new CloudConfigError("INVALID_CLOUD_CONFIG", "Cloud project mappings are invalid");
+  }
+  const projectMappings = {};
+  for (const [projectId, workspacePath] of Object.entries(value)) {
+    if (!projectId || typeof workspacePath !== "string" || !path.isAbsolute(workspacePath)) {
+      throw new CloudConfigError("INVALID_CLOUD_CONFIG", "Cloud project mappings are invalid");
+    }
+    projectMappings[projectId] = workspacePath;
+  }
+  return projectMappings;
+}
+
+function parseConfig(value) {
+  if (
+    value === null
+    || typeof value !== "object"
+    || Array.isArray(value)
+    || value.version !== CONFIG_VERSION
+  ) {
+    throw new CloudConfigError("INVALID_CLOUD_CONFIG", "Cloud companion configuration is invalid");
+  }
+  const allowedKeys = new Set([
+    "version",
+    "remoteUrl",
+    "actorName",
+    "sharedKey",
+    "projectMappings",
+  ]);
+  if (Object.keys(value).some((key) => !allowedKeys.has(key))) {
+    throw new CloudConfigError("INVALID_CLOUD_CONFIG", "Cloud companion configuration is invalid");
+  }
+  const projectMappings = validateProjectMappings(value.projectMappings);
+  if (value.remoteUrl === null && value.actorName === null && value.sharedKey === null) {
+    return { ...emptyConfig(), projectMappings };
+  }
+  const credentials = validateCredentials(value.actorName, value.sharedKey);
+  return {
+    version: CONFIG_VERSION,
+    remoteUrl: normalizeCloudUrl(value.remoteUrl),
+    ...credentials,
+    projectMappings,
+  };
+}
+
+export function createCloudConfigStore({ configPath }) {
+  if (!configPath) throw new Error("configPath is required");
+  let pendingWrite = Promise.resolve();
+
+  async function readFromDisk() {
+    try {
+      return parseConfig(JSON.parse(await readFile(configPath, "utf8")));
+    } catch (error) {
+      if (error?.code === "ENOENT") return emptyConfig();
+      throw error;
+    }
+  }
+
+  async function writeAtomically(config) {
+    await mkdir(path.dirname(configPath), { recursive: true });
+    const temporaryPath = `${configPath}.${process.pid}.${Date.now()}.tmp`;
+    await writeFile(temporaryPath, `${JSON.stringify(config, null, 2)}\n`, { mode: 0o600 });
+    await chmod(temporaryPath, 0o600);
+    await rename(temporaryPath, configPath);
+  }
+
+  function update(mutator) {
+    const operation = pendingWrite.then(async () => {
+      const next = mutator(await readFromDisk());
+      await writeAtomically(next);
+      return next;
+    });
+    pendingWrite = operation.catch(() => {});
+    return operation;
+  }
+
+  return {
+    async read() {
+      await pendingWrite;
+      return readFromDisk();
+    },
+    async configure({ remoteUrl, actorName, sharedKey }) {
+      const normalizedUrl = normalizeCloudUrl(remoteUrl);
+      const credentials = validateCredentials(actorName, sharedKey);
+      return update((config) => ({
+        ...config,
+        remoteUrl: normalizedUrl,
+        ...credentials,
+      }));
+    },
+    clearCloud() {
+      return update((config) => ({
+        ...config,
+        remoteUrl: null,
+        actorName: null,
+        sharedKey: null,
+      }));
+    },
+    setProjectWorkspace(projectId, workspacePath) {
+      if (typeof projectId !== "string" || !projectId.trim()) {
+        throw new CloudConfigError("INVALID_PROJECT_MAPPING", "projectId is required");
+      }
+      if (typeof workspacePath !== "string" || !path.isAbsolute(workspacePath)) {
+        throw new CloudConfigError(
+          "INVALID_PROJECT_MAPPING",
+          "workspacePath must be absolute",
+        );
+      }
+      return update((config) => ({
+        ...config,
+        projectMappings: {
+          ...config.projectMappings,
+          [projectId]: workspacePath,
+        },
+      }));
+    },
+  };
+}
diff --git a/apps/codex-taskboard/server/cloud-proxy.mjs b/apps/codex-taskboard/server/cloud-proxy.mjs
new file mode 100644
index 000000000..e1c1cd166
--- /dev/null
+++ b/apps/codex-taskboard/server/cloud-proxy.mjs
@@ -0,0 +1,261 @@
+import path from "node:path";
+
+import { normalizeCloudUrl } from "./cloud-config.mjs";
+
+const LOCAL_COMPANION_ROUTES = new Set([
+  "/health",
+  "/api/meta",
+  "/api/device-workspaces",
+  "/api/workflow-capabilities",
+  "/api/local/cloud-session",
+]);
+
+export class CloudProxyError extends Error {
+  constructor(status, code, message, details) {
+    super(message);
+    this.name = "CloudProxyError";
+    this.status = status;
+    this.code = code;
+    this.details = details;
+  }
+}
+
+export function isLocalCompanionRoute(pathname) {
+  return LOCAL_COMPANION_ROUTES.has(pathname)
+    || pathname.startsWith("/api/local/")
+    || /^\/api\/projects\/[^/]+\/development-contexts$/.test(pathname);
+}
+
+function basicAuthorization(actorName, sharedKey) {
+  return `Basic ${Buffer.from(`${actorName}:${sharedKey}`, "utf8").toString("base64")}`;
+}
+
+function removeGitWorktreePaths(value) {
+  if (Array.isArray(value)) {
+    for (const item of value) removeGitWorktreePaths(item);
+    return;
+  }
+  if (value === null || typeof value !== "object") return;
+  for (const [key, item] of Object.entries(value)) {
+    if (key === "gitWorktreePath") {
+      delete value[key];
+    } else {
+      removeGitWorktreePaths(item);
+    }
+  }
+}
+
+async function prepareRequest(request) {
+  const url = new URL(request.url);
+  let projectWorkspace = null;
+  let body = request.body;
+  const isJson = request.headers.get("content-type")?.includes("application/json");
+  const isProjectCreate = request.method === "POST" && url.pathname === "/api/projects";
+  const isTaskMutation = (
+    (request.method === "POST" && url.pathname === "/api/tasks")
+    || (request.method === "PATCH" && /^\/api\/tasks\/[^/]+$/.test(url.pathname))
+  );
+  const isWorkflowMutation = request.method === "PUT"
+    && /^\/api\/projects\/[^/]+\/workflow-workspace$/.test(url.pathname);
+
+  if (isJson && (isProjectCreate || isTaskMutation || isWorkflowMutation)) {
+    let payload;
+    try {
+      payload = await request.clone().json();
+    } catch {
+      throw new CloudProxyError(400, "INVALID_JSON", "Request body must contain valid JSON");
+    }
+    if (payload === null || typeof payload !== "object" || Array.isArray(payload)) {
+      throw new CloudProxyError(400, "INVALID_BODY", "Request body must be a JSON object");
+    }
+    if (isProjectCreate && Object.hasOwn(payload, "workspacePath")) {
+      if (typeof payload.workspacePath === "string") {
+        if (!path.isAbsolute(payload.workspacePath)) {
+          throw new CloudProxyError(
+            400,
+            "INVALID_PROJECT_MAPPING",
+            "Project workspacePath must be absolute",
+          );
+        }
+        projectWorkspace = {
+          projectId: typeof payload.id === "string" ? payload.id : null,
+          workspacePath: payload.workspacePath,
+        };
+      }
+      delete payload.workspacePath;
+    }
+    if (isTaskMutation && payload.developmentContext?.type === "worktree") {
+      payload.developmentContext = {
+        type: "worktree",
+        ...(payload.developmentContext.branch === undefined
+          ? {}
+          : { branch: payload.developmentContext.branch }),
+      };
+    }
+    if (isWorkflowMutation) removeGitWorktreePaths(payload.workspace);
+    body = JSON.stringify(payload);
+  }
+
+  return { body, projectWorkspace };
+}
+
+async function localizeTask(task, resolveDevelopmentContext) {
+  if (!task || typeof task !== "object" || task.developmentContext?.type !== "worktree") {
+    return task;
+  }
+  const cloudContext = {
+    type: "worktree",
+    ...(task.developmentContext.branch === undefined
+      ? {}
+      : { branch: task.developmentContext.branch }),
+  };
+  const localContext = resolveDevelopmentContext
+    ? await resolveDevelopmentContext(task.projectId, cloudContext)
+    : null;
+  return {
+    ...task,
+    developmentContext: localContext ?? { ...cloudContext, path: null },
+  };
+}
+
+async function localizeResponse(
+  response,
+  { readConfig, setProjectWorkspace, projectWorkspace, resolveDevelopmentContext },
+) {
+  if (response.status === 401) return response;
+  if (!response.headers.get("content-type")?.includes("application/json")) return response;
+  const payload = await response.json();
+
+  if (response.ok && projectWorkspace) {
+    const projectId = projectWorkspace.projectId ?? payload.project?.id;
+    if (projectId) {
+      await setProjectWorkspace(projectId, projectWorkspace.workspacePath);
+    }
+  }
+
+  const config = await readConfig();
+  if (Array.isArray(payload.projects)) {
+    payload.projects = payload.projects.map((project) => ({
+      ...project,
+      workspacePath: config.projectMappings[project.id] ?? null,
+    }));
+  }
+  if (payload.project && typeof payload.project === "object") {
+    payload.project = {
+      ...payload.project,
+      workspacePath: config.projectMappings[payload.project.id] ?? null,
+    };
+  }
+  if (payload.task) {
+    payload.task = await localizeTask(payload.task, resolveDevelopmentContext);
+  }
+  if (Array.isArray(payload.tasks)) {
+    const contexts = new Map();
+    const resolveOnce = resolveDevelopmentContext
+      ? (projectId, context) => {
+        const key = `${projectId ?? ""}\0${context.branch ?? ""}`;
+        if (!contexts.has(key)) {
+          contexts.set(key, resolveDevelopmentContext(projectId, context));
+        }
+        return contexts.get(key);
+      }
+      : null;
+    payload.tasks = await Promise.all(
+      payload.tasks.map((task) => localizeTask(task, resolveOnce)),
+    );
+  }
+
+  const headers = new Headers(response.headers);
+  headers.delete("content-length");
+  headers.delete("content-encoding");
+  return new Response(JSON.stringify(payload), {
+    status: response.status,
+    statusText: response.statusText,
+    headers,
+  });
+}
+
+export function createCloudProxy({
+  configStore,
+  getConfig,
+  fetch: fetchImplementation = globalThis.fetch,
+  resolveDevelopmentContext,
+}) {
+  const readConfig = getConfig ?? (() => configStore.read());
+  const setProjectWorkspace = configStore?.setProjectWorkspace?.bind(configStore);
+
+  return {
+    async forward(request) {
+      const config = await readConfig();
+      if (!config?.remoteUrl || !config.actorName || !config.sharedKey) {
+        throw new CloudProxyError(
+          409,
+          "CLOUD_NOT_CONFIGURED",
+          "Cloud collaboration is not configured",
+        );
+      }
+      let remoteUrl;
+      try {
+        remoteUrl = normalizeCloudUrl(config.remoteUrl);
+      } catch (error) {
+        throw new CloudProxyError(
+          500,
+          "INVALID_CLOUD_CONFIG",
+          error instanceof Error ? error.message : String(error),
+        );
+      }
+
+      const sourceUrl = new URL(request.url);
+      const upstreamUrl = new URL(
+        `${sourceUrl.pathname}${sourceUrl.search}`,
+        `${remoteUrl}/`,
+      );
+      const headers = new Headers(request.headers);
+      headers.delete("authorization");
+      headers.delete("host");
+      headers.delete("connection");
+      headers.delete("transfer-encoding");
+      for (const name of [...headers.keys()]) {
+        if (name.toLowerCase().startsWith("x-taskboard-user-")) headers.delete(name);
+      }
+      headers.set("authorization", basicAuthorization(config.actorName, config.sharedKey));
+
+      const prepared = await prepareRequest(request);
+      if (prepared.projectWorkspace && !setProjectWorkspace) {
+        throw new CloudProxyError(
+          500,
+          "PROJECT_MAPPING_UNAVAILABLE",
+          "Local project mapping storage is unavailable",
+        );
+      }
+      if (typeof prepared.body === "string") headers.delete("content-length");
+      const init = {
+        method: request.method,
+        headers,
+        redirect: "manual",
+      };
+      if (request.method !== "GET" && request.method !== "HEAD" && prepared.body !== null) {
+        init.body = prepared.body;
+        if (typeof prepared.body !== "string") init.duplex = "half";
+      }
+
+      let response;
+      try {
+        response = await fetchImplementation(upstreamUrl, init);
+      } catch (error) {
+        throw new CloudProxyError(
+          502,
+          "REMOTE_UNAVAILABLE",
+          `Cannot reach cloud taskboard at ${remoteUrl}`,
+          error instanceof Error ? error.message : String(error),
+        );
+      }
+      return localizeResponse(response, {
+        readConfig,
+        setProjectWorkspace,
+        projectWorkspace: prepared.projectWorkspace,
+        resolveDevelopmentContext,
+      });
+    },
+  };
+}
diff --git a/apps/codex-taskboard/server/database.mjs b/apps/codex-taskboard/server/database.mjs
new file mode 100644
index 000000000..c673e899d
--- /dev/null
+++ b/apps/codex-taskboard/server/database.mjs
@@ -0,0 +1,1706 @@
+import { randomUUID } from "node:crypto";
+import { mkdirSync } from "node:fs";
+import path from "node:path";
+import { DatabaseSync } from "node:sqlite";
+
+import { DEFAULT_PROJECT_ID, DEFAULT_PROJECT_NAME } from "../shared/domain.mjs";
+
+export class ApiError extends Error {
+  constructor(status, code, message, details) {
+    super(message);
+    this.name = "ApiError";
+    this.status = status;
+    this.code = code;
+    this.details = details;
+  }
+}
+
+function now() {
+  return new Date().toISOString();
+}
+
+function taskFromRow(row) {
+  const developmentContext = row.worktree_path
+    ? { type: "worktree", path: row.worktree_path, branch: row.worktree_branch }
+    : row.git_branch
+      ? { type: "branch", branch: row.git_branch }
+      : null;
+  return {
+    id: row.id,
+    identifier: row.identifier,
+    projectId: row.project_id,
+    title: row.title,
+    description: row.description,
+    status: row.status,
+    priority: row.priority,
+    labels: JSON.parse(row.labels),
+    sortOrder: row.sort_order,
+    threadId: row.thread_id,
+    creatorType: row.creator_type,
+    creatorId: row.creator_id,
+    creatorName: row.creator_name,
+    creatorAvatarUrl: row.creator_avatar_url,
+    assignee: {
+      type: row.assignee_type,
+      id: row.assignee_id,
+      name: row.assignee_name,
+      avatarUrl: row.assignee_avatar_url,
+    },
+    workflowId: row.workflow_id,
+    developmentContext,
+    dueDate: row.due_date,
+    recurrence: row.recurrence_interval && row.recurrence_unit
+      ? { interval: row.recurrence_interval, unit: row.recurrence_unit }
+      : null,
+    archivedAt: row.archived_at,
+    version: row.version,
+    createdAt: row.created_at,
+    updatedAt: row.updated_at,
+  };
+}
+
+function taskRelationSummaryFromRow(row) {
+  return {
+    id: row.id,
+    identifier: row.identifier,
+    projectId: row.project_id,
+    title: row.title,
+    status: row.status,
+    priority: row.priority,
+    threadId: row.thread_id,
+    assignee: {
+      type: row.assignee_type,
+      id: row.assignee_id,
+      name: row.assignee_name,
+      avatarUrl: row.assignee_avatar_url,
+    },
+    archivedAt: row.archived_at,
+  };
+}
+
+function commentFromRow(row) {
+  return {
+    id: row.id,
+    taskId: row.task_id,
+    body: row.body,
+    threadId: row.thread_id,
+    authorType: row.author_type,
+    authorId: row.author_id,
+    authorName: row.author_name,
+    authorAvatarUrl: row.author_avatar_url,
+    attachments: [],
+    version: row.version,
+    createdAt: row.created_at,
+    updatedAt: row.updated_at,
+  };
+}
+
+function attachmentFromRow(row) {
+  return {
+    id: row.id,
+    taskId: row.task_id,
+    commentId: row.comment_id,
+    filename: row.filename,
+    contentType: row.content_type,
+    size: row.size,
+    createdAt: row.created_at,
+  };
+}
+
+function projectFromRow(row) {
+  return {
+    id: row.id,
+    name: row.name,
+    workspacePath: row.workspace_path,
+    archivedAt: row.archived_at,
+    issueCount: Number(row.issue_count ?? 0),
+    createdAt: row.created_at,
+    updatedAt: row.updated_at,
+  };
+}
+
+function workflowWorkspaceFromRow(row) {
+  return {
+    projectId: row.project_id,
+    workspace: JSON.parse(row.workspace),
+    version: row.version,
+    updatedAt: row.updated_at,
+  };
+}
+
+function aiChatRunFromRow(row) {
+  return {
+    id: row.id,
+    threadId: row.thread_id,
+    status: row.status,
+    exitCode: row.exit_code,
+    error: row.error,
+    startedAt: row.started_at,
+    finishedAt: row.finished_at,
+  };
+}
+
+function aiChatThreadFromRow(row) {
+  return {
+    id: row.id,
+    title: row.title,
+    status: row.status,
+    origin: {
+      projectId: row.origin_project_id,
+      projectName: row.origin_project_name,
+      workspacePath: row.origin_workspace_path,
+      ...(row.origin_issue_id ? { issueId: row.origin_issue_id } : {}),
+      ...(row.origin_issue_identifier ? { issueIdentifier: row.origin_issue_identifier } : {}),
+    },
+    codexThreadId: row.codex_thread_id,
+    model: row.model,
+    reasoningEffort: row.reasoning_effort,
+    sandbox: row.sandbox,
+    currentRun: null,
+    createdAt: row.created_at,
+    updatedAt: row.updated_at,
+  };
+}
+
+function aiChatEventFromRow(row) {
+  return {
+    id: row.id,
+    threadId: row.thread_id,
+    runId: row.run_id,
+    type: row.type,
+    role: row.role,
+    content: row.content,
+    data: row.data === null ? null : JSON.parse(row.data),
+    createdAt: row.created_at,
+  };
+}
+
+function projectPrefix(projectId) {
+  const prefix = projectId.toUpperCase().replace(/[^A-Z0-9]+/g, "");
+  return (prefix || "TASK").slice(0, 12);
+}
+
+export class TaskboardDatabase {
+  constructor(filename) {
+    mkdirSync(path.dirname(filename), { recursive: true });
+    this.database = new DatabaseSync(filename);
+    this.database.exec("PRAGMA foreign_keys = ON; PRAGMA journal_mode = WAL; PRAGMA busy_timeout = 5000;");
+    this.#migrate();
+    this.interruptAbandonedAiChatRuns();
+  }
+
+  #migrate() {
+    this.database.exec(`
+      CREATE TABLE IF NOT EXISTS projects (
+        id TEXT PRIMARY KEY,
+        name TEXT NOT NULL,
+        workspace_path TEXT,
+        next_task_number INTEGER NOT NULL DEFAULT 1 CHECK (next_task_number > 0),
+        archived_at TEXT,
+        created_at TEXT NOT NULL,
+        updated_at TEXT NOT NULL
+      );
+
+      CREATE TABLE IF NOT EXISTS tasks (
+        id TEXT PRIMARY KEY,
+        identifier TEXT NOT NULL UNIQUE,
+        project_id TEXT NOT NULL REFERENCES projects(id),
+        title TEXT NOT NULL,
+        description TEXT NOT NULL DEFAULT '',
+        status TEXT NOT NULL CHECK (status IN (
+          'backlog', 'todo', 'in_progress', 'in_review', 'blocked', 'done', 'canceled'
+        )),
+        priority TEXT NOT NULL CHECK (priority IN ('none', 'urgent', 'high', 'medium', 'low')),
+        labels TEXT NOT NULL DEFAULT '[]',
+        sort_order REAL NOT NULL,
+        thread_id TEXT,
+        creator_type TEXT NOT NULL DEFAULT 'user',
+        creator_id TEXT NOT NULL DEFAULT 'local-user',
+        creator_name TEXT NOT NULL DEFAULT '本地用户',
+        creator_avatar_url TEXT,
+        assignee_type TEXT NOT NULL DEFAULT 'user' CHECK (assignee_type IN ('user', 'agent')),
+        assignee_id TEXT NOT NULL DEFAULT 'local-user',
+        assignee_name TEXT NOT NULL DEFAULT '本地用户',
+        assignee_avatar_url TEXT,
+        workflow_id TEXT,
+        git_branch TEXT,
+        worktree_path TEXT,
+        worktree_branch TEXT,
+        due_date TEXT,
+        recurrence_interval INTEGER,
+        recurrence_unit TEXT,
+        archived_at TEXT,
+        version INTEGER NOT NULL DEFAULT 1 CHECK (version > 0),
+        created_at TEXT NOT NULL,
+        updated_at TEXT NOT NULL
+      );
+
+      CREATE INDEX IF NOT EXISTS tasks_project_status_sort
+        ON tasks(project_id, archived_at, status, sort_order, created_at);
+
+      CREATE TABLE IF NOT EXISTS comments (
+        id TEXT PRIMARY KEY,
+        task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE,
+        body TEXT NOT NULL,
+        thread_id TEXT,
+        author_type TEXT NOT NULL DEFAULT 'user',
+        author_id TEXT NOT NULL,
+        author_name TEXT NOT NULL,
+        author_avatar_url TEXT,
+        version INTEGER NOT NULL DEFAULT 1 CHECK (version > 0),
+        created_at TEXT NOT NULL,
+        updated_at TEXT NOT NULL
+      );
+
+      CREATE INDEX IF NOT EXISTS comments_task_created
+        ON comments(task_id, created_at, id);
+
+      CREATE TABLE IF NOT EXISTS attachments (
+        id TEXT PRIMARY KEY,
+        task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE,
+        comment_id TEXT REFERENCES comments(id) ON DELETE CASCADE,
+        filename TEXT NOT NULL,
+        content_type TEXT NOT NULL,
+        size INTEGER NOT NULL CHECK (size >= 0),
+        created_at TEXT NOT NULL
+      );
+
+      CREATE INDEX IF NOT EXISTS attachments_task_created
+        ON attachments(task_id, created_at, id);
+
+      CREATE TABLE IF NOT EXISTS workflow_workspaces (
+        project_id TEXT PRIMARY KEY REFERENCES projects(id) ON DELETE CASCADE,
+        workspace TEXT NOT NULL,
+        version INTEGER NOT NULL DEFAULT 1 CHECK (version > 0),
+        updated_at TEXT NOT NULL
+      );
+
+      CREATE TABLE IF NOT EXISTS ai_chat_threads (
+        id TEXT PRIMARY KEY,
+        title TEXT NOT NULL,
+        status TEXT NOT NULL CHECK (status IN ('idle', 'running', 'failed')),
+        origin_project_id TEXT NOT NULL,
+        origin_project_name TEXT NOT NULL,
+        origin_workspace_path TEXT NOT NULL,
+        origin_issue_id TEXT,
+        origin_issue_identifier TEXT,
+        codex_thread_id TEXT,
+        model TEXT NOT NULL,
+        reasoning_effort TEXT NOT NULL,
+        sandbox TEXT NOT NULL CHECK (sandbox IN (
+          'read-only', 'workspace-write', 'danger-full-access'
+        )),
+        created_at TEXT NOT NULL,
+        updated_at TEXT NOT NULL
+      );
+
+      CREATE INDEX IF NOT EXISTS ai_chat_threads_updated
+        ON ai_chat_threads(updated_at DESC, id);
+
+      CREATE TABLE IF NOT EXISTS ai_chat_runs (
+        id TEXT PRIMARY KEY,
+        thread_id TEXT NOT NULL REFERENCES ai_chat_threads(id) ON DELETE CASCADE,
+        status TEXT NOT NULL CHECK (status IN (
+          'running', 'completed', 'failed', 'interrupted'
+        )),
+        exit_code INTEGER,
+        error TEXT,
+        started_at TEXT NOT NULL,
+        finished_at TEXT
+      );
+
+      CREATE INDEX IF NOT EXISTS ai_chat_runs_thread_started
+        ON ai_chat_runs(thread_id, started_at, id);
+
+      CREATE UNIQUE INDEX IF NOT EXISTS ai_chat_runs_one_active
+        ON ai_chat_runs(thread_id)
+        WHERE status = 'running';
+
+      CREATE TABLE IF NOT EXISTS ai_chat_events (
+        id TEXT PRIMARY KEY,
+        thread_id TEXT NOT NULL REFERENCES ai_chat_threads(id) ON DELETE CASCADE,
+        run_id TEXT REFERENCES ai_chat_runs(id) ON DELETE CASCADE,
+        type TEXT NOT NULL,
+        role TEXT NOT NULL CHECK (role IN ('user', 'assistant', 'activity', 'error')),
+        content TEXT NOT NULL,
+        data TEXT,
+        created_at TEXT NOT NULL
+      );
+
+      CREATE INDEX IF NOT EXISTS ai_chat_events_thread_created
+        ON ai_chat_events(thread_id, created_at, id);
+
+    `);
+
+    const projectColumns = this.database.prepare("PRAGMA table_info(projects)").all();
+    if (!projectColumns.some((column) => column.name === "workspace_path")) {
+      this.database.exec("ALTER TABLE projects ADD COLUMN workspace_path TEXT");
+    }
+    if (!projectColumns.some((column) => column.name === "archived_at")) {
+      this.database.exec("ALTER TABLE projects ADD COLUMN archived_at TEXT");
+    }
+    this.database.exec(`
+      CREATE INDEX IF NOT EXISTS projects_archived_created
+        ON projects(archived_at, created_at, id)
+    `);
+
+    const taskColumns = this.database.prepare("PRAGMA table_info(tasks)").all();
+    const hasThreadId = taskColumns.some((column) => column.name === "thread_id");
+    const hasLinkedThreadId = taskColumns.some((column) => column.name === "linked_thread_id");
+    if (!hasThreadId) {
+      this.database.exec("ALTER TABLE tasks ADD COLUMN thread_id TEXT");
+    }
+    if (hasLinkedThreadId) {
+      this.database.exec(`
+        UPDATE tasks
+        SET thread_id = COALESCE(thread_id, linked_thread_id)
+      `);
+      this.database.exec("ALTER TABLE tasks DROP COLUMN linked_thread_id");
+    }
+    if (!taskColumns.some((column) => column.name === "git_branch")) {
+      this.database.exec("ALTER TABLE tasks ADD COLUMN git_branch TEXT");
+    }
+    if (!taskColumns.some((column) => column.name === "worktree_path")) {
+      this.database.exec("ALTER TABLE tasks ADD COLUMN worktree_path TEXT");
+    }
+    if (!taskColumns.some((column) => column.name === "worktree_branch")) {
+      this.database.exec("ALTER TABLE tasks ADD COLUMN worktree_branch TEXT");
+    }
+    if (!taskColumns.some((column) => column.name === "due_date")) {
+      this.database.exec("ALTER TABLE tasks ADD COLUMN due_date TEXT");
+    }
+    if (!taskColumns.some((column) => column.name === "recurrence_interval")) {
+      this.database.exec("ALTER TABLE tasks ADD COLUMN recurrence_interval INTEGER");
+    }
+    if (!taskColumns.some((column) => column.name === "recurrence_unit")) {
+      this.database.exec("ALTER TABLE tasks ADD COLUMN recurrence_unit TEXT");
+    }
+    this.#migrateTaskStatuses();
+    const migratedTaskColumns = this.database.prepare("PRAGMA table_info(tasks)").all();
+    if (!migratedTaskColumns.some((column) => column.name === "creator_type")) {
+      this.database.exec("ALTER TABLE tasks ADD COLUMN creator_type TEXT NOT NULL DEFAULT 'user'");
+    }
+    if (!migratedTaskColumns.some((column) => column.name === "creator_id")) {
+      this.database.exec("ALTER TABLE tasks ADD COLUMN creator_id TEXT NOT NULL DEFAULT 'local-user'");
+    }
+    if (!migratedTaskColumns.some((column) => column.name === "creator_name")) {
+      this.database.exec("ALTER TABLE tasks ADD COLUMN creator_name TEXT NOT NULL DEFAULT '本地用户'");
+    }
+    if (!migratedTaskColumns.some((column) => column.name === "creator_avatar_url")) {
+      this.database.exec("ALTER TABLE tasks ADD COLUMN creator_avatar_url TEXT");
+    }
+    if (!migratedTaskColumns.some((column) => column.name === "workflow_id")) {
+      this.database.exec("ALTER TABLE tasks ADD COLUMN workflow_id TEXT");
+    }
+    this.database.exec(`
+      UPDATE tasks
+      SET creator_type = 'agent', creator_id = 'codex-agent', creator_name = 'Codex Agent'
+      WHERE thread_id IS NOT NULL AND version = 1 AND creator_id = 'local-user'
+    `);
+    const identityTaskColumns = this.database.prepare("PRAGMA table_info(tasks)").all();
+    const assigneeMigrations = [
+      ["assignee_type", "TEXT CHECK (assignee_type IN ('user', 'agent'))", "creator_type"],
+      ["assignee_id", "TEXT", "creator_id"],
+      ["assignee_name", "TEXT", "creator_name"],
+      ["assignee_avatar_url", "TEXT", "creator_avatar_url"],
+    ].filter(([column]) => !identityTaskColumns.some((current) => current.name === column));
+    if (assigneeMigrations.length > 0) {
+      this.database.exec("BEGIN IMMEDIATE");
+      try {
+        for (const [column, definition, source] of assigneeMigrations) {
+          this.database.exec(`ALTER TABLE tasks ADD COLUMN ${column} ${definition}`);
+          this.database.exec(`UPDATE tasks SET ${column} = ${source}`);
+        }
+        this.database.exec("COMMIT");
+      } catch (error) {
+        this.database.exec("ROLLBACK");
+        throw error;
+      }
+    }
+    this.database.exec(`
+      CREATE INDEX IF NOT EXISTS tasks_project_status_sort
+        ON tasks(project_id, archived_at, status, sort_order, created_at)
+    `);
+    this.database.exec(`
+      CREATE TABLE IF NOT EXISTS task_relations (
+        relation_type TEXT NOT NULL CHECK (relation_type IN ('parent', 'blocks', 'related')),
+        source_task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE,
+        target_task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE,
+        created_at TEXT NOT NULL,
+        CHECK (source_task_id <> target_task_id),
+        CHECK (relation_type <> 'related' OR source_task_id < target_task_id),
+        PRIMARY KEY (relation_type, source_task_id, target_task_id)
+      );
+
+      CREATE INDEX IF NOT EXISTS task_relations_target
+        ON task_relations(relation_type, target_task_id);
+
+      CREATE UNIQUE INDEX IF NOT EXISTS task_relations_one_parent
+        ON task_relations(target_task_id)
+        WHERE relation_type = 'parent';
+    `);
+
+    const commentColumns = this.database.prepare("PRAGMA table_info(comments)").all();
+    if (!commentColumns.some((column) => column.name === "thread_id")) {
+      this.database.exec("ALTER TABLE comments ADD COLUMN thread_id TEXT");
+    }
+    if (!commentColumns.some((column) => column.name === "author_type")) {
+      this.database.exec("ALTER TABLE comments ADD COLUMN author_type TEXT NOT NULL DEFAULT 'user'");
+    }
+    if (!commentColumns.some((column) => column.name === "author_avatar_url")) {
+      this.database.exec("ALTER TABLE comments ADD COLUMN author_avatar_url TEXT");
+    }
+    this.database.exec(`
+      UPDATE comments
+      SET author_type = 'agent', author_id = 'codex-agent', author_name = 'Codex Agent'
+      WHERE thread_id IS NOT NULL AND author_id = 'local'
+    `);
+    this.database.exec(`
+      UPDATE comments
+      SET author_id = 'local-user'
+      WHERE author_id = 'local'
+    `);
+
+    const hasTaskThreads = this.database.prepare(`
+      SELECT 1 FROM sqlite_schema WHERE type = 'table' AND name = 'task_threads'
+    `).get();
+    if (hasTaskThreads) {
+      this.database.exec(`
+        UPDATE tasks
+        SET thread_id = COALESCE(thread_id, (
+          SELECT task_threads.thread_id
+          FROM task_threads
+          LEFT JOIN comments
+            ON comments.task_id = task_threads.task_id
+            AND comments.thread_id = task_threads.thread_id
+          WHERE task_threads.task_id = tasks.id
+          GROUP BY task_threads.task_id, task_threads.thread_id, task_threads.created_at
+          ORDER BY
+            CASE WHEN COUNT(comments.id) > 0 THEN 1 ELSE 0 END,
+            task_threads.created_at DESC,
+            task_threads.thread_id DESC
+          LIMIT 1
+        ))
+        WHERE thread_id IS NULL
+      `);
+      this.database.exec("DROP TABLE task_threads");
+    }
+
+    const attachmentColumns = this.database.prepare("PRAGMA table_info(attachments)").all();
+    if (!attachmentColumns.some((column) => column.name === "comment_id")) {
+      this.database.exec("ALTER TABLE attachments ADD COLUMN comment_id TEXT REFERENCES comments(id) ON DELETE CASCADE");
+    }
+    this.database.exec("CREATE INDEX IF NOT EXISTS attachments_comment_created ON attachments(comment_id, created_at, id)");
+
+    const timestamp = now();
+    this.database.prepare(`
+      INSERT INTO projects (id, name, workspace_path, next_task_number, created_at, updated_at)
+      VALUES (?, ?, NULL, 1, ?, ?)
+      ON CONFLICT(id) DO NOTHING
+    `).run(DEFAULT_PROJECT_ID, DEFAULT_PROJECT_NAME, timestamp, timestamp);
+    this.database.prepare(`
+      UPDATE projects
+      SET name = ?, updated_at = ?
+      WHERE id = ? AND name IN ('Local', '无项目议题')
+    `).run(DEFAULT_PROJECT_NAME, timestamp, DEFAULT_PROJECT_ID);
+  }
+
+  close() {
+    this.database.close();
+  }
+
+  #migrateTaskStatuses() {
+    const tasksSql = this.database.prepare(`
+      SELECT sql FROM sqlite_schema WHERE type = 'table' AND name = 'tasks'
+    `).get()?.sql ?? "";
+    if (
+      tasksSql.includes("'in_review'")
+      && tasksSql.includes("'blocked'")
+      && tasksSql.includes("'canceled'")
+    ) {
+      return;
+    }
+
+    this.database.exec("PRAGMA foreign_keys = OFF; BEGIN IMMEDIATE");
+    try {
+      this.database.exec(`
+        CREATE TABLE tasks_status_migration (
+          id TEXT PRIMARY KEY,
+          identifier TEXT NOT NULL UNIQUE,
+          project_id TEXT NOT NULL REFERENCES projects(id),
+          title TEXT NOT NULL,
+          description TEXT NOT NULL DEFAULT '',
+          status TEXT NOT NULL CHECK (status IN (
+            'backlog', 'todo', 'in_progress', 'in_review', 'blocked', 'done', 'canceled'
+          )),
+          priority TEXT NOT NULL CHECK (priority IN ('none', 'urgent', 'high', 'medium', 'low')),
+          labels TEXT NOT NULL DEFAULT '[]',
+          sort_order REAL NOT NULL,
+          thread_id TEXT,
+          git_branch TEXT,
+          worktree_path TEXT,
+          worktree_branch TEXT,
+          due_date TEXT,
+          recurrence_interval INTEGER,
+          recurrence_unit TEXT,
+          archived_at TEXT,
+          version INTEGER NOT NULL DEFAULT 1 CHECK (version > 0),
+          created_at TEXT NOT NULL,
+          updated_at TEXT NOT NULL
+        );
+
+        INSERT INTO tasks_status_migration (
+          id, identifier, project_id, title, description, status, priority, labels,
+          sort_order, thread_id, git_branch, worktree_path, worktree_branch,
+          due_date, recurrence_interval, recurrence_unit,
+          archived_at, version, created_at, updated_at
+        )
+        SELECT
+          id, identifier, project_id, title, description, status, priority, labels,
+          sort_order, thread_id, git_branch, worktree_path, worktree_branch,
+          due_date, recurrence_interval, recurrence_unit,
+          archived_at, version, created_at, updated_at
+        FROM tasks;
+
+        DROP TABLE tasks;
+        ALTER TABLE tasks_status_migration RENAME TO tasks;
+      `);
+      this.database.exec("COMMIT");
+    } catch (error) {
+      this.database.exec("ROLLBACK");
+      throw error;
+    } finally {
+      this.database.exec("PRAGMA foreign_keys = ON");
+    }
+
+    const violation = this.database.prepare("PRAGMA foreign_key_check").get();
+    if (violation) {
+      throw new Error(`Task status migration produced a foreign key violation in '${violation.table}'`);
+    }
+  }
+
+  listProjects() {
+    return this.database.prepare(`
+      SELECT
+        projects.id,
+        projects.name,
+        projects.workspace_path,
+        projects.archived_at,
+        projects.created_at,
+        projects.updated_at,
+        COUNT(tasks.id) AS issue_count
+      FROM projects
+      LEFT JOIN tasks
+        ON tasks.project_id = projects.id
+        AND tasks.archived_at IS NULL
+      WHERE projects.archived_at IS NULL
+      GROUP BY
+        projects.id,
+        projects.name,
+        projects.workspace_path,
+        projects.archived_at,
+        projects.created_at,
+        projects.updated_at
+      ORDER BY projects.created_at, projects.id
+    `).all().map(projectFromRow);
+  }
+
+  createProject(input) {
+    const timestamp = now();
+    try {
+      this.database.prepare(`
+        INSERT INTO projects (id, name, workspace_path, next_task_number, created_at, updated_at)
+        VALUES (?, ?, ?, 1, ?, ?)
+      `).run(input.id, input.name, input.workspacePath, timestamp, timestamp);
+    } catch (error) {
+      if (String(error.message).includes("UNIQUE constraint failed")) {
+        throw new ApiError(409, "PROJECT_EXISTS", `Project '${input.id}' already exists`);
+      }
+      throw error;
+    }
+    return this.getProject(input.id);
+  }
+
+  mapProjectWorkspace(id, workspacePath) {
+    const current = this.getProject(id);
+    if (!current) throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${id}' does not exist`);
+
+    const timestamp = now();
+    const result = this.database.prepare(`
+      UPDATE projects
+      SET workspace_path = ?, updated_at = ?
+      WHERE id = ? AND archived_at IS NULL
+    `).run(workspacePath, timestamp, id);
+    if (result.changes !== 1) {
+      throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${id}' does not exist`);
+    }
+    return this.getProject(id);
+  }
+
+  getProject(id) {
+    const row = this.database.prepare(`
+      SELECT
+        projects.id,
+        projects.name,
+        projects.workspace_path,
+        projects.archived_at,
+        projects.created_at,
+        projects.updated_at,
+        COUNT(tasks.id) AS issue_count
+      FROM projects
+      LEFT JOIN tasks
+        ON tasks.project_id = projects.id
+        AND tasks.archived_at IS NULL
+      WHERE projects.id = ? AND projects.archived_at IS NULL
+      GROUP BY
+        projects.id,
+        projects.name,
+        projects.workspace_path,
+        projects.archived_at,
+        projects.created_at,
+        projects.updated_at
+    `).get(id);
+    return row ? projectFromRow(row) : null;
+  }
+
+  archiveProject(id) {
+    if (id === DEFAULT_PROJECT_ID) {
+      throw new ApiError(409, "DEFAULT_PROJECT_PROTECTED", "The default project cannot be archived or deleted");
+    }
+    const current = this.getProject(id);
+    if (!current) throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${id}' does not exist`);
+
+    const timestamp = now();
+    const result = this.database.prepare(`
+      UPDATE projects
+      SET archived_at = ?, updated_at = ?
+      WHERE id = ? AND archived_at IS NULL
+    `).run(timestamp, timestamp, id);
+    if (result.changes !== 1) {
+      throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${id}' does not exist`);
+    }
+    return { ...current, archivedAt: timestamp, updatedAt: timestamp };
+  }
+
+  deleteProject(id) {
+    if (id === DEFAULT_PROJECT_ID) {
+      throw new ApiError(409, "DEFAULT_PROJECT_PROTECTED", "The default project cannot be archived or deleted");
+    }
+    const project = this.getProject(id);
+    if (!project) throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${id}' does not exist`);
+
+    let attachments = [];
+    this.database.exec("BEGIN IMMEDIATE");
+    try {
+      attachments = this.database.prepare(`
+        SELECT attachments.*
+        FROM attachments
+        JOIN tasks ON tasks.id = attachments.task_id
+        WHERE tasks.project_id = ?
+      `).all(id).map(attachmentFromRow);
+      this.database.prepare("DELETE FROM tasks WHERE project_id = ?").run(id);
+      const result = this.database.prepare("DELETE FROM projects WHERE id = ?").run(id);
+      if (result.changes !== 1) {
+        throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${id}' does not exist`);
+      }
+      this.database.exec("COMMIT");
+    } catch (error) {
+      this.database.exec("ROLLBACK");
+      throw error;
+    }
+    return { project, attachments };
+  }
+
+  getWorkflowWorkspace(projectId) {
+    if (!this.database.prepare("SELECT 1 FROM projects WHERE id = ? AND archived_at IS NULL").get(projectId)) {
+      throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${projectId}' does not exist`);
+    }
+    const row = this.database.prepare(`
+      SELECT project_id, workspace, version, updated_at
+      FROM workflow_workspaces
+      WHERE project_id = ?
+    `).get(projectId);
+    return row
+      ? workflowWorkspaceFromRow(row)
+      : { projectId, workspace: null, version: 0, updatedAt: null };
+  }
+
+  saveWorkflowWorkspace(projectId, expectedVersion, workspace) {
+    const timestamp = now();
+    this.database.exec("BEGIN IMMEDIATE");
+    try {
+      if (!this.database.prepare("SELECT 1 FROM projects WHERE id = ? AND archived_at IS NULL").get(projectId)) {
+        throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${projectId}' does not exist`);
+      }
+      const current = this.database.prepare(`
+        SELECT version FROM workflow_workspaces WHERE project_id = ?
+      `).get(projectId);
+      const actualVersion = current?.version ?? 0;
+      if (actualVersion !== expectedVersion) {
+        throw new ApiError(409, "VERSION_CONFLICT", "Workflow was changed by another client", {
+          expectedVersion,
+          actualVersion,
+        });
+      }
+      if (current) {
+        this.database.prepare(`
+          UPDATE workflow_workspaces
+          SET workspace = ?, version = version + 1, updated_at = ?
+          WHERE project_id = ? AND version = ?
+        `).run(JSON.stringify(workspace), timestamp, projectId, expectedVersion);
+      } else {
+        this.database.prepare(`
+          INSERT INTO workflow_workspaces (project_id, workspace, version, updated_at)
+          VALUES (?, ?, 1, ?)
+        `).run(projectId, JSON.stringify(workspace), timestamp);
+      }
+      this.database.exec("COMMIT");
+    } catch (error) {
+      this.database.exec("ROLLBACK");
+      throw error;
+    }
+    return this.getWorkflowWorkspace(projectId);
+  }
+
+  listAiChatThreads() {
+    return this.database.prepare(`
+      SELECT * FROM ai_chat_threads
+      ORDER BY updated_at DESC, id
+    `).all().map((row) => this.#aiChatThreadWithCurrentRun(row));
+  }
+
+  getAiChatThread(id) {
+    const row = this.database.prepare("SELECT * FROM ai_chat_threads WHERE id = ?").get(id);
+    return row ? this.#aiChatThreadWithCurrentRun(row) : null;
+  }
+
+  createAiChatThread(input) {
+    const id = input.id ?? randomUUID();
+    const timestamp = input.createdAt ?? now();
+    this.database.prepare(`
+      INSERT INTO ai_chat_threads (
+        id, title, status,
+        origin_project_id, origin_project_name, origin_workspace_path,
+        origin_issue_id, origin_issue_identifier,
+        codex_thread_id, model, reasoning_effort, sandbox,
+        created_at, updated_at
+      ) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)
+    `).run(
+      id,
+      input.title,
+      input.status ?? "idle",
+      input.origin.projectId,
+      input.origin.projectName,
+      input.origin.workspacePath,
+      input.origin.issueId ?? null,
+      input.origin.issueIdentifier ?? null,
+      input.codexThreadId ?? null,
+      input.model,
+      input.reasoningEffort,
+      input.sandbox,
+      timestamp,
+      input.updatedAt ?? timestamp,
+    );
+    return this.getAiChatThread(id);
+  }
+
+  updateAiChatThread(id, changes) {
+    const current = this.getAiChatThread(id);
+    if (!current) {
+      throw new ApiError(404, "AI_CHAT_THREAD_NOT_FOUND", `AI chat thread '${id}' does not exist`);
+    }
+    const columns = {
+      title: "title",
+      status: "status",
+      codexThreadId: "codex_thread_id",
+      model: "model",
+      reasoningEffort: "reasoning_effort",
+      sandbox: "sandbox",
+    };
+    const assignments = [];
+    const values = [];
+    for (const [key, column] of Object.entries(columns)) {
+      if (!Object.hasOwn(changes, key)) continue;
+      assignments.push(`${column} = ?`);
+      values.push(changes[key]);
+    }
+    if (assignments.length === 0) return current;
+    assignments.push("updated_at = ?");
+    values.push(changes.updatedAt ?? now(), id);
+    this.database.prepare(`
+      UPDATE ai_chat_threads SET ${assignments.join(", ")} WHERE id = ?
+    `).run(...values);
+    return this.getAiChatThread(id);
+  }
+
+  deleteAiChatThread(id) {
+    const current = this.getAiChatThread(id);
+    if (!current) {
+      throw new ApiError(404, "AI_CHAT_THREAD_NOT_FOUND", `AI chat thread '${id}' does not exist`);
+    }
+    this.database.prepare("DELETE FROM ai_chat_threads WHERE id = ?").run(id);
+    return current;
+  }
+
+  listAiChatRuns(threadId) {
+    return this.database.prepare(`
+      SELECT * FROM ai_chat_runs
+      WHERE thread_id = ?
+      ORDER BY started_at, id
+    `).all(threadId).map(aiChatRunFromRow);
+  }
+
+  getAiChatRun(id) {
+    const row = this.database.prepare("SELECT * FROM ai_chat_runs WHERE id = ?").get(id);
+    return row ? aiChatRunFromRow(row) : null;
+  }
+
+  createAiChatRun(input) {
+    const id = input.id ?? randomUUID();
+    const timestamp = input.startedAt ?? now();
+    this.database.exec("BEGIN IMMEDIATE");
+    try {
+      this.database.prepare(`
+        INSERT INTO ai_chat_runs (
+          id, thread_id, status, exit_code, error, started_at, finished_at
+        ) VALUES (?, ?, ?, ?, ?, ?, ?)
+      `).run(
+        id,
+        input.threadId,
+        input.status ?? "running",
+        input.exitCode ?? null,
+        input.error ?? null,
+        timestamp,
+        input.finishedAt ?? null,
+      );
+      if ((input.status ?? "running") === "running") {
+        this.database.prepare(`
+          UPDATE ai_chat_threads
+          SET status = 'running', updated_at = ?
+          WHERE id = ?
+        `).run(timestamp, input.threadId);
+      }
+      this.database.exec("COMMIT");
+    } catch (error) {
+      this.database.exec("ROLLBACK");
+      throw error;
+    }
+    return this.getAiChatRun(id);
+  }
+
+  updateAiChatRun(id, changes) {
+    const current = this.getAiChatRun(id);
+    if (!current) {
+      throw new ApiError(404, "AI_CHAT_RUN_NOT_FOUND", `AI chat run '${id}' does not exist`);
+    }
+    const columns = {
+      status: "status",
+      exitCode: "exit_code",
+      error: "error",
+      finishedAt: "finished_at",
+    };
+    const assignments = [];
+    const values = [];
+    for (const [key, column] of Object.entries(columns)) {
+      if (!Object.hasOwn(changes, key)) continue;
+      assignments.push(`${column} = ?`);
+      values.push(changes[key]);
+    }
+    if (assignments.length === 0) return current;
+
+    this.database.exec("BEGIN IMMEDIATE");
+    try {
+      values.push(id);
+      this.database.prepare(`
+        UPDATE ai_chat_runs SET ${assignments.join(", ")} WHERE id = ?
+      `).run(...values);
+      const status = changes.status ?? current.status;
+      if (status !== "running") {
+        const threadStatus = status === "failed" ? "failed" : "idle";
+        this.database.prepare(`
+          UPDATE ai_chat_threads
+          SET status = ?, updated_at = ?
+          WHERE id = ?
+            AND NOT EXISTS (
+              SELECT 1 FROM ai_chat_runs
+              WHERE thread_id = ? AND status = 'running'
+            )
+        `).run(threadStatus, changes.finishedAt ?? now(), current.threadId, current.threadId);
+      }
+      this.database.exec("COMMIT");
+    } catch (error) {
+      this.database.exec("ROLLBACK");
+      throw error;
+    }
+    return this.getAiChatRun(id);
+  }
+
+  insertAiChatEvent(input) {
+    const id = input.id ?? randomUUID();
+    const timestamp = input.createdAt ?? now();
+    this.database.prepare(`
+      INSERT INTO ai_chat_events (
+        id, thread_id, run_id, type, role, content, data, created_at
+      ) VALUES (?, ?, ?, ?, ?, ?, ?, ?)
+    `).run(
+      id,
+      input.threadId,
+      input.runId ?? null,
+      input.type,
+      input.role,
+      input.content,
+      input.data === undefined || input.data === null ? null : JSON.stringify(input.data),
+      timestamp,
+    );
+    const row = this.database.prepare("SELECT * FROM ai_chat_events WHERE id = ?").get(id);
+    return aiChatEventFromRow(row);
+  }
+
+  listAiChatEvents(threadId) {
+    return this.database.prepare(`
+      SELECT * FROM ai_chat_events
+      WHERE thread_id = ?
+      ORDER BY created_at, rowid
+    `).all(threadId).map(aiChatEventFromRow);
+  }
+
+  interruptAbandonedAiChatRuns() {
+    const timestamp = now();
+    this.database.exec("BEGIN IMMEDIATE");
+    try {
+      const result = this.database.prepare(`
+        UPDATE ai_chat_runs
+        SET
+          status = 'interrupted',
+          error = COALESCE(error, 'Taskboard service restarted'),
+          finished_at = COALESCE(finished_at, ?)
+        WHERE status = 'running'
+      `).run(timestamp);
+      if (result.changes > 0) {
+        this.database.prepare(`
+          UPDATE ai_chat_threads
+          SET status = 'idle', updated_at = ?
+          WHERE status = 'running'
+            AND NOT EXISTS (
+              SELECT 1 FROM ai_chat_runs
+              WHERE ai_chat_runs.thread_id = ai_chat_threads.id
+                AND ai_chat_runs.status = 'running'
+            )
+        `).run(timestamp);
+      }
+      this.database.exec("COMMIT");
+      return Number(result.changes);
+    } catch (error) {
+      this.database.exec("ROLLBACK");
+      throw error;
+    }
+  }
+
+  listTasks(filters) {
+    const where = [];
+    const values = [];
+    if (filters.projectId) {
+      where.push("project_id = ?");
+      values.push(filters.projectId);
+    }
+    if (filters.status) {
+      where.push("status = ?");
+      values.push(filters.status);
+    }
+    if (filters.archived === "false") {
+      where.push("archived_at IS NULL");
+    } else if (filters.archived === "true") {
+      where.push("archived_at IS NOT NULL");
+    }
+
+    const sql = `
+      SELECT * FROM tasks
+      ${where.length > 0 ? `WHERE ${where.join(" AND ")}` : ""}
+      ORDER BY
+        CASE status
+          WHEN 'backlog' THEN 1
+          WHEN 'todo' THEN 2
+          WHEN 'in_progress' THEN 3
+          WHEN 'in_review' THEN 4
+          WHEN 'blocked' THEN 5
+          WHEN 'done' THEN 6
+          WHEN 'canceled' THEN 7
+        END,
+        sort_order,
+        created_at,
+        id
+    `;
+    return this.database.prepare(sql).all(...values).map((row) => this.#taskWithRelations(row));
+  }
+
+  getTask(id) {
+    const row = this.database.prepare("SELECT * FROM tasks WHERE id = ? OR identifier = ?").get(id, id);
+    return row ? this.#taskWithRelations(row) : null;
+  }
+
+  createTask(input) {
+    this.database.exec("BEGIN IMMEDIATE");
+    try {
+      const project = this.database.prepare(`
+        SELECT id, next_task_number FROM projects WHERE id = ? AND archived_at IS NULL
+      `).get(input.projectId);
+      if (!project) {
+        throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${input.projectId}' does not exist`);
+      }
+
+      const number = project.next_task_number;
+      const identifier = `${projectPrefix(project.id)}-${number}`;
+      const id = randomUUID();
+      const timestamp = now();
+      let sortOrder = input.sortOrder;
+      if (sortOrder === undefined) {
+        const row = this.database.prepare(`
+          SELECT COALESCE(MAX(sort_order), 0) AS maximum
+          FROM tasks
+          WHERE project_id = ? AND status = ? AND archived_at IS NULL
+        `).get(input.projectId, input.status);
+        sortOrder = row.maximum + 1000;
+      }
+
+      this.database.prepare(`
+        UPDATE projects SET next_task_number = next_task_number + 1, updated_at = ? WHERE id = ? AND archived_at IS NULL
+      `).run(timestamp, input.projectId);
+      this.database.prepare(`
+        INSERT INTO tasks (
+          id, identifier, project_id, title, description, status, priority, labels,
+          sort_order, thread_id, creator_type, creator_id, creator_name, creator_avatar_url,
+          assignee_type, assignee_id, assignee_name, assignee_avatar_url,
+          workflow_id, git_branch, worktree_path, worktree_branch,
+          due_date, recurrence_interval, recurrence_unit,
+          archived_at, version, created_at, updated_at
+        ) VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, NULL, 1, ?, ?)
+      `).run(
+        id,
+        identifier,
+        input.projectId,
+        input.title,
+        input.description,
+        input.status,
+        input.priority,
+        JSON.stringify(input.labels),
+        sortOrder,
+        input.threadId ?? null,
+        input.actor.type,
+        input.actor.id,
+        input.actor.name,
+        input.actor.avatarUrl,
+        input.assignee.type,
+        input.assignee.id,
+        input.assignee.name,
+        input.assignee.avatarUrl,
+        input.workflowId,
+        input.developmentContext?.type === "branch" ? input.developmentContext.branch : null,
+        input.developmentContext?.type === "worktree" ? input.developmentContext.path : null,
+        input.developmentContext?.type === "worktree" ? input.developmentContext.branch : null,
+        input.dueDate,
+        input.recurrence?.interval ?? null,
+        input.recurrence?.unit ?? null,
+        timestamp,
+        timestamp,
+      );
+      this.database.exec("COMMIT");
+      return this.getTask(id);
+    } catch (error) {
+      this.database.exec("ROLLBACK");
+      throw error;
+    }
+  }
+
+  updateTask(id, version, changes, threadId) {
+    const current = this.#requireTask(id);
+    this.#requireVersion(current, version);
+    const dueDate = Object.hasOwn(changes, "dueDate") ? changes.dueDate : current.dueDate;
+    const recurrence = Object.hasOwn(changes, "recurrence") ? changes.recurrence : current.recurrence;
+    if (recurrence && !dueDate) {
+      throw new ApiError(400, "INVALID_FIELD", "A recurring issue requires a due date");
+    }
+
+    const columns = {
+      title: "title",
+      description: "description",
+      status: "status",
+      priority: "priority",
+      labels: "labels",
+      workflowId: "workflow_id",
+      dueDate: "due_date",
+    };
+    const assignments = [];
+    const values = [];
+    for (const [key, value] of Object.entries(changes)) {
+      if (key === "developmentContext") {
+        assignments.push("git_branch = ?", "worktree_path = ?", "worktree_branch = ?");
+        values.push(
+          value?.type === "branch" ? value.branch : null,
+          value?.type === "worktree" ? value.path : null,
+          value?.type === "worktree" ? value.branch : null,
+        );
+        continue;
+      }
+      if (key === "recurrence") {
+        assignments.push("recurrence_interval = ?", "recurrence_unit = ?");
+        values.push(value?.interval ?? null, value?.unit ?? null);
+        continue;
+      }
+      if (key === "assignee") {
+        assignments.push(
+          "assignee_type = ?",
+          "assignee_id = ?",
+          "assignee_name = ?",
+          "assignee_avatar_url = ?",
+        );
+        values.push(value.type, value.id, value.name, value.avatarUrl);
+        continue;
+      }
+      assignments.push(`${columns[key]} = ?`);
+      values.push(key === "labels" ? JSON.stringify(value) : value);
+    }
+    if (threadId !== undefined) {
+      assignments.push("thread_id = ?");
+      values.push(threadId);
+    }
+    assignments.push("version = version + 1", "updated_at = ?");
+    const timestamp = now();
+    values.push(timestamp, current.id, version);
+
+    this.database.exec("BEGIN IMMEDIATE");
+    try {
+      const result = this.database.prepare(`
+        UPDATE tasks SET ${assignments.join(", ")} WHERE id = ? AND version = ?
+      `).run(...values);
+      if (result.changes !== 1) {
+        this.#throwMissingOrConflict(id, version);
+      }
+      this.database.exec("COMMIT");
+    } catch (error) {
+      this.database.exec("ROLLBACK");
+      throw error;
+    }
+    return this.getTask(current.id);
+  }
+
+  moveTask(id, version, status, sortOrder, threadId, projectId) {
+    const current = this.#requireTask(id);
+    this.#requireVersion(current, version);
+    if (current.archivedAt !== null) {
+      throw new ApiError(409, "TASK_ARCHIVED", "Archived tasks cannot be moved");
+    }
+    const sourceProjectId = current.projectId;
+    const targetProjectId = projectId ?? sourceProjectId;
+    if (!this.database.prepare("SELECT 1 FROM projects WHERE id = ? AND archived_at IS NULL").get(targetProjectId)) {
+      throw new ApiError(404, "PROJECT_NOT_FOUND", `Project '${targetProjectId}' does not exist`);
+    }
+    if (sortOrder === undefined) {
+      const row = this.database.prepare(`
+        SELECT COALESCE(MAX(sort_order), 0) AS maximum
+        FROM tasks
+        WHERE project_id = ? AND status = ? AND archived_at IS NULL AND id != ?
+      `).get(targetProjectId, status, current.id);
+      sortOrder = row.maximum + 1000;
+    }
+
+    const timestamp = now();
+    this.database.exec("BEGIN IMMEDIATE");
+    try {
+      const result = this.database.prepare(`
+        UPDATE tasks
+        SET project_id = ?, status = ?, sort_order = ?, thread_id = COALESCE(?, thread_id),
+            version = version + 1, updated_at = ?
+        WHERE id = ? AND version = ?
+      `).run(targetProjectId, status, sortOrder, threadId ?? null, timestamp, current.id, version);
+      if (result.changes !== 1) {
+        this.#throwMissingOrConflict(id, version);
+      }
+      this.database.prepare("UPDATE projects SET updated_at = ? WHERE id = ?").run(timestamp, sourceProjectId);
+      if (targetProjectId !== sourceProjectId) {
+        this.database.prepare("UPDATE projects SET updated_at = ? WHERE id = ?").run(timestamp, targetProjectId);
+      }
+      this.database.exec("COMMIT");
+    } catch (error) {
+      this.database.exec("ROLLBACK");
+      throw error;
+    }
+    return this.getTask(current.id);
+  }
+
+  archiveTask(id, version, threadId) {
+    const current = this.#requireTask(id);
+    this.#requireVersion(current, version);
+    const timestamp = now();
+    this.database.exec("BEGIN IMMEDIATE");
+    try {
+      const result = this.database.prepare(`
+        UPDATE tasks
+        SET archived_at = ?, thread_id = COALESCE(?, thread_id), version = version + 1, updated_at = ?
+        WHERE id = ? AND version = ?
+      `).run(timestamp, threadId ?? null, timestamp, current.id, version);
+      if (result.changes !== 1) {
+        this.#throwMissingOrConflict(id, version);
+      }
+      this.database.exec("COMMIT");
+    } catch (error) {
+      this.database.exec("ROLLBACK");
+      throw error;
+    }
+    return this.getTask(current.id);
+  }
+
+  deleteTask(id, version) {
+    const current = this.#requireTask(id);
+    this.#requireVersion(current, version);
+    let attachments = [];
+    this.database.exec("BEGIN IMMEDIATE");
+    try {
+      attachments = this.database.prepare(`
+        SELECT * FROM attachments
+        WHERE task_id = ?
+      `).all(current.id).map(attachmentFromRow);
+      const result = this.database.prepare(`
+        DELETE FROM tasks
+        WHERE id = ? AND version = ?
+      `).run(current.id, version);
+      if (result.changes !== 1) {
+        this.#throwMissingOrConflict(id, version);
+      }
+      this.database.exec("COMMIT");
+    } catch (error) {
+      this.database.exec("ROLLBACK");
+      throw error;
+    }
+    return { task: current, attachments };
+  }
+
+  restoreTask(id, version, threadId) {
+    const current = this.#requireTask(id);
+    this.#requireVersion(current, version);
+    if (current.archivedAt === null) {
+      throw new ApiError(409, "TASK_NOT_ARCHIVED", "Only archived tasks can be restored");
+    }
+    const timestamp = now();
+    this.database.exec("BEGIN IMMEDIATE");
+    try {
+      const result = this.database.prepare(`
+        UPDATE tasks
+        SET archived_at = NULL, thread_id = COALESCE(?, thread_id), version = version + 1, updated_at = ?
+        WHERE id = ? AND version = ?
+      `).run(threadId ?? null, timestamp, current.id, version);
+      if (result.changes !== 1) {
+        this.#throwMissingOrConflict(id, version);
+      }
+      this.database.exec("COMMIT");
+    } catch (error) {
+      this.database.exec("ROLLBACK");
+      throw error;
+    }
+    return this.getTask(current.id);
+  }
+
+  addTaskRelation(id, version, type, relatedId, threadId) {
+    this.database.exec("BEGIN IMMEDIATE");
+    try {
+      const task = this.#requireTask(id);
+      const relatedTask = this.#requireTask(relatedId);
+      this.#requireVersion(task, version);
+      this.#validateRelationTasks(task, relatedTask);
+
+      const { relationType, sourceTaskId, targetTaskId } = this.#relationEndpoints(
+        type,
+        task.id,
+        relatedTask.id,
+      );
+      if (relationType === "parent") {
+        this.#assertNoParentCycle(task.id, relatedTask.id);
+        const existing = this.database.prepare(`
+          SELECT source_task_id
+          FROM task_relations
+          WHERE relation_type = 'parent' AND target_task_id = ?
+        `).get(task.id);
+        if (existing?.source_task_id === relatedTask.id) {
+          throw new ApiError(409, "RELATION_EXISTS", "This parent relation already exists");
+        }
+        if (existing) {
+          this.database.prepare(`
+            DELETE FROM task_relations
+            WHERE relation_type = 'parent' AND target_task_id = ?
+          `).run(task.id);
+        }
+      } else {
+        const existing = this.database.prepare(`
+          SELECT 1
+          FROM task_relations
+          WHERE relation_type = ? AND source_task_id = ? AND target_task_id = ?
+        `).get(relationType, sourceTaskId, targetTaskId);
+        if (existing) {
+          throw new ApiError(409, "RELATION_EXISTS", "This issue relation already exists");
+        }
+      }
+
+      this.database.prepare(`
+        INSERT INTO task_relations (
+          relation_type, source_task_id, target_task_id, created_at
+        ) VALUES (?, ?, ?, ?)
+      `).run(relationType, sourceTaskId, targetTaskId, now());
+      this.#touchTask(task.id, version, threadId);
+      this.database.exec("COMMIT");
+      return {
+        task: this.getTask(task.id),
+        relatedTask: this.getTask(relatedTask.id),
+      };
+    } catch (error) {
+      this.database.exec("ROLLBACK");
+      throw error;
+    }
+  }
+
+  removeTaskRelation(id, version, type, relatedId, threadId) {
+    this.database.exec("BEGIN IMMEDIATE");
+    try {
+      const task = this.#requireTask(id);
+      const relatedTask = this.#requireTask(relatedId);
+      this.#requireVersion(task, version);
+      this.#validateRelationTasks(task, relatedTask);
+      const { relationType, sourceTaskId, targetTaskId } = this.#relationEndpoints(
+        type,
+        task.id,
+        relatedTask.id,
+      );
+      const removed = this.database.prepare(`
+        DELETE FROM task_relations
+        WHERE relation_type = ? AND source_task_id = ? AND target_task_id = ?
+      `).run(relationType, sourceTaskId, targetTaskId);
+      if (removed.changes !== 1) {
+        throw new ApiError(404, "RELATION_NOT_FOUND", "This issue relation does not exist");
+      }
+      this.#touchTask(task.id, version, threadId);
+      this.database.exec("COMMIT");
+      return {
+        task: this.getTask(task.id),
+        relatedTask: this.getTask(relatedTask.id),
+      };
+    } catch (error) {
+      this.database.exec("ROLLBACK");
+      throw error;
+    }
+  }
+
+  listComments(taskId) {
+    const task = this.#requireTask(taskId);
+    return this.database.prepare(`
+      SELECT * FROM comments
+      WHERE task_id = ?
+      ORDER BY created_at, id
+    `).all(task.id).map((row) => this.#commentWithAttachments(row));
+  }
+
+  createComment(taskId, input) {
+    const task = this.#requireTask(taskId);
+    const id = randomUUID();
+    const timestamp = now();
+    this.database.prepare(`
+      INSERT INTO comments (
+        id, task_id, body, thread_id, author_type, author_id, author_name, author_avatar_url,
+        version, created_at, updated_at
+      ) VALUES (?, ?, ?, ?, ?, ?, ?, ?, 1, ?, ?)
+    `).run(
+      id,
+      task.id,
+      input.body,
+      input.threadId ?? null,
+      input.actor.type,
+      input.actor.id,
+      input.actor.name,
+      input.actor.avatarUrl,
+      timestamp,
+      timestamp,
+    );
+    return this.getComment(id);
+  }
+
+  getComment(id) {
+    const row = this.database.prepare("SELECT * FROM comments WHERE id = ?").get(id);
+    return row ? this.#commentWithAttachments(row) : null;
+  }
+
+  updateComment(id, version, body, threadId) {
+    const current = this.#requireComment(id);
+    this.#requireCommentVersion(current, version);
+    const result = this.database.prepare(`
+      UPDATE comments
+      SET body = ?, thread_id = COALESCE(?, thread_id), version = version + 1, updated_at = ?
+      WHERE id = ? AND version = ?
+    `).run(body, threadId ?? null, now(), id, version);
+    if (result.changes !== 1) {
+      this.#throwMissingCommentOrConflict(id, version);
+    }
+    return this.getComment(id);
+  }
+
+  deleteComment(id, version) {
+    const current = this.#requireComment(id);
+    this.#requireCommentVersion(current, version);
+    const result = this.database.prepare(`
+      DELETE FROM comments WHERE id = ? AND version = ?
+    `).run(id, version);
+    if (result.changes !== 1) {
+      this.#throwMissingCommentOrConflict(id, version);
+    }
+    return current;
+  }
+
+  listAttachments(taskId) {
+    const task = this.#requireTask(taskId);
+    return this.database.prepare(`
+      SELECT * FROM attachments
+      WHERE task_id = ? AND comment_id IS NULL
+      ORDER BY created_at, id
+    `).all(task.id).map(attachmentFromRow);
+  }
+
+  createAttachment(taskId, input) {
+    const task = this.#requireTask(taskId);
+    this.database.prepare(`
+      INSERT INTO attachments (id, task_id, comment_id, filename, content_type, size, created_at)
+      VALUES (?, ?, NULL, ?, ?, ?, ?)
+    `).run(input.id, task.id, input.filename, input.contentType, input.size, now());
+    return this.getAttachment(input.id);
+  }
+
+  listCommentAttachments(commentId) {
+    const comment = this.database.prepare("SELECT id FROM comments WHERE id = ?").get(commentId);
+    if (!comment) {
+      throw new ApiError(404, "COMMENT_NOT_FOUND", `Comment '${commentId}' does not exist`);
+    }
+    return this.#attachmentsForComment(commentId);
+  }
+
+  createCommentAttachment(commentId, input) {
+    const comment = this.#requireComment(commentId);
+    this.database.prepare(`
+      INSERT INTO attachments (id, task_id, comment_id, filename, content_type, size, created_at)
+      VALUES (?, ?, ?, ?, ?, ?, ?)
+    `).run(input.id, comment.taskId, comment.id, input.filename, input.contentType, input.size, now());
+    return this.getAttachment(input.id);
+  }
+
+  getAttachment(id) {
+    const row = this.database.prepare("SELECT * FROM attachments WHERE id = ?").get(id);
+    return row ? attachmentFromRow(row) : null;
+  }
+
+  deleteAttachment(id) {
+    const attachment = this.getAttachment(id);
+    if (!attachment) {
+      throw new ApiError(404, "ATTACHMENT_NOT_FOUND", `Attachment '${id}' does not exist`);
+    }
+    this.database.prepare("DELETE FROM attachments WHERE id = ?").run(id);
+    return attachment;
+  }
+
+  #commentWithAttachments(row) {
+    const comment = commentFromRow(row);
+    comment.attachments = this.#attachmentsForComment(comment.id);
+    return comment;
+  }
+
+  #aiChatThreadWithCurrentRun(row) {
+    const thread = aiChatThreadFromRow(row);
+    const currentRun = this.database.prepare(`
+      SELECT * FROM ai_chat_runs
+      WHERE thread_id = ? AND status = 'running'
+      ORDER BY started_at DESC, id DESC
+      LIMIT 1
+    `).get(thread.id);
+    thread.currentRun = currentRun ? aiChatRunFromRow(currentRun) : null;
+    return thread;
+  }
+
+  #attachmentsForComment(commentId) {
+    return this.database.prepare(`
+      SELECT * FROM attachments
+      WHERE comment_id = ?
+      ORDER BY created_at, id
+    `).all(commentId).map(attachmentFromRow);
+  }
+
+  #taskWithRelations(row) {
+    const task = taskFromRow(row);
+    const parent = this.database.prepare(`
+      SELECT tasks.*
+      FROM task_relations
+      JOIN tasks ON tasks.id = task_relations.source_task_id
+      WHERE task_relations.relation_type = 'parent'
+        AND task_relations.target_task_id = ?
+    `).get(task.id);
+    const subIssues = this.database.prepare(`
+      SELECT tasks.*
+      FROM task_relations
+      JOIN tasks ON tasks.id = task_relations.target_task_id
+      WHERE task_relations.relation_type = 'parent'
+        AND task_relations.source_task_id = ?
+      ORDER BY tasks.sort_order, tasks.created_at, tasks.id
+    `).all(task.id);
+    const blockedBy = this.database.prepare(`
+      SELECT tasks.*
+      FROM task_relations
+      JOIN tasks ON tasks.id = task_relations.source_task_id
+      WHERE task_relations.relation_type = 'blocks'
+        AND task_relations.target_task_id = ?
+      ORDER BY tasks.sort_order, tasks.created_at, tasks.id
+    `).all(task.id);
+    const blocks = this.database.prepare(`
+      SELECT tasks.*
+      FROM task_relations
+      JOIN tasks ON tasks.id = task_relations.target_task_id
+      WHERE task_relations.relation_type = 'blocks'
+        AND task_relations.source_task_id = ?
+      ORDER BY tasks.sort_order, tasks.created_at, tasks.id
+    `).all(task.id);
+    const related = this.database.prepare(`
+      SELECT tasks.*
+      FROM task_relations
+      JOIN tasks ON tasks.id = CASE
+        WHEN task_relations.source_task_id = ? THEN task_relations.target_task_id
+        ELSE task_relations.source_task_id
+      END
+      WHERE task_relations.relation_type = 'related'
+        AND (
+          task_relations.source_task_id = ?
+          OR task_relations.target_task_id = ?
+        )
+      ORDER BY tasks.sort_order, tasks.created_at, tasks.id
+    `).all(task.id, task.id, task.id);
+    task.relations = {
+      parent: parent ? taskRelationSummaryFromRow(parent) : null,
+      subIssues: subIssues.map(taskRelationSummaryFromRow),
+      blockedBy: blockedBy.map(taskRelationSummaryFromRow),
+      blocks: blocks.map(taskRelationSummaryFromRow),
+      related: related.map(taskRelationSummaryFromRow),
+    };
+    return task;
+  }
+
+  #validateRelationTasks(task, relatedTask) {
+    if (task.id === relatedTask.id) {
+      throw new ApiError(400, "SELF_RELATION", "An issue cannot be related to itself");
+    }
+    if (task.projectId !== relatedTask.projectId) {
+      throw new ApiError(400, "CROSS_PROJECT_RELATION", "Issue relations must stay within one project");
+    }
+  }
+
+  #relationEndpoints(type, taskId, relatedTaskId) {
+    if (type === "parent") {
+      return {
+        relationType: "parent",
+        sourceTaskId: relatedTaskId,
+        targetTaskId: taskId,
+      };
+    }
+    if (type === "blocks") {
+      return {
+        relationType: "blocks",
+        sourceTaskId: taskId,
+        targetTaskId: relatedTaskId,
+      };
+    }
+    if (type === "blocked_by") {
+      return {
+        relationType: "blocks",
+        sourceTaskId: relatedTaskId,
+        targetTaskId: taskId,
+      };
+    }
+    const [sourceTaskId, targetTaskId] = [taskId, relatedTaskId].sort();
+    return { relationType: "related", sourceTaskId, targetTaskId };
+  }
+
+  #assertNoParentCycle(childId, parentId) {
+    const cycle = this.database.prepare(`
+      WITH RECURSIVE ancestors(id) AS (
+        SELECT source_task_id
+        FROM task_relations
+        WHERE relation_type = 'parent' AND target_task_id = ?
+        UNION
+        SELECT task_relations.source_task_id
+        FROM task_relations
+        JOIN ancestors ON task_relations.target_task_id = ancestors.id
+        WHERE task_relations.relation_type = 'parent'
+      )
+      SELECT 1 FROM ancestors WHERE id = ?
+    `).get(parentId, childId);
+    if (cycle) {
+      throw new ApiError(409, "RELATION_CYCLE", "This parent would create a cycle");
+    }
+  }
+
+  #touchTask(id, version, threadId) {
+    const result = this.database.prepare(`
+      UPDATE tasks
+      SET thread_id = COALESCE(?, thread_id), version = version + 1, updated_at = ?
+      WHERE id = ? AND version = ?
+    `).run(threadId ?? null, now(), id, version);
+    if (result.changes !== 1) {
+      this.#throwMissingOrConflict(id, version);
+    }
+  }
+
+  #requireTask(id) {
+    const task = this.getTask(id);
+    if (!task) {
+      throw new ApiError(404, "TASK_NOT_FOUND", `Task '${id}' does not exist`);
+    }
+    return task;
+  }
+
+  #requireComment(id) {
+    const comment = this.getComment(id);
+    if (!comment) {
+      throw new ApiError(404, "COMMENT_NOT_FOUND", `Comment '${id}' does not exist`);
+    }
+    return comment;
+  }
+
+  #requireVersion(task, expectedVersion) {
+    if (task.version !== expectedVersion) {
+      throw new ApiError(409, "VERSION_CONFLICT", "Task was changed by another client", {
+        expectedVersion,
+        actualVersion: task.version,
+      });
+    }
+  }
+
+  #requireCommentVersion(comment, expectedVersion) {
+    if (comment.version !== expectedVersion) {
+      throw new ApiError(409, "VERSION_CONFLICT", "Comment was changed by another client", {
+        expectedVersion,
+        actualVersion: comment.version,
+      });
+    }
+  }
+
+  #throwMissingOrConflict(id, expectedVersion) {
+    const task = this.getTask(id);
+    if (!task) {
+      throw new ApiError(404, "TASK_NOT_FOUND", `Task '${id}' does not exist`);
+    }
+    throw new ApiError(409, "VERSION_CONFLICT", "Task was changed by another client", {
+      expectedVersion,
+      actualVersion: task.version,
+    });
+  }
+
+  #throwMissingCommentOrConflict(id, expectedVersion) {
+    const comment = this.getComment(id);
+    if (!comment) {
+      throw new ApiError(404, "COMMENT_NOT_FOUND", `Comment '${id}' does not exist`);
+    }
+    throw new ApiError(409, "VERSION_CONFLICT", "Comment was changed by another client", {
+      expectedVersion,
+      actualVersion: comment.version,
+    });
+  }
+}
diff --git a/apps/codex-taskboard/server/executable.mjs b/apps/codex-taskboard/server/executable.mjs
new file mode 100644
index 000000000..e7cbc3a96
--- /dev/null
+++ b/apps/codex-taskboard/server/executable.mjs
@@ -0,0 +1,41 @@
+import { execFile, spawn } from "node:child_process";
+import { readFileSync } from "node:fs";
+import path from "node:path";
+import { promisify } from "node:util";
+
+const execFileAsync = promisify(execFile);
+
+function usesNodeRuntime(executable) {
+  const ext = path.extname(executable).toLowerCase();
+  if (ext === ".js" || ext === ".mjs" || ext === ".cjs") return true;
+  try {
+    const firstLine = readFileSync(executable, "utf8").split(/\r?\n/, 1)[0];
+    return /^#!.*\bnode(?:\.exe)?\b/i.test(firstLine);
+  } catch {
+    return false;
+  }
+}
+
+function normalizeExecutable(executable, args = []) {
+  if (usesNodeRuntime(executable)) {
+    return { executable: process.execPath, args: [executable, ...args] };
+  }
+  return { executable, args };
+}
+
+function childProcessOptions(options) {
+  return {
+    ...options,
+    windowsHide: process.platform === "win32",
+  };
+}
+
+export function spawnExecutable(executable, args, options) {
+  const command = normalizeExecutable(executable, args);
+  return spawn(command.executable, command.args, childProcessOptions(options));
+}
+
+export function execFileExecutable(executable, args, options) {
+  const command = normalizeExecutable(executable, args);
+  return execFileAsync(command.executable, command.args, childProcessOptions(options));
+}
diff --git a/apps/codex-taskboard/server/index.mjs b/apps/codex-taskboard/server/index.mjs
new file mode 100644
index 000000000..1786f9573
--- /dev/null
+++ b/apps/codex-taskboard/server/index.mjs
@@ -0,0 +1,46 @@
+import os from "node:os";
+import { pathToFileURL } from "node:url";
+
+import {
+  LAN_SHARING_WARNING,
+  createTaskboardServer,
+  resolveHost,
+  resolvePort,
+} from "./app.mjs";
+
+export { createTaskboardServer, resolveHost, resolvePort, resolveServerOptions } from "./app.mjs";
+
+async function main() {
+  const app = createTaskboardServer();
+  const host = resolveHost();
+  if (host === "0.0.0.0") {
+    console.warn(LAN_SHARING_WARNING);
+  }
+  const address = await app.listen({ host, port: resolvePort() });
+  console.log(`Codex Taskboard listening on http://127.0.0.1:${address.port}`);
+  if (host === "0.0.0.0") {
+    const addresses = Object.values(os.networkInterfaces())
+      .flat()
+      .filter((entry) => entry?.family === "IPv4" && !entry.internal)
+      .map((entry) => entry.address);
+    for (const lanAddress of [...new Set(addresses)]) {
+      console.log(`Codex Taskboard available on LAN at http://${lanAddress}:${address.port}`);
+    }
+  }
+
+  let closing = false;
+  const close = async () => {
+    if (closing) return;
+    closing = true;
+    await app.close();
+  };
+  process.once("SIGINT", () => close().then(() => process.exit(0)));
+  process.once("SIGTERM", () => close().then(() => process.exit(0)));
+}
+
+if (process.argv[1] && import.meta.url === pathToFileURL(process.argv[1]).href) {
+  main().catch((error) => {
+    console.error(error);
+    process.exitCode = 1;
+  });
+}
diff --git a/apps/codex-taskboard/shared/domain.mjs b/apps/codex-taskboard/shared/domain.mjs
new file mode 100644
index 000000000..bdf28a56e
--- /dev/null
+++ b/apps/codex-taskboard/shared/domain.mjs
@@ -0,0 +1,21 @@
+export const TASK_STATUSES = [
+  "backlog",
+  "todo",
+  "in_progress",
+  "in_review",
+  "blocked",
+  "done",
+  "canceled",
+];
+export const TASK_PRIORITIES = ["none", "urgent", "high", "medium", "low"];
+
+export const DEFAULT_PROJECT_ID = "local";
+export const DEFAULT_PROJECT_NAME = "无项目";
+
+export function isTaskStatus(value) {
+  return TASK_STATUSES.includes(value);
+}
+
+export function isTaskPriority(value) {
+  return TASK_PRIORITIES.includes(value);
+}
diff --git a/apps/codex-taskboard/shared/taskboard-automation-options.d.mts b/apps/codex-taskboard/shared/taskboard-automation-options.d.mts
new file mode 100644
index 000000000..f9a5ab186
--- /dev/null
+++ b/apps/codex-taskboard/shared/taskboard-automation-options.d.mts
@@ -0,0 +1,44 @@
+export type AutomationModel =
+  | "gpt-5.6-sol"
+  | "gpt-5.6-terra"
+  | "gpt-5.6-luna"
+  | "gpt-5.5"
+  | "gpt-5.4"
+  | "gpt-5.4-mini";
+
+export type AutomationReasoningEffort =
+  | "low"
+  | "medium"
+  | "high"
+  | "xhigh"
+  | "max"
+  | "ultra";
+
+export interface AutomationModelOption {
+  readonly label: string;
+  readonly slug: AutomationModel;
+  readonly defaultEffort: AutomationReasoningEffort;
+  readonly efforts: readonly AutomationReasoningEffort[];
+}
+
+export const AUTOMATION_MODELS: readonly AutomationModelOption[];
+
+export function getAutomationModel(value: AutomationModel): AutomationModelOption;
+export function getAutomationModel(value: unknown): AutomationModelOption | undefined;
+export function isAutomationModel(value: unknown): value is AutomationModel;
+export function isAutomationReasoningEffort(
+  value: unknown,
+): value is AutomationReasoningEffort;
+export function isSupportedModelEffort(
+  model: unknown,
+  effort: unknown,
+): model is AutomationModel;
+export function withAutomationModel<
+  T extends { model: AutomationModel; reasoningEffort: AutomationReasoningEffort },
+>(
+  options: T,
+  model: AutomationModel,
+): Omit<T, "model" | "reasoningEffort"> & {
+  model: AutomationModel;
+  reasoningEffort: AutomationReasoningEffort;
+};
diff --git a/apps/codex-taskboard/shared/taskboard-automation-options.mjs b/apps/codex-taskboard/shared/taskboard-automation-options.mjs
new file mode 100644
index 000000000..85ad5f102
--- /dev/null
+++ b/apps/codex-taskboard/shared/taskboard-automation-options.mjs
@@ -0,0 +1,68 @@
+export const AUTOMATION_MODELS = [
+  {
+    label: "5.6 Sol",
+    slug: "gpt-5.6-sol",
+    defaultEffort: "low",
+    efforts: ["low", "medium", "high", "xhigh", "max", "ultra"],
+  },
+  {
+    label: "5.6 Terra",
+    slug: "gpt-5.6-terra",
+    defaultEffort: "medium",
+    efforts: ["low", "medium", "high", "xhigh", "max", "ultra"],
+  },
+  {
+    label: "5.6 Luna",
+    slug: "gpt-5.6-luna",
+    defaultEffort: "medium",
+    efforts: ["low", "medium", "high", "xhigh", "max"],
+  },
+  {
+    label: "5.5",
+    slug: "gpt-5.5",
+    defaultEffort: "medium",
+    efforts: ["low", "medium", "high", "xhigh"],
+  },
+  {
+    label: "5.4",
+    slug: "gpt-5.4",
+    defaultEffort: "medium",
+    efforts: ["low", "medium", "high", "xhigh"],
+  },
+  {
+    label: "5.4 Mini",
+    slug: "gpt-5.4-mini",
+    defaultEffort: "medium",
+    efforts: ["low", "medium", "high", "xhigh"],
+  },
+];
+
+const MODELS_BY_SLUG = new Map(AUTOMATION_MODELS.map((model) => [model.slug, model]));
+const REASONING_EFFORTS = new Set(AUTOMATION_MODELS.flatMap((model) => model.efforts));
+
+export function getAutomationModel(value) {
+  return MODELS_BY_SLUG.get(value);
+}
+
+export function isAutomationModel(value) {
+  return MODELS_BY_SLUG.has(value);
+}
+
+export function isAutomationReasoningEffort(value) {
+  return REASONING_EFFORTS.has(value);
+}
+
+export function isSupportedModelEffort(model, effort) {
+  return getAutomationModel(model)?.efforts.includes(effort) ?? false;
+}
+
+export function withAutomationModel(options, model) {
+  const nextModel = getAutomationModel(model);
+  return {
+    ...options,
+    model,
+    reasoningEffort: nextModel.efforts.includes(options.reasoningEffort)
+      ? options.reasoningEffort
+      : nextModel.defaultEffort,
+  };
+}
diff --git a/apps/codex-taskboard/shared/taskboard-automation.mjs b/apps/codex-taskboard/shared/taskboard-automation.mjs
new file mode 100644
index 000000000..ad3017e18
--- /dev/null
+++ b/apps/codex-taskboard/shared/taskboard-automation.mjs
@@ -0,0 +1,181 @@
+import path from "node:path";
+import { isSupportedModelEffort } from "./taskboard-automation-options.mjs";
+
+const AUTOMATION_OPERATIONS = new Set(["ensure-active", "pause", "list", "apply-policy"]);
+const INTERVAL_MINUTES = new Set([5, 10, 15, 30, 60]);
+const HOST_REQUEST_FIELDS = new Set([
+  "id",
+  "action",
+  "requestId",
+  "operation",
+  "taskboardProjectId",
+  "codexProjectId",
+  "projectName",
+  "workspacePath",
+  "skillPath",
+  "automationId",
+  "enabledByUser",
+  "quotaAware",
+  "intervalMinutes",
+  "model",
+  "reasoningEffort",
+]);
+
+export function parseTaskboardAutomationHostRequest(value) {
+  if (!value || typeof value !== "object" || Array.isArray(value)) return null;
+  if (Object.keys(value).some((field) => !HOST_REQUEST_FIELDS.has(field))) return null;
+  if (value.action !== "automation") return null;
+  if (!validIdentifier(value.id, 80) || !validIdentifier(value.requestId, 100)) return null;
+  if (!AUTOMATION_OPERATIONS.has(value.operation)) return null;
+  if (!validProjectId(value.taskboardProjectId)) return null;
+  if (!validText(value.codexProjectId, 256) || !validText(value.projectName, 200)) return null;
+  if (!validAbsolutePath(value.workspacePath) || !validAbsolutePath(value.skillPath)) return null;
+  if (!INTERVAL_MINUTES.has(value.intervalMinutes)) return null;
+  if (!isSupportedModelEffort(value.model, value.reasoningEffort)) return null;
+  if (value.automationId !== undefined && !validText(value.automationId, 256)) return null;
+  if (typeof value.enabledByUser !== "boolean" || typeof value.quotaAware !== "boolean") return null;
+
+  return {
+    id: value.id,
+    action: "automation",
+    requestId: value.requestId,
+    operation: value.operation,
+    taskboardProjectId: value.taskboardProjectId,
+    codexProjectId: value.codexProjectId,
+    projectName: value.projectName,
+    workspacePath: value.workspacePath,
+    skillPath: value.skillPath,
+    ...(value.automationId === undefined ? {} : { automationId: value.automationId }),
+    enabledByUser: value.enabledByUser,
+    quotaAware: value.quotaAware,
+    intervalMinutes: value.intervalMinutes,
+    model: value.model,
+    reasoningEffort: value.reasoningEffort,
+  };
+}
+
+export function buildTaskboardAutomationName(request) {
+  return `Taskboard 自动认领 · ${request.taskboardProjectId}`;
+}
+
+export function buildTaskboardAutomationPrompt(request) {
+  return [
+    `[$manage-taskboard](${request.skillPath}) e-taskboard 每 ${request.intervalMinutes} 分钟检查任务面板中的「${request.projectName}」项目（项目 ID：${request.taskboardProjectId}，项目目录：${request.workspacePath}）。`,
+    "每次仅处理一个 todo：先用 issue get 读取最新任务内容，并用 comment list 读取全部评论，确认是否包含已完成后被打回的返工要求。",
+    "认领时使用最新 version 将任务移动到 in_progress；若发生版本冲突或最新状态已变化，立即跳过，避免多个 Agent 抢同一任务。",
+    "若任务已绑定 branch 或 worktree，必须在该任务绑定的开发上下文执行，避免并行 Agent 修改同一工作目录。",
+    "执行完成并验证后，先用 comment add 记录关键改动、验证结果、执行结果和剩余风险，再使用最新 version 将任务移动到 in_review；不要直接标记为 done。",
+  ].join("\n");
+}
+
+export function buildTaskboardAutomationSpec(request) {
+  return {
+    kind: "cron",
+    name: buildTaskboardAutomationName(request),
+    prompt: buildTaskboardAutomationPrompt(request),
+    projectId: request.codexProjectId,
+    executionEnvironment: "local",
+    localEnvironmentConfigPath: null,
+    model: request.model,
+    reasoningEffort: request.reasoningEffort,
+    rrule: `RRULE:FREQ=MINUTELY;INTERVAL=${request.intervalMinutes}`,
+  };
+}
+
+export async function reconcileTaskboardAutomation(request, rpc) {
+  const listed = await rpc("list-automations", {});
+  const items = Array.isArray(listed?.items) ? listed.items : [];
+  const name = buildTaskboardAutomationName(request);
+  const matchingItems = items.filter((item) => item?.name === name);
+
+  if (request.operation === "list") {
+    return { items: matchingItems.map(sanitizeAutomation).filter(Boolean) };
+  }
+
+  const existing = (
+    request.automationId
+      ? matchingItems.find((item) => item?.id === request.automationId)
+      : null
+  ) ?? matchingItems[0];
+  const spec = buildTaskboardAutomationSpec(request);
+
+  if (request.operation === "pause") {
+    if (!existing) return { error: "not-found" };
+    if (automationMatchesSpec(existing, spec, "PAUSED")) return { item: existing };
+    return rpc("automation-update", { ...spec, id: existing.id, status: "PAUSED" });
+  }
+
+  if (request.operation !== "ensure-active") {
+    throw new Error(`Unsupported automation operation: ${request.operation}`);
+  }
+  if (existing) {
+    if (automationMatchesSpec(existing, spec, "ACTIVE")) return { item: existing };
+    return rpc("automation-update", {
+      ...spec,
+      id: existing.id,
+      status: "ACTIVE",
+    });
+  }
+  return rpc("automation-create", spec);
+}
+
+function sanitizeAutomation(item) {
+  if (
+    !validText(item?.id, 256)
+    || (item.status !== "ACTIVE" && item.status !== "PAUSED")
+    || !isSupportedModelEffort(item.model, item.reasoningEffort)
+    || !validRrule(item.rrule)
+  ) return null;
+  return {
+    id: item.id,
+    status: item.status,
+    model: item.model,
+    reasoningEffort: item.reasoningEffort,
+    rrule: item.rrule,
+    ...(
+      item.nextRunAt === null || Number.isFinite(item.nextRunAt)
+        ? { nextRunAt: item.nextRunAt }
+        : {}
+    ),
+  };
+}
+
+function validRrule(value) {
+  return typeof value === "string"
+    && /^RRULE:FREQ=MINUTELY;INTERVAL=(5|10|15|30|60)$/.test(value);
+}
+
+function automationMatchesSpec(item, spec, status) {
+  return item?.status === status
+    && Object.entries(spec).every(([field, value]) => (
+      field === "projectId"
+        ? (item.projectId ?? item.target?.projectId) === value
+        : item[field] === value
+    ));
+}
+
+function validIdentifier(value, maxLength) {
+  return typeof value === "string"
+    && value.length > 0
+    && value.length <= maxLength
+    && /^[a-z0-9-]+$/i.test(value);
+}
+
+function validProjectId(value) {
+  return typeof value === "string"
+    && value.length > 0
+    && value.length <= 128
+    && /^[a-z0-9._-]+$/i.test(value);
+}
+
+function validText(value, maxLength) {
+  return typeof value === "string"
+    && value.trim() === value
+    && value.length > 0
+    && value.length <= maxLength
+    && !/[\u0000-\u001f\u007f]/.test(value);
+}
+
+function validAbsolutePath(value) {
+  return validText(value, 2_048) && path.isAbsolute(value);
+}
diff --git a/apps/codex-taskboard/shared/workflow-control-flow.d.mts b/apps/codex-taskboard/shared/workflow-control-flow.d.mts
new file mode 100644
index 000000000..5ffd83fda
--- /dev/null
+++ b/apps/codex-taskboard/shared/workflow-control-flow.d.mts
@@ -0,0 +1,159 @@
+export type WorkflowConditionOutcome = "true" | "false";
+
+export const WORKFLOW_TRIGGER_KINDS: readonly [
+  "issue-trigger",
+  "rss-trigger",
+  "pull-request-submitted-trigger",
+  "repository-issue-submitted-trigger",
+  "git-status-trigger",
+];
+export function isWorkflowTriggerKind(kind: string): boolean;
+
+export interface WorkflowSequenceRefSegment {
+  conditionId: string;
+  outcome: WorkflowConditionOutcome;
+}
+
+export type WorkflowSequenceRef = WorkflowSequenceRefSegment[];
+
+export interface WorkflowStepItem {
+  type: "step";
+  nodeId: string;
+}
+
+export interface WorkflowConditionItem {
+  type: "condition";
+  nodeId: string;
+  branches: {
+    true: WorkflowSequence;
+    false: WorkflowSequence;
+  };
+}
+
+export type WorkflowItem = WorkflowStepItem | WorkflowConditionItem;
+
+export interface WorkflowSequence {
+  items: WorkflowItem[];
+}
+
+export interface WorkflowFlow {
+  version: 2;
+  root: WorkflowSequence;
+}
+
+export interface WorkflowControlNode {
+  id: string;
+  parentId?: string;
+  position?: { x: number; y: number };
+  measured?: { width?: number; height?: number };
+  style?: { width?: number | string; height?: number | string };
+  data?: { kind?: string; acceptsChildren?: boolean };
+}
+
+export interface WorkflowInsertion {
+  sequenceRef: WorkflowSequenceRef;
+  index: number;
+}
+
+export interface WorkflowDerivedEdge {
+  id: string;
+  source: string;
+  target: string;
+  type: "workflowInsert";
+  data: {
+    points: Array<{ x: number; y: number }>;
+    insertion?: WorkflowInsertion;
+    buttonX?: number;
+    buttonY?: number;
+    conditionId?: string;
+    conditionOutcome?: WorkflowConditionOutcome;
+    branchStart?: boolean;
+    labelX?: number;
+    labelY?: number;
+  };
+}
+
+export function createWorkflowFlow(stepIds?: string[]): WorkflowFlow;
+export function workflowNodeIds(flow: WorkflowFlow): string[];
+export function getWorkflowSequence(
+  flow: WorkflowFlow,
+  sequenceRef: WorkflowSequenceRef,
+): WorkflowSequence;
+export function findWorkflowItem(
+  flow: WorkflowFlow,
+  nodeId: string,
+): { sequenceRef: WorkflowSequenceRef; index: number; item: WorkflowItem } | null;
+export function assertWorkflowFlow<T extends WorkflowControlNode>(
+  flow: WorkflowFlow,
+  nodes: T[],
+): WorkflowFlow;
+export function migrateWorkflowSnapshotV1<T extends WorkflowControlNode>(
+  nodes: T[],
+  edges: unknown[],
+  selectedNodeId?: string | null,
+): { nodes: T[]; flow: WorkflowFlow; selectedNodeId: string | null };
+export function normalizeWorkflowSnapshot<T extends WorkflowControlNode>(
+  snapshot: {
+    nodes: T[];
+    flow?: WorkflowFlow;
+    edges?: unknown[];
+    selectedNodeId?: string | null;
+  },
+): { nodes: T[]; flow: WorkflowFlow; selectedNodeId: string | null };
+export function serializeWorkflowSnapshot<T extends WorkflowControlNode>(
+  nodes: T[],
+  flow: WorkflowFlow,
+  selectedNodeId?: string | null,
+): { nodes: T[]; flow: WorkflowFlow; selectedNodeId: string | null };
+export function insertWorkflowNode(
+  flow: WorkflowFlow,
+  sequenceRef: WorkflowSequenceRef,
+  index: number,
+  nodeId: string,
+  kind: string,
+): WorkflowFlow;
+export function deleteWorkflowNode(
+  flow: WorkflowFlow,
+  nodeId: string,
+): { flow: WorkflowFlow; removedNodeIds: string[] };
+export function moveWorkflowNode(
+  flow: WorkflowFlow,
+  nodeId: string,
+  targetSequenceRef: WorkflowSequenceRef,
+  targetIndex: number,
+): WorkflowFlow;
+export function deriveWorkflowLayout<T extends WorkflowControlNode>(
+  flow: WorkflowFlow,
+  nodes: T[],
+): {
+  positions: Record<string, { x: number; y: number }>;
+  conditions: Record<string, {
+    nodeBottom: number;
+    splitY: number;
+    mergeRailY: number;
+    mergeY: number;
+    mergeX: number;
+    branchCenters: Record<WorkflowConditionOutcome, number>;
+    branchBounds: Record<WorkflowConditionOutcome, {
+      left: number;
+      right: number;
+      top: number;
+      bottom: number;
+    }>;
+    bounds: { left: number; right: number; top: number; bottom: number };
+  }>;
+  virtualNodes: Array<{
+    id: string;
+    kind: string;
+    position: { x: number; y: number };
+  }>;
+  edges: WorkflowDerivedEdge[];
+  insertionPoints: Array<{
+    id: string;
+    edgeId: string | null;
+    x: number;
+    y: number;
+    insertion: WorkflowInsertion;
+  }>;
+  bounds: { left: number; right: number; top: number; bottom: number };
+};
diff --git a/apps/codex-taskboard/shared/workflow-control-flow.mjs b/apps/codex-taskboard/shared/workflow-control-flow.mjs
new file mode 100644
index 000000000..6c51905d4
--- /dev/null
+++ b/apps/codex-taskboard/shared/workflow-control-flow.mjs
@@ -0,0 +1,723 @@
+import {
+  normalizeWorkflowConditionBranches,
+} from "./workflow-sequence.mjs";
+
+const NODE_WIDTH = 250;
+const DEFAULT_NODE_HEIGHT = 138;
+const SEQUENCE_GAP = 58;
+const BRANCH_GAP = 110;
+const SPLIT_OFFSET = 28;
+const BRANCH_TOP_OFFSET = 94;
+const MERGE_RAIL_OFFSET = 36;
+const MERGE_OFFSET = 28;
+const ROOT_TOP = 48;
+
+export const WORKFLOW_TRIGGER_KINDS = Object.freeze([
+  "issue-trigger",
+  "rss-trigger",
+  "pull-request-submitted-trigger",
+  "repository-issue-submitted-trigger",
+  "git-status-trigger",
+]);
+
+const WORKFLOW_TRIGGER_KIND_SET = new Set(WORKFLOW_TRIGGER_KINDS);
+
+export function isWorkflowTriggerKind(kind) {
+  return WORKFLOW_TRIGGER_KIND_SET.has(kind);
+}
+
+function stepItem(nodeId) {
+  return { type: "step", nodeId };
+}
+
+function conditionItem(nodeId, trueItems = [], falseItems = []) {
+  return {
+    type: "condition",
+    nodeId,
+    branches: {
+      true: { items: trueItems },
+      false: { items: falseItems },
+    },
+  };
+}
+
+function legacySequenceItems(nodeIds, nodesById, persistedBranchesByCondition) {
+  const items = [];
+  for (let index = 0; index < nodeIds.length; index += 1) {
+    const nodeId = nodeIds[index];
+    if (nodesById.get(nodeId)?.data?.kind !== "condition") {
+      items.push(stepItem(nodeId));
+      continue;
+    }
+    const persistedBranches = persistedBranchesByCondition.get(nodeId);
+    if (persistedBranches) {
+      items.push(conditionItem(
+        nodeId,
+        legacySequenceItems(
+          persistedBranches.true,
+          nodesById,
+          persistedBranchesByCondition,
+        ),
+        legacySequenceItems(
+          persistedBranches.false,
+          nodesById,
+          persistedBranchesByCondition,
+        ),
+      ));
+      continue;
+    }
+    items.push(conditionItem(
+      nodeId,
+      legacySequenceItems(
+        nodeIds.slice(index + 1),
+        nodesById,
+        persistedBranchesByCondition,
+      ),
+      [],
+    ));
+    break;
+  }
+  return items;
+}
+
+function cloneFlow(flow) {
+  return JSON.parse(JSON.stringify(flow));
+}
+
+function virtualNodeId(nodeId) {
+  return nodeId.startsWith("__flow-")
+    || nodeId.startsWith("__condition-")
+    || nodeId === "__workflow-sequence-end__";
+}
+
+function visitItems(sequence, visitor, sequenceRef = []) {
+  sequence.items.forEach((item, index) => {
+    visitor(item, sequenceRef, index);
+    if (item.type !== "condition") return;
+    visitItems(
+      item.branches.true,
+      visitor,
+      [...sequenceRef, { conditionId: item.nodeId, outcome: "true" }],
+    );
+    visitItems(
+      item.branches.false,
+      visitor,
+      [...sequenceRef, { conditionId: item.nodeId, outcome: "false" }],
+    );
+  });
+}
+
+function itemNodeIds(item) {
+  const ids = [item.nodeId];
+  if (item.type === "condition") {
+    for (const branch of [item.branches.true, item.branches.false]) {
+      for (const child of branch.items) ids.push(...itemNodeIds(child));
+    }
+  }
+  return ids;
+}
+
+function isTriggerNode(node) {
+  return isWorkflowTriggerKind(node?.data?.kind);
+}
+
+function removeWorkflowItem(sequence, nodeId) {
+  const index = sequence.items.findIndex((item) => item.nodeId === nodeId);
+  if (index >= 0) return sequence.items.splice(index, 1)[0];
+  for (const item of sequence.items) {
+    if (item.type !== "condition") continue;
+    for (const branch of [item.branches.true, item.branches.false]) {
+      const removed = removeWorkflowItem(branch, nodeId);
+      if (removed) return removed;
+    }
+  }
+  return null;
+}
+
+export function createWorkflowFlow(stepIds = []) {
+  return {
+    version: 2,
+    root: {
+      items: stepIds.map(stepItem),
+    },
+  };
+}
+
+export function workflowNodeIds(flow) {
+  const ids = [];
+  visitItems(flow.root, (item) => ids.push(item.nodeId));
+  return ids;
+}
+
+export function getWorkflowSequence(flow, sequenceRef) {
+  let sequence = flow.root;
+  for (const segment of sequenceRef) {
+    const item = sequence.items.find((candidate) => (
+      candidate.type === "condition" && candidate.nodeId === segment.conditionId
+    ));
+    if (!item) throw new Error(`Workflow condition ${segment.conditionId} is not in this sequence`);
+    sequence = item.branches[segment.outcome];
+  }
+  return sequence;
+}
+
+export function findWorkflowItem(flow, nodeId) {
+  let found = null;
+  visitItems(flow.root, (item, sequenceRef, index) => {
+    if (!found && item.nodeId === nodeId) {
+      found = { sequenceRef, index, item };
+    }
+  });
+  return found;
+}
+
+export function assertWorkflowFlow(flow, nodes) {
+  if (!flow || flow.version !== 2 || !flow.root || !Array.isArray(flow.root.items)) {
+    throw new Error("Workflow control flow must use version 2");
+  }
+  const nodeIds = new Set(nodes.map((node) => node.id));
+  if (nodeIds.size !== nodes.length) throw new Error("Workflow node ids must be unique");
+  const nodesById = new Map(nodes.map((node) => [node.id, node]));
+  const visited = new Set();
+  let rootTriggerCount = 0;
+  visitItems(flow.root, (item, sequenceRef, index) => {
+    if (
+      !item
+      || (item.type !== "step" && item.type !== "condition")
+      || typeof item.nodeId !== "string"
+    ) {
+      throw new Error("Workflow items must be steps or conditions");
+    }
+    if (virtualNodeId(item.nodeId)) throw new Error("Workflow flow cannot persist virtual nodes");
+    if (visited.has(item.nodeId)) throw new Error("Workflow node ids must be unique");
+    if (!nodeIds.has(item.nodeId)) throw new Error(`Workflow flow references missing node ${item.nodeId}`);
+    const referencedNode = nodesById.get(item.nodeId);
+    if (referencedNode.parentId) {
+      throw new Error(`Workflow flow item ${item.nodeId} must reference a root node`);
+    }
+    const referencedKind = referencedNode?.data?.kind;
+    if (
+      typeof referencedKind === "string"
+      && referencedKind.endsWith("-trigger")
+      && !isWorkflowTriggerKind(referencedKind)
+    ) {
+      throw new Error(`Unsupported workflow trigger kind ${referencedKind}`);
+    }
+    visited.add(item.nodeId);
+    const referencesConditionNode = referencedNode?.data?.kind === "condition";
+    if (item.type === "condition" && !referencesConditionNode) {
+      throw new Error(`Workflow condition item ${item.nodeId} must reference a condition node`);
+    }
+    if (item.type === "step" && referencesConditionNode) {
+      throw new Error(`Workflow condition node ${item.nodeId} must use a condition item`);
+    }
+    if (item.type === "condition") {
+      if (
+        !item.branches
+        || !item.branches.true
+        || !item.branches.false
+        || !Array.isArray(item.branches.true.items)
+        || !Array.isArray(item.branches.false.items)
+      ) {
+        throw new Error("Workflow conditions must own true and false sequences");
+      }
+    }
+    if (isTriggerNode(referencedNode)) {
+      if (sequenceRef.length > 0 || index !== 0) {
+        throw new Error("Workflow trigger must stay first in the root sequence");
+      }
+      rootTriggerCount += 1;
+    }
+  });
+  if (flow.root.items.length > 0 && rootTriggerCount !== 1) {
+    throw new Error("A non-empty workflow must contain exactly one root-first trigger");
+  }
+  for (const node of nodes) {
+    if (!node.parentId) {
+      if (!virtualNodeId(node.id) && !visited.has(node.id)) {
+        throw new Error(`Workflow node ${node.id} is missing from control flow`);
+      }
+      continue;
+    }
+    const parent = nodesById.get(node.parentId);
+    if (!parent) {
+      throw new Error(`Workflow child node ${node.id} references missing parent ${node.parentId}`);
+    }
+    if (parent.parentId) {
+      throw new Error(`Workflow child node ${node.id} must reference a root parent`);
+    }
+    if (parent.data?.acceptsChildren !== true) {
+      throw new Error(`Workflow parent node ${parent.id} must set data.acceptsChildren to true`);
+    }
+  }
+  return flow;
+}
+
+export function migrateWorkflowSnapshotV1(nodes, edges, selectedNodeId = null) {
+  let persistedNodes = nodes.filter((node) => !virtualNodeId(node.id));
+  const rootNodes = persistedNodes.filter((node) => !node.parentId);
+  const graph = normalizeWorkflowConditionBranches(rootNodes, edges);
+  const nodesById = new Map(persistedNodes.map((node) => [node.id, node]));
+  const persistedBranchesByCondition = new Map();
+  if (graph.conditionId) {
+    persistedBranchesByCondition.set(graph.conditionId, graph.branches);
+  }
+  const rootItems = legacySequenceItems(
+    graph.trunkStepIds,
+    nodesById,
+    persistedBranchesByCondition,
+  );
+  const flow = { version: 2, root: { items: rootItems } };
+  const triggerIds = workflowNodeIds(flow).filter((nodeId) => isTriggerNode(nodesById.get(nodeId)));
+  const primaryTriggerId = triggerIds[0] ?? null;
+  for (const duplicateTriggerId of triggerIds.slice(1)) {
+    removeWorkflowItem(flow.root, duplicateTriggerId);
+  }
+  if (primaryTriggerId && flow.root.items[0]?.nodeId !== primaryTriggerId) {
+    const primaryTrigger = removeWorkflowItem(flow.root, primaryTriggerId);
+    if (primaryTrigger) flow.root.items.unshift(primaryTrigger);
+  }
+  const discardedTriggerIds = new Set(triggerIds.slice(1));
+  persistedNodes = persistedNodes.filter((node) => !discardedTriggerIds.has(node.id));
+  assertWorkflowFlow(flow, persistedNodes);
+  return {
+    nodes: persistedNodes,
+    flow,
+    selectedNodeId: persistedNodes.some((node) => node.id === selectedNodeId)
+      ? selectedNodeId
+      : null,
+  };
+}
+
+export function normalizeWorkflowSnapshot(snapshot) {
+  if (snapshot?.flow !== undefined) {
+    if (snapshot.flow?.version !== 2) {
+      throw new Error("Workflow control flow must use version 2");
+    }
+    const nodes = snapshot.nodes.filter((node) => !virtualNodeId(node.id));
+    assertWorkflowFlow(snapshot.flow, nodes);
+    return {
+      nodes,
+      flow: cloneFlow(snapshot.flow),
+      selectedNodeId: nodes.some((node) => node.id === snapshot.selectedNodeId)
+        ? snapshot.selectedNodeId
+      : null,
+    };
+  }
+  if (!Array.isArray(snapshot?.edges)) {
+    throw new Error("Legacy workflow snapshots must provide edges");
+  }
+  return migrateWorkflowSnapshotV1(
+    snapshot?.nodes ?? [],
+    snapshot?.edges ?? [],
+    snapshot?.selectedNodeId ?? null,
+  );
+}
+
+export function serializeWorkflowSnapshot(nodes, flow, selectedNodeId = null) {
+  const persistedNodes = nodes.filter((node) => !virtualNodeId(node.id));
+  assertWorkflowFlow(flow, persistedNodes);
+  return {
+    nodes: persistedNodes,
+    flow: cloneFlow(flow),
+    selectedNodeId: persistedNodes.some((node) => node.id === selectedNodeId)
+      ? selectedNodeId
+      : null,
+  };
+}
+
+export function insertWorkflowNode(flow, sequenceRef, index, nodeId, kind) {
+  const next = cloneFlow(flow);
+  const sequence = getWorkflowSequence(next, sequenceRef);
+  const insertionIndex = Math.max(0, Math.min(Math.trunc(index), sequence.items.length));
+  if (kind === "condition") {
+    const tail = sequence.items.splice(insertionIndex);
+    sequence.items.push(conditionItem(nodeId, tail, []));
+  } else {
+    sequence.items.splice(insertionIndex, 0, stepItem(nodeId));
+  }
+  return next;
+}
+
+export function deleteWorkflowNode(flow, nodeId) {
+  const next = cloneFlow(flow);
+  const found = findWorkflowItem(next, nodeId);
+  if (!found) return { flow: next, removedNodeIds: [] };
+  const rootFirst = next.root.items[0];
+  if (rootFirst?.nodeId === nodeId) throw new Error("Workflow trigger cannot be deleted");
+  const sequence = getWorkflowSequence(next, found.sequenceRef);
+  const [removed] = sequence.items.splice(found.index, 1);
+  return {
+    flow: next,
+    removedNodeIds: itemNodeIds(removed),
+  };
+}
+
+export function moveWorkflowNode(flow, nodeId, targetSequenceRef, targetIndex) {
+  const found = findWorkflowItem(flow, nodeId);
+  if (!found) return cloneFlow(flow);
+  if (found.sequenceRef.length === 0 && found.index === 0) {
+    throw new Error("Workflow trigger must stay first");
+  }
+  if (
+    found.item.type === "condition"
+    && targetSequenceRef.some((segment) => segment.conditionId === nodeId)
+  ) {
+    throw new Error("Workflow condition cannot move into its own descendant");
+  }
+  const next = cloneFlow(flow);
+  const sourceSequence = getWorkflowSequence(next, found.sequenceRef);
+  const [item] = sourceSequence.items.splice(found.index, 1);
+  const targetSequence = getWorkflowSequence(next, targetSequenceRef);
+  const insertionIndex = Math.max(0, Math.min(Math.trunc(targetIndex), targetSequence.items.length));
+  if (targetSequenceRef.length === 0 && insertionIndex === 0) {
+    throw new Error("Workflow trigger must stay first");
+  }
+  targetSequence.items.splice(insertionIndex, 0, item);
+  return next;
+}
+
+function nodeHeight(node) {
+  const height = Number(node?.style?.height ?? node?.measured?.height);
+  return Number.isFinite(height) && height > 0 ? height : DEFAULT_NODE_HEIGHT;
+}
+
+function measureSequence(sequence, nodesById) {
+  let width = NODE_WIDTH;
+  let height = 0;
+  sequence.items.forEach((item, index) => {
+    const measured = measureItem(item, nodesById);
+    width = Math.max(width, measured.width);
+    height += measured.height;
+    if (index < sequence.items.length - 1) height += SEQUENCE_GAP;
+  });
+  return { width, height };
+}
+
+function measureItem(item, nodesById) {
+  const height = nodeHeight(nodesById.get(item.nodeId));
+  if (item.type === "step") return { width: NODE_WIDTH, height };
+  const trueMeasure = measureSequence(item.branches.true, nodesById);
+  const falseMeasure = measureSequence(item.branches.false, nodesById);
+  return {
+    width: Math.max(NODE_WIDTH, trueMeasure.width + BRANCH_GAP + falseMeasure.width),
+    height: height
+      + BRANCH_TOP_OFFSET
+      + Math.max(trueMeasure.height, falseMeasure.height)
+      + MERGE_RAIL_OFFSET
+      + MERGE_OFFSET,
+  };
+}
+
+function route(...points) {
+  const compact = [];
+  for (const point of points) {
+    const previous = compact.at(-1);
+    if (previous && previous.x === point.x && previous.y === point.y) continue;
+    compact.push(point);
+  }
+  return compact;
+}
+
+function boundsForNode(x, y, height) {
+  return {
+    left: x - NODE_WIDTH / 2,
+    right: x + NODE_WIDTH / 2,
+    top: y,
+    bottom: y + height,
+  };
+}
+
+function unionBounds(...bounds) {
+  return {
+    left: Math.min(...bounds.map((entry) => entry.left)),
+    right: Math.max(...bounds.map((entry) => entry.right)),
+    top: Math.min(...bounds.map((entry) => entry.top)),
+    bottom: Math.max(...bounds.map((entry) => entry.bottom)),
+  };
+}
+
+export function deriveWorkflowLayout(flow, nodes) {
+  const nodesById = new Map(nodes.filter((node) => !node.parentId).map((node) => [node.id, node]));
+  const positions = {};
+  const conditions = {};
+  const virtualNodes = [];
+  const edges = [];
+  const insertionPoints = [];
+  const insertionKeys = new Set();
+  let edgeNumber = 0;
+
+  function addVirtual(id, kind, x, y) {
+    virtualNodes.push({ id, kind, position: { x, y } });
+  }
+
+  function addEdge(source, target, points, options = {}) {
+    const id = options.id ?? `__flow-edge-${edgeNumber++}`;
+    const data = {
+      points: route(...points),
+      ...(options.conditionOutcome
+        ? {
+            conditionId: options.conditionId,
+            conditionOutcome: options.conditionOutcome,
+            branchStart: options.branchStart === true,
+            labelX: options.labelX,
+            labelY: options.labelY,
+          }
+        : {}),
+    };
+    if (options.insertion) {
+      const key = JSON.stringify(options.insertion);
+      if (insertionKeys.has(key)) {
+        throw new Error(`Duplicate workflow insertion point ${key}`);
+      }
+      insertionKeys.add(key);
+      data.insertion = options.insertion;
+      data.buttonX = options.buttonX;
+      data.buttonY = options.buttonY;
+      insertionPoints.push({
+        id: `__flow-insert-${insertionPoints.length}`,
+        edgeId: id,
+        x: options.buttonX,
+        y: options.buttonY,
+        insertion: options.insertion,
+      });
+    }
+    edges.push({
+      id,
+      source,
+      target,
+      type: "workflowInsert",
+      data,
+    });
+  }
+
+  function placeSequence(sequence, sequenceRef, centerX, startY) {
+    let previous = null;
+    let firstInput = null;
+    let bounds = null;
+    sequence.items.forEach((item, index) => {
+      const itemY = previous ? previous.y + SEQUENCE_GAP : startY;
+      const placed = placeItem(item, sequenceRef, centerX, itemY);
+      if (!firstInput) firstInput = placed.input;
+      if (previous) {
+        const insertion = { sequenceRef, index };
+        addEdge(
+          previous.id,
+          placed.input.id,
+          route(previous, placed.input),
+          {
+            insertion,
+            buttonX: centerX,
+            buttonY: previous.y + (placed.input.y - previous.y) / 2,
+          },
+        );
+      }
+      previous = placed.output;
+      bounds = bounds ? unionBounds(bounds, placed.bounds) : placed.bounds;
+    });
+    const emptyBounds = {
+      left: centerX - NODE_WIDTH / 2,
+      right: centerX + NODE_WIDTH / 2,
+      top: startY,
+      bottom: startY,
+    };
+    return {
+      firstInput,
+      output: previous,
+      bounds: bounds ?? emptyBounds,
+      top: startY,
+      bottom: previous?.y ?? startY,
+    };
+  }
+
+  function placeItem(item, sequenceRef, centerX, y) {
+    const height = nodeHeight(nodesById.get(item.nodeId));
+    positions[item.nodeId] = { x: centerX, y };
+    const input = { id: item.nodeId, x: centerX, y };
+    const nodeBottom = y + height;
+    const ownBounds = boundsForNode(centerX, y, height);
+    if (item.type === "step") {
+      return {
+        input,
+        output: { id: item.nodeId, x: centerX, y: nodeBottom },
+        bounds: ownBounds,
+      };
+    }
+
+    const conditionId = item.nodeId;
+    const trueMeasure = measureSequence(item.branches.true, nodesById);
+    const falseMeasure = measureSequence(item.branches.false, nodesById);
+    const totalWidth = trueMeasure.width + BRANCH_GAP + falseMeasure.width;
+    const left = centerX - totalWidth / 2;
+    const branchCenters = {
+      true: left + trueMeasure.width / 2,
+      false: left + trueMeasure.width + BRANCH_GAP + falseMeasure.width / 2,
+    };
+    const splitY = nodeBottom + SPLIT_OFFSET;
+    const branchTop = nodeBottom + BRANCH_TOP_OFFSET;
+    const splitId = `__flow-split-${conditionId}`;
+    addVirtual(splitId, "flow-split", centerX, splitY);
+    addEdge(
+      conditionId,
+      splitId,
+      [{ id: conditionId, x: centerX, y: nodeBottom }, { x: centerX, y: splitY }],
+      { id: `__flow-${conditionId}-to-split` },
+    );
+
+    const branchLayouts = {};
+    for (const outcome of ["true", "false"]) {
+      const branch = item.branches[outcome];
+      const branchRef = [...sequenceRef, { conditionId, outcome }];
+      const branchX = branchCenters[outcome];
+      const placed = placeSequence(branch, branchRef, branchX, branchTop);
+      const emptyId = `__flow-empty-${conditionId}-${outcome}`;
+      let branchInput = placed.firstInput;
+      let branchOutput = placed.output;
+      if (!branchInput) {
+        addVirtual(emptyId, "flow-empty", branchX, branchTop);
+        branchInput = { id: emptyId, x: branchX, y: branchTop };
+        branchOutput = branchInput;
+      }
+      addEdge(
+        splitId,
+        branchInput.id,
+        [
+          { id: splitId, x: centerX, y: splitY },
+          { x: branchX, y: splitY },
+          branchInput,
+        ],
+        {
+          id: `__flow-${conditionId}-${outcome}-start`,
+          conditionId,
+          conditionOutcome: outcome,
+          branchStart: true,
+          labelX: branchX,
+          labelY: splitY + 14,
+          insertion: { sequenceRef: branchRef, index: 0 },
+          buttonX: branchX,
+          buttonY: splitY + (branchTop - splitY) * 0.68,
+        },
+      );
+      branchLayouts[outcome] = {
+        ...placed,
+        input: branchInput,
+        output: branchOutput,
+        bounds: placed.firstInput
+          ? placed.bounds
+          : {
+              left: branchX - NODE_WIDTH / 2,
+              right: branchX + NODE_WIDTH / 2,
+              top: branchTop,
+              bottom: branchTop,
+            },
+        sequenceRef: branchRef,
+        length: branch.items.length,
+      };
+    }
+
+    const branchBottom = Math.max(
+      branchLayouts.true.output.y,
+      branchLayouts.false.output.y,
+    );
+    const mergeRailY = branchBottom + MERGE_RAIL_OFFSET;
+    const mergeY = mergeRailY + MERGE_OFFSET;
+    const mergeId = `__flow-merge-${conditionId}`;
+    addVirtual(mergeId, "flow-merge", centerX, mergeY);
+    for (const outcome of ["true", "false"]) {
+      const branch = branchLayouts[outcome];
+      addEdge(
+        branch.output.id,
+        mergeId,
+        [
+          branch.output,
+          { x: branch.output.x, y: mergeRailY },
+          { x: centerX, y: mergeRailY },
+          { id: mergeId, x: centerX, y: mergeY },
+        ],
+        branch.length > 0
+          ? {
+              id: `__flow-${conditionId}-${outcome}-merge`,
+              conditionId,
+              conditionOutcome: outcome,
+              insertion: {
+                sequenceRef: branch.sequenceRef,
+                index: branch.length,
+              },
+              buttonX: branch.output.x,
+              buttonY: branch.output.y + (mergeRailY - branch.output.y) / 2,
+            }
+          : {
+              id: `__flow-${conditionId}-${outcome}-merge`,
+              conditionId,
+              conditionOutcome: outcome,
+            },
+      );
+    }
+    const branchBounds = {
+      true: branchLayouts.true.bounds,
+      false: branchLayouts.false.bounds,
+    };
+    const bounds = unionBounds(
+      ownBounds,
+      branchBounds.true,
+      branchBounds.false,
+      {
+        left: centerX,
+        right: centerX,
+        top: splitY,
+        bottom: mergeY,
+      },
+    );
+    conditions[conditionId] = {
+      nodeBottom,
+      splitY,
+      mergeRailY,
+      mergeY,
+      mergeX: centerX,
+      branchCenters,
+      branchBounds,
+      bounds,
+    };
+    return {
+      input,
+      output: { id: mergeId, x: centerX, y: mergeY },
+      bounds,
+    };
+  }
+
+  const root = placeSequence(flow.root, [], 0, ROOT_TOP);
+  if (flow.root.items.length === 0) {
+    const insertion = { sequenceRef: [], index: 0 };
+    insertionPoints.push({
+      id: "__flow-insert-root-empty",
+      edgeId: null,
+      x: 0,
+      y: ROOT_TOP,
+      insertion,
+    });
+  } else {
+    const endId = "__flow-end-root";
+    const endY = root.output.y + SEQUENCE_GAP;
+    addVirtual(endId, "flow-end", 0, endY);
+    addEdge(
+      root.output.id,
+      endId,
+      [root.output, { id: endId, x: 0, y: endY }],
+      {
+        id: "__flow-root-end",
+        insertion: { sequenceRef: [], index: flow.root.items.length },
+        buttonX: 0,
+        buttonY: root.output.y + SEQUENCE_GAP / 2,
+      },
+    );
+  }
+
+  return {
+    positions,
+    conditions,
+    virtualNodes,
+    edges,
+    insertionPoints,
+    bounds: root.bounds,
+  };
+}
diff --git a/apps/codex-taskboard/shared/workflow-sequence.d.mts b/apps/codex-taskboard/shared/workflow-sequence.d.mts
new file mode 100644
index 000000000..786c1fe08
--- /dev/null
+++ b/apps/codex-taskboard/shared/workflow-sequence.d.mts
@@ -0,0 +1,65 @@
+export interface WorkflowSequenceNode {
+  id: string;
+  parentId?: string;
+  position: { x: number; y: number };
+  data?: { kind?: string };
+}
+
+export interface WorkflowSequenceEdge {
+  id: string;
+  source: string;
+  target: string;
+  sourceHandle?: string | null;
+  data?: {
+    conditionId?: string;
+    conditionOutcome?: "true" | "false";
+  };
+}
+
+export interface WorkflowConditionGraph {
+  trunkStepIds: string[];
+  conditionId: string | null;
+  branches: {
+    true: string[];
+    false: string[];
+  };
+  migrated: boolean;
+}
+
+export function orderedWorkflowStepIds(
+  nodes: WorkflowSequenceNode[],
+  edges: WorkflowSequenceEdge[],
+): string[];
+
+export function insertWorkflowStep(
+  stepIds: string[],
+  stepId: string,
+  afterStepId: string | null,
+): string[];
+
+export function reorderWorkflowStep(
+  stepIds: string[],
+  stepId: string,
+  targetIndex: number,
+  pinnedStepId?: string,
+): string[];
+
+export function workflowSequenceEdges(stepIds: string[]): WorkflowSequenceEdge[];
+
+export function workflowConditionEdges(
+  trunkStepIds: string[],
+  conditionId: string,
+  branches: WorkflowConditionGraph["branches"],
+): WorkflowSequenceEdge[];
+
+export function normalizeWorkflowConditionBranches(
+  nodes: WorkflowSequenceNode[],
+  edges: WorkflowSequenceEdge[],
+): WorkflowConditionGraph;
+
+export function layoutWorkflowSteps<T extends WorkflowSequenceNode>(
+  nodes: T[],
+  stepIds: string[],
+  heights?: Record<string, number>,
+  options?: { top?: number; gap?: number },
+): T[];
diff --git a/apps/codex-taskboard/shared/workflow-sequence.mjs b/apps/codex-taskboard/shared/workflow-sequence.mjs
new file mode 100644
index 000000000..bd008ad5a
--- /dev/null
+++ b/apps/codex-taskboard/shared/workflow-sequence.mjs
@@ -0,0 +1,226 @@
+function nodePosition(node) {
+  return {
+    x: Number.isFinite(node.position?.x) ? node.position.x : 0,
+    y: Number.isFinite(node.position?.y) ? node.position.y : 0,
+  };
+}
+
+function compareNodes(left, right) {
+  const leftPosition = nodePosition(left);
+  const rightPosition = nodePosition(right);
+  return leftPosition.y - rightPosition.y
+    || leftPosition.x - rightPosition.x
+    || left.id.localeCompare(right.id);
+}
+
+export function orderedWorkflowStepIds(nodes, edges) {
+  const roots = nodes.filter((node) => !node.parentId);
+  const rootsById = new Map(roots.map((node) => [node.id, node]));
+  const outgoing = new Map(roots.map((node) => [node.id, []]));
+  const incoming = new Map(roots.map((node) => [node.id, 0]));
+
+  for (const edge of edges) {
+    if (
+      edge.source === edge.target
+      || !rootsById.has(edge.source)
+      || !rootsById.has(edge.target)
+    ) {
+      continue;
+    }
+    const targets = outgoing.get(edge.source);
+    if (targets.includes(edge.target)) continue;
+    targets.push(edge.target);
+    incoming.set(edge.target, incoming.get(edge.target) + 1);
+  }
+
+  for (const targets of outgoing.values()) {
+    targets.sort((leftId, rightId) => (
+      compareNodes(rootsById.get(leftId), rootsById.get(rightId))
+    ));
+  }
+
+  const ordered = [];
+  const visited = new Set();
+  const visit = (id) => {
+    if (visited.has(id)) return;
+    visited.add(id);
+    ordered.push(id);
+    for (const targetId of outgoing.get(id)) visit(targetId);
+  };
+
+  roots
+    .filter((node) => incoming.get(node.id) === 0)
+    .sort(compareNodes)
+    .forEach((node) => visit(node.id));
+  roots.sort(compareNodes).forEach((node) => visit(node.id));
+  return ordered;
+}
+
+export function insertWorkflowStep(stepIds, stepId, afterStepId) {
+  const next = stepIds.filter((id) => id !== stepId);
+  if (afterStepId === null) {
+    next.push(stepId);
+    return next;
+  }
+  const afterIndex = next.indexOf(afterStepId);
+  next.splice(afterIndex < 0 ? next.length : afterIndex + 1, 0, stepId);
+  return next;
+}
+
+export function reorderWorkflowStep(stepIds, stepId, targetIndex, pinnedStepId) {
+  if (stepId === pinnedStepId || !stepIds.includes(stepId)) return [...stepIds];
+  const next = stepIds.filter((id) => id !== stepId);
+  const minimumIndex = next[0] === pinnedStepId ? 1 : 0;
+  const insertionIndex = Math.max(
+    minimumIndex,
+    Math.min(Number.isFinite(targetIndex) ? Math.trunc(targetIndex) : next.length, next.length),
+  );
+  next.splice(insertionIndex, 0, stepId);
+  return next;
+}
+
+export function workflowSequenceEdges(stepIds) {
+  return stepIds.slice(1).map((target, index) => {
+    const source = stepIds[index];
+    return {
+      id: `sequence-${source}-${target}`,
+      source,
+      target,
+    };
+  });
+}
+
+function conditionEdgeOutcome(edge) {
+  const outcome = edge.data?.conditionOutcome;
+  return outcome === "true" || outcome === "false" ? outcome : null;
+}
+
+function orderedConditionBranchIds(nodes, edges, conditionId, outcome) {
+  const nodeIds = new Set(nodes.map((node) => node.id));
+  const branchEdges = edges.filter((edge) => (
+    edge.data?.conditionId === conditionId
+    && conditionEdgeOutcome(edge) === outcome
+    && nodeIds.has(edge.source)
+    && nodeIds.has(edge.target)
+  ));
+  const outgoing = new Map();
+  for (const edge of branchEdges) {
+    if (!outgoing.has(edge.source)) outgoing.set(edge.source, edge.target);
+  }
+  const ordered = [];
+  const visited = new Set([conditionId]);
+  let current = conditionId;
+  while (outgoing.has(current)) {
+    const next = outgoing.get(current);
+    if (visited.has(next)) break;
+    visited.add(next);
+    ordered.push(next);
+    current = next;
+  }
+  const branchNodeIds = new Set();
+  for (const edge of branchEdges) {
+    if (edge.source !== conditionId) branchNodeIds.add(edge.source);
+    if (edge.target !== conditionId) branchNodeIds.add(edge.target);
+  }
+  nodes
+    .filter((node) => branchNodeIds.has(node.id) && !visited.has(node.id))
+    .sort(compareNodes)
+    .forEach((node) => ordered.push(node.id));
+  return ordered;
+}
+
+export function workflowConditionEdges(trunkStepIds, conditionId, branches) {
+  const edges = workflowSequenceEdges(trunkStepIds);
+  for (const outcome of ["true", "false"]) {
+    const stepIds = branches[outcome] ?? [];
+    const branchSequence = [conditionId, ...stepIds];
+    for (let index = 1; index < branchSequence.length; index += 1) {
+      const source = branchSequence[index - 1];
+      const target = branchSequence[index];
+      edges.push({
+        id: `condition-${conditionId}-${outcome}-${source}-${target}`,
+        source,
+        target,
+        sourceHandle: source === conditionId ? `condition-${outcome}` : undefined,
+        data: {
+          conditionId,
+          conditionOutcome: outcome,
+        },
+      });
+    }
+  }
+  return edges;
+}
+
+export function normalizeWorkflowConditionBranches(nodes, edges) {
+  const persistedConditionEdge = edges.find((edge) => conditionEdgeOutcome(edge));
+  if (persistedConditionEdge) {
+    const conditionId = persistedConditionEdge.data.conditionId;
+    const branches = {
+      true: orderedConditionBranchIds(nodes, edges, conditionId, "true"),
+      false: orderedConditionBranchIds(nodes, edges, conditionId, "false"),
+    };
+    const branchNodeIds = new Set([...branches.true, ...branches.false]);
+    const trunkNodes = nodes.filter((node) => !node.parentId && !branchNodeIds.has(node.id));
+    const trunkEdges = edges.filter((edge) => !conditionEdgeOutcome(edge));
+    const trunkStepIds = orderedWorkflowStepIds(trunkNodes, trunkEdges);
+    return {
+      trunkStepIds,
+      conditionId,
+      branches,
+      migrated: false,
+    };
+  }
+
+  const linearStepIds = orderedWorkflowStepIds(nodes, edges);
+  const conditionIndex = linearStepIds.findIndex((id) => (
+    nodes.find((node) => node.id === id)?.data?.kind === "condition"
+  ));
+  if (conditionIndex < 0) {
+    return {
+      trunkStepIds: linearStepIds,
+      conditionId: null,
+      branches: { true: [], false: [] },
+      migrated: false,
+    };
+  }
+  return {
+    trunkStepIds: linearStepIds.slice(0, conditionIndex + 1),
+    conditionId: linearStepIds[conditionIndex],
+    branches: {
+      true: linearStepIds.slice(conditionIndex + 1),
+      false: [],
+    },
+    migrated: conditionIndex < linearStepIds.length - 1,
+  };
+}
+
+export function layoutWorkflowSteps(
+  nodes,
+  stepIds,
+  heights = {},
+  { top = 0, gap = 0 } = {},
+) {
+  const positions = new Map();
+  let y = top;
+  for (const id of stepIds) {
+    positions.set(id, { x: 0, y });
+    const height = Number.isFinite(heights[id]) ? heights[id] : 0;
+    y += height + gap;
+  }
+  const laidOut = nodes.map((node) => (
+    !node.parentId && positions.has(node.id)
+      ? { ...node, position: positions.get(node.id) }
+      : node
+  ));
+  const nodesById = new Map(laidOut.map((node) => [node.id, node]));
+  const orderedRoots = stepIds
+    .map((id) => nodesById.get(id))
+    .filter((node) => node && !node.parentId);
+  const orderedRootIds = new Set(orderedRoots.map((node) => node.id));
+  return [
+    ...orderedRoots,
+    ...laidOut.filter((node) => !node.parentId && !orderedRootIds.has(node.id)),
+    ...laidOut.filter((node) => node.parentId),
+  ];
+}
diff --git a/apps/codex-taskboard/skills/manage-taskboard/SKILL.md b/apps/codex-taskboard/skills/manage-taskboard/SKILL.md
new file mode 100644
index 000000000..86d2f14c8
--- /dev/null
+++ b/apps/codex-taskboard/skills/manage-taskboard/SKILL.md
@@ -0,0 +1,33 @@
+---
+name: manage-taskboard
+description: Manage taskboard projects, issues, issue relations, and comments through the taskctl CLI. Use when Codex needs to track a new requirement, inspect project work, create or update issues, relate dependent work, add progress notes, begin work on an issue, record completion, or coordinate concurrent updates.
+---
+
+# Manage Taskboard
+
+Use `taskctl` for every project, issue, and comment operation. Read [references/cli.md](references/cli.md) before choosing a command or option.
+
+## Workflow
+
+1. Search for an existing issue before creating one. Use `context current`, then list the project issues and compare their identifiers, titles, descriptions, and status.
+   - If an issue already tracks the same requirement, append the new requirement or acceptance detail to that issue without discarding its existing scope.
+   - If the work depends on, blocks, is blocked by, or is closely related to another issue, add the matching issue relation.
+   - Use a parent/sub-issue relation when one requirement is a contained part of a larger issue. A child has one parent; a parent may have many sub-issues.
+   - Create a new issue only when no existing issue reasonably tracks the requirement.
+   - Do not create, append, or relate a tiny or trivial request that does not benefit from durable tracking.
+   - When a tracked request will be split across parallel or sub-agent work, create one child issue per sub-agent deliverable before dispatching the sub-agent. Add a `parent` relation from each child issue to the parent issue, pass the child issue identifier in that sub-agent's prompt, and write that sub-agent's progress/result comments to the child issue rather than only to the parent.
+   - Keep the parent issue as the coordination and summary issue. Child issues should carry the individual agent status, conversation link, verification evidence, and final handoff state so the parent card's sub-issue progress reflects the real parallel work.
+2. Before executing an issue, read the latest issue content and all comments. Treat comments as part of the current requirements, especially when completed work has been returned for changes.
+   - In a description or comment, `![alt](/api/attachments/<id>/content)` marks an inline image at that exact position in the text.
+   - When understanding that image is necessary, use `attachment download` to save it locally, then inspect the saved file with an available image-viewing tool.
+3. Create or update issues with the CLI; consume its JSON output.
+   Issues created through `taskctl` are assigned to Codex Agent by default. Later CLI updates do not change the assignee.
+4. Let `taskctl` attribute every issue, relation, or comment mutation to the current Codex conversation through `CODEX_THREAD_ID`. Outside Codex, pass the exact conversation id with `--thread-id`.
+5. To claim a `todo` issue, move it to `in_progress` with `--if-version` from the latest read before starting implementation. If this claim reports a version conflict or a new read shows that its status changed, skip the issue and do not implement it.
+6. Include `--if-version <version>` on every concurrent update, using the version returned by the latest read.
+7. Before requesting review, verify the requested work and acceptance criteria.
+8. After implementation and self-verification, add a comment summarizing the key changes, verification, result, and remaining risks; then move the issue to `in_review`. Never move it directly to `done`.
+9. Move an issue from `in_review` to `done` only when the user explicitly confirms acceptance or explicitly asks to mark it complete. Codex self-verification alone is not sufficient.
+10. Move work that cannot continue to `blocked`, and work that will not continue to `canceled`.
+
+For version conflicts outside the initial claim, read the issue again, reconcile the newer state, and retry with its current version.
diff --git a/apps/codex-taskboard/skills/manage-taskboard/agents/openai.yaml b/apps/codex-taskboard/skills/manage-taskboard/agents/openai.yaml
new file mode 100644
index 000000000..95e034684
--- /dev/null
+++ b/apps/codex-taskboard/skills/manage-taskboard/agents/openai.yaml
@@ -0,0 +1,4 @@
+interface:
+  display_name: "Manage Taskboard"
+  short_description: "Manage projects and issues with taskctl CLI"
+  default_prompt: "Use $manage-taskboard to manage this project and its issues with taskctl."
diff --git a/apps/codex-taskboard/skills/manage-taskboard/references/cli.md b/apps/codex-taskboard/skills/manage-taskboard/references/cli.md
new file mode 100644
index 000000000..7b9e08966
--- /dev/null
+++ b/apps/codex-taskboard/skills/manage-taskboard/references/cli.md
@@ -0,0 +1,151 @@
+# taskctl CLI
+
+`taskctl` emits JSON. Add `--json` when making the output contract explicit.
+
+## Context and projects
+
+```bash
+taskctl context current [--cwd PATH] [--json]
+taskctl project list [--json]
+taskctl project create --name NAME [--id ID] [--workspace-path PATH] [--json]
+taskctl project map PROJECT_ID --workspace-path PATH [--json]
+```
+
+Use `--workspace-path` to associate a project with a local repository. `context current` chooses the most specific project whose workspace contains the current directory, then falls back to the `local` project.
+
+Set `CODEX_TASKBOARD_URL` to override the default local API origin, `http://127.0.0.1:47823`.
+
+For a shared cloud board, keep `taskctl` pointed at the loopback companion and configure the upstream HTTPS origin through it:
+
+```bash
+taskctl cloud login --url HTTPS_ORIGIN --actor-name NAME [--json]
+taskctl cloud status [--json]
+taskctl project list [--json]
+taskctl project map PROJECT_ID --workspace-path /absolute/local/path [--json]
+taskctl cloud logout [--json]
+```
+
+`cloud login` reads the shared password from a private `Shared key:` prompt. The actor name is the display attribution sent through Basic Authentication. The companion stores its configuration with mode `0600`; project mappings stay on the current device and can differ between collaborators. In cloud mode, failed upstream writes fail rather than falling back to or double-writing the local SQLite database.
+
+Every issue or comment write must be attributed to a Codex conversation. In Codex, `taskctl` reads the current conversation from `CODEX_THREAD_ID`. Outside Codex, pass `--thread-id ID` explicitly. An explicit option takes precedence over the environment. Read commands do not require a conversation id.
+
+Every successful command writes one JSON object with `schemaVersion` to stdout. The current schema version is `2`. Errors write one JSON object to stderr. Exit codes are `0` for success, `2` for invalid input, `3` when the service is unavailable, `4` for API or response errors, and `5` for conflicts.
+
+## Read issues
+
+```bash
+taskctl issue list [--project PROJECT_ID] [--status STATUS] [--json]
+taskctl issue get ID [--json]
+```
+
+## Create issues
+
+```bash
+taskctl issue create \
+  --project PROJECT_ID \
+  --title TITLE \
+  [--description TEXT | --description-file FILE] \
+  [--status STATUS] \
+  [--priority PRIORITY] \
+  [--labels a,b] \
+  [--thread-id ID] \
+  [--git-branch BRANCH] \
+  [--worktree-path PATH] \
+  [--worktree-branch BRANCH] \
+  [--due-date YYYY-MM-DD] \
+  [--recurrence-interval N --recurrence-unit day|week|month|year] \
+  [--json]
+```
+
+Statuses are `backlog`, `todo`, `in_progress`, `in_review`, `blocked`, `done`, and `canceled`. Priorities are `none`, `urgent`, `high`, `medium`, and `low`.
+
+Issues created through `taskctl` are assigned to Codex Agent by default. Other CLI writes preserve the existing assignee.
+
+## Update issues
+
+Read the issue immediately before a write and pass its `version` with `--if-version`.
+
+```bash
+taskctl issue update ID \
+  [--title TITLE] \
+  [--description TEXT | --description-file FILE] \
+  [--status STATUS] \
+  [--priority PRIORITY] \
+  [--labels a,b] \
+  [--thread-id ID] \
+  [--git-branch BRANCH] \
+  [--worktree-path PATH] \
+  [--worktree-branch BRANCH] \
+  [--due-date YYYY-MM-DD] \
+  [--recurrence-interval N --recurrence-unit day|week|month|year] \
+  [--if-version N] \
+  [--json]
+
+taskctl issue move ID --status STATUS [--thread-id ID] [--if-version N] [--json]
+taskctl issue archive ID [--thread-id ID] [--if-version N] [--json]
+taskctl issue restore ID [--thread-id ID] [--if-version N] [--json]
+```
+
+Use `issue move` to set `in_progress` before implementation and `in_review` after implementation and self-verification. Codex must not move work directly from `in_progress` to `done`; use `done` only after the user explicitly confirms acceptance or explicitly asks to mark the issue complete. Use `blocked` when work cannot continue and `canceled` when it will not continue. On a version conflict, fetch the issue again and reconcile before retrying.
+
+Use either `--git-branch` or `--worktree-path`/`--worktree-branch`; an issue has only one development context. Issue JSON stores it as `developmentContext`, either `{ "type": "branch", "branch": "..." }` or `{ "type": "worktree", "path": "...", "branch": "..." }`. Its singular `threadId` is the Codex conversation that most recently created or changed the issue itself. Recurrence requires a due date.
+
+## Issue relations
+
+Read the anchor issue immediately before adding or removing a relation and use its current version. Relation writes require Codex conversation attribution like every other issue write.
+
+```bash
+taskctl issue relation add ISSUE_ID \
+  --type parent \
+  --issue PARENT_ISSUE_ID \
+  [--thread-id ID] \
+  [--if-version N] \
+  [--json]
+
+taskctl issue relation add ISSUE_ID \
+  --type blocks|blocked_by|related \
+  --issue RELATED_ISSUE_ID \
+  [--thread-id ID] \
+  [--if-version N] \
+  [--json]
+
+taskctl issue relation remove ISSUE_ID \
+  --type parent|blocks|blocked_by|related \
+  --issue RELATED_ISSUE_ID \
+  [--thread-id ID] \
+  [--if-version N] \
+  [--json]
+```
+
+For `--type parent`, `ISSUE_ID` is the child and `PARENT_ISSUE_ID` is its parent. Adding another parent replaces the child's current parent atomically. To add an existing issue as a sub-issue of `LOCAL-6`, anchor the command on the child and pass `--issue LOCAL-6`.
+
+For `blocks`, the anchor issue blocks the related issue. For `blocked_by`, the related issue blocks the anchor. `related` is symmetric. Self-relations, duplicates, parent cycles, and relations between different projects are rejected.
+
+## Issue comments
+
+Use the issue id to read or append comments. Comment updates and deletes require the latest comment `version` returned by `comment list`.
+
+```bash
+taskctl comment list ISSUE_ID [--json]
+taskctl comment add ISSUE_ID --body TEXT [--thread-id ID] [--json]
+taskctl comment update COMMENT_ID --body TEXT --if-version N [--thread-id ID] [--json]
+taskctl comment delete COMMENT_ID --if-version N [--thread-id ID] [--json]
+```
+
+Each comment JSON object independently records the most recent conversation that created or changed that comment as `threadId`. Comment operations never change the parent issue's `threadId`.
+
+## Download inline images
+
+Issue descriptions and comments may contain inline images at exact positions in their Markdown:
+
+```markdown
+![alt text](/api/attachments/ATTACHMENT_ID/content)
+```
+
+Download an inline image to an explicit local path before inspecting it:
+
+```bash
+taskctl attachment download ATTACHMENT_ID --output PATH [--json]
+```
+
+The command writes the response body as binary data and returns the absolute output path, content type, and size in its JSON result. Choose the output filename yourself; `taskctl` does not infer or append an extension.
diff --git a/apps/codex-taskboard/test/actor-identity.test.mjs b/apps/codex-taskboard/test/actor-identity.test.mjs
new file mode 100644
index 000000000..79ff700d1
--- /dev/null
+++ b/apps/codex-taskboard/test/actor-identity.test.mjs
@@ -0,0 +1,84 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+const typesSource = await readFile(new URL("../web/src/types.ts", import.meta.url), "utf8");
+const detailSource = await readFile(new URL("../web/src/components/TaskDetail.tsx", import.meta.url), "utf8");
+const avatarSource = await readFile(new URL("../web/src/components/ActorAvatar.tsx", import.meta.url), "utf8");
+const apiSource = await readFile(new URL("../web/src/api.ts", import.meta.url), "utf8");
+const appSource = await readFile(new URL("../web/src/App.tsx", import.meta.url), "utf8");
+const injectSource = await readFile(new URL("../inject/codex-taskboard.user.js", import.meta.url), "utf8");
+const styles = await readFile(new URL("../web/src/styles.css", import.meta.url), "utf8");
+
+test("task and comment contracts expose persisted user or agent identities", () => {
+  assert.match(typesSource, /export type ActorType = "user" \| "agent"/);
+  assert.match(typesSource, /export interface ActorIdentity/);
+  assert.match(typesSource, /avatarUrl: string \| null/);
+  assert.match(typesSource, /creatorType: ActorType/);
+  assert.match(typesSource, /creatorId: string/);
+  assert.match(typesSource, /creatorName: string/);
+  assert.match(typesSource, /creatorAvatarUrl: string \| null/);
+  assert.match(typesSource, /authorType: ActorType/);
+  assert.match(typesSource, /authorId: string/);
+  assert.match(typesSource, /authorName: string/);
+  assert.match(typesSource, /authorAvatarUrl: string \| null/);
+});
+
+test("issue activity renders distinct avatars, IDs, and styles for users and agents", () => {
+  assert.match(avatarSource, /function ActorAvatar/);
+  assert.match(avatarSource, /actor-avatar-\$\{actor\.type\}/);
+  assert.match(avatarSource, /actor\.type === "agent"/);
+  assert.match(avatarSource, /className="actor-avatar-image actor-avatar-agent-image"/);
+  assert.match(avatarSource, /src="\/codex-agent-logo\.png"/);
+  assert.match(avatarSource, /actor\.avatarUrl/);
+  assert.match(detailSource, /currentTask\.creatorType/);
+  assert.match(detailSource, /currentTask\.creatorId/);
+  assert.match(detailSource, /currentTask\.creatorAvatarUrl/);
+  assert.match(detailSource, /comment\.authorType/);
+  assert.match(detailSource, /comment\.authorId/);
+  assert.match(detailSource, /comment\.authorAvatarUrl/);
+  assert.match(detailSource, /currentUser\.name/);
+  assert.match(detailSource, /currentUser\.id/);
+  assert.match(detailSource, /className="actor-id"/);
+  assert.match(styles, /\.actor-avatar-agent/);
+  assert.match(styles, /\.actor-avatar-user/);
+  assert.match(styles, /\.actor-avatar-image/);
+  assert.match(
+    styles,
+    /\.actor-avatar-agent\s*\{[^}]*overflow:\s*visible;[^}]*border:\s*0;[^}]*border-radius:\s*0;[^}]*background:\s*transparent;/s,
+  );
+  assert.match(styles, /\.actor-avatar-agent-image\s*\{[^}]*object-fit:\s*contain;/s);
+  assert.doesNotMatch(styles, /\.comment-entry\.is-agent \.comment-card/);
+  assert.match(styles, /\.actor-id/);
+});
+
+test("agent avatar asset is a transparent PNG logo", async () => {
+  const logo = await readFile(new URL("../web/public/codex-agent-logo.png", import.meta.url));
+  assert.deepEqual([...logo.subarray(0, 8)], [137, 80, 78, 71, 13, 10, 26, 10]);
+  assert.equal(logo[25], 6);
+});
+
+test("comment metadata separators never become avatar content", () => {
+  assert.match(detailSource, /className="comment-edited"/);
+  assert.doesNotMatch(styles, /\.comment-header > span(?::before)?/);
+  assert.match(
+    styles,
+    /\.comment-header \.comment-edited::before\s*\{[^}]*content:\s*"·"/s,
+  );
+  assert.match(
+    styles,
+    /\.actor-avatar-image\s*\{[^}]*display:\s*block;[^}]*width:\s*100%;[^}]*height:\s*100%/s,
+  );
+});
+
+test("Codex host identity is forwarded to user-authored taskboard mutations", () => {
+  assert.match(injectSource, /function readCodexUser\(\)/);
+  assert.match(injectSource, /cdn\.auth0\.com\/avatars/);
+  assert.match(injectSource, /user: readCodexUser\(\)/);
+  assert.match(typesSource, /user\?: ActorIdentity/);
+  assert.match(apiSource, /export function setCurrentUserActor/);
+  assert.match(apiSource, /X-Taskboard-User-Id/);
+  assert.match(apiSource, /X-Taskboard-User-Name/);
+  assert.match(apiSource, /X-Taskboard-User-Avatar/);
+  assert.match(appSource, /setCurrentUserActor\(payload\.user\)/);
+});
diff --git a/apps/codex-taskboard/test/ai-chat-api.test.mjs b/apps/codex-taskboard/test/ai-chat-api.test.mjs
new file mode 100644
index 000000000..a66cc2a4f
--- /dev/null
+++ b/apps/codex-taskboard/test/ai-chat-api.test.mjs
@@ -0,0 +1,176 @@
+import assert from "node:assert/strict";
+import { test } from "node:test";
+
+import {
+  createAiChatThread,
+  deleteAiChatThread,
+  getAiChatCatalog,
+  getAiChatThread,
+  interruptAiChatRun,
+  listAiChatThreads,
+  startAiChatTurn,
+  subscribeAiChatThread,
+  updateAiChatThread,
+} from "../web/src/api.ts";
+
+const thread = {
+  id: "thread-1",
+  title: "LOCAL-103",
+  status: "idle",
+  origin: {
+    projectId: "project / one",
+    projectName: "Project One",
+    workspacePath: "/never/render/or/send",
+    issueId: "issue-1",
+    issueIdentifier: "LOCAL-103",
+  },
+  codexThreadId: null,
+  model: "codex-real",
+  reasoningEffort: "high",
+  sandbox: "read-only",
+  createdAt: "2026-07-27T00:00:00.000Z",
+  updatedAt: "2026-07-27T00:00:00.000Z",
+  currentRun: null,
+};
+
+function json(body, status = 200) {
+  return new Response(JSON.stringify(body), {
+    status,
+    headers: { "Content-Type": "application/json" },
+  });
+}
+
+test("local AI API client follows the fixed catalog, thread, turn and interrupt contract", async () => {
+  const previousFetch = globalThis.fetch;
+  const calls = [];
+  globalThis.fetch = async (path, init = {}) => {
+    calls.push({ path, init });
+    if (String(path).startsWith("/api/local/ai/catalog")) {
+      return json({
+        models: [{
+          slug: "codex-real",
+          displayName: "Codex Real",
+          description: "Local catalog",
+          defaultReasoningEffort: "high",
+          supportedReasoningEfforts: ["high"],
+          serviceTiers: [],
+        }],
+        skills: [{ id: "real-skill", label: "Real Skill", scope: "user" }],
+        sandboxes: ["read-only", "workspace-write", "danger-full-access"],
+      });
+    }
+    if (path === "/api/local/ai/threads" && !init.method) return json({ threads: [thread] });
+    if (path === "/api/local/ai/threads" && init.method === "POST") return json({ thread });
+    if (path === "/api/local/ai/threads/thread-1" && !init.method) {
+      return json({ thread, events: [], runs: [] });
+    }
+    if (path === "/api/local/ai/threads/thread-1" && init.method === "PATCH") return json({ thread });
+    if (path === "/api/local/ai/threads/thread-1" && init.method === "DELETE") {
+      return new Response(null, { status: 204 });
+    }
+    if (path === "/api/local/ai/threads/thread-1/turns") {
+      return json({ run: { id: "run-1", threadId: "thread-1", status: "running" } }, 202);
+    }
+    if (path === "/api/local/ai/runs/run-1/interrupt") {
+      return json({ run: { id: "run-1", threadId: "thread-1", status: "interrupted" } });
+    }
+    throw new Error(`Unexpected request ${String(path)}`);
+  };
+
+  try {
+    const catalog = await getAiChatCatalog("project / one");
+    assert.equal(catalog.models[0].slug, "codex-real");
+    assert.equal(calls.at(-1).path, "/api/local/ai/catalog?projectId=project%20%2F%20one");
+
+    assert.equal((await listAiChatThreads())[0].id, "thread-1");
+    await createAiChatThread({ projectId: "project / one", issueId: "issue-1" });
+    assert.deepEqual(JSON.parse(calls.at(-1).init.body), {
+      projectId: "project / one",
+      issueId: "issue-1",
+    });
+
+    assert.equal((await getAiChatThread("thread-1")).thread.id, "thread-1");
+    await updateAiChatThread("thread-1", {
+      model: "codex-real",
+      reasoningEffort: "high",
+      sandbox: "workspace-write",
+    });
+    assert.deepEqual(JSON.parse(calls.at(-1).init.body), {
+      model: "codex-real",
+      reasoningEffort: "high",
+      sandbox: "workspace-write",
+    });
+
+    await deleteAiChatThread("thread-1");
+    assert.equal(calls.at(-1).init.method, "DELETE");
+
+    await startAiChatTurn("thread-1", {
+      message: "公开的用户消息",
+      skillIds: ["real-skill"],
+      dangerFullAccessConfirmed: true,
+    });
+    const turnBody = JSON.parse(calls.at(-1).init.body);
+    assert.deepEqual(turnBody, {
+      message: "公开的用户消息",
+      skillIds: ["real-skill"],
+      dangerFullAccessConfirmed: true,
+    });
+    assert.equal("workspacePath" in turnBody, false);
+    assert.equal("model" in turnBody, false);
+    assert.equal("hiddenPrompt" in turnBody, false);
+
+    assert.equal((await interruptAiChatRun("run-1")).status, "interrupted");
+  } finally {
+    globalThis.fetch = previousFetch;
+  }
+});
+
+test("aborted catalog requests preserve AbortError instead of reporting a service outage", async () => {
+  const previousFetch = globalThis.fetch;
+  const abortError = new DOMException("The operation was aborted", "AbortError");
+  globalThis.fetch = async () => {
+    throw abortError;
+  };
+
+  try {
+    await assert.rejects(
+      () => getAiChatCatalog("project-1"),
+      (error) => error === abortError,
+    );
+  } finally {
+    globalThis.fetch = previousFetch;
+  }
+});
+
+test("thread event subscription listens only for public snapshot hints and closes cleanly", () => {
+  const PreviousEventSource = globalThis.EventSource;
+  const listeners = new Map();
+  let openedUrl = "";
+  let closed = false;
+  globalThis.EventSource = class {
+    constructor(url) {
+      openedUrl = url;
+    }
+
+    addEventListener(type, listener) {
+      listeners.set(type, listener);
+    }
+
+    close() {
+      closed = true;
+    }
+  };
+
+  try {
+    const hints = [];
+    const unsubscribe = subscribeAiChatThread("thread / 1", (type) => hints.push(type));
+    assert.equal(openedUrl, "/api/local/ai/threads/thread%20%2F%201/events");
+    listeners.get("ai.event")();
+    listeners.get("ai.run")();
+    assert.deepEqual(hints, ["ai.event", "ai.run"]);
+    unsubscribe();
+    assert.equal(closed, true);
+  } finally {
+    globalThis.EventSource = PreviousEventSource;
+  }
+});
diff --git a/apps/codex-taskboard/test/ai-chat-database.test.mjs b/apps/codex-taskboard/test/ai-chat-database.test.mjs
new file mode 100644
index 000000000..8d27bf6b7
--- /dev/null
+++ b/apps/codex-taskboard/test/ai-chat-database.test.mjs
@@ -0,0 +1,206 @@
+import assert from "node:assert/strict";
+import { mkdtemp, rm } from "node:fs/promises";
+import os from "node:os";
+import path from "node:path";
+import { test } from "node:test";
+
+import { TaskboardDatabase } from "../server/database.mjs";
+
+async function createFixture() {
+  const directory = await mkdtemp(path.join(os.tmpdir(), "taskboard-ai-database-"));
+  const filename = path.join(directory, "taskboard.sqlite");
+  const database = new TaskboardDatabase(filename);
+  return {
+    database,
+    directory,
+    filename,
+    async close() {
+      this.database.close();
+      await rm(directory, { recursive: true, force: true });
+    },
+  };
+}
+
+test("AI chat persistence stores threads, runs, and visible events without hidden prompt fields", async () => {
+  const fixture = await createFixture();
+  try {
+    const thread = fixture.database.createAiChatThread({
+      id: "thread-1",
+      title: "New conversation",
+      status: "idle",
+      origin: {
+        projectId: "local",
+        projectName: "Local",
+        workspacePath: "/tmp/project",
+        issueId: "task-1",
+        issueIdentifier: "LOCAL-1",
+      },
+      codexThreadId: null,
+      model: "gpt-real",
+      reasoningEffort: "high",
+      sandbox: "workspace-write",
+    });
+    assert.equal(thread.origin.issueIdentifier, "LOCAL-1");
+    assert.equal(thread.currentRun, null);
+
+    const run = fixture.database.createAiChatRun({
+      id: "run-1",
+      threadId: thread.id,
+      status: "running",
+    });
+    fixture.database.insertAiChatEvent({
+      id: "event-1",
+      threadId: thread.id,
+      runId: run.id,
+      type: "agent_message",
+      role: "assistant",
+      content: "Visible answer",
+      data: { status: "completed" },
+    });
+    fixture.database.updateAiChatThread(thread.id, {
+      status: "running",
+      codexThreadId: "codex-thread-1",
+    });
+
+    assert.equal(fixture.database.getAiChatThread(thread.id).currentRun.id, run.id);
+    assert.equal(fixture.database.listAiChatThreads()[0].codexThreadId, "codex-thread-1");
+    assert.deepEqual(fixture.database.listAiChatEvents(thread.id).map((event) => event.content), [
+      "Visible answer",
+    ]);
+    assert.equal(fixture.database.listAiChatRuns(thread.id)[0].status, "running");
+
+    for (const table of ["ai_chat_threads", "ai_chat_runs", "ai_chat_events"]) {
+      const columns = fixture.database.database.prepare(`PRAGMA table_info(${table})`).all();
+      assert.equal(
+        columns.some((column) => /prompt|raw/i.test(column.name)),
+        false,
+        `${table} must not persist hidden prompts or raw Codex JSONL`,
+      );
+    }
+  } finally {
+    await fixture.close();
+  }
+});
+
+test("opening the database interrupts abandoned runs and preserves resumable Codex thread ids", async () => {
+  const fixture = await createFixture();
+  fixture.database.createAiChatThread({
+    id: "thread-1",
+    title: "New conversation",
+    status: "running",
+    origin: {
+      projectId: "local",
+      projectName: "Local",
+      workspacePath: "/tmp/project",
+    },
+    codexThreadId: "codex-thread-1",
+    model: "gpt-real",
+    reasoningEffort: "medium",
+    sandbox: "read-only",
+  });
+  fixture.database.createAiChatRun({
+    id: "run-1",
+    threadId: "thread-1",
+    status: "running",
+  });
+  fixture.database.close();
+
+  const reopened = new TaskboardDatabase(fixture.filename);
+  fixture.database = reopened;
+  try {
+    assert.equal(reopened.getAiChatRun("run-1").status, "interrupted");
+    assert.equal(reopened.getAiChatRun("run-1").finishedAt === null, false);
+    assert.equal(reopened.getAiChatThread("thread-1").codexThreadId, "codex-thread-1");
+    assert.equal(reopened.getAiChatThread("thread-1").status, "idle");
+    assert.equal(reopened.getAiChatThread("thread-1").currentRun, null);
+  } finally {
+    await fixture.close();
+  }
+});
+
+test("deleting an AI chat thread removes its runs and visible events", async () => {
+  const fixture = await createFixture();
+  try {
+    fixture.database.createAiChatThread({
+      id: "thread-1",
+      title: "New conversation",
+      status: "idle",
+      origin: {
+        projectId: "local",
+        projectName: "Local",
+        workspacePath: "/tmp/project",
+      },
+      codexThreadId: null,
+      model: "gpt-real",
+      reasoningEffort: "medium",
+      sandbox: "read-only",
+    });
+    fixture.database.createAiChatRun({
+      id: "run-1",
+      threadId: "thread-1",
+      status: "completed",
+      finishedAt: new Date().toISOString(),
+    });
+    fixture.database.insertAiChatEvent({
+      id: "event-1",
+      threadId: "thread-1",
+      runId: "run-1",
+      type: "agent_message",
+      role: "assistant",
+      content: "Visible answer",
+    });
+
+    fixture.database.deleteAiChatThread("thread-1");
+
+    assert.equal(fixture.database.getAiChatThread("thread-1"), null);
+    assert.equal(fixture.database.getAiChatRun("run-1"), null);
+    assert.equal(
+      fixture.database.database.prepare("SELECT COUNT(*) AS count FROM ai_chat_events").get().count,
+      0,
+    );
+  } finally {
+    await fixture.close();
+  }
+});
+
+test("AI chat events with the same timestamp retain SQLite insertion order", async () => {
+  const fixture = await createFixture();
+  try {
+    fixture.database.createAiChatThread({
+      id: "thread-1",
+      title: "New conversation",
+      origin: {
+        projectId: "local",
+        projectName: "Local",
+        workspacePath: "/tmp/project",
+      },
+      model: "gpt-real",
+      reasoningEffort: "medium",
+      sandbox: "read-only",
+    });
+    const createdAt = "2026-07-27T12:00:00.000Z";
+    fixture.database.insertAiChatEvent({
+      id: "z-first",
+      threadId: "thread-1",
+      type: "agent_message",
+      role: "assistant",
+      content: "first",
+      createdAt,
+    });
+    fixture.database.insertAiChatEvent({
+      id: "a-second",
+      threadId: "thread-1",
+      type: "agent_message",
+      role: "assistant",
+      content: "second",
+      createdAt,
+    });
+
+    assert.deepEqual(
+      fixture.database.listAiChatEvents("thread-1").map((event) => event.id),
+      ["z-first", "a-second"],
+    );
+  } finally {
+    await fixture.close();
+  }
+});
diff --git a/apps/codex-taskboard/test/ai-chat-runner.test.mjs b/apps/codex-taskboard/test/ai-chat-runner.test.mjs
new file mode 100644
index 000000000..5ec4e691d
--- /dev/null
+++ b/apps/codex-taskboard/test/ai-chat-runner.test.mjs
@@ -0,0 +1,423 @@
+import assert from "node:assert/strict";
+import { chmod, mkdtemp, mkdir, readFile, realpath, rm, writeFile } from "node:fs/promises";
+import os from "node:os";
+import path from "node:path";
+import { test } from "node:test";
+
+import { TaskboardDatabase } from "../server/database.mjs";
+import { AiChatService } from "../server/ai-chat.mjs";
+import { normalizeCodexEvent } from "../server/ai-chat-process.mjs";
+
+async function waitFor(predicate, timeout = 4_000) {
+  const deadline = Date.now() + timeout;
+  while (Date.now() < deadline) {
+    const value = await predicate();
+    if (value) return value;
+    await new Promise((resolve) => setTimeout(resolve, 20));
+  }
+  throw new Error("Timed out waiting for condition");
+}
+
+test("normalized item events retain a bounded public item id", () => {
+  const itemId = "x".repeat(70_000);
+  const normalized = normalizeCodexEvent({
+    type: "item.updated",
+    item: {
+      id: itemId,
+      type: "command_execution",
+      command: "npm test",
+      status: "in_progress",
+    },
+  });
+
+  assert.equal(normalized.data.itemId, itemId.slice(0, 65_536));
+});
+
+async function createFixture() {
+  const directory = await mkdtemp(path.join(os.tmpdir(), "taskboard-ai-runner-"));
+  const workspacePath = path.join(directory, "workspace");
+  const otherWorkspacePath = path.join(directory, "other-workspace");
+  await Promise.all([mkdir(workspacePath), mkdir(otherWorkspacePath)]);
+  const [workspace, otherWorkspace] = await Promise.all([
+    realpath(workspacePath),
+    realpath(otherWorkspacePath),
+  ]);
+  const capturePath = path.join(directory, "capture.jsonl");
+  const descendantPath = path.join(directory, "descendant-alive");
+  const executable = path.join(directory, "fake-codex.mjs");
+  await writeFile(executable, `#!/usr/bin/env node
+import { appendFileSync } from "node:fs";
+import { spawn } from "node:child_process";
+const args = process.argv.slice(2);
+if (args[0] === "debug" && args[1] === "models") {
+  if (args.length !== 2) process.exit(2);
+  process.stdout.write(JSON.stringify({models:[{
+    slug:"gpt-real", display_name:"GPT Real", description:"Real fixture",
+    default_reasoning_level:"medium",
+    supported_reasoning_levels:[{effort:"low"},{effort:"medium"},{effort:"high"}],
+    service_tiers:[{id:"priority",name:"Fast",description:"fixture"}]
+  }]}));
+  process.exit(0);
+}
+if (args[0] === "app-server") {
+  process.stdin.setEncoding("utf8");
+  let buffer = "";
+  process.stdin.on("data", (chunk) => {
+    buffer += chunk;
+    let index;
+    while ((index = buffer.indexOf("\\n")) >= 0) {
+      const line = buffer.slice(0, index); buffer = buffer.slice(index + 1);
+      if (!line.trim()) continue;
+      const message = JSON.parse(line);
+      if (message.id === 1) process.stdout.write('{"id":1,"result":{"platformFamily":"unix"}}\\n');
+      if (message.id === 2) process.stdout.write('{"id":2,"result":{"data":[{"skills":[{"name":"real-skill","enabled":true,"scope":"repo","interface":{"displayName":"Real Skill"}},{"name":"disabled","enabled":false,"scope":"user"}]}]}}\\n');
+    }
+  });
+} else if (args[0] === "exec") {
+  process.stdin.setEncoding("utf8");
+  let prompt = "";
+  process.stdin.on("data", (chunk) => { prompt += chunk; });
+  process.stdin.on("end", () => {
+    appendFileSync(process.env.FAKE_CAPTURE_PATH, JSON.stringify({args,prompt}) + "\\n");
+    const emit = (value) => process.stdout.write(JSON.stringify(value) + "\\n");
+    if (!args.includes("resume")) emit({type:"thread.started",thread_id:"codex-thread-1"});
+    emit({type:"turn.started"});
+    if (prompt.includes("MALFORMED_STUBBORN") || prompt.includes("CALLBACK_FATAL_STUBBORN")) {
+      spawn(process.execPath, [
+        "-e",
+        'process.on("SIGTERM", () => {}); setTimeout(() => require("node:fs").writeFileSync(process.env.FAKE_DESCENDANT_PATH, "alive"), 300); setInterval(() => {}, 1000)',
+      ], {env:process.env,stdio:"ignore"});
+      process.on("SIGTERM", () => {});
+      setInterval(() => {}, 1000);
+      if (prompt.includes("CALLBACK_FATAL_STUBBORN")) {
+        emit({type:"thread.started",thread_id:"unexpected-thread"});
+      } else {
+        process.stdout.write("{not-json}\\n");
+      }
+      return;
+    }
+    if (prompt.includes("MALFORMED")) {
+      process.stdout.write("{not-json}\\n");
+      return;
+    }
+    emit({type:"item.completed",item:{type:"reasoning",text:"SECRET REASONING"}});
+    emit({type:"item.completed",item:{type:"agent_message",text:"Visible answer"}});
+    emit({type:"item.completed",item:{type:"command_execution",command:"npm test",status:"completed",exit_code:0,aggregated_output:"ok"}});
+    if (prompt.includes("TURN_FAILED_ZERO")) {
+      emit({type:"turn.failed",error:{message:"Protocol turn failed"}});
+      return;
+    }
+    if (prompt.includes("ROOT_ERROR_ZERO")) {
+      emit({type:"error",message:"Protocol root error"});
+      return;
+    }
+    if (prompt.includes("NO_TERMINAL")) return;
+    if (prompt.includes("ITEM_ERROR")) {
+      emit({type:"item.completed",item:{id:"item-error-1",type:"error",message:"Recoverable item error"}});
+    }
+    if (prompt.includes("WAIT")) {
+      const timer = setTimeout(() => { emit({type:"turn.completed",usage:{input_tokens:1,output_tokens:2}}); }, 800);
+      process.on("SIGTERM", () => { clearTimeout(timer); process.exit(143); });
+      return;
+    }
+    if (prompt.includes("FAIL")) process.exit(7);
+    emit({type:"turn.completed",usage:{input_tokens:1,output_tokens:2}});
+  });
+}
+`);
+  await chmod(executable, 0o755);
+
+  const codexStatePath = path.join(directory, "codex-state.json");
+  await writeFile(codexStatePath, JSON.stringify({
+    "local-projects": {
+      project: { rootPaths: [workspace] },
+      other: { rootPaths: [otherWorkspace] },
+    },
+  }));
+  const databasePath = path.join(directory, "taskboard.sqlite");
+  const database = new TaskboardDatabase(databasePath);
+  database.createProject({ id: "project", name: "Project", workspacePath: null });
+  database.createProject({ id: "other", name: "Other", workspacePath: null });
+  const service = new AiChatService({
+    database,
+    codexExecutable: executable,
+    codexStatePath,
+    manageTaskboardSkillPath: "/fixture/manage-taskboard/SKILL.md",
+    processEnv: {
+      ...process.env,
+      FAKE_CAPTURE_PATH: capturePath,
+      FAKE_DESCENDANT_PATH: descendantPath,
+    },
+    killGraceMs: 50,
+  });
+  return {
+    capturePath,
+    database,
+    databasePath,
+    descendantPath,
+    directory,
+    otherWorkspace,
+    service,
+    workspace,
+    async close() {
+      await this.service.close();
+      this.database.close();
+      for (let attempt = 0; attempt < 20; attempt += 1) {
+        try {
+          await rm(directory, { recursive: true, force: true });
+          return;
+        } catch (error) {
+          if (!["EBUSY", "EPERM"].includes(error?.code) || attempt === 19) {
+            throw error;
+          }
+          await new Promise((resolve) => setTimeout(resolve, 50));
+        }
+      }
+    },
+  };
+}
+
+test("Codex turns use stdin, explicit resume ids, server-owned cwd and sanitized visible events", async () => {
+  const fixture = await createFixture();
+  try {
+    const catalog = await fixture.service.getCatalog("project");
+    assert.deepEqual(catalog.models, [{
+      slug: "gpt-real",
+      displayName: "GPT Real",
+      description: "Real fixture",
+      defaultReasoningEffort: "medium",
+      supportedReasoningEfforts: ["low", "medium", "high"],
+      serviceTiers: [{ id: "priority", name: "Fast" }],
+    }]);
+    assert.deepEqual(catalog.skills, [{
+      id: "real-skill",
+      label: "Real Skill",
+      description: "",
+      path: "",
+      scope: "repo",
+    }]);
+
+    const thread = await fixture.service.createThread({
+      projectId: "project",
+      model: "gpt-real",
+      reasoningEffort: "high",
+      sandbox: "workspace-write",
+    });
+    assert.equal(thread.origin.workspacePath, fixture.workspace);
+
+    const first = await fixture.service.startTurn(thread.id, {
+      message: "HIDDEN_SENTINEL \uFFFC first",
+      skillIds: ["real-skill"],
+    });
+    await waitFor(() => fixture.service.getRun(first.id)?.status !== "running");
+    const second = await fixture.service.startTurn(thread.id, { message: "second" });
+    await waitFor(() => fixture.service.getRun(second.id)?.status !== "running");
+
+    const captures = (await readFile(fixture.capturePath, "utf8")).trim().split("\n").map(JSON.parse);
+    assert.deepEqual(captures[0].args, [
+      "exec", "--json", "--color", "never",
+      "-C", fixture.workspace,
+      "-s", "workspace-write",
+      "-c", 'approval_policy="on-request"',
+      "-c", 'approvals_reviewer="auto_review"',
+      "--add-dir", fixture.otherWorkspace,
+      "-m", "gpt-real",
+      "-c", 'model_reasoning_effort="high"',
+      "-",
+    ]);
+    assert.equal(captures[0].args.join(" ").includes("HIDDEN_SENTINEL"), false);
+    assert.match(captures[0].prompt, /\[\$manage-taskboard\]\(\/fixture\/manage-taskboard\/SKILL\.md\) e-taskboard/);
+    assert.match(captures[0].prompt, /\$real-skill/);
+    assert.match(captures[0].prompt, /HIDDEN_SENTINEL \[\$real-skill\]\(\) first/);
+    assert.deepEqual(captures[1].args, [
+      "exec", "--json", "--color", "never",
+      "-C", fixture.workspace,
+      "-s", "workspace-write",
+      "-c", 'approval_policy="on-request"',
+      "-c", 'approvals_reviewer="auto_review"',
+      "--add-dir", fixture.otherWorkspace,
+      "-m", "gpt-real",
+      "-c", 'model_reasoning_effort="high"',
+      "resume", "codex-thread-1", "-",
+    ]);
+    assert.equal(captures[1].args.includes("--last"), false);
+
+    const snapshot = fixture.service.getThreadSnapshot(thread.id);
+    assert.equal(snapshot.thread.codexThreadId, "codex-thread-1");
+    assert.equal(snapshot.events.some((event) => event.content?.includes("SECRET REASONING")), false);
+    assert.equal(snapshot.events.some((event) => event.content === "Visible answer"), true);
+    assert.equal(snapshot.events.some((event) => event.type === "command_execution"), true);
+    const serialized = JSON.stringify(snapshot);
+    assert.equal(serialized.includes("HIDDEN_SENTINEL"), true);
+    assert.equal(serialized.includes("<taskboard_context>"), false);
+    const persisted = JSON.stringify(
+      fixture.database.database.prepare("SELECT * FROM ai_chat_events").all(),
+    );
+    assert.equal(persisted.includes("<taskboard_context>"), false);
+    assert.equal(persisted.includes("SECRET REASONING"), false);
+  } finally {
+    await fixture.close();
+  }
+});
+
+test("same-thread turns are locked, different threads run concurrently, failures and interrupts settle", async () => {
+  const fixture = await createFixture();
+  try {
+    const firstThread = await fixture.service.createThread({ projectId: "project" });
+    const secondThread = await fixture.service.createThread({ projectId: "other" });
+    const waiting = await fixture.service.startTurn(firstThread.id, { message: "WAIT" });
+    await assert.rejects(
+      fixture.service.startTurn(firstThread.id, { message: "must reject" }),
+      (error) => error.code === "THREAD_BUSY",
+    );
+    const parallel = await fixture.service.startTurn(secondThread.id, { message: "normal" });
+    await waitFor(() => fixture.service.getRun(parallel.id)?.status === "completed");
+    const interrupted = await fixture.service.interrupt(waiting.id);
+    assert.equal(interrupted.id, waiting.id);
+    await waitFor(() => fixture.service.getRun(waiting.id)?.status === "interrupted");
+
+    const failed = await fixture.service.startTurn(firstThread.id, { message: "FAIL" });
+    await waitFor(() => fixture.service.getRun(failed.id)?.status === "failed");
+    assert.equal(fixture.service.getRun(failed.id).exitCode, 7);
+    assert.equal(
+      fixture.service.getThreadSnapshot(firstThread.id).events.some(
+        (event) => event.role === "error" && event.content.includes("code 7"),
+      ),
+      true,
+    );
+  } finally {
+    await fixture.close();
+  }
+});
+
+test("malformed Codex JSONL fails the run", async () => {
+  const fixture = await createFixture();
+  try {
+    const thread = await fixture.service.createThread({ projectId: "project" });
+    const run = await fixture.service.startTurn(thread.id, { message: "MALFORMED" });
+    await waitFor(() => fixture.service.getRun(run.id)?.status === "failed");
+
+    const failed = fixture.service.getRun(run.id);
+    assert.equal(failed.error, "Codex emitted malformed JSONL");
+    assert.equal(
+      fixture.service.getThreadSnapshot(thread.id).events.some(
+        (event) => event.role === "error"
+          && event.content === "Codex emitted malformed JSONL",
+      ),
+      true,
+    );
+  } finally {
+    await fixture.close();
+  }
+});
+
+test("parser and event callback failures kill a SIGTERM-resistant process group", async () => {
+  const fixture = await createFixture();
+  try {
+    for (const [message, expectedError] of [
+      ["MALFORMED_STUBBORN", "Codex emitted malformed JSONL"],
+      ["CALLBACK_FATAL_STUBBORN", "Codex returned an unexpected thread id"],
+    ]) {
+      await rm(fixture.descendantPath, { force: true });
+      const thread = await fixture.service.createThread({ projectId: "project" });
+      const run = await fixture.service.startTurn(thread.id, { message });
+      await waitFor(() => fixture.service.getRun(run.id).status === "failed", 700);
+      assert.equal(fixture.service.getRun(run.id).error, expectedError);
+      await new Promise((resolve) => setTimeout(resolve, 350));
+      await assert.rejects(readFile(fixture.descendantPath), (error) => error.code === "ENOENT");
+    }
+  } finally {
+    await fixture.close();
+  }
+});
+
+test("protocol terminal events determine run success and item errors remain non-fatal", async () => {
+  const fixture = await createFixture();
+  try {
+    for (const [message, expectedStatus] of [
+      ["TURN_FAILED_ZERO", "failed"],
+      ["ROOT_ERROR_ZERO", "failed"],
+      ["NO_TERMINAL", "failed"],
+      ["ITEM_ERROR", "completed"],
+    ]) {
+      const thread = await fixture.service.createThread({ projectId: "project" });
+      const run = await fixture.service.startTurn(thread.id, { message });
+      await waitFor(() => fixture.service.getRun(run.id).status !== "running");
+      assert.equal(fixture.service.getRun(run.id).status, expectedStatus, message);
+    }
+  } finally {
+    await fixture.close();
+  }
+});
+
+test("startTurn revalidates the latest danger sandbox and persisted model settings", async () => {
+  const fixture = await createFixture();
+  try {
+    for (const scenario of [
+      {
+        changes: { sandbox: "danger-full-access" },
+        expectedCode: "DANGER_CONFIRMATION_REQUIRED",
+      },
+      {
+        changes: { model: "retired-model" },
+        expectedCode: "INVALID_MODEL",
+      },
+      {
+        changes: { reasoningEffort: "ultra" },
+        expectedCode: "INVALID_REASONING_EFFORT",
+      },
+    ]) {
+      const thread = await fixture.service.createThread({ projectId: "project" });
+      const originalGetCatalog = fixture.service.getCatalog.bind(fixture.service);
+      let releaseCatalog;
+      let catalogRequested = false;
+      const catalogGate = new Promise((resolve) => {
+        releaseCatalog = resolve;
+      });
+      fixture.service.getCatalog = async (...args) => {
+        catalogRequested = true;
+        await catalogGate;
+        return originalGetCatalog(...args);
+      };
+
+      const pending = fixture.service.startTurn(thread.id, { message: "must not spawn" });
+      await waitFor(() => catalogRequested);
+      fixture.database.updateAiChatThread(thread.id, scenario.changes);
+      releaseCatalog();
+      await assert.rejects(pending, (error) => error.code === scenario.expectedCode);
+      assert.equal(fixture.database.listAiChatRuns(thread.id).length, 0);
+      fixture.service.getCatalog = originalGetCatalog;
+    }
+  } finally {
+    await fixture.close();
+  }
+});
+
+test("startup marks abandoned runs interrupted while preserving the Codex thread id", async () => {
+  const fixture = await createFixture();
+  const thread = await fixture.service.createThread({ projectId: "project" });
+  fixture.database.database.prepare(
+    "UPDATE ai_chat_threads SET codex_thread_id = ?, status = 'running' WHERE id = ?",
+  ).run("preserved-session", thread.id);
+  fixture.database.database.prepare(`
+    INSERT INTO ai_chat_runs (
+      id, thread_id, status, exit_code, error, started_at, finished_at
+    ) VALUES ('abandoned', ?, 'running', NULL, NULL, ?, NULL)
+  `).run(thread.id, new Date().toISOString());
+  await fixture.service.close();
+  fixture.database.close();
+  fixture.database = new TaskboardDatabase(fixture.databasePath);
+  const restarted = new AiChatService({
+    database: fixture.database,
+    codexExecutable: path.join(fixture.directory, "fake-codex.mjs"),
+    codexStatePath: path.join(fixture.directory, "codex-state.json"),
+    manageTaskboardSkillPath: "/fixture/manage-taskboard/SKILL.md",
+  });
+  fixture.service = restarted;
+  try {
+    assert.equal(restarted.getRun("abandoned").status, "interrupted");
+    assert.equal(restarted.getThread(thread.id).codexThreadId, "preserved-session");
+  } finally {
+    await fixture.close();
+  }
+});
diff --git a/apps/codex-taskboard/test/ai-chat-server.test.mjs b/apps/codex-taskboard/test/ai-chat-server.test.mjs
new file mode 100644
index 000000000..e140a82ec
--- /dev/null
+++ b/apps/codex-taskboard/test/ai-chat-server.test.mjs
@@ -0,0 +1,342 @@
+import assert from "node:assert/strict";
+import { chmod, mkdtemp, mkdir, realpath, rm, writeFile } from "node:fs/promises";
+import { request as httpRequest } from "node:http";
+import os from "node:os";
+import path from "node:path";
+import { test } from "node:test";
+
+import { createTaskboardServer } from "../server/index.mjs";
+
+const LAN_SHARED_SECRET = "test-taskboard-secret";
+
+async function createServerFixture(host = "127.0.0.1") {
+  const directory = await mkdtemp(path.join(os.tmpdir(), "taskboard-ai-server-"));
+  const workspacePath = path.join(directory, "workspace");
+  await mkdir(workspacePath);
+  const workspace = await realpath(workspacePath);
+  const codexExecutable = path.join(directory, "fake-codex.mjs");
+  await writeFile(codexExecutable, `#!/usr/bin/env node
+const args = process.argv.slice(2);
+if (args[0] === "debug") {
+  process.stdout.write('{"models":[{"slug":"gpt-real","display_name":"GPT Real","description":"","default_reasoning_level":"low","supported_reasoning_levels":[{"effort":"low"},{"effort":"high"}],"service_tiers":[]}]}');
+} else if (args[0] === "app-server") {
+  process.stdin.setEncoding("utf8"); let buffer="";
+  process.stdin.on("data", chunk => { buffer += chunk; let i;
+    while ((i=buffer.indexOf("\\n"))>=0) { const line=buffer.slice(0,i); buffer=buffer.slice(i+1);
+      if (!line.trim()) continue; const message=JSON.parse(line);
+      if (message.id===1) process.stdout.write('{"id":1,"result":{}}\\n');
+      if (message.id===2) process.stdout.write('{"id":2,"result":{"data":[{"skills":[{"name":"real-skill","enabled":true,"scope":"repo","interface":null}]}]}}\\n');
+    }
+  });
+} else {
+  process.stdin.resume();
+  process.stdin.on("end", () => {
+    process.stdout.write('{"type":"thread.started","thread_id":"session-1"}\\n');
+    process.stdout.write('{"type":"item.completed","item":{"type":"agent_message","text":"ok"}}\\n');
+    process.stdout.write('{"type":"turn.completed"}\\n');
+  });
+}
+`);
+  await chmod(codexExecutable, 0o755);
+  const codexStatePath = path.join(directory, "codex-state.json");
+  await writeFile(codexStatePath, JSON.stringify({
+    "local-projects": { local: { rootPaths: [workspace] } },
+  }));
+  const app = createTaskboardServer({
+    dataDirectory: directory,
+    ...(host === "0.0.0.0" ? { sharedSecret: LAN_SHARED_SECRET } : {}),
+    codexExecutable,
+    codexStatePath,
+    skillPath: "/fixture/manage-taskboard/SKILL.md",
+  });
+  const address = await app.listen({ host, port: 0 });
+  return {
+    app,
+    baseUrl: `http://127.0.0.1:${address.port}`,
+    directory,
+    workspace,
+    async close() {
+      await app.close();
+      await rm(directory, {
+        recursive: true,
+        force: true,
+        maxRetries: 20,
+        retryDelay: 50,
+      });
+    },
+  };
+}
+
+function privateLanAddress() {
+  return Object.values(os.networkInterfaces())
+    .flat()
+    .find((entry) => {
+      if (entry?.family !== "IPv4" || entry.internal) return false;
+      const [first, second] = entry.address.split(".").map(Number);
+      return first === 10
+        || (first === 172 && second >= 16 && second <= 31)
+        || (first === 192 && second === 168)
+        || (first === 169 && second === 254);
+    })?.address;
+}
+
+async function requestFrom(address, port, pathname) {
+  return new Promise((resolve, reject) => {
+    const outgoing = httpRequest({
+      host: address,
+      port,
+      path: pathname,
+      headers: {
+        authorization: `Basic ${Buffer.from(`codex:${LAN_SHARED_SECRET}`).toString("base64")}`,
+        host: `${address}:${port}`,
+      },
+    }, (response) => {
+      const chunks = [];
+      response.on("data", (chunk) => chunks.push(chunk));
+      response.on("end", () => resolve({
+        status: response.statusCode,
+        body: JSON.parse(Buffer.concat(chunks).toString("utf8")),
+      }));
+    });
+    outgoing.on("error", reject);
+    outgoing.end();
+  });
+}
+
+async function request(baseUrl, pathname, options = {}) {
+  const response = await fetch(`${baseUrl}${pathname}`, {
+    ...options,
+    headers: { "content-type": "application/json", ...options.headers },
+    body: options.body === undefined ? undefined : JSON.stringify(options.body),
+  });
+  const text = await response.text();
+  return { response, body: text ? JSON.parse(text) : undefined };
+}
+
+test("loopback AI API freezes server-owned origin and rejects injected execution fields", async () => {
+  const fixture = await createServerFixture();
+  try {
+    const meta = await request(fixture.baseUrl, "/api/meta");
+    assert.equal(meta.body.capabilities.localAiChat, true);
+    const catalog = await request(fixture.baseUrl, "/api/local/ai/catalog?projectId=local");
+    assert.equal(catalog.response.status, 200);
+    assert.equal(catalog.body.models[0].slug, "gpt-real");
+    assert.equal(catalog.body.skills[0].id, "real-skill");
+
+    const injected = await request(fixture.baseUrl, "/api/local/ai/threads", {
+      method: "POST",
+      body: { projectId: "local", workspacePath: "/tmp/evil", argv: ["--dangerously-bypass-approvals-and-sandbox"] },
+    });
+    assert.equal(injected.response.status, 400);
+    assert.equal(injected.body.error.code, "UNKNOWN_FIELD");
+
+    const created = await request(fixture.baseUrl, "/api/local/ai/threads", {
+      method: "POST",
+      body: {
+        projectId: "local",
+        model: "gpt-real",
+        reasoningEffort: "high",
+        sandbox: "read-only",
+      },
+    });
+    assert.equal(created.response.status, 201);
+    assert.equal(created.body.thread.origin.workspacePath, fixture.workspace);
+    const threadId = created.body.thread.id;
+
+    const invalidSkill = await request(fixture.baseUrl, `/api/local/ai/threads/${threadId}/turns`, {
+      method: "POST",
+      body: { message: "hello\uFFFC", skillIds: ["invented-skill"] },
+    });
+    assert.equal(invalidSkill.response.status, 400);
+    assert.equal(invalidSkill.body.error.code, "INVALID_SKILL");
+
+    const turn = await request(fixture.baseUrl, `/api/local/ai/threads/${threadId}/turns`, {
+      method: "POST",
+      body: { message: "hello\uFFFC", skillIds: ["real-skill"] },
+    });
+    assert.equal(turn.response.status, 202);
+    assert.equal(turn.body.run.threadId, threadId);
+
+    let snapshot;
+    for (let index = 0; index < 100; index += 1) {
+      snapshot = await request(fixture.baseUrl, `/api/local/ai/threads/${threadId}`);
+      if (snapshot.body.runs[0]?.status !== "running") break;
+      await new Promise((resolve) => setTimeout(resolve, 20));
+    }
+    assert.equal(snapshot.body.thread.codexThreadId, "session-1");
+    assert.equal(snapshot.body.events.some((event) => event.content === "ok"), true);
+  } finally {
+    await fixture.close();
+  }
+});
+
+test("danger-full-access requires confirmation on every turn and thread settings are validated", async () => {
+  const fixture = await createServerFixture();
+  try {
+    const created = await request(fixture.baseUrl, "/api/local/ai/threads", {
+      method: "POST",
+      body: {
+        projectId: "local",
+        model: "gpt-real",
+        reasoningEffort: "low",
+        sandbox: "danger-full-access",
+      },
+    });
+    assert.equal(created.response.status, 201);
+    const threadId = created.body.thread.id;
+    const denied = await request(fixture.baseUrl, `/api/local/ai/threads/${threadId}/turns`, {
+      method: "POST",
+      body: { message: "hello" },
+    });
+    assert.equal(denied.response.status, 400);
+    assert.equal(denied.body.error.code, "DANGER_CONFIRMATION_REQUIRED");
+    const allowed = await request(fixture.baseUrl, `/api/local/ai/threads/${threadId}/turns`, {
+      method: "POST",
+      body: { message: "hello", dangerFullAccessConfirmed: true },
+    });
+    assert.equal(allowed.response.status, 202);
+
+    const invalidModel = await request(fixture.baseUrl, `/api/local/ai/threads/${threadId}`, {
+      method: "PATCH",
+      body: { model: "invented-model", reasoningEffort: "high" },
+    });
+    assert.equal(invalidModel.response.status, 400);
+    assert.equal(invalidModel.body.error.code, "INVALID_MODEL");
+  } finally {
+    await fixture.close();
+  }
+});
+
+test("thread management, interrupt and query contracts stay narrow", async () => {
+  const fixture = await createServerFixture();
+  try {
+    const created = await request(fixture.baseUrl, "/api/local/ai/threads", {
+      method: "POST",
+      body: { projectId: "local", title: "Original" },
+    });
+    const threadId = created.body.thread.id;
+
+    const list = await request(fixture.baseUrl, "/api/local/ai/threads");
+    assert.equal(list.response.status, 200);
+    assert.equal(list.body.threads.some((thread) => thread.id === threadId), true);
+
+    const unknownQuery = await request(fixture.baseUrl, "/api/local/ai/threads?projectId=local");
+    assert.equal(unknownQuery.response.status, 400);
+    assert.equal(unknownQuery.body.error.code, "UNKNOWN_QUERY_PARAMETER");
+
+    const updated = await request(fixture.baseUrl, `/api/local/ai/threads/${threadId}`, {
+      method: "PATCH",
+      body: { title: "Renamed", sandbox: "workspace-write" },
+    });
+    assert.equal(updated.response.status, 200);
+    assert.equal(updated.body.thread.title, "Renamed");
+
+    const interruptedMissing = await request(fixture.baseUrl, "/api/local/ai/runs/missing/interrupt", {
+      method: "POST",
+    });
+    assert.equal(interruptedMissing.response.status, 404);
+
+    const removed = await request(fixture.baseUrl, `/api/local/ai/threads/${threadId}`, {
+      method: "DELETE",
+    });
+    assert.equal(removed.response.status, 204);
+    const missing = await request(fixture.baseUrl, `/api/local/ai/threads/${threadId}`);
+    assert.equal(missing.response.status, 404);
+  } finally {
+    await fixture.close();
+  }
+});
+
+test("local AI routes reject private-LAN clients while ordinary API routes remain available", async (context) => {
+  const address = privateLanAddress();
+  if (!address) {
+    context.skip("No private LAN interface is available");
+    return;
+  }
+  const fixture = await createServerFixture("0.0.0.0");
+  const port = fixture.app.server.address().port;
+  try {
+    const projects = await requestFrom(address, port, "/api/projects");
+    assert.equal(projects.status, 200);
+    const metadata = await requestFrom(address, port, "/api/meta");
+    assert.equal(metadata.status, 200);
+    assert.equal(metadata.body.capabilities.localAiChat, false);
+    const ai = await requestFrom(address, port, "/api/local/ai/threads");
+    assert.equal(ai.status, 403);
+    assert.equal(ai.body.error.code, "LOCAL_AI_LOOPBACK_REQUIRED");
+  } finally {
+    await fixture.close();
+  }
+});
+
+test("AI SSE is live-only and thread snapshots remain the durable source", async () => {
+  const fixture = await createServerFixture();
+  try {
+    const created = await request(fixture.baseUrl, "/api/local/ai/threads", {
+      method: "POST",
+      body: { projectId: "local" },
+    });
+    const threadId = created.body.thread.id;
+    const controller = new AbortController();
+    const response = await fetch(`${fixture.baseUrl}/api/local/ai/threads/${threadId}/events`, {
+      signal: controller.signal,
+    });
+    assert.equal(response.status, 200);
+    const reader = response.body.getReader();
+    let connected = "";
+    while (!connected.includes("event: ai.event")) {
+      const chunk = await reader.read();
+      assert.equal(chunk.done, false);
+      connected += new TextDecoder().decode(chunk.value);
+    }
+    assert.match(connected, /connected/);
+    const turn = await request(fixture.baseUrl, `/api/local/ai/threads/${threadId}/turns`, {
+      method: "POST",
+      body: { message: "hello" },
+    });
+    assert.equal(turn.response.status, 202);
+    let streamed = "";
+    while (!streamed.includes("ai.event")) {
+      const chunk = await reader.read();
+      assert.equal(chunk.done, false);
+      streamed += new TextDecoder().decode(chunk.value);
+    }
+    assert.match(streamed, /event: ai\.(event|run)/);
+    controller.abort();
+  } finally {
+    await fixture.close();
+  }
+});
+
+test("server close stops accepting requests before AI shutdown completes", async () => {
+  const fixture = await createServerFixture();
+  let appClosed = false;
+  try {
+    let releaseAiClose;
+    const aiCloseGate = new Promise((resolve) => {
+      releaseAiClose = resolve;
+    });
+    fixture.app.aiChat.close = () => aiCloseGate;
+
+    const closing = fixture.app.close();
+    await new Promise((resolve) => setTimeout(resolve, 20));
+    const acceptedDuringClose = await fetch(`${fixture.baseUrl}/health`)
+      .then(() => true, () => false);
+    releaseAiClose();
+    await closing;
+    appClosed = true;
+
+    assert.equal(acceptedDuringClose, false);
+  } finally {
+    if (appClosed) {
+      await rm(fixture.directory, {
+        recursive: true,
+        force: true,
+        maxRetries: 20,
+        retryDelay: 50,
+      });
+    } else {
+      await fixture.close();
+    }
+  }
+});
diff --git a/apps/codex-taskboard/test/ai-chat-state.test.mjs b/apps/codex-taskboard/test/ai-chat-state.test.mjs
new file mode 100644
index 000000000..26a455378
--- /dev/null
+++ b/apps/codex-taskboard/test/ai-chat-state.test.mjs
@@ -0,0 +1,282 @@
+import assert from "node:assert/strict";
+import { test } from "node:test";
+
+import {
+  aiChatEventStatus,
+  buildThreadCreateInput,
+  buildTurnInput,
+  chatPrimaryAction,
+  createAiSnapshotRefreshQueue,
+  filterVisibleAiEvents,
+  insertSkillMention,
+  isAiChatCapabilityAvailable,
+  needsDangerConfirmation,
+  normalizeChatSelection,
+  patchAiChatSnapshot,
+  readSkillMention,
+  routeChatState,
+  settingsForNewAiThread,
+  shouldRefreshAiSnapshot,
+} from "../web/src/aiChatState.ts";
+
+const models = [
+  {
+    slug: "codex-real-model",
+    displayName: "Codex Real Model",
+    description: "Host model",
+    defaultReasoningEffort: "high",
+    supportedReasoningEfforts: ["medium", "high"],
+    serviceTiers: [{ id: "priority", name: "Priority" }],
+  },
+  {
+    slug: "codex-fast-model",
+    displayName: "Codex Fast Model",
+    description: "Fast host model",
+    defaultReasoningEffort: "low",
+    supportedReasoningEfforts: ["low"],
+    serviceTiers: [],
+  },
+];
+
+test("AI chat is exposed only when the local capability is explicit", () => {
+  assert.equal(isAiChatCapabilityAvailable({ localAiChat: true }), true);
+  assert.equal(isAiChatCapabilityAvailable({ localAiChat: false }), false);
+  assert.equal(isAiChatCapabilityAvailable(undefined), false);
+});
+
+test("new threads freeze the current project and optional issue as server identifiers", () => {
+  assert.deepEqual(buildThreadCreateInput("project-1", "issue-1"), {
+    projectId: "project-1",
+    issueId: "issue-1",
+  });
+  assert.deepEqual(buildThreadCreateInput("project-1", null), {
+    projectId: "project-1",
+  });
+  assert.equal(buildThreadCreateInput("", null), null);
+});
+
+test("route changes update only the next origin and preserve the selected global thread", () => {
+  assert.deepEqual(
+    routeChatState(
+      { selectedThreadId: "thread-a", pendingProjectId: "project-a", pendingIssueId: "issue-a" },
+      "project-b",
+      "issue-b",
+    ),
+    {
+      selectedThreadId: "thread-a",
+      pendingProjectId: "project-b",
+      pendingIssueId: "issue-b",
+    },
+  );
+});
+
+test("new-thread settings are reused only when they belong to the current project catalog", () => {
+  const settings = {
+    model: "codex-real-model",
+    reasoningEffort: "high",
+    sandbox: "workspace-write",
+  };
+  assert.deepEqual(settingsForNewAiThread("project-a", "project-a", settings), settings);
+  assert.deepEqual(settingsForNewAiThread("project-b", "project-a", settings), {});
+  assert.deepEqual(settingsForNewAiThread("project-b", null, settings), {});
+});
+
+test("PATCH results can update only the snapshot for the thread that started the request", () => {
+  const threadA = {
+    id: "thread-a",
+    title: "A",
+    status: "idle",
+    origin: { projectId: "project-a" },
+  };
+  const threadB = {
+    id: "thread-b",
+    title: "B",
+    status: "idle",
+    origin: { projectId: "project-b" },
+  };
+  const current = { thread: threadB, events: [], runs: [] };
+
+  assert.equal(patchAiChatSnapshot(current, "thread-a", threadA), current);
+  assert.deepEqual(patchAiChatSnapshot(current, "thread-b", {
+    ...threadB,
+    title: "B updated",
+  }), {
+    ...current,
+    thread: { ...threadB, title: "B updated" },
+  });
+});
+
+test("model and effort selections are restricted to the real catalog", () => {
+  assert.deepEqual(normalizeChatSelection(models, "codex-real-model", "medium"), {
+    model: "codex-real-model",
+    reasoningEffort: "medium",
+  });
+  assert.deepEqual(normalizeChatSelection(models, "codex-real-model", "fake-effort"), {
+    model: "codex-real-model",
+    reasoningEffort: "high",
+  });
+  assert.deepEqual(normalizeChatSelection(models, "missing-model", "high"), {
+    model: "codex-real-model",
+    reasoningEffort: "high",
+  });
+  assert.equal(normalizeChatSelection([], "missing-model", "high"), null);
+});
+
+test("@ skill mentions keep a visible label while sending only the selected real id", () => {
+  assert.deepEqual(readSkillMention("请用 @cl", 6), {
+    start: 3,
+    end: 6,
+    query: "cl",
+  });
+  assert.deepEqual(insertSkillMention("请用 @cl 检查", 3, 6, {
+    id: "cloudflare",
+    label: "Cloudflare",
+    scope: "user",
+  }), {
+    value: "请用 @Cloudflare 检查",
+    caret: 14,
+    skillId: "cloudflare",
+  });
+});
+
+test("turn input cannot contain cwd, hidden context, model overrides or arbitrary args", () => {
+  const input = buildTurnInput("检查 LOCAL-103", ["cloudflare"], false);
+  assert.deepEqual(input, {
+    message: "检查 LOCAL-103",
+    skillIds: ["cloudflare"],
+  });
+  assert.equal(JSON.stringify(input).includes("workspacePath"), false);
+  assert.equal(JSON.stringify(input).includes("manage-taskboard"), false);
+  assert.equal(JSON.stringify(input).includes("model"), false);
+  assert.deepEqual(buildTurnInput("执行", [], true), {
+    message: "执行",
+    dangerFullAccessConfirmed: true,
+  });
+});
+
+test("runtime controls distinguish send, stop, danger confirmation and SSE refresh hints", () => {
+  assert.equal(chatPrimaryAction("running", "hello"), "stop");
+  assert.equal(chatPrimaryAction("idle", "hello"), "send");
+  assert.equal(chatPrimaryAction("idle", "  "), "disabled");
+  assert.equal(chatPrimaryAction("idle", "hello", true), "disabled");
+  assert.equal(chatPrimaryAction("running", "hello", true), "disabled");
+  assert.equal(needsDangerConfirmation("danger-full-access", false), true);
+  assert.equal(needsDangerConfirmation("danger-full-access", true), false);
+  assert.equal(needsDangerConfirmation("workspace-write", false), false);
+  assert.equal(shouldRefreshAiSnapshot("ai.event"), true);
+  assert.equal(shouldRefreshAiSnapshot("ai.run"), true);
+  assert.equal(shouldRefreshAiSnapshot("unrelated"), false);
+});
+
+test("visible activity keeps only the latest lifecycle item without merging messages", () => {
+  const events = filterVisibleAiEvents([
+    {
+      id: "1",
+      type: "agent_message",
+      role: "assistant",
+      content: "公开回复一",
+      data: { itemId: "shared-message" },
+    },
+    {
+      id: "2",
+      type: "agent_message",
+      role: "assistant",
+      content: "公开回复二",
+      data: { itemId: "shared-message" },
+    },
+    {
+      id: "3",
+      type: "command_execution",
+      role: "activity",
+      content: "npm test",
+      data: { itemId: "command-1", status: "started" },
+    },
+    {
+      id: "4",
+      type: "command_execution",
+      role: "activity",
+      content: "npm test",
+      data: { itemId: "command-1", status: "in_progress" },
+    },
+    {
+      id: "5",
+      type: "command_execution",
+      role: "activity",
+      content: "npm test",
+      data: { itemId: "command-1", status: "completed" },
+    },
+    { id: "6", type: "todo_list", role: "activity", content: "完成测试" },
+    { id: "7", type: "turn.failed", role: "error", content: "执行失败" },
+    { id: "8", type: "user_message", role: "user", content: "第一条", data: { itemId: "user-1" } },
+    { id: "9", type: "user_message", role: "user", content: "第二条", data: { itemId: "user-1" } },
+    { id: "10", type: "reasoning", role: "activity", content: "private chain of thought" },
+    { id: "11", type: "raw_jsonl", role: "activity", content: "{\"secret\":true}" },
+  ]);
+  assert.deepEqual(events.map((event) => event.id), ["1", "2", "5", "6", "7", "8", "9"]);
+});
+
+test("activity status treats started, running and in_progress as active and failures as failed", () => {
+  assert.equal(aiChatEventStatus({
+    id: "1",
+    type: "command_execution",
+    role: "activity",
+    content: "",
+    data: { status: "started" },
+  }), "running");
+  assert.equal(aiChatEventStatus({
+    id: "2",
+    type: "todo_list",
+    role: "activity",
+    content: "",
+    data: { status: "in_progress" },
+  }), "running");
+  assert.equal(aiChatEventStatus({
+    id: "3",
+    type: "turn.failed",
+    role: "error",
+    content: "failed",
+  }), "failed");
+  assert.equal(aiChatEventStatus({
+    id: "4",
+    type: "file_change",
+    role: "activity",
+    content: "",
+    data: { status: "completed" },
+  }), "completed");
+});
+
+test("snapshot hint refreshes allow one in-flight request and one queued request", async () => {
+  const calls = [];
+  const releases = [];
+  const queue = createAiSnapshotRefreshQueue(async (threadId) => {
+    calls.push(threadId);
+    await new Promise((resolve) => releases.push(resolve));
+  });
+
+  const first = queue.request("thread-1");
+  const queued = [
+    queue.request("thread-1"),
+    queue.request("thread-1"),
+    queue.request("thread-1"),
+  ];
+  assert.deepEqual(calls, ["thread-1"]);
+
+  releases.shift()();
+  await new Promise((resolve) => setImmediate(resolve));
+  assert.deepEqual(calls, ["thread-1", "thread-1"]);
+
+  releases.shift()();
+  await Promise.all([first, ...queued]);
+  assert.deepEqual(calls, ["thread-1", "thread-1"]);
+  queue.clear();
+});
+
+test("reasoning and raw JSONL events are excluded from the visible timeline", () => {
+  const events = filterVisibleAiEvents([
+    { id: "1", type: "agent_message", role: "assistant", content: "公开回复" },
+    { id: "2", type: "reasoning", role: "activity", content: "private chain of thought" },
+    { id: "3", type: "raw_jsonl", role: "activity", content: "{\"secret\":true}" },
+    { id: "4", type: "command", role: "activity", content: "npm test" },
+  ]);
+  assert.deepEqual(events.map((event) => event.id), ["1", "4"]);
+});
diff --git a/apps/codex-taskboard/test/ai-chat-ui.test.mjs b/apps/codex-taskboard/test/ai-chat-ui.test.mjs
new file mode 100644
index 000000000..809013d65
--- /dev/null
+++ b/apps/codex-taskboard/test/ai-chat-ui.test.mjs
@@ -0,0 +1,231 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+import {
+  buildThreadCreateInput,
+  buildTurnInput,
+  chatPrimaryAction,
+  filterVisibleAiEvents,
+  insertSkillMention,
+  isAiChatCapabilityAvailable,
+  needsDangerConfirmation,
+  normalizeChatSelection,
+  routeChatState,
+  shouldRefreshAiSnapshot,
+} from "../web/src/aiChatState.ts";
+
+const appSource = await readFile(new URL("../web/src/App.tsx", import.meta.url), "utf8");
+const chatSource = await readFile(
+  new URL("../web/src/components/AiChat.tsx", import.meta.url),
+  "utf8",
+);
+const apiSource = await readFile(new URL("../web/src/api.ts", import.meta.url), "utf8");
+const styles = await readFile(new URL("../web/src/styles.css", import.meta.url), "utf8");
+
+const models = [
+  {
+    slug: "codex-real-model",
+    displayName: "Codex Real Model",
+    description: "Host model",
+    defaultReasoningEffort: "high",
+    supportedReasoningEfforts: ["medium", "high"],
+    serviceTiers: [{ id: "priority", name: "Priority" }],
+  },
+  {
+    slug: "codex-fast-model",
+    displayName: "Codex Fast Model",
+    description: "Fast host model",
+    defaultReasoningEffort: "low",
+    supportedReasoningEfforts: ["low"],
+    serviceTiers: [],
+  },
+];
+
+test("AI chat capability is local-only and thread creation freezes the current origin", () => {
+  assert.equal(isAiChatCapabilityAvailable({ localAiChat: true }), true);
+  assert.equal(isAiChatCapabilityAvailable({ localAiChat: false }), false);
+  assert.equal(isAiChatCapabilityAvailable(undefined), false);
+  assert.deepEqual(buildThreadCreateInput("project-1", "task-1"), {
+    projectId: "project-1",
+    issueId: "task-1",
+  });
+  assert.deepEqual(buildThreadCreateInput("project-1", null), {
+    projectId: "project-1",
+  });
+  assert.equal(buildThreadCreateInput("", null), null);
+});
+
+test("navigation updates only the pending new-thread origin and preserves the selected global thread", () => {
+  assert.deepEqual(
+    routeChatState(
+      { selectedThreadId: "thread-a", pendingProjectId: "project-a", pendingIssueId: "issue-a" },
+      "project-b",
+      "issue-b",
+    ),
+    {
+      selectedThreadId: "thread-a",
+      pendingProjectId: "project-b",
+      pendingIssueId: "issue-b",
+    },
+  );
+});
+
+test("model and effort selections are normalized exclusively against the real catalog", () => {
+  assert.deepEqual(normalizeChatSelection(models, "codex-real-model", "medium"), {
+    model: "codex-real-model",
+    reasoningEffort: "medium",
+  });
+  assert.deepEqual(normalizeChatSelection(models, "codex-real-model", "fake-effort"), {
+    model: "codex-real-model",
+    reasoningEffort: "high",
+  });
+  assert.deepEqual(normalizeChatSelection(models, "missing-model", "high"), {
+    model: "codex-real-model",
+    reasoningEffort: "high",
+  });
+  assert.equal(normalizeChatSelection([], "missing-model", "high"), null);
+});
+
+test("@ skill insertion uses the selected real skill id while keeping the mention visible", () => {
+  assert.deepEqual(insertSkillMention("请用 @cl 检查", 3, 6, {
+    id: "cloudflare",
+    label: "Cloudflare",
+    scope: "user",
+  }), {
+    value: "请用 @Cloudflare 检查",
+    caret: 14,
+    skillId: "cloudflare",
+  });
+});
+
+test("turn input contains only visible user content, real skill ids and one-time confirmation", () => {
+  assert.deepEqual(buildTurnInput("检查 LOCAL-103", ["cloudflare"], false), {
+    message: "检查 LOCAL-103",
+    skillIds: ["cloudflare"],
+  });
+  assert.deepEqual(buildTurnInput("执行", [], true), {
+    message: "执行",
+    dangerFullAccessConfirmed: true,
+  });
+  assert.equal(JSON.stringify(buildTurnInput("hello", [], false)).includes("workspacePath"), false);
+  assert.equal(JSON.stringify(buildTurnInput("hello", [], false)).includes("manage-taskboard"), false);
+});
+
+test("running threads expose stop, danger-full-access requires confirmation, and SSE is a refresh hint", () => {
+  assert.equal(chatPrimaryAction("running", "hello"), "stop");
+  assert.equal(chatPrimaryAction("idle", "hello"), "send");
+  assert.equal(chatPrimaryAction("idle", "  "), "disabled");
+  assert.equal(needsDangerConfirmation("danger-full-access", false), true);
+  assert.equal(needsDangerConfirmation("danger-full-access", true), false);
+  assert.equal(needsDangerConfirmation("workspace-write", false), false);
+  assert.equal(shouldRefreshAiSnapshot("ai.event"), true);
+  assert.equal(shouldRefreshAiSnapshot("ai.run"), true);
+  assert.equal(shouldRefreshAiSnapshot("unrelated"), false);
+});
+
+test("reasoning and raw JSONL events never enter the visible activity timeline", () => {
+  const events = filterVisibleAiEvents([
+    { id: "1", type: "agent_message", role: "assistant", content: "公开回复" },
+    { id: "2", type: "reasoning", role: "activity", content: "private chain of thought" },
+    { id: "3", type: "raw_jsonl", role: "activity", content: "{\"secret\":true}" },
+    { id: "4", type: "command", role: "activity", content: "npm test" },
+  ]);
+  assert.deepEqual(events.map((event) => event.id), ["1", "4"]);
+});
+
+test("App wires the global panel outside project/detail branches and hides it without local capability", () => {
+  assert.match(appSource, /<AiChat/);
+  assert.match(appSource, /projectId=\{selectedProjectId \|\| null\}/);
+  assert.match(appSource, /issueId=\{detailTaskId\}/);
+  assert.match(appSource, /localAiChat/);
+  assert.match(chatSource, /if \(!available\) return null/);
+  assert.match(chatSource, /className="ai-chat-launcher/);
+  assert.match(chatSource, /className="ai-chat-panel/);
+});
+
+test("AI chat API uses the stable local contract and never sends cwd or hidden prompt fields", () => {
+  assert.match(apiSource, /\/api\/local\/ai\/catalog\?projectId=/);
+  assert.match(apiSource, /\/api\/local\/ai\/threads/);
+  assert.match(apiSource, /\/turns/);
+  assert.match(apiSource, /\/interrupt/);
+  assert.match(apiSource, /new EventSource\(`\/api\/local\/ai\/threads\//);
+  assert.doesNotMatch(apiSource, /hiddenPrompt|workspacePath:\s*input|argv|cwd/);
+});
+
+test("panel follows the measured Codex-like layout and responsive boundary", () => {
+  assert.match(styles, /\.ai-chat-launcher\s*\{[\s\S]*?position:\s*fixed;[\s\S]*?width:\s*40px;[\s\S]*?height:\s*40px;/);
+  assert.match(styles, /\.ai-chat-panel\s*\{[\s\S]*?position:\s*fixed;[\s\S]*?width:\s*min\(672px,\s*calc\(100vw - 16px\)\);/);
+  assert.match(styles, /\.ai-chat-panel\s*\{[\s\S]*?height:\s*calc\(100vh - 16px\);/);
+  assert.match(styles, /\.ai-chat-panel-header\s*\{[\s\S]*?height:\s*42px;/);
+  assert.match(styles, /\.ai-chat-composer\s*\{[\s\S]*?min-height:\s*108px;[\s\S]*?max-height:\s*300px;/);
+  assert.match(styles, /@media \(max-width:\s*719px\)/);
+  assert.doesNotMatch(chatSource, /<select/);
+});
+
+test("chat renders Markdown, public activity cards and never renders host-only fields", () => {
+  assert.match(chatSource, /ReactMarkdown/);
+  assert.match(chatSource, /remarkPlugins=\{\[remarkGfm\]\}/);
+  assert.match(chatSource, /ai-chat-thinking-step-entry/);
+  assert.match(chatSource, /aria-label="停止生成"/);
+  assert.match(chatSource, /aria-label="发送消息"/);
+  assert.doesNotMatch(chatSource, /origin\.workspacePath/);
+  assert.doesNotMatch(chatSource, /manageTaskboardSkillPath/);
+});
+
+test("composer does not submit during IME composition and background runs keep launcher state fresh", () => {
+  const composingGuard = chatSource.indexOf("event.nativeEvent.isComposing");
+  const skillSelection = chatSource.indexOf('event.key === "Enter" && skillMention && visibleSkills[selectedSkillIndex]');
+  const messageSubmission = chatSource.indexOf('if (event.key === "Enter") {');
+  assert.ok(composingGuard > 0);
+  assert.ok(composingGuard < skillSelection);
+  assert.ok(composingGuard < messageSubmission);
+  assert.match(chatSource, /backgroundRunningThreadIds/);
+  assert.match(chatSource, /subscribeAiChatThread\(threadId/);
+  assert.match(chatSource, /observedRunStatusesRef/);
+});
+
+test("composer and Enter submission stay disabled while a snapshot is loading", () => {
+  assert.match(chatSource, /disabled=\{[\s\S]*?loading[\s\S]*?\}/);
+  assert.match(chatSource, /const sendBlocked = loading[\s\S]*?\|\| settingsSaving[\s\S]*?\|\| composerBlocked[\s\S]*?\|\| Boolean\(selectedThreadId && !snapshot\)/);
+  assert.match(chatSource, /if \(composerBlocked\) return;/);
+  assert.match(chatSource, /chatPrimaryAction\([\s\S]*?sendBlocked/);
+});
+
+test("new threads cannot inherit settings from a selected thread in another project", () => {
+  assert.match(chatSource, /settingsForNewAiThread\(/);
+  assert.match(chatSource, /catalogProjectId/);
+  assert.match(chatSource, /catalogLoadedProjectId/);
+  assert.match(chatSource, /createAiChatThread\(\{[\s\S]*?\.\.\.settings/);
+});
+
+test("quiet refreshes preserve action errors and PATCH results are guarded by their starting thread", () => {
+  assert.match(chatSource, /if \(!quiet\) setError\(null\);/);
+  assert.match(chatSource, /patchAiChatSnapshot\(current,\s*threadId,\s*thread\)/);
+  assert.match(chatSource, /selectedThreadRef\.current === threadId/);
+  assert.match(chatSource, /restoreDraftSettings\(previousThread\)/);
+});
+
+test("danger confirmation sends the bound pending retry instead of the current draft", () => {
+  assert.match(chatSource, /pendingDangerInput/);
+  assert.match(chatSource, /setPendingDangerInput\(\{[\s\S]*?message:\s*trimmed/);
+  assert.match(chatSource, /startMessage\(\s*pendingDangerInput\.message,\s*true,\s*pendingDangerInput\.skillIds/);
+  assert.doesNotMatch(chatSource, /onClick=\{\(\) => void startMessage\(draft,\s*true\)\}/);
+});
+
+test("SSE hints are coalesced and the panel remains resizable without clipping narrow menus", () => {
+  assert.match(chatSource, /createAiSnapshotRefreshQueue/);
+  assert.match(chatSource, /selectedHintRefreshQueue\.request\(selectedThreadId\)/);
+  assert.match(styles, /\.ai-chat-resize-handle\s*\{/);
+  assert.match(styles, /\.ai-chat-resize-handle\.is-top-left\s*\{/);
+  assert.match(styles, /@media \(max-width:\s*719px\)[\s\S]*?\.ai-chat-resize-handle\s*\{[\s\S]*?display:\s*none;/);
+  assert.match(styles, /@media \(max-width:\s*719px\)[\s\S]*?\.ai-chat-menu-wrap\s*\{[\s\S]*?position:\s*static;/);
+  assert.match(styles, /@media \(max-width:\s*719px\)[\s\S]*?\.ai-chat-option-menu\s*\{[\s\S]*?right:\s*0;[\s\S]*?left:\s*0;/);
+});
+
+test("history exposes deletion of local records without adding rename controls", () => {
+  assert.match(chatSource, /deleteAiChatThread\(/);
+  assert.match(chatSource, /aria-label=\{`删除对话 \$\{thread\.title\}`\}/);
+  assert.match(chatSource, /window\.confirm\(`删除本地对话“\$\{thread\.title\}”\？`\)/);
+  assert.doesNotMatch(chatSource, /重命名对话|renameAiChatThread/);
+});
diff --git a/apps/codex-taskboard/test/board-interactions.test.mjs b/apps/codex-taskboard/test/board-interactions.test.mjs
new file mode 100644
index 000000000..dbbc919a3
--- /dev/null
+++ b/apps/codex-taskboard/test/board-interactions.test.mjs
@@ -0,0 +1,201 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+const appSource = await readFile(new URL("../web/src/App.tsx", import.meta.url), "utf8");
+const boardColumnSource = await readFile(new URL("../web/src/components/BoardColumn.tsx", import.meta.url), "utf8");
+const apiSource = await readFile(new URL("../web/src/api.ts", import.meta.url), "utf8");
+const styles = await readFile(new URL("../web/src/styles.css", import.meta.url), "utf8");
+const detailSource = await readFile(new URL("../web/src/components/TaskDetail.tsx", import.meta.url), "utf8");
+const editorSource = await readFile(new URL("../web/src/components/TaskEditor.tsx", import.meta.url), "utf8");
+const labelPickerSource = await readFile(new URL("../web/src/components/LabelPicker.tsx", import.meta.url), "utf8");
+const contextMenuSource = await readFile(new URL("../web/src/components/TaskContextMenu.tsx", import.meta.url), "utf8");
+const cardSource = await readFile(new URL("../web/src/components/TaskCard.tsx", import.meta.url), "utf8");
+const filterSource = await readFile(new URL("../web/src/taskFilters.ts", import.meta.url), "utf8");
+const typesSource = await readFile(new URL("../web/src/types.ts", import.meta.url), "utf8");
+
+function workflowStatuses() {
+  const match = typesSource.match(/export const TASK_STATUSES = (\[[\s\S]*?\]) as const/);
+  assert.ok(match);
+  return [...match[1].matchAll(/"([^"]+)"/g)].map((entry) => entry[1]);
+}
+
+test("dragging previews the insertion rank before committing it", () => {
+  assert.match(boardColumnSource, /function findDropBefore/);
+  assert.match(boardColumnSource, /clientY < card\.getBoundingClientRect\(\)\.top \+ card\.offsetHeight \/ 2/);
+  assert.match(boardColumnSource, /onDrop\(status, taskId, findDropBefore/);
+  assert.match(boardColumnSource, /function getTaskDragShift/);
+  assert.match(boardColumnSource, /shift -= dragDistance/);
+  assert.match(boardColumnSource, /shift \+= dragDistance/);
+  assert.match(boardColumnSource, /dragShift=\{dragShift\}/);
+  assert.match(styles, /\.task-card\.is-dragging \{[\s\S]*?opacity: 0/);
+  assert.doesNotMatch(styles, /\.task-card\.is-dragging \{[^}]*pointer-events: none/);
+  assert.match(styles, /transform 160ms cubic-bezier/);
+  assert.match(appSource, /beforeTaskId: string \| null = null/);
+  assert.match(appSource, /\(previousTask\.sortOrder \+ nextTask\.sortOrder\) \/ 2/);
+  assert.match(appSource, /currentOrder\.every\(\(candidate, index\) => candidate\.id === desiredOrder\[index\]\.id\)/);
+  assert.match(appSource, /setTasks\(\(current\) => sortTasks\(current\.map/);
+  assert.match(appSource, /setSettlingTaskId\(task\.id\)/);
+  assert.match(styles, /\.task-card\.is-settling \{[\s\S]*?task-card-settle 200ms/);
+});
+
+test("text selection is reserved for editable fields", () => {
+  assert.match(styles, /body \{[^}]*user-select: none/);
+  assert.match(styles, /input,[\s\S]*?textarea,[\s\S]*?\[contenteditable="true"\][\s\S]*?user-select: text/);
+});
+
+test("issue cards omit redundant metadata and keep three compact, well-spaced rows", () => {
+  assert.doesNotMatch(cardSource, /task\.createdAt|创建于|card-footer|created-at|projectName|project-chip/);
+  assert.doesNotMatch(styles, /\.card-footer|\.created-at|\.project-chip/);
+  assert.match(styles, /\.task-card \{[\s\S]*?min-height: 80px;[\s\S]*?gap: 6px;[\s\S]*?padding: 7px 8px/);
+  assert.match(detailSource, /currentTask\.createdAt/);
+});
+
+test("scrollbars stay proportional while the workflow node library hides its bar", () => {
+  assert.match(styles, /:root \{[\s\S]*?--scrollbar-thumb: rgba\(27, 27, 27, 0\.15\)/);
+  assert.match(styles, /:root\[data-theme="dark"\] \{[\s\S]*?--scrollbar-thumb: rgba\(238, 238, 239, 0\.15\)/);
+  assert.match(styles, /\* \{[\s\S]*?scrollbar-color: var\(--scrollbar-thumb\) transparent[\s\S]*?scrollbar-width: thin/);
+  assert.match(styles, /\*::\-webkit-scrollbar-track,[\s\S]*?\*::\-webkit-scrollbar-track-piece,[\s\S]*?\*::\-webkit-scrollbar-corner \{[\s\S]*?background: transparent/);
+  assert.match(styles, /\*::\-webkit-scrollbar-button \{[\s\S]*?display: none/);
+  assert.match(styles, /\*::\-webkit-scrollbar-thumb \{[\s\S]*?min-height: 30px[\s\S]*?background: var\(--scrollbar-thumb\)[\s\S]*?background-clip: padding-box/);
+  assert.doesNotMatch(styles, /scrollbar-color: var\(--border-strong\) transparent/);
+  assert.doesNotMatch(styles, /\*::\-webkit-scrollbar-thumb:(?:vertical|horizontal)/);
+  assert.match(styles, /\.workflow-node-groups \{[\s\S]*?overflow-y: auto;[\s\S]*?scrollbar-width: none/);
+  assert.match(styles, /\.workflow-node-groups::\-webkit-scrollbar \{[\s\S]*?display: none;[\s\S]*?width: 0;[\s\S]*?height: 0/);
+});
+
+test("each status column remains a drop target for the full board height", () => {
+  assert.match(styles, /\.board \{[\s\S]*?align-items: stretch;[\s\S]*?height: 100%/);
+  assert.match(styles, /\.board-column \{[\s\S]*?display: flex;[\s\S]*?flex-direction: column;[\s\S]*?height: 100%/);
+  assert.match(styles, /\.column-list \{[\s\S]*?flex: 1 0 auto;[\s\S]*?min-height: calc\(100% - 48px\)/);
+});
+
+test("the issue board has no shared vertical scroll and each status column scrolls below a sticky heading", () => {
+  assert.match(styles, /\.board-scroll \{[\s\S]*?overflow-x: auto;[\s\S]*?overflow-y: hidden;[\s\S]*?overscroll-behavior-y: none/);
+  assert.match(styles, /\.board-column \{[\s\S]*?overflow-x: hidden;[\s\S]*?overflow-y: auto;[\s\S]*?overscroll-behavior-y: contain/);
+  assert.match(styles, /\.column-header \{[\s\S]*?position: sticky;[\s\S]*?top: 0;[\s\S]*?background: var\(--board-column-surface\)/);
+});
+
+test("the complete Linear-style workflow shares one ordered status source", () => {
+  assert.deepEqual(workflowStatuses(), [
+    "backlog",
+    "todo",
+    "in_progress",
+    "in_review",
+    "blocked",
+    "done",
+    "canceled",
+  ]);
+  assert.match(boardColumnSource, /in_review: \{ label: "审核中", tone: "review" \}/);
+  assert.match(boardColumnSource, /blocked: \{ label: "已阻塞", tone: "blocked" \}/);
+  assert.match(boardColumnSource, /canceled: \{ label: "已取消", tone: "canceled" \}/);
+  assert.match(cardSource, /import \{ TASK_STATUSES,/);
+  assert.doesNotMatch(cardSource, /STATUS_ORDER/);
+  assert.match(detailSource, /TASK_STATUSES\.map\(\(status\) =>/);
+  assert.match(editorSource, /TASK_STATUSES\.map\(\(value\) =>/);
+  assert.match(contextMenuSource, /TASK_STATUSES\.map\(\(status, index\) =>/);
+});
+
+test("review, blocked and canceled statuses round-trip through filter URLs", () => {
+  const statuses = workflowStatuses();
+  const selected = ["in_review", "blocked", "canceled"];
+  const url = new URL("http://taskboard.local/");
+  url.searchParams.set("status", selected.join(","));
+  const restored = url.searchParams.get("status").split(",").filter((status) => statuses.includes(status));
+
+  assert.deepEqual(restored, selected);
+  assert.match(filterSource, /filters\.statuses\.join\(","\)/);
+  assert.match(filterSource, /\.split\(","\)\.filter\(isTaskStatus\)/);
+  assert.match(filterSource, /TASK_STATUSES\.includes\(value as TaskStatus\)/);
+});
+
+test("the column surface wraps its heading and issue list", () => {
+  assert.match(styles, /\.board-column \{[\s\S]*?--board-column-surface: var\(--column-header\)[\s\S]*?background: var\(--board-column-surface\)/);
+  assert.match(styles, /\.column-header \{[\s\S]*?background: var\(--board-column-surface\)/);
+  assert.match(styles, /\.column-list \{[\s\S]*?padding: 8px 8px 8px/);
+});
+
+test("common issue mutations enter a Linear-style undo queue", () => {
+  assert.match(appSource, /const undoStackRef = useRef<UndoOperation\[]>/);
+  assert.match(appSource, /event\.key\.toLowerCase\(\) === "z"/);
+  assert.match(appSource, /event\.metaKey \|\| event\.ctrlKey/);
+  assert.match(appSource, /function pushUndo/);
+  assert.match(appSource, /setUndoNotice\(showNotice \? \{ id: operation\.id, message \} : null\)/);
+  assert.match(appSource, /moveTask\(task, destination, beforeTaskId, true\)/);
+  assert.doesNotMatch(appSource, /setAnnouncement\(`已撤回：/);
+  assert.match(appSource, /className="toast undo-toast"/);
+  assert.match(appSource, /restoreTaskRequest\(archived\)/);
+  assert.match(apiSource, /export async function restoreTask/);
+});
+
+test("selected issues can be bulk moved to another project", () => {
+  assert.match(appSource, /const selectedIssueTasks = useMemo/);
+  assert.match(appSource, /async function moveSelectedTasksToProject/);
+  assert.match(appSource, /bulk-project-move/);
+  assert.match(appSource, /moveTaskRequest\(task, task\.status, undefined, \{ projectId: targetProject\.id \}\)/);
+  assert.match(appSource, /moveTaskRequest\(moved, previous\.status, previous\.sortOrder, \{ projectId: previous\.projectId \}\)/);
+  assert.match(apiSource, /options: \{ threadId\?: string; projectId\?: string \} = \{\}/);
+  assert.match(apiSource, /\.\.\.\(options\.projectId \? \{ projectId: options\.projectId \} : \{\}\)/);
+});
+
+test("issues expose processing conversations without manual binding", () => {
+  assert.match(detailSource, /在对话中打开/);
+  assert.match(detailSource, /onOpenInThread\(currentTask\)/);
+  assert.doesNotMatch(appSource, /detail-thread-button/);
+  assert.doesNotMatch(detailSource, /输入对话 ID|解除 Codex 对话绑定|>绑定</);
+  assert.doesNotMatch(editorSource, /对话 ID|linkedThreadId/);
+  assert.match(detailSource, /currentTask\.threadId/);
+  assert.doesNotMatch(detailSource, /currentTask\.threadIds/);
+  assert.match(detailSource, /<strong>继续对话<\/strong>/);
+  assert.match(detailSource, /className="conversation-thread-id">\{threadId\}/);
+  assert.doesNotMatch(detailSource, /shortThreadId/);
+  assert.doesNotMatch(detailSource, /detail-property-label">Codex/);
+  assert.match(detailSource, /comment\.threadId/);
+  assert.match(detailSource, /threadId=\{comment\.threadId\}/);
+  assert.doesNotMatch(detailSource, /compact/);
+  assert.doesNotMatch(styles, /issue-conversation-link\.compact/);
+  assert.match(detailSource, /代码分支/);
+  assert.match(detailSource, /Worktree/);
+  assert.match(detailSource, /developmentContext/);
+  assert.doesNotMatch(detailSource, /placeholder="绑定分支/);
+  assert.doesNotMatch(contextMenuSource, /打开关联 Codex 对话/);
+  assert.match(contextMenuSource, /onOpenInThread/);
+});
+
+test("issues bind one workflow from the current project's workflow tabs", () => {
+  assert.match(typesSource, /export interface Task \{[\s\S]*?workflowId: string \| null/);
+  assert.match(typesSource, /export interface TaskDraft \{[\s\S]*?workflowId: string \| null/);
+  assert.match(appSource, /function taskToDraft[\s\S]*?workflowId: task\.workflowId/);
+  assert.match(appSource, /const \[workflowOptions, setWorkflowOptions\] = useState<WorkflowOption\[\]>/);
+  assert.match(appSource, /workflowOptionsFromWorkspace\(record\.workspace\)/);
+  assert.match(editorSource, /workflows: WorkflowOption\[\]/);
+  assert.match(editorSource, /workflowId: workflowId \|\| null/);
+  assert.match(editorSource, /<span className="sr-only">工作流<\/span>/);
+  assert.match(detailSource, /<span className="detail-property-label">工作流<\/span>/);
+  assert.match(detailSource, /workflowId: event\.target\.value \|\| null/);
+  assert.match(detailSource, /当前设备未找到此流程/);
+});
+
+test("comments stage, upload, render and delete their own attachments", () => {
+  assert.match(apiSource, /export async function uploadCommentAttachment/);
+  assert.match(apiSource, /\/api\/comments\/\$\{encodeURIComponent\(commentId\)\}\/attachments/);
+  assert.match(detailSource, /pendingCommentFiles/);
+  assert.match(detailSource, /uploadCommentAttachment\(comment\.id, file\)/);
+  assert.match(detailSource, /comment\.attachments\s*\.filter\([\s\S]*?\)\s*\.map/);
+  assert.match(detailSource, /setPendingAttachmentDelete\(attachment\)/);
+});
+
+test("issue creation and detail share one searchable, creatable label picker", () => {
+  assert.match(editorSource, /<LabelPicker/);
+  assert.match(detailSource, /<LabelPicker/);
+  assert.match(appSource, /<TaskDetail[\s\S]*?availableLabels=\{availableLabels\}/);
+  assert.match(detailSource, /selectedLabels=\{currentTask\.labels\}/);
+  assert.match(detailSource, /saveTask\(\{ labels: nextLabels \}, "labels"\)/);
+  assert.doesNotMatch(detailSource, /标签，以逗号分隔|function saveLabels|labels\.split/);
+  assert.match(labelPickerSource, /availableLabels\.filter/);
+  assert.match(labelPickerSource, /selectedLabels\.includes\(label\)/);
+  assert.match(labelPickerSource, /创建 “\{normalizedSearch\}”/);
+  assert.match(labelPickerSource, /labelColor\(normalizedSearch\)/);
+  assert.match(labelPickerSource, /aria-multiselectable="true"/);
+  assert.match(styles, /\.detail-label-picker \.label-popover/);
+});
diff --git a/apps/codex-taskboard/test/board-views.test.mjs b/apps/codex-taskboard/test/board-views.test.mjs
new file mode 100644
index 000000000..6a3af01f3
--- /dev/null
+++ b/apps/codex-taskboard/test/board-views.test.mjs
@@ -0,0 +1,265 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+const appSource = await readFile(new URL("../web/src/App.tsx", import.meta.url), "utf8");
+const apiSource = await readFile(new URL("../web/src/api.ts", import.meta.url), "utf8");
+const typesSource = await readFile(new URL("../web/src/types.ts", import.meta.url), "utf8");
+const workflowSource = await readFile(new URL("../web/src/components/WorkflowBoard.tsx", import.meta.url), "utf8");
+const workflowNodeSource = await readFile(new URL("../web/src/components/WorkflowNode.tsx", import.meta.url), "utf8");
+const inspectorSource = await readFile(new URL("../web/src/components/WorkflowInspector.tsx", import.meta.url), "utf8");
+const pickerSource = await readFile(new URL("../web/src/components/WorkflowStepPicker.tsx", import.meta.url), "utf8");
+const catalogSource = await readFile(new URL("../web/src/components/workflowCatalog.ts", import.meta.url), "utf8");
+const workflowStoreSource = await readFile(new URL("../web/src/workflowStore.ts", import.meta.url), "utf8");
+const databaseSource = await readFile(new URL("../server/database.mjs", import.meta.url), "utf8");
+const serverSource = await readFile(new URL("../server/app.mjs", import.meta.url), "utf8");
+const styles = await readFile(new URL("../web/src/components/workflow.css", import.meta.url), "utf8");
+const globalStyles = await readFile(new URL("../web/src/styles.css", import.meta.url), "utf8");
+
+test("the taskboard defaults to issues and exposes issue and node mode tabs", () => {
+  assert.match(appSource, /type BoardView = "issues" \| "hierarchy" \| "archive" \| "workflow"/);
+  assert.match(appSource, /useState<BoardView>\("issues"\)/);
+  assert.match(appSource, />\s*任务看板\s*<\/button>/);
+  assert.match(appSource, />\s*节点模式\s*<\/button>/);
+  assert.match(appSource, /aria-pressed=\{boardView === "issues"\}/);
+  assert.match(appSource, /aria-pressed=\{boardView === "workflow"\}/);
+  assert.match(appSource, /onClick=\{\(\) => selectBoardView\("issues"\)\}/);
+  assert.match(appSource, /onClick=\{\(\) => selectBoardView\("workflow"\)\}/);
+  assert.match(appSource, /function changeProject[\s\S]*?setBoardView\("issues"\)/);
+  assert.doesNotMatch(appSource, /<span>活跃<\/span>|<span>积压事项<\/span>|所有任务|add-view/);
+});
+
+test("node mode lazy-loads WorkflowBoard while issue-only controls remain isolated", () => {
+  assert.match(appSource, /lazy\(\(\) => import\("\.\/components\/WorkflowBoard"\)/);
+  assert.match(
+    appSource,
+    /\(boardView === "issues" \|\| boardView === "hierarchy" \|\| boardView === "archive"\) && <div className="toolbar-tools">/,
+  );
+  assert.match(appSource, /boardView === "workflow" \? \([\s\S]*?<Suspense[\s\S]*?<WorkflowBoard/);
+  assert.match(
+    appSource,
+    /projectId=\{selectedProject\?\.id \?\? (?:DEFAULT_PROJECT_ID|"local")\}/,
+  );
+  assert.match(appSource, /onWorkflowsChange=\{setWorkflowOptions\}/);
+  assert.match(workflowSource, /export function WorkflowBoard\(/);
+  assert.match(workflowSource, /from "@xyflow\/react"/);
+  assert.match(workflowSource, /aria-label="流程编排区"/);
+  assert.match(workflowSource, /nodesConnectable=\{false\}/);
+  assert.match(workflowSource, /connectOnClick=\{false\}/);
+  assert.doesNotMatch(workflowSource, /MiniMap|onConnect=|aria-label="节点库"|workflow-library/);
+  assert.match(styles, /\.workflow-board/);
+  assert.match(globalStyles, /\.workflow-node/);
+  assert.doesNotMatch(appSource, /workflow-board-placeholder|具体功能将在后续开发/);
+});
+
+test("the workflow catalog retains the real trigger, capability, API, integration, planning and result steps", () => {
+  for (const label of [
+    "Issue",
+    "Skill",
+    "MCP",
+    "Nano Banana 生图",
+    "即梦生图",
+    "Midjourney 生图",
+    "Seedance 2.0 生视频",
+    "可灵生视频",
+    "Git",
+    "飞书文档",
+    "OpenCLI",
+    "Claude Design 设计",
+    "Cloudflare 部署",
+    "Vercel 部署",
+    "基础规划",
+    "Claude Code 规划",
+    "自定义规划",
+    "Codex 审核",
+    "Claude Code 审核",
+  ]) {
+    assert.match(catalogSource, new RegExp(label));
+  }
+  assert.match(catalogSource, /const GIT_LOGO = "https:\/\/git-scm\.com\/images\/logos\/downloads\/Git-Icon-1788C\.svg"/);
+  assert.doesNotMatch(catalogSource, /读取任务上下文|获取项目上下文|Codex 任务/);
+  assert.doesNotMatch(workflowSource, /这是工作流 UI 示意|仅保存在当前页面|后续实现|将在后续接入/);
+});
+
+test("workflow tabs switch independent sequences, create blank workflows and rename in place", () => {
+  assert.match(workflowSource, /interface WorkflowSnapshot[\s\S]*?nodes: WorkflowCanvasNode\[\][\s\S]*?flow: WorkflowFlow[\s\S]*?selectedNodeId/);
+  assert.match(workflowSource, /const \[workflowTabs, setWorkflowTabs\] = useState<WorkflowTab\[\]>/);
+  assert.match(workflowSource, /function activateWorkflow[\s\S]*?setNodes\(snapshot\.nodes\)[\s\S]*?setFlow\(snapshot\.flow\)/);
+  assert.match(workflowSource, /function createWorkflow[\s\S]*?createWorkflowFlow\(\)[\s\S]*?nodes: \[\][\s\S]*?flow: emptyFlow[\s\S]*?setWorkflowTabs/);
+  assert.match(workflowSource, /className="workflow-tabs" role="tablist"/);
+  assert.match(workflowSource, /role="tab"[\s\S]*?aria-selected=\{active\}/);
+  assert.match(workflowSource, /function handleWorkflowTabKeyDown[\s\S]*?ArrowLeft[\s\S]*?ArrowRight[\s\S]*?Home[\s\S]*?End/);
+  assert.match(workflowSource, /aria-label="新建流程"/);
+  assert.match(workflowSource, /const \[renamingWorkflowId, setRenamingWorkflowId\] = useState/);
+  assert.match(workflowSource, /onDoubleClick=\{\(\) => startWorkflowRename\(workflow\)\}/);
+  assert.match(workflowSource, /aria-label="流程名称"[\s\S]*?event\.key === "Enter"[\s\S]*?event\.key === "Escape"/);
+  assert.match(styles, /\.workflow-tab\.is-active \{[\s\S]*?border-bottom: 0[\s\S]*?background: var\(--bg\)/);
+  assert.doesNotMatch(styles, /\.workflow-tab\.is-active::after/);
+});
+
+test("workflow tab context menu opens at the pointer and closes through established interactions", () => {
+  assert.match(
+    workflowSource,
+    /function openWorkflowTabMenu[\s\S]*?event\.preventDefault\(\)[\s\S]*?clientX[\s\S]*?clientY/,
+  );
+  assert.match(
+    workflowSource,
+    /onContextMenu=\{\(event\) => openWorkflowTabMenu\(event, workflow\.id\)\}/,
+  );
+  assert.match(
+    workflowSource,
+    /className="task-context-menu workflow-tab-context-menu"[\s\S]*?role="menu"[\s\S]*?role="menuitem"[\s\S]*?<LinearIcon name="trash" \/>[\s\S]*?删除流程/,
+  );
+  assert.match(
+    workflowSource,
+    /getBoundingClientRect\(\)[\s\S]*?Math\.max\(8, Math\.min\(workflowTabMenu\.x, window\.innerWidth - rect\.width - 8\)\)[\s\S]*?Math\.max\(8, Math\.min\(workflowTabMenu\.y, window\.innerHeight - rect\.height - 8\)\)/,
+  );
+  assert.match(
+    workflowSource,
+    /document\.addEventListener\("pointerdown", closeWorkflowTabMenuFromOutside\)[\s\S]*?event\.key === "Escape"[\s\S]*?setWorkflowTabMenu\(null\)/,
+  );
+  assert.match(
+    workflowSource,
+    /function activateWorkflow[\s\S]*?setWorkflowTabMenu\(null\)[\s\S]*?if \(workflowId === activeWorkflowId\) return/,
+  );
+});
+
+test("workflow deletion preserves inactive state, selects the right active neighbor and persists snapshots", () => {
+  const deleteWorkflowSource = workflowSource.slice(
+    workflowSource.indexOf("  function deleteWorkflow("),
+    workflowSource.indexOf("  function handleWorkflowTabKeyDown("),
+  );
+  const inactiveDeleteBranch = deleteWorkflowSource.match(
+    /if \(workflowId !== activeWorkflowId\) \{([\s\S]*?)\n    \}/,
+  )?.[1] ?? "";
+  assert.match(
+    workflowSource,
+    /function deleteWorkflow[\s\S]*?if \(workflowTabs\.length <= 1\) return/,
+  );
+  assert.match(
+    workflowSource,
+    /const workflowIndex = workflowTabs\.findIndex[\s\S]*?workflowSnapshotsRef\.current\.delete\(workflowId\)/,
+  );
+  assert.match(
+    workflowSource,
+    /if \(workflowId !== activeWorkflowId\) \{[\s\S]*?setWorkflowTabs\(nextTabs\)[\s\S]*?setWorkflowTabMenu\(null\)[\s\S]*?return;[\s\S]*?\}/,
+  );
+  assert.doesNotMatch(
+    inactiveDeleteBranch,
+    /setActiveWorkflowId|setNodes|setFlow|setSelectedNodeId|setPickerTarget|setRenamingWorkflowId/,
+  );
+  assert.match(
+    workflowSource,
+    /const replacement = workflowTabs\[workflowIndex \+ 1\] \?\? workflowTabs\[workflowIndex - 1\][\s\S]*?normalizeSnapshot\(workflowSnapshotsRef\.current\.get\(replacement\.id\)!\)/,
+  );
+  assert.match(
+    workflowSource,
+    /setActiveWorkflowId\(replacement\.id\)[\s\S]*?setNodes\(snapshot\.nodes\)[\s\S]*?setFlow\(snapshot\.flow\)[\s\S]*?setSelectedNodeId\(null\)[\s\S]*?setPickerTarget\(null\)[\s\S]*?setRenamingWorkflowId\(null\)/,
+  );
+  assert.match(
+    workflowSource,
+    /disabled=\{workflowTabs\.length === 1\}[\s\S]*?aria-disabled=\{workflowTabs\.length === 1\}/,
+  );
+  assert.match(
+    workflowSource,
+    /serializeWorkflowWorkspace\([\s\S]*?workflowTabs,[\s\S]*?activeWorkflowId,[\s\S]*?workflowSnapshotsRef\.current[\s\S]*?saveWorkflowWorkspace\(/,
+  );
+  assert.doesNotMatch(workflowSource, /localStorage|deleteWorkflowWorkspace|confirm\(/);
+});
+
+test("workflow edits persist per project and continue to synchronize through the shared service", () => {
+  assert.match(workflowSource, /export function WorkflowBoard\(/);
+  assert.match(appSource, /const \[workflowRevision, setWorkflowRevision\] = useState\(0\)/);
+  assert.match(appSource, /event\.type === "workflow\.updated"[\s\S]*?setWorkflowRevision\(\(current\) => current \+ 1\)/);
+  assert.match(appSource, /<WorkflowBoard[\s\S]*?revision=\{workflowRevision\}/);
+  assert.match(databaseSource, /CREATE TABLE IF NOT EXISTS workflow_workspaces/);
+  assert.match(databaseSource, /saveWorkflowWorkspace\(projectId, expectedVersion, workspace\)/);
+  assert.match(serverSource, /\/workflow-workspace/);
+  assert.match(serverSource, /events\.emit\("workflow\.updated"/);
+  assert.match(apiSource, /export async function getWorkflowWorkspace/);
+  assert.match(apiSource, /export async function saveWorkflowWorkspace/);
+  assert.match(workflowStoreSource, /WORKFLOW_STATE_KEY_PREFIX = "taskboard\.workflow\.workspace\."/);
+  assert.match(workflowSource, /getWorkflowWorkspace<WorkflowWorkspace>\(projectId/);
+  assert.match(workflowSource, /saveWorkflowWorkspace\([\s\S]*?remoteVersionRef\.current/);
+  assert.match(workflowSource, /saveQueueRef\.current = saveQueueRef\.current\.then/);
+  assert.match(workflowSource, /mergeLegacyWorkspace/);
+  assert.doesNotMatch(workflowSource, /resetLayout|重置布局/);
+});
+
+test("issue workflow choices read the shared service workspace without loading React Flow", () => {
+  assert.match(workflowStoreSource, /INITIAL_WORKFLOW_ID = "issue-delivery"/);
+  assert.match(workflowStoreSource, /INITIAL_WORKFLOW_NAME = "任务处理与交付"/);
+  assert.match(workflowStoreSource, /export function workflowOptionsFromWorkspace\(workspace: unknown\)/);
+  assert.match(appSource, /getWorkflowWorkspace<unknown>\(projectId, signal\)/);
+  assert.match(appSource, /event\.type === "workflow\.updated"/);
+  assert.match(appSource, /refreshWorkflowOptions\(selectedProjectId\)/);
+  assert.match(appSource, /const WorkflowBoard = lazy/);
+  assert.doesNotMatch(appSource, /import \{ WorkflowBoard \} from|from "@xyflow\/react"/);
+  assert.doesNotMatch(appSource, /from "\.\/components\/WorkflowBoard".*workflowStorageKey/);
+});
+
+test("the on-demand inspector exposes real capabilities and the existing node configuration", () => {
+  assert.doesNotMatch(workflowSource, /const AVAILABLE_SKILLS/);
+  assert.match(apiSource, /export async function listWorkflowCapabilities[\s\S]*?\/api\/workflow-capabilities/);
+  assert.match(typesSource, /export interface WorkflowCapabilities[\s\S]*?skills: WorkflowCapabilityOption\[\][\s\S]*?mcpServers: WorkflowMcpServerOption\[\]/);
+  assert.match(workflowSource, /listWorkflowCapabilities\(workspacePath, controller\.signal\)/);
+  assert.match(inspectorSource, /aria-label="可用 Skill"/);
+  assert.match(inspectorSource, /capabilities\?\.skills/);
+  assert.match(inspectorSource, /未发现可用 Skill/);
+  assert.match(inspectorSource, /aria-label="可用 MCP Server"/);
+  assert.match(inspectorSource, /capabilities\?\.mcpServers/);
+  assert.match(inspectorSource, /未发现可用 MCP Server/);
+  assert.match(inspectorSource, /aria-label="Claude Code 模型"/);
+  assert.match(inspectorSource, /Claude Sonnet[\s\S]*?Claude Opus[\s\S]*?Claude Haiku/);
+  assert.match(inspectorSource, /推理强度/);
+  assert.match(inspectorSource, /规划要求/);
+  assert.match(inspectorSource, /任务选择/);
+  for (const action of ["改变状态", "添加评论", "添加标签", "设置优先级", "附加流程运行产物", "记录执行该任务的 Codex 对话"]) {
+    assert.match(inspectorSource, new RegExp(action));
+  }
+  assert.match(inspectorSource, /额外说明/);
+  assert.match(workflowSource, /selectedNode && \([\s\S]*?<WorkflowInspector/);
+});
+
+test("Git and issue configuration render the selected action in each step title", () => {
+  for (const action of ["查看状态", "提交更改", "拉取更新", "推送分支", "创建分支", "切换分支", "合并分支", "创建 Worktree"]) {
+    assert.match(catalogSource, new RegExp(action));
+  }
+  assert.match(inspectorSource, /aria-label="Git 操作"/);
+  assert.match(inspectorSource, /aria-label="Git 提交说明"/);
+  assert.match(inspectorSource, /aria-label="Git 远程仓库"/);
+  assert.match(inspectorSource, /aria-label="Git Worktree 分支"/);
+  assert.match(inspectorSource, /aria-label="Git Worktree 目录"/);
+  assert.match(inspectorSource, /aria-label="任务触发状态"/);
+  assert.match(catalogSource, /function workflowNodeDisplayTitle[\s\S]*?data\.kind === "git"[\s\S]*?data\.kind === "issue-trigger"[\s\S]*?data\.kind === "issue-update"/);
+  assert.match(workflowSource, /displayTitle: workflowNodeDisplayTitle\(node\.data\)/);
+  assert.match(workflowNodeSource, /data\.displayTitle \?\? data\.title/);
+});
+
+test("the execution plan keeps compact ordered items with drag preview and settling animation", () => {
+  assert.match(catalogSource, /kind: "basic-planning"[\s\S]*?acceptsChildren: true/);
+  assert.match(workflowSource, /parentId: "basic-planning"/);
+  assert.match(workflowSource, /interface PlanDragPreview[\s\S]*?sourceOrderIds: string\[\][\s\S]*?targetIndex: number/);
+  assert.match(workflowSource, /function planDragShift[\s\S]*?targetIndex > preview\.sourceIndex[\s\S]*?-distance[\s\S]*?targetIndex < preview\.sourceIndex[\s\S]*?distance/);
+  assert.match(workflowSource, /function reorderPlanItem/);
+  assert.match(workflowSource, /setSettlingNodeId\(node\.id\)/);
+  assert.match(workflowSource, /onNodeDragStart=\{onNodeDragStart\}[\s\S]*?onNodeDrag=\{onNodeDrag\}[\s\S]*?onNodeDragStop=\{onNodeDragStop\}/);
+  assert.match(workflowNodeSource, /workflow-node-compact/);
+  assert.match(workflowNodeSource, /is-drag-shifted[\s\S]*?is-settling[\s\S]*?translate3d\(0, \$\{data\.dragShiftY\}px, 0\)/);
+  assert.match(globalStyles, /\.workflow-node-compact \{[\s\S]*?transform 160ms cubic-bezier\(0\.2, 0\.8, 0\.2, 1\)/);
+  assert.match(globalStyles, /\.workflow-node-compact\.is-settling/);
+});
+
+test("steps are inserted from sequence connectors through a searchable grouped chooser", () => {
+  assert.match(workflowSource, /const openStepPicker = useCallback/);
+  assert.match(workflowSource, /deriveWorkflowLayout\(flow, nodes\)/);
+  assert.match(workflowSource, /edge\.data\.insertion[\s\S]*?openStepPicker\([\s\S]*?sequenceRef[\s\S]*?index/);
+  assert.match(
+    workflowSource,
+    /insertWorkflowNode\([\s\S]*?pickerTarget\.sequenceRef[\s\S]*?pickerTarget\.index/,
+  );
+  assert.match(workflowSource, /aria-label="添加第一个步骤"/);
+  assert.match(pickerSource, /role="dialog"/);
+  assert.match(pickerSource, /placeholder="搜索应用或动作…"/);
+  assert.match(pickerSource, /onSelect\(item\)/);
+});
diff --git a/apps/codex-taskboard/test/cli.test.mjs b/apps/codex-taskboard/test/cli.test.mjs
new file mode 100644
index 000000000..9158c2751
--- /dev/null
+++ b/apps/codex-taskboard/test/cli.test.mjs
@@ -0,0 +1,523 @@
+import assert from "node:assert/strict";
+import path from "node:path";
+import test from "node:test";
+
+import { main, parseArgs } from "../cli/taskctl.mjs";
+
+function capture() {
+  let value = "";
+  return {
+    stream: { write(chunk) { value += chunk; } },
+    json() { return JSON.parse(value); },
+  };
+}
+
+function response(payload, status = 200) {
+  return new Response(JSON.stringify(payload), {
+    status,
+    headers: { "content-type": "application/json" },
+  });
+}
+
+async function run(argv, fetchImplementation, overrides = {}) {
+  const stdout = capture();
+  const stderr = capture();
+  const exitCode = await main(argv, {
+    fetch: fetchImplementation,
+    stdout: stdout.stream,
+    stderr: stderr.stream,
+    env: { CODEX_THREAD_ID: "thread-current" },
+    ...overrides,
+  });
+  return {
+    exitCode,
+    stdout: exitCode === 0 ? stdout.json() : null,
+    stderr: exitCode === 0 ? null : stderr.json(),
+  };
+}
+
+test("parseArgs supports equals syntax and boolean --json", () => {
+  assert.deepEqual(parseArgs(["issue", "list", "--project=local", "--json"]), {
+    resource: "issue",
+    action: "list",
+    operands: [],
+    options: { project: "local", json: true },
+  });
+});
+
+test("project list uses the default local service and adds schemaVersion", async () => {
+  const calls = [];
+  const result = await run(["project", "list"], async (url, init) => {
+    calls.push({ url: url.toString(), init });
+    return response({ projects: [{ id: "local", name: "Local" }] });
+  });
+
+  assert.equal(result.exitCode, 0);
+  assert.deepEqual(result.stdout, {
+    projects: [{ id: "local", name: "Local" }],
+    schemaVersion: 2,
+  });
+  assert.equal(calls[0].url, "http://127.0.0.1:47823/api/projects");
+  assert.equal(calls[0].init.method, "GET");
+  assert.equal(calls[0].init.headers["x-taskboard-client"], "taskctl");
+});
+
+test("CODEX_TASKBOARD_URL overrides the service origin", async () => {
+  let requestedUrl;
+  const result = await run(
+    ["project", "list", "--json"],
+    async (url) => {
+      requestedUrl = url;
+      return response({ projects: [] });
+    },
+    { env: { CODEX_TASKBOARD_URL: "https://tasks.example.test/" } },
+  );
+
+  assert.equal(result.exitCode, 0);
+  assert.equal(requestedUrl.toString(), "https://tasks.example.test/api/projects");
+});
+
+test("project create sends id, name, and an absolute workspace path", async () => {
+  let requestBody;
+  const result = await run(
+    ["project", "create", "--id", "docs", "--name", "Docs", "--workspace-path", "./docs"],
+    async (_url, init) => {
+      requestBody = JSON.parse(init.body);
+      return response({ project: { id: "docs", name: "Docs" } }, 201);
+    },
+  );
+
+  assert.equal(result.exitCode, 0);
+  assert.equal(requestBody.id, "docs");
+  assert.equal(requestBody.name, "Docs");
+  assert.equal(requestBody.workspacePath, path.resolve("docs"));
+});
+
+test("issue list serializes project and status filters", async () => {
+  let requestedUrl;
+  const result = await run(
+    ["issue", "list", "--project", "local", "--status", "todo"],
+    async (url) => {
+      requestedUrl = url;
+      return response({ tasks: [] });
+    },
+  );
+
+  assert.equal(result.exitCode, 0);
+  assert.equal(requestedUrl.searchParams.get("projectId"), "local");
+  assert.equal(requestedUrl.searchParams.get("status"), "todo");
+});
+
+test("issue commands accept in-review, blocked, and canceled statuses", async () => {
+  for (const status of ["in_review", "blocked", "canceled"]) {
+    let requestedUrl;
+    const listResult = await run(["issue", "list", "--status", status], async (url) => {
+      requestedUrl = url;
+      return response({ tasks: [] });
+    });
+    assert.equal(listResult.exitCode, 0);
+    assert.equal(requestedUrl.searchParams.get("status"), status);
+  }
+
+  let createBody;
+  const createResult = await run(
+    ["issue", "create", "--project", "local", "--title", "Review me", "--status", "in_review"],
+    async (_url, init) => {
+      createBody = JSON.parse(init.body);
+      return response({ task: { id: "TASK-1", ...createBody, version: 1 } }, 201);
+    },
+  );
+  assert.equal(createResult.exitCode, 0);
+  assert.equal(createBody.status, "in_review");
+
+  let moveBody;
+  const moveResult = await run(
+    ["issue", "move", "TASK-1", "--status", "blocked", "--if-version", "1"],
+    async (_url, init) => {
+      moveBody = JSON.parse(init.body);
+      return response({ task: { id: "TASK-1", status: "blocked", version: 2 } });
+    },
+  );
+  assert.equal(moveResult.exitCode, 0);
+  assert.equal(moveBody.status, "blocked");
+
+  let updateBody;
+  const updateResult = await run(
+    ["issue", "update", "TASK-1", "--status", "canceled", "--if-version", "2"],
+    async (_url, init) => {
+      updateBody = JSON.parse(init.body);
+      return response({ task: { id: "TASK-1", status: "canceled", version: 3 } });
+    },
+  );
+  assert.equal(updateResult.exitCode, 0);
+  assert.equal(updateBody.status, "canceled");
+});
+
+test("invalid status errors list every accepted status", async () => {
+  const result = await run(
+    ["issue", "list", "--status", "started"],
+    async () => assert.fail("fetch should not be called"),
+  );
+
+  assert.equal(result.exitCode, 2);
+  assert.match(result.stderr.error.message, /in_review/);
+  assert.match(result.stderr.error.message, /blocked/);
+  assert.match(result.stderr.error.message, /canceled/);
+});
+
+test("issue create reads a description file and parses labels", async () => {
+  let requestBody;
+  const result = await run(
+    [
+      "issue",
+      "create",
+      "--project",
+      "local",
+      "--title",
+      "Fix auth",
+      "--description-file",
+      "issue.md",
+      "--labels",
+      "bug, auth,bug",
+    ],
+    async (_url, init) => {
+      requestBody = JSON.parse(init.body);
+      return response({ task: { id: "TASK-1", ...requestBody, version: 1 } }, 201);
+    },
+    { readFile: async () => "Acceptance criteria" },
+  );
+
+  assert.equal(result.exitCode, 0);
+  assert.deepEqual(requestBody, {
+    projectId: "local",
+    title: "Fix auth",
+    description: "Acceptance criteria",
+    status: "backlog",
+    priority: "none",
+    labels: ["bug", "auth"],
+    threadId: "thread-current",
+  });
+});
+
+test("issue update sends an explicit optimistic concurrency version", async () => {
+  const calls = [];
+  const result = await run(
+    ["issue", "update", "TASK/1", "--title", "New title", "--if-version", "7"],
+    async (url, init) => {
+      calls.push({ url, init });
+      return response({ task: { id: "TASK/1", title: "New title", version: 8 } });
+    },
+  );
+
+  assert.equal(result.exitCode, 0);
+  assert.equal(calls.length, 1);
+  assert.equal(calls[0].url.pathname, "/api/tasks/TASK%2F1");
+  assert.deepEqual(JSON.parse(calls[0].init.body), {
+    title: "New title",
+    threadId: "thread-current",
+    version: 7,
+  });
+});
+
+test("issue update binds one worktree context", async () => {
+  let requestBody;
+  const result = await run(
+    [
+      "issue", "update", "TASK-1",
+      "--worktree-path", "../taskboard-worktree",
+      "--worktree-branch", "worktree/taskboard",
+      "--if-version", "4",
+    ],
+    async (_url, init) => {
+      requestBody = JSON.parse(init.body);
+      return response({ task: { id: "TASK-1", ...requestBody, version: 5 } });
+    },
+    { cwd: "/work/repo" },
+  );
+
+  assert.equal(result.exitCode, 0);
+  assert.deepEqual(requestBody, {
+    developmentContext: {
+      type: "worktree",
+      path: path.resolve("/work/repo", "../taskboard-worktree"),
+      branch: "worktree/taskboard",
+    },
+    threadId: "thread-current",
+    version: 4,
+  });
+});
+
+test("issue update rejects simultaneous branch and worktree bindings", async () => {
+  let called = false;
+  const result = await run(
+    ["issue", "update", "TASK-1", "--git-branch", "feature/taskboard", "--worktree-path", "../taskboard-worktree"],
+    async () => {
+      called = true;
+      return response({});
+    },
+    { cwd: "/work/repo" },
+  );
+  assert.equal(result.exitCode, 2);
+  assert.equal(called, false);
+  assert.match(result.stderr.error.message, /either --git-branch or --worktree-path/);
+});
+
+test("issue move fetches the current version when --if-version is omitted", async () => {
+  const calls = [];
+  const result = await run(["issue", "move", "TASK-1", "--status", "done"], async (url, init) => {
+    calls.push({ url, init });
+    if (init.method === "GET") return response({ task: { id: "TASK-1", version: 3 } });
+    return response({ task: { id: "TASK-1", status: "done", version: 4 } });
+  });
+
+  assert.equal(result.exitCode, 0);
+  assert.equal(calls.length, 2);
+  assert.deepEqual(JSON.parse(calls[1].init.body), {
+    status: "done",
+    threadId: "thread-current",
+    version: 3,
+  });
+});
+
+test("an explicit --thread-id overrides CODEX_THREAD_ID on issue writes", async () => {
+  let requestBody;
+  const result = await run(
+    ["issue", "update", "TASK-1", "--title", "Attributed", "--thread-id", "thread-9", "--if-version", "2"],
+    async (_url, init) => {
+      requestBody = JSON.parse(init.body);
+      return response({ task: { id: "TASK-1", threadId: "thread-9", version: 3 } });
+    },
+  );
+
+  assert.equal(result.exitCode, 0);
+  assert.deepEqual(requestBody, { title: "Attributed", threadId: "thread-9", version: 2 });
+  assert.equal(result.stdout.task.threadId, "thread-9");
+});
+
+test("issue restore uses the mutation thread and optimistic version", async () => {
+  let requestBody;
+  const result = await run(
+    ["issue", "restore", "TASK-1", "--if-version", "5"],
+    async (url, init) => {
+      assert.equal(url.pathname, "/api/tasks/TASK-1/restore");
+      requestBody = JSON.parse(init.body);
+      return response({ task: { id: "TASK-1", threadId: "thread-current", version: 6 } });
+    },
+  );
+  assert.equal(result.exitCode, 0);
+  assert.deepEqual(requestBody, { threadId: "thread-current", version: 5 });
+});
+
+test("issue relation add and remove use typed relation endpoints", async () => {
+  const calls = [];
+  const addResult = await run(
+    [
+      "issue", "relation", "add", "TASK/1",
+      "--type", "blocked_by",
+      "--issue", "TASK/2",
+      "--if-version", "4",
+    ],
+    async (url, init) => {
+      calls.push({ url, init });
+      return response({
+        task: { id: "TASK/1", version: 5 },
+        relatedTask: { id: "TASK/2", version: 2 },
+      });
+    },
+  );
+  const removeResult = await run(
+    [
+      "issue", "relation", "remove", "TASK/1",
+      "--type", "related",
+      "--issue", "TASK/3",
+      "--if-version", "5",
+    ],
+    async (url, init) => {
+      calls.push({ url, init });
+      return response({
+        task: { id: "TASK/1", version: 6 },
+        relatedTask: { id: "TASK/3", version: 1 },
+      });
+    },
+  );
+
+  assert.equal(addResult.exitCode, 0);
+  assert.equal(removeResult.exitCode, 0);
+  assert.equal(calls[0].url.pathname, "/api/tasks/TASK%2F1/relations/blocked_by/TASK%2F2");
+  assert.equal(calls[0].init.method, "POST");
+  assert.deepEqual(JSON.parse(calls[0].init.body), {
+    threadId: "thread-current",
+    version: 4,
+  });
+  assert.equal(calls[1].url.pathname, "/api/tasks/TASK%2F1/relations/related/TASK%2F3");
+  assert.equal(calls[1].init.method, "DELETE");
+  assert.deepEqual(JSON.parse(calls[1].init.body), {
+    threadId: "thread-current",
+    version: 5,
+  });
+});
+
+test("issue relation validates its action and relation type before fetching", async () => {
+  for (const argv of [
+    ["issue", "relation", "replace", "TASK-1", "--type", "related", "--issue", "TASK-2"],
+    ["issue", "relation", "add", "TASK-1", "--type", "duplicate", "--issue", "TASK-2"],
+    ["issue", "relation", "add", "TASK-1", "--type", "related"],
+  ]) {
+    const result = await run(argv, async () => assert.fail("fetch should not be called"));
+    assert.equal(result.exitCode, 2);
+    assert.equal(result.stderr.error.code, "USAGE_ERROR");
+  }
+});
+
+test("comment list and add use the issue comments endpoint", async () => {
+  const calls = [];
+  const listResult = await run(["comment", "list", "TASK/1"], async (url, init) => {
+    calls.push({ url, init });
+    return response({ comments: [] });
+  });
+  const addResult = await run(
+    ["comment", "add", "TASK/1", "--body", "Verified locally"],
+    async (url, init) => {
+      calls.push({ url, init });
+      return response({ comment: { id: "comment-1", body: "Verified locally", version: 1 } }, 201);
+    },
+  );
+
+  assert.equal(listResult.exitCode, 0);
+  assert.equal(addResult.exitCode, 0);
+  assert.equal(calls[0].url.pathname, "/api/tasks/TASK%2F1/comments");
+  assert.equal(calls[0].init.method, "GET");
+  assert.equal(calls[1].url.pathname, "/api/tasks/TASK%2F1/comments");
+  assert.deepEqual(JSON.parse(calls[1].init.body), {
+    body: "Verified locally",
+    threadId: "thread-current",
+  });
+});
+
+test("comment update and delete require an explicit version", async () => {
+  const calls = [];
+  const updateResult = await run(
+    ["comment", "update", "comment/1", "--body", "Updated", "--if-version", "3"],
+    async (url, init) => {
+      calls.push({ url, init });
+      return response({ comment: { id: "comment/1", body: "Updated", version: 4 } });
+    },
+  );
+  const deleteResult = await run(
+    ["comment", "delete", "comment/1", "--if-version", "4"],
+    async (url, init) => {
+      calls.push({ url, init });
+      return response({});
+    },
+  );
+
+  assert.equal(updateResult.exitCode, 0);
+  assert.equal(deleteResult.exitCode, 0);
+  assert.equal(calls[0].url.pathname, "/api/comments/comment%2F1");
+  assert.deepEqual(JSON.parse(calls[0].init.body), {
+    body: "Updated",
+    threadId: "thread-current",
+    version: 3,
+  });
+  assert.equal(calls[1].init.method, "DELETE");
+  assert.deepEqual(JSON.parse(calls[1].init.body), { threadId: "thread-current", version: 4 });
+
+  const missingVersion = await run(
+    ["comment", "delete", "comment-1"],
+    async () => assert.fail("fetch should not be called"),
+  );
+  assert.equal(missingVersion.exitCode, 2);
+  assert.match(missingVersion.stderr.error.message, /--if-version/);
+});
+
+test("context current selects the project with the most specific matching workspace", async () => {
+  const repoWorkspace = path.join(path.parse(process.cwd()).root, "work", "repo");
+  const appWorkspace = path.join(repoWorkspace, "packages", "app");
+  const result = await run(
+    ["context", "current", "--cwd", appWorkspace],
+    async () => response({ projects: [
+      { id: "local", name: "Local", workspacePath: null },
+      { id: "repo", workspacePath: repoWorkspace },
+      { id: "app", workspacePath: appWorkspace },
+    ] }),
+    { cwd: "/unused" },
+  );
+
+  assert.equal(result.exitCode, 0);
+  assert.equal(result.stdout.cwd, appWorkspace);
+  assert.deepEqual(result.stdout.project, {
+    id: "app",
+    workspacePath: appWorkspace,
+  });
+});
+
+test("context current falls back to the local project", async () => {
+  const result = await run(
+    ["context", "current", "--cwd", "/unmatched"],
+    async () => response({ projects: [
+      { id: "other", workspacePath: "/work/other" },
+      { id: "local", name: "Local", workspacePath: null },
+    ] }),
+  );
+
+  assert.equal(result.exitCode, 0);
+  assert.equal(result.stdout.project.id, "local");
+});
+
+test("issue and comment writes require Codex conversation attribution", async () => {
+  const issueResult = await run(
+    ["issue", "update", "TASK-1", "--title", "No attribution", "--if-version", "1"],
+    async () => assert.fail("fetch should not be called"),
+    { env: {} },
+  );
+  assert.equal(issueResult.exitCode, 2);
+  assert.match(issueResult.stderr.error.message, /--thread-id or CODEX_THREAD_ID/);
+
+  const commentResult = await run(
+    ["comment", "add", "TASK-1", "--body", "No attribution"],
+    async () => assert.fail("fetch should not be called"),
+    { env: {} },
+  );
+  assert.equal(commentResult.exitCode, 2);
+  assert.match(commentResult.stderr.error.message, /--thread-id or CODEX_THREAD_ID/);
+});
+
+test("manual linked-thread options and commands are no longer accepted", async () => {
+  const optionResult = await run(
+    ["issue", "update", "TASK-1", "--title", "Invalid", "--linked-thread-id", "thread-1"],
+    async () => assert.fail("fetch should not be called"),
+  );
+  assert.equal(optionResult.exitCode, 2);
+  assert.match(optionResult.stderr.error.message, /Unknown option --linked-thread-id/);
+
+  const commandResult = await run(
+    ["issue", "link-thread", "TASK-1", "--thread-id", "thread-1"],
+    async () => assert.fail("fetch should not be called"),
+  );
+  assert.equal(commandResult.exitCode, 2);
+  assert.match(commandResult.stderr.error.message, /Expected one of/);
+});
+
+test("API conflicts produce stable JSON on stderr and exit code 5", async () => {
+  const result = await run(
+    ["issue", "archive", "TASK-1", "--if-version", "1"],
+    async () => response({ error: { code: "VERSION_CONFLICT", message: "Task changed" } }, 409),
+  );
+
+  assert.equal(result.exitCode, 5);
+  assert.deepEqual(result.stderr, {
+    schemaVersion: 2,
+    error: { code: "VERSION_CONFLICT", message: "Task changed" },
+  });
+});
+
+test("usage errors are stable and never call the service", async () => {
+  const result = await run(
+    ["issue", "create", "--project", "local"],
+    async () => assert.fail("fetch should not be called"),
+  );
+
+  assert.equal(result.exitCode, 2);
+  assert.equal(result.stderr.error.code, "USAGE_ERROR");
+  assert.match(result.stderr.error.message, /--title/);
+});
diff --git a/apps/codex-taskboard/test/cloud-companion.test.mjs b/apps/codex-taskboard/test/cloud-companion.test.mjs
new file mode 100644
index 000000000..94506290e
--- /dev/null
+++ b/apps/codex-taskboard/test/cloud-companion.test.mjs
@@ -0,0 +1,772 @@
+import assert from "node:assert/strict";
+import { mkdtemp, readFile, rm, stat } from "node:fs/promises";
+import os from "node:os";
+import path from "node:path";
+import test from "node:test";
+
+import { main } from "../cli/taskctl.mjs";
+import { createTaskboardServer } from "../server/index.mjs";
+
+const temporaryDirectories = [];
+const LAN_SHARED_SECRET = "test-taskboard-secret";
+
+test.afterEach(async () => {
+  while (temporaryDirectories.length > 0) {
+    await rm(temporaryDirectories.pop(), { recursive: true, force: true });
+  }
+});
+
+function capture() {
+  let value = "";
+  return {
+    stream: { write(chunk) { value += chunk; } },
+    text() { return value; },
+    json() { return JSON.parse(value); },
+  };
+}
+
+function jsonResponse(payload, status = 200) {
+  return new Response(JSON.stringify(payload), {
+    status,
+    headers: { "content-type": "application/json" },
+  });
+}
+
+function assertPrivateMode(actual, expected) {
+  if (process.platform !== "win32") assert.equal(actual & 0o777, expected);
+}
+
+async function runCli(argv, overrides = {}) {
+  const stdout = capture();
+  const stderr = capture();
+  const exitCode = await main(argv, {
+    stdout: stdout.stream,
+    stderr: stderr.stream,
+    env: {},
+    ...overrides,
+  });
+  return { exitCode, stdout, stderr };
+}
+
+async function temporaryConfigPath(name) {
+  const directory = await mkdtemp(path.join(os.tmpdir(), "taskboard-companion-"));
+  temporaryDirectories.push(directory);
+  return path.join(directory, name);
+}
+
+async function importCloudConfig() {
+  return import("../server/cloud-config.mjs");
+}
+
+async function importCloudProxy() {
+  return import("../server/cloud-proxy.mjs");
+}
+
+function memoryConfigStore(overrides = {}) {
+  const state = {
+    version: 1,
+    remoteUrl: "https://tasks.example.test",
+    actorName: "Alice",
+    sharedKey: "two-person-shared-key",
+    projectMappings: {},
+    ...overrides,
+  };
+  return {
+    state,
+    async read() {
+      return structuredClone(state);
+    },
+    async setProjectWorkspace(projectId, workspacePath) {
+      state.projectMappings[projectId] = workspacePath;
+      return structuredClone(state);
+    },
+  };
+}
+
+function firstLanAddress() {
+  return Object.values(os.networkInterfaces())
+    .flat()
+    .find((entry) => entry?.family === "IPv4" && !entry.internal)?.address ?? null;
+}
+
+test("cloud config persists Basic Auth credentials and device mappings in a mode-0600 file", async () => {
+  const { createCloudConfigStore } = await importCloudConfig();
+  const configPath = await temporaryConfigPath("companion.json");
+  const store = createCloudConfigStore({ configPath });
+
+  await store.configure({
+    remoteUrl: "https://tasks.example.test/",
+    actorName: "Alice",
+    sharedKey: "two-person-shared-key",
+  });
+  await store.setProjectWorkspace("portfolio", "/Users/alice/Documents/portfolio");
+
+  assert.deepEqual(await store.read(), {
+    version: 1,
+    remoteUrl: "https://tasks.example.test",
+    actorName: "Alice",
+    sharedKey: "two-person-shared-key",
+    projectMappings: {
+      portfolio: "/Users/alice/Documents/portfolio",
+    },
+  });
+  assertPrivateMode((await stat(configPath)).mode, 0o600);
+  assert.deepEqual(JSON.parse(await readFile(configPath, "utf8")), await store.read());
+});
+
+test("cloud config only accepts HTTPS origins, except loopback HTTP used in development", async () => {
+  const { createCloudConfigStore } = await importCloudConfig();
+
+  for (const remoteUrl of [
+    "http://tasks.example.test",
+    "ftp://tasks.example.test",
+    "https://tasks.example.test/path",
+  ]) {
+    const store = createCloudConfigStore({
+      configPath: await temporaryConfigPath("invalid.json"),
+    });
+    await assert.rejects(
+      store.configure({ remoteUrl, actorName: "Alice", sharedKey: "shared-key" }),
+      (error) => error?.code === "INVALID_CLOUD_URL",
+      remoteUrl,
+    );
+  }
+
+  for (const remoteUrl of [
+    "https://tasks.example.test",
+    "http://127.0.0.1:8787",
+    "http://localhost:8787",
+  ]) {
+    const store = createCloudConfigStore({
+      configPath: await temporaryConfigPath("valid.json"),
+    });
+    await store.configure({ remoteUrl, actorName: "Alice", sharedKey: "shared-key" });
+    assert.equal((await store.read()).remoteUrl, remoteUrl);
+  }
+});
+
+test("cloud proxy replaces client identity with Basic Auth and makes exactly one upstream request", async () => {
+  const { createCloudProxy } = await importCloudProxy();
+  const calls = [];
+  const configStore = memoryConfigStore();
+  const proxy = createCloudProxy({
+    configStore,
+    fetch: async (url, init) => {
+      calls.push({ url: url.toString(), init });
+      return jsonResponse({
+        task: {
+          id: "REMOTE-1",
+          creatorType: "agent",
+          creatorId: "codex-agent",
+          creatorName: "Codex Agent",
+        },
+      }, 201);
+    },
+  });
+
+  const response = await proxy.forward(new Request(
+    "http://127.0.0.1:47823/api/tasks?source=taskctl",
+    {
+      method: "POST",
+      headers: {
+        authorization: "Bearer client-supplied-token",
+        "content-type": "application/json",
+        "x-taskboard-client": "taskctl",
+        "x-taskboard-user-id": "spoofed-user",
+        "x-taskboard-user-name": "Spoofed User",
+      },
+      body: JSON.stringify({
+        projectId: "portfolio",
+        title: "Cloud issue",
+        threadId: "thread-cloud",
+      }),
+    },
+  ));
+
+  assert.equal(response.status, 201);
+  assert.equal(calls.length, 1);
+  assert.equal(calls[0].url, "https://tasks.example.test/api/tasks?source=taskctl");
+  assert.equal(calls[0].init.method, "POST");
+  assert.equal(
+    new Headers(calls[0].init.headers).get("authorization"),
+    `Basic ${Buffer.from("Alice:two-person-shared-key").toString("base64")}`,
+  );
+  assert.equal(new Headers(calls[0].init.headers).get("x-taskboard-client"), "taskctl");
+  assert.equal(new Headers(calls[0].init.headers).has("x-taskboard-user-id"), false);
+  assert.equal(new Headers(calls[0].init.headers).has("x-taskboard-user-name"), false);
+  assert.deepEqual(await response.json(), {
+    task: {
+      id: "REMOTE-1",
+      creatorType: "agent",
+      creatorId: "codex-agent",
+      creatorName: "Codex Agent",
+    },
+  });
+});
+
+test("configured cloud mode fails explicitly and never falls back to the local database", async () => {
+  const { createCloudProxy } = await importCloudProxy();
+  let upstreamCalls = 0;
+  let localFallbackCalls = 0;
+  const proxy = createCloudProxy({
+    configStore: memoryConfigStore(),
+    fetch: async () => {
+      upstreamCalls += 1;
+      throw new Error("network unavailable");
+    },
+    localFallback: async () => {
+      localFallbackCalls += 1;
+      return jsonResponse({ projects: [{ id: "local" }] });
+    },
+  });
+
+  await assert.rejects(
+    proxy.forward(new Request("http://127.0.0.1:47823/api/projects")),
+    (error) => error?.code === "REMOTE_UNAVAILABLE",
+  );
+  assert.equal(upstreamCalls, 1);
+  assert.equal(localFallbackCalls, 0);
+});
+
+test("cloud proxy preserves upstream 401 responses and binary attachment streams", async () => {
+  const { createCloudProxy } = await importCloudProxy();
+  const unauthorized = new Response("invalid shared key", {
+    status: 401,
+    headers: { "content-type": "text/plain" },
+  });
+  const responses = [
+    unauthorized,
+    new Response(Uint8Array.from([0, 1, 2, 255]), {
+      headers: { "content-type": "application/octet-stream" },
+    }),
+  ];
+  const proxy = createCloudProxy({
+    configStore: memoryConfigStore(),
+    fetch: async () => responses.shift(),
+  });
+
+  const authResponse = await proxy.forward(
+    new Request("http://127.0.0.1:47823/api/projects"),
+  );
+  assert.equal(authResponse, unauthorized);
+  assert.equal(await authResponse.text(), "invalid shared key");
+
+  const attachmentResponse = await proxy.forward(
+    new Request("http://127.0.0.1:47823/api/attachments/file/content"),
+  );
+  assert.deepEqual(
+    [...new Uint8Array(await attachmentResponse.arrayBuffer())],
+    [0, 1, 2, 255],
+  );
+});
+
+test("cloud routing keeps machine-specific capability endpoints in the local companion", async () => {
+  const { isLocalCompanionRoute } = await importCloudProxy();
+
+  for (const pathname of [
+    "/health",
+    "/api/meta",
+    "/api/device-workspaces",
+    "/api/workflow-capabilities",
+    "/api/projects/portfolio/development-contexts",
+    "/api/local/cloud-session",
+    "/api/local/project-mappings/portfolio",
+  ]) {
+    assert.equal(isLocalCompanionRoute(pathname), true, pathname);
+  }
+
+  for (const pathname of [
+    "/api/projects",
+    "/api/projects/portfolio/workflow-workspace",
+    "/api/tasks",
+    "/api/tasks/PORTFOLIO-1",
+    "/api/comments/comment-1",
+    "/api/attachments/attachment-1",
+    "/api/events",
+  ]) {
+    assert.equal(isLocalCompanionRoute(pathname), false, pathname);
+  }
+});
+
+test("project creation stores workspacePath locally and never sends it to cloud", async () => {
+  const { createCloudProxy } = await importCloudProxy();
+  const configStore = memoryConfigStore();
+  let upstreamBody;
+  let upstreamCalls = 0;
+  const proxy = createCloudProxy({
+    configStore,
+    fetch: async (_url, init) => {
+      upstreamCalls += 1;
+      upstreamBody = JSON.parse(init.body);
+      return jsonResponse({
+        project: {
+          id: "portfolio",
+          name: "Portfolio",
+          issueCount: 0,
+        },
+      }, 201);
+    },
+  });
+
+  const response = await proxy.forward(new Request(
+    "http://127.0.0.1:47823/api/projects",
+    {
+      method: "POST",
+      headers: { "content-type": "application/json" },
+      body: JSON.stringify({
+        id: "portfolio",
+        name: "Portfolio",
+        workspacePath: "/Users/alice/Documents/portfolio",
+      }),
+    },
+  ));
+
+  assert.equal(upstreamCalls, 1);
+  assert.deepEqual(upstreamBody, {
+    id: "portfolio",
+    name: "Portfolio",
+  });
+  assert.equal(
+    configStore.state.projectMappings.portfolio,
+    "/Users/alice/Documents/portfolio",
+  );
+  assert.equal(
+    (await response.json()).project.workspacePath,
+    "/Users/alice/Documents/portfolio",
+  );
+});
+
+test("project lists overlay this device's workspace mappings and discard remote paths", async () => {
+  const { createCloudProxy } = await importCloudProxy();
+  const configStore = memoryConfigStore({
+    projectMappings: {
+      portfolio: "/Users/alice/Documents/portfolio",
+    },
+  });
+  const proxy = createCloudProxy({
+    configStore,
+    fetch: async () => jsonResponse({
+      projects: [
+        { id: "portfolio", name: "Portfolio", workspacePath: "/server/path" },
+        { id: "shared", name: "Shared", workspacePath: "/another/server/path" },
+      ],
+    }),
+  });
+
+  const response = await proxy.forward(
+    new Request("http://127.0.0.1:47823/api/projects"),
+  );
+  assert.deepEqual((await response.json()).projects, [
+    {
+      id: "portfolio",
+      name: "Portfolio",
+      workspacePath: "/Users/alice/Documents/portfolio",
+    },
+    {
+      id: "shared",
+      name: "Shared",
+      workspacePath: null,
+    },
+  ]);
+});
+
+test("task mutations do not send absolute worktree paths to cloud", async () => {
+  const { createCloudProxy } = await importCloudProxy();
+  let upstreamBody;
+  const proxy = createCloudProxy({
+    configStore: memoryConfigStore(),
+    fetch: async (_url, init) => {
+      upstreamBody = JSON.parse(init.body);
+      return jsonResponse({ task: { id: "PORTFOLIO-1" } });
+    },
+  });
+
+  await proxy.forward(new Request(
+    "http://127.0.0.1:47823/api/tasks/PORTFOLIO-1",
+    {
+      method: "PATCH",
+      headers: { "content-type": "application/json" },
+      body: JSON.stringify({
+        version: 3,
+        developmentContext: {
+          type: "worktree",
+          path: "/Users/alice/.codex/worktrees/portfolio-1",
+          branch: "feature/portfolio-1",
+        },
+      }),
+    },
+  ));
+
+  assert.deepEqual(upstreamBody, {
+    version: 3,
+    developmentContext: {
+      type: "worktree",
+      branch: "feature/portfolio-1",
+    },
+  });
+});
+
+test("workflow mutations remove structured git worktree paths without altering other path fields or text", async () => {
+  const { createCloudProxy } = await importCloudProxy();
+  let upstreamBody;
+  const proxy = createCloudProxy({
+    configStore: memoryConfigStore(),
+    fetch: async (_url, init) => {
+      upstreamBody = JSON.parse(init.body);
+      return jsonResponse({ workflow: { projectId: "portfolio", version: 5 } });
+    },
+  });
+
+  await proxy.forward(new Request(
+    "http://127.0.0.1:47823/api/projects/portfolio/workflow-workspace",
+    {
+      method: "PUT",
+      headers: { "content-type": "application/json" },
+      body: JSON.stringify({
+        version: 4,
+        workspace: {
+          version: 1,
+          tabs: [{ id: "delivery", name: "Delivery" }],
+          activeWorkflowId: "delivery",
+          snapshots: {
+            delivery: {
+              nodes: [{
+                id: "git",
+                data: {
+                  kind: "git",
+                  branch: "feature/cloud",
+                  gitWorktreePath: "/Users/alice/.codex/worktrees/cloud",
+                  description: "Keep this text: /Users/alice/.codex/worktrees/cloud",
+                  config: { path: "/third-party/runtime/path" },
+                  planItems: [{
+                    title: "Nested Git step",
+                    gitWorktreePath: "/Users/alice/.codex/worktrees/nested",
+                    path: "/third-party/nested/path",
+                  }],
+                },
+              }],
+              flow: { version: 2, root: { items: [] } },
+              selectedNodeId: "git",
+            },
+          },
+        },
+      }),
+    },
+  ));
+
+  const data = upstreamBody.workspace.snapshots.delivery.nodes[0].data;
+  assert.equal(Object.hasOwn(data, "gitWorktreePath"), false);
+  assert.equal(Object.hasOwn(data.planItems[0], "gitWorktreePath"), false);
+  assert.equal(data.branch, "feature/cloud");
+  assert.equal(
+    data.description,
+    "Keep this text: /Users/alice/.codex/worktrees/cloud",
+  );
+  assert.equal(data.config.path, "/third-party/runtime/path");
+  assert.equal(data.planItems[0].path, "/third-party/nested/path");
+});
+
+test("two companions map the same cloud project to different local paths", async () => {
+  const { createCloudConfigStore } = await importCloudConfig();
+  const alice = createCloudConfigStore({
+    configPath: await temporaryConfigPath("alice.json"),
+  });
+  const bob = createCloudConfigStore({
+    configPath: await temporaryConfigPath("bob.json"),
+  });
+  for (const store of [alice, bob]) {
+    await store.configure({
+      remoteUrl: "https://tasks.example.test",
+      actorName: store === alice ? "Alice" : "Bob",
+      sharedKey: "two-person-shared-key",
+    });
+  }
+  await alice.setProjectWorkspace("portfolio", "/Users/alice/Documents/portfolio");
+  await bob.setProjectWorkspace("portfolio", "/Users/bob/src/portfolio");
+
+  assert.equal(
+    (await alice.read()).projectMappings.portfolio,
+    "/Users/alice/Documents/portfolio",
+  );
+  assert.equal(
+    (await bob.read()).projectMappings.portfolio,
+    "/Users/bob/src/portfolio",
+  );
+  assert.doesNotMatch(JSON.stringify(await alice.read()), /\/Users\/bob/);
+  assert.doesNotMatch(JSON.stringify(await bob.read()), /\/Users\/alice/);
+});
+
+test("configured server proxies business APIs without touching local rows and advertises polling", async () => {
+  const directory = await mkdtemp(path.join(os.tmpdir(), "taskboard-cloud-server-"));
+  temporaryDirectories.push(directory);
+  const configPath = path.join(directory, "companion.json");
+  const { createCloudConfigStore } = await importCloudConfig();
+  await createCloudConfigStore({ configPath }).configure({
+    remoteUrl: "https://tasks.example.test",
+    actorName: "Alice",
+    sharedKey: "two-person-shared-key",
+  });
+  const upstreamCalls = [];
+  const app = createTaskboardServer({
+    dataDirectory: directory,
+    cloudConfigPath: configPath,
+    remoteFetch: async (url, init) => {
+      upstreamCalls.push({ url: url.toString(), init });
+      return jsonResponse({ tasks: [{ id: "REMOTE-1", projectId: "portfolio" }] });
+    },
+  });
+  const address = await app.listen({ port: 0 });
+  const baseUrl = `http://127.0.0.1:${address.port}`;
+
+  try {
+    const metadata = await fetch(`${baseUrl}/api/meta`).then((response) => response.json());
+    assert.deepEqual(metadata, {
+      mode: "cloud",
+      realtime: { transport: "poll", intervalMs: 2000 },
+      localCapabilities: { available: true },
+      manageTaskboardSkillPath: app.options.skillPath,
+      capabilities: { localAiChat: true },
+    });
+    const session = await fetch(`${baseUrl}/api/local/cloud-session`)
+      .then((response) => response.json());
+    assert.equal(Object.hasOwn(session, "sharedKey"), false);
+
+    const response = await fetch(`${baseUrl}/api/tasks`);
+    assert.equal(response.status, 200);
+    assert.equal(upstreamCalls.length, 1);
+    assert.equal(upstreamCalls[0].url, "https://tasks.example.test/api/tasks");
+    assert.equal(app.database.listTasks({}).length, 0);
+  } finally {
+    await app.close();
+  }
+});
+
+test("cloud mode exposes machine capabilities only to loopback while local mode keeps LAN access", async (t) => {
+  const lanAddress = firstLanAddress();
+  if (!lanAddress) {
+    t.skip("No non-loopback IPv4 interface is available");
+    return;
+  }
+  const directory = await mkdtemp(path.join(os.tmpdir(), "taskboard-cloud-lan-"));
+  temporaryDirectories.push(directory);
+  const configPath = path.join(directory, "companion.json");
+  const { createCloudConfigStore } = await importCloudConfig();
+  const store = createCloudConfigStore({ configPath });
+  await store.configure({
+    remoteUrl: "https://tasks.example.test",
+    actorName: "Alice",
+    sharedKey: "two-person-shared-key",
+  });
+  let upstreamCalls = 0;
+  const app = createTaskboardServer({
+    dataDirectory: directory,
+    cloudConfigPath: configPath,
+    sharedSecret: LAN_SHARED_SECRET,
+    remoteFetch: async () => {
+      upstreamCalls += 1;
+      return jsonResponse({ projects: [] });
+    },
+  });
+  const address = await app.listen({ host: "0.0.0.0", port: 0 });
+  const lanBaseUrl = `http://${lanAddress}:${address.port}`;
+  const lanHeaders = {
+    authorization: `Basic ${Buffer.from(`codex:${LAN_SHARED_SECRET}`).toString("base64")}`,
+  };
+
+  try {
+    for (const pathname of [
+      "/api/meta",
+      "/api/device-workspaces",
+      "/api/workflow-capabilities",
+      "/api/projects/portfolio/development-contexts",
+    ]) {
+      const response = await fetch(`${lanBaseUrl}${pathname}`, { headers: lanHeaders });
+      assert.equal(response.status, 403, pathname);
+      assert.equal((await response.json()).error.code, "LOCAL_ONLY", pathname);
+    }
+    const projectResponse = await fetch(`${lanBaseUrl}/api/projects`, { headers: lanHeaders });
+    assert.equal(projectResponse.status, 403);
+    assert.equal((await projectResponse.json()).error.code, "LOCAL_ONLY");
+    const taskResponse = await fetch(`${lanBaseUrl}/api/tasks`, {
+      method: "POST",
+      headers: { ...lanHeaders, "content-type": "application/json" },
+      body: JSON.stringify({ projectId: "portfolio", title: "Must not proxy" }),
+    });
+    assert.equal(taskResponse.status, 403);
+    assert.equal((await taskResponse.json()).error.code, "LOCAL_ONLY");
+    assert.equal(upstreamCalls, 0);
+
+    await store.clearCloud();
+    const localResponse = await fetch(`${lanBaseUrl}/api/device-workspaces`, { headers: lanHeaders });
+    assert.equal(localResponse.status, 200);
+    const localProjects = await fetch(`${lanBaseUrl}/api/projects`, { headers: lanHeaders });
+    assert.equal(localProjects.status, 200);
+  } finally {
+    await app.close();
+  }
+});
+
+test("taskctl cloud login reads the shared key privately and sends it to the local companion", async () => {
+  const fetchCalls = [];
+  let secretReads = 0;
+  let execCalled = false;
+  const result = await runCli(
+    [
+      "cloud",
+      "login",
+      "--url",
+      "https://tasks.example.test/",
+      "--actor-name",
+      "Alice",
+    ],
+    {
+      execFile: async () => {
+        execCalled = true;
+        assert.fail("Basic Auth login must not run cloudflared");
+      },
+      readSecret: async () => {
+        secretReads += 1;
+        return "two-person-shared-key";
+      },
+      fetch: async (url, init) => {
+        fetchCalls.push({ url: url.toString(), init });
+        return jsonResponse({
+          mode: "cloud",
+          remoteUrl: "https://tasks.example.test",
+          actorName: "Alice",
+          authenticated: true,
+        });
+      },
+    },
+  );
+
+  assert.equal(result.exitCode, 0);
+  assert.equal(secretReads, 1);
+  assert.equal(execCalled, false);
+  assert.equal(fetchCalls.length, 1);
+  assert.equal(fetchCalls[0].url, "http://127.0.0.1:47823/api/local/cloud-session");
+  assert.equal(fetchCalls[0].init.method, "PUT");
+  assert.deepEqual(JSON.parse(fetchCalls[0].init.body), {
+    remoteUrl: "https://tasks.example.test",
+    actorName: "Alice",
+    sharedKey: "two-person-shared-key",
+  });
+  assert.equal(result.stdout.text().includes("two-person-shared-key"), false);
+  assert.equal(result.stderr.text().includes("two-person-shared-key"), false);
+});
+
+test("taskctl cloud status, logout, and project map use local companion endpoints", async () => {
+  const calls = [];
+  const fetchImplementation = async (url, init) => {
+    calls.push({ url: url.toString(), init });
+    if (url.pathname === "/api/local/cloud-session" && init.method === "GET") {
+      return jsonResponse({
+        mode: "cloud",
+        remoteUrl: "https://tasks.example.test",
+        actorName: "Alice",
+        authenticated: true,
+      });
+    }
+    if (url.pathname === "/api/local/cloud-session" && init.method === "DELETE") {
+      return jsonResponse({ mode: "local", authenticated: false });
+    }
+    if (url.pathname === "/api/local/project-mappings/portfolio" && init.method === "PUT") {
+      return jsonResponse({
+        projectId: "portfolio",
+        workspacePath: "/work/portfolio",
+      });
+    }
+    return jsonResponse({ error: { code: "UNEXPECTED", message: url.toString() } }, 500);
+  };
+
+  const companionEnv = {
+    CODEX_TASKBOARD_COMPANION_URL: "http://127.0.0.1:49000",
+  };
+  assert.equal((await runCli(
+    ["cloud", "status"],
+    { fetch: fetchImplementation, env: companionEnv },
+  )).exitCode, 0);
+  assert.equal((await runCli(
+    ["cloud", "logout"],
+    { fetch: fetchImplementation, env: companionEnv },
+  )).exitCode, 0);
+  assert.equal((await runCli(
+    ["project", "map", "portfolio", "--workspace-path", "./portfolio"],
+    { fetch: fetchImplementation, cwd: "/work", env: companionEnv },
+  )).exitCode, 0);
+
+  assert.deepEqual(calls.map(({ url, init }) => [url, init.method]), [
+    ["http://127.0.0.1:49000/api/local/cloud-session", "GET"],
+    ["http://127.0.0.1:49000/api/local/cloud-session", "DELETE"],
+    ["http://127.0.0.1:49000/api/local/project-mappings/portfolio", "PUT"],
+  ]);
+  assert.deepEqual(JSON.parse(calls[2].init.body), {
+    workspacePath: path.resolve("/work", "portfolio"),
+  });
+});
+
+test("taskctl accepts only loopback companion origins and supports the legacy loopback URL", async () => {
+  let requestedUrl;
+  const legacy = await runCli(["cloud", "status"], {
+    env: { CODEX_TASKBOARD_URL: "http://localhost:49100/" },
+    fetch: async (url) => {
+      requestedUrl = url.toString();
+      return jsonResponse({ mode: "local", authenticated: false });
+    },
+  });
+  assert.equal(legacy.exitCode, 0);
+  assert.equal(requestedUrl, "http://localhost:49100/api/local/cloud-session");
+
+  let fetchCalled = false;
+  const rejected = await runCli(["cloud", "status"], {
+    env: { CODEX_TASKBOARD_COMPANION_URL: "https://tasks.example.test" },
+    fetch: async () => {
+      fetchCalled = true;
+      return jsonResponse({});
+    },
+  });
+  assert.equal(rejected.exitCode, 2);
+  assert.equal(rejected.stderr.json().error.code, "USAGE_ERROR");
+  assert.equal(fetchCalled, false);
+});
+
+test("taskctl uses an explicit companion URL for ordinary commands before the legacy URL", async () => {
+  let requestedUrl;
+  const result = await runCli(["project", "list"], {
+    env: {
+      CODEX_TASKBOARD_COMPANION_URL: "http://127.0.0.1:49200",
+      CODEX_TASKBOARD_URL: "https://legacy.example.test",
+    },
+    fetch: async (url) => {
+      requestedUrl = url.toString();
+      return jsonResponse({ projects: [] });
+    },
+  });
+
+  assert.equal(result.exitCode, 0);
+  assert.equal(requestedUrl, "http://127.0.0.1:49200/api/projects");
+});
+
+test("without cloud configuration taskctl keeps using the local companion", async () => {
+  let requestedUrl;
+  let execCalled = false;
+  const result = await runCli(["project", "list"], {
+    env: { CODEX_THREAD_ID: "thread-local" },
+    execFile: async () => {
+      execCalled = true;
+      assert.fail("cloud helper should not run for local commands");
+    },
+    fetch: async (url) => {
+      requestedUrl = url.toString();
+      return jsonResponse({ projects: [{ id: "local", name: "Local" }] });
+    },
+  });
+
+  assert.equal(result.exitCode, 0);
+  assert.equal(requestedUrl, "http://127.0.0.1:47823/api/projects");
+  assert.equal(execCalled, false);
+  assert.deepEqual(result.stdout.json(), {
+    projects: [{ id: "local", name: "Local" }],
+    schemaVersion: 2,
+  });
+});
diff --git a/apps/codex-taskboard/test/cloud-migration.test.mjs b/apps/codex-taskboard/test/cloud-migration.test.mjs
new file mode 100644
index 000000000..1b23d9729
--- /dev/null
+++ b/apps/codex-taskboard/test/cloud-migration.test.mjs
@@ -0,0 +1,1202 @@
+import assert from "node:assert/strict";
+import { execFile as execFileCallback } from "node:child_process";
+import { createHash } from "node:crypto";
+import {
+  copyFile,
+  mkdir,
+  mkdtemp,
+  readFile,
+  rm,
+  stat,
+  writeFile,
+} from "node:fs/promises";
+import os from "node:os";
+import path from "node:path";
+import { DatabaseSync } from "node:sqlite";
+import { afterEach, test } from "node:test";
+import { promisify } from "node:util";
+
+import { Miniflare } from "miniflare";
+import {
+  createCloudBindingMigrationAdapters,
+  createCloudD1ImportSql,
+  createCloudMigrationBundle,
+  importCloudMigrationBundle,
+  readCloudMigrationBundle,
+  runCli,
+  writeCloudMigrationBundle,
+} from "../scripts/migrate-to-cloud.mjs";
+import { createCloudWorkerHarness } from "./helpers/cloud-worker-harness.mjs";
+
+const fixtures = [];
+const timestamp = "2026-07-24T12:00:00.000Z";
+const execFile = promisify(execFileCallback);
+const projectRoot = path.resolve(import.meta.dirname, "..");
+const wranglerBinary = path.join(projectRoot, "node_modules", ".bin", "wrangler");
+const wranglerExecutable = process.platform === "win32" ? process.execPath : wranglerBinary;
+const wranglerArgs = process.platform === "win32"
+  ? [path.join(projectRoot, "node_modules", "wrangler", "bin", "wrangler.js")]
+  : [];
+const wranglerConfig = path.join(projectRoot, "wrangler.jsonc");
+
+function assertPrivateMode(actual, expected) {
+  if (process.platform !== "win32") assert.equal(actual & 0o777, expected);
+}
+
+afterEach(async () => {
+  while (fixtures.length > 0) {
+    const fixture = fixtures.pop();
+    fixture.database.close();
+    await rm(fixture.directory, { recursive: true, force: true });
+  }
+});
+
+async function createMigrationFixture({
+  missingAttachmentId = null,
+  foreignKeyViolation = false,
+} = {}) {
+  const directory = await mkdtemp(path.join(os.tmpdir(), "taskboard-cloud-migration-"));
+  const databasePath = path.join(directory, "taskboard.sqlite");
+  const attachmentsDirectory = path.join(directory, "attachments");
+  const database = new DatabaseSync(databasePath);
+  const fixture = {
+    directory,
+    database,
+    databasePath,
+    attachmentsDirectory,
+    attachmentContents: {
+      "attachment-a": Buffer.from("alpha issue attachment\n"),
+      "attachment-a-comment": Buffer.from("alpha comment attachment\n"),
+      "attachment-b": Buffer.from("beta attachment\n"),
+    },
+  };
+  fixtures.push(fixture);
+
+  database.exec(`
+    PRAGMA foreign_keys = ON;
+    PRAGMA journal_mode = WAL;
+    PRAGMA wal_autocheckpoint = 0;
+
+    CREATE TABLE projects (
+      id TEXT PRIMARY KEY,
+      name TEXT NOT NULL,
+      workspace_path TEXT,
+      next_task_number INTEGER NOT NULL,
+      created_at TEXT NOT NULL,
+      updated_at TEXT NOT NULL
+    );
+
+    CREATE TABLE tasks (
+      id TEXT PRIMARY KEY,
+      identifier TEXT NOT NULL UNIQUE,
+      project_id TEXT NOT NULL REFERENCES projects(id),
+      title TEXT NOT NULL,
+      description TEXT NOT NULL DEFAULT '',
+      status TEXT NOT NULL,
+      priority TEXT NOT NULL,
+      labels TEXT NOT NULL DEFAULT '[]',
+      sort_order REAL NOT NULL,
+      thread_id TEXT,
+      creator_type TEXT NOT NULL,
+      creator_id TEXT NOT NULL,
+      creator_name TEXT NOT NULL,
+      creator_avatar_url TEXT,
+      assignee_type TEXT NOT NULL,
+      assignee_id TEXT NOT NULL,
+      assignee_name TEXT NOT NULL,
+      assignee_avatar_url TEXT,
+      workflow_id TEXT,
+      git_branch TEXT,
+      worktree_path TEXT,
+      worktree_branch TEXT,
+      due_date TEXT,
+      recurrence_interval INTEGER,
+      recurrence_unit TEXT,
+      archived_at TEXT,
+      version INTEGER NOT NULL,
+      created_at TEXT NOT NULL,
+      updated_at TEXT NOT NULL
+    );
+
+    CREATE TABLE comments (
+      id TEXT PRIMARY KEY,
+      task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE,
+      body TEXT NOT NULL,
+      thread_id TEXT,
+      author_type TEXT NOT NULL,
+      author_id TEXT NOT NULL,
+      author_name TEXT NOT NULL,
+      author_avatar_url TEXT,
+      version INTEGER NOT NULL,
+      created_at TEXT NOT NULL,
+      updated_at TEXT NOT NULL
+    );
+
+    CREATE TABLE attachments (
+      id TEXT PRIMARY KEY,
+      task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE,
+      comment_id TEXT REFERENCES comments(id) ON DELETE CASCADE,
+      filename TEXT NOT NULL,
+      content_type TEXT NOT NULL,
+      size INTEGER NOT NULL,
+      created_at TEXT NOT NULL
+    );
+
+    CREATE TABLE workflow_workspaces (
+      project_id TEXT PRIMARY KEY REFERENCES projects(id) ON DELETE CASCADE,
+      workspace TEXT NOT NULL,
+      version INTEGER NOT NULL,
+      updated_at TEXT NOT NULL
+    );
+
+    CREATE TABLE task_relations (
+      relation_type TEXT NOT NULL,
+      source_task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE,
+      target_task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE,
+      created_at TEXT NOT NULL,
+      PRIMARY KEY (relation_type, source_task_id, target_task_id)
+    );
+
+    CREATE TABLE local_cloud_session (
+      access_token TEXT NOT NULL,
+      created_at TEXT NOT NULL
+    );
+  `);
+  database.exec("PRAGMA wal_checkpoint(TRUNCATE)");
+
+  database.exec(`
+    BEGIN IMMEDIATE;
+
+    INSERT INTO projects VALUES
+      (
+        'alpha',
+        'Alpha',
+        '/Users/alice/source/alpha',
+        3,
+        '${timestamp}',
+        '${timestamp}'
+      ),
+      (
+        'beta',
+        'Beta',
+        '/Users/bob/source/beta',
+        2,
+        '${timestamp}',
+        '${timestamp}'
+      );
+
+    INSERT INTO tasks VALUES
+      (
+        'task-a1',
+        'ALPHA-1',
+        'alpha',
+        'Alpha one',
+        'First alpha issue',
+        'todo',
+        'high',
+        '["cloud"]',
+        1000,
+        'thread-alpha',
+        'user',
+        'alice',
+        'Alice',
+        NULL,
+        'user',
+        'alice',
+        'Alice',
+        NULL,
+        'workflow-alpha',
+        NULL,
+        '/Users/alice/source/alpha-worktree',
+        'feature/cloud-share',
+        NULL,
+        NULL,
+        NULL,
+        NULL,
+        2,
+        '${timestamp}',
+        '${timestamp}'
+      ),
+      (
+        'task-a2',
+        'ALPHA-2',
+        'alpha',
+        'Alpha two',
+        '',
+        'in_progress',
+        'none',
+        '[]',
+        2000,
+        NULL,
+        'agent',
+        'codex-agent',
+        'Codex Agent',
+        NULL,
+        'agent',
+        'codex-agent',
+        'Codex Agent',
+        NULL,
+        NULL,
+        'feature/plain-branch',
+        NULL,
+        NULL,
+        NULL,
+        NULL,
+        NULL,
+        NULL,
+        1,
+        '${timestamp}',
+        '${timestamp}'
+      ),
+      (
+        'task-b1',
+        'BETA-1',
+        'beta',
+        'Beta one',
+        '',
+        'backlog',
+        'low',
+        '[]',
+        1000,
+        NULL,
+        'user',
+        'bob',
+        'Bob',
+        NULL,
+        'user',
+        'bob',
+        'Bob',
+        NULL,
+        NULL,
+        NULL,
+        '/Users/bob/source/beta-worktree',
+        'feature/beta-worktree',
+        NULL,
+        NULL,
+        NULL,
+        NULL,
+        1,
+        '${timestamp}',
+        '${timestamp}'
+      );
+
+    INSERT INTO comments VALUES
+      (
+        'comment-a',
+        'task-a1',
+        'Alpha comment',
+        'thread-alpha-comment',
+        'user',
+        'alice',
+        'Alice',
+        NULL,
+        1,
+        '${timestamp}',
+        '${timestamp}'
+      ),
+      (
+        'comment-b',
+        'task-b1',
+        'Beta comment',
+        NULL,
+        'user',
+        'bob',
+        'Bob',
+        NULL,
+        1,
+        '${timestamp}',
+        '${timestamp}'
+      );
+
+    INSERT INTO attachments VALUES
+      (
+        'attachment-a',
+        'task-a1',
+        NULL,
+        'alpha.txt',
+        'text/plain',
+        23,
+        '${timestamp}'
+      ),
+      (
+        'attachment-a-comment',
+        'task-a1',
+        'comment-a',
+        'alpha-comment.txt',
+        'text/plain',
+        25,
+        '${timestamp}'
+      ),
+      (
+        'attachment-b',
+        'task-b1',
+        NULL,
+        'beta.txt',
+        'text/plain',
+        16,
+        '${timestamp}'
+      );
+
+    INSERT INTO workflow_workspaces VALUES
+      (
+        'alpha',
+        '{"version":1,"tabs":[{"id":"delivery","name":"Delivery","nodes":[{"data":{"gitWorktreePath":"/Users/alice/source/alpha-worktree","workspacePath":"/api/request/workspace","cwd":"/api/request/cwd","workingDirectory":"/api/request/working-directory","additionalInstructions":"Keep this workflow note"}}]}]}',
+        1,
+        '${timestamp}'
+      );
+
+    INSERT INTO task_relations VALUES
+      ('parent', 'task-a1', 'task-a2', '${timestamp}');
+
+    INSERT INTO local_cloud_session VALUES
+      ('cf-access-super-secret', '${timestamp}');
+
+    COMMIT;
+  `);
+  if (foreignKeyViolation) {
+    database.exec(`
+      PRAGMA foreign_keys = OFF;
+      INSERT INTO task_relations VALUES
+        ('blocks', 'missing-task', 'task-a1', '${timestamp}');
+      PRAGMA foreign_keys = ON;
+    `);
+  }
+
+  await mkdir(attachmentsDirectory, { recursive: true });
+  for (const [id, contents] of Object.entries(fixture.attachmentContents)) {
+    if (id !== missingAttachmentId) {
+      await writeFile(path.join(attachmentsDirectory, id), contents);
+    }
+  }
+
+  return fixture;
+}
+
+function expectedProjectCounts() {
+  return {
+    alpha: {
+      projects: 1,
+      tasks: 2,
+      comments: 1,
+      attachments: 2,
+      task_relations: 1,
+      workflow_workspaces: 1,
+    },
+    beta: {
+      projects: 1,
+      tasks: 1,
+      comments: 1,
+      attachments: 1,
+      task_relations: 0,
+      workflow_workspaces: 0,
+    },
+  };
+}
+
+function createD1Adapter(
+  bundle,
+  {
+    initialCounts = {},
+    importedCounts = bundle.counts.byProject,
+    failImport = false,
+  } = {},
+) {
+  const calls = [];
+  const state = { tables: null };
+  return {
+    calls,
+    state,
+    async importTables(tables) {
+      const staged = structuredClone(tables);
+      calls.push(staged);
+      if (failImport) throw new Error("Atomic D1 import failed");
+      state.tables = staged;
+    },
+    async countByProject() {
+      return structuredClone(state.tables ? importedCounts : initialCounts);
+    },
+  };
+}
+
+function createR2Adapter({ tamperHeadFor = null } = {}) {
+  const objects = new Map();
+  const deleted = [];
+  return {
+    objects,
+    deleted,
+    async put(key, body, options) {
+      const bytes = Buffer.from(body);
+      objects.set(key, {
+        bytes,
+        size: bytes.byteLength,
+        customMetadata: structuredClone(options?.customMetadata ?? {}),
+      });
+    },
+    async head(key) {
+      const object = objects.get(key);
+      if (!object) return null;
+      if (key === tamperHeadFor) {
+        return {
+          size: object.size,
+          customMetadata: { ...object.customMetadata, sha256: "0".repeat(64) },
+        };
+      }
+      return {
+        size: object.size,
+        customMetadata: structuredClone(object.customMetadata),
+      };
+    },
+    async delete(key) {
+      deleted.push(key);
+      objects.delete(key);
+    },
+  };
+}
+
+test("migration snapshots live WAL data, counts each project, and strips local execution state", async () => {
+  const fixture = await createMigrationFixture();
+  const wal = await stat(`${fixture.databasePath}-wal`);
+  assert.ok(wal.size > 32, "fixture data must still be present in the WAL");
+
+  const mainFileOnly = path.join(fixture.directory, "main-file-only.sqlite");
+  await copyFile(fixture.databasePath, mainFileOnly);
+  const staleDatabase = new DatabaseSync(mainFileOnly);
+  assert.equal(
+    staleDatabase.prepare("SELECT COUNT(*) AS count FROM projects").get().count,
+    0,
+    "copying only the main file should prove the test data has not been checkpointed",
+  );
+  staleDatabase.close();
+
+  const bundle = await createCloudMigrationBundle({
+    databasePath: fixture.databasePath,
+    attachmentsDirectory: fixture.attachmentsDirectory,
+  });
+
+  assert.equal(bundle.schemaVersion, 1);
+  assert.deepEqual(bundle.counts.byProject, expectedProjectCounts());
+  assert.deepEqual(
+    bundle.tables.projects.map((project) => project.id).sort(),
+    ["alpha", "beta"],
+  );
+  assert.equal(bundle.tables.projects.every((project) => project.workspace_path === null), true);
+
+  const alphaWorktreeTask = bundle.tables.tasks.find((task) => task.id === "task-a1");
+  assert.equal(alphaWorktreeTask.worktree_path, null);
+  assert.equal(alphaWorktreeTask.worktree_branch, "feature/cloud-share");
+
+  const alphaBranchTask = bundle.tables.tasks.find((task) => task.id === "task-a2");
+  assert.equal(alphaBranchTask.git_branch, "feature/plain-branch");
+
+  const workflow = JSON.parse(bundle.tables.workflow_workspaces[0].workspace);
+  assert.equal(workflow.tabs[0].nodes[0].data.gitWorktreePath, null);
+  assert.equal(workflow.tabs[0].nodes[0].data.workspacePath, "/api/request/workspace");
+  assert.equal(workflow.tabs[0].nodes[0].data.cwd, "/api/request/cwd");
+  assert.equal(
+    workflow.tabs[0].nodes[0].data.workingDirectory,
+    "/api/request/working-directory",
+  );
+  assert.equal(
+    workflow.tabs[0].nodes[0].data.additionalInstructions,
+    "Keep this workflow note",
+  );
+
+  const serializedBundle = JSON.stringify(bundle);
+  assert.doesNotMatch(serializedBundle, /cf-access-super-secret/);
+  assert.doesNotMatch(serializedBundle, /\/Users\/(?:alice|bob)\//);
+  assert.equal(Object.hasOwn(bundle.tables, "local_cloud_session"), false);
+});
+
+test("migration records attachment bytes, SHA-256, and actual size", async () => {
+  const fixture = await createMigrationFixture();
+  const bundle = await createCloudMigrationBundle({
+    databasePath: fixture.databasePath,
+    attachmentsDirectory: fixture.attachmentsDirectory,
+  });
+
+  assert.equal(bundle.attachments.length, 3);
+  for (const attachment of bundle.attachments) {
+    const expectedContents = fixture.attachmentContents[attachment.id];
+    assert.deepEqual(Buffer.from(attachment.body), expectedContents);
+    assert.equal(attachment.size, expectedContents.byteLength);
+    assert.equal(
+      attachment.sha256,
+      createHash("sha256").update(expectedContents).digest("hex"),
+    );
+    assert.equal(path.isAbsolute(attachment.objectKey), false);
+  }
+});
+
+test("migration fails before import when an attachment referenced by SQLite is missing", async () => {
+  const fixture = await createMigrationFixture({ missingAttachmentId: "attachment-a-comment" });
+
+  await assert.rejects(
+    createCloudMigrationBundle({
+      databasePath: fixture.databasePath,
+      attachmentsDirectory: fixture.attachmentsDirectory,
+    }),
+    /attachment-a-comment.*missing|missing.*attachment-a-comment/i,
+  );
+});
+
+test("migration rejects a snapshot with foreign key violations", async () => {
+  const fixture = await createMigrationFixture({ foreignKeyViolation: true });
+
+  await assert.rejects(
+    createCloudMigrationBundle({
+      databasePath: fixture.databasePath,
+      attachmentsDirectory: fixture.attachmentsDirectory,
+    }),
+    /foreign key|foreign_key/i,
+  );
+});
+
+test("cloud import calls D1 and R2 adapters, then verifies project counts and object hashes", async () => {
+  const fixture = await createMigrationFixture();
+  const bundle = await createCloudMigrationBundle({
+    databasePath: fixture.databasePath,
+    attachmentsDirectory: fixture.attachmentsDirectory,
+  });
+  const d1 = createD1Adapter(bundle);
+  const r2 = createR2Adapter();
+
+  const result = await importCloudMigrationBundle(bundle, { d1, r2 });
+
+  assert.equal(d1.calls.length, 1);
+  assert.deepEqual(Object.keys(d1.calls[0]), [
+    "projects",
+    "tasks",
+    "comments",
+    "task_relations",
+    "attachments",
+    "workflow_workspaces",
+  ]);
+  assert.deepEqual(result.counts.byProject, expectedProjectCounts());
+  assert.equal(result.attachments.verified, 3);
+
+  for (const attachment of bundle.attachments) {
+    const object = r2.objects.get(attachment.objectKey);
+    assert.deepEqual(object.bytes, Buffer.from(attachment.body));
+    assert.equal(object.size, attachment.size);
+    assert.equal(object.customMetadata.sha256, attachment.sha256);
+  }
+});
+
+test("cloud import rejects D1 count drift and R2 hash drift", async () => {
+  const fixture = await createMigrationFixture();
+  const bundle = await createCloudMigrationBundle({
+    databasePath: fixture.databasePath,
+    attachmentsDirectory: fixture.attachmentsDirectory,
+  });
+
+  const wrongCounts = structuredClone(bundle.counts.byProject);
+  wrongCounts.alpha.tasks -= 1;
+  const committedD1 = createD1Adapter(bundle, { importedCounts: wrongCounts });
+  const committedR2 = createR2Adapter();
+  await assert.rejects(
+    importCloudMigrationBundle(bundle, {
+      d1: committedD1,
+      r2: committedR2,
+    }),
+    /count.*alpha|alpha.*count/i,
+  );
+  assert.notEqual(committedD1.state.tables, null);
+  assert.equal(committedR2.deleted.length, 0, "committed D1 must retain matching R2 objects");
+  assert.equal(committedR2.objects.size, bundle.attachments.length);
+
+  const driftD1 = createD1Adapter(bundle);
+  const driftR2 = createR2Adapter({ tamperHeadFor: bundle.attachments[0].objectKey });
+  await assert.rejects(
+    importCloudMigrationBundle(bundle, {
+      d1: driftD1,
+      r2: driftR2,
+    }),
+    /sha-?256|hash/i,
+  );
+  assert.equal(driftD1.calls.length, 0, "R2 must verify before D1 becomes visible");
+  assert.deepEqual(
+    driftR2.deleted.sort(),
+    bundle.attachments.map((attachment) => attachment.objectKey).sort(),
+  );
+});
+
+test("cloud import is atomic in D1 and cleans staged R2 objects when D1 rejects", async () => {
+  const fixture = await createMigrationFixture();
+  const bundle = await createCloudMigrationBundle({
+    databasePath: fixture.databasePath,
+    attachmentsDirectory: fixture.attachmentsDirectory,
+  });
+  const d1 = createD1Adapter(bundle, { failImport: true });
+  const r2 = createR2Adapter();
+
+  await assert.rejects(
+    importCloudMigrationBundle(bundle, { d1, r2 }),
+    /atomic D1 import failed/i,
+  );
+
+  assert.equal(d1.calls.length, 1);
+  assert.equal(d1.state.tables, null);
+  assert.equal(r2.objects.size, 0);
+  assert.deepEqual(
+    r2.deleted.sort(),
+    bundle.attachments.map((attachment) => attachment.objectKey).sort(),
+  );
+});
+
+test("D1 binding import uses one JSON statement per table for 100+ rows", async () => {
+  const fixture = await createMigrationFixture();
+  const bundle = await createCloudMigrationBundle({
+    databasePath: fixture.databasePath,
+    attachmentsDirectory: fixture.attachmentsDirectory,
+  });
+  const template = bundle.tables.tasks[0];
+  const tables = structuredClone(bundle.tables);
+  tables.tasks = Array.from({ length: 125 }, (_, index) => ({
+    ...structuredClone(template),
+    id: `bulk-task-${index}`,
+    identifier: `BULK-${index + 1}`,
+    sort_order: index + 1,
+  }));
+  const batches = [];
+  const d1 = {
+    prepare(sql) {
+      return {
+        bind(...values) {
+          return { sql, values };
+        },
+      };
+    },
+    async batch(statements) {
+      batches.push(statements);
+    },
+  };
+
+  const adapters = createCloudBindingMigrationAdapters({
+    d1,
+    r2: createR2Adapter(),
+  });
+  await adapters.d1.importTables(tables);
+
+  assert.equal(batches.length, 1);
+  assert.equal(batches[0].length, 6);
+  for (const statement of batches[0]) assert.match(statement.sql, /json_each\(\?\)/);
+  assert.equal(JSON.parse(batches[0][1].values[0]).length, 125);
+});
+
+test("Wrangler D1 SQL chunks large tables below the remote statement byte limit", async () => {
+  const fixture = await createMigrationFixture();
+  const bundle = await createCloudMigrationBundle({
+    databasePath: fixture.databasePath,
+    attachmentsDirectory: fixture.attachmentsDirectory,
+  });
+  const template = bundle.tables.tasks[0];
+  const tables = structuredClone(bundle.tables);
+  tables.tasks = Array.from({ length: 160 }, (_, index) => ({
+    ...structuredClone(template),
+    id: `large-task-${String(index).padStart(3, "0")}`,
+    identifier: `LARGE-${index + 1}`,
+    description: `多字节-${index}-`.repeat(160),
+    sort_order: index + 1,
+  }));
+
+  const sql = createCloudD1ImportSql(tables);
+  assert.ok(Buffer.byteLength(sql, "utf8") > 100_000);
+  const statements = sql
+    .split(/;\n(?=INSERT INTO )/)
+    .map((statement) => statement.endsWith(";") ? statement : `${statement};`);
+  assert.ok(
+    statements.filter((statement) => statement.startsWith('INSERT INTO "tasks"')).length > 1,
+  );
+  for (const statement of statements) {
+    assert.ok(
+      Buffer.byteLength(statement, "utf8") < 90_000,
+      `statement was ${Buffer.byteLength(statement, "utf8")} bytes`,
+    );
+  }
+  assert.ok(sql.indexOf("large-task-000") < sql.indexOf("large-task-159"));
+
+  const oversized = structuredClone(tables);
+  oversized.tasks = [{
+    ...structuredClone(template),
+    id: "oversized-task",
+    identifier: "OVERSIZED-1",
+    description: "界".repeat(40_000),
+  }];
+  assert.throws(
+    () => createCloudD1ImportSql(oversized),
+    /single row.*90,?000 bytes/i,
+  );
+});
+
+test("real D1 batch atomically imports a bundle containing local and maps development fields", async () => {
+  const fixture = await createMigrationFixture();
+  fixture.database.exec(`
+    PRAGMA foreign_keys = OFF;
+    UPDATE projects SET id = 'local' WHERE id = 'alpha';
+    UPDATE tasks SET project_id = 'local' WHERE project_id = 'alpha';
+    UPDATE workflow_workspaces SET project_id = 'local' WHERE project_id = 'alpha';
+    PRAGMA foreign_keys = ON;
+  `);
+  const bundle = await createCloudMigrationBundle({
+    databasePath: fixture.databasePath,
+    attachmentsDirectory: fixture.attachmentsDirectory,
+  });
+  assert.ok(bundle.tables.projects.some((project) => project.id === "local"));
+
+  const failingCloud = await createCloudWorkerHarness();
+  try {
+    await failingCloud.db.prepare(`
+      CREATE TRIGGER fail_migration_comment
+      BEFORE INSERT ON comments
+      BEGIN
+        SELECT RAISE(ABORT, 'intentional migration failure');
+      END;
+    `).run();
+    await assert.rejects(
+      importCloudMigrationBundle(
+        bundle,
+        createCloudBindingMigrationAdapters({
+          d1: failingCloud.db,
+          r2: failingCloud.attachments,
+        }),
+      ),
+      /intentional migration failure/i,
+    );
+    assert.equal(
+      (await failingCloud.db.prepare("SELECT COUNT(*) AS count FROM projects").first()).count,
+      0,
+    );
+    assert.deepEqual(await failingCloud.listAttachmentKeys(), []);
+  } finally {
+    await failingCloud.dispose();
+  }
+
+  const cloud = await createCloudWorkerHarness();
+  try {
+    const result = await importCloudMigrationBundle(
+      bundle,
+      createCloudBindingMigrationAdapters({
+        d1: cloud.db,
+        r2: cloud.attachments,
+      }),
+    );
+    assert.deepEqual(result.counts.byProject, bundle.counts.byProject);
+    assert.deepEqual(
+      (await cloud.db.prepare("SELECT id FROM projects ORDER BY id").all()).results,
+      [{ id: "beta" }, { id: "local" }],
+    );
+    assert.deepEqual(
+      await cloud.db.prepare(`
+        SELECT development_context_type, development_branch
+        FROM tasks
+        WHERE id = 'task-a1'
+      `).first(),
+      {
+        development_context_type: "worktree",
+        development_branch: "feature/cloud-share",
+      },
+    );
+    assert.deepEqual(
+      await cloud.db.prepare(`
+        SELECT development_context_type, development_branch
+        FROM tasks
+        WHERE id = 'task-a2'
+      `).first(),
+      {
+        development_context_type: "branch",
+        development_branch: "feature/plain-branch",
+      },
+    );
+    const taskColumns = await cloud.db.prepare("PRAGMA table_info(tasks)").all();
+    assert.equal(taskColumns.results.some((column) => column.name === "worktree_path"), false);
+
+    const migratedAttachment = bundle.attachments.find(
+      (attachment) => attachment.id === "attachment-a",
+    );
+    const downloaded = await cloud.request(
+      `/api/attachments/${encodeURIComponent(migratedAttachment.id)}/content`,
+      { actorName: "Alice" },
+    );
+    assert.equal(downloaded.response.status, 200);
+    assert.equal(downloaded.body, fixture.attachmentContents[migratedAttachment.id].toString());
+
+    const deleted = await cloud.request(
+      `/api/attachments/${encodeURIComponent(migratedAttachment.id)}`,
+      { method: "DELETE", actorName: "Alice" },
+    );
+    assert.equal(deleted.response.status, 204);
+    assert.equal(await cloud.attachments.head(migratedAttachment.id), null);
+  } finally {
+    await cloud.dispose();
+  }
+});
+
+test("cloud import refuses non-empty D1 and pre-existing R2 targets", async () => {
+  const fixture = await createMigrationFixture();
+  const bundle = await createCloudMigrationBundle({
+    databasePath: fixture.databasePath,
+    attachmentsDirectory: fixture.attachmentsDirectory,
+  });
+
+  const nonEmptyD1 = createD1Adapter(bundle, {
+    initialCounts: { alpha: expectedProjectCounts().alpha },
+  });
+  const untouchedR2 = createR2Adapter();
+  await assert.rejects(
+    importCloudMigrationBundle(bundle, { d1: nonEmptyD1, r2: untouchedR2 }),
+    /D1.*not empty|non-empty.*D1/i,
+  );
+  assert.equal(nonEmptyD1.calls.length, 0);
+  assert.equal(untouchedR2.objects.size, 0);
+
+  const occupiedR2 = createR2Adapter();
+  const occupiedKey = bundle.attachments[0].objectKey;
+  occupiedR2.objects.set(occupiedKey, {
+    bytes: Buffer.from("existing"),
+    size: 8,
+    customMetadata: { sha256: createHash("sha256").update("existing").digest("hex") },
+  });
+  const emptyD1 = createD1Adapter(bundle);
+  await assert.rejects(
+    importCloudMigrationBundle(bundle, { d1: emptyD1, r2: occupiedR2 }),
+    /R2.*already exists|already exists.*R2/i,
+  );
+  assert.equal(emptyD1.calls.length, 0);
+  assert.deepEqual(occupiedR2.objects.get(occupiedKey).bytes, Buffer.from("existing"));
+  assert.equal(occupiedR2.deleted.length, 0);
+});
+
+test("bundle validation binds attachment size and object key to SQLite metadata", async () => {
+  const fixture = await createMigrationFixture();
+  const bundle = await createCloudMigrationBundle({
+    databasePath: fixture.databasePath,
+    attachmentsDirectory: fixture.attachmentsDirectory,
+  });
+
+  const wrongSize = structuredClone(bundle);
+  wrongSize.tables.attachments[0].size += 1;
+  await assert.rejects(
+    importCloudMigrationBundle(wrongSize, {
+      d1: createD1Adapter(wrongSize),
+      r2: createR2Adapter(),
+    }),
+    /metadata.*size|size.*metadata/i,
+  );
+
+  const wrongObjectKey = structuredClone(bundle);
+  wrongObjectKey.attachments[0].objectKey = "different-attachment";
+  await assert.rejects(
+    importCloudMigrationBundle(wrongObjectKey, {
+      d1: createD1Adapter(wrongObjectKey),
+      r2: createR2Adapter(),
+    }),
+    /object key/i,
+  );
+
+  const wrongProject = structuredClone(bundle);
+  wrongProject.attachments[0].projectId = "beta";
+  await assert.rejects(
+    importCloudMigrationBundle(wrongProject, {
+      d1: createD1Adapter(wrongProject),
+      r2: createR2Adapter(),
+    }),
+    /task project|project.*task/i,
+  );
+});
+
+test("versioned bundle round-trips through private manifest, data, and attachment files", async () => {
+  const fixture = await createMigrationFixture();
+  const bundle = await createCloudMigrationBundle({
+    databasePath: fixture.databasePath,
+    attachmentsDirectory: fixture.attachmentsDirectory,
+  });
+  const outputDirectory = path.join(fixture.directory, "cloud-bundle-v1");
+
+  await writeCloudMigrationBundle(bundle, outputDirectory);
+
+  assertPrivateMode((await stat(outputDirectory)).mode, 0o700);
+  assertPrivateMode((await stat(path.join(outputDirectory, "data"))).mode, 0o700);
+  assertPrivateMode((await stat(path.join(outputDirectory, "attachments"))).mode, 0o700);
+  assertPrivateMode((await stat(path.join(outputDirectory, "manifest.json"))).mode, 0o600);
+
+  const restored = await readCloudMigrationBundle(outputDirectory);
+  assert.deepEqual(restored.counts, bundle.counts);
+  assert.equal(JSON.stringify(restored.tables), JSON.stringify(bundle.tables));
+  assert.deepEqual(
+    restored.attachments.map(({ id, body }) => [id, Buffer.from(body)]),
+    bundle.attachments.map(({ id, body }) => [id, Buffer.from(body)]),
+  );
+});
+
+test("CLI import and verify require and use an explicit adapter module", async () => {
+  const fixture = await createMigrationFixture();
+  const bundle = await createCloudMigrationBundle({
+    databasePath: fixture.databasePath,
+    attachmentsDirectory: fixture.attachmentsDirectory,
+  });
+  const outputDirectory = path.join(fixture.directory, "cloud-bundle-v1");
+  await writeCloudMigrationBundle(bundle, outputDirectory);
+  const d1 = createD1Adapter(bundle);
+  const r2 = createR2Adapter();
+  const output = [];
+  const options = {
+    stdout: { write: (value) => output.push(value) },
+    loadAdapters: async (modulePath) => {
+      assert.equal(modulePath, "./cloud-adapter.mjs");
+      return { d1, r2 };
+    },
+  };
+
+  await runCli(
+    ["import", "--bundle", outputDirectory, "--adapter", "./cloud-adapter.mjs"],
+    options,
+  );
+  await runCli(
+    ["verify", "--bundle", outputDirectory, "--adapter", "./cloud-adapter.mjs"],
+    options,
+  );
+  assert.equal(output.length, 2);
+  await assert.rejects(
+    runCli(["verify", "--bundle", outputDirectory], options),
+    /--adapter/,
+  );
+});
+
+test("Wrangler adapter requires remote opt-in and keeps transfer files private", async () => {
+  const {
+    createCloudMigrationAdapters,
+    createWranglerCloudAdapters,
+  } = await import("../scripts/wrangler-cloud-adapter.mjs");
+  assert.throws(
+    () => createWranglerCloudAdapters({
+      remote: true,
+      environment: {},
+    }),
+    /TASKBOARD_MIGRATION_REMOTE=1/,
+  );
+
+  const fixture = await createMigrationFixture();
+  const bundle = await createCloudMigrationBundle({
+    databasePath: fixture.databasePath,
+    attachmentsDirectory: fixture.attachmentsDirectory,
+  });
+  const oversizedBundle = structuredClone(bundle);
+  oversizedBundle.tables.tasks[0].description = "界".repeat(40_000);
+  assert.throws(
+    () => createCloudMigrationAdapters({
+      bundle: oversizedBundle,
+      command: "import",
+    }),
+    /single row.*90,?000 bytes/i,
+  );
+  const calls = [];
+  const transferFiles = [];
+  const downloadedBody = Buffer.from("downloaded R2 body");
+  const adapters = createWranglerCloudAdapters({
+    remote: true,
+    environment: { TASKBOARD_MIGRATION_REMOTE: "1" },
+    runCommand: async (_executable, args) => {
+      calls.push(args);
+      const fileIndex = args.indexOf("--file");
+      if (fileIndex !== -1) {
+        const filename = args[fileIndex + 1];
+        transferFiles.push(filename);
+        if (args.includes("get") && args.includes("object")) {
+          await writeFile(filename, downloadedBody);
+        }
+      }
+      if (args.includes("--json")) return { stdout: '[{"results":[]}]' };
+      return { stdout: "" };
+    },
+  });
+
+  try {
+    await adapters.d1.importTables(bundle.tables);
+    assert.deepEqual(await adapters.d1.countByProject(), {});
+    await adapters.r2.put("attachment-a", Buffer.from("upload"));
+    assert.deepEqual(await adapters.r2.head("attachment-a"), {
+      size: downloadedBody.byteLength,
+      customMetadata: {
+        sha256: createHash("sha256").update(downloadedBody).digest("hex"),
+      },
+    });
+    await adapters.r2.delete("attachment-a");
+
+    assert.deepEqual(
+      calls.map((args) => args.slice(0, 3)),
+      [
+        ["d1", "execute", "codex-taskboard-db"],
+        ["d1", "execute", "codex-taskboard-db"],
+        ["r2", "object", "put"],
+        ["r2", "object", "get"],
+        ["r2", "object", "delete"],
+      ],
+    );
+    for (const args of calls) {
+      assert.ok(args.includes("--remote"));
+      assert.ok(!args.includes("--local"));
+      assert.ok(!args.includes("--persist-to"));
+    }
+    for (const filename of transferFiles) {
+      assertPrivateMode((await stat(filename)).mode, 0o600);
+      assertPrivateMode((await stat(path.dirname(filename))).mode, 0o700);
+    }
+  } finally {
+    await adapters.cleanup();
+  }
+});
+
+test("one-time Wrangler adapter migrates and verifies local persistence without remote access", async () => {
+  const {
+    createWranglerCloudAdapters,
+  } = await import("../scripts/wrangler-cloud-adapter.mjs");
+  assert.throws(
+    () => createWranglerCloudAdapters({
+      remote: true,
+      environment: {},
+    }),
+    /TASKBOARD_MIGRATION_REMOTE=1/,
+  );
+
+  const fixture = await createMigrationFixture();
+  fixture.database.exec(`
+    PRAGMA foreign_keys = OFF;
+    UPDATE projects SET id = 'local' WHERE id = 'alpha';
+    UPDATE tasks SET project_id = 'local' WHERE project_id = 'alpha';
+    UPDATE workflow_workspaces SET project_id = 'local' WHERE project_id = 'alpha';
+    PRAGMA foreign_keys = ON;
+  `);
+  const insertLargeTask = fixture.database.prepare(`
+    INSERT INTO tasks
+    SELECT ?, ?, project_id, ?, ?, status, priority, labels, ?, thread_id,
+      creator_type, creator_id, creator_name, creator_avatar_url,
+      assignee_type, assignee_id, assignee_name, assignee_avatar_url,
+      workflow_id, git_branch, worktree_path, worktree_branch, due_date,
+      recurrence_interval, recurrence_unit, archived_at, version, created_at,
+      updated_at
+    FROM tasks WHERE id = 'task-a1'
+  `);
+  for (let index = 0; index < 160; index += 1) {
+    insertLargeTask.run(
+      `wrangler-large-task-${index}`,
+      `LOCAL-${index + 100}`,
+      `Wrangler large task ${index}`,
+      `多字节-${index}-`.repeat(160),
+      index + 10_000,
+    );
+  }
+  const bundle = await createCloudMigrationBundle({
+    databasePath: fixture.databasePath,
+    attachmentsDirectory: fixture.attachmentsDirectory,
+  });
+  assert.ok(Buffer.byteLength(createCloudD1ImportSql(bundle.tables), "utf8") > 100_000);
+  const bundleDirectory = path.join(fixture.directory, "wrangler-bundle-v1");
+  await writeCloudMigrationBundle(bundle, bundleDirectory);
+  const adapterPath = path.join(projectRoot, "scripts", "wrangler-cloud-adapter.mjs");
+
+  async function applyMigrations(persistTo) {
+    await execFile(wranglerExecutable, [
+      ...wranglerArgs,
+      "d1",
+      "migrations",
+      "apply",
+      "codex-taskboard-db",
+      "--local",
+      "--persist-to",
+      persistTo,
+      "--config",
+      wranglerConfig,
+    ], { cwd: projectRoot });
+  }
+
+  async function runMigration(command, directory, persistTo) {
+    return execFile(process.execPath, [
+      "scripts/migrate-to-cloud.mjs",
+      command,
+      "--bundle",
+      directory,
+      "--adapter",
+      adapterPath,
+    ], {
+      cwd: projectRoot,
+      env: {
+        ...process.env,
+        TASKBOARD_MIGRATION_PERSIST_TO: persistTo,
+        TASKBOARD_MIGRATION_CONFIG: wranglerConfig,
+      },
+    });
+  }
+
+  const persistTo = path.join(fixture.directory, "wrangler-success");
+  await applyMigrations(persistTo);
+  await runMigration("import", bundleDirectory, persistTo);
+  await runMigration("verify", bundleDirectory, persistTo);
+
+  const configuredDatabaseId = JSON.parse(
+    await readFile(wranglerConfig, "utf8"),
+  ).d1_databases[0].database_id;
+  const miniflare = new Miniflare({
+    modules: true,
+    scriptPath: path.join(projectRoot, "cloud", "src", "index.mjs"),
+    modulesRoot: projectRoot,
+    compatibilityDate: "2026-07-24",
+    bindings: {
+      TASKBOARD_ENVIRONMENT: "production",
+      TASKBOARD_SHARED_SECRET: "migration-test-secret",
+    },
+    d1Databases: { DB: configuredDatabaseId },
+    r2Buckets: { ATTACHMENTS: "codex-taskboard-attachments" },
+    defaultPersistRoot: path.join(persistTo, "v3"),
+    d1Persist: path.join(persistTo, "v3", "d1"),
+    r2Persist: true,
+  });
+  try {
+    await miniflare.ready;
+    const authorization = `Basic ${Buffer.from("Alice:migration-test-secret").toString("base64")}`;
+    const attachment = bundle.attachments[0];
+    const downloaded = await miniflare.dispatchFetch(
+      `https://taskboard.example.test/api/attachments/${attachment.id}/content`,
+      { headers: { authorization } },
+    );
+    assert.equal(downloaded.status, 200);
+    assert.deepEqual(
+      Buffer.from(await downloaded.arrayBuffer()),
+      fixture.attachmentContents[attachment.id],
+    );
+    const deleted = await miniflare.dispatchFetch(
+      `https://taskboard.example.test/api/attachments/${attachment.id}`,
+      { method: "DELETE", headers: { authorization } },
+    );
+    assert.equal(deleted.status, 204);
+    assert.equal(
+      await (await miniflare.getR2Bucket("ATTACHMENTS")).head(attachment.id),
+      null,
+    );
+  } finally {
+    await miniflare.dispose();
+  }
+
+  const failingBundle = structuredClone(bundle);
+  failingBundle.tables.tasks[1].identifier = failingBundle.tables.tasks[0].identifier;
+  const failingDirectory = path.join(fixture.directory, "wrangler-failing-bundle-v1");
+  await writeCloudMigrationBundle(failingBundle, failingDirectory);
+  const failingPersistTo = path.join(fixture.directory, "wrangler-failure");
+  await applyMigrations(failingPersistTo);
+  await assert.rejects(
+    runMigration("import", failingDirectory, failingPersistTo),
+    /UNIQUE constraint failed|D1_EXEC_ERROR/i,
+  );
+
+  const failureAdapters = createWranglerCloudAdapters({
+    persistTo: failingPersistTo,
+    configPath: wranglerConfig,
+  });
+  try {
+    assert.deepEqual(await failureAdapters.d1.countByProject(), {});
+    for (const attachment of bundle.attachments) {
+      assert.equal(await failureAdapters.r2.head(attachment.id), null);
+    }
+  } finally {
+    await failureAdapters.cleanup();
+  }
+});
diff --git a/apps/codex-taskboard/test/cloud-revision-polling.test.mjs b/apps/codex-taskboard/test/cloud-revision-polling.test.mjs
new file mode 100644
index 000000000..fcf26861a
--- /dev/null
+++ b/apps/codex-taskboard/test/cloud-revision-polling.test.mjs
@@ -0,0 +1,239 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import test from "node:test";
+
+import {
+  createRevisionPoller,
+  getRevisionPollingInterval,
+} from "../web/src/revisionPolling.mjs";
+
+function createTimerHarness() {
+  const intervals = [];
+  const cleared = [];
+
+  return {
+    setInterval(callback, delay) {
+      const timer = { callback, delay };
+      intervals.push(timer);
+      return timer;
+    },
+    clearInterval(timer) {
+      cleared.push(timer);
+    },
+    fire(index = 0) {
+      return intervals[index].callback();
+    },
+    intervals,
+    cleared,
+  };
+}
+
+async function flush() {
+  await Promise.resolve();
+  await Promise.resolve();
+}
+
+async function runFirstPoll(poller, timer, calls) {
+  poller.start();
+  await flush();
+  if (calls.length === 0) {
+    await timer.fire();
+    await flush();
+  }
+}
+
+test("polls the current revision every 2000ms by default and ignores unchanged responses", async () => {
+  const timer = createTimerHarness();
+  const calls = [];
+  let invalidations = 0;
+  const poller = createRevisionPoller({
+    fetchRevision: async (since) => {
+      calls.push(since);
+      return { changed: false, revision: 0 };
+    },
+    onInvalidate: () => {
+      invalidations += 1;
+    },
+    setInterval: timer.setInterval,
+    clearInterval: timer.clearInterval,
+  });
+
+  await runFirstPoll(poller, timer, calls);
+
+  assert.equal(timer.intervals.length, 1);
+  assert.equal(timer.intervals[0].delay, 2000);
+  assert.deepEqual(calls, [0]);
+  assert.equal(invalidations, 0);
+});
+
+test("advances the revision on change and invalidates once", async () => {
+  const timer = createTimerHarness();
+  const calls = [];
+  let invalidations = 0;
+  const responses = [
+    { changed: false, revision: 0 },
+    { changed: true, revision: 7 },
+    { changed: false, revision: 7 },
+  ];
+  const poller = createRevisionPoller({
+    fetchRevision: async (since) => {
+      calls.push(since);
+      return responses.shift();
+    },
+    onInvalidate: () => {
+      invalidations += 1;
+    },
+    setInterval: timer.setInterval,
+    clearInterval: timer.clearInterval,
+  });
+
+  await runFirstPoll(poller, timer, calls);
+  await timer.fire();
+  await flush();
+  await timer.fire();
+  await flush();
+
+  assert.deepEqual(calls, [0, 0, 7]);
+  assert.equal(invalidations, 1);
+});
+
+test("does not start another request while a revision request is pending", async () => {
+  const timer = createTimerHarness();
+  const calls = [];
+  let invalidations = 0;
+  let resolveRequest;
+  const request = new Promise((resolve) => {
+    resolveRequest = resolve;
+  });
+  const poller = createRevisionPoller({
+    fetchRevision: (since) => {
+      calls.push(since);
+      return request;
+    },
+    onInvalidate: () => {
+      invalidations += 1;
+    },
+    setInterval: timer.setInterval,
+    clearInterval: timer.clearInterval,
+  });
+
+  poller.start();
+  await flush();
+  if (calls.length === 0) timer.fire();
+  await flush();
+  timer.fire();
+  timer.fire();
+  await flush();
+
+  assert.deepEqual(calls, [0]);
+
+  resolveRequest({ changed: true, revision: 9 });
+  await flush();
+  await timer.fire();
+  await flush();
+
+  assert.deepEqual(calls, [0, 9]);
+  assert.equal(invalidations, 1);
+});
+
+test("keeps the old revision after an error and retries it on the next tick", async () => {
+  const timer = createTimerHarness();
+  const calls = [];
+  let attempt = 0;
+  let invalidations = 0;
+  const poller = createRevisionPoller({
+    fetchRevision: async (since) => {
+      calls.push(since);
+      attempt += 1;
+      if (attempt === 1) throw new Error("temporarily unavailable");
+      return { changed: true, revision: 4 };
+    },
+    onInvalidate: () => {
+      invalidations += 1;
+    },
+    setInterval: timer.setInterval,
+    clearInterval: timer.clearInterval,
+  });
+
+  await runFirstPoll(poller, timer, calls);
+  await timer.fire();
+  await flush();
+
+  assert.deepEqual(calls, [0, 0]);
+  assert.equal(invalidations, 1);
+});
+
+test("uses an explicit interval and clears its timer when stopped", async () => {
+  const timer = createTimerHarness();
+  const poller = createRevisionPoller({
+    fetchRevision: async () => ({ changed: false, revision: 0 }),
+    onInvalidate: () => {},
+    intervalMs: 750,
+    setInterval: timer.setInterval,
+    clearInterval: timer.clearInterval,
+  });
+
+  poller.start();
+  poller.stop();
+
+  assert.equal(timer.intervals.length, 1);
+  assert.equal(timer.intervals[0].delay, 750);
+  assert.deepEqual(timer.cleared, [timer.intervals[0]]);
+});
+
+test("does not invalidate after being stopped while a request is pending", async () => {
+  const timer = createTimerHarness();
+  let invalidations = 0;
+  let resolveRequest;
+  const poller = createRevisionPoller({
+    fetchRevision: () => new Promise((resolve) => {
+      resolveRequest = resolve;
+    }),
+    onInvalidate: () => {
+      invalidations += 1;
+    },
+    setInterval: timer.setInterval,
+    clearInterval: timer.clearInterval,
+  });
+
+  poller.start();
+  await flush();
+  poller.stop();
+  resolveRequest({ changed: true, revision: 1 });
+  await flush();
+
+  assert.equal(invalidations, 0);
+});
+
+test("cloud metadata selects polling and local metadata does not", () => {
+  assert.equal(getRevisionPollingInterval({
+    mode: "cloud",
+    realtime: { transport: "poll", intervalMs: 2000 },
+  }), 2000);
+  assert.equal(getRevisionPollingInterval({
+    mode: "local",
+    realtime: { transport: "poll", intervalMs: 2000 },
+  }), null);
+  assert.equal(getRevisionPollingInterval({ mode: "cloud" }), null);
+});
+
+test("the app connects the selected realtime transport without reloading the page", async () => {
+  const [appSource, apiSource] = await Promise.all([
+    readFile(new URL("../web/src/App.tsx", import.meta.url), "utf8"),
+    readFile(new URL("../web/src/api.ts", import.meta.url), "utf8"),
+  ]);
+
+  assert.match(apiSource, /\/api\/revisions\?\$\{query\}/);
+  assert.match(appSource, /getRevisionPollingInterval\(taskboardMetadata\)/);
+  assert.match(appSource, /createRevisionPoller\(\{/);
+  assert.match(appSource, /controller\.abort\(\);\s*poller\.stop\(\)/);
+  assert.match(appSource, /new EventSource\("\/api\/events"\)/);
+  assert.doesNotMatch(appSource, /location\.reload\(/);
+
+  const pollingEffect = appSource.slice(
+    appSource.indexOf("if (revisionPollingInterval === null) return;"),
+    appSource.indexOf("function pushUndo"),
+  );
+  assert.doesNotMatch(pollingEffect, /\bdetailTaskId\b|\btaskboardMetadata\b|\bselectedProjectId\b/);
+  assert.match(pollingEffect, /selectedProjectIdRef\.current/);
+});
diff --git a/apps/codex-taskboard/test/cloud-shared-worker.test.mjs b/apps/codex-taskboard/test/cloud-shared-worker.test.mjs
new file mode 100644
index 000000000..69ff54e43
--- /dev/null
+++ b/apps/codex-taskboard/test/cloud-shared-worker.test.mjs
@@ -0,0 +1,620 @@
+import assert from "node:assert/strict";
+import { after, before, test } from "node:test";
+
+import { createCloudWorkerHarness } from "./helpers/cloud-worker-harness.mjs";
+
+let cloud;
+const alice = "Alice";
+const bob = "Bob";
+
+before(async () => {
+  cloud = await createCloudWorkerHarness();
+});
+
+after(async () => {
+  await cloud?.dispose();
+});
+
+async function createProject(id, actorName = alice) {
+  return cloud.request("/api/projects", {
+    method: "POST",
+    actorName,
+    json: {
+      id,
+      name: id.toUpperCase(),
+      workspacePath: `/Users/${actorName.toLowerCase()}/${id}`,
+    },
+  });
+}
+
+async function createTask(projectId, title, actorName = alice, extra = {}) {
+  return cloud.request("/api/tasks", {
+    method: "POST",
+    actorName,
+    json: {
+      projectId,
+      title,
+      description: "",
+      status: "backlog",
+      priority: "none",
+      labels: [],
+      ...extra,
+    },
+  });
+}
+
+test("Basic authentication protects static assets, APIs, and attachment content", async () => {
+  for (const pathname of ["/", "/api/projects", "/api/attachments/missing/content"]) {
+    const missing = await cloud.request(pathname);
+    assert.equal(missing.response.status, 401);
+    assert.match(missing.response.headers.get("www-authenticate") ?? "", /^Basic\b/i);
+
+    const invalid = await cloud.request(pathname, {
+      actorName: alice,
+      password: "wrong",
+    });
+    assert.equal(invalid.response.status, 401);
+    assert.match(invalid.response.headers.get("www-authenticate") ?? "", /^Basic\b/i);
+  }
+});
+
+test("Basic authentication requires an exact shared-secret match", async () => {
+  const accepted = await cloud.request("/api/projects", { actorName: alice });
+  assert.equal(accepted.response.status, 200);
+
+  const lastCharacter = cloud.sharedSecret.at(-1);
+  const sameLengthWrongSecret = `${cloud.sharedSecret.slice(0, -1)}${
+    lastCharacter === "x" ? "y" : "x"
+  }`;
+  assert.equal(sameLengthWrongSecret.length, cloud.sharedSecret.length);
+  const rejected = await cloud.request("/api/projects", {
+    actorName: alice,
+    password: sameLengthWrongSecret,
+  });
+  assert.equal(rejected.response.status, 401);
+  assert.match(rejected.response.headers.get("www-authenticate") ?? "", /^Basic\b/i);
+});
+
+test("the Basic username becomes the trusted actor while the shared password grants access", async () => {
+  const project = await createProject("alpha");
+  assert.equal(project.response.status, 201);
+  assert.equal(project.body.project.workspacePath, null);
+
+  const userTask = await createTask("alpha", "Created in browser", alice);
+  assert.equal(userTask.response.status, 201);
+  assert.equal(userTask.body.task.creatorType, "user");
+  assert.equal(userTask.body.task.creatorName, alice);
+  assert.match(userTask.body.task.creatorId, /^basic:/);
+
+  const agentTask = await cloud.request("/api/tasks", {
+    method: "POST",
+    actorName: bob,
+    headers: { "x-taskboard-client": "taskctl" },
+    json: {
+      projectId: "alpha",
+      title: "Created through taskctl",
+      status: "backlog",
+      priority: "none",
+      labels: [],
+    },
+  });
+  assert.equal(agentTask.response.status, 201);
+  assert.equal(agentTask.body.task.creatorType, "agent");
+  assert.match(agentTask.body.task.creatorName, /Codex Agent/);
+  assert.match(agentTask.body.task.creatorName, /Bob/);
+});
+
+test("projects, tasks, comments, relations, and workflows preserve the current API contract", async () => {
+  const parent = await createTask("alpha", "Parent");
+  const child = await createTask("alpha", "Child");
+  const relation = await cloud.request(
+    `/api/tasks/${child.body.task.id}/relations/parent/${parent.body.task.id}`,
+    {
+      method: "POST",
+      actorName: alice,
+      json: { version: child.body.task.version },
+    },
+  );
+  assert.equal(relation.response.status, 200);
+  assert.equal(relation.body.task.relations.parent.id, parent.body.task.id);
+
+  const comment = await cloud.request(`/api/tasks/${child.body.task.id}/comments`, {
+    method: "POST",
+    actorName: bob,
+    json: { body: "Review note" },
+  });
+  assert.equal(comment.response.status, 201);
+  assert.equal(comment.body.comment.authorName, bob);
+
+  const workspace = {
+    version: 1,
+    tabs: [{ id: "delivery", name: "Delivery" }],
+    activeWorkflowId: "delivery",
+    snapshots: {
+      delivery: {
+        nodes: [],
+        flow: { version: 2, root: { items: [] } },
+        selectedNodeId: null,
+      },
+    },
+  };
+  const saved = await cloud.request("/api/projects/alpha/workflow-workspace", {
+    method: "PUT",
+    actorName: alice,
+    json: { version: 0, workspace },
+  });
+  assert.equal(saved.response.status, 200);
+  assert.equal(saved.body.workflow.version, 1);
+
+  const listed = await cloud.request("/api/tasks?projectId=alpha&archived=false", {
+    actorName: alice,
+  });
+  assert.equal(listed.response.status, 200);
+  assert.ok(listed.body.tasks.some((task) => task.id === child.body.task.id));
+});
+
+test("concurrent issue creation has unique identifiers and stale writes return 409", async () => {
+  const created = await Promise.all(
+    Array.from({ length: 25 }, (_, index) => createTask("alpha", `Concurrent ${index}`)),
+  );
+  for (const result of created) assert.equal(result.response.status, 201);
+  const identifiers = created.map((result) => result.body.task.identifier);
+  assert.equal(new Set(identifiers).size, identifiers.length);
+  const numbers = identifiers
+    .map((identifier) => Number(identifier.slice(identifier.lastIndexOf("-") + 1)))
+    .sort((left, right) => left - right);
+  numbers.forEach((number, index) => {
+    assert.equal(number, numbers[0] + index);
+  });
+
+  const task = created[0].body.task;
+  const winner = await cloud.request(`/api/tasks/${task.id}`, {
+    method: "PATCH",
+    actorName: alice,
+    json: { version: task.version, title: "Winner" },
+  });
+  assert.equal(winner.response.status, 200);
+
+  const stale = await cloud.request(`/api/tasks/${task.id}`, {
+    method: "PATCH",
+    actorName: bob,
+    json: { version: task.version, title: "Stale" },
+  });
+  assert.equal(stale.response.status, 409);
+  assert.equal(stale.body.error.code, "VERSION_CONFLICT");
+  assert.deepEqual(stale.body.error.details, {
+    expectedVersion: task.version,
+    actualVersion: winner.body.task.version,
+  });
+});
+
+test("a failed task insert rolls back its reserved project identifier", async () => {
+  await createProject("atomic-counter");
+  await cloud.db.exec(
+    "CREATE TRIGGER fail_task_insert BEFORE INSERT ON tasks WHEN NEW.title = 'Fail counter' BEGIN SELECT RAISE(ABORT, 'intentional task insert failure'); END;",
+  );
+  const failed = await createTask("atomic-counter", "Fail counter");
+  assert.equal(failed.response.status, 500);
+
+  const counter = await cloud.db.prepare(
+    "SELECT next_task_number FROM projects WHERE id = 'atomic-counter'",
+  ).first("next_task_number");
+  assert.equal(counter, 1);
+
+  const succeeded = await createTask("atomic-counter", "First real issue");
+  assert.equal(succeeded.response.status, 201);
+  assert.equal(succeeded.body.task.identifier, "ATOMICCOUNTE-1");
+});
+
+test("archived tasks are excluded from project issue counts", async () => {
+  const project = await createProject("archive-count");
+  assert.equal(project.response.status, 201);
+  const task = await createTask("archive-count", "Archive me");
+  const before = await cloud.request("/api/projects", { actorName: alice });
+  assert.equal(
+    before.body.projects.find((candidate) => candidate.id === "archive-count").issueCount,
+    1,
+  );
+
+  const archived = await cloud.request(`/api/tasks/${task.body.task.id}/archive`, {
+    method: "POST",
+    actorName: alice,
+    json: { version: task.body.task.version },
+  });
+  assert.equal(archived.response.status, 200);
+  const after = await cloud.request("/api/projects", { actorName: alice });
+  assert.equal(
+    after.body.projects.find((candidate) => candidate.id === "archive-count").issueCount,
+    0,
+  );
+});
+
+test("R2 attachment upload, download, delete, and D1 failure compensation form one closed lifecycle", async () => {
+  const task = await createTask("alpha", "Attachment owner");
+  const uploaded = await cloud.request(`/api/tasks/${task.body.task.id}/attachments`, {
+    method: "POST",
+    actorName: alice,
+    headers: {
+      "content-type": "text/plain",
+      "x-taskboard-filename": encodeURIComponent("evidence.txt"),
+    },
+    body: "attachment body",
+  });
+  assert.equal(uploaded.response.status, 201);
+  const attachment = uploaded.body.attachment;
+  const downloaded = await cloud.request(`/api/attachments/${attachment.id}/content`, {
+    actorName: bob,
+  });
+  assert.equal(downloaded.response.status, 200);
+  assert.equal(downloaded.body, "attachment body");
+
+  const deleted = await cloud.request(`/api/attachments/${attachment.id}`, {
+    method: "DELETE",
+    actorName: alice,
+  });
+  assert.equal(deleted.response.status, 204);
+  assert.equal((await cloud.listAttachmentKeys()).length, 0);
+
+  await cloud.db.exec(
+    "CREATE TRIGGER fail_attachment_insert BEFORE INSERT ON attachments WHEN NEW.filename = 'fail.txt' BEGIN SELECT RAISE(ABORT, 'intentional attachment metadata failure'); END;",
+  );
+  const beforeKeys = await cloud.listAttachmentKeys();
+  const failed = await cloud.request(`/api/tasks/${task.body.task.id}/attachments`, {
+    method: "POST",
+    actorName: alice,
+    headers: {
+      "content-type": "text/plain",
+      "x-taskboard-filename": encodeURIComponent("fail.txt"),
+    },
+    body: "must be compensated",
+  });
+  assert.equal(failed.response.status, 500);
+  assert.deepEqual(await cloud.listAttachmentKeys(), beforeKeys);
+});
+
+test("the global revision is monotonic and lets clients poll only when data changed", async () => {
+  const initial = await cloud.request("/api/revisions?since=0", { actorName: alice });
+  assert.equal(initial.response.status, 200);
+  const baseline = initial.body.revision;
+
+  const unchanged = await cloud.request(`/api/revisions?since=${baseline}`, {
+    actorName: alice,
+  });
+  assert.equal(unchanged.body.changed, false);
+
+  await createTask("alpha", "Revision mutation");
+  const changed = await cloud.request(`/api/revisions?since=${baseline}`, {
+    actorName: bob,
+  });
+  assert.equal(changed.body.changed, true);
+  assert.ok(changed.body.revision > baseline);
+
+  const current = await cloud.request(`/api/revisions?since=${changed.body.revision}`, {
+    actorName: alice,
+  });
+  assert.equal(current.body.changed, false);
+});
+
+test("cloud-only local capability routes return an explicit companion requirement", async () => {
+  const meta = await cloud.request("/api/meta", { actorName: alice });
+  assert.equal(meta.response.status, 200);
+  assert.equal(meta.body.mode, "cloud");
+  assert.deepEqual(meta.body.realtime, { transport: "poll", intervalMs: 2000 });
+  assert.equal(meta.body.localCapabilities.available, false);
+
+  for (const pathname of [
+    "/api/device-workspaces",
+    "/api/workflow-capabilities",
+    "/api/projects/alpha/development-contexts",
+  ]) {
+    const result = await cloud.request(pathname, { actorName: alice });
+    assert.equal(result.response.status, 409);
+    assert.equal(result.body.error.code, "LOCAL_COMPANION_REQUIRED");
+  }
+});
+
+test("task lifecycle keeps optimistic versions and never persists a worktree path", async () => {
+  await createProject("task-lifecycle");
+  const created = await createTask("task-lifecycle", "Lifecycle", alice, {
+    developmentContext: { type: "worktree", branch: "feature/shared" },
+  });
+  assert.equal(created.response.status, 201);
+  assert.deepEqual(created.body.task.developmentContext, {
+    type: "worktree",
+    path: null,
+    branch: "feature/shared",
+  });
+
+  const moved = await cloud.request(`/api/tasks/${created.body.task.id}/move`, {
+    method: "POST",
+    actorName: alice,
+    json: {
+      version: created.body.task.version,
+      status: "in_progress",
+    },
+  });
+  assert.equal(moved.response.status, 200);
+  assert.equal(moved.body.task.status, "in_progress");
+
+  const archived = await cloud.request(`/api/tasks/${created.body.task.id}/archive`, {
+    method: "POST",
+    actorName: alice,
+    json: { version: moved.body.task.version },
+  });
+  assert.equal(archived.response.status, 200);
+  assert.ok(archived.body.task.archivedAt);
+
+  const restored = await cloud.request(`/api/tasks/${created.body.task.id}/restore`, {
+    method: "POST",
+    actorName: alice,
+    json: { version: archived.body.task.version },
+  });
+  assert.equal(restored.response.status, 200);
+  assert.equal(restored.body.task.archivedAt, null);
+});
+
+test("relation direction, deletion, and parent-cycle checks match the local contract", async () => {
+  await createProject("relation-parity");
+  const blocker = await createTask("relation-parity", "Blocker");
+  const blocked = await createTask("relation-parity", "Blocked");
+  const blockedBy = await cloud.request(
+    `/api/tasks/${blocked.body.task.id}/relations/blocked_by/${blocker.body.task.id}`,
+    {
+      method: "POST",
+      actorName: alice,
+      json: { version: blocked.body.task.version },
+    },
+  );
+  assert.equal(blockedBy.response.status, 200);
+  assert.equal(blockedBy.body.task.relations.blockedBy[0].id, blocker.body.task.id);
+  assert.equal(blockedBy.body.relatedTask.relations.blocks[0].id, blocked.body.task.id);
+
+  const removed = await cloud.request(
+    `/api/tasks/${blocked.body.task.id}/relations/blocked_by/${blocker.body.task.id}`,
+    {
+      method: "DELETE",
+      actorName: alice,
+      json: { version: blockedBy.body.task.version },
+    },
+  );
+  assert.equal(removed.response.status, 200);
+  assert.deepEqual(removed.body.task.relations.blockedBy, []);
+
+  const child = await createTask("relation-parity", "Child");
+  const parent = await cloud.request(
+    `/api/tasks/${child.body.task.id}/relations/parent/${blocker.body.task.id}`,
+    {
+      method: "POST",
+      actorName: alice,
+      json: { version: child.body.task.version },
+    },
+  );
+  assert.equal(parent.response.status, 200);
+  const cycle = await cloud.request(
+    `/api/tasks/${blocker.body.task.id}/relations/parent/${child.body.task.id}`,
+    {
+      method: "POST",
+      actorName: alice,
+      json: { version: blocker.body.task.version },
+    },
+  );
+  assert.equal(cycle.response.status, 409);
+  assert.equal(cycle.body.error.code, "RELATION_CYCLE");
+});
+
+test("concurrent inverse parent writes cannot create a cycle", async () => {
+  await createProject("concurrent-parent-cycle");
+  const first = await createTask("concurrent-parent-cycle", "First");
+  const second = await createTask("concurrent-parent-cycle", "Second");
+
+  const [firstResult, secondResult] = await Promise.all([
+    cloud.request(
+      `/api/tasks/${first.body.task.id}/relations/parent/${second.body.task.id}`,
+      {
+        method: "POST",
+        actorName: alice,
+        json: { version: first.body.task.version },
+      },
+    ),
+    cloud.request(
+      `/api/tasks/${second.body.task.id}/relations/parent/${first.body.task.id}`,
+      {
+        method: "POST",
+        actorName: bob,
+        json: { version: second.body.task.version },
+      },
+    ),
+  ]);
+
+  assert.deepEqual(
+    [firstResult.response.status, secondResult.response.status].sort(),
+    [200, 409],
+  );
+  const conflict = firstResult.response.status === 409 ? firstResult : secondResult;
+  assert.equal(conflict.body.error.code, "RELATION_CYCLE");
+
+  const rows = await cloud.db.prepare(`
+    SELECT source_task_id, target_task_id
+    FROM task_relations
+    WHERE relation_type = 'parent'
+      AND source_task_id IN (?, ?)
+      AND target_task_id IN (?, ?)
+  `).bind(
+    first.body.task.id,
+    second.body.task.id,
+    first.body.task.id,
+    second.body.task.id,
+  ).all();
+  assert.equal(rows.results.length, 1);
+
+  const third = await createTask("concurrent-parent-cycle", "Third");
+  const fourth = await createTask("concurrent-parent-cycle", "Fourth");
+  const inserted = await Promise.allSettled([
+    cloud.db.prepare(`
+      INSERT INTO task_relations (
+        relation_type, source_task_id, target_task_id, created_at
+      ) VALUES ('parent', ?, ?, ?)
+    `).bind(fourth.body.task.id, third.body.task.id, new Date().toISOString()).run(),
+    cloud.db.prepare(`
+      INSERT INTO task_relations (
+        relation_type, source_task_id, target_task_id, created_at
+      ) VALUES ('parent', ?, ?, ?)
+    `).bind(third.body.task.id, fourth.body.task.id, new Date().toISOString()).run(),
+  ]);
+  assert.equal(inserted.filter((result) => result.status === "fulfilled").length, 1);
+});
+
+test("workflow conflicts and comment attachment cleanup preserve shared-state boundaries", async () => {
+  await createProject("shared-boundaries");
+  const workspace = {
+    version: 1,
+    tabs: [{ id: "delivery", name: "Delivery" }],
+    activeWorkflowId: "delivery",
+    snapshots: {
+      delivery: {
+        nodes: [],
+        flow: { version: 2, root: { items: [] } },
+        selectedNodeId: null,
+      },
+    },
+  };
+  const saved = await cloud.request(
+    "/api/projects/shared-boundaries/workflow-workspace",
+    {
+      method: "PUT",
+      actorName: alice,
+      json: { version: 0, workspace },
+    },
+  );
+  assert.equal(saved.response.status, 200);
+  const stale = await cloud.request(
+    "/api/projects/shared-boundaries/workflow-workspace",
+    {
+      method: "PUT",
+      actorName: bob,
+      json: { version: 0, workspace },
+    },
+  );
+  assert.equal(stale.response.status, 409);
+  assert.deepEqual(stale.body.error.details, {
+    expectedVersion: 0,
+    actualVersion: 1,
+  });
+
+  const task = await createTask("shared-boundaries", "Comment owner");
+  const created = await cloud.request(`/api/tasks/${task.body.task.id}/comments`, {
+    method: "POST",
+    actorName: bob,
+    json: { body: "Initial" },
+  });
+  const attachment = await cloud.request(
+    `/api/comments/${created.body.comment.id}/attachments`,
+    {
+      method: "POST",
+      actorName: bob,
+      headers: {
+        "content-type": "text/plain",
+        "x-taskboard-filename": encodeURIComponent("comment.txt"),
+      },
+      body: "comment attachment",
+    },
+  );
+  assert.equal(attachment.response.status, 201);
+
+  const updated = await cloud.request(`/api/comments/${created.body.comment.id}`, {
+    method: "PATCH",
+    actorName: bob,
+    json: { version: created.body.comment.version, body: "Updated" },
+  });
+  assert.equal(updated.response.status, 200);
+  assert.equal(updated.body.comment.attachments.length, 1);
+
+  const deleted = await cloud.request(`/api/comments/${created.body.comment.id}`, {
+    method: "DELETE",
+    actorName: bob,
+    json: { version: updated.body.comment.version },
+  });
+  assert.equal(deleted.response.status, 204);
+  assert.deepEqual(await cloud.listAttachmentKeys(), []);
+});
+
+test("workflow saves never persist or return a local Git worktree path", async () => {
+  await createProject("workflow-runtime-boundary");
+  const localPath = "/Users/alice/source/workflow-runtime-boundary-worktree";
+  const nestedLocalPath = "/Users/alice/source/nested-plan-worktree";
+  const workspace = {
+    version: 1,
+    tabs: [{ id: "delivery", name: "Delivery" }],
+    activeWorkflowId: "delivery",
+    snapshots: {
+      delivery: {
+        nodes: [
+          {
+            id: "trigger",
+            position: { x: 0, y: 0 },
+            data: { kind: "issue-trigger" },
+          },
+          {
+            id: "git",
+            position: { x: 0, y: 120 },
+            data: {
+              kind: "git",
+              gitOperation: "create-worktree",
+              gitBranchName: "feature/shared-workflow",
+              gitWorktreePath: localPath,
+              additionalInstructions: `Do not rewrite this note: ${localPath}`,
+              planItem: {
+                gitWorktreePath: nestedLocalPath,
+                path: nestedLocalPath,
+                branch: "feature/nested-plan",
+                notes: `Keep this nested note: ${nestedLocalPath}`,
+              },
+            },
+          },
+        ],
+        flow: {
+          version: 2,
+          root: {
+            items: [
+              { type: "step", nodeId: "trigger" },
+              { type: "step", nodeId: "git" },
+            ],
+          },
+        },
+        selectedNodeId: "git",
+      },
+    },
+  };
+
+  const saved = await cloud.request(
+    "/api/projects/workflow-runtime-boundary/workflow-workspace",
+    {
+      method: "PUT",
+      actorName: alice,
+      json: { version: 0, workspace },
+    },
+  );
+  assert.equal(saved.response.status, 200);
+  const savedData = saved.body.workflow.workspace.snapshots.delivery.nodes[1].data;
+  assert.equal(savedData.gitWorktreePath, undefined);
+  assert.equal(savedData.gitBranchName, "feature/shared-workflow");
+  assert.equal(savedData.additionalInstructions, `Do not rewrite this note: ${localPath}`);
+  assert.equal(savedData.planItem.gitWorktreePath, undefined);
+  assert.equal(savedData.planItem.path, nestedLocalPath);
+  assert.equal(savedData.planItem.branch, "feature/nested-plan");
+  assert.equal(savedData.planItem.notes, `Keep this nested note: ${nestedLocalPath}`);
+
+  const row = await cloud.db.prepare(`
+    SELECT workspace FROM workflow_workspaces WHERE project_id = ?
+  `).bind("workflow-runtime-boundary").first();
+  assert.doesNotMatch(row.workspace, /"gitWorktreePath"/);
+  assert.match(row.workspace, new RegExp(localPath));
+  const persistedData = JSON.parse(row.workspace).snapshots.delivery.nodes[1].data;
+  assert.equal(persistedData.gitWorktreePath, undefined);
+  assert.equal(persistedData.gitBranchName, "feature/shared-workflow");
+  assert.equal(persistedData.additionalInstructions, `Do not rewrite this note: ${localPath}`);
+  assert.equal(persistedData.planItem.gitWorktreePath, undefined);
+  assert.equal(persistedData.planItem.path, nestedLocalPath);
+  assert.equal(persistedData.planItem.branch, "feature/nested-plan");
+  assert.equal(persistedData.planItem.notes, `Keep this nested note: ${nestedLocalPath}`);
+});
diff --git a/apps/codex-taskboard/test/comment-activity-style.test.mjs b/apps/codex-taskboard/test/comment-activity-style.test.mjs
new file mode 100644
index 000000000..634513b43
--- /dev/null
+++ b/apps/codex-taskboard/test/comment-activity-style.test.mjs
@@ -0,0 +1,38 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+const detailSource = await readFile(new URL("../web/src/components/TaskDetail.tsx", import.meta.url), "utf8");
+const styles = await readFile(new URL("../web/src/styles.css", import.meta.url), "utf8");
+
+test("comment floors use Linear-style cards with the author inside the card", () => {
+  assert.match(
+    detailSource,
+    /<div className="comment-card">\s*<header className="comment-header">\s*<ActorAvatar/s,
+  );
+  assert.match(styles, /\.comment-entry\s*\{[^}]*display:\s*block;/s);
+  assert.doesNotMatch(styles, /\.activity-stream::before/);
+  assert.match(
+    styles,
+    /\.comment-card\s*\{[^}]*border-radius:\s*8px;[^}]*background:\s*var\(--surface\);[^}]*box-shadow:\s*var\(--card-shadow\);/s,
+  );
+  assert.match(styles, /\.comment-header \.comment-avatar\s*\{[^}]*width:\s*20px;[^}]*height:\s*20px;/s);
+});
+
+test("comment body renders document formatting at Linear typography", () => {
+  assert.match(
+    detailSource,
+    /comment\.body && <div className="comment-body"><DescriptionDocument value=\{comment\.body\} \/><\/div>/,
+  );
+  assert.match(styles, /\.comment-body\s*\{[^}]*font-size:\s*15px;[^}]*line-height:\s*24px;/s);
+  assert.match(styles, /\.comment-body \.issue-description-document\s*\{/);
+});
+
+test("comment composer aligns with the full comment floor width", () => {
+  assert.match(styles, /\.comment-composer\s*\{[^}]*margin:\s*18px 0 0;/s);
+  assert.match(
+    styles,
+    /\.comment-composer\s*\{[^}]*background:\s*var\(--surface\);[^}]*box-shadow:\s*var\(--card-shadow\);/s,
+  );
+  assert.match(styles, /\.composer-footer\s*\{[^}]*border-top:\s*var\(--border-hairline\) solid var\(--border\);/s);
+});
diff --git a/apps/codex-taskboard/test/executable.test.mjs b/apps/codex-taskboard/test/executable.test.mjs
new file mode 100644
index 000000000..fc69e03c2
--- /dev/null
+++ b/apps/codex-taskboard/test/executable.test.mjs
@@ -0,0 +1,23 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+const executableSource = await readFile(
+  new URL("../server/executable.mjs", import.meta.url),
+  "utf8",
+);
+const serverSource = await readFile(new URL("../server/app.mjs", import.meta.url), "utf8");
+
+test("server child processes hide their console window on Windows", () => {
+  assert.match(executableSource, /windowsHide: process\.platform === "win32"/);
+  assert.match(executableSource, /spawn\(command\.executable, command\.args, childProcessOptions\(options\)\)/);
+  assert.match(executableSource, /execFileAsync\(command\.executable, command\.args, childProcessOptions\(options\)\)/);
+});
+
+test("development context Git scans use the hidden-window executable wrapper", () => {
+  assert.doesNotMatch(serverSource, /const execFileAsync =/);
+  assert.equal(
+    [...serverSource.matchAll(/execFileExecutable\("git"/g)].length,
+    3,
+  );
+});
diff --git a/apps/codex-taskboard/test/helpers/cloud-worker-harness.mjs b/apps/codex-taskboard/test/helpers/cloud-worker-harness.mjs
new file mode 100644
index 000000000..e8594aab4
--- /dev/null
+++ b/apps/codex-taskboard/test/helpers/cloud-worker-harness.mjs
@@ -0,0 +1,115 @@
+import { access, mkdtemp, readFile, readdir, rm } from "node:fs/promises";
+import os from "node:os";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+
+import { Miniflare } from "miniflare";
+
+const PROJECT_ROOT = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "../..");
+const ENTRY_PATH = path.join(PROJECT_ROOT, "cloud", "src", "index.mjs");
+const MIGRATIONS_DIRECTORY = path.join(PROJECT_ROOT, "cloud", "migrations");
+
+async function requireCloudImplementation() {
+  const missing = [];
+  for (const filename of [ENTRY_PATH, MIGRATIONS_DIRECTORY]) {
+    try {
+      await access(filename);
+    } catch (error) {
+      if (error.code !== "ENOENT") throw error;
+      missing.push(path.relative(PROJECT_ROOT, filename));
+    }
+  }
+  if (missing.length > 0) {
+    throw new Error(`Cloud implementation is missing:\n${missing.join("\n")}`);
+  }
+}
+
+async function migrationPaths() {
+  const filenames = (await readdir(MIGRATIONS_DIRECTORY))
+    .filter((filename) => filename.endsWith(".sql"))
+    .sort();
+  if (filenames.length === 0) throw new Error("Cloud implementation has no D1 migrations");
+  return filenames.map((filename) => path.join(MIGRATIONS_DIRECTORY, filename));
+}
+
+export async function createCloudWorkerHarness({
+  sharedSecret = "two-person-shared-secret",
+} = {}) {
+  await requireCloudImplementation();
+  const persistenceRoot = await mkdtemp(path.join(os.tmpdir(), "taskboard-cloud-worker-"));
+  const miniflare = new Miniflare({
+    modules: true,
+    scriptPath: ENTRY_PATH,
+    modulesRoot: PROJECT_ROOT,
+    compatibilityDate: "2026-07-24",
+    bindings: {
+      TASKBOARD_ENVIRONMENT: "production",
+      TASKBOARD_SHARED_SECRET: sharedSecret,
+    },
+    d1Databases: { DB: "taskboard-test" },
+    r2Buckets: { ATTACHMENTS: "taskboard-test-attachments" },
+    defaultPersistRoot: persistenceRoot,
+    d1Persist: true,
+    r2Persist: true,
+  });
+
+  try {
+    await miniflare.ready;
+    const db = await miniflare.getD1Database("DB");
+    for (const migrationPath of await migrationPaths()) {
+      await db.exec(await readFile(migrationPath, "utf8"));
+    }
+    const attachments = await miniflare.getR2Bucket("ATTACHMENTS");
+
+    async function request(pathname, {
+      actorName,
+      password = sharedSecret,
+      json,
+      headers: inputHeaders,
+      ...init
+    } = {}) {
+      const headers = new Headers(inputHeaders);
+      if (actorName !== undefined) {
+        headers.set(
+          "authorization",
+          `Basic ${Buffer.from(`${actorName}:${password}`, "utf8").toString("base64")}`,
+        );
+      }
+      if (json !== undefined) headers.set("content-type", "application/json");
+      const response = await miniflare.dispatchFetch(
+        new URL(pathname, "https://taskboard.example.test"),
+        {
+          ...init,
+          headers,
+          body: json === undefined ? init.body : JSON.stringify(json),
+        },
+      );
+      const contentType = response.headers.get("content-type") ?? "";
+      const body = response.status === 204
+        ? undefined
+        : contentType.includes("application/json")
+          ? await response.clone().json()
+          : await response.clone().text();
+      return { response, body };
+    }
+
+    return {
+      attachments,
+      db,
+      miniflare,
+      request,
+      sharedSecret,
+      async listAttachmentKeys() {
+        return (await attachments.list()).objects.map((object) => object.key).sort();
+      },
+      async dispose() {
+        await miniflare.dispose();
+        await rm(persistenceRoot, { recursive: true, force: true });
+      },
+    };
+  } catch (error) {
+    await miniflare.dispose();
+    await rm(persistenceRoot, { recursive: true, force: true });
+    throw error;
+  }
+}
diff --git a/apps/codex-taskboard/test/hidden-columns.test.mjs b/apps/codex-taskboard/test/hidden-columns.test.mjs
new file mode 100644
index 000000000..d3b9fbf3c
--- /dev/null
+++ b/apps/codex-taskboard/test/hidden-columns.test.mjs
@@ -0,0 +1,79 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+const appSource = await readFile(new URL("../web/src/App.tsx", import.meta.url), "utf8");
+const settingsSource = await readFile(new URL("../web/src/components/BoardSettingsMenu.tsx", import.meta.url), "utf8");
+const boardColumnSource = await readFile(new URL("../web/src/components/BoardColumn.tsx", import.meta.url), "utf8");
+const hiddenColumnsSource = await readFile(new URL("../web/src/components/HiddenColumns.tsx", import.meta.url), "utf8");
+const visibilityMenuSource = await readFile(new URL("../web/src/components/ColumnVisibilityMenu.tsx", import.meta.url), "utf8");
+const iconSource = await readFile(new URL("../web/src/components/LinearIcon.tsx", import.meta.url), "utf8");
+const styles = await readFile(new URL("../web/src/styles.css", import.meta.url), "utf8");
+
+test("empty workflow statuses are partitioned from the filtered board result", () => {
+  assert.match(appSource, /const visibleStatuses = useMemo\([\s\S]*?tasksByStatus\[status\]\.length === 0[\s\S]*?\? showEmptyColumns[\s\S]*?: \(columnVisibility\?\.\[status\] \?\? true\)/);
+  assert.match(appSource, /const hiddenStatuses = useMemo\([\s\S]*?tasksByStatus\[status\]\.length === 0[\s\S]*?\? !showEmptyColumns[\s\S]*?: !\(columnVisibility\?\.\[status\] \?\? true\)/);
+  assert.match(appSource, /visibleStatuses\.map\(\(status\) =>/);
+  assert.match(appSource, /statusIndex=\{TASK_STATUSES\.indexOf\(status\)\}/);
+  assert.match(appSource, /hiddenStatuses\.length > 0[\s\S]*?<HiddenColumns/);
+  assert.doesNotMatch(appSource, /\) : filteredTasks\.length === 0 && tasks\.length > 0 \? \(/);
+  assert.match(appSource, /<div className="board">[\s\S]*?filteredTasks\.length === 0[\s\S]*?<HiddenColumns/);
+});
+
+test("show empty columns is off by default, persisted locally, and updates immediately", () => {
+  assert.match(appSource, /const SHOW_EMPTY_COLUMNS_KEY = "taskboard\.showEmptyColumns\.v1"/);
+  assert.match(appSource, /getItem\(SHOW_EMPTY_COLUMNS_KEY\) === "true"/);
+  assert.match(appSource, /useState\(readShowEmptyColumns\)/);
+  assert.match(appSource, /localStorage\.setItem\(SHOW_EMPTY_COLUMNS_KEY, String\(show\)\)/);
+  assert.match(appSource, /setShowEmptyColumns\(show\)/);
+  assert.match(settingsSource, /role="switch"/);
+  assert.match(settingsSource, /aria-checked=\{showEmptyColumns\}/);
+  assert.match(settingsSource, />显示空列</);
+});
+
+test("column menus persist manual hiding and showing per project", () => {
+  assert.match(appSource, /const COLUMN_VISIBILITY_KEY = "taskboard\.columnVisibility\.v1"/);
+  assert.match(appSource, /useState\(readColumnVisibilityByProject\)/);
+  assert.match(appSource, /window\.localStorage\.setItem\(COLUMN_VISIBILITY_KEY, JSON\.stringify\(next\)\)/);
+  assert.match(appSource, /if \(!selectedProjectId \|\| tasksByStatus\[status\]\.length === 0\) return/);
+  assert.match(appSource, /onHide=\{\(hiddenStatus\) => updateColumnVisibility\(hiddenStatus, false\)\}/);
+  assert.match(appSource, /onShow=\{\(shownStatus\) => updateColumnVisibility\(shownStatus, true\)\}/);
+  assert.match(boardColumnSource, /tasks\.length > 0[\s\S]*?action="hide"/);
+  assert.match(boardColumnSource, /onAction=\{\(\) => onHide\(status\)\}/);
+  assert.match(hiddenColumnsSource, /const canShow = counts\[status\] > 0/);
+  assert.match(hiddenColumnsSource, /canShow[\s\S]*?action="show"/);
+  assert.match(hiddenColumnsSource, /onClick=\{\(\) => onShow\(status\)\}/);
+  assert.match(hiddenColumnsSource, /className="hidden-column-show is-empty"/);
+  assert.match(hiddenColumnsSource, /\{counts\[status\]\}/);
+  assert.match(visibilityMenuSource, /action === "hide" \? "隐藏列" : "显示列"/);
+  assert.match(visibilityMenuSource, /createPortal/);
+  assert.match(styles, /\.column-visibility-menu/);
+  assert.match(styles, /\.hidden-column-show/);
+});
+
+test("隐藏列 is collapsible and accepts drops into hidden statuses", () => {
+  assert.match(hiddenColumnsSource, /aria-controls="hidden-columns-list"/);
+  assert.match(hiddenColumnsSource, /aria-expanded=\{open\}/);
+  assert.match(hiddenColumnsSource, /aria-label="隐藏列"/);
+  assert.match(hiddenColumnsSource, />隐藏列</);
+  assert.doesNotMatch(hiddenColumnsSource, /statuses\.length/);
+  assert.match(hiddenColumnsSource, /application\/x-taskboard-task/);
+  assert.match(hiddenColumnsSource, /onDrop\(status, taskId\)/);
+  assert.match(appSource, /onDrop=\{\(destination, taskId\) => finishTaskDrop\(destination, taskId\)\}/);
+  assert.match(styles, /\.hidden-column-item\.is-drop-target/);
+});
+
+test("display options uses the centralized Linear sliders asset", () => {
+  assert.match(settingsSource, /<LinearIcon name="displayOptions" \/>/);
+  assert.doesNotMatch(settingsSource, /<svg/);
+  assert.match(iconSource, /displayOptions: \{/);
+  assert.match(iconSource, /M7 2\.5C8\.11933 2\.5/);
+  assert.match(styles, /\.board-settings-menu/);
+  assert.match(styles, /\.board-setting-switch\.is-on/);
+});
+
+test("settings focus enters the portal and returns to the trigger on Escape", () => {
+  assert.match(settingsSource, /requestAnimationFrame\(\(\) => menuRef\.current\?\.querySelector<HTMLButtonElement>\("\[role='switch'\]"\)\?\.focus\(\)\)/);
+  assert.match(settingsSource, /event\.key === "Escape"[\s\S]*?triggerRef\.current\?\.focus\(\)/);
+  assert.match(settingsSource, /event\.key === "Tab"[\s\S]*?event\.preventDefault\(\)/);
+});
diff --git a/apps/codex-taskboard/test/icon-system.test.mjs b/apps/codex-taskboard/test/icon-system.test.mjs
new file mode 100644
index 000000000..0aa321a58
--- /dev/null
+++ b/apps/codex-taskboard/test/icon-system.test.mjs
@@ -0,0 +1,39 @@
+import assert from "node:assert/strict";
+import { readdir, readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+const componentsUrl = new URL("../web/src/components/", import.meta.url);
+const componentFiles = (await readdir(componentsUrl))
+  .filter((name) => name.endsWith(".tsx") && name !== "LinearIcon.tsx")
+  .map((name) => new URL(name, componentsUrl));
+const productFiles = [new URL("../web/src/App.tsx", import.meta.url), ...componentFiles];
+const styles = await readFile(new URL("../web/src/styles.css", import.meta.url), "utf8");
+const iconSource = await readFile(new URL("../web/src/components/LinearIcon.tsx", import.meta.url), "utf8");
+
+test("product UI uses the reverse-engineered Linear icon system", async () => {
+  for (const file of productFiles) {
+    const source = await readFile(file, "utf8");
+    assert.doesNotMatch(source, /<svg\b/, `${file.pathname} contains a hand-drawn SVG`);
+    assert.doesNotMatch(source, /[★✓☼☾⌕›▣↻]|•••|···/, `${file.pathname} contains a text glyph used as an icon`);
+  }
+});
+
+test("legacy CSS-drawn status and priority icons stay removed", () => {
+  assert.doesNotMatch(
+    styles,
+    /brand-mark i|context-status-glyph|context-priority-glyph|filter-priority-glyph|filter-unlinked-glyph/,
+  );
+});
+
+test("new workflow statuses use the central Linear icon mapping and semantic colors", () => {
+  assert.match(iconSource, /in_review: "statusStarted"/);
+  assert.match(iconSource, /blocked: "alert"/);
+  assert.match(iconSource, /canceled: "statusCanceled"/);
+  assert.match(iconSource, /statusCanceled: \{[\s\S]*?M8 15A7 7 0 1 0 8 1/);
+  assert.match(styles, /--status-review: #43bc58/);
+  assert.match(styles, /--status-blocked: #f34e52/);
+  assert.match(styles, /--status-canceled: #9e9ea1/);
+  assert.match(styles, /\.status-icon-review \{ color: var\(--status-review\); \}/);
+  assert.match(styles, /\.status-icon-blocked \{ color: var\(--status-blocked\); \}/);
+  assert.match(styles, /\.status-icon-canceled \{ color: var\(--status-canceled\); \}/);
+});
diff --git a/apps/codex-taskboard/test/inject.test.mjs b/apps/codex-taskboard/test/inject.test.mjs
new file mode 100644
index 000000000..d99416b79
--- /dev/null
+++ b/apps/codex-taskboard/test/inject.test.mjs
@@ -0,0 +1,364 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+import vm from "node:vm";
+
+import { parseTaskboardAutomationHostRequest } from "../shared/taskboard-automation.mjs";
+
+const sourceUrl = new URL("../inject/codex-taskboard.user.js", import.meta.url);
+const source = await readFile(sourceUrl, "utf8");
+const webStyles = await readFile(new URL("../web/src/styles.css", import.meta.url), "utf8");
+const webApp = await readFile(new URL("../web/src/App.tsx", import.meta.url), "utf8");
+
+test("injection is an idempotent IIFE guarded by its current source hash", () => {
+  assert.match(source, /^\(\(\) => \{/);
+  assert.match(source, /const VERSION = "0\.6\.8"/);
+  assert.match(source, /const SOURCE_HASH = window\.__CODEX_TASKBOARD_SOURCE_HASH__/);
+  assert.match(source, /const SENTINEL_KEY = "__codexTaskboardInjection__"/);
+  assert.match(source, /previous\?\.sourceHash === SOURCE_HASH/);
+  assert.match(source, /previous\.refresh\(\);\s*return;/);
+  assert.match(source, /sourceHash: SOURCE_HASH/);
+  assert.match(source, /window\[SENTINEL_KEY\] = api/);
+});
+
+test("embedded page uses the local taskboard URL and supports a runtime override", () => {
+  assert.match(source, /http:\/\/127\.0\.0\.1:47823\/\?host=codex/);
+  assert.match(source, /window\.__CODEX_TASKBOARD_URL__/);
+  assert.match(source, /nextFrame\.src = taskboardUrl\.href/);
+  assert.match(source, /frameOrigin = taskboardUrl\.origin/);
+});
+
+test("entry clones the native Plugins row and the page covers the complete Codex workspace", () => {
+  assert.match(source, /const PLUGIN_LABELS = \["插件", "plugins"\]/);
+  assert.match(source, /if \(plugin\?\.parentElement\) return plugin;/);
+  assert.match(source, /return directButtons\.length >= 3/);
+  assert.match(source, /const button = reference\.cloneNode\(true\)/);
+  assert.match(source, /reference\.after\(entry\)/);
+  assert.match(source, /document\.querySelector\("\.app-shell-main-content-frame"\)/);
+  assert.match(source, /const surface = viewport\?\.parentElement/);
+  assert.match(source, /surface\.appendChild\(page\)/);
+  assert.match(source, /#\$\{PAGE_ID\} \{[\s\S]*?top: 0;/);
+  assert.doesNotMatch(source, /--codex-taskboard-top-offset/);
+  assert.match(source, /child\.setAttribute\(HIDDEN_ATTRIBUTE, "true"\)/);
+  assert.match(source, /page\.hidden = false/);
+  assert.doesNotMatch(source, /codex-taskboard-overlay/);
+  assert.doesNotMatch(source, /codex-taskboard-toolbar/);
+  assert.doesNotMatch(source, /aria-modal/);
+});
+
+test("injected Codex controls reuse the app's icon style instead of text glyphs", () => {
+  assert.match(source, /const CODEX_ICONS = \{/);
+  assert.match(source, /function applyCodexIcon\(svg, name\)/);
+  assert.match(source, /applyCodexIcon\(icon, "panel"\)/);
+  const panelSource = source.slice(
+    source.indexOf("function toggleNativeThreadPanelSize"),
+    source.indexOf("\n\n  async function showNativeThreadPanel"),
+  );
+  assert.match(panelSource, /setIconButton\(button, nativeThreadPanelSize === "maximized" \? "chevronDown" : "expand"\)/);
+  assert.match(panelSource, /setIconButton\(full, "openExternal"\)/);
+  assert.match(panelSource, /setIconButton\(size, nativeThreadPanelSize === "maximized" \? "chevronDown" : "expand"\)/);
+  assert.match(panelSource, /setIconButton\(close, "close"\)/);
+  assert.doesNotMatch(panelSource, /full\.textContent/);
+  assert.doesNotMatch(panelSource, /size\.textContent/);
+  assert.doesNotMatch(panelSource, /close\.textContent/);
+});
+
+test("native thread panel uses the compact and specified expanded sizes", () => {
+  assert.match(source, /width: min\(440px, calc\(100vw - 24px\)\)/);
+  assert.match(source, /height: min\(620px, calc\(100vh - 24px\)\)/);
+  assert.match(source, /width: min\(760px, calc\(100vw - 24px\)\)/);
+  assert.match(source, /height: min\(760px, calc\(100vh - 24px\)\)/);
+  assert.match(source, /@media \(max-width: 720px\)/);
+  assert.doesNotMatch(source, /#\$\{NATIVE_THREAD_PANEL_ID\}\[data-size="maximized"\][\s\S]*?inset:/);
+});
+
+test("native thread panel focuses the conversation column instead of Codex side chrome", () => {
+  assert.match(source, /--thread-content-max-width: 100% !important;/);
+  assert.match(source, /\.thread-scroll-container > \.flex\.min-h-full\.shrink-0\.flex-col\.justify-start \{/);
+  assert.match(source, /transform: none !important;/);
+  assert.match(source, /\.thread-scroll-container \.mx-auto\.w-full\[class\*="max-w-"\] \{/);
+  assert.match(source, /\.pointer-events-none\.absolute\[class\*="right-0"\]\[class\*="z-40"\] \{/);
+  assert.match(source, /display: none !important;/);
+});
+
+test("opening Taskboard suppresses native selection and contextual header until close", () => {
+  assert.match(source, /aside nav\[role="navigation"\] \[aria-current\]/);
+  assert.match(source, /const NATIVE_PAGE_LABELS = \[[\s\S]*"新对话"[\s\S]*"new conversation"/);
+  assert.match(source, /node\.removeAttribute\("aria-current"\)/);
+  assert.match(source, /NATIVE_SELECTED_ATTRIBUTE/);
+  assert.match(source, /app-shell-header-context-menu-surface/);
+  assert.match(source, /restoreNativeSelection\(\)/);
+  assert.match(source, /function onDocumentClick[\s\S]*closeTaskboard\(false\);/);
+  assert.doesNotMatch(source, /setTimeout\(\(\) => closeTaskboard\(false\), 0\)/);
+});
+
+test("the embedded header fills the native titlebar without clipping or a full-page no-drag region", () => {
+  assert.match(source, /top: 0;/);
+  assert.match(source, /z-index: 31 !important/);
+  assert.doesNotMatch(source, /headerRightInset/);
+  assert.doesNotMatch(source, /NATIVE_HEADER_RIGHT_INSET/);
+  assert.doesNotMatch(source, /clip-path: polygon/);
+  assert.doesNotMatch(source, /codex-taskboard-titlebar-fill/);
+  assert.doesNotMatch(source, /#\$\{PAGE_ID\} \{[^}]*-webkit-app-region: no-drag !important;/);
+  assert.doesNotMatch(source, /#\$\{FRAME_ID\} \{[^}]*-webkit-app-region: no-drag !important;/);
+  assert.match(source, /const NO_DRAG_LEFT_ID = "codex-taskboard-no-drag-left"/);
+  assert.match(source, /const NO_DRAG_RIGHT_ID = "codex-taskboard-no-drag-right"/);
+  assert.match(source, /window\.addEventListener\("resize", scheduleRefresh\)/);
+});
+
+test("only the empty embedded header spacer is draggable", () => {
+  assert.match(webApp, /<div ref=\{dragRegionRef\} className="workspace-drag-region" aria-hidden="true" \/>/);
+  assert.match(webApp, /type: "taskboard:drag-region"/);
+  assert.match(source, /const DRAG_REGION_ID = "codex-taskboard-drag-region"/);
+  assert.match(source, /message\.type === "taskboard:drag-region"/);
+  assert.match(source, /function updateDragRegion\(payload\)/);
+  assert.match(source, /#\$\{DRAG_REGION_ID\} \{[\s\S]*?-webkit-app-region: drag;/);
+  assert.doesNotMatch(webStyles, /\.app-shell\.embedded \.workspace-header \{\s*-webkit-app-region: no-drag;/);
+  assert.match(
+    webStyles,
+    /\.app-shell\.embedded \.workspace-drag-region \{\s*-webkit-app-region: drag;/,
+  );
+  assert.match(
+    webStyles,
+    /\.app-shell\.embedded \.workspace-header \.header-actions,[\s\S]*?-webkit-app-region: no-drag;/,
+  );
+});
+
+test("the embedded header clears the macOS window controls when the Codex sidebar is collapsed", () => {
+  assert.match(source, /const MACOS_TITLEBAR_SAFE_LEFT = 80/);
+  assert.match(source, /function titlebarLeftInset\(\)/);
+  assert.match(source, /if \(nativeSidebarCollapsed\(\)\) return MACOS_TITLEBAR_SAFE_LEFT/);
+  assert.match(source, /MACOS_TITLEBAR_SAFE_LEFT - surfaceLeft/);
+  assert.match(source, /titlebarLeftInset: titlebarLeftInset\(\)/);
+  assert.match(webApp, /--codex-titlebar-left-inset/);
+  assert.match(webStyles, /padding-left: calc\(16px \+ var\(--codex-titlebar-left-inset, 0px\)\)/);
+});
+
+test("the embedded header exposes Codex's native sidebar expansion when collapsed", () => {
+  assert.match(source, /\[data-app-shell-sidebar-trigger="true"\]/);
+  assert.match(source, /function nativeSidebarCollapsed\(\)/);
+  assert.match(source, /sidebarCollapsed: nativeSidebarCollapsed\(\)/);
+  assert.match(source, /message\.type === "taskboard:expand-sidebar"/);
+  assert.match(source, /function expandNativeSidebar\(\)[\s\S]*?trigger\.click\(\)/);
+  assert.match(webApp, /embedded && hostContext\?\.sidebarCollapsed/);
+  assert.match(webApp, /type: "taskboard:expand-sidebar"/);
+  assert.match(webApp, /className="detail-back-button codex-sidebar-expand-button"/);
+  assert.match(webApp, /<LinearIcon name="codexSidebarExpand" \/>/);
+  assert.match(webStyles, /\.codex-sidebar-expand-button \{[\s\S]*?width: 28px;[\s\S]*?height: 28px;/);
+});
+
+test("opening asks the resident launcher to ensure the service and rebuilds failed frames", () => {
+  assert.match(source, /const HOST_BINDING_NAME = "__codexTaskboardHostV1"/);
+  assert.match(source, /return requestHost\("ensure"\)/);
+  assert.match(source, /result\.restarted/);
+  assert.match(source, /loadTaskboardFrame\(\)/);
+  assert.match(source, /waitForFrameReady\(\)/);
+  assert.match(source, /hostResponse: onHostResponse/);
+  assert.match(source, /function hasLiveHostBinding/);
+  assert.match(source, /HOST_HEARTBEAT_MAX_AGE_MS/);
+});
+
+test("the injected iframe can be cache-busted without reloading the Codex shell", () => {
+  assert.match(source, /const FRAME_REFRESH_PARAM = "__codex_taskboard_refresh"/);
+  assert.match(source, /function reloadFrame\(\)/);
+  assert.match(source, /loadTaskboardFrame\(true\)/);
+  assert.match(source, /reloadFrame,/);
+});
+
+test("reopening reuses a ready cache-busted iframe without showing the startup placeholder", () => {
+  assert.match(source, /function frameMatchesTaskboardUrl\(taskboardUrl\)/);
+  assert.match(source, /loadedUrl\.searchParams\.delete\(FRAME_REFRESH_PARAM\)/);
+  assert.match(source, /expectedUrl\.searchParams\.delete\(FRAME_REFRESH_PARAM\)/);
+  const prepareSource = source.slice(
+    source.indexOf("async function prepareTaskboard"),
+    source.indexOf("function restoreNativeContent"),
+  );
+  assert.match(prepareSource, /const canReuseFrame = Boolean\([\s\S]*frameMatchesTaskboardUrl\(taskboardUrl\)/);
+  assert.match(prepareSource, /if \(canReuseFrame\) showFrame\(\);\s*else showLoading\(\);/);
+  assert.match(
+    prepareSource,
+    /if \(!frameReady \|\| result\.restarted \|\| !frameMatchesTaskboardUrl\(taskboardUrl\)\) \{\s*showLoading\(\);/,
+  );
+  assert.doesNotMatch(prepareSource, /async function prepareTaskboard\(generation\) \{\s*showLoading\(\);/);
+});
+
+test("iframe messages require both the exact origin and source window", () => {
+  assert.match(
+    source,
+    /event\.source !== frame\.contentWindow \|\| event\.origin !== frameOrigin/,
+  );
+  assert.match(source, /message\.type === "taskboard:open-thread"/);
+  assert.match(source, /message\.type === "taskboard:create-thread"/);
+  assert.match(source, /postMessage\(message, frameOrigin\)/);
+});
+
+test("the iframe automation contract is forwarded through the fixed host binding", () => {
+  assert.match(source, /message\.type === "taskboard:automation-request"/);
+  assert.match(source, /function handleAutomationRequest\(payload\)/);
+  assert.match(source, /requestHost\(\s*"automation",\s*buildAutomationHostPayload\(payload\),\s*\)/);
+  assert.match(source, /operation: payload\.operation/);
+  assert.match(source, /taskboardProjectId: payload\.taskboardProjectId/);
+  assert.match(source, /codexProjectId: payload\.codexProjectId/);
+  assert.match(source, /workspacePath: payload\.workspacePath/);
+  assert.match(source, /skillPath: payload\.skillPath/);
+  assert.match(source, /model: payload\.model/);
+  assert.match(source, /reasoningEffort: payload\.reasoningEffort/);
+  assert.match(source, /type: "taskboard:automation-response"/);
+  assert.match(source, /requestId,\s*ok: true,\s*item: response\.item/);
+  assert.match(source, /items: response\.items/);
+  assert.match(source, /requestId,\s*ok: false,\s*error:/);
+  assert.match(source, /binding\(JSON\.stringify\(\{ \.\.\.payload, id, action \}\)\)/);
+});
+
+test("complete App automation payloads cross the injected forwarder into the current parser", () => {
+  const functionSource = source.slice(
+    source.indexOf("function buildAutomationHostPayload"),
+    source.search(/\r?\n\r?\n  async function handleAutomationRequest/),
+  );
+  assert.ok(functionSource.startsWith("function buildAutomationHostPayload"));
+  const buildAutomationHostPayload = vm.runInNewContext(`(${functionSource})`);
+  const basePayload = {
+    requestId: "request-1",
+    taskboardProjectId: "local",
+    codexProjectId: "codex-project",
+    projectName: "Local",
+    workspacePath: "/tmp/local-project",
+    skillPath: "/tmp/manage-taskboard/SKILL.md",
+    automationId: "automation-1",
+    enabledByUser: true,
+    quotaAware: false,
+    intervalMinutes: 10,
+    model: "gpt-5.6-sol",
+    reasoningEffort: "ultra",
+  };
+
+  for (const operation of ["list", "pause", "ensure-active"]) {
+    const forwarded = {
+      id: `host-${operation}`,
+      action: "automation",
+      ...buildAutomationHostPayload({ ...basePayload, operation }),
+    };
+    assert.deepEqual(
+      parseTaskboardAutomationHostRequest(forwarded),
+      forwarded,
+      `${operation} must retain model and reasoningEffort`,
+    );
+  }
+});
+
+test("only a loopback Taskboard iframe can request native automation", () => {
+  assert.match(source, /function isLocalTaskboardOrigin\(origin\)/);
+  assert.match(source, /hostname === "127\.0\.0\.1" \|\| hostname === "localhost"/);
+  assert.match(
+    source,
+    /if \(!isLocalTaskboardOrigin\(frameOrigin\)\) \{\s*postToFrame\(\{\s*type: "taskboard:automation-response"/,
+  );
+});
+
+test("issues open an unsent native Codex composer in the exact workspace with a Skill mention", () => {
+  assert.match(source, /function createThreadForTask\(payload\)/);
+  assert.match(source, /\[data-app-action-sidebar-select-project\]/);
+  assert.match(source, /data-codex-composer/);
+  assert.match(source, /type: "electron-set-active-workspace-root"/);
+  assert.match(source, /root: workspacePath/);
+  assert.doesNotMatch(source, /prefillPrompt: prompt/);
+  assert.match(source, /requestHostTaskComposerPrefill\(\{/);
+  assert.match(source, /requestHost\("prefill-task-composer"/);
+  assert.match(source, /function waitForPreparedComposer\(identifier, skillPath\)/);
+  assert.match(source, /\[skill-mention-name\]/);
+  assert.match(source, /mention\.getAttribute\("skill-mention-path"\) === skillPath/);
+  assert.doesNotMatch(source, /submit\.click\(\)/);
+  assert.match(source, /type: "taskboard:thread-prepared"/);
+  assert.doesNotMatch(source, /function waitForCreatedThread/);
+  assert.doesNotMatch(source, /type: "taskboard:thread-created"/);
+  assert.doesNotMatch(webApp, /taskboard:thread-created/);
+  assert.match(
+    webApp,
+    /const instruction = `e-taskboard Addressing the tasks mentioned in \$\{task\.identifier\}`/,
+  );
+  assert.match(
+    webApp,
+    /const prompt = `\[\$manage-taskboard\]\(\$\{manageTaskboardSkillPath\}\) \$\{instruction\}`/,
+  );
+  assert.match(webApp, /skillName: "manage-taskboard"/);
+  assert.match(webApp, /skillDisplayName: "Manage Taskboard"/);
+  assert.match(webApp, /skillPath: manageTaskboardSkillPath/);
+  assert.match(webApp, /instruction,/);
+  assert.match(webApp, /type: "taskboard:create-thread"/);
+  assert.match(webApp, /type: "taskboard:open-thread"[\s\S]*workspacePath: resolvedWorkspacePath/);
+  assert.match(webApp, /getCodexThreadTitle\(codexThreadId\)/);
+  assert.match(webApp, /const threadTitle = await resolveCodexThreadTitle\(codexThreadId, task\.title\)/);
+});
+
+test("the standalone web page opens linked Codex tasks through the app deep link", () => {
+  assert.match(webApp, /window\.location\.assign\(`codex:\/\/threads\/\$\{encodeURIComponent\(codexThreadId\)\}`\)/);
+});
+
+test("the injected app opens an existing local Codex task instead of a new composer", () => {
+  const openThreadSource = source.slice(
+    source.indexOf("async function navigateNativeThread"),
+    source.indexOf("function projectRowById"),
+  );
+  assert.match(openThreadSource, /if \(row\?\.isConnected\) \{[\s\S]*row\.click\?\.\(\);[\s\S]*return true;/);
+  assert.match(source, /function openThreadDeepLink\(threadId\) \{[\s\S]*window\.location\.assign\(deepLink\);[\s\S]*\}/);
+  assert.match(
+    source,
+    /async function openThread\(threadId, workspacePath = "", threadTitle = ""\) \{[\s\S]*nativeThreadPanelWorkspacePath[\s\S]*if \(!opened\) openThreadDeepLink\(threadId\);/,
+  );
+  assert.match(openThreadSource, /await dispatchHostMessage\(\{\s*type: "navigate-to-route",\s*path: routeForThread\(normalizedThreadId\)/);
+  assert.match(openThreadSource, /return waitForNativeThread\(normalizedThreadId, normalizedThreadTitle\)/);
+  assert.match(openThreadSource, /showNativeThreadFallback\(threadId\)/);
+  assert.match(source, /return `\/local\/\$\{encodeURIComponent\(threadId\)\}`/);
+  assert.doesNotMatch(source, /return `\/thread\/\$\{encodeURIComponent\(threadId\)\}`/);
+  assert.doesNotMatch(openThreadSource, /focusComposerNonce/);
+  assert.match(openThreadSource, /findThreadRow\(normalizedThreadId, normalizedThreadTitle\)/);
+});
+
+test("host navigation follows Codex's renderer message bus", () => {
+  assert.match(source, /function dispatchHostMessage\(message\)/);
+  assert.match(source, /window\.postMessage\(message, window\.location\.origin\)/);
+  assert.doesNotMatch(source, /new CustomEvent\("codex-message-from-view"/);
+});
+
+test("the standalone web page opens unlinked issues as prefilled empty Codex tasks", () => {
+  assert.match(webApp, /const query = new URLSearchParams\(\)/);
+  assert.match(webApp, /query\.set\("path", workspacePath\)/);
+  assert.match(webApp, /query\.set\("prompt", prompt\)/);
+  assert.match(webApp, /window\.location\.assign\(`codex:\/\/new\?/);
+});
+
+test("host context captures all Codex projects even when the sidebar section is collapsed", () => {
+  assert.match(source, /function readCodexProjects\(\)/);
+  assert.match(source, /\[data-app-action-sidebar-project-row\]/);
+  assert.match(source, /data-app-action-sidebar-project-id/);
+  assert.match(source, /function findProjectsSection\(\)/);
+  assert.match(source, /data-app-action-sidebar-section-collapsed/);
+  assert.match(source, /async function captureHostContext\(\)/);
+  assert.match(source, /while \(!section && Date\.now\(\) < sectionDeadline\)/);
+  assert.match(source, /requestHostEnsure\(taskboardUrl\),\s*captureHostContext\(\),/);
+  assert.match(source, /let lastNativeThreadId = ""/);
+  assert.match(source, /clickedThreadId.*lastNativeThreadId/s);
+  assert.match(source, /activeThreadId \|\| lastNativeThreadId \|\| normalizeThreadId\(threadIdFromLocation\(\)\)/);
+  assert.match(source, /replace\(\/\^\(\?:local\|cloud\):\/i, ""\)/);
+  assert.match(source, /function findTasksSection\(\)/);
+});
+
+test("cleanup removes observers, listeners, timers and owned DOM", () => {
+  assert.match(source, /observer\?\.disconnect\(\)/);
+  assert.match(source, /window\.removeEventListener\("message", onFrameMessage\)/);
+  assert.match(source, /document\.removeEventListener\("click", onDocumentClick, true\)/);
+  assert.match(source, /window\.removeEventListener\("popstate", onNativeRouteChange\)/);
+  assert.match(source, /window\.clearTimeout\(reattachTimer\)/);
+  assert.match(source, /data-codex-taskboard-owned/);
+  assert.match(source, /delete window\[SENTINEL_KEY\]/);
+});
+
+test("host integration stays thin", () => {
+  assert.match(source, /new MutationObserver\(scheduleRefresh\)/);
+  assert.match(source, /type: "taskboard:host-context"/);
+  assert.match(source, /type: "taskboard:theme"/);
+  assert.match(source, /type: "navigate-to-route"/);
+  assert.doesNotMatch(source, /__codexSessionDeleteBridge/);
+  assert.doesNotMatch(source, /import\s*\(/);
+  assert.doesNotMatch(source, /window\.fetch\s*=/);
+});
diff --git a/apps/codex-taskboard/test/injector-host-runtime.test.mjs b/apps/codex-taskboard/test/injector-host-runtime.test.mjs
new file mode 100644
index 000000000..8d0cbd8ab
--- /dev/null
+++ b/apps/codex-taskboard/test/injector-host-runtime.test.mjs
@@ -0,0 +1,187 @@
+import assert from "node:assert/strict";
+import { test } from "node:test";
+
+import {
+  findResidentInjectorPids,
+  handleHostBindingPayload,
+  reconcileInjectionRuntime,
+  restartResidentInjector,
+} from "../scripts/codex-injector-runtime.mjs";
+
+const currentAutomationRequest = {
+  id: "host-request-1",
+  action: "automation",
+  requestId: "automation-request-1",
+  operation: "ensure-active",
+  taskboardProjectId: "local",
+  codexProjectId: "codex-project",
+  projectName: "Local",
+  workspacePath: "/tmp/project",
+  skillPath: "/tmp/manage-taskboard/SKILL.md",
+  intervalMinutes: 10,
+  model: "gpt-5.6-sol",
+  reasoningEffort: "ultra",
+};
+
+test("a stale automation parser receives an immediate host error instead of timing out", async () => {
+  const responses = [];
+  const staleParser = () => null;
+
+  const result = await Promise.race([
+    handleHostBindingPayload(
+      {
+        payload: JSON.stringify(currentAutomationRequest),
+        executionContextId: 12,
+      },
+      {
+        parseAutomationRequest: staleParser,
+        ensure: async () => assert.fail("ensure must not run"),
+        runAutomation: async () => assert.fail("automation must not run"),
+        prefill: async () => assert.fail("prefill must not run"),
+        sendResponse: async (_executionContextId, response) => responses.push(response),
+      },
+    ),
+    new Promise((_, reject) => setTimeout(() => reject(new Error("host response timed out")), 50)),
+  ]);
+
+  assert.deepEqual(result, { responded: true, accepted: false });
+  assert.deepEqual(responses, [{
+    id: currentAutomationRequest.id,
+    ok: false,
+    error: "自动认领配置暂时无法应用，请刷新后重试",
+    diagnosticCode: "AUTOMATION_SCHEMA_MISMATCH",
+  }]);
+});
+
+test("attach replaces an old runtime with the current source and restores an open page", async () => {
+  const calls = [];
+  const result = await reconcileInjectionRuntime({
+    currentStatus: {
+      version: "0.6.7",
+      sourceHash: null,
+      pageVisible: true,
+      scriptIdentifier: "old-registration",
+    },
+    source: "current-source",
+    sourceHash: "current-hash",
+    removeRegisteredSource: async (identifier) => calls.push(["remove", identifier]),
+    registerCurrentSource: async (source) => {
+      calls.push(["register", source]);
+      return "current-registration";
+    },
+    evaluateCurrentSource: async (source) => calls.push(["evaluate", source]),
+    publishRegistration: async (identifier) => calls.push(["publish", identifier]),
+    reopen: async () => calls.push(["open"]),
+  });
+
+  assert.deepEqual(result, {
+    replaced: true,
+    scriptIdentifier: "current-registration",
+    shouldRemainOpen: true,
+  });
+  assert.deepEqual(calls, [
+    ["remove", "old-registration"],
+    ["register", "current-source"],
+    ["evaluate", "current-source"],
+    ["publish", "current-registration"],
+    ["open"],
+  ]);
+});
+
+test("attach is idempotent for the same source hash and does not open a closed page", async () => {
+  const calls = [];
+  const result = await reconcileInjectionRuntime({
+    currentStatus: {
+      version: "0.6.8",
+      sourceHash: "current-hash",
+      pageVisible: false,
+      scriptIdentifier: "old-registration",
+    },
+    source: "current-source",
+    sourceHash: "current-hash",
+    removeRegisteredSource: async (identifier) => calls.push(["remove", identifier]),
+    registerCurrentSource: async (source) => {
+      calls.push(["register", source]);
+      return "current-registration";
+    },
+    evaluateCurrentSource: async (source) => calls.push(["evaluate", source]),
+    publishRegistration: async (identifier) => calls.push(["publish", identifier]),
+    reopen: async () => calls.push(["open"]),
+  });
+
+  assert.deepEqual(result, {
+    replaced: false,
+    scriptIdentifier: "current-registration",
+    shouldRemainOpen: false,
+  });
+  assert.deepEqual(calls, [
+    ["remove", "old-registration"],
+    ["register", "current-source"],
+    ["evaluate", "current-source"],
+    ["publish", "current-registration"],
+  ]);
+});
+
+test("resident discovery accepts this repository's absolute and relative launch forms only", () => {
+  const projectRoot = "/workspace/codex-taskboard";
+  const injectorPath = `${projectRoot}/scripts/codex-injector.mjs`;
+  const processList = [
+    `101 node ${injectorPath} --watch --port 9231`,
+    "102 node scripts/codex-injector.mjs --watch",
+    "103 node ./scripts/codex-injector.mjs --watch --port=9231",
+    "104 node scripts/codex-injector.mjs --watch",
+    `105 node ${injectorPath} --watch --port 9229`,
+    `106 node ${injectorPath} --port 9231`,
+  ].join("\n");
+  const cwdByPid = new Map([
+    [102, projectRoot],
+    [103, projectRoot],
+    [104, "/workspace/another-repository"],
+  ]);
+
+  assert.deepEqual(findResidentInjectorPids({
+    processList,
+    currentPid: 999,
+    injectorPath,
+    projectRoot,
+    port: 9231,
+    defaultPort: 9229,
+    cwdForPid: (pid) => cwdByPid.get(pid) ?? null,
+  }), [101, 103]);
+  assert.deepEqual(findResidentInjectorPids({
+    processList,
+    currentPid: 999,
+    injectorPath,
+    projectRoot,
+    port: 9229,
+    defaultPort: 9229,
+    cwdForPid: (pid) => cwdByPid.get(pid) ?? null,
+  }), [102, 105]);
+});
+
+test("refresh stops every stale resident before starting one token-verified replacement", async () => {
+  const calls = [];
+  const startupToken = "replacement-token";
+  const replacement = await restartResidentInjector(9231, {
+    findResidents: () => [4321, 5432],
+    stopResident: async (pid) => calls.push(["stop", pid]),
+    createStartupToken: () => startupToken,
+    startResident: (port, token) => {
+      calls.push(["start", port, token]);
+      return { pid: 9876, started: true };
+    },
+    waitUntilReady: async (port, pid, token) => calls.push(["ready", port, pid, token]),
+  });
+
+  assert.deepEqual(replacement, {
+    previousPids: [4321, 5432],
+    pid: 9876,
+    restarted: true,
+  });
+  assert.deepEqual(calls, [
+    ["stop", 4321],
+    ["stop", 5432],
+    ["start", 9231, startupToken],
+    ["ready", 9231, 9876, startupToken],
+  ]);
+});
diff --git a/apps/codex-taskboard/test/injector.test.mjs b/apps/codex-taskboard/test/injector.test.mjs
new file mode 100644
index 000000000..064d751e0
--- /dev/null
+++ b/apps/codex-taskboard/test/injector.test.mjs
@@ -0,0 +1,106 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+const source = await readFile(new URL("../scripts/codex-injector.mjs", import.meta.url), "utf8");
+const runtimeSource = await readFile(
+  new URL("../scripts/codex-injector-runtime.mjs", import.meta.url),
+  "utf8",
+);
+const packageJson = JSON.parse(
+  await readFile(new URL("../package.json", import.meta.url), "utf8"),
+);
+
+test("the resident injector supervises the fixed local Taskboard service", () => {
+  assert.match(source, /function createTaskboardSupervisor/);
+  assert.match(source, /await isReachable\(taskboardHealthUrl\)/);
+  assert.match(source, /ensureInFlight/);
+  assert.match(source, /await supervisor\.ensure\(\)/);
+  assert.match(source, /it will be restarted automatically/);
+  assert.match(source, /AbortSignal\.timeout\(1_500\)/);
+});
+
+test("the CDP bridge accepts only service ensure and native Skill composer prefill actions", () => {
+  assert.match(source, /const hostBindingName = "__codexTaskboardHostV1"/);
+  assert.match(runtimeSource, /request\.action === "ensure"/);
+  assert.match(runtimeSource, /request\.action === "prefill-task-composer"/);
+  assert.match(runtimeSource, /request\.instruction\.length <= 1_024/);
+  assert.match(runtimeSource, /request\.skillPath\.length <= 1_024/);
+  assert.match(source, /function prefillTaskComposerViaCdp/);
+  assert.match(source, /cdp\.send\("Input\.insertText", \{ text: "\$" \}\)/);
+  assert.match(source, /data-composer-overlay-floating-ui/);
+  assert.match(source, /button\[data-list-navigation-item="true"\]/);
+  assert.match(source, /\[skill-mention-name\]/);
+  assert.match(source, /skill-mention-path/);
+  assert.match(source, /cdp\.send\("Input\.insertText", \{ text: instruction \}\)/);
+  assert.match(source, /Runtime\.bindingCalled/);
+  assert.match(runtimeSource, /params\.executionContextId/);
+  assert.match(source, /hostResponse/);
+  assert.match(source, /if \(keepAlive\) await installTaskboardHostBinding/);
+  assert.match(source, /publishHostHeartbeat/);
+  assert.match(source, /__codexTaskboardHostHeartbeatV1/);
+});
+
+test("the CDP bridge exposes only the fixed Taskboard automation operations", () => {
+  assert.match(source, /parseTaskboardAutomationHostRequest/);
+  assert.match(source, /reconcileTaskboardAutomation/);
+  assert.match(runtimeSource, /request\.action === "automation"/);
+  assert.match(source, /function requestCodexAutomationViaCdp/);
+  assert.match(source, /new Set\(\[\s*"list-automations",\s*"automation-create",\s*"automation-update",\s*\]\)/);
+  assert.match(source, /bridge\.sendMessageFromView\(\{\s*type: "fetch",\s*requestId,/);
+  assert.match(source, /method: "POST"/);
+  assert.match(source, /vscode:\/\/codex\/\$\{method\}/);
+  assert.match(source, /body: JSON\.stringify\(params\)/);
+  assert.match(source, /message\.type !== "fetch-response"/);
+  assert.match(source, /message\.responseType/);
+  assert.match(source, /message\.status/);
+  assert.match(source, /message\.bodyJsonString/);
+  assert.doesNotMatch(source, /automation-delete/);
+  assert.doesNotMatch(source, /automations\.toml/);
+});
+
+test("the package injection command remains resident for tab-triggered recovery", () => {
+  assert.match(packageJson.scripts["codex:inject"], /--watch/);
+  assert.match(packageJson.scripts["codex:daemon"], /--daemon --open/);
+  assert.match(source, /function startResidentInjector/);
+  assert.match(source, /args\.push\("--background-taskboard"\)/);
+  assert.match(source, /arg === "--background-taskboard"/);
+  assert.match(source, /detached: !options\.watch \|\| options\.backgroundTaskboard/);
+  assert.match(source, /const defaultCodexDebuggingPort = 9229/);
+  assert.match(source, /port: defaultCodexDebuggingPort/);
+  assert.match(source, /--startup-token/);
+  assert.match(source, /__codexTaskboardHostStartupTokenV1/);
+  assert.ok([...source.matchAll(/windowsHide: process\.platform === "win32"/g)].length >= 3);
+});
+
+test("attach reconciles the renderer against a hashed current injection source", () => {
+  assert.match(source, /createHash\("sha256"\)/);
+  assert.match(source, /__CODEX_TASKBOARD_SOURCE_HASH__/);
+  assert.match(source, /sourceHash: window\.__codexTaskboardInjection__\?\.sourceHash \|\| null/);
+  assert.match(source, /const injectionScriptIdentifierName = "__CODEX_TASKBOARD_SCRIPT_IDENTIFIER__"/);
+  assert.match(source, /scriptIdentifier: window\[\$\{JSON\.stringify\(injectionScriptIdentifierName\)\}\] \|\| null/);
+  assert.match(source, /Page\.removeScriptToEvaluateOnNewDocument/);
+  assert.match(source, /Page\.addScriptToEvaluateOnNewDocument/);
+  assert.match(source, /reconcileInjectionRuntime/);
+  assert.match(source, /expectedSourceHash/);
+});
+
+test("the injector ignores auxiliary Codex windows", () => {
+  assert.match(source, /!target\.url\?\.includes\("initialRoute=%2Fglobal-dictation"\)/);
+});
+
+test("a completed web build refreshes an already-open Codex iframe", () => {
+  assert.match(packageJson.scripts.build, /--refresh-if-running/);
+  assert.match(packageJson.scripts["codex:refresh"], /--refresh/);
+  assert.match(source, /async function refreshTaskboardFrames/);
+  assert.match(source, /function codexDebuggingPorts/);
+  assert.match(source, /--remote-debugging-port=/);
+  assert.match(source, /taskboard\.reloadFrame\(\)/);
+  assert.match(source, /__codex_taskboard_refresh/);
+  assert.match(source, /await restartResidentInjectorForRefresh\(port\)/);
+});
+
+test("the injected iframe follows the configured local service port", () => {
+  assert.match(source, /const taskboardPageUrl = `\$\{taskboardOrigin\}\/\?host=codex`/);
+  assert.match(source, /window\.__CODEX_TASKBOARD_URL__ = \$\{JSON\.stringify\(taskboardPageUrl\)\}/);
+});
diff --git a/apps/codex-taskboard/test/input-focus-chrome.test.mjs b/apps/codex-taskboard/test/input-focus-chrome.test.mjs
new file mode 100644
index 000000000..4ae10962f
--- /dev/null
+++ b/apps/codex-taskboard/test/input-focus-chrome.test.mjs
@@ -0,0 +1,60 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+const globalStyles = await readFile(new URL("../web/src/styles.css", import.meta.url), "utf8");
+const workflowStyles = await readFile(new URL("../web/src/components/workflow.css", import.meta.url), "utf8");
+
+function blocksForSelector(styles, selector) {
+  return [...styles.matchAll(/([^{}]+)\{([^{}]*)\}/g)]
+    .filter(([, selectors]) => selectors.split(",").some((candidate) => candidate.trim() === selector))
+    .map(([, , declarations]) => declarations);
+}
+
+function assertNoFocusChrome(styles, selector) {
+  for (const declarations of blocksForSelector(styles, selector)) {
+    assert.doesNotMatch(
+      declarations,
+      /(?:^|;)\s*(?:border(?:-color)?|background(?:-color)?|box-shadow|outline)\s*:/,
+      `${selector} must not alter border, background, shadow or outline`,
+    );
+  }
+}
+
+test("editable controls suppress native focus outlines without disabling non-text focus feedback", () => {
+  assert.match(
+    globalStyles,
+    /:where\([\s\S]*?input:not\(\[type="checkbox"\]\)[\s\S]*?:not\(\[type="radio"\]\)[\s\S]*?:not\(\[type="range"\]\)[\s\S]*?:not\(\[type="file"\]\)[\s\S]*?:not\(\[type="color"\]\)[\s\S]*?:not\(\[type="button"\]\)[\s\S]*?:not\(\[type="submit"\]\)[\s\S]*?:not\(\[type="reset"\]\)[\s\S]*?:not\(\[type="image"\]\)[\s\S]*?textarea,[\s\S]*?select,[\s\S]*?\[contenteditable="true"\],[\s\S]*?\[contenteditable="plaintext-only"\][\s\S]*?\):is\(:focus, :focus-visible\)\s*\{\s*outline:\s*0;\s*\}/,
+  );
+  assert.doesNotMatch(globalStyles, /(?:^|,)\s*(?:input|textarea|select):focus-visible\s*(?:,|\{)/m);
+  assert.doesNotMatch(globalStyles, /\*:focus(?:-visible)?/);
+  assert.match(
+    globalStyles,
+    /input:is\([\s\S]*?\[type="checkbox"\][\s\S]*?\[type="radio"\][\s\S]*?\[type="range"\][\s\S]*?\[type="file"\][\s\S]*?\):focus-visible/,
+  );
+});
+
+test("editable-control wrappers do not add focus chrome", () => {
+  for (const selector of [
+    ".project-card:focus-within",
+    ".search-field:focus-within",
+    ".detail-property-row:focus-within",
+    ".workflow-node-search:focus-within",
+    ".comment-composer:focus-within",
+  ]) {
+    assertNoFocusChrome(globalStyles, selector);
+  }
+
+  assert.equal(blocksForSelector(globalStyles, ".workflow-tab.is-renaming input:focus").length, 0);
+  assert.equal(blocksForSelector(globalStyles, ".workflow-config-section input:focus").length, 0);
+  assert.equal(blocksForSelector(globalStyles, ".workflow-config-section textarea:focus").length, 0);
+  assert.equal(blocksForSelector(globalStyles, ".workflow-config-section select:focus").length, 0);
+});
+
+test("workflow-local styles do not reintroduce input focus chrome", () => {
+  assertNoFocusChrome(workflowStyles, ".workflow-step-picker-search:focus-within");
+  assert.equal(blocksForSelector(workflowStyles, ".workflow-tab.is-renaming input:focus").length, 0);
+  assert.equal(blocksForSelector(workflowStyles, ".workflow-config-section input:focus").length, 0);
+  assert.equal(blocksForSelector(workflowStyles, ".workflow-config-section textarea:focus").length, 0);
+  assert.equal(blocksForSelector(workflowStyles, ".workflow-config-section select:focus").length, 0);
+});
diff --git a/apps/codex-taskboard/test/issue-assignee.test.mjs b/apps/codex-taskboard/test/issue-assignee.test.mjs
new file mode 100644
index 000000000..052e0d676
--- /dev/null
+++ b/apps/codex-taskboard/test/issue-assignee.test.mjs
@@ -0,0 +1,63 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import test from "node:test";
+
+const root = new URL("../", import.meta.url);
+
+async function source(pathname) {
+  return readFile(new URL(pathname, root), "utf8");
+}
+
+test("issue model and editor preserve a concrete assignee identity", async () => {
+  const [typesSource, appSource, editorSource] = await Promise.all([
+    source("web/src/types.ts"),
+    source("web/src/App.tsx"),
+    source("web/src/components/TaskEditor.tsx"),
+  ]);
+
+  assert.match(typesSource, /export type AssigneeTarget = "current-user" \| "codex-agent"/);
+  assert.match(typesSource, /assignee: ActorIdentity/);
+  assert.match(typesSource, /export interface TaskDraft \{[\s\S]*?assigneeTarget\?: AssigneeTarget/);
+  assert.match(appSource, /assigneeTarget/);
+  assert.match(editorSource, /currentUser: ActorIdentity/);
+  assert.match(editorSource, /aria-label="负责人"/);
+  assert.match(editorSource, /CODEX_AGENT_ACTOR/);
+});
+
+test("issue detail and cards expose the same assignee identity", async () => {
+  const [detailSource, cardSource, avatarSource, styles] = await Promise.all([
+    source("web/src/components/TaskDetail.tsx"),
+    source("web/src/components/TaskCard.tsx"),
+    source("web/src/components/ActorAvatar.tsx"),
+    source("web/src/styles.css"),
+  ]);
+
+  assert.match(detailSource, /detail-property-label">负责人/);
+  assert.match(detailSource, /saveTask\(\{ assigneeTarget:/);
+  assert.match(cardSource, /card-assignee-avatar/);
+  assert.match(avatarSource, /codex-agent-logo\.png/);
+  assert.match(avatarSource, /actor-avatar-\$\{actor\.type\}/);
+  assert.match(styles, /\.card-assignee-avatar/);
+});
+
+test("issue card assignee avatar stays compact inside the identifier row", async () => {
+  const styles = await source("web/src/styles.css");
+  const baseAvatarRule = styles.indexOf(".actor-avatar {");
+  const cardAvatarRule = styles.indexOf(".actor-avatar.card-assignee-avatar {");
+  const cardActionsRule = styles.match(/\.card-actions\s*\{([^}]*)\}/)?.[1] ?? "";
+
+  assert.ok(baseAvatarRule >= 0);
+  assert.ok(cardAvatarRule > baseAvatarRule);
+  assert.match(
+    styles.slice(cardAvatarRule),
+    /\.actor-avatar\.card-assignee-avatar\s*\{[\s\S]*?width:\s*16px;[\s\S]*?height:\s*16px;/,
+  );
+  assert.match(styles, /\.card-topline\s*\{[\s\S]*?height:\s*16px;/);
+  assert.match(cardActionsRule, /position:\s*absolute;/);
+  assert.match(cardActionsRule, /right:\s*0;/);
+  assert.match(cardActionsRule, /pointer-events:\s*none;/);
+  assert.match(
+    styles,
+    /\.task-card:hover \.card-assignee-avatar,[\s\S]*?\.task-card\.is-context-open \.card-assignee-avatar\s*\{[\s\S]*?opacity:\s*0;/,
+  );
+});
diff --git a/apps/codex-taskboard/test/issue-detail-inline-focus.test.mjs b/apps/codex-taskboard/test/issue-detail-inline-focus.test.mjs
new file mode 100644
index 000000000..b49077cc4
--- /dev/null
+++ b/apps/codex-taskboard/test/issue-detail-inline-focus.test.mjs
@@ -0,0 +1,24 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+const styles = await readFile(new URL("../web/src/styles.css", import.meta.url), "utf8");
+const detailSource = await readFile(new URL("../web/src/components/TaskDetail.tsx", import.meta.url), "utf8");
+
+test("issue title and description keep Linear-style inline editing when focused", () => {
+  assert.match(
+    styles,
+    /\.issue-title-input:focus:not\(:disabled\),\s*\.issue-title-input:focus-visible:not\(:disabled\),\s*\.issue-description-input:focus:not\(:disabled\),\s*\.issue-description-input:focus-visible:not\(:disabled\),\s*\.issue-description-read:focus-visible\s*\{[^}]*border-color:\s*transparent;[^}]*outline:\s*0;[^}]*background:\s*transparent;[^}]*box-shadow:\s*none;/s,
+  );
+  assert.match(
+    styles,
+    /:where\([\s\S]*?input:not\(\[type="checkbox"\]\)[\s\S]*?textarea,[\s\S]*?select,[\s\S]*?\[contenteditable="true"\],[\s\S]*?\[contenteditable="plaintext-only"\][\s\S]*?\):is\(:focus, :focus-visible\)\s*\{\s*outline:\s*0;/,
+  );
+  assert.doesNotMatch(styles, /textarea:focus-visible:not\(/);
+});
+
+test("editing and composing comments do not add focus chrome", () => {
+  assert.equal([...detailSource.matchAll(/className="comment-input"/g)].length, 1);
+  assert.match(detailSource, /<InlineMediaComposer/);
+  assert.doesNotMatch(styles, /\.comment-composer:focus-within\s*\{/);
+});
diff --git a/apps/codex-taskboard/test/issue-detail-markdown.test.mjs b/apps/codex-taskboard/test/issue-detail-markdown.test.mjs
new file mode 100644
index 000000000..5a825453c
--- /dev/null
+++ b/apps/codex-taskboard/test/issue-detail-markdown.test.mjs
@@ -0,0 +1,80 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+import { createElement } from "react";
+import { renderToStaticMarkup } from "react-dom/server";
+import ReactMarkdown from "react-markdown";
+import remarkGfm from "remark-gfm";
+
+const packageJson = JSON.parse(
+  await readFile(new URL("../package.json", import.meta.url), "utf8"),
+);
+const detailSource = await readFile(
+  new URL("../web/src/components/TaskDetail.tsx", import.meta.url),
+  "utf8",
+);
+const styles = await readFile(
+  new URL("../web/src/styles.css", import.meta.url),
+  "utf8",
+);
+
+test("issue detail renders descriptions and comments with GFM markdown", () => {
+  assert.equal(typeof packageJson.dependencies["react-markdown"], "string");
+  assert.equal(typeof packageJson.dependencies["remark-gfm"], "string");
+  assert.match(detailSource, /import ReactMarkdown from "react-markdown";/);
+  assert.match(detailSource, /import remarkGfm from "remark-gfm";/);
+  assert.match(
+    detailSource,
+    /<ReactMarkdown[\s\S]*remarkPlugins=\{\[remarkGfm\]\}[\s\S]*>\s*\{value\}\s*<\/ReactMarkdown>/,
+  );
+  assert.match(
+    detailSource,
+    /\{description \? <DescriptionDocument value=\{description\} \/> : "添加描述…"\}/,
+  );
+  assert.match(
+    detailSource,
+    /comment\.body && <div className="comment-body"><DescriptionDocument value=\{comment\.body\} \/><\/div>/,
+  );
+  assert.doesNotMatch(detailSource, /value\.split\("\\n"\)/);
+});
+
+test("issue detail markdown styles cover rich document elements", () => {
+  for (const selector of [
+    ".issue-description-document blockquote",
+    ".issue-description-document pre",
+    ".issue-description-document table",
+    ".issue-description-document a",
+    ".issue-description-document img",
+    ".issue-description-document input[type=\"checkbox\"]",
+  ]) {
+    assert.match(styles, new RegExp(selector.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")));
+  }
+});
+
+test("the configured markdown renderer produces CommonMark and GFM elements", () => {
+  const markdown = [
+    "**粗体**和[链接](https://example.com)",
+    "",
+    "> 引用",
+    "",
+    "- [x] 已完成",
+    "- [ ] 未完成",
+    "",
+    "~~删除线~~",
+    "",
+    "| 名称 | 状态 |",
+    "| --- | --- |",
+    "| Taskboard | Ready |",
+    "",
+    "```js",
+    "const ready = true;",
+    "```",
+  ].join("\n");
+  const html = renderToStaticMarkup(
+    createElement(ReactMarkdown, { remarkPlugins: [remarkGfm] }, markdown),
+  );
+
+  for (const element of ["strong", "a", "blockquote", "input", "del", "table", "pre", "code"]) {
+    assert.match(html, new RegExp(`<${element}(?: |>)`));
+  }
+});
diff --git a/apps/codex-taskboard/test/issue-detail-route.test.mjs b/apps/codex-taskboard/test/issue-detail-route.test.mjs
new file mode 100644
index 000000000..2a9309db9
--- /dev/null
+++ b/apps/codex-taskboard/test/issue-detail-route.test.mjs
@@ -0,0 +1,56 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+import {
+  buildIssueUrl,
+  readIssueIdentifier,
+} from "../web/src/issueRoute.ts";
+
+const appSource = await readFile(new URL("../web/src/App.tsx", import.meta.url), "utf8");
+
+test("issue detail URLs preserve project context and unrelated query parameters", () => {
+  const url = buildIssueUrl(
+    "http://127.0.0.1:47823/?host=codex&project=other&status=todo",
+    "local",
+    "LOCAL-72",
+  );
+
+  assert.equal(url.searchParams.get("project"), "local");
+  assert.equal(url.searchParams.get("issue"), "LOCAL-72");
+  assert.equal(url.searchParams.get("host"), "codex");
+  assert.equal(url.searchParams.get("status"), "todo");
+  assert.equal(readIssueIdentifier(url.search), "LOCAL-72");
+});
+
+test("closing issue detail removes only the issue route", () => {
+  const url = buildIssueUrl(
+    "http://127.0.0.1:47823/?host=codex&project=local&issue=LOCAL-72&label=缺陷",
+    "local",
+    null,
+  );
+
+  assert.equal(url.searchParams.has("issue"), false);
+  assert.equal(url.searchParams.get("project"), "local");
+  assert.equal(url.searchParams.get("host"), "codex");
+  assert.deepEqual(url.searchParams.getAll("label"), ["缺陷"]);
+});
+
+test("the app restores issue detail from the URL and follows browser history", () => {
+  assert.match(
+    appSource,
+    /useState<string \| null>\(\s*\(\) => readIssueIdentifier\(window\.location\.search\),?\s*\)/,
+  );
+  assert.match(appSource, /task\.identifier === detailTaskIdentifier/);
+  assert.match(appSource, /window\.addEventListener\("popstate", syncRouteFromLocation\)/);
+  assert.match(appSource, /window\.removeEventListener\("popstate", syncRouteFromLocation\)/);
+  const openTaskSource = appSource.slice(
+    appSource.indexOf("function openTaskDetail"),
+    appSource.indexOf("function closeTaskDetail"),
+  );
+  assert.match(openTaskSource, /buildIssueUrl\(window\.location\.href, task\.projectId, null\)/);
+  assert.match(openTaskSource, /window\.history\.replaceState/);
+  assert.match(openTaskSource, /window\.history\.pushState/);
+  assert.match(appSource, /function closeTaskDetail\(\)[\s\S]*?window\.history\.replaceState/);
+  assert.match(appSource, /onEdit=\{openTaskDetail\}/);
+});
diff --git a/apps/codex-taskboard/test/issue-relations.test.mjs b/apps/codex-taskboard/test/issue-relations.test.mjs
new file mode 100644
index 000000000..dcc685cf0
--- /dev/null
+++ b/apps/codex-taskboard/test/issue-relations.test.mjs
@@ -0,0 +1,77 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+const typesSource = await readFile(new URL("../web/src/types.ts", import.meta.url), "utf8");
+const apiSource = await readFile(new URL("../web/src/api.ts", import.meta.url), "utf8");
+const appSource = await readFile(new URL("../web/src/App.tsx", import.meta.url), "utf8");
+const detailSource = await readFile(new URL("../web/src/components/TaskDetail.tsx", import.meta.url), "utf8");
+const relationsSource = await readFile(new URL("../web/src/components/IssueRelations.tsx", import.meta.url), "utf8");
+const cardSource = await readFile(new URL("../web/src/components/TaskCard.tsx", import.meta.url), "utf8");
+const styles = await readFile(new URL("../web/src/styles.css", import.meta.url), "utf8");
+const skillSource = await readFile(new URL("../skills/manage-taskboard/SKILL.md", import.meta.url), "utf8");
+const cliReference = await readFile(new URL("../skills/manage-taskboard/references/cli.md", import.meta.url), "utf8");
+
+test("tasks expose one parent plus directional and symmetric issue relations", () => {
+  assert.match(typesSource, /export type IssueRelationType = "parent" \| "blocks" \| "blocked_by" \| "related"/);
+  assert.match(typesSource, /export interface TaskRelationSummary \{/);
+  assert.match(typesSource, /threadId: string \| null/);
+  assert.match(typesSource, /export interface TaskRelations \{[\s\S]*?parent: TaskRelationSummary \| null/);
+  assert.match(typesSource, /subIssues: TaskRelationSummary\[\]/);
+  assert.match(typesSource, /blockedBy: TaskRelationSummary\[\]/);
+  assert.match(typesSource, /blocks: TaskRelationSummary\[\]/);
+  assert.match(typesSource, /related: TaskRelationSummary\[\]/);
+  assert.match(typesSource, /export interface Task \{[\s\S]*?relations: TaskRelations/);
+});
+
+test("the web client mutates issue relations with optimistic concurrency", () => {
+  assert.match(apiSource, /export async function addTaskRelation/);
+  assert.match(apiSource, /export async function removeTaskRelation/);
+  assert.match(apiSource, /\/relations\/\$\{type\}\/\$\{encodeURIComponent\(relatedTaskId\)\}/);
+  assert.match(apiSource, /version: task\.version/);
+  assert.match(appSource, /"task\.relation\.updated"/);
+  assert.match(appSource, /onAddRelation=/);
+  assert.match(appSource, /onRemoveRelation=/);
+});
+
+test("issue details mirror Linear parent, sub-issue, dependency, and related sections", () => {
+  assert.match(detailSource, /<IssueParentLink/);
+  assert.match(detailSource, /<IssueSubIssues/);
+  assert.match(detailSource, /<IssueRelationSidebar/);
+  assert.match(relationsSource, />子任务</);
+  assert.match(relationsSource, /label: "阻塞于"/);
+  assert.match(relationsSource, /label: "阻塞"/);
+  assert.match(relationsSource, /label: "相关任务"/);
+  assert.match(relationsSource, /placeholder="搜索任务…"/);
+  assert.match(relationsSource, /role="combobox"/);
+  assert.match(relationsSource, /role="listbox"/);
+  assert.match(relationsSource, /LinearStatusIcon/);
+  assert.match(relationsSource, /issue\.threadId/);
+  assert.match(relationsSource, /onOpenThread/);
+  assert.match(relationsSource, /onOpenTask/);
+  assert.match(relationsSource, /onRemoveRelation/);
+  assert.match(styles, /\.issue-relation-picker/);
+  assert.match(styles, /\.issue-sub-issues/);
+  assert.match(styles, /\.issue-relation-thread/);
+  assert.match(styles, /\.issue-relation-sidebar/);
+});
+
+test("board cards keep relation context compact", () => {
+  assert.match(cardSource, /task\.relations\.parent/);
+  assert.match(cardSource, /task\.relations\.subIssues/);
+  assert.match(cardSource, /task\.relations\.blockedBy/);
+  assert.match(cardSource, /sub-issue-progress/);
+  assert.match(cardSource, /blocked-by-count/);
+  assert.doesNotMatch(cardSource, /task\.relations\.related/);
+});
+
+test("the taskboard skill tracks substantive requests before implementation", () => {
+  assert.match(skillSource, /Search for an existing issue before creating one/i);
+  assert.match(skillSource, /append/i);
+  assert.match(skillSource, /parent|sub-issue/i);
+  assert.match(skillSource, /blocked|related/i);
+  assert.match(skillSource, /small|tiny|trivial/i);
+  assert.match(cliReference, /issue relation add/);
+  assert.match(cliReference, /--type parent/);
+  assert.match(cliReference, /--type blocks\|blocked_by\|related/);
+});
diff --git a/apps/codex-taskboard/test/manage-taskboard-skill.test.mjs b/apps/codex-taskboard/test/manage-taskboard-skill.test.mjs
new file mode 100644
index 000000000..919eb21ec
--- /dev/null
+++ b/apps/codex-taskboard/test/manage-taskboard-skill.test.mjs
@@ -0,0 +1,20 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+const skillSource = await readFile(
+  new URL("../skills/manage-taskboard/SKILL.md", import.meta.url),
+  "utf8",
+);
+
+test("the taskboard skill coordinates safe issue execution and review handoff", () => {
+  assert.match(skillSource, /read the latest issue content and all comments/i);
+  assert.match(skillSource, /completed work.*returned|returned.*completed work/i);
+  assert.match(skillSource, /claim.*`todo`.*`in_progress`.*`--if-version`/is);
+  assert.match(skillSource, /version conflict.*skip the issue.*do not implement/is);
+
+  assert.match(
+    skillSource,
+    /after implementation[^\n]*add a comment[^\n]*key changes[^\n]*verification[^\n]*result[^\n]*risks[^\n]*then move[^\n]*`in_review`/i,
+  );
+});
diff --git a/apps/codex-taskboard/test/project-automation-settings.test.mjs b/apps/codex-taskboard/test/project-automation-settings.test.mjs
new file mode 100644
index 000000000..26d480700
--- /dev/null
+++ b/apps/codex-taskboard/test/project-automation-settings.test.mjs
@@ -0,0 +1,161 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+const appSource = await readFile(new URL("../web/src/App.tsx", import.meta.url), "utf8");
+const settingsSource = await readFile(
+  new URL("../web/src/components/BoardSettingsMenu.tsx", import.meta.url),
+  "utf8",
+);
+const menuSource = await readFile(
+  new URL("../web/src/components/ProjectAutomationMenu.tsx", import.meta.url),
+  "utf8",
+);
+const iconSource = await readFile(
+  new URL("../web/src/components/LinearIcon.tsx", import.meta.url),
+  "utf8",
+);
+const styles = await readFile(new URL("../web/src/styles.css", import.meta.url), "utf8");
+
+test("project automation state is device-local and scoped by taskboard project", () => {
+  assert.match(appSource, /const PROJECT_AUTOMATIONS_KEY = "taskboard\.projectAutomations\.v1"/);
+  assert.match(appSource, /type ProjectAutomationStatus = "ACTIVE" \| "PAUSED"/);
+  assert.match(appSource, /automationId\?: string/);
+  assert.match(appSource, /codexProjectId: string/);
+  assert.match(appSource, /type AutomationIntervalMinutes = 5 \| 10 \| 15 \| 30 \| 60/);
+  assert.match(appSource, /DEFAULT_AUTOMATION_OPTIONS[\s\S]*?model: "gpt-5\.5"[\s\S]*?reasoningEffort: "high"/);
+  assert.match(appSource, /localStorage\.getItem\(PROJECT_AUTOMATIONS_KEY\)/);
+  assert.match(appSource, /localStorage\.setItem\(PROJECT_AUTOMATIONS_KEY, JSON\.stringify\(next\)\)/);
+  assert.match(appSource, /projectAutomations\[selectedProjectId\]/);
+});
+
+test("automation requests use the exact Codex host message contract", () => {
+  assert.match(appSource, /type: "taskboard:automation-request"/);
+  assert.match(appSource, /operation: "ensure-active" \| "pause" \| "list" \| "apply-policy"/);
+  assert.match(appSource, /taskboardProjectId: selectedProjectId/);
+  assert.match(appSource, /codexProjectId/);
+  assert.match(appSource, /projectName: selectedProjectDisplayName/);
+  assert.match(appSource, /workspacePath/);
+  assert.match(appSource, /skillPath: manageTaskboardSkillPath/);
+  assert.match(appSource, /intervalMinutes: options\.intervalMinutes/);
+  assert.match(appSource, /model: options\.model/);
+  assert.match(appSource, /reasoningEffort: options\.reasoningEffort/);
+  assert.match(appSource, /message\.type === "taskboard:automation-response"/);
+  assert.match(appSource, /pendingAutomationRequestsRef/);
+  assert.match(appSource, /requestId/);
+  assert.match(appSource, /window\.setTimeout/);
+});
+
+test("project mapping is based on exact ids and workspace paths, never project names", () => {
+  assert.match(appSource, /hostContext\?\.projects\?\.some\([\s\S]*?project\.id === selectedProject\.id/);
+  assert.match(appSource, /deviceWorkspacePaths\[project\.id\] === workspacePath/);
+  assert.match(appSource, /请先在 Codex 中添加并映射该项目目录/);
+  assert.doesNotMatch(appSource, /project\.name === selectedProject\.name/);
+});
+
+test("the project navigation automation menu owns the icon, fields, and accessible popover", () => {
+  assert.doesNotMatch(settingsSource, /自动认领待办|automationEnabled|automationPending/);
+  assert.match(menuSource, /status === "ACTIVE" \? "play" : "pause"/);
+  assert.doesNotMatch(menuSource, /statusStarted|statusTodo/);
+  assert.match(menuSource, /aria-busy=\{pending/);
+  assert.match(menuSource, /自动认领/);
+  assert.match(menuSource, /无自动化/);
+  assert.doesNotMatch(menuSource, /已开启自动认领|自动认领未开启/);
+  assert.match(menuSource, /自动认领开关/);
+  assert.match(menuSource, /5, 10, 15, 30, 60/);
+  assert.match(menuSource, /AUTOMATION_MODELS\.map/);
+  assert.match(menuSource, /EFFORT_LABELS\[effort\]/);
+  assert.match(menuSource, /createPortal/);
+  assert.match(menuSource, /window\.addEventListener\("resize"/);
+  assert.match(menuSource, /window\.addEventListener\("scroll", closeFromViewportChange, true\)/);
+  assert.match(menuSource, /no-drag/);
+  assert.doesNotMatch(menuSource, /event\.key === "Tab"/);
+  assert.match(appSource, /<ProjectAutomationMenu/);
+  assert.match(appSource, /<ProjectAutomationMenu[\s\S]*?<button[\s\S]*?header-create-button/);
+  assert.doesNotMatch(appSource, /toolbar-connection/);
+  assert.match(appSource, /仅本地任务面板可用/);
+});
+
+test("automation status uses the verified Linear play and pause icon assets", () => {
+  assert.match(
+    iconSource,
+    /play:\s*\{\s*content: <path d="m5\.604 2\.41 7\.23 4\.502a1\.375 1\.375 0 0 1-.02 2\.345L5\.585 13\.6a1\.375 1\.375 0 0 1-2\.083-1\.18V3\.576A1\.375 1\.375 0 0 1 5\.604 2\.41Z" \/>,\s*\}/s,
+  );
+  assert.match(
+    iconSource,
+    /pause:\s*\{\s*content: <path d="M3\.5 3\.5a1 1 0 0 1 1-1H6a1 1 0 0 1 1 1v9a1 1 0 0 1-1 1H4\.5a1 1 0 0 1-1-1v-9ZM9 3\.5a1 1 0 0 1 1-1h1\.5a1 1 0 0 1 1 1v9a1 1 0 0 1-1 1H10a1 1 0 0 1-1-1v-9Z" \/>,\s*\}/s,
+  );
+});
+
+test("automation play and pause retain Linear's 16px filled presentation", () => {
+  const playAndPause = iconSource.slice(
+    iconSource.indexOf("pause:"),
+    iconSource.indexOf("priority:"),
+  );
+  assert.doesNotMatch(playAndPause, /viewBox: "0 0 24 24"|strokeWidth|strokeLinecap|strokeLinejoin/);
+});
+
+test("the automation menu reuses the Linear switch and keeps form focus chrome suppressed", () => {
+  assert.match(menuSource, /className=\{`board-setting-switch\$\{draft\.enabledByUser \? " is-on" : ""\}`\}/);
+  assert.match(menuSource, /role="switch"/);
+  assert.match(menuSource, /aria-checked=\{draft\.enabledByUser\}/);
+  assert.doesNotMatch(menuSource, /type="checkbox"/);
+  assert.match(styles, /\.project-automation-field select:focus-visible\s*\{[^}]*outline:\s*0;[^}]*box-shadow:\s*none;/s);
+  assert.doesNotMatch(styles, /\.project-automation-switch input:focus-visible/);
+});
+
+test("unavailable automation state has one notice, clears stale errors, and cannot change", () => {
+  assert.match(menuSource, /error && error !== unavailableReason/);
+  assert.match(menuSource, /const disabled = pending \|\| Boolean\(unavailableReason\)/);
+  assert.equal(menuSource.match(/disabled=\{disabled\}/g)?.length, 5);
+  const reconcileSource = appSource.slice(
+    appSource.indexOf("const reconcileProjectAutomation"),
+    appSource.indexOf("const saveProjectAutomation"),
+  );
+  assert.match(
+    reconcileSource,
+    /automationProjectContext\.unavailableReason[\s\S]*?\) \{\s*setAutomationError\(null\);\s*return;/,
+  );
+  assert.doesNotMatch(reconcileSource, /setAutomationError\(automationProjectContext\.unavailableReason/);
+});
+
+test("automation changes submit immediately with model-specific effort normalization", () => {
+  assert.match(menuSource, /onChange: \(options: AutomationOptions\) => void/);
+  assert.match(menuSource, /const disabled = pending \|\| Boolean\(unavailableReason\)/);
+  assert.match(menuSource, /const submitChange = \(next: AutomationOptions\) => \{[\s\S]*?setDraft\(next\);[\s\S]*?onChange\(next\);[\s\S]*?\}/);
+  assert.match(menuSource, /submitChange\(withAutomationModel\(draft, event\.target\.value as AutomationModel\)\)/);
+  assert.match(menuSource, /getAutomationModel\(draft\.model\)\.efforts\.map/);
+  assert.match(menuSource, /<option key=\{effort\} value=\{effort\}>\{EFFORT_LABELS\[effort\]\}<\/option>/);
+  assert.match(menuSource, /low: "轻度"/);
+  assert.match(menuSource, /xhigh: "极高 \(xhigh\)"/);
+  assert.match(menuSource, /max: "最高"/);
+  assert.match(menuSource, /ultra: "极高 \(ultra\)"/);
+  assert.doesNotMatch(menuSource, />取消</);
+  assert.doesNotMatch(menuSource, />保存</);
+  assert.doesNotMatch(menuSource, /project-automation-actions/);
+  assert.doesNotMatch(menuSource, /onSave/);
+  assert.doesNotMatch(styles, /\.project-automation-actions/);
+});
+
+test("pending completion reconciles the optimistic draft to confirmed host state", () => {
+  assert.match(menuSource, /const wasPendingRef = useRef\(pending\)/);
+  assert.match(
+    menuSource,
+    /if \(wasPendingRef\.current && !pending\) \{\s*setDraft\(\{ \.\.\.DEFAULT_OPTIONS, \.\.\.automation \}\);\s*\}/,
+  );
+  assert.match(menuSource, /wasPendingRef\.current = pending/);
+  assert.match(menuSource, /disabled=\{disabled\}/);
+});
+
+test("opening settings and changing projects reconcile with the host list", () => {
+  assert.match(
+    appSource,
+    /sendAutomationRequest\(\s*stored \? "apply-policy" : "list",\s*options,\s*stored\?\.automationId,\s*\)/,
+  );
+  assert.match(appSource, /items\.find\(\(item\) => item\.id === stored\?\.automationId\)/);
+  assert.match(appSource, /items\.length === 1 \? items\[0\] : undefined/);
+  assert.match(appSource, /status: item\.status/);
+  assert.match(appSource, /automationId: undefined/);
+  assert.match(appSource, /const options = stored \?\? \{\s*status: "PAUSED" as const/);
+  assert.match(appSource, /writeProjectAutomation\(selectedProjectId, previousRecord\)/);
+});
diff --git a/apps/codex-taskboard/test/project-home.test.mjs b/apps/codex-taskboard/test/project-home.test.mjs
new file mode 100644
index 000000000..2b675d205
--- /dev/null
+++ b/apps/codex-taskboard/test/project-home.test.mjs
@@ -0,0 +1,128 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import { test } from "node:test";
+
+const appSource = await readFile(new URL("../web/src/App.tsx", import.meta.url), "utf8");
+const apiSource = await readFile(new URL("../web/src/api.ts", import.meta.url), "utf8");
+const styles = await readFile(new URL("../web/src/styles.css", import.meta.url), "utf8");
+const editorSource = await readFile(new URL("../web/src/components/TaskEditor.tsx", import.meta.url), "utf8");
+const pendingAttachmentsSource = await readFile(
+  new URL("../web/src/components/PendingAttachments.tsx", import.meta.url),
+  "utf8",
+);
+const detailSource = await readFile(new URL("../web/src/components/TaskDetail.tsx", import.meta.url), "utf8");
+const labelPickerSource = await readFile(new URL("../web/src/components/LabelPicker.tsx", import.meta.url), "utf8");
+const labelsSource = await readFile(new URL("../web/src/labels.ts", import.meta.url), "utf8");
+
+test("the project home merges live Codex projects with persisted Taskboard projects", () => {
+  assert.match(appSource, /hostContext\?\.projects \?\? \[\]/);
+  assert.match(appSource, /persistedById/);
+  assert.match(appSource, /project\.inCodex \? "Codex 项目" : "已保存的项目"/);
+  assert.match(appSource, /createProjectRequest/);
+  assert.match(apiSource, /export async function createProject/);
+});
+
+test("the default local project is shown as no-project issues", () => {
+  assert.match(appSource, /const DEFAULT_PROJECT_ID = "local"/);
+  assert.match(appSource, /const NO_PROJECT_NAME = "无项目"/);
+  assert.match(appSource, /function projectDisplayName/);
+  assert.match(appSource, /selectedProjectDisplayName \|\| "任务面板"/);
+  assert.match(appSource, /selectedProjectDisplayName \|\| "当前项目"/);
+});
+
+test("each device stores an independent workspace path for every project", () => {
+  assert.match(appSource, /const DEVICE_WORKSPACE_PATHS_KEY = "taskboard\.deviceWorkspacePaths\.v1"/);
+  assert.match(appSource, /function readDeviceWorkspacePaths\(\)/);
+  assert.match(appSource, /rememberDeviceWorkspacePath/);
+  assert.match(appSource, /const \[nextProjects, metadata, workspaces\] = await Promise\.all\(\[/);
+  assert.match(appSource, /listDeviceWorkspaces\(signal\)/);
+  assert.match(appSource, /placeholder="设置此设备的项目目录"/);
+  assert.match(appSource, /deviceWorkspacePaths\[selectedProjectId\]/);
+  assert.match(apiSource, /query\.set\("workspacePath", workspacePath\)/);
+  assert.match(apiSource, /\/api\/device-workspaces/);
+  assert.match(styles, /\.project-card-directory \{/);
+});
+
+test("project selection is remembered until the user explicitly returns home", () => {
+  assert.match(appSource, /const LAST_PROJECT_KEY = "taskboard\.lastProjectId"/);
+  assert.match(appSource, /window\.localStorage\.setItem\(LAST_PROJECT_KEY, projectId\)/);
+  assert.match(appSource, /function returnToProjectHome\(\)/);
+  assert.match(appSource, /window\.localStorage\.removeItem\(LAST_PROJECT_KEY\)/);
+  assert.match(appSource, /aria-label="返回项目首页"/);
+  assert.match(appSource, /className="detail-back-button project-home-button"[\s\S]*?<span>首页<\/span>/);
+  assert.match(styles, /\.project-home-button \{[\s\S]*?width: auto/);
+});
+
+test("the home uses the same restrained surface language as the issue board", () => {
+  assert.match(appSource, /<section className="project-home">/);
+  assert.match(appSource, /title: "已有任务", projects: projectsWithIssues/);
+  assert.match(appSource, /title: "尚未添加任务", projects: projectsWithoutIssues/);
+  assert.match(appSource, /project\.issueCount > 0/);
+  assert.match(styles, /\.project-grid \{[\s\S]*?grid-template-columns:/);
+  assert.match(styles, /\.project-card \{[\s\S]*?border: var\(--border-hairline\)/);
+});
+
+test("new issues stage attachments in the composer and upload them after creation", () => {
+  assert.match(editorSource, /type="file"[\s\S]*?multiple/);
+  assert.match(pendingAttachmentsSource, /className="composer-attachment-list"/);
+  assert.match(editorSource, /保存后上传/);
+  assert.match(appSource, /Promise\.allSettled/);
+  assert.match(appSource, /uploadAttachment\(saved\.id, file\)/);
+  assert.match(appSource, /附件上传失败，可在详情页重试/);
+});
+
+test("the issue composer includes Linear-style labels and scheduling", () => {
+  for (const label of ["缺陷", "特性", "for-claude", "hold", "改进", "phase-1", "phase-6"]) {
+    assert.match(labelsSource, new RegExp(label));
+  }
+  assert.match(editorSource, /<LabelPicker/);
+  assert.match(labelPickerSource, /创建 “\{normalizedSearch\}”/);
+  assert.match(editorSource, /设置截止日期/);
+  assert.match(editorSource, /设置重复/);
+  assert.match(editorSource, /最早截止日期/);
+  assert.match(editorSource, /developmentScan\.contexts/);
+});
+
+test("the current project is shown only in navigation, not in issue creation or detail properties", () => {
+  assert.doesNotMatch(editorSource, /property-project|dialog-project-icon|project\?\.name/);
+  assert.doesNotMatch(detailSource, /detail-property-label">项目|project-property-icon|project\.name/);
+  assert.doesNotMatch(styles, /\.property-project|\.dialog-project-icon|\.project-property-icon/);
+  assert.match(appSource, /createTaskRequest\(targetProjectId, draft\)/);
+  assert.match(appSource, /className="header-project-switcher"/);
+});
+
+test("the project header exposes real controls instead of decorative actions", () => {
+  assert.match(appSource, /className="header-project-button"[\s\S]*?aria-haspopup="menu"/);
+  assert.match(appSource, /className=\{`favorite-button[\s\S]*?aria-pressed=/);
+  assert.match(appSource, /FAVORITE_PROJECTS_KEY/);
+  assert.match(styles, /\.header-project-menu \{[\s\S]*?-webkit-app-region: no-drag/);
+});
+
+test("the project breadcrumb stops at the project name", () => {
+  assert.match(
+    appSource,
+    /className="detail-back-button project-home-button"[\s\S]*?<span>首页<\/span>[\s\S]*?selectedProjectId && <span className="breadcrumb-chevron"[\s\S]*?className="header-project-switcher"/,
+  );
+  assert.doesNotMatch(appSource, /className="issue-root-button"/);
+  assert.doesNotMatch(appSource, /detailTask\?\.identifier \?\? "任务"/);
+});
+
+test("the collapsed Codex sidebar can be expanded immediately left of Home", () => {
+  assert.match(
+    appSource,
+    /hostContext\?\.sidebarCollapsed[\s\S]*?className="detail-back-button codex-sidebar-expand-button"[\s\S]*?className="detail-back-button project-home-button"/,
+  );
+  assert.match(styles, /\.codex-sidebar-expand-button \+ \.project-home-button \{[\s\S]*?margin-left: 0;/);
+});
+
+test("the project home omits the navigation bar but keeps an invisible drag region", () => {
+  assert.match(appSource, /selectedProjectId \? \([\s\S]*?<header className="workspace-header"/);
+  assert.match(appSource, /className="home-window-drag-region"/);
+  assert.match(styles, /\.home-window-drag-region \{[\s\S]*?position: absolute;[\s\S]*?pointer-events: none/);
+});
+
+test("realtime updates remain active on the project home and reconcile after reconnecting", () => {
+  assert.match(appSource, /useEffect\(\(\) => \{\s*const source = new EventSource\("\/api\/events"\)/);
+  assert.match(appSource, /event\.type\.startsWith\("task\."\)[\s\S]*?scheduleRefresh\(\{ projects: true, tasks: affectsSelectedProject \}\)/);
+  assert.match(appSource, /source\.onopen = \(\) => \{[\s\S]*?scheduleRefresh\(\{ projects: true, tasks: Boolean\(selectedProjectId\) \}\)/);
+});
diff --git a/apps/codex-taskboard/test/server.test.mjs b/apps/codex-taskboard/test/server.test.mjs
new file mode 100644
index 000000000..d23513418
--- /dev/null
+++ b/apps/codex-taskboard/test/server.test.mjs
@@ -0,0 +1,2037 @@
+import assert from "node:assert/strict";
+import { access, chmod, mkdtemp, rm, writeFile } from "node:fs/promises";
+import { request as httpRequest } from "node:http";
+import os from "node:os";
+import path from "node:path";
+import { DatabaseSync } from "node:sqlite";
+import { afterEach, test } from "node:test";
+
+import { createTaskboardServer } from "../server/index.mjs";
+
+const runningApps = [];
+const LAN_SHARED_SECRET = "test-taskboard-secret";
+
+afterEach(async () => {
+  while (runningApps.length > 0) {
+    const { app, directory } = runningApps.pop();
+    await app.close();
+    await rm(directory, { recursive: true, force: true });
+  }
+});
+
+async function startServer(configure, listenOptions = {}) {
+  const directory = await mkdtemp(path.join(os.tmpdir(), "codex-taskboard-test-"));
+  const options = configure ? await configure(directory) : {};
+  const host = listenOptions.host ?? "127.0.0.1";
+  const app = createTaskboardServer({
+    dataDirectory: directory,
+    ...(host === "0.0.0.0" ? { sharedSecret: LAN_SHARED_SECRET } : {}),
+    ...options,
+  });
+  const address = await app.listen({ port: 0, ...listenOptions });
+  runningApps.push({ app, directory });
+  return `http://127.0.0.1:${address.port}`;
+}
+
+async function request(baseUrl, pathname, options = {}) {
+  const headers = new Headers(options.headers);
+  if (options.body !== undefined && !headers.has("content-type")) {
+    headers.set("content-type", "application/json");
+  }
+  const response = await fetch(`${baseUrl}${pathname}`, {
+    ...options,
+    headers,
+    body: options.body === undefined || typeof options.body === "string"
+      ? options.body
+      : JSON.stringify(options.body),
+  });
+  const text = await response.text();
+  return {
+    response,
+    body: text ? JSON.parse(text) : undefined,
+  };
+}
+
+async function requestWithHost(baseUrl, host, headers = {}) {
+  const target = new URL("/health", baseUrl);
+  return new Promise((resolve, reject) => {
+    const outgoing = httpRequest(target, { headers: { ...headers, host } }, (response) => {
+      const chunks = [];
+      response.on("data", (chunk) => chunks.push(chunk));
+      response.on("end", () => resolve({
+        status: response.statusCode,
+        headers: response.headers,
+        body: JSON.parse(Buffer.concat(chunks).toString("utf8")),
+      }));
+    });
+    outgoing.on("error", reject);
+    outgoing.end();
+  });
+}
+
+function lanAuthorization() {
+  return `Basic ${Buffer.from(`codex:${LAN_SHARED_SECRET}`).toString("base64")}`;
+}
+
+test("defaults the standalone server to loopback when no host env is set", async () => {
+  const { resolveHost } = await import("../server/index.mjs");
+  const previousHost = process.env.CODEX_TASKBOARD_HOST;
+  delete process.env.CODEX_TASKBOARD_HOST;
+  try {
+    assert.equal(resolveHost(), "127.0.0.1");
+  } finally {
+    if (previousHost === undefined) delete process.env.CODEX_TASKBOARD_HOST;
+    else process.env.CODEX_TASKBOARD_HOST = previousHost;
+  }
+});
+
+test("LAN binding requires a shared secret before the server starts", async () => {
+  const directory = await mkdtemp(path.join(os.tmpdir(), "codex-taskboard-lan-secret-"));
+  const app = createTaskboardServer({ dataDirectory: directory });
+  try {
+    await assert.rejects(
+      app.listen({ host: "0.0.0.0", port: 0 }),
+      /TASKBOARD_SHARED_SECRET is required/,
+    );
+  } finally {
+    await app.close();
+    await rm(directory, { recursive: true, force: true });
+  }
+});
+
+test("health and the default local project are available", async () => {
+  let skillPath;
+  const baseUrl = await startServer(async (directory) => {
+    skillPath = path.join(directory, "skills", "manage-taskboard", "SKILL.md");
+    return { skillPath };
+  });
+
+  const health = await request(baseUrl, "/health");
+  assert.equal(health.response.status, 200);
+  assert.deepEqual(health.body, { status: "ok" });
+
+  const metadata = await request(baseUrl, "/api/meta");
+  assert.equal(metadata.response.status, 200);
+  assert.deepEqual(metadata.body, {
+    manageTaskboardSkillPath: skillPath,
+    capabilities: { localAiChat: true },
+  });
+
+  const result = await request(baseUrl, "/api/projects");
+  assert.equal(result.response.status, 200);
+  assert.equal(result.body.projects.length, 1);
+  assert.equal(result.body.projects[0].id, "local");
+  assert.equal(result.body.projects[0].name, "无项目");
+  assert.equal(result.body.projects[0].workspacePath, null);
+  assert.equal(result.body.projects[0].issueCount, 0);
+});
+
+test("workflow workspaces persist centrally with optimistic concurrency", async () => {
+  const baseUrl = await startServer();
+  const initial = await request(baseUrl, "/api/projects/local/workflow-workspace");
+  assert.deepEqual(initial.body.workflow, {
+    projectId: "local",
+    workspace: null,
+    version: 0,
+    updatedAt: null,
+  });
+
+  const workspace = {
+    version: 1,
+    tabs: [{ id: "issue-delivery", name: "任务处理与交付" }],
+    activeWorkflowId: "issue-delivery",
+    snapshots: {
+      "issue-delivery": {
+        nodes: [{ id: "issue-trigger", position: { x: 100, y: 80 }, data: { kind: "issue-trigger" } }],
+        flow: {
+          version: 2,
+          root: { items: [{ type: "step", nodeId: "issue-trigger" }] },
+        },
+        selectedNodeId: "issue-trigger",
+      },
+    },
+  };
+  const created = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+    method: "PUT",
+    body: { version: 0, workspace },
+  });
+  assert.equal(created.response.status, 200);
+  assert.equal(created.body.workflow.version, 1);
+  assert.deepEqual(created.body.workflow.workspace, workspace);
+
+  const fromAnotherClient = await request(baseUrl, "/api/projects/local/workflow-workspace");
+  assert.equal(fromAnotherClient.body.workflow.version, 1);
+  assert.deepEqual(fromAnotherClient.body.workflow.workspace, workspace);
+
+  const renamedWorkspace = {
+    ...workspace,
+    tabs: [{ id: "issue-delivery", name: "统一交付流程" }],
+  };
+  const updated = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+    method: "PUT",
+    body: { version: 1, workspace: renamedWorkspace },
+  });
+  assert.equal(updated.response.status, 200);
+  assert.equal(updated.body.workflow.version, 2);
+
+  const stale = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+    method: "PUT",
+    body: { version: 1, workspace },
+  });
+  assert.equal(stale.response.status, 409);
+  assert.equal(stale.body.error.code, "VERSION_CONFLICT");
+  assert.deepEqual(stale.body.error.details, {
+    expectedVersion: 1,
+    actualVersion: 2,
+  });
+});
+
+test("Twitter post content survives the shared workflow workspace round trip", async () => {
+  const baseUrl = await startServer();
+  const workspace = {
+    version: 1,
+    tabs: [{ id: "twitter-publishing", name: "Twitter 发布" }],
+    activeWorkflowId: "twitter-publishing",
+    snapshots: {
+      "twitter-publishing": {
+        nodes: [
+          {
+            id: "issue-trigger",
+            position: { x: 0, y: 0 },
+            data: { kind: "issue-trigger" },
+          },
+          {
+            id: "twitter-post",
+            position: { x: 0, y: 220 },
+            data: {
+              kind: "twitter-post",
+              twitterPostContent: "发布产品更新",
+            },
+          },
+        ],
+        flow: {
+          version: 2,
+          root: {
+            items: [
+              { type: "step", nodeId: "issue-trigger" },
+              { type: "step", nodeId: "twitter-post" },
+            ],
+          },
+        },
+        selectedNodeId: "twitter-post",
+      },
+    },
+  };
+
+  const saved = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+    method: "PUT",
+    body: { version: 0, workspace },
+  });
+  assert.equal(saved.response.status, 200);
+  assert.equal(
+    saved.body.workflow.workspace.snapshots["twitter-publishing"].nodes[1].data.twitterPostContent,
+    "发布产品更新",
+  );
+
+  const restored = await request(baseUrl, "/api/projects/local/workflow-workspace");
+  assert.equal(restored.response.status, 200);
+  assert.equal(
+    restored.body.workflow.workspace.snapshots["twitter-publishing"].nodes[1].data.twitterPostContent,
+    "发布产品更新",
+  );
+});
+
+test("workflow service accepts legacy edge snapshots and persists them as V2 control flow", async () => {
+  const baseUrl = await startServer();
+  const workspace = {
+    version: 1,
+    tabs: [{ id: "legacy", name: "Legacy" }],
+    activeWorkflowId: "legacy",
+    snapshots: {
+      legacy: {
+        nodes: [
+          { id: "trigger", position: { x: 0, y: 0 }, data: { kind: "issue-trigger" } },
+          { id: "condition", position: { x: 0, y: 100 }, data: { kind: "condition" } },
+          { id: "yes", position: { x: -180, y: 280 }, data: { kind: "skill" } },
+          { id: "no", position: { x: 180, y: 280 }, data: { kind: "mcp" } },
+        ],
+        edges: [
+          { id: "root", source: "trigger", target: "condition" },
+          {
+            id: "yes-edge",
+            source: "condition",
+            target: "yes",
+            data: { conditionId: "condition", conditionOutcome: "true" },
+          },
+          {
+            id: "no-edge",
+            source: "condition",
+            target: "no",
+            data: { conditionId: "condition", conditionOutcome: "false" },
+          },
+        ],
+        selectedNodeId: null,
+      },
+    },
+  };
+
+  const saved = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+    method: "PUT",
+    body: { version: 0, workspace },
+  });
+
+  assert.equal(saved.response.status, 200);
+  const snapshot = saved.body.workflow.workspace.snapshots.legacy;
+  assert.equal("edges" in snapshot, false);
+  assert.deepEqual(snapshot.flow, {
+    version: 2,
+    root: {
+      items: [
+        { type: "step", nodeId: "trigger" },
+        {
+          type: "condition",
+          nodeId: "condition",
+          branches: {
+            true: { items: [{ type: "step", nodeId: "yes" }] },
+            false: { items: [{ type: "step", nodeId: "no" }] },
+          },
+        },
+      ],
+    },
+  });
+});
+
+test("workflow service recursively migrates V1 linear conditions and persists V2 control flow", async () => {
+  const baseUrl = await startServer();
+  const result = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+    method: "PUT",
+    body: {
+      version: 0,
+      workspace: {
+        version: 1,
+        tabs: [{ id: "legacy", name: "Legacy" }],
+        activeWorkflowId: "legacy",
+        snapshots: {
+          legacy: {
+            nodes: [
+              { id: "trigger", position: { x: 0, y: 0 }, data: { kind: "issue-trigger" } },
+              { id: "first", position: { x: 0, y: 100 }, data: { kind: "condition" } },
+              { id: "action", position: { x: 0, y: 200 }, data: { kind: "skill" } },
+              { id: "second", position: { x: 0, y: 300 }, data: { kind: "condition" } },
+              { id: "tail", position: { x: 0, y: 400 }, data: { kind: "mcp" } },
+            ],
+            edges: [
+              { id: "a", source: "trigger", target: "first" },
+              { id: "b", source: "first", target: "action" },
+              { id: "c", source: "action", target: "second" },
+              { id: "d", source: "second", target: "tail" },
+            ],
+            selectedNodeId: null,
+          },
+        },
+      },
+    },
+  });
+
+  assert.equal(result.response.status, 200);
+  const snapshot = result.body.workflow.workspace.snapshots.legacy;
+  assert.equal("edges" in snapshot, false);
+  assert.deepEqual(snapshot.flow.root.items, [
+    { type: "step", nodeId: "trigger" },
+    {
+      type: "condition",
+      nodeId: "first",
+      branches: {
+        true: {
+          items: [
+            { type: "step", nodeId: "action" },
+            {
+              type: "condition",
+              nodeId: "second",
+              branches: {
+                true: { items: [{ type: "step", nodeId: "tail" }] },
+                false: { items: [] },
+              },
+            },
+          ],
+        },
+        false: { items: [] },
+      },
+    },
+  ]);
+});
+
+test("workflow service rejects snapshots with unknown flow versions", async () => {
+  const baseUrl = await startServer();
+  const result = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+    method: "PUT",
+    body: {
+      version: 0,
+      workspace: {
+        version: 1,
+        tabs: [{ id: "invalid", name: "Invalid" }],
+        activeWorkflowId: "invalid",
+        snapshots: {
+          invalid: {
+            nodes: [
+              { id: "trigger", position: { x: 0, y: 0 }, data: { kind: "issue-trigger" } },
+            ],
+            flow: {
+              version: 3,
+              root: { items: [{ type: "step", nodeId: "trigger" }] },
+            },
+            selectedNodeId: null,
+          },
+        },
+      },
+    },
+  });
+
+  assert.equal(result.response.status, 400);
+  assert.equal(result.body.error.code, "INVALID_FIELD");
+  assert.match(result.body.error.message, /version 2/i);
+});
+
+test("workflow service rejects malformed V2 snapshots with repeated triggers", async () => {
+  const baseUrl = await startServer();
+  const result = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+    method: "PUT",
+    body: {
+      version: 0,
+      workspace: {
+        version: 1,
+        tabs: [{ id: "invalid", name: "Invalid" }],
+        activeWorkflowId: "invalid",
+        snapshots: {
+          invalid: {
+            nodes: [
+              { id: "first", position: { x: 0, y: 0 }, data: { kind: "issue-trigger" } },
+              { id: "second", position: { x: 0, y: 100 }, data: { kind: "git-trigger" } },
+            ],
+            flow: {
+              version: 2,
+              root: {
+                items: [
+                  { type: "step", nodeId: "first" },
+                  { type: "step", nodeId: "second" },
+                ],
+              },
+            },
+            selectedNodeId: null,
+          },
+        },
+      },
+    },
+  });
+
+  assert.equal(result.response.status, 400);
+  assert.equal(result.body.error.code, "INVALID_FIELD");
+  assert.match(result.body.error.message, /trigger/i);
+});
+
+test("workflow service rejects V2 item types that do not match node kinds", async () => {
+  const baseUrl = await startServer();
+  const result = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+    method: "PUT",
+    body: {
+      version: 0,
+      workspace: {
+        version: 1,
+        tabs: [{ id: "invalid", name: "Invalid" }],
+        activeWorkflowId: "invalid",
+        snapshots: {
+          invalid: {
+            nodes: [
+              { id: "trigger", position: { x: 0, y: 0 }, data: { kind: "issue-trigger" } },
+              { id: "condition", position: { x: 0, y: 100 }, data: { kind: "condition" } },
+            ],
+            flow: {
+              version: 2,
+              root: {
+                items: [
+                  { type: "step", nodeId: "trigger" },
+                  { type: "step", nodeId: "condition" },
+                ],
+              },
+            },
+            selectedNodeId: null,
+          },
+        },
+      },
+    },
+  });
+
+  assert.equal(result.response.status, 400);
+  assert.equal(result.body.error.code, "INVALID_FIELD");
+  assert.match(result.body.error.message, /condition/i);
+});
+
+test("workflow service rejects V2 snapshots with duplicate node records", async () => {
+  const baseUrl = await startServer();
+  const result = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+    method: "PUT",
+    body: {
+      version: 0,
+      workspace: {
+        version: 1,
+        tabs: [{ id: "invalid", name: "Invalid" }],
+        activeWorkflowId: "invalid",
+        snapshots: {
+          invalid: {
+            nodes: [
+              { id: "trigger", position: { x: 0, y: 0 }, data: { kind: "issue-trigger" } },
+              { id: "trigger", position: { x: 0, y: 100 }, data: { kind: "issue-trigger" } },
+            ],
+            flow: {
+              version: 2,
+              root: {
+                items: [{ type: "step", nodeId: "trigger" }],
+              },
+            },
+            selectedNodeId: null,
+          },
+        },
+      },
+    },
+  });
+
+  assert.equal(result.response.status, 400);
+  assert.equal(result.body.error.code, "INVALID_FIELD");
+  assert.match(result.body.error.message, /node ids must be unique/i);
+});
+
+test("workflow service rejects V2 flow items that reference parented plan children", async () => {
+  const baseUrl = await startServer();
+  const result = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+    method: "PUT",
+    body: {
+      version: 0,
+      workspace: {
+        version: 1,
+        tabs: [{ id: "invalid", name: "Invalid" }],
+        activeWorkflowId: "invalid",
+        snapshots: {
+          invalid: {
+            nodes: [
+              { id: "trigger", position: { x: 0, y: 0 }, data: { kind: "issue-trigger" } },
+              { id: "plan", position: { x: 0, y: 100 }, data: { kind: "planning" } },
+              {
+                id: "plan-child",
+                parentId: "plan",
+                position: { x: 0, y: 0 },
+                data: { kind: "skill" },
+              },
+            ],
+            flow: {
+              version: 2,
+              root: {
+                items: [
+                  { type: "step", nodeId: "trigger" },
+                  { type: "step", nodeId: "plan" },
+                  { type: "step", nodeId: "plan-child" },
+                ],
+              },
+            },
+            selectedNodeId: null,
+          },
+        },
+      },
+    },
+  });
+
+  assert.equal(result.response.status, 400);
+  assert.equal(result.body.error.code, "INVALID_FIELD");
+  assert.match(result.body.error.message, /root node/i);
+});
+
+test("workflow service rejects malformed parented workflow nodes", async () => {
+  const cases = [
+    {
+      name: "missing parent",
+      nodes: [
+        { id: "trigger", position: { x: 0, y: 0 }, data: { kind: "issue-trigger" } },
+        {
+          id: "orphan",
+          parentId: "missing-plan",
+          position: { x: 0, y: 0 },
+          data: { kind: "skill" },
+        },
+      ],
+      items: [{ type: "step", nodeId: "trigger" }],
+      message: /missing parent/i,
+    },
+    {
+      name: "nested parent",
+      nodes: [
+        { id: "trigger", position: { x: 0, y: 0 }, data: { kind: "issue-trigger" } },
+        {
+          id: "root-plan",
+          position: { x: 0, y: 100 },
+          data: { kind: "basic-planning", acceptsChildren: true },
+        },
+        {
+          id: "nested-plan",
+          parentId: "root-plan",
+          position: { x: 0, y: 0 },
+          data: { kind: "basic-planning", acceptsChildren: true },
+        },
+        {
+          id: "nested-child",
+          parentId: "nested-plan",
+          position: { x: 0, y: 0 },
+          data: { kind: "skill" },
+        },
+      ],
+      items: [
+        { type: "step", nodeId: "trigger" },
+        { type: "step", nodeId: "root-plan" },
+      ],
+      message: /root parent/i,
+    },
+    {
+      name: "parent cannot accept children",
+      nodes: [
+        { id: "trigger", position: { x: 0, y: 0 }, data: { kind: "issue-trigger" } },
+        { id: "plain-step", position: { x: 0, y: 100 }, data: { kind: "skill" } },
+        {
+          id: "invalid-child",
+          parentId: "plain-step",
+          position: { x: 0, y: 0 },
+          data: { kind: "mcp" },
+        },
+      ],
+      items: [
+        { type: "step", nodeId: "trigger" },
+        { type: "step", nodeId: "plain-step" },
+      ],
+      message: /acceptsChildren/i,
+    },
+  ];
+
+  for (const invalidCase of cases) {
+    const baseUrl = await startServer();
+    const result = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+      method: "PUT",
+      body: {
+        version: 0,
+        workspace: {
+          version: 1,
+          tabs: [{ id: "invalid", name: "Invalid" }],
+          activeWorkflowId: "invalid",
+          snapshots: {
+            invalid: {
+              nodes: invalidCase.nodes,
+              flow: {
+                version: 2,
+                root: { items: invalidCase.items },
+              },
+              selectedNodeId: null,
+            },
+          },
+        },
+      },
+    });
+
+    assert.equal(result.response.status, 400, invalidCase.name);
+    assert.equal(result.body.error.code, "INVALID_FIELD", invalidCase.name);
+    assert.match(result.body.error.message, invalidCase.message, invalidCase.name);
+  }
+});
+
+test("workflow service rejects non-empty V2 snapshots without a trigger", async () => {
+  const baseUrl = await startServer();
+  const result = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+    method: "PUT",
+    body: {
+      version: 0,
+      workspace: {
+        version: 1,
+        tabs: [{ id: "invalid", name: "Invalid" }],
+        activeWorkflowId: "invalid",
+        snapshots: {
+          invalid: {
+            nodes: [
+              { id: "step", position: { x: 0, y: 0 }, data: { kind: "skill" } },
+            ],
+            flow: {
+              version: 2,
+              root: {
+                items: [{ type: "step", nodeId: "step" }],
+              },
+            },
+            selectedNodeId: null,
+          },
+        },
+      },
+    },
+  });
+
+  assert.equal(result.response.status, 400);
+  assert.equal(result.body.error.code, "INVALID_FIELD");
+  assert.match(result.body.error.message, /trigger/i);
+});
+
+test("workflow service rejects unknown node kinds that only look like triggers", async () => {
+  const baseUrl = await startServer();
+  const result = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+    method: "PUT",
+    body: {
+      version: 0,
+      workspace: {
+        version: 1,
+        tabs: [{ id: "invalid", name: "Invalid" }],
+        activeWorkflowId: "invalid",
+        snapshots: {
+          invalid: {
+            nodes: [
+              {
+                id: "unknown-trigger",
+                position: { x: 0, y: 0 },
+                data: { kind: "made-up-trigger" },
+              },
+            ],
+            flow: {
+              version: 2,
+              root: {
+                items: [{ type: "step", nodeId: "unknown-trigger" }],
+              },
+            },
+            selectedNodeId: null,
+          },
+        },
+      },
+    },
+  });
+
+  assert.equal(result.response.status, 400);
+  assert.equal(result.body.error.code, "INVALID_FIELD");
+  assert.match(result.body.error.message, /trigger kind/i);
+});
+
+test("workflow workspace changes are broadcast to other open clients", async () => {
+  const baseUrl = await startServer();
+  const eventResponse = await fetch(`${baseUrl}/api/events`);
+  const reader = eventResponse.body.getReader();
+  const decoder = new TextDecoder();
+  await reader.read();
+
+  const workspace = {
+    version: 1,
+    tabs: [{ id: "issue-delivery", name: "任务处理与交付" }],
+    activeWorkflowId: "issue-delivery",
+    snapshots: {
+      "issue-delivery": { nodes: [], edges: [], selectedNodeId: null },
+    },
+  };
+  const saved = await request(baseUrl, "/api/projects/local/workflow-workspace", {
+    method: "PUT",
+    body: { version: 0, workspace },
+  });
+  assert.equal(saved.response.status, 200);
+
+  let message = "";
+  while (!message.includes("\n\n")) {
+    const chunk = await reader.read();
+    assert.equal(chunk.done, false);
+    message += decoder.decode(chunk.value, { stream: true });
+  }
+  assert.match(message, /event: workflow\.updated/);
+  const dataLine = message.split("\n").find((line) => line.startsWith("data: "));
+  const event = JSON.parse(dataLine.slice(6));
+  assert.equal(event.type, "workflow.updated");
+  assert.equal(event.projectId, "local");
+  assert.equal(event.workflowVersion, 1);
+  await reader.cancel();
+});
+
+test("workflow capabilities come from the live Codex skill and MCP catalogs", async () => {
+  let workspacePath;
+  const baseUrl = await startServer(async (directory) => {
+    workspacePath = directory;
+    const codexExecutable = path.join(directory, "fake-codex");
+    await writeFile(codexExecutable, `#!/usr/bin/env node
+const args = process.argv.slice(2);
+if (args[0] === "debug") {
+  process.stdout.write('{"models":[{"slug":"gpt-real","display_name":"GPT Real","description":"","default_reasoning_level":"low","supported_reasoning_levels":[{"effort":"low"},{"effort":"high"}],"service_tiers":[]}]}');
+  process.exit(0);
+} else if (args[0] === "mcp") {
+  process.stdout.write('[{"name":"context7","enabled":true,"transport":{"type":"streamable_http"}},{"name":"disabled-server","enabled":false,"transport":{"type":"stdio"}}]');
+  process.exit(0);
+} else if (args[0] === "app-server") {
+  process.stdin.setEncoding("utf8");
+  let buffer = "";
+  process.stdin.on("data", (chunk) => {
+    buffer += chunk;
+    let index;
+    while ((index = buffer.indexOf("\\n")) >= 0) {
+      const line = buffer.slice(0, index);
+      buffer = buffer.slice(index + 1);
+      if (!line.trim()) continue;
+      const message = JSON.parse(line);
+      if (message.id === 1) process.stdout.write('{"id":1,"result":{"platformFamily":"unix"}}\\n');
+      if (message.id === 2) process.stdout.write('{"id":2,"result":{"data":[{"cwd":"workspace","skills":[{"name":"user-skill","enabled":true,"scope":"user","interface":null},{"name":"repo-skill","enabled":true,"scope":"repo","interface":{"displayName":"Repository Skill"}},{"name":"user-skill","enabled":true,"scope":"system","interface":{"displayName":"Duplicate"}},{"name":"disabled-skill","enabled":false,"scope":"user","interface":null}],"errors":[]}]}}\\n');
+    }
+  });
+} else {
+  process.stdin.resume();
+  process.stdin.on("end", () => {
+    process.stdout.write('{"type":"thread.started","thread_id":"session-1"}\\n');
+    process.stdout.write('{"type":"item.completed","item":{"type":"agent_message","text":"ok"}}\\n');
+    process.stdout.write('{"type":"turn.completed"}\\n');
+  });
+}
+
+`);
+    await chmod(codexExecutable, 0o755);
+    return { codexExecutable };
+  });
+
+  const result = await request(
+    baseUrl,
+    `/api/workflow-capabilities?workspacePath=${encodeURIComponent(workspacePath)}`,
+  );
+  assert.equal(result.response.status, 200);
+  assert.deepEqual(result.body, {
+    skills: [
+      { id: "repo-skill", label: "Repository Skill", description: "", path: "", scope: "repo" },
+      { id: "user-skill", label: "user-skill", description: "", path: "", scope: "user" },
+    ],
+    mcpServers: [
+      { id: "context7", label: "context7", transport: "streamable_http" },
+    ],
+  });
+
+  const invalidPath = await request(baseUrl, "/api/workflow-capabilities?workspacePath=relative");
+  assert.equal(invalidPath.response.status, 400);
+  assert.equal(invalidPath.body.error.code, "INVALID_FIELD");
+
+  const unknownQuery = await request(baseUrl, "/api/workflow-capabilities?extra=true");
+  assert.equal(unknownQuery.response.status, 400);
+  assert.equal(unknownQuery.body.error.code, "UNKNOWN_QUERY_PARAMETER");
+
+  const wrongMethod = await request(baseUrl, "/api/workflow-capabilities", { method: "POST" });
+  assert.equal(wrongMethod.response.status, 405);
+});
+
+test("workflow capability discovery fails instead of inventing fallback options", async () => {
+  const baseUrl = await startServer(async (directory) => ({
+    codexExecutable: path.join(directory, "missing-codex"),
+  }));
+  const result = await request(baseUrl, "/api/workflow-capabilities");
+  assert.equal(result.response.status, 500);
+  assert.equal(result.body.error.code, "INTERNAL_ERROR");
+});
+
+test("existing task and comment thread attribution remains content-specific", async () => {
+  const baseUrl = await startServer(async (directory) => {
+    const databasePath = path.join(directory, "taskboard.sqlite");
+    const database = new DatabaseSync(databasePath);
+    database.exec(`
+      CREATE TABLE projects (
+        id TEXT PRIMARY KEY,
+        name TEXT NOT NULL,
+        workspace_path TEXT,
+        next_task_number INTEGER NOT NULL,
+        created_at TEXT NOT NULL,
+        updated_at TEXT NOT NULL
+      );
+      CREATE TABLE tasks (
+        id TEXT PRIMARY KEY,
+        identifier TEXT NOT NULL UNIQUE,
+        project_id TEXT NOT NULL REFERENCES projects(id),
+        title TEXT NOT NULL,
+        description TEXT NOT NULL DEFAULT '',
+        status TEXT NOT NULL CHECK (status IN ('backlog', 'todo', 'in_progress', 'done')),
+        priority TEXT NOT NULL,
+        labels TEXT NOT NULL DEFAULT '[]',
+        sort_order REAL NOT NULL,
+        thread_id TEXT,
+        git_branch TEXT,
+        worktree_path TEXT,
+        worktree_branch TEXT,
+        due_date TEXT,
+        recurrence_interval INTEGER,
+        recurrence_unit TEXT,
+        archived_at TEXT,
+        version INTEGER NOT NULL DEFAULT 1,
+        created_at TEXT NOT NULL,
+        updated_at TEXT NOT NULL
+      );
+      CREATE TABLE comments (
+        id TEXT PRIMARY KEY,
+        task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE,
+        body TEXT NOT NULL,
+        thread_id TEXT,
+        author_id TEXT NOT NULL,
+        author_name TEXT NOT NULL,
+        version INTEGER NOT NULL DEFAULT 1,
+        created_at TEXT NOT NULL,
+        updated_at TEXT NOT NULL
+      );
+      CREATE TABLE attachments (
+        id TEXT PRIMARY KEY,
+        task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE,
+        filename TEXT NOT NULL,
+        content_type TEXT NOT NULL,
+        size INTEGER NOT NULL,
+        created_at TEXT NOT NULL
+      );
+      INSERT INTO projects VALUES ('local', 'Local', NULL, 2, '2026-07-20T00:00:00.000Z', '2026-07-20T00:00:00.000Z');
+      INSERT INTO tasks VALUES (
+        'legacy-task', 'LOCAL-1', 'local', 'Legacy task', '', 'todo', 'none', '[]', 1000,
+        'legacy-thread', NULL, NULL, NULL, NULL, NULL, NULL, NULL, 1,
+        '2026-07-20T00:00:00.000Z', '2026-07-20T00:00:00.000Z'
+      );
+      INSERT INTO comments VALUES (
+        'legacy-comment', 'legacy-task', 'Legacy comment', 'legacy-comment-thread', 'local', '本地用户', 1,
+        '2026-07-20T00:00:00.000Z', '2026-07-20T00:00:00.000Z'
+      );
+      INSERT INTO attachments VALUES (
+        'legacy-attachment', 'legacy-task', 'legacy.txt', 'text/plain', 0,
+        '2026-07-20T00:00:00.000Z'
+      );
+    `);
+    database.close();
+    return { databasePath };
+  });
+
+  const result = await request(baseUrl, "/api/tasks/legacy-task");
+  assert.equal(result.response.status, 200);
+  assert.equal(result.body.task.threadId, "legacy-thread");
+  assert.equal(result.body.task.creatorType, "agent");
+  assert.equal(result.body.task.creatorId, "codex-agent");
+  assert.equal(result.body.task.creatorName, "Codex Agent");
+  assert.deepEqual(result.body.task.assignee, {
+    type: "agent",
+    id: "codex-agent",
+    name: "Codex Agent",
+    avatarUrl: null,
+  });
+  assert.equal(Object.hasOwn(result.body.task, "linkedThreadId"), false);
+  const columns = runningApps.at(-1).app.database.database.prepare("PRAGMA table_info(tasks)").all();
+  assert.equal(columns.some((column) => column.name === "thread_id"), true);
+  assert.equal(columns.some((column) => column.name === "workflow_id"), true);
+  assert.equal(columns.some((column) => column.name === "assignee_type"), true);
+  assert.equal(columns.some((column) => column.name === "assignee_id"), true);
+  assert.equal(columns.some((column) => column.name === "assignee_name"), true);
+  assert.equal(columns.some((column) => column.name === "assignee_avatar_url"), true);
+  assert.equal(columns.some((column) => column.name === "linked_thread_id"), false);
+  assert.equal(result.body.task.workflowId, null);
+  const taskThreads = runningApps.at(-1).app.database.database.prepare(`
+    SELECT 1 FROM sqlite_schema WHERE type = 'table' AND name = 'task_threads'
+  `).get();
+  assert.equal(taskThreads, undefined);
+  const comments = await request(baseUrl, "/api/tasks/legacy-task/comments");
+  assert.equal(comments.body.comments[0].threadId, "legacy-comment-thread");
+  assert.equal(comments.body.comments[0].authorType, "agent");
+  assert.equal(comments.body.comments[0].authorId, "codex-agent");
+  assert.equal(comments.body.comments[0].authorName, "Codex Agent");
+  assert.deepEqual(comments.body.comments[0].attachments, []);
+  const attachments = await request(baseUrl, "/api/tasks/legacy-task/attachments");
+  assert.equal(attachments.body.attachments[0].commentId, null);
+
+  let version = result.body.task.version;
+  for (const status of ["in_review", "blocked", "canceled"]) {
+    const moveResult = await request(baseUrl, "/api/tasks/legacy-task/move", {
+      method: "POST",
+      body: { version, status },
+    });
+    assert.equal(moveResult.response.status, 200);
+    assert.equal(moveResult.body.task.status, status);
+    version = moveResult.body.task.version;
+  }
+  const tasksSql = runningApps.at(-1).app.database.database.prepare(`
+    SELECT sql FROM sqlite_schema WHERE type = 'table' AND name = 'tasks'
+  `).get().sql;
+  assert.match(tasksSql, /'in_review'/);
+  assert.match(tasksSql, /'blocked'/);
+  assert.match(tasksSql, /'canceled'/);
+  const commentForeignKeys = runningApps.at(-1).app.database.database
+    .prepare("PRAGMA foreign_key_list(comments)")
+    .all();
+  assert.equal(commentForeignKeys.some((foreignKey) => foreignKey.table === "tasks"), true);
+});
+
+test("task thread migration excludes comment-only aggregate entries", async () => {
+  const baseUrl = await startServer(async (directory) => {
+    const databasePath = path.join(directory, "taskboard.sqlite");
+    const database = new DatabaseSync(databasePath);
+    database.exec(`
+      CREATE TABLE projects (
+        id TEXT PRIMARY KEY,
+        name TEXT NOT NULL,
+        workspace_path TEXT,
+        next_task_number INTEGER NOT NULL,
+        created_at TEXT NOT NULL,
+        updated_at TEXT NOT NULL
+      );
+      CREATE TABLE tasks (
+        id TEXT PRIMARY KEY,
+        identifier TEXT NOT NULL UNIQUE,
+        project_id TEXT NOT NULL REFERENCES projects(id),
+        title TEXT NOT NULL,
+        description TEXT NOT NULL DEFAULT '',
+        status TEXT NOT NULL,
+        priority TEXT NOT NULL,
+        labels TEXT NOT NULL DEFAULT '[]',
+        sort_order REAL NOT NULL,
+        git_branch TEXT,
+        worktree_path TEXT,
+        worktree_branch TEXT,
+        due_date TEXT,
+        recurrence_interval INTEGER,
+        recurrence_unit TEXT,
+        archived_at TEXT,
+        version INTEGER NOT NULL DEFAULT 1,
+        created_at TEXT NOT NULL,
+        updated_at TEXT NOT NULL
+      );
+      CREATE TABLE task_threads (
+        task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE,
+        thread_id TEXT NOT NULL,
+        created_at TEXT NOT NULL,
+        PRIMARY KEY (task_id, thread_id)
+      );
+      CREATE TABLE comments (
+        id TEXT PRIMARY KEY,
+        task_id TEXT NOT NULL REFERENCES tasks(id) ON DELETE CASCADE,
+        body TEXT NOT NULL,
+        thread_id TEXT,
+        author_id TEXT NOT NULL,
+        author_name TEXT NOT NULL,
+        version INTEGER NOT NULL DEFAULT 1,
+        created_at TEXT NOT NULL,
+        updated_at TEXT NOT NULL
+      );
+      INSERT INTO projects VALUES ('local', 'Local', NULL, 2, '2026-07-20T00:00:00.000Z', '2026-07-20T00:00:00.000Z');
+      INSERT INTO tasks VALUES (
+        'aggregate-task', 'LOCAL-1', 'local', 'Aggregate task', '', 'todo', 'none', '[]', 1000,
+        NULL, NULL, NULL, NULL, NULL, NULL, NULL, 1,
+        '2026-07-20T00:00:00.000Z', '2026-07-20T03:00:00.000Z'
+      );
+      INSERT INTO task_threads VALUES ('aggregate-task', 'thread-subject', '2026-07-20T01:00:00.000Z');
+      INSERT INTO task_threads VALUES ('aggregate-task', 'thread-comment-only', '2026-07-20T02:00:00.000Z');
+      INSERT INTO comments VALUES (
+        'aggregate-comment', 'aggregate-task', 'Comment', 'thread-comment-only', 'local', '本地用户', 1,
+        '2026-07-20T02:00:00.000Z', '2026-07-20T02:00:00.000Z'
+      );
+    `);
+    database.close();
+    return { databasePath };
+  });
+
+  const task = await request(baseUrl, "/api/tasks/aggregate-task");
+  assert.equal(task.body.task.threadId, "thread-subject");
+  const taskThreads = runningApps.at(-1).app.database.database.prepare(`
+    SELECT 1 FROM sqlite_schema WHERE type = 'table' AND name = 'task_threads'
+  `).get();
+  assert.equal(taskThreads, undefined);
+  const comments = await request(baseUrl, "/api/tasks/aggregate-task/comments");
+  assert.equal(comments.body.comments[0].threadId, "thread-comment-only");
+});
+
+test("development context scan resolves the current Codex conversation workspace", async () => {
+  let expectedWorkspace;
+  const baseUrl = await startServer(async (directory) => {
+    expectedWorkspace = directory;
+    const processesPath = path.join(directory, "chat_processes.json");
+    await writeFile(processesPath, JSON.stringify({
+      recent: [{
+        conversationId: "019f7f96-287b-7da0-bc7f-ffe03af85cc8",
+        cwd: directory,
+        updatedAtMs: 20,
+      }],
+    }));
+    return {
+      codexStatePath: path.join(directory, "missing-state.json"),
+      codexProcessesPath: processesPath,
+    };
+  });
+  const result = await request(
+    baseUrl,
+    "/api/projects/local/development-contexts?codexThreadId=019f7f96-287b-7da0-bc7f-ffe03af85cc8",
+  );
+  assert.equal(result.response.status, 200);
+  assert.equal(result.body.workspacePath, expectedWorkspace);
+  assert.deepEqual(result.body.contexts, []);
+
+  const deviceWorkspace = path.join(expectedWorkspace, "another-device-workspace");
+  const deviceResult = await request(
+    baseUrl,
+    `/api/projects/local/development-contexts?workspacePath=${encodeURIComponent(deviceWorkspace)}`,
+  );
+  assert.equal(deviceResult.response.status, 200);
+  assert.equal(deviceResult.body.workspacePath, deviceWorkspace);
+});
+
+test("device workspaces come from this machine's Codex project roots", async () => {
+  const baseUrl = await startServer(async (directory) => {
+    const codexStatePath = path.join(directory, "codex-state.json");
+    await writeFile(codexStatePath, JSON.stringify({
+      "local-projects": {
+        "local-project-a": { rootPaths: ["/Users/alice/project-a"] },
+        "local-project-b": { rootPaths: ["/Users/alice/project-b"] },
+      },
+    }));
+    return { codexStatePath };
+  });
+  const result = await request(baseUrl, "/api/device-workspaces");
+  assert.equal(result.response.status, 200);
+  assert.deepEqual(result.body.workspaces, {
+    "local-project-a": "/Users/alice/project-a",
+    "local-project-b": "/Users/alice/project-b",
+  });
+});
+
+test("accepts private LAN requests and rejects public Host and Origin headers", async () => {
+  const baseUrl = await startServer(undefined, { host: "0.0.0.0" });
+  const authorization = lanAuthorization();
+
+  const codexOriginResult = await request(baseUrl, "/health", {
+    headers: { authorization, origin: "app://-" },
+  });
+  assert.equal(codexOriginResult.response.status, 200);
+
+  const lanHostResult = await requestWithHost(baseUrl, "192.168.1.24:47823", { authorization });
+  assert.equal(lanHostResult.status, 200);
+
+  const lanOriginResult = await requestWithHost(
+    baseUrl,
+    "192.168.1.24:47823",
+    {
+      authorization,
+      origin: "http://192.168.1.24:47823",
+    },
+  );
+  assert.equal(lanOriginResult.status, 200);
+  assert.equal(lanOriginResult.headers["access-control-allow-origin"], undefined);
+
+  const localHostnameResult = await requestWithHost(
+    baseUrl,
+    "taskboard.local:47823",
+    { authorization },
+  );
+  assert.equal(localHostnameResult.status, 200);
+  assert.equal(localHostnameResult.headers["x-taskboard-bind-host"], "0.0.0.0");
+
+  const hostResult = await requestWithHost(
+    baseUrl,
+    "taskboard.example.com",
+    { authorization },
+  );
+  assert.equal(hostResult.status, 403);
+  assert.equal(hostResult.body.error.code, "INVALID_HOST");
+
+  const originResult = await requestWithHost(
+    baseUrl,
+    "192.168.1.24:47823",
+    {
+      authorization,
+      origin: "https://evil.example",
+    },
+  );
+  assert.equal(originResult.status, 403);
+  assert.equal(originResult.body.error.code, "INVALID_ORIGIN");
+
+  const unauthorized = await requestWithHost(baseUrl, "192.168.1.24:47823");
+  assert.equal(unauthorized.status, 401);
+  assert.equal(unauthorized.body.error.code, "LAN_AUTH_REQUIRED");
+  assert.match(unauthorized.headers["www-authenticate"], /Basic/);
+
+  const wrongCredentials = await requestWithHost(
+    baseUrl,
+    "192.168.1.24:47823",
+    { authorization: `Basic ${Buffer.from("codex:wrong-secret").toString("base64")}` },
+  );
+  assert.equal(wrongCredentials.status, 401);
+  assert.equal(wrongCredentials.body.error.code, "LAN_AUTH_REQUIRED");
+
+  const mismatchedOrigin = await requestWithHost(
+    baseUrl,
+    "192.168.1.24:47823",
+    {
+      authorization,
+      origin: "http://192.168.1.25:47823",
+    },
+  );
+  assert.equal(mismatchedOrigin.status, 403);
+  assert.equal(mismatchedOrigin.body.error.code, "INVALID_ORIGIN");
+});
+
+test("project and task CRUD flow", async () => {
+  const baseUrl = await startServer();
+
+  const projectResult = await request(baseUrl, "/api/projects", {
+    method: "POST",
+    body: { id: "website", name: "Website", workspacePath: "/work/website" },
+  });
+  assert.equal(projectResult.response.status, 201);
+  assert.equal(projectResult.body.project.id, "website");
+  assert.equal(projectResult.body.project.workspacePath, "/work/website");
+
+  const createResult = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: {
+      projectId: "website",
+      title: "Build task board",
+      description: "Create the first local board",
+      status: "todo",
+      priority: "high",
+      labels: ["frontend", "mvp"],
+      threadId: "thread-123",
+      developmentContext: {
+        type: "worktree",
+        path: "/work/website/.worktrees/taskboard",
+        branch: "worktree/taskboard",
+      },
+      dueDate: "2026-07-24",
+      recurrence: { interval: 2, unit: "week" },
+    },
+  });
+  assert.equal(createResult.response.status, 201);
+  const created = createResult.body.task;
+  assert.equal(created.identifier, "WEBSITE-1");
+  assert.equal(created.version, 1);
+  assert.equal(created.sortOrder, 1000);
+  assert.equal(created.archivedAt, null);
+  assert.deepEqual(created.labels, ["frontend", "mvp"]);
+  assert.equal(created.threadId, "thread-123");
+  assert.equal(created.creatorType, "user");
+  assert.equal(created.creatorId, "local-user");
+  assert.equal(created.creatorName, "本地用户");
+  assert.equal(created.creatorAvatarUrl, null);
+  assert.deepEqual(created.developmentContext, {
+    type: "worktree",
+    path: "/work/website/.worktrees/taskboard",
+    branch: "worktree/taskboard",
+  });
+  assert.equal(created.dueDate, "2026-07-24");
+  assert.deepEqual(created.recurrence, { interval: 2, unit: "week" });
+
+  const projectsAfterCreate = await request(baseUrl, "/api/projects");
+  const websiteProject = projectsAfterCreate.body.projects.find((project) => project.id === "website");
+  assert.equal(websiteProject.issueCount, 1);
+
+  const getResult = await request(baseUrl, `/api/tasks/${created.id}`);
+  assert.equal(getResult.response.status, 200);
+  assert.deepEqual(getResult.body.task, created);
+  const getByIdentifier = await request(baseUrl, `/api/tasks/${created.identifier}`);
+  assert.equal(getByIdentifier.response.status, 200);
+  assert.equal(getByIdentifier.body.task.id, created.id);
+
+  const listResult = await request(baseUrl, "/api/tasks?projectId=website&status=todo");
+  assert.equal(listResult.response.status, 200);
+  assert.deepEqual(listResult.body.tasks.map((task) => task.id), [created.id]);
+
+  const patchResult = await request(baseUrl, `/api/tasks/${created.identifier}`, {
+    method: "PATCH",
+    body: {
+      version: created.version,
+      title: "Build polished task board",
+      priority: "urgent",
+      threadId: "thread-456",
+      developmentContext: { type: "branch", branch: "feature/polish" },
+    },
+  });
+  assert.equal(patchResult.response.status, 200);
+  const updated = patchResult.body.task;
+  assert.equal(updated.title, "Build polished task board");
+  assert.equal(updated.priority, "urgent");
+  assert.equal(updated.threadId, "thread-456");
+  assert.deepEqual(updated.developmentContext, { type: "branch", branch: "feature/polish" });
+  assert.equal(updated.version, 2);
+
+  const archiveResult = await request(baseUrl, `/api/tasks/${created.id}/archive`, {
+    method: "POST",
+    body: { version: updated.version, threadId: "thread-archive" },
+  });
+  assert.equal(archiveResult.response.status, 200);
+  assert.equal(archiveResult.body.task.version, 3);
+  assert.equal(archiveResult.body.task.threadId, "thread-archive");
+  assert.match(archiveResult.body.task.archivedAt, /^\d{4}-\d{2}-\d{2}T/);
+
+  const activeList = await request(baseUrl, "/api/tasks?projectId=website");
+  assert.deepEqual(activeList.body.tasks, []);
+  const archivedList = await request(baseUrl, "/api/tasks?projectId=website&archived=true");
+  assert.deepEqual(archivedList.body.tasks.map((task) => task.id), [created.id]);
+
+  const projectsAfterArchive = await request(baseUrl, "/api/projects");
+  const archivedWebsiteProject = projectsAfterArchive.body.projects.find((project) => project.id === "website");
+  assert.equal(archivedWebsiteProject.issueCount, 0);
+
+  const restoreResult = await request(baseUrl, `/api/tasks/${created.id}/restore`, {
+    method: "POST",
+    body: { version: archiveResult.body.task.version, threadId: "thread-restore" },
+  });
+  assert.equal(restoreResult.response.status, 200);
+  assert.equal(restoreResult.body.task.archivedAt, null);
+  assert.equal(restoreResult.body.task.version, 4);
+  assert.equal(restoreResult.body.task.threadId, "thread-restore");
+
+  const activeAfterRestore = await request(baseUrl, "/api/tasks?projectId=website");
+  assert.deepEqual(activeAfterRestore.body.tasks.map((task) => task.id), [created.id]);
+  const projectsAfterRestore = await request(baseUrl, "/api/projects");
+  const restoredWebsiteProject = projectsAfterRestore.body.projects.find((project) => project.id === "website");
+  assert.equal(restoredWebsiteProject.issueCount, 1);
+});
+
+test("moving a task updates its status and sort order", async () => {
+  const baseUrl = await startServer();
+  const createResult = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: { title: "Move me" },
+  });
+  const task = createResult.body.task;
+
+  const moveResult = await request(baseUrl, `/api/tasks/${task.id}/move`, {
+    method: "POST",
+    body: { version: task.version, status: "in_progress", sortOrder: 2500.5, threadId: "thread-move" },
+  });
+  assert.equal(moveResult.response.status, 200);
+  assert.equal(moveResult.body.task.status, "in_progress");
+  assert.equal(moveResult.body.task.sortOrder, 2500.5);
+  assert.equal(moveResult.body.task.threadId, "thread-move");
+  assert.equal(moveResult.body.task.version, 2);
+});
+
+test("moving a task can transfer it to another project", async () => {
+  const baseUrl = await startServer();
+  const projectResult = await request(baseUrl, "/api/projects", {
+    method: "POST",
+    body: { id: "target", name: "Target" },
+  });
+  assert.equal(projectResult.response.status, 201);
+
+  const createResult = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: { title: "Move projects" },
+  });
+  const task = createResult.body.task;
+  assert.equal(task.projectId, "local");
+
+  const eventResponse = await fetch(`${baseUrl}/api/events`);
+  const reader = eventResponse.body.getReader();
+  const decoder = new TextDecoder();
+  await reader.read();
+
+  const moveResult = await request(baseUrl, `/api/tasks/${task.id}/move`, {
+    method: "POST",
+    body: { version: task.version, status: task.status, projectId: "target" },
+  });
+  assert.equal(moveResult.response.status, 200);
+  assert.equal(moveResult.body.task.projectId, "target");
+  assert.equal(moveResult.body.task.status, task.status);
+  assert.equal(moveResult.body.task.sortOrder, 1000);
+  assert.equal(moveResult.body.task.version, 2);
+
+  const sourceList = await request(baseUrl, "/api/tasks?projectId=local");
+  assert.deepEqual(sourceList.body.tasks.map((item) => item.id), []);
+  const targetList = await request(baseUrl, "/api/tasks?projectId=target");
+  assert.deepEqual(targetList.body.tasks.map((item) => item.id), [task.id]);
+
+  const projectsResult = await request(baseUrl, "/api/projects");
+  const localProject = projectsResult.body.projects.find((project) => project.id === "local");
+  const targetProject = projectsResult.body.projects.find((project) => project.id === "target");
+  assert.equal(localProject.issueCount, 0);
+  assert.equal(targetProject.issueCount, 1);
+
+  let message = "";
+  while (!message.includes("\n\n")) {
+    const chunk = await reader.read();
+    assert.equal(chunk.done, false);
+    message += decoder.decode(chunk.value, { stream: true });
+  }
+  assert.match(message, /event: task\.moved/);
+  const dataLine = message.split("\n").find((line) => line.startsWith("data: "));
+  const event = JSON.parse(dataLine.slice(6));
+  assert.equal(event.type, "task.moved");
+  assert.equal(event.projectId, "target");
+  assert.equal(event.previousProjectId, "local");
+  assert.equal(event.task.id, task.id);
+  await reader.cancel();
+});
+
+test("tasks can bind, change, and unbind one project workflow", async () => {
+  const baseUrl = await startServer();
+  const createResult = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: {
+      title: "Bind workflow",
+      workflowId: "issue-delivery",
+    },
+  });
+  assert.equal(createResult.response.status, 201);
+  assert.equal(createResult.body.task.workflowId, "issue-delivery");
+
+  const changedResult = await request(baseUrl, `/api/tasks/${createResult.body.task.id}`, {
+    method: "PATCH",
+    body: {
+      version: createResult.body.task.version,
+      workflowId: "workflow-123",
+    },
+  });
+  assert.equal(changedResult.response.status, 200);
+  assert.equal(changedResult.body.task.workflowId, "workflow-123");
+
+  const unboundResult = await request(baseUrl, `/api/tasks/${createResult.body.task.id}`, {
+    method: "PATCH",
+    body: {
+      version: changedResult.body.task.version,
+      workflowId: null,
+    },
+  });
+  assert.equal(unboundResult.response.status, 200);
+  assert.equal(unboundResult.body.task.workflowId, null);
+
+  const invalidResult = await request(baseUrl, `/api/tasks/${createResult.body.task.id}`, {
+    method: "PATCH",
+    body: {
+      version: unboundResult.body.task.version,
+      workflowId: " ",
+    },
+  });
+  assert.equal(invalidResult.response.status, 400);
+  assert.equal(invalidResult.body.error.code, "INVALID_FIELD");
+});
+
+test("issues support parent, sub-issue, blocking, and related issue relationships", async () => {
+  const baseUrl = await startServer();
+  const createIssue = async (title, status = "todo", projectId = "local") => {
+    const result = await request(baseUrl, "/api/tasks", {
+      method: "POST",
+      body: { projectId, title, status },
+    });
+    assert.equal(result.response.status, 201);
+    return result.body.task;
+  };
+  const latest = async (id) => (await request(baseUrl, `/api/tasks/${id}`)).body.task;
+  const mutateRelation = async (method, task, type, related, version = task.version) => (
+    request(
+      baseUrl,
+      `/api/tasks/${encodeURIComponent(task.id)}/relations/${type}/${encodeURIComponent(related.id)}`,
+      {
+        method,
+        body: { version, threadId: "thread-relations" },
+      },
+    )
+  );
+
+  const parent = await createIssue("Parent issue");
+  const child = await createIssue("Child issue", "done");
+  const grandchild = await createIssue("Grandchild issue", "canceled");
+  const blocker = await createIssue("Blocking issue", "in_progress");
+  const related = await createIssue("Related issue");
+
+  const parentAdded = await mutateRelation("POST", child, "parent", parent);
+  assert.equal(parentAdded.response.status, 200);
+  assert.equal(parentAdded.body.task.version, child.version + 1);
+  assert.equal(parentAdded.body.task.threadId, "thread-relations");
+  assert.equal(parentAdded.body.task.relations.parent.id, parent.id);
+  assert.equal(parentAdded.body.relatedTask.id, parent.id);
+
+  const parentAfterAdd = await latest(parent.id);
+  assert.deepEqual(parentAfterAdd.relations.subIssues.map((issue) => issue.id), [child.id]);
+  assert.equal(parentAfterAdd.relations.subIssues[0].status, "done");
+  assert.equal(parentAfterAdd.relations.subIssues[0].threadId, "thread-relations");
+
+  const childWithGrandchild = await mutateRelation("POST", grandchild, "parent", await latest(child.id));
+  assert.equal(childWithGrandchild.response.status, 200);
+  const cycle = await mutateRelation("POST", await latest(parent.id), "parent", await latest(grandchild.id));
+  assert.equal(cycle.response.status, 409);
+  assert.equal(cycle.body.error.code, "RELATION_CYCLE");
+
+  const self = await mutateRelation("POST", await latest(parent.id), "related", await latest(parent.id));
+  assert.equal(self.response.status, 400);
+  assert.equal(self.body.error.code, "SELF_RELATION");
+
+  const blocksAdded = await mutateRelation("POST", await latest(parent.id), "blocks", blocker);
+  assert.equal(blocksAdded.response.status, 200);
+  assert.deepEqual(blocksAdded.body.task.relations.blocks.map((issue) => issue.id), [blocker.id]);
+  assert.deepEqual((await latest(blocker.id)).relations.blockedBy.map((issue) => issue.id), [parent.id]);
+
+  const duplicateBlocks = await mutateRelation(
+    "POST",
+    await latest(blocker.id),
+    "blocked_by",
+    await latest(parent.id),
+  );
+  assert.equal(duplicateBlocks.response.status, 409);
+  assert.equal(duplicateBlocks.body.error.code, "RELATION_EXISTS");
+
+  const relatedAdded = await mutateRelation("POST", await latest(parent.id), "related", related);
+  assert.equal(relatedAdded.response.status, 200);
+  assert.deepEqual(relatedAdded.body.task.relations.related.map((issue) => issue.id), [related.id]);
+  assert.deepEqual((await latest(related.id)).relations.related.map((issue) => issue.id), [parent.id]);
+
+  const stale = await mutateRelation(
+    "DELETE",
+    relatedAdded.body.task,
+    "related",
+    related,
+    relatedAdded.body.task.version - 1,
+  );
+  assert.equal(stale.response.status, 409);
+  assert.equal(stale.body.error.code, "VERSION_CONFLICT");
+
+  const relatedRemoved = await mutateRelation("DELETE", relatedAdded.body.task, "related", related);
+  assert.equal(relatedRemoved.response.status, 200);
+  assert.deepEqual(relatedRemoved.body.task.relations.related, []);
+  assert.deepEqual((await latest(related.id)).relations.related, []);
+
+  const replacementParent = await createIssue("Replacement parent");
+  const childBeforeReplace = await latest(child.id);
+  const replaced = await mutateRelation("POST", childBeforeReplace, "parent", replacementParent);
+  assert.equal(replaced.response.status, 200);
+  assert.equal(replaced.body.task.relations.parent.id, replacementParent.id);
+  assert.deepEqual((await latest(parent.id)).relations.subIssues, []);
+  assert.deepEqual((await latest(replacementParent.id)).relations.subIssues.map((issue) => issue.id), [child.id]);
+
+  const parentRemoved = await mutateRelation("DELETE", replaced.body.task, "parent", replacementParent);
+  assert.equal(parentRemoved.response.status, 200);
+  assert.equal(parentRemoved.body.task.relations.parent, null);
+  assert.deepEqual((await latest(replacementParent.id)).relations.subIssues, []);
+
+  const projectResult = await request(baseUrl, "/api/projects", {
+    method: "POST",
+    body: { id: "other", name: "Other" },
+  });
+  assert.equal(projectResult.response.status, 201);
+  const crossProject = await createIssue("Other project issue", "todo", "other");
+  const crossProjectRelation = await mutateRelation(
+    "POST",
+    await latest(parent.id),
+    "related",
+    crossProject,
+  );
+  assert.equal(crossProjectRelation.response.status, 400);
+  assert.equal(crossProjectRelation.body.error.code, "CROSS_PROJECT_RELATION");
+});
+
+test("issue relationship changes are broadcast in realtime", async () => {
+  const baseUrl = await startServer();
+  const first = (await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: { title: "Realtime source" },
+  })).body.task;
+  const second = (await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: { title: "Realtime target" },
+  })).body.task;
+
+  const eventResponse = await fetch(`${baseUrl}/api/events`);
+  const reader = eventResponse.body.getReader();
+  const decoder = new TextDecoder();
+  await reader.read();
+
+  const changed = await request(
+    baseUrl,
+    `/api/tasks/${first.id}/relations/related/${second.id}`,
+    {
+      method: "POST",
+      body: { version: first.version, threadId: "thread-realtime-relation" },
+    },
+  );
+  assert.equal(changed.response.status, 200);
+
+  let message = "";
+  while (!message.includes("\n\n")) {
+    const chunk = await reader.read();
+    assert.equal(chunk.done, false);
+    message += decoder.decode(chunk.value, { stream: true });
+  }
+  assert.match(message, /event: task\.relation\.updated/);
+  const dataLine = message.split("\n").find((line) => line.startsWith("data: "));
+  const event = JSON.parse(dataLine.slice(6));
+  assert.equal(event.type, "task.relation.updated");
+  assert.equal(event.task.id, first.id);
+  assert.equal(event.relatedTask.id, second.id);
+  await reader.cancel();
+});
+
+test("all task statuses are accepted, filtered, and listed in workflow order", async () => {
+  const baseUrl = await startServer();
+  const statuses = ["canceled", "done", "blocked", "in_review", "in_progress", "todo", "backlog"];
+
+  for (const status of statuses) {
+    const createResult = await request(baseUrl, "/api/tasks", {
+      method: "POST",
+      body: { title: status, status },
+    });
+    assert.equal(createResult.response.status, 201);
+    assert.equal(createResult.body.task.status, status);
+  }
+
+  const listResult = await request(baseUrl, "/api/tasks");
+  assert.deepEqual(
+    listResult.body.tasks.map((task) => task.status),
+    ["backlog", "todo", "in_progress", "in_review", "blocked", "done", "canceled"],
+  );
+
+  for (const status of ["in_review", "blocked", "canceled"]) {
+    const filteredResult = await request(baseUrl, `/api/tasks?status=${status}`);
+    assert.equal(filteredResult.response.status, 200);
+    assert.deepEqual(filteredResult.body.tasks.map((task) => task.status), [status]);
+  }
+});
+
+test("task and comment mutations keep content-specific conversation attribution", async () => {
+  const baseUrl = await startServer();
+  const createResult = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: { title: "Keep attribution", threadId: "thread-original" },
+  });
+  const task = createResult.body.task;
+  const updateResult = await request(baseUrl, `/api/tasks/${task.id}`, {
+    method: "PATCH",
+    body: { version: task.version, title: "Still attributed" },
+  });
+  assert.equal(updateResult.body.task.threadId, "thread-original");
+
+  const repeatedUpdate = await request(baseUrl, `/api/tasks/${task.id}`, {
+    method: "PATCH",
+    body: { version: updateResult.body.task.version, title: "Still attributed again", threadId: "thread-original" },
+  });
+  assert.equal(repeatedUpdate.body.task.threadId, "thread-original");
+
+  const commentCreate = await request(baseUrl, `/api/tasks/${task.id}/comments`, {
+    method: "POST",
+    body: { body: "Attributed comment", threadId: "thread-comment" },
+  });
+  const comment = commentCreate.body.comment;
+  const commentUpdate = await request(baseUrl, `/api/comments/${comment.id}`, {
+    method: "PATCH",
+    body: { version: comment.version, body: "Edited from the UI" },
+  });
+  assert.equal(commentUpdate.body.comment.threadId, "thread-comment");
+  const taskAfterComment = await request(baseUrl, `/api/tasks/${task.id}`);
+  assert.equal(taskAfterComment.body.task.threadId, "thread-original");
+});
+
+test("stale updates receive a version conflict", async () => {
+  const baseUrl = await startServer();
+  const createResult = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: { title: "Concurrent edit" },
+  });
+  const task = createResult.body.task;
+
+  const firstUpdate = await request(baseUrl, `/api/tasks/${task.id}`, {
+    method: "PATCH",
+    body: { version: task.version, title: "First editor" },
+  });
+  assert.equal(firstUpdate.response.status, 200);
+
+  const staleUpdate = await request(baseUrl, `/api/tasks/${task.id}/move`, {
+    method: "POST",
+    body: { version: task.version, status: "done", sortOrder: 1 },
+  });
+  assert.equal(staleUpdate.response.status, 409);
+  assert.equal(staleUpdate.body.error.code, "VERSION_CONFLICT");
+  assert.deepEqual(staleUpdate.body.error.details, {
+    expectedVersion: 1,
+    actualVersion: 2,
+  });
+});
+
+test("issue comments can be created, edited, listed, and deleted", async () => {
+  const baseUrl = await startServer();
+  const createTaskResult = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: { title: "Discuss me" },
+  });
+  const task = createTaskResult.body.task;
+
+  const emptyList = await request(baseUrl, `/api/tasks/${task.id}/comments`);
+  assert.equal(emptyList.response.status, 200);
+  assert.deepEqual(emptyList.body.comments, []);
+
+  const createResult = await request(baseUrl, `/api/tasks/${task.id}/comments`, {
+    method: "POST",
+    body: { body: "First comment", threadId: "thread-comment-create" },
+  });
+  assert.equal(createResult.response.status, 201);
+  const comment = createResult.body.comment;
+  assert.equal(comment.taskId, task.id);
+  assert.equal(comment.body, "First comment");
+  assert.equal(comment.threadId, "thread-comment-create");
+  assert.deepEqual(comment.attachments, []);
+  assert.equal(comment.authorType, "user");
+  assert.equal(comment.authorId, "local-user");
+  assert.equal(comment.authorName, "本地用户");
+  assert.equal(comment.version, 1);
+
+  const listResult = await request(baseUrl, `/api/tasks/${task.id}/comments`);
+  assert.deepEqual(listResult.body.comments.map((item) => item.id), [comment.id]);
+
+  const updateResult = await request(baseUrl, `/api/comments/${comment.id}`, {
+    method: "PATCH",
+    body: { version: comment.version, body: "Edited comment", threadId: "thread-comment-update" },
+  });
+  assert.equal(updateResult.response.status, 200);
+  const updated = updateResult.body.comment;
+  assert.equal(updated.body, "Edited comment");
+  assert.equal(updated.threadId, "thread-comment-update");
+  assert.equal(updated.version, 2);
+
+  const taskAfterUpdate = await request(baseUrl, `/api/tasks/${task.id}`);
+  assert.equal(taskAfterUpdate.body.task.threadId, null);
+
+  const staleUpdate = await request(baseUrl, `/api/comments/${comment.id}`, {
+    method: "PATCH",
+    body: { version: comment.version, body: "Stale edit" },
+  });
+  assert.equal(staleUpdate.response.status, 409);
+  assert.equal(staleUpdate.body.error.code, "VERSION_CONFLICT");
+
+  const deleteResult = await request(baseUrl, `/api/comments/${comment.id}`, {
+    method: "DELETE",
+    body: { version: updated.version, threadId: "thread-comment-delete" },
+  });
+  assert.equal(deleteResult.response.status, 204);
+
+  const finalList = await request(baseUrl, `/api/tasks/${task.id}/comments`);
+  assert.deepEqual(finalList.body.comments, []);
+  const taskAfterDelete = await request(baseUrl, `/api/tasks/${task.id}`);
+  assert.equal(taskAfterDelete.body.task.threadId, null);
+});
+
+test("taskctl issue creation and comments use the Codex Agent identity", async () => {
+  const baseUrl = await startServer();
+  const agentHeaders = {
+    "x-taskboard-client": "taskctl",
+    "x-taskboard-user-id": "spoofed-user",
+    "x-taskboard-user-name": "Spoofed User",
+    "x-taskboard-user-avatar": "https://example.com/spoofed.png",
+  };
+  const createTaskResult = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    headers: agentHeaders,
+    body: { title: "Created by Codex", threadId: "thread-agent-create" },
+  });
+  assert.equal(createTaskResult.response.status, 201);
+  const task = createTaskResult.body.task;
+  assert.equal(task.creatorType, "agent");
+  assert.equal(task.creatorId, "codex-agent");
+  assert.equal(task.creatorName, "Codex Agent");
+  assert.equal(task.creatorAvatarUrl, null);
+  assert.deepEqual(task.assignee, {
+    type: "agent",
+    id: "codex-agent",
+    name: "Codex Agent",
+    avatarUrl: null,
+  });
+
+  const createCommentResult = await request(baseUrl, `/api/tasks/${task.id}/comments`, {
+    method: "POST",
+    headers: agentHeaders,
+    body: { body: "Implemented by Codex", threadId: "thread-agent-comment" },
+  });
+  assert.equal(createCommentResult.response.status, 201);
+  const comment = createCommentResult.body.comment;
+  assert.equal(comment.authorType, "agent");
+  assert.equal(comment.authorId, "codex-agent");
+  assert.equal(comment.authorName, "Codex Agent");
+  assert.equal(comment.authorAvatarUrl, null);
+  assert.equal(comment.threadId, "thread-agent-comment");
+});
+
+test("Codex-hosted user mutations persist the current account identity and avatar", async () => {
+  const baseUrl = await startServer();
+  const userHeaders = {
+    "x-taskboard-user-id": "test-user",
+    "x-taskboard-user-name": "Test%20User",
+    "x-taskboard-user-avatar": "https://example.com/test-user.png",
+  };
+  const createTaskResult = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    headers: userHeaders,
+    body: { title: "Created in Codex UI" },
+  });
+  assert.equal(createTaskResult.response.status, 201);
+  const task = createTaskResult.body.task;
+  assert.equal(task.creatorType, "user");
+  assert.equal(task.creatorId, "test-user");
+  assert.equal(task.creatorName, "Test User");
+  assert.equal(task.creatorAvatarUrl, "https://example.com/test-user.png");
+  assert.deepEqual(task.assignee, {
+    type: "user",
+    id: "test-user",
+    name: "Test User",
+    avatarUrl: "https://example.com/test-user.png",
+  });
+
+  const assignedToCodexResult = await request(baseUrl, `/api/tasks/${task.id}`, {
+    method: "PATCH",
+    headers: userHeaders,
+    body: {
+      version: task.version,
+      assigneeTarget: "codex-agent",
+    },
+  });
+  assert.equal(assignedToCodexResult.response.status, 200);
+  assert.deepEqual(assignedToCodexResult.body.task.assignee, {
+    type: "agent",
+    id: "codex-agent",
+    name: "Codex Agent",
+    avatarUrl: null,
+  });
+
+  const assignedToUserResult = await request(baseUrl, `/api/tasks/${task.id}`, {
+    method: "PATCH",
+    headers: userHeaders,
+    body: {
+      version: assignedToCodexResult.body.task.version,
+      assigneeTarget: "current-user",
+    },
+  });
+  assert.equal(assignedToUserResult.response.status, 200);
+  assert.deepEqual(assignedToUserResult.body.task.assignee, {
+    type: "user",
+    id: "test-user",
+    name: "Test User",
+    avatarUrl: "https://example.com/test-user.png",
+  });
+
+  const updatedByCodexResult = await request(baseUrl, `/api/tasks/${task.id}`, {
+    method: "PATCH",
+    headers: { "x-taskboard-client": "taskctl" },
+    body: {
+      version: assignedToUserResult.body.task.version,
+      title: "Updated through taskctl",
+    },
+  });
+  assert.equal(updatedByCodexResult.response.status, 200);
+  assert.deepEqual(updatedByCodexResult.body.task.assignee, assignedToUserResult.body.task.assignee);
+
+  const invalidAssigneeResult = await request(baseUrl, `/api/tasks/${task.id}`, {
+    method: "PATCH",
+    headers: userHeaders,
+    body: {
+      version: updatedByCodexResult.body.task.version,
+      assigneeTarget: { type: "agent" },
+    },
+  });
+  assert.equal(invalidAssigneeResult.response.status, 400);
+  assert.equal(invalidAssigneeResult.body.error.code, "INVALID_FIELD");
+
+  const createCommentResult = await request(baseUrl, `/api/tasks/${task.id}/comments`, {
+    method: "POST",
+    headers: userHeaders,
+    body: { body: "Commented in Codex UI" },
+  });
+  assert.equal(createCommentResult.response.status, 201);
+  const comment = createCommentResult.body.comment;
+  assert.equal(comment.authorType, "user");
+  assert.equal(comment.authorId, "test-user");
+  assert.equal(comment.authorName, "Test User");
+  assert.equal(comment.authorAvatarUrl, "https://example.com/test-user.png");
+});
+
+test("issue attachments can be uploaded, listed, opened, downloaded, and deleted", async () => {
+  const baseUrl = await startServer();
+  const createTaskResult = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: { title: "Attach files" },
+  });
+  const task = createTaskResult.body.task;
+
+  const emptyList = await request(baseUrl, `/api/tasks/${task.id}/attachments`);
+  assert.equal(emptyList.response.status, 200);
+  assert.deepEqual(emptyList.body.attachments, []);
+
+  const contents = "attachment contents\n";
+  const uploadResult = await request(baseUrl, `/api/tasks/${task.id}/attachments`, {
+    method: "POST",
+    headers: {
+      "content-type": "text/plain; charset=utf-8",
+      "x-taskboard-filename": encodeURIComponent("设计说明.txt"),
+    },
+    body: contents,
+  });
+  assert.equal(uploadResult.response.status, 201);
+  const attachment = uploadResult.body.attachment;
+  assert.equal(attachment.taskId, task.id);
+  assert.equal(attachment.commentId, null);
+  assert.equal(attachment.filename, "设计说明.txt");
+  assert.equal(attachment.contentType, "text/plain");
+  assert.equal(attachment.size, Buffer.byteLength(contents));
+  assert.match(attachment.createdAt, /^\d{4}-\d{2}-\d{2}T/);
+
+  const listResult = await request(baseUrl, `/api/tasks/${task.id}/attachments`);
+  assert.deepEqual(listResult.body.attachments, [attachment]);
+
+  const contentResponse = await fetch(`${baseUrl}/api/attachments/${attachment.id}/content`);
+  assert.equal(contentResponse.status, 200);
+  assert.equal(contentResponse.headers.get("content-type"), "text/plain");
+  assert.match(contentResponse.headers.get("content-disposition"), /^inline; filename\*=UTF-8''/);
+  assert.equal(await contentResponse.text(), contents);
+
+  const headResponse = await fetch(`${baseUrl}/api/attachments/${attachment.id}/content`, { method: "HEAD" });
+  assert.equal(headResponse.status, 200);
+  assert.equal(Number(headResponse.headers.get("content-length")), Buffer.byteLength(contents));
+  assert.equal(await headResponse.text(), "");
+
+  const htmlUpload = await request(baseUrl, `/api/tasks/${task.id}/attachments`, {
+    method: "POST",
+    headers: {
+      "content-type": "text/html",
+      "x-taskboard-filename": encodeURIComponent("page.html"),
+    },
+    body: "<script>document.body.textContent = 'unsafe'</script>",
+  });
+  const htmlAttachment = htmlUpload.body.attachment;
+  const htmlContent = await fetch(`${baseUrl}/api/attachments/${htmlAttachment.id}/content`);
+  assert.equal(htmlContent.headers.get("content-type"), "application/octet-stream");
+  assert.match(htmlContent.headers.get("content-disposition"), /^attachment;/);
+  assert.equal(htmlContent.headers.get("content-security-policy"), "sandbox; default-src 'none'");
+  const htmlDelete = await request(baseUrl, `/api/attachments/${htmlAttachment.id}`, { method: "DELETE" });
+  assert.equal(htmlDelete.response.status, 204);
+
+  const deleteResult = await request(baseUrl, `/api/attachments/${attachment.id}`, { method: "DELETE" });
+  assert.equal(deleteResult.response.status, 204);
+  const finalList = await request(baseUrl, `/api/tasks/${task.id}/attachments`);
+  assert.deepEqual(finalList.body.attachments, []);
+  const deletedContent = await request(baseUrl, `/api/attachments/${attachment.id}/content`);
+  assert.equal(deletedContent.response.status, 404);
+  assert.equal(deletedContent.body.error.code, "ATTACHMENT_NOT_FOUND");
+});
+
+test("comments support attachments and deleting a comment removes its files", async () => {
+  const baseUrl = await startServer();
+  const createTaskResult = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: { title: "Comment files" },
+  });
+  const task = createTaskResult.body.task;
+  const createCommentResult = await request(baseUrl, `/api/tasks/${task.id}/comments`, {
+    method: "POST",
+    body: { body: "", threadId: "thread-attachment" },
+  });
+  assert.equal(createCommentResult.response.status, 201);
+  const comment = createCommentResult.body.comment;
+  assert.equal(comment.body, "");
+
+  const contents = "comment attachment\n";
+  const uploadResult = await request(baseUrl, `/api/comments/${comment.id}/attachments`, {
+    method: "POST",
+    headers: {
+      "content-type": "text/plain",
+      "x-taskboard-filename": encodeURIComponent("comment.txt"),
+    },
+    body: contents,
+  });
+  assert.equal(uploadResult.response.status, 201);
+  const attachment = uploadResult.body.attachment;
+  assert.equal(attachment.taskId, task.id);
+  assert.equal(attachment.commentId, comment.id);
+
+  const attachmentList = await request(baseUrl, `/api/comments/${comment.id}/attachments`);
+  assert.deepEqual(attachmentList.body.attachments, [attachment]);
+  const commentList = await request(baseUrl, `/api/tasks/${task.id}/comments`);
+  assert.deepEqual(commentList.body.comments[0].attachments, [attachment]);
+  const taskAttachmentList = await request(baseUrl, `/api/tasks/${task.id}/attachments`);
+  assert.deepEqual(taskAttachmentList.body.attachments, []);
+
+  const storagePath = path.join(runningApps.at(-1).app.options.attachmentsDirectory, attachment.id);
+  await access(storagePath);
+  const deleteResult = await request(baseUrl, `/api/comments/${comment.id}`, {
+    method: "DELETE",
+    body: { version: comment.version, threadId: "thread-delete-comment" },
+  });
+  assert.equal(deleteResult.response.status, 204);
+  await assert.rejects(access(storagePath), { code: "ENOENT" });
+  const deletedContent = await request(baseUrl, `/api/attachments/${attachment.id}/content`);
+  assert.equal(deletedContent.response.status, 404);
+  const taskAfterDelete = await request(baseUrl, `/api/tasks/${task.id}`);
+  assert.equal(taskAfterDelete.body.task.threadId, null);
+});
+
+test("attachment uploads reject unsafe filenames", async () => {
+  const baseUrl = await startServer();
+  const createTaskResult = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: { title: "Validate attachments" },
+  });
+  const task = createTaskResult.body.task;
+
+  const result = await request(baseUrl, `/api/tasks/${task.id}/attachments`, {
+    method: "POST",
+    headers: {
+      "content-type": "text/plain",
+      "x-taskboard-filename": encodeURIComponent("../outside.txt"),
+    },
+    body: "unsafe",
+  });
+  assert.equal(result.response.status, 400);
+  assert.equal(result.body.error.code, "INVALID_FILENAME");
+});
+
+test("request boundaries reject unknown fields and invalid values", async () => {
+  const baseUrl = await startServer();
+
+  const unknown = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: { title: "Invalid", unexpected: true },
+  });
+  assert.equal(unknown.response.status, 400);
+  assert.equal(unknown.body.error.code, "UNKNOWN_FIELD");
+
+  const invalid = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: { title: "Invalid", status: "started" },
+  });
+  assert.equal(invalid.response.status, 400);
+  assert.equal(invalid.body.error.code, "INVALID_FIELD");
+  assert.match(invalid.body.error.message, /in_review/);
+  assert.match(invalid.body.error.message, /blocked/);
+  assert.match(invalid.body.error.message, /canceled/);
+
+  const invalidWorktree = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    body: {
+      title: "Invalid",
+      developmentContext: { type: "worktree", path: "/tmp/bad\0path", branch: null },
+    },
+  });
+  assert.equal(invalidWorktree.response.status, 400);
+  assert.equal(invalidWorktree.body.error.code, "INVALID_FIELD");
+});
+
+test("task changes from one LAN client are broadcast to another client", async () => {
+  const baseUrl = await startServer(undefined, { host: "0.0.0.0" });
+  const authorization = lanAuthorization();
+  const lanHeaders = {
+    authorization,
+  };
+  const eventResponse = await fetch(`${baseUrl}/api/events`, { headers: lanHeaders });
+  assert.equal(eventResponse.status, 200);
+  const reader = eventResponse.body.getReader();
+  const decoder = new TextDecoder();
+  await reader.read();
+
+  const createResult = await request(baseUrl, "/api/tasks", {
+    method: "POST",
+    headers: lanHeaders,
+    body: { title: "Broadcast me" },
+  });
+  assert.equal(createResult.response.status, 201);
+
+  let message = "";
+  while (!message.includes("\n\n")) {
+    const chunk = await reader.read();
+    assert.equal(chunk.done, false);
+    message += decoder.decode(chunk.value, { stream: true });
+  }
+  assert.match(message, /event: task\.created/);
+  const dataLine = message.split("\n").find((line) => line.startsWith("data: "));
+  const event = JSON.parse(dataLine.slice(6));
+  assert.equal(event.type, "task.created");
+  assert.equal(event.task.id, createResult.body.task.id);
+
+  const listResult = await request(baseUrl, "/api/tasks?projectId=local", {
+    headers: lanHeaders,
+  });
+  assert.equal(listResult.response.status, 200);
+  assert.equal(listResult.body.tasks.some((task) => task.id === createResult.body.task.id), true);
+  await reader.cancel();
+});
diff --git a/apps/codex-taskboard/test/taskboard-automation.test.mjs b/apps/codex-taskboard/test/taskboard-automation.test.mjs
new file mode 100644
index 000000000..97a8e05dd
--- /dev/null
+++ b/apps/codex-taskboard/test/taskboard-automation.test.mjs
@@ -0,0 +1,439 @@
+import assert from "node:assert/strict";
+import { test } from "node:test";
+
+import {
+  buildTaskboardAutomationName,
+  buildTaskboardAutomationPrompt,
+  buildTaskboardAutomationSpec,
+  parseTaskboardAutomationHostRequest,
+  reconcileTaskboardAutomation,
+} from "../shared/taskboard-automation.mjs";
+import {
+  AUTOMATION_MODELS,
+  isSupportedModelEffort,
+  withAutomationModel,
+} from "../shared/taskboard-automation-options.mjs";
+
+const baseRequest = {
+  id: "host-request-1",
+  action: "automation",
+  requestId: "iframe-request-1",
+  operation: "ensure-active",
+  taskboardProjectId: "ppt-skill",
+  codexProjectId: "codex-project-123",
+  projectName: "PPT Skill",
+  workspacePath: "/Users/example/Documents/ppt-skill",
+  skillPath: "/Users/example/taskboard/skills/manage-taskboard/SKILL.md",
+  enabledByUser: true,
+  quotaAware: false,
+  intervalMinutes: 5,
+  model: "gpt-5.5",
+  reasoningEffort: "high",
+};
+
+test("the automation model catalog matches Codex and normalizes unsupported efforts", () => {
+  assert.deepEqual(AUTOMATION_MODELS, [
+    {
+      label: "5.6 Sol",
+      slug: "gpt-5.6-sol",
+      defaultEffort: "low",
+      efforts: ["low", "medium", "high", "xhigh", "max", "ultra"],
+    },
+    {
+      label: "5.6 Terra",
+      slug: "gpt-5.6-terra",
+      defaultEffort: "medium",
+      efforts: ["low", "medium", "high", "xhigh", "max", "ultra"],
+    },
+    {
+      label: "5.6 Luna",
+      slug: "gpt-5.6-luna",
+      defaultEffort: "medium",
+      efforts: ["low", "medium", "high", "xhigh", "max"],
+    },
+    {
+      label: "5.5",
+      slug: "gpt-5.5",
+      defaultEffort: "medium",
+      efforts: ["low", "medium", "high", "xhigh"],
+    },
+    {
+      label: "5.4",
+      slug: "gpt-5.4",
+      defaultEffort: "medium",
+      efforts: ["low", "medium", "high", "xhigh"],
+    },
+    {
+      label: "5.4 Mini",
+      slug: "gpt-5.4-mini",
+      defaultEffort: "medium",
+      efforts: ["low", "medium", "high", "xhigh"],
+    },
+  ]);
+
+  const current = {
+    status: "ACTIVE",
+    intervalMinutes: 5,
+    model: "gpt-5.6-sol",
+    reasoningEffort: "ultra",
+  };
+  assert.deepEqual(withAutomationModel(current, "gpt-5.6-terra"), {
+    ...current,
+    model: "gpt-5.6-terra",
+  });
+  assert.deepEqual(withAutomationModel(current, "gpt-5.6-luna"), {
+    ...current,
+    model: "gpt-5.6-luna",
+    reasoningEffort: "medium",
+  });
+});
+
+test("the automation host request accepts only whitelisted project automation options", () => {
+  assert.deepEqual(parseTaskboardAutomationHostRequest(baseRequest), baseRequest);
+  assert.equal(
+    parseTaskboardAutomationHostRequest({ ...baseRequest, operation: "delete" }),
+    null,
+  );
+  assert.equal(
+    parseTaskboardAutomationHostRequest({ ...baseRequest, method: "automation-delete" }),
+    null,
+  );
+  assert.equal(
+    parseTaskboardAutomationHostRequest({ ...baseRequest, prompt: "arbitrary" }),
+    null,
+  );
+  assert.deepEqual(
+    parseTaskboardAutomationHostRequest({ ...baseRequest, intervalMinutes: 10 }),
+    { ...baseRequest, intervalMinutes: 10 },
+  );
+  assert.equal(
+    parseTaskboardAutomationHostRequest({ ...baseRequest, intervalMinutes: 7 }),
+    null,
+  );
+  assert.equal(
+    parseTaskboardAutomationHostRequest({
+      ...baseRequest,
+      model: "gpt-5.6-sol",
+      reasoningEffort: "ultra",
+    })?.reasoningEffort,
+    "ultra",
+  );
+  assert.equal(
+    parseTaskboardAutomationHostRequest({ ...baseRequest, model: "gpt-future" }),
+    null,
+  );
+  assert.equal(
+    parseTaskboardAutomationHostRequest({ ...baseRequest, reasoningEffort: "xhigh" })?.reasoningEffort,
+    "xhigh",
+  );
+  assert.equal(
+    parseTaskboardAutomationHostRequest({
+      ...baseRequest,
+      model: "gpt-5.4",
+      reasoningEffort: "ultra",
+    }),
+    null,
+  );
+  const allEfforts = ["low", "medium", "high", "xhigh", "max", "ultra"];
+  for (const intervalMinutes of [5, 10, 15, 30, 60]) {
+    for (const model of AUTOMATION_MODELS) {
+      for (const effort of allEfforts) {
+        assert.equal(
+          parseTaskboardAutomationHostRequest({
+            ...baseRequest,
+            intervalMinutes,
+            model: model.slug,
+            reasoningEffort: effort,
+          }) !== null,
+          model.efforts.includes(effort),
+          `${intervalMinutes}m/${model.slug}/${effort}`,
+        );
+      }
+    }
+  }
+  assert.equal(isSupportedModelEffort("gpt-5.6-luna", "max"), true);
+  assert.equal(isSupportedModelEffort("gpt-5.6-luna", "ultra"), false);
+  assert.equal(
+    parseTaskboardAutomationHostRequest({ ...baseRequest, workspacePath: "relative/path" }),
+    null,
+  );
+});
+
+test("the stable name and generated prompt are project-scoped and encode the claim protocol", () => {
+  assert.equal(
+    buildTaskboardAutomationName(baseRequest),
+    "Taskboard 自动认领 · ppt-skill",
+  );
+
+  const prompt = buildTaskboardAutomationPrompt(baseRequest);
+  assert.match(
+    prompt,
+    /\[\$manage-taskboard\]\(\/Users\/example\/taskboard\/skills\/manage-taskboard\/SKILL\.md\)/,
+  );
+  assert.match(prompt, /\[\$manage-taskboard\]\([^)]*\) e-taskboard /);
+  assert.match(prompt, /PPT Skill/);
+  assert.match(prompt, /每 5 分钟检查/);
+  assert.match(prompt, /ppt-skill/);
+  assert.match(prompt, /\/Users\/example\/Documents\/ppt-skill/);
+  assert.match(prompt, /每次仅处理一个 todo/);
+  assert.match(prompt, /issue get/);
+  assert.match(prompt, /comment list/);
+  assert.match(prompt, /最新 version/);
+  assert.match(prompt, /in_progress/);
+  assert.match(prompt, /版本冲突.*跳过/);
+  assert.match(prompt, /关键改动、验证结果、执行结果和剩余风险/);
+  assert.match(prompt, /in_review/);
+  assert.match(prompt, /已绑定.*branch.*worktree/);
+});
+
+test("the generated cron spec uses the selected whitelisted local Codex options", () => {
+  assert.deepEqual(buildTaskboardAutomationSpec(baseRequest), {
+    kind: "cron",
+    name: "Taskboard 自动认领 · ppt-skill",
+    prompt: buildTaskboardAutomationPrompt(baseRequest),
+    projectId: "codex-project-123",
+    executionEnvironment: "local",
+    localEnvironmentConfigPath: null,
+    model: "gpt-5.5",
+    reasoningEffort: "high",
+    rrule: "RRULE:FREQ=MINUTELY;INTERVAL=5",
+  });
+  assert.deepEqual(buildTaskboardAutomationSpec({
+    ...baseRequest,
+    intervalMinutes: 30,
+    model: "gpt-5.4",
+    reasoningEffort: "medium",
+  }), {
+    ...buildTaskboardAutomationSpec(baseRequest),
+    prompt: buildTaskboardAutomationPrompt({ ...baseRequest, intervalMinutes: 30 }),
+    model: "gpt-5.4",
+    reasoningEffort: "medium",
+    rrule: "RRULE:FREQ=MINUTELY;INTERVAL=30",
+  });
+});
+
+test("ensure-active updates a matching automation by id with a complete active spec", async () => {
+  const existing = {
+    id: "automation-1",
+    status: "PAUSED",
+    kind: "cron",
+    name: "Taskboard 自动认领 · ppt-skill",
+    prompt: "old prompt",
+    projectId: "old-project",
+    executionEnvironment: "local",
+    localEnvironmentConfigPath: null,
+    model: "gpt-5.5",
+    reasoningEffort: "medium",
+    rrule: "FREQ=HOURLY",
+    createdAt: "2026-07-25T00:00:00.000Z",
+    internalRevision: 4,
+  };
+  const calls = [];
+  const response = await reconcileTaskboardAutomation(
+    { ...baseRequest, automationId: "automation-1" },
+    async (method, params) => {
+      calls.push({ method, params });
+      if (method === "list-automations") return { items: [existing] };
+      return { item: params };
+    },
+  );
+
+  const spec = buildTaskboardAutomationSpec(baseRequest);
+  assert.deepEqual(calls, [
+    { method: "list-automations", params: {} },
+    {
+      method: "automation-update",
+      params: {
+        ...spec,
+        id: "automation-1",
+        status: "ACTIVE",
+      },
+    },
+  ]);
+  assert.deepEqual(response, {
+    item: { ...spec, id: "automation-1", status: "ACTIVE" },
+  });
+});
+
+test("ensure-active is idempotent when the listed automation already matches", async () => {
+  const existing = {
+    id: "automation-1",
+    status: "ACTIVE",
+    ...buildTaskboardAutomationSpec(baseRequest),
+    createdAt: "2026-07-25T00:00:00.000Z",
+  };
+  const calls = [];
+  const response = await reconcileTaskboardAutomation(
+    { ...baseRequest, automationId: "automation-1" },
+    async (method, params) => {
+      calls.push({ method, params });
+      return { items: [existing] };
+    },
+  );
+
+  assert.deepEqual(calls, [{ method: "list-automations", params: {} }]);
+  assert.deepEqual(response, { item: existing });
+});
+
+test("a foreign automation id never grants control outside the project", async () => {
+  const foreign = {
+    id: "foreign-automation",
+    status: "ACTIVE",
+    ...buildTaskboardAutomationSpec({
+      ...baseRequest,
+      taskboardProjectId: "another-project",
+    }),
+  };
+  const ensureCalls = [];
+  await reconcileTaskboardAutomation(
+    { ...baseRequest, automationId: foreign.id },
+    async (method, params) => {
+      ensureCalls.push({ method, params });
+      if (method === "list-automations") return { items: [foreign] };
+      return { item: params };
+    },
+  );
+  assert.deepEqual(ensureCalls, [
+    { method: "list-automations", params: {} },
+    { method: "automation-create", params: buildTaskboardAutomationSpec(baseRequest) },
+  ]);
+
+  const pauseCalls = [];
+  const paused = await reconcileTaskboardAutomation(
+    { ...baseRequest, operation: "pause", automationId: foreign.id },
+    async (method, params) => {
+      pauseCalls.push({ method, params });
+      return { items: [foreign] };
+    },
+  );
+  assert.deepEqual(pauseCalls, [{ method: "list-automations", params: {} }]);
+  assert.deepEqual(paused, { error: "not-found" });
+});
+
+test("ensure-active falls back to the stable name and otherwise creates", async () => {
+  const matching = {
+    id: "automation-by-name",
+    status: "PAUSED",
+    ...buildTaskboardAutomationSpec(baseRequest),
+  };
+  const updateCalls = [];
+  await reconcileTaskboardAutomation(baseRequest, async (method, params) => {
+    updateCalls.push({ method, params });
+    if (method === "list-automations") return { items: [matching] };
+    return { item: params };
+  });
+  assert.equal(updateCalls[1].method, "automation-update");
+  assert.equal(updateCalls[1].params.id, "automation-by-name");
+
+  const createCalls = [];
+  const created = await reconcileTaskboardAutomation(baseRequest, async (method, params) => {
+    createCalls.push({ method, params });
+    if (method === "list-automations") return { items: [] };
+    return { item: { id: "created-1", status: "ACTIVE", ...params } };
+  });
+  assert.deepEqual(createCalls, [
+    { method: "list-automations", params: {} },
+    { method: "automation-create", params: buildTaskboardAutomationSpec(baseRequest) },
+  ]);
+  assert.equal(created.item.id, "created-1");
+});
+
+test("pause never creates and list returns only sanitized matching project automations", async () => {
+  const matching = {
+    id: "matching",
+    status: "ACTIVE",
+    ...buildTaskboardAutomationSpec(baseRequest),
+    untrustedListField: "must not be echoed into an update",
+  };
+  const unrelated = {
+    id: "unrelated",
+    status: "ACTIVE",
+    ...buildTaskboardAutomationSpec({
+      ...baseRequest,
+      taskboardProjectId: "another-project",
+    }),
+  };
+
+  const pauseCalls = [];
+  const paused = await reconcileTaskboardAutomation(
+    { ...baseRequest, operation: "pause" },
+    async (method, params) => {
+      pauseCalls.push({ method, params });
+      if (method === "list-automations") return { items: [unrelated, matching] };
+      return { item: params };
+    },
+  );
+  assert.deepEqual(pauseCalls, [
+    { method: "list-automations", params: {} },
+    {
+      method: "automation-update",
+      params: {
+        ...buildTaskboardAutomationSpec(baseRequest),
+        id: "matching",
+        status: "PAUSED",
+      },
+    },
+  ]);
+  assert.deepEqual(paused, {
+    item: {
+      ...buildTaskboardAutomationSpec(baseRequest),
+      id: "matching",
+      status: "PAUSED",
+    },
+  });
+
+  const notFoundCalls = [];
+  const notFound = await reconcileTaskboardAutomation(
+    { ...baseRequest, operation: "pause", taskboardProjectId: "missing" },
+    async (method, params) => {
+      notFoundCalls.push({ method, params });
+      return { items: [matching, unrelated] };
+    },
+  );
+  assert.deepEqual(notFoundCalls, [{ method: "list-automations", params: {} }]);
+  assert.deepEqual(notFound, { error: "not-found" });
+
+  const listed = await reconcileTaskboardAutomation(
+    { ...baseRequest, operation: "list" },
+    async () => ({ items: [unrelated, matching] }),
+  );
+  assert.deepEqual(listed, {
+    items: [{
+      id: "matching",
+      status: "ACTIVE",
+      model: "gpt-5.5",
+      reasoningEffort: "high",
+      rrule: "RRULE:FREQ=MINUTELY;INTERVAL=5",
+    }],
+  });
+
+  const invalidPair = {
+    ...matching,
+    id: "invalid-pair",
+    model: "gpt-5.4",
+    reasoningEffort: "ultra",
+  };
+  const invalidListed = await reconcileTaskboardAutomation(
+    { ...baseRequest, operation: "list" },
+    async () => ({ items: [invalidPair] }),
+  );
+  assert.deepEqual(invalidListed, { items: [] });
+});
+
+test("pause is idempotent for an already paused matching automation", async () => {
+  const matching = {
+    id: "matching",
+    status: "PAUSED",
+    ...buildTaskboardAutomationSpec(baseRequest),
+  };
+  const calls = [];
+  const response = await reconcileTaskboardAutomation(
+    { ...baseRequest, operation: "pause" },
+    async (method, params) => {
+      calls.push({ method, params });
+      return { items: [matching] };
+    },
+  );
+  assert.deepEqual(calls, [{ method: "list-automations", params: {} }]);
+  assert.deepEqual(response, { item: matching });
+});
diff --git a/apps/codex-taskboard/test/workflow-condition-branches.test.mjs b/apps/codex-taskboard/test/workflow-condition-branches.test.mjs
new file mode 100644
index 000000000..183ac7fc5
--- /dev/null
+++ b/apps/codex-taskboard/test/workflow-condition-branches.test.mjs
@@ -0,0 +1,115 @@
+import assert from "node:assert/strict";
+import test from "node:test";
+
+import {
+  normalizeWorkflowConditionBranches,
+  workflowConditionEdges,
+} from "../shared/workflow-sequence.mjs";
+import {
+  migrateWorkflowSnapshotV1,
+} from "../shared/workflow-control-flow.mjs";
+
+const node = (id, kind, x = 0, y = 0) => ({
+  id,
+  position: { x, y },
+  data: { kind },
+});
+
+test("legacy condition edges migrate to two branches followed by one shared continuation", () => {
+  const nodes = [
+    node("trigger", "issue-trigger"),
+    node("condition", "condition", 0, 100),
+    node("true-1", "skill", -180, 240),
+    node("true-2", "mcp", -180, 380),
+    node("false-1", "issue-update", 180, 240),
+    node("shared-tail", "codex-review", 0, 560),
+  ];
+  const edges = workflowConditionEdges(
+    ["trigger", "condition"],
+    "condition",
+    { true: ["true-1", "true-2"], false: ["false-1"] },
+  );
+  edges.push({
+    id: "legacy-shared-tail",
+    source: "condition",
+    target: "shared-tail",
+  });
+  const migrated = migrateWorkflowSnapshotV1(nodes, edges);
+
+  assert.deepEqual(migrated.flow.root.items.map((item) => item.nodeId), [
+    "trigger",
+    "condition",
+    "shared-tail",
+  ]);
+  assert.deepEqual(
+    migrated.flow.root.items[1].branches.true.items.map((item) => item.nodeId),
+    ["true-1", "true-2"],
+  );
+  assert.deepEqual(
+    migrated.flow.root.items[1].branches.false.items.map((item) => item.nodeId),
+    ["false-1"],
+  );
+});
+
+test("legacy linear steps after a condition migrate to the true path in order", () => {
+  const nodes = [
+    node("trigger", "issue-trigger"),
+    node("condition", "condition", 0, 100),
+    node("first", "skill", 0, 240),
+    node("second", "issue-update", 0, 380),
+  ];
+  const graph = normalizeWorkflowConditionBranches(nodes, [
+    { id: "a", source: "trigger", target: "condition" },
+    { id: "b", source: "condition", target: "first" },
+    { id: "c", source: "first", target: "second" },
+  ]);
+
+  assert.deepEqual(graph.trunkStepIds, ["trigger", "condition"]);
+  assert.deepEqual(graph.branches.true, ["first", "second"]);
+  assert.deepEqual(graph.branches.false, []);
+  assert.equal(graph.migrated, true);
+});
+
+test("empty condition paths remain distinct and adding to one path cannot reorder the other", () => {
+  const edges = workflowConditionEdges(
+    ["trigger", "condition"],
+    "condition",
+    { true: ["true-1", "true-2"], false: ["false-1", "false-2"] },
+  );
+  assert.deepEqual(
+    edges
+      .filter((edge) => edge.data?.conditionOutcome === "true")
+      .map((edge) => [edge.source, edge.target]),
+    [["condition", "true-1"], ["true-1", "true-2"]],
+  );
+  assert.deepEqual(
+    edges
+      .filter((edge) => edge.data?.conditionOutcome === "false")
+      .map((edge) => [edge.source, edge.target]),
+    [["condition", "false-1"], ["false-1", "false-2"]],
+  );
+});
+
+test("condition branch membership and order survive workspace JSON persistence", () => {
+  const nodes = [
+    node("trigger", "issue-trigger"),
+    node("condition", "condition", 0, 100),
+    node("accepted", "skill", -180, 240),
+    node("rejected", "issue-update", 180, 240),
+  ];
+  const persisted = JSON.parse(JSON.stringify({
+    nodes,
+    edges: workflowConditionEdges(
+      ["trigger", "condition"],
+      "condition",
+      { true: ["accepted"], false: ["rejected"] },
+    ),
+  }));
+  const graph = normalizeWorkflowConditionBranches(persisted.nodes, persisted.edges);
+
+  assert.deepEqual(graph.trunkStepIds, ["trigger", "condition"]);
+  assert.deepEqual(graph.branches, {
+    true: ["accepted"],
+    false: ["rejected"],
+  });
+});
diff --git a/apps/codex-taskboard/test/workflow-condition-layout.test.mjs b/apps/codex-taskboard/test/workflow-condition-layout.test.mjs
new file mode 100644
index 000000000..13571ee71
--- /dev/null
+++ b/apps/codex-taskboard/test/workflow-condition-layout.test.mjs
@@ -0,0 +1,64 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import test from "node:test";
+
+const board = await readFile(new URL("../web/src/components/WorkflowBoard.tsx", import.meta.url), "utf8");
+const edge = await readFile(new URL("../web/src/components/WorkflowInsertEdge.tsx", import.meta.url), "utf8");
+const node = await readFile(new URL("../web/src/components/WorkflowNode.tsx", import.meta.url), "utf8");
+const styles = await readFile(new URL("../web/src/components/workflow.css", import.meta.url), "utf8");
+const control = await readFile(new URL("../shared/workflow-control-flow.mjs", import.meta.url), "utf8");
+
+test("condition branch starts use a shared explicit orthogonal trunk and rail", () => {
+  assert.doesNotMatch(edge, /getSmoothStepPath/);
+  assert.match(edge, /data\?\.points/);
+  assert.match(
+    control,
+    /const splitId = `__flow-split-\$\{conditionId\}`[\s\S]*?addEdge\([\s\S]*?conditionId,[\s\S]*?splitId/,
+  );
+  assert.match(
+    control,
+    /addEdge\([\s\S]*?splitId,[\s\S]*?branchInput\.id,[\s\S]*?branchStart: true/,
+  );
+});
+
+test("condition path labels live on the branch edge instead of stretching inside the card", () => {
+  assert.doesNotMatch(node, /workflow-condition-outcomes/);
+  assert.match(node, /data\.kind\.startsWith\("flow-"\)/);
+  assert.match(
+    edge,
+    /data\?\.branchStart[\s\S]*?workflow-condition-branch-label[\s\S]*?成立[\s\S]*?不成立/,
+  );
+  assert.match(
+    styles,
+    /\.workflow-condition-branch-label \{[\s\S]*?width: max-content;[\s\S]*?background: var\(--text-primary\)/,
+  );
+});
+
+test("derived split, empty and merge anchors never render duplicate add-step buttons", () => {
+  const anchors = node.slice(
+    node.indexOf('if (data.kind.startsWith("flow-"))'),
+    node.indexOf("if (parentId)"),
+  );
+  assert.match(anchors, /workflow-flow-anchor[\s\S]*?<Handle/);
+  assert.doesNotMatch(anchors, /<button|添加步骤|onAddBranch/);
+  assert.match(
+    board,
+    /layout\.virtualNodes\.map[\s\S]*?style: \{ width: END_STEP_HEIGHT, height: END_STEP_HEIGHT \}/,
+  );
+  assert.doesNotMatch(styles, /\.workflow-flow-anchor > button/);
+});
+
+test("empty condition anchors and populated first steps share one branch top", () => {
+  assert.match(
+    control,
+    /const branchTop = nodeBottom \+ BRANCH_TOP_OFFSET/,
+  );
+  assert.match(
+    control,
+    /placeSequence\(branch, branchRef, branchX, branchTop\)/,
+  );
+  assert.match(
+    control,
+    /addVirtual\(emptyId, "flow-empty", branchX, branchTop\)/,
+  );
+});
diff --git a/apps/codex-taskboard/test/workflow-control-flow-layout.test.mjs b/apps/codex-taskboard/test/workflow-control-flow-layout.test.mjs
new file mode 100644
index 000000000..670120938
--- /dev/null
+++ b/apps/codex-taskboard/test/workflow-control-flow-layout.test.mjs
@@ -0,0 +1,223 @@
+import assert from "node:assert/strict";
+import test from "node:test";
+
+const loadControlFlow = () => import("../shared/workflow-control-flow.mjs");
+
+const step = (nodeId) => ({ type: "step", nodeId });
+const sequence = (...items) => ({ items });
+const condition = (nodeId, trueItems = [], falseItems = []) => ({
+  type: "condition",
+  nodeId,
+  branches: {
+    true: sequence(...trueItems),
+    false: sequence(...falseItems),
+  },
+});
+const node = (id, kind = "skill", height = 138) => ({
+  id,
+  data: { kind },
+  style: { height },
+});
+const insertionKey = (insertion) => JSON.stringify(insertion);
+
+function assertOrthogonalMonotone(points) {
+  for (let index = 1; index < points.length; index += 1) {
+    const previous = points[index - 1];
+    const current = points[index];
+    assert.ok(previous.x === current.x || previous.y === current.y, "edge segment must be orthogonal");
+    assert.ok(current.y >= previous.y, "edge must never turn upward");
+  }
+}
+
+test("empty and unequal branches merge below the taller side with one add point per insertion", async () => {
+  const { deriveWorkflowLayout } = await loadControlFlow();
+  const flow = {
+    version: 2,
+    root: sequence(
+      step("trigger"),
+      condition("outer", [step("tall-a"), step("tall-b")], []),
+      step("shared"),
+    ),
+  };
+  const layout = deriveWorkflowLayout(flow, [
+    node("trigger", "issue-trigger"),
+    node("outer", "condition"),
+    node("tall-a"),
+    node("tall-b", "skill", 190),
+    node("shared"),
+  ]);
+  const outer = layout.conditions.outer;
+  const shared = layout.positions.shared;
+
+  assert.ok(outer.mergeY > outer.branchBounds.true.bottom);
+  assert.ok(outer.mergeY > outer.branchBounds.false.bottom);
+  assert.ok(shared.y > outer.mergeY);
+  assert.equal(outer.branchBounds.false.top, outer.branchBounds.true.top);
+  const keys = layout.insertionPoints.map((entry) => insertionKey(entry.insertion));
+  assert.equal(new Set(keys).size, keys.length);
+  assert.equal(
+    keys.filter((key) => key === insertionKey({
+      sequenceRef: [{ conditionId: "outer", outcome: "false" }],
+      index: 0,
+    })).length,
+    1,
+  );
+});
+
+test("nested merges return to the parent lane before the parent merge", async () => {
+  const { deriveWorkflowLayout } = await loadControlFlow();
+  const flow = {
+    version: 2,
+    root: sequence(
+      step("trigger"),
+      condition("outer", [
+        condition("inner", [step("a")], [step("b")]),
+        step("inner-continuation"),
+      ], [step("outer-false")]),
+      step("outer-continuation"),
+    ),
+  };
+  const layout = deriveWorkflowLayout(flow, [
+    node("trigger", "issue-trigger"),
+    node("outer", "condition"),
+    node("inner", "condition"),
+    node("a"),
+    node("b", "skill", 180),
+    node("inner-continuation"),
+    node("outer-false"),
+    node("outer-continuation"),
+  ]);
+  const inner = layout.conditions.inner;
+  const outer = layout.conditions.outer;
+
+  assert.ok(inner.mergeY < layout.positions["inner-continuation"].y);
+  assert.ok(layout.positions["inner-continuation"].y < outer.mergeY);
+  assert.ok(outer.mergeY > inner.bounds.bottom);
+  assert.equal(inner.mergeX, outer.branchCenters.true);
+  assert.ok(layout.positions["outer-continuation"].y > outer.mergeY);
+});
+
+test("both nested sides and three levels measure disjoint sibling bounds", async () => {
+  const { deriveWorkflowLayout } = await loadControlFlow();
+  const flow = {
+    version: 2,
+    root: sequence(
+      step("trigger"),
+      condition("outer", [
+        condition("left-2", [
+          condition("left-3", [step("a")], [step("b")]),
+        ], [step("c")]),
+      ], [
+        condition("right-2", [step("d")], [
+          condition("right-3", [step("e")], [step("f")]),
+        ]),
+      ]),
+      step("shared"),
+    ),
+  };
+  const nodes = [
+    node("trigger", "issue-trigger"),
+    node("outer", "condition"),
+    node("left-2", "condition"),
+    node("left-3", "condition"),
+    node("right-2", "condition"),
+    node("right-3", "condition"),
+    ...["a", "b", "c", "d", "e", "f", "shared"].map((id) => node(id)),
+  ];
+  const layout = deriveWorkflowLayout(flow, nodes);
+  const outer = layout.conditions.outer;
+
+  assert.ok(outer.branchBounds.true.right < outer.branchBounds.false.left);
+  assert.ok(layout.conditions["left-3"].mergeY < layout.conditions["left-2"].mergeY);
+  assert.ok(layout.conditions["right-3"].mergeY < layout.conditions["right-2"].mergeY);
+  assert.ok(layout.conditions["left-2"].mergeY < outer.mergeY);
+  assert.ok(layout.conditions["right-2"].mergeY < outer.mergeY);
+  assert.ok(layout.positions.shared.y > outer.mergeY);
+});
+
+test("all derived routes are orthogonal, downward and use explicit local split or merge rails", async () => {
+  const { deriveWorkflowLayout } = await loadControlFlow();
+  const flow = {
+    version: 2,
+    root: sequence(
+      step("trigger"),
+      condition("outer", [
+        condition("inner", [step("a")], []),
+      ], [step("b")]),
+      step("tail"),
+    ),
+  };
+  const layout = deriveWorkflowLayout(flow, [
+    node("trigger", "issue-trigger"),
+    node("outer", "condition"),
+    node("inner", "condition"),
+    node("a"),
+    node("b"),
+    node("tail"),
+  ]);
+
+  for (const edge of layout.edges) assertOrthogonalMonotone(edge.data.points);
+  for (const conditionLayout of Object.values(layout.conditions)) {
+    assert.ok(conditionLayout.splitY > conditionLayout.nodeBottom);
+    assert.ok(conditionLayout.mergeRailY < conditionLayout.mergeY);
+    assert.ok(conditionLayout.mergeY > conditionLayout.branchBounds.true.bottom);
+    assert.ok(conditionLayout.mergeY > conditionLayout.branchBounds.false.bottom);
+  }
+});
+
+test("virtual split, empty and merge anchors are derived and never overlap real ids", async () => {
+  const { deriveWorkflowLayout } = await loadControlFlow();
+  const flow = {
+    version: 2,
+    root: sequence(step("trigger"), condition("outer"), step("tail")),
+  };
+  const layout = deriveWorkflowLayout(flow, [
+    node("trigger", "issue-trigger"),
+    node("outer", "condition"),
+    node("tail"),
+  ]);
+  const virtualIds = layout.virtualNodes.map((entry) => entry.id);
+
+  assert.deepEqual(virtualIds.filter((id) => id.includes("outer")).sort(), [
+    "__flow-empty-outer-false",
+    "__flow-empty-outer-true",
+    "__flow-merge-outer",
+    "__flow-split-outer",
+  ]);
+  assert.equal(new Set(virtualIds).size, virtualIds.length);
+  assert.equal(virtualIds.some((id) => ["trigger", "outer", "tail"].includes(id)), false);
+});
+
+test("shared continuation has one incoming merge edge and one insertion point", async () => {
+  const { deriveWorkflowLayout } = await loadControlFlow();
+  const flow = {
+    version: 2,
+    root: sequence(
+      step("trigger"),
+      condition("outer", [step("yes")], [step("no")]),
+      step("shared"),
+    ),
+  };
+  const layout = deriveWorkflowLayout(flow, [
+    node("trigger", "issue-trigger"),
+    node("outer", "condition"),
+    node("yes"),
+    node("no"),
+    node("shared"),
+  ]);
+  const mergeId = "__flow-merge-outer";
+  const incomingShared = layout.edges.filter((edge) => edge.target === "shared");
+
+  assert.equal(incomingShared.length, 1);
+  assert.equal(incomingShared[0].source, mergeId);
+  assert.deepEqual(incomingShared[0].data.insertion, {
+    sequenceRef: [],
+    index: 2,
+  });
+  assert.equal(
+    layout.insertionPoints.filter((entry) => (
+      insertionKey(entry.insertion) === insertionKey({ sequenceRef: [], index: 2 })
+    )).length,
+    1,
+  );
+});
diff --git a/apps/codex-taskboard/test/workflow-control-flow.test.mjs b/apps/codex-taskboard/test/workflow-control-flow.test.mjs
new file mode 100644
index 000000000..94bd690f5
--- /dev/null
+++ b/apps/codex-taskboard/test/workflow-control-flow.test.mjs
@@ -0,0 +1,653 @@
+import assert from "node:assert/strict";
+import test from "node:test";
+
+const loadControlFlow = () => import("../shared/workflow-control-flow.mjs");
+
+const step = (nodeId) => ({ type: "step", nodeId });
+const sequence = (...items) => ({ items });
+const condition = (nodeId, trueItems = [], falseItems = []) => ({
+  type: "condition",
+  nodeId,
+  branches: {
+    true: sequence(...trueItems),
+    false: sequence(...falseItems),
+  },
+});
+const node = (id, kind = "skill", x = 0, y = 0) => ({
+  id,
+  position: { x, y },
+  data: { kind },
+});
+const branchRef = (conditionId, outcome, parent = []) => [
+  ...parent,
+  { conditionId, outcome },
+];
+
+test("V2 stores a pure linear workflow as one root sequence", async () => {
+  const { createWorkflowFlow, workflowNodeIds } = await loadControlFlow();
+  const flow = createWorkflowFlow(["trigger", "one", "two"]);
+
+  assert.deepEqual(flow, {
+    version: 2,
+    root: sequence(step("trigger"), step("one"), step("two")),
+  });
+  assert.deepEqual(workflowNodeIds(flow), ["trigger", "one", "two"]);
+});
+
+test("a condition owns two branches while following root items are its shared continuation", async () => {
+  const { findWorkflowItem, getWorkflowSequence, workflowNodeIds } = await loadControlFlow();
+  const flow = {
+    version: 2,
+    root: sequence(
+      step("trigger"),
+      condition("outer", [step("accepted")], [step("rejected")]),
+      step("shared-tail"),
+    ),
+  };
+
+  assert.deepEqual(getWorkflowSequence(flow, []).items.map((item) => item.nodeId), [
+    "trigger",
+    "outer",
+    "shared-tail",
+  ]);
+  assert.deepEqual(getWorkflowSequence(flow, branchRef("outer", "true")).items, [step("accepted")]);
+  assert.deepEqual(getWorkflowSequence(flow, branchRef("outer", "false")).items, [step("rejected")]);
+  assert.deepEqual(findWorkflowItem(flow, "shared-tail"), {
+    sequenceRef: [],
+    index: 2,
+    item: step("shared-tail"),
+  });
+  assert.deepEqual(workflowNodeIds(flow), [
+    "trigger",
+    "outer",
+    "accepted",
+    "rejected",
+    "shared-tail",
+  ]);
+});
+
+test("conditions can nest in either branch and keep local continuations", async () => {
+  const { getWorkflowSequence, workflowNodeIds } = await loadControlFlow();
+  const flow = {
+    version: 2,
+    root: sequence(
+      step("trigger"),
+      condition("outer", [
+        condition("inner-true", [step("a")], [step("b")]),
+        step("inner-shared"),
+      ], [
+        condition("inner-false", [step("c")], [step("d")]),
+      ]),
+      step("outer-shared"),
+    ),
+  };
+
+  const outerTrue = branchRef("outer", "true");
+  assert.deepEqual(getWorkflowSequence(flow, outerTrue).items.map((item) => item.nodeId), [
+    "inner-true",
+    "inner-shared",
+  ]);
+  assert.deepEqual(
+    getWorkflowSequence(flow, branchRef("inner-true", "false", outerTrue)).items,
+    [step("b")],
+  );
+  assert.deepEqual(workflowNodeIds(flow), [
+    "trigger",
+    "outer",
+    "inner-true",
+    "a",
+    "b",
+    "inner-shared",
+    "inner-false",
+    "c",
+    "d",
+    "outer-shared",
+  ]);
+});
+
+test("at least three levels of nested conditions remain addressable", async () => {
+  const { getWorkflowSequence } = await loadControlFlow();
+  const flow = {
+    version: 2,
+    root: sequence(
+      step("trigger"),
+      condition("level-1", [
+        condition("level-2", [
+          condition("level-3", [step("deep-true")], [step("deep-false")]),
+          step("level-2-tail"),
+        ], []),
+        step("level-1-tail"),
+      ], []),
+      step("root-tail"),
+    ),
+  };
+  const level1True = branchRef("level-1", "true");
+  const level2True = branchRef("level-2", "true", level1True);
+  const level3False = branchRef("level-3", "false", level2True);
+
+  assert.deepEqual(getWorkflowSequence(flow, level3False).items, [step("deep-false")]);
+  assert.deepEqual(getWorkflowSequence(flow, level2True).items.map((item) => item.nodeId), [
+    "level-3",
+    "level-2-tail",
+  ]);
+  assert.equal(flow.root.items.at(-1).nodeId, "root-tail");
+});
+
+test("V1 linear snapshots migrate without dropping nodes", async () => {
+  const { migrateWorkflowSnapshotV1, workflowNodeIds } = await loadControlFlow();
+  const nodes = [
+    node("trigger", "issue-trigger", 0, 0),
+    node("one", "skill", 0, 100),
+    node("two", "mcp", 0, 200),
+  ];
+  const migrated = migrateWorkflowSnapshotV1(nodes, [
+    { id: "a", source: "trigger", target: "one" },
+    { id: "b", source: "one", target: "two" },
+  ]);
+
+  assert.equal(migrated.flow.version, 2);
+  assert.deepEqual(workflowNodeIds(migrated.flow), ["trigger", "one", "two"]);
+  assert.deepEqual(migrated.nodes.map((entry) => entry.id), ["trigger", "one", "two"]);
+});
+
+test("V1 snapshots created before trigger restrictions keep the first trigger and compatible steps", async () => {
+  const { migrateWorkflowSnapshotV1, workflowNodeIds } = await loadControlFlow();
+  const nodes = [
+    node("trigger-one", "issue-trigger", 0, 0),
+    node("trigger-two", "issue-trigger", 0, 100),
+    node("compatible-step", "skill", 0, 200),
+  ];
+  const migrated = migrateWorkflowSnapshotV1(nodes, [
+    { id: "a", source: "trigger-one", target: "trigger-two" },
+    { id: "b", source: "trigger-two", target: "compatible-step" },
+  ]);
+
+  assert.deepEqual(workflowNodeIds(migrated.flow), ["trigger-one", "compatible-step"]);
+  assert.deepEqual(migrated.nodes.map((entry) => entry.id), ["trigger-one", "compatible-step"]);
+});
+
+test("V1 persisted condition paths migrate to true and false branch sequences", async () => {
+  const { migrateWorkflowSnapshotV1, workflowNodeIds } = await loadControlFlow();
+  const nodes = [
+    node("trigger", "issue-trigger", 0, 0),
+    node("outer", "condition", 0, 100),
+    node("yes", "skill", -180, 300),
+    node("no", "mcp", 180, 300),
+  ];
+  const edges = [
+    { id: "trunk", source: "trigger", target: "outer" },
+    {
+      id: "yes",
+      source: "outer",
+      target: "yes",
+      data: { conditionId: "outer", conditionOutcome: "true" },
+    },
+    {
+      id: "no",
+      source: "outer",
+      target: "no",
+      data: { conditionId: "outer", conditionOutcome: "false" },
+    },
+  ];
+  const migrated = migrateWorkflowSnapshotV1(nodes, edges);
+
+  assert.deepEqual(migrated.flow.root.items, [
+    step("trigger"),
+    condition("outer", [step("yes")], [step("no")]),
+  ]);
+  assert.deepEqual(workflowNodeIds(migrated.flow), ["trigger", "outer", "yes", "no"]);
+});
+
+test("legacy linear items following a condition migrate into its true branch", async () => {
+  const { migrateWorkflowSnapshotV1 } = await loadControlFlow();
+  const nodes = [
+    node("trigger", "issue-trigger", 0, 0),
+    node("outer", "condition", 0, 100),
+    node("first", "skill", 0, 200),
+    node("second", "mcp", 0, 300),
+  ];
+  const migrated = migrateWorkflowSnapshotV1(nodes, [
+    { id: "a", source: "trigger", target: "outer" },
+    { id: "b", source: "outer", target: "first" },
+    { id: "c", source: "first", target: "second" },
+  ]);
+
+  assert.deepEqual(migrated.flow.root.items, [
+    step("trigger"),
+    condition("outer", [step("first"), step("second")], []),
+  ]);
+});
+
+test("V1 linear snapshots recursively migrate later conditions into true branches", async () => {
+  const { migrateWorkflowSnapshotV1 } = await loadControlFlow();
+  const nodes = [
+    node("trigger", "issue-trigger", 0, 0),
+    node("first-condition", "condition", 0, 100),
+    node("first-action", "skill", 0, 200),
+    node("second-condition", "condition", 0, 300),
+    node("second-action", "mcp", 0, 400),
+    node("third-condition", "condition", 0, 500),
+    node("tail", "skill", 0, 600),
+  ];
+  const migrated = migrateWorkflowSnapshotV1(nodes, [
+    { id: "a", source: "trigger", target: "first-condition" },
+    { id: "b", source: "first-condition", target: "first-action" },
+    { id: "c", source: "first-action", target: "second-condition" },
+    { id: "d", source: "second-condition", target: "second-action" },
+    { id: "e", source: "second-action", target: "third-condition" },
+    { id: "f", source: "third-condition", target: "tail" },
+  ]);
+
+  assert.deepEqual(migrated.flow.root.items, [
+    step("trigger"),
+    condition("first-condition", [
+      step("first-action"),
+      condition("second-condition", [
+        step("second-action"),
+        condition("third-condition", [step("tail")], []),
+      ], []),
+    ], []),
+  ]);
+});
+
+test("V1 persisted condition branches recursively migrate nested linear conditions", async () => {
+  const { migrateWorkflowSnapshotV1 } = await loadControlFlow();
+  const nodes = [
+    node("trigger", "issue-trigger", 0, 0),
+    node("outer", "condition", 0, 100),
+    node("yes", "skill", -180, 300),
+    node("true-condition", "condition", -180, 400),
+    node("true-tail", "mcp", -180, 500),
+    node("false-condition", "condition", 180, 300),
+    node("false-tail", "skill", 180, 400),
+  ];
+  const branchEdge = (id, source, target, outcome) => ({
+    id,
+    source,
+    target,
+    data: { conditionId: "outer", conditionOutcome: outcome },
+  });
+  const migrated = migrateWorkflowSnapshotV1(nodes, [
+    { id: "root", source: "trigger", target: "outer" },
+    branchEdge("a", "outer", "yes", "true"),
+    branchEdge("b", "yes", "true-condition", "true"),
+    branchEdge("c", "true-condition", "true-tail", "true"),
+    branchEdge("d", "outer", "false-condition", "false"),
+    branchEdge("e", "false-condition", "false-tail", "false"),
+  ]);
+
+  assert.deepEqual(migrated.flow.root.items, [
+    step("trigger"),
+    condition("outer", [
+      step("yes"),
+      condition("true-condition", [step("true-tail")], []),
+    ], [
+      condition("false-condition", [step("false-tail")], []),
+    ]),
+  ]);
+});
+
+test("snapshot normalization rejects unknown flow versions instead of reinterpreting them as V1", async () => {
+  const { normalizeWorkflowSnapshot } = await loadControlFlow();
+  const trigger = node("trigger", "issue-trigger");
+
+  assert.throws(
+    () => normalizeWorkflowSnapshot({
+      nodes: [trigger],
+      flow: {
+        version: 3,
+        root: sequence(step("trigger")),
+      },
+      selectedNodeId: null,
+    }),
+    /version 2/i,
+  );
+  assert.throws(
+    () => normalizeWorkflowSnapshot({
+      nodes: [trigger],
+      selectedNodeId: null,
+    }),
+    /legacy.*edges/i,
+  );
+});
+
+test("flow validation rejects duplicate, missing and virtual node ids", async () => {
+  const { assertWorkflowFlow } = await loadControlFlow();
+  const nodes = [node("trigger", "issue-trigger"), node("same"), node("outer", "condition")];
+
+  assert.throws(
+    () => assertWorkflowFlow({
+      version: 2,
+      root: sequence(step("trigger"), step("same"), step("same")),
+    }, nodes),
+    /unique/,
+  );
+  assert.throws(
+    () => assertWorkflowFlow({
+      version: 2,
+      root: sequence(step("trigger"), step("missing")),
+    }, nodes),
+    /missing/,
+  );
+  assert.throws(
+    () => assertWorkflowFlow({
+      version: 2,
+      root: sequence(step("trigger"), step("__flow-merge-outer")),
+    }, [...nodes, node("__flow-merge-outer")]),
+    /virtual/,
+  );
+});
+
+test("V2 validation rejects duplicate node records even when flow references the id once", async () => {
+  const { assertWorkflowFlow } = await loadControlFlow();
+
+  assert.throws(
+    () => assertWorkflowFlow({
+      version: 2,
+      root: sequence(step("trigger")),
+    }, [
+      node("trigger", "issue-trigger"),
+      node("trigger", "issue-trigger"),
+    ]),
+    /node ids must be unique/i,
+  );
+});
+
+test("V2 validation rejects flow items that reference parented plan children", async () => {
+  const { assertWorkflowFlow } = await loadControlFlow();
+
+  assert.throws(
+    () => assertWorkflowFlow({
+      version: 2,
+      root: sequence(step("trigger"), step("plan"), step("plan-child")),
+    }, [
+      node("trigger", "issue-trigger"),
+      node("plan", "planning"),
+      { ...node("plan-child", "skill"), parentId: "plan" },
+    ]),
+    /root node/i,
+  );
+});
+
+test("V2 validation requires parented nodes to belong to one root child container", async () => {
+  const { assertWorkflowFlow } = await loadControlFlow();
+  const trigger = node("trigger", "issue-trigger");
+  const flow = (...ids) => ({
+    version: 2,
+    root: sequence(...ids.map(step)),
+  });
+
+  assert.throws(
+    () => assertWorkflowFlow(flow("trigger"), [
+      trigger,
+      { ...node("orphan", "skill"), parentId: "missing-plan" },
+    ]),
+    /missing parent/i,
+  );
+
+  assert.throws(
+    () => assertWorkflowFlow(flow("trigger", "root-plan"), [
+      trigger,
+      {
+        ...node("root-plan", "basic-planning"),
+        data: { kind: "basic-planning", acceptsChildren: true },
+      },
+      {
+        ...node("nested-plan", "basic-planning"),
+        parentId: "root-plan",
+        data: { kind: "basic-planning", acceptsChildren: true },
+      },
+      { ...node("nested-child", "skill"), parentId: "nested-plan" },
+    ]),
+    /root parent/i,
+  );
+
+  assert.throws(
+    () => assertWorkflowFlow(flow("trigger", "plain-step"), [
+      trigger,
+      node("plain-step", "skill"),
+      { ...node("invalid-child", "mcp"), parentId: "plain-step" },
+    ]),
+    /acceptsChildren/i,
+  );
+
+  assert.doesNotThrow(() => assertWorkflowFlow(flow("trigger", "plan"), [
+    trigger,
+    {
+      ...node("plan", "basic-planning"),
+      data: { kind: "basic-planning", acceptsChildren: true },
+    },
+    { ...node("valid-child", "skill"), parentId: "plan" },
+  ]));
+});
+
+test("V2 validation requires item types to match their referenced node kinds", async () => {
+  const { assertWorkflowFlow } = await loadControlFlow();
+  const trigger = node("trigger", "issue-trigger");
+
+  assert.throws(
+    () => assertWorkflowFlow({
+      version: 2,
+      root: sequence(step("trigger"), step("wrong-step")),
+    }, [trigger, node("wrong-step", "condition")]),
+    /condition/i,
+  );
+  assert.throws(
+    () => assertWorkflowFlow({
+      version: 2,
+      root: sequence(step("trigger"), condition("wrong-condition")),
+    }, [trigger, node("wrong-condition", "skill")]),
+    /condition/i,
+  );
+});
+
+test("V2 validation accepts an empty root but requires one root-first trigger once non-empty", async () => {
+  const { assertWorkflowFlow } = await loadControlFlow();
+
+  assert.doesNotThrow(() => assertWorkflowFlow({
+    version: 2,
+    root: sequence(),
+  }, []));
+  assert.throws(
+    () => assertWorkflowFlow({
+      version: 2,
+      root: sequence(step("ordinary-step")),
+    }, [node("ordinary-step", "skill")]),
+    /trigger/i,
+  );
+});
+
+test("V2 validation rejects unknown node kinds that only look like triggers", async () => {
+  const { assertWorkflowFlow } = await loadControlFlow();
+
+  assert.throws(
+    () => assertWorkflowFlow({
+      version: 2,
+      root: sequence(step("unknown-trigger")),
+    }, [node("unknown-trigger", "made-up-trigger")]),
+    /trigger kind/i,
+  );
+});
+
+test("V2 validation rejects repeated triggers and triggers outside root index zero", async () => {
+  const { assertWorkflowFlow } = await loadControlFlow();
+  const nodes = [
+    node("trigger-one", "issue-trigger"),
+    node("trigger-two", "git-trigger"),
+    node("step"),
+  ];
+
+  assert.throws(
+    () => assertWorkflowFlow({
+      version: 2,
+      root: sequence(step("trigger-one"), step("trigger-two"), step("step")),
+    }, nodes),
+    /trigger/i,
+  );
+  assert.throws(
+    () => assertWorkflowFlow({
+      version: 2,
+      root: sequence(step("step"), step("trigger-one")),
+    }, nodes.filter((entry) => entry.id !== "trigger-two")),
+    /trigger/i,
+  );
+});
+
+test("serialized V2 snapshots persist flow but never derived edges or virtual nodes", async () => {
+  const { serializeWorkflowSnapshot } = await loadControlFlow();
+  const flow = {
+    version: 2,
+    root: sequence(step("trigger"), condition("outer"), step("tail")),
+  };
+  const serialized = serializeWorkflowSnapshot([
+    node("trigger", "issue-trigger"),
+    node("outer", "condition"),
+    node("tail"),
+    node("__flow-merge-outer"),
+  ], flow);
+
+  assert.deepEqual(Object.keys(serialized).sort(), ["flow", "nodes", "selectedNodeId"]);
+  assert.equal("edges" in serialized, false);
+  assert.deepEqual(serialized.nodes.map((entry) => entry.id), ["trigger", "outer", "tail"]);
+  assert.deepEqual(serialized.flow, flow);
+});
+
+test("inserting a condition cuts the sequence tail into its true branch", async () => {
+  const { createWorkflowFlow, insertWorkflowNode } = await loadControlFlow();
+  const flow = createWorkflowFlow(["trigger", "one", "two"]);
+  const next = insertWorkflowNode(flow, [], 1, "outer", "condition");
+
+  assert.deepEqual(next.root.items, [
+    step("trigger"),
+    condition("outer", [step("one"), step("two")], []),
+  ]);
+});
+
+test("root, branch and continuation insertion all use sequenceRef plus index", async () => {
+  const { insertWorkflowNode } = await loadControlFlow();
+  const initial = {
+    version: 2,
+    root: sequence(step("trigger"), condition("outer"), step("root-tail")),
+  };
+  const withRoot = insertWorkflowNode(initial, [], 1, "before-condition", "skill");
+  const withBranch = insertWorkflowNode(
+    withRoot,
+    branchRef("outer", "true"),
+    0,
+    "branch-step",
+    "skill",
+  );
+  const withContinuation = insertWorkflowNode(withBranch, [], 3, "after-condition", "skill");
+
+  assert.deepEqual(withContinuation.root.items.map((item) => item.nodeId), [
+    "trigger",
+    "before-condition",
+    "outer",
+    "after-condition",
+    "root-tail",
+  ]);
+  assert.deepEqual(
+    withContinuation.root.items[2].branches.true.items,
+    [step("branch-step")],
+  );
+});
+
+test("conditions can be inserted inside a branch and own that branch tail", async () => {
+  const { insertWorkflowNode } = await loadControlFlow();
+  const initial = {
+    version: 2,
+    root: sequence(
+      step("trigger"),
+      condition("outer", [step("one"), step("two")], []),
+      step("root-tail"),
+    ),
+  };
+  const next = insertWorkflowNode(
+    initial,
+    branchRef("outer", "true"),
+    1,
+    "inner",
+    "condition",
+  );
+
+  assert.deepEqual(next.root.items[1].branches.true.items, [
+    step("one"),
+    condition("inner", [step("two")], []),
+  ]);
+  assert.equal(next.root.items.at(-1).nodeId, "root-tail");
+});
+
+test("deleting inner or outer conditions removes only their branch subtrees and preserves continuation", async () => {
+  const { deleteWorkflowNode } = await loadControlFlow();
+  const flow = {
+    version: 2,
+    root: sequence(
+      step("trigger"),
+      condition("outer", [
+        condition("inner", [step("inner-yes")], [step("inner-no")]),
+        step("outer-true-tail"),
+      ], [step("outer-no")]),
+      step("root-tail"),
+    ),
+  };
+  const deletedInner = deleteWorkflowNode(flow, "inner");
+  assert.deepEqual(deletedInner.removedNodeIds.sort(), ["inner", "inner-no", "inner-yes"]);
+  assert.deepEqual(
+    deletedInner.flow.root.items[1].branches.true.items,
+    [step("outer-true-tail")],
+  );
+  assert.equal(deletedInner.flow.root.items.at(-1).nodeId, "root-tail");
+
+  const deletedOuter = deleteWorkflowNode(flow, "outer");
+  assert.deepEqual(deletedOuter.flow.root.items, [step("trigger"), step("root-tail")]);
+  assert.deepEqual(deletedOuter.removedNodeIds.sort(), [
+    "inner",
+    "inner-no",
+    "inner-yes",
+    "outer",
+    "outer-no",
+    "outer-true-tail",
+  ]);
+});
+
+test("moving a condition carries its subtree but not the source sequence continuation", async () => {
+  const { moveWorkflowNode } = await loadControlFlow();
+  const flow = {
+    version: 2,
+    root: sequence(
+      step("trigger"),
+      condition("outer", [step("yes")], [step("no")]),
+      step("continuation"),
+      step("last"),
+    ),
+  };
+  const moved = moveWorkflowNode(flow, "outer", [], 4);
+
+  assert.deepEqual(moved.root.items.map((item) => item.nodeId), [
+    "trigger",
+    "continuation",
+    "last",
+    "outer",
+  ]);
+  assert.deepEqual(moved.root.items.at(-1).branches.true.items, [step("yes")]);
+  assert.deepEqual(moved.root.items.at(-1).branches.false.items, [step("no")]);
+});
+
+test("moving into a condition's descendant is rejected and the trigger stays root-first", async () => {
+  const { moveWorkflowNode } = await loadControlFlow();
+  const flow = {
+    version: 2,
+    root: sequence(
+      step("trigger"),
+      condition("outer", [step("yes")], []),
+      step("tail"),
+    ),
+  };
+
+  assert.throws(
+    () => moveWorkflowNode(flow, "outer", branchRef("outer", "true"), 1),
+    /descendant/,
+  );
+  assert.throws(() => moveWorkflowNode(flow, "trigger", [], 2), /trigger/);
+  assert.throws(() => moveWorkflowNode(flow, "tail", [], 0), /trigger/);
+});
diff --git a/apps/codex-taskboard/test/workflow-sequence.test.mjs b/apps/codex-taskboard/test/workflow-sequence.test.mjs
new file mode 100644
index 000000000..acb7d4692
--- /dev/null
+++ b/apps/codex-taskboard/test/workflow-sequence.test.mjs
@@ -0,0 +1,89 @@
+import assert from "node:assert/strict";
+import test from "node:test";
+import {
+  insertWorkflowStep,
+  layoutWorkflowSteps,
+  orderedWorkflowStepIds,
+  reorderWorkflowStep,
+  workflowSequenceEdges,
+} from "../shared/workflow-sequence.mjs";
+
+const nodes = [
+  { id: "review", position: { x: 650, y: 220 } },
+  { id: "plan-child", parentId: "plan", position: { x: 10, y: 86 } },
+  { id: "trigger", position: { x: 20, y: 220 } },
+  { id: "update", position: { x: 950, y: 220 } },
+  { id: "plan", position: { x: 330, y: 153 } },
+];
+
+const edges = [
+  { id: "trigger-plan", source: "trigger", target: "plan" },
+  { id: "plan-review", source: "plan", target: "review" },
+  { id: "review-update", source: "review", target: "update" },
+];
+
+test("workflow roots are converted from a free canvas graph into one execution sequence", () => {
+  assert.deepEqual(
+    orderedWorkflowStepIds(nodes, edges),
+    ["trigger", "plan", "review", "update"],
+  );
+});
+
+test("disconnected workflow roots are appended deterministically without including nested plan items", () => {
+  const withDisconnected = [
+    ...nodes,
+    { id: "later", position: { x: 200, y: 800 } },
+    { id: "earlier", position: { x: 100, y: 600 } },
+  ];
+  assert.deepEqual(
+    orderedWorkflowStepIds(withDisconnected, edges),
+    ["trigger", "plan", "review", "update", "earlier", "later"],
+  );
+});
+
+test("steps insert and reorder within the sequence while the trigger stays pinned first", () => {
+  const initial = ["trigger", "plan", "review"];
+  assert.deepEqual(
+    insertWorkflowStep(initial, "skill", "plan"),
+    ["trigger", "plan", "skill", "review"],
+  );
+  assert.deepEqual(
+    insertWorkflowStep([], "trigger", null),
+    ["trigger"],
+  );
+  assert.deepEqual(
+    reorderWorkflowStep(initial, "review", 1, "trigger"),
+    ["trigger", "review", "plan"],
+  );
+  assert.deepEqual(
+    reorderWorkflowStep(initial, "trigger", 2, "trigger"),
+    initial,
+  );
+});
+
+test("the execution sequence owns its connectors and vertical layout", () => {
+  assert.deepEqual(workflowSequenceEdges(["trigger", "plan", "review"]), [
+    { id: "sequence-trigger-plan", source: "trigger", target: "plan" },
+    { id: "sequence-plan-review", source: "plan", target: "review" },
+  ]);
+
+  const laidOut = layoutWorkflowSteps(
+    nodes,
+    ["trigger", "plan", "review", "update"],
+    { trigger: 78, plan: 210, review: 78, update: 78 },
+    { top: 48, gap: 58 },
+  );
+  assert.deepEqual(
+    laidOut.filter((node) => !node.parentId).map((node) => [node.id, node.position]),
+    [
+      ["trigger", { x: 0, y: 48 }],
+      ["plan", { x: 0, y: 184 }],
+      ["review", { x: 0, y: 452 }],
+      ["update", { x: 0, y: 588 }],
+    ],
+  );
+  assert.deepEqual(
+    laidOut.find((node) => node.id === "plan-child")?.position,
+    { x: 10, y: 86 },
+  );
+});
diff --git a/apps/codex-taskboard/test/workflow-twitter-node.test.mjs b/apps/codex-taskboard/test/workflow-twitter-node.test.mjs
new file mode 100644
index 000000000..289e3b88c
--- /dev/null
+++ b/apps/codex-taskboard/test/workflow-twitter-node.test.mjs
@@ -0,0 +1,56 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import test from "node:test";
+
+const board = await readFile(new URL("../web/src/components/WorkflowBoard.tsx", import.meta.url), "utf8");
+const inspector = await readFile(new URL("../web/src/components/WorkflowInspector.tsx", import.meta.url), "utf8");
+const node = await readFile(new URL("../web/src/components/WorkflowNode.tsx", import.meta.url), "utf8");
+const picker = await readFile(new URL("../web/src/components/WorkflowStepPicker.tsx", import.meta.url), "utf8");
+const catalog = await readFile(new URL("../web/src/components/workflowCatalog.ts", import.meta.url), "utf8");
+
+test("Twitter publishing is a third-party workflow choice with the official transparent X logo", () => {
+  assert.match(catalog, /import xLogo from "\.\.\/assets\/x-logo-black\.png"/);
+  assert.match(
+    catalog,
+    /group: "第三方集成",[\s\S]*?title: "发布到 Twitter"[\s\S]*?kind: "twitter-post"[\s\S]*?logo: xLogo[\s\S]*?logoMonochrome: true/,
+  );
+  assert.match(picker, /filteredItems\.filter\(\(item\) => item\.group === group\)/);
+  assert.match(picker, /<WorkflowMark[\s\S]*?logo=\{item\.data\.logo\}/);
+  assert.doesNotMatch(catalog, /twitterUser|twitterAccount|twitterCredential|twitterToken/);
+});
+
+test("Twitter publishing owns only one shared node-data configuration field", () => {
+  assert.match(node, /twitterPostContent\?: string/);
+  assert.match(
+    inspector,
+    /data\.kind === "twitter-post"[\s\S]*?<h2>发布到 Twitter<\/h2>[\s\S]*?aria-label="Twitter 发布内容"[\s\S]*?value=\{data\.twitterPostContent \?\? ""\}[\s\S]*?onChange=\{\(event\) => onChange\(\{ twitterPostContent: event\.target\.value \}\)\}/,
+  );
+  assert.doesNotMatch(
+    inspector,
+    /data\.kind === "twitter-post"[\s\S]*?(账号|凭据|回复|线程|媒体上传)/,
+  );
+});
+
+test("Twitter node title, summary and configured state derive from actual post content", () => {
+  assert.match(
+    catalog,
+    /if \(data\.kind === "twitter-post"\)[\s\S]*?twitterPostContent\?\.trim\(\)[\s\S]*?尚未填写发布内容/,
+  );
+  assert.match(
+    catalog,
+    /if \(data\.kind === "twitter-post"\)[\s\S]*?formatActionTitle\(data\.title/,
+  );
+  assert.match(
+    catalog,
+    /if \(data\.kind === "twitter-post"\)[\s\S]*?Boolean\(data\.twitterPostContent\?\.trim\(\)\)/,
+  );
+});
+
+test("Twitter post content follows the shared workspace autosave path", () => {
+  assert.match(
+    board,
+    /node\.id === selectedNodeId[\s\S]*?data: \{ \.\.\.node\.data, \.\.\.changes \}/,
+  );
+  assert.match(board, /nodes: snapshot\.nodes/);
+  assert.doesNotMatch(inspector, /localStorage|sessionStorage/);
+});
diff --git a/apps/codex-taskboard/test/zapier-workflow.test.mjs b/apps/codex-taskboard/test/zapier-workflow.test.mjs
new file mode 100644
index 000000000..0c2d251dd
--- /dev/null
+++ b/apps/codex-taskboard/test/zapier-workflow.test.mjs
@@ -0,0 +1,492 @@
+import assert from "node:assert/strict";
+import { readFile } from "node:fs/promises";
+import test from "node:test";
+
+const board = await readFile(new URL("../web/src/components/WorkflowBoard.tsx", import.meta.url), "utf8");
+const node = await readFile(new URL("../web/src/components/WorkflowNode.tsx", import.meta.url), "utf8");
+const inspector = await readFile(new URL("../web/src/components/WorkflowInspector.tsx", import.meta.url), "utf8");
+const picker = await readFile(new URL("../web/src/components/WorkflowStepPicker.tsx", import.meta.url), "utf8");
+const catalog = await readFile(new URL("../web/src/components/workflowCatalog.ts", import.meta.url), "utf8");
+const styles = await readFile(new URL("../web/src/components/workflow.css", import.meta.url), "utf8");
+const globalStyles = await readFile(new URL("../web/src/styles.css", import.meta.url), "utf8");
+const controlFlow = await readFile(new URL("../shared/workflow-control-flow.mjs", import.meta.url), "utf8");
+
+test("workflow editing is a constrained vertical execution sequence instead of a free canvas", () => {
+  assert.match(board, /normalizeWorkflowSnapshot/);
+  assert.match(board, /deriveWorkflowLayout/);
+  assert.match(board, /insertWorkflowNode/);
+  assert.match(board, /moveWorkflowNode/);
+  assert.match(board, /edgeTypes=\{EDGE_TYPES\}/);
+  assert.match(board, /nodeOrigin=\{TOP_CENTER_ORIGIN\}/);
+  assert.match(board, /nodesConnectable=\{false\}/);
+  assert.match(board, /aria-label="流程编排区"/);
+  assert.match(board, /instance\.setCenter\(0, 220, \{ zoom: 1 \}\)/);
+  assert.doesNotMatch(board, /\n\s+fitView\n/);
+  assert.doesNotMatch(board, /MiniMap|onConnect=|aria-label="节点库"|workflow-library/);
+  assert.doesNotMatch(styles, /workflow-minimap|workflow-library-width|workflow-grid-dot/);
+});
+
+test("workflow viewport controls are only shown in the bottom-left control group", () => {
+  assert.match(board, /<Controls[\s\S]*?position="bottom-left"/);
+  assert.doesNotMatch(board, /aria-label="适应流程视图"/);
+  assert.doesNotMatch(styles, /\.workflow-toolbar-status > button/);
+});
+
+test("steps are inserted from the connector or sequence end through a searchable chooser", () => {
+  assert.match(board, /const openStepPicker = useCallback/);
+  assert.match(board, /aria-label="添加第一个步骤"/);
+  assert.match(
+    board,
+    /layout\.edges\.map[\s\S]*?edge\.data\.insertion[\s\S]*?openStepPicker/,
+  );
+  assert.match(board, /<WorkflowStepPicker/);
+  assert.match(picker, /role="dialog"/);
+  assert.match(picker, /aria-label="添加流程步骤"/);
+  assert.match(picker, /placeholder="搜索应用或动作…"/);
+  assert.match(picker, /WORKFLOW_GROUPS\.filter/);
+  assert.match(picker, /onSelect\(item\)/);
+  assert.match(styles, /\.workflow-step-picker \{/);
+  assert.match(styles, /\.workflow-sequence-add \{[\s\S]*?pointer-events: all/);
+});
+
+test("RSS, pull request and repository issue submissions are distinct trigger choices", () => {
+  assert.match(
+    catalog,
+    /group: "触发器",[\s\S]*?title: "RSS 订阅更新"[\s\S]*?kind: "rss-trigger"/,
+  );
+  assert.match(
+    catalog,
+    /group: "触发器",[\s\S]*?title: "PR 提交"[\s\S]*?kind: "pull-request-submitted-trigger"/,
+  );
+  assert.match(
+    catalog,
+    /group: "触发器",[\s\S]*?title: "Issue 提交"[\s\S]*?kind: "repository-issue-submitted-trigger"/,
+  );
+  assert.match(catalog, /kind: "issue-trigger"/);
+  assert.match(board, /rootStepIds\.length === 0[\s\S]*?item\.group === "触发器"/);
+});
+
+test("every trigger kind stays pinned first and cannot be deleted or duplicated", () => {
+  assert.match(
+    controlFlow,
+    /WORKFLOW_TRIGGER_KINDS = Object\.freeze\(\[[\s\S]*?"issue-trigger"[\s\S]*?"rss-trigger"[\s\S]*?"pull-request-submitted-trigger"[\s\S]*?"repository-issue-submitted-trigger"[\s\S]*?\]\)/,
+  );
+  assert.match(
+    catalog,
+    /export \{ WORKFLOW_TRIGGER_KINDS, isWorkflowTriggerKind \} from "\.\.\/\.\.\/\.\.\/shared\/workflow-control-flow\.mjs"/,
+  );
+  assert.doesNotMatch(catalog, /export const WORKFLOW_TRIGGER_KINDS/);
+  assert.match(
+    board,
+    /if \(!node \|\| isWorkflowTriggerKind\(node\.data\.kind\)\) return/,
+  );
+  assert.match(
+    board,
+    /if \(!source \|\| isWorkflowTriggerKind\(source\.data\.kind\) \|\| source\.data\.kind === "condition"\) return/,
+  );
+  assert.match(
+    board,
+    /const pinnedTriggerId = rootStepIds\[0\][\s\S]*?isWorkflowTriggerKind/,
+  );
+  assert.match(
+    controlFlow,
+    /Workflow trigger must stay first/,
+  );
+  assert.doesNotMatch(board, /data\.kind === "issue-trigger"/);
+  assert.match(node, /canDuplicate[\s\S]*?\{canDuplicate && \([\s\S]*?>复制步骤</);
+  assert.match(node, /canDuplicate=\{!data\.isTrigger && data\.kind !== "condition"\}/);
+});
+
+test("RSS trigger stores one feed address and derives its configured source display", () => {
+  assert.match(
+    catalog,
+    /kind: "rss-trigger"[\s\S]*?rssFeedUrl: ""/,
+  );
+  assert.match(
+    inspector,
+    /data\.kind === "rss-trigger"[\s\S]*?aria-label="RSS 订阅地址"[\s\S]*?onChange=\{\(event\) => onChange\(\{ rssFeedUrl: event\.target\.value \}\)\}/,
+  );
+  assert.match(catalog, /if \(data\.kind === "rss-trigger"\)[\s\S]*?rssFeedUrl/);
+  assert.match(
+    catalog,
+    /if \(data\.kind === "rss-trigger"\)[\s\S]*?Boolean\(data\.rssFeedUrl\?\.trim\(\)\)/,
+  );
+  assert.doesNotMatch(inspector, /localStorage/);
+});
+
+test("repository submission triggers use current project context without fake infrastructure", () => {
+  assert.match(
+    catalog,
+    /kind: "pull-request-submitted-trigger"[\s\S]*?meta: "当前项目仓库 · Pull Request"/,
+  );
+  assert.match(
+    catalog,
+    /kind: "repository-issue-submitted-trigger"[\s\S]*?meta: "当前项目仓库 · Issue"/,
+  );
+  assert.doesNotMatch(
+    catalog,
+    /prRepository|issueRepository|rssPollingInterval|rssWebhook|pullRequestWebhook|issueWebhook/,
+  );
+});
+
+test("Git 状态 is a distinct current-project trigger without fake execution infrastructure", () => {
+  assert.match(
+    catalog,
+    /group: "触发器",[\s\S]*?title: "Git 状态"[\s\S]*?kind: "git-status-trigger"[\s\S]*?title: "Git 状态"/,
+  );
+  assert.match(
+    catalog,
+    /kind: "git-status-trigger"[\s\S]*?description: "当前项目的 Git 工作区状态发生变化时触发"[\s\S]*?meta: "当前项目 · Git 工作区"[\s\S]*?logo: GIT_LOGO/,
+  );
+  assert.match(
+    controlFlow,
+    /WORKFLOW_TRIGGER_KINDS = Object\.freeze\(\[[\s\S]*?"git-status-trigger"[\s\S]*?\]\)/,
+  );
+  assert.match(
+    inspector,
+    /<div className="workflow-inspector-tabs"[\s\S]*?>设置<[\s\S]*?>配置<[\s\S]*?aria-label="额外说明"/,
+  );
+  assert.doesNotMatch(inspector, /data\.kind === "git-status-trigger"/);
+  assert.doesNotMatch(
+    catalog,
+    /gitStatusRepository|gitStatusProject|gitStatusPolling|gitStatusWatcher|gitStatusExecutor|gitStatusSuccess/,
+  );
+  assert.match(
+    board,
+    /displayTitle: workflowNodeDisplayTitle\(node\.data\)[\s\S]*?configured: workflowNodeConfigured\(/,
+  );
+  assert.match(
+    catalog,
+    /export function workflowNodeDisplayTitle[\s\S]*?return data\.title;[\s\S]*?export function workflowNodeConfigured[\s\S]*?return true;/,
+  );
+  assert.match(
+    board,
+    /node\.id === selectedNodeId[\s\S]*?data: \{ \.\.\.node\.data, \.\.\.changes \}/,
+  );
+  assert.match(board, /nodes: snapshot\.nodes/);
+});
+
+test("condition steps keep one comparison rule and own two persisted outcome paths", () => {
+  assert.match(catalog, /\| "流程控制"/);
+  assert.match(catalog, /"触发器",\s+"流程控制"/);
+  assert.match(
+    catalog,
+    /group: "流程控制",[\s\S]*?title: "条件判断"[\s\S]*?description: "根据判断结果进入对应路径"[\s\S]*?kind: "condition"[\s\S]*?description: "根据判断结果进入对应路径"[\s\S]*?conditionField: "issue-status"[\s\S]*?conditionOperator: "equals"[\s\S]*?conditionValue: "todo"/,
+  );
+  assert.match(
+    inspector,
+    /data\.kind === "condition"[\s\S]*?aria-label="判断字段"[\s\S]*?aria-label="运算符"[\s\S]*?aria-label="比较值"/,
+  );
+  assert.match(catalog, /if \(data\.kind === "condition"\)[\s\S]*?formatActionTitle/);
+  assert.match(controlFlow, /branches: \{[\s\S]*?true: \{ items: trueItems \}[\s\S]*?false: \{ items: falseItems \}/);
+  assert.match(controlFlow, /const mergeId = `__flow-merge-\$\{conditionId\}`/);
+  assert.match(board, /flow: WorkflowFlow/);
+  assert.match(board, /layout\.virtualNodes\.map/);
+  assert.match(styles, /\.workflow-flow-merge::after/);
+  const mergeAnchorStyles = styles.match(/\.workflow-flow-merge::after\s*\{([^}]+)\}/)?.[1] ?? "";
+  assert.match(mergeAnchorStyles, /width:\s*10px/);
+  assert.match(mergeAnchorStyles, /height:\s*10px/);
+  assert.match(mergeAnchorStyles, /border:[^;]*var\(--border-strong\)/);
+  assert.match(mergeAnchorStyles, /background:[^;]*var\(--surface-raised\)/);
+  assert.match(styles, /\.workflow-condition-branch-label/);
+  assert.doesNotMatch(board, /conditionGraph/);
+});
+
+test("condition branch pickers use recursive sequence refs and allow nested conditions", () => {
+  assert.match(board, /sequenceRef: WorkflowSequenceRef/);
+  assert.match(board, /index: number/);
+  assert.match(
+    board,
+    /insertWorkflowNode\([\s\S]*?pickerTarget\.sequenceRef[\s\S]*?pickerTarget\.index/,
+  );
+  assert.match(
+    board,
+    /item\.group !== "触发器"/,
+  );
+  assert.doesNotMatch(board, /item\.data\.kind !== "condition"/);
+});
+
+test("deleting a condition removes its subtree, while conditions move as one subtree and cannot duplicate", () => {
+  assert.match(
+    board,
+    /deleteWorkflowNode\(flow, nodeId\)[\s\S]*?deleted\.removedNodeIds/,
+  );
+  assert.match(
+    board,
+    /source\.data\.kind === "condition"\) return/,
+  );
+  assert.match(
+    board,
+    /moveWorkflowNode\([\s\S]*?session\.sequenceRef/,
+  );
+});
+
+test("condition fields expose only meaningful operators and value controls", () => {
+  assert.match(
+    catalog,
+    /value: "issue-status"[\s\S]*?operators: \["equals", "not-equals"\][\s\S]*?defaultValue: "todo"/,
+  );
+  assert.match(
+    catalog,
+    /value: "issue-priority"[\s\S]*?operators: \["equals", "not-equals"\][\s\S]*?defaultValue: "none"/,
+  );
+  assert.match(
+    catalog,
+    /value: "issue-labels"[\s\S]*?operators: \["contains", "not-contains"\][\s\S]*?defaultValue: ""/,
+  );
+  assert.match(
+    catalog,
+    /value: "upstream-output"[\s\S]*?operators: \["equals", "not-equals", "contains", "not-contains"\][\s\S]*?defaultValue: ""/,
+  );
+  assert.match(
+    inspector,
+    /conditionField: selectedField\.value,[\s\S]*?conditionOperator: selectedField\.defaultOperator,[\s\S]*?conditionValue: selectedField\.defaultValue/,
+  );
+  assert.match(
+    inspector,
+    /conditionField === "issue-status"[\s\S]*?ISSUE_STATUSES\.map/,
+  );
+  assert.match(
+    inspector,
+    /conditionField === "issue-priority"[\s\S]*?ISSUE_PRIORITIES\.map/,
+  );
+  assert.match(
+    inspector,
+    /\(conditionField === "issue-labels" \|\| conditionField === "upstream-output"\)[\s\S]*?<input[\s\S]*?aria-label="比较值"/,
+  );
+});
+
+test("Feishu message keeps Feishu docs and configures exactly one real delivery target", () => {
+  assert.match(
+    catalog,
+    /kind: "feishu-docs"[\s\S]*?kind: "feishu-message"[\s\S]*?logo: FEISHU_LOGO/,
+  );
+  assert.match(
+    catalog,
+    /FEISHU_MESSAGE_RECIPIENTS = \[[\s\S]*?value: "self", label: "发送给自己"[\s\S]*?value: "user", label: "发送给特定用户"[\s\S]*?value: "chat", label: "发送到群聊"[\s\S]*?\] as const/,
+  );
+  assert.match(
+    inspector,
+    /data\.kind === "feishu-message"[\s\S]*?aria-label="飞书消息发送对象"[\s\S]*?data\.feishuRecipientType === "user"[\s\S]*?aria-label="飞书用户"[\s\S]*?data\.feishuRecipientType === "chat"[\s\S]*?aria-label="飞书群聊"/,
+  );
+  assert.doesNotMatch(inspector, /localStorage/);
+});
+
+test("add ISSUE is a separate result step beside issue update", () => {
+  assert.match(
+    catalog,
+    /group: "结果",[\s\S]*?title: "添加 ISSUE"[\s\S]*?kind: "issue-create"[\s\S]*?title: "添加 ISSUE"[\s\S]*?icon: "createIssue"/,
+  );
+  assert.match(catalog, /kind: "issue-update"/);
+  assert.match(picker, /onSelect\(item\)/);
+});
+
+test("add ISSUE owns independent creation fields", () => {
+  const createIssueBlock = catalog.match(
+    /kind: "issue-create",[\s\S]*?createIssueLabels: "",/,
+  )?.[0] ?? "";
+  assert.match(createIssueBlock, /createIssueTitle: ""/);
+  assert.match(createIssueBlock, /createIssueDescription: ""/);
+  assert.match(createIssueBlock, /createIssueStatus: "todo"/);
+  assert.match(createIssueBlock, /createIssuePriority: "none"/);
+  assert.match(createIssueBlock, /createIssueLabels: ""/);
+  assert.doesNotMatch(
+    createIssueBlock,
+    /targetStatus|targetPriority|labelsToAdd|specificIssueId/,
+  );
+});
+
+test("add ISSUE keeps shared inspector settings and limits its configuration to creation inputs", () => {
+  assert.match(inspector, /<div className="workflow-inspector-tabs"[\s\S]*?>设置<[\s\S]*?>配置</);
+  assert.match(
+    inspector,
+    /\{activeTab === "settings" \? \([\s\S]*?aria-label="额外说明"[\s\S]*?当前项目/,
+  );
+  assert.doesNotMatch(inspector, /data\.kind !== "issue-create" &&/);
+  assert.doesNotMatch(inspector, /data\.kind === "issue-create" \? \(/);
+  const createIssueInspector = inspector.match(
+    /data\.kind === "issue-create" && \([\s\S]*?\n          \)\}/,
+  )?.[0] ?? "";
+  assert.match(createIssueInspector, /aria-label="ISSUE 标题"/);
+  assert.match(createIssueInspector, /aria-label="ISSUE 描述"/);
+  assert.match(createIssueInspector, /aria-label="ISSUE 初始状态"[\s\S]*?ISSUE_STATUSES\.map/);
+  assert.match(createIssueInspector, /aria-label="ISSUE 优先级"[\s\S]*?ISSUE_PRIORITIES\.map/);
+  assert.match(createIssueInspector, /aria-label="ISSUE 标签"/);
+  assert.doesNotMatch(createIssueInspector, /当前项目|projectName|property-project/);
+});
+
+test("add ISSUE title, meta and configured state reflect draft data without executing", () => {
+  assert.match(
+    catalog,
+    /if \(data\.kind === "issue-create"\)[\s\S]*?createIssueTitle\?\.trim\(\)/,
+  );
+  assert.match(
+    catalog,
+    /if \(data\.kind === "issue-create"\)[\s\S]*?createIssueStatus[\s\S]*?createIssuePriority/,
+  );
+  assert.match(
+    catalog,
+    /if \(data\.kind === "issue-create"\)[\s\S]*?Boolean\(data\.createIssueTitle\?\.trim\(\)\)/,
+  );
+  assert.doesNotMatch(catalog, /issueCreated|createdIssueId|创建成功/);
+});
+
+test("add ISSUE uses the shared node data and workspace persistence path", () => {
+  assert.match(inspector, /onChange\(\{ createIssueTitle: event\.target\.value \}\)/);
+  assert.match(
+    board,
+    /node\.id === selectedNodeId[\s\S]*?data: \{ \.\.\.node\.data, \.\.\.changes \}/,
+  );
+  assert.match(board, /nodes: snapshot\.nodes/);
+  assert.doesNotMatch(inspector, /localStorage/);
+});
+
+test("new step configuration follows the shared node data and workspace persistence path", () => {
+  assert.match(inspector, /onChange\(\{[\s\S]*?conditionField: selectedField\.value/);
+  assert.match(
+    inspector,
+    /feishuRecipientType: event\.target\.value as WorkflowNodeData\["feishuRecipientType"\],[\s\S]*?feishuUserId: "",[\s\S]*?feishuChatId: ""/,
+  );
+  assert.match(
+    board,
+    /node\.id === selectedNodeId[\s\S]*?data: \{ \.\.\.node\.data, \.\.\.changes \}/,
+  );
+  assert.match(board, /nodes: snapshot\.nodes/);
+});
+
+test("sequence steps reuse the original structured workflow node presentation", () => {
+  assert.match(node, /Position\.Top/);
+  assert.match(node, /Position\.Bottom/);
+  assert.match(node, /data\.stepNumber/);
+  assert.match(node, /data\.configured \? "已配置" : "需要配置"/);
+  assert.match(node, /aria-label="步骤操作"/);
+  assert.match(node, />复制步骤</);
+  assert.match(node, />删除步骤</);
+  assert.match(node, /data\.onDuplicate/);
+  assert.match(node, /data\.onDelete/);
+  assert.match(node, /workflow-node-header/);
+  assert.match(node, /workflow-node-heading/);
+  assert.match(node, /workflow-node-body/);
+  assert.match(node, /workflow-node-footer/);
+  assert.match(node, /workflow-node-state/);
+  assert.doesNotMatch(node, /workflow-step-card|workflow-step-main/);
+  assert.match(board, /const WORKFLOW_STEP_WIDTH = 250/);
+  assert.match(board, /const WORKFLOW_STEP_HEIGHT = 138/);
+  assert.match(board, /measured: \{ width: WORKFLOW_STEP_WIDTH, height \}/);
+  assert.match(board, /measured: \{ width: PLAN_ITEM_WIDTH, height: PLAN_ITEM_HEIGHT \}/);
+  assert.match(board, /measured: \{ width: END_STEP_HEIGHT, height: END_STEP_HEIGHT \}/);
+  assert.match(globalStyles, /\.workflow-node \{[\s\S]*?width: 250px/);
+  assert.match(globalStyles, /\.workflow-node\.selected \{/);
+});
+
+test("step configuration is an on-demand right panel rather than a permanent three-column shell", () => {
+  assert.match(board, /selectedNode && \([\s\S]*?<WorkflowInspector/);
+  assert.match(inspector, /aria-label="关闭步骤配置"/);
+  assert.match(inspector, /role="tablist"/);
+  assert.match(inspector, />设置</);
+  assert.match(inspector, />配置</);
+  assert.match(board, /listWorkflowCapabilities/);
+  assert.match(inspector, /可用 Skill/);
+  assert.match(inspector, /可用 MCP Server/);
+  assert.match(inspector, /额外说明/);
+  assert.match(styles, /\.workflow-board\.has-inspector \{[\s\S]*?grid-template-columns: minmax\(0, 1fr\) 360px/);
+  assert.doesNotMatch(styles, /\.workflow-board \{[\s\S]*?grid-template-columns: var\(--workflow-library-width\)/);
+});
+
+test("planning remains a compact ordered container inside the lighter sequence", () => {
+  assert.match(node, /data\.acceptsChildren/);
+  assert.match(node, /data\.onAddChild/);
+  assert.match(node, /aria-label="向执行计划添加步骤"/);
+  assert.match(node, /workflow-node-compact/);
+  assert.match(board, /reorderPlanItem/);
+  assert.match(styles, /\.workflow-plan-list \{/);
+  assert.match(globalStyles, /\.workflow-node-compact \{/);
+});
+
+test("development steps are distinct reusable workflow choices", () => {
+  assert.match(catalog, /\| "开发"/);
+  assert.match(catalog, /"第三方集成",\s+"开发",\s+"规划"/);
+  assert.match(
+    catalog,
+    /group: "开发",[\s\S]*?title: "自定义代码"[\s\S]*?kind: "custom-code"[\s\S]*?codeRuntime: "shell"[\s\S]*?codeContent: ""/,
+  );
+  assert.match(
+    catalog,
+    /group: "开发",[\s\S]*?title: "写测试"[\s\S]*?kind: "write-tests"/,
+  );
+  assert.match(
+    catalog,
+    /group: "开发",[\s\S]*?title: "运行测试"[\s\S]*?kind: "run-tests"[\s\S]*?testScope: "related"[\s\S]*?testCommand: ""/,
+  );
+  assert.match(node, /\| "development"/);
+  assert.match(board, /NESTABLE_TONES = new Set\(\[[\s\S]*?"development"[\s\S]*?\]\)/);
+});
+
+test("the step picker follows the catalog's canonical group order", () => {
+  assert.match(
+    picker,
+    /import \{[\s\S]*?WORKFLOW_GROUPS[\s\S]*?type PaletteItem[\s\S]*?\} from "\.\/workflowCatalog"/,
+  );
+  assert.doesNotMatch(picker, /const WORKFLOW_GROUPS\s*=/);
+  assert.match(
+    picker,
+    /WORKFLOW_GROUPS\.filter\(\(group\) => availableGroups\.has\(group\)\)/,
+  );
+});
+
+test("custom code stores an environment and source without executing it", () => {
+  assert.match(
+    catalog,
+    /CODE_RUNTIMES = \[[\s\S]*?value: "shell", label: "Shell"[\s\S]*?value: "javascript", label: "JavaScript"[\s\S]*?value: "python", label: "Python"/,
+  );
+  assert.match(
+    inspector,
+    /data\.kind === "custom-code"[\s\S]*?aria-label="代码运行环境"[\s\S]*?CODE_RUNTIMES\.map[\s\S]*?aria-label="代码内容"[\s\S]*?onChange=\{\(event\) => onChange\(\{ codeContent: event\.target\.value \}\)\}/,
+  );
+  assert.match(
+    catalog,
+    /if \(data\.kind === "custom-code"\)[\s\S]*?codeRuntime[\s\S]*?Boolean\(data\.codeContent\?\.trim\(\)\)/,
+  );
+  assert.match(
+    catalog,
+    /capabilityNodeMeta[\s\S]*?if \(data\.kind === "custom-code"\)[\s\S]*?`运行环境 · \$\{optionLabel\(CODE_RUNTIMES, data\.codeRuntime \?\? "shell"\)\}`/,
+  );
+  assert.doesNotMatch(
+    inspector,
+    /spawn|execFile|child_process|WebSocket|EventSource/,
+  );
+});
+
+test("run tests supports related, all and custom command scopes", () => {
+  assert.match(
+    catalog,
+    /TEST_SCOPES = \[[\s\S]*?value: "related", label: "相关测试"[\s\S]*?value: "all", label: "全部测试"[\s\S]*?value: "custom", label: "自定义命令"/,
+  );
+  assert.match(
+    inspector,
+    /data\.kind === "run-tests"[\s\S]*?aria-label="测试范围"[\s\S]*?TEST_SCOPES\.map[\s\S]*?data\.testScope === "custom"[\s\S]*?aria-label="测试命令"/,
+  );
+  assert.match(
+    catalog,
+    /if \(data\.kind === "run-tests"\)[\s\S]*?testScope === "custom"[\s\S]*?Boolean\(data\.testCommand\?\.trim\(\)\)[\s\S]*?return true/,
+  );
+  assert.match(
+    catalog,
+    /if \(data\.kind === "run-tests"\)[\s\S]*?optionLabel\(TEST_SCOPES/,
+  );
+  assert.match(
+    catalog,
+    /capabilityNodeMeta[\s\S]*?if \(data\.kind === "run-tests"\)[\s\S]*?`测试范围 · \$\{optionLabel\(TEST_SCOPES, data\.testScope \?\? "related"\)\}`/,
+  );
+});
+
+test("development settings use the shared snapshot persistence path", () => {
+  assert.match(inspector, /onChange\(\{ codeRuntime: event\.target\.value as WorkflowNodeData\["codeRuntime"\] \}\)/);
+  assert.match(inspector, /onChange\(\{ testScope: event\.target\.value as WorkflowNodeData\["testScope"\] \}\)/);
+  assert.match(
+    board,
+    /node\.id === selectedNodeId[\s\S]*?data: \{ \.\.\.node\.data, \.\.\.changes \}/,
+  );
+  assert.match(board, /nodes: snapshot\.nodes/);
+  assert.doesNotMatch(catalog, /testPassed|testResult|executionStatus|scriptOutput/);
+});
diff --git a/apps/codex-taskboard/web/index.html b/apps/codex-taskboard/web/index.html
new file mode 100644
index 000000000..80ea077f0
--- /dev/null
+++ b/apps/codex-taskboard/web/index.html
@@ -0,0 +1,18 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="color-scheme" content="light dark" />
+    <link rel="icon" href="/favicon.svg" type="image/svg+xml" />
+    <meta
+      name="description"
+      content="A focused issue board for turning plans into finished work with Codex."
+    />
+    <title>Taskboard</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
diff --git a/apps/codex-taskboard/web/public/Inter-LICENSE.txt b/apps/codex-taskboard/web/public/Inter-LICENSE.txt
new file mode 100644
index 000000000..9b2ca37b3
--- /dev/null
+++ b/apps/codex-taskboard/web/public/Inter-LICENSE.txt
@@ -0,0 +1,92 @@
+Copyright (c) 2016 The Inter Project Authors (https://github.com/rsms/inter)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION AND CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.
diff --git a/apps/codex-taskboard/web/public/InterVariable.woff2 b/apps/codex-taskboard/web/public/InterVariable.woff2
new file mode 100644
index 000000000..5a8d3e72a
Binary files /dev/null and b/apps/codex-taskboard/web/public/InterVariable.woff2 differ
diff --git a/apps/codex-taskboard/web/public/codex-agent-logo.png b/apps/codex-taskboard/web/public/codex-agent-logo.png
new file mode 100644
index 000000000..bd84e402e
Binary files /dev/null and b/apps/codex-taskboard/web/public/codex-agent-logo.png differ
diff --git a/apps/codex-taskboard/web/public/codex-app-icon.png b/apps/codex-taskboard/web/public/codex-app-icon.png
new file mode 100644
index 000000000..1c2b908ca
Binary files /dev/null and b/apps/codex-taskboard/web/public/codex-app-icon.png differ
diff --git a/apps/codex-taskboard/web/public/favicon.svg b/apps/codex-taskboard/web/public/favicon.svg
new file mode 100644
index 000000000..acc07acce
--- /dev/null
+++ b/apps/codex-taskboard/web/public/favicon.svg
@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
+  <rect width="32" height="32" rx="8" fill="#5e5ce6"/>
+  <rect x="7" y="7" width="7" height="7" rx="2" fill="white"/>
+  <rect x="18" y="7" width="7" height="7" rx="2" fill="white" fill-opacity=".72"/>
+  <rect x="7" y="18" width="7" height="7" rx="2" fill="white" fill-opacity=".72"/>
+  <rect x="18" y="18" width="7" height="7" rx="2" fill="white"/>
+</svg>
diff --git a/apps/codex-taskboard/web/src/App.tsx b/apps/codex-taskboard/web/src/App.tsx
new file mode 100644
index 000000000..452db4dda
--- /dev/null
+++ b/apps/codex-taskboard/web/src/App.tsx
@@ -0,0 +1,3666 @@
+import {
+  lazy,
+  Suspense,
+  useCallback,
+  useEffect,
+  useLayoutEffect,
+  useMemo,
+  useRef,
+  useState,
+  type CSSProperties,
+  type Dispatch,
+  type PointerEvent as ReactPointerEvent,
+  type SetStateAction,
+} from "react";
+import { createPortal } from "react-dom";
+import {
+  isAutomationModel,
+  isAutomationReasoningEffort,
+  isSupportedModelEffort,
+  type AutomationModel,
+  type AutomationReasoningEffort,
+} from "../../shared/taskboard-automation-options.mjs";
+import {
+  ApiError,
+  addTaskRelation,
+  archiveProject as archiveProjectRequest,
+  archiveTask as archiveTaskRequest,
+  createProject as createProjectRequest,
+  createTask as createTaskRequest,
+  deleteProject as deleteProjectRequest,
+  deleteTask as deleteTaskRequest,
+  getCodexThreadTitle,
+  getTaskboardRevision,
+  getWorkflowWorkspace,
+  getTaskboardMetadata,
+  listDevelopmentContexts,
+  listDeviceWorkspaces,
+  listProjects,
+  listTasks,
+  moveTask as moveTaskRequest,
+  removeTaskRelation,
+  restoreTask as restoreTaskRequest,
+  setCurrentUserActor,
+  syncCodexThreadTasks,
+  uploadAttachment,
+  updateTask as updateTaskRequest,
+} from "./api";
+import {
+  actorForAssigneeTarget,
+  assigneeTargetForActor,
+} from "./actors";
+import { BoardColumn, STATUS_DETAILS } from "./components/BoardColumn";
+import {
+  resolveInlineMediaMarkdown,
+  type PendingInlineImage,
+} from "./components/InlineMediaComposer";
+import { LinearIcon } from "./components/LinearIcon";
+import { buildIssueUrl, readIssueIdentifier } from "./issueRoute";
+import { DEFAULT_LABELS } from "./labels";
+import {
+  EMPTY_TASK_FILTERS,
+  matchesTaskFilters,
+  matchesTaskSearch,
+  readTaskFilters,
+  taskFilterCount,
+  writeTaskFilters,
+} from "./taskFilters";
+import {
+  TASK_STATUSES,
+  type ActorIdentity,
+  type DevelopmentScan,
+  type HostContext,
+  type IssueRelationType,
+  type Project,
+  type Task,
+  type TaskboardMetadata,
+  type TaskDraft,
+  type TaskStatus,
+  type WorkflowOption,
+} from "./types";
+import {
+  DEFAULT_WORKFLOW_OPTIONS,
+  readLegacyWorkflowWorkspace,
+  workflowOptionsFromWorkspace,
+} from "./workflowStore";
+// The poller stays in ESM JavaScript so its lifecycle can be tested directly with node:test.
+// @ts-expect-error The module's option contract is enforced by its focused node tests.
+import { createRevisionPoller, getRevisionPollingInterval } from "./revisionPolling.mjs";
+
+type ConnectionState = "connecting" | "live" | "reconnecting";
+type Theme = "light" | "dark";
+type BoardView = "issues" | "hierarchy" | "archive" | "workflow";
+const SHOW_WORKFLOW_BOARD_ENTRY = true;
+const DEFAULT_PROJECT_ID = "local";
+const NO_PROJECT_NAME = "无项目";
+
+function projectDisplayName(project: { id: string; name: string } | null | undefined) {
+  if (!project) return "";
+  return project.id === DEFAULT_PROJECT_ID ? NO_PROJECT_NAME : project.name;
+}
+
+const WorkflowBoard = lazy(() => import("./components/WorkflowBoard").then((module) => ({
+  default: module.WorkflowBoard,
+})));
+const AiChat = lazy(() => import("./components/AiChat").then((module) => ({
+  default: module.AiChat,
+})));
+const ArchivedIssues = lazy(() => import("./components/ArchivedIssues").then((module) => ({
+  default: module.ArchivedIssues,
+})));
+const BoardSettingsMenu = lazy(() => import("./components/BoardSettingsMenu").then((module) => ({
+  default: module.BoardSettingsMenu,
+})));
+const HiddenColumns = lazy(() => import("./components/HiddenColumns").then((module) => ({
+  default: module.HiddenColumns,
+})));
+const IssueHierarchyView = lazy(() => import("./components/IssueHierarchyView").then((module) => ({
+  default: module.IssueHierarchyView,
+})));
+const ProjectAutomationMenu = lazy(() => import("./components/ProjectAutomationMenu").then((module) => ({
+  default: module.ProjectAutomationMenu,
+})));
+const TaskContextMenu = lazy(() => import("./components/TaskContextMenu").then((module) => ({
+  default: module.TaskContextMenu,
+})));
+const TaskDetail = lazy(() => import("./components/TaskDetail").then((module) => ({
+  default: module.TaskDetail,
+})));
+const TaskEditor = lazy(() => import("./components/TaskEditor").then((module) => ({
+  default: module.TaskEditor,
+})));
+const TaskFilterMenu = lazy(() => import("./components/TaskFilterMenu").then((module) => ({
+  default: module.TaskFilterMenu,
+})));
+
+interface EditorState {
+  task: Task | null;
+  status: TaskStatus;
+  projectId?: string;
+}
+
+interface ContextMenuState {
+  taskId: string;
+  x: number;
+  y: number;
+}
+
+interface SelectionBox {
+  left: number;
+  top: number;
+  width: number;
+  height: number;
+}
+
+interface SelectionDragState {
+  startX: number;
+  startY: number;
+  pointerId: number;
+  additive: boolean;
+  active: boolean;
+  baseIds: Set<string>;
+}
+
+interface ProjectChoice {
+  id: string;
+  name: string;
+  workspacePath: string | null;
+  issueCount: number;
+  inCodex: boolean;
+  persisted: boolean;
+}
+
+function canManageProjectChoice(project: ProjectChoice) {
+  return project.persisted && project.id !== DEFAULT_PROJECT_ID;
+}
+
+interface UndoOperation {
+  id: number;
+  message: string;
+  undo: () => Promise<void>;
+}
+
+interface UndoNotice {
+  id: number;
+  message: string;
+}
+
+type ColumnVisibilityByProject = Record<string, Partial<Record<TaskStatus, boolean>>>;
+type ProjectAutomationStatus = "ACTIVE" | "PAUSED";
+type AutomationQuotaState = "available" | "blocked" | "unknown" | "unavailable";
+type AutomationIntervalMinutes = 5 | 10 | 15 | 30 | 60;
+
+interface AutomationQuotaStatus {
+  state: AutomationQuotaState;
+  checkedAt: number;
+  resetsAt?: number;
+  reason?: "api-key";
+}
+
+interface ProjectAutomationRecord {
+  automationId?: string;
+  codexProjectId: string;
+  status: ProjectAutomationStatus;
+  enabledByUser: boolean;
+  quotaAware: boolean;
+  quota?: AutomationQuotaStatus;
+  intervalMinutes: AutomationIntervalMinutes;
+  model: AutomationModel;
+  reasoningEffort: AutomationReasoningEffort;
+}
+
+type ProjectAutomations = Record<string, ProjectAutomationRecord>;
+
+interface AutomationHostItem {
+  id: string;
+  status: ProjectAutomationStatus;
+  model: AutomationModel;
+  reasoningEffort: AutomationReasoningEffort;
+  rrule: string;
+}
+
+interface AutomationHostResponse {
+  requestId: string;
+  ok: boolean;
+  item?: AutomationHostItem;
+  items?: AutomationHostItem[];
+  quota?: AutomationQuotaStatus;
+  policy?: {
+    automationId?: string;
+    enabledByUser: boolean;
+    quotaAware: boolean;
+    intervalMinutes: AutomationIntervalMinutes;
+    model: AutomationModel;
+    reasoningEffort: AutomationReasoningEffort;
+  };
+  error?: string;
+}
+
+interface PendingAutomationRequest {
+  resolve: (response: AutomationHostResponse) => void;
+  reject: (error: Error) => void;
+  timeoutId: number;
+}
+
+const DEFAULT_USER_ACTOR: ActorIdentity = {
+  type: "user",
+  id: "local-user",
+  name: "本地用户",
+  avatarUrl: null,
+};
+
+const LAST_PROJECT_KEY = "taskboard.lastProjectId";
+const FAVORITE_PROJECTS_KEY = "taskboard.favoriteProjectIds";
+const HIDDEN_PROJECTS_KEY = "taskboard.hiddenProjectIds.v1";
+const DEVICE_WORKSPACE_PATHS_KEY = "taskboard.deviceWorkspacePaths.v1";
+const SHOW_EMPTY_COLUMNS_KEY = "taskboard.showEmptyColumns.v1";
+const COLUMN_VISIBILITY_KEY = "taskboard.columnVisibility.v1";
+const PROJECT_AUTOMATIONS_KEY = "taskboard.projectAutomations.v1";
+const DEFAULT_AUTOMATION_OPTIONS = {
+  enabledByUser: false,
+  quotaAware: false,
+  intervalMinutes: 5,
+  model: "gpt-5.5",
+  reasoningEffort: "high",
+} as const;
+
+const EVENT_NAMES = [
+  "task.created",
+  "task.updated",
+  "task.moved",
+  "task.archived",
+  "task.restored",
+  "task.deleted",
+  "task.relation.updated",
+  "comment.created",
+  "comment.updated",
+  "comment.deleted",
+  "attachment.created",
+  "attachment.deleted",
+  "project.created",
+  "project.archived",
+  "project.deleted",
+  "workflow.updated",
+] as const;
+
+function isTheme(value: unknown): value is Theme {
+  return value === "light" || value === "dark";
+}
+
+function getInitialTheme(): Theme {
+  const fromQuery = new URLSearchParams(window.location.search).get("theme");
+  if (isTheme(fromQuery)) return fromQuery;
+  const stored = window.localStorage.getItem("taskboard.theme");
+  if (isTheme(stored)) return stored;
+  return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
+}
+
+function readFavoriteProjectIds(): Set<string> {
+  try {
+    const value = JSON.parse(window.localStorage.getItem(FAVORITE_PROJECTS_KEY) ?? "[]");
+    return new Set(Array.isArray(value) ? value.filter((item): item is string => typeof item === "string") : []);
+  } catch {
+    return new Set();
+  }
+}
+
+function readHiddenProjectIds(): Set<string> {
+  try {
+    const value = JSON.parse(window.localStorage.getItem(HIDDEN_PROJECTS_KEY) ?? "[]");
+    return new Set(Array.isArray(value) ? value.filter((item): item is string => typeof item === "string") : []);
+  } catch {
+    return new Set();
+  }
+}
+
+function writeStringSet(key: string, value: Set<string>) {
+  window.localStorage.setItem(key, JSON.stringify([...value]));
+}
+
+function sameStringSet(left: Set<string>, right: Set<string>) {
+  if (left.size !== right.size) return false;
+  for (const item of left) {
+    if (!right.has(item)) return false;
+  }
+  return true;
+}
+
+function readDeviceWorkspacePaths(): Record<string, string> {
+  try {
+    const value = JSON.parse(window.localStorage.getItem(DEVICE_WORKSPACE_PATHS_KEY) ?? "{}");
+    if (!value || typeof value !== "object" || Array.isArray(value)) return {};
+    return Object.fromEntries(Object.entries(value).filter((entry): entry is [string, string] => (
+      typeof entry[1] === "string" && entry[1].trim().length > 0
+    )));
+  } catch {
+    return {};
+  }
+}
+
+function readShowEmptyColumns(): boolean {
+  return window.localStorage.getItem(SHOW_EMPTY_COLUMNS_KEY) === "true";
+}
+
+function readProjectAutomations(): ProjectAutomations {
+  try {
+    const value = JSON.parse(window.localStorage.getItem(PROJECT_AUTOMATIONS_KEY) ?? "{}");
+    if (!value || typeof value !== "object" || Array.isArray(value)) return {};
+    const result: ProjectAutomations = {};
+    for (const [projectId, record] of Object.entries(value)) {
+      if (!record || typeof record !== "object" || Array.isArray(record)) continue;
+      const candidate = record as Partial<ProjectAutomationRecord>;
+      const model = candidate.model ?? "gpt-5.5";
+      const reasoningEffort = candidate.reasoningEffort ?? "high";
+      const enabledByUser = candidate.enabledByUser ?? candidate.status === "ACTIVE";
+      const quotaAware = candidate.quotaAware ?? false;
+      if (
+        (candidate.automationId !== undefined && typeof candidate.automationId !== "string")
+        || typeof candidate.codexProjectId !== "string"
+        || (candidate.status !== "ACTIVE" && candidate.status !== "PAUSED")
+        || !isAutomationIntervalMinutes(candidate.intervalMinutes ?? 5)
+        || !isAutomationModel(model)
+        || !isAutomationReasoningEffort(reasoningEffort)
+        || !isSupportedModelEffort(model, reasoningEffort)
+        || (candidate.status === "ACTIVE" && !candidate.automationId)
+        || typeof enabledByUser !== "boolean"
+        || typeof quotaAware !== "boolean"
+      ) continue;
+      const quota = isAutomationQuotaStatus(candidate.quota) ? candidate.quota : undefined;
+      result[projectId] = {
+        automationId: candidate.automationId,
+        codexProjectId: candidate.codexProjectId,
+        status: candidate.status,
+        enabledByUser,
+        quotaAware,
+        ...(quota ? { quota } : {}),
+        intervalMinutes: candidate.intervalMinutes ?? 5,
+        model,
+        reasoningEffort,
+      };
+    }
+    return result;
+  } catch {
+    return {};
+  }
+}
+
+function isAutomationQuotaStatus(value: unknown): value is AutomationQuotaStatus {
+  if (!value || typeof value !== "object" || Array.isArray(value)) return false;
+  const candidate = value as Partial<AutomationQuotaStatus>;
+  return (
+    (candidate.state === "available"
+      || candidate.state === "blocked"
+      || candidate.state === "unknown"
+      || candidate.state === "unavailable")
+    && Number.isFinite(candidate.checkedAt)
+    && (candidate.resetsAt === undefined || Number.isFinite(candidate.resetsAt))
+    && (candidate.reason === undefined || candidate.reason === "api-key")
+  );
+}
+
+function isAutomationHostPolicy(
+  value: AutomationHostResponse["policy"] | undefined,
+): value is NonNullable<AutomationHostResponse["policy"]> {
+  return Boolean(
+    value
+    && (value.automationId === undefined || typeof value.automationId === "string")
+    && typeof value.enabledByUser === "boolean"
+    && typeof value.quotaAware === "boolean"
+    && isAutomationIntervalMinutes(value.intervalMinutes)
+    && isAutomationModel(value.model)
+    && isAutomationReasoningEffort(value.reasoningEffort)
+    && isSupportedModelEffort(value.model, value.reasoningEffort),
+  );
+}
+
+function isAutomationIntervalMinutes(value: unknown): value is AutomationIntervalMinutes {
+  return value === 5 || value === 10 || value === 15 || value === 30 || value === 60;
+}
+
+function intervalMinutesFromRrule(value: string): AutomationIntervalMinutes | null {
+  const match = /^RRULE:FREQ=MINUTELY;INTERVAL=(5|10|15|30|60)$/.exec(value);
+  return match ? Number(match[1]) as AutomationIntervalMinutes : null;
+}
+
+function readColumnVisibilityByProject(): ColumnVisibilityByProject {
+  try {
+    const value = JSON.parse(window.localStorage.getItem(COLUMN_VISIBILITY_KEY) ?? "{}");
+    if (!value || typeof value !== "object" || Array.isArray(value)) return {};
+    const result: ColumnVisibilityByProject = {};
+    for (const [projectId, visibilityValue] of Object.entries(value)) {
+      if (!visibilityValue || typeof visibilityValue !== "object" || Array.isArray(visibilityValue)) continue;
+      const visibility: Partial<Record<TaskStatus, boolean>> = {};
+      for (const status of TASK_STATUSES) {
+        const visible = (visibilityValue as Record<string, unknown>)[status];
+        if (typeof visible === "boolean") visibility[status] = visible;
+      }
+      result[projectId] = visibility;
+    }
+    return result;
+  } catch {
+    return {};
+  }
+}
+
+function workspaceName(path?: string): string | null {
+  if (!path) return null;
+  const parts = path.split(/[\\/]/).filter(Boolean);
+  return parts.at(-1) ?? path;
+}
+
+function errorMessage(error: unknown): string {
+  if (error instanceof ApiError) return error.message;
+  if (error instanceof Error) return error.message;
+  return "Something went wrong while loading your issues.";
+}
+
+function isAutomationHostItem(value: unknown): value is AutomationHostItem {
+  if (!value || typeof value !== "object" || Array.isArray(value)) return false;
+  const item = value as Partial<AutomationHostItem>;
+  return (
+    typeof item.id === "string"
+    && (item.status === "ACTIVE" || item.status === "PAUSED")
+    && isAutomationModel(item.model)
+    && isAutomationReasoningEffort(item.reasoningEffort)
+    && isSupportedModelEffort(item.model, item.reasoningEffort)
+    && typeof item.rrule === "string"
+    && intervalMinutesFromRrule(item.rrule) !== null
+  );
+}
+
+function isLocalTaskboardOrigin(origin: string): boolean {
+  try {
+    const { protocol, hostname } = new URL(origin);
+    return (protocol === "http:" || protocol === "https:")
+      && (hostname === "127.0.0.1" || hostname === "localhost");
+  } catch {
+    return false;
+  }
+}
+
+function sortTasks(tasks: Task[]): Task[] {
+  return [...tasks].sort(
+    (left, right) => left.sortOrder - right.sortOrder || left.createdAt.localeCompare(right.createdAt),
+  );
+}
+
+function compareTasksByBoardPosition(left: Task, right: Task): number {
+  const statusDelta = TASK_STATUSES.indexOf(left.status) - TASK_STATUSES.indexOf(right.status);
+  return statusDelta || left.sortOrder - right.sortOrder || left.createdAt.localeCompare(right.createdAt);
+}
+
+function calculateGroupSortOrders(previousTask: Task | null, nextTask: Task | null, count: number): number[] {
+  if (count <= 0) return [];
+  if (previousTask && nextTask) {
+    const step = (nextTask.sortOrder - previousTask.sortOrder) / (count + 1);
+    return Array.from({ length: count }, (_, index) => previousTask.sortOrder + step * (index + 1));
+  }
+  if (previousTask) {
+    return Array.from({ length: count }, (_, index) => previousTask.sortOrder + 1024 * (index + 1));
+  }
+  if (nextTask) {
+    return Array.from({ length: count }, (_, index) => nextTask.sortOrder - 1024 * (count - index));
+  }
+  return Array.from({ length: count }, (_, index) => 1024 * (index + 1));
+}
+
+function taskToDraft(task: Task): TaskDraft {
+  return {
+    title: task.title,
+    description: task.description,
+    status: task.status,
+    priority: task.priority,
+    labels: task.labels,
+    workflowId: task.workflowId,
+    developmentContext: task.developmentContext,
+    dueDate: task.dueDate,
+    recurrence: task.recurrence,
+  };
+}
+
+interface LocalRealtimeSyncProps {
+  selectedProjectId: string;
+  detailTaskId: string | null;
+  refreshProjectList: () => Promise<void>;
+  refreshTasks: (
+    projectId: string,
+    options?: { quiet?: boolean; signal?: AbortSignal },
+  ) => Promise<void>;
+  refreshWorkflowOptions: (projectId: string, signal?: AbortSignal) => Promise<void>;
+  setConnection: Dispatch<SetStateAction<ConnectionState>>;
+  setCommentsRevision: Dispatch<SetStateAction<number>>;
+  setAttachmentsRevision: Dispatch<SetStateAction<number>>;
+}
+
+function LocalRealtimeSync({
+  selectedProjectId,
+  detailTaskId,
+  refreshProjectList,
+  refreshTasks,
+  refreshWorkflowOptions,
+  setConnection,
+  setCommentsRevision,
+  setAttachmentsRevision,
+}: LocalRealtimeSyncProps) {
+  useEffect(() => {
+    const source = new EventSource("/api/events");
+    let refreshTimer: number | undefined;
+    let refreshProjectsPending = false;
+    let refreshTasksPending = false;
+
+    const scheduleRefresh = (options: { projects?: boolean; tasks?: boolean }) => {
+      refreshProjectsPending ||= options.projects === true;
+      refreshTasksPending ||= options.tasks === true;
+      window.clearTimeout(refreshTimer);
+      refreshTimer = window.setTimeout(() => {
+        if (refreshProjectsPending) void refreshProjectList();
+        if (refreshTasksPending && selectedProjectId) {
+          void refreshTasks(selectedProjectId, { quiet: true });
+        }
+        refreshProjectsPending = false;
+        refreshTasksPending = false;
+      }, 120);
+    };
+
+    const handleEvent = (event: Event) => {
+      const message = event as MessageEvent<string>;
+      let payload: { projectId?: string; previousProjectId?: string; taskId?: string } = {};
+      try {
+        payload = JSON.parse(message.data) as { projectId?: string; previousProjectId?: string; taskId?: string };
+      } catch {
+        // A malformed event should not interrupt later updates.
+      }
+      const affectsSelectedProject = Boolean(selectedProjectId)
+        && (
+          !payload.projectId
+          || payload.projectId === selectedProjectId
+          || payload.previousProjectId === selectedProjectId
+        );
+      if (event.type.startsWith("project.")) {
+        scheduleRefresh({ projects: true });
+        return;
+      }
+      if (event.type.startsWith("task.")) {
+        scheduleRefresh({ projects: true, tasks: affectsSelectedProject });
+        return;
+      }
+      if (!affectsSelectedProject) return;
+      if (event.type === "workflow.updated") {
+        if (selectedProjectId) void refreshWorkflowOptions(selectedProjectId);
+        return;
+      }
+      if (event.type.startsWith("comment.")) {
+        if (!detailTaskId || !payload.taskId || payload.taskId === detailTaskId) {
+          setCommentsRevision((current) => current + 1);
+        }
+        scheduleRefresh({ tasks: true });
+        return;
+      }
+      if (event.type.startsWith("attachment.")) {
+        if (!detailTaskId || !payload.taskId || payload.taskId === detailTaskId) {
+          setAttachmentsRevision((current) => current + 1);
+          setCommentsRevision((current) => current + 1);
+        }
+      }
+    };
+
+    EVENT_NAMES.forEach((name) => source.addEventListener(name, handleEvent));
+    source.onopen = () => {
+      setConnection("live");
+      scheduleRefresh({ projects: true, tasks: Boolean(selectedProjectId) });
+      if (selectedProjectId) void refreshWorkflowOptions(selectedProjectId);
+      if (detailTaskId) {
+        setCommentsRevision((current) => current + 1);
+        setAttachmentsRevision((current) => current + 1);
+      }
+    };
+    source.onerror = () => setConnection("reconnecting");
+
+    return () => {
+      window.clearTimeout(refreshTimer);
+      EVENT_NAMES.forEach((name) => source.removeEventListener(name, handleEvent));
+      source.close();
+    };
+  }, [
+    detailTaskId,
+    refreshProjectList,
+    refreshTasks,
+    refreshWorkflowOptions,
+    selectedProjectId,
+    setAttachmentsRevision,
+    setCommentsRevision,
+    setConnection,
+  ]);
+
+  return null;
+}
+
+export function App() {
+  const query = useMemo(() => new URLSearchParams(window.location.search), []);
+  const embedded = query.get("host") === "codex";
+  const undoShortcut = navigator.userAgent.includes("Macintosh") ? "⌘Z" : "Ctrl+Z";
+  const [theme, setTheme] = useState<Theme>(getInitialTheme);
+  const [hostContext, setHostContext] = useState<HostContext | null>(null);
+  const [developmentScan, setDevelopmentScan] = useState<DevelopmentScan>({ workspacePath: null, contexts: [] });
+  const [developmentScanLoading, setDevelopmentScanLoading] = useState(false);
+  const [manageTaskboardSkillPath, setManageTaskboardSkillPath] = useState("");
+  const [taskboardMetadata, setTaskboardMetadata] = useState<TaskboardMetadata | null>(null);
+  const [localAiChatAvailable, setLocalAiChatAvailable] = useState(false);
+  const [projects, setProjects] = useState<Project[]>([]);
+  const [selectedProjectId, setSelectedProjectId] = useState("");
+  const [tasks, setTasks] = useState<Task[]>([]);
+  const [projectsLoading, setProjectsLoading] = useState(true);
+  const [tasksLoading, setTasksLoading] = useState(false);
+  const [hasLoadedTasks, setHasLoadedTasks] = useState(false);
+  const [loadError, setLoadError] = useState<string | null>(null);
+  const [actionError, setActionError] = useState<string | null>(null);
+  const [connection, setConnection] = useState<ConnectionState>("connecting");
+  const [search, setSearch] = useState("");
+  const [filters, setFilters] = useState(readTaskFilters);
+  const [showEmptyColumns, setShowEmptyColumns] = useState(readShowEmptyColumns);
+  const [columnVisibilityByProject, setColumnVisibilityByProject] = useState(readColumnVisibilityByProject);
+  const [boardView, setBoardView] = useState<BoardView>("issues");
+  const [editor, setEditor] = useState<EditorState | null>(null);
+  const [detailTaskIdentifier, setDetailTaskIdentifier] = useState<string | null>(
+    () => readIssueIdentifier(window.location.search),
+  );
+  const [commentsRevision, setCommentsRevision] = useState(0);
+  const [attachmentsRevision, setAttachmentsRevision] = useState(0);
+  const [workflowRevision, setWorkflowRevision] = useState(0);
+  const [workflowOptions, setWorkflowOptions] = useState<WorkflowOption[]>(DEFAULT_WORKFLOW_OPTIONS);
+  const [contextMenu, setContextMenu] = useState<ContextMenuState | null>(null);
+  const [selectedProjectIds, setSelectedProjectIds] = useState<Set<string>>(() => new Set());
+  const [selectedTaskIds, setSelectedTaskIds] = useState<Set<string>>(() => new Set());
+  const [projectSelectionBox, setProjectSelectionBox] = useState<SelectionBox | null>(null);
+  const [selectionBox, setSelectionBox] = useState<SelectionBox | null>(null);
+  const [draggedTaskId, setDraggedTaskId] = useState<string | null>(null);
+  const [draggedTaskIds, setDraggedTaskIds] = useState<string[]>([]);
+  const [draggedTaskHeight, setDraggedTaskHeight] = useState(0);
+  const [dropTarget, setDropTarget] = useState<TaskStatus | null>(null);
+  const [movingTaskId, setMovingTaskId] = useState<string | null>(null);
+  const [settlingTaskId, setSettlingTaskId] = useState<string | null>(null);
+  const [restoringArchivedTaskId, setRestoringArchivedTaskId] = useState<string | null>(null);
+  const [pendingArchivedDeleteTask, setPendingArchivedDeleteTask] = useState<Task | null>(null);
+  const [pendingBulkDeleteTasks, setPendingBulkDeleteTasks] = useState<Task[]>([]);
+  const [bulkArchivingSelectedTasks, setBulkArchivingSelectedTasks] = useState(false);
+  const [bulkDeletingSelectedTasks, setBulkDeletingSelectedTasks] = useState(false);
+  const [deletingArchivedTask, setDeletingArchivedTask] = useState(false);
+  const [projectActionPending, setProjectActionPending] = useState<"archive" | "delete" | null>(null);
+  const [openingProjectId, setOpeningProjectId] = useState<string | null>(null);
+  const [openingThreadTaskId, setOpeningThreadTaskId] = useState<string | null>(null);
+  const [projectMenuOpen, setProjectMenuOpen] = useState(false);
+  const [bulkProjectMoveMenuOpen, setBulkProjectMoveMenuOpen] = useState(false);
+  const [bulkProjectMoveMenuPosition, setBulkProjectMoveMenuPosition] = useState({ left: 0, top: 0, ready: false });
+  const [favoriteProjectIds, setFavoriteProjectIds] = useState(readFavoriteProjectIds);
+  const [hiddenProjectIds, setHiddenProjectIds] = useState(readHiddenProjectIds);
+  const [deviceWorkspacePaths, setDeviceWorkspacePaths] = useState(readDeviceWorkspacePaths);
+  const [projectAutomations, setProjectAutomations] = useState(readProjectAutomations);
+  const [automationPending, setAutomationPending] = useState(false);
+  const [automationError, setAutomationError] = useState<string | null>(null);
+  const [announcement, setAnnouncementValue] = useState("");
+  const [undoNotice, setUndoNotice] = useState<UndoNotice | null>(null);
+  const tasksRequestRef = useRef(0);
+  const projectsRef = useRef<Project[]>([]);
+  const tasksRef = useRef<Task[]>([]);
+  const undoSequenceRef = useRef(0);
+  const undoStackRef = useRef<UndoOperation[]>([]);
+  const undoInFlightRef = useRef(false);
+  const codexThreadTitleCacheRef = useRef(new Map<string, string>());
+  const lastCodexThreadSyncRef = useRef("");
+  const dragRegionRef = useRef<HTMLDivElement>(null);
+  const projectSelectionDragRef = useRef<SelectionDragState | null>(null);
+  const selectionDragRef = useRef<SelectionDragState | null>(null);
+  const bulkProjectMoveTriggerRef = useRef<HTMLButtonElement>(null);
+  const bulkProjectMoveMenuRef = useRef<HTMLDivElement>(null);
+  const selectedProjectIdRef = useRef(selectedProjectId);
+  selectedProjectIdRef.current = selectedProjectId;
+  projectsRef.current = projects;
+
+  const revisionPollingInterval = getRevisionPollingInterval(taskboardMetadata);
+  const pendingAutomationRequestsRef = useRef(new Map<string, PendingAutomationRequest>());
+  const automationRequestInFlightRef = useRef(false);
+  const projectAutomationsRef = useRef(projectAutomations);
+
+  const setAnnouncement = useCallback((message: string) => {
+    setUndoNotice(null);
+    setAnnouncementValue(message);
+  }, []);
+
+  const updateHiddenProjectIds = useCallback((updater: (current: Set<string>) => Set<string>) => {
+    setHiddenProjectIds((current) => {
+      const next = updater(new Set(current));
+      if (sameStringSet(next, current)) return current;
+      writeStringSet(HIDDEN_PROJECTS_KEY, next);
+      return next;
+    });
+  }, []);
+
+  const reconcileProjectListState = useCallback((nextProjects: Project[]) => {
+    const nextProjectIds = new Set(nextProjects.map((project) => project.id));
+    const previousProjectIds = new Set(projectsRef.current.map((project) => project.id));
+    updateHiddenProjectIds((current) => {
+      for (const projectId of previousProjectIds) {
+        if (!nextProjectIds.has(projectId) && projectId !== DEFAULT_PROJECT_ID) current.add(projectId);
+      }
+      for (const projectId of nextProjectIds) current.delete(projectId);
+      return current;
+    });
+    setSelectedProjectIds((current) => {
+      if (current.size === 0) return current;
+      const next = new Set([...current].filter((projectId) => nextProjectIds.has(projectId)));
+      return sameStringSet(next, current) ? current : next;
+    });
+  }, [updateHiddenProjectIds]);
+
+  const forgetProjects = useCallback((projectIds: string[]) => {
+    const ids = new Set(projectIds);
+    if (ids.size === 0) return;
+    setFavoriteProjectIds((current) => {
+      const next = new Set([...current].filter((projectId) => !ids.has(projectId)));
+      if (sameStringSet(next, current)) return current;
+      writeStringSet(FAVORITE_PROJECTS_KEY, next);
+      return next;
+    });
+    setDeviceWorkspacePaths((current) => {
+      let changed = false;
+      const next = { ...current };
+      for (const projectId of ids) {
+        if (projectId in next) {
+          delete next[projectId];
+          changed = true;
+        }
+      }
+      if (!changed) return current;
+      window.localStorage.setItem(DEVICE_WORKSPACE_PATHS_KEY, JSON.stringify(next));
+      return next;
+    });
+    setProjectAutomations((current) => {
+      let changed = false;
+      const next = { ...current };
+      for (const projectId of ids) {
+        if (projectId in next) {
+          delete next[projectId];
+          changed = true;
+        }
+      }
+      if (!changed) return current;
+      window.localStorage.setItem(PROJECT_AUTOMATIONS_KEY, JSON.stringify(next));
+      return next;
+    });
+    updateHiddenProjectIds((current) => {
+      for (const projectId of ids) current.add(projectId);
+      return current;
+    });
+    const rememberedProjectId = window.localStorage.getItem(LAST_PROJECT_KEY);
+    if (rememberedProjectId && ids.has(rememberedProjectId)) {
+      window.localStorage.removeItem(LAST_PROJECT_KEY);
+    }
+  }, [updateHiddenProjectIds]);
+
+  const rememberDeviceWorkspacePath = useCallback((projectId: string, workspacePath: string) => {
+    const normalizedPath = workspacePath.trim();
+    setDeviceWorkspacePaths((current) => {
+      if (current[projectId] === normalizedPath || (!normalizedPath && !(projectId in current))) {
+        return current;
+      }
+      const next = { ...current };
+      if (normalizedPath) next[projectId] = normalizedPath;
+      else delete next[projectId];
+      window.localStorage.setItem(DEVICE_WORKSPACE_PATHS_KEY, JSON.stringify(next));
+      return next;
+    });
+  }, []);
+
+  const mergeDeviceWorkspacePaths = useCallback((workspaces: Record<string, string>) => {
+    setDeviceWorkspacePaths((current) => {
+      const next = { ...current, ...workspaces };
+      if (JSON.stringify(next) === JSON.stringify(current)) return current;
+      window.localStorage.setItem(DEVICE_WORKSPACE_PATHS_KEY, JSON.stringify(next));
+      return next;
+    });
+  }, []);
+
+  const selectedProject = projects.find((project) => project.id === selectedProjectId) ?? null;
+  const selectedHostProject = hostContext?.projects?.find((project) => project.id === selectedProjectId);
+  const selectedProjectDisplayName = selectedProject
+    ? projectDisplayName({ ...selectedProject, name: selectedHostProject?.name ?? selectedProject.name })
+    : "";
+  const currentUser = hostContext?.user ?? DEFAULT_USER_ACTOR;
+  const selectedDeviceWorkspacePath = deviceWorkspacePaths[selectedProjectId];
+  const selectedProjectAutomation = projectAutomations[selectedProjectId];
+  const automationProjectContext = useMemo(() => {
+    if (!embedded || window.parent === window) {
+      return { unavailableReason: "仅可在 Codex App 中使用" };
+    }
+    if (!isLocalTaskboardOrigin(window.location.origin)) {
+      return { unavailableReason: "仅本地任务面板可用" };
+    }
+    if (!selectedProject) return { unavailableReason: "请先选择项目" };
+
+    const directCodexProject = hostContext?.projects?.some(
+      (project) => project.id === selectedProject.id,
+    );
+    const workspacePath = deviceWorkspacePaths[selectedProject.id]
+      ?? selectedProject.workspacePath
+      ?? (
+        directCodexProject && hostContext?.projectId === selectedProject.id
+          ? hostContext.workspacePath
+          : undefined
+      );
+    const codexProjectId = directCodexProject
+      ? selectedProject.id
+      : hostContext?.projects?.find(
+        (project) => deviceWorkspacePaths[project.id] === workspacePath,
+      )?.id;
+
+    if (!workspacePath || !codexProjectId) {
+      return { unavailableReason: "请先在 Codex 中添加并映射该项目目录" };
+    }
+    if (!manageTaskboardSkillPath) {
+      return { unavailableReason: "任务面板还没有读取到 Skill 路径" };
+    }
+    return { workspacePath, codexProjectId, unavailableReason: null };
+  }, [
+    deviceWorkspacePaths,
+    embedded,
+    hostContext,
+    manageTaskboardSkillPath,
+    selectedProject,
+  ]);
+  const syncCodexProjectId = automationProjectContext.codexProjectId ?? "";
+  const detailTask = detailTaskIdentifier
+    ? tasks.find((task) => task.identifier === detailTaskIdentifier) ?? null
+    : null;
+  const detailTaskId = detailTask?.id ?? null;
+  const contextMenuTask = contextMenu
+    ? tasks.find((task) => task.id === contextMenu.taskId) ?? null
+    : null;
+  const availableLabels = useMemo(
+    () => [...new Set([
+      ...DEFAULT_LABELS.map((label) => label.name),
+      ...tasks.flatMap((task) => task.labels),
+    ])],
+    [tasks],
+  );
+  const projectChoices = useMemo<ProjectChoice[]>(() => {
+    const persistedById = new Map(projects.map((project) => [project.id, project]));
+    const seen = new Set<string>();
+    const choices: ProjectChoice[] = [];
+    for (const project of hostContext?.projects ?? []) {
+      if (!project.id || !project.name || seen.has(project.id) || hiddenProjectIds.has(project.id)) continue;
+      const persisted = persistedById.get(project.id);
+      seen.add(project.id);
+      choices.push({
+        id: project.id,
+        name: projectDisplayName({ id: project.id, name: project.name }),
+        workspacePath: deviceWorkspacePaths[project.id]
+          ?? persisted?.workspacePath
+          ?? (hostContext?.projectId === project.id ? hostContext.workspacePath ?? null : null),
+        issueCount: persisted?.issueCount ?? 0,
+        inCodex: true,
+        persisted: Boolean(persisted),
+      });
+    }
+    for (const project of projects) {
+      if (seen.has(project.id)) continue;
+      choices.push({
+        id: project.id,
+        name: projectDisplayName(project),
+        workspacePath: deviceWorkspacePaths[project.id] ?? project.workspacePath ?? null,
+        issueCount: project.issueCount,
+        inCodex: false,
+        persisted: true,
+      });
+    }
+    return choices.sort((left, right) => (
+      Number(favoriteProjectIds.has(right.id)) - Number(favoriteProjectIds.has(left.id))
+    ));
+  }, [
+    deviceWorkspacePaths,
+    favoriteProjectIds,
+    hiddenProjectIds,
+    hostContext?.projectId,
+    hostContext?.projects,
+    hostContext?.workspacePath,
+    projects,
+  ]);
+  const projectsWithIssues = useMemo(
+    () => projectChoices.filter((project) => project.issueCount > 0),
+    [projectChoices],
+  );
+  const projectsWithoutIssues = useMemo(
+    () => projectChoices.filter((project) => project.issueCount === 0),
+    [projectChoices],
+  );
+  const closeContextMenu = useCallback(() => setContextMenu(null), []);
+
+  const writeProjectAutomation = useCallback((
+    projectId: string,
+    record: ProjectAutomationRecord | null | undefined,
+  ) => {
+    setProjectAutomations((current) => {
+      if (
+        record
+        && current[projectId]?.automationId === record.automationId
+        && current[projectId]?.codexProjectId === record.codexProjectId
+        && current[projectId]?.status === record.status
+        && current[projectId]?.enabledByUser === record.enabledByUser
+        && current[projectId]?.quotaAware === record.quotaAware
+        && JSON.stringify(current[projectId]?.quota) === JSON.stringify(record.quota)
+        && current[projectId]?.intervalMinutes === record.intervalMinutes
+        && current[projectId]?.model === record.model
+        && current[projectId]?.reasoningEffort === record.reasoningEffort
+      ) {
+        return current;
+      }
+      const next = { ...current };
+      if (record) next[projectId] = record;
+      else delete next[projectId];
+      projectAutomationsRef.current = next;
+      window.localStorage.setItem(PROJECT_AUTOMATIONS_KEY, JSON.stringify(next));
+      return next;
+    });
+  }, []);
+
+  const sendAutomationRequest = useCallback((
+    operation: "ensure-active" | "pause" | "list" | "apply-policy",
+    options: Pick<
+      ProjectAutomationRecord,
+      "enabledByUser" | "quotaAware" | "intervalMinutes" | "model" | "reasoningEffort"
+    >,
+    automationId?: string,
+  ) => {
+    if (
+      !selectedProject
+      || !automationProjectContext.codexProjectId
+      || !automationProjectContext.workspacePath
+    ) {
+      return Promise.reject(new Error(
+        automationProjectContext.unavailableReason ?? "无法读取项目自动化信息",
+      ));
+    }
+    const requestId = window.crypto.randomUUID();
+    const response = new Promise<AutomationHostResponse>((resolve, reject) => {
+      const timeoutId = window.setTimeout(() => {
+        pendingAutomationRequestsRef.current.delete(requestId);
+        reject(new Error("Codex 自动化没有响应，请稍后重试"));
+      }, 10_000);
+      pendingAutomationRequestsRef.current.set(requestId, { resolve, reject, timeoutId });
+    });
+    window.parent.postMessage({
+      type: "taskboard:automation-request",
+      payload: {
+        requestId,
+        operation,
+        taskboardProjectId: selectedProjectId,
+        codexProjectId: automationProjectContext.codexProjectId,
+        projectName: selectedProjectDisplayName,
+        workspacePath: automationProjectContext.workspacePath,
+        skillPath: manageTaskboardSkillPath,
+        ...(automationId ? { automationId } : {}),
+        enabledByUser: options.enabledByUser,
+        quotaAware: options.quotaAware,
+        intervalMinutes: options.intervalMinutes,
+        model: options.model,
+        reasoningEffort: options.reasoningEffort,
+      },
+    }, "*");
+    return response;
+  }, [
+    automationProjectContext,
+    manageTaskboardSkillPath,
+    selectedProject,
+    selectedProjectDisplayName,
+    selectedProjectId,
+  ]);
+
+  const reconcileProjectAutomation = useCallback(async () => {
+    if (automationProjectContext.unavailableReason) {
+      setAutomationError(null);
+      return;
+    }
+    if (!selectedProjectId || !automationProjectContext.codexProjectId || automationRequestInFlightRef.current) return;
+    const stored = projectAutomationsRef.current[selectedProjectId];
+    automationRequestInFlightRef.current = true;
+    setAutomationPending(true);
+    setAutomationError(null);
+    try {
+      const options = stored ?? {
+        status: "PAUSED" as const,
+        ...DEFAULT_AUTOMATION_OPTIONS,
+      };
+      const response = await sendAutomationRequest(
+        stored ? "apply-policy" : "list",
+        options,
+        stored?.automationId,
+      );
+      const items = Array.isArray(response.items)
+        ? response.items.filter(isAutomationHostItem)
+        : [];
+      if (!stored) {
+        const policy = isAutomationHostPolicy(response.policy) ? response.policy : null;
+        if (!policy) return;
+        const item = items.find((candidate) => candidate.id === policy.automationId)
+          ?? (items.length === 1 ? items[0] : undefined);
+        writeProjectAutomation(selectedProjectId, {
+          automationId: item?.id ?? policy.automationId,
+          codexProjectId: automationProjectContext.codexProjectId,
+          status: item?.status ?? "PAUSED",
+          enabledByUser: policy.enabledByUser,
+          quotaAware: policy.quotaAware,
+          intervalMinutes: policy.intervalMinutes,
+          model: policy.model,
+          reasoningEffort: policy.reasoningEffort,
+        });
+        return;
+      }
+      const item = (isAutomationHostItem(response.item) ? response.item : undefined)
+        ?? items.find((item) => item.id === stored?.automationId)
+        ?? (items.length === 1 ? items[0] : undefined);
+      if (!item) {
+        if (stored) {
+          writeProjectAutomation(selectedProjectId, {
+            ...stored,
+            automationId: undefined,
+            status: "PAUSED",
+            ...(response.quota ? { quota: response.quota } : {}),
+          });
+        }
+        return;
+      }
+      const intervalMinutes = intervalMinutesFromRrule(item.rrule);
+      if (!intervalMinutes) return;
+      writeProjectAutomation(selectedProjectId, {
+        automationId: item.id,
+        codexProjectId: automationProjectContext.codexProjectId,
+        status: item.status,
+        enabledByUser: stored.enabledByUser,
+        quotaAware: stored.quotaAware,
+        ...(response.quota ? { quota: response.quota } : {}),
+        intervalMinutes,
+        model: item.model,
+        reasoningEffort: item.reasoningEffort,
+      });
+    } catch (error) {
+      setAutomationError(error instanceof Error ? error.message : "无法读取自动化状态");
+    } finally {
+      automationRequestInFlightRef.current = false;
+      setAutomationPending(false);
+    }
+  }, [
+    automationProjectContext,
+    selectedProjectId,
+    sendAutomationRequest,
+    writeProjectAutomation,
+  ]);
+
+  const saveProjectAutomation = useCallback(async (options: {
+    enabledByUser: boolean;
+    quotaAware: boolean;
+    intervalMinutes: AutomationIntervalMinutes;
+    model: AutomationModel;
+    reasoningEffort: AutomationReasoningEffort;
+  }) => {
+    const stored = projectAutomations[selectedProjectId];
+    if (
+      !selectedProjectId
+      || automationProjectContext.unavailableReason
+      || !automationProjectContext.codexProjectId
+      || automationRequestInFlightRef.current
+    ) return;
+    const previousRecord = stored;
+    automationRequestInFlightRef.current = true;
+    setAutomationPending(true);
+    setAutomationError(null);
+    try {
+      const response = await sendAutomationRequest("apply-policy", options, stored?.automationId);
+      const item = isAutomationHostItem(response.item) ? response.item : undefined;
+      writeProjectAutomation(selectedProjectId, {
+        automationId: item?.id,
+        codexProjectId: automationProjectContext.codexProjectId,
+        status: item?.status ?? "PAUSED",
+        enabledByUser: options.enabledByUser,
+        quotaAware: options.quotaAware,
+        ...(response.quota ? { quota: response.quota } : {}),
+        intervalMinutes: options.intervalMinutes,
+        model: options.model,
+        reasoningEffort: options.reasoningEffort,
+      });
+    } catch (error) {
+      writeProjectAutomation(selectedProjectId, previousRecord);
+      setAutomationError(error instanceof Error ? error.message : "无法更新自动化");
+    } finally {
+      automationRequestInFlightRef.current = false;
+      setAutomationPending(false);
+    }
+  }, [
+    automationProjectContext,
+    projectAutomations,
+    selectedProjectId,
+    sendAutomationRequest,
+    writeProjectAutomation,
+  ]);
+
+  function openTaskDetail(task: Pick<Task, "identifier" | "projectId">) {
+    closeContextMenu();
+    setProjectMenuOpen(false);
+    setBulkProjectMoveMenuOpen(false);
+    setPendingBulkDeleteTasks([]);
+    setDetailTaskIdentifier(task.identifier);
+    const currentIssue = readIssueIdentifier(window.location.search);
+    const boardUrl = buildIssueUrl(window.location.href, task.projectId, null);
+    if (!currentIssue) {
+      window.history.replaceState(window.history.state, "", boardUrl);
+    }
+    const detailUrl = buildIssueUrl(
+      currentIssue ? window.location.href : boardUrl.href,
+      task.projectId,
+      task.identifier,
+    );
+    window.history.pushState(window.history.state, "", detailUrl);
+  }
+
+  function closeTaskDetail() {
+    setPendingBulkDeleteTasks([]);
+    setDetailTaskIdentifier(null);
+    const url = buildIssueUrl(window.location.href, selectedProjectId || null, null);
+    window.history.replaceState(window.history.state, "", url);
+  }
+
+  useEffect(() => {
+    function syncRouteFromLocation() {
+      const url = new URL(window.location.href);
+      const routeProjectId = url.searchParams.get("project") ?? "";
+      setDetailTaskIdentifier(readIssueIdentifier(url.search));
+      if (routeProjectId === selectedProjectId) return;
+      setBoardView("issues");
+      setPendingBulkDeleteTasks([]);
+      setSelectedProjectId(routeProjectId);
+      if (routeProjectId) window.localStorage.setItem(LAST_PROJECT_KEY, routeProjectId);
+      else window.localStorage.removeItem(LAST_PROJECT_KEY);
+    }
+
+    window.addEventListener("popstate", syncRouteFromLocation);
+    return () => window.removeEventListener("popstate", syncRouteFromLocation);
+  }, [selectedProjectId]);
+
+  useEffect(() => {
+    document.documentElement.dataset.theme = theme;
+    document.documentElement.dataset.embedded = String(embedded);
+    document.documentElement.style.colorScheme = theme;
+    if (!embedded) window.localStorage.setItem("taskboard.theme", theme);
+  }, [embedded, theme]);
+
+  useEffect(() => {
+    writeTaskFilters(filters);
+  }, [filters]);
+
+  useEffect(() => {
+    tasksRef.current = tasks;
+  }, [tasks]);
+
+  useEffect(() => {
+    setSelectedTaskIds((current) => {
+      if (current.size === 0) return current;
+      const availableTaskIds = new Set(tasks.map((task) => task.id));
+      const next = new Set([...current].filter((taskId) => availableTaskIds.has(taskId)));
+      return next.size === current.size ? current : next;
+    });
+  }, [tasks]);
+
+  useEffect(() => {
+    if (!projectMenuOpen) return;
+    function closeProjectMenu(event: PointerEvent) {
+      const target = event.target as HTMLElement;
+      if (!target.closest("[data-project-switcher]")) setProjectMenuOpen(false);
+    }
+    function closeProjectMenuWithEscape(event: KeyboardEvent) {
+      if (event.key === "Escape") setProjectMenuOpen(false);
+    }
+    document.addEventListener("pointerdown", closeProjectMenu);
+    window.addEventListener("keydown", closeProjectMenuWithEscape);
+    return () => {
+      document.removeEventListener("pointerdown", closeProjectMenu);
+      window.removeEventListener("keydown", closeProjectMenuWithEscape);
+    };
+  }, [projectMenuOpen]);
+
+  useEffect(() => {
+    setAutomationError(null);
+    void reconcileProjectAutomation();
+  }, [selectedProjectId, reconcileProjectAutomation]);
+
+  useEffect(() => {
+    if (!embedded || window.parent === window) return;
+
+    function receiveHostMessage(event: MessageEvent) {
+      if (event.source !== window.parent || !event.data || typeof event.data !== "object") return;
+      const message = event.data as { type?: string; payload?: unknown; theme?: unknown };
+
+      if (message.type === "taskboard:automation-response" && message.payload) {
+        const payload = message.payload as Partial<AutomationHostResponse>;
+        if (typeof payload.requestId !== "string") return;
+        const pending = pendingAutomationRequestsRef.current.get(payload.requestId);
+        if (!pending) return;
+        window.clearTimeout(pending.timeoutId);
+        pendingAutomationRequestsRef.current.delete(payload.requestId);
+        if (payload.ok) pending.resolve(payload as AutomationHostResponse);
+        else pending.reject(new Error(
+          typeof payload.error === "string" ? payload.error : "Codex 无法更新自动化",
+        ));
+        return;
+      }
+
+      if (message.type === "taskboard:theme" && isTheme(message.theme)) {
+        setTheme(message.theme);
+        return;
+      }
+
+      if (message.type === "taskboard:thread-prepared") {
+        setOpeningThreadTaskId(null);
+        return;
+      }
+
+      if (message.type === "taskboard:thread-create-error" && message.payload) {
+        const payload = message.payload as { taskId?: unknown; error?: unknown };
+        setOpeningThreadTaskId(null);
+        setActionError(typeof payload.error === "string" ? payload.error : "无法在 Codex 中创建对话。");
+        return;
+      }
+
+      if (message.type !== "taskboard:host-context" || !message.payload) return;
+      const payload = message.payload as HostContext;
+      setHostContext(payload);
+      setCurrentUserActor(payload.user);
+      if (isTheme(payload.theme)) setTheme(payload.theme);
+    }
+
+    window.addEventListener("message", receiveHostMessage);
+    window.parent.postMessage({ type: "taskboard:ready" }, "*");
+    return () => {
+      window.removeEventListener("message", receiveHostMessage);
+      for (const pending of pendingAutomationRequestsRef.current.values()) {
+        window.clearTimeout(pending.timeoutId);
+      }
+      pendingAutomationRequestsRef.current.clear();
+    };
+  }, [embedded]);
+
+  useLayoutEffect(() => {
+    if (!embedded || window.parent === window || !dragRegionRef.current) return;
+    const region = dragRegionRef.current;
+    const publish = () => {
+      const rect = region.getBoundingClientRect();
+      window.parent.postMessage({
+        type: "taskboard:drag-region",
+        payload: { x: rect.x, y: rect.y, width: rect.width, height: rect.height },
+      }, "*");
+    };
+    const observer = new ResizeObserver(publish);
+    observer.observe(region);
+    window.addEventListener("resize", publish);
+    publish();
+    return () => {
+      observer.disconnect();
+      window.removeEventListener("resize", publish);
+      window.parent.postMessage({ type: "taskboard:drag-region", payload: null }, "*");
+    };
+  }, [detailTaskId, embedded, selectedProjectId]);
+
+  const loadProjectList = useCallback(async (signal?: AbortSignal) => {
+    setProjectsLoading(true);
+    setLoadError(null);
+    try {
+      const [nextProjects, metadata, workspaces] = await Promise.all([
+        listProjects(signal),
+        getTaskboardMetadata(signal),
+        listDeviceWorkspaces(signal),
+      ]);
+      setTaskboardMetadata((current) => (
+        current
+        && current.mode === metadata.mode
+        && current.realtime?.transport === metadata.realtime?.transport
+        && current.realtime?.intervalMs === metadata.realtime?.intervalMs
+        && current.manageTaskboardSkillPath === metadata.manageTaskboardSkillPath
+        && current.localCapabilities?.available === metadata.localCapabilities?.available
+          ? current
+          : metadata
+      ));
+      setManageTaskboardSkillPath(metadata.manageTaskboardSkillPath ?? "");
+      setLocalAiChatAvailable(metadata.capabilities?.localAiChat === true);
+      mergeDeviceWorkspacePaths(workspaces);
+      reconcileProjectListState(nextProjects);
+      setProjects(nextProjects);
+      setSelectedProjectId((current) => {
+        const fromQuery = new URLSearchParams(window.location.search).get("project");
+        const remembered = window.localStorage.getItem(LAST_PROJECT_KEY);
+        if (fromQuery && nextProjects.some((project) => project.id === fromQuery)) return fromQuery;
+        if (current && nextProjects.some((project) => project.id === current)) return current;
+        if (remembered && nextProjects.some((project) => project.id === remembered)) return remembered;
+        return "";
+      });
+    } catch (error) {
+      if ((error as Error).name !== "AbortError") setLoadError(errorMessage(error));
+    } finally {
+      setProjectsLoading(false);
+    }
+  }, [mergeDeviceWorkspacePaths, reconcileProjectListState]);
+
+  useEffect(() => {
+    const controller = new AbortController();
+    void loadProjectList(controller.signal);
+    return () => controller.abort();
+  }, [loadProjectList]);
+
+  const hostProjectIds = useMemo(() => (
+    (hostContext?.projects ?? [])
+      .map((project) => project.id)
+      .filter(Boolean)
+      .sort()
+      .join("\n")
+  ), [hostContext?.projects]);
+
+  const hostVisibleThreadIds = useMemo(() => (
+    (hostContext?.visibleThreadIds ?? [])
+      .map((threadId) => threadId.trim())
+      .filter(Boolean)
+      .sort()
+      .join("\n")
+  ), [hostContext?.visibleThreadIds]);
+
+  useEffect(() => {
+    if (!embedded || !hostProjectIds) return;
+    const controller = new AbortController();
+    void listDeviceWorkspaces(controller.signal)
+      .then(mergeDeviceWorkspacePaths)
+      .catch((error) => {
+        if ((error as Error).name !== "AbortError") {
+          console.warn("Unable to refresh Codex project workspaces", error);
+      }
+    });
+    return () => controller.abort();
+  }, [embedded, hostProjectIds, mergeDeviceWorkspacePaths]);
+
+  useEffect(() => {
+    if (!embedded || !syncCodexProjectId) return;
+    const signature = `${syncCodexProjectId}\n${hostVisibleThreadIds}`;
+    if (lastCodexThreadSyncRef.current === signature) return;
+    lastCodexThreadSyncRef.current = signature;
+    void syncCodexThreadTasks({
+      projectId: syncCodexProjectId,
+      visibleThreadIds: hostContext?.visibleThreadIds ?? [],
+    }).catch((error) => {
+      console.warn("Unable to sync Codex thread tasks", error);
+    });
+  }, [embedded, hostContext?.visibleThreadIds, hostVisibleThreadIds, syncCodexProjectId]);
+
+  useEffect(() => {
+    if (!hostContext?.projectId || !hostContext.workspacePath) return;
+    mergeDeviceWorkspacePaths({ [hostContext.projectId]: hostContext.workspacePath });
+  }, [hostContext?.projectId, hostContext?.workspacePath, mergeDeviceWorkspacePaths]);
+
+  const refreshProjectList = useCallback(async () => {
+    try {
+      const nextProjects = await listProjects();
+      reconcileProjectListState(nextProjects);
+      setProjects(nextProjects);
+      const selectedProjectMissing = Boolean(selectedProjectIdRef.current)
+        && !nextProjects.some((project) => project.id === selectedProjectIdRef.current);
+      if (selectedProjectMissing) {
+        setDetailTaskIdentifier(null);
+        setSelectedTaskIds(new Set());
+        window.localStorage.removeItem(LAST_PROJECT_KEY);
+        window.history.replaceState(null, "", buildIssueUrl(window.location.href, null, null));
+      }
+      setSelectedProjectId((current) => {
+        if (!current || nextProjects.some((project) => project.id === current)) return current;
+        return "";
+      });
+    } catch (error) {
+      setLoadError(errorMessage(error));
+    }
+  }, [reconcileProjectListState]);
+
+  const refreshTasks = useCallback(async (
+    projectId: string,
+    options: { quiet?: boolean; signal?: AbortSignal } = {},
+  ) => {
+    const requestId = ++tasksRequestRef.current;
+    if (!options.quiet) setTasksLoading(true);
+    setLoadError(null);
+    try {
+      const nextTasks = await listTasks(projectId, {
+        signal: options.signal,
+        archived: boardView === "archive" ? "true" : "false",
+      });
+      if (requestId !== tasksRequestRef.current) return;
+      setTasks(sortTasks(nextTasks));
+      const nextTaskIds = new Set(nextTasks.map((task) => task.id));
+      setSelectedTaskIds((current) => {
+        if (current.size === 0) return current;
+        const next = new Set([...current].filter((taskId) => nextTaskIds.has(taskId)));
+        return next.size === current.size ? current : next;
+      });
+      setHasLoadedTasks(true);
+    } catch (error) {
+      if ((error as Error).name !== "AbortError" && requestId === tasksRequestRef.current) {
+        setLoadError(errorMessage(error));
+      }
+    } finally {
+      if (!options.quiet && requestId === tasksRequestRef.current) setTasksLoading(false);
+    }
+  }, [boardView]);
+
+  useEffect(() => {
+    if (!selectedProjectId) {
+      setTasks([]);
+      setHasLoadedTasks(false);
+      return;
+    }
+    setHasLoadedTasks(false);
+    const controller = new AbortController();
+    void refreshTasks(selectedProjectId, { signal: controller.signal });
+    return () => controller.abort();
+  }, [refreshTasks, selectedProjectId]);
+
+  const refreshWorkflowOptions = useCallback(async (projectId: string, signal?: AbortSignal) => {
+    const record = await getWorkflowWorkspace<unknown>(projectId, signal);
+    if (!signal?.aborted) setWorkflowOptions(workflowOptionsFromWorkspace(record.workspace));
+  }, []);
+
+  useEffect(() => {
+    if (!selectedProjectId) {
+      setWorkflowOptions(DEFAULT_WORKFLOW_OPTIONS);
+      return;
+    }
+    setWorkflowOptions(workflowOptionsFromWorkspace(readLegacyWorkflowWorkspace(selectedProjectId)));
+    const controller = new AbortController();
+    void refreshWorkflowOptions(selectedProjectId, controller.signal).catch((error) => {
+      if ((error as Error).name !== "AbortError") {
+        setWorkflowOptions(workflowOptionsFromWorkspace(readLegacyWorkflowWorkspace(selectedProjectId)));
+      }
+    });
+    return () => controller.abort();
+  }, [refreshWorkflowOptions, selectedProjectId]);
+
+  useEffect(() => {
+    if (!selectedProjectId) {
+      setDevelopmentScan({ workspacePath: null, contexts: [] });
+      return;
+    }
+    const controller = new AbortController();
+    const codexProjectId = selectedProjectId === DEFAULT_PROJECT_ID ? hostContext?.projectId : selectedProjectId;
+    const codexThreadId = hostContext?.threadId ?? detailTask?.threadId ?? undefined;
+    setDevelopmentScan({ workspacePath: selectedDeviceWorkspacePath ?? null, contexts: [] });
+    setDevelopmentScanLoading(true);
+    void listDevelopmentContexts(
+      selectedProjectId,
+      codexProjectId,
+      codexThreadId,
+      controller.signal,
+      selectedDeviceWorkspacePath,
+    )
+      .then((scan) => {
+        setDevelopmentScan(scan);
+        if (scan.workspacePath) rememberDeviceWorkspacePath(selectedProjectId, scan.workspacePath);
+      })
+      .catch((error) => {
+        if ((error as Error).name !== "AbortError") {
+          setDevelopmentScan({ workspacePath: selectedDeviceWorkspacePath ?? null, contexts: [] });
+        }
+      })
+      .finally(() => {
+        if (!controller.signal.aborted) setDevelopmentScanLoading(false);
+      });
+    return () => controller.abort();
+  }, [
+    detailTask?.threadId,
+    hostContext?.projectId,
+    hostContext?.threadId,
+    rememberDeviceWorkspacePath,
+    selectedProjectId,
+    selectedDeviceWorkspacePath,
+  ]);
+
+  useEffect(() => {
+    if (revisionPollingInterval === null) return;
+    const controller = new AbortController();
+    setConnection("connecting");
+    const poller = createRevisionPoller({
+      intervalMs: revisionPollingInterval,
+      fetchRevision: async (since: number) => {
+        try {
+          const result = await getTaskboardRevision(since, controller.signal);
+          setConnection("live");
+          return result;
+        } catch (error) {
+          if (!controller.signal.aborted) setConnection("reconnecting");
+          throw error;
+        }
+      },
+      onInvalidate: () => {
+        void refreshProjectList();
+        const projectId = selectedProjectIdRef.current;
+        if (projectId) {
+          void refreshTasks(projectId, { quiet: true });
+          void refreshWorkflowOptions(projectId).catch(() => {});
+        }
+        setWorkflowRevision((current) => current + 1);
+        setCommentsRevision((current) => current + 1);
+        setAttachmentsRevision((current) => current + 1);
+      },
+    });
+    poller.start();
+    return () => {
+      controller.abort();
+      poller.stop();
+    };
+  }, [
+    revisionPollingInterval,
+    refreshProjectList,
+    refreshTasks,
+    refreshWorkflowOptions,
+  ]);
+
+  function pushUndo(message: string, undo: () => Promise<void>, showNotice = true) {
+    const operation = { id: ++undoSequenceRef.current, message, undo };
+    undoStackRef.current = [...undoStackRef.current.slice(-19), operation];
+    setAnnouncementValue("");
+    setUndoNotice(showNotice ? { id: operation.id, message } : null);
+  }
+
+  async function performUndo() {
+    if (undoInFlightRef.current) return;
+    const operation = undoStackRef.current.at(-1);
+    if (!operation) return;
+    undoStackRef.current = undoStackRef.current.slice(0, -1);
+    undoInFlightRef.current = true;
+    setUndoNotice(null);
+    setProjectMenuOpen(false);
+    setBulkProjectMoveMenuOpen(false);
+    setPendingBulkDeleteTasks([]);
+    closeContextMenu();
+    setActionError(null);
+    try {
+      await operation.undo();
+    } catch (error) {
+      setActionError(`无法撤回这次操作：${errorMessage(error)}`);
+      if (selectedProjectId) void refreshTasks(selectedProjectId, { quiet: true });
+    } finally {
+      undoInFlightRef.current = false;
+    }
+  }
+
+  async function restoreTaskDetails(
+    snapshot: Task,
+    changed: Task,
+    assigneeTarget = assigneeTargetForActor(snapshot.assignee, currentUser),
+  ) {
+    const candidate = tasksRef.current.find((task) => task.id === changed.id);
+    const current = candidate && candidate.version >= changed.version ? candidate : changed;
+    const restored = await updateTaskRequest(current, {
+      ...taskToDraft(snapshot),
+      ...(assigneeTarget ? { assigneeTarget } : {}),
+    });
+    setTasks((tasks) => sortTasks(tasks.map((task) => task.id === restored.id ? restored : task)));
+  }
+
+  useEffect(() => {
+    function handleShortcut(event: KeyboardEvent) {
+      const target = event.target as HTMLElement | null;
+      const isTyping = target?.matches("input, textarea, select, [contenteditable='true']");
+      if (
+        event.key.toLowerCase() === "z"
+        && (event.metaKey || event.ctrlKey)
+        && !event.shiftKey
+        && !isTyping
+        && !editor
+      ) {
+        event.preventDefault();
+        void performUndo();
+        return;
+      }
+      if (isTyping || contextMenu || projectMenuOpen || bulkProjectMoveMenuOpen) return;
+      if (
+        event.key.toLowerCase() === "c"
+        && !event.metaKey
+        && !event.ctrlKey
+        && selectedProjectId
+        && boardView === "issues"
+      ) {
+        event.preventDefault();
+        setEditor({ task: null, status: "backlog" });
+      }
+      if (event.key === "/" && !detailTaskId && selectedProjectId && boardView !== "workflow") {
+        event.preventDefault();
+        document.getElementById("task-search")?.focus();
+      }
+      if (event.key === "Escape" && detailTaskId) {
+        closeTaskDetail();
+      }
+    }
+
+    window.addEventListener("keydown", handleShortcut);
+    return () => window.removeEventListener("keydown", handleShortcut);
+  }, [boardView, bulkProjectMoveMenuOpen, contextMenu, detailTaskId, editor, projectMenuOpen, selectedProjectId]);
+
+  const filteredTasks = useMemo(() => {
+    return tasks.filter(
+      (task) => matchesTaskSearch(task, search) && matchesTaskFilters(task, filters),
+    );
+  }, [filters, search, tasks]);
+
+  const activeFilterCount = taskFilterCount(filters);
+  const selectedProjectIdArray = useMemo(() => Array.from(selectedProjectIds), [selectedProjectIds]);
+  const selectedManagedProjectChoices = useMemo(
+    () => selectedProjectIdArray
+      .map((projectId) => projectChoices.find((project) => project.id === projectId))
+      .filter((project): project is ProjectChoice => project !== undefined && canManageProjectChoice(project)),
+    [projectChoices, selectedProjectIdArray],
+  );
+  const selectedTaskIdArray = useMemo(() => Array.from(selectedTaskIds), [selectedTaskIds]);
+  const selectedIssueTasks = useMemo(
+    () => selectedTaskIdArray
+      .map((taskId) => tasks.find((task) => task.id === taskId))
+      .filter((task): task is Task => Boolean(task)),
+    [selectedTaskIdArray, tasks],
+  );
+  const selectedActiveTasks = useMemo(
+    () => selectedIssueTasks.filter((task) => task.projectId === selectedProjectId && task.archivedAt === null),
+    [selectedIssueTasks, selectedProjectId],
+  );
+  const projectMoveChoices = useMemo(
+    () => projectChoices.filter((project) => project.id !== selectedProjectId),
+    [projectChoices, selectedProjectId],
+  );
+  useEffect(() => {
+    const selectableProjectIds = new Set(
+      projectChoices.filter(canManageProjectChoice).map((project) => project.id),
+    );
+    setSelectedProjectIds((current) => {
+      if (current.size === 0) return current;
+      const next = new Set([...current].filter((projectId) => selectableProjectIds.has(projectId)));
+      return sameStringSet(next, current) ? current : next;
+    });
+  }, [projectChoices]);
+  const bulkTaskActionBusy = bulkArchivingSelectedTasks
+    || bulkDeletingSelectedTasks
+    || pendingBulkDeleteTasks.length > 0
+    || movingTaskId !== null;
+  const bulkTaskActionDisabled = selectedActiveTasks.length === 0 || bulkTaskActionBusy;
+  const bulkProjectMoveDisabled = selectedActiveTasks.length === 0 || projectMoveChoices.length === 0 || bulkTaskActionBusy;
+
+  useLayoutEffect(() => {
+    if (!bulkProjectMoveMenuOpen || !bulkProjectMoveTriggerRef.current || !bulkProjectMoveMenuRef.current) return;
+    const trigger = bulkProjectMoveTriggerRef.current.getBoundingClientRect();
+    const menu = bulkProjectMoveMenuRef.current.getBoundingClientRect();
+    const left = Math.max(8, Math.min(trigger.right - menu.width, window.innerWidth - menu.width - 8));
+    const top = trigger.bottom + 6 + menu.height <= window.innerHeight - 8
+      ? trigger.bottom + 6
+      : Math.max(8, trigger.top - menu.height - 6);
+    setBulkProjectMoveMenuPosition({ left, top, ready: true });
+  }, [bulkProjectMoveMenuOpen, projectMoveChoices.length, selectedActiveTasks.length]);
+
+  useEffect(() => {
+    if (!bulkProjectMoveMenuOpen) return;
+    if (bulkProjectMoveDisabled || boardView !== "issues") {
+      setBulkProjectMoveMenuOpen(false);
+      return;
+    }
+
+    function closeFromOutside(event: PointerEvent) {
+      const target = event.target as Node;
+      if (
+        !bulkProjectMoveMenuRef.current?.contains(target)
+        && !bulkProjectMoveTriggerRef.current?.contains(target)
+      ) {
+        setBulkProjectMoveMenuOpen(false);
+      }
+    }
+
+    function closeFromViewportChange() {
+      setBulkProjectMoveMenuOpen(false);
+    }
+
+    function closeFromEscape(event: KeyboardEvent) {
+      if (event.key === "Escape") {
+        setBulkProjectMoveMenuOpen(false);
+        bulkProjectMoveTriggerRef.current?.focus();
+      }
+    }
+
+    document.addEventListener("pointerdown", closeFromOutside);
+    document.addEventListener("keydown", closeFromEscape);
+    window.addEventListener("blur", closeFromViewportChange);
+    window.addEventListener("resize", closeFromViewportChange);
+    window.addEventListener("scroll", closeFromViewportChange, true);
+    return () => {
+      document.removeEventListener("pointerdown", closeFromOutside);
+      document.removeEventListener("keydown", closeFromEscape);
+      window.removeEventListener("blur", closeFromViewportChange);
+      window.removeEventListener("resize", closeFromViewportChange);
+      window.removeEventListener("scroll", closeFromViewportChange, true);
+    };
+  }, [boardView, bulkProjectMoveDisabled, bulkProjectMoveMenuOpen]);
+
+  const tasksByStatus = useMemo(() => {
+    return Object.fromEntries(
+      TASK_STATUSES.map((status) => [status, filteredTasks.filter((task) => task.status === status)]),
+    ) as Record<TaskStatus, Task[]>;
+  }, [filteredTasks]);
+
+  const columnVisibility = columnVisibilityByProject[selectedProjectId];
+
+  const visibleStatuses = useMemo(
+    () => TASK_STATUSES.filter((status) => (
+      tasksByStatus[status].length === 0
+        ? showEmptyColumns
+        : (columnVisibility?.[status] ?? true)
+    )),
+    [columnVisibility, showEmptyColumns, tasksByStatus],
+  );
+
+  const hiddenStatuses = useMemo(
+    () => TASK_STATUSES.filter((status) => (
+      tasksByStatus[status].length === 0
+        ? !showEmptyColumns
+        : !(columnVisibility?.[status] ?? true)
+    )),
+    [columnVisibility, showEmptyColumns, tasksByStatus],
+  );
+
+  function updateShowEmptyColumns(show: boolean) {
+    window.localStorage.setItem(SHOW_EMPTY_COLUMNS_KEY, String(show));
+    setShowEmptyColumns(show);
+  }
+
+  function updateColumnVisibility(status: TaskStatus, visible: boolean) {
+    if (!selectedProjectId || tasksByStatus[status].length === 0) return;
+    setColumnVisibilityByProject((current) => {
+      const next = {
+        ...current,
+        [selectedProjectId]: {
+          ...current[selectedProjectId],
+          [status]: visible,
+        },
+      };
+      window.localStorage.setItem(COLUMN_VISIBILITY_KEY, JSON.stringify(next));
+      return next;
+    });
+  }
+
+  function selectBoardView(view: BoardView) {
+    closeContextMenu();
+    setBulkProjectMoveMenuOpen(false);
+    setPendingBulkDeleteTasks([]);
+    setSelectedTaskIds(new Set());
+    setBoardView(view);
+  }
+
+  function setTaskSelection(task: Task, selected: boolean) {
+    setSelectedTaskIds((current) => {
+      const next = new Set(current);
+      if (selected) next.add(task.id);
+      else next.delete(task.id);
+      return next;
+    });
+  }
+
+  function normalizeSelectionBox(startX: number, startY: number, endX: number, endY: number): SelectionBox {
+    const left = Math.min(startX, endX);
+    const top = Math.min(startY, endY);
+    return {
+      left,
+      top,
+      width: Math.max(startX, endX) - left,
+      height: Math.max(startY, endY) - top,
+    };
+  }
+
+  function projectCardIntersectsSelection(card: HTMLElement, box: SelectionBox): boolean {
+    const rect = card.getBoundingClientRect();
+    return rect.left < box.left + box.width
+      && rect.right > box.left
+      && rect.top < box.top + box.height
+      && rect.bottom > box.top;
+  }
+
+  function selectedProjectIdsFromBox(container: HTMLElement, box: SelectionBox): string[] {
+    return Array.from(container.querySelectorAll<HTMLElement>("[data-project-id][data-project-selectable='true']"))
+      .filter((card) => {
+        const projectId = card.dataset.projectId;
+        return Boolean(projectId) && projectCardIntersectsSelection(card, box);
+      })
+      .map((card) => card.dataset.projectId!)
+      .filter((projectId, index, projectIds) => projectIds.indexOf(projectId) === index);
+  }
+
+  function canStartProjectBoxSelection(target: EventTarget | null): target is HTMLElement {
+    if (openingProjectId !== null || projectActionPending !== null) return false;
+    if (!(target instanceof HTMLElement)) return false;
+    if (
+      target.closest(
+        "[data-project-id], .project-group-heading, .project-home-bulk-actions, button, input, textarea, select, a, [role='menu'], [contenteditable='true']",
+      )
+    ) {
+      return false;
+    }
+    return Boolean(target.closest(".project-home-groups"));
+  }
+
+  function startProjectBoxSelection(event: ReactPointerEvent<HTMLDivElement>) {
+    if (event.button !== 0) return;
+    if (!canStartProjectBoxSelection(event.target)) return;
+
+    const additive = event.metaKey || event.ctrlKey || event.shiftKey;
+    projectSelectionDragRef.current = {
+      startX: event.clientX,
+      startY: event.clientY,
+      pointerId: event.pointerId,
+      additive,
+      active: false,
+      baseIds: new Set(additive ? selectedProjectIds : []),
+    };
+    event.currentTarget.setPointerCapture(event.pointerId);
+  }
+
+  function updateProjectBoxSelection(event: ReactPointerEvent<HTMLDivElement>) {
+    const dragState = projectSelectionDragRef.current;
+    if (!dragState || dragState.pointerId !== event.pointerId) return;
+
+    const box = normalizeSelectionBox(dragState.startX, dragState.startY, event.clientX, event.clientY);
+    if (!dragState.active && Math.max(box.width, box.height) < 4) return;
+
+    dragState.active = true;
+    event.preventDefault();
+    setProjectSelectionBox(box);
+    const next = new Set(dragState.additive ? dragState.baseIds : []);
+    for (const projectId of selectedProjectIdsFromBox(event.currentTarget, box)) next.add(projectId);
+    setSelectedProjectIds(next);
+  }
+
+  function finishProjectBoxSelection(event: ReactPointerEvent<HTMLDivElement>) {
+    const dragState = projectSelectionDragRef.current;
+    if (!dragState || dragState.pointerId !== event.pointerId) return;
+    const shouldClearSelection = event.type === "pointerup" && !dragState.active && !dragState.additive;
+    projectSelectionDragRef.current = null;
+    if (event.currentTarget.hasPointerCapture(event.pointerId)) {
+      event.currentTarget.releasePointerCapture(event.pointerId);
+    }
+    setProjectSelectionBox(null);
+    if (shouldClearSelection) {
+      setSelectedProjectIds((current) => current.size === 0 ? current : new Set());
+    }
+  }
+
+  function taskCardIntersectsSelection(card: HTMLElement, box: SelectionBox): boolean {
+    const rect = card.getBoundingClientRect();
+    return rect.left < box.left + box.width
+      && rect.right > box.left
+      && rect.top < box.top + box.height
+      && rect.bottom > box.top;
+  }
+
+  function selectedTaskIdsFromBox(container: HTMLElement, box: SelectionBox): string[] {
+    return Array.from(container.querySelectorAll<HTMLElement>("[data-task-id]"))
+      .filter((card) => {
+        const taskId = card.dataset.taskId;
+        return Boolean(taskId) && taskCardIntersectsSelection(card, box);
+      })
+      .map((card) => card.dataset.taskId!)
+      .filter((taskId, index, taskIds) => taskIds.indexOf(taskId) === index);
+  }
+
+  function canStartBoxSelection(target: EventTarget | null): target is HTMLElement {
+    if (!(target instanceof HTMLElement)) return false;
+    if (target.closest("[data-task-id], button, input, textarea, select, a, [role='menu'], [contenteditable='true']")) {
+      return false;
+    }
+    if (target.closest(".column-header, .hidden-columns")) return false;
+    return Boolean(target.closest(".board-scroll, .board, .column-list"));
+  }
+
+  function startBoxSelection(event: ReactPointerEvent<HTMLDivElement>) {
+    if (event.button !== 0 || draggedTaskId) return;
+    if (!canStartBoxSelection(event.target)) return;
+
+    const additive = event.metaKey || event.ctrlKey || event.shiftKey;
+    selectionDragRef.current = {
+      startX: event.clientX,
+      startY: event.clientY,
+      pointerId: event.pointerId,
+      additive,
+      active: false,
+      baseIds: new Set(additive ? selectedTaskIds : []),
+    };
+    event.currentTarget.setPointerCapture(event.pointerId);
+  }
+
+  function updateBoxSelection(event: ReactPointerEvent<HTMLDivElement>) {
+    const dragState = selectionDragRef.current;
+    if (!dragState || dragState.pointerId !== event.pointerId) return;
+
+    const box = normalizeSelectionBox(dragState.startX, dragState.startY, event.clientX, event.clientY);
+    if (!dragState.active && Math.max(box.width, box.height) < 4) return;
+
+    dragState.active = true;
+    event.preventDefault();
+    setSelectionBox(box);
+    const next = new Set(dragState.additive ? dragState.baseIds : []);
+    for (const taskId of selectedTaskIdsFromBox(event.currentTarget, box)) next.add(taskId);
+    setSelectedTaskIds(next);
+  }
+
+  function finishBoxSelection(event: ReactPointerEvent<HTMLDivElement>) {
+    const dragState = selectionDragRef.current;
+    if (!dragState || dragState.pointerId !== event.pointerId) return;
+    const shouldClearSelection = event.type === "pointerup" && !dragState.active && !dragState.additive;
+    selectionDragRef.current = null;
+    if (event.currentTarget.hasPointerCapture(event.pointerId)) {
+      event.currentTarget.releasePointerCapture(event.pointerId);
+    }
+    setSelectionBox(null);
+    if (shouldClearSelection) {
+      setSelectedTaskIds((current) => current.size === 0 ? current : new Set());
+    }
+  }
+
+  async function saveEditor(
+    draft: TaskDraft,
+    attachments: File[],
+    inlineImages: PendingInlineImage[],
+  ) {
+    if (!editor) return;
+    const targetProjectId = editor.task?.projectId ?? editor.projectId ?? selectedProjectId;
+    if (!targetProjectId) return;
+    setActionError(null);
+    try {
+      const creating = editor.task === null;
+      let saved = editor.task
+        ? await updateTaskRequest(editor.task, draft)
+        : await createTaskRequest(targetProjectId, draft);
+      if (creating) {
+        setProjects((current) => current.map((project) => (
+          project.id === targetProjectId
+            ? { ...project, issueCount: project.issueCount + 1 }
+            : project
+        )));
+      }
+      let uploadedAttachments = 0;
+      let failedAttachments = 0;
+      if (creating && (attachments.length > 0 || inlineImages.length > 0)) {
+        const [results, inlineAttachments] = await Promise.all([
+          Promise.allSettled(
+            attachments.map((file) => uploadAttachment(saved.id, file)),
+          ),
+          Promise.all(
+            inlineImages.map((image) => uploadAttachment(saved.id, image.file)),
+          ),
+        ]);
+        uploadedAttachments = results.filter((result) => result.status === "fulfilled").length;
+        failedAttachments = results.length - uploadedAttachments;
+        if (inlineImages.length > 0) {
+          const description = resolveInlineMediaMarkdown(
+            draft.description,
+            inlineImages,
+            inlineAttachments,
+          );
+          saved = await updateTaskRequest(saved, { ...draft, description });
+        }
+      }
+      setTasks((current) => sortTasks([
+        ...current.filter((task) => task.id !== saved.id),
+        saved,
+      ]));
+      setEditor(null);
+      if (failedAttachments > 0) {
+        setActionError(`${saved.identifier} 已创建，但有 ${failedAttachments} 个附件上传失败，可在详情页重试。`);
+      }
+      if (creating) {
+        const totalUploaded = uploadedAttachments + inlineImages.length;
+        const message = `${saved.identifier} 已创建${totalUploaded > 0 ? `，已上传 ${totalUploaded} 个附件` : ""}。`;
+        pushUndo(message, async () => {
+          const candidate = tasksRef.current.find((task) => task.id === saved.id);
+          const current = candidate && candidate.version >= saved.version ? candidate : saved;
+          await archiveTaskRequest(current);
+          setTasks((tasks) => tasks.filter((task) => task.id !== saved.id));
+        });
+      } else if (editor.task) {
+        const previous = editor.task;
+        const previousAssigneeTarget = assigneeTargetForActor(previous.assignee, currentUser);
+        if (!draft.assigneeTarget || previousAssigneeTarget) {
+          pushUndo(
+            `${saved.identifier} 已更新。`,
+            () => restoreTaskDetails(previous, saved, previousAssigneeTarget),
+          );
+        }
+      }
+    } catch (error) {
+      if (error instanceof ApiError && error.code === "VERSION_CONFLICT") {
+        void refreshTasks(targetProjectId, { quiet: true });
+      }
+      throw error;
+    }
+  }
+
+  async function moveTask(
+    task: Task,
+    status: TaskStatus,
+    beforeTaskId: string | null = null,
+    silent = false,
+  ) {
+    if (movingTaskId) {
+      setDropTarget(null);
+      setDraggedTaskId(null);
+      setDraggedTaskIds([]);
+      setDraggedTaskHeight(0);
+      return;
+    }
+
+    const destination = tasks.filter((candidate) => candidate.status === status && candidate.id !== task.id);
+    const insertionIndex = beforeTaskId
+      ? destination.findIndex((candidate) => candidate.id === beforeTaskId)
+      : destination.length;
+    const targetIndex = insertionIndex < 0 ? destination.length : insertionIndex;
+    const desiredOrder = [...destination];
+    desiredOrder.splice(targetIndex, 0, task);
+    const currentOrder = tasks.filter((candidate) => candidate.status === status);
+    if (
+      task.status === status
+      && currentOrder.length === desiredOrder.length
+      && currentOrder.every((candidate, index) => candidate.id === desiredOrder[index].id)
+    ) {
+      setDropTarget(null);
+      setDraggedTaskId(null);
+      setDraggedTaskIds([]);
+      setDraggedTaskHeight(0);
+      return;
+    }
+    const previousTask = destination[targetIndex - 1] ?? null;
+    const nextTask = destination[targetIndex] ?? null;
+    const sortOrder = previousTask && nextTask
+      ? (previousTask.sortOrder + nextTask.sortOrder) / 2
+      : previousTask
+        ? previousTask.sortOrder + 1024
+        : nextTask
+          ? nextTask.sortOrder - 1024
+          : 1024;
+    const previous = task;
+    setActionError(null);
+    setMovingTaskId(task.id);
+    setTasks((current) => sortTasks(current.map((candidate) =>
+      candidate.id === task.id ? { ...candidate, status, sortOrder } : candidate,
+    )));
+
+    try {
+      const moved = await moveTaskRequest(task, status, sortOrder);
+      setTasks((current) => sortTasks(current.map((candidate) =>
+        candidate.id === moved.id ? moved : candidate,
+      )));
+      const message = task.status === status
+        ? `${task.identifier} 排序已调整。`
+        : `${task.identifier} 已移至${STATUS_DETAILS[status].label}。`;
+      pushUndo(message, async () => {
+        const candidate = tasksRef.current.find((current) => current.id === moved.id);
+        const current = candidate && candidate.version >= moved.version ? candidate : moved;
+        const restored = await moveTaskRequest(current, previous.status, previous.sortOrder);
+        setTasks((tasks) => sortTasks(tasks.map((item) => item.id === restored.id ? restored : item)));
+      }, !silent);
+    } catch (error) {
+      setTasks((current) => sortTasks(current.map((candidate) =>
+        candidate.id === previous.id ? previous : candidate,
+      )));
+      setActionError(error instanceof ApiError && error.code === "VERSION_CONFLICT"
+        ? "That task changed elsewhere. The board has been refreshed."
+        : errorMessage(error));
+      if (selectedProjectId) void refreshTasks(selectedProjectId, { quiet: true });
+    } finally {
+      setMovingTaskId(null);
+      setDropTarget(null);
+      setDraggedTaskId(null);
+      setDraggedTaskIds([]);
+      setDraggedTaskHeight(0);
+    }
+  }
+
+  async function moveTaskGroup(
+    taskGroup: Task[],
+    status: TaskStatus,
+    beforeTaskId: string | null = null,
+    silent = false,
+  ) {
+    if (movingTaskId) {
+      setDropTarget(null);
+      setDraggedTaskId(null);
+      setDraggedTaskIds([]);
+      setDraggedTaskHeight(0);
+      return;
+    }
+
+    const uniqueTasks = [...new Map(taskGroup.map((task) => [task.id, task])).values()]
+      .sort(compareTasksByBoardPosition);
+    if (uniqueTasks.length <= 1) {
+      if (uniqueTasks[0]) await moveTask(uniqueTasks[0], status, beforeTaskId, silent);
+      return;
+    }
+
+    const movingIds = new Set(uniqueTasks.map((task) => task.id));
+    const destination = tasks.filter((candidate) => candidate.status === status && !movingIds.has(candidate.id));
+    const insertionIndex = beforeTaskId && !movingIds.has(beforeTaskId)
+      ? destination.findIndex((candidate) => candidate.id === beforeTaskId)
+      : destination.length;
+    const targetIndex = insertionIndex < 0 ? destination.length : insertionIndex;
+    const desiredOrder = [...destination];
+    desiredOrder.splice(targetIndex, 0, ...uniqueTasks);
+    const currentOrder = tasks.filter((candidate) => candidate.status === status);
+    if (
+      uniqueTasks.every((task) => task.status === status)
+      && currentOrder.length === desiredOrder.length
+      && currentOrder.every((candidate, index) => candidate.id === desiredOrder[index].id)
+    ) {
+      setDropTarget(null);
+      setDraggedTaskId(null);
+      setDraggedTaskIds([]);
+      setDraggedTaskHeight(0);
+      return;
+    }
+
+    const sortOrders = calculateGroupSortOrders(
+      destination[targetIndex - 1] ?? null,
+      destination[targetIndex] ?? null,
+      uniqueTasks.length,
+    );
+    const previousTasks = new Map(uniqueTasks.map((task) => [task.id, task]));
+    const optimisticTasks = new Map(uniqueTasks.map((task, index) => [
+      task.id,
+      { ...task, status, sortOrder: sortOrders[index] },
+    ]));
+    setActionError(null);
+    setMovingTaskId(uniqueTasks[0].id);
+    setTasks((current) => sortTasks(current.map((candidate) =>
+      optimisticTasks.get(candidate.id) ?? candidate,
+    )));
+
+    try {
+      const movedTasks = await Promise.all(
+        uniqueTasks.map((task, index) => moveTaskRequest(task, status, sortOrders[index])),
+      );
+      const movedById = new Map(movedTasks.map((task) => [task.id, task]));
+      setTasks((current) => sortTasks(current.map((candidate) =>
+        movedById.get(candidate.id) ?? candidate,
+      )));
+      const movedWithinStatus = uniqueTasks.every((task) => task.status === status);
+      const message = movedWithinStatus
+        ? `${uniqueTasks.length} 个任务排序已调整。`
+        : `${uniqueTasks.length} 个任务已移至${STATUS_DETAILS[status].label}。`;
+      pushUndo(message, async () => {
+        const restoredTasks = await Promise.all(movedTasks.map((moved) => {
+          const previous = previousTasks.get(moved.id);
+          const candidate = tasksRef.current.find((current) => current.id === moved.id);
+          const current = candidate && candidate.version >= moved.version ? candidate : moved;
+          return previous ? moveTaskRequest(current, previous.status, previous.sortOrder) : Promise.resolve(current);
+        }));
+        const restoredById = new Map(restoredTasks.map((task) => [task.id, task]));
+        setTasks((tasks) => sortTasks(tasks.map((item) => restoredById.get(item.id) ?? item)));
+      }, !silent);
+    } catch (error) {
+      setTasks((current) => sortTasks(current.map((candidate) =>
+        previousTasks.get(candidate.id) ?? candidate,
+      )));
+      setActionError(error instanceof ApiError && error.code === "VERSION_CONFLICT"
+        ? "That task changed elsewhere. The board has been refreshed."
+        : errorMessage(error));
+      if (selectedProjectId) void refreshTasks(selectedProjectId, { quiet: true });
+    } finally {
+      setMovingTaskId(null);
+      setDropTarget(null);
+      setDraggedTaskId(null);
+      setDraggedTaskIds([]);
+      setDraggedTaskHeight(0);
+    }
+  }
+
+  async function moveSelectedTasksToProject(projectId: string) {
+    if (!selectedProjectId || bulkTaskActionBusy || projectId === selectedProjectId) return;
+    setBulkProjectMoveMenuOpen(false);
+    const targetChoice = projectMoveChoices.find((project) => project.id === projectId);
+    if (!targetChoice) return;
+    const taskGroup = [...selectedActiveTasks]
+      .sort(compareTasksByBoardPosition);
+    if (taskGroup.length === 0) return;
+
+    const previousTasks = new Map(taskGroup.map((task) => [task.id, task]));
+    setActionError(null);
+    setMovingTaskId(taskGroup[0].id);
+    setTasks((current) => current.filter((candidate) => !previousTasks.has(candidate.id)));
+
+    try {
+      const targetProject = await ensureProject(targetChoice);
+      const movedTasks = await Promise.all(
+        taskGroup.map((task) => moveTaskRequest(task, task.status, undefined, { projectId: targetProject.id })),
+      );
+      setSelectedTaskIds(new Set());
+      const targetName = projectDisplayName(targetProject);
+      pushUndo(`${taskGroup.length} 个任务已移至${targetName}。`, async () => {
+        await Promise.all(movedTasks.map((moved) => {
+          const previous = previousTasks.get(moved.id);
+          return previous
+            ? moveTaskRequest(moved, previous.status, previous.sortOrder, { projectId: previous.projectId })
+            : Promise.resolve(moved);
+        }));
+        await refreshProjectList();
+        const currentProjectId = selectedProjectIdRef.current;
+        if (currentProjectId) await refreshTasks(currentProjectId, { quiet: true });
+      });
+      await refreshProjectList();
+      await refreshTasks(selectedProjectId, { quiet: true });
+    } catch (error) {
+      setTasks((current) => sortTasks([
+        ...current.filter((candidate) => !previousTasks.has(candidate.id)),
+        ...taskGroup,
+      ]));
+      setActionError(error instanceof ApiError && error.code === "VERSION_CONFLICT"
+        ? "That task changed elsewhere. The board has been refreshed."
+        : errorMessage(error));
+      void refreshProjectList();
+      if (selectedProjectId) void refreshTasks(selectedProjectId, { quiet: true });
+    } finally {
+      setMovingTaskId(null);
+      setDropTarget(null);
+      setDraggedTaskId(null);
+      setDraggedTaskIds([]);
+      setDraggedTaskHeight(0);
+    }
+  }
+
+  async function archiveSelectedTasks() {
+    if (!selectedProjectId || bulkTaskActionBusy || selectedActiveTasks.length === 0) return;
+    setBulkProjectMoveMenuOpen(false);
+    const taskGroup = [...selectedActiveTasks].sort(compareTasksByBoardPosition);
+    const previousTasks = new Map(taskGroup.map((task) => [task.id, task]));
+    setActionError(null);
+    setBulkArchivingSelectedTasks(true);
+    setTasks((current) => current.filter((candidate) => !previousTasks.has(candidate.id)));
+
+    try {
+      const archivedTasks = await Promise.all(taskGroup.map((task) => archiveTaskRequest(task)));
+      setSelectedTaskIds(new Set());
+      pushUndo(`${taskGroup.length} 个任务已归档。`, async () => {
+        await Promise.all(archivedTasks.map((archived) => restoreTaskRequest(archived)));
+        await refreshProjectList();
+        const currentProjectId = selectedProjectIdRef.current;
+        if (currentProjectId) await refreshTasks(currentProjectId, { quiet: true });
+      });
+      await refreshProjectList();
+      await refreshTasks(selectedProjectId, { quiet: true });
+    } catch (error) {
+      setTasks((current) => sortTasks([
+        ...current.filter((candidate) => !previousTasks.has(candidate.id)),
+        ...taskGroup,
+      ]));
+      setActionError(error instanceof ApiError && error.code === "VERSION_CONFLICT"
+        ? "有任务已在其他位置更新，任务面板已重新同步。"
+        : errorMessage(error));
+      void refreshProjectList();
+      if (selectedProjectId) void refreshTasks(selectedProjectId, { quiet: true });
+    } finally {
+      setBulkArchivingSelectedTasks(false);
+    }
+  }
+
+  function requestBulkTaskDelete() {
+    if (bulkTaskActionBusy || selectedActiveTasks.length === 0) return;
+    setBulkProjectMoveMenuOpen(false);
+    setPendingBulkDeleteTasks([...selectedActiveTasks].sort(compareTasksByBoardPosition));
+  }
+
+  async function confirmBulkTaskDelete() {
+    if (pendingBulkDeleteTasks.length === 0 || bulkDeletingSelectedTasks) return;
+    const taskGroup = pendingBulkDeleteTasks;
+    const previousTasks = new Map(taskGroup.map((task) => [task.id, task]));
+    setActionError(null);
+    setBulkDeletingSelectedTasks(true);
+    setTasks((current) => current.filter((candidate) => !previousTasks.has(candidate.id)));
+
+    try {
+      await Promise.all(taskGroup.map((task) => deleteTaskRequest(task)));
+      setSelectedTaskIds(new Set());
+      setPendingBulkDeleteTasks([]);
+      if (taskGroup.some((task) => task.identifier === detailTaskIdentifier)) closeTaskDetail();
+      setAnnouncement(`${taskGroup.length} 个任务已永久删除。`);
+      await refreshProjectList();
+      if (selectedProjectId) await refreshTasks(selectedProjectId, { quiet: true });
+    } catch (error) {
+      setTasks((current) => sortTasks([
+        ...current.filter((candidate) => !previousTasks.has(candidate.id)),
+        ...taskGroup,
+      ]));
+      setActionError(error instanceof ApiError && error.code === "VERSION_CONFLICT"
+        ? "有任务已在其他位置更新，任务面板已重新同步。"
+        : errorMessage(error));
+      void refreshProjectList();
+      if (selectedProjectId) void refreshTasks(selectedProjectId, { quiet: true });
+    } finally {
+      setBulkDeletingSelectedTasks(false);
+    }
+  }
+
+  function finishTaskDrop(destination: TaskStatus, taskId: string, beforeTaskId: string | null = null) {
+    const task = tasks.find((candidate) => candidate.id === taskId);
+    setDraggedTaskId(null);
+    setDraggedTaskIds([]);
+    setDraggedTaskHeight(0);
+    setDropTarget(null);
+    if (!task) return;
+    const selectedTasks = selectedTaskIds.has(taskId)
+      ? selectedTaskIdArray
+        .map((selectedTaskId) => tasks.find((candidate) => candidate.id === selectedTaskId))
+        .filter((candidate): candidate is Task => Boolean(candidate))
+      : [];
+    const movingTasks = selectedTasks.some((candidate) => candidate.id === task.id)
+      ? selectedTasks
+      : [task, ...selectedTasks];
+    setSettlingTaskId(task.id);
+    window.setTimeout(() => {
+      setSettlingTaskId((current) => current === task.id ? null : current);
+    }, 220);
+    if (movingTasks.length > 1) {
+      void moveTaskGroup(movingTasks, destination, beforeTaskId, true);
+      return;
+    }
+    void moveTask(task, destination, beforeTaskId, true);
+  }
+
+  async function updateTaskProperties(task: Task, changes: Partial<TaskDraft>, message?: string): Promise<Task> {
+    const previous = task;
+    const { assigneeTarget, ...taskChanges } = changes;
+    const optimisticAssignee = assigneeTarget
+      ? actorForAssigneeTarget(assigneeTarget, currentUser)
+      : task.assignee;
+    setActionError(null);
+    setTasks((current) => current.map((candidate) =>
+      candidate.id === task.id
+        ? { ...candidate, ...taskChanges, assignee: optimisticAssignee }
+        : candidate,
+    ));
+
+    try {
+      const updated = await updateTaskRequest(task, { ...taskToDraft(task), ...changes });
+      setTasks((current) => sortTasks(current.map((candidate) =>
+        candidate.id === updated.id ? updated : candidate,
+      )));
+      const previousAssigneeTarget = assigneeTargetForActor(previous.assignee, currentUser);
+      if (!assigneeTarget || previousAssigneeTarget) {
+        pushUndo(
+          message ?? `${task.identifier} 已更新。`,
+          () => restoreTaskDetails(previous, updated, previousAssigneeTarget),
+        );
+      }
+      return updated;
+    } catch (error) {
+      setTasks((current) => sortTasks(current.map((candidate) =>
+        candidate.id === previous.id ? previous : candidate,
+      )));
+      setActionError(error instanceof ApiError && error.code === "VERSION_CONFLICT"
+        ? "该任务已在其他位置更新，看板已重新同步。"
+        : errorMessage(error));
+      if (selectedProjectId) void refreshTasks(selectedProjectId, { quiet: true });
+      throw error;
+    }
+  }
+
+  async function mutateTaskRelation(
+    action: "add" | "remove",
+    task: Task,
+    type: IssueRelationType,
+    relatedTaskId: string,
+  ) {
+    setActionError(null);
+    try {
+      const result = action === "add"
+        ? await addTaskRelation(task, type, relatedTaskId)
+        : await removeTaskRelation(task, type, relatedTaskId);
+      setTasks((current) => sortTasks(current.map((candidate) => {
+        if (candidate.id === result.task.id) return result.task;
+        if (candidate.id === result.relatedTask.id) return result.relatedTask;
+        return candidate;
+      })));
+      if (selectedProjectId) void refreshTasks(selectedProjectId, { quiet: true });
+      return result;
+    } catch (error) {
+      setActionError(error instanceof ApiError && error.code === "VERSION_CONFLICT"
+        ? "该任务已在其他位置更新，看板已重新同步。"
+        : errorMessage(error));
+      if (selectedProjectId) void refreshTasks(selectedProjectId, { quiet: true });
+      throw error;
+    }
+  }
+
+  async function duplicateTask(task: Task) {
+    setActionError(null);
+    try {
+      const duplicated = await createTaskRequest(task.projectId, {
+        ...taskToDraft(task),
+        assigneeTarget: assigneeTargetForActor(task.assignee, currentUser),
+        developmentContext: null,
+      });
+      setTasks((current) => sortTasks([...current, duplicated]));
+      pushUndo(`${duplicated.identifier} 副本已创建。`, async () => {
+        const candidate = tasksRef.current.find((current) => current.id === duplicated.id);
+        const current = candidate && candidate.version >= duplicated.version ? candidate : duplicated;
+        await archiveTaskRequest(current);
+        setTasks((tasks) => tasks.filter((item) => item.id !== duplicated.id));
+      });
+    } catch (error) {
+      setActionError(errorMessage(error));
+    }
+  }
+
+  async function archiveTask(task: Task) {
+    setActionError(null);
+    try {
+      const archived = await archiveTaskRequest(task);
+      setTasks((current) => current.filter((candidate) => candidate.id !== task.id));
+      pushUndo(`${task.identifier} 已归档。`, async () => {
+        const restored = await restoreTaskRequest(archived);
+        setTasks((current) => sortTasks([
+          ...current.filter((candidate) => candidate.id !== restored.id),
+          restored,
+        ]));
+      });
+    } catch (error) {
+      setActionError(error instanceof ApiError && error.code === "VERSION_CONFLICT"
+        ? "该任务已在其他位置更新，看板已重新同步。"
+        : errorMessage(error));
+      if (selectedProjectId) void refreshTasks(selectedProjectId, { quiet: true });
+    }
+  }
+
+  async function deleteTask(task: Task) {
+    setActionError(null);
+    try {
+      await deleteTaskRequest(task);
+      setTasks((current) => current.filter((candidate) => candidate.id !== task.id));
+      if (detailTaskIdentifier === task.identifier) closeTaskDetail();
+      setAnnouncement(`${task.identifier} 已永久删除。`);
+    } catch (error) {
+      setActionError(error instanceof ApiError && error.code === "VERSION_CONFLICT"
+        ? "该任务已在其他位置更新，看板已重新同步。"
+        : errorMessage(error));
+      if (selectedProjectId) void refreshTasks(selectedProjectId, { quiet: true });
+    }
+  }
+
+  async function restoreArchivedTask(task: Task) {
+    if (restoringArchivedTaskId) return;
+    setRestoringArchivedTaskId(task.id);
+    setActionError(null);
+    try {
+      const restored = await restoreTaskRequest(task);
+      setTasks((current) => current.filter((candidate) => candidate.id !== restored.id));
+      if (detailTaskIdentifier === task.identifier) closeTaskDetail();
+      setAnnouncement(`${task.identifier} 已恢复到任务看板。`);
+    } catch (error) {
+      setActionError(error instanceof ApiError && error.code === "VERSION_CONFLICT"
+        ? "该任务已在其他位置更新，看板已重新同步。"
+        : errorMessage(error));
+      if (selectedProjectId) void refreshTasks(selectedProjectId, { quiet: true });
+    } finally {
+      setRestoringArchivedTaskId(null);
+    }
+  }
+
+  async function confirmArchivedTaskDelete() {
+    if (!pendingArchivedDeleteTask || deletingArchivedTask) return;
+    setDeletingArchivedTask(true);
+    try {
+      await deleteTask(pendingArchivedDeleteTask);
+      setPendingArchivedDeleteTask(null);
+    } finally {
+      setDeletingArchivedTask(false);
+    }
+  }
+
+  async function copyText(text: string, message: string) {
+    try {
+      await navigator.clipboard.writeText(text);
+      setAnnouncement(message);
+    } catch {
+      setActionError("无法写入剪贴板。");
+    }
+  }
+
+  function resolveThreadWorkspacePath(task?: Task | null) {
+    if (task?.developmentContext?.type === "worktree") return task.developmentContext.path;
+    return developmentScan.workspacePath ?? selectedDeviceWorkspacePath ?? hostContext?.workspacePath ?? null;
+  }
+
+  async function resolveCodexThreadTitle(threadId: string, fallbackTitle = "") {
+    const codexThreadId = threadId.trim();
+    const fallback = fallbackTitle.trim();
+    if (!codexThreadId) return fallback;
+    const cached = codexThreadTitleCacheRef.current.get(codexThreadId);
+    if (cached !== undefined) return cached || fallback;
+    try {
+      const title = (await getCodexThreadTitle(codexThreadId))?.trim() ?? "";
+      codexThreadTitleCacheRef.current.set(codexThreadId, title);
+      return title || fallback;
+    } catch {
+      return fallback;
+    }
+  }
+
+  async function openThread(threadId: string, workspacePath?: string, threadTitle?: string) {
+    const codexThreadId = threadId.trim();
+    if (!codexThreadId) return;
+    const resolvedWorkspacePath = workspacePath?.trim() || resolveThreadWorkspacePath(detailTask);
+    const resolvedThreadTitle = await resolveCodexThreadTitle(codexThreadId, threadTitle);
+    if (embedded && window.parent !== window) {
+      window.parent.postMessage({
+        type: "taskboard:open-thread",
+        payload: {
+          threadId: codexThreadId,
+          ...(resolvedWorkspacePath ? { workspacePath: resolvedWorkspacePath } : {}),
+          ...(resolvedThreadTitle ? { threadTitle: resolvedThreadTitle } : {}),
+        },
+      }, "*");
+      return;
+    }
+
+    window.location.assign(`codex://threads/${encodeURIComponent(codexThreadId)}`);
+  }
+
+  async function continueThreadInPanel(task: Task, threadId: string) {
+    const codexThreadId = threadId.trim();
+    if (!codexThreadId) return;
+    const workspacePath = resolveThreadWorkspacePath(task);
+    const threadTitle = await resolveCodexThreadTitle(codexThreadId, task.title);
+    if (embedded && window.parent !== window) {
+      window.parent.postMessage({
+        type: "taskboard:show-thread-panel",
+        payload: {
+          threadId: codexThreadId,
+          title: `${task.identifier} ${task.title}`.slice(0, 160),
+          threadTitle,
+          ...(workspacePath ? { workspacePath } : {}),
+        },
+      }, "*");
+      setAnnouncement(`${task.identifier} 已在当前页面打开对话。`);
+      return;
+    }
+
+    void openThread(codexThreadId, workspacePath ?? undefined, threadTitle);
+  }
+
+  function expandCodexSidebar() {
+    if (!embedded || window.parent === window) return;
+    window.parent.postMessage({ type: "taskboard:expand-sidebar" }, "*");
+  }
+
+  function openTaskInThread(task: Task) {
+    if (!manageTaskboardSkillPath) {
+      setActionError("任务面板还没有读取到 manage-taskboard Skill 路径，请刷新后重试。");
+      return;
+    }
+    const worktreePath = task.developmentContext?.type === "worktree"
+      ? task.developmentContext.path
+      : null;
+    const workspacePath = worktreePath
+      ?? selectedDeviceWorkspacePath
+      ?? developmentScan.workspacePath
+      ?? hostContext?.workspacePath;
+    const instruction = `e-taskboard Addressing the tasks mentioned in ${task.identifier}`;
+    const prompt = `[$manage-taskboard](${manageTaskboardSkillPath}) ${instruction}`;
+
+    if (!embedded || window.parent === window) {
+      const query = new URLSearchParams();
+      if (workspacePath) query.set("path", workspacePath);
+      query.set("prompt", prompt);
+      window.location.assign(`codex://new?${query.toString().replace(/\+/g, "%20")}`);
+      return;
+    }
+    if (openingThreadTaskId) return;
+    const codexProject = hostContext?.projects?.find((project) => project.id === selectedProject?.id);
+    setOpeningThreadTaskId(task.id);
+    setActionError(null);
+    window.parent.postMessage({
+      type: "taskboard:create-thread",
+      payload: {
+        taskId: task.id,
+        identifier: task.identifier,
+        instruction,
+        skillName: "manage-taskboard",
+        skillDisplayName: "Manage Taskboard",
+        skillPath: manageTaskboardSkillPath,
+        codexProjectId: codexProject?.id ?? (
+          selectedProject?.id === DEFAULT_PROJECT_ID ? hostContext?.projectId : selectedProject?.id
+        ),
+        projectName: selectedProject ? selectedProjectDisplayName : undefined,
+        workspacePath,
+        workspaceLabel: worktreePath ? workspaceName(worktreePath) : undefined,
+      },
+    }, "*");
+  }
+
+  function changeProject(projectId: string) {
+    closeContextMenu();
+    setProjectMenuOpen(false);
+    setPendingBulkDeleteTasks([]);
+    setDetailTaskIdentifier(null);
+    setSelectedProjectIds(new Set());
+    setProjectSelectionBox(null);
+    setSelectedTaskIds(new Set());
+    setBoardView("issues");
+    setSelectedProjectId(projectId);
+    window.localStorage.setItem(LAST_PROJECT_KEY, projectId);
+    setSearch("");
+    setFilters(EMPTY_TASK_FILTERS);
+    setActionError(null);
+    undoStackRef.current = [];
+    setUndoNotice(null);
+    const url = buildIssueUrl(window.location.href, projectId, null);
+    window.history.replaceState(null, "", url);
+  }
+
+  function returnToProjectHome() {
+    closeContextMenu();
+    setProjectMenuOpen(false);
+    setPendingBulkDeleteTasks([]);
+    setDetailTaskIdentifier(null);
+    setSelectedProjectIds(new Set());
+    setProjectSelectionBox(null);
+    setSelectedTaskIds(new Set());
+    setSelectedProjectId("");
+    window.localStorage.removeItem(LAST_PROJECT_KEY);
+    setSearch("");
+    setFilters(EMPTY_TASK_FILTERS);
+    setActionError(null);
+    undoStackRef.current = [];
+    setUndoNotice(null);
+    const url = buildIssueUrl(window.location.href, null, null);
+    window.history.replaceState(null, "", url);
+    void loadProjectList();
+  }
+
+  function toggleFavoriteProject() {
+    if (!selectedProjectId) return;
+    const shouldFavorite = !favoriteProjectIds.has(selectedProjectId);
+    setFavoriteProjectIds((current) => {
+      const next = new Set(current);
+      if (shouldFavorite) next.add(selectedProjectId);
+      else next.delete(selectedProjectId);
+      window.localStorage.setItem(FAVORITE_PROJECTS_KEY, JSON.stringify([...next]));
+      return next;
+    });
+    setAnnouncement(`${selectedProjectDisplayName || "项目"}${shouldFavorite ? "已收藏。" : "已取消收藏。"}`);
+  }
+
+  async function ensureProject(choice: ProjectChoice): Promise<Project> {
+    const existing = projects.find((candidate) => candidate.id === choice.id);
+    if (existing) return existing;
+    let workspacePath = choice.workspacePath;
+    if (!workspacePath) {
+      try {
+        const workspaces = await listDeviceWorkspaces();
+        mergeDeviceWorkspacePaths(workspaces);
+        workspacePath = workspaces[choice.id] ?? null;
+      } catch {}
+    }
+    try {
+      const project = await createProjectRequest({
+        id: choice.id,
+        name: choice.name,
+        workspacePath,
+      });
+      setProjects((current) => (
+        current.some((candidate) => candidate.id === project.id) ? current : [...current, project]
+      ));
+      return project;
+    } catch (error) {
+      if (!(error instanceof ApiError) || error.code !== "PROJECT_EXISTS") throw error;
+      const nextProjects = await listProjects();
+      setProjects(nextProjects);
+      const project = nextProjects.find((candidate) => candidate.id === choice.id) ?? null;
+      if (!project) throw error;
+      return project;
+    }
+  }
+
+  async function selectProject(choice: ProjectChoice, options: { createIssue?: boolean } = {}) {
+    if (openingProjectId) return;
+    setOpeningProjectId(choice.id);
+    setActionError(null);
+    try {
+      const project = await ensureProject(choice);
+      changeProject(project.id);
+      if (options.createIssue) {
+        setEditor({ task: null, status: "backlog", projectId: project.id });
+      }
+    } catch (error) {
+      setActionError(errorMessage(error));
+    } finally {
+      setOpeningProjectId(null);
+    }
+  }
+
+  async function mutateProjects(projectIds: string[], action: "archive" | "delete") {
+    if (projectActionPending !== null) return;
+    const requestedIds = new Set(projectIds);
+    const targets = projectChoices.filter((project) => (
+      requestedIds.has(project.id) && canManageProjectChoice(project)
+    ));
+    if (targets.length === 0) return;
+
+    setActionError(null);
+    setProjectActionPending(action);
+    const completedIds: string[] = [];
+    let completedAll = false;
+    try {
+      for (const project of targets) {
+        if (action === "archive") await archiveProjectRequest(project.id);
+        else await deleteProjectRequest(project.id);
+        completedIds.push(project.id);
+      }
+      completedAll = true;
+    } catch (error) {
+      setActionError(errorMessage(error));
+    } finally {
+      if (completedIds.length > 0) {
+        forgetProjects(completedIds);
+        setSelectedProjectIds((current) => {
+          const completed = new Set(completedIds);
+          const next = new Set([...current].filter((projectId) => !completed.has(projectId)));
+          return sameStringSet(next, current) ? current : next;
+        });
+      }
+      setProjectSelectionBox(null);
+      await refreshProjectList();
+      setProjectActionPending(null);
+    }
+
+    if (completedAll) {
+      setAnnouncement(`${targets.length} 个项目已${action === "archive" ? "归档" : "删除"}。`);
+    }
+  }
+
+  const contextName = workspaceName(hostContext?.workspacePath);
+  const headerProjectName = selectedProjectDisplayName || "任务面板";
+  const appShellStyle = embedded
+    ? { "--codex-titlebar-left-inset": `${hostContext?.titlebarLeftInset ?? 0}px` } as CSSProperties
+    : undefined;
+  const bulkProjectMoveLabel = selectedActiveTasks.length > 0
+    ? `移动 ${selectedActiveTasks.length} 个任务`
+    : "移动到项目";
+  const bulkArchiveLabel = bulkArchivingSelectedTasks
+    ? "归档中..."
+    : selectedActiveTasks.length > 0
+      ? `归档 ${selectedActiveTasks.length} 个`
+      : "归档";
+  const bulkDeleteLabel = bulkDeletingSelectedTasks
+    ? "删除中..."
+    : selectedActiveTasks.length > 0
+      ? `删除 ${selectedActiveTasks.length} 个`
+      : "删除";
+  const selectedProjectActionIds = selectedManagedProjectChoices.map((project) => project.id);
+  const projectActionBusy = projectActionPending !== null;
+  const projectArchiveLabel = projectActionPending === "archive" ? "归档中..." : "归档";
+  const projectDeleteLabel = projectActionPending === "delete" ? "删除中..." : "删除";
+  const bulkProjectMoveMenu = bulkProjectMoveMenuOpen ? createPortal(
+    <div
+      ref={bulkProjectMoveMenuRef}
+      className="bulk-project-move-menu"
+      role="menu"
+      aria-label="移动到项目"
+      style={{
+        left: bulkProjectMoveMenuPosition.left,
+        top: bulkProjectMoveMenuPosition.top,
+        visibility: bulkProjectMoveMenuPosition.ready ? "visible" : "hidden",
+      }}
+    >
+      <span>移动到项目</span>
+      {projectMoveChoices.map((project) => (
+        <button
+          key={project.id}
+          type="button"
+          role="menuitem"
+          disabled={movingTaskId !== null}
+          onClick={() => void moveSelectedTasksToProject(project.id)}
+        >
+          <span className="project-avatar" aria-hidden="true">{project.name.slice(0, 1).toUpperCase()}</span>
+          <span>{project.name}</span>
+        </button>
+      ))}
+    </div>,
+    document.body,
+  ) : null;
+
+  return (
+    <div className={`app-shell${embedded ? " embedded" : ""}`} style={appShellStyle}>
+      {taskboardMetadata && taskboardMetadata.mode !== "cloud" && (
+        <LocalRealtimeSync
+          selectedProjectId={selectedProjectId}
+          detailTaskId={detailTaskId}
+          refreshProjectList={refreshProjectList}
+          refreshTasks={refreshTasks}
+          refreshWorkflowOptions={refreshWorkflowOptions}
+          setConnection={setConnection}
+          setCommentsRevision={setCommentsRevision}
+          setAttachmentsRevision={setAttachmentsRevision}
+        />
+      )}
+      {!embedded && (
+        <aside className="app-nav" aria-label="Taskboard navigation">
+          <div className="brand-row">
+            <span className="brand-mark" aria-hidden="true"><LinearIcon name="project" /></span>
+            <span>任务面板</span>
+          </div>
+
+          <nav className="primary-nav" aria-label="Views">
+            <span className="nav-label">工作区</span>
+            <button className="nav-item active" type="button" aria-current="page">
+              <span className="nav-glyph" aria-hidden="true">
+                <LinearIcon name="myIssues" />
+              </span>
+              任务
+              <span className="nav-count">{tasks.length}</span>
+            </button>
+          </nav>
+
+          <div className="project-nav">
+            <span className="nav-label">项目</span>
+            {projects.map((project) => {
+              const projectName = projectDisplayName(project);
+              return (
+                <button
+                  key={project.id}
+                  type="button"
+                  className={`project-nav-item${selectedProjectId === project.id ? " active" : ""}`}
+                  onClick={() => changeProject(project.id)}
+                >
+                  <span className="project-dot" aria-hidden="true" />
+                  <span>{projectName}</span>
+                </button>
+              );
+            })}
+          </div>
+
+          <div className="nav-spacer" />
+          <div className="nav-footer">
+            <div className={`connection connection-${connection}`}>
+              <span aria-hidden="true" />
+              {connection === "live" ? "实时同步" : "正在重新连接…"}
+            </div>
+            <button
+              type="button"
+              className="theme-toggle"
+              onClick={() => setTheme((current) => current === "dark" ? "light" : "dark")}
+              aria-label={`Switch to ${theme === "dark" ? "light" : "dark"} theme`}
+            >
+              <span aria-hidden="true"><LinearIcon name={theme === "dark" ? "sun" : "moon"} /></span>
+              {theme === "dark" ? "浅色模式" : "深色模式"}
+            </button>
+          </div>
+        </aside>
+      )}
+
+      <main className="workspace">
+        {selectedProjectId ? (
+          <header className="workspace-header">
+          <div className="workspace-title">
+            <div className="workspace-kicker">
+              {detailTask && (
+                <button
+                  className="detail-back-button"
+                  type="button"
+                  aria-label="返回任务看板"
+                  title="返回任务看板 (Esc)"
+                  onClick={closeTaskDetail}
+                >
+                  <LinearIcon name="chevronLeft" />
+                </button>
+              )}
+              {embedded && hostContext?.sidebarCollapsed && (
+                <button
+                  className="detail-back-button codex-sidebar-expand-button"
+                  type="button"
+                  aria-label="展开 Codex 侧边栏"
+                  title="展开侧边栏"
+                  onClick={expandCodexSidebar}
+                >
+                  <LinearIcon name="codexSidebarExpand" />
+                </button>
+              )}
+              {selectedProjectId && (
+                <button
+                  className="detail-back-button project-home-button"
+                  type="button"
+                  aria-label="返回项目首页"
+                  title="返回项目首页"
+                  onClick={returnToProjectHome}
+                >
+                  <LinearIcon name="home" />
+                  <span>首页</span>
+                </button>
+              )}
+              {selectedProjectId && <span className="breadcrumb-chevron" aria-hidden="true"><LinearIcon name="chevronRight" /></span>}
+              {selectedProjectId ? (
+                <div className="header-project-switcher" data-project-switcher>
+                  <button
+                    className="header-project-button"
+                    type="button"
+                    aria-label="切换项目"
+                    aria-haspopup="menu"
+                    aria-expanded={projectMenuOpen}
+                    onClick={() => setProjectMenuOpen((current) => !current)}
+                  >
+                    <span className="project-avatar" aria-hidden="true">
+                      {headerProjectName.slice(0, 1).toUpperCase()}
+                    </span>
+                    <span className="project-name">{headerProjectName}</span>
+                    <LinearIcon className="project-switcher-chevron" name="chevronDown" />
+                  </button>
+                  {projectMenuOpen && (
+                    <div className="header-project-menu" role="menu" aria-label="项目">
+                      <span>切换项目</span>
+                      {projectChoices.map((project) => (
+                        <button
+                          type="button"
+                          role="menuitemradio"
+                          aria-checked={project.id === selectedProjectId}
+                          disabled={openingProjectId !== null}
+                          key={project.id}
+                          onClick={() => {
+                            if (project.id === selectedProjectId) setProjectMenuOpen(false);
+                            else void selectProject(project);
+                          }}
+                        >
+                          <span className="project-avatar" aria-hidden="true">{project.name.slice(0, 1).toUpperCase()}</span>
+                          <span>{project.name}</span>
+                          {favoriteProjectIds.has(project.id) && <span className="project-menu-favorite" aria-label="已收藏"><LinearIcon name="favorite" /></span>}
+                          {project.id === selectedProjectId && <span className="project-menu-check" aria-hidden="true"><LinearIcon name="check" /></span>}
+                        </button>
+                      ))}
+                    </div>
+                  )}
+                </div>
+              ) : (
+                <>
+                  <span className="project-avatar" aria-hidden="true">
+                    {headerProjectName.slice(0, 1).toUpperCase()}
+                  </span>
+                  <span className="project-name">{headerProjectName}</span>
+                </>
+              )}
+              {!selectedProjectId && (
+                <>
+                  <span className="breadcrumb-chevron" aria-hidden="true"><LinearIcon name="chevronRight" /></span>
+                  <strong>项目</strong>
+                </>
+              )}
+              {!detailTask && selectedProjectId && (
+                <button
+                  className={`favorite-button${favoriteProjectIds.has(selectedProjectId) ? " active" : ""}`}
+                  type="button"
+                  aria-label={favoriteProjectIds.has(selectedProjectId) ? "取消收藏项目" : "收藏项目"}
+                  aria-pressed={favoriteProjectIds.has(selectedProjectId)}
+                  title={favoriteProjectIds.has(selectedProjectId) ? "取消收藏" : "收藏项目"}
+                  onClick={toggleFavoriteProject}
+                >
+                  <LinearIcon className="favorite-icon" name="favorite" />
+                </button>
+              )}
+              {!detailTask && selectedProjectId && embedded && contextName && <span className="codex-context">{contextName}</span>}
+            </div>
+          </div>
+
+          <div ref={dragRegionRef} className="workspace-drag-region" aria-hidden="true" />
+
+            <div className="header-actions">
+            {selectedProjectId && (
+              <Suspense fallback={null}>
+                <ProjectAutomationMenu
+                  automation={selectedProjectAutomation}
+                  pending={automationPending}
+                  error={automationError}
+                  unavailableReason={automationProjectContext.unavailableReason}
+                  onOpen={() => void reconcileProjectAutomation()}
+                  onChange={(options) => void saveProjectAutomation(options)}
+                />
+              </Suspense>
+            )}
+            {selectedProjectId && (boardView === "issues" || boardView === "hierarchy") && (
+              <button
+                className="icon-button header-create-button"
+                type="button"
+                onClick={() => setEditor({ task: null, status: "backlog" })}
+                aria-label="新建任务"
+                title="新建任务 (C)"
+              >
+                <LinearIcon name="plus" />
+              </button>
+            )}
+          </div>
+          </header>
+        ) : (
+          <div ref={dragRegionRef} className="home-window-drag-region" aria-hidden="true" />
+        )}
+
+        {selectedProjectId && !detailTask && <div className="board-toolbar">
+          <div className="view-tabs" aria-label="看板视图">
+            <button
+              className={`view-tab${boardView === "issues" ? " active" : ""}`}
+              type="button"
+              aria-pressed={boardView === "issues"}
+              onClick={() => selectBoardView("issues")}
+            >
+              任务看板
+            </button>
+            <button
+              className={`view-tab${boardView === "hierarchy" ? " active" : ""}`}
+              type="button"
+              aria-pressed={boardView === "hierarchy"}
+              onClick={() => selectBoardView("hierarchy")}
+            >
+              层级视图
+            </button>
+            <button
+              className={`view-tab${boardView === "archive" ? " active" : ""}`}
+              type="button"
+              aria-pressed={boardView === "archive"}
+              onClick={() => selectBoardView("archive")}
+            >
+              已归档
+            </button>
+            {SHOW_WORKFLOW_BOARD_ENTRY && (
+              <button
+                className={`view-tab${boardView === "workflow" ? " active" : ""}`}
+                type="button"
+                aria-pressed={boardView === "workflow"}
+                onClick={() => selectBoardView("workflow")}
+              >
+                节点模式
+              </button>
+            )}
+          </div>
+          {(boardView === "issues" || boardView === "hierarchy" || boardView === "archive") && <div className="toolbar-tools">
+            {boardView === "issues" && (
+              <>
+              <div className="bulk-task-actions" aria-label="批量任务操作">
+                <button
+                  className="bulk-task-action"
+                  type="button"
+                  disabled={bulkTaskActionDisabled}
+                  aria-label={selectedActiveTasks.length > 0 ? `归档 ${selectedActiveTasks.length} 个任务` : "批量归档任务"}
+                  title={selectedActiveTasks.length > 0 ? `归档 ${selectedActiveTasks.length} 个任务` : "选择任务后批量归档"}
+                  onClick={() => void archiveSelectedTasks()}
+                >
+                  <LinearIcon name="folder" />
+                  <span>{bulkArchiveLabel}</span>
+                </button>
+                <button
+                  className="bulk-task-action danger"
+                  type="button"
+                  disabled={bulkTaskActionDisabled}
+                  aria-label={selectedActiveTasks.length > 0 ? `删除 ${selectedActiveTasks.length} 个任务` : "批量删除任务"}
+                  title={selectedActiveTasks.length > 0 ? `删除 ${selectedActiveTasks.length} 个任务` : "选择任务后批量删除"}
+                  onClick={requestBulkTaskDelete}
+                >
+                  <LinearIcon name="trash" />
+                  <span>{bulkDeleteLabel}</span>
+                </button>
+              </div>
+              <button
+                ref={bulkProjectMoveTriggerRef}
+                className={`bulk-project-move${bulkProjectMoveMenuOpen ? " is-open" : ""}${selectedActiveTasks.length > 0 ? " has-selection" : ""}`}
+                type="button"
+                disabled={bulkProjectMoveDisabled}
+                aria-haspopup="menu"
+                aria-expanded={bulkProjectMoveMenuOpen}
+                aria-label={selectedActiveTasks.length > 0 ? `移动 ${selectedActiveTasks.length} 个任务到项目` : "移动到项目"}
+                title={
+                  projectMoveChoices.length === 0
+                    ? "没有可移动的目标项目"
+                    : selectedActiveTasks.length > 0
+                      ? `移动 ${selectedActiveTasks.length} 个任务到项目`
+                      : "选择任务后移动到项目"
+                }
+                onClick={() => {
+                  setBulkProjectMoveMenuPosition((current) => ({ ...current, ready: false }));
+                  setBulkProjectMoveMenuOpen((current) => !current);
+                }}
+              >
+                <LinearIcon className="bulk-project-move-icon" name="project" />
+                <span>{bulkProjectMoveLabel}</span>
+                <LinearIcon className="bulk-project-move-chevron" name="chevronDown" />
+              </button>
+              {bulkProjectMoveMenu}
+              </>
+            )}
+            <label className={`search-field${search ? " has-value" : ""}`} title="搜索任务 (/)" >
+              <LinearIcon className="search-icon" name="search" />
+              <span className="sr-only">搜索任务</span>
+              <input
+                id="task-search"
+                type="search"
+                value={search}
+                onChange={(event) => setSearch(event.target.value)}
+                placeholder="搜索任务…"
+              />
+              {!search && <kbd>/</kbd>}
+            </label>
+            <Suspense fallback={null}>
+              <TaskFilterMenu
+                tasks={tasks}
+                search={search}
+                labels={availableLabels}
+                filters={filters}
+                onChange={setFilters}
+              />
+            </Suspense>
+            {boardView === "issues" && (
+              <Suspense fallback={null}>
+                <BoardSettingsMenu
+                  showEmptyColumns={showEmptyColumns}
+                  onShowEmptyColumnsChange={updateShowEmptyColumns}
+                />
+              </Suspense>
+            )}
+            {(search || activeFilterCount > 0) && (
+              <button
+                className="clear-filter"
+                type="button"
+                aria-label="清除筛选"
+                title="清除筛选"
+                onClick={() => { setSearch(""); setFilters(EMPTY_TASK_FILTERS); }}
+              >
+                <LinearIcon name="close" />
+              </button>
+            )}
+          </div>}
+        </div>}
+
+        {(loadError || actionError) && (
+          <div className="error-banner" role="alert">
+            <span className="error-mark" aria-hidden="true"><LinearIcon name="alert" /></span>
+            <div><strong>Taskboard needs attention</strong><p>{actionError ?? loadError}</p></div>
+            <button
+              type="button"
+              onClick={() => {
+                setActionError(null);
+                if (selectedProjectId) void refreshTasks(selectedProjectId);
+                else void loadProjectList();
+              }}
+            >
+              Try again
+            </button>
+          </div>
+        )}
+
+        {!selectedProjectId ? (
+          <section className="project-home">
+            <div className="project-home-heading">
+              <span>任务面板</span>
+              <h1>选择项目</h1>
+              <p>从 Codex 项目开始，或继续使用之前保存的项目。</p>
+            </div>
+            {projectsLoading ? (
+              <div className="project-grid project-grid-loading" aria-label="正在加载项目" aria-busy="true">
+                <span /><span /><span />
+              </div>
+            ) : projectChoices.length > 0 ? (
+              <>
+                <div
+                  className={`project-home-bulk-actions${selectedManagedProjectChoices.length > 0 ? " is-visible" : ""}`}
+                  aria-hidden={selectedManagedProjectChoices.length === 0}
+                >
+                    <span>已选 {selectedManagedProjectChoices.length} 个项目</span>
+                    <button
+                      className="project-bulk-action"
+                      type="button"
+                      disabled={projectActionBusy || selectedProjectActionIds.length === 0}
+                      onClick={() => void mutateProjects(selectedProjectActionIds, "archive")}
+                    >
+                      <LinearIcon name="archive" />
+                      <span>{projectArchiveLabel}</span>
+                    </button>
+                    <button
+                      className="project-bulk-action danger"
+                      type="button"
+                      disabled={projectActionBusy || selectedProjectActionIds.length === 0}
+                      onClick={() => void mutateProjects(selectedProjectActionIds, "delete")}
+                    >
+                      <LinearIcon name="trash" />
+                      <span>{projectDeleteLabel}</span>
+                    </button>
+                </div>
+                <div
+                  className={`project-home-groups${projectSelectionBox ? " is-selecting" : ""}`}
+                  onPointerDown={startProjectBoxSelection}
+                  onPointerMove={updateProjectBoxSelection}
+                  onPointerUp={finishProjectBoxSelection}
+                  onPointerCancel={finishProjectBoxSelection}
+                  onLostPointerCapture={finishProjectBoxSelection}
+                >
+                  {[
+                    { id: "with-issues", title: "已有任务", projects: projectsWithIssues },
+                    { id: "without-issues", title: "尚未添加任务", projects: projectsWithoutIssues },
+                  ].map((group) => (
+                    <section className="project-home-group" key={group.id} aria-labelledby={`project-group-${group.id}`}>
+                      <div className="project-group-heading">
+                        <h2 id={`project-group-${group.id}`}>{group.title}</h2>
+                        <span>{group.projects.length}</span>
+                      </div>
+                      {group.projects.length > 0 ? (
+                        <div className="project-grid">
+                          {group.projects.map((project) => {
+                            const canManageProject = canManageProjectChoice(project);
+                            const isSelected = selectedProjectIds.has(project.id);
+                            const workspacePath = project.workspacePath ?? deviceWorkspacePaths[project.id] ?? "";
+                            return (
+                              <div
+                                className={`project-card${isSelected ? " is-selected" : ""}`}
+                                key={project.id}
+                                data-project-id={project.id}
+                                data-project-selectable={canManageProject ? "true" : undefined}
+                              >
+                                <div className="project-card-main">
+                                  <button
+                                    className="project-card-open"
+                                    type="button"
+                                    disabled={openingProjectId !== null || projectActionBusy}
+                                    onClick={() => void selectProject(project)}
+                                  >
+                                    <span className="project-card-avatar" aria-hidden="true">
+                                      {project.name.slice(0, 1).toUpperCase()}
+                                    </span>
+                                    <span className="project-card-copy">
+                                      <strong>{project.name}</strong>
+                                      <span>
+                                        {project.inCodex ? "Codex 项目" : "已保存的项目"}
+                                        {project.issueCount > 0 ? ` · ${project.issueCount} 个任务` : ""}
+                                      </span>
+                                    </span>
+                                    {favoriteProjectIds.has(project.id) && <span className="project-card-favorite" aria-label="已收藏"><LinearIcon name="favorite" /></span>}
+                                    <span className="project-card-action" aria-hidden="true">
+                                      {openingProjectId === project.id ? "正在打开…" : <LinearIcon name="chevronRight" />}
+                                    </span>
+                                  </button>
+                                  <div className="project-card-controls">
+                                    <button
+                                      className="icon-button project-card-create"
+                                      type="button"
+                                      disabled={openingProjectId !== null || projectActionBusy}
+                                      onClick={() => void selectProject(project, { createIssue: true })}
+                                      aria-label={`在 ${project.name} 中新建任务`}
+                                      title={`在 ${project.name} 中新建任务`}
+                                    >
+                                      <LinearIcon name="plus" />
+                                    </button>
+                                    {canManageProject && (
+                                      <>
+                                        <button
+                                          className="icon-button project-card-archive"
+                                          type="button"
+                                          disabled={openingProjectId !== null || projectActionBusy}
+                                          onClick={() => void mutateProjects([project.id], "archive")}
+                                          aria-label={`归档 ${project.name}`}
+                                          title={`归档 ${project.name}`}
+                                        >
+                                          <LinearIcon name="archive" />
+                                        </button>
+                                        <button
+                                          className="icon-button project-card-delete"
+                                          type="button"
+                                          disabled={openingProjectId !== null || projectActionBusy}
+                                          onClick={() => void mutateProjects([project.id], "delete")}
+                                          aria-label={`删除 ${project.name}`}
+                                          title={`删除 ${project.name}`}
+                                        >
+                                          <LinearIcon name="trash" />
+                                        </button>
+                                      </>
+                                    )}
+                                  </div>
+                                </div>
+                                <label className="project-card-directory">
+                                  <LinearIcon name="folder" />
+                                  <input
+                                    key={workspacePath}
+                                    type="text"
+                                    defaultValue={workspacePath}
+                                    placeholder="设置此设备的项目目录"
+                                    aria-label={`${project.name} 在此设备上的项目目录`}
+                                    onBlur={(event) => rememberDeviceWorkspacePath(project.id, event.currentTarget.value)}
+                                    onKeyDown={(event) => {
+                                      if (event.key === "Enter") event.currentTarget.blur();
+                                    }}
+                                  />
+                                </label>
+                              </div>
+                            );
+                          })}
+                        </div>
+                      ) : (
+                        <p className="project-group-empty">暂无项目</p>
+                      )}
+                    </section>
+                  ))}
+                  {projectSelectionBox && (
+                    <div
+                      className="project-selection-box"
+                      style={projectSelectionBox}
+                      aria-hidden="true"
+                    />
+                  )}
+                </div>
+              </>
+            ) : (
+              <div className="project-home-empty">
+                <span className="empty-orbit" aria-hidden="true"><i /><i /></span>
+                <h2>还没有项目</h2>
+                <p>在 Codex 中创建项目后，再打开任务面板。</p>
+              </div>
+            )}
+          </section>
+        ) : detailTask && selectedProject ? (
+          <Suspense fallback={<div className="loading-board archive-loading" aria-label="正在打开任务" aria-busy="true" />}>
+            <TaskDetail
+              key={detailTask.id}
+              task={detailTask}
+              tasks={tasks}
+              currentUser={currentUser}
+              availableLabels={availableLabels}
+              workflows={workflowOptions}
+              developmentScan={developmentScan}
+              developmentScanLoading={developmentScanLoading}
+              commentsRevision={commentsRevision}
+              attachmentsRevision={attachmentsRevision}
+              onUpdate={(current, changes) => updateTaskProperties(current, changes)}
+              onArchive={archiveTask}
+              onRestore={restoreArchivedTask}
+              onDelete={deleteTask}
+              onOpenTask={openTaskDetail}
+              onAddRelation={(current, type, relatedTaskId) => (
+                mutateTaskRelation("add", current, type, relatedTaskId)
+              )}
+              onRemoveRelation={(current, type, relatedTaskId) => (
+                mutateTaskRelation("remove", current, type, relatedTaskId)
+              )}
+              onContinueThread={continueThreadInPanel}
+              onOpenThread={openThread}
+              onOpenInThread={openTaskInThread}
+              openingThread={openingThreadTaskId === detailTask.id}
+              onError={setActionError}
+              onAnnounce={setAnnouncement}
+            />
+          </Suspense>
+        ) : boardView === "archive" ? (
+          tasksLoading && !hasLoadedTasks ? (
+            <div className="loading-board archive-loading" aria-label="正在加载归档任务" aria-busy="true">
+              {TASK_STATUSES.slice(0, 3).map((status) => (
+                <div className="loading-column" key={status}>
+                  <span /><div /><div />
+                </div>
+              ))}
+            </div>
+          ) : (
+            <Suspense fallback={<div className="loading-board archive-loading" aria-label="正在打开归档任务" aria-busy="true" />}>
+              <ArchivedIssues
+                tasks={filteredTasks}
+                totalTasks={tasks.length}
+                hasQuery={Boolean(search || activeFilterCount > 0)}
+                restoringTaskId={restoringArchivedTaskId}
+                deletingTaskId={deletingArchivedTask ? pendingArchivedDeleteTask?.id ?? null : null}
+                onClearQuery={() => { setSearch(""); setFilters(EMPTY_TASK_FILTERS); }}
+                onOpenTask={openTaskDetail}
+                onRestore={(task) => void restoreArchivedTask(task)}
+                onRequestDelete={setPendingArchivedDeleteTask}
+              />
+            </Suspense>
+          )
+        ) : boardView === "hierarchy" ? (
+          tasksLoading && !hasLoadedTasks ? (
+            <div className="loading-board archive-loading" aria-label="正在加载层级视图" aria-busy="true">
+              {TASK_STATUSES.slice(0, 3).map((status) => (
+                <div className="loading-column" key={status}>
+                  <span /><div /><div />
+                </div>
+              ))}
+            </div>
+          ) : (
+            <Suspense fallback={<div className="loading-board archive-loading" aria-label="正在打开层级视图" aria-busy="true" />}>
+              <IssueHierarchyView
+                tasks={filteredTasks}
+                allTasks={tasks}
+                totalTasks={tasks.length}
+                hasQuery={Boolean(search || activeFilterCount > 0)}
+                onClearQuery={() => { setSearch(""); setFilters(EMPTY_TASK_FILTERS); }}
+                onOpenTask={openTaskDetail}
+                onOpenThread={openThread}
+              />
+            </Suspense>
+          )
+        ) : boardView === "workflow" ? (
+          <Suspense fallback={<div className="workflow-board-loading">正在打开节点模式…</div>}>
+            <WorkflowBoard
+              key={selectedProject?.id ?? DEFAULT_PROJECT_ID}
+              projectId={selectedProject?.id ?? DEFAULT_PROJECT_ID}
+              projectName={selectedProjectDisplayName || "当前项目"}
+              workspacePath={
+                selectedDeviceWorkspacePath
+                ?? developmentScan.workspacePath
+                ?? hostContext?.workspacePath
+              }
+              revision={workflowRevision}
+              onWorkflowsChange={setWorkflowOptions}
+            />
+          </Suspense>
+        ) : tasksLoading && !hasLoadedTasks ? (
+          <div className="loading-board" aria-label="Loading tasks" aria-busy="true">
+            {TASK_STATUSES.map((status) => (
+              <div className="loading-column" key={status}>
+                <span /><div /><div />
+              </div>
+            ))}
+          </div>
+        ) : (
+          <div
+            className={`board-scroll${selectionBox ? " is-selecting" : ""}`}
+            aria-label="Task board"
+            onPointerDown={startBoxSelection}
+            onPointerMove={updateBoxSelection}
+            onPointerUp={finishBoxSelection}
+            onPointerCancel={finishBoxSelection}
+            onLostPointerCapture={finishBoxSelection}
+          >
+            <div className="board">
+              {filteredTasks.length === 0 && tasks.length > 0 && !showEmptyColumns && (
+                <section className="page-empty filter-empty board-filter-empty">
+                  <span className="empty-search" aria-hidden="true"><LinearIcon name="search" /></span>
+                  <h2>没有匹配的任务</h2>
+                  <p>请更换搜索词，或移除一个筛选条件。</p>
+                  <button
+                    className="button secondary"
+                    type="button"
+                    onClick={() => { setSearch(""); setFilters(EMPTY_TASK_FILTERS); }}
+                  >
+                    清除筛选
+                  </button>
+                </section>
+              )}
+              {visibleStatuses.map((status) => (
+                <BoardColumn
+                  key={status}
+                  status={status}
+                  statusIndex={TASK_STATUSES.indexOf(status)}
+                  tasks={tasksByStatus[status]}
+                  allTasks={tasks}
+                  isDropTarget={dropTarget === status}
+                  draggedTaskId={draggedTaskId}
+                  draggedTaskIds={draggedTaskIds}
+                  selectedTaskIds={selectedTaskIdArray}
+                  draggedTaskHeight={draggedTaskHeight}
+                  movingTaskId={movingTaskId}
+                  settlingTaskId={settlingTaskId}
+                  contextMenuTaskId={contextMenu?.taskId ?? null}
+                  onCreate={(initialStatus) => setEditor({ task: null, status: initialStatus })}
+                  onEdit={openTaskDetail}
+                  onSelectionChange={setTaskSelection}
+                  onContextMenu={(task, position) => setContextMenu({ taskId: task.id, ...position })}
+                  onMove={(task, destination) => void moveTask(task, destination)}
+                  onDragStart={(task, height) => {
+                    const draggingIds = selectedTaskIds.has(task.id) ? selectedTaskIdArray : [task.id];
+                    setDraggedTaskId(task.id);
+                    setDraggedTaskIds(draggingIds);
+                    setDraggedTaskHeight(height);
+                    setDropTarget(task.status);
+                  }}
+                  onDragEnd={() => {
+                    setDraggedTaskId(null);
+                    setDraggedTaskIds([]);
+                    setDraggedTaskHeight(0);
+                    setDropTarget(null);
+                  }}
+                  onDragEnter={setDropTarget}
+                  onDrop={finishTaskDrop}
+                  onOpenThread={openThread}
+                  onHide={(hiddenStatus) => updateColumnVisibility(hiddenStatus, false)}
+                />
+              ))}
+              {hiddenStatuses.length > 0 && (
+                <Suspense fallback={null}>
+                  <HiddenColumns
+                    statuses={hiddenStatuses}
+                    counts={Object.fromEntries(
+                      TASK_STATUSES.map((status) => [status, tasksByStatus[status].length]),
+                    ) as Record<TaskStatus, number>}
+                    dropTarget={dropTarget}
+                    onDragTargetChange={setDropTarget}
+                    onDrop={(destination, taskId) => finishTaskDrop(destination, taskId)}
+                    onShow={(shownStatus) => updateColumnVisibility(shownStatus, true)}
+                  />
+                </Suspense>
+              )}
+            </div>
+            {selectionBox && (
+              <div
+                className="board-selection-box"
+                style={selectionBox}
+                aria-hidden="true"
+              />
+            )}
+          </div>
+        )}
+      </main>
+
+      {editor && (
+        <Suspense fallback={null}>
+          <TaskEditor
+            key={editor.task?.id ?? `new-${editor.projectId ?? selectedProjectId}-${editor.status}`}
+            task={editor.task}
+            initialStatus={editor.status}
+            labels={availableLabels}
+            workflows={workflowOptions}
+            currentUser={currentUser}
+            developmentScan={developmentScan}
+            developmentScanLoading={developmentScanLoading}
+            onCancel={() => setEditor(null)}
+            onSave={saveEditor}
+          />
+        </Suspense>
+      )}
+
+      {contextMenu && contextMenuTask && (
+        <Suspense fallback={null}>
+          <TaskContextMenu
+            task={contextMenuTask}
+            position={{ x: contextMenu.x, y: contextMenu.y }}
+            labels={availableLabels}
+            onClose={closeContextMenu}
+            onEdit={openTaskDetail}
+            onStatusChange={(task, status) => void moveTask(task, status)}
+            onPriorityChange={(task, nextPriority) => void updateTaskProperties(
+              task,
+              { priority: nextPriority },
+              `${task.identifier} 优先级已更新。`,
+            ).catch(() => {})}
+            onLabelsChange={(task, labels) => void updateTaskProperties(
+              task,
+              { labels },
+              `${task.identifier} 标签已更新。`,
+            ).catch(() => {})}
+            onDuplicate={(task) => void duplicateTask(task)}
+            onCopy={(text, message) => void copyText(text, message)}
+            onOpenInThread={openTaskInThread}
+            onArchive={(task) => void archiveTask(task)}
+          />
+        </Suspense>
+      )}
+
+      {pendingArchivedDeleteTask && (
+        <div className="delete-backdrop" role="presentation" onMouseDown={(event) => {
+          if (event.target === event.currentTarget && !deletingArchivedTask) setPendingArchivedDeleteTask(null);
+        }}>
+          <div className="delete-dialog" role="alertdialog" aria-modal="true" aria-labelledby="delete-archived-task-title">
+            <h2 id="delete-archived-task-title">永久删除这个归档任务？</h2>
+            <p>“{pendingArchivedDeleteTask.identifier} {pendingArchivedDeleteTask.title}” 会被永久删除，评论、附件和关联也会删除，无法恢复。</p>
+            <div>
+              <button className="button secondary" type="button" disabled={deletingArchivedTask} onClick={() => setPendingArchivedDeleteTask(null)}>取消</button>
+              <button className="button danger" type="button" disabled={deletingArchivedTask} onClick={() => void confirmArchivedTaskDelete()}>{deletingArchivedTask ? "删除中..." : "永久删除"}</button>
+            </div>
+          </div>
+        </div>
+      )}
+
+      {pendingBulkDeleteTasks.length > 0 && (
+        <div className="delete-backdrop" role="presentation" onMouseDown={(event) => {
+          if (event.target === event.currentTarget && !bulkDeletingSelectedTasks) setPendingBulkDeleteTasks([]);
+        }}>
+          <div className="delete-dialog" role="alertdialog" aria-modal="true" aria-labelledby="bulk-delete-task-title">
+            <h2 id="bulk-delete-task-title">永久删除 {pendingBulkDeleteTasks.length} 个任务？</h2>
+            <p>这些任务会被永久删除，评论、附件和关联也会删除，无法恢复。</p>
+            <div>
+              <button className="button secondary" type="button" disabled={bulkDeletingSelectedTasks} onClick={() => setPendingBulkDeleteTasks([])}>取消</button>
+              <button className="button danger" type="button" disabled={bulkDeletingSelectedTasks} onClick={() => void confirmBulkTaskDelete()}>{bulkDeletingSelectedTasks ? "删除中..." : "永久删除"}</button>
+            </div>
+          </div>
+        </div>
+      )}
+
+      {!embedded && (
+        <Suspense fallback={null}>
+          <AiChat
+            available={localAiChatAvailable}
+            projectId={selectedProjectId || null}
+            issueId={detailTaskId}
+          />
+        </Suspense>
+      )}
+
+      <div className="sr-only" role="status" aria-live="polite">{announcement}</div>
+      {undoNotice && (
+        <div
+          className="toast undo-toast"
+          role="status"
+          onAnimationEnd={() => setUndoNotice((current) => current?.id === undoNotice.id ? null : current)}
+        >
+          <span className="toast-check" aria-hidden="true"><LinearIcon name="check" /></span>
+          <span className="undo-toast-message">{undoNotice.message}</span>
+          <button type="button" onClick={() => void performUndo()}>
+            撤回 <kbd>{undoShortcut}</kbd>
+          </button>
+        </div>
+      )}
+      {announcement && (
+        <div className="toast" role="status" onAnimationEnd={() => setAnnouncementValue("")}>
+          <span aria-hidden="true"><LinearIcon name="check" /></span>{announcement}
+        </div>
+      )}
+      {draggedTaskId && (
+        <div className="drag-hint" aria-hidden="true">
+          {draggedTaskIds.length > 1 ? `拖动 ${draggedTaskIds.length} 个任务` : "拖到目标位置后松开"}
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/actors.ts b/apps/codex-taskboard/web/src/actors.ts
new file mode 100644
index 000000000..3b54103da
--- /dev/null
+++ b/apps/codex-taskboard/web/src/actors.ts
@@ -0,0 +1,27 @@
+import type { ActorIdentity, AssigneeTarget } from "./types";
+
+export const CODEX_AGENT_ACTOR: ActorIdentity = {
+  type: "agent",
+  id: "codex-agent",
+  name: "Codex Agent",
+  avatarUrl: null,
+};
+
+export function actorKey(actor: ActorIdentity): string {
+  return `${actor.type}:${actor.id}`;
+}
+
+export function actorForAssigneeTarget(
+  target: AssigneeTarget,
+  currentUser: ActorIdentity,
+): ActorIdentity {
+  return target === "codex-agent" ? CODEX_AGENT_ACTOR : currentUser;
+}
+
+export function assigneeTargetForActor(
+  actor: ActorIdentity,
+  currentUser: ActorIdentity,
+): AssigneeTarget | undefined {
+  if (actor.type === "agent") return "codex-agent";
+  return actor.id === currentUser.id ? "current-user" : undefined;
+}
diff --git a/apps/codex-taskboard/web/src/aiChatState.ts b/apps/codex-taskboard/web/src/aiChatState.ts
new file mode 100644
index 000000000..64d591145
--- /dev/null
+++ b/apps/codex-taskboard/web/src/aiChatState.ts
@@ -0,0 +1,289 @@
+import type {
+  AiChatEvent,
+  AiChatAttachmentInput,
+  AiChatModel,
+  AiChatSkill,
+  AiChatSandbox,
+  AiChatThread,
+  AiChatThreadSnapshot,
+  AiChatThreadStatus,
+  TaskboardCapabilities,
+} from "./types";
+
+export interface AiChatRouteState {
+  selectedThreadId: string | null;
+  pendingProjectId: string | null;
+  pendingIssueId: string | null;
+}
+
+export const AI_CHAT_SKILL_MARKER = "\uFFFC";
+
+export function parseAiChatComposerFragment(
+  raw: string,
+  validSkillIds: Iterable<string>,
+): { message: string; skillIds: string[] } | null {
+  if (!raw) return null;
+  try {
+    const parsed = JSON.parse(raw) as { message?: unknown; skillIds?: unknown };
+    const validIds = new Set(validSkillIds);
+    if (
+      typeof parsed.message !== "string"
+      || !Array.isArray(parsed.skillIds)
+      || !parsed.skillIds.every((skillId): skillId is string => typeof skillId === "string")
+      || parsed.message.split(AI_CHAT_SKILL_MARKER).length - 1 !== parsed.skillIds.length
+      || !parsed.skillIds.every((skillId) => validIds.has(skillId))
+    ) {
+      return null;
+    }
+    return { message: parsed.message, skillIds: parsed.skillIds };
+  } catch {
+    return null;
+  }
+}
+
+export function isAiChatCapabilityAvailable(capabilities?: TaskboardCapabilities): boolean {
+  return capabilities?.localAiChat === true;
+}
+
+export function buildThreadCreateInput(projectId: string, issueId: string | null) {
+  if (!projectId) return null;
+  return {
+    projectId,
+    ...(issueId ? { issueId } : {}),
+  };
+}
+
+export function settingsForNewAiThread<T extends Record<string, unknown>>(
+  targetProjectId: string,
+  catalogProjectId: string | null | undefined,
+  settings: T,
+): T | Record<string, never> {
+  return catalogProjectId === targetProjectId ? settings : {};
+}
+
+export function routeChatState(
+  state: AiChatRouteState,
+  projectId: string | null,
+  issueId: string | null,
+): AiChatRouteState {
+  return {
+    ...state,
+    pendingProjectId: projectId,
+    pendingIssueId: issueId,
+  };
+}
+
+export function normalizeChatSelection(
+  models: AiChatModel[],
+  model: string | null | undefined,
+  reasoningEffort: string | null | undefined,
+) {
+  const selectedModel = models.find((candidate) => candidate.slug === model) ?? models[0];
+  if (!selectedModel) return null;
+  return {
+    model: selectedModel.slug,
+    reasoningEffort: reasoningEffortForModel(selectedModel, reasoningEffort),
+  };
+}
+
+export function readSkillMention(
+  value: string,
+  caret: number,
+): { start: number; end: number; query: string } | null {
+  if (typeof value !== "string" || !Number.isFinite(caret)) return null;
+  const end = Math.min(Math.max(0, Math.trunc(caret)), value.length);
+  const rawPrefix = value.slice(0, end);
+  const prefix = rawPrefix.replaceAll("\u200B", "");
+  const match = /(?:^|\s)@([^\s@]*)$/.exec(prefix);
+  if (!match) return null;
+  const start = rawPrefix.lastIndexOf("@");
+  if (start < 0) return null;
+  return {
+    start,
+    end,
+    query: match[1].toLocaleLowerCase(),
+  };
+}
+
+export function insertSkillMention(
+  value: string,
+  start: number,
+  end: number,
+  skill: Pick<AiChatSkill, "id" | "label">,
+): { value: string; caret: number; skillId: string } {
+  const mention = `@${skill.label}`;
+  return {
+    value: `${value.slice(0, start)}${mention}${value.slice(end)}`,
+    caret: start + mention.length,
+    skillId: skill.id,
+  };
+}
+
+const REASONING_EFFORTS = ["minimal", "low", "medium", "high", "xhigh", "max", "ultra"];
+
+export function reasoningEffortForModel(
+  model: AiChatModel,
+  currentEffort: string | null | undefined,
+): string {
+  const current = currentEffort ?? "";
+  const currentIndex = REASONING_EFFORTS.indexOf(current);
+  if (currentIndex < 0) return model.defaultReasoningEffort;
+  if (model.supportedReasoningEfforts.includes(current)) {
+    return current;
+  }
+  const nearestEffort = model.supportedReasoningEfforts
+    .map((effort) => ({ effort, index: REASONING_EFFORTS.indexOf(effort) }))
+    .filter(({ index }) => index >= 0)
+    .sort((left, right) => (
+      Math.abs(left.index - currentIndex) - Math.abs(right.index - currentIndex)
+      || left.index - right.index
+    ))[0];
+  return nearestEffort?.effort ?? model.defaultReasoningEffort;
+}
+
+export function buildTurnInput(
+  message: string,
+  skillIds: string[],
+  dangerFullAccessConfirmed: boolean,
+  attachments: AiChatAttachmentInput[] = [],
+) {
+  return {
+    message,
+    ...(skillIds.length > 0 ? { skillIds } : {}),
+    ...(attachments.length > 0 ? { attachments } : {}),
+    ...(dangerFullAccessConfirmed ? { dangerFullAccessConfirmed: true } : {}),
+  };
+}
+
+export function chatPrimaryAction(
+  status: AiChatThreadStatus,
+  message: string,
+  blocked = false,
+  hasAttachments = false,
+): "send" | "stop" | "disabled" {
+  if (blocked) return "disabled";
+  if (status === "running") return "stop";
+  return message.trim() || hasAttachments ? "send" : "disabled";
+}
+
+export function needsDangerConfirmation(
+  sandbox: AiChatSandbox,
+  confirmed: boolean,
+): boolean {
+  return sandbox === "danger-full-access" && !confirmed;
+}
+
+export function shouldRefreshAiSnapshot(type: string): boolean {
+  return type === "ai.event" || type === "ai.run";
+}
+
+const VISIBLE_EVENT_TYPES = new Set([
+  "agent_message",
+  "assistant",
+  "plan",
+  "todo",
+  "todo_list",
+  "command",
+  "command_execution",
+  "file",
+  "file_change",
+  "mcp",
+  "mcp_tool_call",
+  "skill",
+  "web",
+  "web_search",
+  "error",
+  "turn.failed",
+  "user_message",
+  "user",
+]);
+
+function isMessageEvent(event: Pick<AiChatEvent, "role" | "type">): boolean {
+  return event.role === "user"
+    || event.role === "assistant"
+    || event.type === "user"
+    || event.type === "user_message"
+    || event.type === "assistant"
+    || event.type === "agent_message";
+}
+
+export function filterVisibleAiEvents<
+  T extends Pick<AiChatEvent, "type" | "role" | "data">,
+>(events: T[]): T[] {
+  const visible = events.filter((event) => VISIBLE_EVENT_TYPES.has(event.type));
+  const latestActivityIndex = new Map<string, number>();
+  visible.forEach((event, index) => {
+    const itemId = event.data?.itemId;
+    if (!isMessageEvent(event) && typeof itemId === "string") {
+      latestActivityIndex.set(itemId, index);
+    }
+  });
+  return visible.filter((event, index) => {
+    const itemId = event.data?.itemId;
+    return isMessageEvent(event)
+      || typeof itemId !== "string"
+      || latestActivityIndex.get(itemId) === index;
+  });
+}
+
+export function aiChatEventStatus(
+  event: Pick<AiChatEvent, "role" | "type" | "data">,
+): "running" | "completed" | "failed" {
+  if (event.role === "error" || event.type === "error" || event.type === "turn.failed") {
+    return "failed";
+  }
+  const status = event.data?.status;
+  if (status === "running" || status === "started" || status === "in_progress") {
+    return "running";
+  }
+  if (status === "failed" || status === "error") return "failed";
+  return "completed";
+}
+
+export function patchAiChatSnapshot(
+  current: AiChatThreadSnapshot | null,
+  threadId: string,
+  thread: AiChatThread,
+): AiChatThreadSnapshot | null {
+  if (!current || current.thread.id !== threadId) return current;
+  return { ...current, thread };
+}
+
+export function createAiSnapshotRefreshQueue(
+  refresh: (threadId: string) => Promise<void>,
+) {
+  const states = new Map<string, {
+    queued: boolean;
+    promise: Promise<void>;
+  }>();
+  let active = true;
+
+  return {
+    request(threadId: string): Promise<void> {
+      const current = states.get(threadId);
+      if (current) {
+        current.queued = true;
+        return current.promise;
+      }
+
+      const state = {
+        queued: false,
+        promise: Promise.resolve(),
+      };
+      state.promise = (async () => {
+        do {
+          state.queued = false;
+          await refresh(threadId);
+        } while (active && state.queued);
+      })().finally(() => {
+        if (states.get(threadId) === state) states.delete(threadId);
+      });
+      states.set(threadId, state);
+      return state.promise;
+    },
+    clear() {
+      active = false;
+      states.clear();
+    },
+  };
+}
diff --git a/apps/codex-taskboard/web/src/api.ts b/apps/codex-taskboard/web/src/api.ts
new file mode 100644
index 000000000..e2b8fd1b5
--- /dev/null
+++ b/apps/codex-taskboard/web/src/api.ts
@@ -0,0 +1,512 @@
+import type {
+  ActorIdentity,
+  AiChatCatalog,
+  AiChatAttachmentInput,
+  AiChatRun,
+  AiChatSandbox,
+  AiChatThread,
+  AiChatThreadSnapshot,
+  Attachment,
+  Comment,
+  DevelopmentScan,
+  IssueRelationType,
+  Project,
+  Task,
+  TaskboardMetadata,
+  TaskDraft,
+  TaskStatus,
+  WorkflowCapabilities,
+  WorkflowWorkspaceRecord,
+} from "./types";
+
+const DEFAULT_USER_ACTOR: ActorIdentity = {
+  type: "user",
+  id: "local-user",
+  name: "本地用户",
+  avatarUrl: null,
+};
+
+let currentUserActor = DEFAULT_USER_ACTOR;
+
+export function setCurrentUserActor(actor?: ActorIdentity) {
+  currentUserActor = actor?.type === "user" ? actor : DEFAULT_USER_ACTOR;
+}
+
+interface ApiErrorBody {
+  error?: {
+    code?: string;
+    message?: string;
+    details?: unknown;
+  };
+}
+
+export class ApiError extends Error {
+  readonly status: number;
+  readonly code: string;
+  readonly details?: unknown;
+
+  constructor(status: number, body: ApiErrorBody) {
+    super(body.error?.message ?? `Request failed (${status})`);
+    this.name = "ApiError";
+    this.status = status;
+    this.code = body.error?.code ?? "REQUEST_FAILED";
+    this.details = body.error?.details;
+  }
+}
+
+async function request<T>(path: string, init?: RequestInit): Promise<T> {
+  const headers = new Headers(init?.headers);
+  if (init?.body && !headers.has("Content-Type")) headers.set("Content-Type", "application/json");
+  const method = (init?.method ?? "GET").toUpperCase();
+  if (method !== "GET" && method !== "HEAD") {
+    headers.set("X-Taskboard-User-Id", currentUserActor.id);
+    headers.set("X-Taskboard-User-Name", encodeURIComponent(currentUserActor.name));
+    if (currentUserActor.avatarUrl) {
+      headers.set("X-Taskboard-User-Avatar", currentUserActor.avatarUrl);
+    }
+  }
+
+  let response: Response;
+  try {
+    response = await fetch(path, { ...init, headers });
+  } catch (error) {
+    if (error instanceof Error && error.name === "AbortError") throw error;
+    throw new ApiError(0, {
+      error: {
+        code: "SERVICE_UNAVAILABLE",
+        message: "无法连接本地 Taskboard 服务，请重新通过 Taskboard 启动 Codex。",
+      },
+    });
+  }
+  if (response.status === 204) return undefined as T;
+  const body = (await response.json().catch(() => ({}))) as T & ApiErrorBody;
+
+  if (!response.ok) throw new ApiError(response.status, body);
+  return body;
+}
+
+export async function listProjects(signal?: AbortSignal): Promise<Project[]> {
+  const data = await request<{ projects: Project[] }>("/api/projects", { signal });
+  return data.projects;
+}
+
+export async function getTaskboardMetadata(signal?: AbortSignal): Promise<TaskboardMetadata> {
+  return request<TaskboardMetadata>("/api/meta", { signal });
+}
+
+export async function getCodexThreadTitle(threadId: string, signal?: AbortSignal): Promise<string | null> {
+  const data = await request<{ thread: { id: string; title: string | null } }>(
+    `/api/local/codex/threads/${encodeURIComponent(threadId)}`,
+    { signal },
+  );
+  return data.thread.title;
+}
+
+export async function syncCodexThreadTasks(input: {
+  projectId: string;
+  visibleThreadIds: string[];
+}): Promise<void> {
+  await request<void>("/api/local/codex/threads/sync", {
+    method: "POST",
+    body: JSON.stringify(input),
+  });
+}
+
+export async function getTaskboardRevision(
+  since: number,
+  signal?: AbortSignal,
+): Promise<{ changed: boolean; revision: number }> {
+  const query = new URLSearchParams({ since: String(since) });
+  return request<{ changed: boolean; revision: number }>(`/api/revisions?${query}`, { signal });
+}
+
+export async function getAiChatCatalog(
+  projectId: string,
+  signal?: AbortSignal,
+): Promise<AiChatCatalog> {
+  return request<AiChatCatalog>(
+    `/api/local/ai/catalog?projectId=${encodeURIComponent(projectId)}`,
+    { signal },
+  );
+}
+
+export async function listAiChatThreads(signal?: AbortSignal): Promise<AiChatThread[]> {
+  const data = await request<{ threads: AiChatThread[] }>("/api/local/ai/threads", { signal });
+  return data.threads;
+}
+
+export async function createAiChatThread(input: {
+  projectId: string;
+  issueId?: string;
+  title?: string;
+  codexThreadId?: string;
+  model?: string;
+  reasoningEffort?: string;
+  sandbox?: AiChatSandbox;
+}): Promise<AiChatThread> {
+  const data = await request<{ thread: AiChatThread }>("/api/local/ai/threads", {
+    method: "POST",
+    body: JSON.stringify(input),
+  });
+  return data.thread;
+}
+
+export async function getAiChatThread(
+  threadId: string,
+  signal?: AbortSignal,
+): Promise<AiChatThreadSnapshot> {
+  return request<AiChatThreadSnapshot>(
+    `/api/local/ai/threads/${encodeURIComponent(threadId)}`,
+    { signal },
+  );
+}
+
+export async function updateAiChatThread(
+  threadId: string,
+  input: {
+    title?: string;
+    model?: string;
+    reasoningEffort?: string;
+    sandbox?: AiChatSandbox;
+  },
+): Promise<AiChatThread> {
+  const data = await request<{ thread: AiChatThread }>(
+    `/api/local/ai/threads/${encodeURIComponent(threadId)}`,
+    {
+      method: "PATCH",
+      body: JSON.stringify(input),
+    },
+  );
+  return data.thread;
+}
+
+export async function deleteAiChatThread(threadId: string): Promise<void> {
+  await request<void>(
+    `/api/local/ai/threads/${encodeURIComponent(threadId)}`,
+    { method: "DELETE" },
+  );
+}
+
+export async function startAiChatTurn(
+  threadId: string,
+  input: {
+    message: string;
+    skillIds?: string[];
+    attachments?: AiChatAttachmentInput[];
+    dangerFullAccessConfirmed?: boolean;
+  },
+): Promise<AiChatRun> {
+  const data = await request<{ run: AiChatRun }>(
+    `/api/local/ai/threads/${encodeURIComponent(threadId)}/turns`,
+    {
+      method: "POST",
+      body: JSON.stringify(input),
+    },
+  );
+  return data.run;
+}
+
+export async function interruptAiChatRun(runId: string): Promise<AiChatRun> {
+  const data = await request<{ run: AiChatRun }>(
+    `/api/local/ai/runs/${encodeURIComponent(runId)}/interrupt`,
+    { method: "POST" },
+  );
+  return data.run;
+}
+
+export function subscribeAiChatThread(
+  threadId: string,
+  onHint: (type: "ai.event" | "ai.run") => void,
+  onError?: () => void,
+): () => void {
+  const source = new EventSource(`/api/local/ai/threads/${encodeURIComponent(threadId)}/events`);
+  source.addEventListener("ai.event", () => onHint("ai.event"));
+  source.addEventListener("ai.run", () => onHint("ai.run"));
+  if (onError) source.addEventListener("error", onError);
+  return () => source.close();
+}
+
+export async function listDeviceWorkspaces(signal?: AbortSignal): Promise<Record<string, string>> {
+  try {
+    const data = await request<{ workspaces: Record<string, string> }>("/api/device-workspaces", { signal });
+    return data.workspaces;
+  } catch (error) {
+    if (error instanceof ApiError && error.code === "LOCAL_COMPANION_REQUIRED") return {};
+    throw error;
+  }
+}
+
+export async function listWorkflowCapabilities(
+  workspacePath?: string,
+  signal?: AbortSignal,
+): Promise<WorkflowCapabilities> {
+  const query = new URLSearchParams();
+  if (workspacePath) query.set("workspacePath", workspacePath);
+  const suffix = query.size > 0 ? `?${query}` : "";
+  return request<WorkflowCapabilities>(`/api/workflow-capabilities${suffix}`, { signal });
+}
+
+export async function getWorkflowWorkspace<T>(
+  projectId: string,
+  signal?: AbortSignal,
+): Promise<WorkflowWorkspaceRecord<T>> {
+  const data = await request<{ workflow: WorkflowWorkspaceRecord<T> }>(
+    `/api/projects/${encodeURIComponent(projectId)}/workflow-workspace`,
+    { signal },
+  );
+  return data.workflow;
+}
+
+export async function saveWorkflowWorkspace<T>(
+  projectId: string,
+  workspace: T,
+  version: number,
+): Promise<WorkflowWorkspaceRecord<T>> {
+  const data = await request<{ workflow: WorkflowWorkspaceRecord<T> }>(
+    `/api/projects/${encodeURIComponent(projectId)}/workflow-workspace`,
+    {
+      method: "PUT",
+      body: JSON.stringify({ version, workspace }),
+    },
+  );
+  return data.workflow;
+}
+
+export async function createProject(input: {
+  id: string;
+  name: string;
+  workspacePath: string | null;
+}): Promise<Project> {
+  const data = await request<{ project: Project }>("/api/projects", {
+    method: "POST",
+    body: JSON.stringify(input),
+  });
+  return data.project;
+}
+
+export async function archiveProject(projectId: string): Promise<Project> {
+  const data = await request<{ project: Project }>(
+    `/api/projects/${encodeURIComponent(projectId)}/archive`,
+    { method: "POST" },
+  );
+  return data.project;
+}
+
+export async function deleteProject(projectId: string): Promise<void> {
+  await request<void>(
+    `/api/projects/${encodeURIComponent(projectId)}`,
+    { method: "DELETE" },
+  );
+}
+
+export async function listDevelopmentContexts(
+  projectId: string,
+  codexProjectId?: string,
+  codexThreadId?: string,
+  signal?: AbortSignal,
+  workspacePath?: string,
+): Promise<DevelopmentScan> {
+  const query = new URLSearchParams();
+  if (codexProjectId) query.set("codexProjectId", codexProjectId);
+  if (codexThreadId) query.set("codexThreadId", codexThreadId);
+  if (workspacePath) query.set("workspacePath", workspacePath);
+  const suffix = query.size > 0 ? `?${query}` : "";
+  return request<DevelopmentScan>(
+    `/api/projects/${encodeURIComponent(projectId)}/development-contexts${suffix}`,
+    { signal },
+  );
+}
+
+export async function listTasks(
+  projectId: string,
+  options: { signal?: AbortSignal; archived?: "false" | "true" | "all" } = {},
+): Promise<Task[]> {
+  const params = new URLSearchParams({ projectId, archived: options.archived ?? "false" });
+  const data = await request<{ tasks: Task[] }>(`/api/tasks?${params}`, { signal: options.signal });
+  return data.tasks;
+}
+
+export async function createTask(projectId: string, draft: TaskDraft, threadId?: string): Promise<Task> {
+  const data = await request<{ task: Task }>("/api/tasks", {
+    method: "POST",
+    body: JSON.stringify({ projectId, ...draft, ...(threadId ? { threadId } : {}) }),
+  });
+  return data.task;
+}
+
+export async function updateTask(task: Task, draft: TaskDraft, threadId?: string): Promise<Task> {
+  const data = await request<{ task: Task }>(`/api/tasks/${encodeURIComponent(task.id)}`, {
+    method: "PATCH",
+    body: JSON.stringify({ version: task.version, ...draft, ...(threadId ? { threadId } : {}) }),
+  });
+  return data.task;
+}
+
+export async function moveTask(
+  task: Task,
+  status: TaskStatus,
+  sortOrder?: number,
+  options: { threadId?: string; projectId?: string } = {},
+): Promise<Task> {
+  const data = await request<{ task: Task }>(
+    `/api/tasks/${encodeURIComponent(task.id)}/move`,
+    {
+      method: "POST",
+      body: JSON.stringify({
+        version: task.version,
+        status,
+        ...(sortOrder === undefined ? {} : { sortOrder }),
+        ...(options.threadId ? { threadId: options.threadId } : {}),
+        ...(options.projectId ? { projectId: options.projectId } : {}),
+      }),
+    },
+  );
+  return data.task;
+}
+
+export async function archiveTask(task: Task, threadId?: string): Promise<Task> {
+  const data = await request<{ task: Task }>(
+    `/api/tasks/${encodeURIComponent(task.id)}/archive`,
+    {
+      method: "POST",
+      body: JSON.stringify({ version: task.version, ...(threadId ? { threadId } : {}) }),
+    },
+  );
+  return data.task;
+}
+
+export async function deleteTask(task: Task, threadId?: string): Promise<void> {
+  await request<void>(
+    `/api/tasks/${encodeURIComponent(task.id)}`,
+    {
+      method: "DELETE",
+      body: JSON.stringify({ version: task.version, ...(threadId ? { threadId } : {}) }),
+    },
+  );
+}
+
+export async function restoreTask(task: Task, threadId?: string): Promise<Task> {
+  const data = await request<{ task: Task }>(
+    `/api/tasks/${encodeURIComponent(task.id)}/restore`,
+    {
+      method: "POST",
+      body: JSON.stringify({ version: task.version, ...(threadId ? { threadId } : {}) }),
+    },
+  );
+  return data.task;
+}
+
+export async function addTaskRelation(
+  task: Task,
+  type: IssueRelationType,
+  relatedTaskId: string,
+  threadId?: string,
+): Promise<{ task: Task; relatedTask: Task }> {
+  return request<{ task: Task; relatedTask: Task }>(
+    `/api/tasks/${encodeURIComponent(task.id)}/relations/${type}/${encodeURIComponent(relatedTaskId)}`,
+    {
+      method: "POST",
+      body: JSON.stringify({ version: task.version, ...(threadId ? { threadId } : {}) }),
+    },
+  );
+}
+
+export async function removeTaskRelation(
+  task: Task,
+  type: IssueRelationType,
+  relatedTaskId: string,
+  threadId?: string,
+): Promise<{ task: Task; relatedTask: Task }> {
+  return request<{ task: Task; relatedTask: Task }>(
+    `/api/tasks/${encodeURIComponent(task.id)}/relations/${type}/${encodeURIComponent(relatedTaskId)}`,
+    {
+      method: "DELETE",
+      body: JSON.stringify({ version: task.version, ...(threadId ? { threadId } : {}) }),
+    },
+  );
+}
+
+export async function listComments(taskId: string, signal?: AbortSignal): Promise<Comment[]> {
+  const data = await request<{ comments: Comment[] }>(
+    `/api/tasks/${encodeURIComponent(taskId)}/comments`,
+    { signal },
+  );
+  return data.comments;
+}
+
+export async function createComment(taskId: string, body: string, threadId?: string): Promise<Comment> {
+  const data = await request<{ comment: Comment }>(
+    `/api/tasks/${encodeURIComponent(taskId)}/comments`,
+    {
+      method: "POST",
+      body: JSON.stringify({ body, ...(threadId ? { threadId } : {}) }),
+    },
+  );
+  return data.comment;
+}
+
+export async function updateComment(comment: Comment, body: string, threadId?: string): Promise<Comment> {
+  const data = await request<{ comment: Comment }>(
+    `/api/comments/${encodeURIComponent(comment.id)}`,
+    {
+      method: "PATCH",
+      body: JSON.stringify({ version: comment.version, body, ...(threadId ? { threadId } : {}) }),
+    },
+  );
+  return data.comment;
+}
+
+export async function deleteComment(comment: Comment, threadId?: string): Promise<void> {
+  await request(`/api/comments/${encodeURIComponent(comment.id)}`, {
+    method: "DELETE",
+    body: JSON.stringify({ version: comment.version, ...(threadId ? { threadId } : {}) }),
+  });
+}
+
+export async function listAttachments(taskId: string, signal?: AbortSignal): Promise<Attachment[]> {
+  const data = await request<{ attachments: Attachment[] }>(
+    `/api/tasks/${encodeURIComponent(taskId)}/attachments`,
+    { signal },
+  );
+  return data.attachments;
+}
+
+export async function uploadAttachment(taskId: string, file: File): Promise<Attachment> {
+  const data = await request<{ attachment: Attachment }>(
+    `/api/tasks/${encodeURIComponent(taskId)}/attachments`,
+    {
+      method: "POST",
+      headers: {
+        "Content-Type": file.type || "application/octet-stream",
+        "X-Taskboard-Filename": encodeURIComponent(file.name),
+      },
+      body: file,
+    },
+  );
+  return data.attachment;
+}
+
+export async function uploadCommentAttachment(commentId: string, file: File): Promise<Attachment> {
+  const data = await request<{ attachment: Attachment }>(
+    `/api/comments/${encodeURIComponent(commentId)}/attachments`,
+    {
+      method: "POST",
+      headers: {
+        "Content-Type": file.type || "application/octet-stream",
+        "X-Taskboard-Filename": encodeURIComponent(file.name),
+      },
+      body: file,
+    },
+  );
+  return data.attachment;
+}
+
+export async function deleteAttachment(attachment: Attachment): Promise<void> {
+  await request(`/api/attachments/${encodeURIComponent(attachment.id)}`, {
+    method: "DELETE",
+  });
+}
+
+export function attachmentContentUrl(attachment: Attachment): string {
+  return `/api/attachments/${encodeURIComponent(attachment.id)}/content`;
+}
diff --git a/apps/codex-taskboard/web/src/assets/x-logo-black.png b/apps/codex-taskboard/web/src/assets/x-logo-black.png
new file mode 100644
index 000000000..2c2d7e863
Binary files /dev/null and b/apps/codex-taskboard/web/src/assets/x-logo-black.png differ
diff --git a/apps/codex-taskboard/web/src/components/ActorAvatar.tsx b/apps/codex-taskboard/web/src/components/ActorAvatar.tsx
new file mode 100644
index 000000000..5329481a2
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/ActorAvatar.tsx
@@ -0,0 +1,32 @@
+import type { ActorIdentity } from "../types";
+
+export function ActorAvatar({
+  actor,
+  className = "",
+}: {
+  actor: ActorIdentity;
+  className?: string;
+}) {
+  return (
+    <span
+      className={`actor-avatar actor-avatar-${actor.type}${className ? ` ${className}` : ""}`}
+      aria-hidden="true"
+      title={actor.name}
+    >
+      {actor.type === "agent" ? (
+        <img
+          className="actor-avatar-image actor-avatar-agent-image"
+          src="/codex-agent-logo.png"
+          alt=""
+        />
+      ) : actor.avatarUrl ? (
+        <img
+          className="actor-avatar-image"
+          src={actor.avatarUrl}
+          alt=""
+          referrerPolicy="no-referrer"
+        />
+      ) : actor.name.slice(0, 1)}
+    </span>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/AiChat.tsx b/apps/codex-taskboard/web/src/components/AiChat.tsx
new file mode 100644
index 000000000..d4a257877
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/AiChat.tsx
@@ -0,0 +1,2648 @@
+import {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+  type ClipboardEvent as ReactClipboardEvent,
+  type ChangeEvent,
+  type DragEvent as ReactDragEvent,
+  type KeyboardEvent as ReactKeyboardEvent,
+  type PointerEvent as ReactPointerEvent,
+  type ReactNode,
+} from "react";
+import { createPortal } from "react-dom";
+import ReactMarkdown from "react-markdown";
+import remarkGfm from "remark-gfm";
+import {
+  createAiChatThread,
+  deleteAiChatThread,
+  getAiChatCatalog,
+  getAiChatThread,
+  interruptAiChatRun,
+  listAiChatThreads,
+  startAiChatTurn,
+  subscribeAiChatThread,
+  updateAiChatThread,
+} from "../api";
+import {
+  AI_CHAT_SKILL_MARKER,
+  aiChatEventStatus,
+  buildThreadCreateInput,
+  buildTurnInput,
+  chatPrimaryAction,
+  createAiSnapshotRefreshQueue,
+  filterVisibleAiEvents,
+  needsDangerConfirmation,
+  normalizeChatSelection,
+  parseAiChatComposerFragment,
+  patchAiChatSnapshot,
+  reasoningEffortForModel,
+} from "../aiChatState";
+import type {
+  AiChatCatalog,
+  AiChatEvent,
+  AiChatAttachmentInput,
+  AiChatModel,
+  AiChatRun,
+  AiChatSandbox,
+  AiChatSkill,
+  AiChatThread,
+  AiChatThreadSnapshot,
+} from "../types";
+import { LinearIcon, type LinearIconName } from "./LinearIcon";
+
+interface AiChatProps {
+  available: boolean;
+  projectId: string | null;
+  issueId: string | null;
+  resumeRequest?: AiChatResumeRequest | null;
+}
+
+type MenuName = "model" | "model-list" | "effort-list" | "sandbox" | null;
+type PendingDangerInput = {
+  message: string;
+  skillIds: string[];
+  attachments: AiChatAttachmentInput[];
+  clearSubmittedDraft: boolean;
+};
+type ComposerAttachment = AiChatAttachmentInput & {
+  id: string;
+  previewUrl?: string;
+};
+type ComposerSkillToken = {
+  key: string;
+  id: string;
+  element: HTMLSpanElement;
+};
+type ComposerSkillQuery = {
+  query: string;
+};
+type ComposerBeforeInput = {
+  container: Node;
+  offset: number;
+  text: string;
+};
+type DraftThreadOrigin = {
+  projectId: string;
+  issueId: string | null;
+};
+type AiChatResumeRequest = {
+  id: number;
+  projectId: string;
+  issueId: string | null;
+  codexThreadId: string;
+  title?: string;
+};
+type PanelResizeEdge = "top" | "left" | "top-left";
+type PanelGeometry = {
+  width: number;
+  height: number;
+};
+type PanelResizeSession = {
+  edge: PanelResizeEdge;
+  pointerId: number;
+  startX: number;
+  startY: number;
+  startWidth: number;
+  startHeight: number;
+  geometry: PanelGeometry;
+  captureTarget: HTMLElement;
+};
+
+const LAST_THREAD_KEY = "taskboard.aiChat.lastThreadId";
+const PANEL_GEOMETRY_KEY = "taskboard.aiChat.panelGeometry";
+const PANEL_EDGE_GAP = 8;
+const PANEL_MIN_WIDTH = 420;
+const PANEL_MAX_WIDTH = 960;
+const PANEL_MIN_HEIGHT = 360;
+const PANEL_DEFAULT_GEOMETRY: PanelGeometry = {
+  width: 420,
+  height: 700,
+};
+const SKILL_MARKER = AI_CHAT_SKILL_MARKER;
+const SKILL_LINK_PREFIX = "#ai-chat-skill-";
+const COMPOSER_FRAGMENT_MIME = "application/x-codex-taskboard-composer-fragment";
+const COMPOSER_HTML_BLOCKS = new Set([
+  "ADDRESS",
+  "ARTICLE",
+  "BLOCKQUOTE",
+  "DIV",
+  "H1",
+  "H2",
+  "H3",
+  "H4",
+  "H5",
+  "H6",
+  "LI",
+  "P",
+  "PRE",
+  "SECTION",
+]);
+const COMPOSER_HTML_IGNORED = new Set(["SCRIPT", "STYLE", "SVG"]);
+const SANDBOX_LABELS: Record<AiChatSandbox, string> = {
+  "read-only": "请求批准",
+  "workspace-write": "替我审批",
+  "danger-full-access": "完全访问权限",
+};
+
+function clampPanelGeometry(geometry: PanelGeometry): PanelGeometry {
+  const maxWidth = Math.min(
+    PANEL_MAX_WIDTH,
+    window.innerWidth - PANEL_EDGE_GAP * 2,
+  );
+  const minWidth = Math.min(PANEL_MIN_WIDTH, maxWidth);
+  const maxHeight = window.innerHeight - PANEL_EDGE_GAP * 2;
+  const minHeight = Math.min(PANEL_MIN_HEIGHT, maxHeight);
+  return {
+    width: Math.min(maxWidth, Math.max(minWidth, geometry.width)),
+    height: Math.min(maxHeight, Math.max(minHeight, geometry.height)),
+  };
+}
+
+function loadPanelGeometry(): PanelGeometry {
+  const stored = window.localStorage.getItem(PANEL_GEOMETRY_KEY);
+  if (!stored) return clampPanelGeometry(PANEL_DEFAULT_GEOMETRY);
+  try {
+    const geometry = JSON.parse(stored) as PanelGeometry;
+    if (
+      !Number.isFinite(geometry.width)
+      || !Number.isFinite(geometry.height)
+    ) {
+      return clampPanelGeometry(PANEL_DEFAULT_GEOMETRY);
+    }
+    return clampPanelGeometry(geometry);
+  } catch {
+    return clampPanelGeometry(PANEL_DEFAULT_GEOMETRY);
+  }
+}
+
+const SANDBOX_DESCRIPTIONS: Record<AiChatSandbox, string> = {
+  "read-only": "编辑外部文件和使用互联网时始终询问",
+  "workspace-write": "仅对检测到的风险操作请求批准",
+  "danger-full-access": "不受限制地访问互联网和您电脑上的任何文件",
+};
+
+const SANDBOX_ICONS: Record<AiChatSandbox, "hand" | "terminal" | "shieldAlert"> = {
+  "read-only": "hand",
+  "workspace-write": "terminal",
+  "danger-full-access": "shieldAlert",
+};
+
+const EFFORT_LABELS: Record<string, string> = {
+  low: "低",
+  medium: "中",
+  high: "高",
+  xhigh: "极高",
+  max: "最高",
+  ultra: "极高",
+};
+
+function modelDisplayName(value: string): string {
+  return value.replace(/^GPT-/i, "").replaceAll("-", " ");
+}
+
+const SKILL_ACRONYMS = new Map([
+  ["ai", "AI"],
+  ["api", "API"],
+  ["cli", "CLI"],
+  ["mcp", "MCP"],
+  ["sdk", "SDK"],
+  ["ui", "UI"],
+]);
+
+function skillDisplayName(skill: Pick<AiChatSkill, "id" | "label">): string {
+  const rawLabel = skill.label === skill.id && skill.id.includes(":")
+    ? skill.id.slice(skill.id.lastIndexOf(":") + 1)
+    : skill.label;
+  return rawLabel
+    .split(/[-_\s]+/)
+    .filter(Boolean)
+    .map((word) => (
+      SKILL_ACRONYMS.get(word.toLocaleLowerCase())
+      ?? (/^[A-Z][A-Za-z0-9]*$/.test(word)
+        ? word
+        : `${word.charAt(0).toLocaleUpperCase()}${word.slice(1)}`)
+    ))
+    .join(" ");
+}
+
+function eventSkillIds(event: AiChatEvent): string[] {
+  const values = event.data?.skillIds;
+  if (!Array.isArray(values)) return [];
+  return values.filter((value): value is string => typeof value === "string");
+}
+
+function eventHasAttachments(event: AiChatEvent): boolean {
+  return Array.isArray(event.data?.attachments) && event.data.attachments.length > 0;
+}
+
+function serializeComposer(root: HTMLElement): { message: string; skillIds: string[] } {
+  let message = "";
+  const skillIds: string[] = [];
+  const appendText = (value: string) => {
+    message += value.replaceAll("\u200B", "");
+  };
+  const visit = (node: Node) => {
+    if (node.nodeType === Node.TEXT_NODE) {
+      appendText(node.textContent ?? "");
+      return;
+    }
+    if (!(node instanceof HTMLElement)) return;
+    const skillId = node.dataset.skillId;
+    if (skillId) {
+      message += SKILL_MARKER;
+      skillIds.push(skillId);
+      return;
+    }
+    if (node.tagName === "BR") {
+      message += "\n";
+      return;
+    }
+    const isBlock = node.tagName === "DIV" || node.tagName === "P";
+    if (isBlock && message && !message.endsWith("\n")) message += "\n";
+    for (const child of node.childNodes) visit(child);
+    if (isBlock && node.nextSibling && !message.endsWith("\n")) message += "\n";
+  };
+  for (const child of root.childNodes) visit(child);
+  return { message, skillIds };
+}
+
+function selectedComposerFragment(root: HTMLElement): {
+  message: string;
+  skillIds: string[];
+  range: Range;
+} | null {
+  const selection = root.ownerDocument.getSelection();
+  const selectionRange = selection?.rangeCount ? selection.getRangeAt(0) : null;
+  if (
+    !selection
+    || selection.isCollapsed
+    || !selectionRange
+    || !root.contains(selectionRange.commonAncestorContainer)
+  ) {
+    return null;
+  }
+  const skillReferenceAt = (node: Node): HTMLElement | null => {
+    const element = node instanceof HTMLElement ? node : node.parentElement;
+    const composerToken = element?.closest<HTMLElement>(".ai-chat-composer-skill-token") ?? null;
+    if (composerToken && root.contains(composerToken)) return composerToken;
+    const reference = element?.closest<HTMLElement>("[data-skill-id]") ?? null;
+    return reference && root.contains(reference) ? reference : null;
+  };
+  const copyRange = selectionRange.cloneRange();
+  const startSkill = skillReferenceAt(copyRange.startContainer);
+  const endSkill = skillReferenceAt(copyRange.endContainer);
+  if (startSkill) copyRange.setStartBefore(startSkill);
+  if (endSkill) copyRange.setEndAfter(endSkill);
+  const wrapper = root.ownerDocument.createElement("div");
+  wrapper.append(copyRange.cloneContents());
+  const fragment = serializeComposer(wrapper);
+  return fragment.message ? { ...fragment, range: copyRange } : null;
+}
+
+function composerMarkerCount(message: string): number {
+  return message.split(SKILL_MARKER).length - 1;
+}
+
+function canonicalComposerFragment(
+  fragment: { message: string; skillIds: string[] },
+  skillsById: Map<string, AiChatSkill>,
+): string {
+  let index = 0;
+  return fragment.message.replaceAll(SKILL_MARKER, () => {
+    const skillId = fragment.skillIds[index] ?? "";
+    index += 1;
+    const skill = skillsById.get(skillId);
+    return skill ? `[$${skill.id}](${skill.path})` : SKILL_MARKER;
+  });
+}
+
+function composerFragmentHtml(
+  fragment: { message: string; skillIds: string[] },
+  skillsById: Map<string, AiChatSkill>,
+  document: Document,
+): string {
+  const wrapper = document.createElement("div");
+  const parts = fragment.message.split(SKILL_MARKER);
+  parts.forEach((part, index) => {
+    if (index > 0) {
+      const skill = skillsById.get(fragment.skillIds[index - 1] ?? "");
+      if (skill) {
+        const link = document.createElement("a");
+        link.setAttribute("href", skill.path);
+        link.textContent = skillDisplayName(skill);
+        wrapper.append(link);
+      } else {
+        wrapper.append(SKILL_MARKER);
+      }
+    }
+    const lines = part.split("\n");
+    lines.forEach((line, lineIndex) => {
+      if (lineIndex > 0) wrapper.append(document.createElement("br"));
+      wrapper.append(line);
+    });
+  });
+  return wrapper.innerHTML;
+}
+
+function writeSkillFragmentToClipboard(
+  event: ReactClipboardEvent<HTMLElement>,
+  fragment: { message: string; skillIds: string[] },
+  skillsById: Map<string, AiChatSkill>,
+): boolean {
+  if (
+    fragment.skillIds.length === 0
+    || !fragment.skillIds.every((skillId) => skillsById.has(skillId))
+  ) {
+    return false;
+  }
+  event.preventDefault();
+  event.clipboardData.setData(COMPOSER_FRAGMENT_MIME, JSON.stringify({
+    message: fragment.message,
+    skillIds: fragment.skillIds,
+  }));
+  event.clipboardData.setData("text/plain", canonicalComposerFragment(fragment, skillsById));
+  event.clipboardData.setData(
+    "text/html",
+    composerFragmentHtml(fragment, skillsById, event.currentTarget.ownerDocument),
+  );
+  return true;
+}
+
+function decodedSkillPath(href: string): string | null {
+  const raw = href.trim();
+  if (!raw) return null;
+  try {
+    if (raw.startsWith("file:")) return decodeURIComponent(new URL(raw).pathname);
+    if (!raw.startsWith("/")) return null;
+    return decodeURIComponent(raw.split(/[?#]/, 1)[0]);
+  } catch {
+    return null;
+  }
+}
+
+function composerFragmentFromHtml(
+  html: string,
+  skills: AiChatSkill[],
+): { message: string; skillIds: string[] } | null {
+  if (!html || skills.length === 0) return null;
+  const document = new DOMParser().parseFromString(html, "text/html");
+  const skillsByPath = new Map(skills.map((skill) => [skill.path, skill]));
+  const skillIds: string[] = [];
+  let message = "";
+  let matchedSkill = false;
+  const appendText = (value: string) => {
+    message += value.replaceAll(SKILL_MARKER, "\uFFFD");
+  };
+  const visit = (node: Node) => {
+    if (node.nodeType === Node.TEXT_NODE) {
+      appendText(node.textContent ?? "");
+      return;
+    }
+    if (node.nodeType !== Node.ELEMENT_NODE) return;
+    const element = node as HTMLElement;
+    if (COMPOSER_HTML_IGNORED.has(element.tagName)) return;
+    if (element.tagName === "A") {
+      const path = decodedSkillPath(element.getAttribute("href") ?? "");
+      const skill = path?.endsWith("/SKILL.md") ? skillsByPath.get(path) : null;
+      if (skill) {
+        message += SKILL_MARKER;
+        skillIds.push(skill.id);
+        matchedSkill = true;
+        return;
+      }
+    }
+    if (element.tagName === "BR") {
+      message += "\n";
+      return;
+    }
+    const isBlock = COMPOSER_HTML_BLOCKS.has(element.tagName);
+    if (isBlock && message && !message.endsWith("\n")) message += "\n";
+    for (const child of element.childNodes) visit(child);
+    if (isBlock && element.nextSibling && !message.endsWith("\n")) message += "\n";
+  };
+  for (const child of document.body.childNodes) visit(child);
+  return matchedSkill ? { message, skillIds } : null;
+}
+
+function composerFragmentFromPlainText(
+  text: string,
+  skills: AiChatSkill[],
+): { message: string; skillIds: string[] } | null {
+  if (!text || skills.length === 0) return null;
+  const skillsByPath = new Map(skills.map((skill) => [skill.path, skill]));
+  const skillIds: string[] = [];
+  let message = "";
+  let cursor = 0;
+  const referencePattern = /\[\$([^\]\r\n]+)\]\((\/[^)\r\n]*\/SKILL\.md)\)/g;
+  for (const match of text.matchAll(referencePattern)) {
+    const path = decodedSkillPath(match[2]);
+    const skill = path ? skillsByPath.get(path) : null;
+    if (!skill || skill.id !== match[1]) continue;
+    message += text.slice(cursor, match.index).replaceAll(SKILL_MARKER, "\uFFFD");
+    message += SKILL_MARKER;
+    skillIds.push(skill.id);
+    cursor = (match.index ?? 0) + match[0].length;
+  }
+  if (skillIds.length === 0) return null;
+  message += text.slice(cursor).replaceAll(SKILL_MARKER, "\uFFFD");
+  return { message, skillIds };
+}
+
+function composerSkillQueryAt(
+  root: HTMLElement,
+  focusNode: Text,
+  focusOffset: number,
+): { query: string; range: Range } | null {
+  if (!root.contains(focusNode)) return null;
+  const rawPrefix = (focusNode.textContent ?? "").slice(0, focusOffset);
+  const prefix = rawPrefix.replaceAll("\u200B", "");
+  const match = /(?:^|\s)@([^\s@]*)$/.exec(prefix);
+  if (!match) return null;
+  const at = rawPrefix.lastIndexOf("@");
+  const range = root.ownerDocument.createRange();
+  range.setStart(focusNode, at);
+  range.setEnd(focusNode, focusOffset);
+  return { query: match[1].toLocaleLowerCase(), range };
+}
+
+function composerSkillQuery(root: HTMLElement): { query: string; range: Range } | null {
+  const selection = root.ownerDocument.getSelection();
+  if (!selection || !selection.isCollapsed || selection.focusNode?.nodeType !== Node.TEXT_NODE) {
+    return null;
+  }
+  return composerSkillQueryAt(root, selection.focusNode as Text, selection.focusOffset);
+}
+
+function composerSkillQueryAfterInput(
+  root: HTMLElement,
+  beforeInput: ComposerBeforeInput,
+): { query: string; range: Range } | null {
+  if (beforeInput.container.nodeType === Node.TEXT_NODE) {
+    const textNode = beforeInput.container as Text;
+    return composerSkillQueryAt(
+      root,
+      textNode,
+      Math.min(beforeInput.offset + beforeInput.text.length, textNode.length),
+    );
+  }
+  if (!(beforeInput.container instanceof HTMLElement) || !root.contains(beforeInput.container)) {
+    return null;
+  }
+  const insertedNode = beforeInput.container.childNodes[beforeInput.offset];
+  if (insertedNode?.nodeType !== Node.TEXT_NODE) return null;
+  return composerSkillQueryAt(
+    root,
+    insertedNode as Text,
+    Math.min(beforeInput.text.length, insertedNode.textContent?.length ?? 0),
+  );
+}
+
+function tokenBeforeComposerCaret(root: HTMLElement): HTMLElement | null {
+  const selection = root.ownerDocument.getSelection();
+  if (!selection || !selection.isCollapsed || !selection.focusNode) return null;
+  const focusNode = selection.focusNode;
+  let candidate: ChildNode | null = null;
+  if (focusNode.nodeType === Node.TEXT_NODE) {
+    const prefix = (focusNode.textContent ?? "").slice(0, selection.focusOffset);
+    if (prefix.replaceAll("\u200B", "").length > 0) return null;
+    candidate = focusNode.previousSibling;
+  } else if (focusNode instanceof HTMLElement) {
+    candidate = focusNode.childNodes[selection.focusOffset - 1] ?? null;
+  }
+  while (
+    candidate?.nodeType === Node.TEXT_NODE
+    && !(candidate.textContent ?? "").replaceAll("\u200B", "")
+  ) {
+    candidate = candidate.previousSibling;
+  }
+  return candidate instanceof HTMLElement && candidate.dataset.skillId ? candidate : null;
+}
+
+function skillMarkdown(
+  content: string,
+  skillIds: string[],
+  skillsById: Map<string, AiChatSkill>,
+): string {
+  let index = 0;
+  return content.replaceAll(SKILL_MARKER, () => {
+    const skillId = skillIds[index] ?? "";
+    index += 1;
+    const skill = skillsById.get(skillId);
+    const label = skill
+      ? skillDisplayName(skill)
+      : skillDisplayName({ id: skillId, label: skillId });
+    return `[${label.replaceAll("[", "\\[").replaceAll("]", "\\]")}](${SKILL_LINK_PREFIX}${encodeURIComponent(skillId)})`;
+  });
+}
+
+function SkillReference({
+  skill,
+  skillId,
+}: {
+  skill?: AiChatSkill;
+  skillId: string;
+}) {
+  return (
+    <span
+      className="ai-chat-skill-reference"
+      data-skill-id={skillId || undefined}
+    >
+      <LinearIcon name="project" />
+      <span>{skill ? skillDisplayName(skill) : skillDisplayName({ id: skillId, label: skillId })}</span>
+    </span>
+  );
+}
+
+const ACTIVITY_LABELS: Record<string, string> = {
+  plan: "执行计划",
+  todo: "任务进度",
+  todo_list: "任务进度",
+  command: "运行命令",
+  command_execution: "运行命令",
+  file: "文件修改",
+  file_change: "文件修改",
+  mcp: "调用 MCP",
+  mcp_tool_call: "调用 MCP",
+  skill: "调用 Skill",
+  web: "搜索资料",
+  web_search: "搜索资料",
+  error: "执行失败",
+  "turn.failed": "执行失败",
+};
+
+const ACTIVITY_ICONS: Record<string, LinearIconName> = {
+  plan: "write",
+  todo: "status",
+  todo_list: "status",
+  command: "terminal",
+  command_execution: "terminal",
+  file: "file",
+  file_change: "file",
+  mcp: "link",
+  mcp_tool_call: "link",
+  skill: "project",
+  web: "search",
+  web_search: "search",
+  error: "alert",
+  "turn.failed": "alert",
+};
+
+function messageFor(error: unknown): string {
+  return error instanceof Error ? error.message : "AI 对话暂时不可用";
+}
+
+function isAiChatSandbox(value: string): value is AiChatSandbox {
+  return value === "read-only"
+    || value === "workspace-write"
+    || value === "danger-full-access";
+}
+
+function dateLabel(value: string): string {
+  const date = new Date(value);
+  if (Number.isNaN(date.getTime())) return "";
+  return new Intl.DateTimeFormat("zh-CN", {
+    month: "short",
+    day: "numeric",
+    hour: "2-digit",
+    minute: "2-digit",
+  }).format(date);
+}
+
+type ThinkingActivityDetail =
+  | { kind: "lines"; summary: string; value: string[] }
+  | { kind: "pre"; summary: string; value: string };
+
+function parsedTodoLines(value: unknown): string[] {
+  if (typeof value !== "string") return [];
+  try {
+    const items = JSON.parse(value);
+    if (!Array.isArray(items)) return [];
+    return items.flatMap((item) => {
+      if (typeof item !== "object" || item === null) return [];
+      const text = (item as Record<string, unknown>).text;
+      return typeof text === "string" && text.trim() ? [text] : [];
+    });
+  } catch {
+    return [];
+  }
+}
+
+function activityDetail(event: AiChatEvent): ThinkingActivityDetail | null {
+  const files = event.data?.files;
+  if (Array.isArray(files)) {
+    const visibleFiles = files.filter((value): value is string => typeof value === "string");
+    if (visibleFiles.length > 0) {
+      return { kind: "lines", summary: "查看文件", value: visibleFiles };
+    }
+  }
+  if (event.type === "todo" || event.type === "todo_list") {
+    const lines = parsedTodoLines(event.data?.detail);
+    if (lines.length > 0) {
+      return { kind: "lines", summary: "查看任务", value: lines };
+    }
+  }
+  for (const key of ["output", "command", "detail", "path"]) {
+    const value = event.data?.[key];
+    if (typeof value === "string" && value.trim()) {
+      return {
+        kind: "pre",
+        summary: activityDetailSummary(event),
+        value,
+      };
+    }
+  }
+  return null;
+}
+
+function activityDetailSummary(event: AiChatEvent): string {
+  if (typeof event.data?.output === "string" && event.data.output.trim()) return "查看输出";
+  if (typeof event.data?.command === "string" && event.data.command.trim()) return "查看命令";
+  if (typeof event.data?.detail === "string" && event.data.detail.trim()) return "查看详情";
+  if (typeof event.data?.path === "string" && event.data.path.trim()) return "查看路径";
+  if (Array.isArray(event.data?.files)) return "查看文件";
+  return "查看详情";
+}
+
+function MarkdownMessage({
+  children,
+  skillsById,
+}: {
+  children: string;
+  skillsById?: Map<string, AiChatSkill>;
+}) {
+  return (
+    <div className="ai-chat-markdown">
+      <ReactMarkdown
+        remarkPlugins={[remarkGfm]}
+        components={{
+          a: ({ node: _node, href, ...props }) => {
+            if (href?.startsWith(SKILL_LINK_PREFIX)) {
+              const skillId = decodeURIComponent(href.slice(SKILL_LINK_PREFIX.length));
+              return <SkillReference skill={skillsById?.get(skillId)} skillId={skillId} />;
+            }
+            return <a {...props} href={href} target="_blank" rel="noreferrer" />;
+          },
+        }}
+      >
+        {children}
+      </ReactMarkdown>
+    </div>
+  );
+}
+
+function ThinkingStepDetail({
+  detail,
+}: {
+  detail: ThinkingActivityDetail;
+}) {
+  const [isOpen, setIsOpen] = useState(false);
+
+  return (
+    <div className={`ai-chat-thinking-detail${isOpen ? " is-open" : ""}`}>
+      <button
+        aria-expanded={isOpen}
+        className="ai-chat-thinking-detail-trigger"
+        onClick={() => setIsOpen((open) => !open)}
+        type="button"
+      >
+        <span>{detail.summary}</span>
+        <LinearIcon name="chevronRight" />
+      </button>
+      <div
+        aria-hidden={!isOpen}
+        className="ai-chat-thinking-detail-panel"
+        inert={!isOpen}
+      >
+        <div className="ai-chat-thinking-detail-panel-inner">
+          {detail.kind === "lines" ? (
+            <div className="ai-chat-thinking-detail-lines">
+              {detail.value.map((line, index) => (
+                <span key={`${line}-${index}`}>{line}</span>
+              ))}
+            </div>
+          ) : (
+            <pre><code>{detail.value}</code></pre>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function ThinkingSteps({
+  events,
+  active,
+}: {
+  events: AiChatEvent[];
+  active: boolean;
+}) {
+  const statuses = events.map(aiChatEventStatus);
+  const status = statuses.includes("running")
+    ? "running"
+    : statuses.includes("failed") ? "failed" : "completed";
+  const [isOpen, setIsOpen] = useState(active);
+  const previousActiveRef = useRef(active);
+
+  useEffect(() => {
+    if (previousActiveRef.current === active) return;
+    previousActiveRef.current = active;
+    setIsOpen(active);
+  }, [active]);
+
+  const statusLabel = status === "running"
+    ? "思考中"
+    : status === "failed" ? "思考中断" : "已思考";
+
+  return (
+    <section className={`ai-chat-thinking-steps is-${status}`}>
+      <button
+        aria-expanded={isOpen}
+        className="ai-chat-thinking-header"
+        onClick={() => setIsOpen((open) => !open)}
+        type="button"
+      >
+        <span className="ai-chat-thinking-label">{statusLabel}</span>
+        <LinearIcon className="ai-chat-thinking-chevron" name="chevronRight" />
+      </button>
+      <div
+        aria-hidden={!isOpen}
+        className={`ai-chat-thinking-panel${isOpen ? " is-open" : ""}`}
+        inert={!isOpen}
+      >
+        <div className="ai-chat-thinking-panel-clip">
+          <div className="ai-chat-thinking-list">
+            {events.map((event, index) => {
+              const eventStatus = aiChatEventStatus(event);
+              const detail = activityDetail(event);
+              const content = detail?.kind === "lines"
+                && (event.type === "file" || event.type === "file_change")
+                ? `${detail.value.length} 个文件`
+                : detail?.kind === "lines"
+                  && (event.type === "todo" || event.type === "todo_list")
+                  ? `${detail.value.length} 项任务`
+                  : event.content.trim();
+              return (
+                <div
+                  className="ai-chat-thinking-step-entry"
+                  key={typeof event.data?.itemId === "string" && event.data.itemId
+                    ? event.data.itemId
+                    : event.id}
+                  style={{ animationDelay: `${Math.min(index * 40, 240)}ms` }}
+                >
+                  <div className={`ai-chat-thinking-step is-${eventStatus}${index === events.length - 1 ? " is-last" : ""}`}>
+                    <span className="ai-chat-thinking-step-rail" aria-hidden="true">
+                      <span className="ai-chat-thinking-step-icon">
+                        <LinearIcon name={eventStatus === "failed" ? "alert" : ACTIVITY_ICONS[event.type] ?? "statusTodo"} />
+                      </span>
+                      {index !== events.length - 1 && (
+                        <span className="ai-chat-thinking-step-connector" />
+                      )}
+                    </span>
+                    <div className="ai-chat-thinking-step-content">
+                      <div className="ai-chat-thinking-step-heading">
+                        <span className="ai-chat-thinking-step-label">
+                          {ACTIVITY_LABELS[event.type] ?? "执行活动"}
+                          {eventStatus === "running" && <span aria-hidden="true">…</span>}
+                        </span>
+                        {content && (
+                          <span className="ai-chat-thinking-step-description">
+                            {content}
+                          </span>
+                        )}
+                      </div>
+                      {detail && (
+                        <ThinkingStepDetail detail={detail} />
+                      )}
+                    </div>
+                  </div>
+                </div>
+              );
+            })}
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+}
+
+function EventAttachments({ event }: { event: AiChatEvent }) {
+  const rawAttachments = event.data?.attachments;
+  if (!Array.isArray(rawAttachments)) return null;
+  const attachments = rawAttachments.flatMap((value) => {
+    if (typeof value !== "object" || value === null) return [];
+    const attachment = value as Record<string, unknown>;
+    if (
+      typeof attachment.filename !== "string"
+      || typeof attachment.contentType !== "string"
+      || typeof attachment.size !== "number"
+    ) return [];
+    return [{
+      filename: attachment.filename,
+      contentType: attachment.contentType,
+      size: attachment.size,
+    }];
+  });
+  if (attachments.length === 0) return null;
+  return (
+    <div className="ai-chat-event-attachments">
+      {attachments.map((attachment, index) => (
+        <span key={`${attachment.filename}-${index}`}>
+          <LinearIcon name="attachment" />
+          <span>{attachment.filename}</span>
+        </span>
+      ))}
+    </div>
+  );
+}
+
+function MessageTimeline({
+  activeRunId,
+  events,
+  skills,
+}: {
+  activeRunId: string | null;
+  events: AiChatEvent[];
+  skills: AiChatSkill[];
+}) {
+  const skillsById = new Map(skills.map((skill) => [skill.id, skill]));
+  const handleSkillFragmentCopy = (event: ReactClipboardEvent<HTMLElement>) => {
+    const fragment = selectedComposerFragment(event.currentTarget);
+    if (fragment) writeSkillFragmentToClipboard(event, fragment, skillsById);
+  };
+  const timeline = filterVisibleAiEvents(events).reduce<Array<AiChatEvent | AiChatEvent[]>>(
+    (items, event) => {
+      const isMessage = event.role === "user"
+        || event.type === "user"
+        || event.type === "user_message"
+        || event.role === "assistant"
+        || event.type === "assistant"
+        || event.type === "agent_message";
+      if (isMessage) {
+        items.push(event);
+        return items;
+      }
+      const previous = items[items.length - 1];
+      if (Array.isArray(previous)) previous.push(event);
+      else items.push([event]);
+      return items;
+    },
+    [],
+  );
+  return (
+    <>
+      {timeline.map((entry) => {
+        if (Array.isArray(entry)) {
+          return (
+            <ThinkingSteps
+              active={Boolean(
+                activeRunId
+                && entry.some((event) => event.runId === activeRunId),
+              )}
+              events={entry}
+              key={`activity-${
+                typeof entry[0]?.data?.itemId === "string" && entry[0].data.itemId
+                  ? entry[0].data.itemId
+                  : entry[0]?.id ?? "empty"
+              }`}
+            />
+          );
+        }
+        const event = entry;
+        if (event.role === "user" || event.type === "user" || event.type === "user_message") {
+          return (
+            <article
+              className="ai-chat-user-message"
+              key={event.id}
+              onCopy={handleSkillFragmentCopy}
+            >
+              <MarkdownMessage skillsById={skillsById}>
+                {skillMarkdown(event.content, eventSkillIds(event), skillsById)}
+              </MarkdownMessage>
+              <EventAttachments event={event} />
+            </article>
+          );
+        }
+        if (event.role === "assistant" || event.type === "assistant" || event.type === "agent_message") {
+          return (
+            <article className="ai-chat-assistant-message" key={event.id}>
+              <MarkdownMessage>{event.content}</MarkdownMessage>
+            </article>
+          );
+        }
+        return null;
+      })}
+    </>
+  );
+}
+
+function OptionMenu({
+  label,
+  children,
+}: {
+  label: string;
+  children: ReactNode;
+}) {
+  return (
+    <div className="ai-chat-option-menu" role="menu" aria-label={label}>
+      {children}
+    </div>
+  );
+}
+
+export function AiChat({ available, projectId, issueId, resumeRequest }: AiChatProps) {
+  const [panelOpen, setPanelOpen] = useState(false);
+  const [historyOpen, setHistoryOpen] = useState(false);
+  const [menu, setMenu] = useState<MenuName>(null);
+  const [threads, setThreads] = useState<AiChatThread[]>([]);
+  const [selectedThreadId, setSelectedThreadId] = useState<string | null>(
+    () => window.localStorage.getItem(LAST_THREAD_KEY),
+  );
+  const [snapshot, setSnapshot] = useState<AiChatThreadSnapshot | null>(null);
+  const [draftOrigin, setDraftOrigin] = useState<DraftThreadOrigin | null>(null);
+  const [catalog, setCatalog] = useState<AiChatCatalog | null>(null);
+  const [catalogLoadedProjectId, setCatalogLoadedProjectId] = useState<string | null>(null);
+  const [catalogError, setCatalogError] = useState<string | null>(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const [draft, setDraft] = useState("");
+  const [attachments, setAttachments] = useState<ComposerAttachment[]>([]);
+  const [skillIds, setSkillIds] = useState<string[]>([]);
+  const [skillMention, setSkillMention] = useState<ComposerSkillQuery | null>(null);
+  const [selectedSkillIndex, setSelectedSkillIndex] = useState(0);
+  const [composerSkillTokens, setComposerSkillTokens] = useState<ComposerSkillToken[]>([]);
+  const [pendingDangerInput, setPendingDangerInput] = useState<PendingDangerInput | null>(null);
+  const [unread, setUnread] = useState(false);
+  const [draftModel, setDraftModel] = useState("");
+  const [draftEffort, setDraftEffort] = useState("");
+  const [draftSandbox, setDraftSandbox] = useState<AiChatSandbox>("workspace-write");
+  const [settingsSaving, setSettingsSaving] = useState(false);
+  const [deletingThreadId, setDeletingThreadId] = useState<string | null>(null);
+  const [attachmentDragActive, setAttachmentDragActive] = useState(false);
+  const [panelGeometry, setPanelGeometry] = useState<PanelGeometry | null>(
+    () => window.innerWidth <= 719 ? null : loadPanelGeometry(),
+  );
+  const [panelMaximized, setPanelMaximized] = useState(false);
+  const [panelResizeEdge, setPanelResizeEdge] = useState<PanelResizeEdge | null>(null);
+  const editorRef = useRef<HTMLDivElement>(null);
+  const skillMentionRangeRef = useRef<Range | null>(null);
+  const composerBeforeInputRef = useRef<ComposerBeforeInput | null>(null);
+  const skillMenuRef = useRef<HTMLDivElement>(null);
+  const attachmentInputRef = useRef<HTMLInputElement>(null);
+  const messagesRef = useRef<HTMLDivElement>(null);
+  const panelRef = useRef<HTMLElement>(null);
+  const panelResizeSessionRef = useRef<PanelResizeSession | null>(null);
+  const selectedThreadRef = useRef(selectedThreadId);
+  const draftReturnThreadIdRef = useRef<string | null>(null);
+  const panelOpenRef = useRef(panelOpen);
+  const snapshotRequestRef = useRef(0);
+  const snapshotLoadingRequestRef = useRef(0);
+  const lastResumeRequestIdRef = useRef<number | null>(null);
+  const observedRunStatusesRef = useRef(new Map<string, AiChatRun["status"]>());
+  const dangerConfirmOpen = pendingDangerInput !== null;
+
+  const selectThread = useCallback((threadId: string | null) => {
+    selectedThreadRef.current = threadId;
+    setSelectedThreadId(threadId);
+  }, []);
+
+  useEffect(() => {
+    selectedThreadRef.current = selectedThreadId;
+    if (selectedThreadId) window.localStorage.setItem(LAST_THREAD_KEY, selectedThreadId);
+    else window.localStorage.removeItem(LAST_THREAD_KEY);
+  }, [selectedThreadId]);
+
+  useEffect(() => {
+    panelOpenRef.current = panelOpen;
+    if (panelOpen) {
+      setUnread(false);
+      if (window.innerWidth <= 719) {
+        setPanelMaximized(false);
+        setPanelGeometry(null);
+      } else {
+        setPanelGeometry(loadPanelGeometry());
+      }
+    }
+  }, [panelOpen]);
+
+  useEffect(() => {
+    function finishPanelResize(pointerId?: number) {
+      const session = panelResizeSessionRef.current;
+      if (!session || (pointerId !== undefined && session.pointerId !== pointerId)) return;
+      if (session.captureTarget.hasPointerCapture(session.pointerId)) {
+        session.captureTarget.releasePointerCapture(session.pointerId);
+      }
+      if (window.innerWidth > 719) {
+        window.localStorage.setItem(
+          PANEL_GEOMETRY_KEY,
+          JSON.stringify(session.geometry),
+        );
+      }
+      panelResizeSessionRef.current = null;
+      setPanelResizeEdge(null);
+    }
+
+    function resizePanel(event: PointerEvent) {
+      const session = panelResizeSessionRef.current;
+      if (!session || session.pointerId !== event.pointerId) return;
+      event.preventDefault();
+
+      const maxWidth = Math.min(
+        PANEL_MAX_WIDTH,
+        window.innerWidth - PANEL_EDGE_GAP * 2,
+      );
+      const minWidth = Math.min(PANEL_MIN_WIDTH, maxWidth);
+      const maxHeight = window.innerHeight - PANEL_EDGE_GAP * 2;
+      const minHeight = Math.min(PANEL_MIN_HEIGHT, maxHeight);
+      const resizeWidth = session.edge === "left" || session.edge === "top-left";
+      const resizeHeight = session.edge === "top" || session.edge === "top-left";
+      const width = resizeWidth
+        ? Math.min(
+            maxWidth,
+            Math.max(minWidth, session.startWidth - (event.clientX - session.startX)),
+          )
+        : session.startWidth;
+      const height = resizeHeight
+        ? Math.min(
+            maxHeight,
+            Math.max(minHeight, session.startHeight - (event.clientY - session.startY)),
+          )
+        : session.startHeight;
+      session.geometry = { width, height };
+      setPanelGeometry(session.geometry);
+    }
+
+    function handlePointerEnd(event: PointerEvent) {
+      finishPanelResize(event.pointerId);
+    }
+
+    function handleWindowBlur() {
+      finishPanelResize();
+    }
+
+    function handleWindowResize() {
+      finishPanelResize();
+      if (window.innerWidth <= 719) {
+        setPanelMaximized(false);
+        setPanelGeometry(null);
+        return;
+      }
+
+      setPanelGeometry(loadPanelGeometry());
+    }
+
+    window.addEventListener("pointermove", resizePanel, { passive: false });
+    window.addEventListener("pointerup", handlePointerEnd);
+    window.addEventListener("pointercancel", handlePointerEnd);
+    window.addEventListener("blur", handleWindowBlur);
+    window.addEventListener("resize", handleWindowResize);
+    return () => {
+      window.removeEventListener("pointermove", resizePanel);
+      window.removeEventListener("pointerup", handlePointerEnd);
+      window.removeEventListener("pointercancel", handlePointerEnd);
+      window.removeEventListener("blur", handleWindowBlur);
+      window.removeEventListener("resize", handleWindowResize);
+    };
+  }, []);
+
+  function startPanelResize(
+    event: ReactPointerEvent<HTMLDivElement>,
+    edge: PanelResizeEdge,
+  ) {
+    if (window.innerWidth <= 719) return;
+    const panel = panelRef.current;
+    if (!panel) return;
+
+    event.preventDefault();
+    event.stopPropagation();
+    const rect = panel.getBoundingClientRect();
+    event.currentTarget.setPointerCapture(event.pointerId);
+    setPanelMaximized(false);
+    panelResizeSessionRef.current = {
+      edge,
+      pointerId: event.pointerId,
+      startX: event.clientX,
+      startY: event.clientY,
+      startWidth: rect.width,
+      startHeight: rect.height,
+      geometry: {
+        width: rect.width,
+        height: rect.height,
+      },
+      captureTarget: event.currentTarget,
+    };
+    setPanelGeometry({
+      width: rect.width,
+      height: rect.height,
+    });
+    setPanelResizeEdge(edge);
+  }
+
+  function togglePanelSize() {
+    if (window.innerWidth <= 719) return;
+    setPanelMaximized((current) => !current);
+  }
+
+  const replaceThread = useCallback((thread: AiChatThread) => {
+    setThreads((current) => {
+      const next = current.filter((candidate) => candidate.id !== thread.id);
+      return [thread, ...next].sort((left, right) => right.updatedAt.localeCompare(left.updatedAt));
+    });
+  }, []);
+
+  const observeRunTransitions = useCallback((runs: AiChatRun[]) => {
+    let completedWhileClosed = false;
+    for (const run of runs) {
+      const previous = observedRunStatusesRef.current.get(run.id);
+      observedRunStatusesRef.current.set(run.id, run.status);
+      if (
+        previous === "running"
+        && run.status !== "running"
+        && !panelOpenRef.current
+      ) completedWhileClosed = true;
+    }
+    if (completedWhileClosed) setUnread(true);
+  }, []);
+
+  const loadSnapshot = useCallback(async (threadId: string, quiet = false) => {
+    const requestId = ++snapshotRequestRef.current;
+    if (!quiet) {
+      snapshotLoadingRequestRef.current = requestId;
+      setLoading(true);
+    }
+    try {
+      const next = await getAiChatThread(threadId);
+      if (requestId !== snapshotRequestRef.current || selectedThreadRef.current !== threadId) return;
+      setSnapshot(next);
+      replaceThread(next.thread);
+      observeRunTransitions(next.runs);
+      if (!quiet) setError(null);
+    } catch (nextError) {
+      if (
+        !quiet
+        && requestId === snapshotRequestRef.current
+        && selectedThreadRef.current === threadId
+      ) setError(messageFor(nextError));
+    } finally {
+      if (!quiet && requestId === snapshotLoadingRequestRef.current) setLoading(false);
+    }
+  }, [observeRunTransitions, replaceThread]);
+
+  const selectedHintRefreshQueue = useMemo(
+    () => createAiSnapshotRefreshQueue((threadId) => loadSnapshot(threadId, true)),
+    [loadSnapshot],
+  );
+  useEffect(() => () => selectedHintRefreshQueue.clear(), [selectedHintRefreshQueue]);
+
+  const loadThreads = useCallback(async () => {
+    try {
+      const next = await listAiChatThreads();
+      setThreads(next);
+      setSelectedThreadId((current) => {
+        const selected = current && next.some((thread) => thread.id === current)
+          ? current
+          : next[0]?.id ?? null;
+        selectedThreadRef.current = selected;
+        return selected;
+      });
+    } catch (nextError) {
+      setError(messageFor(nextError));
+    }
+  }, []);
+
+  useEffect(() => {
+    if (!available) {
+      setPanelOpen(false);
+      return;
+    }
+    void loadThreads();
+  }, [available, loadThreads]);
+
+  useEffect(() => {
+    setSnapshot(null);
+    if (!selectedThreadId) return;
+    let initialPending = true;
+    let refreshQueued = false;
+    let disposed = false;
+    void loadSnapshot(selectedThreadId).finally(() => {
+      initialPending = false;
+      if (refreshQueued && !disposed) {
+        void selectedHintRefreshQueue.request(selectedThreadId);
+      }
+    });
+    const unsubscribe = subscribeAiChatThread(
+      selectedThreadId,
+      () => {
+        if (initialPending) refreshQueued = true;
+        else void selectedHintRefreshQueue.request(selectedThreadId);
+      },
+    );
+    return () => {
+      disposed = true;
+      unsubscribe();
+    };
+  }, [loadSnapshot, selectedHintRefreshQueue, selectedThreadId]);
+
+  const backgroundRunningThreadIds = threads
+    .filter((thread) => thread.status === "running" && thread.id !== selectedThreadId)
+    .map((thread) => thread.id);
+  useEffect(() => {
+    if (!available || backgroundRunningThreadIds.length === 0) return;
+    const refresh = async (threadId: string) => {
+      try {
+        const next = await getAiChatThread(threadId);
+        replaceThread(next.thread);
+        observeRunTransitions(next.runs);
+      } catch {
+        // The selected thread surfaces request errors; background history refresh stays quiet.
+      }
+    };
+    const refreshQueue = createAiSnapshotRefreshQueue(refresh);
+    const unsubscribers = backgroundRunningThreadIds.map((threadId) => (
+      subscribeAiChatThread(threadId, () => void refreshQueue.request(threadId))
+    ));
+    return () => {
+      refreshQueue.clear();
+      for (const unsubscribe of unsubscribers) unsubscribe();
+    };
+  }, [
+    available,
+    backgroundRunningThreadIds.join(","),
+    observeRunTransitions,
+    replaceThread,
+    selectedThreadId,
+  ]);
+
+  const selectedThreadSummary = threads.find((thread) => thread.id === selectedThreadId) ?? null;
+  const catalogProjectId = snapshot?.thread.origin.projectId
+    ?? selectedThreadSummary?.origin.projectId
+    ?? draftOrigin?.projectId
+    ?? projectId;
+  const activeCatalog = catalogLoadedProjectId === catalogProjectId ? catalog : null;
+  useEffect(() => {
+    if (!available || !catalogProjectId) {
+      setCatalog(null);
+      setCatalogLoadedProjectId(null);
+      setCatalogError(null);
+      return;
+    }
+    const controller = new AbortController();
+    setCatalog(null);
+    setCatalogLoadedProjectId(null);
+    setCatalogError(null);
+    void getAiChatCatalog(catalogProjectId, controller.signal).then(
+      (next) => {
+        if (controller.signal.aborted) return;
+        setCatalog(next);
+        setCatalogLoadedProjectId(catalogProjectId);
+        setCatalogError(null);
+      },
+      (nextError) => {
+        if (controller.signal.aborted) return;
+        if ((nextError as Error).name !== "AbortError") {
+          setCatalog(null);
+          setCatalogLoadedProjectId(null);
+          setCatalogError(messageFor(nextError));
+        }
+      },
+    );
+    return () => controller.abort();
+  }, [available, catalogProjectId]);
+
+  const restoreDraftSettings = useCallback((thread: AiChatThread) => {
+    setDraftModel(thread.model);
+    setDraftEffort(thread.reasoningEffort);
+    setDraftSandbox(thread.sandbox);
+  }, []);
+
+  useEffect(() => {
+    const thread = snapshot?.thread;
+    if (thread) {
+      restoreDraftSettings(thread);
+      return;
+    }
+    const normalized = normalizeChatSelection(activeCatalog?.models ?? [], draftModel, draftEffort);
+    if (normalized) {
+      setDraftModel(normalized.model);
+      setDraftEffort(normalized.reasoningEffort);
+    }
+    const sandbox = draftOrigin && activeCatalog?.sandboxes.includes(draftSandbox)
+      ? draftSandbox
+      : activeCatalog?.sandboxes.find(
+          (candidate): candidate is AiChatSandbox => candidate === "workspace-write",
+        ) ?? activeCatalog?.sandboxes.find(isAiChatSandbox);
+    if (sandbox) setDraftSandbox(sandbox);
+  }, [activeCatalog, draftOrigin, restoreDraftSettings, snapshot?.thread.id]);
+
+  useEffect(() => {
+    const container = messagesRef.current;
+    if (!container || !panelOpen) return;
+    container.scrollTop = container.scrollHeight;
+  }, [panelOpen, snapshot?.events.length, snapshot?.thread.status]);
+
+  useEffect(() => {
+    if (!panelOpen) return;
+    function closeWithEscape(event: KeyboardEvent) {
+      if (event.key !== "Escape") return;
+      event.preventDefault();
+      event.stopPropagation();
+      if (typeof event.stopImmediatePropagation === "function") event.stopImmediatePropagation();
+      if (dangerConfirmOpen) setPendingDangerInput(null);
+      else if (skillMention) setSkillMention(null);
+      else if (menu) setMenu(null);
+      else if (historyOpen) setHistoryOpen(false);
+      else {
+        restorePersistedConversationFromDraft();
+        setPanelOpen(false);
+      }
+    }
+    document.addEventListener("keydown", closeWithEscape, true);
+    return () => document.removeEventListener("keydown", closeWithEscape, true);
+  }, [dangerConfirmOpen, draftOrigin, historyOpen, menu, panelOpen, skillMention, threads]);
+
+  const visibleSkills = useMemo(
+    () => (activeCatalog?.skills ?? []).filter((skill) => (
+      skill.id !== "manage-taskboard"
+      && !skill.id.endsWith(":manage-taskboard")
+      && (
+        !skillMention?.query
+        || skill.label.toLocaleLowerCase().includes(skillMention.query)
+        || skill.id.toLocaleLowerCase().includes(skillMention.query)
+        || skill.description.toLocaleLowerCase().includes(skillMention.query)
+        || skill.path.toLocaleLowerCase().includes(skillMention.query)
+      )
+    )),
+    [activeCatalog?.skills, skillMention?.query],
+  );
+  const selectedModel = activeCatalog?.models.find((model) => model.slug === draftModel) ?? null;
+  const availableSandboxes = (activeCatalog?.sandboxes ?? []).filter(isAiChatSandbox);
+  const currentRun = snapshot?.thread.currentRun
+    ?? snapshot?.runs.find((run) => run.status === "running")
+    ?? null;
+  const composerBlocked = Boolean(
+    selectedThreadId && deletingThreadId === selectedThreadId,
+  );
+  const sendBlocked = loading
+    || settingsSaving
+    || composerBlocked
+    || Boolean(selectedThreadId && !snapshot);
+  const threadSettingsBlocked = loading || Boolean(selectedThreadId && !snapshot);
+  const attachmentBlocked = composerBlocked;
+  const primaryAction = chatPrimaryAction(
+    snapshot?.thread.status ?? "idle",
+    draft,
+    sendBlocked,
+    attachments.length > 0,
+  );
+  const anyRunning = threads.some((thread) => thread.status === "running");
+  const anyFailed = threads.some((thread) => thread.status === "failed");
+  const launcherState = anyRunning ? "running" : anyFailed ? "failed" : unread ? "unread" : "idle";
+  const lastUserEvent = snapshot?.thread.status === "failed"
+    ? [...snapshot.events].reverse().find((event) => (
+        event.role === "user"
+        || event.type === "user"
+        || event.type === "user_message"
+      )) ?? null
+    : null;
+  const retryableUserEvent = lastUserEvent && !eventHasAttachments(lastUserEvent)
+    ? lastUserEvent
+    : null;
+
+  useEffect(() => {
+    setSelectedSkillIndex(0);
+  }, [skillMention?.query]);
+
+  useEffect(() => {
+    setSelectedSkillIndex((current) => (
+      visibleSkills.length === 0 ? 0 : Math.min(current, visibleSkills.length - 1)
+    ));
+  }, [visibleSkills.length]);
+
+  useEffect(() => {
+    const option = skillMenuRef.current?.querySelector<HTMLElement>(
+      `[data-skill-index="${selectedSkillIndex}"]`,
+    );
+    option?.scrollIntoView({ block: "nearest" });
+  }, [selectedSkillIndex, skillMention?.query, visibleSkills.length]);
+
+  useEffect(() => {
+    if (attachmentBlocked) setAttachmentDragActive(false);
+  }, [attachmentBlocked]);
+
+  function resetComposer() {
+    editorRef.current?.replaceChildren();
+    if (attachmentInputRef.current) attachmentInputRef.current.value = "";
+    setDraft("");
+    setAttachments([]);
+    setSkillIds([]);
+    setComposerSkillTokens([]);
+    setSkillMention(null);
+    setPendingDangerInput(null);
+    setAttachmentDragActive(false);
+    skillMentionRangeRef.current = null;
+  }
+
+  function restorePersistedConversationFromDraft() {
+    if (!draftOrigin) return;
+    const previousThreadId = draftReturnThreadIdRef.current;
+    const nextThreadId = previousThreadId && threads.some((thread) => thread.id === previousThreadId)
+      ? previousThreadId
+      : threads[0]?.id ?? null;
+    draftReturnThreadIdRef.current = null;
+    setDraftOrigin(null);
+    setSnapshot(null);
+    selectThread(nextThreadId);
+    resetComposer();
+  }
+
+  useEffect(() => {
+    if (
+      !draftOrigin
+      || (
+        draftOrigin.projectId === projectId
+        && draftOrigin.issueId === (issueId ?? null)
+      )
+    ) return;
+    restorePersistedConversationFromDraft();
+  }, [draftOrigin?.issueId, draftOrigin?.projectId, issueId, projectId]);
+
+  function beginNewConversation() {
+    const input = buildThreadCreateInput(projectId ?? "", issueId);
+    if (!input) {
+      setError("请先进入一个已映射的项目，再新建对话");
+      return;
+    }
+    if (!draftOrigin) draftReturnThreadIdRef.current = selectedThreadRef.current;
+    resetComposer();
+    setDraftOrigin({
+      projectId: input.projectId,
+      issueId: input.issueId ?? null,
+    });
+    setSnapshot(null);
+    selectThread(null);
+    setHistoryOpen(false);
+    setMenu(null);
+    setError(null);
+  }
+
+  async function settingsForNewAiThread(targetProjectId: string): Promise<{
+    model: string;
+    reasoningEffort: string;
+    sandbox: AiChatSandbox;
+  }> {
+    const inheritedSettings = {
+      model: draftModel,
+      reasoningEffort: draftEffort,
+      sandbox: draftSandbox,
+    };
+    const targetCatalog = catalogLoadedProjectId === targetProjectId && activeCatalog
+      ? activeCatalog
+      : await getAiChatCatalog(targetProjectId);
+    const normalized = normalizeChatSelection(
+      targetCatalog.models,
+      inheritedSettings.model,
+      inheritedSettings.reasoningEffort,
+    );
+    const sandbox = targetCatalog.sandboxes.includes(inheritedSettings.sandbox)
+      ? inheritedSettings.sandbox
+      : targetCatalog.sandboxes.find(
+        (candidate): candidate is AiChatSandbox => candidate === "workspace-write",
+      ) ?? targetCatalog.sandboxes.find(isAiChatSandbox) ?? inheritedSettings.sandbox;
+    return {
+      model: normalized?.model ?? inheritedSettings.model,
+      reasoningEffort: normalized?.reasoningEffort ?? inheritedSettings.reasoningEffort,
+      sandbox,
+    };
+  }
+
+  async function createThreadForDraftOrigin(): Promise<AiChatThread | null> {
+    const origin = draftOrigin ?? (
+      projectId ? { projectId, issueId } : null
+    );
+    const input = buildThreadCreateInput(origin?.projectId ?? "", origin?.issueId ?? null);
+    if (!input) {
+      setError("请先进入一个已映射的项目，再新建对话");
+      return null;
+    }
+    setLoading(true);
+    try {
+      const settings = await settingsForNewAiThread(input.projectId);
+      const thread = await createAiChatThread({
+        ...input,
+        ...settings,
+      });
+      replaceThread(thread);
+      selectThread(thread.id);
+      setSnapshot({ thread, events: [], runs: [] });
+      draftReturnThreadIdRef.current = null;
+      setDraftOrigin(null);
+      setHistoryOpen(false);
+      setError(null);
+      return thread;
+    } catch (nextError) {
+      setError(messageFor(nextError));
+      return null;
+    } finally {
+      setLoading(false);
+    }
+  }
+
+  async function openCodexThreadInPanel(request: AiChatResumeRequest) {
+    const codexThreadId = request.codexThreadId.trim();
+    const input = buildThreadCreateInput(request.projectId, request.issueId);
+    if (!codexThreadId || !input) {
+      setError("无法在当前页面打开这个对话。");
+      return;
+    }
+
+    restorePersistedConversationFromDraft();
+    resetComposer();
+    setPanelOpen(true);
+    setHistoryOpen(false);
+    setMenu(null);
+    setError(null);
+    setDraftOrigin(null);
+    draftReturnThreadIdRef.current = null;
+    setLoading(true);
+
+    try {
+      const latestThreads = await listAiChatThreads();
+      setThreads(latestThreads);
+      const existing = latestThreads.find((thread) => thread.codexThreadId === codexThreadId);
+      if (existing) {
+        replaceThread(existing);
+        selectThread(existing.id);
+        setSnapshot(null);
+        void loadSnapshot(existing.id);
+        return;
+      }
+
+      const settings = await settingsForNewAiThread(input.projectId);
+      const thread = await createAiChatThread({
+        ...input,
+        ...settings,
+        ...(request.title ? { title: request.title } : {}),
+        codexThreadId,
+      });
+      replaceThread(thread);
+      selectThread(thread.id);
+      setSnapshot({ thread, events: [], runs: [] });
+    } catch (nextError) {
+      setError(messageFor(nextError));
+    } finally {
+      setLoading(false);
+    }
+  }
+
+  useEffect(() => {
+    if (
+      !available
+      || !resumeRequest
+      || lastResumeRequestIdRef.current === resumeRequest.id
+    ) return;
+    lastResumeRequestIdRef.current = resumeRequest.id;
+    void openCodexThreadInPanel(resumeRequest);
+  }, [available, resumeRequest?.id]);
+
+  async function deleteThread(thread: AiChatThread) {
+    if (!window.confirm(`删除本地对话“${thread.title}”？`)) return;
+    setDeletingThreadId(thread.id);
+    try {
+      await deleteAiChatThread(thread.id);
+      const remainingThreads = threads.filter((candidate) => candidate.id !== thread.id);
+      setThreads(remainingThreads);
+      if (selectedThreadRef.current === thread.id) {
+        setSnapshot(null);
+        setDraftOrigin(null);
+        selectThread(remainingThreads[0]?.id ?? null);
+        resetComposer();
+      }
+      setError(null);
+    } catch (nextError) {
+      setError(messageFor(nextError));
+    } finally {
+      setDeletingThreadId(null);
+    }
+  }
+
+  async function saveThreadSettings(changes: {
+    model?: string;
+    reasoningEffort?: string;
+    sandbox?: AiChatSandbox;
+  }) {
+    const previousThread = snapshot?.thread;
+    if (!previousThread) return;
+    const threadId = previousThread.id;
+    setSettingsSaving(true);
+    try {
+      const thread = await updateAiChatThread(threadId, changes);
+      setSnapshot((current) => patchAiChatSnapshot(current, threadId, thread));
+      replaceThread(thread);
+      if (selectedThreadRef.current === threadId) setError(null);
+    } catch (nextError) {
+      if (selectedThreadRef.current === threadId) {
+        restoreDraftSettings(previousThread);
+        setError(messageFor(nextError));
+      }
+    } finally {
+      setSettingsSaving(false);
+    }
+  }
+
+  async function chooseModel(model: AiChatModel) {
+    const reasoningEffort = reasoningEffortForModel(model, draftEffort);
+    setMenu(null);
+    setDraftModel(model.slug);
+    setDraftEffort(reasoningEffort);
+    await saveThreadSettings({
+      model: model.slug,
+      reasoningEffort,
+    });
+  }
+
+  async function chooseEffort(reasoningEffort: string) {
+    setMenu(null);
+    setDraftEffort(reasoningEffort);
+    await saveThreadSettings({ reasoningEffort });
+  }
+
+  async function chooseSandbox(sandbox: AiChatSandbox) {
+    setMenu(null);
+    setDraftSandbox(sandbox);
+    await saveThreadSettings({ sandbox });
+  }
+
+  function syncComposerState() {
+    const editor = editorRef.current;
+    if (!editor) return;
+    const next = serializeComposer(editor);
+    setDraft(next.message);
+    setSkillIds(next.skillIds);
+    setComposerSkillTokens((current) => current.filter((token) => editor.contains(token.element)));
+    if (!next.message && editor.childNodes.length > 0) editor.replaceChildren();
+  }
+
+  function rememberComposerBeforeInput(event: InputEvent) {
+    const editor = editorRef.current;
+    const selection = editor?.ownerDocument.getSelection();
+    if (
+      !editor
+      || !selection
+      || !selection.isCollapsed
+      || !selection.focusNode
+      || !editor.contains(selection.focusNode)
+      || event.inputType !== "insertText"
+      || event.data === null
+    ) {
+      composerBeforeInputRef.current = null;
+      return;
+    }
+    composerBeforeInputRef.current = {
+      container: selection.focusNode,
+      offset: selection.focusOffset,
+      text: event.data,
+    };
+  }
+
+  function updateComposerSkillQuery(fromInput = false) {
+    const editor = editorRef.current;
+    if (!editor) return;
+    if (editor.ownerDocument.activeElement !== editor) {
+      composerBeforeInputRef.current = null;
+      skillMentionRangeRef.current = null;
+      setSkillMention(null);
+      return;
+    }
+    const beforeInput = fromInput ? composerBeforeInputRef.current : null;
+    const next = (
+      beforeInput ? composerSkillQueryAfterInput(editor, beforeInput) : null
+    ) ?? composerSkillQuery(editor);
+    composerBeforeInputRef.current = null;
+    skillMentionRangeRef.current = next?.range ?? null;
+    setSkillMention(next ? { query: next.query } : null);
+  }
+
+  function removeComposerSkillToken(element: HTMLElement) {
+    const editor = editorRef.current;
+    const parent = element.parentNode;
+    if (!editor || !parent) return;
+    const nextSibling = element.nextSibling;
+    const childIndex = Array.prototype.indexOf.call(parent.childNodes, element) as number;
+    if (nextSibling?.nodeType === Node.TEXT_NODE && nextSibling.textContent?.startsWith("\u200B")) {
+      nextSibling.textContent = nextSibling.textContent.slice(1);
+    }
+    element.remove();
+    setComposerSkillTokens((current) => current.filter((token) => token.element !== element));
+    const selection = editor.ownerDocument.getSelection();
+    const range = editor.ownerDocument.createRange();
+    if (nextSibling?.isConnected && nextSibling.nodeType === Node.TEXT_NODE) {
+      range.setStart(nextSibling, 0);
+    } else {
+      range.setStart(parent, Math.min(childIndex, parent.childNodes.length));
+    }
+    range.collapse(true);
+    selection?.removeAllRanges();
+    selection?.addRange(range);
+    syncComposerState();
+    editor.focus();
+  }
+
+  function insertComposerFragment(
+    fragment: { message: string; skillIds: string[] },
+    targetRange?: Range,
+  ): boolean {
+    const editor = editorRef.current;
+    if (!editor || composerMarkerCount(fragment.message) !== fragment.skillIds.length) return false;
+    const skillsById = new Map((activeCatalog?.skills ?? []).map((skill) => [skill.id, skill]));
+    if (!fragment.skillIds.every((skillId) => skillsById.has(skillId))) return false;
+    const selection = editor.ownerDocument.getSelection();
+    const range = targetRange ?? (selection?.rangeCount ? selection.getRangeAt(0) : null);
+    if (!range || !editor.contains(range.commonAncestorContainer)) return false;
+
+    const content = editor.ownerDocument.createDocumentFragment();
+    const newTokens: ComposerSkillToken[] = [];
+    let messageOffset = 0;
+    let skillIndex = 0;
+    for (
+      let markerOffset = fragment.message.indexOf(SKILL_MARKER);
+      markerOffset >= 0;
+      markerOffset = fragment.message.indexOf(SKILL_MARKER, messageOffset)
+    ) {
+      if (markerOffset > messageOffset) {
+        content.append(editor.ownerDocument.createTextNode(
+          fragment.message.slice(messageOffset, markerOffset),
+        ));
+      }
+      const skillId = fragment.skillIds[skillIndex];
+      const skill = skillsById.get(skillId);
+      if (!skill) return false;
+      const tokenElement = editor.ownerDocument.createElement("span");
+      tokenElement.className = "ai-chat-composer-skill-token";
+      tokenElement.dataset.skillId = skill.id;
+      tokenElement.contentEditable = "false";
+      tokenElement.title = skillDisplayName(skill);
+      content.append(tokenElement, editor.ownerDocument.createTextNode("\u200B"));
+      newTokens.push({ key: crypto.randomUUID(), id: skill.id, element: tokenElement });
+      skillIndex += 1;
+      messageOffset = markerOffset + SKILL_MARKER.length;
+    }
+    if (messageOffset < fragment.message.length) {
+      content.append(editor.ownerDocument.createTextNode(fragment.message.slice(messageOffset)));
+    }
+    if (!content.lastChild) return false;
+
+    const lastNode = content.lastChild;
+    range.deleteContents();
+    range.insertNode(content);
+    if (lastNode.nodeType === Node.TEXT_NODE) {
+      range.setStart(lastNode, lastNode.textContent?.length ?? 0);
+    } else {
+      range.setStartAfter(lastNode);
+    }
+    range.collapse(true);
+    selection?.removeAllRanges();
+    selection?.addRange(range);
+    syncComposerState();
+    setComposerSkillTokens((current) => [...current, ...newTokens]);
+    setSkillMention(null);
+    skillMentionRangeRef.current = null;
+    editor.focus();
+    return true;
+  }
+
+  function selectSkill(skill: AiChatSkill) {
+    const editor = editorRef.current;
+    const range = skillMentionRangeRef.current;
+    if (!skillMention || !editor || !range) return;
+    insertComposerFragment({ message: SKILL_MARKER, skillIds: [skill.id] }, range);
+  }
+
+  function realSkillIdsForMessage(): string[] {
+    return skillIds;
+  }
+
+  async function startMessage(
+    message: string,
+    dangerConfirmed: boolean,
+    boundSkillIds?: string[],
+    clearSubmittedDraft = true,
+    boundAttachments?: AiChatAttachmentInput[],
+  ) {
+    if (sendBlocked) return;
+    const trimmed = message.trim();
+    const submittedSkillIds = boundSkillIds ?? [...realSkillIdsForMessage()];
+    const messageAttachments = boundAttachments ?? attachments.map((attachment) => ({
+      filename: attachment.filename,
+      contentType: attachment.contentType,
+      dataBase64: attachment.dataBase64,
+    }));
+    if (!trimmed && messageAttachments.length === 0) return;
+    let thread = snapshot?.thread ?? null;
+    const creatingThread = !thread;
+    const messageSandbox = thread?.sandbox ?? draftSandbox;
+    if (needsDangerConfirmation(messageSandbox, dangerConfirmed)) {
+      setPendingDangerInput({
+        message: trimmed,
+        skillIds: submittedSkillIds,
+        attachments: messageAttachments,
+        clearSubmittedDraft,
+      });
+      return;
+    }
+    if (creatingThread && clearSubmittedDraft) resetComposer();
+    if (!thread) thread = await createThreadForDraftOrigin();
+    if (!thread) return;
+    const messageSkillIds = (
+      boundSkillIds !== undefined || catalogLoadedProjectId === thread.origin.projectId
+    ) ? submittedSkillIds : [];
+    setPendingDangerInput(null);
+    setError(null);
+    try {
+      const turnInput = buildTurnInput(
+        trimmed,
+        messageSkillIds,
+        dangerConfirmed,
+        messageAttachments,
+      );
+      if (clearSubmittedDraft && !creatingThread) {
+        resetComposer();
+      }
+      const run = await startAiChatTurn(thread.id, turnInput);
+      observedRunStatusesRef.current.set(run.id, run.status);
+      setSnapshot((current) => current?.thread.id === thread.id ? {
+          ...current,
+          thread: { ...current.thread, status: "running", currentRun: run },
+          runs: [run, ...current.runs.filter((candidate) => candidate.id !== run.id)],
+        } : current);
+      replaceThread({ ...thread, status: "running", currentRun: run });
+      if (selectedThreadRef.current === thread.id) {
+        void selectedHintRefreshQueue.request(thread.id);
+      }
+    } catch (nextError) {
+      if (selectedThreadRef.current === thread.id) setError(messageFor(nextError));
+      if (selectedThreadRef.current === thread.id) {
+        void selectedHintRefreshQueue.request(thread.id);
+      }
+    }
+  }
+
+  function attachmentFiles(files: FileList | File[]): File[] {
+    return Array.from(files);
+  }
+
+  async function addAttachments(files: File[]) {
+    if (attachmentBlocked) return;
+    const acceptedFiles = attachmentFiles(files);
+    if (acceptedFiles.length === 0) return;
+    try {
+      const nextAttachments = await Promise.all(acceptedFiles.map((file, index) => (
+        new Promise<ComposerAttachment>((resolve, reject) => {
+          const reader = new FileReader();
+          reader.onload = () => {
+            if (typeof reader.result !== "string") {
+              reject(new Error(`无法读取附件 ${file.name}`));
+              return;
+            }
+            const separator = reader.result.indexOf(",");
+            resolve({
+              id: `${file.name}-${file.size}-${file.lastModified}-${Date.now()}-${index}`,
+              filename: file.name,
+              contentType: file.type || "application/octet-stream",
+              dataBase64: reader.result.slice(separator + 1),
+              ...(file.type.startsWith("image/") ? { previewUrl: reader.result } : {}),
+            });
+          };
+          reader.onerror = () => reject(new Error(`无法读取附件 ${file.name}`));
+          reader.readAsDataURL(file);
+        })
+      )));
+      setAttachments((current) => [...current, ...nextAttachments]);
+      setError(null);
+    } catch (nextError) {
+      setError(messageFor(nextError));
+    }
+  }
+
+  async function handleAttachmentSelection(event: ChangeEvent<HTMLInputElement>) {
+    const files = attachmentFiles(event.target.files ?? []);
+    event.target.value = "";
+    await addAttachments(files);
+  }
+
+  function hasDraggedFile(event: ReactDragEvent<HTMLDivElement>): boolean {
+    return Array.from(event.dataTransfer.items).some((item) => (
+      item.kind === "file"
+    )) || event.dataTransfer.files.length > 0;
+  }
+
+  function handleAttachmentDragEnter(event: ReactDragEvent<HTMLDivElement>) {
+    if (!hasDraggedFile(event)) return;
+    event.preventDefault();
+    if (attachmentBlocked) return;
+    setAttachmentDragActive(true);
+  }
+
+  function handleAttachmentDragOver(event: ReactDragEvent<HTMLDivElement>) {
+    if (!attachmentDragActive && !hasDraggedFile(event)) return;
+    event.preventDefault();
+    event.dataTransfer.dropEffect = attachmentBlocked ? "none" : "copy";
+  }
+
+  function handleAttachmentDragLeave(event: ReactDragEvent<HTMLDivElement>) {
+    const nextTarget = event.relatedTarget;
+    if (nextTarget instanceof Node && event.currentTarget.contains(nextTarget)) return;
+    setAttachmentDragActive(false);
+  }
+
+  function handleAttachmentDrop(event: ReactDragEvent<HTMLDivElement>) {
+    setAttachmentDragActive(false);
+    const files = attachmentFiles(event.dataTransfer.files);
+    if (files.length === 0) return;
+    event.preventDefault();
+    if (attachmentBlocked) return;
+    void addAttachments(files);
+  }
+
+  function handleComposerCopy(event: ReactClipboardEvent<HTMLDivElement>) {
+    const editor = editorRef.current;
+    if (!editor) return;
+    const fragment = selectedComposerFragment(editor);
+    if (!fragment) return;
+    const skillsById = new Map((activeCatalog?.skills ?? []).map((skill) => [skill.id, skill]));
+    writeSkillFragmentToClipboard(event, fragment, skillsById);
+  }
+
+  function handleComposerCut(event: ReactClipboardEvent<HTMLDivElement>) {
+    const editor = editorRef.current;
+    if (!editor) return;
+    const fragment = selectedComposerFragment(editor);
+    if (!fragment) return;
+    const skillsById = new Map((activeCatalog?.skills ?? []).map((skill) => [skill.id, skill]));
+    if (!writeSkillFragmentToClipboard(event, fragment, skillsById)) return;
+
+    const range = fragment.range;
+    range.deleteContents();
+    range.collapse(true);
+    const { startContainer, startOffset } = range;
+    let sentinel: Text | null = null;
+    let sentinelOffset = 0;
+    if (startContainer.nodeType === Node.TEXT_NODE) {
+      const text = startContainer as Text;
+      if (text.data[startOffset] === "\u200B") {
+        sentinel = text;
+        sentinelOffset = startOffset;
+      } else if (
+        startOffset === text.length
+        && text.nextSibling?.nodeType === Node.TEXT_NODE
+        && (text.nextSibling as Text).data.startsWith("\u200B")
+      ) {
+        sentinel = text.nextSibling as Text;
+      }
+    } else if (
+      startContainer.nodeType === Node.ELEMENT_NODE
+      && startContainer.childNodes[startOffset]?.nodeType === Node.TEXT_NODE
+      && (startContainer.childNodes[startOffset] as Text).data.startsWith("\u200B")
+    ) {
+      sentinel = startContainer.childNodes[startOffset] as Text;
+    }
+    if (sentinel) {
+      sentinel.deleteData(sentinelOffset, 1);
+      if (!sentinel.data && sentinel !== startContainer) sentinel.remove();
+    }
+
+    syncComposerState();
+    const selection = editor.ownerDocument.getSelection();
+    selection?.removeAllRanges();
+    if (range.startContainer === editor || editor.contains(range.startContainer)) {
+      selection?.addRange(range);
+    } else {
+      const caret = editor.ownerDocument.createRange();
+      caret.selectNodeContents(editor);
+      caret.collapse(false);
+      selection?.addRange(caret);
+    }
+    setSkillMention(null);
+    skillMentionRangeRef.current = null;
+    editor.focus();
+  }
+
+  function handleComposerPaste(event: ReactClipboardEvent<HTMLDivElement>) {
+    if (attachmentBlocked) return;
+    const files = attachmentFiles(event.clipboardData.files);
+    event.preventDefault();
+    if (files.length > 0) {
+      void addAttachments(files);
+      return;
+    }
+    const skills = activeCatalog?.skills ?? [];
+    const skillsById = new Map(skills.map((skill) => [skill.id, skill]));
+    const internalFragment = parseAiChatComposerFragment(
+      event.clipboardData.getData(COMPOSER_FRAGMENT_MIME),
+      skillsById.keys(),
+    );
+    if (internalFragment && insertComposerFragment(internalFragment)) return;
+    const htmlFragment = composerFragmentFromHtml(
+      event.clipboardData.getData("text/html"),
+      skills,
+    );
+    if (htmlFragment && insertComposerFragment(htmlFragment)) return;
+    const clipboardText = event.clipboardData.getData("text/plain");
+    const plainFragment = composerFragmentFromPlainText(clipboardText, skills);
+    if (plainFragment && insertComposerFragment(plainFragment)) return;
+    const plainText = clipboardText.replaceAll(SKILL_MARKER, "\uFFFD");
+    if (plainText) insertComposerFragment({ message: plainText, skillIds: [] });
+  }
+
+  async function stopRun(run: AiChatRun | null) {
+    if (!run) return;
+    try {
+      await interruptAiChatRun(run.id);
+      if (selectedThreadRef.current === run.threadId) {
+        void selectedHintRefreshQueue.request(run.threadId);
+      }
+    } catch (nextError) {
+      if (selectedThreadRef.current === run.threadId) setError(messageFor(nextError));
+    }
+  }
+
+  function handleComposerKeyDown(event: ReactKeyboardEvent<HTMLDivElement>) {
+    if (event.nativeEvent.isComposing || event.keyCode === 229) return;
+    if (composerBlocked) return;
+    if (event.key === "Enter" && event.shiftKey) return;
+    if (event.key === "Backspace") {
+      const token = editorRef.current ? tokenBeforeComposerCaret(editorRef.current) : null;
+      if (token) {
+        event.preventDefault();
+        removeComposerSkillToken(token);
+        return;
+      }
+    }
+    if (skillMention && visibleSkills.length > 0 && event.key === "ArrowDown") {
+      event.preventDefault();
+      setSelectedSkillIndex((current) => (current + 1) % visibleSkills.length);
+      return;
+    }
+    if (skillMention && visibleSkills.length > 0 && event.key === "ArrowUp") {
+      event.preventDefault();
+      setSelectedSkillIndex((current) => (
+        (current - 1 + visibleSkills.length) % visibleSkills.length
+      ));
+      return;
+    }
+    if (event.key === "Enter" && skillMention && visibleSkills[selectedSkillIndex]) {
+      event.preventDefault();
+      selectSkill(visibleSkills[selectedSkillIndex]);
+      return;
+    }
+    if (event.key === "Enter") {
+      if (primaryAction === "stop") return;
+      event.preventDefault();
+      if (primaryAction === "send") void startMessage(draft, false);
+    }
+  }
+
+  if (!available) return null;
+
+  return (
+    <div
+      className={`ai-chat-root is-${launcherState}`}
+      onPointerDown={(event) => {
+        if (!(event.target as HTMLElement).closest(".ai-chat-menu-wrap")) setMenu(null);
+      }}
+    >
+      {panelOpen && (
+        <section
+          ref={panelRef}
+          className={`ai-chat-panel${panelResizeEdge ? ` is-resizing-${panelResizeEdge}` : ""}${panelMaximized ? " is-maximized" : ""}`}
+          style={panelMaximized ? undefined : panelGeometry ?? undefined}
+          aria-label="Codex AI 对话"
+          data-screen-label="Codex AI 对话"
+        >
+          <div
+            className="ai-chat-resize-handle is-top"
+            aria-hidden="true"
+            onPointerDown={(event) => startPanelResize(event, "top")}
+          />
+          <div
+            className="ai-chat-resize-handle is-left"
+            aria-hidden="true"
+            onPointerDown={(event) => startPanelResize(event, "left")}
+          />
+          <div
+            className="ai-chat-resize-handle is-top-left"
+            aria-hidden="true"
+            onPointerDown={(event) => startPanelResize(event, "top-left")}
+          />
+          <header className="ai-chat-panel-header">
+            <div className="ai-chat-panel-title">
+              <strong>{snapshot?.thread.title ?? "新对话"}</strong>
+              <span>{snapshot?.thread.origin.projectName ?? "选择对话或从当前项目新建"}</span>
+            </div>
+            <button
+              type="button"
+              aria-label="对话历史"
+              aria-pressed={historyOpen}
+              title="对话历史"
+              onClick={() => { setHistoryOpen((current) => !current); setMenu(null); }}
+            >
+              <LinearIcon name="conversation" />
+            </button>
+            <button
+              type="button"
+              aria-label="新建对话"
+              title={projectId ? "新建对话" : "请先进入项目"}
+              disabled={!projectId || loading}
+              onClick={beginNewConversation}
+            >
+              <LinearIcon name="plus" />
+            </button>
+            <button
+              className="ai-chat-resize-toggle"
+              type="button"
+              aria-label={panelMaximized ? "还原 AI 对话" : "放大 AI 对话"}
+              aria-pressed={panelMaximized}
+              title={panelMaximized ? "还原" : "放大"}
+              onClick={togglePanelSize}
+            >
+              <LinearIcon name={panelMaximized ? "panel" : "expand"} />
+            </button>
+            <button
+              type="button"
+              aria-label="缩小 AI 对话"
+              title="缩小"
+              onClick={() => {
+                restorePersistedConversationFromDraft();
+                setPanelMaximized(false);
+                setPanelOpen(false);
+              }}
+            >
+              <LinearIcon name="close" />
+            </button>
+          </header>
+
+          {historyOpen && (
+            <div className="ai-chat-history" aria-label="对话历史">
+              <div className="ai-chat-history-heading">
+                <strong>对话历史</strong>
+                <span>{threads.length}</span>
+              </div>
+              {threads.length > 0 ? threads.map((thread) => (
+                <div
+                  className={`ai-chat-history-row${thread.id === selectedThreadId ? " is-active" : ""}`}
+                  key={thread.id}
+                >
+                  <button
+                    type="button"
+                    onClick={() => {
+                      if (thread.id !== selectedThreadRef.current) resetComposer();
+                      draftReturnThreadIdRef.current = null;
+                      setDraftOrigin(null);
+                      selectThread(thread.id);
+                      setHistoryOpen(false);
+                    }}
+                  >
+                    <span className={`ai-chat-thread-status is-${thread.status}`} aria-hidden="true" />
+                    <span>
+                      <strong>{thread.title}</strong>
+                      <small>{thread.origin.projectName} · {dateLabel(thread.updatedAt)}</small>
+                    </span>
+                  </button>
+                  <button
+                    className="ai-chat-history-delete"
+                    type="button"
+                    aria-label={`删除对话 ${thread.title}`}
+                    title="删除本地记录"
+                    disabled={thread.status === "running" || deletingThreadId === thread.id}
+                    onClick={() => void deleteThread(thread)}
+                  >
+                    <LinearIcon name="trash" />
+                  </button>
+                </div>
+              )) : (
+                <p>还没有本地对话</p>
+              )}
+            </div>
+          )}
+
+          <div
+            className="ai-chat-messages"
+            ref={messagesRef}
+            aria-busy={loading}
+            aria-live="polite"
+          >
+            {loading && !snapshot ? (
+              <div className="ai-chat-empty"><span className="ai-chat-spinner" />正在恢复对话…</div>
+            ) : snapshot ? (
+              <>
+                <MessageTimeline
+                  activeRunId={currentRun?.id ?? null}
+                  events={snapshot.events}
+                  skills={activeCatalog?.skills ?? []}
+                />
+                {snapshot.thread.status === "running" && (
+                  <div className="ai-chat-running" role="status">
+                    <span className="ai-chat-spinner" />
+                    Codex 正在处理
+                  </div>
+                )}
+                {retryableUserEvent && (
+                  <button
+                    className="ai-chat-retry"
+                    type="button"
+                    onClick={() => {
+                      void startMessage(
+                        retryableUserEvent.content,
+                        false,
+                        eventSkillIds(retryableUserEvent),
+                        false,
+                        [],
+                      );
+                    }}
+                  >
+                    <LinearIcon name="recurrence" />
+                    重试上一条消息
+                  </button>
+                )}
+              </>
+            ) : (
+              <div className="ai-chat-empty">
+                <LinearIcon name="conversation" />
+                <strong>{projectId ? "在当前项目中开始对话" : "打开一个历史对话"}</strong>
+                <p>{projectId
+                  ? "Codex 会在新对话创建时记住当前项目。"
+                  : "进入项目后可以新建对话。"}</p>
+              </div>
+            )}
+          </div>
+
+          {(error || catalogError) && (
+            <div className="ai-chat-error" role="alert">
+              <LinearIcon name="alert" />
+              <span>{error ?? catalogError}</span>
+            </div>
+          )}
+
+          <div
+            className={`ai-chat-composer${attachmentDragActive ? " is-attachment-drag-active" : ""}`}
+            onDragEnter={handleAttachmentDragEnter}
+            onDragOver={handleAttachmentDragOver}
+            onDragLeave={handleAttachmentDragLeave}
+            onDrop={handleAttachmentDrop}
+          >
+            {attachmentDragActive && (
+              <div className="ai-chat-attachment-drop-hint" aria-hidden="true">
+                松开添加文件
+              </div>
+            )}
+            <div className="ai-chat-input-wrap">
+              {attachments.length > 0 && (
+                <div className="ai-chat-composer-attachments">
+                  {attachments.map((attachment) => (
+                    <div
+                      className={`ai-chat-composer-attachment${attachment.previewUrl ? "" : " is-file"}`}
+                      key={attachment.id}
+                    >
+                      {attachment.previewUrl
+                        ? <img src={attachment.previewUrl} alt="" />
+                        : (
+                          <span className="ai-chat-composer-file">
+                            <LinearIcon name="file" />
+                            <span>{attachment.filename}</span>
+                          </span>
+                        )}
+                      <button
+                        type="button"
+                        aria-label={`移除附件 ${attachment.filename}`}
+                        title="移除附件"
+                        onClick={() => {
+                          setAttachments((current) => current.filter((item) => item.id !== attachment.id));
+                        }}
+                      >
+                        <LinearIcon name="close" />
+                      </button>
+                    </div>
+                  ))}
+                </div>
+              )}
+              <div
+                ref={editorRef}
+                className="ai-chat-composer-editor"
+                contentEditable={!composerBlocked}
+                data-placeholder="询问 Codex"
+                role="textbox"
+                aria-label="发送给 Codex 的消息"
+                aria-multiline="true"
+                suppressContentEditableWarning
+                onBeforeInput={(event) => rememberComposerBeforeInput(event.nativeEvent as InputEvent)}
+                onInput={() => {
+                  syncComposerState();
+                  updateComposerSkillQuery(true);
+                }}
+                onClick={(event) => {
+                  const token = (event.target as HTMLElement).closest<HTMLElement>(
+                    ".ai-chat-composer-skill-token",
+                  );
+                  if (token && event.currentTarget.contains(token)) {
+                    removeComposerSkillToken(token);
+                    return;
+                  }
+                  updateComposerSkillQuery();
+                }}
+                onKeyDown={handleComposerKeyDown}
+                onKeyUp={(event) => {
+                  if (
+                    event.key === "ArrowLeft"
+                    || event.key === "ArrowRight"
+                    || event.key === "Home"
+                    || event.key === "End"
+                    || (!skillMention && (
+                      event.key === "ArrowUp"
+                      || event.key === "ArrowDown"
+                    ))
+                  ) updateComposerSkillQuery();
+                }}
+                onCompositionEnd={() => updateComposerSkillQuery()}
+                onBlur={() => setSkillMention(null)}
+                onCopy={handleComposerCopy}
+                onCut={handleComposerCut}
+                onPaste={handleComposerPaste}
+              />
+              {composerSkillTokens.map((token) => {
+                const skill = activeCatalog?.skills.find((candidate) => candidate.id === token.id);
+                return createPortal(
+                  <button
+                    type="button"
+                    aria-label={`移除 Skill ${skill ? skillDisplayName(skill) : token.id}`}
+                    onMouseDown={(event) => event.preventDefault()}
+                    onClick={() => removeComposerSkillToken(token.element)}
+                  >
+                    <SkillReference skill={skill} skillId={token.id} />
+                  </button>,
+                  token.element,
+                  token.key,
+                );
+              })}
+              {skillMention && visibleSkills.length > 0 && (
+                <div
+                  ref={skillMenuRef}
+                  className="ai-chat-skill-menu"
+                  role="listbox"
+                  aria-label="可用 Skill"
+                >
+                  {visibleSkills.map((skill, index) => (
+                    <button
+                      className={index === selectedSkillIndex ? "is-selected" : undefined}
+                      type="button"
+                      role="option"
+                      aria-selected={index === selectedSkillIndex}
+                      data-skill-index={index}
+                      key={skill.id}
+                      onPointerDown={(event) => event.preventDefault()}
+                      onPointerEnter={() => setSelectedSkillIndex(index)}
+                      onClick={() => selectSkill(skill)}
+                    >
+                      <LinearIcon name="project" />
+                      <span>
+                        <strong>{skillDisplayName(skill)}</strong>
+                        {skill.description && <small>{skill.description}</small>}
+                      </span>
+                    </button>
+                  ))}
+                </div>
+              )}
+            </div>
+
+            <div className="ai-chat-composer-toolbar">
+              <input
+                ref={attachmentInputRef}
+                className="ai-chat-attachment-input"
+                type="file"
+                multiple
+                tabIndex={-1}
+                onChange={(event) => void handleAttachmentSelection(event)}
+              />
+              <button
+                className="ai-chat-attachment-button"
+                type="button"
+                aria-label="添加附件"
+                title="添加附件"
+                disabled={attachmentBlocked}
+                onClick={() => attachmentInputRef.current?.click()}
+              >
+                <LinearIcon name="plus" />
+              </button>
+              <div className="ai-chat-menu-wrap ai-chat-permission-menu-wrap">
+                <button
+                  className="ai-chat-permission-trigger"
+                  type="button"
+                  aria-haspopup="menu"
+                  aria-expanded={menu === "sandbox"}
+                  disabled={
+                    !activeCatalog
+                    || snapshot?.thread.status === "running"
+                    || settingsSaving
+                    || threadSettingsBlocked
+                  }
+                  onClick={() => setMenu((current) => current === "sandbox" ? null : "sandbox")}
+                >
+                  <LinearIcon name={SANDBOX_ICONS[draftSandbox]} />
+                  {SANDBOX_LABELS[draftSandbox]}
+                  <LinearIcon name="chevronDown" />
+                </button>
+                {menu === "sandbox" && (
+                  <div className="ai-chat-option-menu ai-chat-permission-menu" role="menu" aria-label="执行权限">
+                    <header>
+                      <span>应如何批准 Codex 操作？</span>
+                      <a
+                        href="https://developers.openai.com/codex/security"
+                        target="_blank"
+                        rel="noreferrer"
+                      >
+                        了解更多
+                      </a>
+                    </header>
+                    {availableSandboxes.map((sandbox) => (
+                      <button
+                        className={sandbox === "danger-full-access" ? "is-danger" : undefined}
+                        type="button"
+                        role="menuitemradio"
+                        aria-checked={sandbox === draftSandbox}
+                        key={sandbox}
+                        onClick={() => void chooseSandbox(sandbox)}
+                      >
+                        <LinearIcon name={SANDBOX_ICONS[sandbox]} />
+                        <span>
+                          <strong>{SANDBOX_LABELS[sandbox]}</strong>
+                          <small>{SANDBOX_DESCRIPTIONS[sandbox]}</small>
+                        </span>
+                        {sandbox === draftSandbox && <LinearIcon name="check" />}
+                      </button>
+                    ))}
+                  </div>
+                )}
+              </div>
+
+              <span className="ai-chat-toolbar-spacer" />
+              <div className="ai-chat-menu-wrap ai-chat-model-menu-wrap">
+                <button
+                  className="ai-chat-model-trigger"
+                  type="button"
+                  aria-haspopup="menu"
+                  aria-expanded={menu === "model" || menu === "model-list" || menu === "effort-list"}
+                  disabled={
+                    !activeCatalog
+                    || snapshot?.thread.status === "running"
+                    || settingsSaving
+                    || threadSettingsBlocked
+                  }
+                  onClick={() => setMenu((current) => (
+                    current === "model" || current === "model-list" || current === "effort-list"
+                      ? null
+                      : "model"
+                  ))}
+                >
+                  <span>{modelDisplayName(selectedModel?.displayName ?? (draftModel || "模型"))}</span>
+                  <span className="ai-chat-model-effort">
+                    {EFFORT_LABELS[draftEffort] ?? (draftEffort || "推理")}
+                  </span>
+                  <LinearIcon name="chevronDown" />
+                </button>
+                {menu === "model" && (
+                  <div className="ai-chat-option-menu ai-chat-config-menu" role="menu" aria-label="模型与推理强度">
+                    <button type="button" onClick={() => setMenu("model-list")}>
+                      <span>模型</span>
+                      <strong>{modelDisplayName(selectedModel?.displayName ?? draftModel)}</strong>
+                      <LinearIcon name="chevronRight" />
+                    </button>
+                    <button type="button" onClick={() => setMenu("effort-list")}>
+                      <span>推理强度</span>
+                      <strong>{EFFORT_LABELS[draftEffort] ?? draftEffort}</strong>
+                      <LinearIcon name="chevronRight" />
+                    </button>
+                  </div>
+                )}
+                {menu === "model-list" && (
+                  <div className="ai-chat-option-menu ai-chat-config-menu ai-chat-config-submenu ai-chat-model-list" role="menu" aria-label="选择模型">
+                    <header>
+                      <button type="button" aria-label="返回模型与推理强度" onClick={() => setMenu("model")}>
+                        <LinearIcon name="chevronLeft" />
+                      </button>
+                      <strong>模型</strong>
+                    </header>
+                    {(activeCatalog?.models ?? []).map((model) => (
+                      <button
+                        type="button"
+                        role="menuitemradio"
+                        aria-checked={model.slug === draftModel}
+                        key={model.slug}
+                        onClick={() => void chooseModel(model)}
+                      >
+                        <span>
+                          <strong>{modelDisplayName(model.displayName)}</strong>
+                        </span>
+                        {model.slug === draftModel && <LinearIcon name="check" />}
+                      </button>
+                    ))}
+                  </div>
+                )}
+                {menu === "effort-list" && selectedModel && (
+                  <div className="ai-chat-option-menu ai-chat-config-menu ai-chat-config-submenu" role="menu" aria-label="选择推理强度">
+                    <header>
+                      <button type="button" aria-label="返回模型与推理强度" onClick={() => setMenu("model")}>
+                        <LinearIcon name="chevronLeft" />
+                      </button>
+                      <strong>推理强度</strong>
+                    </header>
+                    {selectedModel.supportedReasoningEfforts.map((effort) => (
+                      <button
+                        type="button"
+                        role="menuitemradio"
+                        aria-checked={effort === draftEffort}
+                        key={effort}
+                        onClick={() => void chooseEffort(effort)}
+                      >
+                        <span>{EFFORT_LABELS[effort] ?? effort}</span>
+                        {effort === draftEffort && <LinearIcon name="check" />}
+                      </button>
+                    ))}
+                  </div>
+                )}
+              </div>
+
+              {primaryAction === "stop" ? (
+                <button
+                  className="ai-chat-send-button is-stop"
+                  type="button"
+                  aria-label="停止生成"
+                  title="停止"
+                  onClick={() => void stopRun(currentRun)}
+                >
+                  <span className="ai-chat-stop-mark" aria-hidden="true" />
+                </button>
+              ) : (
+                <button
+                  className="ai-chat-send-button"
+                  type="button"
+                  aria-label="发送消息"
+                  title="发送"
+                  disabled={
+                    primaryAction === "disabled"
+                    || loading
+                    || settingsSaving
+                    || Boolean(catalogError)
+                  }
+                  onClick={() => void startMessage(draft, false)}
+                >
+                  <LinearIcon name="send" />
+                </button>
+              )}
+            </div>
+          </div>
+
+          {dangerConfirmOpen && (
+            <div className="ai-chat-confirm-backdrop">
+              <div className="ai-chat-confirm" role="alertdialog" aria-modal="true" aria-labelledby="ai-chat-confirm-title">
+                <strong id="ai-chat-confirm-title">允许完全访问？</strong>
+                <p>本次消息允许 Codex 访问工作区之外的文件和命令。确认只对本次发送生效。</p>
+                <div>
+                  <button type="button" onClick={() => setPendingDangerInput(null)}>取消</button>
+                  <button
+                    className="is-danger"
+                    type="button"
+                    onClick={() => {
+                      if (!pendingDangerInput) return;
+                      void startMessage(
+                        pendingDangerInput.message,
+                        true,
+                        pendingDangerInput.skillIds,
+                        pendingDangerInput.clearSubmittedDraft,
+                        pendingDangerInput.attachments,
+                      );
+                    }}
+                  >
+                    允许并发送
+                  </button>
+                </div>
+              </div>
+            </div>
+          )}
+        </section>
+      )}
+
+      {!panelOpen && (
+        <button
+          type="button"
+          className={`ai-chat-launcher is-${launcherState}`}
+          aria-label="打开 AI 对话"
+          aria-expanded="false"
+          title="AI 对话"
+          onClick={() => setPanelOpen(true)}
+        >
+          <LinearIcon name="conversation" />
+          {launcherState !== "idle" && <span className="ai-chat-launcher-state" aria-hidden="true" />}
+        </button>
+      )}
+    </div>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/ArchivedIssues.tsx b/apps/codex-taskboard/web/src/components/ArchivedIssues.tsx
new file mode 100644
index 000000000..4685f0389
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/ArchivedIssues.tsx
@@ -0,0 +1,130 @@
+import type { Task, TaskPriority } from "../types";
+import { STATUS_DETAILS } from "./BoardColumn";
+import { LinearIcon, LinearPriorityIcon, LinearStatusIcon } from "./LinearIcon";
+
+const PRIORITY_LABELS: Record<TaskPriority, string> = {
+  none: "无优先级",
+  urgent: "紧急",
+  high: "高优先级",
+  medium: "中优先级",
+  low: "低优先级",
+};
+
+const archiveDateFormatter = new Intl.DateTimeFormat("zh-CN", {
+  month: "short",
+  day: "numeric",
+  hour: "2-digit",
+  minute: "2-digit",
+});
+
+interface ArchivedIssuesProps {
+  tasks: Task[];
+  totalTasks: number;
+  hasQuery: boolean;
+  restoringTaskId: string | null;
+  deletingTaskId: string | null;
+  onClearQuery: () => void;
+  onOpenTask: (task: Task) => void;
+  onRestore: (task: Task) => void;
+  onRequestDelete: (task: Task) => void;
+}
+
+function archivedAtLabel(task: Task) {
+  return task.archivedAt
+    ? archiveDateFormatter.format(new Date(task.archivedAt))
+    : "未知时间";
+}
+
+export function ArchivedIssues({
+  tasks,
+  totalTasks,
+  hasQuery,
+  restoringTaskId,
+  deletingTaskId,
+  onClearQuery,
+  onOpenTask,
+  onRestore,
+  onRequestDelete,
+}: ArchivedIssuesProps) {
+  if (totalTasks === 0) {
+    return (
+      <section className="page-empty archive-empty">
+        <span className="empty-search" aria-hidden="true"><LinearIcon name="folder" /></span>
+        <h2>没有已归档任务</h2>
+        <p>归档任务会在这里集中显示，可以恢复，也可以永久删除。</p>
+      </section>
+    );
+  }
+
+  if (tasks.length === 0 && hasQuery) {
+    return (
+      <section className="page-empty archive-empty">
+        <span className="empty-search" aria-hidden="true"><LinearIcon name="search" /></span>
+        <h2>没有匹配的归档任务</h2>
+        <p>请更换搜索词，或移除一个筛选条件。</p>
+        <button className="button secondary" type="button" onClick={onClearQuery}>
+          清除筛选
+        </button>
+      </section>
+    );
+  }
+
+  return (
+    <section className="archive-view" aria-label="已归档任务">
+      <div className="archive-view-heading">
+        <div>
+          <span>归档箱</span>
+          <h2>已归档任务</h2>
+        </div>
+        <strong>{tasks.length}/{totalTasks}</strong>
+      </div>
+      <div className="archive-list">
+        {tasks.map((task) => (
+          <article className="archived-issue-row" key={task.id}>
+            <div className="archived-issue-main">
+              <button
+                className="archived-issue-title"
+                type="button"
+                onClick={() => onOpenTask(task)}
+              >
+                <span>{task.identifier}</span>
+                {task.title}
+              </button>
+              <div className="archived-issue-meta" aria-label="任务属性">
+                <span className={`archive-status-chip status-${task.status}`}>
+                  <LinearStatusIcon status={task.status} />
+                  {STATUS_DETAILS[task.status].label}
+                </span>
+                <span className={`archive-priority-chip priority-${task.priority}`} title={PRIORITY_LABELS[task.priority]}>
+                  <LinearPriorityIcon priority={task.priority} />
+                  {PRIORITY_LABELS[task.priority]}
+                </span>
+                <span>归档于 {archivedAtLabel(task)}</span>
+              </div>
+            </div>
+            <div className="archived-issue-actions">
+              <button
+                className="button secondary"
+                type="button"
+                disabled={restoringTaskId === task.id || deletingTaskId === task.id}
+                onClick={() => onRestore(task)}
+              >
+                <LinearIcon name="recurrence" />
+                {restoringTaskId === task.id ? "恢复中..." : "恢复"}
+              </button>
+              <button
+                className="button danger"
+                type="button"
+                disabled={restoringTaskId === task.id || deletingTaskId === task.id}
+                onClick={() => onRequestDelete(task)}
+              >
+                <LinearIcon name="trash" />
+                永久删除
+              </button>
+            </div>
+          </article>
+        ))}
+      </div>
+    </section>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/BoardColumn.tsx b/apps/codex-taskboard/web/src/components/BoardColumn.tsx
new file mode 100644
index 000000000..387249d85
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/BoardColumn.tsx
@@ -0,0 +1,365 @@
+import { useEffect, useMemo, useState } from "react";
+import type { DragEvent } from "react";
+import {
+  countTaskDescendants,
+  createTaskLookup,
+  getAncestorTrail,
+  type HierarchyTrailItem,
+} from "../taskHierarchy";
+import type { Task, TaskStatus } from "../types";
+import { ColumnVisibilityMenu } from "./ColumnVisibilityMenu";
+import { LinearIcon, LinearStatusIcon } from "./LinearIcon";
+import { TaskCard } from "./TaskCard";
+
+export const STATUS_DETAILS: Record<
+  TaskStatus,
+  { label: string; tone: string }
+> = {
+  backlog: { label: "积压事项", tone: "backlog" },
+  todo: { label: "待办事项", tone: "todo" },
+  in_progress: { label: "进行中", tone: "progress" },
+  in_review: { label: "审核中", tone: "review" },
+  blocked: { label: "已阻塞", tone: "blocked" },
+  done: { label: "完成", tone: "done" },
+  canceled: { label: "已取消", tone: "canceled" },
+};
+
+export function StatusIcon({ status }: { status: TaskStatus }) {
+  return <LinearStatusIcon status={status} />;
+}
+
+interface BoardColumnProps {
+  status: TaskStatus;
+  statusIndex: number;
+  tasks: Task[];
+  allTasks: Task[];
+  isDropTarget: boolean;
+  draggedTaskId: string | null;
+  draggedTaskIds: readonly string[];
+  selectedTaskIds: readonly string[];
+  draggedTaskHeight: number;
+  movingTaskId: string | null;
+  settlingTaskId: string | null;
+  contextMenuTaskId: string | null;
+  onCreate: (status: TaskStatus) => void;
+  onEdit: (task: Task) => void;
+  onSelectionChange: (task: Task, selected: boolean) => void;
+  onContextMenu: (task: Task, position: { x: number; y: number }) => void;
+  onMove: (task: Task, status: TaskStatus) => void;
+  onDragStart: (task: Task, height: number) => void;
+  onDragEnd: () => void;
+  onDragEnter: (status: TaskStatus) => void;
+  onDrop: (status: TaskStatus, taskId: string, beforeTaskId: string | null) => void;
+  onOpenThread: (threadId: string, workspacePath?: string, threadTitle?: string) => void;
+  onHide: (status: TaskStatus) => void;
+}
+
+interface BoardTaskView {
+  task: Task;
+  trail: HierarchyTrailItem[];
+  depth: number;
+  descendantCount: number;
+}
+
+interface BoardTaskGroup {
+  id: string;
+  root: HierarchyTrailItem;
+  rootTask: Task | null;
+  items: BoardTaskView[];
+  order: number;
+}
+
+type BoardColumnEntry =
+  | { kind: "group"; key: string; group: BoardTaskGroup; order: number }
+  | { kind: "task"; key: string; item: BoardTaskView; order: number };
+
+function orderGroupItems(
+  items: BoardTaskView[],
+  orderById: ReadonlyMap<string, number>,
+) {
+  const itemById = new Map(items.map((item) => [item.task.id, item]));
+  const childrenByParentId = new Map<string, BoardTaskView[]>();
+  const roots: BoardTaskView[] = [];
+
+  for (const item of items) {
+    const parentId = item.task.relations.parent?.id;
+    if (parentId && itemById.has(parentId)) {
+      const children = childrenByParentId.get(parentId) ?? [];
+      children.push(item);
+      childrenByParentId.set(parentId, children);
+    } else {
+      roots.push(item);
+    }
+  }
+
+  const compareByColumnOrder = (a: BoardTaskView, b: BoardTaskView) => (
+    (orderById.get(a.task.id) ?? 0) - (orderById.get(b.task.id) ?? 0)
+  );
+  roots.sort(compareByColumnOrder);
+  for (const children of childrenByParentId.values()) children.sort(compareByColumnOrder);
+
+  const ordered: BoardTaskView[] = [];
+  const visited = new Set<string>();
+
+  function visit(item: BoardTaskView) {
+    if (visited.has(item.task.id)) return;
+    visited.add(item.task.id);
+    ordered.push(item);
+    for (const child of childrenByParentId.get(item.task.id) ?? []) visit(child);
+  }
+
+  for (const root of roots) visit(root);
+  for (const item of items.sort(compareByColumnOrder)) visit(item);
+
+  return ordered;
+}
+
+function buildColumnEntries(tasks: Task[], allTasks: Task[]) {
+  const taskById = createTaskLookup(allTasks);
+  const orderById = new Map(tasks.map((task, index) => [task.id, index]));
+  const groups = new Map<string, BoardTaskGroup>();
+  const entries: BoardColumnEntry[] = [];
+
+  for (const task of tasks) {
+    const trail = getAncestorTrail(task, taskById);
+    const descendantCount = countTaskDescendants(task, taskById);
+    const item: BoardTaskView = {
+      task,
+      trail,
+      depth: trail.length,
+      descendantCount,
+    };
+    const hasHierarchy = trail.length > 0 || descendantCount > 0 || task.relations.parent !== null;
+
+    if (!hasHierarchy) {
+      entries.push({ kind: "task", key: task.id, item, order: orderById.get(task.id) ?? 0 });
+      continue;
+    }
+
+    const root = trail[0] ?? task;
+    const group = groups.get(root.id) ?? {
+      id: root.id,
+      root,
+      rootTask: taskById.get(root.id) ?? null,
+      items: [],
+      order: orderById.get(task.id) ?? 0,
+    };
+    group.items.push(item);
+    group.order = Math.min(group.order, orderById.get(task.id) ?? group.order);
+    groups.set(root.id, group);
+  }
+
+  for (const group of groups.values()) {
+    group.items = orderGroupItems(group.items, orderById);
+    entries.push({ kind: "group", key: `group-${group.id}`, group, order: group.order });
+  }
+
+  entries.sort((a, b) => a.order - b.order);
+  const orderedTasks = entries.flatMap((entry) => (
+    entry.kind === "group"
+      ? entry.group.items.map((item) => item.task)
+      : [entry.item.task]
+  ));
+
+  return { entries, orderedTasks };
+}
+
+export function BoardColumn({
+  status,
+  statusIndex,
+  tasks,
+  allTasks,
+  isDropTarget,
+  draggedTaskId,
+  draggedTaskIds,
+  selectedTaskIds,
+  draggedTaskHeight,
+  movingTaskId,
+  settlingTaskId,
+  contextMenuTaskId,
+  onCreate,
+  onEdit,
+  onSelectionChange,
+  onContextMenu,
+  onMove,
+  onDragStart,
+  onDragEnd,
+  onDragEnter,
+  onDrop,
+  onOpenThread,
+  onHide,
+}: BoardColumnProps) {
+  const details = STATUS_DETAILS[status];
+  const [dropBeforeTaskId, setDropBeforeTaskId] = useState<string | null | undefined>();
+  const { entries, orderedTasks } = useMemo(
+    () => buildColumnEntries(tasks, allTasks),
+    [allTasks, tasks],
+  );
+  const activeDraggedTaskIds = draggedTaskIds.length > 0 ? draggedTaskIds : draggedTaskId ? [draggedTaskId] : [];
+  const draggedTaskIdSet = new Set(activeDraggedTaskIds);
+  const selectedTaskIdSet = new Set(selectedTaskIds);
+  const taskIndexes = new Map(orderedTasks.map((task, index) => [task.id, index]));
+  const remainingTasks = orderedTasks.filter((task) => !draggedTaskIdSet.has(task.id));
+  const remainingIndexes = new Map(remainingTasks.map((task, index) => [task.id, index]));
+  const beforeIndex = dropBeforeTaskId
+    ? remainingIndexes.get(dropBeforeTaskId) ?? remainingTasks.length
+    : remainingTasks.length;
+  const previewIndex = isDropTarget && dropBeforeTaskId !== undefined ? beforeIndex : -1;
+  const dragDistance = draggedTaskHeight + 8;
+  const draggedGroupSize = Math.max(1, activeDraggedTaskIds.length);
+
+  useEffect(() => {
+    if (!isDropTarget || !draggedTaskId) setDropBeforeTaskId(undefined);
+  }, [draggedTaskId, isDropTarget]);
+
+  function findDropBefore(container: HTMLElement, clientY: number): string | null {
+    const cards = Array.from(container.querySelectorAll<HTMLElement>("[data-task-id]"))
+      .filter((card) => !draggedTaskIdSet.has(card.dataset.taskId ?? ""));
+    return cards.find((card) => clientY < card.getBoundingClientRect().top + card.offsetHeight / 2)
+      ?.dataset.taskId ?? null;
+  }
+
+  function handleDrop(event: DragEvent<HTMLElement>) {
+    event.preventDefault();
+    const taskId =
+      event.dataTransfer.getData("application/x-taskboard-task") ||
+      event.dataTransfer.getData("text/plain");
+    if (taskId) onDrop(status, taskId, findDropBefore(event.currentTarget, event.clientY));
+    setDropBeforeTaskId(undefined);
+  }
+
+  function getTaskDragShift(task: Task): number {
+    if (!draggedTaskId || draggedTaskIdSet.has(task.id)) return 0;
+    let shift = 0;
+    const taskIndex = taskIndexes.get(task.id) ?? -1;
+    const remainingIndex = remainingIndexes.get(task.id) ?? -1;
+    const removedBeforeCount = taskIndex < 0
+      ? 0
+      : orderedTasks.slice(0, taskIndex).filter((candidate) => draggedTaskIdSet.has(candidate.id)).length;
+
+    for (let index = 0; index < removedBeforeCount; index += 1) shift -= dragDistance;
+    if (previewIndex >= 0 && remainingIndex >= previewIndex) {
+      for (let index = 0; index < draggedGroupSize; index += 1) shift += dragDistance;
+    }
+    return shift;
+  }
+
+  function renderTaskCard(item: BoardTaskView) {
+    const task = item.task;
+    const dragShift = getTaskDragShift(task);
+    return (
+      <TaskCard
+        key={task.id}
+        task={task}
+        statusIndex={statusIndex}
+        hierarchyDepth={item.depth}
+        parentTrail={item.trail}
+        descendantCount={item.descendantCount}
+        isDragging={draggedTaskIdSet.has(task.id)}
+        isSelected={selectedTaskIdSet.has(task.id)}
+        dragShift={dragShift}
+        isMoving={movingTaskId === task.id}
+        isSettling={settlingTaskId === task.id}
+        isContextMenuOpen={contextMenuTaskId === task.id}
+        onEdit={onEdit}
+        onSelectionChange={onSelectionChange}
+        onContextMenu={onContextMenu}
+        onMove={onMove}
+        onDragStart={onDragStart}
+        onDragEnd={onDragEnd}
+        onOpenThread={onOpenThread}
+      />
+    );
+  }
+
+  return (
+    <section
+      className={`board-column status-${status}${isDropTarget ? " is-drop-target" : ""}`}
+      aria-labelledby={`column-${status}`}
+      onDragEnter={() => onDragEnter(status)}
+      onDragOver={(event) => {
+        event.preventDefault();
+        event.dataTransfer.dropEffect = "move";
+        onDragEnter(status);
+        setDropBeforeTaskId(findDropBefore(event.currentTarget, event.clientY));
+      }}
+      onDragLeave={(event) => {
+        if (!(event.relatedTarget instanceof Node) || !event.currentTarget.contains(event.relatedTarget)) {
+          setDropBeforeTaskId(undefined);
+        }
+      }}
+      onDrop={handleDrop}
+    >
+      <header className="column-header">
+        <div className="column-heading">
+          <span className={`status-icon status-icon-${details.tone}`}>
+            <StatusIcon status={status} />
+          </span>
+          <h2 id={`column-${status}`}>{details.label}</h2>
+          <span className="task-count" aria-label={`${tasks.length} 个任务`}>{tasks.length}</span>
+        </div>
+        <div className="column-actions">
+          {tasks.length > 0 && (
+            <ColumnVisibilityMenu
+              label={details.label}
+              action="hide"
+              className="icon-button column-menu"
+              onAction={() => onHide(status)}
+            />
+          )}
+          <button
+            type="button"
+            className="icon-button add-task-button"
+            onClick={() => onCreate(status)}
+            aria-label={`在${details.label}中新建任务`}
+            title={`添加到${details.label}`}
+          >
+            <LinearIcon name="plus" />
+          </button>
+        </div>
+      </header>
+
+      <div className={`column-list${entries.some((entry) => entry.kind === "group") ? " has-hierarchy-groups" : ""}`}>
+        {entries.map((entry) => {
+          if (entry.kind === "task") return renderTaskCard(entry.item);
+          const { group } = entry;
+          const maxDepth = Math.max(...group.items.map((item) => item.depth), 0);
+          const groupRoot = (
+            <>
+              <span className="board-task-group-icon" aria-hidden="true">
+                <LinearIcon name="branch" />
+              </span>
+              <span className="board-task-group-id">{group.root.identifier}</span>
+              <span className="board-task-group-title" title={group.root.title}>{group.root.title}</span>
+              <span className="board-task-group-root-status" title={STATUS_DETAILS[group.root.status].label}>
+                <LinearStatusIcon status={group.root.status} />
+              </span>
+            </>
+          );
+          return (
+            <section className="board-task-group" key={entry.key} aria-label={`${group.root.identifier} 子任务`}>
+              <header className="board-task-group-header">
+                {group.rootTask ? (
+                  <button
+                    className="board-task-group-root"
+                    type="button"
+                    onClick={() => onEdit(group.rootTask!)}
+                  >
+                    {groupRoot}
+                  </button>
+                ) : (
+                  <div className="board-task-group-root">{groupRoot}</div>
+                )}
+                <span className="board-task-group-count">{group.items.length}</span>
+                {maxDepth > 1 && <span className="board-task-group-depth">{maxDepth + 1}层</span>}
+              </header>
+              <div className="board-task-group-list">
+                {group.items.map(renderTaskCard)}
+              </div>
+            </section>
+          );
+        })}
+      </div>
+    </section>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/BoardSettingsMenu.tsx b/apps/codex-taskboard/web/src/components/BoardSettingsMenu.tsx
new file mode 100644
index 000000000..cbe8c2b62
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/BoardSettingsMenu.tsx
@@ -0,0 +1,133 @@
+import { useEffect, useLayoutEffect, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import { LinearIcon } from "./LinearIcon";
+
+interface BoardSettingsMenuProps {
+  showEmptyColumns: boolean;
+  onShowEmptyColumnsChange: (show: boolean) => void;
+}
+
+export function BoardSettingsMenu({
+  showEmptyColumns,
+  onShowEmptyColumnsChange,
+}: BoardSettingsMenuProps) {
+  const triggerRef = useRef<HTMLButtonElement>(null);
+  const menuRef = useRef<HTMLDivElement>(null);
+  const [open, setOpen] = useState(false);
+  const [position, setPosition] = useState({ left: 0, top: 0, ready: false });
+
+  useLayoutEffect(() => {
+    if (!open || !triggerRef.current || !menuRef.current) return;
+    const trigger = triggerRef.current.getBoundingClientRect();
+    const menu = menuRef.current.getBoundingClientRect();
+    const left = Math.max(8, Math.min(trigger.right - menu.width, window.innerWidth - menu.width - 8));
+    const top = trigger.bottom + 8 + menu.height <= window.innerHeight
+      ? trigger.bottom + 8
+      : Math.max(8, trigger.top - menu.height - 8);
+    setPosition({ left, top, ready: true });
+  }, [open]);
+
+  useEffect(() => {
+    if (!open) return;
+    requestAnimationFrame(() => menuRef.current?.querySelector<HTMLButtonElement>("[role='switch']")?.focus());
+
+    function closeFromOutside(event: PointerEvent) {
+      if (
+        !menuRef.current?.contains(event.target as Node)
+        && !triggerRef.current?.contains(event.target as Node)
+      ) {
+        setOpen(false);
+      }
+    }
+
+    function closeFromViewportChange() {
+      setOpen(false);
+    }
+
+    function closeFromEscape(event: KeyboardEvent) {
+      if (event.key === "Escape") {
+        setOpen(false);
+        triggerRef.current?.focus();
+      }
+    }
+
+    document.addEventListener("pointerdown", closeFromOutside);
+    document.addEventListener("keydown", closeFromEscape);
+    window.addEventListener("blur", closeFromViewportChange);
+    window.addEventListener("resize", closeFromViewportChange);
+    window.addEventListener("scroll", closeFromViewportChange, true);
+    return () => {
+      document.removeEventListener("pointerdown", closeFromOutside);
+      document.removeEventListener("keydown", closeFromEscape);
+      window.removeEventListener("blur", closeFromViewportChange);
+      window.removeEventListener("resize", closeFromViewportChange);
+      window.removeEventListener("scroll", closeFromViewportChange, true);
+    };
+  }, [open]);
+
+  const menu = open ? createPortal(
+    <div
+      ref={menuRef}
+      className="board-settings-menu"
+      role="dialog"
+      aria-label="看板设置"
+      style={{
+        left: position.left,
+        top: position.top,
+        visibility: position.ready ? "visible" : "hidden",
+      }}
+      onKeyDown={(event) => {
+        if (event.key === "Tab") {
+          event.preventDefault();
+          const switches = [...(menuRef.current?.querySelectorAll<HTMLButtonElement>("[role='switch']") ?? [])]
+            .filter((button) => !button.disabled);
+          const currentIndex = switches.indexOf(document.activeElement as HTMLButtonElement);
+          const offset = event.shiftKey ? -1 : 1;
+          switches[(currentIndex + offset + switches.length) % switches.length]?.focus();
+        }
+      }}
+    >
+      <section className="board-settings-section" aria-labelledby="board-options-heading">
+        <h2 id="board-options-heading">看板选项</h2>
+        <div className="board-setting-row">
+          <span>显示空列</span>
+          <button
+            type="button"
+            className={`board-setting-switch${showEmptyColumns ? " is-on" : ""}`}
+            role="switch"
+            aria-checked={showEmptyColumns}
+            onClick={() => onShowEmptyColumnsChange(!showEmptyColumns)}
+          >
+            <span aria-hidden="true" />
+            <span className="sr-only">{showEmptyColumns ? "关闭显示空列" : "开启显示空列"}</span>
+          </button>
+        </div>
+      </section>
+    </div>,
+    document.body,
+  ) : null;
+
+  return (
+    <>
+      <button
+        ref={triggerRef}
+        type="button"
+        className={`board-settings-trigger${open ? " is-open" : ""}${showEmptyColumns ? " is-active" : ""}`}
+        aria-label="看板设置"
+        aria-haspopup="dialog"
+        aria-expanded={open}
+        title="看板设置"
+        onClick={() => {
+          if (!open) {
+            setPosition((current) => ({ ...current, ready: false }));
+          }
+          setOpen((current) => !current);
+        }}
+      >
+        <LinearIcon name="displayOptions" />
+        {showEmptyColumns && <span className="board-settings-active-dot" aria-hidden="true" />}
+      </button>
+      {menu}
+    </>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/ColumnVisibilityMenu.tsx b/apps/codex-taskboard/web/src/components/ColumnVisibilityMenu.tsx
new file mode 100644
index 000000000..81c86f2a7
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/ColumnVisibilityMenu.tsx
@@ -0,0 +1,126 @@
+import { useEffect, useLayoutEffect, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import { LinearIcon } from "./LinearIcon";
+
+interface ColumnVisibilityMenuProps {
+  label: string;
+  action: "hide" | "show";
+  className: string;
+  onAction: () => void;
+}
+
+export function ColumnVisibilityMenu({
+  label,
+  action,
+  className,
+  onAction,
+}: ColumnVisibilityMenuProps) {
+  const triggerRef = useRef<HTMLButtonElement>(null);
+  const menuRef = useRef<HTMLDivElement>(null);
+  const [open, setOpen] = useState(false);
+  const [position, setPosition] = useState({ left: 0, top: 0, ready: false });
+  const actionLabel = action === "hide" ? "隐藏列" : "显示列";
+
+  useLayoutEffect(() => {
+    if (!open || !triggerRef.current || !menuRef.current) return;
+    const trigger = triggerRef.current.getBoundingClientRect();
+    const menu = menuRef.current.getBoundingClientRect();
+    const left = Math.max(8, Math.min(trigger.right - menu.width, window.innerWidth - menu.width - 8));
+    const top = trigger.bottom + 6 + menu.height <= window.innerHeight
+      ? trigger.bottom + 6
+      : Math.max(8, trigger.top - menu.height - 6);
+    setPosition({ left, top, ready: true });
+  }, [open]);
+
+  useEffect(() => {
+    if (!open) return;
+    requestAnimationFrame(() => menuRef.current?.querySelector<HTMLButtonElement>("[role='menuitem']")?.focus());
+
+    function closeFromOutside(event: PointerEvent) {
+      if (
+        !menuRef.current?.contains(event.target as Node)
+        && !triggerRef.current?.contains(event.target as Node)
+      ) {
+        setOpen(false);
+      }
+    }
+
+    function closeFromViewportChange() {
+      setOpen(false);
+    }
+
+    function closeFromEscape(event: KeyboardEvent) {
+      if (event.key === "Escape") {
+        setOpen(false);
+        triggerRef.current?.focus();
+      }
+    }
+
+    document.addEventListener("pointerdown", closeFromOutside);
+    document.addEventListener("keydown", closeFromEscape);
+    window.addEventListener("blur", closeFromViewportChange);
+    window.addEventListener("resize", closeFromViewportChange);
+    window.addEventListener("scroll", closeFromViewportChange, true);
+    return () => {
+      document.removeEventListener("pointerdown", closeFromOutside);
+      document.removeEventListener("keydown", closeFromEscape);
+      window.removeEventListener("blur", closeFromViewportChange);
+      window.removeEventListener("resize", closeFromViewportChange);
+      window.removeEventListener("scroll", closeFromViewportChange, true);
+    };
+  }, [open]);
+
+  const menu = open ? createPortal(
+    <div
+      ref={menuRef}
+      className="task-context-menu column-visibility-menu"
+      role="menu"
+      aria-label={`${label}列选项`}
+      style={{
+        left: position.left,
+        top: position.top,
+        visibility: position.ready ? "visible" : "hidden",
+      }}
+      onKeyDown={(event) => {
+        if (event.key === "Tab") {
+          event.preventDefault();
+          menuRef.current?.querySelector<HTMLButtonElement>("[role='menuitem']")?.focus();
+        }
+      }}
+    >
+      <button
+        type="button"
+        className="context-menu-item column-visibility-action"
+        role="menuitem"
+        onClick={() => {
+          setOpen(false);
+          onAction();
+        }}
+      >
+        <span className="context-menu-label">{actionLabel}</span>
+      </button>
+    </div>,
+    document.body,
+  ) : null;
+
+  return (
+    <>
+      <button
+        ref={triggerRef}
+        type="button"
+        className={`${className}${open ? " is-open" : ""}`}
+        aria-label={`${label}选项`}
+        aria-haspopup="menu"
+        aria-expanded={open}
+        title="选项"
+        onClick={() => {
+          if (!open) setPosition((current) => ({ ...current, ready: false }));
+          setOpen((current) => !current);
+        }}
+      >
+        <LinearIcon name="more" />
+      </button>
+      {menu}
+    </>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/HiddenColumns.tsx b/apps/codex-taskboard/web/src/components/HiddenColumns.tsx
new file mode 100644
index 000000000..19e1e2a22
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/HiddenColumns.tsx
@@ -0,0 +1,107 @@
+import { useState, type DragEvent } from "react";
+import type { TaskStatus } from "../types";
+import { STATUS_DETAILS, StatusIcon } from "./BoardColumn";
+import { ColumnVisibilityMenu } from "./ColumnVisibilityMenu";
+import { LinearIcon } from "./LinearIcon";
+
+interface HiddenColumnsProps {
+  statuses: TaskStatus[];
+  counts: Record<TaskStatus, number>;
+  dropTarget: TaskStatus | null;
+  onDragTargetChange: (status: TaskStatus | null) => void;
+  onDrop: (status: TaskStatus, taskId: string) => void;
+  onShow: (status: TaskStatus) => void;
+}
+
+export function HiddenColumns({
+  statuses,
+  counts,
+  dropTarget,
+  onDragTargetChange,
+  onDrop,
+  onShow,
+}: HiddenColumnsProps) {
+  const [open, setOpen] = useState(true);
+
+  function dropTask(event: DragEvent<HTMLElement>, status: TaskStatus) {
+    event.preventDefault();
+    const taskId = event.dataTransfer.getData("application/x-taskboard-task")
+      || event.dataTransfer.getData("text/plain");
+    onDragTargetChange(null);
+    if (taskId) onDrop(status, taskId);
+  }
+
+  return (
+    <section className={`hidden-columns${open ? " is-open" : ""}`} aria-label="隐藏列">
+      <button
+        type="button"
+        className="hidden-columns-heading"
+        aria-expanded={open}
+        aria-controls="hidden-columns-list"
+        onClick={() => setOpen((current) => !current)}
+      >
+        <LinearIcon name="chevronDown" />
+        <span>隐藏列</span>
+      </button>
+
+      <div className="hidden-columns-list" id="hidden-columns-list" hidden={!open}>
+        {statuses.map((status) => {
+          const details = STATUS_DETAILS[status];
+          const canShow = counts[status] > 0;
+          return (
+            <div
+              className={`hidden-column-item status-${status}${dropTarget === status ? " is-drop-target" : ""}`}
+              key={status}
+              onDragEnter={(event) => {
+                event.preventDefault();
+                onDragTargetChange(status);
+              }}
+              onDragOver={(event) => {
+                event.preventDefault();
+                event.dataTransfer.dropEffect = "move";
+                onDragTargetChange(status);
+              }}
+              onDragLeave={(event) => {
+                if (!(event.relatedTarget instanceof Node) || !event.currentTarget.contains(event.relatedTarget)) {
+                  onDragTargetChange(null);
+                }
+              }}
+              onDrop={(event) => dropTask(event, status)}
+            >
+              {canShow ? (
+                <button
+                  type="button"
+                  className="hidden-column-show"
+                  aria-label={`显示${details.label}列`}
+                  onClick={() => onShow(status)}
+                >
+                  <span className={`status-icon status-icon-${details.tone}`}>
+                    <StatusIcon status={status} />
+                  </span>
+                  <strong>{details.label}</strong>
+                  <span className="hidden-column-count">{counts[status]}</span>
+                </button>
+              ) : (
+                <div className="hidden-column-show is-empty">
+                  <span className={`status-icon status-icon-${details.tone}`}>
+                    <StatusIcon status={status} />
+                  </span>
+                  <strong>{details.label}</strong>
+                  <span className="hidden-column-count">{counts[status]}</span>
+                </div>
+              )}
+              {canShow && (
+                <ColumnVisibilityMenu
+                  label={details.label}
+                  action="show"
+                  className="icon-button hidden-column-menu"
+                  onAction={() => onShow(status)}
+                />
+              )}
+            </div>
+          );
+        })}
+      </div>
+    </section>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/InlineMediaComposer.tsx b/apps/codex-taskboard/web/src/components/InlineMediaComposer.tsx
new file mode 100644
index 000000000..f2d5e1c64
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/InlineMediaComposer.tsx
@@ -0,0 +1,275 @@
+import {
+  forwardRef,
+  useImperativeHandle,
+  useLayoutEffect,
+  useRef,
+  useState,
+  type ClipboardEvent,
+  type KeyboardEventHandler,
+} from "react";
+import type { Attachment } from "../types";
+import { attachmentContentUrl } from "../api";
+import { clipboardImages, fileKey, MAX_ATTACHMENT_SIZE } from "./PendingAttachments";
+import { LinearIcon } from "./LinearIcon";
+
+interface InlineTextSegment {
+  id: string;
+  type: "text";
+  text: string;
+}
+
+interface InlineImageSegment {
+  id: string;
+  type: "pending-image";
+  token: string;
+  file: File;
+}
+
+export type InlineMediaSegment = InlineTextSegment | InlineImageSegment;
+export type PendingInlineImage = InlineImageSegment;
+
+export interface InlineMediaComposerHandle {
+  focus: () => void;
+}
+
+interface InlineMediaComposerProps {
+  segments: InlineMediaSegment[];
+  placeholder: string;
+  ariaLabel: string;
+  disabled?: boolean;
+  className?: string;
+  onChange: (segments: InlineMediaSegment[]) => void;
+  onError: (message: string | null) => void;
+  onKeyDown?: KeyboardEventHandler<HTMLTextAreaElement>;
+}
+
+let segmentSequence = 0;
+
+function segmentId(prefix: string): string {
+  segmentSequence += 1;
+  return `${prefix}-${Date.now().toString(36)}-${segmentSequence.toString(36)}`;
+}
+
+function textSegment(text = ""): InlineTextSegment {
+  return { id: segmentId("text"), type: "text", text };
+}
+
+function imageSegment(file: File): InlineImageSegment {
+  const id = segmentId("image");
+  return {
+    id,
+    type: "pending-image",
+    token: `<!--taskboard-inline-image:${id}-->`,
+    file,
+  };
+}
+
+export function createInlineMediaSegments(text = ""): InlineMediaSegment[] {
+  return [textSegment(text)];
+}
+
+export function inlineMediaImages(segments: InlineMediaSegment[]): PendingInlineImage[] {
+  return segments.filter((segment): segment is PendingInlineImage => segment.type === "pending-image");
+}
+
+export function inlineMediaText(segments: InlineMediaSegment[]): string {
+  return segments.flatMap((segment) => segment.type === "text" ? [segment.text] : []).join("");
+}
+
+export function serializeInlineMedia(segments: InlineMediaSegment[]): string {
+  return segments.map((segment) => (
+    segment.type === "text" ? segment.text : `\n\n${segment.token}\n\n`
+  )).join("");
+}
+
+export function resolveInlineMediaMarkdown(
+  value: string,
+  images: PendingInlineImage[],
+  attachments: Attachment[],
+): string {
+  return images.reduce((markdown, image, index) => {
+    const attachment = attachments[index];
+    if (!attachment) return markdown;
+    const alt = image.file.name.replace(/[\\[\]]/g, "\\$&");
+    return markdown.replace(
+      image.token,
+      `![${alt}](${attachmentContentUrl(attachment)})`,
+    );
+  }, value);
+}
+
+function normalizeSegments(segments: InlineMediaSegment[]): InlineMediaSegment[] {
+  const normalized: InlineMediaSegment[] = [];
+  for (const segment of segments) {
+    const previous = normalized.at(-1);
+    if (segment.type === "text" && previous?.type === "text") {
+      normalized[normalized.length - 1] = {
+        ...previous,
+        text: previous.text + segment.text,
+      };
+    } else {
+      normalized.push(segment);
+    }
+  }
+  if (normalized.length === 0) return [textSegment()];
+  if (normalized[0].type !== "text") normalized.unshift(textSegment());
+  if (normalized.at(-1)?.type !== "text") normalized.push(textSegment());
+  return normalized;
+}
+
+function resizeTextarea(element: HTMLTextAreaElement | null) {
+  if (!element) return;
+  element.style.height = "0px";
+  element.style.height = `${element.scrollHeight}px`;
+}
+
+function PendingImageBlock({
+  segment,
+  disabled,
+  onRemove,
+}: {
+  segment: PendingInlineImage;
+  disabled: boolean;
+  onRemove: () => void;
+}) {
+  const [previewUrl, setPreviewUrl] = useState("");
+
+  useLayoutEffect(() => {
+    const url = URL.createObjectURL(segment.file);
+    setPreviewUrl(url);
+    return () => URL.revokeObjectURL(url);
+  }, [segment.file]);
+
+  return (
+    <figure className="inline-media-image">
+      {previewUrl && <img src={previewUrl} alt={segment.file.name} />}
+      <button
+        type="button"
+        disabled={disabled}
+        aria-label={`移除 ${segment.file.name}`}
+        onClick={onRemove}
+      >
+        <LinearIcon name="close" />
+      </button>
+    </figure>
+  );
+}
+
+export const InlineMediaComposer = forwardRef<InlineMediaComposerHandle, InlineMediaComposerProps>(
+  function InlineMediaComposer({
+    segments,
+    placeholder,
+    ariaLabel,
+    disabled = false,
+    className = "",
+    onChange,
+    onError,
+    onKeyDown,
+  }, ref) {
+    const textareas = useRef(new Map<string, HTMLTextAreaElement>());
+    const pendingFocus = useRef<{ id: string; offset: number } | null>(null);
+
+    useLayoutEffect(() => {
+      for (const element of textareas.current.values()) resizeTextarea(element);
+      const focus = pendingFocus.current;
+      if (!focus) return;
+      const target = textareas.current.get(focus.id);
+      if (!target) return;
+      target.focus();
+      target.setSelectionRange(focus.offset, focus.offset);
+      pendingFocus.current = null;
+    }, [segments]);
+
+    useImperativeHandle(ref, () => ({
+      focus() {
+        const firstText = segments.find((segment) => segment.type === "text");
+        if (firstText) textareas.current.get(firstText.id)?.focus();
+      },
+    }), [segments]);
+
+    function changeText(id: string, text: string) {
+      onChange(segments.map((segment) => (
+        segment.id === id && segment.type === "text" ? { ...segment, text } : segment
+      )));
+    }
+
+    function pasteImages(
+      event: ClipboardEvent<HTMLTextAreaElement>,
+      segment: InlineTextSegment,
+    ) {
+      const clipboardFiles = clipboardImages(event.clipboardData);
+      if (clipboardFiles.length === 0) return;
+      event.preventDefault();
+
+      const oversized = clipboardFiles.find((file) => file.size > MAX_ATTACHMENT_SIZE);
+      if (oversized) {
+        onError(`“${oversized.name}” 超过 25 MB，无法上传。`);
+        return;
+      }
+
+      const existing = new Set(inlineMediaImages(segments).map((image) => fileKey(image.file)));
+      const images = clipboardFiles.filter((file) => {
+        const key = fileKey(file);
+        if (existing.has(key)) return false;
+        existing.add(key);
+        return true;
+      });
+      if (images.length === 0) return;
+      onError(null);
+
+      const textarea = event.currentTarget;
+      const start = textarea.selectionStart;
+      const end = textarea.selectionEnd;
+      const before = { ...segment, text: segment.text.slice(0, start) };
+      const after = textSegment(segment.text.slice(end));
+      const insertion = images.map(imageSegment);
+      const next = segments.flatMap((candidate) => (
+        candidate.id === segment.id ? [before, ...insertion, after] : [candidate]
+      ));
+      pendingFocus.current = { id: after.id, offset: 0 };
+      onChange(next);
+    }
+
+    function removeImage(id: string) {
+      onChange(normalizeSegments(segments.filter((segment) => segment.id !== id)));
+    }
+
+    const isEmpty = segments.every((segment) => (
+      segment.type === "text" ? segment.text.length === 0 : false
+    ));
+
+    return (
+      <div className={`inline-media-composer ${className}`.trim()} aria-label={ariaLabel}>
+        {segments.map((segment, index) => (
+          segment.type === "text" ? (
+            <textarea
+              key={segment.id}
+              ref={(element) => {
+                if (element) textareas.current.set(segment.id, element);
+                else textareas.current.delete(segment.id);
+              }}
+              value={segment.text}
+              rows={1}
+              disabled={disabled}
+              aria-label={index === 0 ? ariaLabel : `${ariaLabel}续写`}
+              placeholder={isEmpty && index === 0 ? placeholder : undefined}
+              onChange={(event) => {
+                changeText(segment.id, event.target.value);
+                resizeTextarea(event.currentTarget);
+              }}
+              onPaste={(event) => pasteImages(event, segment)}
+              onKeyDown={onKeyDown}
+            />
+          ) : (
+            <PendingImageBlock
+              key={segment.id}
+              segment={segment}
+              disabled={disabled}
+              onRemove={() => removeImage(segment.id)}
+            />
+          )
+        ))}
+      </div>
+    );
+  },
+);
diff --git a/apps/codex-taskboard/web/src/components/IssueHierarchyView.tsx b/apps/codex-taskboard/web/src/components/IssueHierarchyView.tsx
new file mode 100644
index 000000000..b219d71f8
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/IssueHierarchyView.tsx
@@ -0,0 +1,205 @@
+import type { CSSProperties } from "react";
+
+import {
+  countTaskDescendants,
+  createTaskLookup,
+  getAncestorTrail,
+} from "../taskHierarchy";
+import type { Task } from "../types";
+import { ActorAvatar } from "./ActorAvatar";
+import { STATUS_DETAILS } from "./BoardColumn";
+import { LinearIcon, LinearStatusIcon } from "./LinearIcon";
+
+interface IssueHierarchyViewProps {
+  tasks: Task[];
+  allTasks: Task[];
+  totalTasks: number;
+  hasQuery: boolean;
+  onClearQuery: () => void;
+  onOpenTask: (task: Task) => void;
+  onOpenThread: (threadId: string, workspacePath?: string, threadTitle?: string) => void;
+}
+
+interface HierarchyRow {
+  task: Task;
+  depth: number;
+  isLastSibling: boolean;
+  isContext: boolean;
+  descendantCount: number;
+  directSubIssueCount: number;
+  parentPath: string;
+}
+
+function buildHierarchyRows(visibleTasks: Task[], allTasks: Task[]) {
+  const sourceTasks = allTasks.length > 0 ? allTasks : visibleTasks;
+  const taskById = createTaskLookup(sourceTasks);
+  const visibleTaskIds = new Set(visibleTasks.map((task) => task.id));
+  const displayTaskIds = new Set(visibleTaskIds);
+
+  for (const task of visibleTasks) {
+    for (const ancestor of getAncestorTrail(task, taskById)) {
+      if (taskById.has(ancestor.id)) displayTaskIds.add(ancestor.id);
+    }
+  }
+
+  const displayTasks = sourceTasks.filter((task) => displayTaskIds.has(task.id));
+  const orderById = new Map(sourceTasks.map((task, index) => [task.id, index]));
+  const childrenByParentId = new Map<string, Task[]>();
+  const roots: Task[] = [];
+
+  for (const task of displayTasks) {
+    const parentId = task.relations.parent?.id;
+    if (parentId && displayTaskIds.has(parentId)) {
+      const children = childrenByParentId.get(parentId) ?? [];
+      children.push(task);
+      childrenByParentId.set(parentId, children);
+    } else {
+      roots.push(task);
+    }
+  }
+
+  const compareBySourceOrder = (a: Task, b: Task) => (
+    (orderById.get(a.id) ?? 0) - (orderById.get(b.id) ?? 0)
+  );
+  roots.sort(compareBySourceOrder);
+  for (const children of childrenByParentId.values()) children.sort(compareBySourceOrder);
+
+  const rows: HierarchyRow[] = [];
+  const visited = new Set<string>();
+
+  function visit(task: Task, depth: number, ancestors: string[], isLastSibling: boolean) {
+    if (visited.has(task.id)) return;
+    visited.add(task.id);
+    rows.push({
+      task,
+      depth,
+      isLastSibling,
+      isContext: !visibleTaskIds.has(task.id),
+      descendantCount: countTaskDescendants(task, taskById),
+      directSubIssueCount: task.relations.subIssues.length,
+      parentPath: ancestors.join(" / "),
+    });
+    const children = childrenByParentId.get(task.id) ?? [];
+    children.forEach((child, index) => {
+      visit(child, depth + 1, [...ancestors, task.identifier], index === children.length - 1);
+    });
+  }
+
+  roots.forEach((root, index) => visit(root, 0, [], index === roots.length - 1));
+  for (const task of displayTasks.sort(compareBySourceOrder)) visit(task, 0, [], true);
+
+  return rows;
+}
+
+function subIssueLabel(row: HierarchyRow) {
+  if (row.descendantCount === 0) return "无";
+  if (row.descendantCount === row.directSubIssueCount) return `${row.directSubIssueCount}`;
+  return `${row.directSubIssueCount}/${row.descendantCount}`;
+}
+
+export function IssueHierarchyView({
+  tasks,
+  allTasks,
+  totalTasks,
+  hasQuery,
+  onClearQuery,
+  onOpenTask,
+  onOpenThread,
+}: IssueHierarchyViewProps) {
+  if (totalTasks === 0) {
+    return (
+      <section className="page-empty hierarchy-empty">
+        <span className="empty-search" aria-hidden="true"><LinearIcon name="branch" /></span>
+        <h2>还没有任务</h2>
+        <p>有父子关系的任务会在这里以层级树展示。</p>
+      </section>
+    );
+  }
+
+  if (tasks.length === 0 && hasQuery) {
+    return (
+      <section className="page-empty hierarchy-empty">
+        <span className="empty-search" aria-hidden="true"><LinearIcon name="search" /></span>
+        <h2>没有匹配的任务</h2>
+        <p>请更换搜索词，或移除一个筛选条件。</p>
+        <button className="button secondary" type="button" onClick={onClearQuery}>
+          清除筛选
+        </button>
+      </section>
+    );
+  }
+
+  const rows = buildHierarchyRows(tasks, allTasks);
+
+  return (
+    <section className="hierarchy-view" aria-label="父子任务层级">
+      <div className="hierarchy-view-heading">
+        <div>
+          <span>层级视图</span>
+          <h2>父子任务</h2>
+        </div>
+        <strong>{tasks.length}/{totalTasks}</strong>
+      </div>
+
+      <div className="hierarchy-table" role="tree" aria-label="父子任务树">
+        <div className="hierarchy-table-header" aria-hidden="true">
+          <span>任务</span>
+          <span>状态</span>
+          <span>下级</span>
+          <span>负责人</span>
+        </div>
+        {rows.map((row) => {
+          const indent = Math.min(row.depth, 8) * 18;
+          const rowStyle = { "--hierarchy-indent": `${indent}px` } as CSSProperties;
+          return (
+            <div
+              className={`hierarchy-row${row.isContext ? " is-context" : ""}${row.isLastSibling ? " is-last-sibling" : ""}`}
+              key={row.task.id}
+              role="treeitem"
+              aria-level={row.depth + 1}
+              data-depth={row.depth}
+              style={rowStyle}
+            >
+              <button
+                className="hierarchy-row-main"
+                type="button"
+                title={row.parentPath ? `${row.parentPath} / ${row.task.identifier} ${row.task.title}` : `${row.task.identifier} ${row.task.title}`}
+                onClick={() => onOpenTask(row.task)}
+              >
+                <span className="hierarchy-row-indent" aria-hidden="true" />
+                <span className="hierarchy-row-id">{row.task.identifier}</span>
+                <span className="hierarchy-row-title">{row.task.title}</span>
+                {row.isContext && <span className="hierarchy-context-chip">上级</span>}
+              </button>
+              <span className="hierarchy-row-status">
+                <LinearStatusIcon status={row.task.status} />
+                {STATUS_DETAILS[row.task.status].label}
+              </span>
+              <span
+                className="hierarchy-row-subissues"
+                title={row.descendantCount > row.directSubIssueCount ? "直接下级/全部下级" : "直接下级"}
+              >
+                {subIssueLabel(row)}
+              </span>
+              <span className="hierarchy-row-assignee">
+                <ActorAvatar actor={row.task.assignee} />
+                <span>{row.task.assignee.name}</span>
+              </span>
+              {row.task.threadId && (
+                <button
+                  className="icon-button hierarchy-row-thread"
+                  type="button"
+                  aria-label={`查看对话 ${row.task.threadId}`}
+                  title={`查看对话 ${row.task.threadId}`}
+                  onClick={() => onOpenThread(row.task.threadId!, undefined, row.task.title)}
+                >
+                  <LinearIcon name="conversation" />
+                </button>
+              )}
+            </div>
+          );
+        })}
+      </div>
+    </section>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/IssueRelations.tsx b/apps/codex-taskboard/web/src/components/IssueRelations.tsx
new file mode 100644
index 000000000..42a605ce9
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/IssueRelations.tsx
@@ -0,0 +1,429 @@
+import {
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+  type CSSProperties,
+} from "react";
+
+import type {
+  IssueRelationType,
+  Task,
+  TaskRelationSummary,
+} from "../types";
+import { ActorAvatar } from "./ActorAvatar";
+import { LinearIcon, LinearStatusIcon } from "./LinearIcon";
+
+export interface RelationMutationResult {
+  task: Task;
+  relatedTask: Task;
+}
+
+interface RelationActions {
+  task: Task;
+  tasks: Task[];
+  onOpenTask: (task: TaskRelationSummary) => void;
+  onOpenThread?: (threadId: string, workspacePath?: string, threadTitle?: string) => void;
+  onAddRelation: (
+    task: Task,
+    type: IssueRelationType,
+    relatedTaskId: string,
+  ) => Promise<RelationMutationResult>;
+  onRemoveRelation: (
+    task: Task,
+    type: IssueRelationType,
+    relatedTaskId: string,
+  ) => Promise<RelationMutationResult>;
+}
+
+function IssuePicker({
+  label,
+  candidates,
+  disabled,
+  onSelect,
+}: {
+  label: string;
+  candidates: Task[];
+  disabled?: boolean;
+  onSelect: (task: Task) => Promise<void>;
+}) {
+  const [open, setOpen] = useState(false);
+  const [query, setQuery] = useState("");
+  const [activeIndex, setActiveIndex] = useState(0);
+  const [savingId, setSavingId] = useState<string | null>(null);
+  const rootRef = useRef<HTMLDivElement>(null);
+  const inputRef = useRef<HTMLInputElement>(null);
+  const results = useMemo(() => {
+    const normalized = query.trim().toLocaleLowerCase();
+    if (!normalized) return candidates;
+    return candidates.filter((task) => (
+      task.identifier.toLocaleLowerCase().includes(normalized)
+      || task.title.toLocaleLowerCase().includes(normalized)
+    ));
+  }, [candidates, query]);
+
+  useEffect(() => {
+    if (!open) return;
+    setActiveIndex(0);
+    requestAnimationFrame(() => inputRef.current?.focus());
+    const close = (event: PointerEvent) => {
+      if (!rootRef.current?.contains(event.target as Node)) setOpen(false);
+    };
+    window.addEventListener("pointerdown", close);
+    return () => window.removeEventListener("pointerdown", close);
+  }, [open]);
+
+  async function choose(task: Task) {
+    setSavingId(task.id);
+    try {
+      await onSelect(task);
+      setOpen(false);
+      setQuery("");
+    } catch {
+    } finally {
+      setSavingId(null);
+    }
+  }
+
+  return (
+    <div className="issue-relation-picker" ref={rootRef}>
+      <button
+        className="issue-relation-add"
+        type="button"
+        disabled={disabled}
+        aria-expanded={open}
+        onClick={() => setOpen((value) => !value)}
+      >
+        <LinearIcon name="plus" />
+        <span>{label}</span>
+      </button>
+      {open && (
+        <div className="issue-relation-popover">
+          <div className="issue-relation-search">
+            <LinearIcon name="search" />
+            <input
+              ref={inputRef}
+              value={query}
+              role="combobox"
+              aria-expanded="true"
+              aria-controls="issue-relation-results"
+              aria-activedescendant={results[activeIndex] ? `relation-option-${results[activeIndex].id}` : undefined}
+              placeholder="搜索任务…"
+              onChange={(event) => {
+                setQuery(event.target.value);
+                setActiveIndex(0);
+              }}
+              onKeyDown={(event) => {
+                if (event.key === "Escape") {
+                  event.preventDefault();
+                  setOpen(false);
+                } else if (event.key === "ArrowDown" && results.length > 0) {
+                  event.preventDefault();
+                  setActiveIndex((index) => (index + 1) % results.length);
+                } else if (event.key === "ArrowUp" && results.length > 0) {
+                  event.preventDefault();
+                  setActiveIndex((index) => (index - 1 + results.length) % results.length);
+                } else if (event.key === "Enter" && results[activeIndex]) {
+                  event.preventDefault();
+                  void choose(results[activeIndex]);
+                }
+              }}
+            />
+          </div>
+          <div className="issue-relation-results" id="issue-relation-results" role="listbox">
+            {results.length > 0 ? results.map((candidate, index) => (
+              <button
+                id={`relation-option-${candidate.id}`}
+                className={index === activeIndex ? "is-active" : ""}
+                type="button"
+                role="option"
+                aria-selected={index === activeIndex}
+                disabled={savingId !== null}
+                key={candidate.id}
+                onMouseEnter={() => setActiveIndex(index)}
+                onClick={() => void choose(candidate)}
+              >
+                <LinearStatusIcon status={candidate.status} />
+                <span className="issue-relation-option-id">{candidate.identifier}</span>
+                <span className="issue-relation-option-title">{candidate.title}</span>
+              </button>
+            )) : (
+              <p className="issue-relation-empty">没有匹配的任务</p>
+            )}
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}
+
+function descendantIds(task: Task, tasks: Task[]) {
+  const descendants = new Set<string>();
+  const queue = [...task.relations.subIssues.map((item) => item.id)];
+  const taskById = new Map(tasks.map((candidate) => [candidate.id, candidate]));
+  while (queue.length > 0) {
+    const id = queue.shift()!;
+    if (descendants.has(id)) continue;
+    descendants.add(id);
+    const child = taskById.get(id);
+    if (child) queue.push(...child.relations.subIssues.map((item) => item.id));
+  }
+  return descendants;
+}
+
+function IssueRelationRow({
+  issue,
+  onOpen,
+  onOpenThread,
+  onRemove,
+  removing,
+  showAssignee = false,
+}: {
+  issue: TaskRelationSummary;
+  onOpen: () => void;
+  onOpenThread?: (threadId: string, workspacePath?: string, threadTitle?: string) => void;
+  onRemove: () => void;
+  removing: boolean;
+  showAssignee?: boolean;
+}) {
+  return (
+    <div className="issue-relation-row">
+      <button className="issue-relation-target" type="button" onClick={onOpen}>
+        <LinearStatusIcon status={issue.status} />
+        <span className="issue-relation-id">{issue.identifier}</span>
+        <span className="issue-relation-title">{issue.title}</span>
+        {showAssignee && <ActorAvatar actor={issue.assignee} className="issue-relation-assignee" />}
+      </button>
+      {issue.threadId && onOpenThread && (
+        <button
+          className="issue-relation-thread"
+          type="button"
+          aria-label={`查看对话 ${issue.threadId}`}
+          title={`查看对话 ${issue.threadId}`}
+          onClick={() => onOpenThread(issue.threadId!, undefined, issue.title)}
+        >
+          <LinearIcon name="conversation" />
+        </button>
+      )}
+      <button
+        className="issue-relation-remove"
+        type="button"
+        aria-label={`移除 ${issue.identifier}`}
+        disabled={removing}
+        onClick={onRemove}
+      >
+        <LinearIcon name="close" />
+      </button>
+    </div>
+  );
+}
+
+export function IssueParentLink({
+  task,
+  tasks,
+  onOpenTask,
+  onOpenThread,
+  onAddRelation,
+  onRemoveRelation,
+}: RelationActions) {
+  const [saving, setSaving] = useState(false);
+  const parent = task.relations.parent;
+  const excluded = descendantIds(task, tasks);
+  excluded.add(task.id);
+  const candidates = tasks.filter((candidate) => (
+    candidate.archivedAt === null
+    && !excluded.has(candidate.id)
+    && candidate.id !== parent?.id
+  ));
+
+  return (
+    <div className={`issue-parent-link${parent ? " has-parent" : ""}`}>
+      {parent && (
+        <>
+          <span className="issue-parent-prefix">子任务属于</span>
+          <IssueRelationRow
+            issue={parent}
+            removing={saving}
+            onOpen={() => onOpenTask(parent)}
+            onOpenThread={onOpenThread}
+            onRemove={() => {
+              setSaving(true);
+              void onRemoveRelation(task, "parent", parent.id)
+                .catch(() => undefined)
+                .finally(() => setSaving(false));
+            }}
+          />
+        </>
+      )}
+      <IssuePicker
+        label={parent ? "更换父任务" : "设置父任务"}
+        candidates={candidates}
+        disabled={saving}
+        onSelect={async (candidate) => {
+          setSaving(true);
+          try {
+            await onAddRelation(task, "parent", candidate.id);
+          } finally {
+            setSaving(false);
+          }
+        }}
+      />
+    </div>
+  );
+}
+
+export function IssueSubIssues({
+  task,
+  tasks,
+  onOpenTask,
+  onOpenThread,
+  onAddRelation,
+  onRemoveRelation,
+}: RelationActions) {
+  const [savingId, setSavingId] = useState<string | null>(null);
+  const subIssues = task.relations.subIssues;
+  const done = subIssues.filter((issue) => issue.status === "done").length;
+  const directIds = new Set(subIssues.map((issue) => issue.id));
+  const ancestors = new Set<string>([task.id]);
+  let parent = task.relations.parent;
+  const taskById = new Map(tasks.map((candidate) => [candidate.id, candidate]));
+  while (parent && !ancestors.has(parent.id)) {
+    ancestors.add(parent.id);
+    parent = taskById.get(parent.id)?.relations.parent ?? null;
+  }
+  const candidates = tasks.filter((candidate) => (
+    candidate.archivedAt === null
+    && !ancestors.has(candidate.id)
+    && !directIds.has(candidate.id)
+  ));
+  const progress = subIssues.length > 0 ? Math.round((done / subIssues.length) * 100) : 0;
+
+  return (
+    <section className="issue-sub-issues" aria-labelledby="sub-issues-heading">
+      <header>
+        <div>
+          <h2 id="sub-issues-heading">子任务</h2>
+          {subIssues.length > 0 && (
+            <span className="sub-issue-summary">
+              <span
+                className="sub-issue-progress"
+                style={{ "--sub-issue-progress": `${progress}%` } as CSSProperties}
+                aria-hidden="true"
+              />
+              {done}/{subIssues.length}
+            </span>
+          )}
+        </div>
+        <IssuePicker
+          label="添加子任务"
+          candidates={candidates}
+          disabled={savingId !== null}
+          onSelect={async (candidate) => {
+            setSavingId(candidate.id);
+            try {
+              await onAddRelation(candidate, "parent", task.id);
+            } finally {
+              setSavingId(null);
+            }
+          }}
+        />
+      </header>
+      {subIssues.length > 0 && (
+        <div className="issue-sub-issue-list">
+          {subIssues.map((issue) => {
+            const child = taskById.get(issue.id);
+            return (
+              <IssueRelationRow
+                issue={issue}
+                key={issue.id}
+                showAssignee
+                removing={savingId === issue.id}
+                onOpen={() => onOpenTask(issue)}
+                onOpenThread={onOpenThread}
+                onRemove={() => {
+                  if (!child) return;
+                  setSavingId(issue.id);
+                  void onRemoveRelation(child, "parent", task.id)
+                    .catch(() => undefined)
+                    .finally(() => setSavingId(null));
+                }}
+              />
+            );
+          })}
+        </div>
+      )}
+    </section>
+  );
+}
+
+const RELATION_GROUPS = [
+  { type: "blocked_by", field: "blockedBy", label: "阻塞于", tone: "blocked-by" },
+  { type: "blocks", field: "blocks", label: "阻塞", tone: "blocks" },
+  { type: "related", field: "related", label: "相关任务", tone: "related" },
+] as const;
+
+export function IssueRelationSidebar({
+  task,
+  tasks,
+  onOpenTask,
+  onOpenThread,
+  onAddRelation,
+  onRemoveRelation,
+}: RelationActions) {
+  const [savingKey, setSavingKey] = useState<string | null>(null);
+
+  return (
+    <section className="issue-relation-sidebar" aria-labelledby="relations-heading">
+      <h2 id="relations-heading">关系</h2>
+      {RELATION_GROUPS.map((group) => {
+        const issues = task.relations[group.field];
+        const existing = new Set(issues.map((issue) => issue.id));
+        const candidates = tasks.filter((candidate) => (
+          candidate.archivedAt === null
+          && candidate.id !== task.id
+          && !existing.has(candidate.id)
+        ));
+        return (
+          <div className={`issue-relation-group is-${group.tone}`} key={group.type}>
+            <header>
+              <span>
+                <LinearIcon name={group.type === "related" ? "link" : "alert"} />
+                {group.label}
+              </span>
+              <IssuePicker
+                label={`添加${group.label}`}
+                candidates={candidates}
+                disabled={savingKey !== null}
+                onSelect={async (candidate) => {
+                  const key = `${group.type}:${candidate.id}`;
+                  setSavingKey(key);
+                  try {
+                    await onAddRelation(task, group.type, candidate.id);
+                  } finally {
+                    setSavingKey(null);
+                  }
+                }}
+              />
+            </header>
+            {issues.map((issue) => (
+              <IssueRelationRow
+                issue={issue}
+                key={issue.id}
+                removing={savingKey === `${group.type}:${issue.id}`}
+                onOpen={() => onOpenTask(issue)}
+                onOpenThread={onOpenThread}
+                onRemove={() => {
+                  const key = `${group.type}:${issue.id}`;
+                  setSavingKey(key);
+                  void onRemoveRelation(task, group.type, issue.id)
+                    .catch(() => undefined)
+                    .finally(() => setSavingKey(null));
+                }}
+              />
+            ))}
+          </div>
+        );
+      })}
+    </section>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/LabelPicker.tsx b/apps/codex-taskboard/web/src/components/LabelPicker.tsx
new file mode 100644
index 000000000..2bc5160e3
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/LabelPicker.tsx
@@ -0,0 +1,128 @@
+import { useEffect, useRef, useState } from "react";
+import { labelColor } from "../labels";
+import { LinearIcon } from "./LinearIcon";
+
+interface LabelPickerProps {
+  availableLabels: string[];
+  selectedLabels: string[];
+  open: boolean;
+  disabled?: boolean;
+  className?: string;
+  triggerClassName: string;
+  showIcon?: boolean;
+  placeholder?: string;
+  onOpenChange: (open: boolean) => void;
+  onChange: (labels: string[]) => void;
+}
+
+export function LabelPicker({
+  availableLabels,
+  selectedLabels,
+  open,
+  disabled = false,
+  className = "",
+  triggerClassName,
+  showIcon = false,
+  placeholder = "标签",
+  onOpenChange,
+  onChange,
+}: LabelPickerProps) {
+  const rootRef = useRef<HTMLDivElement>(null);
+  const triggerRef = useRef<HTMLButtonElement>(null);
+  const [search, setSearch] = useState("");
+  const normalizedSearch = search.trim();
+  const filteredLabels = availableLabels.filter((label) => (
+    !normalizedSearch || label.toLocaleLowerCase().includes(normalizedSearch.toLocaleLowerCase())
+  ));
+  const canCreateLabel = Boolean(normalizedSearch) && !availableLabels.includes(normalizedSearch);
+
+  useEffect(() => {
+    if (!open) {
+      setSearch("");
+      return;
+    }
+
+    function closeFromOutside(event: PointerEvent) {
+      if (!rootRef.current?.contains(event.target as Node)) onOpenChange(false);
+    }
+
+    function closeFromEscape(event: globalThis.KeyboardEvent) {
+      if (event.key === "Escape") {
+        onOpenChange(false);
+        triggerRef.current?.focus();
+      }
+    }
+
+    document.addEventListener("pointerdown", closeFromOutside);
+    window.addEventListener("keydown", closeFromEscape);
+    return () => {
+      document.removeEventListener("pointerdown", closeFromOutside);
+      window.removeEventListener("keydown", closeFromEscape);
+    };
+  }, [onOpenChange, open]);
+
+  function toggleLabel(label: string) {
+    if (disabled) return;
+    onChange(selectedLabels.includes(label)
+      ? selectedLabels.filter((item) => item !== label)
+      : [...selectedLabels, label]);
+  }
+
+  return (
+    <div ref={rootRef} className={`composer-menu-anchor label-picker${className ? ` ${className}` : ""}`}>
+      <button
+        ref={triggerRef}
+        type="button"
+        className={triggerClassName}
+        disabled={disabled}
+        aria-label="选择或创建标签"
+        aria-haspopup="dialog"
+        aria-expanded={open}
+        onClick={() => onOpenChange(!open)}
+      >
+        {showIcon && <LinearIcon name="label" />}
+        <span>{selectedLabels.length > 0 ? selectedLabels.join(", ") : placeholder}</span>
+      </button>
+      {open && (
+        <div className="composer-popover label-popover" role="dialog" aria-label="选择或创建标签">
+          <input
+            autoFocus
+            value={search}
+            onChange={(event) => setSearch(event.target.value)}
+            placeholder="Add labels…"
+            aria-label="搜索标签"
+          />
+          <div className="label-options" role="listbox" aria-label="可用标签" aria-multiselectable="true">
+            {filteredLabels.map((label) => (
+              <button
+                type="button"
+                role="option"
+                aria-selected={selectedLabels.includes(label)}
+                disabled={disabled}
+                key={label}
+                onClick={() => toggleLabel(label)}
+              >
+                <i style={{ background: labelColor(label) }} />
+                <span>{label}</span>
+                {selectedLabels.includes(label) && <b><LinearIcon name="check" /></b>}
+              </button>
+            ))}
+            {canCreateLabel && (
+              <button
+                type="button"
+                disabled={disabled}
+                onClick={() => {
+                  toggleLabel(normalizedSearch);
+                  setSearch("");
+                }}
+              >
+                <i style={{ background: labelColor(normalizedSearch) }} />
+                <span>创建 “{normalizedSearch}”</span>
+              </button>
+            )}
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/LinearIcon.tsx b/apps/codex-taskboard/web/src/components/LinearIcon.tsx
new file mode 100644
index 000000000..f92ce64ad
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/LinearIcon.tsx
@@ -0,0 +1,219 @@
+import type { ReactNode, SVGProps } from "react";
+import type { TaskPriority, TaskStatus } from "../types";
+
+// Geometry is sourced from Linear's live icon assets and Codex's native controls.
+// Keep SVG definitions here so product components never draw their own icons.
+const ICONS = {
+  alert: {
+    content: <path fillRule="evenodd" d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14M7.026 4.525a.5.5 0 0 1 .5-.525h.948a.5.5 0 0 1 .5.525l-.2 4a.5.5 0 0 1-.5.475h-.548a.5.5 0 0 1-.5-.475zM7 11a1 1 0 1 1 2 0 1 1 0 0 1-2 0" clipRule="evenodd" />,
+  },
+  attachment: {
+    content: <path d="m12.643 7.69-3.714 3.714c-1.447 1.448-3.586 1.606-4.762.43-1.18-1.18-1.023-3.312.425-4.76l3.41-3.41c.934-.933 2.296-1.033 3.031-.297.735.734.633 2.1-.297 3.03L7.324 9.81c-.422.421-1.002.464-1.3.166-.297-.297-.255-.879.175-1.308L9.29 5.576a.707.707 0 0 0-1-1L5.2 7.668c-.952.951-1.06 2.423-.175 3.308.886.886 2.356.777 3.3-.166l3.412-3.413c1.452-1.451 1.62-3.707.297-5.03s-3.575-1.158-5.03.298l-3.41 3.41c-1.97 1.97-2.193 4.991-.426 6.758 1.764 1.765 4.793 1.54 6.762-.429l3.714-3.714a.707.707 0 0 0-1-1" />,
+  },
+  archive: {
+    content: <path fillRule="evenodd" d="M2.5 1.75A1.75 1.75 0 0 0 .75 3.5v1c0 .52.285.973.707 1.212l.857 7.145A2.5 2.5 0 0 0 4.797 15h6.406a2.5 2.5 0 0 0 2.483-2.143l.857-7.145c.422-.239.707-.692.707-1.212v-1a1.75 1.75 0 0 0-1.75-1.75zm0 1.5a.25.25 0 0 0-.25.25v1c0 .138.112.25.25.25h11a.25.25 0 0 0 .25-.25v-1a.25.25 0 0 0-.25-.25zm1.327 3 .724 6.428a1 1 0 0 0 .994.889h4.91a1 1 0 0 0 .994-.889l.724-6.428zM6.25 8a.75.75 0 0 1 .75-.75h2a.75.75 0 0 1 0 1.5H7A.75.75 0 0 1 6.25 8" clipRule="evenodd" />,
+  },
+  branch: {
+    content: <path d="M9.5 3.25a2.25 2.25 0 0 1 4.315-.894c.164.378.22.795.164 1.203A2.25 2.25 0 0 1 12.5 5.371V6A2.5 2.5 0 0 1 10 8.5H6a1 1 0 0 0-1 1v1.128a2.25 2.25 0 1 1-1.5 0V5.37a2.25 2.25 0 1 1 1.5 0v1.836a2.492 2.492 0 0 1 1-.208h4a1 1 0 0 0 1-1v-.628A2.25 2.25 0 0 1 9.5 3.25Zm-6 0a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Zm8.25-.75a.75.75 0 1 0 0 1.499.75.75 0 0 0 0-1.5Zm-7.5 9.499a.75.75 0 1 0 0 1.499.75.75 0 0 0 0-1.5Z" />,
+  },
+  calendar: {
+    content: <path d="M11 1a4 4 0 0 1 4 4v6a4 4 0 0 1-4 4H5a4 4 0 0 1-4-4V5a4 4 0 0 1 4-4zm2.5 5h-11v5A2.5 2.5 0 0 0 5 13.5h6a2.5 2.5 0 0 0 2.5-2.5z" />,
+  },
+  calendarAdd: {
+    content: <path fillRule="evenodd" clipRule="evenodd" d="M15 5C15 2.79086 13.2091 1 11 1H5C2.79086 1 1 2.79086 1 5V11C1 13.2091 2.79086 15 5 15H6.25C6.66421 15 7 14.6642 7 14.25C7 13.8358 6.66421 13.5 6.25 13.5H5C3.61929 13.5 2.5 12.3807 2.5 11V6H13.5V6.25C13.5 6.66421 13.8358 7 14.25 7C14.6642 7 15 6.66421 15 6.25V5ZM11.5001 8C11.9143 8 12.2501 8.33579 12.2501 8.75V10.75L14.2501 10.75C14.6643 10.75 15.0001 11.0858 15.0001 11.5C15.0001 11.9142 14.6643 12.25 14.2501 12.25L12.2501 12.25V14.25C12.2501 14.6642 11.9143 15 11.5001 15C11.0859 15 10.7501 14.6642 10.7501 14.25V12.25H8.75C8.33579 12.25 8 11.9142 8 11.5C8 11.0858 8.33579 10.75 8.75 10.75L10.7501 10.75V8.75C10.7501 8.33579 11.0859 8 11.5001 8Z" />,
+  },
+  check: {
+    content: <path d="M6.336 13.6a1.049 1.049 0 0 1-.8-.376L2.632 9.736a.992.992 0 0 1 .152-1.424 1.056 1.056 0 0 1 1.456.152l2.008 2.4 5.448-8a1.048 1.048 0 0 1 1.432-.288A.992.992 0 0 1 13.424 4L7.2 13.144a1.04 1.04 0 0 1-.8.456h-.064Z" />,
+  },
+  chevronDown: {
+    content: <path d="M4.53 5.47a.75.75 0 0 0-1.06 1.06l4 4a.75.75 0 0 0 1.054.007l4-3.903a.75.75 0 0 0-1.048-1.073l-3.47 3.385L4.53 5.47Z" />,
+  },
+  chevronLeft: {
+    content: <path d="M10.7803 4.78033C11.0732 4.48744 11.0732 4.01256 10.7803 3.71967C10.4874 3.42678 10.0126 3.42678 9.71967 3.71967L5.71967 7.71967C5.42933 8.01001 5.42643 8.47986 5.71318 8.77376L9.61581 12.7738C9.90508 13.0702 10.3799 13.0761 10.6764 12.7868C10.9729 12.4976 10.9787 12.0227 10.6895 11.7262L7.30417 8.25649L10.7803 4.78033Z" />,
+  },
+  chevronRight: {
+    content: <path d="M5.46967 11.4697C5.17678 11.7626 5.17678 12.2374 5.46967 12.5303C5.76256 12.8232 6.23744 12.8232 6.53033 12.5303L10.5303 8.53033C10.8207 8.23999 10.8236 7.77014 10.5368 7.47624L6.63419 3.47624C6.34492 3.17976 5.87009 3.17391 5.57361 3.46318C5.27713 3.75244 5.27128 4.22728 5.56054 4.52376L8.94583 7.99351L5.46967 11.4697Z" />,
+  },
+  close: {
+    content: <path d="M2.96967 2.96967C3.26256 2.67678 3.73744 2.67678 4.03033 2.96967L8 6.939L11.9697 2.96967C12.2626 2.67678 12.7374 2.67678 13.0303 2.96967C13.3232 3.26256 13.3232 3.73744 13.0303 4.03033L9.061 8L13.0303 11.9697C13.2966 12.2359 13.3208 12.6526 13.1029 12.9462L13.0303 13.0303C12.7374 13.3232 12.2626 13.3232 11.9697 13.0303L8 9.061L4.03033 13.0303C3.73744 13.3232 3.26256 13.3232 2.96967 13.0303C2.67678 12.7374 2.67678 12.2626 2.96967 11.9697L6.939 8L2.96967 4.03033C2.7034 3.76406 2.6792 3.3474 2.89705 3.05379L2.96967 2.96967Z" />,
+  },
+  conversation: {
+    content: <><path d="m11.99 4.081-.121-.101C10.879 3.178 9.486 2.75 8 2.75c-1.694 0-3.065.44-3.985 1.213-.88.74-1.515 1.918-1.515 3.787 0 1.104.255 1.96.641 2.622.541.81.224 1.65.119 1.906-.073.177-.16.344-.219.455l-.03.057c-.053.1-.09.172-.127.248l-.01.02c.243.18.564.217 1.101.078.233-.06.456-.143.68-.233a5.2 5.2 0 0 0 1.111 1.17q-.134.05-.319.127c-.875.361-2.524 1.042-3.739-.173-.685-.685-.32-1.377-.02-1.942.193-.366.358-.679.19-.901C1.326 10.262 1 9.122 1 7.75c0-4.495 3.134-6.5 7-6.5 2.949 0 5.896 1.422 6.752 4.556a5 5 0 0 0-.619-.62 5.7 5.7 0 0 0-2.143-1.105" /><path fillRule="evenodd" d="M7.245 12.056c-.6-.486-1.054-1.248-1.054-2.469s.454-1.982 1.054-2.469c.644-.521 1.576-.817 2.6-.817 1.185 0 2.094.308 2.681.8.546.46.974 1.21.974 2.486 0 .413-.038.639-.084.797-.044.152-.116.313-.274.58a1.73 1.73 0 0 0-.26 1.193c.044.314.163.564.225.687a6 6 0 0 0 .188.337l.028.05c-.148.105-.319.122-.632.041a4 4 0 0 1-.66-.247 6 6 0 0 0-.33-.139 2 2 0 0 0-.326-.094h-.002c-.078-.015-.366-.072-.716.017-.283.065-.364.065-.812.065-1.024 0-1.956-.296-2.6-.818m3.778 2.208c-.472.11-.682.11-1.17.11h-.008c-2.578 0-5.154-1.477-5.154-4.787s2.576-4.786 5.154-4.786C12.692 4.8 15 6.277 15 9.587c0 1.01-.186 1.505-.593 2.183-.112.15.01.359.162.618.272.466.638 1.093-.09 1.821-1.063 1.063-2.389.48-3.055.187-.205-.09-.348-.153-.401-.132m2.394-.85v-.002Z" clipRule="evenodd" /></>,
+  },
+  codexSidebarExpand: {
+    viewBox: "0 0 20 20",
+    content: <path d="M16.835 8.66301C16.835 7.71885 16.8347 7.05065 16.792 6.52824C16.7605 6.14232 16.7073 5.86904 16.6299 5.65227L16.5439 5.45207C16.32 5.01264 15.9796 4.64498 15.5615 4.3886L15.3779 4.28606C15.1308 4.16013 14.8165 4.08006 14.3018 4.03801C13.7794 3.99533 13.1112 3.99504 12.167 3.99504H7.83301C6.88885 3.99504 6.22065 3.99533 5.69824 4.03801C5.31232 4.06954 5.03904 4.12266 4.82227 4.20012L4.62207 4.28606C4.18264 4.50996 3.81498 4.85035 3.55859 5.26848L3.45605 5.45207C3.33013 5.69922 3.25006 6.01354 3.20801 6.52824C3.16533 7.05065 3.16504 7.71885 3.16504 8.66301V11.3271C3.16504 12.2712 3.16533 12.9394 3.20801 13.4618C3.25006 13.9766 3.33013 14.2909 3.45605 14.538L3.55859 14.7216C3.81498 15.1397 4.18266 15.4801 4.62207 15.704L4.82227 15.79C5.03904 15.8674 5.31234 15.9205 5.69824 15.9521C6.22065 15.9947 6.88885 15.995 7.83301 15.995H12.167C13.1112 15.995 13.7794 15.9947 14.3018 15.9521C14.8164 15.91 15.1308 15.8299 15.3779 15.704L15.5615 15.6015C15.9797 15.3451 16.32 14.9774 16.5439 14.538L16.6299 14.3378C16.7074 14.121 16.7605 13.8478 16.792 13.4618C16.8347 12.9394 16.835 12.2712 16.835 11.3271V8.66301ZM5.00195 13.3329V6.66692C5.00195 6.29965 5.29972 6.00188 5.66699 6.00188C6.03412 6.00204 6.33203 6.29975 6.33203 6.66692V13.3329C6.33203 13.7001 6.03412 13.9978 5.66699 13.998C5.29972 13.998 5.00195 13.7002 5.00195 13.3329ZM18.165 11.3271C18.165 12.2493 18.1653 12.9811 18.1172 13.5702C18.0745 14.0924 17.9916 14.5472 17.8125 14.9648L17.7295 15.1415C17.394 15.8 16.8834 16.3511 16.2568 16.7353L15.9814 16.8896C15.5157 17.1268 15.0069 17.2285 14.4102 17.2773C13.821 17.3254 13.0893 17.3251 12.167 17.3251H7.83301C6.91071 17.3251 6.17898 17.3254 5.58984 17.2773C5.06757 17.2346 4.61294 17.1508 4.19531 16.9716L4.01855 16.8896C3.36014 16.5541 2.80898 16.0434 2.4248 15.4169L2.27051 15.1415C2.03328 14.6758 1.93158 14.167 1.88281 13.5702C1.83468 12.9811 1.83496 12.2493 1.83496 11.3271V8.66301C1.83496 7.74072 1.83468 7.00898 1.88281 6.41985C1.93157 5.82309 2.03329 5.31432 2.27051 4.84856L2.4248 4.57317C2.80898 3.94666 3.36012 3.436 4.01855 3.10051L4.19531 3.0175C4.61285 2.83843 5.06771 2.75548 5.58984 2.71281C6.17898 2.66468 6.91071 2.66496 7.83301 2.66496H12.167C13.0893 2.66496 13.821 2.66468 14.4102 2.71281C15.0069 2.76157 15.5157 2.86329 15.9814 3.10051L16.2568 3.25481C16.8833 3.63898 17.394 4.19012 17.7295 4.84856L17.8125 5.02531C17.9916 5.44285 18.0745 5.89771 18.1172 6.41985C18.1653 7.00898 18.165 7.74072 18.165 8.66301V11.3271Z" />,
+  },
+  copy: {
+    content: <><path fillRule="evenodd" d="M6.08 2.5v1.167h3.834V2.5H6.08Zm-1.5-.083C4.58 1.634 5.216 1 5.998 1h4c.783 0 1.417.634 1.417 1.417V3.75c0 .782-.634 1.417-1.417 1.417h-4A1.417 1.417 0 0 1 4.581 3.75V2.417Z" clipRule="evenodd" /><path fillRule="evenodd" d="M4.087 3.749a.583.583 0 0 0-.583.583l.001 8.583a.583.583 0 0 0 .584.584h7.82a.583.583 0 0 0 .583-.584V4.332a.583.583 0 0 0-.584-.583H11a.75.75 0 0 1 0-1.5h.909a2.083 2.083 0 0 1 2.083 2.083v8.583A2.083 2.083 0 0 1 11.908 15h-7.82a2.083 2.083 0 0 1-2.083-2.084l-.001-8.583A2.084 2.084 0 0 1 4.087 2.25H5a.75.75 0 1 1 0 1.5h-.913Z" clipRule="evenodd" /></>,
+  },
+  createIssue: {
+    content: <><path fillRule="evenodd" clipRule="evenodd" d="M7.25 1C7.66414 1 7.99988 1.33589 8 1.75C8 2.16421 7.66421 2.5 7.25 2.5H4.75C3.50745 2.5 2.50012 3.50744 2.5 4.75V11.25C2.5 12.4926 3.50736 13.5 4.75 13.5H11.25C12.4926 13.5 13.5 12.4926 13.5 11.25V8.75C13.5001 8.33589 13.8359 8 14.25 8C14.6641 8 14.9999 8.33589 15 8.75V11.25C15 13.3211 13.3211 15 11.25 15H4.75C2.67893 15 1 13.3211 1 11.25V4.75C1.00012 2.67905 2.67899 1 4.75 1H7.25Z" /><path fillRule="evenodd" clipRule="evenodd" d="M13.4326 1.26953C13.7913.910937 14.3728.910883 14.7314 1.26953C15.0897 1.6282 15.0899 2.20981 14.7314 2.56836L9.2373 8.06152C8.68101 8.6177 7.94043 8.95161 7.15527 9C7.06754 9.0052 6.99468 8.93248 7 8.84473C7.04847 8.05961 7.38232 7.31897 7.93848 6.7627L13.4326 1.26953Z" /></>,
+  },
+  dashboard: {
+    content: <><path d="M4.75 6a.75.75 0 0 0-.75.75v2a.75.75 0 0 0 1.5 0v-2A.75.75 0 0 0 4.75 6M7 4.75a.75.75 0 0 1 1.5 0v4a.75.75 0 0 1-1.5 0zm4.25.25a.75.75 0 0 0-.75.75v3a.75.75 0 0 0 1.5 0v-3a.75.75 0 0 0-.75-.75" /><path fillRule="evenodd" d="M1.272 2.365C1 2.9 1 3.6 1 5v3.5c0 1.4 0 2.1.272 2.635a2.5 2.5 0 0 0 1.093 1.092C2.9 12.5 3.6 12.5 5 12.5h6c1.4 0 2.1 0 2.635-.273a2.5 2.5 0 0 0 1.092-1.092C15 10.6 15 9.9 15 8.5V5c0-1.4 0-2.1-.273-2.635a2.5 2.5 0 0 0-1.092-1.093C13.1 1 12.4 1 11 1H5c-1.4 0-2.1 0-2.635.272a2.5 2.5 0 0 0-1.093 1.093M11 2.5H5c-.725 0-1.178.001-1.52.03-.324.026-.413.068-.434.079a1 1 0 0 0-.437.437c-.01.02-.053.11-.08.434-.028.342-.029.795-.029 1.52v3.5c0 .725.001 1.178.03 1.52.026.324.068.413.079.434a1 1 0 0 0 .437.437c.02.01.11.053.434.08.342.028.795.029 1.52.029h6c.725 0 1.178-.001 1.52-.03.324-.026.413-.069.434-.079a1 1 0 0 0 .437-.437c.01-.02.053-.11.08-.434.028-.342.029-.795.029-1.52V5c0-.725-.001-1.178-.03-1.52-.026-.324-.069-.413-.079-.434a1 1 0 0 0-.437-.437c-.02-.01-.11-.053-.434-.08-.342-.028-.795-.029-1.52-.029" clipRule="evenodd" /><path d="M4 14.25a.75.75 0 0 1 .75-.75h6.5a.75.75 0 0 1 0 1.5h-6.5a.75.75 0 0 1-.75-.75" /></>,
+  },
+  displayOptions: {
+    content: <><path fillRule="evenodd" clipRule="evenodd" d="M7 2.5C8.11933 2.5 9.06613 3.23584 9.38477 4.25H14.75C15.1642 4.25 15.5 4.58579 15.5 5C15.5 5.41421 15.1642 5.75 14.75 5.75H9.38477C9.06613 6.76416 8.11933 7.5 7 7.5C5.88067 7.5 4.93387 6.76416 4.61523 5.75H2.25C1.83579 5.75 1.5 5.41421 1.5 5C1.5 4.58579 1.83579 4.25 2.25 4.25H4.61523C4.93387 3.23584 5.88067 2.5 7 2.5ZM7 4C6.44772 4 6 4.44772 6 5C6 5.55228 6.44772 6 7 6C7.55228 6 8 5.55228 8 5C8 4.44772 7.55228 4 7 4Z" /><path fillRule="evenodd" clipRule="evenodd" d="M10 13.5C8.88067 13.5 7.93387 12.7642 7.61523 11.75H2.25C1.83579 11.75 1.5 11.4142 1.5 11C1.5 10.5858 1.83579 10.25 2.25 10.25H7.61523C7.93387 9.23584 8.88067 8.5 10 8.5C11.1193 8.5 12.0661 9.23584 12.3848 10.25H14.75C15.1642 10.25 15.5 10.5858 15.5 11C15.5 11.4142 15.1642 11.75 14.75 11.75H12.3848C12.0661 12.7642 11.1193 13.5 10 13.5ZM10 12C10.5523 12 11 11.5523 11 11C11 10.4477 10.5523 10 10 10C9.44772 10 9 10.4477 9 11C9 11.5523 9.44772 12 10 12Z" /></>,
+  },
+  expand: {
+    content: <><path d="M6.2168 8.72266C6.50798 8.42824 6.98279 8.4257 7.27734 8.7168C7.57154 9.00799 7.57423 9.48287 7.2832 9.77734L4.59863 12.5H6.2998C6.71402 12.5 7.0498 12.8358 7.0498 13.25C7.04964 13.6641 6.71392 14 6.2998 14H2.75C2.55116 14 2.36036 13.9208 2.21973 13.7803C2.07915 13.6397 2.00008 13.4488 2 13.25V9.75C2 9.33579 2.33579 9 2.75 9C3.16421 9 3.5 9.33579 3.5 9.75V11.4775L6.2168 8.72266Z" /><path d="M13.25 2C13.4488 2.00006 13.6397 2.07917 13.7803 2.21973C13.9208 2.36033 14 2.55119 14 2.75V6.25C14 6.66414 13.6641 6.99988 13.25 7C12.8358 7 12.5 6.66421 12.5 6.25V4.52246L9.7832 7.27734C9.49206 7.57173 9.01721 7.57419 8.72266 7.2832C8.42838 6.99201 8.42575 6.51716 8.7168 6.22266L11.4014 3.5H9.7002C9.28598 3.5 8.9502 3.16421 8.9502 2.75C8.95028 2.33586 9.28603 2 9.7002 2H13.25Z" /></>,
+  },
+  favorite: {
+    content: <path d="M10.52 4.99 9.46 2.017a1.56 1.56 0 0 0-2.344-.743c-.26.18-.46.434-.572.73L5.482 4.99H2.555a1.56 1.56 0 0 0-1.46 1.017 1.54 1.54 0 0 0 .465 1.72l2.525 2.077-1.061 3.156a1.54 1.54 0 0 0 .56 1.744 1.56 1.56 0 0 0 1.83-.002l2.587-1.88 2.584 1.88a1.56 1.56 0 0 0 2.398-.776c.102-.315.1-.653-.006-.966l-1.061-3.158 2.528-2.078a1.54 1.54 0 0 0 .506-1.574l-.048-.152a1.55 1.55 0 0 0-1.454-1.008zm2.979 1.558a.05.05 0 0 1-.016.024l-2.778 2.284a1.02 1.02 0 0 0-.318 1.108l1.169 3.474a.04.04 0 0 1 0 .027.05.05 0 0 1-.018.024.06.06 0 0 1-.035.011.06.06 0 0 1-.035-.011L8.6 11.404a1.02 1.02 0 0 0-1.199 0l-2.868 2.085a.06.06 0 0 1-.035.01.06.06 0 0 1-.035-.01.05.05 0 0 1-.018-.024.04.04 0 0 1 0-.026l1.169-3.474a1.01 1.01 0 0 0-.318-1.107L2.516 6.57l-.015-.022a.04.04 0 0 1 .002-.026.05.05 0 0 1 .018-.023.06.06 0 0 1 .034-.01h3.267a1.02 1.02 0 0 0 .96-.677L7.96 2.498q-.006.016-.004.017.028-.016.044-.015a.06.06 0 0 1 .034.01.05.05 0 0 1 .018.023l1.167 3.28a1.015 1.015 0 0 0 .96.677h3.266a.06.06 0 0 1 .033.01l.011.011.008.013a.04.04 0 0 1 0 .024" />,
+  },
+  file: {
+    content: <path fillRule="evenodd" d="M8.212 1.013a2.5 2.5 0 0 1 1.52.72l3.536 3.535A2.5 2.5 0 0 1 14 7.035V12.5l-.013.256a2.5 2.5 0 0 1-2.231 2.231L11.5 15h-7l-.256-.013a2.5 2.5 0 0 1-2.231-2.231L2 12.5v-9a2.5 2.5 0 0 1 2.244-2.487L4.5 1h3.465zM4.5 2.5a1 1 0 0 0-1 1v9a1 1 0 0 0 1 1h7a1 1 0 0 0 1-1V7.035q0-.018-.003-.035H8.75A1.75 1.75 0 0 1 7 5.25V2.5zm4 2.75c0 .138.112.25.25.25h2.629L8.672 2.793a1 1 0 0 0-.172-.137z" clipRule="evenodd" />,
+  },
+  filter: {
+    content: <path fillRule="evenodd" clipRule="evenodd" d="M14.25 3a.75.75 0 0 1 0 1.5H1.75a.75.75 0 0 1 0-1.5h12.5ZM4 8a.75.75 0 0 1 .75-.75h6.5a.75.75 0 0 1 0 1.5h-6.5A.75.75 0 0 1 4 8Zm2.75 3.5a.75.75 0 0 0 0 1.5h2.5a.75.75 0 0 0 0-1.5h-2.5Z" />,
+  },
+  folder: {
+    content: <path d="M6.32 3.5H3.75c-.69 0-1.25.56-1.25 1.25v6.5c0 .69.56 1.25 1.25 1.25h8.5c.69 0 1.25-.56 1.25-1.25v-4.5c0-.69-.56-1.25-1.25-1.25H9.08a1.75 1.75 0 0 1-1.27-.545L6.503 3.578A.25.25 0 0 0 6.32 3.5M3.75 2h2.57c.48 0 .939.197 1.27.545l1.308 1.377A.25.25 0 0 0 9.08 4h3.171A2.75 2.75 0 0 1 15 6.75v4.5A2.75 2.75 0 0 1 12.25 14h-8.5A2.75 2.75 0 0 1 1 11.25v-6.5A2.75 2.75 0 0 1 3.75 2" />,
+  },
+  hand: {
+    viewBox: "0 0 24 24",
+    content: <g fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"><path d="M18 11V6a2 2 0 0 0-4 0v5" /><path d="M14 10V4a2 2 0 0 0-4 0v6" /><path d="M10 10.5V6a2 2 0 0 0-4 0v8" /><path d="M6 14v-2a2 2 0 0 0-4 0v2c0 5.523 4.477 10 10 10s10-4.477 10-10V8a2 2 0 0 0-4 0v3" /></g>,
+  },
+  home: {
+    content: <path fillRule="evenodd" d="M2.323 5.68A1 1 0 0 0 2 6.415v8.083a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-3.515a2 2 0 0 1 4 0v3.515a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5V6.416a1 1 0 0 0-.323-.737L9.015 1.396a1.5 1.5 0 0 0-2.03 0z" clipRule="evenodd" />,
+  },
+  label: {
+    content: <><path d="M12 11.5V13H5.132v-1.5zm1.5-1.5V6a1.5 1.5 0 0 0-1.346-1.492L12 4.5H5.133a.5.5 0 0 0-.303.103l-.08.076-2.382 2.834a.5.5 0 0 0-.11.234l-.008.087v.331a.5.5 0 0 0 .118.321l2.382 2.835a.5.5 0 0 0 .383.179V13l-.22-.012a2 2 0 0 1-1.16-.54l-.15-.16L1.218 9.45a2 2 0 0 1-.46-1.11L.75 8.165v-.331a2 2 0 0 1 .363-1.147l.106-.14 2.383-2.834a2 2 0 0 1 1.312-.701L5.134 3H12a3 3 0 0 1 3 3v4a3 3 0 0 1-3.002 3v-1.5a1.5 1.5 0 0 0 1.494-1.347z" /><path d="M5.5 8a1 1 0 1 1 2 0 1 1 0 0 1-2 0" /></>,
+  },
+  link: {
+    content: <path d="M9.306 10.206a.745.745 0 0 1 .066.977l-.066.076-2.458 2.458a3.228 3.228 0 0 1-4.691-4.431l.126-.133L4.74 6.694a.745.745 0 0 1 1.12.978l-.067.076-2.458 2.458a1.738 1.738 0 0 0 2.353 2.555l.105-.097 2.458-2.458a.745.745 0 0 1 1.054 0M9.83 6.17c.29.291.29.763 0 1.054l-2.48 2.48a.745.745 0 1 1-1.054-1.053l2.48-2.48a.745.745 0 0 1 1.054 0m3.887-3.887a3.23 3.23 0 0 1 .126 4.431l-.126.133-2.458 2.459a.745.745 0 0 1-1.12-.978l.067-.076 2.458-2.458a1.738 1.738 0 0 0-2.353-2.555l-.105.097-2.458 2.458a.745.745 0 0 1-1.12-.977l.066-.076 2.459-2.458a3.23 3.23 0 0 1 4.564 0" />,
+  },
+  linkOff: {
+    content: <><path d="M9.306 10.206a.745.745 0 0 1 .066.977l-.066.076-2.458 2.458a3.228 3.228 0 0 1-4.691-4.431l.126-.133L4.74 6.694a.745.745 0 0 1 1.12.978l-.067.076-2.458 2.458a1.738 1.738 0 0 0 2.353 2.555l.105-.097 2.458-2.458a.745.745 0 0 1 1.054 0M9.83 6.17c.29.291.29.763 0 1.054l-2.48 2.48a.745.745 0 1 1-1.054-1.053l2.48-2.48a.745.745 0 0 1 1.054 0m3.887-3.887a3.23 3.23 0 0 1 .126 4.431l-.126.133-2.458 2.459a.745.745 0 0 1-1.12-.978l.067-.076 2.458-2.458a1.738 1.738 0 0 0-2.353-2.555l-.105.097-2.458 2.458a.745.745 0 0 1-1.12-.977l.066-.076 2.459-2.458a3.23 3.23 0 0 1 4.564 0" /><path d="M12.97 1.97a.75.75 0 0 1 1.06 1.06l-11 11a.75.75 0 0 1-1.06-1.06z" /></>,
+  },
+  moon: {
+    content: <><path d="M12.897 2.557c.268.208-.035.62-.373.552A5.5 5.5 0 0 0 11.434 3C8.555 3 6 5.239 6 8s2.553 5 5.435 5q.56-.001 1.09-.11c.337-.068.64.345.372.553A7.47 7.47 0 0 1 8.304 15C4.27 15 1 11.866 1 8s3.27-7 7.304-7c1.74 0 3.339.583 4.593 1.557" /><path d="M9.12 8.195a.218.218 0 0 1 0-.39l.426-.212a4.58 4.58 0 0 0 2.046-2.047l.213-.426c.08-.16.31-.16.39 0l.213.426a4.58 4.58 0 0 0 2.046 2.047l.425.212c.161.08.161.31 0 .39l-.425.212a4.58 4.58 0 0 0-2.046 2.047l-.213.425a.218.218 0 0 1-.39 0l-.213-.425a4.58 4.58 0 0 0-2.046-2.047z" /></>,
+  },
+  myIssues: {
+    content: <path fillRule="evenodd" d="M1 4.75v-.5A3.25 3.25 0 0 1 4.25 1h.5a.75.75 0 0 1 0 1.5h-.5A1.75 1.75 0 0 0 2.5 4.25v.5a.75.75 0 0 1-1.5 0M11.25 1h.5A3.25 3.25 0 0 1 15 4.25v.5l-.004.077a.75.75 0 0 1-1.492 0L13.5 4.75v-.5a1.75 1.75 0 0 0-1.75-1.75h-.5a.75.75 0 0 1 0-1.5m-6.5 13.995h-.5A3.25 3.25 0 0 1 1 11.745v-.5l.004-.077a.75.75 0 0 1 1.492 0l.004.077v.5c0 .967.784 1.75 1.75 1.75h.5a.75.75 0 0 1 0 1.5m6.5.005h.5A3.25 3.25 0 0 0 15 11.75v-.5l-.004-.077a.75.75 0 0 0-1.492 0l-.004.077v.5a1.75 1.75 0 0 1-1.75 1.75h-.5a.75.75 0 0 0 0 1.5M10 8a2 2 0 1 1-4 0 2 2 0 0 1 4 0" clipRule="evenodd" />,
+  },
+  more: {
+    content: <path d="M3 6.5a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Zm5 0a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Zm5 0a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Z" />,
+  },
+  openExternal: {
+    content: <><path d="M6.413 1.313c.241 0 .472-.005.643.166.17.17.266.342.266.583a.817.817 0 0 1-.266.602c-.17.17-.402.166-.643.166h-1.43c-.635-.018-1.144.292-1.485.633-.34.34-.632 1.003-.632 1.485v6.06c0 .481.192 1.044.532 1.384.341.341.904.733 1.386.733h6.259c.482 0 1.144-.292 1.485-.633.341-.34.633-1.003.633-1.485V9.721c0-.24-.005-.472.166-.642.17-.17.301-.267.542-.267a.91.91 0 0 1 .643.267c.17.17.166.401.166.642v1.286a3.635 3.635 0 0 1-3.449 3.63c-.072.004-.113.004-.186.005-2.366.06-3.694.06-6.06 0-.072-.001-.113 0-.186-.004a3.636 3.636 0 0 1-3.444-3.444c-.004-.073-.003-.114-.005-.187-.06-2.365 0-3.693 0-6.059a3.635 3.635 0 0 1 3.636-3.635h1.429Z" /><path d="M14.675 6.063a.75.75 0 1 1-1.5 0v-2.19l-4.148 4.5a.75.75 0 1 1-1.06-1.06l4.148-4.5h-2.19a.75.75 0 0 1 0-1.5h4a.75.75 0 0 1 .75.75v4Z" /></>,
+  },
+  panel: {
+    content: <><path fillRule="evenodd" clipRule="evenodd" d="M4.25 2C2.45508 2 1 3.45508 1 5.25V10.75C1 12.5449 2.45508 14 4.25 14H11.75C13.5449 14 15 12.5449 15 10.75V5.25C15 3.45508 13.5449 2 11.75 2H4.25ZM2.5 5.5C2.5 4.39543 3.39543 3.5 4.5 3.5H11.5C12.6046 3.5 13.5 4.39543 13.5 5.5V10.5C13.5 11.6046 12.6046 12.5 11.5 12.5H4.5C3.39543 12.5 2.5 11.6046 2.5 10.5V5.5Z" /><rect x="10" y="5" width="1.5" height="6" rx=".75" /></>,
+  },
+  pause: {
+    content: <path d="M3.5 3.5a1 1 0 0 1 1-1H6a1 1 0 0 1 1 1v9a1 1 0 0 1-1 1H4.5a1 1 0 0 1-1-1v-9ZM9 3.5a1 1 0 0 1 1-1h1.5a1 1 0 0 1 1 1v9a1 1 0 0 1-1 1H10a1 1 0 0 1-1-1v-9Z" />,
+  },
+  plus: {
+    content: <path d="M8.75 4C8.75 3.58579 8.41421 3.25 8 3.25C7.58579 3.25 7.25 3.58579 7.25 4V7.25H4C3.58579 7.25 3.25 7.58579 3.25 8C3.25 8.41421 3.58579 8.75 4 8.75H7.25V12C7.25 12.4142 7.58579 12.75 8 12.75C8.41421 12.75 8.75 12.4142 8.75 12V8.75H12C12.4142 8.75 12.75 8.41421 12.75 8C12.75 7.58579 12.4142 7.25 12 7.25H8.75V4Z" />,
+  },
+  play: {
+    content: <path d="m5.604 2.41 7.23 4.502a1.375 1.375 0 0 1-.02 2.345L5.585 13.6a1.375 1.375 0 0 1-2.083-1.18V3.576A1.375 1.375 0 0 1 5.604 2.41Z" />,
+  },
+  priority: {
+    content: <><rect x="1" y="8" width="3" height="6" rx="1" /><rect x="6" y="5" width="3" height="9" rx="1" /><rect x="11" y="2" width="3" height="12" rx="1" /></>,
+  },
+  project: {
+    content: <path fillRule="evenodd" d="M7.331 1.07a3.2 3.2 0 0 1 1.338 0c.498.106.967.377 1.904.917l1.354.78c.937.541 1.406.812 1.747 1.19.301.334.53.728.669 1.156.157.484.157 1.025.157 2.107v1.56l-.003.718c-.007.63-.036 1.026-.154 1.389l-.057.158a3.2 3.2 0 0 1-.612.998l-.135.138c-.33.312-.792.578-1.612 1.051l-1.354.78-.623.357c-.55.309-.907.481-1.281.56l-.166.032a3.2 3.2 0 0 1-1.006 0l-.166-.031c-.374-.08-.73-.252-1.281-.561l-.623-.356-1.354-.78c-.82-.474-1.281-.74-1.612-1.052l-.135-.138a3.2 3.2 0 0 1-.612-.998l-.057-.158c-.118-.363-.147-.758-.154-1.39L1.5 8.78V7.22c0-.946 0-1.479.105-1.921l.052-.186c.122-.374.312-.723.56-1.028l.11-.128c.255-.284.583-.507 1.126-.83l.62-.36 1.354-.78c.82-.473 1.281-.739 1.718-.869zM3 7.22v1.56c0 1.183.018 1.439.084 1.643l.064.167q.11.246.292.449l.059.06c.151.143.427.318 1.323.835l1.354.78.632.36c.188.104.33.178.442.233V8.482l-4.247-1.93zm5.75 1.262v4.826c.212-.106.533-.282 1.074-.594l1.354-.78.628-.368c.499-.297.646-.407.754-.527l.113-.14q.158-.218.243-.476l.022-.081c.035-.144.051-.351.058-.835L13 8.78V7.22l-.004-.668zM7.82 2.51l-.177.027c-.159.034-.328.106-.835.39l-.632.359-1.354.78c-.896.517-1.172.692-1.323.834l-.059.06q-.046.051-.086.104l4.645 2.112 4.645-2.112-.084-.103c-.109-.12-.255-.23-.754-.528l-.628-.367-1.354-.78c-.897-.517-1.186-.668-1.386-.728l-.08-.021a1.7 1.7 0 0 0-.538-.027" clipRule="evenodd" />,
+  },
+  recurrence: {
+    content: <path fillRule="evenodd" clipRule="evenodd" d="M15 5C15 2.79086 13.2091 1 11 1H5C2.79086 1 1 2.79086 1 5V11C1 13.2091 2.79086 15 5 15H6.25C6.66421 15 7 14.6642 7 14.25C7 13.8358 6.66421 13.5 6.25 13.5H5C3.61929 13.5 2.5 12.3807 2.5 11V6H13.5V6.25C13.5 6.66421 13.8358 7 14.25 7C14.6642 7 15 6.66421 15 6.25V5ZM11 7.25C10.5858 7.25 10.25 7.58579 10.25 8C10.25 8.41421 10.5858 8.75 11 8.75C12.2426 8.75 13.25 9.75736 13.25 11H12.6403C12.2622 11 12.0952 11.4761 12.3904 11.7123L13.7501 12.8001C13.8962 12.917 14.1038 12.917 14.2499 12.8001L15.6095 11.7123C15.9048 11.4761 15.7378 11 15.3597 11H14.75C14.75 8.92893 13.071 7.25 11 7.25ZM6.64029 11H7.24998C7.24998 13.0711 8.92891 14.75 11 14.75C11.4142 14.75 11.75 14.4142 11.75 14C11.75 13.5858 11.4142 13.25 11 13.25C9.75734 13.25 8.74998 12.2426 8.74998 11H9.35967C9.73778 11 9.9048 10.5239 9.60955 10.2877L8.24986 9.1999C8.10377 9.08303 7.89619 9.08303 7.7501 9.1999L6.39041 10.2877C6.09516 10.5239 6.26218 11 6.64029 11Z" />,
+  },
+  search: {
+    content: <path fillRule="evenodd" clipRule="evenodd" d="M7 2C9.76142 2 12 4.23858 12 7C12 8.11012 11.6375 9.13519 11.0254 9.96484L13.7803 12.7197L13.832 12.7764C14.0723 13.0709 14.0549 13.5057 13.7803 13.7803C13.5057 14.0549 13.0709 14.0723 12.7764 13.832L12.7197 13.7803L9.96484 11.0254C9.13519 11.6375 8.11012 12 7 12C4.23858 12 2 9.76142 2 7C2 4.23858 4.23858 2 7 2ZM7 3.5C5.067 3.5 3.5 5.067 3.5 7C3.5 8.933 5.067 10.5 7 10.5C8.933 10.5 10.5 8.933 10.5 7C10.5 5.067 8.933 3.5 7 3.5Z" />,
+  },
+  send: {
+    content: <path d="M11.48 5.674a.75.75 0 1 1-.96 1.152L8.75 5.351v6.899a.75.75 0 0 1-1.5 0V5.351L5.48 6.826a.75.75 0 0 1-.96-1.152l3-2.5a.75.75 0 0 1 .96 0l3 2.5Z" />,
+  },
+  shieldAlert: {
+    viewBox: "0 0 24 24",
+    content: <g fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"><path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1Z" /><path d="M12 8v4" /><path d="M12 16h.01" /></g>,
+  },
+  status: {
+    content: <path d="M13.5 8C13.5 4.96243 11.0376 2.5 8 2.5C4.96243 2.5 2.5 4.96243 2.5 8C2.5 11.0376 4.96243 13.5 8 13.5C11.0376 13.5 13.5 11.0376 13.5 8ZM15 8C15 11.866 11.866 15 8 15C4.13401 15 1 11.866 1 8C1 4.13401 4.13401 1 8 1C11.866 1 15 4.13401 15 8ZM12 8C12 10.2091 10.2091 12 8 12V4C10.2091 4 12 5.79086 12 8Z" />,
+  },
+  statusBacklog: {
+    content: <path fillRule="evenodd" d="m14.94 8.914-1.982-.258a5 5 0 0 0 0-1.312l1.983-.258a7 7 0 0 1 0 1.828M14.47 5.32a7 7 0 0 0-.915-1.581l-1.586 1.218q.4.52.653 1.13zm-2.207-2.874-1.22 1.586a5 5 0 0 0-1.129-.653l.767-1.848c.569.236 1.1.545 1.582.915M8.914 1.06l-.258 1.983a5 5 0 0 0-1.312 0L7.086 1.06a7 7 0 0 1 1.828 0m-3.594.472.767 1.848a5 5 0 0 0-1.13.653L3.74 2.446a7 7 0 0 1 1.581-.915M2.446 3.74l1.586 1.218a5 5 0 0 0-.653 1.13L1.53 5.32a7 7 0 0 1 .915-1.581M1.06 7.086a7 7 0 0 0 0 1.828l1.983-.258a5 5 0 0 1 0-1.312zm.472 3.594 1.848-.767q.254.61.653 1.13l-1.586 1.219a7 7 0 0 1-.915-1.582m2.208 2.874 1.218-1.586q.52.4 1.13.653L5.32 14.47a7 7 0 0 1-1.581-.915m3.347 1.387.258-1.983a5 5 0 0 0 1.312 0l.258 1.983a7 7 0 0 1-1.828 0m3.594-.472-.767-1.848a5 5 0 0 0 1.13-.653l1.219 1.586a7 7 0 0 1-1.582.915m2.874-2.207-1.586-1.22c.265-.344.485-.723.653-1.129l1.848.767a7 7 0 0 1-.915 1.582" clipRule="evenodd" />,
+  },
+  statusTodo: {
+    content: <path fillRule="evenodd" d="M8 13.5a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14" clipRule="evenodd" />,
+  },
+  statusStarted: {
+    content: <path d="M8 1a7 7 0 1 1 0 14A7 7 0 0 1 8 1m0 1.5a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11M8 4a4 4 0 0 1 0 8z" />,
+  },
+  statusDone: {
+    content: <path fillRule="evenodd" d="M8 1a7 7 0 1 0 0 14A7 7 0 0 0 8 1m4.101 5.101a.85.85 0 1 0-1.202-1.202L6.5 9.298 5.101 7.899a.85.85 0 1 0-1.202 1.202l2 2a.85.85 0 0 0 1.202 0z" clipRule="evenodd" />,
+  },
+  statusCanceled: {
+    content: <path fillRule="evenodd" d="M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14ZM6.53 5.47 8 6.94l1.47-1.47a.75.75 0 1 1 1.06 1.06L9.06 8l1.47 1.47a.75.75 0 1 1-1.06 1.06L8 9.06l-1.47 1.47a.75.75 0 1 1-1.06-1.06L6.94 8 5.47 6.53a.75.75 0 0 1 1.06-1.06Z" clipRule="evenodd" />,
+  },
+  sun: {
+    content: <path d="M8.759 14.24a.76.76 0 0 1-1.52 0v-1.48a.76.76 0 1 1 1.52 0zm-3.587-3.413a.76.76 0 0 0-1.075 0L3.05 11.873a.76.76 0 1 0 1.075 1.075l1.047-1.046a.76.76 0 0 0 0-1.075m5.657 0a.76.76 0 0 0 0 1.074l1.046 1.047a.76.76 0 1 0 1.075-1.075l-1.047-1.046a.76.76 0 0 0-1.074 0m-.715-4.943a3 3 0 1 1-4.242 4.242 3 3 0 0 1 4.242-4.242M3.05 4.123a.76.76 0 1 1 1.075-1.075l1.047 1.047A.76.76 0 1 1 4.097 5.17zm8.825-1.074a.76.76 0 1 1 1.075 1.074L11.903 5.17a.76.76 0 1 1-1.075-1.075zm2.365 4.19a.76.76 0 1 1 0 1.52h-1.48a.76.76 0 0 1 0-1.52zM4 7.998a.76.76 0 0 0-.76-.76H1.76a.76.76 0 1 0 0 1.52h1.48c.42 0 .76-.34.76-.76M7.998 4c.42 0 .76-.34.76-.76V1.76a.76.76 0 0 0-1.52 0v1.48c0 .42.34.76.76.76" />,
+  },
+  terminal: {
+    viewBox: "0 0 24 24",
+    content: <g fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"><rect width="18" height="18" x="3" y="3" rx="3" /><path d="m7 8 3 3-3 3" /><path d="M12 16h5" /></g>,
+  },
+  trash: {
+    content: <path fillRule="evenodd" d="M12.369 6.5a.5.5 0 0 1 .486.615l-1.492 6.343A2 2 0 0 1 9.416 15H6.584a2 2 0 0 1-1.947-1.542L3.145 7.115A.5.5 0 0 1 3.63 6.5zM8.5 1A2.5 2.5 0 0 1 11 3.5h2a1 1 0 0 1 1 1V5a.5.5 0 0 1-.5.5h-11A.5.5 0 0 1 2 5v-.5a1 1 0 0 1 1-1h2A2.5 2.5 0 0 1 7.5 1zm0 1.5h-1a1 1 0 0 0-1 1h3a1 1 0 0 0-1-1" clipRule="evenodd" />,
+  },
+  write: {
+    content: <path d="M1 13.25a.75.75 0 0 1 .75-.75h12.5a.75.75 0 0 1 0 1.5H1.75a.75.75 0 0 1-.75-.75m12.697-9.486a1.033 1.033 0 1 0-1.46-1.461l-.937.936L12.76 4.7zM11.7 5.761 10.24 4.3 6.055 8.483A3.63 3.63 0 0 0 5 10.825a.165.165 0 0 0 .175.175 3.63 3.63 0 0 0 2.342-1.056z" />,
+  },
+} satisfies Record<string, { viewBox?: string; content: ReactNode }>;
+
+export type LinearIconName = keyof typeof ICONS;
+
+interface LinearIconProps extends Omit<SVGProps<SVGSVGElement>, "children"> {
+  name: LinearIconName;
+  title?: string;
+}
+
+export function LinearIcon({ name, title, style, ...props }: LinearIconProps) {
+  const icon: { viewBox?: string; content: ReactNode } = ICONS[name];
+  return (
+    <svg
+      data-linear-icon={name}
+      viewBox={icon.viewBox ?? "0 0 16 16"}
+      width="1em"
+      height="1em"
+      fill="currentColor"
+      focusable="false"
+      role={title ? "img" : undefined}
+      aria-hidden={title ? undefined : true}
+      style={{ fill: "currentColor", stroke: "none", ...style }}
+      {...props}
+    >
+      {title && <title>{title}</title>}
+      {icon.content}
+    </svg>
+  );
+}
+
+const STATUS_ICON_NAMES: Record<TaskStatus, LinearIconName> = {
+  backlog: "statusBacklog",
+  todo: "statusTodo",
+  in_progress: "statusStarted",
+  in_review: "statusStarted",
+  blocked: "alert",
+  done: "statusDone",
+  canceled: "statusCanceled",
+};
+
+export function LinearStatusIcon({ status, ...props }: { status: TaskStatus } & Omit<LinearIconProps, "name">) {
+  return <LinearIcon name={STATUS_ICON_NAMES[status]} {...props} />;
+}
+
+export function LinearPriorityIcon({ priority, style, ...props }: { priority: TaskPriority } & Omit<SVGProps<SVGSVGElement>, "children">) {
+  let content: ReactNode;
+  if (priority === "urgent") {
+    content = <path d="M3 1C1.91067 1 1 1.91067 1 3V13C1 14.0893 1.91067 15 3 15H13C14.0893 15 15 14.0893 15 13V3C15 1.91067 14.0893 1 13 1H3ZM7 4L9 4L8.75391 8.99836H7.25L7 4ZM9 11C9 11.5523 8.55228 12 8 12C7.44772 12 7 11.5523 7 11C7 10.4477 7.44772 10 8 10C8.55228 10 9 10.4477 9 11Z" />;
+  } else if (priority === "none") {
+    content = <><rect x="1.5" y="7.25" width="3" height="1.5" rx=".5" opacity=".9" /><rect x="6.5" y="7.25" width="3" height="1.5" rx=".5" opacity=".9" /><rect x="11.5" y="7.25" width="3" height="1.5" rx=".5" opacity=".9" /></>;
+  } else {
+    content = <><rect x="1.5" y="8" width="3" height="6" rx="1" /><rect x="6.5" y="5" width="3" height="9" rx="1" fillOpacity={priority === "low" ? .4 : 1} /><rect x="11.5" y="2" width="3" height="12" rx="1" fillOpacity={priority === "high" ? 1 : .4} /></>;
+  }
+
+  return <svg data-linear-icon={`priority-${priority}`} viewBox="0 0 16 16" width="1em" height="1em" fill="currentColor" focusable="false" aria-hidden="true" style={{ fill: "currentColor", stroke: "none", ...style }} {...props}>{content}</svg>;
+}
diff --git a/apps/codex-taskboard/web/src/components/PendingAttachments.tsx b/apps/codex-taskboard/web/src/components/PendingAttachments.tsx
new file mode 100644
index 000000000..dc2325ff0
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/PendingAttachments.tsx
@@ -0,0 +1,61 @@
+import { LinearIcon } from "./LinearIcon";
+
+export const MAX_ATTACHMENT_SIZE = 25 * 1024 * 1024;
+
+export function fileKey(file: File): string {
+  return `${file.name}:${file.size}:${file.lastModified}`;
+}
+
+export function clipboardImages(data: DataTransfer): File[] {
+  const images = Array.from(data.items)
+    .filter((item) => item.kind === "file" && item.type.startsWith("image/"))
+    .flatMap((item) => {
+      const file = item.getAsFile();
+      return file ? [file] : [];
+    });
+  return images.length > 0
+    ? images
+    : Array.from(data.files).filter((file) => file.type.startsWith("image/"));
+}
+
+function fileSize(value: number): string {
+  if (value < 1024) return `${value} B`;
+  if (value < 1024 * 1024) return `${(value / 1024).toFixed(value < 10 * 1024 ? 1 : 0)} KB`;
+  return `${(value / (1024 * 1024)).toFixed(value < 10 * 1024 * 1024 ? 1 : 0)} MB`;
+}
+
+interface PendingAttachmentsProps {
+  files: File[];
+  disabled: boolean;
+  uploadLabel: string;
+  ariaLabel: string;
+  className?: string;
+  onRemove: (index: number) => void;
+}
+
+export function PendingAttachments({
+  files,
+  disabled,
+  uploadLabel,
+  ariaLabel,
+  className = "",
+  onRemove,
+}: PendingAttachmentsProps) {
+  if (files.length === 0) return null;
+
+  return (
+    <div className={`pending-attachments ${className}`.trim()}>
+      <ul className="composer-attachment-list" aria-label={ariaLabel}>
+        {files.map((file, index) => (
+          <li key={fileKey(file)}>
+            <span className="composer-attachment-file-icon" aria-hidden="true"><LinearIcon name="file" /></span>
+            <span className="composer-attachment-copy"><strong>{file.name}</strong><span>{fileSize(file.size)} · {uploadLabel}</span></span>
+            <button type="button" disabled={disabled} aria-label={`移除 ${file.name}`} onClick={() => onRemove(index)}>
+              <LinearIcon name="close" />
+            </button>
+          </li>
+        ))}
+      </ul>
+    </div>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/ProjectAutomationMenu.tsx b/apps/codex-taskboard/web/src/components/ProjectAutomationMenu.tsx
new file mode 100644
index 000000000..24fc3a199
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/ProjectAutomationMenu.tsx
@@ -0,0 +1,288 @@
+import { useEffect, useLayoutEffect, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import {
+  AUTOMATION_MODELS,
+  getAutomationModel,
+  withAutomationModel,
+  type AutomationModel,
+  type AutomationReasoningEffort,
+} from "../../../shared/taskboard-automation-options.mjs";
+import { LinearIcon } from "./LinearIcon";
+
+type AutomationStatus = "ACTIVE" | "PAUSED";
+type AutomationQuotaState = "available" | "blocked" | "unknown" | "unavailable";
+type IntervalMinutes = 5 | 10 | 15 | 30 | 60;
+
+interface AutomationOptions {
+  enabledByUser: boolean;
+  quotaAware: boolean;
+  intervalMinutes: IntervalMinutes;
+  model: AutomationModel;
+  reasoningEffort: AutomationReasoningEffort;
+}
+
+interface AutomationState extends AutomationOptions {
+  status: AutomationStatus;
+  quota?: {
+    state: AutomationQuotaState;
+    checkedAt: number;
+    resetsAt?: number;
+    reason?: "api-key";
+  };
+}
+
+interface ProjectAutomationMenuProps {
+  automation?: Partial<AutomationState>;
+  pending: boolean;
+  error: string | null;
+  unavailableReason: string | null;
+  onOpen: () => void;
+  onChange: (options: AutomationOptions) => void;
+}
+
+const DEFAULT_OPTIONS: AutomationOptions = {
+  enabledByUser: false,
+  quotaAware: false,
+  intervalMinutes: 5,
+  model: "gpt-5.5",
+  reasoningEffort: "high",
+};
+
+const EFFORT_LABELS: Record<AutomationReasoningEffort, string> = {
+  low: "轻度",
+  medium: "中",
+  high: "高",
+  xhigh: "极高 (xhigh)",
+  max: "最高",
+  ultra: "极高 (ultra)",
+};
+
+export function ProjectAutomationMenu({
+  automation,
+  pending,
+  error,
+  unavailableReason,
+  onOpen,
+  onChange,
+}: ProjectAutomationMenuProps) {
+  const triggerRef = useRef<HTMLButtonElement>(null);
+  const menuRef = useRef<HTMLDivElement>(null);
+  const wasPendingRef = useRef(pending);
+  const [open, setOpen] = useState(false);
+  const [position, setPosition] = useState({ left: 0, top: 0, ready: false });
+  const [draft, setDraft] = useState<AutomationOptions>(DEFAULT_OPTIONS);
+  const status = automation?.status ?? "PAUSED";
+  const quota = automation?.quota;
+  const stateLabel = !automation?.enabledByUser
+    ? "已暂停"
+    : automation.quotaAware && quota?.state === "blocked"
+      ? "额度暂停"
+      : automation.quotaAware && quota?.state === "unavailable"
+        ? "额度不可用"
+        : automation.quotaAware && (!quota || quota.state === "unknown")
+          ? "额度未知"
+          : status === "ACTIVE"
+            ? "运行中"
+            : "已暂停";
+  const disabled = pending || Boolean(unavailableReason);
+
+  useEffect(() => {
+    if (!open) return;
+    setDraft({ ...DEFAULT_OPTIONS, ...automation });
+  }, [open]);
+
+  useEffect(() => {
+    if (wasPendingRef.current && !pending) {
+      setDraft({ ...DEFAULT_OPTIONS, ...automation });
+    }
+    wasPendingRef.current = pending;
+  }, [automation, pending]);
+
+  useLayoutEffect(() => {
+    if (!open || !triggerRef.current || !menuRef.current) return;
+    const trigger = triggerRef.current.getBoundingClientRect();
+    const menu = menuRef.current.getBoundingClientRect();
+    const left = Math.max(8, Math.min(trigger.right - menu.width, window.innerWidth - menu.width - 8));
+    const top = trigger.bottom + 8 + menu.height <= window.innerHeight
+      ? trigger.bottom + 8
+      : Math.max(8, trigger.top - menu.height - 8);
+    setPosition({ left, top, ready: true });
+  }, [open]);
+
+  useEffect(() => {
+    if (!open) return;
+    function closeFromOutside(event: PointerEvent) {
+      if (!menuRef.current?.contains(event.target as Node) && !triggerRef.current?.contains(event.target as Node)) {
+        setOpen(false);
+      }
+    }
+    function closeFromViewportChange() {
+      setOpen(false);
+    }
+    function closeFromEscape(event: KeyboardEvent) {
+      if (event.key === "Escape") {
+        setOpen(false);
+        triggerRef.current?.focus();
+      }
+    }
+    document.addEventListener("pointerdown", closeFromOutside);
+    document.addEventListener("keydown", closeFromEscape);
+    window.addEventListener("resize", closeFromViewportChange);
+    window.addEventListener("scroll", closeFromViewportChange, true);
+    return () => {
+      document.removeEventListener("pointerdown", closeFromOutside);
+      document.removeEventListener("keydown", closeFromEscape);
+      window.removeEventListener("resize", closeFromViewportChange);
+      window.removeEventListener("scroll", closeFromViewportChange, true);
+    };
+  }, [open]);
+
+  const submitChange = (next: AutomationOptions) => {
+    if (disabled) return;
+    setDraft(next);
+    onChange(next);
+  };
+
+  const menu = open ? createPortal(
+    <div
+      ref={menuRef}
+      className="project-automation-menu no-drag"
+      role="dialog"
+      aria-label="自动认领待办设置"
+      style={{ left: position.left, top: position.top, visibility: position.ready ? "visible" : "hidden" }}
+    >
+      <div className="project-automation-menu-heading">
+        <strong>自动认领待办</strong>
+        <span className={status === "ACTIVE" ? "is-active" : "is-paused"}>
+          {stateLabel}
+        </span>
+      </div>
+      <div className="project-automation-switch">
+        <span>自动认领开关</span>
+        <button
+          type="button"
+          className={`board-setting-switch${draft.enabledByUser ? " is-on" : ""}`}
+          role="switch"
+          aria-checked={draft.enabledByUser}
+          disabled={disabled}
+          onClick={() => submitChange({
+            ...draft,
+            enabledByUser: !draft.enabledByUser,
+          })}
+        >
+          <span aria-hidden="true" />
+        </button>
+      </div>
+      <div className="project-automation-switch">
+        <span>根据额度启用/关闭</span>
+        <button
+          type="button"
+          className={`board-setting-switch${draft.quotaAware ? " is-on" : ""}`}
+          role="switch"
+          aria-checked={draft.quotaAware}
+          disabled={disabled}
+          onClick={() => submitChange({
+            ...draft,
+            quotaAware: !draft.quotaAware,
+          })}
+        >
+          <span aria-hidden="true" />
+        </button>
+      </div>
+      {draft.quotaAware && (
+        <div className={`project-automation-quota is-${quota?.state ?? "unknown"}`}>
+          {quota?.state === "available" && "当前额度可用"}
+          {quota?.state === "blocked" && (
+            quota.resetsAt
+              ? `额度已用尽，预计 ${formatResetTime(quota.resetsAt)} 恢复`
+              : "额度已用尽，自动认领已暂停"
+          )}
+          {quota?.state === "unavailable" && (
+            quota.reason === "api-key"
+              ? "API Key 模式不支持读取 Codex App 额度"
+              : "当前账户无法读取额度"
+          )}
+          {(!quota || quota.state === "unknown") && "额度状态未知，自动认领已暂停"}
+        </div>
+      )}
+      <label className="project-automation-field">
+        <span>间隔</span>
+        <select
+          value={draft.intervalMinutes}
+          disabled={disabled}
+          onChange={(event) => submitChange({
+            ...draft,
+            intervalMinutes: Number(event.target.value) as IntervalMinutes,
+          })}
+        >
+          {[5, 10, 15, 30, 60].map((minutes) => <option key={minutes} value={minutes}>{minutes} 分钟</option>)}
+        </select>
+      </label>
+      <label className="project-automation-field">
+        <span>模型</span>
+        <select
+          value={draft.model}
+          disabled={disabled}
+          onChange={(event) => submitChange(withAutomationModel(draft, event.target.value as AutomationModel))}
+        >
+          {AUTOMATION_MODELS.map((model) => (
+            <option key={model.slug} value={model.slug}>{model.label}</option>
+          ))}
+        </select>
+      </label>
+      <label className="project-automation-field">
+        <span>推理强度</span>
+        <select
+          value={draft.reasoningEffort}
+          disabled={disabled}
+          onChange={(event) => submitChange({
+            ...draft,
+            reasoningEffort: event.target.value as AutomationReasoningEffort,
+          })}
+        >
+          {getAutomationModel(draft.model).efforts.map((effort) => (
+            <option key={effort} value={effort}>{EFFORT_LABELS[effort]}</option>
+          ))}
+        </select>
+      </label>
+      {unavailableReason && <p className="project-automation-note">{unavailableReason}</p>}
+      {error && error !== unavailableReason && <p className="project-automation-error" role="alert">{error}</p>}
+    </div>,
+    document.body,
+  ) : null;
+
+  return (
+    <>
+      <button
+        ref={triggerRef}
+        type="button"
+        className={`project-automation-trigger no-drag ${status === "ACTIVE" ? "is-active" : "is-paused"}`}
+        aria-label={status === "ACTIVE" ? "自动认领" : "无自动化"}
+        aria-busy={pending}
+        aria-haspopup="dialog"
+        aria-expanded={open}
+        title={status === "ACTIVE" ? "自动认领" : "无自动化"}
+        onClick={() => {
+          if (!open) {
+            setPosition((current) => ({ ...current, ready: false }));
+            onOpen();
+          }
+          setOpen((current) => !current);
+        }}
+      >
+        <LinearIcon name={status === "ACTIVE" ? "play" : "pause"} />
+        <span>{status === "ACTIVE" ? "自动认领" : "无自动化"}</span>
+      </button>
+      {menu}
+    </>
+  );
+}
+
+function formatResetTime(value: number) {
+  return new Intl.DateTimeFormat("zh-CN", {
+    month: "numeric",
+    day: "numeric",
+    hour: "2-digit",
+    minute: "2-digit",
+  }).format(new Date(value * 1_000));
+}
diff --git a/apps/codex-taskboard/web/src/components/TaskCard.tsx b/apps/codex-taskboard/web/src/components/TaskCard.tsx
new file mode 100644
index 000000000..d6aae28de
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/TaskCard.tsx
@@ -0,0 +1,207 @@
+import type { CSSProperties, MouseEvent } from "react";
+import type { HierarchyTrailItem } from "../taskHierarchy";
+import { TASK_STATUSES, type Task, type TaskPriority, type TaskStatus } from "../types";
+import { ActorAvatar } from "./ActorAvatar";
+import { LinearIcon, LinearPriorityIcon } from "./LinearIcon";
+
+const PRIORITY_LABELS: Record<TaskPriority, string> = {
+  none: "无优先级",
+  urgent: "紧急",
+  high: "高优先级",
+  medium: "中优先级",
+  low: "低优先级",
+};
+
+interface TaskCardProps {
+  task: Task;
+  statusIndex: number;
+  hierarchyDepth?: number;
+  parentTrail?: readonly HierarchyTrailItem[];
+  descendantCount?: number;
+  isDragging: boolean;
+  isSelected: boolean;
+  dragShift: number;
+  isMoving: boolean;
+  isSettling: boolean;
+  isContextMenuOpen: boolean;
+  onEdit: (task: Task) => void;
+  onSelectionChange: (task: Task, selected: boolean) => void;
+  onContextMenu: (task: Task, position: { x: number; y: number }) => void;
+  onMove: (task: Task, status: TaskStatus) => void;
+  onDragStart: (task: Task, height: number) => void;
+  onDragEnd: () => void;
+  onOpenThread: (threadId: string, workspacePath?: string, threadTitle?: string) => void;
+}
+
+export function TaskCard({
+  task,
+  statusIndex,
+  hierarchyDepth = 0,
+  parentTrail = [],
+  descendantCount = 0,
+  isDragging,
+  isSelected,
+  dragShift,
+  isMoving,
+  isSettling,
+  isContextMenuOpen,
+  onEdit,
+  onSelectionChange,
+  onContextMenu,
+  onMove,
+  onDragStart,
+  onDragEnd,
+  onOpenThread,
+}: TaskCardProps) {
+  const dueDate = task.dueDate
+    ? new Intl.DateTimeFormat("zh-CN", { month: "short", day: "numeric" }).format(new Date(`${task.dueDate}T12:00:00`))
+    : null;
+  const subIssueTotal = task.relations.subIssues.length;
+  const completedSubIssues = task.relations.subIssues.filter((issue) => issue.status === "done").length;
+  const activeBlockers = task.relations.blockedBy.filter((issue) => (
+    issue.status !== "done" && issue.status !== "canceled"
+  )).length;
+  const visualHierarchyDepth = Math.min(Math.max(hierarchyDepth, 0), 4);
+  const parentTrailLabel = parentTrail.map((item) => item.identifier).join(" / ");
+  const parentTrailTitle = parentTrail.map((item) => `${item.identifier} ${item.title}`).join(" / ");
+  const cardStyle = {
+    transform: dragShift ? `translate3d(0, ${dragShift}px, 0)` : undefined,
+    "--hierarchy-indent": visualHierarchyDepth > 0 ? `${visualHierarchyDepth * 10}px` : undefined,
+  } as CSSProperties;
+
+  function stopThen(callback: () => void) {
+    return (event: MouseEvent<HTMLButtonElement>) => {
+      event.stopPropagation();
+      callback();
+    };
+  }
+
+  return (
+    <article
+      className={`task-card priority-${task.priority}${visualHierarchyDepth > 0 ? " is-hierarchy-child" : ""}${isSelected ? " is-selected" : ""}${isDragging ? " is-dragging" : ""}${dragShift ? " is-drag-shifted" : ""}${isMoving ? " is-moving" : ""}${isSettling ? " is-settling" : ""}${isContextMenuOpen ? " is-context-open" : ""}`}
+      style={cardStyle}
+      draggable={!isMoving}
+      aria-labelledby={`task-${task.id}-title`}
+      aria-selected={isSelected}
+      data-task-id={task.id}
+      data-drag-shift={dragShift || undefined}
+      onContextMenu={(event) => {
+        event.preventDefault();
+        event.stopPropagation();
+        onContextMenu(task, { x: event.clientX, y: event.clientY });
+      }}
+      onDragStart={(event) => {
+        event.dataTransfer.effectAllowed = "move";
+        event.dataTransfer.setData("text/plain", task.id);
+        event.dataTransfer.setData("application/x-taskboard-task", task.id);
+        onDragStart(task, event.currentTarget.offsetHeight);
+      }}
+      onDragEnd={onDragEnd}
+    >
+      <button
+        className="task-card-open"
+        type="button"
+        aria-label={`打开 ${task.identifier}: ${task.title}`}
+        onClick={(event) => {
+          if (event.metaKey || event.ctrlKey) {
+            onSelectionChange(task, !isSelected);
+            return;
+          }
+          onEdit(task);
+        }}
+      />
+
+      <div className="card-topline">
+        <span className="card-reference">
+          <span className="task-identifier">{task.identifier}</span>
+          {task.relations.parent && (
+            <>
+              <LinearIcon name="chevronRight" />
+              <span className="card-parent-title" title={task.relations.parent.title}>
+                {task.relations.parent.title}
+              </span>
+            </>
+          )}
+        </span>
+        <ActorAvatar actor={task.assignee} className="card-assignee-avatar" />
+        <div className="card-actions" aria-label="移动任务">
+          <button
+            className="icon-button compact"
+            type="button"
+            disabled={statusIndex === 0 || isMoving}
+            aria-label="移到上一状态"
+            title="移到上一状态"
+            onClick={stopThen(() => onMove(task, TASK_STATUSES[statusIndex - 1]))}
+          >
+            <LinearIcon name="chevronLeft" />
+          </button>
+          <button
+            className="icon-button compact"
+            type="button"
+            disabled={statusIndex === TASK_STATUSES.length - 1 || isMoving}
+            aria-label="移到下一状态"
+            title="移到下一状态"
+            onClick={stopThen(() => onMove(task, TASK_STATUSES[statusIndex + 1]))}
+          >
+            <LinearIcon name="chevronRight" />
+          </button>
+        </div>
+      </div>
+
+      <h3 id={`task-${task.id}-title`}>{task.title}</h3>
+
+      {parentTrail.length > 0 && (
+        <div className="card-hierarchy-trail" title={parentTrailTitle}>
+          <LinearIcon name="branch" />
+          <span>上级 {parentTrailLabel}</span>
+        </div>
+      )}
+
+      <div className="card-properties" aria-label="任务属性">
+        <span className={`priority-icon priority-icon-${task.priority}`} title={PRIORITY_LABELS[task.priority]}>
+          <LinearPriorityIcon priority={task.priority} />
+        </span>
+        {activeBlockers > 0 && (
+          <span className="blocked-by-count" title={`被 ${activeBlockers} 个未完成任务阻塞`}>
+            <LinearIcon name="alert" />
+            {activeBlockers}
+          </span>
+        )}
+        {subIssueTotal > 0 && (
+          <span className="sub-issue-progress-chip" title={`${completedSubIssues}/${subIssueTotal} 个子任务已完成`}>
+            <span className="sub-issue-progress" aria-hidden="true" />
+            {completedSubIssues}/{subIssueTotal}
+          </span>
+        )}
+        {descendantCount > subIssueTotal && (
+          <span className="sub-issue-depth-chip" title={`共 ${descendantCount} 个下级任务`}>
+            <LinearIcon name="branch" />
+            {descendantCount}
+          </span>
+        )}
+        {task.labels.slice(0, 2).map((label) => (
+          <span className="label-chip" key={label}>{label}</span>
+        ))}
+        {task.labels.length > 2 && (
+          <span className="label-more" title={task.labels.slice(2).join(", ")}>+{task.labels.length - 2}</span>
+        )}
+        {dueDate && (
+          <span className="due-date-chip" title={`截止日期 ${task.dueDate}`}>
+            <LinearIcon name="calendar" /> {dueDate}
+          </span>
+        )}
+        {task.threadId && (
+          <button
+            className="thread-link"
+            type="button"
+            aria-label={`查看对话 ${task.threadId}`}
+            title={`查看对话 ${task.threadId}`}
+            onClick={stopThen(() => onOpenThread(task.threadId!, undefined, task.title))}
+          >
+            <LinearIcon name="conversation" />
+          </button>
+        )}
+      </div>
+    </article>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/TaskContextMenu.tsx b/apps/codex-taskboard/web/src/components/TaskContextMenu.tsx
new file mode 100644
index 000000000..37db308ae
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/TaskContextMenu.tsx
@@ -0,0 +1,418 @@
+import {
+  useEffect,
+  useLayoutEffect,
+  useRef,
+  useState,
+  type CSSProperties,
+  type KeyboardEvent as ReactKeyboardEvent,
+  type ReactNode,
+} from "react";
+import { createPortal } from "react-dom";
+import {
+  TASK_PRIORITIES,
+  TASK_STATUSES,
+  type Task,
+  type TaskPriority,
+  type TaskStatus,
+} from "../types";
+import { STATUS_DETAILS } from "./BoardColumn";
+import { LinearIcon, LinearPriorityIcon, LinearStatusIcon } from "./LinearIcon";
+
+type SubmenuName = "status" | "priority" | "labels" | "copy";
+
+const PRIORITY_LABELS: Record<TaskPriority, string> = {
+  none: "无优先级",
+  urgent: "紧急",
+  high: "高",
+  medium: "中",
+  low: "低",
+};
+
+interface TaskContextMenuProps {
+  task: Task;
+  position: { x: number; y: number };
+  labels: string[];
+  onClose: () => void;
+  onEdit: (task: Task) => void;
+  onStatusChange: (task: Task, status: TaskStatus) => void;
+  onPriorityChange: (task: Task, priority: TaskPriority) => void;
+  onLabelsChange: (task: Task, labels: string[]) => void;
+  onDuplicate: (task: Task) => void;
+  onCopy: (text: string, announcement: string) => void;
+  onOpenInThread: (task: Task) => void;
+  onArchive: (task: Task) => void;
+}
+
+interface MenuItemProps {
+  label: string;
+  icon?: ReactNode;
+  shortcut?: string;
+  checked?: boolean;
+  danger?: boolean;
+  disabled?: boolean;
+  submenu?: SubmenuName;
+  submenuOpen?: boolean;
+  rootShortcut?: string;
+  onPointerEnter?: () => void;
+  onClick?: () => void;
+  children?: ReactNode;
+}
+
+function MenuItem({
+  label,
+  icon,
+  shortcut,
+  checked,
+  danger,
+  disabled,
+  submenu,
+  submenuOpen,
+  rootShortcut,
+  onPointerEnter,
+  onClick,
+  children,
+}: MenuItemProps) {
+  return (
+    <div className="context-menu-item-anchor">
+      <button
+        type="button"
+        role={checked === undefined ? "menuitem" : "menuitemradio"}
+        aria-checked={checked}
+        aria-haspopup={submenu ? "menu" : undefined}
+        aria-expanded={submenu ? submenuOpen : undefined}
+        className={`context-menu-item${danger ? " is-danger" : ""}`}
+        disabled={disabled}
+        data-submenu={submenu}
+        data-root-shortcut={rootShortcut}
+        data-open={submenuOpen ? "true" : undefined}
+        onPointerEnter={onPointerEnter}
+        onClick={onClick}
+      >
+        <span className="context-menu-icon">{icon}</span>
+        <span className="context-menu-label">{label}</span>
+        {shortcut && <span className="context-menu-shortcut">{shortcut}</span>}
+        {checked && <span className="context-menu-check"><LinearIcon name="check" /></span>}
+        {submenu && <span className="context-menu-chevron"><LinearIcon name="chevronRight" /></span>}
+      </button>
+      {children}
+    </div>
+  );
+}
+
+export function TaskContextMenu({
+  task,
+  position,
+  labels,
+  onClose,
+  onEdit,
+  onStatusChange,
+  onPriorityChange,
+  onLabelsChange,
+  onDuplicate,
+  onCopy,
+  onOpenInThread,
+  onArchive,
+}: TaskContextMenuProps) {
+  const menuRef = useRef<HTMLDivElement>(null);
+  const submenuTimerRef = useRef<number | null>(null);
+  const [submenu, setSubmenu] = useState<SubmenuName | null>(null);
+  const [placedPosition, setPlacedPosition] = useState(position);
+  const [submenuSide, setSubmenuSide] = useState<"left" | "right">("right");
+  const [submenuShift, setSubmenuShift] = useState(0);
+
+  function closeThen(action: () => void) {
+    onClose();
+    action();
+  }
+
+  function openSubmenu(name: SubmenuName, focus = false) {
+    if (submenuTimerRef.current !== null) window.clearTimeout(submenuTimerRef.current);
+    setSubmenu(name);
+    if (focus) {
+      requestAnimationFrame(() => {
+        menuRef.current
+          ?.querySelector<HTMLElement>(`[data-submenu-panel="${name}"] .context-menu-item:not(:disabled)`)
+          ?.focus();
+      });
+    }
+  }
+
+  function scheduleSubmenu(name: SubmenuName) {
+    if (submenuTimerRef.current !== null) window.clearTimeout(submenuTimerRef.current);
+    submenuTimerRef.current = window.setTimeout(() => openSubmenu(name), 300);
+  }
+
+  function closeSubmenu() {
+    if (submenuTimerRef.current !== null) window.clearTimeout(submenuTimerRef.current);
+    setSubmenu(null);
+  }
+
+  useLayoutEffect(() => {
+    const menu = menuRef.current;
+    if (!menu) return;
+    const rect = menu.getBoundingClientRect();
+    const x = Math.max(8, Math.min(position.x, window.innerWidth - rect.width - 8));
+    const y = Math.max(8, Math.min(position.y, window.innerHeight - rect.height - 8));
+    setPlacedPosition((current) => current.x === x && current.y === y ? current : { x, y });
+    setSubmenuSide(x + rect.width + 196 > window.innerWidth - 8 ? "left" : "right");
+  }, [position.x, position.y]);
+
+  useLayoutEffect(() => {
+    if (!submenu) {
+      setSubmenuShift(0);
+      return;
+    }
+    const panel = menuRef.current?.querySelector<HTMLElement>(`[data-submenu-panel="${submenu}"]`);
+    if (!panel) return;
+    const rect = panel.getBoundingClientRect();
+    const shift = rect.bottom > window.innerHeight - 8
+      ? window.innerHeight - 8 - rect.bottom
+      : rect.top < 8
+        ? 8 - rect.top
+        : 0;
+    setSubmenuShift(shift);
+  }, [submenu, placedPosition]);
+
+  useEffect(() => {
+    const previousFocus = document.activeElement as HTMLElement | null;
+    requestAnimationFrame(() => menuRef.current?.querySelector<HTMLElement>(".context-menu-item:not(:disabled)")?.focus());
+
+    function closeFromOutside(event: PointerEvent) {
+      if (!menuRef.current?.contains(event.target as Node)) onClose();
+    }
+    function closeFromViewportChange() {
+      onClose();
+    }
+
+    document.addEventListener("pointerdown", closeFromOutside);
+    window.addEventListener("blur", closeFromViewportChange);
+    window.addEventListener("resize", closeFromViewportChange);
+    window.addEventListener("scroll", closeFromViewportChange, true);
+    return () => {
+      if (submenuTimerRef.current !== null) window.clearTimeout(submenuTimerRef.current);
+      document.removeEventListener("pointerdown", closeFromOutside);
+      window.removeEventListener("blur", closeFromViewportChange);
+      window.removeEventListener("resize", closeFromViewportChange);
+      window.removeEventListener("scroll", closeFromViewportChange, true);
+      previousFocus?.focus?.({ preventScroll: true });
+    };
+  }, [onClose]);
+
+  function buttonsIn(menu: HTMLElement): HTMLButtonElement[] {
+    return Array.from(menu.querySelectorAll<HTMLButtonElement>(
+      ":scope > .context-menu-group > .context-menu-item-anchor > .context-menu-item:not(:disabled), :scope > .context-menu-item-anchor > .context-menu-item:not(:disabled)",
+    ));
+  }
+
+  function handleKeyDown(event: ReactKeyboardEvent<HTMLDivElement>) {
+    const current = event.target as HTMLButtonElement;
+    const activeMenu = current.closest<HTMLElement>('[role="menu"]');
+    if (!activeMenu) return;
+
+    if (event.key === "Escape") {
+      event.preventDefault();
+      onClose();
+      return;
+    }
+
+    if (event.key === "ArrowLeft" && activeMenu.classList.contains("context-submenu")) {
+      event.preventDefault();
+      const owner = submenu;
+      setSubmenu(null);
+      requestAnimationFrame(() => menuRef.current?.querySelector<HTMLElement>(`[data-submenu="${owner}"]`)?.focus());
+      return;
+    }
+
+    if (event.key === "ArrowRight" && current.dataset.submenu) {
+      event.preventDefault();
+      openSubmenu(current.dataset.submenu as SubmenuName, true);
+      return;
+    }
+
+    if (["ArrowDown", "ArrowUp", "Home", "End", "Tab"].includes(event.key)) {
+      event.preventDefault();
+      const buttons = buttonsIn(activeMenu);
+      if (!buttons.length) return;
+      if (event.key === "Home") buttons[0].focus();
+      else if (event.key === "End") buttons.at(-1)?.focus();
+      else {
+        const direction = event.key === "ArrowUp" || (event.key === "Tab" && event.shiftKey) ? -1 : 1;
+        const index = Math.max(0, buttons.indexOf(current));
+        buttons[(index + direction + buttons.length) % buttons.length].focus();
+      }
+      return;
+    }
+
+    if (!event.metaKey && !event.ctrlKey && !event.altKey && event.key.length === 1) {
+      const shortcut = menuRef.current?.querySelector<HTMLButtonElement>(
+        `[data-root-shortcut="${event.key.toLowerCase()}"]`,
+      );
+      if (shortcut?.dataset.submenu) {
+        event.preventDefault();
+        shortcut.focus();
+        openSubmenu(shortcut.dataset.submenu as SubmenuName, true);
+      }
+    }
+  }
+
+  const menu = (
+    <div
+      ref={menuRef}
+      className="task-context-menu"
+      role="menu"
+      aria-label={`${task.identifier} 操作`}
+      data-submenu-side={submenuSide}
+      style={{ left: placedPosition.x, top: placedPosition.y }}
+      onKeyDown={handleKeyDown}
+      onContextMenu={(event) => event.preventDefault()}
+    >
+      <div className="context-menu-group">
+        <MenuItem
+          label="状态"
+          icon={<LinearIcon name="status" />}
+          shortcut="S"
+          submenu="status"
+          submenuOpen={submenu === "status"}
+          rootShortcut="s"
+          onPointerEnter={() => scheduleSubmenu("status")}
+          onClick={() => openSubmenu("status", true)}
+        >
+          {submenu === "status" && (
+            <div className="context-submenu" role="menu" data-submenu-panel="status" style={{ "--submenu-shift": `${submenuShift}px` } as CSSProperties}>
+              {TASK_STATUSES.map((status, index) => (
+                <MenuItem
+                  key={status}
+                  label={STATUS_DETAILS[status].label}
+                  icon={<LinearStatusIcon status={status} className={`status-icon-${STATUS_DETAILS[status].tone}`} />}
+                  shortcut={String(index + 1)}
+                  checked={task.status === status}
+                  onClick={() => closeThen(() => onStatusChange(task, status))}
+                />
+              ))}
+            </div>
+          )}
+        </MenuItem>
+
+        <MenuItem
+          label="优先级"
+          icon={<LinearPriorityIcon priority={task.priority} />}
+          shortcut="P"
+          submenu="priority"
+          submenuOpen={submenu === "priority"}
+          rootShortcut="p"
+          onPointerEnter={() => scheduleSubmenu("priority")}
+          onClick={() => openSubmenu("priority", true)}
+        >
+          {submenu === "priority" && (
+            <div className="context-submenu" role="menu" data-submenu-panel="priority" style={{ "--submenu-shift": `${submenuShift}px` } as CSSProperties}>
+              {TASK_PRIORITIES.map((priority, index) => (
+                <MenuItem
+                  key={priority}
+                  label={PRIORITY_LABELS[priority]}
+                  icon={<LinearPriorityIcon priority={priority} />}
+                  shortcut={String(index)}
+                  checked={task.priority === priority}
+                  onClick={() => closeThen(() => onPriorityChange(task, priority))}
+                />
+              ))}
+            </div>
+          )}
+        </MenuItem>
+
+        <MenuItem
+          label="标签"
+          icon={<LinearIcon name="label" />}
+          shortcut="L"
+          submenu="labels"
+          submenuOpen={submenu === "labels"}
+          rootShortcut="l"
+          onPointerEnter={() => scheduleSubmenu("labels")}
+          onClick={() => openSubmenu("labels", true)}
+        >
+          {submenu === "labels" && (
+            <div className="context-submenu labels-submenu" role="menu" data-submenu-panel="labels" style={{ "--submenu-shift": `${submenuShift}px` } as CSSProperties}>
+              {labels.length ? labels.map((label) => {
+                const selected = task.labels.includes(label);
+                return (
+                  <MenuItem
+                    key={label}
+                    label={label}
+                    icon={<LinearIcon name="label" />}
+                    checked={selected}
+                    onClick={() => closeThen(() => onLabelsChange(
+                      task,
+                      selected ? task.labels.filter((value) => value !== label) : [...task.labels, label],
+                    ))}
+                  />
+                );
+              }) : (
+                <MenuItem label="暂无可用标签" disabled />
+              )}
+              <div className="context-menu-divider" role="separator" />
+              <MenuItem
+                label="在编辑器中管理…"
+                icon={<LinearIcon name="write" />}
+                onClick={() => closeThen(() => onEdit(task))}
+              />
+            </div>
+          )}
+        </MenuItem>
+      </div>
+
+      <div className="context-menu-divider" role="separator" />
+
+      <div className="context-menu-group">
+        <MenuItem
+          label="编辑任务"
+          icon={<LinearIcon name="write" />}
+          shortcut="↵"
+          onPointerEnter={closeSubmenu}
+          onClick={() => closeThen(() => onEdit(task))}
+        />
+        <MenuItem
+          label="创建副本"
+          icon={<LinearIcon name="copy" />}
+          onPointerEnter={closeSubmenu}
+          onClick={() => closeThen(() => onDuplicate(task))}
+        />
+        <MenuItem
+          label="复制"
+          icon={<LinearIcon name="copy" />}
+          submenu="copy"
+          submenuOpen={submenu === "copy"}
+          onPointerEnter={() => scheduleSubmenu("copy")}
+          onClick={() => openSubmenu("copy", true)}
+        >
+          {submenu === "copy" && (
+            <div className="context-submenu" role="menu" data-submenu-panel="copy" style={{ "--submenu-shift": `${submenuShift}px` } as CSSProperties}>
+              <MenuItem label="复制任务 ID" onClick={() => closeThen(() => onCopy(task.identifier, `${task.identifier} 已复制。`))} />
+              <MenuItem label="复制标题" onClick={() => closeThen(() => onCopy(task.title, "任务标题已复制。"))} />
+              <MenuItem label="复制 Markdown" onClick={() => closeThen(() => onCopy(`**${task.identifier}** ${task.title}`, "Markdown 已复制。"))} />
+            </div>
+          )}
+        </MenuItem>
+        <MenuItem
+          label="在对话中打开"
+          icon={<LinearIcon name="link" />}
+          onPointerEnter={closeSubmenu}
+          onClick={() => closeThen(() => onOpenInThread(task))}
+        />
+      </div>
+
+      <div className="context-menu-divider" role="separator" />
+
+      <div className="context-menu-group">
+        <MenuItem
+          label="归档任务"
+          icon={<LinearIcon name="trash" />}
+          shortcut="⌘⌫"
+          danger
+          onPointerEnter={closeSubmenu}
+          onClick={() => closeThen(() => onArchive(task))}
+        />
+      </div>
+    </div>
+  );
+
+  return createPortal(menu, document.body);
+}
diff --git a/apps/codex-taskboard/web/src/components/TaskDetail.tsx b/apps/codex-taskboard/web/src/components/TaskDetail.tsx
new file mode 100644
index 000000000..57e25e330
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/TaskDetail.tsx
@@ -0,0 +1,1316 @@
+import { useEffect, useRef, useState, type KeyboardEvent } from "react";
+import ReactMarkdown from "react-markdown";
+import remarkGfm from "remark-gfm";
+import {
+  ApiError,
+  attachmentContentUrl,
+  createComment,
+  deleteAttachment,
+  deleteComment,
+  listAttachments,
+  listComments,
+  uploadAttachment,
+  uploadCommentAttachment,
+  updateComment,
+} from "../api";
+import { TASK_STATUSES } from "../types";
+import type {
+  ActorIdentity,
+  Attachment,
+  Comment,
+  DevelopmentContext,
+  DevelopmentScan,
+  IssueRelationType,
+  Recurrence,
+  Task,
+  TaskDraft,
+  TaskPriority,
+  TaskRelationSummary,
+  TaskStatus,
+  WorkflowOption,
+} from "../types";
+import {
+  CODEX_AGENT_ACTOR,
+  actorKey,
+  assigneeTargetForActor,
+} from "../actors";
+import { ActorAvatar } from "./ActorAvatar";
+import { STATUS_DETAILS } from "./BoardColumn";
+import { LabelPicker } from "./LabelPicker";
+import { LinearIcon, LinearPriorityIcon, LinearStatusIcon } from "./LinearIcon";
+import {
+  fileKey,
+  MAX_ATTACHMENT_SIZE,
+  PendingAttachments,
+} from "./PendingAttachments";
+import {
+  createInlineMediaSegments,
+  InlineMediaComposer,
+  inlineMediaImages,
+  inlineMediaText,
+  resolveInlineMediaMarkdown,
+  serializeInlineMedia,
+  type InlineMediaComposerHandle,
+  type InlineMediaSegment,
+} from "./InlineMediaComposer";
+import {
+  IssueParentLink,
+  IssueRelationSidebar,
+  IssueSubIssues,
+  type RelationMutationResult,
+} from "./IssueRelations";
+
+const PRIORITY_DETAILS: Record<TaskPriority, { label: string; bars: number }> = {
+  none: { label: "无优先级", bars: 0 },
+  urgent: { label: "紧急", bars: 3 },
+  high: { label: "高", bars: 3 },
+  medium: { label: "中", bars: 2 },
+  low: { label: "低", bars: 1 },
+};
+
+interface TaskDetailProps {
+  task: Task;
+  tasks: Task[];
+  currentUser: ActorIdentity;
+  availableLabels: string[];
+  workflows: WorkflowOption[];
+  developmentScan: DevelopmentScan;
+  developmentScanLoading: boolean;
+  commentsRevision: number;
+  attachmentsRevision: number;
+  onUpdate: (task: Task, changes: Partial<TaskDraft>) => Promise<Task>;
+  onArchive: (task: Task) => Promise<void>;
+  onRestore: (task: Task) => Promise<void>;
+  onDelete: (task: Task) => Promise<void>;
+  onOpenTask: (task: TaskRelationSummary) => void;
+  onAddRelation: (
+    task: Task,
+    type: IssueRelationType,
+    relatedTaskId: string,
+  ) => Promise<RelationMutationResult>;
+  onRemoveRelation: (
+    task: Task,
+    type: IssueRelationType,
+    relatedTaskId: string,
+  ) => Promise<RelationMutationResult>;
+  onContinueThread: (task: Task, threadId: string) => void;
+  onOpenThread: (threadId: string, workspacePath?: string, threadTitle?: string) => void;
+  onOpenInThread: (task: Task) => void;
+  openingThread: boolean;
+  onError: (message: string | null) => void;
+  onAnnounce: (message: string) => void;
+}
+
+function messageFor(error: unknown): string {
+  if (error instanceof ApiError) return error.message;
+  if (error instanceof Error) return error.message;
+  return "操作未完成，请重试。";
+}
+
+function exactTime(value: string): string {
+  return new Intl.DateTimeFormat("zh-CN", {
+    dateStyle: "medium",
+    timeStyle: "short",
+  }).format(new Date(value));
+}
+
+function relativeTime(value: string): string {
+  const seconds = Math.round((new Date(value).getTime() - Date.now()) / 1000);
+  const formatter = new Intl.RelativeTimeFormat("zh-CN", { numeric: "auto" });
+  if (Math.abs(seconds) < 60) return formatter.format(seconds, "second");
+  const minutes = Math.round(seconds / 60);
+  if (Math.abs(minutes) < 60) return formatter.format(minutes, "minute");
+  const hours = Math.round(minutes / 60);
+  if (Math.abs(hours) < 24) return formatter.format(hours, "hour");
+  const days = Math.round(hours / 24);
+  if (Math.abs(days) < 30) return formatter.format(days, "day");
+  return new Intl.DateTimeFormat("zh-CN", { month: "short", day: "numeric" }).format(new Date(value));
+}
+
+function resizeTextarea(element: HTMLTextAreaElement | null) {
+  if (!element) return;
+  element.style.height = "0px";
+  element.style.height = `${element.scrollHeight}px`;
+}
+
+function fileSize(value: number): string {
+  if (value < 1024) return `${value} B`;
+  if (value < 1024 * 1024) return `${(value / 1024).toFixed(value < 10 * 1024 ? 1 : 0)} KB`;
+  return `${(value / (1024 * 1024)).toFixed(value < 10 * 1024 * 1024 ? 1 : 0)} MB`;
+}
+
+function contextValue(context: DevelopmentContext | null): string {
+  return context ? JSON.stringify(context) : "";
+}
+
+function contextLabel(context: DevelopmentContext): string {
+  if (context.type === "branch") return context.branch;
+  const folder = context.path.split(/[\\/]/).filter(Boolean).at(-1) ?? context.path;
+  return `${context.branch ?? "detached"} · ${folder}`;
+}
+
+function DescriptionDocument({ value }: { value: string }) {
+  return (
+    <div className="issue-description-document">
+      <ReactMarkdown
+        remarkPlugins={[remarkGfm]}
+        components={{
+          a: ({ node: _node, ...props }) => <a {...props} target="_blank" rel="noreferrer" />,
+        }}
+      >
+        {value}
+      </ReactMarkdown>
+    </div>
+  );
+}
+
+function ConversationLink({
+  threadId,
+  threadTitle,
+  onContinue,
+  onOpen,
+}: {
+  threadId: string;
+  threadTitle?: string;
+  onContinue: (threadId: string) => void;
+  onOpen: (threadId: string, workspacePath?: string, threadTitle?: string) => void;
+}) {
+  return (
+    <div className="issue-conversation-link">
+      <button
+        className="issue-conversation-primary"
+        type="button"
+        title={`在当前页面继续对话 ${threadId}`}
+        onClick={() => onContinue(threadId)}
+      >
+        <LinearIcon name="conversation" />
+        <strong>继续对话</strong>
+        <span className="conversation-divider" aria-hidden="true" />
+        <span className="conversation-thread-id">{threadId}</span>
+      </button>
+      <button
+        className="issue-conversation-open"
+        type="button"
+        aria-label={`跳转到对话 ${threadId}`}
+        title="跳转到原对话"
+        onClick={() => onOpen(threadId, undefined, threadTitle)}
+      >
+        <LinearIcon name="openExternal" />
+      </button>
+    </div>
+  );
+}
+
+export function TaskDetail({
+  task,
+  tasks,
+  currentUser,
+  availableLabels,
+  workflows,
+  developmentScan,
+  developmentScanLoading,
+  commentsRevision,
+  attachmentsRevision,
+  onUpdate,
+  onArchive,
+  onRestore,
+  onDelete,
+  onOpenTask,
+  onAddRelation,
+  onRemoveRelation,
+  onContinueThread,
+  onOpenThread,
+  onOpenInThread,
+  openingThread,
+  onError,
+  onAnnounce,
+}: TaskDetailProps) {
+  const [currentTask, setCurrentTask] = useState(task);
+  const [title, setTitle] = useState(task.title);
+  const [description, setDescription] = useState(task.description);
+  const [editingDescription, setEditingDescription] = useState(false);
+  const [labelMenuOpen, setLabelMenuOpen] = useState(false);
+  const [savingProperty, setSavingProperty] = useState<string | null>(null);
+  const [attachments, setAttachments] = useState<Attachment[]>([]);
+  const [attachmentsLoading, setAttachmentsLoading] = useState(true);
+  const [attachmentsError, setAttachmentsError] = useState<string | null>(null);
+  const [uploadingAttachments, setUploadingAttachments] = useState(false);
+  const [pendingAttachmentDelete, setPendingAttachmentDelete] = useState<Attachment | null>(null);
+  const [deletingAttachment, setDeletingAttachment] = useState(false);
+  const [comments, setComments] = useState<Comment[]>([]);
+  const [commentsLoading, setCommentsLoading] = useState(true);
+  const [commentsError, setCommentsError] = useState<string | null>(null);
+  const [commentSegments, setCommentSegments] = useState<InlineMediaSegment[]>(
+    () => createInlineMediaSegments(
+      window.localStorage.getItem(`taskboard.comment-draft.${task.id}`) ?? "",
+    ),
+  );
+  const [pendingCommentFiles, setPendingCommentFiles] = useState<File[]>([]);
+  const [submitting, setSubmitting] = useState(false);
+  const [activeMenuId, setActiveMenuId] = useState<string | null>(null);
+  const [editingId, setEditingId] = useState<string | null>(null);
+  const [editingBody, setEditingBody] = useState("");
+  const [savingCommentId, setSavingCommentId] = useState<string | null>(null);
+  const [pendingDelete, setPendingDelete] = useState<Comment | null>(null);
+  const [deleting, setDeleting] = useState(false);
+  const [pendingIssueArchive, setPendingIssueArchive] = useState(false);
+  const [archivingIssue, setArchivingIssue] = useState(false);
+  const [restoringIssue, setRestoringIssue] = useState(false);
+  const [pendingIssueDelete, setPendingIssueDelete] = useState(false);
+  const [deletingIssue, setDeletingIssue] = useState(false);
+  const titleRef = useRef<HTMLTextAreaElement>(null);
+  const descriptionRef = useRef<HTMLTextAreaElement>(null);
+  const composerRef = useRef<InlineMediaComposerHandle>(null);
+  const attachmentInputRef = useRef<HTMLInputElement>(null);
+  const commentAttachmentInputRef = useRef<HTMLInputElement>(null);
+  const workflowAvailable = !currentTask.workflowId
+    || workflows.some((workflow) => workflow.id === currentTask.workflowId);
+  const draft = serializeInlineMedia(commentSegments);
+  const commentInlineImages = inlineMediaImages(commentSegments);
+
+  useEffect(() => {
+    setCurrentTask(task);
+    if (document.activeElement !== titleRef.current) setTitle(task.title);
+    if (document.activeElement !== descriptionRef.current) setDescription(task.description);
+  }, [task]);
+
+  useEffect(() => {
+    resizeTextarea(titleRef.current);
+    resizeTextarea(descriptionRef.current);
+  }, [title, description, editingDescription]);
+
+  useEffect(() => {
+    if (!editingDescription) return;
+    requestAnimationFrame(() => {
+      descriptionRef.current?.focus();
+      resizeTextarea(descriptionRef.current);
+    });
+  }, [editingDescription]);
+
+  useEffect(() => {
+    const controller = new AbortController();
+    setCommentsError(null);
+    void listComments(task.id, controller.signal).then(
+      (nextComments) => {
+        setComments(nextComments);
+        setCommentsLoading(false);
+      },
+      (error) => {
+        if ((error as Error).name === "AbortError") return;
+        setCommentsError(messageFor(error));
+        setCommentsLoading(false);
+      },
+    );
+    return () => controller.abort();
+  }, [commentsRevision, task.id]);
+
+  useEffect(() => {
+    const controller = new AbortController();
+    setAttachmentsLoading(true);
+    setAttachmentsError(null);
+    void listAttachments(task.id, controller.signal).then(
+      (nextAttachments) => {
+        setAttachments(nextAttachments.filter((attachment) => !attachment.commentId));
+        setAttachmentsLoading(false);
+      },
+      (error) => {
+        if ((error as Error).name === "AbortError") return;
+        setAttachmentsError(messageFor(error));
+        setAttachmentsLoading(false);
+      },
+    );
+    return () => controller.abort();
+  }, [attachmentsRevision, task.id]);
+
+  useEffect(() => {
+    const key = `taskboard.comment-draft.${task.id}`;
+    const text = inlineMediaText(commentSegments);
+    if (text) window.localStorage.setItem(key, text);
+    else window.localStorage.removeItem(key);
+  }, [commentSegments, task.id]);
+
+  useEffect(() => {
+    function handleShortcut(event: globalThis.KeyboardEvent) {
+      if (event.key.toLowerCase() !== "r" || event.metaKey || event.ctrlKey || event.altKey) return;
+      const target = event.target as HTMLElement | null;
+      if (target?.matches("input, textarea, select, [contenteditable='true']")) return;
+      event.preventDefault();
+      composerRef.current?.focus();
+    }
+    window.addEventListener("keydown", handleShortcut);
+    return () => window.removeEventListener("keydown", handleShortcut);
+  }, []);
+
+  useEffect(() => {
+    if (!activeMenuId) return;
+    function closeMenu(event: PointerEvent) {
+      const target = event.target as HTMLElement;
+      if (!target.closest(`[data-comment-menu-root="${activeMenuId}"]`)) setActiveMenuId(null);
+    }
+    function closeWithEscape(event: globalThis.KeyboardEvent) {
+      if (event.key === "Escape") setActiveMenuId(null);
+    }
+    document.addEventListener("pointerdown", closeMenu);
+    window.addEventListener("keydown", closeWithEscape);
+    return () => {
+      document.removeEventListener("pointerdown", closeMenu);
+      window.removeEventListener("keydown", closeWithEscape);
+    };
+  }, [activeMenuId]);
+
+  async function saveTask(changes: Partial<TaskDraft>, property: string) {
+    setSavingProperty(property);
+    onError(null);
+    try {
+      const saved = await onUpdate(currentTask, changes);
+      setCurrentTask(saved);
+      setTitle(saved.title);
+      setDescription(saved.description);
+      onAnnounce(`${saved.identifier} 已更新。`);
+      return saved;
+    } catch (error) {
+      onError(messageFor(error));
+      setTitle(currentTask.title);
+      setDescription(currentTask.description);
+      return null;
+    } finally {
+      setSavingProperty(null);
+    }
+  }
+
+  async function applyRelationMutation(
+    mutation: () => Promise<RelationMutationResult>,
+  ): Promise<RelationMutationResult> {
+    onError(null);
+    try {
+      const result = await mutation();
+      const nextCurrent = result.task.id === currentTask.id
+        ? result.task
+        : result.relatedTask.id === currentTask.id
+          ? result.relatedTask
+          : null;
+      if (nextCurrent) setCurrentTask(nextCurrent);
+      return result;
+    } catch (error) {
+      onError(messageFor(error));
+      throw error;
+    }
+  }
+
+  function handleTitleKeyDown(event: KeyboardEvent<HTMLTextAreaElement>) {
+    if (event.key === "Enter" && !event.shiftKey) {
+      event.preventDefault();
+      event.currentTarget.blur();
+    }
+    if (event.key === "Escape") {
+      setTitle(currentTask.title);
+      event.currentTarget.blur();
+    }
+  }
+
+  async function saveTitle() {
+    const normalized = title.trim();
+    if (!normalized) {
+      setTitle(currentTask.title);
+      onError("任务标题不能为空。");
+      return;
+    }
+    if (normalized === currentTask.title) {
+      setTitle(normalized);
+      return;
+    }
+    await saveTask({ title: normalized }, "title");
+  }
+
+  async function saveDescription() {
+    const normalized = description.trim();
+    if (normalized === currentTask.description) return;
+    await saveTask({ description: normalized }, "description");
+  }
+
+  async function submitComment() {
+    const body = draft.trim();
+    if ((!body && pendingCommentFiles.length === 0 && commentInlineImages.length === 0) || submitting) return;
+    setSubmitting(true);
+    setCommentsError(null);
+    try {
+      const comment = await createComment(task.id, body);
+      const [results, inlineAttachments] = await Promise.all([
+        Promise.allSettled(
+          pendingCommentFiles.map((file) => uploadCommentAttachment(comment.id, file)),
+        ),
+        Promise.all(
+          commentInlineImages.map((image) => uploadCommentAttachment(comment.id, image.file)),
+        ),
+      ]);
+      const uploaded = results.flatMap((result) => result.status === "fulfilled" ? [result.value] : []);
+      const nextComment = commentInlineImages.length > 0
+        ? await updateComment(
+            comment,
+            resolveInlineMediaMarkdown(body, commentInlineImages, inlineAttachments),
+          )
+        : { ...comment, attachments: [...comment.attachments, ...uploaded] };
+      setComments((current) => [...current, nextComment]);
+      setCommentSegments(createInlineMediaSegments());
+      setPendingCommentFiles([]);
+      if (commentAttachmentInputRef.current) commentAttachmentInputRef.current.value = "";
+      const failed = results.length - uploaded.length;
+      if (failed > 0) setCommentsError(`评论已发布，但有 ${failed} 个附件上传失败。`);
+      else onAnnounce(
+        uploaded.length + inlineAttachments.length > 0
+          ? "评论和附件已发布。"
+          : "评论已发布。",
+      );
+      requestAnimationFrame(() => composerRef.current?.focus());
+    } catch (error) {
+      setCommentsError(messageFor(error));
+    } finally {
+      setSubmitting(false);
+    }
+  }
+
+  function stageCommentFiles(files: FileList | File[]) {
+    const selected = Array.from(files);
+    const oversized = selected.find((file) => file.size > MAX_ATTACHMENT_SIZE);
+    if (oversized) {
+      setCommentsError(`“${oversized.name}” 超过 25 MB，无法上传。`);
+      if (commentAttachmentInputRef.current) commentAttachmentInputRef.current.value = "";
+      return;
+    }
+    setCommentsError(null);
+    setPendingCommentFiles((current) => {
+      const existing = new Set(current.map(fileKey));
+      return [...current, ...selected.filter((file) => !existing.has(fileKey(file)))];
+    });
+  }
+
+  function handleSubmitShortcut(event: KeyboardEvent<HTMLTextAreaElement>) {
+    if (event.key === "Enter" && (event.metaKey || event.ctrlKey)) {
+      event.preventDefault();
+      void submitComment();
+    }
+  }
+
+  function beginEdit(comment: Comment) {
+    setEditingId(comment.id);
+    setEditingBody(comment.body);
+    setActiveMenuId(null);
+  }
+
+  async function saveComment(comment: Comment) {
+    const body = editingBody.trim();
+    if (!body || body === comment.body) {
+      if (body === comment.body) setEditingId(null);
+      return;
+    }
+    setSavingCommentId(comment.id);
+    setCommentsError(null);
+    try {
+      const updated = await updateComment(comment, body);
+      setComments((current) => current.map((item) => item.id === updated.id ? updated : item));
+      setEditingId(null);
+      onAnnounce("评论已更新。");
+    } catch (error) {
+      setCommentsError(messageFor(error));
+    } finally {
+      setSavingCommentId(null);
+    }
+  }
+
+  async function confirmDelete() {
+    if (!pendingDelete || deleting) return;
+    setDeleting(true);
+    setCommentsError(null);
+    try {
+      await deleteComment(pendingDelete);
+      setComments((current) => current.filter((comment) => comment.id !== pendingDelete.id));
+      setPendingDelete(null);
+      onAnnounce("评论已删除。");
+    } catch (error) {
+      setCommentsError(messageFor(error));
+    } finally {
+      setDeleting(false);
+    }
+  }
+
+  async function uploadFiles(files: FileList) {
+    const selected = Array.from(files);
+    if (selected.length === 0 || uploadingAttachments) return;
+    const oversized = selected.find((file) => file.size > MAX_ATTACHMENT_SIZE);
+    if (oversized) {
+      setAttachmentsError(`“${oversized.name}” 超过 25 MB，无法上传。`);
+      if (attachmentInputRef.current) attachmentInputRef.current.value = "";
+      return;
+    }
+
+    setUploadingAttachments(true);
+    setAttachmentsError(null);
+    let uploaded = 0;
+    try {
+      for (const file of selected) {
+        const attachment = await uploadAttachment(task.id, file);
+        setAttachments((current) => current.some((item) => item.id === attachment.id)
+          ? current
+          : [...current, attachment]);
+        uploaded += 1;
+      }
+      onAnnounce(uploaded === 1 ? "附件已上传。" : `${uploaded} 个附件已上传。`);
+    } catch (error) {
+      setAttachmentsError(messageFor(error));
+    } finally {
+      setUploadingAttachments(false);
+      if (attachmentInputRef.current) attachmentInputRef.current.value = "";
+    }
+  }
+
+  async function confirmAttachmentDelete() {
+    if (!pendingAttachmentDelete || deletingAttachment) return;
+    setDeletingAttachment(true);
+    setAttachmentsError(null);
+    try {
+      await deleteAttachment(pendingAttachmentDelete);
+      setAttachments((current) => current.filter((attachment) => attachment.id !== pendingAttachmentDelete.id));
+      setComments((current) => current.map((comment) => ({
+        ...comment,
+        attachments: comment.attachments.filter((attachment) => attachment.id !== pendingAttachmentDelete.id),
+      })));
+      setPendingAttachmentDelete(null);
+      onAnnounce("附件已删除。");
+    } catch (error) {
+      setAttachmentsError(messageFor(error));
+    } finally {
+      setDeletingAttachment(false);
+    }
+  }
+
+  async function confirmIssueArchive() {
+    if (archivingIssue) return;
+    setArchivingIssue(true);
+    onError(null);
+    try {
+      await onArchive(currentTask);
+      setPendingIssueArchive(false);
+    } finally {
+      setArchivingIssue(false);
+    }
+  }
+
+  async function restoreIssue() {
+    if (restoringIssue) return;
+    setRestoringIssue(true);
+    onError(null);
+    try {
+      await onRestore(currentTask);
+    } finally {
+      setRestoringIssue(false);
+    }
+  }
+
+  async function confirmIssueDelete() {
+    if (deletingIssue) return;
+    setDeletingIssue(true);
+    onError(null);
+    try {
+      await onDelete(currentTask);
+      setPendingIssueDelete(false);
+    } finally {
+      setDeletingIssue(false);
+    }
+  }
+
+  const developmentOptions = [...developmentScan.contexts];
+  if (
+    currentTask.developmentContext
+    && !developmentOptions.some((context) => contextValue(context) === contextValue(currentTask.developmentContext))
+  ) {
+    developmentOptions.unshift(currentTask.developmentContext);
+  }
+  const assigneeOptions = [currentTask.assignee, currentUser, CODEX_AGENT_ACTOR]
+    .filter((actor, index, actors) => (
+      actors.findIndex((candidate) => actorKey(candidate) === actorKey(actor)) === index
+    ));
+  const visibleTaskAttachments = attachments.filter(
+    (attachment) => !description.includes(attachmentContentUrl(attachment)),
+  );
+
+  return (
+    <section className="issue-detail" aria-label={`${task.identifier} 任务详情`}>
+      <div className="issue-detail-scroll">
+        <div className="issue-detail-layout">
+          <div className="issue-detail-main">
+            <article className="issue-editor" aria-label="任务内容">
+              <div className="issue-editor-content">
+                <div className="issue-title-row">
+                  <textarea
+                  ref={titleRef}
+                  className="issue-title-input"
+                  rows={1}
+                  value={title}
+                  aria-label="任务标题"
+                  disabled={savingProperty === "title"}
+                  onChange={(event) => {
+                    setTitle(event.target.value.replace(/\n/g, ""));
+                    resizeTextarea(event.currentTarget);
+                  }}
+                  onKeyDown={handleTitleKeyDown}
+                  onBlur={() => void saveTitle()}
+                  />
+                  <div className="issue-title-actions">
+                    {currentTask.archivedAt ? (
+                      <button
+                        className="issue-restore-button"
+                        type="button"
+                        title="恢复任务"
+                        aria-label="恢复任务"
+                        disabled={restoringIssue || deletingIssue}
+                        onClick={() => void restoreIssue()}
+                      >
+                        <LinearIcon name="recurrence" />
+                        <span>{restoringIssue ? "恢复中..." : "恢复"}</span>
+                      </button>
+                    ) : (
+                      <button
+                        className="issue-archive-button"
+                        type="button"
+                        title="归档任务"
+                        aria-label="归档任务"
+                        disabled={archivingIssue || deletingIssue}
+                        onClick={() => setPendingIssueArchive(true)}
+                      >
+                        <LinearIcon name="trash" />
+                        <span>归档</span>
+                      </button>
+                    )}
+                    <button
+                      className="issue-permanent-delete-button"
+                      type="button"
+                      title="永久删除任务"
+                      aria-label="永久删除任务"
+                      disabled={archivingIssue || restoringIssue || deletingIssue}
+                      onClick={() => setPendingIssueDelete(true)}
+                    >
+                      <LinearIcon name="trash" />
+                      <span>永久删除</span>
+                    </button>
+                  </div>
+                </div>
+                <IssueParentLink
+                  task={currentTask}
+                  tasks={tasks}
+                  onOpenTask={onOpenTask}
+                  onOpenThread={onOpenThread}
+                  onAddRelation={(anchor, type, relatedTaskId) => applyRelationMutation(
+                    () => onAddRelation(anchor, type, relatedTaskId),
+                  )}
+                  onRemoveRelation={(anchor, type, relatedTaskId) => applyRelationMutation(
+                    () => onRemoveRelation(anchor, type, relatedTaskId),
+                  )}
+                />
+                {editingDescription ? (
+                  <textarea
+                    ref={descriptionRef}
+                    className="issue-description-input"
+                    rows={1}
+                    value={description}
+                    aria-label="任务描述"
+                    placeholder="添加描述…"
+                    disabled={savingProperty === "description"}
+                    onChange={(event) => {
+                      setDescription(event.target.value);
+                      resizeTextarea(event.currentTarget);
+                    }}
+                    onKeyDown={(event) => {
+                      if (event.key === "Escape") {
+                        setDescription(currentTask.description);
+                        setEditingDescription(false);
+                      }
+                    }}
+                    onBlur={() => {
+                      setEditingDescription(false);
+                      void saveDescription();
+                    }}
+                  />
+                ) : (
+                  <div
+                    className={`issue-description-read${description ? "" : " empty"}`}
+                    role="button"
+                    tabIndex={0}
+                    aria-label="编辑任务描述"
+                    onClick={() => setEditingDescription(true)}
+                    onKeyDown={(event) => {
+                      if (event.key === "Enter" || event.key === " ") {
+                        event.preventDefault();
+                        setEditingDescription(true);
+                      }
+                    }}
+                  >
+                    {description ? <DescriptionDocument value={description} /> : "添加描述…"}
+                  </div>
+                )}
+                {currentTask.threadId && (
+                  <div className="issue-conversation-list" aria-label="处理此任务的对话">
+                    <ConversationLink
+                      threadId={currentTask.threadId}
+                      threadTitle={currentTask.title}
+                      onContinue={(threadId) => onContinueThread(currentTask, threadId)}
+                      onOpen={onOpenThread}
+                    />
+                  </div>
+                )}
+              </div>
+            </article>
+
+            <IssueSubIssues
+              task={currentTask}
+              tasks={tasks}
+              onOpenTask={onOpenTask}
+              onOpenThread={onOpenThread}
+              onAddRelation={(anchor, type, relatedTaskId) => applyRelationMutation(
+                () => onAddRelation(anchor, type, relatedTaskId),
+              )}
+              onRemoveRelation={(anchor, type, relatedTaskId) => applyRelationMutation(
+                () => onRemoveRelation(anchor, type, relatedTaskId),
+              )}
+            />
+
+            <section className="issue-attachments" aria-labelledby="attachments-heading">
+              <header className="attachments-heading">
+                <div>
+                  <h2 id="attachments-heading">附件</h2>
+                  <span>{visibleTaskAttachments.length}</span>
+                </div>
+                <button
+                  className="attachment-add-button"
+                  type="button"
+                  disabled={uploadingAttachments}
+                  onClick={() => attachmentInputRef.current?.click()}
+                >
+                  <LinearIcon name="attachment" />
+                  {uploadingAttachments ? "上传中…" : "添加附件"}
+                </button>
+                <input
+                  ref={attachmentInputRef}
+                  type="file"
+                  multiple
+                  hidden
+                  onChange={(event) => {
+                    if (event.currentTarget.files) void uploadFiles(event.currentTarget.files);
+                  }}
+                />
+              </header>
+
+              {attachmentsLoading ? (
+                <div className="attachments-loading" aria-label="正在加载附件" aria-busy="true"><i /><i /></div>
+              ) : visibleTaskAttachments.length > 0 ? (
+                <ul className="attachment-list">
+                  {visibleTaskAttachments.map((attachment) => (
+                    <li key={attachment.id}>
+                      <a
+                        className="attachment-link"
+                        href={attachmentContentUrl(attachment)}
+                        target="_blank"
+                        rel="noreferrer"
+                        title={`打开 ${attachment.filename}`}
+                      >
+                        <span className="attachment-file-icon" aria-hidden="true">
+                          <LinearIcon name="file" />
+                        </span>
+                        <span className="attachment-copy">
+                          <strong>{attachment.filename}</strong>
+                          <span>{fileSize(attachment.size)} · {relativeTime(attachment.createdAt)}</span>
+                        </span>
+                      </a>
+                      <div className="attachment-actions">
+                        <a
+                          href={attachmentContentUrl(attachment)}
+                          download={attachment.filename}
+                          aria-label={`下载 ${attachment.filename}`}
+                          title="下载附件"
+                        >
+                          <LinearIcon name="openExternal" />
+                        </a>
+                        <button
+                          type="button"
+                          aria-label={`删除 ${attachment.filename}`}
+                          title="删除附件"
+                          onClick={() => setPendingAttachmentDelete(attachment)}
+                        >
+                          <LinearIcon name="trash" />
+                        </button>
+                      </div>
+                    </li>
+                  ))}
+                </ul>
+              ) : (
+                <p className="attachments-empty">添加图片、文档或其他文件，单个文件不超过 25 MB。</p>
+              )}
+              {attachmentsError && <div className="attachments-error" role="alert">{attachmentsError}</div>}
+            </section>
+
+            <section className="activity-section" aria-labelledby="activity-heading">
+              <header className="activity-heading">
+                <h2 id="activity-heading">活动</h2>
+                <span>{comments.length}</span>
+              </header>
+
+              <div className="activity-stream">
+                <div className={`activity-entry activity-created is-${currentTask.creatorType}`}>
+                  <ActorAvatar
+                    className="comment-avatar"
+                    actor={{
+                      type: currentTask.creatorType,
+                      id: currentTask.creatorId,
+                      name: currentTask.creatorName,
+                      avatarUrl: currentTask.creatorAvatarUrl,
+                    }}
+                  />
+                  <p>
+                    <strong>{currentTask.creatorName}</strong>
+                    <span className="actor-id">@{currentTask.creatorId}</span>
+                    创建了此任务
+                    <time title={exactTime(currentTask.createdAt)}>{relativeTime(currentTask.createdAt)}</time>
+                  </p>
+                </div>
+
+                {commentsLoading ? (
+                  <div className="comments-loading" aria-label="正在加载评论" aria-busy="true"><i /><i /></div>
+                ) : comments.map((comment) => (
+                  <article
+                    className={`comment-entry is-${comment.authorType}`}
+                    key={comment.id}
+                    id={`comment-${comment.id}`}
+                  >
+                    <div className="comment-card">
+                      <header className="comment-header">
+                        <ActorAvatar
+                          className="comment-avatar"
+                          actor={{
+                            type: comment.authorType,
+                            id: comment.authorId,
+                            name: comment.authorName,
+                            avatarUrl: comment.authorAvatarUrl,
+                          }}
+                        />
+                        <strong>{comment.authorName}</strong>
+                        <span className="actor-id">@{comment.authorId}</span>
+                        <time title={exactTime(comment.createdAt)}>{relativeTime(comment.createdAt)}</time>
+                        {comment.version > 1 && (
+                          <span className="comment-edited" title={`编辑于 ${exactTime(comment.updatedAt)}`}>已编辑</span>
+                        )}
+                        <div className="comment-actions" data-comment-menu-root={comment.id}>
+                          <button
+                            type="button"
+                            className="comment-menu-trigger"
+                            aria-label="评论操作"
+                            aria-haspopup="menu"
+                            aria-expanded={activeMenuId === comment.id}
+                            onClick={() => setActiveMenuId((current) => current === comment.id ? null : comment.id)}
+                          >
+                            <LinearIcon name="more" />
+                          </button>
+                          {activeMenuId === comment.id && (
+                            <div className="comment-action-menu" role="menu">
+                              <button type="button" role="menuitem" onClick={() => beginEdit(comment)}>
+                                <LinearIcon name="write" />
+                                编辑评论
+                              </button>
+                              <button
+                                type="button"
+                                role="menuitem"
+                                className="danger"
+                                onClick={() => { setPendingDelete(comment); setActiveMenuId(null); }}
+                              >
+                                <LinearIcon name="trash" />
+                                删除评论
+                              </button>
+                            </div>
+                          )}
+                        </div>
+                      </header>
+
+                      {editingId === comment.id ? (
+                        <div className="comment-edit-form">
+                          <textarea
+                            className="comment-input"
+                            autoFocus
+                            value={editingBody}
+                            rows={3}
+                            aria-label="编辑评论"
+                            onChange={(event) => setEditingBody(event.target.value)}
+                            onKeyDown={(event) => {
+                              if (event.key === "Escape") setEditingId(null);
+                              if (event.key === "Enter" && (event.metaKey || event.ctrlKey)) {
+                                event.preventDefault();
+                                void saveComment(comment);
+                              }
+                            }}
+                          />
+                          <div>
+                            <button className="button secondary" type="button" onClick={() => setEditingId(null)}>取消</button>
+                            <button
+                              className="button primary"
+                              type="button"
+                              disabled={!editingBody.trim() || savingCommentId === comment.id}
+                              onClick={() => void saveComment(comment)}
+                            >
+                              {savingCommentId === comment.id ? "保存中…" : "保存"}
+                            </button>
+                          </div>
+                        </div>
+                      ) : (
+                        comment.body && <div className="comment-body"><DescriptionDocument value={comment.body} /></div>
+                      )}
+                      {comment.attachments.some(
+                        (attachment) => !comment.body.includes(attachmentContentUrl(attachment)),
+                      ) && (
+                        <ul className="comment-attachment-list" aria-label="评论附件">
+                          {comment.attachments
+                            .filter((attachment) => !comment.body.includes(attachmentContentUrl(attachment)))
+                            .map((attachment) => (
+                              <li key={attachment.id}>
+                                <a
+                                  href={attachmentContentUrl(attachment)}
+                                  target="_blank"
+                                  rel="noreferrer"
+                                  title={`打开 ${attachment.filename}`}
+                                >
+                                  <span className="attachment-file-icon" aria-hidden="true">
+                                    <LinearIcon name="file" />
+                                  </span>
+                                  <span><strong>{attachment.filename}</strong><small>{fileSize(attachment.size)}</small></span>
+                                </a>
+                                <button
+                                  type="button"
+                                  aria-label={`删除 ${attachment.filename}`}
+                                  title="删除附件"
+                                  onClick={() => setPendingAttachmentDelete(attachment)}
+                                >
+                                  <LinearIcon name="trash" />
+                                </button>
+                              </li>
+                            ))}
+                        </ul>
+                      )}
+                      {comment.threadId && (
+                        <div className="comment-conversation-link">
+                          <ConversationLink
+                            threadId={comment.threadId}
+                            threadTitle={currentTask.title}
+                            onContinue={(threadId) => onContinueThread(currentTask, threadId)}
+                            onOpen={onOpenThread}
+                          />
+                        </div>
+                      )}
+                    </div>
+                  </article>
+                ))}
+              </div>
+
+              {commentsError && <div className="comments-error" role="alert">{commentsError}</div>}
+
+              <form className="comment-composer" onSubmit={(event) => { event.preventDefault(); void submitComment(); }}>
+                <div className="composer-author">
+                  <ActorAvatar
+                    className="comment-avatar"
+                    actor={currentUser}
+                  />
+                  <strong>{currentUser.name}</strong>
+                  <span className="actor-id">@{currentUser.id}</span>
+                </div>
+                <InlineMediaComposer
+                  ref={composerRef}
+                  className="comment-inline-media"
+                  segments={commentSegments}
+                  placeholder="留下评论…"
+                  ariaLabel="留下评论"
+                  onChange={setCommentSegments}
+                  onError={setCommentsError}
+                  onKeyDown={handleSubmitShortcut}
+                />
+                <PendingAttachments
+                  files={pendingCommentFiles}
+                  disabled={submitting}
+                  uploadLabel="发布后上传"
+                  ariaLabel="待上传评论附件"
+                  className="comment-composer-files"
+                  onRemove={(index) => setPendingCommentFiles((current) => current.filter((_, itemIndex) => itemIndex !== index))}
+                />
+                <footer className="composer-footer">
+                  <div className="composer-footer-leading">
+                    <button
+                      className="comment-attach-button"
+                      type="button"
+                      disabled={submitting}
+                      aria-label="添加评论附件"
+                      title="添加附件"
+                      onClick={() => commentAttachmentInputRef.current?.click()}
+                    >
+                      <LinearIcon name="attachment" />
+                    </button>
+                    <span>草稿会自动保存</span>
+                    <input
+                      ref={commentAttachmentInputRef}
+                      type="file"
+                      multiple
+                      hidden
+                      onChange={(event) => {
+                        if (event.currentTarget.files) stageCommentFiles(event.currentTarget.files);
+                      }}
+                    />
+                  </div>
+                  <div>
+                    <kbd>⌘ Enter</kbd>
+                    <button
+                      className="button primary"
+                      type="submit"
+                      disabled={(
+                        !draft.trim()
+                        && pendingCommentFiles.length === 0
+                        && commentInlineImages.length === 0
+                      ) || submitting}
+                    >
+                      {submitting ? "发布中…" : "评论"}
+                    </button>
+                  </div>
+                </footer>
+              </form>
+            </section>
+          </div>
+
+          <aside className="issue-properties" aria-label="任务属性">
+            <button
+              className="detail-open-thread-action"
+              type="button"
+              disabled={openingThread}
+              onClick={() => onOpenInThread(currentTask)}
+            >
+              <LinearIcon name="conversation" />
+              <span>{openingThread ? "正在打开…" : "在对话中打开"}</span>
+            </button>
+            <h2>属性</h2>
+            <label className="detail-property-row">
+              <span className={`detail-property-icon status-icon-${STATUS_DETAILS[currentTask.status].tone}`}><LinearStatusIcon status={currentTask.status} /></span>
+              <span className="detail-property-label">状态</span>
+              <select
+                value={currentTask.status}
+                disabled={savingProperty === "status"}
+                onChange={(event) => void saveTask({ status: event.target.value as TaskStatus }, "status")}
+              >
+                {TASK_STATUSES.map((status) => (
+                  <option value={status} key={status}>{STATUS_DETAILS[status].label}</option>
+                ))}
+              </select>
+            </label>
+            <label className="detail-property-row">
+              <span className="detail-property-icon"><LinearPriorityIcon priority={currentTask.priority} /></span>
+              <span className="detail-property-label">优先级</span>
+              <select
+                value={currentTask.priority}
+                disabled={savingProperty === "priority"}
+                onChange={(event) => void saveTask({ priority: event.target.value as TaskPriority }, "priority")}
+              >
+                {(Object.keys(PRIORITY_DETAILS) as TaskPriority[]).map((priority) => (
+                  <option value={priority} key={priority}>{PRIORITY_DETAILS[priority].label}</option>
+                ))}
+              </select>
+            </label>
+            <label className="detail-property-row assignee-property">
+              <ActorAvatar actor={currentTask.assignee} className="detail-assignee-avatar" />
+              <span className="detail-property-label">负责人</span>
+              <select
+                aria-label="负责人"
+                value={actorKey(currentTask.assignee)}
+                disabled={savingProperty === "assignee"}
+                onChange={(event) => {
+                  const selected = assigneeOptions.find((actor) => actorKey(actor) === event.target.value);
+                  const assigneeTarget = selected
+                    ? assigneeTargetForActor(selected, currentUser)
+                    : undefined;
+                  if (assigneeTarget) void saveTask({ assigneeTarget: assigneeTarget }, "assignee");
+                }}
+              >
+                {assigneeOptions.map((actor) => (
+                  <option value={actorKey(actor)} key={actorKey(actor)}>
+                    {actor.id === currentUser.id ? `${actor.name}（我）` : actor.name}
+                  </option>
+                ))}
+              </select>
+            </label>
+            <div className="detail-property-row labels-property">
+              <span className="detail-property-icon" aria-hidden="true">
+                <LinearIcon name="label" />
+              </span>
+              <span className="detail-property-label">标签</span>
+              <LabelPicker
+                availableLabels={availableLabels}
+                selectedLabels={currentTask.labels}
+                open={labelMenuOpen}
+                disabled={savingProperty === "labels"}
+                className="detail-label-picker"
+                triggerClassName="detail-label-trigger"
+                placeholder="添加标签…"
+                onOpenChange={setLabelMenuOpen}
+                onChange={(nextLabels) => void saveTask({ labels: nextLabels }, "labels")}
+              />
+            </div>
+            <label className="detail-property-row workflow-property">
+              <span className="detail-property-icon" aria-hidden="true">
+                <LinearIcon name="dashboard" />
+              </span>
+              <span className="detail-property-label">工作流</span>
+              <select
+                value={currentTask.workflowId ?? ""}
+                disabled={savingProperty === "workflowId"}
+                onChange={(event) => void saveTask({
+                  workflowId: event.target.value || null,
+                }, "workflowId")}
+              >
+                <option value="">未绑定</option>
+                {!workflowAvailable && currentTask.workflowId && (
+                  <option value={currentTask.workflowId}>当前设备未找到此流程</option>
+                )}
+                {workflows.map((workflow) => (
+                  <option value={workflow.id} key={workflow.id}>{workflow.name}</option>
+                ))}
+              </select>
+            </label>
+            <label className="detail-property-row development-property">
+              <span className="detail-property-icon" aria-hidden="true">
+                <LinearIcon name="branch" />
+              </span>
+              <span className="detail-property-label">开发上下文</span>
+              <select
+                value={contextValue(currentTask.developmentContext)}
+                disabled={developmentScanLoading || savingProperty === "developmentContext"}
+                title={currentTask.developmentContext?.type === "worktree" ? currentTask.developmentContext.path : undefined}
+                onChange={(event) => void saveTask({
+                  developmentContext: event.target.value ? JSON.parse(event.target.value) as DevelopmentContext : null,
+                }, "developmentContext")}
+              >
+                <option value="">{developmentScanLoading ? "正在扫描 Git…" : "未绑定"}</option>
+                <optgroup label="代码分支">
+                  {developmentOptions.filter((context) => context.type === "branch").map((context) => (
+                    <option value={contextValue(context)} key={contextValue(context)}>{contextLabel(context)}</option>
+                  ))}
+                </optgroup>
+                <optgroup label="Worktree">
+                  {developmentOptions.filter((context) => context.type === "worktree").map((context) => (
+                    <option value={contextValue(context)} key={contextValue(context)}>{contextLabel(context)}</option>
+                  ))}
+                </optgroup>
+              </select>
+            </label>
+            <label className="detail-property-row">
+              <span className="detail-property-icon" aria-hidden="true"><LinearIcon name="calendar" /></span>
+              <span className="detail-property-label">截止日期</span>
+              <input
+                type="date"
+                value={currentTask.dueDate ?? ""}
+                disabled={savingProperty === "dueDate"}
+                onChange={(event) => void saveTask({
+                  dueDate: event.target.value || null,
+                  ...(event.target.value ? {} : { recurrence: null }),
+                }, "dueDate")}
+              />
+            </label>
+            <label className="detail-property-row">
+              <span className="detail-property-icon" aria-hidden="true"><LinearIcon name="recurrence" /></span>
+              <span className="detail-property-label">重复</span>
+              <select
+                value={currentTask.recurrence?.unit ?? ""}
+                disabled={!currentTask.dueDate || savingProperty === "recurrence"}
+                onChange={(event) => void saveTask({
+                  recurrence: event.target.value
+                    ? { interval: 1, unit: event.target.value as Recurrence["unit"] }
+                    : null,
+                }, "recurrence")}
+              >
+                <option value="">不重复</option>
+                <option value="day">每天</option>
+                <option value="week">每周</option>
+                <option value="month">每月</option>
+                <option value="year">每年</option>
+              </select>
+            </label>
+            <IssueRelationSidebar
+              task={currentTask}
+              tasks={tasks}
+              onOpenTask={onOpenTask}
+              onOpenThread={onOpenThread}
+              onAddRelation={(anchor, type, relatedTaskId) => applyRelationMutation(
+                () => onAddRelation(anchor, type, relatedTaskId),
+              )}
+              onRemoveRelation={(anchor, type, relatedTaskId) => applyRelationMutation(
+                () => onRemoveRelation(anchor, type, relatedTaskId),
+              )}
+            />
+            <div className="detail-timestamps">
+              <span>创建于 {exactTime(currentTask.createdAt)}</span>
+              {currentTask.updatedAt !== currentTask.createdAt && <span>更新于 {exactTime(currentTask.updatedAt)}</span>}
+            </div>
+          </aside>
+        </div>
+      </div>
+
+      {pendingIssueArchive && (
+        <div className="delete-backdrop" role="presentation" onMouseDown={(event) => {
+          if (event.target === event.currentTarget && !archivingIssue) setPendingIssueArchive(false);
+        }}>
+          <div className="delete-dialog" role="alertdialog" aria-modal="true" aria-labelledby="delete-issue-title">
+            <h2 id="delete-issue-title">归档这个任务？</h2>
+            <p>“{currentTask.identifier} {currentTask.title}” 会从当前看板隐藏并进入归档，可恢复，不会永久删除。</p>
+            <div>
+              <button className="button secondary" type="button" disabled={archivingIssue} onClick={() => setPendingIssueArchive(false)}>取消</button>
+              <button className="button danger" type="button" disabled={archivingIssue} onClick={() => void confirmIssueArchive()}>{archivingIssue ? "归档中..." : "归档任务"}</button>
+            </div>
+          </div>
+        </div>
+      )}
+
+      {pendingIssueDelete && (
+        <div className="delete-backdrop" role="presentation" onMouseDown={(event) => {
+          if (event.target === event.currentTarget && !deletingIssue) setPendingIssueDelete(false);
+        }}>
+          <div className="delete-dialog" role="alertdialog" aria-modal="true" aria-labelledby="permanent-delete-issue-title">
+            <h2 id="permanent-delete-issue-title">永久删除这个任务？</h2>
+            <p>“{currentTask.identifier} {currentTask.title}” 会被永久删除，评论、附件和关联也会删除，无法恢复。</p>
+            <div>
+              <button className="button secondary" type="button" disabled={deletingIssue} onClick={() => setPendingIssueDelete(false)}>取消</button>
+              <button className="button danger" type="button" disabled={deletingIssue} onClick={() => void confirmIssueDelete()}>{deletingIssue ? "删除中..." : "永久删除"}</button>
+            </div>
+          </div>
+        </div>
+      )}
+
+      {pendingDelete && (
+        <div className="delete-backdrop" role="presentation" onMouseDown={(event) => {
+          if (event.target === event.currentTarget && !deleting) setPendingDelete(null);
+        }}>
+          <div className="delete-dialog" role="alertdialog" aria-modal="true" aria-labelledby="delete-comment-title">
+            <h2 id="delete-comment-title">删除这条评论？</h2>
+            <p>此操作无法撤销。</p>
+            <div>
+              <button className="button secondary" type="button" disabled={deleting} onClick={() => setPendingDelete(null)}>取消</button>
+              <button className="button danger" type="button" disabled={deleting} onClick={() => void confirmDelete()}>{deleting ? "删除中…" : "删除评论"}</button>
+            </div>
+          </div>
+        </div>
+      )}
+
+      {pendingAttachmentDelete && (
+        <div className="delete-backdrop" role="presentation" onMouseDown={(event) => {
+          if (event.target === event.currentTarget && !deletingAttachment) setPendingAttachmentDelete(null);
+        }}>
+          <div className="delete-dialog" role="alertdialog" aria-modal="true" aria-labelledby="delete-attachment-title">
+            <h2 id="delete-attachment-title">删除这个附件？</h2>
+            <p>“{pendingAttachmentDelete.filename}” 将被永久删除，此操作无法撤销。</p>
+            <div>
+              <button className="button secondary" type="button" disabled={deletingAttachment} onClick={() => setPendingAttachmentDelete(null)}>取消</button>
+              <button className="button danger" type="button" disabled={deletingAttachment} onClick={() => void confirmAttachmentDelete()}>{deletingAttachment ? "删除中…" : "删除附件"}</button>
+            </div>
+          </div>
+        </div>
+      )}
+    </section>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/TaskEditor.tsx b/apps/codex-taskboard/web/src/components/TaskEditor.tsx
new file mode 100644
index 000000000..1060007f9
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/TaskEditor.tsx
@@ -0,0 +1,412 @@
+import { useEffect, useMemo, useRef, useState } from "react";
+import type { FormEvent } from "react";
+import { ApiError } from "../api";
+import {
+  TASK_PRIORITIES,
+  TASK_STATUSES,
+  type ActorIdentity,
+  type DevelopmentContext,
+  type DevelopmentScan,
+  type Recurrence,
+  type Task,
+  type TaskDraft,
+  type TaskPriority,
+  type TaskStatus,
+  type WorkflowOption,
+} from "../types";
+import {
+  CODEX_AGENT_ACTOR,
+  actorKey,
+  assigneeTargetForActor,
+} from "../actors";
+import { ActorAvatar } from "./ActorAvatar";
+import { STATUS_DETAILS } from "./BoardColumn";
+import { LabelPicker } from "./LabelPicker";
+import { LinearIcon, LinearPriorityIcon, LinearStatusIcon } from "./LinearIcon";
+import {
+  fileKey,
+  MAX_ATTACHMENT_SIZE,
+  PendingAttachments,
+} from "./PendingAttachments";
+import {
+  createInlineMediaSegments,
+  InlineMediaComposer,
+  inlineMediaImages,
+  serializeInlineMedia,
+  type InlineMediaSegment,
+  type PendingInlineImage,
+} from "./InlineMediaComposer";
+
+const PRIORITY_LABELS: Record<TaskPriority, string> = {
+  none: "无优先级",
+  urgent: "紧急",
+  high: "高",
+  medium: "中",
+  low: "低",
+};
+
+const RECURRENCE_UNITS: Record<Recurrence["unit"], string> = {
+  day: "天",
+  week: "周",
+  month: "月",
+  year: "年",
+};
+
+interface TaskEditorProps {
+  task: Task | null;
+  initialStatus: TaskStatus;
+  labels: string[];
+  workflows: WorkflowOption[];
+  currentUser: ActorIdentity;
+  developmentScan: DevelopmentScan;
+  developmentScanLoading: boolean;
+  onCancel: () => void;
+  onSave: (
+    draft: TaskDraft,
+    attachments: File[],
+    inlineImages: PendingInlineImage[],
+  ) => Promise<void>;
+}
+
+function isoDate(date: Date): string {
+  const local = new Date(date.getTime() - date.getTimezoneOffset() * 60_000);
+  return local.toISOString().slice(0, 10);
+}
+
+function dateFromNow(days: number): string {
+  const date = new Date();
+  date.setDate(date.getDate() + days);
+  return isoDate(date);
+}
+
+function endOfWeek(): string {
+  const date = new Date();
+  const daysUntilFriday = (5 - date.getDay() + 7) % 7;
+  date.setDate(date.getDate() + daysUntilFriday);
+  return isoDate(date);
+}
+
+function displayDate(value: string): string {
+  return new Intl.DateTimeFormat("zh-CN", { month: "short", day: "numeric" })
+    .format(new Date(`${value}T12:00:00`));
+}
+
+function contextValue(context: DevelopmentContext | null): string {
+  return context ? JSON.stringify(context) : "";
+}
+
+function contextLabel(context: DevelopmentContext): string {
+  if (context.type === "branch") return context.branch;
+  const folder = context.path.split(/[\\/]/).filter(Boolean).at(-1) ?? context.path;
+  return `${context.branch ?? "detached"} · ${folder}`;
+}
+
+export function TaskEditor({
+  task,
+  initialStatus,
+  labels: availableLabels,
+  workflows,
+  currentUser,
+  developmentScan,
+  developmentScanLoading,
+  onCancel,
+  onSave,
+}: TaskEditorProps) {
+  const dialogRef = useRef<HTMLDialogElement>(null);
+  const titleRef = useRef<HTMLInputElement>(null);
+  const attachmentInputRef = useRef<HTMLInputElement>(null);
+  const [title, setTitle] = useState(task?.title ?? "");
+  const [description, setDescription] = useState(task?.description ?? "");
+  const [descriptionSegments, setDescriptionSegments] = useState<InlineMediaSegment[]>(
+    () => createInlineMediaSegments(),
+  );
+  const [status, setStatus] = useState<TaskStatus>(task?.status ?? initialStatus);
+  const [priority, setPriority] = useState<TaskPriority>(task?.priority ?? "none");
+  const [assignee, setAssignee] = useState<ActorIdentity>(task?.assignee ?? currentUser);
+  const [selectedLabels, setSelectedLabels] = useState<string[]>(task?.labels ?? []);
+  const [workflowId, setWorkflowId] = useState(task?.workflowId ?? "");
+  const [developmentContext, setDevelopmentContext] = useState<DevelopmentContext | null>(task?.developmentContext ?? null);
+  const [dueDate, setDueDate] = useState(task?.dueDate ?? "");
+  const [recurrence, setRecurrence] = useState<Recurrence | null>(task?.recurrence ?? null);
+  const [menu, setMenu] = useState<"labels" | "more" | "due" | "recurrence" | null>(null);
+  const [expanded, setExpanded] = useState(false);
+  const [saving, setSaving] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const [attachmentError, setAttachmentError] = useState<string | null>(null);
+  const [attachments, setAttachments] = useState<File[]>([]);
+
+  const developmentOptions = useMemo(() => {
+    const options = [...developmentScan.contexts];
+    if (developmentContext && !options.some((option) => contextValue(option) === contextValue(developmentContext))) {
+      options.unshift(developmentContext);
+    }
+    return options;
+  }, [developmentContext, developmentScan.contexts]);
+
+  const workflowAvailable = !workflowId || workflows.some((workflow) => workflow.id === workflowId);
+  const assigneeOptions = [task?.assignee, currentUser, CODEX_AGENT_ACTOR]
+    .filter((actor): actor is ActorIdentity => actor !== undefined)
+    .filter((actor, index, actors) => (
+      actors.findIndex((candidate) => actorKey(candidate) === actorKey(actor)) === index
+    ));
+
+  useEffect(() => {
+    dialogRef.current?.showModal();
+    titleRef.current?.focus();
+    return () => {
+      if (dialogRef.current?.open) dialogRef.current.close();
+    };
+  }, []);
+
+  async function handleSubmit(event: FormEvent<HTMLFormElement>) {
+    event.preventDefault();
+    const cleanTitle = title.trim();
+    if (!cleanTitle) {
+      setError("请为任务填写一个简短、明确的标题。");
+      titleRef.current?.focus();
+      return;
+    }
+    if (recurrence && !dueDate) {
+      setError("重复任务需要先设置最早截止日期。");
+      return;
+    }
+
+    setSaving(true);
+    setError(null);
+    try {
+      const assigneeTarget = task && actorKey(assignee) === actorKey(task.assignee)
+        ? undefined
+        : assigneeTargetForActor(assignee, currentUser);
+      const descriptionValue = task
+        ? description.trim()
+        : serializeInlineMedia(descriptionSegments).trim();
+      await onSave({
+        title: cleanTitle,
+        description: descriptionValue,
+        status,
+        priority,
+        labels: selectedLabels,
+        ...(assigneeTarget ? { assigneeTarget } : {}),
+        workflowId: workflowId || null,
+        developmentContext,
+        dueDate: dueDate || null,
+        recurrence,
+      }, attachments, inlineMediaImages(descriptionSegments));
+    } catch (caught) {
+      if (caught instanceof ApiError && caught.code === "VERSION_CONFLICT") {
+        setError("这个任务已在其他位置发生变更，请关闭并刷新后重试。");
+      } else {
+        setError(caught instanceof Error ? caught.message : "无法保存这个任务。");
+      }
+    } finally {
+      setSaving(false);
+    }
+  }
+
+  function addAttachments(files: FileList | File[]) {
+    const selected = Array.from(files);
+    const oversized = selected.find((file) => file.size > MAX_ATTACHMENT_SIZE);
+    if (oversized) {
+      setAttachmentError(`“${oversized.name}” 超过 25 MB，无法上传。`);
+      return;
+    }
+    setAttachmentError(null);
+    setAttachments((current) => {
+      const existing = new Set(current.map(fileKey));
+      return [...current, ...selected.filter((file) => !existing.has(fileKey(file)))];
+    });
+  }
+
+  function chooseDueDate(value: string) {
+    setDueDate(value);
+    setMenu(null);
+  }
+
+  return (
+    <dialog
+      ref={dialogRef}
+      className={`task-dialog${expanded ? " is-expanded" : ""}`}
+      aria-labelledby="task-dialog-title"
+      onCancel={(event) => {
+        event.preventDefault();
+        if (!saving) onCancel();
+      }}
+      onClick={(event) => {
+        if (event.target === event.currentTarget && !saving) onCancel();
+      }}
+    >
+      <form className="task-form" onSubmit={handleSubmit}>
+        <header className="dialog-header">
+          <div className="dialog-context">
+            <strong id="task-dialog-title">{task ? task.identifier : "新建任务"}</strong>
+          </div>
+          <div className="dialog-header-actions">
+            <button type="button" className="icon-button dialog-expand" aria-label={expanded ? "收起编辑器" : "展开编辑器"} onClick={() => setExpanded((current) => !current)}>
+              <LinearIcon name="expand" />
+            </button>
+            <button type="button" className="icon-button dialog-close" onClick={onCancel} disabled={saving} aria-label="关闭编辑器">
+              <LinearIcon name="close" />
+            </button>
+          </div>
+        </header>
+
+        <div className="form-body">
+          <label className="composer-title">
+            <span className="sr-only">标题</span>
+            <input ref={titleRef} value={title} onChange={(event) => setTitle(event.target.value)} placeholder="Issue title" maxLength={240} autoComplete="off" />
+          </label>
+          {task ? (
+            <label className="composer-description">
+              <span className="sr-only">描述</span>
+              <textarea value={description} onChange={(event) => setDescription(event.target.value)} placeholder="Add description…" rows={5} />
+            </label>
+          ) : (
+            <InlineMediaComposer
+              className="composer-description inline-media-description"
+              segments={descriptionSegments}
+              placeholder="Add description…"
+              ariaLabel="描述"
+              disabled={saving}
+              onChange={setDescriptionSegments}
+              onError={setAttachmentError}
+            />
+          )}
+
+          {!task && (
+            <PendingAttachments
+              files={attachments}
+              disabled={saving}
+              uploadLabel="保存后上传"
+              ariaLabel="待上传附件"
+              onRemove={(index) => setAttachments((current) => current.filter((_, itemIndex) => itemIndex !== index))}
+            />
+          )}
+        </div>
+
+        <div className="task-form-dock">
+          <div className="property-row">
+            <label className="property-control property-status">
+              <LinearStatusIcon status={status} className={`status-icon-${STATUS_DETAILS[status].tone}`} />
+              <span className="sr-only">状态</span>
+              <select value={status} onChange={(event) => setStatus(event.target.value as TaskStatus)}>
+                {TASK_STATUSES.map((value) => <option value={value} key={value}>{STATUS_DETAILS[value].label}</option>)}
+              </select>
+            </label>
+            <label className={`property-control property-priority priority-${priority}`}>
+              <LinearPriorityIcon priority={priority} />
+              <span className="sr-only">优先级</span>
+              <select value={priority} onChange={(event) => setPriority(event.target.value as TaskPriority)}>
+                {TASK_PRIORITIES.map((value) => <option value={value} key={value}>{PRIORITY_LABELS[value]}</option>)}
+              </select>
+            </label>
+            <label className="property-control property-assignee">
+              <ActorAvatar actor={assignee} className="property-assignee-avatar" />
+              <select
+                aria-label="负责人"
+                value={actorKey(assignee)}
+                onChange={(event) => {
+                  const selected = assigneeOptions.find((actor) => actorKey(actor) === event.target.value);
+                  if (selected) setAssignee(selected);
+                }}
+              >
+                {assigneeOptions.map((actor) => (
+                  <option value={actorKey(actor)} key={actorKey(actor)}>
+                    {actor.id === currentUser.id ? `${actor.name}（我）` : actor.name}
+                  </option>
+                ))}
+              </select>
+            </label>
+            <LabelPicker
+              availableLabels={availableLabels}
+              selectedLabels={selectedLabels}
+              open={menu === "labels"}
+              triggerClassName="property-control"
+              showIcon
+              onOpenChange={(open) => setMenu(open ? "labels" : null)}
+              onChange={setSelectedLabels}
+            />
+
+            <label className="property-control property-workflow">
+              <LinearIcon name="dashboard" />
+              <span className="sr-only">工作流</span>
+              <select value={workflowId} onChange={(event) => setWorkflowId(event.target.value)}>
+                <option value="">工作流</option>
+                {!workflowAvailable && <option value={workflowId}>当前设备未找到此流程</option>}
+                {workflows.map((workflow) => (
+                  <option value={workflow.id} key={workflow.id}>{workflow.name}</option>
+                ))}
+              </select>
+            </label>
+
+            <label className="property-control property-development" title={developmentScan.workspacePath ?? undefined}>
+              <LinearIcon name="branch" />
+              <span className="sr-only">代码分支或 Worktree</span>
+              <select
+                value={contextValue(developmentContext)}
+                disabled={developmentScanLoading}
+                onChange={(event) => setDevelopmentContext(event.target.value ? JSON.parse(event.target.value) as DevelopmentContext : null)}
+              >
+                <option value="">{developmentScanLoading ? "正在扫描 Git…" : "分支 / Worktree"}</option>
+                <optgroup label="代码分支">
+                  {developmentOptions.filter((context) => context.type === "branch").map((context) => <option value={contextValue(context)} key={contextValue(context)}>{contextLabel(context)}</option>)}
+                </optgroup>
+                <optgroup label="Worktree">
+                  {developmentOptions.filter((context) => context.type === "worktree").map((context) => <option value={contextValue(context)} key={contextValue(context)}>{contextLabel(context)}</option>)}
+                </optgroup>
+              </select>
+            </label>
+
+            {dueDate && <button className="property-control" type="button" onClick={() => setMenu("due")}><span>截止 {displayDate(dueDate)}</span></button>}
+            {recurrence && <button className="property-control" type="button" onClick={() => setMenu("recurrence")}><span>每 {recurrence.interval} {RECURRENCE_UNITS[recurrence.unit]}</span></button>}
+
+            <div className="composer-menu-anchor">
+              <button className="property-control property-more" type="button" aria-label="更多属性" onClick={() => setMenu(menu === "more" ? null : "more")}><LinearIcon name="more" /></button>
+              {menu === "more" && (
+                <div className="composer-popover more-popover">
+                  <button type="button" onClick={() => setMenu("due")}><span><LinearIcon name="calendarAdd" /></span><strong>设置截止日期</strong><kbd>⇧ D</kbd><b><LinearIcon name="chevronRight" /></b></button>
+                  <button type="button" onClick={() => setMenu("recurrence")}><span><LinearIcon name="recurrence" /></span><strong>设置重复…</strong><b><LinearIcon name="chevronRight" /></b></button>
+                </div>
+              )}
+              {menu === "due" && (
+                <div className="composer-popover due-popover">
+                  <label className="custom-date-row"><span>自定义…</span><input type="date" value={dueDate} onChange={(event) => chooseDueDate(event.target.value)} /></label>
+                  <button type="button" onClick={() => chooseDueDate(dateFromNow(1))}><strong>明天</strong><span>{displayDate(dateFromNow(1))}</span></button>
+                  <button type="button" onClick={() => chooseDueDate(endOfWeek())}><strong>本周结束</strong><span>{displayDate(endOfWeek())}</span></button>
+                  <button type="button" onClick={() => chooseDueDate(dateFromNow(7))}><strong>一周后</strong><span>{displayDate(dateFromNow(7))}</span></button>
+                  {dueDate && <button className="destructive-menu-row" type="button" onClick={() => { setDueDate(""); setRecurrence(null); setMenu(null); }}>清除截止日期</button>}
+                </div>
+              )}
+              {menu === "recurrence" && (
+                <div className="composer-popover recurrence-popover">
+                  <label><span>最早截止日期</span><input type="date" value={dueDate || dateFromNow(7)} onChange={(event) => setDueDate(event.target.value)} /></label>
+                  <label><span>重复频率</span><span className="recurrence-controls"><input type="number" min="1" max="365" value={recurrence?.interval ?? 1} onChange={(event) => setRecurrence({ interval: Number(event.target.value), unit: recurrence?.unit ?? "week" })} /><select value={recurrence?.unit ?? "week"} onChange={(event) => setRecurrence({ interval: recurrence?.interval ?? 1, unit: event.target.value as Recurrence["unit"] })}>{Object.entries(RECURRENCE_UNITS).map(([unit, label]) => <option value={unit} key={unit}>{label}</option>)}</select></span></label>
+                  <button className="recurrence-save" type="button" onClick={() => { if (!dueDate) setDueDate(dateFromNow(7)); if (!recurrence) setRecurrence({ interval: 1, unit: "week" }); setMenu(null); }}>设置重复</button>
+                  {recurrence && <button className="destructive-menu-row" type="button" onClick={() => { setRecurrence(null); setMenu(null); }}>清除重复</button>}
+                </div>
+              )}
+            </div>
+          </div>
+
+          {attachmentError && <div className="form-error" role="alert">{attachmentError}</div>}
+          {error && <div className="form-error" role="alert">{error}</div>}
+
+          <footer className="dialog-footer">
+            {!task && (
+              <>
+                <button className="composer-attach-icon" type="button" disabled={saving} onClick={() => attachmentInputRef.current?.click()} aria-label="上传附件">
+                  <LinearIcon name="attachment" />{attachments.length > 0 && <span>{attachments.length}</span>}
+                </button>
+                <input ref={attachmentInputRef} type="file" multiple hidden onChange={(event) => { if (event.currentTarget.files) addAttachments(event.currentTarget.files); event.currentTarget.value = ""; }} />
+              </>
+            )}
+            {task && <span aria-hidden="true" />}
+            <div className="dialog-actions">
+              {task && <span className="dialog-updated">编辑 {task.identifier}</span>}
+              <button className="button primary" type="submit" disabled={saving}>{saving ? "正在保存…" : task ? "保存更改" : "创建任务"}</button>
+            </div>
+          </footer>
+        </div>
+      </form>
+    </dialog>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/TaskFilterMenu.tsx b/apps/codex-taskboard/web/src/components/TaskFilterMenu.tsx
new file mode 100644
index 000000000..72e684a2f
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/TaskFilterMenu.tsx
@@ -0,0 +1,625 @@
+import {
+  useEffect,
+  useLayoutEffect,
+  useMemo,
+  useRef,
+  useState,
+  type CSSProperties,
+  type KeyboardEvent as ReactKeyboardEvent,
+  type ReactNode,
+} from "react";
+import { createPortal } from "react-dom";
+import {
+  EMPTY_TASK_FILTERS,
+  matchesTaskFilters,
+  matchesTaskSearch,
+  taskFilterCount,
+  type TaskFilterKey,
+  type TaskFilters,
+} from "../taskFilters";
+import {
+  TASK_PRIORITIES,
+  TASK_STATUSES,
+  type Task,
+  type TaskPriority,
+  type TaskStatus,
+} from "../types";
+import { STATUS_DETAILS } from "./BoardColumn";
+import { LinearIcon, LinearPriorityIcon, LinearStatusIcon } from "./LinearIcon";
+
+type SubmenuName = TaskFilterKey;
+
+interface TaskFilterMenuProps {
+  tasks: Task[];
+  search: string;
+  labels: string[];
+  filters: TaskFilters;
+  onChange: (filters: TaskFilters) => void;
+}
+
+interface FilterOption {
+  id: string;
+  label: string;
+  category: string;
+  keywords?: string;
+  count: number;
+  selected: boolean;
+  icon: ReactNode;
+  toggle: () => void;
+}
+
+const PRIORITY_LABELS: Record<TaskPriority, string> = {
+  none: "无优先级",
+  urgent: "紧急",
+  high: "高",
+  medium: "中",
+  low: "低",
+};
+
+const LINK_LABELS = {
+  linked: "Codex 已处理",
+  unlinked: "尚未由 Codex 处理",
+} as const;
+
+function labelColor(label: string): string {
+  let hash = 0;
+  for (const character of label) hash = (hash * 31 + character.charCodeAt(0)) >>> 0;
+  return `hsl(${hash % 360} 54% 55%)`;
+}
+
+function LabelGlyph({ label }: { label: string }) {
+  return <span className="filter-label-glyph" style={{ "--label-color": labelColor(label) } as CSSProperties} aria-hidden="true" />;
+}
+
+function joinSummary(values: string[], noun: string): string | null {
+  if (!values.length) return null;
+  if (values.length <= 2) return values.join("、");
+  return `${values.length} 个${noun}`;
+}
+
+export function TaskFilterMenu({ tasks, search, labels, filters, onChange }: TaskFilterMenuProps) {
+  const triggerRef = useRef<HTMLButtonElement>(null);
+  const menuRef = useRef<HTMLDivElement>(null);
+  const submenuRef = useRef<HTMLDivElement>(null);
+  const hoverTimerRef = useRef<number | null>(null);
+  const [open, setOpen] = useState(false);
+  const [submenu, setSubmenu] = useState<SubmenuName | null>(null);
+  const [rootQuery, setRootQuery] = useState("");
+  const [submenuQuery, setSubmenuQuery] = useState("");
+  const [contentDraft, setContentDraft] = useState("");
+  const [position, setPosition] = useState({ left: 0, top: 0, ready: false });
+  const [submenuSide, setSubmenuSide] = useState<"left" | "right" | "overlay">("left");
+  const [submenuShift, setSubmenuShift] = useState(0);
+  const activeCount = taskFilterCount(filters);
+
+  function closeMenu() {
+    if (hoverTimerRef.current !== null) window.clearTimeout(hoverTimerRef.current);
+    setOpen(false);
+    setSubmenu(null);
+    setRootQuery("");
+    setSubmenuQuery("");
+  }
+
+  function openMenu() {
+    setRootQuery("");
+    setSubmenu(null);
+    setPosition((current) => ({ ...current, ready: false }));
+    setOpen(true);
+  }
+
+  function openSubmenu(name: SubmenuName, focus = false) {
+    if (hoverTimerRef.current !== null) window.clearTimeout(hoverTimerRef.current);
+    setSubmenu(name);
+    setSubmenuQuery("");
+    if (name === "content") setContentDraft(filters.content);
+    if (focus) {
+      requestAnimationFrame(() => submenuRef.current?.querySelector<HTMLInputElement>("input")?.focus());
+    }
+  }
+
+  function scheduleSubmenu(name: SubmenuName) {
+    if (hoverTimerRef.current !== null) window.clearTimeout(hoverTimerRef.current);
+    hoverTimerRef.current = window.setTimeout(() => openSubmenu(name), 160);
+  }
+
+  function countFor(key: TaskFilterKey, predicate: (task: Task) => boolean): number {
+    return tasks.filter(
+      (task) => matchesTaskSearch(task, search) && matchesTaskFilters(task, filters, key) && predicate(task),
+    ).length;
+  }
+
+  function toggleStatus(status: TaskStatus) {
+    const selected = new Set(filters.statuses);
+    if (selected.has(status)) selected.delete(status);
+    else selected.add(status);
+    onChange({ ...filters, statuses: TASK_STATUSES.filter((value) => selected.has(value)) });
+  }
+
+  function togglePriority(priority: TaskPriority) {
+    const selected = new Set(filters.priorities);
+    if (selected.has(priority)) selected.delete(priority);
+    else selected.add(priority);
+    onChange({ ...filters, priorities: TASK_PRIORITIES.filter((value) => selected.has(value)) });
+  }
+
+  function toggleLabel(label: string) {
+    const selected = new Set(filters.labels);
+    if (selected.has(label)) selected.delete(label);
+    else selected.add(label);
+    onChange({ ...filters, labels: labels.filter((value) => selected.has(value)) });
+  }
+
+  function toggleLink(link: "linked" | "unlinked") {
+    onChange({ ...filters, link: filters.link === link ? "all" : link });
+  }
+
+  const statusOptions = useMemo<FilterOption[]>(() => TASK_STATUSES.map((status) => ({
+    id: `status-${status}`,
+    label: STATUS_DETAILS[status].label,
+    category: "状态",
+    keywords: status,
+    count: countFor("statuses", (task) => task.status === status),
+    selected: filters.statuses.includes(status),
+    icon: <span className={`filter-status-icon status-${status}`}><LinearStatusIcon status={status} /></span>,
+    toggle: () => toggleStatus(status),
+  })), [filters, search, tasks]);
+
+  const priorityOptions = useMemo<FilterOption[]>(() => TASK_PRIORITIES.map((priority) => ({
+    id: `priority-${priority}`,
+    label: PRIORITY_LABELS[priority],
+    category: "优先级",
+    keywords: priority,
+    count: countFor("priorities", (task) => task.priority === priority),
+    selected: filters.priorities.includes(priority),
+    icon: <LinearPriorityIcon priority={priority} />,
+    toggle: () => togglePriority(priority),
+  })), [filters, search, tasks]);
+
+  const labelOptions = useMemo<FilterOption[]>(() => labels.map((label) => ({
+    id: `label-${label}`,
+    label,
+    category: "标签",
+    count: countFor("labels", (task) => task.labels.includes(label)),
+    selected: filters.labels.includes(label),
+    icon: <LabelGlyph label={label} />,
+    toggle: () => toggleLabel(label),
+  })), [filters, labels, search, tasks]);
+
+  const linkOptions = useMemo<FilterOption[]>(() => ([
+    {
+      id: "link-linked",
+      label: LINK_LABELS.linked,
+      category: "Codex 对话",
+      keywords: "codex thread task 已处理",
+      count: countFor("link", (task) => Boolean(task.threadId)),
+      selected: filters.link === "linked",
+      icon: <LinearIcon name="link" />,
+      toggle: () => toggleLink("linked"),
+    },
+    {
+      id: "link-unlinked",
+      label: LINK_LABELS.unlinked,
+      category: "Codex 对话",
+      keywords: "codex thread task 未处理",
+      count: countFor("link", (task) => !task.threadId),
+      selected: filters.link === "unlinked",
+      icon: <LinearIcon name="linkOff" />,
+      toggle: () => toggleLink("unlinked"),
+    },
+  ]), [filters, search, tasks]);
+
+  const optionsBySubmenu: Partial<Record<SubmenuName, FilterOption[]>> = {
+    statuses: statusOptions,
+    priorities: priorityOptions,
+    labels: labelOptions,
+    link: linkOptions,
+  };
+
+  const categories = [
+    {
+      id: "statuses" as const,
+      label: "状态",
+      keywords: "status workflow",
+      icon: <LinearIcon name="status" />,
+      summary: joinSummary(filters.statuses.map((status) => STATUS_DETAILS[status].label), "状态"),
+    },
+    {
+      id: "priorities" as const,
+      label: "优先级",
+      keywords: "priority urgent high medium low",
+      icon: <LinearIcon name="priority" />,
+      summary: joinSummary(filters.priorities.map((priority) => PRIORITY_LABELS[priority]), "优先级"),
+    },
+    {
+      id: "labels" as const,
+      label: "标签",
+      keywords: "label tag",
+      icon: <LinearIcon name="label" />,
+      summary: joinSummary(filters.labels, "标签"),
+    },
+    {
+      id: "link" as const,
+      label: "Codex 关联",
+      keywords: "link linked thread task codex 关联",
+      icon: <LinearIcon name="link" />,
+      summary: filters.link === "all" ? null : LINK_LABELS[filters.link],
+    },
+    {
+      id: "content" as const,
+      label: "内容",
+      keywords: "content title description text 内容 标题 描述",
+      icon: <LinearIcon name="write" />,
+      summary: filters.content.trim() || null,
+    },
+  ];
+
+  const normalizedRootQuery = rootQuery.trim().toLowerCase();
+  const visibleCategories = categories.filter((category) => {
+    if (!normalizedRootQuery) return true;
+    return `${category.label} ${category.keywords}`.toLowerCase().includes(normalizedRootQuery);
+  });
+  const quickOptions = normalizedRootQuery
+    ? [...statusOptions, ...priorityOptions, ...labelOptions, ...linkOptions].filter((option) =>
+      `${option.label} ${option.keywords ?? ""}`.toLowerCase().includes(normalizedRootQuery),
+    )
+    : [];
+
+  useEffect(() => {
+    function handleShortcut(event: KeyboardEvent) {
+      const target = event.target as HTMLElement | null;
+      if (target?.matches("input, textarea, select, [contenteditable='true']")) return;
+      if (event.key.toLowerCase() === "f" && !event.metaKey && !event.ctrlKey && !event.altKey) {
+        event.preventDefault();
+        open ? closeMenu() : openMenu();
+      }
+    }
+
+    window.addEventListener("keydown", handleShortcut);
+    return () => window.removeEventListener("keydown", handleShortcut);
+  }, [open]);
+
+  useLayoutEffect(() => {
+    if (!open || !triggerRef.current || !menuRef.current) return;
+    const triggerRect = triggerRef.current.getBoundingClientRect();
+    const menuRect = menuRef.current.getBoundingClientRect();
+    const left = Math.max(8, Math.min(triggerRect.right - menuRect.width, window.innerWidth - menuRect.width - 8));
+    const below = triggerRect.bottom + 6;
+    const top = below + menuRect.height <= window.innerHeight - 8
+      ? below
+      : Math.max(8, triggerRect.top - menuRect.height - 6);
+    const rightSpace = window.innerWidth - (left + menuRect.width);
+    setPosition({ left, top, ready: true });
+    setSubmenuSide(
+      rightSpace >= menuRect.width + 4
+        ? "right"
+        : left >= menuRect.width + 12
+          ? "left"
+          : "overlay",
+    );
+  }, [activeCount, open, normalizedRootQuery]);
+
+  useLayoutEffect(() => {
+    if (!submenu || !submenuRef.current) {
+      setSubmenuShift(0);
+      return;
+    }
+    const rect = submenuRef.current.getBoundingClientRect();
+    const shift = rect.bottom > window.innerHeight - 8
+      ? window.innerHeight - 8 - rect.bottom
+      : rect.top < 8
+        ? 8 - rect.top
+        : 0;
+    setSubmenuShift(shift);
+  }, [filters, submenu, submenuQuery]);
+
+  useEffect(() => {
+    if (!open) return;
+    requestAnimationFrame(() => menuRef.current?.querySelector<HTMLInputElement>(".task-filter-search input")?.focus());
+
+    function closeFromOutside(event: PointerEvent) {
+      if (!menuRef.current?.contains(event.target as Node) && !triggerRef.current?.contains(event.target as Node)) {
+        closeMenu();
+      }
+    }
+    function closeFromViewportChange(event: Event) {
+      if (event.type === "scroll" && menuRef.current?.contains(event.target as Node)) return;
+      closeMenu();
+    }
+
+    document.addEventListener("pointerdown", closeFromOutside);
+    window.addEventListener("blur", closeFromViewportChange);
+    window.addEventListener("resize", closeFromViewportChange);
+    window.addEventListener("scroll", closeFromViewportChange, true);
+    return () => {
+      document.removeEventListener("pointerdown", closeFromOutside);
+      window.removeEventListener("blur", closeFromViewportChange);
+      window.removeEventListener("resize", closeFromViewportChange);
+      window.removeEventListener("scroll", closeFromViewportChange, true);
+    };
+  }, [open]);
+
+  useEffect(() => () => {
+    if (hoverTimerRef.current !== null) window.clearTimeout(hoverTimerRef.current);
+  }, []);
+
+  function focusSibling(button: HTMLButtonElement, direction: 1 | -1) {
+    const level = button.dataset.filterLevel;
+    const buttons = Array.from(menuRef.current?.querySelectorAll<HTMLButtonElement>(
+      `button[data-filter-level="${level}"]:not(:disabled)`,
+    ) ?? []);
+    const index = buttons.indexOf(button);
+    buttons[(Math.max(0, index) + direction + buttons.length) % buttons.length]?.focus();
+  }
+
+  function handleMenuKeyDown(event: ReactKeyboardEvent<HTMLDivElement>) {
+    const target = event.target as HTMLElement;
+    if (event.key === "Escape") {
+      event.preventDefault();
+      if (submenu) {
+        const owner = submenu;
+        setSubmenu(null);
+        requestAnimationFrame(() => menuRef.current?.querySelector<HTMLButtonElement>(`[data-submenu-name="${owner}"]`)?.focus());
+      } else {
+        closeMenu();
+        triggerRef.current?.focus();
+      }
+      return;
+    }
+
+    if (event.key === "Tab") {
+      const focusable = Array.from(menuRef.current?.querySelectorAll<HTMLElement>("input:not(:disabled), button:not(:disabled)") ?? [])
+        .filter((element) => element.getClientRects().length > 0);
+      const index = focusable.indexOf(target);
+      const direction = event.shiftKey ? -1 : 1;
+      if (focusable.length) {
+        event.preventDefault();
+        focusable[(Math.max(0, index) + direction + focusable.length) % focusable.length]?.focus();
+      }
+      return;
+    }
+
+    if (target instanceof HTMLInputElement && (event.key === "ArrowDown" || event.key === "ArrowUp")) {
+      const level = target.dataset.filterLevel;
+      const buttons = Array.from(menuRef.current?.querySelectorAll<HTMLButtonElement>(
+        `button[data-filter-level="${level}"]:not(:disabled)`,
+      ) ?? []);
+      if (buttons.length) {
+        event.preventDefault();
+        (event.key === "ArrowDown" ? buttons[0] : buttons.at(-1))?.focus();
+      }
+      return;
+    }
+
+    const button = target.closest<HTMLButtonElement>("button[data-filter-level]");
+    if (!button) return;
+    if (event.key === "ArrowDown" || event.key === "ArrowUp") {
+      event.preventDefault();
+      focusSibling(button, event.key === "ArrowDown" ? 1 : -1);
+    } else if (event.key === "ArrowRight" && button.dataset.submenuName) {
+      event.preventDefault();
+      openSubmenu(button.dataset.submenuName as SubmenuName, true);
+    } else if (event.key === "ArrowLeft" && button.dataset.filterLevel === "submenu") {
+      event.preventDefault();
+      const owner = submenu;
+      setSubmenu(null);
+      requestAnimationFrame(() => menuRef.current?.querySelector<HTMLButtonElement>(`[data-submenu-name="${owner}"]`)?.focus());
+    }
+  }
+
+  function renderOption(option: FilterOption, level: "root" | "submenu") {
+    return (
+      <button
+        key={option.id}
+        type="button"
+        role="menuitemcheckbox"
+        aria-checked={option.selected}
+        className={`task-filter-item filter-value-item${option.selected ? " is-selected" : ""}`}
+        data-filter-level={level}
+        onPointerEnter={() => {
+          if (level === "root") setSubmenu(null);
+        }}
+        onClick={option.toggle}
+      >
+        <span className="task-filter-item-icon">{option.icon}</span>
+        <span className="task-filter-item-label">{option.label}</span>
+        {level === "root" && <span className="task-filter-item-category">{option.category}</span>}
+        <span className="task-filter-item-count">{option.count}</span>
+        <span className="task-filter-item-check">{option.selected && <LinearIcon name="check" />}</span>
+      </button>
+    );
+  }
+
+  function renderValueSubmenu(name: Exclude<SubmenuName, "content">) {
+    const options = optionsBySubmenu[name] ?? [];
+    const needle = submenuQuery.trim().toLowerCase();
+    const visible = options.filter((option) => `${option.label} ${option.keywords ?? ""}`.toLowerCase().includes(needle));
+    const matching = visible.filter((option) => option.count > 0 || option.selected);
+    const unmatched = visible.filter((option) => option.count === 0 && !option.selected);
+
+    return (
+      <>
+        <label className="task-filter-search submenu-filter-search">
+          <span className="sr-only">筛选值</span>
+          <input
+            data-filter-level="submenu"
+            value={submenuQuery}
+            onChange={(event) => setSubmenuQuery(event.target.value)}
+            placeholder="筛选…"
+          />
+        </label>
+        <div className="task-filter-scroll" role="menu">
+          {matching.map((option) => renderOption(option, "submenu"))}
+          {unmatched.length > 0 && (
+            <>
+              <div className="task-filter-section-label">当前视图中无匹配</div>
+              <div className="task-filter-unmatched">{unmatched.map((option) => renderOption(option, "submenu"))}</div>
+            </>
+          )}
+          {visible.length === 0 && <div className="task-filter-no-results">没有匹配的筛选值</div>}
+        </div>
+      </>
+    );
+  }
+
+  function renderContentSubmenu() {
+    const value = contentDraft.trim();
+    function applyContent() {
+      if (!value) return;
+      onChange({ ...filters, content: value });
+      closeMenu();
+    }
+
+    return (
+      <>
+        <label className="task-filter-search submenu-filter-search">
+          <span className="sr-only">按内容筛选</span>
+          <input
+            data-filter-level="submenu"
+            value={contentDraft}
+            onChange={(event) => setContentDraft(event.target.value)}
+            onKeyDown={(event) => {
+              if (event.key === "Enter" && value) {
+                event.preventDefault();
+                applyContent();
+              }
+            }}
+            placeholder="输入标题或描述…"
+          />
+        </label>
+        <div className="task-filter-scroll" role="menu">
+          <button
+            type="button"
+            className="task-filter-item filter-content-apply"
+            data-filter-level="submenu"
+            disabled={!value}
+            onClick={applyContent}
+          >
+            <span className="task-filter-item-icon"><LinearIcon name="write" /></span>
+            <span className="task-filter-item-label">{value ? `包含“${value}”` : "输入内容以创建筛选"}</span>
+            <kbd>↵</kbd>
+          </button>
+          {filters.content && (
+            <button
+              type="button"
+              className="task-filter-item filter-content-clear"
+              data-filter-level="submenu"
+              onClick={() => {
+                onChange({ ...filters, content: "" });
+                setContentDraft("");
+              }}
+            >
+              <span className="task-filter-item-icon"><LinearIcon name="close" /></span>
+              <span className="task-filter-item-label">移除内容筛选</span>
+            </button>
+          )}
+        </div>
+      </>
+    );
+  }
+
+  const menu = open ? createPortal(
+    <div
+      ref={menuRef}
+      className="task-filter-menu"
+      data-has-submenu={submenu ? "true" : undefined}
+      data-submenu-side={submenuSide}
+      style={{ left: position.left, top: position.top, visibility: position.ready ? "visible" : "hidden" }}
+      onKeyDown={handleMenuKeyDown}
+    >
+      <label className="task-filter-search root-filter-search">
+        <span className="sr-only">添加筛选</span>
+        <input
+          data-filter-level="root"
+          value={rootQuery}
+          onChange={(event) => {
+            setRootQuery(event.target.value);
+            setSubmenu(null);
+          }}
+          placeholder="添加筛选…"
+        />
+        <kbd>F</kbd>
+      </label>
+
+      <div className="task-filter-root-list" role="menu">
+        {visibleCategories.map((category) => (
+          <div className="task-filter-anchor" key={category.id}>
+            <button
+              type="button"
+              role="menuitem"
+              aria-haspopup="menu"
+              aria-expanded={submenu === category.id}
+              className={`task-filter-item task-filter-category${submenu === category.id ? " is-open" : ""}${category.summary ? " is-active" : ""}`}
+              data-filter-level="root"
+              data-submenu-name={category.id}
+              onPointerEnter={() => scheduleSubmenu(category.id)}
+              onClick={() => submenu === category.id ? setSubmenu(null) : openSubmenu(category.id, true)}
+            >
+              <span className="task-filter-item-icon">{category.icon}</span>
+              <span className="task-filter-item-label">{category.label}</span>
+              {category.summary && <span className="task-filter-item-summary">{category.summary}</span>}
+              <span className="task-filter-chevron"><LinearIcon name="chevronRight" /></span>
+            </button>
+
+            {submenu === category.id && (
+              <div
+                ref={submenuRef}
+                className="task-filter-submenu"
+                role="presentation"
+                style={{ "--submenu-shift": `${submenuShift}px` } as CSSProperties}
+              >
+                {category.id === "content"
+                  ? renderContentSubmenu()
+                  : renderValueSubmenu(category.id)}
+              </div>
+            )}
+          </div>
+        ))}
+
+        {quickOptions.length > 0 && (
+          <>
+            {visibleCategories.length > 0 && <div className="task-filter-section-label">筛选值</div>}
+            {quickOptions.map((option) => renderOption(option, "root"))}
+          </>
+        )}
+
+        {visibleCategories.length === 0 && quickOptions.length === 0 && (
+          <div className="task-filter-no-results">没有匹配的筛选项</div>
+        )}
+      </div>
+
+      {activeCount > 0 && (
+        <div className="task-filter-footer">
+          <button
+            type="button"
+            className="task-filter-clear-all"
+            data-filter-level="root"
+            onClick={() => onChange(EMPTY_TASK_FILTERS)}
+          >
+            清除所有筛选
+            <span>{activeCount}</span>
+          </button>
+        </div>
+      )}
+    </div>,
+    document.body,
+  ) : null;
+
+  return (
+    <>
+      <button
+        ref={triggerRef}
+        type="button"
+        className={`task-filter-trigger${activeCount ? " is-active" : ""}${open ? " is-open" : ""}`}
+        aria-label={activeCount ? `筛选任务，已启用 ${activeCount} 个条件` : "筛选任务"}
+        aria-haspopup="menu"
+        aria-expanded={open}
+        title={activeCount ? `已启用 ${activeCount} 个筛选条件 (F)` : "筛选任务 (F)"}
+        onClick={() => open ? closeMenu() : openMenu()}
+      >
+        <LinearIcon name="filter" className="filter-icon" />
+        {activeCount > 0 && <span className="task-filter-active-dot" aria-hidden="true" />}
+      </button>
+      {menu}
+    </>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/WorkflowBoard.tsx b/apps/codex-taskboard/web/src/components/WorkflowBoard.tsx
new file mode 100644
index 000000000..aa0394163
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/WorkflowBoard.tsx
@@ -0,0 +1,1491 @@
+import {
+  useCallback,
+  useEffect,
+  useLayoutEffect,
+  useMemo,
+  useRef,
+  useState,
+  type KeyboardEvent,
+  type MouseEvent as ReactMouseEvent,
+} from "react";
+import { createPortal } from "react-dom";
+import {
+  applyNodeChanges,
+  Background,
+  BackgroundVariant,
+  Controls,
+  ReactFlow,
+  type Edge,
+  type EdgeTypes,
+  type NodeChange,
+  type NodeTypes,
+  type OnNodeDrag,
+  type ReactFlowInstance,
+} from "@xyflow/react";
+import "@xyflow/react/dist/style.css";
+import "./workflow.css";
+import {
+  createWorkflowFlow,
+  deleteWorkflowNode,
+  deriveWorkflowLayout,
+  findWorkflowItem,
+  insertWorkflowNode,
+  moveWorkflowNode,
+  normalizeWorkflowSnapshot,
+  serializeWorkflowSnapshot,
+  workflowNodeIds,
+} from "../../../shared/workflow-control-flow.mjs";
+import type {
+  WorkflowFlow,
+  WorkflowSequenceRef,
+} from "../../../shared/workflow-control-flow.mjs";
+import {
+  ApiError,
+  getWorkflowWorkspace,
+  listWorkflowCapabilities,
+  saveWorkflowWorkspace,
+} from "../api";
+import type { WorkflowCapabilities, WorkflowOption } from "../types";
+import {
+  clearLegacyWorkflowWorkspace,
+  INITIAL_WORKFLOW_ID,
+  INITIAL_WORKFLOW_NAME,
+  readLegacyWorkflowWorkspace,
+} from "../workflowStore";
+import { LinearIcon } from "./LinearIcon";
+import { WorkflowInsertEdge } from "./WorkflowInsertEdge";
+import { WorkflowInspector } from "./WorkflowInspector";
+import {
+  WorkflowNode,
+  type WorkflowCanvasNode,
+  type WorkflowNodeData,
+} from "./WorkflowNode";
+import { WorkflowStepPicker } from "./WorkflowStepPicker";
+import {
+  PALETTE_ITEMS,
+  capabilityNodeMeta,
+  isWorkflowTriggerKind,
+  paletteData,
+  type PaletteItem,
+  workflowNodeConfigured,
+  workflowNodeDisplayTitle,
+} from "./workflowCatalog";
+
+interface WorkflowBoardProps {
+  projectId: string;
+  projectName: string;
+  workspacePath?: string;
+  revision: number;
+  onWorkflowsChange: (workflows: WorkflowOption[]) => void;
+}
+
+interface WorkflowTab {
+  id: string;
+  name: string;
+}
+
+interface WorkflowSnapshot {
+  nodes: WorkflowCanvasNode[];
+  flow: WorkflowFlow;
+  selectedNodeId: string | null;
+}
+
+interface LegacyWorkflowSnapshot {
+  nodes: WorkflowCanvasNode[];
+  edges?: Edge[];
+  flow?: WorkflowFlow;
+  selectedNodeId: string | null;
+}
+
+interface WorkflowWorkspace {
+  version: 1;
+  tabs: WorkflowTab[];
+  activeWorkflowId: string;
+  snapshots: Record<string, LegacyWorkflowSnapshot>;
+}
+
+type StepPickerTarget =
+  | {
+      kind: "sequence";
+      sequenceRef: WorkflowSequenceRef;
+      index: number;
+    }
+  | {
+      kind: "plan";
+      parentId: string;
+    };
+
+interface WorkflowTabMenu {
+  workflowId: string;
+  x: number;
+  y: number;
+}
+
+interface PlanDragPreview {
+  nodeId: string;
+  parentId?: string;
+  sequenceRef?: WorkflowSequenceRef;
+  sourceOrderIds: string[];
+  sourceIndex: number;
+  targetIndex: number;
+}
+
+const WORKFLOW_STEP_WIDTH = 250;
+const WORKFLOW_STEP_HEIGHT = 138;
+const PLAN_ITEM_WIDTH = 230;
+const PLAN_ITEM_HEIGHT = 34;
+const PLAN_ITEM_GAP = 4;
+const PLAN_LIST_TOP = 86;
+const PLAN_CONTAINER_BOTTOM = 38;
+const END_STEP_HEIGHT = 1;
+const TOP_CENTER_ORIGIN: [number, number] = [0.5, 0];
+const TOP_LEFT_ORIGIN: [number, number] = [0, 0];
+const CANVAS_PAN_PADDING = 72;
+const PRO_OPTIONS = { hideAttribution: true };
+const NODE_TYPES = { workflow: WorkflowNode } satisfies NodeTypes;
+const EDGE_TYPES = { workflowInsert: WorkflowInsertEdge } satisfies EdgeTypes;
+const NESTABLE_TONES = new Set(["capability", "api", "integration", "development"]);
+
+function isVirtualWorkflowNodeId(nodeId: string) {
+  return nodeId.startsWith("__flow-");
+}
+
+function workflowContentBounds(nodes: WorkflowCanvasNode[]) {
+  const rootNodes = nodes.filter((node) => !node.parentId && !isVirtualWorkflowNodeId(node.id));
+  if (rootNodes.length === 0) return null;
+  let minX = Number.POSITIVE_INFINITY;
+  let minY = Number.POSITIVE_INFINITY;
+  let maxX = Number.NEGATIVE_INFINITY;
+  let maxY = Number.NEGATIVE_INFINITY;
+  for (const node of rootNodes) {
+    const width = Number(node.style?.width ?? node.measured?.width ?? node.initialWidth ?? WORKFLOW_STEP_WIDTH);
+    const height = Number(node.style?.height ?? node.measured?.height ?? node.initialHeight ?? WORKFLOW_STEP_HEIGHT);
+    const origin = node.origin ?? TOP_CENTER_ORIGIN;
+    const x = node.position.x - width * origin[0];
+    const y = node.position.y - height * origin[1];
+    minX = Math.min(minX, x);
+    minY = Math.min(minY, y);
+    maxX = Math.max(maxX, x + width);
+    maxY = Math.max(maxY, y + height);
+  }
+  return { minX, minY, maxX, maxY };
+}
+
+function planItemPosition(index: number) {
+  return {
+    x: (WORKFLOW_STEP_WIDTH - PLAN_ITEM_WIDTH) / 2,
+    y: PLAN_LIST_TOP + index * (PLAN_ITEM_HEIGHT + PLAN_ITEM_GAP),
+  };
+}
+
+function planContainerHeight(childCount: number) {
+  const listHeight = childCount === 0
+    ? 0
+    : childCount * PLAN_ITEM_HEIGHT + (childCount - 1) * PLAN_ITEM_GAP;
+  return Math.max(
+    WORKFLOW_STEP_HEIGHT,
+    PLAN_LIST_TOP + listHeight + PLAN_CONTAINER_BOTTOM,
+  );
+}
+
+function layoutPlanChildren(
+  nodes: WorkflowCanvasNode[],
+  parentId: string,
+  orderedChildIds: string[],
+): WorkflowCanvasNode[] {
+  const positions = new Map(orderedChildIds.map((id, index) => [id, planItemPosition(index)]));
+  return nodes.map((node) => (
+    node.parentId === parentId && positions.has(node.id)
+      ? {
+          ...node,
+          origin: TOP_LEFT_ORIGIN,
+          position: positions.get(node.id)!,
+          style: { width: PLAN_ITEM_WIDTH, height: PLAN_ITEM_HEIGHT },
+          initialWidth: PLAN_ITEM_WIDTH,
+          initialHeight: PLAN_ITEM_HEIGHT,
+          measured: { width: PLAN_ITEM_WIDTH, height: PLAN_ITEM_HEIGHT },
+          zIndex: 2,
+        }
+      : node
+  ));
+}
+
+function prepareWorkflowNodes(nodes: WorkflowCanvasNode[]): WorkflowCanvasNode[] {
+  let next = nodes;
+  for (const node of nodes) {
+    if (node.parentId) continue;
+    if (node.data.acceptsChildren) {
+      const childIds = next
+        .filter((candidate) => candidate.parentId === node.id)
+        .sort((left, right) => left.position.y - right.position.y)
+        .map((candidate) => candidate.id);
+      next = layoutPlanChildren(next, node.id, childIds);
+      const height = planContainerHeight(childIds.length);
+      next = next.map((candidate) => (
+        candidate.id === node.id
+          ? {
+              ...candidate,
+              style: { width: WORKFLOW_STEP_WIDTH, height },
+              initialWidth: WORKFLOW_STEP_WIDTH,
+              initialHeight: height,
+              measured: { width: WORKFLOW_STEP_WIDTH, height },
+            }
+          : candidate
+      ));
+    }
+  }
+  return next;
+}
+
+function layoutWorkflowFlow(
+  nodes: WorkflowCanvasNode[],
+  flow: WorkflowFlow,
+): WorkflowCanvasNode[] {
+  const prepared = prepareWorkflowNodes(nodes);
+  const layout = deriveWorkflowLayout(flow, prepared);
+  return prepared.map((node) => {
+    if (node.parentId || !layout.positions[node.id]) return node;
+    const height = Number(node.style?.height ?? WORKFLOW_STEP_HEIGHT);
+    return {
+      ...node,
+      origin: TOP_CENTER_ORIGIN,
+      position: layout.positions[node.id],
+      style: { width: WORKFLOW_STEP_WIDTH, height },
+      initialWidth: WORKFLOW_STEP_WIDTH,
+      initialHeight: height,
+      measured: { width: WORKFLOW_STEP_WIDTH, height },
+    };
+  });
+}
+
+function normalizeSnapshot(snapshot: LegacyWorkflowSnapshot): WorkflowSnapshot {
+  const normalized = normalizeWorkflowSnapshot(snapshot);
+  return {
+    nodes: layoutWorkflowFlow(normalized.nodes, normalized.flow),
+    flow: normalized.flow,
+    selectedNodeId: null,
+  };
+}
+
+function initialNodes(): WorkflowCanvasNode[] {
+  const nodes: WorkflowCanvasNode[] = [
+    {
+      id: "issue-trigger",
+      type: "workflow",
+      position: { x: 0, y: 48 },
+      data: {
+        ...paletteData("issue-trigger"),
+        title: "任务触发器",
+        description: "状态变为「待办事项」时触发",
+        meta: "任意优先级 · 任意标签",
+      },
+    },
+    {
+      id: "basic-planning",
+      type: "workflow",
+      position: { x: 0, y: 184 },
+      data: {
+        ...paletteData("basic-planning"),
+        title: "拆解任务执行计划",
+        description: "生成步骤、依赖和验收条件",
+        meta: "基础规划 · 当前项目",
+      },
+    },
+    {
+      id: "skill",
+      type: "workflow",
+      parentId: "basic-planning",
+      position: planItemPosition(0),
+      data: {
+        ...paletteData("skill"),
+        title: "调用 Skill",
+        description: "运行一个已安装的 Skill",
+        meta: "尚未选择 Skill",
+      },
+    },
+    {
+      id: "mcp",
+      type: "workflow",
+      parentId: "basic-planning",
+      position: planItemPosition(1),
+      data: {
+        ...paletteData("mcp"),
+        title: "调用 MCP",
+        description: "连接一个已配置的 MCP Server",
+        meta: "尚未选择 MCP Server",
+      },
+    },
+    {
+      id: "nano-banana",
+      type: "workflow",
+      parentId: "basic-planning",
+      position: planItemPosition(2),
+      data: {
+        ...paletteData("nano-banana"),
+        title: "生成预览素材",
+        description: "根据任务内容生成预览图",
+        meta: "Nano Banana · 16:9",
+      },
+    },
+    {
+      id: "cloudflare-deploy",
+      type: "workflow",
+      parentId: "basic-planning",
+      position: planItemPosition(3),
+      data: {
+        ...paletteData("cloudflare-deploy"),
+        title: "部署预览版本",
+        description: "构建并发布项目预览",
+        meta: "Cloudflare Pages · Preview",
+      },
+    },
+    {
+      id: "codex-review",
+      type: "workflow",
+      position: { x: 0, y: 520 },
+      data: {
+        ...paletteData("codex-review"),
+        title: "审核交付结果",
+        description: "检查产物、测试与验收条件",
+        meta: "Codex · 自动审核",
+      },
+    },
+    {
+      id: "issue-update",
+      type: "workflow",
+      position: { x: 0, y: 656 },
+      data: {
+        ...paletteData("issue-update"),
+        title: "提交审核",
+        description: "追加结果评论并更新状态",
+        meta: "状态 → 审核中",
+      },
+    },
+  ];
+  return nodes;
+}
+
+function createInitialWorkflowWorkspace() {
+  const stepIds = ["issue-trigger", "basic-planning", "codex-review", "issue-update"];
+  const flow = createWorkflowFlow(stepIds);
+  return {
+    tabs: [{ id: INITIAL_WORKFLOW_ID, name: INITIAL_WORKFLOW_NAME }],
+    activeWorkflowId: INITIAL_WORKFLOW_ID,
+    snapshots: new Map<string, WorkflowSnapshot>([
+      [
+        INITIAL_WORKFLOW_ID,
+        {
+          nodes: layoutWorkflowFlow(initialNodes(), flow),
+          flow,
+          selectedNodeId: null,
+        },
+      ],
+    ]),
+  };
+}
+
+function parseWorkflowWorkspace(value: unknown) {
+  if (!value || typeof value !== "object" || Array.isArray(value)) return null;
+  const stored = value as Partial<WorkflowWorkspace>;
+  if (stored.version !== 1 || !Array.isArray(stored.tabs) || !stored.snapshots) return null;
+  const tabs = stored.tabs.filter((tab) => (
+    typeof tab?.id === "string"
+    && typeof tab.name === "string"
+    && tab.id.length > 0
+    && tab.name.length > 0
+  ));
+  if (tabs.length === 0) return null;
+
+  const snapshots = new Map<string, WorkflowSnapshot>();
+  for (const tab of tabs) {
+    const snapshot = stored.snapshots[tab.id];
+    if (
+      !snapshot
+      || !Array.isArray(snapshot.nodes)
+      || (!Array.isArray(snapshot.edges) && snapshot.flow?.version !== 2)
+      || (snapshot.selectedNodeId != null && typeof snapshot.selectedNodeId !== "string")
+    ) {
+      return null;
+    }
+    snapshots.set(tab.id, normalizeSnapshot(snapshot));
+  }
+  const activeWorkflowId = tabs.some((tab) => tab.id === stored.activeWorkflowId)
+    ? stored.activeWorkflowId!
+    : tabs[0].id;
+  return { tabs, activeWorkflowId, snapshots };
+}
+
+function serializeWorkflowWorkspace(
+  tabs: WorkflowTab[],
+  activeWorkflowId: string,
+  snapshots: Map<string, WorkflowSnapshot>,
+): WorkflowWorkspace {
+  return {
+    version: 1,
+    tabs,
+    activeWorkflowId,
+    snapshots: Object.fromEntries(tabs.map((tab) => {
+      const snapshot = snapshots.get(tab.id)!;
+      return [
+        tab.id,
+        {
+          ...serializeWorkflowSnapshot(snapshot.nodes, snapshot.flow, null),
+        },
+      ];
+    })),
+  };
+}
+
+function workflowSignature(tab: WorkflowTab, snapshot: WorkflowSnapshot): string {
+  return JSON.stringify({
+    name: tab.name,
+    nodes: snapshot.nodes,
+    flow: snapshot.flow,
+  });
+}
+
+function mergeLegacyWorkspace(
+  remote: ReturnType<typeof createInitialWorkflowWorkspace>,
+  legacy: ReturnType<typeof createInitialWorkflowWorkspace>,
+) {
+  const tabs = [...remote.tabs];
+  const snapshots = new Map(remote.snapshots);
+  for (const legacyTab of legacy.tabs) {
+    const legacySnapshot = legacy.snapshots.get(legacyTab.id)!;
+    const remoteTab = tabs.find((tab) => tab.id === legacyTab.id);
+    if (!remoteTab) {
+      tabs.push(legacyTab);
+      snapshots.set(legacyTab.id, normalizeSnapshot(legacySnapshot));
+      continue;
+    }
+    const remoteSnapshot = snapshots.get(remoteTab.id)!;
+    if (workflowSignature(remoteTab, remoteSnapshot) === workflowSignature(legacyTab, legacySnapshot)) {
+      continue;
+    }
+    const importedId = `workflow-imported-${crypto.randomUUID()}`;
+    tabs.push({ id: importedId, name: `${legacyTab.name}（从另一入口导入）` });
+    snapshots.set(importedId, normalizeSnapshot(legacySnapshot));
+  }
+  return {
+    tabs,
+    activeWorkflowId: remote.activeWorkflowId,
+    snapshots,
+  };
+}
+
+function planDragShift(
+  nodeId: string,
+  preview: PlanDragPreview | null,
+): number {
+  if (!preview || nodeId === preview.nodeId) return 0;
+  const nodeIndex = preview.sourceOrderIds.indexOf(nodeId);
+  const distance = PLAN_ITEM_HEIGHT + PLAN_ITEM_GAP;
+  if (preview.targetIndex > preview.sourceIndex) {
+    return nodeIndex > preview.sourceIndex && nodeIndex <= preview.targetIndex ? -distance : 0;
+  }
+  if (preview.targetIndex < preview.sourceIndex) {
+    return nodeIndex >= preview.targetIndex && nodeIndex < preview.sourceIndex ? distance : 0;
+  }
+  return 0;
+}
+
+export function WorkflowBoard({
+  projectId,
+  projectName,
+  workspacePath,
+  revision,
+  onWorkflowsChange,
+}: WorkflowBoardProps) {
+  const [initialWorkspace] = useState(
+    () => parseWorkflowWorkspace(readLegacyWorkflowWorkspace(projectId)) ?? createInitialWorkflowWorkspace(),
+  );
+  const initialSnapshot = initialWorkspace.snapshots.get(initialWorkspace.activeWorkflowId)!;
+  const [nodes, setNodes] = useState<WorkflowCanvasNode[]>(initialSnapshot.nodes);
+  const [flow, setFlow] = useState<WorkflowFlow>(initialSnapshot.flow);
+  const [workflowTabs, setWorkflowTabs] = useState<WorkflowTab[]>(initialWorkspace.tabs);
+  const [activeWorkflowId, setActiveWorkflowId] = useState(initialWorkspace.activeWorkflowId);
+  const [selectedNodeId, setSelectedNodeId] = useState<string | null>(null);
+  const [renamingWorkflowId, setRenamingWorkflowId] = useState<string | null>(null);
+  const [workflowNameDraft, setWorkflowNameDraft] = useState("");
+  const [workflowTabMenu, setWorkflowTabMenu] = useState<WorkflowTabMenu | null>(null);
+  const [pickerTarget, setPickerTarget] = useState<StepPickerTarget | null>(null);
+  const [planDragPreview, setPlanDragPreview] = useState<PlanDragPreview | null>(null);
+  const [settlingNodeId, setSettlingNodeId] = useState<string | null>(null);
+  const [workflowCapabilities, setWorkflowCapabilities] = useState<WorkflowCapabilities | null>(null);
+  const [workflowCapabilitiesFailed, setWorkflowCapabilitiesFailed] = useState(false);
+  const [hydrated, setHydrated] = useState(false);
+  const [persistenceError, setPersistenceError] = useState("");
+  const [canvasSize, setCanvasSize] = useState({ width: 0, height: 0 });
+  const [canvasZoom, setCanvasZoom] = useState(1);
+  const [contentBounds, setContentBounds] = useState(
+    () => workflowContentBounds(initialSnapshot.nodes),
+  );
+  const flowRef = useRef<ReactFlowInstance<WorkflowCanvasNode, Edge> | null>(null);
+  const canvasRef = useRef<HTMLDivElement | null>(null);
+  const workflowNameInputRef = useRef<HTMLInputElement | null>(null);
+  const workflowTabMenuRef = useRef<HTMLDivElement | null>(null);
+  const cancelWorkflowRenameRef = useRef(false);
+  const workflowSnapshotsRef = useRef(initialWorkspace.snapshots);
+  const remoteVersionRef = useRef(0);
+  const lastRemoteWorkspaceRef = useRef("");
+  const saveQueueRef = useRef<Promise<void>>(Promise.resolve());
+  const mountedRef = useRef(true);
+  const settleTimerRef = useRef<number | null>(null);
+  const planDragSessionRef = useRef<PlanDragPreview | null>(null);
+
+  const layout = useMemo(() => deriveWorkflowLayout(flow, nodes), [flow, nodes]);
+  const rootStepIds = flow.root.items.map((item) => item.nodeId);
+  const selectedNode = nodes.find((node) => node.id === selectedNodeId) ?? null;
+  const translateExtent = useMemo<[[number, number], [number, number]] | undefined>(() => {
+    if (!contentBounds || canvasSize.width === 0 || canvasSize.height === 0) return undefined;
+    const padding = CANVAS_PAN_PADDING / canvasZoom;
+    const viewportWidth = canvasSize.width / canvasZoom;
+    const viewportHeight = canvasSize.height / canvasZoom;
+    const contentWidth = contentBounds.maxX - contentBounds.minX;
+    const contentHeight = contentBounds.maxY - contentBounds.minY;
+    const extentWidth = Math.max(contentWidth + padding * 2, viewportWidth + padding * 2);
+    const extentHeight = Math.max(contentHeight + padding * 2, viewportHeight + padding * 2);
+    const centerX = (contentBounds.minX + contentBounds.maxX) / 2;
+    const centerY = (contentBounds.minY + contentBounds.maxY) / 2;
+    return [
+      [centerX - extentWidth / 2, centerY - extentHeight / 2],
+      [centerX + extentWidth / 2, centerY + extentHeight / 2],
+    ];
+  }, [canvasSize.height, canvasSize.width, canvasZoom, contentBounds]);
+
+  const applyWorkspace = useCallback((workspace: ReturnType<typeof createInitialWorkflowWorkspace>) => {
+    const snapshot = normalizeSnapshot(workspace.snapshots.get(workspace.activeWorkflowId)!);
+    workflowSnapshotsRef.current = new Map(workspace.snapshots);
+    workflowSnapshotsRef.current.set(workspace.activeWorkflowId, snapshot);
+    setWorkflowTabs(workspace.tabs);
+    setActiveWorkflowId(workspace.activeWorkflowId);
+    setNodes(snapshot.nodes);
+    setFlow(snapshot.flow);
+    setSelectedNodeId(null);
+    setRenamingWorkflowId(null);
+    setWorkflowTabMenu(null);
+    onWorkflowsChange(workspace.tabs);
+  }, [onWorkflowsChange]);
+
+  useEffect(() => {
+    mountedRef.current = true;
+    return () => {
+      mountedRef.current = false;
+      if (settleTimerRef.current !== null) window.clearTimeout(settleTimerRef.current);
+    };
+  }, []);
+
+  useLayoutEffect(() => {
+    const canvas = canvasRef.current;
+    if (!canvas) return;
+    function updateCanvasSize() {
+      const rect = canvas!.getBoundingClientRect();
+      setCanvasSize((current) => (
+        current.width === rect.width && current.height === rect.height
+          ? current
+          : { width: rect.width, height: rect.height }
+      ));
+    }
+    updateCanvasSize();
+    const observer = new ResizeObserver(updateCanvasSize);
+    observer.observe(canvas);
+    return () => observer.disconnect();
+  }, []);
+
+  useLayoutEffect(() => {
+    const frame = window.requestAnimationFrame(() => {
+      const rootNodeIds = nodes
+        .filter((node) => !node.parentId && !isVirtualWorkflowNodeId(node.id))
+        .map((node) => node.id);
+      if (rootNodeIds.length === 0) {
+        setContentBounds(null);
+        return;
+      }
+      const measured = flowRef.current?.getNodesBounds(rootNodeIds);
+      const next = measured && measured.width > 0 && measured.height > 0
+        ? {
+            minX: measured.x,
+            minY: measured.y,
+            maxX: measured.x + measured.width,
+            maxY: measured.y + measured.height,
+          }
+        : workflowContentBounds(nodes);
+      setContentBounds((current) => (
+        current?.minX === next?.minX
+        && current?.minY === next?.minY
+        && current?.maxX === next?.maxX
+        && current?.maxY === next?.maxY
+          ? current
+          : next
+      ));
+    });
+    return () => window.cancelAnimationFrame(frame);
+  }, [activeWorkflowId, nodes]);
+
+  useEffect(() => {
+    if (!translateExtent) return;
+    const frame = window.requestAnimationFrame(() => {
+      const instance = flowRef.current;
+      if (instance) void instance.zoomTo(instance.getZoom(), { duration: 0 });
+    });
+    return () => window.cancelAnimationFrame(frame);
+  }, [translateExtent]);
+
+  useEffect(() => {
+    let cancelled = false;
+    const legacy = parseWorkflowWorkspace(readLegacyWorkflowWorkspace(projectId));
+
+    async function hydrateWorkspace() {
+      try {
+        let record = await getWorkflowWorkspace<WorkflowWorkspace>(projectId);
+        let workspace = parseWorkflowWorkspace(record.workspace);
+        if (!workspace) {
+          workspace = legacy ?? initialWorkspace;
+          try {
+            record = await saveWorkflowWorkspace(
+              projectId,
+              serializeWorkflowWorkspace(workspace.tabs, workspace.activeWorkflowId, workspace.snapshots),
+              record.version,
+            );
+          } catch (error) {
+            if (!(error instanceof ApiError) || error.code !== "VERSION_CONFLICT") throw error;
+            record = await getWorkflowWorkspace<WorkflowWorkspace>(projectId);
+            const latest = parseWorkflowWorkspace(record.workspace);
+            if (!latest) throw error;
+            workspace = legacy ? mergeLegacyWorkspace(latest, legacy) : latest;
+          }
+        } else if (legacy) {
+          const merged = mergeLegacyWorkspace(workspace, legacy);
+          const serializedMerged = serializeWorkflowWorkspace(
+            merged.tabs,
+            merged.activeWorkflowId,
+            merged.snapshots,
+          );
+          if (JSON.stringify(serializedMerged) !== JSON.stringify(record.workspace)) {
+            record = await saveWorkflowWorkspace(projectId, serializedMerged, record.version);
+            workspace = merged;
+          }
+        }
+        if (cancelled) return;
+        const serialized = serializeWorkflowWorkspace(
+          workspace.tabs,
+          workspace.activeWorkflowId,
+          workspace.snapshots,
+        );
+        remoteVersionRef.current = record.version;
+        lastRemoteWorkspaceRef.current = JSON.stringify(serialized);
+        clearLegacyWorkflowWorkspace(projectId);
+        applyWorkspace(workspace);
+        setPersistenceError("");
+      } catch {
+        if (cancelled) return;
+        setPersistenceError("流程暂时无法同步到任务面板服务");
+        onWorkflowsChange(initialWorkspace.tabs);
+      } finally {
+        if (!cancelled) setHydrated(true);
+      }
+    }
+
+    void hydrateWorkspace();
+    return () => {
+      cancelled = true;
+    };
+  }, [applyWorkspace, initialWorkspace, onWorkflowsChange, projectId]);
+
+  useEffect(() => {
+    const controller = new AbortController();
+    setWorkflowCapabilities(null);
+    setWorkflowCapabilitiesFailed(false);
+    void listWorkflowCapabilities(workspacePath, controller.signal)
+      .then(setWorkflowCapabilities)
+      .catch(() => {
+        if (controller.signal.aborted) return;
+        setWorkflowCapabilities({ skills: [], mcpServers: [] });
+        setWorkflowCapabilitiesFailed(true);
+      });
+    return () => controller.abort();
+  }, [workspacePath]);
+
+  useEffect(() => {
+    workflowSnapshotsRef.current.set(activeWorkflowId, {
+      nodes,
+      flow,
+      selectedNodeId: null,
+    });
+    const workspace = serializeWorkflowWorkspace(
+      workflowTabs,
+      activeWorkflowId,
+      workflowSnapshotsRef.current,
+    );
+    onWorkflowsChange(workflowTabs);
+    if (!hydrated) return;
+    const serialized = JSON.stringify(workspace);
+    if (serialized === lastRemoteWorkspaceRef.current) return;
+    const timer = window.setTimeout(() => {
+      saveQueueRef.current = saveQueueRef.current.then(async () => {
+        if (!mountedRef.current || serialized === lastRemoteWorkspaceRef.current) return;
+        try {
+          const saved = await saveWorkflowWorkspace(
+            projectId,
+            workspace,
+            remoteVersionRef.current,
+          );
+          if (!mountedRef.current) return;
+          remoteVersionRef.current = saved.version;
+          lastRemoteWorkspaceRef.current = serialized;
+          clearLegacyWorkflowWorkspace(projectId);
+          setPersistenceError("");
+        } catch (error) {
+          if (!mountedRef.current) return;
+          if (error instanceof ApiError && error.code === "VERSION_CONFLICT") {
+            try {
+              const latest = await getWorkflowWorkspace<WorkflowWorkspace>(projectId);
+              const latestWorkspace = parseWorkflowWorkspace(latest.workspace);
+              if (latestWorkspace && mountedRef.current) {
+                remoteVersionRef.current = latest.version;
+                lastRemoteWorkspaceRef.current = JSON.stringify(latest.workspace);
+                applyWorkspace(latestWorkspace);
+                setPersistenceError("");
+                return;
+              }
+            } catch {
+              // The next edit retries after the service is reachable.
+            }
+          }
+          setPersistenceError("流程保存失败，请稍后重试");
+        }
+      });
+    }, 180);
+    return () => window.clearTimeout(timer);
+  }, [
+    activeWorkflowId,
+    applyWorkspace,
+    flow,
+    hydrated,
+    nodes,
+    onWorkflowsChange,
+    projectId,
+    workflowTabs,
+  ]);
+
+  useEffect(() => {
+    if (!hydrated || revision === 0) return;
+    const controller = new AbortController();
+    void getWorkflowWorkspace<WorkflowWorkspace>(projectId, controller.signal)
+      .then((record) => {
+        if (record.version <= remoteVersionRef.current) return;
+        const workspace = parseWorkflowWorkspace(record.workspace);
+        if (!workspace) return;
+        remoteVersionRef.current = record.version;
+        lastRemoteWorkspaceRef.current = JSON.stringify(record.workspace);
+        applyWorkspace(workspace);
+        setPersistenceError("");
+      })
+      .catch((error) => {
+        if ((error as Error).name !== "AbortError") {
+          setPersistenceError("流程同步失败，请稍后重试");
+        }
+      });
+    return () => controller.abort();
+  }, [applyWorkspace, hydrated, projectId, revision]);
+
+  useEffect(() => {
+    if (!renamingWorkflowId) return;
+    workflowNameInputRef.current?.focus();
+    workflowNameInputRef.current?.select();
+  }, [renamingWorkflowId]);
+
+  useLayoutEffect(() => {
+    if (!workflowTabMenu) return;
+    const menu = workflowTabMenuRef.current;
+    if (!menu) return;
+    const rect = menu.getBoundingClientRect();
+    const x = Math.max(8, Math.min(workflowTabMenu.x, window.innerWidth - rect.width - 8));
+    const y = Math.max(8, Math.min(workflowTabMenu.y, window.innerHeight - rect.height - 8));
+    setWorkflowTabMenu((current) => (
+      current && (current.x !== x || current.y !== y)
+        ? { ...current, x, y }
+        : current
+    ));
+  }, [workflowTabMenu]);
+
+  useEffect(() => {
+    if (!workflowTabMenu) return;
+    const previousFocus = document.activeElement as HTMLElement | null;
+    requestAnimationFrame(() => {
+      workflowTabMenuRef.current?.querySelector<HTMLButtonElement>(".context-menu-item:not(:disabled)")?.focus();
+    });
+
+    function closeWorkflowTabMenuFromOutside(event: PointerEvent) {
+      if (!workflowTabMenuRef.current?.contains(event.target as globalThis.Node)) {
+        setWorkflowTabMenu(null);
+      }
+    }
+    document.addEventListener("pointerdown", closeWorkflowTabMenuFromOutside);
+
+    function closeWorkflowTabMenuFromEscape(event: globalThis.KeyboardEvent) {
+      if (event.key === "Escape") {
+        event.preventDefault();
+        setWorkflowTabMenu(null);
+      }
+    }
+    document.addEventListener("keydown", closeWorkflowTabMenuFromEscape);
+
+    function closeWorkflowTabMenuFromViewportChange() {
+      setWorkflowTabMenu(null);
+    }
+    window.addEventListener("blur", closeWorkflowTabMenuFromViewportChange);
+    window.addEventListener("resize", closeWorkflowTabMenuFromViewportChange);
+    window.addEventListener("scroll", closeWorkflowTabMenuFromViewportChange, true);
+    return () => {
+      document.removeEventListener("pointerdown", closeWorkflowTabMenuFromOutside);
+      document.removeEventListener("keydown", closeWorkflowTabMenuFromEscape);
+      window.removeEventListener("blur", closeWorkflowTabMenuFromViewportChange);
+      window.removeEventListener("resize", closeWorkflowTabMenuFromViewportChange);
+      window.removeEventListener("scroll", closeWorkflowTabMenuFromViewportChange, true);
+      previousFocus?.focus({ preventScroll: true });
+    };
+  }, [workflowTabMenu?.workflowId]);
+
+  const commitFlow = useCallback((
+    nextNodes: WorkflowCanvasNode[],
+    nextFlow: WorkflowFlow,
+  ) => {
+    setNodes(layoutWorkflowFlow(nextNodes, nextFlow));
+    setFlow(nextFlow);
+  }, []);
+
+  const commitNodes = useCallback((nextNodes: WorkflowCanvasNode[]) => {
+    commitFlow(nextNodes, flow);
+  }, [commitFlow, flow]);
+
+  const openStepPicker = useCallback((
+    sequenceRef: WorkflowSequenceRef,
+    index: number,
+  ) => {
+    setPickerTarget({ kind: "sequence", sequenceRef, index });
+  }, []);
+
+  const openPlanStepPicker = useCallback((parentId: string) => {
+    setPickerTarget({ kind: "plan", parentId });
+  }, []);
+
+  const updateSelectedNode = useCallback((changes: Partial<WorkflowNodeData>) => {
+    if (!selectedNodeId) return;
+    setNodes((current) => current.map((node) => (
+      node.id === selectedNodeId
+        ? { ...node, data: { ...node.data, ...changes } }
+        : node
+    )));
+  }, [selectedNodeId]);
+
+  const deleteNode = useCallback((nodeId: string) => {
+    const node = nodes.find((candidate) => candidate.id === nodeId);
+    if (!node || isWorkflowTriggerKind(node.data.kind)) return;
+    if (node.parentId) {
+      const nextNodes = nodes.filter((candidate) => candidate.id !== nodeId);
+      commitNodes(nextNodes);
+      setSelectedNodeId((current) => current === nodeId ? null : current);
+      return;
+    }
+    const deleted = deleteWorkflowNode(flow, nodeId);
+    const removedIds = new Set(deleted.removedNodeIds);
+    for (const candidate of nodes) {
+      if (candidate.parentId && removedIds.has(candidate.parentId)) {
+        removedIds.add(candidate.id);
+      }
+    }
+    const nextNodes = nodes.filter((candidate) => !removedIds.has(candidate.id));
+    commitFlow(nextNodes, deleted.flow);
+    setSelectedNodeId((current) => removedIds.has(current ?? "") ? null : current);
+  }, [commitFlow, commitNodes, flow, nodes]);
+
+  const duplicateNode = useCallback((nodeId: string) => {
+    const source = nodes.find((candidate) => candidate.id === nodeId);
+    if (!source || isWorkflowTriggerKind(source.data.kind) || source.data.kind === "condition") return;
+    const duplicateId = `node-${crypto.randomUUID()}`;
+    if (source.parentId) {
+      const siblingIds = nodes
+        .filter((candidate) => candidate.parentId === source.parentId)
+        .sort((left, right) => left.position.y - right.position.y)
+        .map((candidate) => candidate.id);
+      const sourceIndex = siblingIds.indexOf(source.id);
+      siblingIds.splice(sourceIndex + 1, 0, duplicateId);
+      const nextNodes = [
+        ...nodes,
+        {
+          ...source,
+          id: duplicateId,
+          selected: false,
+          data: { ...source.data, title: `${source.data.title} 副本` },
+        },
+      ];
+      commitNodes(layoutPlanChildren(nextNodes, source.parentId, siblingIds));
+    } else {
+      const found = findWorkflowItem(flow, source.id);
+      if (!found) return;
+      const nextNodes = [
+        ...nodes,
+        {
+          ...source,
+          id: duplicateId,
+          selected: false,
+          parentId: undefined,
+          data: { ...source.data, title: `${source.data.title} 副本` },
+        },
+      ];
+      const nextFlow = insertWorkflowNode(
+        flow,
+        found.sequenceRef,
+        found.index + 1,
+        duplicateId,
+        source.data.kind,
+      );
+      commitFlow(nextNodes, nextFlow);
+    }
+    setSelectedNodeId(duplicateId);
+  }, [commitFlow, commitNodes, flow, nodes]);
+
+  const renderedNodes = useMemo(() => {
+    const childCounts = new Map<string, number>();
+    for (const node of nodes) {
+      if (node.parentId) childCounts.set(node.parentId, (childCounts.get(node.parentId) ?? 0) + 1);
+    }
+    const orderedIds = workflowNodeIds(flow);
+    const pinnedTriggerId = rootStepIds[0] && isWorkflowTriggerKind(
+      nodes.find((node) => node.id === rootStepIds[0])?.data.kind ?? "",
+    )
+      ? rootStepIds[0]
+      : null;
+    const enriched = nodes.map((node) => {
+      const stepIndex = orderedIds.indexOf(node.id);
+      const dragShiftY = node.parentId ? planDragShift(node.id, planDragPreview) : 0;
+      return {
+        ...node,
+        draggable: Boolean(node.parentId) || !isWorkflowTriggerKind(node.data.kind),
+        data: {
+          ...node.data,
+          displayTitle: workflowNodeDisplayTitle(node.data),
+          meta: capabilityNodeMeta(
+            node.data,
+            workflowCapabilities,
+            workflowCapabilitiesFailed,
+          ),
+          configured: workflowNodeConfigured(
+            node.data,
+            workflowCapabilities,
+            workflowCapabilitiesFailed,
+          ),
+          stepNumber: stepIndex >= 0 ? stepIndex + 1 : undefined,
+          isTrigger: node.id === pinnedTriggerId,
+          childCount: childCounts.get(node.id) ?? 0,
+          dragShiftY,
+          dragActive: planDragPreview?.nodeId === node.id,
+          settleActive: settlingNodeId === node.id,
+          onDuplicate: () => duplicateNode(node.id),
+          onDelete: () => deleteNode(node.id),
+          onAddChild: node.data.acceptsChildren
+            ? () => openPlanStepPicker(node.id)
+            : undefined,
+        },
+      };
+    });
+    const virtualNodes = layout.virtualNodes.map((virtualNode) => ({
+      id: virtualNode.id,
+      type: "workflow" as const,
+      position: virtualNode.position,
+      origin: TOP_CENTER_ORIGIN,
+      draggable: false,
+      selectable: false,
+      deletable: false,
+      connectable: false,
+      style: { width: END_STEP_HEIGHT, height: END_STEP_HEIGHT },
+      initialWidth: END_STEP_HEIGHT,
+      initialHeight: END_STEP_HEIGHT,
+      measured: { width: END_STEP_HEIGHT, height: END_STEP_HEIGHT },
+      data: {
+        kind: virtualNode.kind,
+        eyebrow: "",
+        title: "",
+        description: "",
+        meta: "",
+        icon: "plus" as const,
+        tone: "capability" as const,
+      },
+    }));
+    return [
+      ...enriched.filter((node) => !node.parentId),
+      ...virtualNodes,
+      ...enriched.filter((node) => node.parentId),
+    ];
+  }, [
+    deleteNode,
+    duplicateNode,
+    flow,
+    layout.virtualNodes,
+    nodes,
+    openPlanStepPicker,
+    planDragPreview,
+    rootStepIds,
+    settlingNodeId,
+    workflowCapabilities,
+    workflowCapabilitiesFailed,
+  ]);
+
+  const renderedEdges = useMemo(() => {
+    return layout.edges.map((edge) => ({
+      ...edge,
+      data: {
+        ...edge.data,
+        onInsert: edge.data.insertion
+          ? () => openStepPicker(
+              edge.data.insertion!.sequenceRef,
+              edge.data.insertion!.index,
+            )
+          : undefined,
+      },
+    })) as Edge[];
+  }, [layout.edges, openStepPicker]);
+
+  const pickerItems = useMemo(() => {
+    if (!pickerTarget) return [];
+    if (pickerTarget.kind === "plan") {
+      return PALETTE_ITEMS.filter((item) => NESTABLE_TONES.has(item.data.tone));
+    }
+    if (rootStepIds.length === 0) {
+      return PALETTE_ITEMS.filter((item) => item.group === "触发器");
+    }
+    return PALETTE_ITEMS.filter((item) => item.group !== "触发器");
+  }, [pickerTarget, rootStepIds.length]);
+
+  function selectStep(item: PaletteItem) {
+    if (!pickerTarget) return;
+    const nodeId = `node-${crypto.randomUUID()}`;
+    const newNode: WorkflowCanvasNode = {
+      id: nodeId,
+      type: "workflow",
+      position: { x: 0, y: 0 },
+      data: { ...item.data },
+    };
+    if (pickerTarget.kind === "plan") {
+      newNode.parentId = pickerTarget.parentId;
+      newNode.origin = TOP_LEFT_ORIGIN;
+      const childIds = nodes
+        .filter((node) => node.parentId === pickerTarget.parentId)
+        .sort((left, right) => left.position.y - right.position.y)
+        .map((node) => node.id);
+      childIds.push(nodeId);
+      const nextNodes = layoutPlanChildren([...nodes, newNode], pickerTarget.parentId, childIds);
+      commitNodes(nextNodes);
+    } else {
+      const nextFlow = insertWorkflowNode(
+        flow,
+        pickerTarget.sequenceRef,
+        pickerTarget.index,
+        nodeId,
+        item.data.kind,
+      );
+      commitFlow([...nodes, newNode], nextFlow);
+    }
+    setPickerTarget(null);
+    setSelectedNodeId(nodeId);
+  }
+
+  function reorderPlanItem(parentId: string, nodeId: string, targetIndex: number) {
+    const childIds = nodes
+      .filter((node) => node.parentId === parentId)
+      .sort((left, right) => left.position.y - right.position.y)
+      .map((node) => node.id);
+    const nextIds = childIds.filter((id) => id !== nodeId);
+    nextIds.splice(Math.max(0, Math.min(targetIndex, nextIds.length)), 0, nodeId);
+    commitNodes(layoutPlanChildren(nodes, parentId, nextIds));
+  }
+
+  const onNodesChange = useCallback((changes: NodeChange<WorkflowCanvasNode>[]) => {
+    setNodes((current) => applyNodeChanges(
+      changes.filter((change) => change.type !== "remove" || !isVirtualWorkflowNodeId(change.id)),
+      current,
+    ));
+  }, []);
+
+  const onNodeDragStart = useCallback<OnNodeDrag<WorkflowCanvasNode>>((_, node) => {
+    if (!node.parentId && isWorkflowTriggerKind(node.data.kind)) return;
+    const sourceOrderIds = node.parentId
+      ? nodes
+        .filter((candidate) => candidate.parentId === node.parentId)
+        .sort((left, right) => left.position.y - right.position.y)
+        .map((candidate) => candidate.id)
+      : rootStepIds;
+    const preview = {
+      nodeId: node.id,
+      ...(node.parentId
+        ? { parentId: node.parentId }
+        : { sequenceRef: [] as WorkflowSequenceRef }),
+      sourceOrderIds,
+      sourceIndex: sourceOrderIds.indexOf(node.id),
+      targetIndex: sourceOrderIds.indexOf(node.id),
+    };
+    if (preview.sourceIndex < 0) return;
+    planDragSessionRef.current = preview;
+    setPlanDragPreview(preview);
+    setSettlingNodeId(null);
+  }, [nodes, rootStepIds]);
+
+  const onNodeDrag = useCallback<OnNodeDrag<WorkflowCanvasNode>>((_, node) => {
+    const instance = flowRef.current;
+    const internal = instance?.getInternalNode(node.id);
+    const session = planDragSessionRef.current;
+    if (!instance || !internal || !session || session.nodeId !== node.id) return;
+    const height = internal.measured.height ?? (node.parentId ? PLAN_ITEM_HEIGHT : WORKFLOW_STEP_HEIGHT);
+    const centerY = internal.internals.positionAbsolute.y + height / 2;
+    const siblings = session.sourceOrderIds
+      .filter((id) => id !== node.id)
+      .map((id) => instance.getInternalNode(id))
+      .filter((candidate) => candidate !== undefined);
+    const index = siblings.findIndex((candidate) => (
+      centerY < candidate.internals.positionAbsolute.y
+        + (candidate.measured.height ?? (node.parentId ? PLAN_ITEM_HEIGHT : WORKFLOW_STEP_HEIGHT)) / 2
+    ));
+    const targetIndex = index < 0 ? siblings.length : index;
+    setPlanDragPreview({ ...session, targetIndex: node.parentId ? targetIndex : Math.max(1, targetIndex) });
+  }, []);
+
+  const onNodeDragStop = useCallback<OnNodeDrag<WorkflowCanvasNode>>((_, node) => {
+    const session = planDragSessionRef.current;
+    if (!session || session.nodeId !== node.id) return;
+    const targetIndex = planDragPreview?.targetIndex ?? session.sourceIndex;
+    if (node.parentId && session.parentId) {
+      reorderPlanItem(session.parentId, node.id, targetIndex);
+    } else if (session.sequenceRef) {
+      commitFlow(
+        nodes,
+        moveWorkflowNode(flow, node.id, session.sequenceRef, targetIndex),
+      );
+    }
+    planDragSessionRef.current = null;
+    setPlanDragPreview(null);
+    setSettlingNodeId(node.id);
+    if (settleTimerRef.current !== null) window.clearTimeout(settleTimerRef.current);
+    settleTimerRef.current = window.setTimeout(() => setSettlingNodeId(null), 220);
+  }, [commitFlow, flow, nodes, planDragPreview, reorderPlanItem]);
+
+  function activateWorkflow(workflowId: string) {
+    setWorkflowTabMenu(null);
+    if (workflowId === activeWorkflowId) return;
+    workflowSnapshotsRef.current.set(activeWorkflowId, {
+      nodes,
+      flow,
+      selectedNodeId: null,
+    });
+    const snapshot = normalizeSnapshot(workflowSnapshotsRef.current.get(workflowId)!);
+    setActiveWorkflowId(workflowId);
+    setNodes(snapshot.nodes);
+    setFlow(snapshot.flow);
+    setSelectedNodeId(null);
+    setPickerTarget(null);
+    requestAnimationFrame(() => {
+      void flowRef.current?.fitView({ padding: 0.2, duration: 240, maxZoom: 1 });
+    });
+  }
+
+  function createWorkflow() {
+    setWorkflowTabMenu(null);
+    const workflowId = `workflow-${crypto.randomUUID()}`;
+    const workflowName = `未命名流程 ${workflowTabs.length + 1}`;
+    const emptyFlow = createWorkflowFlow();
+    workflowSnapshotsRef.current.set(workflowId, {
+      nodes: [],
+      flow: emptyFlow,
+      selectedNodeId: null,
+    });
+    setWorkflowTabs((current) => [...current, { id: workflowId, name: workflowName }]);
+    setActiveWorkflowId(workflowId);
+    setNodes([]);
+    setFlow(emptyFlow);
+    setSelectedNodeId(null);
+    setPickerTarget(null);
+  }
+
+  function openWorkflowTabMenu(
+    event: ReactMouseEvent<HTMLButtonElement>,
+    workflowId: string,
+  ) {
+    event.preventDefault();
+    setWorkflowTabMenu({
+      workflowId,
+      x: event.clientX,
+      y: event.clientY,
+    });
+  }
+
+  function deleteWorkflow(workflowId: string) {
+    if (workflowTabs.length <= 1) return;
+    const workflowIndex = workflowTabs.findIndex((workflow) => workflow.id === workflowId);
+    const nextTabs = workflowTabs.filter((workflow) => workflow.id !== workflowId);
+    workflowSnapshotsRef.current.delete(workflowId);
+
+    if (workflowId !== activeWorkflowId) {
+      setWorkflowTabs(nextTabs);
+      setWorkflowTabMenu(null);
+      return;
+    }
+
+    const replacement = workflowTabs[workflowIndex + 1] ?? workflowTabs[workflowIndex - 1];
+    const snapshot = normalizeSnapshot(workflowSnapshotsRef.current.get(replacement.id)!);
+    setWorkflowTabs(nextTabs);
+    setActiveWorkflowId(replacement.id);
+    setNodes(snapshot.nodes);
+    setFlow(snapshot.flow);
+    setSelectedNodeId(null);
+    setPickerTarget(null);
+    setRenamingWorkflowId(null);
+    setWorkflowNameDraft("");
+    cancelWorkflowRenameRef.current = false;
+    setWorkflowTabMenu(null);
+    requestAnimationFrame(() => {
+      void flowRef.current?.fitView({ padding: 0.2, duration: 240, maxZoom: 1 });
+    });
+  }
+
+  function handleWorkflowTabKeyDown(
+    event: KeyboardEvent<HTMLButtonElement>,
+    workflowId: string,
+  ) {
+    const currentIndex = workflowTabs.findIndex((workflow) => workflow.id === workflowId);
+    let targetIndex = currentIndex;
+    if (event.key === "ArrowLeft") targetIndex = (currentIndex - 1 + workflowTabs.length) % workflowTabs.length;
+    else if (event.key === "ArrowRight") targetIndex = (currentIndex + 1) % workflowTabs.length;
+    else if (event.key === "Home") targetIndex = 0;
+    else if (event.key === "End") targetIndex = workflowTabs.length - 1;
+    else return;
+    event.preventDefault();
+    const target = workflowTabs[targetIndex];
+    activateWorkflow(target.id);
+    requestAnimationFrame(() => {
+      document.getElementById(`workflow-tab-${target.id}`)?.focus();
+    });
+  }
+
+  function startWorkflowRename(workflow: WorkflowTab) {
+    if (workflow.id !== activeWorkflowId) activateWorkflow(workflow.id);
+    cancelWorkflowRenameRef.current = false;
+    setWorkflowNameDraft(workflow.name);
+    setRenamingWorkflowId(workflow.id);
+  }
+
+  function commitWorkflowRename(workflowId: string) {
+    if (cancelWorkflowRenameRef.current) {
+      cancelWorkflowRenameRef.current = false;
+      return;
+    }
+    const name = workflowNameDraft.trim();
+    if (name) {
+      setWorkflowTabs((current) => current.map((workflow) => (
+        workflow.id === workflowId ? { ...workflow, name } : workflow
+      )));
+    }
+    setRenamingWorkflowId(null);
+    setWorkflowNameDraft("");
+  }
+
+  function cancelWorkflowRename(workflowId: string) {
+    cancelWorkflowRenameRef.current = true;
+    setRenamingWorkflowId(null);
+    setWorkflowNameDraft("");
+    requestAnimationFrame(() => {
+      document.getElementById(`workflow-tab-${workflowId}`)?.focus();
+    });
+  }
+
+  return (
+    <section
+      className={`workflow-board${selectedNode ? " has-inspector" : ""}`}
+      aria-label="流程看板"
+    >
+      <div className="workflow-canvas-shell">
+        <div className="workflow-canvas-toolbar">
+          <div className="workflow-tabs" role="tablist" aria-label={`${projectName} 的流程`}>
+            {workflowTabs.map((workflow) => {
+              const active = workflow.id === activeWorkflowId;
+              if (workflow.id === renamingWorkflowId) {
+                return (
+                  <div
+                    id={`workflow-tab-${workflow.id}`}
+                    className={`workflow-tab is-renaming${active ? " is-active" : ""}`}
+                    role="tab"
+                    aria-controls="workflow-canvas-panel"
+                    aria-selected={active}
+                    key={workflow.id}
+                  >
+                    <LinearIcon name="dashboard" />
+                    <input
+                      ref={workflowNameInputRef}
+                      type="text"
+                      aria-label="流程名称"
+                      value={workflowNameDraft}
+                      onChange={(event) => setWorkflowNameDraft(event.target.value)}
+                      onBlur={() => commitWorkflowRename(workflow.id)}
+                      onKeyDown={(event) => {
+                        if (event.key === "Enter") {
+                          event.preventDefault();
+                          event.currentTarget.blur();
+                        } else if (event.key === "Escape") {
+                          event.preventDefault();
+                          cancelWorkflowRename(workflow.id);
+                        }
+                      }}
+                    />
+                  </div>
+                );
+              }
+              return (
+                <button
+                  id={`workflow-tab-${workflow.id}`}
+                  className={`workflow-tab${active ? " is-active" : ""}`}
+                  type="button"
+                  role="tab"
+                  aria-controls="workflow-canvas-panel"
+                  aria-selected={active}
+                  tabIndex={active ? 0 : -1}
+                  key={workflow.id}
+                  onClick={() => activateWorkflow(workflow.id)}
+                  onDoubleClick={() => startWorkflowRename(workflow)}
+                  onContextMenu={(event) => openWorkflowTabMenu(event, workflow.id)}
+                  onKeyDown={(event) => handleWorkflowTabKeyDown(event, workflow.id)}
+                  title="双击重命名"
+                >
+                  <LinearIcon name="dashboard" />
+                  <span>{workflow.name}</span>
+                </button>
+              );
+            })}
+            <button
+              className="workflow-tab-add"
+              type="button"
+              aria-label="新建流程"
+              title="新建流程"
+              onClick={createWorkflow}
+            >
+              <LinearIcon name="plus" />
+            </button>
+          </div>
+          <div className="workflow-toolbar-status">
+            <span className={persistenceError ? "has-error" : ""}>
+              <i aria-hidden="true" />
+              {persistenceError || "已自动保存"}
+            </span>
+          </div>
+        </div>
+        <div
+          ref={canvasRef}
+          className="workflow-canvas"
+          id="workflow-canvas-panel"
+          role="tabpanel"
+          aria-label="流程编排区"
+          aria-labelledby={`workflow-tab-${activeWorkflowId}`}
+        >
+          <ReactFlow<WorkflowCanvasNode, Edge>
+            nodes={renderedNodes}
+            edges={renderedEdges}
+            nodeTypes={NODE_TYPES}
+            edgeTypes={EDGE_TYPES}
+            nodeOrigin={TOP_CENTER_ORIGIN}
+            onNodesChange={onNodesChange}
+            onNodeDragStart={onNodeDragStart}
+            onNodeDrag={onNodeDrag}
+            onNodeDragStop={onNodeDragStop}
+            onNodeClick={(_, node) => {
+              if (!isVirtualWorkflowNodeId(node.id)) setSelectedNodeId(node.id);
+            }}
+            onPaneClick={() => setSelectedNodeId(null)}
+            nodesConnectable={false}
+            connectOnClick={false}
+            deleteKeyCode={null}
+            selectionOnDrag={false}
+            panOnScroll
+            panOnDrag
+            zoomOnDoubleClick={false}
+            minZoom={0.45}
+            maxZoom={1.35}
+            translateExtent={translateExtent}
+            onMoveEnd={(_, viewport) => setCanvasZoom(viewport.zoom)}
+            proOptions={PRO_OPTIONS}
+            onInit={(instance) => {
+              flowRef.current = instance;
+              void instance.setCenter(0, 220, { zoom: 1 });
+            }}
+          >
+            <Background
+              color="var(--border-strong)"
+              gap={24}
+              size={0.75}
+              variant={BackgroundVariant.Dots}
+            />
+            <Controls
+              className="workflow-flow-controls"
+              position="bottom-left"
+              showInteractive={false}
+            />
+          </ReactFlow>
+          {rootStepIds.length === 0 && (
+            <button
+              className="workflow-empty-add"
+              type="button"
+              aria-label="添加第一个步骤"
+              onClick={() => openStepPicker([], 0)}
+            >
+              <LinearIcon name="plus" />
+              <span>添加触发器</span>
+            </button>
+          )}
+          {pickerTarget && (
+            <WorkflowStepPicker
+              items={pickerItems}
+              onSelect={selectStep}
+              onClose={() => setPickerTarget(null)}
+            />
+          )}
+        </div>
+      </div>
+
+      {selectedNode && (
+        <aside className="workflow-inspector workflow-step-inspector" aria-label="步骤配置">
+          <WorkflowInspector
+            node={selectedNode}
+            projectName={projectName}
+            capabilities={workflowCapabilities}
+            capabilitiesFailed={workflowCapabilitiesFailed}
+            onChange={updateSelectedNode}
+            onClose={() => setSelectedNodeId(null)}
+          />
+        </aside>
+      )}
+
+      {workflowTabMenu && createPortal(
+        <div
+          ref={workflowTabMenuRef}
+          className="task-context-menu workflow-tab-context-menu"
+          role="menu"
+          aria-label="流程操作"
+          style={{ left: workflowTabMenu.x, top: workflowTabMenu.y }}
+          onContextMenu={(event) => event.preventDefault()}
+        >
+          <div className="context-menu-group">
+            <button
+              className="context-menu-item is-danger"
+              type="button"
+              role="menuitem"
+              disabled={workflowTabs.length === 1}
+              aria-disabled={workflowTabs.length === 1}
+              onClick={() => deleteWorkflow(workflowTabMenu.workflowId)}
+            >
+              <span className="context-menu-icon"><LinearIcon name="trash" /></span>
+              <span className="context-menu-label">删除流程</span>
+            </button>
+          </div>
+        </div>,
+        document.body,
+      )}
+    </section>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/WorkflowInsertEdge.tsx b/apps/codex-taskboard/web/src/components/WorkflowInsertEdge.tsx
new file mode 100644
index 000000000..b47ece848
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/WorkflowInsertEdge.tsx
@@ -0,0 +1,85 @@
+import {
+  BaseEdge,
+  EdgeLabelRenderer,
+  type Edge,
+  type EdgeProps,
+} from "@xyflow/react";
+import { LinearIcon } from "./LinearIcon";
+
+export interface WorkflowInsertEdgeData extends Record<string, unknown> {
+  onInsert?: () => void;
+  conditionId?: string;
+  conditionOutcome?: "true" | "false";
+  branchStart?: boolean;
+  points?: Array<{ x: number; y: number }>;
+  buttonX?: number;
+  buttonY?: number;
+  labelX?: number;
+  labelY?: number;
+}
+
+export type WorkflowSequenceEdge = Edge<WorkflowInsertEdgeData, "workflowInsert">;
+
+export function WorkflowInsertEdge({
+  id,
+  sourceX,
+  sourceY,
+  targetX,
+  targetY,
+  markerEnd,
+  data,
+}: EdgeProps<WorkflowSequenceEdge>) {
+  const points = data?.points?.length
+    ? data.points
+    : [{ x: sourceX, y: sourceY }, { x: targetX, y: targetY }];
+  const path = points
+    .map((point, index) => `${index === 0 ? "M" : "L"} ${point.x} ${point.y}`)
+    .join(" ");
+  const labelX = data?.labelX;
+  const labelY = data?.labelY;
+  const buttonX = data?.buttonX;
+  const buttonY = data?.buttonY;
+
+  return (
+    <>
+      <BaseEdge
+        id={id}
+        path={path}
+        markerEnd={markerEnd}
+        className={`workflow-sequence-edge-path${data?.conditionOutcome ? " workflow-condition-branch-edge" : ""}`}
+      />
+      <EdgeLabelRenderer>
+        {data?.branchStart
+          && data.conditionOutcome
+          && Number.isFinite(labelX)
+          && Number.isFinite(labelY) && (
+          <span
+            className={`workflow-condition-branch-label is-${data.conditionOutcome} nodrag nopan`}
+            style={{
+              transform: `translate(-50%, -50%) translate(${labelX}px, ${labelY}px)`,
+            }}
+          >
+            {data.conditionOutcome === "true" ? "成立" : "不成立"}
+          </span>
+        )}
+        {data?.onInsert && Number.isFinite(buttonX) && Number.isFinite(buttonY) && (
+          <button
+            className="workflow-sequence-add nodrag nopan"
+            type="button"
+            aria-label="在此处添加步骤"
+            title="添加步骤"
+            style={{
+              transform: `translate(-50%, -50%) translate(${buttonX}px, ${buttonY}px)`,
+            }}
+            onClick={(event) => {
+              event.stopPropagation();
+              data.onInsert?.();
+            }}
+          >
+            <LinearIcon name="plus" />
+          </button>
+        )}
+      </EdgeLabelRenderer>
+    </>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/WorkflowInspector.tsx b/apps/codex-taskboard/web/src/components/WorkflowInspector.tsx
new file mode 100644
index 000000000..1394e2a2f
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/WorkflowInspector.tsx
@@ -0,0 +1,832 @@
+import { useState } from "react";
+import type { WorkflowCapabilities } from "../types";
+import { LinearIcon } from "./LinearIcon";
+import {
+  type WorkflowCanvasNode,
+  type WorkflowNodeData,
+} from "./WorkflowNode";
+import {
+  CODE_RUNTIMES,
+  CONDITION_FIELDS,
+  CONDITION_OPERATORS,
+  FEISHU_MESSAGE_RECIPIENTS,
+  GIT_OPERATIONS,
+  ISSUE_PRIORITIES,
+  ISSUE_STATUSES,
+  TEST_SCOPES,
+  selectedCapabilityValue,
+  workflowNodeDisplayTitle,
+} from "./workflowCatalog";
+import { WorkflowMark } from "./WorkflowMark";
+
+interface WorkflowInspectorProps {
+  node: WorkflowCanvasNode;
+  projectName: string;
+  capabilities: WorkflowCapabilities | null;
+  capabilitiesFailed: boolean;
+  onChange: (changes: Partial<WorkflowNodeData>) => void;
+  onClose: () => void;
+}
+
+type InspectorTab = "settings" | "configuration";
+
+export function WorkflowInspector({
+  node,
+  projectName,
+  capabilities,
+  capabilitiesFailed,
+  onChange,
+  onClose,
+}: WorkflowInspectorProps) {
+  const [activeTab, setActiveTab] = useState<InspectorTab>("settings");
+  const data = node.data;
+  const conditionField = data.conditionField ?? CONDITION_FIELDS[0].value;
+  const selectedConditionField = CONDITION_FIELDS.find(
+    (field) => field.value === conditionField,
+  ) ?? CONDITION_FIELDS[0];
+  const conditionOperator = selectedConditionField.operators.find(
+    (operator) => operator === data.conditionOperator,
+  ) ?? selectedConditionField.defaultOperator;
+  const conditionValue = data.conditionValue || selectedConditionField.defaultValue;
+
+  return (
+    <div className="workflow-inspector-content">
+      <div className={`workflow-inspector-title workflow-inspector-${data.tone}`}>
+        <span aria-hidden="true">
+          <WorkflowMark
+            icon={data.icon}
+            logo={data.logo}
+            logoMonochrome={data.logoMonochrome}
+          />
+        </span>
+        <div>
+          <small>{data.eyebrow}</small>
+          <strong>{workflowNodeDisplayTitle(data)}</strong>
+        </div>
+        <button
+          className="workflow-panel-toggle"
+          type="button"
+          aria-label="关闭步骤配置"
+          title="关闭步骤配置"
+          onClick={onClose}
+        >
+          <LinearIcon name="close" />
+        </button>
+      </div>
+
+      <div className="workflow-inspector-tabs" role="tablist" aria-label="步骤配置视图">
+        <button
+          className={activeTab === "settings" ? "is-active" : ""}
+          type="button"
+          role="tab"
+          aria-selected={activeTab === "settings"}
+          onClick={() => setActiveTab("settings")}
+        >设置</button>
+        <button
+          className={activeTab === "configuration" ? "is-active" : ""}
+          type="button"
+          role="tab"
+          aria-selected={activeTab === "configuration"}
+          onClick={() => setActiveTab("configuration")}
+        >配置</button>
+      </div>
+
+      {activeTab === "settings" ? (
+        <div role="tabpanel" aria-label="设置">
+          <div className="workflow-config-section">
+            <h2>常规</h2>
+            <label>
+              <span>节点名称</span>
+              <input
+                type="text"
+                value={data.title}
+                onChange={(event) => onChange({ title: event.target.value })}
+              />
+            </label>
+            <label>
+              <span>说明</span>
+              <textarea
+                rows={3}
+                value={data.description}
+                onChange={(event) => onChange({ description: event.target.value })}
+              />
+            </label>
+          </div>
+
+          <div className="workflow-config-section">
+            <h2>额外说明</h2>
+            <textarea
+              aria-label="额外说明"
+              rows={4}
+              value={data.additionalInstructions ?? ""}
+              placeholder="补充执行约束、上下文或验收要求…"
+              onChange={(event) => onChange({ additionalInstructions: event.target.value })}
+            />
+          </div>
+
+          <div className="workflow-config-section">
+            <h2>上下文</h2>
+            <div className="workflow-context-field">
+              <span>
+                <LinearIcon name="project" />
+                当前项目
+              </span>
+              <strong>{projectName}</strong>
+              <LinearIcon name="chevronDown" />
+            </div>
+          </div>
+        </div>
+      ) : (
+        <div role="tabpanel" aria-label="配置">
+          {data.kind === "issue-create" && (
+            <div className="workflow-config-section">
+              <h2>创建任务</h2>
+              <label>
+                <span>标题</span>
+                <input
+                  aria-label="ISSUE 标题"
+                  type="text"
+                  value={data.createIssueTitle ?? ""}
+                  placeholder="输入任务标题"
+                  onChange={(event) => onChange({ createIssueTitle: event.target.value })}
+                />
+              </label>
+              <label>
+                <span>描述</span>
+                <textarea
+                  aria-label="ISSUE 描述"
+                  rows={4}
+                  value={data.createIssueDescription ?? ""}
+                  placeholder="补充任务描述…"
+                  onChange={(event) => onChange({ createIssueDescription: event.target.value })}
+                />
+              </label>
+              <label>
+                <span>初始状态</span>
+                <select
+                  aria-label="ISSUE 初始状态"
+                  value={data.createIssueStatus ?? "todo"}
+                  onChange={(event) => onChange({ createIssueStatus: event.target.value })}
+                >
+                  {ISSUE_STATUSES.map((status) => (
+                    <option key={status.value} value={status.value}>{status.label}</option>
+                  ))}
+                </select>
+              </label>
+              <label>
+                <span>优先级</span>
+                <select
+                  aria-label="ISSUE 优先级"
+                  value={data.createIssuePriority ?? "none"}
+                  onChange={(event) => onChange({ createIssuePriority: event.target.value })}
+                >
+                  {ISSUE_PRIORITIES.map((priority) => (
+                    <option key={priority.value} value={priority.value}>{priority.label}</option>
+                  ))}
+                </select>
+              </label>
+              <label>
+                <span>标签</span>
+                <input
+                  aria-label="ISSUE 标签"
+                  type="text"
+                  value={data.createIssueLabels ?? ""}
+                  placeholder="多个标签用逗号分隔"
+                  onChange={(event) => onChange({ createIssueLabels: event.target.value })}
+                />
+              </label>
+            </div>
+          )}
+
+          {data.kind === "skill" && (
+            <div className="workflow-config-section">
+              <h2>Skill</h2>
+              <label>
+                <span>可用 Skill</span>
+                <select
+                  aria-label="可用 Skill"
+                  value={selectedCapabilityValue(
+                    capabilities?.skills ?? [],
+                    data.selectedSkill,
+                  )}
+                  disabled={
+                    !capabilities
+                    || capabilitiesFailed
+                    || capabilities.skills.length === 0
+                  }
+                  onChange={(event) => onChange({
+                    selectedSkill: event.target.value,
+                    meta: `${event.target.selectedOptions[0].text} · Skill`,
+                  })}
+                >
+                  <option value="" disabled>
+                    {!capabilities
+                      ? "正在读取可用 Skill…"
+                      : capabilitiesFailed
+                        ? "读取可用 Skill 失败"
+                        : capabilities.skills.length === 0
+                          ? "未发现可用 Skill"
+                          : "请选择 Skill"}
+                  </option>
+                  {(capabilities?.skills ?? []).map((skill) => (
+                    <option key={skill.id} value={skill.id}>{skill.label}</option>
+                  ))}
+                </select>
+              </label>
+            </div>
+          )}
+
+          {data.kind === "mcp" && (
+            <div className="workflow-config-section">
+              <h2>MCP</h2>
+              <label>
+                <span>可用 MCP Server</span>
+                <select
+                  aria-label="可用 MCP Server"
+                  value={selectedCapabilityValue(
+                    capabilities?.mcpServers ?? [],
+                    data.selectedMcpServer,
+                  )}
+                  disabled={
+                    !capabilities
+                    || capabilitiesFailed
+                    || capabilities.mcpServers.length === 0
+                  }
+                  onChange={(event) => {
+                    const server = capabilities?.mcpServers.find(
+                      (option) => option.id === event.target.value,
+                    );
+                    onChange({
+                      selectedMcpServer: event.target.value,
+                      meta: server
+                        ? `${server.label} · ${server.transport}`
+                        : "尚未选择 MCP Server",
+                    });
+                  }}
+                >
+                  <option value="" disabled>
+                    {!capabilities
+                      ? "正在读取可用 MCP Server…"
+                      : capabilitiesFailed
+                        ? "读取可用 MCP Server 失败"
+                        : capabilities.mcpServers.length === 0
+                          ? "未发现可用 MCP Server"
+                          : "请选择 MCP Server"}
+                  </option>
+                  {(capabilities?.mcpServers ?? []).map((server) => (
+                    <option key={server.id} value={server.id}>
+                      {server.label} · {server.transport}
+                    </option>
+                  ))}
+                </select>
+              </label>
+            </div>
+          )}
+
+          {data.kind === "rss-trigger" && (
+            <div className="workflow-config-section">
+              <h2>RSS 订阅</h2>
+              <label>
+                <span>订阅地址</span>
+                <input
+                  aria-label="RSS 订阅地址"
+                  type="url"
+                  value={data.rssFeedUrl ?? ""}
+                  placeholder="https://example.com/feed.xml"
+                  onChange={(event) => onChange({ rssFeedUrl: event.target.value })}
+                />
+              </label>
+            </div>
+          )}
+
+          {data.kind === "condition" && (
+            <div className="workflow-config-section">
+              <h2>判断规则</h2>
+              <label>
+                <span>判断字段</span>
+                <select
+                  aria-label="判断字段"
+                  value={conditionField}
+                  onChange={(event) => {
+                    const selectedField = CONDITION_FIELDS.find(
+                      (field) => field.value === event.target.value,
+                    )!;
+                    onChange({
+                      conditionField: selectedField.value,
+                      conditionOperator: selectedField.defaultOperator,
+                      conditionValue: selectedField.defaultValue,
+                    });
+                  }}
+                >
+                  {CONDITION_FIELDS.map((field) => (
+                    <option key={field.value} value={field.value}>{field.label}</option>
+                  ))}
+                </select>
+              </label>
+              <label>
+                <span>运算符</span>
+                <select
+                  aria-label="运算符"
+                  value={conditionOperator}
+                  onChange={(event) => onChange({ conditionOperator: event.target.value })}
+                >
+                  {selectedConditionField.operators.map((operatorValue) => {
+                    const operator = CONDITION_OPERATORS.find(
+                      (option) => option.value === operatorValue,
+                    )!;
+                    return (
+                      <option key={operator.value} value={operator.value}>{operator.label}</option>
+                    );
+                  })}
+                </select>
+              </label>
+              {conditionField === "issue-status" && (
+                <label>
+                  <span>比较值</span>
+                  <select
+                    aria-label="比较值"
+                    value={conditionValue}
+                    onChange={(event) => onChange({ conditionValue: event.target.value })}
+                  >
+                    {ISSUE_STATUSES.map((status) => (
+                      <option key={status.value} value={status.value}>{status.label}</option>
+                    ))}
+                  </select>
+                </label>
+              )}
+              {conditionField === "issue-priority" && (
+                <label>
+                  <span>比较值</span>
+                  <select
+                    aria-label="比较值"
+                    value={conditionValue}
+                    onChange={(event) => onChange({ conditionValue: event.target.value })}
+                  >
+                    {ISSUE_PRIORITIES.map((priority) => (
+                      <option key={priority.value} value={priority.value}>{priority.label}</option>
+                    ))}
+                  </select>
+                </label>
+              )}
+              {(conditionField === "issue-labels" || conditionField === "upstream-output") && (
+                <label>
+                  <span>比较值</span>
+                  <input
+                    aria-label="比较值"
+                    type="text"
+                    value={conditionValue}
+                    placeholder="输入要比较的值"
+                    onChange={(event) => onChange({ conditionValue: event.target.value })}
+                  />
+                </label>
+              )}
+            </div>
+          )}
+
+          {data.kind === "feishu-message" && (
+            <div className="workflow-config-section">
+              <h2>飞书消息</h2>
+              <label>
+                <span>发送对象</span>
+                <select
+                  aria-label="飞书消息发送对象"
+                  value={data.feishuRecipientType ?? "self"}
+                  onChange={(event) => onChange({
+                    feishuRecipientType: event.target.value as WorkflowNodeData["feishuRecipientType"],
+                    feishuUserId: "",
+                    feishuChatId: "",
+                  })}
+                >
+                  {FEISHU_MESSAGE_RECIPIENTS.map((recipient) => (
+                    <option key={recipient.value} value={recipient.value}>{recipient.label}</option>
+                  ))}
+                </select>
+              </label>
+              {data.feishuRecipientType === "user" && (
+                <label>
+                  <span>用户 ID</span>
+                  <input
+                    aria-label="飞书用户"
+                    type="text"
+                    value={data.feishuUserId ?? ""}
+                    placeholder="open_id 或 user_id"
+                    onChange={(event) => onChange({ feishuUserId: event.target.value })}
+                  />
+                </label>
+              )}
+              {data.feishuRecipientType === "chat" && (
+                <label>
+                  <span>群聊 ID</span>
+                  <input
+                    aria-label="飞书群聊"
+                    type="text"
+                    value={data.feishuChatId ?? ""}
+                    placeholder="chat_id"
+                    onChange={(event) => onChange({ feishuChatId: event.target.value })}
+                  />
+                </label>
+              )}
+            </div>
+          )}
+
+          {data.kind === "twitter-post" && (
+            <div className="workflow-config-section">
+              <h2>发布到 Twitter</h2>
+              <label>
+                <span>发布内容</span>
+                <textarea
+                  aria-label="Twitter 发布内容"
+                  rows={6}
+                  value={data.twitterPostContent ?? ""}
+                  placeholder="输入要发布的内容…"
+                  onChange={(event) => onChange({ twitterPostContent: event.target.value })}
+                />
+              </label>
+            </div>
+          )}
+
+          {data.kind === "git" && (
+            <div className="workflow-config-section">
+              <h2>Git 操作</h2>
+              <label>
+                <span>操作</span>
+                <select
+                  aria-label="Git 操作"
+                  value={data.gitOperation ?? "commit"}
+                  onChange={(event) => onChange({ gitOperation: event.target.value })}
+                >
+                  {GIT_OPERATIONS.map((operation) => (
+                    <option key={operation.value} value={operation.value}>{operation.label}</option>
+                  ))}
+                </select>
+              </label>
+              {data.gitOperation === "commit" && (
+                <>
+                  <label>
+                    <span>提交说明</span>
+                    <input
+                      aria-label="Git 提交说明"
+                      type="text"
+                      value={data.gitCommitMessage ?? ""}
+                      placeholder="描述本次变更"
+                      onChange={(event) => onChange({ gitCommitMessage: event.target.value })}
+                    />
+                  </label>
+                  <label className="workflow-action-toggle workflow-action-toggle-full">
+                    <input
+                      type="checkbox"
+                      checked={data.gitStageAll ?? true}
+                      onChange={(event) => onChange({ gitStageAll: event.target.checked })}
+                    />
+                    <span>提交前暂存全部变更</span>
+                  </label>
+                </>
+              )}
+              {(data.gitOperation === "pull" || data.gitOperation === "push") && (
+                <>
+                  <label>
+                    <span>远程仓库</span>
+                    <input
+                      aria-label="Git 远程仓库"
+                      type="text"
+                      value={data.gitRemote ?? "origin"}
+                      placeholder="origin"
+                      onChange={(event) => onChange({ gitRemote: event.target.value })}
+                    />
+                  </label>
+                  <label>
+                    <span>分支</span>
+                    <input
+                      aria-label="Git 分支"
+                      type="text"
+                      value={data.gitBranchName ?? ""}
+                      placeholder="留空使用当前分支"
+                      onChange={(event) => onChange({ gitBranchName: event.target.value })}
+                    />
+                  </label>
+                </>
+              )}
+              {(data.gitOperation === "create-branch"
+                || data.gitOperation === "switch-branch"
+                || data.gitOperation === "merge-branch") && (
+                <label>
+                  <span>分支名称</span>
+                  <input
+                    aria-label="Git 分支名称"
+                    type="text"
+                    value={data.gitBranchName ?? ""}
+                    placeholder="feature/workflow"
+                    onChange={(event) => onChange({ gitBranchName: event.target.value })}
+                  />
+                </label>
+              )}
+              {(data.gitOperation === "create-branch"
+                || data.gitOperation === "create-worktree") && (
+                <label>
+                  <span>基于分支</span>
+                  <input
+                    aria-label="Git 基于分支"
+                    type="text"
+                    value={data.gitBaseBranch ?? ""}
+                    placeholder="留空使用当前分支"
+                    onChange={(event) => onChange({ gitBaseBranch: event.target.value })}
+                  />
+                </label>
+              )}
+              {data.gitOperation === "create-worktree" && (
+                <>
+                  <label>
+                    <span>Worktree 分支</span>
+                    <input
+                      aria-label="Git Worktree 分支"
+                      type="text"
+                      value={data.gitBranchName ?? ""}
+                      placeholder="feature/workflow"
+                      onChange={(event) => onChange({ gitBranchName: event.target.value })}
+                    />
+                  </label>
+                  <label>
+                    <span>Worktree 目录</span>
+                    <input
+                      aria-label="Git Worktree 目录"
+                      type="text"
+                      value={data.gitWorktreePath ?? ""}
+                      placeholder="../project-worktree"
+                      onChange={(event) => onChange({ gitWorktreePath: event.target.value })}
+                    />
+                  </label>
+                </>
+              )}
+            </div>
+          )}
+
+          {data.kind === "custom-code" && (
+            <div className="workflow-config-section">
+              <h2>自定义代码</h2>
+              <label>
+                <span>运行环境</span>
+                <select
+                  aria-label="代码运行环境"
+                  value={data.codeRuntime ?? "shell"}
+                  onChange={(event) => onChange({ codeRuntime: event.target.value as WorkflowNodeData["codeRuntime"] })}
+                >
+                  {CODE_RUNTIMES.map((runtime) => (
+                    <option key={runtime.value} value={runtime.value}>{runtime.label}</option>
+                  ))}
+                </select>
+              </label>
+              <label>
+                <span>代码内容</span>
+                <textarea
+                  aria-label="代码内容"
+                  rows={10}
+                  value={data.codeContent ?? ""}
+                  placeholder="输入要运行的代码…"
+                  onChange={(event) => onChange({ codeContent: event.target.value })}
+                />
+              </label>
+            </div>
+          )}
+
+          {data.kind === "run-tests" && (
+            <div className="workflow-config-section">
+              <h2>运行测试</h2>
+              <label>
+                <span>测试范围</span>
+                <select
+                  aria-label="测试范围"
+                  value={data.testScope ?? "related"}
+                  onChange={(event) => onChange({ testScope: event.target.value as WorkflowNodeData["testScope"] })}
+                >
+                  {TEST_SCOPES.map((scope) => (
+                    <option key={scope.value} value={scope.value}>{scope.label}</option>
+                  ))}
+                </select>
+              </label>
+              {data.testScope === "custom" && (
+                <label>
+                  <span>测试命令</span>
+                  <input
+                    aria-label="测试命令"
+                    type="text"
+                    value={data.testCommand ?? ""}
+                    placeholder="例如 npm test -- workflow"
+                    onChange={(event) => onChange({ testCommand: event.target.value })}
+                  />
+                </label>
+              )}
+            </div>
+          )}
+
+          {(data.kind === "claude-code-planning" || data.kind === "claude-code-review") && (
+            <div className="workflow-config-section">
+              <h2>Claude Code</h2>
+              <label>
+                <span>模型</span>
+                <select
+                  aria-label="Claude Code 模型"
+                  value={data.claudeModel ?? "claude-sonnet"}
+                  onChange={(event) => onChange({ claudeModel: event.target.value })}
+                >
+                  <option value="claude-sonnet">Claude Sonnet</option>
+                  <option value="claude-opus">Claude Opus</option>
+                  <option value="claude-haiku">Claude Haiku</option>
+                </select>
+              </label>
+              <label>
+                <span>推理强度</span>
+                <select
+                  aria-label="推理强度"
+                  value={data.reasoningEffort ?? "high"}
+                  onChange={(event) => onChange({ reasoningEffort: event.target.value })}
+                >
+                  <option value="low">低</option>
+                  <option value="medium">中</option>
+                  <option value="high">高</option>
+                  <option value="max">最高</option>
+                </select>
+              </label>
+              <label>
+                <span>规划要求</span>
+                <textarea
+                  rows={4}
+                  value={data.planningRequirements ?? ""}
+                  placeholder="说明分析步骤、约束、风险和验收要求…"
+                  onChange={(event) => onChange({ planningRequirements: event.target.value })}
+                />
+              </label>
+            </div>
+          )}
+
+          {data.kind === "issue-trigger" && (
+            <div className="workflow-config-section">
+              <h2>触发条件</h2>
+              <label>
+                <span>任务状态变为</span>
+                <select
+                  aria-label="任务触发状态"
+                  value={data.triggerStatus ?? "todo"}
+                  onChange={(event) => onChange({
+                    triggerStatus: event.target.value,
+                    description: `状态变为「${event.target.selectedOptions[0].text}」时触发`,
+                  })}
+                >
+                  {ISSUE_STATUSES.map((status) => (
+                    <option key={status.value} value={status.value}>{status.label}</option>
+                  ))}
+                </select>
+              </label>
+            </div>
+          )}
+
+          {data.kind === "issue-update" && (
+            <div className="workflow-config-section">
+              <h2>任务操作</h2>
+              <label>
+                <span>任务选择</span>
+                <select
+                  aria-label="任务选择"
+                  value={data.issueTarget ?? "trigger"}
+                  onChange={(event) => onChange({ issueTarget: event.target.value })}
+                >
+                  <option value="trigger">触发流程的任务</option>
+                  <option value="upstream">上游节点输出的任务</option>
+                  <option value="specific">指定任务</option>
+                </select>
+              </label>
+              {data.issueTarget === "specific" && (
+                <label>
+                  <span>任务 ID</span>
+                  <input
+                    aria-label="指定任务 ID"
+                    type="text"
+                    value={data.specificIssueId ?? ""}
+                    placeholder="例如 LOCAL-48"
+                    onChange={(event) => onChange({ specificIssueId: event.target.value })}
+                  />
+                </label>
+              )}
+              <div className="workflow-action-row">
+                <label className="workflow-action-toggle">
+                  <input
+                    type="checkbox"
+                    checked={data.changeStatus ?? false}
+                    onChange={(event) => onChange({ changeStatus: event.target.checked })}
+                  />
+                  <span>改变状态</span>
+                </label>
+                <select
+                  aria-label="目标状态"
+                  disabled={!data.changeStatus}
+                  value={data.targetStatus ?? "in_review"}
+                  onChange={(event) => onChange({ targetStatus: event.target.value })}
+                >
+                  {ISSUE_STATUSES.map((status) => (
+                    <option key={status.value} value={status.value}>{status.label}</option>
+                  ))}
+                </select>
+              </div>
+              <div className="workflow-action-row">
+                <label className="workflow-action-toggle">
+                  <input
+                    type="checkbox"
+                    checked={data.addComment ?? false}
+                    onChange={(event) => onChange({ addComment: event.target.checked })}
+                  />
+                  <span>添加评论</span>
+                </label>
+                <select
+                  aria-label="评论内容"
+                  disabled={!data.addComment}
+                  value={data.commentSource ?? "workflow-output"}
+                  onChange={(event) => onChange({ commentSource: event.target.value })}
+                >
+                  <option value="workflow-output">上游节点输出</option>
+                  <option value="run-summary">流程运行摘要</option>
+                  <option value="custom">自定义内容</option>
+                </select>
+              </div>
+              {data.addComment && data.commentSource === "custom" && (
+                <label>
+                  <span>评论内容</span>
+                  <textarea
+                    rows={3}
+                    value={data.customComment ?? ""}
+                    placeholder="输入要追加到任务的评论…"
+                    onChange={(event) => onChange({ customComment: event.target.value })}
+                  />
+                </label>
+              )}
+              <div className="workflow-action-row">
+                <label className="workflow-action-toggle">
+                  <input
+                    type="checkbox"
+                    checked={data.addLabels ?? false}
+                    onChange={(event) => onChange({ addLabels: event.target.checked })}
+                  />
+                  <span>添加标签</span>
+                </label>
+                <input
+                  aria-label="要添加的标签"
+                  type="text"
+                  disabled={!data.addLabels}
+                  value={data.labelsToAdd ?? ""}
+                  placeholder="自动化, 已处理"
+                  onChange={(event) => onChange({ labelsToAdd: event.target.value })}
+                />
+              </div>
+              <div className="workflow-action-row">
+                <label className="workflow-action-toggle">
+                  <input
+                    type="checkbox"
+                    checked={data.setPriority ?? false}
+                    onChange={(event) => onChange({ setPriority: event.target.checked })}
+                  />
+                  <span>设置优先级</span>
+                </label>
+                <select
+                  aria-label="目标优先级"
+                  disabled={!data.setPriority}
+                  value={data.targetPriority ?? "none"}
+                  onChange={(event) => onChange({ targetPriority: event.target.value })}
+                >
+                  {ISSUE_PRIORITIES.map((priority) => (
+                    <option key={priority.value} value={priority.value}>{priority.label}</option>
+                  ))}
+                </select>
+              </div>
+              <label className="workflow-action-toggle workflow-action-toggle-full">
+                <input
+                  type="checkbox"
+                  checked={data.attachArtifacts ?? false}
+                  onChange={(event) => onChange({ attachArtifacts: event.target.checked })}
+                />
+                <span>附加流程运行产物</span>
+              </label>
+              <label className="workflow-action-toggle workflow-action-toggle-full">
+                <input
+                  type="checkbox"
+                  checked={data.recordConversation ?? false}
+                  onChange={(event) => onChange({ recordConversation: event.target.checked })}
+                />
+                <span>记录执行该任务的 Codex 对话</span>
+              </label>
+            </div>
+          )}
+
+          <div className="workflow-config-section">
+            <h2>连接</h2>
+            <div className="workflow-port-row">
+              <span><i className="input" aria-hidden="true" />输入</span>
+              <strong>{data.inputLabel ?? "无"}</strong>
+            </div>
+            <div className="workflow-port-row">
+              <span><i className="output" aria-hidden="true" />输出</span>
+              <strong>{data.outputLabel ?? "无"}</strong>
+            </div>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/WorkflowMark.tsx b/apps/codex-taskboard/web/src/components/WorkflowMark.tsx
new file mode 100644
index 000000000..0313c3273
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/WorkflowMark.tsx
@@ -0,0 +1,20 @@
+import { LinearIcon, type LinearIconName } from "./LinearIcon";
+
+interface WorkflowMarkProps {
+  icon: LinearIconName;
+  logo?: string;
+  logoMonochrome?: boolean;
+}
+
+export function WorkflowMark({ icon, logo, logoMonochrome = false }: WorkflowMarkProps) {
+  if (!logo) return <LinearIcon name={icon} />;
+
+  return (
+    <img
+      className={`workflow-brand-logo${logoMonochrome ? " monochrome" : ""}`}
+      src={logo}
+      alt=""
+      draggable={false}
+    />
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/WorkflowNode.tsx b/apps/codex-taskboard/web/src/components/WorkflowNode.tsx
new file mode 100644
index 000000000..5c60b7474
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/WorkflowNode.tsx
@@ -0,0 +1,362 @@
+import { useEffect, useLayoutEffect, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import { Handle, Position, type Node, type NodeProps } from "@xyflow/react";
+import { LinearIcon, type LinearIconName } from "./LinearIcon";
+import { WorkflowMark } from "./WorkflowMark";
+
+export type WorkflowNodeTone =
+  | "issue"
+  | "capability"
+  | "api"
+  | "integration"
+  | "development"
+  | "planning"
+  | "result";
+
+export interface WorkflowNodeData extends Record<string, unknown> {
+  kind: string;
+  eyebrow: string;
+  title: string;
+  displayTitle?: string;
+  description: string;
+  meta: string;
+  icon: LinearIconName;
+  logo?: string;
+  logoMonochrome?: boolean;
+  tone: WorkflowNodeTone;
+  inputLabel?: string;
+  outputLabel?: string;
+  additionalInstructions?: string;
+  selectedSkill?: string;
+  selectedMcpServer?: string;
+  claudeModel?: string;
+  reasoningEffort?: string;
+  planningRequirements?: string;
+  issueTarget?: string;
+  specificIssueId?: string;
+  changeStatus?: boolean;
+  targetStatus?: string;
+  addComment?: boolean;
+  commentSource?: string;
+  customComment?: string;
+  addLabels?: boolean;
+  labelsToAdd?: string;
+  setPriority?: boolean;
+  targetPriority?: string;
+  attachArtifacts?: boolean;
+  recordConversation?: boolean;
+  triggerStatus?: string;
+  createIssueTitle?: string;
+  createIssueDescription?: string;
+  createIssueStatus?: string;
+  createIssuePriority?: string;
+  createIssueLabels?: string;
+  gitOperation?: string;
+  gitCommitMessage?: string;
+  gitStageAll?: boolean;
+  gitRemote?: string;
+  gitBranchName?: string;
+  gitBaseBranch?: string;
+  gitWorktreePath?: string;
+  conditionField?: string;
+  conditionOperator?: string;
+  conditionValue?: string;
+  feishuRecipientType?: "self" | "user" | "chat";
+  feishuUserId?: string;
+  feishuChatId?: string;
+  twitterPostContent?: string;
+  rssFeedUrl?: string;
+  codeRuntime?: "shell" | "javascript" | "python";
+  codeContent?: string;
+  testScope?: "related" | "all" | "custom";
+  testCommand?: string;
+  acceptsChildren?: boolean;
+  childCount?: number;
+  stepNumber?: number;
+  configured?: boolean;
+  isTrigger?: boolean;
+  dragShiftY?: number;
+  dragActive?: boolean;
+  settleActive?: boolean;
+  conditionOutcome?: "true" | "false";
+  onDuplicate?: () => void;
+  onDelete?: () => void;
+  onAddChild?: () => void;
+}
+
+export type WorkflowCanvasNode = Node<WorkflowNodeData, "workflow">;
+
+function StepMenu({
+  canDelete,
+  canDuplicate,
+  onDelete,
+  onDuplicate,
+}: {
+  canDelete: boolean;
+  canDuplicate: boolean;
+  onDelete?: () => void;
+  onDuplicate?: () => void;
+}) {
+  const [open, setOpen] = useState(false);
+  const [position, setPosition] = useState({ top: 0, left: 0 });
+  const triggerRef = useRef<HTMLButtonElement>(null);
+  const menuRef = useRef<HTMLDivElement>(null);
+  const popoverRef = useRef<HTMLDivElement>(null);
+
+  useLayoutEffect(() => {
+    if (!open) return;
+    const trigger = triggerRef.current;
+    const popover = popoverRef.current;
+    if (!trigger || !popover) return;
+    const triggerRect = trigger.getBoundingClientRect();
+    const popoverRect = popover.getBoundingClientRect();
+    setPosition({
+      top: Math.min(triggerRect.bottom + 4, window.innerHeight - popoverRect.height - 8),
+      left: Math.max(8, Math.min(
+        triggerRect.right - popoverRect.width,
+        window.innerWidth - popoverRect.width - 8,
+      )),
+    });
+  }, [open]);
+
+  useEffect(() => {
+    if (!open) return;
+    function close(event: PointerEvent) {
+      if (
+        menuRef.current?.contains(event.target as globalThis.Node)
+        || popoverRef.current?.contains(event.target as globalThis.Node)
+      ) return;
+      setOpen(false);
+    }
+    function closeOnViewportChange() {
+      setOpen(false);
+    }
+    document.addEventListener("pointerdown", close);
+    document.addEventListener("wheel", closeOnViewportChange, true);
+    window.addEventListener("resize", closeOnViewportChange);
+    window.addEventListener("scroll", closeOnViewportChange, true);
+    return () => {
+      document.removeEventListener("pointerdown", close);
+      document.removeEventListener("wheel", closeOnViewportChange, true);
+      window.removeEventListener("resize", closeOnViewportChange);
+      window.removeEventListener("scroll", closeOnViewportChange, true);
+    };
+  }, [open]);
+
+  if (!canDelete && !canDuplicate) return null;
+
+  return (
+    <div className="workflow-step-menu workflow-node-menu nodrag nopan" ref={menuRef}>
+      <button
+        ref={triggerRef}
+        className="workflow-step-menu-trigger"
+        type="button"
+        aria-label="步骤操作"
+        aria-expanded={open}
+        onClick={(event) => {
+          event.stopPropagation();
+          setOpen((current) => !current);
+        }}
+      >
+        <LinearIcon name="more" />
+      </button>
+      {open && createPortal(
+        <div
+          ref={popoverRef}
+          className="workflow-step-menu-popover is-portaled nodrag nopan"
+          role="menu"
+          style={{ top: position.top, left: position.left }}
+        >
+          {canDuplicate && (
+            <button
+              type="button"
+              role="menuitem"
+              onClick={(event) => {
+                event.stopPropagation();
+                setOpen(false);
+                onDuplicate?.();
+              }}
+            >
+              <LinearIcon name="copy" />
+              <span>复制步骤</span>
+            </button>
+          )}
+          {canDelete && (
+            <button
+              className="is-danger"
+              type="button"
+              role="menuitem"
+              onClick={(event) => {
+                event.stopPropagation();
+                setOpen(false);
+                onDelete?.();
+              }}
+            >
+              <LinearIcon name="trash" />
+              <span>删除步骤</span>
+            </button>
+          )}
+        </div>,
+        document.body,
+      )}
+    </div>
+  );
+}
+
+export function WorkflowNode({ data, selected, isConnectable, parentId }: NodeProps<WorkflowCanvasNode>) {
+  if (data.kind.startsWith("flow-")) {
+    const hasOutput = data.kind !== "flow-end";
+    return (
+      <div className={`workflow-flow-anchor workflow-${data.kind}`} aria-hidden="true">
+        <Handle
+          className="workflow-sequence-handle workflow-sequence-handle-input"
+          type="target"
+          position={Position.Top}
+          isConnectable={false}
+        />
+        {hasOutput && (
+          <Handle
+            className="workflow-sequence-handle workflow-sequence-handle-output"
+            type="source"
+            position={Position.Bottom}
+            isConnectable={false}
+          />
+        )}
+      </div>
+    );
+  }
+
+  if (parentId) {
+    return (
+      <article
+        className={`workflow-node-compact workflow-node-${data.tone}${selected ? " selected" : ""}${data.dragShiftY ? " is-drag-shifted" : ""}${data.dragActive ? " is-dragging" : ""}${data.settleActive ? " is-settling" : ""}`}
+        style={data.dragShiftY ? { transform: `translate3d(0, ${data.dragShiftY}px, 0)` } : undefined}
+      >
+        <span className="workflow-node-icon" aria-hidden="true">
+          <WorkflowMark
+            icon={data.icon}
+            logo={data.logo}
+            logoMonochrome={data.logoMonochrome}
+          />
+        </span>
+        <strong>{data.displayTitle ?? data.title}</strong>
+      </article>
+    );
+  }
+
+  if (data.acceptsChildren) {
+    return (
+      <article
+        className={`workflow-plan-container${selected ? " selected" : ""}${data.dragShiftY ? " is-drag-shifted" : ""}${data.dragActive ? " is-dragging" : ""}${data.settleActive ? " is-settling" : ""}`}
+        style={data.dragShiftY ? { transform: `translate3d(0, ${data.dragShiftY}px, 0)` } : undefined}
+      >
+        <Handle
+          className="workflow-sequence-handle workflow-sequence-handle-input"
+          type="target"
+          position={Position.Top}
+          isConnectable={isConnectable}
+          aria-label={data.inputLabel ?? "步骤输入"}
+        />
+        <header className="workflow-plan-container-header">
+          <span className="workflow-node-icon" aria-hidden="true">
+            <WorkflowMark
+              icon={data.icon}
+              logo={data.logo}
+              logoMonochrome={data.logoMonochrome}
+            />
+          </span>
+          <span className="workflow-node-heading">
+            <span>{data.eyebrow}</span>
+            <strong>{data.displayTitle ?? data.title}</strong>
+          </span>
+          <StepMenu
+            canDelete={!data.isTrigger}
+            canDuplicate={!data.isTrigger && data.kind !== "condition"}
+            onDelete={data.onDelete}
+            onDuplicate={data.onDuplicate}
+          />
+        </header>
+        <div className="workflow-plan-container-summary">
+          <p>{data.description}</p>
+        </div>
+        <div className="workflow-plan-drop-zone">
+          {(data.childCount ?? 0) === 0 && <span>执行计划中还没有步骤</span>}
+        </div>
+        <footer className="workflow-plan-container-footer">
+          <span>从上到下执行 · {data.childCount ?? 0} 步</span>
+          <button
+            className="workflow-plan-add-inline nodrag nopan"
+            type="button"
+            aria-label="向执行计划添加步骤"
+            onClick={(event) => {
+              event.stopPropagation();
+              data.onAddChild?.();
+            }}
+          >
+            <LinearIcon name="plus" />
+            <span>添加步骤</span>
+          </button>
+        </footer>
+        <Handle
+          className="workflow-sequence-handle workflow-sequence-handle-output"
+          type="source"
+          position={Position.Bottom}
+          isConnectable={isConnectable}
+          aria-label={data.outputLabel ?? "步骤输出"}
+        />
+      </article>
+    );
+  }
+
+  return (
+    <article
+      className={`workflow-node workflow-node-${data.tone}${selected ? " selected" : ""}${data.dragShiftY ? " is-drag-shifted" : ""}${data.dragActive ? " is-dragging" : ""}${data.settleActive ? " is-settling" : ""}`}
+      style={data.dragShiftY ? { transform: `translate3d(0, ${data.dragShiftY}px, 0)` } : undefined}
+    >
+      <Handle
+        className="workflow-sequence-handle workflow-sequence-handle-input"
+        type="target"
+        position={Position.Top}
+        isConnectable={isConnectable}
+        aria-label={data.inputLabel ?? "步骤输入"}
+      />
+      <header className="workflow-node-header">
+        <span className="workflow-node-icon" aria-hidden="true">
+          <WorkflowMark
+            icon={data.icon}
+            logo={data.logo}
+            logoMonochrome={data.logoMonochrome}
+          />
+        </span>
+        <span className="workflow-node-heading">
+          <span>{data.eyebrow}</span>
+          <strong>{data.displayTitle ?? data.title}</strong>
+        </span>
+        <StepMenu
+          canDelete={!data.isTrigger}
+          canDuplicate={!data.isTrigger && data.kind !== "condition"}
+          onDelete={data.onDelete}
+          onDuplicate={data.onDuplicate}
+        />
+      </header>
+      <div className="workflow-node-body">
+        <p>{data.description}</p>
+        <span>{data.meta}</span>
+      </div>
+      <footer className="workflow-node-footer">
+        <span className={`workflow-node-state${data.configured ? " is-configured" : " needs-config"}`}>
+          <i aria-hidden="true" />
+          {data.configured ? "已配置" : "需要配置"}
+        </span>
+        <span>{data.isTrigger ? "触发步骤" : `步骤 ${data.stepNumber ?? ""}`}</span>
+      </footer>
+      <Handle
+        className="workflow-sequence-handle workflow-sequence-handle-output"
+        type="source"
+        position={Position.Bottom}
+        isConnectable={isConnectable}
+        aria-label={data.outputLabel ?? "步骤输出"}
+      />
+    </article>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/WorkflowStepPicker.tsx b/apps/codex-taskboard/web/src/components/WorkflowStepPicker.tsx
new file mode 100644
index 000000000..457c7d885
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/WorkflowStepPicker.tsx
@@ -0,0 +1,113 @@
+import { useEffect, useMemo, useRef, useState } from "react";
+import { LinearIcon } from "./LinearIcon";
+import { WORKFLOW_GROUPS, type PaletteItem } from "./workflowCatalog";
+import { WorkflowMark } from "./WorkflowMark";
+
+interface WorkflowStepPickerProps {
+  items: PaletteItem[];
+  onSelect: (item: PaletteItem) => void;
+  onClose: () => void;
+}
+
+export function WorkflowStepPicker({ items, onSelect, onClose }: WorkflowStepPickerProps) {
+  const [query, setQuery] = useState("");
+  const searchRef = useRef<HTMLInputElement>(null);
+
+  useEffect(() => {
+    searchRef.current?.focus();
+
+    function handleKeyDown(event: globalThis.KeyboardEvent) {
+      if (event.key !== "Escape") return;
+      event.preventDefault();
+      onClose();
+    }
+
+    document.addEventListener("keydown", handleKeyDown);
+    return () => document.removeEventListener("keydown", handleKeyDown);
+  }, [onClose]);
+
+  const filteredItems = useMemo(() => {
+    const normalizedQuery = query.trim().toLocaleLowerCase();
+    if (!normalizedQuery) return items;
+
+    return items.filter((item) => (
+      `${item.group} ${item.title} ${item.description} ${item.data.title} ${item.data.description} ${item.data.meta}`
+        .toLocaleLowerCase()
+        .includes(normalizedQuery)
+    ));
+  }, [items, query]);
+
+  const groups = useMemo(() => {
+    const availableGroups = new Set(filteredItems.map((item) => item.group));
+    return [
+      ...WORKFLOW_GROUPS.filter((group) => availableGroups.has(group)),
+      ...[...availableGroups].filter((group) => !WORKFLOW_GROUPS.includes(group as typeof WORKFLOW_GROUPS[number])),
+    ];
+  }, [filteredItems]);
+
+  return (
+    <div className="workflow-step-picker-backdrop" onMouseDown={(event) => {
+      if (event.target === event.currentTarget) onClose();
+    }}>
+      <section
+        className="workflow-step-picker"
+        role="dialog"
+        aria-label="添加流程步骤"
+        aria-modal="true"
+      >
+        <header className="workflow-step-picker-header">
+          <strong>添加流程步骤</strong>
+          <button type="button" aria-label="关闭" onClick={onClose}>
+            <LinearIcon name="close" />
+          </button>
+        </header>
+
+        <label className="workflow-step-picker-search">
+          <LinearIcon name="search" />
+          <input
+            ref={searchRef}
+            type="search"
+            value={query}
+            placeholder="搜索应用或动作…"
+            aria-label="搜索应用或动作"
+            onChange={(event) => setQuery(event.target.value)}
+          />
+        </label>
+
+        <div className="workflow-step-picker-groups">
+          {groups.map((group) => (
+            <section className="workflow-step-picker-group" key={group}>
+              <h3>{group}</h3>
+              <div className="workflow-step-picker-items">
+                {filteredItems.filter((item) => item.group === group).map((item) => (
+                  <button
+                    className="workflow-step-picker-item"
+                    type="button"
+                    key={`${item.group}-${item.data.kind}`}
+                    onClick={() => onSelect(item)}
+                  >
+                    <span className={`workflow-step-picker-mark tone-${item.data.tone}`}>
+                      <WorkflowMark
+                        icon={item.data.icon}
+                        logo={item.data.logo}
+                        logoMonochrome={item.data.logoMonochrome}
+                      />
+                    </span>
+                    <span className="workflow-step-picker-copy">
+                      <strong>{item.title}</strong>
+                      <span>{item.description}</span>
+                    </span>
+                    <LinearIcon className="workflow-step-picker-chevron" name="chevronRight" />
+                  </button>
+                ))}
+              </div>
+            </section>
+          ))}
+          {filteredItems.length === 0 && (
+            <p className="workflow-step-picker-empty">没有匹配的应用或动作</p>
+          )}
+        </div>
+      </section>
+    </div>
+  );
+}
diff --git a/apps/codex-taskboard/web/src/components/workflow.css b/apps/codex-taskboard/web/src/components/workflow.css
new file mode 100644
index 000000000..dea4a77c8
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/workflow.css
@@ -0,0 +1,1379 @@
+.workflow-board {
+  --workflow-titlebar-height: 48px;
+  --workflow-step-width: 250px;
+  display: grid;
+  grid-template-columns: minmax(0, 1fr);
+  width: 100%;
+  height: 100%;
+  min-width: 0;
+  min-height: 0;
+  overflow: hidden;
+  background: var(--bg);
+}
+
+.workflow-board.has-inspector {
+  grid-template-columns: minmax(0, 1fr) 360px;
+}
+
+.workflow-canvas-shell {
+  display: flex;
+  min-width: 0;
+  min-height: 0;
+  flex-direction: column;
+  overflow: hidden;
+  background: var(--bg);
+}
+
+.workflow-canvas-toolbar {
+  position: relative;
+  z-index: 10;
+  display: flex;
+  flex: 0 0 var(--workflow-titlebar-height);
+  height: var(--workflow-titlebar-height);
+  align-items: stretch;
+  justify-content: space-between;
+  min-width: 0;
+  gap: 12px;
+  padding: 0 10px 0 14px;
+  background: color-mix(in srgb, var(--header-bg) 97%, transparent);
+  box-shadow: inset 0 calc(-1 * var(--border-hairline)) 0 var(--border);
+}
+
+.workflow-tabs {
+  display: flex;
+  align-items: flex-end;
+  min-width: 0;
+  flex: 1;
+  gap: 2px;
+  overflow-x: auto;
+  overflow-y: hidden;
+  scrollbar-width: none;
+}
+
+.workflow-tabs::-webkit-scrollbar {
+  display: none;
+}
+
+.workflow-tab,
+.workflow-tab-add {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 auto;
+  height: 40px;
+  padding: 0;
+  border: var(--border-hairline) solid transparent;
+  outline: 0;
+  background: transparent;
+  color: var(--text-tertiary);
+}
+
+.workflow-tab {
+  max-width: 220px;
+  gap: 7px;
+  padding: 0 17px;
+  border-bottom: 0;
+  border-radius: 11px 11px 0 0;
+  font-size: 10px;
+  font-weight: 520;
+}
+
+.workflow-tab > span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-tab svg,
+.workflow-tab-add svg {
+  width: 14px;
+  height: 14px;
+  flex: 0 0 auto;
+}
+
+.workflow-tab:hover,
+.workflow-tab-add:hover {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.workflow-tab:focus-visible,
+.workflow-tab-add:focus-visible {
+  box-shadow: inset 0 0 0 2px var(--accent-soft);
+}
+
+.workflow-tab.is-active {
+  z-index: 1;
+  margin-bottom: 0;
+  border-color: var(--border-strong);
+  border-bottom: 0;
+  background: var(--bg);
+  color: var(--text-primary);
+  font-weight: 570;
+}
+
+.workflow-tab.is-renaming {
+  padding-right: 10px;
+}
+
+.workflow-tab.is-renaming input {
+  width: min(152px, 20vw);
+  min-width: 72px;
+  height: 24px;
+  padding: 0 5px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 5px;
+  outline: 0;
+  background: var(--surface);
+  color: var(--text-primary);
+  font: inherit;
+}
+
+.workflow-tab-add {
+  width: 38px;
+  margin: 0 2px;
+  border-radius: 7px;
+}
+
+.workflow-toolbar-status {
+  display: flex;
+  align-items: center;
+  flex: 0 0 auto;
+  gap: 4px;
+}
+
+.workflow-toolbar-status > span {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  max-width: 190px;
+  overflow: hidden;
+  color: var(--text-tertiary);
+  font-size: 9px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-toolbar-status > span i {
+  width: 5px;
+  height: 5px;
+  flex: 0 0 5px;
+  border-radius: 50%;
+  background: var(--success);
+}
+
+.workflow-toolbar-status > span.has-error {
+  color: var(--danger);
+}
+
+.workflow-toolbar-status > span.has-error i {
+  background: var(--danger);
+}
+
+.workflow-canvas {
+  position: relative;
+  flex: 1;
+  min-width: 0;
+  min-height: 0;
+  overflow: hidden;
+  background:
+    radial-gradient(circle at 50% 0, color-mix(in srgb, var(--accent) 3%, transparent), transparent 34%),
+    color-mix(in srgb, var(--surface-muted) 28%, var(--bg));
+}
+
+.workflow-canvas .react-flow {
+  color: var(--text-primary);
+}
+
+.workflow-canvas .react-flow__pane {
+  cursor: grab;
+}
+
+.workflow-canvas .react-flow__pane:active {
+  cursor: grabbing;
+}
+
+.workflow-canvas .react-flow__selection {
+  border: 1px solid color-mix(in srgb, var(--accent) 58%, transparent);
+  background: color-mix(in srgb, var(--accent) 6%, transparent);
+}
+
+.workflow-canvas .react-flow__node-workflow {
+  width: var(--workflow-step-width);
+  border: 0;
+  outline: 0;
+  background: transparent;
+}
+
+.workflow-step-card {
+  --node-tone: var(--accent);
+  position: relative;
+  width: 360px;
+  min-height: 78px;
+  overflow: visible;
+  border: 1px solid var(--border-strong);
+  border-radius: 12px;
+  background: var(--surface-raised);
+  box-shadow:
+    0 1px 2px rgba(0, 0, 0, 0.035),
+    0 5px 18px rgba(0, 0, 0, 0.035);
+  transition:
+    border-color 120ms ease,
+    box-shadow 120ms ease,
+    transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
+}
+
+.workflow-step-card:hover {
+  border-color: color-mix(in srgb, var(--node-tone) 35%, var(--border-strong));
+}
+
+.workflow-step-card.selected {
+  border-color: color-mix(in srgb, var(--node-tone) 76%, var(--border-strong));
+  box-shadow:
+    0 0 0 3px color-mix(in srgb, var(--node-tone) 10%, transparent),
+    0 8px 24px rgba(0, 0, 0, 0.065);
+}
+
+.workflow-step-card.is-dragging {
+  border-color: color-mix(in srgb, var(--node-tone) 76%, var(--border-strong));
+  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.14);
+  cursor: grabbing;
+}
+
+.workflow-step-card.is-drag-shifted {
+  will-change: transform;
+}
+
+.workflow-step-card.is-plan {
+  height: 100%;
+}
+
+.workflow-node-issue {
+  --node-tone: #6e78df;
+}
+
+.workflow-node-capability {
+  --node-tone: #4777d4;
+}
+
+.workflow-node-api {
+  --node-tone: #2b8a66;
+}
+
+.workflow-node-integration {
+  --node-tone: #2f7f9d;
+}
+
+.workflow-node-development {
+  --node-tone: #c15f3c;
+}
+
+.workflow-node-planning {
+  --node-tone: #b7791f;
+}
+
+.workflow-node-result {
+  --node-tone: #a75ac4;
+}
+
+.workflow-step-main {
+  display: grid;
+  grid-template-columns: 32px 38px minmax(0, 1fr) auto 24px;
+  align-items: center;
+  height: 76px;
+  gap: 10px;
+  padding: 10px 11px 10px 12px;
+}
+
+.workflow-step-order {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 28px;
+  height: 22px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 999px;
+  background: var(--surface-muted);
+  color: var(--text-tertiary);
+  font-size: 9px;
+  font-weight: 600;
+}
+
+.workflow-step-order.is-trigger {
+  width: 32px;
+  border-color: color-mix(in srgb, var(--node-tone) 24%, var(--border));
+  background: color-mix(in srgb, var(--node-tone) 7%, var(--surface));
+  color: var(--node-tone);
+  font-size: 8px;
+}
+
+.workflow-step-mark,
+.workflow-step-picker-mark {
+  display: grid;
+  place-items: center;
+  width: 38px;
+  height: 38px;
+  flex: 0 0 38px;
+  border: var(--border-hairline) solid color-mix(in srgb, var(--node-tone) 28%, var(--border));
+  border-radius: 9px;
+  background: color-mix(in srgb, var(--node-tone) 8%, var(--surface));
+  color: var(--node-tone);
+}
+
+.workflow-step-mark svg,
+.workflow-step-picker-mark svg {
+  width: 17px;
+  height: 17px;
+}
+
+.workflow-step-mark .workflow-brand-logo,
+.workflow-step-picker-mark .workflow-brand-logo {
+  display: block;
+  width: 21px;
+  height: 21px;
+  object-fit: contain;
+  pointer-events: none;
+  user-select: none;
+}
+
+:root[data-theme="dark"] .workflow-brand-logo.monochrome {
+  filter: invert(1);
+}
+
+.workflow-step-copy {
+  display: flex;
+  min-width: 0;
+  flex-direction: column;
+  gap: 3px;
+}
+
+.workflow-step-copy strong {
+  overflow: hidden;
+  color: var(--text-primary);
+  font-size: 12px;
+  font-weight: 570;
+  line-height: 1.25;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-step-copy small {
+  overflow: hidden;
+  color: var(--text-tertiary);
+  font-size: 9px;
+  font-weight: 450;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-step-state {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  padding: 4px 7px;
+  border-radius: 999px;
+  background: var(--surface-muted);
+  color: var(--text-tertiary);
+  font-size: 8px;
+  white-space: nowrap;
+}
+
+.workflow-step-state i {
+  width: 5px;
+  height: 5px;
+  border-radius: 50%;
+  background: var(--text-tertiary);
+}
+
+.workflow-step-state.is-configured {
+  background: color-mix(in srgb, var(--success) 8%, var(--surface));
+  color: color-mix(in srgb, var(--success) 80%, var(--text-secondary));
+}
+
+.workflow-step-state.is-configured i {
+  background: var(--success);
+}
+
+.workflow-step-state.needs-config {
+  background: color-mix(in srgb, var(--warning) 9%, var(--surface));
+  color: color-mix(in srgb, var(--warning) 76%, var(--text-secondary));
+}
+
+.workflow-step-state.needs-config i {
+  background: var(--warning);
+}
+
+.workflow-step-menu {
+  position: relative;
+  z-index: 8;
+}
+
+.workflow-step-menu-trigger {
+  display: grid;
+  place-items: center;
+  width: 24px;
+  height: 24px;
+  border: 0;
+  border-radius: 6px;
+  background: transparent;
+  color: var(--text-tertiary);
+  opacity: 0;
+}
+
+.workflow-node:hover .workflow-step-menu-trigger,
+.workflow-node.selected .workflow-step-menu-trigger,
+.workflow-plan-container:hover .workflow-step-menu-trigger,
+.workflow-plan-container.selected .workflow-step-menu-trigger,
+.workflow-step-menu-trigger[aria-expanded="true"] {
+  opacity: 1;
+}
+
+.workflow-step-menu-trigger:hover {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.workflow-step-menu-trigger svg {
+  width: 14px;
+  height: 14px;
+}
+
+.workflow-step-menu-popover {
+  position: absolute;
+  z-index: 1000;
+  top: 28px;
+  right: 0;
+  display: flex;
+  width: 148px;
+  flex-direction: column;
+  gap: 2px;
+  padding: 5px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 9px;
+  background: var(--surface-raised);
+  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.14);
+}
+
+.workflow-step-menu-popover.is-portaled {
+  position: fixed;
+  right: auto;
+}
+
+.workflow-step-menu-popover > button {
+  display: grid;
+  grid-template-columns: 18px minmax(0, 1fr);
+  align-items: center;
+  min-height: 30px;
+  gap: 7px;
+  padding: 0 8px;
+  border: 0;
+  border-radius: 6px;
+  background: transparent;
+  color: var(--text-secondary);
+  font-size: 10px;
+  text-align: left;
+}
+
+.workflow-step-menu-popover > button:hover {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.workflow-step-menu-popover > button.is-danger {
+  color: var(--danger);
+}
+
+.workflow-step-menu-popover svg {
+  width: 14px;
+  height: 14px;
+}
+
+.workflow-sequence-handle {
+  width: 7px !important;
+  height: 7px !important;
+  border: 2px solid var(--surface-raised) !important;
+  background: var(--node-tone, var(--accent)) !important;
+  opacity: 0;
+  pointer-events: none;
+}
+
+.workflow-sequence-handle-input {
+  top: -4px !important;
+}
+
+.workflow-sequence-handle-output {
+  bottom: -4px !important;
+}
+
+.workflow-sequence-edge-path,
+.workflow-sequence-tail-edge .react-flow__edge-path {
+  stroke: color-mix(in srgb, var(--text-tertiary) 42%, transparent);
+  stroke-width: 1.35;
+}
+
+.workflow-sequence-add {
+  position: absolute;
+  z-index: 12;
+  display: grid;
+  place-items: center;
+  pointer-events: all;
+  width: 24px;
+  height: 24px;
+  padding: 0;
+  border: 1px solid var(--border-strong);
+  border-radius: 50%;
+  background: var(--surface-raised);
+  box-shadow: 0 2px 7px rgba(0, 0, 0, 0.08);
+  color: var(--text-tertiary);
+  opacity: 0.55;
+  transition:
+    border-color 100ms ease,
+    color 100ms ease,
+    opacity 100ms ease,
+    transform 100ms ease;
+}
+
+.workflow-sequence-add:hover,
+.workflow-sequence-add:focus-visible {
+  border-color: color-mix(in srgb, var(--accent) 52%, var(--border-strong));
+  color: var(--accent);
+  opacity: 1;
+}
+
+.workflow-sequence-add svg {
+  width: 12px;
+  height: 12px;
+}
+
+.workflow-flow-anchor {
+  position: relative;
+  width: 1px;
+  height: 1px;
+}
+
+.workflow-flow-merge::after {
+  position: absolute;
+  z-index: 4;
+  top: 50%;
+  left: 50%;
+  width: 10px;
+  height: 10px;
+  border: 1.25px solid color-mix(in srgb, var(--text-tertiary) 46%, var(--border-strong));
+  border-radius: 50%;
+  background: color-mix(in srgb, var(--surface-raised) 84%, var(--border-strong));
+  box-shadow: 0 0 0 0.5px var(--surface-raised);
+  content: "";
+  transform: translate(-50%, -50%);
+}
+
+.workflow-condition-branch-label {
+  position: absolute;
+  z-index: 11;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: max-content;
+  height: 20px;
+  padding: 0 8px;
+  border: var(--border-hairline) solid color-mix(in srgb, var(--text-primary) 82%, transparent);
+  border-radius: 999px;
+  background: var(--text-primary);
+  color: var(--surface-raised);
+  font-size: 8px;
+  font-weight: 600;
+  line-height: 1;
+  pointer-events: none;
+}
+
+.workflow-empty-add {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 34px;
+  gap: 7px;
+  padding: 0 13px;
+  border: 1px dashed color-mix(in srgb, var(--accent) 34%, var(--border-strong));
+  border-radius: 9px;
+  background: color-mix(in srgb, var(--surface-raised) 88%, transparent);
+  color: var(--text-secondary);
+  font-size: 10px;
+  font-weight: 520;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.035);
+}
+
+.workflow-empty-add:hover {
+  border-style: solid;
+  border-color: color-mix(in srgb, var(--accent) 58%, var(--border-strong));
+  background: var(--surface-raised);
+  color: var(--accent);
+}
+
+.workflow-empty-add svg {
+  width: 13px;
+  height: 13px;
+}
+
+.workflow-empty-add {
+  position: absolute;
+  z-index: 5;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.workflow-plan-list {
+  position: absolute;
+  inset: 77px 0 0;
+  min-height: 70px;
+  padding: 10px 30px 46px;
+  border-top: var(--border-hairline) solid var(--border);
+  border-radius: 0 0 11px 11px;
+  background: color-mix(in srgb, var(--surface-muted) 38%, var(--surface-raised));
+}
+
+.workflow-plan-list > p {
+  margin: 7px 0 0;
+  color: var(--text-tertiary);
+  font-size: 9px;
+  text-align: center;
+}
+
+.workflow-plan-add {
+  position: absolute;
+  right: 30px;
+  bottom: 10px;
+  left: 30px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 28px;
+  gap: 6px;
+  border: var(--border-hairline) dashed var(--border-strong);
+  border-radius: 7px;
+  background: color-mix(in srgb, var(--surface-raised) 84%, transparent);
+  color: var(--text-tertiary);
+  font-size: 9px;
+}
+
+.workflow-plan-add:hover {
+  border-style: solid;
+  border-color: color-mix(in srgb, var(--accent) 44%, var(--border-strong));
+  color: var(--accent);
+}
+
+.workflow-plan-add svg {
+  width: 12px;
+  height: 12px;
+}
+
+.workflow-plan-add-inline {
+  display: inline-flex;
+  align-items: center;
+  height: 22px;
+  gap: 4px;
+  padding: 0 6px;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-tertiary);
+  font-size: 8px;
+}
+
+.workflow-plan-add-inline:hover {
+  background: var(--surface-hover);
+  color: var(--node-tone);
+}
+
+.workflow-plan-add-inline svg {
+  width: 11px;
+  height: 11px;
+}
+
+.workflow-plan-item {
+  --node-tone: var(--accent);
+  position: relative;
+  display: grid;
+  grid-template-columns: 14px 24px minmax(0, 1fr);
+  align-items: center;
+  width: 300px;
+  height: 38px;
+  gap: 7px;
+  padding: 0 9px 0 7px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 7px;
+  background: var(--surface-raised);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.025);
+  transition:
+    border-color 100ms ease,
+    background-color 100ms ease,
+    box-shadow 100ms ease,
+    transform 170ms cubic-bezier(0.2, 0.8, 0.2, 1);
+}
+
+.workflow-plan-item:hover,
+.workflow-plan-item.selected {
+  border-color: color-mix(in srgb, var(--node-tone) 52%, var(--border-strong));
+}
+
+.workflow-plan-item.selected {
+  background: color-mix(in srgb, var(--node-tone) 5%, var(--surface-raised));
+}
+
+.workflow-plan-item-grip {
+  display: grid;
+  place-items: center;
+  color: var(--text-tertiary);
+  transform: rotate(90deg);
+  opacity: 0.58;
+}
+
+.workflow-plan-item-grip svg {
+  width: 12px;
+  height: 12px;
+}
+
+.workflow-plan-item .workflow-step-mark {
+  width: 24px;
+  height: 24px;
+  border-radius: 6px;
+}
+
+.workflow-plan-item .workflow-step-mark svg {
+  width: 12px;
+  height: 12px;
+}
+
+.workflow-plan-item .workflow-brand-logo {
+  width: 14px;
+  height: 14px;
+}
+
+.workflow-plan-item > strong {
+  overflow: hidden;
+  color: var(--text-primary);
+  font-size: 9px;
+  font-weight: 540;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-plan-item.is-dragging {
+  border-color: color-mix(in srgb, var(--node-tone) 72%, var(--border-strong));
+  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.13);
+  cursor: grabbing;
+}
+
+.workflow-plan-item.is-drag-shifted {
+  will-change: transform;
+}
+
+.workflow-plan-item.is-settling,
+.workflow-step-card.is-settling,
+.workflow-node.is-settling,
+.workflow-plan-container.is-settling {
+  animation: workflow-step-settle 200ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
+}
+
+.workflow-node.is-drag-shifted,
+.workflow-plan-container.is-drag-shifted {
+  will-change: transform;
+}
+
+.workflow-node.is-dragging,
+.workflow-plan-container.is-dragging {
+  border-color: color-mix(in srgb, var(--node-tone) 72%, var(--border-strong));
+  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.14);
+  cursor: grabbing;
+}
+
+.workflow-node-state.needs-config {
+  color: color-mix(in srgb, var(--warning) 76%, var(--text-secondary));
+}
+
+.workflow-node-state.needs-config i {
+  background: var(--warning);
+}
+
+@keyframes workflow-step-settle {
+  from {
+    opacity: 0.42;
+    transform: translateY(-4px) scale(0.98);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0) scale(1);
+  }
+}
+
+.workflow-flow-controls.react-flow__controls {
+  overflow: hidden;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 8px;
+  background: var(--surface-raised);
+  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.07);
+}
+
+.workflow-flow-controls .react-flow__controls-button {
+  width: 28px;
+  height: 28px;
+  border-bottom: var(--border-hairline) solid var(--border);
+  background: var(--surface-raised);
+  color: var(--text-secondary);
+}
+
+.workflow-flow-controls .react-flow__controls-button:hover {
+  background: var(--surface-hover);
+}
+
+.workflow-flow-controls .react-flow__controls-button svg {
+  max-width: 13px;
+  max-height: 13px;
+  fill: currentColor;
+}
+
+.workflow-step-picker-backdrop {
+  position: absolute;
+  z-index: 40;
+  inset: 0;
+  display: grid;
+  place-items: center;
+  padding: 24px;
+  background: color-mix(in srgb, var(--bg) 48%, transparent);
+  backdrop-filter: blur(2px);
+}
+
+.workflow-step-picker {
+  display: flex;
+  width: min(440px, calc(100vw - 48px));
+  max-height: min(620px, calc(100vh - 150px));
+  flex-direction: column;
+  overflow: hidden;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 13px;
+  background: var(--surface-raised);
+  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.19);
+}
+
+.workflow-step-picker-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex: 0 0 48px;
+  padding: 0 13px 0 16px;
+  border-bottom: var(--border-hairline) solid var(--border);
+}
+
+.workflow-step-picker-header strong {
+  color: var(--text-primary);
+  font-size: 12px;
+  font-weight: 590;
+}
+
+.workflow-step-picker-header button {
+  display: grid;
+  place-items: center;
+  width: 26px;
+  height: 26px;
+  border: 0;
+  border-radius: 6px;
+  background: transparent;
+  color: var(--text-tertiary);
+}
+
+.workflow-step-picker-header button:hover {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.workflow-step-picker-header svg {
+  width: 14px;
+  height: 14px;
+}
+
+.workflow-step-picker-search {
+  display: grid;
+  grid-template-columns: 17px minmax(0, 1fr);
+  align-items: center;
+  min-height: 40px;
+  gap: 8px;
+  margin: 12px 12px 8px;
+  padding: 0 11px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 8px;
+  background: var(--surface);
+  color: var(--text-tertiary);
+}
+
+.workflow-step-picker-search svg {
+  width: 15px;
+  height: 15px;
+}
+
+.workflow-step-picker-search input {
+  width: 100%;
+  height: 38px;
+  padding: 0;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: var(--text-primary);
+  font: inherit;
+  font-size: 11px;
+}
+
+.workflow-step-picker-search input::placeholder {
+  color: var(--text-tertiary);
+}
+
+.workflow-step-picker-groups {
+  flex: 1;
+  min-height: 0;
+  padding: 2px 8px 14px;
+  overflow-y: auto;
+  scrollbar-width: thin;
+}
+
+.workflow-step-picker-group {
+  padding-top: 8px;
+}
+
+.workflow-step-picker-group h3 {
+  margin: 0;
+  padding: 6px 8px;
+  color: var(--text-tertiary);
+  font-size: 8px;
+  font-weight: 620;
+  letter-spacing: 0.04em;
+}
+
+.workflow-step-picker-items {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 4px;
+}
+
+.workflow-step-picker-item {
+  display: grid;
+  grid-template-columns: 34px minmax(0, 1fr) 14px;
+  align-items: center;
+  min-width: 0;
+  min-height: 54px;
+  gap: 9px;
+  padding: 7px 8px;
+  border: var(--border-hairline) solid transparent;
+  border-radius: 8px;
+  background: transparent;
+  color: var(--text-primary);
+  text-align: left;
+}
+
+.workflow-step-picker-item:hover,
+.workflow-step-picker-item:focus-visible {
+  border-color: var(--border);
+  background: var(--surface-hover);
+}
+
+.workflow-step-picker-mark {
+  --node-tone: var(--accent);
+  width: 34px;
+  height: 34px;
+  border-radius: 8px;
+}
+
+.workflow-step-picker-mark.tone-issue {
+  --node-tone: #6e78df;
+}
+
+.workflow-step-picker-mark.tone-capability {
+  --node-tone: #4777d4;
+}
+
+.workflow-step-picker-mark.tone-api {
+  --node-tone: #2b8a66;
+}
+
+.workflow-step-picker-mark.tone-integration {
+  --node-tone: #2f7f9d;
+}
+
+.workflow-step-picker-mark.tone-development {
+  --node-tone: #c15f3c;
+}
+
+.workflow-step-picker-mark.tone-planning {
+  --node-tone: #b7791f;
+}
+
+.workflow-step-picker-mark.tone-result {
+  --node-tone: #a75ac4;
+}
+
+.workflow-step-picker-copy {
+  display: flex;
+  min-width: 0;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.workflow-step-picker-copy strong,
+.workflow-step-picker-copy > span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-step-picker-copy strong {
+  font-size: 10px;
+  font-weight: 550;
+}
+
+.workflow-step-picker-copy > span {
+  color: var(--text-tertiary);
+  font-size: 8px;
+}
+
+.workflow-step-picker-chevron {
+  width: 12px;
+  height: 12px;
+  color: var(--text-tertiary);
+  opacity: 0;
+}
+
+.workflow-step-picker-item:hover .workflow-step-picker-chevron {
+  opacity: 1;
+}
+
+.workflow-step-picker-empty {
+  margin: 42px 0;
+  color: var(--text-tertiary);
+  font-size: 10px;
+  text-align: center;
+}
+
+.workflow-inspector.workflow-step-inspector {
+  position: relative;
+  z-index: 14;
+  display: flex;
+  min-width: 0;
+  min-height: 0;
+  overflow: hidden;
+  border-left: var(--border-hairline) solid var(--border);
+  background: var(--surface-raised);
+  box-shadow: -8px 0 24px rgba(0, 0, 0, 0.025);
+}
+
+.workflow-inspector-content {
+  display: flex;
+  width: 100%;
+  min-height: 0;
+  flex-direction: column;
+  padding: 0;
+  overflow-y: auto;
+  scrollbar-width: thin;
+}
+
+.workflow-inspector-title {
+  --node-tone: var(--accent);
+  display: grid;
+  grid-template-columns: 34px minmax(0, 1fr) 28px;
+  align-items: center;
+  flex: 0 0 58px;
+  gap: 9px;
+  padding: 8px 10px 8px 12px;
+  border-bottom: var(--border-hairline) solid var(--border);
+}
+
+.workflow-inspector-title > span {
+  display: grid;
+  place-items: center;
+  width: 34px;
+  height: 34px;
+  border: var(--border-hairline) solid color-mix(in srgb, var(--node-tone) 28%, var(--border));
+  border-radius: 8px;
+  background: color-mix(in srgb, var(--node-tone) 8%, var(--surface));
+  color: var(--node-tone);
+}
+
+.workflow-inspector-title > span svg {
+  width: 16px;
+  height: 16px;
+}
+
+.workflow-inspector-title > span .workflow-brand-logo {
+  width: 20px;
+  height: 20px;
+}
+
+.workflow-inspector-title > div {
+  display: flex;
+  min-width: 0;
+  flex-direction: column;
+}
+
+.workflow-inspector-title small {
+  color: var(--node-tone);
+  font-size: 7px;
+  font-weight: 650;
+  letter-spacing: 0.06em;
+}
+
+.workflow-inspector-title strong {
+  overflow: hidden;
+  color: var(--text-primary);
+  font-size: 11px;
+  font-weight: 560;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-inspector-title .workflow-panel-toggle {
+  display: grid;
+  place-items: center;
+  width: 28px;
+  height: 28px;
+  border: 0;
+  border-radius: 7px;
+  background: transparent;
+  color: var(--text-tertiary);
+}
+
+.workflow-inspector-title .workflow-panel-toggle:hover {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.workflow-inspector-title .workflow-panel-toggle svg {
+  width: 14px;
+  height: 14px;
+}
+
+.workflow-inspector-tabs {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  flex: 0 0 40px;
+  padding: 5px 10px 0;
+  border-bottom: var(--border-hairline) solid var(--border);
+}
+
+.workflow-inspector-tabs > button {
+  position: relative;
+  border: 0;
+  background: transparent;
+  color: var(--text-tertiary);
+  font-size: 9px;
+  font-weight: 520;
+}
+
+.workflow-inspector-tabs > button:hover {
+  color: var(--text-primary);
+}
+
+.workflow-inspector-tabs > button.is-active {
+  color: var(--text-primary);
+}
+
+.workflow-inspector-tabs > button.is-active::after {
+  position: absolute;
+  right: 10px;
+  bottom: -1px;
+  left: 10px;
+  height: 2px;
+  border-radius: 2px 2px 0 0;
+  background: var(--accent);
+  content: "";
+}
+
+.workflow-inspector-content [role="tabpanel"] {
+  padding: 0 12px 22px;
+}
+
+.workflow-config-section {
+  padding: 13px 0;
+  border-top: var(--border-hairline) solid var(--border);
+}
+
+.workflow-inspector-content [role="tabpanel"] > .workflow-config-section:first-child {
+  border-top: 0;
+}
+
+.workflow-config-section h2 {
+  margin: 0 0 9px;
+  color: var(--text-secondary);
+  font-size: 9px;
+  font-weight: 560;
+}
+
+.workflow-config-section label {
+  display: flex;
+  flex-direction: column;
+  gap: 5px;
+  margin-top: 9px;
+  color: var(--text-tertiary);
+  font-size: 8px;
+}
+
+.workflow-config-section input,
+.workflow-config-section textarea,
+.workflow-config-section select {
+  width: 100%;
+  padding: 6px 7px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 6px;
+  outline: 0;
+  background: var(--surface);
+  color: var(--text-primary);
+  font-size: 9px;
+  line-height: 1.45;
+  resize: vertical;
+}
+
+.workflow-config-section input,
+.workflow-config-section select {
+  height: 30px;
+}
+
+.workflow-config-section input:disabled,
+.workflow-config-section select:disabled {
+  opacity: 0.48;
+}
+
+.workflow-action-row {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) 118px;
+  align-items: center;
+  gap: 8px;
+  margin-top: 9px;
+}
+
+.workflow-config-section .workflow-action-toggle {
+  display: inline-flex;
+  align-items: center;
+  flex-direction: row;
+  min-width: 0;
+  gap: 6px;
+  margin-top: 0;
+  color: var(--text-secondary);
+  font-size: 9px;
+}
+
+.workflow-config-section .workflow-action-toggle input[type="checkbox"] {
+  width: 12px;
+  height: 12px;
+  flex: 0 0 12px;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  border-radius: 3px;
+  accent-color: var(--accent);
+}
+
+.workflow-action-toggle-full {
+  margin-top: 10px !important;
+}
+
+.workflow-port-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  min-height: 28px;
+  color: var(--text-tertiary);
+  font-size: 9px;
+}
+
+.workflow-port-row > span {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.workflow-port-row i {
+  width: 7px;
+  height: 7px;
+  border: 1.5px solid var(--text-tertiary);
+  border-radius: 50%;
+}
+
+.workflow-port-row i.output {
+  border-color: var(--accent);
+  background: var(--accent);
+}
+
+.workflow-port-row strong {
+  color: var(--text-secondary);
+  font-size: 9px;
+  font-weight: 500;
+}
+
+.workflow-context-field {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto 12px;
+  align-items: center;
+  width: 100%;
+  min-height: 32px;
+  gap: 6px;
+  padding: 0 7px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 6px;
+  background: var(--surface);
+  color: var(--text-secondary);
+  font-size: 9px;
+  text-align: left;
+}
+
+.workflow-context-field > span {
+  display: inline-flex;
+  align-items: center;
+  min-width: 0;
+  gap: 6px;
+}
+
+.workflow-context-field strong {
+  max-width: 90px;
+  overflow: hidden;
+  color: var(--text-tertiary);
+  font-size: 8px;
+  font-weight: 450;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-context-field svg {
+  width: 12px;
+  height: 12px;
+}
+
+@media (max-width: 980px) {
+  .workflow-board.has-inspector {
+    grid-template-columns: minmax(0, 1fr) 320px;
+  }
+
+  .workflow-step-state {
+    display: none;
+  }
+}
+
+@media (max-width: 760px) {
+  .workflow-board {
+    position: relative;
+    display: block;
+  }
+
+  .workflow-canvas-shell {
+    width: 100%;
+    height: 100%;
+  }
+
+  .workflow-inspector.workflow-step-inspector {
+    position: absolute;
+    top: var(--workflow-titlebar-height);
+    right: 0;
+    bottom: 0;
+    width: min(360px, 92vw);
+    box-shadow: -16px 0 42px rgba(0, 0, 0, 0.14);
+  }
+
+  .workflow-toolbar-status > span {
+    display: none;
+  }
+}
diff --git a/apps/codex-taskboard/web/src/components/workflowCatalog.ts b/apps/codex-taskboard/web/src/components/workflowCatalog.ts
new file mode 100644
index 000000000..0cc611e75
--- /dev/null
+++ b/apps/codex-taskboard/web/src/components/workflowCatalog.ts
@@ -0,0 +1,934 @@
+import bytedanceLogo from "@lobehub/icons-static-svg/icons/bytedance-color.svg";
+import claudeLogo from "@lobehub/icons-static-svg/icons/claude-color.svg";
+import claudeCodeLogo from "@lobehub/icons-static-svg/icons/claudecode-color.svg";
+import cloudflareLogo from "@lobehub/icons-static-svg/icons/cloudflare-color.svg";
+import codexLogo from "@lobehub/icons-static-svg/icons/codex-color.svg";
+import geminiLogo from "@lobehub/icons-static-svg/icons/gemini-color.svg";
+import jimengLogo from "@lobehub/icons-static-svg/icons/jimeng-color.svg";
+import klingLogo from "@lobehub/icons-static-svg/icons/kling-color.svg";
+import mcpLogo from "@lobehub/icons-static-svg/icons/mcp.svg";
+import midjourneyLogo from "@lobehub/icons-static-svg/icons/midjourney.svg";
+import vercelLogo from "@lobehub/icons-static-svg/icons/vercel.svg";
+import xLogo from "../assets/x-logo-black.png";
+import type { WorkflowCapabilities } from "../types";
+import type { WorkflowNodeData } from "./WorkflowNode";
+export { WORKFLOW_TRIGGER_KINDS, isWorkflowTriggerKind } from "../../../shared/workflow-control-flow.mjs";
+
+export type WorkflowGroup =
+  | "触发器"
+  | "流程控制"
+  | "Skill 和 MCP"
+  | "API"
+  | "第三方集成"
+  | "开发"
+  | "规划"
+  | "结果";
+
+export interface PaletteItem {
+  group: WorkflowGroup;
+  title: string;
+  description: string;
+  data: WorkflowNodeData;
+}
+
+export const WORKFLOW_GROUPS: WorkflowGroup[] = [
+  "触发器",
+  "流程控制",
+  "Skill 和 MCP",
+  "API",
+  "第三方集成",
+  "开发",
+  "规划",
+  "结果",
+];
+
+export const GIT_OPERATIONS = [
+  { value: "status", label: "查看状态" },
+  { value: "commit", label: "提交更改" },
+  { value: "pull", label: "拉取更新" },
+  { value: "push", label: "推送分支" },
+  { value: "create-branch", label: "创建分支" },
+  { value: "switch-branch", label: "切换分支" },
+  { value: "merge-branch", label: "合并分支" },
+  { value: "create-worktree", label: "创建 Worktree" },
+] as const;
+
+export const ISSUE_STATUSES = [
+  { value: "backlog", label: "积压事项" },
+  { value: "todo", label: "待办事项" },
+  { value: "in_progress", label: "进行中" },
+  { value: "in_review", label: "审核中" },
+  { value: "blocked", label: "已阻塞" },
+  { value: "done", label: "完成" },
+  { value: "canceled", label: "已取消" },
+] as const;
+
+export const ISSUE_PRIORITIES = [
+  { value: "none", label: "无优先级" },
+  { value: "urgent", label: "紧急" },
+  { value: "high", label: "高" },
+  { value: "medium", label: "中" },
+  { value: "low", label: "低" },
+] as const;
+
+export const CONDITION_FIELDS = [
+  {
+    value: "issue-status",
+    label: "任务状态",
+    operators: ["equals", "not-equals"],
+    defaultOperator: "equals",
+    defaultValue: "todo",
+  },
+  {
+    value: "issue-priority",
+    label: "任务优先级",
+    operators: ["equals", "not-equals"],
+    defaultOperator: "equals",
+    defaultValue: "none",
+  },
+  {
+    value: "issue-labels",
+    label: "任务标签",
+    operators: ["contains", "not-contains"],
+    defaultOperator: "contains",
+    defaultValue: "",
+  },
+  {
+    value: "upstream-output",
+    label: "上游节点输出",
+    operators: ["equals", "not-equals", "contains", "not-contains"],
+    defaultOperator: "equals",
+    defaultValue: "",
+  },
+] as const;
+
+export const CONDITION_OPERATORS = [
+  { value: "equals", label: "等于" },
+  { value: "not-equals", label: "不等于" },
+  { value: "contains", label: "包含" },
+  { value: "not-contains", label: "不包含" },
+] as const;
+
+export const FEISHU_MESSAGE_RECIPIENTS = [
+  { value: "self", label: "发送给自己" },
+  { value: "user", label: "发送给特定用户" },
+  { value: "chat", label: "发送到群聊" },
+] as const;
+
+export const CODE_RUNTIMES = [
+  { value: "shell", label: "Shell" },
+  { value: "javascript", label: "JavaScript" },
+  { value: "python", label: "Python" },
+] as const;
+
+export const TEST_SCOPES = [
+  { value: "related", label: "相关测试" },
+  { value: "all", label: "全部测试" },
+  { value: "custom", label: "自定义命令" },
+] as const;
+
+const FEISHU_LOGO = "https://p1-hera.feishucdn.com/tos-cn-i-jbbdkfciu3/84a9f036fe2b44f99b899fff4beeb963~tplv-jbbdkfciu3-image:0:0.image";
+const GIT_LOGO = "https://git-scm.com/images/logos/downloads/Git-Icon-1788C.svg";
+
+export const PALETTE_ITEMS: PaletteItem[] = [
+  {
+    group: "触发器",
+    title: "Issue",
+    description: "当任务变化时启动流程",
+    data: {
+      kind: "issue-trigger",
+      eyebrow: "ISSUE TRIGGER",
+      title: "任务触发器",
+      description: "当任务满足条件时启动",
+      meta: "状态、标签或优先级",
+      icon: "myIssues",
+      tone: "issue",
+      outputLabel: "任务",
+      triggerStatus: "todo",
+    },
+  },
+  {
+    group: "触发器",
+    title: "RSS 订阅更新",
+    description: "RSS 订阅发布新内容时启动流程",
+    data: {
+      kind: "rss-trigger",
+      eyebrow: "RSS TRIGGER",
+      title: "RSS 订阅更新",
+      description: "指定的 RSS 订阅发布新内容时触发",
+      meta: "尚未设置 RSS 订阅地址",
+      icon: "recurrence",
+      tone: "issue",
+      outputLabel: "订阅条目",
+      rssFeedUrl: "",
+    },
+  },
+  {
+    group: "触发器",
+    title: "PR 提交",
+    description: "当前项目仓库提交 PR 时启动流程",
+    data: {
+      kind: "pull-request-submitted-trigger",
+      eyebrow: "PR TRIGGER",
+      title: "PR 提交",
+      description: "当前项目仓库提交新的 Pull Request 时触发",
+      meta: "当前项目仓库 · Pull Request",
+      icon: "branch",
+      tone: "issue",
+      outputLabel: "Pull Request",
+    },
+  },
+  {
+    group: "触发器",
+    title: "Issue 提交",
+    description: "当前项目仓库提交 Issue 时启动流程",
+    data: {
+      kind: "repository-issue-submitted-trigger",
+      eyebrow: "ISSUE TRIGGER",
+      title: "Issue 提交",
+      description: "当前项目仓库提交新的 Issue 时触发",
+      meta: "当前项目仓库 · Issue",
+      icon: "createIssue",
+      tone: "issue",
+      outputLabel: "Issue",
+    },
+  },
+  {
+    group: "触发器",
+    title: "Git 状态",
+    description: "当前项目的 Git 工作区状态变化时启动流程",
+    data: {
+      kind: "git-status-trigger",
+      eyebrow: "GIT TRIGGER",
+      title: "Git 状态",
+      description: "当前项目的 Git 工作区状态发生变化时触发",
+      meta: "当前项目 · Git 工作区",
+      icon: "branch",
+      logo: GIT_LOGO,
+      tone: "issue",
+      outputLabel: "Git 状态",
+    },
+  },
+  {
+    group: "流程控制",
+    title: "条件判断",
+    description: "根据判断结果进入对应路径",
+    data: {
+      kind: "condition",
+      eyebrow: "CONDITION",
+      title: "条件判断",
+      description: "根据判断结果进入对应路径",
+      meta: "配置一个判断规则",
+      icon: "filter",
+      tone: "planning",
+      inputLabel: "待判断数据",
+      outputLabel: "符合条件的数据",
+      conditionField: "issue-status",
+      conditionOperator: "equals",
+      conditionValue: "todo",
+    },
+  },
+  {
+    group: "Skill 和 MCP",
+    title: "Skill",
+    description: "调用已安装的 Skill",
+    data: {
+      kind: "skill",
+      eyebrow: "SKILL",
+      title: "调用 Skill",
+      description: "运行工作区中的 Skill",
+      meta: "选择一个 Skill",
+      icon: "file",
+      tone: "capability",
+      inputLabel: "上下文",
+      outputLabel: "输出",
+    },
+  },
+  {
+    group: "Skill 和 MCP",
+    title: "MCP",
+    description: "调用 MCP 工具或资源",
+    data: {
+      kind: "mcp",
+      eyebrow: "MCP",
+      title: "调用 MCP",
+      description: "连接已配置的 MCP Server",
+      meta: "选择一个 MCP Server",
+      icon: "panel",
+      logo: mcpLogo,
+      logoMonochrome: true,
+      tone: "capability",
+      inputLabel: "参数",
+      outputLabel: "结果",
+    },
+  },
+  {
+    group: "API",
+    title: "Nano Banana 生图",
+    description: "调用 Gemini 图像生成能力",
+    data: {
+      kind: "nano-banana",
+      eyebrow: "IMAGE API",
+      title: "Nano Banana 生图",
+      description: "根据提示词和参考图生成图像",
+      meta: "Google Gemini · Image",
+      icon: "send",
+      logo: geminiLogo,
+      tone: "api",
+      inputLabel: "提示词",
+      outputLabel: "图像",
+    },
+  },
+  {
+    group: "API",
+    title: "即梦生图",
+    description: "调用即梦 AI 图片生成",
+    data: {
+      kind: "jimeng-image",
+      eyebrow: "IMAGE API",
+      title: "即梦生图",
+      description: "使用即梦模型生成图片素材",
+      meta: "即梦 AI · Image",
+      icon: "send",
+      logo: jimengLogo,
+      tone: "api",
+      inputLabel: "提示词",
+      outputLabel: "图像",
+    },
+  },
+  {
+    group: "API",
+    title: "Midjourney 生图",
+    description: "提交 Midjourney 生成任务",
+    data: {
+      kind: "midjourney-image",
+      eyebrow: "IMAGE API",
+      title: "Midjourney 生图",
+      description: "通过 Midjourney 生成图片素材",
+      meta: "Midjourney · Image",
+      icon: "send",
+      logo: midjourneyLogo,
+      logoMonochrome: true,
+      tone: "api",
+      inputLabel: "提示词",
+      outputLabel: "图像",
+    },
+  },
+  {
+    group: "API",
+    title: "Seedance 2.0 生视频",
+    description: "调用字节跳动视频生成模型",
+    data: {
+      kind: "seedance-video",
+      eyebrow: "VIDEO API",
+      title: "Seedance 2.0 生视频",
+      description: "生成多模态音视频内容",
+      meta: "ByteDance Seed · Video",
+      icon: "send",
+      logo: bytedanceLogo,
+      tone: "api",
+      inputLabel: "素材与提示词",
+      outputLabel: "视频",
+    },
+  },
+  {
+    group: "API",
+    title: "可灵生视频",
+    description: "调用可灵 AI 视频生成",
+    data: {
+      kind: "kling-video",
+      eyebrow: "VIDEO API",
+      title: "可灵生视频",
+      description: "使用可灵模型生成视频素材",
+      meta: "Kling AI · Video",
+      icon: "send",
+      logo: klingLogo,
+      tone: "api",
+      inputLabel: "素材与提示词",
+      outputLabel: "视频",
+    },
+  },
+  {
+    group: "API",
+    title: "自定义 API 节点",
+    description: "配置任意 HTTP API",
+    data: {
+      kind: "custom-api",
+      eyebrow: "HTTP API",
+      title: "自定义 API 节点",
+      description: "调用自定义 HTTP 接口",
+      meta: "GET、POST、PUT",
+      icon: "send",
+      tone: "api",
+      inputLabel: "请求",
+      outputLabel: "响应",
+    },
+  },
+  {
+    group: "第三方集成",
+    title: "Git",
+    description: "读取仓库、分支与变更信息",
+    data: {
+      kind: "git",
+      eyebrow: "INTEGRATION",
+      title: "Git",
+      description: "读取或操作当前项目的 Git 仓库",
+      meta: "Git · Repository",
+      icon: "branch",
+      logo: GIT_LOGO,
+      tone: "integration",
+      inputLabel: "仓库与操作",
+      outputLabel: "Git 结果",
+      gitOperation: "commit",
+      gitCommitMessage: "",
+      gitStageAll: true,
+      gitRemote: "origin",
+      gitBranchName: "",
+      gitBaseBranch: "",
+      gitWorktreePath: "",
+    },
+  },
+  {
+    group: "第三方集成",
+    title: "飞书文档",
+    description: "读取或写入飞书云文档",
+    data: {
+      kind: "feishu-docs",
+      eyebrow: "INTEGRATION",
+      title: "飞书文档",
+      description: "连接飞书文档与知识空间",
+      meta: "飞书开放平台 · Docs",
+      icon: "file",
+      logo: FEISHU_LOGO,
+      tone: "integration",
+      inputLabel: "文档参数",
+      outputLabel: "文档内容",
+    },
+  },
+  {
+    group: "第三方集成",
+    title: "飞书消息",
+    description: "发送消息给自己、用户或群聊",
+    data: {
+      kind: "feishu-message",
+      eyebrow: "INTEGRATION",
+      title: "飞书消息",
+      description: "通过飞书开放平台发送消息",
+      meta: "飞书开放平台 · IM",
+      icon: "conversation",
+      logo: FEISHU_LOGO,
+      tone: "integration",
+      inputLabel: "消息内容",
+      outputLabel: "消息回执",
+      feishuRecipientType: "self",
+      feishuUserId: "",
+      feishuChatId: "",
+    },
+  },
+  {
+    group: "第三方集成",
+    title: "发布到 Twitter",
+    description: "将内容发布到 Twitter",
+    data: {
+      kind: "twitter-post",
+      eyebrow: "INTEGRATION",
+      title: "发布到 Twitter",
+      description: "将指定内容发布到 Twitter",
+      meta: "尚未填写发布内容",
+      icon: "send",
+      logo: xLogo,
+      logoMonochrome: true,
+      tone: "integration",
+      inputLabel: "发布内容",
+      outputLabel: "发布结果",
+      twitterPostContent: "",
+    },
+  },
+  {
+    group: "第三方集成",
+    title: "OpenCLI",
+    description: "调用网站适配器和登录态浏览器",
+    data: {
+      kind: "opencli",
+      eyebrow: "INTEGRATION",
+      title: "OpenCLI",
+      description: "通过 OpenCLI 操作网站与本地工具",
+      meta: "OpenCLI · Browser",
+      icon: "panel",
+      tone: "integration",
+      inputLabel: "命令",
+      outputLabel: "执行结果",
+    },
+  },
+  {
+    group: "第三方集成",
+    title: "Claude Design 设计",
+    description: "调用 Claude 生成设计方案",
+    data: {
+      kind: "claude-design",
+      eyebrow: "INTEGRATION",
+      title: "Claude Design 设计",
+      description: "使用 Claude 完成设计与实现",
+      meta: "Claude · Design",
+      icon: "write",
+      logo: claudeLogo,
+      tone: "integration",
+      inputLabel: "设计需求",
+      outputLabel: "设计结果",
+    },
+  },
+  {
+    group: "第三方集成",
+    title: "Cloudflare 部署",
+    description: "部署 Workers、Pages 等服务",
+    data: {
+      kind: "cloudflare-deploy",
+      eyebrow: "DEPLOYMENT",
+      title: "Cloudflare 部署",
+      description: "构建并部署到 Cloudflare",
+      meta: "Workers · Pages",
+      icon: "send",
+      logo: cloudflareLogo,
+      tone: "integration",
+      inputLabel: "构建产物",
+      outputLabel: "部署地址",
+    },
+  },
+  {
+    group: "第三方集成",
+    title: "Vercel 部署",
+    description: "部署项目并返回预览地址",
+    data: {
+      kind: "vercel-deploy",
+      eyebrow: "DEPLOYMENT",
+      title: "Vercel 部署",
+      description: "构建并部署到 Vercel",
+      meta: "Preview · Production",
+      icon: "send",
+      logo: vercelLogo,
+      logoMonochrome: true,
+      tone: "integration",
+      inputLabel: "构建产物",
+      outputLabel: "部署地址",
+    },
+  },
+  {
+    group: "第三方集成",
+    title: "自定义集成",
+    description: "连接其他第三方服务",
+    data: {
+      kind: "custom-integration",
+      eyebrow: "INTEGRATION",
+      title: "自定义集成",
+      description: "通过授权或 Webhook 连接服务",
+      meta: "OAuth · Webhook",
+      icon: "link",
+      tone: "integration",
+      inputLabel: "集成参数",
+      outputLabel: "执行结果",
+    },
+  },
+  {
+    group: "开发",
+    title: "自定义代码",
+    description: "使用自定义脚本处理流程数据",
+    data: {
+      kind: "custom-code",
+      eyebrow: "CODE",
+      title: "自定义代码",
+      description: "在当前项目上下文中运行自定义代码",
+      meta: "运行环境 · Shell",
+      icon: "panel",
+      tone: "development",
+      inputLabel: "流程数据",
+      outputLabel: "代码输出",
+      codeRuntime: "shell",
+      codeContent: "",
+    },
+  },
+  {
+    group: "开发",
+    title: "写测试",
+    description: "根据当前任务和项目上下文编写测试",
+    data: {
+      kind: "write-tests",
+      eyebrow: "TEST",
+      title: "写测试",
+      description: "根据当前任务和项目上下文编写测试",
+      meta: "当前项目 · 测试",
+      icon: "write",
+      tone: "development",
+      inputLabel: "任务上下文",
+      outputLabel: "测试代码",
+    },
+  },
+  {
+    group: "开发",
+    title: "运行测试",
+    description: "运行相关测试、全部测试或自定义命令",
+    data: {
+      kind: "run-tests",
+      eyebrow: "TEST",
+      title: "运行测试",
+      description: "在当前项目中运行测试",
+      meta: "测试范围 · 相关测试",
+      icon: "check",
+      tone: "development",
+      inputLabel: "项目变更",
+      outputLabel: "测试结果",
+      testScope: "related",
+      testCommand: "",
+    },
+  },
+  {
+    group: "规划",
+    title: "基础规划",
+    description: "拆解步骤、依赖和验收条件",
+    data: {
+      kind: "basic-planning",
+      eyebrow: "PLANNING",
+      title: "基础规划",
+      description: "根据任务生成结构化执行计划",
+      meta: "内置规划器",
+      icon: "dashboard",
+      tone: "planning",
+      inputLabel: "任务上下文",
+      outputLabel: "执行计划",
+      acceptsChildren: true,
+    },
+  },
+  {
+    group: "规划",
+    title: "Claude Code 规划",
+    description: "使用 Claude Code 生成计划",
+    data: {
+      kind: "claude-code-planning",
+      eyebrow: "PLANNING",
+      title: "Claude Code 规划",
+      description: "让 Claude Code 分析并规划任务",
+      meta: "Claude Code · Plan",
+      icon: "dashboard",
+      logo: claudeCodeLogo,
+      tone: "planning",
+      inputLabel: "任务上下文",
+      outputLabel: "执行计划",
+      claudeModel: "claude-sonnet",
+      reasoningEffort: "high",
+      planningRequirements: "分析依赖、风险、执行步骤和验收条件，输出可直接执行的计划。",
+    },
+  },
+  {
+    group: "规划",
+    title: "自定义规划",
+    description: "通过自定义提示词生成计划",
+    data: {
+      kind: "custom-planning",
+      eyebrow: "PLANNING",
+      title: "自定义规划",
+      description: "使用自定义规则拆解任务",
+      meta: "Prompt · 自定义",
+      icon: "write",
+      tone: "planning",
+      inputLabel: "任务上下文",
+      outputLabel: "执行计划",
+    },
+  },
+  {
+    group: "结果",
+    title: "添加 ISSUE",
+    description: "在当前项目中创建新任务",
+    data: {
+      kind: "issue-create",
+      eyebrow: "ISSUE ACTION",
+      title: "添加 ISSUE",
+      description: "在当前流程所属项目中创建任务",
+      meta: "待填写任务标题",
+      icon: "createIssue",
+      tone: "result",
+      inputLabel: "流程上下文",
+      outputLabel: "新任务",
+      createIssueTitle: "",
+      createIssueDescription: "",
+      createIssueStatus: "todo",
+      createIssuePriority: "none",
+      createIssueLabels: "",
+    },
+  },
+  {
+    group: "结果",
+    title: "更新 Issue",
+    description: "回写状态、评论和附件",
+    data: {
+      kind: "issue-update",
+      eyebrow: "ISSUE ACTION",
+      title: "更新任务",
+      description: "把流程结果写回任务",
+      meta: "状态、评论或附件",
+      icon: "write",
+      tone: "result",
+      inputLabel: "流程结果",
+      outputLabel: "已更新",
+      issueTarget: "trigger",
+      specificIssueId: "",
+      changeStatus: true,
+      targetStatus: "in_review",
+      addComment: true,
+      commentSource: "workflow-output",
+      customComment: "",
+      addLabels: false,
+      labelsToAdd: "",
+      setPriority: false,
+      targetPriority: "none",
+      attachArtifacts: true,
+      recordConversation: true,
+    },
+  },
+  {
+    group: "结果",
+    title: "Codex 审核",
+    description: "由 Codex 审核结果和变更",
+    data: {
+      kind: "codex-review",
+      eyebrow: "REVIEW",
+      title: "Codex 审核",
+      description: "检查实现结果、测试与验收条件",
+      meta: "Codex · Review",
+      icon: "check",
+      logo: codexLogo,
+      tone: "result",
+      inputLabel: "执行结果",
+      outputLabel: "审核结论",
+    },
+  },
+  {
+    group: "结果",
+    title: "Claude Code 审核",
+    description: "由 Claude Code 审核结果和变更",
+    data: {
+      kind: "claude-code-review",
+      eyebrow: "REVIEW",
+      title: "Claude Code 审核",
+      description: "使用 Claude Code 复核实现结果",
+      meta: "Claude Code · Review",
+      icon: "check",
+      logo: claudeCodeLogo,
+      tone: "result",
+      inputLabel: "执行结果",
+      outputLabel: "审核结论",
+      claudeModel: "claude-sonnet",
+      reasoningEffort: "high",
+      planningRequirements: "对照执行计划和验收条件复核变更、测试结果与潜在回归。",
+    },
+  },
+];
+
+export function paletteData(kind: string): WorkflowNodeData {
+  return PALETTE_ITEMS.find((item) => item.data.kind === kind)!.data;
+}
+
+export function optionLabel(
+  options: readonly { value: string; label: string }[],
+  value: string | undefined,
+): string {
+  return options.find((option) => option.value === value)?.label ?? "";
+}
+
+export function selectedCapabilityValue(
+  options: readonly { id: string }[],
+  value: string | undefined,
+): string {
+  return value && options.some((option) => option.id === value) ? value : "";
+}
+
+export function capabilityNodeMeta(
+  data: WorkflowNodeData,
+  capabilities: WorkflowCapabilities | null,
+  failed: boolean,
+): string {
+  if (data.kind === "issue-create") {
+    const status = optionLabel(ISSUE_STATUSES, data.createIssueStatus ?? "todo");
+    const priority = optionLabel(ISSUE_PRIORITIES, data.createIssuePriority ?? "none");
+    return `初始状态 · ${status} · 优先级 ${priority}`;
+  }
+  if (data.kind === "rss-trigger") {
+    const source = rssSourceLabel(data.rssFeedUrl);
+    return source ? `RSS · ${source}` : "尚未设置 RSS 订阅地址";
+  }
+  if (data.kind === "twitter-post") {
+    const content = data.twitterPostContent?.trim();
+    return content ? `发布内容 · ${twitterPostSummary(content)}` : "尚未填写发布内容";
+  }
+  if (data.kind === "custom-code") {
+    return `运行环境 · ${optionLabel(CODE_RUNTIMES, data.codeRuntime ?? "shell")}`;
+  }
+  if (data.kind === "run-tests") {
+    return `测试范围 · ${optionLabel(TEST_SCOPES, data.testScope ?? "related")}`;
+  }
+  if (data.kind === "skill") {
+    if (!capabilities) return "正在读取可用 Skill";
+    if (failed) return "无法读取可用 Skill";
+    const skill = capabilities.skills.find((option) => option.id === data.selectedSkill);
+    if (skill) return `${skill.label} · Skill`;
+    return data.selectedSkill ? "所选 Skill 当前不可用" : "尚未选择 Skill";
+  }
+  if (data.kind === "mcp") {
+    if (!capabilities) return "正在读取可用 MCP Server";
+    if (failed) return "无法读取可用 MCP Server";
+    const server = capabilities.mcpServers.find((option) => option.id === data.selectedMcpServer);
+    if (server) return `${server.label} · ${server.transport}`;
+    return data.selectedMcpServer ? "所选 MCP Server 当前不可用" : "尚未选择 MCP Server";
+  }
+  return data.meta;
+}
+
+function formatActionTitle(title: string, actions: string[]): string {
+  if (actions.length === 0) return title;
+  const visibleActions = actions.slice(0, 2).join("、");
+  const remaining = actions.length > 2 ? ` +${actions.length - 2}` : "";
+  return `${title} · ${visibleActions}${remaining}`;
+}
+
+function rssSourceLabel(value: string | undefined): string {
+  const feedUrl = value?.trim();
+  if (!feedUrl) return "";
+  return feedUrl.replace(/^https?:\/\//i, "").split(/[/?#]/)[0] || feedUrl;
+}
+
+function twitterPostSummary(value: string): string {
+  const normalized = value.replace(/\s+/g, " ").trim();
+  return normalized.length > 36 ? `${normalized.slice(0, 36)}…` : normalized;
+}
+
+export function workflowNodeDisplayTitle(data: WorkflowNodeData): string {
+  if (data.kind === "issue-create") {
+    const issueTitle = data.createIssueTitle?.trim();
+    return formatActionTitle(data.title, issueTitle ? [issueTitle] : []);
+  }
+  if (data.kind === "rss-trigger") {
+    const source = rssSourceLabel(data.rssFeedUrl);
+    return formatActionTitle(data.title, source ? [source] : []);
+  }
+  if (data.kind === "twitter-post") {
+    const content = data.twitterPostContent?.trim();
+    return formatActionTitle(data.title, content ? [twitterPostSummary(content)] : []);
+  }
+  if (data.kind === "condition") {
+    const field = CONDITION_FIELDS.find(
+      (option) => option.value === data.conditionField,
+    ) ?? CONDITION_FIELDS[0];
+    const operatorValue = field.operators.find(
+      (value) => value === data.conditionOperator,
+    ) ?? field.defaultOperator;
+    const value = data.conditionValue || field.defaultValue;
+    const valueLabel = field.value === "issue-status"
+      ? optionLabel(ISSUE_STATUSES, value)
+      : field.value === "issue-priority"
+        ? optionLabel(ISSUE_PRIORITIES, value)
+        : value;
+    return formatActionTitle(data.title, [
+      `${field.label} ${optionLabel(CONDITION_OPERATORS, operatorValue)} ${valueLabel || "未设置"}`,
+    ]);
+  }
+  if (data.kind === "feishu-message") {
+    return formatActionTitle(data.title, [
+      optionLabel(FEISHU_MESSAGE_RECIPIENTS, data.feishuRecipientType ?? "self"),
+    ]);
+  }
+  if (data.kind === "git") {
+    return formatActionTitle(data.title, [
+      optionLabel(GIT_OPERATIONS, data.gitOperation ?? "commit"),
+    ]);
+  }
+  if (data.kind === "custom-code") {
+    return formatActionTitle(data.title, [
+      optionLabel(CODE_RUNTIMES, data.codeRuntime ?? "shell"),
+    ]);
+  }
+  if (data.kind === "run-tests") {
+    return formatActionTitle(data.title, [
+      optionLabel(TEST_SCOPES, data.testScope ?? "related"),
+    ]);
+  }
+  if (data.kind === "issue-trigger") {
+    const status = optionLabel(ISSUE_STATUSES, data.triggerStatus ?? "todo");
+    return formatActionTitle(data.title, [`进入${status}`]);
+  }
+  if (data.kind === "issue-update") {
+    const actions = [
+      data.changeStatus
+        ? `状态 → ${optionLabel(ISSUE_STATUSES, data.targetStatus ?? "in_review")}`
+        : "",
+      data.addComment ? "添加评论" : "",
+      data.addLabels ? "添加标签" : "",
+      data.setPriority
+        ? `优先级 → ${optionLabel(ISSUE_PRIORITIES, data.targetPriority ?? "none")}`
+        : "",
+      data.attachArtifacts ? "附加产物" : "",
+      data.recordConversation ? "记录对话" : "",
+    ].filter(Boolean);
+    return formatActionTitle(data.title, actions);
+  }
+  return data.title;
+}
+
+export function workflowNodeConfigured(
+  data: WorkflowNodeData,
+  capabilities: WorkflowCapabilities | null,
+  failed: boolean,
+): boolean {
+  if (data.kind === "issue-create") {
+    return Boolean(data.createIssueTitle?.trim());
+  }
+  if (data.kind === "rss-trigger") {
+    return Boolean(data.rssFeedUrl?.trim());
+  }
+  if (data.kind === "twitter-post") {
+    return Boolean(data.twitterPostContent?.trim());
+  }
+  if (data.kind === "condition") {
+    const field = CONDITION_FIELDS.find(
+      (option) => option.value === data.conditionField,
+    ) ?? CONDITION_FIELDS[0];
+    if (!field.operators.some((operator) => operator === data.conditionOperator)) return false;
+    if (field.value === "issue-status") {
+      return ISSUE_STATUSES.some((status) => status.value === data.conditionValue);
+    }
+    if (field.value === "issue-priority") {
+      return ISSUE_PRIORITIES.some((priority) => priority.value === data.conditionValue);
+    }
+    return Boolean(data.conditionValue?.trim());
+  }
+  if (data.kind === "feishu-message") {
+    if (data.feishuRecipientType === "user") return Boolean(data.feishuUserId?.trim());
+    if (data.feishuRecipientType === "chat") return Boolean(data.feishuChatId?.trim());
+    return true;
+  }
+  if (data.kind === "custom-code") {
+    return Boolean(data.codeContent?.trim());
+  }
+  if (data.kind === "run-tests") {
+    if (data.testScope === "custom") return Boolean(data.testCommand?.trim());
+    return true;
+  }
+  if (data.kind === "skill") {
+    return !failed
+      && Boolean(data.selectedSkill)
+      && Boolean(capabilities?.skills.some((item) => item.id === data.selectedSkill));
+  }
+  if (data.kind === "mcp") {
+    return !failed
+      && Boolean(data.selectedMcpServer)
+      && Boolean(capabilities?.mcpServers.some((item) => item.id === data.selectedMcpServer));
+  }
+  if (data.kind === "issue-update") {
+    return Boolean(
+      data.changeStatus
+      || data.addComment
+      || data.addLabels
+      || data.setPriority
+      || data.attachArtifacts
+      || data.recordConversation,
+    );
+  }
+  return true;
+}
diff --git a/apps/codex-taskboard/web/src/issueRoute.ts b/apps/codex-taskboard/web/src/issueRoute.ts
new file mode 100644
index 000000000..a610ccf75
--- /dev/null
+++ b/apps/codex-taskboard/web/src/issueRoute.ts
@@ -0,0 +1,22 @@
+const ISSUE_QUERY_PARAM = "issue";
+
+export function readIssueIdentifier(search: string): string | null {
+  const identifier = new URLSearchParams(search).get(ISSUE_QUERY_PARAM)?.trim().toUpperCase();
+  return identifier || null;
+}
+
+export function buildIssueUrl(
+  href: string,
+  projectId: string | null,
+  issueIdentifier: string | null,
+): URL {
+  const url = new URL(href);
+
+  if (projectId) url.searchParams.set("project", projectId);
+  else url.searchParams.delete("project");
+
+  if (issueIdentifier) url.searchParams.set(ISSUE_QUERY_PARAM, issueIdentifier.trim().toUpperCase());
+  else url.searchParams.delete(ISSUE_QUERY_PARAM);
+
+  return url;
+}
diff --git a/apps/codex-taskboard/web/src/labels.ts b/apps/codex-taskboard/web/src/labels.ts
new file mode 100644
index 000000000..8e3e812ca
--- /dev/null
+++ b/apps/codex-taskboard/web/src/labels.ts
@@ -0,0 +1,17 @@
+export const DEFAULT_LABELS = [
+  { name: "缺陷", color: "#eb5757" },
+  { name: "特性", color: "#bb87fc" },
+  { name: "for-claude", color: "#5b8cff" },
+  { name: "hold", color: "#d99b25" },
+  { name: "改进", color: "#4ea7fc" },
+  { name: "phase-1", color: "#1d4ed8" },
+  { name: "phase-2", color: "#0f766e" },
+  { name: "phase-3", color: "#7c3aed" },
+  { name: "phase-4", color: "#b45309" },
+  { name: "phase-5", color: "#be123c" },
+  { name: "phase-6", color: "#475569" },
+] as const;
+
+export function labelColor(name: string): string {
+  return DEFAULT_LABELS.find((label) => label.name === name)?.color ?? "#8b8d92";
+}
diff --git a/apps/codex-taskboard/web/src/main.tsx b/apps/codex-taskboard/web/src/main.tsx
new file mode 100644
index 000000000..98911296d
--- /dev/null
+++ b/apps/codex-taskboard/web/src/main.tsx
@@ -0,0 +1,10 @@
+import { StrictMode } from "react";
+import { createRoot } from "react-dom/client";
+import { App } from "./App";
+import "./styles.css";
+
+createRoot(document.getElementById("root")!).render(
+  <StrictMode>
+    <App />
+  </StrictMode>,
+);
diff --git a/apps/codex-taskboard/web/src/revisionPolling.mjs b/apps/codex-taskboard/web/src/revisionPolling.mjs
new file mode 100644
index 000000000..6f1b9ef49
--- /dev/null
+++ b/apps/codex-taskboard/web/src/revisionPolling.mjs
@@ -0,0 +1,48 @@
+export function getRevisionPollingInterval(metadata) {
+  if (metadata?.mode !== "cloud" || metadata.realtime?.transport !== "poll") return null;
+  return metadata.realtime.intervalMs;
+}
+
+export function createRevisionPoller({
+  fetchRevision,
+  onInvalidate,
+  intervalMs = 2000,
+  setInterval: scheduleInterval = globalThis.setInterval,
+  clearInterval: cancelInterval = globalThis.clearInterval,
+}) {
+  let revision = 0;
+  let timer;
+  let running = false;
+  let requestPending = false;
+
+  async function poll() {
+    if (!running || requestPending) return;
+    requestPending = true;
+    try {
+      const result = await fetchRevision(revision);
+      if (!running) return;
+      const advanced = result.revision > revision;
+      revision = Math.max(revision, result.revision);
+      if (result.changed && advanced) onInvalidate();
+    } catch {
+      // Keep the current revision so the next interval retries the same boundary.
+    } finally {
+      requestPending = false;
+    }
+  }
+
+  return {
+    start() {
+      if (running) return;
+      running = true;
+      timer = scheduleInterval(poll, intervalMs);
+      void poll();
+    },
+    stop() {
+      if (!running) return;
+      running = false;
+      cancelInterval(timer);
+      timer = undefined;
+    },
+  };
+}
diff --git a/apps/codex-taskboard/web/src/styles.css b/apps/codex-taskboard/web/src/styles.css
new file mode 100644
index 000000000..cc63afb08
--- /dev/null
+++ b/apps/codex-taskboard/web/src/styles.css
@@ -0,0 +1,9459 @@
+@font-face {
+  font-family: "Inter Variable";
+  src: url("/InterVariable.woff2") format("woff2");
+  font-style: normal;
+  font-weight: 100 900;
+  font-display: swap;
+}
+
+:root {
+  color-scheme: light;
+  font-family: "Inter Variable", "PingFang SC", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  font-synthesis: none;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  --bg: #fcfcfd;
+  --header-bg: #fcfcfd;
+  --sidebar-bg: #f3f3f4;
+  --surface: #ffffff;
+  --surface-raised: #ffffff;
+  --surface-muted: #f3f3f4;
+  --surface-hover: #f6f6f7;
+  --surface-active: #ececed;
+  --column-header: #f8f8fa;
+  --text-primary: #1b1b1b;
+  --text-secondary: #5d5d5f;
+  --text-tertiary: #9e9ea1;
+  --text-quaternary: #b5b5b7;
+  --border: #e1e1e1;
+  --border-strong: #d5d5d5;
+  --border-hairline: 0.5px;
+  --accent: #5e6ad2;
+  --accent-hover: #6872d5;
+  --accent-soft: rgba(94, 106, 210, 0.11);
+  --danger: #f34e52;
+  --danger-soft: #fff0f0;
+  --warning: #f0bf00;
+  --success: #43bc58;
+  --status-backlog: #9e9ea1;
+  --status-todo: #9e9ea1;
+  --status-progress: #f0bf00;
+  --status-review: #43bc58;
+  --status-blocked: #f34e52;
+  --status-done: #5e6ad2;
+  --status-canceled: #9e9ea1;
+  --scrollbar-thumb: rgba(27, 27, 27, 0.15);
+  --scrollbar-thumb-hover: rgba(27, 27, 27, 0.46);
+  --card-shadow: 0 3px 6px -2px rgba(0, 0, 0, 0.02), 0 1px 1px rgba(0, 0, 0, 0.04);
+  --dialog-shadow: 0 20px 50px rgba(0, 0, 0, 0.17), 0 2px 10px rgba(0, 0, 0, 0.08);
+}
+
+:root[data-theme="dark"] {
+  color-scheme: dark;
+  --bg: #171719;
+  --header-bg: #1b1b1d;
+  --sidebar-bg: #151517;
+  --surface: #222225;
+  --surface-raised: #27272a;
+  --surface-muted: #29292c;
+  --surface-hover: #303034;
+  --surface-active: #37373c;
+  --column-header: #1d1d20;
+  --text-primary: #eeeeef;
+  --text-secondary: #b8b8bd;
+  --text-tertiary: #85858b;
+  --text-quaternary: #65656b;
+  --border: rgba(255, 255, 255, 0.075);
+  --border-strong: rgba(255, 255, 255, 0.13);
+  --accent: #6e78df;
+  --accent-hover: #7c86e5;
+  --accent-soft: rgba(110, 120, 223, 0.16);
+  --danger: #ef686d;
+  --danger-soft: rgba(229, 72, 77, 0.12);
+  --warning: #e5b729;
+  --success: #53b98a;
+  --status-backlog: #74767b;
+  --status-todo: #999ba1;
+  --status-progress: #e4b50f;
+  --status-review: #53b98a;
+  --status-blocked: #ef686d;
+  --status-done: #6e78df;
+  --status-canceled: #85858b;
+  --scrollbar-thumb: rgba(238, 238, 239, 0.15);
+  --scrollbar-thumb-hover: rgba(238, 238, 239, 0.5);
+  --card-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
+  --dialog-shadow: 0 24px 64px rgba(0, 0, 0, 0.58), 0 2px 12px rgba(0, 0, 0, 0.4);
+}
+
+* {
+  box-sizing: border-box;
+  scrollbar-color: var(--scrollbar-thumb) transparent;
+  scrollbar-width: thin;
+}
+
+*::-webkit-scrollbar {
+  width: 10px;
+  height: 10px;
+  background: transparent;
+}
+
+*::-webkit-scrollbar-track,
+*::-webkit-scrollbar-track-piece,
+*::-webkit-scrollbar-corner {
+  background: transparent;
+}
+
+*::-webkit-scrollbar-button {
+  display: none;
+  width: 0;
+  height: 0;
+}
+
+*::-webkit-scrollbar-thumb {
+  min-width: 30px;
+  min-height: 30px;
+  border: 3px solid transparent;
+  border-radius: 999px;
+  background: var(--scrollbar-thumb);
+  background-clip: padding-box;
+}
+
+*::-webkit-scrollbar-thumb:hover {
+  background-color: var(--scrollbar-thumb-hover);
+}
+
+html,
+body,
+#root {
+  width: 100%;
+  min-width: 320px;
+  height: 100%;
+  min-height: 100%;
+  margin: 0;
+}
+
+body {
+  overflow: hidden;
+  background: var(--bg);
+  color: var(--text-primary);
+  font-size: 12px;
+  font-weight: 450;
+  line-height: 1.5;
+  -webkit-user-select: none;
+  user-select: none;
+}
+
+input,
+textarea,
+[contenteditable="true"],
+[contenteditable="plaintext-only"] {
+  -webkit-user-select: text;
+  user-select: text;
+}
+
+button,
+input,
+textarea,
+select {
+  color: inherit;
+  font: inherit;
+}
+
+button,
+select {
+  cursor: pointer;
+}
+
+button:disabled,
+select:disabled {
+  cursor: not-allowed;
+  opacity: 0.45;
+}
+
+button:focus-visible,
+input:is(
+  [type="checkbox"],
+  [type="radio"],
+  [type="range"],
+  [type="file"],
+  [type="color"],
+  [type="button"],
+  [type="submit"],
+  [type="reset"],
+  [type="image"]
+):focus-visible,
+[tabindex]:not(input):not(textarea):not(select):not([contenteditable="true"]):not([contenteditable="plaintext-only"]):focus-visible:not(.issue-description-read) {
+  outline: 2px solid color-mix(in srgb, var(--accent) 70%, transparent);
+  outline-offset: 1px;
+}
+
+:where(
+  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="color"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
+  textarea,
+  select,
+  [contenteditable="true"],
+  [contenteditable="plaintext-only"]
+):is(:focus, :focus-visible) {
+  outline: 0;
+}
+
+svg {
+  display: block;
+}
+
+kbd {
+  font-family: inherit;
+}
+
+.sr-only {
+  position: absolute !important;
+  width: 1px !important;
+  height: 1px !important;
+  padding: 0 !important;
+  margin: -1px !important;
+  overflow: hidden !important;
+  clip: rect(0, 0, 0, 0) !important;
+  white-space: nowrap !important;
+  border: 0 !important;
+}
+
+.app-shell {
+  display: grid;
+  grid-template-columns: 220px minmax(0, 1fr);
+  width: 100%;
+  height: 100vh;
+  overflow: hidden;
+  background: var(--bg);
+}
+
+.app-shell.embedded {
+  grid-template-columns: minmax(0, 1fr);
+}
+
+.app-nav {
+  z-index: 2;
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  padding: 10px 8px 8px;
+  overflow: auto;
+  background: var(--sidebar-bg);
+  border-right: var(--border-hairline) solid var(--border);
+}
+
+.brand-row {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  height: 32px;
+  padding: 0 8px;
+  color: var(--text-primary);
+  font-size: 13px;
+  font-weight: 550;
+}
+
+.brand-mark {
+  display: grid;
+  place-items: center;
+  width: 16px;
+  height: 16px;
+  color: var(--text-primary);
+}
+
+.brand-mark svg {
+  width: 16px;
+  height: 16px;
+}
+
+.primary-nav,
+.project-nav {
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+  margin-top: 20px;
+}
+
+.project-nav {
+  margin-top: 18px;
+}
+
+.nav-label {
+  padding: 0 8px 5px;
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-weight: 500;
+}
+
+.nav-item,
+.project-nav-item,
+.theme-toggle {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  min-height: 28px;
+  gap: 8px;
+  padding: 4px 8px;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-secondary);
+  font-size: 12px;
+  text-align: left;
+}
+
+.nav-item:hover,
+.project-nav-item:hover,
+.theme-toggle:hover {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.nav-item.active,
+.project-nav-item.active {
+  background: var(--surface-active);
+  color: var(--text-primary);
+}
+
+.nav-glyph,
+.theme-toggle > span {
+  display: grid;
+  place-items: center;
+  width: 16px;
+  height: 16px;
+  color: var(--text-tertiary);
+}
+
+.nav-glyph svg {
+  width: 15px;
+  height: 15px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linejoin: round;
+  stroke-width: 1.25;
+}
+
+.nav-count {
+  margin-left: auto;
+  color: var(--text-tertiary);
+  font-size: 10px;
+  font-variant-numeric: tabular-nums;
+}
+
+.project-dot {
+  flex: 0 0 auto;
+  width: 8px;
+  height: 8px;
+  margin: 0 4px;
+  border: 1.5px solid var(--accent);
+  border-radius: 50%;
+}
+
+.project-nav-item.active .project-dot {
+  background: var(--accent);
+}
+
+.project-nav-item span:last-child {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.nav-spacer {
+  flex: 1;
+  min-height: 20px;
+}
+
+.nav-footer {
+  padding-top: 7px;
+  border-top: var(--border-hairline) solid var(--border);
+}
+
+.connection,
+.toolbar-connection {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  color: var(--text-tertiary);
+  font-size: 10px;
+}
+
+.connection {
+  padding: 5px 8px;
+}
+
+.connection > span,
+.toolbar-connection > span:first-child {
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: var(--warning);
+}
+
+.connection-live > span:first-child {
+  background: var(--success);
+}
+
+.connection-reconnecting > span:first-child {
+  animation: pulse 1.5s ease-in-out infinite;
+}
+
+.theme-toggle {
+  margin-top: 2px;
+}
+
+.workspace {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  height: 100vh;
+  overflow: hidden;
+  background: var(--bg);
+}
+
+.home-window-drag-region {
+  position: absolute;
+  z-index: 1;
+  top: 0;
+  right: 0;
+  left: var(--codex-titlebar-left-inset, 0px);
+  height: 32px;
+  pointer-events: none;
+}
+
+.app-shell.embedded .home-window-drag-region {
+  -webkit-app-region: drag;
+}
+
+.workspace-header {
+  display: flex;
+  flex: 0 0 44px;
+  align-items: center;
+  justify-content: space-between;
+  min-width: 0;
+  gap: 12px;
+  padding: 0 16px;
+  padding-left: calc(16px + var(--codex-titlebar-left-inset, 0px));
+  border-bottom: var(--border-hairline) solid var(--border);
+  background: var(--header-bg);
+}
+
+.workspace-drag-region {
+  flex: 1;
+  align-self: stretch;
+  min-width: 12px;
+}
+
+.app-shell.embedded .workspace-drag-region {
+  -webkit-app-region: drag;
+}
+
+.app-shell.embedded .workspace-header .header-actions,
+.app-shell.embedded .workspace-header button,
+.app-shell.embedded .workspace-header select {
+  -webkit-app-region: no-drag;
+}
+
+.project-home {
+  flex: 1;
+  min-height: 0;
+  padding: clamp(34px, 6vh, 72px) clamp(24px, 5vw, 72px);
+  overflow: auto;
+  background: var(--bg);
+}
+
+.project-home-heading,
+.project-home-bulk-actions,
+.project-home-groups,
+.project-grid,
+.project-home-empty {
+  width: min(920px, 100%);
+  margin-inline: auto;
+}
+
+.project-home-heading > span {
+  color: var(--text-tertiary);
+  font-size: 10px;
+  font-weight: 550;
+  letter-spacing: 0.06em;
+}
+
+.project-home-heading h1 {
+  margin: 7px 0 5px;
+  color: var(--text-primary);
+  font-size: 21px;
+  font-weight: 550;
+  letter-spacing: -0.02em;
+}
+
+.project-home-heading p {
+  margin: 0;
+  color: var(--text-tertiary);
+  font-size: 12px;
+}
+
+.project-home-bulk-actions {
+  display: flex;
+  align-items: center;
+  flex-wrap: nowrap;
+  gap: 5px;
+  min-height: 42px;
+  margin-top: 18px;
+  padding: 6px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 8px;
+  background: var(--surface);
+  opacity: 0;
+  pointer-events: none;
+  visibility: hidden;
+}
+
+.project-home-bulk-actions.is-visible {
+  opacity: 1;
+  pointer-events: auto;
+  visibility: visible;
+}
+
+.project-home-bulk-actions > span {
+  flex: 1 1 auto;
+  min-width: 0;
+  color: var(--text-secondary);
+  font-size: 11px;
+  font-weight: 520;
+}
+
+.project-bulk-action {
+  display: inline-flex;
+  align-items: center;
+  flex: 0 0 auto;
+  height: 28px;
+  gap: 6px;
+  padding: 0 8px;
+  border: var(--border-hairline) solid transparent;
+  border-radius: 6px;
+  outline: 0;
+  background: transparent;
+  color: var(--text-secondary);
+  font-size: 11px;
+  font-weight: 500;
+  white-space: nowrap;
+}
+
+.project-bulk-action:hover:not(:disabled) {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.project-bulk-action:focus-visible {
+  border-color: var(--border-strong);
+  background: var(--surface);
+  box-shadow: 0 0 0 2px var(--accent-soft);
+}
+
+.project-bulk-action.danger {
+  color: var(--danger);
+}
+
+.project-bulk-action.danger:hover:not(:disabled),
+.project-bulk-action.danger:focus-visible {
+  background: var(--danger-soft);
+}
+
+.project-bulk-action > svg {
+  width: 14px;
+  height: 14px;
+}
+
+.project-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
+  gap: 9px;
+  margin-top: 28px;
+}
+
+.project-home-groups {
+  display: grid;
+  gap: 28px;
+  margin-top: 30px;
+}
+
+.project-home-groups.is-selecting {
+  cursor: crosshair;
+  user-select: none;
+}
+
+.project-home-group {
+  min-width: 0;
+}
+
+.project-group-heading {
+  display: flex;
+  align-items: center;
+  gap: 7px;
+  padding-bottom: 8px;
+  border-bottom: var(--border-hairline) solid var(--border);
+}
+
+.project-group-heading h2 {
+  margin: 0;
+  color: var(--text-secondary);
+  font-size: 11px;
+  font-weight: 550;
+}
+
+.project-group-heading span {
+  color: var(--text-tertiary);
+  font-size: 10px;
+}
+
+.project-home-group .project-grid {
+  margin-top: 10px;
+}
+
+.project-group-empty {
+  margin: 14px 0 0;
+  color: var(--text-tertiary);
+  font-size: 11px;
+}
+
+.project-card {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  min-width: 0;
+  min-height: 100px;
+  overflow: hidden;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 9px;
+  background: var(--surface);
+  color: var(--text-primary);
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.025);
+}
+
+.project-card:hover {
+  border-color: var(--border-strong);
+  background: var(--surface-hover);
+  outline: none;
+}
+
+.project-card.is-selected,
+.project-card.is-selected:hover {
+  border-color: color-mix(in srgb, var(--accent) 76%, var(--border));
+  background: color-mix(in srgb, var(--accent-soft) 42%, var(--surface));
+  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 30%, transparent);
+}
+
+.project-card-main {
+  display: flex;
+  align-items: stretch;
+  min-width: 0;
+}
+
+.project-card-open {
+  display: flex;
+  align-items: center;
+  flex: 1;
+  width: auto;
+  min-width: 0;
+  gap: 11px;
+  padding: 12px 13px 9px;
+  border: 0;
+  background: transparent;
+  color: inherit;
+  text-align: left;
+}
+
+.project-card-open:disabled {
+  cursor: wait;
+  opacity: 0.68;
+}
+
+.project-card-create {
+  align-self: center;
+}
+
+.project-card-controls {
+  display: flex;
+  align-items: center;
+  flex: 0 0 auto;
+  gap: 2px;
+  padding-right: 8px;
+}
+
+.project-card-delete {
+  color: var(--danger);
+}
+
+.project-card-delete:hover:not(:disabled),
+.project-card-delete:focus-visible {
+  background: var(--danger-soft);
+  color: var(--danger);
+}
+
+.project-card-directory {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  gap: 6px;
+  margin: 0 13px;
+  padding: 8px 0 9px;
+  border-top: var(--border-hairline) solid var(--border);
+  color: var(--text-tertiary);
+}
+
+.project-card-directory svg {
+  flex: 0 0 auto;
+  width: 13px;
+  height: 13px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linejoin: round;
+}
+
+.project-card-directory input {
+  width: 100%;
+  min-width: 0;
+  padding: 0;
+  border: 0;
+  background: transparent;
+  color: var(--text-secondary);
+  font-size: 10px;
+  outline: none;
+  text-overflow: ellipsis;
+}
+
+.project-card-directory input::placeholder {
+  color: var(--text-tertiary);
+}
+
+.project-card-avatar {
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+  width: 32px;
+  height: 32px;
+  border-radius: 8px;
+  background: var(--text-primary);
+  color: var(--header-bg);
+  font-size: 12px;
+  font-weight: 650;
+}
+
+.project-card-copy {
+  display: flex;
+  flex: 1;
+  min-width: 0;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.project-card-copy strong {
+  overflow: hidden;
+  font-size: 12px;
+  font-weight: 520;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.project-card-copy span,
+.project-card-action {
+  color: var(--text-tertiary);
+  font-size: 10px;
+}
+
+.project-card-action {
+  flex: 0 0 auto;
+  white-space: nowrap;
+}
+
+.project-card-favorite {
+  flex: 0 0 auto;
+  color: var(--warning);
+  font-size: 11px;
+}
+
+.project-grid-loading span {
+  height: 100px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 9px;
+  background: linear-gradient(100deg, var(--surface) 30%, var(--surface-hover) 45%, var(--surface) 60%);
+  background-size: 220% 100%;
+  animation: shimmer 1.5s ease-in-out infinite;
+}
+
+.project-home-empty {
+  display: grid;
+  place-items: center;
+  min-height: 260px;
+  color: var(--text-tertiary);
+  text-align: center;
+}
+
+.project-home-empty h2,
+.project-home-empty p {
+  margin: 0;
+}
+
+.project-home-empty h2 {
+  color: var(--text-primary);
+  font-size: 14px;
+  font-weight: 520;
+}
+
+.project-home-empty p {
+  font-size: 11px;
+}
+
+.workspace-title,
+.workspace-kicker {
+  min-width: 0;
+}
+
+.workspace-kicker {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  color: var(--text-secondary);
+  white-space: nowrap;
+}
+
+.workspace-kicker strong {
+  color: var(--text-primary);
+  font-weight: 500;
+}
+
+.project-avatar {
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+  width: 16px;
+  height: 16px;
+  border-radius: 5px;
+  background: var(--text-primary);
+  color: var(--header-bg);
+  font-size: 8px;
+  font-weight: 650;
+}
+
+.project-name {
+  max-width: min(28vw, 260px);
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.header-project-switcher {
+  position: relative;
+  min-width: 0;
+}
+
+.header-project-button {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  max-width: min(34vw, 320px);
+  height: 28px;
+  gap: 6px;
+  margin: -4px;
+  padding: 0 4px;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-secondary);
+  font: inherit;
+}
+
+.header-project-button:hover,
+.header-project-button[aria-expanded="true"] {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.project-switcher-chevron {
+  flex: 0 0 auto;
+  width: 12px;
+  height: 12px;
+  fill: none;
+  stroke: var(--text-tertiary);
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.4;
+}
+
+.header-project-menu {
+  -webkit-app-region: no-drag;
+  position: absolute;
+  z-index: 50;
+  top: 33px;
+  left: -4px;
+  width: min(240px, calc(100vw - 24px));
+  padding: 5px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 9px;
+  background: var(--surface-raised);
+  box-shadow: var(--dialog-shadow);
+  animation: context-menu-in 90ms ease-out both;
+}
+
+.header-project-menu > span {
+  display: block;
+  padding: 5px 7px 6px;
+  color: var(--text-tertiary);
+  font-size: 9px;
+  font-weight: 550;
+}
+
+.header-project-menu button {
+  display: grid;
+  grid-template-columns: 22px minmax(0, 1fr) auto auto;
+  align-items: center;
+  width: 100%;
+  min-height: 32px;
+  gap: 7px;
+  padding: 3px 7px;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 11px;
+  text-align: left;
+}
+
+.header-project-menu button:hover:not(:disabled),
+.header-project-menu button:focus-visible {
+  background: var(--surface-hover);
+  outline: none;
+}
+
+.header-project-menu button > span:nth-child(2) {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.header-project-menu .project-avatar {
+  width: 20px;
+  height: 20px;
+}
+
+.project-menu-favorite {
+  color: var(--warning);
+  font-size: 10px;
+}
+
+.project-menu-check {
+  color: var(--accent);
+  font-size: 11px;
+}
+
+.breadcrumb-chevron {
+  color: var(--text-tertiary);
+  font-size: 15px;
+  line-height: 1;
+}
+
+.favorite-icon {
+  width: 14px;
+  height: 14px;
+  color: var(--text-tertiary);
+}
+
+.favorite-button {
+  display: grid;
+  place-items: center;
+  width: 26px;
+  height: 26px;
+  margin-left: -2px;
+  padding: 0;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-primary);
+  font: inherit;
+  font-weight: 500;
+}
+
+.favorite-button:hover {
+  background: var(--surface-hover);
+}
+
+.favorite-button.active .favorite-icon {
+  color: var(--warning);
+}
+
+.codex-context {
+  max-width: 190px;
+  margin-left: 3px;
+  padding: 1px 5px;
+  overflow: hidden;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 4px;
+  color: var(--text-tertiary);
+  font-size: 9px;
+  text-overflow: ellipsis;
+}
+
+.header-actions,
+.toolbar-tools,
+.view-tabs,
+.column-actions,
+.dialog-actions {
+  display: flex;
+  align-items: center;
+}
+
+.header-actions {
+  flex: 0 0 auto;
+  gap: 5px;
+}
+
+.bulk-task-actions {
+  display: inline-flex;
+  align-items: center;
+  flex: 0 0 auto;
+  gap: 4px;
+}
+
+.bulk-task-action {
+  display: inline-flex;
+  align-items: center;
+  flex: 0 0 auto;
+  max-width: min(130px, 18vw);
+  height: 28px;
+  gap: 6px;
+  padding: 0 7px;
+  border: var(--border-hairline) solid transparent;
+  border-radius: 6px;
+  outline: 0;
+  background: transparent;
+  color: var(--text-secondary);
+  font-size: 11px;
+  font-weight: 500;
+  white-space: nowrap;
+}
+
+.bulk-task-action:hover:not(:disabled) {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.bulk-task-action:focus-visible {
+  border-color: var(--border-strong);
+  background: var(--surface);
+  box-shadow: 0 0 0 2px var(--accent-soft);
+}
+
+.bulk-task-action.danger {
+  color: var(--danger);
+}
+
+.bulk-task-action.danger:hover:not(:disabled),
+.bulk-task-action.danger:focus-visible {
+  background: var(--danger-soft);
+}
+
+.bulk-task-action > svg {
+  flex: 0 0 auto;
+  width: 14px;
+  height: 14px;
+}
+
+.bulk-task-action > span {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.bulk-project-move {
+  display: inline-flex;
+  align-items: center;
+  flex: 0 0 auto;
+  max-width: min(178px, 24vw);
+  height: 28px;
+  gap: 6px;
+  padding: 0 7px;
+  border: var(--border-hairline) solid transparent;
+  border-radius: 6px;
+  outline: 0;
+  background: transparent;
+  color: var(--text-secondary);
+  font-size: 11px;
+  font-weight: 500;
+  white-space: nowrap;
+}
+
+.bulk-project-move:hover:not(:disabled) {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.bulk-project-move:focus-visible,
+.bulk-project-move.is-open {
+  border-color: var(--border-strong);
+  background: var(--surface);
+  box-shadow: 0 0 0 2px var(--accent-soft);
+}
+
+.bulk-project-move > span {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.bulk-project-move-icon {
+  flex: 0 0 auto;
+  width: 14px;
+  height: 14px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.25;
+}
+
+.bulk-project-move-chevron {
+  flex: 0 0 auto;
+  width: 12px;
+  height: 12px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.35;
+}
+
+.bulk-project-move-menu {
+  -webkit-app-region: no-drag;
+  position: fixed;
+  z-index: 1300;
+  width: min(248px, calc(100vw - 16px));
+  padding: 5px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 9px;
+  background: var(--surface-raised);
+  color: var(--text-primary);
+  box-shadow: var(--dialog-shadow);
+  user-select: none;
+  animation: context-menu-in 90ms ease-out both;
+}
+
+.bulk-project-move-menu > span {
+  display: block;
+  padding: 5px 7px 6px;
+  color: var(--text-tertiary);
+  font-size: 9px;
+  font-weight: 550;
+}
+
+.bulk-project-move-menu button {
+  display: grid;
+  grid-template-columns: 22px minmax(0, 1fr);
+  align-items: center;
+  width: 100%;
+  min-height: 32px;
+  gap: 7px;
+  padding: 3px 7px;
+  border: 0;
+  border-radius: 5px;
+  outline: 0;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 11px;
+  text-align: left;
+}
+
+.bulk-project-move-menu button:hover:not(:disabled),
+.bulk-project-move-menu button:focus-visible {
+  background: var(--surface-hover);
+}
+
+.bulk-project-move-menu .project-avatar {
+  width: 20px;
+  height: 20px;
+}
+
+.bulk-project-move-menu button > span:last-child {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.toolbar-connection {
+  display: grid;
+  place-items: center;
+  width: 26px;
+  height: 26px;
+}
+
+.toolbar-connection > span:first-child {
+  width: 5px;
+  height: 5px;
+}
+
+.icon-button {
+  display: inline-grid;
+  place-items: center;
+  flex: 0 0 auto;
+  width: 24px;
+  height: 24px;
+  padding: 0;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-tertiary);
+}
+
+.icon-button:hover:not(:disabled) {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.icon-button svg {
+  width: 16px;
+  height: 16px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.35;
+}
+
+.header-create-button {
+  width: 28px;
+  height: 28px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 50%;
+  background: var(--surface);
+  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.03);
+  color: var(--text-secondary);
+}
+
+.header-create-button:hover:not(:disabled) {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.board-toolbar {
+  display: flex;
+  flex: 0 0 44px;
+  align-items: center;
+  min-width: 0;
+  gap: 12px;
+  padding: 0 12px;
+  border-bottom: var(--border-hairline) solid var(--border);
+  background: var(--header-bg);
+}
+
+.view-tabs {
+  min-width: 0;
+  gap: 2px;
+}
+
+.view-tab {
+  display: inline-flex;
+  align-items: center;
+  height: 26px;
+  padding: 0 8px;
+  border: 0;
+  border-radius: 6px;
+  outline: 0;
+  background: transparent;
+  color: var(--text-secondary);
+  font: inherit;
+  font-size: 11px;
+  white-space: nowrap;
+}
+
+.view-tab:hover {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.view-tab:focus-visible {
+  box-shadow: 0 0 0 2px var(--accent-soft);
+}
+
+.view-tab.active {
+  background: var(--surface-active);
+  color: var(--text-primary);
+  font-weight: 500;
+}
+
+.toolbar-tools {
+  min-width: 0;
+  gap: 5px;
+  margin-left: auto;
+}
+
+.search-field,
+.task-filter-trigger,
+.board-settings-trigger {
+  position: relative;
+  display: flex;
+  align-items: center;
+  height: 28px;
+  border: var(--border-hairline) solid transparent;
+  border-radius: 6px;
+  background: transparent;
+}
+
+.search-field:hover,
+.task-filter-trigger:hover,
+.board-settings-trigger:hover {
+  background: var(--surface-hover);
+}
+
+.task-filter-trigger:focus-visible,
+.task-filter-trigger.is-open,
+.board-settings-trigger:focus-visible,
+.board-settings-trigger.is-open {
+  border-color: var(--border-strong);
+  background: var(--surface);
+  box-shadow: 0 0 0 2px var(--accent-soft);
+}
+
+.search-field {
+  width: 28px;
+  overflow: hidden;
+  transition: width 140ms ease, background-color 100ms ease, border-color 100ms ease;
+}
+
+.search-field:focus-within,
+.search-field.has-value {
+  width: min(148px, 21vw);
+}
+
+.search-field input {
+  width: 100%;
+  height: 100%;
+  padding: 3px 27px 3px 27px;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 11px;
+  opacity: 0;
+  transition: opacity 100ms ease;
+}
+
+.search-field:focus-within input,
+.search-field.has-value input {
+  opacity: 1;
+}
+
+.search-field input::placeholder {
+  color: var(--text-tertiary);
+}
+
+.search-icon,
+.filter-icon {
+  position: absolute;
+  left: 7px;
+  width: 14px;
+  height: 14px;
+  fill: none;
+  stroke: var(--text-tertiary);
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.25;
+  pointer-events: none;
+}
+
+.search-field kbd {
+  position: absolute;
+  right: 6px;
+  display: grid;
+  place-items: center;
+  width: 15px;
+  height: 15px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 3px;
+  background: var(--surface-muted);
+  color: var(--text-tertiary);
+  font-size: 8px;
+}
+
+.search-field:not(:focus-within):not(.has-value) kbd {
+  display: none;
+}
+
+.task-filter-trigger {
+  width: 28px;
+  padding: 0;
+  border-color: transparent;
+  outline: 0;
+  background: transparent;
+}
+
+.task-filter-trigger.is-active {
+  background: var(--accent-soft);
+}
+
+.task-filter-trigger.is-active .filter-icon {
+  stroke: var(--accent);
+}
+
+.task-filter-active-dot {
+  position: absolute;
+  top: 3px;
+  right: 3px;
+  width: 5px;
+  height: 5px;
+  border: 1px solid var(--header-bg);
+  border-radius: 50%;
+  background: var(--accent);
+}
+
+.board-settings-trigger {
+  justify-content: center;
+  width: 28px;
+  padding: 0;
+  border-color: transparent;
+  outline: 0;
+  color: var(--text-tertiary);
+}
+
+.board-settings-trigger:hover,
+.board-settings-trigger.is-open {
+  color: var(--text-primary);
+}
+
+.board-settings-trigger > svg {
+  width: 16px;
+  height: 16px;
+}
+
+.board-settings-active-dot {
+  position: absolute;
+  top: 2px;
+  right: 2px;
+  width: 6px;
+  height: 6px;
+  border: 1px solid var(--header-bg);
+  border-radius: 50%;
+  background: var(--accent);
+}
+
+.board-settings-menu {
+  position: fixed;
+  z-index: 1300;
+  width: min(304px, calc(100vw - 16px));
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 12px;
+  background: var(--surface-raised);
+  color: var(--text-primary);
+  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.14), 0 4px 12px rgba(0, 0, 0, 0.08), 0 0 0 0.5px rgba(0, 0, 0, 0.035);
+  user-select: none;
+  -webkit-app-region: no-drag;
+  animation: context-menu-in 90ms ease-out both;
+}
+
+.no-drag {
+  -webkit-app-region: no-drag;
+}
+
+.project-automation-trigger {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  width: auto;
+  height: 28px;
+  padding: 0 8px;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-weight: 500;
+  white-space: nowrap;
+}
+
+.project-automation-trigger:hover,
+.project-automation-trigger:focus-visible {
+  background: var(--surface-hover);
+}
+
+.project-automation-trigger:focus-visible {
+  outline: 0;
+  box-shadow: 0 0 0 2px var(--accent-soft);
+}
+
+.project-automation-trigger > svg {
+  width: 16px;
+  height: 16px;
+}
+
+.project-automation-trigger.is-active,
+.project-automation-menu .is-active {
+  color: var(--success);
+}
+
+.project-automation-trigger.is-paused,
+.project-automation-menu .is-paused {
+  color: var(--text-tertiary);
+}
+
+.project-automation-menu {
+  position: fixed;
+  z-index: 1300;
+  width: min(304px, calc(100vw - 16px));
+  padding: 16px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 12px;
+  background: var(--surface-raised);
+  color: var(--text-primary);
+  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.14), 0 4px 12px rgba(0, 0, 0, 0.08), 0 0 0 0.5px rgba(0, 0, 0, 0.035);
+  animation: context-menu-in 90ms ease-out both;
+}
+
+:root[data-theme="dark"] .project-automation-menu {
+  box-shadow: 0 20px 52px rgba(0, 0, 0, 0.56), 0 4px 14px rgba(0, 0, 0, 0.34), 0 0 0 0.5px rgba(255, 255, 255, 0.055);
+}
+
+.project-automation-menu-heading,
+.project-automation-switch,
+.project-automation-field {
+  display: flex;
+  align-items: center;
+}
+
+.project-automation-menu-heading {
+  justify-content: space-between;
+  margin-bottom: 14px;
+  font-size: 13px;
+}
+
+.project-automation-menu-heading > span {
+  font-size: 11px;
+  font-weight: 500;
+}
+
+.project-automation-switch,
+.project-automation-field {
+  justify-content: space-between;
+  min-height: 34px;
+  color: var(--text-secondary);
+  font-size: 12px;
+}
+
+.project-automation-switch .board-setting-switch {
+  flex: 0 0 auto;
+}
+
+.project-automation-field select {
+  min-width: 98px;
+  height: 26px;
+  padding: 0 6px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 5px;
+  outline: 0;
+  background: var(--surface);
+  color: var(--text-primary);
+  font: inherit;
+}
+
+.project-automation-field select:focus-visible {
+  outline: 0;
+  box-shadow: none;
+}
+
+.project-automation-note,
+.project-automation-error,
+.project-automation-quota {
+  margin: 9px 0 0;
+  font-size: 11px;
+  line-height: 16px;
+}
+
+.project-automation-quota {
+  padding: 8px 10px;
+  border-radius: 6px;
+  background: var(--surface);
+  color: var(--text-tertiary);
+}
+
+.project-automation-quota.is-available {
+  color: var(--success);
+}
+
+.project-automation-quota.is-blocked {
+  color: var(--warning);
+}
+
+.project-automation-note {
+  color: var(--text-tertiary);
+}
+
+.project-automation-error {
+  color: var(--danger);
+}
+
+:root[data-theme="dark"] .board-settings-menu {
+  box-shadow: 0 20px 52px rgba(0, 0, 0, 0.56), 0 4px 14px rgba(0, 0, 0, 0.34), 0 0 0 0.5px rgba(255, 255, 255, 0.055);
+}
+
+.board-settings-section {
+  padding: 18px 16px 14px;
+}
+
+.board-settings-section + .board-settings-section {
+  border-top: var(--border-hairline) solid var(--border);
+}
+
+.board-settings-section h2 {
+  margin: 0 0 12px;
+  color: var(--text-primary);
+  font-size: 13px;
+  font-weight: 600;
+}
+
+.board-setting-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  min-height: 34px;
+  color: var(--text-secondary);
+  font-size: 13px;
+  font-weight: 500;
+}
+
+.board-setting-copy {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.board-setting-copy small,
+.board-setting-note {
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-weight: 400;
+  line-height: 16px;
+}
+
+.board-setting-note,
+.board-setting-error {
+  margin: 7px 42px 0 0;
+}
+
+.board-setting-error {
+  color: var(--danger);
+  font-size: 11px;
+  line-height: 16px;
+}
+
+.board-setting-switch {
+  position: relative;
+  width: 34px;
+  height: 20px;
+  padding: 0;
+  border: 0;
+  border-radius: 999px;
+  outline: 0;
+  background: color-mix(in srgb, var(--text-tertiary) 34%, transparent);
+  transition: background-color 120ms ease;
+}
+
+.board-setting-switch:disabled {
+  cursor: default;
+  opacity: 0.45;
+}
+
+.board-setting-switch > span:first-child {
+  position: absolute;
+  top: 3px;
+  left: 3px;
+  width: 14px;
+  height: 14px;
+  border-radius: 50%;
+  background: var(--surface-raised);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
+  transition: transform 140ms cubic-bezier(0.2, 0.8, 0.2, 1);
+}
+
+.board-setting-switch.is-on {
+  background: var(--accent);
+}
+
+.board-setting-switch.is-on > span:first-child {
+  transform: translateX(14px);
+}
+
+.board-setting-switch:focus-visible {
+  box-shadow: 0 0 0 3px var(--accent-soft);
+}
+
+.clear-filter {
+  display: grid;
+  place-items: center;
+  width: 28px;
+  height: 26px;
+  padding: 0;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-tertiary);
+  font-size: 10px;
+}
+
+.clear-filter svg {
+  width: 14px;
+  height: 14px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-width: 1.25;
+}
+
+.clear-filter:hover {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.task-filter-menu,
+.task-filter-submenu {
+  -webkit-app-region: no-drag;
+  width: min(264px, calc(100vw - 16px));
+  padding: 6px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 12px;
+  background: var(--surface-raised);
+  color: var(--text-primary);
+  font-size: 13px;
+  font-weight: 450;
+  line-height: 20px;
+  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.14), 0 4px 12px rgba(0, 0, 0, 0.08), 0 0 0 0.5px rgba(0, 0, 0, 0.035);
+  user-select: none;
+  animation: context-menu-in 90ms ease-out both;
+}
+
+:root[data-theme="dark"] .task-filter-menu,
+:root[data-theme="dark"] .task-filter-submenu {
+  box-shadow: 0 20px 52px rgba(0, 0, 0, 0.56), 0 4px 14px rgba(0, 0, 0, 0.34), 0 0 0 0.5px rgba(255, 255, 255, 0.055);
+}
+
+.task-filter-menu {
+  position: fixed;
+  z-index: 1300;
+}
+
+.task-filter-search {
+  position: relative;
+  display: flex;
+  align-items: center;
+  height: 36px;
+  margin: -6px -6px 5px;
+  border-bottom: var(--border-hairline) solid var(--border);
+}
+
+.task-filter-search input {
+  width: 100%;
+  height: 100%;
+  padding: 0 42px 0 14px;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 13px;
+}
+
+.task-filter-search input::placeholder {
+  color: var(--text-tertiary);
+}
+
+.task-filter-search kbd {
+  position: absolute;
+  right: 10px;
+  display: grid;
+  place-items: center;
+  min-width: 20px;
+  height: 20px;
+  padding: 0 5px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 5px;
+  background: var(--surface-muted);
+  color: var(--text-tertiary);
+  font-size: 10px;
+}
+
+.task-filter-root-list,
+.task-filter-scroll {
+  display: flex;
+  flex-direction: column;
+}
+
+.task-filter-menu:not([data-has-submenu="true"]) .task-filter-root-list {
+  max-height: min(520px, calc(100vh - 92px));
+  overflow-x: hidden;
+  overflow-y: auto;
+  scrollbar-width: thin;
+}
+
+.task-filter-anchor {
+  position: relative;
+}
+
+.task-filter-item {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  min-width: 0;
+  height: 32px;
+  gap: 8px;
+  padding: 0 7px;
+  border: 0;
+  border-radius: 6px;
+  outline: 0;
+  background: transparent;
+  color: inherit;
+  text-align: left;
+  white-space: nowrap;
+}
+
+.task-filter-item:hover:not(:disabled),
+.task-filter-item:focus-visible,
+.task-filter-item.is-open {
+  outline: 0;
+  background: var(--surface-active);
+}
+
+.task-filter-item-icon,
+.task-filter-item-check,
+.task-filter-chevron {
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+}
+
+.task-filter-item-icon {
+  width: 17px;
+  height: 17px;
+  color: var(--text-secondary);
+}
+
+.task-filter-item-icon > svg,
+.task-filter-item-check > svg {
+  width: 16px;
+  height: 16px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.45;
+}
+
+.task-filter-item-label {
+  flex: 1 1 auto;
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.task-filter-item-summary {
+  max-width: 96px;
+  margin-left: auto;
+  overflow: hidden;
+  color: var(--text-tertiary);
+  font-size: 11px;
+  text-overflow: ellipsis;
+}
+
+.task-filter-category.is-active .task-filter-item-summary {
+  color: var(--accent);
+}
+
+.task-filter-chevron {
+  width: 10px;
+  height: 16px;
+  color: var(--text-tertiary);
+  font-size: 17px;
+  line-height: 16px;
+}
+
+.task-filter-item-category {
+  max-width: 72px;
+  margin-left: auto;
+  overflow: hidden;
+  color: var(--text-tertiary);
+  font-size: 10px;
+  text-overflow: ellipsis;
+}
+
+.task-filter-item-count {
+  flex: 0 0 auto;
+  min-width: 18px;
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-variant-numeric: tabular-nums;
+  text-align: right;
+}
+
+.task-filter-item-check {
+  width: 16px;
+  height: 16px;
+  color: var(--text-primary);
+}
+
+.task-filter-submenu {
+  --submenu-shift: 0px;
+  position: absolute;
+  z-index: 2;
+  top: -6px;
+  transform: translateY(var(--submenu-shift));
+}
+
+.task-filter-menu[data-submenu-side="right"] .task-filter-submenu {
+  left: calc(100% + 4px);
+}
+
+.task-filter-menu[data-submenu-side="left"] .task-filter-submenu {
+  right: calc(100% + 4px);
+}
+
+.task-filter-menu[data-submenu-side="overlay"] .task-filter-submenu {
+  top: calc(100% + 4px);
+  right: 0;
+}
+
+.task-filter-submenu .task-filter-search {
+  margin-bottom: 5px;
+}
+
+.task-filter-scroll {
+  max-height: min(370px, calc(100vh - 58px));
+  overflow-x: hidden;
+  overflow-y: auto;
+  scrollbar-width: thin;
+}
+
+.task-filter-section-label {
+  height: 27px;
+  margin: 5px -6px 0;
+  padding: 7px 13px 0;
+  border-top: var(--border-hairline) solid var(--border);
+  color: var(--text-tertiary);
+  font-size: 10px;
+  font-weight: 500;
+}
+
+.task-filter-unmatched {
+  opacity: 0.56;
+}
+
+.task-filter-no-results {
+  padding: 20px 12px;
+  color: var(--text-tertiary);
+  font-size: 11px;
+  text-align: center;
+}
+
+.task-filter-footer {
+  margin: 5px -6px -6px;
+  padding: 5px 6px 6px;
+  border-top: var(--border-hairline) solid var(--border);
+}
+
+.task-filter-clear-all {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 30px;
+  padding: 0 8px;
+  border: 0;
+  border-radius: 6px;
+  background: transparent;
+  color: var(--text-secondary);
+  text-align: left;
+}
+
+.task-filter-clear-all:hover,
+.task-filter-clear-all:focus-visible {
+  outline: 0;
+  background: var(--surface-active);
+  color: var(--text-primary);
+}
+
+.task-filter-clear-all span {
+  display: grid;
+  place-items: center;
+  min-width: 18px;
+  height: 18px;
+  margin-left: auto;
+  padding: 0 5px;
+  border-radius: 9px;
+  background: var(--accent-soft);
+  color: var(--accent);
+  font-size: 10px;
+}
+
+.filter-status-icon {
+  display: grid;
+  place-items: center;
+  width: 16px;
+  height: 16px;
+  color: var(--text-tertiary);
+}
+
+.filter-status-icon.status-in_progress { color: var(--status-progress); }
+.filter-status-icon.status-in_review { color: var(--status-review); }
+.filter-status-icon.status-blocked { color: var(--status-blocked); }
+.filter-status-icon.status-done { color: var(--status-done); }
+.filter-status-icon.status-canceled { color: var(--status-canceled); }
+.filter-status-icon svg { width: 15px; height: 15px; }
+
+.filter-label-glyph {
+  width: 11px;
+  height: 11px;
+  border: 2px solid color-mix(in srgb, var(--label-color) 85%, transparent);
+  border-radius: 50%;
+  background: color-mix(in srgb, var(--label-color) 18%, transparent);
+}
+
+.filter-content-apply kbd {
+  margin-left: auto;
+  color: var(--text-tertiary);
+  font-size: 11px;
+}
+
+.filter-content-clear .task-filter-item-icon {
+  font-size: 17px;
+}
+
+@media (pointer: coarse) {
+  .task-filter-item,
+  .task-filter-clear-all {
+    height: 36px;
+  }
+}
+
+.board-scroll {
+  flex: 1;
+  min-height: 0;
+  width: 100%;
+  padding: 8px 10px 10px;
+  overflow-x: auto;
+  overflow-y: hidden;
+  overscroll-behavior-y: none;
+  background: var(--bg);
+  scrollbar-color: var(--scrollbar-thumb) transparent;
+  scrollbar-width: thin;
+}
+
+.board-scroll.is-selecting {
+  cursor: crosshair;
+}
+
+.board-selection-box,
+.project-selection-box {
+  position: fixed;
+  z-index: 2200;
+  border: 1px solid color-mix(in srgb, var(--accent) 78%, transparent);
+  border-radius: 4px;
+  background: color-mix(in srgb, var(--accent-soft) 72%, transparent);
+  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 14%, transparent);
+  pointer-events: none;
+}
+
+.board {
+  display: flex;
+  align-items: stretch;
+  width: max-content;
+  height: 100%;
+  min-width: 100%;
+  min-height: 0;
+  gap: 8px;
+}
+
+.hidden-columns {
+  flex: 0 0 280px;
+  width: 280px;
+  height: 100%;
+  min-height: 0;
+  padding: 0 8px 8px;
+  overflow-y: auto;
+  overscroll-behavior-y: contain;
+}
+
+.hidden-columns-heading {
+  position: sticky;
+  z-index: 2;
+  top: 0;
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 48px;
+  gap: 7px;
+  padding: 0 8px;
+  border: 0;
+  border-radius: 6px;
+  outline: 0;
+  background: var(--bg);
+  color: var(--text-secondary);
+  font: inherit;
+  font-size: 12px;
+  font-weight: 550;
+  text-align: left;
+}
+
+.hidden-columns-heading:hover,
+.hidden-columns-heading:focus-visible {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.hidden-columns-heading svg {
+  width: 13px;
+  height: 13px;
+  transition: transform 120ms ease;
+}
+
+.hidden-columns:not(.is-open) .hidden-columns-heading svg {
+  transform: rotate(-90deg);
+}
+
+.hidden-columns-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.hidden-columns-list[hidden] {
+  display: none;
+}
+
+.hidden-column-item {
+  display: flex;
+  align-items: center;
+  min-height: 50px;
+  padding: 0 8px 0 0;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 7px;
+  background: var(--surface);
+  box-shadow: var(--card-shadow);
+  color: var(--text-secondary);
+  transition: border-color 100ms ease, background-color 100ms ease, box-shadow 100ms ease, transform 120ms ease;
+}
+
+.hidden-column-show {
+  display: flex;
+  align-items: center;
+  align-self: stretch;
+  min-width: 0;
+  flex: 1;
+  gap: 9px;
+  padding: 0 4px 0 12px;
+  border: 0;
+  border-radius: 7px;
+  outline: 0;
+  background: transparent;
+  color: inherit;
+  font: inherit;
+  text-align: left;
+}
+
+.hidden-column-show:hover,
+.hidden-column-show:focus-visible {
+  color: var(--text-primary);
+}
+
+.hidden-column-show.is-empty:hover {
+  color: inherit;
+}
+
+.hidden-column-item strong {
+  overflow: hidden;
+  font-size: 12px;
+  font-weight: 550;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.hidden-column-count {
+  margin-left: auto;
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-variant-numeric: tabular-nums;
+}
+
+.hidden-column-menu {
+  width: 28px;
+  height: 28px;
+  flex: 0 0 28px;
+  border-radius: 50%;
+}
+
+.hidden-column-menu svg {
+  width: 14px;
+  height: 14px;
+}
+
+.hidden-column-item.is-drop-target {
+  border-color: color-mix(in srgb, var(--accent) 58%, var(--border));
+  background: color-mix(in srgb, var(--accent-soft) 50%, var(--surface));
+  box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent-soft) 58%, transparent);
+  transform: translateY(-1px);
+}
+
+.board-filter-empty {
+  flex: 0 0 280px;
+  width: 280px;
+  min-height: 100%;
+  border-radius: 6px;
+  background: var(--column-header);
+}
+
+.board-column {
+  --board-column-surface: var(--column-header);
+  display: flex;
+  flex-direction: column;
+  flex: 0 0 340px;
+  width: 340px;
+  height: 100%;
+  min-height: 0;
+  overflow-x: hidden;
+  overflow-y: auto;
+  overscroll-behavior-y: contain;
+  border-radius: 6px;
+  background: var(--board-column-surface);
+  scrollbar-color: var(--scrollbar-thumb) transparent;
+  scrollbar-width: thin;
+  transition: background-color 100ms ease, box-shadow 100ms ease;
+}
+
+.board-column.is-drop-target {
+  --board-column-surface: color-mix(in srgb, var(--accent-soft) 54%, var(--column-header));
+  box-shadow: 0 0 0 5px color-mix(in srgb, var(--accent-soft) 54%, transparent);
+}
+
+.column-header,
+.column-heading,
+.card-topline,
+.card-properties,
+.property-row,
+.codex-link-row,
+.dialog-context {
+  display: flex;
+  align-items: center;
+}
+
+.column-header {
+  position: sticky;
+  z-index: 4;
+  top: 0;
+  flex: 0 0 48px;
+  height: 48px;
+  padding: 0 8px;
+  justify-content: space-between;
+  background: var(--board-column-surface);
+}
+
+.column-heading {
+  min-width: 0;
+  gap: 6px;
+}
+
+.column-heading h2 {
+  margin: 0;
+  color: var(--text-secondary);
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 20px;
+}
+
+.status-icon {
+  display: grid;
+  place-items: center;
+  width: 14px;
+  height: 14px;
+  color: var(--status-backlog);
+}
+
+.status-icon svg {
+  width: 14px;
+  height: 14px;
+}
+
+.status-icon-todo { color: var(--status-todo); }
+.status-icon-progress { color: var(--status-progress); }
+.status-icon-review { color: var(--status-review); }
+.status-icon-blocked { color: var(--status-blocked); }
+.status-icon-done { color: var(--status-done); }
+.status-icon-canceled { color: var(--status-canceled); }
+
+.task-count {
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-variant-numeric: tabular-nums;
+}
+
+.column-actions {
+  gap: 2px;
+  opacity: 1;
+}
+
+.column-actions .icon-button {
+  width: 20px;
+  height: 20px;
+  border-radius: 4px;
+}
+
+.column-actions .icon-button svg {
+  width: 14px;
+  height: 14px;
+}
+
+.column-menu svg {
+  fill: currentColor;
+  stroke: none;
+}
+
+.column-menu.is-open,
+.hidden-column-menu.is-open {
+  background: var(--surface-active);
+  color: var(--text-primary);
+}
+
+.column-visibility-menu {
+  z-index: 1300;
+  min-width: 160px;
+}
+
+.column-visibility-action {
+  padding-right: 10px;
+  padding-left: 10px;
+}
+
+.add-task-button svg {
+  stroke-width: 1.4;
+}
+
+.column-list {
+  display: flex;
+  flex: 1 0 auto;
+  flex-direction: column;
+  gap: 8px;
+  min-height: calc(100% - 48px);
+  padding: 8px 8px 8px;
+}
+
+.column-list.has-hierarchy-groups {
+  gap: 10px;
+}
+
+.board-task-group {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding-left: 8px;
+}
+
+.board-task-group::before {
+  position: absolute;
+  top: 25px;
+  bottom: 2px;
+  left: 0;
+  border-left: var(--border-hairline) solid color-mix(in srgb, var(--accent) 38%, var(--border));
+  content: "";
+}
+
+.board-task-group-header {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  height: 24px;
+  gap: 5px;
+  color: var(--text-tertiary);
+}
+
+.board-task-group-root {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  flex: 1 1 auto;
+  gap: 5px;
+  padding: 0;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: inherit;
+  font: inherit;
+  text-align: left;
+}
+
+button.board-task-group-root {
+  cursor: pointer;
+}
+
+button.board-task-group-root:hover .board-task-group-title,
+button.board-task-group-root:focus-visible .board-task-group-title {
+  color: var(--text-primary);
+}
+
+button.board-task-group-root:focus-visible {
+  border-radius: 4px;
+  box-shadow: 0 0 0 2px var(--accent-soft);
+}
+
+.board-task-group-icon {
+  display: grid;
+  place-items: center;
+  flex: 0 0 16px;
+  width: 16px;
+  height: 16px;
+  color: color-mix(in srgb, var(--accent) 72%, var(--text-tertiary));
+}
+
+.board-task-group-icon svg,
+.board-task-group-root-status svg {
+  width: 13px;
+  height: 13px;
+}
+
+.board-task-group-id {
+  flex: 0 0 auto;
+  color: var(--text-secondary);
+  font-size: 10px;
+  font-weight: 560;
+  line-height: 16px;
+}
+
+.board-task-group-title {
+  min-width: 0;
+  overflow: hidden;
+  font-size: 11px;
+  font-weight: 500;
+  line-height: 16px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.board-task-group-root-status,
+.board-task-group-count,
+.board-task-group-depth {
+  display: inline-flex;
+  align-items: center;
+  flex: 0 0 auto;
+  height: 18px;
+  padding: 0 5px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 9px;
+  background: color-mix(in srgb, var(--surface) 72%, transparent);
+  color: var(--text-tertiary);
+  font-size: 10px;
+  font-variant-numeric: tabular-nums;
+}
+
+.board-task-group-root-status {
+  width: 20px;
+  justify-content: center;
+  padding: 0;
+}
+
+.board-task-group-depth {
+  color: color-mix(in srgb, var(--accent) 70%, var(--text-tertiary));
+}
+
+.board-task-group-list {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.task-card {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  min-height: 80px;
+  gap: 6px;
+  padding: 7px 8px;
+  overflow: hidden;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 6px;
+  background: var(--surface);
+  box-shadow: var(--card-shadow);
+  cursor: grab;
+  transition: border-color 100ms ease, background-color 100ms ease, box-shadow 100ms ease, opacity 100ms ease, transform 160ms cubic-bezier(0.2, 0.8, 0.2, 1);
+}
+
+.task-card.is-hierarchy-child {
+  width: calc(100% - var(--hierarchy-indent, 0px));
+  margin-left: var(--hierarchy-indent, 0px);
+  border-left-color: color-mix(in srgb, var(--accent) 54%, var(--border));
+}
+
+.task-card:hover {
+  z-index: 1;
+  border-color: var(--border-strong);
+  background: var(--surface-raised);
+  box-shadow: 0 3px 6px -2px rgba(0, 0, 0, 0.035), 0 1px 2px rgba(0, 0, 0, 0.055);
+}
+
+.task-card.is-context-open {
+  z-index: 1;
+  border-color: var(--border-strong);
+  background: var(--surface-raised);
+  box-shadow: 0 3px 6px -2px rgba(0, 0, 0, 0.035), 0 1px 2px rgba(0, 0, 0, 0.055);
+}
+
+.task-card.is-selected {
+  border-color: color-mix(in srgb, var(--accent) 72%, var(--border));
+  background: color-mix(in srgb, var(--accent-soft) 42%, var(--surface));
+  box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 22%, transparent), var(--card-shadow);
+}
+
+:root[data-theme="dark"] .task-card:hover {
+  box-shadow: 0 3px 7px rgba(0, 0, 0, 0.48);
+}
+
+.task-card:active {
+  cursor: grabbing;
+}
+
+.task-card.is-dragging {
+  opacity: 0;
+}
+
+.task-card.is-drag-shifted {
+  will-change: transform;
+}
+
+.task-card.is-moving {
+  opacity: 0.48;
+  pointer-events: none;
+  transform: scale(0.985);
+}
+
+.task-card.is-settling {
+  animation: task-card-settle 200ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
+}
+
+@keyframes task-card-settle {
+  from {
+    opacity: 0.38;
+    transform: translateY(-4px) scale(0.975);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0) scale(1);
+  }
+}
+
+.task-card-open {
+  position: absolute;
+  z-index: 1;
+  inset: 0;
+  border: 0;
+  border-radius: inherit;
+  background: transparent;
+  cursor: pointer;
+}
+
+.task-card-open:focus-visible {
+  outline: 2px solid var(--accent);
+  outline-offset: -2px;
+}
+
+.task-card > :not(.task-card-open) {
+  position: relative;
+  z-index: 2;
+  pointer-events: none;
+}
+
+.task-card .card-actions button,
+.task-card .thread-link {
+  pointer-events: auto;
+}
+
+.card-topline {
+  position: relative;
+  height: 16px;
+  min-width: 0;
+}
+
+.card-reference {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  max-width: calc(100% - 22px);
+  gap: 2px;
+}
+
+.card-reference > svg {
+  flex: 0 0 auto;
+  width: 10px;
+  height: 10px;
+  color: var(--text-tertiary);
+}
+
+.card-parent-title {
+  min-width: 0;
+  overflow: hidden;
+  color: var(--text-tertiary);
+  font-size: 10px;
+  line-height: 15px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.card-hierarchy-trail {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  height: 14px;
+  gap: 4px;
+  color: color-mix(in srgb, var(--accent) 62%, var(--text-tertiary));
+  font-size: 10px;
+  line-height: 14px;
+}
+
+.card-hierarchy-trail svg {
+  flex: 0 0 auto;
+  width: 12px;
+  height: 12px;
+}
+
+.card-hierarchy-trail span {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.task-identifier {
+  flex: 0 0 auto;
+  overflow: hidden;
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-weight: 450;
+  line-height: 15px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.card-actions {
+  position: absolute;
+  top: -1px;
+  right: 0;
+  display: flex;
+  align-items: center;
+  gap: 1px;
+  opacity: 0;
+  pointer-events: none;
+  transform: translateX(3px);
+  transition: opacity 100ms ease, transform 100ms ease;
+}
+
+.task-card:hover .card-actions,
+.task-card:focus-within .card-actions,
+.task-card.is-context-open .card-actions {
+  opacity: 1;
+  pointer-events: auto;
+  transform: translateX(0);
+}
+
+.task-card:hover .card-assignee-avatar,
+.task-card:focus-within .card-assignee-avatar,
+.task-card.is-context-open .card-assignee-avatar {
+  opacity: 0;
+}
+
+.icon-button.compact {
+  width: 18px;
+  height: 18px;
+  border-radius: 4px;
+  background: var(--surface);
+}
+
+.icon-button.compact svg {
+  width: 13px;
+  height: 13px;
+  stroke-width: 1.35;
+}
+
+.task-card h3 {
+  display: -webkit-box;
+  min-width: 0;
+  margin: 0;
+  overflow: hidden;
+  color: var(--text-primary);
+  font-size: 13px;
+  font-weight: 500;
+  line-height: 18px;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+}
+
+.card-properties {
+  min-width: 0;
+  height: 20px;
+  gap: 4px;
+  overflow: hidden;
+  white-space: nowrap;
+}
+
+.archive-view {
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  min-height: 0;
+  padding: 18px;
+  overflow: auto;
+}
+
+.archive-view-heading {
+  display: flex;
+  align-items: flex-end;
+  justify-content: space-between;
+  gap: 16px;
+  margin-bottom: 12px;
+}
+
+.archive-view-heading span {
+  display: block;
+  margin-bottom: 3px;
+  color: var(--text-tertiary);
+  font-size: 10px;
+  font-weight: 520;
+  text-transform: uppercase;
+}
+
+.archive-view-heading h2 {
+  margin: 0;
+  color: var(--text-primary);
+  font-size: 16px;
+  font-weight: 590;
+}
+
+.archive-view-heading strong {
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-weight: 520;
+}
+
+.archive-list {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.archived-issue-row {
+  display: flex;
+  align-items: center;
+  gap: 14px;
+  padding: 10px 11px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 6px;
+  background: var(--surface);
+  box-shadow: var(--card-shadow);
+}
+
+.archived-issue-main {
+  min-width: 0;
+  flex: 1 1 auto;
+}
+
+.archived-issue-title {
+  display: inline-flex;
+  max-width: 100%;
+  align-items: baseline;
+  gap: 7px;
+  padding: 0;
+  border: 0;
+  background: transparent;
+  color: var(--text-primary);
+  font: inherit;
+  font-size: 13px;
+  font-weight: 560;
+  text-align: left;
+}
+
+.archived-issue-title:hover {
+  color: var(--accent);
+}
+
+.archived-issue-title span {
+  flex: 0 0 auto;
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-weight: 520;
+}
+
+.archived-issue-meta {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 6px;
+  margin-top: 7px;
+  color: var(--text-tertiary);
+  font-size: 11px;
+}
+
+.archive-status-chip,
+.archive-priority-chip {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  height: 20px;
+  padding: 0 6px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 5px;
+  background: var(--surface-raised);
+  color: var(--text-secondary);
+}
+
+.archive-status-chip svg,
+.archive-priority-chip svg,
+.archived-issue-actions .button svg {
+  width: 14px;
+  height: 14px;
+}
+
+.archived-issue-actions {
+  display: flex;
+  flex: 0 0 auto;
+  align-items: center;
+  gap: 7px;
+}
+
+.archive-empty {
+  flex: 1 1 auto;
+}
+
+.hierarchy-empty {
+  flex: 1 1 auto;
+}
+
+.hierarchy-view {
+  display: flex;
+  flex: 1 1 0;
+  flex-direction: column;
+  width: 100%;
+  min-height: 0;
+  overflow: hidden;
+  background: var(--bg);
+}
+
+.hierarchy-view-heading {
+  display: flex;
+  flex: 0 0 44px;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16px;
+  margin: 0;
+  padding: 0 16px;
+  border-bottom: var(--border-hairline) solid var(--border);
+  background: var(--header-bg);
+}
+
+.hierarchy-view-heading span {
+  display: block;
+  margin-bottom: 1px;
+  color: var(--text-tertiary);
+  font-size: 10px;
+  font-weight: 520;
+  text-transform: uppercase;
+}
+
+.hierarchy-view-heading h2 {
+  margin: 0;
+  color: var(--text-primary);
+  font-size: 13px;
+  font-weight: 560;
+  line-height: 18px;
+}
+
+.hierarchy-view-heading strong {
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-weight: 520;
+}
+
+.hierarchy-table {
+  display: flex;
+  flex: 1 1 0;
+  flex-direction: column;
+  width: 100%;
+  min-width: 0;
+  min-height: 0;
+  padding: 0 10px 12px;
+  overflow: auto;
+  overscroll-behavior: contain;
+  background: var(--bg);
+}
+
+.hierarchy-table-header,
+.hierarchy-row {
+  display: grid;
+  grid-template-columns: minmax(280px, 1fr) 128px 72px minmax(116px, 150px) 28px;
+  align-items: center;
+  min-width: 760px;
+}
+
+.hierarchy-table-header {
+  position: sticky;
+  z-index: 5;
+  top: 0;
+  flex: 0 0 32px;
+  height: 32px;
+  padding: 0 8px;
+  border: var(--border-hairline) solid var(--border);
+  background: var(--column-header);
+  color: var(--text-tertiary);
+  font-size: 10px;
+  font-weight: 560;
+}
+
+.hierarchy-row {
+  flex: 0 0 42px;
+  min-height: 42px;
+  padding: 0 8px;
+  border-right: var(--border-hairline) solid var(--border);
+  border-bottom: var(--border-hairline) solid var(--border);
+  border-left: var(--border-hairline) solid var(--border);
+  background: var(--surface);
+  color: var(--text-secondary);
+}
+
+.hierarchy-row:last-child {
+  border-radius: 0 0 6px 6px;
+}
+
+.hierarchy-row:hover {
+  background: var(--surface-hover);
+}
+
+.hierarchy-row.is-context {
+  background: color-mix(in srgb, var(--column-header) 58%, var(--surface));
+  color: var(--text-tertiary);
+}
+
+.hierarchy-row-main {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  height: 100%;
+  gap: 7px;
+  padding: 0 4px 0 0;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: inherit;
+  font: inherit;
+  text-align: left;
+}
+
+.hierarchy-row-main:hover .hierarchy-row-title,
+.hierarchy-row-main:focus-visible .hierarchy-row-title {
+  color: var(--text-primary);
+}
+
+.hierarchy-row-main:focus-visible {
+  border-radius: 4px;
+  box-shadow: 0 0 0 2px var(--accent-soft);
+}
+
+.hierarchy-row-indent {
+  position: relative;
+  flex: 0 0 var(--hierarchy-indent, 0px);
+  align-self: stretch;
+}
+
+.hierarchy-row[data-depth]:not([data-depth="0"]) .hierarchy-row-indent::before {
+  position: absolute;
+  top: 0;
+  right: 8px;
+  bottom: 0;
+  border-left: var(--border-hairline) solid color-mix(in srgb, var(--accent) 34%, var(--border));
+  content: "";
+}
+
+.hierarchy-row.is-last-sibling[data-depth]:not([data-depth="0"]) .hierarchy-row-indent::before {
+  bottom: 50%;
+}
+
+.hierarchy-row[data-depth]:not([data-depth="0"]) .hierarchy-row-indent::after {
+  position: absolute;
+  top: 50%;
+  left: calc(100% - 8px);
+  width: 10px;
+  border-top: var(--border-hairline) solid color-mix(in srgb, var(--accent) 34%, var(--border));
+  content: "";
+}
+
+.hierarchy-row-status svg {
+  flex: 0 0 auto;
+  width: 14px;
+  height: 14px;
+}
+
+.hierarchy-row-id {
+  flex: 0 0 auto;
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-weight: 560;
+  font-variant-numeric: tabular-nums;
+}
+
+.hierarchy-row-title {
+  min-width: 0;
+  overflow: hidden;
+  color: var(--text-primary);
+  font-size: 13px;
+  font-weight: 500;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.hierarchy-context-chip {
+  display: inline-flex;
+  align-items: center;
+  flex: 0 0 auto;
+  height: 18px;
+  padding: 0 5px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 9px;
+  color: var(--text-tertiary);
+  font-size: 10px;
+}
+
+.hierarchy-row-status,
+.hierarchy-row-subissues,
+.hierarchy-row-assignee {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  gap: 6px;
+  color: var(--text-tertiary);
+  font-size: 11px;
+}
+
+.hierarchy-row-subissues {
+  font-variant-numeric: tabular-nums;
+}
+
+.hierarchy-row-assignee span:last-child {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.hierarchy-row-assignee .actor-avatar {
+  width: 18px;
+  height: 18px;
+  border-width: 1px;
+  font-size: 7px;
+}
+
+.hierarchy-row-thread {
+  width: 24px;
+  height: 24px;
+  justify-self: end;
+}
+
+.priority-icon {
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+  width: 20px;
+  height: 20px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 4px;
+  color: var(--text-tertiary);
+}
+
+.priority-icon svg {
+  width: 14px;
+  height: 14px;
+  fill: currentColor;
+}
+
+.priority-icon-urgent { color: #ff7236; }
+.priority-icon-high { color: #ff7236; }
+.priority-icon-medium { color: var(--warning); }
+.priority-icon-low { color: var(--text-tertiary); }
+
+.blocked-by-count,
+.sub-issue-progress-chip,
+.sub-issue-depth-chip {
+  display: inline-flex;
+  align-items: center;
+  flex: 0 0 auto;
+  height: 20px;
+  gap: 4px;
+  padding: 0 6px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 10px;
+  color: var(--text-tertiary);
+  font-size: 10px;
+  font-variant-numeric: tabular-nums;
+}
+
+.blocked-by-count {
+  color: var(--status-blocked);
+}
+
+.blocked-by-count > svg {
+  width: 12px;
+  height: 12px;
+}
+
+.sub-issue-depth-chip {
+  color: color-mix(in srgb, var(--accent) 74%, var(--text-tertiary));
+}
+
+.sub-issue-depth-chip > svg {
+  width: 12px;
+  height: 12px;
+}
+
+.sub-issue-progress {
+  display: inline-block;
+  flex: 0 0 auto;
+  width: 12px;
+  height: 12px;
+  border: 2px solid color-mix(in srgb, var(--accent) 34%, var(--border));
+  border-radius: 50%;
+}
+
+.label-chip,
+.due-date-chip,
+.thread-link {
+  display: inline-flex;
+  align-items: center;
+  flex: 0 1 auto;
+  max-width: 90px;
+  height: 20px;
+  padding: 0 6px;
+  overflow: hidden;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 2px;
+  background: transparent;
+  color: var(--text-secondary);
+  font-size: 10px;
+  font-weight: 450;
+  line-height: 15px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.label-chip {
+  max-width: 76px;
+}
+
+.due-date-chip {
+  flex: 0 0 auto;
+  color: var(--text-tertiary);
+}
+
+.label-more {
+  flex: 0 0 auto;
+  color: var(--text-tertiary);
+  font-size: 10px;
+}
+
+.thread-link {
+  flex: 0 0 auto;
+  gap: 3px;
+  max-width: none;
+}
+
+.thread-link:hover {
+  border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
+  background: var(--accent-soft);
+  color: var(--accent);
+}
+
+.thread-link svg {
+  width: 12px;
+  height: 12px;
+  fill: currentColor;
+  stroke: none;
+}
+
+.task-context-menu,
+.context-submenu {
+  -webkit-app-region: no-drag;
+  width: max-content;
+  min-width: 175px;
+  max-width: min(500px, calc(100vw - 16px));
+  padding: 6px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 12px;
+  background: var(--surface-raised);
+  color: var(--text-primary);
+  font-size: 13px;
+  font-weight: 450;
+  line-height: 20px;
+  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.14), 0 4px 12px rgba(0, 0, 0, 0.08), 0 0 0 0.5px rgba(0, 0, 0, 0.035);
+  user-select: none;
+  animation: context-menu-in 90ms ease-out both;
+}
+
+.detail-back-button {
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+  width: 26px;
+  height: 26px;
+  margin-left: -8px;
+  padding: 0;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-tertiary);
+}
+
+.detail-back-button:hover {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.detail-back-button svg {
+  width: 16px;
+  height: 16px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.4;
+}
+
+.codex-sidebar-expand-button {
+  width: 28px;
+  height: 28px;
+  margin-left: 0;
+}
+
+.workspace-kicker > .codex-sidebar-expand-button:first-child {
+  margin-left: -8px;
+}
+
+.codex-sidebar-expand-button svg {
+  width: 20px;
+  height: 20px;
+}
+
+.codex-sidebar-expand-button + .project-home-button {
+  margin-left: 0;
+}
+
+.project-home-button {
+  display: flex;
+  width: auto;
+  gap: 4px;
+  padding: 0 6px;
+  color: var(--text-secondary);
+  font-size: 10px;
+}
+
+.project-home-button svg {
+  width: 14px;
+  height: 14px;
+}
+
+.issue-detail {
+  display: flex;
+  flex: 1;
+  min-height: 0;
+  min-width: 0;
+  background: var(--bg);
+}
+
+.issue-detail-scroll {
+  width: 100%;
+  min-height: 0;
+  overflow: auto;
+  scrollbar-color: var(--scrollbar-thumb) transparent;
+  scrollbar-width: thin;
+}
+
+.issue-detail-layout {
+  display: grid;
+  grid-template-columns: minmax(0, 805px) 320px;
+  align-items: start;
+  width: min(1237px, 100%);
+  min-height: 100%;
+  gap: 56px;
+  margin: 0 auto;
+  padding: 32px 40px 80px;
+}
+
+.issue-detail-main {
+  min-width: 0;
+}
+
+.issue-editor {
+  padding: 0 14px 34px;
+}
+
+.issue-editor-content {
+  min-width: 0;
+}
+
+.issue-parent-link {
+  position: relative;
+  display: flex;
+  align-items: center;
+  min-height: 28px;
+  gap: 7px;
+  margin: -2px 0 4px;
+  color: var(--text-tertiary);
+  font-size: 12px;
+}
+
+.issue-parent-link:not(.has-parent) {
+  min-height: 22px;
+}
+
+.issue-parent-prefix {
+  flex: 0 0 auto;
+}
+
+.issue-parent-link .issue-relation-row {
+  min-width: 0;
+  flex: 1;
+}
+
+.issue-parent-link .issue-relation-add {
+  opacity: 0;
+}
+
+.issue-parent-link:hover .issue-relation-add,
+.issue-parent-link:focus-within .issue-relation-add,
+.issue-parent-link:not(.has-parent) .issue-relation-add {
+  opacity: 1;
+}
+
+.issue-title-row {
+  display: flex;
+  align-items: flex-start;
+  gap: 10px;
+}
+
+.issue-title-row .issue-title-input {
+  flex: 1 1 auto;
+  min-width: 0;
+}
+
+.issue-title-actions {
+  flex: 0 0 auto;
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  margin-top: 11px;
+}
+
+.issue-archive-button,
+.issue-restore-button,
+.issue-permanent-delete-button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 28px;
+  gap: 5px;
+  padding: 0 9px;
+  border: var(--border-hairline) solid color-mix(in srgb, var(--danger) 28%, var(--border));
+  border-radius: 5px;
+  font-size: 11px;
+  font-weight: 520;
+  white-space: nowrap;
+}
+
+.issue-archive-button {
+  background: color-mix(in srgb, var(--danger) 7%, transparent);
+  color: var(--danger);
+}
+
+.issue-restore-button {
+  border-color: color-mix(in srgb, var(--accent) 32%, var(--border));
+  background: color-mix(in srgb, var(--accent) 8%, transparent);
+  color: var(--accent);
+}
+
+.issue-permanent-delete-button {
+  background: var(--danger);
+  color: white;
+  box-shadow: 0 5px 10px color-mix(in srgb, var(--danger) 18%, transparent);
+}
+
+.issue-archive-button:hover:not(:disabled),
+.issue-restore-button:hover:not(:disabled),
+.issue-permanent-delete-button:hover:not(:disabled) {
+  background: color-mix(in srgb, var(--danger) 12%, transparent);
+  border-color: color-mix(in srgb, var(--danger) 44%, var(--border));
+}
+
+.issue-restore-button:hover:not(:disabled) {
+  background: color-mix(in srgb, var(--accent) 13%, transparent);
+  border-color: color-mix(in srgb, var(--accent) 44%, var(--border));
+}
+
+.issue-permanent-delete-button:hover:not(:disabled) {
+  background: color-mix(in srgb, var(--danger) 88%, black);
+}
+
+.issue-archive-button:disabled,
+.issue-restore-button:disabled,
+.issue-permanent-delete-button:disabled {
+  cursor: default;
+  opacity: 0.55;
+}
+
+.issue-title-input,
+.issue-description-input {
+  display: block;
+  width: 100%;
+  overflow: hidden;
+  resize: none;
+  border: var(--border-hairline) solid transparent;
+  border-radius: 7px;
+  outline: 0;
+  background: transparent;
+  color: var(--text-primary);
+}
+
+.issue-title-input:hover:not(:disabled),
+.issue-description-input:hover:not(:disabled),
+.issue-description-read:hover {
+  background: color-mix(in srgb, var(--surface-hover) 70%, transparent);
+}
+
+.issue-title-input:focus:not(:disabled),
+.issue-title-input:focus-visible:not(:disabled),
+.issue-description-input:focus:not(:disabled),
+.issue-description-input:focus-visible:not(:disabled),
+.issue-description-read:focus-visible {
+  border-color: transparent;
+  outline: 0;
+  background: transparent;
+  box-shadow: none;
+}
+
+.issue-title-input {
+  min-height: 50px;
+  margin: 0;
+  padding: 6px 0;
+  font-size: 24px;
+  font-weight: 600;
+  letter-spacing: -0.026em;
+  line-height: 38px;
+}
+
+.issue-description-input,
+.issue-description-read {
+  width: calc(100% + 28px);
+  min-height: 68px;
+  margin: 10px -14px 0;
+  padding: 10px 14px 16px;
+  color: var(--text-primary);
+  font-size: 15px;
+  font-weight: 430;
+  line-height: 24px;
+}
+
+.issue-description-read {
+  border: var(--border-hairline) solid transparent;
+  border-radius: 7px;
+  cursor: text;
+}
+
+.issue-description-read.empty {
+  color: var(--text-tertiary);
+}
+
+.issue-description-document {
+  min-width: 0;
+  color: inherit;
+  overflow-wrap: anywhere;
+}
+
+.issue-description-document > :first-child {
+  margin-top: 0;
+}
+
+.issue-description-document > :last-child {
+  margin-bottom: 0;
+}
+
+.issue-description-document p {
+  margin: 0 0 10px;
+}
+
+.issue-description-document h1,
+.issue-description-document h2,
+.issue-description-document h3,
+.issue-description-document h4,
+.issue-description-document h5,
+.issue-description-document h6 {
+  margin: 18px 0 8px;
+  color: var(--text-primary);
+  font-weight: 620;
+}
+
+.issue-description-document h1 {
+  font-size: 20px;
+  line-height: 28px;
+}
+
+.issue-description-document h2 {
+  font-size: 18px;
+  line-height: 26px;
+}
+
+.issue-description-document h3 {
+  font-size: 16px;
+  line-height: 24px;
+}
+
+.issue-description-document h4,
+.issue-description-document h5,
+.issue-description-document h6 {
+  font-size: 15px;
+  line-height: 24px;
+}
+
+.issue-description-document strong {
+  font-weight: 650;
+}
+
+.issue-description-document a {
+  color: var(--accent);
+  text-decoration: none;
+}
+
+.issue-description-document a:hover {
+  text-decoration: underline;
+}
+
+.issue-description-document ul,
+.issue-description-document ol {
+  margin: 6px 0 10px;
+  padding-left: 24px;
+}
+
+.issue-description-document li + li {
+  margin-top: 3px;
+}
+
+.issue-description-document li > p {
+  margin-bottom: 4px;
+}
+
+.issue-description-document .contains-task-list {
+  padding-left: 2px;
+  list-style: none;
+}
+
+.issue-description-document .task-list-item {
+  list-style: none;
+}
+
+.issue-description-document input[type="checkbox"] {
+  width: 14px;
+  height: 14px;
+  margin: 0 7px 0 0;
+  accent-color: var(--accent);
+  pointer-events: none;
+  vertical-align: -2px;
+}
+
+.issue-description-document blockquote {
+  margin: 12px 0;
+  padding: 2px 0 2px 13px;
+  border-left: 2px solid var(--border-strong);
+  color: var(--text-secondary);
+}
+
+.issue-description-document blockquote > :last-child {
+  margin-bottom: 0;
+}
+
+.issue-description-document code {
+  padding: 1px 5px;
+  border-radius: 4px;
+  background: var(--surface-muted);
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+  font-size: 0.9em;
+}
+
+.issue-description-document pre {
+  max-width: 100%;
+  margin: 12px 0;
+  padding: 11px 13px;
+  overflow: auto;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 7px;
+  background: var(--surface-muted);
+  font-size: 13px;
+  line-height: 20px;
+  white-space: pre;
+}
+
+.issue-description-document pre code {
+  padding: 0;
+  background: transparent;
+  font-size: inherit;
+}
+
+.issue-description-document table {
+  width: 100%;
+  margin: 12px 0;
+  border-spacing: 0;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 7px;
+  overflow: hidden;
+}
+
+.issue-description-document th,
+.issue-description-document td {
+  padding: 7px 9px;
+  border-right: var(--border-hairline) solid var(--border);
+  border-bottom: var(--border-hairline) solid var(--border);
+  text-align: left;
+  vertical-align: top;
+}
+
+.issue-description-document th {
+  background: var(--surface-muted);
+  font-weight: 600;
+}
+
+.issue-description-document tr > :last-child {
+  border-right: 0;
+}
+
+.issue-description-document tbody tr:last-child > * {
+  border-bottom: 0;
+}
+
+.issue-description-document hr {
+  height: 0;
+  margin: 18px 0;
+  border: 0;
+  border-top: var(--border-hairline) solid var(--border);
+}
+
+.issue-description-document img {
+  display: block;
+  max-width: 100%;
+  max-height: 600px;
+  height: auto;
+  margin: 10px 0;
+  border-radius: 8px;
+  object-fit: contain;
+}
+
+.issue-conversation-list {
+  display: grid;
+  justify-items: start;
+  gap: 8px;
+  margin-top: 18px;
+}
+
+.issue-conversation-link {
+  display: inline-flex;
+  align-items: stretch;
+  max-width: 100%;
+  min-width: 0;
+  min-height: 36px;
+  overflow: hidden;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 9px;
+  background: var(--surface);
+  color: var(--text-primary);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 3px 10px rgba(0, 0, 0, 0.025);
+  transition: border-color 100ms ease, background 100ms ease, box-shadow 100ms ease;
+}
+
+.issue-conversation-link:hover {
+  border-color: var(--border-strong);
+  background: var(--surface-hover);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.055), 0 4px 14px rgba(0, 0, 0, 0.04);
+}
+
+.issue-conversation-primary,
+.issue-conversation-open {
+  border: 0;
+  background: transparent;
+  color: inherit;
+  cursor: pointer;
+  font: inherit;
+}
+
+.issue-conversation-primary {
+  display: inline-flex;
+  flex: 1 1 auto;
+  align-items: center;
+  min-width: 0;
+  gap: 8px;
+  padding: 0 11px;
+  text-align: left;
+}
+
+.issue-conversation-open {
+  display: grid;
+  flex: 0 0 36px;
+  place-items: center;
+  width: 36px;
+  border-left: var(--border-hairline) solid var(--border);
+  color: var(--text-tertiary);
+}
+
+.issue-conversation-primary:hover,
+.issue-conversation-open:hover {
+  color: var(--text-primary);
+}
+
+.issue-conversation-primary:focus-visible,
+.issue-conversation-open:focus-visible {
+  outline: 0;
+  box-shadow: inset 0 0 0 2px var(--accent-soft);
+}
+
+.issue-conversation-primary > svg,
+.issue-conversation-open > svg {
+  flex: 0 0 auto;
+  width: 16px;
+  height: 16px;
+}
+
+.issue-conversation-primary > strong {
+  flex: 0 0 auto;
+  font-size: 11px;
+  font-weight: 600;
+}
+
+.conversation-divider {
+  flex: 0 0 auto;
+  width: 1px;
+  height: 15px;
+  background: var(--border);
+}
+
+.conversation-thread-id {
+  min-width: 0;
+  overflow: hidden;
+  color: var(--text-tertiary);
+  font-size: 10px;
+  font-variant-numeric: tabular-nums;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.issue-description-input::placeholder {
+  color: var(--text-tertiary);
+}
+
+.issue-attachments {
+  padding: 0 14px 30px;
+}
+
+.issue-sub-issues {
+  padding: 0 14px 28px;
+}
+
+.issue-sub-issues > header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  min-height: 30px;
+  gap: 12px;
+  margin-bottom: 5px;
+}
+
+.issue-sub-issues > header > div:first-child,
+.sub-issue-summary {
+  display: flex;
+  align-items: center;
+}
+
+.issue-sub-issues > header > div:first-child {
+  gap: 9px;
+}
+
+.issue-sub-issues h2 {
+  margin: 0;
+  color: var(--text-primary);
+  font-size: 13px;
+  font-weight: 560;
+  line-height: 20px;
+}
+
+.sub-issue-summary {
+  gap: 5px;
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-variant-numeric: tabular-nums;
+}
+
+.sub-issue-summary .sub-issue-progress {
+  border: 0;
+  background:
+    radial-gradient(circle at center, var(--bg) 52%, transparent 54%),
+    conic-gradient(var(--accent) var(--sub-issue-progress), var(--border) 0);
+}
+
+.issue-sub-issue-list {
+  overflow: hidden;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 7px;
+  background: var(--surface);
+}
+
+.issue-sub-issue-list .issue-relation-row + .issue-relation-row {
+  border-top: var(--border-hairline) solid var(--border);
+}
+
+.issue-sub-issue-list .issue-relation-row {
+  position: relative;
+}
+
+.issue-sub-issue-list .issue-relation-target {
+  padding-right: 8px;
+}
+
+.issue-sub-issue-list .issue-relation-row:hover .issue-relation-target,
+.issue-sub-issue-list .issue-relation-row:focus-within .issue-relation-target {
+  padding-right: 60px;
+}
+
+.issue-relation-row {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  min-height: 32px;
+  border-radius: 5px;
+}
+
+.issue-relation-row:hover,
+.issue-relation-row:focus-within {
+  background: var(--surface-hover);
+}
+
+.issue-relation-target {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  flex: 1;
+  height: 32px;
+  gap: 7px;
+  padding: 0 8px;
+  border: 0;
+  background: transparent;
+  color: var(--text-secondary);
+  text-align: left;
+}
+
+.issue-relation-target > svg {
+  flex: 0 0 auto;
+  width: 14px;
+  height: 14px;
+}
+
+.issue-relation-id {
+  flex: 0 0 auto;
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-variant-numeric: tabular-nums;
+}
+
+.issue-relation-title {
+  min-width: 0;
+  overflow: hidden;
+  font-size: 12px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.issue-sub-issue-list .actor-avatar.issue-relation-assignee {
+  width: 11px;
+  height: 11px;
+  margin-left: auto;
+  border-width: 1px;
+  font-size: 5px;
+}
+
+.issue-sub-issue-list .issue-relation-remove {
+  position: absolute;
+  right: 3px;
+  margin-right: 0;
+}
+
+.issue-sub-issue-list .issue-relation-thread {
+  position: absolute;
+  right: 29px;
+  margin-right: 0;
+}
+
+.issue-relation-thread,
+.issue-relation-remove {
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+  width: 26px;
+  height: 26px;
+  margin-right: 3px;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-tertiary);
+  opacity: 0;
+}
+
+.issue-relation-row:hover .issue-relation-thread,
+.issue-relation-row:focus-within .issue-relation-thread,
+.issue-relation-row:hover .issue-relation-remove,
+.issue-relation-row:focus-within .issue-relation-remove {
+  opacity: 1;
+}
+
+.issue-relation-thread:hover,
+.issue-relation-remove:hover {
+  background: var(--surface-active);
+  color: var(--text-primary);
+}
+
+.issue-relation-thread svg,
+.issue-relation-remove svg {
+  width: 13px;
+  height: 13px;
+}
+
+.issue-relation-picker {
+  position: relative;
+  flex: 0 0 auto;
+}
+
+.issue-relation-add {
+  display: flex;
+  align-items: center;
+  height: 26px;
+  gap: 4px;
+  padding: 0 6px;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-tertiary);
+  font-size: 11px;
+  transition: opacity 100ms ease, background-color 100ms ease, color 100ms ease;
+}
+
+.issue-relation-add:hover,
+.issue-relation-add[aria-expanded="true"] {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.issue-relation-add svg {
+  width: 13px;
+  height: 13px;
+}
+
+.issue-relation-popover {
+  position: absolute;
+  z-index: 1250;
+  top: 30px;
+  left: 0;
+  width: min(360px, calc(100vw - 32px));
+  padding: 6px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 11px;
+  background: var(--surface-raised);
+  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.14), 0 3px 10px rgba(0, 0, 0, 0.08);
+}
+
+.issue-relation-search {
+  display: flex;
+  align-items: center;
+  height: 34px;
+  gap: 7px;
+  padding: 0 8px;
+  border-bottom: var(--border-hairline) solid var(--border);
+}
+
+.issue-relation-search > svg {
+  flex: 0 0 auto;
+  width: 15px;
+  height: 15px;
+  color: var(--text-tertiary);
+}
+
+.issue-relation-search input {
+  min-width: 0;
+  width: 100%;
+  height: 30px;
+  padding: 0;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 12px;
+}
+
+.issue-relation-results {
+  max-height: 260px;
+  overflow-y: auto;
+  padding-top: 5px;
+}
+
+.issue-relation-results > button {
+  display: grid;
+  grid-template-columns: 16px max-content minmax(0, 1fr);
+  align-items: center;
+  width: 100%;
+  min-height: 34px;
+  gap: 7px;
+  padding: 0 8px;
+  border: 0;
+  border-radius: 6px;
+  background: transparent;
+  color: var(--text-secondary);
+  text-align: left;
+}
+
+.issue-relation-results > button:hover,
+.issue-relation-results > button.is-active {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.issue-relation-results > button > svg {
+  width: 14px;
+  height: 14px;
+}
+
+.issue-relation-option-id {
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-variant-numeric: tabular-nums;
+}
+
+.issue-relation-option-title {
+  min-width: 0;
+  overflow: hidden;
+  font-size: 12px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.issue-relation-empty {
+  margin: 0;
+  padding: 18px 8px;
+  color: var(--text-tertiary);
+  font-size: 12px;
+  text-align: center;
+}
+
+.attachments-heading {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  min-height: 28px;
+  gap: 12px;
+  margin-bottom: 7px;
+}
+
+.attachments-heading > div {
+  display: flex;
+  align-items: center;
+  gap: 7px;
+}
+
+.attachments-heading h2 {
+  margin: 0;
+  color: var(--text-primary);
+  font-size: 13px;
+  font-weight: 560;
+  line-height: 20px;
+}
+
+.attachments-heading > div > span {
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-variant-numeric: tabular-nums;
+}
+
+.attachment-add-button {
+  display: flex;
+  align-items: center;
+  height: 26px;
+  gap: 5px;
+  padding: 0 7px;
+  border: var(--border-hairline) solid transparent;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-secondary);
+  font-size: 11px;
+}
+
+.attachment-add-button:hover:not(:disabled) {
+  border-color: var(--border);
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.attachment-add-button svg {
+  width: 14px;
+  height: 14px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.25;
+}
+
+.attachment-list {
+  display: grid;
+  gap: 5px;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
+
+.attachment-list li {
+  display: flex;
+  align-items: center;
+  min-height: 48px;
+  padding: 4px 5px 4px 7px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 7px;
+  background: var(--surface);
+  transition: border-color 100ms ease, background 100ms ease;
+}
+
+.attachment-list li:hover,
+.attachment-list li:focus-within {
+  border-color: var(--border-strong);
+  background: color-mix(in srgb, var(--surface-hover) 48%, var(--surface));
+}
+
+.attachment-link {
+  display: flex;
+  align-items: center;
+  flex: 1;
+  min-width: 0;
+  gap: 9px;
+  color: inherit;
+  text-decoration: none;
+}
+
+.attachment-file-icon {
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+  width: 30px;
+  height: 30px;
+  border-radius: 5px;
+  background: var(--surface-muted);
+  color: var(--text-tertiary);
+}
+
+.attachment-file-icon svg {
+  width: 16px;
+  height: 16px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.2;
+}
+
+.attachment-copy {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  gap: 2px;
+}
+
+.attachment-copy strong {
+  overflow: hidden;
+  color: var(--text-primary);
+  font-size: 11px;
+  font-weight: 520;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.attachment-copy > span {
+  color: var(--text-tertiary);
+  font-size: 9px;
+}
+
+.attachment-actions {
+  display: flex;
+  flex: 0 0 auto;
+  gap: 1px;
+  margin-left: 6px;
+  opacity: 0;
+  transition: opacity 100ms ease;
+}
+
+.attachment-list li:hover .attachment-actions,
+.attachment-list li:focus-within .attachment-actions {
+  opacity: 1;
+}
+
+.attachment-actions a,
+.attachment-actions button {
+  display: grid;
+  place-items: center;
+  width: 26px;
+  height: 26px;
+  padding: 0;
+  border: 0;
+  border-radius: 4px;
+  background: transparent;
+  color: var(--text-tertiary);
+}
+
+.attachment-actions a:hover,
+.attachment-actions button:hover {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.attachment-actions button:hover {
+  color: var(--danger);
+}
+
+.attachment-actions svg {
+  width: 14px;
+  height: 14px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.25;
+}
+
+.attachments-empty {
+  margin: 0;
+  padding: 3px 0;
+  color: var(--text-tertiary);
+  font-size: 10px;
+  line-height: 18px;
+}
+
+.attachments-loading {
+  display: grid;
+  grid-template-columns: 30px minmax(0, 1fr);
+  align-items: center;
+  min-height: 48px;
+  gap: 9px;
+  padding: 7px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 7px;
+}
+
+.attachments-loading i {
+  height: 30px;
+  border-radius: 5px;
+  background: var(--surface-muted);
+  animation: shimmer 1.5s linear infinite;
+}
+
+.attachments-loading i:last-child {
+  height: 20px;
+  max-width: 210px;
+}
+
+.attachments-error {
+  margin-top: 7px;
+  padding: 6px 8px;
+  border-radius: 5px;
+  background: var(--danger-soft);
+  color: var(--danger);
+  font-size: 10px;
+}
+
+.activity-section {
+  position: relative;
+  padding: 22px 14px 60px;
+}
+
+.activity-section::before {
+  position: absolute;
+  top: 0;
+  right: 14px;
+  left: 14px;
+  border-top: var(--border-hairline) solid var(--border);
+  content: "";
+}
+
+.activity-heading {
+  display: flex;
+  align-items: center;
+  height: 28px;
+  gap: 7px;
+  margin: 0 0 10px;
+}
+
+.activity-heading h2,
+.issue-properties h2 {
+  margin: 0;
+  color: var(--text-primary);
+  font-size: 13px;
+  font-weight: 560;
+  line-height: 20px;
+}
+
+.activity-heading > span {
+  color: var(--text-tertiary);
+  font-size: 11px;
+  font-variant-numeric: tabular-nums;
+}
+
+.activity-stream {
+  position: relative;
+}
+
+.activity-entry {
+  position: relative;
+  display: flex;
+  align-items: center;
+  min-height: 36px;
+  gap: 9px;
+  padding: 5px 8px;
+}
+
+.activity-rail-icon {
+  z-index: 1;
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+  width: 24px;
+  height: 24px;
+  border: 4px solid var(--bg);
+  border-radius: 50%;
+  background: var(--bg);
+  color: var(--text-tertiary);
+}
+
+.activity-rail-icon svg {
+  width: 14px;
+  height: 14px;
+}
+
+.activity-entry p {
+  margin: 0;
+  color: var(--text-secondary);
+  font-size: 12px;
+}
+
+.activity-entry p strong {
+  color: var(--text-primary);
+  font-weight: 560;
+}
+
+.activity-entry .actor-id {
+  margin: 0 5px;
+}
+
+.activity-entry time,
+.comment-header time,
+.comment-header .actor-id,
+.comment-header .comment-edited {
+  color: var(--text-tertiary);
+}
+
+.activity-entry time::before {
+  margin: 0 5px;
+  content: "·";
+}
+
+.comment-entry {
+  position: relative;
+  display: block;
+  padding: 8px 0;
+}
+
+.actor-avatar {
+  z-index: 1;
+  display: grid;
+  place-items: center;
+  overflow: hidden;
+  flex: 0 0 auto;
+  width: 24px;
+  height: 24px;
+  border: 2px solid var(--bg);
+  border-radius: 50%;
+  color: white;
+  font-size: 9px;
+  font-weight: 650;
+}
+
+.actor-avatar-user {
+  border-radius: 50%;
+  background: #7167bf;
+}
+
+.actor-avatar-agent {
+  overflow: visible;
+  border: 0;
+  border-radius: 0;
+  background: transparent;
+}
+
+.actor-avatar-image {
+  display: block;
+  width: 100%;
+  height: 100%;
+  border-radius: inherit;
+  object-fit: cover;
+}
+
+.actor-avatar-agent-image {
+  border-radius: 0;
+  object-fit: contain;
+}
+
+.actor-avatar.card-assignee-avatar {
+  width: 16px;
+  height: 16px;
+  margin-left: auto;
+  border-width: 1px;
+  font-size: 7px;
+  transition: opacity 100ms ease;
+}
+
+.comment-card {
+  position: relative;
+  width: 100%;
+  min-width: min(300px, 100%);
+  overflow: visible;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 8px;
+  background: var(--surface);
+  box-shadow: var(--card-shadow);
+}
+
+.comment-header {
+  display: flex;
+  align-items: center;
+  min-height: 20px;
+  gap: 6px;
+  padding: 14px 14px 0 16px;
+}
+
+.comment-header .comment-avatar {
+  flex: 0 0 auto;
+  width: 20px;
+  height: 20px;
+  border: 0;
+}
+
+.comment-header strong {
+  color: var(--text-primary);
+  font-size: 13px;
+  font-weight: 560;
+  line-height: 20px;
+}
+
+.comment-header time,
+.comment-header .actor-id,
+.comment-header .comment-edited {
+  font-size: 11px;
+  line-height: 20px;
+}
+
+.comment-header .comment-edited::before {
+  margin-right: 6px;
+  content: "·";
+}
+
+.actor-id {
+  color: var(--text-tertiary);
+  font-size: 10px;
+  font-weight: 450;
+}
+
+.comment-header .actor-id::before,
+.composer-author .actor-id::before {
+  margin: 0;
+  content: none;
+}
+
+.comment-actions {
+  position: relative;
+  margin-left: auto;
+  opacity: 0;
+  transition: opacity 100ms ease;
+}
+
+.comment-card:hover .comment-actions,
+.comment-card:focus-within .comment-actions {
+  opacity: 1;
+}
+
+.comment-menu-trigger {
+  display: grid;
+  place-items: center;
+  width: 24px;
+  height: 22px;
+  padding: 0;
+  border: 0;
+  border-radius: 4px;
+  background: transparent;
+  color: var(--text-tertiary);
+}
+
+.comment-menu-trigger:hover,
+.comment-menu-trigger[aria-expanded="true"] {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.comment-menu-trigger svg {
+  width: 14px;
+  height: 14px;
+  fill: currentColor;
+}
+
+.comment-action-menu {
+  position: absolute;
+  z-index: 12;
+  top: 27px;
+  right: -2px;
+  width: 150px;
+  padding: 5px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 9px;
+  background: var(--surface-raised);
+  box-shadow: var(--dialog-shadow);
+  animation: context-menu-in 90ms ease-out both;
+}
+
+.comment-action-menu button {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 29px;
+  gap: 8px;
+  padding: 0 7px;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 11px;
+  text-align: left;
+}
+
+.comment-action-menu button:hover {
+  background: var(--surface-hover);
+}
+
+.comment-action-menu button.danger {
+  color: var(--danger);
+}
+
+.comment-action-menu svg {
+  width: 15px;
+  height: 15px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.3;
+}
+
+.comment-body {
+  min-height: 30px;
+  padding: 10px 16px 16px;
+  color: var(--text-primary);
+  font-size: 15px;
+  line-height: 24px;
+  overflow-wrap: anywhere;
+}
+
+.comment-body .issue-description-document {
+  display: block;
+}
+
+.comment-body .issue-description-document p,
+.comment-body .issue-description-document h1,
+.comment-body .issue-description-document h2,
+.comment-body .issue-description-document h3,
+.comment-body .issue-description-document h4,
+.comment-body .issue-description-document h5,
+.comment-body .issue-description-document h6 {
+  margin-bottom: 6px;
+}
+
+.comment-body .issue-description-document h1 {
+  margin-top: 12px;
+  font-size: 17px;
+  font-weight: 620;
+  line-height: 25px;
+}
+
+.comment-body .issue-description-document h2 {
+  margin-top: 10px;
+  font-size: 16px;
+  font-weight: 600;
+  line-height: 24px;
+}
+
+.comment-body .issue-description-document h3,
+.comment-body .issue-description-document h4,
+.comment-body .issue-description-document h5,
+.comment-body .issue-description-document h6 {
+  margin-top: 8px;
+  font-size: 15px;
+  font-weight: 600;
+  line-height: 24px;
+}
+
+.comment-body .issue-description-document > :first-child {
+  margin-top: 0;
+}
+
+.comment-body .issue-description-document p {
+  margin-bottom: 6px;
+}
+
+.comment-attachment-list {
+  display: grid;
+  gap: 5px;
+  margin: 0;
+  padding: 2px 16px 16px;
+  list-style: none;
+}
+
+.comment-conversation-link {
+  padding: 2px 16px 16px;
+}
+
+.comment-attachment-list li {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  min-height: 38px;
+  gap: 6px;
+  padding: 4px 5px 4px 6px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 6px;
+  background: var(--surface-muted);
+}
+
+.comment-attachment-list a {
+  display: flex;
+  align-items: center;
+  flex: 1;
+  min-width: 0;
+  gap: 7px;
+  color: inherit;
+  text-decoration: none;
+}
+
+.comment-attachment-list .attachment-file-icon {
+  width: 26px;
+  height: 26px;
+  background: var(--surface);
+}
+
+.comment-attachment-list a > span:last-child {
+  display: flex;
+  min-width: 0;
+  flex-direction: column;
+}
+
+.comment-attachment-list strong {
+  overflow: hidden;
+  color: var(--text-primary);
+  font-size: 10px;
+  font-weight: 520;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.comment-attachment-list small {
+  color: var(--text-tertiary);
+  font-size: 9px;
+}
+
+.comment-attachment-list > li > button,
+.comment-attach-button {
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+  width: 24px;
+  height: 24px;
+  padding: 0;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-tertiary);
+}
+
+.comment-attachment-list > li > button:hover,
+.comment-attach-button:hover:not(:disabled) {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.comment-attachment-list > li > button:hover {
+  color: var(--danger);
+}
+
+.comment-attachment-list > li > button svg,
+.comment-attach-button svg {
+  width: 14px;
+  height: 14px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.25;
+}
+
+.comment-edit-form {
+  padding: 10px 16px 16px;
+}
+
+.comment-edit-form textarea,
+.inline-media-composer textarea {
+  display: block;
+  width: 100%;
+  resize: none;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 12px;
+  line-height: 19px;
+}
+
+.comment-edit-form textarea {
+  min-height: 74px;
+  padding: 6px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 5px;
+  background: var(--bg);
+  resize: vertical;
+}
+
+.comment-edit-form > div {
+  display: flex;
+  justify-content: flex-end;
+  gap: 6px;
+  margin-top: 7px;
+}
+
+.comments-loading {
+  display: block;
+  padding: 8px 0;
+}
+
+.comments-loading i {
+  display: none;
+}
+
+.comments-loading i:last-child {
+  display: block;
+  height: 84px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 8px;
+  background: var(--surface);
+  box-shadow: var(--card-shadow);
+  animation: shimmer 1.5s linear infinite;
+}
+
+.comments-error {
+  margin: 5px 0 10px;
+  padding: 7px 9px;
+  border-radius: 5px;
+  background: var(--danger-soft);
+  color: var(--danger);
+  font-size: 10px;
+}
+
+.comment-composer {
+  margin: 18px 0 0;
+  overflow: hidden;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 8px;
+  background: var(--surface);
+  box-shadow: var(--card-shadow);
+  transition: border-color 100ms ease, box-shadow 100ms ease;
+}
+
+.composer-author {
+  display: flex;
+  align-items: center;
+  min-height: 34px;
+  gap: 6px;
+  padding: 12px 16px 0;
+}
+
+.composer-author .comment-avatar {
+  width: 20px;
+  height: 20px;
+  border: 0;
+}
+
+.composer-author strong {
+  font-size: 13px;
+  font-weight: 560;
+  line-height: 20px;
+}
+
+.comment-inline-media {
+  min-height: 106px;
+  padding: 10px 16px 14px;
+}
+
+.comment-inline-media textarea {
+  min-height: 24px;
+  padding: 0;
+  font-size: 15px;
+  line-height: 24px;
+}
+
+.comment-inline-media > textarea:only-child {
+  min-height: 82px;
+}
+
+.comment-inline-media textarea::placeholder {
+  color: var(--text-tertiary);
+}
+
+.comment-composer-files {
+  margin: 0;
+  padding: 0 12px 12px;
+}
+
+.comment-composer-files .composer-attachment-list {
+  margin-top: 6px;
+}
+
+.composer-footer {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  min-height: 40px;
+  gap: 10px;
+  padding: 5px 10px;
+  border-top: var(--border-hairline) solid var(--border);
+  color: var(--text-tertiary);
+  font-size: 10px;
+}
+
+.composer-footer > div {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.composer-footer-leading {
+  min-width: 0;
+}
+
+.composer-footer-leading > span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.composer-footer kbd {
+  color: var(--text-tertiary);
+  font-size: 9px;
+}
+
+.issue-properties {
+  position: sticky;
+  top: 24px;
+  min-width: 0;
+}
+
+.detail-open-thread-action {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  min-height: 36px;
+  gap: 8px;
+  margin-bottom: 12px;
+  padding: 0 10px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 8px;
+  background: var(--surface);
+  color: var(--text-primary);
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.035);
+  font-size: 12px;
+  font-weight: 560;
+  text-align: left;
+}
+
+.detail-open-thread-action:hover:not(:disabled) {
+  border-color: var(--border-strong);
+  background: var(--surface-hover);
+}
+
+.detail-open-thread-action:focus-visible {
+  outline: 0;
+  box-shadow: 0 0 0 2px var(--accent-soft);
+}
+
+.detail-open-thread-action:disabled {
+  cursor: default;
+  opacity: 0.55;
+}
+
+.detail-open-thread-action svg {
+  width: 16px;
+  height: 16px;
+}
+
+.issue-properties h2 {
+  height: 34px;
+  padding: 5px 7px;
+  color: var(--text-secondary);
+}
+
+.detail-property-row {
+  display: grid;
+  grid-template-columns: 18px 76px minmax(0, 1fr);
+  align-items: center;
+  width: 100%;
+  min-height: 36px;
+  gap: 7px;
+  padding: 4px 7px;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-secondary);
+  text-align: left;
+}
+
+.issue-relation-sidebar {
+  margin-top: 14px;
+  padding-top: 10px;
+  border-top: var(--border-hairline) solid var(--border);
+}
+
+.issue-properties .issue-relation-sidebar > h2 {
+  height: auto;
+  margin: 0 0 4px;
+  padding: 5px 7px;
+  font-size: 11px;
+  font-weight: 560;
+}
+
+.issue-relation-group {
+  color: var(--text-secondary);
+}
+
+.issue-relation-group > header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  min-height: 32px;
+  padding-left: 7px;
+}
+
+.issue-relation-group > header > span {
+  display: flex;
+  align-items: center;
+  gap: 7px;
+  color: var(--text-tertiary);
+  font-size: 11px;
+}
+
+.issue-relation-group > header > span svg {
+  width: 14px;
+  height: 14px;
+}
+
+.issue-relation-group.is-blocked-by > header > span {
+  color: #d99716;
+}
+
+.issue-relation-group.is-blocks > header > span {
+  color: var(--status-blocked);
+}
+
+.issue-relation-sidebar .issue-relation-popover {
+  right: 0;
+  left: auto;
+}
+
+.issue-relation-sidebar .issue-relation-add > span {
+  display: none;
+}
+
+.issue-relation-sidebar .issue-relation-row {
+  margin: 0 2px;
+}
+
+.detail-property-row:hover {
+  background: var(--surface-hover);
+}
+
+.detail-property-icon {
+  display: grid;
+  place-items: center;
+  width: 16px;
+  height: 16px;
+  color: var(--text-tertiary);
+}
+
+.detail-assignee-avatar {
+  width: 16px;
+  height: 16px;
+  border-width: 1px;
+  font-size: 7px;
+}
+
+.detail-property-icon svg {
+  width: 14px;
+  height: 14px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.25;
+}
+
+.detail-property-row .status-icon-progress { color: var(--status-progress); }
+.detail-property-row .status-icon-review { color: var(--status-review); }
+.detail-property-row .status-icon-blocked { color: var(--status-blocked); }
+.detail-property-row .status-icon-done { color: var(--status-done); }
+.detail-property-row .status-icon-canceled { color: var(--status-canceled); }
+
+.detail-property-label {
+  color: var(--text-tertiary);
+  font-size: 11px;
+}
+
+.detail-property-row select,
+.detail-property-row input {
+  min-width: 0;
+  width: 100%;
+  height: 26px;
+  padding: 0;
+  overflow: hidden;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: var(--text-secondary);
+  font-size: 12px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.detail-property-row select {
+  appearance: auto;
+}
+
+.detail-label-picker {
+  min-width: 0;
+  width: 100%;
+}
+
+.detail-label-trigger {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  width: 100%;
+  height: 26px;
+  padding: 0;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: var(--text-secondary);
+  font: inherit;
+  font-size: 12px;
+  text-align: left;
+}
+
+.detail-label-trigger > span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.detail-label-trigger:focus-visible {
+  color: var(--text-primary);
+}
+
+.detail-label-picker .label-popover {
+  top: 30px;
+}
+
+.detail-priority-bars {
+  display: flex;
+  align-items: end;
+  width: 15px;
+  height: 14px;
+  gap: 1.5px;
+}
+
+.detail-priority-bars i {
+  width: 3px;
+  border-radius: 1px;
+  background: var(--border-strong);
+}
+
+.detail-priority-bars i:nth-child(1) { height: 5px; }
+.detail-priority-bars i:nth-child(2) { height: 8px; }
+.detail-priority-bars i:nth-child(3) { height: 11px; }
+.detail-priority-bars i.active { background: currentColor; }
+.detail-priority-bars.priority-high { color: #ff7236; }
+.detail-priority-bars.priority-medium { color: var(--warning); }
+.detail-priority-bars.priority-low { color: var(--text-tertiary); }
+
+.detail-priority-urgent {
+  display: grid;
+  place-items: center;
+  width: 15px;
+  height: 15px;
+  border-radius: 4px;
+  background: #ff7236;
+  color: white;
+  font-size: 10px;
+  font-weight: 700;
+}
+
+.detail-timestamps {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  margin-top: 16px;
+  padding: 0 6px;
+  color: var(--text-tertiary);
+  font-size: 9px;
+  line-height: 16px;
+}
+
+.delete-backdrop {
+  position: fixed;
+  z-index: 80;
+  inset: 0;
+  display: grid;
+  place-items: center;
+  padding: 20px;
+  background: rgba(13, 14, 16, 0.32);
+  backdrop-filter: blur(1.5px);
+}
+
+.delete-dialog {
+  width: min(360px, 100%);
+  padding: 20px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 10px;
+  background: var(--surface-raised);
+  box-shadow: var(--dialog-shadow);
+}
+
+.delete-dialog h2 {
+  margin: 0 0 5px;
+  color: var(--text-primary);
+  font-size: 14px;
+  font-weight: 590;
+}
+
+.delete-dialog p {
+  margin: 0;
+  color: var(--text-secondary);
+  font-size: 11px;
+}
+
+.delete-dialog > div {
+  display: flex;
+  justify-content: flex-end;
+  gap: 7px;
+  margin-top: 22px;
+}
+
+.button.danger {
+  background: var(--danger);
+  color: white;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.14);
+}
+
+.button.danger:hover:not(:disabled) {
+  background: color-mix(in srgb, var(--danger) 88%, black);
+}
+
+:root[data-theme="dark"] .task-context-menu,
+:root[data-theme="dark"] .context-submenu {
+  box-shadow: 0 20px 52px rgba(0, 0, 0, 0.56), 0 4px 14px rgba(0, 0, 0, 0.34), 0 0 0 0.5px rgba(255, 255, 255, 0.055);
+}
+
+.task-context-menu {
+  position: fixed;
+  z-index: 1200;
+}
+
+.context-menu-group,
+.context-menu-item-anchor {
+  position: relative;
+}
+
+.context-menu-group {
+  display: flex;
+  flex-direction: column;
+}
+
+.context-menu-item {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 32px;
+  gap: 8px;
+  padding: 0 12px 0 8px;
+  border: 0;
+  border-radius: 6px;
+  outline: 0;
+  background: transparent;
+  color: inherit;
+  text-align: left;
+  white-space: nowrap;
+}
+
+.context-menu-item:hover:not(:disabled),
+.context-menu-item:focus-visible,
+.context-menu-item[data-open="true"] {
+  outline: 0;
+  background: var(--surface-active);
+}
+
+.context-menu-item:disabled {
+  cursor: default;
+  opacity: 0.46;
+}
+
+.context-menu-item.is-danger {
+  color: var(--danger);
+}
+
+.context-menu-item.is-danger:hover:not(:disabled),
+.context-menu-item.is-danger:focus-visible {
+  background: var(--danger-soft);
+}
+
+.context-menu-icon,
+.context-menu-check,
+.context-menu-chevron {
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+}
+
+.context-menu-icon {
+  width: 16px;
+  height: 16px;
+  color: var(--text-secondary);
+}
+
+.context-menu-item.is-danger .context-menu-icon {
+  color: inherit;
+}
+
+.context-menu-icon > svg,
+.context-menu-check > svg {
+  width: 16px;
+  height: 16px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.45;
+}
+
+.context-menu-label {
+  flex: 1 1 auto;
+  min-width: 0;
+}
+
+.context-menu-shortcut {
+  flex: 0 0 auto;
+  margin-left: auto;
+  color: var(--text-tertiary);
+  font-size: 12px;
+  font-variant-numeric: tabular-nums;
+}
+
+.context-menu-check {
+  width: 16px;
+  height: 16px;
+  margin-left: auto;
+  color: var(--text-primary);
+}
+
+.context-menu-shortcut + .context-menu-check {
+  margin-left: 2px;
+}
+
+.context-menu-chevron {
+  width: 10px;
+  height: 16px;
+  margin-left: 1px;
+  color: var(--text-tertiary);
+  font-size: 17px;
+  line-height: 16px;
+}
+
+.context-menu-divider {
+  height: 1px;
+  margin: 5px -6px;
+  background: var(--border);
+}
+
+.context-submenu {
+  --submenu-shift: 0px;
+  position: absolute;
+  z-index: 1;
+  top: -6px;
+  transform: translateY(var(--submenu-shift));
+}
+
+.task-context-menu[data-submenu-side="right"] .context-submenu {
+  left: calc(100% + 4px);
+}
+
+.task-context-menu[data-submenu-side="left"] .context-submenu {
+  right: calc(100% + 4px);
+}
+
+.labels-submenu {
+  max-height: min(360px, calc(100vh - 16px));
+  overflow-y: auto;
+  scrollbar-width: thin;
+}
+
+@keyframes context-menu-in {
+  from { opacity: 0; }
+  to { opacity: 1; }
+}
+
+.error-banner {
+  display: flex;
+  align-items: center;
+  flex: 0 0 auto;
+  gap: 9px;
+  min-height: 38px;
+  margin: 8px 12px 0;
+  padding: 6px 8px;
+  border: var(--border-hairline) solid color-mix(in srgb, var(--danger) 30%, var(--border));
+  border-radius: 6px;
+  background: var(--danger-soft);
+}
+
+.error-mark {
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+  width: 20px;
+  height: 20px;
+  border-radius: 50%;
+  background: var(--danger);
+  color: white;
+  font-size: 10px;
+  font-weight: 700;
+}
+
+.error-banner div { min-width: 0; }
+.error-banner strong { color: var(--text-primary); font-size: 10px; font-weight: 550; }
+.error-banner p { margin: 0; color: var(--text-secondary); font-size: 10px; }
+
+.error-banner button {
+  margin-left: auto;
+  padding: 3px 7px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 4px;
+  background: var(--surface);
+  color: var(--danger);
+  font-size: 10px;
+}
+
+.loading-board {
+  display: flex;
+  flex: 1;
+  min-height: 0;
+  gap: 16px;
+  padding: 8px 10px 48px;
+  overflow: hidden;
+}
+
+.loading-column {
+  position: relative;
+  flex: 0 0 340px;
+  padding-top: 44px;
+}
+
+.loading-column span,
+.loading-column div {
+  display: block;
+  border-radius: 6px;
+  background: linear-gradient(90deg, var(--surface-muted), var(--surface), var(--surface-muted));
+  background-size: 220% 100%;
+  animation: shimmer 1.5s linear infinite;
+}
+
+.loading-column span {
+  position: absolute;
+  width: 84px;
+  height: 10px;
+  margin: -42px 0 0 8px;
+}
+
+.loading-column div {
+  height: 96px;
+  margin-bottom: 8px;
+  border: var(--border-hairline) solid var(--border);
+}
+
+.page-empty {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  min-height: 0;
+  padding: 32px 20px;
+  color: var(--text-tertiary);
+  text-align: center;
+}
+
+.page-empty h2 {
+  margin: 12px 0 3px;
+  color: var(--text-primary);
+  font-size: 14px;
+  font-weight: 500;
+}
+
+.page-empty p {
+  max-width: 380px;
+  margin: 0 0 12px;
+  font-size: 11px;
+}
+
+.page-empty code {
+  margin-bottom: 12px;
+  padding: 5px 7px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 4px;
+  background: var(--surface);
+  color: var(--text-secondary);
+  font-size: 10px;
+}
+
+.workflow-board {
+  --workflow-edge: color-mix(in srgb, var(--text-tertiary) 72%, transparent);
+  --workflow-grid-dot: color-mix(in srgb, var(--text-tertiary) 42%, transparent);
+  --workflow-minimap-mask: color-mix(in srgb, var(--bg) 78%, transparent);
+  --workflow-library-width: 218px;
+  --workflow-inspector-width: 276px;
+  --workflow-titlebar-height: 48px;
+  display: grid;
+  flex: 1;
+  grid-template-columns: var(--workflow-library-width) minmax(0, 1fr) var(--workflow-inspector-width);
+  min-width: 0;
+  min-height: 0;
+  overflow: hidden;
+  background: var(--bg);
+  transition: grid-template-columns 180ms cubic-bezier(0.2, 0.8, 0.2, 1);
+}
+
+.workflow-board.workflow-library-collapsed {
+  --workflow-library-width: 0px;
+}
+
+.workflow-board.workflow-inspector-collapsed {
+  --workflow-inspector-width: 0px;
+}
+
+.workflow-board-loading {
+  display: grid;
+  flex: 1;
+  min-height: 0;
+  place-items: center;
+  background: var(--bg);
+  color: var(--text-tertiary);
+  font-size: 10px;
+}
+
+.workflow-library,
+.workflow-inspector {
+  position: relative;
+  z-index: 3;
+  display: flex;
+  min-width: 0;
+  min-height: 0;
+  flex-direction: column;
+  background: color-mix(in srgb, var(--surface) 94%, var(--bg));
+}
+
+.workflow-library {
+  border-right: var(--border-hairline) solid var(--border);
+}
+
+.workflow-inspector {
+  border-left: var(--border-hairline) solid var(--border);
+}
+
+.workflow-panel-heading {
+  display: flex;
+  flex: 0 0 var(--workflow-titlebar-height);
+  height: var(--workflow-titlebar-height);
+  align-items: center;
+  justify-content: space-between;
+  padding: 0 12px;
+  border-bottom: var(--border-hairline) solid var(--border);
+  color: var(--text-primary);
+  font-size: 11px;
+  font-weight: 550;
+}
+
+.workflow-panel-toggle,
+.workflow-toolbar-panel-toggle {
+  display: grid;
+  flex: 0 0 auto;
+  place-items: center;
+  width: 24px;
+  height: 24px;
+  padding: 0;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-tertiary);
+  cursor: pointer;
+}
+
+.workflow-panel-toggle:hover,
+.workflow-toolbar-panel-toggle:hover {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.workflow-panel-toggle:focus-visible,
+.workflow-toolbar-panel-toggle:focus-visible {
+  outline: 2px solid var(--accent);
+  outline-offset: 1px;
+}
+
+.workflow-panel-toggle svg,
+.workflow-toolbar-panel-toggle svg {
+  width: 14px;
+  height: 14px;
+}
+
+.workflow-library.is-collapsed,
+.workflow-inspector.is-collapsed {
+  overflow: hidden;
+  border: 0;
+  opacity: 0;
+  pointer-events: none;
+  visibility: hidden;
+}
+
+.workflow-node-search {
+  display: flex;
+  flex: 0 0 30px;
+  align-items: center;
+  gap: 7px;
+  margin: 10px 10px 5px;
+  padding: 0 8px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 6px;
+  background: var(--surface);
+  color: var(--text-tertiary);
+}
+
+.workflow-node-search svg {
+  flex: 0 0 auto;
+  width: 13px;
+  height: 13px;
+}
+
+.workflow-node-search input {
+  width: 100%;
+  min-width: 0;
+  padding: 0;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 10px;
+}
+
+.workflow-node-search input::placeholder {
+  color: var(--text-tertiary);
+}
+
+.workflow-node-groups {
+  flex: 1;
+  min-height: 0;
+  padding: 4px 8px 18px;
+  overflow-y: auto;
+  scrollbar-width: none;
+}
+
+.workflow-node-groups::-webkit-scrollbar {
+  display: none;
+  width: 0;
+  height: 0;
+}
+
+.workflow-node-group {
+  margin-top: 13px;
+}
+
+.workflow-node-group h2 {
+  margin: 0 5px 5px;
+  color: var(--text-tertiary);
+  font-size: 9px;
+  font-weight: 550;
+  letter-spacing: 0.02em;
+}
+
+.workflow-palette-item {
+  --node-tone: var(--accent);
+  display: grid;
+  grid-template-columns: 28px minmax(0, 1fr) 14px;
+  align-items: center;
+  width: 100%;
+  min-height: 45px;
+  gap: 8px;
+  padding: 5px 6px;
+  border: 0;
+  border-radius: 6px;
+  background: transparent;
+  color: var(--text-primary);
+  cursor: grab;
+  text-align: left;
+}
+
+.workflow-palette-item:hover {
+  background: var(--surface-hover);
+}
+
+.workflow-palette-item:active {
+  background: var(--surface-active);
+  cursor: grabbing;
+}
+
+.workflow-native-drag-image {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 1px;
+  height: 1px;
+  opacity: 0;
+  pointer-events: none;
+}
+
+.workflow-palette-drag-preview {
+  position: fixed;
+  z-index: 10000;
+  width: 250px;
+  height: 138px;
+  opacity: 0.96;
+  pointer-events: none;
+  transform-origin: center;
+  transition:
+    width 140ms cubic-bezier(0.2, 0.8, 0.2, 1),
+    height 140ms cubic-bezier(0.2, 0.8, 0.2, 1);
+  will-change: left, top, width, height;
+}
+
+.workflow-palette-drag-preview.is-compact {
+  width: 230px;
+  height: 34px;
+}
+
+.workflow-palette-drag-preview > .workflow-node,
+.workflow-palette-drag-preview > .workflow-plan-container,
+.workflow-palette-drag-preview > .workflow-node-compact {
+  width: 100%;
+}
+
+.workflow-palette-drag-preview > .workflow-plan-container,
+.workflow-palette-drag-preview > .workflow-node-compact {
+  height: 100%;
+}
+
+.workflow-palette-icon,
+.workflow-inspector-title > span {
+  display: grid;
+  place-items: center;
+  width: 28px;
+  height: 28px;
+  border: var(--border-hairline) solid color-mix(in srgb, var(--node-tone) 32%, var(--border));
+  border-radius: 7px;
+  background: color-mix(in srgb, var(--node-tone) 9%, var(--surface));
+  color: var(--node-tone);
+}
+
+.workflow-palette-icon svg,
+.workflow-inspector-title > span svg {
+  width: 14px;
+  height: 14px;
+}
+
+.workflow-brand-logo {
+  display: block;
+  width: 16px;
+  height: 16px;
+  object-fit: contain;
+  pointer-events: none;
+  user-select: none;
+}
+
+:root[data-theme="dark"] .workflow-brand-logo.monochrome {
+  filter: invert(1);
+}
+
+.workflow-palette-item > span:nth-child(2) {
+  display: flex;
+  min-width: 0;
+  flex-direction: column;
+}
+
+.workflow-palette-item strong {
+  font-size: 10px;
+  font-weight: 520;
+}
+
+.workflow-palette-item small {
+  overflow: hidden;
+  color: var(--text-tertiary);
+  font-size: 9px;
+  font-weight: 450;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-palette-add {
+  width: 13px;
+  height: 13px;
+  color: var(--text-tertiary);
+  opacity: 0;
+}
+
+.workflow-palette-item:hover .workflow-palette-add,
+.workflow-palette-item:focus-visible .workflow-palette-add {
+  opacity: 1;
+}
+
+.workflow-palette-issue,
+.workflow-inspector-issue {
+  --node-tone: #6e78df;
+}
+
+.workflow-palette-capability,
+.workflow-inspector-capability {
+  --node-tone: #4777d4;
+}
+
+.workflow-palette-api,
+.workflow-inspector-api {
+  --node-tone: #2b8a66;
+}
+
+.workflow-palette-integration,
+.workflow-inspector-integration {
+  --node-tone: #2f7f9d;
+}
+
+.workflow-palette-development,
+.workflow-inspector-development {
+  --node-tone: #c15f3c;
+}
+
+.workflow-palette-planning,
+.workflow-inspector-planning {
+  --node-tone: #b7791f;
+}
+
+.workflow-palette-result,
+.workflow-inspector-result {
+  --node-tone: #a75ac4;
+}
+
+.workflow-library-empty {
+  margin: 18px 8px;
+  color: var(--text-tertiary);
+  font-size: 10px;
+  text-align: center;
+}
+
+.workflow-canvas-shell {
+  display: flex;
+  min-width: 0;
+  min-height: 0;
+  flex-direction: column;
+  overflow: hidden;
+  background: var(--bg);
+}
+
+.workflow-canvas-toolbar {
+  position: relative;
+  z-index: 4;
+  display: flex;
+  flex: 0 0 var(--workflow-titlebar-height);
+  height: var(--workflow-titlebar-height);
+  align-items: stretch;
+  justify-content: space-between;
+  min-width: 0;
+  gap: 8px;
+  padding: 0 8px 0 10px;
+  background: color-mix(in srgb, var(--header-bg) 95%, transparent);
+  box-shadow: inset 0 calc(-1 * var(--border-hairline)) 0 var(--border);
+}
+
+.workflow-toolbar-panel-toggle {
+  align-self: center;
+}
+
+.workflow-persistence-error {
+  align-self: center;
+  flex: 0 0 auto;
+  color: var(--danger);
+  font-size: 10px;
+  white-space: nowrap;
+}
+
+.workflow-tabs {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+}
+
+.workflow-tabs {
+  align-items: flex-end;
+  flex: 1;
+  gap: 2px;
+  overflow-x: auto;
+  overflow-y: hidden;
+  scrollbar-width: none;
+}
+
+.workflow-tabs::-webkit-scrollbar {
+  display: none;
+}
+
+.workflow-tab,
+.workflow-tab-add {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 auto;
+  height: 40px;
+  padding: 0;
+  border: var(--border-hairline) solid transparent;
+  outline: 0;
+  background: transparent;
+  color: var(--text-tertiary);
+}
+
+.workflow-tab {
+  max-width: 210px;
+  gap: 7px;
+  padding: 0 17px;
+  border-bottom: 0;
+  border-radius: 12px 12px 0 0;
+  font-size: 10px;
+  font-weight: 520;
+}
+
+.workflow-tab > span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-tab svg,
+.workflow-tab-add svg {
+  width: 14px;
+  height: 14px;
+  flex: 0 0 auto;
+}
+
+.workflow-tab:hover,
+.workflow-tab-add:hover {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.workflow-tab:focus-visible,
+.workflow-tab-add:focus-visible {
+  box-shadow: inset 0 0 0 2px var(--accent-soft);
+}
+
+.workflow-tab.is-active {
+  z-index: 1;
+  height: 40px;
+  margin-bottom: 0;
+  border-color: var(--border-strong);
+  border-bottom: 0;
+  background: var(--bg);
+  color: var(--text-primary);
+  font-weight: 570;
+}
+
+.workflow-tab.is-renaming {
+  padding-right: 10px;
+}
+
+.workflow-tab.is-renaming input {
+  width: min(152px, 20vw);
+  min-width: 72px;
+  height: 24px;
+  padding: 0 5px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 5px;
+  outline: 0;
+  background: var(--surface);
+  color: var(--text-primary);
+  font: inherit;
+}
+
+.workflow-tab-add {
+  width: 38px;
+  margin: 0 2px;
+  border-radius: 7px;
+}
+
+.workflow-canvas {
+  position: relative;
+  flex: 1;
+  min-width: 0;
+  min-height: 0;
+  background:
+    radial-gradient(circle at 50% 0, color-mix(in srgb, var(--accent) 4%, transparent), transparent 42%),
+    var(--bg);
+}
+
+.workflow-canvas::after {
+  position: absolute;
+  z-index: 8;
+  inset: 8px;
+  border: 1px dashed transparent;
+  border-radius: 9px;
+  background: transparent;
+  box-shadow: inset 0 0 0 0 transparent;
+  content: "";
+  opacity: 0;
+  pointer-events: none;
+  transition:
+    border-color 120ms ease,
+    background-color 120ms ease,
+    box-shadow 120ms ease,
+    opacity 120ms ease;
+}
+
+.workflow-canvas.is-palette-dragging::after {
+  border-color: color-mix(in srgb, var(--accent) 52%, var(--border));
+  background: color-mix(in srgb, var(--accent-soft) 10%, transparent);
+  box-shadow: inset 0 0 24px color-mix(in srgb, var(--accent-soft) 22%, transparent);
+  opacity: 1;
+}
+
+.workflow-canvas .react-flow {
+  color: var(--text-primary);
+}
+
+.workflow-canvas .react-flow__pane {
+  cursor: grab;
+}
+
+.workflow-canvas .react-flow__pane:active {
+  cursor: grabbing;
+}
+
+.workflow-canvas .react-flow__selection {
+  border: 1px solid color-mix(in srgb, var(--accent) 62%, transparent);
+  background: color-mix(in srgb, var(--accent) 7%, transparent);
+}
+
+.workflow-canvas .react-flow__edge-path {
+  transition: stroke 100ms ease, stroke-width 100ms ease;
+}
+
+.workflow-canvas .react-flow__edge.selected .react-flow__edge-path,
+.workflow-canvas .react-flow__edge:hover .react-flow__edge-path {
+  stroke: var(--accent) !important;
+  stroke-width: 1.8px !important;
+}
+
+.workflow-canvas .react-flow__node-workflow {
+  width: 250px;
+  border: 0;
+  outline: 0;
+  background: transparent;
+}
+
+.workflow-node {
+  --node-tone: var(--accent);
+  position: relative;
+  width: 250px;
+  overflow: visible;
+  border: 1px solid var(--border-strong);
+  border-radius: 9px;
+  background: var(--surface-raised);
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.045), 0 8px 24px rgba(0, 0, 0, 0.035);
+  transition: border-color 100ms ease, box-shadow 100ms ease, transform 100ms ease;
+}
+
+.workflow-node:hover {
+  border-color: color-mix(in srgb, var(--node-tone) 38%, var(--border-strong));
+}
+
+.workflow-node.selected {
+  border-color: color-mix(in srgb, var(--node-tone) 72%, var(--border-strong));
+  box-shadow:
+    0 0 0 2px color-mix(in srgb, var(--node-tone) 12%, transparent),
+    0 8px 26px rgba(0, 0, 0, 0.07);
+}
+
+.workflow-plan-container {
+  --node-tone: #b7791f;
+  position: relative;
+  width: 100%;
+  height: 100%;
+  overflow: visible;
+  border: 1px solid var(--border-strong);
+  border-radius: 9px;
+  background: var(--surface-raised);
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.045), 0 8px 24px rgba(0, 0, 0, 0.035);
+  transition: border-color 120ms ease, box-shadow 120ms ease, background-color 120ms ease;
+}
+
+.workflow-plan-container.selected {
+  border-color: color-mix(in srgb, var(--node-tone) 70%, var(--border-strong));
+  box-shadow:
+    0 0 0 2px color-mix(in srgb, var(--node-tone) 12%, transparent),
+    0 8px 26px rgba(0, 0, 0, 0.07);
+}
+
+.workflow-plan-container.is-drop-target {
+  border-color: color-mix(in srgb, var(--accent) 78%, var(--border-strong));
+  background: color-mix(in srgb, var(--accent-soft) 32%, var(--surface-raised));
+  box-shadow:
+    0 0 0 4px color-mix(in srgb, var(--accent-soft) 60%, transparent),
+    0 8px 26px rgba(0, 0, 0, 0.07);
+}
+
+.workflow-plan-container-header {
+  display: grid;
+  grid-template-columns: 31px minmax(0, 1fr) 20px;
+  align-items: center;
+  min-height: 50px;
+  gap: 8px;
+  padding: 8px 8px 7px 10px;
+  border-bottom: var(--border-hairline) solid var(--border);
+}
+
+.workflow-plan-container-summary {
+  display: flex;
+  align-items: center;
+  min-height: 36px;
+  padding: 7px 10px;
+  color: var(--text-tertiary);
+  font-size: 9px;
+}
+
+.workflow-plan-container-summary p {
+  margin: 0;
+  color: var(--text-secondary);
+  font-size: 9px;
+}
+
+.workflow-plan-drop-zone {
+  position: absolute;
+  inset: 82px 8px 33px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 5px;
+  border: 1px dashed transparent;
+  border-radius: 6px;
+  color: var(--text-tertiary);
+  font-size: 8px;
+  transition: border-color 120ms ease, color 120ms ease, background-color 120ms ease;
+}
+
+.workflow-plan-drop-zone:has(span) {
+  border-color: color-mix(in srgb, var(--node-tone) 22%, var(--border));
+}
+
+.workflow-plan-container.is-drop-target .workflow-plan-drop-zone {
+  border-color: color-mix(in srgb, var(--accent) 62%, var(--border));
+  background: color-mix(in srgb, var(--accent-soft) 24%, transparent);
+  color: var(--accent);
+}
+
+.workflow-plan-drop-zone svg {
+  width: 11px;
+  height: 11px;
+}
+
+.workflow-plan-container-footer {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  min-height: 32px;
+  padding: 6px 10px;
+  border-top: var(--border-hairline) solid var(--border);
+  color: var(--text-tertiary);
+  font-size: 8px;
+}
+
+.workflow-plan-container:hover .workflow-node-menu,
+.workflow-plan-container.selected .workflow-node-menu {
+  opacity: 1;
+}
+
+.workflow-node-compact {
+  --node-tone: var(--accent);
+  position: relative;
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+  gap: 7px;
+  padding: 5px 7px;
+  overflow: visible;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 6px;
+  background: var(--surface);
+  box-shadow: none;
+  transition:
+    border-color 100ms ease,
+    background-color 100ms ease,
+    box-shadow 100ms ease,
+    transform 160ms cubic-bezier(0.2, 0.8, 0.2, 1);
+}
+
+.workflow-node-compact:hover {
+  border-color: color-mix(in srgb, var(--node-tone) 42%, var(--border-strong));
+  background: color-mix(in srgb, var(--node-tone) 4%, var(--surface));
+}
+
+.workflow-node-compact.selected {
+  border-color: color-mix(in srgb, var(--node-tone) 72%, var(--border-strong));
+  background: color-mix(in srgb, var(--node-tone) 7%, var(--surface));
+}
+
+.workflow-node-compact.is-drag-shifted {
+  will-change: transform;
+}
+
+.workflow-node-compact.is-dragging {
+  border-color: color-mix(in srgb, var(--node-tone) 68%, var(--border-strong));
+  background: var(--surface-raised);
+  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
+  cursor: grabbing;
+}
+
+.workflow-node-compact.is-settling {
+  animation: workflow-plan-item-settle 200ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
+}
+
+@keyframes workflow-plan-item-settle {
+  from {
+    opacity: 0.38;
+    transform: translateY(-4px) scale(0.975);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0) scale(1);
+  }
+}
+
+.workflow-node-compact > strong {
+  min-width: 0;
+  overflow: hidden;
+  color: var(--text-primary);
+  font-size: 9px;
+  font-weight: 550;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-node-compact .workflow-node-icon {
+  width: 22px;
+  height: 22px;
+  flex: 0 0 22px;
+  border-radius: 5px;
+}
+
+.workflow-node-compact .workflow-node-icon svg {
+  width: 12px;
+  height: 12px;
+}
+
+.workflow-node-compact .workflow-node-icon .workflow-brand-logo {
+  width: 14px;
+  height: 14px;
+}
+
+.workflow-node-issue {
+  --node-tone: #6e78df;
+}
+
+.workflow-node-capability {
+  --node-tone: #4777d4;
+}
+
+.workflow-node-api {
+  --node-tone: #2b8a66;
+}
+
+.workflow-node-integration {
+  --node-tone: #2f7f9d;
+}
+
+.workflow-node-development {
+  --node-tone: #c15f3c;
+}
+
+.workflow-node-planning {
+  --node-tone: #b7791f;
+}
+
+.workflow-node-result {
+  --node-tone: #a75ac4;
+}
+
+.workflow-node-header {
+  display: grid;
+  grid-template-columns: 31px minmax(0, 1fr) 20px;
+  align-items: center;
+  min-height: 50px;
+  gap: 8px;
+  padding: 8px 8px 7px 10px;
+  border-bottom: var(--border-hairline) solid var(--border);
+}
+
+.workflow-node-icon {
+  display: grid;
+  place-items: center;
+  width: 31px;
+  height: 31px;
+  border: var(--border-hairline) solid color-mix(in srgb, var(--node-tone) 32%, var(--border));
+  border-radius: 8px;
+  background: color-mix(in srgb, var(--node-tone) 9%, var(--surface));
+  color: var(--node-tone);
+}
+
+.workflow-node-icon svg {
+  width: 15px;
+  height: 15px;
+}
+
+.workflow-node-icon .workflow-brand-logo {
+  width: 18px;
+  height: 18px;
+}
+
+.workflow-node-heading {
+  display: flex;
+  min-width: 0;
+  flex-direction: column;
+}
+
+.workflow-node-heading > span {
+  color: var(--node-tone);
+  font-size: 7px;
+  font-weight: 650;
+  letter-spacing: 0.08em;
+}
+
+.workflow-node-heading strong {
+  overflow: hidden;
+  color: var(--text-primary);
+  font-size: 11px;
+  font-weight: 550;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-node-menu {
+  display: grid;
+  place-items: center;
+  width: 20px;
+  height: 20px;
+  color: var(--text-tertiary);
+  opacity: 0;
+}
+
+.workflow-node:hover .workflow-node-menu,
+.workflow-node.selected .workflow-node-menu {
+  opacity: 1;
+}
+
+.workflow-node-menu svg {
+  width: 13px;
+  height: 13px;
+}
+
+.workflow-node-body {
+  min-height: 57px;
+  padding: 9px 11px;
+}
+
+.workflow-node-body p {
+  margin: 0 0 5px;
+  color: var(--text-secondary);
+  font-size: 10px;
+}
+
+.workflow-node-body > span {
+  display: inline-flex;
+  max-width: 100%;
+  padding: 2px 5px;
+  overflow: hidden;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 4px;
+  background: var(--surface-muted);
+  color: var(--text-tertiary);
+  font-size: 8px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-node-footer {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  min-height: 29px;
+  padding: 5px 10px;
+  border-top: var(--border-hairline) solid var(--border);
+  color: var(--text-tertiary);
+  font-size: 8px;
+}
+
+.workflow-node-state {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+}
+
+.workflow-node-state i {
+  width: 5px;
+  height: 5px;
+  border-radius: 50%;
+  background: var(--success);
+}
+
+.workflow-node-handle {
+  width: 11px !important;
+  height: 11px !important;
+  border: 2px solid var(--surface-raised) !important;
+  background: var(--node-tone) !important;
+  box-shadow: 0 0 0 1px color-mix(in srgb, var(--node-tone) 60%, var(--border-strong));
+  transition: transform 100ms ease, box-shadow 100ms ease;
+}
+
+.workflow-node-handle:hover {
+  transform: translateY(-50%) scale(1.22);
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--node-tone) 14%, transparent);
+}
+
+.workflow-node-handle-input {
+  left: -6px !important;
+}
+
+.workflow-node-handle-output {
+  right: -6px !important;
+}
+
+.workflow-flow-controls.react-flow__controls {
+  overflow: hidden;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 7px;
+  background: var(--surface-raised);
+  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.07);
+}
+
+.workflow-flow-controls .react-flow__controls-button {
+  width: 26px;
+  height: 26px;
+  border-bottom: var(--border-hairline) solid var(--border);
+  background: var(--surface-raised);
+  color: var(--text-secondary);
+}
+
+.workflow-flow-controls .react-flow__controls-button:hover {
+  background: var(--surface-hover);
+}
+
+.workflow-flow-controls .react-flow__controls-button svg {
+  max-width: 12px;
+  max-height: 12px;
+  fill: currentColor;
+}
+
+.workflow-minimap.react-flow__minimap {
+  width: 126px;
+  height: 82px;
+  overflow: hidden;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 7px;
+  background: var(--surface-raised);
+  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.06);
+}
+
+.workflow-inspector-content {
+  flex: 1;
+  min-height: 0;
+  padding: 14px 12px 22px;
+  overflow-y: auto;
+  scrollbar-width: thin;
+}
+
+.workflow-inspector-title {
+  --node-tone: var(--accent);
+  display: grid;
+  grid-template-columns: 34px minmax(0, 1fr);
+  align-items: center;
+  gap: 9px;
+  padding-bottom: 14px;
+}
+
+.workflow-inspector-title > span {
+  width: 34px;
+  height: 34px;
+}
+
+.workflow-inspector-title > div {
+  display: flex;
+  min-width: 0;
+  flex-direction: column;
+}
+
+.workflow-inspector-title small {
+  color: var(--node-tone);
+  font-size: 7px;
+  font-weight: 650;
+  letter-spacing: 0.08em;
+}
+
+.workflow-inspector-title strong {
+  overflow: hidden;
+  color: var(--text-primary);
+  font-size: 12px;
+  font-weight: 550;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-config-section {
+  padding: 13px 0;
+  border-top: var(--border-hairline) solid var(--border);
+}
+
+.workflow-config-section h2 {
+  margin: 0 0 9px;
+  color: var(--text-secondary);
+  font-size: 9px;
+  font-weight: 550;
+}
+
+.workflow-config-section label {
+  display: flex;
+  flex-direction: column;
+  gap: 5px;
+  margin-top: 9px;
+  color: var(--text-tertiary);
+  font-size: 8px;
+}
+
+.workflow-config-section input,
+.workflow-config-section textarea,
+.workflow-config-section select {
+  width: 100%;
+  padding: 6px 7px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 5px;
+  outline: 0;
+  background: var(--surface);
+  color: var(--text-primary);
+  font-size: 9px;
+  line-height: 1.45;
+  resize: vertical;
+}
+
+.workflow-config-section input,
+.workflow-config-section select {
+  height: 29px;
+}
+
+.workflow-config-section input:disabled,
+.workflow-config-section select:disabled {
+  opacity: 0.48;
+}
+
+.workflow-action-row {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) 118px;
+  align-items: center;
+  gap: 8px;
+  margin-top: 9px;
+}
+
+.workflow-config-section .workflow-action-toggle {
+  display: inline-flex;
+  align-items: center;
+  flex-direction: row;
+  min-width: 0;
+  gap: 6px;
+  margin-top: 0;
+  color: var(--text-secondary);
+  font-size: 9px;
+}
+
+.workflow-config-section .workflow-action-toggle input[type="checkbox"] {
+  width: 12px;
+  height: 12px;
+  flex: 0 0 12px;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  border-radius: 3px;
+  accent-color: var(--accent);
+}
+
+.workflow-action-toggle-full {
+  margin-top: 10px !important;
+}
+
+.workflow-port-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  min-height: 28px;
+  color: var(--text-tertiary);
+  font-size: 9px;
+}
+
+.workflow-port-row > span {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.workflow-port-row i {
+  width: 7px;
+  height: 7px;
+  border: 1.5px solid var(--text-tertiary);
+  border-radius: 50%;
+}
+
+.workflow-port-row i.output {
+  border-color: var(--accent);
+  background: var(--accent);
+}
+
+.workflow-port-row strong {
+  color: var(--text-secondary);
+  font-size: 9px;
+  font-weight: 500;
+}
+
+.workflow-context-field {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto 12px;
+  align-items: center;
+  width: 100%;
+  min-height: 32px;
+  gap: 6px;
+  padding: 0 7px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 5px;
+  background: var(--surface);
+  color: var(--text-secondary);
+  font-size: 9px;
+  text-align: left;
+}
+
+.workflow-context-field > span {
+  display: inline-flex;
+  align-items: center;
+  min-width: 0;
+  gap: 6px;
+}
+
+.workflow-context-field strong {
+  max-width: 80px;
+  overflow: hidden;
+  color: var(--text-tertiary);
+  font-size: 8px;
+  font-weight: 450;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.workflow-context-field svg {
+  width: 12px;
+  height: 12px;
+}
+
+.workflow-inspector-empty {
+  display: flex;
+  flex: 1;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+  padding: 24px;
+  color: var(--text-tertiary);
+  text-align: center;
+}
+
+.workflow-inspector-empty > span {
+  display: grid;
+  place-items: center;
+  width: 34px;
+  height: 34px;
+  margin-bottom: 9px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 8px;
+  background: var(--surface);
+}
+
+.workflow-inspector-empty svg {
+  width: 15px;
+  height: 15px;
+}
+
+.workflow-inspector-empty strong {
+  color: var(--text-secondary);
+  font-size: 10px;
+  font-weight: 520;
+}
+
+.workflow-inspector-empty p {
+  max-width: 160px;
+  margin: 3px 0 0;
+  font-size: 9px;
+}
+
+.empty-orbit,
+.empty-search {
+  position: relative;
+  display: grid;
+  place-items: center;
+  width: 38px;
+  height: 38px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 8px;
+  color: var(--text-tertiary);
+  font-size: 20px;
+}
+
+.empty-orbit::before {
+  width: 12px;
+  height: 12px;
+  border: 1.5px solid var(--text-tertiary);
+  border-radius: 50%;
+  content: "";
+}
+
+.button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 28px;
+  gap: 5px;
+  padding: 0 10px;
+  border: 0;
+  border-radius: 5px;
+  font-size: 11px;
+  font-weight: 500;
+  transition: background-color 100ms ease, transform 100ms ease;
+}
+
+.button:active:not(:disabled) {
+  transform: scale(0.97);
+}
+
+.button.primary {
+  background: var(--accent);
+  color: white;
+  box-shadow: inset 0 0 0 0.5px rgba(255, 255, 255, 0.18), 0 1px 2px rgba(0, 0, 0, 0.16);
+}
+
+.button.primary:hover:not(:disabled) {
+  background: var(--accent-hover);
+}
+
+.button.secondary {
+  border: var(--border-hairline) solid var(--border-strong);
+  background: var(--surface);
+  color: var(--text-secondary);
+}
+
+.button.secondary:hover:not(:disabled) {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.task-dialog {
+  width: min(750px, calc(100vw - 32px));
+  max-height: min(760px, calc(100vh - 32px));
+  padding: 0;
+  overflow: visible;
+  border: 0.5px solid var(--border);
+  border-radius: 22px;
+  background: var(--surface);
+  color: var(--text-primary);
+  box-shadow: 0 9px 48px rgba(0, 0, 0, 0.08), 0 6px 24px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.04);
+}
+
+.task-dialog::backdrop {
+  background: rgba(13, 14, 16, 0.32);
+  backdrop-filter: blur(1px);
+}
+
+.task-dialog.is-expanded {
+  width: calc(100vw - 40px);
+  height: calc(100vh - 40px);
+  max-height: none;
+}
+
+.task-dialog.is-expanded .task-form {
+  min-height: 0;
+  height: 100%;
+}
+
+.task-form {
+  display: flex;
+  flex-direction: column;
+  min-height: 302px;
+  max-height: inherit;
+}
+
+.dialog-header,
+.dialog-footer {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.dialog-header {
+  height: 50px;
+  padding: 0 18px 0 20px;
+}
+
+.dialog-context {
+  gap: 8px;
+  color: var(--text-secondary);
+  font-size: 12px;
+  font-weight: 500;
+}
+
+.dialog-context strong {
+  color: var(--text-primary);
+  font-weight: 580;
+}
+
+.dialog-header-actions {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.dialog-close,
+.dialog-expand {
+  width: 28px;
+  height: 28px;
+}
+
+.form-body {
+  display: flex;
+  flex-direction: column;
+  flex: 1 1 auto;
+  min-height: 198px;
+  padding: 7px 20px 10px;
+  overflow-x: hidden;
+  overflow-y: auto;
+  overscroll-behavior: contain;
+  scrollbar-color: var(--scrollbar-thumb) transparent;
+  scrollbar-width: thin;
+}
+
+.task-form-dock {
+  position: relative;
+  z-index: 2;
+  flex: 0 0 auto;
+  min-width: 0;
+  border-radius: 0 0 22px 22px;
+  background: var(--surface);
+}
+
+.task-form-dock > .property-row {
+  padding: 4px 20px 0;
+}
+
+.task-form-dock > .form-error {
+  margin-right: 20px;
+  margin-left: 20px;
+}
+
+.task-form-dock .composer-popover {
+  top: auto;
+  bottom: 32px;
+}
+
+.composer-title,
+.composer-description {
+  display: block;
+}
+
+.composer-title input,
+.composer-description textarea {
+  width: 100%;
+  padding: 0;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: var(--text-primary);
+}
+
+.composer-title input {
+  height: 34px;
+  font-size: 18px;
+  font-weight: 600;
+  line-height: 28.8px;
+}
+
+.composer-description textarea {
+  min-height: 100px;
+  margin-top: 2px;
+  padding: 6px 0 12px;
+  resize: none;
+  font-size: 15px;
+  font-weight: 450;
+  line-height: 24px;
+}
+
+.inline-media-description {
+  min-height: 118px;
+  margin-top: 2px;
+  padding: 6px 0 12px;
+}
+
+.inline-media-description textarea {
+  min-height: 24px;
+  margin: 0;
+  padding: 0;
+}
+
+.inline-media-description > textarea:only-child {
+  min-height: 100px;
+}
+
+.composer-title input::placeholder,
+.composer-description textarea::placeholder,
+.property-control input::placeholder,
+.codex-link-row input::placeholder {
+  color: var(--text-tertiary);
+}
+
+.property-row {
+  position: relative;
+  flex-wrap: wrap;
+  gap: 6px;
+  padding-top: 4px;
+}
+
+.property-control {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  flex: 0 1 auto;
+  height: 24px;
+  min-width: 0;
+  gap: 5px;
+  padding: 0 9px;
+  border: 0.5px solid var(--border-strong);
+  border-radius: 9999px;
+  background: var(--surface);
+  color: var(--text-secondary);
+  font-size: 12px;
+  font-weight: 500;
+}
+
+.property-control:hover {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.property-assignee-avatar {
+  width: 14px;
+  height: 14px;
+  border-width: 1px;
+  font-size: 7px;
+}
+
+.property-control svg {
+  width: 14px;
+  height: 14px;
+  fill: currentColor;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.15;
+}
+
+.property-control select,
+.property-control input {
+  min-width: 0;
+  height: 22px;
+  padding: 0;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: inherit;
+  font-size: 12px;
+  font-weight: 500;
+}
+
+.property-control select {
+  max-width: 150px;
+}
+
+.property-dot {
+  width: 10px;
+  height: 10px;
+  border: 1.5px solid var(--status-backlog);
+  border-radius: 50%;
+}
+
+.property-priority svg {
+  stroke: none;
+}
+
+.property-priority.priority-urgent { color: var(--danger); }
+.property-priority.priority-high { color: #ff7236; }
+.property-priority.priority-medium { color: var(--warning); }
+
+.property-thread input { width: 178px; }
+.property-workflow select { max-width: 190px; }
+.property-development select { max-width: 190px; }
+.property-more { width: 28px; padding: 0; justify-content: center; letter-spacing: 1px; }
+
+.composer-attachment-button {
+  flex: 0 0 auto;
+  font-size: 11px;
+}
+
+.composer-attachment-button svg,
+.composer-attachment-file-icon svg,
+.composer-attachment-list button svg {
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.2;
+}
+
+.composer-attachment-button:disabled,
+.composer-attachment-list button:disabled {
+  cursor: wait;
+  opacity: 0.55;
+}
+
+.composer-attachment-count {
+  display: grid;
+  place-items: center;
+  min-width: 16px;
+  height: 16px;
+  padding: 0 4px;
+  border-radius: 8px;
+  background: var(--surface-active);
+  color: var(--text-secondary);
+  font-size: 9px;
+  font-variant-numeric: tabular-nums;
+}
+
+.composer-attachment-list {
+  display: grid;
+  gap: 5px;
+  margin: 8px 0 0;
+  padding: 0;
+  list-style: none;
+}
+
+.composer-attachment-list li {
+  display: flex;
+  align-items: center;
+  min-width: 0;
+  min-height: 38px;
+  gap: 8px;
+  padding: 5px 6px 5px 8px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 6px;
+  background: var(--surface-muted);
+}
+
+.composer-attachment-file-icon {
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+  width: 24px;
+  height: 24px;
+  border-radius: 5px;
+  background: var(--surface);
+  color: var(--text-tertiary);
+}
+
+.composer-attachment-file-icon svg,
+.composer-attachment-list button svg {
+  width: 14px;
+  height: 14px;
+}
+
+.composer-attachment-copy {
+  display: flex;
+  flex: 1;
+  min-width: 0;
+  flex-direction: column;
+  gap: 1px;
+}
+
+.composer-attachment-copy strong {
+  overflow: hidden;
+  color: var(--text-primary);
+  font-size: 10px;
+  font-weight: 520;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.composer-attachment-copy > span {
+  color: var(--text-tertiary);
+  font-size: 9px;
+}
+
+.composer-attachment-list button {
+  display: grid;
+  place-items: center;
+  flex: 0 0 auto;
+  width: 24px;
+  height: 24px;
+  padding: 0;
+  border: 0;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--text-tertiary);
+}
+
+.composer-attachment-list button:hover:not(:disabled) {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.pending-attachments {
+  min-width: 0;
+  margin-top: 8px;
+}
+
+.composer-description + .pending-attachments {
+  padding: 0 2px;
+}
+
+.inline-media-composer {
+  width: 100%;
+}
+
+.inline-media-image {
+  position: relative;
+  width: fit-content;
+  max-width: 100%;
+  margin: 6px 0;
+}
+
+.inline-media-image img {
+  display: block;
+  max-width: 100%;
+  max-height: 600px;
+  width: auto;
+  height: auto;
+  border-radius: 8px;
+  object-fit: contain;
+}
+
+.inline-media-image button {
+  position: absolute;
+  top: 6px;
+  right: 6px;
+  display: grid;
+  place-items: center;
+  width: 20px;
+  height: 20px;
+  padding: 0;
+  border: 0;
+  border-radius: 50%;
+  background: color-mix(in srgb, var(--text-primary) 82%, transparent);
+  color: var(--surface);
+}
+
+.inline-media-image button svg {
+  width: 10px;
+  height: 10px;
+  fill: currentColor;
+}
+
+.inline-media-image button:disabled {
+  cursor: wait;
+  opacity: 0.55;
+}
+
+.codex-link-row {
+  min-width: 0;
+  height: 34px;
+  gap: 7px;
+  margin-top: 10px;
+  padding: 0 7px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 5px;
+  color: var(--text-tertiary);
+}
+
+.codex-link-row > svg {
+  flex: 0 0 auto;
+  width: 14px;
+  height: 14px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-width: 1.2;
+}
+
+.codex-link-row label {
+  flex: 1;
+  min-width: 0;
+}
+
+.codex-link-row input {
+  width: 100%;
+  height: 31px;
+  padding: 0;
+  border: 0;
+  outline: 0;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 11px;
+}
+
+.codex-link-row button {
+  flex: 0 0 auto;
+  height: 24px;
+  padding: 0 6px;
+  border: 0;
+  border-radius: 4px;
+  background: transparent;
+  color: var(--accent);
+  font-size: 10px;
+}
+
+.codex-link-row button:hover {
+  background: var(--accent-soft);
+}
+
+.worktree-link-row label + label {
+  padding-left: 8px;
+  border-left: var(--border-hairline) solid var(--border);
+}
+
+.form-error {
+  margin-top: 10px;
+  padding: 6px 8px;
+  border: var(--border-hairline) solid color-mix(in srgb, var(--danger) 30%, var(--border));
+  border-radius: 5px;
+  background: var(--danger-soft);
+  color: var(--danger);
+  font-size: 10px;
+}
+
+.dialog-footer {
+  height: 54px;
+  padding: 0 20px;
+  background: transparent;
+}
+
+.dialog-actions {
+  gap: 8px;
+}
+
+.keyboard-note,
+.dialog-updated {
+  color: var(--text-tertiary);
+  font-size: 10px;
+}
+
+.keyboard-note kbd {
+  padding: 1px 4px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 3px;
+  background: var(--surface);
+}
+
+.composer-menu-anchor {
+  position: relative;
+  display: inline-flex;
+}
+
+.composer-popover {
+  position: absolute;
+  z-index: 30;
+  top: 32px;
+  left: 0;
+  overflow: hidden;
+  border: 0.5px solid var(--border);
+  border-radius: 12px;
+  background: var(--surface);
+  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.14), 0 2px 8px rgba(0, 0, 0, 0.08);
+}
+
+.label-popover {
+  width: 207px;
+  max-height: 402px;
+}
+
+.label-popover > input {
+  width: 100%;
+  height: 40px;
+  padding: 0 14px;
+  border: 0;
+  border-bottom: 0.5px solid var(--border);
+  outline: 0;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 13px;
+}
+
+.label-options {
+  max-height: 352px;
+  padding: 6px;
+  overflow: auto;
+}
+
+.label-options button,
+.more-popover button,
+.due-popover button {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 32px;
+  gap: 10px;
+  padding: 0 12px 0 8px;
+  border: 0;
+  border-radius: 7px;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 13px;
+  text-align: left;
+}
+
+.label-options button:hover,
+.more-popover button:hover,
+.due-popover button:hover {
+  background: var(--surface-hover);
+}
+
+.label-options button i {
+  flex: 0 0 auto;
+  width: 9px;
+  height: 9px;
+  border-radius: 50%;
+}
+
+.label-options button span,
+.more-popover button strong,
+.due-popover button strong {
+  flex: 1;
+  overflow: hidden;
+  font-weight: 500;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.label-options button b,
+.more-popover button b {
+  color: var(--text-tertiary);
+  font-weight: 500;
+}
+
+.more-popover {
+  width: 238px;
+  padding: 6px;
+}
+
+.more-popover button > span {
+  width: 18px;
+  color: var(--text-tertiary);
+  font-size: 16px;
+  text-align: center;
+}
+
+.more-popover kbd {
+  color: var(--text-tertiary);
+  font-size: 11px;
+}
+
+.due-popover {
+  width: 228px;
+  padding: 6px;
+}
+
+.due-popover button > span {
+  color: var(--text-tertiary);
+}
+
+.custom-date-row {
+  display: flex;
+  align-items: center;
+  height: 34px;
+  gap: 8px;
+  padding: 0 8px;
+  border-radius: 7px;
+  background: var(--surface-hover);
+  color: var(--text-primary);
+  font-size: 13px;
+}
+
+.custom-date-row span { flex: 1; }
+.custom-date-row input { width: 116px; border: 0; background: transparent; color: inherit; font-size: 11px; }
+
+.recurrence-popover {
+  width: 292px;
+  padding: 10px;
+}
+
+.recurrence-popover > label {
+  display: grid;
+  grid-template-columns: 110px 1fr;
+  align-items: center;
+  min-height: 38px;
+  gap: 8px;
+  color: var(--text-secondary);
+  font-size: 12px;
+}
+
+.recurrence-popover input,
+.recurrence-popover select {
+  min-width: 0;
+  height: 28px;
+  border: 0.5px solid var(--border-strong);
+  border-radius: 7px;
+  background: var(--surface);
+  color: var(--text-primary);
+}
+
+.recurrence-controls { display: grid; grid-template-columns: 54px 1fr; gap: 6px; }
+.recurrence-controls input { width: 54px; padding: 0 7px; }
+.recurrence-controls select { width: 100%; }
+
+.recurrence-save,
+.destructive-menu-row {
+  width: 100%;
+  height: 30px;
+  margin-top: 6px;
+  border: 0;
+  border-radius: 7px;
+  background: var(--accent);
+  color: white;
+  font-size: 12px;
+}
+
+.destructive-menu-row {
+  background: transparent !important;
+  color: var(--danger) !important;
+}
+
+.composer-attach-icon {
+  position: relative;
+  display: grid;
+  place-items: center;
+  width: 32px;
+  height: 32px;
+  padding: 0;
+  border: 0.5px solid var(--border-strong);
+  border-radius: 50%;
+  background: var(--surface);
+  color: var(--text-secondary);
+}
+
+.composer-attach-icon svg {
+  width: 16px;
+  height: 16px;
+  fill: none;
+  stroke: currentColor;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+  stroke-width: 1.35;
+}
+
+.composer-attach-icon span {
+  position: absolute;
+  top: -5px;
+  right: -5px;
+  display: grid;
+  place-items: center;
+  min-width: 15px;
+  height: 15px;
+  padding: 0 3px;
+  border-radius: 8px;
+  background: var(--accent);
+  color: white;
+  font-size: 9px;
+}
+
+.dialog-footer .button.primary {
+  height: 28px;
+  padding: 0 14px;
+  border-radius: 9999px;
+}
+
+.toast,
+.drag-hint {
+  position: fixed;
+  z-index: 100;
+  bottom: 18px;
+  left: 50%;
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 6px 9px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 6px;
+  background: var(--text-primary);
+  color: var(--bg);
+  font-size: 10px;
+  font-weight: 500;
+  box-shadow: var(--dialog-shadow);
+  transform: translateX(-50%);
+}
+
+.toast {
+  animation: toast-life 3.4s ease both;
+}
+
+.toast > span:first-child {
+  color: var(--success);
+}
+
+.undo-toast {
+  gap: 7px;
+  animation: toast-life 5.5s ease both;
+}
+
+.undo-toast-message {
+  max-width: min(420px, 56vw);
+  overflow: hidden;
+  color: inherit;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.undo-toast button {
+  display: inline-flex;
+  align-items: center;
+  height: 22px;
+  gap: 5px;
+  margin: -3px -5px -3px 2px;
+  padding: 0 6px;
+  border: 0;
+  border-left: 1px solid color-mix(in srgb, var(--bg) 24%, transparent);
+  background: transparent;
+  color: inherit;
+  font: inherit;
+}
+
+.undo-toast button:hover {
+  background: color-mix(in srgb, var(--bg) 10%, transparent);
+}
+
+.undo-toast kbd {
+  color: color-mix(in srgb, var(--bg) 68%, transparent);
+  font: inherit;
+}
+
+.drag-hint {
+  pointer-events: none;
+}
+
+@keyframes shimmer {
+  to { background-position: -220% 0; }
+}
+
+@keyframes pulse {
+  50% { opacity: 0.35; }
+}
+
+@keyframes toast-life {
+  0% { opacity: 0; transform: translate(-50%, 8px); }
+  8%, 85% { opacity: 1; transform: translate(-50%, 0); }
+  100% { opacity: 0; transform: translate(-50%, 6px); }
+}
+
+.ai-chat-launcher {
+  position: fixed;
+  z-index: 40;
+  right: 16px;
+  bottom: 16px;
+  display: grid;
+  place-items: center;
+  width: 40px;
+  height: 40px;
+  padding: 4px;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: 50%;
+  background: color-mix(in srgb, var(--surface-raised) 94%, transparent);
+  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.14), 0 1px 3px rgba(0, 0, 0, 0.08);
+  backdrop-filter: blur(16px);
+  transition: border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
+}
+
+.ai-chat-launcher:hover {
+  border-color: color-mix(in srgb, var(--accent) 34%, var(--border-strong));
+  box-shadow: 0 8px 26px rgba(0, 0, 0, 0.18), 0 1px 4px rgba(0, 0, 0, 0.09);
+  transform: translateY(-1px);
+}
+
+.ai-chat-launcher > svg {
+  width: 18px;
+  height: 18px;
+  color: var(--text-primary);
+}
+
+.ai-chat-launcher-state {
+  position: absolute;
+  top: -1px;
+  right: -1px;
+  width: 9px;
+  height: 9px;
+  border: 2px solid var(--surface-raised);
+  border-radius: 50%;
+  background: var(--accent);
+}
+
+.ai-chat-launcher.is-running .ai-chat-launcher-state {
+  background: var(--success);
+  animation: ai-chat-status-pulse 1.35s ease-in-out infinite;
+}
+
+.ai-chat-launcher.is-failed .ai-chat-launcher-state {
+  background: var(--danger);
+}
+
+.ai-chat-panel {
+  --ai-chat-composer-gap: 12px;
+  --ai-chat-composer-radius: 13px;
+  position: fixed;
+  z-index: 50;
+  right: 8px;
+  bottom: 8px;
+  display: flex;
+  flex-direction: column;
+  width: min(672px, calc(100vw - 16px));
+  max-width: calc(100vw - 16px);
+  height: calc(100vh - 16px);
+  max-height: calc(100vh - 16px);
+  overflow: hidden;
+  border: var(--border-hairline) solid var(--border-strong);
+  border-radius: calc(var(--ai-chat-composer-radius) + var(--ai-chat-composer-gap));
+  background: var(--surface-raised);
+  box-shadow:
+    0 0 0 .5px color-mix(in srgb, var(--border-strong) 70%, transparent),
+    0 8px 28px rgba(0, 0, 0, .09);
+  animation: ai-chat-panel-in 140ms cubic-bezier(.22, .8, .34, 1) both;
+}
+
+.ai-chat-panel.is-maximized {
+  inset: 8px;
+  width: auto;
+  max-width: none;
+  height: auto;
+  max-height: none;
+}
+
+.ai-chat-resize-handle {
+  position: absolute;
+  z-index: 20;
+  touch-action: none;
+  user-select: none;
+}
+
+.ai-chat-resize-handle.is-top {
+  top: 0;
+  right: 0;
+  left: 32px;
+  height: 4px;
+  cursor: ns-resize;
+}
+
+.ai-chat-resize-handle.is-left {
+  top: 32px;
+  bottom: 0;
+  left: 0;
+  width: 4px;
+  cursor: ew-resize;
+}
+
+.ai-chat-resize-handle.is-top-left {
+  top: 8px;
+  left: 8px;
+  z-index: 21;
+  width: 24px;
+  height: 24px;
+  cursor: nwse-resize;
+}
+
+.ai-chat-panel-header {
+  display: flex;
+  flex: 0 0 42px;
+  align-items: center;
+  height: 42px;
+  gap: 4px;
+  padding: 0 10px 0 18px;
+  background: var(--surface-raised);
+}
+
+.ai-chat-panel-title {
+  display: flex;
+  flex: 1;
+  align-items: center;
+  min-width: 0;
+  gap: 7px;
+  line-height: 1;
+}
+
+.ai-chat-panel-title strong {
+  overflow: hidden;
+  color: var(--text-primary);
+  font-size: 13px;
+  font-weight: 560;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ai-chat-panel-title span {
+  display: flex;
+  align-items: center;
+  overflow: hidden;
+  color: var(--text-tertiary);
+  font-size: 11px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ai-chat-panel-title span::before {
+  width: 3px;
+  height: 3px;
+  margin-right: 7px;
+  border-radius: 50%;
+  background: var(--text-quaternary);
+  content: "";
+}
+
+.ai-chat-panel-header > button {
+  display: grid;
+  flex: 0 0 28px;
+  place-items: center;
+  width: 28px;
+  height: 28px;
+  padding: 0;
+  border: 0;
+  border-radius: 7px;
+  background: transparent;
+  color: var(--text-tertiary);
+}
+
+.ai-chat-panel-header > button:hover:not(:disabled),
+.ai-chat-panel-header > button[aria-pressed="true"] {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.ai-chat-panel-header > button svg {
+  width: 15px;
+  height: 15px;
+}
+
+.ai-chat-history {
+  position: absolute;
+  z-index: 55;
+  inset: 42px 0 0;
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  padding: 10px;
+  overflow: auto;
+  background: var(--surface-raised);
+}
+
+.ai-chat-history-heading {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 30px;
+  padding: 0 7px;
+  color: var(--text-tertiary);
+}
+
+.ai-chat-history-heading strong {
+  color: var(--text-primary);
+  font-size: 11px;
+  font-weight: 590;
+}
+
+.ai-chat-history-row {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) 28px;
+  align-items: center;
+  border-radius: 8px;
+}
+
+.ai-chat-history-row > button:first-child {
+  display: grid;
+  grid-template-columns: 8px minmax(0, 1fr);
+  align-items: center;
+  width: 100%;
+  gap: 9px;
+  padding: 8px 9px;
+  border: 0;
+  border-radius: 8px;
+  background: transparent;
+  color: var(--text-primary);
+  text-align: left;
+}
+
+.ai-chat-history-row:hover,
+.ai-chat-history-row.is-active {
+  background: var(--surface-hover);
+}
+
+.ai-chat-history-row > button:first-child > span:last-child {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}
+
+.ai-chat-history-row > button:first-child strong,
+.ai-chat-history-row > button:first-child small {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ai-chat-history-row > button:first-child strong {
+  font-size: 11px;
+  font-weight: 540;
+}
+
+.ai-chat-history-row > button:first-child small {
+  color: var(--text-tertiary);
+  font-size: 9px;
+}
+
+.ai-chat-history-delete {
+  display: grid;
+  place-items: center;
+  width: 24px;
+  height: 24px;
+  padding: 0;
+  border: 0;
+  border-radius: 6px;
+  background: transparent;
+  color: var(--text-tertiary);
+  opacity: 0;
+}
+
+.ai-chat-history-row:hover .ai-chat-history-delete,
+.ai-chat-history-delete:focus-visible {
+  opacity: 1;
+}
+
+.ai-chat-history-delete:hover:not(:disabled) {
+  background: var(--danger-soft);
+  color: var(--danger);
+}
+
+.ai-chat-history-delete svg {
+  width: 12px;
+  height: 12px;
+}
+
+.ai-chat-history > p {
+  margin: 32px 0;
+  color: var(--text-tertiary);
+  text-align: center;
+}
+
+.ai-chat-thread-status {
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: var(--text-quaternary);
+}
+
+.ai-chat-thread-status.is-running {
+  background: var(--success);
+}
+
+.ai-chat-thread-status.is-failed {
+  background: var(--danger);
+}
+
+.ai-chat-messages {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  gap: 16px;
+  min-height: 0;
+  padding: 22px 26px 18px;
+  overflow: auto;
+  overscroll-behavior: contain;
+  scroll-behavior: smooth;
+}
+
+.ai-chat-user-message {
+  align-self: flex-end;
+  max-width: 77%;
+  padding: 8px 12px;
+  border: 0;
+  border-radius: 20px;
+  background: color-mix(in srgb, var(--text-primary) 5%, transparent);
+  color: var(--text-primary);
+}
+
+.ai-chat-skill-reference {
+  position: relative;
+  display: inline-block;
+  padding-left: 21px;
+  color: var(--accent);
+  font-size: 14px;
+  font-weight: 520;
+  line-height: 22px;
+  vertical-align: baseline;
+  white-space: nowrap;
+}
+
+.ai-chat-skill-reference svg {
+  position: absolute;
+  top: 50%;
+  left: 0;
+  width: 16px;
+  height: 16px;
+  transform: translateY(-50%);
+}
+
+.ai-chat-assistant-message {
+  width: 100%;
+  color: var(--text-primary);
+}
+
+.ai-chat-markdown {
+  min-width: 0;
+  color: inherit;
+  font-size: 14px;
+  line-height: 22px;
+  -webkit-user-select: text;
+  user-select: text;
+  word-break: break-word;
+}
+
+.ai-chat-markdown > :first-child {
+  margin-top: 0;
+}
+
+.ai-chat-markdown > :last-child {
+  margin-bottom: 0;
+}
+
+.ai-chat-markdown p,
+.ai-chat-markdown ul,
+.ai-chat-markdown ol,
+.ai-chat-markdown blockquote,
+.ai-chat-markdown pre,
+.ai-chat-markdown table {
+  margin: 0 0 11px;
+}
+
+.ai-chat-markdown ul,
+.ai-chat-markdown ol {
+  padding-left: 20px;
+}
+
+.ai-chat-markdown li + li {
+  margin-top: 8px;
+}
+
+.ai-chat-markdown h1,
+.ai-chat-markdown h2,
+.ai-chat-markdown h3 {
+  margin: 15px 0 7px;
+  font-weight: 620;
+  line-height: 1.35;
+}
+
+.ai-chat-markdown h1 { font-size: 19px; }
+.ai-chat-markdown h2 { font-size: 16px; }
+.ai-chat-markdown h3 { font-size: 14px; }
+
+.ai-chat-event-attachments {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 5px;
+  margin-top: 8px;
+  -webkit-user-select: text;
+  user-select: text;
+}
+
+.ai-chat-event-attachments > span {
+  display: flex;
+  align-items: center;
+  max-width: 220px;
+  height: 25px;
+  gap: 5px;
+  padding: 0 8px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 7px;
+  background: var(--surface-raised);
+  color: var(--text-secondary);
+  font-size: 10px;
+}
+
+.ai-chat-event-attachments svg {
+  flex: 0 0 12px;
+  width: 12px;
+  height: 12px;
+}
+
+.ai-chat-event-attachments > span > span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ai-chat-markdown a {
+  color: var(--accent);
+  text-decoration: none;
+}
+
+.ai-chat-markdown a:hover {
+  text-decoration: underline;
+}
+
+.ai-chat-markdown code {
+  padding: 1px 4px;
+  border-radius: 4px;
+  background: var(--surface-muted);
+  font-family: "SFMono-Regular", Consolas, monospace;
+  font-size: .92em;
+}
+
+.ai-chat-markdown pre {
+  padding: 9px 10px;
+  overflow: auto;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 8px;
+  background: var(--surface-muted);
+}
+
+.ai-chat-markdown pre code {
+  padding: 0;
+  background: transparent;
+}
+
+.ai-chat-markdown blockquote {
+  padding-left: 10px;
+  border-left: 2px solid var(--border-strong);
+  color: var(--text-secondary);
+}
+
+.ai-chat-markdown table {
+  width: 100%;
+  border-collapse: collapse;
+}
+
+.ai-chat-markdown th,
+.ai-chat-markdown td {
+  padding: 4px 6px;
+  border: var(--border-hairline) solid var(--border);
+  text-align: left;
+}
+
+.ai-chat-thinking-steps {
+  width: calc(100% + 12px);
+  margin-left: -12px;
+  color: var(--text-tertiary);
+}
+
+.ai-chat-messages > * + .ai-chat-thinking-steps,
+.ai-chat-messages > .ai-chat-thinking-steps + * {
+  margin-top: -8px;
+}
+
+.ai-chat-thinking-header {
+  display: inline-flex;
+  align-items: center;
+  width: fit-content;
+  gap: 10px;
+  padding: 8px 12px;
+  border: 0;
+  border-radius: 8px;
+  background: transparent;
+  color: inherit;
+  cursor: pointer;
+  text-align: left;
+  transition: background-color 80ms ease, color 80ms ease;
+}
+
+.ai-chat-thinking-header:hover {
+  background: var(--surface-muted);
+}
+
+.ai-chat-thinking-header:focus-visible {
+  outline: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
+  outline-offset: 3px;
+  border-radius: 5px;
+}
+
+.ai-chat-thinking-label {
+  color: var(--text-secondary);
+  font-size: 13px;
+  font-weight: 500;
+  line-height: 20px;
+  -webkit-user-select: text;
+  user-select: text;
+  white-space: nowrap;
+}
+
+.ai-chat-thinking-chevron {
+  flex: 0 0 auto;
+  width: 16px;
+  height: 16px;
+  transition: transform 160ms ease;
+}
+
+.ai-chat-thinking-header[aria-expanded="true"] .ai-chat-thinking-chevron {
+  transform: rotate(90deg);
+}
+
+.ai-chat-thinking-panel {
+  display: grid;
+  grid-template-rows: 0fr;
+  opacity: 0;
+  transition: grid-template-rows 180ms ease, opacity 140ms ease;
+}
+
+.ai-chat-thinking-panel.is-open {
+  grid-template-rows: 1fr;
+  opacity: 1;
+}
+
+.ai-chat-thinking-panel-clip {
+  min-height: 0;
+  overflow: hidden;
+}
+
+.ai-chat-thinking-list {
+  padding: 4px 12px 12px;
+  font-size: 13px;
+  -webkit-user-select: text;
+  user-select: text;
+}
+
+.ai-chat-thinking-step-entry {
+  display: grid;
+  grid-template-rows: 1fr;
+  min-height: 0;
+  animation: ai-chat-thinking-step-enter 260ms ease-out both;
+}
+
+.ai-chat-thinking-step {
+  display: grid;
+  grid-template-columns: 14px minmax(0, 1fr);
+  align-items: stretch;
+  min-height: 0;
+  gap: 10px;
+  padding: 6px 8px;
+  overflow: hidden;
+}
+
+.ai-chat-thinking-step-rail {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  flex-shrink: 0;
+  width: 14px;
+  color: var(--text-tertiary);
+}
+
+.ai-chat-thinking-step-icon {
+  display: flex;
+  flex: 0 0 auto;
+  align-items: center;
+  justify-content: center;
+  width: 14px;
+  height: 16px;
+  padding-top: 2px;
+}
+
+.ai-chat-thinking-step-icon svg {
+  display: block;
+  width: 14px;
+  height: 14px;
+}
+
+.ai-chat-thinking-step-connector {
+  flex: 1 1 auto;
+  min-height: 6px;
+  margin-top: 4px;
+  margin-bottom: -6px;
+  width: 1px;
+  background: var(--border);
+  opacity: .6;
+}
+
+.ai-chat-thinking-step.is-failed .ai-chat-thinking-step-rail {
+  color: var(--danger);
+}
+
+.ai-chat-thinking-step-content {
+  min-width: 0;
+}
+
+.ai-chat-thinking-step-heading {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  min-width: 0;
+  gap: 4px;
+}
+
+.ai-chat-thinking-step-label {
+  display: block;
+  min-width: 0;
+  color: var(--text-primary);
+  font-size: 13px;
+  font-weight: 500;
+  line-height: 1.25;
+  overflow-wrap: anywhere;
+}
+
+.ai-chat-thinking-step-description {
+  display: block;
+  color: var(--text-tertiary);
+  font-size: 13px;
+  font-weight: 400;
+  line-height: 1.35;
+  overflow-wrap: anywhere;
+  white-space: pre-wrap;
+}
+
+.ai-chat-thinking-step.is-failed .ai-chat-thinking-step-label {
+  color: var(--danger);
+}
+
+.ai-chat-thinking-step.is-running .ai-chat-thinking-step-label {
+  background: linear-gradient(
+    90deg,
+    var(--text-tertiary) 0%,
+    var(--text-tertiary) 35%,
+    var(--text-primary) 50%,
+    var(--text-tertiary) 65%,
+    var(--text-tertiary) 100%
+  );
+  background-size: 300% 100%;
+  color: transparent;
+  -webkit-background-clip: text;
+  background-clip: text;
+  animation: ai-chat-thinking-shimmer 1.5s ease-in-out infinite;
+}
+
+.ai-chat-thinking-detail {
+  margin-top: 4px;
+  margin-left: -12px;
+  color: var(--text-tertiary);
+  font-size: 13px;
+}
+
+.ai-chat-thinking-detail-trigger {
+  display: inline-flex;
+  align-items: center;
+  min-height: 26px;
+  gap: 6px;
+  padding: 4px 12px;
+  border: 0;
+  border-radius: 6px;
+  background: transparent;
+  color: inherit;
+  cursor: pointer;
+  font: inherit;
+  text-align: left;
+  transition: background-color 80ms ease, color 80ms ease;
+}
+
+.ai-chat-thinking-detail-trigger:hover {
+  background: var(--surface-muted);
+  color: var(--text-secondary);
+}
+
+.ai-chat-thinking-detail-trigger:focus-visible {
+  outline: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
+  outline-offset: 2px;
+  border-radius: 4px;
+}
+
+.ai-chat-thinking-detail-trigger svg {
+  order: 2;
+  width: 12px;
+  height: 12px;
+  transition: transform 140ms ease;
+}
+
+.ai-chat-thinking-detail.is-open .ai-chat-thinking-detail-trigger svg {
+  transform: rotate(90deg);
+}
+
+.ai-chat-thinking-detail-panel {
+  display: grid;
+  grid-template-rows: 0fr;
+  opacity: 0;
+  transition: grid-template-rows 180ms ease, opacity 140ms ease;
+}
+
+.ai-chat-thinking-detail.is-open .ai-chat-thinking-detail-panel {
+  grid-template-rows: 1fr;
+  opacity: 1;
+}
+
+.ai-chat-thinking-detail-panel-inner {
+  min-height: 0;
+  overflow: hidden;
+}
+
+.ai-chat-thinking-detail-lines {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+  padding: 2px 12px 4px;
+  color: var(--text-tertiary);
+  font-size: 12px;
+  line-height: 1.4;
+}
+
+.ai-chat-thinking-detail-lines span {
+  overflow-wrap: anywhere;
+}
+
+.ai-chat-thinking-detail pre {
+  max-height: 220px;
+  margin: 2px 12px 4px;
+  padding: 6px 0 4px;
+  overflow: auto;
+  border: 0;
+  background: transparent;
+  color: var(--text-tertiary);
+  font-family: "SFMono-Regular", Consolas, monospace;
+  font-size: 12px;
+  line-height: 1.45;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+@keyframes ai-chat-thinking-step-enter {
+  from {
+    grid-template-rows: 0fr;
+    opacity: 0;
+    transform: translateY(-3px);
+  }
+  to {
+    grid-template-rows: 1fr;
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+@keyframes ai-chat-thinking-shimmer {
+  from { background-position: 0% 0; }
+  to { background-position: 100% 0; }
+}
+
+.ai-chat-running,
+.ai-chat-retry {
+  display: flex;
+  align-items: center;
+  align-self: flex-start;
+  min-height: 30px;
+  gap: 7px;
+  padding: 0 8px;
+  border: 0;
+  border-radius: 7px;
+  background: transparent;
+  color: var(--text-tertiary);
+  font-size: 10px;
+}
+
+.ai-chat-running {
+  -webkit-user-select: text;
+  user-select: text;
+}
+
+.ai-chat-retry:hover {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.ai-chat-retry svg {
+  width: 13px;
+  height: 13px;
+}
+
+.ai-chat-empty {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  min-height: 220px;
+  gap: 7px;
+  color: var(--text-tertiary);
+  text-align: center;
+  -webkit-user-select: text;
+  user-select: text;
+}
+
+.ai-chat-empty > svg {
+  width: 24px;
+  height: 24px;
+  margin-bottom: 4px;
+  color: var(--text-tertiary);
+}
+
+.ai-chat-empty strong {
+  color: var(--text-primary);
+  font-size: 14px;
+  font-weight: 570;
+}
+
+.ai-chat-empty p {
+  max-width: 290px;
+  margin: 0;
+  font-size: 12px;
+}
+
+.ai-chat-error {
+  display: flex;
+  flex: 0 0 auto;
+  align-items: flex-start;
+  gap: 7px;
+  margin: 0 12px 8px;
+  padding: 7px 9px;
+  border-radius: 7px;
+  background: var(--danger-soft);
+  color: var(--danger);
+  font-size: 9px;
+  -webkit-user-select: text;
+  user-select: text;
+}
+
+.ai-chat-error svg {
+  flex: 0 0 12px;
+  width: 12px;
+  height: 12px;
+  margin-top: 1px;
+}
+
+.ai-chat-composer {
+  position: relative;
+  display: flex;
+  flex: 0 0 auto;
+  flex-direction: column;
+  min-height: 108px;
+  max-height: 300px;
+  margin: 0 var(--ai-chat-composer-gap) var(--ai-chat-composer-gap);
+  padding: 12px;
+  border: 0;
+  border-radius: var(--ai-chat-composer-radius);
+  background: var(--surface-raised);
+  box-shadow:
+    0 0 0 .5px var(--border-strong),
+    0 3px 7.5px rgba(0, 0, 0, .04),
+    0 0 20px rgba(0, 0, 0, .05);
+}
+
+.ai-chat-composer.is-attachment-drag-active {
+  background: color-mix(in srgb, var(--surface-raised) 92%, var(--accent-soft));
+  box-shadow:
+    0 0 0 1.5px color-mix(in srgb, var(--accent) 58%, transparent),
+    0 3px 7.5px rgba(0, 0, 0, .04),
+    0 0 20px rgba(0, 0, 0, .05);
+}
+
+.ai-chat-attachment-drop-hint {
+  position: absolute;
+  z-index: 80;
+  inset: 8px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border: 1px dashed color-mix(in srgb, var(--accent) 52%, transparent);
+  border-radius: 18px;
+  background: color-mix(in srgb, var(--surface-raised) 86%, var(--accent-soft));
+  color: var(--accent);
+  font-size: 12px;
+  font-weight: 550;
+  pointer-events: none;
+}
+
+.ai-chat-input-wrap {
+  position: relative;
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  min-height: 48px;
+}
+
+.ai-chat-composer-attachments {
+  display: flex;
+  flex: 0 0 auto;
+  gap: 8px;
+  margin: -6px -6px 0;
+  padding: 6px 6px 10px;
+  overflow-x: auto;
+}
+
+.ai-chat-composer-attachment {
+  position: relative;
+  flex: 0 0 80px;
+  width: 80px;
+  height: 80px;
+}
+
+.ai-chat-composer-attachment > img {
+  width: 80px;
+  height: 80px;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 12px;
+  object-fit: cover;
+}
+
+.ai-chat-composer-file {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  width: 80px;
+  height: 80px;
+  gap: 7px;
+  padding: 9px;
+  overflow: hidden;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: 12px;
+  background: color-mix(in srgb, var(--surface-raised) 94%, var(--text-primary));
+  color: var(--text-secondary);
+}
+
+.ai-chat-composer-file > svg {
+  flex: 0 0 22px;
+  width: 22px;
+  height: 22px;
+}
+
+.ai-chat-composer-file > span {
+  width: 100%;
+  overflow: hidden;
+  font-size: 10px;
+  text-align: center;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ai-chat-composer-attachment > button {
+  position: absolute;
+  top: -5px;
+  right: -5px;
+  display: grid;
+  place-items: center;
+  width: 18px;
+  height: 18px;
+  padding: 0;
+  border: 1px solid var(--surface-raised);
+  border-radius: 50%;
+  background: var(--text-primary);
+  color: var(--bg);
+}
+
+.ai-chat-composer-attachment > button svg {
+  width: 8px;
+  height: 8px;
+}
+
+.ai-chat-composer-editor {
+  width: 100%;
+  min-height: 42px;
+  max-height: 158px;
+  padding: 2px 2px 8px;
+  overflow: auto;
+  border: 0;
+  outline: none;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 14px;
+  line-height: 1.58;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+.ai-chat-composer-editor:empty::before {
+  content: attr(data-placeholder);
+  color: var(--text-tertiary);
+  pointer-events: none;
+}
+
+.ai-chat-composer-skill-token {
+  display: inline;
+  margin: 0 2px;
+  font: inherit;
+  line-height: inherit;
+  vertical-align: baseline;
+  cursor: pointer;
+}
+
+.ai-chat-composer-skill-token > button {
+  display: inline;
+  padding: 0;
+  border: 0;
+  background: transparent;
+  color: inherit;
+  font: inherit;
+  line-height: inherit;
+  vertical-align: baseline;
+}
+
+.ai-chat-composer-skill-token .ai-chat-skill-reference {
+  font-size: inherit;
+  line-height: inherit;
+}
+
+.ai-chat-composer-skill-token:hover .ai-chat-skill-reference {
+  color: color-mix(in srgb, var(--accent) 80%, var(--text-primary));
+}
+
+.ai-chat-skill-menu {
+  position: absolute;
+  z-index: 60;
+  right: -12px;
+  bottom: calc(100% + 18px);
+  left: -12px;
+  box-sizing: border-box;
+  max-height: 360px;
+  padding: 4px;
+  overflow: auto;
+  border: var(--border-hairline) solid var(--border);
+  border-radius: var(--ai-chat-composer-radius);
+  background: var(--surface-raised);
+  box-shadow: none;
+}
+
+.ai-chat-skill-menu button {
+  display: grid;
+  grid-template-columns: 16px minmax(0, 1fr);
+  align-items: center;
+  width: 100%;
+  min-height: 43px;
+  gap: 10px;
+  padding: 0 12px;
+  border: 0;
+  border-radius: 10px;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 14px;
+  text-align: left;
+}
+
+.ai-chat-skill-menu button:hover,
+.ai-chat-skill-menu button:focus-visible,
+.ai-chat-skill-menu button.is-selected {
+  background: color-mix(in srgb, var(--text-primary) 5%, transparent);
+}
+
+.ai-chat-skill-menu button > svg {
+  width: 16px;
+  height: 16px;
+  color: var(--text-secondary);
+}
+
+.ai-chat-skill-menu button > span {
+  display: flex;
+  align-items: baseline;
+  min-width: 0;
+  gap: 8px;
+}
+
+.ai-chat-skill-menu strong {
+  flex: 0 0 auto;
+  overflow: hidden;
+  font-size: 14px;
+  font-weight: 500;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ai-chat-skill-menu small {
+  min-width: 0;
+  overflow: hidden;
+  color: var(--text-tertiary);
+  font-size: 14px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ai-chat-composer-toolbar {
+  display: flex;
+  align-items: center;
+  min-height: 36px;
+  gap: 5px;
+}
+
+.ai-chat-composer-toolbar button:focus,
+.ai-chat-composer-toolbar button:focus-visible {
+  outline: none;
+  box-shadow: none;
+}
+
+.ai-chat-attachment-input {
+  display: none;
+}
+
+.ai-chat-attachment-button {
+  display: grid;
+  flex: 0 0 28px;
+  place-items: center;
+  width: 28px;
+  height: 28px;
+  padding: 0;
+  border: 0;
+  border-radius: 8px;
+  background: transparent;
+  color: var(--text-secondary);
+}
+
+.ai-chat-attachment-button:hover:not(:disabled) {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.ai-chat-attachment-button svg {
+  width: 15px;
+  height: 15px;
+}
+
+.ai-chat-menu-wrap {
+  position: relative;
+}
+
+.ai-chat-menu-wrap > button {
+  display: flex;
+  align-items: center;
+  max-width: 150px;
+  height: 28px;
+  gap: 4px;
+  padding: 0 8px;
+  overflow: hidden;
+  border: 0;
+  border-radius: 8px;
+  background: transparent;
+  color: var(--text-secondary);
+  font-size: 12px;
+}
+
+.ai-chat-menu-wrap > button:hover:not(:disabled),
+.ai-chat-menu-wrap > button[aria-expanded="true"] {
+  background: var(--surface-hover);
+  color: var(--text-primary);
+}
+
+.ai-chat-menu-wrap > button > span {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ai-chat-menu-wrap > button svg {
+  flex: 0 0 10px;
+  width: 10px;
+  height: 10px;
+}
+
+.ai-chat-model-menu-wrap {
+  min-width: 0;
+}
+
+.ai-chat-menu-wrap > .ai-chat-model-trigger {
+  max-width: 240px;
+  height: 28px;
+  gap: 5px;
+  padding: 0 7px;
+  border-radius: 8px;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 14px;
+}
+
+.ai-chat-model-trigger .ai-chat-model-effort {
+  color: var(--text-tertiary);
+}
+
+.ai-chat-option-menu {
+  position: absolute;
+  z-index: 60;
+  bottom: calc(100% + 8px);
+  left: 0;
+  min-width: 160px;
+  max-width: min(290px, calc(100vw - 42px));
+  max-height: 290px;
+  padding: 4px;
+  overflow: auto;
+  border: .5px solid var(--border-strong);
+  border-radius: 15px;
+  background: color-mix(in srgb, var(--surface-raised) 94%, transparent);
+  box-shadow: var(--dialog-shadow);
+  backdrop-filter: blur(18px);
+}
+
+.ai-chat-model-menu-wrap .ai-chat-option-menu {
+  right: 0;
+  left: auto;
+  width: min(280px, calc(100vw - 42px));
+  min-width: 280px;
+}
+
+.ai-chat-option-menu > button {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) 15px;
+  align-items: center;
+  width: 100%;
+  min-height: 31px;
+  gap: 8px;
+  padding: 5px 7px;
+  border: 0;
+  border-radius: 6px;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 10px;
+  text-align: left;
+}
+
+.ai-chat-option-menu > button:hover {
+  background: var(--surface-hover);
+}
+
+.ai-chat-option-menu > button > span {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}
+
+.ai-chat-option-menu strong,
+.ai-chat-option-menu small {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ai-chat-option-menu strong {
+  font-size: 10px;
+  font-weight: 550;
+}
+
+.ai-chat-option-menu small {
+  color: var(--text-tertiary);
+  font-size: 8px;
+}
+
+.ai-chat-option-menu svg {
+  width: 12px;
+  height: 12px;
+  color: var(--accent);
+}
+
+.ai-chat-config-menu {
+  max-height: min(440px, calc(100vh - 180px));
+}
+
+.ai-chat-config-menu > button {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) auto 16px;
+  align-items: center;
+  width: 100%;
+  min-height: 40px;
+  gap: 8px;
+  padding: 0 10px;
+  border: 0;
+  border-radius: 10px;
+  background: transparent;
+  color: var(--text-primary);
+  font-size: 14px;
+  text-align: left;
+}
+
+.ai-chat-config-menu > button:hover {
+  background: var(--surface-hover);
+}
+
+.ai-chat-config-menu > button > span {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}
+
+.ai-chat-config-menu > button strong,
+.ai-chat-config-menu > button small {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.ai-chat-config-menu > button strong {
+  max-width: 175px;
+  color: var(--text-tertiary);
+  font-size: 14px;
+  font-weight: 430;
+}
+
+.ai-chat-config-menu > button small {
+  color: var(--text-tertiary);
+  font-size: 12px;
+}
+
+.ai-chat-config-menu > button svg {
+  width: 13px;
+  height: 13px;
+  color: var(--text-tertiary);
+}
+
+.ai-chat-config-submenu > header {
+  position: relative;
+  display: grid;
+  place-items: center;
+  height: 36px;
+  color: var(--text-primary);
+  font-size: 14px;
+}
+
+.ai-chat-config-submenu > header > button {
+  position: absolute;
+  left: 2px;
+  display: grid;
+  place-items: center;
+  width: 30px;
+  height: 30px;
+  padding: 0;
+  border: 0;
+  border-radius: 8px;
+  background: transparent;
+  color: var(--text-secondary);
+}
+
+.ai-chat-config-submenu > header > button:hover {
+  background: var(--surface-hover);
+}
+
+.ai-chat-config-submenu > header svg {
+  width: 14px;
+  height: 14px;
+}
+
+.ai-chat-config-submenu > button {
+  grid-template-columns: minmax(0, 1fr) 16px;
+}
+
+.ai-chat-model-list > button {
+  min-height: 32px;
+}
+
+.ai-chat-model-list > button strong {
+  color: inherit;
+  font-weight: inherit;
+}
+
+.ai-chat-config-submenu > button > span {
+  display: flex;
+  flex-direction: column;
+}
+
+.ai-chat-config-submenu > button > span:not(:has(strong)) {
+  display: block;
+}
+
+.ai-chat-toolbar-spacer {
+  flex: 1;
+}
+
+.ai-chat-send-button {
+  display: grid;
+  flex: 0 0 28px;
+  place-items: center;
+  width: 28px;
+  height: 28px;
+  padding: 0;
+  border: 0;
+  border-radius: 50%;
+  background: var(--text-primary);
+  color: var(--bg);
+}
+
+.ai-chat-send-button:disabled {
+  background: var(--surface-active);
+  color: var(--text-quaternary);
+  opacity: 1;
+}
+
+.ai-chat-send-button.is-stop {
+  background: var(--text-primary);
+  color: var(--bg);
+}
+
+.ai-chat-stop-mark {
+  width: 8px;
+  height: 8px;
+  border-radius: 1.5px;
+  background: currentColor;
+}
+
+.ai-chat-send-button svg {
+  width: 16px;
+  height: 16px;
+}
+
+.ai-chat-permission-menu-wrap > .ai-chat-permission-trigger {
+  max-width: 170px;
+  padding: 0 7px;
+  color: var(--text-secondary);
+  font-size: 14px;
+}
+
+.ai-chat-permission-trigger > svg:first-child {
+  flex: 0 0 16px;
+  width: 16px;
+  height: 16px;
+}
+
+.ai-chat-permission-menu {
+  width: min(325px, calc(100vw - 42px));
+  max-width: none;
+}
+
+.ai-chat-permission-menu > header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  min-height: 36px;
+  padding: 0 10px;
+  color: var(--text-tertiary);
+  font-size: 13px;
+}
+
+.ai-chat-permission-menu > header a {
+  color: var(--text-secondary);
+  text-decoration: underline;
+  text-underline-offset: 3px;
+}
+
+.ai-chat-permission-menu > button {
+  grid-template-columns: 20px minmax(0, 1fr) 16px;
+  min-height: 62px;
+  gap: 10px;
+  padding: 8px 10px;
+  border-radius: 10px;
+}
+
+.ai-chat-permission-menu > button > svg:first-child {
+  width: 18px;
+  height: 18px;
+  color: var(--text-secondary);
+}
+
+.ai-chat-permission-menu > button > span {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.ai-chat-permission-menu > button strong {
+  color: var(--text-primary);
+  font-size: 14px;
+  font-weight: 560;
+}
+
+.ai-chat-permission-menu > button small {
+  color: var(--text-tertiary);
+  font-size: 12px;
+  line-height: 1.35;
+  white-space: normal;
+}
+
+.ai-chat-permission-menu > button.is-danger > svg:first-child,
+.ai-chat-permission-menu > button.is-danger strong,
+.ai-chat-permission-menu > button.is-danger small {
+  color: #f05a18;
+}
+
+.ai-chat-confirm-backdrop {
+  position: absolute;
+  z-index: 70;
+  inset: 0;
+  display: grid;
+  place-items: center;
+  padding: 18px;
+  background: rgba(15, 15, 17, 0.28);
+  backdrop-filter: blur(2px);
+}
+
+.ai-chat-confirm {
+  width: min(330px, 100%);
+  padding: 18px;
+  border: 1px solid var(--border-strong);
+  border-radius: 14px;
+  background: var(--surface-raised);
+  box-shadow: var(--dialog-shadow);
+}
+
+.ai-chat-confirm > strong {
+  font-size: 13px;
+  font-weight: 620;
+}
+
+.ai-chat-confirm > p {
+  margin: 7px 0 18px;
+  color: var(--text-secondary);
+  font-size: 10px;
+  line-height: 1.65;
+}
+
+.ai-chat-confirm > div {
+  display: flex;
+  justify-content: flex-end;
+  gap: 7px;
+}
+
+.ai-chat-confirm button {
+  height: 29px;
+  padding: 0 11px;
+  border: 0;
+  border-radius: 7px;
+  background: var(--surface-muted);
+  color: var(--text-primary);
+}
+
+.ai-chat-confirm button.is-danger {
+  background: var(--danger);
+  color: white;
+}
+
+.ai-chat-spinner {
+  display: inline-block;
+  width: 12px;
+  height: 12px;
+  border: 1.5px solid color-mix(in srgb, currentColor 22%, transparent);
+  border-top-color: currentColor;
+  border-radius: 50%;
+  animation: ai-chat-spin .8s linear infinite;
+}
+
+@keyframes ai-chat-spin {
+  to { transform: rotate(360deg); }
+}
+
+@keyframes ai-chat-status-pulse {
+  0%,
+  100% { transform: scale(.86); opacity: .72; }
+  50% { transform: scale(1); opacity: 1; }
+}
+
+@keyframes ai-chat-panel-in {
+  from { opacity: 0; transform: translateY(8px) scale(.985); }
+  to { opacity: 1; transform: translateY(0) scale(1); }
+}
+
+@media (max-width: 719px) {
+  .ai-chat-panel {
+    inset: 0;
+    width: 100%;
+    min-width: 0;
+    height: 100%;
+    border: 0;
+    border-radius: 0;
+    resize: none;
+  }
+
+  .ai-chat-resize-handle {
+    display: none;
+  }
+
+  .ai-chat-resize-toggle {
+    display: none;
+  }
+
+  .ai-chat-launcher {
+    right: 12px;
+    bottom: 12px;
+  }
+
+  .ai-chat-composer {
+    margin-right: 8px;
+    margin-bottom: 8px;
+    margin-left: 8px;
+  }
+
+  .ai-chat-composer-toolbar {
+    position: relative;
+  }
+
+  .ai-chat-menu-wrap {
+    position: static;
+  }
+
+  .ai-chat-option-menu,
+  .ai-chat-model-menu-wrap .ai-chat-option-menu {
+    right: 0;
+    left: 0;
+    min-width: 0;
+    max-width: none;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .ai-chat-launcher,
+  .ai-chat-panel,
+  .ai-chat-thinking-chevron,
+  .ai-chat-thinking-panel,
+  .ai-chat-thinking-step-entry,
+  .ai-chat-thinking-step-label,
+  .ai-chat-thinking-detail-panel {
+    transition: none;
+    animation: none;
+  }
+}
+
+.app-shell.embedded .board-column {
+  flex-basis: 340px;
+  width: 340px;
+}
+
+.app-shell.embedded .board {
+  gap: 8px;
+}
+
+.app-shell.embedded .task-card h3 {
+  font-size: 13px;
+  line-height: 18px;
+}
+
+.app-shell.embedded .loading-column {
+  flex-basis: 340px;
+}
+
+.app-shell.embedded .search-field {
+  width: 28px;
+}
+
+.app-shell.embedded .search-field:focus-within,
+.app-shell.embedded .search-field.has-value {
+  width: min(140px, 20vw);
+}
+
+@media (max-width: 1040px) {
+  .workflow-board {
+    --workflow-library-width: 190px;
+    --workflow-inspector-width: 240px;
+  }
+
+  .issue-detail-layout {
+    grid-template-columns: minmax(0, 1fr) 260px;
+    gap: 40px;
+    padding-right: 28px;
+    padding-left: 28px;
+  }
+}
+
+@media (max-width: 760px) {
+  .issue-detail-layout {
+    display: flex;
+    flex-direction: column;
+    gap: 26px;
+    padding: 30px 20px 64px;
+  }
+
+  .issue-detail-main,
+  .issue-properties {
+    width: 100%;
+  }
+
+  .issue-properties {
+    position: static;
+    order: -1;
+    display: grid;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 1px 8px;
+    padding-bottom: 18px;
+    border-bottom: var(--border-hairline) solid var(--border);
+  }
+
+  .issue-properties h2,
+  .issue-relation-sidebar,
+  .detail-timestamps {
+    grid-column: 1 / -1;
+  }
+
+  .detail-property-row {
+    grid-template-columns: 18px 54px minmax(0, 1fr);
+  }
+}
+
+@media (max-width: 840px) {
+  .workflow-board {
+    --workflow-library-width: 184px;
+  }
+
+  .app-shell:not(.embedded) {
+    display: block;
+  }
+
+  .app-nav {
+    position: sticky;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    width: 100%;
+    height: 46px;
+    padding: 7px 10px;
+    overflow: hidden;
+    border-right: 0;
+    border-bottom: var(--border-hairline) solid var(--border);
+  }
+
+  .app-shell:not(.embedded) .workspace {
+    height: calc(100vh - 46px);
+  }
+
+  .primary-nav,
+  .project-nav,
+  .connection,
+  .nav-footer {
+    display: none;
+  }
+
+  .nav-spacer {
+    display: block;
+  }
+
+}
+
+@media (max-width: 620px) {
+  .workflow-board {
+    display: block;
+  }
+
+  .workflow-library,
+  .workflow-inspector {
+    display: none;
+  }
+
+  .workflow-canvas-shell {
+    height: 100%;
+  }
+
+  .workspace-header {
+    padding: 0 10px;
+    padding-left: calc(10px + var(--codex-titlebar-left-inset, 0px));
+  }
+
+  .project-avatar,
+  .codex-context,
+  .header-actions .toolbar-connection,
+  .favorite-button {
+    display: none;
+  }
+
+  .bulk-project-move {
+    display: inline-flex;
+  }
+
+  .bulk-task-actions {
+    gap: 2px;
+  }
+
+  .bulk-task-action {
+    justify-content: center;
+    width: 28px;
+    max-width: 28px;
+    padding: 0;
+  }
+
+  .bulk-task-action > span {
+    display: none;
+  }
+
+  .project-name {
+    max-width: 35vw;
+  }
+
+  .board-toolbar {
+    padding: 0 8px;
+  }
+
+  .search-field {
+    width: 28px;
+  }
+
+  .search-field:focus-within,
+  .search-field.has-value {
+    width: min(150px, 42vw);
+  }
+
+  .board-scroll {
+    padding-right: 10px;
+    padding-left: 10px;
+    scroll-snap-type: x mandatory;
+  }
+
+  .board-column {
+    flex-basis: min(84vw, 300px);
+    width: min(84vw, 300px);
+    scroll-snap-align: start;
+  }
+
+  .hidden-columns {
+    flex-basis: min(76vw, 280px);
+    width: min(76vw, 280px);
+    scroll-snap-align: start;
+  }
+
+  .task-card {
+    width: 100%;
+  }
+
+  .archived-issue-row {
+    align-items: stretch;
+    flex-direction: column;
+  }
+
+  .archived-issue-actions {
+    justify-content: flex-end;
+  }
+
+  .hierarchy-view {
+    padding: 0;
+  }
+
+  .hierarchy-view-heading {
+    padding: 0 10px;
+  }
+
+  .hierarchy-table {
+    min-width: 0;
+    padding: 0 8px 8px;
+  }
+
+  .hierarchy-table-header,
+  .hierarchy-row {
+    grid-template-columns: minmax(260px, 1fr) 112px 58px 112px 28px;
+    min-width: 620px;
+  }
+
+  .dialog-updated,
+  .keyboard-note {
+    display: none;
+  }
+
+  .dialog-footer {
+    justify-content: flex-end;
+  }
+
+  .issue-detail-layout {
+    padding: 24px 10px 54px;
+  }
+
+  .issue-properties {
+    display: block;
+    margin: 0 6px;
+  }
+
+  .issue-editor {
+    padding-right: 8px;
+    padding-left: 8px;
+  }
+
+  .issue-sub-issues,
+  .issue-attachments {
+    padding-right: 8px;
+    padding-left: 8px;
+  }
+
+  .activity-section {
+    padding-right: 8px;
+    padding-left: 8px;
+  }
+
+  .activity-section::before {
+    right: 8px;
+    left: 8px;
+  }
+
+  .issue-title-input {
+    font-size: 22px;
+    line-height: 32px;
+  }
+
+  .issue-conversation-link {
+    width: 100%;
+  }
+
+  .comment-composer {
+    margin-right: 0;
+    margin-left: 0;
+  }
+
+  .composer-footer > span,
+  .composer-footer kbd {
+    display: none;
+  }
+}
+
+@media (hover: none) {
+  .column-actions,
+  .card-actions,
+  .comment-actions,
+  .attachment-actions,
+  .ai-chat-history-delete {
+    opacity: 1;
+  }
+
+  .card-actions {
+    pointer-events: auto;
+    transform: translateX(0);
+  }
+
+  .card-assignee-avatar {
+    opacity: 0;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  *,
+  *::before,
+  *::after {
+    scroll-behavior: auto !important;
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+  }
+}
diff --git a/apps/codex-taskboard/web/src/taskFilters.ts b/apps/codex-taskboard/web/src/taskFilters.ts
new file mode 100644
index 000000000..ff9c32a0a
--- /dev/null
+++ b/apps/codex-taskboard/web/src/taskFilters.ts
@@ -0,0 +1,119 @@
+import {
+  TASK_PRIORITIES,
+  TASK_STATUSES,
+  type Task,
+  type TaskPriority,
+  type TaskStatus,
+} from "./types";
+
+export type TaskLinkFilter = "all" | "linked" | "unlinked";
+export type TaskFilterKey = "statuses" | "priorities" | "labels" | "link" | "content";
+
+export interface TaskFilters {
+  statuses: TaskStatus[];
+  priorities: TaskPriority[];
+  labels: string[];
+  link: TaskLinkFilter;
+  content: string;
+}
+
+export const EMPTY_TASK_FILTERS: TaskFilters = {
+  statuses: [],
+  priorities: [],
+  labels: [],
+  link: "all",
+  content: "",
+};
+
+function isTaskStatus(value: string): value is TaskStatus {
+  return TASK_STATUSES.includes(value as TaskStatus);
+}
+
+function isTaskPriority(value: string): value is TaskPriority {
+  return TASK_PRIORITIES.includes(value as TaskPriority);
+}
+
+export function readTaskFilters(): TaskFilters {
+  const params = new URLSearchParams(window.location.search);
+  const statuses = (params.get("status") ?? "").split(",").filter(isTaskStatus);
+  const priorities = (params.get("priority") ?? "").split(",").filter(isTaskPriority);
+  const linkValue = params.get("linked");
+
+  return {
+    statuses,
+    priorities,
+    labels: params.getAll("label").filter(Boolean),
+    link: linkValue === "yes" ? "linked" : linkValue === "no" ? "unlinked" : "all",
+    content: params.get("content") ?? "",
+  };
+}
+
+export function writeTaskFilters(filters: TaskFilters) {
+  const url = new URL(window.location.href);
+
+  if (filters.statuses.length) url.searchParams.set("status", filters.statuses.join(","));
+  else url.searchParams.delete("status");
+
+  if (filters.priorities.length) url.searchParams.set("priority", filters.priorities.join(","));
+  else url.searchParams.delete("priority");
+
+  url.searchParams.delete("label");
+  filters.labels.forEach((label) => url.searchParams.append("label", label));
+
+  if (filters.link === "linked") url.searchParams.set("linked", "yes");
+  else if (filters.link === "unlinked") url.searchParams.set("linked", "no");
+  else url.searchParams.delete("linked");
+
+  if (filters.content.trim()) url.searchParams.set("content", filters.content.trim());
+  else url.searchParams.delete("content");
+
+  window.history.replaceState(null, "", url);
+}
+
+export function taskFilterCount(filters: TaskFilters): number {
+  return Number(filters.statuses.length > 0)
+    + Number(filters.priorities.length > 0)
+    + Number(filters.labels.length > 0)
+    + Number(filters.link !== "all")
+    + Number(Boolean(filters.content.trim()));
+}
+
+export function matchesTaskSearch(task: Task, search: string): boolean {
+  const needle = search.trim().toLowerCase();
+  if (!needle) return true;
+  return [task.identifier, task.title, task.description, ...task.labels]
+    .join(" ")
+    .toLowerCase()
+    .includes(needle);
+}
+
+export function matchesTaskFilters(
+  task: Task,
+  filters: TaskFilters,
+  omit?: TaskFilterKey,
+): boolean {
+  if (omit !== "statuses" && filters.statuses.length && !filters.statuses.includes(task.status)) {
+    return false;
+  }
+  if (omit !== "priorities" && filters.priorities.length && !filters.priorities.includes(task.priority)) {
+    return false;
+  }
+  if (
+    omit !== "labels"
+    && filters.labels.length
+    && !filters.labels.some((label) => task.labels.includes(label))
+  ) {
+    return false;
+  }
+  if (omit !== "link" && filters.link === "linked" && !task.threadId) return false;
+  if (omit !== "link" && filters.link === "unlinked" && task.threadId) return false;
+
+  if (omit !== "content") {
+    const content = filters.content.trim().toLowerCase();
+    if (content && ![task.title, task.description].join(" ").toLowerCase().includes(content)) {
+      return false;
+    }
+  }
+
+  return true;
+}
diff --git a/apps/codex-taskboard/web/src/taskHierarchy.ts b/apps/codex-taskboard/web/src/taskHierarchy.ts
new file mode 100644
index 000000000..63d6858e2
--- /dev/null
+++ b/apps/codex-taskboard/web/src/taskHierarchy.ts
@@ -0,0 +1,44 @@
+import type { Task, TaskRelationSummary } from "./types";
+
+export type HierarchyTrailItem = Pick<TaskRelationSummary, "id" | "identifier" | "title" | "status">;
+
+export function createTaskLookup(tasks: readonly Task[]) {
+  return new Map(tasks.map((task) => [task.id, task]));
+}
+
+export function getAncestorTrail(
+  task: Task,
+  taskById: ReadonlyMap<string, Task>,
+): HierarchyTrailItem[] {
+  const trail: HierarchyTrailItem[] = [];
+  const seen = new Set([task.id]);
+  let parent = task.relations.parent;
+
+  while (parent && !seen.has(parent.id)) {
+    seen.add(parent.id);
+    const fullParent = taskById.get(parent.id);
+    trail.push(fullParent ?? parent);
+    if (!fullParent) break;
+    parent = fullParent.relations.parent;
+  }
+
+  return trail.reverse();
+}
+
+export function countTaskDescendants(
+  task: Task,
+  taskById: ReadonlyMap<string, Task>,
+) {
+  const descendants = new Set<string>();
+  const queue = [...task.relations.subIssues.map((issue) => issue.id)];
+
+  while (queue.length > 0) {
+    const id = queue.shift()!;
+    if (descendants.has(id)) continue;
+    descendants.add(id);
+    const child = taskById.get(id);
+    if (child) queue.push(...child.relations.subIssues.map((issue) => issue.id));
+  }
+
+  return descendants.size;
+}
diff --git a/apps/codex-taskboard/web/src/types.ts b/apps/codex-taskboard/web/src/types.ts
new file mode 100644
index 000000000..15ccb7b61
--- /dev/null
+++ b/apps/codex-taskboard/web/src/types.ts
@@ -0,0 +1,283 @@
+export const TASK_STATUSES = [
+  "backlog",
+  "todo",
+  "in_progress",
+  "in_review",
+  "blocked",
+  "done",
+  "canceled",
+] as const;
+export const TASK_PRIORITIES = ["none", "urgent", "high", "medium", "low"] as const;
+
+export type TaskStatus = (typeof TASK_STATUSES)[number];
+export type TaskPriority = (typeof TASK_PRIORITIES)[number];
+export type ActorType = "user" | "agent";
+export type AssigneeTarget = "current-user" | "codex-agent";
+export type IssueRelationType = "parent" | "blocks" | "blocked_by" | "related";
+
+export interface ActorIdentity {
+  type: ActorType;
+  id: string;
+  name: string;
+  avatarUrl: string | null;
+}
+
+export type DevelopmentContext =
+  | { type: "branch"; branch: string }
+  | { type: "worktree"; path: string; branch: string | null };
+
+export type Recurrence = {
+  interval: number;
+  unit: "day" | "week" | "month" | "year";
+};
+
+export interface DevelopmentScan {
+  workspacePath: string | null;
+  contexts: DevelopmentContext[];
+}
+
+export interface TaskboardMetadata {
+  manageTaskboardSkillPath?: string;
+  capabilities?: TaskboardCapabilities;
+  mode?: "local" | "cloud";
+  realtime?: {
+    transport: "poll";
+    intervalMs: number;
+  };
+  localCapabilities?: {
+    available: boolean;
+  };
+}
+
+export interface TaskboardCapabilities {
+  localAiChat: boolean;
+}
+
+export type AiChatSandbox = "read-only" | "workspace-write" | "danger-full-access";
+export type AiChatThreadStatus = "idle" | "running" | "failed";
+export type AiChatRunStatus = "running" | "completed" | "failed" | "interrupted";
+
+export interface AiChatModel {
+  slug: string;
+  displayName: string;
+  description: string;
+  defaultReasoningEffort: string;
+  supportedReasoningEfforts: string[];
+  serviceTiers: Array<{ id: string; name: string }>;
+}
+
+export interface AiChatSkill {
+  id: string;
+  label: string;
+  description: string;
+  path: string;
+  scope: "user" | "repo" | "system" | "admin";
+}
+
+export interface AiChatAttachmentInput {
+  filename: string;
+  contentType: string;
+  dataBase64: string;
+}
+
+export interface AiChatCatalog {
+  models: AiChatModel[];
+  skills: AiChatSkill[];
+  sandboxes: string[];
+}
+
+export interface AiChatOrigin {
+  projectId: string;
+  projectName: string;
+  workspacePath: string;
+  issueId?: string;
+  issueIdentifier?: string;
+}
+
+export interface AiChatRun {
+  id: string;
+  threadId: string;
+  status: AiChatRunStatus;
+  exitCode?: number | null;
+  error?: string | null;
+  startedAt?: string;
+  finishedAt?: string | null;
+}
+
+export interface AiChatThread {
+  id: string;
+  title: string;
+  status: AiChatThreadStatus;
+  origin: AiChatOrigin;
+  codexThreadId: string | null;
+  model: string;
+  reasoningEffort: string;
+  sandbox: AiChatSandbox;
+  createdAt: string;
+  updatedAt: string;
+  currentRun?: AiChatRun | null;
+}
+
+export interface AiChatEvent {
+  id: string;
+  threadId?: string;
+  runId?: string | null;
+  type: string;
+  role: "user" | "assistant" | "activity" | "error";
+  content: string;
+  data?: Record<string, unknown> | null;
+  createdAt?: string;
+}
+
+export interface AiChatThreadSnapshot {
+  thread: AiChatThread;
+  events: AiChatEvent[];
+  runs: AiChatRun[];
+}
+
+export interface WorkflowCapabilityOption {
+  id: string;
+  label: string;
+  scope: "user" | "repo" | "system" | "admin";
+}
+
+export interface WorkflowMcpServerOption {
+  id: string;
+  label: string;
+  transport: string;
+}
+
+export interface WorkflowCapabilities {
+  skills: WorkflowCapabilityOption[];
+  mcpServers: WorkflowMcpServerOption[];
+}
+
+export interface WorkflowOption {
+  id: string;
+  name: string;
+}
+
+export interface WorkflowWorkspaceRecord<T = unknown> {
+  projectId: string;
+  workspace: T | null;
+  version: number;
+  updatedAt: string | null;
+}
+
+export interface Project {
+  id: string;
+  name: string;
+  workspacePath: string | null;
+  issueCount: number;
+  archivedAt: string | null;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface TaskRelationSummary {
+  id: string;
+  identifier: string;
+  projectId: string;
+  title: string;
+  status: TaskStatus;
+  priority: TaskPriority;
+  threadId: string | null;
+  assignee: ActorIdentity;
+  archivedAt: string | null;
+}
+
+export interface TaskRelations {
+  parent: TaskRelationSummary | null;
+  subIssues: TaskRelationSummary[];
+  blockedBy: TaskRelationSummary[];
+  blocks: TaskRelationSummary[];
+  related: TaskRelationSummary[];
+}
+
+export interface Task {
+  id: string;
+  identifier: string;
+  projectId: string;
+  title: string;
+  description: string;
+  status: TaskStatus;
+  priority: TaskPriority;
+  labels: string[];
+  sortOrder: number;
+  threadId: string | null;
+  creatorType: ActorType;
+  creatorId: string;
+  creatorName: string;
+  creatorAvatarUrl: string | null;
+  assignee: ActorIdentity;
+  workflowId: string | null;
+  developmentContext: DevelopmentContext | null;
+  dueDate: string | null;
+  recurrence: Recurrence | null;
+  archivedAt: string | null;
+  relations: TaskRelations;
+  version: number;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface Comment {
+  id: string;
+  taskId: string;
+  body: string;
+  authorType: ActorType;
+  authorId: string;
+  authorName: string;
+  authorAvatarUrl: string | null;
+  threadId: string | null;
+  attachments: Attachment[];
+  version: number;
+  createdAt: string;
+  updatedAt: string;
+}
+
+export interface Attachment {
+  id: string;
+  taskId: string;
+  commentId: string | null;
+  filename: string;
+  contentType: string;
+  size: number;
+  createdAt: string;
+}
+
+export interface HostContext {
+  user?: ActorIdentity;
+  workspacePath?: string;
+  threadId?: string;
+  visibleThreadIds?: string[];
+  theme?: "light" | "dark";
+  projectId?: string;
+  projects?: Array<{ id: string; name: string }>;
+  titlebarLeftInset?: number;
+  sidebarCollapsed?: boolean;
+}
+
+export interface TaskDraft {
+  title: string;
+  description: string;
+  status: TaskStatus;
+  priority: TaskPriority;
+  labels: string[];
+  assigneeTarget?: AssigneeTarget;
+  workflowId: string | null;
+  developmentContext: DevelopmentContext | null;
+  dueDate: string | null;
+  recurrence: Recurrence | null;
+}
+
+export interface TaskEvent {
+  type: string;
+  projectId?: string;
+  taskId?: string;
+  task?: Task;
+  comment?: Comment;
+  attachment?: Attachment;
+  project?: Project;
+  at: string;
+}
diff --git a/apps/codex-taskboard/web/src/vite-env.d.ts b/apps/codex-taskboard/web/src/vite-env.d.ts
new file mode 100644
index 000000000..11f02fe2a
--- /dev/null
+++ b/apps/codex-taskboard/web/src/vite-env.d.ts
@@ -0,0 +1 @@
+/// <reference types="vite/client" />
diff --git a/apps/codex-taskboard/web/src/workflowStore.ts b/apps/codex-taskboard/web/src/workflowStore.ts
new file mode 100644
index 000000000..92560f814
--- /dev/null
+++ b/apps/codex-taskboard/web/src/workflowStore.ts
@@ -0,0 +1,42 @@
+import type { WorkflowOption } from "./types";
+
+export const WORKFLOW_STATE_KEY_PREFIX = "taskboard.workflow.workspace.";
+export const INITIAL_WORKFLOW_ID = "issue-delivery";
+export const INITIAL_WORKFLOW_NAME = "任务处理与交付";
+export const DEFAULT_WORKFLOW_OPTIONS: WorkflowOption[] = [
+  { id: INITIAL_WORKFLOW_ID, name: INITIAL_WORKFLOW_NAME },
+];
+
+export function workflowStorageKey(projectId: string): string {
+  return `${WORKFLOW_STATE_KEY_PREFIX}${projectId}`;
+}
+
+export function readLegacyWorkflowWorkspace(projectId: string): unknown | null {
+  try {
+    const raw = window.localStorage.getItem(workflowStorageKey(projectId));
+    return raw ? JSON.parse(raw) : null;
+  } catch {
+    return null;
+  }
+}
+
+export function clearLegacyWorkflowWorkspace(projectId: string): void {
+  window.localStorage.removeItem(workflowStorageKey(projectId));
+}
+
+export function workflowOptionsFromWorkspace(workspace: unknown): WorkflowOption[] {
+  if (!workspace || typeof workspace !== "object" || Array.isArray(workspace)) {
+    return DEFAULT_WORKFLOW_OPTIONS;
+  }
+  const tabs = (workspace as { tabs?: unknown }).tabs;
+  if (!Array.isArray(tabs)) return DEFAULT_WORKFLOW_OPTIONS;
+  const workflows = tabs.filter((workflow): workflow is WorkflowOption => (
+    workflow !== null
+      && typeof workflow === "object"
+      && typeof (workflow as Partial<WorkflowOption>).id === "string"
+      && (workflow as Partial<WorkflowOption>).id!.length > 0
+      && typeof (workflow as Partial<WorkflowOption>).name === "string"
+      && (workflow as Partial<WorkflowOption>).name!.length > 0
+  ));
+  return workflows.length > 0 ? workflows : DEFAULT_WORKFLOW_OPTIONS;
+}
diff --git a/apps/codex-taskboard/web/tsconfig.json b/apps/codex-taskboard/web/tsconfig.json
new file mode 100644
index 000000000..e935337c4
--- /dev/null
+++ b/apps/codex-taskboard/web/tsconfig.json
@@ -0,0 +1,20 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "useDefineForClassFields": true,
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "allowJs": false,
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "module": "ESNext",
+    "moduleResolution": "Bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "react-jsx"
+  },
+  "include": ["src"]
+}
diff --git a/apps/codex-taskboard/web/vite.config.ts b/apps/codex-taskboard/web/vite.config.ts
new file mode 100644
index 000000000..4c403d06a
--- /dev/null
+++ b/apps/codex-taskboard/web/vite.config.ts
@@ -0,0 +1,20 @@
+import { fileURLToPath, URL } from "node:url";
+import react from "@vitejs/plugin-react";
+import { defineConfig } from "vite";
+
+export default defineConfig({
+  root: fileURLToPath(new URL(".", import.meta.url)),
+  plugins: [react()],
+  build: {
+    outDir: fileURLToPath(new URL("../dist/web", import.meta.url)),
+    emptyOutDir: true,
+  },
+  server: {
+    host: "127.0.0.1",
+    port: 5173,
+    strictPort: true,
+    proxy: {
+      "/api": "http://127.0.0.1:47823",
+    },
+  },
+});
diff --git a/apps/codex-taskboard/wrangler.jsonc b/apps/codex-taskboard/wrangler.jsonc
new file mode 100644
index 000000000..ef5e54a38
--- /dev/null
+++ b/apps/codex-taskboard/wrangler.jsonc
@@ -0,0 +1,32 @@
+{
+  "$schema": "./node_modules/wrangler/config-schema.json",
+  "name": "codex-taskboard",
+  "main": "cloud/src/index.mjs",
+  "compatibility_date": "2026-07-24",
+  "routes": [
+    {
+      "pattern": "taskboard.dsxzai.com",
+      "custom_domain": true
+    }
+  ],
+  "assets": {
+    "directory": "./dist/web",
+    "binding": "ASSETS",
+    "not_found_handling": "single-page-application",
+    "run_worker_first": true
+  },
+  "d1_databases": [
+    {
+      "binding": "DB",
+      "database_name": "codex-taskboard-db",
+      "database_id": "6b90b71b-81e0-473a-a70c-470b388b7e99",
+      "migrations_dir": "cloud/migrations"
+    }
+  ],
+  "r2_buckets": [
+    {
+      "binding": "ATTACHMENTS",
+      "bucket_name": "codex-taskboard-attachments"
+    }
+  ]
+}