# Panel (Admin Dashboard)

## Stack
- React 19 + React Router v7 + Tailwind CSS v4 (Vite plugin) + Lucide icons.
- No component library (no Radix, no shadcn). All styling is inline Tailwind.
- No external state management. All state via custom hooks (`useAuth`, `useUsers`, `useItems`, `useDashboard`, `useGameRoom`).

## API Client
- Thin `fetch` wrapper in `src/lib/api.ts` with typed generics: `get`, `post`, `put`, `del`.
- Credentials: `same-origin` only — CORS requests will fail.
- 401 responses redirect to Discord auth. No retry logic.
- 204 / empty responses return `undefined`.

## WebSocket
- Singleton pattern in `useWebSocket()`. Global handler Set — multiple hooks share one connection.
- Auto-reconnects with exponential backoff (max 30s).
- `send()` and `subscribe()` API for components.

## Patterns
- **Draft editing:** Pages use `selectedUser → userDraft` flow. Changes aren't auto-saved. `saveDraft()` commits, `discardDraft()` reverts, `isDirty()` detects changes.
- **Debounced search:** 300ms debounce on search inputs.
- **No cache invalidation:** After mutations, manually call `refetch()` to update lists.

## Routing
- Role-based: player routes (`/dashboard`, `/games`, `/leaderboards`) and admin routes (`/admin/*`).
- Sidebar auto-hides admin routes for non-admins.

## Theme
- Dark theme with "Celestial Gold" primary (`#e9c349`).
- Semantic colors: destructive, success, warning, info.
- 4-tier surface hierarchy. Utility: `cn()` from `clsx + tailwind-merge`.