Some style tweaks

Author: klieret

docs/index.md

@@ -11,11 +11,8 @@
 So you want to build your own AI agent from scratch? The good news: It's super simple, especially with more recent language models.
 We won't be using any external packages (other than to query the LM), and our initial minimal agent is only some 60 lines long.
 
-And if you think this is too simplified and can never work in practice: Our [`mini` agent](https://mini-swe-agent.com) is built exactly the same (just with a bit more fluff to support more models be a bit more convenient) and it scores up to 74% on [SWE-bench verified](https://www.swebench.com/), only a few percent below highly optimized agents. 
-
-Your final result will look like this:
-
-
+And if you think this is too simplified and can never work in practice: Our [`mini` agent](https://mini-swe-agent.com) is built exactly the same, and is used for research at Princeton, Stanford, NVIDIA, Anyscale, essentials.ai and more. 
+Using this simple guide you can score up to 74% on [SWE-bench verified](https://www.swebench.com/), only a few percent below highly optimized agents. 
 
 ## Our first prototype in 50 lines
 
@@ -336,7 +333,7 @@ def execute_action(command: str) -> str:
     return result.stdout
 ```
 
-??? info "Understanding `subprocess.run arguments`"
+??? info "Understanding `subprocess.run` arguments"
     Let's break down the keyword arguments we're using:
 
     - `shell=True` - Allows running arbitrary shell commands given as a string (like `cd`, `ls`, pipes, etc.). Be careful with untrusted input!

docs/stylesheets/extra.css

@@ -41,35 +41,48 @@
 }
 
 /* Layout adjustments */
+:root {
+    --content-max: 40rem;   /* main text width (~800px) */
+    --toc-width: 16rem;     /* room for right TOC */
+    --layout-gap: 2rem;
+}
 
-/* Move sidebar to the right and swap positions */
+/* Keep sidebar on the right, but don't push main text left; center main text */
 @media screen and (min-width: 76.25em) {
+    .md-grid,
+    .md-main__inner {
+        max-width: calc(var(--content-max) + var(--toc-width) + 2 * var(--layout-gap));
+        width: 100%;
+    }
+
+    .md-main__inner {
+        display: grid;
+        grid-template-columns: 1fr minmax(0, var(--content-max)) var(--toc-width);
+        gap: var(--layout-gap);
+        align-items: start;
+    }
+
+    .md-content {
+        grid-column: 2;
+    }
+
+    /* Primary sidebar (TOC) on the right */
     .md-sidebar--primary {
+        grid-column: 3;
+        position: sticky;
+        top: var(--md-header-height, 3.2rem);
+        align-self: start;
         left: auto;
         right: 0;
         order: 2;
     }
-    
+
+    /* Secondary sidebar not used */
     .md-sidebar--secondary {
-        left: 0;
-        right: auto;
-        order: 1;
+        display: none;
     }
 }
 
-/* Narrower content width (closer to 800px like original) */
-.md-grid {
-    max-width: 56rem;  /* Reduced from 61rem for narrower content */
-}
-
-.md-main__inner {
-    max-width: 56rem;
-}
-
-.md-content {
-    max-width: 50rem;  /* Further constrain the actual content area */
-}
-
 /* More subtle header - white/black background instead of blue */
 .md-header {
     background-color: var(--md-default-bg-color);