diff --git a/web/templates/base.html b/web/templates/base.html
index f06cf76..5967b50 100644
--- a/web/templates/base.html
+++ b/web/templates/base.html
@@ -30,7 +30,20 @@
       --nav-bg:#f8fafc; --nav-border:#e5e7eb; --nav-ink:#1f2937; --nav-ink-muted:#6b7280;
       --nav-brand:#2f6cab; --nav-brand-hover:#1f4c7a; --btn-bg:#fff; --btn-border:#d1d5db; --btn-hover:#eef2f7;
     }
-    .topbar-wrap{border-bottom:1px solid var(--nav-border); background:var(--nav-bg);}
+    .topbar-wrap {
+      border-bottom: 1px solid var(--nav-border);
+      background: var(--nav-bg);
+
+       /* make it sticky */
+      position: sticky;
+      top: 0;
+      z-index: 1000;
+    }
+
+  .topbar-wrap.is-scrolled {
+    box-shadow: 0 4px 16px rgba(0,0,0,.08);
+    border-bottom-color: transparent;
+    }
     .topbar{max-width:1100px; margin:0 auto; padding:14px 16px; display:flex; align-items:center; gap:14px; justify-content:space-between; font-size:17px;}
     .brand{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--nav-ink); font-weight:600; letter-spacing:.2px;}
     .brand .tagline{color:var(--nav-ink-muted); font-weight:500; font-size:15px}