Firefox 145 UX Tweaks for vertical tabs with sideberry

sideberryCustomStyle.css

#root.root {--tabs-margin: 3px;}
#root.root {--tabs-height: max(32px, calc(1.7 * 1em));}
#root.root {--general-border-radius: 8px;}

#root.root:-moz-window-inactive {--frame-bg: rgb(31,30,37);}
#root.root {--frame-bg: rgb(28,27,34);}

#root.root {padding-top: 12px;}

.Tab {
	margin: 0;
  width: calc(100% - var(--tabs-margin) / 2 );
}

.Tab > .body {
  padding-block-end: 1.4685px;
  padding-block-start: 2.9374px;
  padding-inline-end: 8.811px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}

.Tab:first-of-type {
  margin-top: 2px;
}

.Tab[data-pin="false"] .ctx {
	top: 0;
  right: 0px;
	width: 1.5px;
	height: 100%;
 }

.Tab .body:after {
  top:calc(-10% - var(--tabs-margin));
}

userChrome.css

/*
 * Vertical Tab bar (must be enabled in firefox)
 */

/* Hides the tabs in sidebar, but not sidebar functionality when in vertical tabs */
#vertical-tabs {
  /* If hidden, the vertical tabbar sidebar settings / shortcuts will stay on bottom, if collapse, then moved to top */
  visibility: collapse !important;
}

/* Resize the facotry sidebar to 42px, the width for asingle roll of icons */
#sidebar-main {
  width: 49px !important;
}

/* Removes box-shadow from secondary side-bar now that vertical tabs is primary */
/* set the revamped sidebar background color to same as browser ux */
#sidebar {
  @media -moz-pref("sidebar.revamp") {
    box-shadow: none !important;
    background-color: var(--toolbar-bgcolor) !important;
  }
  border-radius: 0 !important;
  outline: none !important;
}

#sidebar-splitter {
  width: 0 !important;
  border: 0 !important;
}

#sidebar-panel-header {
  visibility: collapse !important;
}

#sidebar-tools-and-extensions-splitter {
  visibility: collapse;
}

#sidebar-launcher-splitter {
  display: none;
}

/* Adds rounded corners to the brwoser viewer on the tab, and propgates it up to ouline conforms */
#tabbrowser-tabpanels,
#tabbrowser-tabbox,
#tabbrowser-tabbox .brwoserStack,
#tabbrowser-tabbox .browserStack > browser {
  border-radius: 15px !important;
}