diff --git a/__tests__/option.test.scss b/__tests__/option.test.scss
index 5cf2a6d..c86389f 100644
--- a/__tests__/option.test.scss
+++ b/__tests__/option.test.scss
@@ -32,6 +32,48 @@
       }
     }
   }
+
+  @include test("simple `and`") {
+    @include assert {
+      @include output {
+        @include option.Option("userChrome.tab.photon" "userChrome.padding.photon") {
+          @include example;
+        }
+      }
+      @include expect {
+        @supports (-moz-bool-pref("userChrome.tab.photon") and -moz-bool-pref("userChrome.padding.photon")) {
+          @include example;
+        }
+      }
+    }
+  }
+
+  @include test("multiple `and`") {
+    @include assert {
+      @include output {
+        @include option.Option("userChrome.tab.photon" "userChrome.padding.photon", "userChrome.tab.box_shadow") {
+          @include example;
+        }
+        @include option.Option("userChrome.tab.photon" "userChrome.padding.photon", "userChrome.tab.box_shadow", "userChrome.icon.panel_full") {
+          @include example;
+        }
+        @include option.Option("userChrome.tab.photon" "userChrome.padding.photon", "userChrome.tab.box_shadow" "userChrome.icon.panel_full") {
+          @include example;
+        }
+      }
+      @include expect {
+        @supports (-moz-bool-pref("userChrome.tab.photon") and -moz-bool-pref("userChrome.padding.photon")) or -moz-bool-pref("userChrome.tab.box_shadow") {
+          @include example;
+        }
+        @supports (-moz-bool-pref("userChrome.tab.photon") and -moz-bool-pref("userChrome.padding.photon")) or -moz-bool-pref("userChrome.tab.box_shadow") or -moz-bool-pref("userChrome.icon.panel_full") {
+          @include example;
+        }
+        @supports (-moz-bool-pref("userChrome.tab.photon") and -moz-bool-pref("userChrome.padding.photon")) or (-moz-bool-pref("userChrome.tab.box_shadow") and -moz-bool-pref("userChrome.icon.panel_full")) {
+          @include example;
+        }
+      }
+    }
+  }
 }
 
 @include test-module("If not exist pref [mx]") {
@@ -50,5 +92,61 @@
     }
   }
 
-  // Need multiple test
+  @include test("multiple") {
+    @include assert {
+      @include output {
+        @include option.NotOption("userChrome.tab.photon", "userChrome.padding.photon") {
+          @include example;
+        }
+      }
+      @include expect {
+        @supports (not -moz-bool-pref("userChrome.tab.photon")) or (not -moz-bool-pref("userChrome.padding.photon")) {
+          @include example;
+        }
+      }
+    }
+  }
+
+  // @include test("simple `and`") {
+  //   @include assert {
+  //     @include output {
+  //       @include option.NotOption("userChrome.tab.photon" "userChrome.padding.photon") {
+  //         @include example;
+  //       }
+  //     }
+  //     @include expect {
+  //       // top level parens
+  //       @supports ((not -moz-bool-pref("userChrome.tab.photon")) and (not -moz-bool-pref("userChrome.padding.photon"))) {
+  //         @include example;
+  //       }
+  //     }
+  //   }
+  // }
+
+  @include test("multiple `and`") {
+    @include assert {
+      @include output {
+        @include option.NotOption("userChrome.tab.photon" "userChrome.padding.photon", "userChrome.tab.box_shadow") {
+          @include example;
+        }
+        @include option.NotOption("userChrome.tab.photon" "userChrome.padding.photon", "userChrome.tab.box_shadow", "userChrome.icon.panel_full") {
+          @include example;
+        }
+        @include option.NotOption("userChrome.tab.photon" "userChrome.padding.photon", "userChrome.tab.box_shadow" "userChrome.icon.panel_full") {
+          @include example;
+        }
+      }
+      @include expect {
+        @supports ((not -moz-bool-pref("userChrome.tab.photon")) and (not -moz-bool-pref("userChrome.padding.photon"))) or (not -moz-bool-pref("userChrome.tab.box_shadow")) {
+          @include example;
+        }
+        @supports ((not -moz-bool-pref("userChrome.tab.photon")) and (not -moz-bool-pref("userChrome.padding.photon"))) or (not -moz-bool-pref("userChrome.tab.box_shadow")) or (not -moz-bool-pref("userChrome.icon.panel_full")) {
+          @include example;
+        }
+        @supports ((not -moz-bool-pref("userChrome.tab.photon")) and (not -moz-bool-pref("userChrome.padding.photon"))) or ((not -moz-bool-pref("userChrome.tab.box_shadow")) and (not -moz-bool-pref("userChrome.icon.panel_full"))) {
+          @include example;
+        }
+      }
+    }
+  }
 }
diff --git a/css/leptonChrome.css b/css/leptonChrome.css
index af1d133..5f0a15b 100644
--- a/css/leptonChrome.css
+++ b/css/leptonChrome.css
@@ -4402,7 +4402,8 @@
     }
     @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") {
       @media screen and (max-width: 1100px) {
-        @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") or not -moz-bool-pref("userChrome.hidden.tabbar") {
+        @supports (not -moz-bool-pref("userChrome.tabbar.on_bottom")) or
+          (not -moz-bool-pref("userChrome.hidden.tabbar")) {
           :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
             --uc-window-drag-space-pre: 0px;
             --uc-window-control-space: 0px;
@@ -7825,7 +7826,8 @@
     display: block !important;
     visibility: visible !important;
   }
-} /*= Url View - Move icon to left =============================================*/
+}
+/*= Url View - Move icon to left =============================================*/
 @supports -moz-bool-pref("userChrome.urlView.move_icon_to_left") {
   .urlbarView-type-icon {
     min-width: 16px !important;
diff --git a/css/leptonContent.css b/css/leptonContent.css
index 3c89e7e..6ad5f53 100644
--- a/css/leptonContent.css
+++ b/css/leptonContent.css
@@ -242,7 +242,8 @@
         }
       }
     }
-  } /** Activity Stream - Menu Icons ********************************************/
+  }
+  /** Activity Stream - Menu Icons ********************************************/
   @supports -moz-bool-pref("userChrome.icon.context_menu") {
     .context-menu-list .context-menu-item button {
       padding-inline-start: 0 !important;
diff --git a/src/utils/_option.scss b/src/utils/_option.scss
index b23fac6..cab454e 100644
--- a/src/utils/_option.scss
+++ b/src/utils/_option.scss
@@ -1,13 +1,56 @@
-@use "each";
+@function _prefix($separator, $i) {
+  @if $i != 1 {
+    @return " " + $separator + " ";
+  }
+  @return "";
+}
+@function _pref($option) {
+  @return "-moz-bool-pref(\"#{$option}\")";
+}
+@function _not($str, $positive) {
+  @return if($positive, $str, "(not " + $str + ")");
+}
+
+@function _getOption($optionNames, $positive: true) {
+  $result: "";
+  @for $i from 1 through length($optionNames) {
+    $option: nth($optionNames, $i);
+    $separator: if(
+      list-separator($optionNames) == "comma", "or", if(
+        list-separator($optionNames) == "space", "and", null
+      )
+    );
+    $result: $result + _prefix($separator, $i);
+
+    @if type-of($option) == "list" {
+      $result: $result + "(" + _getOption($option, $positive) + ")";
+    }
+    @else {
+      $result: $result +  _not(_pref($option), $positive);
+    }
+  }
+  @return $result;
+}
+@function _optionWrapper($optionNames, $positive: true) {
+  // Test warning for top level `not`
+  @if length($optionNames) == 1 {
+    $option: nth($optionNames, 1);
+    @if not (type-of($option) == "list") {
+      $option: _pref($option);
+      @return if($positive, $option, "not " + $option);
+    }
+  }
+  @return _getOption($optionNames, $positive);
+}
 
 @mixin Option($optionNames...) {
-  @include each.AtEach("supports", $optionNames, "-moz-bool-pref", ("separator": " or ", "quoted": true)) {
+  @supports #{_optionWrapper($optionNames)} {
     @content;
   }
 }
 
 @mixin NotOption($optionNames...) {
-  @include each.AtEach("supports", $optionNames, "not -moz-bool-pref", ("separator": " or ", "quoted": true)) {
+  @supports #{_optionWrapper($optionNames, false)} {
     @content;
   }
 }