diff --git a/app/lib/ui/widgets/top_mode_bar.dart b/app/lib/ui/widgets/top_mode_bar.dart
index 90c78e7..4060f24 100644
--- a/app/lib/ui/widgets/top_mode_bar.dart
+++ b/app/lib/ui/widgets/top_mode_bar.dart
@@ -190,14 +190,19 @@ class _ModeButton extends StatelessWidget {
       child: Container(
         padding: EdgeInsets.symmetric(
           horizontal: 24,
-          // Grosszuegiger als der aktive Zustand (6), damit dieser
-          // Button - roh, ohne umgebendes Leisten-Padding, siehe
-          // TopModeBar-Klassendoku - garantiert der hoechste Row-Inhalt
-          // bleibt und dadurch die Leiste exakt auf ihre volle Hoehe
-          // (Text + diese Polsterung) bringt, statt von einem anderen
-          // Zeileninhalt (z.B. den 34px hohen Pillen in der Mitte)
-          // ueberragt zu werden und sichtbaren Rand stehen zu lassen.
-          vertical: isActive ? 6 : 16,
+          // Inaktiv: 6 (= aktives Padding) + TopModeBar._outerPaddingV, statt
+          // eines fest verdrahteten Werts - dieser Button ist roh, ohne
+          // umgebendes Leisten-Padding (siehe Klassendoku), muss also selbst
+          // GENAU den Betrag zusaetzlich tragen, den der aktive Button durch
+          // sein wrappendes Padding bekommt, um exakt gleich hoch wie dieser
+          // (und wie der mittlere Inhalt) auszufallen. Ein fest verdrahteter
+          // Wert bliebe sonst nach einer Aenderung von _outerPaddingV zu
+          // gross und wuerde weiterhin ueberragen (frueher beobachtet: eine
+          // Halbierung von _outerPaddingV blieb dadurch am sichtbaren
+          // Randabstand komplett wirkungslos, weil dieser Button ohnehin
+          // schon der hoechste Row-Inhalt war und es dank des zu grossen
+          // festen Werts blieb).
+          vertical: isActive ? 6 : 6 + TopModeBar._outerPaddingV,
         ),
         decoration: isActive
             ? null