diff --git a/site/style.css b/site/style.css
index ff38ac4..f3e2139 100644
--- a/site/style.css
+++ b/site/style.css
@@ -299,12 +299,11 @@ a:hover {
 }
 .sidebar a {
   display: block;
-  padding: 4px 10px;
+  padding: 5px 10px;
   border-radius: 6px;
   color: var(--muted);
   text-decoration: none;
-  border-left: 2px solid transparent;
-  line-height: 1.4;
+  line-height: 1.45;
 }
 .sidebar a:hover {
   color: var(--text);
@@ -313,30 +312,35 @@ a:hover {
 .sidebar .s-page {
   color: var(--text);
   font-weight: 500;
-  margin-top: 2px;
+  margin-top: 3px;
 }
-.sidebar .s-children {
-  margin: 2px 0 8px;
+/* nested groups indent behind a static tree line (structure, not state) */
+.sidebar .s-children,
+.sidebar .s-toc {
+  margin: 2px 0 8px 13px;
+  padding-left: 5px;
+  border-left: 1px solid var(--border);
 }
 .sidebar .s-child {
-  padding-left: 22px;
   font-size: 12.5px;
 }
 .sidebar .s-toc {
-  margin: 2px 0 6px;
+  margin-bottom: 6px;
 }
 .sidebar .s-toc-link {
-  padding-left: 22px;
   font-size: 12px;
 }
+.sidebar .s-children .s-toc {
+  border-left: none;
+  margin-left: 8px;
+}
 .sidebar .s-toc-sub {
-  padding-left: 34px;
+  padding-left: 20px;
 }
 .sidebar a.active {
-  color: var(--text);
+  color: var(--link);
   font-weight: 600;
   background: var(--accent);
-  border-left-color: var(--link);
 }
 
 @media (min-width: 1024px) {