trantor 0.17.4 → 0.17.6

package/.claude-plugin/marketplace.json

@@ -6,14 +6,14 @@
   },
   "metadata": {
     "description": "Trantor — the hub-world for AI agent crews: live message bus, presence, project Kanban/flow board + context-handoff for independent AI coding agents (Claude, Codex, Gemini, …)",
-    "version": "0.17.4"
+    "version": "0.17.6"
   },
   "plugins": [
     {
       "name": "trantor",
       "source": "./",
       "description": "The hub-world for AI agent crews. Say \"fire up the crew\" and Claude becomes the architect: a plan-aware Advisor routes the work (solo / cheap inline calls / live crew of Codex, Gemini, Kimi & DeepSeek in their own terminal windows), a Kanban/flow command center with a testing gate tracks it, and an economics brain (Scrooge) keeps the receipts. Includes the relay MCP, a SessionStart auto-discovery hook, and a PreCompact context-handoff so a fresh session can take over a full window instead of compacting.",
-      "version": "0.17.4",
+      "version": "0.17.6",
       "author": {
         "name": "Sasha Bogojevic"
       },

package/.claude-plugin/plugin.json

@@ -1,6 +1,6 @@
 {
   "name": "trantor",
-  "version": "0.17.4",
+  "version": "0.17.6",
   "description": "Trantor — the hub-world for AI agent crews: live message bus, presence, project Kanban/flow board + crew orchestration for independent AI coding agents (Claude, Codex, Gemini, Kimi, DeepSeek)",
   "mcpServers": {
     "relay": {

package/hub.mjs

@@ -5,7 +5,7 @@
 // machines reach it (e.g. over a Tailscale tailnet), set RELAY_HOST=0.0.0.0 — but only on a
 // private network, or add auth first. See "Always-on / remote hub" in the README (roadmap).
 import http from "node:http";
-import { readFileSync, writeFileSync, existsSync, mkdirSync, statSync } from "node:fs";
+import { readFileSync, writeFileSync, existsSync, mkdirSync, statSync, readdirSync } from "node:fs";
 import { homedir } from "node:os";
 import { join } from "node:path";
 
@@ -22,6 +22,29 @@ if (!existsSync(DATA_DIR)) mkdirSync(DATA_DIR, { recursive: true });
 // total cheap to serve no matter how big the ledger grows.
 let _ledgerCache = { mtimeMs: -1, rows: [] };
 
+// Per-turn failure telemetry lives across many ~/.agent-bus/logs/<agent>-<project>.jsonl files
+// (written by crew-runner.mjs). Scanning them all every /learning poll would be wasteful, so cache
+// the aggregate and only rescan when a log file changes (tracked by the dir's newest mtime).
+const LOGDIR = join(homedir(), ".agent-bus", "logs");
+let _telemetryCache = { maxMtimeMs: -1, turns: [] };
+function scanTelemetry() {
+  let files = [];
+  try { files = readdirSync(LOGDIR).filter(f => f.endsWith(".jsonl")); } catch { return _telemetryCache.turns; }
+  let maxMtime = 0;
+  for (const f of files) { try { const m = statSync(join(LOGDIR, f)).mtimeMs; if (m > maxMtime) maxMtime = m; } catch {} }
+  if (maxMtime === _telemetryCache.maxMtimeMs) return _telemetryCache.turns;   // nothing changed
+  const turns = [];
+  for (const f of files) {
+    let txt = ""; try { txt = readFileSync(join(LOGDIR, f), "utf8"); } catch { continue; }
+    for (const line of txt.trim().split("\n")) {
+      if (!line) continue;
+      try { const r = JSON.parse(line); if (r && r.agent) turns.push(r); } catch {}
+    }
+  }
+  _telemetryCache = { maxMtimeMs: maxMtime, turns };
+  return turns;
+}
+
 // peers: { session: { lastSeen, status, project } } ; tasks: kanban cards
 // projectMeta: { project: { brief, by, updated } } — the "what & why" blurb per project
 let state = { messages: [], peers: {}, seq: 0, tasks: [], taskSeq: 0, projectMeta: {}, lessons: [] };
@@ -218,6 +241,99 @@ const server = http.createServer(async (req, res) => {
       const ls = state.lessons.filter(l => l.scope === "global" || (agent && l.scope === agent));
       return json(res, 200, { lessons: ls });
     }
+    // The self-learning loop, surfaced for the dashboard "Learning" sidebar: relay lessons grouped
+    // (global / per-agent / per-project), per-LLM reliability from turn telemetry (+ daily series for
+    // charts), and the Scrooge guardrails baked into each model's prompt (+ per-model economics).
+    if (req.method === "GET" && P === "/learning") {
+      const projOf = by => (by && by.includes(":")) ? by.split(":").pop() : "";
+      // ts is ms (lessons/telemetry) or s (ledger). Null-safe: a malformed record with a missing/bad
+      // ts must not throw (new Date(NaN).toISOString() does) and 500 the whole endpoint — return null
+      // and let callers skip that day-bucket.
+      const dayOf = ts => { const n = Number(ts); if (!n) return null; const d = new Date(n > 2e10 ? n : n * 1000); return Number.isNaN(d.getTime()) ? null : d.toISOString().slice(0, 10); };
+      const ALL = "*";   // the cross-project ("All projects") bucket
+      const out = { totals: {}, lessons: { global: [], byAgent: {}, byProject: {}, projects: [] }, agents: [], agentsByProject: {}, models: [], modelsByProject: {} };
+
+      // relay lessons → global / by-agent / by-project (project derived from the recorder's session id)
+      const projSet = new Set();
+      for (const l of state.lessons) {
+        const rec = { text: l.text, scope: l.scope, by: l.by || "", project: projOf(l.by), ts: l.ts || 0 };
+        if (l.scope === "global") out.lessons.global.push(rec); else (out.lessons.byAgent[l.scope] ||= []).push(rec);
+        if (rec.project) { (out.lessons.byProject[rec.project] ||= []).push(rec); projSet.add(rec.project); }
+      }
+
+      // per-LLM reliability from turn telemetry, bucketed BY PROJECT (+ a global ALL bucket) so the
+      // sidebar's project filter scopes the charts. Each turn carries its own project.
+      const turns = scanTelemetry();
+      const relAgg = {};       // scope -> agent -> {turns,failures,models:Set,lastFailure,days}
+      const scopeModels = {};  // scope -> Set(model used)
+      let totalTurns = 0, totalFails = 0;
+      const bumpRel = (scope, t) => {
+        const a = ((relAgg[scope] ||= {})[t.agent] ||= { agent: t.agent, turns: 0, failures: 0, models: new Set(), lastFailure: null, days: {} });
+        a.turns++;
+        if (t.model) { a.models.add(t.model); if (t.model !== "default") (scopeModels[scope] ||= new Set()).add(t.model); }
+        const dk = dayOf(t.ts); const d = dk ? (a.days[dk] ||= { turns: 0, failures: 0 }) : null; if (d) d.turns++;
+        if (t.exit && t.exit !== 0) { a.failures++; if (d) d.failures++; if (!a.lastFailure || t.ts > a.lastFailure.ts) a.lastFailure = { ts: t.ts, exit: t.exit, project: t.project || "" }; }
+      };
+      for (const t of turns) {
+        if (!t.agent) continue;
+        totalTurns++; if (t.exit && t.exit !== 0) totalFails++;
+        bumpRel(ALL, t);
+        if (t.project) { bumpRel(t.project, t); projSet.add(t.project); }
+      }
+      // lessons-accumulated-over-time per scope -> agent brand -> day (agent-scoped lessons only)
+      const lessonAgg = {};
+      for (const l of state.lessons) {
+        if (l.scope === "global") continue; const d = dayOf(l.ts); if (!d) continue;
+        const bump = scope => { (((lessonAgg[scope] ||= {})[l.scope] ||= {})[d]) = (lessonAgg[scope][l.scope][d] || 0) + 1; };
+        bump(ALL); const p = projOf(l.by); if (p) bump(p);
+      }
+      const buildAgents = scope => Object.values(relAgg[scope] || {}).sort((a, b) => b.turns - a.turns).map(a => {
+        const days = Object.keys(a.days).sort(); let cum = 0; const ld = (lessonAgg[scope] || {})[a.agent] || {};
+        return { agent: a.agent, turns: a.turns, failures: a.failures, failRate: a.turns ? +(a.failures / a.turns).toFixed(3) : 0,
+          lastFailure: a.lastFailure, models: [...a.models],
+          series: {
+            failRate: days.map(d => ({ day: d, turns: a.days[d].turns, failures: a.days[d].failures, rate: a.days[d].turns ? +(a.days[d].failures / a.days[d].turns).toFixed(3) : 0 })),
+            lessons: Object.keys(ld).sort().map(d => ({ day: d, count: (cum += ld[d]) })),
+          } };
+      });
+
+      // Scrooge guardrails (global per model) + per-model economics from the ledger, bucketed by project
+      let guard = {}; try { guard = JSON.parse(readFileSync(join(homedir(), ".token-scrooge", "lessons.json"), "utf8")) || {}; } catch {}
+      try { const lp = join(homedir(), ".token-scrooge", "calls.jsonl"); const st = statSync(lp); if (st.mtimeMs !== _ledgerCache.mtimeMs) { const rows = readFileSync(lp, "utf8").trim().split("\n").map(l => { try { return JSON.parse(l); } catch { return null; } }).filter(c => c && c.ok); _ledgerCache = { mtimeMs: st.mtimeMs, rows }; } } catch {}
+      const ledAgg = {};   // scope -> model -> {calls,ti,to,cost,days}
+      const bumpLed = (scope, c) => {
+        const m = ((ledAgg[scope] ||= {})[c.model] ||= { calls: 0, ti: 0, to: 0, cost: 0, days: {} });
+        m.calls++; m.ti += c.tokens_in || 0; m.to += c.tokens_out || 0; m.cost += c.cost_usd || 0;
+        const dk = dayOf(c.ts); if (dk) { const d = (m.days[dk] ||= { cost: 0, ti: 0, to: 0 }); d.cost += c.cost_usd || 0; d.ti += c.tokens_in || 0; d.to += c.tokens_out || 0; }
+        (scopeModels[scope] ||= new Set()).add(c.model);
+      };
+      for (const c of _ledgerCache.rows) { if (!c.model) continue; bumpLed(ALL, c); if (c.project) { bumpLed(c.project, c); projSet.add(c.project); } }
+
+      const savedOf = (ti, to, cost) => +Math.max(0, ti * 15 / 1e6 + to * 75 / 1e6 - cost).toFixed(2);
+      let totalGuardrails = 0;
+      const mkModel = (scope, model, g) => {
+        const gcount = Object.values(g || {}).reduce((s, arr) => s + (Array.isArray(arr) ? arr.length : 0), 0);
+        if (scope === ALL) totalGuardrails += gcount;   // guardrails are global — count once
+        const lm = (ledAgg[scope] || {})[model];
+        return { model, guardrails: g || {}, guardrailCount: gcount, calls: lm ? lm.calls : 0, cost_usd: lm ? +lm.cost.toFixed(4) : 0,
+          saved_usd: lm ? savedOf(lm.ti, lm.to, lm.cost) : 0,
+          series: { saved: lm ? Object.keys(lm.days).sort().map(d => ({ day: d, saved: savedOf(lm.days[d].ti, lm.days[d].to, lm.days[d].cost) })) : [] } };
+      };
+      const buildModels = scope => {
+        const keys = new Set(scopeModels[scope] || []);          // models used in this scope
+        if (scope === ALL) for (const k of Object.keys(guard)) if (k !== "*") keys.add(k);   // global view also lists every guardrailed model
+        const arr = [...keys].sort().map(m => mkModel(scope, m, guard[m]));
+        if (guard["*"]) arr.unshift(mkModel(scope, "∗ all models", guard["*"]));   // guardrails that apply to every model
+        return arr;
+      };
+
+      out.lessons.projects = [...projSet].sort();
+      out.agents = buildAgents(ALL); out.models = buildModels(ALL);
+      for (const p of out.lessons.projects) { out.agentsByProject[p] = buildAgents(p); out.modelsByProject[p] = buildModels(p); }
+
+      out.totals = { lessons: state.lessons.length, guardrails: totalGuardrails, turns: totalTurns, failures: totalFails, failRate: totalTurns ? +(totalFails / totalTurns).toFixed(3) : 0, models: out.models.length };
+      return json(res, 200, out);
+    }
     if (req.method === "POST" && P === "/send") {
       const b = await body(req);
       if (!b.from || !String(b.text ?? "").trim()) return json(res, 400, { error: "from and non-empty text required" });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "trantor",
-  "version": "0.17.4",
+  "version": "0.17.6",
   "type": "module",
   "bin": {
     "trantor": "bin/cli.mjs"

package/ui.html

@@ -11,8 +11,38 @@ header{display:flex;align-items:center;gap:13px;padding:11px 18px;border-bottom:
 .dot.off{background:var(--dim);box-shadow:none}
 .muted{color:var(--mut)}.dim{color:var(--dim)}.spacer{flex:1}
 .pill{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:3px 11px;font-size:12px;color:var(--mut)}
-main{flex:1;display:grid;grid-template-columns:1fr 330px;min-height:0}
+main{flex:1;display:grid;grid-template-columns:var(--lw,44px) 1fr 330px;min-height:0}
+main.learn-open{--lw:372px}
 .boards{overflow-y:auto;padding:16px 18px}
+/* Learning sidebar (collapsible left rail) — surfaces the self-learning loop */
+.learn{background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;overflow:hidden}
+.learn-head{display:flex;align-items:center;gap:8px;padding:11px 12px;border-bottom:1px solid var(--line);cursor:pointer;white-space:nowrap;user-select:none}
+.learn-head .lt{font-weight:700;font-size:13px;color:var(--tx)}.learn-head .lt b{color:var(--grn)}
+.learn-head .chev{margin-left:auto;color:var(--mut);font-size:14px}
+main:not(.learn-open) .learn-head{flex-direction:column;gap:12px;padding:14px 0;height:100%;border-bottom:none;justify-content:flex-start}
+main:not(.learn-open) .learn-head .lt{writing-mode:vertical-rl;transform:rotate(180deg);letter-spacing:.6px}
+main:not(.learn-open) .learn-head .chev{margin:0}
+main:not(.learn-open) .learn-body{display:none}
+.learn-body{overflow-y:auto;padding:10px 12px 26px;flex:1}
+.lsum{font-size:11.5px;color:var(--mut);line-height:1.5;margin-bottom:13px}.lsum b{color:var(--grn)}
+.lsec{margin-bottom:17px}
+.lsec>h3{font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--dim);margin:0 0 7px;display:flex;align-items:center;gap:6px}
+.lsel{background:var(--card);color:var(--tx);border:1px solid var(--line);border-radius:6px;font:inherit;font-size:11px;padding:2px 4px;margin-left:auto;cursor:pointer;outline:none}
+.lcard{background:var(--card);border:1px solid var(--line);border-radius:9px;padding:8px 10px;margin-bottom:7px}
+.lcard .lc-h{display:flex;align-items:center;gap:7px;font-size:12px;margin-bottom:5px}
+.lcard .lc-h .nm{font-weight:600;color:var(--tx)}
+.lcard .lc-h .mut{color:var(--mut);font-size:10.5px;margin-left:auto}
+.lles{font-size:11.5px;color:var(--mut);line-height:1.45;padding:5px 0;border-top:1px solid var(--line)}
+.lles:first-child{border-top:none}
+.lles .sc{display:inline-block;font-size:9px;color:var(--dim);border:1px solid var(--line);border-radius:8px;padding:0 5px;margin-right:5px;vertical-align:1px;text-transform:uppercase;letter-spacing:.4px}
+.lguard{font-size:11px;color:var(--mut);line-height:1.42;padding:3px 0 3px 13px;position:relative}
+.lguard:before{content:"";position:absolute;left:3px;top:9px;width:4px;height:4px;border-radius:50%;background:var(--grn)}
+.ltask{font-size:9px;color:var(--dim);text-transform:uppercase;letter-spacing:.5px;margin:5px 0 2px}
+.lstat{display:inline-block;font-size:10.5px;color:var(--mut);margin-right:10px}
+.lstat b{color:var(--tx)}.lstat.bad b{color:var(--red)}.lstat.good b{color:var(--grn)}
+.lchart{margin-top:4px}.lchart svg{display:block;width:100%;height:42px}
+.lbadge{font-size:8.5px;color:var(--grn);border:1px solid #1d4a44;border-radius:8px;padding:1px 6px;text-transform:none;letter-spacing:0}
+.lempty{font-size:11px;color:var(--dim);font-style:italic;padding:4px 0}
 .proj{background:var(--panel);border:1px solid var(--line);border-radius:14px;margin-bottom:16px;overflow:hidden}
 .proj-h{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);background:#0e1421}
 .proj-h .pname{font-family:'Sora',ui-sans-serif,sans-serif;font-weight:700;font-size:15px}
@@ -145,6 +175,12 @@ aside h2{font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;color:va
   <span class="pill"><span id="nproj">0</span> projects · <span id="nsess">0</span> live · <span id="ntask">0</span> cards</span>
 </header>
 <main>
+  <section class="learn" id="learn">
+    <div class="learn-head" id="learnToggle" title="Learning — lessons, per-LLM reliability, baked-in guardrails">
+      <span class="lt">🧠 <b>Learning</b></span><span class="chev" id="learnChev">›</span>
+    </div>
+    <div class="learn-body" id="learnBody"></div>
+  </section>
   <div class="boards" id="boards"><div class="empty big">no projects yet — agents register a project on connect</div></div>
   <aside>
     <h2>Live feed</h2>
@@ -492,6 +528,62 @@ $('#send').onclick=async()=>{const t=$('#text').value.trim();if(!t)return;
 $('#text').addEventListener('keydown',e=>{if(e.key==='Enter')$('#send').click();});
 fetch('/recent?limit=40').then(r=>r.json()).then(d=>(d.messages||[]).forEach(m=>addMsg(m,false))).catch(()=>{});
 $('#hub').textContent=location.host;
+/* ---- Learning sidebar: the self-learning loop, surfaced ---- */
+const LGRN='#2dd4bf',LRED='#ef6a6a';
+// tiny inline-SVG charts (no library) — match the flow view's hand-rolled SVG approach
+function lcLine(pts,key,opt){opt=opt||{};const w=300,h=42,pad=4,color=opt.color||LGRN;if(!pts||!pts.length)return '';
+  const ys=pts.map(p=>+p[key]||0),max=Math.max(1e-6,...ys),n=pts.length;
+  const X=i=>pad+(n<=1?(w-2*pad)/2:i*(w-2*pad)/(n-1)),Y=v=>h-pad-(v/max)*(h-2*pad);
+  const pl=pts.map((p,i)=>`${X(i).toFixed(1)},${Y(+p[key]||0).toFixed(1)}`).join(' ');
+  return `<svg viewBox="0 0 ${w} ${h}" preserveAspectRatio="none">`+
+    (opt.fill?`<polygon points="${pad},${h-pad} ${pl} ${X(n-1).toFixed(1)},${h-pad}" fill="${color}" opacity=".13"/>`:'')+
+    `<polyline points="${pl}" fill="none" stroke="${color}" stroke-width="1.5" stroke-linejoin="round"/>`+
+    (n===1?`<circle cx="${X(0).toFixed(1)}" cy="${Y(ys[0]).toFixed(1)}" r="2.2" fill="${color}"/>`:'')+`</svg>`;}
+function lcBars(pts,key,opt){opt=opt||{};const w=300,h=42,pad=4,color=opt.color||LGRN;if(!pts||!pts.length)return '';
+  const ys=pts.map(p=>+p[key]||0),max=Math.max(1e-6,...ys),n=pts.length,gap=(w-2*pad)/n,bw=gap*0.68;
+  return `<svg viewBox="0 0 ${w} ${h}" preserveAspectRatio="none">`+pts.map((p,i)=>{const v=+p[key]||0,bh=(v/max)*(h-2*pad),x=pad+i*gap+(gap-bw)/2;
+    return `<rect x="${x.toFixed(1)}" y="${(h-pad-bh).toFixed(1)}" width="${bw.toFixed(1)}" height="${Math.max(0.5,bh).toFixed(1)}" rx="1" fill="${color}" opacity=".75"/>`;}).join('')+`</svg>`;}
+let LEARN=null,learnProj=localStorage.getItem('abLearnProj')||'';
+let learnOpen=localStorage.getItem('abLearnOpen')==='1';
+function applyLearnState(){document.querySelector('main').classList.toggle('learn-open',learnOpen);$('#learnChev').textContent=learnOpen?'‹':'›';}
+function renderLearnBody(){const el=$('#learnBody');if(!el)return;if(!LEARN){el.innerHTML='<div class="lempty">loading…</div>';return;}
+  const L=LEARN,t=L.totals||{};
+  let h=`<div class="lsum">Trantor has recorded <b>${t.lessons||0}</b> lessons and baked <b>${t.guardrails||0}</b> guardrails into model prompts. Across <b>${t.turns||0}</b> crew turns the failure rate is <b>${((t.failRate||0)*100).toFixed(1)}%</b> — self-healing as fixes compound.</div>`;
+  // Lessons (project filter; lifetime also shows per-agent lessons)
+  const projOpts=['<option value="">All projects (lifetime)</option>'].concat((L.lessons.projects||[]).map(p=>`<option value="${esc(p)}"${p===learnProj?' selected':''}>${esc(p)}</option>`)).join('');
+  h+=`<div class="lsec"><h3>Lessons <select class="lsel" id="lprojSel">${projOpts}</select></h3>`;
+  const lessons=learnProj?(L.lessons.byProject[learnProj]||[]):(L.lessons.global||[]);
+  if(!lessons.length)h+=`<div class="lempty">no lessons recorded for this scope yet</div>`;
+  else h+=lessons.slice(0,40).map(l=>`<div class="lles"><span class="sc">${esc(l.scope)}</span>${esc(l.text)}</div>`).join('');
+  if(!learnProj)for(const[ag,arr]of Object.entries(L.lessons.byAgent||{}))h+=`<div class="lles"><span class="sc">${esc(ag)}</span>${esc(arr[0].text)}${arr.length>1?` <span class="dim">+${arr.length-1} more</span>`:''}</div>`;
+  h+=`</div>`;
+  // Per-LLM reliability + progression charts — scoped to the selected project (or all)
+  const scopeLbl=learnProj?` <span class="dim" style="text-transform:none;letter-spacing:0">· ${esc(learnProj)}</span>`:'';
+  const ags=learnProj?(L.agentsByProject[learnProj]||[]):(L.agents||[]);
+  h+=`<div class="lsec"><h3>Per-LLM reliability${scopeLbl}</h3>`;
+  if(!ags.length)h+=`<div class="lempty">no turn telemetry${learnProj?' for this project':''} yet</div>`;
+  for(const a of ags){const fr=(a.failRate*100).toFixed(1);
+    h+=`<div class="lcard"><div class="lc-h">${iconFor(a.agent,14)}<span class="nm">${esc(a.agent)}</span><span class="mut">${a.models.filter(m=>m!=='default').join(', ')||'default'}</span></div>`;
+    h+=`<span class="lstat"><b>${a.turns}</b> turns</span><span class="lstat ${a.failures?'bad':'good'}"><b>${fr}%</b> fail</span>${a.lastFailure?`<span class="lstat">last exit ${a.lastFailure.exit}</span>`:''}`;
+    if((a.series.failRate||[]).length>1)h+=`<div class="lchart"><div class="ltask">fail-rate / day</div>${lcLine(a.series.failRate,'rate',{color:LRED,fill:true})}</div>`;
+    if((a.series.lessons||[]).length>1)h+=`<div class="lchart"><div class="ltask">lessons learned (cumulative)</div>${lcLine(a.series.lessons,'count',{color:LGRN,fill:true})}</div>`;
+    h+=`</div>`;}
+  h+=`</div>`;
+  // Baked-in guardrails per model + savings chart — guardrails are global; savings scoped to the project
+  h+=`<div class="lsec"><h3>Baked-in improvements${scopeLbl} <span class="lbadge">auto-injected into prompts</span></h3>`;
+  const gm=(learnProj?(L.modelsByProject[learnProj]||[]):(L.models||[])).filter(m=>m.guardrailCount>0);
+  if(!gm.length)h+=`<div class="lempty">no guardrailed models${learnProj?' used in this project':''} yet</div>`;
+  for(const m of gm){h+=`<div class="lcard"><div class="lc-h"><span class="nm">${esc(m.model)}</span>${m.saved_usd?`<span class="mut">$${m.saved_usd} saved · ${m.calls} calls</span>`:''}</div>`;
+    for(const[task,arr]of Object.entries(m.guardrails||{})){h+=`<div class="ltask">${esc(task)}</div>`;for(const g of arr)h+=`<div class="lguard">${esc(g)}</div>`;}
+    if((m.series.saved||[]).length>1)h+=`<div class="lchart"><div class="ltask">savings / day</div>${lcBars(m.series.saved,'saved',{color:LGRN})}</div>`;
+    h+=`</div>`;}
+  h+=`</div>`;
+  el.innerHTML=h;
+  const ps=$('#lprojSel');if(ps)ps.onchange=()=>{learnProj=ps.value;localStorage.setItem('abLearnProj',learnProj);renderLearnBody();};}
+async function learn(){try{LEARN=await (await fetch('/learning')).json();if(learnOpen)renderLearnBody();}catch(_){}}
+$('#learnToggle').onclick=()=>{learnOpen=!learnOpen;localStorage.setItem('abLearnOpen',learnOpen?'1':'0');applyLearnState();if(learnOpen)renderLearnBody();};
+applyLearnState();learn();setInterval(learn,20000);
+
 render();setInterval(render,2500);stream();
 // Self-heal after the laptop sleeps / the tab is backgrounded: browser timers and the SSE
 // stream get suspended and don't reliably resume, so the board freezes on stale data. The