{% extends "base.html" %}
{% block title %}{{ paper.title[:70] }} — e2er{% endblock %}

{% block content %}
{% if study %}
<p class="crumb">
  <a href="/studies/{{ study.key }}">{{ study.title }}</a> · v{{ study.version }} of {{ study.of }}
  {% if study.archived %} · <span class="muted">archived</span>{% endif %}
</p>
{% endif %}
<h1>{{ paper.title }}</h1>
<p class="sub">{{ paper.research_question }}</p>
<p class="muted">
  Template: {{ paper.pipeline or "empirical" }} · {{ (paper.mode or "single_pass") | replace("_", " ") }}
  {% if paper.github_repo %} · <a href="{{ paper.github_repo }}" target="_blank" rel="noopener">{{ paper.github_repo }}</a>{% endif %}
</p>

{% if reading %}
<section class="read-row">
  {% for r in reading %}
    <a class="read-card{% if r.primary %} primary{% endif %}"
       href="/api/papers/{{ paper.id }}/artifacts/{{ r.path }}" target="_blank" rel="noopener">
      <span class="rc-label">{{ r.label }}</span>
      <span class="rc-path">{{ r.path }}</span>
    </a>
  {% endfor %}
</section>
{% endif %}

<!-- Live-updating section: status, cost meter, recent events.
     Fetched on page load and polled every 3 seconds via HTMX. -->
<section id="live"
         hx-get="/htmx/papers/{{ paper.id }}/live"
         hx-trigger="load, every 3s"
         hx-swap="innerHTML">
  <p class="muted">Loading status…</p>
</section>

<section>
  <h2>Artifacts</h2>
  {% if not groups %}
    <p class="muted">No artifacts yet.</p>
  {% else %}
  <p class="muted">
    Grouped by the phase that produced them. A file a specialist declared and
    never wrote is shown in red — the absence is the point.
  </p>
  {% for g in groups %}
    <details class="ag ag-{{ g.status }}"{% if g.status == "fail" %} open{% endif %}>
      <summary>
        <span class="ag-name">{{ g.name }}</span>
        <span class="ag-badge b-{{ g.status }}">
          {%- if g.status == "pass" -%}passed
          {%- elif g.status == "fail" -%}attention
          {%- else -%}—{%- endif -%}
        </span>
        <span class="ag-note">{{ g.note }}</span>
      </summary>
      <ul class="ag-files">
        {% for f in g.files %}
          <li class="f-{{ f.status }}">
            {% if f.status == "missing" %}
              <span class="f-path">{{ f.p }}</span>
            {% else %}
              <a class="f-path" href="/api/papers/{{ paper.id }}/artifacts/{{ f.p }}" target="_blank" rel="noopener">{{ f.p }}</a>
            {% endif %}
            {% if f.note %}<span class="f-note">{{ f.note }}</span>{% endif %}
            <span class="f-size">{% if f.status == "missing" %}—{% else %}{{ (f.b / 1000) | round | int }} KB{% endif %}</span>
          </li>
        {% endfor %}
      </ul>
    </details>
  {% endfor %}
  {% endif %}
  <p>
    <a class="btn" href="/api/papers/{{ paper.id }}/audit-bundle">Download audit bundle (.tar.gz)</a>
  </p>
</section>
{% endblock %}