add tagging system for media items

Introduces user-defined tag categories and tags with a many-to-many
relationship to media items. Tags are stored in a SQLite database
(medialore.db via better-sqlite3) with ON DELETE CASCADE for automatic
cleanup. Users can manage categories and tags at /manage/tags, assign
tags to games in the detail modal, and tag mixed media files via a
hover button on each tile.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/components/ManageSubNav.tsx

@@ -0,0 +1,42 @@
+'use client'
+
+import Link from 'next/link'
+import { usePathname } from 'next/navigation'
+
+const TABS = [
+  { href: '/manage', label: 'Libraries' },
+  { href: '/manage/tags', label: 'Tags' },
+]
+
+export default function ManageSubNav() {
+  const pathname = usePathname()
+
+  return (
+    <nav className="flex items-center gap-1 mb-8 border-b pb-4" style={{ borderColor: 'var(--border)' }}>
+      {TABS.map(({ href, label }) => {
+        const active = pathname === href
+        return (
+          <Link
+            key={href}
+            href={href}
+            className="text-sm px-3 py-1.5 rounded-lg transition-colors"
+            style={{
+              color: active ? 'var(--text-primary)' : 'var(--text-secondary)',
+              backgroundColor: active ? 'var(--surface)' : 'transparent',
+            }}
+            onMouseEnter={(e) => {
+              ;(e.currentTarget as HTMLElement).style.backgroundColor = 'var(--surface)'
+              ;(e.currentTarget as HTMLElement).style.color = 'var(--text-primary)'
+            }}
+            onMouseLeave={(e) => {
+              ;(e.currentTarget as HTMLElement).style.backgroundColor = active ? 'var(--surface)' : 'transparent'
+              ;(e.currentTarget as HTMLElement).style.color = active ? 'var(--text-primary)' : 'var(--text-secondary)'
+            }}
+          >
+            {label}
+          </Link>
+        )
+      })}
+    </nav>
+  )
+}