<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>VerIQ — my cabinet</title>
<link rel="icon" type="image/svg+xml" href="/assets/favicon.svg">
<link rel="stylesheet" href="/assets/style.css">
</head>
<body>
<div class="wrap">
  <header class="top">
    <a class="logo" href="/">Ver<span>IQ</span></a>
    <span class="tagline">my cabinet</span>
  </header>

  <section class="hero" style="padding-bottom:12px">
    <h1 style="font-size:clamp(24px,5vw,36px)">My cabinet</h1>
    <p class="lead" id="whoami">Loading…</p>
  </section>

  <section class="panel" id="activePanel">
    <h2>Current active result</h2>
    <div id="activeBody" style="margin-top:12px">Loading…</div>
  </section>

  <section class="panel" style="margin-top:18px">
    <a class="btn" href="/test" style="text-align:center">Start the test →</a>
    <p class="lead" style="margin-top:10px;font-size:14px">
      A new attempt replaces your current active result — one active result
      per account, no cherry-picking.
    </p>
  </section>

  <section class="panel" style="margin-top:18px">
    <h2>Connected accounts</h2>
    <div id="identities" style="margin-top:12px;display:grid;gap:8px">Loading…</div>
    <div style="display:grid;gap:10px;margin-top:14px">
      <a class="btn ghost" id="linkX" href="/link/x/start" style="text-align:center">Connect X →</a>
      <a class="btn ghost" id="linkIg" href="/link/ig/start" style="text-align:center">Connect Instagram →</a>
    </div>
  </section>

  <section style="margin-top:18px;text-align:center">
    <a href="/logout" style="color:var(--muted)">Log out</a>
  </section>

  <footer>
    VerIQ · <a href="/how">how verification works</a> ·
    <a href="/.well-known/veriq-pubkey.txt">service public key</a>
  </footer>
</div>
<script src="/assets/me.js"></script>
</body>
</html>