How to adjust the Firefox tab bar tabbar height and width

 Followed the instruction here:

GitHub - dannycolin/ff-ultra-compact-mode: A Better Compact Mode for Firefox Proton

1. Type about:config in the address bar and press Enter/Return.
2. Click the button accepting the risk.
3. In the search box above the list, type or paste toolkit.legacyUserProfileCustomizations.stylesheets.
4. Double-click the toolkit.legacyUserProfileCustomizations.stylesheets preference to switch the value from false to true.
5. Now, search for browser.compactmode.show and set it to true.
6. Close about:config tab.
7. Open your profile folder (See How do I find my profile?)
8. Go to chrome folder or create it if it doesn't exist
9. Copy/Paste the userChrome.css file from this repository inside the chrome folder.
10. Go to ... | More Tools | Customize Toolbar | Density to Compact

userChrome.css file content:

:root {

  /* Appmenu: Reduce item padding */

  --arrowpanel-menuitem-padding-block: 4px 8px !important;

  /* Tabbar: reduce tab margin */

  --tab-block-margin: 4px 3px !important;

  /* Set minimum width below which tabs will not shrink (minimum 22px) */

  --my-tab-min-width: 10px;

}

/* Essential rule for reducing minimum tab width */

.tabbrowser-tab:not([pinned]){

  min-width: var(--my-tab-min-width) !important;

}

/* Optional rules for widths below 40px */

/* Reduce icon's right margin for less wasted space */

.tabbrowser-tab:not([pinned]) .tab-icon-image {

  margin-right: 1px !important;

}

/* Adjust padding for better centering and less wasted space */

.tabbrowser-tab:not([pinned]) .tab-content{

  padding-left: calc((var(--my-tab-min-width) - 22px)/2) !important;

  padding-right: calc((var(--my-tab-min-width) - 22px)/2) !important;

}

/* Reduce close button's padding for less wasted space */

.tab-close-button.close-icon {

  padding-left: 0 !important;

  padding-right: 3px !important;

}

/* Tab: Reduce height */

.tabbrowser-tab {

  min-height: 24px !important;

}

/* URLBar: Fix vertical alignment */

#urlbar[breakout=true]:not([open="true"]) {

--urlbar-height: 20px !important;

--urlbar-toolbar-height: 24px !important;

}

/* Toolbar: Reduce spacing */

#urlbar-container {

--urlbar-container-height: 30px !important;

  margin-top: 0 !important;

}

/* Reload Button: Fix vertical alignment */

#reload-button {

margin-block-start: -2px !important;

}

.tabbrowser-tab .tab-context-line {

    margin: -3px 0px !important;

    background-color: #76B900;

    height: 3px;

}

.tabbrowser-tab[selected="true"] .tab-context-line {

    margin: -3px 0px !important;

    background-color: green;

    height: 3px;

}