Tighten pool top navigation layout

website_example/themes/custom.css

@@ -355,7 +355,6 @@ footer a {
  }
 
 .nav-side-menu {
-  width: 250px;
   background:
     linear-gradient(180deg, rgba(8, 17, 24, 0.98), rgba(6, 13, 20, 0.98)),
     linear-gradient(135deg, rgba(76, 200, 255, 0.08), rgba(66, 245, 200, 0.08));
@@ -364,6 +363,13 @@ footer a {
   color: var(--text-main);
 }
 
+.nav-shell,
+.top-bar-shell {
+  width: 100%;
+  max-width: var(--content-max-width);
+  margin: 0 auto;
+}
+
 .nav-side-menu .brand {
   background:
     linear-gradient(135deg, rgba(66, 245, 200, 0.14), rgba(76, 200, 255, 0.12)),
@@ -407,9 +413,7 @@ footer a {
 .nav-side-menu li .active,
 .nav-side-menu li.active {
   border-left-color: var(--accent-mint);
-  background:
-    linear-gradient(90deg, rgba(66, 245, 200, 0.12), rgba(76, 200, 255, 0.08)),
-    rgba(255, 255, 255, 0.03);
+  background: transparent;
 }
 
 .nav-side-menu li:hover a,
@@ -843,14 +847,17 @@ footer a .lucide,
     top: 0;
     width: 100%;
     height: auto;
+    border-right: none;
+    border-bottom: 1px solid var(--line);
+    z-index: 1100;
+  }
+
+  .nav-shell {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 24px;
-    padding: 0 24px;
-    border-right: none;
-    border-bottom: 1px solid var(--line);
-    z-index: 1100;
+    padding: 0 34px;
   }
 
   .nav-side-menu .brand {
@@ -907,10 +914,13 @@ footer a .lucide,
     left: 0;
     right: 0;
     overflow: auto;
-    padding: 0 34px;
     z-index: 1000;
-    max-width: calc(var(--content-max-width) + 68px);
-    margin: 0 auto;
+  }
+
+  .top-bar-shell {
+    display: flex;
+    align-items: center;
+    padding: 0 34px;
   }
 
   #page-wrapper {