Give the GK monogram a light mode version

In light mode the header, footer and post placeholders show the monogram
on a pale disc with deep gold rings and ink letters, with a soft edge so
it sits apart from the Starlight page. The light file is written by the
light motifs script.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_012aSbo2D1qP8cMFQCykf7kx

services/site/src/components/blog/PostThumb.astro

@@ -4,6 +4,7 @@
  * monogram, which also stands in when there is no cover or it fails to load.
  */
 import monogram from "@gk/ui/assets/brand/gk-monogram.svg?url";
+import Motif from "@gk/ui/components/Motif.astro";
 
 interface Props {
   src?: string;
@@ -16,7 +17,7 @@ const { src, alt = "", width = 176, height = 120, class: className } = Astro.pro
 const mark = Math.round(Math.min(width, height) / 2);
 ---
 <span class:list={["thumb", className]} style={`--w:${width}px;--h:${height}px`}>
-  <img src={monogram} alt="" width={mark} height={mark} class="mono" aria-hidden="true" />
+  <Motif src={monogram} alt="" width={mark} height={mark} class="mono" aria-hidden="true" />
   {src && <img src={src} alt={alt} loading="lazy" decoding="async" class="photo" onerror="this.remove()" />}
 </span>
 

services/site/src/components/home/StatusRow.astro

@@ -7,6 +7,7 @@
 import monogram from "@gk/ui/assets/brand/gk-monogram.svg?url";
 import Chip from "@gk/ui/components/Chip.astro";
 import Icon from "@gk/ui/components/Icon.astro";
+import Motif from "@gk/ui/components/Motif.astro";
 import Star from "@gk/ui/components/Star.astro";
 import type { StatusView } from "../../lib/home.ts";
 import { formatDate, type SiteIndex } from "../../lib/site.ts";
@@ -25,7 +26,7 @@ const postHref = post ? s.href(post) : null;
       <img src={v.cover} alt="" class="thumb photo" loading="lazy" decoding="async" width="56" height="56" />
     ) : (
       <span class="thumb tile" aria-hidden="true">
-        <img src={monogram} alt="" width="28" height="28" />
+        <Motif src={monogram} alt="" width="28" height="28" />
       </span>
     )
   }