huddle-cli 0.1.0 → 0.1.1

package/dist/ui/story.js

@@ -13,7 +13,7 @@
 //   huddle story --html out.html  a self-contained static report (lanes, threads)
 import fs from "node:fs";
 import path from "node:path";
-import { C, dot, pad, AGENT_COLOR } from "./term.js";
+import { C, dot, pad, truncate, AGENT_COLOR } from "./term.js";
 import { fmtDuration, fmtTokens } from "../adapters/usage.js";
 import { isHelpOffer } from "../room/progress.js";
 /** The scheduler's own event types, persisted as "run.<type>" (scheduler.ts). */
@@ -118,7 +118,8 @@ export function splitRuns(raw) {
     });
     const chunks = starts.map((s, k) => evs.slice(s, k + 1 < starts.length ? starts[k + 1] : evs.length));
     // The design talk happens before the board is cleared: move it forward.
-    const isDesign = (e) => e.type.startsWith("council.");
+    // So is what the user put on the shared screen just before typing the goal.
+    const isDesign = (e) => e.type.startsWith("council.") || e.type === "context.added";
     const before = evs.slice(0, starts[0]).filter(isDesign);
     chunks[0] = [...before, ...chunks[0]];
     for (let k = 1; k < chunks.length; k++) {
@@ -173,9 +174,23 @@ export function buildStory(run, runs = 1) {
     const plan = { tasks: [] };
     const open = new Map(); // agent -> its open span
     const councilTasks = [];
+    const collab = { adopts: [], flaws: [], ratify: [], objections: [], amendments: [], radar: [], buddy: [], followups: [], bugs: [], pairs: [], credit: new Map() };
+    const mergedTitles = [];
+    const screen = new Map();
+    const onScreen = (p) => {
+        const id = pick(p, "id");
+        if (!screen.has(id))
+            screen.set(id, { id, kind: pick(p, "kind"), title: pick(p, "title"), by: "", size: "", readers: [], notes: [] });
+        const e = screen.get(id);
+        if (!e.title)
+            e.title = pick(p, "title");
+        if (!e.kind)
+            e.kind = pick(p, "kind");
+        return e;
+    };
     let merged = 0;
     let failed = 0;
-    // The brain that settles a council plan (a label like "claude · sonnet") is not an agent on the crew.
+    // The brain that settles a council plan (a label like "claude · opus") is not an agent on the crew.
     const working = new Set(run.events.filter((e) => e.type === "run.start" || e.type === "agent.joined").map((e) => e.agent));
     const brains = new Set(run.events.filter((e) => e.type === "council.plan").map((e) => pick(e.p, "by")).filter((b) => b && !working.has(b)));
     const isAgent = (a) => !!a && !NOT_AGENTS.has(a) && !brains.has(a);
@@ -258,6 +273,35 @@ export function buildStory(run, runs = 1) {
             case "plug.call":
                 st(e.agent).toolCalls++;
                 break;
+            case "context.added": {
+                const x = onScreen(p);
+                x.by = pick(p, "by") || "you";
+                x.size = Number(p.lines) ? `${p.lines} lines` : Number(p.bytes) ? `${Math.max(1, Math.round(Number(p.bytes) / 1024))} KB` : "";
+                add({ ts, kind: "team", type: e.type, agent: isAgent(x.by) ? x.by : null, text: `📎 ${isAgent(x.by) ? "" : x.by + " "}put ${x.id} ${q(x.title)} on the shared screen${x.size ? " (" + x.size + ")" : ""}` });
+                break;
+            }
+            case "context.read": {
+                const x = onScreen(p);
+                const who = e.agent ?? pick(p, "by");
+                if (who && !x.readers.includes(who)) {
+                    x.readers.push(who);
+                    // First read of each item by each agent: the proof that they looked at the screen.
+                    add({ ts, kind: "progress", type: e.type, agent: who, text: `📖 read ${x.id} ${q(x.title)}${p.from ? ` (lines ${p.from}-${p.to})` : ""}` });
+                }
+                break;
+            }
+            case "context.note": {
+                const x = onScreen(p);
+                const who = pick(p, "by") || e.agent || "you";
+                x.notes.push({ by: who, body: pick(p, "body") });
+                add({ ts, kind: "message", type: e.type, agent: isAgent(who) ? who : null, text: `📌 on ${x.id} ${q(x.title)}: ${oneLine(pick(p, "body"), 300)}${isAgent(who) ? "" : ` (${who})`}` });
+                break;
+            }
+            case "context.removed":
+                onScreen(p).removed = true;
+                break;
+            case "context.search":
+                break;
             case "plan.made":
                 plan.by = pick(p, "by") || plan.by;
                 plan.note = pick(p, "note") || plan.note;
@@ -358,6 +402,18 @@ export function buildStory(run, runs = 1) {
                 // Huddle's automatic help offer, sent in a free agent's name: a board event,
                 // not a message the agent wrote. Found live (capstone round 2): 6 offers
                 // and no real message, yet the table said claude sent 3 messages.
+                // The radar's mail: the run.radar item already tells it, once per finding.
+                if (from === "huddle" && /^Huddle radar:/.test(pick(p, "body")))
+                    break;
+                // Buddy notes and contract broadcasts: run.checkpoint / contract.amended tell them once.
+                if (from === "huddle" && /^buddy check from /.test(pick(p, "body")))
+                    break;
+                if (/^contract v\d+ by /.test(pick(p, "body")))
+                    break;
+                if (from === "huddle" && / is taking “.*” \(files .*\) in \d+s unless you reply/.test(pick(p, "body"))) {
+                    add({ ts, kind: "takeover", type: "pair.proposed", agent: null, to, text: `proposes: ${oneLine(pick(p, "body").split(" unless you reply")[0], 200)} (${to} may say no)` });
+                    break;
+                }
                 if (isHelpOffer(from, pick(p, "body"))) {
                     const t = /your task "(.*)" \(/.exec(pick(p, "body"))?.[1];
                     add({ ts, kind: "task", type: "offer", agent: from, to, text: `is free: Huddle offers ${to} help${t ? ` with ${q(t)}` : ""} (huddle_split to hand off a part)` });
@@ -486,6 +542,7 @@ export function buildStory(run, runs = 1) {
                 merged++;
                 if (/^Fix: /.test(title(e.task, p)))
                     s.bugsFixed++; // a QA bug's fix task landed
+                mergedTitles.push({ title: title(e.task, p), agent: a });
                 close(a, ts, "ok");
                 add({ ts, kind: "merge", type: e.type, agent: a, text: `✓ merged ${q(title(e.task, p))}`, detail: [pick(p, "reason"), p.ms ? fmtDuration(Number(p.ms)) : "", p.tokens ? fmtTokens(Number(p.tokens)) + " tok" : ""].filter(Boolean).join(" · ") });
                 break;
@@ -530,7 +587,11 @@ export function buildStory(run, runs = 1) {
                 const a = pick(p, "agent", "from", "by", "critic") || e.agent;
                 const of = pick(p, "of", "target", "to", "author");
                 st(a).critiques++;
-                const it = { ts, kind: "design", type: e.type, agent: a, to: of || null, text: `critiques ${of ? of + "'s proposal" : "the proposals"}: ${oneLine(pick(p, "body", "critique", "text", "summary", "flaws"), 300)}` };
+                // Council v2: the ADOPT / FLAW lines get their own items (council.adopt / .flaw); here, just where it landed.
+                const revised = Array.isArray(p.adopts) || Array.isArray(p.flaws) ? /REVISED\W*:?\s*([\s\S]*)$/i.exec(pick(p, "text"))?.[1] : undefined;
+                const it = revised
+                    ? { ts, kind: "design", type: e.type, agent: a, to: null, text: `revised position: ${oneLine(revised, 300)}` }
+                    : { ts, kind: "design", type: e.type, agent: a, to: of || null, text: `critiques ${of ? of + "'s proposal" : "the proposals"}: ${oneLine(pick(p, "body", "critique", "text", "summary", "flaws"), 300)}` };
                 add(it);
                 talked(a, of);
                 thread(it);
@@ -541,7 +602,19 @@ export function buildStory(run, runs = 1) {
                 plan.by = plan.by ?? (by ? `${by} (council)` : "council");
                 const tasks = Array.isArray(p.tasks) ? p.tasks : [];
                 councilTasks.push(...tasks);
-                add({ ts, kind: "design", type: e.type, agent: by, text: `settles the plan${tasks.length || p.tasks ? `: ${tasks.length || str(p.tasks)} task(s)` : ""}${pick(p, "summary", "note") ? " · " + oneLine(pick(p, "summary", "note"), 200) : ""}` });
+                const sy = p.synthesizer && typeof p.synthesizer === "object" ? p.synthesizer : null;
+                if (sy)
+                    collab.synthesizer = { id: str(sy.id), kind: str(sy.kind), why: str(sy.why) };
+                for (const o of Array.isArray(p.objections) ? p.objections : [])
+                    collab.objections.push({ by: str(o?.by), objection: str(o?.objection), taken: o?.taken === true });
+                add({
+                    ts,
+                    kind: "design",
+                    type: e.type,
+                    agent: by,
+                    text: `writes the plan${tasks.length || p.tasks ? `: ${tasks.length || str(p.tasks)} task(s)` : ""}${sy?.why ? ` · ${sy.kind === "agent" ? "chosen" : "brain"}: ${oneLine(str(sy.why), 160)}` : ""}${pick(p, "summary", "note") ? " · " + oneLine(pick(p, "summary", "note"), 200) : ""}`,
+                    detail: collab.objections.length ? collab.objections.map((o) => `${o.taken ? "✓ took" : "✗ kept as is"} ${o.by}'s objection: ${oneLine(o.objection, 120)}`).join("\n") : undefined,
+                });
                 break;
             }
             case "task.takeover": {
@@ -564,6 +637,19 @@ export function buildStory(run, runs = 1) {
                 break;
             case "offer": // the help offer itself is an agent.message in the busy agent's inbox
                 break;
+            case "radar.finding": // the Room's copy of run.radar
+                break;
+            case "radar.stats": {
+                const prev = collab.radarLooks ?? { ticks: 0, looks: 0, pairs: 0 };
+                collab.radarLooks = { ticks: prev.ticks + (Number(p.ticks) || 0), looks: prev.looks + (Number(p.looks) || 0), pairs: prev.pairs + (Number(p.pairs) || 0) };
+                break;
+            }
+            case "radar": {
+                const w = pick(p, "with");
+                collab.radar.push({ agent: e.agent ?? pick(p, "agent"), with: w, kind: pick(p, "kind"), detail: pick(p, "detail") });
+                add({ ts, kind: "conflict", type: e.type, agent: e.agent, to: w && w !== "contract" ? w : null, text: `⚠ radar: ${pick(p, "kind") === "overlap" ? "overlap" : "name mismatch"}${w ? ` with ${w}` : ""} · told mid-task`, detail: oneLine(pick(p, "detail"), 300) || undefined });
+                break;
+            }
             case "takeover": {
                 if (roomTakeovers) {
                     // The first agent's time and tokens on the task it handed over.
@@ -591,6 +677,95 @@ export function buildStory(run, runs = 1) {
                 add({ ts, kind: "takeover", type: e.type, agent: from, text: `✂ splits ${q(title(e.task, p))} into ${names.length || "?"} part(s)${to.length ? " → " + to.join(", ") : ""}`, detail: names.join(" · ") || oneLine(pick(p, "reason"), 200) || undefined });
                 break;
             }
+            case "checkpoint": {
+                // A buddy check: another agent read the author's work in progress.
+                const a = pick(p, "agent") || e.agent;
+                const author = pick(p, "author");
+                const notes = pick(p, "notes");
+                const ok = !notes || /^LOOKS GOOD/i.test(notes.trim());
+                const late = !ok && !!p.late;
+                collab.buddy.push({ agent: a ?? "", author, pct: Number(p.pct) || 0, notes: ok ? "" : notes, ...(late ? { late } : {}) });
+                const it = { ts, kind: "review", type: e.type, agent: a, to: author || null, text: `◎ buddy check on ${author}'s ${q(title(e.task, p))} ${Number(p.pct) ? `at ${str(p.pct)}%` : "mid-task"}: ${ok ? "looks good" : late ? "notes came back after it landed (kept in shared memory)" : "notes sent mid-task"}`, detail: ok ? undefined : oneLine(notes, 400) };
+                add(it);
+                if (!ok) {
+                    talked(a, author);
+                    thread(it);
+                }
+                break;
+            }
+            // A note that needed an answer, settled when its task finished (src/room/followup.ts).
+            case "note.closed": {
+                const to = pick(p, "to") || e.agent || "";
+                const by = pick(p, "by");
+                const how = pick(p, "how") || "ignored";
+                const kind = pick(p, "kind") || "buddy";
+                collab.followups.push({ to, by, kind, how, note: pick(p, "body"), ...(title(e.task) ? { task: title(e.task) } : {}) });
+                const what = kind === "radar" ? "the radar's finding" : `${by}'s buddy note`;
+                const verb = how === "replied" ? "answers" : "addresses (in code)";
+                add({
+                    ts,
+                    kind: how === "ignored" ? "fail" : "review",
+                    type: e.type,
+                    agent: to || null,
+                    to: kind === "radar" ? null : by || null,
+                    text: how === "ignored" ? `${kind === "radar" ? "radar finding" : "buddy note"} ignored: ${kind === "radar" ? "" : `${by}'s note `}on ${q(title(e.task))} got no answer` : `${verb} ${what} on ${q(title(e.task))}`,
+                    detail: oneLine(pick(p, "body"), 300) || undefined,
+                });
+                break;
+            }
+            case "followup": // the scheduler's copy of note.closed
+            case "note.open": // the note itself is an agent.message; run.checkpoint / run.radar tell it
+            case "buddy.start":
+            case "buddy.end":
+                break;
+            case "done.refused": {
+                const a = e.agent;
+                add({ ts, kind: "review", type: e.type, agent: a, text: `huddle_done refused once: ${list(p.notes).length || "some"} teammate note(s) on ${q(title(e.task))} had no answer yet` });
+                break;
+            }
+            case "pair.dropped": {
+                const w = pick(p, "with");
+                add({ ts, kind: "takeover", type: e.type, agent: e.agent, to: w || null, text: `⇉ offered to pair with ${w} on ${q(title(e.task, p))} · dropped`, detail: oneLine(pick(p, "reason"), 200) || undefined });
+                break;
+            }
+            case "pair": {
+                const a = pick(p, "agent") || e.agent;
+                const w = pick(p, "with");
+                collab.pairs.push({ agent: a ?? "", with: w, part: pick(p, "part") });
+                add({ ts, kind: "takeover", type: e.type, agent: a, to: w || null, text: `⇉ pairs with ${w} on ${q(title(e.task, p))}: takes ${oneLine(pick(p, "part"), 160)}`, detail: oneLine(pick(p, "reason"), 200) || undefined });
+                talked(a, w);
+                break;
+            }
+            case "council.adopt":
+            case "council.flaw": {
+                // Cross-review: what one agent took from (or found wrong in) another's proposal.
+                const a = pick(p, "agent") || e.agent;
+                const of = pick(p, "of");
+                const it = { ts, kind: "design", type: e.type, agent: a, to: of || null, text: `${e.type === "council.adopt" ? "adopts" : "finds a flaw in"} ${of}'s idea: ${oneLine(pick(p, "body", "text"), 300)}` };
+                add(it);
+                talked(a, of);
+                (e.type === "council.adopt" ? collab.adopts : collab.flaws).push({ by: a ?? "", of, text: pick(p, "body", "text") });
+                break;
+            }
+            case "council.ratify": {
+                const a = pick(p, "agent") || e.agent;
+                const obj = list(p.objections);
+                collab.ratify.push({ agent: a ?? "", verdict: pick(p, "verdict") || (obj.length ? "object" : "ok"), objections: obj });
+                add({ ts, kind: "design", type: e.type, agent: a, text: obj.length ? `objects to the contract: ${oneLine(obj.join(" · "), 300)}` : `ratifies the contract${pick(p, "verdict") === "unclear" ? " (no clear verdict)" : ""}` });
+                break;
+            }
+            case "contract.set":
+                if (pick(p, "text"))
+                    collab.contract = { by: pick(p, "by") || e.agent || "council", chars: str(p.text).length };
+                if (pick(p, "text"))
+                    add({ ts, kind: "design", type: e.type, agent: pick(p, "by") || e.agent, text: `writes the contract (${str(p.text).length} chars): the names every task codes to` });
+                break;
+            case "contract.amended":
+                collab.amendments.push({ by: pick(p, "by") || e.agent || "?", version: Number(p.version) || 0, change: `${pick(p, "section")}: ${pick(p, "change")}` });
+                add({ ts, kind: "other", type: e.type, agent: pick(p, "by") || e.agent, text: `amends the contract (v${str(p.version)}): ${oneLine(`${pick(p, "section")}: ${pick(p, "change")}`, 200)}`, detail: oneLine(pick(p, "why"), 200) || undefined });
+                break;
+            case "run.contract": // the Room's contract.amended says the same
+                break;
             case "council.skipped": {
                 const a = pick(p, "agent") || e.agent;
                 add({ ts, kind: "design", type: e.type, agent: a, text: `${pick(p, "round") || "council"} skipped (${pick(p, "reason") || "no answer"})` });
@@ -616,7 +791,7 @@ export function buildStory(run, runs = 1) {
                 const a = pick(p, "agent", "by", "checker") || list(p.agents)[0] || e.agent;
                 if (isAgent(a))
                     begin({ agent: a, from: ts, kind: "qa", label: "QA" });
-                add({ ts, kind: "qa", type: e.type, agent: a, text: `⌕ QA round${p.round !== undefined ? " " + str(p.round) : ""} on the integrated main${list(p.agents).length ? ` · checked by ${list(p.agents).join(", ")} ${qaEyes(list(p.agents), p.authors)}` : ""}`, detail: oneLine(pick(p, "summary", "checks", "note"), 200) || undefined });
+                add({ ts, kind: "qa", type: e.type, agent: a, text: `◎ QA round${p.round !== undefined ? " " + str(p.round) : ""} on the integrated main${list(p.agents).length ? ` · checked by ${list(p.agents).join(", ")} ${qaEyes(list(p.agents), p.authors)}` : ""}`, detail: oneLine(pick(p, "summary", "checks", "note"), 200) || undefined });
                 break;
             }
             case "qa.bug": {
@@ -625,10 +800,14 @@ export function buildStory(run, runs = 1) {
                 if (isAgent(a))
                     close(a, ts, "warn");
                 const owner2 = pick(p, "to", "owner", "assigned_to", "author");
-                add({ ts, kind: "qa", type: e.type, agent: a, to: owner2 || null, text: `🐞 bug: ${oneLine(pick(p, "title", "summary", "bug", "body"), 200)}${owner2 ? ` → ${owner2}` : ""}`, detail: oneLine(pick(p, "details", "repro", "spec", "body"), 300) || undefined });
+                collab.bugs.push({ by: a ?? "", to: owner2, title: pick(p, "title", "summary", "bug", "body") });
+                add({ ts, kind: "qa", type: e.type, agent: a, to: owner2 || null, text: `✗ QA found: ${oneLine(pick(p, "title", "summary", "bug", "body"), 200)}${owner2 ? ` → fix by ${owner2}` : ""}`, detail: oneLine(pick(p, "details", "repro", "spec", "body"), 300) || undefined });
                 talked(a, owner2);
                 break;
             }
+            case "qa.suspect":
+                add({ ts, kind: "qa", type: e.type, agent: null, text: `? QA round ${str(p.round)} clean, but quick · ${str(p.reason)}` });
+                break;
             case "qa.unchecked":
                 add({ ts, kind: "qa", type: e.type, agent: null, text: `! QA round ${str(p.round)}: the build was NOT checked · ${str(p.reason) || "no check finished"}` });
                 break;
@@ -643,7 +822,10 @@ export function buildStory(run, runs = 1) {
             case "qa.fix": {
                 const a = pick(p, "agent", "by", "fixed_by") || e.agent;
                 st(a).bugsFixed++;
-                add({ ts, kind: "qa", type: e.type, agent: a, text: `🔧 fixed: ${oneLine(pick(p, "title", "summary", "bug", "body") || title(e.task), 200)}` });
+                const fixed = collab.bugs.find((b) => !b.fixedBy && b.title === (pick(p, "title", "summary", "bug", "body") || title(e.task)));
+                if (fixed && a)
+                    fixed.fixedBy = a;
+                add({ ts, kind: "qa", type: e.type, agent: a, text: `✓ fixed: ${oneLine(pick(p, "title", "summary", "bug", "body") || title(e.task), 200)}` });
                 break;
             }
             default: {
@@ -663,14 +845,169 @@ export function buildStory(run, runs = 1) {
     }
     for (const a of [...open.keys()])
         close(a, run.end);
+    // A QA bug is fixed when its "Fix: <title>" task merged (the title may be cut on the board).
+    for (const b of collab.bugs) {
+        const want = oneLine(b.title, 60).replace(/…$/, "");
+        const hit = mergedTitles.find((m) => m.title.startsWith("Fix: ") && m.title.slice(5).startsWith(want.slice(0, 40)));
+        if (hit)
+            b.fixedBy = hit.agent;
+    }
     // Who proposed what: a council plan's tasks may say whose idea each one was.
     for (const t of councilTasks) {
         const pt = plan.tasks.find((x) => x.title === pick(t ?? {}, "title"));
-        const who = list((t ?? {}).proposed_by ?? (t ?? {}).by ?? (t ?? {}).from ?? (t ?? {}).author).join(", ");
+        const from = list((t ?? {}).proposed_by ?? (t ?? {}).by ?? (t ?? {}).from ?? (t ?? {}).author);
+        const primary = pick(t ?? {}, "primary") || from[0] || "";
+        if (primary)
+            collab.credit.set(primary, (collab.credit.get(primary) ?? 0) + 1);
+        const rest = from.filter((x) => x !== primary);
+        const who = primary ? `${primary}${rest.length ? ` (with ${rest.join(", ")})` : ""}` : "";
         if (pt && who && !pt.by)
             pt.by = who;
     }
-    return { run, runs, agents, plan, design, items, spans, stats, talk, threads, merged, failed };
+    return { run, runs, agents, plan, design, items, spans, stats, talk, threads, screen: [...screen.values()], merged, failed, collab };
+}
+// ---- teamwork summary (terminal + HTML) -------------------------------------------
+/** The run's collaboration as labelled lines; [] when nobody worked with anybody. */
+export function collabLines(s) {
+    const c = s.collab;
+    const out = [];
+    const n = (k, one, many = one + "s") => `${k} ${k === 1 ? one : many}`;
+    for (const a of c.adopts.slice(0, 6))
+        out.push({ label: "adopted", text: `${a.by} took ${a.of}'s idea: ${oneLine(a.text, 110)}` });
+    if (c.adopts.length > 6)
+        out.push({ label: "adopted", text: `…and ${c.adopts.length - 6} more` });
+    for (const f of c.flaws.slice(0, 6))
+        out.push({ label: "flaw", text: `${f.by} on ${f.of}'s idea: ${oneLine(f.text, 110)}` });
+    if (c.flaws.length > 6)
+        out.push({ label: "flaw", text: `…and ${c.flaws.length - 6} more` });
+    if (c.synthesizer)
+        out.push({ label: "plan by", text: `${c.synthesizer.id}${c.synthesizer.why ? ` — ${oneLine(c.synthesizer.why, 110)}` : ""}` });
+    if (c.ratify.length) {
+        const ok = c.ratify.filter((r) => r.verdict !== "object").map((r) => r.agent);
+        const obj = c.ratify.filter((r) => r.verdict === "object");
+        out.push({ label: "ratify", text: [ok.length ? `${ok.join(", ")} ok` : "", ...obj.map((r) => `${r.agent} objects: ${oneLine(r.objections.join(" · "), 90)}`)].filter(Boolean).join(" · ") });
+    }
+    for (const o of c.objections.slice(0, 4))
+        out.push({ label: "revision", text: `${o.taken ? "took" : "kept the plan over"} ${o.by}'s objection: ${oneLine(o.objection, 100)}` });
+    if (c.contract || c.amendments.length) {
+        const v = c.amendments.length ? Math.max(...c.amendments.map((a) => a.version)) : 1;
+        out.push({ label: "contract", text: `v${v}${c.contract ? ` · written by ${c.contract.by}` : " · started mid-run"} · ${n(c.amendments.length, "amendment")}` });
+        for (const a of c.amendments.slice(-4))
+            out.push({ label: "", text: `v${a.version} ${a.by}: ${oneLine(a.change, 110)}` });
+    }
+    if (!c.radar.length && c.radarLooks?.looks)
+        out.push({ label: "radar", text: `no catches · compared 2+ agents' work in progress ${n(c.radarLooks.looks, "time")} (${n(c.radarLooks.pairs, "pair")})` });
+    if (c.radar.length) {
+        out.push({ label: "radar", text: `${n(c.radar.length, "catch", "catches")} while agents worked` });
+        for (const r of c.radar.slice(0, 4))
+            out.push({ label: "", text: `${r.kind === "overlap" ? "overlap" : "mismatch"} ${r.agent} ↔ ${r.with}: ${oneLine(r.detail, 100)}` });
+    }
+    if (c.buddy.length) {
+        const sent = c.buddy.filter((b) => b.notes);
+        const late = sent.filter((b) => b.late).length;
+        out.push({ label: "buddy", text: `${n(c.buddy.length, "check")} mid-task · ${n(sent.length, "note")} sent${late ? ` (${late} came back after the task landed)` : ""}` });
+        for (const b of sent.slice(0, 4))
+            out.push({ label: "", text: `${b.agent} → ${b.author} at ${b.pct}%: ${oneLine(b.notes, 100)}` });
+    }
+    if (c.followups.length) {
+        const k = (h) => c.followups.filter((f) => f.how === h).length;
+        const ignored = c.followups.filter((f) => f.how === "ignored");
+        out.push({ label: "answered", text: `${n(c.followups.length - ignored.length, "note")} addressed (${k("fixed")} fixed, ${k("replied")} replied) · ${ignored.length} ignored` });
+        for (const f of ignored.slice(0, 4))
+            out.push({ label: "", text: `ignored by ${f.to}: ${f.kind === "radar" ? "radar" : f.by}: ${oneLine(f.note.replace(/^buddy check from [^:]*:\s*/i, ""), 100)}` });
+    }
+    for (const p of c.pairs.slice(0, 4))
+        out.push({ label: "pair", text: `${p.agent} helped ${p.with}: ${oneLine(p.part, 110)}` });
+    if (c.credit.size && (c.adopts.length || c.credit.size > 1))
+        out.push({ label: "credit", text: [...c.credit.entries()].sort((a, b) => b[1] - a[1]).map(([a, k]) => `${a} ${n(k, "task")}`).join(" · ") });
+    return out;
+}
+function crewRows(s) {
+    const done = s.items.filter((it) => it.type === "qa.done");
+    return s.agents.map((a) => {
+        const x = s.stats.get(a);
+        const qa = done.length ? done.filter((it) => it.agent === a).length : s.items.filter((it) => it.type === "qa.round" && it.agent === a).length;
+        return { agent: a, merged: x.merged, failed: x.failed, reviews: x.reviews, qa, ms: x.ms, tokens: x.tokens, cached: x.cached };
+    });
+}
+const plural = (k, one, many = one + "s") => `${k} ${k === 1 ? one : many}`;
+/** "5 merged · 3 reviews · 1 QA" — what an agent did, nothing for what it didn't. */
+function didLine(c) {
+    const parts = [`${c.merged} merged`, c.failed ? `${c.failed} failed` : "", c.reviews ? plural(c.reviews, "review") : "", c.qa ? `${c.qa} QA` : ""];
+    return parts.filter(Boolean).join(" · ");
+}
+/** The run cut into its phases: the build, then QA (from the first QA round on). */
+function phases(s) {
+    // The council's decisions and risks, written to shared memory as the build starts: part of the plan.
+    const agreed = s.items.filter((it) => it.agent === "council" && it.type === "memory.added");
+    const rest = s.items.filter((it) => !agreed.includes(it));
+    const i = rest.findIndex((it) => it.type === "qa.round");
+    return i < 0 ? { agreed, build: rest, qa: [] } : { agreed, build: rest.slice(0, i), qa: rest.slice(i) };
+}
+/** A council decision or risk from shared memory, as "decided" / "risk (by)". */
+function agreement(it) {
+    const risk = /^gotcha: council risk:/.test(it.text);
+    return { risk, by: risk ? /flagged by (\S+)/.exec(it.detail ?? "")?.[1] : undefined, body: it.text.replace(/^\w+: council( risk)?:\s*/, "") };
+}
+/** The council is recorded in one go when it's done: its items share one instant, so they get no clock. */
+const councilInstant = (s) => s.design.length > 1 && s.design.at(-1).ts - s.design[0].ts < 2000;
+/** How the run ended: totals, merges gated on tests, QA's last word. */
+function outcome(s) {
+    const rows = crewRows(s);
+    const tokens = rows.reduce((n, c) => n + c.tokens, 0);
+    const cached = rows.reduce((n, c) => n + c.cached, 0);
+    const merges = s.items.filter((it) => it.type === "run.merged");
+    const green = merges.filter((it) => /tests? (green|pass)/i.test(it.detail ?? "")).length;
+    const last = [...s.items].reverse().find((it) => ["qa.clean", "qa.capped", "qa.unchecked"].includes(it.type));
+    const qa = last ? { text: last.text.replace(/^[✓!]\s*/, ""), tone: last.type === "qa.clean" ? "ok" : "warn" } : null;
+    const rounds = s.items.filter((it) => it.type === "qa.round").length;
+    return { tokens, cached, merges: merges.length, green, qa, rounds, ms: s.run.end - s.run.start };
+}
+/** The teamwork as numbers, for the summary line and the HTML tiles. Only what happened (or was looked for). */
+function tally(s) {
+    const c = s.collab;
+    const out = [];
+    if (c.adopts.length || c.flaws.length) {
+        out.push({ n: String(c.adopts.length), label: c.adopts.length === 1 ? "idea adopted" : "ideas adopted", tone: "ok" });
+        out.push({ n: String(c.flaws.length), label: c.flaws.length === 1 ? "flaw flagged" : "flaws flagged" });
+    }
+    if (c.objections.length)
+        out.push({ n: `${c.objections.filter((o) => o.taken).length}/${c.objections.length}`, label: "objections taken", tone: "ok" });
+    if (c.contract || c.amendments.length) {
+        const v = c.amendments.length ? Math.max(...c.amendments.map((a) => a.version)) : 1;
+        out.push({ n: `v${v}`, label: `contract, ${plural(c.amendments.length, "amendment")}`, text: `contract v${v} (${plural(c.amendments.length, "amendment")})` });
+    }
+    if (c.buddy.length)
+        out.push({ n: String(c.buddy.length), label: `buddy checks, ${plural(c.buddy.filter((b) => b.notes).length, "note")}` });
+    if (c.followups.length) {
+        const ignored = c.followups.filter((f) => f.how === "ignored").length;
+        out.push({ n: `${c.followups.length - ignored}/${c.followups.length}`, label: "notes answered", tone: ignored ? "warn" : "ok" });
+    }
+    if (c.radar.length || c.radarLooks?.looks)
+        out.push({ n: String(c.radar.length), label: c.radar.length === 1 ? "radar catch" : "radar catches", tone: c.radar.length ? "warn" : undefined });
+    if (c.pairs.length)
+        out.push({ n: String(c.pairs.length), label: c.pairs.length === 1 ? "pair" : "pairs" });
+    if (c.bugs.length) {
+        const fixed = c.bugs.filter((b) => b.fixedBy).length;
+        out.push({ n: `${c.bugs.length}→${fixed}`, label: "QA bugs → fixed", tone: fixed === c.bugs.length ? "ok" : "warn", text: `${plural(c.bugs.length, "QA bug")}, ${fixed} fixed` });
+    }
+    const msgs = [...s.stats.values()].reduce((n, x) => n + x.sent, 0);
+    if (msgs)
+        out.push({ n: String(msgs), label: msgs === 1 ? "message between agents" : "messages between agents" });
+    return out;
+}
+/** Each buddy note with how it ended: fixed in code, answered, ignored — or just sent. */
+function buddyNotes(s) {
+    const left = s.collab.followups.filter((f) => f.kind !== "radar");
+    return s.collab.buddy
+        .filter((b) => b.notes)
+        .map((b) => {
+        const i = left.findIndex((f) => f.by === b.agent && f.to === b.author);
+        const f = i >= 0 ? left.splice(i, 1)[0] : undefined;
+        const how = f ? (f.how === "ignored" ? "ignored" : f.how === "replied" ? "answered" : "fixed in code") : b.late ? "came back late" : "sent";
+        const tone = f ? (f.how === "ignored" ? "bad" : "ok") : b.late ? "warn" : "";
+        return { ...b, how, tone };
+    });
 }
 // ---- terminal -----------------------------------------------------------------
 const clock = (ms) => {
@@ -678,13 +1015,13 @@ const clock = (ms) => {
     return `+${Math.floor(s / 60)}:${String(s % 60).padStart(2, "0")}`;
 };
 const kindMark = {
-    design: C.violet,
+    design: (s) => s,
     plan: C.violet,
     task: (s) => s,
     progress: C.faint,
     announce: C.faint,
     message: C.bold,
-    memory: C.violet,
+    memory: C.faint,
     handoff: C.violet,
     review: C.violet,
     merge: C.green,
@@ -695,24 +1032,83 @@ const kindMark = {
     team: C.faint,
     other: C.faint,
 };
-export function renderText(s) {
+/** Parts joined with " · ", wrapped onto as many lines as `width` needs. */
+function wrapParts(parts, width, indent = "  ") {
+    const out = [];
+    let cur = "";
+    for (const p of parts) {
+        const next = cur ? `${cur} · ${p}` : p;
+        if (cur && indent.length + next.length > width) {
+            out.push(indent + cur);
+            cur = p;
+        }
+        else
+            cur = next;
+    }
+    if (cur)
+        out.push(indent + cur);
+    return out;
+}
+/**
+ * The story in the terminal, in the live run's words: COUNCIL → PLAN → BUILD →
+ * QA → RESULT. `width` (the terminal's columns) cuts every line to fit; without
+ * it (a file, a pipe) lines are kept whole.
+ */
+export function renderText(s, opts = {}) {
     const out = [];
     const r = s.run;
+    const W = opts.width ?? 120;
+    const nameW = Math.max(6, ...s.agents.map((a) => a.length));
     const who = (a) => (a ? `${dot(a)} ${C.bold(a)}` : `${C.violet("◆")} ${C.faint("huddle")}`);
+    const whoPad = (a) => (a ? `${dot(a)} ${C.bold(pad(a, nameW))}` : `${C.violet("◆")} ${C.faint(pad("huddle", nameW))}`);
+    const indent = " ".repeat(2 + 6 + 1 + 2 + nameW + 1);
+    const instant = councilInstant(s);
     const line = (it) => {
-        const head = it.to && it.kind === "message" ? `${who(it.agent)} ${C.faint("→")} ${who(it.to)}${C.faint(":")}` : who(it.agent);
+        const head = it.to && it.kind === "message" ? `${who(it.agent)} ${C.faint("→")} ${who(it.to)}${C.faint(":")}` : whoPad(it.agent);
         const tag = it.kind === "message" && it.detail ? C.faint(` (${it.detail})`) : "";
-        out.push(`  ${C.faint(pad(clock(it.ts - r.start), 7))} ${head} ${kindMark[it.kind](it.text)}${tag}`);
-        if (it.detail && it.kind !== "message")
+        const t = it.kind === "design" && instant ? "" : clock(it.ts - r.start);
+        out.push(`  ${C.faint(pad(t, 6))} ${head} ${kindMark[it.kind](it.text)}${tag}`);
+        // Details that only repeat the task's title or a why, and specs of new tasks, stay in the HTML.
+        const quiet = it.kind === "message" || it.kind === "progress" || it.type === "memory.added" || it.type === "task.added";
+        if (it.detail && !quiet)
             for (const l of it.detail.split("\n").slice(0, 6))
-                out.push(C.faint(`            ${l}`));
+                out.push(C.faint(`${indent}${l}`));
     };
+    const head = (name, sub = "") => out.push("", `${C.violet(name)}${sub ? C.faint(" · " + sub) : ""}`);
+    const o = outcome(s);
+    const crew = crewRows(s);
     out.push(`${C.violet("STORY")} ${C.bold(JSON.stringify(goalTitle(r.goal)))}`);
-    out.push(C.faint(`  run ${r.index} of ${s.runs}${r.id ? " · " + r.id : ""} · ${new Date(r.start).toLocaleString()} · ${fmtDuration(r.end - r.start)} · ${s.merged} merged, ${s.failed} failed`));
-    if (s.agents.length)
-        out.push(`  ${C.faint("crew:")} ${s.agents.map((a) => `${dot(a)} ${a}`).join("  ")}`);
+    out.push(C.faint(`  run ${r.index} of ${s.runs}${r.id ? " · " + r.id : ""} · ${new Date(r.start).toLocaleString()} · ${fmtDuration(o.ms)} · ${plural(s.agents.length, "agent")}`));
+    const mark = s.failed ? C.yellow("◎") : C.green("✓");
+    out.push(`  ${mark} ${s.merged} merged, ${s.failed} failed` +
+        C.faint(`${o.merges ? ` · ${o.green}/${o.merges} merged on green tests` : ""}${o.tokens ? ` · ${fmtTokens(o.tokens)} tok` : ""}`));
+    if (o.qa)
+        out.push(`  ${o.qa.tone === "ok" ? C.green("✓") : C.yellow("!")} ${o.qa.text}`);
+    for (const c of crew)
+        out.push(`  ${dot(c.agent)} ${pad(c.agent, nameW)}  ${didLine(c)}${C.faint(`${c.ms ? " · " + fmtDuration(c.ms) : ""}${c.tokens ? " · " + fmtTokens(c.tokens) + " tok" : ""}`)}`);
+    const team = collabLines(s);
+    const nums = tally(s);
+    if (team.length || nums.length) {
+        head("TEAMWORK", "who built on whom");
+        out.push(...wrapParts(nums.map((t) => t.text ?? `${t.n} ${t.label}`), W).map((l) => C.bold(l)));
+        // The terminal shows the first few ideas and flaws; the HTML has them all.
+        const total = (label) => team.filter((x) => x.label === label).reduce((n, x) => n + (/^…and (\d+) more$/.exec(x.text) ? Number(/\d+/.exec(x.text)[0]) : 1), 0);
+        const shown = new Map();
+        for (const l of team) {
+            const capped = l.label === "adopted" || l.label === "flaw";
+            const k = (shown.get(l.label) ?? 0) + 1;
+            shown.set(l.label, k);
+            if (capped && k > 3) {
+                if (k === 4)
+                    out.push(`  ${C.faint(pad(l.label, 9))} ${C.faint(`…and ${total(l.label) - 3} more`)}`);
+                continue;
+            }
+            out.push(`  ${C.faint(pad(l.label, 9))} ${l.text}`);
+        }
+    }
     if (s.design.length) {
-        out.push("", C.violet("DESIGN COUNCIL"));
+        const members = [...new Set(s.design.map((it) => it.agent).filter(Boolean))];
+        head("COUNCIL", `${members.length ? members.join(", ") + " " : ""}designed it before anyone coded`);
         s.design.forEach(line);
     }
     if (s.plan.tasks.length) {
@@ -721,21 +1117,60 @@ export function renderText(s) {
         s.plan.tasks.forEach((t, i) => {
             const deps = t.deps.map((d) => "#" + (num.get(d) ?? d));
             out.push(`  ${C.faint(String(i + 1).padStart(2) + ".")} ${t.title}` +
-                C.faint([deps.length ? `after ${deps.join(", ")}` : "", t.prefers.length ? `suits ${t.prefers.join("/")}` : "", t.files.length ? t.files.slice(0, 4).join(", ") : "", t.by ? `proposed by ${t.by}` : ""]
+                C.faint([deps.length ? `after ${deps.join(", ")}` : "", t.prefers.length ? `suits ${t.prefers.join("/")}` : "", t.files.length ? t.files.slice(0, 4).join(", ") : "", t.by ? `idea from ${t.by}` : ""]
                     .filter(Boolean)
                     .map((x) => " · " + x)
                     .join("")));
         });
+        const c = s.collab;
+        for (const it of phases(s).agreed) {
+            const a = agreement(it);
+            out.push(a.risk ? `  ${C.yellow("!")} ${C.faint(`risk${a.by ? ` (${a.by})` : ""}:`)} ${a.body}` : `  ${C.violet("◆")} ${C.faint("decided:")} ${a.body}`);
+        }
+        if (c.contract) {
+            const taken = c.objections.filter((x) => x.taken).length;
+            out.push(`  ${C.violet("◆")} contract by ${c.contract.by}${C.faint(`${c.objections.length ? ` · ${taken}/${c.objections.length} objections taken` : ""} · ${plural(c.amendments.length, "amendment")} during the build`)}`);
+        }
     }
-    out.push("", C.violet("TIMELINE"));
+    if (s.screen.length) {
+        head("SHARED SCREEN", "one copy every agent reads");
+        for (const x of s.screen) {
+            out.push(`  ${C.bold(x.id)} ${x.kind} “${x.title}”${C.faint([x.size, x.by ? "by " + x.by : "", x.removed ? "removed" : ""].filter(Boolean).map((v) => " · " + v).join(""))}`);
+            out.push(C.faint(`        read by: ${x.readers.length ? x.readers.join(", ") : "nobody"}`));
+            for (const n of x.notes)
+                out.push(`        📌 ${C.bold(n.by)} ${oneLine(n.body, 160)}`);
+        }
+    }
+    const ph = phases(s);
+    head("BUILD", "agents code, check each other, merge");
     if (!s.items.length)
         out.push(C.faint("  (nothing happened in this run)"));
-    s.items.forEach(line);
+    ph.build.forEach(line);
+    if (ph.qa.length) {
+        head("QA", "agents re-check the merged build; bugs become fix tasks");
+        ph.qa.forEach(line);
+    }
+    head("RESULT");
+    out.push(`  ${mark} ${s.merged} merged, ${s.failed} failed${C.faint(` · ${fmtDuration(o.ms)}${o.tokens ? ` · ${fmtTokens(o.tokens)} tok` : ""}${o.cached > o.tokens / 2 ? ` (${fmtTokens(o.cached)} cached)` : ""}`)}`);
+    if (o.merges)
+        out.push(`  ${o.green === o.merges ? C.green("✓") : C.yellow("!")} ${o.green}/${o.merges} merges passed the tests first`);
+    if (o.qa)
+        out.push(`  ${o.qa.tone === "ok" ? C.green("✓") : C.yellow("!")} ${plural(o.rounds, "QA round")} · ${o.qa.text}`);
     if (s.agents.length) {
-        out.push("", C.violet("WHO DID WHAT"));
-        const cols = ["merged", "failed", "reviews", "msgs out/in", "design", "bugs found/fixed", "takeovers in/out", "tool calls", "time", "tokens"];
-        const w = Math.max(10, ...s.agents.map((a) => a.length + 4)); // "● name" + a gap
-        out.push(C.faint("  " + pad("", w) + cols.map((c) => pad(c, Math.max(c.length, 6) + 2)).join("")));
+        out.push("", `${C.violet("WHO DID WHAT")} ${C.faint("· msgs sent/got · bugs found/fixed · takeovers in/out")}`);
+        const cols = [
+            ["merged", 7],
+            ["failed", 7],
+            ["reviews", 8],
+            ["msgs", 7],
+            ["bugs", 6],
+            ["takeover", 9],
+            ["tools", 6],
+            ["time", 8],
+            ["tokens", 7],
+        ];
+        const w = nameW + 4; // "● name" + a gap
+        out.push(C.faint("  " + pad("", w) + cols.map(([c, n]) => pad(c, n)).join("")));
         for (const a of s.agents) {
             const x = s.stats.get(a);
             const vals = [
@@ -743,16 +1178,15 @@ export function renderText(s) {
                 x.failed,
                 x.reviews + (x.changesAsked ? ` (${x.changesAsked}✎)` : ""),
                 `${x.sent}/${x.received}`,
-                x.proposals || x.critiques ? `${x.proposals}p ${x.critiques}c` : "0",
                 `${x.bugsFound}/${x.bugsFixed}`,
                 `${x.takeoversIn}/${x.takeoversOut}`,
                 x.toolCalls,
                 x.ms ? fmtDuration(x.ms) : "—",
                 x.tokens ? fmtTokens(x.tokens) : "—",
             ].map(String);
-            out.push(`  ${pad(`${dot(a)} ${a}`, w)}${vals.map((v, i) => pad(v, Math.max(cols[i].length, 6) + 2)).join("")}`);
+            out.push(`  ${pad(`${dot(a)} ${a}`, w)}${vals.map((v, i) => pad(v, cols[i][1])).join("")}`);
         }
-        out.push("", `${C.violet("WHO TALKED TO WHOM")} ${C.faint("(row → column: messages, questions, answers, reviews, critiques, handoffs)")}`);
+        out.push("", `${C.violet("WHO TALKED TO WHOM")} ${C.faint("· row → column: messages, reviews, critiques, handoffs")}`);
         const cw = Math.max(8, ...s.agents.map((a) => a.length + 2));
         out.push("  " + pad("", w) + s.agents.map((a) => pad(a, cw)).join(""));
         for (const a of s.agents) {
@@ -760,7 +1194,7 @@ export function renderText(s) {
             out.push(`  ${pad(`${dot(a)} ${a}`, w)}${s.agents.map((b) => pad(a === b ? C.faint("·") : row?.get(b) ? C.bold(String(row.get(b))) : C.faint("0"), cw)).join("")}`);
         }
     }
-    return out.join("\n");
+    return (opts.width ? out.map((l) => truncate(l, Math.max(20, opts.width - 1))) : out).join("\n");
 }
 export function renderRunList(runs) {
     if (!runs.length)
@@ -776,12 +1210,95 @@ export function renderRunList(runs) {
 // ---- HTML (a static, self-contained report file) --------------------------------
 const esc = (s) => str(s).replace(/[&<>"']/g, (c) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" })[c]);
 const colorOf = (a) => (a ? AGENT_COLOR[a.split("#")[0]] ?? "#8A857C" : "#7B6CF6");
+/** Lines that are the agents thinking out loud, hidden behind a toggle so the story reads first. */
+const NOISE = (it) => it.kind === "progress" || it.kind === "announce" || it.kind === "memory" || it.type === "memory.added";
 export function renderHtml(s) {
     const r = s.run;
+    const c = s.collab;
+    const o = outcome(s);
     const span = Math.max(1, r.end - r.start);
     const pct = (ts) => (((ts - r.start) / span) * 100).toFixed(3);
     const chip = (a) => `<span class="who"><i style="background:${colorOf(a)}"></i>${esc(a ?? "huddle")}</span>`;
-    // Lanes: one per agent; spans are its tasks/reviews/conflicts/QA; dots are its messages.
+    const badge = (text, tone = "") => `<span class="badge ${tone}">${esc(text)}</span>`;
+    const card = (title, body, sub = "") => `<div class="card"><h3>${esc(title)}${sub ? ` <small>${esc(sub)}</small>` : ""}</h3>${body}</div>`;
+    const empty = (t) => `<p class="none">${esc(t)}</p>`;
+    // ---- header + crew
+    const kpis = [
+        { n: String(s.merged), l: "merged", tone: "ok" },
+        { n: String(s.failed), l: "failed", tone: s.failed ? "bad" : "" },
+        ...(o.merges ? [{ n: `${o.green}/${o.merges}`, l: "merged on green tests", tone: o.green === o.merges ? "ok" : "warn" }] : []),
+        { n: fmtDuration(o.ms), l: "start to finish", tone: "" },
+        ...(o.tokens ? [{ n: fmtTokens(o.tokens), l: "tokens", tone: "" }] : []),
+        ...(c.bugs.length ? [{ n: `${c.bugs.length}→${c.bugs.filter((b) => b.fixedBy).length}`, l: "QA bugs → fixed", tone: "" }] : []),
+    ]
+        .map((k) => `<div class="kpi ${k.tone}"><b>${esc(k.n)}</b><span>${esc(k.l)}</span></div>`)
+        .join("");
+    const crew = crewRows(s)
+        .map((x) => `<div class="agent" style="--c:${colorOf(x.agent)}"><div class="an"><i></i>${esc(x.agent)}</div><div class="as">${esc(didLine(x))}</div><div class="am">${esc([x.ms ? fmtDuration(x.ms) : "", x.tokens ? fmtTokens(x.tokens) + " tok" : ""].filter(Boolean).join(" · ") || "—")}</div></div>`)
+        .join("");
+    // ---- teamwork
+    const tiles = tally(s)
+        .map((t) => `<div class="tile ${t.tone ?? ""}"><b>${esc(t.n)}</b><span>${esc(t.label)}</span></div>`)
+        .join("");
+    const ideaAgents = s.agents.filter((a) => [...c.adopts, ...c.flaws].some((x) => x.by === a || x.of === a));
+    const cell = (by, of) => {
+        if (by === of)
+            return `<td class="self">·</td>`;
+        const ad = c.adopts.filter((x) => x.by === by && x.of === of).length;
+        const fl = c.flaws.filter((x) => x.by === by && x.of === of).length;
+        return `<td>${ad ? `<span class="ad" title="${ad} adopted">${ad}</span>` : ""}${fl ? `<span class="fl" title="${fl} flaw(s)">${fl}</span>` : ""}${!ad && !fl ? `<span class="z">0</span>` : ""}</td>`;
+    };
+    const ideas = ideaAgents.length
+        ? `<div class="scroll"><table class="grid"><tr><th><small>took ↓ · from →</small></th>${ideaAgents.map((a) => `<th>${chip(a)}</th>`).join("")}</tr>${ideaAgents
+            .map((by) => `<tr><th>${chip(by)}</th>${ideaAgents.map((of) => cell(by, of)).join("")}</tr>`)
+            .join("")}</table></div><p class="legend"><span class="ad">n</span> ideas adopted · <span class="fl">n</span> flaws found · row took from / flagged the column's proposal</p>${c.adopts
+            .slice(0, 3)
+            .map((a) => `<div class="quote">${chip(a.by)} took ${chip(a.of)}'s idea: ${esc(oneLine(a.text, 160))}</div>`)
+            .join("")}`
+        : "";
+    const contract = [
+        c.synthesizer ? `<li>${chip(c.synthesizer.id)} wrote the plan${c.synthesizer.why ? ` <small>${esc(oneLine(c.synthesizer.why, 120))}</small>` : ""}</li>` : "",
+        // Each objection is listed with whether it was taken; the ratify rows add only who signed off.
+        ...c.ratify.filter((x) => x.verdict !== "object" || !c.objections.length).map((x) => `<li>${chip(x.agent)} ${x.verdict === "object" ? badge("objected", "warn") + ` ${esc(oneLine(x.objections.join(" · "), 160))}` : badge("ratified", "ok")}</li>`),
+        ...c.objections.map((x) => `<li>${chip(x.by)}'s objection ${x.taken ? badge("taken", "ok") : badge("kept as is")} <span class="detail">${esc(oneLine(x.objection, 160))}</span></li>`),
+        c.contract ? `<li>◆ contract v1 by ${chip(c.contract.by)} <small>${esc(c.contract.chars)} chars · the names every task codes to</small></li>` : "",
+        ...c.amendments.map((a) => `<li>◆ v${esc(a.version)} by ${chip(a.by)} <span class="detail">${esc(oneLine(a.change, 160))}</span></li>`),
+    ]
+        .filter(Boolean)
+        .join("");
+    const notes = buddyNotes(s);
+    const good = c.buddy.filter((b) => !b.notes).length;
+    const buddy = c.buddy.length
+        ? `<ul class="list">${notes
+            .map((b) => `<li>${chip(b.agent)} → ${chip(b.author)} <small>at ${esc(b.pct)}%</small> ${badge(b.how, b.tone)}<div class="detail">${esc(oneLine(b.notes, 240))}</div></li>`)
+            .join("")}${good ? `<li class="mute">✓ ${plural(good, "check")} looked good</li>` : ""}</ul>`
+        : "";
+    const bugs = c.bugs.length
+        ? `<ul class="list">${c.bugs
+            .map((b) => `<li>${chip(b.by)} found ${b.to ? `→ fix for ${chip(b.to)}` : ""} ${b.fixedBy ? badge(`fixed by ${b.fixedBy}`, "ok") : badge("open", "warn")}<div class="detail">${esc(oneLine(b.title, 200))}</div></li>`)
+            .join("")}</ul>`
+        : "";
+    const radarFix = c.followups.filter((f) => f.kind === "radar");
+    const radar = [
+        ...c.radar.map((x) => `<li>⚠ ${chip(x.agent)} ↔ ${x.with && x.with !== "contract" ? chip(x.with) : esc(x.with || "?")} ${badge(x.kind === "overlap" ? "overlap" : "name mismatch", "warn")}<div class="detail">${esc(oneLine(x.detail, 200))}</div></li>`),
+        ...radarFix.map((f) => `<li>${chip(f.to)} ${badge(f.how === "ignored" ? "ignored" : f.how === "replied" ? "answered" : "fixed in code", f.how === "ignored" ? "bad" : "ok")} the radar's finding<div class="detail">${esc(oneLine(f.note, 200))}</div></li>`),
+        ...c.pairs.map((p) => `<li>⇉ ${chip(p.agent)} paired with ${chip(p.with)}<div class="detail">took: ${esc(oneLine(p.part, 200))}</div></li>`),
+    ].join("");
+    const radarNote = !c.radar.length && c.radarLooks?.looks ? `<p class="none">no radar catches · it compared work in progress ${plural(c.radarLooks.looks, "time")}</p>` : "";
+    const team = collabLines(s);
+    const cards = [
+        ideas ? card("Ideas between agents", ideas, "council cross-review") : "",
+        contract ? card("Council → contract", `<ul class="list">${contract}</ul>`) : "",
+        buddy ? card("Buddy notes mid-task", buddy, "and what came of them") : "",
+        bugs ? card("QA bugs → fixes", bugs) : "",
+        radar || radarNote ? card("Radar & pairs", (radar ? `<ul class="list">${radar}</ul>` : "") + radarNote) : "",
+    ]
+        .filter(Boolean)
+        .join("");
+    const teamwork = tiles || cards || team.length
+        ? `<h2>Teamwork <small>who built on whom</small></h2>${tiles ? `<div class="tiles">${tiles}</div>` : ""}${cards ? `<div class="cards">${cards}</div>` : ""}${team.length ? `<details><summary>Every teamwork line (${team.length})</summary><table class="team">${team.map((l) => `<tr><th>${esc(l.label)}</th><td>${esc(l.text)}</td></tr>`).join("")}</table></details>` : ""}`
+        : "";
+    // ---- lanes: one per agent; spans are its tasks/reviews/conflicts/QA; dots are its messages.
     const ticks = Array.from({ length: 5 }, (_, i) => `<span style="left:${i * 25}%">${esc(clock((span * i) / 4))}</span>`).join("");
     const lanes = s.agents
         .map((a) => {
@@ -790,19 +1307,50 @@ export function renderHtml(s) {
             .map((x) => `<div class="bar ${x.kind} ${x.outcome ?? ""}" style="left:${pct(x.from)}%;width:max(4px,${(((x.to - x.from) / span) * 100).toFixed(3)}%);--c:${colorOf(a)}" title="${esc(`${x.kind}: ${x.label} · ${clock(x.from - r.start)}–${clock(x.to - r.start)}`)}"><span>${esc(x.label)}</span></div>`)
             .join("");
         const marks = [...s.items, ...s.design]
-            .filter((it) => it.agent === a && ["message", "design", "qa", "takeover", "merge", "fail", "announce"].includes(it.kind))
+            .filter((it) => it.agent === a && ["message", "design", "qa", "takeover", "merge", "fail"].includes(it.kind))
             .map((it) => `<b class="mark ${it.kind}" style="left:${pct(it.ts)}%" title="${esc(`${clock(it.ts - r.start)} ${it.to ? "→ " + it.to + ": " : ""}${it.text}`)}"></b>`)
             .join("");
         return `<div class="lane" data-lane="${esc(a)}"><div class="name">${chip(a)}</div><div class="track">${bars}${marks}</div></div>`;
     })
         .join("");
-    const row = (it) => `<li class="${it.kind}"><time>${esc(clock(it.ts - r.start))}</time><div>${chip(it.agent)}${it.to ? ` <span class="arrow">→</span> ${chip(it.to)}` : ""} <span class="text">${esc(it.text)}</span>${it.detail ? `<div class="detail">${esc(it.detail)}</div>` : ""}</div></li>`;
+    // ---- the timeline, by phase
+    const instant = councilInstant(s);
+    const row = (it) => `<li class="${it.kind}${NOISE(it) ? " noise" : ""}"><time>${it.kind === "design" && instant ? "" : esc(clock(it.ts - r.start))}</time><div>${chip(it.agent)}${it.to && it.kind !== "design" ? ` <span class="arrow">→</span> ${chip(it.to)}` : ""} <span class="text">${esc(it.text)}</span>${it.detail ? `<div class="detail">${esc(it.detail)}</div>` : ""}</div></li>`;
     const num = new Map(s.plan.tasks.map((t, i) => [t.id, i + 1]));
     const plan = s.plan.tasks
-        .map((t) => `<li><b>${esc(t.title)}</b>${t.deps.length ? ` <small>after ${esc(t.deps.map((d) => "#" + (num.get(d) ?? d)).join(", "))}</small>` : ""}${t.prefers.length ? ` <small>suits ${esc(t.prefers.join("/"))}</small>` : ""}${t.by ? ` <small>proposed by ${esc(t.by)}</small>` : ""}${t.files.length ? `<div class="detail">${esc(t.files.join(", "))}</div>` : ""}</li>`)
+        .map((t) => `<li><b>${esc(t.title)}</b>${t.deps.length ? ` <small>after ${esc(t.deps.map((d) => "#" + (num.get(d) ?? d)).join(", "))}</small>` : ""}${t.prefers.length ? ` <small>suits ${esc(t.prefers.join("/"))}</small>` : ""}${t.by ? ` <small>idea from ${esc(t.by)}</small>` : ""}${t.files.length ? `<div class="detail">${esc(t.files.join(", "))}</div>` : ""}</li>`)
         .join("");
+    const ph = phases(s);
+    const noise = s.items.filter(NOISE).length;
+    const phase = (tag, sub, body) => `<section class="phase"><h3><span class="tag">${esc(tag)}</span> ${esc(sub)}</h3>${body}</section>`;
+    const members = [...new Set(s.design.map((it) => it.agent).filter(Boolean))];
+    const result = [
+        `<li>${s.failed ? "◎" : "✓"} <b>${s.merged} merged, ${s.failed} failed</b> <small>${esc(fmtDuration(o.ms))}${o.tokens ? " · " + esc(fmtTokens(o.tokens)) + " tok" : ""}</small></li>`,
+        o.merges ? `<li>${o.green === o.merges ? "✓" : "!"} ${o.green}/${o.merges} merges passed the tests first</li>` : "",
+        o.qa ? `<li class="${o.qa.tone}">${o.qa.tone === "ok" ? "✓" : "!"} ${esc(plural(o.rounds, "QA round"))} · ${esc(o.qa.text)}</li>` : "",
+    ].join("");
+    const timeline = [
+        s.design.length ? phase("COUNCIL", `${members.join(", ")} designed it before anyone coded`, `<ol class="timeline">${s.design.map(row).join("")}</ol>`) : "",
+        s.plan.tasks.length
+            ? phase("PLAN", `${plural(s.plan.tasks.length, "task")}${s.plan.by ? " · by " + s.plan.by : ""}`, `<ol class="plan">${plan}</ol>${ph.agreed.length
+                ? `<ul class="list agreed">${ph.agreed
+                    .map((it) => agreement(it))
+                    .map((a) => `<li>${a.risk ? `<span class="badge warn">risk${a.by ? " · " + esc(a.by) : ""}</span>` : `<span class="badge ok">decided</span>`} ${esc(a.body)}</li>`)
+                    .join("")}</ul>`
+                : ""}${c.contract ? `<p class="contract">◆ contract by ${chip(c.contract.by)}${c.objections.length ? ` · ${c.objections.filter((x) => x.taken).length}/${c.objections.length} objections taken` : ""} · ${plural(c.amendments.length, "amendment")} during the build</p>` : ""}`)
+            : "",
+        phase("BUILD", "agents code, check each other, merge", `<ol class="timeline">${ph.build.map(row).join("") || '<li class="none">nothing happened in this run</li>'}</ol>`),
+        ph.qa.length ? phase("QA", "agents re-check the merged build; bugs become fix tasks", `<ol class="timeline">${ph.qa.map(row).join("")}</ol>`) : "",
+        phase("RESULT", "", `<ul class="list result">${result}</ul>`),
+    ].join("");
+    // ---- shared screen, conversations, tables
+    const screen = s.screen.length
+        ? `<h2>Shared screen <small>one copy every agent reads</small></h2><ul class="list card">${s.screen
+            .map((x) => `<li><b>${esc(x.id)}</b> ${esc(x.kind)} “${esc(x.title)}”${x.size ? ` <small>${esc(x.size)}</small>` : ""}${x.by ? ` <small>by ${esc(x.by)}</small>` : ""}${x.removed ? ` <small>removed</small>` : ""}<div class="detail">read by: ${x.readers.length ? x.readers.map((a) => chip(a)).join(" ") : "nobody"}</div>${x.notes.map((n) => `<div class="detail">📌 ${chip(n.by)} ${esc(n.body)}</div>`).join("")}</li>`)
+            .join("")}</ul>`
+        : "";
     const threads = [...s.threads.entries()]
-        .map(([pair, msgs]) => `<details open><summary>${esc(pair)} <small>${msgs.length} message${msgs.length > 1 ? "s" : ""}</small></summary><ol class="thread">${msgs
+        .map(([pair, msgs]) => `<details><summary>${esc(pair)} <small>${msgs.length} message${msgs.length > 1 ? "s" : ""}</small></summary><ol class="thread">${msgs
         .map((m) => `<li class="${m.agent === pair.split(" ↔ ")[0] ? "l" : "r"}" style="--c:${colorOf(m.agent)}"><div class="meta">${esc(m.agent)} → ${esc(m.to)} · ${esc(clock(m.ts - r.start))}${m.detail && m.kind === "message" ? " · " + esc(m.detail) : ""}</div>${esc(m.text)}${m.detail && m.kind !== "message" ? `<div class="detail">${esc(m.detail)}</div>` : ""}</li>`)
         .join("")}</ol></details>`)
         .join("");
@@ -822,59 +1370,107 @@ export function renderHtml(s) {
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>Huddle story</title>
 <style>
-:root{--bg:#faf9f6;--fg:#1d1b18;--mute:#77716a;--line:#e4e0d8;--card:#fff;--ok:#2e9e5b;--bad:#d14b3c;--warn:#c58a12;--brand:#7B6CF6}
-@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--bg:#15141a;--fg:#ece9e3;--mute:#9a948b;--line:#2c2a33;--card:#1d1c23}}
-:root[data-theme="dark"]{--bg:#15141a;--fg:#ece9e3;--mute:#9a948b;--line:#2c2a33;--card:#1d1c23}
+:root{--bg:#f6f5f1;--fg:#1d1b18;--mute:#6f6a62;--line:#e4e0d8;--card:#fff;--soft:#efede7;--ok:#23864c;--bad:#c93f30;--warn:#a86f05;--brand:#6a5af0;color-scheme:light}
+@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--bg:#121117;--fg:#ece9e3;--mute:#9a948b;--line:#2b2932;--card:#1b1a21;--soft:#23222a;--ok:#4cc27c;--bad:#f06a5b;--warn:#e0a53a;--brand:#9488ff;color-scheme:dark}}
+:root[data-theme="dark"]{--bg:#121117;--fg:#ece9e3;--mute:#9a948b;--line:#2b2932;--card:#1b1a21;--soft:#23222a;--ok:#4cc27c;--bad:#f06a5b;--warn:#e0a53a;--brand:#9488ff;color-scheme:dark}
 *{box-sizing:border-box}
-body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.5 ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
-main{max-width:1100px;margin:0 auto;padding:20px 16px 60px}
-h1{font-size:22px;margin:0 0 4px}h2{font-size:15px;text-transform:uppercase;letter-spacing:.06em;color:var(--brand);margin:32px 0 10px}
-.sub,small,.detail,time,.meta{color:var(--mute)}small{font-size:12px;margin-left:6px}
-.who{display:inline-flex;align-items:center;gap:5px;font-weight:600;white-space:nowrap}.who i{width:9px;height:9px;border-radius:50%;display:inline-block}
-.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:10px;background:var(--card)}
+body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.5 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-text-size-adjust:100%}
+main{max-width:1100px;margin:0 auto;padding:24px 16px 60px}
+h1{font-size:26px;line-height:1.25;margin:6px 0 4px;word-break:break-word}
+h2{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--brand);margin:36px 0 12px}
+h2 small{text-transform:none;letter-spacing:0}
+h3{font-size:14px;margin:0 0 10px}
+.brand{font-weight:700;color:var(--brand);font-size:13px;letter-spacing:.04em}
+.sub,small,.detail,time,.meta,.none,.legend{color:var(--mute)}small{font-size:12px;margin-left:6px;font-weight:400}
+.none{font-size:13px;margin:6px 0}
+.who{display:inline-flex;align-items:center;gap:5px;font-weight:600;white-space:nowrap}.who i{width:9px;height:9px;border-radius:50%;display:inline-block;flex:none}
+.hero{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px}
+.hero details{margin:8px 0}
+.kpis,.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-top:16px}
+.kpi,.tile{background:var(--soft);border-radius:12px;padding:10px 12px;min-width:0}
+.kpi b,.tile b{display:block;font-size:24px;line-height:1.2;font-variant-numeric:tabular-nums}
+.kpi span,.tile span{font-size:12px;color:var(--mute)}
+.kpi.ok b,.tile.ok b{color:var(--ok)}.kpi.bad b,.tile.bad b{color:var(--bad)}.kpi.warn b,.tile.warn b{color:var(--warn)}
+.verdict{margin:14px 0 0;font-weight:600}.verdict.ok{color:var(--ok)}.verdict.warn{color:var(--warn)}
+.crew{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin-top:12px}
+.agent{background:var(--card);border:1px solid var(--line);border-top:4px solid var(--c);border-radius:12px;padding:10px 14px;min-width:0}
+.agent .an{display:flex;align-items:center;gap:7px;font-weight:700;font-size:16px}.agent .an i{width:11px;height:11px;border-radius:50%;background:var(--c)}
+.agent .as{font-size:14px}.agent .am{font-size:12px;color:var(--mute);font-variant-numeric:tabular-nums}
+.cards{columns:320px 3;column-gap:12px;margin-top:12px}.cards .card{break-inside:avoid;margin-bottom:12px}
+.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px;min-width:0}
+.list li{font-size:14px;padding:7px 0;border-top:1px solid var(--line);word-break:break-word}.list li:first-child{border-top:0}
+.list li.mute{color:var(--mute)}
+.badge{display:inline-block;font-size:11px;font-weight:700;padding:1px 8px;border-radius:999px;background:var(--soft);color:var(--mute);white-space:nowrap}
+.badge.ok{color:var(--ok);background:color-mix(in srgb,var(--ok) 14%,transparent)}.badge.bad{color:var(--bad);background:color-mix(in srgb,var(--bad) 14%,transparent)}.badge.warn{color:var(--warn);background:color-mix(in srgb,var(--warn) 16%,transparent)}
+.grid td,.grid th{text-align:center}.grid th:first-child{text-align:left}
+.ad,.fl{display:inline-block;min-width:22px;padding:1px 6px;margin:1px;border-radius:6px;font-weight:700;font-size:12px}
+.ad{color:var(--ok);background:color-mix(in srgb,var(--ok) 15%,transparent)}.fl{color:var(--warn);background:color-mix(in srgb,var(--warn) 17%,transparent)}.z{color:var(--line)}
+.legend{font-size:12px;margin:8px 0}
+.quote{font-size:13px;padding:6px 0 6px 10px;border-left:3px solid var(--line);margin-top:6px;word-break:break-word}
+.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
+.lanesbox{border:1px solid var(--line);border-radius:12px;background:var(--card)}
 .lanes{min-width:640px;padding:8px 12px 12px}
 .axis{position:relative;height:18px;margin-left:120px;font-size:11px;color:var(--mute)}.axis span{position:absolute;transform:translateX(-50%)}.axis span:first-child{transform:none}.axis span:last-child{transform:translateX(-100%)}
 .lane{display:flex;align-items:center;height:38px;border-top:1px solid var(--line)}
 .lane .name{width:120px;flex:none;overflow:hidden;text-overflow:ellipsis;font-size:13px}
 .track{position:relative;flex:1;height:26px}
 .bar{position:absolute;top:3px;height:20px;border-radius:5px;background:color-mix(in srgb,var(--c) 30%,transparent);border:1px solid var(--c);overflow:hidden;font-size:11px;line-height:18px;padding:0 4px;white-space:nowrap}
-.bar span{opacity:.9}.bar.review{border-style:dashed}.bar.conflict{border-color:var(--warn)}.bar.qa{border-style:dotted}
+.bar.review{border-style:dashed}.bar.conflict{border-color:var(--warn)}.bar.qa{border-style:dotted}
 .bar.ok{box-shadow:inset -3px 0 0 var(--ok)}.bar.bad{box-shadow:inset -3px 0 0 var(--bad)}.bar.warn{box-shadow:inset -3px 0 0 var(--warn)}
 .mark{position:absolute;top:-3px;width:7px;height:7px;margin-left:-3px;border-radius:50%;background:var(--brand)}
-.mark.merge{background:var(--ok)}.mark.fail{background:var(--bad)}.mark.qa,.mark.takeover{background:var(--warn)}.mark.announce{background:var(--mute)}
+.mark.merge{background:var(--ok)}.mark.fail{background:var(--bad)}.mark.qa,.mark.takeover{background:var(--warn)}
 ol,ul{padding:0;margin:0;list-style:none}
-.timeline li{display:flex;gap:10px;padding:7px 0;border-top:1px solid var(--line)}
-.timeline time{flex:none;width:48px;font-variant-numeric:tabular-nums;font-size:13px}
-.timeline .merge .text{color:var(--ok)}.timeline .fail .text{color:var(--bad)}.timeline .conflict .text,.timeline .qa .text,.timeline .takeover .text{color:var(--warn)}
-.timeline .progress .text,.timeline .announce .text,.timeline .team .text,.timeline .other .text{color:var(--mute)}
+.phase{margin-top:22px}
+.phase h3{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;font-weight:400;color:var(--mute);font-size:13px}
+.tag{font-weight:800;letter-spacing:.08em;color:#fff;background:var(--brand);border-radius:6px;padding:2px 8px;font-size:12px}
+.timeline li{display:flex;gap:10px;padding:6px 0;font-size:14px;border-top:1px solid var(--line);min-width:0}
+.timeline li>div{min-width:0;word-break:break-word}
+.timeline time{flex:none;width:46px;font-variant-numeric:tabular-nums;font-size:13px}
+.timeline .merge .text{color:var(--ok);font-weight:600}.timeline .fail .text{color:var(--bad)}.timeline .conflict .text,.timeline .qa .text,.timeline .takeover .text{color:var(--warn)}
+.timeline .progress .text,.timeline .announce .text,.timeline .team .text,.timeline .other .text,.timeline .memory .text{color:var(--mute)}
+#noise{position:absolute;opacity:0;pointer-events:none}
+.toggle{display:inline-block;font-size:13px;color:var(--mute);border:1px solid var(--line);border-radius:999px;padding:3px 12px;cursor:pointer;user-select:none;margin-top:4px}
+.toggle::before{content:"○ "}#noise:checked~.toggle::before{content:"● "}
+#noise:focus-visible~.toggle{outline:2px solid var(--brand)}
+.timeline li.noise{display:none}#noise:checked~.phases .timeline li.noise{display:flex}
 .arrow{color:var(--mute)}.detail{font-size:13px;white-space:pre-wrap;word-break:break-word}
-.plan li{padding:6px 0;border-top:1px solid var(--line)}.plan{counter-reset:n}.plan li::before{counter-increment:n;content:counter(n) ". ";color:var(--mute)}
-details{border:1px solid var(--line);border-radius:10px;background:var(--card);margin:10px 0;padding:8px 12px}summary{cursor:pointer;font-weight:600}
+.plan{counter-reset:n}.plan li{padding:6px 0;border-top:1px solid var(--line);word-break:break-word}.plan li::before{counter-increment:n;content:counter(n) ". ";color:var(--mute)}
+.contract{margin:10px 0 0}
+.result li{font-size:15px}.result li.ok{color:var(--ok)}.result li.warn{color:var(--warn)}
+details{border:1px solid var(--line);border-radius:12px;background:var(--card);margin:10px 0;padding:8px 12px}summary{cursor:pointer;font-weight:600}
 .thread{display:flex;flex-direction:column;gap:8px;margin-top:10px}
 .thread li{max-width:85%;padding:8px 10px;border-radius:12px;border:1px solid var(--line);border-left:4px solid var(--c);word-break:break-word}
 .thread li.r{align-self:flex-end;border-left:1px solid var(--line);border-right:4px solid var(--c)}.thread .meta{font-size:12px}
 table{border-collapse:collapse;width:100%;font-size:13px;font-variant-numeric:tabular-nums}th,td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
+table.team td{white-space:normal;word-break:break-word}table.team th{color:var(--mute);font-weight:600;vertical-align:top}
 td.hot{font-weight:700;color:var(--brand)}td.self{color:var(--mute)}
+footer{margin-top:40px;font-size:12px;color:var(--mute);text-align:center}
+@media (max-width:520px){h1{font-size:21px}.hero{padding:16px}.kpi b,.tile b{font-size:20px}.kpis,.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
 </style>
 </head>
 <body>
 <main>
-<h1>${esc(goalTitle(r.goal))}</h1>${goalTitle(r.goal) !== r.goal.trim() ? `<details><summary>The goal</summary><pre style="white-space:pre-wrap">${esc(r.goal)}</pre></details>` : ""}
-<div class="sub">run ${r.index} of ${s.runs}${r.id ? " · " + esc(r.id) : ""} · ${esc(new Date(r.start).toLocaleString())} · ${esc(fmtDuration(r.end - r.start))} · ${s.merged} merged, ${s.failed} failed · ${s.agents.length} agent${s.agents.length === 1 ? "" : "s"}</div>
-
-<h2>Who was doing what, when</h2>
-<div class="scroll"><div class="lanes"><div class="axis">${ticks}</div>${lanes || '<p class="sub">no agents in this run</p>'}</div></div>
-<p class="sub"><small>bars: tasks (solid) · reviews (dashed) · conflict resolutions · QA (dotted); right edge green = merged/approved, red = failed/changes, amber = skipped/bug. Dots: messages, design, QA, merges.</small></p>
-${s.design.length ? `<h2>Design council</h2><ol class="timeline">${s.design.map(row).join("")}</ol>` : ""}
-${s.plan.tasks.length ? `<h2>Plan${s.plan.by ? ` <small>by ${esc(s.plan.by)}</small>` : ""}</h2><ol class="plan">${plan}</ol>` : ""}
-<h2>Conversations</h2>
-${threads || '<p class="sub">no agent-to-agent messages in this run</p>'}
+<header class="hero">
+<div class="brand">⬢ HUDDLE · STORY</div>
+<h1>${esc(goalTitle(r.goal, 110))}</h1>${goalTitle(r.goal, 110) !== r.goal.trim() ? `<details><summary>The goal</summary><pre style="white-space:pre-wrap;word-break:break-word">${esc(r.goal)}</pre></details>` : ""}
+<div class="sub">run ${r.index} of ${s.runs}${r.id ? " · " + esc(r.id) : ""} · ${esc(new Date(r.start).toLocaleString())} · ${s.agents.length} agent${s.agents.length === 1 ? "" : "s"}</div>
+<div class="kpis">${kpis}</div>
+${o.qa ? `<p class="verdict ${o.qa.tone}">${o.qa.tone === "ok" ? "✓" : "!"} ${esc(plural(o.rounds, "QA round"))} · ${esc(o.qa.text)}</p>` : ""}
+</header>
+${crew ? `<div class="crew">${crew}</div>` : ""}
+${teamwork}
+<h2>Timeline <small>who was doing what, when</small></h2>
+<div class="lanesbox scroll"><div class="lanes"><div class="axis">${ticks}</div>${lanes || '<p class="none">no agents in this run</p>'}</div></div>
+<p class="legend">bars: tasks (solid) · reviews (dashed) · conflict fixes · QA (dotted); right edge green = merged/approved, red = failed/changes, amber = skipped/bug.</p>
+<input type="checkbox" id="noise"><label class="toggle" for="noise">show progress notes &amp; memory (${noise})</label>
+<div class="phases">${timeline}</div>
+${screen}
+${threads ? `<h2>Conversations <small>agent to agent</small></h2>${threads}` : ""}
 <h2>Who did what</h2>
-<div class="scroll"><table><tr><th>agent</th><th>merged</th><th>failed</th><th>reviews</th><th>msgs out/in</th><th>proposals/critiques</th><th>bugs found/fixed</th><th>takeovers in/out</th><th>tool calls</th><th>time</th><th>tokens</th></tr>${statRows}</table></div>
+<div class="scroll card"><table><tr><th>agent</th><th>merged</th><th>failed</th><th>reviews</th><th>msgs out/in</th><th>proposals/critiques</th><th>bugs found/fixed</th><th>takeovers in/out</th><th>tool calls</th><th>time</th><th>tokens</th></tr>${statRows}</table></div>
 <h2>Who talked to whom <small>row → column</small></h2>
-<div class="scroll"><table>${matrix}</table></div>
-<h2>Timeline</h2>
-<ol class="timeline">${s.items.map(row).join("") || '<li class="sub">nothing happened in this run</li>'}</ol>
+<div class="scroll card"><table>${matrix}</table></div>
+<footer>made by huddle story · one file, no network</footer>
 </main>
 </body>
 </html>
@@ -927,6 +1523,7 @@ export async function runStory(args) {
         console.log(`${C.green("✓")} wrote ${out} ${C.faint(`· one file, no network · ${story.agents.length} lanes, ${story.items.length} events`)}`);
         return;
     }
-    console.log(renderText(story));
+    // A terminal gets lines cut to its width; a file or a pipe gets them whole.
+    console.log(renderText(story, { width: process.stdout.isTTY ? process.stdout.columns || 80 : undefined }));
 }
 //# sourceMappingURL=story.js.map