@monoes/monomindcli 1.11.11 → 1.11.13

package/dist/src/ui/dashboard.html

@@ -63,6 +63,7 @@ html, body { height: 100%; background: var(--bg); color: var(--text-hi); font-fa
 #view-title { font-size: 14px; font-weight: 600; color: var(--text-hi); }
 .pill { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; color: var(--text-lo); background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 2px 8px; }
 .live-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--green); animation: blink 2s ease-in-out infinite; }
+.live-dot.polling { background: oklch(70% 0.18 80); animation: blink 4s ease-in-out infinite; }
 @keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.35} }
 @media (prefers-reduced-motion: reduce) { .live-dot { animation: none; } }
 #tb-right { margin-left: auto; display: flex; align-items: center; gap: 8px; }
@@ -246,6 +247,10 @@ html, body { height: 100%; background: var(--bg); color: var(--text-hi); font-fa
 .lp-fill { height: 100%; background: var(--accent); border-radius: 2px; transition: width 0.4s ease; }
 .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.hil { background: oklch(65% 0.15 60 / 0.15); color: oklch(75% 0.16 60); }
+.loop-type-badge { font-size: 10px; padding: 1px 6px; border-radius: 8px; background: var(--accent-dim); color: var(--accent); font-family: var(--mono); flex-shrink: 0; display: inline-block; margin-right: 4px; }
+.loop-type-badge.tillend { background: oklch(65% 0.15 280 / 0.12); color: oklch(70% 0.18 280); }
+.loop-hil-banner { font-size: 11px; background: oklch(65% 0.15 60 / 0.1); border: 1px solid oklch(65% 0.15 60 / 0.3); border-radius: 4px; padding: 3px 8px; color: oklch(75% 0.16 60); margin-top: 5px; }
 
 /* memory */
 .mem-section { margin-bottom: 22px; }
@@ -594,6 +599,7 @@ html, body { height: 100%; background: var(--bg); color: var(--text-hi); font-fa
 .shm-grid { display:grid; grid-template-rows:repeat(7,10px); grid-auto-flow:column; grid-auto-columns:10px; gap:2px; margin-top:6px; }
 .shm-cell { border-radius:2px; background:var(--surface-hi); cursor:pointer; transition:outline 0.1s; }
 .shm-cell:hover { outline:1px solid var(--accent); outline-offset:-1px; }
+.shm-cell.shm-0 { cursor: default; }
 .shm-cell.shm-1 { background:oklch(72% 0.18 75 / 0.22); }
 .shm-cell.shm-2 { background:oklch(72% 0.18 75 / 0.42); }
 .shm-cell.shm-3 { background:oklch(72% 0.18 75 / 0.65); }
@@ -1229,7 +1235,8 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
 .mg-query-row input, .mg-query-row select, .mg-query-row textarea { background:var(--surface-hi); border:1px solid var(--border); border-radius:4px; color:var(--text-hi); padding:6px 10px; font-size:12px; font-family:var(--sans); outline:none; }
 .mg-query-row input:focus, .mg-query-row textarea:focus { border-color:var(--accent); }
 .mg-query-row textarea { resize:vertical; min-height:70px; width:100%; }
-.mg-query-result { margin-top:10px; padding:10px 12px; background:var(--surface-hi); border-radius:4px; font-size:11px; font-family:var(--mono); white-space:pre-wrap; word-break:break-word; color:var(--text-mid); max-height:300px; overflow-y:auto; }
+.mg-query-result { margin-top:10px; padding:10px 12px; background:var(--surface-hi); border-radius:4px; font-size:11px; font-family:var(--mono); white-space:pre-wrap; word-break:break-word; color:var(--text-mid); max-height:300px; overflow-y:auto; cursor:pointer; }
+.mg-query-result:hover::after { content:'⎘ copy'; position:sticky; float:right; font-size:10px; color:var(--text-xs); pointer-events:none; }
 /* live border glow */
 @keyframes live-fade { 0% { box-shadow: 0 0 0 1px oklch(72% 0.18 75 / 0.4); } 100% { box-shadow: none; } }
 .live-glow { animation: live-fade 8s ease-out forwards; }
@@ -1291,10 +1298,10 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
   </div>
   <div id="sb-nav">
     <div class="nav-sect">
-      <div class="nav-item active" data-view="now">
+      <div class="nav-item active" data-view="now" title="Now — current live activity feed">
         <span class="ico">◉</span><span class="lbl">Now</span>
       </div>
-      <div class="nav-item" data-view="projects">
+      <div class="nav-item" data-view="projects" title="Projects — switch between projects">
         <span class="ico">⊞</span><span class="lbl">Projects</span>
         <span class="bdg" id="bdg-projects">—</span>
       </div>
@@ -1306,33 +1313,40 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
         <div class="nav-proj-name" id="nav-proj-name">—</div>
       </div>
       <div class="nav-proj-items">
-        <div class="nav-item" data-view="sessions">
+        <div class="nav-item" data-view="sessions" title="Sessions — browse and replay project sessions">
           <span class="ico">◫</span><span class="lbl">Sessions</span>
           <span class="bdg" id="bdg-sessions">—</span>
         </div>
-        <div class="nav-item" data-view="loops">
+        <div class="nav-item" data-view="loops" title="Loops — manage automation loops">
           <span class="ico">↺</span><span class="lbl">Loops</span>
           <span class="bdg" id="bdg-loops">—</span>
         </div>
-        <div class="nav-item" data-view="tokens">
+        <div class="nav-item" data-view="tokens" title="Tokens — token usage and cost breakdown">
           <span class="ico">$</span><span class="lbl">Tokens</span>
         </div>
-        <div class="nav-item" data-view="memory">
+        <div class="nav-item" data-view="memory" title="Memory — agent memory store">
           <span class="ico">◈</span><span class="lbl">Memory</span>
         </div>
-        <div class="nav-item" data-view="orgs">
+        <div class="nav-item" data-view="orgs" title="Orgs — manage organizations and agents">
           <span class="ico">⬡</span><span class="lbl">Orgs</span>
         </div>
-        <div class="nav-item" data-view="monograph">
+        <div class="nav-item" data-view="monograph" title="Monograph — knowledge graph explorer">
           <span class="ico">⬡</span><span class="lbl">Monograph</span>
         </div>
       </div>
     </div>
     <div class="nav-no-proj" id="nav-no-proj-hint">Select a project above</div>
     <div class="nav-sect" style="margin-top:auto;padding-top:8px;">
-      <div class="nav-item" data-view="global">
+      <div class="nav-item" data-view="global" title="Global Feed — activity across all projects">
         <span class="ico">⊕</span><span class="lbl">Global Feed</span>
       </div>
+      <div class="nav-item" data-view="global-loops" title="Global Loops — loops across all projects">
+        <span class="ico">↺</span><span class="lbl">Global Loops</span>
+        <span class="bdg" id="bdg-global-loops">—</span>
+      </div>
+      <div class="nav-item" data-view="global-tokens" title="Global Tokens — token usage across all projects">
+        <span class="ico">$</span><span class="lbl">Global Tokens</span>
+      </div>
     </div>
   </div>
   <div id="sb-footer">
@@ -1352,9 +1366,9 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
     <div id="tb-right">
       <button class="btn" onclick="openMastermind()" style="color:oklch(65% 0.16 295);border-color:oklch(65% 0.16 295 / 0.4)" title="Mastermind — orgs, skills, loops, metrics">⬡ Mastermind</button>
       <button class="btn" id="btn-budget" onclick="openBudgetModal()" title="Set daily/monthly cost budget">⚑ Budget</button>
-      <button class="btn" onclick="openCmdPalette()">⌕ Search <kbd style="font-size:10px;opacity:0.6;margin-left:3px">⌘K</kbd></button>
+      <button class="btn" onclick="openCmdPalette()" title="Open command palette (⌘K)">⌕ Search <kbd style="font-size:10px;opacity:0.6;margin-left:3px">⌘K</kbd></button>
       <button class="btn" onclick="openShortcutHelp()" title="Keyboard shortcuts (?)">? Help</button>
-      <button class="btn" onclick="refreshCurrent()">↺ Refresh</button>
+      <button class="btn" onclick="refreshCurrent()" title="Refresh current view">↺ Refresh</button>
     </div>
   </div>
 
@@ -1400,13 +1414,13 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
         <div id="feed-search">
           <input id="feed-search-input" type="text" placeholder="Search feed…" oninput="filterFeed(this.value)" onkeydown="if(event.key==='Escape')closeFeedSearch()">
           <span id="feed-search-count"></span>
-          <button id="feed-search-close" onclick="closeFeedSearch()">✕</button>
+          <button id="feed-search-close" onclick="closeFeedSearch()" title="Close search">✕</button>
         </div>
         <div id="sess-ctx">
-          <button class="sctx-back" onclick="switchView('sessions')">← Sessions</button>
+          <button class="sctx-back" onclick="switchView('sessions')" title="Back to sessions list">← Sessions</button>
           <span class="sctx-sep">/</span>
           <span class="sctx-label" id="sctx-label"></span>
-          <button class="sctx-live" onclick="goLive()">⬤ Go live</button>
+          <button class="sctx-live" onclick="goLive()" title="Switch to live feed mode">⬤ Go live</button>
         </div>
         <div id="feed-recap"></div>
         <div id="replay-bar">
@@ -1420,10 +1434,10 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
         <div id="feed-timeline" title="Session tool activity timeline"></div>
         <div id="feed-time-filter">
           <span class="tf-lbl">Range</span>
-          <button class="tf-btn active" data-tf="all" onclick="setFeedTimeFilter('all')">All</button>
-          <button class="tf-btn" data-tf="1h" onclick="setFeedTimeFilter('1h')">1h</button>
-          <button class="tf-btn" data-tf="6h" onclick="setFeedTimeFilter('6h')">6h</button>
-          <button class="tf-btn" data-tf="24h" onclick="setFeedTimeFilter('24h')">24h</button>
+          <button class="tf-btn active" data-tf="all" title="Show all activity" onclick="setFeedTimeFilter('all')">All</button>
+          <button class="tf-btn" data-tf="1h" title="Show last 1 hour" onclick="setFeedTimeFilter('1h')">1h</button>
+          <button class="tf-btn" data-tf="6h" title="Show last 6 hours" onclick="setFeedTimeFilter('6h')">6h</button>
+          <button class="tf-btn" data-tf="24h" title="Show last 24 hours" onclick="setFeedTimeFilter('24h')">24h</button>
           <span class="kb-hint"><kbd>J</kbd><kbd>K</kbd> navigate &nbsp;<kbd>↵</kbd> detail &nbsp;<kbd>/</kbd> find &nbsp;<kbd>G</kbd> live &nbsp;<kbd>A</kbd> ambient &nbsp;<kbd>⌘K</kbd> search</span>
         </div>
         <div id="weekly-card">
@@ -1452,7 +1466,7 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
       <div id="detail-panel">
         <div id="detail-head">
           <h3 id="detail-title">Detail</h3>
-          <button id="detail-close" onclick="closeDetail()">✕</button>
+          <button id="detail-close" onclick="closeDetail()" title="Close detail panel">✕</button>
         </div>
         <div id="detail-body"></div>
       </div>
@@ -1545,11 +1559,12 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
           <table class="lb-table"><thead><tr>
             <th class="lb-rank">#</th><th>Session</th><th class="lb-cost">Cost</th><th class="lb-dur">Duration</th>
           </tr></thead><tbody id="lb-body"></tbody></table>
+          <div id="lb-overflow" style="font-size:11px;color:var(--text-xs);margin-top:4px;text-align:right"></div>
         </div>
         <div id="cost-histogram-panel"></div>
         <div id="timeline-panel"><div id="timeline-head">Session Timeline <span style="font-weight:400;font-size:10px;color:var(--text-xs)">— each bar = one session, width = duration, color = cost</span></div><div id="timeline-scroll"></div></div>
         <div id="model-donut-panel"></div>
-        <div id="file-pivot-bar"><span class="fpb-label" id="fpb-label"></span><button class="fpb-clear" onclick="clearFilePivot()">✕ Clear filter</button></div>
+        <div id="file-pivot-bar"><span class="fpb-label" id="fpb-label"></span><button class="fpb-clear" title="Clear file pivot filter" onclick="clearFilePivot()">✕ Clear filter</button></div>
         <div id="model-mix-panel" style="display:none;margin-bottom:16px">
           <div id="model-mix-body"></div>
         </div>
@@ -1566,21 +1581,21 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
           <div id="patterns-body"></div>
         </div>
         <div id="sess-heatmap" style="margin-bottom:14px;display:none">
-          <div class="shm-label"><span>12-week activity</span><button id="shm-clear" onclick="clearHeatmapFilter()">✕ Clear filter</button></div>
+          <div class="shm-label"><span>12-week activity</span><button id="shm-clear" onclick="clearHeatmapFilter()" title="Clear date filter">✕ Clear filter</button></div>
           <div class="shm-grid" id="shm-grid"></div>
         </div>
         <div class="period-toggles" id="period-toggles">
           <span style="font-size:10px;color:var(--text-xs);align-self:center;text-transform:uppercase;letter-spacing:0.06em">Period:</span>
-          <button class="period-btn active" data-period="day" onclick="setPeriod('day')">Day</button>
-          <button class="period-btn" data-period="week" onclick="setPeriod('week')">Week</button>
-          <button class="period-btn" data-period="month" onclick="setPeriod('month')">Month</button>
-          <button class="period-btn" data-period="all" onclick="setPeriod('all')">All</button>
+          <button class="period-btn active" data-period="day" title="Show today's sessions" onclick="setPeriod('day')">Day</button>
+          <button class="period-btn" data-period="week" title="Show this week's sessions" onclick="setPeriod('week')">Week</button>
+          <button class="period-btn" data-period="month" title="Show this month's sessions" onclick="setPeriod('month')">Month</button>
+          <button class="period-btn" data-period="all" title="Show all sessions" onclick="setPeriod('all')">All</button>
         </div>
         <div id="bulk-toolbar">
           <span class="bulk-count" id="bulk-count">0 selected</span>
-          <button class="bulk-btn" onclick="bulkExport()">⬇ Export</button>
-          <button class="bulk-btn" onclick="bulkBookmark()">☆ Bookmark all</button>
-          <button class="bulk-btn danger" onclick="clearBulkSelection()">✕ Clear</button>
+          <button class="bulk-btn" onclick="bulkExport()" title="Export selected sessions">⬇ Export</button>
+          <button class="bulk-btn" onclick="bulkBookmark()" title="Bookmark all selected sessions">☆ Bookmark all</button>
+          <button class="bulk-btn danger" onclick="clearBulkSelection()" title="Clear selection">✕ Clear</button>
         </div>
         <div id="sess-filter-wrap">
           <input id="sess-filter-input" type="text" placeholder="Filter sessions by prompt…" oninput="filterSessions(this.value)" autocomplete="off">
@@ -1595,32 +1610,33 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
       <div class="vscroll">
         <div class="pg-title">Loops</div>
         <div class="pg-sub">Scheduled automation loops</div>
-        <button id="btn-new-loop" onclick="showLoopForm()">+ New Loop</button>
+        <button id="btn-new-loop" onclick="showLoopForm()" title="Create a new automation loop">+ New Loop</button>
         <div id="loop-create-form" style="display:none">
           <div class="lcf-title">Create Loop</div>
           <div class="lcf-row">
             <label class="lcf-label">Prompt</label>
-            <textarea class="lcf-textarea" id="lcf-prompt" placeholder="What should the agent do each iteration?"></textarea>
+            <textarea class="lcf-textarea" id="lcf-prompt" placeholder="What should the agent do each iteration?" title="The task or goal to run each loop iteration" spellcheck="false"></textarea>
           </div>
           <div class="lcf-row">
             <label class="lcf-label">Name (optional)</label>
-            <input class="lcf-input" id="lcf-name" type="text" placeholder="My loop">
+            <input class="lcf-input" id="lcf-name" type="text" placeholder="My loop" title="Optional display name for this loop">
           </div>
           <div class="lcf-row-inline">
             <div class="lcf-row">
               <label class="lcf-label">Interval</label>
-              <input class="lcf-input" id="lcf-interval" type="text" placeholder="1h" value="1h">
+              <input class="lcf-input" id="lcf-interval" type="text" placeholder="1h" value="1h" title="How often to run (e.g. 30m, 1h, 2h)">
             </div>
             <div class="lcf-row">
               <label class="lcf-label">Max reps (blank = ∞)</label>
-              <input class="lcf-input" id="lcf-maxreps" type="number" placeholder="∞" min="1">
+              <input class="lcf-input" id="lcf-maxreps" type="number" placeholder="∞" min="1" title="Maximum number of iterations before stopping (leave blank for unlimited)">
             </div>
           </div>
           <div class="lcf-actions">
-            <button class="lcf-cancel" onclick="hideLoopForm()">Cancel</button>
-            <button class="lcf-submit" onclick="createLoop()">Create Loop</button>
+            <button class="lcf-cancel" title="Discard and close loop form" onclick="hideLoopForm()">Cancel</button>
+            <button class="lcf-submit" title="Create and start the automation loop" onclick="createLoop()">Create Loop</button>
           </div>
         </div>
+        <div class="filter-bar" style="margin:8px 0"><input class="filter-input" id="loop-list-filter" type="text" placeholder="Filter loops…" oninput="filterLoopList(this.value)" title="Filter loops by name or prompt"></div>
         <div id="loops-content" class="loop-list"><div class="loading-txt">Loading…</div></div>
       </div>
     </div>
@@ -1634,10 +1650,10 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
         <div style="background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:12px 14px">
           <div style="font-size:10px;text-transform:uppercase;letter-spacing:0.07em;color:var(--text-xs);margin-bottom:8px">Daily usage (last 14 days)</div>
           <div class="tok-periods">
-            <button class="tok-period-btn active" data-period="today" onclick="setTokPeriod(this,'today')">Today</button>
-            <button class="tok-period-btn" data-period="week" onclick="setTokPeriod(this,'week')">Week</button>
-            <button class="tok-period-btn" data-period="30d" onclick="setTokPeriod(this,'30d')">30 Days</button>
-            <button class="tok-period-btn" data-period="month" onclick="setTokPeriod(this,'month')">Month</button>
+            <button class="tok-period-btn active" data-period="today" title="Show today's token usage" onclick="setTokPeriod(this,'today')">Today</button>
+            <button class="tok-period-btn" data-period="week" title="Show this week's token usage" onclick="setTokPeriod(this,'week')">Week</button>
+            <button class="tok-period-btn" data-period="30d" title="Show last 30 days of token usage" onclick="setTokPeriod(this,'30d')">30 Days</button>
+            <button class="tok-period-btn" data-period="month" title="Show this month's token usage" onclick="setTokPeriod(this,'month')">Month</button>
           </div>
           <canvas id="tok-chart" height="100" style="width:100%;display:block"></canvas>
         </div>
@@ -1651,15 +1667,18 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
         <div class="pg-title">Memory</div>
         <div class="pg-sub">Knowledge palace — stored facts, graph, identity</div>
         <div class="mem-tab-bar" style="display:flex;gap:4px;margin-bottom:14px;border-bottom:1px solid var(--border);padding-bottom:6px">
-          <button class="odt-btn active" data-memtab="memories" onclick="switchMemTab('memories')">Memories</button>
-          <button class="odt-btn" data-memtab="routing" onclick="switchMemTab('routing')">Routing</button>
-          <button class="odt-btn" data-memtab="usage" onclick="switchMemTab('usage')">Usage</button>
-          <button class="odt-btn" data-memtab="adrs" onclick="switchMemTab('adrs')">ADRs</button>
-          <button class="odt-btn" data-memtab="swarm" onclick="switchMemTab('swarm')">Swarm</button>
-          <button class="odt-btn" data-memtab="chunks" onclick="switchMemTab('chunks')">Chunks</button>
-          <button class="odt-btn" data-memtab="agent-graph" onclick="switchMemTab('agent-graph')">Agent Graph</button>
+          <button class="odt-btn active" data-memtab="memories" title="Stored agent memories" onclick="switchMemTab('memories')">Memories</button>
+          <button class="odt-btn" data-memtab="routing" title="Routing decisions and feedback" onclick="switchMemTab('routing')">Routing</button>
+          <button class="odt-btn" data-memtab="usage" title="Memory usage statistics" onclick="switchMemTab('usage')">Usage</button>
+          <button class="odt-btn" data-memtab="adrs" title="Architecture Decision Records" onclick="switchMemTab('adrs')">ADRs</button>
+          <button class="odt-btn" data-memtab="swarm" title="Swarm activity and coordination" onclick="switchMemTab('swarm')">Swarm</button>
+          <button class="odt-btn" data-memtab="chunks" title="Knowledge chunks and embeddings" onclick="switchMemTab('chunks')">Chunks</button>
+          <button class="odt-btn" data-memtab="agent-graph" title="Agent interaction graph" onclick="switchMemTab('agent-graph')">Agent Graph</button>
         </div>
         <div id="mem-tab-memories">
+          <div class="filter-bar" style="margin-bottom:8px">
+            <input class="filter-input" id="mem-list-filter" type="text" placeholder="Filter memories…" oninput="filterMemList(this.value)" title="Filter memories by name or description">
+          </div>
           <div class="mem-split" id="mem-split">
             <div class="mem-list-pane" id="mem-list-pane">
               <div class="loading-txt" style="padding:16px">Loading…</div>
@@ -1668,7 +1687,7 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
               <div style="color:var(--text-lo);font-size:13px;padding:20px 0">Select a memory</div>
             </div>
           </div>
-          <div style="margin-top:10px"><button class="btn" onclick="openNewMemModal()">+ New Memory</button></div>
+          <div style="margin-top:10px"><button class="btn" title="Create a new memory entry" onclick="openNewMemModal()">+ New Memory</button></div>
         </div>
         <div id="mem-tab-routing" style="display:none"><div class="loading-txt">Loading…</div></div>
         <div id="mem-tab-usage" style="display:none"><div class="loading-txt">Loading…</div></div>
@@ -1685,7 +1704,7 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
               <div style="color:var(--text-lo);font-size:13px">Select a swarm run</div>
             </div>
           </div>
-          <button class="btn" style="margin-top:10px;color:var(--red);border-color:var(--red)" onclick="cleanSwarmData()">&#x232B; Clean Data</button>
+          <button class="btn" title="Remove stale swarm data from memory" style="margin-top:10px;color:var(--red);border-color:var(--red)" onclick="cleanSwarmData()">&#x232B; Clean Data</button>
         </div>
         <div id="mem-tab-chunks" style="display:none">
           <div class="chunk-stats-bar" id="chunk-stats-bar">
@@ -1720,6 +1739,7 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
         <div id="orgs-list-head">
           <div class="orgs-view-title">Orgs <span id="orgs-proj-label" style="font-size:11px;font-weight:400;opacity:0.5;margin-left:6px;"></span></div>
           <div class="orgs-view-sub" id="orgs-view-sub">MASTERMIND organizations</div>
+          <div style="margin-top:8px"><input class="filter-input" id="org-list-filter" type="text" placeholder="Filter orgs…" oninput="filterOrgList(this.value)" title="Filter organizations by name or goal" style="width:100%;box-sizing:border-box"></div>
         </div>
         <div id="orgs-list-scroll">
           <div class="loading-txt" id="orgs-list-content">Loading…</div>
@@ -1740,17 +1760,42 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
             <span class="odh-pill" id="odh-topo">—</span>
             <span class="odh-pill" id="odh-roles">0 roles</span>
             <div class="odh-right">
-              <button class="btn" id="org-stop-btn" onclick="v2StopOrg()" style="display:none;color:var(--red);border-color:oklch(60% 0.18 25 / 0.4)">Stop</button>
+              <button class="btn" id="org-copy-btn" onclick="v2ShowCopyOrgDialog()" title="Copy this org to another project">Copy to…</button>
+              <button class="btn" id="org-stop-btn" title="Stop this organization" onclick="v2StopOrg()" style="display:none;color:var(--red);border-color:oklch(60% 0.18 25 / 0.4)">Stop</button>
             </div>
           </div>
+
+          <!-- Copy org dialog (overlay within the detail pane) -->
+          <div id="org-copy-dialog" style="display:none;position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.55);z-index:200;align-items:center;justify-content:center">
+            <div style="background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:24px 28px;min-width:320px;max-width:480px;width:90%;box-shadow:0 8px 32px rgba(0,0,0,0.4)">
+              <div style="font-size:13px;font-weight:600;color:var(--text-hi);margin-bottom:4px">Copy org to another project</div>
+              <div style="font-size:11px;color:var(--text-lo);margin-bottom:16px">The org config will be copied into the selected project&#39;s <code style="font-family:var(--mono)">.monomind/orgs/</code> directory.</div>
+              <div style="margin-bottom:12px">
+                <label style="font-size:11px;color:var(--text-lo);display:block;margin-bottom:5px">Destination project</label>
+                <select id="org-copy-dest-select" title="Select destination project" onchange="if(this.value!=='__custom__')document.getElementById('org-copy-dest-input').value=this.value" style="width:100%;background:var(--surface-hi);border:1px solid var(--border);border-radius:5px;padding:7px 10px;font-size:12px;color:var(--text-hi);font-family:var(--mono)">
+                  <option value="">Loading projects…</option>
+                </select>
+              </div>
+              <div style="margin-bottom:14px">
+                <label style="font-size:11px;color:var(--text-lo);display:block;margin-bottom:5px">Or enter a custom absolute path</label>
+                <input id="org-copy-dest-input" type="text" placeholder="/absolute/path/to/project" style="width:100%;background:var(--surface-hi);border:1px solid var(--border);border-radius:5px;padding:7px 10px;font-size:12px;color:var(--text-hi);font-family:var(--mono);box-sizing:border-box" />
+              </div>
+              <div id="org-copy-feedback" style="font-size:11px;margin-bottom:10px;min-height:16px"></div>
+              <div style="display:flex;gap:8px;justify-content:flex-end">
+                <button class="btn" title="Discard and close copy dialog" onclick="v2HideCopyOrgDialog()">Cancel</button>
+                <button class="btn" id="org-copy-confirm-btn" title="Copy org to selected project" onclick="v2DoCopyOrg()" style="color:var(--accent);border-color:var(--accent)">Copy</button>
+              </div>
+            </div>
+          </div>
+
           <div id="org-detail-tabs">
-            <button class="odt-btn active" data-tab="chart" onclick="v2SwitchOrgTab('chart')">Chart</button>
-            <button class="odt-btn" data-tab="activity" onclick="v2SwitchOrgTab('activity')">Activity</button>
-            <button class="odt-btn" data-tab="health" onclick="v2SwitchOrgTab('health')">Health</button>
-            <button class="odt-btn" data-tab="approvals" onclick="v2SwitchOrgTab('approvals')">Approvals</button>
-            <button class="odt-btn" data-tab="budgets"   onclick="v2SwitchOrgTab('budgets')">Budgets</button>
-            <button class="odt-btn" data-tab="charts"       onclick="v2SwitchOrgTab('charts')">Charts</button>
-            <button class="odt-btn" data-tab="skills"       onclick="v2SwitchOrgTab('skills')">Skills</button>
+            <button class="odt-btn active" data-tab="chart" title="Agent topology chart" onclick="v2SwitchOrgTab('chart')">Chart</button>
+            <button class="odt-btn" data-tab="activity" title="Recent org activity" onclick="v2SwitchOrgTab('activity')">Activity</button>
+            <button class="odt-btn" data-tab="health" title="Org health and status checks" onclick="v2SwitchOrgTab('health')">Health</button>
+            <button class="odt-btn" data-tab="approvals" title="Pending approvals" onclick="v2SwitchOrgTab('approvals')">Approvals</button>
+            <button class="odt-btn" data-tab="budgets"   title="Token budget allocation" onclick="v2SwitchOrgTab('budgets')">Budgets</button>
+            <button class="odt-btn" data-tab="charts"       title="Performance charts" onclick="v2SwitchOrgTab('charts')">Charts</button>
+            <button class="odt-btn" data-tab="skills"       title="Available skills for this org" onclick="v2SwitchOrgTab('skills')">Skills</button>
           </div>
           <div id="org-detail-body">
             <div class="odt-pane active" id="odt-chart"></div>
@@ -1799,13 +1844,13 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
         <div class="pg-sub">Knowledge graph — dependencies, structure, analysis</div>
         <!-- Tab bar -->
         <div class="mg-tab-bar">
-          <button class="odt-btn active" data-mgtab="overview" onclick="mgSwitchTab('overview')">Overview</button>
-          <button class="odt-btn" data-mgtab="graph" onclick="mgSwitchTab('graph')">Graph</button>
-          <button class="odt-btn" data-mgtab="analyze" onclick="mgSwitchTab('analyze')">Analyze</button>
-          <button class="odt-btn" data-mgtab="query" onclick="mgSwitchTab('query')">Query</button>
-          <button class="odt-btn" data-mgtab="export" onclick="mgSwitchTab('export')">Export</button>
-          <button class="odt-btn" data-mgtab="report" onclick="mgSwitchTab('report')">Report</button>
-          <button class="odt-btn" data-mgtab="wiki" onclick="mgSwitchTab('wiki')">Wiki</button>
+          <button class="odt-btn active" data-mgtab="overview" title="Graph overview — stats, god nodes, top files" onclick="mgSwitchTab('overview')">Overview</button>
+          <button class="odt-btn" data-mgtab="graph" title="Interactive graph visualization" onclick="mgSwitchTab('graph')">Graph</button>
+          <button class="odt-btn" data-mgtab="analyze" title="Analyze graph structure and communities" onclick="mgSwitchTab('analyze')">Analyze</button>
+          <button class="odt-btn" data-mgtab="query" title="Query the knowledge graph" onclick="mgSwitchTab('query')">Query</button>
+          <button class="odt-btn" data-mgtab="export" title="Export graph in various formats" onclick="mgSwitchTab('export')">Export</button>
+          <button class="odt-btn" data-mgtab="report" title="Generate graph health report" onclick="mgSwitchTab('report')">Report</button>
+          <button class="odt-btn" data-mgtab="wiki" title="Browse nodes as a wiki" onclick="mgSwitchTab('wiki')">Wiki</button>
         </div>
 
         <!-- TAB 1: OVERVIEW -->
@@ -1831,9 +1876,9 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
         <div class="mg-pane" id="mg-tab-graph">
           <iframe id="mg-iframe" src="" style="width:100%;height:500px;border:none;border-radius:6px;background:var(--surface);" title="Monograph graph"></iframe>
           <div class="mg-controls-row">
-            <button class="btn" id="mg-watch-btn" onclick="mgToggleWatch()">WATCH</button>
-            <button class="btn" id="mg-rebuild-btn" onclick="mgRebuild()">REBUILD</button>
-            <a class="btn" id="mg-open-tab-link" href="#" target="_blank" rel="noopener">OPEN IN TAB</a>
+            <button class="btn" id="mg-watch-btn" title="Watch for graph changes and auto-refresh" onclick="mgToggleWatch()">WATCH</button>
+            <button class="btn" id="mg-rebuild-btn" title="Rebuild the knowledge graph from source" onclick="mgRebuild()">REBUILD</button>
+            <a class="btn" id="mg-open-tab-link" href="#" title="Open monograph in a new browser tab" target="_blank" rel="noopener">OPEN IN TAB</a>
             <span class="mg-watch-indicator" id="mg-watch-status">○ IDLE</span>
           </div>
         </div>
@@ -1866,30 +1911,30 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
           <div class="mg-query-section">
             <div class="mqs-title">Impact analysis</div>
             <div class="mg-query-row">
-              <input type="text" id="mg-q-impact-node" placeholder="Node ID / name…" style="flex:1;min-width:140px">
-              <select id="mg-q-impact-dir" style="width:120px">
+              <input type="text" id="mg-q-impact-node" placeholder="Node ID / name…" style="flex:1;min-width:140px" onkeydown="if(event.key==='Enter')mgQueryImpact()">
+              <select id="mg-q-impact-dir" title="Impact direction: upstream, downstream, or both" style="width:120px">
                 <option value="both">Both</option>
                 <option value="upstream">Upstream</option>
                 <option value="downstream">Downstream</option>
               </select>
-              <button class="btn" onclick="mgQueryImpact()">Run</button>
+              <button class="btn" title="Run impact analysis for this node" onclick="mgQueryImpact()">Run</button>
             </div>
             <div id="mg-q-impact-result" class="mg-query-result" style="display:none"></div>
           </div>
           <div class="mg-query-section">
             <div class="mqs-title">Context</div>
             <div class="mg-query-row">
-              <input type="text" id="mg-q-ctx-node" placeholder="Node ID / file path…" style="flex:1;min-width:200px">
-              <button class="btn" onclick="mgQueryContext()">Run</button>
+              <input type="text" id="mg-q-ctx-node" placeholder="Node ID / file path…" style="flex:1;min-width:200px" onkeydown="if(event.key==='Enter')mgQueryContext()">
+              <button class="btn" title="Get 360° context for this node" onclick="mgQueryContext()">Run</button>
             </div>
             <div id="mg-q-ctx-result" class="mg-query-result" style="display:none"></div>
           </div>
           <div class="mg-query-section">
             <div class="mqs-title">Shortest path</div>
             <div class="mg-query-row">
-              <input type="text" id="mg-q-path-from" placeholder="From node…" style="flex:1;min-width:120px">
-              <input type="text" id="mg-q-path-to" placeholder="To node…" style="flex:1;min-width:120px">
-              <button class="btn" onclick="mgQueryPath()">Run</button>
+              <input type="text" id="mg-q-path-from" placeholder="From node…" style="flex:1;min-width:120px" onkeydown="if(event.key==='Enter')mgQueryPath()">
+              <input type="text" id="mg-q-path-to" placeholder="To node…" style="flex:1;min-width:120px" onkeydown="if(event.key==='Enter')mgQueryPath()">
+              <button class="btn" title="Find shortest path between these two nodes" onclick="mgQueryPath()">Run</button>
             </div>
             <div id="mg-q-path-result" class="mg-query-result" style="display:none"></div>
           </div>
@@ -1897,48 +1942,48 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
             <div class="mqs-title">Cypher query</div>
             <div class="mg-query-row" style="flex-direction:column;align-items:stretch">
               <textarea id="mg-q-cypher" placeholder="MATCH (n) RETURN n.name LIMIT 20"></textarea>
-              <button class="btn" style="align-self:flex-end;margin-top:6px" onclick="mgQueryCypher()">Run</button>
+              <button class="btn" title="Execute Cypher query against the graph" style="align-self:flex-end;margin-top:6px" onclick="mgQueryCypher()">Run</button>
             </div>
             <div id="mg-q-cypher-result" class="mg-query-result" style="display:none"></div>
           </div>
           <div class="mg-query-section">
             <div class="mqs-title">Ask the graph</div>
             <div class="mg-query-row">
-              <input type="text" id="mg-q-ask" placeholder="Question or keyword…" style="flex:1;min-width:180px">
-              <select id="mg-q-ask-mode" style="width:110px">
+              <input type="text" id="mg-q-ask" placeholder="Question or keyword…" style="flex:1;min-width:180px" onkeydown="if(event.key==='Enter')mgQueryAsk()">
+              <select id="mg-q-ask-mode" title="Query mode: search, explain, or neighbors" style="width:110px">
                 <option value="search">Search</option>
                 <option value="explain">Explain</option>
                 <option value="neighbors">Neighbors</option>
               </select>
-              <select id="mg-q-ask-budget" style="width:80px">
+              <select id="mg-q-ask-budget" title="Max result count" style="width:80px">
                 <option value="100">100</option>
                 <option value="500">500</option>
                 <option value="1000">1000</option>
               </select>
-              <button class="btn" onclick="mgQueryAsk()">Ask</button>
+              <button class="btn" title="Search or explain a node in the graph" onclick="mgQueryAsk()">Ask</button>
             </div>
             <div id="mg-q-ask-result" class="mg-query-result" style="display:none"></div>
           </div>
           <div class="mg-query-section">
             <div class="mqs-title">Ripple impact <span style="font-size:10px;color:var(--text-xs);font-weight:400">multi-hop cascade</span></div>
             <div class="mg-query-row">
-              <input type="text" id="mg-q-ripple-node" placeholder="Node name or file…" style="flex:1;min-width:160px">
+              <input type="text" id="mg-q-ripple-node" placeholder="Node name or file…" style="flex:1;min-width:160px" onkeydown="if(event.key==='Enter')mgQueryRipple()">
               <select id="mg-q-ripple-hops" style="width:80px" title="Max hops">
                 <option value="2">2 hops</option>
                 <option value="3" selected>3 hops</option>
                 <option value="4">4 hops</option>
                 <option value="5">5 hops</option>
               </select>
-              <button class="btn" onclick="mgQueryRipple()">Run</button>
+              <button class="btn" title="Trace multi-hop ripple impact from this node" onclick="mgQueryRipple()">Run</button>
             </div>
             <div id="mg-q-ripple-result" class="mg-query-result" style="display:none"></div>
           </div>
           <div class="mg-query-section">
             <div class="mqs-title">Import chain <span style="font-size:10px;color:var(--text-xs);font-weight:400">all paths A → B</span></div>
             <div class="mg-query-row">
-              <input type="text" id="mg-q-chain-from" placeholder="From node…" style="flex:1;min-width:120px">
-              <input type="text" id="mg-q-chain-to" placeholder="To node…" style="flex:1;min-width:120px">
-              <button class="btn" onclick="mgQueryImportChain()">Run</button>
+              <input type="text" id="mg-q-chain-from" placeholder="From node…" style="flex:1;min-width:120px" onkeydown="if(event.key==='Enter')mgQueryImportChain()">
+              <input type="text" id="mg-q-chain-to" placeholder="To node…" style="flex:1;min-width:120px" onkeydown="if(event.key==='Enter')mgQueryImportChain()">
+              <button class="btn" title="Find all import paths from A to B" onclick="mgQueryImportChain()">Run</button>
             </div>
             <div id="mg-q-chain-result" class="mg-query-result" style="display:none"></div>
           </div>
@@ -1954,7 +1999,7 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
         <!-- TAB 6: REPORT -->
         <div class="mg-pane" id="mg-tab-report">
           <div style="display:flex;gap:8px;align-items:center;margin-bottom:12px">
-            <button class="btn" onclick="mgLoadReport()">REFRESH REPORT</button>
+            <button class="btn" title="Reload the latest graph health report" onclick="mgLoadReport()">REFRESH REPORT</button>
           </div>
           <div id="mg-report-content"><div class="loading-txt">Loading…</div></div>
         </div>
@@ -1968,14 +2013,14 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
           </div>
           <div class="mg-filter-pills" id="mg-wiki-pills"></div>
           <div class="mg-mode-toggle">
-            <button class="btn" id="mg-wiki-mode-all" onclick="mgWikiMode('all')" style="opacity:1">All</button>
-            <button class="btn" id="mg-wiki-mode-docs" onclick="mgWikiMode('docs')" style="opacity:0.5">Docs</button>
-            <button class="btn" id="mg-wiki-mode-code" onclick="mgWikiMode('code')" style="opacity:0.5">Code</button>
+            <button class="btn" id="mg-wiki-mode-all" title="Show all node types" onclick="mgWikiMode('all')" style="opacity:1">All</button>
+            <button class="btn" id="mg-wiki-mode-docs" title="Show documentation nodes only" onclick="mgWikiMode('docs')" style="opacity:0.5">Docs</button>
+            <button class="btn" id="mg-wiki-mode-code" title="Show code nodes only" onclick="mgWikiMode('code')" style="opacity:0.5">Code</button>
           </div>
           <div class="mg-query-row" style="margin-bottom:10px">
             <input type="text" id="mg-wiki-search" placeholder="Search nodes…" style="flex:1" oninput="mgWikiSearchDebounced(this.value)">
-            <button class="btn" onclick="mgRebuildDocs()" id="mg-build-docs-btn">BUILD DOCS</button>
-            <button class="btn" onclick="mgWikiRefresh()">REFRESH</button>
+            <button class="btn" title="Build documentation from source files" onclick="mgRebuildDocs()" id="mg-build-docs-btn">BUILD DOCS</button>
+            <button class="btn" title="Refresh wiki node list" onclick="mgWikiRefresh()">REFRESH</button>
           </div>
           <div id="mg-wiki-list"></div>
           <div id="mg-wiki-detail" class="mg-detail-panel" style="display:none"></div>
@@ -1994,6 +2039,25 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
       </div>
     </div>
 
+  <div class="view" id="view-global-loops">
+    <div class="vscroll">
+      <div style="display:flex;align-items:baseline;gap:10px;margin-bottom:4px">
+        <div class="pg-title" style="margin-bottom:0">Global Loops</div>
+        <span class="pg-sub" id="gl-sub" style="margin-bottom:0">Loops across all projects</span>
+      </div>
+      <div id="gl-content" style="margin-top:16px"><div class="loading-txt">Loading…</div></div>
+    </div>
+  </div>
+  <div class="view" id="view-global-tokens">
+    <div class="vscroll">
+      <div style="display:flex;align-items:baseline;gap:10px;margin-bottom:4px">
+        <div class="pg-title" style="margin-bottom:0">Global Tokens</div>
+        <span class="pg-sub" id="gt-sub" style="margin-bottom:0">Token usage across all projects</span>
+      </div>
+      <div id="gt-content" style="margin-top:16px"><div class="loading-txt">Loading…</div></div>
+    </div>
+  </div>
+
   </div><!-- /view-wrap -->
 </div><!-- /main -->
 <div id="app-ambient-hint">Press A to exit ambient mode</div>
@@ -2006,12 +2070,12 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
     <button id="mm-close" onclick="closeMastermind()" aria-label="Close">✕</button>
   </div>
   <div id="mm-tabs-bar">
-    <button class="mm-tab-btn active" data-mmtab="orgs" onclick="mmSwitchTab('orgs')">Orgs</button>
-    <button class="mm-tab-btn" data-mmtab="skills" onclick="mmSwitchTab('skills')">Skills</button>
-    <button class="mm-tab-btn" data-mmtab="loops" onclick="mmSwitchTab('loops')">Loops</button>
-    <button class="mm-tab-btn" data-mmtab="createorg" onclick="mmSwitchTab('createorg')">Create Org</button>
-    <button class="mm-tab-btn" data-mmtab="metrics" onclick="mmSwitchTab('metrics')">Metrics</button>
-    <button class="mm-tab-btn" data-mmtab="graph" onclick="mmSwitchTab('graph')">Graph</button>
+    <button class="mm-tab-btn active" data-mmtab="orgs" title="Manage organizations" onclick="mmSwitchTab('orgs')">Orgs</button>
+    <button class="mm-tab-btn" data-mmtab="skills" title="Browse available skills" onclick="mmSwitchTab('skills')">Skills</button>
+    <button class="mm-tab-btn" data-mmtab="loops" title="Active automation loops" onclick="mmSwitchTab('loops')">Loops</button>
+    <button class="mm-tab-btn" data-mmtab="createorg" title="Create a new organization" onclick="mmSwitchTab('createorg')">Create Org</button>
+    <button class="mm-tab-btn" data-mmtab="metrics" title="Performance metrics and stats" onclick="mmSwitchTab('metrics')">Metrics</button>
+    <button class="mm-tab-btn" data-mmtab="graph" title="Knowledge graph explorer" onclick="mmSwitchTab('graph')">Graph</button>
   </div>
   <div id="mm-body"></div>
 </div>
@@ -2021,10 +2085,10 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
   <div id="chunk-modal-box">
     <div id="chunk-modal-title">Edit Chunk</div>
     <div id="chunk-modal-src"></div>
-    <textarea id="chunk-modal-ta" spellcheck="false"></textarea>
+    <textarea id="chunk-modal-ta" placeholder="Chunk content…" spellcheck="false"></textarea>
     <div class="chunk-modal-btns">
-      <button class="btn" onclick="closeChunkModal()">Cancel</button>
-      <button class="btn" style="color:var(--accent);border-color:var(--accent)" onclick="saveChunkModal()">Save</button>
+      <button class="btn" title="Discard changes" onclick="closeChunkModal()">Cancel</button>
+      <button class="btn" title="Save chunk changes" style="color:var(--accent);border-color:var(--accent)" onclick="saveChunkModal()">Save</button>
     </div>
   </div>
 </div>
@@ -2032,10 +2096,10 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
 <div id="mem-modal" onclick="if(event.target===this)closeMemModal()">
   <div id="mem-modal-box">
     <div id="mem-modal-title">Edit Memory</div>
-    <textarea id="mem-modal-ta" spellcheck="false"></textarea>
+    <textarea id="mem-modal-ta" placeholder="Memory content (YAML or markdown)…" spellcheck="false"></textarea>
     <div class="mem-modal-btns">
-      <button class="btn" onclick="closeMemModal()">Cancel</button>
-      <button class="btn" style="color:var(--accent);border-color:var(--accent)" onclick="saveMemModal()">Save</button>
+      <button class="btn" title="Discard changes" onclick="closeMemModal()">Cancel</button>
+      <button class="btn" title="Save memory entry" style="color:var(--accent);border-color:var(--accent)" onclick="saveMemModal()">Save</button>
     </div>
   </div>
 </div>
@@ -2046,8 +2110,8 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
   <div id="report-box">
     <div class="rp-head">
       <span class="rp-title">Report Card</span>
-      <button class="rp-copy-btn" onclick="copyReportCard()">⎘ Copy</button>
-      <button class="rp-close-btn" onclick="closeReportCard()">✕</button>
+      <button class="rp-copy-btn" onclick="copyReportCard()" title="Copy report to clipboard">⎘ Copy</button>
+      <button class="rp-close-btn" onclick="closeReportCard()" title="Close report">✕</button>
     </div>
     <div id="report-content"><pre id="report-pre"></pre></div>
   </div>
@@ -2056,7 +2120,7 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
 <!-- shortcut help modal -->
 <div id="shortcut-modal" onclick="if(event.target===this)closeShortcutHelp()">
   <div id="shortcut-box">
-    <div class="sk-title">Keyboard Shortcuts <button class="sk-close" onclick="closeShortcutHelp()">✕</button></div>
+    <div class="sk-title">Keyboard Shortcuts <button class="sk-close" onclick="closeShortcutHelp()" title="Close shortcuts help">✕</button></div>
     <div class="sk-section">Sessions view</div>
     <div class="sk-row"><span class="sk-desc">Navigate rows</span><span class="sk-keys"><kbd>J</kbd><kbd>K</kbd></span></div>
     <div class="sk-row"><span class="sk-desc">Open focused session</span><span class="sk-keys"><kbd>↵</kbd></span></div>
@@ -2065,12 +2129,17 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
     <div class="sk-row"><span class="sk-desc">Open detail drawer</span><span class="sk-keys"><kbd>↵</kbd></span></div>
     <div class="sk-row"><span class="sk-desc">Search in feed</span><span class="sk-keys"><kbd>/</kbd></span></div>
     <div class="sk-row"><span class="sk-desc">Jump to live session</span><span class="sk-keys"><kbd>G</kbd></span></div>
-    <div class="sk-row"><span class="sk-desc">Refresh current view</span><span class="sk-keys"><kbd>R</kbd></span></div>
     <div class="sk-row"><span class="sk-desc">Toggle ambient mode</span><span class="sk-keys"><kbd>A</kbd></span></div>
     <div class="sk-section">Global</div>
+    <div class="sk-row"><span class="sk-desc">Refresh current view</span><span class="sk-keys"><kbd>R</kbd></span></div>
+    <div class="sk-row"><span class="sk-desc">Open Mastermind overlay</span><span class="sk-keys"><kbd>M</kbd></span></div>
     <div class="sk-row"><span class="sk-desc">Command palette</span><span class="sk-keys"><kbd>⌘</kbd><kbd>K</kbd></span></div>
     <div class="sk-row"><span class="sk-desc">Close / dismiss</span><span class="sk-keys"><kbd>Esc</kbd></span></div>
     <div class="sk-row"><span class="sk-desc">This help</span><span class="sk-keys"><kbd>?</kbd></span></div>
+    <div class="sk-section">View navigation</div>
+    <div class="sk-row"><span class="sk-desc">Now / Sessions / Projects</span><span class="sk-keys"><kbd>1</kbd><kbd>2</kbd><kbd>3</kbd></span></div>
+    <div class="sk-row"><span class="sk-desc">Loops / Tokens / Memory</span><span class="sk-keys"><kbd>4</kbd><kbd>5</kbd><kbd>6</kbd></span></div>
+    <div class="sk-row"><span class="sk-desc">Orgs / Monograph / Global</span><span class="sk-keys"><kbd>7</kbd><kbd>8</kbd><kbd>9</kbd></span></div>
   </div>
 </div>
 
@@ -2087,8 +2156,8 @@ textarea.sess-note-input:focus { border-color:var(--accent); }
       <input class="bm-input" id="bm-monthly" type="number" min="0" step="10" placeholder="e.g. 200">
     </div>
     <div class="bm-btns">
-      <button class="bm-cancel" onclick="closeBudgetModal()">Cancel</button>
-      <button class="bm-save" onclick="saveBudget()">Save</button>
+      <button class="bm-cancel" title="Discard budget changes" onclick="closeBudgetModal()">Cancel</button>
+      <button class="bm-save" title="Save token budget settings" onclick="saveBudget()">Save</button>
     </div>
   </div>
 </div>
@@ -2108,13 +2177,13 @@ let userScrolled = false;
 let selectedEntryId = null;
 let allDrawers = [];
 let dismissedAlerts = new Set();
-let alertState = { todayCost: 0, errorCount: 0, longLoops: [], anomaly: null, budgetAlert: null, budgetCls: 'alert-warn' };
+let alertState = { todayCost: 0, monthCost: 0, errorCount: 0, longLoops: [], hilLoops: [], anomaly: null, budgetAlert: null, budgetCls: 'alert-warn' };
 let feedTimeFilter = 'all';
 let cmdFocusIdx = 0;
 let cmdItems = [];
 let liveTailMode = false;
 let liveTailTimer = null;
-let bookmarks = new Set(JSON.parse(localStorage.getItem('mm-bookmarks') || '[]'));
+let bookmarks = new Set((function(){ try { return JSON.parse(localStorage.getItem('mm-bookmarks') || '[]'); } catch { return []; } })());
 let showStarredOnly = false;
 
 // ── nav ────────────────────────────────────────────────────
@@ -2132,8 +2201,11 @@ function switchView(v) {
     el.classList.toggle('active', el.dataset.view === v));
   document.querySelectorAll('.view').forEach(el =>
     el.classList.toggle('active', el.id === 'view-' + v));
-  const titles = { now:'Now', projects:'Projects', sessions:'Sessions', loops:'Loops', tokens:'Tokens', memory:'Memory', orgs:'Orgs', monograph:'Monograph', global:'Global Feed' };
-  document.getElementById('view-title').textContent = titles[v] || v;
+  const titles = { now:'Now', projects:'Projects', sessions:'Sessions', loops:'Loops', tokens:'Tokens', memory:'Memory', orgs:'Orgs', monograph:'Monograph', global:'Global Feed', 'global-loops':'Global Loops', 'global-tokens':'Global Tokens' };
+  const viewLabel = titles[v] || v;
+  document.getElementById('view-title').textContent = viewLabel;
+  const proj = DIR.split('/').filter(Boolean).pop() || '';
+  document.title = proj ? `${viewLabel} — ${proj} | monomind` : `${viewLabel} | monomind`;
   // Projects always re-fetches so onclick paths in cards stay current
   if (v === 'projects') { renderProjects(); return; }
   if (!viewRendered[v]) { renderView(v); viewRendered[v] = true; }
@@ -2149,6 +2221,8 @@ function renderView(v) {
   if (v === 'orgs') renderOrgs();
   if (v === 'monograph') loadMonograph();
   if (v === 'global') renderGlobalFeed();
+  if (v === 'global-loops') renderGlobalLoops();
+  if (v === 'global-tokens') renderGlobalTokens();
 }
 
 function refreshCurrent() {
@@ -2164,7 +2238,9 @@ async function init() {
     ORIGINAL_DIR = DIR;
     gitUser = gu;
     document.getElementById('sb-user').textContent = gu.name || gu.email || '—';
-    document.getElementById('sb-path').textContent = DIR;
+    const sbPath = document.getElementById('sb-path');
+    sbPath.textContent = shortPath(DIR);
+    sbPath.title = DIR;
     document.getElementById('sb-proj').textContent = DIR.split('/').filter(Boolean).pop() || '—';
     _showNavProjectCtx(DIR);
   } catch (_) {}
@@ -2197,7 +2273,9 @@ async function init() {
     } catch (_) {}
     DIR = projParam;
     document.getElementById('sb-proj').textContent = DIR.split('/').filter(Boolean).pop() || '—';
-    document.getElementById('sb-path').textContent = DIR;
+    const sbPath2 = document.getElementById('sb-path');
+    sbPath2.textContent = shortPath(DIR);
+    sbPath2.title = DIR;
     _showNavProjectCtx(DIR);
   }
   restoreURLParams();
@@ -2208,9 +2286,30 @@ async function init() {
   initSSE();
 }
 
+function _setLiveMode(mode) {
+  const dot = document.querySelector('.live-dot');
+  const pill = dot?.closest('.pill');
+  if (!dot) return;
+  if (mode === 'sse') {
+    dot.classList.remove('polling');
+    dot.title = 'Live (SSE)';
+    if (pill) { const t = pill.lastChild; if (t?.nodeType === 3) t.textContent = ' live'; }
+  } else {
+    dot.classList.add('polling');
+    dot.title = 'Polling every 30s (SSE unavailable)';
+    if (pill) { const t = pill.lastChild; if (t?.nodeType === 3) t.textContent = ' polling'; }
+  }
+}
+
 function startPolling() {
   clearInterval(pollTimer);
-  pollTimer = setInterval(() => { if (currentView === 'now') refreshNowSilent(); }, 30000);
+  _setLiveMode('poll');
+  pollTimer = setInterval(() => {
+    if (currentView === 'now') refreshNowSilent();
+    else if (currentView === 'loops') renderLoops();
+    else viewRendered['loops'] = false; // loops data may be stale — re-fetch on next nav
+    loadLoopMetrics();
+  }, 30000);
 }
 
 let _sseSource = null;
@@ -2220,16 +2319,17 @@ function initSSE() {
   try {
     const src = new EventSource('/api/events-stream?dir=' + enc(DIR));
     src.addEventListener('update', () => { if (currentView === 'now') refreshNowSilent(); });
-    src.addEventListener('connected', () => {});
+    src.addEventListener('connected', () => { _setLiveMode('sse'); });
     src.onerror = () => { src.close(); _sseSource = null; startPolling(); };
     _sseSource = src;
     clearInterval(pollTimer); // SSE replaces polling
+    _setLiveMode('sse');
   } catch { startPolling(); }
 }
 
 async function apiFetch(url) {
   const r = await fetch(url);
-  if (!r.ok) throw new Error(r.status);
+  if (!r.ok) throw new Error(`HTTP ${r.status}${r.statusText ? ' ' + r.statusText : ''}`);
   return r.json();
 }
 
@@ -2262,7 +2362,9 @@ function switchProject(path) {
   _mgLoaded = false;
   _mgGraph = null;
   document.getElementById('sb-proj').textContent = path.split('/').filter(Boolean).pop() || '—';
-  document.getElementById('sb-path').textContent = path;
+  const sbPath3 = document.getElementById('sb-path');
+  sbPath3.textContent = shortPath(path);
+  sbPath3.title = path;
   _showNavProjectCtx(path);
   viewRendered = {};
   allSessions = [];
@@ -2320,7 +2422,7 @@ async function loadFeed() {
     allSessions = sessions;
     document.getElementById('bdg-sessions').textContent = sessions.length || '—';
     if (!sessions.length) {
-      setFeedContent('<div class="feed-empty">No sessions yet in this project.</div>');
+      setFeedContent('<div class="feed-empty">No sessions yet in this project.<br><span style="font-size:11px;opacity:0.7">Start Claude Code inside this project to record a session.</span></div>');
       return;
     }
     sessionIdx = 0;
@@ -2351,7 +2453,9 @@ async function loadFeedSilent() {
 
 async function loadFeedForSession(sess) {
   if (!sess) return;
-  document.getElementById('feed-sess').textContent = sess.id.slice(0, 8) + '…';
+  const feedSessEl = document.getElementById('feed-sess');
+  feedSessEl.textContent = sess.id.slice(0, 8) + '…';
+  feedSessEl.title = sess.id;
   document.getElementById('btn-prev-sess').style.opacity = sessionIdx < allSessions.length - 1 ? '1' : '0.3';
   document.getElementById('btn-next-sess').style.opacity = sessionIdx > 0 ? '1' : '0.3';
   showSessCtx(sess);
@@ -2409,7 +2513,7 @@ function catLabel(c) {
 
 function renderFeedEvents(events, silent) {
   if (!events.length) {
-    if (!silent) setFeedContent('<div class="feed-empty">No events in this session yet.</div>');
+    if (!silent) setFeedContent('<div class="feed-empty">No events in this session yet.<br><span style="font-size:11px;opacity:0.7">Events appear as Claude Code runs tools and makes edits.</span></div>');
     return;
   }
 
@@ -2426,7 +2530,7 @@ function renderFeedEvents(events, silent) {
   if (feedTimeFilter !== 'all') {
     const ms = { '1h': 3600000, '6h': 21600000, '24h': 86400000 }[feedTimeFilter] || 0;
     const cutoff = Date.now() - ms;
-    visible = filtered.filter(ev => !ev.ts || new Date(ev.ts).getTime() >= cutoff);
+    visible = filtered.filter(ev => !ev.ts || (typeof ev.ts === 'number' ? ev.ts : Number(ev.ts) || 0) >= cutoff);
   }
 
   // update error alert state
@@ -2480,7 +2584,7 @@ function renderFeedEvents(events, silent) {
 
 function renderGroupRow(g) {
   const { ico, catCls } = toolStyle(g.cat, '');
-  const itemsData = JSON.stringify(g.items).replace(/'/g, '&#39;');
+  const itemsData = JSON.stringify(g.items).replace(/</g, '\\u003c').replace(/>/g, '\\u003e').replace(/'/g, '&#39;');
   return `<div class="feed-group" data-items='${itemsData}' onclick="expandGroup(this)">
     <div class="feed-ico ${catCls}" style="font-size:9px">${ico}</div>
     <span class="fg-label">${g.count} ${esc(g.label)}</span>
@@ -2499,7 +2603,8 @@ function expandGroup(el) {
 
 function renderFeedEntry(ev) {
   const ts = ev.ts ? relTime(ev.ts) : '';
-  let lbl = '', detail = '', id = ev.id || ev.uuid || '';
+  const tsTitle = ev.ts ? new Date(typeof ev.ts === 'number' ? ev.ts : Number(ev.ts) || ev.ts).toLocaleString() : '';
+  let lbl = '', detail = '', lblTitle = '', id = ev.id || ev.uuid || '';
   let catCls, ico;
 
   if (ev.kind === 'tool') {
@@ -2509,20 +2614,21 @@ function renderFeedEntry(ev) {
   } else {
     ico = '↵'; catCls = 'cat-user';
     const t = (ev.text || '').trim();
-    lbl = esc(t.length > 90 ? t.slice(0, 90) + '…' : t);
+    if (t.length > 90) { lbl = esc(t.slice(0, 90) + '…'); lblTitle = esc(t); }
+    else lbl = esc(t);
   }
 
   const errClass = ev._errored ? ' errored' : '';
   const selClass = selectedEntryId && selectedEntryId === id ? ' selected' : '';
 
-  const evData = JSON.stringify(ev).replace(/'/g, '&#39;');
+  const evData = JSON.stringify(ev).replace(/</g, '\\u003c').replace(/>/g, '\\u003e').replace(/'/g, '&#39;');
   return `<div class="feed-entry k-${ev.kind}${errClass}${selClass}" data-ev='${evData}' onclick="openDetail(this.dataset.ev)">
     <div class="feed-ico ${catCls}">${ico}</div>
     <div class="feed-body">
-      <div class="feed-lbl">${lbl}</div>
+      <div class="feed-lbl"${lblTitle ? ` title="${lblTitle}"` : ''}>${lbl}</div>
       ${detail ? `<div class="feed-detail">${detail}</div>` : ''}
     </div>
-    <div class="feed-ts">${ts}</div>
+    <div class="feed-ts"${tsTitle ? ` title="${tsTitle}"` : ''}>${ts}</div>
   </div>`;
 }
 
@@ -2558,20 +2664,23 @@ function openDetail(evJson) {
 
   if (ev.kind === 'tool') {
     const { catCls } = toolStyle(ev.cat, ev.name);
+    const _toolId = (ev.id || '').toString();
+    const _toolLabel = ev.label || ev.name || '';
     title = ev.name || 'Tool';
     bodyHtml = `
       <div class="d-cat-pill ${catCls}" style="font-size:11px">${esc(ev.cat || 'other')}</div>
-      <div class="d-row"><div class="d-lbl">Label</div><div class="d-val">${esc(ev.label || ev.name)}</div></div>
+      <div class="d-row"><div class="d-lbl">Label</div><div class="d-val" style="display:flex;align-items:center;gap:6px"><span>${esc(_toolLabel)}</span>${_toolLabel ? `<button class="btn" style="flex-shrink:0;font-size:10px;padding:1px 5px" title="Copy label" onclick="navigator.clipboard.writeText(${JSON.stringify(_toolLabel).replace(/"/g, '&quot;')}).then(()=>showToast('Copied','Label copied','ok'))">⎘</button>` : ''}</div></div>
       ${ev.subagent ? `<div class="d-row"><div class="d-lbl">Subagent</div><div class="d-val">${esc(ev.subagent)}</div></div>` : ''}
       ${ev._errored ? `<div class="d-row"><div class="d-lbl">Status</div><div class="d-val error">Error</div></div>` : ''}
-      <div class="d-row"><div class="d-lbl">Time</div><div class="d-val">${ev.ts ? new Date(ev.ts).toLocaleTimeString() : '—'}</div></div>
-      <div class="d-row"><div class="d-lbl">Tool ID</div><div class="d-val mono">${esc((ev.id || '').slice(0, 24))}</div></div>
+      <div class="d-row"><div class="d-lbl">Time</div><div class="d-val">${ev.ts ? new Date(typeof ev.ts === 'number' ? ev.ts : Number(ev.ts) || ev.ts).toLocaleString() : '—'}</div></div>
+      <div class="d-row"><div class="d-lbl">Tool ID</div><div class="d-val" style="display:flex;align-items:center;gap:6px"><span class="mono" title="${esc(_toolId)}">${esc(_toolId.slice(0, 24))}${_toolId.length > 24 ? '…' : ''}</span>${_toolId ? `<button class="btn" style="flex-shrink:0;font-size:10px;padding:1px 5px" title="Copy tool ID" onclick="navigator.clipboard.writeText(${JSON.stringify(_toolId).replace(/"/g, '&quot;')}).then(()=>showToast('Copied','Tool ID copied','ok'))">⎘</button>` : ''}</div></div>
     `;
   } else if (ev.kind === 'user') {
+    const _userText = ev.text || '';
     title = 'User message';
     bodyHtml = `
-      <div class="d-row"><div class="d-lbl">Time</div><div class="d-val">${ev.ts ? new Date(ev.ts).toLocaleTimeString() : '—'}</div></div>
-      <div class="d-row"><div class="d-lbl">Message</div><div class="d-val" style="white-space:pre-wrap">${esc(ev.text || '')}</div></div>
+      <div class="d-row"><div class="d-lbl">Time</div><div class="d-val">${ev.ts ? new Date(typeof ev.ts === 'number' ? ev.ts : Number(ev.ts) || ev.ts).toLocaleString() : '—'}</div></div>
+      <div class="d-row"><div class="d-lbl">Message</div><div class="d-val"><div style="white-space:pre-wrap;margin-bottom:6px">${esc(_userText)}</div>${_userText ? `<button class="btn" style="font-size:10px;padding:1px 6px" title="Copy message text" onclick="navigator.clipboard.writeText(${JSON.stringify(_userText).replace(/"/g, '&quot;')}).then(()=>showToast('Copied','Message copied','ok'))">⎘ Copy</button>` : ''}</div></div>
     `;
   }
 
@@ -2594,15 +2703,15 @@ function buildSparkline() {
   for (const s of allSessions) {
     const ts = s.lastTs || s.mtime;
     if (!ts) continue;
-    const age = now - (typeof ts === 'number' ? ts : new Date(ts).getTime());
+    const age = now - (typeof ts === 'number' ? ts : Number(ts) || new Date(ts).getTime() || 0);
     const idx = DAYS - 1 - Math.floor(age / DAY);
     if (idx >= 0 && idx < DAYS) buckets[idx]++;
   }
   const max = Math.max(...buckets, 1);
-  // offset so first cell starts on Monday of the week 12 weeks ago
-  const todayDow = new Date().getDay(); // 0=Sun
-  // pad start so column 0 begins on Monday
-  const startOffset = todayDow === 0 ? 6 : todayDow - 1;
+  // pad so first column starts on Monday: compute day-of-week for day 0 (83 days ago)
+  const firstDow = new Date(now - (DAYS - 1) * DAY).getDay(); // 0=Sun
+  const startOffset = firstDow === 0 ? 6 : firstDow - 1; // Mon=0 offset
+  const padCells = Array.from({ length: startOffset }, () => '<div class="cal-cell" style="opacity:0"></div>');
   const cells = buckets.map((v, i) => {
     const isToday = i === DAYS - 1;
     const level = v === 0 ? 0 : Math.min(4, Math.ceil(v / max * 4));
@@ -2611,7 +2720,7 @@ function buildSparkline() {
     const title = `${label}: ${v} session${v !== 1 ? 's' : ''}`;
     return `<div class="cal-cell cal-${level}${isToday ? ' cal-today' : ''}" title="${title}"></div>`;
   });
-  return `<div class="spark-wrap"><div class="spark-lbl">12-week activity ${buildWowDelta()}</div><div class="cal-grid">${cells.join('')}</div></div>`;
+  return `<div class="spark-wrap"><div class="spark-lbl">12-week activity ${buildWowDelta()}</div><div class="cal-grid">${padCells.join('')}${cells.join('')}</div></div>`;
 }
 
 // ── alerts rail ────────────────────────────────────────────
@@ -2641,6 +2750,10 @@ function updateAlerts() {
     all.push({ id: 'loop-' + l, cls: 'alert-warn', ico: '↺', msg: `Long-running loop: ${l}` });
   }
 
+  for (const l of (alertState.hilLoops || [])) {
+    all.push({ id: 'hil-' + l, cls: 'alert-warn', ico: '⚠', msg: `Loop waiting for response: ${l}`, action: `switchView('loops')` });
+  }
+
   const visible = all.filter(a => !dismissedAlerts.has(a.id));
   if (!visible.length) {
     rail.className = '';
@@ -2650,7 +2763,7 @@ function updateAlerts() {
   rail.className = 'has-alerts';
   rail.innerHTML = visible.map(a =>
     `<div class="alert-item ${a.cls}" data-alert-id="${a.id}"${a.action ? ` onclick="${a.action}" style="cursor:pointer"` : ''}>
-      <span class="al-ico">${a.ico}</span>${esc(a.msg)}<span class="al-x" onclick="event.stopPropagation();dismissAlert('${a.id}')">✕</span>
+      <span class="al-ico">${a.ico}</span>${esc(a.msg)}<span class="al-x" title="Dismiss" onclick="event.stopPropagation();dismissAlert('${a.id}')">✕</span>
     </div>`).join('');
 }
 
@@ -2682,7 +2795,12 @@ function showSessCtx(sess) {
     bar.classList.remove('show');
     return;
   }
-  document.getElementById('sctx-label').textContent = sess.lastPrompt || sess.id.slice(0, 16) + '…';
+  const sCtxAge = sess.lastTs || sess.mtime;
+  const sCtxTime = sCtxAge ? ' · ' + relTime(sCtxAge) : '';
+  const sCtxText = sess.lastPrompt || sess.id.slice(0, 16) + '…';
+  const label = document.getElementById('sctx-label');
+  label.textContent = sCtxText + sCtxTime;
+  label.title = sCtxText + (sCtxAge ? ' · ' + new Date(typeof sCtxAge === 'number' ? sCtxAge : Number(sCtxAge) || sCtxAge).toLocaleString() : '');
   bar.classList.add('show');
 }
 
@@ -2704,6 +2822,7 @@ async function loadTodayMetrics() {
     const data = await apiFetch('/api/section?name=tokens&dir=' + enc(DIR));
     const s = data?.tokens?.summary || {};
     alertState.todayCost = typeof s.todayCost === 'number' ? s.todayCost : 0;
+    alertState.monthCost = typeof s.monthCost === 'number' ? s.monthCost : 0;
     updateAlerts();
     checkBudget();
     // topbar cost badge
@@ -2740,13 +2859,17 @@ async function loadLoopMetrics() {
   try {
     const data = await apiFetch('/api/loops?dir=' + enc(DIR));
     const loops = Array.isArray(data) ? data : (data.loops || []);
-    document.getElementById('bdg-loops').textContent = loops.length || '—';
+    const hilCount = loops.filter(l => l.status === 'hil:pending').length;
+    document.getElementById('bdg-loops').textContent = loops.length ? (hilCount ? loops.length + '⚠' : loops.length) : '—';
 
     // alert on loops running > 2h
     const TWO_HOURS = 2 * 3600 * 1000;
     const now = Date.now();
     alertState.longLoops = loops
-      .filter(l => l.status !== 'stopped' && l.status !== 'paused' && l.startedAt && (now - new Date(l.startedAt).getTime()) > TWO_HOURS)
+      .filter(l => l.status !== 'stopped' && l.status !== 'paused' && l.status !== 'hil:pending' && l.startedAt && (now - new Date(l.startedAt).getTime()) > TWO_HOURS)
+      .map(l => (l.name || l.prompt || 'loop').split('--')[0].trim().slice(0, 30));
+    alertState.hilLoops = loops
+      .filter(l => l.status === 'hil:pending')
       .map(l => (l.name || l.prompt || 'loop').split('--')[0].trim().slice(0, 30));
     updateAlerts();
 
@@ -2755,13 +2878,24 @@ async function loadLoopMetrics() {
       return;
     }
     const items = loops.slice(0, 5).map(l => {
-      const name = (l.name || l.prompt || 'loop').split('--')[0].trim().slice(0, 36);
+      const fullName = (l.name || l.prompt || 'loop').split('--')[0].trim();
+      const name = fullName.slice(0, 36);
+      const isHilMini = l.status === 'hil:pending';
+      const isTillendMini = l.type === 'tillend';
+      const intervalMini = fmtInterval(l.interval || l.schedule) || 'running';
+      const repMini = isTillendMini && l.currentRep ? `run ${l.currentRep}${l.maxReps ? '/' + l.maxReps : ''}` : null;
+      const hilDot = isHilMini ? ' <span style="color:oklch(75% 0.16 60);font-size:9px">⚠HIL</span>' : '';
+      const typeDot = isTillendMini ? '<span style="color:oklch(70% 0.18 280);font-size:9px;margin-right:3px">∞</span>' : '';
       return `<div class="mini-loop">
-        <div class="ml-name">${esc(name)}</div>
-        <div class="ml-meta"><span class="ml-dot"></span>${esc(l.interval || l.schedule || 'running')}</div>
+        <div class="ml-name" title="${esc(fullName)}">${typeDot}${esc(name)}${hilDot}</div>
+        <div class="ml-meta"><span class="ml-dot"></span>${esc(repMini || intervalMini)}</div>
       </div>`;
     }).join('');
-    document.getElementById('m-loops').innerHTML = `<div class="m-group-title">Active Loops</div>${items}`;
+    const overflow = loops.length > 5 ? loops.length - 5 : 0;
+    const overflowNote = overflow > 0
+      ? `<div style="font-size:10px;color:var(--text-xs);padding:3px 0 0">+${overflow} more — open Loops tab</div>`
+      : '';
+    document.getElementById('m-loops').innerHTML = `<div class="m-group-title">Active Loops</div>${items}${overflowNote}`;
   } catch (_) {
     document.getElementById('m-loops').innerHTML = `<div class="m-group-title">Active Loops</div><div class="loading-txt">—</div>`;
   }
@@ -2793,16 +2927,16 @@ async function loadStatusStrip() {
 
     // HNSW status
     const hnswOn = mem.hnsw === true || mem.hnswEnabled === true || mem.hnsw_enabled === true;
-    pills.push(`<span class="ss-pill ${hnswOn ? 'on' : ''}">HNSW ${hnswOn ? 'ON' : 'OFF'}</span>`);
+    pills.push(`<span class="ss-pill ${hnswOn ? 'on' : ''}" title="Hierarchical Navigable Small World index — fast approximate nearest-neighbour memory search">HNSW ${hnswOn ? 'ON' : 'OFF'}</span>`);
 
     // Patterns count
     if (mem.patterns != null) {
-      pills.push(`<span class="ss-pill">PATTERNS ${Number(mem.patterns).toLocaleString()}</span>`);
+      pills.push(`<span class="ss-pill" title="Learned routing patterns stored in AgentDB">PATTERNS ${Number(mem.patterns).toLocaleString()}</span>`);
     }
 
     // Chunks count
     if (mem.chunks != null) {
-      pills.push(`<span class="ss-pill">CHUNKS ${Number(mem.chunks).toLocaleString()}</span>`);
+      pills.push(`<span class="ss-pill" title="Knowledge chunks indexed for semantic search">CHUNKS ${Number(mem.chunks).toLocaleString()}</span>`);
     }
 
     // Swarm status
@@ -2834,7 +2968,7 @@ async function loadTokensView() {
     const rows  = Array.isArray(data?.tokens?.rows)  ? data.tokens.rows  : [];
     cards.innerHTML = [
       { label:'Today Cost',   val: typeof s.todayCost   === 'number' ? '$' + s.todayCost.toFixed(2)   : '—' },
-      { label:'Today Calls',  val: s.todayCalls  ?? '—' },
+      { label:'Today Calls',  val: s.todayCalls  != null ? Number(s.todayCalls).toLocaleString() : '—' },
       { label:'Month Cost',   val: typeof s.monthCost   === 'number' ? '$' + s.monthCost.toFixed(2)   : '—' },
       { label:'Total Tokens', val: s.totalTokens != null ? Number(s.totalTokens).toLocaleString() : '—' },
     ].map(c => `<div class="tok-card"><div class="tc-label">${esc(c.label)}</div><div class="tc-val">${esc(String(c.val))}</div></div>`).join('');
@@ -2846,12 +2980,13 @@ async function loadTokensView() {
         '<th style="padding:4px 8px 4px 0">Session</th><th style="padding:4px 8px">Calls</th><th style="padding:4px 8px">Tokens</th><th style="padding:4px 8px">Cost</th>' +
         '</tr></thead><tbody>' +
         rows.slice(0, 30).map(r => `<tr style="border-top:1px solid var(--border)">
-          <td style="padding:4px 8px 4px 0;color:var(--text-hi);max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${esc(r.session || r.id || '—')}</td>
-          <td style="padding:4px 8px;color:var(--text-lo)">${r.calls ?? '—'}</td>
+          <td style="padding:4px 8px 4px 0;color:var(--text-hi);max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="${esc(r.session || r.id || '')}">${esc(r.session || r.id || '—')}</td>
+          <td style="padding:4px 8px;color:var(--text-lo)">${r.calls != null ? Number(r.calls).toLocaleString() : '—'}</td>
           <td style="padding:4px 8px;color:var(--text-lo)">${r.tokens != null ? Number(r.tokens).toLocaleString() : '—'}</td>
           <td style="padding:4px 8px;color:var(--accent)">$${Number(r.cost ?? 0).toFixed(4)}</td>
         </tr>`).join('') +
-        '</tbody></table></div>';
+        '</tbody></table></div>' +
+        (rows.length > 30 ? `<div style="font-size:11px;color:var(--text-xs);margin-top:6px;text-align:right">Showing 30 of ${rows.length} sessions</div>` : '');
     } else { table.innerHTML = ''; }
     markLiveGlow('view-tokens');
   } catch (_) {
@@ -2873,6 +3008,36 @@ function renderTokChart(daily, animated = true) {
   const max  = Math.max(...vals, 0.0001);
   const avg  = vals.reduce((a, b) => a + b, 0) / (vals.length || 1) || 0.0001;
   const bar  = Math.max(2, Math.floor((W - (vals.length - 1) * 2) / vals.length));
+  window._tokBarW = bar;
+
+  // attach hover tooltip once
+  if (!canvas._tokTipBound) {
+    canvas._tokTipBound = true;
+    canvas.parentNode.style.position = 'relative';
+    const tip = document.createElement('div');
+    tip.style.cssText = 'position:absolute;pointer-events:none;display:none;font-size:11px;font-family:var(--mono);background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:3px 8px;color:var(--text-hi);z-index:100;white-space:nowrap;box-shadow:0 2px 8px #0004';
+    canvas.parentNode.appendChild(tip);
+    canvas._tokTip = tip;
+    canvas.addEventListener('mousemove', e => {
+      const rect = canvas.getBoundingClientRect();
+      const mx = e.clientX - rect.left;
+      const pitch = (window._tokBarW || 8) + 2;
+      const idx = Math.max(0, Math.min(Math.floor(mx / pitch), (window._tokDaily || []).length - 1));
+      const d = (window._tokDaily || [])[idx];
+      if (d) {
+        const label = d.label || d.date || d.day || ('Day ' + (idx + 1));
+        const cost = Number(d.cost ?? d.value ?? 0);
+        canvas._tokTip.textContent = label + ' — $' + (cost < 0.01 ? cost.toFixed(4) : cost.toFixed(2));
+        canvas._tokTip.style.display = 'block';
+        const tipW = canvas._tokTip.offsetWidth || 120;
+        canvas._tokTip.style.left = Math.min(mx + 10, rect.width - tipW - 4) + 'px';
+        canvas._tokTip.style.top = '4px';
+      } else {
+        canvas._tokTip.style.display = 'none';
+      }
+    });
+    canvas.addEventListener('mouseleave', () => { canvas._tokTip.style.display = 'none'; });
+  }
   const targets = vals.map((v, i) => ({
     v, i,
     isToday: i === vals.length - 1,
@@ -2933,7 +3098,7 @@ async function setTokPeriod(btn, period) {
     if (cards) cards.innerHTML = [
       { label: 'Cost',   val: typeof s.todayCost  === 'number' ? '$' + s.todayCost.toFixed(2)
                            : typeof s.cost === 'number' ? '$' + s.cost.toFixed(2) : '—' },
-      { label: 'Calls',  val: s.todayCalls ?? s.calls ?? '—' },
+      { label: 'Calls',  val: (s.todayCalls ?? s.calls) != null ? Number(s.todayCalls ?? s.calls).toLocaleString() : '—' },
       { label: 'Tokens', val: s.totalTokens != null ? Number(s.totalTokens).toLocaleString() : '—' },
       { label: 'Models', val: s.modelCount  ?? s.models ?? '—' },
     ].map(c => `<div class="tok-card"><div class="tc-label">${esc(c.label)}</div><div class="tc-val">${esc(String(c.val))}</div></div>`).join('');
@@ -2945,12 +3110,13 @@ async function setTokPeriod(btn, period) {
         '<th style="padding:3px 8px">Calls</th><th style="padding:3px 8px">Cost</th></tr></thead><tbody>' +
         rows.slice(0, 30).map(r =>
           `<tr style="border-top:1px solid var(--border)">` +
-          `<td style="padding:3px 8px 3px 0;color:var(--text-hi);max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${esc(r.session || r.label || r.id || '—')}</td>` +
-          `<td style="padding:3px 8px;color:var(--text-lo)">${r.calls ?? '—'}</td>` +
+          `<td style="padding:3px 8px 3px 0;color:var(--text-hi);max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="${esc(r.session || r.label || r.id || '')}">${esc(r.session || r.label || r.id || '—')}</td>` +
+          `<td style="padding:3px 8px;color:var(--text-lo)">${r.calls != null ? Number(r.calls).toLocaleString() : '—'}</td>` +
           `<td style="padding:3px 8px;color:var(--accent)">$${Number(r.cost ?? 0).toFixed(4)}</td>` +
           `</tr>`
         ).join('') +
-        '</tbody></table></div>';
+        '</tbody></table></div>' +
+        (rows.length > 30 ? `<div style="font-size:11px;color:var(--text-xs);margin-top:6px;text-align:right">Showing 30 of ${rows.length} entries</div>` : '');
     } else if (table) { table.innerHTML = ''; }
     markLiveGlow('view-tokens');
     // Update topbar badge when showing today's data
@@ -3003,25 +3169,58 @@ async function loadMemRouting() {
       const last = rows[rows.length - 1];
       window._lastRouteAgent = last.suggestedAgent || last.route || last.category || last.agent || last.agentType || '';
     }
-    if (!rows.length) { pane.innerHTML = '<div class="empty">No routing data</div>'; return; }
-    pane.innerHTML = '<div class="m-group-title" style="margin-bottom:6px">Routing Feedback</div>' +
-      rows.slice(-40).reverse().map(r => {
+    if (!rows.length) { pane.innerHTML = '<div class="empty">No routing data<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Routing data accumulates as agents run tasks. Train the router with <code>npx monomind hooks route --task "…"</code></div></div>'; return; }
+    const displayRows = rows.slice(-40).reverse();
+    const overflowNote = rows.length > 40 ? `<div style="font-size:11px;color:var(--text-xs);margin-bottom:6px;text-align:right">Showing last 40 of ${rows.length} entries</div>` : '';
+    pane.innerHTML = '<div class="filter-bar" style="margin-bottom:8px"><input class="filter-input" id="routing-filter" type="text" placeholder="Filter by agent or task…" oninput="filterRouting(this.value)" title="Filter routing entries"></div>' +
+      overflowNote +
+      '<div id="routing-rows">' +
+      displayRows.map(r => {
         const agent = r.suggestedAgent || r.route || r.category || r.agent || '—';
         const task  = r.task || r.prompt || r.description || r.sessionId?.slice(0, 8) || '—';
         const ts    = r.timestamp || r.ts || r.created_at;
         const conf  = r.confidence != null ? Math.round(r.confidence * 100) + '%' : '';
-        return `<div style="padding:5px 0;border-bottom:1px solid var(--border);font-size:11px;font-family:monospace">
+        return `<div class="routing-entry" style="padding:5px 0;border-bottom:1px solid var(--border);font-size:11px;font-family:monospace" data-agent="${esc(agent)}" data-task="${esc(task)}">
           <div style="color:var(--text-hi);display:flex;align-items:center;gap:8px">
             <span style="color:var(--accent)">${esc(agent)}</span>
             ${conf ? `<span style="color:var(--text-lo)">${esc(conf)}</span>` : ''}
-            <span style="color:var(--text-lo);margin-left:auto;font-size:10px">${relTime(ts)}</span>
+            <span style="color:var(--text-lo);margin-left:auto;font-size:10px" title="${ts ? new Date(typeof ts === 'number' ? ts : Number(ts) || ts).toLocaleString() : ''}">${relTime(ts)}</span>
           </div>
           <div style="color:var(--text-lo);margin-top:1px">${esc(task)}</div>
         </div>`;
-      }).join('');
+      }).join('') + '</div>';
   } catch (_) { pane.innerHTML = '<div class="empty">Failed to load routing data</div>'; }
 }
 
+function filterRouting(q) {
+  const lq = (q || '').toLowerCase();
+  document.querySelectorAll('#routing-rows .routing-entry').forEach(el => {
+    const agent = (el.dataset.agent || '').toLowerCase();
+    const task  = (el.dataset.task  || '').toLowerCase();
+    el.style.display = (!lq || agent.includes(lq) || task.includes(lq)) ? '' : 'none';
+  });
+}
+
+function filterLoopList(q) {
+  const lq = (q || '').toLowerCase();
+  document.querySelectorAll('#loops-content .loop-row').forEach(el => {
+    const text = (el.textContent || '').toLowerCase();
+    const expand = el.nextElementSibling;
+    const visible = !lq || text.includes(lq);
+    el.style.display = visible ? '' : 'none';
+    if (expand && expand.classList.contains('loop-expand')) expand.style.display = 'none';
+  });
+}
+
+function filterOrgList(q) {
+  const lq = (q || '').toLowerCase();
+  document.querySelectorAll('#orgs-list-scroll .org-item').forEach(el => {
+    const name = (el.dataset.org || '').toLowerCase();
+    const goal = (el.querySelector('.oi-goal')?.textContent || '').toLowerCase();
+    el.style.display = (!lq || name.includes(lq) || goal.includes(lq)) ? '' : 'none';
+  });
+}
+
 async function loadMemUsage() {
   const pane = document.getElementById('mem-tab-usage');
   if (!pane) return;
@@ -3029,10 +3228,10 @@ async function loadMemUsage() {
   // Period tabs
   pane.innerHTML = `
     <div class="tok-periods" style="margin-bottom:14px">
-      <button class="tok-period-btn active" data-period="today" onclick="loadMemUsagePeriod(this,'today')">Today</button>
-      <button class="tok-period-btn" data-period="week" onclick="loadMemUsagePeriod(this,'week')">Week</button>
-      <button class="tok-period-btn" data-period="30d" onclick="loadMemUsagePeriod(this,'30d')">30 Days</button>
-      <button class="tok-period-btn" data-period="month" onclick="loadMemUsagePeriod(this,'month')">Month</button>
+      <button class="tok-period-btn active" data-period="today" title="Show today's memory usage" onclick="loadMemUsagePeriod(this,'today')">Today</button>
+      <button class="tok-period-btn" data-period="week" title="Show this week's memory usage" onclick="loadMemUsagePeriod(this,'week')">Week</button>
+      <button class="tok-period-btn" data-period="30d" title="Show last 30 days of memory usage" onclick="loadMemUsagePeriod(this,'30d')">30 Days</button>
+      <button class="tok-period-btn" data-period="month" title="Show this month's memory usage" onclick="loadMemUsagePeriod(this,'month')">Month</button>
     </div>
     <div id="mem-usage-content"><div class="loading-txt">Loading…</div></div>
   `;
@@ -3057,19 +3256,25 @@ async function loadMemUsagePeriod(btn, period) {
 
     function barChart(items, valKey, labelKey, color, maxItems) {
       if (!items.length) return '<div class="empty" style="font-size:12px">No data</div>';
-      const maxVal = Math.max(...items.slice(0, maxItems).map(x => Number(x[valKey] || 0)), 0.0001);
-      return items.slice(0, maxItems).map(item => {
+      const shown = items.slice(0, maxItems);
+      const maxVal = Math.max(...shown.map(x => Number(x[valKey] || 0)), 0.0001);
+      const rows = shown.map(item => {
         const pct = Math.round((Number(item[valKey] || 0) / maxVal) * 100);
-        const label = esc(String(item[labelKey] || '—').slice(0, 24));
+        const fullLabel = String(item[labelKey] || '—');
+        const label = esc(fullLabel.slice(0, 24));
         const val = typeof item[valKey] === 'number' && valKey === 'cost'
           ? '$' + Number(item[valKey]).toFixed(4)
           : String(item[valKey] || 0);
         return `<div style="display:flex;align-items:center;gap:8px;padding:3px 0;font-size:12px">
-          <div style="width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-hi);font-family:var(--mono);font-size:11px">${label}</div>
-          <div style="flex:1;height:7px;background:var(--border);border-radius:2px;overflow:hidden"><div style="width:${pct}%;height:100%;background:${color};border-radius:2px"></div></div>
+          <div style="width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-hi);font-family:var(--mono);font-size:11px" title="${esc(fullLabel)}">${label}${fullLabel.length > 24 ? '…' : ''}</div>
+          <div style="flex:1;height:7px;background:var(--border);border-radius:2px;overflow:hidden" title="${esc(fullLabel)}: ${esc(val)}"><div style="width:${pct}%;height:100%;background:${color};border-radius:2px"></div></div>
           <div style="width:60px;text-align:right;color:var(--text-lo);font-size:11px;font-family:var(--mono)">${esc(val)}</div>
         </div>`;
       }).join('');
+      const overflow = items.length > maxItems
+        ? `<div style="font-size:11px;color:var(--text-xs);margin-top:3px;text-align:right">Showing ${maxItems} of ${items.length}</div>`
+        : '';
+      return rows + overflow;
     }
 
     const totalCost = typeof s.todayCost === 'number' ? s.todayCost : (typeof s.cost === 'number' ? s.cost : null);
@@ -3112,11 +3317,12 @@ async function loadMemUsagePeriod(btn, period) {
       <div style="overflow-x:auto"><table style="width:100%;border-collapse:collapse;font-size:11px">
         <thead><tr style="color:var(--text-xs);text-align:left"><th style="padding:3px 8px 3px 0">Session</th><th>Calls</th><th>Cost</th></tr></thead>
         <tbody>${rows.slice(0,30).map(r => `<tr style="border-top:1px solid var(--border)">
-          <td style="padding:3px 8px 3px 0;color:var(--text-hi);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--mono);font-size:11px">${esc(r.session||r.label||r.id||'—')}</td>
-          <td style="padding:3px 8px;color:var(--text-lo)">${r.calls??'—'}</td>
+          <td style="padding:3px 8px 3px 0;color:var(--text-hi);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--mono);font-size:11px" title="${esc(r.session||r.label||r.id||'')}">${esc(r.session||r.label||r.id||'—')}</td>
+          <td style="padding:3px 8px;color:var(--text-lo)">${r.calls != null ? Number(r.calls).toLocaleString() : '—'}</td>
           <td style="padding:3px 8px;color:var(--accent)">$${Number(r.cost??0).toFixed(4)}</td>
         </tr>`).join('')}</tbody>
-      </table></div>` : ''}
+      </table></div>
+      ${rows.length > 30 ? `<div style="font-size:11px;color:var(--text-xs);margin-top:6px;text-align:right">Showing 30 of ${rows.length} entries</div>` : ''}` : ''}
     `;
   } catch (e) {
     content.innerHTML = '<div class="empty">Failed: ' + esc(e.message) + '</div>';
@@ -3138,14 +3344,15 @@ async function loadMemADRs() {
 function renderADRs(list) {
   const pane = document.getElementById('adr-content');
   if (!pane) return;
-  if (!list.length) { pane.innerHTML = '<div class="empty">No ADRs found</div>'; return; }
+  if (!list.length) { pane.innerHTML = '<div class="empty">No ADRs found<div style="font-size:11px;color:var(--text-xs);margin-top:4px">ADRs are created by agents via <code>monomind memory store --type adr</code></div></div>'; return; }
   pane.innerHTML = list.slice(0, 50).map(a => `<div style="padding:8px 0;border-bottom:1px solid var(--border)">
     <div style="display:flex;justify-content:space-between;align-items:baseline;margin-bottom:3px">
       <span style="color:var(--text-hi);font-size:12px;font-family:monospace">${esc(a.id || a.title || '—')}</span>
       <span class="ss-pill ${a.status === 'accepted' ? 'on' : a.status === 'deprecated' ? 'warn' : ''}">${esc(a.status || '?')}</span>
     </div>
-    <div style="font-size:11px;color:var(--text-lo)">${esc((a.context || a.summary || '').slice(0, 120))}</div>
-  </div>`).join('');
+    <div style="font-size:11px;color:var(--text-lo)" title="${esc(a.context || a.summary || '')}">${esc((a.context || a.summary || '').slice(0, 120))}${(a.context || a.summary || '').length > 120 ? '…' : ''}</div>
+  </div>`).join('') +
+  (list.length > 50 ? `<div style="font-size:11px;color:var(--text-xs);margin-top:8px;text-align:right">Showing 50 of ${list.length} ADRs</div>` : '');
 }
 
 function filterADRs(q) {
@@ -3160,11 +3367,15 @@ function filterADRs(q) {
 
 function renderMiniSessions(sessions) {
   if (!sessions.length) return;
-  const items = sessions.map((s, i) => `
+  const items = sessions.map((s, i) => {
+    const costStr = typeof s.totalCost === 'number' && s.totalCost > 0.001 ? ' · $' + s.totalCost.toFixed(2) : '';
+    const durStr = s.totalDurationMs ? ' · ' + fmtDur(s.totalDurationMs) : '';
+    return `
     <div class="mini-sess" onclick="sessionIdx=${i};userScrolled=false;loadFeedForSession(allSessions[${i}])">
-      <div class="ms-prompt">${esc(s.lastPrompt || s.id.slice(0, 8))}</div>
-      <div class="ms-meta">${relTime(s.lastTs || s.mtime)}</div>
-    </div>`).join('');
+      <div class="ms-prompt" title="${esc(s.lastPrompt || s.id || '')}">${esc(s.lastPrompt || s.id.slice(0, 8))}</div>
+      <div class="ms-meta"><span title="${(ts => ts ? new Date(typeof ts === 'number' ? ts : Number(ts) || ts).toLocaleString() : '')(s.lastTs || s.mtime)}">${relTime(s.lastTs || s.mtime)}</span>${durStr}${costStr}</div>
+    </div>`;
+  }).join('');
   document.getElementById('m-sessions').innerHTML = `<div class="m-group-title">Recent Sessions</div>${items}`;
   buildSwimlane();
 }
@@ -3191,7 +3402,7 @@ function renderProjectGrid(projects, query) {
     (p.name || p.slug || '').toLowerCase().includes(query.toLowerCase()) ||
     (p.path || '').toLowerCase().includes(query.toLowerCase())) : projects;
   if (!filtered.length) {
-    el.innerHTML = '<div class="empty"><div class="empty-ico">⊞</div><div>No projects match</div></div>';
+    el.innerHTML = '<div class="empty"><div class="empty-ico">⊞</div><div>No projects match</div><div style="font-size:11px;color:var(--text-xs);margin-top:4px">Try a different search term or clear the filter</div></div>';
     return;
   }
   el.className = 'proj-grid';
@@ -3202,12 +3413,12 @@ function renderProjectGrid(projects, query) {
     return `<div class="proj-card${isCurrent ? ' current' : ''}" onclick="switchProject('${esc(p.path || '')}')">
       ${isCurrent ? '<div class="proj-card-badge">active</div>' : ''}
       <div class="proj-health ${hCls}" title="Health score: ${score}">${score}</div>
-      <div class="proj-card-name">${esc(p.name || p.slug)}</div>
-      <div class="proj-card-path">${esc(p.path || '')}</div>
+      <div class="proj-card-name" title="${esc(p.name || p.slug || '')}">${esc(p.name || p.slug)}</div>
+      <div class="proj-card-path" title="${esc(p.path || '')}">${esc(shortPath(p.path || ''))}</div>
       <div class="proj-card-stats">
         <div class="proj-stat"><div class="ps-v">${p.sessionCount || 0}</div><div class="ps-l">sessions</div></div>
         <div class="proj-stat"><div class="ps-v">${p.memoryCount || 0}</div><div class="ps-l">memories</div></div>
-        ${p.lastActivity ? `<div class="proj-stat"><div class="ps-v" style="font-size:12px">${relTime(p.lastActivity)}</div><div class="ps-l">last active</div></div>` : ''}
+        ${p.lastActivity ? `<div class="proj-stat"><div class="ps-v" style="font-size:12px" title="${new Date(typeof p.lastActivity === 'number' ? p.lastActivity : Number(p.lastActivity) || p.lastActivity).toLocaleString()}">${relTime(p.lastActivity)}</div><div class="ps-l">last active</div></div>` : ''}
       </div>
     </div>`;
   }).join('');
@@ -3229,19 +3440,33 @@ async function renderSessions() {
     document.getElementById('sess-pg-sub').textContent =
       sessions.length + ' session' + (sessions.length !== 1 ? 's' : '') + ' · ' + (DIR.split('/').pop() || DIR);
     if (!sessions.length) {
-      el.innerHTML = '<div class="empty"><div class="empty-ico">◫</div><div>No sessions yet</div></div>';
+      el.innerHTML = '<div class="empty"><div class="empty-ico">◫</div><div>No sessions yet</div><div style="font-size:11px;color:var(--text-xs);margin-top:4px">Start a session with <code>npx monomind agent spawn</code></div></div>';
       return;
     }
     let toShow = showStarredOnly ? sessions.filter(s => bookmarks.has(s.id)) : sessions;
     if (activeTagFilter) toShow = toShow.filter(s => (allTags.sessionTags.get(s.id) || []).includes(activeTagFilter));
     if (heatmapDateFilter) toShow = toShow.filter(s => {
       const t = s.lastTs || s.mtime; if (!t) return false;
-      return new Date(typeof t === 'number' ? t : t).toDateString() === heatmapDateFilter;
+      return new Date(typeof t === 'number' ? t : Number(t) || t).toDateString() === heatmapDateFilter;
     });
     // f57: file pivot filter
     if (filePivot) toShow = toShow.filter(s => (s.filesTouched || []).includes(filePivot));
     if (!toShow.length) {
-      el.innerHTML = '<div class="empty"><div class="empty-ico">☆</div><div>No bookmarked sessions</div></div>';
+      let emptyMsg, emptyHint;
+      if (filePivot) {
+        emptyMsg = 'No sessions touching ' + esc(filePivot.split('/').pop());
+        emptyHint = 'Clear the file filter to see all sessions';
+      } else if (heatmapDateFilter) {
+        emptyMsg = 'No sessions on ' + esc(heatmapDateFilter);
+        emptyHint = 'Click another date on the heatmap or clear the filter';
+      } else if (activeTagFilter) {
+        emptyMsg = 'No sessions tagged "' + esc(activeTagFilter) + '"';
+        emptyHint = 'Clear the tag filter to see all sessions';
+      } else {
+        emptyMsg = 'No bookmarked sessions';
+        emptyHint = 'Click the ☆ on any session row to bookmark it.';
+      }
+      el.innerHTML = `<div class="empty"><div class="empty-ico">☆</div><div>${emptyMsg}</div><div style="font-size:11px;color:var(--text-xs);margin-top:4px">${emptyHint}</div></div>`;
       buildSessionHeatmap(sessions);
       return;
     }
@@ -3253,7 +3478,7 @@ async function renderSessions() {
     const now = Date.now(); const DAY = 86400000;
     function sessDateGroup(s) {
       const t = s.lastTs || s.mtime; if (!t) return 'Older';
-      const age = now - (typeof t === 'number' ? t : new Date(t).getTime());
+      const age = now - (typeof t === 'number' ? t : Number(t) || new Date(t).getTime() || 0);
       if (age < DAY) return 'Today';
       if (age < 2 * DAY) return 'Yesterday';
       if (age < 8 * DAY) return 'This week';
@@ -3288,7 +3513,7 @@ async function renderSessions() {
       const summaries = (s.summaries || []).slice(0, 2).map(sm => { const t = typeof sm === 'string' ? sm : (sm.summary || sm.text || String(sm)); return `<span class="sr-tag">${esc(t.slice(0, 40))}</span>`; }).join('');
       const autoTags = (allTags.sessionTags.get(s.id) || []).map(t => `<span class="sr-autotag">${esc(t)}</span>`).join('');
       const isStarred = bookmarks.has(s.id);
-      const sData = JSON.stringify(s).replace(/'/g, '&#39;');
+      const sData = JSON.stringify(s).replace(/</g, '\\u003c').replace(/>/g, '\\u003e').replace(/'/g, '&#39;');
       const note = getSessNote(s.id);
       const hasNote = !!note;
       const files = (s.filesTouched || []).slice(0, 5);
@@ -3313,12 +3538,14 @@ async function renderSessions() {
         ? `<span class="sr-compact-badge">+${s.compactCount} compacted</span>`
         : '';
       const summaryHtml = s.summary
-        ? `<div class="sr-summary">${esc(s.summary.slice(0, 180))}</div>`
+        ? `<div class="sr-summary" title="${esc(s.summary)}">${esc(s.summary.slice(0, 180))}${s.summary.length > 180 ? '…' : ''}</div>`
         : '';
+      const srTimeTs = s.lastTs || s.mtime;
+      const srTimeFull = srTimeTs ? new Date(typeof srTimeTs === 'number' ? srTimeTs : Number(srTimeTs) || srTimeTs).toLocaleString() : '';
       return `<div class="sess-row" data-sess-idx="${idx}" data-sess-id="${esc(s.id)}" onclick="handleSessRowClick(event,this,'${esc(s.id)}')" data-sess-data='${sData}'>
         <div class="sr-top">
-          <div class="sr-prompt">${esc(s.lastPrompt || s.id?.slice(0,8) || '—')}</div>
-          <div class="sr-time">${relTime(s.lastTs || s.mtime)}</div>${compactBadge}
+          <div class="sr-prompt" title="${esc(s.lastPrompt || s.id || '')}">${esc(s.lastPrompt || s.id?.slice(0,8) || '—')}</div>
+          <div class="sr-time"${srTimeFull ? ` title="${esc(srTimeFull)}"` : ''}>${relTime(s.lastTs || s.mtime)}</div>${compactBadge}
           <button class="sr-copy-btn" data-prompt="${esc(s.lastPrompt || s.id)}" onclick="copyPrompt(this.dataset.prompt,event)" title="Copy prompt to clipboard">⎘</button>
           <button class="sess-star${isStarred ? ' on' : ''}" data-sid="${esc(s.id)}" onclick="toggleBookmark('${esc(s.id)}',event)" title="${isStarred ? 'Remove bookmark' : 'Bookmark session'}">${isStarred ? '★' : '☆'}</button>
           <span class="sr-view">→ view</span>
@@ -3332,7 +3559,7 @@ async function renderSessions() {
         ${ctxGauge}
         <div class="err-drawer" id="err-drawer-${esc(s.id)}"></div>
         <div class="sess-notes-wrap" onclick="event.stopPropagation()">
-          <button class="sess-notes-toggle${hasNote ? ' has-note' : ''}" onclick="toggleSessNote('${esc(s.id)}',this)">✎ ${hasNote ? 'Note' : 'Add note'}</button>
+          <button class="sess-notes-toggle${hasNote ? ' has-note' : ''}" title="${hasNote ? 'Show/hide session note' : 'Add a note to this session'}" onclick="toggleSessNote('${esc(s.id)}',this)">✎ ${hasNote ? 'Note' : 'Add note'}</button>
           <div class="sess-notes-area" id="snote-${esc(s.id)}">
             <textarea class="sess-note-input" rows="2" placeholder="Session note…" oninput="saveSessNote('${esc(s.id)}',this.value,this.closest('.sess-notes-wrap').querySelector('.sess-notes-toggle'),this.closest('.sess-row').querySelector('.sess-note-saved'))">${esc(note)}</textarea>
             <div class="sess-note-saved"></div>
@@ -3373,14 +3600,14 @@ async function renderSessions() {
     const todayCost = allSessions.filter(s => {
       const t = s.firstTs || s.mtime;
       if (!t) return false;
-      const d = new Date(typeof t === 'number' ? t : t);
+      const d = new Date(typeof t === 'number' ? t : Number(t) || t);
       const now = new Date();
       return d.getFullYear() === now.getFullYear() && d.getMonth() === now.getMonth() && d.getDate() === now.getDate();
     }).reduce((a, s) => a + (s.totalCost || 0), 0);
     const monthCost = allSessions.filter(s => {
       const t = s.firstTs || s.mtime;
       if (!t) return false;
-      const d = new Date(typeof t === 'number' ? t : t);
+      const d = new Date(typeof t === 'number' ? t : Number(t) || t);
       const now = new Date();
       return d.getFullYear() === now.getFullYear() && d.getMonth() === now.getMonth();
     }).reduce((a, s) => a + (s.totalCost || 0), 0);
@@ -3459,7 +3686,7 @@ function buildTagFilterBar(sessions) {
   if (!allTags.common.size) return '';
   const sorted = [...allTags.common].sort();
   const chips = sorted.map(t =>
-    `<button class="tag-chip${activeTagFilter === t ? ' active' : ''}" onclick="setTagFilter('${esc(t)}')">${esc(t)}</button>`
+    `<button class="tag-chip${activeTagFilter === t ? ' active' : ''}" title="Filter sessions by tag: ${esc(t)}" onclick="setTagFilter('${esc(t)}')">${esc(t)}</button>`
   ).join('');
   return `<div class="tag-filter-bar">${chips}</div>`;
 }
@@ -3488,10 +3715,12 @@ function buildRecap(events, sess) {
   const topPct = topCat ? Math.round(topCat[1] / tools.length * 100) : 0;
 
   const costStr = sess?.totalCost != null ? '$' + sess.totalCost.toFixed(2) : (sess?.cost != null ? '$' + sess.cost.toFixed(2) : null);
+  const durStr = sess?.totalDurationMs ? fmtDur(sess.totalDurationMs) : null;
 
   const stats = [
     tools.length ? `<span class="recap-stat rs-tool">${tools.length} tool calls${topCat ? ' · ' + topPct + '% ' + topCat[0] : ''}</span>` : '',
     users.length ? `<span class="recap-stat rs-user">${users.length} message${users.length !== 1 ? 's' : ''}</span>` : '',
+    durStr ? `<span class="recap-stat">${durStr}</span>` : '',
     costStr ? `<span class="recap-stat rs-cost">${costStr}</span>` : '',
     errors.length ? `<span class="recap-stat rs-err">${errors.length} error${errors.length !== 1 ? 's' : ''}</span>` : '',
   ].filter(Boolean).join('');
@@ -3507,12 +3736,15 @@ async function renderGlobalFeed() {
   try {
     // fetch project list
     const data = await apiFetch('/api/projects');
-    const projects = (data?.projects || []).slice(0, 8);
+    const allProjects = data?.projects || [];
+    const projects = allProjects.slice(0, 8);
     if (!projects.length) {
-      el.innerHTML = '<div class="empty"><div class="empty-ico">⊕</div><div>No projects found</div></div>';
+      el.innerHTML = '<div class="empty"><div class="empty-ico">⊕</div><div>No projects found</div><div style="font-size:11px;color:var(--text-xs);margin-top:4px">Run <code>npx monomind init</code> inside a project to register it.</div></div>';
       return;
     }
-    document.getElementById('gf-sub').textContent = `Last activity across ${projects.length} projects`;
+    document.getElementById('gf-sub').textContent = allProjects.length > 8
+      ? `Last activity across ${projects.length} of ${allProjects.length} projects`
+      : `Last activity across ${projects.length} project${projects.length !== 1 ? 's' : ''}`;
 
     // fetch sessions for each project in parallel
     const results = await Promise.allSettled(
@@ -3531,11 +3763,11 @@ async function renderGlobalFeed() {
     entries.sort((a, b) => {
       const ta = a.session.lastTs || a.session.mtime || 0;
       const tb = b.session.lastTs || b.session.mtime || 0;
-      return (typeof tb === 'number' ? tb : new Date(tb).getTime()) - (typeof ta === 'number' ? ta : new Date(ta).getTime());
+      return (typeof tb === 'number' ? tb : Number(tb) || new Date(tb).getTime() || 0) - (typeof ta === 'number' ? ta : Number(ta) || new Date(ta).getTime() || 0);
     });
 
     if (!entries.length) {
-      el.innerHTML = '<div class="empty"><div class="empty-ico">⊕</div><div>No sessions found</div></div>';
+      el.innerHTML = '<div class="empty"><div class="empty-ico">⊕</div><div>No sessions found</div><div style="font-size:11px;color:var(--text-xs);margin-top:4px">Sessions appear when Claude Code runs inside registered projects</div></div>';
       return;
     }
 
@@ -3548,12 +3780,12 @@ async function renderGlobalFeed() {
         ? `<span class="sr-compact-badge">+${s.compactCount} compacted</span>`
         : '';
       const gfSummaryHtml = s.summary
-        ? `<div class="sr-summary">${esc(s.summary.slice(0, 180))}</div>`
+        ? `<div class="sr-summary" title="${esc(s.summary)}">${esc(s.summary.slice(0, 180))}${s.summary.length > 180 ? '…' : ''}</div>`
         : '';
       return `<div class="sess-row" onclick="switchProject('${esc(project.path)}');setTimeout(()=>jumpToSession('${esc(s.id)}'),150)">
         <div class="sr-top">
-          <div class="sr-prompt">${esc(s.lastPrompt || s.id?.slice(0,8) || '—')}</div>
-          <div class="sr-time">${relTime(s.lastTs || s.mtime)}</div>${gfCompactBadge}
+          <div class="sr-prompt" title="${esc(s.lastPrompt || s.id || '')}">${esc(s.lastPrompt || s.id?.slice(0,8) || '—')}</div>
+          <div class="sr-time" title="${(t => t ? new Date(typeof t === 'number' ? t : Number(t) || t).toLocaleString() : '')(s.lastTs || s.mtime)}">${relTime(s.lastTs || s.mtime)}</div>${gfCompactBadge}
           <span class="gf-proj-tag">${esc(projName)}</span>
         </div>
         ${gfSummaryHtml}
@@ -3565,8 +3797,232 @@ async function renderGlobalFeed() {
   }
 }
 
+// ── global loops (multi-project) ───────────────────────────
+function deduplicateLoops(loops) {
+  const hasRepeat = loops.some(l => l.source === '_repeat.md');
+  const repeatPrompts = new Set(loops.filter(l => l.source === '_repeat.md').map(l => (l.prompt || '').trim()));
+  return loops.filter(l => {
+    if (l.source === 'scheduled_tasks_lock' && hasRepeat) return false;
+    if (l.source !== 'schedule_wakeup_hook') return true;
+    const m = (l.prompt || '').match(/--loop\s+\S+\s+(.+)$/s);
+    return !m || !repeatPrompts.has(m[1].trim());
+  });
+}
+
+async function renderGlobalLoops() {
+  const el = document.getElementById('gl-content');
+  el.innerHTML = '<div class="loading-txt">Loading all projects…</div>';
+  try {
+    const data = await apiFetch('/api/projects');
+    const allProjects = data?.projects || [];
+    const projects = allProjects.slice(0, 20);
+    if (!projects.length) {
+      el.innerHTML = '<div class="empty"><div class="empty-ico">↺</div><div>No projects found</div></div>';
+      document.getElementById('bdg-global-loops').textContent = '—';
+      return;
+    }
+
+    const results = await Promise.allSettled(
+      projects.map(p => apiFetch('/api/loops?dir=' + enc(p.path)).then(d => ({
+        project: p,
+        loops: deduplicateLoops(Array.isArray(d) ? d : (d.loops || []))
+      })))
+    );
+
+    let totalLoops = 0;
+    const sections = [];
+    for (const r of results) {
+      if (r.status !== 'fulfilled') continue;
+      const { project, loops } = r.value;
+      if (!loops.length) continue;
+      totalLoops += loops.length;
+      const projName = project.name || project.slug || project.path?.split('/').pop() || '?';
+      const rows = loops.map((l, idx) => {
+        const isTillend = l.type === 'tillend';
+        const curRep = l.currentRep || 0;
+        const maxReps = l.maxReps || 0;
+        const nextAt = l.nextRunAt ? parseInt(l.nextRunAt) : 0;
+        const isHil = l.status === 'hil:pending';
+        const isExplicitlyActive = l.status === 'running' || l.status === 'waiting' || l.status === 'active';
+        const LOOP_STALE_MS = 2 * 60 * 60 * 1000;
+        const isOverdue = !l.status?.startsWith('hil') && !isExplicitlyActive &&
+          nextAt > 0 && nextAt <= Date.now();
+        const isStaledActive = isExplicitlyActive && nextAt > 0 &&
+          (Date.now() - nextAt) > LOOP_STALE_MS;
+        const isFinished = isOverdue || isStaledActive ||
+          (!isExplicitlyActive && maxReps > 0 && curRep >= maxReps) ||
+          ['finished','done','complete','completed','expired'].includes(l.status);
+        const running = !isFinished && l.status !== 'stopped' && l.status !== 'paused';
+        const intervalStr = fmtInterval(l.interval || l.schedule);
+        const _lp = (function(_l) {
+          if (_l.command) {
+            const flags = [];
+            if (_l.type && _l.type !== 'repeat') flags.push('--' + _l.type);
+            if (_l.maxReps) flags.push('--maxruns ' + _l.maxReps);
+            if (_l.wait || _l.interval) flags.push('--wait ' + (_l.wait || _l.interval * 60));
+            if (_l.currentRep != null) flags.push('--rep ' + _l.currentRep);
+            if (_l.id) flags.push('--loop ' + _l.id);
+            return { userPrompt: _l.prompt || '', command: _l.command, flagsStr: flags.join(' ') };
+          }
+          const full = _l.prompt || '';
+          const cmdM = full.match(/^(\/\S+)/);
+          if (!cmdM) return { userPrompt: full, command: '', flagsStr: '' };
+          const tokens = full.slice(cmdM[1].length).trim().split(/\s+/);
+          let ti = 0, fp = [];
+          while (ti < tokens.length && tokens[ti] && tokens[ti].startsWith('--')) {
+            fp.push(tokens[ti++]);
+            if (ti < tokens.length && tokens[ti] && !tokens[ti].startsWith('--')) fp.push(tokens[ti++]);
+          }
+          return { userPrompt: tokens.slice(ti).join(' '), command: cmdM[1], flagsStr: fp.join(' ') };
+        })(l);
+        const userPrompt = _lp.userPrompt;
+        const cmdStr = _lp.command;
+        const flagsStr = _lp.flagsStr;
+        const fullPrompt = l.prompt || '';
+        const name = (l.name || userPrompt || cmdStr || 'loop').slice(0, 60);
+        const startedAt = l.startedAt ? new Date(l.startedAt).toLocaleString() : '—';
+        const lastRun = l.lastRunAt ? relTime(l.lastRunAt) : (l.startedAt ? relTime(l.startedAt) : '—');
+        const pct = (!isTillend && maxReps > 0) ? Math.min(100, Math.round(curRep / maxReps * 100)) : 0;
+        const progBar = (!isTillend && maxReps > 0 && running)
+          ? `<div class="lp-bar"><div class="lp-fill" style="width:${pct}%"></div></div>` : '';
+        const runCountDisplay = isTillend
+          ? `run ${curRep} / ∞${maxReps > 0 ? ' (cap: ' + maxReps + ')' : ''}`
+          : (maxReps > 0 ? `${curRep} / ${maxReps}` : String(curRep || '—'));
+        const cdownSpan = nextAt
+          ? ` <span class="loop-cdown${nextAt - Date.now() <= 0 ? ' overdue' : ''}" data-nextat="${nextAt}">${fmtCountdown(nextAt)}</span>` : '';
+        const stopBtn = running
+          ? `<button class="loop-stop-btn" data-loop-id="${esc(l.id || l.name || String(idx))}" onclick="stopLoop(event, this.dataset.loopId)" title="Stop this loop">■ Stop</button>` : '';
+        const typeBadge = `<span class="loop-type-badge${isTillend ? ' tillend' : ''}">${esc(l.type || 'repeat')}</span>`;
+        const statusClass = isHil ? 'hil' : (running ? 'active' : 'stopped');
+        const statusLabel = isHil ? '⚠ HIL' : (running ? 'active' : (isFinished ? 'done' : 'stopped'));
+        const hilBanner = isHil
+          ? `<div class="loop-hil-banner">⚠ Waiting for human response — open HIL file to resume</div>` : '';
+        const metaParts = [intervalStr, l.description].filter(Boolean).join(' · ').slice(0, 80);
+        return `<div class="loop-row" data-loop-status="${esc(l.status || '')}" onclick="toggleLoop(this)">
+            <div class="loop-ico">${isTillend ? '∞' : '↺'}</div>
+            <div class="loop-body">
+              <div class="loop-name" title="${esc(userPrompt || fullPrompt)}">${typeBadge}${esc(name)}</div>
+              <div class="loop-meta">${esc(metaParts)}${cdownSpan}</div>
+              ${hilBanner}
+              ${progBar}
+            </div>
+            <div class="loop-status ${statusClass}">${statusLabel}</div>
+            ${stopBtn}
+          </div>
+          <div class="loop-expand">
+            ${userPrompt ? `<div class="le-row"><div class="le-lbl">Prompt</div><div class="le-val mono" style="display:flex;align-items:flex-start;gap:8px"><span title="${esc(userPrompt)}">${esc(userPrompt.slice(0, 300))}${userPrompt.length > 300 ? '…' : ''}</span><button class="btn" style="flex-shrink:0;font-size:10px;padding:1px 6px" title="Copy prompt" onclick="event.stopPropagation();navigator.clipboard.writeText(${JSON.stringify(userPrompt)}).then(()=>showToast('Copied','Prompt copied','ok'))">⎘</button></div></div>` : ''}
+            ${cmdStr ? `<div class="le-row"><div class="le-lbl">Command</div><div class="le-val mono" style="display:flex;align-items:center;gap:8px"><span>${esc(cmdStr)}</span><button class="btn" style="flex-shrink:0;font-size:10px;padding:1px 6px" title="Copy command" onclick="event.stopPropagation();navigator.clipboard.writeText(${JSON.stringify(cmdStr)}).then(()=>showToast('Copied','Command copied','ok'))">⎘</button></div></div>` : ''}
+            ${flagsStr ? `<div class="le-row"><div class="le-lbl">Flags</div><div class="le-val mono" style="display:flex;align-items:flex-start;gap:8px"><span title="${esc(flagsStr)}">${esc(flagsStr.slice(0, 300))}${flagsStr.length > 300 ? '…' : ''}</span><button class="btn" style="flex-shrink:0;font-size:10px;padding:1px 6px" title="Copy flags" onclick="event.stopPropagation();navigator.clipboard.writeText(${JSON.stringify(flagsStr)}).then(()=>showToast('Copied','Flags copied','ok'))">⎘</button></div></div>` : ''}
+            <div class="le-row"><div class="le-lbl">Project</div><div class="le-val"><span class="gf-proj-tag">${esc(projName)}</span></div></div>
+            <div class="le-row"><div class="le-lbl">Type</div><div class="le-val">${esc(l.type || 'repeat')}</div></div>
+            <div class="le-row"><div class="le-lbl">Interval</div><div class="le-val">${esc(intervalStr || '—')}</div></div>
+            <div class="le-row"><div class="le-lbl">Status</div><div class="le-val">${isHil ? '⚠ hil:pending' : (running ? '● running' : (isFinished ? '✓ done' : '○ stopped'))}</div></div>
+            ${isHil && l.id ? `<div class="le-row"><div class="le-lbl">HIL file</div><div class="le-val mono" style="color:oklch(75% 0.16 60);word-break:break-all">.monomind/loops/${esc(l.id)}-hil.md</div></div>` : ''}
+            <div class="le-row"><div class="le-lbl">Started</div><div class="le-val mono">${esc(startedAt)}</div></div>
+            ${(()=>{ const sMs=l.startedAt?(typeof l.startedAt==='number'?l.startedAt:new Date(l.startedAt).getTime()):0; const age=sMs>0&&sMs<Date.now()?Date.now()-sMs:0; return age>0?`<div class="le-row"><div class="le-lbl">Running for</div><div class="le-val">${fmtDur(age)}</div></div>`:''; })()}
+            <div class="le-row"><div class="le-lbl">Last run</div><div class="le-val" title="${l.lastRunAt ? new Date(typeof l.lastRunAt === 'number' ? l.lastRunAt : Number(l.lastRunAt) || l.lastRunAt).toLocaleString() : ''}">${esc(lastRun)}</div></div>
+            <div class="le-row"><div class="le-lbl">${isTillend ? 'Progress' : 'Run count'}</div><div class="le-val">${esc(runCountDisplay)}</div></div>
+            ${l.source ? `<div class="le-row"><div class="le-lbl">Source</div><div class="le-val">${esc(l.source)}</div></div>` : ''}
+            ${buildLoopSparkline(l)}
+          </div>`;
+      }).join('');
+      sections.push(`<div style="margin-bottom:18px">
+        <div class="m-group-title" style="margin-bottom:6px">${esc(projName)}</div>
+        ${rows}
+      </div>`);
+    }
+
+    document.getElementById('bdg-global-loops').textContent = totalLoops || '—';
+    document.getElementById('gl-sub').textContent = `${totalLoops} loop${totalLoops !== 1 ? 's' : ''} across ${sections.length} project${sections.length !== 1 ? 's' : ''}`;
+
+    if (!sections.length) {
+      el.innerHTML = '<div class="empty"><div class="empty-ico">↺</div><div>No loops found across projects</div></div>';
+      return;
+    }
+    el.innerHTML = sections.join('');
+    startCountdowns();
+  } catch (err) {
+    el.innerHTML = '<div class="empty">Could not load: ' + esc(err.message) + '</div>';
+  }
+}
+
+// ── global tokens (multi-project) ──────────────────────────
+async function renderGlobalTokens() {
+  const el = document.getElementById('gt-content');
+  el.innerHTML = '<div class="loading-txt">Loading all projects…</div>';
+  try {
+    const data = await apiFetch('/api/projects');
+    const allProjects = data?.projects || [];
+    const projects = allProjects.slice(0, 20);
+    if (!projects.length) {
+      el.innerHTML = '<div class="empty"><div class="empty-ico">$</div><div>No projects found</div></div>';
+      return;
+    }
+
+    const results = await Promise.allSettled(
+      projects.map(p => apiFetch('/api/section?name=tokens&dir=' + enc(p.path)).then(d => ({
+        project: p,
+        tokens: d?.tokens?.summary || {}
+      })))
+    );
+
+    let aggTodayCost = 0, aggMonthCost = 0, aggTotalTokens = 0;
+    const rows = [];
+    for (const r of results) {
+      if (r.status !== 'fulfilled') continue;
+      const { project, tokens: s } = r.value;
+      const projName = project.name || project.slug || project.path?.split('/').pop() || '?';
+      const todayCost = typeof s.todayCost === 'number' ? s.todayCost : 0;
+      const monthCost = typeof s.monthCost === 'number' ? s.monthCost : 0;
+      const totalTokens = s.totalTokens != null ? Number(s.totalTokens) : 0;
+      const totalCost = typeof s.totalCost === 'number' ? s.totalCost : (monthCost || todayCost);
+      aggTodayCost += todayCost;
+      aggMonthCost += monthCost;
+      aggTotalTokens += totalTokens;
+      rows.push({ projName, todayCost, monthCost, totalTokens, totalCost });
+    }
+    rows.sort((a, b) => b.totalCost - a.totalCost);
+
+    const cards = [
+      { label: 'Today Cost',    val: '$' + aggTodayCost.toFixed(2) },
+      { label: 'Month Cost',    val: '$' + aggMonthCost.toFixed(2) },
+      { label: 'Total Tokens',  val: aggTotalTokens > 0 ? Number(aggTotalTokens).toLocaleString() : '—' },
+    ].map(c => `<div class="tok-card"><div class="tc-label">${esc(c.label)}</div><div class="tc-val">${esc(c.val)}</div></div>`).join('');
+
+    const tableRows = rows.map(r => `<tr style="border-top:1px solid var(--border)">
+      <td style="padding:4px 8px 4px 0;color:var(--text-hi);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="${esc(r.projName)}">${esc(r.projName)}</td>
+      <td style="padding:4px 8px;color:var(--accent)">$${r.todayCost.toFixed(2)}</td>
+      <td style="padding:4px 8px;color:var(--text-lo)">$${r.monthCost.toFixed(2)}</td>
+      <td style="padding:4px 8px;color:var(--text-lo)">${r.totalTokens > 0 ? Number(r.totalTokens).toLocaleString() : '—'}</td>
+      <td style="padding:4px 8px;color:var(--accent)">$${r.totalCost.toFixed(2)}</td>
+    </tr>`).join('');
+
+    const projectCount = rows.length;
+    document.getElementById('gt-sub').textContent = allProjects.length > 20
+      ? `Token usage across ${projectCount} of ${allProjects.length} projects`
+      : `Token usage across ${projectCount} project${projectCount !== 1 ? 's' : ''}`;
+
+    el.innerHTML = `<div id="gt-cards" style="display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px">${cards}</div>
+      <div id="gt-table">
+        <div class="m-group-title" style="margin-bottom:6px">Projects by cost</div>
+        <div style="overflow-x:auto"><table style="width:100%;border-collapse:collapse;font-size:11px;font-family:monospace">
+          <thead><tr style="color:var(--text-xs);text-align:left">
+            <th style="padding:4px 8px 4px 0">Project</th>
+            <th style="padding:4px 8px">Today</th>
+            <th style="padding:4px 8px">Month</th>
+            <th style="padding:4px 8px">Total Tokens</th>
+            <th style="padding:4px 8px">Total Cost</th>
+          </tr></thead>
+          <tbody>${tableRows}</tbody>
+        </table></div>
+      </div>`;
+  } catch (err) {
+    el.innerHTML = '<div class="empty">Could not load: ' + esc(err.message) + '</div>';
+  }
+}
+
 // ── feature 4: budget cap + desktop notification ───────────
-let budget = JSON.parse(localStorage.getItem('mm-budget') || '{}');
+let budget = (function(){ try { return JSON.parse(localStorage.getItem('mm-budget') || '{}'); } catch { return {}; } })();
 
 function openBudgetModal() {
   const b = budget;
@@ -3589,6 +4045,7 @@ function saveBudget() {
   closeBudgetModal();
   checkBudget(); // check immediately
   updateBudgetBtnStyle();
+  showToast('Budget saved', budget.daily || budget.monthly ? `Daily: ${budget.daily ? '$'+budget.daily : '—'} · Monthly: ${budget.monthly ? '$'+budget.monthly : '—'}` : 'Budget cleared', 'ok');
 }
 
 function updateBudgetBtnStyle() {
@@ -3600,21 +4057,36 @@ function updateBudgetBtnStyle() {
 
 function checkBudget() {
   const cost = alertState.todayCost;
-  if (!cost) return;
-  if (budget.daily) {
+  const moCost = alertState.monthCost;
+  // Daily budget check
+  if (budget.daily && cost) {
     const pct = cost / budget.daily;
     if (pct >= 1 && !dismissedAlerts.has('budget-daily-over')) {
       alertState.budgetAlert = `Daily budget exceeded: $${cost.toFixed(2)} / $${budget.daily}`;
       alertState.budgetCls = 'alert-crit';
+      updateAlerts(); return;
     } else if (pct >= 0.8 && !dismissedAlerts.has('budget-daily-warn')) {
       alertState.budgetAlert = `Approaching daily budget: $${cost.toFixed(2)} / $${budget.daily}`;
       alertState.budgetCls = 'alert-warn';
       maybeNotify('monomind budget', `$${cost.toFixed(2)} of $${budget.daily} daily budget used`);
-    } else {
-      alertState.budgetAlert = null;
+      updateAlerts(); return;
+    }
+  }
+  // Monthly budget check
+  if (budget.monthly && moCost) {
+    const mpct = moCost / budget.monthly;
+    if (mpct >= 1 && !dismissedAlerts.has('budget-monthly-over')) {
+      alertState.budgetAlert = `Monthly budget exceeded: $${moCost.toFixed(2)} / $${budget.monthly}`;
+      alertState.budgetCls = 'alert-crit';
+      updateAlerts(); return;
+    } else if (mpct >= 0.8 && !dismissedAlerts.has('budget-monthly-warn')) {
+      alertState.budgetAlert = `Approaching monthly budget: $${moCost.toFixed(2)} / $${budget.monthly}`;
+      alertState.budgetCls = 'alert-warn';
+      updateAlerts(); return;
     }
-    updateAlerts();
   }
+  alertState.budgetAlert = null;
+  updateAlerts();
 }
 
 function maybeNotify(title, body) {
@@ -3695,7 +4167,7 @@ function computeHealthScore(p) {
   const DAY = 86400000;
   // recency: up to +30 points for activity in last 7 days
   if (p.lastActivity) {
-    const age = now - (typeof p.lastActivity === 'number' ? p.lastActivity : new Date(p.lastActivity).getTime());
+    const age = now - (typeof p.lastActivity === 'number' ? p.lastActivity : Number(p.lastActivity) || new Date(p.lastActivity).getTime() || 0);
     if (age < DAY)       score += 30;
     else if (age < 3*DAY) score += 20;
     else if (age < 7*DAY) score += 10;
@@ -3736,7 +4208,7 @@ function buildBreakdownByName(events) {
     const pct = Math.round(cnt / total * 100);
     return `<div class="tb-row">
       <div class="tb-lbl" style="width:54px" title="${esc(name)}">${esc(name.length > 8 ? name.slice(0,7)+'…' : name)}</div>
-      <div class="tb-bar-wrap"><div class="tb-bar" style="width:${pct}%;background:${getColor(name)}"></div></div>
+      <div class="tb-bar-wrap" title="${esc(name)}: ${pct}% (${cnt} call${cnt!==1?'s':''})"><div class="tb-bar" style="width:${pct}%;background:${getColor(name)}"></div></div>
       <div class="tb-count">${cnt}</div>
     </div>`;
   }).join('');
@@ -3760,7 +4232,7 @@ function buildDigest() {
   const todayStart = new Date(); todayStart.setHours(0, 0, 0, 0);
   const todaySessions = allSessions.filter(s => {
     const t = s.lastTs || s.mtime;
-    return t && new Date(typeof t === 'number' ? t : t).getTime() >= todayStart.getTime();
+    return t && new Date(typeof t === 'number' ? t : Number(t) || t).getTime() >= todayStart.getTime();
   });
   if (!todaySessions.length) return;
 
@@ -3779,8 +4251,8 @@ function buildDigest() {
   const stats = [
     `${todaySessions.length} session${todaySessions.length > 1 ? 's' : ''}`,
     totalCost > 0 ? `$${totalCost.toFixed(2)} spent` : null,
-    totalTools > 0 ? `${totalTools} tool calls` : null,
-    totalMsgs > 0 ? `${totalMsgs} messages` : null,
+    totalTools > 0 ? `${totalTools.toLocaleString()} tool calls` : null,
+    totalMsgs > 0 ? `${totalMsgs.toLocaleString()} messages` : null,
     longestMs > 0 ? `${fmtDur(longestMs)} longest` : null,
     ...themes.map(t => `#${t}`),
   ].filter(Boolean);
@@ -3792,7 +4264,7 @@ function buildDigest() {
   const monthCostSoFar = allSessions.filter(s => {
     const t = s.firstTs || s.mtime;
     if (!t) return false;
-    const d = new Date(typeof t === 'number' ? t : t);
+    const d = new Date(typeof t === 'number' ? t : Number(t) || t);
     return d.getFullYear() === today2.getFullYear() && d.getMonth() === today2.getMonth();
   }).reduce((a, s) => a + (s.totalCost || 0), 0);
   const dailyAvg = dayOfMonth > 0 ? monthCostSoFar / dayOfMonth : 0;
@@ -3861,23 +4333,25 @@ function toggleLeaderboard() {
 }
 
 function renderLeaderboard() {
-  const sorted = [...allSessions]
+  const all = [...allSessions]
     .filter(s => typeof s.totalCost === 'number' && s.totalCost > 0)
-    .sort((a, b) => b.totalCost - a.totalCost)
-    .slice(0, 15);
+    .sort((a, b) => b.totalCost - a.totalCost);
+  const sorted = all.slice(0, 15);
   const body = document.getElementById('lb-body');
-  if (!sorted.length) { body.innerHTML = '<tr><td colspan="4" style="text-align:center;color:var(--text-xs);padding:12px">No cost data yet</td></tr>'; return; }
+  const overflow = document.getElementById('lb-overflow');
+  if (!sorted.length) { body.innerHTML = '<tr><td colspan="4" style="text-align:center;color:var(--text-xs);padding:12px">No cost data yet</td></tr>'; if (overflow) overflow.textContent = ''; return; }
   body.innerHTML = sorted.map((s, i) => {
     const cost = '$' + s.totalCost.toFixed(2);
     const dur = s.totalDurationMs ? fmtDur(s.totalDurationMs) : '—';
     const prompt = s.lastPrompt || s.id;
     return `<tr onclick="jumpToSession('${esc(s.id)}')" title="${esc(prompt)}">
       <td class="lb-rank">${i + 1}</td>
-      <td class="lb-prompt">${esc(prompt.slice(0, 60))}</td>
+      <td class="lb-prompt">${esc(prompt.slice(0, 60))}${prompt.length > 60 ? '…' : ''}</td>
       <td class="lb-cost">${cost}</td>
       <td class="lb-dur">${dur}</td>
     </tr>`;
   }).join('');
+  if (overflow) overflow.textContent = all.length > 15 ? `Showing 15 of ${all.length} sessions` : '';
 }
 
 // ── feature 12: session diff ──────────────────────────────
@@ -3994,7 +4468,7 @@ async function exportSession() {
     const events = data.events || [];
     const lines = [
       `# Session: ${sess.lastPrompt || sess.id}`,
-      `> ${new Date(sess.lastTs || sess.mtime).toLocaleString()}`,
+      `> ${new Date(typeof (sess.lastTs || sess.mtime) === 'number' ? (sess.lastTs || sess.mtime) : Number(sess.lastTs || sess.mtime) || (sess.lastTs || sess.mtime)).toLocaleString()}`,
       sess.totalCost != null ? `> Cost: $${sess.totalCost.toFixed(2)}` : '',
       sess.totalDurationMs ? `> Duration: ${fmtDur(sess.totalDurationMs)}` : '',
       '',
@@ -4002,7 +4476,7 @@ async function exportSession() {
     for (const ev of events) {
       if (ev.kind === 'user' && ev.text?.trim()) {
         lines.push(`\n## ${ev.text.trim().slice(0, 80)}`);
-        if (ev.ts) lines.push(`_${new Date(ev.ts).toLocaleTimeString()}_`);
+        if (ev.ts) lines.push(`_${new Date(typeof ev.ts === 'number' ? ev.ts : Number(ev.ts) || ev.ts).toLocaleTimeString()}_`);
       } else if (ev.kind === 'tool') {
         const label = ev.label || ev.name || ev.cat;
         lines.push(`- \`${ev.name || ev.cat}\`${label ? ': ' + label : ''}${ev._errored ? ' ⚠ error' : ''}`);
@@ -4078,9 +4552,9 @@ function renderBurnGauge() {
   }
   const now = Date.now();
   // calls in last 5 min, 15 min, 60 min
-  const t5  = tools.filter(e => now - new Date(e.ts).getTime() < 300000).length;
-  const t15 = tools.filter(e => now - new Date(e.ts).getTime() < 900000).length;
-  const t60 = tools.filter(e => now - new Date(e.ts).getTime() < 3600000).length;
+  const t5  = tools.filter(e => now - (typeof e.ts === 'number' ? e.ts : Number(e.ts) || 0) < 300000).length;
+  const t15 = tools.filter(e => now - (typeof e.ts === 'number' ? e.ts : Number(e.ts) || 0) < 900000).length;
+  const t60 = tools.filter(e => now - (typeof e.ts === 'number' ? e.ts : Number(e.ts) || 0) < 3600000).length;
   const rate5  = (t5  / 5).toFixed(1);   // calls/min
   const rate15 = (t15 / 15).toFixed(1);
   const rate60 = (t60 / 60).toFixed(1);
@@ -4109,7 +4583,7 @@ function buildSwimlane() {
   const LANE_HUES = [75, 200, 300, 150, 25, 220, 340, 120];
   const rows = recent.map((s, si) => {
     const start = s.firstTs || s.startTs || s.mtime || now;
-    const startMs = typeof start === 'number' ? start : new Date(start).getTime();
+    const startMs = typeof start === 'number' ? start : Number(start) || new Date(start).getTime() || 0;
     const dur = s.totalDurationMs || 60000;
     const endMs = startMs + dur;
     const leftPct  = Math.max(0, Math.min(100, ((startMs - windowStart) / windowMs) * 100));
@@ -4127,17 +4601,17 @@ function buildSwimlane() {
   }).join('');
   // dead time: find largest gap between consecutive sessions
   const sorted = recent.slice().sort((a, b) => {
-    const aTs = typeof (a.firstTs || a.mtime) === 'number' ? (a.firstTs || a.mtime) : new Date(a.firstTs || a.mtime).getTime();
-    const bTs = typeof (b.firstTs || b.mtime) === 'number' ? (b.firstTs || b.mtime) : new Date(b.firstTs || b.mtime).getTime();
+    const _aT = a.firstTs || a.mtime; const aTs = typeof _aT === 'number' ? _aT : Number(_aT) || new Date(_aT).getTime() || 0;
+    const _bT = b.firstTs || b.mtime; const bTs = typeof _bT === 'number' ? _bT : Number(_bT) || new Date(_bT).getTime() || 0;
     return aTs - bTs;
   });
   let maxGapMs = 0; let gapStart = 0;
   for (let i = 1; i < sorted.length; i++) {
     const prev = sorted[i - 1];
     const curr = sorted[i];
-    const prevTs = typeof (prev.firstTs || prev.mtime) === 'number' ? (prev.firstTs || prev.mtime) : new Date(prev.firstTs || prev.mtime).getTime();
+    const _pT = prev.firstTs || prev.mtime; const prevTs = typeof _pT === 'number' ? _pT : Number(_pT) || new Date(_pT).getTime() || 0;
     const prevEnd = prevTs + (prev.totalDurationMs || 60000);
-    const currTs = typeof (curr.firstTs || curr.mtime) === 'number' ? (curr.firstTs || curr.mtime) : new Date(curr.firstTs || curr.mtime).getTime();
+    const _cT = curr.firstTs || curr.mtime; const currTs = typeof _cT === 'number' ? _cT : Number(_cT) || new Date(_cT).getTime() || 0;
     const gap = currTs - prevEnd;
     if (gap > maxGapMs) { maxGapMs = gap; gapStart = prevEnd; }
   }
@@ -4171,6 +4645,33 @@ function buildLoopSparkline(l) {
   return `<div class="le-spark"><span style="font-size:10px;color:var(--text-xs)">last ${runHistory.slice(-10).length} runs</span><div class="loop-sparkline">${bars}</div></div>`;
 }
 
+function fmtInterval(v) {
+  if (!v && v !== 0) return '';
+  if (typeof v === 'string') return v;
+  const m = parseInt(v);
+  if (isNaN(m) || m <= 0) return String(v);
+  if (m < 60) return m + 'm';
+  if (m % 60 === 0) return (m / 60) + 'h';
+  return Math.floor(m / 60) + 'h ' + (m % 60) + 'm';
+}
+
+function fmtCountdown(nextAt) {
+  const ms = parseInt(nextAt) - Date.now();
+  if (ms <= 0) return 'overdue';
+  const h = Math.floor(ms / 3600000);
+  const m = Math.floor((ms % 3600000) / 60000);
+  const s = Math.floor((ms % 60000) / 1000);
+  if (h > 0) return `next in ${h}h ${m}m`;
+  return m > 0 ? `next in ${m}m ${s}s` : `next in ${s}s`;
+}
+
+function shortPath(p) {
+  if (!p) return '—';
+  const parts = p.replace(/\\/g, '/').split('/').filter(Boolean);
+  if (parts.length <= 2) return p;
+  return '…/' + parts.slice(-2).join('/');
+}
+
 // ── loops ──────────────────────────────────────────────────
 async function renderLoops() {
   const el = document.getElementById('loops-content');
@@ -4178,49 +4679,115 @@ async function renderLoops() {
   try {
     const data = await apiFetch('/api/loops?dir=' + enc(DIR));
     const loops = Array.isArray(data) ? data : (data.loops || []);
-    document.getElementById('bdg-loops').textContent = loops.length || '—';
+    const hilCountL = loops.filter(l => l.status === 'hil:pending').length;
+    document.getElementById('bdg-loops').textContent = loops.length ? (hilCountL ? loops.length + '⚠' : loops.length) : '—';
     if (!loops.length) {
-      el.innerHTML = '<div class="empty"><div class="empty-ico">↺</div><div>No loops scheduled</div></div>';
+      el.innerHTML = '<div class="empty"><div class="empty-ico">↺</div><div>No loops scheduled</div><div style="font-size:11px;color:var(--text-xs);margin-top:4px">Create one with <code>+ New Loop</code> above or via <code>npx monomind autodev --tillend</code></div></div>';
       return;
     }
-    el.innerHTML = loops.map((l, idx) => {
-      const running = l.status !== 'stopped' && l.status !== 'paused';
-      const name = l.name || (l.prompt || 'loop').split('--')[0].trim().slice(0, 60);
-      const interval = l.interval || l.schedule || '';
-      const fullPrompt = l.prompt || l.command || '';
-      const startedAt = l.startedAt ? new Date(l.startedAt).toLocaleString() : '—';
-      const lastRun = l.lastRunAt ? relTime(l.lastRunAt) : (l.startedAt ? relTime(l.startedAt) : '—');
-      const runs = l.currentRep != null ? l.currentRep : '—';
-      const nextAt = l.nextRunAt ? parseInt(l.nextRunAt) : 0;
-      const maxReps = l.maxReps || 0;
-      const curRep  = l.currentRep || 0;
-      const pct = (maxReps > 0) ? Math.min(100, Math.round(curRep / maxReps * 100)) : 0;
-      const progBar = (maxReps > 0 && running)
+    // Deduplicate: hide hook/lock entries shadowed by _repeat.md entries
+    const hasRepeatLoops = loops.some(l => l.source === '_repeat.md');
+    const repeatPrompts = new Set(loops.filter(l => l.source === '_repeat.md').map(l => (l.prompt || '').trim()));
+    const dedupedLoops = loops.filter(l => {
+      if (l.source === 'scheduled_tasks_lock' && hasRepeatLoops) return false;
+      if (l.source !== 'schedule_wakeup_hook') return true;
+      const m = (l.prompt || '').match(/--loop\s+\S+\s+(.+)$/s);
+      if (!m) return true;
+      return !repeatPrompts.has(m[1].trim());
+    });
+    el.innerHTML = dedupedLoops.map((l, idx) => {
+      const isHil      = l.status === 'hil:pending';
+      const isTillend  = l.type === 'tillend';
+      const curRep      = l.currentRep || 0;
+      const maxReps     = l.maxReps || 0;
+      const nextAt      = l.nextRunAt ? parseInt(l.nextRunAt) : 0;
+      // Loops with status 'running'/'waiting'/'active' are explicitly active.
+      // Don't mark them overdue unless nextRunAt is >2h stale (loop died without cleanup).
+      const isExplicitlyActive = l.status === 'running' || l.status === 'waiting' || l.status === 'active';
+      const LOOP_STALE_MS = 2 * 60 * 60 * 1000;
+      const isOverdue  = !l.status?.startsWith('hil') && !isExplicitlyActive &&
+        nextAt > 0 && nextAt <= Date.now();
+      const isStaledActive = isExplicitlyActive && nextAt > 0 &&
+        (Date.now() - nextAt) > LOOP_STALE_MS;
+      const isFinished = isOverdue || isStaledActive ||
+        (!isExplicitlyActive && maxReps > 0 && curRep >= maxReps) ||
+        l.status === 'finished' || l.status === 'done' ||
+        l.status === 'complete' || l.status === 'completed' || l.status === 'expired';
+      const running    = !isFinished && l.status !== 'stopped' && l.status !== 'paused';
+      const intervalStr = fmtInterval(l.interval || l.schedule);
+      // Parse loop into consistent: userPrompt / command / flags
+      const _lp = (function(_l) {
+        if (_l.command) {
+          const flags = [];
+          if (_l.type && _l.type !== 'repeat') flags.push('--' + _l.type);
+          if (_l.maxReps) flags.push('--maxruns ' + _l.maxReps);
+          if (_l.interval) { const s = String(_l.interval).match(/^(\d+)s$/); if (s) flags.push('--wait ' + s[1]); }
+          if (_l.currentRep != null) flags.push('--rep ' + _l.currentRep);
+          if (_l.id) flags.push('--loop ' + _l.id);
+          return { userPrompt: _l.prompt || '', command: _l.command, flagsStr: flags.join(' ') };
+        }
+        const full = _l.prompt || '';
+        const cmdM = full.match(/^(\/\S+)/);
+        if (!cmdM) return { userPrompt: full, command: '', flagsStr: '' };
+        const tokens = full.slice(cmdM[1].length).trim().split(/\s+/);
+        let ti = 0, fp = [];
+        while (ti < tokens.length && tokens[ti] && tokens[ti].startsWith('--')) {
+          fp.push(tokens[ti++]);
+          if (ti < tokens.length && tokens[ti] && !tokens[ti].startsWith('--')) fp.push(tokens[ti++]);
+        }
+        return { userPrompt: tokens.slice(ti).join(' '), command: cmdM[1], flagsStr: fp.join(' ') };
+      })(l);
+      const userPrompt  = _lp.userPrompt;
+      const cmdStr      = _lp.command;
+      const flagsStr    = _lp.flagsStr;
+      const fullPrompt  = l.prompt || '';
+      const name        = (l.name || userPrompt || cmdStr || 'loop').slice(0, 60);
+      const startedAt   = l.startedAt ? new Date(l.startedAt).toLocaleString() : '—';
+      const lastRun     = l.lastRunAt ? relTime(l.lastRunAt) : (l.startedAt ? relTime(l.startedAt) : '—');
+      const pct = (!isTillend && maxReps > 0) ? Math.min(100, Math.round(curRep / maxReps * 100)) : 0;
+      const progBar = (!isTillend && maxReps > 0 && running)
         ? `<div class="lp-bar"><div class="lp-fill" style="width:${pct}%"></div></div>`
         : '';
-      const cdownSpan = (running && nextAt)
-        ? ` <span class="loop-cdown" data-nextat="${nextAt}">…</span>`
+      const runCountDisplay = isTillend
+        ? `run ${curRep} / ∞${maxReps > 0 ? ' (cap: ' + maxReps + ')' : ''}`
+        : (maxReps > 0 ? `${curRep} / ${maxReps}` : String(curRep || '—'));
+      const cdownSpan = nextAt
+        ? ` <span class="loop-cdown${nextAt - Date.now() <= 0 ? ' overdue' : ''}" data-nextat="${nextAt}">${fmtCountdown(nextAt)}</span>`
         : '';
       const stopBtn = running
-        ? `<button class="loop-stop-btn" data-loop-id="${esc(l.id || l.name || String(idx))}" onclick="stopLoop(event, this.dataset.loopId)">■ Stop</button>`
+        ? `<button class="loop-stop-btn" data-loop-id="${esc(l.id || l.name || String(idx))}" onclick="stopLoop(event, this.dataset.loopId)" title="Stop this loop">■ Stop</button>`
         : '';
-      return `<div class="loop-row" onclick="toggleLoop(this)">
-          <div class="loop-ico">↺</div>
+      const typeBadge = `<span class="loop-type-badge${isTillend ? ' tillend' : ''}">${esc(l.type || 'repeat')}</span>`;
+      const statusClass = isHil ? 'hil' : (running ? 'active' : 'stopped');
+      const statusLabel = isHil ? '⚠ HIL' : (running ? 'active' : (isFinished ? 'done' : 'stopped'));
+      const hilBanner = isHil
+        ? `<div class="loop-hil-banner">⚠ Waiting for human response — open HIL file to resume</div>`
+        : '';
+      const metaParts = [intervalStr, l.description].filter(Boolean).join(' · ').slice(0, 80);
+      return `<div class="loop-row" data-loop-status="${esc(l.status || '')}" onclick="toggleLoop(this)">
+          <div class="loop-ico">${isTillend ? '∞' : '↺'}</div>
           <div class="loop-body">
-            <div class="loop-name">${esc(name)}</div>
-            <div class="loop-meta">${esc([interval, l.description].filter(Boolean).join(' · ').slice(0, 80))}${cdownSpan}</div>
+            <div class="loop-name" title="${esc(userPrompt || fullPrompt)}">${typeBadge}${esc(name)}</div>
+            <div class="loop-meta">${esc(metaParts)}${cdownSpan}</div>
+            ${hilBanner}
             ${progBar}
           </div>
-          <div class="loop-status ${running ? 'active' : 'stopped'}">${running ? 'active' : 'stopped'}</div>
+          <div class="loop-status ${statusClass}">${statusLabel}</div>
           ${stopBtn}
         </div>
         <div class="loop-expand">
-          ${fullPrompt ? `<div class="le-row"><div class="le-lbl">Prompt</div><div class="le-val mono">${esc(fullPrompt.slice(0, 300))}</div></div>` : ''}
-          <div class="le-row"><div class="le-lbl">Interval</div><div class="le-val">${esc(interval || '—')}</div></div>
-          <div class="le-row"><div class="le-lbl">Status</div><div class="le-val">${running ? '● running' : '○ stopped'}</div></div>
+          ${userPrompt ? `<div class="le-row"><div class="le-lbl">Prompt</div><div class="le-val mono" style="display:flex;align-items:flex-start;gap:8px"><span title="${esc(userPrompt)}">${esc(userPrompt.slice(0, 300))}${userPrompt.length > 300 ? '…' : ''}</span><button class="btn" style="flex-shrink:0;font-size:10px;padding:1px 6px" title="Copy prompt" onclick="event.stopPropagation();navigator.clipboard.writeText(${JSON.stringify(userPrompt)}).then(()=>showToast('Copied','Prompt copied','ok'))">⎘</button></div></div>` : ''}
+          ${cmdStr ? `<div class="le-row"><div class="le-lbl">Command</div><div class="le-val mono" style="display:flex;align-items:center;gap:8px"><span>${esc(cmdStr)}</span><button class="btn" style="flex-shrink:0;font-size:10px;padding:1px 6px" title="Copy command" onclick="event.stopPropagation();navigator.clipboard.writeText(${JSON.stringify(cmdStr)}).then(()=>showToast('Copied','Command copied','ok'))">⎘</button></div></div>` : ''}
+          ${flagsStr ? `<div class="le-row"><div class="le-lbl">Flags</div><div class="le-val mono" style="display:flex;align-items:flex-start;gap:8px"><span title="${esc(flagsStr)}">${esc(flagsStr.slice(0, 300))}${flagsStr.length > 300 ? '…' : ''}</span><button class="btn" style="flex-shrink:0;font-size:10px;padding:1px 6px" title="Copy flags" onclick="event.stopPropagation();navigator.clipboard.writeText(${JSON.stringify(flagsStr)}).then(()=>showToast('Copied','Flags copied','ok'))">⎘</button></div></div>` : ''}
+          <div class="le-row"><div class="le-lbl">Type</div><div class="le-val">${esc(l.type || 'repeat')}</div></div>
+          <div class="le-row"><div class="le-lbl">Interval</div><div class="le-val">${esc(intervalStr || '—')}</div></div>
+          <div class="le-row"><div class="le-lbl">Status</div><div class="le-val">${isHil ? '⚠ hil:pending' : (running ? '● running' : (isFinished ? '✓ done' : '○ stopped'))}</div></div>
+          ${isHil && l.id ? `<div class="le-row"><div class="le-lbl">HIL file</div><div class="le-val mono" style="color:oklch(75% 0.16 60);word-break:break-all">.monomind/loops/${esc(l.id)}-hil.md</div></div>` : ''}
           <div class="le-row"><div class="le-lbl">Started</div><div class="le-val mono">${esc(startedAt)}</div></div>
-          <div class="le-row"><div class="le-lbl">Last run</div><div class="le-val">${esc(lastRun)}</div></div>
-          <div class="le-row"><div class="le-lbl">Run count</div><div class="le-val">${esc(String(runs))}</div></div>
+          ${(()=>{ const sMs=l.startedAt?(typeof l.startedAt==='number'?l.startedAt:new Date(l.startedAt).getTime()):0; const age=sMs>0&&sMs<Date.now()?Date.now()-sMs:0; return age>0?`<div class="le-row"><div class="le-lbl">Running for</div><div class="le-val">${fmtDur(age)}</div></div>`:''; })()}
+          <div class="le-row"><div class="le-lbl">Last run</div><div class="le-val" title="${l.lastRunAt ? new Date(typeof l.lastRunAt === 'number' ? l.lastRunAt : Number(l.lastRunAt) || l.lastRunAt).toLocaleString() : ''}">${esc(lastRun)}</div></div>
+          <div class="le-row"><div class="le-lbl">${isTillend ? 'Progress' : 'Run count'}</div><div class="le-val">${esc(runCountDisplay)}</div></div>
+          ${l.source ? `<div class="le-row"><div class="le-lbl">Source</div><div class="le-val">${esc(l.source)}</div></div>` : ''}
           ${buildLoopSparkline(l)}
         </div>`;
     }).join('');
@@ -4257,7 +4824,20 @@ function hideLoopForm() {
 
 async function stopLoop(evt, id) {
   evt.stopPropagation();
-  if (!confirm('Stop loop "' + id + '"?')) return;
+  const btn = evt.currentTarget;
+  if (!btn.dataset.confirming) {
+    btn.dataset.confirming = '1';
+    btn.textContent = '■ Confirm?';
+    btn.style.cssText = 'background:oklch(55% 0.2 25 / 0.25);color:oklch(72% 0.2 25);border-color:oklch(55% 0.2 25 / 0.4)';
+    btn._resetTimer = setTimeout(() => {
+      delete btn.dataset.confirming;
+      btn.textContent = '■ Stop';
+      btn.style.cssText = '';
+    }, 3000);
+    return;
+  }
+  clearTimeout(btn._resetTimer);
+  delete btn.dataset.confirming;
   try {
     await fetch('/api/loops/stop?dir=' + enc(DIR), {
       method: 'POST', headers: { 'Content-Type': 'application/json' },
@@ -4276,12 +4856,30 @@ function startCountdowns() {
     document.querySelectorAll('.loop-cdown[data-nextat]').forEach(el => {
       const ms = parseInt(el.dataset.nextat) - Date.now();
       if (ms <= 0) {
-        el.textContent = 'overdue';
-        el.classList.add('overdue');
+        const row = el.closest('.loop-row');
+        const loopStatus = row ? (row.dataset.loopStatus || '') : '';
+        const isActiveStatus = loopStatus === 'running' || loopStatus === 'waiting' || loopStatus === 'active';
+        if (isActiveStatus) {
+          // Loop is between rounds or executing — not done, just waiting for next update
+          el.textContent = 'executing…';
+          el.classList.remove('overdue');
+        } else {
+          el.textContent = 'overdue';
+          el.classList.add('overdue');
+          if (row) {
+            const badge = row.querySelector('.loop-status');
+            if (badge && badge.classList.contains('active')) {
+              badge.classList.remove('active');
+              badge.classList.add('stopped');
+              badge.textContent = 'done';
+            }
+            const stopBtn = row.querySelector('.loop-stop-btn');
+            if (stopBtn) stopBtn.remove();
+          }
+        }
         return;
       }
-      const m = Math.floor(ms / 60000), s = Math.floor((ms % 60000) / 1000);
-      el.textContent = m > 0 ? `next in ${m}m ${s}s` : `next in ${s}s`;
+      el.textContent = fmtCountdown(el.dataset.nextat);
       el.classList.remove('overdue');
     });
   }, 1000);
@@ -4334,7 +4932,7 @@ function buildEfficiencyPanel() {
       <span class="eff-lbl" title="${esc(s.lastPrompt||s.id)}">${esc(lbl)}</span>
       <span class="eff-pct ${cls}">${pct}%</span>
     </div>
-    <div class="eff-bar-wrap"><div class="eff-bar-fill" style="width:${pct}%;background:${fillColor}"></div></div>`;
+    <div class="eff-bar-wrap" title="${esc(s.lastPrompt||s.id)}: ${pct}% cache efficiency"><div class="eff-bar-fill" style="width:${pct}%;background:${fillColor}"></div></div>`;
   }).join('');
   el.innerHTML = `<div class="m-group-title">Cache Efficiency <span class="${avgCls}" style="font-size:10px;font-weight:400">${avgPct}% avg</span></div>${rows}`;
 }
@@ -4371,10 +4969,10 @@ function renderModelMix() {
     const short = model.replace(/^claude-/,'').replace(/-\d{8}$/,'');
     const pct = totalCost > 0 ? Math.round(d.cost/totalCost*100) : 0;
     return `<tr>
-      <td style="font-size:11px">${esc(short)}</td>
+      <td style="font-size:11px" title="${esc(model)}">${esc(short)}</td>
       <td class="lb-cost">$${d.cost.toFixed(2)}</td>
       <td class="lb-dur">${pct}%</td>
-      <td class="lb-dur">${d.calls}</td>
+      <td class="lb-dur">${d.calls.toLocaleString()}</td>
     </tr>`;
   }).join('')}
   </tbody></table>`;
@@ -4393,14 +4991,14 @@ function buildWeeklyRecap() {
   const weekStart = new Date(); weekStart.setDate(weekStart.getDate() - weekStart.getDay()); weekStart.setHours(0,0,0,0);
   const weekSess = allSessions.filter(s => {
     const t = s.lastTs || s.mtime;
-    return t && new Date(typeof t === 'number' ? t : t).getTime() >= weekStart.getTime();
+    return t && new Date(typeof t === 'number' ? t : Number(t) || t).getTime() >= weekStart.getTime();
   });
   if (!weekSess.length) return;
   const totalCost = weekSess.reduce((a,s) => a + (s.totalCost||0), 0);
   const totalTools = weekSess.reduce((a,s) => a + (s.toolCalls||0), 0);
   const days = new Set(weekSess.map(s => {
     const t = s.lastTs || s.mtime;
-    return new Date(typeof t === 'number' ? t : t).toDateString();
+    return new Date(typeof t === 'number' ? t : Number(t) || t).toDateString();
   })).size;
   const longestMs = Math.max(...weekSess.map(s => s.totalDurationMs||0));
   const streak = calcStreak();
@@ -4468,11 +5066,12 @@ function buildActivityHeatmap() {
   for (const s of allSessions) {
     const t = s.firstTs || s.mtime;
     if (!t) continue;
-    const d = new Date(typeof t === 'number' ? t : t);
+    const d = new Date(typeof t === 'number' ? t : Number(t) || t);
     grid[d.getDay()][d.getHours()]++;
   }
   const maxVal = Math.max(1, ...grid.flat());
   const DAYS = ['Su','Mo','Tu','We','Th','Fr','Sa'];
+  const FULL_DAYS = ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'];
   let html = '<div class="heatmap-grid">';
   html += '<div class="heatmap-row"><div class="heatmap-lbl"></div>';
   for (let h = 0; h < 24; h++) {
@@ -4485,7 +5084,7 @@ function buildActivityHeatmap() {
       const v = grid[d][h];
       const alpha = v > 0 ? Math.max(0.18, v/maxVal).toFixed(2) : 0;
       const bg = v > 0 ? `oklch(65% 0.18 200 / ${alpha})` : 'transparent';
-      html += `<div class="heatmap-cell" style="background:${bg};border:1px solid ${v>0?'transparent':'var(--border)'}" title="${DAYS[d]} ${h}:00 — ${v} session${v!==1?'s':''}"></div>`;
+      html += `<div class="heatmap-cell" style="background:${bg};border:1px solid ${v>0?'transparent':'var(--border)'}" title="${FULL_DAYS[d]} ${h}:00–${h+1}:00 — ${v} session${v!==1?'s':''}"></div>`;
     }
     html += '</div>';
   }
@@ -4567,8 +5166,8 @@ function v2RenderOrgList() {
     return `<div class="org-item${active}" data-org="${esc(o.name)}" onclick="v2SelectOrg(this.dataset.org)">
       <div class="oi-dot ${o.running ? 'running' : ''}"></div>
       <div class="oi-body">
-        <div class="oi-name">${esc(o.name)}</div>
-        ${goalSnip ? `<div class="oi-goal">${esc(goalSnip)}</div>` : ''}
+        <div class="oi-name" title="${esc(o.name)}">${esc(o.name)}</div>
+        ${goalSnip ? `<div class="oi-goal" title="${esc(o.goal || goalSnip)}">${esc(goalSnip)}</div>` : ''}
         <div class="oi-chips">
           ${o.running ? '<span class="oi-chip live">LIVE</span>' : ''}
           <span class="oi-chip">${rolesN} roles</span>
@@ -5034,7 +5633,7 @@ function v2RenderOrgRoles() {
   const pane = document.getElementById('odt-roles');
   if (!pane) return;
   if (!roles.length) {
-    pane.innerHTML = '<div class="empty">No roles defined</div>';
+    pane.innerHTML = '<div class="empty">No roles defined<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Roles are defined in the org config. Create an org with <code>npx monomind swarm init</code></div></div>';
     return;
   }
   // Determine leader: explicit reports_to=undefined + type=planner/coordinator, or first role, or id=boss
@@ -5106,7 +5705,7 @@ function v2RenderAgentDrawer(data) {
   headEl.innerHTML = `
     <img class="oad-avatar" src="${avatar}" alt="${esc(name)}" onerror="this.src='data/avatars/coder.svg'"/>
     <div class="oad-id">
-      <div class="oad-name">${esc(name)}</div>
+      <div class="oad-name" title="${esc(name)}">${esc(name)}</div>
       <div class="oad-pills">
         ${type ? `<span class="oad-pill">${esc(type)}</span>` : ''}
         ${model ? `<span class="oad-pill model">${esc(model)}</span>` : ''}
@@ -5184,7 +5783,7 @@ function v2RenderOrgActivity() {
   if (!_v2SelOrg) return;
   const activity = _v2OrgData?._activity || [];
   const orgEvents = _v2OrgEventLog[_v2SelOrg] || [];
-  const events = [...activity, ...orgEvents].sort((a,b) => (b.ts||0)-(a.ts||0)).slice(0,80);
+  const events = [...activity, ...orgEvents].sort((a,b) => (Number(b.ts)||0)-(Number(a.ts)||0)).slice(0,80);
   const pane = document.getElementById('odt-activity');
   if (!pane) return;
   const fmtOrgEvType = t => {
@@ -5192,13 +5791,14 @@ function v2RenderOrgActivity() {
     return m[t]||(t||'').replace(/^org:/,'');
   };
   if (!events.length) {
-    pane.innerHTML = '<div class="empty">No activity recorded</div>';
+    pane.innerHTML = '<div class="empty">No activity recorded<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Activity is emitted when org agents run. Start an org with <code>npx monomind swarm start</code></div></div>';
     return;
   }
   pane.innerHTML = `<div class="act-v2-list">${events.map(ev => {
-    const t = ev.ts ? new Date(ev.ts).toLocaleTimeString('en',{hour12:false,hour:'2-digit',minute:'2-digit',second:'2-digit'}) : '';
+    const t = ev.ts ? new Date(typeof ev.ts === 'number' ? ev.ts : Number(ev.ts) || ev.ts).toLocaleTimeString('en',{hour12:false,hour:'2-digit',minute:'2-digit',second:'2-digit'}) : '';
     const detail = ev.role||ev.msg||ev.agent||'';
-    return `<div class="av2-row"><span class="av2-time">${esc(t)}</span><span class="av2-type">${esc(fmtOrgEvType(ev.type))}</span><span class="av2-msg">${esc(detail)}</span></div>`;
+    const tFull = ev.ts ? new Date(typeof ev.ts === 'number' ? ev.ts : Number(ev.ts) || ev.ts).toLocaleString() : '';
+    return `<div class="av2-row"><span class="av2-time" title="${esc(tFull)}">${esc(t)}</span><span class="av2-type">${esc(fmtOrgEvType(ev.type))}</span><span class="av2-msg">${esc(detail)}</span></div>`;
   }).join('')}</div>`;
 }
 
@@ -5236,12 +5836,12 @@ function v2RenderOrgHeartbeats() {
       status: a.status || 'idle',
     }));
   }
-  if (!hb.length) { pane.innerHTML = '<div class="empty">No agents to report</div>'; return; }
+  if (!hb.length) { pane.innerHTML = '<div class="empty">No agents to report<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Agent heartbeats appear when agents are running. Spawn one with <code>npx monomind agent spawn</code></div></div>'; return; }
   const cls = (st) => (st === 'active' || st === 'running') ? 'on' : ((st === 'error' || st === 'failed') ? 'warn' : '');
   pane.innerHTML = `<div class="m-group-title">Agent Heartbeats</div>` +
     hb.slice(0, 50).map(h => `<div style="display:flex;justify-content:space-between;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid var(--border);font-size:12px">
-      <span style="color:var(--text-hi);font-family:var(--mono);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${esc(h.agent || '—')}</span>
-      <span style="color:var(--text-lo);white-space:nowrap">${h.ts ? relTime(h.ts) : 'never'}</span>
+      <span style="color:var(--text-hi);font-family:var(--mono);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="${esc(h.agent || '')}">${esc(h.agent || '—')}</span>
+      <span style="color:var(--text-lo);white-space:nowrap" title="${h.ts ? new Date(typeof h.ts === 'number' ? h.ts : Number(h.ts) || h.ts).toLocaleString() : ''}">${h.ts ? relTime(h.ts) : 'never'}</span>
       <span class="ss-pill ${cls(h.status)}">${esc(String(h.status || 'idle').toUpperCase())}</span>
     </div>`).join('');
 }
@@ -5260,15 +5860,15 @@ function v2RenderOrgTasks() {
       (Array.isArray(items) ? items : []).forEach(t => tasks.push({ ...t, status: t.status || col }));
     }
   }
-  if (!tasks.length) { pane.innerHTML = '<div class="empty">No tasks</div>'; return; }
+  if (!tasks.length) { pane.innerHTML = '<div class="empty">No tasks<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Tasks are created automatically when agents run. Start one with <code>npx monomind agent spawn</code></div></div>'; return; }
   const rank = { running: 0, doing: 0, todo: 1, pending: 1, done: 2 };
   tasks.sort((a, b) => (rank[a.status] ?? 1) - (rank[b.status] ?? 1));
   const pill = (st) => st === 'done' ? 'on' : (st === 'running' || st === 'doing' ? 'warn' : '');
   pane.innerHTML = `<div class="m-group-title">Tasks (${tasks.length})</div>` +
     tasks.slice(0, 80).map(t => `<div style="display:flex;gap:10px;align-items:baseline;padding:5px 0;border-bottom:1px solid var(--border);font-size:12px">
       <span class="ss-pill ${pill(t.status)}">${esc(t.status || '?')}</span>
-      <span style="flex:1;color:var(--text-hi);font-family:var(--mono);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${esc(t.description || t.title || t.id || '—')}</span>
-      <span style="color:var(--text-lo);white-space:nowrap">${relTime(t.ts || t.created_at || t.updated_at)}</span>
+      <span style="flex:1;color:var(--text-hi);font-family:var(--mono);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="${esc(t.description || t.title || t.id || '')}">${esc(t.description || t.title || t.id || '—')}</span>
+      <span style="color:var(--text-lo);white-space:nowrap" title="${(ts => ts ? new Date(typeof ts === 'number' ? ts : Number(ts) || ts).toLocaleString() : '')(t.ts || t.created_at || t.updated_at)}">${relTime(t.ts || t.created_at || t.updated_at)}</span>
     </div>`).join('');
 }
 
@@ -5292,7 +5892,7 @@ function v2RenderOrgCosts() {
       ? c.map(r => ({ label: r.label ?? r.name ?? '—', cost: Number(r.value ?? r.cost ?? 0), tin: 0, tout: 0 }))
       : Object.entries(c).map(([k, v]) => ({ label: k, cost: Number(v) || 0, tin: 0, tout: 0 }));
   }
-  if (!rows.length) { pane.innerHTML = '<div class="empty">No cost data</div>'; return; }
+  if (!rows.length) { pane.innerHTML = '<div class="empty">No cost data<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Cost tracking starts when agents run. Set a budget via the Org Settings tab.</div></div>'; return; }
   const cur = (b && b.currency) || 'USD';
   const period = (b && b.period) || '';
   const total = rows.reduce((s, r) => s + r.cost, 0);
@@ -5304,7 +5904,7 @@ function v2RenderOrgCosts() {
       <span style="color:var(--accent);font-family:var(--mono);font-size:15px;font-weight:600">$${total.toFixed(4)}</span>
     </div>` +
     rows.map(r => `<div style="display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:6px 0;border-bottom:1px solid var(--border);font-size:12px">
-      <span style="color:var(--text-hi);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${esc(String(r.label))}</span>
+      <span style="color:var(--text-hi);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="${esc(String(r.label))}">${esc(String(r.label))}</span>
       <span style="color:var(--text-lo);font-family:var(--mono);font-size:10px;white-space:nowrap">${(r.tin + r.tout).toLocaleString()} tok</span>
       <span style="color:var(--accent);font-family:var(--mono);white-space:nowrap">$${r.cost.toFixed(4)}</span>
     </div>`).join('') +
@@ -5321,14 +5921,14 @@ function v2RenderOrgMembers() {
   const roles = Array.isArray(_v2OrgData?.roles) ? _v2OrgData.roles : [];
   const list = members.length ? members : roles;
   const joinReqs = Array.isArray(_v2OrgData?._joinRequests) ? _v2OrgData._joinRequests : [];
-  if (!list.length) { pane.innerHTML = '<div class="empty">No members</div>'; return; }
+  if (!list.length) { pane.innerHTML = '<div class="empty">No members<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Add agents or humans via <code>npx monomind agent spawn --org &lt;name&gt;</code></div></div>'; return; }
   const src = members.length ? 'joined members' : 'defined roles';
   const active = (r) => r.running || r.active || r.status === 'active';
   pane.innerHTML = `<div class="m-group-title">Members (${list.length}) · ${src}</div>` +
     list.map(r => `<div style="display:flex;gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--border);font-size:12px">
       <span style="width:28px;height:28px;border-radius:50%;background:var(--surface-hi);display:inline-flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0">◈</span>
       <div style="flex:1;min-width:0">
-        <div style="color:var(--text-hi);font-family:var(--mono);font-size:12px">${esc(r.name || r.id || r.user || '—')}</div>
+        <div style="color:var(--text-hi);font-family:var(--mono);font-size:12px" title="${esc(r.name || r.id || r.user || '')}">${esc(r.name || r.id || r.user || '—')}</div>
         <div style="color:var(--text-lo);font-size:10px">${esc(r.title || r.type || r.role || '')}</div>
       </div>
       <span class="ss-pill ${active(r) ? 'on' : ''}">${active(r) ? 'ACTIVE' : 'IDLE'}</span>
@@ -5342,7 +5942,7 @@ function v2RenderOrgGoals() {
   const el = document.getElementById('odt-goals');
   if (!el || !_v2OrgData) return;
   const goals = _v2OrgData.goals || _v2OrgData.config?.goals || [];
-  if (!goals.length) { el.innerHTML = '<div class="empty">No goals defined</div>'; return; }
+  if (!goals.length) { el.innerHTML = '<div class="empty">No goals defined<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Add goals to the org config via <code>npx monomind swarm config --goal "…"</code></div></div>'; return; }
   function renderGoal(g, depth) {
     if (depth > 20) return '';   // Depth guard to prevent stack overflow
     const indent = depth * 20;
@@ -5366,7 +5966,7 @@ function v2RenderOrgBoard() {
   const el = document.getElementById('odt-board');
   if (!el || !_v2OrgData) return;
   const issues = _v2OrgData._issues || [];
-  if (!issues.length) { el.innerHTML = '<div class="empty">No issues</div>'; return; }
+  if (!issues.length) { el.innerHTML = '<div class="empty">No issues<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Issues are created by agents during task execution or via the Issues tab.</div></div>'; return; }
   const cols = ['open', 'in_progress', 'blocked', 'done', 'cancelled'];
   const PRIORITY = { urgent: '🔴', high: '🟠', medium: '🟡', low: '🟢' };
   el.innerHTML = `<div style="display:flex;gap:10px;overflow-x:auto;padding-bottom:8px">` +
@@ -5375,9 +5975,10 @@ function v2RenderOrgBoard() {
       return `<div style="min-width:160px;flex:1">
         <div style="font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:0.07em;color:var(--text-lo);padding:6px 0;border-bottom:1px solid var(--border);margin-bottom:8px">${esc(col.replace('_', ' '))} <span style="background:var(--surface-hi);padding:1px 6px;border-radius:8px">${cards.length}</span></div>
         ${cards.slice(0, 15).map(i => `<div style="background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:7px 9px;margin-bottom:5px;font-size:12px">
-          <div style="color:var(--text-hi)">${PRIORITY[i.priority] || ''} ${esc((i.title || i.description || '—').slice(0, 60))}</div>
+          <div style="color:var(--text-hi)" title="${esc(i.title || i.description || '')}">${PRIORITY[i.priority] || ''} ${esc((i.title || i.description || '—').slice(0, 60))}${(i.title || i.description || '').length > 60 ? '…' : ''}</div>
           ${i.assignee ? `<div style="font-size:10px;color:var(--text-lo);margin-top:3px">${esc(i.assignee)}</div>` : ''}
         </div>`).join('')}
+        ${cards.length > 15 ? `<div style="font-size:11px;color:var(--text-xs);text-align:center;padding:4px 0">+${cards.length - 15} more</div>` : ''}
       </div>`;
     }).join('') + `</div>`;
 }
@@ -5401,9 +6002,9 @@ function v2RenderOrgLive() {
   <div class="m-group-title" style="margin-bottom:6px">Activity Feed</div>
   <div style="max-height:240px;overflow-y:auto;font-size:11px;font-family:var(--mono)">
     ${(_v2OrgData._activity || []).slice(-30).reverse().map(e => `<div style="padding:3px 0;border-bottom:1px solid var(--border);color:var(--text-lo)">
-      ${esc(relTime(e.ts || e.timestamp || e.created_at))}
+      <span title="${(ts => ts ? new Date(typeof ts === 'number' ? ts : Number(ts) || ts).toLocaleString() : '')(e.ts || e.timestamp || e.created_at)}">${esc(relTime(e.ts || e.timestamp || e.created_at))}</span>
       <span style="color:var(--text-mid);margin-left:6px">${esc(e.type || e.kind || e.event || '—')}</span>
-      ${e.message ? `<span style="color:var(--text-hi);margin-left:6px">${esc(e.message.toString().slice(0, 80))}</span>` : ''}
+      ${e.message ? `<span style="color:var(--text-hi);margin-left:6px" title="${esc(e.message.toString())}">${esc(e.message.toString().slice(0, 80))}${e.message.toString().length > 80 ? '…' : ''}</span>` : ''}
     </div>`).join('')}
   </div>`;
   // auto-refresh every 5s while tab is active
@@ -5428,7 +6029,7 @@ async function v2RenderOrgApprovals() {
     const _enc = encodeURIComponent(_v2SelOrg);
     const data = await fetch(`/api/org/${_enc}/approvals${DIR ? '?dir=' + encodeURIComponent(DIR) : ''}`).then(r => r.ok ? r.json() : []).catch(() => []);
     const approvals = Array.isArray(data) ? data : (data.approvals || []);
-    if (!approvals.length) { el.innerHTML = '<div class="empty">No pending approvals</div>'; return; }
+    if (!approvals.length) { el.innerHTML = '<div class="empty">No pending approvals<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Approvals appear when agents request human confirmation before taking a sensitive action.</div></div>'; return; }
     el.innerHTML = `<table style="width:100%;border-collapse:collapse;font-size:12px">
       <thead><tr style="color:var(--text-xs);text-align:left">
         <th style="padding:6px 8px">Requester</th><th>Action</th><th>Status</th><th>Date</th><th></th>
@@ -5439,13 +6040,13 @@ async function v2RenderOrgApprovals() {
         const aid = a.id || '';
         return `<tr style="border-top:1px solid var(--border)">
           <td style="padding:6px 8px;color:var(--text-hi)">${esc(a.requester || a.agent || '—')}</td>
-          <td style="padding:6px 8px;color:var(--text-lo);max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${esc((a.action || a.description || '').slice(0, 80))}</td>
+          <td style="padding:6px 8px;color:var(--text-lo);max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="${esc(a.action || a.description || '')}">${esc((a.action || a.description || '').slice(0, 80))}${(a.action || a.description || '').length > 80 ? '…' : ''}</td>
           <td style="padding:6px 8px"><span class="ss-pill ${cls}">${esc(a.status || 'pending')}</span></td>
-          <td style="padding:6px 8px;color:var(--text-xs);font-size:11px;font-family:var(--mono)">${relTime(a.created_at || a.ts)}</td>
+          <td style="padding:6px 8px;color:var(--text-xs);font-size:11px;font-family:var(--mono)" title="${(ts => ts ? new Date(typeof ts === 'number' ? ts : Number(ts) || ts).toLocaleString() : '')(a.created_at || a.ts)}">${relTime(a.created_at || a.ts)}</td>
           <td style="padding:6px 8px;white-space:nowrap">
             ${pending
-              ? `<button class="btn" style="font-size:10px;color:var(--green);border-color:var(--green)" title="Approve" aria-label="Approve" onclick="orgApprovalAction(${JSON.stringify(aid)},'approve')">✓</button>
-                 <button class="btn" style="font-size:10px;color:var(--red);border-color:var(--red);margin-left:3px" title="Reject" aria-label="Reject" onclick="orgApprovalAction(${JSON.stringify(aid)},'reject')">✕</button>`
+              ? `<button class="btn" style="font-size:10px;color:var(--green);border-color:var(--green)" title="Approve" aria-label="Approve" onclick="orgApprovalAction(${JSON.stringify(aid).replace(/"/g, '&quot;')},'approve')">✓</button>
+                 <button class="btn" style="font-size:10px;color:var(--red);border-color:var(--red);margin-left:3px" title="Reject" aria-label="Reject" onclick="orgApprovalAction(${JSON.stringify(aid).replace(/"/g, '&quot;')},'reject')">✕</button>`
               : ''}
           </td>
         </tr>`;
@@ -5481,7 +6082,7 @@ async function v2RenderOrgSecrets() {
             ${s.purpose ? `<span style="color:var(--text-lo)">${esc(s.purpose)}</span>` : ''}
             <span style="margin-left:auto;font-family:var(--mono);color:var(--border)">••••••••</span>
           </div>`).join('')
-        : '<div class="empty">No secrets configured</div>');
+        : '<div class="empty">No secrets configured<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Add secrets to the org config under <code>secrets: []</code> — values are never stored in the dashboard.</div></div>');
   } catch (e) { el.innerHTML = '<div class="empty">Failed: ' + esc(e.message) + '</div>'; }
 }
 
@@ -5498,19 +6099,19 @@ function v2RenderOrgSettings() {
   el.innerHTML = `
     <div style="font-size:11px;color:var(--text-lo);margin-bottom:14px">Changes generate a CLI command — no direct writes from UI.</div>
     <div style="display:flex;flex-direction:column;gap:12px;max-width:380px">
-      <div><div class="le-lbl">Goal</div><input id="os-goal" class="filter-input" value="${esc(d.goal || '')}"></div>
+      <div><div class="le-lbl">Goal</div><input id="os-goal" class="filter-input" placeholder="Describe the org's mission…" value="${esc(d.goal || '')}"></div>
       <div><div class="le-lbl">Topology</div>
-        <select id="os-topo" class="filter-input" style="cursor:pointer">
+        <select id="os-topo" class="filter-input" title="Agent coordination topology" style="cursor:pointer">
           ${topos.map(t => `<option ${d.topology === t ? 'selected' : ''}>${esc(t)}</option>`).join('')}
         </select>
       </div>
       <div><div class="le-lbl">Governance</div>
-        <select id="os-gov" class="filter-input" style="cursor:pointer">
+        <select id="os-gov" class="filter-input" title="Governance / consensus strategy" style="cursor:pointer">
           ${govs.map(g => `<option ${govVal === g ? 'selected' : ''}>${esc(g)}</option>`).join('')}
         </select>
       </div>
-      <div><div class="le-lbl">Budget (tokens)</div><input id="os-budget" class="filter-input" type="number" value="${esc(String(budgetVal || ''))}"></div>
-      <button class="btn" style="width:fit-content;color:var(--accent);border-color:var(--accent)" onclick="generateOrgSettingsCmd()">Generate CLI Command</button>
+      <div><div class="le-lbl">Budget (tokens)</div><input id="os-budget" class="filter-input" type="number" placeholder="e.g. 100000" value="${esc(String(budgetVal || ''))}"></div>
+      <button class="btn" title="Generate a monomind CLI command from these settings" style="width:fit-content;color:var(--accent);border-color:var(--accent)" onclick="generateOrgSettingsCmd()">Generate CLI Command</button>
       <div id="os-cmd-out" style="display:none;font-family:var(--mono);font-size:11px;background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:10px;word-break:break-all;cursor:pointer;color:var(--text-hi)" title="Click to copy" onclick="navigator.clipboard.writeText(this.textContent).then(()=>showToast('Copied','','ok'))"></div>
     </div>`;
 }
@@ -5540,7 +6141,7 @@ async function v2RenderOrgRoutines() {
     const _enc = encodeURIComponent(_v2SelOrg);
     const data = await fetch(`/api/org/${_enc}/routines${DIR ? '?dir=' + encodeURIComponent(DIR) : ''}`).then(r => r.ok ? r.json() : []).catch(() => []);
     const routines = Array.isArray(data) ? data : (data.routines || _v2OrgData?.config?.routines || []);
-    if (!routines.length) { el.innerHTML = '<div class="empty">No routines configured</div>'; return; }
+    if (!routines.length) { el.innerHTML = '<div class="empty">No routines configured<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Routines are scheduled agent tasks. Add them to the org config under <code>routines: []</code></div></div>'; return; }
     el.innerHTML = `<table style="width:100%;border-collapse:collapse;font-size:12px">
       <thead><tr style="color:var(--text-xs);text-align:left">
         <th style="padding:5px 8px">Name</th><th>Cron</th><th>Last Run</th><th>Status</th>
@@ -5548,7 +6149,7 @@ async function v2RenderOrgRoutines() {
       routines.map(r => `<tr style="border-top:1px solid var(--border)">
         <td style="padding:6px 8px;color:var(--text-hi)">${esc(r.name || '—')}</td>
         <td style="padding:6px 8px;font-family:var(--mono);color:var(--text-lo)">${esc(r.cron || r.schedule || '—')}</td>
-        <td style="padding:6px 8px;color:var(--text-lo)">${r.lastRun ? relTime(r.lastRun) : '—'}</td>
+        <td style="padding:6px 8px;color:var(--text-lo)" title="${r.lastRun ? new Date(typeof r.lastRun === 'number' ? r.lastRun : Number(r.lastRun) || r.lastRun).toLocaleString() : ''}">${r.lastRun ? relTime(r.lastRun) : '—'}</td>
         <td style="padding:6px 8px"><span class="ss-pill ${r.active || r.status === 'active' ? 'on' : ''}">${esc(r.status || '—')}</span></td>
       </tr>`).join('') + '</tbody></table>';
   } catch (e) { el.innerHTML = '<div class="empty">Failed: ' + esc(e.message) + '</div>'; }
@@ -5563,7 +6164,7 @@ async function v2RenderOrgMyIssues() {
     const _enc = encodeURIComponent(_v2SelOrg);
     const data = await fetch(`/api/org/${_enc}/my-issues${DIR ? '?dir=' + encodeURIComponent(DIR) : ''}`).then(r => r.ok ? r.json() : []).catch(() => []);
     const issues = Array.isArray(data) ? data : (data.issues || []);
-    if (!issues.length) { el.innerHTML = '<div class="empty">No issues assigned to you</div>'; return; }
+    if (!issues.length) { el.innerHTML = '<div class="empty">No issues assigned to you<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Issues are assigned by agents or via the Board tab. Check the Issues tab to see all open issues.</div></div>'; return; }
     const PRIORITY = { urgent: '🔴', high: '🟠', medium: '🟡', low: '🟢' };
     el.innerHTML = `<table style="width:100%;border-collapse:collapse;font-size:12px">
       <thead><tr style="color:var(--text-xs);text-align:left">
@@ -5573,9 +6174,9 @@ async function v2RenderOrgMyIssues() {
         const cls = i.status === 'done' ? 'on' : i.status === 'blocked' ? 'warn' : '';
         return `<tr style="border-top:1px solid var(--border)">
           <td style="padding:5px 4px">${PRIORITY[i.priority] || '·'}</td>
-          <td style="padding:5px 8px;color:var(--text-hi);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${esc((i.title || i.description || '—').slice(0, 80))}</td>
+          <td style="padding:5px 8px;color:var(--text-hi);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="${esc(i.title || i.description || '')}">${esc((i.title || i.description || '—').slice(0, 80))}${(i.title || i.description || '').length > 80 ? '…' : ''}</td>
           <td style="padding:5px 8px"><span class="ss-pill ${cls}">${esc(i.status || 'open')}</span></td>
-          <td style="padding:5px 8px;color:var(--text-xs);font-size:11px;font-family:var(--mono)">${relTime(i.updated_at || i.ts)}</td>
+          <td style="padding:5px 8px;color:var(--text-xs);font-size:11px;font-family:var(--mono)" title="${(ts => ts ? new Date(typeof ts === 'number' ? ts : Number(ts) || ts).toLocaleString() : '')(i.updated_at || i.ts)}">${relTime(i.updated_at || i.ts)}</td>
         </tr>`;
       }).join('') + '</tbody></table>';
   } catch (e) { el.innerHTML = '<div class="empty">Failed: ' + esc(e.message) + '</div>'; }
@@ -5604,19 +6205,21 @@ function v2RenderOrgBudgets() {
     html += `<div class="m-group-title">USD Budget</div>${fillBar(b.usd || 0, b.usdLimit)}<div style="font-size:12px;color:var(--text-lo);margin:4px 0 14px">$${Number(b.usd || 0).toFixed(4)} / ${b.usdLimit ? '$' + Number(b.usdLimit).toFixed(2) : '∞'}</div>`;
   }
   if (agents.length) {
+    const shownAgents = agents.slice(0, 20);
     html += '<div class="m-group-title" style="margin-bottom:6px">Per Agent</div>' +
       `<table style="width:100%;border-collapse:collapse;font-size:12px"><thead><tr style="color:var(--text-xs);text-align:left"><th style="padding:4px 8px">Agent</th><th>Tokens In</th><th>Tokens Out</th><th>Cost</th></tr></thead><tbody>` +
-      agents.slice(0, 20).map(a => {
+      shownAgents.map(a => {
         const over = a.budgetLimit && ((a.tokensIn || 0) + (a.tokensOut || 0)) > a.budgetLimit;
         return `<tr style="border-top:1px solid var(--border)${over ? ';color:var(--red)' : ''}">
-          <td style="padding:4px 8px;font-family:var(--mono);font-size:11px;color:${over ? 'var(--red)' : 'var(--text-hi)'}">${esc((a.id || a.title || '—').toString().slice(0, 14))}</td>
+          <td style="padding:4px 8px;font-family:var(--mono);font-size:11px;color:${over ? 'var(--red)' : 'var(--text-hi)'}" title="${esc((a.id || a.title || '').toString())}">${esc((a.id || a.title || '—').toString().slice(0, 14))}${(a.id || a.title || '').toString().length > 14 ? '…' : ''}</td>
           <td style="padding:4px 8px;color:var(--text-lo)">${Number(a.tokensIn || 0).toLocaleString()}</td>
           <td style="padding:4px 8px;color:var(--text-lo)">${Number(a.tokensOut || 0).toLocaleString()}</td>
           <td style="padding:4px 8px;color:var(--accent)">$${Number(a.cost || 0).toFixed(4)}${over ? ' ⚠' : ''}</td>
         </tr>`;
-      }).join('') + '</tbody></table>';
+      }).join('') + '</tbody></table>' +
+      (agents.length > 20 ? `<div style="font-size:11px;color:var(--text-xs);margin-top:4px;text-align:right">Showing 20 of ${agents.length} agents</div>` : '');
   }
-  el.innerHTML = html || '<div class="empty">No budget data</div>';
+  el.innerHTML = html || '<div class="empty">No budget data<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Set token budgets in Org Settings to track spend per agent.</div></div>';
 }
 
 // ── PLUGINS ────────────────────────────────────────────────
@@ -5628,14 +6231,14 @@ async function v2RenderOrgPlugins() {
     const _enc = encodeURIComponent(_v2SelOrg);
     const data = await fetch(`/api/org/${_enc}/plugins${DIR ? '?dir=' + encodeURIComponent(DIR) : ''}`).then(r => r.ok ? r.json() : []).catch(() => []);
     const plugins = Array.isArray(data) ? data : (data.plugins || []);
-    if (!plugins.length) { el.innerHTML = '<div class="empty">No plugins installed</div>'; return; }
+    if (!plugins.length) { el.innerHTML = '<div class="empty">No plugins installed<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Browse and install plugins with <code>npx monomind plugins list</code></div></div>'; return; }
     el.innerHTML = `<div class="proj-grid">` +
       plugins.map(p => {
         const status = p.status || 'installed';
         const col = status === 'error' ? 'var(--red)' : status === 'installed' ? 'var(--accent)' : 'var(--text-lo)';
         return `<div class="proj-card">
-          <div class="proj-card-name">${esc(p.name || '—')}</div>
-          <div class="proj-card-path">${esc((p.description || '').slice(0, 80))}</div>
+          <div class="proj-card-name" title="${esc(p.name || '')}">${esc(p.name || '—')}</div>
+          <div class="proj-card-path" title="${esc(p.description || '')}">${esc((p.description || '').slice(0, 80))}${(p.description || '').length > 80 ? '…' : ''}</div>
           <div style="margin-top:8px"><span class="ss-pill" style="color:${esc(col)};border-color:${esc(col)}44;background:${esc(col)}18">${esc(status)}</span></div>
         </div>`;
       }).join('') + `</div>`;
@@ -5658,7 +6261,7 @@ function v2RenderOrgCharts() {
     events: 0, errors: 0,
   }));
   activity.forEach(e => {
-    const ts = new Date(e.ts || e.timestamp || e.created_at || 0).getTime();
+    const _et = e.ts || e.timestamp || e.created_at || 0; const ts = typeof _et === 'number' ? _et : Number(_et) || new Date(_et).getTime() || 0;
     const idx = buckets.findIndex((b, i) =>
       ts >= b.ts && (i === 13 || ts < buckets[i + 1].ts));
     if (idx >= 0) {
@@ -5683,7 +6286,7 @@ function v2RenderOrgCharts() {
   // Per-agent run bars
   const agentRuns = agents.slice(0, 10).map(a => {
     const runs = activity.filter(e => e.agentId === a.id || e.agent === a.id).length;
-    return { name: (a.type || a.title || a.id || '—').toString().slice(0, 20), runs };
+    return { name: (a.type || a.title || a.id || '—').toString(), runs };
   }).filter(a => a.runs > 0).sort((x, y) => y.runs - x.runs);
   const maxRuns = Math.max(...agentRuns.map(a => a.runs), 1);
 
@@ -5703,7 +6306,7 @@ function v2RenderOrgCharts() {
     <div style="display:flex;gap:2px;align-items:flex-end;padding-bottom:28px;margin-bottom:16px;overflow-x:auto">${heatmap}</div>
     ${agentRuns.length ? `<div class="m-group-title" style="margin-bottom:6px">Per-Agent Runs</div>
     ${agentRuns.map(a => `<div style="display:flex;align-items:center;gap:8px;padding:3px 0;font-size:12px">
-      <div style="width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-hi);font-family:var(--mono);font-size:11px">${esc(a.name)}</div>
+      <div style="width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-hi);font-family:var(--mono);font-size:11px" title="${esc(a.name)}">${esc(a.name.slice(0, 20))}${a.name.length > 20 ? '…' : ''}</div>
       <div style="flex:1;height:7px;background:var(--border);border-radius:2px;overflow:hidden"><div style="width:${Math.round(a.runs/maxRuns*100)}%;height:100%;background:var(--accent);border-radius:2px"></div></div>
       <div style="width:30px;text-align:right;color:var(--text-lo);font-family:var(--mono);font-size:11px">${a.runs}</div>
     </div>`).join('')}` : ''}
@@ -5719,10 +6322,10 @@ async function v2RenderOrgProjects() {
     const _enc = encodeURIComponent(_v2SelOrg);
     const data = await fetch(`/api/org/${_enc}/projects${DIR?'?dir='+encodeURIComponent(DIR):''}`).then(r=>r.ok?r.json():[]).catch(()=>[]);
     const projects = Array.isArray(data) ? data : (data.projects || []);
-    if (!projects.length) { el.innerHTML = '<div class="empty">No projects configured</div>'; return; }
+    if (!projects.length) { el.innerHTML = '<div class="empty">No projects configured<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Run <code>npx monomind init</code> inside a project to add it.</div></div>'; return; }
     el.innerHTML = `<div class="proj-grid">${projects.map(p => `<div class="proj-card">
-      <div class="proj-card-name">${esc(p.name || p.title || '—')}</div>
-      <div class="proj-card-path">${esc((p.description || p.path || '').slice(0,80))}</div>
+      <div class="proj-card-name" title="${esc(p.name || p.title || '')}">${esc(p.name || p.title || '—')}</div>
+      <div class="proj-card-path" title="${esc(p.description || p.path || '')}">${esc((p.description || p.path || '').slice(0,80))}${(p.description || p.path || '').length > 80 ? '…' : ''}</div>
       <div class="proj-card-stats" style="margin-top:8px">
         ${p.status ? `<span class="ss-pill ${p.status==='active'?'on':''}">${esc(p.status)}</span>` : ''}
       </div>
@@ -5735,7 +6338,7 @@ async function v2RenderOrgSkills() {
   const el = document.getElementById('odt-skills');
   if (!el || !_v2OrgData) return;
   const roles = Array.isArray(_v2OrgData.roles) ? _v2OrgData.roles : [];
-  if (!roles.length) { el.innerHTML = '<div class="empty">No roles defined</div>'; return; }
+  if (!roles.length) { el.innerHTML = '<div class="empty">No roles defined<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Skills come from agent roles. Create an org with <code>npx monomind swarm init</code></div></div>'; return; }
   el.innerHTML = '<div class="empty">Loading skills…</div>';
   const org = _v2SelOrg, dirq = DIR ? '?dir=' + encodeURIComponent(DIR) : '';
   // Enrich each role with expertise + task types from its agent definition (same source as the detail drawer)
@@ -5774,7 +6377,7 @@ async function v2RenderOrgWorkspaces() {
     const _enc = encodeURIComponent(_v2SelOrg);
     const data = await fetch(`/api/org/${_enc}/workspaces${DIR?'?dir='+encodeURIComponent(DIR):''}`).then(r=>r.ok?r.json():[]).catch(()=>[]);
     const ws = Array.isArray(data) ? data : (data.workspaces || []);
-    if (!ws.length) { el.innerHTML = '<div class="empty">No workspaces configured</div>'; return; }
+    if (!ws.length) { el.innerHTML = '<div class="empty">No workspaces configured<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Workspaces are project directories added to this org. Add one via Org Settings.</div></div>'; return; }
     el.innerHTML = ws.map(w => `<div style="padding:10px 0;border-bottom:1px solid var(--border)">
       <div style="display:flex;align-items:center;gap:8px;margin-bottom:4px">
         <span style="font-size:13px;color:var(--text-hi);font-weight:500">${esc(w.name || w.id || '—')}</span>
@@ -5795,16 +6398,16 @@ async function v2RenderOrgInvites() {
     const _enc = encodeURIComponent(_v2SelOrg);
     const data = await fetch(`/api/org/${_enc}/invites${DIR?'?dir='+encodeURIComponent(DIR):''}`).then(r=>r.ok?r.json():[]).catch(()=>[]);
     const invites = Array.isArray(data) ? data : (data.invites || []);
-    if (!invites.length) { el.innerHTML = '<div class="empty">No active invite tokens</div>'; return; }
+    if (!invites.length) { el.innerHTML = '<div class="empty">No active invite tokens<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Generate an invite token to add members to this org.</div></div>'; return; }
     el.innerHTML = `<table style="width:100%;border-collapse:collapse;font-size:12px">
       <thead><tr style="color:var(--text-xs);text-align:left">
         <th style="padding:5px 8px">Token</th><th>Role</th><th>Expires</th><th>Created</th>
       </tr></thead>
       <tbody>${invites.map(i => `<tr style="border-top:1px solid var(--border)">
-        <td style="padding:5px 8px;color:var(--text-hi);font-family:var(--mono);font-size:11px">${esc((i.token||i.id||'—').slice(0,16))}…</td>
+        <td style="padding:5px 8px;color:var(--text-hi);font-family:var(--mono);font-size:11px" title="${esc(i.token||i.id||'')}">${esc((i.token||i.id||'—').slice(0,16))}…</td>
         <td style="padding:5px 8px"><span class="ss-pill">${esc(i.role||'viewer')}</span></td>
-        <td style="padding:5px 8px;color:var(--text-lo)">${i.expiresAt ? relTime(i.expiresAt) : '—'}</td>
-        <td style="padding:5px 8px;color:var(--text-lo)">${i.createdAt ? relTime(i.createdAt) : '—'}</td>
+        <td style="padding:5px 8px;color:var(--text-lo)" title="${i.expiresAt ? new Date(typeof i.expiresAt === 'number' ? i.expiresAt : Number(i.expiresAt) || i.expiresAt).toLocaleString() : ''}">${i.expiresAt ? relTime(i.expiresAt) : '—'}</td>
+        <td style="padding:5px 8px;color:var(--text-lo)" title="${i.createdAt ? new Date(typeof i.createdAt === 'number' ? i.createdAt : Number(i.createdAt) || i.createdAt).toLocaleString() : ''}">${i.createdAt ? relTime(i.createdAt) : '—'}</td>
       </tr>`).join('')}</tbody>
     </table>`;
   } catch (e) { el.innerHTML = '<div class="empty">Failed: ' + esc(e.message) + '</div>'; }
@@ -5815,17 +6418,17 @@ function v2RenderOrgAgentsFull() {
   const el = document.getElementById('odt-agents-full');
   if (!el || !_v2OrgData) return;
   const agents = _v2OrgData._agents || [];
-  if (!agents.length) { el.innerHTML = '<div class="empty">No agents found</div>'; return; }
+  if (!agents.length) { el.innerHTML = '<div class="empty">No agents found<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Agents join this org when spawned with <code>npx monomind agent spawn --org &lt;name&gt;</code></div></div>'; return; }
   el.innerHTML = `<table style="width:100%;border-collapse:collapse;font-size:12px">
     <thead><tr style="color:var(--text-xs);text-align:left">
       <th style="padding:5px 8px">ID</th><th>Type</th><th>Adapter</th><th>Status</th><th>Heartbeat</th><th>Tokens In</th><th>Tokens Out</th>
     </tr></thead>
     <tbody>${agents.map(a => `<tr style="border-top:1px solid var(--border)">
-      <td style="padding:5px 8px;color:var(--text-hi);font-family:var(--mono);font-size:11px">${esc((a.id||'—').toString().slice(0,12))}</td>
+      <td style="padding:5px 8px;color:var(--text-hi);font-family:var(--mono);font-size:11px" title="${esc((a.id||'').toString())}">${esc((a.id||'—').toString().slice(0,12))}${(a.id||'').toString().length > 12 ? '…' : ''}</td>
       <td style="padding:5px 8px;color:var(--text-hi)">${esc(a.type||a.title||'—')}</td>
       <td style="padding:5px 8px;color:var(--text-lo)">${esc(a.adapter||'—')}</td>
       <td style="padding:5px 8px"><span class="ss-pill ${(a.status==='running'||a.running)?'on':''}">${esc(a.status||'idle')}</span></td>
-      <td style="padding:5px 8px;color:var(--text-lo)">${a.lastHeartbeat ? relTime(a.lastHeartbeat) : '—'}</td>
+      <td style="padding:5px 8px;color:var(--text-lo)" title="${a.lastHeartbeat ? new Date(typeof a.lastHeartbeat === 'number' ? a.lastHeartbeat : Number(a.lastHeartbeat) || a.lastHeartbeat).toLocaleString() : ''}">${a.lastHeartbeat ? relTime(a.lastHeartbeat) : '—'}</td>
       <td style="padding:5px 8px;color:var(--text-lo)">${a.tokensIn != null ? Number(a.tokensIn).toLocaleString() : '—'}</td>
       <td style="padding:5px 8px;color:var(--text-lo)">${a.tokensOut != null ? Number(a.tokensOut).toLocaleString() : '—'}</td>
     </tr>`).join('')}</tbody>
@@ -5841,7 +6444,7 @@ async function v2RenderOrgEnvironments() {
     const _enc = encodeURIComponent(_v2SelOrg);
     const data = await fetch(`/api/org/${_enc}/environments${DIR?'?dir='+encodeURIComponent(DIR):''}`).then(r=>r.ok?r.json():[]).catch(()=>[]);
     const envs = Array.isArray(data) ? data : (data.environments || []);
-    if (!envs.length) { el.innerHTML = '<div class="empty">No environments configured</div>'; return; }
+    if (!envs.length) { el.innerHTML = '<div class="empty">No environments configured<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Environments (dev/staging/prod) are declared in the org config under <code>environments: []</code></div></div>'; return; }
     el.innerHTML = `<table style="width:100%;border-collapse:collapse;font-size:12px">
       <thead><tr style="color:var(--text-xs);text-align:left">
         <th style="padding:5px 8px">Name</th><th>Driver</th><th>Host</th><th>Status</th>
@@ -5861,7 +6464,7 @@ function v2RenderOrgAccess() {
   const el = document.getElementById('odt-access');
   if (!el || !_v2OrgData) return;
   const members = _v2OrgData._members || [];
-  if (!members.length) { el.innerHTML = '<div class="empty">No members found</div>'; return; }
+  if (!members.length) { el.innerHTML = '<div class="empty">No members found<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Members are added when agents join the org. See the Members tab to manage roles.</div></div>'; return; }
   const TIER = { owner: 0, admin: 1, operator: 2, viewer: 3 };
   const byRole = {};
   members.forEach(m => { const r = m.role || 'viewer'; (byRole[r] || (byRole[r] = [])).push(m); });
@@ -5883,7 +6486,7 @@ function v2RenderOrgIssuesFull() {
   const el = document.getElementById('odt-issues-full');
   if (!el || !_v2OrgData) return;
   const issues = _v2OrgData._issues || [];
-  if (!issues.length) { el.innerHTML = '<div class="empty">No issues found</div>'; return; }
+  if (!issues.length) { el.innerHTML = '<div class="empty">No issues found<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Issues are created by agents during task execution. Check the Board for status.</div></div>'; return; }
   const PRIORITY = { urgent:'🔴', high:'🟠', medium:'🟡', low:'🟢' };
   el.innerHTML = `<table style="width:100%;border-collapse:collapse;font-size:12px">
     <thead><tr style="color:var(--text-xs);text-align:left">
@@ -5891,10 +6494,10 @@ function v2RenderOrgIssuesFull() {
     </tr></thead>
     <tbody>${issues.slice(0,100).map(i => `<tr style="border-top:1px solid var(--border)">
       <td style="padding:5px 4px">${PRIORITY[i.priority]||'·'}</td>
-      <td style="padding:5px 8px;color:var(--text-hi);max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${esc((i.title||i.description||'—').slice(0,80))}</td>
+      <td style="padding:5px 8px;color:var(--text-hi);max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="${esc(i.title||i.description||'')}">${esc((i.title||i.description||'—').slice(0,80))}${(i.title||i.description||'').length > 80 ? '…' : ''}</td>
       <td style="padding:5px 8px;color:var(--text-lo)">${esc(i.assignee||'—')}</td>
       <td style="padding:5px 8px"><span class="ss-pill ${i.status==='done'?'on':i.status==='blocked'?'warn':''}">${esc(i.status||'open')}</span></td>
-      <td style="padding:5px 8px;color:var(--text-xs);font-family:var(--mono);font-size:11px">${relTime(i.updated_at||i.ts)}</td>
+      <td style="padding:5px 8px;color:var(--text-xs);font-family:var(--mono);font-size:11px" title="${(ts => ts ? new Date(typeof ts === 'number' ? ts : Number(ts) || ts).toLocaleString() : '')(i.updated_at||i.ts)}">${relTime(i.updated_at||i.ts)}</td>
     </tr>`).join('')}</tbody>
   </table>`;
 }
@@ -5908,7 +6511,7 @@ async function v2RenderOrgJoinRequests() {
     const _enc = encodeURIComponent(_v2SelOrg);
     const data = await fetch(`/api/org/${_enc}/join-requests${DIR?'?dir='+encodeURIComponent(DIR):''}`).then(r=>r.ok?r.json():[]).catch(()=>[]);
     const reqs = Array.isArray(data) ? data : (data.joinRequests || data.join_requests || []);
-    if (!reqs.length) { el.innerHTML = '<div class="empty">No pending join requests</div>'; return; }
+    if (!reqs.length) { el.innerHTML = '<div class="empty">No pending join requests<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Join requests appear when agents or users request access to this org.</div></div>'; return; }
     el.innerHTML = `<table style="width:100%;border-collapse:collapse;font-size:12px">
       <thead><tr style="color:var(--text-xs);text-align:left">
         <th style="padding:5px 8px">Requester</th><th>Type</th><th>Status</th><th>Created</th>
@@ -5917,7 +6520,7 @@ async function v2RenderOrgJoinRequests() {
         <td style="padding:5px 8px;color:var(--text-hi)">${esc(r.name||r.username||r.id||'—')}</td>
         <td style="padding:5px 8px;color:var(--text-lo)">${r.type==='agent'?'🤖 agent':'👤 human'}</td>
         <td style="padding:5px 8px"><span class="ss-pill ${r.status==='approved'?'on':r.status==='rejected'?'warn':''}">${esc(r.status||'pending')}</span></td>
-        <td style="padding:5px 8px;color:var(--text-lo)">${r.createdAt ? relTime(r.createdAt) : '—'}</td>
+        <td style="padding:5px 8px;color:var(--text-lo)" title="${r.createdAt ? new Date(typeof r.createdAt === 'number' ? r.createdAt : Number(r.createdAt) || r.createdAt).toLocaleString() : ''}">${r.createdAt ? relTime(r.createdAt) : '—'}</td>
       </tr>`).join('')}</tbody>
     </table>`;
   } catch (e) { el.innerHTML = '<div class="empty">Failed: ' + esc(e.message) + '</div>'; }
@@ -5932,17 +6535,17 @@ async function v2RenderOrgThreads() {
     const _enc = encodeURIComponent(_v2SelOrg);
     const data = await fetch(`/api/org/${_enc}/threads${DIR?'?dir='+encodeURIComponent(DIR):''}`).then(r=>r.ok?r.json():[]).catch(()=>[]);
     const threads = Array.isArray(data) ? data : (data.threads || []);
-    if (!threads.length) { el.innerHTML = '<div class="empty">No threads found</div>'; return; }
+    if (!threads.length) { el.innerHTML = '<div class="empty">No threads found<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Threads are created when agents discuss issues. Check the Issues tab to start a discussion.</div></div>'; return; }
     el.innerHTML = `<table style="width:100%;border-collapse:collapse;font-size:12px">
       <thead><tr style="color:var(--text-xs);text-align:left">
         <th style="padding:5px 8px">Subject</th><th>Author</th><th>Messages</th><th>Issue</th><th>Created</th>
       </tr></thead>
       <tbody>${threads.map(t => `<tr style="border-top:1px solid var(--border)">
-        <td style="padding:5px 8px;color:var(--text-hi);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${esc((t.subject||t.title||'—').slice(0,50))}</td>
+        <td style="padding:5px 8px;color:var(--text-hi);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="${esc(t.subject||t.title||'')}">${esc((t.subject||t.title||'—').slice(0,50))}${(t.subject||t.title||'').length > 50 ? '…' : ''}</td>
         <td style="padding:5px 8px;color:var(--text-lo)">${esc(t.author||t.createdBy||'—')}</td>
         <td style="padding:5px 8px;color:var(--text-lo);text-align:center">${t.messageCount ?? t.messages ?? '—'}</td>
-        <td style="padding:5px 8px;color:var(--text-lo);font-family:var(--mono);font-size:11px">${t.issueId ? '#'+esc(t.issueId.toString().slice(0,8)) : '—'}</td>
-        <td style="padding:5px 8px;color:var(--text-lo)">${t.createdAt ? relTime(t.createdAt) : '—'}</td>
+        <td style="padding:5px 8px;color:var(--text-lo);font-family:var(--mono);font-size:11px" title="${t.issueId ? esc(t.issueId.toString()) : ''}">${t.issueId ? '#'+esc(t.issueId.toString().slice(0,8))+(t.issueId.toString().length > 8 ? '…' : '') : '—'}</td>
+        <td style="padding:5px 8px;color:var(--text-lo)" title="${t.createdAt ? new Date(typeof t.createdAt === 'number' ? t.createdAt : Number(t.createdAt) || t.createdAt).toLocaleString() : ''}">${t.createdAt ? relTime(t.createdAt) : '—'}</td>
       </tr>`).join('')}</tbody>
     </table>`;
   } catch (e) { el.innerHTML = '<div class="empty">Failed: ' + esc(e.message) + '</div>'; }
@@ -5952,19 +6555,103 @@ async function v2RenderOrgThreads() {
 window.v2StopOrg = async function() {
   if (!_v2SelOrg) return;
   const stopped = _v2SelOrg;
-  try { await fetch(`/api/orgs/${encodeURIComponent(stopped)}/stop`, {method:'POST'}); } catch(_) {}
+  try {
+    await fetch(`/api/orgs/${encodeURIComponent(stopped)}/stop`, {method:'POST'});
+    showToast('Stopped', `Org "${stopped}" stopped`, 'ok');
+  } catch(e) { showToast('Error', e.message, 'err'); }
   setTimeout(async () => { await renderOrgs(); if (_v2SelOrg === stopped) v2SelectOrg(stopped); }, 600);
 };
 
+// ── Copy org dialog ────────────────────────────────────────────────────────────
+window.v2ShowCopyOrgDialog = async function() {
+  if (!_v2SelOrg) return;
+  const dialog = document.getElementById('org-copy-dialog');
+  const feedback = document.getElementById('org-copy-feedback');
+  const select = document.getElementById('org-copy-dest-select');
+  const input = document.getElementById('org-copy-dest-input');
+  if (!dialog) return;
+  feedback.textContent = '';
+  input.value = '';
+  select.innerHTML = '<option value="">Loading…</option>';
+  dialog.style.display = 'flex';
+  // Populate project list
+  try {
+    const data = await apiFetch('/api/projects');
+    const projects = (data.projects || []).filter(p => p.path && p.path !== DIR);
+    select.innerHTML = '<option value="">— select a project —</option>' +
+      projects.map(p => `<option value="${esc(p.path)}">${esc(p.name)} (${esc(p.path)})</option>`).join('') +
+      '<option value="__custom__">Custom path…</option>';
+  } catch(e) {
+    select.innerHTML = '<option value="__custom__">Enter path manually</option>';
+  }
+};
+
+window.v2HideCopyOrgDialog = function() {
+  const dialog = document.getElementById('org-copy-dialog');
+  if (dialog) dialog.style.display = 'none';
+};
+
+window.v2DoCopyOrg = async function() {
+  if (!_v2SelOrg) return;
+  const select = document.getElementById('org-copy-dest-select');
+  const input  = document.getElementById('org-copy-dest-input');
+  const feedback = document.getElementById('org-copy-feedback');
+  const btn = document.getElementById('org-copy-confirm-btn');
+  const destination = (input.value.trim()) || (select.value !== '__custom__' ? select.value : '');
+  if (!destination) {
+    feedback.textContent = 'Please select or enter a destination.';
+    feedback.style.color = 'var(--red, #e55)';
+    return;
+  }
+  btn.disabled = true;
+  btn.textContent = 'Copying…';
+  feedback.textContent = '';
+  try {
+    const r = await fetch(`/api/orgs/${encodeURIComponent(_v2SelOrg)}/copy`, {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ destination }),
+    });
+    const json = await r.json();
+    if (r.ok && json.ok) {
+      feedback.textContent = '✓ Copied successfully to ' + destination;
+      feedback.style.color = 'var(--green, #4ade80)';
+      setTimeout(v2HideCopyOrgDialog, 1800);
+    } else {
+      feedback.textContent = 'Error: ' + (json.error || r.status);
+      feedback.style.color = 'var(--red, #e55)';
+    }
+  } catch(e) {
+    feedback.textContent = 'Error: ' + e.message;
+    feedback.style.color = 'var(--red, #e55)';
+  } finally {
+    btn.disabled = false;
+    btn.textContent = 'Copy';
+  }
+};
+
 // live SSE for org events
 (function v2OrgSSE() {
   let src;
+  let _connectTime = 0;
   function connect() {
     if (src) src.close();
+    _connectTime = Date.now();
     src = new EventSource('/api/mastermind-stream');
     src.onmessage = e => {
       try {
         const ev = JSON.parse(e.data);
+        if (ev?.type?.startsWith('loop:')) {
+          // Skip replayed historical events (server replays last 50 on connect)
+          if (ev.ts && ev.ts < _connectTime) return;
+          if (currentView === 'loops') renderLoops();
+          else viewRendered['loops'] = false; // stale — re-fetch on next switchView
+          loadLoopMetrics();
+          if (_mmCurrentTab === 'loops' && document.getElementById('mm-overlay')?.classList.contains('open')) {
+            mmRenderLoops(document.getElementById('mm-body'));
+          }
+          return;
+        }
         if (!ev?.org || !ev?.type?.startsWith('org:')) return;
         const n = ev.org;
         // Filter by project dir if the event carries one; skip events from other projects.
@@ -6033,11 +6720,12 @@ function buildTimeline(events) {
   // Only tool + user events with timestamps
   const stamped = events.filter(ev => ev.ts && (ev.kind === 'tool' || ev.kind === 'user'));
   if (stamped.length < 2) { tl.innerHTML = ''; return; }
-  const times = stamped.map(ev => new Date(ev.ts).getTime());
+  const tsMs = ev => typeof ev.ts === 'number' ? ev.ts : Number(ev.ts) || 0;
+  const times = stamped.map(tsMs);
   const tMin = Math.min(...times), tMax = Math.max(...times);
   const span = tMax - tMin || 1;
   const segs = stamped.map(ev => {
-    const pct = ((new Date(ev.ts).getTime() - tMin) / span * 100).toFixed(2);
+    const pct = ((tsMs(ev) - tMin) / span * 100).toFixed(2);
     const cat = ev.kind === 'user' ? 'user' : (ev.cat || 'other');
     const color = TL_COLORS[cat] || TL_COLORS.other;
     const label = ev.kind === 'user' ? 'user message' : (ev.label || ev.name || cat);
@@ -6070,7 +6758,7 @@ function buildWowDelta() {
   for (const s of allSessions) {
     const ts = s.lastTs || s.mtime;
     if (!ts) continue;
-    const age = now - (typeof ts === 'number' ? ts : new Date(ts).getTime());
+    const age = now - (typeof ts === 'number' ? ts : Number(ts) || new Date(ts).getTime() || 0);
     if (age < 7 * DAY) thisWeek++;
     else if (age < 14 * DAY) lastWeek++;
   }
@@ -6132,12 +6820,13 @@ async function copySession() {
   try {
     const data = await apiFetch('/api/session?dir=' + enc(DIR) + '&file=' + enc(sess.file) + '&limit=300');
     const events = data.events || [];
-    const lines = [`# Session: ${sess.lastPrompt || sess.id}`, `> ${new Date(sess.lastTs || sess.mtime).toLocaleString()}`, ''];
+    const _sessTs = sess.lastTs || sess.mtime;
+    const lines = [`# Session: ${sess.lastPrompt || sess.id}`, `> ${new Date(typeof _sessTs === 'number' ? _sessTs : Number(_sessTs) || _sessTs).toLocaleString()}`, ''];
     for (const ev of events) {
       if (ev.kind === 'user' && ev.text?.trim()) {
         lines.push('**User:** ' + ev.text.trim().replace(/\n/g, ' '));
       } else if (ev.kind === 'tool') {
-        lines.push(`- \`${ev.name || ev.cat}\`: ${ev.label || ''}`);
+        lines.push(`- \`${ev.name || ev.cat}\`${ev.label ? ': ' + ev.label : ''}`);
       }
     }
     await navigator.clipboard.writeText(lines.join('\n'));
@@ -6204,7 +6893,10 @@ function cmdSearch(q) {
     results.innerHTML = sq.length >= 2
       ? '<div class="cmd-empty">Searching sessions…</div>'
       : '<div class="cmd-empty">Type at least 2 chars after &gt; to search all sessions</div>';
-    if (sq.length >= 2) searchSessions(sq);
+    if (sq.length >= 2) {
+      clearTimeout(cmdSearch._debounce);
+      cmdSearch._debounce = setTimeout(() => searchSessions(sq), 300);
+    }
     return;
   }
 
@@ -6233,10 +6925,20 @@ function cmdSearch(q) {
 
   // ACTIONS group
   const actionItems = [
-    { label: 'Open Monograph', action: () => { const l = document.querySelector('.nav-item[data-view="monograph"]'); if (l) l.click(); } },
+    { label: 'Go to Now',        action: () => switchView('now') },
+    { label: 'Go to Sessions',   action: () => switchView('sessions') },
+    { label: 'Go to Projects',   action: () => switchView('projects') },
+    { label: 'Go to Loops',      action: () => switchView('loops') },
+    { label: 'Go to Tokens',     action: () => switchView('tokens') },
+    { label: 'Go to Memory',     action: () => switchView('memory') },
+    { label: 'Go to Orgs',       action: () => switchView('orgs') },
+    { label: 'Go to Monograph',  action: () => switchView('monograph') },
+    { label: 'Go to Global Feed',action: () => switchView('global') },
     { label: 'Refresh Dashboard', action: () => refreshCurrent() },
     { label: 'Toggle Compact View', action: () => toggleDensity() },
-    { label: 'Open Loops', action: () => { const l = document.querySelector('.nav-item[data-view="loops"]'); if (l) l.click(); } },
+    { label: 'Toggle Ambient Mode', action: () => toggleAmbient() },
+    { label: 'Open Mastermind',     action: () => openMastermind() },
+    { label: 'Keyboard Shortcuts',  action: () => { closeCmdPalette(); openShortcutHelp(); } },
   ].filter(a => !lq || a.label.toLowerCase().includes(lq));
 
   // TABS group — only if org room is open
@@ -6262,8 +6964,8 @@ function cmdSearch(q) {
       html += `<div class="cmd-item" data-ci="${idx}">
         <span class="ci-ico">◫</span>
         <div class="cmd-item-body">
-          <div class="ci-title">${esc(s.lastPrompt || s.id.slice(0, 32))}</div>
-          <div class="ci-sub">${relTime(s.lastTs || s.mtime)}</div>
+          <div class="ci-title" title="${esc(s.lastPrompt || s.id || '')}">${esc(s.lastPrompt || s.id.slice(0, 32))}</div>
+          <div class="ci-sub" title="${(ts => ts ? new Date(typeof ts === 'number' ? ts : Number(ts) || ts).toLocaleString() : '')(s.lastTs || s.mtime)}">${relTime(s.lastTs || s.mtime)}</div>
         </div>
       </div>`;
     });
@@ -6278,7 +6980,7 @@ function cmdSearch(q) {
         <span class="ci-ico">◈</span>
         <div class="cmd-item-body">
           <div class="ci-title">${esc(d.key || d.namespace || '—')}</div>
-          <div class="ci-sub">${esc(String(d.value || d.text || '').slice(0, 60))}</div>
+          <div class="ci-sub" title="${esc(String(d.value || d.text || ''))}">${esc(String(d.value || d.text || '').slice(0, 60))}${String(d.value || d.text || '').length > 60 ? '…' : ''}</div>
         </div>
       </div>`;
     });
@@ -6324,7 +7026,7 @@ function cmdSearch(q) {
         <span class="ci-ico">✦</span>
         <div class="cmd-item-body">
           <div class="ci-title">${esc(skLabel)}</div>
-          <div class="ci-sub">${typeof sk === 'string' ? '' : esc((sk.description || '').slice(0, 60))}</div>
+          <div class="ci-sub" title="${typeof sk === 'string' ? '' : esc(sk.description || '')}">${typeof sk === 'string' ? '' : esc((sk.description || '').slice(0, 60)) + ((sk.description || '').length > 60 ? '…' : '')}</div>
         </div>
       </div>`;
     });
@@ -6391,7 +7093,7 @@ function executeCmdItem() {
   else if (item.type === 'memory') switchView('memory');
   else if (item.type === 'project') switchProject(item.data.path);
   else if (item.type === 'org') { switchView('orgs'); setTimeout(() => v2SelectOrg(item.data.name), 80); }
-  else if (item.type === 'skill') switchView('memory');
+  else if (item.type === 'skill') { const _skN = typeof item.data === 'string' ? item.data : (item.data.name || item.data.id || ''); _mmSkillFilter = _skN; openMastermind(); mmSwitchTab('skills'); }
   else if (item.type === 'action') { if (item.data.action) item.data.action(); }
   else if (item.type === 'orgtab') { const btn = document.querySelector(`.odt-btn[data-tab="${item.data.tab}"]`); if (btn) btn.click(); }
 }
@@ -6414,8 +7116,8 @@ async function searchSessions(q) {
       html += `<div class="cmd-item" data-ci="${idx}">
         <span class="ci-ico">◫</span>
         <div class="cmd-item-body">
-          <div class="ci-title">${esc(r.lastPrompt || r.id.slice(0, 32))}</div>
-          <div class="ci-sub">${esc(snippet.length > 70 ? snippet.slice(0, 70) + '…' : snippet)}</div>
+          <div class="ci-title" title="${esc(r.lastPrompt || r.id || '')}">${esc(r.lastPrompt || r.id.slice(0, 32))}</div>
+          <div class="ci-sub" title="${esc(snippet)}">${esc(snippet.length > 70 ? snippet.slice(0, 70) + '…' : snippet)}</div>
         </div>
       </div>`;
     });
@@ -6440,18 +7142,22 @@ document.addEventListener('keydown', e => {
     return;
   }
 
+  // Escape always closes modals, even when focused inside an input/textarea
+  if (e.key === 'Escape') { closeDetail(); closeCmdPalette(); closeShortcutHelp(); closeBudgetModal(); closeChunkModal(); closeMemModal(); closeReportCard(); closeMastermind(); if (document.getElementById('app').classList.contains('ambient')) toggleAmbient(); return; }
+
   // ignore when typing in inputs
   if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA') return;
   if (document.getElementById('cmd-palette').classList.contains('open')) return;
-
-  if (e.key === 'Escape') { closeDetail(); closeCmdPalette(); closeShortcutHelp(); if (document.getElementById('app').classList.contains('ambient')) toggleAmbient(); }
   if (e.key === '?') { e.preventDefault(); openShortcutHelp(); return; }
+  if (e.key === 'r' || e.key === 'R') { e.preventDefault(); refreshCurrent(); return; }
+  if (e.key === 'm' || e.key === 'M') { e.preventDefault(); openMastermind(); return; }
   if (e.key === 'a' || e.key === 'A') { if (currentView === 'now') { e.preventDefault(); toggleAmbient(); } }
+  const _viewKeys = {'1':'now','2':'sessions','3':'projects','4':'loops','5':'tokens','6':'memory','7':'orgs','8':'monograph','9':'global'};
+  if (_viewKeys[e.key] && !e.metaKey && !e.ctrlKey && !e.altKey) { e.preventDefault(); switchView(_viewKeys[e.key]); return; }
 
   if (currentView === 'now') {
     if (e.key === '/') { e.preventDefault(); toggleFeedSearch(); }
     if (e.key === 'g' || e.key === 'G') { e.preventDefault(); goLive(); }
-    if (e.key === 'r' || e.key === 'R') { e.preventDefault(); refreshCurrent(); }
 
     if (e.key === 'j' || e.key === 'k') {
       e.preventDefault();
@@ -6519,6 +7225,22 @@ function filterSessions(q) {
   });
   const countEl = document.getElementById('sess-filter-count');
   if (countEl) countEl.textContent = lq && rows.length ? `${visible} / ${rows.length}` : '';
+  // zero-results empty state
+  const noRes = document.getElementById('sess-filter-noresult');
+  if (lq && visible === 0 && rows.length > 0) {
+    if (!noRes) {
+      const el = document.createElement('div');
+      el.id = 'sess-filter-noresult';
+      el.className = 'empty';
+      el.style.cssText = 'padding:24px 0;font-size:13px';
+      el.textContent = 'No sessions match "' + q.slice(0, 40) + '"';
+      document.getElementById('sess-content').appendChild(el);
+    } else {
+      noRes.textContent = 'No sessions match "' + q.slice(0, 40) + '"';
+    }
+  } else if (noRes) {
+    noRes.remove();
+  }
 }
 
 // ── feature 32: keyboard shortcut help modal ──────────────
@@ -6545,7 +7267,7 @@ function updateCurrentActivity(events) {
   } else if (name) {
     activity = name;
   }
-  if (activity) { el.textContent = '⤷ ' + activity; el.classList.add('loaded'); }
+  if (activity) { el.textContent = '⤷ ' + activity; el.title = recent.label || name || ''; el.classList.add('loaded'); }
   else { el.textContent = ''; el.classList.remove('loaded'); }
 }
 
@@ -6569,7 +7291,8 @@ function buildPatterns() {
       if (!STOP_WORDS.has(w) && !seen.has(w)) { freq[w] = (freq[w] || 0) + 1; seen.add(w); }
     }
   }
-  const sorted = Object.entries(freq).filter(([,c]) => c >= 2).sort((a, b) => b[1] - a[1]).slice(0, 20);
+  const allTerms = Object.entries(freq).filter(([,c]) => c >= 2).sort((a, b) => b[1] - a[1]);
+  const sorted = allTerms.slice(0, 20);
   if (!sorted.length) { el.innerHTML = '<div class="loading-txt">Not enough prompt data</div>'; return; }
   const maxCount = sorted[0][1];
   const rows = sorted.map(([word, count], i) => {
@@ -6582,7 +7305,8 @@ function buildPatterns() {
   }).join('');
   el.innerHTML = `<table class="lb-table"><thead><tr>
     <th class="lb-rank">#</th><th>Term</th><th></th><th class="lb-cost">Sessions</th>
-  </tr></thead><tbody>${rows}</tbody></table>`;
+  </tr></thead><tbody>${rows}</tbody></table>` +
+    (allTerms.length > 20 ? `<div style="font-size:11px;color:var(--text-xs);margin-top:4px;text-align:right">Showing 20 of ${allTerms.length} terms</div>` : '');
 }
 
 // ── feature 35: session streak tracker ────────────────────
@@ -6590,7 +7314,7 @@ function calcStreak() {
   const dates = new Set(allSessions.map(s => {
     const t = s.firstTs || s.mtime;
     if (!t) return null;
-    return new Date(typeof t === 'number' ? t : t).toDateString();
+    return new Date(typeof t === 'number' ? t : Number(t) || t).toDateString();
   }).filter(Boolean));
   let streak = 0;
   const today = new Date();
@@ -6608,9 +7332,16 @@ function calcStreak() {
 
 // ── feature 25: notification toasts ──────────────────────
 let _toastLastBudgetKey = '';
+let _toastLastKey = ''; let _toastLastTs = 0;
 function showToast(title, msg, type = 'info', duration = 5000) {
   const rack = document.getElementById('toast-rack');
   if (!rack) return;
+  // Dedup: skip identical toast within 2s
+  const key = type + '|' + title + '|' + msg;
+  if (key === _toastLastKey && Date.now() - _toastLastTs < 2000) return;
+  _toastLastKey = key; _toastLastTs = Date.now();
+  // Cap at 5 visible toasts — evict oldest
+  while (rack.children.length >= 5) rack.firstChild.remove();
   const icoMap = { warn: '⚑', err: '⚠', ok: '✓', info: '◉' };
   const div = document.createElement('div');
   div.className = 'toast t-' + type;
@@ -6619,13 +7350,13 @@ function showToast(title, msg, type = 'info', duration = 5000) {
       <div class="toast-title">${esc(title)}</div>
       <div class="toast-msg">${esc(msg)}</div>
     </div>
-    <button class="toast-close" onclick="this.closest('.toast').remove()">✕</button>`;
+    <button class="toast-close" onclick="this.closest('.toast').remove()" title="Dismiss">✕</button>`;
   rack.appendChild(div);
   if (duration > 0) setTimeout(() => { try { div.remove(); } catch {} }, duration);
 }
 
 function checkBudgetToast(todayCost, monthCost) {
-  const budget = JSON.parse(localStorage.getItem('mm-budget') || '{}');
+  const budget = (function(){ try { return JSON.parse(localStorage.getItem('mm-budget') || '{}'); } catch { return {}; } })();
   const daily = parseFloat(budget.daily) || 0;
   const monthly = parseFloat(budget.monthly) || 0;
   if (daily > 0 && todayCost >= daily * 0.9) {
@@ -6665,7 +7396,7 @@ function periodFilteredSessions() {
   if (w === Infinity) return allSessions;
   return allSessions.filter(s => {
     const t = s.firstTs || s.mtime; if (!t) return false;
-    const ts = typeof t === 'number' ? t : new Date(t).getTime();
+    const ts = typeof t === 'number' ? t : Number(t) || new Date(t).getTime() || 0;
     return (now - ts) <= w;
   });
 }
@@ -6685,12 +7416,16 @@ function buildSessionHeatmap(sessions) {
   }
   for (const s of sessions) {
     const ts = s.lastTs || s.mtime; if (!ts) continue;
-    const age = now - (typeof ts === 'number' ? ts : new Date(ts).getTime());
+    const age = now - (typeof ts === 'number' ? ts : Number(ts) || new Date(ts).getTime() || 0);
     const idx = DAYS - 1 - Math.floor(age / DAY);
     if (idx >= 0 && idx < DAYS) buckets[idx].count++;
   }
   const max = Math.max(...buckets.map(b => b.count), 1);
-  el.innerHTML = buckets.map(b => {
+  // pad so column 0 starts on Monday
+  const firstDowShm = new Date(now - (DAYS - 1) * DAY).getDay(); // 0=Sun
+  const shmOffset = firstDowShm === 0 ? 6 : firstDowShm - 1;
+  const padShm = Array.from({ length: shmOffset }, () => '<div class="shm-cell" style="opacity:0;pointer-events:none"></div>');
+  el.innerHTML = padShm.join('') + buckets.map(b => {
     const level = b.count === 0 ? 0 : Math.min(4, Math.ceil(b.count / max * 4));
     const isActive = b.date === heatmapDateFilter;
     return `<div class="shm-cell shm-${level}${isActive ? ' shm-active' : ''}" title="${b.date}: ${b.count} session${b.count !== 1 ? 's' : ''}" onclick="setHeatmapFilter('${b.date}',${b.count})"></div>`;
@@ -6784,7 +7519,8 @@ function bulkExport() {
   if (!toExport.length) return;
   const headers = ['Date', 'Session ID', 'Prompt', 'Cost ($)', 'Duration (s)', 'Tool Calls', 'Files Touched'];
   const rows = toExport.map(s => {
-    const dt = new Date(s.firstTs || s.mtime || 0).toISOString().slice(0, 19).replace('T', ' ');
+    const _ts0 = s.firstTs || s.mtime || 0;
+    const dt = new Date(typeof _ts0 === 'number' ? _ts0 : Number(_ts0) || _ts0).toISOString().slice(0, 19).replace('T', ' ');
     const cost = typeof s.totalCost === 'number' ? s.totalCost.toFixed(4) : '';
     const dur = s.totalDurationMs ? Math.round(s.totalDurationMs / 1000) : '';
     const prompt = (s.lastPrompt || '').replace(/"/g, '""');
@@ -6811,7 +7547,7 @@ function buildTokenVelocity() {
   for (const s of filtered) {
     const t = s.firstTs || s.mtime;
     if (!t) continue;
-    const ts = typeof t === 'number' ? t : new Date(t).getTime();
+    const ts = typeof t === 'number' ? t : Number(t) || new Date(t).getTime() || 0;
     const hoursAgo = (now - ts) / HOUR;
     if (hoursAgo < 0 || hoursAgo >= 24) continue;
     const bucket = Math.min(23, Math.floor(23 - hoursAgo));
@@ -6838,7 +7574,8 @@ function exportSessionsCSV() {
   if (!allSessions.length) { showToast('No data', 'No sessions loaded yet', 'warn'); return; }
   const headers = ['Date', 'Session ID', 'Prompt', 'Cost ($)', 'Duration (s)', 'Tool Calls', 'User Messages', 'Cache Hit %', 'Input Tokens'];
   const rows = allSessions.map(s => {
-    const dt = new Date(s.firstTs || s.mtime || 0).toISOString().slice(0, 19).replace('T', ' ');
+    const _ts1 = s.firstTs || s.mtime || 0;
+    const dt = new Date(typeof _ts1 === 'number' ? _ts1 : Number(_ts1) || _ts1).toISOString().slice(0, 19).replace('T', ' ');
     const cost = typeof s.totalCost === 'number' ? s.totalCost.toFixed(4) : '';
     const dur = s.totalDurationMs ? Math.round(s.totalDurationMs / 1000) : '';
     const cachePct = s.totalInputTokens > 0 ? Math.round((s.cacheReadTokens || 0) / s.totalInputTokens * 100) : '';
@@ -6871,11 +7608,12 @@ async function loadToolRank() {
     const data = await apiFetch('/api/tool-ranking?dir=' + enc(DIR));
     if (!data.tools?.length) { el.innerHTML = '<div class="loading-txt">No tool usage data</div>'; return; }
     const maxCount = data.tools[0].count;
-    const rows = data.tools.slice(0, 15).map((t, i) => {
+    const shownTools = data.tools.slice(0, 15);
+    const rows = shownTools.map((t, i) => {
       const barW = Math.round((t.count / maxCount) * 100);
       const errRate = t.errors > 0 ? ((t.errors / t.count) * 100).toFixed(0) + '%' : '—';
       return `<tr><td class="lb-rank">${i + 1}</td>
-        <td style="font-size:12px;color:var(--text-mid);max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${esc(t.tool)}</td>
+        <td style="font-size:12px;color:var(--text-mid);max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="${esc(t.tool)}">${esc(t.tool)}</td>
         <td style="width:80px;padding:4px 6px">
           <div style="height:4px;background:var(--surface-hi);border-radius:2px;overflow:hidden">
             <div style="height:100%;width:${barW}%;background:oklch(65% 0.15 200);border-radius:2px"></div>
@@ -6887,7 +7625,8 @@ async function loadToolRank() {
     }).join('');
     el.innerHTML = `<table class="lb-table"><thead><tr>
       <th class="lb-rank">#</th><th>Tool</th><th></th><th class="lb-cost">Calls</th><th class="lb-dur">Error%</th>
-    </tr></thead><tbody>${rows}</tbody></table>`;
+    </tr></thead><tbody>${rows}</tbody></table>` +
+      (data.tools.length > 15 ? `<div style="font-size:11px;color:var(--text-xs);margin-top:4px;text-align:right">Showing 15 of ${data.tools.length} tools</div>` : '');
   } catch (err) {
     el.innerHTML = '<div class="loading-txt">Could not load: ' + esc(err.message) + '</div>';
   }
@@ -6909,13 +7648,14 @@ async function loadProjCosts() {
     const data = await apiFetch('/api/project-costs');
     if (!data.projects?.length) { el.innerHTML = '<div class="loading-txt">No cost data across projects</div>'; return; }
     const maxCost = data.projects[0].cost;
-    const rows = data.projects.slice(0, 10).map((p, i) => {
+    const shownProjects = data.projects.slice(0, 10);
+    const rows = shownProjects.map((p, i) => {
       const barW = maxCost > 0 ? Math.round((p.cost / maxCost) * 100) : 0;
       const name = p.path.split('/').filter(Boolean).pop() || p.path;
       return `<tr onclick="switchProject('${esc(p.path)}')" style="cursor:pointer" title="${esc(p.path)}">
         <td class="lb-rank">${i + 1}</td>
         <td style="font-size:12px;color:var(--text-mid);max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${esc(name)}</td>
-        <td class="lb-cost">$${p.cost.toFixed(2)}</td>
+        <td class="lb-cost">$${(p.cost || 0).toFixed(2)}</td>
         <td style="width:80px;padding:4px 6px">
           <div style="height:4px;background:var(--surface-hi);border-radius:2px;overflow:hidden">
             <div style="height:100%;width:${barW}%;background:oklch(72% 0.18 75 / 0.7);border-radius:2px"></div>
@@ -6926,7 +7666,8 @@ async function loadProjCosts() {
     }).join('');
     el.innerHTML = `<table class="lb-table"><thead><tr>
       <th class="lb-rank">#</th><th>Project</th><th class="lb-cost">Cost</th><th></th><th class="lb-dur">Sessions</th>
-    </tr></thead><tbody>${rows}</tbody></table>`;
+    </tr></thead><tbody>${rows}</tbody></table>` +
+      (data.projects.length > 10 ? `<div style="font-size:11px;color:var(--text-xs);margin-top:4px;text-align:right">Showing 10 of ${data.projects.length} projects</div>` : '');
   } catch (err) {
     el.innerHTML = '<div class="loading-txt">Could not load: ' + esc(err.message) + '</div>';
   }
@@ -6954,7 +7695,7 @@ function buildGanttTimeline() {
   }
   for (const s of allSessions) {
     const t = s.firstTs || s.mtime; if (!t) continue;
-    const d = new Date(typeof t === 'number' ? t : t); d.setHours(0,0,0,0);
+    const d = new Date(typeof t === 'number' ? t : Number(t) || t); d.setHours(0,0,0,0);
     const key = d.toDateString();
     if (key in days) days[key].push(s);
   }
@@ -6972,11 +7713,11 @@ function buildGanttTimeline() {
     // Sort sessions by start time
     const sorted = [...sessions].sort((a, b) => {
       const ta = a.firstTs || a.mtime || 0; const tb = b.firstTs || b.mtime || 0;
-      return (typeof ta === 'number' ? ta : new Date(ta).getTime()) - (typeof tb === 'number' ? tb : new Date(tb).getTime());
+      return (typeof ta === 'number' ? ta : Number(ta) || new Date(ta).getTime() || 0) - (typeof tb === 'number' ? tb : Number(tb) || new Date(tb).getTime() || 0);
     });
     for (let i = 0; i < sorted.length; i++) {
       const s = sorted[i];
-      const startTs = typeof (s.firstTs || s.mtime) === 'number' ? (s.firstTs || s.mtime) : new Date(s.firstTs || s.mtime).getTime();
+      const _sT = s.firstTs || s.mtime; const startTs = typeof _sT === 'number' ? _sT : Number(_sT) || new Date(_sT).getTime() || 0;
       const dayStart = new Date(dateStr).getTime();
       const startPct = Math.min(95, ((startTs - dayStart) / DAY) * 100);
       const durPct = s.totalDurationMs ? Math.max(0.5, Math.min(15, (s.totalDurationMs / DAY) * 100)) : 1;
@@ -7003,11 +7744,11 @@ function showReportCard() {
 
   const todaySess = allSessions.filter(s => {
     const t = s.firstTs || s.mtime; if (!t) return false;
-    return new Date(typeof t === 'number' ? t : t).toDateString() === todayStr;
+    return new Date(typeof t === 'number' ? t : Number(t) || t).toDateString() === todayStr;
   });
   const weekSess = allSessions.filter(s => {
     const t = s.firstTs || s.mtime; if (!t) return false;
-    return (typeof t === 'number' ? t : new Date(t).getTime()) >= weekAgo;
+    return (typeof t === 'number' ? t : Number(t) || new Date(t).getTime() || 0) >= weekAgo;
   });
 
   function summarize(sessions, label) {
@@ -7153,7 +7894,7 @@ function showCostExplainer(sessId, event) {
     .map(([m,d])=>`<div class="err-item">${esc(m.replace(/^claude-/,'').replace(/-\d{8}$/,''))}: $${(d.cost||0).toFixed(4)} · ${d.calls||0} calls</div>`).join('');
   drawer.innerHTML = `<div class="err-drawer-head" style="color:oklch(70% 0.18 80)">
     <span>Cost anomaly — $${(sess.totalCost||0).toFixed(3)} (${ratio}× median, top ${100-pct}%)</span>
-    <button class="err-close" onclick="this.closest('.err-drawer').classList.remove('open');this.closest('.err-drawer').innerHTML=''">✕</button>
+    <button class="err-close" onclick="this.closest('.err-drawer').classList.remove('open');this.closest('.err-drawer').innerHTML=''" title="Close">✕</button>
   </div>
   <div class="err-drawer-body">
     <div class="err-item" style="color:var(--text-lo)">Tool calls: ${sess.toolCalls||0} · Messages: ${sess.totalMessages||0} · Tokens in: ${(sess.totalInputTokens||0).toLocaleString()}</div>
@@ -7170,7 +7911,7 @@ function buildDailyCostTrend() {
   const dates = new Array(30).fill(null).map((_, i) => new Date(now - (29 - i) * DAY).toDateString());
   for (const s of allSessions) {
     const t = s.firstTs || s.mtime; if (!t) continue;
-    const ts = typeof t === 'number' ? t : new Date(t).getTime();
+    const ts = typeof t === 'number' ? t : Number(t) || new Date(t).getTime() || 0;
     const daysAgo = Math.floor((now - ts) / DAY);
     const idx = 29 - daysAgo;
     if (idx >= 0 && idx < 30) buckets[idx] += s.totalCost || 0;
@@ -7222,7 +7963,7 @@ function buildHourlyHeatmap() {
   const grid = Array.from({ length: 7 }, () => new Array(24).fill(0));
   for (const s of allSessions) {
     const t = s.firstTs || s.mtime; if (!t) continue;
-    const d = new Date(typeof t === 'number' ? t : t);
+    const d = new Date(typeof t === 'number' ? t : Number(t) || t);
     const dow = d.getDay(); // 0=Sun
     const hour = d.getHours();
     grid[dow][hour]++;
@@ -7253,7 +7994,7 @@ function buildHourlyHeatmap() {
 
 // ── feature 50: custom tag editor ─────────────────────────
 const _customTagsKey = 'mm-custom-tags';
-let _customTagsMap = new Map(Object.entries(JSON.parse(localStorage.getItem(_customTagsKey) || '{}')));
+let _customTagsMap = new Map(Object.entries((function(){ try { return JSON.parse(localStorage.getItem(_customTagsKey) || '{}'); } catch { return {}; } })()));
 
 function getCustomTags(sessId) {
   return _customTagsMap.get(sessId) || [];
@@ -7273,10 +8014,12 @@ function addCustomTag(sessId, tag, event) {
   if (!tags.includes(t)) { tags.push(t); saveCustomTags(sessId, tags); }
   const wrap = document.querySelector(`.sr-custom-tags[data-sess="${CSS.escape(sessId)}"]`);
   if (wrap) wrap.outerHTML = renderCustomTagsInline(sessId, tags);
-  // rebuild tag filter bar in the DOM if it exists
+  // rebuild tag filter bar — full re-render if bar was absent (e.g. just transitioned from 0 tags)
   initTags();
   const tfBar = document.querySelector('.tag-filter-bar');
-  if (tfBar) tfBar.outerHTML = buildTagFilterBar(allSessions);
+  const newBarHtml = buildTagFilterBar(allSessions);
+  if (tfBar) tfBar.outerHTML = newBarHtml;
+  else if (newBarHtml) renderSessions();
 }
 
 function removeCustomTag(sessId, tag, event) {
@@ -7285,6 +8028,9 @@ function removeCustomTag(sessId, tag, event) {
   saveCustomTags(sessId, tags);
   const wrap = document.querySelector(`.sr-custom-tags[data-sess="${CSS.escape(sessId)}"]`);
   if (wrap) wrap.outerHTML = renderCustomTagsInline(sessId, tags);
+  initTags();
+  const tfBar = document.querySelector('.tag-filter-bar');
+  if (tfBar) tfBar.outerHTML = buildTagFilterBar(allSessions);
 }
 
 function showCustomTagInput(sessId, event) {
@@ -7297,7 +8043,7 @@ function showCustomTagInput(sessId, event) {
   iw.className = 'ctag-input-wrap';
   iw.onclick = e => e.stopPropagation();
   iw.innerHTML = `<input class="ctag-input" type="text" placeholder="tag name…" maxlength="20" autofocus>
-    <button class="ctag-ok" onclick="(()=>{const inp=this.closest('.ctag-input-wrap').querySelector('input');addCustomTag('${esc(sessId)}',inp.value,event);inp.value='';})()">Add</button>`;
+    <button class="ctag-ok" title="Add this tag to the session" onclick="(()=>{const inp=this.closest('.ctag-input-wrap').querySelector('input');addCustomTag('${esc(sessId)}',inp.value,event);inp.value='';})()">Add</button>`;
   wrap.appendChild(iw);
   const inp = iw.querySelector('input');
   inp.focus();
@@ -7328,14 +8074,14 @@ async function toggleErrDrawer(sessId, event) {
   try {
     const data = await apiFetch('/api/session-errors?dir=' + enc(DIR) + '&id=' + enc(sessId));
     if (!data.errors?.length) {
-      drawer.innerHTML = `<div class="err-drawer-head"><span>No error details found</span><button class="err-close" onclick="closeErrDrawer('${esc(sessId)}')">✕</button></div>`;
+      drawer.innerHTML = `<div class="err-drawer-head"><span>No error details found</span><button class="err-close" onclick="closeErrDrawer('${esc(sessId)}')" title="Close">✕</button></div>`;
       return;
     }
     const items = data.errors.map(e => `<div class="err-item">${esc(e.text)}</div>`).join('');
-    drawer.innerHTML = `<div class="err-drawer-head"><span>${data.errors.length} error${data.errors.length !== 1 ? 's' : ''}</span><button class="err-close" onclick="closeErrDrawer('${esc(sessId)}')">✕</button></div>
+    drawer.innerHTML = `<div class="err-drawer-head"><span>${data.errors.length} error${data.errors.length !== 1 ? 's' : ''}</span><button class="err-close" onclick="closeErrDrawer('${esc(sessId)}')" title="Close">✕</button></div>
       <div class="err-drawer-body">${items}</div>`;
   } catch (err) {
-    drawer.innerHTML = `<div class="err-drawer-head"><span>Could not load: ${esc(err.message)}</span><button class="err-close" onclick="closeErrDrawer('${esc(sessId)}')">✕</button></div>`;
+    drawer.innerHTML = `<div class="err-drawer-head"><span>Could not load: ${esc(err.message)}</span><button class="err-close" onclick="closeErrDrawer('${esc(sessId)}')" title="Close">✕</button></div>`;
   }
 }
 
@@ -7369,7 +8115,7 @@ function buildCostHistogram() {
   const counts = new Array(BUCKETS).fill(0);
   for (const c of costs) { const i = Math.min(BUCKETS - 1, Math.floor((c - minC) / bucketSize)); counts[i]++; }
   const maxCount = Math.max(1, ...counts);
-  const fmt = v => v < 0.01 ? v.toFixed(4) : v < 1 ? '$' + v.toFixed(2) : '$' + v.toFixed(1);
+  const fmt = v => v < 0.01 ? '$' + v.toFixed(4) : v < 1 ? '$' + v.toFixed(2) : '$' + v.toFixed(1);
   const bars = counts.map((n, i) => {
     const h = Math.max(2, Math.round((n / maxCount) * 46));
     const lo = minC + i * bucketSize; const hi = lo + bucketSize;
@@ -7435,18 +8181,25 @@ function esc(s) {
 
 function relTime(ts) {
   if (!ts) return '';
-  const diff = Date.now() - (typeof ts === 'number' ? ts : new Date(ts).getTime());
+  const abs = typeof ts === 'number' ? ts : (Number(ts) || new Date(ts).getTime() || 0);
+  const diff = Date.now() - abs;
   const s = Math.floor(diff / 1000);
   if (s < 5)  return 'now';
-  if (s < 60) return s + 's';
+  if (s < 60) return s + 's ago';
   const m = Math.floor(s / 60);
-  if (m < 60) return m + 'm';
+  if (m < 60) return m + 'm ago';
   const h = Math.floor(m / 60);
-  if (h < 24) return h + 'h';
-  return Math.floor(h / 24) + 'd';
+  if (h < 24) return h + 'h ago';
+  const d = Math.floor(h / 24);
+  if (d < 7)  return d + 'd ago';
+  const dt = new Date(abs);
+  const mon = dt.toLocaleString('default', { month: 'short' });
+  const sameYear = dt.getFullYear() === new Date().getFullYear();
+  return sameYear ? mon + ' ' + dt.getDate() : mon + ' ' + dt.getDate() + ', ' + dt.getFullYear();
 }
 
 function fmtDur(ms) {
+  if (!ms || ms < 1000) return '<1s';
   const s = Math.floor(ms / 1000);
   if (s < 60) return s + 's';
   const m = Math.floor(s / 60);
@@ -7643,7 +8396,7 @@ function renderMgOverview() {
     topEl.innerHTML = prSorted.map(n => `
       <div class="mg-bar-row">
         <div class="mg-bar-lbl" title="${esc(n.label)}">${esc(mgShortLabel(n.label))}</div>
-        <div class="mg-bar-track"><div class="mg-bar-fill" style="width:${maxPR ? Math.round((n.score/maxPR)*100) : 0}%"></div></div>
+        <div class="mg-bar-track" title="${esc(n.label)}: PageRank ${n.score.toExponential(3)}"><div class="mg-bar-fill" style="width:${maxPR ? Math.round((n.score/maxPR)*100) : 0}%"></div></div>
         <div class="mg-bar-val">${n.score.toExponential(1)}</div>
       </div>`).join('');
   }
@@ -7668,7 +8421,7 @@ function renderMgOverview() {
   typeEl.innerHTML = typeEntries.map(([t, c]) => `
     <div class="mg-bar-row">
       <div class="mg-bar-lbl">${esc(t)}</div>
-      <div class="mg-bar-track"><div class="mg-bar-fill mg" style="width:${Math.round((c/maxTC)*100)}%"></div></div>
+      <div class="mg-bar-track" title="${esc(t)}: ${c} node${c!==1?'s':''} (${Math.round((c/maxTC)*100)}%)"><div class="mg-bar-fill mg" style="width:${Math.round((c/maxTC)*100)}%"></div></div>
       <div class="mg-bar-val">${c}</div>
     </div>`).join('');
 }
@@ -7720,9 +8473,11 @@ async function mgRebuild() {
   try {
     const res = await fetch('/api/monograph-build?dir=' + enc(DIR), { method: 'POST' });
     if (!res.ok) throw new Error('HTTP ' + res.status);
+    showToast('Rebuilding', 'Knowledge graph rebuild started', 'info');
     _mgLoaded = false;
     await loadMonograph();
-  } catch (_) {}
+    showToast('Done', 'Knowledge graph rebuilt', 'ok');
+  } catch (e) { showToast('Error', e.message, 'err'); }
   btn.disabled = false; btn.textContent = 'REBUILD';
 }
 
@@ -7849,14 +8604,16 @@ function mgRunClient(id) {
     } else if (id === 'pagerank') {
       // Proper power-iteration PageRank (d=0.85, 50 iterations)
       const prMap = mgComputePageRank(g);
-      const ranked = nodes.map(n => {
+      const allRanked = nodes.map(n => {
         const k = n.id || n.name || n.label || '';
         return { label: n.label || n.name || k, score: prMap[k] || 0 };
-      }).sort((a, b) => b.score - a.score).slice(0, 20);
+      }).sort((a, b) => b.score - a.score);
+      const ranked = allRanked.slice(0, 20);
       const maxScore = ranked.length ? ranked[0].score : 1;
       html = `<table class="mg-table"><thead><tr><th>#</th><th>Node</th><th>PageRank</th><th style="width:180px">Weight</th></tr></thead><tbody>` +
         ranked.map((r, i) => `<tr><td>${i+1}</td><td title="${esc(r.label)}">${esc(mgShortLabel(r.label))}</td><td>${r.score.toExponential(3)}</td><td><div class="mg-bar-track" style="height:8px"><div class="mg-bar-fill" style="width:${maxScore ? Math.round((r.score/maxScore)*100) : 0}%"></div></div></td></tr>`).join('') +
-        `</tbody></table>`;
+        `</tbody></table>` +
+        (allRanked.length > 20 ? `<div style="font-size:11px;color:var(--text-xs);margin-top:4px;text-align:right">Showing 20 of ${allRanked.length} nodes</div>` : '');
 
     } else if (id === 'deadcode') {
       const isolated = nodes.filter(n => (degMap[n.id || n.name || n.label || ''] || 0) === 0);
@@ -7888,7 +8645,8 @@ function mgRunClient(id) {
         <div class="mg-kv-card"><div class="mkv-k">Components</div><div class="mkv-v">${comps.length}</div></div>
         <div class="mg-kv-card"><div class="mkv-k">Largest</div><div class="mkv-v">${comps[0] ? comps[0].length : 0}</div></div>
       </div>` +
-      top5.map((c, i) => `<div style="margin-bottom:8px"><div style="font-size:11px;color:var(--text-xs);margin-bottom:3px">Component ${i+1} — ${c.length} nodes</div><div style="font-size:11px;font-family:var(--mono);color:var(--text-mid)">${c.slice(0,5).map(esc).join(', ')}${c.length > 5 ? ` … +${c.length-5} more` : ''}</div></div>`).join('');
+      top5.map((c, i) => `<div style="margin-bottom:8px"><div style="font-size:11px;color:var(--text-xs);margin-bottom:3px">Component ${i+1} — ${c.length} nodes</div><div style="font-size:11px;font-family:var(--mono);color:var(--text-mid)">${c.slice(0,5).map(esc).join(', ')}${c.length > 5 ? ` … +${c.length-5} more` : ''}</div></div>`).join('') +
+      (comps.length > 5 ? `<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Showing 5 of ${comps.length} components</div>` : '');
 
     } else if (id === 'topo') {
       const inDeg = {}; const adj = {};
@@ -7965,14 +8723,16 @@ function mgRunClient(id) {
 
     } else if (id === 'betweenness') {
       const bc = mgApproxBetweenness(g);
-      const bcRanked = Object.entries(bc).sort((a,b) => b[1]-a[1]).slice(0,20);
+      const bcAll = Object.entries(bc).sort((a,b) => b[1]-a[1]);
+      const bcRanked = bcAll.slice(0,20);
       const maxBC = bcRanked.length ? bcRanked[0][1] : 1;
       if (!bcRanked.length || maxBC === 0) { html = '<div class="loading-txt">Not enough graph data for betweenness</div>'; }
       else {
         html = `<div style="font-size:11px;color:var(--text-xs);margin-bottom:8px">Approximate betweenness centrality (sample-based BFS). High score = architectural bridge.</div>
           <table class="mg-table"><thead><tr><th>#</th><th>Node</th><th>Score</th><th style="width:160px">Weight</th></tr></thead><tbody>` +
           bcRanked.map(([k, v], i) => `<tr><td>${i+1}</td><td title="${esc(k)}">${esc(mgShortLabel(k))}</td><td>${v.toFixed(1)}</td><td><div class="mg-bar-track" style="height:8px"><div class="mg-bar-fill mg" style="width:${Math.round((v/maxBC)*100)}%"></div></div></td></tr>`).join('') +
-          `</tbody></table>`;
+          `</tbody></table>` +
+          (bcAll.length > 20 ? `<div style="font-size:11px;color:var(--text-xs);margin-top:4px;text-align:right">Showing 20 of ${bcAll.length} nodes</div>` : '');
       }
 
     } else if (id === 'jaccard') {
@@ -8095,7 +8855,7 @@ function mgRenderAnalysisResult(toolId, text) {
       return `<div class="mgr-ranked-row">
         <span class="mgr-ranked-num">${r.rank}</span>
         <span class="mgr-ranked-name" title="${h(r.name)}">${h(r.name)}</span>
-        <div class="mgr-ranked-bar-wrap"><div class="mgr-ranked-bar-fill" style="width:${pct}%"></div></div>
+        <div class="mgr-ranked-bar-wrap" title="${h(r.name)}: ${h(String(r.val))}"><div class="mgr-ranked-bar-fill" style="width:${pct}%"></div></div>
         <span class="mgr-ranked-val">${h(String(r.val))}</span>
       </div>`;
     }).join('')}</div>`;
@@ -8225,7 +8985,7 @@ function mgRenderAnalysisResult(toolId, text) {
       return `<div class="mgr-ranked-row">
         <span class="mgr-ranked-num">${r.rank}</span>
         <span class="mgr-ranked-name" title="${h(r.path)}">${h(name)}</span>
-        <div class="mgr-ranked-bar-wrap"><div class="mgr-ranked-bar-fill" style="width:${pct}%"></div></div>
+        <div class="mgr-ranked-bar-wrap" title="${h(r.path)}: ${r.lines.toLocaleString()} lines"><div class="mgr-ranked-bar-fill" style="width:${pct}%"></div></div>
         <span class="mgr-ranked-val">${r.lines.toLocaleString()}</span>
       </div>`;
     }).join('')}</div>`;
@@ -8273,6 +9033,13 @@ async function mgRunServer(id) {
 }
 
 // ── QUERY TAB ──────────────────────────────────────────────
+// Click any query result box to copy its text content
+document.addEventListener('click', e => {
+  const el = e.target.closest('.mg-query-result');
+  if (!el || !el.textContent.trim()) return;
+  navigator.clipboard.writeText(el.textContent).then(() => showToast('Copied', 'Query result copied', 'ok')).catch(() => {});
+});
+
 function mgQuerySearch(q) {
   const res = document.getElementById('mg-q-search-result');
   if (!q.trim()) { res.style.display = 'none'; return; }
@@ -8467,7 +9234,7 @@ function mgRenderExport() {
     <div class="mg-export-card">
       <div class="mec-name">${esc(x.name)}</div>
       <div class="mec-desc">${esc(x.desc)}</div>
-      <button class="btn" onclick="mgExport('${esc(x.id)}')" style="margin-top:auto">EXPORT</button>
+      <button class="btn" title="Export graph as ${esc(x.name)}" onclick="mgExport('${esc(x.id)}')" style="margin-top:auto">EXPORT</button>
     </div>`).join('');
 }
 
@@ -8731,8 +9498,8 @@ function mgRenderWiki() {
   // type pills
   const types = [...new Set(nodes.map(n => n.type || n.kind || 'unknown'))].sort();
   const pillsEl = document.getElementById('mg-wiki-pills');
-  pillsEl.innerHTML = `<span class="mg-pill active" data-type="all" onclick="mgWikiFilterType('all')">All</span>` +
-    types.map(t => `<span class="mg-pill" data-type="${esc(t)}" onclick="mgWikiFilterType('${esc(t)}')">${esc(t)}</span>`).join('');
+  pillsEl.innerHTML = `<span class="mg-pill active" data-type="all" title="Show all node types" onclick="mgWikiFilterType('all')">All</span>` +
+    types.map(t => `<span class="mg-pill" data-type="${esc(t)}" title="Filter by type: ${esc(t)}" onclick="mgWikiFilterType('${esc(t)}')">${esc(t)}</span>`).join('');
 
   mgRenderWikiList('');
 }
@@ -8803,9 +9570,11 @@ function mgWikiSearchDebounced(q) {
       apiFetch('/api/monograph-wiki-search?q=' + enc(q) + '&dir=' + enc(DIR))
         .then(d => {
           if (!d || !d.nodes || !d.nodes.length) return;
-          el.innerHTML = d.nodes.slice(0, 50).map(n => {
+          const serverNodes = d.nodes.slice(0, 50);
+          el._wikiData = serverNodes;
+          el.innerHTML = serverNodes.map((n, idx) => {
             const lbl = n.label || n.name || '';
-            return `<div class="mg-node-item"><div class="mni-ico">${mgNodeIcon(n.type)}</div><div class="mni-lbl">${esc(lbl)}</div><div class="mni-path">${esc(mgShortPath(lbl))}</div><div class="mni-deg">${n.degree || 0}</div></div>`;
+            return `<div class="mg-node-item" onclick="mgWikiShowDetail(${idx})"><div class="mni-ico">${mgNodeIcon(n.type)}</div><div class="mni-lbl">${esc(lbl)}</div><div class="mni-path">${esc(mgShortPath(lbl))}</div><div class="mni-deg">${n.degree || 0}</div></div>`;
           }).join('');
         }).catch(() => {});
     }
@@ -8830,9 +9599,9 @@ function mgWikiShowDetail(idx) {
     </div>
     ${contentPreview ? `<div class="mdp-content-preview">${esc(contentPreview)}</div>` : ''}
     <div class="mdp-actions">
-      ${contentPreview ? `<button class="btn" id="mg-copy-btn" data-copy-idx="${idx}">COPY CONTENT</button>` : ''}
-      <button class="btn" data-explain-idx="${idx}">EXPLAIN</button>
-      <button class="btn" data-related-idx="${idx}">FIND RELATED</button>
+      ${contentPreview ? `<button class="btn" id="mg-copy-btn" title="Copy file content to clipboard" data-copy-idx="${idx}">COPY CONTENT</button>` : ''}
+      <button class="btn" title="Ask the AI to explain this node" data-explain-idx="${idx}">EXPLAIN</button>
+      <button class="btn" title="Find nodes related to this one in the graph" data-related-idx="${idx}">FIND RELATED</button>
     </div>
     <div class="mdp-explain-result" id="mg-explain-result" style="display:none"></div>
     <div id="mg-related-result" style="display:none;margin-top:10px"></div>`;
@@ -8867,6 +9636,26 @@ async function mgWikiExplain(nodeId, btn) {
   btn.disabled = false; btn.textContent = 'EXPLAIN';
 }
 
+function mgWikiJumpToNode(nodeId) {
+  if (!_mgGraph) return;
+  const el = document.getElementById('mg-wiki-list');
+  const data = el._wikiData || (_mgGraph.nodes || []);
+  const idx = data.findIndex(n => (n.id || n.name || n.label || '') === nodeId);
+  if (idx >= 0) {
+    mgWikiShowDetail(idx);
+    document.getElementById('mg-wiki-detail')?.scrollIntoView({ behavior:'smooth', block:'nearest' });
+  } else {
+    // node not in current filtered list — search for it and jump
+    const searchEl = document.getElementById('mg-wiki-search');
+    if (searchEl) { searchEl.value = nodeId; mgRenderWikiList(nodeId); }
+    setTimeout(() => {
+      const newData = document.getElementById('mg-wiki-list')?._wikiData || [];
+      const newIdx = newData.findIndex(n => (n.id || n.name || n.label || '') === nodeId);
+      if (newIdx >= 0) mgWikiShowDetail(newIdx);
+    }, 100);
+  }
+}
+
 function mgWikiFindRelated(nodeId) {
   const el = document.getElementById('mg-related-result');
   if (!el || !_mgGraph) return;
@@ -8882,11 +9671,12 @@ function mgWikiFindRelated(nodeId) {
   hop1.forEach(v => { (adj[v] ? [...adj[v]] : []).forEach(w => { if (w !== nodeId && !hop1.includes(w)) hop2.add(w); }); });
   const related = [...hop1, ...hop2].slice(0, 20);
   if (!related.length) { el.innerHTML = '<div class="loading-txt">No related nodes found</div>'; el.style.display = 'block'; return; }
-  el.innerHTML = `<div style="font-size:11px;color:var(--text-xs);margin-bottom:6px">Related nodes (2-hop neighborhood)</div>` +
+  el.innerHTML = `<div style="font-size:11px;color:var(--text-xs);margin-bottom:6px">Related nodes (2-hop neighborhood) — click to open</div>` +
     `<ul class="mg-node-list">` + related.map(k => {
       const n = (_mgGraph.nodes || []).find(x => (x.id || x.name || x.label || '') === k);
       const lbl = n ? (n.label || n.name || k) : k;
-      return `<li>${esc(lbl)}</li>`;
+      const typeIcon = n ? mgNodeIcon(n.type || n.kind) : '◈';
+      return `<li style="cursor:pointer;display:flex;align-items:center;gap:6px;padding:2px 0" onclick="mgWikiJumpToNode(${JSON.stringify(k)})" title="Open ${esc(lbl)}"><span style="opacity:0.6">${typeIcon}</span>${esc(lbl)}</li>`;
     }).join('') + `</ul>`;
   el.style.display = 'block';
 }
@@ -8902,18 +9692,19 @@ async function mgRebuildDocs() {
   btn.disabled = true; btn.textContent = 'BUILDING…';
   try {
     await fetch('/api/monograph-build-docs?dir=' + enc(DIR), { method:'POST' });
+    showToast('Building', 'Documentation build started…', 'info');
     // poll until done (max 60 attempts = ~2 minutes)
     let polls = 0;
     const poll = async () => {
-      if (++polls > 60) { btn.disabled = false; btn.textContent = 'BUILD DOCS'; return; }
+      if (++polls > 60) { btn.disabled = false; btn.textContent = 'BUILD DOCS'; showToast('Timeout', 'Doc build is taking longer than expected', 'warn'); return; }
       try {
         const d = await apiFetch('/api/monograph-build-docs-status?dir=' + enc(DIR));
-        if (d && d.done) { btn.disabled = false; btn.textContent = 'BUILD DOCS'; mgWikiRefresh(); return; }
+        if (d && d.done) { btn.disabled = false; btn.textContent = 'BUILD DOCS'; mgWikiRefresh(); showToast('Done', 'Documentation built', 'ok'); return; }
       } catch (_) {}
       setTimeout(poll, 2000);
     };
     poll();
-  } catch (e) { btn.disabled = false; btn.textContent = 'BUILD DOCS'; }
+  } catch (e) { btn.disabled = false; btn.textContent = 'BUILD DOCS'; showToast('Error', e.message, 'err'); }
 }
 
 // ── memory CRUD ────────────────────────────────────────────
@@ -8951,6 +9742,41 @@ async function loadMemoriesTab() {
   }
 }
 
+function filterMemList(q) {
+  const lq = (q || '').toLowerCase();
+  let totalVisible = 0;
+  document.querySelectorAll('#mem-list-pane .mem-item').forEach(el => {
+    const text = (el.textContent || '').toLowerCase();
+    const show = !lq || text.includes(lq);
+    el.style.display = show ? '' : 'none';
+    if (show) totalVisible++;
+  });
+  document.querySelectorAll('#mem-list-pane .mem-type-hdr').forEach(hdr => {
+    let next = hdr.nextElementSibling;
+    let anyVisible = false;
+    while (next && !next.classList.contains('mem-type-hdr')) {
+      if (next.style.display !== 'none') anyVisible = true;
+      next = next.nextElementSibling;
+    }
+    hdr.style.display = anyVisible ? '' : 'none';
+  });
+  const list = document.getElementById('mem-list-pane');
+  const noRes = document.getElementById('mem-filter-noresult');
+  if (lq && totalVisible === 0 && _memFiles.length > 0) {
+    if (!noRes) {
+      const el = document.createElement('div');
+      el.id = 'mem-filter-noresult';
+      el.style.cssText = 'padding:12px 14px;color:var(--text-lo);font-size:12px';
+      el.textContent = 'No memories match "' + q.slice(0, 30) + '"';
+      list.appendChild(el);
+    } else {
+      noRes.textContent = 'No memories match "' + q.slice(0, 30) + '"';
+    }
+  } else if (noRes) {
+    noRes.remove();
+  }
+}
+
 function _renderMemList() {
   const list = document.getElementById('mem-list-pane');
   if (!list) return;
@@ -8966,7 +9792,8 @@ function _renderMemList() {
       const col = _MEM_COLORS[type] || _MEM_COLOR_FALLBACK;
       const fname = f.filename || f.name || '?';
       const active = _selMemFilename === fname ? ' active' : '';
-      return '<div class="mem-item' + active + '" data-filename="' + esc(fname) + '" onclick="selectMem(this.dataset.filename)">' +
+      const memTitle = [f.description, f.name || fname].filter(Boolean).join(' — ');
+      return '<div class="mem-item' + active + '" data-filename="' + esc(fname) + '" onclick="selectMem(this.dataset.filename)" title="' + esc(memTitle) + '">' +
         '<span class="mem-type-dot" style="background:' + esc(col) + ';flex-shrink:0"></span>' +
         '<span class="mem-item-name">' + esc(f.name || fname.replace('.md', '')) + '</span>' +
         '</div>';
@@ -8985,17 +9812,17 @@ function selectMem(filename) {
   const rawBody = f.body || f.content || '';
   const bodyHtml = rawBody
     .replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')
-    .replace(/\*\*(.+?)\*\*/g, (_, g) => '<strong>' + esc(g) + '</strong>')
-    .replace(/^#{1,3} (.+)/gm, (_, g) => '<div style="font-weight:600;color:var(--text-hi);margin:6px 0 2px">' + esc(g) + '</div>')
-    .replace(/^- (.+)/gm, (_, g) => '<div style="padding-left:12px">• ' + esc(g) + '</div>');
+    .replace(/\*\*(.+?)\*\*/g, (_, g) => '<strong>' + g + '</strong>')
+    .replace(/^#{1,3} (.+)/gm, (_, g) => '<div style="font-weight:600;color:var(--text-hi);margin:6px 0 2px">' + g + '</div>')
+    .replace(/^- (.+)/gm, (_, g) => '<div style="padding-left:12px">• ' + g + '</div>');
   const srcBadge = f.source === 'backend'
     ? '<span class="mem-badge" style="background:var(--text-lo)22;color:var(--text-lo);margin-left:6px" title="Stored in the AgentDB backend store, not as a file">backend</span>'
     : '';
   const actions = (f.readonly || f.source === 'backend')
     ? '<div class="mem-actions"><span style="font-size:11px;color:var(--text-lo)">Read-only — stored in the backend memory store (not a file)</span></div>'
     : '<div class="mem-actions">' +
-        '<button class="btn" onclick="openEditMemModal(' + JSON.stringify(filename) + ')">&#x270E; Edit</button>' +
-        '<button class="btn" style="color:var(--red);border-color:var(--red)" onclick="deleteMem(' + JSON.stringify(filename) + ')">&#x2715; Delete</button>' +
+        '<button class="btn" title="Edit this memory entry" onclick="openEditMemModal(' + JSON.stringify(filename) + ')">&#x270E; Edit</button>' +
+        '<button class="btn" title="Delete this memory entry" style="color:var(--red);border-color:var(--red)" onclick="deleteMem(' + JSON.stringify(filename) + ')">&#x2715; Delete</button>' +
       '</div>';
   detail.innerHTML =
     '<span class="mem-badge" style="background:' + col + '22;color:' + col + '">' + esc(f.type || '?') + '</span>' + srcBadge +
@@ -9105,7 +9932,7 @@ function _renderSwarmRunList() {
       '<span class="swarm-topo-pill">' + esc(topo) + '</span>' +
       (live ? '<span class="swarm-live">⬤ LIVE</span>' : '') +
       '</div>' +
-      '<div style="font-size:11px;color:var(--text-lo);margin-top:2px">' + (r.agentCount || 0) + ' agents · ' + relTime(r.startedAt || r.created_at) + '</div>' +
+      '<div style="font-size:11px;color:var(--text-lo);margin-top:2px">' + (r.agentCount || 0) + ' agents · ' + (function(ts){const d=ts&&new Date(typeof ts==='number'?ts:Number(ts)||ts);return d&&!isNaN(d)?'<span title="'+d.toLocaleString()+'">'+relTime(ts)+'</span>':relTime(ts);})(r.startedAt||r.created_at) + '</div>' +
       '</div>';
   }).join('');
 }
@@ -9118,7 +9945,7 @@ async function selectSwarmRun(idx) {
   if (!detail) return;
   detail.innerHTML =
     '<div style="margin-bottom:10px">' +
-      '<div style="font-size:13px;font-weight:600;color:var(--text-hi)">' + esc((run.swarmId || run.id || '—').toString().slice(0, 14)) + '</div>' +
+      '<div style="font-size:13px;font-weight:600;color:var(--text-hi)" title="' + esc((run.swarmId || run.id || '').toString()) + '">' + esc((run.swarmId || run.id || '—').toString().slice(0, 14)) + '</div>' +
       '<div style="font-size:11px;color:var(--text-lo);margin-top:3px">' + esc(run.topology || '—') + ' · ' + esc(run.consensus || '—') + ' · ' + (run.agentCount || 0) + ' agents</div>' +
     '</div>' +
     '<canvas id="swarm-topo-canvas" style="width:100%;max-width:380px;height:190px;display:block;border:1px solid var(--border);border-radius:6px;margin-bottom:12px"></canvas>' +
@@ -9195,14 +10022,16 @@ function _renderSwarmAgents(run) {
   if (!el) return;
   const agents = run.agents || [];
   if (!agents.length) { el.innerHTML = ''; return; }
+  const shownA = agents.slice(0, 15);
   el.innerHTML = '<div class="m-group-title" style="margin-bottom:4px">Agents</div>' +
-    agents.slice(0, 15).map(a =>
+    shownA.map(a =>
       '<div style="display:flex;gap:10px;padding:3px 0;font-size:11px;border-bottom:1px solid var(--border)">' +
-        '<span style="color:var(--text-lo);font-family:var(--mono);min-width:70px">' + esc((a.id || '').toString().slice(0, 10)) + '</span>' +
+        '<span style="color:var(--text-lo);font-family:var(--mono);min-width:70px" title="' + esc((a.id || '').toString()) + '">' + esc((a.id || '').toString().slice(0, 10)) + ((a.id || '').toString().length > 10 ? '…' : '') + '</span>' +
         '<span style="color:var(--text-hi)">' + esc(a.type || a.role || 'worker') + '</span>' +
         '<span style="margin-left:auto;color:var(--text-xs)">' + esc(a.status || '—') + '</span>' +
       '</div>'
-    ).join('');
+    ).join('') +
+    (agents.length > 15 ? '<div style="font-size:11px;color:var(--text-xs);padding:3px 0">+' + (agents.length - 15) + ' more agents</div>' : '');
 }
 
 async function _loadSwarmEvents(swarmId) {
@@ -9213,11 +10042,13 @@ async function _loadSwarmEvents(swarmId) {
     const data = await apiFetch('/api/swarm-events?agentId=' + enc(swarmId) + '&dir=' + enc(DIR));
     const events = Array.isArray(data) ? data : (data.events || []);
     if (!events.length) { el.innerHTML = ''; return; }
-    el.innerHTML = '<div class="m-group-title" style="margin-bottom:3px">Events</div>' +
-      events.slice(-40).map(e =>
+    const shownEv = events.slice(-40);
+    el.innerHTML = '<div class="m-group-title" style="margin-bottom:3px">Events' + (events.length > 40 ? '<span style="font-size:10px;color:var(--text-xs);font-weight:400;margin-left:6px">last 40 of ' + events.length + '</span>' : '') + '</div>' +
+      shownEv.map(e =>
         '<div style="color:var(--text-lo);padding:2px 0;border-bottom:1px solid var(--border)">' +
-          esc(relTime(e.ts || e.timestamp)) + ' <span style="color:var(--text-mid)">' + esc(e.type || e.kind || '?') + '</span> ' +
-          esc((e.message || e.data || '').toString().slice(0, 70)) +
+          '<span title="' + ((e.ts || e.timestamp) ? new Date(typeof (e.ts || e.timestamp) === 'number' ? (e.ts || e.timestamp) : (e.ts || e.timestamp)).toLocaleString() : '') + '">' + esc(relTime(e.ts || e.timestamp)) + '</span>' +
+          ' <span style="color:var(--text-mid)">' + esc(e.type || e.kind || '?') + '</span> ' +
+          '<span title="' + esc((e.message || e.data || '').toString()) + '">' + esc((e.message || e.data || '').toString().slice(0, 70)) + ((e.message || e.data || '').toString().length > 70 ? '…' : '') + '</span>' +
         '</div>'
       ).join('');
     el.scrollTop = el.scrollHeight;
@@ -9281,23 +10112,25 @@ function _renderChunks(list) {
     grid.innerHTML = '<div class="empty">No chunks indexed.<br><span style="font-size:11px;color:var(--text-xs)">Run /monomind:understand to build the index.</span></div>';
     return;
   }
-  grid.innerHTML = list.slice(0, 200).map(c => {
+  const shown = list.slice(0, 200);
+  grid.innerHTML = shown.map(c => {
     const src = (c.source || c.file || '').split('/').slice(-2).join('/');
     const excerpt = (c.content || c.text || c.body || '').slice(0, 220);
     const ns = c.namespace || c.type || '';
-    const chunkId = JSON.stringify(c.id || c.path || c.source || '');
-    const chunkContent = JSON.stringify(c.content || c.text || c.body || '');
-    const chunkSrc = JSON.stringify(src);
+    const chunkId = JSON.stringify(c.id || c.path || c.source || '').replace(/"/g, '&quot;');
+    const chunkContent = JSON.stringify(c.content || c.text || c.body || '').replace(/"/g, '&quot;');
+    const chunkSrc = JSON.stringify(src).replace(/"/g, '&quot;');
     return '<div class="chunk-card" data-search="' + esc((src + ' ' + excerpt + ' ' + ns).toLowerCase()) + '">' +
       '<div class="chunk-src">' + esc(src || '—') + '</div>' +
-      '<div class="chunk-excerpt">' + esc(excerpt) + '</div>' +
+      '<div class="chunk-excerpt" title="' + esc(c.content || c.text || c.body || '') + '">' + esc(excerpt) + ((c.content || c.text || c.body || '').length > 220 ? '…' : '') + '</div>' +
       '<div class="chunk-footer">' +
         (ns ? '<span class="chunk-ns">' + esc(ns) + '</span>' : '') +
-        '<button class="btn" style="margin-left:auto;font-size:10px;padding:1px 7px" onclick="openChunkEdit(' + chunkId + ',' + chunkContent + ',' + chunkSrc + ')">✎ Edit</button>' +
-        '<button class="btn" style="font-size:10px;padding:1px 7px;color:var(--red);border-color:var(--red)" onclick="deleteChunk(' + chunkId + ')">✕</button>' +
+        '<button class="btn" title="Edit this chunk" style="margin-left:auto;font-size:10px;padding:1px 7px" onclick="openChunkEdit(' + chunkId + ',' + chunkContent + ',' + chunkSrc + ')">✎ Edit</button>' +
+        '<button class="btn" title="Delete this chunk" style="font-size:10px;padding:1px 7px;color:var(--red);border-color:var(--red)" onclick="deleteChunk(' + chunkId + ')">✕</button>' +
       '</div>' +
     '</div>';
-  }).join('');
+  }).join('') +
+  (list.length > 200 ? '<div style="font-size:11px;color:var(--text-xs);padding:8px 0;text-align:center">Showing 200 of ' + list.length + ' chunks — use the filter to narrow results</div>' : '');
 }
 
 function openChunkEdit(id, content, srcLabel) {
@@ -9371,9 +10204,33 @@ async function buildKnowledgeDocs() {
 
 function filterChunks(q) {
   const lq = q.toLowerCase();
-  document.querySelectorAll('#chunks-grid .chunk-card').forEach(el => {
-    el.style.display = (!lq || (el.dataset.search || '').includes(lq)) ? '' : 'none';
+  const cards = document.querySelectorAll('#chunks-grid .chunk-card');
+  let visible = 0;
+  cards.forEach(el => {
+    const show = !lq || (el.dataset.search || '').includes(lq);
+    el.style.display = show ? '' : 'none';
+    if (show) visible++;
   });
+  const countEl = document.getElementById('chunk-count-val');
+  if (countEl && lq) countEl.textContent = visible + ' / ' + cards.length;
+  else if (countEl) countEl.textContent = cards.length.toLocaleString();
+  // zero-results empty state
+  const grid = document.getElementById('chunks-grid');
+  const noRes = document.getElementById('chunks-filter-noresult');
+  if (lq && visible === 0 && cards.length > 0) {
+    if (!noRes) {
+      const el = document.createElement('div');
+      el.id = 'chunks-filter-noresult';
+      el.className = 'empty';
+      el.style.cssText = 'padding:20px 0;font-size:13px';
+      el.textContent = 'No chunks match "' + q.slice(0, 40) + '"';
+      grid.appendChild(el);
+    } else {
+      noRes.textContent = 'No chunks match "' + q.slice(0, 40) + '"';
+    }
+  } else if (noRes) {
+    noRes.remove();
+  }
 }
 
 async function deleteChunk(id) {
@@ -9400,8 +10257,28 @@ async function loadAgentGraphTab() {
   const bar = document.getElementById('ag-summary-bar');
   if (bar) bar.innerHTML = '<div class="loading-txt">Loading…</div>';
   try {
-    const data = await apiFetch('/api/graph?dir=' + enc(DIR));
-    _agData = data;
+    const raw = await apiFetch('/api/graph?dir=' + enc(DIR));
+    // API returns { nodes, edges } — normalize into the shape renderers expect
+    const sesNodes = (raw.nodes || []).filter(n => n.type === 'session');
+    const agNodes  = (raw.nodes || []).filter(n => n.type === 'agenttype');
+    const sessions = sesNodes.map(n => ({
+      id:         n.id,
+      file:       n.id,
+      turns:      n.turns      || 0,
+      toolCount:  n.totalTools || 0,
+      spawnCount: Object.values(n.agentSpawns || {}).reduce((a, b) => a + b, 0),
+      cost:       n.cost       || 0,
+      agentTypes: n.agentSpawns || {},
+      tools:      n.toolCounts  || {},
+    }));
+    _agData = {
+      sessions,
+      sessionCount:   sessions.length,
+      agentTypes:     agNodes.length,
+      totalSpawns:    agNodes.reduce((a, n) => a + (n.totalSpawns || 0), 0),
+      totalToolCalls: sesNodes.reduce((a, n) => a + (n.totalTools || 0), 0),
+      totalCost:      sesNodes.reduce((a, n) => a + (n.cost       || 0), 0),
+    };
     _renderAgSummary();
     _renderAgSessList();
   } catch (e) {
@@ -9432,15 +10309,27 @@ function _renderAgSessList() {
   const el = document.getElementById('ag-sess-list');
   if (!_agData || !el) return;
   const sessions = _agData.sessions || [];
-  if (!sessions.length) { el.innerHTML = '<div class="empty" style="font-size:12px">No sessions</div>'; return; }
-  el.innerHTML = sessions.map((s, i) =>
-    '<div class="sess-row" style="margin-bottom:4px" onclick="selectAgSession(' + i + ')">' +
-      '<div class="sr-top">' +
-        '<div class="sr-prompt" style="font-size:11px">' + esc((s.id || s.file || '').slice(-16)) + '</div>' +
-      '</div>' +
-      '<div style="font-size:10px;color:var(--text-lo);margin-top:1px">' + (s.spawnCount || 0) + ' spawns · ' + (s.toolCount || 0) + ' tools</div>' +
-    '</div>'
-  ).join('');
+  if (!sessions.length) { el.innerHTML = '<div class="empty" style="font-size:12px">No sessions<div style="font-size:11px;color:var(--text-xs);margin-top:4px">Sessions are recorded when Claude Code runs inside this project.</div></div>'; return; }
+  el.innerHTML =
+    '<input class="filter-input" id="ag-sess-filter" type="text" placeholder="Filter sessions…" style="width:100%;margin-bottom:6px;font-size:11px;box-sizing:border-box" oninput="filterAgSessions(this.value)" title="Filter by session ID">' +
+    '<div id="ag-sess-rows">' +
+    sessions.map((s, i) =>
+      '<div class="sess-row" style="margin-bottom:4px" data-sid="' + esc(s.id || s.file || '') + '" onclick="selectAgSession(' + i + ')">' +
+        '<div class="sr-top">' +
+          '<div class="sr-prompt" style="font-size:11px" title="' + esc(s.id || s.file || '') + '">' + esc((s.id || s.file || '').slice(-16)) + '</div>' +
+        '</div>' +
+        '<div style="font-size:10px;color:var(--text-lo);margin-top:1px">' + (s.spawnCount || 0) + ' spawns · ' + (s.toolCount || 0) + ' tools</div>' +
+      '</div>'
+    ).join('') +
+    '</div>';
+}
+
+function filterAgSessions(q) {
+  const lq = (q || '').toLowerCase();
+  document.querySelectorAll('#ag-sess-rows .sess-row').forEach(el => {
+    const sid = (el.dataset.sid || '').toLowerCase();
+    el.style.display = (!lq || sid.includes(lq)) ? '' : 'none';
+  });
 }
 
 function selectAgSession(idx) {
@@ -9449,8 +10338,10 @@ function selectAgSession(idx) {
   document.querySelectorAll('#ag-sess-list .sess-row').forEach((el, i) => el.classList.toggle('active', i === idx));
   const detail = document.getElementById('ag-detail');
   if (!detail) return;
-  const agArr   = Object.entries(s.agentTypes || {}).sort((a, b) => b[1] - a[1]).slice(0, 12);
-  const toolArr = Object.entries(s.tools       || {}).sort((a, b) => b[1] - a[1]).slice(0, 15);
+  const agAllArr   = Object.entries(s.agentTypes || {}).sort((a, b) => b[1] - a[1]);
+  const toolAllArr = Object.entries(s.tools       || {}).sort((a, b) => b[1] - a[1]);
+  const agArr   = agAllArr.slice(0, 12);
+  const toolArr = toolAllArr.slice(0, 15);
   const maxAg   = agArr.length  ? Math.max(...agArr.map(x => x[1]))   : 1;
   const maxTool = toolArr.length ? Math.max(...toolArr.map(x => x[1])) : 1;
   detail.innerHTML =
@@ -9460,20 +10351,20 @@ function selectAgSession(idx) {
       '<span>Tools: <b>' + (s.toolCount || 0) + '</b></span>' +
       (s.cost != null ? '<span style="color:var(--accent)">$' + Number(s.cost).toFixed(4) + '</span>' : '') +
     '</div>' +
-    (agArr.length ? '<div class="m-group-title" style="margin-bottom:5px">Agent Types</div>' +
+    (agArr.length ? '<div class="m-group-title" style="margin-bottom:5px">Agent Types' + (agAllArr.length > 12 ? '<span style="font-size:10px;color:var(--text-xs);font-weight:400;margin-left:6px">top 12 of ' + agAllArr.length + '</span>' : '') + '</div>' +
       agArr.map(function(entry) {
         var type = entry[0], count = entry[1];
         return '<div style="display:flex;align-items:center;gap:8px;padding:3px 0;font-size:12px">' +
-          '<div style="width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-hi)">' + esc(type) + '</div>' +
+          '<div style="width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-hi)" title="' + esc(type) + '">' + esc(type) + '</div>' +
           '<div style="flex:1;height:7px;background:var(--border);border-radius:2px;overflow:hidden"><div style="width:' + Math.round(count/maxAg*100) + '%;height:100%;background:var(--accent);border-radius:2px"></div></div>' +
           '<div style="width:22px;text-align:right;color:var(--text-lo);font-size:11px;font-family:var(--mono)">' + count + '</div>' +
         '</div>';
       }).join('') : '') +
-    (toolArr.length ? '<div class="m-group-title" style="margin-bottom:5px;margin-top:14px">Top Tools</div>' +
+    (toolArr.length ? '<div class="m-group-title" style="margin-bottom:5px;margin-top:14px">Top Tools' + (toolAllArr.length > 15 ? '<span style="font-size:10px;color:var(--text-xs);font-weight:400;margin-left:6px">top 15 of ' + toolAllArr.length + '</span>' : '') + '</div>' +
       toolArr.map(function(entry) {
         var tool = entry[0], count = entry[1];
         return '<div style="display:flex;align-items:center;gap:8px;padding:3px 0;font-size:12px">' +
-          '<div style="width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-hi);font-family:var(--mono);font-size:11px">' + esc(tool) + '</div>' +
+          '<div style="width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-hi);font-family:var(--mono);font-size:11px" title="' + esc(tool) + '">' + esc(tool) + '</div>' +
           '<div style="flex:1;height:7px;background:var(--border);border-radius:2px;overflow:hidden"><div style="width:' + Math.round(count/maxTool*100) + '%;height:100%;background:oklch(62% 0.12 195);border-radius:2px"></div></div>' +
           '<div style="width:22px;text-align:right;color:var(--text-lo);font-size:11px;font-family:var(--mono)">' + count + '</div>' +
         '</div>';
@@ -9537,7 +10428,7 @@ function mmSwitchTab(tab) {
   const body = document.getElementById('mm-body');
   if (!body) return;
   if (tab === 'orgs')           mmRenderOrgs(body);
-  else if (tab === 'skills')    mmRenderSkills(body);
+  else if (tab === 'skills')    { mmRenderSkills(body); setTimeout(() => document.getElementById('mm-skill-filter-input')?.focus(), 50); }
   else if (tab === 'loops')     mmRenderLoops(body);
   else if (tab === 'createorg') mmRenderCreateOrg(body);
   else if (tab === 'metrics')   mmRenderMetrics(body);
@@ -9551,7 +10442,7 @@ function mmRenderOrgs(body) {
     const running = o.running;
     return `<div class="mm-skill-item" onclick="closeMastermind();v2SelectOrg(${JSON.stringify(o.name)});switchView('orgs')">
       <span class="mm-skill-name">${esc(o.name)}</span>
-      <span class="mm-skill-desc">${esc((o.goal || '').slice(0, 60))} ${running ? '⬤ LIVE' : ''}</span>
+      <span class="mm-skill-desc" title="${esc(o.goal || '')}">${esc((o.goal || '').slice(0, 60))}${(o.goal || '').length > 60 ? '…' : ''} ${running ? '⬤ LIVE' : ''}</span>
     </div>`;
   }).join('');
 }
@@ -9560,8 +10451,8 @@ let _mmSkillFilter = '';
 function mmRenderSkills(body) {
   const q = _mmSkillFilter.toLowerCase();
   const filtered = q ? _MM_SKILLS_CATALOG.filter(s => s.name.toLowerCase().includes(q) || s.desc.toLowerCase().includes(q)) : _MM_SKILLS_CATALOG;
-  body.innerHTML = `<div class="filter-bar" style="margin-bottom:12px"><input class="filter-input" type="text" placeholder="Search skills…" value="${esc(_mmSkillFilter)}" oninput="_mmSkillFilter=this.value;mmRenderSkills(document.getElementById('mm-body'))"></div>` +
-    filtered.map(s => `<div class="mm-skill-item" onclick="navigator.clipboard.writeText(${JSON.stringify(s.name)}).then(()=>showToast('Copied',${JSON.stringify(s.name)},'ok'))">
+  body.innerHTML = `<div class="filter-bar" style="margin-bottom:12px"><input class="filter-input" id="mm-skill-filter-input" type="text" placeholder="Search skills…" value="${esc(_mmSkillFilter)}" oninput="_mmSkillFilter=this.value;mmRenderSkills(document.getElementById('mm-body'))"></div>` +
+    filtered.map(s => `<div class="mm-skill-item" title="Click to copy: /${esc(s.name)}" onclick="navigator.clipboard.writeText(${JSON.stringify(s.name)}).then(()=>showToast('Copied',${JSON.stringify(s.name)},'ok'))">
       <span class="mm-skill-name">${esc(s.name)}</span>
       <span class="mm-skill-desc">${esc(s.desc)}</span>
     </div>`).join('');
@@ -9573,19 +10464,66 @@ async function mmRenderLoops(body) {
     const data = await apiFetch('/api/loops?dir=' + enc(DIR));
     const loops = Array.isArray(data) ? data : (data.loops || []);
     if (!loops.length) { body.innerHTML = '<div class="empty">No active loops. Use /mastermind:autodev --tillend to start one.</div>'; return; }
-    body.innerHTML = loops.map(l => {
-      const running = l.status !== 'stopped' && l.status !== 'paused';
-      const name = (l.name || l.prompt || 'loop').split('--')[0].trim().slice(0, 60);
-      const nextAt = l.nextRunAt ? parseInt(l.nextRunAt) : 0;
-      const ms = nextAt ? nextAt - Date.now() : 0;
-      const cdown = ms > 0 ? (Math.floor(ms/60000) + 'm ' + Math.floor((ms%60000)/1000) + 's') : (running ? 'running' : 'stopped');
+    const mmHasRepeat = loops.some(l => l.source === '_repeat.md');
+    const mmRepeatPrompts = new Set(loops.filter(l => l.source === '_repeat.md').map(l => (l.prompt || '').trim()));
+    const mmDeduped = loops.filter(l => {
+      if (l.source === 'scheduled_tasks_lock' && mmHasRepeat) return false;
+      if (l.source !== 'schedule_wakeup_hook') return true;
+      const m = (l.prompt || '').match(/--loop\s+\S+\s+(.+)$/s);
+      return !m || !mmRepeatPrompts.has(m[1].trim());
+    });
+    const _mmLoopsRefresh = '<div style="display:flex;justify-content:flex-end;margin-bottom:8px"><button class="btn" title="Refresh loop status" style="font-size:10px" onclick="mmRenderLoops(document.getElementById(\'mm-body\'))">↺ Refresh</button></div>';
+    body.innerHTML = _mmLoopsRefresh + mmDeduped.map(l => {
+      const isHilMm   = l.status === 'hil:pending';
+      const isTillendMm = l.type === 'tillend';
+      const curRep    = l.currentRep || 0;
+      const maxReps   = l.maxReps || 0;
+      const nextAt    = l.nextRunAt ? parseInt(l.nextRunAt) : 0;
+      const isExplicitlyActiveMm = l.status === 'running' || l.status === 'waiting' || l.status === 'active';
+      const _STALE = 2 * 60 * 60 * 1000;
+      const isOverdueMm = !l.status?.startsWith('hil') && !isExplicitlyActiveMm &&
+        nextAt > 0 && nextAt <= Date.now();
+      const isStaledActiveMm = isExplicitlyActiveMm && nextAt > 0 && (Date.now() - nextAt) > _STALE;
+      const isFinishedMm = isOverdueMm || isStaledActiveMm ||
+        (!isExplicitlyActiveMm && maxReps > 0 && curRep >= maxReps) ||
+        l.status === 'finished' || l.status === 'done' ||
+        l.status === 'complete' || l.status === 'completed' || l.status === 'expired';
+      const running   = !isFinishedMm && l.status !== 'stopped' && l.status !== 'paused';
+      const _mmLp = (function(_l) {
+        if (_l.command) return { userPrompt: _l.prompt || '', command: _l.command };
+        const full = _l.prompt || '';
+        const cmdM = full.match(/^(\/\S+)/);
+        if (!cmdM) return { userPrompt: full, command: '' };
+        const tokens = full.slice(cmdM[1].length).trim().split(/\s+/);
+        let ti = 0;
+        while (ti < tokens.length && tokens[ti] && tokens[ti].startsWith('--')) {
+          ti++;
+          if (ti < tokens.length && tokens[ti] && !tokens[ti].startsWith('--')) ti++;
+        }
+        return { userPrompt: tokens.slice(ti).join(' '), command: cmdM[1] };
+      })(l);
+      const name      = (l.name || _mmLp.userPrompt || _mmLp.command || 'loop').slice(0, 60);
+      const ms        = nextAt ? nextAt - Date.now() : 0;
+      const cdown     = ms > 0 ? (Math.floor(ms/60000) + 'm ' + Math.floor((ms%60000)/1000) + 's') : '';
+      const intervalMm = fmtInterval(l.interval || l.schedule);
+      const runCount  = isTillendMm
+        ? `run ${curRep} / ∞${maxReps ? ' (cap: ' + maxReps + ')' : ''}`
+        : (maxReps > 0 ? `run ${curRep} / ${maxReps}` : (curRep ? `run ${curRep}` : ''));
+      const statusLabel = isHilMm ? '⚠ HIL' : (running ? 'active' : (isFinishedMm ? 'done' : 'stopped'));
+      const statusColor = isHilMm ? 'oklch(75% 0.16 60)' : '';
+      const typeIco = isTillendMm ? '∞ ' : '↺ ';
+      const _sMs = l.startedAt ? (typeof l.startedAt === 'number' ? l.startedAt : new Date(l.startedAt).getTime()) : 0;
+      const ageMs = _sMs > 0 && _sMs < Date.now() ? Date.now() - _sMs : 0;
+      const ageStr = ageMs > 0 ? fmtDur(ageMs) : '';
+      const metaParts = [intervalMm, ageStr ? 'running ' + ageStr : '', cdown ? 'next in ' + cdown : '', runCount].filter(Boolean).join(' · ');
       return `<div style="padding:10px 0;border-bottom:1px solid var(--border)">
         <div style="display:flex;align-items:center;gap:8px">
-          <span style="font-size:13px;color:var(--text-hi);flex:1">${esc(name)}</span>
-          <span class="ss-pill ${running ? 'on' : ''}">${running ? 'active' : 'stopped'}</span>
-          ${running ? `<button class="btn" style="font-size:10px;color:var(--red);border-color:var(--red)" onclick="stopLoop(event,${JSON.stringify(l.id||l.name||'')});mmSwitchTab('loops')">■ Stop</button>` : ''}
+          <span style="font-size:13px;color:var(--text-hi);flex:1">${typeIco}${esc(name)}</span>
+          <span class="ss-pill ${running && !isHilMm ? 'on' : ''}" style="${statusColor ? 'color:'+statusColor+';background:oklch(65% 0.15 60 / 0.15);border:none' : ''}">${statusLabel}</span>
+          ${running ? `<button class="btn" title="Stop this automation loop" style="font-size:10px;color:var(--red);border-color:var(--red)" onclick="stopLoop(event,${JSON.stringify(l.id||l.name||'')});mmSwitchTab('loops')">■ Stop</button>` : ''}
         </div>
-        <div style="font-size:11px;color:var(--text-lo);margin-top:4px;font-family:var(--mono)">${esc(l.interval||l.schedule||'')} ${cdown ? '· ' + cdown : ''} ${l.currentRep != null ? '· run ' + l.currentRep : ''}</div>
+        <div style="font-size:11px;color:var(--text-lo);margin-top:4px;font-family:var(--mono)">${esc(metaParts)}</div>
+        ${isHilMm ? `<div style="font-size:10px;color:oklch(75% 0.16 60);margin-top:4px">⚠ Waiting for human response — check HIL file to resume</div>` : ''}
       </div>`;
     }).join('');
   } catch (e) { body.innerHTML = '<div class="empty">Failed: ' + esc(e.message) + '</div>'; }
@@ -9599,17 +10537,17 @@ function mmRenderCreateOrg(body) {
       <div><div class="le-lbl">Org Name</div><input id="mco-name" class="filter-input" placeholder="my-team"></div>
       <div><div class="le-lbl">Goal</div><input id="mco-goal" class="filter-input" placeholder="Build and ship features autonomously"></div>
       <div><div class="le-lbl">Topology</div>
-        <select id="mco-topo" class="filter-input" style="cursor:pointer">
+        <select id="mco-topo" class="filter-input" title="Agent coordination topology" style="cursor:pointer">
           ${topos.map(t => `<option>${t}</option>`).join('')}
         </select>
       </div>
       <div><div class="le-lbl">Adapter</div>
-        <select id="mco-adapter" class="filter-input" style="cursor:pointer">
+        <select id="mco-adapter" class="filter-input" title="Agent communication adapter" style="cursor:pointer">
           ${adapters.map(a => `<option>${a}</option>`).join('')}
         </select>
       </div>
-      <div><div class="le-lbl">Max Agents</div><input id="mco-agents" class="filter-input" type="number" value="8" min="1" max="50"></div>
-      <button class="btn" style="width:fit-content;color:oklch(65% 0.16 295);border-color:oklch(65% 0.16 295)" onclick="mmGenerateOrgCmd()">Generate CLI Command</button>
+      <div><div class="le-lbl">Max Agents</div><input id="mco-agents" class="filter-input" type="number" value="8" min="1" max="50" title="Maximum concurrent agents (1–50)"></div>
+      <button class="btn" title="Generate a monomind CLI command to create this org" style="width:fit-content;color:oklch(65% 0.16 295);border-color:oklch(65% 0.16 295)" onclick="mmGenerateOrgCmd()">Generate CLI Command</button>
       <div id="mco-cmd-out" style="display:none;font-family:var(--mono);font-size:12px;background:var(--bg);border:1px solid var(--border);border-radius:6px;padding:10px;word-break:break-all;cursor:pointer;color:var(--text-hi)" title="Click to copy" onclick="navigator.clipboard.writeText(this.textContent).then(()=>showToast('Copied','','ok'))"></div>
     </div>`;
 }
@@ -9653,6 +10591,7 @@ async function mmRenderMetrics(body) {
       </div>
       <div class="m-group-title" style="margin-bottom:8px">Swarm</div>
       <div style="display:flex;justify-content:space-between;padding:4px 0;font-size:12px;border-bottom:1px solid var(--border)"><span style="color:var(--text-hi)">Topology</span><span style="color:${swarmTopo !== 'IDLE' ? 'var(--green)' : 'var(--text-lo)'};font-family:var(--mono)">${esc(swarmTopo)}</span></div>
+      <div style="margin-top:12px;display:flex;justify-content:flex-end"><button class="btn" title="Refresh metrics" style="font-size:10px" onclick="mmRenderMetrics(document.getElementById('mm-body'))">↺ Refresh</button></div>
     `;
   } catch (e) { body.innerHTML = '<div class="empty">Failed: ' + esc(e.message) + '</div>'; }
 }
@@ -9678,13 +10617,13 @@ async function mmRenderGraph(body) {
         <div class="chunk-stat"><div class="chunk-stat-val">${Object.keys(nodeTypes).length}</div><div class="chunk-stat-lbl">Types</div></div>
       </div>
       ${topNodes.length ? `<div class="m-group-title" style="margin-bottom:6px">God Nodes</div>
-      ${topNodes.map(n => `<div style="display:flex;justify-content:space-between;padding:4px 0;font-size:12px;border-bottom:1px solid var(--border)">
+      ${topNodes.map(n => `<div style="display:flex;justify-content:space-between;padding:4px 0;font-size:12px;border-bottom:1px solid var(--border);cursor:pointer" data-nid="${esc(n.id || n.name || '')}" title="Open '${esc(n.name || n.id || '')}' in Monograph wiki (degree: ${n.degree ?? '—'})" onclick="var _nid=this.dataset.nid;closeMastermind();switchView('monograph');setTimeout(function(){mgWikiJumpToNode(_nid)},300)" onmouseenter="this.style.background='var(--hover)'" onmouseleave="this.style.background=''">
         <span style="color:var(--text-hi);font-family:var(--mono);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:70%">${esc(n.name || n.id || '—')}</span>
-        <span style="color:var(--text-lo);font-family:var(--mono);font-size:11px">${n.degree ?? '—'}</span>
+        <span style="color:var(--text-lo);font-family:var(--mono);font-size:11px">${n.degree ?? '—'} ↗</span>
       </div>`).join('')}` : ''}
       <div style="margin-top:14px;display:flex;gap:8px;flex-wrap:wrap">
-        <button class="btn" onclick="switchView('monograph');closeMastermind()">Open Monograph →</button>
-        <button class="btn" onclick="fetch('/api/monograph-build?dir='+enc(DIR),{method:'POST'}).then(()=>showToast('Building','Graph rebuild started','ok'))">↺ Rebuild Graph</button>
+        <button class="btn" title="Switch to the Monograph view" onclick="switchView('monograph');closeMastermind()">Open Monograph →</button>
+        <button class="btn" title="Trigger a full knowledge graph rebuild" onclick="fetch('/api/monograph-build?dir='+enc(DIR),{method:'POST'}).then(()=>showToast('Building','Graph rebuild started','ok'))">↺ Rebuild Graph</button>
       </div>
     `;
   } catch (e) { body.innerHTML = '<div class="empty">Failed: ' + esc(e.message) + '</div>'; }