feat(site): center the 404 card and make Open the gallery the primary action

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

Author: TMHSDigital

scripts/site/404.html.j2

@@ -22,15 +22,17 @@
       align-items: center; justify-content: center; padding: 1.25rem;
       font-family: var(--font-body); line-height: 1.6; }
     main { max-width: 34rem; width: 100%; background: var(--panel); border: 1px solid var(--border);
-      border-radius: 6px; padding: 2rem 1.75rem; }
-    .hud { font-family: var(--font-mono); font-size: 0.6875rem;
+      border-radius: 6px; padding: 2.25rem 1.75rem; text-align: center; }
+    .hud { font-family: var(--font-mono); font-size: var(--fs-xs);
       letter-spacing: 0.04em; color: var(--dim); text-transform: uppercase; }
     h1 { font-family: var(--font-display); font-weight: 600;
       text-transform: uppercase; font-size: 2.4rem; line-height: 1; margin: 0.5rem 0 0.75rem; }
     p { color: var(--dim); }
-    nav { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.5rem; }
-    nav a { color: var(--select); text-decoration: none; font-weight: 500; padding: 0.25rem 0; }
-    nav a:hover { text-decoration: underline; }
+    nav { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 0.5rem 1.25rem; margin-top: 1.75rem; }
+    nav a { color: var(--dim); text-decoration: none; font-weight: 500; padding: 0.4rem 0.25rem; }
+    nav a:hover { color: var(--select); text-decoration: underline; }
+    nav a.primary { background: var(--select); color: var(--on-select); border-radius: 4px; padding: 0.6rem 1.25rem; }
+    nav a.primary:hover { text-decoration: none; filter: brightness(1.12); color: var(--on-select); }
     :focus-visible { outline: 2px solid var(--select); outline-offset: 2px; border-radius: 2px; }
   </style>
 </head>
@@ -41,7 +43,7 @@
     <p>The page may have moved, or an example may have been renamed. The gallery lists
       every example and showcase piece that ships today.</p>
     <nav>
-      <a href="{{ base }}gallery/">Open the gallery &rarr;</a>
+      <a class="primary" href="{{ base }}gallery/">Open the gallery</a>
       <a href="{{ base }}">Home</a>
       <a href="{{ site.links.github | default(plugin.repository) }}">GitHub</a>
     </nav>