{% if quotes %}
<div class="user-grid">
    {% for quote in quotes %}
    <div class="quote-item avoid-break">
        <div class="quote-avatar">
            {% if quote.avatar_url %}
            <img src="{{ quote.avatar_url }}" alt="{{ quote.sender }}">
            {% elif quote.avatar_data %}
            <img src="{{ quote.avatar_data }}" alt="{{ quote.sender }}">
            {% else %}
            <div
                style="width:100%; height:100%; display:flex; align-items:center; justify-content:center; background: #222; font-family: var(--font-mono); font-size: 10px; color: #444;">
                ID</div>
            {% endif %}
        </div>
        <div class="quote-body">
            <div class="quote-text">"{{ quote.content }}"</div>
            <div class="quote-author">-- {{ quote.sender }}</div>
            <div class="comment" style="font-size: 0.8rem;">// Reason: {{ quote.reason }}</div>
        </div>
    </div>
    {% endfor %}
</div>
{% endif %}