website refactor

apps/website/ui/StatCard.tsx

@@ -9,7 +9,9 @@ export interface StatCardProps {
   label: string;
   value: string | number;
   icon?: LucideIcon;
-  intent?: 'primary' | 'success' | 'warning' | 'critical' | 'telemetry' | 'low';
+  intent?: 'primary' | 'success' | 'warning' | 'critical' | 'telemetry' | 'low' | 'high' | 'med';
+  variant?: 'default' | 'dark' | 'muted' | 'glass' | 'outline';
+  font?: 'sans' | 'mono';
   trend?: {
     value: number;
     isPositive: boolean;
@@ -22,17 +24,19 @@ export const StatCard = ({
   value, 
   icon, 
   intent = 'primary',
+  variant = 'default',
+  font = 'sans',
   trend,
   footer 
 }: StatCardProps) => {
   return (
-    <Card variant="default">
+    <Card variant={variant}>
       <Box display="flex" alignItems="start" justifyContent="between" marginBottom={4}>
         <Box>
           <Text size="xs" weight="bold" variant="low" uppercase>
             {label}
           </Text>
-          <Text size="2xl" weight="bold" variant="high" block marginTop={1}>
+          <Text size="2xl" weight="bold" variant={intent as any || 'high'} font={font} block marginTop={1}>
             {value}
           </Text>
         </Box>