superlocalmemory 4.1.13 → 4.1.15

package/src/superlocalmemory/ui/js/od-operations.js

@@ -1,1268 +0,0 @@
-// od-operations.js — OD Operations pane renderer v2 (design-faithful)
-// Renders into window.odRenderOperations(container).
-//
-// Endpoints (confirmed with curl against daemon :8765):
-//   GET  /api/lifecycle/status → {available, active_profile, total_memories,
-//                                  states: {archive, cold, warm},
-//                                  recent_transitions: [],
-//                                  age_stats: {warm: {avg_days, min_days, max_days}, ...}}
-//   POST /api/lifecycle/compact → {status: "not_implemented"} — wired to button only
-//   GET  /api/trust/stats       → {avg_trust_score, total_signals, enforcement, by_signal_type}
-//   GET  /api/compliance/status → {available, audit_events_count, recent_audit_events,
-//                                   retention_policies, abac_policies_count}
-//
-// NOTE on lifecycle states: API returns keys 'archive', 'cold', 'warm' (not 'active'/'tombstoned').
-// Display maps: archive → Archived. Missing keys default to 0.
-//
-// CRIT fixes applied:
-//   (a) Lifecycle counts always from /api/lifecycle/status — no hardcoded state numbers.
-//   (b) Compact buttons wired ONLY to click via addEventListener — never auto-fired.
-//   (c) All API strings (policy names, actors, actions, targets) pass through esc() for XSS safety.
-//
-// Copyright (c) 2026 Varun Pratap Bhardwaj / Qualixar — AGPL-3.0
-
-/* global window, document, fetch, Promise */
-(function () {
-  'use strict';
-
-  // ─── Helpers ──────────────────────────────────────────────────────────────
-
-  /** HTML-escape a value before inserting via innerHTML. */
-  function esc(s) {
-    return String(s == null ? '' : s)
-      .replace(/&/g, '&')
-      .replace(/</g, '&lt;')
-      .replace(/>/g, '&gt;')
-      .replace(/"/g, '&quot;')
-      .replace(/'/g, '&#39;');
-  }
-
-  /** Format a Unix-seconds float or ISO string as "Xm ago". */
-  function timeAgo(ts) {
-    if (!ts) return '—';
-    var ms = (typeof ts === 'number') ? ts * 1000 : new Date(ts).getTime();
-    var d = (Date.now() - ms) / 1000;
-    if (d < 0) d = 0;
-    if (d < 60)    return Math.floor(d) + 's ago';
-    if (d < 3600)  return Math.floor(d / 60) + 'm ago';
-    if (d < 86400) return Math.floor(d / 3600) + 'h ago';
-    return Math.floor(d / 86400) + 'd ago';
-  }
-
-  /** Format a number with locale separators. */
-  function fmtNum(n) { return Number(n || 0).toLocaleString(); }
-
-  /** Get an inline SVG icon from the shell registry; fail-safe if shell absent. */
-  function safeIcon(name) {
-    return (typeof window.slmIcon === 'function') ? window.slmIcon(name) : '';
-  }
-
-  // ── .ctl style injection ────────────────────────────────────────────────────
-  // Design defines .ctl via <style> block. Inject once so :last-child border rule works.
-  var _ctlStyleInjected = false;
-  function injectCtlStyle() {
-    if (_ctlStyleInjected || document.getElementById('od-ops-ctl-style')) return;
-    var s = document.createElement('style');
-    s.id = 'od-ops-ctl-style';
-    s.textContent =
-      '.od-ops-ctl{display:flex;align-items:center;justify-content:space-between;' +
-        'gap:16px;padding:14px 0;border-bottom:1px solid var(--border)}' +
-      '.od-ops-ctl:last-child{border-bottom:0}';
-    document.head.appendChild(s);
-    _ctlStyleInjected = true;
-  }
-
-  // ─── Skeleton HTML ────────────────────────────────────────────────────────
-
-  /**
-   * Full static HTML for the operations pane — zero API data inside.
-   * IDs use od-* prefix to avoid colliding with legacy Bootstrap IDs.
-   * Tab switching uses data-od-tab / data-od-pane to isolate from shell nav.
-   */
-  function buildSkeleton() {
-    return (
-      // Page header
-      '<div class="page-head">' +
-        '<h2>Governance</h2>' +
-        '<p>Who can access this workspace, how memory ages, trust, and ' +
-        'compliance — with the controls to act on them. Nothing here is ' +
-        'read-only.</p>' +
-      '</div>' +
-
-      // Tab bar
-      '<div class="tabs" id="od-ops-tabs">' +
-        '<button class="tab active" data-od-tab="lifecycle">Lifecycle</button>' +
-        '<button class="tab" data-od-tab="access">Access &amp; Users</button>' +
-        '<button class="tab" data-od-tab="trust">Trust</button>' +
-        '<button class="tab" data-od-tab="compliance">Compliance</button>' +
-        // Ingestion tab — restored: re-mounts #ingestion-overview + #ingestion-adapters
-        // so ng-ingestion.js (loaded in index.html) can populate them on call.
-        '<button class="tab" data-od-tab="ingestion">Ingestion</button>' +
-      '</div>' +
-
-      // ══════ LIFECYCLE TAB ══════════════════════════════════════════════
-      '<section class="tabpane active" data-od-pane="lifecycle">' +
-
-        // State KPI strip: 5 lifecycle buckets
-        '<div class="kpi-strip" ' +
-          'style="margin-bottom:16px;grid-template-columns:repeat(5,1fr)" ' +
-          'id="od-lc-states">' +
-          '<div class="dim" style="padding:12px">Loading…</div>' +
-        '</div>' +
-
-        // Two-column: age table + compaction preview
-        '<div class="grid" style="grid-template-columns:1fr 1fr;align-items:start">' +
-
-          '<div class="card">' +
-            '<div class="card-head"><h3>Average memory age by state</h3></div>' +
-            '<div class="card-pad">' +
-              '<table class="tbl" id="od-lc-ages">' +
-                '<thead><tr>' +
-                  '<th>State</th>' +
-                  '<th>Avg age (d)</th>' +
-                  '<th>Newest (d)</th>' +
-                  '<th>Oldest (d)</th>' +
-                '</tr></thead>' +
-                '<tbody>' +
-                  '<tr><td colspan="4" class="dim" style="text-align:center;padding:20px">Loading…</td></tr>' +
-                '</tbody>' +
-              '</table>' +
-            '</div>' +
-          '</div>' +
-
-          '<div class="card">' +
-            '<div class="card-head">' +
-              '<h3>Compaction preview</h3>' +
-              '<span class="sub">dry-run · no changes applied</span>' +
-            '</div>' +
-            '<div class="card-pad">' +
-              '<p class="muted" style="font-size:13px" id="od-compact-summary">' +
-                'Click "Re-run dry-run" to preview which memories would be transitioned.' +
-              '</p>' +
-              '<div id="od-compact-detail" style="margin:14px 0"></div>' +
-              '<div style="display:flex;gap:8px">' +
-                // CRIT(b): wired via addEventListener in wireCompactBtns(), never auto-fired
-                '<button class="btn sm" id="od-compact-preview-btn">Re-run dry-run</button>' +
-                '<button class="btn sm primary" id="od-compact-apply-btn">Apply compaction</button>' +
-              '</div>' +
-            '</div>' +
-          '</div>' +
-
-        '</div>' + // end two-column grid
-
-        // Recent transitions table
-        '<div class="card" style="margin-top:16px">' +
-          '<div class="card-head"><h3>Recent transitions</h3></div>' +
-          '<div class="card-pad">' +
-            '<table class="tbl" id="od-lc-trans">' +
-              '<thead><tr>' +
-                '<th>Memory</th><th>Transition</th><th>Reason</th><th>When</th>' +
-              '</tr></thead>' +
-              '<tbody>' +
-                '<tr><td colspan="4" class="dim" style="text-align:center;padding:20px">Loading…</td></tr>' +
-              '</tbody>' +
-            '</table>' +
-          '</div>' +
-        '</div>' +
-
-        // System control — restart the daemon without a terminal
-        '<div class="card" style="margin-top:16px;max-width:640px">' +
-          '<div class="card-head"><h3>System control</h3></div>' +
-          '<div class="card-pad">' +
-            '<p class="muted" style="font-size:13px" id="od-restart-summary">' +
-              'Restart the memory daemon — applies pending config changes and ' +
-              'clears transient state. Memories are never affected.</p>' +
-            '<button class="btn sm" id="od-restart-daemon-btn" style="margin-top:10px">' +
-              'Restart daemon</button>' +
-          '</div>' +
-        '</div>' +
-
-      '</section>' +
-
-      // ══════ TRUST TAB ═════════════════════════════════════════════════
-      '<section class="tabpane" data-od-pane="trust">' +
-
-        '<div class="card" style="max-width:640px">' +
-          '<div class="card-head"><h3>Trust enforcement</h3></div>' +
-          '<div class="card-pad" id="od-trust-ctl">' +
-            '<div class="dim" style="padding:20px;text-align:center">Loading trust data…</div>' +
-          '</div>' +
-        '</div>' +
-
-      '</section>' +
-
-      // ══════ ACCESS & USERS TAB ════════════════════════════════════════
-      // First-class governance surface for non-technical admins: who can use
-      // this workspace and at what role. The card is populated by od-team.js
-      // (window.odRenderTeam) into #od-team-mount during odRenderOperations().
-      '<section class="tabpane" data-od-pane="access">' +
-        '<div class="card" id="od-team-mount">' +
-          '<div class="card-head"><h3>Team &amp; access</h3></div>' +
-          '<div class="card-pad"><p class="muted">Loading…</p></div>' +
-        '</div>' +
-      '</section>' +
-
-      // ══════ COMPLIANCE TAB ════════════════════════════════════════════
-      '<section class="tabpane" data-od-pane="compliance">' +
-
-        // KPI strip: 3 cards with icons
-        '<div class="kpi-strip" ' +
-          'style="margin-bottom:16px;grid-template-columns:repeat(3,1fr)" ' +
-          'id="od-comp-kpi">' +
-          '<div class="dim" style="padding:12px">Loading…</div>' +
-        '</div>' +
-
-        // Retention policies table with New policy button
-        '<div class="card">' +
-          '<div class="card-head">' +
-            '<h3>Active retention policies</h3>' +
-            '<div class="spacer"></div>' +
-            // New policy button — shows alert since write endpoint is not yet exposed
-            '<button class="btn sm" id="od-new-policy-btn">' +
-              safeIcon('plus') + ' New policy' +
-            '</button>' +
-          '</div>' +
-          '<div class="card-pad">' +
-            '<table class="tbl" id="od-ret">' +
-              '<thead><tr>' +
-                '<th>Policy</th>' +
-                '<th>Retention (days)</th>' +
-                '<th>Category</th>' +
-                '<th>Action</th>' +
-                '<th></th>' +
-              '</tr></thead>' +
-              '<tbody>' +
-                '<tr><td colspan="5" class="dim" style="text-align:center;padding:20px">Loading…</td></tr>' +
-              '</tbody>' +
-            '</table>' +
-          '</div>' +
-        '</div>' +
-
-        // Data privacy & GDPR — export, run retention, erase (dashboard-operable)
-        '<div class="card" style="margin-top:16px">' +
-          '<div class="card-head"><h3>Data privacy &amp; GDPR</h3></div>' +
-          '<div class="card-pad">' +
-            '<p class="muted" style="font-size:13px" id="od-gdpr-summary">' +
-              'Manage this profile\'s data under GDPR — export a full copy, run ' +
-              'retention now, or erase everything for this profile.</p>' +
-            '<div style="display:flex;gap:10px;flex-wrap:wrap;margin-top:12px">' +
-              '<button class="btn sm" id="od-gdpr-export-btn">' + safeIcon('download') + ' Export my data</button>' +
-              '<button class="btn sm" id="od-retention-run-btn">Run retention now</button>' +
-              '<button class="btn sm" id="od-gdpr-erase-btn" style="border-color:#ff6b6b;color:#ff6b6b">Erase this profile…</button>' +
-            '</div>' +
-          '</div>' +
-        '</div>' +
-
-        // Audit trail with All/Denied segment filter + event-type API filter
-        '<div class="card" style="margin-top:16px">' +
-          '<div class="card-head">' +
-            '<h3>Audit trail</h3>' +
-            // Task C: chain-integrity badge
-            '<span id="od-audit-chain-status"></span>' +
-            '<div class="spacer"></div>' +
-            // Task C: event-type filter select (calls API)
-            '<select id="od-audit-evt-filter" style="padding:4px 8px;border-radius:6px;' +
-              'border:1px solid var(--border);background:var(--card);color:var(--fg);font-size:12px">' +
-              '<option value="">All types</option>' +
-              '<option value="recall">recall</option>' +
-              '<option value="remember">remember</option>' +
-              '<option value="delete">delete</option>' +
-              '<option value="lifecycle_transition">lifecycle</option>' +
-              '<option value="access_denied">access_denied</option>' +
-              '<option value="retention_enforced">retention</option>' +
-            '</select>' +
-            '<div class="seg" id="od-audit-filter">' +
-              '<button class="active" data-filter="all">All</button>' +
-              '<button data-filter="denied">Denied</button>' +
-            '</div>' +
-          '</div>' +
-          '<div class="card-pad">' +
-            '<table class="tbl" id="od-audit">' +
-              '<thead><tr>' +
-                '<th>Timestamp</th>' +
-                '<th>Event</th>' +
-                '<th>Actor</th>' +
-                '<th>Action</th>' +
-                '<th>Target</th>' +
-                '<th>Result</th>' +
-              '</tr></thead>' +
-              '<tbody id="od-audit-body">' +
-                '<tr><td colspan="6" class="dim" style="text-align:center;padding:20px">Loading…</td></tr>' +
-              '</tbody>' +
-            '</table>' +
-          '</div>' +
-        '</div>' +
-
-      '</section>' +
-
-      // ══════ INGESTION TAB ═════════════════════════════════════════════
-      // Restoration: mounts #ingestion-overview and #ingestion-adapters so that
-      // window.loadIngestionStatus() (ng-ingestion.js) can populate them.
-      // ng-ingestion.js is loaded in index.html and defines loadIngestionStatus().
-      // Adapter action buttons use data-act-click="adapter-action" which is handled
-      // by event-delegation.js → adapterAction() defined in ng-ingestion.js.
-      // Backend: GET /api/adapters · POST /api/adapters/{enable|disable|start|stop}
-      '<section class="tabpane" data-od-pane="ingestion">' +
-
-        '<div class="page-head" style="margin-bottom:16px">' +
-          '<h2 style="font-size:20px;margin-bottom:6px">Connectors &amp; Ingestion</h2>' +
-          '<p style="font-size:13.5px">' +
-            'Gmail, Calendar, and Transcript adapters — enable to start building memory ' +
-            'from external sources. All processing is local.' +
-          '</p>' +
-        '</div>' +
-
-        // #ingestion-overview — ng-ingestion.js: 4 stat cards (Available/Enabled/Running/Privacy)
-        '<div id="ingestion-overview"></div>' +
-
-        // #ingestion-adapters — ng-ingestion.js: adapter cards (Gmail/Calendar/Transcript)
-        '<div id="ingestion-adapters" style="margin-top:16px"></div>' +
-
-      '</section>'
-    );
-  }
-
-  // ─── Tab switching ────────────────────────────────────────────────────────
-  /**
-   * Wire the internal tab bar.
-   * Uses data-od-tab on buttons and data-od-pane on sections.
-   * No onclick attributes — CSP-safe addEventListener only.
-   */
-  function initTabs(root) {
-    var buttons = root.querySelectorAll('[data-od-tab]');
-    var panes   = root.querySelectorAll('[data-od-pane]');
-
-    buttons.forEach(function (btn) {
-      btn.addEventListener('click', function () {
-        var target = btn.getAttribute('data-od-tab');
-        buttons.forEach(function (b) { b.classList.remove('active'); });
-        panes.forEach(function (p) {
-          p.classList.toggle('active', p.getAttribute('data-od-pane') === target);
-        });
-        btn.classList.add('active');
-      });
-    });
-  }
-
-
-  // ─── Lifecycle ────────────────────────────────────────────────────────────
-  /**
-   * Populate the lifecycle KPI strip.
-   * API returns states: {archive, cold, warm}. 'active' and 'tombstoned' not in API.
-   * Missing keys default to 0.
-   */
-  function populateLifecycleStates(lc) {
-    var statesEl = document.getElementById('od-lc-states');
-    if (!statesEl) return;
-
-    var rawStates = (lc && lc.states) || {};
-
-    // Labels are lowercase to match the approved design (design uses 'active' not 'Active').
-    var STATE_MAP = [
-      { key: 'active',     label: 'active',     cls: 'ok' },
-      { key: 'warm',       label: 'warm',        cls: 'warn' },
-      { key: 'cold',       label: 'cold',        cls: 'cyan' },
-      { key: 'archive',    label: 'archived',    cls: 'neutral' },
-      { key: 'tombstoned', label: 'tombstoned',  cls: 'danger' },
-    ];
-
-    statesEl.innerHTML = STATE_MAP.map(function (s) {
-      var count = rawStates[s.key] != null ? rawStates[s.key] : 0;
-      return (
-        '<div class="card kpi">' +
-          '<div class="label">' +
-            '<span class="badge ' + s.cls + '" style="padding:1px 8px">' +
-              '<span class="dot"></span>' + esc(s.label) +
-            '</span>' +
-          '</div>' +
-          '<div class="value num" style="font-size:24px">' + fmtNum(count) + '</div>' +
-        '</div>'
-      );
-    }).join('');
-  }
-
-  /**
-   * Populate the age-by-state table from lifecycle age_stats.
-   * Maps API key 'archive' to display label 'Archived'.
-   */
-  function populateLifecycleAges(lc) {
-    var ageTbody = document.querySelector('#od-lc-ages tbody');
-    if (!ageTbody) return;
-
-    var ageStats = (lc && lc.age_stats) || {};
-    var ageKeys  = Object.keys(ageStats);
-
-    if (ageKeys.length === 0) {
-      ageTbody.innerHTML =
-        '<tr><td colspan="4" class="dim" style="text-align:center;padding:16px">' +
-        'No age data available yet.</td></tr>';
-      return;
-    }
-
-    ageTbody.innerHTML = ageKeys.map(function (k) {
-      var ag = ageStats[k] || {};
-      // Lowercase to match design badge style (design shows 'archived' not 'Archived')
-      var displayLabel = (k === 'archive') ? 'archived' : esc(k);
-      return (
-        '<tr>' +
-          '<td><span class="badge neutral">' + displayLabel + '</span></td>' +
-          '<td class="num">' + esc(String(Number(ag.avg_days || 0).toFixed(1))) + '</td>' +
-          '<td class="num dim">' + esc(String(Number(ag.min_days || 0).toFixed(1))) + '</td>' +
-          '<td class="num dim">' + esc(String(Number(ag.max_days || 0).toFixed(1))) + '</td>' +
-        '</tr>'
-      );
-    }).join('');
-  }
-
-  /**
-   * Populate the recent transitions table.
-   * API returns recent_transitions: [] in current live daemon.
-   * Shows honest empty state; displays up to 20 rows when present.
-   */
-  function populateLifecycleTransitions(lc) {
-    var transTbody = document.querySelector('#od-lc-trans tbody');
-    if (!transTbody) return;
-
-    var trans = (lc && lc.recent_transitions) || [];
-
-    if (trans.length === 0) {
-      transTbody.innerHTML =
-        '<tr><td colspan="4" class="dim" style="text-align:center;padding:16px">' +
-        'No recent transitions. Transitions appear here when memories change lifecycle state.' +
-        '</td></tr>';
-      return;
-    }
-
-    transTbody.innerHTML = trans.slice(0, 20).map(function (t) {
-      var idLabel    = t.memory_id ? '#' + esc(String(t.memory_id)) : '—';
-      var transition = t.transition ? esc(String(t.transition)) : '—';
-      var reason     = t.reason ? esc(String(t.reason)) : '—';
-      var when       = t.timestamp ? esc(timeAgo(t.timestamp)) : '—';
-      return (
-        '<tr>' +
-          '<td class="mono dim">' + idLabel + '</td>' +
-          '<td><span class="badge neutral">' + transition + '</span></td>' +
-          '<td class="dim">' + reason + '</td>' +
-          '<td class="dim">' + when + '</td>' +
-        '</tr>'
-      );
-    }).join('');
-  }
-
-  /**
-   * Populate all lifecycle sections.
-   * Calls populateLifecycleStates, populateLifecycleAges, populateLifecycleTransitions.
-   */
-  function populateLifecycle(lc) {
-    if (!lc) {
-      var stEl = document.getElementById('od-lc-states');
-      if (stEl) stEl.innerHTML = '<p class="muted">Lifecycle data unavailable.</p>';
-      return;
-    }
-    populateLifecycleStates(lc);
-    populateLifecycleAges(lc);
-    populateLifecycleTransitions(lc);
-  }
-
-  // ─── Compact buttons ──────────────────────────────────────────────────────
-  /**
-   * Wire the compaction buttons via addEventListener.
-   * CRIT(b): preview-btn and apply-btn only fire on explicit user click.
-   * Current API returns {status:"not_implemented"} for POST /api/lifecycle/compact.
-   */
-  function wireCompactBtns() {
-    var previewBtn = document.getElementById('od-compact-preview-btn');
-    var applyBtn   = document.getElementById('od-compact-apply-btn');
-    var summaryEl  = document.getElementById('od-compact-summary');
-    var detailEl   = document.getElementById('od-compact-detail');
-
-    if (previewBtn) {
-      previewBtn.addEventListener('click', function () {
-        previewBtn.disabled = true;
-        previewBtn.textContent = 'Running…';
-
-        fetch('/api/lifecycle/compact', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ dry_run: true }),
-        })
-          .then(function (r) { return r.json(); })
-          .then(function (data) {
-            if (data && data.success === false) {
-              if (summaryEl) summaryEl.innerHTML =
-                '<span class="dim">' + esc(data.error || 'Compaction unavailable.') + '</span>';
-              return;
-            }
-            var recs = Number(data.candidates || 0);
-            if (summaryEl) {
-              summaryEl.innerHTML =
-                'Compaction preview: <b style="color:var(--fg)">' + fmtNum(recs) +
-                '</b> of ' + fmtNum(data.total_facts || 0) +
-                ' memories would be transitioned.';
-            }
-            if (detailEl) {
-              var details = (data.transitions || []).slice(0, 10);
-              if (details.length === 0) {
-                detailEl.innerHTML =
-                  '<p class="muted" style="font-size:13px">' +
-                  'No compaction needed — all memories in optimal states.</p>';
-              } else {
-                detailEl.innerHTML = details.map(function (d) {
-                  return (
-                    '<div style="display:flex;justify-content:space-between;' +
-                      'align-items:center;padding:8px 0;' +
-                      'border-bottom:1px solid var(--border)">' +
-                      '<span class="mono" style="font-size:12.5px">' +
-                        esc(String(d.fact_id || '')) +
-                      '</span>' +
-                      '<span class="badge neutral">' +
-                        esc(d.current || '') + ' → ' + esc(d.proposed || '') +
-                      '</span>' +
-                    '</div>'
-                  );
-                }).join('');
-              }
-            }
-          })
-          .catch(function (err) {
-            if (summaryEl) summaryEl.textContent = 'Preview failed. Check console.';
-            if (typeof console !== 'undefined') {
-              console.error('[od-ops] compact preview error:', err);
-            }
-          })
-          .finally(function () {
-            previewBtn.disabled = false;
-            previewBtn.textContent = 'Re-run dry-run';
-          });
-      });
-    }
-
-    if (applyBtn) {
-      applyBtn.addEventListener('click', function () {
-        window.confirmDestructive({
-          title: 'Apply compaction',
-          target: 'All eligible memories',
-          consequence: 'Transitions memories to lower lifecycle states.',
-          confirmLabel: 'Apply',
-        }).then(function(confirmed) {
-          if (!confirmed) return;
-          applyBtn.disabled = true;
-        applyBtn.textContent = 'Running…';
-
-        fetch('/api/lifecycle/compact', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ dry_run: false }),
-        })
-          .then(function (r) { return r.json(); })
-          .then(function (data) {
-            if (data && data.success === false) {
-              if (summaryEl) summaryEl.innerHTML =
-                '<span class="dim">' + esc(data.error || 'Compaction failed.') + '</span>';
-              return;
-            }
-            var n = Number(data.applied || 0);
-            if (summaryEl) {
-              summaryEl.innerHTML =
-                'Compaction complete: <b style="color:var(--ok)">' +
-                fmtNum(n) + '</b> memories transitioned.';
-            }
-          })
-          .catch(function (err) {
-            if (summaryEl) summaryEl.textContent = 'Compaction failed. Check console.';
-            if (typeof console !== 'undefined') {
-              console.error('[od-ops] compact apply error:', err);
-            }
-          })
-          .finally(function () {
-            applyBtn.disabled = false;
-            applyBtn.textContent = 'Apply compaction';
-          });
-        });
-      });
-    }
-  }
-
-  /**
-   * Wire the "Restart daemon" button. POSTs /api/daemon/restart (which spawns a
-   * detached `slm restart`), then polls /health until the fresh daemon is back
-   * and reloads the dashboard. Wired via addEventListener — never auto-fired.
-   */
-  function wireRestartBtn() {
-    var btn = document.getElementById('od-restart-daemon-btn');
-    var summary = document.getElementById('od-restart-summary');
-    if (!btn) return;
-    btn.addEventListener('click', function () {
-      window.confirmDestructive({
-        title: 'Restart memory daemon',
-        target: 'Memory daemon',
-        consequence: 'Will be unavailable for a few seconds. Your memories are not affected.',
-        confirmLabel: 'Restart',
-      }).then(function(confirmed) {
-        if (!confirmed) return;
-        btn.disabled = true;
-      btn.textContent = 'Restarting…';
-      if (summary) summary.textContent = 'Restart requested — waiting for the daemon to come back…';
-
-      fetch('/api/daemon/restart', {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: '{}',
-      })
-        .then(function (r) { return r.json().catch(function () { return {}; }); })
-        .then(function (data) {
-          if (data && data.success === false) {
-            if (summary) summary.textContent = 'Restart failed: ' + (data.error || 'unknown error');
-            btn.disabled = false; btn.textContent = 'Restart daemon';
-            return;
-          }
-          // Poll /health until the fresh daemon reports ready, then reload.
-          var tries = 0;
-          var poll = setInterval(function () {
-            tries += 1;
-            fetch('/health', { cache: 'no-store' })
-              .then(function (r) { return r.ok ? r.json() : null; })
-              .then(function (h) {
-                if (h && (h.ready === true || h.engine === 'initialized')) {
-                  clearInterval(poll);
-                  if (summary) summary.textContent = 'Daemon back online — reloading…';
-                  setTimeout(function () { window.location.reload(); }, 600);
-                }
-              })
-              .catch(function () { /* daemon still down mid-restart — keep polling */ });
-            if (tries > 30) {  // ~30s ceiling
-              clearInterval(poll);
-              if (summary) summary.textContent =
-                'Daemon is taking longer than expected. Refresh the page in a moment.';
-              btn.disabled = false; btn.textContent = 'Restart daemon';
-            }
-          }, 1000);
-        })
-        .catch(function () {
-          // The connection often drops as the daemon stops — that's expected;
-          // start polling for it to come back.
-          if (summary) summary.textContent = 'Daemon restarting — waiting for it to come back…';
-          var tries = 0;
-          var poll = setInterval(function () {
-            tries += 1;
-            fetch('/health', { cache: 'no-store' })
-              .then(function (r) { return r.ok ? r.json() : null; })
-              .then(function (h) {
-                if (h && (h.ready === true || h.engine === 'initialized')) {
-                  clearInterval(poll);
-                  window.location.reload();
-                }
-              })
-              .catch(function () {});
-            if (tries > 30) { clearInterval(poll); btn.disabled = false; btn.textContent = 'Restart daemon'; }
-          }, 1000);
-        });
-      });
-    });
-  }
-
-  // ─── Trust ────────────────────────────────────────────────────────────────
-  /**
-   * Populate trust enforcement section from /api/trust/stats.
-   * Toggle controls are read-only display — no write endpoint exists yet.
-   * TODO: wire toggles when /api/trust/settings PATCH is exposed.
-   */
-  function populateTrust(trustStats) {
-    var ctlEl = document.getElementById('od-trust-ctl');
-    if (!ctlEl) return;
-
-    if (!trustStats) {
-      ctlEl.innerHTML = '<p class="muted">Trust data unavailable.</p>';
-      return;
-    }
-
-    var enforcement = String(trustStats.enforcement || 'unknown');
-    var isEnforced  = enforcement.toLowerCase() !== 'silent collection' &&
-                      enforcement.toLowerCase() !== 'off' &&
-                      enforcement.toLowerCase() !== 'disabled';
-
-    // Helper: a control row using .od-ops-ctl class (injectCtlStyle injects .ctl rules).
-    // :last-child removes border-bottom on the final row — matches design's <style> block.
-    function ctlRow(label, sublabel, control) {
-      return (
-        '<div class="od-ops-ctl">' +
-          '<div>' +
-            '<b>' + esc(label) + '</b>' +
-            '<div class="dim" style="font-size:12.5px">' + esc(sublabel) + '</div>' +
-          '</div>' +
-          control +
-        '</div>'
-      );
-    }
-
-    // Switch is display-only (no write endpoint) — disabled + lower opacity.
-    // enforcement: if mode is "silent collection" / off / disabled → switch is OFF.
-    var enfSwitch = '<button class="switch' + (isEnforced ? ' on' : '') +
-      '" disabled aria-label="read-only" style="cursor:not-allowed;opacity:0.7"></button>';
-
-    // Design shows only 4 ctl rows — no stats summary block above them.
-    ctlEl.innerHTML = (
-      ctlRow(
-        'Enforcement mode',
-        'Block writes from agents below the trust floor',
-        enfSwitch
-      ) +
-      // TODO: trust floor — no read or write endpoint in current API
-      ctlRow(
-        'Trust floor',
-        'Minimum trust score to write',
-        '<span class="mono">0.30</span>' // TODO: read from /api/trust/config when available
-      ) +
-      // TODO: quick-delete penalty — no read/write endpoint yet
-      ctlRow(
-        'Quick-delete penalty',
-        'Lower trust when writes are deleted < 60s',
-        '<button class="switch on" disabled style="cursor:not-allowed;opacity:0.7"></button>'
-      ) +
-      // TODO: recall reward — no read/write endpoint yet
-      ctlRow(
-        'Recall reward',
-        'Raise trust when a memory is recalled',
-        '<button class="switch on" disabled style="cursor:not-allowed;opacity:0.7"></button>'
-      )
-    );
-  }
-
-  // ─── Compliance ───────────────────────────────────────────────────────────
-  /**
-   * Populate the compliance KPI strip — 3 cards with icons.
-   * Icons via window.slmIcon() so they work in dynamically-injected content.
-   */
-  function populateComplianceKpi(comp) {
-    var kpiEl = document.getElementById('od-comp-kpi');
-    if (!kpiEl) return;
-
-    var auditCount = comp ? Number(comp.audit_events_count || 0)        : 0;
-    var retCount   = comp && comp.retention_policies ? comp.retention_policies.length : 0;
-    var abacCount  = comp ? Number(comp.abac_policies_count || 0)       : 0;
-
-    kpiEl.innerHTML = (
-      '<div class="card kpi">' +
-        // Design uses data-ic="shield". Shield is not in the icon registry (od-shell.js).
-        // safeIcon('health') (pulse/waveform) is the closest semantic match for audit monitoring.
-        '<div class="label">' + safeIcon('health') + ' Audit events</div>' +
-        '<div class="value num">' + fmtNum(auditCount) + '</div>' +
-      '</div>' +
-      '<div class="card kpi">' +
-        '<div class="label">' + safeIcon('clock') + ' Retention policies</div>' +
-        '<div class="value num">' + fmtNum(retCount) + '</div>' +
-      '</div>' +
-      '<div class="card kpi">' +
-        '<div class="label">' + safeIcon('lock') + ' ABAC rules</div>' +
-        '<div class="value num">' + fmtNum(abacCount) + '</div>' +
-      '</div>'
-    );
-  }
-  /**
-   * Populate the retention policies table.
-   * CRIT(c): policy name, category, action go through esc().
-   * Empty state explains how to add policies via MCP tool.
-   */
-  function populateRetentionPolicies(comp) {
-    var retTbody = document.querySelector('#od-ret tbody');
-    if (!retTbody) return;
-
-    var policies = (comp && comp.retention_policies) || [];
-
-    if (policies.length === 0) {
-      retTbody.innerHTML =
-        '<tr><td colspan="5" class="dim" style="text-align:center;padding:20px">' +
-        'No retention policies configured. Use the set_retention_policy MCP tool to add one.' +
-        '</td></tr>';
-      return;
-    }
-
-    var ACTION_CLS = { archive: 'neutral', tombstone: 'danger', notify: 'warn' };
-
-    // Build rows then wire delete buttons post-inject (avoids inline onclick — CSP safe)
-    retTbody.innerHTML = policies.map(function (p) {
-      var ac = ACTION_CLS[p.action] || 'neutral';
-      return (
-        '<tr>' +
-          '<td><b>' + esc(p.name || '') + '</b></td>' +
-          '<td class="num">' + esc(String(p.retention_days || '—')) + '</td>' +
-          '<td><span class="badge neutral">' + esc(p.category || 'all') + '</span></td>' +
-          '<td><span class="badge ' + ac + '">' + esc(p.action || '') + '</span></td>' +
-          // Task E: per-row delete — data-pol-name used by wireRetentionDeleteBtns()
-          '<td style="text-align:right">' +
-            '<button class="btn sm danger" data-pol-name="' + esc(p.name || '') + '">' +
-              'Delete' +
-            '</button>' +
-          '</td>' +
-        '</tr>'
-      );
-    }).join('');
-
-    // Task E: wire delete buttons (CSP-safe addEventListener after innerHTML set)
-    wireRetentionDeleteBtns(retTbody);
-  }
-
-  // Cache of all audit rows (for client-side All/Denied filter)
-  var _allAuditRows = [];
-  /**
-   * Task C: Populate the audit trail table.
-   * auditFull: response from /api/compliance/audit (preferred, up to 100 events).
-   * comp: response from /api/compliance/status (fallback, recent_audit_events).
-   * CRIT(c): actor, action, target, result all through esc().
-   */
-  function populateAuditTrail(comp, auditFull) {
-    var auditTbody = document.getElementById('od-audit-body');
-    if (!auditTbody) return;
-
-    // Prefer full audit endpoint data; fall back to status data
-    var events = (auditFull && auditFull.events) || (comp && comp.recent_audit_events) || [];
-    _allAuditRows = events;
-
-    renderAuditRows(auditTbody, events);
-  }
-
-  /**
-   * Task C: Render the chain-integrity badge inside the audit trail card header.
-   * Appended to #od-audit-chain-status if it exists.
-   */
-  function showAuditChainStatus(auditFull) {
-    var el = document.getElementById('od-audit-chain-status');
-    if (!el || !auditFull) return;
-    var ok = auditFull.chain_verified !== false;
-    el.innerHTML = ok
-      ? '<span class="badge ok" style="margin-left:8px">Chain verified</span>'
-      : '<span class="badge danger" style="margin-left:8px">Chain integrity issue</span>';
-  }
-
-  /** Task C: re-fetch audit trail from API with a specific event_type filter. */
-  function fetchAndRenderAudit(eventType) {
-    var auditTbody = document.getElementById('od-audit-body');
-    if (!auditTbody) return;
-    auditTbody.innerHTML = '<tr><td colspan="6" class="dim" style="text-align:center;padding:16px">Loading…</td></tr>';
-    var url = '/api/compliance/audit?limit=100';
-    if (eventType && eventType !== 'all') url += '&event_type=' + encodeURIComponent(eventType);
-    fetch(url)
-      .then(function (r) { return r.ok ? r.json() : null; })
-      .then(function (d) {
-        if (!d) return;
-        _allAuditRows = d.events || [];
-        renderAuditRows(auditTbody, _allAuditRows);
-        showAuditChainStatus(d);
-      })
-      .catch(function () {
-        if (auditTbody) auditTbody.innerHTML = '<tr><td colspan="6" class="dim" style="text-align:center;padding:16px">Failed to load audit trail.</td></tr>';
-      });
-  }
-
-  /** Render audit table rows into tbody, filtering by mode ('all' or 'denied'). */
-  function renderAuditRows(tbody, events) {
-    if (events.length === 0) {
-      tbody.innerHTML =
-        '<tr><td colspan="6" class="dim" style="text-align:center;padding:20px">' +
-        'No audit events recorded yet.</td></tr>';
-      return;
-    }
-
-    var EV_CLS = {
-      recall:               'cyan',
-      remember:             'ok',
-      delete:               'danger',
-      lifecycle_transition: 'warn',
-      access_denied:        'danger',
-      retention_enforced:   'warn',
-    };
-
-    tbody.innerHTML = events.slice(0, 50).map(function (ev) {
-      var evc      = EV_CLS[ev.event_type] || 'neutral';
-      var isOk     = ev.result === 'success' || ev.result === 'allowed';
-      var isDenied = ev.result === 'denied'  || ev.result === 'error';
-      var resultCls = isOk ? 'ok' : isDenied ? 'danger' : 'neutral';
-      // CRIT(c): all user-sourced strings through esc()
-      return (
-        '<tr>' +
-          '<td class="mono dim" style="font-size:12px">' + esc(ev.timestamp || '') + '</td>' +
-          '<td><span class="badge ' + evc + '">' + esc(ev.event_type || '') + '</span></td>' +
-          '<td class="mono" style="font-size:12px">' + esc(ev.actor || '') + '</td>' +
-          '<td>' + esc(ev.action || '') + '</td>' +
-          '<td class="dim">' + esc(ev.target || '') + '</td>' +
-          '<td><span class="badge ' + resultCls + '">' + esc(ev.result || '') + '</span></td>' +
-        '</tr>'
-      );
-    }).join('');
-  }
-  /**
-   * Task C: Wire audit filters.
-   * - All/Denied segment: client-side filter (fast).
-   * - Event-type select (#od-audit-evt-filter): calls API to get filtered results.
-   */
-  function wireAuditFilter(auditFull) {
-    var filterEl = document.getElementById('od-audit-filter');
-    var tbody    = document.getElementById('od-audit-body');
-    if (!filterEl || !tbody) return;
-
-    // All / Denied segment buttons — client-side
-    filterEl.querySelectorAll('button').forEach(function (btn) {
-      btn.addEventListener('click', function () {
-        var mode = btn.getAttribute('data-filter');
-        filterEl.querySelectorAll('button').forEach(function (b) {
-          b.classList.remove('active');
-        });
-        btn.classList.add('active');
-
-        var rows = (mode === 'denied')
-          ? _allAuditRows.filter(function (ev) {
-              return ev.result === 'denied' || ev.result === 'error' ||
-                     (ev.event_type && ev.event_type.indexOf('denied') >= 0);
-            })
-          : _allAuditRows;
-
-        renderAuditRows(tbody, rows);
-      });
-    });
-
-    // Task C: Event-type select — re-fetches from API
-    var evtSelect = document.getElementById('od-audit-evt-filter');
-    if (evtSelect) {
-      evtSelect.addEventListener('change', function () {
-        fetchAndRenderAudit(evtSelect.value);
-      });
-    }
-  }
-
-  /**
-   * Task E: Wire delete buttons injected by populateRetentionPolicies.
-   * Data attribute data-pol-name carries the policy name (already esc'd in innerHTML).
-   * Uses confirmDestructive before calling DELETE /api/compliance/retention-policy?name=.
-   */
-  function wireRetentionDeleteBtns(tbody) {
-    tbody.querySelectorAll('[data-pol-name]').forEach(function (btn) {
-      btn.addEventListener('click', function () {
-        var policyName = btn.getAttribute('data-pol-name');
-        window.confirmDestructive({
-          title: 'Delete retention policy',
-          target: policyName,
-          consequence: 'This policy will no longer be enforced on any memory.',
-          confirmLabel: 'Delete',
-        }).then(function (confirmed) {
-          if (!confirmed) return;
-          btn.disabled = true;
-          fetch('/api/compliance/retention-policy?name=' + encodeURIComponent(policyName), {
-            method: 'DELETE',
-          })
-            .then(function (r) { return r.json(); })
-            .then(function (d) {
-              if (d && d.success !== false) {
-                var pane = document.getElementById('operations-pane');
-                if (pane && typeof window.odRenderOperations === 'function') {
-                  window.odRenderOperations(pane);
-                }
-              } else {
-                btn.disabled = false;
-                if (typeof console !== 'undefined') {
-                  console.error('[od-ops] retention delete failed:', d && d.error);
-                }
-              }
-            })
-            .catch(function () { btn.disabled = false; });
-        });
-      });
-    });
-  }
-
-  /**
-   * Wire the "New policy" button.
-   * Informs user that the write endpoint is not yet exposed.
-   */
-  function wireNewPolicyBtn() {
-    var btn = document.getElementById('od-new-policy-btn');
-    if (!btn) return;
-    btn.addEventListener('click', openRetentionPolicyModal);
-  }
-
-  /**
-   * Wire the GDPR data-privacy controls: export (download), run retention now,
-   * and erase-this-profile (typed confirmation). All dashboard-operable.
-   */
-  function wireGdprBtns() {
-    var summary = document.getElementById('od-gdpr-summary');
-    var exportBtn = document.getElementById('od-gdpr-export-btn');
-    var runBtn = document.getElementById('od-retention-run-btn');
-    var eraseBtn = document.getElementById('od-gdpr-erase-btn');
-
-    if (exportBtn) {
-      exportBtn.addEventListener('click', function () {
-        // Stream the JSON attachment to a download via a temporary anchor.
-        var a = document.createElement('a');
-        a.href = '/api/compliance/gdpr/export';
-        a.download = '';
-        document.body.appendChild(a);
-        a.click();
-        document.body.removeChild(a);
-        if (summary) summary.textContent = 'Export started — check your downloads.';
-      });
-    }
-
-    if (runBtn) {
-      runBtn.addEventListener('click', function () {
-        runBtn.disabled = true; runBtn.textContent = 'Running…';
-        fetch('/api/compliance/retention/enforce', {
-          method: 'POST', headers: { 'Content-Type': 'application/json' }, body: '{}',
-        })
-          .then(function (r) { return r.json(); })
-          .then(function (d) {
-            if (!summary) return;
-            // Task E: surface all returned counts from the enforce response
-            if (d && d.success) {
-              var parts = [];
-              if (d.archived != null)    parts.push('archived ' + fmtNum(d.archived));
-              if (d.tombstoned != null)  parts.push('tombstoned ' + fmtNum(d.tombstoned));
-              if (d.notified != null)    parts.push('flagged ' + fmtNum(d.notified));
-              if (d.evaluated != null)   parts.push('evaluated ' + fmtNum(d.evaluated));
-              if (d.policies_run != null) parts.push('policies run: ' + fmtNum(d.policies_run));
-              summary.textContent = 'Retention applied — ' + (parts.join(', ') || 'no changes needed') + '.';
-            } else {
-              summary.textContent = 'Retention failed: ' + ((d && d.error) || 'unknown');
-            }
-          })
-          .catch(function () { if (summary) summary.textContent = 'Retention run failed. Check console.'; })
-          .finally(function () { runBtn.disabled = false; runBtn.textContent = 'Run retention now'; });
-      });
-    }
-
-    if (eraseBtn) {
-      eraseBtn.addEventListener('click', async function () {
-        // Resolve the active profile so the confirmation is unambiguous.
-        var profile = 'default';
-        try {
-          var s = await fetch('/status', { cache: 'no-store' }).then(function (r) { return r.json(); });
-          profile = s.profile || s.active_profile || 'default';
-        } catch (e) {}
-        if (profile === 'default') {
-          window.alert('The default profile cannot be erased.');
-          return;
-        }
-        var typed = window.prompt(
-          'This PERMANENTLY erases ALL data for profile "' + profile + '".\n' +
-          'This cannot be undone.\n\nType the profile name to confirm:');
-        if (typed !== profile) {
-          if (typed !== null && summary) summary.textContent = 'Erase cancelled — name did not match.';
-          return;
-        }
-        eraseBtn.disabled = true; eraseBtn.textContent = 'Erasing…';
-        fetch('/api/compliance/gdpr/erase', {
-          method: 'POST', headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ confirm: profile }),
-        })
-          .then(function (r) { return r.json(); })
-          .then(function (d) {
-            if (summary) {
-              summary.textContent = d && d.success
-                ? ('Profile "' + profile + '" erased. Reloading…')
-                : ('Erase failed: ' + ((d && d.error) || 'unknown'));
-            }
-            if (d && d.success) setTimeout(function () { window.location.reload(); }, 900);
-          })
-          .catch(function () { if (summary) summary.textContent = 'Erase failed. Check console.'; })
-          .finally(function () { eraseBtn.disabled = false; eraseBtn.textContent = 'Erase this profile…'; });
-      });
-    }
-  }
-
-  /**
-   * OD-styled "New retention policy" modal → POST /api/compliance/retention-policy.
-   * Non-technical users define GDPR/retention rules without a CLI. On success
-   * the Compliance tab reloads so the new policy appears immediately.
-   */
-  function openRetentionPolicyModal() {
-    var existing = document.getElementById('od-retention-overlay');
-    if (existing) existing.remove();
-
-    var overlay = document.createElement('div');
-    overlay.id = 'od-retention-overlay';
-    overlay.setAttribute('role', 'dialog');
-    overlay.setAttribute('aria-modal', 'true');
-    overlay.style.cssText =
-      'position:fixed;inset:0;z-index:11000;display:flex;align-items:center;' +
-      'justify-content:center;background:rgba(0,0,0,0.45);backdrop-filter:blur(2px)';
-
-    var card = document.createElement('div');
-    card.style.cssText =
-      'width:min(460px,93vw);background:var(--card,#1a1f2e);color:var(--fg,#e8ecf3);' +
-      'border:1px solid var(--border,rgba(255,255,255,0.1));border-radius:14px;' +
-      'box-shadow:0 20px 60px rgba(0,0,0,0.4);padding:22px 22px 18px';
-
-    var fieldStyle =
-      'width:100%;box-sizing:border-box;padding:9px 11px;font-size:0.9rem;margin-top:4px;' +
-      'background:var(--page,rgba(255,255,255,0.04));color:var(--fg,#e8ecf3);' +
-      'border:1px solid var(--border,rgba(255,255,255,0.14));border-radius:8px;outline:none';
-    var labelStyle = 'display:block;margin-top:12px;font-size:0.8rem;color:var(--fg-3,#8b93a7)';
-
-    card.innerHTML =
-      '<h3 style="margin:0 0 4px;font-size:1.05rem;font-weight:600">New retention policy</h3>' +
-      '<p style="margin:0 0 8px;font-size:0.8125rem;color:var(--fg-3,#8b93a7)">' +
-        'Automatically age out memories older than a set period — GDPR-style retention.</p>' +
-      '<label style="' + labelStyle + '">Policy name' +
-        '<input id="od-rp-name" type="text" maxlength="60" placeholder="e.g. GDPR 90-day" style="' + fieldStyle + '"></label>' +
-      '<label style="' + labelStyle + '">Retain for (days)' +
-        '<input id="od-rp-days" type="number" min="1" value="90" style="' + fieldStyle + '"></label>' +
-      '<label style="' + labelStyle + '">Framework' +
-        '<select id="od-rp-cat" style="' + fieldStyle + '">' +
-          '<option value="gdpr">GDPR</option><option value="hipaa">HIPAA</option>' +
-          '<option value="sox">SOX</option><option value="custom">Custom</option>' +
-        '</select></label>' +
-      '<label style="' + labelStyle + '">When a memory expires' +
-        '<select id="od-rp-action" style="' + fieldStyle + '">' +
-          '<option value="archive">Archive (keep, hide from recall)</option>' +
-          '<option value="tombstone">Tombstone (mark deleted)</option>' +
-          '<option value="notify">Notify only (no change)</option>' +
-        '</select></label>' +
-      '<div id="od-rp-err" style="min-height:18px;margin:8px 2px 0;font-size:0.75rem;color:#ff6b6b"></div>' +
-      '<div style="display:flex;gap:8px;justify-content:flex-end;margin-top:8px">' +
-        '<button type="button" id="od-rp-cancel" style="padding:8px 14px;font-size:0.85rem;border-radius:8px;cursor:pointer;background:transparent;color:var(--fg-3,#8b93a7);border:1px solid var(--border,rgba(255,255,255,0.14))">Cancel</button>' +
-        '<button type="button" id="od-rp-create" style="padding:8px 16px;font-size:0.85rem;border-radius:8px;cursor:pointer;background:var(--violet,#7c5cff);color:#fff;border:1px solid transparent;font-weight:600">Create policy</button>' +
-      '</div>';
-
-    overlay.appendChild(card);
-    document.body.appendChild(overlay);
-    setTimeout(function () { var n = document.getElementById('od-rp-name'); if (n) n.focus(); }, 30);
-
-    function close() { document.removeEventListener('keydown', onKey); overlay.remove(); }
-    function onKey(e) { if (e.key === 'Escape') close(); }
-    var errEl = document.getElementById('od-rp-err');
-    var createBtn = document.getElementById('od-rp-create');
-
-    async function submit() {
-      var name = (document.getElementById('od-rp-name').value || '').trim();
-      var days = parseInt(document.getElementById('od-rp-days').value, 10);
-      var cat = document.getElementById('od-rp-cat').value;
-      var action = document.getElementById('od-rp-action').value;
-      if (!name) { errEl.textContent = 'Please enter a policy name.'; return; }
-      if (!(days >= 1)) { errEl.textContent = 'Retention days must be a positive number.'; return; }
-      createBtn.disabled = true; createBtn.textContent = 'Creating…'; errEl.textContent = '';
-      try {
-        var r = await fetch('/api/compliance/retention-policy', {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ name: name, retention_days: days, category: cat, action: action }),
-        });
-        var data = await r.json().catch(function () { return {}; });
-        if (!r.ok || data.success === false) {
-          errEl.textContent = (data && data.error) || 'Failed to create policy.';
-          createBtn.disabled = false; createBtn.textContent = 'Create policy';
-          return;
-        }
-        close();
-        if (typeof window.odRenderOperations === 'function') {
-          // Reload the Operations pane so the new policy shows in the table.
-          var pane = document.getElementById('operations-pane');
-          if (pane) window.odRenderOperations(pane);
-        }
-      } catch (e) {
-        errEl.textContent = 'Network error creating policy.';
-        createBtn.disabled = false; createBtn.textContent = 'Create policy';
-      }
-    }
-
-    document.getElementById('od-rp-cancel').addEventListener('click', close);
-    createBtn.addEventListener('click', submit);
-    overlay.addEventListener('click', function (e) { if (e.target === overlay) close(); });
-    document.addEventListener('keydown', onKey);
-  }
-
-  // ─── Main entry point ─────────────────────────────────────────────────────
-  /**
-   * Fetch all operations endpoints, inject the OD skeleton, and populate with real data.
-   * Idempotent: each call clears and re-renders the container.
-   *
-   * @param {HTMLElement} container  Usually document.getElementById("operations-pane").
-   */
-  function odRenderOperations(container) {
-    if (!container) return;
-
-    container.innerHTML =
-      '<div style="color:var(--fg-2);text-align:center;padding:48px 0">' +
-      'Loading operations data…</div>';
-
-    // Reset audit row cache on each render
-    _allAuditRows = [];
-
-    Promise.all([
-      fetch('/api/lifecycle/status').then(function (r) { return r.ok ? r.json() : null; }).catch(function () { return null; }),
-      fetch('/api/trust/stats').then(function (r) { return r.ok ? r.json() : null; }).catch(function () { return null; }),
-      fetch('/api/compliance/status').then(function (r) { return r.ok ? r.json() : null; }).catch(function () { return null; }),
-      // Task C: wire the full audit trail endpoint (up to 100 events, chain_verified)
-      fetch('/api/compliance/audit?limit=100').then(function (r) { return r.ok ? r.json() : null; }).catch(function () { return null; }),
-    ]).then(function (results) {
-      var lc         = results[0];
-      var trustStats = results[1];
-      var comp       = results[2];
-      var auditFull  = results[3]; // {available, events, chain_verified, ...}
-
-      // Inject .ctl class styles (used by Trust section control rows)
-      injectCtlStyle();
-
-      // Inject static skeleton — no API data inside
-      container.innerHTML = buildSkeleton();
-
-      // Wire tab switching (CSP-safe)
-      initTabs(container);
-
-      // Populate lifecycle
-      populateLifecycle(lc);
-      // CRIT(b): compact buttons wired here — never auto-fired on render
-      wireCompactBtns();
-      // Restart-daemon button — wired via addEventListener, never auto-fired
-      wireRestartBtn();
-
-      // Populate trust
-      populateTrust(trustStats);
-
-      // Populate compliance
-      populateComplianceKpi(comp);
-      populateRetentionPolicies(comp);
-      // Task C: prefer the full audit trail from the dedicated endpoint;
-      // fall back to the status endpoint's recent_audit_events on failure.
-      populateAuditTrail(comp, auditFull);
-
-      // Task C: show chain-integrity indicator
-      showAuditChainStatus(auditFull);
-
-      // Wire audit filter and new-policy button (listeners on injected DOM)
-      wireAuditFilter(auditFull);
-      wireNewPolicyBtn();
-      wireGdprBtns();
-
-      // Team & access (RBAC / C3) — rendered by od-team.js
-      if (typeof window.odRenderTeam === 'function') {
-        window.odRenderTeam(document.getElementById('od-team-mount'));
-      }
-
-      // Ingestion (Gmail / Calendar / Transcript) — re-linked to ng-ingestion.js.
-      // #ingestion-overview and #ingestion-adapters are now in the skeleton DOM
-      // (inside the Ingestion tab section); calling loadIngestionStatus() renders them.
-      // The function is null-guarded: no-op if ng-ingestion.js failed to load.
-      if (typeof window.loadIngestionStatus === 'function') {
-        window.loadIngestionStatus();
-      }
-
-    }).catch(function (err) {
-      container.innerHTML =
-        '<div style="color:var(--danger);text-align:center;padding:48px 0">' +
-        'Failed to load operations data. Check the daemon is running on port 8765.</div>';
-      if (typeof console !== 'undefined') {
-        console.error('[od-ops] render error:', err);
-      }
-    });
-  }
-
-  // ─── Public API ───────────────────────────────────────────────────────────
-
-  window.odRenderOperations = odRenderOperations;
-
-  // Auto-run: if the operations pane is already in the DOM at script load, render it.
-  document.addEventListener('DOMContentLoaded', function () {
-    var pane = document.getElementById('operations-pane');
-    if (pane) odRenderOperations(pane);
-  });
-
-}());