Hero: the field bleeds past its box

25% overscan on every side, drawing scaled to the piece so nothing
grows; html overflow-x: clip keeps the bleed from scrolling sideways.

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

hero.js

@@ -18,18 +18,24 @@
 //
 // prefers-reduced-motion freezes the field fully drawn either way.
 
-import { makePaths, drawPaths } from './paths.js';
+import { makePaths, drawPaths, OVERSCAN } from './paths.js';
 
 const STYLE_ID = 'redoal-hero-style';
 const CYCLE_MS = 28000;
 const SEED = 7;
 const COUNT = 47;
 
+const BLEED = `${((OVERSCAN - 1) / 2) * -100}%`;
+
 const STYLE_TEXT = `
+/* The field bleeds 25% past the hero piece on every side; clip the
+   document sideways (clip, not hidden: no scroll container) so the
+   bleed can never cause horizontal scrolling. */
+html { overflow-x: clip; }
 .redoal-paths {
   position: absolute;
-  inset: 0;
-  overflow: hidden;
+  inset: ${BLEED};
+  overflow: visible;
   pointer-events: none;
   --redoal-t: 0;
   --redoal-seed: ${SEED};