Merge pull request '[Mnemosyne] Memory filter panel — toggle categories by region' (#1213) from feat/mnemosyne-memory-filter into main

Merged PR #1213: [Mnemosyne] Memory filter panel — toggle categories by region

app.js

@@ -46,6 +46,7 @@ let debugOverlay;
 let frameCount = 0, lastFPSTime = 0, fps = 0;
 let chatOpen = true;
 let memoryFeedEntries = [];  // Mnemosyne: recent memory events for feed panel
+let _memoryFilterOpen = false;  // Mnemosyne: filter panel state
 let loadProgress = 0;
 let performanceTier = 'high';
 
@@ -707,6 +708,7 @@ async function init() {
   createWorkshopTerminal();
   createAshStorm();
   SpatialMemory.init(scene);
+  SpatialMemory.setCamera(camera);
   updateLoad(90);
 
   loadSession();
@@ -717,11 +719,6 @@ async function init() {
     MemoryOptimizer.optimize(SpatialMemory);
   }, 1000 * 60 * 10); // Every 10 minutes
 
-  
-// Wire memory search input
-const searchInput = document.getElementById('memory-search-input');
-if (searchInput) searchInput.addEventListener('input', onMemorySearchInput);
-
   fetchGiteaData();
   setInterval(fetchGiteaData, 30000); // Refresh every 30s
 
@@ -1874,6 +1871,8 @@ function setupControls() {
       if (portalOverlayActive) closePortalOverlay();
       if (visionOverlayActive) closeVisionOverlay();
       if (atlasOverlayActive) closePortalAtlas();
+      if (_archiveDashboardOpen) toggleArchiveHealthDashboard();
+      if (_memoryFilterOpen) closeMemoryFilter();
     }
     if (e.key.toLowerCase() === 'v' && document.activeElement !== document.getElementById('chat-input')) {
       cycleNavMode();
@@ -1884,6 +1883,12 @@ function setupControls() {
     if (e.key.toLowerCase() === 'e' && activeVisionPoint && !visionOverlayActive) {
       activateVisionPoint(activeVisionPoint);
     }
+    if (e.key.toLowerCase() === 'h' && document.activeElement !== document.getElementById('chat-input')) {
+      toggleArchiveHealthDashboard();
+    }
+    if (e.key.toLowerCase() === 'g' && document.activeElement !== document.getElementById('chat-input')) {
+      toggleMemoryFilter();
+    }
   });
   document.addEventListener('keyup', (e) => {
     keys[e.key.toLowerCase()] = false;
@@ -2127,104 +2132,6 @@ function handleHermesMessage(data) {
 
 
 // ═══════════════════════════════════════════
-
-// ═══ MNEMOSYNE — MEMORY SEARCH (#1208) ═══
-let memorySearchVisible = false;
-let memorySearchDebounce = null;
-
-function toggleMemorySearch() {
-  const panel = document.getElementById('memory-search-panel');
-  const input = document.getElementById('memory-search-input');
-  if (!panel) return;
-
-  memorySearchVisible = !memorySearchVisible;
-  panel.style.display = memorySearchVisible ? 'block' : 'none';
-
-  if (memorySearchVisible && input) {
-    input.value = '';
-    input.focus();
-    renderMemorySearchResults([]);
-  }
-}
-
-function renderMemorySearchResults(results) {
-  const container = document.getElementById('memory-search-results');
-  if (!container) return;
-
-  if (results.length === 0) {
-    container.innerHTML = '<div class="memory-search-empty">' +
-      (document.getElementById('memory-search-input')?.value ? 'No memories found' : 'Type to search your archive...') +
-      '</div>';
-    return;
-  }
-
-  container.innerHTML = results.map(r => {
-    const regionDef = SpatialMemory.REGIONS[r.category] || SpatialMemory.REGIONS.working;
-    const dotColor = '#' + regionDef.color.toString(16).padStart(6, '0');
-    const truncated = r.content.length > 55 ? r.content.slice(0, 55) + '\u2026' : r.content;
-    return '<div class="memory-search-result" onclick="flyToMemory(\'' + r.id + '\')">' +
-      '<div class="memory-search-dot" style="background:' + dotColor + '"></div>' +
-      '<span class="memory-search-text">' + truncated + '</span>' +
-      '<span class="memory-search-meta">' + r.category + '</span>' +
-      '</div>';
-  }).join('');
-}
-
-function onMemorySearchInput(e) {
-  const query = e.target.value;
-  if (memorySearchDebounce) clearTimeout(memorySearchDebounce);
-
-  memorySearchDebounce = setTimeout(() => {
-    if (!query || query.trim().length === 0) {
-      renderMemorySearchResults([]);
-      return;
-    }
-    const results = SpatialMemory.searchByContent(query, { maxResults: 15 });
-    renderMemorySearchResults(results);
-  }, 150);
-}
-
-function flyToMemory(memId) {
-  const memories = SpatialMemory.getAllMemories();
-  const mem = memories.find(m => m.id === memId);
-  if (!mem) return;
-
-  // Highlight the crystal
-  SpatialMemory.highlightMemory(memId);
-
-  // Fly camera to memory position (if camera controls exist)
-  if (typeof camera !== 'undefined' && camera.position) {
-    const target = new THREE.Vector3(mem.position[0], mem.position[1] + 3, mem.position[2] + 5);
-    // Simple lerp animation
-    const start = camera.position.clone();
-    let t = 0;
-    const flyAnim = () => {
-      t += 0.03;
-      if (t > 1) t = 1;
-      camera.position.lerpVectors(start, target, t);
-      if (t < 1) requestAnimationFrame(flyAnim);
-    };
-    flyAnim();
-  }
-
-  // Close search panel
-  if (memorySearchVisible) toggleMemorySearch();
-
-  // Show in memory feed
-  addMemoryFeedEntry('update', { content: 'Navigated to: ' + (mem.content || mem.id).slice(0, 40), id: memId });
-}
-
-// Keyboard shortcut: Ctrl+K or / to toggle search
-document.addEventListener('keydown', (e) => {
-  if ((e.ctrlKey && e.key === 'k') || (e.key === '/' && !e.target.matches('input, textarea'))) {
-    e.preventDefault();
-    toggleMemorySearch();
-  }
-  if (e.key === 'Escape' && memorySearchVisible) {
-    toggleMemorySearch();
-  }
-});
-
 //  MNEMOSYNE — LIVE MEMORY BRIDGE
 // ═══════════════════════════════════════════
 
@@ -2268,6 +2175,7 @@ function handleMemoryMessage(data) {
   } else {
     console.warn('[Mnemosyne] Unknown memory action:', action);
   }
+  if (_archiveDashboardOpen) updateArchiveHealthDashboard();
 }
 
 /**
@@ -2328,6 +2236,162 @@ function renderMemoryFeed() {
 }
 
 
+// ── Archive Health Dashboard (issue #1210) ────────────────────────────
+
+let _archiveDashboardOpen = false;
+
+/**
+ * Toggle the archive health dashboard panel (hotkey H).
+ */
+function toggleArchiveHealthDashboard() {
+  _archiveDashboardOpen = !_archiveDashboardOpen;
+  const panel = document.getElementById('archive-health-dashboard');
+  if (!panel) return;
+  if (_archiveDashboardOpen) {
+    updateArchiveHealthDashboard();
+    panel.style.display = 'block';
+  } else {
+    panel.style.display = 'none';
+  }
+}
+
+/**
+ * Render current archive statistics into the dashboard panel.
+ * Reads live from SpatialMemory.getAllMemories() — no backend needed.
+ */
+function toggleMemoryFilter() {
+  _memoryFilterOpen = !_memoryFilterOpen;
+  if (_memoryFilterOpen) {
+    openMemoryFilter();
+  } else {
+    closeMemoryFilter();
+  }
+}
+
+function updateArchiveHealthDashboard() {
+  const container = document.getElementById('archive-health-content');
+  if (!container) return;
+
+  const memories = SpatialMemory.getAllMemories();
+  const regions = SpatialMemory.REGIONS;
+  const total = memories.length;
+
+  // ── Category breakdown ────────────────────────────────────────────
+  const catCounts = {};
+  memories.forEach(m => {
+    const cat = m.category || 'working';
+    catCounts[cat] = (catCounts[cat] || 0) + 1;
+  });
+
+  // ── Trust distribution (using strength field as trust score) ──────
+  let trustHigh = 0, trustMid = 0, trustLow = 0;
+  memories.forEach(m => {
+    const t = m.strength != null ? m.strength : 0.7;
+    if (t > 0.8) trustHigh++;
+    else if (t >= 0.5) trustMid++;
+    else trustLow++;
+  });
+
+  // ── Timestamps ────────────────────────────────────────────────────
+  let newestMs = null, oldestMs = null;
+  memories.forEach(m => {
+    const ts = m.timestamp ? new Date(m.timestamp).getTime() : null;
+    if (ts && !isNaN(ts)) {
+      if (newestMs === null || ts > newestMs) newestMs = ts;
+      if (oldestMs === null || ts < oldestMs) oldestMs = ts;
+    }
+  });
+  const fmtDate = ms => ms ? new Date(ms).toLocaleString(undefined, { month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit' }) : '—';
+
+  // ── Entity connection count ───────────────────────────────────────
+  let entityConnCount = 0;
+  memories.forEach(m => {
+    if (m.connections && Array.isArray(m.connections)) {
+      entityConnCount += m.connections.length;
+    }
+  });
+  // Each connection is stored on both ends, divide by 2 for unique links
+  const uniqueLinks = Math.floor(entityConnCount / 2);
+
+  // ── Build HTML ────────────────────────────────────────────────────
+  let html = '';
+
+  // Total count
+  html += `<div>
+    <div class="ah-section-label">Total Memories</div>
+    <div class="ah-total">
+      <span class="ah-total-count">${total}</span>
+      <span class="ah-total-label">crystals in archive</span>
+    </div>
+  </div>`;
+
+  // Category breakdown
+  const sortedCats = Object.entries(catCounts).sort((a, b) => b[1] - a[1]);
+  if (sortedCats.length > 0) {
+    html += `<div><div class="ah-section-label">Categories</div>`;
+    sortedCats.forEach(([cat, count]) => {
+      const region = regions[cat] || regions.working;
+      const color = '#' + region.color.toString(16).padStart(6, '0');
+      const pct = total > 0 ? Math.round((count / total) * 100) : 0;
+      html += `<div class="ah-category-row">
+        <span class="ah-cat-dot" style="background:${color}"></span>
+        <span class="ah-cat-label">${region.label || cat}</span>
+        <div class="ah-cat-bar-wrap">
+          <div class="ah-cat-bar" style="width:${pct}%;background:${color}"></div>
+        </div>
+        <span class="ah-cat-count">${count}</span>
+      </div>`;
+    });
+    html += `</div>`;
+  }
+
+  // Trust distribution
+  html += `<div>
+    <div class="ah-section-label">Trust Distribution</div>
+    <div class="ah-trust-row">
+      <div class="ah-trust-band ah-trust-high">
+        <div class="ah-trust-band-count">${trustHigh}</div>
+        <div class="ah-trust-band-label">High &gt;0.8</div>
+      </div>
+      <div class="ah-trust-band ah-trust-mid">
+        <div class="ah-trust-band-count">${trustMid}</div>
+        <div class="ah-trust-band-label">Mid 0.5–0.8</div>
+      </div>
+      <div class="ah-trust-band ah-trust-low">
+        <div class="ah-trust-band-count">${trustLow}</div>
+        <div class="ah-trust-band-label">Low &lt;0.5</div>
+      </div>
+    </div>
+  </div>`;
+
+  // Timestamps
+  html += `<div>
+    <div class="ah-section-label">Timeline</div>
+    <div class="ah-timestamps">
+      <div class="ah-ts-row">
+        <span class="ah-ts-label">Newest</span>
+        <span class="ah-ts-value">${fmtDate(newestMs)}</span>
+      </div>
+      <div class="ah-ts-row">
+        <span class="ah-ts-label">Oldest</span>
+        <span class="ah-ts-value">${fmtDate(oldestMs)}</span>
+      </div>
+    </div>
+  </div>`;
+
+  // Entity connections
+  html += `<div>
+    <div class="ah-section-label">Entity Connections</div>
+    <span class="ah-entity-count">${uniqueLinks}</span>
+    <span class="ah-entity-label">unique links</span>
+  </div>`;
+
+  // Hotkey hint
+  html += `<div class="ah-hotkey-hint">PRESS H TO CLOSE</div>`;
+
+  container.innerHTML = html;
+}
+
 function updateWsHudStatus(connected) {
   // Update MemPalace status alongside regular WS status
   updateMemPalaceStatus();
@@ -3333,11 +3397,6 @@ init().then(() => {
   ];
   demoMemories.forEach(m => SpatialMemory.placeMemory(m));
 
-  
-// Wire memory search input
-const searchInput = document.getElementById('memory-search-input');
-if (searchInput) searchInput.addEventListener('input', onMemorySearchInput);
-
   fetchGiteaData();
   setInterval(fetchGiteaData, 30000);
   runWeeklyAudit();

index.html

@@ -159,7 +159,8 @@
     <span>WASD</span> move &nbsp; <span>Mouse</span> look &nbsp; <span>Enter</span> chat &nbsp;
     <span>V</span> mode: <span id="nav-mode-label">WALK</span>
     <span id="nav-mode-hint" class="nav-mode-hint"></span>
-    &nbsp; <span class="ws-hud-status">HERMES: <span id="ws-status-dot" class="chat-status-dot"></span></span>
+    &nbsp; <span>H</span> archive &nbsp;
+    <span class="ws-hud-status">HERMES: <span id="ws-status-dot" class="chat-status-dot"></span></span>
   </div>
 
   <!-- Portal Hint -->
@@ -440,25 +441,83 @@ index.html
 })();
 </script>
 
-  <!-- Memory Activity Feed (Mnemosyne) -->
-  
-    <!-- Mnemosyne Memory Search Panel (#1208) -->
-    <div id="memory-search-panel" style="display:none;">
-      <div class="memory-search-header">
-        <span class="memory-search-icon">🔍</span>
-        <input type="text" id="memory-search-input" placeholder="Search archive..." autocomplete="off" spellcheck="false" />
-        <span class="memory-search-close" onclick="toggleMemorySearch()">✕</span>
-      </div>
-      <div id="memory-search-results"></div>
+  <!-- Archive Health Dashboard (Mnemosyne, issue #1210) -->
+  <div id="archive-health-dashboard" class="archive-health-dashboard" style="display:none;" aria-label="Archive Health Dashboard">
+    <div class="archive-health-header">
+      <span class="archive-health-title">◈ ARCHIVE HEALTH</span>
+      <button class="archive-health-close" onclick="toggleArchiveHealthDashboard()" aria-label="Close dashboard">✕</button>
     </div>
+    <div id="archive-health-content" class="archive-health-content"></div>
+  </div>
 
-    <div id="memory-feed" class="memory-feed" style="display:none;">
+  <!-- Memory Activity Feed (Mnemosyne) -->
+  <div id="memory-feed" class="memory-feed" style="display:none;">
     <div class="memory-feed-header">
       <span class="memory-feed-title">✨ Memory Feed</span>
       <div class="memory-feed-actions"><button class="memory-feed-clear" onclick="clearMemoryFeed()">Clear</button><button class="memory-feed-toggle" onclick="document.getElementById('memory-feed').style.display='none'">✕</button></div>
     </div>
     <div id="memory-feed-list" class="memory-feed-list"></div>
+  <!-- ═══ MNEMOSYNE MEMORY FILTER ═══ -->
+  <div id="memory-filter" class="memory-filter" style="display:none;">
+    <div class="filter-header">
+      <span class="filter-title">⬡ Memory Filter</span>
+      <button class="filter-close" onclick="closeMemoryFilter()">✕</button>
+    </div>
+    <div class="filter-controls">
+      <button class="filter-btn" onclick="setAllFilters(true)">Show All</button>
+      <button class="filter-btn" onclick="setAllFilters(false)">Hide All</button>
+    </div>
+    <div class="filter-list" id="filter-list"></div>
   </div>
 
+
+  </div>
+
+
+<script>
+// ─── MNEMOSYNE: Memory Filter Panel ───────────────────
+function openMemoryFilter() {
+  renderFilterList();
+  document.getElementById('memory-filter').style.display = 'flex';
+}
+function closeMemoryFilter() {
+  document.getElementById('memory-filter').style.display = 'none';
+}
+function renderFilterList() {
+  const counts = SpatialMemory.getMemoryCountByRegion();
+  const regions = SpatialMemory.REGIONS;
+  const list = document.getElementById('filter-list');
+  list.innerHTML = '';
+  for (const [key, region] of Object.entries(regions)) {
+    const count = counts[key] || 0;
+    const visible = SpatialMemory.isRegionVisible(key);
+    const colorHex = '#' + region.color.toString(16).padStart(6, '0');
+    const item = document.createElement('div');
+    item.className = 'filter-item';
+    item.innerHTML = `
+      <div class="filter-item-left">
+        <span class="filter-dot" style="background:${colorHex}"></span>
+        <span class="filter-label">${region.glyph} ${region.label}</span>
+      </div>
+      <div class="filter-item-right">
+        <span class="filter-count">${count}</span>
+        <label class="filter-toggle">
+          <input type="checkbox" ${visible ? 'checked' : ''} 
+                 onchange="toggleRegion('${key}', this.checked)">
+          <span class="filter-slider"></span>
+        </label>
+      </div>
+    `;
+    list.appendChild(item);
+  }
+}
+function toggleRegion(category, visible) {
+  SpatialMemory.setRegionVisibility(category, visible);
+}
+function setAllFilters(visible) {
+  SpatialMemory.setAllRegionsVisible(visible);
+  renderFilterList();
+}
+</script>
 </body>
 </html>

nexus/components/spatial-memory.js

@@ -1,4 +1,41 @@
-// ═══════════════════════════════════════════
+// ═══
+  // ─── REGION VISIBILITY (Memory Filter) ──────────────
+  let _regionVisibility = {};  // category -> boolean (undefined = visible)
+  
+  setRegionVisibility(category, visible) {
+    _regionVisibility[category] = visible;
+    for (const obj of Object.values(_memoryObjects)) {
+      if (obj.data.category === category && obj.mesh) {
+        obj.mesh.visible = visible !== false;
+      }
+    }
+  },
+
+  setAllRegionsVisible(visible) {
+    const cats = Object.keys(REGIONS);
+    for (const cat of cats) {
+      _regionVisibility[cat] = visible;
+      for (const obj of Object.values(_memoryObjects)) {
+        if (obj.data.category === cat && obj.mesh) {
+          obj.mesh.visible = visible;
+        }
+      }
+    }
+  },
+
+  getMemoryCountByRegion() {
+    const counts = {};
+    for (const obj of Object.values(_memoryObjects)) {
+      const cat = obj.data.category || 'working';
+      counts[cat] = (counts[cat] || 0) + 1;
+    }
+    return counts;
+  },
+
+  isRegionVisible(category) {
+    return _regionVisibility[category] !== false;
+  },
+════════════════════════════════════════
 //  PROJECT MNEMOSYNE — SPATIAL MEMORY SCHEMA
 // ═══════════════════════════════════════════
 //
@@ -285,70 +322,6 @@ const SpatialMemory = (() => {
     });
   }
 
-
-  // ─── CONTENT SEARCH (Mnemosyne #1208) ──────────────────
-  /**
-   * Search memories by text content. Case-insensitive substring match.
-   * @param {string} query - Search query
-   * @param {object} options - { category: string, maxResults: number, minStrength: number }
-   * @returns {Array} Matching memories sorted by relevance (strength desc, then match position)
-   */
-  function searchByContent(query, options) {
-    options = options || {};
-    const maxResults = options.maxResults || 20;
-    const minStrength = options.minStrength || 0;
-    const categoryFilter = options.category || null;
-
-    if (!query || query.trim().length === 0) return [];
-
-    const lowerQuery = query.toLowerCase().trim();
-    const terms = lowerQuery.split(/\s+/);
-    const results = [];
-
-    Object.values(_memoryObjects).forEach(obj => {
-      const data = obj.data;
-      if (!data.content) return;
-
-      // Category filter
-      if (categoryFilter && obj.region !== categoryFilter) return;
-
-      // Strength filter
-      const strength = obj.mesh.userData.strength || 0.7;
-      if (strength < minStrength) return;
-
-      const lowerContent = data.content.toLowerCase();
-
-      // Score: count how many terms match, weight by first-match position
-      let matchCount = 0;
-      let firstMatchPos = Infinity;
-      terms.forEach(term => {
-        const pos = lowerContent.indexOf(term);
-        if (pos !== -1) {
-          matchCount++;
-          if (pos < firstMatchPos) firstMatchPos = pos;
-        }
-      });
-
-      if (matchCount > 0) {
-        const relevance = matchCount * 100 + strength * 10 - firstMatchPos * 0.01;
-        results.push({
-          id: data.id,
-          content: data.content,
-          category: obj.region,
-          strength: strength,
-          position: [obj.mesh.position.x, obj.mesh.position.y - 1.5, obj.mesh.position.z],
-          relevance: relevance,
-          matchCount: matchCount,
-          source: data.source || 'unknown',
-          timestamp: data.timestamp || obj.mesh.userData.createdAt
-        });
-      }
-    });
-
-    results.sort((a, b) => b.relevance - a.relevance);
-    return results.slice(0, maxResults);
-  }
-
   return { ring, disc, glowDisc, sprite };
   }
 
@@ -893,7 +866,7 @@ const SpatialMemory = (() => {
     getCrystalMeshes, getMemoryFromMesh, highlightMemory, clearHighlight, getSelectedId,
     exportIndex, importIndex, searchNearby, REGIONS,
     saveToStorage, loadFromStorage, clearStorage,
-    runGravityLayout, searchByContent
+    runGravityLayout, setCamera
   };
 })();
 

style.css

@@ -1345,112 +1345,371 @@ canvas#nexus-canvas {
 .memory-feed-update { border-left: 2px solid #ffd700; }
 .memory-feed-sync { border-left: 2px solid #7b5cff; }
 
-/* ═══ MNEMOSYNE — Memory Search Panel (#1208) ═══ */
-#memory-search-panel {
+/* ── Archive Health Dashboard (issue #1210) ─────────────────────────── */
+.archive-health-dashboard {
   position: fixed;
-  top: 60px;
+  top: 50%;
   left: 50%;
-  transform: translateX(-50%);
+  transform: translate(-50%, -50%);
   width: 420px;
-  max-height: 400px;
-  background: rgba(10, 14, 26, 0.95);
-  border: 1px solid rgba(74, 240, 192, 0.3);
-  border-radius: 8px;
-  z-index: 1000;
-  backdrop-filter: blur(12px);
-  box-shadow: 0 8px 32px rgba(0,0,0,0.5), 0 0 20px rgba(74, 240, 192, 0.1);
-  overflow: hidden;
+  max-height: 80vh;
+  overflow-y: auto;
+  background: rgba(10, 15, 40, 0.95);
+  border: 1px solid rgba(74, 240, 192, 0.35);
+  border-radius: 12px;
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  z-index: 1100;
+  font-family: 'JetBrains Mono', monospace;
+  box-shadow: 0 0 40px rgba(74, 240, 192, 0.12), 0 0 80px rgba(123, 92, 255, 0.08);
+  animation: archiveDashIn 0.25s ease-out;
 }
 
-.memory-search-header {
+@keyframes archiveDashIn {
+  from { opacity: 0; transform: translate(-50%, -48%) scale(0.97); }
+  to   { opacity: 1; transform: translate(-50%, -50%) scale(1); }
+}
+
+.archive-health-header {
   display: flex;
+  justify-content: space-between;
   align-items: center;
-  padding: 8px 12px;
-  border-bottom: 1px solid rgba(74, 240, 192, 0.15);
+  padding: 12px 16px;
+  border-bottom: 1px solid rgba(74, 240, 192, 0.2);
+}
+
+.archive-health-title {
+  color: #4af0c0;
+  font-size: 13px;
+  font-weight: 700;
+  letter-spacing: 1.5px;
+  text-transform: uppercase;
+}
+
+.archive-health-close {
+  background: none;
+  border: none;
+  color: rgba(255, 255, 255, 0.4);
+  font-size: 16px;
+  cursor: pointer;
+  padding: 0 4px;
+  line-height: 1;
+  transition: color 0.2s;
+}
+.archive-health-close:hover { color: #fff; }
+
+.archive-health-content {
+  padding: 14px 16px;
+  display: flex;
+  flex-direction: column;
+  gap: 14px;
+}
+
+.ah-section-label {
+  color: rgba(255, 255, 255, 0.4);
+  font-size: 10px;
+  letter-spacing: 1.2px;
+  text-transform: uppercase;
+  margin-bottom: 6px;
+}
+
+.ah-total {
+  display: flex;
+  align-items: baseline;
   gap: 8px;
 }
 
-.memory-search-icon {
-  font-size: 14px;
-  opacity: 0.7;
+.ah-total-count {
+  font-size: 36px;
+  font-weight: 700;
+  color: #4af0c0;
+  line-height: 1;
 }
 
-#memory-search-input {
-  flex: 1;
-  background: transparent;
-  border: none;
-  color: #c0ffe0;
-  font-family: 'JetBrains Mono', monospace;
-  font-size: 13px;
-  outline: none;
+.ah-total-label {
+  font-size: 12px;
+  color: rgba(255, 255, 255, 0.5);
 }
 
-#memory-search-input::placeholder {
-  color: rgba(192, 255, 224, 0.35);
-}
-
-.memory-search-close {
-  cursor: pointer;
-  color: rgba(192, 255, 224, 0.4);
-  font-size: 14px;
-  padding: 2px 4px;
-  border-radius: 3px;
-}
-
-.memory-search-close:hover {
-  color: #ff4466;
-  background: rgba(255, 68, 102, 0.15);
-}
-
-#memory-search-results {
-  max-height: 340px;
-  overflow-y: auto;
-  scrollbar-width: thin;
-  scrollbar-color: rgba(74, 240, 192, 0.2) transparent;
-}
-
-.memory-search-result {
+.ah-category-row {
   display: flex;
   align-items: center;
-  padding: 8px 12px;
-  cursor: pointer;
+  gap: 8px;
+  margin-bottom: 5px;
+}
+
+.ah-cat-dot {
+  width: 10px;
+  height: 10px;
+  border-radius: 2px;
+  flex-shrink: 0;
+}
+
+.ah-cat-label {
+  font-size: 11px;
+  color: rgba(255, 255, 255, 0.7);
+  flex: 1;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.ah-cat-bar-wrap {
+  flex: 2;
+  height: 5px;
+  background: rgba(255, 255, 255, 0.08);
+  border-radius: 3px;
+  overflow: hidden;
+}
+
+.ah-cat-bar {
+  height: 100%;
+  border-radius: 3px;
+  transition: width 0.4s ease;
+}
+
+.ah-cat-count {
+  font-size: 11px;
+  color: rgba(255, 255, 255, 0.45);
+  min-width: 20px;
+  text-align: right;
+}
+
+.ah-trust-row {
+  display: flex;
   gap: 10px;
-  border-bottom: 1px solid rgba(255,255,255,0.03);
+}
+
+.ah-trust-band {
+  flex: 1;
+  background: rgba(255, 255, 255, 0.05);
+  border-radius: 8px;
+  padding: 8px 10px;
+  text-align: center;
+}
+
+.ah-trust-band-count {
+  font-size: 22px;
+  font-weight: 700;
+  line-height: 1;
+}
+
+.ah-trust-band-label {
+  font-size: 9px;
+  letter-spacing: 0.8px;
+  color: rgba(255, 255, 255, 0.4);
+  margin-top: 3px;
+  text-transform: uppercase;
+}
+
+.ah-trust-high .ah-trust-band-count { color: #4af0c0; }
+.ah-trust-mid  .ah-trust-band-count { color: #ffd700; }
+.ah-trust-low  .ah-trust-band-count { color: #ff4466; }
+
+.ah-timestamps {
+  display: flex;
+  flex-direction: column;
+  gap: 5px;
+}
+
+.ah-ts-row {
+  display: flex;
+  justify-content: space-between;
+  font-size: 11px;
+}
+
+.ah-ts-label {
+  color: rgba(255, 255, 255, 0.4);
+}
+
+.ah-ts-value {
+  color: rgba(255, 255, 255, 0.8);
+}
+
+.ah-entity-count {
+  font-size: 24px;
+  font-weight: 700;
+  color: #7b5cff;
+}
+
+.ah-entity-label {
+  font-size: 11px;
+  color: rgba(255, 255, 255, 0.45);
+  margin-left: 6px;
+}
+
+.ah-hotkey-hint {
+  text-align: center;
+  font-size: 10px;
+  color: rgba(255, 255, 255, 0.2);
+  letter-spacing: 0.8px;
+  padding-top: 4px;
+  border-top: 1px solid rgba(255, 255, 255, 0.06);
+}
+
+
+/* ═══ MNEMOSYNE: Memory Filter Panel ═══ */
+.memory-filter {
+  position: fixed;
+  top: 50%;
+  right: 20px;
+  transform: translateY(-50%);
+  width: 300px;
+  max-height: 70vh;
+  background: rgba(10, 12, 20, 0.92);
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  border: 1px solid rgba(74, 240, 192, 0.2);
+  border-radius: 12px;
+  display: flex;
+  flex-direction: column;
+  z-index: 100;
+  animation: slideInRight 0.3s ease;
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.05);
+  overflow: hidden;
+}
+
+@keyframes slideInRight {
+  from { transform: translateY(-50%) translateX(30px); opacity: 0; }
+  to { transform: translateY(-50%) translateX(0); opacity: 1; }
+}
+
+.filter-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 14px 16px 10px;
+  border-bottom: 1px solid rgba(74, 240, 192, 0.1);
+}
+
+.filter-title {
+  color: #4af0c0;
+  font-size: 14px;
+  font-weight: 600;
+  letter-spacing: 0.5px;
+}
+
+.filter-close {
+  background: none;
+  border: none;
+  color: rgba(255, 255, 255, 0.4);
+  font-size: 16px;
+  cursor: pointer;
+  padding: 2px 6px;
+  border-radius: 4px;
+  transition: all 0.2s;
+}
+.filter-close:hover {
+  color: #fff;
+  background: rgba(255, 255, 255, 0.1);
+}
+
+.filter-controls {
+  display: flex;
+  gap: 8px;
+  padding: 10px 16px;
+}
+
+.filter-btn {
+  flex: 1;
+  padding: 6px 0;
+  background: rgba(74, 240, 192, 0.08);
+  border: 1px solid rgba(74, 240, 192, 0.2);
+  border-radius: 6px;
+  color: rgba(255, 255, 255, 0.7);
+  font-size: 12px;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+.filter-btn:hover {
+  background: rgba(74, 240, 192, 0.15);
+  color: #fff;
+}
+
+.filter-list {
+  overflow-y: auto;
+  padding: 6px 8px 12px;
+  flex: 1;
+}
+
+.filter-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 8px 8px;
+  border-radius: 6px;
   transition: background 0.15s;
 }
-
-.memory-search-result:hover {
-  background: rgba(74, 240, 192, 0.08);
+.filter-item:hover {
+  background: rgba(255, 255, 255, 0.04);
 }
 
-.memory-search-dot {
-  width: 8px;
-  height: 8px;
+.filter-item-left {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.filter-dot {
+  width: 10px;
+  height: 10px;
   border-radius: 50%;
   flex-shrink: 0;
 }
 
-.memory-search-text {
-  flex: 1;
-  font-size: 12px;
-  color: rgba(192, 255, 224, 0.75);
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  font-family: 'JetBrains Mono', monospace;
+.filter-label {
+  color: rgba(255, 255, 255, 0.85);
+  font-size: 13px;
 }
 
-.memory-search-meta {
-  font-size: 10px;
-  color: rgba(192, 255, 224, 0.35);
-  flex-shrink: 0;
-  font-family: 'JetBrains Mono', monospace;
+.filter-item-right {
+  display: flex;
+  align-items: center;
+  gap: 10px;
 }
 
-.memory-search-empty {
-  padding: 20px;
-  text-align: center;
-  color: rgba(192, 255, 224, 0.3);
+.filter-count {
+  color: rgba(255, 255, 255, 0.35);
   font-size: 12px;
-  font-family: 'JetBrains Mono', monospace;
+  min-width: 20px;
+  text-align: right;
+}
+
+/* Toggle switch */
+.filter-toggle {
+  position: relative;
+  width: 34px;
+  height: 18px;
+  display: inline-block;
+}
+.filter-toggle input {
+  opacity: 0;
+  width: 0;
+  height: 0;
+}
+.filter-slider {
+  position: absolute;
+  inset: 0;
+  background: rgba(255, 255, 255, 0.12);
+  border-radius: 9px;
+  cursor: pointer;
+  transition: all 0.2s;
+}
+.filter-slider::before {
+  content: '';
+  position: absolute;
+  height: 14px;
+  width: 14px;
+  left: 2px;
+  bottom: 2px;
+  background: rgba(255, 255, 255, 0.6);
+  border-radius: 50%;
+  transition: all 0.2s;
+}
+.filter-toggle input:checked + .filter-slider {
+  background: rgba(74, 240, 192, 0.4);
+}
+.filter-toggle input:checked + .filter-slider::before {
+  transform: translateX(16px);
+  background: #4af0c0;
 }