diff --git a/templates/base.html b/templates/base.html
index 685fe94..72e7311 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -55,21 +55,48 @@
   <meta name="theme-color" content="#ffffff">
 
   <script>
-    function thing() {
-      document.getElementById("navbar").classList.toggle("open");
+    function toggleMobileMenu() {
+      const menu = document.getElementById("mobile-menu");
+      const btn = document.getElementById("mobile-menu-btn");
+      const icon = btn.querySelector("i");
+      menu.classList.toggle("hidden");
+      const isOpen = !menu.classList.contains("hidden");
+      icon.classList.toggle("bi-list", !isOpen);
+      icon.classList.toggle("bi-x-lg", isOpen);
     }
   </script>
 </head>
 
 <body>
+  <div id="mobile-menu" class="md:hidden hidden fixed inset-x-0 top-0 bg-white z-50 border-b shadow-lg">
+    <div class="flex justify-between items-center p-4">
+      <img src="/assets/logo.svg" alt="BMT Logo" width="44" class="-mt-1">
+      <button class="p-2" onclick="toggleMobileMenu()">
+        <i class="bi bi-x-lg text-2xl"></i>
+      </button>
+    </div>
+    <nav class="flex flex-col gap-2 p-4 pt-0">
+      {{ macros::mobile_nav_link(path="@/_index.md", label="Home") }}
+      {{ macros::mobile_nav_link(path="@/news/_index.md", label="News") }}
+      {{ macros::mobile_nav_link(path="@/blog/_index.md", label="Blog") }}
+      {{ macros::mobile_nav_link(path="@/about.md", label="About") }}
+      {{ macros::mobile_nav_link(path="@/resources/index.md", label="Resources") }}
+      {{ macros::mobile_nav_link(path="@/events/bmmt-2026.md", label="BmMT 2026") }}
+      {{ macros::mobile_nav_link(path="@/events/bmt-2025-online.md", label="BMT 2025 Online") }}
+    </nav>
+  </div>
+
   <div class="max-w-4xl min-h-screen p-4 md:p-8 mx-auto flex flex-col gap-8">
+    <button id="mobile-menu-btn" class="md:hidden fixed top-4 right-4 border py-2 px-3 rounded-xl bg-white z-50" onclick="toggleMobileMenu()">
+      <i class="bi bi-list text-xl"></i>
+    </button>
+
     {% block header %}
     <header class="flex flex-col gap-4 text-center">
       <a class="mx-auto" href="/"><img src="/assets/logo.svg" alt="BMT Logo" width="80"></a>
       <p class="text-2xl font-bold">Berkeley Math Tournament</p>
 
-      <nav id="navbar"
-        class="[&.open>a.nav-hidden]:block [&>a.nav-hidden]:hidden flex flex-col md:flex-row md:mx-auto gap-4 items-stretch">
+      <nav class="hidden md:flex md:flex-row md:mx-auto gap-4 items-stretch">
         {{ macros::nav_link(path="@/_index.md", label="Home") }}
         {{ macros::nav_link(path="@/news/_index.md", label="News") }}
         {{ macros::nav_link(path="@/blog/_index.md", label="Blog") }}
diff --git a/templates/macros.html b/templates/macros.html
index 43df2ec..8a308f8 100644
--- a/templates/macros.html
+++ b/templates/macros.html
@@ -43,29 +43,24 @@ <h2 class="mt-4 col-span-2 text-sm text-gray-400">{{ year }}</h2>
 {% set href = get_url(path=path) %}
 {% set active = current_url | default(value='') == href %}
 
-{# Desktop version #}
-<p class="hidden md:block first:hidden text-gray-400">⁄</p>
-<div class="hidden md:block relative">
+<p class="first:hidden text-gray-400">⁄</p>
+<div class="relative">
   <span class="invisible font-semibold">{{ label }}</span>
   <a href="{{ href }}"
     class="absolute inset-0 text-center text-gray-600 {% if active %} !text-black font-semibold {% endif %}">
     {{ label }}
   </a>
 </div>
+{% endmacro nav_link %}
 
-{# Mobile version #}
-{% if active %}
-<button class="md:hidden order-1 font-semibold border py-2 px-3 rounded-xl relative" onclick="thing()">
-  {{ label }}
-  <i class="bi bi-chevron-down [.open_&]:-scale-y-100 transition-transform absolute right-4"></i>
-</button>
-{% else %}
-<a href="{{ href }}" class="py-2 px-3 bg-gray-100 border rounded-xl nav-hidden order-2">
+{% macro mobile_nav_link(path, label) %}
+{% set href = get_url(path=path) %}
+{% set active = current_url | default(value='') == href %}
+
+<a href="{{ href }}" class="py-2 px-3 rounded-lg {% if active %} bg-gray-100 font-semibold {% endif %}">
   {{ label }}
 </a>
-{% endif %}
-
-{% endmacro nav_link %}
+{% endmacro mobile_nav_link %}
 
 {% macro index_math() %}
 <span class="katex-display"><span class="katex"><span class="katex-mathml"><math xmlns="http://www.w3.org/1998/Math/MathML" display="block"><semantics><mrow><mi>F</mi><mo stretchy="false">(</mo><mi>z</mi><mo stretchy="false">)</mo><mo>=</mo><munderover><mo>∑</mo><mrow><mi>n</mi><mo>=</mo><mn>0</mn></mrow><mi mathvariant="normal">∞</mi></munderover><msub><mi>f</mi><mi>n</mi></msub><mfrac><msup><mi>z</mi><mi>n</mi></msup><mrow><mi>n</mi><mo stretchy="false">!</mo></mrow></mfrac></mrow><annotation encoding="application/x-tex">F(z) = \sum_{n=0}^\infty f_n \frac{z^n}{n!}</annotation></semantics></math></span><span class="katex-html" aria-hidden="true"><span class="base"><span class="strut" style="height: 1em; vertical-align: -0.25em;"></span><span class="mord mathnormal" style="margin-right: 0.1389em;">F</span><span class="mopen">(</span><span class="mord mathnormal" style="margin-right: 0.044em;">z</span><span class="mclose">)</span><span class="mspace" style="margin-right: 0.2778em;"></span><span class="mrel">=</span><span class="mspace" style="margin-right: 0.2778em;"></span></span><span class="base"><span class="strut" style="height: 2.9185em; vertical-align: -1.2671em;"></span><span class="mop op-limits"><span class="vlist-t vlist-t2"><span class="vlist-r"><span class="vlist" style="height: 1.6514em;"><span class="" style="top: -1.8829em; margin-left: 0em;"><span class="pstrut" style="height: 3.05em;"></span><span class="sizing reset-size6 size3 mtight"><span class="mord mtight"><span class="mord mathnormal mtight">n</span><span class="mrel mtight">=</span><span class="mord mtight">0</span></span></span></span><span class="" style="top: -3.05em;"><span class="pstrut" style="height: 3.05em;"></span><span class=""><span class="mop op-symbol large-op">∑</span></span></span><span class="" style="top: -4.3em; margin-left: 0em;"><span class="pstrut" style="height: 3.05em;"></span><span class="sizing reset-size6 size3 mtight"><span class="mord mtight">∞</span></span></span></span><span class="vlist-s">&ZeroWidthSpace;</span></span><span class="vlist-r"><span class="vlist" style="height: 1.2671em;"><span class=""></span></span></span></span></span><span class="mspace" style="margin-right: 0.1667em;"></span><span class="mord"><span class="mord mathnormal" style="margin-right: 0.1076em;">f</span><span class="msupsub"><span class="vlist-t vlist-t2"><span class="vlist-r"><span class="vlist" style="height: 0.1514em;"><span class="" style="top: -2.55em; margin-left: -0.1076em; margin-right: 0.05em;"><span class="pstrut" style="height: 2.7em;"></span><span class="sizing reset-size6 size3 mtight"><span class="mord mathnormal mtight">n</span></span></span></span><span class="vlist-s">&ZeroWidthSpace;</span></span><span class="vlist-r"><span class="vlist" style="height: 0.15em;"><span class=""></span></span></span></span></span></span><span class="mord"><span class="mopen nulldelimiter"></span><span class="mfrac"><span class="vlist-t vlist-t2"><span class="vlist-r"><span class="vlist" style="height: 1.3414em;"><span class="" style="top: -2.314em;"><span class="pstrut" style="height: 3em;"></span><span class="mord"><span class="mord mathnormal">n</span><span class="mclose">!</span></span></span><span class="" style="top: -3.23em;"><span class="pstrut" style="height: 3em;"></span><span class="frac-line" style="border-bottom-width: 0.04em;"></span></span><span class="" style="top: -3.677em;"><span class="pstrut" style="height: 3em;"></span><span class="mord"><span class="mord"><span class="mord mathnormal" style="margin-right: 0.044em;">z</span><span class="msupsub"><span class="vlist-t"><span class="vlist-r"><span class="vlist" style="height: 0.6644em;"><span class="" style="top: -3.063em; margin-right: 0.05em;"><span class="pstrut" style="height: 2.7em;"></span><span class="sizing reset-size6 size3 mtight"><span class="mord mathnormal mtight">n</span></span></span></span></span></span></span></span></span></span></span><span class="vlist-s">&ZeroWidthSpace;</span></span><span class="vlist-r"><span class="vlist" style="height: 0.686em;"><span class=""></span></span></span></span></span><span class="mclose nulldelimiter"></span></span></span></span></span></span>
