GAME KIT: DON|DOFF equip system — portal tooltips, kit bag sync, btn-disabled fix

- DON/DOFF buttons on left edge of game kit applet portal tooltip (mirroring FLIP/FYI)
- equip-trinket/unequip-trinket/equip-deck/unequip-deck views + URLs
- Portal stays open after DON/DOFF; buttons swap state in-place (_setEquipState)
- _syncTokenButtons: updates all .tt DON/DOFF buttons after equip state change
- _syncKitBagDialog (DOFF): replaces card with grayed placeholder icon in-place
- _refreshKitDialog (DON): re-fetches kit content so newly-equipped card appears immediately
- kit-content-refreshed event: game-kit.js re-attaches card listeners after re-fetch
- Bounding box expanded 24px left so buttons at portal edge don't trigger close
- mini-portal pinned with right (not left) so text width changes grow/shrink leftward
- btn-disabled moved dead last in .btn block — wins by source order, no !important needed
- Kit bag panel: trinket + token sections always render (placeholder when empty)
- Backstage Pass in GameKitEquipTest setUp (is_staff, natural unequipped state)
- Portal padding 0.75rem / 1.5rem; tt-description/shoptalk smaller; tt-expiry --priRd
- Wallet tokens CSS hover rule for .tt removed (portal-only now)

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

src/templates/apps/gameboard/_partials/_applet-game-kit.html

@@ -3,11 +3,14 @@
     style="--applet-cols: {{ entry.applet.grid_cols }}; --applet-rows: {{ entry.applet.grid_rows }};"
 >
     <h2><a href="{% url 'game_kit' %}">Game Kit</a></h2>
-    <div id="id_game_kit" data-equipped-id="{{ equipped_trinket_id }}" data-equipped-deck-id="{{ equipped_deck_id }}">
+    <div id="id_game_kit" data-equipped-id="{{ equipped_trinket_id|default:'' }}" data-equipped-deck-id="{{ equipped_deck_id|default:'' }}">
         {% if pass_token %}
             <div id="id_kit_pass" class="token" data-token-id="{{ pass_token.pk }}">
                 <i class="fa-solid fa-clipboard"></i>
                 <div class="tt">
+                    <div class="tt-equip-btns">
+                        {% if pass_token.pk == equipped_trinket_id %}<button class="btn btn-equip btn-disabled" data-token-id="{{ pass_token.pk }}">×</button><button class="btn btn-unequip" data-token-id="{{ pass_token.pk }}">DOFF</button>{% else %}<button class="btn btn-equip" data-token-id="{{ pass_token.pk }}">DON</button><button class="btn btn-unequip btn-disabled" data-token-id="{{ pass_token.pk }}">×</button>{% endif %}
+                    </div>
                     <h4 class="tt-title">{{ pass_token.tooltip_name }}</h4>
                     <p class="tt-description">{{ pass_token.tooltip_description }}</p>
                     {% if pass_token.tooltip_shoptalk %}
@@ -21,6 +24,9 @@
             <div id="id_kit_carte_blanche" class="token" data-token-id="{{ carte.pk }}">
                 <i class="fa-solid fa-money-check"></i>
                 <div class="tt">
+                    <div class="tt-equip-btns">
+                        {% if carte.pk == equipped_trinket_id %}<button class="btn btn-equip btn-disabled" data-token-id="{{ carte.pk }}">×</button><button class="btn btn-unequip" data-token-id="{{ carte.pk }}">DOFF</button>{% else %}<button class="btn btn-equip" data-token-id="{{ carte.pk }}">DON</button><button class="btn btn-unequip btn-disabled" data-token-id="{{ carte.pk }}">×</button>{% endif %}
+                    </div>
                     <h4 class="tt-title">{{ carte.tooltip_name }}</h4>
                     <p class="tt-description">{{ carte.tooltip_description }}</p>
                     {% if carte.tooltip_shoptalk %}
@@ -34,6 +40,9 @@
             <div id="id_kit_coin_on_a_string" class="token" data-token-id="{{ coin.pk }}">
                 <i class="fa-solid fa-medal"></i>
                 <div class="tt">
+                    <div class="tt-equip-btns">
+                        {% if coin.pk == equipped_trinket_id %}<button class="btn btn-equip btn-disabled" data-token-id="{{ coin.pk }}">×</button><button class="btn btn-unequip" data-token-id="{{ coin.pk }}">DOFF</button>{% else %}<button class="btn btn-equip" data-token-id="{{ coin.pk }}">DON</button><button class="btn btn-unequip btn-disabled" data-token-id="{{ coin.pk }}">×</button>{% endif %}
+                    </div>
                     <h4 class="tt-title">{{ coin.tooltip_name }}</h4>
                     <p class="tt-description">{{ coin.tooltip_description }}</p>
                     {% if coin.tooltip_shoptalk %}
@@ -62,6 +71,9 @@
         <div id="id_kit_{{ deck.short_key }}_deck" class="token deck-variant" data-deck-id="{{ deck.pk }}">
             <i class="fa-regular fa-id-badge"></i>
             <div class="tt">
+                <div class="tt-equip-btns">
+                    {% if deck.pk == equipped_deck_id %}<button class="btn btn-equip btn-disabled" data-deck-id="{{ deck.pk }}">×</button><button class="btn btn-unequip" data-deck-id="{{ deck.pk }}">DOFF</button>{% else %}<button class="btn btn-equip" data-deck-id="{{ deck.pk }}">DON</button><button class="btn btn-unequip btn-disabled" data-deck-id="{{ deck.pk }}">×</button>{% endif %}
+                </div>
                 <h4 class="tt-title">{{ deck.name }}</h4>
                 <p class="tt-description">{{ deck.card_count }} cards</p>
             </div>

src/templates/apps/tooltips/_tooltip.html

@@ -1,5 +1,17 @@
 <div class="tt">
 
+  {% if equippable %}
+  <div class="tt-equip-btns">
+    {% if equippable.is_equipped %}
+      <button class="btn btn-equip btn-disabled"{% if equippable.token_id %} data-token-id="{{ equippable.token_id }}"{% endif %}{% if equippable.deck_id %} data-deck-id="{{ equippable.deck_id }}"{% endif %}>×</button>
+      <button class="btn btn-unequip"{% if equippable.token_id %} data-token-id="{{ equippable.token_id }}"{% endif %}{% if equippable.deck_id %} data-deck-id="{{ equippable.deck_id }}"{% endif %}>DOFF</button>
+    {% else %}
+      <button class="btn btn-equip"{% if equippable.token_id %} data-token-id="{{ equippable.token_id }}"{% endif %}{% if equippable.deck_id %} data-deck-id="{{ equippable.deck_id }}"{% endif %}>DON</button>
+      <button class="btn btn-unequip btn-disabled"{% if equippable.token_id %} data-token-id="{{ equippable.token_id }}"{% endif %}{% if equippable.deck_id %} data-deck-id="{{ equippable.deck_id }}"{% endif %}>×</button>
+    {% endif %}
+  </div>
+  {% endif %}
+
   <h4 class="tt-title">{{ title }}</h4>
 
   {% if type_label %}<p class="tt-type">{{ type_label }}</p>{% endif %}

src/templates/core/_partials/_kit_bag_panel.html

@@ -25,10 +25,10 @@
     </div>
 </div>
 
-{% if equipped_trinket %}
 <div class="kit-bag-section">
     <span class="kit-bag-label">Trinket</span>
     <div class="kit-bag-row">
+        {% if equipped_trinket %}
         {% with token=equipped_trinket %}
         <div
             class="token"
@@ -56,11 +56,14 @@
             </div>
         </div>
         {% endwith %}
+        {% else %}
+        <div class="kit-bag-placeholder">
+            <i class="fa-solid fa-medal"></i>
+        </div>
+        {% endif %}
     </div>
 </div>
-{% endif %}
 
-{% if free_token or tithe_token %}
 <div class="kit-bag-section kit-bag-section--tokens">
     <span class="kit-bag-label">Tokens</span>
     <div class="kit-bag-row kit-bag-row--scroll">
@@ -97,6 +100,10 @@
             </div>
         </div>
         {% endif %}
+        {% if not free_token and not tithe_token %}
+        <div class="kit-bag-placeholder">
+            <i class="fa-solid fa-coins"></i>
+        </div>
+        {% endif %}
     </div>
 </div>
-{% endif %}