{# Renders a single .sea-card-slot for the my-sea picker — either   #}
{# an empty drop zone (default) or a server-pre-filled slot from a  #}
{# saved MySeaDraw row. Used by iter 4b's saved-hand bypass.        #}
{#                                                                  #}
{# Args:                                                            #}
{#   position — slug of the position (lay/cover/crown/leave/loom/cross) #}
{#   saved    — saved_by_position[position] | dict | None           #}
{#   crossing — bool; pass True for the cross slot (gets the        #}
{#              `.sea-card-slot--crossing` modifier in iter-4a HTML) #}
{% if saved %}
    {# `--rank-long` squeezes 5+-char Roman numerals (XVIII, XLVIII, …) so they #}
    {# fit the slot. Added server-side here to MATCH sea.js's `_fillSlot`       #}
    {# (length >= 5) — without it a saved hand stretched the numeral back out   #}
    {# on refresh (JS-only before, user-reported 2026-05-29).                   #}
    <div class="sea-card-slot sea-card-slot--filled sea-card-slot--visible sea-card-slot--{{ saved.polarity }}{% if saved.reversed %} sea-card-slot--reversed{% endif %}{% if crossing %} sea-card-slot--crossing{% endif %}{% if saved.has_card_images %} sea-card-slot--image{% endif %}{% if saved.corner_rank|length >= 5 %} sea-card-slot--rank-long{% endif %}"
         data-card-id="{{ saved.card_id }}"
         data-pos-key="{{ position }}"
         {% if saved.has_card_images %}data-arcana-key="{{ saved.arcana }}"{% endif %}>
        {% if saved.has_card_images %}
            {# Sprint A.7-polish — image-mode slot for saved-hand bypass.    #}
            {# Shares `.sig-stage-card-img` filter chain via the comma-list  #}
            {# selector extension in `_card-deck.scss` (.sea-card-slot.--image). #}
            <img class="sig-stage-card-img" src="{{ saved.image_url }}" alt="{{ saved.name }}">
        {% else %}
            <span class="fan-corner-rank">{{ saved.corner_rank }}</span>
            {% if saved.suit_icon %}<i class="fa-solid {{ saved.suit_icon }}"></i>{% endif %}
        {% endif %}
    </div>
{% else %}
    <div class="sea-card-slot sea-card-slot--empty{% if crossing %} sea-card-slot--crossing{% endif %}"></div>
{% endif %}