fix(frontend): prevent font blurriness caused by scale animations (#183)

Remove scale transforms from Framer Motion animations that cause subpixel rendering issues on text elements. Replace with opacity + translateY for smooth animations without blur.

- Remove scale from FadeIn component (animated-page.tsx)
- Remove scale from login page entrance animation (index.tsx)
- Remove scale from search bar button animation (search-bar.tsx)
- Remove whileTap scale from sidebar menu buttons (admin.tsx)
- Remove scale from captcha modal animation (globals.css)
- Add .gpu-accelerated utility class for future use

Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-opencode)

Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>

vite-frontend/src/components/animated-page.tsx

@@ -100,6 +100,7 @@ export const StaggerItem = ({
 
 /**
  * Simple fade-in animation for standalone elements (chips, badges, counters, etc.)
+ * Uses opacity + translateY to avoid font blurriness caused by scale transforms.
  */
 export const FadeIn = ({
     children,
@@ -111,9 +112,9 @@ export const FadeIn = ({
     className?: string;
 }) => (
     <motion.div
-        animate={{ opacity: 1, scale: 1 }}
+        animate={{ opacity: 1, y: 0 }}
         className={className}
-        initial={{ opacity: 0, scale: 0.95 }}
+        initial={{ opacity: 0, y: 8 }}
         transition={{ duration: 0.2, delay, ease: "easeOut" }}
     >
         {children}

vite-frontend/src/components/search-bar.tsx

@@ -29,8 +29,8 @@ export function SearchBar({
                     <motion.div
                         key="search-btn"
                         animate={{ opacity: 1, scale: 1 }}
-                        exit={{ opacity: 0, scale: 0.8 }}
-                        initial={{ opacity: 0, scale: 0.8 }}
+                        exit={{ opacity: 0 }}
+                        initial={{ opacity: 0 }}
                         transition={{ duration: 0.12 }}
                     >
                         <Button