Marsh demo: video embed with reactive+hypermedia interplay

- ~video-player defisland persists across SPA navigations (morph-safe)
- Clicking "reactive" cycles colour (signal) + fetches random YouTube video (sx-get)
- sx-trigger="fetch-video" + dom-first-child check: video keeps playing on repeat clicks
- Close button (x) clears video via /api/clear-video hypermedia endpoint
- Autoplay+mute removes YouTube's red play button overlay
- Header restructured: logo in anchor, tagline outside (no accidental navigation)
- Flex centering on video container

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

sx/bp/pages/routes.py

@@ -1049,6 +1049,23 @@ def register(url_prefix: str = "/") -> Blueprint:
         resp.headers["SX-Retarget"] = "#ref-hdr-retarget-alt"
         return resp
 
+    # --- Random video (marsh demo: reactive click + hypermedia fetch) ---
+
+    _last_video = {"id": ""}
+
+    @bp.get("/api/random-video")
+    async def api_random_video():
+        from shared.sx.helpers import sx_response
+        videos = ["mSil_hBqbac", "-EX4mgvnSc8", "maOM81a-Gyg", "OHPJemGxUjE"]
+        available = [v for v in videos if v != _last_video["id"]]
+        video_id = random.choice(available)
+        _last_video["id"] = video_id
+        return sx_response(f'(~video-embed :video-id "{video_id}")')
+
+    @bp.get("/api/clear-video")
+    async def api_clear_video():
+        return Response("", content_type="text/html")
+
     # --- Event demos ---
 
     @bp.get("/geography/hypermedia/reference/api/error-500")