total-recall-brain 3.45.0 → 3.46.1

package/scaffold/.agent/skills/total-recall/plugins/security/scripts/build-ui.mjs

@@ -1,4 +0,0 @@
-import fs from 'node:fs';
-const card = fs.readFileSync(new URL('../ui/card.js', import.meta.url), 'utf8');
-// The host runs each interface from a standalone Blob module; bundle the shared class.
-fs.writeFileSync(new URL('../ui/panel.js', import.meta.url), `${card}\nclass SecurityPanel extends SecuritySecurityCard {}\nif (!customElements.get('security-panel')) customElements.define('security-panel', SecurityPanel);\n`);

package/scaffold/.agent/skills/total-recall/plugins/security/ui/DESIGN.md

@@ -1,41 +0,0 @@
-# DESIGN.md — Security Plugin (Tin Foil)
-
-## Brand Identity & Aesthetic
-- **Brand Name**: Tin Foil
-- **Wordmark**: `[TIN//FOIL]`
-- **Theme**: Crimson and Obsidian Host Hardening Console
-- **Tone**: Deterministic, vigilant, fail-closed, precise
-
-## Design Tokens
-
-The card face defines and consumes these custom properties:
-
-```css
-:host {
-  --face-bg: #180d11;
-  --face-bg-subtle: #251017;
-  --face-bg-surface: #11070a;
-  --face-bg-table: #0d0508;
-  --face-bg-code: #0a0406;
-  --face-accent: #f43f5e;
-  --face-accent-hover: rgba(244, 63, 94, 0.22);
-  --face-accent-glow: rgba(244, 63, 94, 0.35);
-  --face-border-subtle: rgba(244, 63, 94, 0.28);
-  --face-border-faint: rgba(244, 63, 94, 0.2);
-  --face-border-cell: rgba(244, 63, 94, 0.15);
-  --face-border-alert: rgba(244, 63, 94, 0.25);
-  --face-text: #f1f5f9;
-  --face-text-heading: #fecdd3;
-  --face-text-muted: #fda4af;
-  --face-text-cell: #f8fafc;
-  --face-text-desc: #cbd5e1;
-  --face-danger: #fb7185;
-  --face-warning: #fca5a5;
-}
-```
-
-## System Integration
-- The face binds `--text-primary` with fallback to `var(--face-text)`.
-- The face binds `--border` with fallback to `var(--face-accent-glow)`.
-- All clickable elements enforce a minimum height of 44px for touch ergonomics.
-- Reduced motion styles suppress animation when requested by system settings.

package/scaffold/.agent/skills/total-recall/plugins/security/ui/card.js

@@ -1,396 +0,0 @@
-export class SecuritySecurityCard extends HTMLElement {
-  connectedCallback() {
-    if (this.shadowRoot) return;
-    const root = this.attachShadow({ mode: 'open' });
-    root.innerHTML = `
-      <style>
-        :host {
-          --face-bg: #180d11;
-          --face-bg-subtle: #251017;
-          --face-bg-surface: #11070a;
-          --face-bg-table: #0d0508;
-          --face-bg-code: #0a0406;
-          --face-accent: #f43f5e;
-          --face-accent-hover: rgba(244, 63, 94, 0.22);
-          --face-accent-glow: rgba(244, 63, 94, 0.35);
-          --face-border-subtle: rgba(244, 63, 94, 0.28);
-          --face-border-faint: rgba(244, 63, 94, 0.2);
-          --face-border-cell: rgba(244, 63, 94, 0.15);
-          --face-border-alert: rgba(244, 63, 94, 0.25);
-          --face-text: #f1f5f9;
-          --face-text-heading: #fecdd3;
-          --face-text-muted: #fda4af;
-          --face-text-cell: #f8fafc;
-          --face-text-desc: #cbd5e1;
-          --face-danger: #fb7185;
-          --face-warning: #fca5a5;
-
-          display: block;
-          font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
-          color: var(--text-primary, var(--face-text));
-          background: var(--face-bg);
-          border: 1px solid var(--border, var(--face-accent-glow));
-          border-radius: 10px;
-          padding: 18px;
-          box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
-          box-sizing: border-box;
-          overflow: hidden;
-        }
-
-        header {
-          display: flex;
-          align-items: center;
-          gap: 12px;
-          margin-bottom: 12px;
-        }
-
-        .brand-icon {
-          width: 32px;
-          height: 38px;
-          color: var(--face-accent);
-          flex-shrink: 0;
-        }
-
-        .title-block {
-          display: flex;
-          flex-direction: column;
-          gap: 2px;
-        }
-
-        h2 {
-          margin: 0;
-          font-size: 16px;
-          font-weight: 700;
-          letter-spacing: 0.03em;
-          text-transform: uppercase;
-          color: var(--face-text-heading);
-        }
-
-        p.desc {
-          margin: 0 0 14px 0;
-          color: var(--face-text-muted);
-          font-size: 12px;
-          line-height: 1.5;
-        }
-
-        nav {
-          display: flex;
-          gap: 6px;
-          flex-wrap: wrap;
-          margin-top: 8px;
-        }
-
-        nav:first-of-type {
-          margin-top: 0;
-        }
-
-        button, input, select {
-          min-height: 44px;
-          border: 1px solid var(--face-border-subtle);
-          border-radius: 6px;
-          padding: 8px 12px;
-          background: var(--face-bg-subtle);
-          color: var(--face-text);
-          font-size: 11px;
-          font-weight: 600;
-          letter-spacing: 0.02em;
-          box-sizing: border-box;
-        }
-
-        button {
-          cursor: pointer;
-          text-transform: uppercase;
-          transition: background 0.15s ease, border-color 0.15s ease;
-        }
-
-        button:hover {
-          background: var(--face-accent-hover);
-          border-color: var(--face-accent);
-        }
-
-        button:active {
-          transform: translateY(1px);
-        }
-
-        button:disabled, input:disabled, select:disabled {
-          opacity: 0.5;
-          cursor: not-allowed;
-        }
-
-        input {
-          min-width: 0;
-          flex: 1;
-          font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
-          background: var(--face-bg-surface);
-        }
-
-        input:focus, select:focus {
-          border-color: var(--face-accent);
-          outline: none;
-          box-shadow: 0 0 0 1px var(--face-accent-glow);
-        }
-
-        select {
-          background: var(--face-bg-surface);
-          cursor: pointer;
-        }
-
-        #state {
-          margin: 14px 0 8px 0;
-          font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
-          font-size: 11px;
-          font-weight: 700;
-          color: var(--face-danger);
-          background: var(--face-bg-surface);
-          padding: 6px 10px;
-          border-radius: 4px;
-          border: 1px solid var(--face-border-faint);
-        }
-
-        .scroll {
-          overflow-x: auto;
-          margin-bottom: 10px;
-          border-radius: 6px;
-          border: 1px solid var(--face-border-faint);
-        }
-
-        table {
-          width: 100%;
-          border-collapse: collapse;
-          font-size: 11px;
-          background: var(--face-bg-table);
-        }
-
-        th {
-          background: var(--face-bg-subtle);
-          color: var(--face-text-heading);
-          font-weight: 700;
-          text-transform: uppercase;
-          letter-spacing: 0.04em;
-          padding: 8px 10px;
-          border-bottom: 1px solid var(--face-border-subtle);
-          text-align: left;
-        }
-
-        td {
-          padding: 8px 10px;
-          text-align: left;
-          border-bottom: 1px solid var(--face-border-cell);
-          vertical-align: top;
-          color: var(--face-text-cell);
-        }
-
-        td:first-child {
-          font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
-          font-weight: 600;
-          color: var(--face-text-muted);
-        }
-
-        td:last-child {
-          line-height: 1.45;
-          color: var(--face-text-desc);
-        }
-
-        pre {
-          background: var(--face-bg-code);
-          border: 1px solid var(--face-border-faint);
-          border-radius: 6px;
-          padding: 8px 10px;
-          font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
-          font-size: 10.5px;
-          line-height: 1.45;
-          color: var(--face-danger);
-          white-space: pre-wrap;
-          overflow-wrap: anywhere;
-          max-height: 160px;
-          overflow-y: auto;
-          margin: 0;
-        }
-
-        #device-review {
-          background: var(--face-bg-surface);
-          border: 1px solid var(--face-border-alert);
-          border-radius: 6px;
-          padding: 10px;
-          margin-top: 10px;
-        }
-
-        #device-review p {
-          margin: 0 0 8px 0;
-          font-size: 11px;
-          color: var(--face-warning);
-        }
-
-        #device-checks label {
-          display: block;
-          margin-bottom: 8px;
-        }
-
-        #device-checks label p {
-          margin: 0 0 4px 0;
-          font-size: 11px;
-          color: var(--face-text-heading);
-          font-weight: 600;
-        }
-
-        @media (prefers-reduced-motion: reduce) {
-          button, input, select {
-            transition: none !important;
-          }
-        }
-      </style>
-
-      <header>
-        <svg class="brand-icon" viewBox="0 0 32 38" fill="none" aria-hidden="true">
-          <path d="M16 2 29 8v11c0 8-7 14-13 17C10 33 3 27 3 19V8Z" stroke="currentColor" stroke-width="2"/>
-          <path d="m9 19 5 5 10-12" stroke="currentColor" stroke-width="2"/>
-        </svg>
-        <div class="title-block">
-          <h2>Security Assessments</h2>
-        </div>
-      </header>
-
-      <p class="desc">Inspect this machine or your mesh. Review firewall, SSH, disk protection, and listening services with concrete remediation.</p>
-
-      <nav>
-        <button data-action="machine">This machine</button>
-        <button data-action="fleet">Mesh fleet</button>
-        <button data-action="plugins">Plugin audit</button>
-        <button data-action="harden">Hardening plan</button>
-      </nav>
-
-      <nav>
-        <input id="target" aria-label="Machine name" placeholder="Optional mesh machine name">
-        <button id="selected">Audit selected</button>
-      </nav>
-
-      <nav>
-        <input id="website" type="url" aria-label="Authorized HTTPS website" placeholder="https://your-site.example">
-        <button id="probe">Check website</button>
-      </nav>
-
-      <nav>
-        <input id="source" aria-label="Source directory" placeholder="Source directory">
-        <button id="scan">Scan source</button>
-        <button id="permissions">Repair SSH permissions</button>
-      </nav>
-
-      <nav>
-        <select id="platform" aria-label="Device platform">
-          <option value="ios">iPhone</option>
-          <option value="ipados">iPad</option>
-          <option value="android">Android</option>
-          <option value="chromeos">Chromebook</option>
-          <option value="chromeos-flex">ChromeOS Flex</option>
-          <option value="windows">Windows</option>
-        </select>
-        <input id="device" aria-label="Device label" placeholder="Device label (no passwords)">
-        <button id="review-device">Review device</button>
-      </nav>
-
-      <section id="device-review" hidden>
-        <p>Manual device review — answers are your observations, not an automatic scan. Unknown checks remain unverified. Never enter passwords or recovery keys.</p>
-        <div id="device-checks"></div>
-        <button id="evaluate-device">Evaluate review</button>
-      </section>
-
-      <nav>
-        <input id="android-serial" aria-label="Already authorized Android serial" placeholder="Already authorized Android serial">
-        <button id="android-check">Read Android properties</button>
-      </nav>
-
-      <div id="state" role="status">Not audited</div>
-
-      <div class="scroll">
-        <table hidden>
-          <thead>
-            <tr><th>Check / machine</th><th>State</th><th>Remediation / coverage</th></tr>
-          </thead>
-          <tbody></tbody>
-        </table>
-      </div>
-
-      <pre id="details"></pre>
-    `;
-
-    root.querySelectorAll('[data-action]').forEach(button => button.addEventListener('click', () => this.execute(button.dataset.action)));
-    root.querySelector('#selected').addEventListener('click', () => {
-      const target = root.querySelector('#target').value.trim();
-      if (!target) { root.querySelector('#state').textContent = 'Enter a discovered machine name'; return; }
-      this.execute('fleet', ['--target', target]);
-    });
-    root.querySelector('#probe').addEventListener('click', () => {
-      const website = root.querySelector('#website').value.trim();
-      try {
-        const url = new URL(website);
-        if (url.protocol !== 'https:' || url.username || url.password || url.search || url.hash) throw new Error();
-      } catch { root.querySelector('#state').textContent = 'Enter an authorized HTTPS URL without credentials or query'; return; }
-      this.execute('probe', ['--url', website]);
-    });
-    root.querySelector('#scan').addEventListener('click', () => {
-      const source = root.querySelector('#source').value.trim();
-      if (!source) { root.querySelector('#state').textContent = 'Enter a source directory'; return; }
-      this.execute('scan', [source]);
-    });
-    root.querySelector('#permissions').addEventListener('click', () => this.execute('machine', ['--apply-permissions']));
-    const resetReview = () => { root.querySelector('#device-review').hidden = true; root.querySelector('#device-checks').replaceChildren(); };
-    root.querySelector('#platform').addEventListener('change', resetReview);
-    root.querySelector('#device').addEventListener('input', resetReview);
-    const identity = () => ['--platform', root.querySelector('#platform').value, '--device', root.querySelector('#device').value.trim()];
-    root.querySelector('#review-device').addEventListener('click', () => this.execute('device', identity()));
-    root.querySelector('#evaluate-device').addEventListener('click', () => {
-      const observations = {};
-      root.querySelectorAll('#device-checks select').forEach(select => { if (select.dataset.observedAt) observations[select.dataset.check] = { status: select.value, observedAt: select.dataset.observedAt }; });
-      this.execute('device', [...identity(), '--answers-json', JSON.stringify(observations)]);
-    });
-    root.querySelector('#android-check').addEventListener('click', () => this.execute('android', ['--serial', root.querySelector('#android-serial').value.trim()]));
-  }
-
-  async execute(action, args = []) {
-    const root = this.shadowRoot;
-    const state = root.querySelector('#state');
-    const details = root.querySelector('#details');
-    root.querySelectorAll('button,input,select').forEach(button => { button.disabled = true; });
-    state.textContent = 'Checking…';
-    details.textContent = '';
-    root.querySelector('tbody').replaceChildren();
-    root.querySelector('table').hidden = true;
-    try {
-      if (!this.host?.run) throw new Error('Security runtime is unavailable');
-      let response;
-      try { response = await this.host.run(action, [...args, '--json']); }
-      catch (error) {
-        try { response = JSON.parse(error.message); } catch { throw error; }
-      }
-      const report = typeof response === 'string' ? JSON.parse(response) : typeof response?.output === 'string' ? JSON.parse(response.output) : response;
-      if (!report || typeof report !== 'object') throw new Error('No audit report returned');
-      if (report.status === 'failed') throw new Error(report.error);
-      if (report.schema === 'security-device/v1' && !args.includes('--answers-json')) {
-        const form = root.querySelector('#device-checks'); form.replaceChildren();
-        for (const check of report.checks) {
-          const label = document.createElement('label'); label.style.display = 'block';
-          const title = document.createElement('p'); title.textContent = `${check.title}: ${check.remediation}`;
-          const select = document.createElement('select'); select.dataset.check = check.id; select.setAttribute('aria-label', check.title);
-          for (const [value, text] of [['unknown', 'Not checked'], ['secure', 'Reviewed — protection confirmed'], ['needs-attention', 'Needs attention']]) { const option = document.createElement('option'); option.value = value; option.textContent = text; select.append(option); }
-          select.addEventListener('change', () => { select.dataset.observedAt = new Date().toISOString(); });
-          label.append(title, select); form.append(label);
-        }
-        root.querySelector('#device-review').hidden = false;
-      }
-      state.textContent = `${report.status || (report.total_findings ? 'Findings require review' : 'Audit returned')} · ${report.timestamp || 'No observation timestamp supplied'}`;
-      const rows = report.checks?.map(check => [check.id, check.state, check.remediation || check.reason || 'Observed']) || report.machines?.map(machine => [machine.hostname, machine.report?.status || machine.state, machine.reason || `${machine.report.coverage.observed}/${machine.report.coverage.total} checks observed`]) || [];
-      if (rows.length) {
-        root.querySelector('table').hidden = false;
-        for (const row of rows) {
-          const tr = document.createElement('tr');
-          row.forEach(value => { const td = document.createElement('td'); td.textContent = value; tr.append(td); });
-          root.querySelector('tbody').append(tr);
-        }
-      }
-      details.textContent = JSON.stringify(report, null, 2);
-    } catch (error) { state.textContent = 'Audit unavailable'; details.textContent = error.message; }
-    finally { root.querySelectorAll('button,input,select').forEach(button => { button.disabled = false; }); }
-  }
-}
-
-if (!customElements.get('tr-security-card')) customElements.define('tr-security-card', SecuritySecurityCard);

package/scaffold/.agent/skills/total-recall/plugins/security/ui/panel.js

@@ -1,98 +0,0 @@
-export class SecuritySecurityCard extends HTMLElement {
-  connectedCallback() {
-    if (this.shadowRoot) return;
-    const root = this.attachShadow({ mode: 'open' });
-    root.innerHTML = `<style>
-      :host{display:block;color:#edf3fa;background:#16222e;font:14px system-ui;border-radius:12px;padding:18px}header{display:flex;align-items:center;gap:12px}svg{width:32px;height:38px;color:#73d6bf}h2{margin:0;font-size:20px}p{color:#bbcad6;line-height:1.5}nav{display:flex;gap:8px;flex-wrap:wrap}button,input,select{min-height:44px;border:1px solid #71928e;border-radius:6px;padding:8px 12px;background:#213644;color:inherit}button{cursor:pointer}button:disabled{opacity:.5}input{min-width:0;flex:1}#state{margin:14px 0;color:#73d6bf}table{width:100%;border-collapse:collapse}td,th{padding:10px 6px;text-align:left;border-bottom:1px solid #3a4e5c;vertical-align:top}td:last-child{line-height:1.5}pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:360px;overflow:auto}.scroll{overflow:auto}
-      </style><header><svg viewBox="0 0 32 38" fill="none" aria-hidden="true"><path d="M16 2 29 8v11c0 8-7 14-13 17C10 33 3 27 3 19V8Z" stroke="currentColor" stroke-width="2"/><path d="m9 19 5 5 10-12" stroke="currentColor" stroke-width="2"/></svg><h2>Security Assessments</h2></header>
-      <p>Inspect this machine or your mesh. Review firewall, SSH, disk protection, and listening services with concrete remediation.</p>
-      <nav><button data-action="machine">This machine</button><button data-action="fleet">Mesh fleet</button><button data-action="plugins">Plugin audit</button><button data-action="harden">Hardening plan</button></nav>
-      <nav style="margin-top:10px"><input id="target" aria-label="Machine name" placeholder="Optional mesh machine name"><button id="selected">Audit selected</button></nav>
-      <nav style="margin-top:10px"><input id="website" type="url" aria-label="Authorized HTTPS website" placeholder="https://your-site.example"><button id="probe">Check website</button></nav>
-      <nav style="margin-top:10px"><input id="source" aria-label="Source directory" placeholder="Source directory"><button id="scan">Scan source</button><button id="permissions">Repair local SSH permissions</button></nav>
-      <nav style="margin-top:10px"><select id="platform" aria-label="Device platform"><option value="ios">iPhone</option><option value="ipados">iPad</option><option value="android">Android</option><option value="chromeos">Chromebook</option><option value="chromeos-flex">ChromeOS Flex</option><option value="windows">Windows</option></select><input id="device" aria-label="Device label" placeholder="Device label (no passwords)"><button id="review-device">Review device</button></nav>
-      <section id="device-review" hidden><p>Manual device review — answers are your observations, not an automatic scan. Unknown checks remain unverified. Never enter passwords or recovery keys.</p><div id="device-checks"></div><button id="evaluate-device">Evaluate review</button></section>
-      <nav style="margin-top:10px"><input id="android-serial" aria-label="Already authorized Android serial" placeholder="Already authorized Android serial"><button id="android-check">Read Android properties</button></nav>
-      <div id="state" role="status">Not audited</div><div class="scroll"><table hidden><thead><tr><th>Check / machine</th><th>State</th><th>Remediation / coverage</th></tr></thead><tbody></tbody></table></div><pre id="details"></pre>`;
-    root.querySelectorAll('[data-action]').forEach(button => button.addEventListener('click', () => this.execute(button.dataset.action)));
-    root.querySelector('#selected').addEventListener('click', () => {
-      const target = root.querySelector('#target').value.trim();
-      if (!target) { root.querySelector('#state').textContent = 'Enter a discovered machine name'; return; }
-      this.execute('fleet', ['--target', target]);
-    });
-    root.querySelector('#probe').addEventListener('click', () => {
-      const website = root.querySelector('#website').value.trim();
-      try {
-        const url = new URL(website);
-        if (url.protocol !== 'https:' || url.username || url.password || url.search || url.hash) throw new Error();
-      } catch { root.querySelector('#state').textContent = 'Enter an authorized HTTPS URL without credentials or query'; return; }
-      this.execute('probe', ['--url', website]);
-    });
-    root.querySelector('#scan').addEventListener('click', () => {
-      const source = root.querySelector('#source').value.trim();
-      if (!source) { root.querySelector('#state').textContent = 'Enter a source directory'; return; }
-      this.execute('scan', [source]);
-    });
-    root.querySelector('#permissions').addEventListener('click', () => this.execute('machine', ['--apply-permissions']));
-    const resetReview = () => { root.querySelector('#device-review').hidden = true; root.querySelector('#device-checks').replaceChildren(); };
-    root.querySelector('#platform').addEventListener('change', resetReview);
-    root.querySelector('#device').addEventListener('input', resetReview);
-    const identity = () => ['--platform', root.querySelector('#platform').value, '--device', root.querySelector('#device').value.trim()];
-    root.querySelector('#review-device').addEventListener('click', () => this.execute('device', identity()));
-    root.querySelector('#evaluate-device').addEventListener('click', () => {
-      const observations = {};
-      root.querySelectorAll('#device-checks select').forEach(select => { if (select.dataset.observedAt) observations[select.dataset.check] = { status: select.value, observedAt: select.dataset.observedAt }; });
-      this.execute('device', [...identity(), '--answers-json', JSON.stringify(observations)]);
-    });
-    root.querySelector('#android-check').addEventListener('click', () => this.execute('android', ['--serial', root.querySelector('#android-serial').value.trim()]));
-  }
-  async execute(action, args = []) {
-    const root = this.shadowRoot;
-    const state = root.querySelector('#state');
-    const details = root.querySelector('#details');
-    root.querySelectorAll('button,input,select').forEach(button => { button.disabled = true; });
-    state.textContent = 'Checking…';
-    details.textContent = '';
-    root.querySelector('tbody').replaceChildren();
-    root.querySelector('table').hidden = true;
-    try {
-      if (!this.host?.run) throw new Error('Security runtime is unavailable');
-      let response;
-      try { response = await this.host.run(action, [...args, '--json']); }
-      catch (error) {
-        try { response = JSON.parse(error.message); } catch { throw error; }
-      }
-      const report = typeof response === 'string' ? JSON.parse(response) : typeof response?.output === 'string' ? JSON.parse(response.output) : response;
-      if (!report || typeof report !== 'object') throw new Error('No audit report returned');
-      if (report.status === 'failed') throw new Error(report.error);
-      if (report.schema === 'security-device/v1' && !args.includes('--answers-json')) {
-        const form = root.querySelector('#device-checks'); form.replaceChildren();
-        for (const check of report.checks) {
-          const label = document.createElement('label'); label.style.display = 'block';
-          const title = document.createElement('p'); title.textContent = `${check.title}: ${check.remediation}`;
-          const select = document.createElement('select'); select.dataset.check = check.id; select.setAttribute('aria-label', check.title);
-          for (const [value, text] of [['unknown', 'Not checked'], ['secure', 'Reviewed — protection confirmed'], ['needs-attention', 'Needs attention']]) { const option = document.createElement('option'); option.value = value; option.textContent = text; select.append(option); }
-          select.addEventListener('change', () => { select.dataset.observedAt = new Date().toISOString(); });
-          label.append(title, select); form.append(label);
-        }
-        root.querySelector('#device-review').hidden = false;
-      }
-      state.textContent = `${report.status || (report.total_findings ? 'Findings require review' : 'Audit returned')} · ${report.timestamp || 'No observation timestamp supplied'}`;
-      const rows = report.checks?.map(check => [check.id, check.state, check.remediation || check.reason || 'Observed']) || report.machines?.map(machine => [machine.hostname, machine.report?.status || machine.state, machine.reason || `${machine.report.coverage.observed}/${machine.report.coverage.total} checks observed`]) || [];
-      if (rows.length) {
-        root.querySelector('table').hidden = false;
-        for (const row of rows) {
-          const tr = document.createElement('tr');
-          row.forEach(value => { const td = document.createElement('td'); td.textContent = value; tr.append(td); });
-          root.querySelector('tbody').append(tr);
-        }
-      }
-      details.textContent = JSON.stringify(report, null, 2);
-    } catch (error) { state.textContent = 'Audit unavailable'; details.textContent = error.message; }
-    finally { root.querySelectorAll('button,input,select').forEach(button => { button.disabled = false; }); }
-  }
-}
-if (!customElements.get('tr-security-card')) customElements.define('tr-security-card', SecuritySecurityCard);
-
-class SecurityPanel extends SecuritySecurityCard {}
-if (!customElements.get('security-panel')) customElements.define('security-panel', SecurityPanel);

package/scaffold/.agent/skills/total-recall/plugins/ssss/ui/DESIGN.md

@@ -1,15 +0,0 @@
-# SSSS workbench
-
-Operators use this face to inspect an installation, verify a document or registry lock, and prepare a new project. The first screen shows the engine and spec versions alongside separate skill and scaffold results. A failure names the affected part and the last attempt.
-
-An amber spine connects the two installation layers to the engine identity. The verification controls are grouped by artifact, with a scrollable result below. This matches the work of examining a contract and its evidence. The scaffold action has its own path field and creates a new directory. Repair restores the selected brain's managed files and preserves its skill wrapper.
-
-The mark is a set of four offset strokes sharing a spine. The panel uses ink, parchment and amber with a monospace reading for file paths and integrity pins. A short movement on result changes draws attention to the current verdict and respects reduced motion.
-
-tokens:
-  color: "#b98439"
-  accent: "#f4c97a"
-  font: "ibm-plex"
-  density: "compact"
-  radius: "sm"
-  header: "ledger-rule"