A.3 my_sign.html image-rendering — first visible surface — TDD. Sprint A.3 of [[project-image-based-deck-face-rendering]]. When the user's equipped deck has has_card_images=True (Minchiate Fiorentine 1860-1890 today), the saved-sig stage card on /billboard/my-sign/ renders as an <img> over the irregular-shape transparent PNG with a contour-following arcana-colored stroke — not the text fan-card scaffold. First of 6 surfaces in the image-rendering rollout (my_sea + both billboard applets + room + game_kit follow in A.5+). New TarotCard.image_url property (consumes A.2's image_filename + DeckVariant.has_card_images + django.templatetags.static.static() to produce a full static-asset URL) — empty string when has_card_images=False so legacy text-only decks (Earthman, RWS) pass through transparently. my_sign.html picker grid .sig-card elements gain data-image-url + data-arcana-key attrs (the latter for stroke-color CSS selection); the .sig-stage-card scaffold gains a hidden <img class="sig-stage-card-img"> slot that JS swaps visible when image-mode is active. stage-card.js extends fromDataset to read image_url + arcana_key; new _setImageMode(stageCard, card) toggles the .sig-stage-card--image marker class + sets data-arcana-key on the stage card + populates the img src/alt; called from populateCard so all existing sig-stage flows pick up image rendering automatically (text-mode decks still pass through since image_url is empty). SCSS: new .sig-stage-card.sig-stage-card--image rule hides the .fan-card-corner + .fan-card-face text scaffold, strips the rectangular border/padding, and applies a 4-cardinal-direction filter: drop-shadow() stack to the <img> so the stroke FOLLOWS the alpha contour of the PNG instead of tracing a rectangular bounding box (per user spec 2026-05-25 PM clarification — early draft used a rectangular border which doesn't match the irregular-card aesthetic). Stroke color is driven by a CSS custom prop --img-stroke-color defaulting to rgba(var(--quiUser), 1) (cream — minor + middle arcana); [data-arcana-key="MAJOR"] override flips it to rgba(var(--terUser), 1) (gold) per Q2 lock. mobile-safe — filter on raster images works cross-browser (the [[feedback-mobile-svg-glow]] dead-end was specifically SVG glow, not raster drop-shadows). New _seed_minchiate_image_fixtures() helper in functional_tests/sig_page.py re-seeds the minimal Minchiate fixture (DeckVariant + Il Matto + Papa Uno) needed for image FTs after TransactionTestCase's flush wipes migration data — mirrors the existing _seed_earthman_sig_pile pattern per [[feedback-transactiontestcase-flush]]. New MySignImageRenderingTest.test_saved_sig_renders_as_img_for_image_deck FT seeds Minchiate + creates a superuser test gamer (superuser auto-gets super-nomad + super-schizo Notes via the User post_save signal, which _filter_major_unlocks then lets through to expose Il Matto in the picker grid — otherwise Minchiate's sig pool is empty since it has no MIDDLE arcana cards), equips Minchiate, saves Il Matto as sig, visits /billboard/my-sign/, asserts the stage card displays + contains an <img> w. src ending in the v2-convention filename minchiate-fiorentine-1860-1890-trumps-00-il-matto.png + carries .sig-stage-card--image marker class. Out of scope for this commit (deferred to A.3 follow-up polish + A.5+): the full stat-block restructure (top-left rank+suit chip Q♥ inline w. EMANATION/REVERSAL header; title in arcana-color font; keyword reposition; FYI panel re-anchor — per the locked Q3 spec) — image card-face ships now w. the existing stat-block layout to land the visible-win first. Tests: 1 new FT green; 15/15 my_sign FT class green (no regression on the 14 existing tests); 1289/1289 IT+UT total green (68s, unchanged from A.2 since no new ITs in this commit — FT covers the wiring end-to-end). Sprint A backend foundation (A.0+A.1+A.2) + first visible surface (A.3) all landed; 5 surfaces remain (A.5-A.8 + A.4's card-deck icon)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/static_src/scss/_card-deck.scss

@@ -618,6 +618,52 @@ html:has(.sig-backdrop) {
             .sig-qualifier-above,
             .sig-qualifier-below       { opacity: 0.25; }
         }
+
+        // Sprint A.3 — image-rendering mode for decks w. DeckVariant.has_card_images=True
+        // (Minchiate Fiorentine 1860-1890 today; future image-equipped decks
+        // flip the flag to opt in). When `.sig-stage-card--image` is set by
+        // stage-card.js _setImageMode, the text scaffold (fan-card-* children)
+        // hides and an <img.sig-stage-card-img> renders inside the same shell.
+        // Card bg + border go away — the transparent PNG carries its own
+        // irregular outline; we stack four cardinal-direction drop-shadows on
+        // the <img> itself to render a stroke-like outline that FOLLOWS the
+        // alpha contour (per user spec 2026-05-25 PM — NOT a rectangular border
+        // around the bounding box). Color is arcana-driven: `--quiUser` (cream)
+        // for minor + middle, `--terUser` (gold) for major per
+        // [[project-image-based-deck-face-rendering]]'s Q2 lock.
+        &.sig-stage-card--image {
+            --img-stroke-color: rgba(var(--quiUser), 1);
+            background: transparent;
+            border: 0;
+            padding: 0;
+            overflow: visible;
+
+            &[data-arcana-key="MAJOR"] {
+                --img-stroke-color: rgba(var(--terUser), 1);
+            }
+
+            .fan-card-corner,
+            .fan-card-face {
+                display: none;
+            }
+
+            .sig-stage-card-img {
+                display: block;
+                width: 100%;
+                height: 100%;
+                object-fit: contain;
+                // 4 cardinal-direction drop-shadows track the PNG's alpha
+                // channel → contour-following stroke. 1.5px each → ~3px
+                // combined apparent stroke. Mobile-safe: opacity-based effects
+                // per [[feedback-mobile-svg-glow]] (filter on raster images
+                // works fine across browsers, the dead-end was SVG glow).
+                filter:
+                    drop-shadow( 1.5px 0     0 var(--img-stroke-color))
+                    drop-shadow(-1.5px 0     0 var(--img-stroke-color))
+                    drop-shadow( 0     1.5px 0 var(--img-stroke-color))
+                    drop-shadow( 0    -1.5px 0 var(--img-stroke-color));
+            }
+        }
     }
 
     // Stat block — same dimensions as the preview card (width × 5:8 aspect).