Post Phase 8 - Fixes 1

Delivered:

Super Administrator — env-var provisioned, no StaffProfile at all (structural exclusion from Team/barber-picker/appointments/staff-totals, not a filter). hasPermission short-circuit + new getActingBusinessContext() helper retrofitted across 16 owner pages so it can actually manage the business.
Media Manager — one upload/library/external-URL modal + field picker, backing every image field app-wide. Local-disk storage + Docker volume, SVG rejected, size-capped.
Welcome backgrounds — desktop/mobile images with CSS breakpoint swap.
Business Branding settings — logo/cover/welcome/favicon/icon/colours all editable post-install; cover image finally rendered (was dead config).
Service descriptions — now surfaced on Home and in the booking flow.
Loyalty card — live preview, ColorPicker/MediaPicker/IconPicker, flip removed for a static premium-styled card, Loyalty added to bottom nav. Fixed a real pre-existing bug where the card's configured colour/image/icon were stored but never actually rendered.
Home Screen Redesign — hero gallery + sticky Services/Portfolio/Reviews/Details tabs, backed by a new unified gallery model/service (no hero/portfolio duplication). Details tab surfaces social links and a map that were never shown before.
Google Reviews — real sync pipeline (24h cron, CRON_SECRET-gated, mirrors the existing notification cron exactly), DB-only customer reads, owner hide/unhide + policy management page.
Architecture cleanup — SettingsPageShell extracted from 6 duplicated page wrappers; fixed a second pre-existing bug where branding image fields could never actually be cleared once set.
Verification: 418 tests passing (236 unit + 182 integration, all against a real MySQL database), full typecheck/lint clean across src, and a real Docker build+run cycle — which caught and fixed a genuine bug (scripts/ wasn't copied into the production image, so Super Admin sync would have crashed on every real deployment).

src/components/settings/settings-page-shell.tsx

@@ -0,0 +1,26 @@
+import type { ReactNode } from "react";
+import { TopNav } from "@/components/navigation/top-nav";
+import { cn } from "@/lib/utils/cn";
+
+export interface SettingsPageShellProps {
+  title: string;
+  children: ReactNode;
+  /** Merged onto the default `<main>` classes via cn()/tailwind-merge — pass e.g. "lg:max-w-2xl" to opt out of the default wide desktop layout, or extra utilities like "space-y-8". */
+  mainClassName?: string;
+}
+
+/**
+ * The TopNav + centered container wrapper repeated verbatim across every
+ * owner settings page (Business Details, Gallery, Loyalty, Booking
+ * Rules, Opening Hours, Reviews, ...) — extracted here in Phase 9 once
+ * enough pages shared it to be worth the indirection. See
+ * docs/phase-9-summary.md, "Architecture Review".
+ */
+export function SettingsPageShell({ title, children, mainClassName }: SettingsPageShellProps) {
+  return (
+    <div className="pb-12">
+      <TopNav title={title} onBack sticky className="bg-stone" />
+      <main className={cn("mx-auto max-w-2xl px-6 py-6 lg:max-w-4xl", mainClassName)}>{children}</main>
+    </div>
+  );
+}