mobile + docs: themeColor light-mode, Coach FAB safe-area, Sonner system theme, self-hosting docs

Three hotfix-ready findings from the v1.4.34.3 mobile-deep audit
plus the first two docs A8 audit identified as missing.

Mobile-deep:
  - `viewport.themeColor` was pinned to `#282a36` (dark). The
    Android URL bar + iOS PWA status bar stayed dark even when the
    user was on the light theme. Replaced with the dual-media-query
    form: `#ffffff` under `(prefers-color-scheme: light)`,
    `#282a36` under `(prefers-color-scheme: dark)`. Browser chrome
    now matches the active palette.
  - Coach FAB was pinned at `bottom-20` (5 rem). On notched iPhones
    the home-indicator safe area is ~34 px so the FAB collided with
    the bottom-nav. Moved to
    `bottom-[calc(env(safe-area-inset-bottom,0px)+5rem)]` so it
    floats above the inset-aware nav.
  - Sonner toaster shipped `theme="dark"` hardcoded. On a light-mode
    page the toast contrasted badly against the surface. Switched to
    `theme="system"` so Sonner reads the resolved theme from the
    root element (set pre-paint by the inline theme script in
    layout.tsx) instead of pinning dark.

Self-hosting docs:
  - `docs/self-hosting/getting-started.md` — step-by-step from
    `git clone` to first measurement, covering the 3-secret env
    setup (post-SESSION_SECRET drop), `docker compose up -d`, the
    first-user-becomes-admin contract, and the next-step pointers.
  - `docs/self-hosting/reverse-proxy.md` — Caddy, Traefik, Nginx
    Proxy Manager, Coolify, and bare-Nginx config examples. Closes
    the README link at line 107 that previously punted to the docs
    site.

src/components/insights/layout-coach-fab.tsx

@@ -61,7 +61,13 @@ export function LayoutCoachFab() {
       aria-hidden={tooltipActive ? true : undefined}
       tabIndex={tooltipActive ? -1 : undefined}
       className={cn(
-        "fixed right-4 bottom-20 z-40 h-12 rounded-full px-4 shadow-lg",
+        // Sit above the 64 px bottom-nav + the iPhone home-indicator
+        // safe-area inset. `calc(env(safe-area-inset-bottom,0)+5rem)`
+        // keeps the FAB clear of the nav on notched iPhones (where the
+        // inset is ~34 px) without forcing extra padding into the
+        // layout grid.
+        "fixed right-4 z-40 h-12 rounded-full px-4 shadow-lg",
+        "bottom-[calc(env(safe-area-inset-bottom,0px)+5rem)]",
         "from-dracula-purple to-dracula-pink bg-gradient-to-br text-white",
         "hover:from-dracula-purple/90 hover:to-dracula-pink/90",
         "lg:hidden",

src/components/ui/sonner.tsx

@@ -12,7 +12,11 @@ import { Toaster as Sonner, type ToasterProps } from "sonner";
 const Toaster = ({ ...props }: ToasterProps) => {
   return (
     <Sonner
-      theme="dark"
+      // `theme="system"` lets Sonner match the resolved theme on the
+      // root element (set pre-paint by the inline theme script in
+      // `app/layout.tsx`) instead of pinning dark — on light-mode the
+      // hardcoded dark toaster contrasted badly against the page.
+      theme="system"
       className="toaster group"
       icons={{
         success: <CircleCheckIcon className="size-4" />,