diff --git a/quartz/styles/custom.scss b/quartz/styles/custom.scss
index 70e9ba505..3adf9b147 100644
--- a/quartz/styles/custom.scss
+++ b/quartz/styles/custom.scss
@@ -1,4 +1,5 @@
 @use "./base.scss";
+@use "./variables.scss" as *;
 
 @font-face {
   font-family: "Monaspace Neon";
@@ -150,14 +151,18 @@ ul {
 }
 
 .page > #quartz-body .sidebar.left {
-  border-radius: 1rem;
-  border: 2px solid var(--darkgray);
-  top: 1rem;
-  height: calc(100vh - 2rem);
-  margin-bottom: 1rem;
-  align-content: flex-start;
-  box-shadow: 8px 6px 0 0 var(--gray);
-  transition: all .3s ease-in;
+  @media all and not ($mobile) {
+    border-radius: 1rem;
+    border: 2px solid var(--gray);
+    top: 1rem;
+    height: calc(100vh - 2rem);
+    margin-bottom: 1rem;
+    align-content: flex-start;
+    box-shadow: 8px 6px 0 0 var(--gray);
+    transition-property: border, box-shadow;
+    transition-duration: .3s;
+    transition-timing-function: ease-in;
+  }
 }
 [saved-theme="dark"] .page > #quartz-body .sidebar.left:hover {
   border: 2px solid #e9edfa;