Bugfix

app/globals.css

@@ -1,9 +1,15 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
+@import "tailwindcss";
 
-body {
+/* Override the dark variant to use class-based dark mode instead of media query */
+@custom-variant dark (&:where(.dark, .dark *));
+
+html, body {
   -webkit-tap-highlight-color: transparent;
+  overflow: hidden;
+  min-height: 100vh;
+  min-height: 100dvh;
+  margin: 0;
+  padding: 0;
 }
 
 /* Light mode styles */
@@ -32,8 +38,8 @@ body {
 @keyframes float-heart {
   to {
     transform: translate(
-      calc(var(--start-x) + (50vw * cos(var(--angle)))),
-      calc(var(--start-y) + (50vh * sin(var(--angle))))
+      calc(var(--start-x) + (70vw * cos(var(--angle)))),
+      calc(var(--start-y) + (70vh * sin(var(--angle))))
     ) scale(var(--scale));
     opacity: 0;
   }
@@ -50,3 +56,26 @@ body {
 .animate-fade-out {
   animation: fade-out 2s ease-out forwards;
 }
+
+@keyframes float {
+  0% {
+    opacity: 0;
+    transform: translateX(-50%) translateY(10px);
+  }
+  20% {
+    opacity: 1;
+    transform: translateX(-50%) translateY(0);
+  }
+  80% {
+    opacity: 1;
+    transform: translateX(-50%) translateY(0);
+  }
+  100% {
+    opacity: 0;
+    transform: translateX(-50%) translateY(-10px);
+  }
+}
+
+.animate-float {
+  animation: float 3s ease-out forwards;
+}