Branding: traced logo mark, regenerated favicons, og-image

New inline logo-mark.svg partial in the nav (two-tone cutout via
--logo-ink/--logo-bg), regenerated favicon set + web-app manifest icons
from the new mark, 1200x630 og-image wired into head.html.

Known follow-ups (AUDIT-2026-06-09.md §9): the traced SVG is ~33 KB
inlined per page, favicon.ico carries 128/256px entries, and the
webmanifest dropped its maskable purpose.

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

static/css/components.css

@@ -70,34 +70,32 @@ nav.site-nav {
 }
 
 /* Home logo — square button flush into the top-left corner of the nav bar.
-   The L silhouette is rendered via ::before mask-image so the background
-   matches --bg-nav exactly and the foreground follows --nav-logo-fg (set
-   per theme in base.css — override there to restyle for light mode). */
+   The rooted-L mark is inlined (templates/partials/logo-mark.svg) so its
+   two-tone cutout renders: the letter is drawn in --logo-ink and the root
+   filament is punched through in --logo-bg. Mapping --logo-bg to --bg-nav
+   (the button's own surface) makes the roots read as the nav background
+   showing through. Both tokens are theme-driven in base.css — override
+   --nav-logo-fg / --bg-nav there to restyle per theme. */
 .nav-logo {
     position: absolute;
     left: 0;
     top: 0;
     bottom: 0;
     aspect-ratio: 1 / 1;
-    display: block;
+    display: flex;
+    align-items: center;
+    justify-content: center;
     overflow: hidden;
     flex-shrink: 0;
     text-decoration: none;
     background-color: var(--bg-nav);
+    --logo-ink: var(--nav-logo-fg);
+    --logo-bg: var(--bg-nav);
 }
-.nav-logo::before {
-    content: '';
-    position: absolute;
-    inset: 12%;
-    background-color: var(--nav-logo-fg);
-    mask-image: url('/images/link-icons/internal.svg');
-    mask-size: contain;
-    mask-repeat: no-repeat;
-    mask-position: center;
-    -webkit-mask-image: url('/images/link-icons/internal.svg');
-    -webkit-mask-size: contain;
-    -webkit-mask-repeat: no-repeat;
-    -webkit-mask-position: center;
+.nav-logo__mark {
+    width: 76%;
+    height: 76%;
+    display: block;
 }
 
 /* Controls cluster: portals toggle + theme toggle, pinned right */

static/site.webmanifest

@@ -1,21 +1,21 @@
 {
-  "name": "levineuwirth.org",
+  "name": "Levi Neuwirth",
   "short_name": "ln",
   "icons": [
     {
       "src": "/web-app-manifest-192x192.png",
       "sizes": "192x192",
       "type": "image/png",
-      "purpose": "maskable"
+      "purpose": "any"
     },
     {
       "src": "/web-app-manifest-512x512.png",
       "sizes": "512x512",
       "type": "image/png",
-      "purpose": "maskable"
+      "purpose": "any"
     }
   ],
-  "theme_color": "#ffffff",
-  "background_color": "#ffffff",
+  "theme_color": "#16140f",
+  "background_color": "#16140f",
   "display": "standalone"
-}
+}

templates/partials/head.html

@@ -14,8 +14,10 @@ $if(home)$<meta property="og:title" content="Levi Neuwirth">$else$$if(title)$<me
 $if(description)$<meta property="og:description" content="$description$">$endif$
 <meta property="og:url" content="$site-url$$url$">
 $if(date)$<meta property="og:type" content="article">$else$<meta property="og:type" content="website">$endif$
-<meta property="og:image" content="$site-url$/web-app-manifest-512x512.png">
-<meta name="twitter:card" content="summary">
+<meta property="og:image" content="$site-url$/og-image.png">
+<meta property="og:image:width" content="1200">
+<meta property="og:image:height" content="630">
+<meta name="twitter:card" content="summary_large_image">
 $if(description)$<meta name="twitter:description" content="$description$">$endif$
 
 <link rel="icon" type="image/png" href="/favicon-96x96.png" sizes="96x96">

templates/partials/nav.html

@@ -2,7 +2,7 @@
     <nav class="site-nav">
         <!-- Row 1: primary links -->
         <div class="nav-row-primary">
-            <a href="/" class="nav-logo" aria-label="Home"></a>
+            <a href="/" class="nav-logo" aria-label="Home">$partial("templates/partials/logo-mark.svg")$</a>
             <div class="nav-primary">
                 <a href="/">Home</a>
                 <a href="/current.html">Current</a>