facelift: the scroll story - bento capabilities, dossier cards, series badges, GitOps receipt

02 Capabilities becomes a 4-col bento (Edge AI 2x2 flagship w/ magenta corner radial, Platform
wide, magenta-flavoured security tile, Observability row-completer) driven by span/flavor fields
in skills.ts. 03 Selected Work becomes dossier cards: house-style SVG thumbnails (per-project
motif via DossierThumb), DOSSIER/00N corner tags, 'the argument' line from the outcome field,
chip tags, mono meta footer. 04 Writing cards gain the security-series badge (data/series.ts)
and sit three across. Section numbers glow cyan; a circuit divider (gradient hairlines + two
diamonds) closes the hero. Footer opens with the GitOps receipt - git sha + build date baked at
build time via lib/build-info.ts, zero runtime calls.

src/components/PostList.astro

@@ -2,6 +2,7 @@
 import type { CollectionEntry } from "astro:content";
 import { formatDate } from "../lib/blog";
 import { readingTime } from "../lib/reading";
+import { series } from "../data/series";
 
 interface Props {
   posts: CollectionEntry<"blog">[];
@@ -21,6 +22,11 @@ const { posts } = Astro.props;
           )}
           <div class="post__card-body">
             <div class="post__meta mono">
+              {series[post.id] && (
+                <span class="post__series">
+                  {series[post.id].name} · {String(series[post.id].number).padStart(2, "0")}
+                </span>
+              )}
               <time datetime={post.data.date.toISOString()}>{formatDate(post.data.date)}</time>
               <span class="post__sep">·</span>
               <span>{readingTime(post.body)}</span>
@@ -45,6 +51,7 @@ const { posts } = Astro.props;
     margin: 0;
     padding: 0;
     display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
     gap: var(--space-4);
   }
   .post__link {
@@ -84,8 +91,18 @@ const { posts } = Astro.props;
     font-size: 0.72rem;
     color: var(--text-faint);
     display: flex;
+    align-items: center;
+    flex-wrap: wrap;
     gap: 0.5rem;
   }
+  .post__series {
+    color: var(--accent-2);
+    border: 1px solid var(--border-magenta);
+    border-radius: 3px;
+    padding: 2px 7px;
+    letter-spacing: 0.1em;
+    font-size: 0.66rem;
+  }
   .post__sep {
     opacity: 0.6;
   }