create-end-card-from-reference

Purpose

Generative image models (Nano Banana 2 included) are great at product flat-lays but unreliable at typography — ad-headline text gets mangled. The fix is to split the end-card into two layers:

• Layer 1 (NB2): product flat-lay on a gradient background, NO text.
• Layer 2 (HTML hyperframe): all typography, headline, labels, arrows, wordmark.

Both layers compose via Playwright Chromium render → ffmpeg scale-down. The visual language of the resulting end-card matches the supplied reference image (e.g. AMINU skincare's "massive sans headline + outlined word + handwritten micro-labels + product flat-lay" pattern).

This atom is the proven alternative to:

• create-end-card-html — pure HTML, no AI imagery. Good for type-only cards; weak for lifestyle.
• create-end-card-branded — auto-selected lifestyle / plain-hero / generated-bg modes. Less precise control over typography placement vs product arrangement.

When to use