no-bug: Simplify panel structure

src/zen/boosts/zen-advanced-color-options.css

@@ -7,7 +7,6 @@
 #zen-boost-advanced-color-options-panel {
   color-scheme: light;
   -zen-window-transform-origin: 50% 0%;
-  padding: 8px 8px;
 
   & p {
     color: #3a3a3b;
@@ -24,14 +23,10 @@
     margin-top: 10px;
   }
 
-  & separator {
-    height: 24px !important;
-  }
-
-  @media (-moz-platform: macos) {
-    &[animate="open"] {
-      animation: 0.4 zen-color-options-panel-animation-macos cubic-bezier(0.14, 1.43, 0.56, 1.01) forwards !important;
-    }
+  &::part(content) {
+    display: flex;
+    flex-direction: column;
+    gap: 24px;
   }
 }
 
@@ -47,6 +42,3 @@
   background-color: #cbcad0;
 }
 
-#zen-boost-advanced-color-options-container {
-  flex-direction: column;
-}

src/zen/boosts/zen-boost-editor.inc.xhtml

@@ -113,16 +113,18 @@
 
   <popupset id="mainPopupSet">
     <panel type="arrow" popupalign="topmiddle" id="zen-boost-advanced-color-options-panel">
-      <html:div flex="1" id="zen-boost-advanced-color-options-container">
+      <vbox>
         <p data-l10n-id="zen-bootst-color-contrast"></p>
         <html:input id="zen-boost-color-contrast" type="range" min="0" max="1" value="0.5" step="0.01"/>
-        <separator />
+      </vbox>
+      <vbox>
         <p data-l10n-id="zen-bootst-color-brightness"></p>
         <html:input id="zen-boost-color-brightness" type="range" min="0" max="1" value="0.5" step="0.01"/>
-        <separator />
+      </vbox>
+      <vbox>
         <p data-l10n-id="zen-bootst-color-original-saturation"></p>
         <html:input id="zen-boost-color-saturation" type="range" min="0" max="1" value="0.5" step="0.01"/>
-      </html:div>
+      </vbox>
     </panel>
   </popupset>