toolroll 0.9.73 → 0.9.74

package/dist/server/chat.js

@@ -39,7 +39,7 @@ import { html, htmlString, postForm, reauth } from "../html.js";
 import { requestContext } from "./request-context.js";
 import { refuse, screen, whenTime } from "./chrome.js";
 import { chatResultHref, chatReturnWithLatest, chatReturnWithSaid, projectChatHref, redirect, respond, safeChatReturn, safeReturn, taskChatHref, taskHref } from "./http.js";
-import { chatAckPage, chatPage, coordinatorProposalsSection, decisionsFor, leadAfterComposerHtml, leadChatVersion, leadMintCard, leadPage, leadThreadHtml, PHONE_CARD_FACT, TASK_COMPOSER_MODES, taskChatLiveRegion, teamProposalCardParts } from "./render-chat.js";
+import { chatAckPage, chatPage, NOT_STARTED_SESSION, coordinatorProposalsSection, decisionsFor, leadAfterComposerHtml, leadChatVersion, leadMintCard, leadPage, leadThreadHtml, PHONE_CARD_FACT, TASK_COMPOSER_MODES, taskChatLiveRegion, teamProposalCardParts } from "./render-chat.js";
 import {} from "./render-pages.js";
 import { completionForm, hardBlockerOf, homePhaseWords, owedAcceptanceOf, resultPanelHtml } from "./render-results.js";
 import { browserCaller, oneLineUa } from "./session.js";
@@ -54,25 +54,31 @@ export function createChatHandlers(runtime) {
     async function mateStatus(ctx) {
         const { url, response, now } = ctx;
         const who = browserCaller(ctx.who);
-        const session = store.activeLeadSession(who.name);
+        const found = store.activeLeadSession(who.name);
         const principal = leadPrincipal(who);
-        if (session === null || principal === null || session.ceilingDigest !== principal.ceilingDigest || session.approverGeneration !== principal.generation) {
+        // Quiet page visits: a membership conversation not started yet is still a page to keep current (its task's
+        // progress and approval); it reads as session 0, and nothing here starts it.
+        const enabled = chatEnablement();
+        const notStarted = principal !== null && enabled.ok && enabled.billing === "subscription" && (found === null || found.ceilingDigest !== principal.ceilingDigest);
+        const session = notStarted ? null : found;
+        if (principal === null || (!notStarted && (session === null || session.ceilingDigest !== principal.ceilingDigest || session.approverGeneration !== principal.generation))) {
             return respond(response, 200, "application/json", JSON.stringify({ session: null }));
         }
+        const sessionId = session?.id ?? NOT_STARTED_SESSION;
         store.sweepStaleLeadTurns(now);
         const request = url.searchParams.get("request") ?? "";
         // Received: the engine took it, or the lead queue holds it (a queued acknowledgement lost on the way still frees the draft).
-        const received = /^[a-f0-9]{32}$/.test(request) && store.leadRequestReceived(session.id, request);
+        const received = session !== null && /^[a-f0-9]{32}$/.test(request) && store.leadRequestReceived(session.id, request);
         const requestedTask = url.searchParams.get("task");
         const focusTask = requestedTask === null || requestedTask === "" ? null : taskChatFocus(requestedTask, now, who, { mintNonce: false });
         if (requestedTask !== null && requestedTask !== "" && focusTask === null) {
             // The lens's task is gone or no longer admitted: the page keeps its
             // draft and says so; it never falls back to the unified thread.
-            return respond(response, 200, "application/json", JSON.stringify({ session: session.id, task: requestedTask, unavailable: true, received }));
+            return respond(response, 200, "application/json", JSON.stringify({ session: sessionId, task: requestedTask, unavailable: true, received }));
         }
         const chatProject = focusTask !== null ? null : chatProjectOf(url.searchParams.getAll("project").filter(one => one !== ""));
         if (chatProject === undefined)
-            return respond(response, 200, "application/json", JSON.stringify({ session: session.id, unavailable: true, received }));
+            return respond(response, 200, "application/json", JSON.stringify({ session: sessionId, unavailable: true, received }));
         const rows = leadConversationRows(who, principal, focusTask, now, chatProject);
         const version = leadChatVersion({ ...rows, focusTask });
         const known = url.searchParams.get("version") ?? "";
@@ -80,12 +86,12 @@ export function createChatHandlers(runtime) {
         const fragments = known === version
             ? null
             : {
-                thread: htmlString(leadThreadHtml({ ...rows, focusTask, csrf, now, problem: takeLeadNote(csrf, session.id), chatProject })),
+                thread: htmlString(leadThreadHtml({ ...rows, focusTask, csrf, now, problem: takeLeadNote(csrf, session?.id ?? null), chatProject })),
                 after: htmlString(leadAfterComposerHtml({ messages: rows.messages, pending: rows.pending, focusTask })),
                 live: focusTask === null ? null : htmlString(taskChatLiveRegion(focusTask, csrf, true, rows.pending !== null)),
             };
         return respond(response, 200, "application/json", JSON.stringify({
-            session: session.id,
+            session: sessionId,
             task: focusTask?.id ?? "",
             version,
             pending: rows.pending !== null,
@@ -237,24 +243,22 @@ export function createChatHandlers(runtime) {
         // The mate (mate arc §5): while a mate session is live, /chat IS the
         // thread — the same rows the CLI reads. Without one, fleet chat as
         // before, plus the card that mints a session.
-        let leadSession = enabled.ok && who.role === "approver" ? store.activeLeadSession(who.name) : null;
+        const leadSession = enabled.ok && who.role === "approver" ? store.activeLeadSession(who.name) : null;
         const principal = enabled.ok && who.role === "approver" ? leadPrincipal(who) : null;
         // Chat opens ready to talk (2026-09-23): an approver in good standing
-        // needs no second password to start their own conversation. The one
-        // exception to "a GET writes nothing": the strict same-site session
-        // cookie keeps other sites out, and starting spends nothing. Actions
-        // the lead proposes still go through their own confirmation cards.
-        // Membership chat only: it spends no dollars. Direct-API chat keeps a
-        // one-tap Start with its visible spending limit (no password).
+        // needs no second password to start their own conversation. Quiet page
+        // visits (2026-10-27): a visit only shows it. With no membership
+        // conversation yet (or only one under another ceiling), the page shows
+        // the composer and the first message starts one (chatSend); nothing
+        // here writes. Direct-API chat keeps a one-tap Start with its visible
+        // spending limit (no password).
         const settingsView = url.searchParams.get("settings") === "1";
-        if (!settingsView && enabled.ok && enabled.billing === "subscription" && principal !== null && (leadSession === null || leadSession.ceilingDigest !== principal.ceilingDigest) && !requestContext.getStore()?.workspaceRead) {
-            startLeadConversation(who, principal, enabled, 0, false, now);
-            leadSession = store.activeLeadSession(who.name);
-        }
+        const notStarted = !settingsView && enabled.ok && enabled.billing === "subscription" && principal !== null &&
+            (leadSession === null || leadSession.ceilingDigest !== principal.ceilingDigest);
         // A session under another ceiling is not continuable from here; a GET
         // writes nothing (slice-2 review, finding 7) — the mint card below
         // starts a new conversation, and minting ends the old session.
-        const ceilingStale = enabled.ok && leadSession !== null && principal !== null && leadSession.ceilingDigest !== principal.ceilingDigest;
+        const ceilingStale = !notStarted && enabled.ok && leadSession !== null && principal !== null && leadSession.ceilingDigest !== principal.ceilingDigest;
         const catchUp = leadBriefHtml(assignmentCatchUp(store, now, { principal: "operator", repos }, { limit: 6 }, evidenceRoot));
         const chatProjects = repos.map((repo, index) => {
             let peek = null;
@@ -288,11 +292,12 @@ export function createChatHandlers(runtime) {
         const withFirstRun = (shown) => firstRun === undefined && phone === undefined && home === null ? shown
             : { ...shown, ...(home === null ? {} : { refreshSeconds: liveRefreshSeconds() }),
                 workspace: { ...shown.workspace, ...(firstRun === undefined ? {} : { firstRun }), ...(phone === undefined ? {} : { phone }), ...(home === null ? {} : { home }) } };
-        if (enabled.ok && leadSession !== null && principal !== null && !ceilingStale) {
+        if (enabled.ok && principal !== null && (notStarted || (leadSession !== null && !ceilingStale))) {
             {
-                const said = takeLeadNote(who.session.csrf, leadSession.id);
+                const said = takeLeadNote(who.session.csrf, notStarted ? null : leadSession?.id ?? null);
                 return sendScreen(response, 200, withFirstRun(leadPage(chromeFor(null, "chat", undefined, "all"), {
-                    session: leadSession,
+                    session: notStarted ? null : leadSession,
+                    approver: who.name,
                     ...leadConversationRows(who, principal, focusTask, now, chatProject),
                     chatProject,
                     latched,
@@ -663,7 +668,9 @@ export function createChatHandlers(runtime) {
         const body = readForm(posted, CONSOLE_FORMS.leadFollow);
         if (who.via !== "cookie")
             return refuse(response, who, 403, "Open the conversation to change automatic updates.");
-        const principal = leadPrincipal(who), session = store.activeLeadSession(who.name), thread = store.liveLeadThreadFor(who.name);
+        const principal = leadPrincipal(who), session = store.activeLeadSession(who.name);
+        // A conversation its first message started from a task or project page has no main thread yet: this act opens it.
+        const thread = principal && session && session.ceilingDigest === principal.ceilingDigest ? store.openLeadThread(who.name, principal.ceilingDigest, now).thread : null;
         if (!principal || !session || !thread || !configureLeadFollow(store, principal, session, thread, body.get("enabled") === "yes", now))
             return refuse(response, who, 409, "Conversation access changed. Start chat again.", "/chat");
         return redirect(response, safeChatReturn(body.get("return")));
@@ -875,10 +882,52 @@ export function createChatHandlers(runtime) {
         // A live mate session: the message is a mate turn — no password, the
         // session's ceremony already covered it (§1); the engine refuses on
         // its own terms and the thread shows why.
-        const leadSession = who.role === "approver" ? store.activeLeadSession(who.name) : null;
+        let leadSession = who.role === "approver" ? store.activeLeadSession(who.name) : null;
+        // Quiet page visits: a membership conversation starts with its first message, never with a page view. A page
+        // shown before one existed binds its sends to session 0; that send starts it (the same approver standing a visit
+        // used to need), and a retry or double submit of the same request lands in the conversation it started.
+        let startedHere = false;
+        const binding = body.getAll("request-session");
+        const unbound = binding.length === 0 || (binding.length === 1 && binding[0] === String(NOT_STARTED_SESSION));
+        if (who.role === "approver" && enabled.billing === "subscription" && unbound) {
+            const principal = leadPrincipal(who);
+            if (principal === null)
+                return wantsJson ? said(403, "your approver standing changed — sign in again") : refuse(response, who, 403, "your approver standing changed — sign in again", back);
+            const sentRequest = body.get("request");
+            if (sentRequest !== null && (body.getAll("request").length !== 1 || !/^[a-f0-9]{32}$/.test(sentRequest)))
+                return said(409, "This conversation changed. Reload it before sending your message.");
+            const usable = leadSession !== null && leadSession.ceilingDigest === principal.ceilingDigest && leadSession.approverGeneration === principal.generation;
+            // The conversation this very request started, if it started one: a retry or double submit lands only there.
+            const startedBy = sentRequest === null ? null : store.leadStartReceipt(who.name, sentRequest);
+            if (startedBy !== null) {
+                if (!usable || leadSession === null || leadSession.id !== startedBy.session)
+                    return said(409, "This conversation ended or changed. Reload it before sending your message.", leadSession?.id ?? null);
+                startedHere = true;
+            }
+            else if (usable && leadSession !== null) {
+                // A page that showed no conversation never sends into one it did not start.
+                if (binding.length === 1)
+                    return said(409, "This conversation changed. Reload it before sending your message.", leadSession.id);
+            }
+            else {
+                // Nothing starts for a message that would be refused anyway.
+                const message = (body.get("message") ?? "").trim();
+                if (message === "" || message.length > LEAD_MESSAGE_MAX_CHARS)
+                    return said(400, `a message is 1 to ${LEAD_MESSAGE_MAX_CHARS} characters`);
+                if (scanForSecrets(message).length > 0)
+                    return said(400, "that looks like a credential — chat never forwards or stores those");
+                const scope = chatScopeOf(focusTask, chatProject);
+                // The start and its record are one write: a retry finds it, and never starts a second conversation.
+                const started = startLeadConversation(who, principal, enabled, 0, false, now, scope, sentRequest ?? undefined);
+                leadSession = store.activeLeadSession(who.name);
+                if (leadSession === null || leadSession.id !== started)
+                    return said(409, "This conversation changed. Reload it before sending your message.");
+                startedHere = true;
+            }
+        }
         if (leadSession !== null) {
             const sentRequest = body.get("request");
-            if (sentRequest !== null && (body.getAll("request").length !== 1 || body.getAll("request-session").length !== 1 || body.get("request-session") !== String(leadSession.id))) {
+            if (sentRequest !== null && !startedHere && (body.getAll("request").length !== 1 || body.getAll("request-session").length !== 1 || body.get("request-session") !== String(leadSession.id))) {
                 return said(409, "This conversation changed. Reload it before sending your message.");
             }
             // Every send has one identity (a form without one gets it here): a message that waits is known by it.
@@ -1136,16 +1185,18 @@ export function createChatHandlers(runtime) {
         const previous = liveTurns.get(thread);
         if (previous?.expiry)
             clearTimeout(previous.expiry);
-        const live = { steps: [], done: false, ok: false, listeners: previous?.listeners ?? new Set() };
+        const live = { steps: [], done: false, ok: false, listeners: previous?.listeners ?? new Set(), startedAt: clock().getTime(), stepAt: [] };
         liveTurns.set(thread, live);
         // A page that has this conversation open follows the reply (GET /live, its chat room).
         runtime.liveTurnStarted(thread);
-        const current = () => live.steps.at(-1) ?? (live.steps.push({ tools: [], toolCalls: [], text: "" }), live.steps.at(-1));
+        const newStep = () => { live.steps.push({ tools: [], toolCalls: [], text: "" }); live.stepAt.push(clock().getTime()); };
+        const current = () => live.steps.at(-1) ?? (newStep(), live.steps.at(-1));
         const progress = (event) => {
             if (live.done)
                 return;
+            live.turn ??= event.turn;
             if (event.kind === "step")
-                live.steps.push({ tools: [], toolCalls: [], text: "" });
+                newStep();
             else if (event.kind === "tool") {
                 current().tools.push(event.label);
                 current().toolCalls.push({ id: event.id, label: event.label, state: "running" });
@@ -1159,8 +1210,10 @@ export function createChatHandlers(runtime) {
                     }
                 }
             }
-            else if (event.kind === "text")
+            else if (event.kind === "text") {
                 current().text = event.text;
+                (live.confirmed ??= [])[live.steps.length - 1] = event.final === true;
+            }
             for (const listener of live.listeners)
                 listener();
         };
@@ -1175,6 +1228,7 @@ export function createChatHandlers(runtime) {
             return;
         live.done = true;
         live.ok = ok;
+        live.endedAt = clock().getTime();
         for (const listener of live.listeners)
             listener();
         live.expiry = setTimeout(() => { if (liveTurns.get(thread) === live)

package/dist/server/chrome.js

@@ -396,7 +396,7 @@ export function chromeScript() {
         `if(ev.key==="?"){toggleHelp();ev.preventDefault();return;}` +
         `if(ev.key==="j"||ev.key==="k"){rove(ev.key==="j"?1:-1,ev);return;}` +
         `if(pending==="g"){pending=null;` +
-        `var map={b:"/board",i:"/",w:"/workbench",d:"/done",q:"/board?view=order",f:"/fleet",t:"/tasks",a:"/activity",p:"/projects"};` +
+        `var map={b:"/board",i:"/",w:"/workbench",d:"/done",q:"/board?view=order",f:"/fleet",t:"/work",a:"/activity",p:"/projects"};` +
         `if(map[ev.key]){go(map[ev.key]);ev.preventDefault();}return;}` +
         `if(ev.key==="g"){pending="g";setTimeout(function(){pending=null;},800);}});` +
         `})();`);
@@ -717,7 +717,7 @@ export function workToolRows(scoped = false, _offersChat = false, offersCode = f
         ...(offersCode ? [{ key: "code", href: "/term", label: "Live", hint: "your own terminals: Claude Code, Codex or a shell" }] : []),
         { key: "inbox", href: "/inbox", label: "Inbox", hint: "questions, approvals, and repairs to act on" },
         { key: "board", href: "/board", label: "Board", hint: "lanes by state, with the order view" },
-        { key: "tasks", href: "/tasks", label: "Task list", hint: "everything, filterable by state" },
+        { key: "tasks", href: "/work", label: "Task list", hint: "everything, filterable by state" },
         { key: "recipes", href: "/recipes", label: "Recipes", hint: "choose, customize, and reuse a workflow" },
         { key: "workbench", href: "/workbench", label: "Portfolio", hint: "every project and live build in one place" },
         { key: "ledger", href: "/ledger", label: "Action ledger", hint: "who acted, what happened, and the result" },

package/dist/server/console.css

@@ -172,6 +172,30 @@
     color: color-mix(in srgb, var(--running) 72%, var(--foreground)); border-color: var(--border);
   }
   .badge-cut { background: var(--muted); }
+  /* The status chip (components/ui/badge.tsx `size="chip"`, after ReUI's light badge with a dot): 20px, 6px
+     corners, a soft wash, 11.5px words and a 6px dot. Needs you is the amber wash with its words leaned toward ink
+     (4.5:1); the dot is decoration and the word carries the meaning. */
+  .chip {
+    display: inline-flex; align-items: center; gap: .375rem; height: 1.25rem; padding: 0 .375rem; border-radius: var(--so-radius-sm);
+    font-family: var(--font-sans); font-size: .71875rem; font-weight: 500; line-height: 1; white-space: nowrap; vertical-align: middle;
+    background: var(--so-neutral-soft); color: var(--so-ink);
+  }
+  /* Ink words, the tone in the dot (the Agents → Live chip); Needs you keeps amber words leaned toward ink. */
+  .chip-dot { width: .375rem; height: .375rem; flex-shrink: 0; border-radius: var(--so-radius-full); background: var(--so-neutral-ink); }
+  .chip-needs { background: var(--so-warning-soft); color: color-mix(in oklab, var(--so-warning) 85%, var(--so-ink)); }
+  .chip-needs .chip-dot { background: var(--so-warning); }
+  .chip-live { background: var(--so-info-soft); }
+  .chip-live .chip-dot { background: var(--so-info); }
+  .chip-done { background: var(--so-success-soft); }
+  .chip-done .chip-dot { background: var(--so-success); }
+  .chip-failed { background: var(--so-danger-soft); }
+  .chip-failed .chip-dot { background: var(--so-danger); }
+  /* The frame (components/ui/frame.tsx, after ReUI's Frame): a raised well with a hairline, its heading on the
+     well's fill, and paper panels whose corners sit concentric inside it. No shadow on a panel. */
+  .frame { display: flex; flex-direction: column; gap: .25rem; padding: .25rem; border: 1px solid var(--so-line); border-radius: var(--so-radius-card); background: var(--so-raised); }
+  .frame-head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; min-height: 2rem; padding: .25rem .625rem; }
+  .frame-panel { position: relative; border: 1px solid var(--so-line); border-radius: calc(var(--so-radius-card) - .25rem - 1px); background: var(--so-paper); padding: .75rem .875rem; }
+  .frame-panel.waits { border-color: var(--so-warning); }
 
   .card {
     border: 1px solid var(--glass-border); border-radius: var(--radius); background: var(--glass);
@@ -1749,13 +1773,13 @@
      says which way it folds. */
   @media (max-width: 760px) {
     .board { display: flex; flex-direction: column; align-items: stretch; gap: .5rem; padding-bottom: 0; }
-    .board .lane { min-height: 0; padding: 0 .625rem .125rem; }
+    .board .lane { min-height: 0; padding: 0 .25rem .25rem; }
     .board .lane > summary {
       cursor: pointer; display: flex; align-items: center; min-height: 2.75rem; margin: 0;
       -webkit-tap-highlight-color: transparent;
     }
-    .board .lane > summary h2 { flex: 1; font-size: .75rem; }
-    .board .lane > summary .lane-count { border: 1px solid var(--border); border-radius: 999px; padding: .04rem .5rem; margin-left: .25rem; }
+    .board .lane > summary { padding: 0 .375rem; }
+    .board .lane > summary h2 { flex: 1; }
     .board .lane > summary::after {
       content: ""; width: .5rem; height: .5rem; flex: none; margin-right: .25rem;
       border-right: 1.5px solid var(--muted-foreground); border-bottom: 1.5px solid var(--muted-foreground);
@@ -1763,63 +1787,66 @@
     }
     .board .lane[open] > summary::after { transform: rotate(225deg) translateY(-.125rem); }
     .board .lane .hint { margin-bottom: .25rem; }
-    .board .lane .lane-card:last-of-type { margin-bottom: .5rem; }
+    .board .lane .lane-card:last-of-type { margin-bottom: 0; }
     .board .lane-attention { order: 0; }
     .board .lane-building { order: 1; }
     .board .lane-queued { order: 2; }
     .board .lane-waiting { order: 3; }
     .board .lane-done { order: 4; }
   }
+  /* A lane is a frame (components/ui/frame.tsx, after ReUI's Frame): a raised well with a hairline, its head a
+     status chip and a mono count on the well's fill, its cards paper panels at concentric corners. Only the lane
+     that waits on a person is amber: its chip, and each card's thin full outline. No fill, no stripe, no shadow. */
   .lane {
-    background: color-mix(in srgb, var(--card) 45%, var(--background)); border: 1px solid var(--border);
-    border-radius: var(--radius); padding: .625rem; min-height: 12rem;
+    background: var(--so-raised); border: 1px solid var(--so-line);
+    border-radius: var(--so-radius-card); padding: .25rem; min-height: 12rem;
   }
-  .lane > summary { list-style: none; cursor: default; margin: 0 0 .125rem; }
+  .lane > summary { list-style: none; cursor: default; margin: 0; padding: .375rem .375rem .125rem; }
   .lane > summary::-webkit-details-marker { display: none; }
-  .lane h2 { display: flex; align-items: center; gap: .4rem; margin: 0; font-size: .6875rem; }
+  .lane h2 { display: flex; align-items: center; gap: .5rem; margin: 0; font-size: .8125rem; font-weight: 600; }
   .lane h2 a { color: inherit; text-decoration: none; }
   @media (hover: hover) and (pointer: fine) { .lane h2 a:hover { text-decoration: underline; } }
-  .lane .hint { margin-top: 0; }
-  .lane-count { color: var(--muted-foreground); font-weight: 400; font-variant-numeric: tabular-nums; }
-  .lane h2::before {
-    content: ""; width: .375rem; height: .375rem; border-radius: var(--so-radius-full); flex: none;
-    background: var(--muted-foreground); opacity: .55;
-  }
-  .lane-attention h2::before { background: var(--brand); opacity: 1; }
-  .lane-building h2::before { background: var(--running); opacity: 1; }
-  .lane-done h2::before { background: var(--muted-foreground); opacity: 1; }
+  .lane .hint { margin: 0; padding: .125rem .375rem .375rem; }
+  .lane-count { color: var(--muted-foreground); font-family: var(--font-mono); font-size: .6875rem; font-weight: 500; font-variant-numeric: tabular-nums; }
   .lane-card {
-    display: block; text-decoration: none; color: inherit;
-    background: var(--card); border: 1px solid var(--border);
-    border-radius: calc(var(--radius) - 2px); padding: .5rem .625rem; margin-top: .5rem;
-  }
-  @media (hover: hover) and (pointer: fine) { .lane-card:hover { border-color: color-mix(in srgb, var(--border) 55%, var(--muted-foreground)); } }
-  .lane-card .id { display: block; font-family: var(--font-mono); font-size: .6875rem; color: var(--muted-foreground); margin-bottom: .125rem; overflow-wrap: anywhere; }
-  .lane-card .t { display: block; font-size: .8125rem; font-weight: 500; line-height: 1.35; }
+    display: flex; flex-direction: column; text-decoration: none; color: inherit;
+    background: var(--so-paper); border: 1px solid var(--so-line);
+    border-radius: calc(var(--so-radius-card) - .25rem - 1px); padding: .625rem .75rem; margin-top: .25rem;
+  }
+  .lane-attention .lane-card { border-color: var(--so-warning); }
+  /* The order view's columns are frames too, with roomier insides (a form, a note) and a quiet dot by the name. */
+  .lane.queue-column { padding: .5rem; }
+  .queue-column > h2::before { content: ""; width: .375rem; height: .375rem; border-radius: var(--so-radius-full); flex: none; background: var(--muted-foreground); opacity: .55; }
+  @media (hover: hover) and (pointer: fine) { .lane-card:hover { background: var(--so-raised); } }
+  /* The title leads; the task id is a machine fact under it, in mono. */
+  .lane-card .t { display: block; font-size: .84375rem; font-weight: 500; line-height: 1.35; }
+  .lane-card .why { display: block; margin-top: .125rem; font-size: .75rem; color: var(--muted-foreground); }
+  .lane-card .id { display: block; margin-top: .375rem; font-family: var(--font-mono); font-size: .75rem; color: var(--muted-foreground); overflow-wrap: anywhere; }
+  .lane-card .who { display: block; margin-top: .125rem; font-size: .75rem; color: var(--muted-foreground); overflow-wrap: anywhere; }
+  .lane-card .who .mono { display: inline; margin: 0; font-family: var(--font-mono); font-size: .6875rem; }
   .lane-card .dot { margin-right: .4rem; }
   .lane-card .meta, .lane-card .mono { display: block; margin-top: .125rem; font-size: .75rem; }
-  .lane-card .why { display: block; margin-top: .125rem; font-size: .75rem; color: var(--muted-foreground); }
-  /* The facts: mono key–value pairs, keys dim, values ink — one grammar on every lane. */
-  .lane-card .facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: .0625rem .625rem; margin-top: .4rem; font-size: .6875rem; line-height: 1.5; }
+  /* The facts: a muted word, then the value; only a machine's own words (a name, a model, a branch, a clock) are mono. */
+  .lane-card .facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: .0625rem .625rem; margin-top: .25rem; font-size: .75rem; line-height: 1.5; }
   .lane-card .fact { display: contents; }
-  .lane-card .fact .k { color: var(--muted-foreground); font-family: var(--font-mono); }
-  .lane-card .fact .v { font-family: var(--font-mono); color: var(--foreground); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
-  .lane-card .chips { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: .4rem; }
+  .lane-card .fact .k { color: var(--muted-foreground); }
+  .lane-card .fact .v { color: var(--foreground); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
+  .lane-card .fact .v.mono { display: inline; margin: 0; font-family: var(--font-mono); font-size: .6875rem; }
+  .lane-card .chips { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: .5rem; }
   .lane-card .chips .badge { margin: 0; }
-  /* The live strip on a building card: stage and clock in an inset well —
-     the run's own facts, never a percent. */
+  /* The live strip on a building card: the stage in words, the clock in mono, on a sunken well. */
   .lane-card .live-line {
     display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-top: .375rem;
-    padding: .3rem .5rem; border-radius: calc(var(--radius) - 4px); background: var(--muted);
-    font-family: var(--font-mono); font-size: .6875rem; color: var(--running); font-variant-numeric: tabular-nums;
+    padding: .3rem .5rem; border-radius: var(--so-radius-sm); background: var(--so-raised);
+    font-size: .75rem; color: var(--so-info);
   }
-  .lane-card .live-line .clock { color: var(--muted-foreground); }
+  .lane-card .live-line .clock { color: var(--muted-foreground); font-family: var(--font-mono); font-size: .6875rem; font-variant-numeric: tabular-nums; }
   /* The build's steps — set up, writing, checking and committing: three quiet
      ticks, the current one in the running hue. A stage, never a percent. */
   .lane-card .steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .1875rem; margin-top: .5rem; }
-  .lane-card .steps i { height: .1875rem; border-radius: 999px; background: var(--border); }
-  .lane-card .steps i.on { background: color-mix(in srgb, var(--running) 45%, var(--border)); }
-  .lane-card .steps i.now { background: var(--running); }
+  .lane-card .steps i { height: .1875rem; border-radius: var(--so-radius-full); background: var(--so-line); }
+  .lane-card .steps i.on { background: color-mix(in srgb, var(--so-info) 45%, var(--so-line)); }
+  .lane-card .steps i.now { background: var(--so-info); }
 
   /* The worker strip: one quiet tile per worker above the lanes — what it is
      building here, the stage, the clock. Ink and lines only; the running dot
@@ -2613,8 +2640,9 @@ button { min-height: 44px; }
   .chat-workspace.projects-open::before { animation: fade 180ms ease-out; }
   .switcher[open] .switcher-menu { animation: rise 160ms ease-out; }
   @media (hover: hover) and (pointer: fine) {
-    .lane-card, .decide-card, .menu-row, .chat-overview-item, .proposal { transition: border-color .15s, transform .15s, box-shadow .15s; }
-    .lane-card:hover, .decide-card:hover, .menu-row:hover {
+    .lane-card, .decide-card, .menu-row, .chat-overview-item, .proposal { transition: border-color .15s, background-color .15s, transform .15s, box-shadow .15s; }
+    /* Board cards are panels in a frame: a hover fills them raised, never a shadow. */
+    .decide-card:hover, .menu-row:hover {
      
       box-shadow: 0 2px 8px -2px rgb(0 0 0 / .35);
     }

package/dist/server/live.d.ts

@@ -45,6 +45,10 @@ export type LiveRoom = {
 } | {
     kind: "agent";
     run: number;
+}
+/** The Agents view's Live grid (agents-live-room.ts): per viewer, watching only. */
+ | {
+    kind: "agents-live";
 };
 /** A room's name, read strictly: anything else is not a room. */
 export declare function parseLiveRoom(name: string): LiveRoom | null;

package/dist/server/live.js

@@ -9,9 +9,11 @@ import { handlersOf } from "./handler-registry.js";
 import { respond } from "./http.js";
 import { adapterPolicy } from "./route-policy.js";
 import { requestContext } from "./request-context.js";
+import { createAgentsLiveRooms } from "./agents-live-room.js";
+import { leadTilesFor } from "./agents-live-lead.js";
 /** A page asks for a few rooms at once: its workspace, what it shows, its conversation. */
 export const LIVE_ROOMS_PER_PAGE = 6;
-const ROOM_NAME = /^(workspace|task|flow|chat|team|agent|summary)(?::([^?]{1,400}))?(?:\?([^#]{0,600}))?$/;
+const ROOM_NAME = /^(workspace|task|flow|chat|team|agent|summary|agents-live)(?::([^?]{1,400}))?(?:\?([^#]{0,600}))?$/;
 /** At most one workspace nudge a second: a burst of writes is one re-read, the first heard at once. */
 const WORKSPACE_SETTLE_MS = 1_000;
 /** A running reply's preview: at most one snapshot every 80 ms; the last one always goes out. */
@@ -34,6 +36,7 @@ export function parseLiveRoom(name) {
     switch (kind) {
         case "workspace": return key === null && query === undefined ? { kind } : null;
         case "summary": return key === null && query === undefined ? { kind } : null;
+        case "agents-live": return key === null && query === undefined ? { kind } : null;
         case "task": return key !== null && key !== "" && query === undefined ? { kind, task: key } : null;
         case "flow": {
             const flow = Number(key), card = params.get("card");
@@ -92,6 +95,11 @@ export function createLiveHandlers(runtime, live) {
     const chatViewers = new Set();
     // One agent's open view (Agents board): what it shows, keyed by the exact run.
     const agentRooms = createLiveRooms(run => agentRunFingerprint(store, run), null, { bus: live.bus });
+    // The Live grid: one room per viewer and scope, watching only (no lease, no seen mark).
+    // Each Live page's own lead tiles, read as its viewer's saved session now (a page's room key carries the page).
+    const liveLeads = new Map();
+    const agentsLive = createAgentsLiveRooms({ store, bus: live.bus, evidenceRoot: runtime.evidenceRoot, localRunner: runtime.options.localRunner, clock, visible,
+        leads: key => liveLeads.get(key)?.() ?? null, forget: key => liveLeads.delete(key) });
     const readBrowser = (request, who) => rereadBrowser(runtime, request, who);
     const sameBrowser = (request, who) => () => readBrowser(request, who) !== null;
     function admitted(viewer, thread) {
@@ -196,10 +204,11 @@ export function createLiveHandlers(runtime, live) {
         if ([...url.searchParams.keys()].some(key => key !== "room") || names.length === 0 || names.length > LIVE_ROOMS_PER_PAGE || new Set(names).size !== names.length)
             return json(response, 400, { error: "room" });
         const rooms = names.map(name => ({ name, room: parseLiveRoom(name) }));
-        if (rooms.some(one => one.room === null) || rooms.filter(one => one.room?.kind === "agent").length > 1 || rooms.filter(one => one.room?.kind === "workspace").length > 1 || rooms.filter(one => one.room?.kind === "chat").length > 1 || rooms.filter(one => one.room?.kind === "team").length > 1 || rooms.filter(one => one.room?.kind === "summary").length > 1)
+        if (rooms.some(one => one.room === null) || rooms.filter(one => one.room?.kind === "agent").length > 1 || rooms.filter(one => one.room?.kind === "workspace").length > 1 || rooms.filter(one => one.room?.kind === "chat").length > 1 || rooms.filter(one => one.room?.kind === "team").length > 1 || rooms.filter(one => one.room?.kind === "summary").length > 1 || rooms.filter(one => one.room?.kind === "agents-live").length > 1)
             return json(response, 400, { error: "room" });
         // Admit every room before the stream opens, with the answers each page's own stream gave.
         const joins = [];
+        let refusedJoin = false;
         for (const { name, room } of rooms) {
             if (room.kind !== "team" && who.via !== "cookie")
                 return json(response, 403, { error: "session" });
@@ -216,6 +225,33 @@ export function createLiveHandlers(runtime, live) {
                 joins.push(connection => summaryRooms.join(summaryKey(who.name, scope), { name: who.name, room: name, connection,
                     valid: () => signedIn() && live.projectScopeFor(who.name) === scope }));
             }
+            else if (room.kind === "agents-live") {
+                const browser = who;
+                const scope = live.projectScopeFor(who.name);
+                if (scope === null)
+                    return json(response, 404, { error: "agents-live" });
+                const signedIn = sameBrowser(request, browser);
+                const valid = () => signedIn() && live.projectScopeFor(who.name) === scope;
+                joins.push(connection => {
+                    // Proved before the room is made or read: an invalid viewer never causes a look at a file.
+                    let ok = false;
+                    try {
+                        ok = valid();
+                    }
+                    catch {
+                        ok = false;
+                    }
+                    if (!ok) {
+                        connection.send(name, "gone");
+                        refusedJoin = true;
+                        return;
+                    }
+                    // Each page's own room (its key carries this connection): a newcomer is never handed a digest computed earlier.
+                    const key = agentsLive.keyOf(who.name, scope, randomBytes(9).toString("hex"));
+                    liveLeads.set(key, () => { const again = readBrowser(request, browser); return again === null ? null : leadTilesFor(runtime, again); });
+                    agentsLive.rooms.join(key, { name: who.name, room: name, connection, valid });
+                });
+            }
             else if (room.kind === "task") {
                 const browser = who;
                 const family = familyOf(room.task);
@@ -342,6 +378,9 @@ export function createLiveHandlers(runtime, live) {
         for (const join of joins)
             if (connection.open)
                 join(connection);
+        // A page whose only room was refused at its join ends now (`ended`), its keep-alive stopped, not left open.
+        if (refusedJoin && connection.rooms === 0)
+            connection.refuse(() => connection.close());
         request.once("close", () => connection.close());
     }
     const detachChat = live.bus.subscribe(() => {
@@ -357,6 +396,7 @@ export function createLiveHandlers(runtime, live) {
             summaryRooms.close();
             teamRooms.close();
             agentRooms.close();
+            agentsLive.rooms.close();
             for (const viewer of [...chatViewers])
                 viewer.connection.close();
         },