diff --git a/_includes/footer.html b/_includes/footer.html
index cdfc50a..a3581c2 100644
--- a/_includes/footer.html
+++ b/_includes/footer.html
@@ -1,26 +1,36 @@
 <!-- Shared EpiAware footer. Single source of truth; rendered on the ecosystem
-     site and the separate tutorials site (via submodule). -->
-<footer class="footer mt-auto py-4" style="border-top: 1px solid var(--bs-border-color); margin-top: 3rem; background: var(--bs-body-bg);">
-  <div class="container">
-    <div class="row align-items-center">
-      <div class="col-md-6 text-center text-md-start">
-        <span class="text-muted">EpiAware — a composable Julia ecosystem for infectious disease modelling.</span>
-      </div>
-      <div class="col-md-6">
-        <ul class="nav justify-content-center justify-content-md-end">
-          <li class="nav-item"><a class="nav-link" href="https://epiaware.org/packages/index.html">Packages</a></li>
-          <li class="nav-item"><a class="nav-link" href="https://epiaware.org/get-involved.html">Get involved</a></li>
-          <li class="nav-item"><a class="nav-link" href="https://epiaware.org/funding.html">Funding</a></li>
-          <li class="nav-item">
-            <a class="nav-link px-2" href="https://community.epinowcast.org/"
-               aria-label="epinowcast community forum"><i class="bi bi-discord"></i></a>
-          </li>
-          <li class="nav-item">
-            <a class="nav-link px-2" href="https://github.com/EpiAware"
-               aria-label="EpiAware on GitHub"><i class="bi bi-github"></i></a>
-          </li>
-        </ul>
-      </div>
+     site and the separate tutorials site (via submodule).
+
+     Uses Quarto's own .nav-footer/.nav-footer-left/-center/-right classes
+     (not a generic Bootstrap .row/.col grid) so the built-in styling —
+     muted link colour, hairline top border, spacing — applies, and so
+     Quarto's per-page repo-actions injection (Edit this page/Report an
+     issue, from repo-actions in _quarto.yml) lands inside
+     .nav-footer-center next to the other links instead of appending a
+     second, differently-styled footer row. -->
+<footer class="footer">
+  <div class="nav-footer">
+    <div class="nav-footer-left">
+      EpiAware — a composable Julia ecosystem for infectious disease modelling.
+    </div>
+    <div class="nav-footer-center">
+      <ul class="footer-items list-unstyled">
+        <li class="nav-item"><a class="nav-link" href="https://epiaware.org/packages/index.html">Packages</a></li>
+        <li class="nav-item"><a class="nav-link" href="https://epiaware.org/get-involved.html">Get involved</a></li>
+        <li class="nav-item"><a class="nav-link" href="https://epiaware.org/funding.html">Funding</a></li>
+      </ul>
+    </div>
+    <div class="nav-footer-right">
+      <ul class="footer-items list-unstyled">
+        <li class="nav-item compact">
+          <a class="nav-link" href="https://community.epinowcast.org/"
+             aria-label="epinowcast community forum"><i class="bi bi-discourse"></i></a>
+        </li>
+        <li class="nav-item compact">
+          <a class="nav-link" href="https://github.com/EpiAware"
+             aria-label="EpiAware on GitHub"><i class="bi bi-github"></i></a>
+        </li>
+      </ul>
     </div>
   </div>
 </footer>
diff --git a/_includes/navbar.html b/_includes/navbar.html
index 0f31816..9264ab9 100644
--- a/_includes/navbar.html
+++ b/_includes/navbar.html
@@ -1,19 +1,40 @@
 <!-- Shared EpiAware navbar. Single source of truth for the ecosystem site
      chrome; the separate tutorials site renders this same partial via a
-     submodule so the bar is never duplicated. -->
-<nav class="navbar navbar-expand-lg navbar-dark bg-dark" style="position: sticky; top: 0; z-index: 1030;">
-  <div class="container-fluid">
-    <a class="navbar-brand d-flex align-items-center" href="https://epiaware.org">
-      <img src="/assets/img/logo.svg" alt="EpiAware" width="28" height="28" class="me-2">
-      EpiAware
-    </a>
+     submodule so the bar is never duplicated.
+
+     format.html.include-before-body injects into Quarto's Pandoc template
+     slot, which sits *inside* <main>, not as a sibling of it — so this
+     can't be Quarto's usual header#quarto-header.fixed-top: an ancestor
+     (<main>) has its own CSS transform, and a transformed ancestor becomes
+     the containing block for position:fixed descendants, which pinned the
+     "fixed" bar partway down the page instead of the viewport top and let
+     it overlap the title. position:sticky avoids that: it needs no
+     special containing block and still stays in normal document flow, so
+     no header/body offset bookkeeping is needed either.
+
+     navbar-dark with no bg-dark: the theme (theme-light.scss/
+     theme-dark.scss $navbar-bg/$navbar-fg) supplies the actual colours
+     per light/dark mode; a hardcoded bg-dark forced a dark bar even in
+     light mode. -->
+<nav class="navbar navbar-expand-lg navbar-dark"
+     style="position: sticky; top: 0; z-index: 1030;">
+  <div class="navbar-container container-fluid">
+    <div class="navbar-brand-container">
+      <a class="navbar-brand" href="https://epiaware.org">
+        <img src="/assets/img/logo.svg" alt="EpiAware" class="navbar-logo">
+        <span class="navbar-title">EpiAware</span>
+      </a>
+    </div>
     <!-- Quarto's search JS (site_libs/quarto-search/quarto-search.js)
          hydrates any element with id="quarto-search" by id lookup, so this
          hand-placed div works the same as Quarto's own navbar-generated
          markup. Each site emits its own site_libs/quarto-search assets and
          search.json (from website.search: true in its own _quarto.yml), so
          this is deliberately per-site: the box searches whichever site it
-         is rendered on. -->
+         is rendered on. It renders as the compact search icon rather than
+         an inline text box because website.search.location is set to
+         navbar (see _quarto.yml) — without that, Quarto's default is a
+         sidebar textbox, which looks broken jammed into a navbar. -->
     <div id="quarto-search" class="" title="Search"></div>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
             data-bs-target="#epi-nav" aria-controls="epi-nav"
@@ -69,7 +90,7 @@
         <li class="nav-item me-2">
           <a class="nav-link" href="https://community.epinowcast.org/"
              aria-label="epinowcast community forum">
-            <i class="bi bi-discord"></i>
+            <i class="bi bi-discourse"></i>
           </a>
         </li>
         <li class="nav-item">
@@ -79,6 +100,11 @@
           </a>
         </li>
       </ul>
+      <div class="quarto-navbar-tools">
+        <a href="" class="quarto-color-scheme-toggle quarto-navigation-tool px-1"
+           onclick="window.quartoToggleColorScheme(); return false;"
+           title="Toggle dark mode"><i class="bi"></i></a>
+      </div>
     </div>
   </div>
 </nav>
diff --git a/_quarto.yml b/_quarto.yml
index 8592033..8376ecb 100644
--- a/_quarto.yml
+++ b/_quarto.yml
@@ -18,15 +18,22 @@ website:
   # site renders the same partials via a git submodule, so both sites
   # share one navbar and footer definition.
   #
-  # `search: true` here is still required even with no navbar/sidebar
-  # config: it is what makes Quarto emit search.json and the
-  # site_libs/quarto-search/* assets and JS. The shared navbar partial
-  # then supplies its own `<div id="quarto-search">` markup, which
-  # quarto-search.js hydrates by id regardless of where it lives in the
-  # DOM. Each site sets this independently, so search stays per-site:
-  # this site searches epiaware.org content, the tutorials site (once it
-  # sets the same flag) searches its own content.
-  search: true
+  # `search` here is still required even with no navbar/sidebar config: it
+  # is what makes Quarto emit search.json and the site_libs/quarto-search/*
+  # assets and JS. The shared navbar partial then supplies its own
+  # `<div id="quarto-search">` markup, which quarto-search.js hydrates by
+  # id regardless of where it lives in the DOM. Each site sets this
+  # independently, so search stays per-site: this site searches
+  # epiaware.org content, the tutorials site (once it sets the same flag)
+  # searches its own content.
+  #
+  # location/type must be set explicitly: with no website.navbar config to
+  # infer them from, Quarto's defaults are a sidebar search (location:
+  # sidebar, type: textbox), which renders as a permanently-open text
+  # field — broken when jammed into a navbar rather than a sidebar.
+  search:
+    location: navbar
+    type: overlay
 
 format:
   html: