User: 'Kannst du den Viewport so veraendern, dass ich da scrollen kann?
Oder im Idealfall, dass sie ihn klein angezeigt wird.'
Bisher hatte die Scorecard-Page body { width:1080px; height:1350px;
overflow:hidden } — fest fuer den PDF-Render. Im Browser wurde die
Card deshalb nicht skaliert oder scrollbar gemacht; auf kleinerem
Viewport einfach abgeschnitten.
Loesung: @media screen-Block, den nur Browser sehen (WeasyPrint
rendert mit media=print, ignoriert ihn). Wrapper-Div .card-viewport
bekommt aspect-ratio 1080/1350 und max-width 1080px (oder
viewport-40px). Die Card wird per CSS-transform scale() proportional
zur Viewport-Breite verkleinert. Auf einem normalen Desktop
(1920x1080) erscheint die Card jetzt in Originalgroesse zentriert
mit dunklem Rahmen drumherum, auf Mobile skaliert sie sich passend
auf die Bildschirmbreite.
PDF-Generierung unbeeinflusst: WeasyPrint sieht nur die Default-CSS
(body 1080x1350, card 1080x1350, kein transform).
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
d2c9a805b2