Merge nucleic/bold-kelp-falcon-zl0r into main

Mirrored from corpo 03da024.

src/pages/index.astro

@@ -15,11 +15,11 @@ const canonical = new URL('/', Astro.site);
          hand those 120px to the page, so no element and no viewport unit reaches them —
          see the note on .ambient for what actually resolves it. -->
     <meta name="viewport" content="width=device-width" />
-    <!-- --paper, and it has to stay --paper: this is one of the surfaces Safari fills
+    <!-- Legacy only: Safari 26 ignores theme-color outright — its chrome tint and its
-         around the page, alongside the canvas, and the field is now brought to --paper
+         rubber-band fill both come from CSS background-color (fixed elements at the
-         at the viewport edges so all of them agree. A "better matching" value here is
+         viewport edges first, then body; see the notes on body and .ambient). Kept at
-         precisely the bug — it reintroduces a colour that differs from the page edge,
+         --paper for older Safari and for Chromium's toolbar, same value, same reason:
-         which surfaces as a bar whenever Safari switches to it during a scroll. -->
+         every surface a browser fills around the page must be the page-edge colour. -->
     <meta name="theme-color" content="#0a100c" />
     <meta name="generator" content={Astro.generator} />
     <title>{title}</title>
@@ -162,8 +162,17 @@ const canonical = new URL('/', Astro.site);
     min-height: 100svh;
     overflow-x: hidden;
     color: var(--ink);
-    /* No background here: html paints the canvas, so the fixed ambient layer below
+    /* Safari 26 paints the rubber-band overscroll gap from body's computed
-       (negative z-index) is not covered by body's own background box. */
+       background-color and from nowhere else — not theme-color (ignored now), not the
+       canvas. Transparent here meant Safari's own dark-scheme grey, which is the bar
+       that split from the page on every bounce, on macOS and iOS alike. So body must
+       carry --paper. That used to be forbidden: .ambient sits at z-index -2, and
+       against the root stacking context body's background paints on top of every
+       negative-z layer, burying the field entirely (the every-pixel-exactly-#0a100c
+       failure). isolation makes body the stacking context instead, which flips that
+       order — body's background first, then its negative-z children above it. */
+    isolation: isolate;
+    background-color: var(--paper);
     font-family: 'Archivo', system-ui, sans-serif;
     -webkit-font-smoothing: antialiased;
   }
@@ -185,6 +194,11 @@ const canonical = new URL('/', Astro.site);
     height: 100lvh;
     overflow: hidden;
     pointer-events: none;
+    /* Visually inert — the canvas beneath is already this colour — but Safari 26
+       derives its chrome tint by sampling fixed elements at the viewport edges before
+       it falls back to body, and a transparent answer from this layer hands the
+       toolbar its default grey instead of the page's own dark. */
+    background-color: var(--paper);
   }
 
   /* The grey bar, properly.
@@ -360,6 +374,7 @@ const canonical = new URL('/', Astro.site);
     font-weight: 600;
     letter-spacing: -0.02em;
     line-height: 1.05;
+    user-select: none;
   }
 
   .card-index,