icon only tabs: Draw tab audio button as overlay

Note, this only affects Firefox 136+ with its new audio button.
This patch also restricts the style to horizontal tabs because Vertical
tabs can be collapsed with built-in feature.

chrome/icon_only_tabs.css

@@ -1,19 +1,32 @@
 /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/icon_only_tabs.css made available under Mozilla Public License v. 2.0
 See the above repository for updates as well as full license text. */
 
-.tab-content > :not(.tab-icon-stack){
-  display: none
-}
-.tab-icon-image:not([src]){
-  display: block !important;
-}
-.tab-icon-stack > *{ margin-inline: 0 !important; }
-.tabbrowser-tab{
-  flex-grow: 0 !important;
-}
+@media not (-moz-bool-pref: "sidebar.verticalTabs"){
+  .tab-content > :not(.tab-icon-stack){
+    display: none;
+  }
+  .tab-icon-image:not([src]){
+    display: block !important;
+  }
+  .tab-icon-stack > *{ margin-inline: 0 !important; }
+  .tabbrowser-tab{
+    flex-grow: 0 !important;
+  }
 
-.tabbrowser-tab[fadein]{ min-width: calc(16px + 2 * 10px + 4px) !important; }
-:root[uidensity="compact"] .tabbrowser-tab[fadein]{
-  min-width: calc(16px + 2 * var(--tab-inline-padding,0px) + 4px) !important;
-}
-:root:not([uidensity="compact"]) .tab-content{ padding-inline: 10px !important; }
+  .tabbrowser-tab[fadein]{ min-width: calc(16px + 2 * 10px + 4px) !important; }
+  :root[uidensity="compact"] .tabbrowser-tab[fadein]{
+    min-width: calc(16px + 2 * var(--tab-inline-padding,0px) + 4px) !important;
+  }
+  :root:not([uidensity="compact"]) .tab-content{ padding-inline: 10px !important; }
+
+  .tab-audio-button{
+    --button-size-icon-small: 16px !important;
+    --button-min-height-small: var(--button-size-icon-small) !important;
+    --button-background-color-ghost: var(--toolbox-bgcolor-inactive);
+    --button-border-radius: var(--border-radius-circle) !important;
+    position: absolute;
+    top: 0;
+    right: 0;
+    margin-inline: 0 !important;
+  }
+}