phase-7: motion, an installable app, and a capture that survives no signal

GSAP carries the counter roll-ups, the bandeja card physics, the dialog
transitions and the three success moments FLOWS.md allows. Every one of
them checks prefers-reduced-motion first and does nothing when it is set.

boneyard and canvas-ui are not what SPEC.md's stack table says they are:
on npm the names belong to two abandoned projects that do neither job.
The skeletons were already ours; the two canvas spots are now sixty lines
each with no dependency. DECISIONS.md records the substitution.

The app installs, keeps a scan taken with no network in IndexedDB and
sends it when there is one, falls back to a page that explains itself,
and can push a deadline notice. Reading the log of what is queued is the
source of truth, so the notice clears when the capture actually lands.

The CSP now allows scripts by per-request nonce rather than by
'unsafe-inline'. That forced /offline to render per request: a
prerendered page carries a build-time nonce no live policy matches, so
its scripts were blocked and it never hydrated.

Two crashes fixed on the way. web-push throws on a VAPID subject that is
not https: or mailto:, and the code handed it APP_PUBLIC_URL, so any
machine with push keys died at boot; a misconfigured optional channel now
switches itself off and says why. And a subscription the push service
answers 410 for is deleted rather than retried forever.

Lighthouse on the production build: accessibility 100, best practices 96,
SEO 100, performance 73. The performance number is not trustworthy on
this machine and DECISIONS.md says why; total blocking time did fall from
17.6s to 1.7s once the hero canvas stopped drawing at full resolution
every frame and the landing page stopped importing GSAP.

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

apps/web/scripts/generate-icons.mjs

@@ -0,0 +1,54 @@
+/**
+ * Renders the app icons from one SVG so the set never drifts.
+ *
+ *   node apps/web/scripts/generate-icons.mjs
+ *
+ * Chromium comes with Playwright, which the repository already has for the e2e suite, so
+ * this needs no image library. The output is committed: a build must not depend on a
+ * browser being installed.
+ */
+import { chromium } from '@playwright/test';
+import { mkdir, writeFile } from 'node:fs/promises';
+import { dirname, join } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const PUBLIC_DIR = join(dirname(fileURLToPath(import.meta.url)), '..', 'public');
+
+/** Deep teal, the accent from globals.css, with the check the product is built around. */
+const svg = (size, padded) => `
+<svg xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" viewBox="0 0 512 512">
+  <rect width="512" height="512" rx="${padded ? 0 : 112}" fill="#0d6b6b"/>
+  <path d="M148 268 L222 342 L364 178"
+        fill="none" stroke="#ffffff" stroke-width="46"
+        stroke-linecap="round" stroke-linejoin="round"
+        transform="translate(256 256) scale(${padded ? 0.72 : 1}) translate(-256 -256)"/>
+</svg>`;
+
+const TARGETS = [
+  { file: 'icon-192.png', size: 192, padded: false },
+  { file: 'icon-512.png', size: 512, padded: false },
+  // Maskable icons are cropped to a circle on Android, so the mark sits inside a safe area
+  // and the background reaches every corner.
+  { file: 'icon-maskable-512.png', size: 512, padded: true },
+  { file: 'apple-touch-icon.png', size: 180, padded: true },
+];
+
+const browser = await chromium.launch();
+try {
+  await mkdir(PUBLIC_DIR, { recursive: true });
+  for (const target of TARGETS) {
+    const page = await browser.newPage({
+      viewport: { width: target.size, height: target.size },
+      deviceScaleFactor: 1,
+    });
+    await page.setContent(
+      `<body style="margin:0">${svg(target.size, target.padded)}</body>`,
+    );
+    const png = await page.screenshot({ omitBackground: true });
+    await writeFile(join(PUBLIC_DIR, target.file), png);
+    await page.close();
+    console.log(`wrote ${target.file}`);
+  }
+} finally {
+  await browser.close();
+}