From b596fcada715be2ab53ff6f7425098f0b5fafb17 Mon Sep 17 00:00:00 2001
From: Lapo Calamandrei <calamandrei@gmail.com>
Date: Tue, 19 Apr 2016 21:58:24 +0200
Subject: [PATCH] Adwaita: stop using images for solid backgrounds...

...unless it's needed.
---
 gtk/theme/Adwaita/_common.scss           |  42 ++--
 gtk/theme/Adwaita/_drawing.scss          |  40 +--
 gtk/theme/Adwaita/gtk-contained-dark.css | 294 +++++++++++++++--------
 gtk/theme/Adwaita/gtk-contained.css      | 294 +++++++++++++++--------
 4 files changed, 439 insertions(+), 231 deletions(-)

diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index ed161edf42..9a53650dad 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -123,7 +123,7 @@ textview {
 
 textview border {
   background-color: mix($bg_color, $base_color, 50%);
-  background-image: _solid(transparentize(black, 0.8)); // HACK: the border node just draws background so,
+  background-image: image(transparentize(black, 0.8)); // HACK: the border node just draws background so,
   background-repeat: no-repeat;                        // using a background-image to draw the border
 
   &:backdrop { background-color: mix($backdrop_bg_color, $backdrop_base_color, 50%); }
@@ -1479,7 +1479,8 @@ headerbar {
     .selection-menu {
       &:backdrop, & {
         border-color: transparentize($selected_bg_color, 1);
-        background-image: _solid(transparentize($selected_bg_color, 1));
+        background-color: transparentize($selected_bg_color, 1);
+        background-image: none;
         box-shadow: none;
         padding-left: 10px;
         padding-right: 10px;
@@ -2875,16 +2876,29 @@ scale {
       border-color: darken($osd_borders_color, 3%);
       background-color: opacify($osd_bg_color, 1); // solid background needed here
 
-      &:hover { @include button(osd-hover); }
+      &:hover {
+        @include button(osd-hover);
+        background-color: opacify($osd_bg_color, 1); // solid background needed here
+      }
 
-      &:active { @include button(osd-active); }
+      &:active {
+        @include button(osd-active);
+        background-color: opacify($osd_bg_color, 1); // solid background needed here
+      }
 
-      &:disabled { @include button(osd-insensitive); }
+      &:disabled {
+        @include button(osd-insensitive);
+        background-color: opacify($osd_bg_color, 1); // solid background needed here
+      }
 
       &:backdrop {
         @include button(osd-backdrop);
+        background-color: opacify($osd_bg_color, 1); // solid background needed here
 
-        &:disabled { @include button(osd-backdrop-insensitive); }
+        &:disabled {
+          @include button(osd-backdrop-insensitive);
+          background-color: opacify($osd_bg_color, 1); // solid background needed here
+        }
       }
     }
   }
@@ -3024,7 +3038,7 @@ scale {
     min-width: 0;
 
     trough {
-      background-image: _solid($borders_color);
+      background-image: image($borders_color);
       background-repeat: no-repeat;
     }
 
@@ -3746,7 +3760,7 @@ placessidebar {
     &.sidebar-placeholder-row {
       padding: 0 8px;
       min-height: 2px;
-      background-image: _solid($drop_target_color);
+      background-image: image($drop_target_color);
       background-clip: content-box;
     }
 
@@ -3797,24 +3811,24 @@ paned {
     border-style: none; // just to be sure
     background-color: transparent;
     // workaround, using background istead of a border since the border will get rendered twice (?)
-    background-image: _solid($borders_color);
+    background-image: image($borders_color);
     background-size: 1px 1px;
 
-    &:selected { background-image: _solid($selected_bg_color); } // FIXME is this needed?
+    &:selected { background-image: image($selected_bg_color); } // FIXME is this needed?
 
-    &:backdrop { background-image: _solid($backdrop_borders_color); }
+    &:backdrop { background-image: image($backdrop_borders_color); }
 
     &.wide {
       min-width: 5px;
       min-height: 5px;
       background-color: $bg_color;
-      background-image: _solid($borders_color), _solid($borders_color);
+      background-image: image($borders_color), image($borders_color);
       background-size: 1px 1px, 1px 1px;
 
       &:backdrop {
         background-color: $backdrop_bg_color;
-        background-image: _solid($backdrop_borders_color),
-                          _solid($backdrop_borders_color);
+        background-image: image($backdrop_borders_color),
+                          image($backdrop_borders_color);
       }
     }
   }
diff --git a/gtk/theme/Adwaita/_drawing.scss b/gtk/theme/Adwaita/_drawing.scss
index e4e61f8f29..0801d02b52 100644
--- a/gtk/theme/Adwaita/_drawing.scss
+++ b/gtk/theme/Adwaita/_drawing.scss
@@ -8,11 +8,6 @@
   @else { @return 0 1px $c; }
 }
 
-@function _solid($c) {
-// solid color image
-  @return linear-gradient(to bottom, $c, $c);
-}
-
 @mixin _shadows($list...) {
 //
 // Helper mixin to stack up to box-shadows;
@@ -280,8 +275,9 @@
     color: $tc;
     outline-color: transparentize($tc, 0.7);
     border-color: if($c!=$bg_color, _border_color($c), $borders_color);
-    @if $variant == 'light' { background-image: _solid(darken($c, 8%)); }
-    @else { background-image: _solid(darken($c, 6%)); }
+    background-image: none;
+    @if $variant == 'light' { background-color: darken($c, 8%); }
+    @else { background-color: darken($c, 6%); }
     @include _shadows(inset 0 1px transparentize($_hilight_color, 1),
                       $_button_edge);
 
@@ -298,7 +294,8 @@
 
     border-color: if($c!=$bg_color, _border_color($c),
                                     $insensitive_borders_color);
-    background-image: _solid($_bg);
+    background-color: $_bg;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     // white with 0 alpha to avoid an ugly transition, since no color means
@@ -332,7 +329,8 @@
     label, & { color: if($tc!=$fg_color,mix($tc, $_bg, 80%), $backdrop_fg_color); }
 
     border-color: if($c!=$bg_color, $_bc, $backdrop_borders_color);
-    background-image: _solid($_bg);
+    background-color: $_bg;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     @include _shadows(inset 0 1px transparentize(white, 1),
@@ -349,7 +347,8 @@
     label, & { color: if($tc!=$fg_color, mix($tc, $_bg, 80%), $backdrop_fg_color); }
 
     border-color: if($c!=$bg_color, $_bc, $backdrop_borders_color);
-    background-image: _solid($_bg);
+    background-color: $_bg;
+    background-image: none;
     @include _shadows(inset 0 1px transparentize(white, 1),
                       $_blank_edge);
   }
@@ -365,7 +364,8 @@
     label, & { color: if($c!=$bg_color, mix($tc, $_bg, 35%), $backdrop_insensitive_color); }
 
     border-color: if($c!=$bg_color, $_bc, $backdrop_borders_color);
-    background-image: _solid($_bg);
+    background-color: $_bg;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     // white with 0 alpha to avoid an ugly transition, since no color means
@@ -386,7 +386,8 @@
     label { color: if($c!=$bg_color, mix($tc, $_bg, 35%), $backdrop_insensitive_color); }
 
     border-color: if($c!=$bg_color, $_bc, $backdrop_borders_color);
-    background-image: _solid($_bg);
+    background-color: $_bg;
+    background-image: none;
     @include _shadows(inset 0 1px transparentize(white, 1),
                       $_blank_edge);
   }
@@ -400,7 +401,8 @@
 
     color: $osd_fg_color;
     border-color: $osd_borders_color;
-    background-image: _solid($_bg);
+    background-color: transparent;
+    background-image: image($_bg);
     background-clip: padding-box;
     box-shadow: inset 0 1px transparentize(white, 0.9);
     text-shadow: 0 1px black;
@@ -416,7 +418,8 @@
 
     color: white;
     border-color: $osd_borders_color;
-    background-image: _solid($_bg);
+    background-color: transparent;
+    background-image: image($_bg);
     background-clip: padding-box;
     box-shadow: inset 0 1px transparentize(white, 0.9);
     text-shadow: 0 1px black;
@@ -431,7 +434,8 @@
 
     color: white;
     border-color: $osd_borders_color;
-    background-image: _solid($_bg);
+    background-color: transparent;
+    background-image: image($_bg);
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -444,7 +448,8 @@
   //
     color: $osd_insensitive_fg_color;
     border-color: $osd_borders_color;
-    background-image: _solid($osd_insensitive_bg_color);
+    background-color: transparent;
+    background-image: image($osd_insensitive_bg_color);
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -459,7 +464,8 @@
 
     color: $osd_fg_color;
     border-color: $osd_borders_color;
-    background-image: _solid($_bg);
+    background-color: transparent;
+    background-image: image($_bg);
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index de6655a850..7e51232950 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -77,7 +77,7 @@ textview text {
 
 textview border {
   background-color: #313434;
-  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
+  background-image: image(rgba(0, 0, 0, 0.2));
   background-repeat: no-repeat; }
   textview border:backdrop {
     background-color: #333636; }
@@ -469,7 +469,8 @@ button {
     color: #eeeeec;
     outline-color: rgba(238, 238, 236, 0.3);
     border-color: #212424;
-    background-image: linear-gradient(to bottom, #2a2f2f, #2a2f2f);
+    background-image: none;
+    background-color: #2a2f2f;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
     text-shadow: none;
     -gtk-icon-shadow: none;
@@ -478,7 +479,8 @@ button {
   button:backdrop.flat,
   button:backdrop {
     border-color: #262929;
-    background-image: linear-gradient(to bottom, #393f3f, #393f3f);
+    background-color: #393f3f;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -496,7 +498,8 @@ button {
     button:backdrop:active,
     button:backdrop:checked {
       border-color: #262929;
-      background-image: linear-gradient(to bottom, #323737, #323737);
+      background-color: #323737;
+      background-image: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
       notebook > header > tabs > arrow:backdrop:active label, button.sidebar-button:backdrop:active label, button.titlebutton:backdrop:active label, notebook > header > tabs > arrow:backdrop:active, button.sidebar-button:backdrop:active, button.titlebutton:backdrop:active, notebook > header > tabs > arrow:backdrop:checked label, button.sidebar-button:backdrop:checked label, button.titlebutton:backdrop:checked label, notebook > header > tabs > arrow:backdrop:checked, button.sidebar-button:backdrop:checked, button.titlebutton:backdrop:checked, notebook > header > tabs > arrow:backdrop:active label, button.titlebutton:backdrop:active label, notebook > header > tabs > arrow:backdrop:active, button.titlebutton:backdrop:active, notebook > header > tabs > arrow:backdrop:checked label, button.titlebutton:backdrop:checked label, notebook > header > tabs > arrow:backdrop:checked, button.titlebutton:backdrop:checked,
       button:backdrop.flat:active label,
@@ -512,7 +515,8 @@ button {
     button:backdrop.flat:disabled,
     button:backdrop:disabled {
       border-color: #262929;
-      background-image: linear-gradient(to bottom, #333636, #333636);
+      background-color: #333636;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -528,7 +532,8 @@ button {
       button:backdrop:disabled:active,
       button:backdrop:disabled:checked {
         border-color: #262929;
-        background-image: linear-gradient(to bottom, #272929, #272929);
+        background-color: #272929;
+        background-image: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
         notebook > header > tabs > arrow:backdrop:disabled:active label, button.sidebar-button:backdrop:disabled:active label, button.titlebutton:backdrop:disabled:active label, notebook > header > tabs > arrow:backdrop:disabled:checked label, button.sidebar-button:backdrop:disabled:checked label, button.titlebutton:backdrop:disabled:checked label, notebook > header > tabs > arrow:backdrop:disabled:active label, button.titlebutton:backdrop:disabled:active label, notebook > header > tabs > arrow:backdrop:disabled:checked label, button.titlebutton:backdrop:disabled:checked label,
         button:backdrop.flat:disabled:active label,
@@ -549,7 +554,8 @@ button {
   notebook > header > tabs > arrow:disabled, button.titlebutton:disabled,
   button:disabled {
     border-color: #212424;
-    background-image: linear-gradient(to bottom, #333636, #333636);
+    background-color: #333636;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -606,7 +612,8 @@ button.osd {
   outline-color: rgba(238, 238, 236, 0.3);
   color: #eeeeec;
   border-color: rgba(0, 0, 0, 0.7);
-  background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+  background-color: transparent;
+  background-image: image(rgba(32, 37, 38, 0.8));
   background-clip: padding-box;
   box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
   text-shadow: 0 1px black;
@@ -619,7 +626,8 @@ button.osd {
   button.osd:hover {
     color: white;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.8), rgba(60, 69, 71, 0.8));
+    background-color: transparent;
+    background-image: image(rgba(60, 69, 71, 0.8));
     background-clip: padding-box;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
     text-shadow: 0 1px black;
@@ -631,7 +639,8 @@ button.osd {
   button.osd:checked {
     color: white;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
+    background-color: transparent;
+    background-image: image(rgba(0, 0, 0, 0.7));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -643,7 +652,8 @@ button.osd {
   button.osd:disabled {
     color: #878a89;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+    background-color: transparent;
+    background-image: image(rgba(53, 57, 58, 0.5));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -652,7 +662,8 @@ button.osd {
   button.osd:backdrop {
     color: #eeeeec;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+    background-color: transparent;
+    background-image: image(rgba(32, 37, 38, 0.8));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -663,7 +674,8 @@ button.osd {
 button {
   color: #eeeeec;
   border-color: rgba(0, 0, 0, 0.7);
-  background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+  background-color: transparent;
+  background-image: image(rgba(32, 37, 38, 0.8));
   background-clip: padding-box;
   box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
   text-shadow: 0 1px black;
@@ -673,7 +685,8 @@ button {
   button:hover {
     color: white;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.8), rgba(60, 69, 71, 0.8));
+    background-color: transparent;
+    background-image: image(rgba(60, 69, 71, 0.8));
     background-clip: padding-box;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
     text-shadow: 0 1px black;
@@ -686,7 +699,8 @@ button {
   button:checked {
     color: white;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
+    background-color: transparent;
+    background-image: image(rgba(0, 0, 0, 0.7));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -697,7 +711,8 @@ button {
   button:disabled {
     color: #878a89;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+    background-color: transparent;
+    background-image: image(rgba(53, 57, 58, 0.5));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -706,7 +721,8 @@ button {
   button:backdrop {
     color: #eeeeec;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+    background-color: transparent;
+    background-image: image(rgba(32, 37, 38, 0.8));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -726,7 +742,8 @@ button {
     button.flat:hover {
       color: white;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.8), rgba(60, 69, 71, 0.8));
+      background-color: transparent;
+      background-image: image(rgba(60, 69, 71, 0.8));
       background-clip: padding-box;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
       text-shadow: 0 1px black;
@@ -736,7 +753,8 @@ button {
     button.flat:disabled {
       color: #878a89;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+      background-color: transparent;
+      background-image: image(rgba(53, 57, 58, 0.5));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -757,7 +775,8 @@ button {
     button.flat:checked {
       color: white;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
+      background-color: transparent;
+      background-image: image(rgba(0, 0, 0, 0.7));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -795,7 +814,8 @@ button.suggested-action {
     color: white;
     outline-color: rgba(255, 255, 255, 0.3);
     border-color: #0f2b48;
-    background-image: linear-gradient(to bottom, #1b4e83, #1b4e83);
+    background-image: none;
+    background-color: #1b4e83;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
     text-shadow: none;
     -gtk-icon-shadow: none; }
@@ -803,7 +823,8 @@ button.suggested-action {
   button.suggested-action:backdrop,
   button.suggested-action.flat:backdrop {
     border-color: #0f2b48;
-    background-image: linear-gradient(to bottom, #215d9c, #215d9c);
+    background-color: #215d9c;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -819,7 +840,8 @@ button.suggested-action {
     button.suggested-action.flat:backdrop:active,
     button.suggested-action.flat:backdrop:checked {
       border-color: #0f2b48;
-      background-image: linear-gradient(to bottom, #184472, #184472);
+      background-color: #184472;
+      background-image: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
       .selection-mode button.titlebutton:backdrop:active label, .selection-mode button.titlebutton:backdrop:active, .selection-mode button.titlebutton:backdrop:checked label, .selection-mode button.titlebutton:backdrop:checked,
       button.suggested-action:backdrop:active label,
@@ -835,7 +857,8 @@ button.suggested-action {
     button.suggested-action:backdrop:disabled,
     button.suggested-action.flat:backdrop:disabled {
       border-color: #262929;
-      background-image: linear-gradient(to bottom, #333636, #333636);
+      background-color: #333636;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -851,7 +874,8 @@ button.suggested-action {
       button.suggested-action.flat:backdrop:disabled:active,
       button.suggested-action.flat:backdrop:disabled:checked {
         border-color: #0f2b48;
-        background-image: linear-gradient(to bottom, #1d4877, #1d4877);
+        background-color: #1d4877;
+        background-image: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
         .selection-mode button.titlebutton:backdrop:disabled:active label, .selection-mode button.titlebutton:backdrop:disabled:checked label,
         button.suggested-action:backdrop:disabled:active label,
@@ -872,7 +896,8 @@ button.suggested-action {
     color: rgba(33, 93, 156, 0.8); }
   button.suggested-action:disabled {
     border-color: #212424;
-    background-image: linear-gradient(to bottom, #333636, #333636);
+    background-color: #333636;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -893,7 +918,8 @@ button.suggested-action {
   button.suggested-action {
     color: #eeeeec;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(33, 93, 156, 0.5), rgba(33, 93, 156, 0.5));
+    background-color: transparent;
+    background-image: image(rgba(33, 93, 156, 0.5));
     background-clip: padding-box;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
     text-shadow: 0 1px black;
@@ -903,7 +929,8 @@ button.suggested-action {
     button.suggested-action:hover {
       color: white;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(33, 93, 156, 0.7), rgba(33, 93, 156, 0.7));
+      background-color: transparent;
+      background-image: image(rgba(33, 93, 156, 0.7));
       background-clip: padding-box;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
       text-shadow: 0 1px black;
@@ -916,7 +943,8 @@ button.suggested-action {
     button.suggested-action:checked {
       color: white;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, #215d9c, #215d9c);
+      background-color: transparent;
+      background-image: image(#215d9c);
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -927,7 +955,8 @@ button.suggested-action {
     button.suggested-action:disabled {
       color: #878a89;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+      background-color: transparent;
+      background-image: image(rgba(53, 57, 58, 0.5));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -936,7 +965,8 @@ button.suggested-action {
     button.suggested-action:backdrop {
       color: #eeeeec;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(33, 93, 156, 0.5), rgba(33, 93, 156, 0.5));
+      background-color: transparent;
+      background-image: image(rgba(33, 93, 156, 0.5));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -972,14 +1002,16 @@ button.destructive-action {
     color: white;
     outline-color: rgba(255, 255, 255, 0.3);
     border-color: #760909;
-    background-image: linear-gradient(to bottom, #b90e0e, #b90e0e);
+    background-image: none;
+    background-color: #b90e0e;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
     text-shadow: none;
     -gtk-icon-shadow: none; }
   button.destructive-action:backdrop,
   button.destructive-action.flat:backdrop {
     border-color: #760909;
-    background-image: linear-gradient(to bottom, #d51010, #d51010);
+    background-color: #d51010;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -993,7 +1025,8 @@ button.destructive-action {
     button.destructive-action.flat:backdrop:active,
     button.destructive-action.flat:backdrop:checked {
       border-color: #760909;
-      background-image: linear-gradient(to bottom, #a60c0c, #a60c0c);
+      background-color: #a60c0c;
+      background-image: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
       button.destructive-action:backdrop:active label,
       button.destructive-action:backdrop:active,
@@ -1007,7 +1040,8 @@ button.destructive-action {
     button.destructive-action:backdrop:disabled,
     button.destructive-action.flat:backdrop:disabled {
       border-color: #262929;
-      background-image: linear-gradient(to bottom, #333636, #333636);
+      background-color: #333636;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1021,7 +1055,8 @@ button.destructive-action {
       button.destructive-action.flat:backdrop:disabled:active,
       button.destructive-action.flat:backdrop:disabled:checked {
         border-color: #760909;
-        background-image: linear-gradient(to bottom, #a41212, #a41212);
+        background-color: #a41212;
+        background-image: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
         button.destructive-action:backdrop:disabled:active label,
         button.destructive-action:backdrop:disabled:checked label,
@@ -1040,7 +1075,8 @@ button.destructive-action {
     color: rgba(213, 16, 16, 0.8); }
   button.destructive-action:disabled {
     border-color: #212424;
-    background-image: linear-gradient(to bottom, #333636, #333636);
+    background-color: #333636;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1061,7 +1097,8 @@ button.destructive-action {
   button.destructive-action {
     color: #eeeeec;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(213, 16, 16, 0.5), rgba(213, 16, 16, 0.5));
+    background-color: transparent;
+    background-image: image(rgba(213, 16, 16, 0.5));
     background-clip: padding-box;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
     text-shadow: 0 1px black;
@@ -1071,7 +1108,8 @@ button.destructive-action {
     button.destructive-action:hover {
       color: white;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(213, 16, 16, 0.7), rgba(213, 16, 16, 0.7));
+      background-color: transparent;
+      background-image: image(rgba(213, 16, 16, 0.7));
       background-clip: padding-box;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
       text-shadow: 0 1px black;
@@ -1084,7 +1122,8 @@ button.destructive-action {
     button.destructive-action:checked {
       color: white;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, #d51010, #d51010);
+      background-color: transparent;
+      background-image: image(#d51010);
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -1095,7 +1134,8 @@ button.destructive-action {
     button.destructive-action:disabled {
       color: #878a89;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+      background-color: transparent;
+      background-image: image(rgba(53, 57, 58, 0.5));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -1104,7 +1144,8 @@ button.destructive-action {
     button.destructive-action:backdrop {
       color: #eeeeec;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(213, 16, 16, 0.5), rgba(213, 16, 16, 0.5));
+      background-color: transparent;
+      background-image: image(rgba(213, 16, 16, 0.5));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -1190,13 +1231,15 @@ button.needs-attention > image, stacksidebar row.needs-attention > label {
     color: #eeeeec;
     outline-color: rgba(238, 238, 236, 0.3);
     border-color: #212424;
-    background-image: linear-gradient(to bottom, #2a2f2f, #2a2f2f);
+    background-image: none;
+    background-color: #2a2f2f;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
     text-shadow: none;
     -gtk-icon-shadow: none; }
   .inline-toolbar toolbutton > button:disabled {
     border-color: #212424;
-    background-image: linear-gradient(to bottom, #333636, #333636);
+    background-color: #333636;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1210,7 +1253,8 @@ button.needs-attention > image, stacksidebar row.needs-attention > label {
         color: #949796; }
   .inline-toolbar toolbutton > button:backdrop {
     border-color: #262929;
-    background-image: linear-gradient(to bottom, #393f3f, #393f3f);
+    background-color: #393f3f;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1218,13 +1262,15 @@ button.needs-attention > image, stacksidebar row.needs-attention > label {
       color: #949796; }
     .inline-toolbar toolbutton > button:backdrop:active, .inline-toolbar toolbutton > button:backdrop:checked {
       border-color: #262929;
-      background-image: linear-gradient(to bottom, #323737, #323737);
+      background-color: #323737;
+      background-image: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
       .inline-toolbar toolbutton > button:backdrop:active label, .inline-toolbar toolbutton > button:backdrop:active, .inline-toolbar toolbutton > button:backdrop:checked label, .inline-toolbar toolbutton > button:backdrop:checked {
         color: #949796; }
     .inline-toolbar toolbutton > button:backdrop:disabled {
       border-color: #262929;
-      background-image: linear-gradient(to bottom, #333636, #333636);
+      background-color: #333636;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1232,7 +1278,8 @@ button.needs-attention > image, stacksidebar row.needs-attention > label {
         color: #5d6767; }
       .inline-toolbar toolbutton > button:backdrop:disabled:active, .inline-toolbar toolbutton > button:backdrop:disabled:checked {
         border-color: #262929;
-        background-image: linear-gradient(to bottom, #272929, #272929);
+        background-color: #272929;
+        background-image: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
         .inline-toolbar toolbutton > button:backdrop:disabled:active label, .inline-toolbar toolbutton > button:backdrop:disabled:checked label {
           color: #5d6767; }
@@ -1547,7 +1594,8 @@ spinbutton.vertical button.down {
 .osd spinbutton.vertical button:first-child {
   color: #eeeeec;
   border-color: rgba(0, 0, 0, 0.7);
-  background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+  background-color: transparent;
+  background-image: image(rgba(32, 37, 38, 0.8));
   background-clip: padding-box;
   box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
   text-shadow: 0 1px black;
@@ -1556,7 +1604,8 @@ spinbutton.vertical button.down {
   .osd spinbutton.vertical button:first-child:hover {
     color: white;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.8), rgba(60, 69, 71, 0.8));
+    background-color: transparent;
+    background-image: image(rgba(60, 69, 71, 0.8));
     background-clip: padding-box;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
     text-shadow: 0 1px black;
@@ -1565,7 +1614,8 @@ spinbutton.vertical button.down {
   .osd spinbutton.vertical button:first-child:active {
     color: white;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
+    background-color: transparent;
+    background-image: image(rgba(0, 0, 0, 0.7));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -1574,7 +1624,8 @@ spinbutton.vertical button.down {
   .osd spinbutton.vertical button:first-child:disabled {
     color: #878a89;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+    background-color: transparent;
+    background-image: image(rgba(53, 57, 58, 0.5));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -1582,7 +1633,8 @@ spinbutton.vertical button.down {
   .osd spinbutton.vertical button:first-child:backdrop {
     color: #eeeeec;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+    background-color: transparent;
+    background-image: image(rgba(32, 37, 38, 0.8));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -1737,7 +1789,8 @@ headerbar {
         color: #ffffff;
         outline-color: rgba(255, 255, 255, 0.3);
         border-color: #0f2b48;
-        background-image: linear-gradient(to bottom, #1b4e83, #1b4e83);
+        background-image: none;
+        background-color: #1b4e83;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0);
         text-shadow: none;
         -gtk-icon-shadow: none; }
@@ -1745,7 +1798,8 @@ headerbar {
       headerbar.selection-mode button:backdrop.flat,
       headerbar.selection-mode button:backdrop {
         border-color: #0f2b48;
-        background-image: linear-gradient(to bottom, #215d9c, #215d9c);
+        background-color: #215d9c;
+        background-image: none;
         text-shadow: none;
         -gtk-icon-shadow: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -1763,7 +1817,8 @@ headerbar {
         headerbar.selection-mode button:backdrop:active,
         headerbar.selection-mode button:backdrop:checked {
           border-color: #0f2b48;
-          background-image: linear-gradient(to bottom, #184472, #184472);
+          background-color: #184472;
+          background-image: none;
           box-shadow: inset 0 1px rgba(255, 255, 255, 0);
           border-color: #0f2b48; }
           .selection-mode.titlebar:not(headerbar) button:backdrop.flat:active label, .selection-mode.titlebar:not(headerbar) button:backdrop.flat:active, .selection-mode.titlebar:not(headerbar) button:backdrop.flat:checked label, .selection-mode.titlebar:not(headerbar) button:backdrop.flat:checked, .selection-mode.titlebar:not(headerbar) button:backdrop:active label, .selection-mode.titlebar:not(headerbar) button:backdrop:active, .selection-mode.titlebar:not(headerbar) button:backdrop:checked label, .selection-mode.titlebar:not(headerbar) button:backdrop:checked,
@@ -1780,7 +1835,8 @@ headerbar {
         headerbar.selection-mode button:backdrop.flat:disabled,
         headerbar.selection-mode button:backdrop:disabled {
           border-color: #0f2b48;
-          background-image: linear-gradient(to bottom, #22558b, #22558b);
+          background-color: #22558b;
+          background-image: none;
           text-shadow: none;
           -gtk-icon-shadow: none;
           box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -1797,7 +1853,8 @@ headerbar {
           headerbar.selection-mode button:backdrop:disabled:active,
           headerbar.selection-mode button:backdrop:disabled:checked {
             border-color: #0f2b48;
-            background-image: linear-gradient(to bottom, #1d4877, #1d4877);
+            background-color: #1d4877;
+            background-image: none;
             box-shadow: inset 0 1px rgba(255, 255, 255, 0);
             border-color: #0f2b48; }
             .selection-mode.titlebar:not(headerbar) button:backdrop.flat:disabled:active label, .selection-mode.titlebar:not(headerbar) button:backdrop.flat:disabled:checked label, .selection-mode.titlebar:not(headerbar) button:backdrop:disabled:active label, .selection-mode.titlebar:not(headerbar) button:backdrop:disabled:checked label,
@@ -1819,7 +1876,8 @@ headerbar {
       .selection-mode.titlebar:not(headerbar) button:disabled,
       headerbar.selection-mode button:disabled {
         border-color: #0f2b48;
-        background-image: linear-gradient(to bottom, #22558b, #22558b);
+        background-color: #22558b;
+        background-image: none;
         text-shadow: none;
         -gtk-icon-shadow: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1866,7 +1924,8 @@ headerbar {
           color: #eeeeec;
           outline-color: rgba(238, 238, 236, 0.3);
           border-color: #212424;
-          background-image: linear-gradient(to bottom, #2a2f2f, #2a2f2f);
+          background-image: none;
+          background-color: #2a2f2f;
           box-shadow: inset 0 1px rgba(255, 255, 255, 0);
           text-shadow: none;
           -gtk-icon-shadow: none;
@@ -1874,7 +1933,8 @@ headerbar {
         .selection-mode.titlebar:not(headerbar) button.suggested-action:disabled,
         headerbar.selection-mode button.suggested-action:disabled {
           border-color: #212424;
-          background-image: linear-gradient(to bottom, #333636, #333636);
+          background-color: #333636;
+          background-image: none;
           text-shadow: none;
           -gtk-icon-shadow: none;
           box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -1886,7 +1946,8 @@ headerbar {
         .selection-mode.titlebar:not(headerbar) button.suggested-action:backdrop,
         headerbar.selection-mode button.suggested-action:backdrop {
           border-color: #262929;
-          background-image: linear-gradient(to bottom, #393f3f, #393f3f);
+          background-color: #393f3f;
+          background-image: none;
           text-shadow: none;
           -gtk-icon-shadow: none;
           box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -1898,7 +1959,8 @@ headerbar {
         .selection-mode.titlebar:not(headerbar) button.suggested-action:backdrop:disabled,
         headerbar.selection-mode button.suggested-action:backdrop:disabled {
           border-color: #262929;
-          background-image: linear-gradient(to bottom, #333636, #333636);
+          background-color: #333636;
+          background-image: none;
           text-shadow: none;
           -gtk-icon-shadow: none;
           box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -1911,7 +1973,8 @@ headerbar {
     headerbar.selection-mode .selection-menu:backdrop,
     headerbar.selection-mode .selection-menu {
       border-color: rgba(33, 93, 156, 0);
-      background-image: linear-gradient(to bottom, rgba(33, 93, 156, 0), rgba(33, 93, 156, 0));
+      background-color: rgba(33, 93, 156, 0);
+      background-image: none;
       box-shadow: none;
       padding-left: 10px;
       padding-right: 10px; }
@@ -2659,7 +2722,8 @@ switch {
     border: 1px solid #0f2b48; }
   switch:disabled slider {
     border-color: #212424;
-    background-image: linear-gradient(to bottom, #333636, #333636);
+    background-color: #333636;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -2668,7 +2732,8 @@ switch {
   switch:backdrop slider {
     transition: 200ms ease-out;
     border-color: #262929;
-    background-image: linear-gradient(to bottom, #393f3f, #393f3f);
+    background-color: #393f3f;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -2678,7 +2743,8 @@ switch {
     border-color: #0f2b48; }
   switch:backdrop:disabled slider {
     border-color: #262929;
-    background-image: linear-gradient(to bottom, #333636, #333636);
+    background-color: #333636;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -2765,14 +2831,16 @@ radio {
     color: #eeeeec;
     outline-color: rgba(238, 238, 236, 0.3);
     border-color: #212424;
-    background-image: linear-gradient(to bottom, #2a2f2f, #2a2f2f);
+    background-image: none;
+    background-color: #2a2f2f;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
     text-shadow: none;
     -gtk-icon-shadow: none; }
   check:disabled,
   radio:disabled {
     border-color: #212424;
-    background-image: linear-gradient(to bottom, #333636, #333636);
+    background-color: #333636;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -2783,7 +2851,8 @@ radio {
   check:backdrop,
   radio:backdrop {
     border-color: #262929;
-    background-image: linear-gradient(to bottom, #393f3f, #393f3f);
+    background-color: #393f3f;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -2795,7 +2864,8 @@ radio {
     check:backdrop:disabled,
     radio:backdrop:disabled {
       border-color: #262929;
-      background-image: linear-gradient(to bottom, #333636, #333636);
+      background-color: #333636;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -2807,7 +2877,8 @@ radio {
   radio {
     color: #eeeeec;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+    background-color: transparent;
+    background-image: image(rgba(32, 37, 38, 0.8));
     background-clip: padding-box;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
     text-shadow: 0 1px black;
@@ -2817,7 +2888,8 @@ radio {
     radio:hover {
       color: #eeeeec;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+      background-color: transparent;
+      background-image: image(rgba(32, 37, 38, 0.8));
       background-clip: padding-box;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
       text-shadow: 0 1px black;
@@ -2827,7 +2899,8 @@ radio {
     radio:active {
       color: white;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
+      background-color: transparent;
+      background-image: image(rgba(0, 0, 0, 0.7));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -2837,7 +2910,8 @@ radio {
     radio:backdrop {
       color: #eeeeec;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+      background-color: transparent;
+      background-image: image(rgba(32, 37, 38, 0.8));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -2846,7 +2920,8 @@ radio {
     radio:disabled {
       color: #878a89;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+      background-color: transparent;
+      background-image: image(rgba(53, 57, 58, 0.5));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -3034,7 +3109,8 @@ scale {
       border-color: #0f2b48; }
     scale slider:disabled {
       border-color: #212424;
-      background-image: linear-gradient(to bottom, #333636, #333636);
+      background-color: #333636;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -3043,7 +3119,8 @@ scale {
     scale slider:backdrop {
       transition: 200ms ease-out;
       border-color: #262929;
-      background-image: linear-gradient(to bottom, #393f3f, #393f3f);
+      background-color: #393f3f;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -3051,7 +3128,8 @@ scale {
         color: #949796; }
       scale slider:backdrop:disabled {
         border-color: #262929;
-        background-image: linear-gradient(to bottom, #333636, #333636);
+        background-color: #333636;
+        background-image: none;
         text-shadow: none;
         -gtk-icon-shadow: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -3062,7 +3140,8 @@ scale {
     .osd scale slider {
       color: #eeeeec;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+      background-color: transparent;
+      background-image: image(rgba(32, 37, 38, 0.8));
       background-clip: padding-box;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
       text-shadow: 0 1px black;
@@ -3073,37 +3152,47 @@ scale {
       .osd scale slider:hover {
         color: white;
         border-color: rgba(0, 0, 0, 0.7);
-        background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.8), rgba(60, 69, 71, 0.8));
+        background-color: transparent;
+        background-image: image(rgba(60, 69, 71, 0.8));
         background-clip: padding-box;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
         text-shadow: 0 1px black;
         -gtk-icon-shadow: 0 1px black;
-        outline-color: rgba(238, 238, 236, 0.3); }
+        outline-color: rgba(238, 238, 236, 0.3);
+        background-color: #202526; }
       .osd scale slider:active {
         color: white;
         border-color: rgba(0, 0, 0, 0.7);
-        background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
+        background-color: transparent;
+        background-image: image(rgba(0, 0, 0, 0.7));
         background-clip: padding-box;
         box-shadow: none;
         text-shadow: none;
         -gtk-icon-shadow: none;
-        outline-color: rgba(238, 238, 236, 0.3); }
+        outline-color: rgba(238, 238, 236, 0.3);
+        background-color: #202526; }
       .osd scale slider:disabled {
         color: #878a89;
         border-color: rgba(0, 0, 0, 0.7);
-        background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+        background-color: transparent;
+        background-image: image(rgba(53, 57, 58, 0.5));
         background-clip: padding-box;
         box-shadow: none;
         text-shadow: none;
-        -gtk-icon-shadow: none; }
+        -gtk-icon-shadow: none;
+        background-color: #202526; }
       .osd scale slider:backdrop {
         color: #eeeeec;
         border-color: rgba(0, 0, 0, 0.7);
-        background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+        background-color: transparent;
+        background-image: image(rgba(32, 37, 38, 0.8));
         background-clip: padding-box;
         box-shadow: none;
         text-shadow: none;
-        -gtk-icon-shadow: none; }
+        -gtk-icon-shadow: none;
+        background-color: #202526; }
+        .osd scale slider:backdrop:disabled {
+          background-color: #202526; }
   scale value {
     color: alpha(currentColor,0.55); }
   scale marks {
@@ -3500,7 +3589,7 @@ scale {
     min-height: 0;
     min-width: 0; }
     scale.color trough {
-      background-image: linear-gradient(to bottom, #212424, #212424);
+      background-image: image(#212424);
       background-repeat: no-repeat; }
     scale.color.horizontal {
       padding: 0 0 15px 0; }
@@ -4030,7 +4119,7 @@ placessidebar row {
   placessidebar row.sidebar-placeholder-row {
     padding: 0 8px;
     min-height: 2px;
-    background-image: linear-gradient(to bottom, #4e9a06, #4e9a06);
+    background-image: image(#4e9a06);
     background-clip: content-box; }
   placessidebar row.sidebar-new-bookmark-row {
     color: #215d9c; }
@@ -4062,21 +4151,21 @@ paned > separator {
   -gtk-icon-source: none;
   border-style: none;
   background-color: transparent;
-  background-image: linear-gradient(to bottom, #212424, #212424);
+  background-image: image(#212424);
   background-size: 1px 1px; }
   paned > separator:selected {
-    background-image: linear-gradient(to bottom, #215d9c, #215d9c); }
+    background-image: image(#215d9c); }
   paned > separator:backdrop {
-    background-image: linear-gradient(to bottom, #262929, #262929); }
+    background-image: image(#262929); }
   paned > separator.wide {
     min-width: 5px;
     min-height: 5px;
     background-color: #393f3f;
-    background-image: linear-gradient(to bottom, #212424, #212424), linear-gradient(to bottom, #212424, #212424);
+    background-image: image(#212424), image(#212424);
     background-size: 1px 1px, 1px 1px; }
     paned > separator.wide:backdrop {
       background-color: #393f3f;
-      background-image: linear-gradient(to bottom, #262929, #262929), linear-gradient(to bottom, #262929, #262929); }
+      background-image: image(#262929), image(#262929); }
 paned.horizontal > separator {
   background-repeat: repeat-y; }
   paned.horizontal > separator:dir(ltr) {
@@ -4176,7 +4265,8 @@ infobar {
       color: #ffffff;
       outline-color: rgba(255, 255, 255, 0.3);
       border-color: #0f2b48;
-      background-image: linear-gradient(to bottom, #1b4e83, #1b4e83);
+      background-image: none;
+      background-color: #1b4e83;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0);
       text-shadow: none;
       -gtk-icon-shadow: none; }
@@ -4185,7 +4275,8 @@ infobar {
     .warning button:disabled,
     .error button:disabled {
       border-color: #0f2b48;
-      background-image: linear-gradient(to bottom, #22558b, #22558b);
+      background-color: #22558b;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -4202,7 +4293,8 @@ infobar {
     .warning button:backdrop,
     .error button:backdrop {
       border-color: #0f2b48;
-      background-image: linear-gradient(to bottom, #215d9c, #215d9c);
+      background-color: #215d9c;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -4220,7 +4312,8 @@ infobar {
       .warning button:backdrop:disabled,
       .error button:backdrop:disabled {
         border-color: #0f2b48;
-        background-image: linear-gradient(to bottom, #22558b, #22558b);
+        background-color: #22558b;
+        background-image: none;
         text-shadow: none;
         -gtk-icon-shadow: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -4345,7 +4438,8 @@ colorswatch#add-color-button {
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.05); }
     colorswatch#add-color-button overlay:backdrop {
       border-color: #262929;
-      background-image: linear-gradient(to bottom, #393f3f, #393f3f);
+      background-color: #393f3f;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index a7cb2c91fb..1c34692c37 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -77,7 +77,7 @@ textview text {
 
 textview border {
   background-color: #f4f4f3;
-  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
+  background-image: image(rgba(0, 0, 0, 0.2));
   background-repeat: no-repeat; }
   textview border:backdrop {
     background-color: #f2f2f2; }
@@ -469,7 +469,8 @@ button {
     color: #2e3436;
     outline-color: rgba(46, 52, 54, 0.3);
     border-color: #b6b6b3;
-    background-image: linear-gradient(to bottom, #d4d4d2, #d4d4d2);
+    background-image: none;
+    background-color: #d4d4d2;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
     text-shadow: none;
     -gtk-icon-shadow: none;
@@ -478,7 +479,8 @@ button {
   button:backdrop.flat,
   button:backdrop {
     border-color: #c0c0bd;
-    background-image: linear-gradient(to bottom, #e8e8e7, #e8e8e7);
+    background-color: #e8e8e7;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -496,7 +498,8 @@ button {
     button:backdrop:active,
     button:backdrop:checked {
       border-color: #c0c0bd;
-      background-image: linear-gradient(to bottom, #dadad8, #dadad8);
+      background-color: #dadad8;
+      background-image: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
       notebook > header > tabs > arrow:backdrop:active label, button.sidebar-button:backdrop:active label, button.titlebutton:backdrop:active label, notebook > header > tabs > arrow:backdrop:active, button.sidebar-button:backdrop:active, button.titlebutton:backdrop:active, notebook > header > tabs > arrow:backdrop:checked label, button.sidebar-button:backdrop:checked label, button.titlebutton:backdrop:checked label, notebook > header > tabs > arrow:backdrop:checked, button.sidebar-button:backdrop:checked, button.titlebutton:backdrop:checked, notebook > header > tabs > arrow:backdrop:active label, button.titlebutton:backdrop:active label, notebook > header > tabs > arrow:backdrop:active, button.titlebutton:backdrop:active, notebook > header > tabs > arrow:backdrop:checked label, button.titlebutton:backdrop:checked label, notebook > header > tabs > arrow:backdrop:checked, button.titlebutton:backdrop:checked,
       button:backdrop.flat:active label,
@@ -512,7 +515,8 @@ button {
     button:backdrop.flat:disabled,
     button:backdrop:disabled {
       border-color: #c0c0bd;
-      background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+      background-color: #f1f1f1;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -528,7 +532,8 @@ button {
       button:backdrop:disabled:active,
       button:backdrop:disabled:checked {
         border-color: #c0c0bd;
-        background-image: linear-gradient(to bottom, #e4e4e4, #e4e4e4);
+        background-color: #e4e4e4;
+        background-image: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
         notebook > header > tabs > arrow:backdrop:disabled:active label, button.sidebar-button:backdrop:disabled:active label, button.titlebutton:backdrop:disabled:active label, notebook > header > tabs > arrow:backdrop:disabled:checked label, button.sidebar-button:backdrop:disabled:checked label, button.titlebutton:backdrop:disabled:checked label, notebook > header > tabs > arrow:backdrop:disabled:active label, button.titlebutton:backdrop:disabled:active label, notebook > header > tabs > arrow:backdrop:disabled:checked label, button.titlebutton:backdrop:disabled:checked label,
         button:backdrop.flat:disabled:active label,
@@ -549,7 +554,8 @@ button {
   notebook > header > tabs > arrow:disabled, button.titlebutton:disabled,
   button:disabled {
     border-color: #b6b6b3;
-    background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+    background-color: #f1f1f1;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -609,7 +615,8 @@ button.osd {
   outline-color: rgba(238, 238, 236, 0.3);
   color: #eeeeec;
   border-color: rgba(0, 0, 0, 0.7);
-  background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+  background-color: transparent;
+  background-image: image(rgba(32, 37, 38, 0.8));
   background-clip: padding-box;
   box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
   text-shadow: 0 1px black;
@@ -622,7 +629,8 @@ button.osd {
   button.osd:hover {
     color: white;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.8), rgba(60, 69, 71, 0.8));
+    background-color: transparent;
+    background-image: image(rgba(60, 69, 71, 0.8));
     background-clip: padding-box;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
     text-shadow: 0 1px black;
@@ -634,7 +642,8 @@ button.osd {
   button.osd:checked {
     color: white;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
+    background-color: transparent;
+    background-image: image(rgba(0, 0, 0, 0.7));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -646,7 +655,8 @@ button.osd {
   button.osd:disabled {
     color: #878a89;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+    background-color: transparent;
+    background-image: image(rgba(53, 57, 58, 0.5));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -655,7 +665,8 @@ button.osd {
   button.osd:backdrop {
     color: #eeeeec;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+    background-color: transparent;
+    background-image: image(rgba(32, 37, 38, 0.8));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -666,7 +677,8 @@ button.osd {
 button {
   color: #eeeeec;
   border-color: rgba(0, 0, 0, 0.7);
-  background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+  background-color: transparent;
+  background-image: image(rgba(32, 37, 38, 0.8));
   background-clip: padding-box;
   box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
   text-shadow: 0 1px black;
@@ -676,7 +688,8 @@ button {
   button:hover {
     color: white;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.8), rgba(60, 69, 71, 0.8));
+    background-color: transparent;
+    background-image: image(rgba(60, 69, 71, 0.8));
     background-clip: padding-box;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
     text-shadow: 0 1px black;
@@ -689,7 +702,8 @@ button {
   button:checked {
     color: white;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
+    background-color: transparent;
+    background-image: image(rgba(0, 0, 0, 0.7));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -700,7 +714,8 @@ button {
   button:disabled {
     color: #878a89;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+    background-color: transparent;
+    background-image: image(rgba(53, 57, 58, 0.5));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -709,7 +724,8 @@ button {
   button:backdrop {
     color: #eeeeec;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+    background-color: transparent;
+    background-image: image(rgba(32, 37, 38, 0.8));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -729,7 +745,8 @@ button {
     button.flat:hover {
       color: white;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.8), rgba(60, 69, 71, 0.8));
+      background-color: transparent;
+      background-image: image(rgba(60, 69, 71, 0.8));
       background-clip: padding-box;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
       text-shadow: 0 1px black;
@@ -739,7 +756,8 @@ button {
     button.flat:disabled {
       color: #878a89;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+      background-color: transparent;
+      background-image: image(rgba(53, 57, 58, 0.5));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -760,7 +778,8 @@ button {
     button.flat:checked {
       color: white;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
+      background-color: transparent;
+      background-image: image(rgba(0, 0, 0, 0.7));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -798,7 +817,8 @@ button.suggested-action {
     color: white;
     outline-color: rgba(255, 255, 255, 0.3);
     border-color: #215d9c;
-    background-image: linear-gradient(to bottom, #2b7bcf, #2b7bcf);
+    background-image: none;
+    background-color: #2b7bcf;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
     text-shadow: none;
     -gtk-icon-shadow: none; }
@@ -806,7 +826,8 @@ button.suggested-action {
   button.suggested-action:backdrop,
   button.suggested-action.flat:backdrop {
     border-color: #4a90d9;
-    background-image: linear-gradient(to bottom, #4a90d9, #4a90d9);
+    background-color: #4a90d9;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -822,7 +843,8 @@ button.suggested-action {
     button.suggested-action.flat:backdrop:active,
     button.suggested-action.flat:backdrop:checked {
       border-color: #2a76c6;
-      background-image: linear-gradient(to bottom, #2a76c6, #2a76c6);
+      background-color: #2a76c6;
+      background-image: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
       .selection-mode button.titlebutton:backdrop:active label, .selection-mode button.titlebutton:backdrop:active, .selection-mode button.titlebutton:backdrop:checked label, .selection-mode button.titlebutton:backdrop:checked,
       button.suggested-action:backdrop:active label,
@@ -838,7 +860,8 @@ button.suggested-action {
     button.suggested-action:backdrop:disabled,
     button.suggested-action.flat:backdrop:disabled {
       border-color: #c0c0bd;
-      background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+      background-color: #f1f1f1;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -854,7 +877,8 @@ button.suggested-action {
       button.suggested-action.flat:backdrop:disabled:active,
       button.suggested-action.flat:backdrop:disabled:checked {
         border-color: #5094db;
-        background-image: linear-gradient(to bottom, #5094db, #5094db);
+        background-color: #5094db;
+        background-image: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
         .selection-mode button.titlebutton:backdrop:disabled:active label, .selection-mode button.titlebutton:backdrop:disabled:checked label,
         button.suggested-action:backdrop:disabled:active label,
@@ -875,7 +899,8 @@ button.suggested-action {
     color: rgba(74, 144, 217, 0.8); }
   button.suggested-action:disabled {
     border-color: #b6b6b3;
-    background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+    background-color: #f1f1f1;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -896,7 +921,8 @@ button.suggested-action {
   button.suggested-action {
     color: #eeeeec;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(74, 144, 217, 0.5), rgba(74, 144, 217, 0.5));
+    background-color: transparent;
+    background-image: image(rgba(74, 144, 217, 0.5));
     background-clip: padding-box;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
     text-shadow: 0 1px black;
@@ -906,7 +932,8 @@ button.suggested-action {
     button.suggested-action:hover {
       color: white;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(74, 144, 217, 0.7), rgba(74, 144, 217, 0.7));
+      background-color: transparent;
+      background-image: image(rgba(74, 144, 217, 0.7));
       background-clip: padding-box;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
       text-shadow: 0 1px black;
@@ -919,7 +946,8 @@ button.suggested-action {
     button.suggested-action:checked {
       color: white;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, #4a90d9, #4a90d9);
+      background-color: transparent;
+      background-image: image(#4a90d9);
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -930,7 +958,8 @@ button.suggested-action {
     button.suggested-action:disabled {
       color: #878a89;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+      background-color: transparent;
+      background-image: image(rgba(53, 57, 58, 0.5));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -939,7 +968,8 @@ button.suggested-action {
     button.suggested-action:backdrop {
       color: #eeeeec;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(74, 144, 217, 0.5), rgba(74, 144, 217, 0.5));
+      background-color: transparent;
+      background-image: image(rgba(74, 144, 217, 0.5));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -975,14 +1005,16 @@ button.destructive-action {
     color: white;
     outline-color: rgba(255, 255, 255, 0.3);
     border-color: #a60c0c;
-    background-image: linear-gradient(to bottom, #df1111, #df1111);
+    background-image: none;
+    background-color: #df1111;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
     text-shadow: none;
     -gtk-icon-shadow: none; }
   button.destructive-action:backdrop,
   button.destructive-action.flat:backdrop {
     border-color: #ef2929;
-    background-image: linear-gradient(to bottom, #ef2929, #ef2929);
+    background-color: #ef2929;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -996,7 +1028,8 @@ button.destructive-action {
     button.destructive-action.flat:backdrop:active,
     button.destructive-action.flat:backdrop:checked {
       border-color: #d51010;
-      background-image: linear-gradient(to bottom, #d51010, #d51010);
+      background-color: #d51010;
+      background-image: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
       button.destructive-action:backdrop:active label,
       button.destructive-action:backdrop:active,
@@ -1010,7 +1043,8 @@ button.destructive-action {
     button.destructive-action:backdrop:disabled,
     button.destructive-action.flat:backdrop:disabled {
       border-color: #c0c0bd;
-      background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+      background-color: #f1f1f1;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1024,7 +1058,8 @@ button.destructive-action {
       button.destructive-action.flat:backdrop:disabled:active,
       button.destructive-action.flat:backdrop:disabled:checked {
         border-color: #ef3131;
-        background-image: linear-gradient(to bottom, #ef3131, #ef3131);
+        background-color: #ef3131;
+        background-image: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
         button.destructive-action:backdrop:disabled:active label,
         button.destructive-action:backdrop:disabled:checked label,
@@ -1043,7 +1078,8 @@ button.destructive-action {
     color: rgba(239, 41, 41, 0.8); }
   button.destructive-action:disabled {
     border-color: #b6b6b3;
-    background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+    background-color: #f1f1f1;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1064,7 +1100,8 @@ button.destructive-action {
   button.destructive-action {
     color: #eeeeec;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(239, 41, 41, 0.5), rgba(239, 41, 41, 0.5));
+    background-color: transparent;
+    background-image: image(rgba(239, 41, 41, 0.5));
     background-clip: padding-box;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
     text-shadow: 0 1px black;
@@ -1074,7 +1111,8 @@ button.destructive-action {
     button.destructive-action:hover {
       color: white;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(239, 41, 41, 0.7), rgba(239, 41, 41, 0.7));
+      background-color: transparent;
+      background-image: image(rgba(239, 41, 41, 0.7));
       background-clip: padding-box;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
       text-shadow: 0 1px black;
@@ -1087,7 +1125,8 @@ button.destructive-action {
     button.destructive-action:checked {
       color: white;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, #ef2929, #ef2929);
+      background-color: transparent;
+      background-image: image(#ef2929);
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -1098,7 +1137,8 @@ button.destructive-action {
     button.destructive-action:disabled {
       color: #878a89;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+      background-color: transparent;
+      background-image: image(rgba(53, 57, 58, 0.5));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -1107,7 +1147,8 @@ button.destructive-action {
     button.destructive-action:backdrop {
       color: #eeeeec;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(239, 41, 41, 0.5), rgba(239, 41, 41, 0.5));
+      background-color: transparent;
+      background-image: image(rgba(239, 41, 41, 0.5));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -1193,13 +1234,15 @@ button.needs-attention > image, stacksidebar row.needs-attention > label {
     color: #2e3436;
     outline-color: rgba(46, 52, 54, 0.3);
     border-color: #b6b6b3;
-    background-image: linear-gradient(to bottom, #d4d4d2, #d4d4d2);
+    background-image: none;
+    background-color: #d4d4d2;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
     text-shadow: none;
     -gtk-icon-shadow: none; }
   .inline-toolbar toolbutton > button:disabled {
     border-color: #b6b6b3;
-    background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+    background-color: #f1f1f1;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1213,7 +1256,8 @@ button.needs-attention > image, stacksidebar row.needs-attention > label {
         color: #8b8e8f; }
   .inline-toolbar toolbutton > button:backdrop {
     border-color: #c0c0bd;
-    background-image: linear-gradient(to bottom, #e8e8e7, #e8e8e7);
+    background-color: #e8e8e7;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1221,13 +1265,15 @@ button.needs-attention > image, stacksidebar row.needs-attention > label {
       color: #8b8e8f; }
     .inline-toolbar toolbutton > button:backdrop:active, .inline-toolbar toolbutton > button:backdrop:checked {
       border-color: #c0c0bd;
-      background-image: linear-gradient(to bottom, #dadad8, #dadad8);
+      background-color: #dadad8;
+      background-image: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
       .inline-toolbar toolbutton > button:backdrop:active label, .inline-toolbar toolbutton > button:backdrop:active, .inline-toolbar toolbutton > button:backdrop:checked label, .inline-toolbar toolbutton > button:backdrop:checked {
         color: #8b8e8f; }
     .inline-toolbar toolbutton > button:backdrop:disabled {
       border-color: #c0c0bd;
-      background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+      background-color: #f1f1f1;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1235,7 +1281,8 @@ button.needs-attention > image, stacksidebar row.needs-attention > label {
         color: #c3c3c0; }
       .inline-toolbar toolbutton > button:backdrop:disabled:active, .inline-toolbar toolbutton > button:backdrop:disabled:checked {
         border-color: #c0c0bd;
-        background-image: linear-gradient(to bottom, #e4e4e4, #e4e4e4);
+        background-color: #e4e4e4;
+        background-image: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
         .inline-toolbar toolbutton > button:backdrop:disabled:active label, .inline-toolbar toolbutton > button:backdrop:disabled:checked label {
           color: #c3c3c0; }
@@ -1554,7 +1601,8 @@ spinbutton.vertical button.down {
 .osd spinbutton.vertical button:first-child {
   color: #eeeeec;
   border-color: rgba(0, 0, 0, 0.7);
-  background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+  background-color: transparent;
+  background-image: image(rgba(32, 37, 38, 0.8));
   background-clip: padding-box;
   box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
   text-shadow: 0 1px black;
@@ -1563,7 +1611,8 @@ spinbutton.vertical button.down {
   .osd spinbutton.vertical button:first-child:hover {
     color: white;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.8), rgba(60, 69, 71, 0.8));
+    background-color: transparent;
+    background-image: image(rgba(60, 69, 71, 0.8));
     background-clip: padding-box;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
     text-shadow: 0 1px black;
@@ -1572,7 +1621,8 @@ spinbutton.vertical button.down {
   .osd spinbutton.vertical button:first-child:active {
     color: white;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
+    background-color: transparent;
+    background-image: image(rgba(0, 0, 0, 0.7));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -1581,7 +1631,8 @@ spinbutton.vertical button.down {
   .osd spinbutton.vertical button:first-child:disabled {
     color: #878a89;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+    background-color: transparent;
+    background-image: image(rgba(53, 57, 58, 0.5));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -1589,7 +1640,8 @@ spinbutton.vertical button.down {
   .osd spinbutton.vertical button:first-child:backdrop {
     color: #eeeeec;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+    background-color: transparent;
+    background-image: image(rgba(32, 37, 38, 0.8));
     background-clip: padding-box;
     box-shadow: none;
     text-shadow: none;
@@ -1744,7 +1796,8 @@ headerbar {
         color: #ffffff;
         outline-color: rgba(255, 255, 255, 0.3);
         border-color: #215d9c;
-        background-image: linear-gradient(to bottom, #2b7bcf, #2b7bcf);
+        background-image: none;
+        background-color: #2b7bcf;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0);
         text-shadow: none;
         -gtk-icon-shadow: none; }
@@ -1752,7 +1805,8 @@ headerbar {
       headerbar.selection-mode button:backdrop.flat,
       headerbar.selection-mode button:backdrop {
         border-color: #4a90d9;
-        background-image: linear-gradient(to bottom, #4a90d9, #4a90d9);
+        background-color: #4a90d9;
+        background-image: none;
         text-shadow: none;
         -gtk-icon-shadow: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -1770,7 +1824,8 @@ headerbar {
         headerbar.selection-mode button:backdrop:active,
         headerbar.selection-mode button:backdrop:checked {
           border-color: #2a76c6;
-          background-image: linear-gradient(to bottom, #2a76c6, #2a76c6);
+          background-color: #2a76c6;
+          background-image: none;
           box-shadow: inset 0 1px rgba(255, 255, 255, 0);
           border-color: #184472; }
           .selection-mode.titlebar:not(headerbar) button:backdrop.flat:active label, .selection-mode.titlebar:not(headerbar) button:backdrop.flat:active, .selection-mode.titlebar:not(headerbar) button:backdrop.flat:checked label, .selection-mode.titlebar:not(headerbar) button:backdrop.flat:checked, .selection-mode.titlebar:not(headerbar) button:backdrop:active label, .selection-mode.titlebar:not(headerbar) button:backdrop:active, .selection-mode.titlebar:not(headerbar) button:backdrop:checked label, .selection-mode.titlebar:not(headerbar) button:backdrop:checked,
@@ -1787,7 +1842,8 @@ headerbar {
         headerbar.selection-mode button:backdrop.flat:disabled,
         headerbar.selection-mode button:backdrop:disabled {
           border-color: #65a1df;
-          background-image: linear-gradient(to bottom, #65a1df, #65a1df);
+          background-color: #65a1df;
+          background-image: none;
           text-shadow: none;
           -gtk-icon-shadow: none;
           box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -1804,7 +1860,8 @@ headerbar {
           headerbar.selection-mode button:backdrop:disabled:active,
           headerbar.selection-mode button:backdrop:disabled:checked {
             border-color: #5094db;
-            background-image: linear-gradient(to bottom, #5094db, #5094db);
+            background-color: #5094db;
+            background-image: none;
             box-shadow: inset 0 1px rgba(255, 255, 255, 0);
             border-color: #184472; }
             .selection-mode.titlebar:not(headerbar) button:backdrop.flat:disabled:active label, .selection-mode.titlebar:not(headerbar) button:backdrop.flat:disabled:checked label, .selection-mode.titlebar:not(headerbar) button:backdrop:disabled:active label, .selection-mode.titlebar:not(headerbar) button:backdrop:disabled:checked label,
@@ -1826,7 +1883,8 @@ headerbar {
       .selection-mode.titlebar:not(headerbar) button:disabled,
       headerbar.selection-mode button:disabled {
         border-color: #215d9c;
-        background-image: linear-gradient(to bottom, #65a1df, #65a1df);
+        background-color: #65a1df;
+        background-image: none;
         text-shadow: none;
         -gtk-icon-shadow: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1873,7 +1931,8 @@ headerbar {
           color: #2e3436;
           outline-color: rgba(46, 52, 54, 0.3);
           border-color: #b6b6b3;
-          background-image: linear-gradient(to bottom, #d4d4d2, #d4d4d2);
+          background-image: none;
+          background-color: #d4d4d2;
           box-shadow: inset 0 1px rgba(255, 255, 255, 0);
           text-shadow: none;
           -gtk-icon-shadow: none;
@@ -1881,7 +1940,8 @@ headerbar {
         .selection-mode.titlebar:not(headerbar) button.suggested-action:disabled,
         headerbar.selection-mode button.suggested-action:disabled {
           border-color: #b6b6b3;
-          background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+          background-color: #f1f1f1;
+          background-image: none;
           text-shadow: none;
           -gtk-icon-shadow: none;
           box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -1893,7 +1953,8 @@ headerbar {
         .selection-mode.titlebar:not(headerbar) button.suggested-action:backdrop,
         headerbar.selection-mode button.suggested-action:backdrop {
           border-color: #c0c0bd;
-          background-image: linear-gradient(to bottom, #e8e8e7, #e8e8e7);
+          background-color: #e8e8e7;
+          background-image: none;
           text-shadow: none;
           -gtk-icon-shadow: none;
           box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -1905,7 +1966,8 @@ headerbar {
         .selection-mode.titlebar:not(headerbar) button.suggested-action:backdrop:disabled,
         headerbar.selection-mode button.suggested-action:backdrop:disabled {
           border-color: #c0c0bd;
-          background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+          background-color: #f1f1f1;
+          background-image: none;
           text-shadow: none;
           -gtk-icon-shadow: none;
           box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -1918,7 +1980,8 @@ headerbar {
     headerbar.selection-mode .selection-menu:backdrop,
     headerbar.selection-mode .selection-menu {
       border-color: rgba(74, 144, 217, 0);
-      background-image: linear-gradient(to bottom, rgba(74, 144, 217, 0), rgba(74, 144, 217, 0));
+      background-color: rgba(74, 144, 217, 0);
+      background-image: none;
       box-shadow: none;
       padding-left: 10px;
       padding-right: 10px; }
@@ -2673,7 +2736,8 @@ switch {
     border: 1px solid #184472; }
   switch:disabled slider {
     border-color: #b6b6b3;
-    background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+    background-color: #f1f1f1;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -2682,7 +2746,8 @@ switch {
   switch:backdrop slider {
     transition: 200ms ease-out;
     border-color: #c0c0bd;
-    background-image: linear-gradient(to bottom, #e8e8e7, #e8e8e7);
+    background-color: #e8e8e7;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -2692,7 +2757,8 @@ switch {
     border-color: #4a90d9; }
   switch:backdrop:disabled slider {
     border-color: #c0c0bd;
-    background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+    background-color: #f1f1f1;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -2790,14 +2856,16 @@ radio {
     color: #2e3436;
     outline-color: rgba(46, 52, 54, 0.3);
     border-color: #b6b6b3;
-    background-image: linear-gradient(to bottom, #d4d4d2, #d4d4d2);
+    background-image: none;
+    background-color: #d4d4d2;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
     text-shadow: none;
     -gtk-icon-shadow: none; }
   check:disabled,
   radio:disabled {
     border-color: #b6b6b3;
-    background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+    background-color: #f1f1f1;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -2808,7 +2876,8 @@ radio {
   check:backdrop,
   radio:backdrop {
     border-color: #c0c0bd;
-    background-image: linear-gradient(to bottom, #e8e8e7, #e8e8e7);
+    background-color: #e8e8e7;
+    background-image: none;
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -2820,7 +2889,8 @@ radio {
     check:backdrop:disabled,
     radio:backdrop:disabled {
       border-color: #c0c0bd;
-      background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+      background-color: #f1f1f1;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -2835,7 +2905,8 @@ radio {
   radio {
     color: #eeeeec;
     border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+    background-color: transparent;
+    background-image: image(rgba(32, 37, 38, 0.8));
     background-clip: padding-box;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
     text-shadow: 0 1px black;
@@ -2845,7 +2916,8 @@ radio {
     radio:hover {
       color: #eeeeec;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+      background-color: transparent;
+      background-image: image(rgba(32, 37, 38, 0.8));
       background-clip: padding-box;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
       text-shadow: 0 1px black;
@@ -2855,7 +2927,8 @@ radio {
     radio:active {
       color: white;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
+      background-color: transparent;
+      background-image: image(rgba(0, 0, 0, 0.7));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -2865,7 +2938,8 @@ radio {
     radio:backdrop {
       color: #eeeeec;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+      background-color: transparent;
+      background-image: image(rgba(32, 37, 38, 0.8));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -2874,7 +2948,8 @@ radio {
     radio:disabled {
       color: #878a89;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+      background-color: transparent;
+      background-image: image(rgba(53, 57, 58, 0.5));
       background-clip: padding-box;
       box-shadow: none;
       text-shadow: none;
@@ -3063,7 +3138,8 @@ scale {
       border-color: #184472; }
     scale slider:disabled {
       border-color: #b6b6b3;
-      background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+      background-color: #f1f1f1;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -3072,7 +3148,8 @@ scale {
     scale slider:backdrop {
       transition: 200ms ease-out;
       border-color: #c0c0bd;
-      background-image: linear-gradient(to bottom, #e8e8e7, #e8e8e7);
+      background-color: #e8e8e7;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -3080,7 +3157,8 @@ scale {
         color: #8b8e8f; }
       scale slider:backdrop:disabled {
         border-color: #c0c0bd;
-        background-image: linear-gradient(to bottom, #f1f1f1, #f1f1f1);
+        background-color: #f1f1f1;
+        background-image: none;
         text-shadow: none;
         -gtk-icon-shadow: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -3091,7 +3169,8 @@ scale {
     .osd scale slider {
       color: #eeeeec;
       border-color: rgba(0, 0, 0, 0.7);
-      background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+      background-color: transparent;
+      background-image: image(rgba(32, 37, 38, 0.8));
       background-clip: padding-box;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
       text-shadow: 0 1px black;
@@ -3102,37 +3181,47 @@ scale {
       .osd scale slider:hover {
         color: white;
         border-color: rgba(0, 0, 0, 0.7);
-        background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.8), rgba(60, 69, 71, 0.8));
+        background-color: transparent;
+        background-image: image(rgba(60, 69, 71, 0.8));
         background-clip: padding-box;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
         text-shadow: 0 1px black;
         -gtk-icon-shadow: 0 1px black;
-        outline-color: rgba(238, 238, 236, 0.3); }
+        outline-color: rgba(238, 238, 236, 0.3);
+        background-color: #202526; }
       .osd scale slider:active {
         color: white;
         border-color: rgba(0, 0, 0, 0.7);
-        background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
+        background-color: transparent;
+        background-image: image(rgba(0, 0, 0, 0.7));
         background-clip: padding-box;
         box-shadow: none;
         text-shadow: none;
         -gtk-icon-shadow: none;
-        outline-color: rgba(238, 238, 236, 0.3); }
+        outline-color: rgba(238, 238, 236, 0.3);
+        background-color: #202526; }
       .osd scale slider:disabled {
         color: #878a89;
         border-color: rgba(0, 0, 0, 0.7);
-        background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5), rgba(53, 57, 58, 0.5));
+        background-color: transparent;
+        background-image: image(rgba(53, 57, 58, 0.5));
         background-clip: padding-box;
         box-shadow: none;
         text-shadow: none;
-        -gtk-icon-shadow: none; }
+        -gtk-icon-shadow: none;
+        background-color: #202526; }
       .osd scale slider:backdrop {
         color: #eeeeec;
         border-color: rgba(0, 0, 0, 0.7);
-        background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.8), rgba(32, 37, 38, 0.8));
+        background-color: transparent;
+        background-image: image(rgba(32, 37, 38, 0.8));
         background-clip: padding-box;
         box-shadow: none;
         text-shadow: none;
-        -gtk-icon-shadow: none; }
+        -gtk-icon-shadow: none;
+        background-color: #202526; }
+        .osd scale slider:backdrop:disabled {
+          background-color: #202526; }
   scale value {
     color: alpha(currentColor,0.55); }
   scale marks {
@@ -3529,7 +3618,7 @@ scale {
     min-height: 0;
     min-width: 0; }
     scale.color trough {
-      background-image: linear-gradient(to bottom, #b6b6b3, #b6b6b3);
+      background-image: image(#b6b6b3);
       background-repeat: no-repeat; }
     scale.color.horizontal {
       padding: 0 0 15px 0; }
@@ -4059,7 +4148,7 @@ placessidebar row {
   placessidebar row.sidebar-placeholder-row {
     padding: 0 8px;
     min-height: 2px;
-    background-image: linear-gradient(to bottom, #4e9a06, #4e9a06);
+    background-image: image(#4e9a06);
     background-clip: content-box; }
   placessidebar row.sidebar-new-bookmark-row {
     color: #4a90d9; }
@@ -4091,21 +4180,21 @@ paned > separator {
   -gtk-icon-source: none;
   border-style: none;
   background-color: transparent;
-  background-image: linear-gradient(to bottom, #b6b6b3, #b6b6b3);
+  background-image: image(#b6b6b3);
   background-size: 1px 1px; }
   paned > separator:selected {
-    background-image: linear-gradient(to bottom, #4a90d9, #4a90d9); }
+    background-image: image(#4a90d9); }
   paned > separator:backdrop {
-    background-image: linear-gradient(to bottom, #c0c0bd, #c0c0bd); }
+    background-image: image(#c0c0bd); }
   paned > separator.wide {
     min-width: 5px;
     min-height: 5px;
     background-color: #e8e8e7;
-    background-image: linear-gradient(to bottom, #b6b6b3, #b6b6b3), linear-gradient(to bottom, #b6b6b3, #b6b6b3);
+    background-image: image(#b6b6b3), image(#b6b6b3);
     background-size: 1px 1px, 1px 1px; }
     paned > separator.wide:backdrop {
       background-color: #e8e8e7;
-      background-image: linear-gradient(to bottom, #c0c0bd, #c0c0bd), linear-gradient(to bottom, #c0c0bd, #c0c0bd); }
+      background-image: image(#c0c0bd), image(#c0c0bd); }
 paned.horizontal > separator {
   background-repeat: repeat-y; }
   paned.horizontal > separator:dir(ltr) {
@@ -4205,7 +4294,8 @@ infobar {
       color: #ffffff;
       outline-color: rgba(255, 255, 255, 0.3);
       border-color: #215d9c;
-      background-image: linear-gradient(to bottom, #2b7bcf, #2b7bcf);
+      background-image: none;
+      background-color: #2b7bcf;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0);
       text-shadow: none;
       -gtk-icon-shadow: none; }
@@ -4214,7 +4304,8 @@ infobar {
     .warning button:disabled,
     .error button:disabled {
       border-color: #215d9c;
-      background-image: linear-gradient(to bottom, #65a1df, #65a1df);
+      background-color: #65a1df;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -4231,7 +4322,8 @@ infobar {
     .warning button:backdrop,
     .error button:backdrop {
       border-color: #4a90d9;
-      background-image: linear-gradient(to bottom, #4a90d9, #4a90d9);
+      background-color: #4a90d9;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -4249,7 +4341,8 @@ infobar {
       .warning button:backdrop:disabled,
       .error button:backdrop:disabled {
         border-color: #65a1df;
-        background-image: linear-gradient(to bottom, #65a1df, #65a1df);
+        background-color: #65a1df;
+        background-image: none;
         text-shadow: none;
         -gtk-icon-shadow: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -4374,7 +4467,8 @@ colorswatch#add-color-button {
       box-shadow: inset 0 1px white; }
     colorswatch#add-color-button overlay:backdrop {
       border-color: #c0c0bd;
-      background-image: linear-gradient(to bottom, #e8e8e7, #e8e8e7);
+      background-color: #e8e8e7;
+      background-image: none;
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }