src/web/templates/paper_detail.html

{% extends "base.html" %}
{% block title %}{{ paper.title }} — Research Intelligence{% endblock %}
{% block content %}
<div class="paper-detail">
    <div style="display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:0.5rem">
        <a href="/papers/{{ domain }}" class="back-link">&larr; Back to {{ domain_label }} papers</a>
        <div style="display:flex; gap:0.5rem; align-items:center">
            {% set paper_id = paper.id %}
            {% set user_signal = paper.user_signal if paper.user_signal is defined else None %}
            {% include "partials/signal_buttons.html" %}
        </div>
    </div>

    <h1>{{ paper.title }}</h1>

    <div class="authors">
        {% if paper.authors is string %}{{ paper.authors }}{% else %}{{ paper.authors | join(", ") }}{% endif %}
    </div>

    {% if paper.topics is iterable and paper.topics is not string and paper.topics | length > 0 %}
    <div style="display:flex; gap:0.35rem; margin-bottom:1rem; flex-wrap:wrap">
        {% for t in paper.topics %}
        <span class="badge badge--accent">{{ t }}</span>
        {% endfor %}
        {% if paper.is_discovery is defined and paper.is_discovery %}
        <span class="badge badge--discover">DISCOVER</span>
        {% endif %}
    </div>
    {% endif %}

    {% if paper.composite is not none %}
    <div class="score-grid">
        {% set axes = [
            (axis_labels[0], paper.score_axis_1),
            (axis_labels[1], paper.score_axis_2),
            (axis_labels[2], paper.score_axis_3)
        ] %}
        {% for label, val in axes %}
        {% set pct = ((val or 0) | float / 10 * 100) | round(0) | int %}
        {% set level = 'high' if pct >= 65 else ('mid' if pct >= 40 else 'low') %}
        <div class="score-item">
            <div class="label">{{ label }}</div>
            <div class="score-value score-{{ level }}">{{ val | default("&mdash;") }}<span class="max">/10</span></div>
            <div class="score-track score-track--lg">
                <div class="score-fill {{ level }}" style="width:{{ pct }}%"></div>
            </div>
        </div>
        {% endfor %}
        {% set comp_pct = ((paper.composite or 0) | float / 10 * 100) | round(0) | int %}
        {% set comp_level = 'high' if comp_pct >= 65 else ('mid' if comp_pct >= 40 else 'low') %}
        <div class="score-item score-item--composite">
            <div class="label">Composite</div>
            <div class="score-value score-{{ comp_level }}">{{ paper.composite }}<span class="max">/10</span></div>
            <div class="score-track score-track--lg">
                <div class="score-fill {{ comp_level }}" style="width:{{ comp_pct }}%"></div>
            </div>
            {% if paper.preference_boost is defined and paper.preference_boost != 0 %}
            <div class="boost-detail">
                <span class="boost-label">Preference boost:</span>
                <span class="boost-value {% if paper.preference_boost > 0 %}boost-up{% else %}boost-down{% endif %}">{{ '%+.2f'|format(paper.preference_boost) }}</span>
                <span class="boost-label">&rarr; Adjusted:</span>
                <span class="boost-value">{{ paper.adjusted_score }}</span>
            </div>
            {% endif %}
        </div>
    </div>

    {% if paper.boost_reasons is defined and paper.boost_reasons | length > 0 %}
    <div class="pref-explanation">
        <div class="pref-explanation__label">Preference Signals</div>
        <div class="pref-explanation__reasons">
            {% for reason in paper.boost_reasons %}
            <span class="pref-reason">{{ reason }}</span>
            {% endfor %}
        </div>
    </div>
    {% endif %}
    {% endif %}

    {% if paper.summary %}
    <div class="paper-summary">{{ paper.summary }}</div>
    {% endif %}

    {% if paper.s2_tldr %}
    <div style="margin:0.75rem 0; padding:0.75rem 1rem; background:var(--bg); border-radius:var(--radius); border-left:3px solid var(--purple); font-size:0.88rem; color:var(--text-secondary)">
        <span style="font-size:0.7rem; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; color:var(--purple)">S2 TL;DR</span><br>
        {{ paper.s2_tldr }}
    </div>
    {% endif %}

    {% if paper.reasoning %}
    <p class="paper-reasoning">{{ paper.reasoning }}</p>
    {% endif %}

    <div class="paper-links">
        {% if paper.arxiv_url %}<a href="{{ paper.arxiv_url }}">arXiv</a>{% endif %}
        {% if paper.pdf_url %}<a href="{{ paper.pdf_url }}">PDF</a>{% endif %}
        {% if paper.code_url %}<a href="{{ paper.code_url }}">Code</a>{% endif %}
        {% if paper.github_repo and paper.github_repo != paper.code_url %}<a href="{{ paper.github_repo }}">GitHub</a>{% endif %}
        {% if paper.hf_models %}
            {% for m in paper.hf_models[:3] %}
            <a href="https://huggingface.co/{{ m.id if m is mapping else m }}">Model: {{ (m.id if m is mapping else m)[:30] }}</a>
            {% endfor %}
        {% endif %}
        {% if paper.hf_datasets %}
            {% for d in paper.hf_datasets[:2] %}
            <a href="https://huggingface.co/datasets/{{ d.id if d is mapping else d }}">Dataset: {{ (d.id if d is mapping else d)[:30] }}</a>
            {% endfor %}
        {% endif %}
        {% if paper.hf_spaces %}
            {% for s in paper.hf_spaces[:2] %}
            <a href="https://huggingface.co/spaces/{{ s.id if s is mapping else s }}">Space: {{ (s.id if s is mapping else s)[:30] }}</a>
            {% endfor %}
        {% endif %}
    </div>

    <div class="paper-abstract">
        <strong>Abstract</strong><br><br>
        {{ paper.abstract }}
    </div>

    {% if paper.categories %}
    <div class="paper-meta">
        <strong>Categories:</strong>
        {% if paper.categories is string %}{{ paper.categories }}{% else %}{{ paper.categories | join(", ") }}{% endif %}
    </div>
    {% endif %}

    {% if paper.comment %}
    <div class="paper-meta" style="margin-top:0.4rem">
        <strong>Comment:</strong> {{ paper.comment }}
    </div>
    {% endif %}

    {# ── Connected Papers ── #}
    {% if connections and (connections.references or connections.recommendations) %}
    <div class="connected-papers">
        <div class="section-header" style="margin-top:2rem">
            <h2>Connected Papers</h2>
        </div>

        {% if connections.references %}
        <div class="connection-group">
            <div class="connection-group__label">References <span class="badge badge--accent">{{ connections.references | length }}</span></div>
            <div class="connection-list">
                {% for c in connections.references[:20] %}
                <div class="connection-item{% if c.in_db_paper_id %} connection-item--in-db{% endif %}">
                    <span class="connection-title">
                        {% if c.in_db_paper_id %}
                        <a href="/papers/{{ domain }}/{{ c.in_db_paper_id }}">{{ c.connected_title }}</a>
                        {% elif c.connected_arxiv_id %}
                        <a href="https://arxiv.org/abs/{{ c.connected_arxiv_id }}">{{ c.connected_title }}</a>
                        {% elif c.connected_s2_id %}
                        <a href="https://api.semanticscholar.org/{{ c.connected_s2_id }}">{{ c.connected_title }}</a>
                        {% else %}
                        {{ c.connected_title }}
                        {% endif %}
                    </span>
                    {% if c.connected_year %}<span class="connection-year">{{ c.connected_year }}</span>{% endif %}
                    {% if c.in_db_paper_id %}<span class="badge badge--emerald" style="font-size:0.6rem">IN DB</span>{% endif %}
                </div>
                {% endfor %}
            </div>
        </div>
        {% endif %}

        {% if connections.recommendations %}
        <div class="connection-group">
            <div class="connection-group__label">Similar Papers <span class="badge badge--purple">{{ connections.recommendations | length }}</span></div>
            <div class="connection-list">
                {% for c in connections.recommendations[:15] %}
                <div class="connection-item{% if c.in_db_paper_id %} connection-item--in-db{% endif %}">
                    <span class="connection-title">
                        {% if c.in_db_paper_id %}
                        <a href="/papers/{{ domain }}/{{ c.in_db_paper_id }}">{{ c.connected_title }}</a>
                        {% elif c.connected_arxiv_id %}
                        <a href="https://arxiv.org/abs/{{ c.connected_arxiv_id }}">{{ c.connected_title }}</a>
                        {% elif c.connected_s2_id %}
                        <a href="https://api.semanticscholar.org/{{ c.connected_s2_id }}">{{ c.connected_title }}</a>
                        {% else %}
                        {{ c.connected_title }}
                        {% endif %}
                    </span>
                    {% if c.connected_year %}<span class="connection-year">{{ c.connected_year }}</span>{% endif %}
                    {% if c.in_db_paper_id %}<span class="badge badge--emerald" style="font-size:0.6rem">IN DB</span>{% endif %}
                </div>
                {% endfor %}
            </div>
        </div>
        {% endif %}
    </div>
    {% endif %}

    <div class="context-block">
        <div class="context-label">Context for Claude Code</div>
        <pre>Paper: {{ paper.title }}
arXiv: {{ paper.arxiv_id }}
Score: {{ paper.composite }}/10
Summary: {{ paper.summary }}
{% if paper.code_url %}Code: {{ paper.code_url }}{% endif %}

Tell me more about this paper's approach and results.</pre>
    </div>
</div>
{% endblock %}