fix: update animations and styles for macOS compatibility and improve contrast in popup elements

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

@@ -18,14 +18,20 @@
   }
 }
 
-@keyframes zen-jello-animation-alt {
+@keyframes zen-jello-animation-macos {
   0% {
-    transform: scale3d(0.8, 0.8, 0.8);
+    opacity: 0;
+    -moz-window-transform: scale(0.3);
   }
 
-  to {
+  50% {
     opacity: 1;
-    transform: scale3d(1, 1, 1);
+    -moz-window-transform: scale(1.04);
+  }
+
+  100% {
+    opacity: 1;
+    -moz-window-transform: scale(1);
   }
 }
 

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

@@ -261,7 +261,7 @@
   transform: translateX(-50%);
   & .separator,
   & #PanelUI-zen-gradient-generator-color-toggle-algo {
-    background: light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1));
+    background: light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.5));
   }
 
   & button {

src/browser/base/content/zen-styles/zen-panel-ui.css

@@ -3,14 +3,17 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
-panel[type='arrow'][animate][animate='open']::part(content) {
-  animation: zen-jello-animation 0.35s ease;
-
+panel[type='arrow'][animate='open'] {
   @media (-moz-platform: macos) {
-    animation: zen-jello-animation-alt 0.2s ease-out;
+    animation: zen-jello-animation-macos 0.4s ease-out;
+  }
+  @media not(-moz-platform: macos) {
+    &::part(content) {
+      animation: zen-jello-animation 0.35s ease;
+    }
   }
 }
 
-panel[type='arrow'][animate]:not([animate='open'])::part(content) {
+panel[type='arrow'][animate]:not([animate='open']) {
   animation: zen-jello-out-animation 0.3s ease-in-out;
 }