@orquentra/codebuddy 2.8.0 → 2.9.0

package/dist/{main-QUASSFP7.js → main-YJKSYFPT.js}

@@ -4,7 +4,7 @@ import {
 } from "./chunk-UK6XTS2Y.js";
 import {
   runPreToolHookCommand
-} from "./chunk-EJQVGFH2.js";
+} from "./chunk-ENKDFLOO.js";
 import {
   failSoft,
   readHookInput,
@@ -65,9 +65,10 @@ import {
   telemetryBlocked,
   telemetryStatePath,
   telemetryUrl,
+  traceCliCommand,
   watchRepository,
   writeTelemetryState
-} from "./chunk-6DONJW3W.js";
+} from "./chunk-2WH2Q4TA.js";
 import {
   DEFAULT_ZVEC_MODEL,
   buildZvecIndex,
@@ -90,7 +91,7 @@ import {
   runResetHook,
   runStageHook,
   runSyncHook
-} from "./chunk-ZNLSCV3J.js";
+} from "./chunk-F4BJ3DXW.js";
 import {
   SessionCapsuleLedger,
   detectTestCommand,
@@ -100,7 +101,7 @@ import {
   parseTraceLines,
   readTraces,
   tracePath
-} from "./chunk-XL2HLACE.js";
+} from "./chunk-YN7TEIUH.js";
 import {
   hookRoot
 } from "./chunk-TGFTKWOR.js";
@@ -116,11 +117,11 @@ import {
   pingDatabase,
   runDoctor,
   runMigrations
-} from "./chunk-NY2YXP3R.js";
+} from "./chunk-QN76UJP7.js";
 import {
   MemoryFileStore,
   VERSION
-} from "./chunk-6KGYAFG7.js";
+} from "./chunk-SRA4MDVG.js";
 import {
   computeFactHash,
   generateEntityId
@@ -1199,7 +1200,7 @@ th.n { text-align: right; }
 .chip { display: inline-block; font: 600 10px var(--mono); text-transform: uppercase; letter-spacing: .06em; padding: 2px 6px; border-radius: 4px; }
 .chip.recall { background: var(--recall-soft); color: var(--recall); }
 .chip.tool { background: var(--tool-soft); color: var(--tool); }
-.chip.capture, .chip.sync, .chip.guard, .chip.kw { background: var(--line); color: var(--capture); }
+.chip.capture, .chip.sync, .chip.guard, .chip.cli, .chip.kw { background: var(--line); color: var(--capture); }
 .chip.err { background: var(--bad-soft); color: var(--bad); }
 .feed { display: grid; gap: 10px; max-height: 520px; overflow: auto; }
 .prompt { border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; }
@@ -3431,101 +3432,174 @@ var ADMIN_HTML = `<!doctype html>
 <title>CodeBuddy Usage</title>
 <style>
 :root {
-  --bg: #f4f4f2; --panel: #fcfcfb; --fg: #0b0b0b; --muted: #52514e; --line: #e2e1dc;
-  --bar: #2a78d6; --bar-soft: #e3edfa; --bad: #b42318;
+  --bg: #f4f4f2; --panel: #fcfcfb; --fg: #0b0b0b; --muted: #52514e; --faint: #8a8984; --line: #e4e3de;
+  --bar: #2a78d6; --bar-soft: #e3edfa; --hook: #eb6834; --cli: #1baf7a;
+  --good: #0a7d0a; --bad: #c23030; --bad-soft: #fbeaea;
   --sans: ui-sans-serif, -apple-system, "Segoe UI", Roboto, sans-serif;
   --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
 }
 @media (prefers-color-scheme: dark) { :root {
-  --bg: #121211; --panel: #1a1a19; --fg: #f0efec; --muted: #c3c2b7; --line: #2e2e2b;
-  --bar: #3987e5; --bar-soft: #1d2b3d; --bad: #f97066; color-scheme: dark } }
+  --bg: #111110; --panel: #1a1a19; --fg: #f0efec; --muted: #c3c2b7; --faint: #8f8e86; --line: #2e2e2b;
+  --bar: #3987e5; --bar-soft: #1d2b3d; --hook: #d95926; --cli: #199e70;
+  --good: #3fbf3f; --bad: #f07070; --bad-soft: #3a1a1a; color-scheme: dark } }
 * { box-sizing: border-box; }
 body { margin: 0; background: var(--bg); color: var(--fg); font: 14px/1.5 var(--sans); }
-.wrap { max-width: 1200px; margin: 0 auto; padding: 20px 16px 48px; display: grid; gap: 16px; }
+a { color: inherit; }
+.wrap { max-width: 1240px; margin: 0 auto; padding: 0 16px 56px; display: grid; gap: 16px; }
 .wrap > * { min-width: 0; }
-header { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
-h1 { font-size: 20px; margin: 0; letter-spacing: -.01em; }
-h1 small { font: 500 13px var(--mono); color: var(--muted); margin-left: 8px; }
-h2 { font-size: 13px; margin: 0 0 10px; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 600; }
+.top { position: sticky; top: 0; z-index: 5; background: color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
+.bar-inner { max-width: 1240px; margin: 0 auto; padding: 12px 16px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; }
+.brand { display: flex; align-items: center; gap: 10px; font-weight: 650; font-size: 16px; letter-spacing: -.01em; }
+.mark { width: 22px; height: 22px; border-radius: 6px; background: var(--bar); display: grid; place-items: center; color: #fff; font: 700 12px var(--mono); }
+.updated { font: 12px var(--mono); color: var(--faint); }
+.tabs { display: flex; gap: 4px; }
+.tabs a { text-decoration: none; color: var(--muted); font-weight: 500; font-size: 13px; padding: 6px 10px; border-radius: 7px; }
+.tabs a[aria-current="page"] { background: var(--panel); color: var(--fg); box-shadow: inset 0 0 0 1px var(--line); }
+.tabs a:focus-visible, .seg button:focus-visible, .btn:focus-visible, input:focus-visible, th button:focus-visible, tr.link:focus-visible { outline: 2px solid var(--bar); outline-offset: 1px; }
 .spacer { flex: 1; }
 .seg { display: inline-flex; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: var(--panel); }
-.seg button { border: 0; background: none; color: var(--muted); font: 500 12px var(--sans); padding: 6px 12px; cursor: pointer; }
+.seg button { border: 0; background: none; color: var(--muted); font: 500 12px var(--sans); padding: 6px 11px; cursor: pointer; }
 .seg button + button { border-left: 1px solid var(--line); }
 .seg button[aria-pressed="true"] { background: var(--fg); color: var(--bg); }
-.seg button:focus-visible { outline: 2px solid var(--bar); outline-offset: -2px; }
-.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
-.kpi { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; }
+h2 { font-size: 12px; margin: 0; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-weight: 600; }
+.head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 12px; margin-bottom: 12px; }
+.head .note { font-size: 12px; color: var(--faint); }
+.hero { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(190px, 100%), 1fr)); gap: 12px; padding-top: 16px; }
+.kpi { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; }
 .kpi .label { font-size: 12px; color: var(--muted); }
-.kpi .value { font: 600 28px/1.2 var(--mono); font-variant-numeric: tabular-nums; margin-top: 4px; }
-.kpi .sub { font-size: 12px; color: var(--muted); margin-top: 2px; }
-.panel { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; min-width: 0; position: relative; }
-.cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; }
-.chart svg { display: block; width: 100%; height: 180px; }
-.chart rect.hit { fill: transparent; }
-.chart rect.hit:hover + rect.mark, .chart rect.mark:hover { opacity: .75; }
-svg text { fill: var(--muted); font: 11px var(--mono); }
-.tip { position: absolute; pointer-events: none; background: var(--fg); color: var(--bg); font: 12px var(--mono); padding: 4px 8px; border-radius: 6px; white-space: nowrap; display: none; z-index: 2; }
-.rows { display: grid; gap: 6px; }
-.row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; font-size: 13px; }
-.row .track { grid-column: 1 / -1; height: 6px; background: var(--bar-soft); border-radius: 3px; }
-.row .fill { height: 6px; background: var(--bar); border-radius: 3px; }
+.kpi .value { font: 650 32px/1.15 var(--mono); font-variant-numeric: tabular-nums; margin-top: 6px; letter-spacing: -.02em; }
+.kpi .sub { font-size: 12px; color: var(--muted); margin-top: 4px; }
+.up { color: var(--good); font-weight: 600; }
+.down { color: var(--bad); font-weight: 600; }
+.panel { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 16px; min-width: 0; }
+.grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr)); gap: 16px; }
+.grid3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); gap: 16px; }
+.chart svg { display: block; width: 100%; height: 190px; overflow: visible; }
+svg text { fill: var(--faint); font: 11px var(--mono); }
+.hit { fill: transparent; cursor: crosshair; }
+.hit:hover { fill: color-mix(in srgb, var(--fg) 6%, transparent); }
+.tip { position: absolute; pointer-events: none; background: var(--fg); color: var(--bg); font: 12px var(--mono); padding: 5px 8px; border-radius: 6px; white-space: nowrap; display: none; z-index: 10; }
+.rows { display: grid; gap: 8px; }
+.row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 12px; font-size: 13px; }
+.row .track { grid-column: 1 / -1; height: 8px; background: var(--bar-soft); border-radius: 4px; overflow: hidden; }
+.row .fill { height: 8px; background: var(--bar); border-radius: 4px; }
 .row .n { font-family: var(--mono); font-variant-numeric: tabular-nums; color: var(--muted); }
+.funnel .row { font-size: 14px; }
+.funnel .track { height: 22px; border-radius: 6px; }
+.funnel .fill { height: 22px; border-radius: 6px; }
 .scroll { overflow-x: auto; }
 table { width: 100%; border-collapse: collapse; font-size: 13px; }
 th { text-align: left; font: 600 11px var(--sans); text-transform: uppercase; letter-spacing: .06em; color: var(--muted); padding: 6px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; }
-td { padding: 6px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; }
+th button { all: unset; cursor: pointer; }
+th button::after { content: attr(data-dir); margin-left: 4px; color: var(--faint); }
+td { padding: 7px 8px; border-bottom: 1px solid var(--line); white-space: nowrap; }
 tr:last-child td { border-bottom: 0; }
 td.n, th.n { text-align: right; font-family: var(--mono); font-variant-numeric: tabular-nums; }
+tr.link { cursor: pointer; }
+tr.link:hover td { background: var(--bar-soft); }
+.inline { display: inline-block; height: 6px; background: var(--bar); border-radius: 3px; vertical-align: middle; margin-left: 8px; }
+.heat td { text-align: center; font: 12px var(--mono); padding: 6px 4px; border: 2px solid var(--panel); border-radius: 6px; min-width: 44px; }
+.heat td.lab { text-align: left; color: var(--muted); font-family: var(--sans); white-space: nowrap; }
+.heat td.empty { background: transparent; color: var(--faint); }
 .bad { color: var(--bad); }
 .muted { color: var(--muted); }
 .mono { font-family: var(--mono); }
-.btn { border: 1px solid var(--line); background: var(--panel); color: var(--fg); font: 500 12px var(--sans); padding: 6px 12px; border-radius: 8px; cursor: pointer; }
-.btn:focus-visible { outline: 2px solid var(--bar); outline-offset: 2px; }
-.users { max-height: 560px; overflow: auto; }
-.users thead th { position: sticky; top: 0; background: var(--panel); }
-.empty { padding: 32px 16px; text-align: center; color: var(--muted); }
+.empty-state { padding: 36px 16px; text-align: center; color: var(--muted); }
+.toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 12px; }
+input[type="search"] { font: 13px var(--sans); padding: 7px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); color: var(--fg); min-width: 0; flex: 1 1 200px; }
+.btn { border: 1px solid var(--line); background: var(--panel); color: var(--fg); font: 500 12px var(--sans); padding: 7px 12px; border-radius: 8px; cursor: pointer; text-decoration: none; }
+.chips { display: flex; flex-wrap: wrap; gap: 6px; }
+.chip { display: inline-flex; align-items: center; gap: 6px; font: 600 11px var(--mono); padding: 2px 8px; border-radius: 999px; background: var(--bar-soft); color: var(--fg); }
+.sw { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
+.sessions { display: grid; gap: 6px; max-height: 520px; overflow: auto; }
+.session { all: unset; display: grid; gap: 2px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; font-size: 12px; }
+.session[aria-pressed="true"] { border-color: var(--bar); box-shadow: inset 3px 0 0 var(--bar); }
+.session:focus-visible { outline: 2px solid var(--bar); }
+.split { display: grid; grid-template-columns: minmax(220px, 300px) minmax(0, 1fr); gap: 16px; }
+@media (max-width: 820px) { .split { grid-template-columns: 1fr; } .wf .step { grid-template-columns: 120px 52px minmax(0, 1fr) 56px; } }
+.wf { display: grid; gap: 3px; font-size: 12px; }
+.wf .step { display: grid; grid-template-columns: 170px 64px minmax(0, 1fr) 70px; gap: 10px; align-items: center; }
+.wf .lane { position: relative; height: 14px; background: var(--bg); border-radius: 3px; }
+.wf .seg-bar { position: absolute; top: 2px; height: 10px; min-width: 3px; border-radius: 3px; }
+.wf .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: var(--mono); }
+.wf .at { font-family: var(--mono); color: var(--faint); text-align: right; }
+.wf .t { text-align: right; font-family: var(--mono); color: var(--muted); }
+.legend { display: flex; gap: 14px; font-size: 12px; color: var(--muted); margin-bottom: 10px; flex-wrap: wrap; }
+.legend span { display: inline-flex; align-items: center; gap: 6px; }
+footer { font-size: 12px; color: var(--faint); }
+[hidden] { display: none !important; }
 </style>
 </head>
 <body>
+<div class="top"><div class="bar-inner">
+  <div class="brand"><span class="mark">cb</span>CodeBuddy usage</div>
+  <nav class="tabs" aria-label="Views">
+    <a href="#overview" data-view="overview">Overview</a>
+    <a href="#users" data-view="users">Users</a>
+    <a href="#events" data-view="events">Events</a>
+  </nav>
+  <span class="spacer"></span>
+  <span class="updated" id="updated">loading\u2026</span>
+  <div class="seg" role="group" aria-label="Time range" id="range">
+    <button data-days="7">7d</button><button data-days="30" aria-pressed="true">30d</button><button data-days="90">90d</button><button data-days="365">1y</button>
+  </div>
+</div></div>
+
 <div class="wrap">
-  <header>
-    <h1>CodeBuddy usage<small id="updated"></small></h1>
-    <span class="spacer"></span>
-    <div class="seg" role="group" aria-label="Time range" id="range">
-      <button data-days="7">7 days</button>
-      <button data-days="30" aria-pressed="true">30 days</button>
-      <button data-days="90">90 days</button>
-      <button data-days="365">1 year</button>
+  <section id="view-overview">
+    <div class="hero" id="hero" aria-label="Headline numbers"></div>
+    <div class="grid2" style="margin-top:16px">
+      <section class="panel"><div class="head"><h2>Total installs</h2><span class="note">all-time, by first-seen day</span></div><div class="chart" id="cumulative"></div></section>
+      <section class="panel"><div class="head"><h2>Daily active installs</h2><span class="note">installs that sent any event</span></div><div class="chart" id="active"></div></section>
     </div>
-  </header>
-  <section class="kpis" id="kpis" aria-label="Summary"></section>
-  <div class="cols">
-    <section class="panel"><h2>Daily active installs</h2><div class="chart" id="active"></div></section>
-    <section class="panel"><h2>npm downloads per day</h2><div class="chart" id="npm"></div></section>
-  </div>
-  <section class="panel"><h2>Feature usage</h2><div class="scroll" id="features"></div></section>
-  <div class="cols">
-    <section class="panel"><h2>Agent clients</h2><div class="rows" id="clients"></div></section>
-    <section class="panel"><h2>Versions</h2><div class="rows" id="versions"></div></section>
-    <section class="panel"><h2>Platforms</h2><div class="rows" id="platforms"></div></section>
-  </div>
-  <section class="panel">
-    <div style="display:flex;align-items:center;gap:12px;margin-bottom:10px"><h2 style="margin:0">Users</h2><span class="muted" id="userCount" style="font-size:12px"></span><span class="spacer"></span><button class="btn" id="csv">Download CSV</button></div>
-    <div class="scroll users" id="users"></div>
+    <div class="grid2" style="margin-top:16px">
+      <section class="panel"><div class="head"><h2>Activation</h2><span class="note">installs active in range reaching each step</span></div><div class="rows funnel" id="funnel"></div></section>
+      <section class="panel"><div class="head"><h2>Retention by weekly cohort</h2><span class="note">share of each week's new installs active in later weeks</span></div><div class="scroll" id="cohorts"></div></section>
+    </div>
+    <section class="panel" style="margin-top:16px"><div class="head"><h2>Feature usage</h2><span class="note">MCP tools, hook steps (recall, capture\u2026) and CLI commands</span></div><div class="scroll" id="features"></div></section>
+    <div class="grid3" style="margin-top:16px">
+      <section class="panel"><div class="head"><h2>Agent clients</h2></div><div class="rows" id="clients"></div></section>
+      <section class="panel"><div class="head"><h2>Versions</h2></div><div class="rows" id="versions"></div></section>
+      <section class="panel"><div class="head"><h2>Platforms</h2></div><div class="rows" id="platforms"></div></section>
+    </div>
+    <section class="panel" style="margin-top:16px"><div class="head"><h2>npm downloads per day</h2><span class="note" id="npmNote"></span></div><div class="chart" id="npm"></div></section>
+  </section>
+
+  <section id="view-users" class="panel" style="margin-top:16px" hidden>
+    <div class="toolbar">
+      <h2>Users</h2><span class="muted" id="userCount" style="font-size:12px"></span><span class="spacer"></span>
+      <input type="search" id="userSearch" placeholder="Filter by id, client, version, platform\u2026" aria-label="Filter users">
+      <button class="btn" id="csv">Download CSV</button>
+    </div>
+    <div class="scroll" id="users"></div>
   </section>
-  <section class="panel"><h2>Latest events</h2><div class="scroll" id="recent"></div></section>
-  <p class="muted" style="margin:0;font-size:12px">Anonymous telemetry from installs that did not opt out: random install ids, tool names, timings and versions. No prompts, code, paths or repository names are collected. Shares count each install once, from its latest batch.</p>
+
+  <section id="view-install" style="margin-top:16px" hidden></section>
+
+  <section id="view-events" class="panel" style="margin-top:16px" hidden>
+    <div class="toolbar"><h2>Latest events</h2><span class="spacer"></span><div class="chips" id="kindFilter"></div></div>
+    <div class="scroll" id="recent"></div>
+  </section>
+
+  <footer>Anonymous telemetry from installs that did not opt out: random install ids, tool and command names, timings, versions. No prompts, code, paths or repository names are collected. Shares count each install once, from its latest batch.</footer>
 </div>
-<div class="tip" id="tip"></div>
+<div class="tip" id="tip" role="status"></div>
 <script>
 (function () {
   var days = 30;
-  // Works at "/" and under a proxy mount such as "/admin" (with or without a trailing slash).
-  var base = location.pathname.replace(/\\/?$/, "/");
-  var summary = null;
-  var npm = null;
+  var summary = null, npm = null, install = null;
+  var userSort = { key: "lastSeen", dir: -1 };
+  var kindShown = "all";
+  var selectedSession = null;
+  var path = location.pathname;
+  var base = path.charAt(path.length - 1) === "/" ? path : path + "/";
   var tip = document.getElementById("tip");
+  var NL = String.fromCharCode(10);
+  var KIND_COLOR = { tool: "var(--bar)", cli: "var(--cli)" };
+  function kindColor(kind) { return KIND_COLOR[kind] || "var(--hook)"; }
+  function kindGroup(kind) { return kind === "tool" ? "MCP tool" : kind === "cli" ? "CLI command" : "hook step"; }
 
+  function $(id) { return document.getElementById(id); }
   function esc(value) {
     return String(value == null ? "" : value).replace(/[&<>"']/g, function (c) {
       return { "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" }[c];
@@ -3533,36 +3607,57 @@ td.n, th.n { text-align: right; font-family: var(--mono); font-variant-numeric:
   }
   function num(n) { return Math.round(n).toLocaleString(); }
   function compact(n) { return n >= 1e6 ? (n / 1e6).toFixed(1) + "M" : n >= 1e4 ? (n / 1e3).toFixed(1) + "k" : num(n); }
-  function pct(n) { return (n * 100).toFixed(n < 0.1 ? 1 : 0) + "%"; }
-  function ms(n) { return n >= 1000 ? (n / 1000).toFixed(1) + " s" : Math.round(n) + " ms"; }
+  function pct(n) { return (n * 100).toFixed(n > 0 && n < 0.1 ? 1 : 0) + "%"; }
+  function plural(n, word) { return num(n) + " " + word + (n === 1 ? "" : "s"); }
+  function offset(n) { var s = Math.round(n / 1000); return "+" + (s >= 60 ? Math.floor(s / 60) + "m " + (s % 60) + "s" : s + "s"); }
+  function ms(n) { return n >= 60000 ? (n / 60000).toFixed(1) + " min" : n >= 1000 ? (n / 1000).toFixed(1) + " s" : Math.round(n) + " ms"; }
+  function date(iso) { return new Date(iso).toLocaleDateString(undefined, { month: "short", day: "numeric" }); }
+  function ago(iso) {
+    var s = Math.max(0, (Date.now() - Date.parse(iso)) / 1000);
+    return s < 60 ? "just now" : s < 3600 ? Math.floor(s / 60) + "m ago" : s < 86400 ? Math.floor(s / 3600) + "h ago" : Math.floor(s / 86400) + "d ago";
+  }
+  function get(url) { return fetch(base + url).then(function (r) { return r.ok ? r.json() : null; }); }
 
   function kpi(label, value, sub) {
-    return '<div class="kpi"><div class="label">' + esc(label) + '</div><div class="value">' + esc(value) +
-      '</div><div class="sub">' + esc(sub || "") + "</div></div>";
+    return '<div class="kpi"><div class="label">' + esc(label) + '</div><div class="value">' + esc(value) + '</div><div class="sub">' + (sub || "") + "</div></div>";
+  }
+  function delta(now, before) {
+    if (!before) return now ? '<span class="up">\u25B2 new</span> vs previous 7 days' : "no activity yet";
+    var change = (now - before) / before;
+    return '<span class="' + (change >= 0 ? "up" : "down") + '">' + (change >= 0 ? "\u25B2 " : "\u25BC ") + pct(Math.abs(change)) + "</span> vs previous 7 days";
   }
 
-  /** Bars of one measure over days; hover shows the exact value. */
-  function bars(points, label) {
-    if (!points.length) return '<div class="empty">No data yet.</div>';
-    var w = 600, h = 180, top = 10, bottom = 22, left = 36;
+  /** Bars or a filled line over days, one measure; every point has a hover target. */
+  /** Draw into a container at its own pixel width, so labels never stretch. */
+  function draw(id, points, label, line) {
+    var el = $(id);
+    if (el) el.innerHTML = chart(points, label, line, el.clientWidth);
+  }
+  function chart(points, label, line, width) {
+    if (!points.length) return '<div class="empty-state">No data yet.</div>';
+    var w = Math.max(280, width || 640), h = 190, top = 10, bottom = 22, left = 40, plot = h - top - bottom;
     var max = Math.max.apply(null, points.map(function (p) { return p.value; }).concat([1]));
     var step = (w - left) / points.length;
-    var bw = Math.max(1, step - 2);
+    var y = function (v) { return top + plot * (1 - v / max); };
     var out = '<svg viewBox="0 0 ' + w + " " + h + '" preserveAspectRatio="none" role="img" aria-label="' + esc(label) + '">';
     [0, 0.5, 1].forEach(function (f) {
-      var y = top + (h - top - bottom) * (1 - f);
-      out += '<line x1="' + left + '" x2="' + w + '" y1="' + y + '" y2="' + y + '" stroke="var(--line)" stroke-width="1"/>';
-      out += '<text x="' + (left - 6) + '" y="' + (y + 4) + '" text-anchor="end">' + esc(compact(max * f)) + "</text>";
+      out += '<line x1="' + left + '" x2="' + w + '" y1="' + y(max * f) + '" y2="' + y(max * f) + '" stroke="var(--line)"/>';
+      out += '<text x="' + (left - 6) + '" y="' + (y(max * f) + 4) + '" text-anchor="end">' + esc(compact(max * f)) + "</text>";
     });
+    if (line) {
+      var pts = points.map(function (p, i) { return (left + i * step + step / 2).toFixed(1) + "," + y(p.value).toFixed(1); });
+      out += '<path d="M' + (left + step / 2) + "," + (top + plot) + " L" + pts.join(" L") + " L" + (left + (points.length - 0.5) * step) + "," + (top + plot) + ' Z" fill="var(--bar-soft)"/>';
+      out += '<polyline points="' + pts.join(" ") + '" fill="none" stroke="var(--bar)" stroke-width="2" vector-effect="non-scaling-stroke" stroke-linejoin="round"/>';
+    }
     points.forEach(function (p, i) {
-      var bh = (h - top - bottom) * (p.value / max);
-      var x = left + i * step + 1;
-      var tipText = esc(p.date + " \xB7 " + num(p.value) + " " + label);
-      out += '<rect class="hit" x="' + (left + i * step) + '" y="' + top + '" width="' + step + '" height="' + (h - top - bottom) + '" data-tip="' + tipText + '"/>';
-      out += '<rect class="mark" x="' + x + '" y="' + (h - bottom - bh) + '" width="' + bw + '" height="' + bh + '" rx="' + Math.min(2, bw / 2) + '" fill="var(--bar)" data-tip="' + tipText + '"/>';
+      var x = left + i * step;
+      if (!line) {
+        var bh = plot * (p.value / max), bw = Math.max(1, step - 2);
+        out += '<rect x="' + (x + 1) + '" y="' + (top + plot - bh) + '" width="' + bw + '" height="' + bh + '" rx="' + Math.min(2, bw / 2) + '" fill="var(--bar)"/>';
+      }
+      out += '<rect class="hit" x="' + x + '" y="' + top + '" width="' + step + '" height="' + plot + '" data-tip="' + esc(p.date + " \xB7 " + num(p.value) + " " + label) + '"/>';
     });
-    var first = points[0].date, last = points[points.length - 1].date;
-    out += '<text x="' + left + '" y="' + (h - 6) + '">' + esc(first) + '</text><text x="' + w + '" y="' + (h - 6) + '" text-anchor="end">' + esc(last) + "</text>";
+    out += '<text x="' + left + '" y="' + (h - 5) + '">' + esc(points[0].date) + '</text><text x="' + w + '" y="' + (h - 5) + '" text-anchor="end">' + esc(points[points.length - 1].date) + "</text>";
     return out + "</svg>";
   }
 
@@ -3570,85 +3665,230 @@ td.n, th.n { text-align: right; font-family: var(--mono); font-variant-numeric:
     if (!items.length) return '<div class="muted">No data yet.</div>';
     return items.slice(0, 8).map(function (item) {
       var share = total ? item.installs / total : 0;
-      return '<div class="row"><span>' + esc(item.label) + '</span><span class="n">' + num(item.installs) + " \xB7 " + pct(share) +
-        '</span><div class="track"><div class="fill" style="width:' + (share * 100).toFixed(1) + '%"></div></div></div>';
+      return '<div class="row"><span>' + esc(item.label) + '</span><span class="n">' + num(item.installs) + " \xB7 " + pct(share) + '</span><div class="track"><div class="fill" style="width:' + (share * 100).toFixed(1) + '%"></div></div></div>';
     }).join("");
   }
 
-  function npmPoints() {
-    if (!npm || !npm.downloads) return [];
-    return npm.downloads.slice(-Math.min(days, 365)).map(function (d) { return { date: d.day, value: d.downloads }; });
+  function renderOverview() {
+    var t = summary.totals;
+    var npm30 = npmTotal(30);
+    $("hero").innerHTML =
+      kpi("Weekly active installs", num(t.wau), delta(t.wau, t.wauPrevious)) +
+      kpi("Total installs", num(t.allTimeInstalls), "+" + num(t.newInRange) + " in the last " + summary.days + " days \xB7 " + num(t.newToday) + " today") +
+      kpi("Week-1 retention", t.week1Retention == null ? "\u2013" : pct(t.week1Retention), t.week1Retention == null ? "needs a cohort older than 7 days" : "new installs active again the next week") +
+      kpi("Agent sessions", compact(t.sessions), num(t.dau) + " installs active today \xB7 " + num(t.mau) + " this month") +
+      kpi("npm downloads \xB7 30 days", npm30 == null ? "\u2013" : num(npm30), npm && npm.error ? esc(npm.error) : num(npmTotal(365) || 0) + " in the last year");
+    draw("cumulative", summary.daily.map(function (d) { return { date: d.date, value: d.totalInstalls }; }), "total installs", true);
+    draw("active", summary.daily.map(function (d) { return { date: d.date, value: d.installs }; }), "active installs", false);
+
+    var active = summary.funnel[0] ? summary.funnel[0].installs : 0;
+    $("funnel").innerHTML = active ? summary.funnel.map(function (step) {
+      var share = active ? step.installs / active : 0;
+      return '<div class="row"><span>' + esc(step.label) + '</span><span class="n">' + num(step.installs) + " \xB7 " + pct(share) + '</span><div class="track"><div class="fill" style="width:' + (share * 100).toFixed(1) + '%"></div></div></div>';
+    }).join("") : '<div class="empty-state">No active installs in this range.</div>';
+
+    var cohorts = summary.cohorts.filter(function (c) { return c.size > 0; });
+    var weeks = summary.cohorts.length;
+    $("cohorts").innerHTML = cohorts.length
+      ? '<table class="heat"><thead><tr><th>Cohort</th><th class="n">Installs</th>' + Array.from({ length: weeks }, function (_, i) { return '<th class="n">W' + i + "</th>"; }).join("") + "</tr></thead><tbody>" +
+        cohorts.map(function (c) {
+          var cells = "";
+          for (var i = 0; i < weeks; i += 1) {
+            var v = c.weeks[i];
+            if (v == null) { cells += '<td class="empty">\xB7</td>'; continue; }
+            var strength = Math.round(12 + v * 88);
+            cells += '<td style="background:color-mix(in oklab, var(--bar) ' + strength + '%, var(--panel));color:' + (v > 0.5 ? "#fff" : "var(--fg)") + '" title="' + esc(c.start + " cohort, week " + i + ": " + pct(v)) + '">' + pct(v) + "</td>";
+          }
+          return '<tr><td class="lab">' + esc(date(c.start)) + '</td><td class="n">' + num(c.size) + "</td>" + cells + "</tr>";
+        }).join("") + "</tbody></table>"
+      : '<div class="empty-state">Cohorts appear once new installs report in.</div>';
+
+    var maxCalls = Math.max.apply(null, summary.features.map(function (f) { return f.calls; }).concat([1]));
+    $("features").innerHTML = summary.features.length
+      ? '<table><thead><tr><th>Feature</th><th class="n">Calls</th><th class="n">Installs</th><th class="n">Median</th><th class="n">p95</th><th class="n">Errors</th></tr></thead><tbody>' +
+        summary.features.map(function (f) {
+          return '<tr><td class="mono">' + esc(f.label) + '<span class="inline" style="width:' + Math.max(2, (f.calls / maxCalls) * 120).toFixed(0) + 'px"></span></td><td class="n">' + num(f.calls) + '</td><td class="n">' + num(f.installs) +
+            '</td><td class="n">' + ms(f.p50ms) + '</td><td class="n">' + ms(f.p95ms) + '</td><td class="n' + (f.errorRate > 0.05 ? " bad" : "") + '">' + pct(f.errorRate) + "</td></tr>";
+        }).join("") + "</tbody></table>"
+      : '<div class="empty-state">No events yet. Installs send a batch at most every 10 minutes.</div>';
+    var installs = summary.versions.reduce(function (sum, v) { return sum + v.installs; }, 0);
+    $("clients").innerHTML = rows(summary.clients, installs);
+    $("versions").innerHTML = rows(summary.versions, installs);
+    $("platforms").innerHTML = rows(summary.platforms, installs);
+    renderNpm();
   }
+
   function npmTotal(n) {
     if (!npm || !npm.downloads) return null;
     return npm.downloads.slice(-n).reduce(function (sum, d) { return sum + d.downloads; }, 0);
   }
+  function renderNpm() {
+    if (!npm) return;
+    if (npm.error) { $("npm").innerHTML = '<div class="empty-state">' + esc(npm.error) + "</div>"; return; }
+    $("npmNote").textContent = npm.package + " \xB7 public npm registry";
+    draw("npm", npm.downloads.slice(-Math.min(days, 365)).map(function (d) { return { date: d.day, value: d.downloads }; }), "downloads", false);
+  }
 
-  function render() {
-    if (!summary) return;
-    var t = summary.totals;
-    var npm30 = npmTotal(30), npm365 = npmTotal(365);
-    document.getElementById("updated").textContent = "updated " + new Date(summary.generatedAt).toLocaleTimeString();
-    document.getElementById("kpis").innerHTML =
-      kpi("Active installs \xB7 7 days", num(t.active7d), num(t.active1d) + " today") +
-      kpi("Active installs \xB7 30 days", num(t.active30d), num(t.newToday) + " new today") +
-      kpi("Installs in range", num(t.installs), num(t.projects) + " projects") +
-      kpi("Agent sessions", num(t.sessions), "in " + summary.days + " days") +
-      kpi("Events", compact(t.events), pct(1 - t.errorRate) + " succeeded") +
-      kpi("Tokens delivered", compact(t.tokensOut), "context sent to agents") +
-      kpi("npm downloads \xB7 30 days", npm30 == null ? "\u2013" : num(npm30), npm365 == null ? (npm && npm.error ? npm.error : "") : num(npm365) + " in the last year");
-    document.getElementById("active").innerHTML = bars(summary.daily.map(function (d) { return { date: d.date, value: d.installs }; }), "active installs");
-    document.getElementById("npm").innerHTML = npm && npm.error ? '<div class="empty">' + esc(npm.error) + "</div>" : bars(npmPoints(), "downloads");
-    document.getElementById("features").innerHTML = summary.features.length
-      ? "<table><thead><tr><th>Feature</th><th class=\\"n\\">Calls</th><th class=\\"n\\">Installs</th><th class=\\"n\\">Median</th><th class=\\"n\\">Errors</th></tr></thead><tbody>" +
-        summary.features.map(function (f) {
-          return "<tr><td class=\\"mono\\">" + esc(f.label) + '</td><td class="n">' + num(f.calls) + '</td><td class="n">' + num(f.installs) +
-            '</td><td class="n">' + ms(f.p50ms) + '</td><td class="n' + (f.errorRate > 0.05 ? " bad" : "") + '">' + pct(f.errorRate) + "</td></tr>";
-        }).join("") + "</tbody></table>"
-      : '<div class="empty">No events yet. Installs send a batch at most every 10 minutes.</div>';
-    var installs = summary.versions.reduce(function (sum, v) { return sum + v.installs; }, 0);
-    document.getElementById("clients").innerHTML = rows(summary.clients, installs);
-    document.getElementById("versions").innerHTML = rows(summary.versions, installs);
-    document.getElementById("platforms").innerHTML = rows(summary.platforms, installs);
-    document.getElementById("userCount").textContent = num(summary.users.length) + " installs seen in " + summary.days + " days";
-    document.getElementById("users").innerHTML = summary.users.length
-      ? "<table><thead><tr><th>Install</th><th>First seen</th><th>Last active</th><th class=\\"n\\">Events</th><th class=\\"n\\">Sessions</th><th class=\\"n\\">Projects</th><th>Client</th><th>Version</th><th>Platform</th><th>Top feature</th></tr></thead><tbody>" +
-        summary.users.map(function (u) {
-          return '<tr><td class="mono">' + esc(u.install) + "</td><td>" + esc(new Date(u.firstSeen).toLocaleDateString()) + "</td><td>" + esc(new Date(u.lastSeen).toLocaleString()) +
-            '</td><td class="n">' + num(u.events) + '</td><td class="n">' + num(u.sessions) + '</td><td class="n">' + num(u.projects) + "</td><td>" + esc(u.client) +
-            '</td><td class="mono">' + esc(u.version) + "</td><td>" + esc(u.platform) + '</td><td class="mono">' + esc(u.topFeature) + "</td></tr>";
+  var USER_COLS = [
+    ["install", "Install"], ["firstSeen", "First seen"], ["lastSeen", "Last active"], ["activeDays", "Active days", 1],
+    ["sessions", "Sessions", 1], ["events", "Events", 1], ["errors", "Errors", 1], ["client", "Client"], ["version", "Version"], ["platform", "Platform"], ["topFeature", "Top feature"]
+  ];
+  function filteredUsers() {
+    var q = $("userSearch").value.trim().toLowerCase();
+    return summary.users.filter(function (u) {
+      return !q || [u.install, u.client, u.version, u.platform, u.topFeature].join(" ").toLowerCase().indexOf(q) !== -1;
+    }).sort(function (a, b) {
+      var x = a[userSort.key], y = b[userSort.key];
+      return (x < y ? -1 : x > y ? 1 : 0) * userSort.dir;
+    });
+  }
+  function renderUsers() {
+    var list = filteredUsers();
+    $("userCount").textContent = num(summary.users.length) + " installs active in the last " + summary.days + " days";
+    $("users").innerHTML = list.length
+      ? "<table><thead><tr>" + USER_COLS.map(function (c) {
+          return "<th" + (c[2] ? ' class="n"' : "") + '><button data-sort="' + c[0] + '" data-dir="' + (userSort.key === c[0] ? (userSort.dir > 0 ? "\u2191" : "\u2193") : "") + '">' + c[1] + "</button></th>";
+        }).join("") + "</tr></thead><tbody>" +
+        list.map(function (u) {
+          return '<tr class="link" tabindex="0" data-install="' + esc(u.install) + '"><td class="mono">' + esc(u.install) + "</td><td>" + esc(date(u.firstSeen)) + "</td><td>" + esc(ago(u.lastSeen)) +
+            '</td><td class="n">' + num(u.activeDays) + '</td><td class="n">' + num(u.sessions) + '</td><td class="n">' + num(u.events) + '</td><td class="n' + (u.errors ? " bad" : "") + '">' + num(u.errors) +
+            "</td><td>" + esc(u.client) + '</td><td class="mono">' + esc(u.version) + "</td><td>" + esc(u.platform) + '</td><td class="mono">' + esc(u.topFeature) + "</td></tr>";
         }).join("") + "</tbody></table>"
-      : '<div class="empty">No users yet.</div>';
-    document.getElementById("recent").innerHTML = summary.recent.length
-      ? "<table><thead><tr><th>Received</th><th>Install</th><th>Kind</th><th>Name</th><th>Client</th><th>Version</th><th class=\\"n\\">Time</th><th>Result</th></tr></thead><tbody>" +
-        summary.recent.map(function (e) {
-          return "<tr><td>" + esc(new Date(e.receivedAt).toLocaleString()) + '</td><td class="mono">' + esc(e.install) + "</td><td>" + esc(e.kind) +
-            '</td><td class="mono">' + esc(e.name) + "</td><td>" + esc(e.client) + '</td><td class="mono">' + esc(e.version) +
-            '</td><td class="n">' + ms(e.ms) + '</td><td class="' + (e.ok ? "" : "bad") + '">' + (e.ok ? "ok" : "error") + "</td></tr>";
+      : '<div class="empty-state">' + (summary.users.length ? "No installs match this filter." : "No users yet.") + "</div>";
+  }
+
+  function renderInstall() {
+    var el = $("view-install");
+    if (!install) { el.innerHTML = '<div class="panel empty-state">Loading\u2026</div>'; return; }
+    if (install.missing) { el.innerHTML = '<div class="panel empty-state">No events for this install in the last 90 days. <a href="#users">Back to users</a></div>'; return; }
+    var errors = install.events.filter(function (e) { return !e.ok; }).length;
+    var perDay = {};
+    install.perDay.forEach(function (d) { perDay[d.date] = d.events; });
+    var points = [];
+    for (var i = 89; i >= 0; i -= 1) {
+      var d = new Date(Date.now() - i * 86400000).toISOString().slice(0, 10);
+      points.push({ date: d, value: perDay[d] || 0 });
+    }
+    if (!selectedSession || !install.sessions.some(function (s) { return s.id === selectedSession; })) selectedSession = install.sessions[0] ? install.sessions[0].id : null;
+    el.innerHTML =
+      '<div class="toolbar"><a class="btn" href="#users">\u2190 Users</a><h2 style="font-size:14px;color:var(--fg);text-transform:none;letter-spacing:0">Install <span class="mono">' + esc(install.install) + "</span></h2>" +
+      '<span class="chips"><span class="chip">' + esc(install.client) + '</span><span class="chip">v' + esc(install.version) + '</span><span class="chip">' + esc(install.platform) + '</span><span class="chip">node ' + esc(install.node) + "</span></span></div>" +
+      '<div class="hero" style="padding-top:0">' + kpi("Events \xB7 90 days", num(install.events.length), errors ? '<span class="bad">' + plural(errors, "error") + "</span>" : "no errors") +
+      kpi("Sessions", num(install.sessions.length), "agent sessions with CodeBuddy") + kpi("Active days", num(install.perDay.length), "in the last 90 days") + kpi("Projects", num(install.projects), "hashed, never named") + "</div>" +
+      '<section class="panel" style="margin-top:16px"><div class="head"><h2>Activity</h2><span class="note">events per day, last 90 days</span></div><div class="chart" id="installActivity"></div></section>' +
+      '<section class="panel" style="margin-top:16px"><div class="head"><h2>Session traces</h2><span class="note">each step ends at its recorded time; bar length is its duration</span></div>' +
+      '<div class="split"><div class="sessions" id="sessionList">' + install.sessions.map(function (s) {
+        return '<button class="session" data-session="' + esc(s.id) + '" aria-pressed="' + (s.id === selectedSession) + '"><strong class="mono">' + esc(s.id === "none" ? "no session id" : s.id.slice(0, 8)) + "</strong>" +
+          '<span class="muted">' + esc(new Date(s.start).toLocaleString()) + " \xB7 " + num(s.events) + " steps" + (s.errors ? ' \xB7 <span class="bad">' + plural(s.errors, "error") + "</span>" : "") + "</span></button>";
+      }).join("") + '</div><div id="waterfall"></div></div></section>';
+    draw("installActivity", points, "events", false);
+    renderWaterfall();
+  }
+
+  function renderWaterfall() {
+    var target = $("waterfall");
+    if (!target || !install) return;
+    var steps = install.events.filter(function (e) { return e.session === selectedSession; })
+      .sort(function (a, b) { return a.ts < b.ts ? -1 : a.ts > b.ts ? 1 : 0; }).slice(-200);
+    if (!steps.length) { target.innerHTML = '<div class="empty-state">Pick a session.</div>'; return; }
+    var start = Math.min.apply(null, steps.map(function (e) { return Date.parse(e.ts) - e.ms; }));
+    var end = Math.max.apply(null, steps.map(function (e) { return Date.parse(e.ts); }));
+    var span = Math.max(1, end - start);
+    target.innerHTML = '<div class="legend"><span><i class="sw" style="background:var(--bar)"></i>MCP tool</span><span><i class="sw" style="background:var(--hook)"></i>hook step</span><span><i class="sw" style="background:var(--cli)"></i>CLI command</span><span class="spacer"></span><span>' + esc(ms(span)) + " total</span></div>" +
+      '<div class="wf">' + steps.map(function (e) {
+        var s = Date.parse(e.ts) - e.ms;
+        var left = ((s - start) / span) * 100, width = Math.max(0.8, (e.ms / span) * 100);
+        return '<div class="step"><span class="name' + (e.ok ? "" : " bad") + '" title="' + esc(kindGroup(e.kind) + ": " + e.name) + '">' + (e.ok ? "" : "\u2715 ") + esc(e.feature) + '</span><span class="at">' + esc(offset(s - start)) + '</span><span class="lane"><span class="seg-bar" style="left:' + left.toFixed(2) + "%;width:" + width.toFixed(2) + "%;background:" + kindColor(e.kind) + '" data-tip="' + esc(e.feature + " \xB7 " + ms(e.ms) + (e.ok ? "" : " \xB7 error") + (e.tokensOut ? " \xB7 " + num(e.tokensOut) + " tokens out" : "")) + '"></span></span><span class="t">' + esc(ms(e.ms)) + "</span></div>";
+      }).join("") + "</div>";
+  }
+
+  function renderEvents() {
+    var kinds = ["all"];
+    summary.recent.forEach(function (e) { if (kinds.indexOf(e.kind) === -1) kinds.push(e.kind); });
+    $("kindFilter").innerHTML = '<div class="seg" role="group" aria-label="Event kind">' + kinds.map(function (k) {
+      return '<button data-kind="' + esc(k) + '" aria-pressed="' + (k === kindShown) + '">' + esc(k) + "</button>";
+    }).join("") + "</div>";
+    var list = summary.recent.filter(function (e) { return kindShown === "all" || e.kind === kindShown; });
+    $("recent").innerHTML = list.length
+      ? '<table><thead><tr><th>Received</th><th>Install</th><th>Kind</th><th>Name</th><th>Client</th><th>Version</th><th class="n">Time</th><th>Result</th></tr></thead><tbody>' +
+        list.map(function (e) {
+          return '<tr class="link" tabindex="0" data-install="' + esc(e.install) + '"><td>' + esc(new Date(e.receivedAt).toLocaleString()) + '</td><td class="mono">' + esc(e.install) + '</td><td><span class="sw" style="background:' + kindColor(e.kind) + '"></span> ' + esc(e.kind) +
+            '</td><td class="mono">' + esc(e.name) + "</td><td>" + esc(e.client) + '</td><td class="mono">' + esc(e.version) + '</td><td class="n">' + ms(e.ms) + '</td><td class="' + (e.ok ? "" : "bad") + '">' + (e.ok ? "ok" : "\u2715 error") + "</td></tr>";
         }).join("") + "</tbody></table>"
-      : '<div class="empty">No events yet.</div>';
+      : '<div class="empty-state">No events yet.</div>';
   }
 
-  function load() {
-    fetch(base + "api/summary?days=" + days).then(function (r) { return r.json(); }).then(function (s) { summary = s; render(); });
+  function route() {
+    var hash = location.hash.replace("#", "") || "overview";
+    var view = hash.indexOf("install/") === 0 ? "install" : ["overview", "users", "events"].indexOf(hash) !== -1 ? hash : "overview";
+    ["overview", "users", "install", "events"].forEach(function (v) { $("view-" + v).hidden = v !== view; });
+    document.querySelectorAll(".tabs a").forEach(function (a) {
+      var current = a.dataset.view === view || (view === "install" && a.dataset.view === "users");
+      if (current) a.setAttribute("aria-current", "page"); else a.removeAttribute("aria-current");
+    });
+    $("range").hidden = view === "install";
+    if (view === "install") {
+      var id = hash.slice(8);
+      if (!install || install.install !== id) {
+        install = null;
+        renderInstall();
+        get("api/install?id=" + encodeURIComponent(id)).then(function (data) { install = data || { install: id, missing: true }; renderInstall(); });
+      } else renderInstall();
+    } else render();
   }
-  fetch(base + "api/npm").then(function (r) { return r.json(); }).then(function (n) { npm = n; render(); });
 
-  document.getElementById("range").addEventListener("click", function (event) {
+  function render() {
+    if (!summary) return;
+    $("updated").textContent = "updated " + new Date(summary.generatedAt).toLocaleTimeString();
+    var hash = location.hash.replace("#", "") || "overview";
+    if (hash === "users") renderUsers();
+    else if (hash === "events") renderEvents();
+    else if (hash.indexOf("install/") !== 0) renderOverview();
+  }
+
+  function load() { get("api/summary?days=" + days).then(function (s) { if (s) { summary = s; render(); } }); }
+  get("api/npm").then(function (n) { npm = n; if (summary) render(); });
+
+  $("range").addEventListener("click", function (event) {
     var button = event.target.closest("button");
     if (!button) return;
     days = Number(button.dataset.days);
     document.querySelectorAll("#range button").forEach(function (b) { b.setAttribute("aria-pressed", String(b === button)); });
     load();
   });
-  document.getElementById("csv").addEventListener("click", function () {
+  $("userSearch").addEventListener("input", function () { if (summary) renderUsers(); });
+  document.addEventListener("click", function (event) {
+    var sort = event.target.closest("[data-sort]");
+    if (sort) {
+      var key = sort.dataset.sort;
+      userSort = { key: key, dir: userSort.key === key ? -userSort.dir : -1 };
+      renderUsers();
+      return;
+    }
+    var row = event.target.closest("tr[data-install]");
+    if (row) { location.hash = "install/" + row.dataset.install; return; }
+    var session = event.target.closest("[data-session]");
+    if (session) {
+      selectedSession = session.dataset.session;
+      document.querySelectorAll("#sessionList .session").forEach(function (b) { b.setAttribute("aria-pressed", String(b === session)); });
+      renderWaterfall();
+      return;
+    }
+    var kind = event.target.closest("[data-kind]");
+    if (kind) { kindShown = kind.dataset.kind; renderEvents(); }
+  });
+  document.addEventListener("keydown", function (event) {
+    var row = event.target.closest && event.target.closest("tr[data-install]");
+    if (row && (event.key === "Enter" || event.key === " ")) { event.preventDefault(); location.hash = "install/" + row.dataset.install; }
+  });
+  $("csv").addEventListener("click", function () {
     if (!summary) return;
-    var cols = ["install", "firstSeen", "lastSeen", "events", "sessions", "projects", "client", "version", "platform", "topFeature"];
-    var lines = [cols.join(",")].concat(summary.users.map(function (u) {
+    var cols = USER_COLS.map(function (c) { return c[0]; });
+    var lines = [cols.join(",")].concat(filteredUsers().map(function (u) {
       return cols.map(function (c) { return '"' + String(u[c]).replace(/"/g, '""') + '"'; }).join(",");
     }));
     var link = document.createElement("a");
-    link.href = URL.createObjectURL(new Blob([lines.join("\\n")], { type: "text/csv" }));
+    link.href = URL.createObjectURL(new Blob([lines.join(NL)], { type: "text/csv" }));
     link.download = "codebuddy-users-" + new Date().toISOString().slice(0, 10) + ".csv";
     link.click();
   });
@@ -3657,10 +3897,16 @@ td.n, th.n { text-align: right; font-family: var(--mono); font-variant-numeric:
     if (!text) { tip.style.display = "none"; return; }
     tip.textContent = text;
     tip.style.display = "block";
-    var x = Math.min(event.pageX + 12, document.documentElement.scrollWidth - tip.offsetWidth - 8);
-    tip.style.left = x + "px";
-    tip.style.top = (event.pageY - 32) + "px";
+    tip.style.left = Math.min(event.pageX + 12, document.documentElement.scrollWidth - tip.offsetWidth - 8) + "px";
+    tip.style.top = (event.pageY - 34) + "px";
+  });
+  var resizeTimer = 0;
+  window.addEventListener("resize", function () {
+    clearTimeout(resizeTimer);
+    resizeTimer = setTimeout(function () { if (location.hash.indexOf("#install/") === 0) renderInstall(); else render(); }, 150);
   });
+  window.addEventListener("hashchange", route);
+  route();
   load();
   setInterval(load, 60000);
 })();
@@ -3700,6 +3946,7 @@ var batchSchema = z2.object({
 async function startCollector(options) {
   const { dataDir } = options;
   await mkdir2(dataDir, { recursive: true });
+  const registry = await loadRegistry(dataDir);
   let summaryCache;
   let npmCache;
   const perInstall = /* @__PURE__ */ new Map();
@@ -3743,6 +3990,14 @@ async function startCollector(options) {
       return;
     }
     const receivedAt = (/* @__PURE__ */ new Date()).toISOString();
+    if (!registry.has(batch.installId)) {
+      registry.set(batch.installId, receivedAt);
+      await appendFile(
+        join6(dataDir, "installs.jsonl"),
+        `${JSON.stringify({ installId: batch.installId, firstSeen: receivedAt })}
+`
+      );
+    }
     const { events, ...meta } = batch;
     const lines = events.map((event) => JSON.stringify({ ...meta, ...event, receivedAt }));
     await appendFile(
@@ -3790,12 +4045,29 @@ async function startCollector(options) {
         summaryCache = {
           at: Date.now(),
           days,
-          value: summarize(await readEvents(dataDir, days), days)
+          value: summarize(
+            await readEvents(dataDir, Math.max(days, COHORT_WEEKS * 7)),
+            days,
+            Date.now(),
+            registry
+          )
         };
       }
       json2(summaryCache.value);
       return;
     }
+    if (url.pathname === "/api/install") {
+      const trace = installTrace(
+        await readEvents(dataDir, 90),
+        (url.searchParams.get("id") ?? "").toLowerCase()
+      );
+      if (!trace) {
+        response.writeHead(404, { "content-type": "application/json" }).end("null");
+        return;
+      }
+      json2(trace);
+      return;
+    }
     if (url.pathname === "/api/npm") {
       if (!npmCache || Date.now() - npmCache.at > 36e5) {
         npmCache = { at: Date.now(), value: await npmDownloads(options.fetchImpl ?? fetch) };
@@ -3863,64 +4135,125 @@ async function readEvents(dataDir, days, now = Date.now()) {
   }
   return events;
 }
-function summarize(events, days, now = Date.now()) {
-  const day = (iso) => iso.slice(0, 10);
-  const today = day(new Date(now).toISOString());
-  const activeWithin = (window) => {
-    const since = day(new Date(now - (window - 1) * 864e5).toISOString());
-    return new Set(events.filter((e) => day(e.receivedAt) >= since).map((e) => e.installId)).size;
+var DAY_MS = 864e5;
+var dayOf = (iso) => iso.slice(0, 10);
+var dayNumber = (iso) => Math.floor(Date.parse(iso) / DAY_MS);
+var COHORT_WEEKS = 8;
+function featureOf(event) {
+  if (event.kind === "tool") return event.name;
+  if (event.kind === "cli") return `cli:${event.name}`;
+  return event.kind;
+}
+var GOT_CONTEXT = (e) => e.kind === "recall" || e.kind === "tool" && /^(context_(pack|bootstrap|before_edit)|recall)$/.test(e.name);
+var SAVED_MEMORY = (e) => e.kind === "capture" || e.kind === "tool" && /^(context_after_turn|remember)$/.test(e.name);
+function summarize(events, days, now = Date.now(), registry = /* @__PURE__ */ new Map()) {
+  const today = Math.floor(now / DAY_MS);
+  const rangeStart = today - days + 1;
+  const firstSeenOf = (install, fallback) => registry.get(install) ?? fallback;
+  const activeDays = /* @__PURE__ */ new Map();
+  for (const event of events) {
+    const set = activeDays.get(event.installId) ?? /* @__PURE__ */ new Set();
+    set.add(dayNumber(event.receivedAt));
+    activeDays.set(event.installId, set);
+  }
+  const activeBetween = (from, to) => {
+    let count = 0;
+    for (const set of activeDays.values()) {
+      for (const d of set) {
+        if (d >= from && d <= to) {
+          count += 1;
+          break;
+        }
+      }
+    }
+    return count;
   };
+  const inRange = events.filter((e) => dayNumber(e.receivedAt) >= rangeStart);
   const daily = /* @__PURE__ */ new Map();
-  for (let index = days - 1; index >= 0; index -= 1) {
-    daily.set(day(new Date(now - index * 864e5).toISOString()), {
-      installs: /* @__PURE__ */ new Set(),
-      events: 0
-    });
-  }
-  const firstSeen = /* @__PURE__ */ new Map();
-  const tools = /* @__PURE__ */ new Map();
-  const kinds = /* @__PURE__ */ new Map();
+  for (let d = rangeStart; d <= today; d += 1) daily.set(d, { installs: /* @__PURE__ */ new Set(), events: 0 });
+  const features = /* @__PURE__ */ new Map();
   const latest = /* @__PURE__ */ new Map();
   const users = /* @__PURE__ */ new Map();
+  const funnel = {
+    active: /* @__PURE__ */ new Set(),
+    context: /* @__PURE__ */ new Set(),
+    memory: /* @__PURE__ */ new Set()
+  };
   let errors = 0;
   let tokensOut = 0;
-  for (const event of events) {
-    const bucket = daily.get(day(event.receivedAt));
+  for (const event of inRange) {
+    const d = dayNumber(event.receivedAt);
+    const bucket = daily.get(d);
     if (bucket) {
       bucket.installs.add(event.installId);
       bucket.events += 1;
     }
-    const seen = firstSeen.get(event.installId);
-    if (!seen || event.receivedAt < seen) firstSeen.set(event.installId, event.receivedAt);
     latest.set(event.installId, event);
+    const feature = featureOf(event);
     const user = users.get(event.installId) ?? {
+      firstEvent: event.receivedAt,
       lastSeen: event.receivedAt,
       events: 0,
+      errors: 0,
       sessions: /* @__PURE__ */ new Set(),
       projects: /* @__PURE__ */ new Set(),
-      features: /* @__PURE__ */ new Map()
+      features: /* @__PURE__ */ new Map(),
+      days: /* @__PURE__ */ new Set()
     };
     if (event.receivedAt > user.lastSeen) user.lastSeen = event.receivedAt;
     user.events += 1;
+    if (!event.ok) user.errors += 1;
     if (event.session) user.sessions.add(event.session);
     user.projects.add(event.project);
-    const feature = event.kind === "tool" ? event.name : event.kind;
     user.features.set(feature, (user.features.get(feature) ?? 0) + 1);
+    user.days.add(d);
     users.set(event.installId, user);
-    kinds.set(event.kind, (kinds.get(event.kind) ?? 0) + 1);
+    funnel.active.add(event.installId);
+    if (GOT_CONTEXT(event)) funnel.context.add(event.installId);
+    if (SAVED_MEMORY(event)) funnel.memory.add(event.installId);
     if (!event.ok) errors += 1;
     tokensOut += event.tokensOut ?? 0;
-    const key = event.kind === "tool" ? event.name : `${event.kind}`;
-    const tool = tools.get(key) ?? { calls: 0, errors: 0, installs: /* @__PURE__ */ new Set(), ms: [] };
-    tool.calls += 1;
-    if (!event.ok) tool.errors += 1;
-    tool.installs.add(event.installId);
-    tool.ms.push(event.ms);
-    tools.set(key, tool);
+    const stats = features.get(feature) ?? { calls: 0, errors: 0, installs: /* @__PURE__ */ new Set(), ms: [] };
+    stats.calls += 1;
+    if (!event.ok) stats.errors += 1;
+    stats.installs.add(event.installId);
+    stats.ms.push(event.ms);
+    features.set(feature, stats);
+  }
+  const firstSeenDay = /* @__PURE__ */ new Map();
+  for (const [install, seen] of registry) firstSeenDay.set(install, dayNumber(seen));
+  for (const [install, user] of users) {
+    if (!firstSeenDay.has(install)) firstSeenDay.set(install, dayNumber(user.firstEvent));
+  }
+  for (const [install, set] of activeDays) {
+    if (!firstSeenDay.has(install)) firstSeenDay.set(install, Math.min(...set));
   }
   const newPerDay = /* @__PURE__ */ new Map();
-  for (const seen of firstSeen.values())
-    newPerDay.set(day(seen), (newPerDay.get(day(seen)) ?? 0) + 1);
+  for (const d of firstSeenDay.values()) newPerDay.set(d, (newPerDay.get(d) ?? 0) + 1);
+  let cumulative = [...firstSeenDay.values()].filter((d) => d < rangeStart).length;
+  const cohorts = [];
+  for (let age = COHORT_WEEKS - 1; age >= 0; age -= 1) {
+    const from = today - (age + 1) * 7 + 1;
+    const members = [...firstSeenDay].filter(([, d]) => d >= from && d < from + 7).map(([install]) => install);
+    const weeks = [];
+    for (let week = 0; week <= age; week += 1) {
+      const wFrom = from + week * 7;
+      const active = members.filter((install) => {
+        const set = activeDays.get(install);
+        if (!set) return week === 0;
+        for (const d of set) if (d >= wFrom && d < wFrom + 7) return true;
+        return false;
+      }).length;
+      weeks.push(members.length ? active / members.length : 0);
+    }
+    cohorts.push({
+      start: new Date(from * DAY_MS).toISOString().slice(0, 10),
+      size: members.length,
+      weeks
+    });
+  }
+  const week1 = cohorts.filter((c) => c.size > 0 && c.weeks.length > 1);
+  const week1Retention = week1.length ? week1.reduce((sum, c) => sum + (c.weeks[1] ?? 0) * c.size, 0) / week1.reduce((sum, c) => sum + c.size, 0) : null;
   const share = (pick) => {
     const counts = /* @__PURE__ */ new Map();
     for (const event of latest.values()) {
@@ -3932,47 +4265,72 @@ function summarize(events, days, now = Date.now()) {
     const sorted = [...values].sort((a, b) => a - b);
     return sorted[Math.floor(sorted.length / 2)] ?? 0;
   };
+  const p95 = (values) => {
+    const sorted = [...values].sort((a, b) => a - b);
+    return sorted[Math.min(sorted.length - 1, Math.floor(sorted.length * 0.95))] ?? 0;
+  };
+  const wau = activeBetween(today - 6, today);
+  const wauPrevious = activeBetween(today - 13, today - 7);
+  const returned = [...users.values()].filter((user) => user.days.size >= 2).length;
   return {
     generatedAt: new Date(now).toISOString(),
     days,
     totals: {
-      installs: firstSeen.size,
-      projects: new Set(events.map((e) => `${e.installId}:${e.project}`)).size,
-      sessions: new Set(events.filter((e) => e.session).map((e) => e.session)).size,
-      events: events.length,
-      errorRate: events.length ? errors / events.length : 0,
+      allTimeInstalls: firstSeenDay.size,
+      installs: users.size,
+      newInRange: [...firstSeenDay.values()].filter((d) => d >= rangeStart).length,
+      newToday: newPerDay.get(today) ?? 0,
+      projects: new Set(inRange.map((e) => `${e.installId}:${e.project}`)).size,
+      sessions: new Set(inRange.filter((e) => e.session).map((e) => e.session)).size,
+      events: inRange.length,
+      errorRate: inRange.length ? errors / inRange.length : 0,
       tokensOut,
-      active1d: activeWithin(1),
-      active7d: activeWithin(7),
-      active30d: activeWithin(30),
-      newToday: newPerDay.get(today) ?? 0
+      dau: activeBetween(today, today),
+      wau,
+      wauPrevious,
+      mau: activeBetween(today - 29, today),
+      week1Retention
     },
-    daily: [...daily].map(([date, bucket]) => ({
-      date,
-      installs: bucket.installs.size,
-      events: bucket.events,
-      newInstalls: newPerDay.get(date) ?? 0
-    })),
-    features: [...tools].map(([label, tool]) => ({
+    daily: [...daily].map(([d, bucket]) => {
+      cumulative += newPerDay.get(d) ?? 0;
+      return {
+        date: new Date(d * DAY_MS).toISOString().slice(0, 10),
+        installs: bucket.installs.size,
+        events: bucket.events,
+        newInstalls: newPerDay.get(d) ?? 0,
+        totalInstalls: cumulative
+      };
+    }),
+    /** Installs active in the range that reached each step. */
+    funnel: [
+      { label: "Active", installs: funnel.active.size },
+      { label: "Received context", installs: funnel.context.size },
+      { label: "Saved memory", installs: funnel.memory.size },
+      { label: "Came back another day", installs: returned }
+    ],
+    cohorts,
+    features: [...features].map(([label, stats]) => ({
       label,
-      calls: tool.calls,
-      installs: tool.installs.size,
-      errorRate: tool.errors / tool.calls,
-      p50ms: median(tool.ms)
-    })).sort((a, b) => b.calls - a.calls).slice(0, 20),
-    kinds: [...kinds].map(([label, count]) => ({ label, count })).sort((a, b) => b.count - a.count),
+      calls: stats.calls,
+      installs: stats.installs.size,
+      errorRate: stats.errors / stats.calls,
+      p50ms: median(stats.ms),
+      p95ms: p95(stats.ms)
+    })).sort((a, b) => b.calls - a.calls).slice(0, 25),
     clients: share((e) => e.clients.length ? e.clients : ["unknown"]),
     versions: share((e) => [e.version]),
     platforms: share((e) => [`${e.platform}/${e.arch}`]),
     nodes: share((e) => [`node ${e.node}`]),
-    /** One row per install, most recently active first. */
+    /** One row per install active in the range, most recently active first. */
     users: [...users].map(([installId, user]) => {
       const last = latest.get(installId);
       return {
         install: installId.slice(0, 8),
-        firstSeen: firstSeen.get(installId) ?? user.lastSeen,
+        firstSeen: firstSeenOf(installId, user.firstEvent),
         lastSeen: user.lastSeen,
+        activeDays: user.days.size,
         events: user.events,
+        errors: user.errors,
         sessions: user.sessions.size,
         projects: user.projects.size,
         client: last?.clients.join(",") || "unknown",
@@ -3981,7 +4339,7 @@ function summarize(events, days, now = Date.now()) {
         topFeature: [...user.features].sort((a, b) => b[1] - a[1])[0]?.[0] ?? ""
       };
     }).sort((a, b) => b.lastSeen.localeCompare(a.lastSeen)).slice(0, 1e3),
-    recent: events.slice(-50).reverse().map((e) => ({
+    recent: inRange.slice(-50).reverse().map((e) => ({
       receivedAt: e.receivedAt,
       install: e.installId.slice(0, 8),
       kind: e.kind,
@@ -3993,6 +4351,77 @@ function summarize(events, days, now = Date.now()) {
     }))
   };
 }
+function installTrace(events, prefix) {
+  const own = events.filter((e) => e.installId.startsWith(prefix));
+  const first = own[0];
+  if (!first || !/^[0-9a-f]{8}$/.test(prefix)) return null;
+  const sessions = /* @__PURE__ */ new Map();
+  const perDay = /* @__PURE__ */ new Map();
+  for (const event of own) {
+    perDay.set(dayOf(event.receivedAt), (perDay.get(dayOf(event.receivedAt)) ?? 0) + 1);
+    const key = event.session ?? "none";
+    const session = sessions.get(key) ?? {
+      start: event.ts,
+      end: event.ts,
+      events: 0,
+      errors: 0,
+      ms: 0,
+      features: /* @__PURE__ */ new Set()
+    };
+    if (event.ts < session.start) session.start = event.ts;
+    if (event.ts > session.end) session.end = event.ts;
+    session.events += 1;
+    if (!event.ok) session.errors += 1;
+    session.ms += event.ms;
+    session.features.add(featureOf(event));
+    sessions.set(key, session);
+  }
+  const last = own[own.length - 1] ?? first;
+  return {
+    install: prefix,
+    client: last.clients.join(",") || "unknown",
+    version: last.version,
+    platform: `${last.platform}/${last.arch}`,
+    node: last.node,
+    projects: new Set(own.map((e) => e.project)).size,
+    perDay: [...perDay].map(([date, count]) => ({ date, events: count })),
+    sessions: [...sessions].map(([id, session]) => ({ id, ...session, features: [...session.features] })).sort((a, b) => b.end.localeCompare(a.end)).slice(0, 50),
+    events: own.slice(-1e3).map((e) => ({
+      ts: e.ts,
+      kind: e.kind,
+      name: e.name,
+      feature: featureOf(e),
+      ms: e.ms,
+      ok: e.ok,
+      session: e.session ?? "none",
+      tokensOut: e.tokensOut ?? 0
+    }))
+  };
+}
+async function loadRegistry(dataDir) {
+  const registry = /* @__PURE__ */ new Map();
+  const path = join6(dataDir, "installs.jsonl");
+  const raw = await readFile4(path, "utf8").catch(() => null);
+  if (raw !== null) {
+    for (const line of raw.split("\n")) {
+      try {
+        const entry = JSON.parse(line);
+        if (!registry.has(entry.installId)) registry.set(entry.installId, entry.firstSeen);
+      } catch {
+      }
+    }
+    return registry;
+  }
+  for (const event of await readEvents(dataDir, 3650)) {
+    if (!registry.has(event.installId)) registry.set(event.installId, event.receivedAt);
+  }
+  const lines = [...registry].map(
+    ([installId, firstSeen]) => JSON.stringify({ installId, firstSeen })
+  );
+  await appendFile(path, lines.length ? `${lines.join("\n")}
+` : "");
+  return registry;
+}
 async function npmDownloads(fetchImpl) {
   const to = (/* @__PURE__ */ new Date()).toISOString().slice(0, 10);
   const from = new Date(Date.now() - 364 * 864e5).toISOString().slice(0, 10);
@@ -4810,7 +5239,12 @@ function createCli() {
   registerGitHubCommands(program, runSafely);
   registerSymbolsCommand(program, runSafely);
   registerTelemetryCommands(program, runSafely);
-  program.hook("preAction", () => showTelemetryNoticeOnce());
+  let started = Date.now();
+  program.hook("preAction", () => {
+    started = Date.now();
+    return showTelemetryNoticeOnce();
+  });
+  program.hook("postAction", (_program, command) => traceCliCommand(command, started));
   program.action(async () => {
     await runSafely(() => runUseCommand());
   });
@@ -4951,4 +5385,4 @@ function printDbDoctor(report) {
 export {
   createCli
 };
-//# sourceMappingURL=main-QUASSFP7.js.map
+//# sourceMappingURL=main-YJKSYFPT.js.map