{#
  Shared nav MENU ITEMS — the single source of the app's navigation links,
  included by both the shared menu drawer (_menu.html, on usage/goals/agents/
  topics/tasks) and the chat sidebar (#nav-list in index.html). Param: `active`.
#}
    <button type="button" class="nav-item" id="new-chat-btn" title="Start a new conversation" aria-label="New chat">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>
      <span>New chat</span>
    </button>
    {#- Operator surfaces are admin-only. Tasks also lists conversations
        explicitly shared with the current user. -#}
    {% if is_admin %}
    <a class="nav-item{% if active == 'agents' %} active{% endif %}" id="nav-agent-monitor" href="{{ base }}/agents" title="Live agent → session → subagent monitor">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="5" cy="6" r="2"/><circle cx="5" cy="18" r="2"/><circle cx="17" cy="12" r="2"/><path d="M7 6h6a2 2 0 0 1 2 2v2M7 18h6a2 2 0 0 0 2-2v-2"/></svg>
      <span>Agents</span>
    </a>
    <a class="nav-item{% if active == 'topics' %} active{% endif %}" id="nav-topics" href="{{ base }}/topics" title="Conversations grouped by topic (synced from Telegram)">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 5h18M3 12h18M3 19h12"/></svg>
      <span>Topics</span>
    </a>
    {% endif %}
    <a class="nav-item{% if active == 'tasks' %} active{% endif %}" id="nav-tasks" href="{{ base }}/tasks" title="Tracked sessions, grouped by state">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="4" width="7" height="16" rx="1"/><rect x="14" y="4" width="7" height="7" rx="1"/><rect x="14" y="14" width="7" height="6" rx="1"/></svg>
      <span>Tasks</span>
    </a>
    {% if is_admin %}
    <a class="nav-item{% if active == 'loops' %} active{% endif %}" id="nav-loops" href="{{ base }}/loops" title="Scheduled loops — what runs, when, in which session">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 12a9 9 0 1 1-3-6.7"/><path d="M21 3v6h-6"/></svg>
      <span>Loops</span>
    </a>
    <a class="nav-item{% if active == 'dev' %} active{% endif %}" id="nav-dev" href="{{ base }}/dev" title="Closed-loop development — one object, one branch, one PR">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="16 18 22 12 16 6"/><polyline points="8 6 2 12 8 18"/></svg>
      <span>Dev</span>
    </a>
    <a class="nav-item{% if active == 'goals' %} active{% endif %}" id="nav-goals" href="{{ base }}/goals" title="Durable goals portfolio">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="9"/><circle cx="12" cy="12" r="5"/><circle cx="12" cy="12" r="1"/></svg>
      <span>Goals</span>
    </a>
    <a class="nav-item" id="nav-voice" href="{{ realtime_url | default('', true) }}" target="_blank" rel="noopener" title="Realtime voice — talk to {{ site_title }}">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 2a3 3 0 0 0-3 3v6a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3z"/><path d="M5 10v1a7 7 0 0 0 14 0v-1"/><line x1="12" y1="18" x2="12" y2="22"/><line x1="8" y1="22" x2="16" y2="22"/></svg>
      <span>Voice</span>
    </a>
    <a class="nav-item{% if active == 'builder' %} active{% endif %}" id="nav-agent-builder" href="{{ base }}/agents/builder" title="Inspect and edit agent definitions">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14.7 6.3a4 4 0 0 0-5.4 5.4L3 18v3h3l6.3-6.3a4 4 0 0 0 5.4-5.4L14 13l-3-3 3.7-3.7z"/></svg>
      <span>Agent Builder</span>
    </a>
    <a class="nav-item{% if active == 'usage' %} active{% endif %}" id="nav-usage" href="{{ base }}/usage" title="Token usage, activity, models, and spend">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 19V9M10 19V5M16 19v-7M22 19H2"/></svg>
      <span>Usage</span>
    </a>
    <a class="nav-item{% if active == 'models' %} active{% endif %}" id="nav-models" href="{{ base }}/models" title="Benchmarks, local router, and vLLM serving">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 3 3 7.5l9 4.5 9-4.5L12 3Z"/><path d="m3 12 9 4.5 9-4.5"/><path d="m3 16.5 9 4.5 9-4.5"/></svg>
      <span>Models</span>
    </a>
    <a class="nav-item{% if active == 'decision' %} active{% endif %}" id="nav-decision" href="{{ base }}/decision" title="Try decision models">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 11l3 3L22 4"/><path d="M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11"/></svg>
      <span>Decision</span>
    </a>
    <a class="nav-item{% if active == 'channels' %} active{% endif %}" id="nav-channels" href="{{ base }}/channels" title="Telegram and WhatsApp send permissions for people and groups">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg>
      <span>Channels</span>
    </a>
    <a class="nav-item{% if active == 'users' %} active{% endif %}" id="nav-users" href="{{ base }}/users" title="Accounts, roles and what each user may use">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="9" cy="8" r="3.5"/><path d="M2.5 20a6.5 6.5 0 0 1 13 0"/><path d="M16 4.5a3.5 3.5 0 0 1 0 7"/><path d="M18.5 14.5a6.5 6.5 0 0 1 3 5.5"/></svg>
      <span>Users</span>
    </a>
    {% endif %}