create-pmos 0.14.0 → 0.15.0

package/workspace/public/app.js

@@ -15,6 +15,10 @@ const $ = (id) => document.getElementById(id);
 const FitAddon = (window.FitAddon && window.FitAddon.FitAddon) || null;
 const WebLinks = (window.WebLinksAddon && window.WebLinksAddon.WebLinksAddon) || null;
 
+// workspace-pm-spine — the spine is the PRIMARY navigator. `?nav=legacy` falls back to the
+// repo→tree→session view for rollback only; the rubric's FAIL condition is the two shipping side by
+// side with NEITHER declared primary, so the default is not a toggle, it is the answer.
+const SPINE_ON = new URLSearchParams(location.search).get('nav') !== 'legacy';
 const state = {
   ws: null, sessions: [], workspaces: [], home: null, openHarness: new Set(),
   wsId: null,                   // selected workspace
@@ -24,6 +28,13 @@ const state = {
   libByWs: {},                 // ws id -> library payload, so a dossier can be read for a tree that
                                // is NOT selected (R9: opening a dossier is a read, never a checkout)
   filter: '',
+  // workspace-pm-spine — the PM structure for the SELECTED repo: objectives → KRs → initiatives,
+  // plus health budgets as peers and the unanchored bucket. null while unread; {ok:false,error}
+  // renders RED, never a green empty tree (R5).
+  spine: null,
+  spineFor: null,
+  radar: null,                  // Review-Gate verdicts for the selected repo (evals.jsonl)
+  radarFor: null,               // which repo_key `spine` was read for, so a stale one is never shown
   active: null,                 // active session id — always groups[focusG].activeId
   groups: [{ activeId: null }, { activeId: null }],  // terminal groups (R6); [1] exists when split
   focusG: 0,                   // which group the keyboard, ⌘J send and rename act on
@@ -54,8 +65,79 @@ const state = {
   needsByWs: {},               // ws id -> {count,error} — what a COLLAPSED tree row shows (R12)
   openTrees: new Set(),        // trees the PM opened explicitly — beats the derived default (R6)
   closedTrees: new Set(),      // …and the ones they closed explicitly
+  // Which of the seven destinations column 1 is showing. This is a MODE, not a navigation event:
+  // the menu swaps what the column lists, and the selection in column 2 follows from it.
+  mode: 'product',
+  q: '',                       // the column-1 search box — narrows the mode AND finds elsewhere
+  col1: true, col2: true,      // expanded, or collapsed to a 36px labelled rail
+  viewers: [],                 // open viewer tabs: {kind:'doc'|'surface', key, title}
+  viewActive: null,            // the viewer tab on screen, or null when a terminal is
+  sched: null,                 // the scheduler's list — null while unread, {error} if the read failed
+  schedLoading: false,
+  // `<repo_key>::<id>` -> the ladder for ONE initiative. The board caps itself at what is in
+  // flight, so the panel cannot read a named initiative's position out of it — 93 of 105 records
+  // here are outside that cap, and treating "not in the cap" as "no record" is a false reading.
+  ladders: {},
+  ladderWanted: new Set(),
+  // workspace-focus — the cross-product queue. `focusSeq` is the stale-paint guard: focus ignores
+  // `ws` entirely, so there is no key to compare against; a slower read is beaten by a newer one on
+  // sequence alone. null while unread, {ok:false,error} renders RED.
+  focus: null,
+  focusSeq: 0,
+  focusOpen: false,
+  // workspace-profiles — the /api/profiles payload, verbatim. null while unread; `absent`, an empty
+  // `profiles[]` and `{ok:false}` are three different facts and none may stand in for another.
+  profiles: null,
+  profilesLoading: false,
+  newProfile: '',              // the composer's pick: a descriptor id, or '' for no profile
+  profilePrefWrote: null,      // the last agent whose preference was written, for the panel's line
+  // workspace-repo-ingest — open proposals, pushed over the socket as they advance. Never a
+  // count of what a repo "has": a proposal is a reading of a clone at a stated moment.
+  ingest: [],
+  ingestRead: false,
+  // workspace-jira-handoff — `<repo_key>::<id>` -> the record's declared handoff links.
+  handoffs: {},
+  handoffWanted: new Set(),
+  workflows: null,             // declared templates for the selected repo
+  workflowsFor: null,
+  // workspace-mobile-surface — {dest, stack[]}. The deeper stack is deliberately never persisted.
+  mnav: null,
+  // workspace-product-switcher — the ws whose spine read still owes us a landing (R4 clause 2).
+  landPending: null,
+  addSrc: 'local',             // which source the add-a-repository form is on
 };
 
+// The seven destinations, in the PM's order. `data` says where the list comes from, and it is the
+// honest part of this table: `real` modes read the repository, `derived` ones are computed from
+// state PMOS already holds, and `absent` ones have no file behind them yet — those render a
+// stated absence rather than a plausible-looking sample. Faking one would make the workspace lie
+// about what the repo contains, which is the single thing the honest-state contract rules out.
+const MODES = [
+  { k: 'product',   g: '◧', label: 'product',   title: 'initiatives', data: 'real' },
+  { k: 'scheduled', g: '◔', label: 'scheduled', title: 'scheduled tasks', data: 'real' },
+  { k: 'workflow',  g: '▤', label: 'workflow',  title: 'workflows', data: 'derived' },
+  { k: 'skills',    g: '◇', label: 'skills',    title: 'skills', data: 'real' },
+  { k: 'knowledge', g: '◈', label: 'knowledge', title: 'knowledge', data: 'real' },
+  { k: 'agent',     g: '◐', label: 'agent',     title: 'agents', data: 'derived' },
+  { k: 'memory',    g: '◒', label: 'memory',    title: 'memory', data: 'absent' },
+];
+const MODE_BY_K = {}; MODES.forEach((m) => { MODE_BY_K[m.k] = m; });
+
+/* ── workspace-mobile-surface · the navigation reducer ─────────────────────────────────────────
+ * Lives in lib/mobile-nav.js, loaded before this file, and reached here through the same
+ * window.PMOS* convention lib/layout.js uses. It is DOM-free on purpose: the rubric asks for a
+ * pure module so test.js can walk the whole domain in node without a browser, and a reducer that
+ * cannot be unit-tested is one whose exclusivity guarantee is only ever checked by eye. */
+const MOBILE_DESTS = PMOSMobileNav.DESTS;
+const MOBILE_DEST = PMOSMobileNav.DEST_FOR_MODE;
+const MOBILE_ROOT = PMOSMobileNav.ROOTS;
+const mobScreen = PMOSMobileNav.screen, mobRootOf = PMOSMobileNav.root;
+const mobColumnOf = PMOSMobileNav.columnOf, mobDestForMode = PMOSMobileNav.destForMode;
+const mobTitleOf = PMOSMobileNav.titleOf, mobNavInit = PMOSMobileNav.init;
+const mobPush = PMOSMobileNav.push, mobPop = PMOSMobileNav.pop;
+const mobSwitchDest = PMOSMobileNav.switchDest, mobCurrentOf = PMOSMobileNav.current;
+const mobMigrateView = PMOSMobileNav.migrateView;
+
 // ── workspace state survives reloads (R7): theme + selected workspace + focused session,
 // and now the rail/pane layout the PM chose (R12). ──
 const store = {
@@ -69,6 +151,12 @@ const store = {
 { const l = store.get('lens');
   if (['folders', 'scheduled', 'history', 'dossier'].includes(l)) state.lens = l;
   else if (l === 'initiatives') state.lens = 'dossier'; }
+// The mode and the two column-collapse states survive a reload for the same reason the layout
+// does: they are an arrangement the PM chose, and re-deciding it on every boot is a chore.
+{ const m = store.get('mode'); if (MODE_BY_K[m]) state.mode = m; }
+{ const c1 = store.get('col1'), c2 = store.get('col2');
+  if (c1 === 'off') state.col1 = false;
+  if (c2 === 'off') state.col2 = false; }
 // ?ws=<id> is how `pmos` in another repo lands you in THAT repo, not the last one you opened.
 const urlWs = new URLSearchParams(location.search).get('ws');
 
@@ -104,7 +192,18 @@ function setConn(s) {
   const el = $('conn');
   el.className = 'conn ' + s;
   el.textContent = s === 'live' ? 'LIVE · local' : 'reconnecting…';
-  $('wsFoot').textContent = s === 'live' ? 'local · persistent server · sessions running' : 'server unreachable — retrying';
+  paintFoot(s);
+}
+// "sessions running" with no number was a label pretending to be a reading. The count is of LIVE
+// sessions across every hosted tree — exited ones are still listed in the navigator but are not
+// running, and counting them would overstate what the machine is doing.
+let lastConn = 'live';
+function paintFoot(s) {
+  if (s) lastConn = s;
+  const el = $('wsFoot'); if (!el) return;
+  if (lastConn !== 'live') { el.textContent = 'server unreachable — retrying'; return; }
+  const n = state.sessions.filter((x) => x.state !== 'exited').length;
+  el.textContent = `local · persistent server · ${n} session${n === 1 ? '' : 's'} running`;
 }
 
 // sessions belonging to the selected workspace — the whole UI reads through this
@@ -119,10 +218,24 @@ function handle(m) {
     const pick = [urlWs, remembered, m.home].find((id) => id && m.workspaces.some((w) => w.id === id))
       || (m.workspaces[0] && m.workspaces[0].id);
     selectWorkspace(pick, { restoreSession: true });
+    // Three reads that are NOT per-workspace and must not ride a per-workspace path: focus joins
+    // every registered repository, the profile descriptors are a property of this machine, and an
+    // open ingest proposal belongs to a clone rather than to a tree.
+    loadFocus();
+    loadProfiles();
+    loadIngest();
   } else if (m.t === 'workspaces') {
     state.workspaces = m.workspaces;
     if (!state.workspaces.some((w) => w.id === state.wsId)) selectWorkspace(state.home, { restoreSession: true });
-    else { renderWorkspaces(); renderTree(); loadBoards(); }
+    else { renderProducts(); renderTree(); loadBoards(); }
+    loadFocus();          // a repository appearing or leaving changes what is cross-product true
+  } else if (m.t === 'ingest') {
+    // workspace-repo-ingest — one stage transition. The proposal arrives whole, so nothing here
+    // merges fields: a partial update is how a screen ends up half-describing two different scans.
+    const i = state.ingest.findIndex((x) => x.id === m.id);
+    if (m.proposal) { if (i >= 0) state.ingest[i] = m.proposal; else state.ingest.push(m.proposal); }
+    renderTree();                                    // the spine's `ingested` group follows it
+    if (state.detail.kind === 'ingest' && state.detail.id === m.id) renderLibrary();
   } else if (m.t === 'focus') {
     // `pmos` was run in another repo while this tab was open — go there, which is the whole
     // point: the browser refocusing this tab must not strand the PM on the previous repo.
@@ -144,7 +257,13 @@ function handle(m) {
     const structural = sig !== state.sessSig;
     state.sessSig = sig;
     state.sessions = m.sessions;
-    if (structural) { renderSessions(); renderWorkspaces(); } else { paintVolatile(); }
+    if (structural) { renderSessions(); renderProducts(); } else { paintVolatile(); }
+    // R12 — focus is re-read on a STRUCTURAL session change only (a session appeared, exited or
+    // was renamed), never on the liveness heartbeat, and only while its panel is on screen. The
+    // panel's `delegated` section is derived from sessionList(), so leaving it frozen would be a
+    // stale reading; re-reading it twice a second would put a ~O(records) spine read on a cadence.
+    if (structural && state.focusOpen) loadFocus();
+    if (structural) paintProfileLines();
     if (state.active && !ids.has(state.active)) {
       const mine = mySessions();
       const nx = mine.find((s) => s.state !== 'exited') || mine[mine.length - 1];
@@ -218,11 +337,17 @@ async function selectWorkspace(id, opts = {}) {
   const changed = id !== state.wsId;
   state.wsId = id;
   store.set('wsid', id);
+  // R10 — the switcher's most-recent-tree memory, in the store namespace the selection already
+  // uses. Its ABSENCE degrades to "the tree whose root is the repo_key", then to the first
+  // registered tree — never to an error and never to a different product.
+  { const w0 = state.workspaces.find((x) => x.id === id); if (w0) store.set('lastTree:' + (w0.repo_key || w0.root), id); }
   if (changed) closeDoc();
-  renderWorkspaces();
+  renderProducts();
   renderSessions();
   renderNewTarget();      // R5 — "here" moved; the composer must say so even if it is already open
   loadBoards();
+  loadSpine();
+  loadRadar();
   // focus a session in THIS workspace: the remembered one if it belongs here, else its first live one
   const mine = mySessions();
   const remembered = opts.restoreSession ? store.get('active') : null;
@@ -237,8 +362,14 @@ async function selectWorkspace(id, opts = {}) {
   {
     const w = state.workspaces.find((x) => x.id === id);
     const init = w ? initiativeOf(w) : null;
-    if (init && init.id) { state.detail = { kind: 'initiative', id: init.id, wsId: id }; if (state.lens === 'dossier') ensureLib(id); }
-    else { state.detail = { kind: 'repo', id: w ? w.repo_key : null, wsId: id }; if (state.lens === 'dossier') state.lens = 'folders'; }
+    if (init && init.id) { state.detail = { kind: 'initiative', id: init.id, wsId: id }; if (state.lens === 'dossier') ensureLib(id); state.landPending = null; }
+    else {
+      state.detail = { kind: 'repo', id: w ? w.repo_key : null, wsId: id }; if (state.lens === 'dossier') state.lens = 'folders';
+      // R4 clause 2 — the branch named no initiative, so the spine gets to answer. It has not been
+      // read yet, and NO initiative is selected before the read that would justify it lands: a
+      // panel drawn from another product's spine is exactly what `spineFor` exists to prevent.
+      state.landPending = id;
+    }
   }
   await Promise.all([loadLibrary(), loadNeeds(), loadBranch(), loadWorktrees()]);
 }
@@ -346,9 +477,450 @@ function treeGlyph(w) {
   if (mine.length) return 'exited';
   return 'idle';
 }
+// ── workspace-pm-spine ─────────────────────────────────────────────────────────────────────────
+// The resident navigator is the PM spine: Objective → Key Result → Initiative, with the repository,
+// its working trees and their sessions demoted from CONTAINERS to attributes of the initiative they
+// are working. The unit of record in the file layer is now the unit you select.
+//
+// R4 is the requirement most likely to be violated quietly, so the render is built around it:
+// EVERY tree lands in exactly one of four places — under its initiative, under `no initiative`
+// (this repo, branch names none), under `other repositories`, or nowhere, which is a bug. The
+// accounting is asserted at the end of this function rather than left to inspection.
+function renderSpine(host) {
+  const sp = state.spine;
+  const curW = state.workspaces.find((x) => x.id === state.wsId);
+  const curKey = curW ? productKey(curW) : null;
+
+  // workspace-product-switcher R6 — the `other repositories` bucket is GONE, because the switcher
+  // above this list is what it was standing in for. The spine is now the structure of ONE product;
+  // every other product is one button away, and every tree of every other product is reachable
+  // through it. Partition the SELECTED product's trees once: by initiative id, or unattached.
+  const mine = state.workspaces.filter((w) => curKey && productKey(w) === curKey);
+  const byInit = new Map(); const loose = [];
+  for (const w of mine) {
+    const init = initiativeOf(w);
+    if (init.id) { if (!byInit.has(init.id)) byInit.set(init.id, []); byInit.get(init.id).push(w); }
+    else loose.push(w);
+  }
+  const g = { name: curW ? (curW.repo_name || curW.name) : '' };
+  const treesFor = (id) => (byInit.get(id) || []).map((w) => treeRow(w, g)).join('');
+  const seen = new Set();
+
+  const initRow = (i, extra) => {
+    const mine = byInit.get(i.id) || [];
+    mine.forEach((w) => seen.add(w.id));
+    const row = boardRowById(i.id);
+    const blocked = row && row.blockers && row.blockers.length;
+    // R7 — position is the ENGINE's, never a declared field. Absent is stated, not implied.
+    // Most records are historical and carry no derived position; printing a disclaimer on each of
+    // ~120 rows is noise, not honesty. So: a position when there is one, "deriving…" while the
+    // board is genuinely still working, and silence when the engine has answered and this
+    // initiative simply has no live ladder. The signal the PM needs is blocked/next, not absence.
+    const bd = boardForCurrent();
+    const lad = row
+      ? `<span class="stg">${esc(row.stage || '')}</span>${blocked
+          ? `<span class="bl">✗ ${row.blockers.length} blocked</span>`
+          : (row.next && row.next.step ? `<span class="nx">→ ${esc(row.next.step)}</span>` : '')}`
+      : (bd && bd.pending ? `<span class="drv">deriving…</span>` : '');
+    // NAME ONLY on the row. The lane and the tree count were competing with the one thing this
+    // list is scanned for — which initiative — and both are stated in the panel that opens.
+    return `<div class="sp-init" data-init="${esc(i.id)}">
+      <button class="sp-i" data-init-pick="${esc(i.id)}" title="${esc(i.lane || '')}${mine.length ? ` · ${mine.length} tree${mine.length === 1 ? '' : 's'}` : ''}">
+        <span class="r1"><span class="nm">${esc(i.id)}</span></span>
+        <span class="r2">${lad}${extra || ''}</span>
+      </button>
+      <div class="sp-trees">${treesFor(i.id)}</div>
+    </div>`;
+  };
+
+  const parts = [];
+  if (!sp) parts.push(`<div class="empty">reading the spine…</div>`);
+  else if (sp.ok === false) {
+    // R5 — a FAILED read is red and says why. It is never a green empty tree.
+    parts.push(`<div class="sp-bad"><b>the spine could not be read</b><span>${esc(sp.error || '')}</span>
+      <span class="why">objectives, key results and initiative records live in this repository — until that read succeeds the navigator cannot say what is anchored to what</span></div>`);
+  } else {
+    for (const o of (sp.objectives || [])) {
+      const krs = (o.krs || []).filter((k) => k.initiatives.length);
+      const direct = o.direct || [];
+      if (!krs.length && !direct.length) continue;
+      parts.push(`<div class="sp-obj"><div class="sp-o"><span class="id">${esc(o.id)}</span><span class="nm">${esc(o.name)}</span></div>
+        ${krs.map((k) => `<div class="sp-kr"><div class="sp-k"><span class="id">${esc(k.id)}</span><span class="nm">${esc(k.name)}</span><span class="ct">${k.initiatives.length}</span></div>
+          ${k.initiatives.map((i) => initRow(i)).join('')}</div>`).join('')}
+        ${direct.length ? `<div class="sp-kr"><div class="sp-k"><span class="id">—</span><span class="nm">anchored to the objective, no KR named</span><span class="ct">${direct.length}</span></div>
+          ${direct.map((i) => initRow(i)).join('')}</div>` : ''}</div>`);
+    }
+    for (const b of (sp.budgets || [])) {
+      parts.push(`<div class="sp-obj" data-health="1"><div class="sp-o"><span class="id">${esc(b.id)}</span>
+        <span class="nm">health budget — upkeep, not a bet (D59)</span><span class="ct">${b.initiatives.length}</span></div>
+        ${b.initiatives.map((i) => initRow(i)).join('')}</div>`);
+    }
+    // R6 — never dropped to keep the tree tidy. The resolver's own reason is carried through.
+    if ((sp.unanchored || []).length) {
+      parts.push(`<div class="sp-obj" data-warn="1"><div class="sp-o"><span class="id">unanchored</span>
+        <span class="nm">no resolvable anchor — these are rejected work under D59</span><span class="ct">${sp.unanchored.length}</span></div>
+        ${sp.unanchored.map((i) => initRow(i, `<span class="rsn">${esc(i.reason || '')}</span>`)).join('')}</div>`);
+    }
+  }
+
+  // R5 (switcher) — a product whose spine READ SUCCEEDED and holds no initiative records is calm
+  // and specific: it names what would have to exist. It is not the "No repositories" line below
+  // (there IS a repository), and it is not the red `sp-bad` above (nothing failed).
+  if (sp && sp.ok !== false && !parts.length) {
+    parts.push(`<div class="empty">No initiative records in this repository — the read succeeded and
+      there is genuinely nothing to place. They would live in <b>planning/initiatives/*.md</b>,
+      anchored to <b>planning/okrs/</b> or to a health budget.</div>`);
+  }
+  // workspace-repo-ingest R8 — an open PROPOSAL, grouped on its own. It is a property of the
+  // proposal, not of this repository: these records live in a clone PMOS made, and none of them is
+  // in this repo until an item is confirmed. The group disappears when the proposal closes.
+  parts.push(ingestGroup());
+  // R4 — the bucket that keeps a re-rooting from orphaning a tree of THIS product.
+  const orphan = loose.filter((w) => !seen.has(w.id));
+  if (orphan.length) {
+    parts.push(`<div class="sp-obj" data-plain="1"><div class="sp-o"><span class="id">no initiative</span>
+      <span class="nm">trees in this repository whose branch names none — supported, not a fault</span><span class="ct">${orphan.length}</span></div>
+      <div class="sp-trees">${orphan.map((w) => treeRow(w, g)).join('')}</div></div>`);
+  }
+  host.innerHTML = parts.filter(Boolean).join('') || `<div class="empty">No repositories — run <b>pmos</b> inside one.</div>`;
+
+  // workspace-product-switcher R6 — ONE invariant is replaced by TWO, never relaxed. The first is
+  // asserted here; the second (every product with ≥1 registered tree has exactly one button) is
+  // asserted in renderProducts, because that is where the buttons are. Both are `console.warn`
+  // self-checks in the shape the retired R4 count already used, so a re-rooting that orphans a
+  // tree still announces itself rather than waiting to be noticed.
+  // …but only once the spine has actually been READ. Before the first read `sp` is null, so no
+  // objective block is emitted, so a tree whose branch names an initiative has nowhere to render
+  // and is not in `loose` either — rendered < mine.length is the CORRECT transient state, not an
+  // unreachable tree. Warning on it fired on every boot, which is how a real self-check becomes
+  // noise the PM learns to scroll past.
+  const rendered = host.querySelectorAll('.treerow').length;
+  if (sp && sp.ok !== false && rendered !== mine.length) {
+    console.warn(`[spine] R6.1: ${mine.length} trees registered for this product, ${rendered} rendered — something is unreachable`);
+  }
+  host.querySelectorAll('[data-init-pick]').forEach((b) => b.onclick = () => openInitiative(b.dataset.initPick, state.wsId));
+  host.querySelectorAll('[data-ing-open]').forEach((b) => b.onclick = () => openIngest(b.dataset.ingOpen));
+  // the spine emits treeRow()/sessionRow() under each initiative and in both catch-all groups, so
+  // it needs the SAME wiring the legacy list has — not a subset of it.
+  wireTree(host);
+}
+// ── the six non-product modes ────────────────────────────────────────────────────────────────
+// Each list is built from what the repository actually holds. Where PMOS keeps no file for a
+// mode, it says so and names what would have to exist — it never renders a sample. A workspace
+// that invents plausible rows is worse than one that shows none, because the PM cannot tell the
+// difference by looking, and every honest-state rule this app has exists to keep that from
+// happening. `q` narrows every list through one predicate so search behaves the same everywhere.
+function flattenDocs(node, out) {
+  if (!node) return out;
+  (node.docs || []).forEach((d) => out.push(d));
+  (node.dirs || []).forEach((d) => flattenDocs(d, out));
+  return out;
+}
+function knowledgeTree(name) {
+  const lib = state.lib;
+  if (!lib || !Array.isArray(lib.knowledge)) return null;
+  return lib.knowledge.find((t) => t && (t.name === name || String(t.path || '').endsWith(name))) || null;
+}
+function modeMatches(s) { const q = state.q.toLowerCase(); return !q || String(s || '').toLowerCase().includes(q); }
+// The library's node shapes are not uniform — some entries carry `name`, some only `path`, and the
+// tree walker mixes both. Deriving the label from whichever is present keeps one malformed node
+// from throwing and blanking the whole list, which is what a bare `d.name.replace` did.
+function docName(d) {
+  const raw = (d && (d.name || String(d.path || '').split('/').pop())) || '';
+  return raw.replace(/\.md$/i, '');
+}
+function modeRow(id, kind, nm, right, sub, extra) {
+  const on = state.detail.kind === kind && state.detail.id === id;
+  return `<button class="md-row" data-md="${esc(kind)}" data-mdid="${esc(id)}" aria-current="${on}"${extra || ''}>
+    <span class="r1">${nm}${right ? `<span class="rt">${right}</span>` : ''}</span>${sub || ''}</button>`;
+}
+// A mode with nothing behind it. It names the file that would have to exist, so the sentence is
+// actionable rather than an apology — the PM can see exactly what would turn it on.
+function modeAbsent(what, wouldBe) {
+  return `<div class="md-none"><b>Not recorded.</b> ${esc(what)}
+    PMOS has no such file today, so this list is empty because there is nothing to read —
+    <b>not</b> because the read failed. It would come from <code>${esc(wouldBe)}</code>.</div>`;
+}
+function renderMode(host) {
+  const m = state.mode;
+  if (m === 'scheduled') return renderModeScheduled(host);
+  if (m === 'workflow') return renderModeWorkflow(host);
+  if (m === 'skills') return renderModeSkills(host);
+  if (m === 'knowledge') return renderModeKnowledge(host);
+  if (m === 'agent') return renderModeAgent(host);
+  if (m === 'memory') return renderModeMemory(host);
+  host.innerHTML = '';
+}
+function wireMode(host) {
+  host.querySelectorAll('[data-md]').forEach((b) => b.onclick = () => {
+    state.detail = { kind: b.dataset.md, id: b.dataset.mdid, wsId: state.wsId };
+    state.col2 = true; store.set('col2', 'on');
+    renderTree(); renderLibrary(); applyLayout();
+    mobPushDetail(b.dataset.md);          // no-op off the phone
+  });
+}
+// scheduled — the real scheduler, the same source the schedule surface reads
+function renderModeScheduled(host) {
+  if (state.sched === null) {
+    host.innerHTML = `<div class="md-note">reading the scheduler…</div>`;
+    loadSchedules();
+    return;
+  }
+  if (state.sched && state.sched.error) {
+    host.innerHTML = `<div class="sp-bad"><b>the scheduler could not be read</b><span>${esc(state.sched.error)}</span></div>`;
+    return;
+  }
+  const list = (state.sched || []).filter((s) => modeMatches(s.name));
+  host.innerHTML = list.length
+    ? list.map((s) => {
+        const st = s.enabled
+          ? (s.lastStatus === 'fail' ? 'last run failed' : (s.next ? 'next ' + esc(relTime(s.next)) : 'armed — never run yet'))
+          : 'disabled';
+        const cls = !s.enabled ? 'muted' : (s.lastStatus === 'fail' ? 'bad' : 'ok');
+        return modeRow(s.name, 'sched', `<span class="nm">${esc(s.name)}</span>`,
+          esc(s.cron || s.every || ''), `<span class="d" data-t="${cls}">${st}</span>`);
+      }).join('')
+    : `<div class="sp-nomatch">${state.q ? 'nothing matches' : 'No schedules yet — a successful read of nothing.'}</div>`;
+  wireMode(host);
+}
+// workflow — the lanes the ENGINE actually runs, and the step chain each one produces. These are
+// derived from the board, not stored as editable templates: PMOS derives a ladder from git order
+// (scripts/workflow-state.js), so a template the PM could edit here would be a control that
+// changes nothing. That is stated on the panel rather than implied by a disabled button.
+function laneChains() {
+  const bd = boardForCurrent();
+  const rows = (bd && bd.data && Array.isArray(bd.data.live)) ? bd.data.live : [];
+  const byLane = new Map();
+  rows.forEach((r) => {
+    const lane = r.lane || 'unknown';
+    if (!byLane.has(lane)) byLane.set(lane, { lane, chain: [], n: 0 });
+    const e = byLane.get(lane); e.n++;
+    const keys = (r.steps || []).map((s) => s.key);
+    if (keys.length > e.chain.length) e.chain = keys;
+  });
+  return [...byLane.values()].sort((a, b) => b.n - a.n);
+}
+/* workspace-jira-handoff R13 — DECLARED templates, listed separately from derived lane chains and
+ * labelled as declarations. Read per repository with the same stale guard the spine uses: a slower
+ * read for a repo the PM has left must not paint over the one they are looking at. */
+async function loadWorkflows() {
+  const w = state.workspaces.find((x) => x.id === state.wsId);
+  const key = w ? productKey(w) : null;
+  if (!key || state.workflowsFor === key) return;
+  state.workflowsFor = key;
+  let payload;
+  try { payload = await (await fetch('/api/console?name=workflows&ws=' + encodeURIComponent(state.wsId || ''))).json(); }
+  catch (e) { payload = { ok: false, error: `the workflow templates could not be read — ${String((e && e.message) || e)}` }; }
+  const now = state.workspaces.find((x) => x.id === state.wsId);
+  // a late arrival for a repo the PM has left must not paint — and must not leave the read marked
+  // done, or coming back would show nothing with nothing saying why
+  if (!now || productKey(now) !== key) { state.workflowsFor = null; return; }
+  state.workflows = payload;
+  if (state.mode === 'workflow') renderTree();
+  if (state.detail.kind === 'flow') renderLibrary();
+}
+// The declared group. It is NOT a lane chain and must never be mixed into that list: a lane chain
+// is derived from git order and a template is a file somebody wrote, and the whole of R13 is that
+// the second must not borrow the first's authority.
+function workflowTemplateRows() {
+  const t = state.workflows;
+  if (!t) return '';
+  if (t.ok === false) return `<div class="sp-bad"><b>the workflow templates could not be read</b><span>${esc(t.error || '')}</span></div>`;
+  const list = (t.templates || []).filter((x) => modeMatches(x.id) || modeMatches(x.title || ''));
+  if (!list.length) return '';
+  return `<div class="md-cap">declared — nothing derives from this yet</div>`
+    + list.map((x) => `<button class="md-row" data-tmpl="${esc(x.path)}">
+        <span class="r1"><span class="nm">${esc(x.title || x.id)}</span>
+          <span class="rt">${x.stages.length ? esc(String(x.stages.length)) + ' stages' : 'no stages parsed'}</span></span>
+        <span class="d">${esc(x.stages.join(' → ') || x.path)}</span></button>`).join('');
+}
+function renderModeWorkflow(host) {
+  loadWorkflows();
+  const bd = boardForCurrent();
+  if (bd && bd.pending) { host.innerHTML = `<div class="md-note">deriving the ladder…</div>`; return; }
+  const lanes = laneChains().filter((l) => modeMatches(l.lane));
+  // NO SILENT CAPS. The board returns what is in flight and reports the rest as `hidden`; lanes
+  // derived from it therefore describe the in-flight set, not the repository. Saying which is the
+  // difference between a reading and a claim.
+  const d = (bd && bd.data) || {};
+  const scope = d.hidden
+    ? `Derived from the ${(d.total || 0) - d.hidden} initiatives in flight — ${d.hidden} more are outside the board's cap and are not counted here.`
+    : 'Derived from every initiative on the board.';
+  host.innerHTML = `<div class="md-note">The lanes this repository runs, and the ladder each one
+      derives. Stage comes from git order — never declared — so these are read, not authored.
+      ${esc(scope)}</div>`
+    + (lanes.length
+      ? lanes.map((l) => modeRow(l.lane, 'flow', `<span class="nm">${esc(l.lane)}</span>`,
+          `${l.n} initiative${l.n === 1 ? '' : 's'}`,
+          `<span class="chain">${esc(l.chain.join(' → ')) || 'no steps derived'}</span>`)).join('')
+      : `<div class="sp-nomatch">${state.q ? 'nothing matches' : 'No ladder derived for this repository yet.'}</div>`)
+    + workflowTemplateRows();
+  wireMode(host);
+  // a template row opens the FILE — there is nothing else it could honestly do, since nothing in
+  // the engine reads it
+  host.querySelectorAll('[data-tmpl]').forEach((b) => b.onclick = () => openDoc(b.dataset.tmpl));
+}
+function renderModeSkills(host) {
+  const docs = [];
+  ['skills', 'build-skills'].forEach((n) => flattenDocs(knowledgeTree(n), docs));
+  const list = docs.filter((d) => modeMatches(docName(d)) || modeMatches(d.path));
+  host.innerHTML = list.length
+    ? list.map((d) => modeRow(d.path, 'skill', `<span class="nm">${esc(skillName(d))}</span>`, '',
+        `<span class="d">${esc(d.path)}</span>`)).join('')
+    : `<div class="sp-nomatch">${state.q ? 'nothing matches'
+        : 'No skills in this repository — skills live under skills/ and build-skills/.'}</div>`;
+  wireMode(host);
+}
+// a skill is a directory with a SKILL.md, so the directory is the name worth showing
+function skillName(d) {
+  const parts = String(d.path || d.name || '').split('/');
+  const last = parts[parts.length - 1] || '';
+  return /^SKILL\.md$/i.test(last) && parts.length > 1 ? parts[parts.length - 2] : last.replace(/\.md$/i, '');
+}
+function renderModeKnowledge(host) {
+  const okf = [];
+  flattenDocs(knowledgeTree('okf'), okf);
+  const gov = ((state.lib && state.lib.governance) || []);
+  const groups = [
+    { name: 'governance · the locked record', items: gov },
+    { name: 'okf · the knowledge bundle', items: okf },
+  ].map((g) => ({ ...g, items: g.items.filter((d) => modeMatches(docName(d)) || modeMatches(d.path)) }))
+    .filter((g) => g.items.length);
+  host.innerHTML = groups.length
+    ? groups.map((g) => `<div class="md-cap">${esc(g.name)}</div>` + g.items.map((d) =>
+        modeRow(d.path, 'know', `<span class="nm">${esc(docName(d))}</span>`, '',
+          `<span class="d">${esc(d.path)}</span>`)).join('')).join('')
+    : `<div class="sp-nomatch">${state.q ? 'nothing matches'
+        : 'No knowledge bundle in this repository — it would live under okf/.'}</div>`;
+  wireMode(host);
+}
+// agent — derived from the sessions that are actually running. PMOS has no agent REGISTRY (no
+// agents/*.yaml, no roster file), so this is the roster the runtime can honestly produce: which
+// agent binaries are running, on how many sessions, and in what state.
+function agentRoster() {
+  const by = new Map();
+  state.sessions.forEach((s) => {
+    const k = s.agent || 'unknown';
+    if (!by.has(k)) by.set(k, { name: k, n: 0, live: 0, sessions: [] });
+    const e = by.get(k); e.n++; e.sessions.push(s);
+    if (s.state !== 'exited') e.live++;
+  });
+  return [...by.values()].sort((a, b) => b.live - a.live || a.name.localeCompare(b.name));
+}
+function renderModeAgent(host) {
+  const list = agentRoster().filter((a) => modeMatches(a.name));
+  host.innerHTML = `<div class="md-note">The agents actually running here. PMOS keeps no agent
+      registry file, so this roster is derived from live sessions — it lists what is running, not
+      what could be.</div>`
+    + (list.length
+      ? list.map((a) => modeRow(a.name, 'agent',
+          `<span class="dot" aria-hidden="true">●</span><span class="nm">${esc(a.name)}</span>`,
+          `${a.n} session${a.n === 1 ? '' : 's'}`,
+          `<span class="d">${a.live ? `${a.live} live` : 'all exited'}</span>`,
+          ` data-live="${a.live ? 'on' : 'off'}"`)).join('')
+      : `<div class="sp-nomatch">${state.q ? 'nothing matches' : 'No sessions have run here yet.'}</div>`);
+  wireMode(host);
+}
+function renderModeMemory(host) {
+  host.innerHTML = modeAbsent(
+    'Agent memory — short-term session context, and long-term notes injected into every run.',
+    'pmos/state/memory.jsonl');
+}
+async function loadSchedules() {
+  if (state.schedLoading) return;
+  state.schedLoading = true;
+  const forWs = state.wsId;
+  try {
+    const r = await fetch('/api/schedules?ws=' + encodeURIComponent(state.wsId || ''));
+    const j = await r.json();
+    if (state.wsId !== forWs) return;                  // a slower read must never paint a newer tree
+    state.sched = j.schedules || [];
+  } catch (e) {
+    state.sched = { error: String((e && e.message) || e) };
+  } finally {
+    state.schedLoading = false;
+    if (state.mode !== 'product') renderTree();
+  }
+}
+
+// the ladder row for an initiative id, from the SELECTED repo's cached board
+function boardForCurrent() {
+  const w = state.workspaces.find((x) => x.id === state.wsId);
+  return w ? boardFor(w) : null;
+}
+function boardRowById(id) {
+  const w = state.workspaces.find((x) => x.id === state.wsId);
+  return w ? boardRow(w, id) : null;
+}
+// The destinations are MODES, not links: clicking one swaps what column 1 lists, and column 2
+// follows the selection made there. That is the difference from the version this replaces, where
+// each button jumped to a different surface and the column underneath never changed — the menu
+// looked like navigation but the structure below it did not move, so it read as decoration.
+//
+// Everything here is PRODUCT-SPECIFIC — knowledge and scheduled tasks belong to the repository in
+// view — which is why the menu sits inside the product's own column rather than beside it.
+// Re-rendered on every tree paint (unlike its predecessor, which rendered once): the pressed
+// state is part of the output now, so a cached strip would show the wrong mode as current.
+function renderMenu() {
+  const host = $('spMenu');
+  if (!host) return;
+  // The column names what it is showing. It used to be hardcoded "repos & sessions", which was
+  // true of exactly one of the seven modes.
+  const fold = $('wsFold');
+  if (fold) fold.lastChild.textContent = modeTitle();
+  const rows = MODES.map((m) => `<button class="spm" data-mode="${m.k}" title="${esc(m.title)}"
+      aria-pressed="${state.mode === m.k}">
+      <span class="g" aria-hidden="true">${m.g}</span><span class="l">${esc(m.label)}</span></button>`);
+  // The eighth cell squares up the two-row grid, and it is the control that puts the column away.
+  rows.push(`<button class="spm" data-collapse1="1" title="Hide this column">
+      <span class="g" aria-hidden="true">⟨</span><span class="l">hide</span></button>`);
+  host.innerHTML = rows.join('');
+  host.querySelectorAll('[data-mode]').forEach((b) => b.onclick = () => setMode(b.dataset.mode));
+  host.querySelectorAll('[data-collapse1]').forEach((b) => b.onclick = () => setCol('col1', false));
+}
+function setMode(k) {
+  if (!MODE_BY_K[k] || state.mode === k) return;
+  state.mode = k; store.set('mode', k);
+  // A mode swap must not leave column 2 describing something the new list cannot select — the
+  // panel would name a row nobody can see. Detail is cleared to the mode's own empty state and
+  // re-picked from the new list, EXCEPT for `product`, whose selection is the initiative the rest
+  // of the app is already built around and is worth preserving across a look at another mode.
+  if (k !== 'product' && state.detail.kind !== MODE_DETAIL[k]) state.detail = { kind: MODE_DETAIL[k] || 'repo', id: null, wsId: state.wsId };
+  if (k === 'product' && state.detail.kind !== 'initiative' && state.detail.kind !== 'repo') {
+    state.detail = { kind: 'repo', id: null, wsId: state.wsId };
+  }
+  renderTree(); renderLibrary(); applyLayout();
+}
+// which detail kind a mode's rows select into
+const MODE_DETAIL = { product: 'initiative', scheduled: 'sched', workflow: 'flow', skills: 'skill',
+  knowledge: 'know', agent: 'agent', memory: 'mem' };
+
 function renderTree() {
+  renderMenu();
+  renderProducts();
+  renderFocusBadge();
   const host = $('tree');
   if (!host) return;
+  // workspace-mobile-surface — the `more` destination is a ROOT, not a mode, so it owns this host
+  // while it is the screen on screen. It writes `.md-row`s (the same vocabulary as every other
+  // list in this column), never a phone-shaped list of its own.
+  if (mobMoreActive()) {
+    // the composer and the product switcher scope the PRODUCT list; above a menu of everything
+    // else they point at the wrong noun, so they stand down for this screen
+    const nb0 = $('newBtn'); if (nb0) nb0.hidden = true;
+    const nf0 = $('newForm'); if (nf0) nf0.hidden = true;
+    const ps0 = $('prodSwitch'); if (ps0) ps0.hidden = true;
+    renderMoreMenu(host);
+    return;
+  }
+  // Only `product` shows the spine. The other six modes list something else entirely, so the
+  // composer and the tree's own furniture are hidden for them — a "＋ new session" button above a
+  // list of decisions is an affordance pointed at the wrong noun.
+  const isProduct = state.mode === 'product';
+  const nb = $('newBtn'); if (nb) nb.hidden = !isProduct;
+  if (!isProduct) { const f = $('newForm'); if (f) f.hidden = true; }
+  if (!isProduct) { renderMode(host); return; }
+  if (SPINE_ON) { renderSpine(host); return; }   // renderSpine → wireTree → paintRename
   // group by repository (R3): `pmos` and `pmos ⑂ initiative/foo` are a parent and its child, not
   // two peers. The key comes from the server — `git worktree list` names the main worktree first.
   const groups = new Map();
@@ -374,6 +946,17 @@ function renderTree() {
       </button>${trees}</div>`;
   }).join('');
   host.innerHTML = html || `<div class="empty">No repositories — run <b>pmos</b> inside one.</div>`;
+  wireTree(host);
+}
+// Everything a tree row and a session row can DO. This lives apart from the markup because the
+// navigator has two renderers now — the spine (D-default) and the legacy repository list — and both
+// emit treeRow()/sessionRow(). When the spine landed it wired only [data-init-pick], which left
+// every affordance INSIDE a tree row dead in the shipped path: selecting a session, renaming it
+// (F2 or ✎), expanding a tree, ＋ session here, forgetting a tree, and the harness drill-in's
+// open-state. A row that renders but does nothing is worse than one that is absent, because it
+// looks available. One wiring function, called by both renderers, is what keeps that from
+// recurring the next time the navigator is re-rendered somewhere new.
+function wireTree(host) {
   host.querySelectorAll('[data-pick]').forEach((b) => b.onclick = () => selectWorkspace(b.dataset.pick));
   // R6 — select the tree AND open the composer against it. Deliberately NOT awaited: selectWorkspace
   // ends on four network reads (library · needs · branch · worktrees), and making the composer wait
@@ -549,23 +1132,578 @@ async function loadBoards() {
   }
 }
 
-function renderWorkspaces() {
-  const html = state.workspaces.map((w) => {
-    const n = state.sessions.filter((s) => s.ws === w.id && s.state !== 'exited').length;
-    const cur = w.id === state.wsId;
-    return `<div class="wsrow" data-id="${esc(w.id)}">
-      <button class="ws" data-pick="${esc(w.id)}" aria-current="${cur}" title="${esc(w.root)}">
-        <span class="cue" aria-hidden="true">${cur ? '▾' : '▸'}</span>
-        <span class="nm">${esc(w.name)}</span>
-        ${w.home ? '<span class="tag">home</span>' : ''}
-        <small>${n ? `${n} live` : ''}</small>
-      </button>
-      ${w.home ? '' : `<button class="forget" data-forget="${esc(w.id)}" aria-label="Stop hosting ${esc(w.name)}" title="${n ? 'end its sessions first' : 'stop hosting this repo (the repo is untouched)'}">✕</button>`}
-    </div>`;
+// The spine is a property of a REPOSITORY (its planning/okrs/ and its initiative records), so it is
+// read per selected repo and re-read when the selection moves to a different one. `spineFor` guards
+// against painting one repo's structure while another is selected — a stale spine is a lie, and the
+// wrong kind: it would look completely plausible.
+async function loadRadar() {
+  const w = state.workspaces.find((x) => x.id === state.wsId);
+  const key = w && w.repo_key ? w.repo_key : null;
+  if (!key || state.radarFor === key) return;
+  try {
+    const r = await fetch('/api/console?name=radar&ws=' + encodeURIComponent(state.wsId));
+    state.radar = await r.json(); state.radarFor = key;
+  } catch { state.radar = { ok: false }; state.radarFor = key; }
+  if (state.lens === 'dossier') renderLibrary();
+}
+async function loadSpine() {
+  const w = state.workspaces.find((x) => x.id === state.wsId);
+  const key = w && w.repo_key ? w.repo_key : null;
+  if (!key) { state.spine = null; state.spineFor = null; return; }
+  if (state.spineFor === key && state.spine) return;
+  try {
+    const r = await fetch('/api/console?name=spine&ws=' + encodeURIComponent(state.wsId));
+    const payload = await r.json();
+    // late arrivals lose: the PM may have moved on while this was in flight
+    const now = state.workspaces.find((x) => x.id === state.wsId);
+    if (!now || now.repo_key !== key) return;
+    state.spine = payload; state.spineFor = key;
+  } catch {
+    state.spine = { ok: false, error: 'could not reach the workspace server for the spine' };
+    state.spineFor = key;
+  }
+  // R4 clause 2 — the selection the branch could not make. This runs ONLY for the workspace that
+  // was still owed a landing, and only now that its own spine has answered: selecting an
+  // initiative from a spine read for a different product is precisely the failure `spineFor`
+  // guards the render against, and it would look completely plausible.
+  if (state.landPending && state.landPending === state.wsId) {
+    state.landPending = null;
+    const first = firstSpineInitiative(state.spine);
+    // No first initiative is R5's honest empty, not a fallback to somebody else's — the repo
+    // detail already on screen stays.
+    if (first) openInitiative(first, state.wsId);
+  }
+  renderTree();
+}
+
+/* ── workspace-focus ────────────────────────────────────────────────────────────────────────────
+ *
+ * The one surface in column 1 that is NOT scoped by the product switcher: it joins every registered
+ * repository, which is why `ws` is on the URL only because the console fetcher always appends it
+ * and is ignored by the handler. Everything rendered here is `lib/focus.js`'s own output — this
+ * file adds no judgement of its own, files nothing into the queue, and MUTATES NOTHING: there is no
+ * accept, no dispose, no anchor and no resolve anywhere below.
+ *
+ * The stale-paint guard is a SEQUENCE, not a key. Every other loader here compares against the
+ * workspace it was started for; focus has no such key, so a slower read is beaten by a newer one on
+ * ordering alone — which is the same property, expressed the only way this surface can express it.
+ */
+async function loadFocus() {
+  const seq = ++state.focusSeq;
+  let payload;
+  try {
+    const r = await fetch('/api/console?name=focus&ws=' + encodeURIComponent(state.wsId || ''));
+    payload = await r.json();
+  } catch (e) {
+    payload = { ok: false, error: `could not reach the workspace server for focus — ${String((e && e.message) || e)}` };
+  }
+  if (seq !== state.focusSeq) return;         // a newer read already won; this one may not paint
+  state.focus = payload;
+  renderFocusBadge();
+  if (state.focusOpen) renderFocus();
+}
+/* R5 — the badge prints `badge.text` and NEVER `count`. `count` is a true statement about the
+ * queue's length; it is not a true statement about the world whenever a contributing read failed,
+ * is still deriving, or never happened — and the module is the thing that knows which. */
+function renderFocusBadge() {
+  const el = $('focusBadge');
+  if (!el) return;
+  const f = state.focus;
+  if (!f) { el.textContent = ''; el.dataset.bad = '0'; return; }
+  if (f.ok === false) { el.textContent = 'focus unreadable'; el.dataset.bad = '1'; return; }
+  const b = f.badge || {};
+  // A clean, exact zero needs no badge at all — the panel says "nothing is waiting on you" in
+  // words, and a badge repeating it would be chrome asking to be read for no reading.
+  el.textContent = (b.n === 0 && b.exact) ? '' : String(b.text || '');
+  el.dataset.bad = (b.unreadable || b.failed) ? '1' : '0';
+}
+function toggleFocus(on) {
+  const open = on == null ? !state.focusOpen : !!on;
+  state.focusOpen = open;
+  const panel = $('focusPanel'), btn = $('focusBtn');
+  if (panel) panel.hidden = !open;
+  if (btn) btn.setAttribute('aria-expanded', String(open));
+  if (open) { renderFocus(); loadFocus(); }
+}
+const fcSec = (id, dfc, body) => `<section class="fc-sec" id="${id}" data-fc="${dfc}">${body}</section>`;
+const fcCap = (t) => `<div class="fc-cap">${esc(t)}</div>`;
+/* R2 — six sections, in this order, ALWAYS all six. A section that renders nothing when it is
+ * empty reads as "there is nothing of that kind", which is a claim; for `handoffs` it would be a
+ * false one, so every section below renders its own empty, absent or deriving state instead. */
+function renderFocus() {
+  const host = $('focusBody');
+  if (!host) return;
+  const f = state.focus;
+  if (!f) {
+    host.innerHTML = fcSec('fcIntro', 'intro', `<div class="fc-intro">reading focus across every registered repository…</div>`)
+      + fcSec('fcObjectives', 'objectives', fcCap('objectives'))
+      + fcSec('fcQueue', 'queue', fcCap('your queue'))
+      + fcSec('fcHandoffs', 'handoffs', fcCap('handoffs'))
+      + fcSec('fcDelegated', 'delegated', fcCap('delegated'))
+      + fcSec('fcUpkeep', 'upkeep', fcCap('upkeep'));
+    return;
+  }
+  if (f.ok === false) {
+    // A failed read is RED and carries the reader's own message — the existing `.cs-error`, because
+    // this workspace has exactly one way to say "broken read" and a second would end up calmer.
+    host.innerHTML = fcSec('fcIntro', 'intro', csError('focus', f.error || 'the focus read failed'))
+      + fcSec('fcObjectives', 'objectives', fcCap('objectives'))
+      + fcSec('fcQueue', 'queue', fcCap('your queue'))
+      + fcSec('fcHandoffs', 'handoffs', fcCap('handoffs'))
+      + fcSec('fcDelegated', 'delegated', fcCap('delegated'))
+      + fcSec('fcUpkeep', 'upkeep', fcCap('upkeep'));
+    return;
+  }
+  host.innerHTML = fcSec('fcIntro', 'intro', `<div class="fc-intro">${esc(f.intro || '')}</div>`)
+    + fcSec('fcObjectives', 'objectives', fcObjectives(f))
+    + fcSec('fcQueue', 'queue', fcQueue(f))
+    + fcSec('fcHandoffs', 'handoffs', fcHandoffs(f))
+    + fcSec('fcDelegated', 'delegated', fcDelegated(f))
+    + fcSec('fcUpkeep', 'upkeep', fcUpkeep(f));
+  wireFocus(host);
+}
+// R7 — one row per product, four states, and `none` (a read that succeeded on a repo declaring no
+// objectives) is NOT `not-read` (PMOS never got to it). The module decides which; this prints it.
+function fcObjectives(f) {
+  const rows = (f.objectives || []).map((o) => {
+    const body = o.state === 'objective' ? `<span class="nm">${esc(o.id || '')} ${esc(o.name || '')}</span>`
+      : o.state === 'none' ? `<span class="nm">${esc(o.note || 'this repository declares no objectives')}</span>`
+      : `<span class="nm">${esc(o.error || '')}</span>`;
+    return `<div class="fc-obj" data-state="${esc(o.state)}"><span class="fc-prod">${esc(o.productName || o.product || '')}</span>${body}</div>`;
   }).join('');
-  $('workspaces').innerHTML = html || `<div class="empty">No workspaces — run <b>pmos</b> inside a repo.</div>`;
-  $('workspaces').querySelectorAll('[data-pick]').forEach((b) => b.onclick = () => selectWorkspace(b.dataset.pick));
-  $('workspaces').querySelectorAll('[data-forget]').forEach((b) => b.onclick = () => forgetWorkspace(b.dataset.forget));
+  return fcCap('objectives') + (rows || `<div class="fc-none">No repository is registered, so no objective was read.</div>`);
+}
+// R4/R6 — the queue, plus the coverage sentence that stops a short list being read as a complete
+// one, plus the third state for a board that is still deriving.
+function fcQueue(f) {
+  const cov = (f.coverage || []).map((c) =>
+    `<div class="fc-cov">${esc(c.productName || c.product || '')} — ${esc(c.line || '')}</div>`).join('');
+  const deriving = (f.coverage || []).filter((c) => c.state === 'deriving');
+  const derivingNote = deriving.length
+    ? `<div class="fc-deriving">${deriving.length} board${deriving.length === 1 ? ' is' : 's are'} still deriving —
+        ${esc(deriving.map((c) => c.productName || c.product).join(', '))}. That is neither empty nor broken, and
+        anything those ladders would file is not in the list below yet.</div>`
+    : '';
+  const failed = (f.reads || []).filter((r) => r.state === 'error');
+  const failedNote = failed.map((r) =>
+    csError(`${r.productName || r.product || 'this product'} · ${r.source}`, r.error || 'the read failed')).join('');
+  const rows = (f.queue || []).map(fcItem).join('');
+  const body = rows || (failed.length
+    ? ''                                            // the red blocks above already say what is wrong
+    : `<div class="fc-none">${esc(f.empty_note || 'nothing is waiting on you')} — every contributing read succeeded.</div>`);
+  return fcCap('your queue') + failedNote + derivingNote + body + cov;
+}
+function fcItem(it) {
+  const t = it.target || {};
+  return `<button class="fc-item" data-tier="${esc(it.tier || '')}" data-kind="${esc(it.kind || '')}" data-rank="${esc(String(it.rank || ''))}"
+      data-target-kind="${esc(t.kind || '')}" data-target-product="${esc(t.product || '')}" data-target-id="${esc(t.id || '')}"
+      aria-label="${esc(`${it.rank}. ${it.subject || it.id || ''} — ${it.why || ''}`)}">
+    <span class="fc-rank">${esc(String(it.rank || ''))}</span>
+    <span class="fc-nm">${esc(it.subject || it.id || '')}</span>
+    <span class="fc-prod">${esc(it.productName || it.product || '')}</span>
+    <span class="fc-why">${esc(it.why || '')}${it.action ? ' — ' + esc(it.action) : ''}</span>
+    <span class="fc-read">read: ${esc(it.read || '')}</span>
+  </button>`;
+}
+/* R9 — an ABSENCE, in the module's own words. Not `.fc-none` (a read that ran and found nothing)
+ * and not `.cs-error` (a read that failed): there is no tracker to read, so there is nothing here
+ * that could be empty or broken. `count` is null and no number is printed anywhere in this block. */
+function fcHandoffs(f) {
+  const h = f.handoffs || {};
+  return fcCap(h.heading || 'handoffs · waiting on other teams')
+    + `<div class="fc-notconn"><b>not connected.</b> ${esc(String(h.body || '').replace(/^not connected\.\s*/, ''))}</div>`;
+}
+// R8 — what is running (the shared module's WORD, verbatim, hedge intact), and start actions that
+// are real. Where `starts_state` is 'not-resolved' the note is printed and NO button at all.
+function fcDelegated(f) {
+  const d = f.delegated || {};
+  const running = (d.running || []).map((r) => `<button class="fc-run" data-fc-sess="${esc(r.id)}">
+      <span class="g" aria-hidden="true">${esc(r.glyph || '•')}</span>
+      <span class="fc-nm">${esc(r.name || r.id)}</span>
+      <span class="fc-prod">${esc(r.productName || r.product || '')}</span>
+      <span class="fc-why">${esc(r.word || r.shown || '')}</span>
+    </button>`).join('');
+  const starts = d.starts_state === 'resolved'
+    ? (d.starts || []).map((s) => `<button class="fc-del" data-skill="${esc(s.skill)}" data-init="${esc(s.initiative)}"
+          data-product="${esc(s.product || '')}" data-input="${esc(s.initialInput || '')}"
+          title="${esc(`opens the composer against ${s.initiative} and stages this run prompt — PMOS never starts an agent without you pressing start`)}">▶ delegate</button>`).join('')
+    : '';
+  const note = `<div class="fc-notconn">${esc(d.starts_note || '')}</div>`;
+  return fcCap('delegated')
+    + (running || `<div class="fc-none">No session is running in any registered repository.</div>`)
+    + (d.starts_state === 'resolved' && starts ? starts : note);
+}
+// R10 — upkeep says only what it can read: a stated absence for memory, and the budgets with the
+// caveat that the caps have NOT been evaluated. No percentage, because a percentage implies a test.
+function fcUpkeep(f) {
+  const u = f.upkeep || {};
+  const mem = u.memory || {};
+  const b = u.budgets || {};
+  const memBlock = `<div class="fc-notconn"><b>${esc(mem.heading || 'memory grooming')}</b> — ${esc(mem.body || '')}</div>`;
+  let budgets;
+  if (b.state === 'error') budgets = csError('health budgets', b.error || 'the registry could not be read');
+  else {
+    const rows = (b.rows || []).map((r) => `<div class="fc-budget">
+        <span class="fc-nm">${esc(r.id)}</span>
+        <span class="fc-why">${esc(r.covers || '')}</span>
+        ${r.cap ? `<span class="n">${esc(r.total)} anchored · cap ${esc(r.cap)}</span>`
+          : `<span class="na">${esc(r.total)} anchored · cap not read</span>`}
+      </div>`).join('');
+    budgets = (rows || `<div class="fc-none">No health budget is declared in any registered repository.</div>`)
+      + `<div class="fc-cov">${esc(b.note || '')}</div>`
+      + `<div class="fc-cov">${esc(b.caveat || '')}</div>`
+      + (b.spine_not_read ? `<div class="fc-cov">${esc(String(b.spine_not_read))} product spine(s) were not read, so their anchored counts are missing from the rows above.</div>` : '');
+  }
+  return fcCap('upkeep') + memBlock + budgets;
+}
+/* R11 — clicking an item LANDS ON IT: the right initiative, in the right product, with that
+ * product's own selection. Landing on the previous product's selection is a failure of this
+ * requirement, which is why the workspace switch comes first and is awaited. */
+function wireFocus(host) {
+  host.querySelectorAll('.fc-item').forEach((b) => b.onclick = () => {
+    const kind = b.dataset.targetKind, prod = b.dataset.targetProduct, id = b.dataset.targetId;
+    if (kind === 'session') { selectSession(id); return; }
+    const trees = state.workspaces.filter((w) => productKey(w) === prod);
+    if (!trees.length) { flash(`that item is in ${prod || 'a repository'}, which is not registered here any more`); return; }
+    const remembered = store.get('lastTree:' + prod);
+    const pick = trees.find((w) => w.id === remembered) || trees.find((w) => w.root === prod) || trees[0];
+    const p = selectWorkspace(pick.id);
+    if (kind === 'initiative' && id) p.then(() => openInitiative(id, pick.id));
+  });
+  host.querySelectorAll('[data-fc-sess]').forEach((b) => b.onclick = () => selectSession(b.dataset.fcSess));
+  /* `▶ delegate` — a REAL action, and only ever the one PMOS can honour end to end. The `new`
+   * message carries no `initialInput` field (server.js:3658 forwards name/agent/cwd/ws/branch/
+   * createBranch/isolate/profile and nothing else), so sending one would start a session that
+   * silently ran no prompt. Instead this selects the tree, opens the composer against it, and
+   * stages the module's own `initialInput` in the scratchpad — where `→ terminal` sends it without
+   * a trailing newline, so nothing auto-runs. Everything the PM sees, they pressed. */
+  host.querySelectorAll('.fc-del').forEach((b) => b.onclick = () => {
+    const prod = b.dataset.product, id = b.dataset.init;
+    const trees = state.workspaces.filter((w) => productKey(w) === prod);
+    const pick = trees.find((w) => w.id === store.get('lastTree:' + prod)) || trees.find((w) => w.root === prod) || trees[0];
+    if (!pick) { flash(`${prod || 'that repository'} is not registered here any more — nothing was started`); return; }
+    const p = selectWorkspace(pick.id);
+    // the composer is opened against a CLAUDE session because that is what a `.skill` is run by;
+    // the radio group is repainted so the control on screen and the state agree
+    state.newAgent = 'claude';
+    paintNewAgents();
+    openNewForm();
+    p.then(() => {
+      if (!$('newForm').hidden) { renderNewTarget(); renderProfileChips(); }
+      $('newName').value = `${id} · ${b.dataset.skill.split('/').pop().replace(/\.skill$/, '')}`;
+      $('scratchText').value = b.dataset.input || '';
+      saveScratchpad();
+      openScratch(true);
+      flash('the run prompt is staged in the scratchpad — start the session, then press → terminal', 12000);
+    });
+  });
+}
+
+/* ── workspace-product-switcher ─────────────────────────────────────────────────────────────────
+ *
+ * The flat `#workspaces` list is gone, and so is the `other repositories` bucket it duplicated.
+ * What replaces both is ONE button per PRODUCT — a distinct `repo_key`, never a working tree. A
+ * product with four checkouts was four rows of the same name, and which checkout you are standing
+ * in is a detail of where you are, not of what you are working on.
+ *
+ * `productsOf` is PURE — no DOM, no `state`, no fetch — so `test.js` can walk the grouping and all
+ * four count states without a browser, and it is on `window` for the browser suite too. It is the
+ * only place the four count states are decided, which is what stops a fifth appearing.
+ */
+function productKey(w) { return (w && (w.repo_key || w.root)) || null; }
+// The FOUR states of `.psw-ct`, and there is no fifth. `0` is NEVER rendered for an unknown: a
+// board that is still deriving and a repository that genuinely holds no records are different
+// facts, and a zero standing in for either of them is a number nobody read.
+function boardCountState(payload) {
+  if (!payload) return { state: 'reading', value: null, error: null };
+  if (payload.pending) return { state: 'reading', value: null, error: null };
+  if (payload.ok === false) return { state: 'error', value: null, error: payload.error || 'the board could not be derived' };
+  if (payload.empty === true) return { state: 'empty', value: null, error: null };
+  const total = payload.data && Number.isFinite(payload.data.total) ? payload.data.total : null;
+  // ok:true with no total is a payload that has not finished saying anything — still reading, not
+  // a count of nothing.
+  if (total == null) return { state: 'reading', value: null, error: null };
+  return { state: 'count', value: total, error: null };
+}
+function productsOf(workspaces, sessions, boards) {
+  const byKey = new Map();
+  for (const w of (workspaces || [])) {
+    const key = productKey(w);
+    if (!key) continue;
+    if (!byKey.has(key)) byKey.set(key, { key, name: w.repo_name || w.name || key, path: key, trees: [], live: 0, count: null });
+    const p = byKey.get(key);
+    p.trees.push(w);
+    // the main worktree names the product; a linked worktree is `repo ⑂ branch` and would rename it
+    if (w.root === key || w.home) p.name = w.repo_name || w.name || p.name;
+  }
+  const wsById = new Map((workspaces || []).map((w) => [w.id, w]));
+  for (const s of (sessions || [])) {
+    if (!s || s.state === 'exited') continue;
+    const w = wsById.get(s.ws);
+    const p = w && byKey.get(productKey(w));
+    if (p) p.live++;
+  }
+  for (const p of byKey.values()) p.count = boardCountState((boards || {})[p.key]);
+  // Two repositories with the same basename stay distinguishable: the key IS the absolute path of
+  // the main worktree, it is what `path` carries, and it is what the button's tooltip prints.
+  return [...byKey.values()].sort((a, b) => String(a.name).localeCompare(String(b.name)) || String(a.key).localeCompare(String(b.key)));
+}
+window.productsOf = productsOf;
+
+function renderProducts() {
+  const box = $('prodSwitch'), host = $('pswList');
+  if (!box || !host) return;
+  // Product-scoped, so it is hidden outside `product` mode — a row of repository buttons above a
+  // list of skills scopes nothing the list below it is showing.
+  box.hidden = state.mode !== 'product';
+  const products = productsOf(state.workspaces, state.sessions, state.boards);
+  const curW = state.workspaces.find((x) => x.id === state.wsId);
+  const curKey = curW ? productKey(curW) : null;
+  const CT = {
+    reading: () => 'reading…',
+    empty: () => 'no initiative records',
+    error: () => 'unreadable',
+    count: (n) => `${n} initiative${n === 1 ? '' : 's'}`,
+  };
+  host.innerHTML = products.map((p) => {
+    const on = p.key === curKey;
+    const c = p.count;
+    // R2 — the selected product carries BOTH a colour and the ▸ mark, and the accessible name
+    // spells the state out, because the count is the one thing on this button that can be wrong.
+    const label = `${p.name} — ${CT[c.state](c.value)}${p.live ? `, ${p.live} live` : ''}`;
+    return `<button class="psw-b" data-product="${esc(p.key)}" aria-current="${on}"
+        aria-label="${esc(label)}" title="${esc(p.path)}">
+      <span class="psw-mk" aria-hidden="true">▸</span>
+      <span class="psw-nm">${esc(p.name)}</span>
+      <span class="psw-ct" data-state="${esc(c.state)}"${c.error ? ` title="${esc(c.error)}"` : ''}>${esc(CT[c.state](c.value))}</span>
+      ${p.live ? `<span class="psw-live">${p.live} live</span>` : ''}
+    </button>`;
+  }).join('');
+  // R6.2, the second half of the invariant renderSpine's self-check used to carry alone: EVERY
+  // product with at least one registered tree has exactly one button here. Without this, dropping
+  // the `other repositories` bucket could make a whole repository unreachable with nothing on
+  // screen saying it existed — the tidy-row-of-buttons failure this feature is named after.
+  const keys = new Set(state.workspaces.map(productKey).filter(Boolean));
+  const drawn = host.querySelectorAll('.psw-b').length;
+  if (drawn !== keys.size) {
+    console.warn(`[switcher] R6.2: ${keys.size} products registered, ${drawn} buttons — a repository is unreachable`);
+  }
+  host.querySelectorAll('[data-product]').forEach((b) => b.onclick = () => selectProduct(b.dataset.product));
+}
+/* R4 — switching lands somewhere TRUE, by a stated rule, and never on another product. */
+function selectProduct(key) {
+  const trees = state.workspaces.filter((w) => productKey(w) === key);
+  if (!trees.length) return;
+  const remembered = store.get('lastTree:' + key);
+  const pick = trees.find((w) => w.id === remembered)     // 1 · the tree you last stood in here
+    || trees.find((w) => w.root === key)                  // 2 · the repository's main worktree
+    || trees[0];                                          // 3 · the first registered tree
+  selectWorkspace(pick.id);
+}
+// The first initiative the spine renders for a product — R4's clause 2, used ONLY once that
+// product's own spine read has landed. Objectives first, then the health budgets, then unanchored:
+// the same order the spine paints, so "first" means the first row on screen.
+function firstSpineInitiative(sp) {
+  if (!sp || sp.ok === false) return null;
+  for (const o of (sp.objectives || [])) {
+    for (const k of (o.krs || [])) { if (k.initiatives && k.initiatives.length) return k.initiatives[0].id; }
+    if ((o.direct || []).length) return o.direct[0].id;
+  }
+  for (const b of (sp.budgets || [])) { if ((b.initiatives || []).length) return b.initiatives[0].id; }
+  if ((sp.unanchored || []).length) return sp.unanchored[0].id;
+  return null;
+}
+
+/* ── workspace-repo-ingest ──────────────────────────────────────────────────────────────────────
+ *
+ * Four stages — acquire · scan · review · accept — and the client's whole job is to render what
+ * each one actually produced. The three outcomes that must never collapse into each other are the
+ * point of every branch below: a clone that FAILED is red and carries git's own stderr; a scan that
+ * SUCCEEDED and found nothing is calm and says which path it read; a thing the repository simply
+ * does not have is stated as an absence. "0 initiatives found" over a failed clone is the exact
+ * sentence this feature exists to make unwritable.
+ *
+ * There is no confirm-all, no accept-remaining, and no keyboard path that confirms more than one
+ * item per activation. The tedium IS the gate.
+ */
+async function loadIngest() {
+  try {
+    const r = await fetch('/api/ingest');
+    const j = await r.json();
+    if (j && j.ok) { state.ingest = j.proposals || []; state.ingestRead = true; }
+  } catch { /* the socket's {t:'ingest'} push is the live path; a failed poll changes nothing */ }
+  renderTree();
+}
+function proposalById(id) { return state.ingest.find((p) => p.id === id) || null; }
+function openIngest(id) {
+  state.detail = { kind: 'ingest', id, wsId: state.wsId };
+  showRail();
+  renderLibrary();
+  mobPushDetail('ingest');
+}
+// How old the scan is, said out loud. A proposal reviewed against a repository that has moved is
+// the mismatch `applyChange` refuses, so the age is on screen BEFORE a confirm rather than after.
+function ingStamp(pr) {
+  if (!pr.scanned_at) return `<span class="ing-stamp">not scanned yet</span>`;
+  const d = new Date(pr.scanned_at);
+  return `<span class="ing-stamp">scanned ${esc(relTime2(pr.scanned_at))} · ${esc(d.toLocaleTimeString())}</span>`;
+}
+const ING_OPEN = (pr) => (pr.initiatives || []).filter((i) => i.disposition === 'open');
+/* R8 — the `ingested` group in the spine, headed with the count of UNCONFIRMED anchors and the
+ * source ref. It is a property of the proposal, not of the repository: nothing in it is in this
+ * repo until an item is confirmed, and the group disappears when the proposal closes. */
+function ingestGroup() {
+  const open = state.ingest.filter((p) => p.stage !== 'closed');
+  if (!open.length) return '';
+  return open.map((pr) => {
+    const n = ING_OPEN(pr).length;
+    const what = pr.ok === false ? 'the ingest failed — open it for the reason'
+      : pr.stage === 'acquire' ? 'cloning — nothing has been scanned yet'
+      : pr.stage === 'scan' ? 'scanning — read-only'
+      : n ? `${n} anchor${n === 1 ? '' : 's'} unconfirmed — nothing is written until you confirm one`
+      : 'every item dispositioned';
+    return `<div class="sp-obj" data-ingest="1"><div class="sp-o"><span class="id">ingested</span>
+      <span class="nm">proposed from ${esc((pr.source && pr.source.ref) || '?')} — a clone PMOS read, not this repository's records</span>
+      <span class="ct">${esc(String(n))}</span></div>
+      <button class="sp-i" data-ing-open="${esc(pr.id)}"><span class="r1"><span class="nm">${esc(pr.id)}</span></span>
+        <span class="r2"><span class="stg">${esc(pr.stage)}</span><span class="nx">${esc(what)}</span></span></button></div>`;
+  }).join('');
+}
+// The source toggle. BOTH consequence lines stay on screen, one under each option, so the
+// difference between registering a folder and ingesting a repository is stated in the affordance
+// before the click — never learned afterwards from what happened.
+function setAddSource(src) {
+  state.addSrc = src === 'github' ? 'github' : 'local';
+  const seg = $('addWsSource');
+  if (seg) seg.querySelectorAll('[data-src]').forEach((b) => b.setAttribute('aria-checked', String(b.dataset.src === state.addSrc)));
+  const loc = $('addWsLocal'), gh = $('addWsGithub');
+  if (loc) loc.hidden = state.addSrc !== 'local';
+  if (gh) gh.hidden = state.addSrc !== 'github';
+}
+async function startIngest(ref) {
+  if (!ref || !ref.trim()) { flash('name the repository — owner/name, or a GitHub URL'); return; }
+  let j = { ok: false, error: 'could not reach the workspace server' };
+  try {
+    j = await (await fetch('/api/ingest', { method: 'POST', headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ source: 'github', ref: ref.trim() }) })).json();
+  } catch {}
+  if (!j.ok) { flash(j.error || 'the ingest was refused', 12000); return; }
+  closeAddWs();
+  // The POST returns an id immediately and the clone runs off the request path — so the review
+  // surface opens on the `acquire` stage and the socket fills it in. It never shows a count.
+  state.ingest = state.ingest.filter((p) => p.id !== j.id).concat([{ id: j.id, stage: j.stage, source: { kind: 'github', ref: ref.trim() }, ok: true, error: null, log: [], unreadable: [], initiatives: [], adrs: [] }]);
+  openIngest(j.id);
+}
+async function postJSON(path, body) {
+  let j = { ok: false, error: 'could not reach the workspace server' };
+  try {
+    j = await (await fetch(path, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(body) })).json();
+  } catch {}
+  return j;
+}
+
+/* ── workspace-profiles ─────────────────────────────────────────────────────────────────────────
+ *
+ * The set of profiles is EXACTLY the set of descriptors the server read. Two chips are never
+ * hard-coded: a picker that always renders `work` and `personal` on a machine holding neither file
+ * makes a choice that applies nothing, and the session that follows looks identical to one that
+ * worked. Four payload states, four renderings, and none of them stands in for another.
+ *
+ * Nothing in this section may draw a dot, a tick or a colour that reads as "connected". A
+ * descriptor DECLARES mcp servers; PMOS runs no MCP client and checks no reachability, so every
+ * appearance of an mcp name carries the word `declared` and the file it came from.
+ */
+async function loadProfiles() {
+  if (state.profilesLoading) return;
+  state.profilesLoading = true;
+  let payload;
+  try { payload = await (await fetch('/api/profiles')).json(); }
+  catch (e) { payload = { ok: false, error: `could not reach the workspace server for the profile descriptors — ${String((e && e.message) || e)}`, dir: null, profiles: [], broken: [] }; }
+  state.profilesLoading = false;
+  state.profiles = payload;
+  renderProfileChips();
+  if (state.detail.kind === 'profiles' || state.detail.kind === 'connections' || state.detail.kind === 'agent'
+    || state.detail.kind === 'sched') renderLibrary();
+}
+function profileById(id) {
+  const p = state.profiles;
+  return (p && (p.profiles || []).find((x) => x.id === id)) || null;
+}
+// R8.2 — PMOS's OWN memory, keyed by agent binary name. It preselects; it starts nothing.
+function preferredProfileFor(agent) {
+  const p = state.profiles;
+  const id = p && p.prefs ? p.prefs[agent] : null;
+  return id && profileById(id) ? id : '';        // a preference for a descriptor that no longer reads preselects nothing
+}
+// One chip. The mcp list sits at the SAME weight as the account beside it — two equally ordinary
+// facts read out of one file — because emphasis on the mcp names would read as a claim about
+// reachability that nothing in this repository can make.
+function profChip(x, on) {
+  const mcp = (x.mcp || []).length
+    ? `mcp declared by this profile: ${(x.mcp || []).join(' ')}`
+    : 'no mcp servers declared in this profile';
+  const env = x.env_count ? `${x.env_count} environment variable${x.env_count === 1 ? '' : 's'}` : 'no environment overlay';
+  return `<button type="button" class="prof-chip" data-profile="${esc(x.id)}" role="radio" aria-checked="${on}"
+      aria-label="${esc(`${x.label || x.id} — ${x.account || 'no account declared'}; ${env}; ${mcp}`)}"
+      title="${esc((x.env_keys || []).join(' ') || 'this profile declares no environment overlay')}">
+    <span class="nm">${esc(x.label || x.id)}</span>
+    <span class="prof-mcp">${esc(x.account || 'no account declared')} · ${esc(env)}</span>
+    <span class="prof-mcp">${esc(mcp)}</span>
+  </button>`;
+}
+function renderProfileChips() {
+  const host = $('newProfile');
+  if (!host) return;
+  const p = state.profiles;
+  const none = (on) => `<button type="button" class="prof-chip" data-profile="" role="radio" aria-checked="${on}"
+      aria-label="no profile — this session starts with the workspace's default environment">
+    <span class="nm">no profile</span><span class="prof-mcp">the workspace's default environment</span></button>`;
+  if (!p) { host.innerHTML = `<span class="prof-mcp">reading ~/.claude/profiles/…</span>`; return; }
+  // If the read failed we do not know what is on this machine, so nothing is offered but the
+  // honest no-profile choice — and the reason is red and verbatim.
+  if (p.ok === false) {
+    host.innerHTML = `<div class="prof-bad" role="alert"><b>the profile descriptors could not be read</b> — ${esc(p.error || '')}</div>`
+      + none(state.newProfile === '');
+    wireProfileChips(host);
+    return;
+  }
+  const chips = (p.profiles || []).map((x) => profChip(x, state.newProfile === x.id)).join('');
+  // R4 — a broken descriptor is RED, named, and NOT offered; every good chip beside it still is.
+  // One bad file must never turn the surface into a stated absence: that reports a failure as an
+  // emptiness, which is the confusion the honest-state contract exists to prevent.
+  const broken = (p.broken || []).map((b) =>
+    `<div class="prof-bad" role="alert"><b>${esc(b.file)}</b> — ${esc(b.error)}</div>`).join('');
+  // R2 — absence and a successful read of nothing are DIFFERENT, and both name the path.
+  const note = p.absent
+    ? `<span class="prof-mcp">${esc(p.dir || '~/.claude/profiles')} does not exist — nothing was read because there is nothing to read. Sessions start exactly as they do today, recorded as having started under no profile.</span>`
+    : (!(p.profiles || []).length && !(p.broken || []).length
+      ? `<span class="prof-mcp">${esc(p.dir || '~/.claude/profiles')} holds no descriptors — the read succeeded and found none.</span>`
+      : '');
+  host.innerHTML = note + chips + none(state.newProfile === '') + broken;
+  wireProfileChips(host);
+}
+function wireProfileChips(host) {
+  host.querySelectorAll('[data-profile]').forEach((b) => b.onclick = () => {
+    state.newProfile = b.dataset.profile;
+    renderProfileChips();
+  });
+}
+/* R6 — the pane's provenance line. `profile_line` is computed SERVER-SIDE by profileLine() and
+ * printed verbatim, so no surface can re-word the five sentences it can say — and so the
+ * difference between "not recorded" and "no profile chosen" survives JSON, which `undefined` would
+ * not. Nothing is ever written into the pane to produce this: input written to a tmux pane goes to
+ * the agent, a ring-buffer append is erased on the next reattach, and a line injected into
+ * scrollback is indistinguishable from one the agent printed. */
+function paintProfileLines() {
+  ['profLine0', 'profLine1'].forEach((id, gi) => {
+    const el = $(id);
+    if (!el) return;
+    const active = state.groups[gi] && state.groups[gi].activeId;
+    const s = active ? state.sessions.find((x) => x.id === active) : null;
+    // No pane at all → nothing to describe, and `.profline:empty` collapses it. A session that IS
+    // here always gets a sentence, including "profile: not recorded".
+    el.textContent = s ? String(s.profile_line || '') : '';
+  });
 }
 async function forgetWorkspace(id) {
   const w = state.workspaces.find((x) => x.id === id);
@@ -588,9 +1726,11 @@ async function addWorkspace(root) {
 // `ms` is longer for messages carrying something to READ — a worktree's path is useless if it
 // vanishes before the PM can copy it out.
 function flash(msg, ms = 4000) {
-  const el = $('wsFoot'); const prev = el.textContent;
+  const el = $('wsFoot');
   el.textContent = msg;
-  setTimeout(() => { el.textContent = prev; }, ms);
+  // Recompute rather than restoring the captured string: the session count can change while a
+  // message is up, and putting the old text back would show a stale reading with no way to tell.
+  setTimeout(() => paintFoot(), ms);
 }
 
 // The glyph and the word both come from the SHARED join module (/lib/session-state.js), never
@@ -655,6 +1795,7 @@ function renderSessions() {
   renderTree();
   renderTabs();
   updateEmptyOverlay();
+  paintFoot();          // the strip's live-session count is a reading, so it moves with the list
   paintRename();
 }
 // The sub-line: the run's OWN focus, not `agent · cwd` (which was identical on every row in a
@@ -825,7 +1966,23 @@ function renderTabStrip(gi) {
   if (!host) return;
   const act = state.groups[gi].activeId;
   // wrap = two SIBLING buttons (select + close) — no interactive-inside-interactive nesting
-  host.innerHTML = mySessions().map((s) => {
+  // Viewer tabs are listed in the primary strip only. Listing them in both would imply a group
+  // assignment they do not have, and clicking one in group 1 would have to do something arbitrary.
+  const viewTabs = gi !== 0 ? '' : state.viewers.map((v) => {
+    const id = viewerId(v);
+    const on = state.viewActive === id;
+    // KIND is carried by the mark AND by the accessible name, never by colour alone.
+    const mark = v.kind === 'doc' ? '▪' : '▤';
+    const what = v.kind === 'doc' ? 'document' : 'surface';
+    return `
+    <div class="stab-wrap" data-kind="${v.kind}" data-vid="${esc(id)}" data-active="${on}">
+      <button class="stab" role="tab" data-vid="${esc(id)}" aria-selected="${on}"
+        aria-label="${esc(v.title)} — ${what}">
+        <span class="g" aria-hidden="true">${mark}</span>${esc(v.title)}</button>
+      <button class="x" data-vclose="${esc(id)}" aria-label="close ${what} ${esc(v.title)}">✕</button>
+    </div>`;
+  }).join('');
+  host.innerHTML = viewTabs + mySessions().map((s) => {
     // the glyph and the accessible name read the DERIVED state, like the wrapper's data-state
     // beside them. Reading the raw `s.state` here drew a `working` ● in the `quiet` colour — the
     // shape said one thing and the colour said another, on the surface most looked at.
@@ -843,11 +2000,17 @@ function renderTabStrip(gi) {
     b.onclick = () => selectSession(b.dataset.id, gi);
     b.ondblclick = () => startRename(b.dataset.id);
   });
-  // live tab ✕ kills the process (state flips to exited); exited tab ✕ removes it for good
-  host.querySelectorAll('.x').forEach((b) => b.onclick = () => send({ t: 'kill', id: b.dataset.close }));
+  host.querySelectorAll('.stab[data-vid]').forEach((b) => { b.onclick = () => selectViewer(b.dataset.vid); });
+  // Closing is symmetrical but NOT identical, and the verbs must not leak across the two kinds:
+  // a live session tab's ✕ kills the process, an exited one's removes it for good, and a viewer's
+  // closes the document. `data-close` and `data-vclose` keep them separate at the wiring, so a
+  // ✕ can never send `kill` for a path or `closeViewer` for a session id.
+  host.querySelectorAll('.x[data-close]').forEach((b) => b.onclick = () => send({ t: 'kill', id: b.dataset.close }));
+  host.querySelectorAll('.x[data-vclose]').forEach((b) => b.onclick = () => closeViewer(b.dataset.vclose));
 }
 function syncActiveState() {
   document.querySelectorAll('.sess,.stab-wrap').forEach((b) => {
+    if (!b.dataset.id) return;                    // a viewer tab has no session state to derive
     const s = state.sessions.find((x) => x.id === b.dataset.id);
     // the DERIVED state (working|quiet|exited), never the raw one. Writing `s.state` here put
     // `working` back over a row that renderSessions/tickQuiet had correctly painted `quiet`, so
@@ -971,11 +2134,56 @@ document.addEventListener('visibilitychange', () => { if (!document.hidden) refi
 // first paint measures the fallback font; the real metrics arrive with the webfont
 if (document.fonts && document.fonts.ready) document.fonts.ready.then(() => { for (const [id] of state.terms) fitOne(id); });
 
+/* ── the viewer (workspace-viewer-column) ──────────────────────────────────────────────────────
+ * Documents, images and summoned surfaces are TABS in the terminal column. One viewer pane spans
+ * the group row rather than one per group, and that is the stated rule the PRD's R6 asked for:
+ *
+ *   A viewer tab is NOT group-assignable. A session belongs to a group because two agents
+ *   genuinely run side by side; a document has no such property, and giving it one would invent
+ *   an affinity the object does not have. An active viewer covers both groups; closing it or
+ *   selecting a session returns them exactly as they were — `split` is untouched throughout.
+ *
+ * This also keeps the editor single-instance. Two doc bodies would mean two places `ed` could be
+ * mounted, and the save path has no concept of which one is authoritative.
+ */
+function viewerId(v) { return v.kind + ':' + v.key; }
+function openViewer(v) {
+  const id = viewerId(v);
+  if (!state.viewers.some((x) => viewerId(x) === id)) state.viewers.push(v);
+  state.viewActive = id;
+  renderTabs();
+  paintGroups();
+  refit();
+}
+function closeViewer(id) {
+  state.viewers = state.viewers.filter((x) => viewerId(x) !== id);
+  if (state.viewActive === id) {
+    // fall back to another open viewer before falling back to the terminal, so closing one of
+    // several documents does not dump the PM out of the viewer entirely
+    const next = state.viewers[state.viewers.length - 1];
+    state.viewActive = next ? viewerId(next) : null;
+  }
+  renderTabs();
+  paintGroups();
+  refit();
+}
+function selectViewer(id) {
+  const v = state.viewers.find((x) => viewerId(x) === id);
+  if (!v) return;
+  state.viewActive = id;
+  if (v.kind === 'doc') openDoc(v.key);            // re-render is cheap and keeps one read path
+  else openSurface(v.key);
+  paintGroups();
+  refit();
+}
 function selectSession(id, g) {
+  // Selecting a session leaves the viewer: the terminal has to be visible to be typed into, and a
+  // tab strip where selecting a tab does not change what is on screen is the worst of both.
+  if (state.viewActive) { state.viewActive = null; paintGroups(); refit(); }
   const s = state.sessions.find((x) => x.id === id);
   if (!s) return;
   // selecting a session from the palette may cross workspaces — follow it there
-  if (s.ws !== state.wsId) { state.wsId = s.ws; store.set('wsid', s.ws); renderWorkspaces(); renderSessions(); loadLibrary(); loadNeeds(); state.branch = null; renderBranch(); loadBranch(); loadLayouts(); }
+  if (s.ws !== state.wsId) { state.wsId = s.ws; store.set('wsid', s.ws); renderProducts(); renderSessions(); loadLibrary(); loadNeeds(); state.branch = null; renderBranch(); loadBranch(); loadLayouts(); }
   // Which group shows it: the one asked for; else the group already showing it (so a click in the
   // sidebar focuses where it lives rather than yanking it across); else the focused group.
   let want = typeof g === 'number' ? g : state.groups.findIndex((gr) => gr.activeId === id);
@@ -995,6 +2203,9 @@ function selectSession(id, g) {
   fitOne(id);
   const t = state.terms.get(id); if (t) setTimeout(() => t.term.focus(), 0);
   updateExitedOverlay(); updateEmptyOverlay();
+  // On the phone the terminal is a SCREEN, and reaching it is a navigation event. The pane itself
+  // is untouched by this — `.term-col` is never re-parented, so the instance and its socket live.
+  mobPushTerminal(id, s.name);
 }
 // One place decides what is visible where: each group shows exactly its own activeId, every other
 // pane is hidden, and the sidebar/tab selection marks follow.
@@ -1011,9 +2222,26 @@ function paintGroups() {
     host.querySelectorAll('.stab').forEach((b) => b.setAttribute('aria-selected', String(b.dataset.id === act)));
     host.querySelectorAll('.stab-wrap').forEach((b) => b.dataset.active = String(b.dataset.id === act));
   });
+  // The viewer covers the group row when a viewer tab is active. `.groups` is hidden rather than
+  // unmounted so the terminals keep their scrollback and their PTYs — this is a visibility change,
+  // never a teardown.
+  const vp = $('viewPane');
+  if (vp) {
+    vp.hidden = !state.viewActive;
+    // The GROUPS box stays mounted and visible — the tab strips live inside it, and a viewer that
+    // hides the strip hides its own way back. Only the terminal HOSTS are covered, and they are
+    // covered rather than unmounted so the terminals keep their scrollback and their PTYs.
+    $('groups').dataset.viewer = state.viewActive ? 'on' : 'off';
+  }
+  GROUP_TABS.forEach((tid) => {
+    const h = $(tid); if (!h) return;
+    h.querySelectorAll('.stab[data-vid]').forEach((b) => b.setAttribute('aria-selected', String(b.dataset.vid === state.viewActive)));
+    h.querySelectorAll('.stab-wrap[data-vid]').forEach((b) => b.dataset.active = String(b.dataset.vid === state.viewActive));
+  });
   $('group0').dataset.focus = String(state.focusG === 0);
   $('group1').dataset.focus = String(state.focusG === 1);
   $('noSess1').classList.toggle('on', splitOn() && !state.groups[1].activeId);
+  paintProfileLines();   // each group's provenance line follows whichever pane it is showing
 }
 function clearActive() {
   state.groups.forEach((g) => { g.activeId = null; });
@@ -1105,23 +2333,6 @@ document.addEventListener('visibilitychange', () => { if (!document.hidden) mayb
  * slate — r1 of the specimen did exactly that — makes a complete discovery read as nine failures.
  * `n/a` here is never inferred: it comes from the engine's own step status.
  */
-const DOSSIER_GROUPS = [
-  { key: 'strategy', label: 'strategy', roles: ['record', 'brief', 'research', 'scoping', 'intake', 'OKR'] },
-  { key: 'spec',     label: 'spec',     roles: ['PRD', 'rubric', 'user stories', 'explainer'] },
-  { key: 'design',   label: 'design',   roles: ['design brief', 'design', 'copy brief', 'copy', 'specimen', 'grilling'] },
-  { key: 'build',    label: 'build',    roles: ['reconcile', 'harness', 'fixture'] },
-  { key: 'learning', label: 'learning', roles: ['eval', 'findings', 'dogfood', 'rejected'] },
-];
-// Which ladder steps speak for which group, so a group can say "n/a for this lane" in the engine's
-// own words instead of a guess of our own.
-const GROUP_STEPS = {
-  strategy: ['route', 'anchor'],
-  spec: ['understand', 'spec', 'prototype'],
-  design: ['prototype'],
-  build: ['priors', 'contract', 'build', 'quality'],
-  learning: ['review', 'explain', 'accept'],
-};
-
 function detailWs() {
   const id = state.detail.wsId || state.wsId;
   return state.workspaces.find((w) => w.id === id) || null;
@@ -1129,8 +2340,6 @@ function detailWs() {
 // The library for whichever tree the detail is about — NOT necessarily the selected one. Fetched on
 // demand and cached, because a dossier must be openable for a tree the PM is not standing in.
 async function ensureLib(wsId) {
-  if (!wsId) return null;
-  if (wsId === state.wsId && state.lib) { state.libByWs[wsId] = state.lib; return state.lib; }
   if (state.libByWs[wsId]) return state.libByWs[wsId];
   try {
     const r = await fetch('/api/library?ws=' + encodeURIComponent(wsId));
@@ -1146,6 +2355,7 @@ async function openInitiative(id, wsId) {
   state.lens = 'dossier';
   showRail();
   renderLibrary();
+  mobPushDetail('initiative');            // no-op off the phone
   await ensureLib(state.detail.wsId);
   renderLibrary();
 }
@@ -1159,9 +2369,18 @@ function openRepoDetail(repoKey) {
 function renderLensTabs() {
   const host = $('lensTabs');
   if (!host) return;
-  const views = state.detail.kind === 'initiative'
-    ? [['dossier', 'dossier'], ['folders', 'folders'], ['scheduled', 'scheduled'], ['history', 'history']]
-    : [['folders', 'folders'], ['scheduled', 'scheduled'], ['history', 'history']];
+  // workspace-pm-spine — folders · scheduled · history are no longer STANDING furniture. An
+  // initiative's panel is its dossier; the other three are summoned when they are the job (⌘K, or
+  // the schedule composer), which is what they were: a file map you want while searching, and a
+  // schedule list you want while making one. A permanent tab strip for three views nobody opens by
+  // default costs a row of chrome on every render. `state.lens` still accepts them, so anything
+  // that sets it — the palette, a deep link, a stored preference — keeps working unchanged.
+  // Nothing to switch between on an initiative (its panel IS the view) or on any of the six mode
+  // panels (none of them is a sub-view of an initiative or a repository). A repository is the one
+  // selection with a real alternative.
+  const views = (state.detail.kind === 'initiative' || D2_KINDS[state.detail.kind])
+    ? []
+    : [['folders', 'folders']];
   host.innerHTML = views.map(([k, label]) =>
     `<button role="tab" data-lens="${k}" aria-selected="${state.lens === k}">${esc(label)}</button>`).join('');
   host.querySelectorAll('button').forEach((b) => b.onclick = () => {
@@ -1184,116 +2403,785 @@ function renderReading() {
   el.title = w.root;
 }
 
-function dossierRow(a) {
-  return `<button class="dz-art" data-doc="${esc(a.path)}">
-    <span class="role">${esc(a.role || 'doc')}</span>
-    <span class="pth">${esc(a.path)}</span></button>`;
+// ── column 2 · the detail panel ────────────────────────────────────────────────────────────────
+// The panel answers three questions in this order: where is this, what happens next, what is in
+// the way. Everything else on it is reference. That ordering is the whole design — the version
+// this replaces rendered workflow, evals, sessions and artifacts as four sections of equal
+// visual weight, so the answer to "what do I do next" had to be READ for rather than seen.
+//
+// Nothing here is stored. Every value is derived at read time from the board, the library and the
+// live session list, which is why a stale panel is not a failure mode this code can have.
+
+// The engine's step vocabulary → the glyph and the tone the panel paints with. `na` is deliberately
+// its own thing: it does not mean "not done yet", it means this lane never asks for the step, and
+// showing it as an empty circle beside real pending work would misreport the lane.
+const D2_DOT = { done: '✓', current: '●', blocked: '✗', pending: '○', unknown: '○', na: '–' };
+function d2Tone(row) {
+  if (!row) return 'info';
+  if ((row.blockers || []).length) return 'bad';
+  if (row.accepted && !(row.steps || []).some((s) => s.status === 'pending' || s.status === 'blocked')) return 'ok';
+  if (row.next && row.next.action) return 'warn';
+  return 'ok';
+}
+// Which step the panel opens ON. The engine names it (`next.step`); the fallbacks exist so a board
+// that answers with blockers but no `next` still lands the highlight somewhere true.
+function d2Here(row) {
+  if (!row) return -1;
+  const steps = row.steps || [];
+  if (row.next && row.next.step) {
+    const i = steps.findIndex((s) => s.key === row.next.step);
+    if (i >= 0) return i;
+  }
+  const b = steps.findIndex((s) => s.status === 'blocked');
+  if (b >= 0) return b;
+  return steps.findIndex((s) => s.status === 'pending');
+}
+// The file a next-action points at, so the action can be acted on rather than just read. The
+// action text names it — the engine writes real repo-relative paths into those sentences — so the
+// path is lifted from the sentence rather than guessed, and when there is none the initiative's
+// own record is the honest fallback. A chip is only ever rendered when a path was actually found.
+const D2_PATH = /\b((?:planning|okf|skills|build-skills|workspace|scripts|prototype)\/[\w./-]+|[\w./-]+\.(?:md|jsonl|json|yaml|yml|js))\b/;
+function d2Cmd(step, row) {
+  const text = (step && step.next) || '';
+  const m = text.match(D2_PATH);
+  if (m) return m[1];
+  if (step && step.status === 'blocked' && row && row.record) return row.record;
+  return null;
+}
+// `pending` is passed explicitly because "no record" and "not derived yet" are different facts and
+// only one of them is a finding. Claiming the first while the second is true is the panel telling
+// the PM their initiative has no record when the engine simply has not answered.
+function d2Pills(row, group, pending) {
+  const pills = [];
+  if (row && row.lane) pills.push(['lane', row.lane]);
+  if (row && row.anchor) pills.push(['anchor', String(row.anchor).split(/[(—]/)[0].trim()]);
+  else if (row) pills.push(['bad', 'unanchored']);
+  if (row && row.legacy) pills.push(['warn', 'legacy']);
+  if (row && row.accepted) pills.push(['flow', 'accepted']);
+  if (!row && !pending) pills.push(['warn', 'no record']);
+  if (pending) pills.push(['flow', 'deriving…']);
+  return pills.length
+    ? `<div class="d2-pills">${pills.map(([t, v]) => `<span class="d2-pill" data-t="${t}">${esc(v)}</span>`).join('')}</div>`
+    : '';
+}
+function d2Title(id, group, row, pending) {
+  const t = (group && group.title) || (row && row.title) || '';
+  return `<div class="d2-title">
+    <div class="nm" title="${esc(id)}">${esc(id)}</div>
+    ${t ? `<div class="tag">${esc(t)}</div>` : ''}
+    ${d2Pills(row, group, pending)}</div>`;
+}
+// The ladder. The step the initiative is ON carries the action at 14px — larger than the stage
+// names above it and the reference rows below it — because it is the one line being scanned for.
+// `anno` is workspace-jira-handoff R8: one line appended to the `build` and `review` steps when the
+// record declares a handoff. R9 is why it is a separate parameter rather than a field consulted
+// inside: `data-s`, `D2_DOT`, `d2Here` and `d2Tone` are computed from `row` ALONE and receive
+// byte-identical input with and without a declaration. A declared field may add context to a
+// derived verdict; it may never become one, and here it structurally cannot.
+const D2_ANNO_STEPS = { build: 1, review: 1 };
+function d2Rail(row, anno) {
+  const steps = row.steps || [];
+  if (!steps.length) return '';
+  const here = d2Here(row);
+  const tone = d2Tone(row);
+  return `<div class="d2-rail">${steps.map((s, i) => {
+    const isHere = i === here;
+    const action = isHere ? ((row.next && row.next.action) || s.next || '') : '';
+    const cmd = isHere ? d2Cmd(s, row) : null;
+    const note = anno && D2_ANNO_STEPS[s.key] ? anno : null;
+    return `<div class="d2-step" data-s="${esc(s.status || 'pending')}" data-here="${isHere ? 1 : 0}" data-tone="${tone}">
+      <span class="dot" aria-hidden="true">${D2_DOT[s.status] || '○'}</span>
+      <div class="txt">
+        <div class="r1"><span class="k">${esc(s.label || s.key)}</span>
+          <span class="t" title="${esc(s.evidence || '')}">${esc(s.evidence || '')}</span></div>
+        ${action ? `<div class="d2-act"><span class="d2-next">next</span>${esc(action)}</div>` : ''}
+        ${note ? `<div class="d2-anno">${esc(note)}</div>` : ''}
+        ${cmd ? `<button class="d2-cmd" data-doc="${esc(cmd)}" title="open ${esc(cmd)}">${esc(cmd)}</button>` : ''}
+      </div></div>`;
+  }).join('')}</div>`;
+}
+// The standing answer, for an initiative with no ladder to hang it on. Without this the no-record
+// case would show a title and then nothing, which reads as "fine" rather than "nothing is claimed".
+function d2Answer(text, tone) {
+  return `<div class="d2-ans" data-tone="${tone}"><span class="d2-next">next</span>${esc(text)}</div>`;
+}
+function d2Evals(id) {
+  const rd = state.radar && state.radar.ok !== false ? state.radar : null;
+  if (!rd) return '';
+  const rows = Array.isArray(rd.worst) ? rd.worst.filter((w) => w.id === id || w.initiative_id === id) : [];
+  // A rubric that was never run is NOT a pass. Saying so out loud is the whole point of the row —
+  // a blank here silently reads as green, which is exactly how a calibration number rots.
+  if (!rows.length) {
+    return `<div class="d2-field"><span class="lbl">evals</span>
+      <button class="d2-evals" data-doc="planning/evals/evals.jsonl">no verdict recorded — this is not a pass</button></div>`;
+  }
+  const w = rows[0];
+  const v = String(w.verdict || '').toLowerCase();
+  const kind = v.startsWith('pass') ? 'pass' : v.startsWith('fail') ? 'fail' : '';
+  const extra = rows.length > 1 ? ` · ${rows.length} verdicts` : '';
+  return `<div class="d2-field"><span class="lbl">evals</span>
+    <button class="d2-evals" data-v="${kind}" data-doc="planning/evals/evals.jsonl">${esc(w.verdict || '—')}${w.score != null ? ` — ${esc(String(w.score))}` : ''}${esc(extra)}</button></div>`;
+}
+function d2Sessions(id, handoffTo) {
+  const trees = state.workspaces.filter((w) => { const i = initiativeOf(w); return i.id === id; });
+  const ids = new Set(trees.map((w) => w.id));
+  const mine = state.sessions.filter((s) => ids.has(s.ws));
+  // No tree and no sessions are both NORMAL reads, so they read as prose, never as a fault.
+  // R10 (jira-handoff) — when the record declares a handoff, the same calm line gains one more
+  // FACT rather than a different tone: the build is not on this machine, and it says where it went.
+  if (!trees.length) {
+    return `<div class="d2-field"><span class="lbl">sessions</span><div class="val">
+      <span class="d2-quiet">No working tree in this repository is on <b>initiative/${esc(id)}</b> —
+      a normal state. The initiative exists whether or not anything is checked out for it.${handoffTo
+        ? ` — the build is not on this machine; it was handed to <b>${esc(handoffTo)}</b>.` : ''}</span>
+    </div></div>`;
+  }
+  const rows = mine.map((s) => {
+    const st = stateLabel(s);
+    return `<button class="d2-sess" data-dz-sess="${esc(s.id)}" data-state="${esc(st.shown || '')}"
+      aria-current="${s.id === state.active}">
+      <span class="g" aria-hidden="true">${GLYPH[st.shown] || '•'}</span>
+      <span class="nm">${esc(s.name || s.id)}</span>
+      <span class="st">${esc(st.text || '')}</span></button>`;
+  }).join('');
+  return `<div class="d2-field"><span class="lbl">sessions</span><div class="val">
+    ${rows || '<span class="d2-quiet">No sessions running on this initiative yet — normal, not an error.</span>'}
+    <button class="d2-btn" data-dz-start="${esc(trees[0].id)}">＋ start ${mine.length ? 'another' : 'a session'}</button>
+  </div></div>`;
+}
+function d2Artifacts(group) {
+  const arts = (group && group.artifacts) || [];
+  if (!arts.length) {
+    return `<div class="d2-field"><span class="lbl">artifacts</span><div class="val">
+      <span class="d2-quiet italic">None filed. The read succeeded — this is a verified empty.</span></div></div>`;
+  }
+  return `<div class="d2-field"><span class="lbl">artifacts</span><div class="val">
+    ${arts.map((a) => `<button class="d2-art" data-doc="${esc(a.path)}" title="${esc(a.path)}">
+      <span class="role">${esc(String(a.role || 'doc').toUpperCase())}</span>
+      <span class="path">${esc(a.path)}</span></button>`).join('')}
+  </div></div>`;
+}
+// Provenance, always. A stage without the branch it was derived from is a claim the data does not
+// support, so the panel never ends without naming where it read and how old that read is.
+function d2Foot(w, board) {
+  const stamp = board && board.as_of ? new Date(board.as_of).toLocaleTimeString() : null;
+  const br = (w && w.branch) || null;
+  return `<div class="d2-foot">${br ? `derived on ${esc(br)}` : 'no working tree'}${stamp ? ` · as of ${esc(stamp)}` : ''}${board && board.stale ? ' · refreshing' : ''}</div>`;
+}
+// The ladder for ONE initiative, fetched per (repo, id) and cached. Guarded against a stale paint:
+// a slower read for an initiative the PM has already navigated away from must never overwrite the
+// panel that is on screen.
+function ladderKey(w, id) { return `${(w && w.repo_key) || 'none'}::${id}`; }
+function ladderFor(w, id) { return state.ladders[ladderKey(w, id)] || null; }
+async function loadLadder(w, id) {
+  const key = ladderKey(w, id);
+  if (state.ladderWanted.has(key)) return;
+  state.ladderWanted.add(key);
+  try {
+    const r = await fetch(`/api/console?name=ladder&id=${encodeURIComponent(id)}&ws=${encodeURIComponent((w && w.id) || '')}`);
+    state.ladders[key] = await r.json();
+  } catch (e) {
+    state.ladders[key] = { ok: false, error: String((e && e.message) || e) };
+  }
+  if (state.detail.kind === 'initiative' && ladderKey(detailWs(), state.detail.id) === key) renderLibrary();
+}
+
+/* ── workspace-jira-handoff ─────────────────────────────────────────────────────────────────────
+ *
+ * A DECLARATION is something the PM typed into `planning/initiatives/<id>.md`. A READING is
+ * something PMOS went and looked at. Everything this section renders is the first kind, and every
+ * row says so in its own visible text — never only in a tooltip, never only in one banner at the
+ * top of the section, and never by colour alone. `links.connected` is the literal `false` on every
+ * code path in `lib/handoff.js`; there is no connected variant here and none is coming.
+ *
+ * The values arrive from frontmatter UNESCAPED — deliberately, so the module's whitelist test can
+ * compare them against the record byte for byte. `esc()` at every interpolation site below,
+ * INCLUDING the href, is therefore this renderer's job and not an optional tidiness.
+ *
+ * Cached per (repo_key, id) like the ladder, with the same stale-paint guard: a slower read for an
+ * initiative the PM has already navigated away from must never overwrite the panel on screen.
+ */
+function handoffFor(w, id) { return state.handoffs[ladderKey(w, id)] || null; }
+async function loadHandoff(w, id) {
+  const key = ladderKey(w, id);
+  if (state.handoffWanted.has(key)) return;
+  state.handoffWanted.add(key);
+  try {
+    const r = await fetch(`/api/console?name=handoff&id=${encodeURIComponent(id)}&ws=${encodeURIComponent((w && w.id) || '')}`);
+    state.handoffs[key] = await r.json();
+  } catch (e) {
+    state.handoffs[key] = { ok: false, error: `the handoff declaration could not be read — ${String((e && e.message) || e)}` };
+  }
+  if (state.detail.kind === 'initiative' && ladderKey(detailWs(), state.detail.id) === key) renderLibrary();
+}
+// The declared model for the initiative the panel is describing, or null while the read is in
+// flight / when the record declares no handoff. Callers render NOTHING for null — the panel is
+// unchanged for every initiative that was not handed off.
+function handoffLinks(id) {
+  const w = detailWs();
+  const h = handoffFor(w, id);
+  if (!h) { loadHandoff(w, id); return null; }
+  if (h.ok === false || h.absent || !h.links) return null;
+  return h.links.handoff ? h.links : null;
+}
+/* R8 — the annotation `d2Rail` appends to the `build` and `review` steps. R9 is the constraint that
+ * matters: this is a STRING passed alongside, never an input to `data-s`, `D2_DOT`, `d2Here` or
+ * `d2Tone`. A record's typed claim may add context to a derived verdict; it may never become one. */
+function handoffAnnotation(L) {
+  if (!L) return null;
+  const who = L.to ? ` to ${L.to}` : '';
+  const when = L.at ? ` on ${L.at}` : '';
+  const sys = (L.systems || []).length ? L.systems.join(' or ') : 'the receiving system';
+  return `handed off${who}${when} — this step reflects evidence in THIS repository only; `
+    + `PMOS cannot read ${sys} and is not claiming to know what happened there`;
+}
+/* R3 — one row per declared reference, rendered BETWEEN d2Rail and d2Evals: the handoff is the
+ * reason the local evidence below it is thin, and the explanation must precede the thing it
+ * explains. R7 — a malformed declaration is the only failure this surface can have, so it is the
+ * only thing that may render red, and it must. */
+function d2Links(id) {
+  const w = detailWs();
+  const h = handoffFor(w, id);
+  if (!h) { loadHandoff(w, id); return ''; }
+  if (h.ok === false) {
+    return `<div class="d2-bad"><span class="lbl">handoff</span><div class="why">${esc(h.error || '')}</div></div>`;
+  }
+  const L = h.links;
+  if (!L || !L.handoff) return '';            // not handed off — the panel is unchanged
+  const head = `<div class="d2-field"><span class="lbl">handoff</span><div class="val">
+      <span class="d2-quiet">${esc(L.to ? `handed to ${L.to}` : 'no recipient declared')}${L.at ? ` · ${esc(L.at)}` : ''}${L.flow ? ` · flow ${esc(L.flow)}` : ''}</span>
+    </div></div>`;
+  const problems = (L.problems || []).map((p) => `<div class="d2-bad"><span class="lbl">malformed declaration</span>
+      <div class="why"><b>${esc(p.id)}</b>${p.declared == null ? '' : `: <code>${esc(p.declared)}</code>`} — ${esc(p.why)}</div></div>`).join('');
+  const rows = (L.links || []).map((l) => {
+    // R5 — clickable ONLY when the declared value is an absolute http(s) URL, and then it is
+    // byte-identical to what the record says. PMOS never constructs a URL it was not given.
+    const ref = l.href
+      ? `<a href="${esc(l.href)}" target="_blank" rel="noopener">${esc(l.declared)}</a>`
+      : `<span class="d2-inert">${esc(l.declared)}<button type="button" data-copy="${esc(l.declared)}"
+           aria-label="Copy ${esc(l.declared)}">copy</button></span>`;
+    return `<div class="d2-link" role="group" aria-label="${esc(`${l.declared} — ${l.state_text}`)}">
+      <span class="d2-kind"><span aria-hidden="true">⇄ </span>${esc(l.kind)}</span>
+      ${ref}
+      <span class="d2-notconn">${esc(l.state_text)}</span>
+      ${l.inert_why ? `<span class="d2-notconn">${esc(l.inert_why)}</span>` : ''}
+    </div>`;
+  }).join('');
+  // R6 — a declared `flow:` with no references is a VERIFIED EMPTY, in the panel's own words for
+  // one, never a section that quietly does not render.
+  const empty = L.empty
+    ? `<div class="d2-link"><span class="d2-notconn">${esc(L.flow ? `${L.flow} declared` : 'a handoff is declared')};
+        no external references recorded in the record yet. The read succeeded — this is a verified empty.</span></div>`
+    : '';
+  return head + problems + `<div class="d2-links">${rows}${empty}</div>`;
 }
 function renderDossier() {
   const host = $('library');
   const id = state.detail.id;
   const w = detailWs();
   const board = w ? boardFor(w) : null;
-  const row = board && board.data && Array.isArray(board.data.live)
-    ? board.data.live.find((r) => r.id === id) : null;
+  // Prefer the initiative's OWN ladder; fall back to the board only while that read is in flight,
+  // so the panel shows the board's answer rather than nothing during the first paint.
+  const lad = ladderFor(w, id);
+  if (!lad) loadLadder(w, id);
+  const row = (lad && lad.ok && lad.row) || (board && board.data && Array.isArray(board.data.live)
+    ? board.data.live.find((r) => r.id === id) : null);
   const lib = (w && state.libByWs[w.id]) || (w && w.id === state.wsId ? state.lib : null);
   const group = lib && Array.isArray(lib.initiatives) ? lib.initiatives.find((g) => g.id === id) : null;
+  // The record's DECLARED handoff. Null for every initiative that was not handed off, and null
+  // while the read is in flight — the panel is byte-identical to today in both cases.
+  const L = handoffLinks(id);
+  const anno = handoffAnnotation(L);
+  const handedTo = L ? L.to : null;
 
-  if (board && board.ok === false) {
-    host.innerHTML = csError('the initiative ladder', board.error || 'the board could not be derived');
+  // R5 — a FAILED read is red and says why. Never a tidy empty state standing in for a broken one.
+  // The initiative's own read is authoritative here: the board failing is a fact about the board.
+  const failed = (lad && lad.ok === false && lad.error) || (!lad && board && board.ok === false && board.error);
+  if (failed) {
+    host.innerHTML = d2Title(id, group, null)
+      + `<div class="d2-bad"><span class="lbl">read failed</span>
+         <div class="why">${esc(failed)}</div></div>`
+      + d2Foot(w, board);
+    wireDossier();
     return;
   }
-  const head = `<div class="dz-head">
-    <div class="dz-id">${esc(id)}</div>
-    ${group && group.title ? `<div class="dz-t">${esc(group.title)}</div>` : ''}
-    <div class="dz-meta">
-      ${row ? `<span class="pill lane">${esc(row.lane || '')}</span>` : ''}
-      ${row ? `<span class="pill">${row.stage === 'accepted' ? 'accepted' : 'stage ' + esc(row.stage || '')}</span>` : ''}
-      ${row && row.anchor ? `<span class="pill">${esc(String(row.anchor).split(/[(—]/)[0].trim())}</span>` : ''}
-      ${row && row.legacy ? '<span class="pill">legacy</span>' : ''}
-    </div>
-    ${row ? dossierAttrib(w, board) : ''}
-  </div>`;
-
-  if (board && board.pending) {
-    host.innerHTML = head + `<div class="dz-wait">Deriving this initiative's ladder…
-      <span class="sub">the derivation shells git once per initiative and runs in a child process,
-      so the workspace stays responsive while it does.</span></div>` + dossierArtifacts(group, null);
+  // Still deriving — either this initiative's own read is in flight, or the board is. Neither is a
+  // finding, and neither may be painted as one.
+  if (!lad && !row) {
+    host.innerHTML = d2Title(id, group, null, true)
+      + `<div class="d2-noladder">Deriving this initiative's ladder… the engine resolves each
+         artifact's first appearance by shelling git, so the read takes a moment.</div>`
+      + d2Links(id) + d2Sessions(id, handedTo) + d2Artifacts(group) + d2Foot(w, board);
     wireDossier();
     return;
   }
   if (!row) {
-    host.innerHTML = head + `<div class="dz-none">No ladder for <b>${esc(id)}</b> in this repository's board —
-      it has no initiative record, or the record is not readable. The artifacts below are what the
-      library can see; nothing about its position in the loop is being claimed.</div>`
-      + dossierArtifacts(group, null);
+    host.innerHTML = d2Title(id, group, null)
+      + d2Answer('File an initiative record — artifacts may exist, but no loop position is claimed.', 'warn')
+      + `<div class="d2-noladder">No initiative record for <b>${esc(id)}</b> in this repository, so
+         nothing about its position in the loop is being claimed. The read itself succeeded — what
+         follows is what the library can see.</div>`
+      + d2Links(id) + d2Evals(id) + d2Sessions(id, handedTo) + d2Artifacts(group) + d2Foot(w, board);
     wireDossier();
     return;
   }
-  host.innerHTML = head + dossierNext(row) + dossierArtifacts(group, row);
+  // Accepted AND owing render together — an initiative can be accepted with steps still open, and
+  // a green badge on its own would be the watermelon flag.
+  const open = (row.steps || []).filter((s) => s.status === 'pending' || s.status === 'blocked');
+  let standing = '';
+  if (row.accepted && open.length) {
+    standing = d2Answer(`Accepted, and ${open.length} step${open.length === 1 ? '' : 's'} never closed: ${open.map((s) => s.key).join(' · ')}.`, 'warn');
+  } else if (!row.next || !row.next.action) {
+    standing = d2Answer(row.accepted ? 'Accepted — nothing owed. New work should be a new initiative.'
+      : 'Nothing owed. Every step this lane asks for is closed.', 'ok');
+  }
+  // R3 — d2Links sits BETWEEN d2Rail and d2Evals: the handoff is the reason the local evidence
+  // below it is thin, and the explanation must precede the thing it explains.
+  host.innerHTML = d2Title(id, group, row) + standing + d2Rail(row, anno)
+    + d2Links(id) + d2Evals(id) + d2Sessions(id, handedTo) + d2Artifacts(group) + d2Foot(w, board);
   wireDossier();
 }
-// R5 in the rail: the same attribution the tree rows carry. A stage without its branch is a claim
-// the data does not support.
-function dossierAttrib(w, board) {
-  const stamp = board && board.as_of ? new Date(board.as_of).toLocaleTimeString() : null;
-  return `<div class="dz-attrib">derived on <b>${esc((w && w.branch) || '?')}</b>${stamp ? ` · as of ${esc(stamp)}` : ''}${board && board.stale ? ' · refreshing' : ''}
-    <span class="sub">build and quality are scoped to this branch's commits, not to all of history</span></div>`;
+function wireDossier() {
+  const host = $('library');
+  host.querySelectorAll('[data-doc]').forEach((b) => b.onclick = () => openDoc(b.dataset.doc));
+  // R5 (jira-handoff) — a reference PMOS was given but cannot turn into a location gets a copy
+  // affordance rather than a link that goes somewhere PMOS invented.
+  host.querySelectorAll('[data-copy]').forEach((b) => b.onclick = async () => {
+    try { await navigator.clipboard.writeText(b.dataset.copy); flash('copied ' + b.dataset.copy); }
+    catch { flash('could not copy — select the reference and press ⌘C'); }
+  });
+  // selecting a session in the initiative's panel is what puts it in the terminal column
+  host.querySelectorAll('[data-dz-sess]').forEach((b) => b.onclick = () => selectSession(b.dataset.dzSess));
+  host.querySelectorAll('[data-dz-start]').forEach((b) => b.onclick = () => {
+    const p = selectWorkspace(b.dataset.dzStart);
+    openNewForm();
+    p.then(() => { if (!$('newForm').hidden) renderNewTarget(); });
+  });
 }
-// Accepted and owing render TOGETHER — an initiative can be accepted with steps still open, and a
-// green badge alone would be the watermelon.
-function dossierNext(row) {
-  const open = (row.steps || []).filter((s) => s.status === 'pending' || s.status === 'blocked');
-  const accepted = row.stage === 'accepted';
-  if (accepted && open.length) {
-    return `<div class="dz-next owed"><b>still owed · ${open.length} step${open.length === 1 ? '' : 's'}</b>
-      Accepted, and these never closed: ${open.map((s) => esc(s.key)).join(' · ')}.</div>`;
+
+// ── the detail panels for the six non-initiative modes ──────────────────────────────────────
+// Each one describes a row the PM picked in column 1, and each ends by naming the file it read.
+// Where an action would be a lie — an "edit" on a ladder PMOS derives rather than stores — the
+// panel says why instead of offering a control that does nothing.
+function d2Nothing(msg) {
+  $('library').innerHTML = `<div class="d2-empty">${esc(msg)}</div>`;
+}
+/* ── the profile panels (workspace-profiles R8.2, R8.3, R10) ────────────────────────────────────
+ * Three pickers, each honest about what it persists — and the two below are NOT the composer's:
+ * the composer's chip applies to one process, the agent preference is PMOS remembering something,
+ * and a schedule's profile is a field on a schedule record. Saying which is which is the whole of
+ * R8, because all three look like the same control.
+ */
+function profChipRow(selected, extra) {
+  const p = state.profiles;
+  if (!p) return `<span class="prof-mcp">reading ~/.claude/profiles/…</span>`;
+  if (p.ok === false) return `<div class="prof-bad" role="alert"><b>the profile descriptors could not be read</b> — ${esc(p.error || '')}</div>`;
+  const chips = (p.profiles || []).map((x) =>
+    `<button type="button" class="prof-chip" data-pf="${esc(x.id)}" role="radio" aria-checked="${selected === x.id}">
+      <span class="nm">${esc(x.label || x.id)}</span>
+      <span class="prof-mcp">${esc((x.mcp || []).length ? 'mcp declared: ' + x.mcp.join(' ') : 'no mcp declared')}</span></button>`).join('');
+  const none = `<button type="button" class="prof-chip" data-pf="" role="radio" aria-checked="${!selected}">
+      <span class="nm">${esc(extra || 'no profile')}</span></button>`;
+  if (!(p.profiles || []).length) {
+    return `<span class="prof-mcp">${esc(p.dir || '~/.claude/profiles')} ${p.absent ? 'does not exist — there is nothing to choose from' : 'holds no descriptors — the read succeeded and found none'}.</span>` + none;
   }
-  if (row.next && row.next.action) {
-    return `<div class="dz-next"><b>next · ${esc(row.next.step || '')}</b>${esc(row.next.action)}</div>`;
+  return `<div class="prof" role="radiogroup" aria-label="Profile">${chips}${none}</div>`;
+}
+// R8.2 — a workspace PREFERENCE, remembered by PMOS, used to preselect the composer. It is not an
+// agent attribute, it starts nothing, and the label says both.
+function agentProfileField(a) {
+  const cur = state.profiles && state.profiles.prefs ? (state.profiles.prefs[a.name] || '') : '';
+  const stale = cur && !profileById(cur);
+  return `<div class="d2-field"><span class="lbl">profile</span><div class="val">
+    ${profChipRow(stale ? '' : cur, 'no preference')}
+    <p class="prof-note">A <b>workspace preference, remembered by PMOS</b>, used to preselect the
+      composer when you start a <code>${esc(a.name)}</code> session. It is not an attribute of the agent —
+      PMOS keeps no agent registry — and choosing one starts nothing.</p>
+    ${stale ? `<div class="prof-bad" role="alert">the remembered profile <b>${esc(cur)}</b> is not among the descriptors that were read, so nothing is preselected</div>` : ''}
+  </div></div>`;
+}
+function wireAgentProfile(a) {
+  $('library').querySelectorAll('[data-pf]').forEach((b) => b.onclick = async () => {
+    const j = await postJSON('/api/profiles/prefer', { agent: a.name, profile: b.dataset.pf || null });
+    if (!j.ok) { flash(j.error || 'the preference was not remembered', 10000); return; }
+    if (state.profiles) state.profiles.prefs = j.prefs || {};
+    // the composer's preselection follows the preference the moment it changes
+    if (state.newAgent === a.name) state.newProfile = preferredProfileFor(a.name);
+    renderLibrary(); renderProfileChips();
+  });
+}
+// R8.3 — a schedule's profile is a field on the schedule record, used by fireSchedule when it
+// spawns an AGENT-kind task. A skill-kind task runs in this process and never creates a PTY, so
+// the row states that instead of offering a control that would do nothing.
+function schedProfileField(t) {
+  if (t.profile_applies === false) {
+    return `<div class="d2-field"><span class="lbl">profile</span><div class="val">
+      <span class="d2-quiet">This task runs <b>in the workspace server's own process</b> — there is no
+      terminal session and therefore no environment to apply a profile to. A control here would do nothing.</span>
+    </div></div>`;
   }
-  return `<div class="dz-next done"><b>nothing owed</b>Every step this lane asks for is closed.</div>`;
+  return `<div class="d2-field"><span class="lbl">profile</span><div class="val">
+    ${profChipRow(t.profile || '', 'no profile')}
+    <p class="prof-note">${t.profile ? '' : 'No profile is recorded on this schedule. '}Applied when the
+      scheduler starts this task's session, exactly as the composer applies one — chosen at process
+      creation and never changed afterwards.</p></div></div>`;
+}
+function wireSchedProfile(t) {
+  $('library').querySelectorAll('[data-pf]').forEach((b) => b.onclick = async () => {
+    const j = await postJSON('/api/schedules/update', { id: t.id, profile: b.dataset.pf || null });
+    if (!j.ok) { flash(j.error || 'the schedule was not updated', 10000); return; }
+    state.sched = null; loadSchedules();
+    if (j.schedule) { t.profile = j.schedule.profile; renderLibrary(); }
+  });
 }
-function dossierArtifacts(group, row) {
-  const arts = (group && group.artifacts) || [];
-  const used = new Set();
-  const stepBy = {};
-  for (const st of (row && row.steps) || []) stepBy[st.key] = st;
-
-  const sections = DOSSIER_GROUPS.map((g) => {
-    const mine = arts.filter((a) => g.roles.includes(a.role));
-    mine.forEach((a) => used.add(a.path));
-    // the lane's own verdict on this group, in the engine's words — never our inference
-    const naStep = (GROUP_STEPS[g.key] || []).map((k) => stepBy[k]).filter(Boolean);
-    const allNa = naStep.length && naStep.every((st) => st.status === 'na');
-    if (!mine.length && allNa) {
-      return `<div class="dz-sec"><h5>${esc(g.label)} <span class="c">n/a</span></h5>
-        <div class="dz-na">${esc(naStep[0].evidence || 'not required in this lane')}</div></div>`;
-    }
-    if (!mine.length) {
-      return `<div class="dz-sec"><h5>${esc(g.label)} <span class="c">nothing yet</span></h5>
-        <div class="dz-na">No ${esc(g.label)} artifact is filed for this initiative.</div></div>`;
-    }
-    return `<div class="dz-sec"><h5>${esc(g.label)} <span class="c">${mine.length}</span></h5>
-      ${mine.map(dossierRow).join('')}</div>`;
+// R10 — profile detail shows only what was read or derived. "What runs on it" is derived at read
+// time from live sessions' RECORDED profiles; a session PMOS did not start is counted nowhere, and
+// the panel says so rather than leaving the absence to be inferred from a smaller number.
+function profilesPanel() {
+  const p = state.profiles;
+  if (!p) return `<div class="d2-title"><div class="nm">profiles</div><div class="tag">reading…</div></div>`;
+  const head = `<div class="d2-title"><div class="nm">profiles</div>
+    <div class="tag">descriptors read from disk · nothing is verified</div></div>`;
+  if (p.ok === false) {
+    return head + `<div class="d2-bad"><span class="lbl">read failed</span><div class="why">${esc(p.error || '')}</div></div>`
+      + `<div class="d2-acts"><button class="d2-btn" data-prof-reload="1">read again</button></div>`
+      + `<div class="d2-foot">${esc(p.dir || '~/.claude/profiles')}</div>`;
+  }
+  const broken = (p.broken || []).map((b) => `<div class="prof-bad" role="alert"><b>${esc(b.file)}</b> — ${esc(b.error)}</div>`).join('');
+  if (!(p.profiles || []).length) {
+    return head + `<div class="d2-field"><span class="lbl">descriptors</span><div class="val">
+        <span class="d2-quiet">${esc(p.dir || '~/.claude/profiles')} ${p.absent
+          ? 'does not exist. Nothing was read because there is nothing to read — sessions start exactly as they do today, recorded as having started under no profile.'
+          : 'holds no descriptors. The read succeeded and found none.'}</span></div></div>`
+      + broken + `<div class="d2-foot">${esc(p.dir || '~/.claude/profiles')}</div>`;
+  }
+  const rows = (p.profiles || []).map((x) => {
+    const live = state.sessions.filter((s) => s.profile_id === x.id && s.state !== 'exited');
+    const sched = (Array.isArray(state.sched) ? state.sched : []).filter((s) => s.profile === x.id);
+    return `<div class="d2-field"><span class="lbl">${esc(x.label || x.id)}</span><div class="val">
+      <span class="d2-quiet">${esc(x.account || 'no account declared in this descriptor')}</span>
+      <span class="prof-mcp">${esc(x.env_count ? `${x.env_count} environment variable${x.env_count === 1 ? '' : 's'}: ${(x.env_keys || []).join(' ')}` : 'no environment overlay declared')}</span>
+      <span class="prof-mcp">${esc((x.mcp || []).length ? `mcp declared by this profile: ${x.mcp.join(' ')}` : 'no mcp servers declared in this profile')} — declared, never verified; PMOS runs no MCP client</span>
+      ${live.map((s) => `<button class="d2-sess" data-dz-sess="${esc(s.id)}"><span class="nm">${esc(s.name || s.id)}</span>
+        <span class="st">running on this profile</span></button>`).join('')}
+      <span class="prof-mcp">${live.length ? '' : 'no session PMOS started is running on this profile'}${sched.length ? ` · ${sched.length} schedule${sched.length === 1 ? '' : 's'} name it` : ''}</span>
+    </div></div>`;
   }).join('');
-
-  const rest = arts.filter((a) => !used.has(a.path));
-  const other = rest.length
-    ? `<div class="dz-sec"><h5>other <span class="c">${rest.length}</span></h5>${rest.map(dossierRow).join('')}</div>`
-    : '';
-  const none = !arts.length
-    ? `<div class="dz-na">The library sees no artifacts for this initiative yet. This is a verified
-       empty — the read succeeded.</div>` : '';
-  return `<div class="dz-arts">${sections}${other}${none}</div>`;
+  return head + rows + broken
+    + `<div class="d2-noladder">A session PMOS did not start — a tmux pane adopted at boot, or one
+       created before profiles existed — records no profile and is counted nowhere above. That is
+       stated rather than absorbed into a smaller number.</div>`
+    + `<div class="d2-foot">${esc(p.dir || '~/.claude/profiles')}</div>`;
+}
+function connectionsPanel() {
+  const p = state.profiles;
+  const head = `<div class="d2-title"><div class="nm">connections</div>
+    <div class="tag">nothing is connected — this lists what profiles DECLARE</div></div>`;
+  if (!p) return head + `<div class="d2-field"><span class="lbl">reading</span><div class="val"><span class="d2-quiet">reading the profile descriptors…</span></div></div>`;
+  if (p.ok === false) {
+    return head + `<div class="d2-bad"><span class="lbl">read failed</span><div class="why">${esc(p.error || '')}</div></div>`
+      + `<div class="d2-foot">${esc(p.dir || '~/.claude/profiles')}</div>`;
+  }
+  // One row per (profile, mcp name). No dot, no colour-as-status, no sync time, no count of
+  // anything outside this machine. When no descriptor was read at all there are NO ROWS — an empty
+  // list of connections would still be a list, and a list implies there is something to connect to.
+  const rows = [];
+  for (const x of (p.profiles || [])) {
+    for (const m of (x.mcp || [])) {
+      rows.push(`<div class="d2-link"><span class="d2-kind"><span aria-hidden="true">⇄ </span>${esc(m)}</span>
+        <span class="d2-inert">${esc(x.label || x.id)}</span>
+        <span class="d2-notconn">declared by this profile — not connected; PMOS runs no MCP client, holds no credential and performs no reachability check</span></div>`);
+    }
+  }
+  if (!rows.length) {
+    return head + `<div class="d2-field"><span class="lbl">declared</span><div class="val">
+        <span class="d2-quiet">${esc(p.dir || '~/.claude/profiles')} ${p.absent
+          ? 'does not exist, so no profile declares an MCP server.'
+          : 'holds no descriptor that declares an MCP server.'} There is nothing to list — not an empty
+        connection list, but no declaration at all.</span></div></div>`
+      + `<div class="d2-foot">${esc(p.dir || '~/.claude/profiles')}</div>`;
+  }
+  return head + `<div class="d2-links">${rows.join('')}</div>`
+    + `<div class="d2-noladder">These are strings in a JSON file on this machine. PMOS does not
+       start them, reach them or check them, so nothing here is a status.</div>`
+    + `<div class="d2-foot">${esc(p.dir || '~/.claude/profiles')}/*.json</div>`;
 }
-function wireDossier() {
-  $('library').querySelectorAll('[data-doc]').forEach((b) => b.onclick = () => openDoc(b.dataset.doc));
+
+/* ── the ingest review panel (workspace-repo-ingest R6/R7/R9/R10/R12) ───────────────────────── */
+const ING_A_TEXT = { declared: '', guessed: 'guessed', none: 'none' };
+function ingAnchor(it) {
+  const st = it.anchor_state || 'none';
+  const val = it.anchor_value || '';
+  const label = st === 'declared' ? `anchor declared by the record — ${val}`
+    : st === 'guessed' ? `anchor guessed by ingest, not confirmed — ${val}`
+    : 'no anchor — this repository declares no objectives';
+  const body = st === 'declared' ? esc(val)
+    : st === 'guessed' ? `<span aria-hidden="true">◆</span> ${esc(ING_A_TEXT.guessed)} ${esc(val)}`
+    : esc(ING_A_TEXT.none);
+  return `<span class="ing-anchor" data-a="${esc(st)}" aria-label="${esc(label)}">${body}</span>`;
+}
+function ingestPanel(pr) {
+  const src = (pr.source && pr.source.ref) || '?';
+  const head = `<div class="d2-title"><div class="nm">${esc(src)}</div>
+    <div class="tag">ingest ${esc(pr.id)} · stage ${esc(pr.stage || '?')}</div>
+    <div class="d2-pills">${ingStamp(pr)}</div></div>`;
+  // A FAILED clone or scan is RED and carries the tool's own message. It is never "0 initiatives
+  // found": the three clone failures the server distinguishes stay distinguished here because the
+  // string it sent is printed and nothing is composed on top of it.
+  if (pr.ok === false) {
+    return head + `<div class="ing-bad" role="alert"><b>the ingest failed</b><br>${esc(pr.error || 'no reason was reported')}</div>`
+      + (pr.credential_note ? `<div class="ing-note">${esc(pr.credential_note)}</div>` : '')
+      + ingLog(pr) + `<div class="d2-foot">${esc(pr.clone_dir || 'state/clones')}</div>`;
+  }
+  // Stages that have not produced a reading yet say so. This is the THIRD state — not empty, not
+  // broken — and it must never be drawn as either.
+  if (pr.stage === 'acquire' || pr.stage === 'scan') {
+    return head + `<div class="ing-note">${pr.stage === 'acquire'
+      ? 'Cloning. Nothing has been read yet, so nothing is proposed — this is neither an empty repository nor a failure.'
+      : 'Scanning the clone, read-only. Nothing is written into any repository, and nothing is proposed until the scan finishes.'}</div>`
+      + ingLog(pr) + `<div class="d2-foot">${esc(pr.clone_dir || 'state/clones')}</div>`;
+  }
+  const open = ING_OPEN(pr);
+  const items = (pr.initiatives || []).map((it) => {
+    const done = it.disposition !== 'open';
+    return `<div class="ing-item">
+      <span class="nm">${esc(it.id)}</span>
+      ${ingAnchor(it)}
+      ${done ? `<span class="ing-stamp">${esc(it.disposition)}</span>` : ''}
+      <span class="pth">${esc(it.path)}</span>
+      ${it.evidence ? `<span class="ing-ev">read: ${esc(it.evidence)}</span>` : ''}
+      ${done ? '' : (it.anchor_state === 'declared'
+        // R11 — a record that already declares `parent_kr` scans as `declared`, which IS the
+        // idempotence mechanism: there is nothing to write, so no confirm is offered. It can still
+        // be taken off the proposal, or every-item-declared would leave a list with no way out.
+        ? `<span class="ing-stamp">already declared in the record — nothing to write</span>
+           <button type="button" data-ing-dismiss="${esc(it.id)}">take off this proposal</button>`
+        : `<input type="text" data-ing-anchor="${esc(it.id)}" value="${esc(it.anchor_value || '')}"
+             aria-label="Anchor to write into ${esc(it.path)}" placeholder="q3-2026:o1:kr2 or health:tech" />
+           <button type="button" data-ing-confirm="${esc(it.id)}">confirm this anchor</button>
+           <button type="button" data-ing-dismiss="${esc(it.id)}">dismiss</button>`)}
+    </div>`;
+  }).join('');
+  // A successful read of NOTHING is calm and names the path it read. It is not the failure above
+  // and it is not a missing section.
+  const noneFound = !(pr.initiatives || []).length
+    ? `<div class="ing-note">read <b>planning/</b> at ${esc(pr.root || pr.clone_dir || 'the clone')} — 0 initiative records.
+       This repository may not use PMOS record conventions. The read succeeded.</div>` : '';
+  const bad = (pr.unreadable || []).length
+    ? `<div class="ing-bad" role="alert"><b>${pr.unreadable.length} record${pr.unreadable.length === 1 ? '' : 's'} could not be read</b>
+        ${pr.unreadable.map((u) => `<div>${esc(u.path)} — ${esc(u.error)}</div>`).join('')}
+        These are shown rather than dropped from the count.</div>` : '';
+  const adrs = (pr.adrs || []).length
+    ? `<div class="d2-sub">decision records</div>` + pr.adrs.map((a) => `<div class="ing-item">
+        <span class="nm">${esc(a.title || a.id)}</span>
+        ${a.disposition !== 'open' ? `<span class="ing-stamp">${esc(a.disposition)}</span>` : ''}
+        <span class="pth">${esc(a.path)}</span>
+        ${a.disposition === 'open' ? `<button type="button" data-adr-accept="${esc(a.path)}">accept into this repository</button>
+          <button type="button" data-adr-super="${esc(a.path)}">superseded</button>` : ''}
+      </div>`).join('')
+    : `<div class="ing-note">No decision records found in the clone — the read succeeded and there are none.</div>`;
+  return head
+    + `<div class="ing-note">A confirmation is the ONLY thing that writes, and it writes one
+        <code>parent_kr</code> into one record. ${open.length
+        ? `<b>${open.length}</b> item${open.length === 1 ? '' : 's'} await one — there is no confirm-all, and each write is one deliberate act.`
+        : 'Every proposed item has been confirmed or dismissed.'}</div>`
+    + `<div class="d2-sub">initiative records</div>` + items + noneFound + bad
+    + adrs + ingLog(pr)
+    + `<div class="d2-foot">${esc(pr.clone_dir || 'state/clones')} · ${esc(src)}${pr.source && pr.source.commit ? '@' + esc(pr.source.commit) : ''}</div>`;
+}
+// R10 — the FULL log, in order, including the steps that found nothing and the steps that failed.
+// It is the evidence the pipeline did what it says, so it is never summarised.
+function ingLog(pr) {
+  const rows = (pr.log || []).map((l) => `<div class="ing-row" data-level="${esc(l.level || 'info')}">
+    ${l.path ? `<span class="pth">${esc(l.path)}</span>` : ''}<span>${esc(l.message || '')}</span></div>`).join('');
+  return `<div class="d2-sub">ingest log</div>`
+    + (rows ? `<div class="ing-log">${rows}</div>` : `<div class="ing-note">No log lines were recorded for this proposal.</div>`);
+}
+function wireIngest(pr) {
+  const host = $('library');
+  host.querySelectorAll('[data-ing-confirm]').forEach((b) => b.onclick = async () => {
+    const id = b.dataset.ingConfirm;
+    const input = host.querySelector(`[data-ing-anchor="${CSS.escape(id)}"]`);
+    const anchor = input ? input.value.trim() : '';
+    if (!anchor) { flash('type the anchor to write — a guess is not a declaration'); if (input) input.focus(); return; }
+    b.disabled = true;
+    const j = await postJSON('/api/ingest/confirm', { id: pr.id, item: id, anchor });
+    b.disabled = false;
+    if (!j.ok) { flash(j.error || 'the write was refused', 14000); return; }
+    // The resolver's verdict is reported whether or not it resolved: confirming an anchor the OKR
+    // documents do not declare is permitted (the PM may know something they do not yet say), and
+    // PMOS reports rather than blocks.
+    flash(`${j.path} — parent_kr: ${j.anchor} · ${j.resolves ? 'resolves' : 'does NOT resolve'} — ${j.resolver_note || ''}`, 16000);
+  });
+  host.querySelectorAll('[data-ing-dismiss]').forEach((b) => b.onclick = async () => {
+    const j = await postJSON('/api/ingest/dismiss', { id: pr.id, item: b.dataset.ingDismiss });
+    if (!j.ok) flash(j.error || 'the dismissal was not recorded', 12000);
+  });
+  const adr = async (p, disposition) => {
+    const j = await postJSON('/api/ingest/adr', { id: pr.id, path: p, disposition, ws: state.wsId });
+    // R12 — the `ingested` badge is derived from `ingested_from` being present in the written file,
+    // never from a stored flag, so what is reported here is the write itself.
+    flash(j.ok ? (j.wrote ? `written to ${j.wrote} carrying ingested_from` : 'recorded as superseded — nothing was copied')
+      : (j.error || 'the disposition was not recorded'), j.ok ? 8000 : 14000);
+  };
+  host.querySelectorAll('[data-adr-accept]').forEach((b) => b.onclick = () => adr(b.dataset.adrAccept, 'accepted'));
+  host.querySelectorAll('[data-adr-super]').forEach((b) => b.onclick = () => adr(b.dataset.adrSuper, 'superseded'));
 }
 
+const D2_KINDS = {
+  sched() {
+    const t = (Array.isArray(state.sched) ? state.sched : []).find((x) => x.name === state.detail.id);
+    if (!t) return d2Nothing('Select a scheduled task on the left.');
+    const last = t.lastStatus;
+    $('library').innerHTML = `
+      <div class="d2-title"><div class="nm">${esc(t.name)}</div>
+        <div class="tag">scheduled task · ${t.enabled ? 'enabled' : 'disabled'}</div></div>
+      <div class="d2-field"><span class="lbl">cadence</span><div class="val">
+        <span class="d2-quiet">${esc(t.cron || t.every || 'not set')}</span></div></div>
+      <div class="d2-field"><span class="lbl">runs</span><div class="val">
+        <span class="d2-quiet">${esc(t.skill || t.command || 'no skill named')}</span></div></div>
+      <div class="d2-field"><span class="lbl">last run</span><div class="val">
+        <span class="d2-quiet">${last ? esc(last) : 'never run yet — that is stated, not implied'}</span></div></div>
+      <div class="d2-field"><span class="lbl">next</span><div class="val">
+        <span class="d2-quiet">${t.next ? esc(relTime(t.next)) : (t.enabled ? 'not scheduled' : 'disabled — nothing is armed')}</span></div></div>
+      ${schedProfileField(t)}
+      <div class="d2-foot">the scheduler runs while this server does</div>`;
+    wireDossier();
+    wireSchedProfile(t);
+  },
+  flow() {
+    const l = laneChains().find((x) => x.lane === state.detail.id);
+    if (!l) return d2Nothing('Select a lane on the left.');
+    const tw = state.workflows;
+    const tmplCount = tw && tw.ok !== false ? (tw.templates || []).length : 0;
+    $('library').innerHTML = `
+      <div class="d2-title"><div class="nm">${esc(l.lane)}</div>
+        <div class="tag">lane · ${l.n} initiative${l.n === 1 ? '' : 's'} in flight</div></div>
+      <div class="d2-sub">ladder</div>
+      <div class="d2-list">${l.chain.map((k, i) => `<div class="d2-item">
+        <span class="n">${String(i + 1).padStart(2, '0')}</span><span class="k">${esc(k)}</span></div>`).join('')
+        || '<span class="d2-quiet italic">no steps derived for this lane yet</span>'}</div>
+      <div class="d2-noladder">This ladder is <b>derived</b>, not stored. Stage comes from git
+        first-appearance order (<code>scripts/workflow-state.js</code>), so changing the sequence
+        means changing the rules, which is a gate change — there is nothing here to edit.
+        ${tmplCount
+          // R13 — the old sentence ended "…so there is no template to edit here", which stops being
+          // true the moment a template file exists. It is AMENDED rather than left standing: the
+          // templates are real, they are declarations, and the engine still does not read them.
+          ? `This repository declares <b>${tmplCount}</b> workflow template${tmplCount === 1 ? '' : 's'}
+             under <code>planning/workflows/</code>. They are <b>declarations</b> — the engine derives one
+             fixed ladder per lane and does not read <code>flow:</code>, so nothing above changes because
+             of them. They are listed separately in this mode.`
+          : ''}</div>
+      <div class="d2-foot">scripts/workflow-state.js · derived per initiative</div>`;
+    wireDossier();
+  },
+  skill() {
+    const p = state.detail.id;
+    if (!p) return d2Nothing('Select a skill on the left.');
+    $('library').innerHTML = `
+      <div class="d2-title"><div class="nm">${esc(skillName({ path: p }))}</div>
+        <div class="tag">skill · an executable procedure</div></div>
+      <div class="d2-field"><span class="lbl">defined in</span><div class="val">
+        <button class="d2-art" data-doc="${esc(p)}"><span class="path">${esc(p)}</span></button></div></div>
+      <div class="d2-acts"><button class="d2-btn" data-doc="${esc(p)}">open definition</button></div>
+      <div class="d2-foot">${esc(p)}</div>`;
+    wireDossier();
+  },
+  know() {
+    const p = state.detail.id;
+    if (!p) return d2Nothing('Select a document on the left.');
+    const name = p.split('/').pop().replace(/\.md$/i, '');
+    $('library').innerHTML = `
+      <div class="d2-title"><div class="nm">${esc(name)}</div>
+        <div class="tag">${/^okf\//.test(p) ? 'OKF concept — curated knowledge' : 'governance — the locked record'}</div></div>
+      <div class="d2-acts"><button class="d2-btn" data-kind="primary" data-doc="${esc(p)}">open file</button></div>
+      <div class="d2-foot">${esc(p)}</div>`;
+    wireDossier();
+  },
+  agent() {
+    const a = agentRoster().find((x) => x.name === state.detail.id);
+    if (!a) return d2Nothing('Select an agent on the left.');
+    $('library').innerHTML = `
+      <div class="d2-title"><div class="nm">${esc(a.name)}</div>
+        <div class="tag">${a.live ? `${a.live} live session${a.live === 1 ? '' : 's'}` : 'no live sessions'} · ${a.n} total</div></div>
+      <div class="d2-field"><span class="lbl">sessions</span><div class="val">
+        ${a.sessions.map((s) => { const st = stateLabel(s);
+          return `<button class="d2-sess" data-dz-sess="${esc(s.id)}" data-state="${esc(st.shown || '')}"
+            aria-current="${s.id === state.active}">
+            <span class="g" aria-hidden="true">${GLYPH[st.shown] || '•'}</span>
+            <span class="nm">${esc(s.name || s.id)}</span>
+            <span class="st">${esc(st.text || '')}</span></button>`; }).join('')}
+      </div></div>
+      ${agentProfileField(a)}
+      <div class="d2-noladder">PMOS keeps no agent registry — no model, role or memory is recorded
+        against an agent name. What is shown is what the runtime can honestly report: the sessions
+        this binary is running right now, plus the preference above, which is PMOS's own memory and
+        not an attribute of the agent.</div>
+      <div class="d2-foot">derived from live sessions${state.profiles && state.profiles.dir ? ` · preference stored in workspace/state/prefs.json · descriptors read from ${esc(state.profiles.dir)}` : ''}</div>`;
+    wireDossier();
+    wireAgentProfile(a);
+  },
+  /* workspace-repo-ingest — the REVIEW surface. It is a detail kind rather than a dialog on
+   * purpose: a proposal is a thing you inspect in column 2, and a second review surface beside the
+   * one that already exists is how two of them drift apart. */
+  ingest() {
+    const pr = proposalById(state.detail.id);
+    if (!pr) return d2Nothing('That ingest proposal is no longer open.');
+    $('library').innerHTML = ingestPanel(pr);
+    wireDossier();
+    wireIngest(pr);
+  },
+  /* workspace-mobile-surface R10, and reachable on the desktop too — the profile descriptors this
+   * machine holds, with nothing derived and nothing checked. */
+  profiles() {
+    $('library').innerHTML = profilesPanel();
+    wireDossier();
+    $('library').querySelectorAll('[data-prof-reload]').forEach((b) => b.onclick = () => { state.profiles = null; renderLibrary(); loadProfiles(); });
+  },
+  /* THE CONNECTIONS SCREEN, and the whole of it is the absence. There is no connect menu anywhere
+   * in this build, because PMOS has no credential store, no MCP client and no connection check — a
+   * menu of connections would be a menu of nothing. What ships instead is one row per MCP name a
+   * profile DECLARES, each saying it is a declaration and not a connection, and the file it was
+   * read from. No dot, no colour-as-status, no sync time, no count. */
+  connections() {
+    $('library').innerHTML = connectionsPanel();
+    wireDossier();
+  },
+  mem() {
+    $('library').innerHTML = `
+      <div class="d2-title"><div class="nm">memory</div>
+        <div class="tag">not recorded</div></div>
+      ${modeAbsent('Agent memory — short-term session context, and long-term notes injected into every run.',
+        'pmos/state/memory.jsonl')}
+      <div class="d2-foot">nothing read — there is no such file</div>`;
+  },
+};
+
 function renderLibrary() {
   renderLensTabs();
   renderReading();
+  // The column-2 header names whatever the panel is describing, so the header and the collapsed
+  // rail that stands in for it always agree.
+  { const f = $('libFold'); if (f) f.lastChild.textContent = detailTitle(); }
+  // The filter box, the "reading from" label and the rescan button belong to the FILE MAP. On a
+  // detail panel they are furniture for a view that is not on screen: a filter with nothing to
+  // filter, and a rescan of files this panel never listed. They are hidden rather than disabled,
+  // because a control that is present but inert still has to be read before it can be dismissed.
+  {
+    const detail = !!D2_KINDS[state.detail.kind];
+    const mapish = state.lens === 'folders' || state.lens === 'history';
+    const showMap = mapish && !detail;
+    for (const id of ['libFind', 'libWho', 'libRefresh']) { const e = $(id); if (e) e.hidden = !showMap; }
+    // The lens strip is EMPTIED for a mode panel, never hidden. `hidden` on the container makes
+    // every button inside it unclickable even when a later state re-renders one — a real click
+    // that can never land, which is worse than a visible control that does nothing. renderLensTabs
+    // decides the contents; this only has to not fight it.
+  }
+  // The six non-initiative detail kinds. Each is the panel for a row selected in a non-product
+  // mode, so they are dispatched before the lens system — a lens is a sub-view OF an initiative
+  // or a repository, and none of these is either.
+  if (D2_KINDS[state.detail.kind]) { D2_KINDS[state.detail.kind](); return; }
   if (state.lens === 'dossier' && state.detail.kind === 'initiative') { renderDossier(); return; }
   if (state.lens === 'dossier') { state.lens = 'folders'; }
   // a third, persistent lens beside initiatives + folders: the scheduled tasks for this workspace
@@ -1387,9 +3275,8 @@ async function openDoc(pth, kind) {
   if (!pth) return;
   state.docPath = pth;
   showRail();
-  $('paneDoc').hidden = false;
-  $('railSplit').hidden = false;
-  foldPane('doc', true);
+  openViewer({ kind: 'doc', key: pth, title: pth.split('/').pop() });
+  mobPushDoc('doc:' + pth, pth.split('/').pop());     // no-op off the phone
   $('crumb').innerHTML = `<bdi>${esc(pth)}</bdi>`;
   $('docBody').scrollTop = 0;
   const body = $('docBody');
@@ -1459,8 +3346,7 @@ function renderHtmlDoc(body, text) {
 }
 function closeDoc() {
   state.docPath = null; state.surface = null;
-  $('paneDoc').hidden = true;
-  $('railSplit').hidden = true;
+  closeViewer('doc:' + (state.docPath || ''));
   $('docBody').innerHTML = '';
   $('crumb').textContent = '';
   document.querySelectorAll('.doc').forEach((b) => b.classList.remove('on'));
@@ -1485,29 +3371,108 @@ function curLayout() {
   return state.layouts.find((l) => l.id === state.layoutId) || state.layouts[0] || LAY.stockLayout(LAY.DEFAULT_ID);
 }
 
+// Collapse is applied to the COMPUTED grid rather than inside the layout module, deliberately.
+// It is not a fifth field of the arrangement tuple — a layout is what the PM saved and shares
+// between sessions, and "I folded this away for a minute" is not that. Narrowing a track after
+// the fact keeps the tuple, its persistence and its fuzzed invariant (every area row names as
+// many cells as there are tracks) all untouched: this only ever rewrites a track's WIDTH.
+//
+// Widths come from the area names rather than positions because the side and reader can each sit
+// on either edge; matching on `side`/`read` is the only mapping that stays correct across all
+// twelve side × reader arrangements. When the reader is docked at the BOTTOM it is a row, not a
+// column, so collapsing it is not offered — and asking for it here is a no-op, not a broken grid.
+// Remove one named area's track from a computed grid, keeping the areas string in step. Used for
+// the floating panel below 1100px: the pane still exists and still renders, it just stops taking a
+// column and overlays the terminal instead.
+function dropTrack(g, name) {
+  const rows = g.areas.match(/"[^"]*"/g) || [];
+  if (!rows.length) return g;
+  const names = rows[0].replace(/"/g, '').trim().split(/\s+/);
+  const tracks = g.columns.trim().split(/\s+/);
+  const i = names.indexOf(name);
+  if (i < 0 || names.length !== tracks.length) return g;
+  tracks.splice(i, 1); names.splice(i, 1);
+  return { columns: tracks.join(' '), rows: g.rows, areas: '"' + names.join(' ') + '"' };
+}
+const COLLAPSED_W = '36px';
+function collapseCols(g, l) {
+  const rows = g.areas.match(/"[^"]*"/g) || [];
+  if (!rows.length) return g;
+  const names = rows[0].replace(/"/g, '').trim().split(/\s+/);
+  const tracks = g.columns.trim().split(/\s+/);
+  if (names.length !== tracks.length) return g;    // never hand the grid a mismatched template
+  let changed = false;
+  names.forEach((n, i) => {
+    const wanted = (n === 'side' && !state.col1) || (n === 'read' && !state.col2);
+    if (wanted && tracks[i] !== COLLAPSED_W) { tracks[i] = COLLAPSED_W; changed = true; }
+  });
+  return changed ? { columns: tracks.join(' '), rows: g.rows, areas: g.areas } : g;
+}
+
+// The rails that stand in for a collapsed column. Each is shown only when its column is both
+// collapsed AND present in the arrangement — a reader the layout has set to `off` has no track to
+// put a rail in, and drawing one there would claim a column that is not on screen.
+function paintColRails(l, float) {
+  const body = $('bodyGrid');
+  // The panel is always a column now, so the only question is whether it is collapsed.
+  const readerCol = !float;
+  const sideCol = l.side !== 'off';
+  const set = (id, labelId, on, text) => {
+    const el = $(id); if (!el) return;
+    el.hidden = !on;
+    if (on) $(labelId).textContent = text + ' ⟩';
+  };
+  set('col1Rail', 'col1RailLabel', sideCol && !state.col1, modeTitle());
+  set('col2Rail', 'col2RailLabel', readerCol && !state.col2, detailTitle());
+  body.dataset.col1 = sideCol && !state.col1 ? 'closed' : 'open';
+  body.dataset.col2 = readerCol && !state.col2 ? 'closed' : 'open';
+}
+function setCol(which, on) {
+  state[which] = on;
+  store.set(which, on ? 'on' : 'off');
+  applyLayout();
+  // Both columns share the terminal's row, so either one changing width changes how many cells
+  // fit. The ResizeObserver on the terminal host covers this, but it fires a frame later and the
+  // debounce adds more; asking directly keeps the terminal from painting one stale frame at the
+  // old width every time a column is folded.
+  refit();
+}
+// What the collapsed rails and the two headers are called. Both read from state rather than
+// being written at their call sites, so the rail's label and the header it stands in for can
+// never drift apart.
+function modeTitle() { const m = MODE_BY_K[state.mode]; return m ? m.title : 'initiatives'; }
+// ONE table, owned by the reducer. It used to be declared here and again inside the nav code; two
+// copies of a lookup that must agree is a drift waiting to happen, and the phone's screen title and
+// the desktop panel's header are the same fact.
+const DETAIL_TITLE = PMOSMobileNav.DETAIL_TITLE;
+function detailTitle() { return DETAIL_TITLE[state.detail.kind] || 'detail'; }
+
 // Write the arrangement into the DOM. Custom properties, never direct grid declarations — a
 // direct one would outrank the ≤760px media query and take the phone's switcher with it (R9).
 function applyLayout() {
   const l = curLayout();
   const body = $('bodyGrid');
-  // Below 1100px the reader floats over the terminal instead of squeezing it, so its track comes
+  // Below 1100px the panel floats over the terminal instead of squeezing it, so its track comes
   // OUT of the template; below that again the phone's own system owns the whole thing.
-  const float = NARROW.matches && !PHONE.matches && (l.reader === 'left' || l.reader === 'right');
-  const eff = float ? Object.assign({}, l, { reader: 'off' }) : l;
-  const g = LAY.gridFor(eff);
+  const float = NARROW.matches && !PHONE.matches;
+  const eff = l;
+  // The panel is a permanent column, so "float it" is done by dropping its TRACK here rather than
+  // by a value in the tuple — the tuple no longer has a way to say "no panel column", and adding
+  // one back just to express a viewport rule would put a responsive decision into saved state.
+  const g = collapseCols(float ? dropTrack(LAY.gridFor(eff), 'read') : LAY.gridFor(eff), eff);
   body.style.setProperty('--lay-cols', g.columns);
   body.style.setProperty('--lay-rows', g.rows);
   body.style.setProperty('--lay-areas', g.areas);
   body.dataset.side = l.side;
-  body.dataset.reader = float ? l.reader : l.reader;   // the pane still exists; it just floats
+  body.dataset.reader = float ? 'float' : 'left';      // the pane still exists; it just floats
   body.dataset.float = float ? 'on' : 'off';
   if (float) body.style.setProperty('--lay-areas', g.areas);
+  paintColRails(l, float);
 
   // folds
   paintFold('paneWs', 'wsFold', l.folds.ws);
   // `sess` retired with the pane it folded (R1/R13); a stored value is ignored, not migrated.
   paintFold('paneLib', 'libFold', l.folds.lib);
-  paintFold('paneDoc', 'docFold', l.folds.doc);
 
   // split is a desktop arrangement; below 1100px two groups are two unusable terminals (R9)
   applySplit(l.split === 'on' && !NARROW.matches);
@@ -1516,7 +3481,6 @@ function applyLayout() {
   // to be "a client preference like the theme" in a global localStorage key — which R8 and rubric
   // dimension 1 both contradict: they require it carried per workspace and the old key not re-read
   // on later loads. `libsplit` is now read exactly once, by migrateLegacy.
-  document.documentElement.style.setProperty('--libsplit', l.libSplit + '%');
 
   $('layName').textContent = l.name;
   renderLayoutMenu();
@@ -1628,12 +3592,10 @@ function layoutWire(l) {
   // a wireframe of the arrangement: the name alone does not say what you get
   const cells = [];
   if (l.side === 'left') cells.push(1);
-  if (l.reader === 'left') cells.push(3);
+  cells.push(3);                              // the detail panel — always a column now
   cells.push(l.split === 'on' ? 5 : 4);
-  if (l.reader === 'right') cells.push(3);
   if (l.side === 'right') cells.push(1);
-  const rows = l.reader === 'bottom' ? '<i style="flex:1"></i>' : '';
-  return `<span class="lay-mini" aria-hidden="true">${cells.map((w) => `<span style="flex:${w}"></span>`).join('')}${rows}</span>`;
+  return `<span class="lay-mini" aria-hidden="true">${cells.map((w) => `<span style="flex:${w}"></span>`).join('')}</span>`;
 }
 function renderLayoutMenu() {
   const list = $('layList');
@@ -1670,13 +3632,16 @@ function renderLayoutMenu() {
   if ($('layScope')) $('layScope').textContent = w ? w.name : 'this repo';
 }
 
-/* R12 — keyboard parity with the drag. Every value `side` and `reader` can hold is a real button
-   here, so no position is pointer-only. This is what makes the "no dead ends" property true rather
-   than merely argued: from ANY arrangement, including side:off + reader:off, the header control is
-   in the bar (never inside the grid it rearranges), and these buttons bring a pane back. */
+/* R12 — keyboard parity with the drag. Every value `side` can hold is a real button here, so no
+   position is pointer-only. This is what makes the "no dead ends" property true rather than merely
+   argued: from ANY arrangement, including side:off, the header control is in the bar (never inside
+   the grid it rearranges), and these buttons bring the pane back.
+
+   The `reader` row went with the slot. The detail panel is not positionable — it always sits
+   between the structure column and the terminal — and hiding it is the column collapse, whose
+   control is the labelled 36px rail that replaces it, which is reachable by tab and by click. */
 const POS_GROUPS = [
   { key: 'side', label: 'sidebar', values: [['left', '◧'], ['right', '◨'], ['off', '∅']] },
-  { key: 'reader', label: 'reader', values: [['left', '◧'], ['right', '◨'], ['bottom', '⬓'], ['off', '∅']] },
 ];
 function renderLayoutPositions() {
   const host = $('layPos');
@@ -1730,17 +3695,17 @@ function newLayoutName() {
 
 // ── folds: both columns, same behaviour (R11) ──
 function foldPane(which, open) {
-  const map = { doc: 'paneDoc', lib: 'paneLib', ws: 'paneWs' };
+  const map = { lib: 'paneLib', ws: 'paneWs' };
   if (!map[which]) return;
   const l = curLayout();
   const folds = Object.assign({}, l.folds);
   folds[which] = open;
   tweak({ folds });
 }
-function showRail() { if (curLayout().reader === 'off') tweak({ reader: 'right' }); }
+// The panel is always a column; "show it" therefore means un-collapse it, which is client state.
+function showRail() { if (!state.col2) setCol('col2', true); }
 
 $('libFold').onclick = () => foldPane('lib', $('paneLib').dataset.fold === 'off');
-$('docFold').onclick = () => foldPane('doc', $('paneDoc').dataset.fold === 'off');
 $('wsFold').onclick = () => foldPane('ws', $('paneWs').dataset.fold === 'off');
 
 // ── the edges: drag a column's outer edge to resize it. Keeps to the layout, like everything
@@ -1752,14 +3717,15 @@ function wireEdge(el) {
   const applyPx = (px) => {
     const l = curLayout();
     if (which === 'side') tweak({ sideW: Math.round(Math.min(Math.max(px, LAY.SIDE_MIN), LAY.SIDE_MAX)) });
-    else tweak({ readW: Math.round(Math.min(Math.max(px, LAY.READ_MIN), Math.min(LAY.READ_MAX, window.innerWidth - 360))) });
+    else tweak({ panelW: Math.round(Math.min(Math.max(px, LAY.PANEL_MIN), Math.min(LAY.PANEL_MAX, window.innerWidth - 360))) });
     void l;
   };
   const fromPointer = (clientX) => {
     const l = curLayout();
     const r = $('bodyGrid').getBoundingClientRect();
     if (which === 'side') return l.side === 'right' ? r.right - clientX : clientX - r.left;
-    return l.reader === 'left' ? clientX - r.left : r.right - clientX;
+    // the panel's outer edge is its LEFT one when the structure column is on the right
+    return l.side === 'right' ? r.right - clientX : clientX - r.left - (l.side === 'left' ? l.sideW : 0);
   };
   el.addEventListener('pointerdown', (e) => { dragging = true; el.classList.add('on'); el.setPointerCapture(e.pointerId); e.preventDefault(); });
   el.addEventListener('pointermove', (e) => { if (dragging) applyPx(fromPointer(e.clientX)); });
@@ -1768,9 +3734,9 @@ function wireEdge(el) {
     if (e.key !== 'ArrowLeft' && e.key !== 'ArrowRight') return;
     e.preventDefault();
     const l = curLayout();
-    const cur = which === 'side' ? l.sideW : l.readW;
+    const cur = which === 'side' ? l.sideW : l.panelW;
     const grow = which === 'side' ? (l.side === 'right' ? e.key === 'ArrowLeft' : e.key === 'ArrowRight')
-      : (l.reader === 'left' ? e.key === 'ArrowRight' : e.key === 'ArrowLeft');
+      : (l.side === 'right' ? e.key === 'ArrowLeft' : e.key === 'ArrowRight');
     applyPx(cur + (grow ? 24 : -24));
     refit();
   });
@@ -1804,7 +3770,8 @@ wireEdge($('sideEdge'));
   function end(e) {
     if (!drag) return;
     const z = hit(e);
-    if (z) tweak(drag === 'side' ? { side: z === 'bottom' ? curLayout().side : z } : { reader: z });
+    // only the structure column is draggable now — the panel has one home by design
+    if (z && drag === 'side') tweak({ side: z });
     body.classList.remove('dragging');
     zones().forEach((d) => { d.classList.remove('hot'); d.classList.remove('no'); });
     if (ghost) { ghost.remove(); ghost = null; }
@@ -1833,7 +3800,7 @@ wireEdge($('sideEdge'));
       if (e.key !== 'Enter' && e.key !== ' ') return;
       e.preventDefault();
       openLayMenu();
-      const first = $('layPos') && $('layPos').querySelector(`[data-pos="${g.dataset.pane === 'side' ? 'side' : 'reader'}"]`);
+      const first = $('layPos') && $('layPos').querySelector('[data-pos="side"]');
       (first || $('layBtn')).focus();
     });
   });
@@ -1863,26 +3830,8 @@ document.addEventListener('pointerdown', (e) => {
 
 applyLayout();     // paint the default arrangement before the server's layouts arrive
 
-// drag the divider between the library and the document. It is part of the arrangement (R8), so
-// it is kept against the current layout like every other adjustment — not in a global client key.
-(() => {
-  const split = $('railSplit');
-  let dragging = false;
-  const apply = (clientY) => {
-    const r = $('rail').getBoundingClientRect();
-    const pct = Math.min(LAY.LIB_MAX, Math.max(LAY.LIB_MIN, ((clientY - r.top) / r.height) * 100));
-    tweak({ libSplit: Math.round(pct * 10) / 10 });
-  };
-  split.addEventListener('pointerdown', (e) => { dragging = true; split.setPointerCapture(e.pointerId); e.preventDefault(); });
-  split.addEventListener('pointermove', (e) => { if (dragging) apply(e.clientY); });
-  split.addEventListener('pointerup', (e) => { dragging = false; try { split.releasePointerCapture(e.pointerId); } catch {} refit(); });
-  split.addEventListener('keydown', (e) => {
-    if (e.key !== 'ArrowUp' && e.key !== 'ArrowDown') return;
-    e.preventDefault();
-    const cur = curLayout().libSplit;
-    tweak({ libSplit: Math.round(Math.min(LAY.LIB_MAX, Math.max(LAY.LIB_MIN, cur + (e.key === 'ArrowUp' ? -4 : 4))) * 10) / 10 });
-  });
-})();
+// The rail's library/document divider is gone: the rail has ONE pane now. `libSplit` went out of
+// the tuple with it — see lib/layout.js.
 
 // ── needs-you + gates (the PMOS workflow: Review/Acceptance in file mode, never automatic) ──
 async function loadNeeds() {
@@ -2190,10 +4139,17 @@ function openNewForm() {
   const w = state.workspaces.find((x) => x.id === state.wsId);
   $('newForm').hidden = false;
   $('newBtn').setAttribute('aria-expanded', 'true');
+  paintNewAgents();          // the radios always show what state.newAgent actually holds
   renderNewTarget();
   // pre-filled but editable — a default that reads better than "shell" in a list of shells
   const n = mySessions().length + 1;
   $('newName').value = `${w ? w.name : 'session'} ${n}`;
+  // workspace-profiles R8.1 — the composer's chip set is exactly the descriptors that were read,
+  // preselected from PMOS's own remembered preference for this agent. A preference for a
+  // descriptor that no longer reads preselects nothing rather than a substitute.
+  state.newProfile = preferredProfileFor(state.newAgent);
+  renderProfileChips();
+  if (!state.profiles) loadProfiles();
   fillBranchPicker();               // paint immediately from what we already know…
   loadBranch();                     // …then re-fetch: branches made in a terminal must show up here
   const inp = $('newName');
@@ -2345,14 +4301,23 @@ $('newCancel').onclick = closeNewForm;
 $('newBranch').onchange = (e) => setNewBranchMode(e.target.value === '__new__');
 $('newIsolate').onchange = renderBranchHint;
 $('newBranchName').oninput = renderBranchHint;   // the hint names the folder as the PM types it
+function paintNewAgents() {
+  $('newAgents').querySelectorAll('button').forEach((x) => x.setAttribute('aria-checked', String(x.dataset.agent === state.newAgent)));
+}
 $('newAgents').querySelectorAll('button').forEach((b) => b.onclick = () => {
   state.newAgent = b.dataset.agent;
-  $('newAgents').querySelectorAll('button').forEach((x) => x.setAttribute('aria-checked', String(x === b)));
+  paintNewAgents();
+  // the preference is keyed by AGENT, so changing the agent re-asks PMOS what it remembers
+  state.newProfile = preferredProfileFor(state.newAgent);
+  renderProfileChips();
 });
 $('newForm').addEventListener('submit', (e) => {
   e.preventDefault();
   const name = $('newName').value.trim();
-  const msg = { t: 'new', agent: state.newAgent, name: name || state.newAgent, ws: state.wsId };
+  // `profile` is always present and is `null` for "no profile" — the server distinguishes a
+  // deliberate no-profile from a client that forgot the field, and only one of those is a choice.
+  const msg = { t: 'new', agent: state.newAgent, name: name || state.newAgent, ws: state.wsId,
+    profile: state.newProfile || null };
   // branch: either create a new one, or check out an existing pick. Empty = stay put (no git call
   // at all) — and that is what a hidden control means too, so a non-git workspace can never have a
   // stale pick from a previous repo smuggled onto it.
@@ -2481,15 +4446,39 @@ $('scratchSend').onclick = () => {
 
 // ── add a workspace: pick a folder (the GUI twin of running `pmos` in that repo) ──
 function closeAddWs() {
-  $('addWsForm').hidden = true; $('addWsBtn').setAttribute('aria-expanded', 'false'); $('addWsPath').value = '';
+  $('addWsForm').hidden = true;
+  $('addWsBtn').setAttribute('aria-expanded', 'false');
+  if ($('pswAdd')) $('pswAdd').setAttribute('aria-expanded', 'false');
+  $('addWsPath').value = '';
+  if ($('addWsRepo')) $('addWsRepo').value = '';
 }
-$('addWsBtn').onclick = () => {
+function toggleAddWs() {
   const f = $('addWsForm');
   f.hidden = !f.hidden;
+  // Two controls opening ONE form is fine; two forms that both add a repository is not — so both
+  // buttons report the same expanded state for the same node.
   $('addWsBtn').setAttribute('aria-expanded', String(!f.hidden));
-};
+  if ($('pswAdd')) $('pswAdd').setAttribute('aria-expanded', String(!f.hidden));
+  if (!f.hidden) setAddSource(state.addSrc);
+}
+$('addWsBtn').onclick = toggleAddWs;
+// R7 (switcher) — the ＋ opens the SHIPPED add form. There is no second path and no source menu
+// beyond the two real sources below.
+if ($('pswAdd')) $('pswAdd').onclick = toggleAddWs;
 $('addWsCancel').onclick = closeAddWs;
-$('addWsForm').addEventListener('submit', (e) => { e.preventDefault(); addWorkspace($('addWsPath').value); });
+if ($('addWsSource')) {
+  $('addWsSource').querySelectorAll('[data-src]').forEach((b) => b.onclick = () => setAddSource(b.dataset.src));
+  setAddSource('local');
+}
+$('addWsForm').addEventListener('submit', (e) => {
+  e.preventDefault();
+  // R2 — the two sources do genuinely different things, and the form does them differently: a
+  // folder is REGISTERED where it lies, a GitHub repository is cloned into PMOS's own state,
+  // scanned read-only, and PROPOSED. The server refuses `source:"folder"` on /api/ingest for the
+  // same reason — the distinction is enforced in code, not only in the copy under the radio.
+  if (state.addSrc === 'github') { startIngest($('addWsRepo') ? $('addWsRepo').value : ''); return; }
+  addWorkspace($('addWsPath').value);
+});
 // The browser's own directory picker cannot yield an absolute path, so the LOCAL server opens
 // the machine's native chooser. Where there is none (a headless Linux box), the in-app browser
 // stands in — the PM is never left with only a text field (R10).
@@ -2552,6 +4541,19 @@ $('fsPicker').addEventListener('click', (e) => { if (e.target === $('fsPicker'))
 // ── library lens + filter ──
 const FIND_PLACEHOLDER = { history: 'search past sessions…', scheduled: 'filter the library…' };
 $('libFind').addEventListener('input', (e) => { state.filter = e.target.value; renderLibrary(); });
+// The column-1 search box. It narrows whichever mode is showing and, in `product`, also surfaces
+// matching artifacts and sessions underneath the spine — so a half-remembered name is findable
+// without first knowing which mode it lives in.
+$('spFind').addEventListener('input', (e) => { state.q = e.target.value; renderTree(); });
+// Both rails and both in-column collapse controls drive the SAME setter, so the two paths cannot
+// disagree about what "collapsed" means or forget to re-fit the terminal.
+// workspace-focus R1 — the entry control. It is a sibling of #tree, never a replacement for it:
+// focus is a SECOND reading of the same repositories, and leaving the structure it was derived
+// from on screen is what lets the PM check the queue rather than believe it.
+if ($('focusBtn')) $('focusBtn').onclick = () => toggleFocus();
+$('col1Rail').addEventListener('click', () => setCol('col1', true));
+$('col2Rail').addEventListener('click', () => setCol('col2', true));
+$('col2Hide').addEventListener('click', () => setCol('col2', false));
 $('libRefresh').onclick = () => {
   const b = $('libRefresh'); b.classList.add('spin');
   refreshLibrary(); setTimeout(() => b.classList.remove('spin'), 500);
@@ -2727,7 +4729,7 @@ async function alDrafts() {
   let out = {};
   try { out = await (await fetch(`/api/align/drafts?ws=${encodeURIComponent(state.wsId || '')}`)).json(); }
   catch { out = { ok: false, error: 'could not reach the workspace server' }; }
-  showRail(); $('paneDoc').hidden = false; foldPane('doc', true);
+  openViewer({ kind: 'surface', key: name, title: name });
   $('crumb').innerHTML = '<bdi>alignment drafts</bdi>';
   if (!out.ok) { $('docBody').innerHTML = `<div class="al"><div class="al-lede">${esc(out.error || 'could not read the drafts')}</div></div>`; return; }
   if (out.empty || !out.drafts.length) {
@@ -2820,7 +4822,8 @@ const SF_STAT = { planning: ['○', 'planning'], building: ['◐', 'building'],
 
 async function openSurface(name) {
   showRail();
-  $('paneDoc').hidden = false; $('railSplit').hidden = false; foldPane('doc', true);
+  openViewer({ kind: 'surface', key: name, title: name });
+  mobPushDoc('surface:' + name, name);                // no-op off the phone
   state.surface = name; state.docPath = null;
   ed.on = false; edControls();
   document.querySelectorAll('.doc').forEach((b) => b.classList.remove('on'));
@@ -3276,7 +5279,7 @@ async function scRun(id) { flash('running…'); await scPost('/api/schedules/run
 async function openDeliverable(id) {
   if (!id) return;
   state.docPath = null; state.surface = null;
-  showRail(); $('paneDoc').hidden = false; $('railSplit').hidden = false; foldPane('doc', true);
+  openViewer({ kind: 'surface', key: name, title: name });
   $('crumb').innerHTML = `<bdi>report · ${esc(id)}</bdi>`; $('docBody').scrollTop = 0;
   try { const r = await fetch('/api/deliverable?ws=' + encodeURIComponent(state.wsId || '') + '&id=' + encodeURIComponent(id));
     $('docBody').innerHTML = r.ok ? renderMd(await r.text(), '') : `<p class="doc-empty">Report not found.</p>`;
@@ -3303,6 +5306,12 @@ function openPalette() {
   // summon a P/D/M/R surface on demand — listed first so "initiatives"/"roadmap"/"okr"/"report" are reachable
   const views = SURFACES.map((v) => ({ kind: 'view', label: v.label, view: v.name }));
   views.push({ kind: 'align', label: 'alignment drafts' });   // downstream of a save, never resident
+  // The three lenses that stopped being standing furniture. They are still exactly one keystroke
+  // away — which is where a file map and a schedule list belong, since you want them when that IS
+  // the job, not on every render.
+  views.push({ kind: 'lens', label: 'folders — this repository\u2019s file map', lens: 'folders' });
+  views.push({ kind: 'lens', label: 'scheduled — recurring tasks', lens: 'scheduled' });
+  views.push({ kind: 'lens', label: 'history — this workspace\u2019s scrollback', lens: 'history' });
   palItems = [...views, ...wss, ...sess, ...inits, ...docs];
   $('palette').style.display = 'grid';
   const inp = $('palInput'); inp.value = ''; renderPalette('');
@@ -3314,7 +5323,7 @@ function renderPalette(q) {
   const f = q.toLowerCase();
   const items = palItems.filter((i) => i.label.toLowerCase().includes(f)).slice(0, 40);
   palSel = 0;
-  const g = (i) => i.kind === 'view' ? '▤' : i.kind === 'session' ? (GLYPH[i.state] || '•') : i.kind === 'workspace' ? '▣' : i.kind === 'initiative' ? '◈' : '◦';
+  const g = (i) => i.kind === 'lens' ? '▦' : i.kind === 'view' ? '▤' : i.kind === 'session' ? (GLYPH[i.state] || '•') : i.kind === 'workspace' ? '▣' : i.kind === 'initiative' ? '◈' : '◦';
   $('palList').innerHTML = items.map((i, n) => `
     <button class="pitem ${n === 0 ? 'sel' : ''}" data-n="${n}" role="option">
       <span class="g" aria-hidden="true">${g(i)}</span>
@@ -3328,6 +5337,8 @@ function choosePalette(n) {
   const it = items[n]; if (!it) return;
   closePalette();
   if (it.kind === 'view') openSurface(it.view);
+  // summoning a lens is what replaced the standing tab strip: it sets the view and shows the rail
+  else if (it.kind === 'lens') { state.lens = it.lens; store.set('lens', it.lens); showRail(); renderLibrary(); }
   else if (it.kind === 'align') alDrafts();
   else if (it.kind === 'session') selectSession(it.id);
   else if (it.kind === 'workspace') selectWorkspace(it.wsid);
@@ -3372,7 +5383,7 @@ document.addEventListener('keydown', (e) => {
     else if (state.renaming) { e.stopPropagation(); cancelRename(); renderSessions(); }
     else if (!$('newForm').hidden) closeNewForm();
     else if (!$('addWsForm').hidden) closeAddWs();
-    else if (!$('paneDoc').hidden) closeDoc();
+    else if (state.viewActive) closeDoc();
   }
 }, true);
 
@@ -3401,9 +5412,105 @@ function applyCtrl(d) {
   return d;
 }
 
+/* ── workspace-mobile-surface · the shell ────────────────────────────────────────────────────────
+ *
+ * ONE renderer, two shells (R5). Nothing below builds a phone-shaped copy of anything: applying a
+ * screen sets the state the desktop already uses and calls the function that already draws it —
+ * `state.mode` + renderTree(), `state.detail` + renderLibrary(), selectSession(), selectViewer().
+ * The only phone-specific parts are which HOST is visible (`data-mscreen`) and the chrome.
+ *
+ * R6 is structural rather than remembered: the three column nodes are never re-parented and never
+ * rebuilt, so a push over a terminal, a pop back to it, and a destination switch are all CSS
+ * visibility changes. The xterm instance and its PTY socket cannot be destroyed by navigation
+ * because navigation never touches them.
+ */
+function mobOn() { return PHONE.matches; }
+function mobCurrent() { return mobCurrentOf(state.mnav); }
+function mobMoreActive() { return mobOn() && state.mnav && mobCurrent().kind === 'more'; }
+// The `more` root, written into #tree with `.md-row`s — the SAME vocabulary as every other list in
+// this column, not a new one. Three of these are modes that have no bottom-nav slot of their own,
+// and two are detail screens; R10 binds the last of them: `connections` lists only what a
+// descriptor DECLARES, and if no descriptor was read it renders no rows at all.
+const MORE_ROWS = [
+  { k: 'mode', id: 'workflow', nm: 'workflow', d: 'lanes this repository runs, and the declared templates' },
+  { k: 'mode', id: 'skills', nm: 'skills', d: 'executable procedures under skills/ and build-skills/' },
+  { k: 'mode', id: 'knowledge', nm: 'knowledge', d: 'the OKF bundle and the locked record' },
+  { k: 'detail', id: 'profiles', nm: 'profiles', d: 'the descriptors this machine holds' },
+  { k: 'detail', id: 'connections', nm: 'connections', d: 'what profiles declare — nothing is connected' },
+];
+function renderMoreMenu(host) {
+  host.innerHTML = `<div class="md-note">Everything that is not one of the four destinations below.
+      These are the same lists and the same panels the wide layout shows — there is no phone-only view.</div>`
+    + MORE_ROWS.map((r) => `<button class="md-row" data-more-k="${esc(r.k)}" data-more-id="${esc(r.id)}">
+        <span class="r1"><span class="nm">${esc(r.nm)}</span></span>
+        <span class="d">${esc(r.d)}</span></button>`).join('');
+  host.querySelectorAll('[data-more-id]').forEach((b) => b.onclick = () => {
+    if (b.dataset.moreK === 'mode') {
+      // a mode reached from `more` stays IN `more` as a pushed list screen, so `‹ back` returns to
+      // the menu rather than dropping the PM on a destination they did not choose
+      mobGo({ kind: 'list', mode: b.dataset.moreId });
+    } else {
+      state.detail = { kind: b.dataset.moreId, id: null, wsId: state.wsId };
+      renderLibrary();
+      mobPushDetail(b.dataset.moreId);
+    }
+  });
+}
+// The four push helpers. Each is a NO-OP off the phone, so every call site below can stay a plain
+// unconditional line rather than a conditional the next author has to remember to write.
+// Selecting a second document while already reading one REPLACES the top screen rather than
+// stacking on it: `‹ back` means "out of the reader", not "back through everything you glanced at",
+// and an unbounded stack would make P3's "a finite number of presses" true only in principle.
+function mobGo(screen) {
+  if (!mobOn() || !state.mnav) return;
+  const cur = mobCurrent();
+  const nav = (state.mnav.stack.length && cur.kind === screen.kind) ? mobPop(state.mnav) : state.mnav;
+  state.mnav = mobPush(nav, screen);
+  applyMobScreen();
+}
+function mobPushDetail(dk) { mobGo({ kind: 'detail', dk, id: state.detail.id }); }
+function mobPushTerminal(id, title) { mobGo({ kind: 'terminal', id, title }); }
+function mobPushDoc(id, title) { mobGo({ kind: 'doc', id, title }); }
+function mobBack() {
+  state.mnav = mobPop(state.mnav);
+  applyMobScreen();
+}
+/* Apply the current screen. The ORDER matters: the host is chosen first so a renderer that measures
+ * (the terminal's fit) sees the box it is actually going to occupy. */
+function applyMobScreen() {
+  const shell = $('mobShell'), grid = $('bodyGrid'), menu = $('mobMenu');
+  if (!shell || !grid) return;
+  // R12 — above the breakpoint the shell is `display:none` (stylesheet) AND `hidden` (here), so it
+  // is absent from the accessibility tree rather than merely invisible. Both, not either.
+  shell.hidden = !mobOn();
+  if (!mobOn()) { grid.removeAttribute('data-mscreen'); return; }
+  if (!state.mnav) state.mnav = mobNavInit(mobMigrateView(store.get('mdest')));
+  const s = mobCurrent();
+  grid.dataset.mscreen = s.column;
+  // the control-key accessory bar belongs to the terminal screen and to nothing else (R7)
+  if (menu) menu.dataset.view = s.kind === 'terminal' ? 'terminal' : s.kind;
+  const title = $('mobTitle'); if (title) title.textContent = mobTitleOf(s);
+  // Back is ABSENT at a destination root, never present-and-inert: a control that looks available
+  // and does nothing is the thing this workspace refuses to ship.
+  const back = $('mobBack'); if (back) back.hidden = !(state.mnav.stack.length > 0);
+  document.querySelectorAll('#mobNav [data-dest]').forEach((b) =>
+    b.setAttribute('aria-current', b.dataset.dest === state.mnav.dest ? 'page' : 'false'));
+  // R5 — the SHIPPED renderers, given a different host. Never a second implementation.
+  if (s.kind === 'list') { if (state.mode !== s.mode) setMode(s.mode); else renderTree(); }
+  else if (s.kind === 'more') renderTree();               // renderTree defers to renderMoreMenu
+  else if (s.kind === 'detail') renderLibrary();
+  else if (s.kind === 'terminal') {
+    refit();
+    const t = state.terms.get(s.id); if (t) setTimeout(() => t.term.focus(), 0);
+  } else if (s.kind === 'doc') refit();
+}
+function mobSetDest(dest) {
+  state.mnav = mobSwitchDest(state.mnav, dest);
+  store.set('mdest', state.mnav.dest);     // R11 — the DESTINATION only. The stack is never stored.
+  applyMobScreen();
+}
+
 (function mobile() {
-  const grid = $('bodyGrid');
-  const menu = $('mobMenu');
   const MQ = window.matchMedia('(max-width:760px)');
 
   // send a raw sequence to the active PTY, then keep focus in the terminal (raises the soft keyboard)
@@ -3419,21 +5526,22 @@ function applyCtrl(d) {
     if (state.active) { const t = state.terms.get(state.active); if (t) t.term.focus(); }
   };
   $('mobPalette').onclick = () => togglePalette();
+  if ($('mobBack')) $('mobBack').onclick = () => mobBack();
+  // the phone's own theme control drives the SAME toggle as the header's, so the two can never
+  // disagree about what the stored theme is
+  if ($('mobTheme')) $('mobTheme').onclick = () => $('themeBtn').click();
+  document.querySelectorAll('#mobNav [data-dest]').forEach((b) => b.onclick = () => mobSetDest(b.dataset.dest));
 
-  // the switcher: one column at a time, terminal is the default (priority) pane, choice persisted
-  function setView(v) {
-    grid.dataset.mview = v;
-    menu.dataset.view = v;
-    document.querySelectorAll('.mobtabs [data-mview]').forEach((b) => b.setAttribute('aria-selected', String(b.dataset.mview === v)));
-    store.set('mview', v);
-    if (v === 'terminal') {
-      refit();
-      if (state.active) { const t = state.terms.get(state.active); if (t) setTimeout(() => t.term.focus(), 0); }
-    }
-  }
-  const remembered = store.get('mview');
-  setView(['sessions', 'terminal', 'library'].includes(remembered) ? remembered : 'terminal');
-  document.querySelectorAll('.mobtabs [data-mview]').forEach((b) => b.onclick = () => setView(b.dataset.mview));
+  /* R11 — the destination is remembered; the deeper stack deliberately is NOT. A pushed screen
+   * names an object that may no longer exist on reload, and restoring it would mean drawing a
+   * screen for something PMOS has not re-read. `pmos-ws:mview` (the retired three-way switcher's
+   * key) is read ONCE here for migration and never written again — every value it could hold,
+   * plus anything unrecognised, lands on the `board` root. */
+  const stored = store.get('mdest');
+  const dest = stored ? mobMigrateView(stored) : mobMigrateView(store.get('mview'));
+  state.mnav = mobNavInit(dest);
+  store.set('mdest', state.mnav.dest);
+  applyMobScreen();
 
   // FitAddon must re-fit when the soft keyboard shows/hides (visualViewport) and on rotation, or
   // xterm renders more rows than fit and the bottom is clipped (the R9 failure, on a phone).
@@ -3442,8 +5550,10 @@ function applyCtrl(d) {
     window.visualViewport.addEventListener('scroll', refit);
   }
   window.addEventListener('orientationchange', () => setTimeout(refit, 250));
-  // crossing the breakpoint (rotate a tablet, resize a window) must re-fit the terminal
-  const onMQ = () => refit();
+  // Crossing the breakpoint (rotate a tablet, resize a window) must re-fit the terminal AND
+  // re-decide whether the shell exists at all — a shell left mounted above 760px is a second
+  // navigation system on the desktop.
+  const onMQ = () => { applyMobScreen(); refit(); };
   if (MQ.addEventListener) MQ.addEventListener('change', onMQ); else if (MQ.addListener) MQ.addListener(onMQ);
 })();