--- a/browser/components/customizableui/CustomizeMode.jsm
+++ b/browser/components/customizableui/CustomizeMode.jsm
@@ -621,19 +621,19 @@ CustomizeMode.prototype = {
 
     let toolboxRect = this.window.gNavToolbox.getBoundingClientRect();
     let height = toolboxRect.bottom;
 
     if (AppConstants.platform == "macosx") {
       let drawingInTitlebar = !docElement.hasAttribute("drawtitle");
       let titlebar = this.document.getElementById("titlebar");
       if (drawingInTitlebar) {
-        titlebar.style.backgroundImage = headerImageRef;
+        titlebar.setProperty("--lwt-header-image", headerImageRef);
       } else {
-        titlebar.style.removeProperty("background-image");
+        titlebar.style.removeProperty("--lwt-header-image");
       }
     }
 
     let limitedBG = "-moz-image-rect(" + headerImageRef + ", 0, 100%, " +
                     height + ", 0)";
 
     let ridgeStart = height - 1;
     let ridgeCenter = (ridgeStart + 1) + "px";
@@ -642,37 +642,40 @@ CustomizeMode.prototype = {
 
     let ridge = "linear-gradient(to bottom, " +
                                  "transparent " + ridgeStart +
                                  ", rgba(0,0,0,0.25) " + ridgeStart +
                                  ", rgba(0,0,0,0.25) " + ridgeCenter +
                                  ", rgba(255,255,255,0.5) " + ridgeCenter +
                                  ", rgba(255,255,255,0.5) " + ridgeEnd + ", " +
                                  "transparent " + ridgeEnd + ")";
-    deck.style.backgroundImage = ridge + ", " + limitedBG;
+    deck.style.setProperty("--lwt-header-image", ridge + ", " + limitedBG);
+
+    let tabs = this.document.getElementById("tabbrowser-tabs");
+    tabs.style.setProperty("--lwt-header-image", headerImageRef);
 
     /* Remove the background styles from the <window> so we can style it instead. */
-    docElement.style.removeProperty("background-image");
-    docElement.style.removeProperty("background-color");
+    docElement.style.removeProperty("--lwt-header-image");
+    docElement.style.removeProperty("--lwt-accentcolor");
   },
 
   removeLWTStyling() {
     let affectedNodes = AppConstants.platform == "macosx" ?
                           ["tab-view-deck", "titlebar"] :
                           ["tab-view-deck"];
     for (let id of affectedNodes) {
       let node = this.document.getElementById(id);
-      node.style.removeProperty("background-image");
+      node.style.removeProperty("--lwt-header-image");
     }
     let docElement = this.document.documentElement;
     docElement.removeAttribute("customization-lwtheme");
     let data = docElement._lightweightTheme.getData();
     if (data && data.headerURL) {
-      docElement.style.backgroundImage = this._getHeaderImageRef(data);
-      docElement.style.backgroundColor = data.accentcolor || "white";
+      docElement.style.setProperty("--lwt-header-image", this._getHeaderImageRef(data));
+      docElement.style.setProperty("--lwt-accentcolor", data.accentcolor || "white");
     }
   },
 
   _getHeaderImageRef(aData) {
     return "url(\"" + aData.headerURL.replace(/"/g, '\\"') + "\")";
   },
 
   maybeShowTip(aAnchor) {

--- a/browser/themes/linux/browser.css
+++ b/browser/themes/linux/browser.css
@@ -1537,17 +1537,17 @@ notification.pluginVulnerable > .notific
   background-attachment: fixed;
 }
 
 #main-window[customization-lwtheme] > #tab-view-deck:-moz-lwtheme {
   background-repeat: no-repeat;
   background-position: right top;
   background-attachment: fixed;
   /* The image will get set from CustomizeMode.jsm */
-  background-image: none;
+  background-image: var(--lwt-header-image);
   background-color: transparent;
 }
 
 #main-window[customization-lwtheme]:-moz-lwtheme {
   background-image: url("chrome://browser/skin/customizableui/customizeMode-gridTexture.png"),
                     url("chrome://browser/skin/customizableui/background-noise-toolbar.png"),
                     linear-gradient(to bottom, #bcbcbc, #b5b5b5);
   background-color: #b5b5b5;

--- a/browser/themes/osx/browser.css
+++ b/browser/themes/osx/browser.css
@@ -3199,17 +3199,17 @@ menulist.translate-infobar-element > .me
 }
 
 #main-window[tabsintitlebar][customization-lwtheme] > #titlebar:-moz-lwtheme,
 #main-window[customization-lwtheme] > #tab-view-deck:-moz-lwtheme {
   background-repeat: no-repeat;
   background-position: right top;
   background-attachment: fixed;
   /* The image will get set from CustomizeMode.jsm */
-  background-image: none;
+  background-image: var(--lwt-header-image);
   background-color: transparent;
 }
 
 #main-window[customization-lwtheme]:-moz-lwtheme {
   background-image: url("chrome://browser/skin/customizableui/customizeMode-gridTexture.png"),
                     url("chrome://browser/skin/customizableui/background-noise-toolbar.png");
   background-color: rgb(178,178,178);
   background-repeat: repeat;

--- a/browser/themes/windows/browser.css
+++ b/browser/themes/windows/browser.css
@@ -2340,17 +2340,17 @@ notification.pluginVulnerable > .notific
   background-attachment: fixed;
 }
 
 #main-window[customization-lwtheme] > #tab-view-deck:-moz-lwtheme {
   background-repeat: no-repeat;
   background-position: right top;
   background-attachment: fixed;
   /* The image will get set from CustomizeMode.jsm */
-  background-image: none;
+  background-image: var(--lwt-header-image);
   background-color: transparent;
 }
 
 #main-window[customization-lwtheme]:-moz-lwtheme {
   background-image: url("chrome://browser/skin/customizableui/customizeMode-gridTexture.png");
   background-repeat: repeat;
   background-attachment: fixed;
   background-position: left top;