feat: add auth

app/globals.css

@@ -9,7 +9,21 @@
     --color-foreground: var(--foreground);
     --font-sans: var(--font-sans);
     --font-mono: var(--font-geist-mono);
-    --font-heading: var(--font-sans);
+    /*
+     * Font roles:
+     *   --font-sans     — Geist, the base UI/body font.
+     *   --font-serif    — Lora, used for verse text always, and surfaced
+     *                     through --font-title when reading-serif is on.
+     *   --font-display  — Bricolage Grotesque, the default for site titles.
+     *   --font-title    — the actual var components reference for titles;
+     *                     swaps between Bricolage and Lora based on the
+     *                     `reading-serif` class on <html>. The toggle rule
+     *                     itself lives outside @theme inline, below.
+     */
+    --font-serif: var(--font-serif);
+    --font-display: var(--font-display);
+    --font-title: var(--font-display);
+    --font-heading: var(--font-display);
     --color-sidebar-ring: var(--sidebar-ring);
     --color-sidebar-border: var(--sidebar-border);
     --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
@@ -48,6 +62,14 @@
     --radius-4xl: calc(var(--radius) * 2.6);
 }
 
+/* When the user enables "Serif Font" in the reading settings, page titles
+   swap from Bricolage Grotesque to Lora. Verse text (font-serif Tailwind
+   utility) is already Lora regardless of this toggle. */
+:root.reading-serif {
+    --font-title: var(--font-serif);
+    --font-heading: var(--font-serif);
+}
+
 /* ── Light mode — "Aged Parchment" ── */
 :root {
     --background: oklch(0.957 0.012 79.8);