fix(ui): backdrop now moves in every browser

The backdrop's only motion was the scroll-driven pan (animation-timeline:
scroll()), which is Chromium-only — so in Firefox/Safari the board sat dead
still. Add a continuous timed top↔bottom drift (48s, alternates) as the
universal baseline; keep the scroll-coupled pan as a Chromium enhancement that
overrides it. Motion-safe: both gated behind prefers-reduced-motion.

src/styles/global.css

@@ -420,6 +420,16 @@ svg {
       rgba(246, 248, 251, 0.82) 100%
     );
 }
+/* BASELINE motion (works in EVERY browser, no JS): a slow, continuous top↔bottom
+   drift. This is the guaranteed fallback — Firefox/Safari don't support
+   scroll-driven animations, so without this the board would sit dead-still. */
+@media (prefers-reduced-motion: no-preference) {
+  .site-bg__img {
+    animation: bgDrift 48s ease-in-out infinite alternate;
+  }
+}
+/* ENHANCEMENT: where scroll-driven animations exist (Chromium), couple the pan
+   to scroll position instead — overrides the timed drift on the same element. */
 @supports (animation-timeline: scroll()) {
   @media (prefers-reduced-motion: no-preference) {
     .site-bg__img {
@@ -428,9 +438,17 @@ svg {
     }
   }
 }
-/* Clean monotonic top→bottom pan: as the page scrolls, the board slowly drifts
-   so the motion is always obvious (no wandering loop that nets to zero). ~40% of
-   the 215%-tall image = a long, continuous travel. */
+/* Continuous timed drift (fallback) — gentle, alternates so it never jumps. */
+@keyframes bgDrift {
+  from {
+    transform: translate(-50%, -38%);
+  }
+  to {
+    transform: translate(-50%, -62%);
+  }
+}
+/* Scroll-coupled monotonic top→bottom pan (Chromium): ~44% travel of the
+   215%-tall image, tied directly to page scroll progress. */
 @keyframes bgPan {
   from {
     transform: translate(-50%, -28%);