diff --git a/Theme/ElegantFin-theme-nightly.css b/Theme/ElegantFin-theme-nightly.css
index e31c720..acedb34 100644
--- a/Theme/ElegantFin-theme-nightly.css
+++ b/Theme/ElegantFin-theme-nightly.css
@@ -130,7 +130,7 @@ html {
 }
 
 .layout-mobile {
-    --itemColumnGap: 0em;
+    --itemColumnGap: 0;
     --sidePadding: 5%;
 }
 
@@ -748,9 +748,21 @@ html {
 }
 
 .card {
+    --effectiveWidth: calc((99vw - (var(--sidePadding) * 2)));
+    --cardWidth: calc(var(--effectiveWidth) / var(--cardCount) - var(--itemColumnGap));
     box-sizing: border-box;
     width: var(--cardWidth) !important;
-    --cardWidth: calc((99vw - (var(--sidePadding) * 2)) / var(--cardCount) - var(--itemColumnGap));
+}
+
+.layout-mobile .card {
+    --cardWidth: calc(var(--effectiveWidth) / var(--cardCount));
+}
+
+/* this makes the card sizes smaller when phone is in landscape mode */
+@media (orientation: landscape) and (max-height: 40em) {
+    .layout-mobile .card {
+        --effectiveWidth: calc((65vw - (var(--sidePadding) * 2)));
+    }
 }
 
 .detailPageWrapperContainer {
@@ -1199,13 +1211,6 @@ html {
     }
 }
 
-/* this makes the card sizes smaller when phone is in landscape mode */
-@media (orientation: landscape) and (max-height: 40em) {
-    .layout-mobile .card {
-        --cardWidth: calc((65vw - (var(--sidePadding) * 2)) / var(--cardCount) - var(--itemColumnGap));
-    }
-}
-
 h2 {
     font-size: 1.25em;
 }