diff --git a/CONVENTION.md b/CONVENTION.md
index 053ae2f..ffecd91 100644
--- a/CONVENTION.md
+++ b/CONVENTION.md
@@ -24,7 +24,9 @@ page says **Home**; its two sister sites say **Home / Samples** and
 (**Home / Samples / Learn / Basics**, **Home / Addons & Tools / sapgui**).
 The ancestors are muted links, the separator `/` is in the line colour, and
 only the last entry - the current page, not a link - is marked: the ink
-colour, weight 600 and a 2px underline in the accent. The home page reaches
+colour, weight 600 and a 2px underline in the accent. The underline takes
+no height (`margin-bottom: -3px` against its 2px line and 1px gap): the
+marked word stays level with the rest of the trail. The home page reaches
 the sister sites by a tile that opens in the same tab (→), not by a tab.
 
 ```html
diff --git a/src/styles/global.css b/src/styles/global.css
index bfdcebe..6013e3d 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -68,7 +68,7 @@ img { max-width: 100%; height: auto; }
 .sites .sep { color: var(--line); }
 .sites .brand { display: inline-flex; align-items: center; gap: 8px; color: var(--ink); font-weight: 700; letter-spacing: -.01em; margin-right: 8px; }
 .sites .brand img { width: 22px; height: 22px; }
-.sites [aria-current="page"] { color: var(--ink); font-weight: 600; border-bottom: 2px solid var(--brand); padding-bottom: 1px; }
+.sites [aria-current="page"] { color: var(--ink); font-weight: 600; border-bottom: 2px solid var(--brand); padding-bottom: 1px; margin-bottom: -3px; /* the line takes no height: the word stays level with the trail */ }
 
 /* ---- the greeting -------------------------------------------------------- */
 /* the text stands at the top of the row, where Samples, Addons and Insights