feat(site,demo): OG share cards + demo page meta ahead of the HN post

Demo (web/standalone): retitle "KiCad Web" -> "PCBJam - KiCad demo", add
description + OG/Twitter tags (absolute URLs pinned to demo.pcbjam.com),
ship favicons (page had none), add the og-demo.png share card, and show an
"Early-access alpha" badge next to the home-page heading.

Site: add the missing og/og-home.png (BaseLayout referenced it but the
asset never existed -> og:image 404ed in prod) and set astro `site` so
canonical/OG URLs resolve absolutely (prerendered pages shipped
canonical=http://localhost:4321/ to production).

Cards are 1200x630, generated from the favicon.svg logo mark on a pure
white background.

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

site/astro.config.mjs

@@ -8,6 +8,9 @@ import mdx from '@astrojs/mdx';
 // per-request SSR later with `export const prerender = false;`.
 // See README.md ("SSR per route") for how.
 export default defineConfig({
+  // Canonical origin (apex 308s to www). Without this, prerendered Astro.url
+  // is localhost, which leaked into canonical/OG tags on production.
+  site: 'https://www.pcbjam.com',
   output: 'static',
   adapter: vercel(),
   // MDX lets the Gerber-viewer blog post embed the <GerberDemo /> component

site/src/layouts/BaseLayout.astro

@@ -25,7 +25,10 @@ const {
 
 // Pages may pass a complete title (containing "PCBJam"); otherwise append the suffix.
 const fullTitle = title.includes('PCBJam') ? title : `${title} — PCBJam`;
-const canonical = Astro.url.href;
+// Resolve against `site` — prerendered Astro.url is localhost, and OG crawlers
+// require absolute URLs anyway.
+const canonical = new URL(Astro.url.pathname, Astro.site ?? Astro.url).href;
+const ogImageAbs = new URL(ogImage, Astro.site ?? Astro.url).href;
 ---
 
 <!doctype html>
@@ -49,11 +52,11 @@ const canonical = Astro.url.href;
     <meta property="og:title" content={fullTitle} />
     <meta property="og:description" content={description} />
     <meta property="og:url" content={canonical} />
-    <meta property="og:image" content={ogImage} />
+    <meta property="og:image" content={ogImageAbs} />
     <meta name="twitter:card" content="summary_large_image" />
     <meta name="twitter:title" content={fullTitle} />
     <meta name="twitter:description" content={description} />
-    <meta name="twitter:image" content={ogImage} />
+    <meta name="twitter:image" content={ogImageAbs} />
 
     {/* Per-page extras (e.g. JSON-LD) */}
     <slot name="head" />

web/standalone/index.html

@@ -3,7 +3,32 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>KiCad Web</title>
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
+    <title>PCBJam - KiCad demo</title>
+    <meta
+      name="description"
+      content="Early-access alpha of PCBJam — KiCad running in your browser. Open the example boards or your own KiCad project. No install, nothing uploaded."
+    />
+    <!-- OG/Twitter URLs must be absolute for link-preview crawlers; this page
+         only ships at demo.pcbjam.com, so they are hardcoded. -->
+    <meta property="og:type" content="website" />
+    <meta property="og:site_name" content="PCBJam" />
+    <meta property="og:title" content="PCBJam - KiCad demo" />
+    <meta
+      property="og:description"
+      content="Early-access alpha of PCBJam — KiCad running in your browser. Open the example boards or your own KiCad project. No install, nothing uploaded."
+    />
+    <meta property="og:url" content="https://demo.pcbjam.com/" />
+    <meta property="og:image" content="https://demo.pcbjam.com/og/og-demo.png" />
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:title" content="PCBJam - KiCad demo" />
+    <meta
+      name="twitter:description"
+      content="Early-access alpha of PCBJam — KiCad running in your browser. Open the example boards or your own KiCad project. No install, nothing uploaded."
+    />
+    <meta name="twitter:image" content="https://demo.pcbjam.com/og/og-demo.png" />
   </head>
   <body>
     <div id="root"></div>

web/standalone/src/pages/HomePage.tsx

@@ -223,7 +223,12 @@ export function HomePage() {
 
   return (
     <div className="container max-w-3xl py-10">
-      <h1 className="text-2xl font-semibold tracking-tight">PCBJam</h1>
+      <h1 className="flex items-center gap-2.5 text-2xl font-semibold tracking-tight">
+        PCBJam
+        <span className="rounded-full border border-amber-500/50 bg-amber-500/10 px-2.5 py-0.5 text-xs font-medium text-amber-600 dark:text-amber-400">
+          Early-access alpha
+        </span>
+      </h1>
       <p className="mb-8 text-sm text-muted-foreground">
         {staticMode
           ? "Edit KiCad files in your browser — open an example below or your own local folder. Nothing is uploaded; Save downloads to your machine."