Merge branch 'dev' into glance-buttons-overflow

2025-10-16 14:56:14 +00:00 · 2025-03-22 16:24:01 +01:00
parent d808e72d2a 75a75d78ec
commit af0eeb710e
64 changed files with 1133 additions and 771 deletions
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -517,6 +517,8 @@ jobs:
          repository: ./updates-server

      - name: Generate Release Notes
+        env:
+          RELEASE_BRANCH: ${{ inputs.update_branch }}
        run: bash .github/workflows/src/generate_release_notes.sh

        # If we are on Twilight, we want to just update the Twilight tag's release
--- a/.github/workflows/macos-universal-release-build.yml
+++ b/.github/workflows/macos-universal-release-build.yml
@@ -182,7 +182,7 @@ jobs:
        run: |
          cd engine
          # TODO: Change it to "production" once we figure out the issue with the webauth
-          ./mach macos-sign -v -r -c "release" -e "production-without-restricted" -a "./obj-x86_64-apple-darwin/dist/${{ env.APP_NAME }}.app" --rcodesign-p12-file zenCert.p12 --rcodesign-p12-password-file zenpCertPassword.passwd
+          ./mach macos-sign -v -r -c "release" -e "production" -a "./obj-x86_64-apple-darwin/dist/${{ env.APP_NAME }}.app" --rcodesign-p12-file zenCert.p12 --rcodesign-p12-password-file zenpCertPassword.passwd

      - name: Create DMG
        run: |
--- a/.github/workflows/src/generate_release_notes.sh
+++ b/.github/workflows/src/generate_release_notes.sh
@@ -67,33 +67,38 @@ cat << EOF >> "release_notes.md"
 EOF

 generate_checksum() {
-  local file=$1
-  if [ -f "$file" ]; then
-    echo "Generating checksum for $file"
-    sha256sum "$file" | awk '{print $1 "  " $2}' >> "release_notes.md"
-  else
-    echo "Warning: $file not found, skipping checksum"
+  local pattern=$1
+  echo "Generating checksum for $pattern"
+  sha256sum $pattern 2> /dev/null | awk '{sub(".*/", "", $2); print $1 "  " $2}' >> "release_notes.md"
+  if [ ${PIPESTATUS[0]} -ne 0 ]; then
+    echo "Warning: No files found matching $pattern, skipping checksum."
  fi
 }

 files=(
-  "./zen.source.tar.zst"
-  "./zen.linux-x86_64.tar.xz"
-  "./zen.linux-aarch64.tar.xz"
-  "./zen-x86_64.AppImage"
-  "./zen-x86_64.AppImage.zsync"
-  "./zen-aarch64.AppImage"
-  "./zen-aarch64.AppImage.zsync"
+  "./zen.source.tar.zst/*"
+  "./zen.linux-x86_64.tar.xz/*"
+  "./zen.linux-aarch64.tar.xz/*"
+  "./zen-x86_64.AppImage/*"
+  "./zen-x86_64.AppImage.zsync/*"
+  "./zen-aarch64.AppImage/*"
+  "./zen-aarch64.AppImage.zsync/*"
  "./.github/workflows/object/windows-x64-signed-x86_64/zen.win-x86_64.zip"
+  "./zen.win-x86_64.zip/*"
  "./.github/workflows/object/windows-x64-signed-arm64/zen.win-arm64.zip"
-  "./linux.mar"
-  "./linux-aarch64.mar"
+  "./zen.win-arm64.zip/*"
+  "./linux.mar/*"
+  "./linux-aarch64.mar/*"
  "./.github/workflows/object/windows-x64-signed-x86_64/windows.mar"
+  "./windows.mar/*"
  "./.github/workflows/object/windows-x64-signed-arm64/windows-arm64.mar"
-  "./macos.mar"
+  "./windows-arm64.mar/*"
+  "./macos.mar/*"
  "./.github/workflows/object/windows-x64-signed-x86_64/zen.installer.exe"
+  "./zen.installer.exe/*"
  "./.github/workflows/object/windows-x64-signed-arm64/zen.installer-arm64.exe"
-  "./zen.macos-universal.dmg"
+  "./zen.installer-arm64.exe/*"
+  "./zen.macos-universal.dmg/*"
 )

 for file in "${files[@]}"; do
--- a/README.md
+++ b/README.md
@@ -28,7 +28,7 @@

 ## 🖥️ Compatibility

-Zen is currently built using Firefox version `136.0.1`! 🚀
+Zen is currently built using Firefox version `136.0.2`! 🚀

 - [`Zen Twilight`](https://zen-browser.app/download?twilight) - Is currently built using Firefox version `RC 136.0`!
 - Check out the latest [release notes](https://zen-browser.app/release-notes)!
@@ -96,17 +96,22 @@ brew install --cask zen-browser
 yay -S zen-browser-bin
 ```

-##### Other Linux distributions (AppImage with automated system integration)
+##### Other Linux distributions (Tarball or AppImage)

- `native` tarball install:
-  `bash <(curl -s https://updates.zen-browser.app/install.sh)`
+- `Tarball` install:

- `zsync` is required for the Update feature of the script below
+```sh
+bash <(curl -s https://updates.zen-browser.app/install.sh)
+```
+
+- `AppImage` install:

 ```sh
 bash <(curl https://updates.zen-browser.app/appimage.sh)
 ```

+> AppImage install requires `zsync` for the Update feature
+
 - Again, if you don't see your OS listed above, that's because we already have it in our [downloads page](https://zen-browser.app/download)! 🔄

 To upgrade the browser to a newer version, use the embedded update functionality in `About Zen`.
--- a/configs/macos/mozconfig
+++ b/configs/macos/mozconfig
@@ -7,7 +7,7 @@ export MOZ_MACBUNDLE_ID=${appId}
 export MOZ_MACBUNDLE_NAME="Zen Browser.app"

 # override LTO settings
-# TODO: Dont
+# TODO: Dont use LTO for now, it's causing a lot of issues
 export MOZ_LTO=cross,thin
 ac_add_options --enable-lto=cross,thin

--- a/firefox-cache/l10n-last-commit-hash
+++ b/firefox-cache/l10n-last-commit-hash
@@ -1 +1 @@
-6ad0ab3c43a6208d8bcd997b40e802fccd48ba0a
+6013afe489c3d5e19c5f0d0f6c3f94b91f5bd7d1
--- a/flatpak/app.zen_browser.zen.yml.template
+++ b/flatpak/app.zen_browser.zen.yml.template
@@ -28,7 +28,7 @@ finish-args:
  - --system-talk-name=org.freedesktop.NetworkManager
  - --talk-name=org.a11y.Bus
  - --env=GTK_PATH=/app/lib/gtkmodules
-  - --env=MESA_SHADER_CACHE_DIR=$XDG_RUNTIME_DIR/app/$FLATPAK_ID/cache/mesa_shader_cache_db
+  - --env=MESA_SHADER_CACHE_DIR=/var/cache/mesa_shader_cache_db
 modules:
  - name: zen_browser
    buildsystem: simple
--- a/2
+++ b/2
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,7 +9,7 @@
      "version": "1.0.0",
      "license": "ISC",
      "dependencies": {
-        "@zen-browser/surfer": "^1.10.4"
+        "@zen-browser/surfer": "^1.10.5"
      },
      "devDependencies": {
        "husky": "^9.1.7",
@@ -288,9 +288,9 @@
      "license": "MIT"
    },
    "node_modules/@zen-browser/surfer": {
-      "version": "1.10.4",
-      "resolved": "https://registry.npmjs.org/@zen-browser/surfer/-/surfer-1.10.4.tgz",
-      "integrity": "sha512-xDXJYgbJTfNpM+LsJDJ81VCotwIBY3CItrD7Y1hPqf84Ino/sTqy/QuHQCVqZU3StewAvVuV68MWnaiY9ytlMA==",
+      "version": "1.10.5",
+      "resolved": "https://registry.npmjs.org/@zen-browser/surfer/-/surfer-1.10.5.tgz",
+      "integrity": "sha512-jpGArye02C6M65qy0b5kZWzDBO5sh/BY6k2otC1keAjICm9lxELsh5ELRz0tVQ6kwrBUC3yE4uP8jzUgQdCuCg==",
      "dependencies": {
        "@resvg/resvg-js": "^1.4.0",
        "async-icns": "^1.0.2",
--- a/package.json
+++ b/package.json
@@ -41,7 +41,7 @@
  },
  "homepage": "https://github.com/zen-browser/core#readme",
  "dependencies": {
-    "@zen-browser/surfer": "^1.10.4"
+    "@zen-browser/surfer": "^1.10.5"
  },
  "devDependencies": {
    "husky": "^9.1.7",
--- a/scripts/update_ff.py
+++ b/scripts/update_ff.py
@@ -64,6 +64,12 @@ def update_l10n_last_commit_hash():
    if not os.path.exists("firefox-cache"):
      os.mkdir("firefox-cache")
    os.system("cat l10n-temp/.git/refs/heads/main > firefox-cache/l10n-last-commit-hash")
+    # Remove new line character
+    data = ""
+    with open("firefox-cache/l10n-last-commit-hash", "r") as f:
+      data = f.read()
+    with open("firefox-cache/l10n-last-commit-hash", "w") as f:
+      f.write(data.strip())
  except KeyboardInterrupt:
    print("Exiting...")
  shutil.rmtree("l10n-temp")
--- a/src/browser/app/profile/zen-browser.js
+++ b/src/browser/app/profile/zen-browser.js
@@ -90,6 +90,8 @@ pref('zen.tabs.show-newtab-vertical', true);
 pref('zen.view.show-newtab-button-border-top', false);
 pref('zen.view.show-newtab-button-top', true);

+perf('zen.mediacontrols.enabled', true);
+
 #ifdef MOZILLA_OFFICIAL
 pref('zen.rice.api.url', 'https://share.zen-browser.app', locked);
 pref('zen.injections.match-urls', 'https://zen-browser.app/*,https://share.zen-browser.app/*', locked);
@@ -199,9 +201,7 @@ pref('zen.startup.smooth-scroll-in-tabs', true);

 // Zen Workspaces
 pref('zen.workspaces.disabled_for_testing', false);
-pref('zen.workspaces.hide-deactivated-workspaces', false);
 pref('zen.workspaces.hide-default-container-indicator', true);
-pref('zen.workspaces.show-icon-strip', true);
 pref('zen.workspaces.force-container-workspace', false);
 pref('zen.workspaces.open-new-tab-if-last-unpinned-tab-is-closed', false);
 pref('zen.workspaces.show-workspace-indicator', true);
--- a/src/browser/base/content/ZenCustomizableUI.sys.mjs
+++ b/src/browser/base/content/ZenCustomizableUI.sys.mjs
@@ -125,12 +125,5 @@ export var ZenCustomizableUI = new (class {
  registerToolbarNodes(window) {
    window.CustomizableUI.registerToolbarNode(window.document.getElementById('zen-sidebar-top-buttons'));
    window.CustomizableUI.registerToolbarNode(window.document.getElementById('zen-sidebar-bottom-buttons'));
-    window.addEventListener(
-      'DOMContentLoaded',
-      () => {
-        this._dispatchResizeEvent(window);
-      },
-      { once: true }
-    );
  }
 })();
--- a/src/browser/base/content/ZenStartup.mjs
+++ b/src/browser/base/content/ZenStartup.mjs
@@ -58,6 +58,7 @@

    closeWatermark() {
      document.documentElement.removeAttribute('zen-before-loaded');
+      window.dispatchEvent(new window.Event('resize')); // To recalculate the layout
      if (Services.prefs.getBoolPref('zen.watermark.enabled', false)) {
        gZenUIManager.motion
          .animate(
--- a/src/browser/base/content/ZenUIManager.mjs
+++ b/src/browser/base/content/ZenUIManager.mjs
@@ -65,6 +65,7 @@ var gZenUIManager = {
    tabs.style.removeProperty('flex');
    tabs.style.maxHeight = height + 'px';
    gZenVerticalTabsManager.actualWindowButtons.removeAttribute('zen-has-hover');
+    gURLBar.updateLayoutBreakout();
  },

  get tabsWrapper() {
@@ -249,7 +250,7 @@ var gZenUIManager = {
    const toast = this._createToastElement(messageId, options);
    this._toastContainer.removeAttribute('hidden');
    this._toastContainer.appendChild(toast);
-    await this.motion.animate(toast, { opacity: [0, 1], scale: [0.8, 1] }, { type: 'spring', bounce: 0.5, duration: 0.5 });
+    await this.motion.animate(toast, { opacity: [0, 1], scale: [0.8, 1] }, { type: 'spring', bounce: 0.5, duration: 0.7 });
    await new Promise((resolve) => setTimeout(resolve, 3000));
    await this.motion.animate(toast, { opacity: [1, 0], scale: [1, 0.9] }, { duration: 0.2, bounce: 0 });
    const toastHeight = toast.getBoundingClientRect().height;
@@ -260,6 +261,10 @@ var gZenUIManager = {
      this._toastContainer.setAttribute('hidden', 'true');
    }
  },
+
+  get panelUIPosition() {
+    return gZenVerticalTabsManager._hasSetSingleToolbar ? 'bottomleft topleft' : 'bottomright topright';
+  },
 };

 var gZenVerticalTabsManager = {
@@ -361,7 +366,7 @@ var gZenVerticalTabsManager = {
            marginBottom: isLastTab() ? [] : [transform, '0px'],
          },
          {
-            duration: 0.2,
+            duration: 0.12,
            easing: 'ease-out',
          }
        )
@@ -371,9 +376,16 @@ var gZenVerticalTabsManager = {
          aTab.style.removeProperty('opacity');
        });
      gZenUIManager.motion
-        .animate(aTab.querySelector('.tab-content'), {
+        .animate(
+          aTab.querySelector('.tab-content'),
+          {
            filter: ['blur(1px)', 'blur(0px)'],
-        })
+          },
+          {
+            duration: 0.12,
+            easing: 'ease-out',
+          }
+        )
        .then(() => {
          aTab.querySelector('.tab-stack').style.removeProperty('filter');
        });
--- a/src/browser/base/content/browser-box-inc-xhtml.patch
+++ b/src/browser/base/content/browser-box-inc-xhtml.patch
@@ -1,8 +1,8 @@
 diff --git a/browser/base/content/browser-box.inc.xhtml b/browser/base/content/browser-box.inc.xhtml
-index 7f71abe7d80e4c09dd088517ec9ef106c7cb8654..7e764f08346a048fd352d7f7c06ea434f9b19903 100644
+index 7d7e8697f02f90d4f336c9ab0a73a89848e0c21c..2fd19f3b43db4bdd99e65fecd1481f80d4541a7a 100644
 --- a/browser/base/content/browser-box.inc.xhtml
 +++ b/browser/base/content/browser-box.inc.xhtml
-@@ -22,7 +22,14 @@
+@@ -23,7 +23,14 @@
     <browser id="sidebar" autoscroll="false" disablehistory="true" disablefullscreen="true" tooltip="aHTMLTooltip"/>
   </vbox>
   <splitter id="sidebar-splitter" class="chromeclass-extrachrome sidebar-splitter" resizebefore="sibling" resizeafter="none" hidden="true"/>
--- a/src/browser/base/content/zen-images/note-indicator.svg
+++ b/src/browser/base/content/zen-images/note-indicator.svg
@@ -3,7 +3,7 @@

    <style type="text/css"><![CDATA[
    .note {
-      fill: white;
+      fill: currentColor;
      transform-box: fill-box;
      transform-origin: center;
    }
--- a/src/browser/base/content/zen-media-player.inc.xhtml
+++ b/src/browser/base/content/zen-media-player.inc.xhtml
@@ -5,21 +5,21 @@
  hidden="true">
  <toolbaritem>
    <vbox id="zen-media-main-vbox">
-      <hbox id="zen-media-service-hbox" class="show-on-hover">
-        <hbox id="zen-media-service-button">
-          <image/>
-        </hbox>
-        <hbox id="zen-media-service-title" fadein="true">
-          <label class="service" />
-          <label class="tld" />
-        </hbox>
-      </hbox>
-      
-      <vbox id="zen-media-info-vbox" class="show-on-hover">
+      <vbox>
+        <hbox id="zen-media-info-container" class="show-on-hover">
+          <vbox id="zen-media-info-vbox">
            <label id="zen-media-title" fadein="true"/>
            <label id="zen-media-artist" fadein="true"/>
          </vbox>
-
+          <hbox id="zen-media-buttons-hbox">
+            <toolbarbutton id="zen-media-pip-button"
+              class="toolbarbutton-1"
+              oncommand="gZenMediaController.onMediaPip();" />
+            <toolbarbutton id="zen-media-close-button"
+              class="toolbarbutton-1"
+              oncommand="gZenMediaController.onControllerClose();" />
+          </hbox>
+        </hbox>
        <hbox id="zen-media-progress-hbox"  class="show-on-hover">
          <label id="zen-media-current-time">0:00</label>
          <html:input type="range" id="zen-media-progress-bar"
@@ -28,7 +28,7 @@
            onchange="gZenMediaController.onMediaSeekComplete(event);"/>
          <label id="zen-media-duration">0:00</label>
        </hbox>
-      
+      </vbox>
      <hbox id="zen-media-controls-hbox">
        <toolbarbutton id="zen-media-focus-button"
          class="toolbarbutton-1"
--- a/src/browser/base/content/zen-styles/zen-animations.css
+++ b/src/browser/base/content/zen-styles/zen-animations.css
@@ -290,3 +290,23 @@
    transform: scale(1);
  }
 }
+
+@keyframes zen-back-and-forth-text {
+  0%,
+  10% {
+    transform: translateX(0);
+    left: 0;
+  }
+
+  45%,
+  65% {
+    transform: translateX(calc(-100% - 5px));
+    left: 100%;
+  }
+
+  90%,
+  100% {
+    transform: translateX(0);
+    left: 0;
+  }
+}
--- a/src/browser/base/content/zen-styles/zen-browser-ui.css
+++ b/src/browser/base/content/zen-styles/zen-browser-ui.css
@@ -109,7 +109,7 @@
 }

 #zen-main-app-wrapper {
-  background: transparent;
+  background: var(--zen-themed-toolbar-bg-transparent);
  overflow: hidden;

  & > * {
--- a/src/browser/base/content/zen-styles/zen-compact-mode.css
+++ b/src/browser/base/content/zen-styles/zen-compact-mode.css
@@ -16,10 +16,12 @@
    #zen-tabbox-wrapper {
      /* Remove extra 1px of margine we have to add to the tabbox */
      margin-left: 0 !important;
+      margin-right: 0 !important;
    }

    #zen-appcontent-wrapper {
      margin-left: var(--zen-element-separation) !important;
+      margin-right: var(--zen-element-separation) !important;

      & #tabbrowser-tabbox {
        margin-left: 0 !important;
@@ -92,7 +94,7 @@

      & .browserSidebarContainer {
        margin-left: 0 !important;
-        margin-right: var(--zen-element-separation) !important;
+        margin-right: 0 !important;
      }
    }

--- a/src/browser/base/content/zen-styles/zen-decks.css
+++ b/src/browser/base/content/zen-styles/zen-decks.css
@@ -278,6 +278,10 @@

  &[side='right'] {
    right: 0;
+
+    &[has-split-view='true'] {
+      right: var(--zen-element-separation);
+    }
  }

  &::after {
--- a/src/browser/base/content/zen-styles/zen-glance.css
+++ b/src/browser/base/content/zen-styles/zen-glance.css
@@ -54,6 +54,10 @@

    & label {
      display: none;
+
+      &::before {
+        text-overflow: unset;
+      }
    }

    & image {
@@ -78,7 +82,7 @@
      color: white;
      fill: white;
      & label {
-        max-width: 100px;
+        max-width: 4rem;
        margin-left: 8px;
      }

--- a/src/browser/base/content/zen-styles/zen-gradient-generator.css
+++ b/src/browser/base/content/zen-styles/zen-gradient-generator.css
@@ -5,7 +5,7 @@
 */

 #PanelUI-zen-gradient-generator {
-  --panel-width: 300px;
+  --panel-width: 320px;
  --panel-padding: 10px;
  min-width: var(--panel-width);
 }
--- a/src/browser/base/content/zen-styles/zen-media-controls.css
+++ b/src/browser/base/content/zen-styles/zen-media-controls.css
@@ -1,5 +1,5 @@
 #zen-media-controls-toolbar {
-  --progress-height: 5px;
+  --progress-height: 4px;
  --button-spacing: 2px;

  display: flex;
@@ -13,6 +13,23 @@
    color: white;
  }

+  #zen-media-buttons-hbox {
+    align-items: start;
+    margin-top: -4px;
+    --toolbarbutton-outer-padding: 2px;
+  }
+
+  &:not([can-pip]) {
+    #zen-media-info-vbox {
+      width: calc(100% - 26px);
+      flex-shrink: 0;
+    }
+
+    #zen-media-pip-button {
+      display: none;
+    }
+  }
+
  #zen-media-prev-button,
  #zen-media-play-pause-button,
  #zen-media-next-button {
@@ -50,42 +67,49 @@
    &::-moz-range-thumb {
      background: var(--zen-primary-color);
      border: none;
-      width: 14px;
-      height: 14px;
+      width: calc(var(--progress-height) * 2);
+      height: calc(var(--progress-height) * 2);
      border-radius: 50%;
      cursor: pointer;
+      transform: scale(0);
+      transition: transform 0.15s ease-out;
+    }
+
+    &:hover::-moz-range-thumb {
+      transform: scale(1);
    }
  }

  &:hover {
-    & #zen-media-main-vbox {
-      transition-delay: 0s;
-      gap: 6px;
-    }
-
    .show-on-hover {
      max-height: 50px;
-      padding: 2px 6px;
+      padding: 5px;
      margin-bottom: 0;
      opacity: 1;
-      transform: translateY(0);
+      transform: translateY(0) !important;
+      pointer-events: auto;
    }
  }

-  &:not(:hover) {
-    &.playing:not([muted]) #zen-media-focus-button::after {
+  & #zen-media-focus-button::after {
    content: '';
    position: absolute;
-      width: 100%;
-      height: 100%;
+    width: 110%;
+    height: 110%;
    background-repeat: no-repeat;
    opacity: 1;
    background: url('chrome://browser/content/zen-images/note-indicator.svg') no-repeat;
-      top: -50%;
+    top: -70%;
    left: 50%;
    transform: translateX(-50%);
-      z-index: -1;
+    z-index: 0;
+    pointer-events: none;
+    transition: opacity 0.8s ease;
+    opacity: 1;
  }
+
+  &:is(:not(.playing:not([muted])), :hover) #zen-media-focus-button::after {
+    opacity: 0;
  }

  #zen-media-focus-button {
@@ -93,47 +117,44 @@
    transition:
      opacity 0.2s ease,
      transform 0.2s ease;
+    position: relative;

-    @container (max-width: 185px) {
-      width: 0;
-      height: 0;
-      opacity: 0;
-      padding: 0;
-      margin-right: -10%;
-      transform: translateX(-20px);
-      transition: margin 0.15s ease-in-out;
+    & image {
+      &:-moz-broken {
+        content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3C/svg%3E") !important;
+        background: color-mix(in srgb, var(--zen-primary-color) 70%, transparent 30%);
      }
-
-    @container (min-width: 185px) {
-      opacity: 1;
-      transform: translateX(0);
    }
  }

-  toolbaritem {
+  & > toolbaritem {
+    --zen-media-control-bg: light-dark(rgba(255, 255, 255, 0.87), rgba(0, 0, 0, 0.87));
    flex-grow: 1;
    padding: 0;
    transition: padding 0.3s ease-out;
    position: absolute;
    left: 0;
    bottom: 0;
-    padding: 4px;
+    padding: 4px 6px;
    border-radius: var(--border-radius-medium);
-    background: light-dark(rgb(255, 255, 255), rgb(11, 11, 11)) !important;
+    box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
+    background-color: var(--zen-media-control-bg);
+    backdrop-filter: saturate(3) contrast(2) blur(10px);
    width: 100%;
-    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
+    will-change: transform;
  }

  .show-on-hover {
    max-height: 0;
    opacity: 0;
-    transform: translateY(5px);
+    transform: translateY(1rem);
    padding: 0 6px;
+    pointer-events: none;
    transition:
-      max-height 0.1s ease-in-out,
-      opacity 0.1s ease-in-out,
-      transform 0.05s ease-in-out,
-      padding 0.15s ease-in-out;
+      max-height 0.2s ease,
+      opacity 0.2s ease,
+      transform 0.2s ease,
+      padding 0.2s ease;
  }

  #zen-media-current-time,
@@ -142,6 +163,7 @@
    font-size: x-small;
    opacity: 0.7;
    font-weight: 500;
+    font-variant-numeric: tabular-nums;
  }
 }

@@ -159,28 +181,6 @@
  }
 }

-#zen-media-service-title,
-#zen-media-title,
-#zen-media-artist {
-  white-space: nowrap;
-  width: 0;
-  margin-left: 0;
-}
-
-#zen-media-service-title {
-  align-self: center;
-  font-size: math;
-  margin-left: 6px;
-
-  & label {
-    margin: 0;
-  }
-
-  & .tld {
-    opacity: 0.5;
-  }
-}
-
 #zen-media-title,
 #zen-media-artist {
  align-self: start;
@@ -188,48 +188,73 @@

 #zen-media-artist {
  opacity: 0.7;
-  font-weight: 500;
  font-size: smaller;
+
+  &:empty {
+    display: none;
+  }
 }

 #zen-media-title {
  height: 16px;
  font-size: math;
-  font-weight: bold;
 }

 #zen-media-main-vbox,
-#zen-media-service-hbox,
 #zen-media-info-vbox,
 #zen-media-progress-hbox {
  width: 100%;
 }

-#zen-media-service-hbox {
-  padding-top: 6px;
-}
-
 #zen-media-info-vbox {
-  & label {
-    width: 100%;
-    text-overflow: ellipsis;
-    overflow: hidden;
+  #zen-media-controls-toolbar:not([media-position-hidden='true']) & {
+    transition-delay: 0.01s !important;
+  }
+  overflow-x: hidden;
+  overflow-x: visible;
  white-space: nowrap;
+  /* Overflow inner box shadow from the left to simulate overflow */
+  mask-image: linear-gradient(to left, transparent, var(--zen-media-control-bg) 0.6em);
+  min-width: 1px;
+
+  &::before {
+    content: '';
+    position: absolute;
+    width: 0.6em;
+    background: linear-gradient(to right, var(--zen-media-control-bg) 0%, transparent 100%);
+    pointer-events: none;
+    top: 6px;
+    left: 0;
+    height: calc(100% - 6px);
+    z-index: 1;
+  }
+
+  & label {
+    min-height: 16px;
+    margin-left: 0;
+    font-weight: 500;
+    position: relative; /* For the animation */
+
+    &[overflow] {
+      animation: zen-back-and-forth-text 10s infinite ease-in-out;
+    }
  }
 }

 #zen-media-main-vbox {
  height: 100%;
  justify-content: space-between;
-  transition: gap 0.1s ease-out;
-  transition-delay: 0.1s;
-  gap: 0px;
 }

 #zen-media-progress-hbox {
  flex-grow: 1;
  height: 1.1rem;
  align-items: center;
+  padding-top: 0px !important;
+
+  #zen-media-controls-toolbar[media-position-hidden='true'] & {
+    display: none;
+  }
 }

 #zen-media-controls-hbox {
@@ -239,13 +264,17 @@
  --toolbarbutton-outer-padding: 0;
 }

-#zen-media-service-button {
-  align-items: center;
+#zen-media-info-container {
+  padding-right: 0 !important;
+}

-  & image {
-    width: 16px;
-    height: 16px;
-    border-radius: 4px;
+#zen-media-controls-toolbar[can-pip] {
+  #zen-media-info-vbox {
+    flex-shrink: 1;
+  }
+
+  #zen-media-pip-button {
+    display: flex;
  }
 }

--- a/src/browser/base/content/zen-styles/zen-popup.css
+++ b/src/browser/base/content/zen-styles/zen-popup.css
@@ -360,9 +360,14 @@ menuitem {
  & .zen-toast {
    padding: 0.9rem 0.8rem;
    border-radius: 12px;
-    background-color: var(--button-primary-bgcolor);
+    background: linear-gradient(
+      170deg,
+      var(--zen-primary-color) -40%,
+      color-mix(in srgb, var(--zen-primary-color) 85%, #0f0f0f 15%)
+    );
    color: var(--button-primary-color);
-    box-shadow: var(--zen-big-shadow);
+    box-shadow: 0 0 14px 3px rgba(0, 0, 0, 0.05);
+    border: 1px solid rgba(0, 0, 0, 0.1);
    display: flex;
    font-weight: 500;
    gap: 5px;
--- a/src/browser/base/content/zen-styles/zen-sidebar-panels.css
+++ b/src/browser/base/content/zen-styles/zen-sidebar-panels.css
@@ -111,7 +111,7 @@
  background: transparent;
  border: none;
  cursor: ew-resize;
-  z-index: 2;
+  z-index: 3;

  &:is(.zen-split-view-splitter[orient='vertical']) {
    /* Bit of a hacky solution, but it works */
--- a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css
+++ b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css
@@ -108,7 +108,7 @@
  }

  & #zen-sidebar-top-buttons {
-    margin: var(--zen-element-separation) 0 calc(var(--zen-toolbox-padding) / 2) 0;
+    margin: var(--zen-toolbox-padding) 0 calc(var(--zen-toolbox-padding) / 2) 0;
  }

  & #PanelUI-menu-button {
@@ -153,8 +153,6 @@
  min-width: var(--zen-toolbox-min-width);
  margin-top: 0 !important; /* Fix full screen mode */

-  padding-bottom: var(--zen-element-separation) !important;
-
  border: none;
  order: 0 !important;

@@ -257,16 +255,31 @@
  }

  & .tabbrowser-tab {
+    &,
+    & .tab-content > image {
      transition: scale 0.07s ease;
+    }

    &[zen-empty-tab] {
      display: none;
    }

-    #tabbrowser-tabs:not([movingtab]) &:active {
+    #tabbrowser-tabs:not([movingtab]) &:active:not(:has(.tab-content > image:active)) {
      scale: var(--zen-active-tab-scale);
    }

+    #tabbrowser-tabs:not([movingtab]) & .tab-content > image:active {
+      scale: 0.92;
+    }
+
+    & .tab-icon-image {
+      &:not([src]),
+      &:-moz-broken {
+        content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3C/svg%3E") !important;
+        background: color-mix(in srgb, var(--zen-primary-color) 30%, transparent 70%);
+      }
+    }
+
    max-width: unset;
    padding: 0 !important;

@@ -456,18 +469,11 @@
    margin-top: 0;
  }

-  & #zen-workspaces-button[as-button='true'] {
-    width: calc(100% - 10px) !important;
-  }
-
  & .zen-current-workspace-indicator-icon[no-icon='true'] {
    display: none;
  }

  & #zen-workspaces-button {
-    margin-left: 2px;
-    margin-right: 2px;
-
    & .zen-workspace-sidebar-icon[no-icon='true'] {
      display: none;
    }
@@ -756,14 +762,6 @@
  }
  & #zen-workspaces-button {
    flex-direction: column;
-    &:not([as-button='true']) {
-      & toolbarbutton {
-        &[active='true']::after {
-          bottom: 50% !important;
-          transform: translateY(50%) !important;
-        }
-      }
-    }
  }
 }

@@ -1049,14 +1047,14 @@
 #zen-essentials-container {
  padding-bottom: var(--zen-toolbox-padding);
  overflow: hidden;
-  gap: 3px;
+  gap: calc(var(--zen-toolbox-padding) - 2px);
 }

 #zen-essentials-container {
  overflow: hidden;
  transition: max-height 0.3s ease-out;
  opacity: 1;
-  grid-template-columns: repeat(auto-fit, minmax(48px, auto));
+  grid-template-columns: repeat(auto-fit, minmax(49px, auto));
  overflow: hidden;
  scrollbar-width: thin;
  display: grid;
--- a/src/browser/base/content/zen-styles/zen-theme.css
+++ b/src/browser/base/content/zen-styles/zen-theme.css
@@ -155,16 +155,16 @@

  --input-bgcolor: var(--zen-colors-tertiary) !important;
  --input-border-color: var(--zen-input-border-color) !important;
-  --zen-themed-toolbar-bg: light-dark(rgb(240, 240, 244), #161616);
-  --zen-themed-toolbar-bg-transparent: light-dark(var(--zen-branding-bg), #161616);
+  --zen-themed-toolbar-bg: light-dark(rgb(240, 240, 244), #171717);
+  --zen-themed-toolbar-bg-transparent: light-dark(var(--zen-branding-bg), #171717);

-  --zen-workspace-indicator-height: 45px;
+  --zen-workspace-indicator-height: 48px;

  @media (-moz-windows-mica) or (-moz-platform: macos) {
    background: transparent;
    --zen-themed-toolbar-bg-transparent: transparent;
    @media (-moz-bool-pref: 'zen.widget.windows.acrylic') {
-      --zen-themed-toolbar-bg-transparent: color-mix(in srgb, var(--zen-themed-toolbar-bg) 75%, transparent 25%);
+      --zen-themed-toolbar-bg-transparent: color-mix(in srgb, var(--zen-themed-toolbar-bg) 35%, transparent 65%);
    }
  }

--- a/src/browser/base/content/zen-styles/zen-workspaces.css
+++ b/src/browser/base/content/zen-styles/zen-workspaces.css
@@ -17,17 +17,18 @@
    display: none !important;
  }

-  &:not([as-button='true']) {
  --toolbarbutton-hover-background: transparent !important;
  border-radius: var(--zen-button-border-radius) !important;
  background: transparent;
-    padding: 2px;
  appearance: unset !important;
  height: fit-content;
  gap: 3px;

+  container-type: inline-size;
+  width: 100%;
+
  & toolbarbutton {
-      margin: auto;
+    margin: 0;
    width: 25px;
    display: flex;
    justify-content: center;
@@ -35,8 +36,43 @@
    align-items: center;
    position: relative;

-      @media (-moz-bool-pref: 'zen.workspaces.hide-deactivated-workspaces') {
-        &:not([active='true']):not(:hover) {
+    & .zen-workspace-icon[no-icon='true'] {
+      width: 6px;
+      height: 6px;
+      background: light-dark(rgba(0, 0, 0, 0.4), rgba(255, 255, 255, 0.4));
+      border-radius: 50%;
+    }
+
+    filter: grayscale(1);
+    opacity: 0.5;
+    transition:
+      filter 0.2s,
+      opacity 0.2s,
+      width 0.1s;
+
+    &[active='true'],
+    &:hover {
+      filter: grayscale(0);
+      opacity: 1;
+    }
+
+    &:hover {
+      background-color: var(--zen-toolbar-element-bg);
+    }
+  }
+
+  &[overflow] {
+    gap: 0 !important;
+
+    & toolbarbutton {
+      margin: 0;
+    }
+
+    & toolbarbutton:not([active='true']),
+    &:has(toolbarbutton:hover) toolbarbutton[active='true'] {
+      &:not(:hover) {
+        width: min(var(--zen-overflowed-workspace-button-width), 25px);
+
        &::after {
          content: '';
          position: absolute;
@@ -59,57 +95,6 @@
        }
      }
    }
-
-      @media not (-moz-bool-pref: 'zen.workspaces.hide-deactivated-workspaces') {
-        & {
-          filter: grayscale(1);
-          opacity: 0.5;
-          transition:
-            filter 0.2s,
-            opacity 0.2s;
-        }
-
-        &[active='true'],
-        &:hover {
-          filter: grayscale(0);
-          opacity: 1;
-        }
-
-        &:hover {
-          background-color: var(--zen-toolbar-element-bg);
-        }
-      }
-    }
-  }
-
-  &[as-button='true'] {
-    border-radius: var(--tab-border-radius);
-
-    &:hover {
-      background: var(--toolbarbutton-hover-background);
-    }
-  }
-
-  &[as-button='true'] {
-    margin: auto;
-    padding: var(--toolbarbutton-inner-padding) !important;
-    width: calc(2 * var(--toolbarbutton-inner-padding) + 16px) !important;
-    height: calc(2 * var(--toolbarbutton-inner-padding) + 16px) !important;
-    border-radius: var(--tab-border-radius) !important;
-
-    :root:not([zen-sidebar-expanded='true']) #navigator-toolbox & {
-      & .zen-workspace-sidebar-name {
-        display: none;
-      }
-
-      & .zen-workspace-sidebar-icon {
-        margin-inline-end: 0 !important;
-      }
-    }
-
-    &:hover {
-      background: var(--toolbarbutton-hover-background) !important;
-    }
  }
 }

@@ -133,13 +118,6 @@

 /** Keep these selectors in sync with the ones in vertical-tabs.css */
 #navigator-toolbox {
-  & #zen-workspaces-button[as-button='true'] {
-    width: calc(100% - var(--toolbarbutton-outer-padding));
-    margin: 2px;
-    min-width: calc(2 * var(--toolbarbutton-inner-padding) + 16px);
-    height: calc(2 * var(--toolbarbutton-inner-padding) + 16px);
-  }
-
  & #zen-workspaces-button .zen-workspace-sidebar-name {
    display: block;
  }
@@ -150,8 +128,6 @@

  & #zen-workspaces-button {
    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
    display: flex;
    gap: 0.5ch;
  }
@@ -457,7 +433,7 @@
 }

 .zen-current-workspace-indicator {
-  padding: 15px calc(4px + var(--tab-inline-padding));
+  padding: calc(15px + var(--zen-toolbox-padding)) calc(4px + var(--tab-inline-padding));
  font-weight: 600;
  position: absolute;
  max-height: var(--zen-workspace-indicator-height);
@@ -475,11 +451,10 @@
    pointer-events: none;
    content: '';
    position: absolute;
-    top: 4px;
-    left: 2px;
-    z-index: -1;
-    width: calc(100% - 4px);
-    height: calc(100% - 10px);
+    top: var(--zen-toolbox-padding);
+    left: calc(var(--zen-toolbox-padding) / 2);
+    width: calc(100% - var(--zen-toolbox-padding));
+    height: calc(100% - var(--zen-toolbox-padding) * 2);
  }

  &:hover,
--- a/src/browser/base/zen-components/ZenCompactMode.mjs
+++ b/src/browser/base/zen-components/ZenCompactMode.mjs
@@ -40,6 +40,14 @@ var gZenCompactModeManager = {

    // Clear hover states when window state changes (minimize, maximize, etc.)
    window.addEventListener('sizemodechange', () => this._clearAllHoverStates());
+
+    if (AppConstants.platform == 'macosx') {
+      window.addEventListener('mouseover', (event) => {
+        const buttons = gZenVerticalTabsManager.actualWindowButtons;
+        if (event.target.closest('.titlebar-buttonbox-container') === buttons) return;
+        buttons.removeAttribute('zen-has-hover');
+      });
+    }
  },

  get preference() {
@@ -72,7 +80,7 @@ var gZenCompactModeManager = {
  },

  get sidebarIsOnRight() {
-    if (this._sidebarIsOnRight) {
+    if (typeof this._sidebarIsOnRight !== 'undefined') {
      return this._sidebarIsOnRight;
    }
    this._sidebarIsOnRight = Services.prefs.getBoolPref('zen.tabs.vertical.right-side');
@@ -337,9 +345,9 @@ var gZenCompactModeManager = {
  },

  flashElement(element, duration, id, attrName = 'flash-popup') {
-    if (element.matches(':hover')) {
-      return;
-    }
+    //if (element.matches(':hover')) {
+    //  return;
+    //}
    if (this._flashTimeouts[id]) {
      clearTimeout(this._flashTimeouts[id]);
    } else {
@@ -363,6 +371,8 @@ var gZenCompactModeManager = {
      let target = this.hoverableElements[i].element;
      const onEnter = (event) => {
        if (event.type === 'mouseenter' && !event.target.matches(':hover')) return;
+        // Dont register the hover if the urlbar is floating and we are hovering over it
+        if (event.target.querySelector('#urlbar[zen-floating-urlbar]')) return;
        this.clearFlashTimeout('has-hover' + target.id);
        window.requestAnimationFrame(() => target.setAttribute('zen-has-hover', 'true'));
      };
--- a/src/browser/base/zen-components/ZenGradientGenerator.mjs
+++ b/src/browser/base/zen-components/ZenGradientGenerator.mjs
@@ -500,9 +500,8 @@
      const centerPosition = { x: rect.width / 2, y: rect.height / 2 };

      const harmonyAngles = getColorHarmonyType(dots.length + (action === 'add' ? 1 : action === 'remove' ? -1 : 0), this.dots);
-      if (!harmonyAngles || harmonyAngles.angles.length === 0) return dots;
-
      this.useAlgo = harmonyAngles.type;
+      if (!harmonyAngles || harmonyAngles.angles.length === 0) return dots;

      let primaryDot = dots.find((dot) => dot.ID === 0);
      if (!primaryDot) return [];
@@ -638,7 +637,7 @@
          }
        });

-        let colorPositions = this.calculateCompliments(this.dots, 'remove', this.useAlgo);
+        let colorPositions = this.calculateCompliments(this.dots, 'remove');
        this.handleColorPositions(colorPositions);
        this.updateCurrentWorkspace();
        return;
@@ -780,7 +779,7 @@
          }
        });

-        let colorPositions = this.calculateCompliments(this.dots, 'remove', this.useAlgo);
+        let colorPositions = this.calculateCompliments(this.dots, 'remove');
        this.handleColorPositions(colorPositions);

        this.updateCurrentWorkspace();
@@ -870,9 +869,12 @@
      if (color.isCustom) {
        return color.c;
      }
-      const toolbarBg = forToolbar ? this.getToolbarModifiedBase() : 'var(--zen-themed-toolbar-bg-transparent)';
+      if (forToolbar) {
+        const toolbarBg = this.getToolbarModifiedBase();
        return `color-mix(in srgb, rgb(${color.c[0]}, ${color.c[1]}, ${color.c[2]}) ${this.currentOpacity * 100}%, ${toolbarBg} ${(1 - this.currentOpacity) * 100}%)`;
      }
+      return `rgba(${color.c[0]}, ${color.c[1]}, ${color.c[2]}, ${this.currentOpacity})`;
+    }

    getGradient(colors, forToolbar = false) {
      const themedColors = this.themedColors(colors);
--- a/src/browser/base/zen-components/ZenMediaController.mjs
+++ b/src/browser/base/zen-components/ZenMediaController.mjs
@@ -6,8 +6,6 @@ class ZenMediaController {
  mediaTitle = null;
  mediaArtist = null;
  mediaControlBar = null;
-  mediaServiceIcon = null;
-  mediaServiceTitle = null;
  mediaProgressBar = null;
  mediaCurrentTime = null;
  mediaDuration = null;
@@ -16,71 +14,104 @@ class ZenMediaController {

  supportedKeys = ['playpause', 'previoustrack', 'nexttrack'];

+  pipEligibilityMap = new Map();
+  mediaControllersMap = new Map();
+
+  _tabTimeout = null;
+  _controllerSwitchTimeout = null;
+
  init() {
+    if (!Services.prefs.getBoolPref('zen.mediacontrols.enabled', true)) return;
+
    this.mediaTitle = document.querySelector('#zen-media-title');
    this.mediaArtist = document.querySelector('#zen-media-artist');
    this.mediaControlBar = document.querySelector('#zen-media-controls-toolbar');
-    this.mediaServiceIcon = document.querySelector('#zen-media-service-button > image');
-    this.mediaServiceTitle = document.querySelector('#zen-media-service-title');
    this.mediaProgressBar = document.querySelector('#zen-media-progress-bar');
    this.mediaCurrentTime = document.querySelector('#zen-media-current-time');
    this.mediaDuration = document.querySelector('#zen-media-duration');
    this.mediaFocusButton = document.querySelector('#zen-media-focus-button');
    this.mediaProgressBarContainer = document.querySelector('#zen-media-progress-hbox');

+    this.onPositionstateChange = this._onPositionstateChange.bind(this);
+    this.onPlaybackstateChange = this._onPlaybackstateChange.bind(this);
+    this.onSupportedKeysChange = this._onSupportedKeysChange.bind(this);
+    this.onMetadataChange = this._onMetadataChange.bind(this);
+    this.onDeactivated = this._onDeactivated.bind(this);
+    this.onPipModeChange = this._onPictureInPictureModeChange.bind(this);
+
    window.addEventListener('TabSelect', (event) => {
+      const linkedBrowser = event.target.linkedBrowser;
+      this.switchController();
+
      if (this._currentBrowser) {
-        if (event.target.linkedBrowser.browserId === this._currentBrowser.browserId) {
-          gZenUIManager.motion
-            .animate(this.mediaControlBar, {
-              opacity: [1, 0],
-              y: [0, 10],
-            })
-            .then(() => {
-              this.mediaControlBar.setAttribute('hidden', 'true');
+        if (linkedBrowser.browserId === this._currentBrowser.browserId) {
+          if (this._tabTimeout) {
+            clearTimeout(this._tabTimeout);
+            this._tabTimeout = null;
+          }
+
+          this.hideMediaControls();
+        } else {
+          this._tabTimeout = setTimeout(() => {
+            if (!this.mediaControlBar.hasAttribute('pip')) this.showMediaControls();
+            else this._tabTimeout = null;
+          }, 500);
+        }
+      }
    });
-        } else if (this.mediaControlBar.hasAttribute('hidden')) {
-          this.mediaControlBar.removeAttribute('hidden');
-          window.requestAnimationFrame(() => {
-            this.mediaControlBar.style.height =
-              this.mediaControlBar.querySelector('toolbaritem').getBoundingClientRect().height + 'px';
-            gZenUIManager.motion.animate(
-              this.mediaControlBar,
-              {
-                opacity: [0, 1],
-                y: [10, 0],
-              },
-              {}
+
+    const onTabDiscardedOrClosed = this.onTabDiscardedOrClosed.bind(this);
+    window.addEventListener('TabClose', onTabDiscardedOrClosed);
+
+    window.addEventListener('DOMAudioPlaybackStarted', (event) => {
+      setTimeout(() => {
+        if (
+          this._currentMediaController?.isPlaying &&
+          this.mediaControlBar.hasAttribute('hidden') &&
+          !this.mediaControlBar.hasAttribute('pip')
+        ) {
+          const { selectedBrowser } = gBrowser;
+          if (selectedBrowser.browserId !== this._currentBrowser.browserId) {
+            this.showMediaControls();
+          }
+        }
+      }, 1000);
+
+      this.activateMediaControls(event.target.browsingContext.mediaController, event.target);
+    });
+
+    window.addEventListener('DOMAudioPlaybackStopped', () => this.updateMuteState());
+  }
+
+  onTabDiscardedOrClosed(event) {
+    const linkedBrowser = event.target.linkedBrowser;
+    if (!linkedBrowser?.browsingContext?.mediaController) return;
+    this.deinitMediaController(
+      linkedBrowser.browsingContext.mediaController,
+      true,
+      linkedBrowser.browserId === this._currentBrowser?.browserId,
+      true
    );
-          });
  }

-        gZenUIManager.updateTabsToolbar();
-      }
-    });
-
-    window.addEventListener('TabClose', (event) => {
-      if (this._currentBrowser) {
-        if (event.target.linkedBrowser.browserId === this._currentBrowser.browserId) {
-          this.deinitMediaController(this._currentMediaController);
-        }
-      }
-    });
-  }
-
-  /**
-   * Deinitializes a media controller, removing all event listeners and resetting state.
-   * @param {Object} mediaController - The media controller to deinitialize.
-   */
-  deinitMediaController(mediaController) {
+  async deinitMediaController(mediaController, shouldForget = true, shouldOverride = true, shouldHide = true) {
    if (!mediaController) return;

-    mediaController.onpositionstatechange = null;
-    mediaController.onplaybackstatechange = null;
-    mediaController.onsupportedkeyschange = null;
-    mediaController.onmetadatachange = null;
-    mediaController.ondeactivated = null;
+    const retrievedMediaController = this.mediaControllersMap.get(mediaController.id);

+    if (shouldForget) {
+      mediaController.removeEventListener('pictureinpicturemodechange', this.onPipModeChange);
+      mediaController.removeEventListener('positionstatechange', this.onPositionstateChange);
+      mediaController.removeEventListener('playbackstatechange', this.onPlaybackstateChange);
+      mediaController.removeEventListener('supportedkeyschange', this.onSupportedKeysChange);
+      mediaController.removeEventListener('metadatachange', this.onMetadataChange);
+      mediaController.removeEventListener('deactivated', this.onDeactivated);
+
+      this.mediaControllersMap.delete(mediaController.id);
+      this.pipEligibilityMap.delete(retrievedMediaController?.browser?.browserId);
+    }
+
+    if (shouldOverride) {
      this._currentMediaController = null;
      this._currentBrowser = null;

@@ -89,41 +120,109 @@ class ZenMediaController {
        this._mediaUpdateInterval = null;
      }

-    this.mediaControlBar.setAttribute('hidden', 'true');
+      if (shouldHide) await this.hideMediaControls();
      this.mediaControlBar.removeAttribute('muted');
      this.mediaControlBar.classList.remove('playing');
-
-    gZenUIManager.updateTabsToolbar();
+    }
  }

-  /**
-   * Sets up the media control UI with metadata and position state.
-   * @param {Object} metadata - The media metadata (title, artist, etc.).
-   * @param {Object} positionState - The position state (position, duration).
-   */
-  setupMediaControl(metadata, positionState) {
-    if (!this.mediaControlBar.classList.contains('playing')) {
+  hideMediaControls() {
+    if (this.mediaControlBar.hasAttribute('hidden')) return;
+
+    return gZenUIManager.motion
+      .animate(
+        this.mediaControlBar,
+        {
+          opacity: [1, 0],
+          y: [0, 10],
+        },
+        {
+          duration: 0.1,
+        }
+      )
+      .then(() => {
+        this.mediaControlBar.setAttribute('hidden', 'true');
+        gZenUIManager.updateTabsToolbar();
+        gZenUIManager.restoreScrollbarState();
+      });
+  }
+
+  showMediaControls() {
+    if (this._currentMediaController.isBeingUsedInPIPModeOrFullscreen) return this.hideMediaControls();
+    if (!this.mediaControlBar.hasAttribute('hidden')) return;
+
+    this.updatePipButton();
+    const mediaInfoElements = [this.mediaTitle, this.mediaArtist];
+    for (const element of mediaInfoElements) {
+      element.removeAttribute('overflow'); // So we can properly recalculate the overflow
+    }
+
+    this.mediaControlBar.removeAttribute('hidden');
+    window.requestAnimationFrame(() => {
+      this.mediaControlBar.style.height =
+        this.mediaControlBar.querySelector('toolbaritem').getBoundingClientRect().height + 'px';
+      this.mediaControlBar.style.opacity = 0;
+      gZenUIManager.updateTabsToolbar();
+      gZenUIManager.restoreScrollbarState();
+      gZenUIManager.motion.animate(
+        this.mediaControlBar,
+        {
+          opacity: [0, 1],
+          y: [10, 0],
+        },
+        {}
+      );
+      this.addLabelOverflows(mediaInfoElements);
+    });
+  }
+
+  addLabelOverflows(elements) {
+    for (const element of elements) {
+      const parent = element.parentElement;
+      if (element.scrollWidth > parent.clientWidth) {
+        element.setAttribute('overflow', '');
+      } else {
+        element.removeAttribute('overflow');
+      }
+    }
+  }
+
+  setupMediaController(mediaController, browser) {
+    this._currentMediaController = mediaController;
+    this._currentBrowser = browser;
+
+    this.updatePipButton();
+
+    const positionState = mediaController.getPositionState();
+    this.mediaControllersMap.set(mediaController.id, {
+      controller: mediaController,
+      browser,
+      position: positionState.position,
+      duration: positionState.duration,
+      lastUpdated: Date.now(),
+    });
+  }
+
+  setupMediaControlUI(metadata, positionState) {
+    this.updatePipButton();
+
+    if (!this.mediaControlBar.classList.contains('playing') && this._currentMediaController.isPlaying) {
      this.mediaControlBar.classList.add('playing');
    }

-    // Have it displayed as e.g. <white>youtube</white><grey>.com</grey>
-    let host = this._currentBrowser._originalURI.displayHost;
-    if (host.startsWith('www.')) host = host.slice(4);
-    // note: we might have subdomains, so we need to split the host
-    const [service, ...tld] = host.split('.');
-    this.mediaServiceTitle.querySelector('.service').textContent = service;
-    this.mediaServiceTitle.querySelector('.tld').textContent = '.' + tld.join('.');
-
-    this.mediaServiceIcon.src = this._currentBrowser.mIconURL;
-    this.mediaFocusButton.style.listStyleImage = `url(${this._currentBrowser.mIconURL})`;
+    const iconURL = this._currentBrowser.mIconURL || `page-icon:${this._currentBrowser.currentURI.spec}`;
+    this.mediaFocusButton.style.listStyleImage = `url(${iconURL})`;

    this.mediaTitle.textContent = metadata.title || '';
    this.mediaArtist.textContent = metadata.artist || '';

    gZenUIManager.updateTabsToolbar();
+    gZenUIManager.restoreScrollbarState();

    this._currentPosition = positionState.position;
    this._currentDuration = positionState.duration;
+    this._currentPlaybackRate = positionState.playbackRate;
+
    this.updateMediaPosition();

    for (const key of this.supportedKeys) {
@@ -132,92 +231,137 @@ class ZenMediaController {
    }
  }

-  /**
-   * @param {Object} mediaController - The media controller to activate.
-   * @param {Object} browser - The browser associated with the media controller.
-   */
  activateMediaControls(mediaController, browser) {
    this.updateMuteState();
+    this.switchController();

-    if (this._currentBrowser?.browserId === browser.browserId) return;
-    else {
-      this.deinitMediaController(this._currentMediaController);
-      this._currentMediaController = mediaController;
-      this._currentBrowser = browser;
-    }
-
-    mediaController.onpositionstatechange = this.onPositionstateChange.bind(this);
-    mediaController.onplaybackstatechange = this.onPlaybackstateChange.bind(this);
-    mediaController.onsupportedkeyschange = this.onSupportedKeysChange.bind(this);
-    mediaController.onmetadatachange = this.onMetadataChange.bind(this);
-    mediaController.ondeactivated = this.onDeactivated.bind(this);
+    if (!mediaController.isActive || this._currentBrowser?.browserId === browser.browserId) return;

    const metadata = mediaController.getMetadata();
    const positionState = mediaController.getPositionState();
+    this.mediaControllersMap.set(mediaController.id, {
+      controller: mediaController,
+      browser,
+      position: positionState.position,
+      duration: positionState.duration,
+      lastUpdated: Date.now(),
+    });

-    this.setupMediaControl(metadata, positionState);
+    if (!this._currentBrowser) {
+      this.setupMediaController(mediaController, browser);
+      this.setupMediaControlUI(metadata, positionState);
    }

-  /**
-   * @param {Event} event - The deactivation event.
-   */
-  onDeactivated(event) {
-    if (event.target === this._currentMediaController) {
-      this.deinitMediaController(event.target);
+    mediaController.addEventListener('pictureinpicturemodechange', this.onPipModeChange);
+    mediaController.addEventListener('positionstatechange', this.onPositionstateChange);
+    mediaController.addEventListener('playbackstatechange', this.onPlaybackstateChange);
+    mediaController.addEventListener('supportedkeyschange', this.onSupportedKeysChange);
+    mediaController.addEventListener('metadatachange', this.onMetadataChange);
+    mediaController.addEventListener('deactivated', this.onDeactivated);
+  }
+
+  updatePipEligibility(browser, isEligible) {
+    this.pipEligibilityMap.set(browser.browserId, isEligible);
+  }
+
+  _onDeactivated(event) {
+    this.deinitMediaController(event.target, true, event.target.id === this._currentMediaController.id, true);
+    this.switchController();
+  }
+
+  _onPlaybackstateChange() {
+    if (this._currentMediaController?.isPlaying) {
+      this.mediaControlBar.classList.add('playing');
+    } else {
+      this.switchController();
+      this.mediaControlBar.classList.remove('playing');
    }
  }

-  /**
-   * Updates playback state and UI based on changes.
-   * @param {Event} event - The playback state change event.
-   */
-  onPlaybackstateChange(event) {
-    this.mediaControlBar.classList.toggle('playing', event.target.isPlaying);
-  }
-
-  /**
-   * Updates supported keys in the UI.
-   * @param {Event} event - The supported keys change event.
-   */
-  onSupportedKeysChange(event) {
+  _onSupportedKeysChange(event) {
+    if (event.target.id !== this._currentMediaController?.id) return;
    for (const key of this.supportedKeys) {
      const button = this.mediaControlBar.querySelector(`#zen-media-${key}-button`);
      button.disabled = !event.target.supportedKeys.includes(key);
    }
  }

-  /**
-   * Updates position state and UI when the media position changes.
-   * @param {Event} event - The position state change event.
-   */
-  onPositionstateChange(event) {
-    if (event.target !== this._currentMediaController) return;
+  _onPositionstateChange(event) {
+    const mediaController = this.mediaControllersMap.get(event.target.id);
+    this.mediaControllersMap.set(event.target.id, {
+      ...mediaController,
+      position: event.position,
+      duration: event.duration,
+      lastUpdated: Date.now(),
+    });
+
+    if (event.target.id !== this._currentMediaController?.id) return;

    this._currentPosition = event.position;
    this._currentDuration = event.duration;
+    this._currentPlaybackRate = event.playbackRate;
+
    this.updateMediaPosition();
  }

-  /**
-   * Updates the media progress bar and time display.
-   */
+  switchController(force = false) {
+    let timeout = 3000;
+
+    if (this._controllerSwitchTimeout) {
+      clearTimeout(this._controllerSwitchTimeout);
+      this._controllerSwitchTimeout = null;
+    }
+
+    if (this.mediaControllersMap.size === 1) timeout = 0;
+    this._controllerSwitchTimeout = setTimeout(() => {
+      if (!this._currentMediaController?.isPlaying || force) {
+        const nextController = Array.from(this.mediaControllersMap.values())
+          .filter(
+            (ctrl) =>
+              ctrl.controller.isPlaying &&
+              gBrowser.selectedBrowser.browserId !== ctrl.browser.browserId &&
+              ctrl.controller.id !== this._currentMediaController?.id
+          )
+          .sort((a, b) => b.lastUpdated - a.lastUpdated)
+          .shift();
+
+        if (nextController) {
+          this.deinitMediaController(this._currentMediaController, false, true).then(() => {
+            this.setupMediaController(nextController.controller, nextController.browser);
+            const elapsedTime = Math.floor((Date.now() - nextController.lastUpdated) / 1000);
+
+            this.setupMediaControlUI(nextController.controller.getMetadata(), {
+              position: nextController.position + (nextController.controller.isPlaying ? elapsedTime : 0),
+              duration: nextController.duration,
+            });
+
+            this.showMediaControls();
+          });
+        }
+      }
+
+      this._controllerSwitchTimeout = null;
+    }, timeout);
+  }
+
  updateMediaPosition() {
    if (this._mediaUpdateInterval) {
      clearInterval(this._mediaUpdateInterval);
      this._mediaUpdateInterval = null;
    }

-    if (this._currentDuration >= 900_000) return this.mediaProgressBarContainer.setAttribute('hidden', 'true');
-    else this.mediaProgressBarContainer.removeAttribute('hidden');
+    if (this._currentDuration >= 900_000) return this.mediaControlBar.setAttribute('media-position-hidden', 'true');
+    else this.mediaControlBar.removeAttribute('media-position-hidden');
+
+    if (!this._currentDuration) return;

    this.mediaCurrentTime.textContent = this.formatSecondsToTime(this._currentPosition);
    this.mediaDuration.textContent = this.formatSecondsToTime(this._currentDuration);
    this.mediaProgressBar.value = (this._currentPosition / this._currentDuration) * 100;

-    if (this._currentMediaController?.isPlaying) {
    this._mediaUpdateInterval = setInterval(() => {
      if (this._currentMediaController?.isPlaying) {
-          this._currentPosition += 1;
+        this._currentPosition += 1 * this._currentPlaybackRate;
        if (this._currentPosition > this._currentDuration) {
          this._currentPosition = this._currentDuration;
        }
@@ -229,13 +373,7 @@ class ZenMediaController {
      }
    }, 1000);
  }
-  }

-  /**
-   * Formats seconds into a hours:minutes:seconds string.
-   * @param {number} seconds - The time in seconds.
-   * @returns {string} Formatted time string.
-   */
  formatSecondsToTime(seconds) {
    if (!seconds || isNaN(seconds)) return '0:00';

@@ -251,14 +389,35 @@ class ZenMediaController {
    return `${minutes}:${secs.padStart(2, '0')}`;
  }

-  /**
-   * Updates metadata in the UI.
-   * @param {Event} event - The metadata change event.
-   */
-  onMetadataChange(event) {
+  _onMetadataChange(event) {
+    if (event.target.id !== this._currentMediaController?.id) return;
+    this.updatePipButton();
+
    const metadata = event.target.getMetadata();
    this.mediaTitle.textContent = metadata.title || '';
    this.mediaArtist.textContent = metadata.artist || '';
+
+    const mediaInfoElements = [this.mediaTitle, this.mediaArtist];
+    for (const element of mediaInfoElements) {
+      element.removeAttribute('overflow');
+    }
+
+    this.addLabelOverflows(mediaInfoElements);
+  }
+
+  _onPictureInPictureModeChange(event) {
+    if (event.target.id !== this._currentMediaController?.id) return;
+    if (event.target.isBeingUsedInPIPModeOrFullscreen) {
+      this.hideMediaControls();
+      this.mediaControlBar.setAttribute('pip', '');
+    } else {
+      const { selectedBrowser } = gBrowser;
+      if (selectedBrowser.browserId !== this._currentBrowser.browserId) {
+        this.showMediaControls();
+      }
+
+      this.mediaControlBar.removeAttribute('pip');
+    }
  }

  onMediaPlayPrev() {
@@ -288,7 +447,10 @@ class ZenMediaController {
  }

  onMediaFocus() {
-    this._currentMediaController?.focus();
+    if (!this._currentBrowser) return;
+    const sidebarId = this._currentBrowser.getAttribute('zen-sidebar-id');
+    if (sidebarId) gZenBrowserManagerSidebar.open(sidebarId);
+    else this._currentMediaController?.focus();
  }

  onMediaMute() {
@@ -309,6 +471,18 @@ class ZenMediaController {
    }
  }

+  onControllerClose() {
+    this._currentMediaController?.pause();
+    this.switchController(true);
+    this.deinitMediaController(this._currentMediaController);
+  }
+
+  onMediaPip() {
+    this._currentBrowser.browsingContext.currentWindowGlobal
+      .getActor('PictureInPictureLauncher')
+      .sendAsyncMessage('PictureInPicture:KeyToggle');
+  }
+
  updateMuteState() {
    if (!this._currentBrowser) return;
    if (this._currentBrowser._audioMuted) {
@@ -317,6 +491,12 @@ class ZenMediaController {
      this.mediaControlBar.removeAttribute('muted');
    }
  }
+
+  updatePipButton() {
+    const isPipEligible = this.pipEligibilityMap.get(this._currentBrowser.browserId);
+    if (isPipEligible) this.mediaControlBar.setAttribute('can-pip', '');
+    else this.mediaControlBar.removeAttribute('can-pip');
+  }
 }

 window.gZenMediaController = new ZenMediaController();
--- a/src/browser/base/zen-components/ZenPinnedTabManager.mjs
+++ b/src/browser/base/zen-components/ZenPinnedTabManager.mjs
@@ -510,6 +510,10 @@
        case 'unload-switch':
        case 'reset-switch':
        case 'switch':
+          let { permitUnload } = selectedTab.linkedBrowser?.permitUnload();
+          if (!permitUnload) {
+            return;
+          }
          this._handleTabSwitch(selectedTab);
          if (behavior.includes('reset')) {
            this._resetTabToStoredState(selectedTab);
@@ -520,8 +524,7 @@
            }
            // Do not unload about:* pages
            if (!selectedTab.linkedBrowser?.currentURI.spec.startsWith('about:')) {
-              gBrowser.explicitUnloadTabs([selectedTab]);
-              selectedTab.removeAttribute('linkedpanel');
+              gZenTabUnloader.explicitUnloadTabs([selectedTab], { permitUnload });
            }
          }
          break;
@@ -831,7 +834,7 @@
    removeTabContainersDragoverClass() {
      this.dragIndicator.remove();
      this._dragIndicator = null;
-      ZenWorkspaces.activeWorkspaceIndicator.removeAttribute('open');
+      ZenWorkspaces.activeWorkspaceIndicator?.removeAttribute('open');
    }

    get dragIndicator() {
@@ -891,9 +894,9 @@
      targetTab = targetTab?.group || targetTab;
      if (event.target.closest('.zen-current-workspace-indicator')) {
        this.removeTabContainersDragoverClass();
-        ZenWorkspaces.activeWorkspaceIndicator.setAttribute('open', true);
+        ZenWorkspaces.activeWorkspaceIndicator?.setAttribute('open', true);
      } else {
-        ZenWorkspaces.activeWorkspaceIndicator.removeAttribute('open');
+        ZenWorkspaces.activeWorkspaceIndicator?.removeAttribute('open');
      }

      // If there's no valid target tab, nothing to do
--- a/src/browser/base/zen-components/ZenSidebarManager.mjs
+++ b/src/browser/base/zen-components/ZenSidebarManager.mjs
@@ -280,8 +280,10 @@ class ZenBrowserManagerSidebar extends ZenDOMOperatedFeature {
    this.close();
  }

-  open() {
+  open(id = null) {
    let sidebar = document.getElementById('zen-sidebar-web-panel');
+    if (id) this._currentPanel = id;
+
    sidebar.removeAttribute('hidden');
    this.update();
  }
--- a/src/browser/base/zen-components/ZenTabUnloader.mjs
+++ b/src/browser/base/zen-components/ZenTabUnloader.mjs
@@ -22,8 +22,6 @@
      'TabAttrModified',
      'TabPinned',
      'TabUnpinned',
-      'TabBrowserInserted',
-      'TabBrowserDiscarded',
      'TabShow',
      'TabHide',
      'TabOpen',
@@ -150,8 +148,6 @@
      switch (action) {
        case 'TabPinned':
        case 'TabUnpinned':
-        case 'TabBrowserInserted':
-        case 'TabBrowserDiscarded':
        case 'TabShow':
        case 'TabHide':
          break;
@@ -235,9 +231,9 @@
      this.explicitUnloadTabs(tabs);
    }

-    explicitUnloadTabs(tabs) {
+    explicitUnloadTabs(tabs, extraArgs = {}) {
      for (let i = 0; i < tabs.length; i++) {
-        if (this.canUnloadTab(tabs[i], Date.now(), this.intervalUnloader.excludedUrls, true)) {
+        if (this.canUnloadTab(tabs[i], Date.now(), this.intervalUnloader.excludedUrls, true, extraArgs)) {
          this.unload(tabs[i]);
        }
      }
@@ -259,15 +255,15 @@
      }
    }

-    canUnloadTab(tab, currentTimestamp, excludedUrls, ignoreTimestamp = false) {
+    canUnloadTab(tab, currentTimestamp, excludedUrls, ignoreTimestamp = false, extraArgs = {}) {
      if (
        (tab.pinned && !ignoreTimestamp) ||
        tab.selected ||
        (tab.multiselected && !ignoreTimestamp) ||
        (tab.hasAttribute('busy') && !ignoreTimestamp) ||
-        tab.hasAttribute('pending') ||
        !tab.linkedPanel ||
        tab.splitView ||
+        tab.group?.hasAttribute('split-view-group') ||
        tab.attention ||
        tab.hasAttribute('glance-id') ||
        tab.linkedBrowser?.zenModeActive ||
@@ -280,7 +276,7 @@
        return false;
      }
      if (ignoreTimestamp) {
-        return true;
+        return this._tabPermitsUnload(tab, extraArgs);
      }
      const lastActivity = tab.lastActivity;
      if (!lastActivity) {
@@ -288,7 +284,13 @@
      }
      const diff = currentTimestamp - lastActivity;
      // Check if the tab has been inactive for more than the timeout
-      return diff > lazy.zenTabUnloaderTimeout * 60 * 1000;
+      return diff > lazy.zenTabUnloaderTimeout * 60 * 1000 && this._tabPermitsUnload(tab, extraArgs);
+    }
+
+    _tabPermitsUnload(tab, extraArgs) {
+      return typeof extraArgs.permitUnload === 'undefined'
+        ? tab.linkedBrowser?.permitUnload()?.permitUnload
+        : extraArgs.permitUnload;
    }
  }

--- a/src/browser/base/zen-components/ZenViewSplitter.mjs
+++ b/src/browser/base/zen-components/ZenViewSplitter.mjs
@@ -49,9 +49,13 @@ class SplitNode extends SplitLeafNode {
    return this._children;
  }

-  addChild(child) {
+  addChild(child, prepend = true) {
    child.parent = this;
+    if (prepend) {
      this._children.unshift(child);
+    } else {
+      this._children.push(child);
+    }
  }
 }

@@ -226,11 +230,13 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
      const halfWidth = panelsWidth / 2;
      const side = event.clientX > halfWidth ? 'right' : 'left';
      this.fakeBrowser = document.createXULElement('vbox');
-      this.fakeBrowser.addEventListener('dragleave', this.onBrowserDragEndToSplit);
      window.addEventListener('dragend', this.onBrowserDragEndToSplit, { once: true });
      const padding = Services.prefs.getIntPref('zen.theme.content-element-separation', 0);
      this.fakeBrowser.setAttribute('flex', '1');
      this.fakeBrowser.id = 'zen-split-view-fake-browser';
+      if (oldTab.splitView) {
+        this.fakeBrowser.setAttribute('has-split-view', 'true');
+      }
      gBrowser.tabbox.appendChild(this.fakeBrowser);
      this.fakeBrowser.style.setProperty('--zen-split-view-fake-icon', `url(${draggedTab.getAttribute('image')})`);
      draggedTab._visuallySelected = true;
@@ -270,6 +276,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
      ]);
      if (this._finishAllAnimatingPromise) {
        this._finishAllAnimatingPromise.then(() => {
+          this.fakeBrowser.addEventListener('dragleave', this.onBrowserDragEndToSplit);
          this._canDrop = true;
          draggedTab._visuallySelected = true;
        });
@@ -988,10 +995,10 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
    this.activateSplitView(splitData);
  }

-  addTabToSplit(tab, splitNode) {
+  addTabToSplit(tab, splitNode, prepend = true) {
    const reduce = splitNode.children.length / (splitNode.children.length + 1);
    splitNode.children.forEach((c) => (c.sizeInParent *= reduce));
-    splitNode.addChild(new SplitLeafNode(tab, (1 - reduce) * 100));
+    splitNode.addChild(new SplitLeafNode(tab, (1 - reduce) * 100), prepend);
  }

  /**
@@ -1599,7 +1606,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
            if (parentNode.direction !== splitDirection) {
              this.splitIntoNode(droppedOnSplitNode, new SplitLeafNode(draggedTab, 50), hoverSide, 0.5);
            } else {
-              this.addTabToSplit(draggedTab, parentNode);
+              this.addTabToSplit(draggedTab, parentNode, /* prepend = */ hoverSide === 'left' || hoverSide === 'top');
            }
          } else {
            this.addTabToSplit(draggedTab, group.layoutTree);
--- a/src/browser/base/zen-components/ZenWelcome.mjs
+++ b/src/browser/base/zen-components/ZenWelcome.mjs
@@ -52,13 +52,6 @@
    }
  }

-  function openWelcomeTab() {
-    const tab = window.gBrowser.addTrustedTab('https://zen-browser.app/welcome', {
-      inBackground: true,
-    });
-    gBrowser.selectedTab = tab;
-  }
-
  class ZenWelcomePages {
    constructor(pages) {
      this._currentPage = -1;
@@ -410,7 +403,6 @@
            _tabsToPinEssentials.push(createdTab);
          }
          openInitialPinTab();
-          openWelcomeTab();
        },
      },
      {
--- a/src/browser/base/zen-components/ZenWorkspaces.mjs
+++ b/src/browser/base/zen-components/ZenWorkspaces.mjs
@@ -36,10 +36,6 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
    this._resolveInitialized = resolve;
  });

-  promiseEmptyTabInitialized = new Promise((resolve) => {
-    this._resolveEmptyTabInitialized = resolve;
-  });
-
  workspaceIndicatorXUL = `
    <hbox class="zen-current-workspace-indicator-icon"></hbox>
    <hbox class="zen-current-workspace-indicator-name"></hbox>
@@ -61,13 +57,6 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
    XPCOMUtils.defineLazyPreferenceGetter(this, 'activationMethod', 'zen.workspaces.scroll-modifier-key', 'ctrl');
    XPCOMUtils.defineLazyPreferenceGetter(this, 'naturalScroll', 'zen.workspaces.natural-scroll', true);
    XPCOMUtils.defineLazyPreferenceGetter(this, 'shouldWrapAroundNavigation', 'zen.workspaces.wrap-around-navigation', true);
-    XPCOMUtils.defineLazyPreferenceGetter(
-      this,
-      'shouldShowIconStrip',
-      'zen.workspaces.show-icon-strip',
-      true,
-      this._expandWorkspacesStrip.bind(this)
-    );
    XPCOMUtils.defineLazyPreferenceGetter(
      this,
      'shouldForceContainerTabsToWorkspace',
@@ -88,6 +77,8 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
    );
    ChromeUtils.defineLazyGetter(this, 'tabContainer', () => document.getElementById('tabbrowser-tabs'));
    this._activeWorkspace = Services.prefs.getStringPref('zen.workspaces.active', '');
+
+    window.addEventListener('resize', this.onWindowResize.bind(this));
  }

  async afterLoadInit() {
@@ -143,7 +134,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
  async _createDefaultWorkspaceIfNeeded() {
    const workspaces = await this._workspaces();
    if (!workspaces.workspaces.length) {
-      await this.createAndSaveWorkspace('Default Workspace', true, '🏠', true);
+      await this.createAndSaveWorkspace('Default', true, null, true);
      this._workspaceCache = null;
    }
  }
@@ -610,6 +601,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
      } catch (e) {
        console.error('ZenWorkspaces: Error initializing theme picker', e);
      }
+      this.onWindowResize();
      await this._selectStartPage();
      this._fixTabPositions();
      this._resolveInitialized();
@@ -621,11 +613,15 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
    if (Services.prefs.getBoolPref('zen.workspaces.disable_empty_state_for_testing', false)) {
      return;
    }
+    if (this._initialTab) {
+      this.moveTabToWorkspace(this._initialTab, this.activeWorkspace);
+      gBrowser.selectedTab = this._initialTab;
+      gBrowser.moveTabTo(this._initialTab, 0, { forceStandaloneTab: true });
+      this._initialTab._possiblyEmpty = false;
+      this._initialTab = null;
+    }
    const currentTab = gBrowser.selectedTab;
    let showed = false;
-    await this.promiseEmptyTabInitialized;
-    this._resolveEmptyTabInitialized = null;
-    this.promiseEmptyTabInitialized = null;
    if (currentTab.pinned) {
      this.selectEmptyTab();
      try {
@@ -640,8 +636,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
      if (
        (currentTab.isEmpty &&
          (currentTab.getAttribute('image') === gPageIcons[currentTabURL] || !currentTab.hasAttribute('image'))) ||
-        currentTab.hasAttribute('zen-empty-tab') ||
-        (currentTab._possibleEmptyTab && currentTab.isEmpty)
+        currentTab._possiblyEmpty
      ) {
        this.selectEmptyTab();
        this._removedByStartupPage = true;
@@ -654,6 +649,14 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
    }
  }

+  handleInitialTab(tab, isEmpty) {
+    if (isEmpty) {
+      tab._possiblyEmpty = true;
+    } else {
+      this._initialTab = tab;
+    }
+  }
+
  initIndicatorContextMenu(indicator) {
    const th = (event) => {
      event.preventDefault();
@@ -870,6 +873,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
    await ZenWorkspacesStorage.removeWorkspace(windowID);
    await this._propagateWorkspaceData();
    await this._updateWorkspacesChangeContextMenu();
+    this.onWindowResize();
  }

  isWorkspaceActive(workspace) {
@@ -1316,7 +1320,6 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {

    button.setAttribute('showInPrivateBrowsing', 'false');
    button.setAttribute('tooltiptext', 'Workspaces');
-    if (this.shouldShowIconStrip) {
    let workspaces = await this._workspaces();

    for (let workspace of workspaces.workspaces) {
@@ -1345,7 +1348,11 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {

      let icon = browser.document.createXULElement('div');
      icon.className = 'zen-workspace-icon';
+      if (this.workspaceHasIcon(workspace)) {
        icon.textContent = this.getWorkspaceIcon(workspace);
+      } else {
+        icon.setAttribute('no-icon', 'true');
+      }
      workspaceButton.appendChild(icon);
      button.appendChild(workspaceButton);
    }
@@ -1362,36 +1369,6 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
      this.openWorkspacesDialog(event);
    };
    button.addEventListener('contextmenu', this._workspaceButtonContextMenuListener.bind(browser.ZenWorkspaces));
-    } else {
-      let activeWorkspace = await this.getActiveWorkspace();
-      if (activeWorkspace) {
-        button.setAttribute('as-button', 'true');
-        button.classList.add('toolbarbutton-1', 'zen-sidebar-action-button');
-
-        this._workspacesButtonClickListener = browser.ZenWorkspaces.openWorkspacesDialog.bind(browser.ZenWorkspaces);
-        button.addEventListener('click', this._workspacesButtonClickListener);
-
-        const wrapper = browser.document.createXULElement('hbox');
-        wrapper.className = 'zen-workspace-sidebar-wrapper';
-
-        const icon = browser.document.createXULElement('div');
-        icon.className = 'zen-workspace-sidebar-icon';
-        icon.textContent = this.getWorkspaceIcon(activeWorkspace);
-
-        const name = browser.document.createXULElement('div');
-        name.className = 'zen-workspace-sidebar-name';
-        name.textContent = activeWorkspace.name;
-
-        if (!this.workspaceHasIcon(activeWorkspace)) {
-          icon.setAttribute('no-icon', 'true');
-        }
-
-        wrapper.appendChild(icon);
-        wrapper.appendChild(name);
-
-        button.appendChild(wrapper);
-      }
-    }
  }

  closeWorkspacesSubView() {
@@ -1955,6 +1932,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
      }
      await this.changeWorkspace(workspaceData);
    }
+    this.onWindowResize();
    return workspaceData;
  }

@@ -2373,9 +2351,12 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {

  async switchIfNeeded(browser, i) {
    const tab = gBrowser.getTabForBrowser(browser);
-    const workspaceId = tab.getAttribute('zen-workspace-id');
-    if (!tab.hasAttribute('zen-essential') && workspaceId !== this.activeWorkspace) {
-      await this.changeWorkspace({ uuid: workspaceId });
+    await this.switchTabIfNeeded(tab);
+  }
+
+  async switchTabIfNeeded(tab) {
+    if (!tab.hasAttribute('zen-essential') && tab.getAttribute('zen-workspace-id') !== this.activeWorkspace) {
+      await this.changeWorkspace({ uuid: tab.getAttribute('zen-workspace-id') });
    }
    gBrowser.selectedTab = tab;
  }
@@ -2392,4 +2373,26 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
    const workspace = workspaces.workspaces.find((workspace) => workspace.uuid === activeWorkspace);
    return workspace.containerTabId;
  }
+
+  onWindowResize(event = undefined) {
+    if (!(!event || event.target === window)) return;
+    // Check if workspace icons overflow the parent container
+    const parent = document.getElementById('zen-workspaces-button');
+    if (!parent || this._processingResize) {
+      return;
+    }
+    this._processingResize = true;
+    // Once we are overflowing, we align the buttons to always stay inside the container,
+    // meaning we need to remove the overflow attribute to reset the width
+    parent.removeAttribute('overflow');
+    requestAnimationFrame(() => {
+      const overflow = parent.scrollWidth > parent.clientWidth;
+      parent.toggleAttribute('overflow', overflow);
+      // The maximum width a button has when it overflows based on the number of buttons
+      const numButtons = parent.children.length + 1; // +1 to exclude the active button
+      const maxWidth = 100 / numButtons;
+      parent.style.setProperty('--zen-overflowed-workspace-button-width', `${maxWidth}%`);
+      this._processingResize = false;
+    });
+  }
 })();
--- a/src/browser/base/zen-components/moz.build
+++ b/src/browser/base/zen-components/moz.build
@@ -2,3 +2,10 @@
 BROWSER_CHROME_MANIFESTS += [
    "tests/browser.toml",
 ]
+
+FINAL_TARGET_FILES.actors += [
+    "actors/ZenGlanceChild.sys.mjs",
+    "actors/ZenGlanceParent.sys.mjs",
+    "actors/ZenThemeMarketplaceChild.sys.mjs",
+    "actors/ZenThemeMarketplaceParent.sys.mjs",
+]
--- a/src/browser/components/customizableui/CustomizableUI-sys-mjs.patch
+++ b/src/browser/components/customizableui/CustomizableUI-sys-mjs.patch
@@ -1,5 +1,5 @@
 diff --git a/browser/components/customizableui/CustomizableUI.sys.mjs b/browser/components/customizableui/CustomizableUI.sys.mjs
-index e6b9b7dcfab179e7552c146eb1551b45ad042266..d9d838a7a51f67b52b69f419024cc3174ae5260b 100644
+index 8eab0f9181c19c68a0a2daf0f819b3ae82ed92bc..092107b377ec4f7bc9ae86c817cded349732ffc6 100644
 --- a/browser/components/customizableui/CustomizableUI.sys.mjs
 +++ b/browser/components/customizableui/CustomizableUI.sys.mjs
@@ -13,6 +13,7 @@ ChromeUtils.defineESModuleGetters(lazy, {
@@ -116,7 +116,7 @@ index e6b9b7dcfab179e7552c146eb1551b45ad042266..d9d838a7a51f67b52b69f419024cc317
             win.setToolbarVisibility(
               areaNode,
               typeof defaultCollapsed == "string"
-@@ -4658,6 +4656,7 @@ export var CustomizableUI = {
+@@ -4857,6 +4855,7 @@ export var CustomizableUI = {
   unregisterArea(aName, aDestroyPlacements) {
     CustomizableUIInternal.unregisterArea(aName, aDestroyPlacements);
   },
@@ -124,7 +124,7 @@ index e6b9b7dcfab179e7552c146eb1551b45ad042266..d9d838a7a51f67b52b69f419024cc317
   /**
    * Add a widget to an area.
    * If the area to which you try to add is not known to CustomizableUI,
-@@ -6483,11 +6482,11 @@ class OverflowableToolbar {
+@@ -6840,11 +6839,11 @@ class OverflowableToolbar {
         parseFloat(style.paddingLeft) -
         parseFloat(style.paddingRight) -
         toolbarChildrenWidth;
@@ -134,11 +134,11 @@ index e6b9b7dcfab179e7552c146eb1551b45ad042266..d9d838a7a51f67b52b69f419024cc317
         this.#target == this.#toolbar
           ? toolbarChildrenWidth
 -          : sumChildrenInlineSize(this.#target);
-+          : sumChildrenInlineSize(this.#target, win.gZenVerticalTabsManager._topButtonsSeparatorElement);
+          : sumChildrenInlineSize((win.gZenVerticalTabsManager._hasSetSingleToolbar && this.#target.id == 'nav-bar-customization-target') ? win.document.getElementById("zen-sidebar-top-buttons-customization-target") : this.#target, win.gZenVerticalTabsManager._topButtonsSeparatorElement);
     });
 
     lazy.log.debug(
-@@ -6497,7 +6496,8 @@ class OverflowableToolbar {
+@@ -6854,7 +6853,8 @@ class OverflowableToolbar {
     // If the target has min-width: 0, their children might actually overflow
     // it, so check for both cases explicitly.
     let targetContentWidth = Math.max(targetWidth, targetChildrenWidth);
@@ -148,7 +148,7 @@ index e6b9b7dcfab179e7552c146eb1551b45ad042266..d9d838a7a51f67b52b69f419024cc317
     return { isOverflowing, targetContentWidth, totalAvailWidth };
   }
 
-@@ -6591,7 +6591,7 @@ class OverflowableToolbar {
+@@ -6948,7 +6948,7 @@ class OverflowableToolbar {
         }
       }
       if (!inserted) {
@@ -157,7 +157,7 @@ index e6b9b7dcfab179e7552c146eb1551b45ad042266..d9d838a7a51f67b52b69f419024cc317
       }
       child.removeAttribute("cui-anchorid");
       child.removeAttribute("overflowedItem");
-@@ -6753,6 +6753,9 @@ class OverflowableToolbar {
+@@ -7110,6 +7110,9 @@ class OverflowableToolbar {
    * @param {MouseEvent} aEvent the click event.
    */
   #onClickDefaultListButton(aEvent) {
--- a/src/browser/components/customizableui/content/panelUI-inc-xhtml.patch
+++ b/src/browser/components/customizableui/content/panelUI-inc-xhtml.patch
@@ -1,17 +1,13 @@
 diff --git a/browser/components/customizableui/content/panelUI.inc.xhtml b/browser/components/customizableui/content/panelUI.inc.xhtml
-index 956a6ae45d7adbec1513c5af528ebb687a4b7d0d..83b23e84cb6895497c1346f7c4aff15173e67b5c 100644
+index c78f08bdd3fc4d01e10552ef65c2d5813dd053e8..154fb1de2ab9384937d02c14cb7c9c607b330da9 100644
 --- a/browser/components/customizableui/content/panelUI.inc.xhtml
 +++ b/browser/components/customizableui/content/panelUI.inc.xhtml
-@@ -81,9 +81,10 @@
-             <html:span data-l10n-id="unified-extensions-header-title"/>
-           </html:h1>
-         </box>
-
-+        <html:p id="unified-extensions-description" data-l10n-id="unified-extensions-description" class="panel-description"/>
-+#if 0
-         <toolbarseparator />
-
-+#endif
-         <vbox class="panel-subview-body" context="unified-extensions-context-menu">
-           <html:div id="unified-extensions-messages-container">
-             <!-- messages will be inserted here -->
+@@ -132,7 +132,7 @@
+   <panel id="appMenu-notification-popup"
+          class="popup-notification-panel panel-no-padding"
+          type="arrow"
+-         position="after_start"
+         position="after_end"
+          flip="slide"
+          orient="vertical"
+          noautofocus="true"
--- a/src/browser/components/customizableui/content/panelUI-js.patch
+++ b/src/browser/components/customizableui/content/panelUI-js.patch
@@ -1,8 +1,8 @@
 diff --git a/browser/components/customizableui/content/panelUI.js b/browser/components/customizableui/content/panelUI.js
-index 1805bad6c58e060533f634ed9e511c05cad3ded1..f153761e406535270343fa1f430dea4f740cb2fc 100644
+index 7583473ee73538b2fa54337bfd844f03f261be49..559b593a6874296bd5894c5985f8eeb680cd3886 100644
 --- a/browser/components/customizableui/content/panelUI.js
 +++ b/browser/components/customizableui/content/panelUI.js
-@@ -496,8 +496,7 @@ const PanelUI = {
+@@ -515,8 +515,7 @@ const PanelUI = {
         tempPanel.setAttribute("animate", "false");
       }
       tempPanel.setAttribute("context", "");
@@ -12,13 +12,12 @@ index 1805bad6c58e060533f634ed9e511c05cad3ded1..f153761e406535270343fa1f430dea4f
         .appendChild(tempPanel);
 
       let multiView = document.createXULElement("panelmultiview");
-@@ -544,8 +543,8 @@ const PanelUI = {
-       }
+@@ -960,7 +959,7 @@ const PanelUI = {
+         el.removeAttribute("data-lazy-l10n-id");
+       });
 
-       if (viewShown) {
-        CustomizableUI.addPanelCloseListeners(tempPanel);
-         tempPanel.addEventListener("popuphidden", panelRemover);
-+        CustomizableUI.addPanelCloseListeners(tempPanel);
-       } else {
-         panelRemover();
-       }
+-    this.notificationPanel.openPopup(anchor, "bottomright topright");
+    this.notificationPanel.openPopup(anchor, gZenUIManager.panelUIPosition);
+   },
+ 
+   _clearNotificationPanel() {
--- a/src/browser/components/preferences/zen-settings.js
+++ b/src/browser/components/preferences/zen-settings.js
@@ -944,11 +944,6 @@ Preferences.addAll([
    type: 'bool',
    default: true,
  },
-  {
-    id: 'zen.workspaces.show-icon-strip',
-    type: 'bool',
-    default: true,
-  },
  {
    id: 'zen.tab-unloader.enabled',
    type: 'bool',
@@ -964,11 +959,6 @@ Preferences.addAll([
    type: 'int',
    default: 10,
  },
-  {
-    id: 'zen.workspaces.hide-deactivated-workspaces',
-    type: 'bool',
-    default: true,
-  },
  {
    id: 'zen.pinned-tab-manager.restore-pinned-tabs-to-pinned-url',
    type: 'bool',
--- a/src/browser/components/preferences/zenTabsManagement.inc.xhtml
+++ b/src/browser/components/preferences/zenTabsManagement.inc.xhtml
@@ -20,15 +20,9 @@
      <checkbox id="zenWorkspacesHideDefaultContainer"
            data-l10n-id="zen-settings-workspaces-hide-default-container-indicator"
            preference="zen.workspaces.hide-default-container-indicator"/>
-      <checkbox id="zenWorkspacesDisplayAsIconStrip"
-            data-l10n-id="zen-settings-workspaces-display-as-icon-strip"
-            preference="zen.workspaces.show-icon-strip"/>
      <checkbox id="zenWorkspacesForceContainerTabsToWorkspace"
            data-l10n-id="zen-settings-workspaces-force-container-tabs-to-workspace"
            preference="zen.workspaces.force-container-workspace"/>
-      <checkbox id="zenWorkspaceHideDeactivatedWorkspaces"
-            data-l10n-id="zen-settings-workspaces-hide-deactivated-workspaces"
-            preference="zen.workspaces.hide-deactivated-workspaces"/>
 </groupbox>

 <hbox id="zenTabsUnloadCategory"
--- a/src/browser/components/tabbrowser/content/tabbrowser-js.patch
+++ b/src/browser/components/tabbrowser/content/tabbrowser-js.patch
@@ -1,5 +1,5 @@
 diff --git a/browser/components/tabbrowser/content/tabbrowser.js b/browser/components/tabbrowser/content/tabbrowser.js
-index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad72079b02024 100644
+index 628aa6596627c85efe361fc1ece8fd58f7ee653e..06a4aae50ebe8a42d08d4689d8e80a63af1fa8a3 100644
 --- a/browser/components/tabbrowser/content/tabbrowser.js
 +++ b/browser/components/tabbrowser/content/tabbrowser.js
@@ -412,11 +412,50 @@
@@ -55,7 +55,15 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       }
       return i;
     }
-@@ -811,12 +850,13 @@
+@@ -546,6 +585,7 @@
+       this.tabpanels.appendChild(panel);
+ 
+       let tab = this.tabs[0];
+      ZenWorkspaces.handleInitialTab(tab, (!remoteType || remoteType === E10SUtils.PRIVILEGEDABOUT_REMOTE_TYPE) && !Services.prefs.getBoolPref('zen.workspaces.disable_empty_state_for_testing', false));
+       tab.linkedPanel = uniqueId;
+       this._selectedTab = tab;
+       this._selectedBrowser = browser;
+@@ -811,12 +851,13 @@
       }
 
       this.showTab(aTab);
@@ -73,7 +81,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
         this.moveTabTo(aTab, this.pinnedTabCount, { forceStandaloneTab: true });
       }
       aTab.setAttribute("pinned", "true");
-@@ -830,12 +870,15 @@
+@@ -830,12 +871,15 @@
       }
 
       if (this.tabContainer.verticalMode) {
@@ -90,7 +98,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
         });
       } else {
         this.moveTabTo(aTab, this.pinnedTabCount - 1, {
-@@ -1018,6 +1061,8 @@
+@@ -1018,6 +1062,8 @@
 
       let LOCAL_PROTOCOLS = ["chrome:", "about:", "resource:", "data:"];
 
@@ -99,7 +107,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       if (
         aIconURL &&
         !aLoadingPrincipal &&
-@@ -1028,6 +1073,9 @@
+@@ -1028,6 +1074,9 @@
         );
         return;
       }
@@ -109,7 +117,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
 
       let browser = this.getBrowserForTab(aTab);
       browser.mIconURL = aIconURL;
-@@ -1273,6 +1321,7 @@
+@@ -1273,6 +1322,7 @@
       if (!this._previewMode) {
         newTab.recordTimeFromUnloadToReload();
         newTab.updateLastAccessed();
@@ -117,7 +125,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
         oldTab.updateLastAccessed();
         // if this is the foreground window, update the last-seen timestamps.
         if (this.ownerGlobal == BrowserWindowTracker.getTopWindow()) {
-@@ -1425,6 +1474,9 @@
+@@ -1425,6 +1475,9 @@
       }
 
       let activeEl = document.activeElement;
@@ -127,7 +135,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       // If focus is on the old tab, move it to the new tab.
       if (activeEl == oldTab) {
         newTab.focus();
-@@ -1748,7 +1800,7 @@
+@@ -1748,7 +1801,7 @@
     }
 
     _setTabLabel(aTab, aLabel, { beforeTabOpen, isContentTitle, isURL } = {}) {
@@ -136,7 +144,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
         return false;
       }
 
-@@ -1851,7 +1903,7 @@
+@@ -1851,7 +1904,7 @@
         newIndex = this.selectedTab._tPos + 1;
       }
 
@@ -145,7 +153,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
         let browser;
         if (targetTab) {
           browser = this.getBrowserForTab(targetTab);
-@@ -2108,6 +2160,7 @@
+@@ -2108,6 +2161,7 @@
       uriIsAboutBlank,
       userContextId,
       skipLoad,
@@ -153,7 +161,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
     } = {}) {
       let b = document.createXULElement("browser");
       // Use the JSM global to create the permanentKey, so that if the
-@@ -2181,8 +2234,7 @@
+@@ -2181,8 +2235,7 @@
         // we use a different attribute name for this?
         b.setAttribute("name", name);
       }
@@ -163,7 +171,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
         b.setAttribute("transparent", "true");
       }
 
-@@ -2347,7 +2399,7 @@
+@@ -2347,7 +2400,7 @@
 
       let panel = this.getPanel(browser);
       let uniqueId = this._generateUniquePanelID();
@@ -172,7 +180,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       aTab.linkedPanel = uniqueId;
 
       // Inject the <browser> into the DOM if necessary.
-@@ -2406,8 +2458,8 @@
+@@ -2406,8 +2459,8 @@
       // If we transitioned from one browser to two browsers, we need to set
       // hasSiblings=false on both the existing browser and the new browser.
       if (this.tabs.length == 2) {
@@ -183,7 +191,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       } else {
         aTab.linkedBrowser.browsingContext.hasSiblings = this.tabs.length > 1;
       }
-@@ -2629,6 +2681,7 @@
+@@ -2629,6 +2682,7 @@
         schemelessInput,
         hasValidUserGestureActivation = false,
         textDirectiveUserActivation = false,
@@ -191,7 +199,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       } = {}
     ) {
       // all callers of addTab that pass a params object need to pass
-@@ -2639,6 +2692,12 @@
+@@ -2639,6 +2693,12 @@
         );
       }
 
@@ -204,7 +212,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       if (!UserInteraction.running("browser.tabs.opening", window)) {
         UserInteraction.start("browser.tabs.opening", "initting", window);
       }
-@@ -2702,6 +2761,15 @@
+@@ -2702,6 +2762,15 @@
           noInitialLabel,
           skipBackgroundNotify,
         });
@@ -220,7 +228,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
         if (insertTab) {
           // insert the tab into the tab container in the correct position
           this._insertTabAtIndex(t, {
-@@ -2726,6 +2794,7 @@
+@@ -2726,6 +2795,7 @@
           initialBrowsingContextGroupId,
           openWindowInfo,
           skipLoad,
@@ -228,7 +236,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
         }));
 
         if (focusUrlBar) {
-@@ -2845,6 +2914,9 @@
+@@ -2845,6 +2915,9 @@
         }
       }
 
@@ -238,7 +246,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       // Additionally send pinned tab events
       if (pinned) {
         this._notifyPinnedStatus(t);
-@@ -2904,6 +2976,7 @@
+@@ -2904,6 +2977,7 @@
         label = "",
         insertBefore = null,
         showCreateUI = false,
@@ -246,7 +254,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       } = {}
     ) {
       if (!tabs?.length) {
-@@ -2918,7 +2991,12 @@
+@@ -2918,7 +2992,12 @@
         id = `${Date.now()}-${Math.round(Math.random() * 100)}`;
       }
       let group = this._createTabGroup(id, color, false, label);
@@ -260,7 +268,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
         group,
         insertBefore?.group ?? insertBefore
       );
-@@ -3126,6 +3204,7 @@
+@@ -3126,6 +3205,7 @@
         initialBrowsingContextGroupId,
         openWindowInfo,
         skipLoad,
@@ -268,7 +276,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       }
     ) {
       // If we don't have a preferred remote type, and we have a remote
-@@ -3189,6 +3268,7 @@
+@@ -3189,6 +3269,7 @@
           openWindowInfo,
           name,
           skipLoad,
@@ -276,7 +284,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
         });
       }
 
-@@ -3367,6 +3447,27 @@
+@@ -3367,6 +3448,27 @@
         ) {
           tabWasReused = true;
           tab = this.selectedTab;
@@ -304,7 +312,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
           if (!tabData.pinned) {
             this.unpinTab(tab);
           } else {
-@@ -3380,6 +3481,7 @@
+@@ -3380,6 +3482,7 @@
             restoreTabsLazily && !select && !tabData.pinned;
 
           let url = "about:blank";
@@ -312,7 +320,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
           if (tabData.entries?.length) {
             let activeIndex = (tabData.index || tabData.entries.length) - 1;
             // Ensure the index is in bounds.
-@@ -3415,7 +3517,27 @@
+@@ -3415,7 +3518,27 @@
             skipLoad: true,
             preferredRemoteType,
           });
@@ -341,7 +349,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
           if (select) {
             tabToSelect = tab;
           }
-@@ -3428,8 +3550,8 @@
+@@ -3428,8 +3551,8 @@
           // inserted in the DOM. If the tab is not yet in the DOM,
           // just insert it in the right place from the start.
           if (!tab.parentNode) {
@@ -352,17 +360,17 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
             tab.toggleAttribute("pinned", true);
             this.tabContainer._invalidateCachedTabs();
             // Then ensure all the tab open/pinning information is sent.
-@@ -3504,6 +3626,9 @@
+@@ -3504,6 +3627,9 @@
         this.selectedTab = tabToSelect;
         this.removeTab(leftoverTab);
       }
 +      else {
-+        this.selectedTab._possibleEmptyTab = true; // Not needed, but just in case.
+        this.selectedTab._possiblyEmpty = this.selectedTab.isEmpty; // Not needed, but just in case.
 +      }
 
       if (tabs.length > 1 || !tabs[0].selected) {
         this._updateTabsAfterInsert();
-@@ -3693,7 +3818,7 @@
+@@ -3693,7 +3819,7 @@
       // Ensure we have an index if one was not provided.
       if (typeof index != "number") {
         // Move the new tab after another tab if needed, to the end otherwise.
@@ -371,7 +379,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
         if (
           !bulkOrderedOpen &&
           ((openerTab &&
-@@ -3736,18 +3861,18 @@
+@@ -3736,18 +3862,18 @@
 
       // Ensure index is within bounds.
       if (tab.pinned) {
@@ -394,7 +402,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
         if (tabAfter && tabAfter.group == tabGroup) {
           // Place at the front of, or between tabs in, the same tab group
           this.tabContainer.insertBefore(tab, tabAfter);
-@@ -4059,6 +4184,9 @@
+@@ -4059,6 +4185,9 @@
         return;
       }
 
@@ -404,7 +412,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       this.removeTabs(selectedTabs);
     }
 
-@@ -4391,6 +4519,7 @@
+@@ -4391,6 +4520,7 @@
         skipSessionStore,
       } = {}
     ) {
@@ -412,7 +420,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       if (UserInteraction.running("browser.tabs.opening", window)) {
         UserInteraction.finish("browser.tabs.opening", window);
       }
-@@ -4407,6 +4536,12 @@
+@@ -4407,6 +4537,12 @@
         TelemetryStopwatch.start("FX_TAB_CLOSE_TIME_NO_ANIM_MS", aTab);
       }
 
@@ -425,7 +433,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       // Handle requests for synchronously removing an already
       // asynchronously closing tab.
       if (!animate && aTab.closing) {
-@@ -4421,7 +4556,9 @@
+@@ -4421,7 +4557,9 @@
       // frame created for it (for example, by updating the visually selected
       // state).
       let tabWidth = window.windowUtils.getBoundsWithoutFlushing(aTab).width;
@@ -436,7 +444,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       if (
         !this._beginRemoveTab(aTab, {
           closeWindowFastpath: true,
-@@ -4435,7 +4572,6 @@
+@@ -4435,7 +4573,6 @@
         TelemetryStopwatch.cancel("FX_TAB_CLOSE_TIME_NO_ANIM_MS", aTab);
         return;
       }
@@ -444,7 +452,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       let lockTabSizing =
         !this.tabContainer.verticalMode &&
         !aTab.pinned &&
-@@ -4574,14 +4710,14 @@
+@@ -4574,14 +4711,14 @@
         !!this.tabsInCollapsedTabGroups.length;
       if (
         aTab.visible &&
@@ -461,7 +469,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
 
         if (closeWindow) {
           // We've already called beforeunload on all the relevant tabs if we get here,
-@@ -4605,6 +4741,7 @@
+@@ -4605,6 +4742,7 @@
 
         newTab = true;
       }
@@ -469,7 +477,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       aTab._endRemoveArgs = [closeWindow, newTab];
 
       // swapBrowsersAndCloseOther will take care of closing the window without animation.
-@@ -4645,9 +4782,7 @@
+@@ -4645,9 +4783,7 @@
       aTab._mouseleave();
 
       if (newTab) {
@@ -480,7 +488,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       } else {
         TabBarVisibility.update();
       }
-@@ -4776,6 +4911,8 @@
+@@ -4776,6 +4912,8 @@
         this.tabs[i]._tPos = i;
       }
 
@@ -489,7 +497,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       if (!this._windowIsClosing) {
         if (wasPinned) {
           this.tabContainer._positionPinnedTabs();
-@@ -4994,7 +5131,7 @@
+@@ -4994,7 +5132,7 @@
         !excludeTabs.has(aTab.owner) &&
         Services.prefs.getBoolPref("browser.tabs.selectOwnerOnClose")
       ) {
@@ -498,7 +506,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       }
 
       // Try to find a remaining tab that comes after the given tab
-@@ -5016,7 +5153,7 @@
+@@ -5016,7 +5154,7 @@
       }
 
       if (tab) {
@@ -507,7 +515,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       }
 
       // If no qualifying visible tab was found, see if there is a tab in
-@@ -5434,10 +5571,10 @@
+@@ -5434,10 +5572,10 @@
       SessionStore.deleteCustomTabValue(aTab, "hiddenBy");
     }
 
@@ -520,7 +528,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
         aTab.selected ||
         aTab.closing ||
         // Tabs that are sharing the screen, microphone or camera cannot be hidden.
-@@ -5675,7 +5812,7 @@
+@@ -5675,7 +5813,7 @@
 
       // Don't allow mixing pinned and unpinned tabs.
       if (aTab.pinned) {
@@ -529,7 +537,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       } else {
         aIndex = Math.max(aIndex, this.pinnedTabCount);
       }
-@@ -5685,10 +5822,17 @@
+@@ -5685,10 +5823,17 @@
 
       this._handleTabMove(aTab, () => {
         let neighbor = this.tabs[aIndex];
@@ -549,7 +557,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
           neighbor.after(aTab);
         } else {
           this.tabContainer.insertBefore(aTab, neighbor);
-@@ -5697,7 +5841,7 @@
+@@ -5697,7 +5842,7 @@
     }
 
     moveTabToGroup(aTab, aGroup) {
@@ -558,7 +566,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
         return;
       }
       if (aTab.group && aTab.group.id === aGroup.id) {
-@@ -5721,6 +5865,10 @@
+@@ -5721,6 +5866,10 @@
 
       moveActionCallback();
 
@@ -569,7 +577,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       // Clear tabs cache after moving nodes because the order of tabs may have
       // changed.
       this.tabContainer._invalidateCachedTabs();
-@@ -5771,7 +5919,7 @@
+@@ -5771,7 +5920,7 @@
         createLazyBrowser,
       };
 
@@ -578,7 +586,16 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
       if (aIndex < numPinned || (aTab.pinned && aIndex == numPinned)) {
         params.pinned = true;
       }
-@@ -7415,6 +7563,7 @@
+@@ -6513,7 +6662,7 @@
+             // preventDefault(). It will still raise the window if appropriate.
+             break;
+           }
+-          this.selectedTab = tab;
+          ZenWorkspaces.switchTabIfNeeded(tab);
+           window.focus();
+           aEvent.preventDefault();
+           break;
+@@ -7415,6 +7564,7 @@
             aWebProgress.isTopLevel
           ) {
             this.mTab.setAttribute("busy", "true");
@@ -586,7 +603,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
             gBrowser._tabAttrModified(this.mTab, ["busy"]);
             this.mTab._notselectedsinceload = !this.mTab.selected;
           }
-@@ -8381,7 +8530,7 @@ var TabContextMenu = {
+@@ -8381,7 +8531,7 @@ var TabContextMenu = {
     );
     contextUnpinSelectedTabs.hidden =
       !this.contextTab.pinned || !multiselectionContext;
@@ -595,7 +612,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
     // Move Tab items
     let contextMoveTabOptions = document.getElementById(
       "context_moveTabOptions"
-@@ -8414,7 +8563,7 @@ var TabContextMenu = {
+@@ -8414,7 +8564,7 @@ var TabContextMenu = {
     let contextMoveTabToStart = document.getElementById("context_moveToStart");
     let isFirstTab =
       tabsToMove[0] == visibleTabs[0] ||
@@ -604,7 +621,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720
     contextMoveTabToStart.disabled = isFirstTab && allSelectedTabsAdjacent;
 
     document.getElementById("context_openTabInWindow").disabled =
-@@ -8647,6 +8796,7 @@ var TabContextMenu = {
+@@ -8647,6 +8797,7 @@ var TabContextMenu = {
     if (this.contextTab.multiselected) {
       gBrowser.removeMultiSelectedTabs();
     } else {
--- a/src/browser/components/tabbrowser/content/tabs-js.patch
+++ b/src/browser/components/tabbrowser/content/tabs-js.patch
@@ -1,5 +1,5 @@
 diff --git a/browser/components/tabbrowser/content/tabs.js b/browser/components/tabbrowser/content/tabs.js
-index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a84f01452 100644
+index fa96568d366fd3608f9bd583fa793150bd815c8b..1c940a3b162919256ca73fa867c5c261a3395e25 100644
 --- a/browser/components/tabbrowser/content/tabs.js
 +++ b/browser/components/tabbrowser/content/tabs.js
@@ -94,7 +94,7 @@
@@ -11,16 +11,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
         }
         return true;
       };
-@@ -135,6 +135,8 @@
-       this.previewPanel = null;
- 
-       this.allTabs[0].label = this.emptyTabTitle;
-+      this.allTabs[0]._possibleEmptyTab = true;
-+      ZenWorkspaces._resolveEmptyTabInitialized();
- 
-       // Hide the secondary text for locales where it is unsupported due to size constraints.
-       const language = Services.locale.appLocaleAsBCP47;
-@@ -339,7 +341,7 @@
+@@ -339,7 +339,7 @@
       // and we're not hitting the scroll buttons.
       if (
         event.button != 0 ||
@@ -29,7 +20,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
         event.composedTarget.localName == "toolbarbutton"
       ) {
         return;
-@@ -388,6 +390,7 @@
+@@ -388,6 +388,7 @@
             // Reset the "ignored click" flag
             target._ignoredCloseButtonClicks = false;
           }
@@ -37,7 +28,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
         }
 
         /* Protects from close-tab-button errant doubleclick:
-@@ -683,7 +686,7 @@
+@@ -683,7 +684,7 @@
       if (this.#isContainerVerticalPinnedExpanded(tab)) {
         // In expanded vertical mode, the max number of pinned tabs per row is dynamic
         // Set this before adjusting dragged tab's position
@@ -46,7 +37,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
         let tabsPerRow = 0;
         let position = 0;
         for (let pinnedTab of pinnedTabs) {
-@@ -883,6 +886,10 @@
+@@ -883,6 +884,10 @@
       }
 
       let draggedTab = event.dataTransfer.mozGetDataAt(TAB_DROP_TYPE, 0);
@@ -57,7 +48,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
       if (
         (effects == "move" || effects == "copy") &&
         this == draggedTab.container &&
-@@ -996,6 +1003,18 @@
+@@ -996,6 +1001,18 @@
 
       this._tabDropIndicator.hidden = true;
       event.stopPropagation();
@@ -76,7 +67,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
       if (draggedTab && dropEffect == "copy") {
         // copy the dropped tab (wherever it's from)
         let newIndex = this._getDropIndex(event);
-@@ -1034,10 +1053,11 @@
+@@ -1034,10 +1051,11 @@
           }
         } else {
           let pinned = draggedTab.pinned;
@@ -92,7 +83,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
           );
           let size = this.verticalMode ? "height" : "width";
           let screenAxis = this.verticalMode ? "screenY" : "screenX";
-@@ -1114,7 +1134,7 @@
+@@ -1114,7 +1132,7 @@
               let postTransitionCleanup = () => {
                 tab.removeAttribute("tabdrop-samewindow");
 
@@ -101,7 +92,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
                 if (dropIndex !== false) {
                   gBrowser.moveTabTo(tab, dropIndex);
                   if (!directionForward) {
-@@ -1122,7 +1142,7 @@
+@@ -1122,7 +1140,7 @@
                   }
                 }
               };
@@ -110,7 +101,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
                 postTransitionCleanup();
               } else {
                 let onTransitionEnd = transitionendEvent => {
-@@ -1249,7 +1269,7 @@
+@@ -1249,7 +1267,7 @@
               return;
             }
           }
@@ -119,7 +110,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
           gBrowser.loadTabs(urls, {
             inBackground,
             replace,
-@@ -1279,13 +1299,23 @@
+@@ -1279,13 +1297,23 @@
         return;
       }
 
@@ -145,7 +136,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
       ) {
         delete draggedTab._dragData;
         return;
-@@ -1517,7 +1547,7 @@
+@@ -1517,7 +1545,7 @@
     }
 
     get newTabButton() {
@@ -154,7 +145,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
     }
 
     get verticalMode() {
-@@ -1537,28 +1567,40 @@
+@@ -1537,28 +1565,40 @@
       if (this.#allTabs) {
         return this.#allTabs;
       }
@@ -203,7 +194,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
       return children.filter(node => node.tagName == "tab-group");
     }
 
-@@ -1579,7 +1621,7 @@
+@@ -1579,7 +1619,7 @@
      */
     get visibleTabs() {
       if (!this.#visibleTabs) {
@@ -212,7 +203,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
       }
       return this.#visibleTabs;
     }
-@@ -1613,10 +1655,8 @@
+@@ -1613,10 +1653,8 @@
         return this.#focusableItems;
       }
 
@@ -225,7 +216,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
 
       let focusableItems = [];
       for (let child of children) {
-@@ -1632,6 +1672,7 @@
+@@ -1632,6 +1670,7 @@
       }
 
       this.#focusableItems = [
@@ -233,7 +224,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
         ...verticalPinnedTabsContainer.children,
         ...focusableItems,
       ];
-@@ -1642,6 +1683,7 @@
+@@ -1642,6 +1681,7 @@
     _invalidateCachedTabs() {
       this.#allTabs = null;
       this._invalidateCachedVisibleTabs();
@@ -241,7 +232,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
     }
 
     _invalidateCachedVisibleTabs() {
-@@ -1656,8 +1698,8 @@
+@@ -1656,8 +1696,8 @@
     #isContainerVerticalPinnedExpanded(tab) {
       return (
         this.verticalMode &&
@@ -252,7 +243,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
       );
     }
 
-@@ -1672,7 +1714,7 @@
+@@ -1672,7 +1712,7 @@
 
       if (node == null) {
         // We have a container for non-tab elements at the end of the scrollbox.
@@ -261,7 +252,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
       }
 
       node.before(tab);
-@@ -1772,7 +1814,7 @@
+@@ -1772,7 +1812,7 @@
           // There are separate "new tab" buttons for horizontal tabs toolbar, vertical tabs and
           // for when the tab strip is overflowed (which is shared by vertical and horizontal tabs);
           // Attach the long click popup to all of them.
@@ -270,7 +261,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
           const newTab2 = this.newTabButton;
           const newTabVertical = document.getElementById(
             "vertical-tabs-newtab-button"
-@@ -1855,7 +1897,7 @@
+@@ -1855,7 +1895,7 @@
           let rect = ele => {
             return window.windowUtils.getBoundsWithoutFlushing(ele);
           };
@@ -279,7 +270,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
           if (tab && rect(tab).width <= this._tabClipWidth) {
             this.setAttribute("closebuttons", "activetab");
           } else {
-@@ -1867,10 +1909,12 @@
+@@ -1867,10 +1907,12 @@
 
     _handleTabSelect(aInstant) {
       let selectedTab = this.selectedItem;
@@ -292,7 +283,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
       selectedTab._notselectedsinceload = false;
     }
 
-@@ -1882,7 +1926,7 @@
+@@ -1882,7 +1924,7 @@
         return;
       }
 
@@ -301,7 +292,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
       if (!tabs.length) {
         return;
       }
-@@ -1918,7 +1962,7 @@
+@@ -1918,7 +1960,7 @@
         if (isEndTab && !this._hasTabTempMaxWidth) {
           return;
         }
@@ -310,7 +301,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
         // Force tabs to stay the same width, unless we're closing the last tab,
         // which case we need to let them expand just enough so that the overall
         // tabbar width is the same.
-@@ -1933,7 +1977,7 @@
+@@ -1933,7 +1975,7 @@
         let tabsToReset = [];
         for (let i = numPinned; i < tabs.length; i++) {
           let tab = tabs[i];
@@ -319,7 +310,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
           if (!isEndTab) {
             // keep tabs the same width
             tab.style.transition = "none";
-@@ -1999,16 +2043,15 @@
+@@ -1999,16 +2041,15 @@
       // Move pinned tabs to another container when the tabstrip is toggled to vertical
       // and when session restore code calls _positionPinnedTabs; update styling whenever
       // the number of pinned tabs changes.
@@ -342,7 +333,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
         }
       }
 
-@@ -2016,9 +2059,7 @@
+@@ -2016,9 +2057,7 @@
     }
 
     _resetVerticalPinnedTabs() {
@@ -353,7 +344,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
 
       if (!verticalTabsContainer.children.length) {
         return;
-@@ -2031,8 +2072,8 @@
+@@ -2031,8 +2070,8 @@
     }
 
     _positionPinnedTabs() {
@@ -364,7 +355,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
       let absPositionHorizontalTabs =
         this.overflowing && tabs.length > numPinned && numPinned > 0;
 
-@@ -2041,7 +2082,7 @@
+@@ -2041,7 +2080,7 @@
 
       if (this.verticalMode) {
         this._updateVerticalPinnedTabs();
@@ -373,7 +364,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
         let layoutData = this._pinnedTabsLayoutCache;
         let uiDensity = document.documentElement.getAttribute("uidensity");
         if (!layoutData || layoutData.uiDensity != uiDensity) {
-@@ -2113,7 +2154,7 @@
+@@ -2113,7 +2152,7 @@
         return;
       }
 
@@ -382,7 +373,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
 
       let directionX = screenX > dragData.animLastScreenX;
       let directionY = screenY > dragData.animLastScreenY;
-@@ -2121,7 +2162,7 @@
+@@ -2121,7 +2160,7 @@
       dragData.animLastScreenX = screenX;
 
       let { width: tabWidth, height: tabHeight } =
@@ -391,7 +382,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
       let shiftSizeX = tabWidth * movingTabs.length;
       let shiftSizeY = tabHeight;
       dragData.tabWidth = tabWidth;
-@@ -2296,10 +2337,11 @@
+@@ -2296,10 +2335,11 @@
       }
 
       let pinned = draggedTab.pinned;
@@ -407,7 +398,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
       );
 
       if (this.#rtlMode) {
-@@ -2348,7 +2390,11 @@
+@@ -2348,7 +2388,11 @@
       translate = Math.min(Math.max(translate, firstBound), lastBound);
 
       for (let tab of movingTabs) {
@@ -420,7 +411,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
       }
 
       dragData.translatePos = translate;
-@@ -2484,12 +2530,16 @@
+@@ -2484,12 +2528,16 @@
       // Shift background tabs to leave a gap where the dragged tab
       // would currently be dropped.
       for (let tab of tabs) {
@@ -438,7 +429,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
         if (tab.group?.tabs[0] == tab) {
           tab.group.style.setProperty(
             "--tabgroup-dragover-transform",
-@@ -2541,8 +2591,9 @@
+@@ -2541,8 +2589,9 @@
       );
     }
 
@@ -450,7 +441,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
         return;
       }
 
-@@ -2553,6 +2604,7 @@
+@@ -2553,6 +2602,7 @@
         tab.style.transform = "";
         if (tab.group) {
           tab.group.style.removeProperty("--tabgroup-dragover-transform");
@@ -458,7 +449,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
         }
         tab.removeAttribute("dragover-createGroup");
       }
-@@ -2604,7 +2656,7 @@
+@@ -2604,7 +2654,7 @@
           movingTab._moveTogetherSelectedTabsData.newIndex = movingTabNewIndex;
           movingTab._moveTogetherSelectedTabsData.animate = false;
         };
@@ -467,7 +458,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
           postTransitionCleanup();
         } else {
           let onTransitionEnd = transitionendEvent => {
-@@ -2707,9 +2759,9 @@
+@@ -2707,9 +2757,9 @@
       function newIndex(aTab, index) {
         // Don't allow mixing pinned and unpinned tabs.
         if (aTab.pinned) {
@@ -479,7 +470,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a
       }
     }
 
-@@ -2793,7 +2845,7 @@
+@@ -2793,7 +2843,7 @@
     }
 
     _notifyBackgroundTab(aTab) {
--- a/src/browser/components/urlbar/UrlbarInput-sys-mjs.patch
+++ b/src/browser/components/urlbar/UrlbarInput-sys-mjs.patch
@@ -1,5 +1,5 @@
 diff --git a/browser/components/urlbar/UrlbarInput.sys.mjs b/browser/components/urlbar/UrlbarInput.sys.mjs
-index 02c328f0d0724b0cf95c820fe49a43e94a97b3c2..30387bf4f128fdc1d687ee4f6c5a51eb0bee29ea 100644
+index 02c328f0d0724b0cf95c820fe49a43e94a97b3c2..79b9161544633d319d7e550dd95334b62e85eed4 100644
 --- a/browser/components/urlbar/UrlbarInput.sys.mjs
 +++ b/browser/components/urlbar/UrlbarInput.sys.mjs
@@ -67,6 +67,13 @@ XPCOMUtils.defineLazyPreferenceGetter(
@@ -52,7 +52,18 @@ index 02c328f0d0724b0cf95c820fe49a43e94a97b3c2..30387bf4f128fdc1d687ee4f6c5a51eb
   }
 
   /**
-@@ -1098,7 +1116,11 @@ export class UrlbarInput {
+@@ -943,6 +961,10 @@ export class UrlbarInput {
+     // Nullify search mode before setURI so it won't try to restore it.
+     this.searchMode = null;
+     this.setURI(null, true, false, true);
+    if (this.hasAttribute("zen-floating-urlbar")) {
+      this.window.gBrowser.selectedBrowser.focus();
+      return;
+    }
+     if (this.value && this.focused) {
+       this.select();
+     }
+@@ -1098,7 +1120,11 @@ export class UrlbarInput {
     }
 
     if (!this.#providesSearchMode(result)) {
@@ -65,7 +76,7 @@ index 02c328f0d0724b0cf95c820fe49a43e94a97b3c2..30387bf4f128fdc1d687ee4f6c5a51eb
     }
 
     this.controller.recordSelectedResult(event, result);
-@@ -2157,6 +2179,11 @@ export class UrlbarInput {
+@@ -2157,6 +2183,11 @@ export class UrlbarInput {
 
     this.setAttribute("breakout-extend", "true");
 
@@ -77,7 +88,7 @@ index 02c328f0d0724b0cf95c820fe49a43e94a97b3c2..30387bf4f128fdc1d687ee4f6c5a51eb
     // Enable the animation only after the first extend call to ensure it
     // doesn't run when opening a new window.
     if (!this.hasAttribute("breakout-extend-animate")) {
-@@ -2176,6 +2203,11 @@ export class UrlbarInput {
+@@ -2176,6 +2207,11 @@ export class UrlbarInput {
       return;
     }
 
@@ -89,7 +100,7 @@ index 02c328f0d0724b0cf95c820fe49a43e94a97b3c2..30387bf4f128fdc1d687ee4f6c5a51eb
     this.removeAttribute("breakout-extend");
     this.#updateTextboxPosition();
   }
-@@ -2998,7 +3030,7 @@ export class UrlbarInput {
+@@ -2998,7 +3034,7 @@ export class UrlbarInput {
    */
   _trimValue(val) {
     let trimmedValue = lazy.UrlbarPrefs.get("trimURLs")
@@ -98,7 +109,7 @@ index 02c328f0d0724b0cf95c820fe49a43e94a97b3c2..30387bf4f128fdc1d687ee4f6c5a51eb
       : val;
     // Only trim value if the directionality doesn't change to RTL and we're not
     // showing a strikeout https protocol.
-@@ -3365,7 +3397,7 @@ export class UrlbarInput {
+@@ -3365,7 +3401,7 @@ export class UrlbarInput {
     } else {
       where = lazy.BrowserUtils.whereToOpenLink(event, false, false);
     }
@@ -107,7 +118,7 @@ index 02c328f0d0724b0cf95c820fe49a43e94a97b3c2..30387bf4f128fdc1d687ee4f6c5a51eb
       if (where == "current") {
         where = "tab";
       } else if (where == "tab") {
-@@ -3380,6 +3412,9 @@ export class UrlbarInput {
+@@ -3380,6 +3416,9 @@ export class UrlbarInput {
     ) {
       where = "current";
     }
@@ -117,7 +128,7 @@ index 02c328f0d0724b0cf95c820fe49a43e94a97b3c2..30387bf4f128fdc1d687ee4f6c5a51eb
     return where;
   }
 
-@@ -3921,6 +3956,11 @@ export class UrlbarInput {
+@@ -3921,6 +3960,11 @@ export class UrlbarInput {
   }
 
   _on_click(event) {
@@ -129,7 +140,7 @@ index 02c328f0d0724b0cf95c820fe49a43e94a97b3c2..30387bf4f128fdc1d687ee4f6c5a51eb
     if (
       event.target == this.inputField ||
       event.target == this._inputContainer ||
-@@ -3992,7 +4032,7 @@ export class UrlbarInput {
+@@ -3992,7 +4036,7 @@ export class UrlbarInput {
       }
     }
 
@@ -138,7 +149,7 @@ index 02c328f0d0724b0cf95c820fe49a43e94a97b3c2..30387bf4f128fdc1d687ee4f6c5a51eb
       this.view.autoOpen({ event });
     } else {
       if (this._untrimOnFocusAfterKeydown) {
-@@ -4032,9 +4072,12 @@ export class UrlbarInput {
+@@ -4032,9 +4076,12 @@ export class UrlbarInput {
   }
 
   _on_mousedown(event) {
@@ -152,7 +163,7 @@ index 02c328f0d0724b0cf95c820fe49a43e94a97b3c2..30387bf4f128fdc1d687ee4f6c5a51eb
 
         if (
           event.target != this.inputField &&
-@@ -4044,8 +4087,8 @@ export class UrlbarInput {
+@@ -4044,8 +4091,8 @@ export class UrlbarInput {
           break;
         }
 
--- a/src/browser/themes/linux/browser-css.patch
+++ b/src/browser/themes/linux/browser-css.patch
@@ -1,5 +1,5 @@
 diff --git a/browser/themes/linux/browser.css b/browser/themes/linux/browser.css
-index a9276a678f16a67e2a003474203c37cb5c9300ad..20cb1b022f7a94ad553f5e6df48014ee646f93ed 100644
+index dc95772553ef7130c27c1122178ff99028b601f2..81f7dbb40c35168376ca84eebfa9fba8d314cb90 100644
 --- a/browser/themes/linux/browser.css
 +++ b/browser/themes/linux/browser.css
@@ -42,21 +42,25 @@
--- a/src/browser/themes/shared/zen-icons/icons.css
+++ b/src/browser/themes/shared/zen-icons/icons.css
@@ -1179,8 +1179,14 @@ menupopup > menuitem:is([type='checkbox']) .menu-iconic-left {
  list-style-image: url('close.svg') !important;
 }

-#zen-media-controls-toolbar:hover {
-  #zen-media-focus-button {
+#zen-media-focus-button:hover {
  list-style-image: url('screen.svg') !important;
-  }
+}
+
+#zen-media-close-button {
+  list-style-image: url('close.svg') !important;
+}
+
+#zen-media-pip-button {
+  list-style-image: url('chrome://global/skin/media/picture-in-picture-open.svg') !important;
 }
--- a/src/browser/themes/shared/zen-icons/lin/media-mute.svg
+++ b/src/browser/themes/shared/zen-icons/lin/media-mute.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M13.75,5.143V2.664c0-.395-.437-.634-.77-.421l-5.48,3.508H3.75c-.828,0-1.5,.672-1.5,1.5v3.5c0,.828,.672,1.5,1.5,1.5h2.63"></path><path d="M9,13.21l3.981,2.548c.333,.213,.77-.026,.77-.421v-6.72"></path><line x1="2.75" y1="15.75" x2="16.75" y2="2.25" data-color="color-2"></line></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="18px" height="18px" viewBox="0 0 18 18"><path d="M3.75,13h1.853L14.5,4.422v-1.758c0-.457-.249-.877-.65-1.097-.4-.219-.887-.203-1.273,.044l-5.296,3.389H3.75c-1.24,0-2.25,1.009-2.25,2.25v3.5c0,1.241,1.01,2.25,2.25,2.25Z" fill="context-fill" fill-opacity="context-fill-opacity"></path><path d="M8.22,13.601l4.356,2.788c.205,.131,.439,.198,.674,.198,.206,0,.412-.051,.6-.153,.401-.219,.65-.64,.65-1.097V7.545l-6.28,6.056Z" fill="context-fill" fill-opacity="context-fill-opacity"></path><path d="M2.75,16.5c-.196,0-.393-.077-.54-.229-.287-.298-.278-.773,.02-1.061L16.229,1.71c.299-.286,.773-.279,1.061,.02,.287,.298,.278,.773-.02,1.061L3.271,16.29c-.146,.14-.333,.21-.521,.21Z" fill="context-fill" fill-opacity="context-fill-opacity" data-color="color-2"></path></svg>
--- a/src/browser/themes/shared/zen-icons/lin/media-next.svg
+++ b/src/browser/themes/shared/zen-icons/lin/media-next.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="18px" height="18px" viewBox="0 0 18 18"><path d="M4.05,3.677l8.254,4.57c.595,.33,.595,1.177,0,1.506L4.05,14.323c-.582,.322-1.3-.094-1.3-.753V4.43c0-.66,.718-1.075,1.3-.753Z" fill="none" stroke="context-fill" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"></path><line x1="15.25" y1="15.25" x2="15.25" y2="2.75" fill="none" stroke="context-fill" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" data-color="color-2"></line></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="18px" height="18px" viewBox="0 0 18 18"><path d="M12.667,7.59L4.413,3.021c-.511-.283-1.116-.275-1.618,.022-.498,.293-.795,.812-.795,1.387V13.57c0,.575,.297,1.094,.795,1.387,.258,.152,.542,.229,.828,.229,.271,0,.542-.069,.791-.207l8.254-4.57c.514-.285,.833-.825,.833-1.41s-.319-1.125-.833-1.41Z" fill="context-fill"></path><path d="M15.25,2c-.414,0-.75,.336-.75,.75V15.25c0,.414,.336,.75,.75,.75s.75-.336,.75-.75V2.75c0-.414-.336-.75-.75-.75Z" fill="context-fill" data-color="color-2"></path></svg>
--- a/src/browser/themes/shared/zen-icons/lin/media-previous.svg
+++ b/src/browser/themes/shared/zen-icons/lin/media-previous.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="18px" height="18px" viewBox="0 0 18 18"><path d="M13.95,14.323L5.697,9.753c-.595-.33-.595-1.177,0-1.506L13.95,3.677c.582-.322,1.3,.094,1.3,.753V13.57c0,.66-.718,1.075-1.3,.753Z" fill="none" stroke="context-fill" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"></path><line x1="2.75" y1="2.75" x2="2.75" y2="15.25" fill="none" stroke="context-fill" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" data-color="color-2"></line></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="18px" height="18px" viewBox="0 0 18 18"><path d="M15.205,3.042c-.502-.297-1.107-.305-1.618-.022L5.333,7.59c-.514,.285-.833,.825-.833,1.41s.319,1.125,.833,1.41l8.254,4.57c.249,.138,.52,.207,.791,.206,.285,0,.57-.076,.828-.228,.498-.293,.795-.812,.795-1.387V4.43c0-.575-.297-1.094-.795-1.387Z" fill="context-fill"></path><path d="M2.75,2c-.414,0-.75,.336-.75,.75V15.25c0,.414,.336,.75,.75,.75s.75-.336,.75-.75V2.75c0-.414-.336-.75-.75-.75Z" fill="context-fill" data-color="color-2"></path></svg>
--- a/src/browser/themes/shared/zen-icons/lin/media-unmute.svg
+++ b/src/browser/themes/shared/zen-icons/lin/media-unmute.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M5,5.75H2.25c-.828,0-1.5,.672-1.5,1.5v3.5c0,.828,.672,1.5,1.5,1.5h2.75l5.48,3.508c.333,.213,.77-.026,.77-.421V2.664c0-.395-.437-.634-.77-.421l-5.48,3.508Z"></path><path d="M13.914,7.586c.781,.781,.781,2.047,0,2.828" data-color="color-2"></path><path d="M15.859,5.641c1.855,1.855,1.855,4.863,0,6.718" data-color="color-2"></path></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="18px" height="18px" viewBox="0 0 18 18"><path d="M11.35,1.567c-.4-.219-.889-.203-1.273,.044l-5.295,3.389H2.25c-1.241,0-2.25,1.009-2.25,2.25v3.5c0,1.241,1.009,2.25,2.25,2.25h2.531l5.295,3.389c.205,.131,.439,.198,.675,.198,.206,0,.412-.051,.599-.153,.401-.219,.65-.64,.65-1.097V2.664c0-.457-.249-.877-.65-1.097Z" fill="context-fill" fill-opacity="context-fill-opacity"></path><path d="M14.444,7.056c-.293-.293-.769-.293-1.061,0-.293,.293-.293,.768,0,1.061,.236,.236,.366,.55,.366,.884s-.13,.647-.366,.884c-.293,.292-.293,.768,0,1.061,.146,.146,.338,.22,.53,.22s.384-.073,.53-.22c.52-.519,.806-1.209,.806-1.944s-.286-1.425-.806-1.944Z" fill="context-fill" fill-opacity="context-fill-opacity" data-color="color-2"></path><path d="M15.329,5.111c-.293,.293-.293,.768,0,1.061,1.56,1.56,1.56,4.098,0,5.657-.293,.293-.293,.768,0,1.061,.146,.146,.338,.22,.53,.22s.384-.073,.53-.22c1.039-1.039,1.611-2.42,1.611-3.889s-.572-2.851-1.611-3.889c-.293-.293-.768-.293-1.061,0Z" fill="context-fill" fill-opacity="context-fill-opacity" data-color="color-2"></path></svg>
--- a/src/browser/themes/windows/browser-css.patch
+++ b/src/browser/themes/windows/browser-css.patch
@@ -1,8 +1,15 @@
 diff --git a/browser/themes/windows/browser.css b/browser/themes/windows/browser.css
-index f49604e53780763b9aa19897458c45f0be6cbc9b..aa9da99641ba4a3b7f67a27acbbf6c75c1346ced 100644
+index f49604e53780763b9aa19897458c45f0be6cbc9b..5ea9098a9b689470ef4ddfea91069cd23391d020 100644
 --- a/browser/themes/windows/browser.css
 +++ b/browser/themes/windows/browser.css
-@@ -47,7 +47,7 @@
+@@ -40,14 +40,13 @@
+          * override these on the tabs toolbar because the accent color is
+          * arbitrary, so the hardcoded colors from browser-custom-colors might
+          * not provide sufficient contrast. */
+-        --toolbarbutton-icon-fill: currentColor;
+         --toolbarbutton-hover-background: color-mix(in srgb, currentColor 17%, transparent);
+         --toolbarbutton-active-background: color-mix(in srgb, currentColor 30%, transparent);
+       }
     }
 
     &[sizemode="normal"] #navigator-toolbox {
--- a/src/dom/chrome-webidl/MediaController-webidl.patch
+++ b/src/dom/chrome-webidl/MediaController-webidl.patch
@@ -1,5 +1,5 @@
 diff --git a/dom/chrome-webidl/MediaController.webidl b/dom/chrome-webidl/MediaController.webidl
-index 20f416d1c3b41798e0f90bbac5db40ed2a4ab000..06cb4c847fcfba964eeb93089613e293dc10bd87 100644
+index 20f416d1c3b41798e0f90bbac5db40ed2a4ab000..1c5d893f9166a3aa7bc7802bb0d1207d169033ee 100644
 --- a/dom/chrome-webidl/MediaController.webidl
 +++ b/dom/chrome-webidl/MediaController.webidl
@@ -20,6 +20,12 @@ enum MediaControlKey {
@@ -15,7 +15,12 @@ index 20f416d1c3b41798e0f90bbac5db40ed2a4ab000..06cb4c847fcfba964eeb93089613e293
 /**
  * MediaController is used to control media playback for a tab, and each tab
  * would only have one media controller, which can be accessed from the
-@@ -36,6 +42,9 @@ interface MediaController : EventTarget {
+@@ -32,10 +38,14 @@ interface MediaController : EventTarget {
+   readonly attribute boolean isAudible;
+   readonly attribute boolean isPlaying;
+   readonly attribute MediaSessionPlaybackState playbackState;
+  readonly attribute boolean isBeingUsedInPIPModeOrFullscreen;
+ 
   [Throws]
   MediaMetadataInit getMetadata();
 
--- a/src/dom/media/mediacontrol/MediaController-cpp.patch
+++ b/src/dom/media/mediacontrol/MediaController-cpp.patch
@@ -1,5 +1,5 @@
 diff --git a/dom/media/mediacontrol/MediaController.cpp b/dom/media/mediacontrol/MediaController.cpp
-index 3f08d24d4ed56bb72ed513ed602b2c8fa48afe7b..690d9abdb0ab8efc019dd606743b82504834faa0 100644
+index 3f08d24d4ed56bb72ed513ed602b2c8fa48afe7b..98dfe4df48f5daebd2b619f0d4d4eb3ac873a66f 100644
 --- a/dom/media/mediacontrol/MediaController.cpp
 +++ b/dom/media/mediacontrol/MediaController.cpp
@@ -51,6 +51,25 @@ void MediaController::GetSupportedKeys(
@@ -28,3 +28,11 @@ index 3f08d24d4ed56bb72ed513ed602b2c8fa48afe7b..690d9abdb0ab8efc019dd606743b8250
 void MediaController::GetMetadata(MediaMetadataInit& aMetadata,
                                   ErrorResult& aRv) {
   if (!IsActive() || mShutdown) {
+@@ -412,6 +431,7 @@ void MediaController::SetIsInPictureInPictureMode(
+   ForceToBecomeMainControllerIfNeeded();
+   UpdateDeactivationTimerIfNeeded();
+   mPictureInPictureModeChangedEvent.Notify(mIsInPictureInPictureMode);
+  DispatchAsyncEvent(u"pictureinpicturemodechange"_ns);
+ }
+ 
+ void MediaController::NotifyMediaFullScreenState(uint64_t aBrowsingContextId,
--- a/src/toolkit/actors/AudioPlaybackParent-sys-mjs.patch
+++ b/src/toolkit/actors/AudioPlaybackParent-sys-mjs.patch
@@ -1,17 +0,0 @@
-diff --git a/toolkit/actors/AudioPlaybackParent.sys.mjs b/toolkit/actors/AudioPlaybackParent.sys.mjs
-index db682fd90b2bb5330497d2cf2158ff4cac6bbc47..4e6f891275d489418b8ea58a10345a1baa3a554c 100644
--- a/toolkit/actors/AudioPlaybackParent.sys.mjs
-+++ b/toolkit/actors/AudioPlaybackParent.sys.mjs
-@@ -14,10 +14,12 @@ export class AudioPlaybackParent extends JSWindowActorParent {
-     switch (aMessage.name) {
-       case "AudioPlayback:Start":
-         this._hasAudioPlayback = true;
-+        browser.ownerGlobal.gZenMediaController.activateMediaControls(this.browsingContext.mediaController, browser);
-         browser.audioPlaybackStarted();
-         break;
-       case "AudioPlayback:Stop":
-         this._hasAudioPlayback = false;
-+        browser.ownerGlobal.gZenMediaController.updateMuteState();
-         browser.audioPlaybackStopped();
-         break;
-       case "AudioPlayback:ActiveMediaBlockStart":
--- a/src/toolkit/components/pictureinpicture/PictureInPicture-sys-mjs.patch
+++ b/src/toolkit/components/pictureinpicture/PictureInPicture-sys-mjs.patch
@@ -1,5 +1,5 @@
 diff --git a/toolkit/components/pictureinpicture/PictureInPicture.sys.mjs b/toolkit/components/pictureinpicture/PictureInPicture.sys.mjs
-index 5da0404b2672ba8cce7bcf808bf2373474776654..c3d58941b66c54f9d506698d015e294f8c8a5ceb 100644
+index 5da0404b2672ba8cce7bcf808bf2373474776654..44b62bd752294c2af96dd5b5d08c90ddf3dc513f 100644
 --- a/toolkit/components/pictureinpicture/PictureInPicture.sys.mjs
 +++ b/toolkit/components/pictureinpicture/PictureInPicture.sys.mjs
@@ -488,13 +488,13 @@ export var PictureInPicture = {
@@ -19,7 +19,15 @@ index 5da0404b2672ba8cce7bcf808bf2373474776654..c3d58941b66c54f9d506698d015e294f
     await this.closeSinglePipWindow({ reason: "Unpip", actorRef: pipActor });
   },
 
-@@ -877,7 +877,7 @@ export var PictureInPicture = {
+@@ -623,6 +623,7 @@ export var PictureInPicture = {
+       pipToggle.hidden = true;
+     }
+ 
+    win.gZenMediaController.updatePipEligibility(browser, !pipToggle.hidden);
+     let browserHasPip = !!this.browserWeakMap.get(browser);
+     if (browserHasPip) {
+       this.setUrlbarPipIconActive(browser.ownerGlobal);
+@@ -877,7 +878,7 @@ export var PictureInPicture = {
     win.setIsMutedState(videoData.isMuted);
 
     // set attribute which shows pip icon in tab
--- a/src/toolkit/components/pictureinpicture/content/player-js.patch
+++ b/src/toolkit/components/pictureinpicture/content/player-js.patch
@@ -0,0 +1,16 @@
+diff --git a/toolkit/components/pictureinpicture/content/player.js b/toolkit/components/pictureinpicture/content/player.js
+index 9a4971d5d24dba6e543be8ea321c6be8c43ad859..b0788967e51736b1ec95daf96a1504bfd7c1dea7 100644
+--- a/toolkit/components/pictureinpicture/content/player.js
+++ b/toolkit/components/pictureinpicture/content/player.js
+@@ -722,6 +722,11 @@ let Player = {
+         document.getElementById("large").click();
+         break;
+       }
+
+      case "minimize": {
+        this.closePipWindow({ reason: "CloseButton" });
+        break;
+      }
+     }
+     // If the click came from a element that is not inside the subtitles settings panel
+     // then we want to hide the panel
--- a/src/toolkit/components/pictureinpicture/content/player-xhtml.patch
+++ b/src/toolkit/components/pictureinpicture/content/player-xhtml.patch
@@ -0,0 +1,37 @@
+diff --git a/toolkit/components/pictureinpicture/content/player.xhtml b/toolkit/components/pictureinpicture/content/player.xhtml
+index 440ce51e8e67e4d3a7bdcb78f38f2fb6684c9848..38912579310314a13d516328ec770db6b589d243 100644
+--- a/toolkit/components/pictureinpicture/content/player.xhtml
+++ b/toolkit/components/pictureinpicture/content/player.xhtml
+@@ -17,6 +17,7 @@
+     <link rel="localization" href="browser/browserSets.ftl"/>
+     <script src="chrome://global/content/pictureinpicture/player.js"></script>
+     <title data-l10n-id="pictureinpicture-player-title"></title>
+    <link rel="localization" href="browser/zen-general.ftl"/>
+   </head>
+ 
+   <body>
+@@ -52,13 +53,22 @@
+       tabindex="10"
+ #endif
+       />
+-      <button id="unpip"
+-      class="control-item control-button tooltip-under-controls" data-l10n-id="pictureinpicture-unpip-btn" data-l10n-attrs="tooltip"
+      <button id="minimize"
+      class="control-item control-button tooltip-under-controls" data-l10n-id="pictureinpicture-minimize-btn" data-l10n-attrs="tooltip"
+ #ifdef XP_MACOSX
+       mac="true"
+       tabindex="10"
+ #else
+       tabindex="9"
+#endif
+      />
+      <button id="unpip"
+      class="control-item control-button tooltip-under-controls" data-l10n-id="pictureinpicture-unpip-btn" data-l10n-attrs="tooltip"
+#ifdef XP_MACOSX
+      mac="true"
+      tabindex="11"
+#else
+      tabindex="10"
+ #endif
+       />
+     <div id="controls-bottom-gradient" class="control-item"></div>
--- a/src/toolkit/themes/shared/pictureinpicture/player-css.patch
+++ b/src/toolkit/themes/shared/pictureinpicture/player-css.patch
@@ -0,0 +1,22 @@
+diff --git a/toolkit/themes/shared/pictureinpicture/player.css b/toolkit/themes/shared/pictureinpicture/player.css
+index a3ffe31d47cc81a0cb578acc9177aaa6f41668eb..cf69507804b7c50f9afcfabb744098cfbe409396 100644
+--- a/toolkit/themes/shared/pictureinpicture/player.css
+++ b/toolkit/themes/shared/pictureinpicture/player.css
+@@ -724,3 +724,17 @@ input:checked + .slider::before {
+     justify-self: center;
+   }
+ }
+
+#minimize {
+  background-image: url("chrome://browser/skin/zen-icons/unpin.svg");
+  background-color: rgba(255, 255, 255, .8);
+  position: absolute;
+  fill: var(--close-btn-fill-color);
+  right: 50px;
+  top: 10px;
+}
+
+#minimize[mac="true"] {
+  right: auto;
+  left: 50px;
+}
--- a/src/tools/signing/macos/mach_commands-py.patch
+++ b/src/tools/signing/macos/mach_commands-py.patch
@@ -1,5 +1,5 @@
 diff --git a/tools/signing/macos/mach_commands.py b/tools/signing/macos/mach_commands.py
-index a513ad723805459c194d27b42dac68e9babba468..be74acbfe16a4eb389bc7d0ba32820b82fe2819c 100644
+index a513ad723805459c194d27b42dac68e9babba468..3a08bb0987f9d6cf01c05f8ebb56efa91a5b9d0e 100644
 --- a/tools/signing/macos/mach_commands.py
 +++ b/tools/signing/macos/mach_commands.py
@@ -37,7 +37,6 @@ from mozbuild.base import MachCommandConditions as conditions
@@ -10,15 +10,18 @@ index a513ad723805459c194d27b42dac68e9babba468..be74acbfe16a4eb389bc7d0ba32820b8
 )
 @CommandArgument(
     "-v",
-@@ -342,6 +341,7 @@ def macos_sign(
+@@ -342,6 +341,10 @@ def macos_sign(
     cs_reset_cmd = ["find", app, "-exec", "codesign", "--remove-signature", "{}", ";"]
     run(command_context, cs_reset_cmd, capture_output=not verbose_arg)
 
-+    run(command_context, ["mv", "./embedded.provisionprofile", os.path.join(app, "Contents")], capture_output=not verbose_arg)
+    originProfile = os.path.join(os.curdir, "embedded.provisionprofile")
+    endProfile = os.path.join(app, "Contents", "embedded.provisionprofile")
+    print(f"ZEN: Moving {originProfile} to {endProfile}")
+    os.rename(originProfile, endProfile)
     if use_rcodesign_arg is True:
         sign_with_rcodesign(
             command_context,
-@@ -567,7 +567,7 @@ def sign_with_rcodesign(
+@@ -567,7 +570,7 @@ def sign_with_rcodesign(
     # input path and its options are specified as standard arguments.
     ctx.log(logging.INFO, "macos-sign", {}, "Signing with rcodesign")
 
--- a/surfer.json
+++ b/surfer.json
@@ -5,8 +5,8 @@
  "binaryName": "zen",
  "version": {
    "product": "firefox",
-    "version": "136.0.1",
-    "candidate": "136.0.1"
+    "version": "136.0.2",
+    "candidate": "136.0.2"
  },
  "buildOptions": {
    "generateBranding": true
@@ -19,7 +19,7 @@
      "brandShortName": "Zen",
      "brandFullName": "Zen Browser",
      "release": {
-        "displayVersion": "1.10b",
+        "displayVersion": "1.10.1b",
        "github": {
          "repo": "zen-browser/desktop"
        },
@@ -39,7 +39,7 @@
      "brandShortName": "Twilight",
      "brandFullName": "Zen Twilight",
      "release": {
-        "displayVersion": "1.10t",
+        "displayVersion": "1.10.1t",
        "github": {
          "repo": "zen-browser/desktop"
        }