Stadionzeitungs-Cover: definite Breite im Swipe-Viewer

Das Cover fehlte am iPhone, Chrome am Desktop zeigte es. Es hatte im Viewer eine
eigene Regel mit "max-height: 72vh; width: auto" — und width:auto ist bei
inline-size-Containment genau die Falle, die für .stadionzeitung-page schon
behoben war: der Inhalt zählt für die eigene Breite per Definition nicht mit.
Sichtbar wird der Unterschied, weil .stadionzeitung-viewer__page display:flex ist:
auf einem Flex-Kind heißt width:auto "richte dich nach dem Inhalt". Chrome
rettet sich über aspect-ratio plus gestreckte Höhe, Safari nicht.

Cover und Seite stehen jetzt in EINER Regel mit derselben definiten Breite, damit
sie nicht wieder auseinanderlaufen; nur overflow-y bleibt den Seiten vorbehalten.
Gemessen bei 390px Viewport: Cover 363x559, identisch zu den Folgeseiten.

EHRLICHE GRENZE: Chrome zeigt vor und nach der Änderung dieselben Maße, der
Fehler ist im Desktop-Browser nicht reproduzierbar. Die Ursache ist damit
begründet, aber nicht bewiesen — Gegenprobe nur am echten Gerät. In CLAUDE.md
vermerkt, damit das nächste Mal niemand im Desktop-Browser "verifiziert".

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01NzeVVgMCrzCDJAKeLEdKr7

CLAUDE.md

@@ -616,8 +616,15 @@ Tabellen-Legende). Bewusste Ausnahme von der Token-Disziplin (siehe oben): ein b
 A5-Blatt ist kein responsives Website-Element und braucht eine eigene Skala. `letter-spacing`
 bleibt trotzdem über `--ls-*` (dimensionslose `em`-Vielfache, kein Konflikt). **Falle beim
 Containment:** `width: auto` + `max-height` kollabiert eine inline-size-contained Box auf ihr
-Padding (Inhalt zählt nicht mehr) — im Swipe-Modus bekommt `.stadionzeitung-page` deshalb eine
+Padding (Inhalt zählt nicht mehr) — im Swipe-Modus bekommen `.stadionzeitung-page` **und
-definite Breite (`min(calc(72vh * 148 / 210), 100%)`), nie `width: auto`. Das Cover war der
+`.stadionzeitung-cover`** deshalb eine definite Breite (`min(calc(72vh * 148 / 210), 100%)`),
+nie `width: auto`. **Beide stehen dafür in EINER Regel**, und das ist der Punkt: das Cover hatte
+als eigene Klasse zunächst nur eine „harmlose Höhen-Deckelung" mit `width: auto` und blieb am
+iPhone unsichtbar, während Chrome am Desktop es zeigte (31.07.2026). Der Unterschied entsteht,
+weil `.stadionzeitung-viewer__page` `display: flex` ist: auf einem Flex-Kind heißt `width: auto`
+„richte dich nach dem Inhalt", Chrome rettet sich über `aspect-ratio` plus gestreckte Höhe,
+Safari nicht. **Chrome kann diesen Fehler nicht reproduzieren** — wer hier etwas ändert, prüft
+es an einem echten iOS-Gerät, nicht im Desktop-Browser. Das Cover war der
 Anfang dieses Prinzips:
 Kontrast der Schlagzeile kommt aus der flachen Verlauf-Fläche selbst, bewusst **ohne** `text-shadow`:
 Chrome rendert `text-shadow` auf mehrzeiligem, umbrechendem Text (lange Gegner-Namen) beim

public/assets/css/components.css

@@ -5593,10 +5593,24 @@ a.match-row__link:hover {
    bloße Padding kollabieren (der Inhalt zählt beim Containment per
    Definition nicht mit — reproduzierbar 48px schmale Seiten). min() hält
    die Seite auf schmalen Viewports in der Track-Breite. */
-.stadionzeitung-viewer.is-enhanced .stadionzeitung-page {
+   Das COVER steht bewusst im selben Selektor, obwohl es sonst eine eigene Klasse
+   hat: es ist genauso ein inline-size-Container und war genauso betroffen. Es hatte
+   hier `width: auto` und blieb am iPhone unsichtbar, während Chrome am Desktop es
+   zeigte (31.07.2026). Der Grund für den Unterschied: .stadionzeitung-viewer__page
+   ist `display: flex`, und auf einem Flex-Kind heißt `width: auto` „richte dich nach
+   dem Inhalt" — Chrome rettet sich über aspect-ratio plus gestreckte Höhe zu einem
+   Wert, Safari nicht. Zusammen in EINER Regel, damit die beiden nicht wieder
+   auseinanderlaufen; nur das interne Scrollen bleibt den Seiten vorbehalten (das
+   Cover ist `overflow: hidden`, sein Spielerfoto darf randabfallend beschnitten
+   werden). */
+.stadionzeitung-viewer.is-enhanced .stadionzeitung-page,
+.stadionzeitung-viewer.is-enhanced .stadionzeitung-cover {
     width: min(calc(72vh * 148 / 210), 100%);
     max-width: none;
     aspect-ratio: 148 / 210;
+}
+
+.stadionzeitung-viewer.is-enhanced .stadionzeitung-page {
     overflow-y: auto;
 }
 
@@ -5691,13 +5705,11 @@ body.is-sz-full .back-to-top {
     }
 }
 
-/* Cover hat die aspect-ratio schon fest (siehe .stadionzeitung-cover) — im
+/* Die frühere Cover-Sonderregel (max-height: 72vh; width: auto) stand hier und war
-   Swipe-Modus nur dieselbe Höhen-Deckelung wie die anderen Live-Seiten. */
+   der Grund, warum das Cover am iPhone fehlte — siehe die gemeinsame Regel weiter
-.stadionzeitung-viewer.is-enhanced .stadionzeitung-cover {
+   oben bei .stadionzeitung-page. Nicht wieder einführen: „nur eine Höhen-Deckelung"
-    max-height: 72vh;
+   klingt harmlos, erzeugt auf einem Flex-Kind mit inline-size-Containment aber eine
-    width: auto;
+   Breite von null. */
-    max-width: none;
-}
 
 .stadionzeitung-viewer__print {
     display: flex;