docs(web): fix docs sidebar positioning to stay fixed on scroll with proper alignment and symmetric spacing.

Exactly reproduce sidebar behavior so the docs layout remains stable while scrolling, with consistent spacing and alignment across breakpoints.

🤖 Generated with Codebuff
Co-Authored-By: Codebuff <noreply@codebuff.com>

Author: brandonkachen

web/src/app/docs/layout.tsx

@@ -35,10 +35,12 @@ export default function DocsLayout({
   return (
     <div className="pt-8">
       <div className="container flex md:space-x-8 overflow-x-hidden">
-        <DocSidebar
-          className="hidden lg:block w-64 shrink-0 sticky top-[24px] h-[calc(100vh-24px)] overflow-y-auto pr-4"
-          onNavigate={() => setOpen(false)}
-        />
+        <div className="hidden lg:block w-64 shrink-0">
+          <DocSidebar
+            className="fixed top-24 w-64 h-[calc(100vh-12rem)] overflow-y-auto pr-4 z-40"
+            onNavigate={() => setOpen(false)}
+          />
+        </div>
         <main className="flex-1 mx-auto pb-36 md:px-8 min-w-0">{children}</main>
       </div>
       <div className="flex items-center lg:hidden sticky bottom-0 z-50 bg-background/80 backdrop-blur-sm container p-4 rounded-t-lg border-t">