From 950d82e5b212148f5eba06c4b9086e0dd537a2d0 Mon Sep 17 00:00:00 2001
From: nate <nate@forehead-gate.com>
Date: Thu, 19 Mar 2026 17:32:40 +0400
Subject: [PATCH] fix: docs styling bleeds over

---
 apps/web/src/views/docs.ejs | 43 ++++++++++++++++---------------------
 1 file changed, 19 insertions(+), 24 deletions(-)

diff --git a/apps/web/src/views/docs.ejs b/apps/web/src/views/docs.ejs
index dd20f59..a69dfb9 100644
--- a/apps/web/src/views/docs.ejs
+++ b/apps/web/src/views/docs.ejs
@@ -1,8 +1,9 @@
 <%~ include('./partials/public-head', { title: 'Documentation', nav: 'docs' }) %>
 
   <style>
-    body { font-family: 'JetBrains Mono', 'SF Mono', 'Fira Code', ui-monospace, monospace; }
-    pre, code { font-family: inherit; }
+    /* Docs layout */
+    .docs-wrap { font-family: 'JetBrains Mono', 'SF Mono', 'Fira Code', ui-monospace, monospace; }
+    .docs-wrap pre, .docs-wrap code { font-family: inherit; }
 
     /* Sidebar nav */
     .nav-link { display: block; padding: 0.3rem 0.75rem; font-size: 0.8rem; color: #6b7280; border-left: 2px solid transparent; transition: all 0.1s; }
@@ -10,14 +11,19 @@
     .nav-link.active { color: #93c5fd; border-left-color: #3b82f6; }
     .nav-section { font-size: 0.7rem; font-weight: 600; color: #374151; text-transform: uppercase; letter-spacing: 0.08em; padding: 0.75rem 0.75rem 0.25rem; margin-top: 0.5rem; }
 
-    /* Content */
-    .section { padding-top: 3rem; padding-bottom: 1rem; border-top: 1px solid #111827; margin-top: 2rem; }
-    .section:first-child { border-top: none; margin-top: 0; padding-top: 0; }
-    h2 { font-size: 1.2rem; font-weight: 700; color: #f9fafb; margin-bottom: 0.5rem; }
-    h3 { font-size: 0.85rem; font-weight: 600; color: #9ca3af; text-transform: uppercase; letter-spacing: 0.06em; margin: 1.5rem 0 0.5rem; }
-    p { font-size: 0.875rem; color: #6b7280; line-height: 1.7; margin-bottom: 0.75rem; }
-    p a { color: #93c5fd; }
-    p a:hover { color: #bfdbfe; }
+    /* Content — scoped to .docs */
+    .docs .section { padding-top: 3rem; padding-bottom: 1rem; border-top: 1px solid #111827; margin-top: 2rem; }
+    .docs .section:first-child { border-top: none; margin-top: 0; padding-top: 0; }
+    .docs h2 { font-size: 1.2rem; font-weight: 700; color: #f9fafb; margin-bottom: 0.5rem; }
+    .docs h3 { font-size: 0.85rem; font-weight: 600; color: #9ca3af; text-transform: uppercase; letter-spacing: 0.06em; margin: 1.5rem 0 0.5rem; }
+    .docs p { font-size: 0.875rem; color: #6b7280; line-height: 1.7; margin-bottom: 0.75rem; }
+    .docs p a { color: #93c5fd; }
+    .docs p a:hover { color: #bfdbfe; }
+    .docs table { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin: 0.5rem 0 1.25rem; }
+    .docs th { text-align: left; color: #4b5563; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.05em; padding: 0.4rem 0.75rem; border-bottom: 1px solid #111827; }
+    .docs td { color: #6b7280; padding: 0.45rem 0.75rem; border-bottom: 1px solid #0d1117; vertical-align: top; }
+    .docs td:first-child { color: #93c5fd; white-space: nowrap; font-size: 0.78rem; }
+    .docs td code { background: #1e293b; color: #94a3b8; padding: 0.1em 0.35em; border-radius: 0.2rem; font-size: 0.75rem; }
 
     /* Code blocks */
     .cb { background: #0f172a; border: 1px solid #1e293b; border-radius: 0.5rem; overflow: hidden; margin: 0.75rem 0 1.25rem; }
@@ -28,18 +34,7 @@
     .cb pre { padding: 0.85rem; font-size: 0.78rem; line-height: 1.65; color: #e2e8f0; overflow-x: auto; margin: 0; }
 
     /* Syntax */
-    .k { color: #c084fc; }
-    .s { color: #34d399; }
-    .n { color: #f59e0b; }
-    .o { color: #60a5fa; }
-    .c { color: #334155; }
-
-    /* Tables */
-    table { width: 100%; border-collapse: collapse; font-size: 0.8rem; margin: 0.5rem 0 1.25rem; }
-    th { text-align: left; color: #4b5563; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.05em; padding: 0.4rem 0.75rem; border-bottom: 1px solid #111827; }
-    td { color: #6b7280; padding: 0.45rem 0.75rem; border-bottom: 1px solid #0d1117; vertical-align: top; }
-    td:first-child { color: #93c5fd; white-space: nowrap; font-size: 0.78rem; }
-    td code { background: #1e293b; color: #94a3b8; padding: 0.1em 0.35em; border-radius: 0.2rem; font-size: 0.75rem; }
+    .k { color: #c084fc; } .s { color: #34d399; } .n { color: #f59e0b; } .o { color: #60a5fa; } .c { color: #334155; }
 
     /* Endpoint blocks */
     .endpoint { display: flex; align-items: baseline; gap: 0.75rem; margin-bottom: 0.5rem; }
@@ -52,7 +47,7 @@
     .endpoint-desc { font-size: 0.8rem; color: #4b5563; margin-bottom: 1rem; }
   </style>
 
-  <div class="flex max-w-6xl mx-auto pt-16">
+  <div class="docs-wrap flex max-w-6xl mx-auto pt-16">
 
     <!-- Sidebar -->
     <aside class="w-52 shrink-0 sticky top-16 h-[calc(100vh-4rem)] overflow-y-auto py-6 hidden md:block">
@@ -75,7 +70,7 @@
     </aside>
 
     <!-- Main content -->
-    <main class="flex-1 px-10 py-8 max-w-3xl">
+    <main class="docs flex-1 px-10 py-8 max-w-3xl">
 
       <!-- Overview -->
       <div id="overview" class="section">