How to use: https://www.reddit.com/r/FirefoxCSS/comments/73dvty/tutorial_how_to_create_and_livedebug_userchromecss/

userChrome.css

@-moz-document url("chrome://browser/content/browser.xhtml") {
  :root {
    --proton-tab-block-margin: 0px !important;
    --arrowpanel-menuitem-padding-block: 4px 4px !important;
    --tab-min-height: 26px !important;
    --panel-separator-margin: 2px 4px;
    --toolbarbutton-outer-padding: 1px !important;
    --toolbarbutton-inner-padding: 3px !important;
    --urlbar-container-padding: 0px !important;
  }

  .tabbrowser-tab {
    min-height: 0px !important;
  }

  .tab-close-button {
    width: 16px !important;
    height: 16px !important;
    padding: 3px !important;
  }

  .tab-background {
    border-radius: 0px !important;
  }

  .tab-background[multiselected="true"],
  .tab-background[selected="true"] {
    background-color: var(--toolbar-bgcolor) !important;
  }

  @media (-moz-proton) {
    #scrollbutton-up,
    #scrollbutton-down {
      border: 0px solid transparent !important;
      padding: 0px
    }

    .tab-background:not([selected=true]):not([multiselected=true]):not([beforeselected-visible="true"]) {
      border-right: 1px solid rgba(0, 0, 0, .20) !important;
    }

    /* For dark backgrounds */
    [brighttext="true"] .tab-background:not([selected=true]):not([multiselected=true]):not([beforeselected-visible="true"]) {
      border-right: 1px solid var(--lwt-selected-tab-background-color, rgba(255, 255, 255, .20)) !important;
    }

    .tab-background:not([selected=true]):not([multiselected=true]) {
      border-radius: 0 !important;
    }

    /* Remove padding between tabs */
    .tabbrowser-tab {
      padding-left: 0 !important;
      padding-right: 0 !important;
    }
  }

  #urlbar:not([open="true"]) {
    height: 26px !important;
    margin-top: -2px !important;
  }

  #urlbar-container {
    --urlbar-container-height: 28px !important;
  }
}