feat: appbar pickers, multi-agent personas, threads, library, profile

Adds a substantial chrome layer atop the bare template:

Appbar
- Font-size picker (root font-size scale): S/M/L/XL
- Surface picker: tints --background/--card/--popover/--sidebar/--muted/
  --secondary/--accent across light + dark
- Background picker: 11 atmospheric gradients (Pearl, Linen, Mist, Dawn,
  Seafoam, Aurora, Sunset, Meadow, Midnight, Blush, Noir) + None
- Vivid foreground tokens for stronger text contrast; fixed dark-mode
  blue-on-blue user bubble (deeper --primary, near-white --primary-fg)

Assistant route
- Multi-agent personas (~/lib/agents.ts): Atlas, Forge, Inkwell, Pilot,
  Cursor — each with name/role/sub-prompt; per-thread persona; agent
  picker with avatar tint + handoff submenu
- Conversation threads (~/lib/threads.ts): new/switch/rename/delete,
  auto-titling from first user message, per-thread pinned indices
- Compact summarization with snapshot-based Restore that preserves
  pinned messages verbatim
- Edit & retry the last user message, Regenerate, Continue, Show
  system prompt, Copy / Export Markdown, Save to Library, Compare
  across agents (parallel completions in a side-by-side modal)
- Per-message Pin / Read aloud (Web Speech) / Edit
- Voice input via Web Speech Recognition
- Two-column Actions popover (UI Control + Conversation / Share /
  Multi-agent / Clear sections)
- Status bar: connection dot + LOCAL/API/MOCK chip + host chip +
  context progress bar
- Compactly named threads picker; New conversation
- DropdownMenuItem onSelect → onClick (base-ui Menu fires onClick)

Library
- ~/lib/library.ts store, /library route with search + detail panel
  (Copy / Download / Delete)

Profile
- /profile route + ~/lib/profile.ts (name/email/title/bio/signature/
  avatar dataURL/default agent), AppShell uses live profile for the
  appbar avatar; account menu now navigates to /profile

Settings
- Sub-sidenav (LLM / Agents / Appearance / Account / About)
- Editable system prompt with reset-to-default
- Agents CRUD panel
- Reorganized layout

UI Control
- Static action catalog in the system prompt so the assistant can
  drive controls on routes that aren't currently mounted
- Always returns to /assistant after a UI Control sequence (model-
  side rule + deterministic safety net)
- Cursor uses click-nav over direct navigate so the virtual cursor
  is visibly involved
- New ids tagged across the app (sidebar, settings, profile, library,
  assistant tools, agent handoff, thread management)

Hydration
- root.tsx: suppressHydrationWarning on html/body since the pre-mount
  script sets dark/data-bg/data-surface/data-font-scale before React

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

app/lib/library.ts

@@ -0,0 +1,125 @@
+// Library — saved artifacts. Today: conversation snapshots.
+// Tomorrow: snippets, prompts, generated documents.
+
+import { useEffect, useSyncExternalStore } from "react"
+
+export type LibraryItem = {
+  id: string
+  kind: "conversation" | "snippet"
+  title: string
+  // Free-form body. For "conversation": markdown transcript. For "snippet": text.
+  content: string
+  tags: string[]
+  // Optional metadata.
+  agentName?: string
+  agentRole?: string
+  threadId?: string
+  messageCount?: number
+  createdAt: number
+}
+
+const STORAGE_KEY = "crema.library"
+const CHANGE_EVENT = "crema:library-change"
+const MAX_BYTES = 1_500_000
+
+export function newLibraryId(): string {
+  return `lib-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 6)}`
+}
+
+function isLibraryItem(v: unknown): v is LibraryItem {
+  if (!v || typeof v !== "object") return false
+  const x = v as LibraryItem
+  return (
+    typeof x.id === "string" &&
+    (x.kind === "conversation" || x.kind === "snippet") &&
+    typeof x.title === "string" &&
+    typeof x.content === "string" &&
+    Array.isArray(x.tags) &&
+    typeof x.createdAt === "number"
+  )
+}
+
+function readFromStorage(): LibraryItem[] {
+  if (typeof window === "undefined") return []
+  try {
+    const raw = localStorage.getItem(STORAGE_KEY)
+    if (!raw) return []
+    const parsed = JSON.parse(raw)
+    if (!Array.isArray(parsed)) return []
+    return parsed.filter(isLibraryItem)
+  } catch {
+    return []
+  }
+}
+
+function writeToStorage(items: LibraryItem[]) {
+  if (typeof window === "undefined") return
+  let trimmed = items
+  let serialized = JSON.stringify(trimmed)
+  while (serialized.length > MAX_BYTES && trimmed.length > 1) {
+    trimmed = trimmed.slice(0, -1)
+    serialized = JSON.stringify(trimmed)
+  }
+  try {
+    localStorage.setItem(STORAGE_KEY, serialized)
+    window.dispatchEvent(new CustomEvent(CHANGE_EVENT))
+  } catch {
+    /* quota — bail */
+  }
+}
+
+export function loadLibrary(): LibraryItem[] {
+  return readFromStorage()
+}
+
+export function addLibraryItem(item: Omit<LibraryItem, "id" | "createdAt">): LibraryItem {
+  const next: LibraryItem = {
+    ...item,
+    id: newLibraryId(),
+    createdAt: Date.now(),
+  }
+  const items = readFromStorage()
+  writeToStorage([next, ...items])
+  return next
+}
+
+export function deleteLibraryItem(id: string) {
+  const items = readFromStorage().filter((x) => x.id !== id)
+  writeToStorage(items)
+}
+
+export function updateLibraryItem(id: string, patch: Partial<LibraryItem>) {
+  const items = readFromStorage().map((x) =>
+    x.id === id ? { ...x, ...patch } : x,
+  )
+  writeToStorage(items)
+}
+
+let cached: LibraryItem[] | null = null
+
+function subscribe(cb: () => void): () => void {
+  const onChange = () => {
+    cached = null
+    cb()
+  }
+  window.addEventListener(CHANGE_EVENT, onChange)
+  window.addEventListener("storage", (e) => {
+    if (e.key === STORAGE_KEY) onChange()
+  })
+  return () => window.removeEventListener(CHANGE_EVENT, onChange)
+}
+function getSnapshot(): LibraryItem[] {
+  if (!cached) cached = readFromStorage()
+  return cached
+}
+function getServerSnapshot(): LibraryItem[] {
+  return []
+}
+
+export function useLibrary(): LibraryItem[] {
+  const value = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot)
+  useEffect(() => {
+    cached = null
+  }, [])
+  return value
+}