feat: Y2K dither theme, filter toolbars, chat bubble widget; fix alignment root causes

- theme rework (user request): white paper bg, brown ink, ordered-dither
  halftone textures, hard offset Y2K shadows, dithered masthead bands;
  dark theme matched; token test + DECISIONS updated
- fix: .card + .card stacking margin leaked into grid layouts, shifting
  every card except the first (the 'always the first item' reports)
- fix: CSP style-src 'self' silently dropped every inline style attribute
  (misaligned save button, stat values, editor attach button, bell badge);
  styles now allow inline, scripts remain strict per §12
- fix: [hidden] is now display:none !important so flex containers cannot
  defeat it (chat panel/footers)
- board + metrics filters live in boxed .toolbar rows with baseline-aligned
  controls; metric stat cards use a uniform .stat layout
- new-conversation dialog: fixed 440px width and 180px results list (no
  more resizing while searching), full-width result rows, picked people
  drop out of the list
- floating messages bubble bottom-right on all pages (except /messages):
  unread badge, mini panel with conversation list, thread view, quick
  composer, live WS updates; toasts moved up to clear it

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

web/static/js/messages.js

@@ -230,7 +230,9 @@ const selected = new Map();
 document.getElementById('conv-new').addEventListener('click', () => {
   selected.clear();
   renderSelected();
+  document.getElementById('nc-search').value = '';
   dlg.showModal();
+  searchPeople(); // pre-fill the fixed-height list so the dialog never jumps
 });
 document.getElementById('nc-cancel').addEventListener('click', () => dlg.close());
 document.getElementById('nc-kind').addEventListener('change', (e) => {
@@ -239,21 +241,31 @@ document.getElementById('nc-kind').addEventListener('change', (e) => {
 });
 
 let searchTimer = null;
+async function searchPeople() {
+  const q = document.getElementById('nc-search').value.trim();
+  const res = await api('GET', `/api/v1/users?q=${encodeURIComponent(q)}`);
+  const host = document.getElementById('nc-results');
+  const rows = res.users.filter((u) => u.id !== meId && !selected.has(u.id)).map((u) => {
+    const b = document.createElement('button');
+    b.type = 'button';
+    b.className = 'nc-row';
+    b.setAttribute('role', 'option');
+    b.textContent = `${u.name} — ${u.email}`;
+    b.addEventListener('click', () => {
+      selected.set(u.id, u);
+      renderSelected();
+      searchPeople(); // refresh list so picked people disappear
+    });
+    return b;
+  });
+  host.replaceChildren(...rows);
+  if (!rows.length) {
+    host.innerHTML = '<p class="nc-empty">No matches — try a name or email.</p>';
+  }
+}
 document.getElementById('nc-search').addEventListener('input', () => {
   clearTimeout(searchTimer);
-  searchTimer = setTimeout(async () => {
-    const q = document.getElementById('nc-search').value.trim();
-    const res = await api('GET', `/api/v1/users?q=${encodeURIComponent(q)}`);
-    const host = document.getElementById('nc-results');
-    host.replaceChildren(...res.users.filter((u) => u.id !== meId).map((u) => {
-      const b = document.createElement('button');
-      b.type = 'button';
-      b.className = 'btn small';
-      b.textContent = `${u.name} <${u.email}>`;
-      b.addEventListener('click', () => { selected.set(u.id, u); renderSelected(); });
-      return b;
-    }));
-  }, 250);
+  searchTimer = setTimeout(searchPeople, 250);
 });
 
 function renderSelected() {