{{ block content }}
<style>
    .reward-card {
        text-align: center;
        padding: 36px 28px;
        background: linear-gradient(135deg, #f0fdf4 0%, #eff6ff 100%);
        border: 1px solid #e2e8f0;
        border-radius: 12px;
        margin: 8px 0 20px;
    }
    .reward-icon {
        font-size: 52px;
        margin-bottom: 14px;
        line-height: 1;
    }
    .reward-card h1 {
        font-size: 22px;
        font-weight: 700;
        color: #1e293b;
        margin: 0 0 10px;
    }
    .reward-card .reward-body {
        font-size: 15px;
        color: #4b5563;
        margin-bottom: 14px;
    }
    .email-pill {
        display: inline-block;
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 20px;
        padding: 6px 18px;
        font-weight: 600;
        color: #1e293b;
        font-size: 15px;
        margin-bottom: 14px;
    }
    .reward-note {
        font-size: 13px;
        color: #64748b;
        margin-bottom: 0;
    }
    .contact-box {
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        padding: 12px 18px;
        font-size: 13px;
        color: #64748b;
        text-align: center;
    }
    .contact-box a { color: #2563eb; text-decoration: none; }
    .contact-box a:hover { text-decoration: underline; }
</style>

<div class="reward-card">
    <div class="reward-icon">&#127873;</div>
    <h1>Thank You!</h1>
    <p class="reward-body">You've successfully completed the study. Your $10 Amazon gift card is on its way to:</p>
    <div class="email-pill">{{ email }}</div>
    <p class="reward-note">Please check your junk/spam folder if you don't receive it within 24 hours.</p>
</div>

<div class="contact-box">
    Questions? Contact us at <a href="mailto:harr1037@purdue.edu">harr1037@purdue.edu</a>
</div>

{{ endblock }}