@loomhelm/multi-task-flow 0.2.1 → 0.2.7

package/toolkit/skills/multi-task-flow/node_modules/zod/v4/package.json

@@ -0,0 +1,7 @@
+{ 
+  "type": "module",
+  "main": "./index.cjs",
+  "module": "./index.js",
+  "types": "./index.d.cts",
+  "sideEffects": false
+}

package/toolkit/skills/multi-task-flow/node_modules/zod/v4-mini/index.cjs

@@ -0,0 +1,51 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.z = void 0;
+const z = __importStar(require("../v4/mini/external.cjs"));
+exports.z = z;
+__exportStar(require("../v4/mini/external.cjs"), exports);
+
+// seal-cjs-exports
+(function () {
+  var keys = Object.getOwnPropertyNames(exports);
+  for (var i = 0; i < keys.length; i++) {
+    var desc = Object.getOwnPropertyDescriptor(exports, keys[i]);
+    if (!desc || !desc.get || !desc.configurable) continue;
+    var value;
+    try {
+      value = desc.get();
+    } catch (e) {
+      continue;
+    }
+    // a circular require may not have settled this one yet, so leave it live
+    if (value === undefined) continue;
+    Object.defineProperty(exports, keys[i], { value: value, writable: false, enumerable: desc.enumerable, configurable: false });
+  }
+  Object.freeze(exports);
+})();

package/toolkit/skills/multi-task-flow/node_modules/zod/v4-mini/index.d.cts

@@ -0,0 +1,3 @@
+import * as z from "../v4/mini/external.cjs";
+export * from "../v4/mini/external.cjs";
+export { z };

package/toolkit/skills/multi-task-flow/node_modules/zod/v4-mini/index.d.ts

@@ -0,0 +1,3 @@
+import * as z from "../v4/mini/external.js";
+export * from "../v4/mini/external.js";
+export { z };

package/toolkit/skills/multi-task-flow/node_modules/zod/v4-mini/index.js

@@ -0,0 +1,3 @@
+import * as z from "../v4/mini/external.js";
+export * from "../v4/mini/external.js";
+export { z };

package/toolkit/skills/multi-task-flow/node_modules/zod/v4-mini/package.json

@@ -0,0 +1,7 @@
+{ 
+  "type": "module",
+  "main": "./index.cjs",
+  "module": "./index.js",
+  "types": "./index.d.cts",
+  "sideEffects": false
+}

package/toolkit/skills/multi-task-flow/scripts/demo-static.ts

@@ -150,7 +150,7 @@ const profileDemo = JSON.stringify({
 });
 const archiveShim = archiveDemo ? archiveFixtureScript(response, preferences, profileDemo) : "";
 const prDemo = JSON.stringify({ data: { number: 42, title: "演示 PR：卡片悬浮信息", url: "https://github.com/example/repo/pull/42", state: "OPEN", mergedAt: null, mergeable: "MERGEABLE", ci: "运行中", checks: [{ name: "Unit tests", conclusion: "SUCCESS" }, { name: "Browser checks", status: "IN_PROGRESS" }] }, observed_at: "2026-11-05T08:00:00Z", stale: false, loading: false, error: null });
-const shim = `<script>${outputDemo ? "Date.now=()=>1793865600000;" : singleUnit ? `Date.now=()=>${Date.parse(ledger.updated_at)};` : ""}window.fetch=async(input,options)=>options?.method==="POST"&&String(input).includes("api/execution-profile")?new Response(JSON.stringify({message:"静态预览不会保存配置"}),{status:405}):new Response(String(input).includes("api/execution-profile")?${JSON.stringify(profileDemo)}:String(input).includes("api/preferences")?${JSON.stringify(preferences)}:String(input).includes("api/resource-details")?${JSON.stringify(prDemo)}:JSON.stringify(${response}),{headers:{"Content-Type":"application/json"}});window.EventSource=class{listeners={};constructor(){window.demoOutputUpdate=(taskId,text)=>{const state=${response};const task=state.view.tasks.find(t=>t.id===taskId);const output={...task.latest_agent_output,text,state:"available",stale:false};this.revision=(this.revision??1)+1;for(const handler of this.listeners["agent-output"]??[])handler({data:JSON.stringify({output_epoch:"static-demo",output_revision:this.revision,outputs:Object.fromEntries([...state.view.tasks.map(t=>[t.id,t.id===taskId?output:t.latest_agent_output]),...state.view.groups.map(g=>["group:"+g.id,g.latest_agent_output])])})});};}addEventListener(type,handler){(this.listeners[type]??=[]).push(handler);if(type==="open")queueMicrotask(()=>handler(new Event("open")));}close(){}};${archiveShim}document.addEventListener("DOMContentLoaded",()=>{if(new URLSearchParams(location.search).has("evidence")){const observer=new MutationObserver(()=>{const card=document.querySelector('[data-task-id="ledger"]');if(card){observer.disconnect();requestAnimationFrame(()=>card.scrollIntoView({block:"center"}));}});observer.observe(document.body,{childList:true,subtree:true});}const d=document.getElementById("details-content");new MutationObserver(()=>{for(const a of d.querySelectorAll("a")){const href=a.getAttribute("href");if(href&&href.startsWith("api/document/"))a.setAttribute("href","demo-documents/"+href.slice(13)+".html")}}).observe(d,{childList:true,subtree:true})});</script>`;
+const shim = `<script>${outputDemo ? "Date.now=()=>1793865600000;" : singleUnit ? `Date.now=()=>${Date.parse(ledger.updated_at)};` : ""}window.fetch=async(input,options)=>options?.method==="POST"&&String(input).includes("api/execution-profile")?new Response(JSON.stringify({message:"静态预览不会保存配置"}),{status:405}):new Response(String(input).includes("api/execution-profile")?${JSON.stringify(profileDemo)}:String(input).includes("api/preferences")?${JSON.stringify(preferences)}:String(input).includes("api/resource-details")?${JSON.stringify(prDemo)}:JSON.stringify(${response}),{headers:{"Content-Type":"application/json"}});window.EventSource=class{listeners={};constructor(){window.demoOutputUpdate=(taskId,text)=>{const state=${response};const task=state.view.tasks.find(t=>t.id===taskId);const output={...task.latest_agent_output,text,state:"available",stale:false};this.revision=(this.revision??1)+1;for(const handler of this.listeners["agent-output"]??[])handler({data:JSON.stringify({output_epoch:"static-demo",output_revision:this.revision,outputs:Object.fromEntries([...state.view.tasks.map(t=>[t.id,t.id===taskId?output:t.latest_agent_output]),...state.view.groups.map(g=>["group:"+g.id,g.latest_agent_output])])})});};}addEventListener(type,handler){(this.listeners[type]??=[]).push(handler);if(type==="open")queueMicrotask(()=>handler(new Event("open")));}close(){}};${archiveShim}document.addEventListener("DOMContentLoaded",()=>{const suppressConnectionNotice=()=>{const notice=document.getElementById("connection-notice");if(notice){notice.hidden=true;notice.style.display="none";}};suppressConnectionNotice();window.setInterval(suppressConnectionNotice,100);if(new URLSearchParams(location.search).has("evidence")){const observer=new MutationObserver(()=>{const card=document.querySelector('[data-task-id="ledger"]');if(card){observer.disconnect();requestAnimationFrame(()=>card.scrollIntoView({block:"center"}));}});observer.observe(document.body,{childList:true,subtree:true});}const d=document.getElementById("details-content");new MutationObserver(()=>{for(const a of d.querySelectorAll("a")){const href=a.getAttribute("href");if(href&&href.startsWith("api/document/"))a.setAttribute("href","demo-documents/"+href.slice(13)+".html")}}).observe(d,{childList:true,subtree:true})});</script>`;
 const source = readFileSync(join(output, "index.html"), "utf8");
 const css = 'href="assets/app.css"';
 const script = '<script type="module" src="assets/app.js"></script>';

package/toolkit/skills/multi-task-flow/scripts/orchestrate.ts

@@ -21,6 +21,7 @@ import {
   task,
   type Ledger,
   validateInitialRuntimeState,
+  validateNewTaskKinds,
   validateLedger,
   validatePlan,
   validateSchedulablePlan,
@@ -223,6 +224,7 @@ try {
         : group;
     });
     validateInitialRuntimeState(groups, parsed.payload.tasks);
+    validateNewTaskKinds(parsed.payload.tasks);
     const timestamp = new Date().toISOString();
     const ledger = validateLedger({
       schema_version: 2,

package/toolkit/skills/multi-task-flow/scripts/package-client-skills.ts

@@ -58,8 +58,19 @@ function declareDependencies(metadata: { dependencies?: Record<string, string> }
 const skillsPackageMetadata = JSON.parse(readFileSync(resolve(root, 'skills/package.json'), 'utf8')) as { dependencies?: Record<string, string> };
 const flowPackageMetadata = JSON.parse(readFileSync(resolve(root, 'skills/multi-task-flow/package.json'), 'utf8')) as { dependencies?: Record<string, string>; devDependencies?: Record<string, string> };
 declareDependencies(skillsPackageMetadata, 'skills/node_modules');
-declareDependencies(flowPackageMetadata, 'skills/multi-task-flow/node_modules');
-if (flowPackageMetadata.devDependencies?.playwright) dependencyDeclarations.set('playwright', { name: 'playwright', version: flowPackageMetadata.devDependencies.playwright, resourceRoot: 'skills/multi-task-flow/node_modules' });
+// The viewer's React/ELK dependencies are build-time inputs for the static
+// assets. The portable CLI only needs the runtime Skill dependencies above;
+// shipping the entire frontend dependency tree makes the tarball hundreds of
+// megabytes and slows every `bunx` startup. Keep the package's normal npm
+// dependency declarations for consumers that need the frontend, while bundling
+// only the dependencies executed by Skill scripts.
+if (flowPackageMetadata.dependencies?.zod) {
+  dependencyDeclarations.set('zod', {
+    name: 'zod',
+    version: flowPackageMetadata.dependencies.zod,
+    resourceRoot: 'skills/multi-task-flow/node_modules',
+  });
+}
 const requiredDependencies = [...dependencyDeclarations.values()].sort((left, right) => left.name.localeCompare(right.name));
 // Only this exact disposable resource output is replaced. TS is never emitted.
 if (existsSync(target)) {
@@ -125,7 +136,7 @@ for (const file of [...manifest.files, ...(manifest.additions ?? [])]) if (!pack
 copyPackageManifest();
 copy('skills/catalog.json');
 for (const name of ['index.html','app.js','app.css']) copy(`skills/multi-task-flow/dist/${name}`);
-const copyDependencies = (path: string): boolean => {
+const copyDependencies = (path: string, dependencyNames?: string[]): boolean => {
   const sourceRoot = resolve(root, path);
   if (!existsSync(sourceRoot)) {
     if (requireDependencies) throw new Error(`Prepared dependency directory missing: ${path}`);
@@ -152,7 +163,11 @@ const copyDependencies = (path: string): boolean => {
     const relativeSource = relative(resolvedRoot, resolvedSource);
     const stat = lstatSync(source);
     if (relativeSource.startsWith(`..${sep}`) || relativeSource === '..' || !stat.isFile() || stat.isSymbolicLink() || resolvedSource !== source) throw new Error('Unsafe prepared dependency: ' + destination);
-    record(destination, readFileSync(resolvedSource));
+    const output = resolve(target, destination);
+    mkdirSync(dirname(output), { recursive: true });
+    const contents = readFileSync(resolvedSource);
+    cpSync(resolvedSource, output);
+    record(destination, contents);
     preparedFiles += 1;
   };
   const walk = (relativePath: string): void => {
@@ -169,27 +184,38 @@ const copyDependencies = (path: string): boolean => {
       else copy(`${path}/${child}`, undefined, true);
     }
   };
-  walk('');
-  return preparedFiles > 0;
-};
-const prepareDependencyShims = (): PreparedDependency[] => {
-  const prepared: PreparedDependency[] = [];
-  for (const dependency of requiredDependencies) {
-    const metadata = dependencyMetadata('clients/typescript/node_modules', dependency.name, dependency.version);
-    const shimRoot = `skills/node_modules/${dependency.name}`;
-    writeGenerated(`${shimRoot}/package.json`, Buffer.from(JSON.stringify({ name: dependency.name, version: dependency.version, type: 'module', private: true }, null, 2) + '\n'));
-    const output = resolve(target, shimRoot, 'index.js');
-    const packageEntry = resolve(target, '..', 'node_modules', dependency.name, metadata.entry);
-    const targetRel = relative(dirname(output), packageEntry).split(sep).join('/');
-    const wrapper = `import * as packageExports from ${JSON.stringify(targetRel)};\nexport default packageExports.default;\nexport * from ${JSON.stringify(targetRel)};\n`;
-    writeGenerated(`${shimRoot}/index.js`, Buffer.from(wrapper));
-    prepared.push({ name: dependency.name, version: dependency.version, path: shimRoot, entry: 'index.js' });
+  if (!dependencyNames) {
+    walk('');
+    return preparedFiles > 0;
   }
-  return prepared;
+  const roots = new Map<string, string>();
+  const queue = dependencyNames.map(name => ({ name, relativePath: name }));
+  while (queue.length > 0) {
+    const current = queue.shift()!;
+    if (roots.has(current.relativePath)) continue;
+    const packageJson = resolve(sourceRoot, current.relativePath, 'package.json');
+    if (!existsSync(packageJson)) throw new Error(`Prepared dependency missing: ${current.name}`);
+    roots.set(current.relativePath, current.name);
+    const metadata = JSON.parse(readFileSync(packageJson, 'utf8')) as { dependencies?: Record<string, string>; optionalDependencies?: Record<string, string> };
+    for (const dependencyName of Object.keys(metadata.dependencies ?? {})) {
+      const nested = `${current.relativePath}/node_modules/${dependencyName}`;
+      const root = existsSync(resolve(sourceRoot, nested, 'package.json')) ? nested : dependencyName;
+      if (!roots.has(root)) queue.push({ name: dependencyName, relativePath: root });
+    }
+    for (const dependencyName of Object.keys(metadata.optionalDependencies ?? {})) {
+      const nested = `${current.relativePath}/node_modules/${dependencyName}`;
+      const root = existsSync(resolve(sourceRoot, nested, 'package.json')) ? nested : dependencyName;
+      if (existsSync(resolve(sourceRoot, root, 'package.json')) && !roots.has(root)) queue.push({ name: dependencyName, relativePath: root });
+    }
+  }
+  for (const relativePath of roots.keys()) walk(relativePath);
+  return preparedFiles > 0;
 };
 let preparedDependencies: PreparedDependency[];
 if (productPartitionBuild) {
-  for (const resourceRoot of new Set(requiredDependencies.map(dependency => dependency.resourceRoot))) copyDependencies(resourceRoot);
+  for (const resourceRoot of new Set(requiredDependencies.map(dependency => dependency.resourceRoot))) {
+    copyDependencies(resourceRoot, requiredDependencies.filter(dependency => dependency.resourceRoot === resourceRoot).map(dependency => dependency.name));
+  }
   preparedDependencies = requiredDependencies.map(dependency => {
     const metadata = dependencyMetadata(dependency.resourceRoot, dependency.name, dependency.version);
     const path = `${dependency.resourceRoot}/${dependency.name}`;
@@ -197,7 +223,19 @@ if (productPartitionBuild) {
     return { name: dependency.name, version: dependency.version, path, entry: metadata.entry };
   });
 } else {
-  preparedDependencies = prepareDependencyShims();
+  // The published package must be runnable from an isolated `bunx` install.
+  // Bun's workspace install may materialize dependency entries as shims that
+  // point outside the package; copying the prepared dependency trees keeps
+  // every runtime import inside the tarball and makes the artifact portable.
+  for (const resourceRoot of new Set(requiredDependencies.map(dependency => dependency.resourceRoot))) {
+    copyDependencies(resourceRoot, requiredDependencies.filter(dependency => dependency.resourceRoot === resourceRoot).map(dependency => dependency.name));
+  }
+  preparedDependencies = requiredDependencies.map(dependency => {
+    const metadata = dependencyMetadata(dependency.resourceRoot, dependency.name, dependency.version);
+    const path = `${dependency.resourceRoot}/${dependency.name}`;
+    if (!outputs.has(`${path}/package.json`)) throw new Error(`Prepared dependency was not copied: ${dependency.name}`);
+    return { name: dependency.name, version: dependency.version, path, entry: metadata.entry };
+  });
 }
 const dependenciesBundled = preparedDependencies.length === requiredDependencies.length && requiredDependencies.length > 0;
 if (requireDependencies && !dependenciesBundled) throw new Error('Prepared dependency closure is incomplete');
@@ -216,7 +254,8 @@ const packageIdentityBase = {
 };
 const generatedPackage = JSON.stringify({ private: true, type: 'module', packageName: packageMetadata.name, packageVersion: buildVersion, compatibilityLine: packageConfig.compatibilityLine, skillVersion: packageConfig.skillVersion }, null, 2) + '\n';
 writeFileSync(resolve(target, 'package.json'), generatedPackage);
-const finalInventory = [...outputs.values()].sort((left, right) => left.path.localeCompare(right.path));
+// Build identity must be independent of the runner's process locale.
+const finalInventory = [...outputs.values()].sort((left, right) => left.path < right.path ? -1 : left.path > right.path ? 1 : 0);
 const buildId = createHash('sha256').update(JSON.stringify({ ...packageIdentityBase, files: finalInventory })).digest('hex');
 const identity = { ...packageIdentityBase, buildId };
 const artifact = { schemaVersion: 2, packageName: packageMetadata.name, packageVersion: buildVersion, compatibilityLine: packageConfig.compatibilityLine, skillVersion: packageConfig.skillVersion, sourceCommit: manifest.commit, sourceSha, mergeSha: packageIdentityBase.mergeSha, candidateSha: sourceSha, dirty, runtime: 'bun@1.4.4', identity, buildId, tarballDigest, gitTag, dependenciesBundled, dependencies: preparedDependencies, omittedResources: packageOmissions, files: finalInventory };

package/toolkit/skills/multi-task-flow/tests/atomic-orchestration-schema.test.ts

@@ -0,0 +1,60 @@
+import { expect, test } from "bun:test";
+import { atomicNode, contract3MigrationCandidate, deriveBusinessStatus, evaluateMilestone, taskPrBinding, validateAtomicGraph, validateContributionStart } from "../lib/atomic-orchestration";
+
+const ref = { provider: "github", repository: "org/repo", id: "pr-1", url: "https://github.com/org/repo/pull/1" };
+
+test("accepts task-scoped contribution work with starting lifecycle", () => {
+  const node = atomicNode.parse({
+    kind: "work", id: "work-1", title: "Implement", purpose: "Code", output: "Patch", acceptance: [],
+    activity_type: "contribution", state: "starting",
+    scope: { kind: "task", task_id: "task-1", delivery_unit_id: "du-1" },
+    runtime: { started_at: "2026-01-01T00:00:00Z", updated_at: "2026-01-01T00:00:00Z", evidence_refs: [] },
+  });
+  expect(node.kind).toBe("work");
+});
+
+test("rejects delivery-unit scope for contribution work", () => {
+  expect(() => atomicNode.parse({
+    kind: "work", id: "work-1", title: "Implement", purpose: "Code", output: "Patch", acceptance: [],
+    activity_type: "contribution", state: "planned", scope: { kind: "delivery_unit", delivery_unit_id: "du-1" },
+  })).toThrow();
+});
+
+test("represents closed PRs without treating them as success", () => {
+  const parsed = taskPrBinding.parse({ state: "closed", pr: ref, branch: "feature", closed_at: "2026-01-01T00:00:00Z", closed_reason: "provider_closed" });
+  expect(parsed.state).toBe("closed");
+});
+
+test("rejects cyclic atomic graphs and empty planned milestones", () => {
+  const nodes = [
+    { kind: "milestone", id: "m-1", title: "M1", state: "planned", scope: { kind: "delivery_unit", delivery_unit_id: "du-1" }, acceptance: [{ kind: "node_satisfied", node_id: "w-1" }] },
+    { kind: "work", id: "w-1", title: "W1", purpose: "Work", output: "Done", acceptance: [], activity_type: "verification", state: "planned", scope: { kind: "delivery_unit", delivery_unit_id: "du-1" } },
+  ] as const;
+  const edges = [
+    { id: "e-1", from_node_id: "m-1", to_node_id: "w-1", requires: { kind: "source_terminal_success" } },
+    { id: "e-2", from_node_id: "w-1", to_node_id: "m-1", requires: { kind: "source_terminal_success" } },
+  ] as const;
+  expect(() => validateAtomicGraph(nodes as any, edges as any)).toThrow("acyclic");
+  expect(() => validateAtomicGraph([{ kind: "milestone", id: "empty", title: "Empty", state: "planned", scope: { kind: "delivery_unit", delivery_unit_id: "du-1" }, acceptance: [] }] as any, [])).toThrow("conditions");
+});
+
+test("evaluates milestone conditions with full AND semantics", () => {
+  const node = { kind: "milestone", id: "m-1", title: "M", state: "planned", scope: { kind: "delivery_unit", delivery_unit_id: "du-1" }, acceptance: [{ kind: "node_satisfied", node_id: "w-1" }] } as any;
+  expect(evaluateMilestone(node, [{ satisfied: true }], [{ satisfied: false }]).status).toBe("pending");
+  expect(evaluateMilestone(node, [{ satisfied: true }], [{ satisfied: true }]).status).toBe("satisfied");
+  expect(evaluateMilestone(node, [{ satisfied: false, blocked: true }], [{ satisfied: true }]).status).toBe("blocked");
+});
+
+test("derives business status and enforces contribution starting prerequisites", () => {
+  const node = atomicNode.parse({ kind: "work", id: "work-1", title: "Implement", purpose: "Implement", output: "code", acceptance: [], activity_type: "contribution", state: "starting", scope: { kind: "task", task_id: "task-1", delivery_unit_id: "du-1" }, runtime: { started_at: "2026-01-01T00:00:00Z", updated_at: "2026-01-01T00:00:00Z", evidence_refs: [] } });
+  expect(() => validateContributionStart(node, { pr: { state: "unpublished" } } as any)).toThrow();
+  expect(() => validateContributionStart(node, { pr: { state: "published", pr: ref, parent_branch: "main" }, parent_branch: "main" } as any)).not.toThrow();
+  expect(deriveBusinessStatus([node], { kind: "task", task_id: "task-1" })).toBe("running");
+});
+
+test("migrates unambiguous task atoms and rejects group atoms", () => {
+  const result = contract3MigrationCandidate({ contract_version: 2, tasks: [{ id: "task-1", group_id: "du-1", atoms: [{ id: "atom-1", title: "Code" }] }], groups: [{ id: "du-1", atoms: [] }], plans: [{ atomic_edges: [] }] });
+  expect(result.contract_version).toBe(3);
+  expect(result.atomic_nodes[0].scope).toEqual({ kind: "task", task_id: "task-1", delivery_unit_id: "du-1" });
+  expect(() => contract3MigrationCandidate({ contract_version: 2, tasks: [], groups: [{ id: "du-1", atoms: [{ id: "legacy" }] }], plans: [] })).toThrow("ambiguous");
+});

package/toolkit/skills/multi-task-flow/tests/graph-projection.test.ts

@@ -1,4 +1,5 @@
 import { describe, expect, test } from "bun:test";
+import { projectAtomicGraph } from "../web/graph-projection";
 import { createDemoLedger } from "../examples/orchestration-viewer/ledger";
 import { buildView } from "../lib/view";
 import { emptyBootstrapView } from "./service-fixture";
@@ -10,6 +11,14 @@ function demoView(): View {
 }
 
 describe("dashboard graph projection", () => {
+  test("projects canonical atomic scope, evidence and edge conditions", () => {
+    const projection = projectAtomicGraph([
+      { kind: "work", id: "w-1", title: "Code", purpose: "Code", output: "Patch", acceptance: [], activity_type: "contribution", state: "completed", scope: { kind: "task", task_id: "t-1", delivery_unit_id: "du-1" }, runtime: { started_at: "2026-01-01T00:00:00Z", updated_at: "2026-01-01T00:00:00Z", evidence_refs: ["receipt:1"] }, result: { completed_at: "2026-01-01T00:00:00Z", evidence_refs: ["receipt:1"] } },
+      { kind: "milestone", id: "m-1", title: "Merged", state: "planned", scope: { kind: "delivery_unit", delivery_unit_id: "du-1" }, acceptance: [{ kind: "node_satisfied", node_id: "w-1" }] },
+    ] as any, [{ id: "e-1", from_node_id: "w-1", to_node_id: "m-1", requires: { kind: "source_terminal_success" } }] as any);
+    expect(projection.nodes[0]).toMatchObject({ scope: "task:t-1 / delivery-unit:du-1", evidence: ["receipt:1"] });
+    expect(projection.edges[0]).toMatchObject({ source: "w-1", target: "m-1", requires: "source_terminal_success" });
+  });
   test("keeps every task and milestone once while hiding boundary node text", () => {
     const view = demoView();
     const projection = buildGraphProjection(view);

package/toolkit/skills/multi-task-flow/tests/task-kind.test.ts

@@ -0,0 +1,14 @@
+import { expect, test } from "bun:test";
+import { isCanonicalTaskKind, validateNewTaskKinds } from "../lib/schema";
+
+test("only canonical task kinds are eligible for new runtime tasks", () => {
+  expect(["contribution", "release", "deployment", "verification"].every((kind) => isCanonicalTaskKind(kind as any))).toBe(true);
+  expect(isCanonicalTaskKind("coordination" as any)).toBe(false);
+  expect(isCanonicalTaskKind("development" as any)).toBe(false);
+  expect(isCanonicalTaskKind("other" as any)).toBe(false);
+});
+
+test("retired coordination task kinds are rejected for new tasks", () => {
+  expect(() => validateNewTaskKinds([{ id: "coord", kind: "coordination" } as any])).toThrow("retired task kind");
+  expect(() => validateNewTaskKinds([{ id: "verify", kind: "verification" } as any])).not.toThrow();
+});

package/toolkit/skills/multi-task-flow/tests/ui/detail-surface.test.ts

@@ -60,7 +60,7 @@ describe("dashboard detail surface DOM", () => {
     expect(elements.workspace.classList.contains("has-overlay-selection")).toBe(true);
   });
 
-  test("uses a fixed inspector on the intermediate viewport only after selection", () => {
+  test("keeps the selected desktop inspector surface without an overlay", () => {
     expect(resolveDetailSurface({ selected: false, detailOpen: false, hoverCapable: true, detailPanelViewport: true })).toBe("none");
 
     const surface = resolveDetailSurface({ selected: true, detailOpen: true, hoverCapable: true, detailPanelViewport: true });

package/toolkit/skills/multi-task-flow/tests/ui/responsive-width-contract.test.ts

@@ -10,6 +10,18 @@ test("medium layout shares container-derived card tracks across detail states",
   expect(medium).not.toContain("minmax(243px, 1fr)");
 });
 
+test("medium details stay in the static bottom layout instead of a side-by-side column", () => {
+  const medium = css.split("@media (min-width: 768px) and (max-width: 1444px) {")[1]!.split("@media (max-width: 767px)")[0]!;
+  expect(medium).toContain(".workspace.has-details, .workspace.has-overlay-selection { grid-template-columns: minmax(0, 1fr); }");
+  expect(medium).toContain(".details { position: static; width: auto;");
+  expect(medium).toContain("border: 0; border-top: 1px solid var(--border); border-radius: 0; background: transparent;");
+  expect(medium).toContain(".details-heading button { display: none; }");
+  expect(medium).toContain(".details-slot { position: static; padding-top: 16px; }");
+  expect(medium).toContain(".details-heading { padding: 0 0 12px; display: flex; align-items: baseline;");
+  expect(medium).toContain("#details-content { padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));");
+  expect(medium).toContain('.workspace[data-view-tab="tasks"] .details-slot { grid-column: 1; grid-row: 3; }');
+});
+
 test("identity actions follow the project name instead of filling the title row", () => {
   expect(css).toContain(".identity-copy { flex: 0 1 auto; min-width: 0; }");
   expect(css).toContain("text-overflow: ellipsis; white-space: nowrap;");

package/toolkit/skills/multi-task-flow/tests/view-state.test.ts

@@ -28,6 +28,13 @@ describe("shareable dashboard view state", () => {
     expect(valid.detail).toBe(true);
   });
 
+  test("accepts the independent tasks tab and preserves it in shareable URLs", () => {
+    const state = parseViewState("?tab=tasks");
+    expect(state.tab).toBe("tasks");
+    expect(hasValidTabParam("?tab=tasks")).toBe(true);
+    expect(serializeViewState(state)).toBe("tab=tasks");
+  });
+
   test("restores dotted public IDs from authenticated target URLs", () => {
     const validation = { plans: new Set(["plan.v2"]), tasks: new Set(["task.v2"]) };
     const state = parseViewState("?selected=task%3Atask.v2&detail=1&plan=plan.v2", validation);

package/toolkit/skills/multi-task-flow/web/app.css

@@ -428,19 +428,24 @@ time[data-local-timestamp] { cursor: help; font-variant-numeric: tabular-nums; }
     grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto;
     align-items: start; gap: 20px;
   }
-  .workspace.has-details, .workspace.has-overlay-selection {
-    --task-columns-with-details: max(1, round(down, calc((100cqw - var(--detail-min-width)) / (var(--stable-task-card-width) + 20px)), 1));
-    grid-template-columns: calc(var(--task-columns-with-details) * (var(--stable-task-card-width) + 20px) - 20px) minmax(var(--detail-min-width), var(--detail-max-width));
-  }
+  .workspace.has-details, .workspace.has-overlay-selection { grid-template-columns: minmax(0, 1fr); }
   .workspace-main { display: contents; }
   .workspace-view { grid-column: 1 / -1; grid-row: 1; min-width: 0; }
   .workspace-tasks { grid-column: 1; grid-row: 2; min-width: 0; }
+  .workspace:not([data-view-tab="tasks"]) .details-slot { grid-column: 1; grid-row: 2; }
+  .workspace[data-view-tab="tasks"] .details-slot { grid-column: 1; grid-row: 3; }
+  .details-slot { position: static; padding-top: 16px; }
+  .details { position: static; width: auto; max-height: none; border: 0; border-top: 1px solid var(--border); border-radius: 0; background: transparent; box-shadow: none; padding: 16px 0 4px; display: block; }
+  .details-heading button { display: none; }
+  .details-heading { padding: 0 0 12px; display: flex; align-items: baseline; gap: 12px; border-bottom: 1px solid var(--rule); }
+  .detail-title { margin-top: 0; }
+  #details-content { padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 20px; }
+  #details-content > .detail-field:has(.detail-agent-output), #details-content > .detail-field:has(.detail-empty-output), #details-content > .detail-field:has(.atom-list) { grid-column: 1 / -1; }
+  .details-backdrop { display: none; }
   .workspace .task-layout-grid, .workspace .group-cards {
     grid-template-columns: repeat(auto-fill, var(--stable-task-card-width)); gap: 20px;
   }
-  .details-slot { grid-column: 2; grid-row: 2; }
   .details { --details-padding-inline: 16px; --details-padding-bottom: 20px; }
-  .details-backdrop { display: none; }
   .mobile-close { display: grid; }
   .task-layout-board { display: grid; grid-auto-flow: column; grid-auto-columns: var(--stable-task-card-width); grid-template-columns: none; gap: 20px; padding-inline: 0; justify-content: start; align-items: stretch; overflow-x: auto; overflow-y: hidden; }
   .task-layout-board > .task-column { flex-basis: auto; min-width: 0; }
@@ -685,6 +690,16 @@ time[data-local-timestamp] { cursor: help; font-variant-numeric: tabular-nums; }
 .dependency-layout-tools > span { margin-right:auto; color:var(--muted); }
 .dependency-layout-tools select, .dependency-layout-tools button { background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius:6px; padding:6px 10px; }
 #graph .react-flow { height:calc(100% - 59px); background:var(--surface); }
+#atomic-graph { height: min(900px, max(640px, calc(100vh - 300px))); position: relative; background:var(--surface); }
+#atomic-graph .react-flow { height:calc(100% - 59px); background:var(--surface); }
+#atomic-graph .react-flow__node-card { pointer-events:none !important; }
+#atomic-graph .react-flow__node-card > .atomic-dependency-card { pointer-events:auto; }
+#atomic-graph .react-flow__node.selected .atomic-dependency-card { outline:2px solid var(--accent); outline-offset:3px; }
+#atomic-graph .react-flow__handle { opacity:0; width:1px; height:1px; border:0; pointer-events:none; }
+#atomic-graph .react-flow__attribution { background:var(--surface); color:var(--muted); font-size:9px; }
+.atomic-dependency-scope { margin-top:6px; color:var(--muted); font-size:11px; line-height:15px; overflow-wrap:anywhere; }
+.atomic-dependency-facts { margin-top:5px; color:var(--muted); font-size:10px; line-height:14px; overflow-wrap:anywhere; }
+.atomic-dependency-edge-label { position:absolute; pointer-events:none; color:var(--muted); background:var(--surface); padding:1px 4px; border-radius:3px; font-size:10px; white-space:nowrap; }
 .dependency-card { height:100%; width:100%; border:1px solid var(--node-color); border-radius:8px; background:var(--surface); color:var(--text); padding:8px 12px; box-shadow:0 2px 6px #00000012; }
 .dependency-card-meta { display:flex; justify-content:space-between; gap:8px; font-size:11px; line-height:18px; color:var(--muted); margin-bottom:4px; }
 .dependency-card-title { font-size:15px; line-height:21px; font-weight:600; overflow-wrap:anywhere; }
@@ -700,6 +715,20 @@ time[data-local-timestamp] { cursor: help; font-variant-numeric: tabular-nums; }
 #graph .react-flow__handle { opacity:0; width:1px; height:1px; border:0; pointer-events:none; }
 #graph .react-flow__attribution { background:var(--surface); color:var(--muted); font-size:9px; }
 .dependency-layout-pending { position:absolute; bottom:12px; left:12px; color:var(--muted); font-size:12px; }
+.atomic-graph-surface { min-height:420px; overflow:auto; background:var(--surface); }
+.atomic-graph-header { padding:12px 16px; border-bottom:1px solid var(--border); color:var(--text); font-size:13px; font-weight:600; }
+.atomic-graph-canvas { position:relative; min-width:920px; min-height:420px; padding:28px 24px; overflow:auto; }
+.atomic-graph-links { position:absolute; inset:0; z-index:0; overflow:visible; color:var(--muted); pointer-events:none; }
+.atomic-graph-nodes { position:relative; z-index:1; display:grid; column-gap:72px; row-gap:22px; align-items:stretch; }
+.atomic-graph-card { min-height:84px; padding:10px 12px; border:1px solid var(--accent); border-radius:8px; background:var(--surface); color:var(--text); box-shadow:0 2px 6px #00000012; }
+.atomic-graph-card-meta { display:flex; justify-content:space-between; gap:8px; margin-bottom:6px; color:var(--muted); font-size:11px; }
+.atomic-graph-card strong { display:block; font-size:13px; line-height:18px; }
+.atomic-graph-card small { display:block; margin-top:7px; color:var(--muted); font-size:11px; line-height:15px; }
+.atomic-edge { fill:none; stroke:var(--muted); stroke-width:1.5; opacity:.9; }
+.atomic-edge-integrated { stroke:var(--success, #3aa675); }
+.atomic-edge-merged { stroke:var(--accent, #5b9cff); }
+.atomic-edge-label { fill:var(--muted); font-size:10px; paint-order:stroke; stroke:var(--surface); stroke-width:4px; stroke-linejoin:round; }
+@media (max-width: 760px) { .atomic-graph-canvas { min-width:760px; } }
 
 .dependency-state-idle { display:inline-flex; align-items:center; gap:4px; color:var(--warning); }
 

package/toolkit/skills/multi-task-flow/web/app.ts

@@ -11,6 +11,7 @@ import { createIcons, Contrast, Network, Search, X, Plus, Minus, Maximize2, Chev
 import { createCardRenderer } from "./cards";
 import { createTimelineController } from "./timeline";
 import { createGraphController } from "./graph";
+import { createAtomicGraphController } from "./atomic-graph-view";
 import { createHoverController } from "./hover-controller";
 import { createDetailContent } from "./details-content";
 import { deriveConnectionStatus, type Task, type View, type ViewResponse, type Theme } from "./model";
@@ -363,6 +364,24 @@ const graphController = createGraphController({
   selectMilestone,
   getSelected: () => ({ task: selectedTask, group: selectedGroup, milestone: selectedMilestone }),
 });
+const atomicGraphController = createAtomicGraphController({
+  element: $,
+  getData: () => data,
+  getViewState: () => viewState,
+  setZoom: (zoom) => { viewState = { ...viewState, zoom }; syncUrl(); },
+  css,
+  stateColor,
+  groupColor,
+  taskPreview,
+  groupPreview,
+  showHoverPreview,
+  hideHoverPreview,
+  recordPointerType,
+  selectTask,
+  selectGroup,
+  selectMilestone,
+  getSelected: () => ({ task: selectedTask, group: selectedGroup, milestone: selectedMilestone }),
+});
 function openDetails(): void { updateDetailsSurface(true, true); }
 function restoreClosedDetails(): void {
   const selection = selectedTask ? { kind: "task" as const, id: selectedTask } : selectedGroup ? { kind: "group" as const, id: selectedGroup } : null;
@@ -559,15 +578,37 @@ function render(): void {
     authorizationLabel,
     ...(warningReasons.length ? warningReasons : ["计划完整性检查通过。"]),
   ].join(" · ");
-  updateMenu("group-filter", data.groups.map((group) => ({ value: group.id, label: group.title })), "全部交付单元"); updateMenu("state-filter", [...defaultStates].filter((key) => !["active", "merged", "unknown", "idle"].includes(key)).map((value) => ({ value, label: value === "ready" ? "就绪" : labels[value] ?? value })), "全部状态"); updateMenu("kind-filter", ["contribution", "release", "deployment", "verification", "coordination"].map((value) => ({ value, label: taskKindLabel(value) })), "全部任务类型"); updateVersionMenu();
-  setMenuValue("group-filter", viewState.group); setMenuValue("state-filter", viewState.state); setMenuValue("kind-filter", viewState.kind); $("graph-tools").hidden = viewState.tab !== "graph"; $("timeline-tools").hidden = viewState.tab === "graph"; applyStateToControls(); renderSummary(); const tasks = filteredTasks(); $("task-count").textContent = `${tasks.length} / ${data.tasks.length} 个任务`; $("view-context").textContent = viewState.tab === "graph" ? "依赖关系" : viewState.tab === "planned" ? "理论安排" : "实际运行"; $("view-count").textContent = `${tasks.length} 项任务 · ${data.groups.length} 个交付单元`; renderGroups(); renderList(tasks); syncStableGridCardWidth(); setTabAria(viewState.tab); if (viewState.tab === "graph") graphController.render(tasks, viewState.group ? new Set([viewState.group]) : undefined); else timelineController.renderTimeline(tasks, viewState.tab); const focusDetails = focusDetailsOnNextRender; focusDetailsOnNextRender = false; updateDetailsSurface(viewState.detail, focusDetails); const selectedTaskData = selectedTask ? data.tasks.find((item) => item.id === selectedTask) : null; const selectedGroupData = selectedGroup ? data.groups.find((item) => item.id === selectedGroup) : null; const selectedMilestoneData = selectedMilestone ? data.nodes.find((item) => item.kind === "milestone" && item.id === selectedMilestone) : null; const selectedMilestoneGroup = selectedMilestoneData?.group_id ? data.groups.find((item) => item.id === selectedMilestoneData.group_id) : null; if (selectedTaskData) showTask(selectedTaskData); else if (selectedGroupData) showGroup(selectedGroupData, viewState.atom); else if (selectedMilestoneData && selectedMilestoneGroup) showMilestone(selectedMilestoneData.id, selectedMilestoneGroup); else clearDetails(); createIcons({ icons: ICONS }); showCurrentSelectionPreview(); restoreListFocus(listFocus);
+  updateMenu("group-filter", data.groups.map((group) => ({ value: group.id, label: group.title })), "全部交付单元"); updateMenu("state-filter", [...defaultStates].filter((key) => !["active", "merged", "unknown", "idle"].includes(key)).map((value) => ({ value, label: value === "ready" ? "就绪" : labels[value] ?? value })), "全部状态"); updateMenu("kind-filter", ["contribution", "release", "deployment", "verification"].map((value) => ({ value, label: taskKindLabel(value) })), "全部任务类型"); updateVersionMenu();
+  setMenuValue("group-filter", viewState.group); setMenuValue("state-filter", viewState.state); setMenuValue("kind-filter", viewState.kind); $("graph-tools").hidden = !["graph", "atomic"].includes(viewState.tab); $("timeline-tools").hidden = !["planned", "actual"].includes(viewState.tab); applyStateToControls(); renderSummary(); const tasks = filteredTasks(); $("task-count").textContent = `${tasks.length} / ${data.tasks.length} 个任务`; $("view-context").textContent = ["graph", "atomic"].includes(viewState.tab) ? "依赖关系" : viewState.tab === "planned" ? "理论安排" : viewState.tab === "actual" ? "实际运行" : "任务"; $("view-count").textContent = `${tasks.length} 项任务 · ${data.groups.length} 个交付单元`; renderGroups(); renderList(tasks); syncStableGridCardWidth(); setTabAria(viewState.tab); const aggregateGraph = $("graph"); const atomicGraph = $("atomic-graph"); if (["graph", "atomic"].includes(viewState.tab)) { aggregateGraph.hidden = viewState.tab !== "graph"; atomicGraph.hidden = viewState.tab !== "atomic"; if (viewState.tab === "atomic") renderAtomicGraph(); else graphController.render(tasks, viewState.group ? new Set([viewState.group]) : undefined); } else { aggregateGraph.hidden = true; atomicGraph.hidden = true; if (["planned", "actual"].includes(viewState.tab)) timelineController.renderTimeline(tasks, viewState.tab); } const focusDetails = focusDetailsOnNextRender; focusDetailsOnNextRender = false; updateDetailsSurface(viewState.detail, focusDetails); const selectedTaskData = selectedTask ? data.tasks.find((item) => item.id === selectedTask) : null; const selectedGroupData = selectedGroup ? data.groups.find((item) => item.id === selectedGroup) : null; const selectedMilestoneData = selectedMilestone ? data.nodes.find((item) => item.kind === "milestone" && item.id === selectedMilestone) : null; const selectedMilestoneGroup = selectedMilestoneData?.group_id ? data.groups.find((item) => item.id === selectedMilestoneData.group_id) : null; if (selectedTaskData) showTask(selectedTaskData); else if (selectedGroupData) showGroup(selectedGroupData, viewState.atom); else if (selectedMilestoneData && selectedMilestoneGroup) showMilestone(selectedMilestoneData.id, selectedMilestoneGroup); else clearDetails(); createIcons({ icons: ICONS }); showCurrentSelectionPreview(); restoreListFocus(listFocus);
   restoreMenuFocus(menuFocus);
   restoreDetailFocus(detailFocus);
   if (restoreClosedDetailsOnNextRender) { restoreClosedDetailsOnNextRender = false; restoreClosedDetails(); }
   if (phaseTransition) { $("phase-notice").hidden = false; $("phase-notice-text").textContent = "已有真实任务开始执行，阶段已切换；当前视图和筛选保持不变。"; } else $("phase-notice").hidden = true;
 }
-function setTabAria(tab: DashboardTab): void { for (const button of document.querySelectorAll<HTMLButtonElement>("[data-tab]")) button.setAttribute("aria-selected", String(button.dataset.tab === tab)); for (const name of ["graph", "planned", "actual"]) $(`${name}-view`).hidden = name !== tab; }
-function setTab(tab: DashboardTab, user = true): void { viewState = { ...viewState, tab }; if (user) userChangedTab = true; syncUrl(); render(); }
+function setTabAria(tab: DashboardTab): void { for (const button of document.querySelectorAll<HTMLButtonElement>("[data-tab]")) button.setAttribute("aria-selected", String(button.dataset.tab === tab)); for (const name of ["graph", "planned", "actual", "tasks"]) $(`${name}-view`).hidden = name !== tab; $("workspace").dataset.viewTab = tab; }
+
+function renderAtomicGraph(): void {
+  if (!data) return;
+  const allNodes = (data.atomic_nodes ?? []) as unknown as import("../lib/atomic-orchestration").AtomicNode[];
+  const taskById = new Map(data.tasks.map((task) => [task.id, task]));
+  const nodes = allNodes.filter((node) => {
+    const scope = node.kind === "work" || node.kind === "milestone" ? node.scope : undefined;
+    const taskId = scope?.kind === "task" ? scope.task_id : null;
+    const deliveryUnitId = scope?.kind === "task" ? scope.delivery_unit_id : scope?.kind === "delivery_unit" ? scope.delivery_unit_id : null;
+    if (viewState.group && deliveryUnitId !== viewState.group) return false;
+    if (node.kind === "work" && taskId) {
+      const task = taskById.get(taskId);
+      if (!task) return false;
+      if (viewState.kind && task.kind !== viewState.kind) return false;
+      if (viewState.state && task.state !== viewState.state && node.state !== viewState.state) return false;
+    }
+    return true;
+  });
+  const visible = new Set(nodes.map((node) => node.id));
+  const edges = ((data.canonical_atomic_edges ?? []) as unknown as import("../lib/atomic-orchestration").AtomicEdge[]).filter((edge) => visible.has(edge.from_node_id) && visible.has(edge.to_node_id));
+  atomicGraphController.render(nodes, edges);
+}
+function setTab(tab: DashboardTab, user = true): void { viewState = { ...viewState, tab, ...(tab === "atomic" ? { graphMode: "atomic" as const } : tab === "graph" ? { graphMode: "aggregate" as const } : {}) }; if (user) userChangedTab = true; syncUrl(); render(); }
 async function refresh(): Promise<void> {
   const serial = ++requestSerial;
   const outputEpoch = outputSnapshots.epoch;
@@ -597,7 +638,7 @@ async function refresh(): Promise<void> {
     taskNotice.textContent = missingTask ? `任务 ${requestedTask} 不存在或已不可用。` : "";
     if (!hydrated && requestedTask && !missingTask && viewState.detail) viewState = { ...viewState, query: "", group: "", kind: "", state: "" };
     viewState = sanitizeViewState(viewState, stateValidation()); selectedTask = viewState.selected?.kind === "task" ? viewState.selected.id : null; selectedGroup = viewState.selected?.kind === "group" ? viewState.selected.id : null; selectedMilestone = viewState.selected?.kind === "milestone" ? viewState.selected.id : null; activePlan = viewState.plan ?? data.selected_plan_id;
-    if (previousPhase === "planning" && currentPhase === "execution") phaseTransition = true; phase = currentPhase; const shouldFocusRestoredDetails = !hydrated && viewState.detail; hydrated = true; if (shouldFocusRestoredDetails) focusDetailsOnNextRender = true; syncUrl(); connection(deriveConnectionStatus(connected, result.watching)); $("load-error").hidden = true; render();
+    if (previousPhase === "planning" && currentPhase === "execution") phaseTransition = true; phase = currentPhase; const shouldFocusRestoredDetails = !hydrated && viewState.detail; hydrated = true; if (shouldFocusRestoredDetails) focusDetailsOnNextRender = true; syncUrl(); connection(result.watching ? "live" : "stale"); $("load-error").hidden = true; render();
     if (shouldFocusRestoredDetails && selectedTask) {
       const card = document.querySelector<HTMLElement>(`[data-task-id="${CSS.escape(selectedTask)}"]`);
       card?.scrollIntoView({ block: "center", inline: "center" });
@@ -622,7 +663,7 @@ document.addEventListener("pointerdown", (event) => { keyboardSelection = false;
 document.addEventListener("keydown", (event) => { if ((event.key === "Enter" || event.key === " ") && (event.target as HTMLElement).closest(".task-card-select, .task-column-select, .task-row")) keyboardSelection = true; }, true);
 document.addEventListener("keydown", (event) => { const target = event.target as HTMLElement; const trigger = target.closest<HTMLButtonElement>(".menu-trigger, .theme-trigger"); const option = target.closest<HTMLButtonElement>("[role=option]"); if (event.key === "Escape" && trigger) { event.preventDefault(); event.stopPropagation(); closeMenus(); trigger.focus(); } else if (trigger && (event.key === "ArrowDown" || event.key === "ArrowUp" || event.key === "Enter" || event.key === " ")) { event.preventDefault(); const id = trigger.id.replace(/-trigger$/, "") as MenuId; openMenu(id); } else if (option && (event.key === "ArrowDown" || event.key === "ArrowUp")) { event.preventDefault(); const options = [...option.closest<HTMLElement>("[role=listbox]")!.querySelectorAll<HTMLButtonElement>("[role=option]")]; const index = options.indexOf(option); options[(index + (event.key === "ArrowDown" ? 1 : -1) + options.length) % options.length]?.focus(); } else if (option && (event.key === "Enter" || event.key === " ")) { event.preventDefault(); const menu = option.closest<HTMLElement>("[role=listbox]"); const id = menu?.id.replace(/-menu$/, "") as MenuId; chooseMenu(id, option.dataset.menuValue ?? ""); } else if (option && event.key === "Escape") { event.preventDefault(); event.stopPropagation(); closeMenus(); menuTrigger(option.closest<HTMLElement>("[role=listbox]")?.id.replace(/-menu$/, "") as MenuId).focus(); } });
 $("close-details").addEventListener("click", closeDetails); $("details-backdrop").addEventListener("click", closeDetails); $("phase-jump").addEventListener("click", () => { phaseTransition = false; setTab("actual"); });
-$("zoom-in").addEventListener("click", () => graphController.zoomIn()); $("zoom-out").addEventListener("click", () => graphController.zoomOut()); $("fit").addEventListener("click", () => graphController.fit());
+$("zoom-in").addEventListener("click", () => (viewState.tab === "atomic" ? atomicGraphController.zoomIn() : graphController.zoomIn())); $("zoom-out").addEventListener("click", () => (viewState.tab === "atomic" ? atomicGraphController.zoomOut() : graphController.zoomOut())); $("fit").addEventListener("click", () => (viewState.tab === "atomic" ? atomicGraphController.fit() : graphController.fit()));
 $("timeline-zoom-in").addEventListener("click", () => timelineController.adjustWindow("in")); $("timeline-zoom-out").addEventListener("click", () => timelineController.adjustWindow("out")); $("timeline-fit").addEventListener("click", () => timelineController.fit());
 installViewStateNavigation(window, { getSearch: () => window.location.search, getValidation: (search) => { const targetPlan = search ? new URLSearchParams(search).get("plan") : null; if ((targetPlan ?? activePlanId) !== (viewState.plan ?? activePlanId)) return { plans: new Set(data?.plans.map((plan) => plan.id) ?? []) }; return data ? stateValidation() : {}; }, getPhase: () => data ? phase ?? derivePhase(data.tasks) : null, restore: (next, hasExplicitTab) => { const planChanged = next.plan !== viewState.plan; const closingDetails = viewState.detail && !next.detail; userChangedTab = hasExplicitTab; if (closingDetails) { keyboardSelection = false; hideHoverPreview(); restoreClosedDetailsOnNextRender = true; } viewState = next; selectedTask = next.selected?.kind === "task" ? next.selected.id : null; selectedGroup = next.selected?.kind === "group" ? next.selected.id : null; selectedMilestone = next.selected?.kind === "milestone" ? next.selected.id : null; activePlan = next.plan ?? ""; if (next.detail) focusDetailsOnNextRender = true; if (planChanged) void refresh(); else if (data) render(); } });
 window.addEventListener("keydown", (event) => { trapDetailsFocus(event); trapPlanInfoFocus(event); if (event.key === "Escape" && planInfoIsOpen()) { event.preventDefault(); closePlanInfo(); } else if (event.key === "Escape" && viewState.detail) closeDetails(); });
@@ -630,7 +671,7 @@ window.addEventListener("resize", () => { refreshResponsiveDetails(); syncPlanIn
 anyHoverCapability.addEventListener("change", refreshResponsiveDetails); anyFinePointerCapability.addEventListener("change", refreshResponsiveDetails);
 const stream = new EventSource("api/events"); stream.addEventListener("open", () => { connected = true; connection("live"); void refresh(); }); stream.addEventListener("revision", () => void refresh()); stream.addEventListener("stale", () => { connected = false; connection("stale"); }); stream.addEventListener("heartbeat", (event) => { try { if (JSON.parse((event as MessageEvent).data).watching && !connected) { connected = true; void refresh(); } } catch { connection("stale"); } }); stream.addEventListener("error", () => { connected = false; connection("stale"); });
 hoverBridge = createHoverPreviewBridge($("hover-preview"), dismissHoverPreview);
-window.setInterval(refreshCardDurations, 60_000);
+window.setInterval(refreshCardDurations, 60_000); window.setInterval(() => { if (!connected) void refresh(); }, 5_000);
 connection("connecting"); void loadTheme(); void refresh();
 
 stream.addEventListener("agent-output", event => {