5 new features: dark mode, shortcuts, SSE tasks, compare, compose

Dark mode:
- body.dark overrides CSS variables (navy→cream reverse)
- Persisted in localStorage, applied before paint to avoid flash
- Toggle button in nav (moon/sun icon), Shift+D shortcut

Keyboard shortcuts:
- g h/n/u/t/s/c/w/d/k for page navigation
- n for new case, ? for help (Shift+/)
- Esc closes any open dialog, blurs focused input
- Help modal via showShortcutsHelp() with styled kbd elements

SSE tasks stream:
- /api/system/tasks/stream pushes snapshots whenever _progress changes
- Client uses EventSource instead of 3s polling
- Auto-reconnect after 5s on error
- 15s heartbeat keeps proxies alive

Compare decisions (new #/compare page):
- /api/training/compare?a=id&b=id serializes both decisions' metadata,
  section breakdown from document_chunks, and three buckets of patterns
  (only in A, only in B, shared) using variant matching
- Two-column header with section-length breakdown + patterns count
- Three-column diff row (only_a / shared / only_b)

Compose with suggestions (new #/compose page):
- Large RTL justified textarea with Hebrew display font title input
- Sidebar lists all 47 style_patterns grouped by type with filter chips
- Click a pattern → inserts at cursor, replacing [placeholders] with ___
- Live section guess (פתיחה / רקע / טענות / דיון / סוף דבר) based on
  most-recent 400 chars
- Auto-save draft to localStorage every second; restore on page load
- "העתק טקסט" copies title+body to clipboard

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

web/static/design-system.css

@@ -108,6 +108,54 @@
   --t-slow: 280ms var(--ease-out);
 }
 
+/* ── Dark theme overrides ────────────────────────────── */
+body.dark {
+  --color-navy: #f5f1e8;
+  --color-navy-soft: #e8e0c8;
+  --color-navy-dim: #c7bc9a;
+
+  --color-cream: #0a0f1c;
+  --color-cream-deep: #121a2e;
+  --color-parchment: #161f36;
+
+  --color-gold: #d4a55a;
+  --color-gold-deep: #e8bc6f;
+  --color-gold-soft: #c89a56;
+  --color-gold-wash: rgba(212, 165, 90, 0.08);
+
+  --color-ink: #f5f1e8;
+  --color-ink-soft: #d8d2c0;
+  --color-ink-muted: #9a9380;
+  --color-ink-light: #6a6458;
+
+  --color-rule: #2a3352;
+  --color-rule-soft: #1e2a45;
+
+  --color-surface: #141b2f;
+  --color-surface-raised: #1a2238;
+  --color-bg: #0a0f1c;
+
+  --color-success: #5a9a6a;
+  --color-success-bg: rgba(90, 154, 106, 0.12);
+  --color-warn: #c79956;
+  --color-warn-bg: rgba(199, 153, 86, 0.12);
+  --color-danger: #c16565;
+  --color-danger-bg: rgba(193, 101, 101, 0.12);
+  --color-info: #6d8bab;
+  --color-info-bg: rgba(109, 139, 171, 0.12);
+
+  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.3);
+  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.35), 0 1px 2px rgba(0, 0, 0, 0.25);
+  --shadow:    0 2px 6px rgba(0, 0, 0, 0.4), 0 1px 2px rgba(0, 0, 0, 0.25);
+  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.45), 0 2px 4px rgba(0, 0, 0, 0.25);
+  --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.5), 0 2px 6px rgba(0, 0, 0, 0.3);
+}
+
+body.dark header {
+  background: #060a18;
+  border-bottom-color: var(--color-gold);
+}
+
 /* ── Base overrides ──────────────────────────────────── */
 
 html { font-size: 16px; }