diff --git a/app/assets/stylesheets/bar.css b/app/assets/stylesheets/bar.css
index 1aa2494de..077412a4d 100644
--- a/app/assets/stylesheets/bar.css
+++ b/app/assets/stylesheets/bar.css
@@ -11,7 +11,9 @@
     inset: auto 0 0 0;
     max-block-size: 100%;
     padding-block: var(--block-space) calc(var(--block-space) + env(safe-area-inset-bottom));
-    padding-inline: calc(var(--tray-size) + calc(var(--inline-space) * 3));
+    padding-inline:
+      calc(var(--tray-size) + calc(var(--inline-space) * 3) + env(safe-area-inset-left))
+      calc(var(--tray-size) + calc(var(--inline-space) * 3) + env(safe-area-inset-right));
     place-content: center;
     position: fixed;
     view-transition-name: bar;
diff --git a/app/assets/stylesheets/layout.css b/app/assets/stylesheets/layout.css
index f4157a270..e82992dfc 100644
--- a/app/assets/stylesheets/layout.css
+++ b/app/assets/stylesheets/layout.css
@@ -12,7 +12,9 @@
     inline-size: 100dvw;
     margin-inline: auto;
     max-inline-size: 100dvw;
-    padding-inline: var(--main-padding);
+    padding-inline:
+      calc(var(--main-padding) + env(safe-area-inset-left))
+      calc(var(--main-padding) + env(safe-area-inset-right));
     text-align: center;
   }