Sass Updates

sass/framework/_main.sass

@@ -0,0 +1,61 @@
+// layout/_main.sass
+
+@use '../abstracts' as *
+@use '../base' as *
+
+// Main page wrapper: Centered flex
+#page .container
+  display: flex
+  padding: 0
+  justify-content: center
+  align-items: flex-start
+  padding-top: space('lg')
+
+// Article content: Fixed width, no shrink
+article
+  width: 1140px
+  flex-shrink: 0
+  padding: 3rem
+  margin: 0
+  background-color: $bg-dark
+  border: 1px solid $bg-darker
+
+ul#leftnav
+  width: 320px
+  flex-shrink: 0
+  list-style: none
+  padding: 0
+  margin: 0 space('xl') 0 0 // Right margin preserved (overrides the 0 for other sides)
+  background-color: $bg-dark
+  border: 1px solid $bg-darker
+
+#leftnav li
+  border-bottom: 1px solid color('border-light')
+
+  &:last-child
+    border-bottom: none
+
+#leftnav a
+  display: block
+  padding: space('sm') space('md')  // Consistent spacing
+  text-decoration: none
+  color: $text-light  // Theme text
+
+  &:hover, &:focus
+    background-color: rgba($accent-light, 0.1)  // Green hover tint
+    color: $accent-light  // Accent on hover
+    border-radius: 4px
+
+// Responsive: Stack on mobile (add to themes/ for media queries)
+@media (max-width: 1280px)  // Your xl breakpoint
+  #page .container
+    flex-direction: column
+    align-items: center
+
+  article, #leftnav
+    width: 100%
+    max-width: 900px
+    margin: space('md') 0
+
+  #leftnav
+    margin-right: 0