feat: add themed custom scrollbar (#169)

Replace the default browser scrollbar with a custom themed one that
matches DevCard's brand gradient. CSS-only, no JavaScript.

- WebKit/Chromium/Safari: gradient thumb (primary -> accent), themed
  track, hover state with glow.
- Firefox: scrollbar-width thin + scrollbar-color using the same theme
  variables (solid thumb fallback since gradients aren't supported).
- Reuses existing --primary/--accent/--bg-secondary/--primary-glow
  CSS variables so light/dark mode just work.

Closes #151.

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

Author: smirk-dev

apps/web/src/app.css

@@ -104,3 +104,39 @@ a {
   transform: translateY(-2px);
   box-shadow: 0 6px 20px var(--primary-glow);
 }
+
+/* ---------- Custom themed scrollbar (issue #151) ---------- */
+
+/* Firefox */
+html {
+  scrollbar-width: thin;
+  scrollbar-color: var(--primary) var(--bg-secondary);
+}
+
+/* WebKit (Chromium, Safari, Edge) */
+::-webkit-scrollbar {
+  width: 10px;
+  height: 10px;
+}
+
+::-webkit-scrollbar-track {
+  background: var(--bg-secondary);
+  border-radius: 999px;
+}
+
+::-webkit-scrollbar-thumb {
+  background: linear-gradient(135deg, var(--primary), var(--accent));
+  border-radius: 999px;
+  border: 2px solid var(--bg-secondary);
+  background-clip: padding-box;
+  transition: background 0.2s ease, box-shadow 0.2s ease;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background: linear-gradient(135deg, var(--accent), var(--primary));
+  box-shadow: 0 0 8px var(--primary-glow);
+}
+
+::-webkit-scrollbar-corner {
+  background: var(--bg-secondary);
+}