Sig select: caution tooltip, FLIP/FYI stat block, keyword display

- TarotCard.cautions JSONField + cautions_json property; migrations
  0027–0029 seed The Schizo (number=1) with 4 rival-interaction cautions
  (Roman-numeral card refs: I. The Pervert / II. The Occultist, etc.)
- Sig-select overlay: FLIP (stat-block toggle) + FYI (caution tooltip)
  buttons; nav PRV/NXT portaled outside tooltip at bottom corners (z-70);
  caution tooltip covers stat block (inset:0, z-60, Gaussian blur);
  tooltip click dismisses; FLIP/FYI fully dead while btn-disabled;
  nav wraps circularly (4/4 → 1/4, 1/4 → 4/4)
- SCSS: btn-disabled specificity fix (!important); btn-nav-left/right
  classes; sig-caution-* layout; stat-face keyword lists
- Jasmine suite expanded: stat block + FLIP (5 specs), caution tooltip
  (16 specs) including wrap-around and disabled-button behaviour
- IT tests: TarotCardCautionsTest (5), SigSelectRenderingTest (8)
- Role-card SVG icons added to static/

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/static_src/scss/_tray.scss

@@ -121,24 +121,29 @@ $handle-r:         1rem;
     &::before { border-color: rgba(var(--quaUser), 1); }
 }
 
-// ─── Role card: arc-in animation (portrait) ─────────────────────────────────
+// ─── Role card: scrawl fade-in ───────────────────────────────────────────────
 @keyframes tray-role-arc-in {
-    from { opacity: 0; transform: scale(0.3) translate(-40%, -40%); }
-    to   { opacity: 1; transform: scale(1)   translate(0, 0); }
+    from { opacity: 0; }
+    to   { opacity: 1; }
 }
 
 .tray-role-card {
-    background: rgba(var(--quaUser), 0.25);
-    display: flex;
-    align-items: flex-start;
-    justify-content: flex-start;
-    padding: 0.2em;
-    font-size: 0.65rem;
-    color: rgba(var(--quaUser), 1);
-    font-weight: 600;
+    padding:  0;
+    overflow: hidden;
+    background: transparent;
 
-    &.arc-in {
-        animation: tray-role-arc-in 1.0s cubic-bezier(0.22, 1, 0.36, 1) forwards;
+    img {
+        display: block;
+        width:  100%;
+        height: 100%;
+        object-fit: cover;
+        object-position: center;
+        transform: scale(1.4);  // crop SVG's internal margins
+    }
+
+    // Cell stays static; only the scrawl image fades in.
+    &.arc-in img {
+        animation: tray-role-arc-in 1s ease forwards;
     }
 }
 
@@ -301,15 +306,7 @@ $handle-r:         1rem;
         border-bottom: none;
     }
 
-    // Role card arc-in for landscape
-    @keyframes tray-role-arc-in-landscape {
-        from { opacity: 0; transform: scale(0.3) translate(-40%, 40%); }
-        to   { opacity: 1; transform: scale(1)   translate(0, 0); }
-    }
-
-    .tray-role-card.arc-in {
-        animation: tray-role-arc-in-landscape 1.0s cubic-bezier(0.22, 1, 0.36, 1) forwards;
-    }
+    // Role card: same fade-in in landscape — no override needed.
 
     @keyframes tray-wobble-landscape {
         0%, 100% { transform: translateY(0); }