feat: add sign-in flow, routing shell, and searchable book list

Pin @testing-library/jest-dom to ~6.9.1 (6.10.0 is npm-deprecated).

Claude-Session: https://claude.ai/code/session_01M9MLit5Ko3X4s7rzC5Kv7X

src/books/Progress.tsx

@@ -0,0 +1,30 @@
+import type { Book, ReadingStatus } from '../api'
+
+const STATUS: Record<ReadingStatus, { label: string; style: string }> = {
+  not_started: { label: 'Not started', style: 'bg-slate-100 text-slate-700' },
+  reading: { label: 'Reading', style: 'bg-amber-100 text-amber-800' },
+  finished: { label: 'Finished', style: 'bg-emerald-100 text-emerald-800' },
+}
+
+export function StatusBadge({ status }: { status: ReadingStatus }) {
+  return (
+    <span className={`rounded-full px-2 py-0.5 text-xs font-medium whitespace-nowrap ${STATUS[status].style}`}>
+      {STATUS[status].label}
+    </span>
+  )
+}
+
+export function ProgressBar({ book }: { book: Book }) {
+  const percent = Math.round((book.current_page / book.total_pages) * 100)
+  return (
+    <div className="mt-3">
+      <progress
+        className="h-2 w-full accent-indigo-600"
+        value={book.current_page}
+        max={book.total_pages}
+        aria-label={`Reading progress for ${book.title}`}
+      />
+      <p className="text-sm text-slate-600">{`${book.current_page} / ${book.total_pages} (${percent}%)`}</p>
+    </div>
+  )
+}