diff --git a/theme/default/assets/style.css b/theme/default/assets/style.css
index df9be7e..2aaea72 100644
--- a/theme/default/assets/style.css
+++ b/theme/default/assets/style.css
@@ -42,6 +42,7 @@ h1 {
     font-weight: bold;
     display: flex;
     justify-content: center;
+    align-items: center;
     gap: 10px;
     flex-wrap: wrap;
 }
@@ -64,10 +65,15 @@ h1 {
 /* Dropdown (one level, CSS-only, opens on hover / keyboard focus) */
 .nav-dropdown {
     position: relative;
-    display: inline-block;
+    display: inline-flex;
 }
 
+/* Match the plain .nav-item box exactly (it would otherwise be an inline
+   element here) and vertically center the label with its caret. */
 .nav-dropdown-toggle {
+    display: inline-flex;
+    align-items: center;
+    gap: 4px;
     cursor: pointer;
 }
 
diff --git a/theme/default/templates/header.tmpl b/theme/default/templates/header.tmpl
index b335f66..dc9faf8 100644
--- a/theme/default/templates/header.tmpl
+++ b/theme/default/templates/header.tmpl
@@ -15,9 +15,9 @@
         {% if item.children %}
         <div class="nav-dropdown">
             {% if item.url %}
-            <a href="{{ item.url }}" class="nav-item nav-dropdown-toggle">{{ item.text }} <span class="nav-caret">▾</span></a>
+            <a href="{{ item.url }}" class="nav-item nav-dropdown-toggle">{{ item.text }}<span class="nav-caret">▾</span></a>
             {% else %}
-            <span class="nav-item nav-dropdown-toggle" tabindex="0" role="button" aria-haspopup="true">{{ item.text }} <span class="nav-caret">▾</span></span>
+            <span class="nav-item nav-dropdown-toggle" tabindex="0" role="button" aria-haspopup="true">{{ item.text }}<span class="nav-caret">▾</span></span>
             {% endif %}
             <div class="nav-submenu">
                 {% for child in item.children %}