diff --git a/src/design-system/layout/Sidebar/Sidebar.module.css b/src/design-system/layout/Sidebar/Sidebar.module.css
index 90dd339..e6e0546 100644
--- a/src/design-system/layout/Sidebar/Sidebar.module.css
+++ b/src/design-system/layout/Sidebar/Sidebar.module.css
@@ -389,6 +389,62 @@
   color: var(--amber);
 }
 
+/* ── Section groups (top/bottom positioning) ───────────────────────────── */
+
+.sectionGroup {
+  flex: 0 1 auto;
+  overflow-y: auto;
+  min-height: 0;
+  scrollbar-width: thin;
+  scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
+}
+
+.sectionGroup::-webkit-scrollbar {
+  width: 4px;
+}
+
+.sectionGroup::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.sectionGroup::-webkit-scrollbar-thumb {
+  background: rgba(255, 255, 255, 0.15);
+  border-radius: 2px;
+}
+
+.sectionGroup::-webkit-scrollbar-thumb:hover {
+  background: rgba(255, 255, 255, 0.3);
+}
+
+.sectionSpacer {
+  flex: 1 0 0;
+}
+
+/* ── Section content (scrollable maxHeight) ────────────────────────────── */
+
+.sectionContent {
+  overflow-y: auto;
+  scrollbar-width: thin;
+  scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
+}
+
+.sectionContent::-webkit-scrollbar {
+  width: 4px;
+}
+
+.sectionContent::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.sectionContent::-webkit-scrollbar-thumb {
+  background: rgba(255, 255, 255, 0.15);
+  border-radius: 2px;
+}
+
+.sectionContent::-webkit-scrollbar-thumb:hover {
+  background: rgba(255, 255, 255, 0.3);
+}
+
 /* ── Bottom links ────────────────────────────────────────────────────────── */
 
 .bottom {