From 741ee2acf9d8c992c7ea38db90764df47eecfff1 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Sun, 15 Dec 2024 13:21:39 +0000
Subject: [PATCH] Adjust animation starting position

Ensure that animations in the container start from the bottom instead of two-thirds of the way up. This change improves the visual experience of the animations.
[skip gpt_engineer]
---
 src/components/game/animations/MemeAnimation.tsx | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/src/components/game/animations/MemeAnimation.tsx b/src/components/game/animations/MemeAnimation.tsx
index 50984c3..0d08ea7 100644
--- a/src/components/game/animations/MemeAnimation.tsx
+++ b/src/components/game/animations/MemeAnimation.tsx
@@ -13,18 +13,15 @@ export const MemeAnimation = ({ className = '' }: { className?: string }) => {
 
   useEffect(() => {
     const interval = setInterval(() => {
-      // Add new emoji with wider horizontal distribution
       setEmojis(current => {
         const newEmoji = {
           id: Date.now(),
           symbol: symbols[Math.floor(Math.random() * symbols.length)],
-          // Use full width (0 to 100%) for positioning
           x: Math.random() * 100,
         };
         return [...current, newEmoji];
       });
 
-      // Clean up old emojis
       setEmojis(current => current.filter(emoji => Date.now() - emoji.id < 3000));
     }, 300);
 
@@ -65,9 +62,9 @@ export const MemeAnimation = ({ className = '' }: { className?: string }) => {
           {emojis.map((emoji) => (
             <motion.div
               key={emoji.id}
-              className="absolute text-2xl"
+              className="absolute text-2xl bottom-0"
               initial={{ 
-                y: '100%',
+                y: '0%',
                 x: `${emoji.x}%`,
                 opacity: 0,
                 scale: 0.5