Add admin-configurable branding (colors, logo, favicon) and generic default fallbacks

Site Settings -> Branding now supports a Primary/Secondary/Accent brand color
system applied site-wide (buttons, nav, hover states, links) and to outgoing
email header/CTA colors, plus a favicon upload alongside the existing logo
upload, a live preview panel (website/email x desktop/mobile), and
logo-based color suggestions. The setup wizard's Branding step got the same
treatment. Fixes two related bugs found along the way: the setup wizard's
logo/favicon upload was missing its auth token, and a static favicon.ico in
Next's special app/ convention path was silently overriding the dynamic one.

Also replaces every "Hope Events"/"Hope Family Church" default (org name,
email subjects, WhatsApp messages, report metadata, API docs) with a neutral
"Cross Code" placeholder, and the optional legal settings (operator name, IO
details, website URL, effective date) with obviously-generic placeholders
instead of defaulting to real personal/organisational details -- since this
platform is deployed for multiple organisations. Adds SETTINGS.md documenting
every setting's default behaviour.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

frontend/src/app/globals.css

@@ -4,17 +4,18 @@
 
 /*
  * Design tokens for shadcn/ui primitives (components.json: baseColor "slate",
- * cssVariables: true). Base scale is shadcn's stock "slate" theme; --primary
- * and --ring are overridden to the site's fixed indigo/purple brand color
- * (matches the `brand` scale in tailwind.config.js, brand-600 #4F46E5).
+ * cssVariables: true). Base scale is shadcn's stock "slate" theme.
  *
- * IMPORTANT: the org's admin-configurable accent color
- * (SiteSettingsContext.settings.accent_color) must NEVER be wired into any
- * variable here or into any Tailwind color token. It is applied in exactly
- * one place — an inline `style={{ color }}` on the org name text in
- * Navbar.tsx — and nowhere else. Every other themed element (buttons, links,
- * active nav states, icon chips, the help button, etc.) uses the fixed
- * brand/primary tokens below regardless of what the org sets that setting to.
+ * --primary/--primary-foreground/--ring/--secondary/--secondary-foreground/
+ * --accent/--accent-foreground/--brand-50..900 below are DEFAULTS ONLY — used
+ * before any branding setting has been saved, or if the server-side settings
+ * fetch fails for a request. The real values come from the admin's saved
+ * primary_color/secondary_color/accent_color settings, computed via
+ * lib/colorScale.ts and injected per-request as a `<style id="brand-theme">`
+ * override in layout.tsx (see buildThemeCssVars). This intentionally reverses
+ * an earlier decision (commit 8e6cb542) that kept the accent color scoped to
+ * a single inline style on the navbar's org-name text — branding now flows
+ * through these same tokens site-wide and into outgoing emails.
  */
 @layer base {
     :root {
@@ -47,6 +48,18 @@
         --ring: 243 75% 59%;
 
         --radius: 0.5rem;
+
+        /* Fallback brand scale (matches the pre-branding-feature default indigo, brand-600 #4F46E5) */
+        --brand-50: #EEF2FF;
+        --brand-100: #E0E7FF;
+        --brand-200: #C7D2FE;
+        --brand-300: #A5B4FC;
+        --brand-400: #818CF8;
+        --brand-500: #6366F1;
+        --brand-600: #4F46E5;
+        --brand-700: #4338CA;
+        --brand-800: #3730A3;
+        --brand-900: #312E81;
     }
 }