Branding diet: logo sprite via <use>, lean favicon.ico, simple mask icon

- The ~33 KB traced logo moves from an inlined-per-page partial to
  /logo-sprite.svg referenced with <use> — cached once instead of
  shipped on every page (homepage HTML: 46 KB -> 13 KB). CSS custom
  properties cascade into the use shadow tree, so the two-tone cutout
  is unchanged (AUDIT §9.1)
- favicon.ico regenerated at 16/32/48 from the 512px master: 71 KB ->
  15 KB; modern browsers take the SVG anyway, the .ico is the legacy
  fallback (§9.2)
- link-icons/internal.svg restored to the simple 4 KB path: it renders
  at 0.7-1.6 rem through a CSS mask, where the 33 KB traced detail
  cannot resolve (§9.2)

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

static/css/components.css

@@ -70,12 +70,15 @@ nav.site-nav {
 }
 
 /* Home logo — square button flush into the top-left corner of the nav bar.
-   The rooted-L mark is inlined (templates/partials/logo-mark.svg) so its
+   The rooted-L mark lives in /logo-sprite.svg and is referenced with
-   two-tone cutout renders: the letter is drawn in --logo-ink and the root
+   <use> (cacheable once, not ~33 KB inlined per page). Its two-tone
-   filament is punched through in --logo-bg. Mapping --logo-bg to --bg-nav
+   cutout still renders because CSS custom properties cascade into the
-   (the button's own surface) makes the roots read as the nav background
+   use-element shadow tree: the letter is drawn in --logo-ink and the
-   showing through. Both tokens are theme-driven in base.css — override
+   root filament is punched through in --logo-bg. Mapping --logo-bg to
-   --nav-logo-fg / --bg-nav there to restyle per theme. */
+   --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;

templates/partials/nav.html

@@ -2,7 +2,13 @@
     <nav class="site-nav">
         <!-- Row 1: primary links -->
         <div class="nav-row-primary">
-            <a href="/" class="nav-logo" aria-label="Home">$partial("templates/partials/logo-mark.svg")$</a>
+            <!-- The mark lives in /logo-sprite.svg and is referenced via
+                 <use> instead of being inlined: the traced path is ~33 KB,
+                 and a per-page inline copy would dwarf most documents. CSS
+                 custom properties (--logo-ink/--logo-bg) cascade into the
+                 use-element shadow tree, so the two-tone cutout still
+                 renders. -->
+            <a href="/" class="nav-logo" aria-label="Home"><svg class="nav-logo__mark" aria-hidden="true" focusable="false"><use href="/logo-sprite.svg#logo-mark"/></svg></a>
             <div class="nav-primary">
                 <a href="/">Home</a>
                 <a href="/current.html">Current</a>