index.html

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Agent State Graph — FSMs from LLM Agent Traces</title>
    <meta name="description" content="Interactive dashboard for Agent State Graph: compact finite-state machines extracted from LLM agent traces across 14 datasets. Failure prediction, workflow memory, cross-model transfer, runtime monitoring, and counterfactual paths." />
    <meta name="theme-color" content="#c4553a" />
    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />

    <!-- Open Graph -->
    <meta property="og:type" content="website" />
    <meta property="og:title" content="Agent State Graph" />
    <meta property="og:description" content="Compact FSMs from LLM agent traces. 14 datasets, ≥0.993 fitness, AUROC up to 0.94, runtime monitor F1=0.904." />
    <meta property="og:image" content="/og.png" />

    <!-- Twitter Card -->
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:title" content="Agent State Graph" />
    <meta name="twitter:description" content="Compact FSMs from LLM agent traces. 14 datasets, ≥0.993 fitness, AUROC up to 0.94, runtime monitor F1=0.904." />
    <meta name="twitter:image" content="/og.png" />

    <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=Instrument+Serif:ital@0;1&family=DM+Sans:ital,opsz,wght@0,9..40,300..700;1,9..40,300..700&family=IBM+Plex+Mono:wght@400;500&display=swap" rel="stylesheet" />
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
</html>