reports page: spec-driven generate panel, list, and sliceable viewer

Add a /reports page built on react-openapi's runtime configs:
- inline generate panel (GroupSpec enum, prefetched payee picker,
  strict DD-MM-YYYY range, 400 surfacing)
- metadata report list with view/regenerate/delete
- viewer that slices the cached per-entity payload via
  metadata.group_options, aggregates metrics + txns, pivots
  period x payee, and renders month accordions
- route + nav entry; no hand-rolled schema duplication

src/main.jsx

@@ -18,6 +18,7 @@ import Home from './Home';
 import FetchRequests from './FetchRequest/FetchRequestCreate';
 import FetchRequestDetail from './FetchRequest/FetchRequestDetail';
 import Expense from './Expense/Expense';
+import Reports from './Reports/Reports';
 import { AppProvider, useAppContext, Admin, ProfileRoutes } from '../react-openapi';
 import { AuthProvider, AuthPage, useAuth, ProfileCreate, ProfileEdit, ProfileView } from "../react-auth";
 import Header from './Header';
@@ -80,6 +81,7 @@ const routerMapping = [
   { path: "/fetch-requests", component: FetchRequests, headerTitle: "Fetch Requests" },
   { path: "/fetch-requests/:id", component: FetchRequestDetail, headerTitle: "Fetch Request" },
   { path: "/expenses", component: Expense, headerTitle: "Expenses" },
+  { path: "/reports", component: Reports, headerTitle: "Reports" },
   { path: "/admin/*", component: Admin, headerTitle: "Admin" },
   { path: "/profile/*", component: ProfileRoutes, headerTitle: "Profile" },
 ];