thisisforaigeneratedcode/kenya-response-hub

# Kaa-Rada — Real-Time Disaster Management for Kenya > **Report. Respond. Recover.** Kaa-Rada is a real-time flood and disaster management web application built for Kenya's 47 counties. It connects citizens reporting emergencies with responders and administrators through a unified, dark-themed command-center interface. **Live URL:** kaa-rada-guard.lovable.app --- ## Tech Stack | Layer | Technology | |-------|-----------| | Frontend | React 18 + TypeScript + Vite | | Routing | React Router v6 (SPA) | | Styling | Tailwind CSS (custom dark design system) | | UI Components | shadcn/ui (Radix primitives) | | Backend / Auth | Supabase (Auth, PostgreSQL, Realtime, Storage) | | Maps | Leaflet.js + react-leaflet | | Charts | Recharts | | Icons | lucide-react | | Animations | Framer Motion | --- ## Design System All colors are defined in `src/index.css` and `tailwind.config.ts`. **No raw color values in components.** | Token | Value | Usage | |-------|-------|-------| | Background | `#0f172a` | Page backgrounds | | Surface | `#1e293b` | Cards, panels | | Border subtle | `#334155` | Dividers | | Primary (Sky Blue) | `#38bdf8` | Actions, links, medium severity | | Success (Emerald) | `#34d399` | Resolved status, low severity | | Warning (Amber) | `#f59e0b` | Pending status, high severity | | Danger (Rose) | `#fb7185` | Critical severity | | AI Purple | `#a78bfa` | AI triage panels | | Font | Inter | Imported from Google Fonts | **Severity Scale:** Rose (5/Critical) → Amber (4/High) → Sky Blue (3/Medium) → Emerald (1-2/Low) --- ## User Roles Stored in the `profiles` table. Users select their role at signup. | Role | Access | |------|--------| | **Citizen** | Report incidents, view own reports, message responders | | **Responder** | Real-time incident queue, assign to self, live map, messaging | | **Admin** | System-wide stats, user management, all incidents, broadcast alerts | --- ## Pages & Routes | Route | Access | Description | |-------|--------|---- …