--- a/browser/components/downloads/content/download.xml
+++ b/browser/components/downloads/content/download.xml
@@ -13,21 +13,21 @@
           xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
           xmlns:xbl="http://www.mozilla.org/xbl">
 
   <binding id="download"
            extends="chrome://global/content/bindings/richlistbox.xml#richlistitem">
     <content orient="horizontal"
              align="center"
              onclick="DownloadsView.onDownloadClick(event);">
-      <xul:stack class="downloadStackIcon">
+      <xul:stack>
         <xul:image class="downloadTypeIcon"
                    validate="always"
                    xbl:inherits="src=image"/>
-        <xul:image class="downloadTypeIcon blockedIcon" />
+        <xul:image class="downloadBlockedBadge" />
       </xul:stack>
       <xul:vbox pack="center"
                 flex="1"
                 class="downloadContainer"
                 style="width: &downloadDetails.width;">
         <!-- We're letting localizers put a min-width in here primarily
              because of the downloads summary at the bottom of the list of
              download items. An element in the summary has the same min-width

--- a/browser/components/downloads/content/downloads.css
+++ b/browser/components/downloads/content/downloads.css
@@ -51,17 +51,17 @@ richlistitem.download button {
      is focused). */
   -moz-user-focus: none;
 }
 
 /*** Visibility of controls inside download items ***/
 .download-state:not(:-moz-any([state="6"], /* Blocked (parental) */
                               [state="8"], /* Blocked (dirty)    */
                               [state="9"]) /* Blocked (policy)   */)
-                                           .downloadTypeIcon.blockedIcon,
+                                           .downloadBlockedBadge,
 
 .download-state:not(:-moz-any([state="-1"],/* Starting (initial) */
                               [state="5"], /* Starting (queued)  */
                               [state="0"], /* Downloading        */
                               [state="4"], /* Paused             */
                               [state="7"]) /* Scanning           */)
                                            .downloadProgress,
 

--- a/browser/components/downloads/content/downloadsOverlay.xul
+++ b/browser/components/downloads/content/downloadsOverlay.xul
@@ -130,26 +130,27 @@
           <vbox id="downloadsFooter"
                 class="downloadsPanelFooter">
             <hbox id="downloadsSummary"
                   align="center"
                   orient="horizontal"
                   onkeydown="DownloadsSummary.onKeyDown(event);"
                   onclick="DownloadsSummary.onClick(event);">
               <image class="downloadTypeIcon" />
-              <vbox id="downloadsSummaryChildBox">
+              <vbox pack="center"
+                    class="downloadContainer"
+                    style="width: &downloadDetails.width;">
                 <description id="downloadsSummaryDescription"
                              style="min-width: &downloadsSummary.minWidth2;"/>
                 <progressmeter id="downloadsSummaryProgress"
                                class="downloadProgress"
                                min="0"
                                max="100"
                                mode="normal" />
                 <description id="downloadsSummaryDetails"
-                             style="width: &downloadDetails.width;"
                              crop="end"/>
               </vbox>
             </hbox>
             <button id="downloadsHistory"
                     class="plain downloadsPanelFooterButton"
                     label="&downloadsHistory.label;"
                     accesskey="&downloadsHistory.accesskey;"
                     oncommand="DownloadsPanel.showDownloadsHistory();"/>

--- a/browser/themes/shared/downloads/allDownloadsViewOverlay.inc.css
+++ b/browser/themes/shared/downloads/allDownloadsViewOverlay.inc.css
@@ -26,49 +26,46 @@
 %endif
 #downloadsRichListBox > richlistitem.download {
   padding: 5px 8px;
 }
 %ifdef XP_WIN
 }
 %endif
 
-.downloadStackIcon {
-  --inline-offset: 8px;
-  --block-offset: 4px;
-  --icon-size: 32px;
-}
-
 .downloadTypeIcon {
-  margin-inline-end: 8px;
-  width: calc(var(--icon-size) + var(--inline-offset));
-  height: calc(var(--icon-size) + var(--block-offset));
-  padding: var(--block-offset) var(--inline-offset) 0 0;
+  margin: 8px 0;
+  margin-inline-end: 12px;
+  width: 32px;
+  height: 32px;
 }
 
 %ifdef XP_WIN
 @media not all and (-moz-os-version: windows-xp) {
   .downloadTypeIcon {
     margin-inline-start: 8px;
   }
 }
 %endif
 
-.blockedIcon {
-  --overlay-image-dimensions: top right / 16px no-repeat;
-  padding: 0;
-  background: url("chrome://browser/skin/downloads/download-blocked.svg") var(--overlay-image-dimensions);
+.downloadBlockedBadge {
+  margin: 0 4px;
+  background: url("chrome://browser/skin/downloads/download-blocked.svg") top right / 16px no-repeat;
 }
 
-@item@[verdict="PotentiallyUnwanted"] .blockedIcon {
-  background: url("chrome://browser/skin/warning.svg") var(--overlay-image-dimensions);
+.downloadBlockedBadge:-moz-locale-dir(rtl) {
+  background-position-x: left;
 }
 
-@item@[verdict="Uncommon"] .blockedIcon {
-  background: url("chrome://browser/skin/info.svg") var(--overlay-image-dimensions);
+@item@[verdict="PotentiallyUnwanted"] .downloadBlockedBadge {
+  background-image: url("chrome://browser/skin/warning.svg");
+}
+
+@item@[verdict="Uncommon"] .downloadBlockedBadge {
+  background-image: url("chrome://browser/skin/info.svg");
 }
 
 .downloadTarget {
   margin-bottom: 3px;
   cursor: inherit;
 }
 
 .downloadDetails {

--- a/browser/themes/shared/downloads/downloads.inc.css
+++ b/browser/themes/shared/downloads/downloads.inc.css
@@ -78,33 +78,21 @@
   background-color: #0675d3;
 }
 
 .downloadsPanelFooterButton[default]:hover:active {
   background-color: #0568ba;
 }
 
 #downloadsSummary {
-  --summary-padding-end: 38px;
-  --summary-padding-start: 12px;
-  padding: 8px var(--summary-padding-end) 8px var(--summary-padding-start);
+  padding: 0 12px;
   cursor: pointer;
   -moz-user-focus: normal;
 }
 
-#downloadsSummary:-moz-locale-dir(rtl) {
-  padding-right: var(--summary-padding-start);
-  padding-left: var(--summary-padding-end);
-}
-
-#downloadsSummaryChildBox {
-  -moz-margin-start: var(--summary-padding-start);
-  -moz-margin-end: var(--summary-padding-end);
-}
-
 #downloadsSummary > .downloadTypeIcon {
   list-style-image: url("chrome://browser/skin/downloads/download-summary.png");
 }
 
 %ifdef XP_MACOSX
 @media (min-resolution: 2dppx) {
   #downloadsSummary > .downloadTypeIcon {
     list-style-image: url("chrome://browser/skin/downloads/download-summary@2x.png");
@@ -137,41 +125,37 @@ richlistitem[type="download"]:first-chil
   border-top: 1px solid transparent;
 }
 
 richlistitem[type="download"]:last-child {
   border-bottom: 1px solid transparent;
 }
 
 .downloadTypeIcon {
-  --inline-offset: 8px;
-  --block-offset: 4px;
-  --icon-size: 32px;
+  margin: 8px 0;
+  margin-inline-end: 12px;
+  width: 32px;
+  height: 32px;
 }
 
-.downloadTypeIcon {
-  margin-inline-end: 8px;
-  /* Prevent flickering when changing states. */
-  width: calc(var(--icon-size) + var(--inline-offset));
-  height: calc(var(--icon-size) + var(--block-offset));
-  padding: var(--block-offset) var(--inline-offset) 0 0;
+.downloadBlockedBadge {
+  margin: 0 4px;
+  background: url("chrome://browser/skin/downloads/download-blocked.svg") top right / 16px no-repeat;
 }
 
-.blockedIcon {
-  --overlay-image-dimensions: top right / 16px no-repeat;
-  padding: 0;
-  background: url("chrome://browser/skin/downloads/download-blocked.svg") var(--overlay-image-dimensions);
+.downloadBlockedBadge:-moz-locale-dir(rtl) {
+  background-position-x: left;
 }
 
-@item@[verdict="PotentiallyUnwanted"] .blockedIcon {
-  background: url("chrome://browser/skin/warning.svg") var(--overlay-image-dimensions);
+@item@[verdict="PotentiallyUnwanted"] .downloadBlockedBadge {
+  background-image: url("chrome://browser/skin/warning.svg");
 }
 
-@item@[verdict="Uncommon"] .blockedIcon {
-  background: url("chrome://browser/skin/info.svg") var(--overlay-image-dimensions);
+@item@[verdict="Uncommon"] .downloadBlockedBadge {
+  background-image: url("chrome://browser/skin/info.svg");
 }
 
 /* We hold .downloadTarget, .downloadProgress and .downloadDetails inside of
    a vbox with class .downloadContainer. We set the font-size of the entire
    container to --downloads-item-font-size-factor because:
 
    1) This is the size that we want .downloadDetails to be
    2) The container's width is set by localizers by &downloadDetails.width;,