diff --git a/frontend/src/app/(auth)/login/page.tsx b/frontend/src/app/(auth)/login/page.tsx
index 82fcf8b90..6fb48a572 100644
--- a/frontend/src/app/(auth)/login/page.tsx
+++ b/frontend/src/app/(auth)/login/page.tsx
@@ -130,7 +130,7 @@ export default function LoginPage() {
   const actualTheme = theme === "system" ? resolvedTheme : theme;
 
   return (
-    <div className="bg-background flex min-h-screen items-center justify-center">
+    <div className="bg-background relative flex min-h-screen items-center justify-center overflow-x-hidden overflow-y-auto">
       <FlickeringGrid
         className="absolute inset-0 z-0 mask-[url(/images/deer.svg)] mask-size-[100vw] mask-center mask-no-repeat md:mask-size-[72vh]"
         squareSize={4}
diff --git a/frontend/src/components/ui/flickering-grid.tsx b/frontend/src/components/ui/flickering-grid.tsx
index 15bc3c8eb..54823a343 100644
--- a/frontend/src/components/ui/flickering-grid.tsx
+++ b/frontend/src/components/ui/flickering-grid.tsx
@@ -186,12 +186,12 @@ export const FlickeringGrid: React.FC<FlickeringGridProps> = ({
   return (
     <div
       ref={containerRef}
-      className={cn(`h-full w-full ${className}`)}
+      className={cn("h-full w-full overflow-hidden", className)}
       {...props}
     >
       <canvas
         ref={canvasRef}
-        className="pointer-events-none"
+        className="pointer-events-none block"
         style={{
           width: canvasSize.width,
           height: canvasSize.height,