diff --git a/Assets/favicon.png b/Assets/favicon.png
new file mode 100644
index 0000000..fc6c55d
Binary files /dev/null and b/Assets/favicon.png differ
diff --git a/Assets/logo.svg b/Assets/logo.svg
new file mode 100644
index 0000000..3e01274
--- /dev/null
+++ b/Assets/logo.svg
@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="128" height="128" viewBox="0 0 128 128">
+  <!-- AI Engineering Lab mark: dark terminal tile with a teal ">" prompt + amber cursor -->
+  <rect width="128" height="128" rx="26" fill="#16181d"/>
+  <rect x="3" y="3" width="122" height="122" rx="23" fill="none" stroke="#2a2a31" stroke-width="6"/>
+  <path d="M42 44 L72 64 L42 84" fill="none" stroke="#00b8d4" stroke-width="15"
+        stroke-linecap="round" stroke-linejoin="round"/>
+  <rect x="84" y="57" width="16" height="14" rx="3" fill="#ffb300"/>
+</svg>
\ No newline at end of file
diff --git a/Assets/social/preview.png b/Assets/social/preview.png
new file mode 100644
index 0000000..49f58f9
Binary files /dev/null and b/Assets/social/preview.png differ
diff --git a/Assets/social/preview.svg b/Assets/social/preview.svg
new file mode 100644
index 0000000..9d22bab
--- /dev/null
+++ b/Assets/social/preview.svg
@@ -0,0 +1,27 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="1280" height="640" viewBox="0 0 1280 640">
+  <!-- AI Engineering Lab social preview card: dark terminal, teal/amber accent -->
+  <rect width="1280" height="640" fill="#0e1116"/>
+  <rect width="14" height="640" fill="#00b8d4"/>
+
+  <!-- Brand row (logo tile + wordmark) -->
+  <rect x="56" y="52" width="34" height="34" rx="8" fill="#16181d" stroke="#2a2a31" stroke-width="2"/>
+  <path d="M64 62 L75 69 L64 76" fill="none" stroke="#00b8d4" stroke-width="4"
+        stroke-linecap="round" stroke-linejoin="round"/>
+  <text x="104" y="77" font-family="system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif"
+        font-size="26" font-weight="600" fill="#9aa0aa">AI Engineering Lab</text>
+
+  <!-- Title (project name primary) -->
+  <text x="56" y="258" font-family="system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif"
+        font-size="66" font-weight="700" fill="#f5f6f8">Provider-Aware</text>
+  <text x="56" y="336" font-family="system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif"
+        font-size="66" font-weight="700" fill="#f5f6f8">Statusline</text>
+
+  <!-- Tagline -->
+  <text x="56" y="416" font-family="system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif"
+        font-size="30" fill="#9aa0aa">See which provider actually served your request.</text>
+
+  <!-- Statusline motif: requested label → resolved route -->
+  <text x="56" y="548" font-family="Menlo, Monaco, Consolas, monospace" font-size="28" fill="#6b7280">auto/cheap</text>
+  <text x="240" y="548" font-family="Menlo, Monaco, Consolas, monospace" font-size="28" fill="#ffb300">  →  </text>
+  <text x="300" y="548" font-family="Menlo, Monaco, Consolas, monospace" font-size="28" fill="#00b8d4">opencode/big-pickle</text>
+</svg>
diff --git a/mkdocs.yml b/mkdocs.yml
index 5fbd4ea..716e48d 100644
--- a/mkdocs.yml
+++ b/mkdocs.yml
@@ -25,6 +25,9 @@ site_dir: site
 
 theme:
   name: material
+  logo: Assets/logo.svg
+  favicon: Assets/favicon.png
+  custom_dir: overrides
   palette:
     - scheme: slate        # dark — matches the project's terminal identity
       primary: teal
diff --git a/overrides/main.html b/overrides/main.html
new file mode 100644
index 0000000..9744656
--- /dev/null
+++ b/overrides/main.html
@@ -0,0 +1,61 @@
+<!--
+  Material MkDocs theme override: inject Open Graph, Twitter Card, and JSON-LD structured data
+  via the extrahead block. All values come from MkDocs built-ins — no custom logic.
+-->
+{% extends "base.html" %}
+
+{% block extrahead %}
+  {{ super() }}
+
+  {# Open Graph / Facebook #}
+  <meta property="og:type" content="website">
+  <meta property="og:site_name" content="{{ config.site_name }}">
+  <meta property="og:title" content="{{ page.title or config.site_name }}">
+  <meta property="og:description" content="{{ config.site_description }}">
+  <meta property="og:url" content="{{ page.canonical_url }}">
+  <meta property="og:image" content="{{ config.site_url }}Assets/social/preview.png">
+
+  {# Twitter Card #}
+  <meta name="twitter:card" content="summary_large_image">
+  <meta name="twitter:title" content="{{ page.title or config.site_name }}">
+  <meta name="twitter:description" content="{{ config.site_description }}">
+  <meta name="twitter:image" content="{{ config.site_url }}Assets/social/preview.png">
+
+  {# Static JSON-LD structured data #}
+  <script type="application/ld+json">
+[
+  {
+    "@context": "https://schema.org",
+    "@graph": [
+      {
+        "@type": "WebSite",
+        "@id": "{{ config.site_url }}#website",
+        "url": "{{ config.site_url }}",
+        "name": "{{ config.site_name }}",
+        "description": "{{ config.site_description }}",
+        "publisher": {
+          "@id": "{{ config.site_url }}#organization"
+        }
+      },
+      {
+        "@type": "Organization",
+        "@id": "{{ config.site_url }}#organization",
+        "name": "{{ config.site_name }}",
+        "description": "{{ config.site_description }}",
+        "url": "{{ config.site_url }}"
+      },
+      {
+        "@type": "SoftwareSourceCode",
+        "name": "Provider-Aware Statusline",
+        "description": "Provider-Aware Statusline for Claude Code behind the OmniRoute LLM routing gateway — see which provider and model actually served your request.",
+        "url": "https://github.com/UnscriptedByKraMy/AI-Engineering-Lab/tree/main/Statusline",
+        "codeRepository": "https://github.com/UnscriptedByKraMy/AI-Engineering-Lab/tree/main/Statusline",
+        "programmingLanguage": "JavaScript",
+        "license": "https://github.com/UnscriptedByKraMy/AI-Engineering-Lab/blob/main/LICENSE",
+        "runtimePlatform": "Node.js"
+      }
+    ]
+  }
+  ]
+  </script>
+{% endblock %}
\ No newline at end of file