diff --git a/src/sidebars/sidebar-2/index.scss b/src/sidebars/sidebar-2/index.scss
index 92831d7..3de5f6c 100644
--- a/src/sidebars/sidebar-2/index.scss
+++ b/src/sidebars/sidebar-2/index.scss
@@ -1,19 +1,23 @@
 @import "normalize.css";
 
+:root {
+  --content-width: 80ch;
+  --sidebar-width: 300px;
+}
+
 body,
 html {
   height: 100%;
   font-size: 18px;
 }
 
-$content-width: 80ch;
 $content-padding: 16px;
 
 $bleed-ratio: 0.1;
 $details-bg: black;
 $details-padding: $content-padding;
 
-$bleed-size: $content-width * $bleed-ratio;
+$bleed-size: calc(var(--content-width) * $bleed-ratio);
 
 .hero {
   height: 50vh;
@@ -31,7 +35,7 @@ $bleed-size: $content-width * $bleed-ratio;
   }
 
   .details {
-    width: $content-width;
+    width: var(--content-width);
     max-width: 100%;
     margin: 1rem auto;
 
@@ -46,17 +50,17 @@ $bleed-size: $content-width * $bleed-ratio;
 
 main {
   display: flex;
-  gap: 1rem;
+  gap: 0.5rem;
 }
 
 .spacer {
   flex-grow: 1;
   flex-shrink: 10;
-  flex-basis: 200px;
+  flex-basis: var(--sidebar-width);
 }
 
 .content-wrapper {
-  width: $content-width;
+  width: var(--content-width);
   max-width: 100%;
   display: flex;
   flex-direction: column;
@@ -64,8 +68,8 @@ main {
   margin-right: $bleed-size;
 
   .bleed {
-    margin-left: -$bleed-size;
-    margin-right: -$bleed-size;
+    margin-left: calc($bleed-size * -1);
+    margin-right: calc($bleed-size * -1);
   }
 
   .inset {
@@ -77,17 +81,24 @@ main {
 .sidebar {
   flex-grow: 1;
   flex-shrink: 10;
-  flex-basis: 200px;
-  min-width: 300px;
-  background-color: orange;
+  flex-basis: var(--sidebar-width);
+  min-width: var(--sidebar-width);
 
   .sidebar-inner {
     position: sticky;
-    top: 0;
+    top: 1rem;
+    margin: 1rem;
+    font-size: 16px;
   }
 }
 
-@media (max-width: 1250px) {
+@media (max-width: 1250px) and (min-width: 1150px) {
+  :root {
+    --content-width: 70ch;
+  }
+}
+
+@media (max-width: 1150px) {
   main {
     flex-direction: column-reverse;
     align-items: center;
@@ -100,7 +111,7 @@ main {
 
   .sidebar {
     flex-basis: unset;
-    width: $content-width;
+    width: var(--content-width);
     max-width: 100%;
 
     .sidebar-inner {