Firefox css to disable horizontal tabs

userChrome.css

#main-window[tabsintitlebar="true"]:not([extradragspace="true"]) #TabsToolbar > .toolbar-items {
  opacity: 0;
  pointer-events: none;
}
#main-window:not([tabsintitlebar="true"]) #TabsToolbar {
    visibility: collapse !important;
}

#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] #sidebar-header {
  display: none;
}

/*
    Display the status bar in Firefox Quantum (version 61+)
    permanently at the bottom of the browser window.
    Code below works best for the Dark Firefox theme and is based on:
    https://github.com/MatMoul/firefox-gui-chrome-css/blob/master/chrome/userChrome.css
    This userChrome.css file was last modified on: 28-Jun-2018.
    Tested to work with Firefox 61 on Windows.
    Related blog post: http://www.optimiced.com/en/?p=1727
*/

#browser-bottombox {
  height: 20px;
  border-top: solid 1px #505050;
}

.browserContainer>#statuspanel {
  left: 4px !important;
  bottom: 0px;
  transition-duration: 0s !important;
  transition-delay: 0s !important;
}

.browserContainer>#statuspanel>#statuspanel-inner>#statuspanel-label {
  margin-left: 0px !important;
  border: none !important;
  padding: 0px !important;
  color: #EEE !important;
  background: #333 !important;
}

window[inFullscreen="true"] #browser-bottombox {
  display: none !important;
}

window[inFullscreen="true"] .browserContainer>#statuspanel[type="overLink"] #statuspanel-label {
  display: none !important;
}

#titlebar {
  appearance: none !important;
  height: 0px;
}

#titlebar > #toolbar-menubar {
  margin-top: 0px;
}

#TabsToolbar {
  min-width: 0 !important;
  min-height: 0 !important;
}

#TabsToolbar > .titlebar-buttonbox-container {
  display: block;
  position: absolute;
  top: 12px;
  left: 0px;
}

#nav-bar toolbarspring {
  min-width: 10px !important;
  max-width: 20px !important;
}

Additionally, setting the same SF Pro Condensed font as the default UI font is possible:

#navigator-toolbox {
  font-family: "SF Pro" !important;
  font-stretch: condensed !important;
  font-weight: 300 !important;
}

.bookmark-item {
  font-family: "SF Pro" !important;
  font-stretch: condensed !important;
  font-weight: 300 !important;
}

Those snippets would be added to the end of your /chrome/userChrome.css file in your Firefox profile directory. Remember to close Firefox completely and restart it for the settings to take effect!

And, within the Tree Style Tab custom user style, add this:

:root.sidebar tab-item.active tab-label:before {
  content: "⇛⇛";
}

This adds a funky little pair of arrows to indicate your active tab :)