Styling Firefox UI With CSS (part 2)

I just found out an exciting use case for styling Firefox UI with CSS! Hiding the title bar with tabs when only a single tab is opened.

A video showing closing and opening a second tab in Firefox browser. Opening the second tab makes the title bar appear. Closing the second tab makes the title bar disappear.

Why? I often place one browser window above another. Hiding this bar saves some vertical screen space that is scarce! Doing a quick calculation it saves me 3% additional space per browser window!

How? Combine instructions in Styling Firefox UI with CSS (part 1) post with the following snippet:

#titlebar {
  display: none;
}

#titlebar:has(.tabbrowser-tab:nth-of-type(2)) {
  display: initial;
}