Stat card hover animations and problem card quick run

src/app/globals.css

@@ -215,7 +215,6 @@
   }
 
   .card-hover:hover {
-    @apply -translate-y-1;
     box-shadow: 0 10px 40px color-mix(in oklch, var(--primary) 15%, transparent);
   }
 

src/app/problems/components/ProblemCard.tsx

@@ -9,7 +9,14 @@ interface ProblemCardProps {
   index?: number;
 }
 
-const ProblemCard = ({ name, difficulty, tags, bestTime, attempts, index = 0 }: ProblemCardProps) => {
+const ProblemCard = ({
+  name,
+  difficulty,
+  tags,
+  bestTime,
+  attempts,
+  index = 0,
+}: ProblemCardProps) => {
   const difficultyStyles = {
     easy: "diff-easy",
     medium: "diff-medium",
@@ -25,7 +32,10 @@ const ProblemCard = ({ name, difficulty, tags, bestTime, attempts, index = 0 }:
   return (
     <div
       className={`group relative bg-card border border-border rounded-xl p-5 card-hover cursor-pointer animate-fade-in opacity-0`}
-      style={{ animationDelay: `${index * 0.1}s`, animationFillMode: 'forwards' }}
+      style={{
+        animationDelay: `${index * 0.1}s`,
+        animationFillMode: "forwards",
+      }}
     >
       {/* Glow effect on hover */}
       <div className="absolute inset-0 rounded-xl bg-primary/5 opacity-0 group-hover:opacity-100 transition-opacity duration-300" />
@@ -36,7 +46,9 @@ const ProblemCard = ({ name, difficulty, tags, bestTime, attempts, index = 0 }:
           <h3 className="font-semibold text-foreground group-hover:text-primary transition-colors">
             {name}
           </h3>
-          <span className={`px-2 py-1 rounded-md text-xs font-medium ${difficultyStyles[difficulty]}`}>
+          <span
+            className={`px-2 py-1 rounded-md text-xs font-medium ${difficultyStyles[difficulty]}`}
+          >
             {difficultyLabels[difficulty]}
           </span>
         </div>
@@ -68,7 +80,7 @@ const ProblemCard = ({ name, difficulty, tags, bestTime, attempts, index = 0 }:
         </div>
 
         {/* Quick run button - appears on hover */}
-        <div className="absolute top-1/2 right-4 -translate-y-1/2 opacity-0 group-hover:opacity-100 transition-all duration-300 transform translate-x-2 group-hover:translate-x-0">
+        <div className="absolute bottom-0 right-0 opacity-0 group-hover:opacity-100 transition-all duration-300 transform translate-x-2 group-hover:translate-x-0">
           <button className="p-2 rounded-lg bg-primary text-primary-foreground">
             <Zap className="h-4 w-4" />
           </button>