diff --git a/pkg/service/handlers/web/css/style.css b/pkg/service/handlers/web/css/style.css
index f176376..4aa8d07 100644
--- a/pkg/service/handlers/web/css/style.css
+++ b/pkg/service/handlers/web/css/style.css
@@ -18,7 +18,11 @@ body { font-family: sans-serif; margin: 20px; }
 .topbar .brand-text { display: flex; flex-direction: column; line-height: 1.1; }
 .topbar .brand-name { font-size: 1.1rem; font-weight: 600; letter-spacing: .02em; }
 .topbar .brand-subtitle { font-size: .7rem; font-weight: 400; opacity: .7; }
+.topbar .bar-links { display: flex; align-items: center; gap: .25rem; }
 .topbar .bar-links a {
+    display: inline-flex;
+    align-items: center;
+    gap: .3rem;
     color: #fff;
     font-size: .85rem;
     opacity: .85;
diff --git a/pkg/service/handlers/web/index.html b/pkg/service/handlers/web/index.html
index 7d2f2fa..7c55af7 100644
--- a/pkg/service/handlers/web/index.html
+++ b/pkg/service/handlers/web/index.html
@@ -17,6 +17,13 @@
         </span>
     </a>
     <nav class="bar-links">
+        <a href="https://gesellix.github.io/Bose-SoundTouch/" target="_blank" rel="noopener" title="Documentation">
+            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                <path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"/>
+                <path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"/>
+            </svg>
+            Docs
+        </a>
         <a href="/app">Open the Player &rarr;</a>
     </nav>
 </header>
diff --git a/pkg/service/handlers/web/js/script.js b/pkg/service/handlers/web/js/script.js
index d7de07d..84ef2d3 100644
--- a/pkg/service/handlers/web/js/script.js
+++ b/pkg/service/handlers/web/js/script.js
@@ -811,7 +811,7 @@ async function fetchVersion() {
                 const shortCommit = data.commit.substring(0, 7);
                 commitStr = `<a href="${data.commit_url}" target="_blank" style="color: inherit; text-decoration: underline;">${shortCommit}</a>`;
             }
-            info.innerHTML = `AfterTouch ${versionStr} (${commitStr}) - ${data.date}`;
+            info.innerHTML = `AfterTouch ${versionStr} (${commitStr}) • ${data.date}`;
         }
     } catch (error) {
         console.error("Failed to fetch version info", error);
diff --git a/pkg/service/handlers/web/landing.html b/pkg/service/handlers/web/landing.html
index c95173a..cf38378 100644
--- a/pkg/service/handlers/web/landing.html
+++ b/pkg/service/handlers/web/landing.html
@@ -70,14 +70,6 @@
         .brand-text { display: flex; flex-direction: column; line-height: 1.1; }
         .brand-name { font-size: 1.1rem; font-weight: 600; letter-spacing: 0.02em; }
         .brand-subtitle { font-size: 0.7rem; font-weight: 400; opacity: 0.7; }
-        .bar-links a {
-            font-size: 0.85rem;
-            opacity: 0.8;
-            padding: 0.35rem 0.5rem;
-            border-radius: 4px;
-            transition: opacity 0.15s, background 0.15s;
-        }
-        .bar-links a:hover { opacity: 1; background: rgba(127, 127, 127, 0.18); }
 
         /* ── Chooser ─────────────────────────────────────────────────── */
         main {
@@ -148,17 +140,28 @@
             padding: 0.1rem 0.5rem;
         }
 
-        /* ── Footer (version line, like the app and admin) ───────────── */
+        /* Prominent docs link, distinct from the two destination rows. */
+        .docs-link {
+            display: inline-flex;
+            align-items: center;
+            gap: 0.5rem;
+            margin-top: 1.5rem;
+            font-size: 0.95rem;
+            color: var(--text-dim);
+            transition: color 0.15s;
+        }
+        .docs-link:hover { color: var(--text); }
+        .docs-link svg { flex-shrink: 0; }
+
+        /* ── Footer (version line, identical to the app and admin) ────── */
         footer {
-            max-width: 32rem;
-            margin: 0 auto;
-            padding: 1.5rem;
+            padding: 1.5rem 1rem;
+            text-align: center;
             font-size: 0.8rem;
             color: var(--text-dim);
         }
         footer a { text-decoration: underline; text-underline-offset: 2px; }
         footer a:hover { color: var(--text); }
-        .dot { opacity: 0.5; padding: 0 0.15rem; }
     </style>
 </head>
 <body>
@@ -170,9 +173,6 @@
                 <span class="brand-subtitle">Bose SoundTouch Toolkit</span>
             </span>
         </a>
-        <nav class="bar-links">
-            <a href="https://gesellix.github.io/Bose-SoundTouch/" target="_blank" rel="noopener">Documentation</a>
-        </nav>
     </header>
 
     <main>
@@ -196,12 +196,18 @@
                 <span class="arrow" aria-hidden="true">&rarr;</span>
             </a>
         </nav>
+
+        <a class="docs-link" href="https://gesellix.github.io/Bose-SoundTouch/" target="_blank" rel="noopener">
+            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                <path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"/>
+                <path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"/>
+            </svg>
+            Documentation
+        </a>
     </main>
 
     <footer>
         <span id="version-info">AfterTouch</span>
-        <span class="dot">&middot;</span>
-        <a href="https://gesellix.github.io/Bose-SoundTouch/" target="_blank" rel="noopener">Documentation</a>
     </footer>
 
     <script>
diff --git a/pkg/service/soundtouchweb/static/js/app.js b/pkg/service/soundtouchweb/static/js/app.js
index 5007b7b..973b4cf 100644
--- a/pkg/service/soundtouchweb/static/js/app.js
+++ b/pkg/service/soundtouchweb/static/js/app.js
@@ -217,6 +217,12 @@ function App() {
                     <button class="btn-icon" onClick=${discover} title="Discover">
                         <img src="/app/static/img/knob-mono.svg" alt="Discover" class="nav-discover-icon ${isDiscovering ? 'buzzing' : ''}" />
                     </button>
+                    <a href="https://gesellix.github.io/Bose-SoundTouch/" target="_blank" rel="noopener" title="Documentation">
+                        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
+                            <path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"/>
+                            <path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"/>
+                        </svg>
+                    </a>
                 </div>
             </nav>