diff --git a/app/soapbox/components/loading-screen.tsx b/app/soapbox/components/loading-screen.tsx
index ffa1fa8f96..d132933a4f 100644
--- a/app/soapbox/components/loading-screen.tsx
+++ b/app/soapbox/components/loading-screen.tsx
@@ -9,11 +9,9 @@ const LoadingScreen: React.FC = () => {
     <div className='fixed h-screen w-screen'>
       <LandingGradient />
 
-      <div className='fixed h-screen w-screen flex items-center justify-center z-10'>
+      <div className='fixed d-screen w-screen flex items-center justify-center z-10'>
         {/* Bump up spinner vertically to counteract optical illusion. */}
-        <div className='-translate-y-3/4'>
-          <Spinner size={40} withText={false} />
-        </div>
+        <Spinner size={40} withText={false} />
       </div>
     </div>
   );
diff --git a/app/styles/application.scss b/app/styles/application.scss
index 03f8ff65d5..660fb4a683 100644
--- a/app/styles/application.scss
+++ b/app/styles/application.scss
@@ -102,6 +102,10 @@
   .shadow-inset {
     box-shadow: inset 0 0 0 1px rgb(255 255 255 / 10%);
   }
+
+  .d-screen {
+    height: 100dvh;
+  }
 }
 
 @import 'forms';