diff --git a/CLAUDE.md b/CLAUDE.md
index 8807557..45a5a8b 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -303,6 +303,7 @@ Keine rohen Werte in `base/layout/components/utilities.css` — es gibt für all
 | Was | Token | Anmerkung |
 |---|---|---|
 | `padding` / `margin` / `gap` | `--space-4xs … --space-7xl` (14 Stufen, 4px-Raster) | `--space-4xs` (2px) **nur** für optische Korrekturen (Icon-/Baseline-Nudges), nie fürs Layout |
+| Innenabstand von Karten-Flächen | `--pad-card` (20…32px) / `--pad-card-lg` (24…40px) | Keine festen Werte. Auf einem 309px-Handy stapeln sich Container- und Kartenabstand sonst so, dass dem Eingabefeld nur 71% der Bildschirmbreite bleiben. Die Obergrenzen entsprechen den früheren festen Werten, am Desktop ändert sich dadurch nichts. Ein harter Breakpoint (etwa „ab 310px ohne Abstand") wäre die Alternative, sieht aber bei 311px wieder falsch aus |
 | `font-size` (Text) | `--fs-300 … --fs-1000` | `--fs-550`/`--fs-690` sind die fluiden Zwischenstufen (Lead, Karten-Überschrift) |
 | `font-size` (Icons) | `--icon-s/m/l/xl` (rem), `--icon-inline-sm/--icon-inline/--icon-inline-lg` (em) | em-Stufen für Icons, die mit ihrer Textzeile mitwachsen sollen |
 | `letter-spacing` | `--ls-tight/caps/wide/wider` | |
diff --git a/public/assets/css/components.css b/public/assets/css/components.css
index dfd4b3b..6488a08 100644
--- a/public/assets/css/components.css
+++ b/public/assets/css/components.css
@@ -1776,7 +1776,11 @@
     gap: var(--space-m);
     width: 100%;
     max-width: 720px;
-    padding: var(--space-2xl);
+    /* --pad-card statt fester 32px: auf einem 309px-Handy blieben dem Eingabefeld
+       sonst nur 71% der Bildschirmbreite, weil Container- und Kartenabstand sich
+       stapeln. Obergrenze ist derselbe Wert wie vorher, am Desktop ändert sich
+       nichts. */
+    padding: var(--pad-card);
     background: var(--clr-glass-bg);
     border: 1px solid var(--clr-glass-border);
     border-radius: var(--radius-card);
@@ -2799,7 +2803,7 @@
     grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
     gap: var(--space-4xl);
     align-items: start;
-    padding: var(--space-3xl) var(--space-3xl);
+    padding: var(--pad-card-lg) var(--pad-card-lg);
     background: var(--clr-glass-bg);
     border: 1px solid var(--clr-glass-border);
     border-radius: var(--radius-card);
@@ -2832,7 +2836,7 @@
 }
 
 .group-card {
-    padding: var(--space-xl) var(--space-2xl) var(--space-2xl);
+    padding: var(--space-xl) var(--pad-card) var(--pad-card);
     background: var(--clr-glass-bg);
     border: 1px solid var(--clr-glass-border);
     border-radius: var(--radius-card);
diff --git a/public/assets/css/tokens.css b/public/assets/css/tokens.css
index 53c93a9..d904e17 100644
--- a/public/assets/css/tokens.css
+++ b/public/assets/css/tokens.css
@@ -102,6 +102,20 @@
        der meistgenutzte). Nach oben wird das Raster gröber, weil große Abstände
        das vertragen. --space-4xs (2px) ist ausschließlich für optische
        Korrekturen gedacht (Icon-/Baseline-Nudges), nicht für Layout. */
+    /* Karten-Innenabstände. Fluid statt fest, damit auf schmalen Handys nicht ein
+       Viertel der Bildschirmbreite in gestapelten Innenabständen verschwindet
+       (gemessen bei 309px: Container 11,5 + Karte 32 je Seite → nur 71% der Breite
+       blieben für das Eingabefeld). Ein harter Breakpoint bei ~310px wäre die
+       Alternative gewesen, sieht aber bei 311px wieder falsch aus.
+       Die OBERGRENZEN entsprechen genau den bisherigen festen Werten, am Desktop
+       ändert sich also nichts — es wird nur nach unten schmaler.
+       Vier Karten (fee-table, membership-card, legal__card, matchcenter-empty)
+       hatten diese clamp()-Formeln schon einzeln stehen; sie behalten ihre eigenen
+       Werte, damit ihr Desktop-Bild unangetastet bleibt. Sie hier einzusammeln ist
+       eine Aufräumung für später. */
+    --pad-card:    clamp(var(--space-m), var(--space-s) + 1.5vw, var(--space-2xl)); /* 20…32px */
+    --pad-card-lg: clamp(var(--space-l), var(--space-s) + 2.5vw, var(--space-3xl)); /* 24…40px */
+
     --space-4xs:  0.125rem;   /*   2px */
     --space-3xs:  0.25rem;    /*   4px */
     --space-2xs:  0.5rem;     /*   8px */