style: remove layout animation

src/components/buttons/play/play.tsx

@@ -1,6 +1,5 @@
 import { useEffect } from 'react';
 import { BiPause, BiPlay } from 'react-icons/bi/index';
-import { motion } from 'framer-motion';
 
 import { useSoundStore } from '@/store';
 import { useSnackbar } from '@/contexts/snackbar';
@@ -27,10 +26,9 @@ export function PlayButton() {
   }, [isPlaying, pause, noSelected]);
 
   return (
-    <motion.button
+    <button
       aria-disabled={noSelected}
       className={cn(styles.playButton, noSelected && styles.disabled)}
-      layout
       onClick={handleClick}
     >
       {isPlaying ? (
@@ -48,6 +46,6 @@ export function PlayButton() {
           Play
         </>
       )}
-    </motion.button>
+    </button>
   );
 }

src/components/category/category.tsx

@@ -1,5 +1,3 @@
-import { motion } from 'framer-motion';
-
 import { Sounds } from '@/components/sounds';
 
 import styles from './category.module.css';
@@ -18,7 +16,7 @@ export function Category({
   title,
 }: CategoryProps) {
   return (
-    <motion.div className={styles.category}>
+    <div className={styles.category}>
       <div className={styles.iconContainer}>
         <div className={styles.tail} />
         <div className={styles.icon}>{icon}</div>
@@ -27,6 +25,6 @@ export function Category({
       <h2 className={styles.title}>{title}</h2>
 
       <Sounds functional={functional} id={id} sounds={sounds} />
-    </motion.div>
+    </div>
   );
 }