Index: src/assets/css/guardian2.css
===================================================================
--- src/assets/css/guardian2.css	(revision c1f5c23957130368f24ac295ed6f9963cc925c18)
+++ src/assets/css/guardian2.css	(revision c1f5c23957130368f24ac295ed6f9963cc925c18)
@@ -0,0 +1,84 @@
+/* Guardian PWA (FEP-633c): its own calm, dark surface; the buoy orange is
+   the accent. Standalone: this page never inherits the site theme. */
+:root {
+  --bg: #141a24;
+  --card: #1e2632;
+  --ink: #e8ecf2;
+  --sub: #93a0b4;
+  --line: #2c3646;
+  --accent: #ff6b35;
+  --ok: #4caf7d;
+}
+* { box-sizing: border-box; }
+body {
+  margin: 0;
+  background: var(--bg);
+  color: var(--ink);
+  font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+  padding-bottom: 48px;
+}
+.g-head {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 16px;
+  background: var(--card);
+  border-bottom: 1px solid var(--line);
+  position: sticky;
+  top: 0;
+  z-index: 2;
+}
+.g-head-txt { flex: 1; }
+.g-head h1 { font-size: 1.15rem; margin: 0; }
+.g-head .g-sub { margin: 0; color: var(--sub); font-size: .78rem; }
+.g-buoy { font-size: 1.7rem; }
+.g-me { color: var(--sub); font-size: .85rem; }
+#site-picker {
+  background: var(--bg); color: var(--ink);
+  border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px;
+}
+main { max-width: 640px; margin: 0 auto; padding: 8px 16px; }
+
+section { padding: 18px 0; border-bottom: 1px solid var(--line); }
+section:last-child { border-bottom: 0; }
+.g-sec-head { display: flex; align-items: center; gap: 8px; }
+.g-sec-head h2 { font-size: 1.02rem; margin: 0; }
+.g-badge {
+  background: var(--accent); color: #fff; font-size: .72rem; font-weight: 700;
+  min-width: 20px; text-align: center; border-radius: 10px; padding: 1px 7px;
+}
+.g-sec-sub { color: var(--sub); font-size: .84rem; margin: 4px 0 12px; }
+.g-empty { color: var(--sub); font-size: .9rem; margin: 6px 0 0; }
+.g-msg { font-size: .85rem; color: var(--ok); margin: 8px 0 0; }
+.g-msg.err { color: #ff7a7a; }
+.g-list { display: flex; flex-direction: column; gap: 8px; }
+
+.g-card { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; }
+.g-card.help { border-left: 3px solid var(--accent); }
+.g-card .row { display: flex; align-items: center; gap: 10px; }
+.g-card .row .grow { flex: 1; min-width: 0; }
+.g-card .who { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.g-card .when { color: var(--sub); font-size: .76rem; white-space: nowrap; }
+.g-card .body { margin-top: 8px; font-size: .92rem; overflow-wrap: anywhere; }
+.g-card .body img { max-width: 100%; border-radius: 8px; margin-top: 6px; }
+.g-link { display: inline-block; margin-top: 8px; color: var(--accent); font-size: .82rem; text-decoration: none; }
+
+.tag { font-size: .72rem; font-weight: 600; padding: 3px 9px; border-radius: 20px; white-space: nowrap; }
+.tag.wait { background: #3a2f1a; color: #e8b04b; }
+.tag.ok { background: #17301f; color: var(--ok); }
+.tag.co { background: #2a1f3a; color: #c39bff; }
+
+#adopt-form { display: flex; gap: 8px; }
+#adopt-form input {
+  flex: 1; min-width: 0;
+  background: var(--bg); color: var(--ink);
+  border: 1px solid var(--line); border-radius: 10px; padding: 11px 12px;
+}
+button {
+  background: var(--accent); color: #fff; border: 0;
+  border-radius: 10px; padding: 11px 18px; font-weight: 600; cursor: pointer;
+}
+button:disabled { opacity: .5; cursor: default; }
+button.quiet { background: transparent; color: var(--sub); border: 1px solid var(--line); font-weight: 500; }
+button.quiet.is-on { color: var(--ok); border-color: var(--ok); }
+button.small { padding: 6px 12px; font-size: .82rem; }
Index: src/assets/js/guardian2.js
===================================================================
--- src/assets/js/guardian2.js	(revision c1f5c23957130368f24ac295ed6f9963cc925c18)
+++ src/assets/js/guardian2.js	(revision c1f5c23957130368f24ac295ed6f9963cc925c18)
@@ -0,0 +1,237 @@
+/* Guardian PWA client (FEP-633c): renders the dashboard, adopts wards, and
+   manages the guardian push channel. No framework, no inline scripts (CSP).
+   All user-facing text comes from state.strings (server i18n). */
+(function () {
+  'use strict';
+  // A crash here used to fail silently (buttons just do nothing). Surface it on
+  // the page AND the console so the cause is visible instead of "everything hangs".
+  function fatal(msg) {
+    try {
+      var b = document.getElementById('g-fatal') || document.createElement('div');
+      b.id = 'g-fatal'; b.className = 'g-msg err';
+      b.style.cssText = 'display:block;margin:12px 0;padding:10px 14px';
+      b.textContent = 'Guardian: ' + msg;
+      var root = document.querySelector('main') || document.body;
+      if (!b.parentNode && root) root.insertBefore(b, root.firstChild);
+    } catch (e) { /* last resort */ }
+    try { console.error('[guardian]', msg); } catch (e) { /* no console */ }
+  }
+  try {
+  var S = JSON.parse(document.getElementById('guardian-state').textContent || '{}');
+  var T = S.strings || {};
+
+  function el(tag, cls, text) {
+    var n = document.createElement(tag);
+    if (cls) n.className = cls;
+    if (text != null) n.textContent = text;
+    return n;
+  }
+  function handleOf(uri, cached) {
+    if (cached && cached.charAt(0) === '@') return cached;   // trust only real @handles
+    try { var u = new URL(uri); return '@' + u.pathname.split('/').filter(Boolean).pop() + '@' + u.host; }
+    catch (e) { return uri; }
+  }
+  function when(s) { return String(s || '').slice(0, 16).replace('T', ' '); }
+  function show(id, on) { document.getElementById(id).hidden = !on; }
+
+  // ── 1. Help requests ───────────────────────────────────────────────────
+  function renderHelp() {
+    var list = document.getElementById('help-list');
+    list.textContent = '';
+    var help = S.help || [];
+    help.forEach(function (h) {
+      var card = el('div', 'g-card help');
+      var row = el('div', 'row');
+      row.appendChild(el('span', 'who grow', h.actor_name || handleOf(h.actor_uri, h.actor_handle)));
+      row.appendChild(el('span', 'when', when(h.published || h.created_at)));
+      card.appendChild(row);
+      var body = el('div', 'body');
+      body.innerHTML = h.content || '';          // sanitized server-side on ingest
+      card.appendChild(body);
+      if (h.note_url) {
+        var a = el('a', 'g-link', T.open || 'open');
+        a.href = h.note_url; a.target = '_blank'; a.rel = 'noopener';
+        card.appendChild(a);
+      }
+      list.appendChild(card);
+    });
+    var badge = document.getElementById('help-count');
+    badge.textContent = help.length; badge.hidden = help.length === 0;
+    show('help-empty', help.length === 0);
+  }
+
+  // ── 3. Offers I am a party to (sent, or a co-guardianship to co-approve) ─
+  function answer(offerId, decision, btn) {
+    if (btn) btn.disabled = true;
+    fetch('/guardian2/offer', {
+      method: 'POST', headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ offer: offerId, answer: decision, site: S.site }),
+    }).then(refresh);
+  }
+  function offerCard(o) {
+    var card = el('div', 'g-card');
+    var row = el('div', 'row');
+    var subject = o['shaer:iAmCandidate']
+      ? handleOf(o['shaer:ward'], o['shaer:wardHandle'])            // my sent offer: about the ward
+      : handleOf(o['shaer:candidate'], o['shaer:candidateHandle']); // co-guard: who wants in
+    row.appendChild(el('span', 'who grow', subject));
+    if (o['shaer:iAmCandidate']) {
+      // My own offer, waiting for the others to accept.
+      row.appendChild(el('span', 'tag wait', T.pending));
+      var rt = el('button', 'quiet small', T.retract);
+      rt.addEventListener('click', function () { answer(o.id, 'reject', rt); });
+      row.appendChild(rt);
+    } else if (o['shaer:needsMyAccept']) {
+      // A co-guardianship offer for a ward I already guard: my call.
+      row.appendChild(el('span', 'tag co', T.coguard));
+      var ac = el('button', 'small', T.accept);
+      ac.addEventListener('click', function () { answer(o.id, 'accept', ac); });
+      var rj = el('button', 'quiet small', T.reject);
+      rj.addEventListener('click', function () { answer(o.id, 'reject', rj); });
+      row.appendChild(ac); row.appendChild(rj);
+    } else {
+      row.appendChild(el('span', 'tag wait', T.awaiting_others));
+    }
+    card.appendChild(row);
+    return card;
+  }
+  function renderPending() {
+    var list = document.getElementById('pending-list');
+    list.textContent = '';
+    var offers = S.offers || [];
+    offers.forEach(function (o) { list.appendChild(offerCard(o)); });
+    show('pending-section', offers.length > 0);
+  }
+
+  // ── 4. Accepted wards ──────────────────────────────────────────────────
+  function renderWards() {
+    var list = document.getElementById('wards-list');
+    list.textContent = '';
+    var wards = S.wards || [];
+    wards.forEach(function (w) {
+      var card = el('div', 'g-card');
+      var row = el('div', 'row');
+      row.appendChild(el('span', 'who grow', handleOf(w.other_uri, w.other_handle)));
+      row.appendChild(el('span', 'tag ok', T.active));
+      var btn = el('button', 'quiet small', T.release);
+      btn.addEventListener('click', function () { remove(w.other_uri, btn); });
+      row.appendChild(btn);
+      card.appendChild(row);
+      list.appendChild(card);
+    });
+    show('wards-empty', wards.length === 0);
+  }
+
+  function remove(uri, btn) {
+    btn.disabled = true;
+    fetch('/guardian2/wards/remove', {
+      method: 'POST', headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ uri: uri, site: S.site }),
+    }).then(refresh);
+  }
+
+  function renderAll() { renderHelp(); renderPending(); renderWards(); }
+
+  function refresh() {
+    return fetch('/guardian2/api/state?site=' + encodeURIComponent(S.site))
+      .then(function (r) { return r.json(); })
+      .then(function (s) { if (s && !s.error) { S = s; T = s.strings || T; renderAll(); } });
+  }
+
+  // ── 2. Adopt ───────────────────────────────────────────────────────────
+  var form = document.getElementById('adopt-form');
+  var input = document.getElementById('adopt-handle');
+  var adoptBtn = document.getElementById('adopt-btn');
+  var msg = document.getElementById('adopt-msg');
+  function setMsg(text, isErr) { msg.hidden = false; msg.className = 'g-msg' + (isErr ? ' err' : ''); msg.textContent = text; }
+
+  form.addEventListener('submit', function (ev) {
+    ev.preventDefault();
+    var handle = input.value.trim();
+    if (!handle) return;
+    adoptBtn.disabled = true;
+    setMsg(T.sending || '…', false);
+    fetch('/guardian2/adopt', {
+      method: 'POST', headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ handle: handle, site: S.site }),
+    }).then(function (r) { return r.json().then(function (j) { return { ok: r.ok, j: j }; }); })
+      .then(function (res) {
+        adoptBtn.disabled = false;
+        if (res.ok) {
+          input.value = '';
+          // Always refresh: the offer is recorded even if delivery is still
+          // in flight. Show it under "Verzonden aanvragen".
+          setMsg(res.j.delivered === false ? T.sent_retry : T.sent, false);
+          refresh();
+        } else {
+          setMsg((res.j.error === 'not_found' ? T.not_found : T.failed) , true);
+        }
+      })
+      .catch(function () { adoptBtn.disabled = false; setMsg(T.network, true); });
+  });
+
+  // ── Site picker ────────────────────────────────────────────────────────
+  var picker = document.getElementById('site-picker');
+  if (picker) picker.addEventListener('change', function () {
+    location.href = '/guardian?site=' + encodeURIComponent(picker.value);
+  });
+
+  // ── 5. Push ────────────────────────────────────────────────────────────
+  var toggle = document.getElementById('push-toggle');
+  var pmsg = document.getElementById('push-msg');
+  function pushState() {
+    if (!('serviceWorker' in navigator) || !('PushManager' in window)) { toggle.disabled = true; return; }
+    navigator.serviceWorker.register('/sw.js').catch(function () {});
+    navigator.serviceWorker.ready
+      .then(function (reg) { return reg.pushManager.getSubscription(); })
+      .then(function (sub) {
+        toggle.textContent = sub ? toggle.dataset.onLabel : toggle.dataset.offLabel;
+        toggle.dataset.subscribed = sub ? '1' : '';
+        toggle.classList.toggle('is-on', !!sub);
+      });
+  }
+  function urlB64(base64) {
+    var pad = '='.repeat((4 - (base64.length % 4)) % 4);
+    var b = (base64 + pad).replace(/-/g, '+').replace(/_/g, '/');
+    var raw = atob(b); var arr = new Uint8Array(raw.length);
+    for (var i = 0; i < raw.length; i++) arr[i] = raw.charCodeAt(i);
+    return arr;
+  }
+  toggle.addEventListener('click', function () {
+    pmsg.hidden = true;
+    navigator.serviceWorker.ready.then(function (reg) {
+      if (toggle.dataset.subscribed) {
+        reg.pushManager.getSubscription().then(function (sub) {
+          if (!sub) return;
+          fetch('/push/unsubscribe', {
+            method: 'POST', headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ endpoint: sub.endpoint }),
+          }).then(function () { return sub.unsubscribe(); }).then(pushState);
+        });
+        return;
+      }
+      fetch('/push/vapid').then(function (r) { return r.json(); }).then(function (v) {
+        if (!v.publicKey) throw new Error('no key');
+        return reg.pushManager.subscribe({ userVisibleOnly: true, applicationServerKey: urlB64(v.publicKey) });
+      }).then(function (sub) {
+        return fetch('/push/subscribe', {
+          method: 'POST', headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({
+            subscription: sub.toJSON(),
+            alerts: { help: 1, guardian: 1, dm: 1, follow: 0, reply: 0, like: 0, boost: 0 },
+            uaLabel: 'Guardian PWA',
+          }),
+        });
+      }).then(pushState).catch(function (e) {
+        pmsg.hidden = false; pmsg.className = 'g-msg err';
+        pmsg.textContent = (T.push_unavailable || 'Push unavailable') + ': ' + e.message;
+      });
+    });
+  });
+
+  renderAll(); pushState();
+  setInterval(refresh, 45000);   // live-ish while open
+  } catch (e) {
+    fatal((e && e.message) || String(e));
+  }
+})();
Index: src/routes/guardian2.js
===================================================================
--- src/routes/guardian2.js	(revision c1f5c23957130368f24ac295ed6f9963cc925c18)
+++ src/routes/guardian2.js	(revision c1f5c23957130368f24ac295ed6f9963cc925c18)
@@ -0,0 +1,183 @@
+/**
+ * The Guardian PWA (FEP-633c): a separate, installable corner of Klonkt for
+ * guardians. One place to add and manage wards, a message centre for
+ * incoming help requests and adoption traffic, and its own push channel
+ * (alert types 'help' and 'guardian', web-push slice reused).
+ *
+ * Everything is scoped to a site the logged-in user OWNS: the guardian acts
+ * as one of their own actors (?site=slug picks one when they own several).
+ * Views carry no inline scripts (CSP): logic lives in /assets/js/guardian.js.
+ */
+import express from 'express';
+import path from 'path';
+import { fileURLToPath } from 'url';
+import db from '../config/database.js';
+import { requireAuth } from '../middleware/auth.js';
+import AP from '../services/ActivityPubService.js';
+import * as Guardianship from '../services/guardianship/index.js';
+import { t as i18nT, resolveLang } from '../services/i18n.js';
+import { injectCspNonce } from '../middleware/render.js';
+
+const router = express.Router();
+const __dir = path.dirname(fileURLToPath(import.meta.url));
+
+/** The acting site: ?site=slug when owned, else the user's first site. */
+function siteForUser(req) {
+  const userId = req.session.user.id;
+  const want = String(req.query.site || req.body?.site || '').trim();
+  if (want) {
+    const s = db.prepare('SELECT * FROM sites WHERE slug = ? AND owner_id = ?').get(want, userId);
+    if (s) return s;
+  }
+  return db.prepare('SELECT * FROM sites WHERE owner_id = ? ORDER BY id LIMIT 1').get(userId);
+}
+
+/** Everything the dashboard shows, one shape for page and API. */
+function uiStrings(L) {
+  const keys = ['sent', 'sent_retry', 'sending', 'not_found', 'failed', 'network',
+    'pending', 'active', 'retract', 'release', 'open', 'push_unavailable',
+    'accept', 'reject', 'complete', 'awaiting_others', 'coguard'];
+  return Object.fromEntries(keys.map((k) => [k, i18nT(L, `guardian.${k}`)]));
+}
+
+function dashboardState(site, L) {
+  const base = (process.env.PUBLIC_BASE_URL || '').replace(/\/+$/, '');
+  const me = AP.actorId(base, site.slug);
+  const help = db.prepare(
+    `SELECT object_uri, note_url, actor_uri, actor_name, actor_handle, actor_icon, content, published, created_at
+     FROM ap_mentions WHERE slug = ? AND help_request = 1 ORDER BY created_at DESC LIMIT 50`
+  ).all(site.slug);
+  return {
+    site: site.slug,
+    me,
+    wards: Guardianship.listWards(site.slug),               // committed wards
+    offers: Guardianship.offersCollection(`${me}/queues/offers`, site.slug, me).orderedItems,
+    help,
+    strings: uiStrings(L),
+  };
+}
+
+// ── The PWA page ─────────────────────────────────────────────────────────
+router.get('/', requireAuth, (req, res) => {
+  const site = siteForUser(req);
+  const L = resolveLang(req);
+  if (!site) return res.status(404).send('No site for this account.');
+  const sites = db.prepare('SELECT slug, title FROM sites WHERE owner_id = ? ORDER BY id').all(req.session.user.id);
+  // This standalone PWA page is rendered directly (not through renderPage), so
+  // the CSP nonce must be injected here — otherwise strict-dynamic blocks
+  // guardian.js and the whole dashboard is dead (buttons do nothing).
+  res.render('pages/guardian2', {
+    state: dashboardState(site, L),
+    sites,
+    lang: L,
+    t: (k, v) => i18nT(L, k, v),
+    cspNonce: res.locals.cspNonce,
+  }, (err, html) => {
+    if (err) { console.error('[guardian] render error', err); return res.status(500).send('Internal Server Error'); }
+    res.send(injectCspNonce(html, res.locals.cspNonce));
+  });
+});
+
+// ── JSON state for refreshes ─────────────────────────────────────────────
+router.get('/api/state', requireAuth, (req, res) => {
+  const site = siteForUser(req);
+  if (!site) return res.status(404).json({ error: 'no_site' });
+  res.json(dashboardState(site, resolveLang(req)));
+});
+
+// ── Adopt a ward: handle → resolve → C2S Offer through the same pipeline
+//    the Shaer apps use (one path, one behavior).
+router.post('/adopt', requireAuth, express.json({ limit: '4kb' }), async (req, res) => {
+  const site = siteForUser(req);
+  if (!site) return res.status(404).json({ error: 'no_site' });
+  const handle = String(req.body?.handle || '').trim();
+  if (!handle) return res.status(400).json({ error: 'empty_handle' });
+  const wardUri = /^https?:\/\//i.test(handle) ? handle : await AP.webfingerResolve(handle).catch(() => null);
+  if (!wardUri) return res.status(404).json({ error: 'not_found' });   // the handle does not resolve to an account
+  const base = (process.env.PUBLIC_BASE_URL || '').replace(/\/+$/, '');
+  const me = AP.actorId(base, site.slug);
+  const r = await AP.ingestOutboxActivity(site, req.session.user, {
+    type: 'Offer',
+    object: { type: 'Relationship', subject: wardUri, relationship: 'shaer:Guardian', object: me },
+  });
+  // 403/400 = a real refusal (e.g. you are a ward yourself); anything else the
+  // offer is recorded and delivery is retried in the background.
+  if (!r || (r.status >= 400 && r.status !== 502)) return res.status(r?.status || 500).json({ error: r?.error || 'offer_failed' });
+  res.json({ ok: true, ward: wardUri, delivered: r.delivered !== false });
+});
+
+// ── Answer an offer (co-guardian accept/reject, or the candidate's final
+//    "complete"). All three are a C2S Accept/Reject on the offer id; the
+//    handshake module decides when it commits (§3.1).
+router.post('/offer', requireAuth, express.json({ limit: '4kb' }), async (req, res) => {
+  const site = siteForUser(req);
+  if (!site) return res.status(404).json({ error: 'no_site' });
+  const offerId = String(req.body?.offer || '').trim();
+  const answer = req.body?.answer === 'reject' ? 'Reject' : 'Accept';
+  if (!offerId) return res.status(400).json({ error: 'empty_offer' });
+  const r = await AP.ingestOutboxActivity(site, req.session.user, { type: answer, object: offerId });
+  if (!r || r.status >= 400) return res.status(r?.status || 500).json({ error: r?.error || 'answer_failed' });
+  res.json({ ok: true, committed: !!r.committed, readyToCommit: !!r.readyToCommit });
+});
+
+// ── PWA assets served no-cache, so an update is never masked by the 1-year
+//    /assets cache or a stuck install (that was the whole "nothing works after
+//    a deploy" bug). Small files; the browser revalidates and gets a 304 when
+//    unchanged, the fresh file when changed.
+function pwaAsset(rel, type) {
+  return (req, res) => {
+    res.set('Cache-Control', 'no-cache');
+    res.type(type);
+    res.sendFile(path.join(__dir, '..', 'assets', rel));
+  };
+}
+router.get('/app.js', pwaAsset('js/guardian2.js', 'application/javascript'));
+router.get('/app.css', pwaAsset('css/guardian2.css', 'text/css'));
+
+// ── Manage: release a committed ward (local Undo; federation is Fase 4). ──
+router.post('/wards/remove', requireAuth, express.json({ limit: '4kb' }), (req, res) => {
+  const site = siteForUser(req);
+  if (!site) return res.status(404).json({ error: 'no_site' });
+  const uri = String(req.body?.uri || '').trim();
+  if (!uri) return res.status(400).json({ error: 'empty_uri' });
+  Guardianship.removeRelation(site.slug, 'guardian', uri);
+  res.json({ ok: true });
+});
+
+// ── The installable identity: own scope so the Guardian corner installs as
+//    its own app next to the site PWA.
+router.get('/manifest.webmanifest', (req, res) => {
+  const site = res.locals.site;
+  res.set('Cache-Control', 'no-cache');
+  res.json({
+    id: `klonkt-guardian2-${site?.slug || 'guardian'}`,
+    name: 'Klonkt Guardian',
+    short_name: 'Guardian 2',
+    description: 'Ward management and help requests for guardians.',
+    scope: '/guardian2/',
+    start_url: '/guardian?source=pwa',
+    display: 'standalone',
+    display_override: ['standalone', 'minimal-ui'],
+    orientation: 'any',
+    background_color: '#141a24',
+    theme_color: '#ff6b35',
+    lang: site?.language || 'nl',
+    icons: [
+      { src: '/guardian2/icon.svg', sizes: 'any', type: 'image/svg+xml' },
+    ],
+  });
+});
+
+// The buoy mark, in the guardian accent (mirrors the site favicon pattern).
+router.get('/icon.svg', (req, res) => {
+  const svg = `<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">
+  <rect width="64" height="64" rx="14" fill="#ff6b35"/>
+  <text x="50%" y="50%" dy="0.35em" text-anchor="middle" font-size="36">&#128735;</text>
+</svg>`;
+  res.set('Content-Type', 'image/svg+xml');
+  res.set('Cache-Control', 'public, max-age=86400');
+  res.send(svg);
+});
+
+export default router;
Index: src/server.js
===================================================================
--- src/server.js	(revision c6185fa8bf0039de95fa1be9afb9804d70c203af)
+++ src/server.js	(revision c1f5c23957130368f24ac295ed6f9963cc925c18)
@@ -50,4 +50,5 @@
 import pushRoutes from './routes/push.js';
 import guardianRoutes from './routes/guardian.js';
+import guardian2Routes from './routes/guardian2.js';
 import adminMediaRoutes from './routes/admin-media.js';
 import circleRoutes from './routes/circle.js';
@@ -408,4 +409,5 @@
 app.use('/push', pushRoutes);   // web-push subscribe/test (before the /:slug catch-all)
 app.use('/guardian', guardianRoutes);   // the Guardian PWA (FEP-633c, before the /:slug catch-all)
+app.use('/guardian2', guardian2Routes); // Guardian v2: losse guardians (guardian-only accounts), groeit hier los van v1
 app.use('/', postsRoutes);
 
Index: src/views/pages/guardian2.ejs
===================================================================
--- src/views/pages/guardian2.ejs	(revision c1f5c23957130368f24ac295ed6f9963cc925c18)
+++ src/views/pages/guardian2.ejs	(revision c1f5c23957130368f24ac295ed6f9963cc925c18)
@@ -0,0 +1,81 @@
+<!DOCTYPE html>
+<html lang="<%= lang %>">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title><%= t('guardian.app_name') %> 2</title>
+  <link rel="manifest" href="/guardian2/manifest.webmanifest">
+  <link rel="icon" href="/guardian2/icon.svg" type="image/svg+xml">
+  <meta name="theme-color" content="#ff6b35">
+  <link rel="stylesheet" href="/guardian2/app.css">
+</head>
+<body>
+  <header class="g-head">
+    <span class="g-buoy">🛟</span>
+    <div class="g-head-txt">
+      <h1><%= t('guardian.app_name') %></h1>
+      <p class="g-sub"><%= t('guardian.tagline') %></p>
+    </div>
+    <% if (sites.length > 1) { %>
+    <select id="site-picker" aria-label="<%= t('guardian.acting_as') %>">
+      <% for (const s of sites) { %>
+      <option value="<%= s.slug %>" <%= s.slug === state.site ? 'selected' : '' %>>@<%= s.slug %></option>
+      <% } %>
+    </select>
+    <% } else { %>
+    <span class="g-me" title="<%= t('guardian.acting_as') %>">@<%= state.site %></span>
+    <% } %>
+  </header>
+
+  <main>
+    <!-- 1. Berichtencentrum: hulpverzoeken. Dat is waar dit voor bestaat. -->
+    <section id="help-section">
+      <div class="g-sec-head">
+        <h2><%= t('guardian.help_title') %></h2>
+        <span id="help-count" class="g-badge" hidden></span>
+      </div>
+      <p class="g-sec-sub"><%= t('guardian.help_sub') %></p>
+      <div id="help-list" class="g-list"></div>
+      <p id="help-empty" class="g-empty"><%= t('guardian.help_empty') %></p>
+    </section>
+
+    <!-- 2. Nieuwe ward adopteren. -->
+    <section id="adopt-section">
+      <div class="g-sec-head"><h2><%= t('guardian.adopt_title') %></h2></div>
+      <p class="g-sec-sub"><%= t('guardian.adopt_sub') %></p>
+      <form id="adopt-form" autocomplete="off">
+        <input id="adopt-handle" type="text" inputmode="email" autocomplete="off"
+               placeholder="@kind@server.eu" aria-label="<%= t('guardian.adopt_label') %>">
+        <button type="submit" id="adopt-btn"><%= t('guardian.adopt_btn') %></button>
+      </form>
+      <p id="adopt-msg" class="g-msg" hidden></p>
+    </section>
+
+    <!-- 3. Verzonden aanvragen (nog niet beantwoord). -->
+    <section id="pending-section" hidden>
+      <div class="g-sec-head"><h2><%= t('guardian.pending_title') %></h2></div>
+      <p class="g-sec-sub"><%= t('guardian.pending_sub') %></p>
+      <div id="pending-list" class="g-list"></div>
+    </section>
+
+    <!-- 4. Mijn wards (geaccepteerd). -->
+    <section id="wards-section">
+      <div class="g-sec-head"><h2><%= t('guardian.wards_title') %></h2></div>
+      <div id="wards-list" class="g-list"></div>
+      <p id="wards-empty" class="g-empty"><%= t('guardian.wards_empty') %></p>
+    </section>
+
+    <!-- 5. Meldingen. -->
+    <section id="push-section">
+      <div class="g-sec-head"><h2><%= t('guardian.push_title') %></h2></div>
+      <p class="g-sec-sub"><%= t('guardian.push_sub') %></p>
+      <button id="push-toggle" class="quiet" data-on-label="<%= t('guardian.push_off') %>"
+              data-off-label="<%= t('guardian.push_on') %>"><%= t('guardian.push_on') %></button>
+      <p id="push-msg" class="g-msg" hidden></p>
+    </section>
+  </main>
+
+  <script type="application/json" id="guardian-state"><%- JSON.stringify(state) %></script>
+  <script src="/guardian2/app.js" defer></script>
+</body>
+</html>