Floating auto-shrinking sidebar for vertical tabs via Tab Center Redux. Video demo: https://youtu.be/Y_rTY8tTAO8

userChrome.css

@namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
@-moz-document url("chrome://browser/content/browser.xul") {

  /* Windows users might also want to consider setting
   * browser.tabs.drawInTitlebar to false in about:config
   */
  
  #TabsToolbar {
    visibility: collapse !important;
  }

  #sidebar-box {
    display: block;
    overflow: hidden;
    min-width: 4vw;
    max-width: 4vw;
    position: fixed;
    transition: all 0.2s ease;
    border-right: 1px solid #ddd;
  }

  #sidebar-box:hover,
  #sidebar-header,
  #sidebar {
    min-width: 20vw !important;
    max-width: 20vw !important;
  }

  #sidebar-header,
  #sidebar-splitter {
    display: none;
  }

  /*
   * ADJUST!
   * You need to subtract the height of the panels above sidebar: nav bar,
   * bokmarks bar, sidebar header, etc. -- whichever you have enabled.
   * 
   * 43px subtracted below is the height of the nav bar with default theme.
   * I don't have bookmarks bar enabled, and sidebar header is hidden with
   * CSS above, so this is all I need to do.
   * 
   * Compact nav bar height is 37px btw, if you use that.
   */
  #sidebar {
    height: calc(100vh - 43px);
  }

  #sidebar-box:not([hidden]) ~ #appcontent {
    margin-left: 4vw;
  }

  #main-window[inFullscreen][inDOMFullscreen] #appcontent {
    margin-left: 0;
  }

  #main-window[inFullscreen] #sidebar {
    height: 100vh;
  }

}