diff --git a/src/browser/base/content/ZenUIManager.mjs b/src/browser/base/content/ZenUIManager.mjs
index 6b4226e74..08f481493 100644
--- a/src/browser/base/content/ZenUIManager.mjs
+++ b/src/browser/base/content/ZenUIManager.mjs
@@ -250,7 +250,7 @@ var gZenUIManager = {
     const toast = this._createToastElement(messageId, options);
     this._toastContainer.removeAttribute('hidden');
     this._toastContainer.appendChild(toast);
-    await this.motion.animate(toast, { opacity: [0, 1], scale: [0.8, 1] }, { type: 'spring', bounce: 0.5, duration: 0.5 });
+    await this.motion.animate(toast, { opacity: [0, 1], scale: [0.8, 1] }, { type: 'spring', bounce: 0.5, duration: 0.7 });
     await new Promise((resolve) => setTimeout(resolve, 3000));
     await this.motion.animate(toast, { opacity: [1, 0], scale: [1, 0.9] }, { duration: 0.2, bounce: 0 });
     const toastHeight = toast.getBoundingClientRect().height;
diff --git a/src/browser/base/content/zen-styles/zen-popup.css b/src/browser/base/content/zen-styles/zen-popup.css
index 8bb7e3367..721664d97 100644
--- a/src/browser/base/content/zen-styles/zen-popup.css
+++ b/src/browser/base/content/zen-styles/zen-popup.css
@@ -360,9 +360,10 @@ menuitem {
   & .zen-toast {
     padding: 0.9rem 0.8rem;
     border-radius: 12px;
-    background: linear-gradient(170deg, light-dark(rgb(187, 187, 187), rgb(240, 240, 240)) -40%, var(--zen-primary-color) 140%);
+    background: linear-gradient(170deg, var(--zen-primary-color) -40%, color-mix(in srgb, var(--zen-primary-color) 85%, #0f0f0f 15%));
     color: var(--button-primary-color);
-    box-shadow: 0 0 16px 3px rgba(0, 0, 0, 0.1);
+    box-shadow: 0 0 14px 3px rgba(0, 0, 0, 0.05);
+    border: 1px solid rgba(0, 0, 0, 0.1);
     display: flex;
     font-weight: 500;
     gap: 5px;