monomind 2.5.1 → 2.5.3

package/packages/@monomind/cli/dist/src/routing/embed-worker.js

@@ -32,7 +32,7 @@ async function main() {
     }
     // Cap the task to prevent OOM when an oversized string is passed to the embedding model.
     const task = rawTask.length > MAX_TASK_LENGTH ? rawTask.slice(0, MAX_TASK_LENGTH) : rawTask;
-    const { RouteLayer, ALL_ROUTES } = await import('@monomind/routing');
+    const { RouteLayer, ALL_ROUTES } = await import('@monoes/routing');
     const semantic = await createSemanticRouting(ALL_ROUTES);
     if (!semantic) {
         // Model unavailable — signal the parent to degrade.

package/packages/@monomind/cli/dist/src/routing/llm-caller.js

@@ -7,7 +7,7 @@
  * No API key required: the host's existing Claude Code auth is reused.
  *
  * The returned function matches `LLMFallbackConfig.llmCaller` from
- * `@monomind/routing` — `(prompt: string) => Promise<string>`. When the
+ * `@monoes/routing` — `(prompt: string) => Promise<string>`. When the
  * `claude` CLI is unavailable it throws, which the routing layer already
  * catches and degrades to the best semantic match.
  */

package/packages/@monomind/cli/dist/src/routing/route-layer-factory.js

@@ -140,7 +140,7 @@ function runWorker(task) {
     });
 }
 export async function createConfiguredRouteLayer(opts = {}) {
-    const { RouteLayer, KeywordPreFilter, LLMFallbackRouter, ALL_ROUTES } = await import('@monomind/routing');
+    const { RouteLayer, KeywordPreFilter, LLMFallbackRouter, ALL_ROUTES } = await import('@monoes/routing');
     const { createClaudeLLMCaller } = await import('./llm-caller.js');
     const llmCaller = createClaudeLLMCaller({ model: 'haiku' });
     const keyword = new KeywordPreFilter();

package/packages/@monomind/cli/dist/src/ui/dashboard.html

@@ -126,14 +126,17 @@ html, body { height: 100%; background: var(--bg); color: var(--text-hi); font-fa
 /* ── detail panel ─────────────────────────────────────────── */
 #detail-panel {
   position: absolute; top: 0; right: 252px; bottom: 0;
-  width: 0; overflow: hidden;
+  width: 280px; overflow: hidden;
   background: oklch(13% 0.009 55);
   border-left: 1px solid var(--border);
   border-right: 1px solid var(--border);
-  transition: width 0.22s cubic-bezier(0.16, 1, 0.3, 1);
+  /* compositor-only reveal (opacity/transform) — animating width reflows on every frame */
+  opacity: 0; visibility: hidden; transform: translateX(12px);
+  transition: opacity 0.22s cubic-bezier(0.16, 1, 0.3, 1), transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), visibility 0s 0.22s;
   display: flex; flex-direction: column; z-index: 10;
 }
-#detail-panel.open { width: 280px; }
+#detail-panel.open { opacity: 1; visibility: visible; transform: none; transition: opacity 0.22s cubic-bezier(0.16, 1, 0.3, 1), transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), visibility 0s 0s; }
+@media (prefers-reduced-motion: reduce) { #detail-panel { transition: none; } #rp-fill { transition: none; } }
 #detail-head { padding: 12px 14px; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
 #detail-head h3 { font-size: 12px; font-weight: 600; color: var(--text-hi); flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 #detail-close { font-size: 14px; color: var(--text-lo); background: none; border: none; cursor: pointer; padding: 0 2px; line-height: 1; }
@@ -245,7 +248,7 @@ html, body { height: 100%; background: var(--bg); color: var(--text-hi); font-fa
 .loop-cdown { font-family: var(--mono); font-size: 11px; color: var(--accent); white-space: nowrap; display: inline; }
 .loop-cdown.overdue { color: var(--red); }
 .lp-bar { height: 4px; background: var(--border); border-radius: 2px; margin-top: 5px; overflow: hidden; }
-.lp-fill { height: 100%; background: var(--accent); border-radius: 2px; transition: width 0.4s ease; }
+.lp-fill { height: 100%; background: var(--accent); border-radius: 2px; }
 .loop-stop-btn { font-size: 11px; padding: 2px 8px; background: none; border: 1px solid var(--border); border-radius: 4px; color: var(--text-lo); cursor: pointer; font-family: var(--sans); }
 .loop-stop-btn:hover { border-color: var(--red); color: var(--red); }
 .loop-status.done { background: var(--surface-hi); color: var(--text-xs); }
@@ -426,8 +429,53 @@ html, body { height: 100%; background: var(--bg); color: var(--text-hi); font-fa
 .oms-val { font-size: 12px; color: var(--text-hi); word-break: break-word; line-height: 1.4; }
 
 /* SVG org chart */
-.org-chart-wrap { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r); overflow: hidden; margin-bottom: 12px; }
+.org-chart-wrap { position: relative; background: var(--surface); border: 1px solid var(--border); border-radius: var(--r); overflow: hidden; margin-bottom: 12px; }
 .org-chart-svg { width: 100%; display: block; }
+.v2-chart-expand {
+  position: absolute; top: 8px; right: 8px; z-index: 3;
+  width: 28px; height: 28px; padding: 0;
+  display: grid; place-items: center;
+  font-size: 14px; line-height: 1; cursor: pointer;
+  color: oklch(60% 0.01 75); background: oklch(16% 0.01 55 / 0.85);
+  border: 1px solid var(--border); border-radius: 6px;
+  transition: color 0.15s, border-color 0.15s;
+}
+.v2-chart-expand:hover { color: oklch(80% 0.12 75); border-color: oklch(72% 0.18 75 / 0.5); }
+#v2-chart-modal {
+  position: fixed; inset: 0; z-index: 1200;
+  display: flex; flex-direction: column;
+  background: oklch(9% 0.008 55 / 0.985);
+  opacity: 0; transition: opacity 0.3s cubic-bezier(0.22, 1, 0.36, 1);
+}
+#v2-chart-modal.open { opacity: 1; }
+#v2-chart-modal .v2cm-head {
+  display: flex; align-items: center; justify-content: space-between;
+  padding: 14px 20px; border-bottom: 1px solid var(--border); flex: 0 0 auto;
+}
+#v2-chart-modal .v2cm-title {
+  font-size: 14px; font-weight: 600; letter-spacing: 0.02em; color: var(--text-hi, oklch(88% 0.005 75));
+}
+#v2-chart-modal .v2cm-close {
+  width: 32px; height: 32px; padding: 0; display: grid; place-items: center;
+  font-size: 15px; cursor: pointer; color: oklch(60% 0.01 75);
+  background: oklch(16% 0.01 55); border: 1px solid var(--border); border-radius: 7px;
+  transition: color 0.15s, border-color 0.15s;
+}
+#v2-chart-modal .v2cm-close:hover { color: oklch(85% 0.01 75); border-color: oklch(50% 0.01 75); }
+#v2-chart-modal .v2cm-body {
+  flex: 1 1 auto; min-height: 0; overflow: auto; padding: 18px 24px 24px;
+  transform: scale(0.985); transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
+}
+#v2-chart-modal.open .v2cm-body { transform: scale(1); }
+#v2-chart-modal .org-chart-wrap { border: none; background: transparent; }
+#v2-chart-modal .org-chart-svg { min-height: calc(100vh - 260px) !important; max-height: none; }
+.v2cm-placeholder {
+  padding: 40px 16px; text-align: center;
+  color: oklch(48% 0.005 75); font-size: 12px; letter-spacing: 0.02em;
+}
+@media (prefers-reduced-motion: reduce) {
+  #v2-chart-modal, #v2-chart-modal .v2cm-body { transition: none; transform: none; }
+}
 .v2-bubble-inner {
   background: oklch(18% 0.01 55 / 0.95);
   border: 1px solid oklch(72% 0.18 75 / 0.4);
@@ -744,7 +792,7 @@ html, body { height: 100%; background: var(--bg); color: var(--text-hi); font-fa
 .rp-btn:hover { color:var(--text-hi); }
 .rp-btn.active { color:var(--accent); border-color:oklch(72% 0.18 75 / 0.5); }
 #rp-progress { flex:1; height:3px; background:var(--surface-hi); border-radius:2px; overflow:hidden; }
-#rp-fill { height:100%; background:var(--accent); border-radius:2px; transition:width 0.15s; }
+#rp-fill { height:100%; width:100%; background:var(--accent); border-radius:2px; transform:scaleX(0); transform-origin:left; transition:transform 0.15s; }
 #rp-counter { font-size:11px; color:var(--text-lo); font-family:var(--mono); white-space:nowrap; }
 
 /* ── agent chat view ─────────────────────────────────────── */
@@ -886,7 +934,7 @@ html, body { height: 100%; background: var(--bg); color: var(--text-hi); font-fa
 .burn-gauge-row { display:flex; align-items:center; gap:8px; margin-bottom:4px; }
 .burn-gauge-label { font-size:10px; color:var(--text-lo); width:60px; flex-shrink:0; }
 .burn-gauge-track { flex:1; height:6px; background:var(--surface-hi); border-radius:3px; overflow:hidden; }
-.burn-gauge-fill { height:100%; border-radius:3px; transition:width 0.4s, background 0.4s; }
+.burn-gauge-fill { height:100%; border-radius:3px; }
 .burn-val { font-size:10px; font-family:var(--mono); color:var(--text-xs); white-space:nowrap; }
 .burn-rate-ok   { background:oklch(65% 0.15 150); }
 .burn-rate-warn { background:oklch(72% 0.18 75); }
@@ -1177,7 +1225,7 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
 .mg-bar-row { display:flex; align-items:center; gap:8px; margin-bottom:5px; font-size:12px; }
 .mg-bar-row .mg-bar-lbl { width:140px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-mid); flex-shrink:0; }
 .mg-bar-track { flex:1; background:var(--surface-hi); border-radius:3px; height:6px; overflow:hidden; }
-.mg-bar-fill { height:100%; border-radius:3px; background:var(--accent); transition:width 0.3s; }
+.mg-bar-fill { height:100%; border-radius:3px; background:var(--accent); }
 .mg-bar-fill.mg { background:var(--mg-accent); }
 .mg-bar-val { width:32px; text-align:right; color:var(--text-lo); font-size:11px; font-family:var(--mono); }
 .mg-section-title { font-size:11px; text-transform:uppercase; letter-spacing:0.07em; color:var(--text-xs); margin:16px 0 8px; }
@@ -1213,7 +1261,7 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
 .mgr-ranked-num { font-size:10px; font-family:var(--mono); color:var(--text-lo); text-align:right; }
 .mgr-ranked-name { font-size:12px; color:var(--text-hi); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
 .mgr-ranked-bar-wrap { height:3px; background:oklch(25% 0.008 55); border-radius:2px; overflow:hidden; }
-.mgr-ranked-bar-fill { height:100%; border-radius:2px; background:var(--accent); transition:width 0.45s cubic-bezier(0.16,1,0.3,1); }
+.mgr-ranked-bar-fill { height:100%; border-radius:2px; background:var(--accent); transform-origin:left; transition:transform 0.45s cubic-bezier(0.16,1,0.3,1); }
 .mgr-ranked-val { font-size:11px; font-family:var(--mono); color:var(--accent); text-align:right; white-space:nowrap; }
 /* risk items */
 .mgr-risk-list { display:flex; flex-direction:column; gap:6px; }
@@ -1244,7 +1292,7 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
 .mgr-bar-row { display:grid; grid-template-columns:130px 1fr 70px; align-items:center; gap:10px; }
 .mgr-bar-label { font-size:11px; font-family:var(--mono); color:var(--text-mid); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
 .mgr-bar-track { height:4px; background:oklch(25% 0.008 55); border-radius:2px; overflow:hidden; }
-.mgr-bar-fill { height:100%; border-radius:2px; transition:width 0.5s cubic-bezier(0.16,1,0.3,1); }
+.mgr-bar-fill { height:100%; border-radius:2px; transform-origin:left; transition:transform 0.5s cubic-bezier(0.16,1,0.3,1); }
 .mgr-bar-count { font-size:11px; font-family:var(--mono); color:var(--text-lo); text-align:right; white-space:nowrap; }
 /* all-clear */
 .mgr-clear { font-size:12px; color:var(--green); font-family:var(--mono); padding:8px 0; display:flex; align-items:center; gap:8px; }
@@ -1301,7 +1349,7 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
 .mgr-node-name { font-size:12px; font-weight:600; color:var(--text-hi); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
 .mgr-node-type { font-size:10px; font-family:var(--mono); color:var(--text-lo); background:oklch(25% 0.008 55); padding:2px 7px; border-radius:3px; white-space:nowrap; }
 .mgr-node-bar-wrap { height:3px; background:oklch(25% 0.008 55); border-radius:2px; overflow:hidden; }
-.mgr-node-bar-fill { height:100%; background:var(--accent); border-radius:2px; transition:width 0.4s cubic-bezier(0.16,1,0.3,1); }
+.mgr-node-bar-fill { height:100%; background:var(--accent); border-radius:2px; transform-origin:left; transition:transform 0.4s cubic-bezier(0.16,1,0.3,1); }
 .mgr-node-count { font-size:11px; font-family:var(--mono); color:var(--accent); text-align:right; white-space:nowrap; }
 
 /* Type distribution */
@@ -1309,7 +1357,7 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
 .mgr-type-row { display:grid; grid-template-columns:100px 1fr 52px 44px; align-items:center; gap:12px; }
 .mgr-type-name { font-size:11px; font-family:var(--mono); color:var(--text-mid); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
 .mgr-type-bar-wrap { height:4px; background:oklch(25% 0.008 55); border-radius:2px; overflow:hidden; }
-.mgr-type-bar-fill { height:100%; border-radius:2px; transition:width 0.5s cubic-bezier(0.16,1,0.3,1); }
+.mgr-type-bar-fill { height:100%; border-radius:2px; transform-origin:left; transition:transform 0.5s cubic-bezier(0.16,1,0.3,1); }
 .mgr-type-count { font-size:11px; font-family:var(--mono); color:var(--text-mid); text-align:right; }
 .mgr-type-pct { font-size:10px; font-family:var(--mono); color:var(--text-lo); text-align:right; }
 
@@ -1445,7 +1493,7 @@ select.pb-cfg-inp { padding: 4px 7px; cursor: pointer; }
 .wf-run-meta span { display: flex; align-items: center; gap: 4px; }
 .wf-run-error { font-size: 11px; color: var(--red); margin-top: 6px; font-family: var(--mono); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .wf-progress-bar { height: 3px; background: var(--border); border-radius: 2px; margin-top: 8px; overflow: hidden; }
-.wf-progress-bar-fill { height: 100%; background: var(--accent); border-radius: 2px; transition: width 0.3s; }
+.wf-progress-bar-fill { height: 100%; background: var(--accent); border-radius: 2px; }
 #wf-runs-list .loading-txt, #wf-defs-list .loading-txt { padding: 40px 0; text-align: center; color: var(--text-lo); }
 .wf-def-card { background: var(--surface); border: 1px solid var(--border); border-radius: 8px; padding: 14px 16px; margin-bottom: 8px; display: flex; align-items: flex-start; gap: 14px; cursor: default; transition: border-color 0.12s; }
 .wf-def-card:hover { border-color: var(--accent); }
@@ -1630,7 +1678,7 @@ select.pb-cfg-inp { padding: 4px 7px; cursor: pointer; }
           <button class="rp-btn" id="rp-play" onclick="replayToggle()" title="Play/pause replay">▶</button>
           <button class="rp-btn" onclick="replayStep(-1)" title="Step back">‹</button>
           <button class="rp-btn" onclick="replayStep(1)" title="Step forward">›</button>
-          <div id="rp-progress"><div id="rp-fill" style="width:0%"></div></div>
+          <div id="rp-progress"><div id="rp-fill"></div></div>
           <span id="rp-counter">0 / 0</span>
           <button class="rp-btn" onclick="stopReplay()" title="Exit replay">✕</button>
         </div>
@@ -4924,7 +4972,7 @@ function highlightReplayEntry() {
   });
   const total = replayEvents.length;
   const pct = total > 1 ? Math.round(replayIdx / (total - 1) * 100) : 100;
-  document.getElementById('rp-fill').style.width = pct + '%';
+  document.getElementById('rp-fill').style.transform = 'scaleX(' + (pct / 100) + ')';
   document.getElementById('rp-counter').textContent = `${replayIdx + 1} / ${total}`;
   // scroll into view
   replayEvents[replayIdx]?.scrollIntoView({ block: 'nearest' });
@@ -6050,6 +6098,43 @@ function _v2OrgIsLeader(r) {
     || r.agent_type === 'coordinator' || r.agent_type === 'devbot-orchestrator';
 }
 
+// ── Full-page chart modal ──────────────────────────────────────────────
+// While open, v2RenderOrgChart() renders into the modal body (wider viewBox)
+// and the inline pane holds a placeholder. Close restores the inline chart.
+let _v2ChartExpanded = false;
+function _v2ChartEsc(e) { if (e.key === 'Escape') v2ToggleChartExpand(false); }
+function v2ToggleChartExpand(open) {
+  _v2ChartExpanded = !!open;
+  let m = document.getElementById('v2-chart-modal');
+  if (open) {
+    if (!m) {
+      m = document.createElement('div');
+      m.id = 'v2-chart-modal';
+      m.setAttribute('role', 'dialog');
+      m.setAttribute('aria-modal', 'true');
+      m.setAttribute('aria-label', 'Org chart, expanded view');
+      m.innerHTML = `
+        <div class="v2cm-head">
+          <div class="v2cm-title"></div>
+          <button class="v2cm-close" onclick="v2ToggleChartExpand(false)" aria-label="Close expanded chart">✕</button>
+        </div>
+        <div id="v2-chart-modal-body" class="v2cm-body"></div>`;
+      document.body.appendChild(m);
+    }
+    m.querySelector('.v2cm-title').textContent = _v2SelOrg || 'Org chart';
+    const inlinePane = document.getElementById('odt-chart');
+    if (inlinePane) inlinePane.innerHTML = '<div class="v2cm-placeholder">Chart is expanded to full page · press Esc or ✕ to bring it back</div>';
+    document.addEventListener('keydown', _v2ChartEsc);
+    requestAnimationFrame(() => m.classList.add('open'));
+    v2RenderOrgChart();
+    m.querySelector('.v2cm-close').focus();
+  } else {
+    document.removeEventListener('keydown', _v2ChartEsc);
+    if (m) m.remove();
+    v2RenderOrgChart();
+  }
+}
+
 function v2RenderOrgChart() {
   if (!_v2SelOrg) return;
   const d = _v2OrgData;
@@ -6060,7 +6145,17 @@ function v2RenderOrgChart() {
   const goalText = d.goal || '—';
   const topo = (d.topology || 'hierarchical').toLowerCase();
   const created = d.created_at ? new Date(d.created_at).toLocaleDateString('en', {month:'short',day:'numeric',year:'numeric'}) : '—';
-  const pane = document.getElementById('odt-chart');
+  // Expanded mode renders into the full-page modal instead of the inline pane.
+  // Exactly ONE chart instance exists at a time — the bubble/letter/particle
+  // animation code queries singleton ids (v2-org-svg, v2oc-letters, …).
+  const pane = _v2ChartExpanded
+    ? document.getElementById('v2-chart-modal-body')
+    : document.getElementById('odt-chart');
+  if (!pane) return;
+  if (_v2ChartExpanded) {
+    const _t = document.querySelector('#v2-chart-modal .v2cm-title');
+    if (_t) _t.textContent = _v2SelOrg;
+  }
 
   // ── color palette ─────────────────────────────────────
   const COLORS = [
@@ -6085,7 +6180,19 @@ function v2RenderOrgChart() {
   }
 
   // ── layout positions ──────────────────────────────────
-  const W = 720, R = 42, PAD_X = R + 20, PAD_Y = R + 24;
+  // Expanded: width scales with head-count so nodes never overlap (inline
+  // keeps the compact 720 viewBox that fits the tab column).
+  let W = _v2ChartExpanded ? Math.max(1100, roles.length * 130) : 720;
+  // Crowded orgs (8+ roles) get smaller rings + serpentine re-flow in BOTH
+  // views, so topology reads instead of a wall of overlapping circles. Top
+  // padding reserves room for activity bubbles (34px box floating 46px above
+  // the ring) so message pop-ups never clip.
+  const _crowded = roles.length > 7;
+  const R = (_v2ChartExpanded || _crowded) ? 34 : 42;
+  // Side padding must cover the 140px-wide activity bubble (70 each side of
+  // a node center) or edge-column bubbles clip against the chart border.
+  const PAD_X = (_v2ChartExpanded || _crowded) ? Math.max(R + 20, 78) : R + 20;
+  const PAD_Y = (_v2ChartExpanded || _crowded) ? R + 96 : R + 24;
   const roleIds = new Set(roles.map(r => r.id));
   // all leaders at depth 0 (supports co-lead orgs)
   const leaders = roles.filter(_v2OrgIsLeader);
@@ -6182,6 +6289,31 @@ function v2RenderOrgChart() {
     _hubAndSpoke();
   }
 
+  // ── crowded re-flow: break single-row walls into a serpentine grid ──
+  // A 12-role chain or hub laid out on one line says nothing about who talks
+  // to whom. When the layout degenerates to <=2 distinct rows with a crowded
+  // row, re-flow in reading order into rows of ~6, reversing every other row
+  // so consecutive nodes stay physically adjacent across wraps. Applies in
+  // both views for 8+ roles (the inline chart scales the viewBox down).
+  if (_crowded) {
+    const _rowsSeen = new Set(Object.values(pos).map(p => Math.round(p.y)));
+    const _widest = Math.max(..._rowsSeen.size ? [..._rowsSeen].map(y => Object.values(pos).filter(p => Math.round(p.y) === y).length) : [0]);
+    if (_rowsSeen.size <= 2 && _widest > 7) {
+      const seq = [...roles].sort((a, b) => (pos[a.id].y - pos[b.id].y) || (pos[a.id].x - pos[b.id].x));
+      const perRow = Math.min(6, Math.ceil(seq.length / Math.ceil(seq.length / 6)));
+      const COL_W = 185, ROW_H = 205;
+      seq.forEach((r, i) => {
+        const row = Math.floor(i / perRow);
+        let col = i % perRow;
+        if (row % 2 === 1) col = perRow - 1 - col; // serpentine
+        pos[r.id] = { x: PAD_X + col * COL_W, y: PAD_Y + row * ROW_H };
+      });
+      const rows = Math.ceil(seq.length / perRow);
+      W = PAD_X * 2 + (perRow - 1) * COL_W;
+      _layoutH = PAD_Y + (rows - 1) * ROW_H + R + 28;
+    }
+  }
+
   const H = _layoutH || (hasSubs ? 320 : 180);
 
   // ── build edge SVG strings with offset parallel arrows ─
@@ -6217,7 +6349,19 @@ function v2RenderOrgChart() {
     } else {
       stroke='oklch(65% 0.15 150)'; dash=''; marker='v2ah'; opacity=0.6; sw=1.5;
     }
-    edgesHTML += `<path id="${pid}" class="v2oc-edge" d="M${x1},${y1} L${x2},${y2}" stroke="${stroke}" stroke-opacity="${opacity}" stroke-width="${sw}" ${dash?`stroke-dasharray="${dash}"`:''}  fill="none" marker-end="url(#${marker})"/>`;
+    // Long spans (the boss fan-out crossing rows) bow outward as quadratic
+    // curves so crossings separate; short neighbor links stay straight.
+    const _spanLen = len - (trimS + trimE);
+    let dAttr;
+    if (_spanLen > 260) {
+      const sag = Math.min(56, _spanLen * 0.14) * edgeSide * canonDir;
+      const mx = ((+x1 + +x2) / 2 + px * sag).toFixed(1);
+      const my = ((+y1 + +y2) / 2 + py * sag).toFixed(1);
+      dAttr = `M${x1},${y1} Q${mx},${my} ${x2},${y2}`;
+    } else {
+      dAttr = `M${x1},${y1} L${x2},${y2}`;
+    }
+    edgesHTML += `<path id="${pid}" class="v2oc-edge" d="${dAttr}" stroke="${stroke}" stroke-opacity="${opacity}" stroke-width="${sw}" ${dash?`stroke-dasharray="${dash}"`:''}  fill="none" marker-end="url(#${marker})"/>`;
 
     // Animated flow particle on command edges
     if (edge.type === 'command') {
@@ -6269,13 +6413,15 @@ function v2RenderOrgChart() {
   });
 
   // ── assemble HTML ─────────────────────────────────────
+  // Expanded view: the chart owns the space — meta cards stay in the tab.
   pane.innerHTML = `
-    <div class="org-meta-strip">
+    ${_v2ChartExpanded ? '' : `<div class="org-meta-strip">
       <div class="oms-cell"><div class="oms-lbl">Goal</div><div class="oms-val" style="color:var(--text-mid);font-size:11px;line-height:1.4">${esc(goalText)}</div></div>
       <div class="oms-cell"><div class="oms-lbl">Topology</div><div class="oms-val">${esc(topo)}</div></div>
       <div class="oms-cell"><div class="oms-lbl">Created</div><div class="oms-val" style="color:var(--text-mid)">${esc(created)}</div></div>
-    </div>
+    </div>`}
     <div class="org-chart-wrap">
+      ${_v2ChartExpanded ? '' : `<button class="v2-chart-expand" onclick="v2ToggleChartExpand(true)" title="Expand chart to full page" aria-label="Expand chart to full page">⛶</button>`}
       <svg class="org-chart-svg" id="v2-org-svg" viewBox="0 0 ${W} ${H}" style="min-height:${Math.round(H * 0.5)}px">
         <defs>
           <marker id="v2ac" markerWidth="7" markerHeight="7" refX="6" refY="3.5" orient="auto"><path d="M0,0.5 L0,6.5 L6,3.5 z" fill="oklch(72% 0.18 75 / 0.8)"/></marker>
@@ -6320,7 +6466,7 @@ function v2RenderOrgChart() {
   } else {
     // CSS fallback: simple fade-in stagger
     pane.querySelectorAll('.v2oc-node').forEach((el, i) => {
-      el.style.animation = `v2nodeIn 0.45s cubic-bezier(0.34,1.56,0.64,1) ${(i * 0.08).toFixed(2)}s forwards`;
+      el.style.animation = `v2nodeIn 0.45s cubic-bezier(0.16,1,0.3,1) ${(i * 0.08).toFixed(2)}s forwards`;
       el.style.opacity = '0';
     });
   }
@@ -12156,8 +12302,8 @@ function mgShowResult(title, html) {
   requestAnimationFrame(() => {
     if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) return;
     panel.querySelectorAll('.mgr-ranked-bar-fill, .mgr-bar-fill').forEach(b => {
-      const w = b.style.width; b.style.width = '0';
-      requestAnimationFrame(() => { b.style.width = w; });
+      b.style.transform = 'scaleX(0)';
+      requestAnimationFrame(() => { b.style.transform = 'scaleX(1)'; });
     });
   });
 }
@@ -13075,9 +13221,8 @@ function mgRenderReport(markdown, el, stats) {
   requestAnimationFrame(() => {
     if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) return;
     el.querySelectorAll('.mgr-node-bar-fill, .mgr-type-bar-fill').forEach(b => {
-      const w = b.style.width;
-      b.style.width = '0';
-      requestAnimationFrame(() => { b.style.width = w; });
+      b.style.transform = 'scaleX(0)';
+      requestAnimationFrame(() => { b.style.transform = 'scaleX(1)'; });
     });
   });
 }
@@ -13633,8 +13778,13 @@ async function secondBrainSearch() {
       results.map(function (res) {
         var srcTag = (res.tags || []).find(function (t) { return t.indexOf('src:') === 0; });
         var label = srcTag ? srcTag.slice(4).split('/').slice(-2).join('/') : (res.key || '');
+        // Surface badge: the endpoint fuses chunks + KG triplets + rules +
+        // pattern memories (RRF); show non-chunk kinds so users see where a
+        // hit came from.
+        var kindBadge = res.triplet ? 'kg' : (res.rule ? 'rule' : (res.memory ? 'memory' : ''));
         return '<div style="border:1px solid var(--border);border-radius:8px;padding:8px 10px;margin-bottom:6px">' +
           '<div style="font-size:10px;color:var(--text-lo);margin-bottom:3px">' + esc(label) +
+            (kindBadge ? ' <span style="color:var(--accent);border:1px solid var(--accent);border-radius:4px;padding:0 4px">' + kindBadge + '</span>' : '') +
             (res.global ? ' <span style="color:var(--accent-dim,#888);border:1px solid var(--border);border-radius:4px;padding:0 4px">global</span>' : '') +
             ' <span style="color:var(--accent)">' + (typeof res.score === 'number' ? res.score.toFixed(2) : '') + '</span></div>' +
           '<div style="font-size:12px;white-space:pre-wrap;max-height:120px;overflow:hidden">' + esc(String(res.content || '').slice(0, 600)) + '</div>' +

package/packages/@monomind/cli/dist/src/ui/orgs.html

@@ -976,6 +976,7 @@ html, body {
             <div id="health-grid" class="health-grid"></div>
             <div id="health-detail"></div>
             <div id="health-history"></div>
+            <div id="health-memory"></div>
           </div>
         </div>
 
@@ -1762,6 +1763,7 @@ function renderHealth() {
   }
 
   loadRunHistory();
+  loadOrgMemory();
 }
 
 // Run history (history.jsonl, written by the daemon at each stopOrg): outcome,
@@ -1793,6 +1795,28 @@ async function loadRunHistory() {
   } catch (_) { el.innerHTML = ''; }
 }
 
+// Org memory: knowledge-graph size, learned entities, and distilled rules
+// (accumulated across runs via org_learn / heuristic extraction).
+async function loadOrgMemory() {
+  const el = document.getElementById('health-memory');
+  if (!el || !selectedOrg) return;
+  try {
+    const listOrg = allOrgs.find(o => o.name === selectedOrg) || {};
+    const r = await fetch(`/api/orgs/${encodeURIComponent(selectedOrg)}/memory?dir=${encodeURIComponent(listOrg.projectDir || '')}`);
+    if (!r.ok) { el.innerHTML = ''; return; }
+    const m = await r.json();
+    if (!m.nodes && !m.rules) { el.innerHTML = ''; return; }
+    el.innerHTML = `
+      <div style="margin-top:16px">
+        <div style="font-size:8px;letter-spacing:2px;color:var(--dim);margin-bottom:8px">ORG MEMORY — ${Number(m.nodes) || 0} ENTITIES · ${Number(m.edges) || 0} RELATIONS · ${Number(m.rules) || 0} RULES</div>
+        ${Array.isArray(m.glossary) && m.glossary.length ? `
+          <div style="font-size:9px;color:var(--muted);line-height:1.7">${m.glossary.map(g => `<span style="border:1px solid oklch(50% 0 0 / 0.25);border-radius:3px;padding:1px 5px;margin-right:4px;white-space:nowrap;display:inline-block;margin-bottom:3px">${esc(g)}</span>`).join('')}</div>` : ''}
+        ${Array.isArray(m.ruleTexts) && m.ruleTexts.length ? m.ruleTexts.map(t => `
+          <div style="font-size:9px;padding:4px 0;border-bottom:1px solid oklch(50% 0 0 / 0.1);color:var(--muted)">▸ ${esc(t)}</div>`).join('') : ''}
+      </div>`;
+  } catch (_) { el.innerHTML = ''; }
+}
+
 // ── CHAT TAB ──────────────────────────────────────────────────────
 let chatSessions = [];   // all sessions from /api/mastermind/sessions
 let chatCurrentId = null; // currently viewed session id