Game Kit fan stage + FLIP/SPIN; sig/sea/fan refactor — TDD

- fan modal: stage block w. idle-reveal/careen-out; carousel shifts left so focused card sits left-of-center; SPIN rotates whole card via Element.animate(); FLIP toggles polarity (Levity ↔ Gravity) via perspective rotateY w. mid-flip repaint; SPIN state retained across FLIP; FLIP btn hover-revealed only when focused card or btn is hovered (:has)
- mobile breakpoints: --fan-card-w / --fan-card-h / --fan-stage-shift / --fan-carousel-step lifted to CSS vars on .tarot-fan-wrap; portrait ≤ 480px @ 150×230, landscape ≤ 500h @ 150×235; corners + face text/padding scale w. card width
- shared StageCard JS module (apps/epic/stage-card.js): fromDataset, populateCard, populateKeywords, buildInfoData, renderFyi — sig/sea/fan all delegate; ~150 lines de-duplicated
- shared @mixin stat-block-shared (SCSS) lifts duplicated stat-face / stat-keywords / sig-info rules; @mixin stage-card-polarity unifies sea-stage--levity/--gravity + fan[data-polarity] coloring
- model rename: TarotCard.reversal → reversal_qualifier (migration 0014); render-time fallback to current polarity's qualifier when blank
- class unification: .sig-info-open / .sea-info-open / .fyi-open → .fyi-open (on stat block); .sig-flip-btn / .sea-spin-btn / .fan-spin-btn → .spin-btn; same for .fyi-btn / .fyi-prev / .fyi-next
- custom combobox (apps/epic/combobox.js) replaces native <select> for PICK SEA spread picker — keyboard nav, click-outside-close, aria roles; Firefox/Chrome OS-rendered <option> ignored CSS
- Jasmine: FanStageSpec.js w. idle-reveal / population / SPIN / FYI / FLIP specs; sig + sea fixtures + IT view assertions updated for renamed classes
- 748 ITs + Jasmine green

Code architected by Disco DeDisco <discodedisco@outlook.com>
Git commit message Co-Authored-By:
Claude Sonnet 4.6 <noreply@anthropic.com>

src/templates/apps/gameboard/game_kit.html

@@ -17,11 +17,35 @@
     <div class="tarot-fan-wrap">
         <button id="id_fan_prev" class="fan-nav fan-nav--prev" aria-label="Previous card">&#8249;</button>
         <div id="id_fan_content" class="tarot-fan"></div>
+        <button id="id_fan_flip" class="btn btn-reveal fan-flip-btn" type="button">FLIP</button>
+        <div class="fan-stage-block sig-stat-block" id="id_fan_stage_block">
+            <button class="btn btn-reverse spin-btn" type="button">SPIN</button>
+            <button class="btn btn-info fyi-btn" type="button">FYI</button>
+            <div class="stat-face stat-face--upright">
+                <p class="stat-face-label">Emanation</p>
+                <ul class="stat-keywords" id="id_fan_stat_upright"></ul>
+            </div>
+            <div class="stat-face stat-face--reversed">
+                <p class="stat-face-label">Reversal</p>
+                <ul class="stat-keywords" id="id_fan_stat_reversed"></ul>
+            </div>
+            <div class="sig-info" id="id_fan_fyi_panel" style="display:none">
+                <div class="sig-info-header">
+                    <h4 class="sig-info-title"></h4>
+                    <p class="sig-info-type"></p>
+                </div>
+                <p class="sig-info-effect"></p>
+                <span class="sig-info-index"></span>
+            </div>
+            <button class="btn btn-nav-left fyi-prev" type="button">PRV</button>
+            <button class="btn btn-nav-right fyi-next" type="button">NXT</button>
+        </div>
         <button id="id_fan_next" class="fan-nav fan-nav--next" aria-label="Next card">&#8250;</button>
     </div>
 </dialog>
 {% endblock content %}
 
 {% block scripts %}
+    <script src="{% static 'apps/epic/stage-card.js' %}"></script>
     <script src="{% static 'apps/gameboard/game-kit.js' %}"></script>
 {% endblock scripts %}