feat: add branded 404 page

tests/notFound.test.js

@@ -0,0 +1,50 @@
+import test from 'node:test';
+import assert from 'node:assert/strict';
+import fs from 'node:fs';
+import { renderNotFound } from '../src/seo.js';
+
+const template = fs.readFileSync(new URL('../public/404.html', import.meta.url), 'utf8');
+const page = renderNotFound({
+  template,
+  baseUrl: 'https://memes.example',
+  pathname: '/missing-node'
+});
+const styles = fs.readFileSync(new URL('../public/assets/styles.css', import.meta.url), 'utf8');
+const artwork = fs.readFileSync(new URL('../public/assets/homo-reseticus-404.png', import.meta.url));
+
+test('404 page is noindexed and links visitors back to the live feed', () => {
+  assert.match(page, /<title>404 \| The Meme Protocol<\/title>/);
+  assert.match(page, /<meta name="robots" content="noindex,nofollow,noarchive">/);
+  assert.match(page, /class="primary-action not-found-action" href="\/"/);
+  assert.doesNotMatch(page, /PAGE_NOT_FOUND/);
+  assert.doesNotMatch(page, /THE_REQUESTED_NODE_DOES_NOT_EXIST/);
+});
+
+test('404 page carries adjusted site discovery and social metadata', () => {
+  assert.match(page, /<meta name="application-name" content="The Meme Protocol">/);
+  assert.match(page, /<link rel="manifest" href="\/site\.webmanifest\?v=20260814">/);
+  assert.match(page, /<link rel="service-desc"[^>]+href="\/openapi\.json">/);
+  assert.match(page, /<link rel="help"[^>]+href="\/meme-api\.skill\.md">/);
+  assert.match(page, /<meta property="og:url" content="https:\/\/memes\.example\/missing-node">/);
+  assert.match(page, /<meta property="og:image" content="https:\/\/memes\.example\/assets\/homo-reseticus-404\.png">/);
+  assert.match(page, /<meta name="twitter:card" content="summary_large_image">/);
+  assert.doesNotMatch(page, /<link rel="canonical"/);
+});
+
+test('404 page keeps the homepage protocol menu and replaces its live status', () => {
+  assert.match(page, /class="status-line"/);
+  assert.match(page, />DOWNLOAD PET<\/a>/);
+  assert.match(page, />READ LORE<\/a>/);
+  assert.match(page, /ERROR_404 \/\/ NODE_UNREACHABLE/);
+});
+
+test('404 page uses the supplied artwork with a diffused backdrop', () => {
+  assert.match(page, /src="\/assets\/homo-reseticus-404\.png"/);
+  assert.match(page, /alt="Homo Reseticus surrounded by an unreachable node pattern"/);
+  assert.match(styles, /\.not-found-visual::before/);
+  assert.match(styles, /radial-gradient\(/);
+  assert.match(styles, /filter: blur\(36px\)/);
+  assert.match(styles, /transform: scale\(1\.24\)/);
+  assert.match(styles, /\.not-found-page \.pulse/);
+  assert.equal(artwork.subarray(1, 4).toString('ascii'), 'PNG');
+});