Styling for Tree Style Tab

_.css

/* Firefox > Tree Style Tab > Manage Extension > Advanced > "Extra style rules for sidebar contents" */

/* Show title of unread tabs with red and italic font */
.tab.unread .label {
  color: red !important;
  font-style: italic !important;
}

/* Add private browsing indicator per tab */
.tab.private-browsing .label:before {
  content: "🕶";
}

/* Compact tab layout */
.tab { 
  height: 25px;
}

.tab.active .label {
  font-weight: bold;
}

/* Keep new tab button at the bottom of the sidebar */
#tabbar:not(.overflow) .after-tabs {
  margin-top: auto;
}

userChrome.css

/* Usually located at: ~/.mozilla/firefox/<profile>/chrome/userChrome.css */

@namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

/* Hide tab bar in FF Quantum */
@-moz-document url("chrome://browser/content/browser.xul") {
  #TabsToolbar {
    visibility: collapse !important;
    margin-bottom: 21px !important;
  }

  #sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] #sidebar-header {
    visibility: collapse !important;
  }
}