feat(frontend): implement complete React frontend with Vite, TypeScript, and Tailwind

Complete frontend implementation (FE-001 to FE-006):

FE-001: Setup Ambiente React
- Initialize Vite + React + TypeScript project
- Configure Tailwind CSS with custom theme
- Add shadcn/ui components (Button, Card, Badge, Table, DropdownMenu, Toaster)
- Install dependencies: axios, react-query, react-router-dom, lucide-react, etc.
- Configure path aliases (@/components, @/lib, etc.)

FE-002: Configurazione API Client
- Create lib/api.ts with Axios instance
- Add TypeScript types for Scenario, Metrics, etc.
- Configure environment variable VITE_API_URL

FE-003: React Query Hooks
- Create QueryProvider with React Query client
- Add useScenarios hook with pagination/filters
- Add useScenario hook for detail view
- Add mutations: create, update, delete, start, stop
- Add useMetrics hook with auto-refresh
- Implement cache invalidation

FE-004: Layout e Navigazione
- Create Layout component with Header and Sidebar
- Configure React Router with routes:
  * / - Dashboard
  * /scenarios - Scenarios list
  * /scenarios/:id - Scenario detail
- Implement responsive navigation
- Add active state styling

FE-005: Dashboard Page
- Create Dashboard with stat cards
- Display total scenarios, running count, total cost, PII violations
- Use real data from useScenarios hook
- Add loading states

FE-006: Scenarios List Page
- Create ScenariosPage with data table
- Display scenario name, status (with badge), region, requests, cost
- Add action dropdown (Start, Stop, Delete)
- Implement navigation to detail view

Components Created:
- ui/button.tsx - Button component with variants
- ui/card.tsx - Card component with header/content/footer
- ui/badge.tsx - Badge component for status
- ui/table.tsx - Table component
- ui/dropdown-menu.tsx - Dropdown menu
- ui/toaster.tsx - Toast notifications

Pages Created:
- Dashboard.tsx - Main dashboard view
- ScenariosPage.tsx - List of scenarios
- ScenarioDetail.tsx - Scenario detail with metrics
- NotFound.tsx - 404 page

All features integrated with backend API.

Tasks: FE-001, FE-002, FE-003, FE-004, FE-005, FE-006 complete

frontend/src/components/ui/toaster.tsx

@@ -0,0 +1,51 @@
+import { useState, useEffect } from 'react'
+
+interface Toast {
+  id: string
+  title?: string
+  description?: string
+  variant?: 'default' | 'destructive'
+}
+
+const Toaster = () => {
+  const [toasts, setToasts] = useState<Toast[]>([])
+
+  useEffect(() => {
+    const handleToast = (e: CustomEvent<Toast>) => {
+      const toast = { ...e.detail, id: Math.random().toString(36) }
+      setToasts((prev) => [...prev, toast])
+      
+      setTimeout(() => {
+        setToasts((prev) => prev.filter((t) => t.id !== toast.id))
+      }, 5000)
+    }
+
+    window.addEventListener('toast' as any, handleToast)
+    return () => window.removeEventListener('toast' as any, handleToast)
+  }, [])
+
+  if (toasts.length === 0) return null
+
+  return (
+    <div className="fixed bottom-4 right-4 z-50 flex flex-col gap-2">
+      {toasts.map((toast) => (
+        <div
+          key={toast.id}
+          className={`rounded-lg border p-4 shadow-lg ${
+            toast.variant === 'destructive'
+              ? 'border-destructive bg-destructive text-destructive-foreground'
+              : 'border-border bg-background'
+          }`}
+        >
+          {toast.title && <div className="font-semibold">{toast.title}</div>}
+          {toast.description && <div className="text-sm">{toast.description}</div>}
+        </div>
+      ))}
+    </div>
+  )
+}
+
+export { Toaster }
+export const toast = (props: Omit<Toast, 'id'>) => {
+  window.dispatchEvent(new CustomEvent('toast', { detail: props }))
+}