feat: add Framer Motion animations with spring physics and reduced-motion support

src/components/boards/BoardCard.tsx

@@ -1,5 +1,6 @@
 import { useState } from "react";
 import { formatDistanceToNow } from "date-fns";
+import { motion, useReducedMotion } from "framer-motion";
 import { Trash2, Copy } from "lucide-react";
 import {
   ContextMenu,
@@ -24,10 +25,12 @@ import { deleteBoard, loadBoard, saveBoard } from "@/lib/storage";
 
 interface BoardCardProps {
   board: BoardMeta;
+  index?: number;
 }
 
-export function BoardCard({ board }: BoardCardProps) {
+export function BoardCard({ board, index = 0 }: BoardCardProps) {
   const [confirmDelete, setConfirmDelete] = useState(false);
+  const prefersReducedMotion = useReducedMotion();
 
   const setView = useAppStore((s) => s.setView);
   const addRecentBoard = useAppStore((s) => s.addRecentBoard);
@@ -66,7 +69,11 @@ export function BoardCard({ board }: BoardCardProps) {
   }
 
   return (
-    <>
+    <motion.div
+      initial={prefersReducedMotion ? false : { opacity: 0, y: 10 }}
+      animate={{ opacity: 1, y: 0 }}
+      transition={{ type: "spring", stiffness: 300, damping: 25, delay: index * 0.05 }}
+    >
       <ContextMenu>
         <ContextMenuTrigger asChild>
           <button
@@ -141,6 +148,6 @@ export function BoardCard({ board }: BoardCardProps) {
           </DialogFooter>
         </DialogContent>
       </Dialog>
-    </>
+    </motion.div>
   );
 }