fix: Move toast notifications to top-center on mobile to prevent cut-offs at bottom

src/components/ui/sonner.tsx

@@ -22,7 +22,7 @@ const Toaster = ({ ...props }: ToasterProps) => {
     return () => window.removeEventListener("resize", checkMobile)
   }, [])
 
-  const effectivePosition = isMobile ? "bottom-center" : (props.position || "top-right")
+  const effectivePosition = isMobile ? "top-center" : (props.position || "top-right")
 
   return (
     <Sonner

src/index.css

@@ -98,8 +98,8 @@
 
 @media (max-width: 639px) {
   [data-sonner-toaster] {
-    bottom: 20px !important;
-    top: auto !important;
+    top: 16px !important;
+    bottom: auto !important;
     left: 50% !important;
     transform: translateX(-50%) !important;
     width: calc(100% - 32px) !important;