diff --git a/browser/themes/shared/tabbrowser/content-area.css b/browser/themes/shared/tabbrowser/content-area.css
index 13403bf438be18b5bcc9f3d497c94636b5fb5f6f..0505582a7efa212813cf39835c12d34d4d38eb4e 100644
--- a/browser/themes/shared/tabbrowser/content-area.css
+++ b/browser/themes/shared/tabbrowser/content-area.css
@@ -85,7 +85,6 @@
   min-height: 0;
 
   /* We want to be able to show the frame color behind the clipped radiused corner */
-  background: var(--tabpanel-background-color);
 
   /* stylelint-disable-next-line media-query-no-invalid */
   @media -moz-pref("sidebar.revamp") {
@@ -141,7 +140,6 @@
   }
 
   browser:is([blank], [pendingpaint]) {
-    opacity: 0;
   }
 
   /* Exclude browsers with smartwindow-content attribute which inherit
@@ -427,7 +425,7 @@ split-view-footer {
 
 .dialogStack {
   z-index: var(--browser-stack-z-index-dialog-stack);
-  position: absolute;
+  position: fixed;
   inset: 0;
   /* --browser-with-dialog set on browser[tabDialogShowing], we want to position the overlay
      only on the top of the <browser> element so it doesn't overlap the DevTools toolbox */
@@ -594,7 +592,7 @@ split-view-footer {
 
 .dialogOverlay[topmost="true"],
 #window-modal-dialog::backdrop {
-  background-color: var(--background-color-overlay);
+  background-color: light-dark(rgba(255, 255, 255, .3), rgba(0, 0, 0, .3));
 }
 
 .dialogOverlay[hideContent="true"][topmost="true"] {
