<div class="hero-card {% if report.reachable %}up{% else %}down{% endif %}">
    <div class="hero-status">
        {% if report.reachable %}
        <span class="status-dot up glow"></span> Running
        {% if let Some(ms) = report.latency_ms %}<span class="text-muted" style="font-size: 0.85rem; font-weight: 400;"> — {{ ms }}ms</span>{% endif %}
        {% else %}
        <span class="status-dot down"></span> Down
        {% if let Some(err) = &report.error %}<span class="text-muted" style="font-size: 0.85rem; font-weight: 400;"> — {{ err }}</span>{% endif %}
        {% endif %}
    </div>
    <div class="hero-meta">
        {{ report.address }}
        {% if let Some(v) = &report.version %}
         · v{{ v }}
            {% if let Some(matches) = report.version_matches %}
                {% if matches %}<span class="badge badge-success">matches</span>
                {% else %}<span class="badge badge-danger">mismatch</span>
                {% endif %}
            {% endif %}
        {% endif %}
    </div>
</div>
