feat: implement analytics dashboard layout (task 10)

- Add analytics types (AnalyticsSummary, DateRange)
- Create analyticsService for API calls and CSV export
- Implement DateRangeSelector component with presets
- Create StatCard component for summary statistics
- Build responsive AnalyticsPage with:
  - Summary statistics cards (reports, events, users, litter collected)
  - Date range filtering with presets
  - CSV export functionality
  - Loading and error states
  - Responsive grid layout

Requirements: 5.1, 5.5

src/components/analytics/StatCard.tsx

@@ -0,0 +1,39 @@
+interface StatCardProps {
+  title: string;
+  value: number | string;
+  icon?: React.ReactNode;
+  trend?: {
+    value: number;
+    isPositive: boolean;
+  };
+  subtitle?: string;
+}
+
+export function StatCard({ title, value, icon, trend, subtitle }: StatCardProps) {
+  return (
+    <div className="bg-white rounded-lg shadow p-6">
+      <div className="flex items-center justify-between mb-2">
+        <h3 className="text-sm font-medium text-gray-600">{title}</h3>
+        {icon && <div className="text-gray-400">{icon}</div>}
+      </div>
+      
+      <div className="flex items-baseline gap-2">
+        <p className="text-3xl font-bold text-gray-900">{value}</p>
+        
+        {trend && (
+          <span
+            className={`text-sm font-medium ${
+              trend.isPositive ? 'text-green-600' : 'text-red-600'
+            }`}
+          >
+            {trend.isPositive ? '↑' : '↓'} {Math.abs(trend.value)}%
+          </span>
+        )}
+      </div>
+      
+      {subtitle && (
+        <p className="text-sm text-gray-500 mt-1">{subtitle}</p>
+      )}
+    </div>
+  );
+}