misc fixes, sidebery css

README.md

@@ -1,6 +1,6 @@
 # MSFX
 
-Fork of [the MSFX Firefox userChrome](https://github.com/WinClassic/MSFX).
+Partially opinionated fork of [the MSFX Firefox userChrome](https://github.com/WinClassic/MSFX) for non-ESR versions.
 
 ![Screenshot of MSFX](.assets/screenshot.png)
 
@@ -21,11 +21,17 @@ Fork of [the MSFX Firefox userChrome](https://github.com/WinClassic/MSFX).
   - Properly styled address bar dropdown
   - Proper hover/active states for menu bar items
   - Scrollbar dithering
+  - Sidebar
+    - Correct close button positioning
+    - Support for "Move sidebar to right"
 - Internet status bar widget is its own component
   - Empty boxes have been removed in favor of putting extensions on the status bar
 - Address bar is no longer forced to the Address toolbar (configurable, enabled by default)
 - Works with Firefox 117+ (fixes developed for on 122.0b3)
   - A lot of legacy styling was removed to where the `appearance` property does nothing, everything that used this to achieve the classic style has been accurately recreated as best as possible.
+- Find bar text entry visibility fixes
+- Polyfill for missing legacy colors for scrollbars and grabber (125+)
+- Optional polyfill for missing legacy colors everywhere (useful for extensions, see `addons` folder) (125+)
 
 ## What's missing?
 

addons/README.md

@@ -0,0 +1,9 @@
+# Custom CSS for various extensions
+
+Requires "Optional polyfill for missing legacy colors everywhere" userchrome JS (`msfx-expose_legacy_colors.uc.js`)
+
+## [Sidebery](https://addons.mozilla.org/en-US/firefox/addon/sidebery/)
+
+Paste CSS file into "Styles Editor" in Sidebery's config page
+
+![Sidebery preview](../.assets/sidebery.png)

addons/sidebery.css

@@ -0,0 +1,668 @@
+:root {
+  --ImageListMinus: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAASSURBVBhXY6At+I8F0wYwMAAA8uYE/KrnMfcAAAAASUVORK5CYIIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==");
+  --ImageListPlus: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAgSURBVBhXYyAF/IfSWAFWSZAgOsYAWAVhAK8kEmBgAACBdAj4lkLGzQAAAABJRU5ErkJgggAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==");
+  --ImageFavicon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAABgUExURYaGhv///5mZmVVVVf/78ABmzDMzMwAAgDNm//Hx8czMzHd3d2aZmZnMzDMzzGb//+rq6pmZZv//mQDM/+fn1v/MmcyZZjNmzF9fXwAzmcDAwABmmYCAADMzZgQEBAAAANSdJEsAAAAgdFJOU/////////////////////////////////////////8AXFwb7QAAAAlwSFlzAAAOwwAADsMBx2+oZAAAAIpJREFUKFNNjFsWgyAMREUIRGhTbOlLW7P/XRoD2t6Tj8w9k3TM3O3IzipMpbeHcEpvxOwCwDnrvVcRQHA4xD7ZTYTTmegCg8tRvnQcxqvU6QZDLnET6Y7bCUAuKtLjidKQg1Ibr/GNOE2Ec2t86EsoSG4/iJdlnjVXwZRMliDTBKd40IT9oeIP5hU1fA8vue4FsgAAAABJRU5ErkJggg==");
+}
+
+#root.root {
+  --tabs-pinned-width: 16px;
+  --tabs-pinned-height: 16px;
+  --tabs-height: 16px;
+  --frame-bg: var(--ThreeDFace) !important;
+  --frame-fg: var(--WindowText) !important;
+  --tabs-indent: 19px;
+}
+
+.Tab {
+  height: 16px !important;
+  padding-bottom: 0 !important;
+  margin: 0 !important;
+  width: 100% !important;
+}
+.Tab .t-box {
+  mask: none !important;
+}
+.Tab .title {
+  font-size: 8pt !important;
+  font-family: system-ui !important;
+  line-height: 16px;
+}
+.Tab[data-active="true"] .title {
+  background-color: var(--Highlight);
+  color: var(--HighlightText);
+  width: min-content;
+}
+.Tab .fav {
+  margin: 0 !important;
+  margin-right: 3px !important;
+  z-index: 50 !important;
+  transform: translateZ(10px) !important;
+  background-color: var(--ThreeDFace);
+}
+.Tab .body {
+  border-radius: 0 !important;
+  height: 16px !important;
+}
+
+.Tab {
+  z-index: 20;
+}
+.Tab + .Tab {
+  z-index: 21;
+}
+
+.Tab[data-active="true"] .body,
+.Tab:hover .body::before {
+  background: transparent !important;
+  box-shadow: none !important;
+}
+.Tab .body::after {
+  opacity: 1 !important;
+}
+.Tab .body::before {
+  opacity: 1 !important;
+  border-radius: 0 !important;
+}
+.PinnedTabsBar {
+  padding-bottom: 2px !important;
+}
+.PinnedTabsBar::after {
+  opacity: 1 !important;
+  background-image: none !important;
+  height: 2px !important;
+  box-shadow: inset 0 -1px 0 0 var(--ThreeDHighlight),
+    inset 0 -2px 0 0 var(--ThreeDShadow);
+  left: 0 !important;
+  width: 100% !important;
+  bottom: 0 !important;
+}
+
+.Tab .close {
+  display: none !important;
+}
+.Tab .child-count {
+  right: -1px !important;
+  bottom: -1px !important;
+}
+
+#root[data-tabs-tree-lvl-marks="true"] {
+  &[data-frame-color-scheme="light"] {
+    .AnimatedTabList:has(> .Tab[data-lvl="1"])
+      > .Tab[data-pin="false"][data-lvl="0"]:has(+ .Tab[data-lvl="0"])
+      .body:after,
+    .AnimatedTabList:has(> .Tab[data-lvl="1"])
+      > .Tab[data-pin="false"][data-lvl="0"]
+      + .Tab[data-lvl="0"]
+      .body:after,
+    .AnimatedTabList:has(> .Tab[data-lvl="1"])
+      > .Tab[data-pin="false"][data-lvl="0"]:has(+ .tab-space-filler)
+      .body:after,
+    .AnimatedTabList:has(> .Tab[data-lvl="0"] .child-count)
+      > .Tab[data-pin="false"][data-lvl="0"]:has(+ .Tab[data-lvl="0"])
+      .body:after,
+    .AnimatedTabList:has(> .Tab[data-lvl="0"] .child-count)
+      > .Tab[data-pin="false"][data-lvl="0"]
+      + .Tab[data-lvl="0"]
+      .body:after,
+    .AnimatedTabList:has(> .Tab[data-lvl="0"] .child-count)
+      > .Tab[data-pin="false"][data-lvl="0"]:has(+ .tab-space-filler)
+      .body:after,
+    .Tab[data-pin="false"]:not([data-lvl="0"]) .body:after {
+      --line-color: var(--ThreeDShadow) !important;
+    }
+  }
+
+  .AnimatedTabList:has(> .Tab[data-lvl="1"]),
+  .AnimatedTabList:has(> .Tab[data-lvl="0"] .child-count) {
+    & > .Tab[data-lvl="0"] {
+      padding-left: 19px;
+    }
+    .Tab[data-lvl]:not([data-lvl="0"]) {
+      margin-left: 19px !important;
+    }
+  }
+
+  /* css crimes ahead */
+  .AnimatedTabList:has(> .Tab[data-lvl="1"])
+    > .Tab[data-pin="false"][data-lvl="0"]:has(+ .Tab[data-lvl="0"])
+    .body:after,
+  .AnimatedTabList:has(> .Tab[data-lvl="1"])
+    > .Tab[data-pin="false"][data-lvl="0"]
+    + .Tab[data-lvl="0"]
+    .body:after,
+  .AnimatedTabList:has(> .Tab[data-lvl="1"])
+    > .Tab[data-pin="false"][data-lvl="0"]:has(+ .tab-space-filler)
+    .body:after,
+  .AnimatedTabList:has(> .Tab[data-lvl="0"] .child-count)
+    > .Tab[data-pin="false"][data-lvl="0"]:has(+ .Tab[data-lvl="0"])
+    .body:after,
+  .AnimatedTabList:has(> .Tab[data-lvl="0"] .child-count)
+    > .Tab[data-pin="false"][data-lvl="0"]
+    + .Tab[data-lvl="0"]
+    .body:after,
+  .AnimatedTabList:has(> .Tab[data-lvl="0"] .child-count)
+    > .Tab[data-pin="false"][data-lvl="0"]:has(+ .tab-space-filler)
+    .body:after,
+  .Tab[data-pin="false"]:not([data-lvl="0"]) .body:after {
+    --line-color: var(--ThreeDHighlight);
+    top: 0;
+    left: -11px;
+    height: 16px;
+    display: block;
+    box-shadow: calc((19px * -1) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -1) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -1) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -1) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -1) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -1) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -1) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -1) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -1) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -1) 21px 0 0 var(--frame-bg),
+      calc(19px * -1) 20px 0 0 var(--line-color),
+      calc(19px * -1) 19px 0 0 var(--frame-bg),
+      calc(19px * -1) 18px 0 0 var(--line-color),
+      calc(19px * -1) 17px 0 0 var(--frame-bg),
+      calc(19px * -1) 16px 0 0 var(--line-color),
+      calc(19px * -1) 15px 0 0 var(--frame-bg),
+      calc(19px * -1) 14px 0 0 var(--line-color),
+      calc(19px * -1) 13px 0 0 var(--frame-bg),
+      calc(19px * -1) 12px 0 0 var(--line-color),
+      calc(19px * -1) 11px 0 0 var(--frame-bg),
+      calc(19px * -1) 10px 0 0 var(--line-color),
+      calc(19px * -1) 9px 0 0 var(--frame-bg),
+      calc(19px * -1) 8px 0 0 var(--line-color),
+      calc(19px * -1) 7px 0 0 var(--frame-bg),
+      calc(19px * -1) 6px 0 0 var(--line-color),
+      calc(19px * -1) 5px 0 0 var(--frame-bg),
+      calc(19px * -1) 4px 0 0 var(--line-color),
+      calc((19px * -2) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -2) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -2) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -2) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -2) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -2) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -2) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -2) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -2) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -2) 21px 0 0 var(--frame-bg),
+      calc(19px * -2) 20px 0 0 var(--line-color),
+      calc(19px * -2) 19px 0 0 var(--frame-bg),
+      calc(19px * -2) 18px 0 0 var(--line-color),
+      calc(19px * -2) 17px 0 0 var(--frame-bg),
+      calc(19px * -2) 16px 0 0 var(--line-color),
+      calc(19px * -2) 15px 0 0 var(--frame-bg),
+      calc(19px * -2) 14px 0 0 var(--line-color),
+      calc(19px * -2) 13px 0 0 var(--frame-bg),
+      calc(19px * -2) 12px 0 0 var(--line-color),
+      calc(19px * -2) 11px 0 0 var(--frame-bg),
+      calc(19px * -2) 10px 0 0 var(--line-color),
+      calc(19px * -2) 9px 0 0 var(--frame-bg),
+      calc(19px * -2) 8px 0 0 var(--line-color),
+      calc(19px * -2) 7px 0 0 var(--frame-bg),
+      calc(19px * -2) 6px 0 0 var(--line-color),
+      calc(19px * -2) 5px 0 0 var(--frame-bg),
+      calc(19px * -2) 4px 0 0 var(--line-color),
+      calc((19px * -3) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -3) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -3) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -3) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -3) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -3) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -3) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -3) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -3) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -3) 21px 0 0 var(--frame-bg),
+      calc(19px * -3) 20px 0 0 var(--line-color),
+      calc(19px * -3) 19px 0 0 var(--frame-bg),
+      calc(19px * -3) 18px 0 0 var(--line-color),
+      calc(19px * -3) 17px 0 0 var(--frame-bg),
+      calc(19px * -3) 16px 0 0 var(--line-color),
+      calc(19px * -3) 15px 0 0 var(--frame-bg),
+      calc(19px * -3) 14px 0 0 var(--line-color),
+      calc(19px * -3) 13px 0 0 var(--frame-bg),
+      calc(19px * -3) 12px 0 0 var(--line-color),
+      calc(19px * -3) 11px 0 0 var(--frame-bg),
+      calc(19px * -3) 10px 0 0 var(--line-color),
+      calc(19px * -3) 9px 0 0 var(--frame-bg),
+      calc(19px * -3) 8px 0 0 var(--line-color),
+      calc(19px * -3) 7px 0 0 var(--frame-bg),
+      calc(19px * -3) 6px 0 0 var(--line-color),
+      calc(19px * -3) 5px 0 0 var(--frame-bg),
+      calc(19px * -3) 4px 0 0 var(--line-color),
+      calc((19px * -4) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -4) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -4) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -4) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -4) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -4) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -4) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -4) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -4) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -4) 21px 0 0 var(--frame-bg),
+      calc(19px * -4) 20px 0 0 var(--line-color),
+      calc(19px * -4) 19px 0 0 var(--frame-bg),
+      calc(19px * -4) 18px 0 0 var(--line-color),
+      calc(19px * -4) 17px 0 0 var(--frame-bg),
+      calc(19px * -4) 16px 0 0 var(--line-color),
+      calc(19px * -4) 15px 0 0 var(--frame-bg),
+      calc(19px * -4) 14px 0 0 var(--line-color),
+      calc(19px * -4) 13px 0 0 var(--frame-bg),
+      calc(19px * -4) 12px 0 0 var(--line-color),
+      calc(19px * -4) 11px 0 0 var(--frame-bg),
+      calc(19px * -4) 10px 0 0 var(--line-color),
+      calc(19px * -4) 9px 0 0 var(--frame-bg),
+      calc(19px * -4) 8px 0 0 var(--line-color),
+      calc(19px * -4) 7px 0 0 var(--frame-bg),
+      calc(19px * -4) 6px 0 0 var(--line-color),
+      calc(19px * -4) 5px 0 0 var(--frame-bg),
+      calc(19px * -4) 4px 0 0 var(--line-color),
+      calc((19px * -5) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -5) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -5) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -5) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -5) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -5) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -5) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -5) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -5) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -5) 21px 0 0 var(--frame-bg),
+      calc(19px * -5) 20px 0 0 var(--line-color),
+      calc(19px * -5) 19px 0 0 var(--frame-bg),
+      calc(19px * -5) 18px 0 0 var(--line-color),
+      calc(19px * -5) 17px 0 0 var(--frame-bg),
+      calc(19px * -5) 16px 0 0 var(--line-color),
+      calc(19px * -5) 15px 0 0 var(--frame-bg),
+      calc(19px * -5) 14px 0 0 var(--line-color),
+      calc(19px * -5) 13px 0 0 var(--frame-bg),
+      calc(19px * -5) 12px 0 0 var(--line-color),
+      calc(19px * -5) 11px 0 0 var(--frame-bg),
+      calc(19px * -5) 10px 0 0 var(--line-color),
+      calc(19px * -5) 9px 0 0 var(--frame-bg),
+      calc(19px * -5) 8px 0 0 var(--line-color),
+      calc(19px * -5) 7px 0 0 var(--frame-bg),
+      calc(19px * -5) 6px 0 0 var(--line-color),
+      calc(19px * -5) 5px 0 0 var(--frame-bg),
+      calc(19px * -5) 4px 0 0 var(--line-color),
+      calc((19px * -6) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -6) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -6) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -6) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -6) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -6) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -6) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -6) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -6) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -6) 21px 0 0 var(--frame-bg),
+      calc(19px * -6) 20px 0 0 var(--line-color),
+      calc(19px * -6) 19px 0 0 var(--frame-bg),
+      calc(19px * -6) 18px 0 0 var(--line-color),
+      calc(19px * -6) 17px 0 0 var(--frame-bg),
+      calc(19px * -6) 16px 0 0 var(--line-color),
+      calc(19px * -6) 15px 0 0 var(--frame-bg),
+      calc(19px * -6) 14px 0 0 var(--line-color),
+      calc(19px * -6) 13px 0 0 var(--frame-bg),
+      calc(19px * -6) 12px 0 0 var(--line-color),
+      calc(19px * -6) 11px 0 0 var(--frame-bg),
+      calc(19px * -6) 10px 0 0 var(--line-color),
+      calc(19px * -6) 9px 0 0 var(--frame-bg),
+      calc(19px * -6) 8px 0 0 var(--line-color),
+      calc(19px * -6) 7px 0 0 var(--frame-bg),
+      calc(19px * -6) 6px 0 0 var(--line-color),
+      calc(19px * -6) 5px 0 0 var(--frame-bg),
+      calc(19px * -6) 4px 0 0 var(--line-color),
+      calc((19px * -7) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -7) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -7) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -7) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -7) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -7) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -7) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -7) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -7) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -7) 21px 0 0 var(--frame-bg),
+      calc(19px * -7) 20px 0 0 var(--line-color),
+      calc(19px * -7) 19px 0 0 var(--frame-bg),
+      calc(19px * -7) 18px 0 0 var(--line-color),
+      calc(19px * -7) 17px 0 0 var(--frame-bg),
+      calc(19px * -7) 16px 0 0 var(--line-color),
+      calc(19px * -7) 15px 0 0 var(--frame-bg),
+      calc(19px * -7) 14px 0 0 var(--line-color),
+      calc(19px * -7) 13px 0 0 var(--frame-bg),
+      calc(19px * -7) 12px 0 0 var(--line-color),
+      calc(19px * -7) 11px 0 0 var(--frame-bg),
+      calc(19px * -7) 10px 0 0 var(--line-color),
+      calc(19px * -7) 9px 0 0 var(--frame-bg),
+      calc(19px * -7) 8px 0 0 var(--line-color),
+      calc(19px * -7) 7px 0 0 var(--frame-bg),
+      calc(19px * -7) 6px 0 0 var(--line-color),
+      calc(19px * -7) 5px 0 0 var(--frame-bg),
+      calc(19px * -7) 4px 0 0 var(--line-color),
+      calc((19px * -8) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -8) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -8) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -8) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -8) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -8) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -8) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -8) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -8) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -8) 21px 0 0 var(--frame-bg),
+      calc(19px * -8) 20px 0 0 var(--line-color),
+      calc(19px * -8) 19px 0 0 var(--frame-bg),
+      calc(19px * -8) 18px 0 0 var(--line-color),
+      calc(19px * -8) 17px 0 0 var(--frame-bg),
+      calc(19px * -8) 16px 0 0 var(--line-color),
+      calc(19px * -8) 15px 0 0 var(--frame-bg),
+      calc(19px * -8) 14px 0 0 var(--line-color),
+      calc(19px * -8) 13px 0 0 var(--frame-bg),
+      calc(19px * -8) 12px 0 0 var(--line-color),
+      calc(19px * -8) 11px 0 0 var(--frame-bg),
+      calc(19px * -8) 10px 0 0 var(--line-color),
+      calc(19px * -8) 9px 0 0 var(--frame-bg),
+      calc(19px * -8) 8px 0 0 var(--line-color),
+      calc(19px * -8) 7px 0 0 var(--frame-bg),
+      calc(19px * -8) 6px 0 0 var(--line-color),
+      calc(19px * -8) 5px 0 0 var(--frame-bg),
+      calc(19px * -8) 4px 0 0 var(--line-color),
+      calc((19px * -9) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -9) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -9) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -9) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -9) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -9) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -9) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -9) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -9) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -9) 21px 0 0 var(--frame-bg),
+      calc(19px * -9) 20px 0 0 var(--line-color),
+      calc(19px * -9) 19px 0 0 var(--frame-bg),
+      calc(19px * -9) 18px 0 0 var(--line-color),
+      calc(19px * -9) 17px 0 0 var(--frame-bg),
+      calc(19px * -9) 16px 0 0 var(--line-color),
+      calc(19px * -9) 15px 0 0 var(--frame-bg),
+      calc(19px * -9) 14px 0 0 var(--line-color),
+      calc(19px * -9) 13px 0 0 var(--frame-bg),
+      calc(19px * -9) 12px 0 0 var(--line-color),
+      calc(19px * -9) 11px 0 0 var(--frame-bg),
+      calc(19px * -9) 10px 0 0 var(--line-color),
+      calc(19px * -9) 9px 0 0 var(--frame-bg),
+      calc(19px * -9) 8px 0 0 var(--line-color),
+      calc(19px * -9) 7px 0 0 var(--frame-bg),
+      calc(19px * -9) 6px 0 0 var(--line-color),
+      calc(19px * -9) 5px 0 0 var(--frame-bg),
+      calc(19px * -9) 4px 0 0 var(--line-color),
+      calc((19px * -10) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -10) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -10) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -10) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -10) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -10) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -10) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -10) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -10) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -10) 21px 0 0 var(--frame-bg),
+      calc(19px * -10) 20px 0 0 var(--line-color),
+      calc(19px * -10) 19px 0 0 var(--frame-bg),
+      calc(19px * -10) 18px 0 0 var(--line-color),
+      calc(19px * -10) 17px 0 0 var(--frame-bg),
+      calc(19px * -10) 16px 0 0 var(--line-color),
+      calc(19px * -10) 15px 0 0 var(--frame-bg),
+      calc(19px * -10) 14px 0 0 var(--line-color),
+      calc(19px * -10) 13px 0 0 var(--frame-bg),
+      calc(19px * -10) 12px 0 0 var(--line-color),
+      calc(19px * -10) 11px 0 0 var(--frame-bg),
+      calc(19px * -10) 10px 0 0 var(--line-color),
+      calc(19px * -10) 9px 0 0 var(--frame-bg),
+      calc(19px * -10) 8px 0 0 var(--line-color),
+      calc(19px * -10) 7px 0 0 var(--frame-bg),
+      calc(19px * -10) 6px 0 0 var(--line-color),
+      calc(19px * -10) 5px 0 0 var(--frame-bg),
+      calc(19px * -10) 4px 0 0 var(--line-color),
+      calc((19px * -11) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -11) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -11) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -11) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -11) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -11) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -11) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -11) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -11) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -11) 21px 0 0 var(--frame-bg),
+      calc(19px * -11) 20px 0 0 var(--line-color),
+      calc(19px * -11) 19px 0 0 var(--frame-bg),
+      calc(19px * -11) 18px 0 0 var(--line-color),
+      calc(19px * -11) 17px 0 0 var(--frame-bg),
+      calc(19px * -11) 16px 0 0 var(--line-color),
+      calc(19px * -11) 15px 0 0 var(--frame-bg),
+      calc(19px * -11) 14px 0 0 var(--line-color),
+      calc(19px * -11) 13px 0 0 var(--frame-bg),
+      calc(19px * -11) 12px 0 0 var(--line-color),
+      calc(19px * -11) 11px 0 0 var(--frame-bg),
+      calc(19px * -11) 10px 0 0 var(--line-color),
+      calc(19px * -11) 9px 0 0 var(--frame-bg),
+      calc(19px * -11) 8px 0 0 var(--line-color),
+      calc(19px * -11) 7px 0 0 var(--frame-bg),
+      calc(19px * -11) 6px 0 0 var(--line-color),
+      calc(19px * -11) 5px 0 0 var(--frame-bg),
+      calc(19px * -11) 4px 0 0 var(--line-color),
+      calc((19px * -12) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -12) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -12) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -12) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -12) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -12) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -12) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -12) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -12) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -12) 21px 0 0 var(--frame-bg),
+      calc(19px * -12) 20px 0 0 var(--line-color),
+      calc(19px * -12) 19px 0 0 var(--frame-bg),
+      calc(19px * -12) 18px 0 0 var(--line-color),
+      calc(19px * -12) 17px 0 0 var(--frame-bg),
+      calc(19px * -12) 16px 0 0 var(--line-color),
+      calc(19px * -12) 15px 0 0 var(--frame-bg),
+      calc(19px * -12) 14px 0 0 var(--line-color),
+      calc(19px * -12) 13px 0 0 var(--frame-bg),
+      calc(19px * -12) 12px 0 0 var(--line-color),
+      calc(19px * -12) 11px 0 0 var(--frame-bg),
+      calc(19px * -12) 10px 0 0 var(--line-color),
+      calc(19px * -12) 9px 0 0 var(--frame-bg),
+      calc(19px * -12) 8px 0 0 var(--line-color),
+      calc(19px * -12) 7px 0 0 var(--frame-bg),
+      calc(19px * -12) 6px 0 0 var(--line-color),
+      calc(19px * -12) 5px 0 0 var(--frame-bg),
+      calc(19px * -12) 4px 0 0 var(--line-color),
+      calc((19px * -13) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -13) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -13) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -13) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -13) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -13) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -13) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -13) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -13) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -13) 21px 0 0 var(--frame-bg),
+      calc(19px * -13) 20px 0 0 var(--line-color),
+      calc(19px * -13) 19px 0 0 var(--frame-bg),
+      calc(19px * -13) 18px 0 0 var(--line-color),
+      calc(19px * -13) 17px 0 0 var(--frame-bg),
+      calc(19px * -13) 16px 0 0 var(--line-color),
+      calc(19px * -13) 15px 0 0 var(--frame-bg),
+      calc(19px * -13) 14px 0 0 var(--line-color),
+      calc(19px * -13) 13px 0 0 var(--frame-bg),
+      calc(19px * -13) 12px 0 0 var(--line-color),
+      calc(19px * -13) 11px 0 0 var(--frame-bg),
+      calc(19px * -13) 10px 0 0 var(--line-color),
+      calc(19px * -13) 9px 0 0 var(--frame-bg),
+      calc(19px * -13) 8px 0 0 var(--line-color),
+      calc(19px * -13) 7px 0 0 var(--frame-bg),
+      calc(19px * -13) 6px 0 0 var(--line-color),
+      calc(19px * -13) 5px 0 0 var(--frame-bg),
+      calc(19px * -13) 4px 0 0 var(--line-color),
+      calc((19px * -14) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -14) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -14) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -14) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -14) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -14) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -14) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -14) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -14) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -14) 21px 0 0 var(--frame-bg),
+      calc(19px * -14) 20px 0 0 var(--line-color),
+      calc(19px * -14) 19px 0 0 var(--frame-bg),
+      calc(19px * -14) 18px 0 0 var(--line-color),
+      calc(19px * -14) 17px 0 0 var(--frame-bg),
+      calc(19px * -14) 16px 0 0 var(--line-color),
+      calc(19px * -14) 15px 0 0 var(--frame-bg),
+      calc(19px * -14) 14px 0 0 var(--line-color),
+      calc(19px * -14) 13px 0 0 var(--frame-bg),
+      calc(19px * -14) 12px 0 0 var(--line-color),
+      calc(19px * -14) 11px 0 0 var(--frame-bg),
+      calc(19px * -14) 10px 0 0 var(--line-color),
+      calc(19px * -14) 9px 0 0 var(--frame-bg),
+      calc(19px * -14) 8px 0 0 var(--line-color),
+      calc(19px * -14) 7px 0 0 var(--frame-bg),
+      calc(19px * -14) 6px 0 0 var(--line-color),
+      calc(19px * -14) 5px 0 0 var(--frame-bg),
+      calc(19px * -14) 4px 0 0 var(--line-color),
+      calc((19px * -15) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -15) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -15) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -15) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -15) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -15) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -15) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -15) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -15) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -15) 21px 0 0 var(--frame-bg),
+      calc(19px * -15) 20px 0 0 var(--line-color),
+      calc(19px * -15) 19px 0 0 var(--frame-bg),
+      calc(19px * -15) 18px 0 0 var(--line-color),
+      calc(19px * -15) 17px 0 0 var(--frame-bg),
+      calc(19px * -15) 16px 0 0 var(--line-color),
+      calc(19px * -15) 15px 0 0 var(--frame-bg),
+      calc(19px * -15) 14px 0 0 var(--line-color),
+      calc(19px * -15) 13px 0 0 var(--frame-bg),
+      calc(19px * -15) 12px 0 0 var(--line-color),
+      calc(19px * -15) 11px 0 0 var(--frame-bg),
+      calc(19px * -15) 10px 0 0 var(--line-color),
+      calc(19px * -15) 9px 0 0 var(--frame-bg),
+      calc(19px * -15) 8px 0 0 var(--line-color),
+      calc(19px * -15) 7px 0 0 var(--frame-bg),
+      calc(19px * -15) 6px 0 0 var(--line-color),
+      calc(19px * -15) 5px 0 0 var(--frame-bg),
+      calc(19px * -15) 4px 0 0 var(--line-color),
+      calc((19px * -16) + 1px) 4px 0 0 var(--frame-bg),
+      calc((19px * -16) + 1px) 6px 0 0 var(--frame-bg),
+      calc((19px * -16) + 1px) 8px 0 0 var(--frame-bg),
+      calc((19px * -16) + 1px) 10px 0 0 var(--frame-bg),
+      calc((19px * -16) + 1px) 12px 0 0 var(--frame-bg),
+      calc((19px * -16) + 1px) 14px 0 0 var(--frame-bg),
+      calc((19px * -16) + 1px) 16px 0 0 var(--frame-bg),
+      calc((19px * -16) + 1px) 18px 0 0 var(--frame-bg),
+      calc((19px * -16) + 1px) 20px 0 0 var(--frame-bg),
+      calc(19px * -16) 21px 0 0 var(--frame-bg),
+      calc(19px * -16) 20px 0 0 var(--line-color),
+      calc(19px * -16) 19px 0 0 var(--frame-bg),
+      calc(19px * -16) 18px 0 0 var(--line-color),
+      calc(19px * -16) 17px 0 0 var(--frame-bg),
+      calc(19px * -16) 16px 0 0 var(--line-color),
+      calc(19px * -16) 15px 0 0 var(--frame-bg),
+      calc(19px * -16) 14px 0 0 var(--line-color),
+      calc(19px * -16) 13px 0 0 var(--frame-bg),
+      calc(19px * -16) 12px 0 0 var(--line-color),
+      calc(19px * -16) 11px 0 0 var(--frame-bg),
+      calc(19px * -16) 10px 0 0 var(--line-color),
+      calc(19px * -16) 9px 0 0 var(--frame-bg),
+      calc(19px * -16) 8px 0 0 var(--line-color),
+      calc(19px * -16) 7px 0 0 var(--frame-bg),
+      calc(19px * -16) 6px 0 0 var(--line-color),
+      calc(19px * -16) 5px 0 0 var(--frame-bg),
+      calc(19px * -16) 4px 0 0 var(--line-color);
+
+    content: "";
+    background-color: transparent !important;
+    background-image: none !important;
+    height: 14px;
+    width: 11px;
+    border-left: 1px dotted;
+    border-bottom: 1px dotted;
+    border-color: var(--line-color);
+    position: absolute;
+    top: -6px;
+    left: -11px;
+    transform: translateZ(-9999px) !important;
+    z-index: -9999;
+    display: block !important;
+  }
+
+  .AnimatedTabList:has(> .Tab[data-lvl="1"])
+    > .Tab[data-lvl="0"]:first-child
+    .body:after,
+  .AnimatedTabList:has(> .Tab[data-lvl="0"] .child-count)
+    > .Tab[data-lvl="0"]:first-child
+    .body:after {
+    height: 1px !important;
+    top: 7px !important;
+    box-shadow: none !important;
+  }
+}
+
+.Tab .fav > .exp {
+  width: 9px !important;
+  height: 9px !important;
+  top: 4px !important;
+  left: -15px !important;
+  opacity: 1 !important;
+  background-color: var(--ThreeDFace);
+  border: 1px solid var(--ThreeDHighlight);
+}
+.Tab .fav > .exp > .exp-icon {
+  top: 0 !important;
+  left: 0 !important;
+  width: 7px !important;
+  height: 7px !important;
+  opacity: 1 !important;
+  background-color: var(--WindowText);
+  mask-image: var(--ImageListMinus);
+  mask-repeat: no-repeat;
+  mask-position: center;
+  -webkit-mask-image: var(--ImageListMinus);
+  -webkit-mask-repeat: no-repeat;
+  -webkit-mask-position: center;
+}
+.Tab[data-folded="true"] .fav > .exp > .exp-icon {
+  mask-image: var(--ImageListPlus) !important;
+  -webkit-mask-image: var(--ImageListPlus) !important;
+}
+.Tab .fav > .exp > .exp-icon > * {
+  display: none;
+}
+
+.Tab .fav > svg.fav-icon {
+  opacity: 1 !important;
+  background-image: var(--ImageFavicon);
+}
+.Tab .fav > svg.fav-icon > * {
+  display: none;
+}
+
+.central-box {
+  margin-top: 0 !important;
+}
+
+.Tab[data-pin="false"] .audio {
+  left: 19px !important;
+  width: 16px !important;
+}
+
+* {
+  transition: none !important;
+  animation: none !important;
+}
+
+.BottomBar {
+  display: none;
+}

chrome/msfx-expose_legacy_colors.uc.js

@@ -0,0 +1,62 @@
+(() => {
+  const colorKeys = [
+    "ActiveBorder",
+    "ActiveCaption",
+    "AppWorkspace",
+    "Background",
+    "ButtonFace",
+    "ButtonHighlight",
+    "ButtonShadow",
+    "ButtonText",
+    "CaptionText",
+    "GrayText",
+    "Highlight",
+    "HighlightText",
+    "InactiveBorder",
+    "InactiveCaption",
+    "InactiveCaptionText",
+    "InfoBackground",
+    "InfoText",
+    "Menu",
+    "MenuText",
+    "Scrollbar",
+    "ThreeDDarkShadow",
+    "ThreeDFace",
+    "ThreeDHighlight",
+    "ThreeDLightShadow",
+    "ThreeDShadow",
+    "Window",
+    "WindowFrame",
+    "WindowText",
+  ];
+  const colors = (() => {
+    const colors = {};
+
+    const elem = document.createElement("div");
+    document.body.appendChild(elem);
+
+    for (const key of colorKeys) {
+      elem.style.color = key;
+      colors[key] = window.getComputedStyle(elem).color;
+    }
+
+    document.body.removeChild(elem);
+
+    return colors;
+  })();
+
+  const css = `:root {
+    ${Object.entries(colors)
+      .map(([key, val]) => `--${key}: ${val};`)
+      .join("\n    ")}
+  }`;
+
+  const sss = Cc["@mozilla.org/content/style-sheet-service;1"].getService(
+    Ci.nsIStyleSheetService,
+  );
+  const uri = Services.io.newURI(
+    "data:text/css;charset=UTF=8," + encodeURIComponent(css),
+  );
+
+  sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);
+})();

chrome/msfx/msfx.css

@@ -1451,9 +1451,17 @@ hbox[anonid="findbar-textbox-wrapper"]::after {
 }
 
 #sidebar-box {
-  margin-right: 4px;
+  margin-right: 3px;
-  appearance: groupbox !important;
   background-color: ThreeDFace !important;
+  padding: 2px;
+  box-shadow: inset -1px -1px 0 0 ThreeDHighlight,
+    inset -2px -2px 0 0 ThreeDShadow, inset 1px 1px 0 0 ThreeDShadow,
+    inset 2px 2px 0 0 ThreeDHighlight;
+
+  &[positionend="true"] {
+    margin-right: 0 !important;
+    margin-left: 3px !important;
+  }
 }
 
 #historyTree,
@@ -1464,14 +1472,14 @@ hbox[anonid="findbar-textbox-wrapper"]::after {
 
 treecol,
 treecolpicker {
-  border: 0 !important;
+  border: none !important;
 }
 
 #sidebar-search-container,
 #sidebar-header {
   font: Menu !important;
-  box-shadow: inset 0 -1px ThreeDShadow !important;
+  box-shadow: inset 0 -1px 0 0 ThreeDHighlight, inset 0 -2px 0 0 ThreeDShadow !important;
-  border-bottom: 1px solid ThreeDHighlight !important;
+  border: none !important;
 }
 
 #sidebar-icon {
@@ -1481,7 +1489,10 @@ treecolpicker {
 }
 
 #sidebar-header {
-  padding: 1px !important;
+  height: 22px !important;
+  padding-top: 0px !important;
+  padding-left: 1px !important;
+  padding-right: 2px !important;
   padding-bottom: 2px !important;
 }
 
@@ -1493,6 +1504,7 @@ treecolpicker {
   padding: 0 !important;
   list-style-image: none !important;
   border-radius: 0 !important;
+  margin-top: -3px !important;
 }
 
 #sidebar-close .toolbarbutton-icon {
@@ -1915,12 +1927,14 @@ toolbar .toolbarbutton-1 > .toolbarbutton-icon {
   top: 0px;
   position: absolute !important;
   right: 0 !important;
+  -moz-context-properties: fill, fill-opacity;
+  fill: currentColor;
   background-color: -moz-Dialog !important;
   box-shadow: inset -1px -1px 0 ThreeDDarkShadow,
     inset 1px 1px 0 ThreeDLightShadow, inset -2px -2px 0 ThreeDShadow,
     inset 2px 2px 0 ThreeDHighlight !important;
   background-repeat: no-repeat !important;
-  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTUiIHdpZHRoPSIxNSIgdmlld0JveD0iMCAwIDE1IDE1Ij4KICA8cmVjdCBoZWlnaHQ9IjEiIHdpZHRoPSI3IiB4PSIzIiB5PSI1IiBmaWxsPSJDYW52YXNUZXh0Ii8+PHJlY3QgaGVpZ2h0PSIxIiB3aWR0aD0iNSIgeT0iNiIgeD0iNCIgZmlsbD0iQ2FudmFzVGV4dCIvPjxyZWN0IGhlaWdodD0iMSIgd2lkdGg9IjMiIHg9IjUiIHk9IjciIGZpbGw9IkNhbnZhc1RleHQiLz48cmVjdCB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4PSI2IiB5PSI4IiBmaWxsPSJDYW52YXNUZXh0Ii8+CiAgCiAgCjwvc3ZnPg==") !important;
+  background-image: url("data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjE1IiB3aWR0aD0iMTUiIHZlcnNpb249IjEuMSIgZmlsbD0iY29udGV4dC1maWxsIiBmaWxsLW9wYWNpdHk9ImNvbnRleHQtZmlsbC1vcGFjaXR5IiB2aWV3Qm94PSIwIDAgMTUgMTUiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3QgaGVpZ2h0PSIxIiB3aWR0aD0iNyIgeD0iMyIgeT0iNSIvPjxyZWN0IGhlaWdodD0iMSIgd2lkdGg9IjUiIHk9IjYiIHg9IjQiLz48cmVjdCBoZWlnaHQ9IjEiIHdpZHRoPSIzIiB4PSI1IiB5PSI3Ii8+PHJlY3Qgd2lkdGg9IjEiIGhlaWdodD0iMSIgeD0iNiIgeT0iOCIvPjwvc3ZnPg==") !important;
   background-position: center center !important;
   pointer-events: none;
 }
@@ -2407,18 +2421,29 @@ menupopup > menuitem,
   padding-block: 0 !important;
   padding-inline-start: 20px !important;
 
-  &:has(> .menu-iconic-left[checked="true"]),
   &.menuitem-with-favicon,
   &.privatetab-icon,
   &.context-menu-add-engine,
+  &.webextension-menuitem,
   &[id="userChromejs_openChromeFolder"],
   &[id="userChromejs_restartApp"],
   &[data-usercontextid]:not([data-usercontextid="0"]),
+  &[id*="_-menuitem-"][image],
   &[image^="moz-extension://"],
   &[image^="jar:file://"],
   &[image="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABaUlEQVQ4y6WTW0sCQRiG/SEpVBDUVVfphbAEhWAlqYhrLWUlER2IIgrqYkEp6SBmudWiFf0SiSCwpAI7bJnprq6H/sTbGhJiEyt28fAN7zfz8DHDaABo/oPqBpovX7j4T1gOS6dNCcYiZbhOSrCHi2hugqNCwskVYNmXbxoSuPkCN3NWhCdahLLGKCfDcSBjOJiHeTeHPr8EyifCwGb9RMF0RIaHl+E+zoMJ5+AM5WALSBjaEWHayqLXm4GR/YB+Iw2iYIKTMB6WwIRE0EER9r0s+r1pGNZT6F55ReeigPb5F7TOPpMFTDCDkUAGA753GFYFdC08QedJEvkR2DbfzuntFBz+1K2ZFdCz9Ii2qQfo3Pck2MoZpVI/AqtXQAXjchIdk3fQMok/Ib6CaS0Z1c8pdlc8pqXjUOF7AqVSxDvQOq7RKERBi/UKdbDVnK3vkQWWS9Si1vstGIyxCqiBquZUXc429BfU+AL9Tqy8Q2Za8AAAAABJRU5ErkJggg=="] {
     padding-inline-start: 0px !important;
+
+    & > .menu-iconic-left {
+      width: 16px !important;
+      margin-inline-start: 2px !important;
+      margin-inline-end: 2px !important;
     }
+  }
+  &:has(> .menu-iconic-left[checked="true"]) {
+    padding-inline-start: 0px !important;
+  }
+
   & > .menu-iconic-left {
     margin-inline-end: 0 !important;
     &[checked="true"] {
@@ -2428,28 +2453,13 @@ menupopup > menuitem,
       fill-opacity: 1 !important;
     }
   }
-  &.menuitem-with-favicon,
-  &.privatetab-icon,
-  &.context-menu-add-engine,
-  &[id="userChromejs_openChromeFolder"],
-  &[id="userChromejs_restartApp"],
-  &[data-usercontextid]:not([data-usercontextid="0"]),
-  &[image^="moz-extension://"],
-  &[image^="jar:file://"],
-  &[image="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAABaUlEQVQ4y6WTW0sCQRiG/SEpVBDUVVfphbAEhWAlqYhrLWUlER2IIgrqYkEp6SBmudWiFf0SiSCwpAI7bJnprq6H/sTbGhJiEyt28fAN7zfz8DHDaABo/oPqBpovX7j4T1gOS6dNCcYiZbhOSrCHi2hugqNCwskVYNmXbxoSuPkCN3NWhCdahLLGKCfDcSBjOJiHeTeHPr8EyifCwGb9RMF0RIaHl+E+zoMJ5+AM5WALSBjaEWHayqLXm4GR/YB+Iw2iYIKTMB6WwIRE0EER9r0s+r1pGNZT6F55ReeigPb5F7TOPpMFTDCDkUAGA753GFYFdC08QedJEvkR2DbfzuntFBz+1K2ZFdCz9Ii2qQfo3Pck2MoZpVI/AqtXQAXjchIdk3fQMok/Ib6CaS0Z1c8pdlc8pqXjUOF7AqVSxDvQOq7RKERBi/UKdbDVnK3vkQWWS9Si1vstGIyxCqiBquZUXc429BfU+AL9Tqy8Q2Za8AAAAABJRU5ErkJggg=="] {
-    & > .menu-iconic-left {
-      width: 16px !important;
-      margin-inline-start: 2px !important;
-      margin-inline-end: 2px !important;
-    }
-  }
   &[_moz-menuactive] {
     background-color: Highlight !important;
     color: HighlightText !important;
   }
   & > .menu-right {
     margin-inline-end: 0 !important;
-    list-style-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE2IDE2Ij48cmVjdCB3aWR0aD0iMSIgaGVpZ2h0PSI3IiB5PSIzIiB4PSI2IiBmaWxsPSJjdXJyZW50Q29sb3IiLz48cmVjdCB3aWR0aD0iMSIgaGVpZ2h0PSI1IiB5PSI0IiB4PSI3IiBmaWxsPSJjdXJyZW50Q29sb3IiLz48cmVjdCB3aWR0aD0iMSIgaGVpZ2h0PSIzIiB5PSI1IiB4PSI4IiBmaWxsPSJjdXJyZW50Q29sb3IiLz48cmVjdCB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB5PSI2IiB4PSI5IiBmaWxsPSJjdXJyZW50Q29sb3IiLz48L3N2Zz4=") !important;
+    list-style-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZlcnNpb249IjEuMSIgZmlsbD0iY29udGV4dC1maWxsIiBmaWxsLW9wYWNpdHk9ImNvbnRleHQtZmlsbC1vcGFjaXR5IiB2aWV3Qm94PSIwIDAgMTYgMTYiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHJlY3Qgd2lkdGg9IjEiIGhlaWdodD0iNyIgeT0iMyIgeD0iNiIvPjxyZWN0IHdpZHRoPSIxIiBoZWlnaHQ9IjUiIHk9IjQiIHg9IjciLz48cmVjdCB3aWR0aD0iMSIgaGVpZ2h0PSIzIiB5PSI1IiB4PSI4Ii8+PHJlY3Qgd2lkdGg9IjEiIGhlaWdodD0iMSIgeT0iNiIgeD0iOSIvPjwvc3ZnPg==") !important;
     fill-opacity: 1 !important;
   }
   &[disabled="true"],
@@ -2503,3 +2513,16 @@ tooltip {
   list-style-image: url("go.png") !important;
   width: 18px !important;
 }
+
+.menupopup-arrowscrollbox[scrolledtoend="true"][scrolledtostart="true"] {
+  padding: 0 !important;
+}
+
+.menu-accel,
+.menu-iconic-accel {
+  margin-inline: 24px 21px !important;
+}
+
+.bookmark-item > menupopup > .openintabs-menuitem > .menu-text {
+  line-height: 18px !important;
+}