# Dialog Cards: individual images and flip control

Each card now offers an optional project-image selector and PNG/JPEG/WebP upload. Cards may use different images, reuse an image, or remain text-only. Alternative text and removal are available per card. The selected image appears on both faces, matching the pinned native H5P Dialogcards library; front/back text remains independent.

The missing image support was in the custom application editor and mapper: they retained only `front`/`back` and generated native dialogs without the library's optional `image` field. Card-level `image_asset_id` and `image_alt` are now validated, restricted to the project, copied into the versioned activity content, and retained through save/reopen, preview, language refresh and SCORM export. Every referenced image receives the existing integrity checks. Text-only cards retain their existing data shape. No database migration is needed.

The native flip action worked in the tested Arabic and English activities. Two visual problems were reproduced: the H5P theme sets `--label-display: none` for narrow primary action buttons, and its absolutely positioned animated icon can overlap the Arabic label when focused. The shared activity stylesheet now keeps the Dialog Cards flip label visible and puts its icon in the normal flex layout. The fix targets the button class and preserves its configured text; a different Arabic label was also browser-tested. Native flipping, navigation and completion behavior are retained. An unresponsive flip action was not reproduced.

Validation: production TypeScript/Vite build and focused ESLint passed; 11 frontend H5P tests passed; the complete H5P backend suite passed 14 tests / 1,093 assertions using guarded in-memory SQLite and fake storage. The image regression covers distinct images, text-only cards, editing/reopening/removal, native preview/export, private asset delivery, foreign-project rejection, invalid IDs and tampering. Browser checks use a generated SCORM package with real pinned libraries and cover Arabic/RTL desktop/mobile layouts, images on both sides, mouse/keyboard flipping and navigation, including reduced motion. Local QA artifacts are under `out/card-qa/` and frontend `out/card-qa/` (ignored).

Deploy matching backend and frontend files, rebuild the frontend, and follow the existing configuration/route-cache release procedure. Re-export courses to include card images and the updated flip-button styles. Existing downloaded ZIPs retain their previous files. Target Moodle and physical-device testing remain separate acceptance checks.
