diff --git a/.fallowrc.json b/.fallowrc.json
index dd38c3e2..cc429f20 100644
--- a/.fallowrc.json
+++ b/.fallowrc.json
@@ -3,6 +3,7 @@
   "entry": [
     "apps/docs/blume.config.ts",
     "apps/docs/components.ts",
+    "apps/docs/theme.css",
     "apps/docs/docs/**/*.mdx",
     "apps/docs/docs/**/meta.ts",
     "apps/docs/islands/ObserverDemo.tsx",
diff --git a/apps/docs/blume.config.ts b/apps/docs/blume.config.ts
index 36e13846..1e4ba32a 100644
--- a/apps/docs/blume.config.ts
+++ b/apps/docs/blume.config.ts
@@ -7,7 +7,7 @@ export default defineConfig({
   description:
     "A lightweight React implementation of the Intersection Observer API.",
   logo: {
-    image: "/logo.svg",
+    image: "/logo-horizontal.svg",
   },
   analytics: {
     vercel: true,
diff --git a/apps/docs/components/Logo.astro b/apps/docs/components/Logo.astro
index 69241ff8..6e581e80 100644
--- a/apps/docs/components/Logo.astro
+++ b/apps/docs/components/Logo.astro
@@ -1,4 +1,6 @@
 ---
+import mobileLogoSvg from "./logo-text.svg?raw";
+
 interface LogoData {
   alt: string;
   dark?: string;
@@ -22,14 +24,17 @@ const logoDark = logo?.dark ?? logo?.light;
 ---
 
 <a
-  class="inline-flex min-w-0 items-center gap-2 font-semibold text-base text-foreground"
+  aria-label={brandText}
+  class="inline-flex items-center font-semibold text-base text-foreground"
+  data-docs-logo
   href={brandHref}
 >
   {
     logoSvg && (
       <span
         aria-hidden="true"
-        class="hidden h-5 shrink-0 items-center md:inline-flex [&>svg]:h-5 [&>svg]:w-auto"
+        class="hidden h-8 shrink-0 items-center md:inline-flex [&>svg]:h-8 [&>svg]:w-auto"
+        data-docs-logo-graphic
         set:html={logoSvg}
       />
     )
@@ -38,14 +43,24 @@ const logoDark = logo?.dark ?? logo?.light;
     !logoSvg &&
       logoLight &&
       (logoLight === logoDark ? (
-        <img alt={logo?.alt ?? ""} class="hidden h-5 w-auto md:block" src={logoLight} />
+        <img alt={logo?.alt ?? ""} class="hidden h-8 w-auto md:block" src={logoLight} />
       ) : (
         <>
-          <img alt={logo?.alt ?? ""} class="hidden h-5 w-auto dark:hidden md:block" src={logoLight} />
-          <img alt={logo?.alt ?? ""} class="hidden h-5 w-auto dark:md:block" src={logoDark} />
+          <img alt={logo?.alt ?? ""} class="hidden h-8 w-auto dark:hidden md:block" src={logoLight} />
+          <img alt={logo?.alt ?? ""} class="hidden h-8 w-auto dark:md:block" src={logoDark} />
         </>
       ))
   }
-  {brandText && <span class="hidden truncate md:inline">{brandText}</span>}
-  <span class="truncate md:hidden">Intersection Observer</span>
+  {
+    logoSvg ? (
+      <span
+        aria-hidden="true"
+        class="hidden h-8 shrink-0 items-center md:hidden [&>svg]:h-8 [&>svg]:w-auto"
+        data-docs-logo-mobile
+        set:html={mobileLogoSvg}
+      />
+    ) : (
+      <span class="whitespace-nowrap md:hidden">{brandText}</span>
+    )
+  }
 </a>
diff --git a/apps/docs/components/logo-text.svg b/apps/docs/components/logo-text.svg
new file mode 100644
index 00000000..bf8189f1
--- /dev/null
+++ b/apps/docs/components/logo-text.svg
@@ -0,0 +1,16 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="226" height="48" viewBox="64 0 226 48" fill="none">
+  <title>React Intersection Observer</title>
+  <style>
+    path[stroke="#000"] { stroke: currentColor; }
+    path[fill="#1a1a1a"] { fill: currentColor; }
+  </style>
+  <path fill="#816dd2" d="M64.912 14V5.6h3.12q.888 0 1.572.348t1.068.96q.384.6.384 1.404 0 .828-.444 1.464a2.8 2.8 0 0 1-1.164.948L71.392 14h-1.86l-1.716-2.976h-1.26V14zm1.644-4.476h1.488q.372 0 .66-.156.3-.156.468-.432.18-.276.18-.624 0-.54-.396-.876-.384-.336-.996-.336h-1.404zM75.646 14V5.6h5.316v1.5H77.29v1.908h3.168v1.464H77.29V12.5h3.72V14zm9.25 0 3.313-8.4h1.752l3.312 8.4h-1.74l-.72-1.848h-3.456L86.637 14zm3-3.3h2.377l-1.188-3.048zm12.787 3.444q-1.224 0-2.173-.552a4.04 4.04 0 0 1-1.488-1.536q-.54-.984-.54-2.256t.54-2.244A3.95 3.95 0 0 1 98.5 6.02q.948-.564 2.172-.564.864 0 1.608.312.744.3 1.296.852.564.54.864 1.248l-1.524.564a2.5 2.5 0 0 0-.54-.768 2.4 2.4 0 0 0-.768-.516 2.3 2.3 0 0 0-.936-.192 2.36 2.36 0 0 0-1.309.372q-.563.36-.887.996-.313.636-.312 1.476 0 .84.324 1.488.324.636.9 1.008.575.36 1.32.36.516 0 .936-.192.432-.204.755-.552.337-.348.541-.804l1.524.552q-.3.732-.864 1.296-.552.564-1.296.876a4.15 4.15 0 0 1-1.62.312m9.763-.144V7.1h-2.52V5.6h6.672v1.5h-2.508V14z"/>
+  <path fill="#1a1a1a" d="M65.496 40V24.6h3.542V40zm6.157 0V29h3.234l.132 1.408a4 4 0 0 1 1.342-1.232 3.6 3.6 0 0 1 1.782-.44q1.32 0 2.222.55.903.528 1.342 1.628.462 1.1.462 2.816V40h-3.432v-5.632q0-.88-.198-1.386-.198-.528-.572-.77-.352-.242-.88-.264-.99-.022-1.496.55-.506.55-.506 1.694V40zm17.342.264q-1.959 0-2.926-.924-.946-.945-.946-2.684v-4.774h-1.716V29h1.716v-3.432h3.432V29h2.508v2.882h-2.508v3.916q0 .66.242.968.24.308.748.308.198 0 .462-.088a2.6 2.6 0 0 0 .484-.264l1.188 2.508a4.9 4.9 0 0 1-1.276.748 3.8 3.8 0 0 1-1.408.286m9.401 0q-1.716 0-3.036-.726a5.3 5.3 0 0 1-2.068-2.024q-.748-1.298-.748-3.014t.748-3.014a5.3 5.3 0 0 1 2.068-2.024q1.342-.726 3.08-.726 1.562 0 2.816.748 1.254.749 1.98 2.244.748 1.474.748 3.652h-7.876q.11.946.77 1.518.682.55 1.606.55.815 0 1.364-.352a2 2 0 0 0 .77-.924l3.058 1.034a4.46 4.46 0 0 1-1.254 1.738 5.2 5.2 0 0 1-1.826 1.012 7.7 7.7 0 0 1-2.2.308m-2.2-7.172h4.202q-.088-.638-.418-1.012a1.9 1.9 0 0 0-.77-.572 2.4 2.4 0 0 0-.88-.176q-.418 0-.88.176-.463.154-.814.55-.33.375-.44 1.034M105.427 40V29h3.432v2.046a4.43 4.43 0 0 1 1.738-1.562 4.8 4.8 0 0 1 2.156-.528V32.3a8 8 0 0 0-1.914.22q-.88.22-1.43.682-.55.44-.55 1.144V40zm12.901.264a6.5 6.5 0 0 1-2.024-.308 5.1 5.1 0 0 1-1.628-.88 3.65 3.65 0 0 1-1.012-1.43l2.838-1.188q.287.55.792.836.507.264 1.034.264.528 0 .836-.176.309-.198.308-.528a.62.62 0 0 0-.308-.55q-.308-.198-.902-.352l-.968-.22q-1.517-.396-2.354-1.32-.836-.924-.836-2.134 0-1.694 1.166-2.618 1.167-.924 3.234-.924 1.189 0 2.068.33.903.308 1.496.88.616.55.88 1.276l-2.728 1.144q-.153-.44-.638-.682a2.3 2.3 0 0 0-1.034-.242q-.484 0-.748.22a.69.69 0 0 0-.264.55q0 .264.308.462.33.175.946.33l1.166.286q1.035.264 1.738.814a3.42 3.42 0 0 1 1.408 2.772q0 1.056-.616 1.826-.594.748-1.672 1.166-1.077.396-2.486.396m11.672 0q-1.716 0-3.036-.726a5.27 5.27 0 0 1-2.068-2.024q-.748-1.298-.748-3.014t.748-3.014a5.27 5.27 0 0 1 2.068-2.024q1.341-.726 3.08-.726 1.562 0 2.816.748 1.254.749 1.98 2.244.748 1.474.748 3.652h-7.876q.11.946.77 1.518.682.55 1.606.55.813 0 1.364-.352.55-.374.77-.924l3.058 1.034a4.5 4.5 0 0 1-1.254 1.738 5.2 5.2 0 0 1-1.826 1.012 7.7 7.7 0 0 1-2.2.308m-2.2-7.172h4.202q-.088-.638-.418-1.012a1.9 1.9 0 0 0-.77-.572 2.4 2.4 0 0 0-.88-.176q-.418 0-.88.176a1.87 1.87 0 0 0-.814.55q-.33.375-.44 1.034m14.708 7.172q-1.76 0-3.146-.726a5.5 5.5 0 0 1-2.134-2.046q-.77-1.32-.77-2.992 0-1.695.77-2.992a5.4 5.4 0 0 1 2.112-2.024q1.365-.748 3.124-.748 1.695 0 3.102.858 1.409.858 2.024 2.486l-3.256 1.1q-.241-.528-.814-.858a2.23 2.23 0 0 0-1.232-.352q-.682 0-1.21.33a2.26 2.26 0 0 0-.814.88q-.286.571-.286 1.32t.286 1.32q.308.55.836.88.55.33 1.232.33.683 0 1.232-.352.55-.352.814-.924l3.256 1.1q-.638 1.65-2.046 2.53-1.386.88-3.08.88m11.305 0q-1.958 0-2.926-.924-.946-.945-.946-2.684v-4.774h-1.716V29h1.716v-3.432h3.432V29h2.508v2.882h-2.508v3.916q0 .66.242.968t.748.308q.198 0 .462-.088a2.6 2.6 0 0 0 .484-.264l1.188 2.508a4.9 4.9 0 0 1-1.276.748q-.726.285-1.408.286M158.39 40V29h3.432v11zm1.716-12.408q-.77 0-1.364-.572-.572-.594-.572-1.364 0-.814.572-1.364.594-.572 1.364-.572.792 0 1.364.572.572.55.572 1.364 0 .77-.572 1.364a1.86 1.86 0 0 1-1.364.572m9.49 12.672q-1.737 0-3.058-.726a5.6 5.6 0 0 1-2.09-2.046q-.748-1.298-.748-2.992 0-1.695.726-2.992a5.3 5.3 0 0 1 2.068-2.024q1.343-.748 3.036-.748 1.738 0 3.058.748a5.1 5.1 0 0 1 2.068 2.024q.748 1.298.748 2.992 0 1.695-.748 2.992a5.3 5.3 0 0 1-2.046 2.046q-1.32.726-3.014.726m0-3.168q.66 0 1.166-.33.529-.33.814-.902.308-.593.308-1.364 0-.77-.308-1.342a2.17 2.17 0 0 0-.814-.924 2.23 2.23 0 0 0-1.21-.33q-.681 0-1.21.33-.527.33-.836.924-.286.572-.286 1.342t.286 1.364q.309.572.836.902.55.33 1.254.33M177.077 40V29h3.234l.132 1.408a4 4 0 0 1 1.342-1.232 3.6 3.6 0 0 1 1.782-.44q1.32 0 2.222.55.902.528 1.342 1.628.462 1.1.462 2.816V40h-3.432v-5.632q0-.88-.198-1.386-.198-.528-.572-.77-.352-.242-.88-.264-.99-.022-1.496.55-.506.55-.506 1.694V40zm25.402.264q-2.376 0-4.202-1.012a7.53 7.53 0 0 1-2.86-2.816q-1.035-1.804-1.034-4.114 0-2.332 1.034-4.114a7.37 7.37 0 0 1 2.838-2.816q1.825-1.035 4.18-1.034 2.353 0 4.158 1.034a7.34 7.34 0 0 1 2.86 2.816q1.034 1.782 1.034 4.114 0 2.31-1.034 4.114a7.4 7.4 0 0 1-2.816 2.816q-1.805 1.012-4.158 1.012m0-3.256q1.298 0 2.288-.594a4.1 4.1 0 0 0 1.54-1.65q.55-1.078.55-2.442 0-1.386-.572-2.442a4.2 4.2 0 0 0-1.562-1.672q-.99-.616-2.288-.616t-2.288.616a4.2 4.2 0 0 0-1.562 1.672q-.573 1.056-.572 2.442 0 1.364.572 2.442a4.2 4.2 0 0 0 1.584 1.65q1.011.594 2.31.594m16.345 3.256q-1.056 0-1.848-.418a3.7 3.7 0 0 1-1.32-1.254L215.524 40h-3.256V24.6h3.432v5.72a3.5 3.5 0 0 1 1.298-1.166q.792-.418 1.826-.418 1.54 0 2.662.704 1.122.682 1.716 1.98.594 1.275.594 3.08 0 1.782-.594 3.08t-1.716 2.002q-1.122.682-2.662.682m-.88-3.168q.66 0 1.166-.33.507-.33.814-.902.309-.593.308-1.364 0-.77-.286-1.342a2.17 2.17 0 0 0-.814-.924 2.1 2.1 0 0 0-1.166-.33q-.66 0-1.188.33-.506.33-.792.924T215.7 34.5q0 .77.286 1.364.286.572.792.902t1.166.33m11.652 3.168a6.5 6.5 0 0 1-2.024-.308 5.1 5.1 0 0 1-1.628-.88 3.64 3.64 0 0 1-1.012-1.43l2.838-1.188q.287.55.792.836a2.2 2.2 0 0 0 1.034.264q.528 0 .836-.176.308-.198.308-.528a.62.62 0 0 0-.308-.55q-.308-.198-.902-.352l-.968-.22q-1.518-.396-2.354-1.32t-.836-2.134q0-1.694 1.166-2.618t3.234-.924q1.188 0 2.068.33.902.308 1.496.88.616.55.88 1.276l-2.728 1.144q-.154-.44-.638-.682a2.3 2.3 0 0 0-1.034-.242q-.484 0-.748.22a.69.69 0 0 0-.264.55q0 .264.308.462.33.175.946.33l1.166.286q1.034.264 1.738.814.703.528 1.056 1.254.352.704.352 1.518 0 1.056-.616 1.826-.594.748-1.672 1.166-1.078.396-2.486.396m11.671 0q-1.716 0-3.036-.726a5.3 5.3 0 0 1-2.068-2.024q-.747-1.298-.748-3.014 0-1.716.748-3.014a5.3 5.3 0 0 1 2.068-2.024q1.343-.726 3.08-.726 1.562 0 2.816.748 1.254.749 1.98 2.244.748 1.474.748 3.652h-7.876q.11.946.77 1.518.682.55 1.606.55.815 0 1.364-.352.55-.374.77-.924l3.058 1.034a4.46 4.46 0 0 1-1.254 1.738 5.2 5.2 0 0 1-1.826 1.012 7.7 7.7 0 0 1-2.2.308m-2.2-7.172h4.202q-.088-.638-.418-1.012a1.9 1.9 0 0 0-.77-.572 2.4 2.4 0 0 0-.88-.176q-.418 0-.88.176a1.9 1.9 0 0 0-.814.55q-.33.375-.44 1.034M248.298 40V29h3.432v2.046a4.43 4.43 0 0 1 1.738-1.562 4.8 4.8 0 0 1 2.156-.528V32.3a8 8 0 0 0-1.914.22q-.88.22-1.43.682-.55.44-.55 1.144V40zm12.241 0-4.466-11h3.542l2.64 7.084L264.873 29h3.542l-4.466 11zm14.029.264q-1.716 0-3.036-.726a5.3 5.3 0 0 1-2.068-2.024q-.748-1.298-.748-3.014t.748-3.014a5.3 5.3 0 0 1 2.068-2.024q1.342-.726 3.08-.726 1.562 0 2.816.748 1.254.749 1.98 2.244.748 1.474.748 3.652h-7.876q.11.946.77 1.518.682.55 1.606.55.814 0 1.364-.352.55-.374.77-.924l3.058 1.034a4.46 4.46 0 0 1-1.254 1.738 5.2 5.2 0 0 1-1.826 1.012 7.7 7.7 0 0 1-2.2.308m-2.2-7.172h4.202q-.088-.638-.418-1.012a1.9 1.9 0 0 0-.77-.572 2.4 2.4 0 0 0-.88-.176q-.418 0-.88.176a1.9 1.9 0 0 0-.814.55q-.33.375-.44 1.034M281.599 40V29h3.432v2.046a4.43 4.43 0 0 1 1.738-1.562 4.8 4.8 0 0 1 2.156-.528V32.3a8 8 0 0 0-1.914.22q-.88.22-1.43.682-.55.44-.55 1.144V40z"/>
+  <defs>
+    <linearGradient id="a" x1="22.5" x2="43.5" y1="22.5" y2="43.5" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#816dd2"/>
+      <stop offset="1" stop-color="#22d3ee"/>
+    </linearGradient>
+  </defs>
+</svg>
diff --git a/apps/docs/public/logo-horizontal.svg b/apps/docs/public/logo-horizontal.svg
index a25fb66d..3d4c9100 100644
--- a/apps/docs/public/logo-horizontal.svg
+++ b/apps/docs/public/logo-horizontal.svg
@@ -1,11 +1,9 @@
 <?xml version="1.0"?>
-<svg xmlns="http://www.w3.org/2000/svg" width="290" height="48" fill="none">
+<svg xmlns="http://www.w3.org/2000/svg" width="290" height="48" viewBox="0 0 290 48" fill="none">
   <title>React Intersection Observer</title>
   <style>
-    @media (prefers-color-scheme: dark) {
-      path[stroke="#000"] { stroke: #f5f3ff; }
-      path[fill="#1a1a1a"] { fill: #f5f3ff; }
-    }
+    path[stroke="#000"] { stroke: currentColor; }
+    path[fill="#1a1a1a"] { fill: currentColor; }
   </style>
   <path stroke="#000" stroke-linecap="round" stroke-width="4" d="M5.25 21v-9.75c0-3.3 2.7-6 6-6h9m7.5 0h9c3.3 0 6 2.7 6 6v6m-37.5 10.5v9c0 3.3 2.7 6 6 6h6"/>
   <path fill="url(#a)" d="M37.5 22.5h-9a6 6 0 0 0-6 6v9a6 6 0 0 0 6 6h9a6 6 0 0 0 6-6v-9a6 6 0 0 0-6-6"/>
diff --git a/apps/docs/theme.css b/apps/docs/theme.css
new file mode 100644
index 00000000..6e2deca0
--- /dev/null
+++ b/apps/docs/theme.css
@@ -0,0 +1,19 @@
+@media (max-width: 29.999rem) {
+  [data-blume-header] > .flex.items-center.gap-2 {
+    display: none;
+  }
+
+  [data-docs-logo] {
+    flex: none;
+  }
+
+  [data-docs-logo-mobile] {
+    display: inline-flex;
+  }
+}
+
+@media (min-width: 30rem) and (max-width: 47.999rem) {
+  [data-docs-logo-graphic] {
+    display: inline-flex;
+  }
+}