Two dimensional fix

3 files changed, 69 insertions, 69 deletions

diff --git a/test/expected/test-10.css b/test/expected/test-10.css
index 9998292..7286288 100644
--- a/test/expected/test-10.css
+++ b/test/expected/test-10.css
@@ -4,7 +4,7 @@
   font-size: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-1 {
     font-size: 32px;
   }
@@ -14,7 +14,7 @@
   font-size: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-2 {
     font-size: 32px;
   }
@@ -24,7 +24,7 @@
   font-size: calc(16px + 2vmin) !important;
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-3 {
     font-size: 32px !important;
   }
@@ -34,7 +34,7 @@
   font-size: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-4 {
     font-size: 32px;
   }
@@ -53,7 +53,7 @@
     font-size: calc(15.2px + 1.6vmin);
     min-width: 0vw;
   }
-  @media (min-width: 50rem), (min-height: 50rem) {
+  @media (min-width: 50rem) and (min-height: 50rem) {
     .selector-7 {
       font-size: 28px;
     }
@@ -64,7 +64,7 @@
   flex: 0 999 calc(112px + 50vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-8 {
     flex: 0 999 512px;
   }
@@ -74,7 +74,7 @@
   padding: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-9 {
     padding: 32px;
   }
@@ -84,7 +84,7 @@
   padding: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-10 {
     padding: 32px;
   }
@@ -94,7 +94,7 @@
   padding-top: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-11 {
     padding-top: 32px;
   }
@@ -104,7 +104,7 @@
   padding-right: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-12 {
     padding-right: 32px;
   }
@@ -114,7 +114,7 @@
   padding-bottom: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-13 {
     padding-bottom: 32px;
   }
@@ -124,7 +124,7 @@
   padding-left: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-14 {
     padding-left: 32px;
   }
@@ -134,7 +134,7 @@
   margin: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-15 {
     margin: 32px;
   }
@@ -144,7 +144,7 @@
   margin-top: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-16 {
     margin-top: 32px;
   }
@@ -154,7 +154,7 @@
   margin-right: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-17 {
     margin-right: 32px;
   }
@@ -164,7 +164,7 @@
   margin-bottom: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-18 {
     margin-bottom: 32px;
   }
@@ -174,7 +174,7 @@
   margin-left: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-19 {
     margin-left: 32px;
   }
@@ -184,7 +184,7 @@
   margin: calc(16px + 2vmin) calc(19.2px + 3.6vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-20 {
     margin: 32px 48px;
   }
@@ -194,7 +194,7 @@
   margin: calc(16px + 2vmin) calc(19.2px + 3.6vmin) !important;
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-21 {
     margin: 32px 48px !important;
   }
@@ -208,7 +208,7 @@
   margin: 0 calc(19.2px + 3.6vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-23 {
     margin: 0 48px;
   }
@@ -218,7 +218,7 @@
   box-shadow: 0 0 calc(16px + 2vmin) #f00, 0 0 calc(19.2px + 3.6vmin) #0f0;
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-24 {
     box-shadow: 0 0 32px #f00, 0 0 48px #0f0;
   }
@@ -228,7 +228,7 @@
   --value: calc(19.2px + 3.6vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-25 {
     --value: 48px;
   }
@@ -242,7 +242,7 @@
   margin: calc(-19.2px - 3.6vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-27 {
     margin: -48px;
   }
diff --git a/test/expected/test-8.css b/test/expected/test-8.css
index 88ddfe2..c802713 100644
--- a/test/expected/test-8.css
+++ b/test/expected/test-8.css
@@ -3,7 +3,7 @@
   width: 300px;
   font-size: calc(1.325rem + 0.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-1 {
     font-size: 2rem;
   }
@@ -12,7 +12,7 @@
 .selector-2 {
   font-size: calc(1.325rem + 0.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-2 {
     font-size: 2rem;
   }
@@ -21,7 +21,7 @@
 .selector-3 {
   font-size: calc(1.325rem + 0.9vmin) !important;
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-3 {
     font-size: 2rem !important;
   }
@@ -30,7 +30,7 @@
 .selector-4 {
   font-size: calc(1.325rem + 0.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-4 {
     font-size: 2rem;
   }
@@ -48,7 +48,7 @@
   .selector-7 {
     font-size: calc(1.3rem + 0.6vmin);
   }
-  @media (min-width: 1200px), (min-height: 1200px) {
+  @media (min-width: 1200px) and (min-height: 1200px) {
     .selector-7 {
       font-size: 1.75rem;
     }
@@ -58,7 +58,7 @@
 .selector-8 {
   flex: 0 999 calc(4.325rem + 36.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-8 {
     flex: 0 999 32rem;
   }
@@ -67,7 +67,7 @@
 .selector-9 {
   padding: calc(1.325rem + 0.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-9 {
     padding: 2rem;
   }
@@ -76,7 +76,7 @@
 .selector-10 {
   padding: calc(1.325rem + 0.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-10 {
     padding: 2rem;
   }
@@ -85,7 +85,7 @@
 .selector-11 {
   padding-top: calc(1.325rem + 0.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-11 {
     padding-top: 2rem;
   }
@@ -94,7 +94,7 @@
 .selector-12 {
   padding-right: calc(1.325rem + 0.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-12 {
     padding-right: 2rem;
   }
@@ -103,7 +103,7 @@
 .selector-13 {
   padding-bottom: calc(1.325rem + 0.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-13 {
     padding-bottom: 2rem;
   }
@@ -112,7 +112,7 @@
 .selector-14 {
   padding-left: calc(1.325rem + 0.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-14 {
     padding-left: 2rem;
   }
@@ -121,7 +121,7 @@
 .selector-15 {
   margin: calc(1.325rem + 0.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-15 {
     margin: 2rem;
   }
@@ -130,7 +130,7 @@
 .selector-16 {
   margin-top: calc(1.325rem + 0.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-16 {
     margin-top: 2rem;
   }
@@ -139,7 +139,7 @@
 .selector-17 {
   margin-right: calc(1.325rem + 0.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-17 {
     margin-right: 2rem;
   }
@@ -148,7 +148,7 @@
 .selector-18 {
   margin-bottom: calc(1.325rem + 0.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-18 {
     margin-bottom: 2rem;
   }
@@ -157,7 +157,7 @@
 .selector-19 {
   margin-left: calc(1.325rem + 0.9vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-19 {
     margin-left: 2rem;
   }
@@ -166,7 +166,7 @@
 .selector-20 {
   margin: calc(1.325rem + 0.9vmin) calc(1.425rem + 2.1vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-20 {
     margin: 2rem 3rem;
   }
@@ -175,7 +175,7 @@
 .selector-21 {
   margin: calc(1.325rem + 0.9vmin) calc(1.425rem + 2.1vmin) !important;
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-21 {
     margin: 2rem 3rem !important;
   }
@@ -188,7 +188,7 @@
 .selector-23 {
   margin: 0 calc(1.425rem + 2.1vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-23 {
     margin: 0 3rem;
   }
@@ -198,7 +198,7 @@
   box-shadow: 0 0 calc(1.325rem + 0.9vmin) #f00,
     0 0 calc(1.425rem + 2.1vmin) #0f0;
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-24 {
     box-shadow: 0 0 2rem #f00, 0 0 3rem #0f0;
   }
@@ -207,7 +207,7 @@
 .selector-25 {
   --value: calc(1.425rem + 2.1vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-25 {
     --value: 3rem;
   }
@@ -220,7 +220,7 @@
 .selector-27 {
   margin: calc(-1.425rem - 2.1vmin);
 }
-@media (min-width: 1200px), (min-height: 1200px) {
+@media (min-width: 1200px) and (min-height: 1200px) {
   .selector-27 {
     margin: -3rem;
   }
diff --git a/test/expected/test-9.css b/test/expected/test-9.css
index 9998292..7286288 100644
--- a/test/expected/test-9.css
+++ b/test/expected/test-9.css
@@ -4,7 +4,7 @@
   font-size: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-1 {
     font-size: 32px;
   }
@@ -14,7 +14,7 @@
   font-size: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-2 {
     font-size: 32px;
   }
@@ -24,7 +24,7 @@
   font-size: calc(16px + 2vmin) !important;
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-3 {
     font-size: 32px !important;
   }
@@ -34,7 +34,7 @@
   font-size: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-4 {
     font-size: 32px;
   }
@@ -53,7 +53,7 @@
     font-size: calc(15.2px + 1.6vmin);
     min-width: 0vw;
   }
-  @media (min-width: 50rem), (min-height: 50rem) {
+  @media (min-width: 50rem) and (min-height: 50rem) {
     .selector-7 {
       font-size: 28px;
     }
@@ -64,7 +64,7 @@
   flex: 0 999 calc(112px + 50vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-8 {
     flex: 0 999 512px;
   }
@@ -74,7 +74,7 @@
   padding: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-9 {
     padding: 32px;
   }
@@ -84,7 +84,7 @@
   padding: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-10 {
     padding: 32px;
   }
@@ -94,7 +94,7 @@
   padding-top: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-11 {
     padding-top: 32px;
   }
@@ -104,7 +104,7 @@
   padding-right: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-12 {
     padding-right: 32px;
   }
@@ -114,7 +114,7 @@
   padding-bottom: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-13 {
     padding-bottom: 32px;
   }
@@ -124,7 +124,7 @@
   padding-left: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-14 {
     padding-left: 32px;
   }
@@ -134,7 +134,7 @@
   margin: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-15 {
     margin: 32px;
   }
@@ -144,7 +144,7 @@
   margin-top: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-16 {
     margin-top: 32px;
   }
@@ -154,7 +154,7 @@
   margin-right: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-17 {
     margin-right: 32px;
   }
@@ -164,7 +164,7 @@
   margin-bottom: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-18 {
     margin-bottom: 32px;
   }
@@ -174,7 +174,7 @@
   margin-left: calc(16px + 2vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-19 {
     margin-left: 32px;
   }
@@ -184,7 +184,7 @@
   margin: calc(16px + 2vmin) calc(19.2px + 3.6vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-20 {
     margin: 32px 48px;
   }
@@ -194,7 +194,7 @@
   margin: calc(16px + 2vmin) calc(19.2px + 3.6vmin) !important;
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-21 {
     margin: 32px 48px !important;
   }
@@ -208,7 +208,7 @@
   margin: 0 calc(19.2px + 3.6vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-23 {
     margin: 0 48px;
   }
@@ -218,7 +218,7 @@
   box-shadow: 0 0 calc(16px + 2vmin) #f00, 0 0 calc(19.2px + 3.6vmin) #0f0;
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-24 {
     box-shadow: 0 0 32px #f00, 0 0 48px #0f0;
   }
@@ -228,7 +228,7 @@
   --value: calc(19.2px + 3.6vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-25 {
     --value: 48px;
   }
@@ -242,7 +242,7 @@
   margin: calc(-19.2px - 3.6vmin);
   min-width: 0vw;
 }
-@media (min-width: 50rem), (min-height: 50rem) {
+@media (min-width: 50rem) and (min-height: 50rem) {
   .selector-27 {
     margin: -48px;
   }