diff --git a/packages/mobile/src/MobileWebAppContainer.tsx b/packages/mobile/src/MobileWebAppContainer.tsx
index 2e01aeebf..a31ba3789 100644
--- a/packages/mobile/src/MobileWebAppContainer.tsx
+++ b/packages/mobile/src/MobileWebAppContainer.tsx
@@ -370,7 +370,9 @@ const MobileWebAppContents = ({ destroyAndReload }: { destroyAndReload: () => vo
     document.documentElement.style.setProperty('--safe-area-inset-right', '${insets.right}px');
     true;
   `
-  webViewRef.current?.injectJavaScript(injectJS)
+  if (Platform.OS === 'android') {
+    webViewRef.current?.injectJavaScript(injectJS)
+  }
 
   if (showAndroidWebviewUpdatePrompt) {
     return (
diff --git a/packages/web/src/stylesheets/_main.scss b/packages/web/src/stylesheets/_main.scss
index c31f9e698..0d280c956 100644
--- a/packages/web/src/stylesheets/_main.scss
+++ b/packages/web/src/stylesheets/_main.scss
@@ -25,10 +25,10 @@
 
   --reach-checkbox: 1;
 
-  --safe-area-inset-top: 0px;
-  --safe-area-inset-bottom: 0px;
-  --safe-area-inset-left: 0px;
-  --safe-area-inset-right: 0px;
+  --safe-area-inset-top: env(safe-area-inset-top, 0);
+  --safe-area-inset-bottom: env(safe-area-inset-bottom, 0);
+  --safe-area-inset-left: env(safe-area-inset-left, 0);
+  --safe-area-inset-right: env(safe-area-inset-right, 0);
 
   --sn-stylekit-font-size-editor: 0.9375rem;