{% extends "base.html" %}
{% from "_partials/status.html" import status %}
{% block main %}
<noscript><style>[data-toggle-card],[data-copy-text],[data-density] { display:none }</style></noscript>
<div class="stack-md">
  <div class="page-head">
    <h1 style="font-size:22px">{% if q %}Results for “{{ q }}”{% else %}Search{% endif %}</h1>
    <p class="meta-line">{{ results | length }} sections · budget {{ budget }} tk · scope hub federation</p>
  </div>
  {% if active_tags %}
  <div class="meta-line">
    <span class="kicker">Filter</span>
    {% for t in active_tags %}<span class="chip">{{ t }}</span>{% endfor %}
  </div>
  {% endif %}
  <div class="seg-row" data-density role="group" aria-label="Result density">
    <button type="button" class="seg on" data-density-btn="compact" aria-pressed="true">Compact</button>
    <button type="button" class="seg" data-density-btn="full" aria-pressed="false">Full text</button>
  </div>
  <div class="stack-md" style="gap:10px">
    {% for r in results %}
    <article class="result-card">
      <header>
        <a class="cite" href="{{ r.href }}">{{ r.citation }}</a>
        {{ status(r.status) }}
        <span class="badge badge-mode">{{ r.match_mode }}</span>
        <span class="tk">{{ r.tokens }} tk
          <span class="score-track"><span class="score-fill" style="width:{{ r.score_pct }}%"></span></span>
        </span>
      </header>
      <h2>{{ r.title }}</h2>
      <div class="body">{{ r.body_html | safe }}</div>
      <footer>
        <button type="button" data-toggle-card aria-expanded="false">expand</button>
        <span class="sep">|</span>
        <button type="button" data-copy-text="{{ r.citation }}">copy citation</button>
        <span class="sep">|</span>
        <a href="{{ r.href }}">open reader</a>
        <span class="file">{{ r.file }}</span>
      </footer>
    </article>
    {% else %}
    <div class="empty-state">
      {% if not shell.hub_ok %}
      <p>Hub unreachable — the federation is the only read source.</p>
      {% else %}
      <p>No matching section found.</p>
      <p>Try dropping tags or changing keywords.</p>
      {% endif %}
    </div>
    {% endfor %}
  </div>
</div>
{% endblock %}
{% block rail %}
<div class="rail-block">
  <p class="kicker">Token budget</p>
  <form method="get" action="/ui">
    <input type="hidden" name="q" value="{{ q }}">
    {% if raw_tags %}<input type="hidden" name="tags" value="{{ raw_tags }}">{% endif %}
    <input type="range" name="budget" min="200" max="8000" step="100"
           value="{{ budget }}" style="width:100%; accent-color:#1349a5"
           aria-label="Token budget"
           onchange="this.form.submit()">
    <div class="rail-kv"><span>200</span><span class="v" style="color:#1349a5">{{ budget }} tk</span><span>8000</span></div>
    <noscript><button type="submit" class="seg" style="margin-top:6px">Apply</button></noscript>
  </form>
</div>
<div class="rail-block">
  <p class="kicker">Match modes</p>
  <p style="margin:0; font-size:11.5px; color:#98a0aa; line-height:1.5">
    Keyword (FTS5) and semantic (KNN) legs are fused with RRF when the
    embedder is installed. No model call happens at lookup time.</p>
</div>
<div class="rail-card">
  <p class="kicker">Shortcuts</p>
  <span class="rail-kv"><span>Focus search</span><span class="kbd">⌘K</span></span>
</div>
{% endblock %}