feat: add auth, real-time collaboration, sharing, font control, and UI fixes

Phase 1 - Bug fixes:
- Fix color labels not showing on active line in format preview
- Replace eye emoji with SVG icon showing clear preview/raw state
- Replace // button with comment icon + better tooltip
- Fix ThemePicker accent colors when using system theme

Phase 2 - Font:
- Load JetBrains Mono via Google Fonts with offline fallback
- Add font size control (A-/A+) with keyboard shortcuts
- Persist font size preference in localStorage

Phase 3 - Auth:
- Supabase-based email/password authentication
- Device session management with configurable password renewal TTL
- AuthModal, UserMenu, SecuritySettings components

Phase 4 - Cloud sync:
- Document metadata sync to Supabase PostgreSQL
- Legacy localStorage migration on first login
- IndexedDB persistence via y-indexeddb

Phase 5 - Real-time collaboration:
- Y.js CRDT integration with CodeMirror 6
- Hocuspocus WebSocket server with JWT auth
- Collaborative cursor awareness
- CollabIndicator component

Phase 6 - Sharing:
- Share links with view/edit permissions
- ShareDialog component with copy-to-clipboard
- Minimal client-side router for /s/{token} URLs

Infrastructure:
- Docker Compose with PostgreSQL, GoTrue, PostgREST, Hocuspocus
- Nginx reverse proxy for all backend services
- SQL migrations with RLS policies
- Production-ready Dockerfile with build args

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

calcpad-web/src/hooks/useFontSize.ts

@@ -0,0 +1,39 @@
+import { useState, useEffect, useCallback } from 'react'
+
+const STORAGE_KEY = 'calctext-fontsize'
+const DEFAULT_SIZE = 15
+export const MIN_FONT_SIZE = 11
+export const MAX_FONT_SIZE = 24
+
+function getStoredFontSize(): number {
+  try {
+    const stored = localStorage.getItem(STORAGE_KEY)
+    if (stored) {
+      const n = parseInt(stored, 10)
+      if (n >= MIN_FONT_SIZE && n <= MAX_FONT_SIZE) return n
+    }
+  } catch { /* localStorage unavailable */ }
+  return DEFAULT_SIZE
+}
+
+export function useFontSize() {
+  const [fontSize, setFontSizeState] = useState(getStoredFontSize)
+
+  const setFontSize = useCallback((size: number) => {
+    const clamped = Math.max(MIN_FONT_SIZE, Math.min(MAX_FONT_SIZE, size))
+    setFontSizeState(clamped)
+    try { localStorage.setItem(STORAGE_KEY, String(clamped)) } catch { /* */ }
+    document.documentElement.style.setProperty('--editor-font-size', `${clamped}px`)
+  }, [])
+
+  const resetFontSize = useCallback(() => {
+    setFontSize(DEFAULT_SIZE)
+  }, [setFontSize])
+
+  // Apply on mount
+  useEffect(() => {
+    document.documentElement.style.setProperty('--editor-font-size', `${fontSize}px`)
+  }, []) // eslint-disable-line react-hooks/exhaustive-deps
+
+  return { fontSize, setFontSize, resetFontSize, MIN_SIZE: MIN_FONT_SIZE, MAX_SIZE: MAX_FONT_SIZE }
+}