diff --git a/docs/astro.config.mjs b/docs/astro.config.mjs
index 28813de..0405e86 100644
--- a/docs/astro.config.mjs
+++ b/docs/astro.config.mjs
@@ -2,5 +2,6 @@
 import { defineConfig } from "astro/config";
 
 export default defineConfig({
-  site: "https://squill.tree.ht",
+	site: "https://mckayla.dev",
+	base: "/squill",
 });
diff --git a/docs/src/pages/index.astro b/docs/src/pages/index.astro
index 611d443..8c0fbb3 100644
--- a/docs/src/pages/index.astro
+++ b/docs/src/pages/index.astro
@@ -1,4 +1,5 @@
 ---
+const base = import.meta.env.BASE_URL.replace(/\/$/, "");
 const before = `select w.id, w.name, count(*) as build_count from workspaces w join workspace_builds wb on wb.workspace_id = w.id where w.deleted = false and w.last_used_at > NOW() - interval '30 days' group by w.id, w.name order by build_count desc limit 20;
 
 CREATE FUNCTION notify_workspace_change() RETURNS trigger SECURITY DEFINER AS $$ BEGIN PERFORM pg_notify('workspaces', NEW.id::text); RETURN NEW; END; $$ LANGUAGE plpgsql;`;
@@ -32,7 +33,7 @@ $$;`;
       name="description"
       content="A fast, trustworthy SQL formatter for Postgres and SQLite, with embedded-SQL support for Rust, Go, Python, JavaScript/TypeScript, and Gleam."
     />
-    <link rel="icon" type="image/svg+xml" href="/squill-mark.svg" />
+    <link rel="icon" type="image/svg+xml" href={`${base}/squill-mark.svg`} />
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link
@@ -44,7 +45,7 @@ $$;`;
     <main>
       <nav>
         <div class="brand">
-          <img src="/squill-mark.svg" width="28" height="28" alt="" />
+          <img src={`${base}/squill-mark.svg`} width="28" height="28" alt="" />
           <span class="wordmark">squill</span>
         </div>
         <div class="links">
@@ -55,7 +56,7 @@ $$;`;
 
       <header>
         <div class="masthead">
-          <img src="/squill-mark.svg" width="72" height="72" alt="squill mark" />
+          <img src={`${base}/squill-mark.svg`} width="72" height="72" alt="squill mark" />
           <div>
             <h1>squill</h1>
             <p class="tagline">A SQL formatter you can trust.</p>
@@ -77,7 +78,7 @@ $$;`;
         <div class="label">01 — before &amp; after</div>
         <div class="panes">
           <div class="toolbar">
-            <img src="/squill-mark-white.svg" width="18" height="18" alt="" />
+            <img src={`${base}/squill-mark-white.svg`} width="18" height="18" alt="" />
             <span class="toolbar-name">squill</span>
             <span class="toolbar-note">fmt</span>
             <span class="chip">postgres</span>