feat: comprehensive security and architecture improvements

- Add Zod validation schemas with strong password requirements (12+ chars, complexity)
- Implement rate limiting for authentication endpoints (registration, password reset)
- Remove duplicate MetricCard component, consolidate to ui/metric-card.tsx
- Update README.md to use pnpm commands consistently
- Enhance authentication security with 12-round bcrypt hashing
- Add comprehensive input validation for all API endpoints
- Fix security vulnerabilities in user registration and password reset flows

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

components/charts/bar-chart.tsx

@@ -61,10 +61,13 @@ export default function ModernBarChart({
       )}
       <CardContent>
         <ResponsiveContainer width="100%" height={height}>
-          <BarChart data={data} margin={{ top: 5, right: 30, left: 20, bottom: 5 }}>
-            <CartesianGrid 
-              strokeDasharray="3 3" 
-              stroke="hsl(var(--border))" 
+          <BarChart
+            data={data}
+            margin={{ top: 5, right: 30, left: 20, bottom: 5 }}
+          >
+            <CartesianGrid
+              strokeDasharray="3 3"
+              stroke="hsl(var(--border))"
               strokeOpacity={0.3}
             />
             <XAxis
@@ -84,14 +87,14 @@ export default function ModernBarChart({
               axisLine={false}
             />
             <Tooltip content={<CustomTooltip />} />
-            <Bar 
-              dataKey={dataKey} 
+            <Bar
+              dataKey={dataKey}
               radius={[4, 4, 0, 0]}
               className="transition-all duration-200"
             >
               {data.map((entry, index) => (
-                <Cell 
-                  key={`cell-${index}`} 
+                <Cell
+                  key={`cell-${index}`}
                   fill={colors[index % colors.length]}
                   className="hover:opacity-80"
                 />

components/charts/donut-chart.tsx

@@ -1,6 +1,13 @@
 "use client";
 
-import { PieChart, Pie, Cell, ResponsiveContainer, Tooltip, Legend } from "recharts";
+import {
+  PieChart,
+  Pie,
+  Cell,
+  ResponsiveContainer,
+  Tooltip,
+  Legend,
+} from "recharts";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 
 interface DonutChartProps {
@@ -22,9 +29,7 @@ const CustomTooltip = ({ active, payload }: any) => {
       <div className="rounded-lg border bg-background p-3 shadow-md">
         <p className="text-sm font-medium">{data.name}</p>
         <p className="text-sm text-muted-foreground">
-          <span className="font-medium text-foreground">
-            {data.value}
-          </span>{" "}
+          <span className="font-medium text-foreground">{data.value}</span>{" "}
           sessions ({((data.value / data.payload.total) * 100).toFixed(1)}%)
         </p>
       </div>
@@ -77,7 +82,7 @@ export default function ModernDonutChart({
   className,
 }: DonutChartProps) {
   const total = data.reduce((sum, item) => sum + item.value, 0);
-  const dataWithTotal = data.map(item => ({ ...item, total }));
+  const dataWithTotal = data.map((item) => ({ ...item, total }));
 
   return (
     <Card className={className}>

components/charts/line-chart.tsx

@@ -60,7 +60,10 @@ export default function ModernLineChart({
       )}
       <CardContent>
         <ResponsiveContainer width="100%" height={height}>
-          <ChartComponent data={data} margin={{ top: 5, right: 30, left: 20, bottom: 5 }}>
+          <ChartComponent
+            data={data}
+            margin={{ top: 5, right: 30, left: 20, bottom: 5 }}
+          >
             <defs>
               {gradient && (
                 <linearGradient id="colorGradient" x1="0" y1="0" x2="0" y2="1">
@@ -69,9 +72,9 @@ export default function ModernLineChart({
                 </linearGradient>
               )}
             </defs>
-            <CartesianGrid 
-              strokeDasharray="3 3" 
-              stroke="hsl(var(--border))" 
+            <CartesianGrid
+              strokeDasharray="3 3"
+              stroke="hsl(var(--border))"
               strokeOpacity={0.3}
             />
             <XAxis
@@ -88,7 +91,7 @@ export default function ModernLineChart({
               axisLine={false}
             />
             <Tooltip content={<CustomTooltip />} />
-            
+
             {gradient ? (
               <Area
                 type="monotone"