project-mgr 0.4.0 → 0.5.0

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # Changelog
 
+## 0.5.0 - 2026-10-29
+
+### Added
+
+- Store new snapshot next work as `nextTodoUids` references. `add --next` creates Todos and those refs in one transaction; `add --next-todo` pins existing UIDs.
+- Reject mixed prose and refs, duplicate UIDs, combining `--next` with `--next-todo`, cross-project refs, and project changes that conflict with any historical reference.
+- Export version 4 carries refs and every Todo they need, including unassigned Todos referenced by a project export.
+- `todos --status open` lists open work. With `--project`, current snapshot pins are ordered first.
+- Dashboard activity history and project cards show referenced Todos with live status.
+
+### Changed
+
+- New snapshots no longer persist next-step prose. Legacy string `nextSteps` stay readable. Per-index conversion does not rewrite history; completion copies the full string list until every source index has a Todo, then materializes refs without creating Todos or changing their status.
+
+### Fixed
+
+- Detach the dashboard browser launch so a long-lived browser does not keep the process alive.
+- Reject dangling and cross-project `nextTodoUids` from `importStatuses`, and require imported refs to name Todos in the same payload. Entry-only imports declare no Todos, so they cannot reference existing rows.
+- Treat a fixed-UID retry of `--next` text as the same write after it has been stored as refs. Portable imports still require an exact snapshot match.
+
 ## 0.4.0 - 2026-10-28
 
 ### Added

package/README.md

@@ -225,7 +225,7 @@ pnpm start projects --query "mvp" --json
 
 ## Bulk import
 
-`import` accepts a JSON object, a JSON array, or a JSONL file containing one object per line. Every record is validated before the whole batch is written in one SQLite transaction; any failure rolls back the entire batch.
+`import` accepts a JSON object, a JSON array, or a JSONL file containing one object per line. Every record is validated before the whole batch is written in one SQLite transaction; any failure rolls back the entire batch. The example below is a legacy entry: string `nextSteps` are kept and do not create Todos. New snapshots created with `add` store `nextTodoUids` instead.
 
 ```json
 {
@@ -336,22 +336,49 @@ Independently migrated copies of legacy data receive different UUIDs. Cross-impo
 
 ### Todos and dashboard actions
 
-New `add --next` values create independent Todos linked to the new activity.
-Historical next steps stay as text until explicitly converted in the dashboard.
-The Todos tab supports standalone creation, optional project assignment, source
-links, completion, cancellation, and reopening. Project cards filter this list.
-Activity cards provide **Mark completed**, recording a follow-up with the current
-project status; this neither completes the project nor its Todos.
+Todos own actionable work. A new status snapshot stores ordered `nextTodoUids`
+and does not persist next-step prose. `add --next` creates one Todo per title
+and stores those UIDs in the same transaction. Repeating the same text on a
+later snapshot creates new Todos; pass `--next-todo` to keep existing work.
+Do not combine `--next` with `--next-todo`. Duplicate UIDs in one list are rejected.
 
 ```sh
-pmgr todo-add --title "Review results" --project demo --json
+pmgr add --project demo --status active --summary "Review queued" \
+  --next "Collect logs" --next "Write the note" --source agent --json
 pmgr todo-add --title "Unassigned idea" --json
-pmgr todos --project demo --json
+pmgr add --project demo --status active --summary "Pin the idea" \
+  --next-todo <todo-uuid> --source agent --json
+pmgr todos --project demo --status open --json
 pmgr todo-update --uid <todo-uuid> --status completed --json
+pmgr todo-update --uid <todo-uuid> --status cancelled --json
 ```
 
-Exports with Todos use version 3 and preserve their identities and state;
-version-2 and legacy imports remain supported without creating new Todos from
-old next-step text. Conflicting Todo snapshots are rejected atomically on import.
-Dashboard writes are restricted to same-origin localhost requests with JSON bodies;
-remote-host dashboards remain read-only.
+`todos --status open` answers open work from Todos, not from string next steps.
+With `--project`, UIDs pinned on the current snapshot are ordered first.
+Completing or cancelling a Todo updates every resolved view and does not rewrite
+snapshots. Omitting a UID from a newer snapshot unpins it and does not change
+the Todo status.
+
+Legacy snapshots keep string `nextSteps` and omit `nextTodoUids`. Convert each
+index explicitly; conversion does not append a snapshot. While any source index
+is still unconverted, a completion follow-up copies the full string list and
+`nextStepsSourceUid`. After every index has a Todo, the follow-up materializes
+`nextTodoUids` in source-index order and does not create Todos or change status.
+A snapshot never stores both prose and refs.
+
+`current` and `history` include stored `nextTodoUids` plus live `nextTodos`
+(`uid`, `title`, `status`, `project`). That view is the Todo now, not its state
+at the snapshot time. `at` returns the stored snapshot, including refs when
+present, and does not add the live view.
+
+A snapshot may reference Todos that are unassigned or already in that project.
+If a Todo appears in any `nextTodoUids`, or is linked to a source entry, its
+project cannot be changed. Unpinning the current snapshot does not lift that lock.
+
+Exports that contain refs use version 4 and include every referenced Todo.
+Version 3 remains the Todo bundle without refs. Version 2 and legacy imports
+do not invent open work. Dangling, duplicate, mixed, or cross-project refs fail
+the whole import. Dashboard writes stay same-origin localhost JSON. Activity
+cards still offer **Mark completed**, which appends a follow-up and does not
+complete the project or its Todos. Adding a Todo from the dashboard does not
+pin it; pinning requires a new snapshot.

package/README_CN.md

@@ -223,7 +223,7 @@ pnpm start projects --query "mvp" --json
 
 ## 批量导入
 
-`import` 接受一个 JSON 对象、JSON 数组，或每行一个对象的 JSONL 文件。所有记录先校验，再在同一个 SQLite 事务中写入；任一记录失败时整批回滚。
+`import` 接受一个 JSON 对象、JSON 数组，或每行一个对象的 JSONL 文件。所有记录先校验，再在同一个 SQLite 事务中写入；任一记录失败时整批回滚。下面的示例是旧格式条目：字符串 `nextSteps` 会保留，且不会创建待办。用 `add` 写入的新快照会改为存储 `nextTodoUids`。
 
 ```json
 {
@@ -334,20 +334,44 @@ pmgr revoke-completion --entry 12 --by 18 --reason "验收仍未完成" --source
 
 ### 待办与仪表板操作
 
-新的 `add --next` 会创建独立待办，并关联到这条新动态。
-历史中的下一步仍只是文本，直到在仪表板里显式转为待办。
-待办页支持单独创建、可选关联项目、查看来源动态、标为已完成、取消和重新打开。项目卡片可以筛选这份列表。
-动态卡片提供 **标为已完成**，会用当前项目状态记一条后续动态；这既不会把项目标成完成，也不会完成它的待办。
+待办是具体工作的来源。新的状态快照按顺序存储 `nextTodoUids`，不再把下一步原文写入快照。
+`add --next` 会为每条标题创建一个待办，并在同一事务里写入这些 UID。
+之后的快照如果再次输入相同文本，会创建新的待办；要沿用已有工作，请传 `--next-todo`。
+不要把 `--next` 和 `--next-todo` 写在同一次 `add` 里。同一列表里的重复 UID 会被拒绝。
 
 ```sh
-pmgr todo-add --title "复查结果" --project demo --json
+pmgr add --project demo --status active --summary "已排队复查" \
+  --next "收集日志" --next "写说明" --source agent --json
 pmgr todo-add --title "未归属的想法" --json
-pmgr todos --project demo --json
+pmgr add --project demo --status active --summary "钉住这个想法" \
+  --next-todo <todo-uuid> --source agent --json
+pmgr todos --project demo --status open --json
 pmgr todo-update --uid <todo-uuid> --status completed --json
+pmgr todo-update --uid <todo-uuid> --status cancelled --json
 ```
 
-带待办的导出使用 version 3，并保留待办的身份与状态；
-version 2 和旧版导入仍然可用，且不会把旧的下一步文本自动变成新待办。
-冲突的待办快照会在导入时整批拒绝。
-仪表板写入仅接受同源的 localhost JSON 请求；
-绑定到远程主机时，仪表板保持只读。
+`todos --status open` 从待办而不是字符串下一步回答「还有哪些未完成工作」。
+加上 `--project` 时，当前快照钉住的 UID 会排在前面。
+完成或取消待办会立刻反映在所有解析视图上，且不会改写历史快照。
+新快照不再列入某个 UID，只表示它不再是当前下一步，不会改变该待办的状态。
+
+旧快照保留字符串 `nextSteps`，并省略 `nextTodoUids`。转换仍按来源下标显式进行，且不会追加快照。
+只要还有来源下标未转换，完成活动时的后续快照会复制完整字符串列表和 `nextStepsSourceUid`。
+每个下标都已有待办之后，后续快照才按原下标顺序写入 `nextTodoUids`，不新建待办，也不改变状态。
+一条快照不能同时保存原文和引用。
+
+`current` 和 `history` 会带上存储的 `nextTodoUids`，以及实时的 `nextTodos`（`uid`、`title`、`status`、`project`）。
+这个视图是待办的当前状态，不是快照发生时的历史状态。
+`at` 返回当时的快照；如果存了引用就包含引用，但不会附加实时视图。
+
+快照只能引用未归属的待办，或已经属于该项目的待办。
+待办一旦出现在任意 `nextTodoUids` 中，或关联了来源动态，就不能再改项目。
+从当前快照拿掉引用，也不会解除这个限制。
+
+带引用的导出使用 version 4，并包含被引用的待办。
+没有引用、但有待办的导出仍是 version 3。
+version 2 和旧版导入不会凭空创建待办。
+悬空、重复、混用或跨项目引用会使整批导入失败。
+仪表板写入仍只接受同源的 localhost JSON 请求。
+动态卡片上的 **标为已完成** 会追加一条后续动态，既不完成项目，也不完成待办。
+在仪表板里新增待办不会把它钉进当前下一步；钉住需要再写一条快照。

package/dist/cli.js

@@ -12,7 +12,14 @@ const booleanFlags = new Set([
     "help",
     "version",
 ]);
-const repeats = new Set(["next", "blocker", "decision", "tag", "completes"]);
+const repeats = new Set([
+    "next",
+    "next-todo",
+    "blocker",
+    "decision",
+    "tag",
+    "completes",
+]);
 function parse(argv) {
     const command = [];
     const flags = Object.create(null);
@@ -58,6 +65,7 @@ const allowedFlags = new Map([
             "progress",
             "blocker",
             "next",
+            "next-todo",
             "decision",
             "tag",
             "at",
@@ -68,7 +76,7 @@ const allowedFlags = new Map([
         ]),
     ],
     ["todo-add", new Set(["title", "project", "entry", "json"])],
-    ["todos", new Set(["project", "json"])],
+    ["todos", new Set(["project", "status", "json"])],
     ["todo-update", new Set(["uid", "status", "project", "json"])],
     ["complete", new Set(["entry", "by", "reason", "source", "json"])],
     ["revoke-completion", new Set(["entry", "by", "reason", "source", "json"])],
@@ -101,14 +109,17 @@ const commandHelp = {
         "Create an independent or linked Todo",
         "--title <text> [--project <name>] [--entry <uid>] [--json]",
     ],
-    todos: ["List Todos", "[--project <name>] [--json]"],
+    todos: [
+        "List Todos",
+        "[--project <name>] [--status open|completed|cancelled] [--json]",
+    ],
     "todo-update": [
         "Change Todo status or assign a project",
         "--uid <uuid> [--status open|completed|cancelled] [--project <name>] [--json]",
     ],
     add: [
         "Append a status snapshot",
-        "--project <name> --summary <text> [options]",
+        "--project <name> --summary <text> [--next <text> | --next-todo <uid>] [options]",
     ],
     complete: [
         "Link a completed activity to its follow-up",
@@ -309,7 +320,15 @@ export function run(argv, write = process.stdout.write.bind(process.stdout)) {
                 }), json, write);
                 break;
             case "todos": {
-                const todos = listTodos(db, stringFlag(flags, "project"));
+                const status = stringFlag(flags, "status");
+                if (status !== undefined &&
+                    status !== "open" &&
+                    status !== "completed" &&
+                    status !== "cancelled")
+                    throw new ValidationError("--status must be open, completed, or cancelled");
+                const todos = listTodos(db, stringFlag(flags, "project"), status === undefined
+                    ? {}
+                    : { status: status });
                 if (json)
                     output(todos, true, write);
                 else
@@ -328,6 +347,10 @@ export function run(argv, write = process.stdout.write.bind(process.stdout)) {
                 const project = stringFlag(flags, "project", true);
                 const description = stringFlag(flags, "description");
                 const notes = stringFlag(flags, "notes");
+                const next = listFlag(flags, "next");
+                const nextTodo = listFlag(flags, "next-todo");
+                if (next.length > 0 && nextTodo.length > 0)
+                    throw new ValidationError("cannot combine --next and --next-todo");
                 const result = db
                     .transaction(() => {
                     if (description !== undefined || notes !== undefined) {
@@ -339,7 +362,8 @@ export function run(argv, write = process.stdout.write.bind(process.stdout)) {
                         summary: stringFlag(flags, "summary", true),
                         progress: stringFlag(flags, "progress"),
                         blockers: listFlag(flags, "blocker"),
-                        nextSteps: listFlag(flags, "next"),
+                        nextSteps: next,
+                        ...(nextTodo.length > 0 ? { nextTodoUids: nextTodo } : {}),
                         decisions: listFlag(flags, "decision"),
                         tags: listFlag(flags, "tag"),
                         occurredAt: stringFlag(flags, "at"),

package/dist/db.d.ts

@@ -37,12 +37,13 @@ export declare function getEntry(db: Ledger, ref: string): StatusEntry | undefin
 export declare function changeCompletion(db: Ledger, targetRef: string, byRef: string, action?: CompletionEvent["action"], reason?: string, source?: Source): CompletionEvent;
 export declare function exportLedger(db: Ledger, project?: string): {
     todos?: Todo[] | undefined;
-    version: number;
+    version: 3 | 2 | 4;
     entries: {
         recordedAt: string;
         progress?: string | undefined;
         externalRef?: string | undefined;
         nextStepsSourceUid?: string | undefined;
+        nextTodoUids?: string[] | undefined;
         uid: string;
         project: string;
         status: import("./domain.js").ProjectStatus;
@@ -67,7 +68,9 @@ export type Todo = {
     createdAt: string;
     completedAt: string | null;
 };
-export declare function listTodos(db: Ledger, project?: string): Todo[];
+export declare function listTodos(db: Ledger, project?: string, options?: {
+    status?: Todo["status"];
+}): Todo[];
 export declare function createTodo(db: Ledger, value: unknown): Todo;
 export declare function convertNextStep(db: Ledger, ref: string, index: number): Todo;
 export declare function updateTodo(db: Ledger, uid: string, value: unknown): Todo;

package/dist/db.js

@@ -1,3 +1,4 @@
+import assert from "node:assert/strict";
 import { randomUUID } from "node:crypto";
 import { isDeepStrictEqual } from "node:util";
 import Database from "better-sqlite3";
@@ -88,6 +89,10 @@ export function openLedger(path = databasePath()) {
       CREATE INDEX idx_todos_project ON todos(project);
       INSERT INTO schema_migrations(version) VALUES (4);`);
         }
+        if (!db.prepare("SELECT 1 FROM schema_migrations WHERE version = 5").get()) {
+            db.exec(`ALTER TABLE status_entries ADD COLUMN next_todo_uids_json TEXT;
+        INSERT INTO schema_migrations(version) VALUES (5);`);
+        }
     }).immediate();
     return db;
 }
@@ -101,6 +106,12 @@ function entryFromRow(row) {
         ...(row.progress ? { progress: row.progress } : {}),
         blockers: JSON.parse(row.blockers_json),
         nextSteps: JSON.parse(row.next_steps_json),
+        // NULL means legacy (field absent). An explicit JSON array, including [], is new format.
+        ...(row.next_todo_uids_json == null
+            ? {}
+            : {
+                nextTodoUids: JSON.parse(row.next_todo_uids_json),
+            }),
         ...(row.next_steps_source_uid
             ? { nextStepsSourceUid: row.next_steps_source_uid }
             : {}),
@@ -215,20 +226,11 @@ export function listProjects(db, options = {}) {
         return false;
     });
 }
-export function addStatus(db, value, defaultSource = "human", completes = []) {
-    const input = validateStatusEntry(value, defaultSource);
-    return db
-        .transaction(() => {
-        const result = addValidatedStatus(db, input);
-        if (result.inserted && !result.entry.nextStepsSourceUid)
-            result.entry.nextSteps.forEach((_, index) => convertNextStep(db, result.entry.uid, index));
-        for (const target of completes)
-            changeCompletion(db, target, result.entry.uid, "complete", undefined, input.source);
-        return result;
-    })
-        .immediate();
+function linkCompletions(db, targets, byUid, source) {
+    for (const target of targets)
+        changeCompletion(db, target, byUid, "complete", undefined, source);
 }
-function addValidatedStatus(db, input, recordedAt) {
+function existingIdentity(db, input, recordedAt, textRetry = false) {
     if (input.uid) {
         const existing = one(db, `${select} WHERE e.uid = ?`, input.uid);
         if (existing) {
@@ -237,7 +239,10 @@ function addValidatedStatus(db, input, recordedAt) {
                 id: existing.id,
                 recordedAt: existing.recordedAt,
             });
-            if (!isDeepStrictEqual(toPortableStatusEntry(existing), candidate) ||
+            // Text/ref equivalence is only for addStatus sugar retries, not imports.
+            const sameWrite = isDeepStrictEqual(toPortableStatusEntry(existing), candidate) ||
+                (textRetry && textRefEquivalent(db, existing, input));
+            if (!sameWrite ||
                 (recordedAt !== undefined && recordedAt !== existing.recordedAt))
                 throw new ValidationError("conflicting entry uid");
             return { entry: existing, inserted: false };
@@ -253,6 +258,74 @@ function addValidatedStatus(db, input, recordedAt) {
             return { entry: existing, inserted: false };
         }
     }
+    return undefined;
+}
+function textRefEquivalent(db, existing, input) {
+    // A text --next retry is the same write as the refs snapshot it produced.
+    if (existing.nextTodoUids === undefined || input.nextTodoUids !== undefined)
+        return false;
+    assert.ok(input.nextSteps);
+    const titles = input.nextSteps;
+    if (titles.length !== existing.nextTodoUids.length)
+        return false;
+    const candidate = toPortableStatusEntry({
+        ...input,
+        nextSteps: [],
+        nextTodoUids: existing.nextTodoUids,
+        id: existing.id,
+        recordedAt: existing.recordedAt,
+    });
+    if (!isDeepStrictEqual(toPortableStatusEntry(existing), candidate))
+        return false;
+    return existing.nextTodoUids.every((uid, index) => {
+        const todo = todoByUid(db, uid);
+        return todo !== undefined && todo.title === titles[index];
+    });
+}
+export function addStatus(db, value, defaultSource = "human", completes = []) {
+    const input = validateStatusEntry(value, defaultSource);
+    if (input.nextStepsSourceUid)
+        throw new ValidationError("new snapshots cannot set nextStepsSourceUid");
+    return db
+        .transaction(() => {
+        const replay = existingIdentity(db, input, undefined, true);
+        if (replay) {
+            linkCompletions(db, completes, replay.entry.uid, input.source);
+            return replay;
+        }
+        if (input.nextTodoUids !== undefined) {
+            assertSnapshotRefs(db, input.project, input.nextTodoUids);
+            const result = addValidatedStatus(db, { ...input, nextSteps: [] });
+            linkCompletions(db, completes, result.entry.uid, input.source);
+            return result;
+        }
+        // Text --next sugar: one new Todo per title, stored only as refs.
+        const uid = input.uid ?? randomUUID();
+        const nextTodoUids = input.nextSteps.map(() => randomUUID());
+        const recordedAt = new Date().toISOString();
+        const result = addValidatedStatus(db, { ...input, uid, nextSteps: [], nextTodoUids }, recordedAt);
+        assert.equal(result.inserted, true);
+        input.nextSteps.forEach((title, index) => {
+            insertTodo(db, {
+                uid: nextTodoUids[index],
+                title,
+                project: result.entry.project,
+                entryUid: result.entry.uid,
+                stepIndex: index,
+                status: "open",
+                createdAt: recordedAt,
+                completedAt: null,
+            });
+        });
+        linkCompletions(db, completes, result.entry.uid, input.source);
+        return result;
+    })
+        .immediate();
+}
+function addValidatedStatus(db, input, recordedAt) {
+    const existing = existingIdentity(db, input, recordedAt);
+    if (existing)
+        return existing;
     if (input.nextStepsSourceUid) {
         const origin = getEntry(db, input.nextStepsSourceUid);
         if (!origin ||
@@ -268,9 +341,11 @@ function addValidatedStatus(db, input, recordedAt) {
         .prepare("SELECT id FROM projects WHERE slug = ?")
         .get(input.project);
     const result = db
-        .prepare(`INSERT INTO status_entries(project_id, status, summary, progress, blockers_json, next_steps_json, decisions_json, tags_json, occurred_at, recorded_at, source, external_ref, uid, next_steps_source_uid)
-      VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`)
-        .run(project.id, input.status, input.summary, input.progress ?? null, JSON.stringify(input.blockers), JSON.stringify(input.nextSteps), JSON.stringify(input.decisions), JSON.stringify(input.tags), input.occurredAt, now, input.source, input.externalRef ?? null, input.uid ?? randomUUID(), input.nextStepsSourceUid ?? null);
+        .prepare(`INSERT INTO status_entries(project_id, status, summary, progress, blockers_json, next_steps_json, decisions_json, tags_json, occurred_at, recorded_at, source, external_ref, uid, next_steps_source_uid, next_todo_uids_json)
+      VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)`)
+        .run(project.id, input.status, input.summary, input.progress ?? null, JSON.stringify(input.blockers), JSON.stringify(input.nextSteps), JSON.stringify(input.decisions), JSON.stringify(input.tags), input.occurredAt, now, input.source, input.externalRef ?? null, input.uid ?? randomUUID(), input.nextStepsSourceUid ?? null, input.nextTodoUids === undefined
+        ? null
+        : JSON.stringify(input.nextTodoUids));
     return {
         entry: one(db, `${select} WHERE e.id = ?`, result.lastInsertRowid),
         inserted: true,
@@ -278,7 +353,14 @@ function addValidatedStatus(db, input, recordedAt) {
 }
 export function importStatuses(db, values) {
     const inputs = values.map((value) => validateStatusEntry(value, "import"));
-    return db.transaction(() => inputs.map((input) => addValidatedStatus(db, input)))();
+    return db.transaction(() => {
+        const results = inputs.map((input) => addValidatedStatus(db, input));
+        // Entry-only imports declare no Todos, so every ref is an omitted dependency.
+        const payloadTodos = new Set();
+        for (const result of results)
+            assertSnapshotRefs(db, result.entry.project, result.entry.nextTodoUids, payloadTodos);
+        return results;
+    })();
 }
 export function current(db, project) {
     const where = project ? " AND p.slug = ?" : "";
@@ -310,6 +392,7 @@ export function history(db, project, options = {}) {
     return rows.map((row) => annotateEntry(db, entryFromRow(row)));
 }
 export function at(db, project, occurredAt) {
+    // Stored snapshot only. Refs may be present; live Todo titles are not historical.
     return one(db, `${select} WHERE p.slug = ? AND e.occurred_at <= ? ORDER BY e.occurred_at DESC, e.id DESC LIMIT 1`, project, occurredAt);
 }
 export function countEntries(db, project) {
@@ -358,6 +441,9 @@ function annotateEntry(db, entry) {
         ...entry,
         effectiveStatus: followUp ? "completed" : entry.status,
         isCurrent: newest?.id === entry.id,
+        ...(entry.nextTodoUids !== undefined
+            ? { nextTodos: entry.nextTodoUids.map((uid) => resolveNextTodo(db, uid)) }
+            : {}),
         ...(followUp && latest
             ? {
                 completedBy: {
@@ -450,16 +536,13 @@ export function exportLedger(db, project) {
         const rows = db
             .prepare(`SELECT c.* FROM completion_events c JOIN status_entries e ON e.uid = c.target_uid JOIN projects p ON p.id = e.project_id ${project ? "WHERE p.slug = ?" : ""} ORDER BY c.id`)
             .all(...(project ? [project] : []));
-        const todos = listTodos(db, project);
+        const todos = project ? todosVisibleToProject(db, project) : listTodos(db);
+        const version = ledgerVersion(entries, todos);
         return {
-            version: todos.length || entries.some((entry) => entry.nextStepsSourceUid)
-                ? 3
-                : 2,
+            version,
             entries,
             completions: rows.map(completionFromRow),
-            ...(todos.length || entries.some((entry) => entry.nextStepsSourceUid)
-                ? { todos }
-                : {}),
+            ...(version >= 3 ? { todos } : {}),
         };
     })();
 }
@@ -505,11 +588,31 @@ function validateCompletionEvent(value) {
         source: row.source,
     };
 }
+function declaredTodoUids(values) {
+    const uids = new Set();
+    for (const value of values) {
+        if (!value || typeof value !== "object" || !("todos" in value))
+            continue;
+        const todos = value.todos;
+        if (!Array.isArray(todos))
+            continue;
+        for (const todo of todos) {
+            if (todo &&
+                typeof todo === "object" &&
+                "uid" in todo &&
+                typeof todo.uid === "string")
+                uids.add(todo.uid);
+        }
+    }
+    return uids;
+}
 export function importLedger(db, values) {
     // Both legacy entries and versioned bundles are accepted atomically, including JSONL.
     return db
         .transaction(() => {
         const results = [];
+        // Refs must name Todos declared in this payload, not only rows already stored.
+        const payloadTodos = declaredTodoUids(values);
         for (const value of values) {
             if (value && typeof value === "object" && "version" in value) {
                 const bundle = record(value, [
@@ -518,27 +621,37 @@ export function importLedger(db, values) {
                     "completions",
                     "todos",
                 ]);
-                if ((bundle.version !== 2 && bundle.version !== 3) ||
-                    (bundle.version === 3 && !Array.isArray(bundle.todos)) ||
-                    (bundle.version === 2 && bundle.todos !== undefined) ||
+                const version = bundle.version;
+                if ((version !== 2 && version !== 3 && version !== 4) ||
+                    ((version === 3 || version === 4) &&
+                        !Array.isArray(bundle.todos)) ||
+                    (version === 2 && bundle.todos !== undefined) ||
                     !Array.isArray(bundle.entries) ||
                     !Array.isArray(bundle.completions))
                     throw new ValidationError("invalid ledger bundle");
+                const imported = [];
                 for (const item of bundle.entries) {
                     if (!item || typeof item !== "object" || Array.isArray(item))
                         throw new ValidationError("entry must be an object");
                     const { recordedAt, ...input } = item;
                     validateUid(input.uid);
-                    results.push(addValidatedStatus(db, validateStatusEntry(input, "import"), parseTime(recordedAt, "recordedAt")));
+                    const result = addValidatedStatus(db, validateStatusEntry(input, "import"), parseTime(recordedAt, "recordedAt"));
+                    imported.push(result.entry);
+                    results.push(result);
                 }
                 for (const event of bundle.completions)
                     insertCompletion(db, validateCompletionEvent(event));
-                if (bundle.version === 3)
+                if (version === 3 || version === 4)
                     for (const todo of bundle.todos)
                         importTodo(db, todo);
+                for (const entry of imported)
+                    assertSnapshotRefs(db, entry.project, entry.nextTodoUids, payloadTodos);
+            }
+            else {
+                const result = addValidatedStatus(db, validateStatusEntry(value, "import"));
+                results.push(result);
+                assertSnapshotRefs(db, result.entry.project, result.entry.nextTodoUids, payloadTodos);
             }
-            else
-                results.push(addValidatedStatus(db, validateStatusEntry(value, "import")));
         }
         return results;
     })
@@ -546,12 +659,121 @@ export function importLedger(db, values) {
 }
 const todoSelect = `SELECT uid, title, project, entry_uid AS entryUid,
   step_index AS stepIndex, status, created_at AS createdAt, completed_at AS completedAt FROM todos`;
-export function listTodos(db, project) {
+function ledgerVersion(entries, todos) {
+    if (entries.some((entry) => entry.nextTodoUids !== undefined))
+        return 4;
+    if (todos.length > 0 ||
+        entries.some((entry) => entry.nextStepsSourceUid !== undefined))
+        return 3;
+    return 2;
+}
+function todosVisibleToProject(db, project) {
+    return db
+        .prepare(`${todoSelect} WHERE project = ?
+        OR uid IN (
+          SELECT j.value FROM status_entries e
+          JOIN projects p ON p.id = e.project_id
+          JOIN json_each(e.next_todo_uids_json) j
+          WHERE p.slug = ? AND e.next_todo_uids_json IS NOT NULL
+        )
+        ORDER BY created_at, uid`)
+        .all(project, project);
+}
+function todoByUid(db, uid) {
+    return db.prepare(todoSelect + " WHERE uid = ?").get(uid);
+}
+function resolveNextTodo(db, uid) {
+    const todo = todoByUid(db, uid);
+    if (!todo)
+        return { uid, title: uid, status: "open", project: null };
+    return {
+        uid: todo.uid,
+        title: todo.title,
+        status: todo.status,
+        project: todo.project,
+    };
+}
+function assertSnapshotRefs(db, project, uids, payloadTodos) {
+    if (uids === undefined)
+        return;
+    for (const uid of uids) {
+        const todo = todoByUid(db, uid);
+        if (!todo)
+            throw new ValidationError("dangling next todo uid");
+        if (todo.project !== null && todo.project !== project)
+            throw new ValidationError("cross-project next todo ref");
+        if (payloadTodos && !payloadTodos.has(uid))
+            throw new ValidationError("dangling next todo uid");
+    }
+}
+function todoIsReferenced(db, uid) {
+    return (db
+        .prepare(`SELECT 1 AS found FROM status_entries, json_each(next_todo_uids_json)
+         WHERE next_todo_uids_json IS NOT NULL AND json_each.value = ? LIMIT 1`)
+        .get(uid) !== undefined);
+}
+function stepTodo(db, entryUid, index) {
     return db
+        .prepare(todoSelect + " WHERE entry_uid = ? AND step_index = ?")
+        .get(entryUid, index);
+}
+function legacySource(db, entry) {
+    if (!entry.nextStepsSourceUid)
+        return entry;
+    const origin = getEntry(db, entry.nextStepsSourceUid);
+    assert.ok(origin);
+    assert.equal(origin.nextStepsSourceUid, undefined);
+    return origin;
+}
+function preservedNextWork(db, latest) {
+    if (latest.nextTodoUids !== undefined)
+        return { nextSteps: [], nextTodoUids: [...latest.nextTodoUids] };
+    const source = legacySource(db, latest);
+    const pending = source.nextSteps.some((_, index) => stepTodo(db, source.uid, index) === undefined);
+    if (pending)
+        return {
+            nextSteps: [...source.nextSteps],
+            nextStepsSourceUid: source.uid,
+        };
+    return {
+        nextSteps: [],
+        nextTodoUids: source.nextSteps.map((_, index) => {
+            const todo = stepTodo(db, source.uid, index);
+            assert.ok(todo);
+            return todo.uid;
+        }),
+    };
+}
+export function listTodos(db, project, options = {}) {
+    const clauses = [];
+    const params = [];
+    if (project) {
+        clauses.push("project = ?");
+        params.push(project);
+    }
+    if (options.status !== undefined) {
+        if (!["open", "completed", "cancelled"].includes(options.status))
+            throw new ValidationError("invalid todo status");
+        clauses.push("status = ?");
+        params.push(options.status);
+    }
+    const rows = db
         .prepare(todoSelect +
-        (project ? " WHERE project = ?" : "") +
+        (clauses.length ? ` WHERE ${clauses.join(" AND ")}` : "") +
         " ORDER BY created_at, uid")
-        .all(...(project ? [project] : []));
+        .all(...params);
+    const pins = options.status === "open" && project
+        ? current(db, project)[0]?.nextTodoUids
+        : undefined;
+    if (pins?.length) {
+        const rank = new Map(pins.map((uid, index) => [uid, index]));
+        rows.sort((left, right) => {
+            const leftRank = rank.get(left.uid) ?? pins.length;
+            const rightRank = rank.get(right.uid) ?? pins.length;
+            return leftRank - rightRank;
+        });
+    }
+    return rows;
 }
 function insertTodo(db, todo) {
     db.prepare(`INSERT INTO todos(uid,title,project,entry_uid,step_index,status,created_at,completed_at)
@@ -638,15 +860,21 @@ export function updateTodo(db, uid, value) {
             }
         }
         if (input.project !== undefined) {
-            if (todo.entryUid)
-                throw new ValidationError("source-linked todo project cannot change");
-            todo.project =
-                input.project === null
-                    ? null
-                    : validateProjectMetadataInput({ project: input.project }).project;
-            if (todo.project &&
-                !db.prepare("SELECT 1 FROM projects WHERE slug = ?").get(todo.project))
-                throw new ValidationError("project not found");
+            const nextProject = input.project === null
+                ? null
+                : validateProjectMetadataInput({ project: input.project }).project;
+            if (nextProject !== todo.project) {
+                if (todo.entryUid || todoIsReferenced(db, todo.uid))
+                    throw new ValidationError(todo.entryUid
+                        ? "source-linked todo project cannot change"
+                        : "referenced todo project cannot change");
+                if (nextProject &&
+                    !db
+                        .prepare("SELECT 1 FROM projects WHERE slug = ?")
+                        .get(nextProject))
+                    throw new ValidationError("project not found");
+                todo.project = nextProject;
+            }
         }
         db.prepare("UPDATE todos SET status=?, completed_at=?, project=? WHERE uid=?").run(todo.status, todo.completedAt, todo.project, uid);
         return todo;
@@ -684,11 +912,17 @@ function importTodo(db, value) {
         const entry = getEntry(db, validateUid(input.entryUid));
         if (!entry || entry.project !== input.project)
             throw new ValidationError("invalid todo source");
-        if (input.stepIndex !== null &&
-            (!Number.isInteger(input.stepIndex) ||
-                Number(input.stepIndex) < 0 ||
-                entry.nextSteps[Number(input.stepIndex)] !== input.title))
-            throw new ValidationError("invalid next step index");
+        if (input.stepIndex !== null) {
+            if (!Number.isInteger(input.stepIndex) || Number(input.stepIndex) < 0)
+                throw new ValidationError("invalid next step index");
+            const index = Number(input.stepIndex);
+            if (entry.nextTodoUids !== undefined) {
+                if (entry.nextTodoUids[index] !== input.uid)
+                    throw new ValidationError("invalid next step index");
+            }
+            else if (entry.nextSteps[index] !== input.title)
+                throw new ValidationError("invalid next step index");
+        }
     }
     else if (input.stepIndex !== null)
         throw new ValidationError("next step requires a source");
@@ -711,18 +945,18 @@ export function completeActivity(db, ref) {
             return entry;
         const latest = current(db, entry.project)[0];
         const occurredAt = new Date(Math.max(Date.now(), Date.parse(latest.occurredAt) + 1)).toISOString();
-        // Preserve current context without generating another set of next-step Todos.
+        // Copy refs, or keep the full legacy string list until every index is converted.
+        const preserved = preservedNextWork(db, latest);
         const followUp = addValidatedStatus(db, validateStatusEntry({
             project: entry.project,
             status: latest.status,
             summary: `Completed activity #${entry.id}`,
             progress: latest.progress,
             blockers: latest.blockers,
-            nextSteps: latest.nextSteps,
-            nextStepsSourceUid: latest.nextStepsSourceUid ?? latest.uid,
             decisions: latest.decisions,
             tags: latest.tags,
             occurredAt,
+            ...preserved,
         }));
         changeCompletion(db, entry.uid, followUp.entry.uid);
         return getEntry(db, entry.uid);

package/dist/domain.d.ts

@@ -18,6 +18,12 @@ export type ProjectMetadataInput = {
     description?: string | null;
     notes?: string | null;
 };
+export type NextTodoRef = {
+    uid: string;
+    title: string;
+    status: "open" | "completed" | "cancelled";
+    project: string | null;
+};
 export type StatusEntryInput = {
     uid?: string;
     project: string;
@@ -26,6 +32,7 @@ export type StatusEntryInput = {
     progress?: string;
     blockers?: string[];
     nextSteps?: string[];
+    nextTodoUids?: string[];
     nextStepsSourceUid?: string;
     decisions?: string[];
     tags?: string[];
@@ -33,8 +40,11 @@ export type StatusEntryInput = {
     source?: Source;
     externalRef?: string;
 };
-export type StatusEntry = Required<Omit<StatusEntryInput, "progress" | "externalRef" | "nextStepsSourceUid">> & {
+export type StatusEntry = Required<Omit<StatusEntryInput, "progress" | "externalRef" | "nextStepsSourceUid" | "nextTodoUids">> & {
     nextStepsSourceUid?: string;
+    nextTodoUids?: string[];
+    /** Live Todo rows for display. Not a historical as-of view. */
+    nextTodos?: NextTodoRef[];
     id: number;
     progress?: string;
     externalRef?: string;
@@ -49,12 +59,12 @@ export type StatusEntry = Required<Omit<StatusEntryInput, "progress" | "external
         recordedAt: string;
     };
 };
-export type PortableStatusEntry = Omit<StatusEntry, "id" | "recordedAt" | "effectiveStatus" | "isCurrent" | "completedBy">;
+export type PortableStatusEntry = Omit<StatusEntry, "id" | "recordedAt" | "effectiveStatus" | "isCurrent" | "completedBy" | "nextTodos">;
 export declare class ValidationError extends Error {
     constructor(message: string);
 }
 export declare function parseTime(value: unknown, field: string): string;
 export declare function validateProjectMetadataInput(value: unknown): ProjectMetadataInput;
-export declare function validateStatusEntry(value: unknown, defaultSource?: Source): StatusEntryInput & Required<Pick<StatusEntryInput, "occurredAt" | "source">>;
+export declare function validateStatusEntry(value: unknown, defaultSource?: Source): StatusEntryInput & Required<Pick<StatusEntryInput, "occurredAt" | "source" | "nextSteps" | "blockers" | "decisions" | "tags">>;
 export declare function toPortableStatusEntry(entry: StatusEntry): PortableStatusEntry;
 export declare function validateUid(value: unknown): string;

package/dist/domain.js

@@ -16,6 +16,7 @@ const keys = new Set([
     "progress",
     "blockers",
     "nextSteps",
+    "nextTodoUids",
     "nextStepsSourceUid",
     "decisions",
     "tags",
@@ -67,6 +68,14 @@ function textList(value, field) {
         throw new ValidationError(`${field} must be an array of at most 100 strings`);
     return value.map((item) => text(item, field, true));
 }
+function uidList(value, field) {
+    if (!Array.isArray(value) || value.length > 100)
+        throw new ValidationError(`${field} must be an array of at most 100 uuids`);
+    const uids = value.map((item) => validateUid(item));
+    if (new Set(uids).size !== uids.length)
+        throw new ValidationError(`${field} contains a duplicate uid`);
+    return uids;
+}
 export function parseTime(value, field) {
     if (typeof value !== "string" ||
         !/^\d{4}-\d{2}-\d{2}T.*(?:Z|[+-]\d{2}:\d{2})$/.test(value) ||
@@ -121,6 +130,18 @@ export function validateStatusEntry(value, defaultSource = "human") {
     const externalRef = text(input.externalRef, "externalRef");
     if (externalRef && externalRef.length > 200)
         throw new ValidationError("externalRef must be at most 200 characters");
+    const nextSteps = textList(input.nextSteps, "nextSteps");
+    const nextStepsSourceUid = input.nextStepsSourceUid === undefined
+        ? undefined
+        : validateUid(input.nextStepsSourceUid);
+    // null and omission both mean legacy rows: the refs field is absent, not [].
+    const nextTodoUids = input.nextTodoUids === undefined || input.nextTodoUids === null
+        ? undefined
+        : uidList(input.nextTodoUids, "nextTodoUids");
+    if (nextTodoUids !== undefined && nextSteps.length > 0)
+        throw new ValidationError("cannot combine nextSteps text with nextTodoUids");
+    if (nextTodoUids !== undefined && nextStepsSourceUid !== undefined)
+        throw new ValidationError("invalid next step provenance");
     return {
         ...(input.uid === undefined ? {} : { uid: validateUid(input.uid) }),
         project,
@@ -128,10 +149,9 @@ export function validateStatusEntry(value, defaultSource = "human") {
         summary: text(input.summary, "summary", true),
         progress: text(input.progress, "progress"),
         blockers: textList(input.blockers, "blockers"),
-        nextSteps: textList(input.nextSteps, "nextSteps"),
-        ...(input.nextStepsSourceUid === undefined
-            ? {}
-            : { nextStepsSourceUid: validateUid(input.nextStepsSourceUid) }),
+        nextSteps,
+        ...(nextTodoUids !== undefined ? { nextTodoUids } : {}),
+        ...(nextStepsSourceUid !== undefined ? { nextStepsSourceUid } : {}),
         decisions: textList(input.decisions, "decisions"),
         tags: textList(input.tags, "tags"),
         occurredAt: input.occurredAt === undefined
@@ -156,6 +176,8 @@ export function toPortableStatusEntry(entry) {
     };
     if (entry.nextStepsSourceUid !== undefined)
         result.nextStepsSourceUid = entry.nextStepsSourceUid;
+    if (entry.nextTodoUids !== undefined)
+        result.nextTodoUids = entry.nextTodoUids;
     if (entry.progress !== undefined)
         result.progress = entry.progress;
     if (entry.externalRef !== undefined)

package/dist/server.js

@@ -1,4 +1,4 @@
-import { exec } from "node:child_process";
+import { spawn } from "node:child_process";
 import { createServer, } from "node:http";
 import { URL } from "node:url";
 import { countEntries, createTodo, listTodos, updateTodo, convertNextStep, completeActivity, getEntry, history, listProjects, openLedger, } from "./db.js";
@@ -6,19 +6,18 @@ import { ValidationError } from "./domain.js";
 import { getWebUIHTML } from "./web/ui.js";
 export function openBrowser(url) {
     const platform = process.platform;
-    let command = "";
-    if (platform === "darwin") {
-        command = `open "${url}"`;
-    }
-    else if (platform === "win32") {
-        command = `start "" "${url}"`;
-    }
-    else {
-        command = `xdg-open "${url}"`;
-    }
-    exec(command, () => {
-        /* ignore background exec errors */
+    const command = platform === "darwin" ? "open" : platform === "win32" ? "cmd" : "xdg-open";
+    const args = platform === "darwin"
+        ? [url]
+        : platform === "win32"
+            ? ["/c", "start", "", url]
+            : [url];
+    const child = spawn(command, args, { detached: true, stdio: "ignore" });
+    child.on("error", () => {
+        /* ignore background launch errors */
     });
+    // Detach so a long-lived browser does not keep this process alive.
+    child.unref();
 }
 function parseQueryParams(url) {
     const params = {};
@@ -68,7 +67,17 @@ export function handleRequest(req, res, db) {
         return;
     }
     if (pathname === "/api/todos") {
-        sendJson(res, 200, listTodos(db, query.project));
+        const status = query.status;
+        if (status !== undefined &&
+            status !== "open" &&
+            status !== "completed" &&
+            status !== "cancelled") {
+            sendJson(res, 400, { error: "invalid todo status" });
+            return;
+        }
+        sendJson(res, 200, listTodos(db, query.project, status === undefined
+            ? {}
+            : { status: status }));
         return;
     }
     if (pathname === "/api/projects") {

package/dist/web/script.js

@@ -184,7 +184,16 @@ export function getWebUIScript(initialLang) {
             </div>
           \` : ''}
 
-          \${item.nextSteps && item.nextSteps.length ? \`
+          \${pinnedTodos(item).length ? \`
+            <div class="section-box">
+              <div class="section-title next-steps">\${escapeHtml(t('nextStepsTitle'))}</div>
+              <ul class="bullet-list">
+                \${pinnedTodos(item).map(todo => \`<li><strong>\${escapeHtml(todo.title)}</strong> <span class="status-badge status-\${escapeHtml(todo.status)}">\${escapeHtml(t('todo_' + todo.status))}</span> <code>\${escapeHtml(todo.uid)}</code></li>\`).join('')}
+              </ul>
+            </div>
+          \` : ''}
+
+          \${!item.nextTodoUids && item.nextSteps && item.nextSteps.length ? \`
             <div class="section-box">
               <div class="section-title next-steps">\${escapeHtml(t('nextStepsTitle'))}</div>
               <ul class="bullet-list">
@@ -211,7 +220,7 @@ export function getWebUIScript(initialLang) {
           <div class="section-box">
             <button class="btn" data-action="add-todo" data-entry="\${escapeHtml(item.uid)}">\${escapeHtml(t('addTodo'))}</button>
             \${status !== 'completed' ? \`<button class="btn" data-action="complete-entry" data-entry="\${escapeHtml(item.uid)}">\${escapeHtml(t('complete'))}</button>\` : ''}
-            \${todosData.filter(todo => todo.entryUid === item.uid || todo.entryUid === item.nextStepsSourceUid).map(renderTodo).join('')}
+            \${todosData.filter(todo => (todo.entryUid === item.uid || todo.entryUid === item.nextStepsSourceUid) && !(item.nextTodoUids || []).includes(todo.uid)).map(renderTodo).join('')}
           </div>
         </div>
       \`;
@@ -283,6 +292,7 @@ export function getWebUIScript(initialLang) {
                     <div class="latest-summary">
                       <div class="latest-summary-title">\${escapeHtml(t('latestUpdate'))} (\${formatTime(p.latestStatus.occurredAt)})</div>
                       <div>\${escapeHtml(p.latestStatus.summary)}</div>
+                      \${Array.isArray(p.latestStatus.nextTodos) && p.latestStatus.nextTodos.length ? \`<ul class="bullet-list">\${p.latestStatus.nextTodos.map(todo => \`<li>\${escapeHtml(todo.title)} <span class="status-badge status-\${escapeHtml(todo.status)}">\${escapeHtml(t('todo_' + todo.status))}</span></li>\`).join('')}</ul>\` : ''}
                     </div>
                   \` : ''}
                 </div>
@@ -376,6 +386,15 @@ export function getWebUIScript(initialLang) {
       return '<option value="">' + escapeHtml(t('noProject')) + '</option>' + projectsData.map(p =>
         '<option value="' + escapeHtml(p.project) + '"' + (selected === p.project ? ' selected' : '') + '>' + escapeHtml(p.displayName) + '</option>').join('');
     }
+    function pinnedTodos(item) {
+      if (!Array.isArray(item.nextTodoUids)) return [];
+      const embedded = Array.isArray(item.nextTodos) ? item.nextTodos : [];
+      return item.nextTodoUids.map((uid) => {
+        const live = todosData.find((todo) => todo.uid === uid);
+        const snapshot = embedded.find((todo) => todo.uid === uid);
+        return live || snapshot || { uid, title: uid, status: 'open', project: null };
+      });
+    }
     function renderTodo(todo) {
       return '<div class="section-box"><strong>' + escapeHtml(todo.title) + '</strong> · ' + escapeHtml(t('todo_' + todo.status)) +
         (todo.project ? ' · ' + escapeHtml(todo.project) : '') +

package/dist/web/styles.d.ts

@@ -1 +1 @@
-export declare const WEB_UI_STYLES = "    :root {\n      --bg: #0d1117;\n      --card-bg: #161b22;\n      --border: #30363d;\n      --text: #c9d1d9;\n      --text-muted: #8b949e;\n      --heading: #f0f6fc;\n      --accent: #58a6ff;\n      --accent-hover: #79c0ff;\n      --success: #3fb950;\n      --warning: #d29922;\n      --danger: #f85149;\n      --purple: #bc8cff;\n      --cyan: #39c5cf;\n      --radius: 8px;\n    }\n\n    * {\n      box-sizing: border-box;\n      margin: 0;\n      padding: 0;\n    }\n\n    body {\n      font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n      background-color: var(--bg);\n      color: var(--text);\n      line-height: 1.5;\n      padding: 0;\n      margin: 0;\n      min-height: 100vh;\n    }\n\n    header {\n      background-color: var(--card-bg);\n      border-bottom: 1px solid var(--border);\n      position: sticky;\n      top: 0;\n      z-index: 100;\n      padding: 1rem 1.5rem;\n    }\n\n    .header-container {\n      max-width: 1200px;\n      margin: 0 auto;\n      display: flex;\n      flex-wrap: wrap;\n      align-items: center;\n      justify-content: space-between;\n      gap: 1rem;\n    }\n\n    .brand {\n      display: flex;\n      align-items: center;\n      gap: 0.75rem;\n    }\n\n    .logo-icon {\n      width: 32px;\n      height: 32px;\n      background: linear-gradient(135deg, var(--accent), var(--purple));\n      border-radius: 8px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: #fff;\n      font-weight: bold;\n      font-size: 1.1rem;\n    }\n\n    h1 {\n      font-size: 1.25rem;\n      font-weight: 600;\n      color: var(--heading);\n    }\n\n    .header-right {\n      display: flex;\n      align-items: center;\n      gap: 0.75rem;\n      flex-wrap: wrap;\n    }\n\n    .stats-bar {\n      display: flex;\n      gap: 0.75rem;\n      flex-wrap: wrap;\n    }\n\n    .lang-switch {\n      display: inline-flex;\n      gap: 0.2rem;\n      background: var(--bg);\n      padding: 0.2rem;\n      border-radius: 6px;\n      border: 1px solid var(--border);\n    }\n\n    .lang-btn {\n      background: transparent;\n      border: none;\n      color: var(--text-muted);\n      padding: 0.25rem 0.65rem;\n      font-size: 0.8rem;\n      font-weight: 500;\n      border-radius: 4px;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .lang-btn:hover {\n      color: var(--heading);\n    }\n\n    .lang-btn.active {\n      background: var(--accent);\n      color: #ffffff;\n      font-weight: 600;\n    }\n\n    .stat-pill {\n      background: rgba(255, 255, 255, 0.05);\n      border: 1px solid var(--border);\n      border-radius: 20px;\n      padding: 0.25rem 0.75rem;\n      font-size: 0.85rem;\n      display: flex;\n      align-items: center;\n      gap: 0.35rem;\n    }\n\n    .stat-val {\n      font-weight: 600;\n      color: var(--heading);\n    }\n\n    .controls {\n      display: flex;\n      align-items: center;\n      gap: 0.75rem;\n      flex-wrap: wrap;\n      width: 100%;\n      max-width: 1200px;\n      margin: 1rem auto 0 auto;\n      padding: 0 1.5rem;\n    }\n\n    .search-box {\n      flex: 1;\n      min-width: 240px;\n      position: relative;\n    }\n\n    .search-input {\n      width: 100%;\n      background: var(--card-bg);\n      border: 1px solid var(--border);\n      color: var(--text);\n      padding: 0.5rem 0.75rem 0.5rem 2.25rem;\n      border-radius: var(--radius);\n      font-size: 0.9rem;\n      outline: none;\n      transition: border-color 0.2s;\n    }\n\n    .search-input:focus {\n      border-color: var(--accent);\n    }\n\n    .search-icon {\n      position: absolute;\n      left: 0.75rem;\n      top: 50%;\n      transform: translateY(-50%);\n      color: var(--text-muted);\n      pointer-events: none;\n      font-size: 0.85rem;\n    }\n\n    .nav-tabs {\n      display: flex;\n      gap: 0.5rem;\n      background: var(--card-bg);\n      padding: 0.25rem;\n      border-radius: var(--radius);\n      border: 1px solid var(--border);\n    }\n\n    .tab-btn {\n      background: transparent;\n      border: none;\n      color: var(--text-muted);\n      padding: 0.4rem 1rem;\n      font-size: 0.875rem;\n      font-weight: 500;\n      border-radius: 6px;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .tab-btn:hover {\n      color: var(--heading);\n    }\n\n    .tab-btn.active {\n      background: var(--accent);\n      color: #ffffff;\n    }\n\n    .btn[hidden] { display: none !important; }\n    .btn {\n      background: var(--card-bg);\n      border: 1px solid var(--border);\n      color: var(--text);\n      padding: 0.45rem 0.85rem;\n      border-radius: var(--radius);\n      font-size: 0.875rem;\n      cursor: pointer;\n      display: inline-flex;\n      align-items: center;\n      gap: 0.35rem;\n      transition: all 0.2s;\n    }\n\n    .btn:hover {\n      border-color: var(--text-muted);\n      color: var(--heading);\n    }\n\n    .btn-sm {\n      padding: 0.3rem 0.6rem;\n      font-size: 0.8rem;\n    }\n\n    .btn-primary {\n      background: var(--accent);\n      color: #ffffff;\n      border-color: var(--accent);\n      margin-top: 0.75rem;\n    }\n\n    .btn-primary:hover {\n      background: var(--accent-hover);\n      color: #ffffff;\n    }\n\n    main {\n      max-width: 1200px;\n      margin: 1.5rem auto;\n      padding: 0 1.5rem;\n    }\n\n    .view-panel {\n      display: none;\n    }\n\n    .view-panel.active {\n      display: block;\n    }\n\n    /* Activity Feed Toolbar & Grouping Toggle */\n    .activity-toolbar {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      gap: 1rem;\n      background: var(--card-bg);\n      border: 1px solid var(--border);\n      border-radius: var(--radius);\n      padding: 0.75rem 1rem;\n      margin-bottom: 1.25rem;\n      flex-wrap: wrap;\n    }\n\n    .date-picker-wrapper {\n      display: flex;\n      align-items: center;\n      gap: 0.6rem;\n      font-size: 0.9rem;\n      color: var(--heading);\n      font-weight: 500;\n      flex-wrap: wrap;\n    }\n\n    .date-input {\n      background: var(--bg);\n      border: 1px solid var(--border);\n      color: var(--heading);\n      padding: 0.35rem 0.65rem;\n      border-radius: 6px;\n      font-size: 0.875rem;\n      outline: none;\n      font-family: inherit;\n    }\n\n    .date-input:focus {\n      border-color: var(--accent);\n    }\n\n    .view-mode-toggle {\n      display: flex;\n      gap: 0.25rem;\n      background: var(--bg);\n      padding: 0.2rem;\n      border-radius: 6px;\n      border: 1px solid var(--border);\n    }\n\n    .mode-btn {\n      background: transparent;\n      border: none;\n      color: var(--text-muted);\n      padding: 0.3rem 0.75rem;\n      font-size: 0.8rem;\n      font-weight: 500;\n      border-radius: 4px;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .mode-btn:hover {\n      color: var(--heading);\n    }\n\n    .mode-btn.active {\n      background: var(--accent);\n      color: #ffffff;\n      font-weight: 600;\n    }\n\n    /* Project Grouping Container */\n    .project-group-card {\n      background: var(--card-bg);\n      border: 1px solid var(--border);\n      border-radius: var(--radius);\n      padding: 1.25rem;\n      margin-bottom: 1.25rem;\n    }\n\n    .project-group-header {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      border-bottom: 1px solid var(--border);\n      padding-bottom: 0.75rem;\n      margin-bottom: 1rem;\n    }\n\n    .project-group-title {\n      display: flex;\n      align-items: center;\n      gap: 0.6rem;\n      font-size: 1.1rem;\n      font-weight: 600;\n      color: var(--heading);\n    }\n\n    .project-group-count {\n      font-size: 0.8rem;\n      color: var(--text-muted);\n      background: rgba(255, 255, 255, 0.06);\n      padding: 0.15rem 0.55rem;\n      border-radius: 12px;\n    }\n\n    /* Projects Grid */\n    .projects-grid {\n      display: grid;\n      grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));\n      gap: 1.25rem;\n    }\n\n    .project-card {\n      background: var(--card-bg);\n      border: 1px solid var(--border);\n      border-radius: var(--radius);\n      padding: 1.25rem;\n      display: flex;\n      flex-direction: column;\n      justify-content: space-between;\n      transition: transform 0.15s, border-color 0.15s;\n    }\n\n    .project-card:hover {\n      border-color: var(--text-muted);\n      transform: translateY(-2px);\n    }\n\n    .card-header {\n      display: flex;\n      align-items: flex-start;\n      justify-content: space-between;\n      gap: 0.75rem;\n      margin-bottom: 0.75rem;\n    }\n\n    .project-title {\n      font-size: 1.1rem;\n      font-weight: 600;\n      color: var(--heading);\n    }\n\n    .project-slug {\n      font-size: 0.8rem;\n      color: var(--text-muted);\n      font-family: monospace;\n    }\n\n    .completion-evidence { margin: 12px 0; line-height: 1.7; }\n    details > summary { cursor: pointer; margin: 12px 0; }\n    .status-badge {\n      font-size: 0.75rem;\n      font-weight: 600;\n      text-transform: uppercase;\n      padding: 0.2rem 0.55rem;\n      border-radius: 12px;\n      display: inline-block;\n      white-space: nowrap;\n    }\n\n    .status-active { background: rgba(63, 185, 80, 0.15); color: var(--success); border: 1px solid rgba(63, 185, 80, 0.3); }\n    .status-planned { background: rgba(88, 166, 255, 0.15); color: var(--accent); border: 1px solid rgba(88, 166, 255, 0.3); }\n    .status-idea { background: rgba(188, 140, 255, 0.15); color: var(--purple); border: 1px solid rgba(188, 140, 255, 0.3); }\n    .status-blocked { background: rgba(248, 81, 73, 0.15); color: var(--danger); border: 1px solid rgba(248, 81, 73, 0.3); }\n    .status-paused { background: rgba(210, 153, 34, 0.15); color: var(--warning); border: 1px solid rgba(210, 153, 34, 0.3); }\n    .status-completed { background: rgba(57, 197, 207, 0.15); color: var(--cyan); border: 1px solid rgba(57, 197, 207, 0.3); }\n    .status-archived { background: rgba(139, 148, 158, 0.15); color: var(--text-muted); border: 1px solid rgba(139, 148, 158, 0.3); }\n\n    .card-body {\n      margin-bottom: 1rem;\n      font-size: 0.9rem;\n    }\n\n    .card-description {\n      color: var(--text);\n      margin-bottom: 0.5rem;\n    }\n\n    .card-notes {\n      color: var(--text-muted);\n      font-size: 0.85rem;\n      font-style: italic;\n      border-left: 2px solid var(--border);\n      padding-left: 0.5rem;\n      margin-top: 0.5rem;\n    }\n\n    .latest-summary {\n      background: rgba(0, 0, 0, 0.2);\n      padding: 0.6rem;\n      border-radius: 6px;\n      margin-top: 0.75rem;\n      font-size: 0.85rem;\n    }\n\n    .latest-summary-title {\n      font-size: 0.75rem;\n      color: var(--text-muted);\n      text-transform: uppercase;\n      margin-bottom: 0.25rem;\n    }\n\n    .card-footer {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      font-size: 0.85rem;\n      color: var(--text-muted);\n      border-top: 1px solid var(--border);\n      padding-top: 0.75rem;\n      margin-top: auto;\n    }\n\n    .link-btn {\n      color: var(--accent);\n      text-decoration: none;\n      cursor: pointer;\n      font-weight: 500;\n    }\n\n    .link-btn:hover {\n      text-decoration: underline;\n    }\n\n    /* Timeline View */\n    .timeline {\n      display: flex;\n      flex-direction: column;\n      gap: 1rem;\n      position: relative;\n    }\n\n    .timeline-item {\n      background: var(--card-bg);\n      border: 1px solid var(--border);\n      border-radius: var(--radius);\n      padding: 1.25rem;\n      position: relative;\n    }\n\n    .timeline-header {\n      display: flex;\n      flex-wrap: wrap;\n      align-items: center;\n      justify-content: space-between;\n      gap: 0.5rem;\n      margin-bottom: 0.75rem;\n    }\n\n    .timeline-meta {\n      display: flex;\n      align-items: center;\n      gap: 0.5rem;\n      flex-wrap: wrap;\n    }\n\n    .project-tag {\n      background: rgba(88, 166, 255, 0.1);\n      color: var(--accent);\n      border: 1px solid rgba(88, 166, 255, 0.2);\n      padding: 0.15rem 0.5rem;\n      border-radius: 4px;\n      font-family: monospace;\n      font-size: 0.85rem;\n      cursor: pointer;\n    }\n\n    .time-stamp {\n      font-size: 0.8rem;\n      color: var(--text-muted);\n    }\n\n    .source-badge {\n      font-size: 0.75rem;\n      color: var(--text-muted);\n      background: rgba(255, 255, 255, 0.05);\n      padding: 0.1rem 0.4rem;\n      border-radius: 4px;\n    }\n\n    .entry-summary {\n      font-size: 1rem;\n      font-weight: 500;\n      color: var(--heading);\n      margin-bottom: 0.5rem;\n    }\n\n    .entry-progress {\n      font-size: 0.9rem;\n      color: var(--text);\n      margin-bottom: 0.75rem;\n    }\n\n    .section-box {\n      margin-top: 0.5rem;\n      font-size: 0.875rem;\n    }\n\n    .section-title {\n      font-weight: 600;\n      font-size: 0.8rem;\n      text-transform: uppercase;\n      margin-bottom: 0.25rem;\n      display: flex;\n      align-items: center;\n      gap: 0.25rem;\n    }\n\n    .section-title.blockers { color: var(--danger); }\n    .section-title.next-steps { color: var(--accent); }\n    .section-title.decisions { color: var(--purple); }\n\n    .bullet-list {\n      list-style: disc inside;\n      color: var(--text);\n      padding-left: 0.25rem;\n    }\n\n    .bullet-list li {\n      margin-bottom: 0.2rem;\n    }\n\n    .tags-container {\n      display: flex;\n      flex-wrap: wrap;\n      gap: 0.35rem;\n      margin-top: 0.75rem;\n    }\n\n    .pill-tag {\n      background: rgba(255, 255, 255, 0.06);\n      border: 1px solid var(--border);\n      color: var(--text-muted);\n      font-size: 0.75rem;\n      padding: 0.1rem 0.45rem;\n      border-radius: 12px;\n    }\n\n    .empty-state {\n      text-align: center;\n      padding: 3rem 1rem;\n      color: var(--text-muted);\n    }\n\n    .empty-state h3 {\n      color: var(--heading);\n      margin-bottom: 0.5rem;\n    }\n\n    .filter-bar {\n      display: flex;\n      align-items: center;\n      gap: 0.5rem;\n      margin-bottom: 1rem;\n      font-size: 0.875rem;\n      color: var(--text-muted);\n    }\n\n    .filter-chip {\n      background: rgba(88, 166, 255, 0.15);\n      color: var(--accent);\n      padding: 0.2rem 0.6rem;\n      border-radius: 12px;\n      display: inline-flex;\n      align-items: center;\n      gap: 0.3rem;\n    }\n\n    .filter-chip button {\n      background: none;\n      border: none;\n      color: var(--accent);\n      cursor: pointer;\n      font-weight: bold;\n    }";
+export declare const WEB_UI_STYLES = "    :root {\n      --bg: #0d1117;\n      --card-bg: #161b22;\n      --border: #30363d;\n      --text: #c9d1d9;\n      --text-muted: #8b949e;\n      --heading: #f0f6fc;\n      --accent: #58a6ff;\n      --accent-hover: #79c0ff;\n      --success: #3fb950;\n      --warning: #d29922;\n      --danger: #f85149;\n      --purple: #bc8cff;\n      --cyan: #39c5cf;\n      --radius: 8px;\n    }\n\n    * {\n      box-sizing: border-box;\n      margin: 0;\n      padding: 0;\n    }\n\n    body {\n      font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n      background-color: var(--bg);\n      color: var(--text);\n      line-height: 1.5;\n      padding: 0;\n      margin: 0;\n      min-height: 100vh;\n    }\n\n    header {\n      background-color: var(--card-bg);\n      border-bottom: 1px solid var(--border);\n      position: sticky;\n      top: 0;\n      z-index: 100;\n      padding: 1rem 1.5rem;\n    }\n\n    .header-container {\n      max-width: 1200px;\n      margin: 0 auto;\n      display: flex;\n      flex-wrap: wrap;\n      align-items: center;\n      justify-content: space-between;\n      gap: 1rem;\n    }\n\n    .brand {\n      display: flex;\n      align-items: center;\n      gap: 0.75rem;\n    }\n\n    .logo-icon {\n      width: 32px;\n      height: 32px;\n      background: linear-gradient(135deg, var(--accent), var(--purple));\n      border-radius: 8px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: #fff;\n      font-weight: bold;\n      font-size: 1.1rem;\n    }\n\n    h1 {\n      font-size: 1.25rem;\n      font-weight: 600;\n      color: var(--heading);\n    }\n\n    .header-right {\n      display: flex;\n      align-items: center;\n      gap: 0.75rem;\n      flex-wrap: wrap;\n    }\n\n    .stats-bar {\n      display: flex;\n      gap: 0.75rem;\n      flex-wrap: wrap;\n    }\n\n    .lang-switch {\n      display: inline-flex;\n      gap: 0.2rem;\n      background: var(--bg);\n      padding: 0.2rem;\n      border-radius: 6px;\n      border: 1px solid var(--border);\n    }\n\n    .lang-btn {\n      background: transparent;\n      border: none;\n      color: var(--text-muted);\n      padding: 0.25rem 0.65rem;\n      font-size: 0.8rem;\n      font-weight: 500;\n      border-radius: 4px;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .lang-btn:hover {\n      color: var(--heading);\n    }\n\n    .lang-btn.active {\n      background: var(--accent);\n      color: #ffffff;\n      font-weight: 600;\n    }\n\n    .stat-pill {\n      background: rgba(255, 255, 255, 0.05);\n      border: 1px solid var(--border);\n      border-radius: 20px;\n      padding: 0.25rem 0.75rem;\n      font-size: 0.85rem;\n      display: flex;\n      align-items: center;\n      gap: 0.35rem;\n    }\n\n    .stat-val {\n      font-weight: 600;\n      color: var(--heading);\n    }\n\n    .controls {\n      display: flex;\n      align-items: center;\n      gap: 0.75rem;\n      flex-wrap: wrap;\n      width: 100%;\n      max-width: 1200px;\n      margin: 1rem auto 0 auto;\n      padding: 0 1.5rem;\n    }\n\n    .search-box {\n      flex: 1;\n      min-width: 240px;\n      position: relative;\n    }\n\n    .search-input {\n      width: 100%;\n      background: var(--card-bg);\n      border: 1px solid var(--border);\n      color: var(--text);\n      padding: 0.5rem 0.75rem 0.5rem 2.25rem;\n      border-radius: var(--radius);\n      font-size: 0.9rem;\n      outline: none;\n      transition: border-color 0.2s;\n    }\n\n    .search-input:focus {\n      border-color: var(--accent);\n    }\n\n    .search-icon {\n      position: absolute;\n      left: 0.75rem;\n      top: 50%;\n      transform: translateY(-50%);\n      color: var(--text-muted);\n      pointer-events: none;\n      font-size: 0.85rem;\n    }\n\n    .nav-tabs {\n      display: flex;\n      gap: 0.5rem;\n      background: var(--card-bg);\n      padding: 0.25rem;\n      border-radius: var(--radius);\n      border: 1px solid var(--border);\n    }\n\n    .tab-btn {\n      background: transparent;\n      border: none;\n      color: var(--text-muted);\n      padding: 0.4rem 1rem;\n      font-size: 0.875rem;\n      font-weight: 500;\n      border-radius: 6px;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .tab-btn:hover {\n      color: var(--heading);\n    }\n\n    .tab-btn.active {\n      background: var(--accent);\n      color: #ffffff;\n    }\n\n    .btn[hidden] { display: none !important; }\n    .btn {\n      background: var(--card-bg);\n      border: 1px solid var(--border);\n      color: var(--text);\n      padding: 0.45rem 0.85rem;\n      border-radius: var(--radius);\n      font-size: 0.875rem;\n      cursor: pointer;\n      display: inline-flex;\n      align-items: center;\n      gap: 0.35rem;\n      transition: all 0.2s;\n    }\n\n    .btn:hover {\n      border-color: var(--text-muted);\n      color: var(--heading);\n    }\n\n    .btn-sm {\n      padding: 0.3rem 0.6rem;\n      font-size: 0.8rem;\n    }\n\n    .btn-primary {\n      background: var(--accent);\n      color: #ffffff;\n      border-color: var(--accent);\n      margin-top: 0.75rem;\n    }\n\n    .btn-primary:hover {\n      background: var(--accent-hover);\n      color: #ffffff;\n    }\n\n    main {\n      max-width: 1200px;\n      margin: 1.5rem auto;\n      padding: 0 1.5rem;\n    }\n\n    .view-panel {\n      display: none;\n    }\n\n    .view-panel.active {\n      display: block;\n    }\n\n    /* Activity Feed Toolbar & Grouping Toggle */\n    .activity-toolbar {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      gap: 1rem;\n      background: var(--card-bg);\n      border: 1px solid var(--border);\n      border-radius: var(--radius);\n      padding: 0.75rem 1rem;\n      margin-bottom: 1.25rem;\n      flex-wrap: wrap;\n    }\n\n    .date-picker-wrapper {\n      display: flex;\n      align-items: center;\n      gap: 0.6rem;\n      font-size: 0.9rem;\n      color: var(--heading);\n      font-weight: 500;\n      flex-wrap: wrap;\n    }\n\n    .date-input {\n      background: var(--bg);\n      border: 1px solid var(--border);\n      color: var(--heading);\n      padding: 0.35rem 0.65rem;\n      border-radius: 6px;\n      font-size: 0.875rem;\n      outline: none;\n      font-family: inherit;\n    }\n\n    .date-input:focus {\n      border-color: var(--accent);\n    }\n\n    .view-mode-toggle {\n      display: flex;\n      gap: 0.25rem;\n      background: var(--bg);\n      padding: 0.2rem;\n      border-radius: 6px;\n      border: 1px solid var(--border);\n    }\n\n    .mode-btn {\n      background: transparent;\n      border: none;\n      color: var(--text-muted);\n      padding: 0.3rem 0.75rem;\n      font-size: 0.8rem;\n      font-weight: 500;\n      border-radius: 4px;\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .mode-btn:hover {\n      color: var(--heading);\n    }\n\n    .mode-btn.active {\n      background: var(--accent);\n      color: #ffffff;\n      font-weight: 600;\n    }\n\n    /* Project Grouping Container */\n    .project-group-card {\n      background: var(--card-bg);\n      border: 1px solid var(--border);\n      border-radius: var(--radius);\n      padding: 1.25rem;\n      margin-bottom: 1.25rem;\n    }\n\n    .project-group-header {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      border-bottom: 1px solid var(--border);\n      padding-bottom: 0.75rem;\n      margin-bottom: 1rem;\n    }\n\n    .project-group-title {\n      display: flex;\n      align-items: center;\n      gap: 0.6rem;\n      font-size: 1.1rem;\n      font-weight: 600;\n      color: var(--heading);\n    }\n\n    .project-group-count {\n      font-size: 0.8rem;\n      color: var(--text-muted);\n      background: rgba(255, 255, 255, 0.06);\n      padding: 0.15rem 0.55rem;\n      border-radius: 12px;\n    }\n\n    /* Projects Grid */\n    .projects-grid {\n      display: grid;\n      grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));\n      gap: 1.25rem;\n    }\n\n    .project-card {\n      background: var(--card-bg);\n      border: 1px solid var(--border);\n      border-radius: var(--radius);\n      padding: 1.25rem;\n      display: flex;\n      flex-direction: column;\n      justify-content: space-between;\n      transition: transform 0.15s, border-color 0.15s;\n    }\n\n    .project-card:hover {\n      border-color: var(--text-muted);\n      transform: translateY(-2px);\n    }\n\n    .card-header {\n      display: flex;\n      align-items: flex-start;\n      justify-content: space-between;\n      gap: 0.75rem;\n      margin-bottom: 0.75rem;\n    }\n\n    .project-title {\n      font-size: 1.1rem;\n      font-weight: 600;\n      color: var(--heading);\n    }\n\n    .project-slug {\n      font-size: 0.8rem;\n      color: var(--text-muted);\n      font-family: monospace;\n    }\n\n    .completion-evidence { margin: 12px 0; line-height: 1.7; }\n    details > summary { cursor: pointer; margin: 12px 0; }\n    .status-badge {\n      font-size: 0.75rem;\n      font-weight: 600;\n      text-transform: uppercase;\n      padding: 0.2rem 0.55rem;\n      border-radius: 12px;\n      display: inline-block;\n      white-space: nowrap;\n    }\n\n    .status-active { background: rgba(63, 185, 80, 0.15); color: var(--success); border: 1px solid rgba(63, 185, 80, 0.3); }\n    .status-planned { background: rgba(88, 166, 255, 0.15); color: var(--accent); border: 1px solid rgba(88, 166, 255, 0.3); }\n    .status-idea { background: rgba(188, 140, 255, 0.15); color: var(--purple); border: 1px solid rgba(188, 140, 255, 0.3); }\n    .status-blocked { background: rgba(248, 81, 73, 0.15); color: var(--danger); border: 1px solid rgba(248, 81, 73, 0.3); }\n    .status-paused { background: rgba(210, 153, 34, 0.15); color: var(--warning); border: 1px solid rgba(210, 153, 34, 0.3); }\n    .status-completed { background: rgba(57, 197, 207, 0.15); color: var(--cyan); border: 1px solid rgba(57, 197, 207, 0.3); }\n    .status-archived { background: rgba(139, 148, 158, 0.15); color: var(--text-muted); border: 1px solid rgba(139, 148, 158, 0.3); }\n    .status-open { background: rgba(63, 185, 80, 0.15); color: var(--success); border: 1px solid rgba(63, 185, 80, 0.3); }\n    .status-cancelled { background: rgba(139, 148, 158, 0.15); color: var(--text-muted); border: 1px solid rgba(139, 148, 158, 0.3); }\n\n    .card-body {\n      margin-bottom: 1rem;\n      font-size: 0.9rem;\n    }\n\n    .card-description {\n      color: var(--text);\n      margin-bottom: 0.5rem;\n    }\n\n    .card-notes {\n      color: var(--text-muted);\n      font-size: 0.85rem;\n      font-style: italic;\n      border-left: 2px solid var(--border);\n      padding-left: 0.5rem;\n      margin-top: 0.5rem;\n    }\n\n    .latest-summary {\n      background: rgba(0, 0, 0, 0.2);\n      padding: 0.6rem;\n      border-radius: 6px;\n      margin-top: 0.75rem;\n      font-size: 0.85rem;\n    }\n\n    .latest-summary-title {\n      font-size: 0.75rem;\n      color: var(--text-muted);\n      text-transform: uppercase;\n      margin-bottom: 0.25rem;\n    }\n\n    .card-footer {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      font-size: 0.85rem;\n      color: var(--text-muted);\n      border-top: 1px solid var(--border);\n      padding-top: 0.75rem;\n      margin-top: auto;\n    }\n\n    .link-btn {\n      color: var(--accent);\n      text-decoration: none;\n      cursor: pointer;\n      font-weight: 500;\n    }\n\n    .link-btn:hover {\n      text-decoration: underline;\n    }\n\n    /* Timeline View */\n    .timeline {\n      display: flex;\n      flex-direction: column;\n      gap: 1rem;\n      position: relative;\n    }\n\n    .timeline-item {\n      background: var(--card-bg);\n      border: 1px solid var(--border);\n      border-radius: var(--radius);\n      padding: 1.25rem;\n      position: relative;\n    }\n\n    .timeline-header {\n      display: flex;\n      flex-wrap: wrap;\n      align-items: center;\n      justify-content: space-between;\n      gap: 0.5rem;\n      margin-bottom: 0.75rem;\n    }\n\n    .timeline-meta {\n      display: flex;\n      align-items: center;\n      gap: 0.5rem;\n      flex-wrap: wrap;\n    }\n\n    .project-tag {\n      background: rgba(88, 166, 255, 0.1);\n      color: var(--accent);\n      border: 1px solid rgba(88, 166, 255, 0.2);\n      padding: 0.15rem 0.5rem;\n      border-radius: 4px;\n      font-family: monospace;\n      font-size: 0.85rem;\n      cursor: pointer;\n    }\n\n    .time-stamp {\n      font-size: 0.8rem;\n      color: var(--text-muted);\n    }\n\n    .source-badge {\n      font-size: 0.75rem;\n      color: var(--text-muted);\n      background: rgba(255, 255, 255, 0.05);\n      padding: 0.1rem 0.4rem;\n      border-radius: 4px;\n    }\n\n    .entry-summary {\n      font-size: 1rem;\n      font-weight: 500;\n      color: var(--heading);\n      margin-bottom: 0.5rem;\n    }\n\n    .entry-progress {\n      font-size: 0.9rem;\n      color: var(--text);\n      margin-bottom: 0.75rem;\n    }\n\n    .section-box {\n      margin-top: 0.5rem;\n      font-size: 0.875rem;\n    }\n\n    .section-title {\n      font-weight: 600;\n      font-size: 0.8rem;\n      text-transform: uppercase;\n      margin-bottom: 0.25rem;\n      display: flex;\n      align-items: center;\n      gap: 0.25rem;\n    }\n\n    .section-title.blockers { color: var(--danger); }\n    .section-title.next-steps { color: var(--accent); }\n    .section-title.decisions { color: var(--purple); }\n\n    .bullet-list {\n      list-style: disc inside;\n      color: var(--text);\n      padding-left: 0.25rem;\n    }\n\n    .bullet-list li {\n      margin-bottom: 0.2rem;\n    }\n\n    .tags-container {\n      display: flex;\n      flex-wrap: wrap;\n      gap: 0.35rem;\n      margin-top: 0.75rem;\n    }\n\n    .pill-tag {\n      background: rgba(255, 255, 255, 0.06);\n      border: 1px solid var(--border);\n      color: var(--text-muted);\n      font-size: 0.75rem;\n      padding: 0.1rem 0.45rem;\n      border-radius: 12px;\n    }\n\n    .empty-state {\n      text-align: center;\n      padding: 3rem 1rem;\n      color: var(--text-muted);\n    }\n\n    .empty-state h3 {\n      color: var(--heading);\n      margin-bottom: 0.5rem;\n    }\n\n    .filter-bar {\n      display: flex;\n      align-items: center;\n      gap: 0.5rem;\n      margin-bottom: 1rem;\n      font-size: 0.875rem;\n      color: var(--text-muted);\n    }\n\n    .filter-chip {\n      background: rgba(88, 166, 255, 0.15);\n      color: var(--accent);\n      padding: 0.2rem 0.6rem;\n      border-radius: 12px;\n      display: inline-flex;\n      align-items: center;\n      gap: 0.3rem;\n    }\n\n    .filter-chip button {\n      background: none;\n      border: none;\n      color: var(--accent);\n      cursor: pointer;\n      font-weight: bold;\n    }";

package/dist/web/styles.js

@@ -426,6 +426,8 @@ export const WEB_UI_STYLES = `    :root {
     .status-paused { background: rgba(210, 153, 34, 0.15); color: var(--warning); border: 1px solid rgba(210, 153, 34, 0.3); }
     .status-completed { background: rgba(57, 197, 207, 0.15); color: var(--cyan); border: 1px solid rgba(57, 197, 207, 0.3); }
     .status-archived { background: rgba(139, 148, 158, 0.15); color: var(--text-muted); border: 1px solid rgba(139, 148, 158, 0.3); }
+    .status-open { background: rgba(63, 185, 80, 0.15); color: var(--success); border: 1px solid rgba(63, 185, 80, 0.3); }
+    .status-cancelled { background: rgba(139, 148, 158, 0.15); color: var(--text-muted); border: 1px solid rgba(139, 148, 158, 0.3); }
 
     .card-body {
       margin-bottom: 1rem;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "project-mgr",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "Local-first append-only project status ledger",
   "type": "module",
   "bin": {

package/skills/project-mgr/SKILL.md

@@ -64,8 +64,10 @@ pmgr list --query "keyword" --json
 pmgr serve --port 3000 --no-open --json
 
 # Record a completed milestone while the project remains active.
+# --next creates Todos and stores their UIDs on the snapshot. Reuse work with --next-todo.
 pmgr add --project my-project --status active --summary "Implemented the CLI" \
   --progress "Tests pass" --next "Publish the package" --source agent --json
+pmgr todos --project my-project --status open --json
 
 # Same project, with a tag naming the sub-project this snapshot covers.
 pmgr add --project acme --status active --summary "Shipped the web dashboard" \
@@ -92,4 +94,4 @@ When this update resolves all commitments of earlier entries (including blockers
 
 Use `complete --entry <id-or-uid> --by <id-or-uid> --source agent` for an existing follow-up. Use `revoke-completion --entry <id-or-uid> --by <id-or-uid> --reason "..." --source agent` to correct a mistaken link. Links require the same project and strictly increasing occurrence times. Query the affected history afterward to verify effective completion. Do not bulk-close old entries without evidence.
 
-Export produces version-2 bundles (one bundle per line for JSONL), preserving entry/event identities and audit history; legacy imports remain supported. `at` has no completion annotations. Project current state still comes from the latest snapshot.
+Export produces a version-2 bundle when there are no Todos or refs, version 3 when Todos exist without refs, and version 4 when snapshots store `nextTodoUids` (one bundle per line for JSONL). Legacy imports remain supported and do not create Todos. Open work is `todos --status open`; current `nextTodoUids` only order that project's open items. Do not combine `--next` with `--next-todo`. Repeating `--next` text on a later snapshot creates a new Todo; pass existing UIDs to keep the same work. Cancelling or completing a Todo is `todo-update`, not deleting text from a snapshot. `at` has no completion annotations and does not resolve live Todo status. Project current state still comes from the latest snapshot.