--- a/browser/themes/pinstripe/browser/browser.css
+++ b/browser/themes/pinstripe/browser/browser.css
@@ -83,18 +83,18 @@
 }
 
 #nav-bar {
   padding-bottom: 4px !important;
 }
 
 #PersonalToolbar {
   -moz-appearance: none;
-  margin-top: -1px; /* overlay the bottom border of the toolbar above us */
-  padding-top: 0 !important;
+  margin-top: -2px; /* overlay the bottom border of the toolbar above us */
+  padding-top: 1px !important;
   background-color: -moz-mac-chrome-active;
   border-bottom: 1px solid rgba(0, 0, 0, 0.57);
 }
 
 #navigator-toolbox[tabsontop="true"] > #nav-bar,
 #navigator-toolbox[tabsontop="true"]:not([customizing]) > #nav-bar[collapsed="true"] + toolbar,
 #navigator-toolbox[tabsontop="true"]:not([customizing]) > #nav-bar[collapsed="true"] + #customToolbars + #PersonalToolbar {
   -moz-appearance: none;
@@ -1771,44 +1771,45 @@ toolbarbutton.chevron > .toolbarbutton-m
 }
 
 #TabsToolbar {
   -moz-appearance: none;
   height: 26px;
   background-repeat: repeat-x;
 }
 
-#TabsToolbar:not(:-moz-lwtheme) {
-  background-color: -moz-mac-chrome-active;
-}
-
-#TabsToolbar:not(:-moz-lwtheme):-moz-window-inactive {
-  background-color: -moz-mac-chrome-inactive;
-}
-
 #TabsToolbar[tabsontop="false"] {
-  margin-top: -1px;
+  margin-top: -2px;
   padding-top: 2px;
 }
 
+/* For tabs-on-top, only fill the bottom 2px with the chrome background
+ * color, so that the borders in tabbar-top-bg-*.png can mix with it.
+ * In the top 24px the unified toolbar (from the ::before above) will show.
+ */
 #TabsToolbar[tabsontop="true"]:not(:-moz-lwtheme) {
   padding-bottom: 2px;
-  background-image: url(chrome://browser/skin/tabbrowser/tabbar-top-bg-active.png) ;
+  background: url(chrome://browser/skin/tabbrowser/tabbar-top-bg-active.png),
+              -moz-linear-gradient(bottom, -moz-mac-chrome-active 2px, transparent 2px);
 }
 
 #TabsToolbar[tabsontop="true"]:not(:-moz-lwtheme):-moz-window-inactive {
-  background-image: url(chrome://browser/skin/tabbrowser/tabbar-top-bg-inactive.png);
-}
-
+  background: url(chrome://browser/skin/tabbrowser/tabbar-top-bg-inactive.png),
+              -moz-linear-gradient(bottom, -moz-mac-chrome-inactive 2px, transparent 2px);
+}
+
+/* In tabs-on-bottom mode, fill the whole toolbar with the chrome
+ * background color.
+ */
 #TabsToolbar[tabsontop="false"]:not(:-moz-lwtheme) {
-  background-image: url(chrome://browser/skin/tabbrowser/tabbar-bottom-bg-active.png);
+  background: url(chrome://browser/skin/tabbrowser/tabbar-bottom-bg-active.png) -moz-mac-chrome-active;
 }
 
 #TabsToolbar[tabsontop="false"]:not(:-moz-lwtheme):-moz-window-inactive {
-  background-image: url(chrome://browser/skin/tabbrowser/tabbar-bottom-bg-inactive.png);
+  background: url(chrome://browser/skin/tabbrowser/tabbar-bottom-bg-inactive.png) -moz-mac-chrome-inactive;
 }
 
 #tabbrowser-tabs {
   -moz-box-align: stretch;
   height: 26px;
 }
 
 #tabbrowser-tabs[tabsontop="true"] > .tabbrowser-arrowscrollbox > .arrowscrollbox-scrollbox:not(:-moz-lwtheme) {

index 0e7f271a5d67058ca678b238595523806ba72ec4..fc7b3497d55e5b665e0308ccab26cae7598887fd
GIT binary patch
literal 121
zc%17D@N?(olHy`uVBq!ia0vp^B0wy~!3HF^H`mkxDF;s%$B>F!Z_jMxWKa+}av|7J
zAZLxtRo1(&kK8lr{lL7wH)nB@#9@hJA6`!LsOK^EVO_=*+`RIzNy01x-6?N<t-@Z;
VS4xWCe+Ot5gQu&X%Q~loCIFS#DhU7p

index 0c7a196de516f54cbd1ab19b06d46236c43ad206..c47147cbddb44e5f154c31d372b0de49c44de4db
GIT binary patch
literal 118
zc%17D@N?(olHy`uVBq!ia0vp^B0wy~!3HF^H`mkxDO*n$$B>F!Z!aF?WKiI7zPLhR
zM<DyFb$y{P`Ti@Zd|3BiC{*;6BfD(Lg@f@;dl@gcWFFj-XtkolBPhPslYjZ~i)+6v
S?3xBNh{4m<&t;ucLK6TKjwz%7