Add a Production dashboard with an animated knowledge graph

The sidebar now groups Production under Dashboard and the four existing
pages under Settings, and Production is the landing page. It shows content
in progress, material, content made, approved and LMS-ready counts, plus a
knowledge graph linking Brain documents, results, found sources and
schedules, with the schedule and what is being made right now beside it.

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

src/App.tsx

@@ -2,6 +2,7 @@ import { Navigate, Route, Routes } from 'react-router-dom'
 import { AuthGate } from './auth/AuthGate'
 import { AppLayout } from './components/AppLayout'
 import { BrainPage } from './pages/Brain'
+import { ProductionPage } from './pages/Production'
 import { InstructionPage } from './pages/Instruction'
 import { SchedulePage } from './pages/Schedule'
 import { ResultsPage } from './pages/Results'
@@ -11,6 +12,7 @@ export default function App() {
     <AuthGate>
       <Routes>
         <Route element={<AppLayout />}>
+          <Route path="/production" element={<ProductionPage />} />
           <Route path="/brain" element={<BrainPage />} />
           <Route path="/instruction" element={<InstructionPage />} />
           <Route path="/schedule" element={<SchedulePage />} />
@@ -21,7 +23,7 @@ export default function App() {
         <Route path="/perintah" element={<Navigate replace to="/instruction" />} />
         <Route path="/jadwal" element={<Navigate replace to="/schedule" />} />
         <Route path="/hasil" element={<Navigate replace to="/results" />} />
-        <Route path="*" element={<Navigate replace to="/brain" />} />
+        <Route path="*" element={<Navigate replace to="/production" />} />
       </Routes>
     </AuthGate>
   )