@floless/app 0.76.0 → 0.77.0

package/dist/schemas/steel.takeoff.v1.schema.json

@@ -251,7 +251,7 @@
         "verified": { "type": "boolean", "description": "True = a human confirmed this joint." },
         "name": { "type": "string", "description": "custom only: display label carried from the source IFC (e.g. \"COLUMN C102\")." },
         "place": { "$ref": "#/$defs/point3", "description": "custom only: the world-mm point the connection's LOCAL `geometry` is translated by — its placement in the model." },
-        "geometry": { "type": "array", "items": { "$ref": "#/$defs/meshPart" }, "description": "custom only: imported mesh parts (one per plate/bolt/weld) in the connection's LOCAL mm frame. Read once from IFC by AWARE's connection-reader; opaque tessellated geometry (no per-dimension edit)." }
+        "geometry": { "type": "array", "items": { "$ref": "#/$defs/meshPart" }, "description": "custom only: imported mesh parts (one per plate/bolt/weld) in the connection's LOCAL mm frame (re-anchored at import from the reader's WORLD-mm output — the LOCAL frame is floless's own placement transform). Read once from IFC by AWARE's connection-reader `extract`, whose output is the source of truth for this mesh shape (see #/$defs/meshPart); opaque tessellated geometry (no per-dimension edit)." }
       },
       "allOf": [
         { "if": { "properties": { "kind": { "enum": ["base-plate", "shear-plate"] } } }, "then": { "required": ["main"] } },
@@ -262,7 +262,7 @@
       "type": "object",
       "required": ["positions", "indices"],
       "additionalProperties": true,
-      "description": "One tessellated mesh part of a 'custom' connection (a plate / bolt / weld), in the connection's LOCAL mm frame: flat x,y,z position triples + 0-based triangle indices — AWARE's generic kind:\"mesh\" scene primitive. Read from IFC by the connection-reader; never hand-authored.",
+      "description": "One tessellated mesh part of a 'custom' connection (a plate / bolt / weld), in the connection's LOCAL mm frame: flat x,y,z position triples + 0-based triangle indices — AWARE's generic kind:\"mesh\" scene primitive. Shape is AWARE-owned: the source of truth is aware-aeco's connection-reader `extract` output (manifest.yaml + commands/extract.md). floless only consumes it — never hand-authored, never re-defined here.",
       "properties": {
         "id": { "type": "string", "description": "Source part id (the IFC element GlobalId)." },
         "role": { "type": "string", "description": "Hardware role from the source IFC: plate | bolt | weld." },
@@ -412,6 +412,7 @@
       "properties": {
         "id": { "type": "string" },
         "profile": { "type": "string", "description": "AISC designation (e.g. W16X26) or an unresolved mark (e.g. MF). Empty string allowed for an unprofiled member." },
+        "material": { "type": "string", "description": "ASTM material grade, e.g. A992 / A572-50 / A500. Absent = derive the default from the section family (W→A992, HSS→A500, plate/angle→A572/A36). Populated by the reader from the drawing's general-notes grade table (Slice 5b); the History semantic diff surfaces a change to it as the Material facet." },
         "wp": {
           "type": "array",
           "items": { "$ref": "#/$defs/point2" },

package/dist/skills/floless-app-steel-takeoff/SKILL.md

@@ -307,6 +307,7 @@ Important optional fields:
         {
           "id": "m1",
           "profile": "W16X26",
+          "material": "A992",
           "wp": [[x0,y0],[x1,y1]],
           "angle": "H",
           "role": "beam",
@@ -348,6 +349,12 @@ Key field rules:
   default.
 - `rfi: true` means no AISC size resolved — excluded from the BOM. `mf: true` marks a
   moment-frame member (persistent; survives AISC resolution).
+- **`material` (grade) — capture it (Slice 5b).** Read the drawing's **general-notes grade table**
+  (the "MATERIAL" / "STRUCTURAL STEEL" notes) and stamp each member's `material` from its section
+  family: wide-flange / WT → `A992`, HSS → `A500` (Gr. B or C per the notes), pipe → `A53`,
+  angles / channels / plates → `A36` or `A572-50` per the notes. A per-member callout on the drawing
+  overrides the family default. Capturing grade is what lets the Workspaces **History → "What
+  changed"** compare surface a **Material** change when a revision re-grades a member.
 - `raster_b64` is a base64 JPEG of the framing area (title block excluded). It is
   **machine-local** and **never committed**.
 - **Connection library (`connections[]`) + per-end refs.** A vendor-neutral top-level
@@ -501,6 +508,24 @@ contract carries the source path in `source.path` and an embedded raster in `ras
 are machine-local (stored under `~/.floless/contracts/steel-model.json` by the server and
 never committed). Clip title blocks from any embedded preview.
 
+### 9. Revision re-read — preserve member identity (Slice 5)
+
+When the trigger is a **`revision-read`** request (a REVISED drawing set attached to an *existing*
+project), the Workspaces **History → "What changed"** compare matches members between versions by
+their `id`, scoped per `sheet`. So the re-read must keep identity stable:
+
+1. **Fetch the current contract first** — `GET /api/contract/steel-model?project=<projectId>` (the
+   project id is in the request body). That is the previous version's working tree.
+2. **Carry ids + sheets forward** — for every member that still exists in the revised set, reuse its
+   existing `id` and keep it on the same `sheet` label (e.g. `S-201` stays `S-201`). Mint a NEW id
+   only for a genuinely new member; simply drop the id of a member the revision deleted.
+3. Then compose the updated `steel.takeoff/v1` and `POST /api/projects/<projectId>/revision-read
+   { contract, message, requestId }` (that POST clears the request — do **not** DELETE it).
+
+If you renumber everything, the diff shows a misleading "all removed + all added" and the app warns
+**"identity not preserved."** Carrying ids forward is what makes *"beam B12 was upsized"* come out
+exact instead of a churn of the whole model.
+
 ---
 
 ## Guardrails

package/dist/web/app.css

@@ -3508,3 +3508,76 @@ table.hist tr.current td { background:var(--accent-soft); }
 .hist-confirm .hc-cancel { background:none; border:1px solid var(--border-strong); color:var(--text-muted);
   border-radius:6px; padding:5px 11px; font-size:11.5px; cursor:pointer; }
 .hist-confirm .hc-cancel:hover { color:var(--text); border-color:var(--accent); }
+
+/* ── Workspaces ▸ History ▸ "What changed" semantic diff (Slice 5) ──────────────
+   A per-version disclosure row (colspan) under table.hist. Uses only History tokens; group
+   headers follow the same mono-uppercase idiom as table.hist th. No new fonts/colors/widgets. */
+.hist .hd-cell { width:26px; padding-left:12px; padding-right:0; }
+.hd-toggle { background:none; border:none; padding:2px; margin:0; cursor:pointer; color:var(--text-dim);
+  display:inline-flex; align-items:center; border-radius:4px; line-height:1; }
+.hd-toggle:hover, .hd-toggle[aria-expanded="true"] { color:var(--text); background:var(--surface-2); }
+.hd-caret { display:inline-block; font-size:10px; transition:transform .18s ease-out; }
+.hd-toggle[aria-expanded="true"] .hd-caret { transform:rotate(90deg); }
+table.hist tr.hd-open td { background:var(--surface-2); }
+/* disclosure row: flat --surface (a step below --surface-2) so it reads as nested content, not a ledger row */
+table.hist tr.hist-diff-row > td { background:var(--surface); padding:0; }
+table.hist tr.hist-diff-row:hover > td { background:var(--surface); }
+tr.hist-diff-row[hidden] { display:none; }
+.hd-panel { padding:12px 16px 14px; font-size:12px; color:var(--text-muted); }
+/* net-steel header — QUIET by design (no green/red value judgment); the arrow glyph carries direction. */
+.hd-net { display:flex; align-items:center; gap:7px; padding-bottom:10px; margin-bottom:10px;
+  border-bottom:1px solid var(--border); font-size:13px; }
+.hd-net-label { color:var(--text-muted); font-weight:600; }
+.hd-net-arrow { color:var(--text-dim); font-size:11px; }
+.hd-net-val { font-family:var(--mono); color:var(--text); font-weight:600; }
+.hd-net.flat .hd-net-val { color:var(--text-dim); }
+/* change-group blocks — header text color-coded via existing semantic tokens; rows plain (no per-row pills). */
+.hd-group { margin-bottom:10px; padding-left:9px; border-left:2px solid var(--border-strong); }
+.hd-group:last-child { margin-bottom:0; }
+.hd-type { font-family:var(--mono); font-size:9px; text-transform:uppercase; letter-spacing:.16em;
+  font-weight:600; color:var(--text-dim); margin:0 0 5px; }
+.hd-type .hd-count { opacity:.7; }
+.hd-group.added    { border-left-color:var(--ok); }            .hd-group.added .hd-type    { color:var(--ok); }
+.hd-group.removed  { border-left-color:var(--err); }           .hd-group.removed .hd-type  { color:var(--err); }
+.hd-group.resized  { border-left-color:var(--accent); }        .hd-group.resized .hd-type  { color:var(--accent-bright); }
+.hd-group.moved    { border-left-color:var(--accent); }        .hd-group.moved .hd-type    { color:var(--accent-bright); }
+.hd-group.material { border-left-color:var(--warn); }          .hd-group.material .hd-type { color:var(--warn); }
+.hd-group.connections { border-left-color:var(--info); }       .hd-group.connections .hd-type { color:var(--info); }
+.hd-item { line-height:1.5; padding:1px 0; color:var(--text-muted); }
+.hd-mark { font-family:var(--mono); color:var(--text); font-weight:600; }
+.hd-prof { font-family:var(--mono); color:var(--text-muted); margin-left:6px; }
+.hd-summary { color:var(--text-muted); margin-left:6px; }
+.hd-sheet { font-size:10px; color:var(--text-dim); margin-left:6px; }
+.hd-xform { margin-left:6px; }
+.hd-arrow { color:var(--text-dim); margin:0 5px; }
+.hd-qual { color:var(--text-dim); font-style:italic; margin-left:6px; }
+.hd-tail { color:var(--text-dim); font-size:11px; padding-top:8px; }
+/* caution banner — the .hist-working recipe in amber (warn); never dismissible (load-bearing context). */
+.hd-warn { margin:0 0 11px; padding:9px 12px; display:flex; gap:8px; align-items:flex-start;
+  background:var(--surface-2); border:1px solid var(--border); border-left:3px solid var(--warn);
+  border-radius:6px; font-size:11.5px; color:var(--text-muted); }
+.hd-warn b { color:var(--text); font-weight:600; }
+.hd-warn-ico { color:var(--warn); flex:none; }
+/* empty / loading / error states — never a blank panel */
+.hd-empty { color:var(--text-dim); font-style:italic; text-align:center; padding:14px 0; }
+.hd-loading { color:var(--text-dim); padding:10px 0; }
+.hd-err { color:var(--text-muted); padding:8px 0; }
+.hd-err button { background:none; border:none; padding:0; font:inherit; color:var(--accent); cursor:pointer; }
+.hd-err button:hover { color:var(--accent-bright); text-decoration:underline; }
+/* baseline picker — inline "Compared to vX ▾" + a themed anchored popover (NEVER a native <select>). */
+.hd-basewrap { display:flex; align-items:center; gap:7px; margin-bottom:11px; font-size:11px; color:var(--text-dim); }
+.hd-base { background:var(--surface-2); border:1px solid var(--border-strong); color:var(--text-muted);
+  border-radius:4px; padding:3px 8px; font:inherit; font-size:11px; cursor:pointer; display:inline-flex; align-items:center; gap:5px; }
+.hd-base:hover { color:var(--text); border-color:var(--accent); }
+.hd-base-caret { color:var(--text-dim); font-size:9px; }
+.hd-base-menu { position:absolute; z-index:20; min-width:150px; max-height:220px; overflow-y:auto;
+  background:var(--surface-3); border:1px solid var(--border-strong); border-radius:8px; box-shadow:0 8px 24px rgba(0,0,0,.4);
+  padding:4px; scrollbar-width:thin; scrollbar-color:var(--border-strong) transparent; }
+.hd-base-menu::-webkit-scrollbar { width:8px; }
+.hd-base-menu::-webkit-scrollbar-thumb { background:var(--border-strong); border-radius:4px; }
+.hd-base-menu::-webkit-scrollbar-track { background:transparent; }
+.hd-base-opt { display:flex; justify-content:space-between; gap:12px; width:100%; background:none; border:none;
+  color:var(--text-muted); font:inherit; font-size:11.5px; text-align:left; padding:5px 8px; border-radius:5px; cursor:pointer; }
+.hd-base-opt:hover { background:var(--surface-2); color:var(--text); }
+.hd-base-opt.sel { color:var(--accent-bright); }
+.hd-base-opt .hd-base-meta { font-family:var(--mono); font-size:10px; color:var(--text-dim); }

package/dist/web/aware.js

@@ -4660,7 +4660,7 @@
         ? `\nRevised drawing${req.snapshots.length > 1 ? 's' : ''} (read these): ${req.snapshots.join(', ')}`
         : '';
       const note = req.instruction ? `\nMy note: ${req.instruction}` : '';
-      return `In floless project "${req.project}" (app "${req.appId}"), a REVISED drawing set was attached — re-read it into the SAME project as a new version (do NOT create a new project). Read the drawings per the floless-app-steel-takeoff skill, compose the updated steel.takeoff/v1 contract, then POST /api/projects/${req.project}/revision-read with { contract, message: "<plain-English what changed>", requestId: "${req.id}" }. The server derives the base version + source provenance from this queued request, records a "revision-read" version, and clears the request — do NOT DELETE the request yourself. If you can't read the set, POST /api/projects/${req.project}/revision-requests/${req.id}/fail with { error }.${snaps}${note}`;
+      return `In floless project "${req.project}" (app "${req.appId}"), a REVISED drawing set was attached — re-read it into the SAME project as a new version (do NOT create a new project). Read the drawings per the floless-app-steel-takeoff skill, compose the updated steel.takeoff/v1 contract. First GET /api/contract/${req.appId}?project=${req.project} to read the CURRENT contract and PRESERVE each still-present member's id AND its sheet label (mint a NEW id only for a genuinely new member; drop the id of a member the revision deleted) so the version comparison matches members — do NOT renumber the whole model. Then POST /api/projects/${req.project}/revision-read with { contract, message: "<plain-English what changed>", requestId: "${req.id}" }. The server derives the base version + source provenance from this queued request, records a "revision-read" version, and clears the request — do NOT DELETE the request yourself. If you can't read the set, POST /api/projects/${req.project}/revision-requests/${req.id}/fail with { error }.${snaps}${note}`;
     }
     return '';
   }

package/dist/web/workspaces.js

@@ -214,7 +214,7 @@
     const showHistory = s === 'history';
     $wsHistory.hidden = !showHistory;
     if (showHistory) renderHistory();
-    else closeRollbackConfirm(); // don't leave a rollback popover open behind a step switch
+    else { closeRollbackConfirm(); closeBaseMenu(); } // don't leave a popover open behind a step switch
   }
   $stepTabs.addEventListener('click', (e) => {
     const b = e.target.closest('button[data-step]');
@@ -575,18 +575,31 @@
     const action = v.current
       ? ''
       : `<button type="button" class="btn-mini" data-rollback="${escapeAttr(String(v.n))}" data-tip="Restore this version as a new version">↺ Rollback</button>`;
-    return `<tr class="${v.current ? 'current' : ''}">` +
+    // "What changed" disclosure — only for a version that HAS a predecessor (n>1). v1 is the baseline,
+    // so it gets NO toggle at all (an ABSENT control, never a disabled one).
+    const canDiff = Number(v.n) > 1;
+    const toggle = canDiff
+      ? `<button type="button" class="hd-toggle" data-diff="${escapeAttr(String(v.n))}" aria-expanded="false" data-tip="What changed vs the previous version"><span class="hd-caret">▸</span></button>`
+      : '';
+    const verRow = `<tr class="${v.current ? 'current' : ''}" data-ver="${escapeAttr(String(v.n))}">` +
+      `<td class="hd-cell">${toggle}</td>` +
       `<td><span class="ver${v.current ? ' cur' : ''}">v${escapeHtml(String(v.n))}</span></td>` +
       `<td class="htime">${escapeHtml(histWhen(v.ts))}</td>` +
       `<td><span class="hby">${avatarFor(v.author)}${escapeHtml(v.author)}</span></td>` +
       `<td>${gateBadge(v.gate, v.kind)}</td>` +
       `<td class="change">${escapeHtml(v.message)}</td>` +
       `<td>${action}</td></tr>`;
+    // The disclosure row is always emitted (hidden) so toggling is a pure show/hide + lazy fetch.
+    const diffRow = canDiff
+      ? `<tr class="hist-diff-row" data-diff-for="${escapeAttr(String(v.n))}" hidden><td colspan="7"><div class="hd-panel" data-panel="${escapeAttr(String(v.n))}"></div></td></tr>`
+      : '';
+    return verRow + diffRow;
   }
 
   async function renderHistory() {
     if (!current) return;
     const id = current.id;
+    closeBaseMenu(); // this re-render replaces the History HTML — drop any open base-picker's listener first
     $wsHistory.innerHTML = '<div class="hist-note">Loading history…</div>';
     let rows = [];
     let approvedAt;
@@ -627,6 +640,7 @@
       // Version/Gate/action are fixed-narrow; When/By auto-size to their nowrap content (fixing them
       // wider than the content wastes room and needlessly wraps Change). Change flexes to the rest.
       '<table class="hist"><thead><tr>' +
+      '<th style="width:26px"></th>' +
       '<th style="width:44px">Version</th><th>When</th><th>By</th>' +
       '<th style="width:80px">Gate</th><th style="width:99%">Change</th><th style="width:92px"></th>' +
       '</tr></thead><tbody>' + rows.map(versionRowHtml).join('') + '</tbody></table>';
@@ -677,6 +691,211 @@
     }
   }
 
+  // ── "What changed" semantic diff (Slice 5) ─────────────────────────────────
+  // The panel is DOM-built with textContent for every AI/drawing-supplied string (marks, profiles,
+  // connection summaries) — never innerHTML, per the file's security contract.
+  const DIFF_GROUPS = [
+    { key: 'added', label: 'Added' },
+    { key: 'removed', label: 'Removed' },
+    { key: 'resized', label: 'Resized' },
+    { key: 'moved', label: 'Moved' },
+    { key: 'material', label: 'Material' },
+    { key: 'connections', label: 'Connections' },
+  ];
+  const diffBase = new Map(); // "<projectId>\0<n>" → chosen baseline (undefined = compare to the previous version)
+  const baseKeyFor = (n) => (current && current.id ? current.id : '?') + '' + n; // project-scoped so a base pick can't bleed across projects sharing a version number
+  const el = (tag, cls, text) => {
+    const n = document.createElement(tag);
+    if (cls) n.className = cls;
+    if (text != null) n.textContent = text;
+    return n;
+  };
+
+  function diffMemberBasic(ref) {
+    const line = el('div', 'hd-item');
+    line.appendChild(el('span', 'hd-mark', ref.mark || ref.id));
+    if (ref.profile) line.appendChild(el('span', 'hd-prof', ref.profile));
+    if (ref.sheet) line.appendChild(el('span', 'hd-sheet', ref.sheet));
+    return line;
+  }
+  function diffMemberXform(ref, fromTxt, toTxt) {
+    const line = el('div', 'hd-item');
+    line.appendChild(el('span', 'hd-mark', ref.mark || ref.id));
+    const x = el('span', 'hd-xform');
+    x.appendChild(el('span', 'hd-prof', fromTxt || '—'));
+    x.appendChild(el('span', 'hd-arrow', '→'));
+    x.appendChild(el('span', 'hd-prof', toTxt || '—'));
+    line.appendChild(x);
+    if (ref.sheet) line.appendChild(el('span', 'hd-sheet', ref.sheet));
+    return line;
+  }
+  function diffMemberMoved(it) {
+    const line = el('div', 'hd-item');
+    line.appendChild(el('span', 'hd-mark', it.ref.mark || it.ref.id));
+    line.appendChild(el('span', 'hd-prof', `moved ~${it.feet} ft`));
+    if (it.scaleUnknown) line.appendChild(el('span', 'hd-qual', 'scale unknown'));
+    if (it.ref.sheet) line.appendChild(el('span', 'hd-sheet', it.ref.sheet));
+    return line;
+  }
+  function diffMemberConn(it) {
+    const line = el('div', 'hd-item');
+    line.appendChild(el('span', 'hd-mark', it.ref.mark || it.ref.id));
+    line.appendChild(el('span', 'hd-summary', it.summary || 'connection changed'));
+    if (it.ref.sheet) line.appendChild(el('span', 'hd-sheet', it.ref.sheet));
+    return line;
+  }
+  function diffRowFor(key, it) {
+    if (key === 'added' || key === 'removed') return diffMemberBasic(it);
+    if (key === 'resized' || key === 'material') return diffMemberXform(it.ref, it.from, it.to);
+    if (key === 'moved') return diffMemberMoved(it);
+    return diffMemberConn(it);
+  }
+  function diffGroup(g, items) {
+    if (!items || !items.length) return null;
+    const box = el('div', `hd-group ${g.key}`);
+    const head = el('div', 'hd-type');
+    head.appendChild(el('span', null, g.label.toUpperCase()));
+    head.appendChild(document.createTextNode(' '));
+    head.appendChild(el('span', 'hd-count', `(${items.length})`));
+    box.appendChild(head);
+    for (const it of items) box.appendChild(diffRowFor(g.key, it));
+    return box;
+  }
+  function diffNetHeader(t) {
+    const wrap = el('div', 'hd-net');
+    const net = t && typeof t.netTons === 'number' ? t.netTons : 0;
+    if (net === 0) wrap.classList.add('flat');
+    wrap.appendChild(el('span', 'hd-net-label', 'Net steel:'));
+    wrap.appendChild(el('span', 'hd-net-arrow', net > 0 ? '▲' : net < 0 ? '▼' : '•'));
+    wrap.appendChild(el('span', 'hd-net-val', `${net > 0 ? '+' : ''}${net} tons`));
+    return wrap;
+  }
+  // The engine's four honest signals — each names its CONSEQUENCE so a withheld member/connection is
+  // never silently absent from the panel. ALL render here (not just identity), above the numbers.
+  function diffCautions(w) {
+    if (!w) return [];
+    const mk = (strong, rest) => {
+      const box = el('div', 'hd-warn');
+      box.appendChild(el('span', 'hd-warn-ico', '⚠'));
+      const body = el('div');
+      if (strong) body.appendChild(el('b', null, strong));
+      if (rest) body.appendChild(document.createTextNode((strong ? ' ' : '') + rest));
+      box.appendChild(body);
+      return box;
+    };
+    const out = [];
+    if (w.identityNotPreserved) out.push(mk('These two reads don’t share member identity.', 'The comparison may be unreliable — the revised set looks re-read without carrying member labels forward.'));
+    if (w.duplicateKeys && w.duplicateKeys.length) out.push(mk(null, `${w.duplicateKeys.length} member${w.duplicateKeys.length > 1 ? 's were' : ' was'} left out — a duplicate id appears more than once on a sheet, so its changes can’t be attributed.`));
+    if (w.ambiguousJoints && w.ambiguousJoints.length) out.push(mk(null, 'Some connection changes couldn’t be attributed (a joint’s member id is shared across sheets) and were left out rather than guessed.'));
+    if (w.scaleUnknown && !w.identityNotPreserved) out.push(mk(null, 'A drawing’s scale is unknown, so the move distances shown are approximate.'));
+    return out;
+  }
+  function diffBasePicker(diff) {
+    const wrap = el('div', 'hd-basewrap');
+    wrap.appendChild(el('span', null, 'Compared to'));
+    const btn = el('button', 'hd-base');
+    btn.type = 'button';
+    btn.dataset.baseFor = String(diff.to);
+    btn.setAttribute('data-tip', 'Compare against an earlier version');
+    btn.appendChild(el('span', null, `v${diff.from}`));
+    btn.appendChild(el('span', 'hd-base-caret', '▾'));
+    wrap.appendChild(btn);
+    return wrap;
+  }
+  function renderDiffPanel(panel, diff) {
+    panel.textContent = '';
+    panel.appendChild(diffBasePicker(diff));
+    for (const c of diffCautions(diff.warnings)) panel.appendChild(c); // above the numbers — context for reading them
+    panel.appendChild(diffNetHeader(diff.tonnage));
+    let any = false;
+    for (const g of DIFF_GROUPS) {
+      const grp = diffGroup(g, diff[g.key]);
+      if (grp) { panel.appendChild(grp); any = true; }
+    }
+    if (!any) {
+      panel.appendChild(el('div', 'hd-empty', `No changes detected${diff.unchanged ? ` — ${diff.unchanged} members unchanged` : ''}.`));
+    } else if (diff.unchanged) {
+      panel.appendChild(el('div', 'hd-tail', `${diff.unchanged} members unchanged`));
+    }
+  }
+  async function loadDiff(n, base) {
+    const proj = current;
+    if (!proj) return;
+    const panel = $wsHistory.querySelector(`.hd-panel[data-panel="${CSS.escape(String(n))}"]`);
+    if (!panel) return;
+    const stamp = `${proj.id}:${n}:${base ?? ''}`; // guard against a stale response painting the wrong project/version/base
+    panel.dataset.stamp = stamp;
+    panel.textContent = '';
+    panel.appendChild(el('div', 'hd-loading', 'Comparing…'));
+    let diff;
+    try {
+      const q = base != null ? `?base=${encodeURIComponent(base)}` : '';
+      diff = (await api(`/api/projects/${encodeURIComponent(proj.id)}/versions/${encodeURIComponent(n)}/diff${q}`)).diff;
+    } catch (err) {
+      if (current && current.id === proj.id && panel.dataset.stamp === stamp) {
+        panel.textContent = '';
+        const box = el('div', 'hd-err');
+        box.appendChild(document.createTextNode('Couldn’t load the comparison' + (err && err.message ? ` — ${err.message}` : '') + ' — '));
+        const retry = el('button', null, 'try again');
+        retry.type = 'button';
+        retry.dataset.diffRetry = String(n);
+        box.appendChild(retry);
+        panel.appendChild(box);
+      }
+      return;
+    }
+    if (!current || current.id !== proj.id || panel.dataset.stamp !== stamp) return; // switched away / re-picked mid-await
+    renderDiffPanel(panel, diff);
+  }
+  function toggleDiff(btn) {
+    const n = Number(btn.dataset.diff);
+    const row = $wsHistory.querySelector(`tr.hist-diff-row[data-diff-for="${CSS.escape(String(n))}"]`);
+    if (!row) return;
+    const verRow = btn.closest('tr');
+    if (row.hasAttribute('hidden')) {
+      row.removeAttribute('hidden');
+      btn.setAttribute('aria-expanded', 'true');
+      if (verRow) verRow.classList.add('hd-open');
+      const panel = row.querySelector('.hd-panel');
+      if (panel && !panel.dataset.stamp) loadDiff(n, diffBase.get(baseKeyFor(n))); // lazy first load
+    } else {
+      row.setAttribute('hidden', '');
+      btn.setAttribute('aria-expanded', 'false');
+      if (verRow) verRow.classList.remove('hd-open');
+    }
+  }
+  // Baseline picker popover (mirrors the rollback-confirm popover idiom; never a native <select>).
+  function onDocDownForBase(e) {
+    if (!e.target.closest('.hd-base-menu') && !e.target.closest('.hd-base')) closeBaseMenu();
+  }
+  function closeBaseMenu() {
+    const m = $wsHistory.querySelector('.hd-base-menu');
+    if (m) m.remove();
+    document.removeEventListener('mousedown', onDocDownForBase, true);
+  }
+  function showBaseMenu(btn) {
+    closeBaseMenu();
+    const to = Number(btn.dataset.baseFor);
+    const cur = diffBase.get(baseKeyFor(to)) ?? to - 1;
+    const menu = el('div', 'hd-base-menu');
+    for (const v of versions) { // module-level ledger (newest first); only earlier versions are valid bases
+      if (Number(v.n) >= to) continue;
+      const opt = el('button', 'hd-base-opt' + (Number(v.n) === cur ? ' sel' : ''));
+      opt.type = 'button';
+      opt.dataset.baseOpt = String(v.n);
+      opt.dataset.baseTo = String(to);
+      opt.appendChild(el('span', null, `v${v.n}`));
+      opt.appendChild(el('span', 'hd-base-meta', histWhen(v.ts)));
+      menu.appendChild(opt);
+    }
+    $wsHistory.appendChild(menu);
+    const pr = $wsHistory.getBoundingClientRect();
+    const br = btn.getBoundingClientRect();
+    menu.style.top = br.bottom - pr.top + $wsHistory.scrollTop + 4 + 'px';
+    menu.style.left = Math.max(8, Math.min(br.left - pr.left, $wsHistory.clientWidth - menu.offsetWidth - 8)) + 'px';
+    document.addEventListener('mousedown', onDocDownForBase, true);
+  }
+
   $wsHistory.addEventListener('click', (e) => {
     if (e.target.closest('#hist-approve')) { approveProject(); return; }
     if (e.target.closest('.hc-cancel')) { closeRollbackConfirm(); return; }
@@ -684,6 +903,14 @@
     if (go) { rollbackTo(Number(go.dataset.hcGo)); return; }
     const roll = e.target.closest('[data-rollback]');
     if (roll) { showRollbackConfirm(roll, Number(roll.dataset.rollback)); return; }
+    const tog = e.target.closest('.hd-toggle');
+    if (tog) { toggleDiff(tog); return; }
+    const opt = e.target.closest('[data-base-opt]');
+    if (opt) { const to = Number(opt.dataset.baseTo), b = Number(opt.dataset.baseOpt); diffBase.set(baseKeyFor(to), b); closeBaseMenu(); loadDiff(to, b); return; }
+    const baseBtn = e.target.closest('.hd-base');
+    if (baseBtn) { showBaseMenu(baseBtn); return; }
+    const dr = e.target.closest('[data-diff-retry]');
+    if (dr) { const n = Number(dr.dataset.diffRetry); loadDiff(n, diffBase.get(baseKeyFor(n))); return; }
   });
 
   // ── project picker + lifecycle (full set lives HERE; ≡ carries nothing) ────

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@floless/app",
-  "version": "0.76.0",
+  "version": "0.77.0",
   "type": "module",
   "description": "Thin localhost host for floless.app — serves web/ and shells the aware CLI. No engine, no LLM.",
   "bin": {