diff --git a/src/SkillServer/wwwroot/favicon.ico b/src/SkillServer/wwwroot/favicon.ico
new file mode 100644
index 0000000..a039ad8
Binary files /dev/null and b/src/SkillServer/wwwroot/favicon.ico differ
diff --git a/src/SkillServer/wwwroot/index.html b/src/SkillServer/wwwroot/index.html
index 2be571c..2cc7691 100644
--- a/src/SkillServer/wwwroot/index.html
+++ b/src/SkillServer/wwwroot/index.html
@@ -4,6 +4,8 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>SkillServer Gallery</title>
+<link rel="icon" href="/favicon.ico" sizes="16x16 32x32 48x48">
+<link rel="icon" href="/logo.svg" type="image/svg+xml">
 <link rel="preconnect" href="https://fonts.googleapis.com">
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
 <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet">
@@ -14,7 +16,7 @@
 <nav class="nav">
   <div class="nav-inner">
     <a href="/" class="nav-brand">
-      <svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16 2L4 8v16l12 6 12-6V8L16 2z" fill="#512BD4"/><path d="M16 6l-8 4v12l8 4 8-4V10L16 6z" fill="#1a1a2e"/><path d="M14 14c0-1.1.9-2 2-2s2 .9 2 2-.9 2-2 2-2-.9-2-2z" fill="#00D4AA"/><path d="M12 20l4-2 4 2-4 2-4-2z" fill="#00D4AA"/><path d="M10 18l2 2-2 2-2-2 2-2z" fill="#512BD4"/><path d="M22 18l-2 2 2 2 2-2-2-2z" fill="#512BD4"/></svg>
+      <img src="/logo.svg" alt="" width="32" height="32">
       <div class="nav-brand-text">SkillServer<span>Gallery</span></div>
     </a>
     <div class="nav-links">
diff --git a/src/SkillServer/wwwroot/js/router.js b/src/SkillServer/wwwroot/js/router.js
index 4e3cbf9..20ea7d1 100644
--- a/src/SkillServer/wwwroot/js/router.js
+++ b/src/SkillServer/wwwroot/js/router.js
@@ -37,6 +37,14 @@ export function getSubAgentName() {
     return null;
 }
 
+export function getSubAgentVersion() {
+    const segments = getPathSegments();
+    if (segments.length >= 4 && segments[0] === 'subagents' && segments[2] === 'v') {
+        return decodeURIComponent(segments[3]);
+    }
+    return null;
+}
+
 export function isListingPage() {
     const segments = getPathSegments();
     return segments.length <= 1;
diff --git a/src/SkillServer/wwwroot/logo.svg b/src/SkillServer/wwwroot/logo.svg
new file mode 100644
index 0000000..6fc5d6d
--- /dev/null
+++ b/src/SkillServer/wwwroot/logo.svg
@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+<path d="M16 2L4 8v16l12 6 12-6V8L16 2z" fill="#512BD4"/>
+<path d="M16 6l-8 4v12l8 4 8-4V10L16 6z" fill="#1a1a2e"/>
+<path d="M14 14c0-1.1.9-2 2-2s2 .9 2 2-.9 2-2 2-2-.9-2-2z" fill="#00D4AA"/>
+<path d="M12 20l4-2 4 2-4 2-4-2z" fill="#00D4AA"/>
+<path d="M10 18l2 2-2 2-2-2 2-2z" fill="#512BD4"/>
+<path d="M22 18l-2 2 2 2 2-2-2-2z" fill="#512BD4"/>
+</svg>
diff --git a/src/SkillServer/wwwroot/skills/index.html b/src/SkillServer/wwwroot/skills/index.html
index c38e5a2..751d8ca 100644
--- a/src/SkillServer/wwwroot/skills/index.html
+++ b/src/SkillServer/wwwroot/skills/index.html
@@ -4,6 +4,8 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>Skills - SkillServer Gallery</title>
+<link rel="icon" href="/favicon.ico" sizes="16x16 32x32 48x48">
+<link rel="icon" href="/logo.svg" type="image/svg+xml">
 <link rel="preconnect" href="https://fonts.googleapis.com">
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
 <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet">
@@ -14,7 +16,7 @@
 <nav class="nav">
   <div class="nav-inner">
     <a href="/" class="nav-brand">
-      <svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16 2L4 8v16l12 6 12-6V8L16 2z" fill="#512BD4"/><path d="M16 6l-8 4v12l8 4 8-4V10L16 6z" fill="#1a1a2e"/><path d="M14 14c0-1.1.9-2 2-2s2 .9 2 2-.9 2-2 2-2-.9-2-2z" fill="#00D4AA"/><path d="M12 20l4-2 4 2-4 2-4-2z" fill="#00D4AA"/><path d="M10 18l2 2-2 2-2-2 2-2z" fill="#512BD4"/><path d="M22 18l-2 2 2 2 2-2-2-2z" fill="#512BD4"/></svg>
+      <img src="/logo.svg" alt="" width="32" height="32">
       <div class="nav-brand-text">SkillServer<span>Gallery</span></div>
     </a>
     <div class="nav-links">
diff --git a/src/SkillServer/wwwroot/style.css b/src/SkillServer/wwwroot/style.css
index cefaeb6..fd828de 100644
--- a/src/SkillServer/wwwroot/style.css
+++ b/src/SkillServer/wwwroot/style.css
@@ -18,7 +18,7 @@ a:hover{color:var(--teal-dark)}
 .nav{position:sticky;top:0;z-index:100;background:rgba(26,26,46,.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}
 .nav-inner{max-width:1200px;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;height:64px}
 .nav-brand{display:flex;align-items:center;gap:12px}
-.nav-brand svg{height:28px;width:auto}
+.nav-brand svg,.nav-brand img{height:28px;width:auto}
 .nav-brand-text{font-size:1.1rem;font-weight:700;letter-spacing:-.02em;color:var(--text)}
 .nav-brand-text span{color:var(--text-muted);font-weight:400;margin-left:4px}
 .nav-links{display:flex;align-items:center;gap:8px}
diff --git a/src/SkillServer/wwwroot/subagents/index.html b/src/SkillServer/wwwroot/subagents/index.html
index fd961d0..a651735 100644
--- a/src/SkillServer/wwwroot/subagents/index.html
+++ b/src/SkillServer/wwwroot/subagents/index.html
@@ -4,6 +4,8 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>Sub-agents - SkillServer Gallery</title>
+<link rel="icon" href="/favicon.ico" sizes="16x16 32x32 48x48">
+<link rel="icon" href="/logo.svg" type="image/svg+xml">
 <link rel="preconnect" href="https://fonts.googleapis.com">
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
 <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet">
@@ -14,7 +16,7 @@
 <nav class="nav">
   <div class="nav-inner">
     <a href="/" class="nav-brand">
-      <svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M16 2L4 8v16l12 6 12-6V8L16 2z" fill="#512BD4"/><path d="M16 6l-8 4v12l8 4 8-4V10L16 6z" fill="#1a1a2e"/><path d="M14 14c0-1.1.9-2 2-2s2 .9 2 2-.9 2-2 2-2-.9-2-2z" fill="#00D4AA"/><path d="M12 20l4-2 4 2-4 2-4-2z" fill="#00D4AA"/><path d="M10 18l2 2-2 2-2-2 2-2z" fill="#512BD4"/><path d="M22 18l-2 2 2 2 2-2-2-2z" fill="#512BD4"/></svg>
+      <img src="/logo.svg" alt="" width="32" height="32">
       <div class="nav-brand-text">SkillServer<span>Gallery</span></div>
     </a>
     <div class="nav-links">
@@ -46,15 +48,16 @@
 <script type="module">
 import { fetchSubAgents, fetchSubAgentVersions, fetchAgentMd } from '/js/api.js';
 import { renderAppVersion } from '/js/footer.js';
-import { getSubAgentName } from '/js/router.js';
+import { getSubAgentName, getSubAgentVersion } from '/js/router.js';
 
 renderAppVersion();
 
 const app = document.getElementById('app');
 const agentName = getSubAgentName();
+const requestedVersion = getSubAgentVersion();
 
 if (agentName) {
-    await renderDetail(agentName);
+    await renderDetail(agentName, requestedVersion);
 } else {
     await renderListing();
 }
@@ -82,28 +85,32 @@ <h1>All Sub-agents</h1>
     }
 }
 
-async function renderDetail(name) {
+async function renderDetail(name, version) {
     document.title = `${name} - SkillServer Gallery`;
     try {
         const versions = await fetchSubAgentVersions(name);
-        const latest = versions.find(v => v.isLatest) || versions[0];
-        const agentMd = await fetchAgentMd(name, latest.version);
+        const targetVersion = version
+            ? (versions.find(v => v.version === version) || versions.find(v => v.isLatest) || versions[0])
+            : (versions.find(v => v.isLatest) || versions[0]);
+        document.title = `${name}${version ? ' v' + targetVersion.version : ''} - SkillServer Gallery`;
+        const agentMd = await fetchAgentMd(name, targetVersion.version);
         app.innerHTML = `
             <div class="breadcrumb">
                 <a href="/">Home</a> <span>›</span>
                 <a href="/subagents/">Sub-agents</a> <span>›</span>
-                ${name}
+                <a href="/subagents/${encodeURIComponent(name)}/">${name}</a>
+                ${version ? `<span>›</span><span>v${targetVersion.version}</span>` : ''}
             </div>
             <div class="detail-header">
                 <div class="detail-title">
                     <h1>${name}</h1>
-                    <span class="detail-version">v${latest.version} ${latest.isLatest ? '<span class="latest">← latest</span>' : ''}</span>
+                    <span class="detail-version">v${targetVersion.version} ${targetVersion.isLatest ? '<span class="latest">← latest</span>' : ''}</span>
                 </div>
-                <p class="detail-description">${latest.description || ''}</p>
+                <p class="detail-description">${targetVersion.description || ''}</p>
                 <div class="detail-meta">
-                    <div class="meta-item"><span class="meta-label">Role</span><span class="meta-value">${latest.modelRole || '—'}</span></div>
-                    <div class="meta-item"><span class="meta-label">Timeout</span><span class="meta-value">${latest.timeoutSeconds ? latest.timeoutSeconds + 's' : '—'}</span></div>
-                    <div class="meta-item"><span class="meta-label">Visibility</span><span class="meta-value">${latest.visibility || '—'}</span></div>
+                    <div class="meta-item"><span class="meta-label">Role</span><span class="meta-value">${targetVersion.modelRole || '—'}</span></div>
+                    <div class="meta-item"><span class="meta-label">Timeout</span><span class="meta-value">${targetVersion.timeoutSeconds ? targetVersion.timeoutSeconds + 's' : '—'}</span></div>
+                    <div class="meta-item"><span class="meta-label">Visibility</span><span class="meta-value">${targetVersion.visibility || '—'}</span></div>
                     <div class="meta-item"><span class="meta-label">Versions</span><span class="meta-value">${versions.length}</span></div>
                 </div>
             </div>
@@ -128,11 +135,11 @@ <h2>Version History</h2>
                 </div>
                 <div class="version-list">
                     ${versions.map(v => `
-                        <div class="version-row ${v.isLatest ? 'current' : ''}">
-                            <span class="version-tag ${v.isLatest ? 'latest' : ''}">v${v.version}</span>
+                        <a href="/subagents/${encodeURIComponent(name)}/v/${encodeURIComponent(v.version)}/" class="version-row ${v.version === targetVersion.version ? 'current' : ''} ${v.isLatest && v.version !== targetVersion.version ? 'latest-link' : ''}" role="button" tabindex="0">
+                            <span class="version-tag ${v.version === targetVersion.version && v.isLatest ? 'latest' : ''}">v${v.version}</span>
                             <span class="version-date">${formatDate(v.publishedAt)}</span>
                             <span class="version-size">${formatBytes(v.sizeBytes)}</span>
-                        </div>
+                        </a>
                     `).join('')}
                 </div>
             </section>
diff --git a/tests/SkillServer.Integration.Tests/GalleryShellRouteTests.cs b/tests/SkillServer.Integration.Tests/GalleryShellRouteTests.cs
new file mode 100644
index 0000000..0eaf7cb
--- /dev/null
+++ b/tests/SkillServer.Integration.Tests/GalleryShellRouteTests.cs
@@ -0,0 +1,45 @@
+// -----------------------------------------------------------------------
+// <copyright file="GalleryShellRouteTests.cs" company="Petabridge, LLC">
+//      Copyright (C) 2026 - 2026 Petabridge, LLC <https://petabridge.com>
+// </copyright>
+// -----------------------------------------------------------------------
+using Xunit;
+
+namespace SkillServer.Integration.Tests;
+
+[Collection("SkillServer")]
+public sealed class GalleryShellRouteTests
+{
+    private readonly SkillServerFixture _fixture;
+
+    public GalleryShellRouteTests(SkillServerFixture fixture)
+    {
+        _fixture = fixture;
+    }
+
+    [Theory]
+    [InlineData("/skills/dockerfile-hardening/v/1.0.0/", "Skills")]
+    [InlineData("/subagents/static-analysis-auditor/v/1.0.0/", "Sub-agents")]
+    public async Task VersionDeepLink_ServesGalleryShell(string path, string title)
+    {
+        var ct = TestContext.Current.CancellationToken;
+        var response = await _fixture.HttpClient.GetAsync(path, ct);
+        response.EnsureSuccessStatusCode();
+
+        var html = await response.Content.ReadAsStringAsync(ct);
+        Assert.Contains($"<title>{title} - SkillServer Gallery</title>", html);
+    }
+
+    [Theory]
+    [InlineData("/favicon.ico", "image/x-icon")]
+    [InlineData("/logo.svg", "image/svg+xml")]
+    public async Task BrandIcon_IsServed(string path, string contentType)
+    {
+        var ct = TestContext.Current.CancellationToken;
+        var response = await _fixture.HttpClient.GetAsync(path, ct);
+        response.EnsureSuccessStatusCode();
+
+        Assert.Equal(contentType, response.Content.Headers.ContentType?.MediaType);
+        Assert.True(response.Content.Headers.ContentLength > 0);
+    }
+}