Merge branch 'dev' into glance-buttons-overflow

.github/workflows/build.yml

@@ -384,6 +384,8 @@ jobs:
       - name: Execute AppImage build
         run: |
           set -eux
+          export ARCH=${{ matrix.arch }}
+          UPINFO="gh-releases-zsync|$GITHUB_REPOSITORY_OWNER|desktop|latest|zen-$ARCH.AppImage.zsync"
           rm AppDir/.DirIcon || true
           cp configs/branding/${{ inputs.update_branch }}/logo128.png AppDir/usr/share/icons/hicolor/128x128/apps/zen.png
           cp configs/branding/${{ inputs.update_branch }}/logo128.png AppDir/zen.png && ln -s zen.png AppDir/.DirIcon
@@ -396,18 +398,23 @@ jobs:
           APPDIR=AppDir
           tar -xvf *.tar.* && rm -rf *.tar.*
           mv zen/* $APPDIR/
-          wget https://github.com/AppImage/appimagetool/releases/download/continuous/appimagetool-x86_64.AppImage
+          wget "https://github.com/AppImage/appimagetool/releases/download/continuous/appimagetool-x86_64.AppImage"
+          wget "https://github.com/VHSgunzo/uruntime/releases/latest/download/uruntime-appimage-squashfs-lite-$ARCH"
           chmod +x *.AppImage
+          chmod +x ./uruntime-appimage-squashfs-lite-"$ARCH"
           chmod +x ./AppDir/AppRun
+
+          # keep the uruntime mountpoint (massively speeds up launch time)
+          sed -i 's|URUNTIME_MOUNT=[0-9]|URUNTIME_MOUNT=0|' ./uruntime-appimage-squashfs-lite-"$ARCH"
+
           echo "AppDir: $APPDIR"
           ls -al
           find .
           ls -al "$APPDIR"
-          ARCH=${{ matrix.arch }} ./appimagetool-x86_64.AppImage --comp zstd --mksquashfs-opt -Xcompression-level --mksquashfs-opt 10 \
+          ./appimagetool-x86_64.AppImage -u "$UPINFO" "$APPDIR" zen-"$ARCH".AppImage --runtime-file ./uruntime-appimage-squashfs-lite-"$ARCH"
-          -u "gh-releases-zsync|$GITHUB_REPOSITORY_OWNER|desktop|latest|zen-${{ matrix.arch }}.AppImage.zsync" \
-          "$APPDIR" zen-${{ matrix.arch }}.AppImage
           mkdir dist
           mv zen*AppImage* dist/.
+          unset ARCH
 
       - name: Upload artifact
         uses: actions/upload-artifact@v4
@@ -464,10 +471,6 @@ jobs:
           submodules: recursive
           token: ${{ secrets.DEPLOY_KEY }}
 
-      - name: Git pull
-        run: |
-          git pull
-
       - name: Download artifact
         uses: actions/download-artifact@v4
 
@@ -513,11 +516,15 @@ jobs:
           commit_user_email: zen-browser-auto@users.noreply.github.com
           repository: ./updates-server
 
+      - name: Generate Release Notes
+        run: bash .github/workflows/src/generate_release_notes.sh
+
         # If we are on Twilight, we want to just update the Twilight tag's release
       - name: Update Twilight tag
         if: ${{ inputs.update_branch == 'twilight' }}
         uses: softprops/action-gh-release@v2
         with:
+          body_path: release_notes.md
           files: |
             ./zen.source.tar.zst/*
             ./zen.linux-x86_64.tar.xz/*
@@ -556,6 +563,7 @@ jobs:
           fail_on_unmatched_files: false
           generate_release_notes: false
           name: 'Release build - ${{ needs.build-data.outputs.version }} (${{ needs.build-data.outputs.build_date }})'
+          body_path: release_notes.md
           files: |
             ./zen.source.tar.zst/*
             ./zen.linux-x86_64.tar.xz/*

.github/workflows/linux-release-build.yml

@@ -39,6 +39,10 @@ jobs:
         with:
           tool-cache: false
 
+      # Bug: https://github.com/actions/checkout/issues/1153
+      - name: Remove zombie lock file
+        run: rm -f /home/ubuntu/actions-runner/_work/desktop/desktop/.git/modules/l10n/index.lock
+
       - name: Checkout repository
         uses: actions/checkout@v4
         with:
@@ -55,6 +59,13 @@ jobs:
         with:
           disable_annotations: true
 
+      - name: Expose actions cache variables
+        uses: actions/github-script@v6
+        with:
+          script: |
+            core.exportVariable('ACTIONS_CACHE_URL', process.env['ACTIONS_CACHE_URL'])
+            core.exportVariable('ACTIONS_RUNTIME_TOKEN', process.env['ACTIONS_RUNTIME_TOKEN'])
+
       - name: Setup Git
         run: |
           git config --global user.email "mauro-balades@users.noreply.github.com"

.github/workflows/macos-release-build.yml

@@ -47,6 +47,13 @@ jobs:
         with:
           disable_annotations: true
 
+      - name: Expose actions cache variables
+        uses: actions/github-script@v6
+        with:
+          script: |
+            core.exportVariable('ACTIONS_CACHE_URL', process.env['ACTIONS_CACHE_URL'])
+            core.exportVariable('ACTIONS_RUNTIME_TOKEN', process.env['ACTIONS_RUNTIME_TOKEN'])
+
       - name: Setup Python
         uses: actions/setup-python@v5
         # note: This will use the version defined in '.python-version' by default

.github/workflows/src/generate_release_notes.sh

@@ -0,0 +1,108 @@
+#!/usr/bin/env bash
+RELEASE_NOTES_URL="https://raw.githubusercontent.com/zen-browser/www/refs/heads/main/src/release-notes/stable.json"
+
+if [ "$RELEASE_BRANCH" = "release" ]; then
+  RELEASE_TYPE="Stable"
+
+  echo "Fetching release notes from GitHub..."
+  RELEASE_NOTES_JSON=$(curl -s "$RELEASE_NOTES_URL")
+
+  if [ -z "$RELEASE_NOTES_JSON" ]; then
+    echo "Error: Failed to fetch release notes from GitHub"
+    exit 1
+  fi
+
+  LATEST_RELEASE=$(echo "$RELEASE_NOTES_JSON" | jq -r 'last')
+  EXTRA_NOTES=$(echo "$LATEST_RELEASE" | jq -r '.extra // ""')
+else
+  RELEASE_TYPE="Twilight"
+fi
+
+cat << EOF > "release_notes.md"
+# Zen ${RELEASE_TYPE} Release
+EOF
+
+if [ "$RELEASE_BRANCH" = "release" ]; then
+  echo "${EXTRA_NOTES}" >> "release_notes.md"
+
+  if echo "$LATEST_RELEASE" | jq -e 'has("features")' > /dev/null; then
+    cat << EOF >> "release_notes.md"
+
+## New Features
+$(echo "$LATEST_RELEASE" | jq -r '.features[] | "- " + .')
+EOF
+  fi
+
+  if echo "$LATEST_RELEASE" | jq -e 'has("fixes")' > /dev/null; then
+    cat << EOF >> "release_notes.md"
+
+## Fixes
+EOF
+    echo "$LATEST_RELEASE" | jq -r '.fixes[] | if type=="object" then "- " + .description + " ([#" + (.issue|tostring) + "](" + "https://github.com/zen-browser/desktop/issues/" + (.issue|tostring) + "))" else "- " + . end' >> "release_notes.md"
+  fi
+
+  if echo "$LATEST_RELEASE" | jq -e 'has("breakingChanges")' > /dev/null; then
+    cat << EOF >> "release_notes.md"
+
+## Breaking Changes
+EOF
+    echo "$LATEST_RELEASE" | jq -r '.breakingChanges[] | if type=="string" then "- " + . else "- " + .description + " [Learn more](" + .link + ")" end' >> "release_notes.md"
+  fi
+
+  if echo "$LATEST_RELEASE" | jq -e 'has("themeChanges")' > /dev/null; then
+    cat << EOF >> "release_notes.md"
+
+## Theme Changes
+$(echo "$LATEST_RELEASE" | jq -r '.themeChanges[] | "- " + .')
+EOF
+  fi
+fi
+
+cat << EOF >> "release_notes.md"
+
+<details>
+<summary>File Checksums (SHA-256)</summary>
+
+\`\`\`
+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"
+  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"
+  "./.github/workflows/object/windows-x64-signed-x86_64/zen.win-x86_64.zip"
+  "./.github/workflows/object/windows-x64-signed-arm64/zen.win-arm64.zip"
+  "./linux.mar"
+  "./linux-aarch64.mar"
+  "./.github/workflows/object/windows-x64-signed-x86_64/windows.mar"
+  "./.github/workflows/object/windows-x64-signed-arm64/windows-arm64.mar"
+  "./macos.mar"
+  "./.github/workflows/object/windows-x64-signed-x86_64/zen.installer.exe"
+  "./.github/workflows/object/windows-x64-signed-arm64/zen.installer-arm64.exe"
+  "./zen.macos-universal.dmg"
+)
+
+for file in "${files[@]}"; do
+  generate_checksum "$file"
+done
+
+cat << EOF >> "release_notes.md"
+\`\`\`
+</details>
+EOF
+
+echo "Release notes generated: release_notes.md"

.github/workflows/windows-release-build.yml

@@ -45,6 +45,10 @@ jobs:
         with:
           tool-cache: false
 
+      # Bug: https://github.com/actions/checkout/issues/1153
+      - name: Remove zombie lock file
+        run: rm -f /home/ubuntu/actions-runner/_work/desktop/desktop/.git/modules/l10n/index.lock
+
       - name: Checkout repository
         uses: actions/checkout@v4
         with:
@@ -61,6 +65,13 @@ jobs:
         with:
           disable_annotations: true
 
+      - name: Expose actions cache variables
+        uses: actions/github-script@v6
+        with:
+          script: |
+            core.exportVariable('ACTIONS_CACHE_URL', process.env['ACTIONS_CACHE_URL'])
+            core.exportVariable('ACTIONS_RUNTIME_TOKEN', process.env['ACTIONS_RUNTIME_TOKEN'])
+
       - name: Setup Git
         run: |
           git config --global user.email "mauro-balades@users.noreply.github.com"

AppDir/AppRun

@@ -1,14 +1,6 @@
 #!/bin/sh
-SELF=$(readlink -f "$0")
+CURRENTDIR="$(dirname "$(readlink -f "$0")")"
-HERE=${SELF%/*}
+export PATH="${CURRENTDIR}:${PATH}"
-export PATH="${HERE}:${HERE}/usr/bin/:${HERE}/usr/sbin/:${HERE}/usr/games/:${HERE}/bin/:${HERE}/sbin/${PATH:+:$PATH}"
+export MOZ_LEGACY_PROFILES=1          # Prevent per installation profiles
-export LD_LIBRARY_PATH="${HERE}/usr/lib/:${HERE}/usr/lib/i386-linux-gnu/:${HERE}/usr/lib/x86_64-linux-gnu/:${HERE}/usr/lib32/:${HERE}/usr/lib64/:${HERE}/lib/:${HERE}/lib/i386-linux-gnu/:${HERE}/lib/x86_64-linux-gnu/:${HERE}/lib32/:${HERE}/lib64/${LD_LIBRARY_PATH:+:$LD_LIBRARY_PATH}"
+export MOZ_APP_LAUNCHER="${APPIMAGE}" # Allows setting as default browser
-export PYTHONPATH="${HERE}/usr/share/pyshared/${PYTHONPATH:+:$PYTHONPATH}"
+exec "${CURRENTDIR}/zen" "$@"
-export MOZ_LEGACY_PROFILES=1 # Prevent per installation profiles
-DEFAULT_XDG_DATA_DIRS='./share/:/usr/share/gnome:/usr/local/share/:/usr/share/'
-export XDG_DATA_DIRS="${HERE}/usr/share/:${XDG_DATA_DIRS:-$DEFAULT_XDG_DATA_DIRS}"
-export PERLLIB="${HERE}/usr/share/perl5/:${HERE}/usr/lib/perl5/${PERLLIB:+:$PERLLIB}"
-export GSETTINGS_SCHEMA_DIR="${HERE}/usr/share/glib-2.0/schemas/${GSETTINGS_SCHEMA_DIR:+:$GSETTINGS_SCHEMA_DIR}"
-export QT_PLUGIN_PATH="${HERE}/usr/lib/qt4/plugins/:${HERE}/usr/lib/i386-linux-gnu/qt4/plugins/:${HERE}/usr/lib/x86_64-linux-gnu/qt4/plugins/:${HERE}/usr/lib32/qt4/plugins/:${HERE}/usr/lib64/qt4/plugins/:${HERE}/usr/lib/qt5/plugins/:${HERE}/usr/lib/i386-linux-gnu/qt5/plugins/:${HERE}/usr/lib/x86_64-linux-gnu/qt5/plugins/:${HERE}/usr/lib32/qt5/plugins/:${HERE}/usr/lib64/qt5/plugins/${QT_PLUGIN_PATH:+:$QT_PLUGIN_PATH}"
-EXEC=$(grep -e '^Exec=.*' "${HERE}"/*.desktop | head -n 1 | cut -d "=" -f 2 | cut -d " " -f 1)
-exec "${EXEC}" "$@"

README.md

@@ -28,7 +28,7 @@
 
 ## 🖥️ Compatibility
 
-Zen is currently built using Firefox version `135.0.1`! 🚀
+Zen is currently built using Firefox version `136.0.1`! 🚀
 
 - [`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)!
@@ -44,7 +44,7 @@ We keep track of how many issues are closed at the end of the month in [docs/iss
 
 ### Versioning
 
-Zen uses [Semantic Versioning](https://semver.org/), meaning versions are displayed as `a.bc.d` where:
+Zen uses [Semantic Versioning](https://semver.org/), meaning versions are displayed as `a.b.cd` where:
 
 - `a` is the major version
 - `b` is the minor version

configs/common/mozconfig

@@ -59,7 +59,6 @@ if test "$ZEN_RELEASE"; then
   ac_add_options --disable-rust-tests
 
   ac_add_options --disable-default-browser-agent
-# ac_add_options --enable-minify=js,properties
 
   if ! test "$ZEN_DISABLE_LTO"; then
     # only enable full LTO when ZEN_RELEASE_BRANCH is 'release'

firefox-cache/l10n-last-commit-hash

@@ -0,0 +1 @@
+6ad0ab3c43a6208d8bcd997b40e802fccd48ba0a

package.json

@@ -13,7 +13,7 @@
     "export": "surfer export",
     "init": "npm run download && npm run bootstrap && npm run import",
     "download": "surfer download",
-    "bootstrap": "surfer bootstrap && surfer bootstrap",
+    "bootstrap": "surfer bootstrap",
     "package": "surfer package",
     "update-ff": "python3 scripts/update_ff.py",
     "update-ff:raw": "surfer update",
@@ -41,7 +41,7 @@
   },
   "homepage": "https://github.com/zen-browser/core#readme",
   "dependencies": {
-    "@zen-browser/surfer": "^1.9.19"
+    "@zen-browser/surfer": "^1.10.4"
   },
   "devDependencies": {
     "husky": "^9.1.7",

scripts/update-surfer.sh

@@ -0,0 +1,10 @@
+#!/bin/bash
+
+# make sure we are on root
+if [ ! -f "package.json" ]; then
+  echo "Please run this script from the root of the project"
+  exit 1
+fi
+
+npm update @zen-browser/surfer
+npm i @zen-browser/surfer@latest

src/browser/app/profile/zen-browser.js

@@ -81,7 +81,7 @@ pref('zen.tabs.vertical', true);
 pref('zen.tabs.vertical.right-side', false);
 pref('zen.tabs.rename-tabs', true);
 pref('zen.theme.accent-color', "#ffb787");
-pref('zen.theme.content-element-separation', 6); // In pixels
+pref('zen.theme.content-element-separation', 8); // In pixels
 pref('zen.theme.gradient', true);
 pref('zen.theme.gradient.show-custom-colors', false);
 pref('zen.theme.essentials-favicon-bg', true);
@@ -118,9 +118,11 @@ pref('zen.view.compact.animate-sidebar', true);
 pref('zen.view.compact.show-sidebar-and-toolbar-on-hover', true);
 
 pref('zen.urlbar.replace-newtab', true);
+pref('zen.urlbar.show-protections-icon', false);
 pref('zen.urlbar.behavior', 'floating-on-type'); // default, floating-on-type, float
 pref('zen.urlbar.wait-to-clear', 45000); // in ms (default 45s)
 pref('zen.urlbar.show-domain-only-in-sidebar', true);
+pref('zen.urlbar.hide-one-offs', true);
 
 #ifdef XP_MACOSX
 // Disable for macos in the meantime until @HarryHeres finds a solution for hight DPI screens
@@ -177,15 +179,17 @@ pref('zen.pinned-tab-manager.restore-pinned-tabs-to-pinned-url', false);
 pref('zen.pinned-tab-manager.close-shortcut-behavior', 'reset-unload-switch');
 
 // TODO: Check this out!
-pref("browser.profiles.enabled", true);
+pref("browser.profiles.enabled", false);
 
 // Zen webpanels (calling it sidebar due to legacy reasons)
 pref('zen.sidebar.data', "{\"data\":\n {\"p1\":{\n   \"url\":\"https://www.wikipedia.org/\"\n  },\n\"p2\":{\n   \"url\":\"https://m.twitter.com/\",\n\"ua\": true\n  },\n\"p3\": {\n   \"url\": \"https://www.youtube.com/\",\n\"ua\": true\n},\n\"p4\": {\n   \"url\": \"https://translate.google.com/\",\n\"ua\": true\n},\n\"p5\": {\n   \"url\": \"https://todoist.com/\",\n\"ua\": true\n}},\n\"index\":[\"p1\",\"p2\",\"p3\",\"p4\",\"p5\"]}");
 pref('zen.sidebar.enabled', true);
 pref('zen.sidebar.close-on-blur', true);
 pref('zen.sidebar.max-webpanels', 8);
+pref('zen.sidebar.use-google-favicons', true);
 
 // Zen Split View
+pref('zen.splitView.enable-tab-drop', true);
 pref('zen.splitView.min-resize-width', 7);
 pref('zen.splitView.change-on-hover', false);
 pref('zen.splitView.rearrange-hover-size', 24);
@@ -197,7 +201,6 @@ pref('zen.startup.smooth-scroll-in-tabs', true);
 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.individual-pinned-tabs', 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);
@@ -378,7 +381,7 @@ pref('widget.macos.titlebar-blend-mode.behind-window', true);
 // 5. toolTip
 // 6. headerView
 // 7. underlay
-pref('zen.widget.macos.window-material', 7);
+pref('zen.widget.macos.window-material', 3);
 #endif
 
 // Urlbar and autocomplete
@@ -437,6 +440,13 @@ pref("browser.newtabpage.activity-stream.asrouter.userprefs.cfr.features", false
 pref("browser.preferences.moreFromMozilla", false, locked);
 pref("browser.aboutwelcome.enabled", false);
 
+// AI/ML stuff
+pref("browser.ml.chat.enabled", false);
+pref("browser.ml.chat.shortcuts", false);
+pref("browser.ml.chat.shortcuts.custom", false);
+pref("browser.ml.chat.sidebar", false);
+pref("browser.ml.enable", false);
+
 // ---- Experimental settings to try make zen faster
 pref("gfx.canvas.accelerated.cache-items", 32768);
 pref("gfx.canvas.accelerated.cache-size", 256);

src/browser/base/content/ZenStartup.mjs

@@ -48,6 +48,7 @@
 
     openWatermark() {
       if (!Services.prefs.getBoolPref('zen.watermark.enabled', false)) {
+        document.documentElement.removeAttribute('zen-before-loaded');
         return;
       }
       for (let elem of document.querySelectorAll('#browser > *, #urlbar')) {

src/browser/base/content/ZenUIManager.mjs

@@ -37,6 +37,8 @@ var gZenUIManager = {
 
     window.addEventListener('TabClose', this.onTabClose.bind(this));
     this.tabsWrapper.addEventListener('scroll', this.saveScrollbarState.bind(this));
+
+    gZenMediaController.init();
   },
 
   updateTabsToolbar() {
@@ -62,6 +64,7 @@ var gZenUIManager = {
     }
     tabs.style.removeProperty('flex');
     tabs.style.maxHeight = height + 'px';
+    gZenVerticalTabsManager.actualWindowButtons.removeAttribute('zen-has-hover');
   },
 
   get tabsWrapper() {
@@ -346,33 +349,37 @@ var gZenVerticalTabsManager = {
       return visibleTabs[visibleTabs.length - 1] === aTab;
     };
 
-    const tabSize = aTab.getBoundingClientRect().height;
+    try {
-    const transform = `-${tabSize}px`;
+      const tabSize = aTab.getBoundingClientRect().height;
-    gZenUIManager.motion
+      const transform = `-${tabSize}px`;
-      .animate(
+      gZenUIManager.motion
-        aTab,
+        .animate(
-        {
+          aTab,
-          opacity: [0, 1],
+          {
-          transform: ['scale(0.95)', 'scale(1)'],
+            opacity: [0, 1],
-          marginBottom: isLastTab() ? [] : [transform, '0px'],
+            transform: ['scale(0.95)', 'scale(1)'],
-        },
+            marginBottom: isLastTab() ? [] : [transform, '0px'],
-        {
+          },
-          duration: 0.2,
+          {
-          easing: 'ease-out',
+            duration: 0.2,
-        }
+            easing: 'ease-out',
-      )
+          }
-      .then(() => {
+        )
-        aTab.style.removeProperty('margin-bottom');
+        .then(() => {
-        aTab.style.removeProperty('transform');
+          aTab.style.removeProperty('margin-bottom');
-        aTab.style.removeProperty('opacity');
+          aTab.style.removeProperty('transform');
-      });
+          aTab.style.removeProperty('opacity');
-    gZenUIManager.motion
+        });
-      .animate(aTab.querySelector('.tab-content'), {
+      gZenUIManager.motion
-        filter: ['blur(1px)', 'blur(0px)'],
+        .animate(aTab.querySelector('.tab-content'), {
-      })
+          filter: ['blur(1px)', 'blur(0px)'],
-      .then(() => {
+        })
-        aTab.querySelector('.tab-stack').style.removeProperty('filter');
+        .then(() => {
-      });
+          aTab.querySelector('.tab-stack').style.removeProperty('filter');
+        });
+    } catch (e) {
+      console.error(e);
+    }
   },
 
   get actualWindowButtons() {
@@ -619,6 +626,12 @@ var gZenVerticalTabsManager = {
       }
 
       gZenCompactModeManager.updateCompactModeContext(isSingleToolbar);
+      document.getElementById('urlbar').removeAttribute('--urlbar-height');
+      if (!isSingleToolbar) {
+        document.getElementById('urlbar').style.setProperty('--urlbar-height', '32px');
+      } else {
+        gURLBar.updateLayoutBreakout();
+      }
 
       // Always move the splitter next to the sidebar
       this.navigatorToolbox.after(document.getElementById('zen-sidebar-splitter'));

src/browser/base/content/main-popupset-inc-xhtml.patch

@@ -1,8 +1,8 @@
 diff --git a/browser/base/content/main-popupset.inc.xhtml b/browser/base/content/main-popupset.inc.xhtml
-index e5f3424eaeeec0ba552537f167dd99e912216d94..4bdfcdb23fe9c44ad3d4de273c64f4cc31cb4034 100644
+index 959c523b21c642f29353b9de37b3ce6b5505b01b..4cd26ea85ad4905bade71dcd470b8678079787bd 100644
 --- a/browser/base/content/main-popupset.inc.xhtml
 +++ b/browser/base/content/main-popupset.inc.xhtml
-@@ -181,6 +181,10 @@
+@@ -206,6 +206,10 @@
             hidden="true"
             tabspecific="true"
             aria-labelledby="editBookmarkPanelTitle">
@@ -13,7 +13,7 @@ index e5f3424eaeeec0ba552537f167dd99e912216d94..4bdfcdb23fe9c44ad3d4de273c64f4cc
        <box class="panel-header">
          <html:h1>
            <html:span id="editBookmarkPanelTitle"/>
-@@ -206,6 +210,7 @@
+@@ -231,6 +235,7 @@
                    class="footer-button"/>
          </html:moz-button-group>
        </vbox>
@@ -21,7 +21,21 @@ index e5f3424eaeeec0ba552537f167dd99e912216d94..4bdfcdb23fe9c44ad3d4de273c64f4cc
      </panel>
    </html:template>
  
-@@ -535,6 +540,8 @@
+@@ -426,11 +431,13 @@
+               observes="cmd_CustomizeToolbars"
+               class="viewCustomizeToolbar"
+               data-lazy-l10n-id="toolbar-context-menu-view-customize-toolbar-2"/>
++#if 0
+     <menuseparator id="sidebarRevampSeparator"/>
+     <menuitem id="toolbar-context-toggle-vertical-tabs"
+               data-lazy-l10n-id="toolbar-context-turn-on-vertical-tabs"/>
+     <menuitem id="toolbar-context-customize-sidebar"
+               data-lazy-l10n-id="toolbar-context-customize-sidebar"/>
++#endif
+     <menuseparator contexttype="fullscreen"/>
+     <menuitem id="toolbar-context-full-screen-autohide"
+               class="fullscreen-context-autohide"
+@@ -565,6 +572,8 @@
  
  #include popup-notifications.inc.xhtml
  

src/browser/base/content/zen-assets.inc.xhtml

@@ -26,6 +26,7 @@
 <link rel="stylesheet" type="text/css" href="chrome://browser/skin/zen-icons/icons.css" />
 <link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-branding.css" />
 <link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-welcome.css" />
+<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-media-controls.css" />
 </linkset>
 
 # Scripts used all over the browser
@@ -42,6 +43,7 @@
 <script src="chrome://browser/content/zen-components/ZenGradientGenerator.mjs" />
 <script src="chrome://browser/content/zen-components/ZenViewSplitter.mjs"/>
 <script src="chrome://browser/content/zen-components/ZenGlanceManager.mjs" />
+<script src="chrome://browser/content/zen-components/ZenMediaController.mjs" />
 
 # Unimportant scripts
 <script src="chrome://browser/content/zen-components/ZenRices.mjs" />

src/browser/base/content/zen-assets.jar.inc.mn

@@ -25,6 +25,7 @@
         content/browser/zen-components/ZenRices.mjs             (zen-components/ZenRices.mjs)
         content/browser/zen-components/ZenEmojies.mjs           (zen-components/ZenEmojies.mjs)
         content/browser/zen-components/ZenWelcome.mjs           (zen-components/ZenWelcome.mjs)
+        content/browser/zen-components/ZenMediaController.mjs   (zen-components/ZenMediaController.mjs)
 
         content/browser/zen-styles/zen-theme.css                (content/zen-styles/zen-theme.css)
         content/browser/zen-styles/zen-buttons.css              (content/zen-styles/zen-buttons.css)
@@ -49,6 +50,7 @@
         content/browser/zen-styles/zen-rices.css                (content/zen-styles/zen-rices.css)
         content/browser/zen-styles/zen-branding.css             (content/zen-styles/zen-branding.css)
         content/browser/zen-styles/zen-welcome.css              (content/zen-styles/zen-welcome.css)
+        content/browser/zen-styles/zen-media-controls.css       (content/zen-styles/zen-media-controls.css)
 
         content/browser/zen-styles/zen-panels/bookmarks.css     (content/zen-styles/zen-panels/bookmarks.css)
         content/browser/zen-styles/zen-panels/extensions.css    (content/zen-styles/zen-panels/extensions.css)
@@ -64,6 +66,7 @@
         content/browser/zen-images/layouts/multiple-toolbar.png (content/zen-images/layouts/multiple-toolbar.png)
         content/browser/zen-images/layouts/single-toolbar.png   (content/zen-images/layouts/single-toolbar.png)
         content/browser/zen-images/grain-bg.png                 (content/zen-images/grain-bg.png)
+        content/browser/zen-images/note-indicator.svg           (content/zen-images/note-indicator.svg)
 
         # Actors
         content/browser/zen-components/actors/ZenThemeMarketplaceParent.sys.mjs (zen-components/actors/ZenThemeMarketplaceParent.sys.mjs)

src/browser/base/content/zen-glance.inc.xhtml

@@ -1,6 +1,6 @@
 <vbox id="glance-wrapper">
   <vbox id="zen-glance-sidebar-container" hidden="true">
-    <toolbarbutton id="zen-glance-sidebar-close" class="toolbarbutton-1" oncommand="gZenGlanceManager.closeGlance({ onTabClose: true })"/>
+    <toolbarbutton id="zen-glance-sidebar-close" data-l10n-id="zen-general-confrim" class="toolbarbutton-1" oncommand="gZenGlanceManager.closeGlance({ onTabClose: true })"/>
     <toolbarbutton id="zen-glance-sidebar-open" class="toolbarbutton-1" oncommand="gZenGlanceManager.fullyOpenGlance()"/>
   </vbox>
 </vbox>

src/browser/base/content/zen-images/note-indicator.svg

@@ -0,0 +1,100 @@
+<svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg">
+  <rect width="100%" height="100%" fill="none"/>
+  
+    <style type="text/css"><![CDATA[
+    .note {
+      fill: white;
+      transform-box: fill-box;
+      transform-origin: center;
+    }
+    
+    @keyframes flyUpLeft {
+      from {
+        opacity: 1;
+        transform: translate(0px, 0px) scale(0.5) rotate(0deg);
+      }
+      to {
+        opacity: 0;
+        transform: translate(-9px, -35px) scale(5) rotate(0deg);
+      }
+    }
+    @keyframes flyUpRight {
+      from {
+        opacity: 1;
+        transform: translate(0px, 0px) scale(0.5) rotate(0deg);
+      }
+      to {
+        opacity: 0;
+        transform: translate(9px, -35px) scale(5) rotate(0deg);
+      }
+    }
+    @keyframes flyUpCenter {
+      from {
+        opacity: 1;
+        transform: translate(0px, 0px) scale(0.5) rotate(0deg);
+      }
+      to {
+        opacity: 0;
+        transform: translate(0px, -35px) scale(5) rotate(0deg);
+      }
+    }
+    }*/
+  ]]></style>
+
+  
+  <g class="note-group">
+    <g class="note" style="animation: flyUpLeft 3s ease-in-out infinite; animation-delay: 0s;">
+      <path transform="translate(15,40) scale(0.0078)" d="M448.231,166.755C352.139,64.989,240.998,2.38,240.998,2.38
+        c-3.297-2.625-7.813-3.125-11.609-1.281c-3.813,1.844-6.219,5.688-6.219,9.906v329
+        c-20.078-8.281-44.688-11.656-71.344-8.344C84.717,340.005,30.514,386.849,30.67,436.255
+        c0.188,49.453,54.703,82.813,121.75,74.469c67.078-8.328,121.297-55.188,121.125-104.641V164.817
+        c15.828,3.313,34.391,10.531,54.391,25.219c67.703,49.625,100.905,81.484,58.218,166.859
+        C475.403,321.974,514.2,236.599,448.231,166.755z"/>
+    </g>
+    
+    <g class="note" style="animation: flyUpRight 3s ease-in-out infinite; animation-delay: 0.5s;">
+      <path transform="translate(15,40) scale(0.0078)" d="M133.703,45.86v86.43v240.66c-16.8-6.173-36.654-8.012-57.11-4.054
+        c-49.141,9.454-82.977,48.227-75.577,86.559c7.389,38.353,53.195,61.757,102.326,52.292
+        c43.602-8.4,75.093-39.892,76.449-73.727h0.28V129.246L465.644,93.83v237.595
+        c-16.811-6.162-36.644-7.98-57.1-4.033c-49.152,9.443-82.966,48.217-75.6,86.559
+        c7.389,38.342,53.185,61.746,102.327,52.271c43.612-8.389,75.115-39.892,76.449-73.706
+        H512V90.785V2.152L133.703,45.86z"/>
+    </g>
+    
+    <g class="note" style="animation: flyUpCenter 3s ease-in-out infinite; animation-delay: 1s;">
+      <path transform="translate(15,40) scale(0.0078)" d="M448.231,166.755C352.139,64.989,240.998,2.38,240.998,2.38
+        c-3.297-2.625-7.813-3.125-11.609-1.281c-3.813,1.844-6.219,5.688-6.219,9.906v329
+        c-20.078-8.281-44.688-11.656-71.344-8.344C84.717,340.005,30.514,386.849,30.67,436.255
+        c0.188,49.453,54.703,82.813,121.75,74.469c67.078-8.328,121.297-55.188,121.125-104.641V164.817
+        c15.828,3.313,34.391,10.531,54.391,25.219c67.703,49.625,100.905,81.484,58.218,166.859
+        C475.403,321.974,514.2,236.599,448.231,166.755z"/>
+    </g>
+
+    <g class="note" style="animation: flyUpLeft 3s ease-in-out infinite; animation-delay: 1.5s;">
+      <path transform="translate(15,40) scale(0.0078)" d="M133.703,45.86v86.43v240.66c-16.8-6.173-36.654-8.012-57.11-4.054
+        c-49.141,9.454-82.977,48.227-75.577,86.559c7.389,38.353,53.195,61.757,102.326,52.292
+        c43.602-8.4,75.093-39.892,76.449-73.727h0.28V129.246L465.644,93.83v237.595
+        c-16.811-6.162-36.644-7.98-57.1-4.033c-49.152,9.443-82.966,48.217-75.6,86.559
+        c7.389,38.342,53.185,61.746,102.327,52.271c43.612-8.389,75.115-39.892,76.449-73.706
+        H512V90.785V2.152L133.703,45.86z"/>
+    </g>
+    
+    <g class="note" style="animation: flyUpRight 3s ease-in-out infinite; animation-delay: 2s;">
+      <path transform="translate(15,40) scale(0.0078)" d="M448.231,166.755C352.139,64.989,240.998,2.38,240.998,2.38
+        c-3.297-2.625-7.813-3.125-11.609-1.281c-3.813,1.844-6.219,5.688-6.219,9.906v329
+        c-20.078-8.281-44.688-11.656-71.344-8.344C84.717,340.005,30.514,386.849,30.67,436.255
+        c0.188,49.453,54.703,82.813,121.75,74.469c67.078-8.328,121.297-55.188,121.125-104.641V164.817
+        c15.828,3.313,34.391,10.531,54.391,25.219c67.703,49.625,100.905,81.484,58.218,166.859
+        C475.403,321.974,514.2,236.599,448.231,166.755z"/>
+    </g>
+    
+    <g class="note" style="animation: flyUpCenter 3s ease-in-out infinite; animation-delay: 2.5s;">
+      <path transform="translate(15,40) scale(0.0078)" d="M133.703,45.86v86.43v240.66c-16.8-6.173-36.654-8.012-57.11-4.054
+        c-49.141,9.454-82.977,48.227-75.577,86.559c7.389,38.353,53.195,61.757,102.326,52.292
+        c43.602-8.4,75.093-39.892,76.449-73.727h0.28V129.246L465.644,93.83v237.595
+        c-16.811-6.162-36.644-7.98-57.1-4.033c-49.152,9.443-82.966,48.217-75.6,86.559
+        c7.389,38.342,53.185,61.746,102.327,52.271c43.612-8.389,75.115-39.892,76.449-73.706
+        H512V90.785V2.152L133.703,45.86z"/>
+    </g>
+  </g>
+</svg>

src/browser/base/content/zen-media-player.inc.xhtml

@@ -0,0 +1,51 @@
+<toolbar id="zen-media-controls-toolbar"
+  class="browser-toolbar customization-target zen-sidebar-toolbar"
+  context="toolbar-context-menu"
+  mode="icons"
+  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">
+        <label id="zen-media-title" fadein="true"/>
+        <label id="zen-media-artist" fadein="true"/>
+      </vbox>
+
+      <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" 
+          value="0" min="0" max="100" step="0.1"
+          oninput="gZenMediaController.onMediaSeekDrag(event);"
+          onchange="gZenMediaController.onMediaSeekComplete(event);"/>
+        <label id="zen-media-duration">0:00</label>
+      </hbox>
+      
+      <hbox id="zen-media-controls-hbox">
+        <toolbarbutton id="zen-media-focus-button"
+          class="toolbarbutton-1"
+          oncommand="gZenMediaController.onMediaFocus();" />
+        <toolbarbutton id="zen-media-previoustrack-button"
+          class="toolbarbutton-1"
+          oncommand="gZenMediaController.onMediaPlayPrev();" />
+        <toolbarbutton id="zen-media-playpause-button"
+          class="toolbarbutton-1"
+          oncommand="gZenMediaController.onMediaToggle();" />
+        <toolbarbutton id="zen-media-nexttrack-button"
+          class="toolbarbutton-1"
+          oncommand="gZenMediaController.onMediaPlayNext();" />
+        <toolbarbutton id="zen-media-mute-button"
+          class="toolbarbutton-1"
+          oncommand="gZenMediaController.onMediaMute();" />
+      </hbox>
+    </vbox>
+  </toolbaritem>
+</toolbar>

src/browser/base/content/zen-sidebar-icons.inc.xhtml

@@ -1,3 +1,4 @@
+#include zen-media-player.inc.xhtml
 <toolbar brighttext="true"
   id="zen-sidebar-bottom-buttons"
   fullscreentoolbar="true"

src/browser/base/content/zen-styles/zen-compact-mode.css

@@ -38,6 +38,9 @@
       --zen-toolbox-max-width: 64px !important;
       --zen-compact-float: var(--zen-element-separation);
 
+      /* Initial padding for when we are animating */
+      padding: 0 0 0 var(--zen-toolbox-padding) !important;
+
       &:not([animate='true']) {
         position: absolute;
         z-index: 10;
@@ -51,7 +54,12 @@
         opacity: 0;
 
         :root[zen-single-toolbar='true'] & {
-          top: var(--zen-element-separation);
+          top: calc(var(--zen-element-separation) / 2);
+          height: calc(100% - var(--zen-element-separation));
+        }
+
+        & #zen-sidebar-top-buttons {
+          margin: 0 0 calc(var(--zen-toolbox-padding) / 2) 0;
         }
       }
 
@@ -61,7 +69,7 @@
     }
 
     &:not([zen-right-side='true']) #navigator-toolbox {
-      left: calc(-1 * var(--zen-sidebar-width) + 1px);
+      left: calc(-1 * var(--actual-zen-sidebar-width) + 1px);
     }
 
     /* When we have multiple toolbars and the top-toolbar is NOT being hidden,
@@ -78,7 +86,7 @@
         --zen-compact-float: calc(var(--zen-element-separation) + 1px);
 
         &:not([animate='true']) {
-          right: calc(-1 * var(--zen-sidebar-width) + 1px);
+          right: calc(-1 * var(--actual-zen-sidebar-width) + 1px);
         }
       }
 
@@ -90,12 +98,21 @@
 
     #navigator-toolbox:not([animate='true']) #titlebar {
       box-shadow: var(--zen-big-shadow);
-      border-radius: var(--zen-native-inner-radius);
+      border-radius: calc(var(--zen-native-inner-radius) + var(--zen-element-separation) / 4);
       padding: var(--zen-toolbox-padding) !important;
       position: relative;
       background: var(--zen-dialog-background);
       border: 1px solid var(--zen-colors-border-contrast);
-      width: calc(100% - var(--zen-toolbox-padding));
+      /* times 4 because we have the inner padding and the outter padding to consider */
+      :root[zen-sidebar-expanded='true'] & {
+        &[has-animated-padding='true'] {
+          width: calc(var(--zen-sidebar-width) + var(--zen-toolbox-padding));
+        }
+
+        &:not([has-animated-padding='true']) {
+          width: calc(var(--zen-sidebar-width) - var(--zen-toolbox-padding));
+        }
+      }
 
       :root[zen-single-toolbar='true'] {
         padding-top: 0 !important;
@@ -113,6 +130,7 @@
 
       & #urlbar[open][zen-floating-urlbar='true'] {
         transition: left 0.05s ease;
+        visibility: visible;
 
         #navigator-toolbox:has(&) {
           opacity: 1;
@@ -134,17 +152,18 @@
       }
     }
 
-    #navigator-toolbox[zen-has-hover],
+    #navigator-toolbox[zen-has-hover]:not(:has(#urlbar[zen-floating-urlbar='true']:hover)),
     #navigator-toolbox[zen-user-show],
+    #navigator-toolbox[zen-has-empty-tab],
     #navigator-toolbox[flash-popup],
     #navigator-toolbox[has-popup-menu],
     #navigator-toolbox[movingtab],
     #navigator-toolbox:has(.tabbrowser-tab:active),
     &[zen-renaming-tab='true'] #navigator-toolbox,
     #navigator-toolbox:has(
-        *:is([panelopen='true'], [open='true'], #urlbar:not([zen-floating-urlbar='true']):focus-within):not(tab):not(.zen-compact-mode-ignore)
+        *:is([panelopen='true'], [open='true'], #urlbar:focus-within):not(#urlbar[zen-floating-urlbar='true']):not(tab):not(.zen-compact-mode-ignore)
       ) {
-      &:not([animate='true']):not(:has(#urlbar[zen-floating-urlbar='true']:hover)) {
+      &:not([animate='true']) {
         --zen-compact-mode-func: linear(
           0 0%,
           0.002748 1%,
@@ -249,14 +268,14 @@
           1.003423 100%
         );
         transition:
-          left 0.3s var(--zen-compact-mode-func),
+          left 0.25s var(--zen-compact-mode-func),
-          right 0.3s var(--zen-compact-mode-func);
+          right 0.25s var(--zen-compact-mode-func);
         opacity: 1;
 
         &:not([supress-primary-adjustment='true']) {
-          left: -1px;
+          left: calc(var(--zen-element-separation) / -2);
           :root[zen-right-side='true'] & {
-            right: -1px;
+            right: calc(var(--zen-element-separation) / -2);
             left: auto;
           }
         }

src/browser/base/content/zen-styles/zen-decks.css

@@ -17,7 +17,7 @@
   margin: 0;
 }
 #zen-splitview-dropzone {
-  border-radius: var(--zen-webview-border-radius, var(--zen-border-radius));
+  border-radius: var(--zen-native-inner-radius);
   transition: inset ease-out 0.08s;
   display: none;
   background-color: color-mix(in srgb, var(--zen-colors-secondary) 30%, transparent 70%);
@@ -29,12 +29,11 @@
 #tabbrowser-tabpanels[zen-split-view='true'] > [zen-split='true'],
 #zen-splitview-dropzone {
   flex: 1;
-  margin: var(--zen-split-column-gap) calc(var(--zen-split-row-gap) + 1px) !important;
+  margin: var(--zen-split-column-gap) var(--zen-split-row-gap) !important;
   margin-bottom: 0 !important;
   margin-left: 0 !important;
   position: absolute !important;
   overflow: hidden;
-  transition: inset 0.1s;
 }
 
 #tabbrowser-tabpanels[zen-split-view='true']:not([zen-split-resizing]) > [zen-split-anim='true'] {
@@ -45,12 +44,11 @@
 }
 
 #tabbrowser-tabpanels[zen-split-view='true'] .browserSidebarContainer.deck-selected {
-  outline: 2px solid var(--zen-primary-color) !important;
+  outline: 1px solid var(--zen-primary-color) !important;
-  outline-offset: -1px;
 }
 
 #tabbrowser-tabbox:has(#tabbrowser-tabpanels[zen-split-view='true']) {
-  --zen-split-row-gap: calc(var(--zen-element-separation) + 1px);
+  --zen-split-row-gap: var(--zen-element-separation);
   --zen-split-column-gap: calc(var(--zen-element-separation) + 1px);
   margin-right: calc(-1 * var(--zen-split-column-gap));
 }
@@ -92,12 +90,6 @@
   pointer-events: all;
 }
 
-.zen-split-view-splitter[orient='vertical'] {
-  width: var(--zen-split-row-gap);
-  margin-left: calc(var(--zen-split-row-gap) / -2);
-  cursor: ew-resize;
-}
-
 .zen-split-view-splitter[orient='horizontal'] {
   height: var(--zen-split-column-gap);
   cursor: ns-resize;
@@ -214,37 +206,104 @@
   display: revert;
 }
 
-.zen-view-splitter-header {
+.zen-view-splitter-header-container {
-  display: flex;
+  position: absolute;
-  width: 100%;
+  top: calc(var(--zen-split-column-gap) / -2);
-  height: 20px;
+  left: 50%;
-  /*TODO: update with appropriate color*/
+  opacity: 0;
-  background-color: var(--zen-colors-secondary);
+  transition: opacity 0.2s;
-  align-items: center;
   z-index: 100;
-  cursor: move;
+  transform: translateX(-50%);
+  pointer-events: none;
 }
 
-.zen-tab-unsplit-button {
+.zen-view-splitter-header {
+  display: flex;
+  align-items: center;
+  position: fixed;
+  padding: 0.4rem 0.6rem;
+  border-radius: 8px;
+  background-color: light-dark(rgba(255, 255, 255, 1), rgba(0, 0, 0, 1));
+  box-shadow: 0 0 0 1px var(--button-primary-border-color);
+  gap: 0.8rem;
+  transform: translateX(-50%);
+  box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+}
+
+:root:not([inDOMFullscreen='true']) .browserSidebarContainer:hover .zen-view-splitter-header-container,
+.zen-view-splitter-header-container:hover {
+  pointer-events: all;
+  opacity: 1;
+  transition-delay: 0.2s;
+}
+
+.zen-view-splitter-header-container toolbarbutton {
   display: block;
   -moz-context-properties: fill, fill-opacity;
   border-radius: var(--tab-border-radius);
-  /*TODO: update with appropriate color*/
   color: inherit;
   fill: currentColor;
-  padding: var(--tab-close-button-padding);
+  width: 16px;
-  width: 24px;
+  height: 16px;
-  height: 24px;
   cursor: pointer;
   appearance: none;
-  margin-left: auto;
+  outline: none;
-  outline: var(--toolbarbutton-outline);
+  color: var(--button-primary-bgcolor);
-  list-style-image: url('chrome://global/skin/icons/close-fill.svg') !important;
+  border-top-left-radius: 0;
-  &:hover {
+  border-top-right-radius: 0;
-    outline-color: var(--toolbarbutton-hover-outline-color);
+
+  & image {
+    width: 14px;
+    height: 14px;
   }
 
-  &:hover:active {
+  &.zen-tab-rearrange-button {
-    outline-color: var(--toolbarbutton-active-outline-color);
+    cursor: move;
+
+    & image {
+      transform: rotate(90deg);
+    }
+  }
+}
+
+#zen-split-view-fake-browser {
+  position: absolute;
+  height: 100%;
+  background: rgba(255, 255, 255, 0.1);
+  border-radius: var(--zen-native-inner-radius);
+  box-shadow: var(--zen-big-shadow);
+  overflow: hidden;
+
+  &[side='right'] {
+    right: 0;
+  }
+
+  &::after {
+    content: '';
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    width: 3.5rem;
+    pointer-events: none;
+    height: 3.5rem;
+    background: var(--zen-split-view-fake-icon);
+    background-size: contain;
+    background-repeat: no-repeat;
+    background-position: center;
+    opacity: 0.8;
+    transition: opacity 0.2s;
+    transition-delay: 0.1s;
+
+    @starting-style {
+      opacity: 0;
+    }
+  }
+
+  &.fade-out::after {
+    opacity: 0;
+    transition-delay: 0s;
   }
 }

src/browser/base/content/zen-styles/zen-folders.css

@@ -14,7 +14,11 @@ tab-group[split-view-group] {
   --zen-split-view-active-tab-bg: color-mix(in srgb, var(--zen-toolbar-element-bg), transparent 40%);
 
   :root:not([zen-sidebar-expanded='true']) & {
-    padding: 2px 0;
+    padding: 0 2px;
+    --tab-min-height: 30px;
+    --tab-collapsed-width: 38px;
+    margin: 0 auto;
+    --tab-min-width: 34px;
   }
 
   & > .tabbrowser-tab {
@@ -56,7 +60,7 @@ tab-group[split-view-group] {
     }
   }
 
-  &:has(> tab[visuallyselected]) {
+  &:has(> tab:is([visuallyselected], [multiselected])) {
     background-color: var(--tab-selected-bgcolor);
     box-shadow: var(--tab-selected-shadow);
 

src/browser/base/content/zen-styles/zen-glance.css

@@ -34,14 +34,22 @@
     width: 32px;
     height: 32px;
     background: light-dark(rgb(24, 24, 24), rgb(231, 231, 231));
-    transition: background 0.2s ease;
+    transition:
+      background 0.05s ease,
+      scale 0.05s ease;
     border-radius: 999px;
     appearance: none;
     box-shadow: 0 0 12px 1px rgba(0, 0, 0, 0.07);
     opacity: 0;
+    padding: 8px;
 
     &:hover {
       background: light-dark(rgb(41, 41, 41), rgb(204, 204, 204));
+      scale: 1.05;
+    }
+
+    &:hover:active {
+      scale: 0.95;
     }
 
     & label {
@@ -52,6 +60,33 @@
       filter: invert(1);
     }
   }
+
+  & #zen-glance-sidebar-close {
+    width: fit-content;
+    & label {
+      display: block;
+      max-width: 0px;
+      margin: 0;
+      overflow: hidden;
+      transition:
+        max-width 0.2s ease,
+        margin-left 0.2s ease;
+    }
+
+    &[waitconfirmation] {
+      background: rgb(220, 53, 69);
+      color: white;
+      fill: white;
+      & label {
+        max-width: 100px;
+        margin-left: 8px;
+      }
+
+      & image {
+        filter: none;
+      }
+    }
+  }
 }
 
 #zen-glance-sidebar-container[hidden='true'] {

src/browser/base/content/zen-styles/zen-gradient-generator.css

@@ -89,6 +89,7 @@
     border-radius: 50%;
     cursor: pointer;
     position: relative;
+    transition: transform 0.1s;
     &::after {
       content: '';
       position: absolute;
@@ -99,6 +100,23 @@
       outline: 2px solid var(--zen-toolbar-element-bg);
       border-radius: 50%;
       pointer-events: none;
+      transition: transform 0.1s;
+    }
+
+    &:hover {
+      transform: scale(1.05);
+
+      &::after {
+        transform: scale(1.05);
+      }
+    }
+
+    &:hover:active {
+      transform: scale(0.95);
+
+      &::after {
+        transform: scale(0.95);
+      }
     }
   }
 }

src/browser/base/content/zen-styles/zen-media-controls.css

@@ -0,0 +1,256 @@
+#zen-media-controls-toolbar {
+  --progress-height: 5px;
+  --button-spacing: 2px;
+
+  display: flex;
+  justify-content: space-between;
+  min-width: 0;
+  background: transparent;
+  container-type: inline-size;
+
+  .toolbarbutton-1 {
+    border-radius: 5px;
+    color: white;
+  }
+
+  #zen-media-prev-button,
+  #zen-media-play-pause-button,
+  #zen-media-next-button {
+    margin: 0;
+  }
+
+  image.toolbarbutton-icon {
+    padding: 5px;
+    width: 26px;
+    height: 26px;
+  }
+
+  #zen-media-progress-bar {
+    appearance: none;
+    width: 100%;
+    height: var(--progress-height);
+    margin: 0 8px;
+    border-radius: 2px;
+    background-color: rgba(255, 255, 255, 0.2);
+    cursor: pointer;
+    transition: height 0.15s ease-out;
+
+    &::-moz-range-track {
+      background: var(--zen-colors-border);
+      border-radius: 999px;
+      height: var(--progress-height);
+    }
+
+    &::-moz-range-progress {
+      background: var(--zen-primary-color);
+      border-radius: 999px;
+      height: var(--progress-height);
+    }
+
+    &::-moz-range-thumb {
+      background: var(--zen-primary-color);
+      border: none;
+      width: 14px;
+      height: 14px;
+      border-radius: 50%;
+      cursor: pointer;
+    }
+  }
+
+  &:hover {
+    & #zen-media-main-vbox {
+      transition-delay: 0s;
+      gap: 6px;
+    }
+
+    .show-on-hover {
+      max-height: 50px;
+      padding: 2px 6px;
+      margin-bottom: 0;
+      opacity: 1;
+      transform: translateY(0);
+    }
+  }
+
+  &:not(:hover) {
+    &.playing:not([muted]) #zen-media-focus-button::after {
+      content: '';
+      position: absolute;
+      width: 100%;
+      height: 100%;
+      background-repeat: no-repeat;
+      opacity: 1;
+      background: url('chrome://browser/content/zen-images/note-indicator.svg') no-repeat;
+      top: -50%;
+      left: 50%;
+      transform: translateX(-50%);
+      z-index: -1;
+    }
+  }
+
+  #zen-media-focus-button {
+    align-self: center;
+    transition:
+      opacity 0.2s ease,
+      transform 0.2s ease;
+
+    @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;
+    }
+
+    @container (min-width: 185px) {
+      opacity: 1;
+      transform: translateX(0);
+    }
+  }
+
+  toolbaritem {
+    flex-grow: 1;
+    padding: 0;
+    transition: padding 0.3s ease-out;
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    padding: 4px;
+    border-radius: var(--border-radius-medium);
+    background: light-dark(rgb(255, 255, 255), rgb(11, 11, 11)) !important;
+    width: 100%;
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
+  }
+
+  .show-on-hover {
+    max-height: 0;
+    opacity: 0;
+    transform: translateY(5px);
+    padding: 0 6px;
+    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;
+  }
+
+  #zen-media-current-time,
+  #zen-media-duration {
+    margin: 0 0 0 1px;
+    font-size: x-small;
+    opacity: 0.7;
+    font-weight: 500;
+  }
+}
+
+#zen-media-controls-toolbar {
+  display: none;
+  animation: none;
+  transition: none;
+
+  &:not([hidden]) {
+    display: flex;
+    height: 2.5rem;
+    overflow: visible;
+    position: relative;
+    z-index: 2;
+  }
+}
+
+#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;
+}
+
+#zen-media-artist {
+  opacity: 0.7;
+  font-weight: 500;
+  font-size: smaller;
+}
+
+#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;
+    white-space: nowrap;
+  }
+}
+
+#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;
+}
+
+#zen-media-controls-hbox {
+  align-items: flex-end;
+  justify-content: space-between;
+  max-width: 100%;
+  --toolbarbutton-outer-padding: 0;
+}
+
+#zen-media-service-button {
+  align-items: center;
+
+  & image {
+    width: 16px;
+    height: 16px;
+    border-radius: 4px;
+  }
+}
+
+:root:not([zen-sidebar-expanded='true']) {
+  #zen-media-controls-toolbar {
+    display: none;
+  }
+}

src/browser/base/content/zen-styles/zen-sidebar-panels.css

@@ -111,24 +111,25 @@
   background: transparent;
   border: none;
   cursor: ew-resize;
+  z-index: 2;
 
   &:is(.zen-split-view-splitter[orient='vertical']) {
     /* Bit of a hacky solution, but it works */
-    width: calc(var(--zen-element-separation) - 3px);
+    width: var(--zen-split-row-gap);
-    margin-left: calc(-1 * var(--zen-element-separation) / 2 - 2px);
+    margin-left: calc(var(--zen-element-separation) * -1 - 1px);
     height: unset;
+    cursor: ew-resize;
   }
 
   &::before {
     height: 50px;
-    width: 4px;
+    width: 2px;
-    background: var(--zen-colors-primary);
+    background: var(--button-primary-bgcolor);
     border-radius: 2px;
     content: '';
     position: absolute;
     top: 50%;
     left: 50%;
-    transform: translate(-50%, -50%);
     opacity: 0;
     transition: opacity 0.1s ease-in-out;
     pointer-events: none;
@@ -139,10 +140,6 @@
   }
 }
 
-.zen-split-view-splitter[orient='vertical']::before {
-  transform: translate(-75%, -50%);
-}
-
 .zen-sidebar-web-panel-splitter[side='right'] {
   left: 100%;
 }

src/browser/base/content/zen-styles/zen-single-components.css

@@ -19,12 +19,6 @@
   text-overflow: ellipsis;
 }
 
-@media not (-moz-bool-pref: 'zen.watermark.enabled') {
-  #zen-watermark {
-    display: none;
-  }
-}
-
 #customization-footer #customization-toolbar-visibility-button {
   display: none !important;
 }

src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css

@@ -94,9 +94,8 @@
     padding: 6px !important;
   }
 
-  & #urlbar-container,
+  & #urlbar-container[breakout='true']:has([zen-floating-urlbar='true']) {
-  & #urlbar {
+    --urlbar-container-height: 36px !important;
-    --urlbar-container-height: 40px;
     --urlbar-height: 38px !important;
   }
 
@@ -109,7 +108,7 @@
   }
 
   & #zen-sidebar-top-buttons {
-    margin: 4px 0;
+    margin: var(--zen-element-separation) 0 calc(var(--zen-toolbox-padding) / 2) 0;
   }
 
   & #PanelUI-menu-button {
@@ -264,7 +263,7 @@
       display: none;
     }
 
-    &:active {
+    #tabbrowser-tabs:not([movingtab]) &:active {
       scale: var(--zen-active-tab-scale);
     }
 
@@ -374,6 +373,12 @@
   overflow-y: auto;
   height: 100%;
   scrollbar-width: thin;
+
+  /* Only do this hack if we have workspaces enabled */
+  :root[zen-workspace-id] & {
+    margin-left: calc(-1 * var(--zen-toolbox-padding));
+    width: calc(100% + var(--zen-toolbox-padding) * 2);
+  }
 }
 
 #zen-browser-tabs-container {
@@ -440,7 +445,7 @@
     padding-right: 0;
 
     :root[zen-single-toolbar='true'] & {
-      & #urlbar:not([breakout-extend='true']) .urlbar-input-container {
+      & #urlbar:not([breakout-extend='true']):not([pageproxystate='invalid']) .urlbar-input-container {
         padding-left: 8px;
         padding-right: 4px;
       }
@@ -865,6 +870,7 @@
     pointer-events: none;
     width: 16px;
     height: 16px;
+    border-radius: 4px;
   }
 
   &::after {
@@ -1050,7 +1056,7 @@
   overflow: hidden;
   transition: max-height 0.3s ease-out;
   opacity: 1;
-  grid-template-columns: repeat(auto-fit, minmax(var(--tab-pinned-min-width-expanded), auto));
+  grid-template-columns: repeat(auto-fit, minmax(48px, auto));
   overflow: hidden;
   scrollbar-width: thin;
   display: grid;
@@ -1102,7 +1108,7 @@
       &::after {
         content: "";
         inset: -50%;
-        filter: blur(15px);
+        filter: blur(15px) brightness(1.2);
         position: absolute;
         background-size: 100% 100%;
         background-clip: padding-box;
@@ -1168,7 +1174,7 @@
     }
 
     & .titlebar-buttonbox-container {
-      margin-left: calc(-1 * var(--zen-toolbox-max-width)) !important;
+      margin-left: calc(-1 * var(--zen-toolbox-max-width) + var(--zen-toolbox-padding) / 2) !important;
     }
 
     & #zen-appcontent-wrapper {
@@ -1261,5 +1267,9 @@
 .zen-workspace-tabs-section {
   position: absolute;
   transform: translateX(-100%);
-  min-width: 100%;
+  min-width: calc(100% - var(--zen-toolbox-padding) * 2);
+
+  &:not(.zen-current-workspace-indicator) {
+    margin: 0 var(--zen-toolbox-padding);
+  }
 }

src/browser/base/content/zen-styles/zen-theme.css

@@ -79,7 +79,7 @@
   --focus-outline-color: var(--button-bgcolor) !important;
 
   --toolbarbutton-icon-fill-attention: var(--zen-primary-color) !important;
-  --toolbarbutton-icon-fill: light-dark(rgb(57, 57, 58), rgb(251, 251, 254)) !important;
+  --toolbarbutton-icon-fill: light-dark(rgba(57, 57, 58, 0.6), rgba(251, 251, 254, 0.6)) !important;
 
   --button-primary-bgcolor: var(--in-content-primary-button-background) !important;
   --button-primary-hover-bgcolor: var(--in-content-primary-button-background-hover) !important;
@@ -155,7 +155,7 @@
 
   --input-bgcolor: var(--zen-colors-tertiary) !important;
   --input-border-color: var(--zen-input-border-color) !important;
-  --zen-themed-toolbar-bg: light-dark(var(--zen-branding-bg), #161616);
+  --zen-themed-toolbar-bg: light-dark(rgb(240, 240, 244), #161616);
   --zen-themed-toolbar-bg-transparent: light-dark(var(--zen-branding-bg), #161616);
 
   --zen-workspace-indicator-height: 45px;
@@ -164,7 +164,7 @@
     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) 80%, transparent 20%);
+      --zen-themed-toolbar-bg-transparent: color-mix(in srgb, var(--zen-themed-toolbar-bg) 75%, transparent 25%);
     }
   }
 

src/browser/base/content/zen-styles/zen-urlbar.css

@@ -16,6 +16,10 @@
   --urlbarView-highlight-background: var(--toolbarbutton-hover-background);
   border-radius: var(--toolbarbutton-border-radius);
   padding: 1px;
+
+  :root:not([zen-single-toolbar='true']) &[zen-floating-urlbar='true'] {
+    --urlbar-container-padding: 2px !important;
+  }
 }
 
 .urlbar-input::placeholder {
@@ -44,6 +48,16 @@
   outline-color: none !important;
 }
 
+#urlbar:not([breakout-extend='true']) {
+  & #urlbar-background {
+    transition: background-color 0.15s ease;
+  }
+
+  &:hover #urlbar-background {
+    background-color: light-dark(rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.2)) !important;
+  }
+}
+
 #identity-box.chromeUI:not([pageproxystate='invalid']) {
   & #identity-icon-box {
     background: light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1)) !important;
@@ -70,7 +84,7 @@
   position: relative;
 }
 
-#urlbar:not([breakout-extend='true']) #identity-box:is(:not(.chromeUI), [pageproxystate='invalid']) {
+#urlbar:not([breakout-extend='true']) #identity-box {
   margin-inline-end: 0 !important;
 }
 
@@ -80,6 +94,12 @@
   justify-content: center !important;
   align-items: center !important;
   margin: 0;
+
+  :root[zen-single-toolbar='true'] & {
+    padding: 6px !important;
+    width: unset !important;
+    height: unset !important;
+  }
 }
 
 #tracking-protection-icon-container {
@@ -88,8 +108,6 @@
 
 .urlbar-page-action,
 #tracking-protection-icon-container {
-  width: calc(var(--urlbar-min-height) - 6 * var(--urlbar-container-padding)) !important;
-  height: calc(var(--urlbar-min-height) - 6 * var(--urlbar-container-padding)) !important;
   margin-top: auto !important;
   margin-bottom: auto !important;
 }
@@ -119,10 +137,11 @@
   box-shadow: 0px 0px 90px -10px rgba(0, 0, 0, 0.6) !important;
   border: 1px solid hsla(0, 0%, 100%, 0.1) !important;
   backdrop-filter: none !important;
+  border-radius: 0.8rem !important;
 }
 
 #urlbar-go-button {
-  margin: auto 0;
+  display: none;
 }
 
 :root[zen-single-toolbar='true'] {
@@ -133,11 +152,11 @@
     display: none;
   }
 
-  #identity-icon-box:not([open]) {
+  #identity-box:not([pageproxystate='invalid']) #identity-icon-box:not([open]) {
-    margin-inline-start: calc(-8px - 2 * var(--urlbar-icon-padding)) !important;
+    margin-inline-start: calc(-8px - 2 * var(--urlbar-icon-padding));
     transform: translateX(100%);
-    opacity: 0;
     transition: all 0.1s ease;
+    opacity: 0;
   }
 
   #identity-permission-box > *:not(#permissions-granted-icon) {
@@ -153,9 +172,9 @@
       #identity-permission-box
     ),
   #urlbar:hover #identity-icon-box {
-    opacity: 1;
+    opacity: 1 !important;
     margin-inline-start: 0 !important;
-    transform: none;
+    transform: none !important;
     display: flex;
     #urlbar:not(:hover) & {
       transition: 0;
@@ -167,7 +186,7 @@
   }
 
   #urlbar:not([open]) {
-    #identity-box {
+    #identity-box:not([pageproxystate='invalid']) {
       order: 9;
     }
   }
@@ -317,7 +336,7 @@ button.popup-notification-dropmarker {
   background: transparent;
 
   &[notificationside='top'] {
-    position: absolute;
+    position: fixed;
     bottom: calc(var(--zen-element-separation) * 1.5);
     right: calc(var(--zen-element-separation) * 1.5);
     width: fit-content;
@@ -435,9 +454,8 @@ button.popup-notification-dropmarker {
     font-size: 1.5em !important;
     width: min(90%, 60rem) !important;
   }
-  top: 50vh !important;
+  top: 25vh !important;
   transform: translateX(-50%);
-  margin-top: -20%;
   left: 50% !important;
 
   #urlbar-container:has(&) {
@@ -446,6 +464,12 @@ button.popup-notification-dropmarker {
   }
 }
 
+@media not (-moz-bool-pref: 'zen.urlbar.show-protections-icon') {
+  #tracking-protection-icon-container {
+    display: none !important;
+  }
+}
+
 /* Code ~~stolen~~ taken inspiration from https://github.com/greeeen-dev/zen-arc-cmd-bar
  *
  * MIT License

src/browser/base/content/zen-styles/zen-welcome.css

@@ -24,10 +24,6 @@
     list-style-image: url(chrome://browser/skin/zen-icons/forward.svg);
     position: absolute;
     bottom: 10%;
-
-    .button-icon {
-      filter: invert(1);
-    }
   }
 
   #zen-welcome-title {
@@ -58,6 +54,7 @@
   width: 60%;
   height: 60%;
   box-shadow: var(--zen-big-shadow);
+  overflow: hidden;
 
   /* Small screens */
   @media (max-width: 1400px) {
@@ -89,13 +86,18 @@
       width: 100%;
       height: 100%;
       opacity: 0;
-      color: var(--zen-primary-color);
+      color: currentColor;
-      fill: var(--zen-primary-color);
+      fill: currentColor;
+      -moz-context-properties: fill, fill-opacity;
       background-image: url(chrome://browser/skin/zen-icons/essential-add.svg);
       background-size: 15%;
       background-repeat: no-repeat;
       background-position: center;
     }
+
+    &[animate-heart] {
+      overflow: hidden;
+    }
   }
 
   #zen-welcome-page-sidebar-buttons {
@@ -129,6 +131,7 @@
   #zen-welcome-page-content {
     background: light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1));
     width: 60%;
+    max-width: 80rem;
     height: 100%;
     position: relative;
     overflow: hidden;
@@ -205,7 +208,7 @@
         #zen-welcome-initial-essentials-browser-sidebar-essentials {
           display: grid;
           grid-template-columns: repeat(3, 1fr);
-          gap: 0.8rem;
+          gap: 0.4rem 1.2rem;
           visibility: visible;
 
           & * {
@@ -245,15 +248,10 @@
 
             &[visuallyselected] {
               transform: scale(1.04);
-
-              & .tab-background {
-                --zen-essential-bg-margin: 3px;
-                box-shadow: var(--zen-big-shadow);
-              }
             }
 
             & .tab-background::after {
-              filter: blur(30px) !important;
+              filter: blur(30px) brightness(1.2);
             }
           }
         }

src/browser/base/content/zen-styles/zen-workspaces.css

@@ -9,6 +9,7 @@
   justify-content: center;
   align-items: center;
   display: flex;
+  font-size: x-small;
 
   position: relative;
 
@@ -451,6 +452,7 @@
 
 /* Mark workspaces indicator */
 #zen-current-workspace-indicator-container {
+  position: relative;
   margin-bottom: var(--zen-workspace-indicator-height);
 }
 
@@ -464,6 +466,7 @@
   align-items: center;
   flex-direction: row !important;
   max-width: 100%;
+  width: 100%;
 
   &::before {
     border-radius: var(--border-radius-medium);
@@ -488,6 +491,7 @@
 
   & .zen-current-workspace-indicator-icon {
     font-size: 12px;
+    line-height: 1;
   }
 
   .zen-current-workspace-indicator-name {
@@ -497,6 +501,7 @@
     overflow: hidden;
     text-overflow: ellipsis;
     pointer-events: none;
+    font-size: small;
   }
 }
 

src/browser/base/moz-build.patch

@@ -0,0 +1,10 @@
+diff --git a/browser/base/moz.build b/browser/base/moz.build
+index 636e0841786735a63ddea00e819c0b6f0b8a5d4d..6685d857180944d68bf4f049919f81361084c481 100644
+--- a/browser/base/moz.build
++++ b/browser/base/moz.build
+@@ -87,3 +87,5 @@ if CONFIG["MOZ_WIDGET_TOOLKIT"] in ("windows", "gtk"):
+     DEFINES["MENUBAR_CAN_AUTOHIDE"] = 1
+ 
+ JAR_MANIFESTS += ["jar.mn"]
++
++DIRS += ["zen-components"]

src/browser/base/zen-components/ZenCompactMode.mjs

@@ -37,6 +37,9 @@ var gZenCompactModeManager = {
 
     this.addMouseActions();
     this.addContextMenu();
+
+    // Clear hover states when window state changes (minimize, maximize, etc.)
+    window.addEventListener('sizemodechange', () => this._clearAllHoverStates());
   },
 
   get preference() {
@@ -141,10 +144,17 @@ var gZenCompactModeManager = {
     this.animateCompactMode();
   },
 
-  getAndApplySidebarWidth() {
+  // NOTE: Dont actually use event, it's just so we make sure
+  // the caller is from the ResizeObserver
+  getAndApplySidebarWidth(event = undefined) {
     let sidebarWidth = this.sidebar.getBoundingClientRect().width;
     if (sidebarWidth > 1) {
       gZenUIManager.restoreScrollbarState();
+      // Second variable to get the genuine width of the sidebar
+      this.sidebar.style.setProperty('--actual-zen-sidebar-width', `${sidebarWidth}px`);
+      if (event && this.preference) {
+        return;
+      }
       this.sidebar.style.setProperty('--zen-sidebar-width', `${sidebarWidth}px`);
     }
     return sidebarWidth;
@@ -158,10 +168,15 @@ var gZenCompactModeManager = {
     const canAnimate =
       lazyCompactMode.COMPACT_MODE_CAN_ANIMATE_SIDEBAR &&
       !this.sidebar.hasAttribute('zen-user-show') &&
+      !this.sidebar.hasAttribute('zen-has-empty-tab') &&
       !this.sidebar.hasAttribute('zen-has-hover');
     // Do this so we can get the correct width ONCE compact mode styled have been applied
+    const titlebar = this.sidebar.querySelector('#titlebar');
     if (canAnimate) {
       this.sidebar.setAttribute('animate', 'true');
+      titlebar.setAttribute('has-animated-padding', 'true');
+    } else {
+      titlebar.removeAttribute('has-animated-padding');
     }
     this.sidebar.style.removeProperty('margin-right');
     this.sidebar.style.removeProperty('margin-left');
@@ -191,15 +206,18 @@ var gZenCompactModeManager = {
           )
           .then(() => {
             window.requestAnimationFrame(() => {
+              this.sidebar.style.transition = 'none';
               this.sidebar.removeAttribute('animate');
+              this.sidebar.style.visibility = 'hidden';
               this.sidebar.style.removeProperty('margin-right');
               this.sidebar.style.removeProperty('margin-left');
               this.sidebar.style.removeProperty('transform');
-              this.sidebar.style.transition = 'none';
               setTimeout(() => {
                 this._animating = false;
+                this.sidebar.style.removeProperty('visibility');
                 this.sidebar.style.removeProperty('transition');
-              });
+                this.sidebar.style.removeProperty('opacity');
+              }, 300);
             });
           });
       } else if (canHideSidebar && !isCompactMode) {
@@ -308,9 +326,6 @@ var gZenCompactModeManager = {
       {
         element: gZenVerticalTabsManager.actualWindowButtons,
       },
-      {
-        element: gZenVerticalTabsManager.actualWindowButtons,
-      },
     ];
   },
 
@@ -346,14 +361,13 @@ var gZenCompactModeManager = {
   addMouseActions() {
     for (let i = 0; i < this.hoverableElements.length; i++) {
       let target = this.hoverableElements[i].element;
-      target.addEventListener('mouseenter', (event) => {
+      const onEnter = (event) => {
-        if (!event.target.matches(':hover')) return;
+        if (event.type === 'mouseenter' && !event.target.matches(':hover')) return;
         this.clearFlashTimeout('has-hover' + target.id);
         window.requestAnimationFrame(() => target.setAttribute('zen-has-hover', 'true'));
-      });
+      };
 
-      target.addEventListener('mouseleave', (event) => {
+      const onLeave = (event) => {
-        // If on Mac, ignore mouseleave in the area of window buttons
         if (AppConstants.platform == 'macosx') {
           const buttonRect = gZenVerticalTabsManager.actualWindowButtons.getBoundingClientRect();
           const MAC_WINDOW_BUTTONS_X_BORDER = buttonRect.width + buttonRect.x;
@@ -368,6 +382,12 @@ var gZenCompactModeManager = {
           }
         }
 
+        // When moving the cursor between the url bar and bookmarks, or in-between bookmarks in the bookmark bar, the
+        // mouseLeave event is triggered without a relatedTarget.
+        if (event.relatedTarget == null) {
+          return;
+        }
+
         // If it's a child element but not the target, ignore the event
         if (target.contains(event.explicitOriginalTarget) && event.explicitOriginalTarget !== target) {
           return;
@@ -378,7 +398,13 @@ var gZenCompactModeManager = {
         } else {
           this._removeHoverFrames[target.id] = window.requestAnimationFrame(() => target.removeAttribute('zen-has-hover'));
         }
-      });
+      };
+
+      target.addEventListener('mouseenter', onEnter);
+      target.addEventListener('dragover', onEnter);
+
+      target.addEventListener('mouseleave', onLeave);
+      target.addEventListener('dragleave', onLeave);
     }
 
     document.documentElement.addEventListener('mouseleave', (event) => {
@@ -427,4 +453,15 @@ var gZenCompactModeManager = {
     let toolbar = document.getElementById('zen-appcontent-navbar-container');
     toolbar.toggleAttribute('zen-user-show');
   },
+
+  _clearAllHoverStates() {
+    // Clear hover attributes from all hoverable elements
+    for (let entry of this.hoverableElements) {
+      const target = entry.element;
+      if (target && !target.matches(':hover') && target.hasAttribute('zen-has-hover')) {
+        target.removeAttribute('zen-has-hover');
+        this.clearFlashTimeout('has-hover' + target.id);
+      }
+    }
+  },
 };

src/browser/base/zen-components/ZenGlanceManager.mjs

@@ -6,8 +6,9 @@
     #glances = new Map();
     #currentGlanceID = null;
 
+    #confirmationTimeout = null;
+
     init() {
-      window.addEventListener('keydown', this.onKeyDown.bind(this));
       window.addEventListener('TabClose', this.onTabClose.bind(this));
       window.addEventListener('TabSelect', this.onLocationChange.bind(this));
 
@@ -33,16 +34,6 @@
       return this.#glances.get(this.#currentGlanceID)?.parentTab;
     }
 
-    // If the user presses Escape while a Glance is open, close it
-    onKeyDown(event) {
-      if (event.defaultPrevented) return;
-      if (event.key === 'Escape' && this.#currentGlanceID) {
-        event.preventDefault();
-        event.stopPropagation();
-        this.closeGlance({ onTabClose: true });
-      }
-    }
-
     onOverlayClick(event) {
       // If user clicks outside content area, close glance
       if (event.target === this.overlay && event.originalTarget !== this.contentWrapper) {
@@ -67,7 +58,7 @@
 
     // Figure out where to insert new tabs
     getTabPosition(tab) {
-      return Math.max(gBrowser._numVisiblePinTabs, tab._tPos);
+      return Math.max(gBrowser.pinnedTabCount, tab._tPos);
     }
 
     // Create a new tab for Glance
@@ -77,7 +68,7 @@
         skipBackgroundNotify: true,
         insertTab: true,
         skipLoad: false,
-        index: this.getTabPosition(currentTab),
+        index: this.getTabPosition(currentTab) + 1,
       };
       currentTab._selected = true;
 
@@ -247,11 +238,26 @@
       });
     }
 
-    closeGlance({ noAnimation = false, onTabClose = false, setNewID = null, isDifferent = false } = {}) {
+    closeGlance({ noAnimation = false, onTabClose = false, setNewID = null, isDifferent = false, hasFocused = false } = {}) {
       if (this._animating || !this.#currentBrowser || this.animatingOpen || this._duringOpening) {
         return;
       }
 
+      let { permitUnload } = this.#currentBrowser.permitUnload();
+      if (!permitUnload) {
+        return;
+      }
+
+      if (onTabClose && hasFocused && !this.#confirmationTimeout) {
+        const cancelButton = document.getElementById('zen-glance-sidebar-close');
+        cancelButton.setAttribute('waitconfirmation', true);
+        this.#confirmationTimeout = setTimeout(() => {
+          cancelButton.removeAttribute('waitconfirmation');
+          this.#confirmationTimeout = null;
+        }, 3000);
+        return;
+      }
+
       this.browserWrapper.removeAttribute('has-finished-animation');
       if (noAnimation) {
         this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer').removeAttribute('style');
@@ -301,16 +307,15 @@
         .then(() => {
           this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer').removeAttribute('style');
         });
-
+      this.browserWrapper.style.opacity = 1;
-      // Animate the browser wrapper back
       gZenUIManager.motion
         .animate(
           this.browserWrapper,
           {
             ...originalPosition,
-            opacity: 0.3,
+            opacity: 0,
           },
-          { type: 'spring', bounce: 0, duration: 0.4, easing: 'ease' }
+          { type: 'spring', bounce: 0, duration: 0.5, easing: 'ease-in' }
         )
         .then(() => {
           this.browserWrapper.removeAttribute('animate');
@@ -336,8 +341,7 @@
             this.#currentParentTab._visuallySelected = false;
           }
 
-          // Reset everything
+          // reset everything
-          const prevOverlay = this.overlay;
           this.browserWrapper = null;
           this.overlay = null;
           this.contentWrapper = null;
@@ -349,7 +353,7 @@
             gBrowser.selectedTab = this.#currentParentTab;
           }
           this._ignoreClose = true;
-          gBrowser.removeTab(this.lastCurrentTab, { animate: true });
+          gBrowser.removeTab(this.lastCurrentTab, { animate: true, skipPermitUnload: true });
           gBrowser.tabContainer._invalidateCachedTabs();
 
           this.#currentParentTab.removeAttribute('glance-id');
@@ -437,9 +441,18 @@
       }
     }
 
-    // If location changes to a tab with a different glance-id, close the old one
+    clearConfirmationTimeout() {
+      if (this.#confirmationTimeout) {
+        clearTimeout(this.#confirmationTimeout);
+        this.#confirmationTimeout = null;
+      }
+      document.getElementById('zen-glance-sidebar-close')?.removeAttribute('waitconfirmation');
+    }
+
+    // note: must be sync to avoid timing issues
     onLocationChange(event) {
       const tab = event.target;
+      this.clearConfirmationTimeout();
       if (this.animatingFullOpen || this.closingGlance) {
         return;
       }
@@ -502,7 +515,6 @@
         owner &&
         owner.pinned &&
         this._lazyPref.SHOULD_OPEN_EXTERNAL_TABS_IN_GLANCE &&
-        owner.linkedBrowser?.docShellIsActive &&
         owner.linkedBrowser?.browsingContext?.isAppTab &&
         this.tabDomainsDiffer(owner, uri) &&
         Services.prefs.getBoolPref('zen.glance.enabled', true)
@@ -515,7 +527,11 @@
       try {
         if (this.shouldOpenTabInGlance(tab, uri)) {
           const browserRect = gBrowser.tabbox.getBoundingClientRect();
-          this.openGlance({ url: undefined, x: browserRect.width / 2, y: browserRect.height / 2, width: 0, height: 0 });
+          this.openGlance(
+            { url: undefined, x: browserRect.width / 2, y: browserRect.height / 2, width: 0, height: 0 },
+            tab,
+            tab.owner
+          );
         }
       } catch (e) {
         console.error(e);
@@ -610,8 +626,12 @@
           esModuleURI: 'chrome://browser/content/zen-components/actors/ZenGlanceChild.sys.mjs',
           events: {
             DOMContentLoaded: {},
+            keydown: {
+              capture: true,
+            },
           },
         },
+        allFrames: true,
         matches: ['https://*/*'],
       });
     }

src/browser/base/zen-components/ZenGradientGenerator.mjs

@@ -863,7 +863,7 @@
     getToolbarModifiedBase() {
       return this.isDarkMode
         ? 'color-mix(in srgb, var(--zen-themed-toolbar-bg) 80%, #fff 20%)'
-        : 'color-mix(in srgb, var(--zen-themed-toolbar-bg) 95%, #000 5%)';
+        : 'color-mix(in srgb, var(--zen-themed-toolbar-bg) 95%, #000 6%)';
     }
 
     getSingleRGBColor(color, forToolbar = false) {

src/browser/base/zen-components/ZenMediaController.mjs

@@ -0,0 +1,322 @@
+class ZenMediaController {
+  _currentMediaController = null;
+  _currentBrowser = null;
+  _mediaUpdateInterval = null;
+
+  mediaTitle = null;
+  mediaArtist = null;
+  mediaControlBar = null;
+  mediaServiceIcon = null;
+  mediaServiceTitle = null;
+  mediaProgressBar = null;
+  mediaCurrentTime = null;
+  mediaDuration = null;
+  mediaFocusButton = null;
+  mediaProgressBarContainer = null;
+
+  supportedKeys = ['playpause', 'previoustrack', 'nexttrack'];
+
+  init() {
+    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');
+
+    window.addEventListener('TabSelect', (event) => {
+      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');
+            });
+        } 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],
+              },
+              {}
+            );
+          });
+        }
+
+        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) {
+    if (!mediaController) return;
+
+    mediaController.onpositionstatechange = null;
+    mediaController.onplaybackstatechange = null;
+    mediaController.onsupportedkeyschange = null;
+    mediaController.onmetadatachange = null;
+    mediaController.ondeactivated = null;
+
+    this._currentMediaController = null;
+    this._currentBrowser = null;
+
+    if (this._mediaUpdateInterval) {
+      clearInterval(this._mediaUpdateInterval);
+      this._mediaUpdateInterval = null;
+    }
+
+    this.mediaControlBar.setAttribute('hidden', 'true');
+    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')) {
+      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})`;
+
+    this.mediaTitle.textContent = metadata.title || '';
+    this.mediaArtist.textContent = metadata.artist || '';
+
+    gZenUIManager.updateTabsToolbar();
+
+    this._currentPosition = positionState.position;
+    this._currentDuration = positionState.duration;
+    this.updateMediaPosition();
+
+    for (const key of this.supportedKeys) {
+      const button = this.mediaControlBar.querySelector(`#zen-media-${key}-button`);
+      button.disabled = !this._currentMediaController.supportedKeys.includes(key);
+    }
+  }
+
+  /**
+   * @param {Object} mediaController - The media controller to activate.
+   * @param {Object} browser - The browser associated with the media controller.
+   */
+  activateMediaControls(mediaController, browser) {
+    this.updateMuteState();
+
+    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);
+
+    const metadata = mediaController.getMetadata();
+    const positionState = mediaController.getPositionState();
+
+    this.setupMediaControl(metadata, positionState);
+  }
+
+  /**
+   * @param {Event} event - The deactivation event.
+   */
+  onDeactivated(event) {
+    if (event.target === this._currentMediaController) {
+      this.deinitMediaController(event.target);
+    }
+  }
+
+  /**
+   * 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) {
+    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;
+
+    this._currentPosition = event.position;
+    this._currentDuration = event.duration;
+    this.updateMediaPosition();
+  }
+
+  /**
+   * Updates the media progress bar and time display.
+   */
+  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');
+
+    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;
+          if (this._currentPosition > this._currentDuration) {
+            this._currentPosition = this._currentDuration;
+          }
+          this.mediaCurrentTime.textContent = this.formatSecondsToTime(this._currentPosition);
+          this.mediaProgressBar.value = (this._currentPosition / this._currentDuration) * 100;
+        } else {
+          clearInterval(this._mediaUpdateInterval);
+          this._mediaUpdateInterval = null;
+        }
+      }, 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';
+
+    const totalSeconds = Math.max(0, Math.ceil(seconds));
+    const hours = Math.floor(totalSeconds / 3600);
+    const minutes = Math.floor((totalSeconds % 3600) / 60).toString();
+    const secs = (totalSeconds % 60).toString();
+
+    if (hours > 0) {
+      return `${hours}:${minutes.padStart(2, '0')}:${secs.padStart(2, '0')}`;
+    }
+
+    return `${minutes}:${secs.padStart(2, '0')}`;
+  }
+
+  /**
+   * Updates metadata in the UI.
+   * @param {Event} event - The metadata change event.
+   */
+  onMetadataChange(event) {
+    const metadata = event.target.getMetadata();
+    this.mediaTitle.textContent = metadata.title || '';
+    this.mediaArtist.textContent = metadata.artist || '';
+  }
+
+  onMediaPlayPrev() {
+    if (this._currentMediaController?.supportedKeys.includes('previoustrack')) {
+      this._currentMediaController.prevTrack();
+    }
+  }
+
+  onMediaPlayNext() {
+    if (this._currentMediaController?.supportedKeys.includes('nexttrack')) {
+      this._currentMediaController.nextTrack();
+    }
+  }
+
+  onMediaSeekDrag(event) {
+    this._currentMediaController?.pause();
+    const newTime = (event.target.value / 100) * this._currentDuration;
+    this.mediaCurrentTime.textContent = this.formatSecondsToTime(newTime);
+  }
+
+  onMediaSeekComplete(event) {
+    const newPosition = (event.target.value / 100) * this._currentDuration;
+    if (this._currentMediaController?.supportedKeys.includes('seekto')) {
+      this._currentMediaController.seekTo(newPosition);
+      this._currentMediaController.play();
+    }
+  }
+
+  onMediaFocus() {
+    this._currentMediaController?.focus();
+  }
+
+  onMediaMute() {
+    if (!this.mediaControlBar.hasAttribute('muted')) {
+      this._currentBrowser.mute();
+      this.mediaControlBar.setAttribute('muted', '');
+    } else {
+      this._currentBrowser.unmute();
+      this.mediaControlBar.removeAttribute('muted');
+    }
+  }
+
+  onMediaToggle() {
+    if (this.mediaControlBar.classList.contains('playing')) {
+      this._currentMediaController?.pause();
+    } else {
+      this._currentMediaController?.play();
+    }
+  }
+
+  updateMuteState() {
+    if (!this._currentBrowser) return;
+    if (this._currentBrowser._audioMuted) {
+      this.mediaControlBar.setAttribute('muted', '');
+    } else {
+      this.mediaControlBar.removeAttribute('muted');
+    }
+  }
+}
+
+window.gZenMediaController = new ZenMediaController();

src/browser/base/zen-components/ZenPinnedTabManager.mjs

@@ -211,8 +211,9 @@
           continue;
         }
 
-        if (pin.title && pin.editedTitle) {
+        if (pin.title && (pin.editedTitle || tab.hasAttribute('zen-has-static-label'))) {
-          gBrowser._setTabLabel(tab, pin.title);
+          tab.removeAttribute('zen-has-static-label'); // So we can set it again
+          gBrowser._setTabLabel(tab, pin.title, { beforeTabOpen: true });
           tab.setAttribute('zen-has-static-label', 'true');
         }
       }
@@ -339,7 +340,7 @@
       tab.position = tab._tPos;
 
       for (let otherTab of gBrowser.tabs) {
-        if (otherTab.pinned) {
+        if (otherTab.pinned && otherTab.getAttribute('zen-pin-id') !== tab.getAttribute('zen-pin-id')) {
           const actualPin = this._pinsCache.find((pin) => pin.uuid === otherTab.getAttribute('zen-pin-id'));
           if (!actualPin) {
             continue;
@@ -356,6 +357,13 @@
       }
       actualPin.position = tab.position;
       actualPin.isEssential = tab.hasAttribute('zen-essential');
+
+      // There was a bug where the title and hasStaticLabel attribute were not being set
+      // This is a workaround to fix that
+      if (tab.hasAttribute('zen-has-static-label')) {
+        actualPin.editedTitle = true;
+        actualPin.title = tab.label;
+      }
       await this.savePin(actualPin);
     }
 
@@ -458,6 +466,7 @@
 
       if (!isClosing) {
         tab.removeAttribute('zen-pin-id');
+        tab.removeAttribute('zen-essential'); // Just in case
 
         if (!tab.hasAttribute('zen-workspace-id') && ZenWorkspaces.workspaceEnabled) {
           const workspace = await ZenWorkspaces.getActiveWorkspace();
@@ -600,7 +609,14 @@
     }
 
     addToEssentials(tab) {
-      const tabs = tab ? [tab] : TabContextMenu.contextTab.multiselected ? gBrowser.selectedTabs : [TabContextMenu.contextTab];
+      const tabs = tab
+        ? // if it's already an array, dont make it [tab]
+          tab?.length
+          ? tab
+          : [tab]
+        : TabContextMenu.contextTab.multiselected
+          ? gBrowser.selectedTabs
+          : [TabContextMenu.contextTab];
       for (let i = 0; i < tabs.length; i++) {
         const tab = tabs[i];
         if (tab.hasAttribute('zen-essential')) {
@@ -621,8 +637,8 @@
         } else {
           gBrowser.pinTab(tab);
         }
-        this.onTabIconChanged(tab);
         this._onTabMove(tab);
+        this.onTabIconChanged(tab);
       }
       gZenUIManager.updateTabsToolbar();
     }
@@ -701,72 +717,77 @@
     }
 
     moveToAnotherTabContainerIfNecessary(event, movingTabs) {
-      const pinnedTabsTarget =
+      try {
-        event.target.closest('#vertical-pinned-tabs-container') || event.target.closest('.zen-current-workspace-indicator');
+        const pinnedTabsTarget =
-      const essentialTabsTarget = event.target.closest('#zen-essentials-container');
+          event.target.closest('#vertical-pinned-tabs-container') || event.target.closest('.zen-current-workspace-indicator');
-      const tabsTarget = event.target.closest('#tabbrowser-arrowscrollbox');
+        const essentialTabsTarget = event.target.closest('#zen-essentials-container');
+        const tabsTarget = event.target.closest('#tabbrowser-arrowscrollbox');
 
-      let isVertical = this.expandedSidebarMode;
+        let isVertical = this.expandedSidebarMode;
-      let moved = false;
+        let moved = false;
-      for (const draggedTab of movingTabs) {
+        for (const draggedTab of movingTabs) {
-        let isRegularTabs = false;
+          let isRegularTabs = false;
-        // Check for pinned tabs container
+          // Check for pinned tabs container
-        if (pinnedTabsTarget) {
+          if (pinnedTabsTarget) {
-          if (!draggedTab.pinned) {
+            if (!draggedTab.pinned) {
-            gBrowser.pinTab(draggedTab);
+              gBrowser.pinTab(draggedTab);
-            moved = true;
+              moved = true;
-          } else if (draggedTab.hasAttribute('zen-essential')) {
+            } else if (draggedTab.hasAttribute('zen-essential')) {
-            this.removeEssentials(draggedTab, false);
+              this.removeEssentials(draggedTab, false);
-            moved = true;
+              moved = true;
-          }
+            }
-        }
+          }
-        // Check for essentials container
+          // Check for essentials container
-        else if (essentialTabsTarget) {
+          else if (essentialTabsTarget) {
-          if (!draggedTab.hasAttribute('zen-essential')) {
+            if (!draggedTab.hasAttribute('zen-essential') && !draggedTab?.group?.hasAttribute('split-view-group')) {
-            this.addToEssentials(draggedTab);
+              this.addToEssentials(draggedTab);
-            moved = true;
+              moved = true;
-            isVertical = false;
+              isVertical = false;
-          }
+            }
-        }
+          }
-        // Check for normal tabs container
+          // Check for normal tabs container
-        else if (tabsTarget || event.target.id === 'zen-tabs-wrapper') {
+          else if (tabsTarget || event.target.id === 'zen-tabs-wrapper') {
-          if (draggedTab.pinned && !draggedTab.hasAttribute('zen-essential')) {
+            if (draggedTab.pinned && !draggedTab.hasAttribute('zen-essential')) {
-            gBrowser.unpinTab(draggedTab);
+              gBrowser.unpinTab(draggedTab);
-            moved = true;
+              moved = true;
-            isRegularTabs = true;
+              isRegularTabs = true;
-          } else if (draggedTab.hasAttribute('zen-essential')) {
+            } else if (draggedTab.hasAttribute('zen-essential')) {
-            this.removeEssentials(draggedTab);
+              this.removeEssentials(draggedTab);
-            moved = true;
+              moved = true;
-            isRegularTabs = true;
+              isRegularTabs = true;
-          }
+            }
-        }
+          }
-
+
-        // If the tab was moved, adjust its position relative to the target tab
+          // If the tab was moved, adjust its position relative to the target tab
-        if (moved) {
+          if (moved) {
-          const targetTab = event.target.closest('.tabbrowser-tab');
+            const targetTab = event.target.closest('.tabbrowser-tab');
-          if (targetTab) {
+            if (targetTab) {
-            const rect = targetTab.getBoundingClientRect();
+              const rect = targetTab.getBoundingClientRect();
-            let newIndex = targetTab._tPos;
+              let newIndex = targetTab._tPos;
-
+
-            if (isVertical) {
+              if (isVertical) {
-              const middleY = targetTab.screenY + rect.height / 2;
+                const middleY = targetTab.screenY + rect.height / 2;
-              if (!isRegularTabs && event.screenY > middleY) {
+                if (!isRegularTabs && event.screenY > middleY) {
-                newIndex++;
+                  newIndex++;
-              } else if (isRegularTabs && event.screenY < middleY) {
+                } else if (isRegularTabs && event.screenY < middleY) {
-                newIndex--;
+                  newIndex--;
-              }
+                }
-            } else {
+              } else {
-              const middleX = targetTab.screenX + rect.width / 2;
+                const middleX = targetTab.screenX + rect.width / 2;
-              if (event.screenX > middleX) {
+                if (event.screenX > middleX) {
-                newIndex++;
+                  newIndex++;
-              }
+                }
+              }
+              gBrowser.moveTabTo(draggedTab, newIndex);
             }
-            gBrowser.moveTabTo(draggedTab, newIndex);
           }
         }
-      }
 
-      return moved;
+        return moved;
+      } catch (ex) {
+        console.error('Error moving tabs:', ex);
+        return false;
+      }
     }
 
     async onLocationChange(browser) {
@@ -837,6 +858,15 @@
       // update the label for the same pin across all windows
       for (const browser of browsers) {
         const tabs = browser.gBrowser.tabs;
+        // Fix pinned cache for the browser
+        const browserCache = browser.gZenPinnedTabManager?._pinsCache;
+        if (browserCache) {
+          const pin = browserCache.find((pin) => pin.uuid === uuid);
+          if (pin) {
+            pin.title = newTitle;
+            pin.editedTitle = isEdited;
+          }
+        }
         for (let i = 0; i < tabs.length; i++) {
           const tabToEdit = tabs[i];
           if (tabToEdit.getAttribute('zen-pin-id') === uuid && tabToEdit !== tab) {

src/browser/base/zen-components/ZenRices.mjs

@@ -176,7 +176,7 @@
                   <checkbox data-l10n-id="zen-rice-share-include-workspace-themes" id="zen-rice-share-include-workspace-themes" />
                 </vbox>
                 <html:moz-button-group class="panel-footer">
-                  <button onclick="gZenThemePicker.riceManager.cancel()" class="footer-button" data-l10n-id="zen-rice-share-cancel" />
+                  <button onclick="gZenThemePicker.riceManager.cancel()" class="footer-button" data-l10n-id="zen-general-cancel" />
                   <button onclick="gZenThemePicker.riceManager.submit()" class="footer-button" data-l10n-id="zen-rice-share-save" default="true" slot="primary" id="zen-rice-share-save" disabled="true" />
                 </html:moz-button-group>
               </vbox>

src/browser/base/zen-components/ZenSidebarManager.mjs

@@ -27,7 +27,6 @@ class ZenBrowserManagerSidebar extends ZenDOMOperatedFeature {
     this.onlySafeWidthAndHeight();
 
     this.initProgressListener();
-    this.update();
     this.close(); // avoid caching
     this.tabBox.prepend(this.sidebarWrapper);
     this.listenForPrefChanges();
@@ -102,7 +101,7 @@ class ZenBrowserManagerSidebar extends ZenDOMOperatedFeature {
   syncPinnedState() {
     const sidebar = document.getElementById('zen-sidebar-web-panel');
     const pinButton = document.getElementById('zen-sidebar-web-panel-pinned');
-    
+
     if (sidebar.hasAttribute('pinned')) {
       pinButton.setAttribute('pinned', 'true');
     } else {
@@ -182,8 +181,8 @@ class ZenBrowserManagerSidebar extends ZenDOMOperatedFeature {
     const leftMouseOffset = startLeft - mouseDownEvent.screenX;
     const moveListener = (mouseMoveEvent) => {
       window.requestAnimationFrame(() => {
-        let top = mouseMoveEvent.screenY + topMouseOffset;
+        let top = mouseMoveEvent.clientY + topMouseOffset;
-        let left = mouseMoveEvent.screenX + leftMouseOffset;
+        let left = mouseMoveEvent.clientX + leftMouseOffset;
 
         const wrapperBounds = this.sidebarWrapper.getBoundingClientRect();
         top = Math.max(0, Math.min(top, wrapperBounds.height - sideBarHeight));
@@ -557,16 +556,18 @@ class ZenBrowserManagerSidebar extends ZenDOMOperatedFeature {
   _getWebPanelIcon(url, element) {
     let { preferredURI } = Services.uriFixup.getFixupURIInfo(url);
     element.setAttribute('image', `page-icon:${preferredURI.spec}`);
-    fetch(`https://s2.googleusercontent.com/s2/favicons?domain_url=${preferredURI.spec}`).then(async (response) => {
+    if (Services.prefs.getBoolPref('zen.sidebar.use-google-favicons')) {
-      if (response.ok) {
+      fetch(`https://s2.googleusercontent.com/s2/favicons?domain_url=${preferredURI.spec}`).then(async (response) => {
-        let blob = await response.blob();
+        if (response.ok) {
-        let reader = new FileReader();
+          let blob = await response.blob();
-        reader.onload = function () {
+          let reader = new FileReader();
-          element.setAttribute('image', reader.result);
+          reader.onload = function () {
-        };
+            element.setAttribute('image', reader.result);
-        reader.readAsDataURL(blob);
+          };
-      }
+          reader.readAsDataURL(blob);
-    });
+        }
+      });
+    }
   }
 
   _getBrowserById(id) {

src/browser/base/zen-components/ZenTabUnloader.mjs

@@ -264,7 +264,7 @@
         (tab.pinned && !ignoreTimestamp) ||
         tab.selected ||
         (tab.multiselected && !ignoreTimestamp) ||
-        tab.hasAttribute('busy') ||
+        (tab.hasAttribute('busy') && !ignoreTimestamp) ||
         tab.hasAttribute('pending') ||
         !tab.linkedPanel ||
         tab.splitView ||
@@ -274,7 +274,8 @@
         (tab.pictureinpicture && !ignoreTimestamp) ||
         (tab.soundPlaying && !ignoreTimestamp) ||
         (tab.zenIgnoreUnload && !ignoreTimestamp) ||
-        excludedUrls.some((url) => url.test(tab.linkedBrowser?.currentURI.spec))
+        (excludedUrls.some((url) => url.test(tab.linkedBrowser?.currentURI.spec)) &&
+          tab.linkedBrowser?.currentURI.spec !== 'about:blank')
       ) {
         return false;
       }

src/browser/base/zen-components/ZenViewSplitter.mjs

@@ -51,7 +51,7 @@ class SplitNode extends SplitLeafNode {
 
   addChild(child) {
     child.parent = this;
-    this._children.push(child);
+    this._children.unshift(child);
   }
 }
 
@@ -69,6 +69,8 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
   _edgeHoverSize;
   minResizeWidth;
 
+  _lastOpenedTab = null;
+
   MAX_TABS = 4;
 
   init() {
@@ -81,9 +83,17 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
     ChromeUtils.defineLazyGetter(this, 'dropZone', () => document.getElementById('zen-splitview-dropzone'));
 
     window.addEventListener('TabClose', this.handleTabClose.bind(this));
+    window.addEventListener('TabSelect', this.onTabSelect.bind(this));
     this.initializeContextMenu();
     this.insertPageActionButton();
     this.insertIntoContextMenu();
+
+    // Add drag over listener to the browser view
+    if (Services.prefs.getBoolPref('zen.splitView.enable-tab-drop')) {
+      const tabBox = document.getElementById('tabbrowser-tabbox');
+      tabBox.addEventListener('dragover', this.onBrowserDragOverToSplit.bind(this));
+      this.onBrowserDragEndToSplit = this.onBrowserDragEndToSplit.bind(this);
+    }
   }
 
   insertIntoContextMenu() {
@@ -102,6 +112,9 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
    */
   handleTabClose(event) {
     const tab = event.target;
+    if (tab === this._lastOpenedTab) {
+      this._lastOpenedTab = null;
+    }
     const groupIndex = this._data.findIndex((group) => group.tabs.includes(tab));
     if (groupIndex < 0) {
       return;
@@ -109,6 +122,18 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
     this.removeTabFromGroup(tab, groupIndex, event.forUnsplit);
   }
 
+  /**
+   * @param {Event} event - The event that triggered the tab select.
+   * @description Handles the tab select event.
+   * @returns {void}
+   */
+  onTabSelect(event) {
+    const previousTab = event.detail.previousTab;
+    if (previousTab && !previousTab.hasAttribute('zen-empty-tab')) {
+      this._lastOpenedTab = previousTab;
+    }
+  }
+
   /**
    * Removes a tab from a group.
    *
@@ -142,6 +167,188 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
     }
   }
 
+  onBrowserDragOverToSplit(event) {
+    var dt = event.dataTransfer;
+    var draggedTab;
+    if (dt.mozTypesAt(0)[0] == TAB_DROP_TYPE) {
+      // tab copy or move
+      draggedTab = dt.mozGetDataAt(TAB_DROP_TYPE, 0);
+      // not our drop then
+      if (!draggedTab || gBrowser.selectedTab.hasAttribute('zen-empty-tab')) {
+        return;
+      }
+      draggedTab.container._finishMoveTogetherSelectedTabs(draggedTab);
+    }
+    if (
+      !draggedTab ||
+      this._canDrop ||
+      this._hasAnimated ||
+      this.fakeBrowser ||
+      !this._lastOpenedTab ||
+      (this._lastOpenedTab &&
+        (this._lastOpenedTab.getAttribute('zen-workspace-id') !== draggedTab.getAttribute('zen-workspace-id') ||
+          this._lastOpenedTab.hasAttribute('zen-essential')))
+    ) {
+      return;
+    }
+    if (draggedTab.splitView) {
+      return;
+    }
+    const currentView = this._data[this._lastOpenedTab.splitViewValue];
+    if (currentView?.tabs.length >= this.MAX_TABS) {
+      return;
+    }
+    const panelsRect = gBrowser.tabbox.getBoundingClientRect();
+    const panelsWidth = panelsRect.width;
+    if (
+      event.clientX > panelsRect.left + panelsWidth - 10 ||
+      event.clientX < panelsRect.left + 10 ||
+      event.clientY < panelsRect.top + 10 ||
+      event.clientY > panelsRect.bottom - 10
+    ) {
+      return;
+    }
+    // first quarter or last quarter of the screen, but not the middle
+    if (!(event.clientX < panelsRect.left + panelsWidth / 4 || event.clientX > panelsRect.left + (panelsWidth / 4) * 3)) {
+      return;
+    }
+    dt.mozCursor = 'default';
+    const oldTab = this._lastOpenedTab;
+    this._canDrop = true;
+    {
+      this._draggingTab = draggedTab;
+      gBrowser.selectedTab = oldTab;
+      this._hasAnimated = true;
+      for (const tab of gBrowser.tabs) {
+        tab.style.removeProperty('transform');
+      }
+      const panelsWidth = gBrowser.tabbox.getBoundingClientRect().width;
+      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';
+      gBrowser.tabbox.appendChild(this.fakeBrowser);
+      this.fakeBrowser.style.setProperty('--zen-split-view-fake-icon', `url(${draggedTab.getAttribute('image')})`);
+      draggedTab._visuallySelected = true;
+      this.fakeBrowser.setAttribute('side', side);
+      this._finishAllAnimatingPromise = Promise.all([
+        gZenUIManager.motion.animate(
+          gBrowser.tabbox,
+          side === 'left'
+            ? {
+                paddingLeft: [0, `${halfWidth}px`],
+                paddingRight: 0,
+              }
+            : {
+                paddingRight: [0, `${halfWidth}px`],
+                paddingLeft: 0,
+              },
+          {
+            duration: 0.08,
+            easing: 'ease-out',
+          }
+        ),
+        gZenUIManager.motion.animate(
+          this.fakeBrowser,
+          {
+            width: [0, `${halfWidth - padding}px`],
+            ...(side === 'left'
+              ? {
+                  marginLeft: [0, `${-halfWidth}px`],
+                }
+              : {}),
+          },
+          {
+            duration: 0.08,
+            easing: 'ease-out',
+          }
+        ),
+      ]);
+      if (this._finishAllAnimatingPromise) {
+        this._finishAllAnimatingPromise.then(() => {
+          this._canDrop = true;
+          draggedTab._visuallySelected = true;
+        });
+      }
+    }
+  }
+
+  onBrowserDragEndToSplit(event) {
+    if (!this._canDrop) {
+      return;
+    }
+    const panelsRect = gBrowser.tabbox.getBoundingClientRect();
+    const fakeBrowserRect = this.fakeBrowser && this.fakeBrowser.getBoundingClientRect();
+    if (
+      (event.target.closest('#tabbrowser-tabbox') && event.target != this.fakeBrowser) ||
+      (fakeBrowserRect &&
+        event.clientX > fakeBrowserRect.left &&
+        event.clientX < fakeBrowserRect.left + fakeBrowserRect.width &&
+        event.clientY > fakeBrowserRect.top &&
+        event.clientY < fakeBrowserRect.top + fakeBrowserRect.height) ||
+      (event.screenX === 0 && event.screenY === 0) // It's equivalent to 0 if the event has been dropped
+    ) {
+      return;
+    }
+    if (!this._hasAnimated || !this.fakeBrowser) {
+      return;
+    }
+    const panelsWidth = panelsRect.width;
+    const halfWidth = panelsWidth / 2;
+    const padding = Services.prefs.getIntPref('zen.theme.content-element-separation', 0);
+    if (!this.fakeBrowser) {
+      return;
+    }
+    this.fakeBrowser.classList.add('fade-out');
+    const side = this.fakeBrowser.getAttribute('side');
+    if (this._draggingTab) this._draggingTab.setAttribute('zen-has-splitted', 'true');
+    this._lastOpenedTab = gBrowser.selectedTab;
+    this._draggingTab = null;
+    try {
+      Promise.all([
+        gZenUIManager.motion.animate(
+          gBrowser.tabbox,
+          side === 'left'
+            ? {
+                paddingLeft: [`${halfWidth}px`, 0],
+              }
+            : {
+                paddingRight: [`${halfWidth}px`, 0],
+              },
+          {
+            duration: 0.1,
+            easing: 'ease-out',
+          }
+        ),
+        gZenUIManager.motion.animate(
+          this.fakeBrowser,
+          {
+            width: [`${halfWidth - padding * 2}px`, 0],
+            ...(side === 'left'
+              ? {
+                  marginLeft: [`${-halfWidth}px`, 0],
+                }
+              : {}),
+          },
+          {
+            duration: 0.1,
+            easing: 'ease-out',
+          }
+        ),
+      ]).then(() => {
+        this._canDrop = false;
+        this._maybeRemoveFakeBrowser();
+      });
+    } catch (e) {
+      this._canDrop = false;
+      this._maybeRemoveFakeBrowser();
+    }
+  }
+
   /**
    * Remove a SplitNode from its tree and the view
    * @param {SplitNode} toRemove
@@ -204,14 +411,13 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
 
   afterRearangeAction() {
     document.getElementById('zenSplitViewModifier').hidePopup();
-    ConfirmationHint.show(document.getElementById('zen-split-views-box'), 'zen-split-view-modifier-enabled-toast', {
+    gZenUIManager.showToast('zen-split-view-modifier-enabled-toast', {
       descriptionId: 'zen-split-view-modifier-enabled-toast-description',
-      showDescription: true,
     });
   }
 
   afterRearangeRemove() {
-    ConfirmationHint.show(document.getElementById('zen-split-views-box'), 'zen-split-view-modifier-disabled-toast');
+    gZenUIManager.showToast('zen-split-view-modifier-disabled-toast');
   }
 
   toggleWrapperDisplay(value) {
@@ -289,7 +495,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
     let isSplitHeaderDrag = false;
 
     const container = event.target.closest('.browserSidebarContainer[zen-split]');
-    if (container && event.offsetY < 20) {
+    if (container && event.target.closest('.zen-tab-rearrange-button')) {
       // Split tab header drag case
       const containerRect = container.getBoundingClientRect();
       const clickX = event.clientX - containerRect.left;
@@ -549,6 +755,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
    */
   resetTabState(tab, forUnsplit) {
     tab.splitView = false;
+    delete tab.splitViewValue;
     tab.removeAttribute('split-view');
     tab.linkedBrowser.zenModeActive = false;
     const container = tab.linkedBrowser.closest('.browserSidebarContainer');
@@ -679,7 +886,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
       return false;
     }
     for (const tab of window.gBrowser.selectedTabs) {
-      if (tab.splitView) {
+      if (tab.splitView || tab.hasAttribute('zen-empty-tab') || tab.hasAttribute('zen-essential')) {
         return false;
       }
     }
@@ -699,6 +906,27 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
       this.updateSplitView(tab);
       tab.linkedBrowser.docShellIsActive = true;
     }
+    this._maybeRemoveFakeBrowser();
+  }
+
+  /**
+   * @param {Tab} tab
+   */
+  _moveTabsToContainer(tabs, relativeTab) {
+    const relativeTabIsPinned = relativeTab.pinned;
+    const relativeTabIsEssential = relativeTab.hasAttribute('zen-essential');
+
+    if (relativeTabIsEssential) {
+      gZenPinnedTabManager.addToEssentials(tabs);
+    } else {
+      for (const tab of tabs) {
+        if (relativeTabIsPinned) {
+          gBrowser.pinTab(tab);
+        } else {
+          gBrowser.unpinTab(tab);
+        }
+      }
+    }
   }
 
   /**
@@ -707,14 +935,13 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
    * @param {Tab[]} tabs - The tabs to split.
    * @param {string} gridType - The type of grid layout.
    */
-  splitTabs(tabs, gridType) {
+  splitTabs(tabs, gridType, initialIndex = 0) {
-    const firstisPinned = tabs[0].pinned;
+    // TODO: Add support for splitting essential tabs
-    tabs = tabs.filter(
+    tabs = tabs.filter((t) => !t.hidden && !t.hasAttribute('zen-empty-tab') && !t.hasAttribute('zen-essential'));
-      (t) => t.pinned === firstisPinned && !t.hidden && !t.hasAttribute('zen-empty-tab') && !t.hasAttribute('zen-essential')
-    );
     if (tabs.length < 2 || tabs.length > this.MAX_TABS) {
       return;
     }
+    this._moveTabsToContainer(tabs, tabs[initialIndex]);
 
     const existingSplitTab = tabs.find((tab) => tab.splitView);
     if (existingSplitTab) {
@@ -861,9 +1088,10 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
   applyGridToTabs(tabs) {
     tabs.forEach((tab, index) => {
       tab.splitView = true;
+      tab.splitViewValue = this.currentView;
       tab.setAttribute('split-view', 'true');
-      const container = tab.linkedBrowser.closest('.browserContainer');
+      const container = tab.linkedBrowser?.closest('.browserSidebarContainer');
-      if (!container.querySelector('.zen-view-splitter-header')) {
+      if (!container?.querySelector('.zen-tab-rearrange-button')) {
         // insert a header into the container
         const header = this._createHeader(container);
         container.insertBefore(header, container.firstChild);
@@ -879,6 +1107,8 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
    * @private
    */
   _createHeader(container) {
+    const headerContainer = document.createElement('div');
+    headerContainer.classList.add('zen-view-splitter-header-container');
     const header = document.createElement('div');
     header.classList.add('zen-view-splitter-header');
     const removeButton = document.createXULElement('toolbarbutton');
@@ -886,12 +1116,16 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
     removeButton.addEventListener('click', () => {
       this.removeTabFromSplit(container);
     });
+    const rearrangeButton = document.createXULElement('toolbarbutton');
+    rearrangeButton.classList.add('zen-tab-rearrange-button');
+    header.appendChild(rearrangeButton);
     header.appendChild(removeButton);
-    return header;
+    headerContainer.appendChild(header);
+    return headerContainer;
   }
 
   _removeHeader(container) {
-    const header = container.querySelector('.zen-view-splitter-header');
+    const header = container.querySelector('.zen-view-splitter-header-container');
     if (header) {
       header.remove();
     }
@@ -1029,7 +1263,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
     this.tabBrowserPanel.setAttribute('zen-split-resizing', true);
     const isVertical = event.target.getAttribute('orient') === 'vertical';
     const dimension = isVertical ? 'width' : 'height';
-    const clientAxis = isVertical ? 'screenX' : 'screenY';
+    const clientAxis = isVertical ? 'clientX' : 'clientY';
 
     const gridIdx = parseInt(event.target.getAttribute('gridIdx'));
     const startPosition = event[clientAxis];
@@ -1245,7 +1479,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
       return;
     }
     const tabs = gBrowser.visibleTabs;
-    if (tabs.length < 2) {
+    if (tabs.length < 2 || this.currentView >= 0) {
       return;
     }
     let nextTabIndex = tabs.indexOf(gBrowser.selectedTab) + 1;
@@ -1275,6 +1509,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
       const tab = gBrowser.getTabForBrowser(browser);
       if (tab) {
         const groupIndex = this._data.findIndex((group) => group.tabs.includes(tab));
+        this.deactivateCurrentSplitView();
         if (groupIndex >= 0) {
           this.removeTabFromGroup(tab, groupIndex, true);
         }
@@ -1282,6 +1517,20 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
     }
   };
 
+  _maybeRemoveFakeBrowser(select = true) {
+    gBrowser.tabbox.removeAttribute('style');
+    if (this.fakeBrowser) {
+      delete this._hasAnimated;
+      this.fakeBrowser.remove();
+      this.fakeBrowser = null;
+      if (this._draggingTab) this._draggingTab._visuallySelected = false;
+      if (select) {
+        gBrowser.selectedTab = this._draggingTab;
+        this._draggingTab = null;
+      }
+    }
+  }
+
   /**
    * @description moves the tab to the split view if dragged on a browser
    * @param event - The event
@@ -1289,18 +1538,41 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
    * @returns {boolean} true if the tab was moved to the split view
    */
   moveTabToSplitView(event, draggedTab) {
-    const dropTarget = document.elementFromPoint(event.clientX, event.clientY);
+    const canDrop = this._canDrop;
+    this._canDrop = false;
+
+    if (!canDrop || !this.fakeBrowser) {
+      this._maybeRemoveFakeBrowser(false);
+      return false;
+    }
+
+    const dropSide = this.fakeBrowser?.getAttribute('side');
+    const containerRect = this.fakeBrowser.getBoundingClientRect();
+    const padding = Services.prefs.getIntPref('zen.theme.content-element-separation', 0);
+    const dropTarget = document.elementFromPoint(
+      dropSide === 'left' ? containerRect.left + containerRect.width + padding + 5 : containerRect.left - padding - 5,
+      event.clientY
+    );
     const browser = dropTarget?.closest('browser');
 
     if (!browser) {
+      this._maybeRemoveFakeBrowser(false);
       return false;
     }
 
+    gBrowser.selectedTab = this._draggingTab;
+    this._draggingTab = null;
+    const browserContainer = draggedTab.linkedBrowser?.closest('.browserSidebarContainer');
+    if (browserContainer) {
+      browserContainer.style.opacity = '0';
+    }
+
     const droppedOnTab = gBrowser.getTabForBrowser(browser);
     if (droppedOnTab && droppedOnTab !== draggedTab) {
       // Calculate which side of the target browser the drop occurred
-      const browserRect = browser.getBoundingClientRect();
+      // const browserRect = browser.getBoundingClientRect();
-      const hoverSide = this.calculateHoverSide(event.clientX, event.clientY, browserRect);
+      // const hoverSide = this.calculateHoverSide(event.clientX, event.clientY, browserRect);
+      const hoverSide = dropSide;
 
       if (droppedOnTab.splitView) {
         // Add to existing split view
@@ -1311,6 +1583,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
           // First move the tab to the split view group
           let splitGroup = droppedOnTab.group;
           if (splitGroup && (!draggedTab.group || draggedTab.group !== splitGroup)) {
+            this._moveTabsToContainer([draggedTab], droppedOnTab);
             gBrowser.moveTabToGroup(draggedTab, splitGroup);
           }
 
@@ -1336,29 +1609,80 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
         }
       } else {
         // Create new split view with layout based on drop position
-        let gridType;
+        let gridType = 'vsep';
-        switch (hoverSide) {
+        //switch (hoverSide) {
-          case 'left':
+        //  case 'left':
-          case 'right':
+        //  case 'right':
-            gridType = 'vsep';
+        //    gridType = 'vsep';
-            break;
+        //    break;
-          case 'top':
+        //  case 'top':
-          case 'bottom':
+        //  case 'bottom':
-            gridType = 'hsep';
+        //    gridType = 'hsep';
-            break;
+        //    break;
-          default:
+        //  default:
-            gridType = 'grid';
+        //    gridType = 'grid';
-        }
+        //}
 
-        // Put tabs in correct order based on drop side
+        // Put tabs always as if it was dropped from the left
-        const tabs = ['left', 'top'].includes(hoverSide) ? [draggedTab, droppedOnTab] : [droppedOnTab, draggedTab];
+        this.splitTabs(dropSide == 'left' ? [draggedTab, droppedOnTab] : [droppedOnTab, draggedTab], gridType, 1);
-
-        this.splitTabs(tabs, gridType);
       }
     }
+    if (this._finishAllAnimatingPromise) {
+      this._finishAllAnimatingPromise.then(() => {
+        this._maybeRemoveFakeBrowser(false);
+      });
+    }
+
+    if (browserContainer) {
+      gZenUIManager.motion
+        .animate(
+          browserContainer,
+          {
+            scale: [0.97, 1],
+            opacity: [0, 1],
+          },
+          {
+            type: 'spring',
+            bounce: 0.4,
+            duration: 0.2,
+            delay: 0.1,
+          }
+        )
+        .then(() => {
+          this._maybeRemoveFakeBrowser(false);
+          this._finishAllAnimatingPromise = null;
+        });
+    }
     return true;
   }
 
+  handleTabDrop(event, urls, replace, inBackground) {
+    if (replace || urls.length !== 1) {
+      return false;
+    }
+    const url = urls[0];
+    if (!url.startsWith('panel-')) {
+      return false;
+    }
+    const browserContainer = document.getElementById(url);
+    const browser = browserContainer?.querySelector('browser');
+    if (!browser) {
+      return false;
+    }
+    const tab = gBrowser.getTabForBrowser(browser);
+    if (!tab) {
+      return false;
+    }
+    if (tab.splitView) {
+      // Unsplit the tab and exit from the drag view
+      this.dropZone?.removeAttribute('enabled');
+      this.disableTabRearrangeView(event);
+      this.removeTabFromSplit(browserContainer);
+      return true;
+    }
+    return false;
+  }
+
   /**
    * Gets or creates a tab group for split view tabs
    * @param {Array} tabs Initial tabs to add to the group if creating new

src/browser/base/zen-components/ZenWelcome.mjs

@@ -226,6 +226,7 @@
       const sidebar = document.getElementById('zen-welcome-page-sidebar');
       sidebar.style.width = '100%';
       sidebar.appendChild(heart);
+      sidebar.setAttribute('animate-heart', 'true');
       await animate(
         '#zen-welcome-heart',
         { opacity: [0, 1, 1, 1, 0], scale: [0.5, 1, 1.2, 1, 1.2] },
@@ -334,17 +335,17 @@
                   <html:div></html:div>
                 </hbox>
                 <html:div id="zen-welcome-initial-essentials-browser-sidebar-essentials">
-                  <html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://web.whatsapp.com" style="--zen-tab-icon: url('https://web.whatsapp.com/favicon.ico');">
+                  <html:div class="tabbrowser-tab" fadein="" data-url="https://web.whatsapp.com" style="--zen-tab-icon: url('https://web.whatsapp.com/favicon.ico');">
                     <stack class="tab-stack">
                       <html:div class="tab-background"></html:div>
                     </stack>
                   </html:div>
-                  <html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://discord.com" style="--zen-tab-icon: url('http://www.google.com/s2/favicons?domain=discord.com');">
+                  <html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://discord.com" style="--zen-tab-icon: url('https://www.google.com/s2/favicons?domain=discord.com');">
                     <stack class="tab-stack">
                       <html:div class="tab-background"></html:div>
                     </stack>
                   </html:div>
-                  <html:div class="tabbrowser-tab" fadein="" data-url="https://reddit.com" style="--zen-tab-icon: url('https://www.redditstatic.com/desktop2x/img/favicon/favicon-96x96.png');">
+                  <html:div class="tabbrowser-tab" fadein="" data-url="https://trello.com" style="--zen-tab-icon: url('https://trello.com/favicon.ico');">
                     <stack class="tab-stack">
                       <html:div class="tab-background"></html:div>
                     </stack>
@@ -354,7 +355,7 @@
                       <html:div class="tab-background"></html:div>
                     </stack>
                   </html:div>
-                  <html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://google.com" style="--zen-tab-icon: url('https://www.google.com/s2/favicons?domain=google.com');">
+                  <html:div class="tabbrowser-tab" fadein="" data-url="https://github.com" style="--zen-tab-icon: url('https://github.githubassets.com/favicons/favicon-dark.png');">
                     <stack class="tab-stack">
                       <html:div class="tab-background"></html:div>
                     </stack>
@@ -364,17 +365,17 @@
                       <html:div class="tab-background"></html:div>
                     </stack>
                   </html:div>
-                  <html:div class="tabbrowser-tab" fadein="" data-url="https://notion.com" style="--zen-tab-icon: url('https://www.notion.so/front-static/favicon.ico');">
+                  <html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://notion.com" style="--zen-tab-icon: url('https://www.notion.so/front-static/favicon.ico');">
                     <stack class="tab-stack">
                       <html:div class="tab-background"></html:div>
                     </stack>
                   </html:div>
-                  <html:div class="tabbrowser-tab" fadein="" data-url="https://instagram.com" style="--zen-tab-icon: url('https://www.instagram.com/static/images/ico/favicon-192.png/68d99ba29cc8.png');">
+                  <html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://calendar.google.com" style="--zen-tab-icon: url('https://calendar.google.com/googlecalendar/images/favicons_2020q4/calendar_6.ico');">
                     <stack class="tab-stack">
                       <html:div class="tab-background"></html:div>
                     </stack>
                   </html:div>
-                  <html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://element.io" style="--zen-tab-icon: url('http://www.google.com/s2/favicons?domain=element.io');">
+                  <html:div class="tabbrowser-tab" fadein="" data-url="https://youtube.com" style="--zen-tab-icon: url('https://www.youtube.com/favicon.ico');">
                     <stack class="tab-stack">
                       <html:div class="tab-background"></html:div>
                     </stack>
@@ -453,9 +454,7 @@
         async fadeOut() {
           gZenThemePicker.panel.removeAttribute('noautohide');
           gZenThemePicker.panel.removeAttribute('consumeoutsideclicks');
-          if (AppConstants.platform != 'macosx') {
+          await animate(gZenThemePicker.panel, { opacity: [1, 0] });
-            await animate(gZenThemePicker.panel, { opacity: [1, 0] });
-          }
           gZenThemePicker.panel.hidePopup();
           gZenThemePicker.panel.removeAttribute('style');
         },

src/browser/base/zen-components/ZenWorkspaces.mjs

@@ -36,6 +36,10 @@ 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>
@@ -111,12 +115,13 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
     );
   }
 
-  selectEmptyTab() {
+  selectEmptyTab(newTabTarget = null) {
     if (this._emptyTab && gZenVerticalTabsManager._canReplaceNewTab) {
       gBrowser.selectedTab = this._emptyTab;
       return this._emptyTab;
     }
-    let tab = gZenUIManager.openAndChangeToTab(Services.prefs.getStringPref('browser.startup.homepage'));
+    const newTabUrl = newTabTarget || Services.prefs.getStringPref('browser.startup.homepage');
+    let tab = gZenUIManager.openAndChangeToTab(newTabUrl);
     if (window.uuid) {
       tab.setAttribute('zen-workspace-id', this.activeWorkspace);
     }
@@ -144,6 +149,9 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
   }
 
   _initializeEmptyTab() {
+    if (Services.prefs.getBoolPref('zen.workspaces.disable_empty_state_for_testing', false)) {
+      return;
+    }
     this._emptyTab = gBrowser.addTrustedTab('about:blank', { inBackground: true, userContextId: 0, _forZenEmptyTab: true });
   }
 
@@ -602,15 +610,22 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
       } catch (e) {
         console.error('ZenWorkspaces: Error initializing theme picker', e);
       }
-      this._selectStartPage();
+      await this._selectStartPage();
       this._fixTabPositions();
       this._resolveInitialized();
+      this._clearAnyZombieTabs(); // Dont call with await
     }
   }
 
-  _selectStartPage() {
+  async _selectStartPage() {
+    if (Services.prefs.getBoolPref('zen.workspaces.disable_empty_state_for_testing', false)) {
+      return;
+    }
     const currentTab = gBrowser.selectedTab;
     let showed = false;
+    await this.promiseEmptyTabInitialized;
+    this._resolveEmptyTabInitialized = null;
+    this.promiseEmptyTabInitialized = null;
     if (currentTab.pinned) {
       this.selectEmptyTab();
       try {
@@ -625,7 +640,8 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
       if (
         (currentTab.isEmpty &&
           (currentTab.getAttribute('image') === gPageIcons[currentTabURL] || !currentTab.hasAttribute('image'))) ||
-        currentTab.hasAttribute('zen-empty-tab')
+        currentTab.hasAttribute('zen-empty-tab') ||
+        (currentTab._possibleEmptyTab && currentTab.isEmpty)
       ) {
         this.selectEmptyTab();
         this._removedByStartupPage = true;
@@ -652,6 +668,26 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
     return !window.toolbar.visible || Services.prefs.getBoolPref('browser.tabs.closeWindowWithLastTab');
   }
 
+  async _clearAnyZombieTabs() {
+    const tabs = this.allStoredTabs;
+    const workspaces = await this._workspaces();
+    for (let tab of tabs) {
+      const workspaceID = tab.getAttribute('zen-workspace-id');
+      if (
+        workspaceID &&
+        !tab.hasAttribute('zen-essential') &&
+        !workspaces.workspaces.find((workspace) => workspace.uuid === workspaceID)
+      ) {
+        // Remove any tabs where their workspace doesn't exist anymore
+        gBrowser.removeTab(tab, {
+          animate: false,
+          skipSessionStore: true,
+          closeWindowWithLastTab: false,
+        });
+      }
+    }
+  }
+
   handleTabBeforeClose(tab) {
     if (!this.workspaceEnabled || this.__contextIsDelete || this._removedByStartupPage) {
       return null;
@@ -1382,15 +1418,16 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
   }
 
   _deleteAllTabsInWorkspace(workspaceID) {
-    for (let tab of gBrowser.tabs) {
+    gBrowser.removeTabs(
-      if (tab.getAttribute('zen-workspace-id') === workspaceID) {
+      Array.from(gBrowser.tabs).filter(
-        gBrowser.removeTab(tab, {
+        (tab) => tab.getAttribute('zen-workspace-id') === workspaceID && !tab.hasAttribute('zen-empty-tab')
-          animate: true,
+      ),
-          skipSessionStore: true,
+      {
-          closeWindowWithLastTab: false,
+        animate: false,
-        });
+        skipSessionStore: true,
+        closeWindowWithLastTab: false,
       }
-    }
+    );
   }
 
   moveTabToWorkspace(tab, workspaceID) {
@@ -1508,18 +1545,19 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
     const previousWorkspace = await this.getActiveWorkspace();
     alwaysChange = alwaysChange || onInit;
 
+    this.activeWorkspace = window.uuid;
     if (previousWorkspace && previousWorkspace.uuid === window.uuid && !alwaysChange) {
       this._cancelSwipeAnimation();
       return;
     }
 
-    this.activeWorkspace = window.uuid;
     const containerId = window.containerTabId?.toString();
     const workspaces = await this._workspaces();
 
     // Refresh tab cache
-    gBrowser.verticalPinnedTabsContainer = this.pinnedTabsContainer;
+    gBrowser.verticalPinnedTabsContainer = this.pinnedTabsContainer || gBrowser.verticalPinnedTabsContainer;
-    gBrowser.tabContainer.verticalPinnedTabsContainer = this.pinnedTabsContainer;
+    gBrowser.tabContainer.verticalPinnedTabsContainer =
+      this.pinnedTabsContainer || gBrowser.tabContainer.verticalPinnedTabsContainer;
     // Move empty tab to the new workspace
     this._moveEmptyTabToWorkspace(window.uuid);
 
@@ -1967,6 +2005,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
   }
 
   async onLocationChange(browser) {
+    gZenCompactModeManager.sidebar.toggleAttribute('zen-has-empty-tab', gBrowser.selectedTab.hasAttribute('zen-empty-tab'));
     if (!this.workspaceEnabled || this._inChangingWorkspace || this._isClosingWindow) {
       return;
     }
@@ -1993,6 +2032,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
 
       // Switch workspace if needed
       if (workspaceID && workspaceID !== activeWorkspace.uuid && parent.ZenWorkspaces._hasInitializedTabsStrip) {
+        const workspaces = await parent.ZenWorkspaces._workspaces();
         await parent.ZenWorkspaces.changeWorkspace({ uuid: workspaceID });
       }
     }
@@ -2231,7 +2271,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
     const activeWorkspace = this.getActiveWorkspaceFromCache();
     const activeWorkspaceUserContextId = activeWorkspace?.containerTabId;
 
-    if (typeof userContextId !== 'undefined' && userContextId !== activeWorkspaceUserContextId) {
+    if (fromExternal !== true && typeof userContextId !== 'undefined' && userContextId !== activeWorkspaceUserContextId) {
       return [userContextId, false, undefined];
     }
     return [activeWorkspaceUserContextId, true, undefined];

src/browser/base/zen-components/ZenWorkspacesStorage.mjs

@@ -7,6 +7,7 @@ var ZenWorkspacesStorage = {
       Weave: 'resource://services-sync/main.sys.mjs',
     });
 
+    if (!window.ZenWorkspaces) return;
     await this._ensureTable();
     await ZenWorkspaceBookmarksStorage.init();
   },

src/browser/base/zen-components/actors/ZenGlanceChild.sys.mjs

@@ -12,6 +12,9 @@ export class ZenGlanceChild extends JSWindowActorChild {
       case 'DOMContentLoaded':
         await this.initiateGlance();
         break;
+      case 'keydown':
+        this.onKeyDown(event);
+        break;
       default:
     }
   }
@@ -120,4 +123,13 @@ export class ZenGlanceChild extends JSWindowActorChild {
       this.openGlance(target);
     }
   }
+
+  onKeyDown(event) {
+    if (event.defaultPrevented || event.key !== 'Escape') {
+      return;
+    }
+    this.sendAsyncMessage('ZenGlance:CloseGlance', {
+      hasFocused: this.contentWindow.document.activeElement !== this.contentWindow.document.body,
+    });
+  }
 }

src/browser/base/zen-components/actors/ZenGlanceParent.sys.mjs

@@ -15,6 +15,16 @@ export class ZenGlanceParent extends JSWindowActorParent {
         this.openGlance(this.browsingContext.topChromeWindow, message.data);
         break;
       }
+      case 'ZenGlance:CloseGlance': {
+        const params = {
+          onTabClose: true,
+          ...message.data,
+        };
+        this.browsingContext.topChromeWindow.gZenGlanceManager.closeGlance(params);
+        break;
+      }
+      default:
+        console.warn(`[glance]: Unknown message: ${message.name}`);
     }
   }
 

src/browser/base/zen-components/moz.build

@@ -0,0 +1,4 @@
+
+BROWSER_CHROME_MANIFESTS += [
+    "tests/browser.toml",
+]

src/browser/components/customizableui/ToolbarContextMenu-sys-mjs.patch

@@ -0,0 +1,22 @@
+diff --git a/browser/components/customizableui/ToolbarContextMenu.sys.mjs b/browser/components/customizableui/ToolbarContextMenu.sys.mjs
+index 9879487f9ed9ddf825f5fb5c1467ddbd7fbe7a32..9e2565fafe0f5f9afa6065c9f4f522fec745db2a 100644
+--- a/browser/components/customizableui/ToolbarContextMenu.sys.mjs
++++ b/browser/components/customizableui/ToolbarContextMenu.sys.mjs
+@@ -237,17 +237,6 @@ export var ToolbarContextMenu = {
+     // autohide item's checked state to mirror the autohide pref.
+     showFullScreenViewContextMenuItems(popup);
+ 
+-    let toggleVerticalTabsItem = document.getElementById(
+-      "toolbar-context-toggle-vertical-tabs"
+-    );
+-    document.l10n.setAttributes(
+-      toggleVerticalTabsItem,
+-      gBrowser.tabContainer?.verticalMode
+-        ? "toolbar-context-turn-off-vertical-tabs"
+-        : "toolbar-context-turn-on-vertical-tabs"
+-    );
+-    document.getElementById("toolbar-context-customize-sidebar").hidden =
+-      !gBrowser.tabContainer?.verticalMode;
+ 
+     // View -> Toolbars menu doesn't have the moveToPanel or removeFromToolbar items.
+     if (!moveToPanel || !removeFromToolbar) {

src/browser/components/extensions/parent/ext-browser-js.patch

@@ -0,0 +1,15 @@
+diff --git a/browser/components/extensions/parent/ext-browser.js b/browser/components/extensions/parent/ext-browser.js
+index 179816fa96ccf26604d52f71232296398dd9bdbd..c35814bae4eab774892af1f6df7465601d4f87ac 100644
+--- a/browser/components/extensions/parent/ext-browser.js
++++ b/browser/components/extensions/parent/ext-browser.js
+@@ -1218,6 +1218,10 @@ class TabManager extends TabManagerBase {
+   }
+ 
+   canAccessTab(nativeTab) {
++    if (nativeTab.hasAttribute("zen-empty-tab")) {
++      return false
++    }
++
+     // Check private browsing access at browser window level.
+     if (!this.extension.canAccessWindow(nativeTab.ownerGlobal)) {
+       return false;

src/browser/components/extensions/parent/ext-tabs-js.patch

@@ -0,0 +1,12 @@
+diff --git a/browser/components/extensions/parent/ext-tabs.js b/browser/components/extensions/parent/ext-tabs.js
+index b47f0510e32d788dfe7c3109474c4512c9900d4a..49697125a2998bbd50d87c54e2c5974baaf9a7e2 100644
+--- a/browser/components/extensions/parent/ext-tabs.js
++++ b/browser/components/extensions/parent/ext-tabs.js
+@@ -468,6 +468,7 @@ this.tabs = class extends ExtensionAPIPersistent {
+         }
+ 
+         let tab = tabManager.getWrapper(event.originalTarget);
++        if (!tab) return;
+ 
+         let changeInfo = {};
+         for (let prop of needed) {

src/browser/components/places/content/editBookmark-js.patch

@@ -1,8 +1,8 @@
 diff --git a/browser/components/places/content/editBookmark.js b/browser/components/places/content/editBookmark.js
-index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..e2c38872ee3a5c45d2e288e67d33f9ce24cab2b9 100644
+index 9ab4e96cc4738d0ba549dca67b8559e0f9534f37..07b9087b0b17e33853d78c66ea1e5321a2bfef80 100644
 --- a/browser/components/places/content/editBookmark.js
 +++ b/browser/components/places/content/editBookmark.js
-@@ -370,6 +370,10 @@ var gEditItemOverlay = {
+@@ -386,6 +386,10 @@ var gEditItemOverlay = {
          this._keywordField.readOnly = this.readOnly;
        }
  
@@ -13,7 +13,7 @@ index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..e2c38872ee3a5c45d2e288e67d33f9ce
        // Collapse the tag selector if the item does not accept tags.
        if (showOrCollapse("tagsRow", isBookmark || bulkTagging, "tags")) {
          this._initTagsField();
-@@ -682,6 +686,7 @@ var gEditItemOverlay = {
+@@ -692,6 +696,7 @@ var gEditItemOverlay = {
        if (this._paneInfo.isBookmark) {
          options.tags = this._element("tagsField").value;
          options.keyword = this._keyword;
@@ -21,7 +21,17 @@ index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..e2c38872ee3a5c45d2e288e67d33f9ce
        }
  
        if (this._paneInfo.bulkTagging) {
-@@ -1232,6 +1237,148 @@ var gEditItemOverlay = {
+@@ -1193,6 +1198,9 @@ var gEditItemOverlay = {
+           case "editBMPanel_tagsSelectorExpander":
+             this.toggleTagsSelector().catch(console.error);
+             break;
++          case "editBMPanel_workspacesSelectorExpander":
++            this.onWorkspaceDropdownToggle();
++            break;
+         }
+         break;
+     }
+@@ -1279,6 +1287,148 @@ var gEditItemOverlay = {
    get bookmarkState() {
      return this._bookmarkState;
    },
@@ -170,7 +180,7 @@ index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..e2c38872ee3a5c45d2e288e67d33f9ce
  };
  
  ChromeUtils.defineLazyGetter(gEditItemOverlay, "_folderTree", () => {
-@@ -1267,6 +1414,9 @@ for (let elt of [
+@@ -1317,6 +1467,9 @@ for (let elt of [
    "locationField",
    "keywordField",
    "tagsField",

src/browser/components/places/content/editBookmarkPanel-inc-xhtml.patch

@@ -1,5 +1,5 @@
 diff --git a/browser/components/places/content/editBookmarkPanel.inc.xhtml b/browser/components/places/content/editBookmarkPanel.inc.xhtml
-index 40366677b60123c66bf0739d1b2374b423d3061c..3e722dce6b21ab62535369f20afe5f0acd43838f 100644
+index 40366677b60123c66bf0739d1b2374b423d3061c..a2774e99726407d95011126ea2a272f08eaf0961 100644
 --- a/browser/components/places/content/editBookmarkPanel.inc.xhtml
 +++ b/browser/components/places/content/editBookmarkPanel.inc.xhtml
 @@ -12,14 +12,15 @@
@@ -20,11 +20,10 @@ index 40366677b60123c66bf0739d1b2374b423d3061c..3e722dce6b21ab62535369f20afe5f0a
    <label data-l10n-id="bookmark-overlay-location-2"
           class="editBMPanel_folderRow hideable"
           control="editBMPanel_folderMenuList"/>
-@@ -47,7 +48,26 @@
+@@ -47,7 +48,25 @@
              class="expander-down panel-button"
              data-l10n-id="bookmark-overlay-folders-expander2"/>
    </hbox>
--
 +  </hbox>
 +    <hbox flex="1" class="zenEditBMPanel_fieldContainer">
 +      <label data-l10n-id="zen-bookmark-edit-panel-workspace-selector"
@@ -37,12 +36,11 @@ index 40366677b60123c66bf0739d1b2374b423d3061c..3e722dce6b21ab62535369f20afe5f0a
 +                class="workspace-trigger">-</div>
 +        <button id="editBMPanel_workspacesSelectorExpander"
 +                class="expander-down panel-button"
-+                data-l10n-id="bookmark-overlay-tags-expander2"
++                data-l10n-id="bookmark-overlay-tags-expander2"/>
-+                oncommand="gEditItemOverlay.onWorkspaceDropdownToggle();"/>
++
-+  
 +      </div>
 +    </hbox>
-+  
+ 
 +    <ul id="editBMPanel_workspaceList" class="workspace-list hideable" hidden="true">
 +    </ul>
    <vbox id="editBMPanel_folderTreeRow"

src/browser/components/preferences/zen-settings.js

@@ -944,11 +944,6 @@ Preferences.addAll([
     type: 'bool',
     default: true,
   },
-  {
-    id: 'zen.workspaces.individual-pinned-tabs',
-    type: 'bool',
-    default: true,
-  },
   {
     id: 'zen.workspaces.show-icon-strip',
     type: 'bool',

src/browser/components/preferences/zenTabsManagement.inc.xhtml

@@ -20,9 +20,6 @@
       <checkbox id="zenWorkspacesHideDefaultContainer"
             data-l10n-id="zen-settings-workspaces-hide-default-container-indicator"
             preference="zen.workspaces.hide-default-container-indicator"/>
-      <checkbox id="zenWorkspacesAllowPinnedTabsForDifferentWorkspaces"
-            data-l10n-id="zen-settings-workspaces-allow-pinned-tabs-for-different-workspaces"
-            preference="zen.workspaces.individual-pinned-tabs"/>
       <checkbox id="zenWorkspacesDisplayAsIconStrip"
             data-l10n-id="zen-settings-workspaces-display-as-icon-strip"
             preference="zen.workspaces.show-icon-strip"/>

src/browser/components/search/SearchOneOffs-sys-mjs.patch

@@ -0,0 +1,13 @@
+diff --git a/browser/components/search/SearchOneOffs.sys.mjs b/browser/components/search/SearchOneOffs.sys.mjs
+index 6dcd68f7ec4da72f9510ac3c8ff1cecffbd70e92..f712b95d03be46f7d81bad4113f533f0515a92b9 100644
+--- a/browser/components/search/SearchOneOffs.sys.mjs
++++ b/browser/components/search/SearchOneOffs.sys.mjs
+@@ -446,7 +446,7 @@ export class SearchOneOffs {
+     // For the search-bar, always show the one-off buttons where there is an
+     // option to add an engine.
+     let addEngineNeeded = isSearchBar && addEngines.length;
+-    let hideOneOffs = (await this.willHide()) && !addEngineNeeded;
++    let hideOneOffs = (await this.willHide()) && !addEngineNeeded || Services.prefs.getBoolPref("zen.urlbar.hide-one-offs");
+ 
+     // The _engineInfo cache is used by more consumers, thus it is not a good
+     // representation of whether this method already updated the one-off buttons

src/browser/components/sessionstore/SessionStore-sys-mjs.patch

@@ -1,16 +1,25 @@
 diff --git a/browser/components/sessionstore/SessionStore.sys.mjs b/browser/components/sessionstore/SessionStore.sys.mjs
-index 908743177d9f95e2e6549c689e7a493ca8668701..181c4819b052e444e56e75f1cb40b4bc299569fb 100644
+index f814772114948f87cbb3c3a7231c95ea1f68d776..ae35daa518ca25f4fc95ef983519c390bf088a68 100644
 --- a/browser/components/sessionstore/SessionStore.sys.mjs
 +++ b/browser/components/sessionstore/SessionStore.sys.mjs
-@@ -3848,6 +3848,7 @@ var SessionStoreInternal = {
+@@ -3171,7 +3171,7 @@ var SessionStoreInternal = {
-         aWindow.gBrowser.selectedTab = newTab;
+     if (!isPrivateWindow && tabState.isPrivate) {
-       }
+       return;
+     }
+-    if (aTab == aWindow.FirefoxViewHandler.tab) {
++    if (aTab == aWindow.FirefoxViewHandler.tab || aTab.hasAttribute("zen-empty-tab")) {
+       return;
+     }
  
-+      if (aTab.hasAttribute("zenDefaultUserContextId")) newTab.setAttribute("zenDefaultUserContextId", true);
+@@ -3876,6 +3876,7 @@ var SessionStoreInternal = {
-       // Restore the state into the new tab.
+         Math.min(tabState.index, tabState.entries.length)
-       this.restoreTab(newTab, tabState, {
+       );
-         restoreImmediately: aRestoreImmediately,
+       tabState.pinned = false;
-@@ -5315,14 +5316,14 @@ var SessionStoreInternal = {
++      tabState.zenEssential = undefined;
+ 
+       if (inBackground === false) {
+         aWindow.gBrowser.selectedTab = newTab;
+@@ -5355,14 +5356,14 @@ var SessionStoreInternal = {
      }
  
      let tabbrowser = aWindow.gBrowser;
@@ -27,7 +36,16 @@ index 908743177d9f95e2e6549c689e7a493ca8668701..181c4819b052e444e56e75f1cb40b4bc
          continue;
        }
        let tabData = lazy.TabState.collect(tab, TAB_CUSTOM_VALUES.get(tab));
-@@ -6042,6 +6043,15 @@ var SessionStoreInternal = {
+@@ -5381,7 +5382,7 @@ var SessionStoreInternal = {
+     // We don't store the Firefox View tab in Session Store, so if it was the last selected "tab" when
+     // a window is closed, point to the first item in the tab strip instead (it will never be the Firefox View tab,
+     // since it's only inserted into the tab strip after it's selected).
+-    if (aWindow.FirefoxViewHandler.tab?.selected) {
++    if (aWindow.FirefoxViewHandler.tab?.selected || tabbrowser.selectedTab.hasAttribute("zen-empty-tab")) {
+       selectedIndex = 1;
+       winData.title = tabbrowser.tabs[0].label;
+     }
+@@ -6086,8 +6087,23 @@ var SessionStoreInternal = {
  
      // Most of tabData has been restored, now continue with restoring
      // attributes that may trigger external events.
@@ -35,11 +53,20 @@ index 908743177d9f95e2e6549c689e7a493ca8668701..181c4819b052e444e56e75f1cb40b4bc
 +      tab.setAttribute("zen-essential", "true");
 +    }
 +    if (tabData.zenIsEmpty) {
-+      tab.setAttribute("zen-empty-tab", "true"); 
++      tab.setAttribute("zen-empty-tab", "true");
++    }
++    if (tabData.zenHasStaticLabel) {
++      tab.setAttribute("zen-has-static-label", "true");
 +    }
 +    if (tabData.zenPinnedId) {
 +      tab.setAttribute("zen-pin-id", tabData.zenPinnedId);
 +    }
++    if (tabData.zenDefaultUserContextId) {
++      tab.setAttribute("zenDefaultUserContextId", true);
++    }
  
-     if (tabData.pinned) {
+-    if (tabData.pinned) {
++    if (tabData.pinned || tabData.zenEssential) {
        tabbrowser.pinTab(tab);
+     } else {
+       tabbrowser.unpinTab(tab);

src/browser/components/sessionstore/TabState-sys-mjs.patch

@@ -1,8 +1,8 @@
 diff --git a/browser/components/sessionstore/TabState.sys.mjs b/browser/components/sessionstore/TabState.sys.mjs
-index 8f7ed557e6aa61e7e16ed4a8d785ad5fe651b3d8..8b0781488e8f250666f1d542e3aa0cb34e018f24 100644
+index 8f7ed557e6aa61e7e16ed4a8d785ad5fe651b3d8..aff63696d198055886960072a6130318e099ae42 100644
 --- a/browser/components/sessionstore/TabState.sys.mjs
 +++ b/browser/components/sessionstore/TabState.sys.mjs
-@@ -80,10 +80,18 @@ class _TabState {
+@@ -80,10 +80,20 @@ class _TabState {
        tabData.muteReason = tab.muteReason;
      }
  
@@ -14,10 +14,12 @@ index 8f7ed557e6aa61e7e16ed4a8d785ad5fe651b3d8..8b0781488e8f250666f1d542e3aa0cb3
 +    tabData.zenWorkspace = tab.getAttribute("zen-workspace-id");
 +    tabData.zenPinnedId = tab.getAttribute("zen-pin-id");
 +    tabData.zenEssential = tab.getAttribute("zen-essential");
++    tabData.pinned = tabData.pinned || tabData.zenEssential;
 +    tabData.zenDefaultUserContextId = tab.getAttribute("zenDefaultUserContextId");
 +    tabData.zenPinnedEntry = tab.getAttribute("zen-pinned-entry");
 +    tabData.zenPinnedIcon = tab.getAttribute("zen-pinned-icon");
 +    tabData.zenIsEmpty = tab.hasAttribute("zen-empty-tab");
++    tabData.zenHasStaticLabel = tab.hasAttribute("zen-has-static-label");
 +
      tabData.searchMode = tab.ownerGlobal.gURLBar.getSearchMode(browser, true);
  

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..f4a4ad413785e08bbb70df8cbb5feefd71c4dfe1 100644
+index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad72079b02024 100644
 --- a/browser/components/tabbrowser/content/tabbrowser.js
 +++ b/browser/components/tabbrowser/content/tabbrowser.js
 @@ -412,11 +412,50 @@
@@ -197,7 +197,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
  
 +      let hasZenDefaultUserContextId = false;
 +      let zenForcedWorkspaceId = undefined;
-+      if (typeof ZenWorkspaces !== "undefined") {
++      if (typeof ZenWorkspaces !== "undefined" && !_forZenEmptyTab) {
 +        [userContextId, hasZenDefaultUserContextId, zenForcedWorkspaceId] = ZenWorkspaces.getContextIdIfNeeded(userContextId, fromExternal, allowInheritPrincipal);
 +      }
 +
@@ -246,7 +246,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
        } = {}
      ) {
        if (!tabs?.length) {
-@@ -2918,7 +2991,11 @@
+@@ -2918,7 +2991,12 @@
          id = `${Date.now()}-${Math.round(Math.random() * 100)}`;
        }
        let group = this._createTabGroup(id, color, false, label);
@@ -254,12 +254,13 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
 +      if (forSplitView) {
 +        group.setAttribute('split-view-group', true);
 +      }
-+      group.pinned = tabs.some(tab => tab.pinned);
++      group.essential = tabs.some(tab => tab.hasAttribute("essential"));
-+      (group.pinned ? this.verticalPinnedTabsContainer : this.tabContainer).insertBefore(
++      group.pinned = group.essential || tabs.some(tab => tab.pinned);
++      (group.essential ? document.getElementById("zen-essentials-container") : (group.pinned ? this.verticalPinnedTabsContainer : this.tabContainer)).insertBefore(
          group,
          insertBefore?.group ?? insertBefore
        );
-@@ -3126,6 +3203,7 @@
+@@ -3126,6 +3204,7 @@
          initialBrowsingContextGroupId,
          openWindowInfo,
          skipLoad,
@@ -267,7 +268,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
        }
      ) {
        // If we don't have a preferred remote type, and we have a remote
-@@ -3189,6 +3267,7 @@
+@@ -3189,6 +3268,7 @@
            openWindowInfo,
            name,
            skipLoad,
@@ -275,7 +276,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
          });
        }
  
-@@ -3367,6 +3446,24 @@
+@@ -3367,6 +3447,27 @@
          ) {
            tabWasReused = true;
            tab = this.selectedTab;
@@ -285,6 +286,9 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
 +          if (tabData.zenIsEmpty) {
 +            tab.setAttribute("zen-empty-tab", "true");
 +          }
++          if (tabData.zenHasStaticLabel) {
++            tab.setAttribute("zen-has-static-label", "true");
++          }
 +          if (tabData.zenPinnedId) {
 +            tab.setAttribute("zen-pin-id", tabData.zenPinnedId);
 +          }
@@ -300,7 +304,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
            if (!tabData.pinned) {
              this.unpinTab(tab);
            } else {
-@@ -3380,6 +3477,7 @@
+@@ -3380,6 +3481,7 @@
              restoreTabsLazily && !select && !tabData.pinned;
  
            let url = "about:blank";
@@ -308,7 +312,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
            if (tabData.entries?.length) {
              let activeIndex = (tabData.index || tabData.entries.length) - 1;
              // Ensure the index is in bounds.
-@@ -3415,7 +3513,24 @@
+@@ -3415,7 +3517,27 @@
              skipLoad: true,
              preferredRemoteType,
            });
@@ -322,6 +326,9 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
 +          if (tabData.zenIsEmpty) {
 +            tab.setAttribute("zen-empty-tab", "true");
 +          }
++          if (tabData.zenHasStaticLabel) {
++            tab.setAttribute("zen-has-static-label", "true");
++          }
 +          if (tabData.zenEssential) {
 +            tab.setAttribute("zen-essential", "true");
 +          }
@@ -334,7 +341,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
            if (select) {
              tabToSelect = tab;
            }
-@@ -3428,8 +3543,8 @@
+@@ -3428,8 +3550,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) {
@@ -345,7 +352,17 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
              tab.toggleAttribute("pinned", true);
              this.tabContainer._invalidateCachedTabs();
              // Then ensure all the tab open/pinning information is sent.
-@@ -3693,7 +3808,7 @@
+@@ -3504,6 +3626,9 @@
+         this.selectedTab = tabToSelect;
+         this.removeTab(leftoverTab);
+       }
++      else {
++        this.selectedTab._possibleEmptyTab = true; // Not needed, but just in case.
++      }
+ 
+       if (tabs.length > 1 || !tabs[0].selected) {
+         this._updateTabsAfterInsert();
+@@ -3693,7 +3818,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.
@@ -354,7 +371,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
          if (
            !bulkOrderedOpen &&
            ((openerTab &&
-@@ -3736,18 +3851,18 @@
+@@ -3736,18 +3861,18 @@
  
        // Ensure index is within bounds.
        if (tab.pinned) {
@@ -377,7 +394,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
          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 +4174,9 @@
+@@ -4059,6 +4184,9 @@
          return;
        }
  
@@ -387,7 +404,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
        this.removeTabs(selectedTabs);
      }
  
-@@ -4391,6 +4509,7 @@
+@@ -4391,6 +4519,7 @@
          skipSessionStore,
        } = {}
      ) {
@@ -395,7 +412,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
        if (UserInteraction.running("browser.tabs.opening", window)) {
          UserInteraction.finish("browser.tabs.opening", window);
        }
-@@ -4407,6 +4526,12 @@
+@@ -4407,6 +4536,12 @@
          TelemetryStopwatch.start("FX_TAB_CLOSE_TIME_NO_ANIM_MS", aTab);
        }
  
@@ -408,7 +425,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
        // Handle requests for synchronously removing an already
        // asynchronously closing tab.
        if (!animate && aTab.closing) {
-@@ -4421,7 +4546,9 @@
+@@ -4421,7 +4556,9 @@
        // frame created for it (for example, by updating the visually selected
        // state).
        let tabWidth = window.windowUtils.getBoundsWithoutFlushing(aTab).width;
@@ -419,7 +436,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
        if (
          !this._beginRemoveTab(aTab, {
            closeWindowFastpath: true,
-@@ -4435,7 +4562,6 @@
+@@ -4435,7 +4572,6 @@
          TelemetryStopwatch.cancel("FX_TAB_CLOSE_TIME_NO_ANIM_MS", aTab);
          return;
        }
@@ -427,7 +444,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
        let lockTabSizing =
          !this.tabContainer.verticalMode &&
          !aTab.pinned &&
-@@ -4574,14 +4700,14 @@
+@@ -4574,14 +4710,14 @@
          !!this.tabsInCollapsedTabGroups.length;
        if (
          aTab.visible &&
@@ -444,7 +461,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
  
          if (closeWindow) {
            // We've already called beforeunload on all the relevant tabs if we get here,
-@@ -4605,6 +4731,7 @@
+@@ -4605,6 +4741,7 @@
  
          newTab = true;
        }
@@ -452,18 +469,18 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
        aTab._endRemoveArgs = [closeWindow, newTab];
  
        // swapBrowsersAndCloseOther will take care of closing the window without animation.
-@@ -4645,9 +4772,7 @@
+@@ -4645,9 +4782,7 @@
        aTab._mouseleave();
  
        if (newTab) {
 -        this.addTrustedTab(BROWSER_NEW_TAB_URL, {
 -          skipAnimation: true,
 -        });
-+        ZenWorkspaces.selectEmptyTab();
++        ZenWorkspaces.selectEmptyTab(BROWSER_NEW_TAB_URL);
        } else {
          TabBarVisibility.update();
        }
-@@ -4776,6 +4901,8 @@
+@@ -4776,6 +4911,8 @@
          this.tabs[i]._tPos = i;
        }
  
@@ -472,7 +489,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
        if (!this._windowIsClosing) {
          if (wasPinned) {
            this.tabContainer._positionPinnedTabs();
-@@ -4994,7 +5121,7 @@
+@@ -4994,7 +5131,7 @@
          !excludeTabs.has(aTab.owner) &&
          Services.prefs.getBoolPref("browser.tabs.selectOwnerOnClose")
        ) {
@@ -481,7 +498,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
        }
  
        // Try to find a remaining tab that comes after the given tab
-@@ -5016,7 +5143,7 @@
+@@ -5016,7 +5153,7 @@
        }
  
        if (tab) {
@@ -490,7 +507,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
        }
  
        // If no qualifying visible tab was found, see if there is a tab in
-@@ -5434,10 +5561,10 @@
+@@ -5434,10 +5571,10 @@
        SessionStore.deleteCustomTabValue(aTab, "hiddenBy");
      }
  
@@ -503,7 +520,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
          aTab.selected ||
          aTab.closing ||
          // Tabs that are sharing the screen, microphone or camera cannot be hidden.
-@@ -5675,7 +5802,7 @@
+@@ -5675,7 +5812,7 @@
  
        // Don't allow mixing pinned and unpinned tabs.
        if (aTab.pinned) {
@@ -512,13 +529,11 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
        } else {
          aIndex = Math.max(aIndex, this.pinnedTabCount);
        }
-@@ -5684,11 +5811,18 @@
+@@ -5685,10 +5822,17 @@
-       }
  
        this._handleTabMove(aTab, () => {
--        let neighbor = this.tabs[aIndex];
+         let neighbor = this.tabs[aIndex];
 -        if (forceStandaloneTab && neighbor.group) {
-+        let neighbor = this.tabs.filter(tab => !tab.hasAttribute("zen-glance-tab"))[aIndex];
 +        const _tPos = aTab._tPos;
 +        if ((forceStandaloneTab && neighbor.group) || neighbor.group?.hasAttribute("split-view-group")) {
            neighbor = neighbor.group;
@@ -534,25 +549,27 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
            neighbor.after(aTab);
          } else {
            this.tabContainer.insertBefore(aTab, neighbor);
-@@ -5697,7 +5831,7 @@
+@@ -5697,7 +5841,7 @@
      }
  
      moveTabToGroup(aTab, aGroup) {
 -      if (aTab.pinned) {
-+      if (aTab.pinned != !!aGroup.pinned && !aTab.hasAttribute("zen-essential")) {
++      if (aTab.pinned != !!aGroup.pinned) {
          return;
        }
        if (aTab.group && aTab.group.id === aGroup.id) {
-@@ -5721,6 +5855,8 @@
+@@ -5721,6 +5865,10 @@
  
        moveActionCallback();
  
 +      ZenWorkspaces._makeSureEmptyTabIsLast();
++      gZenViewSplitter._maybeRemoveFakeBrowser(false);
++      gZenViewSplitter._canDrop = false;
 +
        // Clear tabs cache after moving nodes because the order of tabs may have
        // changed.
        this.tabContainer._invalidateCachedTabs();
-@@ -5771,7 +5907,7 @@
+@@ -5771,7 +5919,7 @@
          createLazyBrowser,
        };
  
@@ -561,7 +578,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
        if (aIndex < numPinned || (aTab.pinned && aIndex == numPinned)) {
          params.pinned = true;
        }
-@@ -7415,6 +7551,7 @@
+@@ -7415,6 +7563,7 @@
              aWebProgress.isTopLevel
            ) {
              this.mTab.setAttribute("busy", "true");
@@ -569,7 +586,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
              gBrowser._tabAttrModified(this.mTab, ["busy"]);
              this.mTab._notselectedsinceload = !this.mTab.selected;
            }
-@@ -8381,7 +8518,7 @@ var TabContextMenu = {
+@@ -8381,7 +8530,7 @@ var TabContextMenu = {
      );
      contextUnpinSelectedTabs.hidden =
        !this.contextTab.pinned || !multiselectionContext;
@@ -578,7 +595,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
      // Move Tab items
      let contextMoveTabOptions = document.getElementById(
        "context_moveTabOptions"
-@@ -8414,7 +8551,7 @@ var TabContextMenu = {
+@@ -8414,7 +8563,7 @@ var TabContextMenu = {
      let contextMoveTabToStart = document.getElementById("context_moveToStart");
      let isFirstTab =
        tabsToMove[0] == visibleTabs[0] ||
@@ -587,7 +604,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
      contextMoveTabToStart.disabled = isFirstTab && allSelectedTabsAdjacent;
  
      document.getElementById("context_openTabInWindow").disabled =
-@@ -8647,6 +8784,7 @@ var TabContextMenu = {
+@@ -8647,6 +8796,7 @@ var TabContextMenu = {
      if (this.contextTab.multiselected) {
        gBrowser.removeMultiSelectedTabs();
      } else {

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..9a288957781277246b66a911590a13e7231958d0 100644
+index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a84f01452 100644
 --- a/browser/components/tabbrowser/content/tabs.js
 +++ b/browser/components/tabbrowser/content/tabs.js
 @@ -94,7 +94,7 @@
@@ -11,7 +11,16 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
          }
          return true;
        };
-@@ -339,7 +339,7 @@
+@@ -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 @@
        // and we're not hitting the scroll buttons.
        if (
          event.button != 0 ||
@@ -20,7 +29,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
          event.composedTarget.localName == "toolbarbutton"
        ) {
          return;
-@@ -388,6 +388,7 @@
+@@ -388,6 +390,7 @@
              // Reset the "ignored click" flag
              target._ignoredCloseButtonClicks = false;
            }
@@ -28,7 +37,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
          }
  
          /* Protects from close-tab-button errant doubleclick:
-@@ -683,7 +684,7 @@
+@@ -683,7 +686,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
@@ -37,20 +46,25 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
          let tabsPerRow = 0;
          let position = 0;
          for (let pinnedTab of pinnedTabs) {
-@@ -883,6 +884,9 @@
+@@ -883,6 +886,10 @@
        }
  
        let draggedTab = event.dataTransfer.mozGetDataAt(TAB_DROP_TYPE, 0);
 +      if (draggedTab && effects === "move") {
 +        gZenPinnedTabManager.applyDragoverClass(event, draggedTab);
++        gZenViewSplitter.onBrowserDragEndToSplit(event);
 +      }
        if (
          (effects == "move" || effects == "copy") &&
          this == draggedTab.container &&
-@@ -996,6 +1000,14 @@
+@@ -996,6 +1003,18 @@
  
        this._tabDropIndicator.hidden = true;
        event.stopPropagation();
++      if (draggedTab?.hasAttribute("zen-has-splitted")) {
++        draggedTab.removeAttribute("zen-has-splitted");
++        draggedTab._visuallySelected = false;
++      }
 +      if (draggedTab && dropEffect == "move") {
 +        let moved = gZenPinnedTabManager.moveToAnotherTabContainerIfNecessary(event, movingTabs);
 +
@@ -62,7 +76,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
        if (draggedTab && dropEffect == "copy") {
          // copy the dropped tab (wherever it's from)
          let newIndex = this._getDropIndex(event);
-@@ -1034,10 +1046,11 @@
+@@ -1034,10 +1053,11 @@
            }
          } else {
            let pinned = draggedTab.pinned;
@@ -78,7 +92,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
            );
            let size = this.verticalMode ? "height" : "width";
            let screenAxis = this.verticalMode ? "screenY" : "screenX";
-@@ -1114,7 +1127,7 @@
+@@ -1114,7 +1134,7 @@
                let postTransitionCleanup = () => {
                  tab.removeAttribute("tabdrop-samewindow");
  
@@ -87,7 +101,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
                  if (dropIndex !== false) {
                    gBrowser.moveTabTo(tab, dropIndex);
                    if (!directionForward) {
-@@ -1122,7 +1135,7 @@
+@@ -1122,7 +1142,7 @@
                    }
                  }
                };
@@ -96,14 +110,23 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
                  postTransitionCleanup();
                } else {
                  let onTransitionEnd = transitionendEvent => {
-@@ -1279,13 +1292,23 @@
+@@ -1249,7 +1269,7 @@
+               return;
+             }
+           }
+-
++          if (gZenViewSplitter.handleTabDrop(event, urls, replace, inBackground)) return;
+           gBrowser.loadTabs(urls, {
+             inBackground,
+             replace,
+@@ -1279,13 +1299,23 @@
          return;
        }
  
 -      this._finishMoveTogetherSelectedTabs(draggedTab);
        this._finishAnimateTabMove();
  
-+      if (event.ctrlKey && !dt.mozUserCancelled && dt.dropEffect == "none" && !this._isCustomizing) {
++      if (!dt.mozUserCancelled && dt.dropEffect == "none" && !this._isCustomizing) {
 +        const moved = gZenViewSplitter.moveTabToSplitView(event, draggedTab);
 +        if (moved) {
 +          delete draggedTab._dragData;
@@ -122,7 +145,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
        ) {
          delete draggedTab._dragData;
          return;
-@@ -1517,7 +1540,7 @@
+@@ -1517,7 +1547,7 @@
      }
  
      get newTabButton() {
@@ -131,7 +154,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
      }
  
      get verticalMode() {
-@@ -1537,28 +1560,40 @@
+@@ -1537,28 +1567,40 @@
        if (this.#allTabs) {
          return this.#allTabs;
        }
@@ -180,7 +203,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
        return children.filter(node => node.tagName == "tab-group");
      }
  
-@@ -1579,7 +1614,7 @@
+@@ -1579,7 +1621,7 @@
       */
      get visibleTabs() {
        if (!this.#visibleTabs) {
@@ -189,7 +212,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
        }
        return this.#visibleTabs;
      }
-@@ -1613,10 +1648,8 @@
+@@ -1613,10 +1655,8 @@
          return this.#focusableItems;
        }
  
@@ -202,7 +225,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
  
        let focusableItems = [];
        for (let child of children) {
-@@ -1632,6 +1665,7 @@
+@@ -1632,6 +1672,7 @@
        }
  
        this.#focusableItems = [
@@ -210,7 +233,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
          ...verticalPinnedTabsContainer.children,
          ...focusableItems,
        ];
-@@ -1642,6 +1676,7 @@
+@@ -1642,6 +1683,7 @@
      _invalidateCachedTabs() {
        this.#allTabs = null;
        this._invalidateCachedVisibleTabs();
@@ -218,7 +241,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
      }
  
      _invalidateCachedVisibleTabs() {
-@@ -1656,8 +1691,8 @@
+@@ -1656,8 +1698,8 @@
      #isContainerVerticalPinnedExpanded(tab) {
        return (
          this.verticalMode &&
@@ -229,7 +252,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
        );
      }
  
-@@ -1672,7 +1707,7 @@
+@@ -1672,7 +1714,7 @@
  
        if (node == null) {
          // We have a container for non-tab elements at the end of the scrollbox.
@@ -238,7 +261,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
        }
  
        node.before(tab);
-@@ -1772,7 +1807,7 @@
+@@ -1772,7 +1814,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.
@@ -247,7 +270,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
            const newTab2 = this.newTabButton;
            const newTabVertical = document.getElementById(
              "vertical-tabs-newtab-button"
-@@ -1855,7 +1890,7 @@
+@@ -1855,7 +1897,7 @@
            let rect = ele => {
              return window.windowUtils.getBoundsWithoutFlushing(ele);
            };
@@ -256,7 +279,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
            if (tab && rect(tab).width <= this._tabClipWidth) {
              this.setAttribute("closebuttons", "activetab");
            } else {
-@@ -1867,10 +1902,12 @@
+@@ -1867,10 +1909,12 @@
  
      _handleTabSelect(aInstant) {
        let selectedTab = this.selectedItem;
@@ -269,7 +292,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
        selectedTab._notselectedsinceload = false;
      }
  
-@@ -1882,7 +1919,7 @@
+@@ -1882,7 +1926,7 @@
          return;
        }
  
@@ -278,7 +301,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
        if (!tabs.length) {
          return;
        }
-@@ -1918,7 +1955,7 @@
+@@ -1918,7 +1962,7 @@
          if (isEndTab && !this._hasTabTempMaxWidth) {
            return;
          }
@@ -287,7 +310,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
          // 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 +1970,7 @@
+@@ -1933,7 +1977,7 @@
          let tabsToReset = [];
          for (let i = numPinned; i < tabs.length; i++) {
            let tab = tabs[i];
@@ -296,7 +319,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
            if (!isEndTab) {
              // keep tabs the same width
              tab.style.transition = "none";
-@@ -1999,16 +2036,15 @@
+@@ -1999,16 +2043,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.
@@ -319,7 +342,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
          }
        }
  
-@@ -2016,9 +2052,7 @@
+@@ -2016,9 +2059,7 @@
      }
  
      _resetVerticalPinnedTabs() {
@@ -330,7 +353,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
  
        if (!verticalTabsContainer.children.length) {
          return;
-@@ -2031,8 +2065,8 @@
+@@ -2031,8 +2072,8 @@
      }
  
      _positionPinnedTabs() {
@@ -341,7 +364,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
        let absPositionHorizontalTabs =
          this.overflowing && tabs.length > numPinned && numPinned > 0;
  
-@@ -2041,7 +2075,7 @@
+@@ -2041,7 +2082,7 @@
  
        if (this.verticalMode) {
          this._updateVerticalPinnedTabs();
@@ -350,7 +373,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
          let layoutData = this._pinnedTabsLayoutCache;
          let uiDensity = document.documentElement.getAttribute("uidensity");
          if (!layoutData || layoutData.uiDensity != uiDensity) {
-@@ -2113,7 +2147,7 @@
+@@ -2113,7 +2154,7 @@
          return;
        }
  
@@ -359,7 +382,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
  
        let directionX = screenX > dragData.animLastScreenX;
        let directionY = screenY > dragData.animLastScreenY;
-@@ -2121,7 +2155,7 @@
+@@ -2121,7 +2162,7 @@
        dragData.animLastScreenX = screenX;
  
        let { width: tabWidth, height: tabHeight } =
@@ -368,7 +391,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
        let shiftSizeX = tabWidth * movingTabs.length;
        let shiftSizeY = tabHeight;
        dragData.tabWidth = tabWidth;
-@@ -2296,10 +2330,11 @@
+@@ -2296,10 +2337,11 @@
        }
  
        let pinned = draggedTab.pinned;
@@ -384,22 +407,20 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
        );
  
        if (this.#rtlMode) {
-@@ -2347,8 +2382,12 @@
+@@ -2348,7 +2390,11 @@
-         (lastMovingTabScreen + tabSize);
        translate = Math.min(Math.max(translate, firstBound), lastBound);
  
--      for (let tab of movingTabs) {
+       for (let tab of movingTabs) {
 -        tab.style.transform = `${translateAxis}(${translate}px)`;
-+      if (draggedTab.group?.hasAttribute("split-view-group")) {
++        if (tab.group?.hasAttribute("split-view-group")) {
-+        draggedTab.group.style.transform = `${translateAxis}(${translate}px)`;
++          tab.group.style.transform = `${translateAxis}(${translate}px)`;
-+      } else {
++        } else {
-+        for (let tab of movingTabs) {
 +          tab.style.transform = `${translateAxis}(${translate}px)`;
 +        }
        }
  
        dragData.translatePos = translate;
-@@ -2484,12 +2523,16 @@
+@@ -2484,12 +2530,16 @@
        // Shift background tabs to leave a gap where the dragged tab
        // would currently be dropped.
        for (let tab of tabs) {
@@ -417,7 +438,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
          if (tab.group?.tabs[0] == tab) {
            tab.group.style.setProperty(
              "--tabgroup-dragover-transform",
-@@ -2541,8 +2584,9 @@
+@@ -2541,8 +2591,9 @@
        );
      }
  
@@ -429,7 +450,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
          return;
        }
  
-@@ -2553,6 +2597,7 @@
+@@ -2553,6 +2604,7 @@
          tab.style.transform = "";
          if (tab.group) {
            tab.group.style.removeProperty("--tabgroup-dragover-transform");
@@ -437,7 +458,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
          }
          tab.removeAttribute("dragover-createGroup");
        }
-@@ -2604,7 +2649,7 @@
+@@ -2604,7 +2656,7 @@
            movingTab._moveTogetherSelectedTabsData.newIndex = movingTabNewIndex;
            movingTab._moveTogetherSelectedTabsData.animate = false;
          };
@@ -446,7 +467,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
            postTransitionCleanup();
          } else {
            let onTransitionEnd = transitionendEvent => {
-@@ -2707,9 +2752,9 @@
+@@ -2707,9 +2759,9 @@
        function newIndex(aTab, index) {
          // Don't allow mixing pinned and unpinned tabs.
          if (aTab.pinned) {
@@ -458,7 +479,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
        }
      }
  
-@@ -2793,7 +2838,7 @@
+@@ -2793,7 +2845,7 @@
      }
  
      _notifyBackgroundTab(aTab) {

src/browser/themes/shared/tabbrowser/tabs-css.patch

@@ -1,5 +1,5 @@
 diff --git a/browser/themes/shared/tabbrowser/tabs.css b/browser/themes/shared/tabbrowser/tabs.css
-index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d69857a4933bc 100644
+index 01815c2114a627e5cac183c702bd82f1bd4f58f8..f47bd9c8490cd8fc4bb686ad0012ce70ab4bac8f 100644
 --- a/browser/themes/shared/tabbrowser/tabs.css
 +++ b/browser/themes/shared/tabbrowser/tabs.css
 @@ -31,7 +31,7 @@
@@ -37,16 +37,60 @@ index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d6985
  
      &::before {
        position: absolute;
-@@ -502,7 +501,7 @@
+@@ -437,6 +436,7 @@
+ .tab-icon-image {
+   -moz-context-properties: fill, stroke;
+   fill: currentColor;
++  border-radius: 4px;
+ 
+   /* Apply crisp rendering for favicons at exactly 2dppx resolution */
+   @media (resolution: 2dppx) {
+@@ -502,7 +502,7 @@
    z-index: 1; /* Overlay tab title */
  
    #tabbrowser-tabs[orient=vertical] & {
 -    top: 7px;
-+    top: 0px;
++    top: -7px;
    }
  
    &[crashed] {
-@@ -617,14 +616,14 @@
+@@ -510,7 +510,7 @@
+   }
+ 
+   #tabbrowser-tabs[orient="vertical"]:not([expanded]) &:not([crashed]),
+-  &[pinned]:not([crashed]) {
++  &:not([crashed]) {
+     &[soundplaying] {
+       list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-playing-small.svg");
+     }
+@@ -540,7 +540,7 @@
+       background-image: linear-gradient(var(--audio-overlay-extra-background)),
+                         linear-gradient(var(--toolbox-bgcolor));
+       -moz-context-properties: fill;
+-      fill: var(--tab-selected-textcolor);
++      fill: var(--tab-selected-textcolor) !important;
+       color-scheme: var(--tab-selected-color-scheme);
+       border-radius: var(--border-radius-circle);
+ 
+@@ -572,7 +572,7 @@
+   }
+ 
+   #tabbrowser-tabs[orient="vertical"]:not([expanded]) &:is([soundplaying], [muted], [activemedia-blocked]),
+-  &[pinned]:is([soundplaying], [muted], [activemedia-blocked]),
++  &:is([soundplaying], [muted], [activemedia-blocked]),
+   &[crashed] {
+     display: revert;
+   }
+@@ -586,7 +586,7 @@
+   --button-min-height-small: 24px;
+   --button-border-radius: var(--border-radius-small);
+ 
+-  #tabbrowser-tabs:is([orient="vertical"][expanded], [orient="horizontal"]) &:not([pinned]):not([crashed]) {
++  #tabbrowser-tabs:is([orient="horizontal"]) &:not([pinned]):not([crashed]) {
+     &:is([soundplaying], [muted], [activemedia-blocked]) {
+       display: block;
+     }
+@@ -617,14 +617,14 @@
    }
  
    &[textoverflow] {
@@ -65,7 +109,7 @@ index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d6985
        direction: rtl;
        mask-image: linear-gradient(to right, transparent, black var(--tab-label-mask-size));
      }
-@@ -1170,7 +1169,7 @@
+@@ -1170,7 +1170,7 @@
    }
  }
  
@@ -74,7 +118,7 @@ index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d6985
  #vertical-tabs-newtab-button {
    appearance: none;
    min-height: var(--tab-min-height);
-@@ -1181,7 +1180,7 @@
+@@ -1181,7 +1181,7 @@
    margin-inline: var(--tab-inner-inline-margin);
  
    #tabbrowser-tabs[orient="vertical"]:not([expanded]) & > .toolbarbutton-text {
@@ -83,7 +127,7 @@ index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d6985
    }
  
    &:hover {
-@@ -1205,7 +1204,7 @@
+@@ -1205,7 +1205,7 @@
   * flex container. #tabs-newtab-button is a child of the arrowscrollbox where
   * we don't want a gap (between tabs), so we have to add some margin.
   */
@@ -92,7 +136,7 @@ index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d6985
    margin-block: var(--tab-block-margin);
  }
  
-@@ -1229,7 +1228,6 @@
+@@ -1229,7 +1229,6 @@
  }
  
  #vertical-pinned-tabs-container {
@@ -100,7 +144,7 @@ index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d6985
    display: none;
    grid-template-columns: repeat(auto-fit, minmax(var(--tab-pinned-min-width-expanded), auto));
    overflow-y: auto;
-@@ -1439,7 +1437,7 @@
+@@ -1439,7 +1438,7 @@
    toolbarbutton:not(#firefox-view-button),
    toolbarpaletteitem:not(#wrapper-firefox-view-button)
  ) ~ #tabbrowser-tabs {
@@ -109,7 +153,7 @@ index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d6985
    padding-inline-start: calc(var(--tab-overflow-pinned-tabs-width) + 2px);
    margin-inline-start: 2px;
  }
-@@ -1473,7 +1471,6 @@ toolbar:not(#TabsToolbar) #firefox-view-button {
+@@ -1473,7 +1472,6 @@ toolbar:not(#TabsToolbar) #firefox-view-button {
    list-style-image: url(chrome://global/skin/icons/plus.svg);
  }
  

src/browser/themes/shared/urlbar-searchbar-css.patch

@@ -1,7 +1,16 @@
 diff --git a/browser/themes/shared/urlbar-searchbar.css b/browser/themes/shared/urlbar-searchbar.css
-index 45aa61f93d354da432eceb1c276466609a6910d0..6585158b855af19689e86ef6a833f63736ec225c 100644
+index 574f83af7fa49ddcdff6711ca8b1d3bed1a35e0c..c2e8cb8b37438176db07a47e1e975ae1aea42252 100644
 --- a/browser/themes/shared/urlbar-searchbar.css
 +++ b/browser/themes/shared/urlbar-searchbar.css
+@@ -5,7 +5,7 @@
+ @namespace html url("http://www.w3.org/1999/xhtml");
+ 
+ :root {
+-  --urlbar-container-padding: 1px;
++  --urlbar-container-padding: 4px;
+   --urlbar-margin-inline: 5px;
+   --urlbar-padding-block: 4px;
+ }
 @@ -291,7 +291,9 @@
  }
  

src/browser/themes/shared/urlbarView-css.patch

@@ -0,0 +1,13 @@
+diff --git a/browser/themes/shared/urlbarView.css b/browser/themes/shared/urlbarView.css
+index 1c654e053ca8a014d7c2a9fc076cf15afba9c903..f2f63809d0a36db2774755db2b782f41a9bbe82b 100644
+--- a/browser/themes/shared/urlbarView.css
++++ b/browser/themes/shared/urlbarView.css
+@@ -20,7 +20,7 @@
+ 
+   --urlbarView-small-font-size: 0.85em;
+ 
+-  --urlbarView-results-padding: 4px;
++  --urlbarView-results-padding: 8px;
+   --urlbarView-row-gutter: 2px;
+   --urlbarView-item-inline-padding: var(--urlbar-icon-padding);
+   --urlbarView-item-block-padding: 6px;

src/browser/themes/shared/zen-icons/icons.css

@@ -4,7 +4,8 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 
-.subviewbutton {
+.subviewbutton,
+#zen-welcome-start-button {
   -moz-context-properties: fill, fill-opacity !important;
   fill: currentColor !important;
 }
@@ -23,6 +24,10 @@
   list-style-image: url('move-tab.svg') !important;
 }
 
+.zen-tab-unsplit-button {
+  list-style-image: url('unpin.svg') !important;
+}
+
 #forward-button,
 #zen-sidebar-web-panel-forward {
   list-style-image: url('forward.svg') !important;
@@ -381,7 +386,8 @@
   list-style-image: url('arrow-down.svg') !important;
 }
 
-.zen-workspace-actions-reorder-icon {
+.zen-workspace-actions-reorder-icon,
+.zen-tab-rearrange-button {
   list-style-image: url('drag-indicator.svg') !important;
 }
 
@@ -1140,6 +1146,41 @@ menupopup > menuitem:is([type='checkbox']) .menu-iconic-left {
 }
 
 #toolbar-context-toggle-vertical-tabs,
-#toolbar-context-customize-sidebar {
+#toolbar-context-customize-sidebar,
-  display: none;
+#sidebarRevampSeparator {
+  display: none !important;
+}
+
+#zen-media-playpause-button {
+  list-style-image: url('media-play.svg') !important;
+}
+
+#zen-media-controls-toolbar.playing #zen-media-playpause-button {
+  list-style-image: url('media-pause.svg') !important;
+}
+
+#zen-media-nexttrack-button {
+  list-style-image: url('media-next.svg') !important;
+}
+
+#zen-media-previoustrack-button {
+  list-style-image: url('media-previous.svg') !important;
+}
+
+#zen-media-controls-toolbar[muted] #zen-media-mute-button {
+  list-style-image: url('media-mute.svg') !important;
+}
+
+#zen-media-mute-button {
+  list-style-image: url('media-unmute.svg') !important;
+}
+
+#zen-media-close-button {
+  list-style-image: url('close.svg') !important;
+}
+
+#zen-media-controls-toolbar:hover {
+  #zen-media-focus-button {
+    list-style-image: url('screen.svg') !important;
+  }
 }

src/browser/themes/shared/zen-icons/jar.inc.mn

@@ -66,9 +66,11 @@
   skin/classic/browser/zen-icons/manage.svg                      (../shared/zen-icons/lin/manage.svg) 
   skin/classic/browser/zen-icons/media-loop.svg                      (../shared/zen-icons/lin/media-loop.svg) 
   skin/classic/browser/zen-icons/media-mute.svg                      (../shared/zen-icons/lin/media-mute.svg) 
+  skin/classic/browser/zen-icons/media-next.svg                      (../shared/zen-icons/lin/media-next.svg) 
   skin/classic/browser/zen-icons/media-pause.svg                      (../shared/zen-icons/lin/media-pause.svg) 
   skin/classic/browser/zen-icons/media-pip.svg                      (../shared/zen-icons/lin/media-pip.svg) 
   skin/classic/browser/zen-icons/media-play.svg                      (../shared/zen-icons/lin/media-play.svg) 
+  skin/classic/browser/zen-icons/media-previous.svg                      (../shared/zen-icons/lin/media-previous.svg) 
   skin/classic/browser/zen-icons/media-speed.svg                      (../shared/zen-icons/lin/media-speed.svg) 
   skin/classic/browser/zen-icons/media-unmute.svg                      (../shared/zen-icons/lin/media-unmute.svg) 
   skin/classic/browser/zen-icons/menu-bar.svg                      (../shared/zen-icons/lin/menu-bar.svg) 
@@ -198,9 +200,11 @@
   skin/classic/browser/zen-icons/manage.svg                      (../shared/zen-icons/lin/manage.svg) 
   skin/classic/browser/zen-icons/media-loop.svg                      (../shared/zen-icons/lin/media-loop.svg) 
   skin/classic/browser/zen-icons/media-mute.svg                      (../shared/zen-icons/lin/media-mute.svg) 
+  skin/classic/browser/zen-icons/media-next.svg                      (../shared/zen-icons/lin/media-next.svg) 
   skin/classic/browser/zen-icons/media-pause.svg                      (../shared/zen-icons/lin/media-pause.svg) 
   skin/classic/browser/zen-icons/media-pip.svg                      (../shared/zen-icons/lin/media-pip.svg) 
   skin/classic/browser/zen-icons/media-play.svg                      (../shared/zen-icons/lin/media-play.svg) 
+  skin/classic/browser/zen-icons/media-previous.svg                      (../shared/zen-icons/lin/media-previous.svg) 
   skin/classic/browser/zen-icons/media-speed.svg                      (../shared/zen-icons/lin/media-speed.svg) 
   skin/classic/browser/zen-icons/media-unmute.svg                      (../shared/zen-icons/lin/media-unmute.svg) 
   skin/classic/browser/zen-icons/menu-bar.svg                      (../shared/zen-icons/lin/menu-bar.svg) 
@@ -330,9 +334,11 @@
   skin/classic/browser/zen-icons/manage.svg                      (../shared/zen-icons/lin/manage.svg) 
   skin/classic/browser/zen-icons/media-loop.svg                      (../shared/zen-icons/lin/media-loop.svg) 
   skin/classic/browser/zen-icons/media-mute.svg                      (../shared/zen-icons/lin/media-mute.svg) 
+  skin/classic/browser/zen-icons/media-next.svg                      (../shared/zen-icons/lin/media-next.svg) 
   skin/classic/browser/zen-icons/media-pause.svg                      (../shared/zen-icons/lin/media-pause.svg) 
   skin/classic/browser/zen-icons/media-pip.svg                      (../shared/zen-icons/lin/media-pip.svg) 
   skin/classic/browser/zen-icons/media-play.svg                      (../shared/zen-icons/lin/media-play.svg) 
+  skin/classic/browser/zen-icons/media-previous.svg                      (../shared/zen-icons/lin/media-previous.svg) 
   skin/classic/browser/zen-icons/media-speed.svg                      (../shared/zen-icons/lin/media-speed.svg) 
   skin/classic/browser/zen-icons/media-unmute.svg                      (../shared/zen-icons/lin/media-unmute.svg) 
   skin/classic/browser/zen-icons/menu-bar.svg                      (../shared/zen-icons/lin/menu-bar.svg) 

src/browser/themes/shared/zen-icons/lin/accessibility.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><circle cx="9" cy="2.25" r="1.5" data-color="color-2"></circle><line x1="7.25" y1="16.5" x2="7.25" y2="6.24"></line><line x1="10.75" y1="6.24" x2="10.75" y2="16.5"></line><path d="M2.75,5.75c1.751,.3,3.86,.531,6.25,.531,1.777,0,3.894-.128,6.25-.531"></path><line x1="7.25" y1="11.25" x2="10.75" y2="11.25"></line></g></svg>
+<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"><circle cx="9" cy="2.25" r="1.5" data-color="color-2"></circle><line x1="7.25" y1="16.5" x2="7.25" y2="6.24"></line><line x1="10.75" y1="6.24" x2="10.75" y2="16.5"></line><path d="M2.75,5.75c1.751,.3,3.86,.531,6.25,.531,1.777,0,3.894-.128,6.25-.531"></path><line x1="7.25" y1="11.25" x2="10.75" y2="11.25"></line></g></svg>

src/browser/themes/shared/zen-icons/lin/add-to-dictionary.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M14.181,3.257c-.221-.865-.998-1.507-1.931-1.507H5.75c-1.105,0-2,.896-2,2v12.5l5.25-3.5,5.25,3.5v-3"></path><line x1="14.25" y1="5.75" x2="14.25" y2="10.75" data-color="color-2"></line><line x1="16.75" y1="8.25" x2="11.75" y2="8.25" data-color="color-2"></line></g></svg>
+<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="M14.181,3.257c-.221-.865-.998-1.507-1.931-1.507H5.75c-1.105,0-2,.896-2,2v12.5l5.25-3.5,5.25,3.5v-3"></path><line x1="14.25" y1="5.75" x2="14.25" y2="10.75" data-color="color-2"></line><line x1="16.75" y1="8.25" x2="11.75" y2="8.25" data-color="color-2"></line></g></svg>

src/browser/themes/shared/zen-icons/lin/arrow-down.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="15.25 6.5 9 12.75 2.75 6.5"></polyline></g></svg>
+<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"><polyline points="15.25 6.5 9 12.75 2.75 6.5"></polyline></g></svg>

src/browser/themes/shared/zen-icons/lin/arrow-left.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="11.5 15.25 5.25 9 11.5 2.75"></polyline></g></svg>
+<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"><polyline points="11.5 15.25 5.25 9 11.5 2.75"></polyline></g></svg>

src/browser/themes/shared/zen-icons/lin/arrow-right.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="6.5 2.75 12.75 9 6.5 15.25"></polyline></g></svg>
+<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"><polyline points="6.5 2.75 12.75 9 6.5 15.25"></polyline></g></svg>

src/browser/themes/shared/zen-icons/lin/arrow-up.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="2.75 11.5 9 5.25 15.25 11.5"></polyline></g></svg>
+<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"><polyline points="2.75 11.5 9 5.25 15.25 11.5"></polyline></g></svg>

src/browser/themes/shared/zen-icons/lin/audio-save.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><line x1="5.75" y1="7.25" x2="5.75" y2="13.75"></line><line x1="14.75" y1="5.75" x2="14.75" y2="12.25"></line><path d="m8.6399,3.0186l4.9461-.8246c.61-.102,1.164.368,1.164.986v2.57l-9,1.5"></path><circle cx="3.75" cy="13.75" r="2"></circle><circle cx="12.75" cy="12.25" r="2"></circle><line x1="3.75" y1="1.25" x2="3.75" y2="6.25" data-color="color-2"></line><line x1="6.25" y1="3.75" x2="1.25" y2="3.75" data-color="color-2"></line></g></svg>
+<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"><line x1="5.75" y1="7.25" x2="5.75" y2="13.75"></line><line x1="14.75" y1="5.75" x2="14.75" y2="12.25"></line><path d="m8.6399,3.0186l4.9461-.8246c.61-.102,1.164.368,1.164.986v2.57l-9,1.5"></path><circle cx="3.75" cy="13.75" r="2"></circle><circle cx="12.75" cy="12.25" r="2"></circle><line x1="3.75" y1="1.25" x2="3.75" y2="6.25" data-color="color-2"></line><line x1="6.25" y1="3.75" x2="1.25" y2="3.75" data-color="color-2"></line></g></svg>

src/browser/themes/shared/zen-icons/lin/autoplay-media-blocked.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M9.25,8.75V1.75s1.303,2.048,3.427,3.573"></path><path d="M5.406,16.13c.268,.078,.551,.12,.844,.12,1.657,0,3-1.343,3-3,0-.293-.042-.577-.12-.844"></path><path d="M7.485,10.515c-.377-.17-.795-.265-1.235-.265-1.657,0-3,1.343-3,3,0,.44,.095,.858,.265,1.235"></path><line x1="2" y1="16" x2="16" y2="2" data-color="color-2"></line></g></svg>
+<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="M9.25,8.75V1.75s1.303,2.048,3.427,3.573"></path><path d="M5.406,16.13c.268,.078,.551,.12,.844,.12,1.657,0,3-1.343,3-3,0-.293-.042-.577-.12-.844"></path><path d="M7.485,10.515c-.377-.17-.795-.265-1.235-.265-1.657,0-3,1.343-3,3,0,.44,.095,.858,.265,1.235"></path><line x1="2" y1="16" x2="16" y2="2" data-color="color-2"></line></g></svg>

src/browser/themes/shared/zen-icons/lin/autoplay-media.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M9.75,13.25V1.75s1.75,2.75,4.5,4.25" data-color="color-2"></path><circle cx="6.75" cy="13.25" r="3"></circle></g></svg>
+<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="M9.75,13.25V1.75s1.75,2.75,4.5,4.25" data-color="color-2"></path><circle cx="6.75" cy="13.25" r="3"></circle></g></svg>

src/browser/themes/shared/zen-icons/lin/back.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><line x1="2.75" y1="9" x2="15.25" y2="9" data-color="color-2"></line><polyline points="7 13.25 2.75 9 7 4.75"></polyline></g></svg>
+<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"><line x1="2.75" y1="9" x2="15.25" y2="9" data-color="color-2"></line><polyline points="7 13.25 2.75 9 7 4.75"></polyline></g></svg>

src/browser/themes/shared/zen-icons/lin/bookmark-hollow.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M12.25,16.25l-4.75-3.5-4.75,3.5V6.75c0-1.105,.895-2,2-2h5.5c1.105,0,2,.895,2,2v9.5Z"></path><path d="M6.781,2c.287-.159,.617-.25,.969-.25h5.5c1.105,0,2,.895,2,2V13.25" data-color="color-2"></path></g></svg>
+<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="M12.25,16.25l-4.75-3.5-4.75,3.5V6.75c0-1.105,.895-2,2-2h5.5c1.105,0,2,.895,2,2v9.5Z"></path><path d="M6.781,2c.287-.159,.617-.25,.969-.25h5.5c1.105,0,2,.895,2,2V13.25" data-color="color-2"></path></g></svg>

src/browser/themes/shared/zen-icons/lin/bookmark-star-on-tray.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M12.25,16.25l-4.75-3.5-4.75,3.5V6.75c0-1.105,.895-2,2-2h5.5c1.105,0,2,.895,2,2v9.5Z"></path><path d="M6.781,2c.287-.159,.617-.25,.969-.25h5.5c1.105,0,2,.895,2,2V13.25" data-color="color-2"></path></g></svg>
+<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="M12.25,16.25l-4.75-3.5-4.75,3.5V6.75c0-1.105,.895-2,2-2h5.5c1.105,0,2,.895,2,2v9.5Z"></path><path d="M6.781,2c.287-.159,.617-.25,.969-.25h5.5c1.105,0,2,.895,2,2V13.25" data-color="color-2"></path></g></svg>

src/browser/themes/shared/zen-icons/lin/bookmark.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M14.25,16.25l-5.25-3.5-5.25,3.5V3.75c0-1.105,.895-2,2-2h6.5c1.105,0,2,.895,2,2v12.5Z"></path><polyline points="6.497 8 8.106 9.5 11.503 5" data-color="color-2"></polyline></g></svg>
+<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="M14.25,16.25l-5.25-3.5-5.25,3.5V3.75c0-1.105,.895-2,2-2h6.5c1.105,0,2,.895,2,2v12.5Z"></path><polyline points="6.497 8 8.106 9.5 11.503 5" data-color="color-2"></polyline></g></svg>

src/browser/themes/shared/zen-icons/lin/camera-blocked.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M7.285,14.25h6.965c1.105,0,2-.895,2-2V5.75c0-.138-.014-.273-.041-.403"></path><path d="M14.25,3.75h-2.25l-.507-1.351c-.146-.39-.519-.649-.936-.649h-3.114c-.417,0-.79,.259-.936,.649l-.507,1.351H3.75c-1.105,0-2,.895-2,2v6.5c0,1.105,.895,2,2,2"></path><path d="M7.055,10.945c-.498-.498-.805-1.185-.805-1.945,0-1.519,1.231-2.75,2.75-2.75,.759,0,1.447,.308,1.945,.805" data-color="color-2"></path><circle cx="4.25" cy="6.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><line x1="2" y1="16" x2="16" y2="2" data-color="color-2"></line></g></svg>
+<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="M7.285,14.25h6.965c1.105,0,2-.895,2-2V5.75c0-.138-.014-.273-.041-.403"></path><path d="M14.25,3.75h-2.25l-.507-1.351c-.146-.39-.519-.649-.936-.649h-3.114c-.417,0-.79,.259-.936,.649l-.507,1.351H3.75c-1.105,0-2,.895-2,2v6.5c0,1.105,.895,2,2,2"></path><path d="M7.055,10.945c-.498-.498-.805-1.185-.805-1.945,0-1.519,1.231-2.75,2.75-2.75,.759,0,1.447,.308,1.945,.805" data-color="color-2"></path><circle cx="4.25" cy="6.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><line x1="2" y1="16" x2="16" y2="2" data-color="color-2"></line></g></svg>

src/browser/themes/shared/zen-icons/lin/camera.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M14.25,3.75h-2.25l-.507-1.351c-.146-.39-.519-.649-.936-.649h-3.114c-.417,0-.79,.259-.936,.649l-.507,1.351H3.75c-1.105,0-2,.895-2,2v6.5c0,1.105,.895,2,2,2H14.25c1.105,0,2-.895,2-2V5.75c0-1.105-.895-2-2-2Z"></path><circle cx="9" cy="9" r="2.75" data-color="color-2"></circle><circle cx="4.25" cy="6.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle></g></svg>
+<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="M14.25,3.75h-2.25l-.507-1.351c-.146-.39-.519-.649-.936-.649h-3.114c-.417,0-.79,.259-.936,.649l-.507,1.351H3.75c-1.105,0-2,.895-2,2v6.5c0,1.105,.895,2,2,2H14.25c1.105,0,2-.895,2-2V5.75c0-1.105-.895-2-2-2Z"></path><circle cx="9" cy="9" r="2.75" data-color="color-2"></circle><circle cx="4.25" cy="6.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle></g></svg>

src/browser/themes/shared/zen-icons/lin/canvas.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M3.762,14.989l6.074-6.075c.781-.781,2.047-.781,2.828,0l2.586,2.586" data-color="color-2"></path><rect x="2.75" y="2.75" width="12.5" height="12.5" rx="2" ry="2"></rect><circle cx="6.25" cy="7.25" r="1.25" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle></g></svg>
+<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="M3.762,14.989l6.074-6.075c.781-.781,2.047-.781,2.828,0l2.586,2.586" data-color="color-2"></path><rect x="2.75" y="2.75" width="12.5" height="12.5" rx="2" ry="2"></rect><circle cx="6.25" cy="7.25" r="1.25" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle></g></svg>

src/browser/themes/shared/zen-icons/lin/checkmark.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="2.75 9.5 6.5 13.25 15.25 4.5"></polyline></g></svg>
+<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"><polyline points="2.75 9.5 6.5 13.25 15.25 4.5"></polyline></g></svg>

src/browser/themes/shared/zen-icons/lin/chevron.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="9.75 4.75 14 9 9.75 13.25" data-color="color-2"></polyline><polyline points="5 4.75 9.25 9 5 13.25"></polyline></g></svg>
+<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"><polyline points="9.75 4.75 14 9 9.75 13.25" data-color="color-2"></polyline><polyline points="5 4.75 9.25 9 5 13.25"></polyline></g></svg>

src/browser/themes/shared/zen-icons/lin/close-all.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M1.75,16.25v-.5c0-1.105,.895-2,2-2H14.25c1.105,0,2,.895,2,2v.5"></path><path d="M3.75,11.25c0-.828,.672-1.5,1.5-1.5h7.5c.828,0,1.5,.672,1.5,1.5"></path><polyline points="11.5 4.75 9 7.25 6.5 4.75" data-color="color-2"></polyline><line x1="9" y1="7" x2="9" y2="1.75" data-color="color-2"></line></g></svg>
+<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="M1.75,16.25v-.5c0-1.105,.895-2,2-2H14.25c1.105,0,2,.895,2,2v.5"></path><path d="M3.75,11.25c0-.828,.672-1.5,1.5-1.5h7.5c.828,0,1.5,.672,1.5,1.5"></path><polyline points="11.5 4.75 9 7.25 6.5 4.75" data-color="color-2"></polyline><line x1="9" y1="7" x2="9" y2="1.75" data-color="color-2"></line></g></svg>

src/browser/themes/shared/zen-icons/lin/close.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><line x1="14" y1="4" x2="4" y2="14" data-color="color-2"></line><line x1="4" y1="4" x2="14" y2="14"></line></g></svg>
+<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"><line x1="14" y1="4" x2="4" y2="14" data-color="color-2"></line><line x1="4" y1="4" x2="14" y2="14"></line></g></svg>

src/browser/themes/shared/zen-icons/lin/container-tab.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M6.75,2.75h7c1.105,0,2,.895,2,2v1.5" data-color="color-2"></path><line x1="11.25" y1="2.75" x2="11.25" y2="6.25" data-color="color-2"></line><line x1="14.75" y1="11.75" x2="14.75" y2="16.75" data-color="color-2"></line><path d="M15.75,9.461v-3.211H6.75V2.75h-2.5c-1.105,0-2,.895-2,2V13.25c0,1.105,.895,2,2,2h5.711"></path><line x1="17.25" y1="14.25" x2="12.25" y2="14.25" data-color="color-2"></line></g></svg>
+<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="M6.75,2.75h7c1.105,0,2,.895,2,2v1.5" data-color="color-2"></path><line x1="11.25" y1="2.75" x2="11.25" y2="6.25" data-color="color-2"></line><line x1="14.75" y1="11.75" x2="14.75" y2="16.75" data-color="color-2"></line><path d="M15.75,9.461v-3.211H6.75V2.75h-2.5c-1.105,0-2,.895-2,2V13.25c0,1.105,.895,2,2,2h5.711"></path><line x1="17.25" y1="14.25" x2="12.25" y2="14.25" data-color="color-2"></line></g></svg>

src/browser/themes/shared/zen-icons/lin/customize.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="10.25 12.75 12.75 15.25 15.25 12.75" data-color="color-2"></polyline><polyline points="15.25 5.25 12.75 2.75 10.25 5.25" data-color="color-2"></polyline><line x1="12.75" y1="15" x2="12.75" y2="3" data-color="color-2"></line><rect x="2.75" y="10.25" width="5" height="5" rx="1" ry="1"></rect><rect x="2.75" y="2.75" width="5" height="5" rx="1" ry="1"></rect></g></svg>
+<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"><polyline points="10.25 12.75 12.75 15.25 15.25 12.75" data-color="color-2"></polyline><polyline points="15.25 5.25 12.75 2.75 10.25 5.25" data-color="color-2"></polyline><line x1="12.75" y1="15" x2="12.75" y2="3" data-color="color-2"></line><rect x="2.75" y="10.25" width="5" height="5" rx="1" ry="1"></rect><rect x="2.75" y="2.75" width="5" height="5" rx="1" ry="1"></rect></g></svg>

src/browser/themes/shared/zen-icons/lin/desktop-notification-blocked.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M13.368,4.632c-.726-1.694-2.408-2.882-4.368-2.882h0c-2.623,0-4.75,2.127-4.75,4.75v4.75c0,1.105-.895,2-2,2h2.5"></path><path d="M8,13.25h7.75c-1.105,0-2-.895-2-2v-3.5"></path><path d="M10.588,15.185c-.095-.117-.237-.185-.388-.185h-2.399c-.151,0-.293,.068-.388,.185-.095,.117-.132,.271-.101,.418,.173,.822,.868,1.397,1.689,1.397s1.516-.575,1.689-1.397c.031-.147-.006-.301-.101-.418Z" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></path><line x1="2" y1="16" x2="16" y2="2" data-color="color-2"></line></g></svg>
+<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.368,4.632c-.726-1.694-2.408-2.882-4.368-2.882h0c-2.623,0-4.75,2.127-4.75,4.75v4.75c0,1.105-.895,2-2,2h2.5"></path><path d="M8,13.25h7.75c-1.105,0-2-.895-2-2v-3.5"></path><path d="M10.588,15.185c-.095-.117-.237-.185-.388-.185h-2.399c-.151,0-.293,.068-.388,.185-.095,.117-.132,.271-.101,.418,.173,.822,.868,1.397,1.689,1.397s1.516-.575,1.689-1.397c.031-.147-.006-.301-.101-.418Z" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></path><line x1="2" y1="16" x2="16" y2="2" data-color="color-2"></line></g></svg>

src/browser/themes/shared/zen-icons/lin/desktop-notification.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M15.75,13.25c-1.105,0-2-.895-2-2V6.5c0-2.623-2.127-4.75-4.75-4.75h0c-2.623,0-4.75,2.127-4.75,4.75v4.75c0,1.105-.895,2-2,2H15.75Z"></path><path d="M10.588,15.185c-.095-.117-.237-.185-.388-.185h-2.399c-.151,0-.293,.068-.388,.185-.095,.117-.132,.271-.101,.418,.173,.822,.868,1.397,1.689,1.397s1.516-.575,1.689-1.397c.031-.147-.006-.301-.101-.418Z" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></path></g></svg>
+<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="M15.75,13.25c-1.105,0-2-.895-2-2V6.5c0-2.623-2.127-4.75-4.75-4.75h0c-2.623,0-4.75,2.127-4.75,4.75v4.75c0,1.105-.895,2-2,2H15.75Z"></path><path d="M10.588,15.185c-.095-.117-.237-.185-.388-.185h-2.399c-.151,0-.293,.068-.388,.185-.095,.117-.132,.271-.101,.418,.173,.822,.868,1.397,1.689,1.397s1.516-.575,1.689-1.397c.031-.147-.006-.301-.101-.418Z" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></path></g></svg>

src/browser/themes/shared/zen-icons/lin/developer.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><circle cx="9" cy="12.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><circle cx="11.75" cy="12.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><circle cx="6.25" cy="12.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><path d="M6.25,15.25h-1c-1.105,0-2-.895-2-2v-2.625c0-.897-.728-1.625-1.625-1.625,.897,0,1.625-.728,1.625-1.625v-2.625c0-1.105,.895-2,2-2h1"></path><path d="M11.75,15.25h1c1.105,0,2-.895,2-2v-2.625c0-.897,.728-1.625,1.625-1.625-.897,0-1.625-.728-1.625-1.625v-2.625c0-1.105-.895-2-2-2h-1"></path></g></svg>
+<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"><circle cx="9" cy="12.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><circle cx="11.75" cy="12.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><circle cx="6.25" cy="12.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><path d="M6.25,15.25h-1c-1.105,0-2-.895-2-2v-2.625c0-.897-.728-1.625-1.625-1.625,.897,0,1.625-.728,1.625-1.625v-2.625c0-1.105,.895-2,2-2h1"></path><path d="M11.75,15.25h1c1.105,0,2-.895,2-2v-2.625c0-.897,.728-1.625,1.625-1.625-.897,0-1.625-.728-1.625-1.625v-2.625c0-1.105-.895-2-2-2h-1"></path></g></svg>

src/browser/themes/shared/zen-icons/lin/downloads.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M15.25,11.75v1.5c0,1.105-.895,2-2,2H4.75c-1.105,0-2-.895-2-2v-1.5"></path><polyline points="5.5 6.75 9 10.25 12.5 6.75" data-color="color-2"></polyline><line x1="9" y1="10.25" x2="9" y2="2.75" data-color="color-2"></line></g></svg>
+<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="M15.25,11.75v1.5c0,1.105-.895,2-2,2H4.75c-1.105,0-2-.895-2-2v-1.5"></path><polyline points="5.5 6.75 9 10.25 12.5 6.75" data-color="color-2"></polyline><line x1="9" y1="10.25" x2="9" y2="2.75" data-color="color-2"></line></g></svg>

src/browser/themes/shared/zen-icons/lin/drag-indicator.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="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><circle cx="6.75" cy="9" r=".5" fill="currentColor" data-color="color-2"></circle><circle cx="6.75" cy="3.75" r=".5" fill="currentColor"></circle><circle cx="6.75" cy="14.25" r=".5" fill="currentColor"></circle><circle cx="11.25" cy="9" r=".5" fill="currentColor" data-color="color-2"></circle><circle cx="11.25" cy="3.75" r=".5" fill="currentColor"></circle><circle cx="11.25" cy="14.25" r=".5" fill="currentColor"></circle></g></svg>
+<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"><circle cx="6.75" cy="9" r=".5" fill="currentColor" data-color="color-2"></circle><circle cx="6.75" cy="3.75" r=".5" fill="currentColor"></circle><circle cx="6.75" cy="14.25" r=".5" fill="currentColor"></circle><circle cx="11.25" cy="9" r=".5" fill="currentColor" data-color="color-2"></circle><circle cx="11.25" cy="3.75" r=".5" fill="currentColor"></circle><circle cx="11.25" cy="14.25" r=".5" fill="currentColor"></circle></g></svg>