Replace the front page with an admin-driven home

The home page is rebuilt from scratch and configured from a new
Front page tab in the admin, backed by migration 017 and served by
GET /api/front-page.

Hero: brand, photos (crossfading slideshow with progress and pause)
or livestream (YouTube/Facebook/Vimeo embed with a LIVE badge),
switched by hand. After it, bands the admin can reorder, retitle or
hide: a countdown to the next event (series-aware), the National
Retreats carousel, a numbers band (typed in or counted from the
database), a horizontal rail of featured timeline entries, and a
"Find your way in" pathfinder replacing the old connect section.

The CRUD engine gains a `singleton` flag: the entity has one row,
made by its migration, and create and delete are refused. The list
screen opens that row and the editor drops the slug, back link and
delete. shapeSeries moves to shape.js so /front-page can share it.

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

src/pages/sections/home/RetreatsBand.tsx

@@ -0,0 +1,40 @@
+/* ═══════════════════════════════════════════════════════════════
+   RETREATS BAND
+
+   The National Retreats carousel from the Retreats page, as-is:
+   same component, same filter, so an event edited in the admin
+   shows up identically in both places. This file only adds the
+   front page's heading and a way through to the full page.
+   ═══════════════════════════════════════════════════════════════ */
+
+import { Link } from 'react-router-dom'
+
+import EventListCards from '../EventList-Cards.tsx'
+
+const TEAL = '#138ba0'
+
+type RetreatsBandProps = { id: string; title: string; blurb?: string | null }
+
+export default function RetreatsBand({ id, title, blurb }: RetreatsBandProps) {
+  return (
+    <section id={id} className="overflow-hidden py-24" style={{ background: '#eef9fb' }}>
+      <div className="mx-auto mb-12 flex max-w-6xl flex-wrap items-end gap-6 px-6">
+        <div>
+          <h2 className="font-display text-4xl font-extrabold text-[#073d4a] md:text-5xl">
+            {title}
+          </h2>
+          {blurb && <p className="mt-3 max-w-xl text-lg text-[#4a6b72]">{blurb}</p>}
+        </div>
+        <Link
+          to="/retreats"
+          className="ml-auto rounded-full border px-5 py-2 text-sm font-semibold transition-colors hover:bg-white"
+          style={{ borderColor: TEAL, color: TEAL }}
+        >
+          All retreats →
+        </Link>
+      </div>
+
+      <EventListCards section="national" type="retreat" view="carousel" accent={TEAL} />
+    </section>
+  )
+}