@a-t-h-i/bot-lobby 0.6.3 → 0.6.4

package/src/lobby/layout.ts

@@ -6,6 +6,7 @@
  */
 import { truncateToWidth, wrapTextWithAnsi } from "@earendil-works/pi-tui";
 import { textWidth } from "../width.ts";
+import type { MarkdownStyle } from "./markdown.ts";
 
 /** Colours the lobby uses; a subset of pi's theme so tests can pass a plain stub. */
 export type LobbyColor =
@@ -29,8 +30,8 @@ export interface LobbyTheme {
   bold(text: string): string;
   italic?(text: string): string;
   bg?(color: "selectedBg" | "searchMatchBg" | "userMessageBg", text: string): string;
-  /** Render Markdown to styled lines; plain wrapping without it (tests). */
-  markdown?(text: string, width: number, keep?: boolean): string[];
+  /** Render Markdown to styled lines, in the look of whose words they are; plain wrapping without it (tests). */
+  markdown?(text: string, width: number, keep?: boolean, style?: MarkdownStyle): string[];
   /** Strike text through (an abandoned task's title); plain without it (tests). */
   strike?(text: string): string;
 }
@@ -184,8 +185,8 @@ export function spinner(tick: number): string {
 }
 
 /** Markdown for plans, reports and replies: the theme's renderer, or headings bold without their `#` and the rest wrapped. */
-export function markdownLines(text: string, width: number, theme?: LobbyTheme, keep = true): string[] {
-  if (theme?.markdown) return theme.markdown(text, width, keep);
+export function markdownLines(text: string, width: number, theme?: LobbyTheme, keep = true, style: MarkdownStyle = "reply"): string[] {
+  if (theme?.markdown) return theme.markdown(text, width, keep, style);
   return text.split("\n").flatMap((line) => {
     const heading = /^#{1,6}\s+(.*)$/.exec(line);
     return wrap(heading ? bold(theme, paint(theme, "mdHeading", heading[1]!)) : line, width);
@@ -193,9 +194,9 @@ export function markdownLines(text: string, width: number, theme?: LobbyTheme, k
 }
 
 /** Markdown behind a hanging lead (`oracle ▸ `): the first line carries the lead, the rest align under it. */
-export function markdownHanging(lead: string, text: string, width: number, theme?: LobbyTheme): string[] {
+export function markdownHanging(lead: string, text: string, width: number, theme?: LobbyTheme, style: MarkdownStyle = "reply"): string[] {
   const indent = textWidth(lead);
-  const body = markdownLines(text, Math.max(1, width - indent), theme);
+  const body = markdownLines(text, Math.max(1, width - indent), theme, true, style);
   if (body.length === 0) return [lead];
   return body.map((line, index) => (index === 0 ? `${lead}${line}` : line ? `${" ".repeat(indent)}${line}` : ""));
 }
@@ -211,6 +212,18 @@ export interface BoxOptions {
   scroll?: { total: number; start: number };
 }
 
+/** An entry of a pane (a message, a thought, an activity line) and how many lines run from its first line to the pane's end. */
+export interface PaneMark {
+  entry: object;
+  below: number;
+}
+
+/** A pane that measures what arrives below: its newest entry now, and the lines that arrived below the one marked the frame before. */
+export interface PaneFollow {
+  mark?: PaneMark;
+  grew: number;
+}
+
 /** A scrollable pane as a render laid it out: its box in body cells, and its content against its rows. */
 export interface PaneBox {
   top: number;
@@ -220,14 +233,20 @@ export interface PaneBox {
   /** Lines of content, and rows showing them at once. */
   total: number;
   rows: number;
+  /**
+   * Set by panes whose total is estimated: lines that arrived below since the
+   * frame before, measured from an entry, not from the total (which moves as
+   * scrolling draws more or fewer of the entries it estimates).
+   */
+  follow?: PaneFollow;
 }
 
 /** Scrollable panes by name, filled in by a tab's render so the lobby can clamp offsets and route the wheel. */
 export type PaneLayout = Map<string, PaneBox>;
 
 /** Record a pane that sits at `top`/`left` in the body, `width` × `height`, showing `total` lines. */
-export function notePane(panes: PaneLayout | undefined, name: string, top: number, left: number, width: number, height: number, total: number): void {
-  panes?.set(name, { top, left, width, height, total, rows: Math.max(0, height - 2) });
+export function notePane(panes: PaneLayout | undefined, name: string, top: number, left: number, width: number, height: number, total: number, follow?: PaneFollow): void {
+  panes?.set(name, { top, left, width, height, total, rows: Math.max(0, height - 2), ...(follow ? { follow } : {}) });
 }
 
 /** First line of a top-anchored pane scrolled `offset` lines down, stopping when its last line shows. */

package/src/lobby/markdown.ts

@@ -5,10 +5,37 @@
  * text, since the lobby repaints many times a second.
  */
 import { getMarkdownTheme } from "@earendil-works/pi-coding-agent";
-import { Markdown, stripTerminalSequences, type MarkdownTheme } from "@earendil-works/pi-tui";
+import { Markdown, stripTerminalSequences, type DefaultTextStyle, type MarkdownOptions, type MarkdownTheme } from "@earendil-works/pi-tui";
+
+/**
+ * Whose words a piece of Markdown is, which sets how its plain text reads, as
+ * pi draws the same things: an agent's reply in the theme's text colour, your
+ * own words in yours (list markers and backslash escapes kept as typed), a
+ * thought dimmed and in italics.
+ */
+export type MarkdownStyle = "reply" | "you" | "thought";
+
+/** The plain-text look of each style but a reply; the lobby takes them from the session's theme. */
+export type MarkdownStyles = Partial<Record<Exclude<MarkdownStyle, "reply">, DefaultTextStyle>>;
 
 /** Markdown rendered to lines at a width; `keep: false` for text seen once (a reply still streaming), so it does not crowd the cache. */
-export type MarkdownRenderer = (text: string, width: number, keep?: boolean) => string[];
+export type MarkdownRenderer = (text: string, width: number, keep?: boolean, style?: MarkdownStyle) => string[];
+
+/** How pi renders what you write: your ordered-list markers and backslash escapes stay as you typed them. */
+const YOUR_WORDS: MarkdownOptions = { preserveOrderedListMarkers: true, preserveBackslashEscapes: true };
+
+/**
+ * Line breaks a model wrote out as `\n` (text escaped twice on its way here,
+ * so a whole plan arrives as one line): made real when the text has no real
+ * line break at all, outside inline code, where `\n` is usually meant.
+ */
+export function unescapeBreaks(text: string): string {
+  if (text.includes("\n") || !text.includes("\\n")) return text;
+  return text
+    .split(/(`[^`\n]*`)/)
+    .map((part, index) => (index % 2 === 1 ? part : part.replace(/(?:\\r)?\\n/g, "\n")))
+    .join("");
+}
 
 /** A heading line as pi renders it: optional styling, then `#`…`######` and a space. */
 const HEADING_HASHES = /^((?:\x1b\[[0-9;]*m)*)#{1,6} ((?:\x1b\[[0-9;]*m)*)/;
@@ -29,10 +56,10 @@ export const CACHE_LIMIT = 512;
  * theme object on every call, so the theme is taken once, here: a theme
  * switch makes a new renderer (the lobby keeps one per pi theme).
  */
-export function createMarkdownRenderer(theme: MarkdownTheme = getMarkdownTheme()): MarkdownRenderer {
+export function createMarkdownRenderer(theme: MarkdownTheme = getMarkdownTheme(), styles: MarkdownStyles = {}): MarkdownRenderer {
   const cache = new Map<string, string[]>();
-  return (text, width, keep = true) => {
-    const key = `${width}\0${text}`;
+  return (text, width, keep = true, style = "reply") => {
+    const key = `${style}\0${width}\0${text}`;
     const hit = cache.get(key);
     if (hit) {
       // Most recently used last, so the oldest is the one dropped.
@@ -40,7 +67,10 @@ export function createMarkdownRenderer(theme: MarkdownTheme = getMarkdownTheme()
       cache.set(key, hit);
       return hit;
     }
-    const lines = new Markdown(text, 0, 0, theme).render(Math.max(1, width)).map((line) => tidyHeading(line.trimEnd(), theme.bold));
+    const look = style === "reply" ? undefined : styles[style];
+    const lines = new Markdown(unescapeBreaks(text), 0, 0, theme, look, style === "you" ? YOUR_WORDS : undefined)
+      .render(Math.max(1, width))
+      .map((line) => tidyHeading(line.trimEnd(), theme.bold));
     // Drop the blank lines pi pads the render with at either end.
     while (lines.length > 0 && !lines[0]!.trim()) lines.shift();
     while (lines.length > 0 && !lines.at(-1)!.trim()) lines.pop();

package/src/lobby/planner.ts

@@ -37,7 +37,7 @@ import { fellShort, profileLabel, type EffortRouter, type EffortScore } from "..
 
 /** Seats and the oracle read the repository to ask informed questions; they never edit. */
 export const PLANNER_TOOLS: readonly string[] = ["read", "grep", "find", "ls"];
-/** RESEARCH also gets the web tools (from pi-web-access; pi ignores them when it is not installed). */
+/** RESEARCH also gets bot-lobby's web tools (src/web/tools.ts). */
 export const RESEARCH_PANEL_TOOLS: readonly string[] = [...PLANNER_TOOLS, "web_search", "fetch_content", "source_check", "get_search_content"];
 
 /** The chair of the panel, as the Plan tab, the feed and the metrics name it. */

package/src/lobby/quickfix.ts

@@ -9,6 +9,7 @@ import { loadPrompt } from "../prompts/loader.ts";
 import { runPiAgent, spawnPiProcess, type PiStreamEvent, type ProcessRunner } from "../execution/pi-runner.ts";
 import { describeToolCall } from "../pi/activity.ts";
 import { appendMetrics, type MetricRecord } from "../state/metrics.ts";
+import { appendChange, EditLog } from "../state/changes.ts";
 import type { LobbyFeed } from "./feed.ts";
 import type { FileHinter } from "../classifier/files.ts";
 import type { Classifier } from "../classifier/classifier.ts";
@@ -51,6 +52,8 @@ export interface QuickFixJob {
   /** The classifier routed it down (`trivial 0.88: p/big · low → p/cheap · low`); cleared when it re-ran on the configured profile. */
   route?: string;
   routedFrom?: string;
+  /** Files it changed with `edit`/`write`, as shown (relative to the project); the change ledger lets a running task's QA gate tell them from its own. */
+  files?: string[];
 }
 
 export interface QuickFixProfile {
@@ -103,6 +106,7 @@ export class QuickFixQueue {
   jobs: QuickFixJob[] = [];
   private readonly deps: QuickFixDeps;
   private readonly controllers = new Map<string, AbortController>();
+  private readonly edits = new Map<string, EditLog>();
   private counter = 0;
 
   constructor(deps: QuickFixDeps) {
@@ -188,6 +192,8 @@ export class QuickFixQueue {
     const now = Date.now();
     if (event.type === "tool_execution_start") {
       job.tools += 1;
+      const edits = this.edits.get(job.id);
+      if (edits?.note(event.toolName, event.args)) job.files = edits.shown();
       this.addStep(job, describeToolCall(event.toolName, event.args), now);
     } else if (event.type === "turn_start") job.turns += 1;
     else if (event.type === "thought") this.deps.feed?.thought(QUICK_FIX_SOURCE, event.text, now);
@@ -211,6 +217,7 @@ export class QuickFixQueue {
       return this.hold(job, held);
     }
     this.deps.feed?.log(QUICK_FIX_SOURCE, `started: ${jobTitle(job)}`, "info", job.startedAt);
+    this.edits.set(job.id, new EditLog(this.deps.cwd));
     try {
       const [likely, route] = await Promise.all([this.likely(job.prompt, controller.signal), this.route(job.prompt, profile, controller.signal)]);
       const attempt = (model: string | undefined, thinking: string) => runPiAgent(
@@ -309,6 +316,20 @@ export class QuickFixQueue {
   private finish(job: QuickFixJob): void {
     job.finishedAt = Date.now();
     for (const step of job.steps) step.pending = false;
+    const edited = this.edits.get(job.id)?.list() ?? [];
+    this.edits.delete(job.id);
+    // Whatever it edited, even when it failed, is on record for a task's QA gate as the user's own request.
+    if (edited.length > 0) {
+      appendChange(this.deps.root, this.deps.configDir, {
+        source: "quickfix",
+        id: job.id,
+        what: jobTitle(job),
+        files: edited,
+        startedAt: new Date(job.startedAt ?? job.createdAt).toISOString(),
+        finishedAt: new Date(job.finishedAt).toISOString(),
+        status: job.status,
+      });
+    }
     this.deps.feed?.end(job.id, job.status !== "success");
     const ok = job.status === "success";
     const outcome = ok ? "done" : `${job.status}${job.error ? ` — ${job.error.split("\n")[0]}` : ""}`;

package/src/lobby/runtime.ts

@@ -6,8 +6,8 @@
  * turn into the feed, passes plan comments to the Master that owns a task and
  * records each Master turn in the metrics log.
  */
-import type { ExtensionAPI, ExtensionContext, Theme } from "@earendil-works/pi-coding-agent";
-import { getMarkdownTheme, getSelectListTheme, SessionManager } from "@earendil-works/pi-coding-agent";
+import type { ExtensionAPI, ExtensionContext } from "@earendil-works/pi-coding-agent";
+import { getSelectListTheme, SessionManager } from "@earendil-works/pi-coding-agent";
 import { Key, type OverlayHandle, type TUI } from "@earendil-works/pi-tui";
 import { TERMINAL_STATES, type Task } from "../schemas/task.ts";
 import { loadTask, peekTasks } from "../state/persistence.ts";
@@ -33,15 +33,15 @@ import { classifier, effortFor, hintsFor } from "../classifier/instance.ts";
 import { checkThinking } from "../pi/model-support.ts";
 import { launchPi, SessionRegistry, type BackgroundSession, type SessionLauncher } from "./sessions.ts";
 import { SessionChats } from "./session-files.ts";
-import { answerMessage, dialogAsker, loadAskTool, questionnaires, toolAsker, type Asker } from "./ask.ts";
+import { answerMessage, askUser, questionnaires, type Asker } from "./ask.ts";
 import { QuickFixQueue } from "./quickfix.ts";
 import { PlanningSession, type PlannerSeed } from "./planner.ts";
 import { execCommand, IssuesState } from "./issues.ts";
 import { LobbyView, type LiveSession, type LobbyHost, type SwitchTarget, type TabId } from "./view.ts";
-import type { LobbyTheme } from "./layout.ts";
-import { createMarkdownRenderer } from "./markdown.ts";
+import { lobbyTheme } from "./theme.ts";
 import { deliverComments, onOwnerEvent, setAuto } from "../pi/owner.ts";
 import { openEntrySettings, openSettings } from "../pi/settings-ui.ts";
+import { budgetClock } from "../state/budget.ts";
 
 export const ANCHOR_KEY = "bot-lobby-anchor";
 export { deliverComments };
@@ -62,8 +62,8 @@ interface Runtime {
   planner?: PlanningSession;
   issues: IssuesState;
   unsubscribeFeed?: () => void;
-  /** The ask-user-question tool (or pi's dialogs), loaded once on first use. */
-  asker?: Promise<Asker>;
+  /** Puts the panel's questions to the user: the questionnaire unless a test sets another. */
+  asker?: Asker;
   /** A questionnaire is on screen. */
   asking: boolean;
   /** The lobby turned the terminal's mouse reporting on (pi's regular screen only). */
@@ -425,7 +425,9 @@ function deleteTask(state: Runtime, taskId: string, where: "list" | "archive"):
 
 /** A task's status box without animations, for a session other than this window's. */
 function taskScene(state: Runtime, task: Task, width: number, height: number): string[] {
-  return panelLines(task, persistedRuns(task), Date.now(), false, { width, rows: Math.floor(height / 0.75), still: true, theme: state.ctx.ui.theme });
+  const now = Date.now();
+  const time = budgetClock(state.root, state.configDir, task.id, now);
+  return panelLines(task, persistedRuns(task), now, false, { width, rows: Math.floor(height / 0.75), still: true, theme: state.ctx.ui.theme, ...(time ? { time } : {}) });
 }
 
 function seatProfile(state: Runtime, member: PanelMember) {
@@ -463,10 +465,9 @@ function newPlanner(state: Runtime, seed?: PlannerSeed, seats?: readonly PanelMe
   return state.planner;
 }
 
-/** The library's questionnaire when it loads, pi's own dialogs otherwise. */
-function panelAsker(state: Runtime): Promise<Asker> {
-  state.asker ??= loadAskTool(state.pi).then((tool) => (tool ? toolAsker(tool) : dialogAsker()));
-  return state.asker;
+/** The questionnaire (pi's own dialogs where it cannot be drawn); tests swap it. */
+function panelAsker(state: Runtime): Asker {
+  return state.asker ?? askUser;
 }
 
 /**
@@ -483,7 +484,7 @@ export async function answerPanel(state: Runtime | undefined = runtime): Promise
   if (state.asking) return "the questions are already open";
   state.asking = true;
   try {
-    const asker = await panelAsker(state);
+    const asker = panelAsker(state);
     const chunks = questionnaires(session.questions);
     for (let index = session.answered.length; index < chunks.length; index++) {
       const result = await asker(chunks[index]!, state.ctx);
@@ -508,29 +509,6 @@ export async function answerPanel(state: Runtime | undefined = runtime): Promise
   }
 }
 
-const lobbyThemes = new WeakMap<Theme, LobbyTheme>();
-
-/**
- * pi's theme as the lobby draws with it, plus Markdown rendering; one wrapper
- * (and one Markdown renderer with its cache) per theme, so caches stay warm
- * and a theme switch starts fresh.
- */
-function lobbyTheme(theme: Theme): LobbyTheme {
-  let wrapped = lobbyThemes.get(theme);
-  if (!wrapped) {
-    wrapped = {
-      fg: (color, text) => theme.fg(color, text),
-      bold: (text) => theme.bold(text),
-      italic: (text) => theme.italic(text),
-      bg: (color, text) => theme.bg(color, text),
-      markdown: createMarkdownRenderer(getMarkdownTheme()),
-      strike: (text) => theme.strikethrough(text),
-    };
-    lobbyThemes.set(theme, wrapped);
-  }
-  return wrapped;
-}
-
 function host(state: Runtime, tui: TUI): LobbyHost {
   return {
     rows: () => tui.terminal.rows,

package/src/lobby/tabs/home.ts

@@ -10,7 +10,7 @@ import type { Task } from "../../schemas/task.ts";
 import type { ActivityEntry, ChatEntry, ThoughtEntry } from "../feed.ts";
 import type { LobbyPanel } from "../../schemas/configuration.ts";
 import { markdownBlocks } from "../markdown.ts";
-import { beside, bold, box, clock, fill, fit, italic, markdownLines, notePane, paint, since, spinner, wrap, wrapHanging, type LobbyColor, type LobbyTheme, type PaneLayout } from "../layout.ts";
+import { beside, bold, box, clock, fill, fit, italic, markdownLines, notePane, paint, since, spinner, wrap, wrapHanging, type LobbyColor, type LobbyTheme, type PaneLayout, type PaneMark } from "../layout.ts";
 
 /** The Lobby tab's scrollable panes. */
 export const HOME_PANES = ["conversation", "activity", "thinking"] as const;
@@ -36,6 +36,8 @@ export interface HomeInput {
   focus?: HomePane;
   /** Filled with where each pane landed and how much it holds. */
   panes?: PaneLayout;
+  /** Each pane's newest entry as the frame before marked it, so the pane can measure what arrived below since. */
+  anchors?: ReadonlyMap<string, PaneMark>;
   tick: number;
   now: number;
   /** Which panes show. */
@@ -144,18 +146,20 @@ export function speakerLine(speaker: Speaker, width: number, theme?: LobbyTheme,
 
 /**
  * What you wrote: a bubble on the right, only as wide as its longest line (up
- * to `YOU_SHARE` of the pane), your words in the accent colour on pi's
- * user-message background — or, where the theme has no background, closed
- * by a bar in that colour.
+ * to `YOU_SHARE` of the pane), your words in Markdown as pi renders them, in
+ * the accent colour on pi's user-message background — or, where the theme
+ * has no background, closed by a bar in that colour.
  */
 export function youLines(text: string, width: number, theme?: LobbyTheme): string[] {
   const most = Math.max(1, messageWidth(width, YOU_SHARE, 4) - 2);
-  const lines = wrap(text, most);
+  // The renderer colours your words itself; without one (tests) they are wrapped and painted here.
+  const rendered = theme?.markdown ? markdownLines(text, most, theme, true, "you") : wrap(text, most).map((line) => paint(theme, "accent", line));
+  const lines = rendered.length > 0 ? rendered : [""];
   const inner = Math.max(1, ...lines.map((line) => textWidth(line)));
   const pad = " ".repeat(Math.max(0, width - inner - 2));
   const bubble = theme?.bg
-    ? (line: string) => theme.bg!("userMessageBg", ` ${fit(paint(theme, "accent", line), inner)} `)
-    : (line: string) => `${fit(paint(theme, "accent", line), inner)} ${paint(theme, "accent", "▐")}`;
+    ? (line: string) => theme.bg!("userMessageBg", ` ${fit(line, inner)} `)
+    : (line: string) => `${fit(line, inner)} ${paint(theme, "accent", "▐")}`;
   return lines.map((line) => `${pad}${bubble(line)}`);
 }
 
@@ -181,25 +185,19 @@ function openBlockLines(text: string, width: number, theme: LobbyTheme | undefin
 }
 
 /**
- * The newest `need` lines (or a few more) of the reply the oracle is still
- * writing. It is drawn block by block (see `markdownBlocks`): finished blocks
- * come from the Markdown cache, only the one being written is rendered on
- * each frame, and blocks above what the pane shows are not drawn at all.
+ * The reply the oracle is still writing. It is drawn block by block (see
+ * `markdownBlocks`): finished blocks come from the Markdown cache and only the
+ * one being written is rendered on each frame. It is drawn whole (it is
+ * capped at `MAX_REPLY_TEXT`), so the pane knows exactly how far it reaches.
  */
-function liveLines(text: string, width: number, theme: LobbyTheme | undefined, need: number): string[] {
+function liveLines(text: string, width: number, theme: LobbyTheme | undefined): string[] {
   const blocks = markdownBlocks(text);
-  const parts: string[][] = [];
-  let count = 0;
-  for (let index = blocks.length - 1; index >= 0 && count < need; index -= 1) {
-    const lines = index === blocks.length - 1 ? openBlockLines(blocks[index]!, width, theme) : oracleLines(blocks[index]!, width, theme);
-    if (lines.length === 0) continue;
-    parts.push(lines);
-    count += lines.length + 1;
-  }
   const lines: string[] = [];
-  for (let part = parts.length - 1; part >= 0; part -= 1) {
+  for (let index = 0; index < blocks.length; index += 1) {
+    const block = index === blocks.length - 1 ? openBlockLines(blocks[index]!, width, theme) : oracleLines(blocks[index]!, width, theme);
+    if (block.length === 0) continue;
     if (lines.length > 0) lines.push("");
-    for (const line of parts[part]!) lines.push(line);
+    for (const line of block) lines.push(line);
   }
   return lines;
 }
@@ -218,6 +216,20 @@ export function eventLines(text: string, at: number, width: number, theme?: Lobb
 export interface PaneLines {
   lines: string[];
   total: number;
+  /** The newest entry and how many lines run from its first line to the end, for the next frame to measure against. */
+  mark?: PaneMark;
+  /** Lines that arrived below the anchor passed in since it was marked; absent when it is no longer there. */
+  grew?: number;
+}
+
+/**
+ * Where the anchor (an entry the frame before marked) sits in `entries`, so
+ * drawing goes on at least that far back; `entries.length` when it is gone.
+ * It is nearly always the last entry, so the search from the end is short.
+ */
+function reachOf<T extends object>(entries: readonly T[], anchor: PaneMark | undefined): { found: number; reach: number } {
+  const found = anchor ? entries.lastIndexOf(anchor.entry as T) : -1;
+  return { found, reach: found < 0 ? entries.length : found };
 }
 
 /** A message's drawn lines, kept until the pane's width, the theme or its grouping changes. */
@@ -259,6 +271,18 @@ function entryBlock(entry: ChatEntry, before: ChatEntry | undefined, width: numb
   return lines;
 }
 
+export interface ChatTailOptions {
+  /** The reply the oracle is still writing. */
+  live?: string;
+  /** The oracle's turn is running. */
+  busy?: boolean;
+  tick?: number;
+  /** Tops a conversation that has earlier messages still to load. */
+  older?: string;
+  /** The newest message as the frame before marked it: drawing reaches at least back to it, to measure what arrived below. */
+  anchor?: PaneMark;
+}
+
 /**
  * The newest `need` lines of the conversation, like a chat: your messages as
  * bubbles on the right, the oracle's replies in Markdown on the left, each
@@ -269,7 +293,8 @@ function entryBlock(entry: ChatEntry, before: ChatEntry | undefined, width: numb
  * whole conversation has been drawn. `older` tops a conversation that has
  * earlier messages still to load.
  */
-export function chatTail(chat: readonly ChatEntry[], width: number, theme: LobbyTheme | undefined, need: number, live?: string, busy = false, tick = 0, older?: string): PaneLines {
+export function chatTail(chat: readonly ChatEntry[], width: number, theme: LobbyTheme | undefined, need: number, options: ChatTailOptions = {}): PaneLines {
+  const { live, busy = false, tick = 0, older, anchor } = options;
   const parts: string[][] = [];
   let count = 0;
   const add = (lines: string[]) => {
@@ -277,10 +302,18 @@ export function chatTail(chat: readonly ChatEntry[], width: number, theme: Lobby
     count += lines.length + (parts.length > 0 ? 1 : 0);
     parts.push(lines);
   };
-  if (live?.trim()) add([speakerLine("oracle", width, theme, `${spinner(tick)} writing`), ...liveLines(live.trim(), width, theme, need)]);
+  if (live?.trim()) add([speakerLine("oracle", width, theme, `${spinner(tick)} writing`), ...liveLines(live.trim(), width, theme)]);
   else if (busy) add([speakerLine("oracle", width, theme, `${spinner(tick)} working…`)]);
+  const { found, reach } = reachOf(chat, anchor);
+  let mark: PaneMark | undefined;
+  let grew: number | undefined;
   let index = chat.length - 1;
-  for (; index >= 0 && count < need; index -= 1) add(entryBlock(chat[index]!, chat[index - 1], width, theme));
+  for (; index >= 0 && (count < need || index >= reach); index -= 1) {
+    const entry = chat[index]!;
+    add(entryBlock(entry, chat[index - 1], width, theme));
+    if (index === chat.length - 1) mark = { entry, below: count };
+    if (index === found) grew = count - anchor!.below;
+  }
   const drawn = chat.length - 1 - index;
   if (index < 0 && older) add(wrap(paint(theme, "dim", older), width));
   const lines: string[] = [];
@@ -291,12 +324,12 @@ export function chatTail(chat: readonly ChatEntry[], width: number, theme: Lobby
   // Messages not drawn yet count at the average height of those that were.
   const rest = index + 1;
   const total = rest > 0 && drawn > 0 ? lines.length + Math.ceil((rest * lines.length) / drawn) : lines.length;
-  return { lines, total };
+  return { lines, total, ...(mark ? { mark } : {}), ...(grew !== undefined ? { grew } : {}) };
 }
 
 /** The whole conversation drawn (the session browser's preview and tests; the Lobby tab draws only what shows). */
 export function chatLines(chat: readonly ChatEntry[], width: number, theme?: LobbyTheme, live?: string, busy = false, tick = 0): string[] {
-  return chatTail(chat, width, theme, Number.POSITIVE_INFINITY, live, busy, tick).lines;
+  return chatTail(chat, width, theme, Number.POSITIVE_INFINITY, { ...(live ? { live } : {}), busy, tick }).lines;
 }
 
 function emptyChat(input: HomeInput, width: number, theme?: LobbyTheme): string[] {
@@ -334,19 +367,27 @@ function whole(lines: string[]): PaneLines {
   return { lines, total: lines.length };
 }
 
-function conversation(input: HomeInput, chat: readonly ChatEntry[], width: number, need: number, theme?: LobbyTheme): PaneLines {
+function conversation(input: HomeInput, chat: readonly ChatEntry[], width: number, need: number, anchor: PaneMark | undefined, theme?: LobbyTheme): PaneLines {
   const searching = Boolean(input.query);
   const live = searching ? undefined : input.liveReply;
   const busy = !searching && input.busy;
   if (chat.length === 0 && !live && !busy) return whole(emptyChat(input, width, theme));
-  return chatTail(chat, width, theme, need, live, busy, input.tick, searching ? undefined : input.olderNote);
+  const older = searching ? undefined : input.olderNote;
+  return chatTail(chat, width, theme, need, { ...(live ? { live } : {}), busy, tick: input.tick, ...(older ? { older } : {}), ...(anchor ? { anchor } : {}) });
 }
 
 /** The newest `need` activity lines (one per entry), drawn only as far back as the pane shows. */
-function activity(input: HomeInput, entries: readonly ActivityEntry[], width: number, need: number, theme?: LobbyTheme): PaneLines {
+function activity(input: HomeInput, entries: readonly ActivityEntry[], width: number, need: number, anchor: PaneMark | undefined, theme?: LobbyTheme): PaneLines {
   if (entries.length === 0) return whole(wrap(paint(theme, "dim", input.query ? `No activity matches "${input.query}".` : input.activityNote ?? "No activity yet."), width));
   const shown = Number.isFinite(need) ? entries.slice(-Math.max(0, need)) : entries;
-  return { lines: shown.map((entry) => activityLine(entry, width, input.tick, theme)), total: entries.length };
+  // One line per entry: where the anchor sits is a count, nothing needs drawing to find it.
+  const { found } = reachOf(entries, anchor);
+  return {
+    lines: shown.map((entry) => activityLine(entry, width, input.tick, theme)),
+    total: entries.length,
+    mark: { entry: entries.at(-1)!, below: 1 },
+    ...(found >= 0 ? { grew: entries.length - found - anchor!.below } : {}),
+  };
 }
 
 /** The last `rows` lines, `offset` lines back from the newest (clamped), and where they start. */
@@ -381,8 +422,9 @@ export function currentThought(thoughts: readonly ThoughtEntry[]): ThoughtEntry
  */
 const thoughtBlocks = new WeakMap<object, WeakMap<ThoughtEntry, { width: number; text: string; lines: string[]; at: number }>>();
 
-/** A live thought this long is wrapped again at most every `LONG_THOUGHT_MS` while it streams. */
+/** A live thought this long is wrapped again at most every `LONG_THOUGHT_MS` while it streams; rendered as Markdown (costlier), from `LONG_THOUGHT_MARKDOWN`. */
 const LONG_THOUGHT = 1000;
+const LONG_THOUGHT_MARKDOWN = 300;
 const LONG_THOUGHT_MS = 150;
 
 function thoughtBlock(thought: ThoughtEntry, width: number, theme?: LobbyTheme): string[] {
@@ -393,28 +435,49 @@ function thoughtBlock(thought: ThoughtEntry, width: number, theme?: LobbyTheme):
   }
   const hit = cache.get(thought);
   const now = performance.now();
-  if (hit && hit.width === width && (hit.text === thought.text || (thought.live && thought.text.length > LONG_THOUGHT && now - hit.at < LONG_THOUGHT_MS))) return hit.lines;
+  const long = theme?.markdown ? LONG_THOUGHT_MARKDOWN : LONG_THOUGHT;
+  if (hit && hit.width === width && (hit.text === thought.text || (thought.live && thought.text.length > long && now - hit.at < LONG_THOUGHT_MS))) return hit.lines;
   const lead = `${paint(theme, sourceColor(thought.source), thought.source.padEnd(SOURCE_WIDTH).slice(0, SOURCE_WIDTH))} `;
-  const lines = wrapHanging(lead, italic(theme, paint(theme, "dim", thought.text.replace(/\s*\n\s*/g, " "))), width);
+  const lines = theme?.markdown ? thoughtMarkdown(lead, thought, width, theme) : wrapHanging(lead, italic(theme, paint(theme, "dim", thought.text.replace(/\s*\n\s*/g, " "))), width);
   cache.set(thought, { width, text: thought.text, lines, at: now });
   return lines;
 }
 
-/** The newest `need` lines of the thoughts, oldest first: only the thoughts they reach are drawn, and the rest estimated. */
-export function thoughtTail(thoughts: readonly ThoughtEntry[], width: number, theme: LobbyTheme | undefined, need: number): PaneLines {
+/**
+ * A thought in Markdown as pi shows thinking (dimmed, in italics), after who
+ * thought it: a model's `**Checking the plan**` reads bold, not starred. The
+ * pane is small, so the blank lines between paragraphs are left out. A live
+ * thought is not kept in the renderer's cache; it changes as it streams.
+ */
+function thoughtMarkdown(lead: string, thought: ThoughtEntry, width: number, theme: LobbyTheme): string[] {
+  const indent = " ".repeat(textWidth(lead));
+  const body = markdownLines(thought.text, Math.max(1, width - textWidth(lead)), theme, !thought.live, "thought").filter((line) => line.trim());
+  if (body.length === 0) return [lead];
+  return body.map((line, index) => `${index === 0 ? lead : indent}${line}`);
+}
+
+/** The newest `need` lines of the thoughts, oldest first: only the thoughts they reach are drawn (and back to `anchor`), and the rest estimated. */
+export function thoughtTail(thoughts: readonly ThoughtEntry[], width: number, theme: LobbyTheme | undefined, need: number, anchor?: PaneMark): PaneLines {
   const parts: string[][] = [];
   let count = 0;
+  const { found, reach } = reachOf(thoughts, anchor);
+  let mark: PaneMark | undefined;
+  let grew: number | undefined;
   let index = thoughts.length - 1;
-  for (; index >= 0 && count < need; index -= 1) {
-    const lines = thoughtBlock(thoughts[index]!, width, theme);
+  for (; index >= 0 && (count < need || index >= reach); index -= 1) {
+    const thought = thoughts[index]!;
+    const lines = thoughtBlock(thought, width, theme);
     parts.push(lines);
     count += lines.length;
+    if (index === thoughts.length - 1) mark = { entry: thought, below: count };
+    if (index === found) grew = count - anchor!.below;
   }
   const lines: string[] = [];
   for (let part = parts.length - 1; part >= 0; part -= 1) for (const line of parts[part]!) lines.push(line);
   const rest = index + 1;
   const drawn = parts.length;
-  return { lines, total: rest > 0 && drawn > 0 ? lines.length + Math.ceil((rest * lines.length) / drawn) : lines.length };
+  const total = rest > 0 && drawn > 0 ? lines.length + Math.ceil((rest * lines.length) / drawn) : lines.length;
+  return { lines, total, ...(mark ? { mark } : {}), ...(grew !== undefined ? { grew } : {}) };
 }
 
 /** Every thought, oldest first: who thought it, then the thought, dimmed. */
@@ -422,8 +485,8 @@ export function thoughtLines(thoughts: readonly ThoughtEntry[], width: number, t
   return thoughtTail(thoughts, width, theme, Number.POSITIVE_INFINITY).lines;
 }
 
-function thinkingContent(input: HomeInput, thoughts: readonly ThoughtEntry[], width: number, need: number, theme?: LobbyTheme): PaneLines {
-  if (thoughts.length > 0) return thoughtTail(thoughts, width, theme, need);
+function thinkingContent(input: HomeInput, thoughts: readonly ThoughtEntry[], width: number, need: number, anchor: PaneMark | undefined, theme?: LobbyTheme): PaneLines {
+  if (thoughts.length > 0) return thoughtTail(thoughts, width, theme, need, anchor);
   return whole([paint(theme, "dim", input.query ? `No thought matches "${input.query}".` : "Thoughts from the oracle and every agent appear here, and only here.")]);
 }
 
@@ -482,23 +545,24 @@ export function renderHome(input: HomeInput, width: number, height: number, them
   const matches = (count: number) => `${count} match${count === 1 ? "" : "es"}`;
   /**
    * One scrollable pane: only the lines it shows are drawn — its newest, or
-   * as far back as it is scrolled — in a box that records where it sits.
+   * as far back as it is scrolled — in a box that records where it sits, and
+   * how many lines arrived below since the frame before.
    */
-  const pane = (name: HomePane, title: string, note: string | undefined, content: (inner: number, need: number) => PaneLines) => (top: number, left: number, w: number, h: number): string[] => {
+  const pane = (name: HomePane, title: string, note: string | undefined, content: (inner: number, need: number, anchor: PaneMark | undefined) => PaneLines) => (top: number, left: number, w: number, h: number): string[] => {
     const rows = Math.max(0, h - 2);
     const offset = input.offsets?.[name] ?? 0;
-    const drawn = content(Math.max(1, w - 4), rows + offset);
+    const drawn = content(Math.max(1, w - 4), rows + offset, input.anchors?.get(name));
     const view = paneWindow(drawn, rows, offset);
     const total = Math.max(drawn.total, drawn.lines.length);
-    notePane(input.panes, name, top, left, w, h, total);
+    notePane(input.panes, name, top, left, w, h, total, { ...(drawn.mark ? { mark: drawn.mark } : {}), grew: drawn.grew ?? 0 });
     const right = rightNote(view.offset, note);
     return box(w, h, view.shown, { title, ...(right ? { right } : {}), focused: input.focus === name, scroll: { total, start: view.start }, theme });
   };
-  const chatBox = pane("conversation", input.title ? `Conversation · ${input.title}` : "Conversation", input.query ? matches(feed.chat.length) : input.keys?.conversation, (inner, need) => conversation(input, feed.chat, inner, need, theme));
-  const activityBox = pane("activity", "Activity", input.query ? matches(feed.activity.length) : input.keys?.activity, (inner, need) => activity(input, feed.activity, inner, need, theme));
+  const chatBox = pane("conversation", input.title ? `Conversation · ${input.title}` : "Conversation", input.query ? matches(feed.chat.length) : input.keys?.conversation, (inner, need, anchor) => conversation(input, feed.chat, inner, need, anchor, theme));
+  const activityBox = pane("activity", "Activity", input.query ? matches(feed.activity.length) : input.keys?.activity, (inner, need, anchor) => activity(input, feed.activity, inner, need, anchor, theme));
   const thought = currentThought(feed.thoughts);
   const thinkingNote = thought ? `${thought.source} · ${thought.live ? "thinking" : since(input.now - thought.at)}` : input.keys?.thinking;
-  const thinkingBox = pane("thinking", "Thinking", thinkingNote, (inner, need) => thinkingContent(input, feed.thoughts, inner, need, theme));
+  const thinkingBox = pane("thinking", "Thinking", thinkingNote, (inner, need, anchor) => thinkingContent(input, feed.thoughts, inner, need, anchor, theme));
   const top = scene.length;
   let body: string[] = [];
   if (main > 0 && panels.conversation && panels.activity) {