{% set quote_emojis = [
    t2i_atri_font_mirror ~ '/file/1775132814629_1774881270686_爱心.gif',
    t2i_atri_font_mirror ~ '/file/1775132815504_1774881268554_可爱.gif',
    t2i_atri_font_mirror ~ '/file/1775132809943_1774881264350_睡觉.gif',
    t2i_atri_font_mirror ~ '/file/1775175892953_1774881267664_舔屏幕.gif'
] %}
{% for quote in quotes %}
<div class="quote-wrapper">
    <div class="q-flex-container">
        <div class="q-user-col">
            {% if quote.avatar_url %}
            <div class="q-avatar-box">
                <img src="{{ quote.avatar_url }}" class="q-avatar">
            </div>
            {% endif %}
        </div>

        <div class="q-content-col">
            <div class="q-sender-name">{{ quote.sender }}</div>
            <div class="q-bubble-wrap">
                <div class="q-bubble">
                    <div class="q-content">{{ quote.content }}</div>
                </div>
                <img class="quote-floating-emoji" src="{{ quote_emojis | random }}" alt="Biểu cảm trích dẫn">
            </div>
            <div class="q-analysis-note">
                <span class="note-label">📝 Phân tích hiệu suất cao của ATRI:</span>
                {{ quote.reason | safe }}
            </div>
        </div>
    </div>
</div>
{% endfor %}