diff --git a/packages/web/src/app/(auth)/layout.tsx b/packages/web/src/app/(auth)/layout.tsx
index 11d524d..24b2137 100644
--- a/packages/web/src/app/(auth)/layout.tsx
+++ b/packages/web/src/app/(auth)/layout.tsx
@@ -20,7 +20,7 @@ const AuthLayout = ({ children }: PropsWithChildren) => {
         <div className="bg-primary/15 absolute -right-[15vmin] -bottom-[15vmin] min-h-[75vmin] min-w-[75vmin] rotate-45" />
       </div>
 
-      <div className="z-10 flex w-full max-w-xl flex-col items-center gap-5">
+      <div className="z-10 flex w-full max-w-xl flex-col items-center gap-4">
         <BrandHeading size="md" />
         {inner}
       </div>
diff --git a/packages/web/src/components/game/join/BrandShell.tsx b/packages/web/src/components/game/join/BrandShell.tsx
index 581fced..8b93f7e 100644
--- a/packages/web/src/components/game/join/BrandShell.tsx
+++ b/packages/web/src/components/game/join/BrandShell.tsx
@@ -3,7 +3,7 @@
 import { PropsWithChildren } from "react"
 
 const BrandShell = ({ children }: PropsWithChildren) => (
-  <div className="flex min-h-screen flex-col items-center justify-center gap-6 px-4">
+  <div className="flex w-full max-w-xl flex-col items-center justify-center gap-4">
     {children}
   </div>
 )