feat: protect frontend routes with ProtectedRoute and AdminRoute

- Wrap /runs/new and /genlockes/new with ProtectedRoute (requires login)
- Create AdminRoute component that checks isAdmin, redirects non-admins
  with a toast notification
- Wrap all /admin/* routes with AdminRoute
- Deep-linking preserved: unauthenticated users redirect to login, then
  back to the original protected route after auth

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

frontend/src/App.tsx

@@ -1,5 +1,5 @@
 import { Routes, Route, Navigate } from 'react-router-dom'
-import { Layout } from './components'
+import { Layout, ProtectedRoute, AdminRoute } from './components'
 import { AdminLayout } from './components/admin'
 import {
   AuthCallback,
@@ -35,18 +35,18 @@ function App() {
         <Route path="signup" element={<Signup />} />
         <Route path="auth/callback" element={<AuthCallback />} />
         <Route path="runs" element={<RunList />} />
-        <Route path="runs/new" element={<NewRun />} />
+        <Route path="runs/new" element={<ProtectedRoute><NewRun /></ProtectedRoute>} />
         <Route path="runs/:runId" element={<RunEncounters />} />
         <Route path="runs/:runId/journal/:entryId" element={<JournalEntryPage />} />
         <Route path="genlockes" element={<GenlockeList />} />
-        <Route path="genlockes/new" element={<NewGenlocke />} />
+        <Route path="genlockes/new" element={<ProtectedRoute><NewGenlocke /></ProtectedRoute>} />
         <Route path="genlockes/:genlockeId" element={<GenlockeDetail />} />
         <Route path="stats" element={<Stats />} />
         <Route
           path="runs/:runId/encounters"
           element={<Navigate to=".." relative="path" replace />}
         />
-        <Route path="admin" element={<AdminLayout />}>
+        <Route path="admin" element={<AdminRoute><AdminLayout /></AdminRoute>}>
           <Route index element={<Navigate to="/admin/games" replace />} />
           <Route path="games" element={<AdminGames />} />
           <Route path="games/:gameId" element={<AdminGameDetail />} />

frontend/src/components/AdminRoute.tsx

@@ -0,0 +1,35 @@
+import { useEffect, useRef } from 'react'
+import { Navigate, useLocation } from 'react-router-dom'
+import { toast } from 'sonner'
+import { useAuth } from '../contexts/AuthContext'
+
+export function AdminRoute({ children }: { children: React.ReactNode }) {
+  const { user, loading, isAdmin } = useAuth()
+  const location = useLocation()
+  const toastShownRef = useRef(false)
+
+  useEffect(() => {
+    if (!loading && user && !isAdmin && !toastShownRef.current) {
+      toastShownRef.current = true
+      toast.error('Admin access required')
+    }
+  }, [loading, user, isAdmin])
+
+  if (loading) {
+    return (
+      <div className="min-h-screen flex items-center justify-center">
+        <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-accent-500" />
+      </div>
+    )
+  }
+
+  if (!user) {
+    return <Navigate to="/login" state={{ from: location }} replace />
+  }
+
+  if (!isAdmin) {
+    return <Navigate to="/" replace />
+  }
+
+  return <>{children}</>
+}

frontend/src/components/index.ts

@@ -1,3 +1,4 @@
+export { AdminRoute } from './AdminRoute'
 export { CustomRulesDisplay } from './CustomRulesDisplay'
 export { ProtectedRoute } from './ProtectedRoute'
 export { EggEncounterModal } from './EggEncounterModal'