diff --git a/__tests__/one_liner.test.scss b/__tests__/one_liner.test.scss
index 2cd0a92..ad96749 100644
--- a/__tests__/one_liner.test.scss
+++ b/__tests__/one_liner.test.scss
@@ -47,6 +47,28 @@
 }
 
 @include test-module("One Liner for Responsive [mix]") {
+  @include test("Tabs on bottom") {
+    @include assert {
+      @include output {
+        @include one_liner.OneLinerOnBottom {
+          @include example;
+        }
+      }
+      @include expect {
+        @supports not -moz-bool-pref("userChrome.tab.one_liner") {
+          @include example;
+        }
+        @supports -moz-bool-pref("userChrome.tab.one_liner") {
+          @supports -moz-bool-pref("userChrome.tab.one_liner.responsive") {
+            @media screen and (max-width: 1100px) {
+              @include example;
+            }
+          }
+        }
+      }
+    }
+  }
+
   @include test("Tab bar") {
     @include assert {
       @include output {
diff --git a/css/leptonChrome.css b/css/leptonChrome.css
index ea976ad..d02fcc8 100644
--- a/css/leptonChrome.css
+++ b/css/leptonChrome.css
@@ -3865,132 +3865,268 @@
   }
 }
 @supports -moz-bool-pref("userChrome.tab.on_bottom") {
-  /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
-  See the above repository for updates as well as full license text. */
-  /*= Tabbar - Move to bottom ==================================================*/
-  #titlebar {
-    order: 2;
-    /* When userChrome.fullscreen.overlap */
-    -moz-box-ordinal-group: 2;
-    --tabs-navbar-shadow-size: 0px;
-  }
+  @supports not -moz-bool-pref("userChrome.tab.one_liner") {
+    /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
+    See the above repository for updates as well as full license text. */
+    /*= Tabbar - Move to bottom ==================================================*/
+    #titlebar {
+      order: 2;
+      /* When userChrome.fullscreen.overlap */
+      -moz-box-ordinal-group: 2;
+      --tabs-navbar-shadow-size: 0px;
+    }
 
-  #tab-notification-deck {
-    order: 2;
-    /* When userChrome.fullscreen.overlap */
-    -moz-box-ordinal-group: 2;
-  }
-
-  #TabsToolbar .titlebar-spacer {
-    display: none;
-  }
-
-  #TabsToolbar-customization-target > .toolbarbutton-1:last-child {
-    padding-inline-end: var(--toolbar-start-end-padding, 8px);
-  }
-
-  @supports -moz-bool-pref("userChrome.tab.on_bottom.above_bookmark") {
-    #PersonalToolbar {
+    #tab-notification-deck {
       order: 2;
       /* When userChrome.fullscreen.overlap */
       -moz-box-ordinal-group: 2;
     }
-  }
-  @supports not -moz-bool-pref("userChrome.tab.on_bottom.above_bookmark") {
-    @supports -moz-bool-pref("userChrome.tab.connect_to_window") {
-      @supports -moz-bool-pref("userChrome.tab.color_like_toolbar") {
-        #navigator-toolbox {
-          border-bottom-color: var(--toolbar-bgcolor) !important;
-          /* Original: 1px solid var(--chrome-content-separator-color); */
+
+    #TabsToolbar .titlebar-spacer {
+      display: none;
+    }
+
+    #TabsToolbar-customization-target > .toolbarbutton-1:last-child {
+      padding-inline-end: var(--toolbar-start-end-padding, 8px);
+    }
+
+    @supports -moz-bool-pref("userChrome.tab.on_bottom.above_bookmark") {
+      #PersonalToolbar {
+        order: 2;
+        /* When userChrome.fullscreen.overlap */
+        -moz-box-ordinal-group: 2;
+      }
+    }
+    @supports not -moz-bool-pref("userChrome.tab.on_bottom.above_bookmark") {
+      @supports -moz-bool-pref("userChrome.tab.connect_to_window") {
+        @supports -moz-bool-pref("userChrome.tab.color_like_toolbar") {
+          #navigator-toolbox {
+            border-bottom-color: var(--toolbar-bgcolor) !important;
+            /* Original: 1px solid var(--chrome-content-separator-color); */
+          }
         }
       }
     }
+    /*= Menubar - Always on top ==================================================*/
+    @supports -moz-bool-pref("userChrome.tab.on_bottom.menubar_on_top") {
+      /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0
+      See the above repository for updates as well as full license text. */
+      :root {
+        /* height if native titlebar is enabled, assumes empty menubar */
+        --uc-menubar-height: 20px;
+        --uc-menubar-padding: 1px;
+        /* FF's menubar padding */
+        --uc-menubar-container-height: calc(var(--uc-menubar-height) - (2 * var(--uc-menubar-padding)));
+      }
+
+      :root[tabsintitlebar] {
+        /* height when native titlebar is disabled, more roomy so can fit buttons etc. */
+        --uc-menubar-height: 30px;
+      }
+
+      /* Menubar on top patch - use with tabs_on_bottom.css */
+      /* Only really useful if menubar is ALWAYS visible */
+      :root:not([sizemode="fullscreen"]) {
+        --uc-window-control-width: 0px !important;
+      }
+
+      /* Since menubar is statically at top, remove fake drag-space that might be set by window_control_placeholder_support.css */
+      :root:not([sizemode="fullscreen"]) #nav-bar {
+        border-inline-width: 0;
+      }
+
+      #navigator-toolbox {
+        -moz-window-dragging: drag;
+      }
+
+      :root[sizemode="fullscreen"] #navigator-toolbox {
+        padding-top: 0px !important;
+      }
+
+      #toolbar-menubar {
+        position: fixed;
+        display: flex;
+        top: var(--uc-titlebar-padding);
+        height: var(--uc-menubar-height);
+        width: 100%;
+        overflow: hidden;
+      }
+
+      :root[tabsintitlebar] #toolbar-menubar[autohide="true"]:not([inactive="true"]) {
+        height: var(--uc-menubar-height) !important;
+        /* calc(var(--tab-min-height) + 2 * var(--tab-block-margin)) */
+      }
+
+      #toolbar-menubar > .titlebar-buttonbox-container {
+        height: 100%;
+        order: 100;
+      }
+
+      #toolbar-menubar > [flex] {
+        flex-grow: 100;
+      }
+
+      #toolbar-menubar > spacer[flex] {
+        order: 99;
+        flex-grow: 1;
+        min-width: var(--uc-window-drag-space-post);
+      }
+
+      #toolbar-menubar .toolbarbutton-1 {
+        --toolbarbutton-inner-padding: 3px;
+      }
+
+      #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
+      #TabsToolbar > .titlebar-buttonbox-container {
+        height: var(--uc-menubar-container-height);
+      }
+
+      :root:not([chromehidden~="menubar"], [sizemode="fullscreen"])
+        #toolbar-menubar:not([autohide="true"])
+        + #TabsToolbar
+        > .titlebar-buttonbox-container {
+        visibility: collapse !important;
+      }
+
+      :root:not([chromehidden~="menubar"]):not([sizemode="fullscreen"])
+        #toolbar-menubar:not([autohide="true"])
+        .titlebar-buttonbox-container {
+        visibility: visible;
+      }
+    }
   }
-  /*= Menubar - Always on top ==================================================*/
-  @supports -moz-bool-pref("userChrome.tab.on_bottom.menubar_on_top") {
-    /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0
-    See the above repository for updates as well as full license text. */
-    :root {
-      /* height if native titlebar is enabled, assumes empty menubar */
-      --uc-menubar-height: 20px;
-      --uc-menubar-padding: 1px;
-      /* FF's menubar padding */
-      --uc-menubar-container-height: calc(var(--uc-menubar-height) - (2 * var(--uc-menubar-padding)));
-    }
+  @supports -moz-bool-pref("userChrome.tab.one_liner") {
+    @supports -moz-bool-pref("userChrome.tab.one_liner.responsive") {
+      @media screen and (max-width: 1100px) {
+        /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
+        See the above repository for updates as well as full license text. */
+        /*= Tabbar - Move to bottom ==================================================*/
+        #titlebar {
+          order: 2;
+          /* When userChrome.fullscreen.overlap */
+          -moz-box-ordinal-group: 2;
+          --tabs-navbar-shadow-size: 0px;
+        }
 
-    :root[tabsintitlebar] {
-      /* height when native titlebar is disabled, more roomy so can fit buttons etc. */
-      --uc-menubar-height: 30px;
-    }
+        #tab-notification-deck {
+          order: 2;
+          /* When userChrome.fullscreen.overlap */
+          -moz-box-ordinal-group: 2;
+        }
 
-    /* Menubar on top patch - use with tabs_on_bottom.css */
-    /* Only really useful if menubar is ALWAYS visible */
-    :root:not([sizemode="fullscreen"]) {
-      --uc-window-control-width: 0px !important;
-    }
+        #TabsToolbar .titlebar-spacer {
+          display: none;
+        }
 
-    /* Since menubar is statically at top, remove fake drag-space that might be set by window_control_placeholder_support.css */
-    :root:not([sizemode="fullscreen"]) #nav-bar {
-      border-inline-width: 0;
-    }
+        #TabsToolbar-customization-target > .toolbarbutton-1:last-child {
+          padding-inline-end: var(--toolbar-start-end-padding, 8px);
+        }
 
-    #navigator-toolbox {
-      -moz-window-dragging: drag;
-    }
+        @supports -moz-bool-pref("userChrome.tab.on_bottom.above_bookmark") {
+          #PersonalToolbar {
+            order: 2;
+            /* When userChrome.fullscreen.overlap */
+            -moz-box-ordinal-group: 2;
+          }
+        }
+        @supports not -moz-bool-pref("userChrome.tab.on_bottom.above_bookmark") {
+          @supports -moz-bool-pref("userChrome.tab.connect_to_window") {
+            @supports -moz-bool-pref("userChrome.tab.color_like_toolbar") {
+              #navigator-toolbox {
+                border-bottom-color: var(--toolbar-bgcolor) !important;
+                /* Original: 1px solid var(--chrome-content-separator-color); */
+              }
+            }
+          }
+        }
+        /*= Menubar - Always on top ==================================================*/
+        @supports -moz-bool-pref("userChrome.tab.on_bottom.menubar_on_top") {
+          /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0
+          See the above repository for updates as well as full license text. */
+          :root {
+            /* height if native titlebar is enabled, assumes empty menubar */
+            --uc-menubar-height: 20px;
+            --uc-menubar-padding: 1px;
+            /* FF's menubar padding */
+            --uc-menubar-container-height: calc(var(--uc-menubar-height) - (2 * var(--uc-menubar-padding)));
+          }
 
-    :root[sizemode="fullscreen"] #navigator-toolbox {
-      padding-top: 0px !important;
-    }
+          :root[tabsintitlebar] {
+            /* height when native titlebar is disabled, more roomy so can fit buttons etc. */
+            --uc-menubar-height: 30px;
+          }
 
-    #toolbar-menubar {
-      position: fixed;
-      display: flex;
-      top: var(--uc-titlebar-padding);
-      height: var(--uc-menubar-height);
-      width: 100%;
-      overflow: hidden;
-    }
+          /* Menubar on top patch - use with tabs_on_bottom.css */
+          /* Only really useful if menubar is ALWAYS visible */
+          :root:not([sizemode="fullscreen"]) {
+            --uc-window-control-width: 0px !important;
+          }
 
-    :root[tabsintitlebar] #toolbar-menubar[autohide="true"]:not([inactive="true"]) {
-      height: var(--uc-menubar-height) !important;
-      /* calc(var(--tab-min-height) + 2 * var(--tab-block-margin)) */
-    }
+          /* Since menubar is statically at top, remove fake drag-space that might be set by window_control_placeholder_support.css */
+          :root:not([sizemode="fullscreen"]) #nav-bar {
+            border-inline-width: 0;
+          }
 
-    #toolbar-menubar > .titlebar-buttonbox-container {
-      height: 100%;
-      order: 100;
-    }
+          #navigator-toolbox {
+            -moz-window-dragging: drag;
+          }
 
-    #toolbar-menubar > [flex] {
-      flex-grow: 100;
-    }
+          :root[sizemode="fullscreen"] #navigator-toolbox {
+            padding-top: 0px !important;
+          }
 
-    #toolbar-menubar > spacer[flex] {
-      order: 99;
-      flex-grow: 1;
-      min-width: var(--uc-window-drag-space-post);
-    }
+          #toolbar-menubar {
+            position: fixed;
+            display: flex;
+            top: var(--uc-titlebar-padding);
+            height: var(--uc-menubar-height);
+            width: 100%;
+            overflow: hidden;
+          }
 
-    #toolbar-menubar .toolbarbutton-1 {
-      --toolbarbutton-inner-padding: 3px;
-    }
+          :root[tabsintitlebar] #toolbar-menubar[autohide="true"]:not([inactive="true"]) {
+            height: var(--uc-menubar-height) !important;
+            /* calc(var(--tab-min-height) + 2 * var(--tab-block-margin)) */
+          }
 
-    #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
-    #TabsToolbar > .titlebar-buttonbox-container {
-      height: var(--uc-menubar-container-height);
-    }
+          #toolbar-menubar > .titlebar-buttonbox-container {
+            height: 100%;
+            order: 100;
+          }
 
-    :root:not([chromehidden~="menubar"], [sizemode="fullscreen"])
-      #toolbar-menubar:not([autohide="true"])
-      + #TabsToolbar
-      > .titlebar-buttonbox-container {
-      visibility: collapse !important;
-    }
+          #toolbar-menubar > [flex] {
+            flex-grow: 100;
+          }
 
-    :root:not([chromehidden~="menubar"]):not([sizemode="fullscreen"])
-      #toolbar-menubar:not([autohide="true"])
-      .titlebar-buttonbox-container {
-      visibility: visible;
+          #toolbar-menubar > spacer[flex] {
+            order: 99;
+            flex-grow: 1;
+            min-width: var(--uc-window-drag-space-post);
+          }
+
+          #toolbar-menubar .toolbarbutton-1 {
+            --toolbarbutton-inner-padding: 3px;
+          }
+
+          #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
+          #TabsToolbar > .titlebar-buttonbox-container {
+            height: var(--uc-menubar-container-height);
+          }
+
+          :root:not([chromehidden~="menubar"], [sizemode="fullscreen"])
+            #toolbar-menubar:not([autohide="true"])
+            + #TabsToolbar
+            > .titlebar-buttonbox-container {
+            visibility: collapse !important;
+          }
+
+          :root:not([chromehidden~="menubar"]):not([sizemode="fullscreen"])
+            #toolbar-menubar:not([autohide="true"])
+            .titlebar-buttonbox-container {
+            visibility: visible;
+          }
+        }
+      }
     }
   }
 }
@@ -4125,8 +4261,10 @@
 }
 /*= Tab Bar - Shared Layout ==================================================*/
 @supports -moz-bool-pref("userChrome.tab.on_bottom") or -moz-bool-pref("userChrome.tab.one_liner") {
-  @supports not -moz-bool-pref("userChrome.tab.one_liner.responsive") {
-    @supports -moz-bool-pref("userChrome.tab.on_bottom") or -moz-bool-pref("userChrome.tab.one_liner.tabbar_first") {
+  @supports -moz-bool-pref("userChrome.tab.on_bottom") or -moz-bool-pref("userChrome.tab.one_liner.tabbar_first") {
+  }
+  @supports not -moz-bool-pref("userChrome.tab.one_liner") {
+    @supports -moz-bool-pref("userChrome.tab.on_bottom") {
       /*= Windows Control - Move to toolbar ========================================*/
       /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
       See the above repository for updates as well as full license text. */
@@ -4216,86 +4354,10 @@
         visibility: hidden;
       }
     }
-    /*= Navbar - Padding for window controls =====================================*/
-    /* Customized https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/window_control_placeholder_support.css */
-    :root {
-      --uc-window-control-width: 0px;
-      /* Same as .titlebar-buttonbox-container      -  Space reserved for window controls */
-      --uc-window-drag-space-pre: 0px;
-      /* Same as .titlebar-spacer[type="pre-tabs"]  - Extra space reserved on both sides of the nav-bar to be able to drag the window */
-      --uc-window-drag-space-post: 0px;
-      /* Same as .titlebar-spacer[type="post-tabs"] */
-    }
-
-    :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-      --uc-window-control-width: 84px;
-      /* 84px is default value of linux */
-      --uc-window-drag-space-pre: var(--uc-title-pre-spacer, 40px);
-      --uc-window-drag-space-post: var(--uc-title-post-spacer, 40px);
-    }
-
-    :root:is([tabsintitlebar][sizemode="maximized"], [sizemode="fullscreen"]) {
-      --uc-window-drag-space-pre: 0px;
-      /* Remove pre space */
-    }
-
-    @supports -moz-bool-pref("userChrome.tab.one_liner") {
-      @supports not -moz-bool-pref("userChrome.tab.one_liner.tabbar_first") {
-        :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-          /* Don't need window control */
-          --uc-window-control-width: 0px;
-          --uc-window-drag-space-post: 0px;
-        }
-      }
-      @supports -moz-bool-pref("userChrome.tab.one_liner.tabbar_first") {
-        :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-          /* Don't need pre spacer */
-          --uc-window-drag-space-pre: 0px;
-        }
-      }
-    }
-    #nav-bar {
-      border-inline-start-width: var(--uc-window-drag-space-pre);
-      border-inline-end-width: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post));
-      border-inline-style: solid !important;
-      border-inline-color: var(--toolbar-bgcolor);
-    }
-
-    /* Windows */
-    @media (-moz-os-version: windows-win7),
-      (-moz-platform: windows-win7),
-      (-moz-os-version: windows-win8),
-      (-moz-platform: windows-win8) {
-      :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-        --uc-window-control-width: 105px;
-      }
-    }
-    @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) {
-      :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-        --uc-window-control-width: 138px;
-      }
-    }
-    /* Use this pref to check Mac OS where window controls are on left */
-    /* This pref defaults to true on Mac and doesn't actually do anything on other platforms. So if your system has window controls on LEFT side you can set the pref to true */
-    @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
-      :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-        --uc-window-control-width: 72px;
-      }
-
-      :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar {
-        border-inline-start-width: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post));
-        border-inline-end-width: var(--uc-window-drag-space-pre);
-      }
-
-      :root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container:last-child,
-      :root[sizemode="fullscreen"] #window-controls {
-        right: unset;
-      }
-    }
   }
-  @supports -moz-bool-pref("userChrome.tab.one_liner.responsive") {
-    @media screen and (min-width: 1100px) {
-      @supports -moz-bool-pref("userChrome.tab.on_bottom") or -moz-bool-pref("userChrome.tab.one_liner.tabbar_first") {
+  @supports -moz-bool-pref("userChrome.tab.one_liner") {
+    @supports not -moz-bool-pref("userChrome.tab.one_liner.responsive") {
+      @supports -moz-bool-pref("userChrome.tab.one_liner.tabbar_first") {
         /*= Windows Control - Move to toolbar ========================================*/
         /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
         See the above repository for updates as well as full license text. */
@@ -4385,30 +4447,252 @@
           visibility: hidden;
         }
       }
-      /*= Navbar - Padding for window controls =====================================*/
-      /* Customized https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/window_control_placeholder_support.css */
-      :root {
-        --uc-window-control-width: 0px;
-        /* Same as .titlebar-buttonbox-container      -  Space reserved for window controls */
-        --uc-window-drag-space-pre: 0px;
-        /* Same as .titlebar-spacer[type="pre-tabs"]  - Extra space reserved on both sides of the nav-bar to be able to drag the window */
-        --uc-window-drag-space-post: 0px;
-        /* Same as .titlebar-spacer[type="post-tabs"] */
-      }
+    }
+    @supports -moz-bool-pref("userChrome.tab.one_liner.responsive") {
+      @supports -moz-bool-pref("userChrome.tab.on_bottom") {
+        @media screen and (max-width: 1100px) {
+          /*= Windows Control - Move to toolbar ========================================*/
+          /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
+          See the above repository for updates as well as full license text. */
+          :root {
+            --uc-titlebar-padding: 0px;
+          }
 
-      :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-        --uc-window-control-width: 84px;
-        /* 84px is default value of linux */
-        --uc-window-drag-space-pre: var(--uc-title-pre-spacer, 40px);
-        --uc-window-drag-space-post: var(--uc-title-post-spacer, 40px);
-      }
+          @media (-moz-os-version: windows-win7),
+            (-moz-platform: windows-win7),
+            (-moz-os-version: windows-win8),
+            (-moz-platform: windows-win8),
+            (-moz-os-version: windows-win10),
+            (-moz-platform: windows-win10) {
+            :root[sizemode="maximized"][tabsintitlebar] {
+              --uc-titlebar-padding: 8px;
+            }
+          }
+          #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
+          #TabsToolbar > .titlebar-buttonbox-container {
+            position: fixed;
+            display: block;
+            top: var(--uc-titlebar-padding);
+            right: 0;
+            height: 40px;
+            z-index: 1;
+          }
 
-      :root:is([tabsintitlebar][sizemode="maximized"], [sizemode="fullscreen"]) {
-        --uc-window-drag-space-pre: 0px;
-        /* Remove pre space */
-      }
+          /* where window controls are on left */
+          @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
+            :root {
+              --uc-titlebar-padding: 0px !important;
+            }
 
-      @supports -moz-bool-pref("userChrome.tab.one_liner") {
+            .titlebar-buttonbox-container {
+              left: 0;
+              right: unset !important;
+            }
+          }
+          #navigator-toolbox {
+            padding-top: calc(var(--uc-menubar-height, 0px) + var(--uc-titlebar-padding)) !important;
+          }
+
+          :root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container {
+            height: 32px;
+          }
+
+          #toolbar-menubar[inactive] > .titlebar-buttonbox-container {
+            opacity: 0;
+          }
+
+          .titlebar-buttonbox-container > .titlebar-buttonbox {
+            height: 100%;
+          }
+          @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
+            .titlebar-buttonbox-container > .titlebar-buttonbox {
+              margin-block: 10px;
+            }
+          }
+
+          /* At Full Screen */
+          :root[sizemode="fullscreen"] #window-controls {
+            position: fixed;
+            display: flex;
+            top: 0;
+            right: 0;
+            height: 40px;
+          }
+
+          :root[uidensity="compact"][sizemode="fullscreen"] #window-controls {
+            height: 32px;
+          }
+
+          @supports -moz-bool-pref("browser.fullscreen.autohide") {
+            :root[sizemode="fullscreen"] #navigator-toolbox:not(:hover) .titlebar-buttonbox-container {
+              visibility: hidden;
+            }
+          }
+          /* At Activated Menubar */
+          :root:not([chromehidden~="menubar"], [sizemode="fullscreen"])
+            #toolbar-menubar:not([autohide="true"])
+            + #TabsToolbar
+            > .titlebar-buttonbox-container {
+            display: block !important;
+          }
+
+          :root:not([chromehidden~="menubar"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container {
+            visibility: hidden;
+          }
+        }
+      }
+      @supports -moz-bool-pref("userChrome.tab.one_liner.tabbar_first") {
+        @media screen and (min-width: 1100px) {
+          /*= Windows Control - Move to toolbar ========================================*/
+          /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
+          See the above repository for updates as well as full license text. */
+          :root {
+            --uc-titlebar-padding: 0px;
+          }
+
+          @media (-moz-os-version: windows-win7),
+            (-moz-platform: windows-win7),
+            (-moz-os-version: windows-win8),
+            (-moz-platform: windows-win8),
+            (-moz-os-version: windows-win10),
+            (-moz-platform: windows-win10) {
+            :root[sizemode="maximized"][tabsintitlebar] {
+              --uc-titlebar-padding: 8px;
+            }
+          }
+          #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
+          #TabsToolbar > .titlebar-buttonbox-container {
+            position: fixed;
+            display: block;
+            top: var(--uc-titlebar-padding);
+            right: 0;
+            height: 40px;
+            z-index: 1;
+          }
+
+          /* where window controls are on left */
+          @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
+            :root {
+              --uc-titlebar-padding: 0px !important;
+            }
+
+            .titlebar-buttonbox-container {
+              left: 0;
+              right: unset !important;
+            }
+          }
+          #navigator-toolbox {
+            padding-top: calc(var(--uc-menubar-height, 0px) + var(--uc-titlebar-padding)) !important;
+          }
+
+          :root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container {
+            height: 32px;
+          }
+
+          #toolbar-menubar[inactive] > .titlebar-buttonbox-container {
+            opacity: 0;
+          }
+
+          .titlebar-buttonbox-container > .titlebar-buttonbox {
+            height: 100%;
+          }
+          @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
+            .titlebar-buttonbox-container > .titlebar-buttonbox {
+              margin-block: 10px;
+            }
+          }
+
+          /* At Full Screen */
+          :root[sizemode="fullscreen"] #window-controls {
+            position: fixed;
+            display: flex;
+            top: 0;
+            right: 0;
+            height: 40px;
+          }
+
+          :root[uidensity="compact"][sizemode="fullscreen"] #window-controls {
+            height: 32px;
+          }
+
+          @supports -moz-bool-pref("browser.fullscreen.autohide") {
+            :root[sizemode="fullscreen"] #navigator-toolbox:not(:hover) .titlebar-buttonbox-container {
+              visibility: hidden;
+            }
+          }
+          /* At Activated Menubar */
+          :root:not([chromehidden~="menubar"], [sizemode="fullscreen"])
+            #toolbar-menubar:not([autohide="true"])
+            + #TabsToolbar
+            > .titlebar-buttonbox-container {
+            display: block !important;
+          }
+
+          :root:not([chromehidden~="menubar"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container {
+            visibility: hidden;
+          }
+        }
+      }
+    }
+  }
+  /*= Navbar - Padding for window controls =====================================*/
+  /* Customized https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/window_control_placeholder_support.css */
+  :root {
+    --uc-window-control-width: 0px;
+    /* Same as .titlebar-buttonbox-container      -  Space reserved for window controls */
+    --uc-window-drag-space-pre: 0px;
+    /* Same as .titlebar-spacer[type="pre-tabs"]  - Extra space reserved on both sides of the nav-bar to be able to drag the window */
+    --uc-window-drag-space-post: 0px;
+    /* Same as .titlebar-spacer[type="post-tabs"] */
+  }
+
+  :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
+    --uc-window-control-width: 84px;
+    /* 84px is default value of linux */
+    --uc-window-drag-space-pre: var(--uc-title-pre-spacer, 40px);
+    --uc-window-drag-space-post: var(--uc-title-post-spacer, 40px);
+  }
+
+  :root:is([tabsintitlebar][sizemode="maximized"], [sizemode="fullscreen"]) {
+    --uc-window-drag-space-pre: 0px;
+    /* Remove pre space */
+  }
+
+  @supports -moz-bool-pref("userChrome.tab.one_liner") {
+    @supports not -moz-bool-pref("userChrome.tab.one_liner.responsive") {
+      @supports -moz-bool-pref("userChrome.tab.one_liner.tabbar_first") {
+        :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
+          /* Don't need pre spacer */
+          --uc-window-drag-space-pre: 0px;
+        }
+      }
+      @supports not -moz-bool-pref("userChrome.tab.one_liner.tabbar_first") {
+        :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
+          /* Don't need window control */
+          --uc-window-control-width: 0px;
+          --uc-window-drag-space-post: 0px;
+        }
+      }
+    }
+    @supports -moz-bool-pref("userChrome.tab.one_liner.responsive") {
+      @media screen and (max-width: 1100px) {
+        @supports not -moz-bool-pref("userChrome.tab.on_bottom") {
+          :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
+            /* Don't need pre spacer */
+            --uc-window-drag-space-pre: 0px;
+            /* Don't need window control */
+            --uc-window-control-width: 0px;
+            --uc-window-drag-space-post: 0px;
+          }
+        }
+      }
+      @media screen and (min-width: 1100px) {
+        @supports -moz-bool-pref("userChrome.tab.one_liner.tabbar_first") {
+          :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
+            /* Don't need pre spacer */
+            --uc-window-drag-space-pre: 0px;
+          }
+        }
         @supports not -moz-bool-pref("userChrome.tab.one_liner.tabbar_first") {
           :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
             /* Don't need window control */
@@ -4416,51 +4700,45 @@
             --uc-window-drag-space-post: 0px;
           }
         }
-        @supports -moz-bool-pref("userChrome.tab.one_liner.tabbar_first") {
-          :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-            /* Don't need pre spacer */
-            --uc-window-drag-space-pre: 0px;
-          }
-        }
-      }
-      #nav-bar {
-        border-inline-start-width: var(--uc-window-drag-space-pre);
-        border-inline-end-width: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post));
-        border-inline-style: solid !important;
-        border-inline-color: var(--toolbar-bgcolor);
       }
+    }
+  }
+  #nav-bar {
+    border-inline-start-width: var(--uc-window-drag-space-pre);
+    border-inline-end-width: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post));
+    border-inline-style: solid !important;
+    border-inline-color: var(--toolbar-bgcolor);
+  }
 
-      /* Windows */
-      @media (-moz-os-version: windows-win7),
-        (-moz-platform: windows-win7),
-        (-moz-os-version: windows-win8),
-        (-moz-platform: windows-win8) {
-        :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-          --uc-window-control-width: 105px;
-        }
-      }
-      @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) {
-        :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-          --uc-window-control-width: 138px;
-        }
-      }
-      /* Use this pref to check Mac OS where window controls are on left */
-      /* This pref defaults to true on Mac and doesn't actually do anything on other platforms. So if your system has window controls on LEFT side you can set the pref to true */
-      @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
-        :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-          --uc-window-control-width: 72px;
-        }
+  /* Windows */
+  @media (-moz-os-version: windows-win7),
+    (-moz-platform: windows-win7),
+    (-moz-os-version: windows-win8),
+    (-moz-platform: windows-win8) {
+    :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
+      --uc-window-control-width: 105px;
+    }
+  }
+  @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) {
+    :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
+      --uc-window-control-width: 138px;
+    }
+  }
+  /* Use this pref to check Mac OS where window controls are on left */
+  /* This pref defaults to true on Mac and doesn't actually do anything on other platforms. So if your system has window controls on LEFT side you can set the pref to true */
+  @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
+    :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
+      --uc-window-control-width: 72px;
+    }
 
-        :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar {
-          border-inline-start-width: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post));
-          border-inline-end-width: var(--uc-window-drag-space-pre);
-        }
+    :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar {
+      border-inline-start-width: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post));
+      border-inline-end-width: var(--uc-window-drag-space-pre);
+    }
 
-        :root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container:last-child,
-        :root[sizemode="fullscreen"] #window-controls {
-          right: unset;
-        }
-      }
+    :root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container:last-child,
+    :root[sizemode="fullscreen"] #window-controls {
+      right: unset;
     }
   }
 }
diff --git a/src/tabbar/_index.scss b/src/tabbar/_index.scss
index 4a7aafa..e312b71 100644
--- a/src/tabbar/_index.scss
+++ b/src/tabbar/_index.scss
@@ -20,7 +20,9 @@
 }
 
 @include Option("userChrome.tab.on_bottom") {
-  @import "tabs_on_bottom";
+  @include OneLinerOnBottom {
+    @import "tabs_on_bottom";
+  }
 }
 
 /*= Tab Bar - Oneliner =======================================================*/
@@ -30,9 +32,7 @@
 
 /*= Tab Bar - Shared Layout ==================================================*/
 @include Option("userChrome.tab.on_bottom", "userChrome.tab.one_liner") {
-  @include OneLinerContent {
-    @import "layout";
-  }
+  @import "layout";
 }
 
 /*= Tab Bar - Show only current tab ==========================================*/
diff --git a/src/tabbar/_layout.scss b/src/tabbar/_layout.scss
index bfab821..72b42d3 100644
--- a/src/tabbar/_layout.scss
+++ b/src/tabbar/_layout.scss
@@ -1,5 +1,28 @@
 @include Option("userChrome.tab.on_bottom", "userChrome.tab.one_liner.tabbar_first") {
-  @import "layout/window_control";
+}
+@include NotOption("userChrome.tab.one_liner") {
+  @include Option("userChrome.tab.on_bottom") {
+    @import "layout/window_control";
+  }
+}
+@include Option("userChrome.tab.one_liner") {
+  @include NotOption("userChrome.tab.one_liner.responsive") {
+    @include Option("userChrome.tab.one_liner.tabbar_first") {
+      @import "layout/window_control";
+    }
+  }
+  @include Option("userChrome.tab.one_liner.responsive") {
+    @include Option("userChrome.tab.on_bottom") {
+      @media screen and (max-width: 1100px) {
+        @import "layout/window_control";
+      }
+    }
+    @include Option("userChrome.tab.one_liner.tabbar_first") {
+      @media screen and (min-width: 1100px) {
+        @import "layout/window_control";
+      }
+    }
+  }
 }
 
 @import "layout/navbar_padding";
diff --git a/src/tabbar/_tabs_on_bottom.scss b/src/tabbar/_tabs_on_bottom.scss
index 94fc61f..73b9c67 100644
--- a/src/tabbar/_tabs_on_bottom.scss
+++ b/src/tabbar/_tabs_on_bottom.scss
@@ -2,7 +2,7 @@
 See the above repository for updates as well as full license text. */
 
 /*= Tabbar - Move to bottom ==================================================*/
-#titlebar{
+#titlebar {
   order: 2; /* When userChrome.fullscreen.overlap */
   -moz-box-ordinal-group: 2;
   --tabs-navbar-shadow-size: 0px;
diff --git a/src/tabbar/layout/_navbar_padding.scss b/src/tabbar/layout/_navbar_padding.scss
index 10f7c1a..92da540 100644
--- a/src/tabbar/layout/_navbar_padding.scss
+++ b/src/tabbar/layout/_navbar_padding.scss
@@ -13,18 +13,45 @@
 :root:is([tabsintitlebar][sizemode="maximized"], [sizemode="fullscreen"]) {
   --uc-window-drag-space-pre: 0px; /* Remove pre space */
 }
-@include Option("userChrome.tab.one_liner") {
-  @include NotOption("userChrome.tab.one_liner.tabbar_first") {
-    :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-      /* Don't need window control */
-      --uc-window-control-width: 0px;
-      --uc-window-drag-space-post: 0px;
-    }
-  }
+
+//-- Mixin ---------------------------------------------------------------------
+@mixin _remove_spacer_pre() {
+  /* Don't need pre spacer */
+  --uc-window-drag-space-pre: 0px;
+}
+
+@mixin _remove_spacer_post() {
+  /* Don't need window control */
+  --uc-window-control-width: 0px;
+  --uc-window-drag-space-post: 0px;
+}
+
+@mixin _remove_spacer_oneLiner() {
   @include Option("userChrome.tab.one_liner.tabbar_first") {
-    :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-      /* Don't need pre spacer */
-      --uc-window-drag-space-pre: 0px;
+    @include _remove_spacer_pre;
+  }
+  @include NotOption("userChrome.tab.one_liner.tabbar_first") {
+    @include _remove_spacer_post;
+  }
+}
+
+//------------------------------------------------------------------------------
+
+@include Option("userChrome.tab.one_liner") {
+  :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
+    @include NotOption("userChrome.tab.one_liner.responsive") {
+      @include _remove_spacer_oneLiner;
+    }
+    @include Option("userChrome.tab.one_liner.responsive") {
+      @media screen and (max-width: 1100px) {
+        @include NotOption("userChrome.tab.on_bottom") {
+          @include _remove_spacer_pre;
+          @include _remove_spacer_post;
+        }
+      }
+      @media screen and (min-width: 1100px) {
+        @include _remove_spacer_oneLiner;
+      }
     }
   }
 }
diff --git a/src/tabbar/layout/_window_control.scss b/src/tabbar/layout/_window_control.scss
index 9a66be7..f6d813a 100644
--- a/src/tabbar/layout/_window_control.scss
+++ b/src/tabbar/layout/_window_control.scss
@@ -6,7 +6,7 @@ See the above repository for updates as well as full license text. */
 }
 
 @include OS($win) {
-  :root[sizemode="maximized"][tabsintitlebar]{
+  :root[sizemode="maximized"][tabsintitlebar] {
     --uc-titlebar-padding: 8px;
   }
 }
@@ -76,4 +76,3 @@ See the above repository for updates as well as full license text. */
 :root:not([chromehidden~="menubar"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container {
   visibility: hidden;
 }
-
diff --git a/src/utils/_one_liner.scss b/src/utils/_one_liner.scss
index 3995dcd..ccf6aa2 100644
--- a/src/utils/_one_liner.scss
+++ b/src/utils/_one_liner.scss
@@ -19,6 +19,19 @@
   }
 }
 
+@mixin OneLinerOnBottom() {
+  @include NotOption("userChrome.tab.one_liner") {
+    @content;
+  }
+  @include Option("userChrome.tab.one_liner") {
+    @include Option("userChrome.tab.one_liner.responsive") {
+      @media screen and (max-width: 1100px) {
+        @content;
+      }
+    }
+  }
+}
+
 @mixin OneLinerTabbar() {
   @include NotOption("userChrome.tab.one_liner.responsive") {
     @content;