nebulosity 1.0.0 → 1.1.0

package/app/map/emphasis.ts

@@ -10,8 +10,8 @@ import type { MapEdge } from "@/lib/contracts";
 export type BoxTone = "normal" | "selected" | "linked" | "preview" | "faded";
 
 /**
- * How a line is drawn: the selection's in purple, the hovered box's brighter, the rest quieter while something is
- * selected. On a busy level the rest aren't drawn at all ("hidden").
+ * How a line is drawn: the selection's in purple or gold (lineLook), the hovered box's brighter, the rest quieter while
+ * something is selected. On a busy level the rest aren't drawn at all ("hidden").
  */
 export type EdgeTone = "normal" | "selected" | "preview" | "faded" | "hidden";
 
@@ -24,14 +24,89 @@ export const BUSY_LINES = 60;
 
 export const isBusyLevel = (lineCount: number): boolean => lineCount > BUSY_LINES;
 
+/**
+ * "Strong links only" (the Workbench redesign, ADR-070, on unless turned off): a line is strong when it carries at least
+ * STRONG_SHARE of the imports of the page's heaviest line. The weaker ones stay hidden unless they touch the selection,
+ * the hovered box, or a box Claude Code or the editor has lit. There's no floor of 3 imports, as the spec had: in a
+ * folder of files every line is 1 or 2 imports, and the floor hid them all (the owner's pick, 2026-10-27). So a page
+ * whose heaviest line carries under 50 imports hides nothing.
+ */
+export const STRONG_SHARE = 0.02;
+
+/** The fewest imports a strong line carries on a page whose heaviest line carries `maxImports`. */
+export const strongThreshold = (maxImports: number): number => STRONG_SHARE * maxImports;
+
+/** How many lines Strong links only hides on this page with `selected` selected and `pinned` lit, before any hover. */
+export function weakLinesHidden(edges: readonly MapEdge[], selected: string | null, pinned: ReadonlySet<string> = new Set()): number {
+    const threshold = strongThreshold(Math.max(0, ...edges.map((e) => e.count)));
+    const touches = (edge: MapEdge, box: string): boolean => edge.source === box || edge.target === box;
+    return edges.filter((e) => e.source !== e.target && e.count < threshold
+        && !(selected !== null && touches(e, selected)) && !pinned.has(e.source) && !pinned.has(e.target)).length;
+}
+
+/**
+ * Each side of the selection's one color: its lines' color on the Map (lineLook), and the same for everything else that
+ * stands for that side, the inspector's tab underline and bars and the toolbar's mark (the owner, 2026-10-29). Written
+ * out as whole class names, so Tailwind finds them.
+ */
+export const SIDE_COLOR = {
+    uses: { line: "var(--edge-strong)", fill: "bg-edge-strong", underline: "after:bg-edge-strong" },
+    usedBy: { line: "var(--used-by-edge)", fill: "bg-used-by-edge", underline: "after:bg-used-by-edge" },
+} as const;
+
+/**
+ * Each line's color and layer by its tone (the Workbench redesign, ADR-070), its width going by its imports whatever the
+ * tone: the selection's lines out (what it uses) in the logo's spoke color and its lines in (what uses it) in gold, so a
+ * glance tells the two apart (the owner, 2026-10-28, gold since 2026-10-29), the hovered box's a step brighter in both directions, and the rest
+ * quiet, so the boxes lead and a dense level reads as structure until you point at a box (the owner, 2026-10-27: src/vs
+ * was "so messy and unreadable" with every line in the bright gray). Its arrowhead is the line's own color. A higher
+ * layer is drawn later, over the quieter lines it crosses or shares a run with.
+ */
+export function lineLook(tone: Exclude<EdgeTone, "hidden">, edge: Pick<MapEdge, "source" | "target">, selected: string | null): { color: string; layer: number } {
+    if (tone === "selected") return { color: edge.target === selected ? SIDE_COLOR.usedBy.line : SIDE_COLOR.uses.line, layer: 2 };
+    if (tone === "preview") return { color: "var(--text-2)", layer: 1 };
+    return { color: "var(--edge-dim)", layer: 0 };
+}
+
 /** One line's id, the same one React Flow gets. */
 export const edgeKey = (edge: Pick<MapEdge, "source" | "target">): string => `${edge.source}->${edge.target}`;
 
-/** The boxes joined to `box` by a line, in either direction. */
-function neighbours(edges: readonly MapEdge[], box: string | null): Set<string> {
+/**
+ * Which of the selected box's lines are coloured (the owner, 2026-10-29): all of them, only its lines out to what it
+ * uses ("uses"), or only its lines in from what uses it ("usedBy"), in the inspector's own words. There's no choice of
+ * none. The other side isn't hidden but drawn gray like the rest of the page ("not completely gone"), so every line of
+ * the selection stays drawn whichever is picked, and picking moves no line and no count.
+ */
+export type LineDirection = "all" | "uses" | "usedBy";
+
+/** Whether `edge` is one of `box`'s lines on the side `direction` colours. */
+const onSide = (edge: Pick<MapEdge, "source" | "target">, box: string, direction: LineDirection): boolean =>
+    direction === "uses" ? edge.source === box
+    : direction === "usedBy" ? edge.target === box
+    : edge.source === box || edge.target === box;
+
+/** The selected box's lines that `direction` colours, in the level's order: the explorer lights the boxes at their ends. */
+export function selectionLines(edges: readonly MapEdge[], selected: string | null, direction: LineDirection): MapEdge[] {
+    return selected === null ? [] : edges.filter((edge) => onSide(edge, selected, direction));
+}
+
+/**
+ * The sides of `selected` with no line to another box on the page, which can't be picked: they'd colour nothing (src
+ * on VS Code's top page uses nothing there). None with nothing selected.
+ */
+export function sidesWithoutLines(edges: readonly MapEdge[], selected: string | null): LineDirection[] {
+    if (selected === null) return [];
+    const out = edges.some((e) => e.source === selected && e.target !== selected);
+    const into = edges.some((e) => e.target === selected && e.source !== selected);
+    return [...(out ? [] : ["uses" as const]), ...(into ? [] : ["usedBy" as const])];
+}
+
+/** The boxes joined to `box` by a line on the side `direction` colours (by default either). */
+function neighbours(edges: readonly MapEdge[], box: string | null, direction: LineDirection = "all"): Set<string> {
     const found = new Set<string>();
     if (box === null) return found;
     for (const edge of edges){
+        if (!onSide(edge, box, direction)) continue;
         if (edge.source === box) found.add(edge.target);
         else if (edge.target === box) found.add(edge.source);
     }
@@ -43,18 +118,23 @@ function neighbours(edges: readonly MapEdge[], box: string | null): Set<string>
  * apart from React Flow. The selection always wins over the hover: a box linked to the selection stays linked when a
  * hovered box also touches it. A selection or hover that isn't one of this level's boxes counts as none. With
  * `quietLines` (a busy level), only the selection's and the hovered box's lines are drawn; the boxes are toned as usual.
+ * With `strongOnly`, a weak line (strongThreshold) is hidden too, unless it touches the selection, the hovered box or a
+ * `pinned` box (Claude Code's or the editor's highlights), whose lines always show. A `direction` other than "all"
+ * colours only that side of the selection's lines: the other side is toned as a line of the rest would be, faded or the
+ * hover's, but never hidden, and a box joined to the selection only by it fades.
  */
 export function mapEmphasis(
     boxes: readonly string[],
     edges: readonly MapEdge[],
     selected: string | null,
     hovered: string | null,
-    options: { quietLines?: boolean } = {},
+    options: { quietLines?: boolean; strongOnly?: boolean; pinned?: ReadonlySet<string>; direction?: LineDirection } = {},
 ): { boxes: Map<string, BoxTone>; edges: Map<string, EdgeTone> } {
     const onLevel = new Set(boxes);
     const chosen = selected !== null && onLevel.has(selected) ? selected : null;
     const pointed = hovered !== null && onLevel.has(hovered) && hovered !== chosen ? hovered : null;
-    const linked = neighbours(edges, chosen);
+    const direction = options.direction ?? "all";
+    const linked = neighbours(edges, chosen, direction);
     const previewed = neighbours(edges, pointed);
 
     const boxTones = new Map<string, BoxTone>();
@@ -65,12 +145,18 @@ export function mapEmphasis(
         else boxTones.set(box, chosen === null ? "normal" : "faded");
     }
 
+    const threshold = strongThreshold(Math.max(0, ...edges.map((e) => e.count)));
+    const pinned = options.pinned ?? new Set<string>();
     const edgeTones = new Map<string, EdgeTone>();
     for (const edge of edges){
         const touches = (box: string | null): boolean => box !== null && (edge.source === box || edge.target === box);
-        if (touches(chosen)) edgeTones.set(edgeKey(edge), "selected");
+        const lit = pinned.has(edge.source) || pinned.has(edge.target);
+        if (chosen !== null && onSide(edge, chosen, direction)) edgeTones.set(edgeKey(edge), "selected");
+        // the side not picked stays drawn, whatever hides the rest, so picking a side never makes a line appear or go
+        else if (touches(chosen)) edgeTones.set(edgeKey(edge), touches(pointed) ? "preview" : "faded");
         else if (touches(pointed)) edgeTones.set(edgeKey(edge), "preview");
-        else if (options.quietLines) edgeTones.set(edgeKey(edge), "hidden");
+        else if (options.quietLines && !lit) edgeTones.set(edgeKey(edge), "hidden");
+        else if (options.strongOnly && edge.count < threshold && !lit) edgeTones.set(edgeKey(edge), "hidden");
         else edgeTones.set(edgeKey(edge), chosen === null ? "normal" : "faded");
     }
 

package/app/map/explorerRows.ts

@@ -0,0 +1,85 @@
+import type { LevelResponse, MapNode } from "@/lib/contracts";
+import { formatCount } from "./format";
+import { maxFilesOf } from "./weights";
+
+/**
+ * What the explorer lists (the Workbench redesign, ADR-070): the boxes of the level on screen as rows, folders first by
+ * how many files they hold, then the files by name, each folder with a bar for its size. Doorways to other pages are
+ * boxes on the Map but not rows, since they stand for boxes rather than being any. A folder drawn a page at a time says
+ * which page this is. Pure, so the order and the scale are tested alone (explorer.test.ts).
+ */
+
+/** A folder's bar, 3 px for the smallest up to 36 px, its column's width, for the page's largest. */
+export const BAR_MIN = 3;
+export const BAR_MAX = 36;
+
+/**
+ * A folder's bar on the same log scale as its dot on the Map (weights.ts's dotSize), so VS Code's src (10,280 files)
+ * and a folder of 4 both show: 36 × log10(files + 1) / log10(largest + 1). Never under 3 px, so an empty folder still
+ * has a mark, and never past its 36 px column.
+ */
+export function barWidth(files: number, maxFiles: number): number {
+    if (maxFiles <= 0) return BAR_MIN;
+    const width = (BAR_MAX * Math.log10(Math.max(0, files) + 1)) / Math.log10(maxFiles + 1);
+    return Math.min(BAR_MAX, Math.max(BAR_MIN, width));
+}
+
+/**
+ * One row. A folder's carries its files, its bar's width in px, and what a screen reader says for it, "src, 10,280
+ * files", since the count alone has no unit. A file's is its name.
+ */
+export type ExplorerRow =
+    | { kind: "folder"; path: string; name: string; files: number; bar: number; label: string }
+    | { kind: "file"; path: string; name: string };
+
+/** How a row is drawn: the selection, a box joined to it by a drawn line, or neither. */
+export type RowTone = "selected" | "linked" | "plain";
+
+export function rowTone(path: string, selected: string | null, linked: ReadonlySet<string>): RowTone {
+    if (path === selected) return "selected";
+    return linked.has(path) ? "linked" : "plain";
+}
+
+/**
+ * Names in the order VS Code's own explorer gives them, so the list reads the way the person already knows: case
+ * mixed together and numbers by value (file2 before file10). Two names that differ only in case keep a fixed order.
+ */
+const COLLATOR = new Intl.Collator("en", { numeric: true, sensitivity: "base" });
+const byName = (a: MapNode, b: MapNode): number => COLLATOR.compare(a.name, b.name) || (a.name < b.name ? -1 : a.name > b.name ? 1 : 0);
+
+const files = (n: number): string => `${formatCount(n)} ${n === 1 ? "file" : "files"}`;
+
+/** The level's rows: folders by files, the largest first and ties by name, then the files by name. No doorways. */
+export function explorerRows(nodes: readonly MapNode[]): ExplorerRow[] {
+    const maxFiles = maxFilesOf(nodes);
+    const folders = nodes.filter((n) => n.kind === "folder").sort((a, b) => b.fileCount - a.fileCount || byName(a, b));
+    const loose = nodes.filter((n) => n.kind === "file").sort(byName);
+    return [
+        ...folders.map((n): ExplorerRow => ({
+            kind: "folder", path: n.path, name: n.name, files: n.fileCount, bar: barWidth(n.fileCount, maxFiles), label: `${n.name}, ${files(n.fileCount)}`,
+        })),
+        ...loose.map((n): ExplorerRow => ({ kind: "file", path: n.path, name: n.name })),
+    ];
+}
+
+/** The header's count of the rows, "13 items" or "1 item". */
+export function itemCount(rows: number): string {
+    return `${formatCount(rows)} ${rows === 1 ? "item" : "items"}`;
+}
+
+/**
+ * The quiet line under a folder drawn a page at a time, "Page 2 of 5, 44 of 182 folders and files": which page, and how
+ * many of the folder's boxes it draws (the rest are on the other pages). Null when the folder fits on one page.
+ */
+export function pageLine(level: Pick<LevelResponse, "page" | "pageCount" | "hiddenCount">, drawn: number): string | null {
+    if (level.pageCount <= 1) return null;
+    return `Page ${level.page + 1} of ${level.pageCount}, ${formatCount(drawn)} of ${formatCount(drawn + level.hiddenCount)} folders and files`;
+}
+
+export type ExplorerView = { rows: ExplorerRow[]; count: string; pageLine: string | null };
+
+/** Everything the explorer draws for a level. */
+export function explorerView(level: Pick<LevelResponse, "nodes" | "page" | "pageCount" | "hiddenCount">): ExplorerView {
+    const rows = explorerRows(level.nodes);
+    return { rows, count: itemCount(rows.length), pageLine: pageLine(level, rows.length) };
+}

package/app/map/flowNodes.ts

@@ -1,4 +1,4 @@
-import { Position, type EdgeMarker, type NodeHandle } from "@xyflow/react";
+import { Position, type NodeHandle } from "@xyflow/react";
 import type { MapNode } from "@/lib/contracts";
 import { BOX_HEIGHT, BOX_WIDTH, type Position as Point } from "./levelLayout";
 import type { BoxData, BoxNode } from "./MapBox";
@@ -56,16 +56,21 @@ export function reuseUnchanged<T extends { id: string }>(previous: readonly T[],
     return unchanged ? (previous as T[]) : out;
 }
 
-/** Whether two box nodes draw the same: the same box, place, tone, ring, pulse and doorway caption. */
+/** Whether two box nodes draw the same: the same box, place, tone, ring, pulse, dot and doorway caption. */
 export function sameBoxNode(a: BoxNode, b: BoxNode): boolean {
     return a.position.x === b.position.x && a.position.y === b.position.y
         && a.data.box === b.data.box && a.data.tone === b.data.tone && a.data.agent === b.data.agent
-        && a.data.pulseKey === b.data.pulseKey && a.data.portal === b.data.portal;
+        && a.data.pulseKey === b.data.pulseKey && a.data.dot === b.data.dot && a.data.portal === b.data.portal;
 }
 
-/** Whether two lines draw the same: the same ends, route, label, stroke and arrowhead. */
+/**
+ * Whether two lines draw the same: the same ends, route, width, head, color, count and count's place. The place is
+ * compared by value, since a count placed again where it was comes back as a new point. A hover draws nothing on a
+ * line (its words are the canvas's card), so it leaves every line as it was.
+ */
 export function sameRoutedEdge(a: RoutedEdgeType, b: RoutedEdgeType): boolean {
-    return a.source === b.source && a.target === b.target && a.data?.points === b.data?.points && a.label === b.label
-        && a.style?.stroke === b.style?.stroke && a.style?.strokeWidth === b.style?.strokeWidth && a.style?.opacity === b.style?.opacity
-        && (a.markerEnd as EdgeMarker | undefined)?.color === (b.markerEnd as EdgeMarker | undefined)?.color;
+    return a.source === b.source && a.target === b.target && a.data?.points === b.data?.points
+        && a.data?.width === b.data?.width && a.data?.headWidth === b.data?.headWidth && a.data?.color === b.data?.color
+        && a.data?.count === b.data?.count && a.data?.countStrong === b.data?.countStrong
+        && a.data?.labelAt?.x === b.data?.labelAt?.x && a.data?.labelAt?.y === b.data?.labelAt?.y;
 }

package/app/map/format.ts

@@ -38,9 +38,9 @@ const ORDER: readonly StageName[] = ["structure", "summaries", "embeddings"];
 
 const progress = (stage: StageStatus): string => (stage.total > 0 ? ` ${formatCount(stage.done)} / ${formatCount(stage.total)}` : "");
 
-/** One stage as the status menu lists it: "Summaries 12,340 / 18,637 · ready". */
+/** One stage as the status menu lists it: "Summaries 12,340 / 18,637, ready". */
 export function stageLabel(name: StageName, stage: StageStatus): string {
-    return `${TITLES[name]}${progress(stage)} · ${stage.state}`;
+    return `${TITLES[name]}${progress(stage)}, ${stage.state}`;
 }
 
 export type Tone = "ok" | "busy" | "warn" | "off";

package/app/map/history.ts

@@ -51,9 +51,10 @@ export function followStep(step: "none" | "replace" | "push", mode: "push" | "re
 
 /**
  * How many of the Map's own steps lie behind a history entry: the `mapDepth` the Map writes into `history.state` with
- * each push (and keeps with each rewrite). VS Code's panel has no browser Back, so the Map's own Back control is enabled
- * only above 0: going back past the Map's first entry would take the webview off the Map (owner review, 2026-10-25).
- * An entry the Map didn't write, a fresh load's or another page's, is 0, and so is anything that isn't a whole number.
+ * each push (and keeps with each rewrite). The Map's own Back control, in VS Code's panel (owner review, 2026-10-25) and
+ * in the browser (2026-10-29), is enabled only above 0: going back past the Map's first entry would take the webview off
+ * the Map, or a browser tab to the page before it. An entry the Map didn't write, a fresh load's or another page's, is
+ * 0, and so is anything that isn't a whole number.
  */
 export function historyDepth(state: unknown): number {
     const depth = typeof state === "object" && state !== null ? (state as { mapDepth?: unknown }).mapDepth : undefined;

package/app/map/inspector.ts

@@ -0,0 +1,113 @@
+import type { DescribeResponse, LevelResponse, MapNode } from "@/lib/contracts";
+import type { GitHubSource } from "./api";
+import { formatCompact, formatCount } from "./format";
+import { nameOf } from "./paths";
+
+/**
+ * The inspector's words and numbers (the Workbench redesign, 2026-10-27): pure, so DetailPanel's rules are tested on
+ * their own. The owner's copy rule holds for everything here that reaches the screen, so no colons, semicolons or
+ * middle dots, and commas where the old panel had " · ".
+ */
+
+/** The inspector's tabs: what it uses, what uses it, and what's inside (a folder's contents, a file's declarations). */
+export type InspectorTab = "uses" | "usedBy" | "inside";
+
+/**
+ * The tab a panel opens on. Used by when anything uses the target, since that's what the arrows into the selected box
+ * show, else Uses when it uses anything, else what's inside. A folder nothing links to opens on its contents.
+ */
+export function defaultTab(target: Pick<DescribeResponse, "uses" | "usedBy">): InspectorTab {
+    if (target.usedBy.length > 0) return "usedBy";
+    if (target.uses.length > 0) return "uses";
+    return "inside";
+}
+
+/** A row's bar never gets narrower than this share of the row, in percent, so a count of 1 next to 665 still shows. */
+export const MIN_BAR = 1.5;
+
+/**
+ * A row's bar, as a percent of the row's width: its count over the largest count in the same tab (the mockup's
+ * `.irow .b`). The largest row's bar is the whole row.
+ */
+export function barWidth(count: number, largest: number): number {
+    if (largest <= 0) return MIN_BAR;
+    return Math.min(100, Math.max(MIN_BAR, (100 * count) / largest));
+}
+
+/** The largest count among a tab's rows (0 for none): every row's bar is measured against it. */
+export function largestCount(rows: readonly { count: number }[]): number {
+    return rows.reduce((most, row) => Math.max(most, row.count), 0);
+}
+
+type Kind = DescribeResponse["kind"];
+
+/**
+ * The target's kind before describe() answers, so the name doesn't gain its slash a moment after the panel opens: the
+ * repo, the folder on screen, or a box on the level. Undefined when the level doesn't say (a path found by search).
+ */
+export function kindBeforeDescribe(targetPath: string, level: Pick<LevelResponse, "path" | "nodes">): Kind | undefined {
+    if (targetPath === "") return "repo";
+    if (targetPath === level.path) return "folder";
+    const kind = level.nodes.find((n) => n.path === targetPath)?.kind;
+    return kind === "folder" || kind === "file" ? kind : undefined;
+}
+
+/**
+ * What the inspector calls its target: a folder's name with a trailing slash ("src/"), as the code font writes a
+ * folder, the repo's own name, or a file's name. While the kind isn't known yet the name shows bare.
+ */
+export function inspectorName(targetPath: string, repoRoot: string, kind: Kind | undefined): string {
+    const name = nameOf(targetPath, repoRoot);
+    return kind === "folder" ? `${name}/` : name;
+}
+
+/**
+ * The name's hover title: the whole path, which the name alone doesn't show (a folder's with its slash, the repo's
+ * root). It always holds the name itself, so a name cut off with an ellipsis can be read in full (check-layout's (c)).
+ */
+export function inspectorTitle(targetPath: string, repoRoot: string, kind: Kind | undefined): string {
+    if (targetPath === "") return repoRoot;
+    return kind === "folder" ? `${targetPath}/` : targetPath;
+}
+
+/** The word for a count: "line" for 1, "lines" for any other. */
+const word = (n: number, one: string, many: string): string => (n === 1 ? one : many);
+
+/**
+ * Under the name: "10,280 files, 3.5M lines", or a file's "120 lines", then what changed since it was summarized
+ * ("10,280 files, 3.5M lines, 12 changed since summarized").
+ */
+export function sizeLine(target: Pick<DescribeResponse, "kind" | "stats" | "stalePaths">): string {
+    const { fileCount, lineCount } = target.stats;
+    const lines = `${formatCompact(lineCount)} ${word(lineCount, "line", "lines")}`;
+    const size = target.kind === "file" ? lines : `${formatCount(fileCount)} ${word(fileCount, "file", "files")}, ${lines}`;
+    return target.stalePaths > 0 ? `${size}, ${formatCount(target.stalePaths)} changed since summarized` : size;
+}
+
+/** A row's hover title in Uses and Used by: "src/vs/base, 12 imports". */
+export function importsTitle(targetPath: string, count: number): string {
+    return `${targetPath}, ${formatCount(count)} ${word(count, "import", "imports")}`;
+}
+
+/**
+ * A Contents row's hover title: its path, a folder's file count, and its one-line summary on a line of its own
+ * ("src/vs/base, 1,204 files", then "Shared utilities…").
+ */
+export function childTitle(child: Pick<MapNode, "path" | "kind" | "fileCount" | "tagline">): string {
+    const where = child.kind === "folder" ? `${child.path}, ${formatCount(child.fileCount)} ${word(child.fileCount, "file", "files")}` : child.path;
+    return child.tagline ? `${where}\n${child.tagline}` : where;
+}
+
+/** A declaration's place, right of its name: "function, line 272", the line as an editor writes it (no comma). */
+export function declarationPlace(symbol: { kind: string; startLine: number }): string {
+    return `${symbol.kind}, line ${symbol.startLine}`;
+}
+
+/**
+ * A folder (or the repo, "") on GitHub at the commit the demo's index was built from (ADR-049). links.ts's githubLink
+ * is a file's blob link, and a folder is a tree.
+ */
+export function githubFolderLink(source: GitHubSource, folderPath: string): string {
+    const root = `https://github.com/${source.owner}/${source.name}/tree/${source.commit}`;
+    return folderPath === "" ? root : `${root}/${folderPath.split("/").map(encodeURIComponent).join("/")}`;
+}

package/app/map/labels.ts

@@ -1,4 +1,5 @@
-import type { DescribeResponse, MapNode } from "@/lib/contracts";
+import type { DescribeResponse, MapEdge, MapNode } from "@/lib/contracts";
+import { edgeKey } from "./emphasis";
 import { formatCount } from "./format";
 
 /**
@@ -14,12 +15,57 @@ function subject(box: MapNode): string {
 
 const capitalized = (text: string): string => text.charAt(0).toUpperCase() + text.slice(1);
 
-/** A line's hover label: "editor uses base · 12 imports" (the arrow runs from the user to the used). */
+/** A line's sentence in its parts, so the hover card can cut a long name short and keep the rest whole. */
+export type LineParts = { who: string; verb: string; whom: string; imports: string };
+
+/** lineLabel's parts: "editor", "uses", "base" and "12 imports". */
+export function lineParts(source: MapNode, target: MapNode, count: number): LineParts {
+    return {
+        who: source.kind === "portal" ? capitalized(subject(source)) : subject(source),
+        verb: source.kind === "portal" ? "use" : "uses",
+        whom: subject(target),
+        imports: `${formatCount(count)} import${count === 1 ? "" : "s"}`,
+    };
+}
+
+/** A line's hover label: "editor uses base, 12 imports" (the arrow runs from the user to the used). */
 export function lineLabel(source: MapNode, target: MapNode, count: number): string {
-    const imports = `${formatCount(count)} import${count === 1 ? "" : "s"}`;
-    const verb = source.kind === "portal" ? "use" : "uses";
-    const who = source.kind === "portal" ? capitalized(subject(source)) : subject(source);
-    return `${who} ${verb} ${subject(target)} · ${imports}`;
+    const { who, verb, whom, imports } = lineParts(source, target, count);
+    return `${who} ${verb} ${whom}, ${imports}`;
+}
+
+/** One line in a run's list: the box at its far end (or both ends, where the run shares neither) and its imports. */
+export type RunRow = { id: string; name: string; count: number };
+
+/**
+ * What the hover card says about the lines under the pointer (the owner, 2026-10-29: on merged lines one line's
+ * sentence didn't say which line it meant). One line: its sentence. Lines into one box: "Into src", then each by the
+ * box it comes from; out of one box: "From build", then each by the box it goes to. Lines that share neither end (no
+ * route merges them, but a list never guesses): "Lines here", each as "build → src". The heaviest first, then by name.
+ */
+export type RunWords =
+    | { kind: "one"; id: string; parts: LineParts; sentence: string }
+    | { kind: "run"; title: string; rows: RunRow[] };
+
+export function runWords(lines: readonly MapEdge[], byPath: ReadonlyMap<string, MapNode>): RunWords {
+    // every line on a level has both its boxes there
+    const box = (path: string): MapNode => byPath.get(path)!;
+    if (lines.length === 1){
+        const [line] = lines;
+        return { kind: "one", id: edgeKey(line), parts: lineParts(box(line.source), box(line.target), line.count), sentence: lineLabel(box(line.source), box(line.target), line.count) };
+    }
+    // a row starts with its name, so a doorway's "boxes on Page 2" takes a capital
+    const name = (path: string): string => box(path).kind === "portal" ? capitalized(subject(box(path))) : box(path).name;
+    const into = lines.every((l) => l.target === lines[0].target);
+    const from = !into && lines.every((l) => l.source === lines[0].source);
+    const title = into ? `Into ${subject(box(lines[0].target))}` : from ? `From ${subject(box(lines[0].source))}` : "Lines here";
+    const rows = lines.map((l) => ({
+        id: edgeKey(l),
+        name: into ? name(l.source) : from ? name(l.target) : `${subject(box(l.source))} → ${subject(box(l.target))}`,
+        count: l.count,
+    }));
+    rows.sort((a, b) => b.count - a.count || (a.name < b.name ? -1 : a.name > b.name ? 1 : 0) || (a.id < b.id ? -1 : 1));
+    return { kind: "run", title, rows };
 }
 
 /** A box's hover title: its path, and its one-line summary when there is one. */
@@ -30,5 +76,18 @@ export function boxTitle(box: Pick<MapNode, "path" | "name" | "tagline">): strin
 
 /** The detail panel's words for a file with no declarations: a file over the size cap had them left unread (ADR-053). */
 export function noDeclarationsText(file: Pick<DescribeResponse, "importsOnly">): string {
-    return file.importsOnly ? "Not read (over the 1 MB size cap; imports only)." : "None found.";
+    return file.importsOnly ? "Not read, since it's over the 1 MB size cap. Only its imports were." : "None found.";
+}
+
+/**
+ * The toolbar's one-line finding about a level (the Workbench redesign, ADR-070): its heaviest line, by the two boxes'
+ * names, with how many of the level's imports it carries, "Heaviest link is extensions → src, 665 of 708 imports".
+ * Null for a level with no lines. Ties go to the first by source, then target, so a level always says the same.
+ */
+export function heaviestLink(level: { nodes: readonly MapNode[]; edges: readonly { source: string; target: string; count: number }[] }): { from: string; to: string; count: number; total: number } | null {
+    const lines = level.edges.filter((e) => e.source !== e.target);
+    if (lines.length === 0) return null;
+    const heaviest = [...lines].sort((a, b) => b.count - a.count || (a.source < b.source ? -1 : a.source > b.source ? 1 : 0) || (a.target < b.target ? -1 : a.target > b.target ? 1 : 0))[0];
+    const name = (path: string): string => level.nodes.find((n) => n.path === path)?.name ?? path;
+    return { from: name(heaviest.source), to: name(heaviest.target), count: heaviest.count, total: lines.reduce((sum, e) => sum + e.count, 0) };
 }