diff --git a/docs/DESIGN-SYSTEM.md b/docs/DESIGN-SYSTEM.md
index d8b159e..35d58b4 100644
--- a/docs/DESIGN-SYSTEM.md
+++ b/docs/DESIGN-SYSTEM.md
@@ -327,3 +327,30 @@ auslösenden Knopf zurück.
 (5,15:1 auf Weiß), nicht auf `neutral-600` (3,68:1 — unter WCAG AA). Das
 entspricht dem a11y-Override im Zielsystem. `text-neutral-subtle` ist ein
 Placeholder-Token und für lesbaren Text nicht geeignet.
+
+---
+
+## Kartenhöhen in einer Zeile
+
+Karten einer Zeile sind **gleich hoch, aber nicht gleich voll**. Die Höhe gibt
+die inhaltsreichste Karte vor; die übrigen strecken sich mit und verteilen den
+Überschuss oben und unten je zur Hälfte (`justify-center` im Kartenkörper).
+
+Vorher waren die Zeilen oben bündig (`items-start`), und jede Karte endete dort,
+wo ihr Inhalt endete. Bei ähnlich vollen Karten fiel das nicht auf. Bei dünner
+Datenlage schon: Ein Balkendiagramm mit einer einzigen Kategorie war 112 px
+hoch und stand neben einem Zeitverlauf mit 427 px — 315 px Seitenhintergrund
+als Loch dazwischen. Das liest sich nicht als „wenig Daten", sondern als
+„etwas ist kaputt".
+
+Die Leere verschwindet dadurch nicht — sie zieht aus dem Seitenhintergrund in
+die Karte. Das ist der Unterschied zwischen einem Raster mit Lücken und einer
+Karte, in der gerade wenig steht.
+
+**Die Karten bleiben dabei dynamisch.** Es gibt keine feste Höhe: Kommt mehr
+Inhalt hinein, wächst die Karte und mit ihr die ganze Zeile.
+
+**Ausnahme: Zeilen mit Tabellen.** Eine Tabelle hat ein natürliches Ende und
+eine eigene Fußzeile zum Blättern. Sie zu strecken schiebt nur die Blätterleiste
+nach unten. Solche Zeilen bleiben oben bündig — im Prototyp die
+Reaktivierungs- und Zahlungsmoral-Tabellen auf der Kundenseite.
diff --git a/features/dashboard/components/cards/ChartCard.tsx b/features/dashboard/components/cards/ChartCard.tsx
index e0875e6..3080bf8 100644
--- a/features/dashboard/components/cards/ChartCard.tsx
+++ b/features/dashboard/components/cards/ChartCard.tsx
@@ -138,7 +138,12 @@ export function ChartCard({
 
       {legende ? <div className="flex-none px-4 pb-2">{legende}</div> : null}
 
-      <div className="min-h-0 grow px-4 pb-4">{children}</div>
+      {/* justify-center: Karten einer Zeile sind gleich hoch, aber nicht gleich
+          voll. Eine Karte mit einem Balken neben einer mit einem Diagramm über
+          400 px bekommt den Überschuss oben und unten je zur Hälfte, statt ihn
+          unten abzuladen. Der Inhalt behält seine natürliche Höhe — die Karte
+          wächst weiter mit, wenn mehr hineinkommt. */}
+      <div className="flex min-h-0 grow flex-col justify-center px-4 pb-4">{children}</div>
     </section>
   );
 }
diff --git a/features/dashboard/components/dashboard/WidgetKachel.tsx b/features/dashboard/components/dashboard/WidgetKachel.tsx
index 391afa6..eb1fcac 100644
--- a/features/dashboard/components/dashboard/WidgetKachel.tsx
+++ b/features/dashboard/components/dashboard/WidgetKachel.tsx
@@ -109,7 +109,12 @@ export function WidgetKachel({
         </span>
       </header>
 
-      <div className="min-h-0 grow px-4 pb-4">{children}</div>
+      {/* justify-center: Karten einer Zeile sind gleich hoch, aber nicht gleich
+          voll. Eine Karte mit einem Balken neben einer mit einem Diagramm über
+          400 px bekommt den Überschuss oben und unten je zur Hälfte, statt ihn
+          unten abzuladen. Der Inhalt behält seine natürliche Höhe — die Karte
+          wächst weiter mit, wenn mehr hineinkommt. */}
+      <div className="flex min-h-0 grow flex-col justify-center px-4 pb-4">{children}</div>
 
       {absprung ? (
         <footer className="dv-no-print flex flex-none items-center px-4 pb-4">
diff --git a/features/dashboard/pages/AuftraegeSeite.tsx b/features/dashboard/pages/AuftraegeSeite.tsx
index aad1b2b..159ee74 100644
--- a/features/dashboard/pages/AuftraegeSeite.tsx
+++ b/features/dashboard/pages/AuftraegeSeite.tsx
@@ -142,7 +142,7 @@ export function AuftraegeSeite({ vm }: { vm: VMState<AuftraegeDaten> }) {
           />
         </Raster>
 
-        <div className="grid grid-cols-1 items-start gap-4 xl:grid-cols-3">
+        <div className="grid grid-cols-1 gap-4 xl:grid-cols-3">
           <ChartCard
             id="auftraege-eingang"
             titel="Auftragseingang"
@@ -172,7 +172,7 @@ export function AuftraegeSeite({ vm }: { vm: VMState<AuftraegeDaten> }) {
           </ChartCard>
         </div>
 
-        <div className="grid grid-cols-1 items-start gap-4 lg:grid-cols-3">
+        <div className="grid grid-cols-1 gap-4 lg:grid-cols-3">
           <ChartCard
             id="auftraege-status"
             titel="Vorgänge nach Status"
diff --git a/features/dashboard/pages/FinanzenSeite.tsx b/features/dashboard/pages/FinanzenSeite.tsx
index 8dd0d1a..b5568ea 100644
--- a/features/dashboard/pages/FinanzenSeite.tsx
+++ b/features/dashboard/pages/FinanzenSeite.tsx
@@ -191,7 +191,7 @@ export function FinanzenSeite({ vm }: { vm: VMState<FinanzenDaten> }) {
           </ChartCard>
         </div>
 
-        <div className="grid grid-cols-1 items-start gap-4 lg:grid-cols-3">
+        <div className="grid grid-cols-1 gap-4 lg:grid-cols-3">
           <ChartCard
             className="lg:col-span-2"
             id="finanzen-alter"
diff --git a/features/dashboard/pages/KundenSeite.tsx b/features/dashboard/pages/KundenSeite.tsx
index e8e077b..8428be8 100644
--- a/features/dashboard/pages/KundenSeite.tsx
+++ b/features/dashboard/pages/KundenSeite.tsx
@@ -133,7 +133,7 @@ export function KundenSeite({ vm }: { vm: VMState<KundenDaten> }) {
           />
         </Raster>
 
-        <div className="grid grid-cols-1 items-start gap-4 xl:grid-cols-3">
+        <div className="grid grid-cols-1 gap-4 xl:grid-cols-3">
           <ChartCard
             id="kunden-entwicklung"
             titel="Neukunden im Zeitverlauf"
@@ -158,7 +158,7 @@ export function KundenSeite({ vm }: { vm: VMState<KundenDaten> }) {
           </ChartCard>
         </div>
 
-        <div className="grid grid-cols-1 items-start gap-4 lg:grid-cols-2">
+        <div className="grid grid-cols-1 gap-4 lg:grid-cols-2">
           <ChartCard id="kunden-typ" titel="Kundenstruktur" untertitel="Privat, Gewerbe, Verwaltung">
             <Donut
               daten={d.nachTyp}
diff --git a/features/dashboard/pages/TeamSeite.tsx b/features/dashboard/pages/TeamSeite.tsx
index 3f2bbf3..11f443b 100644
--- a/features/dashboard/pages/TeamSeite.tsx
+++ b/features/dashboard/pages/TeamSeite.tsx
@@ -159,7 +159,7 @@ export function TeamSeite({ vm }: { vm: VMState<TeamDaten> }) {
           />
         </ChartCard>
 
-        <div className="grid grid-cols-1 items-start gap-4 lg:grid-cols-2">
+        <div className="grid grid-cols-1 gap-4 lg:grid-cols-2">
           <ChartCard
             id="team-abschluesse"
             titel="Abschlüsse je Mitarbeiter"
diff --git a/features/dashboard/pages/UebersichtSeite.tsx b/features/dashboard/pages/UebersichtSeite.tsx
index 9be4bc3..9475aaa 100644
--- a/features/dashboard/pages/UebersichtSeite.tsx
+++ b/features/dashboard/pages/UebersichtSeite.tsx
@@ -131,7 +131,7 @@ export function UebersichtSeite({ vm }: { vm: VMState<UebersichtDaten> }) {
           <AlertList eintraege={d.alerts} spalten={2} />
         </ChartCard>
 
-        <div className="grid grid-cols-1 items-start gap-4 xl:grid-cols-3">
+        <div className="grid grid-cols-1 gap-4 xl:grid-cols-3">
           <ChartCard
             id="uebersicht-umsatzverlauf"
             titel="Zahlungseingang im Zeitverlauf"
@@ -181,7 +181,7 @@ export function UebersichtSeite({ vm }: { vm: VMState<UebersichtDaten> }) {
           </ChartCard>
         </div>
 
-        <div className="grid grid-cols-1 items-start gap-4 lg:grid-cols-2">
+        <div className="grid grid-cols-1 gap-4 lg:grid-cols-2">
           <ChartCard
             id="uebersicht-trichter"
             titel="Vertriebstrichter"