<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
  <meta name="theme-color" content="#0f1115">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
  <meta name="apple-mobile-web-app-title" content="psyc">
  <title>{% block title %}psyc cockpit{% endblock %}</title>
  <link rel="icon" type="image/png" href="/static/psyc-logo.png">
  <link rel="apple-touch-icon" href="/static/psyc-logo.png">
  <link rel="manifest" href="/static/manifest.json">
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="/static/cockpit.css">
  <link rel="stylesheet" href="/static/psyc-tokens.css">
  <!-- analytics — Umami, cookieless, defer'd so it never blocks render -->
  <script defer src="https://analytics.neuronetz.ai/script.js" data-website-id="34c354e5-780e-4c42-a5ce-49b13ff3f088"></script>
  <script>
    if ("serviceWorker" in navigator) {
      window.addEventListener("load", () => {
        navigator.serviceWorker.register("/sw.js", { scope: "/" }).catch(() => {});
      });
    }
    // Mobile nav toggle. Topbar gets .nav-open; aria-expanded mirrors it.
    document.addEventListener("DOMContentLoaded", () => {
      const btn = document.querySelector(".nav-toggle");
      const bar = document.querySelector(".topbar");
      if (!btn || !bar) return;
      btn.addEventListener("click", () => {
        const open = bar.classList.toggle("nav-open");
        btn.setAttribute("aria-expanded", open ? "true" : "false");
      });
      // Close the drawer when a nav link is clicked (so navigating dismisses it).
      document.querySelectorAll(".nav a").forEach(a => a.addEventListener("click", () => {
        bar.classList.remove("nav-open");
        btn.setAttribute("aria-expanded", "false");
      }));
    });
  </script>
</head>
<body class="{% block body_class %}{% endblock %}">
  <header class="topbar">
    <a class="brand" href="/cases">
      <img class="brand-icon" src="/static/psyc-logo.png" alt="psyc">
      <span class="brand-sub">operations cockpit</span>
    </a>
    <button class="nav-toggle" type="button" aria-expanded="false" aria-controls="primary-nav" aria-label="Menu">
      <span class="nav-toggle-bar"></span>
      <span class="nav-toggle-bar"></span>
      <span class="nav-toggle-bar"></span>
    </button>
    <nav class="nav" id="primary-nav">
      <a href="/cases">Cases</a>
      <a href="/lookup">Lookup</a>
      <a href="/response">Response</a>
      <a href="/queue">Queue</a>
      <a href="/ledger">Ledger</a>
      <a href="/train">Trainline</a>
      {% if request.session.get('admin_who') %}
      <a href="/admin" class="nav-admin" title="Admin control center">
        <svg viewBox="0 0 24 24" width="14" height="14" aria-hidden="true" style="vertical-align:-2px;">
          <path d="M12 2 L20 5 V12 C20 17 16.5 20.5 12 22 C7.5 20.5 4 17 4 12 V5 Z"
                fill="none" stroke="currentColor" stroke-width="1.8" stroke-linejoin="round"/>
          <circle cx="12" cy="11" r="2.4" fill="none" stroke="currentColor" stroke-width="1.8"/>
          <rect x="11" y="12.5" width="2" height="4" rx="1" fill="currentColor"/>
        </svg>
        Admin
      </a>
      {% endif %}
    </nav>
    {% if request.session.get('admin_who') %}
    <span class="admin-chip" title="Admin session · click to manage">
      <a href="/admin" class="admin-chip-body">
        <span class="admin-chip-dot"></span>
        <span class="admin-chip-label">ADMIN · {{ request.session.get('admin_who') }}</span>
      </a>
      <a href="/admin/logout" class="admin-chip-lock" title="Lock the admin zone (sign out)" aria-label="lock">⏻</a>
    </span>
    {% endif %}
    <span class="model-status" id="model-status" data-state="checking" title="checking…">
      <span class="model-status-dot"></span><span class="model-status-text">model</span>
    </span>
    <div class="family">
      <img class="family-icon" src="/static/nn-sc-icon.png" alt="NN-sc — Security/Control" title="NN-sc · Security — psyc, the security app of the neuronetz platform">
    </div>
  </header>
  <main class="content">
    {% block content %}{% endblock %}
  </main>
  <footer class="footer">psyc 0.1 — defensive CTI prototype · powered by <a href="https://neuronetz.ai" target="_blank" rel="noopener">neuronetz.ai</a></footer>
  <script>
    fetch('/api/inference-status').then(r => r.json()).then(s => {
      const el = document.getElementById('model-status');
      if (!el) return;
      if (s.online) {
        el.dataset.state = 'online';
        el.title = 'model up · ' + s.adapter;
        el.querySelector('.model-status-text').textContent = 'model · live';
      } else {
        el.dataset.state = 'offline';
        el.title = 'inference server unreachable — Classifier bot falls back to rules';
        el.querySelector('.model-status-text').textContent = 'model · offline';
      }
    }).catch(() => {});
  </script>
</body>
</html>
