Add Help: intro tour, tutorials, stakeholder guides, citation info, footer

.gitignore

@@ -57,3 +57,5 @@ docs/INTERPRETIVE_SIGNALS.md
 # Playwright e2e output (tests/e2e via @playwright/test)
 test-results/
 playwright-report/
+
+public/tutorials/screenshots/

app/about/page.tsx

@@ -1,6 +1,7 @@
 import Link from "next/link"
-import { ArrowRight } from "lucide-react"
+import { ArrowRight, ExternalLink } from "lucide-react"
 
+import { CiteSection, PAPER_URL } from "@/components/cite-section"
 import { Navigation } from "@/components/navigation"
 
 export default function AboutPage() {
@@ -116,41 +117,57 @@ export default function AboutPage() {
         </section>
 
         {/* FOUR SIGNALS --------------------------------------------------- */}
-        <section className="mb-14">
+        <section id="four-interpretive-signals" className="mb-14 scroll-mt-24">
           <div className="section-head">
             <h2>Four interpretive signals</h2>
           </div>
-          <p className="mb-5 max-w-[700px] text-[15px] leading-[1.7] text-[color:var(--fg-muted)]">
-            Computed over each <code className="font-mono text-[12px]">(model, benchmark, metric-path)</code> record and aggregated to the
-            corpus. Per-record instances appear on every model and benchmark page;
-            corpus rollups appear on the home page.
+          <p className="mb-5 max-w-[720px] text-[15px] leading-[1.7] text-[color:var(--fg-muted)]">
+            The four signals come from a question that kept coming up in our interviews with
+            researchers and policy practitioners: do I have enough information to trust this
+            result as a basis for a decision? Each one answers a different part of it. They're
+            computed for every{" "}
+            <code className="font-mono text-[12px]">(model, benchmark, metric-path)</code> record
+            and rolled up across the corpus — you'll see them on each model and benchmark page,
+            and the corpus-wide picture on the home page. For the exact formulas, see the{" "}
+            <Link href="/help/how-signals-are-computed" className="underline underline-offset-2">
+              signal computation reference
+            </Link>
+            .
           </p>
           <ol className="list-none p-0 m-0">
             {[
-              [
-                "reproducibility",
-                "Reproducibility",
-                "Can a third party run this evaluation and obtain a comparable number? Tracks setup-variant disclosure, prompt and decoding parameters, harness version, seed, and code/artifact availability.",
-              ],
-              [
-                "completeness",
-                "Completeness",
-                "Does the record meet the standard report card for this class of model? Tracks coverage across capability, robustness, safety and fairness benchmarks expected for the model's claimed use.",
-              ],
-              [
-                "provenance",
-                "Provenance & risk",
-                "Who produced this number, and which deployment-relevant property does it speak to? Tracks evaluator identity (first-party / third-party), source citation, and IBM Risk Atlas-aligned risk domain.",
-              ],
-              [
-                "comparability",
-                "Comparability",
-                "Can two scores under the same benchmark be put side-by-side? Tracks slice, metric variant, and unit harmonisation; flags rows that cannot be ranked together.",
-              ],
-            ].map(([id, h, p], i) => (
+              {
+                id: "reproducibility",
+                name: "Reproducibility",
+                question: "Could someone else re-run this and get the same number?",
+                body: "We check for the small set of fields you'd need to reproduce a run — temperature and max tokens, plus the harness, evaluation plan, and limits for agentic evaluations. If any are missing, the result is flagged and the specific missing fields are listed.",
+                meta: "Per (model, benchmark, metric-path) · flag + missing-field list",
+              },
+              {
+                id: "completeness",
+                name: "Reporting completeness",
+                question: "Is the score documented well enough to interpret?",
+                body: "This looks at the full 28-field schema around a benchmark — its goals, construct definitions, scoring rubric, intended uses, and known limitations — not just the handful of fields needed to re-run it. Present fields score 1, fields with sub-items score the fraction filled in, and the completeness score is the average. It measures how much is documented, not how rigorous the work was.",
+                meta: "Per benchmark · score 0–1 + missing-field count",
+              },
+              {
+                id: "provenance",
+                name: "Provenance & risk",
+                question: "Who reported it, and what's at stake?",
+                body: "For each score we surface who ran it — the model developer (first-party), an independent evaluator (third-party), or a collaboration — and whether more than one party reported the same thing. We also carry over any risk categories tied to the benchmark, drawn from the Auto-BenchmarkCards risk mapping. First- and third-party results are never quietly merged.",
+                meta: "Per (model, benchmark, metric-path) · party tag + multi-party flag + risk tags",
+              },
+              {
+                id: "comparability",
+                name: "Comparability",
+                question: "Can these scores actually be compared?",
+                body: "When the same model, benchmark, and metric has more than one reported score, we check whether they differ by more than 5% of the metric's range — both across different setups from the same party (variant divergence) and across different parties (cross-party divergence). If they diverge, we flag it and show the setup differences behind the gap.",
+                meta: "Per (model, benchmark, metric-path), ≥2 reports · variant + cross-party divergence flags",
+              },
+            ].map((s, i) => (
               <li
-                key={h}
-                id={`signal-${id}`}
+                key={s.id}
+                id={`signal-${s.id}`}
                 className="grid grid-cols-[50px_1fr] gap-5 border-b border-[color:var(--border-soft)] py-5 scroll-mt-24"
               >
                 <span
@@ -164,14 +181,28 @@ export default function AboutPage() {
                   0{i + 1}
                 </span>
                 <div>
-                  <h3 className="m-0 text-[17px] font-semibold text-[color:var(--fg)]">{h}</h3>
-                  <p className="mt-1.5 m-0 text-sm leading-[1.65] text-[color:var(--fg-muted)]">
-                    {p}
+                  <h3 className="m-0 text-[17px] font-semibold text-[color:var(--fg)]">
+                    {s.name}
+                  </h3>
+                  <p className="mt-0.5 m-0 text-[13.5px] italic leading-[1.5] text-[color:var(--fg-subtle)]">
+                    {s.question}
+                  </p>
+                  <p className="mt-2 m-0 text-sm leading-[1.65] text-[color:var(--fg-muted)]">
+                    {s.body}
+                  </p>
+                  <p className="mt-2.5 m-0 font-mono text-[11px] uppercase tracking-[0.08em] text-[color:var(--fg-subtle)]">
+                    {s.meta}
                   </p>
                 </div>
               </li>
             ))}
           </ol>
+          <p className="mt-5 max-w-[720px] text-sm leading-[1.7] text-[color:var(--fg-muted)]">
+            None of this is a grade. Evaluation Cards doesn't hand out letter grades, pass/fail
+            thresholds, or rankings — it just makes reporting choices visible. A missing field
+            lowers a completeness score and may trip another signal, and we show readers exactly
+            what was left out.
+          </p>
         </section>
 
         {/* READER MODES --------------------------------------------------- */}
@@ -337,28 +368,12 @@ export default function AboutPage() {
           </ul>
         </section>
 
-        {/* CITATION & CORRECTIONS ----------------------------------------- */}
-        <section className="mb-8">
+        {/* HOW TO CITE ---------------------------------------------------- */}
+        <section id="how-to-cite" className="mb-8 scroll-mt-24">
           <div className="section-head">
-            <h2>Citation &amp; corrections</h2>
-          </div>
-          <div className="grid gap-5 sm:grid-cols-2">
-            <div className="border border-[color:var(--border-soft)] p-[22px]">
-              <div className="kicker mb-2.5">Cite as</div>
-              <p className="font-mono m-0 text-[12px] leading-[1.7] text-[color:var(--fg)]">
-                EvalEval Coalition. (2026). Evaluation Cards: a reporting layer for AI evaluation
-                (snapshot 5 Jun 2026). evalcards.evalevalai.com
-              </p>
-            </div>
-            <div className="border border-[color:var(--border-soft)] p-[22px]">
-              <div className="kicker mb-2.5">Submit a correction</div>
-              <p className="m-0 text-[13.5px] leading-[1.65] text-[color:var(--fg-muted)]">
-                Each record links a correction path. Disclosure gaps close as developers and
-                third parties publish; we accept patches against any (model, benchmark,
-                metric-path) tuple with a citation.
-              </p>
-            </div>
+            <h2>How to cite</h2>
           </div>
+          <CiteSection showCorrection />
         </section>
 
         {/* CTA ROW -------------------------------------------------------- */}
@@ -373,6 +388,10 @@ export default function AboutPage() {
           <Link href="/evals" className="btn-ec outline">
             Browse evaluations
           </Link>
+          <a href={PAPER_URL} target="_blank" rel="noreferrer" className="btn-ec outline">
+            Read the paper
+            <ExternalLink className="h-3.5 w-3.5" aria-hidden />
+          </a>
         </section>
       </main>
     </div>

app/globals.css

@@ -1485,3 +1485,149 @@
     transition: none;
   }
 }
+
+/* ---------------------------------------------------------------------------
+   Tutorial prose — rendered markdown for /help guides. Scoped so it can't
+   leak into the rest of the app; uses the same design tokens as the site.
+--------------------------------------------------------------------------- */
+.tutorial-prose {
+  color: var(--fg);
+  font-size: 16px;
+  line-height: 1.7;
+}
+.tutorial-prose > :first-child {
+  margin-top: 0;
+}
+.tutorial-prose h1 {
+  font-size: clamp(32px, 4.4vw, 44px);
+  font-weight: 700;
+  letter-spacing: -0.03em;
+  line-height: 1.08;
+  margin: 0 0 0.5em;
+  color: var(--fg);
+}
+.tutorial-prose h2 {
+  font-size: 24px;
+  font-weight: 650;
+  letter-spacing: -0.015em;
+  margin: 2em 0 0.6em;
+  padding-bottom: 0.3em;
+  border-bottom: 1px solid var(--border-soft);
+  color: var(--fg);
+}
+.tutorial-prose h3 {
+  font-size: 18px;
+  font-weight: 600;
+  margin: 1.6em 0 0.4em;
+  color: var(--fg);
+}
+.tutorial-prose p {
+  margin: 0 0 1.1em;
+  color: var(--fg-muted);
+}
+.tutorial-prose strong {
+  color: var(--fg);
+  font-weight: 600;
+}
+.tutorial-prose a {
+  color: var(--fg);
+  text-decoration: underline;
+  text-underline-offset: 2px;
+  text-decoration-color: var(--border-strong);
+}
+.tutorial-prose a:hover {
+  text-decoration-color: var(--accent);
+}
+.tutorial-prose ul,
+.tutorial-prose ol {
+  margin: 0 0 1.1em;
+  padding-left: 1.4em;
+  color: var(--fg-muted);
+}
+.tutorial-prose li {
+  margin: 0.3em 0;
+}
+.tutorial-prose li::marker {
+  color: var(--fg-subtle);
+}
+.tutorial-prose code {
+  font-family: var(--font-mono, ui-monospace, monospace);
+  font-size: 0.86em;
+  background: var(--bg-subtle);
+  border: 1px solid var(--border-soft);
+  border-radius: 3px;
+  padding: 0.1em 0.35em;
+  color: var(--fg);
+}
+.tutorial-prose pre {
+  background: var(--bg-subtle);
+  border: 1px solid var(--border-soft);
+  border-radius: var(--radius);
+  padding: 1em 1.2em;
+  overflow-x: auto;
+  margin: 0 0 1.4em;
+}
+.tutorial-prose pre code {
+  background: none;
+  border: none;
+  padding: 0;
+  font-size: 13px;
+}
+.tutorial-prose blockquote {
+  margin: 0 0 1.4em;
+  padding: 0.2em 0 0.2em 1.1em;
+  border-left: 3px solid var(--border-strong);
+  color: var(--fg-muted);
+}
+.tutorial-prose blockquote p {
+  margin: 0.3em 0;
+}
+.tutorial-prose hr {
+  border: none;
+  border-top: 1px solid var(--border-soft);
+  margin: 2.2em 0;
+}
+.tutorial-prose table {
+  width: 100%;
+  border-collapse: collapse;
+  margin: 0 0 1.6em;
+  font-size: 14px;
+}
+.tutorial-prose th,
+.tutorial-prose td {
+  border: 1px solid var(--border-soft);
+  padding: 0.6em 0.8em;
+  text-align: left;
+  vertical-align: top;
+}
+.tutorial-prose th {
+  background: var(--bg-warm);
+  font-weight: 600;
+  color: var(--fg);
+}
+.tutorial-prose td {
+  color: var(--fg-muted);
+}
+.tutorial-prose .tut-figure {
+  margin: 1.8em 0;
+}
+/* Cap height so very tall full-page captures scroll inside a frame rather than
+   stretching the page; normal section crops fall well under this. */
+.tutorial-prose .tut-figure-frame {
+  max-height: 560px;
+  overflow: auto;
+  border: 1px solid var(--border-soft);
+  border-radius: var(--radius);
+  background: var(--bg-subtle);
+}
+.tutorial-prose .tut-figure img {
+  width: 100%;
+  height: auto;
+  display: block;
+}
+.tutorial-prose .tut-figure figcaption {
+  margin-top: 0.6em;
+  font-size: 13px;
+  line-height: 1.5;
+  color: var(--fg-subtle);
+}

app/help/[slug]/page.tsx

@@ -0,0 +1,68 @@
+import Link from "next/link"
+import type { Metadata } from "next"
+import { notFound } from "next/navigation"
+import { ArrowLeft } from "lucide-react"
+import "katex/dist/katex.min.css"
+
+import { Navigation } from "@/components/navigation"
+import { ReplayIntroButton } from "@/components/replay-intro-button"
+import { TutorialMarkdown } from "@/components/tutorial-markdown"
+import { getTutorialMeta, getTutorialSlugs, readTutorial } from "@/lib/tutorials"
+
+export function generateStaticParams() {
+  return getTutorialSlugs().map((slug) => ({ slug }))
+}
+
+export async function generateMetadata({
+  params,
+}: {
+  params: Promise<{ slug: string }>
+}): Promise<Metadata> {
+  const { slug } = await params
+  const meta = getTutorialMeta(slug)
+  if (!meta) return {}
+  return { title: `${meta.title} · Help`, description: meta.blurb }
+}
+
+export default async function TutorialPage({
+  params,
+}: {
+  params: Promise<{ slug: string }>
+}) {
+  const { slug } = await params
+  const meta = getTutorialMeta(slug)
+  const source = readTutorial(slug)
+  if (!meta || source === null) {
+    notFound()
+  }
+
+  return (
+    <div className="min-h-screen bg-background">
+      <Navigation />
+
+      <main className="mx-auto w-full max-w-[52rem] px-4 pb-24 pt-12 sm:px-8">
+        <Link
+          href="/help"
+          className="inline-flex items-center gap-1.5 font-mono text-[11px] uppercase tracking-[0.12em] text-[color:var(--fg-muted)] transition-colors hover:text-[color:var(--fg)]"
+        >
+          <ArrowLeft className="h-3.5 w-3.5" aria-hidden />
+          All guides
+        </Link>
+
+        <div className="kicker mt-6">{meta.audience}</div>
+
+        <article className="mt-3">
+          <TutorialMarkdown source={source} />
+        </article>
+
+        <section className="mt-14 flex flex-wrap gap-3 border-t border-[color:var(--border-soft)] pt-10">
+          <Link href="/help" className="btn-ec outline">
+            <ArrowLeft className="h-3.5 w-3.5" aria-hidden />
+            Back to Help
+          </Link>
+          <ReplayIntroButton />
+        </section>
+      </main>
+    </div>
+  )
+}

app/help/page.tsx

@@ -0,0 +1,363 @@
+import Link from "next/link"
+import type { Metadata } from "next"
+import { ArrowRight, ExternalLink, FileText } from "lucide-react"
+
+import { CiteSection, PAPER_URL } from "@/components/cite-section"
+import { Navigation } from "@/components/navigation"
+import { ReplayIntroButton } from "@/components/replay-intro-button"
+import { DOCS, TUTORIALS } from "@/lib/tutorials"
+
+export const metadata: Metadata = {
+  title: "Help",
+  description:
+    "Learn how to read Evaluation Cards: a quickstart, stakeholder guides, documentation, and how to contribute.",
+}
+
+const quickstart = TUTORIALS.find((t) => t.slug === "quickstart")!
+const stakeholderGuides = TUTORIALS.filter((t) => t.slug !== "quickstart")
+
+const linkCls = "text-[color:var(--fg)] underline underline-offset-2 hover:opacity-80"
+const EEE_SITE = "https://evalevalai.com/every_eval_ever/"
+const EEE_ISSUES = "https://github.com/evaleval/every_eval_ever/issues"
+const HF_DISCUSSIONS = "https://huggingface.co/spaces/evaleval/general-eval-card/discussions"
+const ROADMAP = "https://changemap.co/evaleval/evalcards/"
+
+export default function HelpPage() {
+  return (
+    <div className="min-h-screen bg-background">
+      <Navigation />
+
+      <main className="mx-auto w-full max-w-[64rem] px-4 pb-24 pt-12 sm:px-8">
+        {/* HEADER --------------------------------------------------------- */}
+        <div className="kicker">Help</div>
+        <h1
+          className="mt-2 mb-7"
+          style={{
+            fontSize: "clamp(40px, 5.2vw, 56px)",
+            fontWeight: 700,
+            letterSpacing: "-0.03em",
+            lineHeight: 1.05,
+            color: "var(--fg)",
+          }}
+        >
+          How to use Evaluation Cards.
+        </h1>
+        <p className="mb-8 text-[19px] leading-[1.6] text-[color:var(--fg-muted)]">
+          New here? Start with the quickstart, then dive into a guide written for your role.
+          You can replay the intro tour at any time.
+        </p>
+        <ReplayIntroButton />
+
+        {/* QUICKSTART ----------------------------------------------------- */}
+        <section className="mt-14 mb-14">
+          <div className="section-head">
+            <h2>Quickstart</h2>
+          </div>
+          <Link
+            href={`/help/${quickstart.slug}`}
+            className="group flex flex-col gap-3 border border-[color:var(--border-soft)] bg-[color:var(--fg)] p-7 text-[color:var(--bg)] sm:flex-row sm:items-center sm:justify-between"
+          >
+            <div>
+              <div className="kicker mb-2" style={{ color: "var(--accent)" }}>
+                {quickstart.audience}
+              </div>
+              <h3 className="m-0 mb-1.5 text-xl font-semibold">{quickstart.title}</h3>
+              <p
+                className="m-0 max-w-[44ch] text-[14px] leading-[1.6]"
+                style={{ color: "color-mix(in srgb, var(--bg) 78%, transparent)" }}
+              >
+                {quickstart.blurb}
+              </p>
+            </div>
+            <span className="inline-flex shrink-0 items-center gap-2 font-mono text-[11px] uppercase tracking-[0.12em]">
+              Start reading
+              <ArrowRight className="h-4 w-4 transition-transform group-hover:translate-x-0.5" aria-hidden />
+            </span>
+          </Link>
+        </section>
+
+        {/* TUTORIALS BY STAKEHOLDER --------------------------------------- */}
+        <section className="mb-14">
+          <div className="section-head">
+            <h2>Tutorials by stakeholder</h2>
+          </div>
+          <p className="mb-5 max-w-[700px] text-[15px] leading-[1.7] text-[color:var(--fg-muted)]">
+            Each guide reads the same record through a different lens. Pick the one closest to
+            how you'll use Evaluation Cards.
+          </p>
+          <div className="grid gap-5 sm:grid-cols-2">
+            {stakeholderGuides.map((guide) => (
+              <Link
+                key={guide.slug}
+                href={`/help/${guide.slug}`}
+                className="group flex flex-col border border-[color:var(--border-soft)] bg-[color:var(--bg-warm)] p-[22px] transition-colors hover:border-[color:var(--border-strong)]"
+              >
+                <div className="kicker mb-2">{guide.audience}</div>
+                <h3 className="m-0 mb-2 flex items-center gap-2 text-base font-semibold tracking-[-0.005em] text-[color:var(--fg)]">
+                  {guide.title}
+                  <ArrowRight
+                    className="h-3.5 w-3.5 text-[color:var(--fg-subtle)] transition-transform group-hover:translate-x-0.5"
+                    aria-hidden
+                  />
+                </h3>
+                <p className="m-0 text-[13.5px] leading-[1.6] text-[color:var(--fg-muted)]">
+                  {guide.blurb}
+                </p>
+              </Link>
+            ))}
+          </div>
+        </section>
+
+        {/* DOCUMENTATION -------------------------------------------------- */}
+        <section className="mb-14">
+          <div className="section-head">
+            <h2>Documentation</h2>
+          </div>
+          <p className="mb-5 max-w-[700px] text-[15px] leading-[1.7] text-[color:var(--fg-muted)]">
+            Deeper, more technical references for contributing to and working with the data
+            behind Evaluation Cards.
+          </p>
+          <div className="grid gap-5 sm:grid-cols-2">
+            {DOCS.map((doc) => (
+              <Link
+                key={doc.slug}
+                href={`/help/${doc.slug}`}
+                className="group flex flex-col border border-[color:var(--border-soft)] bg-[color:var(--bg-warm)] p-[22px] transition-colors hover:border-[color:var(--border-strong)]"
+              >
+                <div className="kicker mb-2 flex items-center gap-1.5">
+                  <FileText className="h-3 w-3" aria-hidden />
+                  {doc.audience}
+                </div>
+                <h3 className="m-0 mb-2 flex items-center gap-2 text-base font-semibold tracking-[-0.005em] text-[color:var(--fg)]">
+                  {doc.title}
+                  <ArrowRight
+                    className="h-3.5 w-3.5 text-[color:var(--fg-subtle)] transition-transform group-hover:translate-x-0.5"
+                    aria-hidden
+                  />
+                </h3>
+                <p className="m-0 text-[13.5px] leading-[1.6] text-[color:var(--fg-muted)]">
+                  {doc.blurb}
+                </p>
+              </Link>
+            ))}
+
+            {/* External: how to contribute evaluation results to EEE */}
+            <a
+              href="https://evalevalai.com/every_eval_ever/"
+              target="_blank"
+              rel="noreferrer"
+              className="group flex flex-col border border-[color:var(--border-soft)] bg-[color:var(--bg-warm)] p-[22px] transition-colors hover:border-[color:var(--border-strong)]"
+            >
+              <div className="kicker mb-2 flex items-center gap-1.5">
+                <ExternalLink className="h-3 w-3" aria-hidden />
+                External · EvalEval
+              </div>
+              <h3 className="m-0 mb-2 flex items-center gap-2 text-base font-semibold tracking-[-0.005em] text-[color:var(--fg)]">
+                Add results to Every Eval Ever
+                <ExternalLink
+                  className="h-3.5 w-3.5 text-[color:var(--fg-subtle)] transition-transform group-hover:-translate-y-0.5"
+                  aria-hidden
+                />
+              </h3>
+              <p className="m-0 text-[13.5px] leading-[1.6] text-[color:var(--fg-muted)]">
+                The Every Eval Ever contributor site explains how to add evaluation results to the
+                datastore that powers Evaluation Cards.
+              </p>
+            </a>
+          </div>
+          <p className="mt-4 text-[13px] leading-[1.6] text-[color:var(--fg-subtle)]">
+            Suggest missing documentation on our{" "}
+            <a
+              href="https://changemap.co/evaleval/evalcards/"
+              target="_blank"
+              rel="noreferrer"
+              className="underline underline-offset-2 hover:text-[color:var(--fg)]"
+            >
+              public roadmap
+            </a>{" "}
+            and we'll make sure to add it!
+          </p>
+        </section>
+
+        {/* HOW TO CONTRIBUTE ---------------------------------------------- */}
+        <section id="how-to-contribute" className="mb-8 scroll-mt-24">
+          <div className="section-head">
+            <h2>How to contribute</h2>
+          </div>
+          <p className="mb-5 max-w-[720px] text-[15px] leading-[1.7] text-[color:var(--fg-muted)]">
+            Evaluation Cards is a living, community artifact — its coverage and usefulness grow as
+            people report, upload, use, and cite it. Here's what helps most, depending on who you
+            are.
+          </p>
+          <div className="grid gap-5 sm:grid-cols-2">
+            {/* MODEL DEVELOPERS */}
+            <div className="border border-[color:var(--border-soft)] bg-[color:var(--bg-warm)] p-[22px]">
+              <div className="kicker mb-2">Model developers</div>
+              <ul className="m-0 list-disc space-y-2 pl-4 text-[13.5px] leading-[1.6] text-[color:var(--fg-muted)] marker:text-[color:var(--fg-subtle)]">
+                <li>
+                  Report your model's results to{" "}
+                  <a href={EEE_SITE} target="_blank" rel="noreferrer" className={linkCls}>
+                    Every Eval Ever
+                  </a>{" "}
+                  so they show up here in context.
+                </li>
+                <li>
+                  Already on EEE?{" "}
+                  <Link href="/help/cross-post-to-hugging-face" className={linkCls}>
+                    Cross-post them to Hugging Face
+                  </Link>{" "}
+                  so your scores appear on the model page with a backlink.
+                </li>
+                <li>
+                  Document the run-level details that raise your signals — temperature and max
+                  tokens, the harness, and (for agentic evaluations) the eval plan and limits.
+                </li>
+                <li>
+                  See a wrong or missing number for your model? Flag it in the{" "}
+                  <a href={HF_DISCUSSIONS} target="_blank" rel="noreferrer" className={linkCls}>
+                    Space discussions
+                  </a>{" "}
+                  or via each record's correction path.
+                </li>
+              </ul>
+            </div>
+
+            {/* EVALUATION DEVELOPERS */}
+            <div className="border border-[color:var(--border-soft)] bg-[color:var(--bg-warm)] p-[22px]">
+              <div className="kicker mb-2">Evaluation developers</div>
+              <ul className="m-0 list-disc space-y-2 pl-4 text-[13.5px] leading-[1.6] text-[color:var(--fg-muted)] marker:text-[color:var(--fg-subtle)]">
+                <li>
+                  Upload your benchmark's results to{" "}
+                  <a href={EEE_SITE} target="_blank" rel="noreferrer" className={linkCls}>
+                    Every Eval Ever
+                  </a>{" "}
+                  so others can find, run, and reuse them.
+                </li>
+                <li>
+                  Fill in your benchmark's metadata — goals, construct, scoring rubric, intended
+                  uses, and limitations — to raise its{" "}
+                  <Link href="/help/how-signals-are-computed" className={linkCls}>
+                    completeness score
+                  </Link>
+                  .
+                </li>
+                <li>
+                  Report schema gaps or data issues on the{" "}
+                  <a href={EEE_ISSUES} target="_blank" rel="noreferrer" className={linkCls}>
+                    EEE issue tracker
+                  </a>
+                  .
+                </li>
+              </ul>
+            </div>
+
+            {/* RESEARCHERS */}
+            <div className="border border-[color:var(--border-soft)] bg-[color:var(--bg-warm)] p-[22px]">
+              <div className="kicker mb-2">Researchers</div>
+              <ul className="m-0 list-disc space-y-2 pl-4 text-[13.5px] leading-[1.6] text-[color:var(--fg-muted)] marker:text-[color:var(--fg-subtle)]">
+                <li>
+                  Use Evaluation Cards in your model-, evaluation-, or field-level analysis — and{" "}
+                  <Link href="/about#how-to-cite" className={linkCls}>
+                    cite the paper
+                  </Link>{" "}
+                  when you build on it.
+                </li>
+                <li>
+                  Report third-party results you've run to{" "}
+                  <a href={EEE_SITE} target="_blank" rel="noreferrer" className={linkCls}>
+                    Every Eval Ever
+                  </a>{" "}
+                  — independent numbers are first-class here.
+                </li>
+                <li>
+                  Flag discrepancies or suggest methodology improvements on the{" "}
+                  <a href={EEE_ISSUES} target="_blank" rel="noreferrer" className={linkCls}>
+                    issue tracker
+                  </a>{" "}
+                  or in the{" "}
+                  <a href={HF_DISCUSSIONS} target="_blank" rel="noreferrer" className={linkCls}>
+                    discussions
+                  </a>
+                  .
+                </li>
+                <li>Spread the word — share it with collaborators and on socials.</li>
+              </ul>
+            </div>
+
+            {/* POLICYMAKERS */}
+            <div className="border border-[color:var(--border-soft)] bg-[color:var(--bg-warm)] p-[22px]">
+              <div className="kicker mb-2">Policymakers</div>
+              <ul className="m-0 list-disc space-y-2 pl-4 text-[13.5px] leading-[1.6] text-[color:var(--fg-muted)] marker:text-[color:var(--fg-subtle)]">
+                <li>
+                  Consult Evaluation Cards as an evidence base — what's documented, who reported it,
+                  and how comparable it is.
+                </li>
+                <li>
+                  <Link href="/about#how-to-cite" className={linkCls}>
+                    Cite the paper
+                  </Link>{" "}
+                  in reports and briefings, and point colleagues to the site.
+                </li>
+                <li>
+                  Tell us what evidence you need for decisions — suggest features on the{" "}
+                  <a href={ROADMAP} target="_blank" rel="noreferrer" className={linkCls}>
+                    public roadmap
+                  </a>{" "}
+                  or via the{" "}
+                  <Link href="/feedback" className={linkCls}>
+                    feedback form
+                  </Link>
+                  .
+                </li>
+                <li>Spread the word so more of the field reports legibly.</li>
+              </ul>
+            </div>
+          </div>
+
+          <p className="mt-5 text-[14px] leading-[1.7] text-[color:var(--fg-muted)]">
+            Not sure where something fits? The{" "}
+            <a href={ROADMAP} target="_blank" rel="noreferrer" className={linkCls}>
+              public roadmap
+            </a>
+            , the{" "}
+            <Link href="/feedback" className={linkCls}>
+              feedback form
+            </Link>
+            , the{" "}
+            <a href={EEE_ISSUES} target="_blank" rel="noreferrer" className={linkCls}>
+              EEE issue tracker
+            </a>
+            , and the{" "}
+            <a href={HF_DISCUSSIONS} target="_blank" rel="noreferrer" className={linkCls}>
+              Space discussions
+            </a>{" "}
+            are always open.
+          </p>
+        </section>
+
+        {/* HOW TO CITE ---------------------------------------------------- */}
+        <section id="how-to-cite" className="mb-8 scroll-mt-24">
+          <div className="section-head">
+            <h2>How to cite</h2>
+          </div>
+          <CiteSection />
+        </section>
+
+        {/* CTA ROW -------------------------------------------------------- */}
+        <section className="mt-12 flex flex-wrap gap-3 border-t border-[color:var(--border-soft)] pt-10">
+          <ReplayIntroButton />
+          <Link href="/" className="btn-ec outline">
+            Back to home
+          </Link>
+          <Link href="/about" className="btn-ec outline">
+            About Evaluation Cards
+          </Link>
+          <a href={PAPER_URL} target="_blank" rel="noreferrer" className="btn-ec outline">
+            Read the paper
+            <ExternalLink className="h-3.5 w-3.5" aria-hidden />
+          </a>
+        </section>
+      </main>
+    </div>
+  )
+}

app/layout.tsx

@@ -3,6 +3,8 @@ import type { Metadata } from "next"
 import "./globals.css"
 import { AudienceModeProvider } from "@/components/audience-mode-provider"
 import { BackendRefreshListener } from "@/components/backend-refresh-listener"
+import { QuickStartProvider } from "@/components/quick-start"
+import { SiteFooter } from "@/components/site-footer"
 import { ThemeProvider } from "@/components/theme-provider"
 
 const SITE_URL = "https://evalcards.evalevalai.com"
@@ -67,8 +69,11 @@ export default function RootLayout({
       <body className="font-sans">
         <ThemeProvider attribute="class" defaultTheme="system" enableSystem disableTransitionOnChange>
           <AudienceModeProvider>
-            <BackendRefreshListener />
-            {children}
+            <QuickStartProvider>
+              <BackendRefreshListener />
+              {children}
+              <SiteFooter />
+            </QuickStartProvider>
           </AudienceModeProvider>
         </ThemeProvider>
       </body>

components/cite-block.tsx

@@ -0,0 +1,47 @@
+"use client"
+
+import { useState } from "react"
+import { Check, Copy } from "lucide-react"
+
+/** A labeled, copy-pasteable BibTeX block. */
+export function CiteBlock({ bibtex, label = "BibTeX" }: { bibtex: string; label?: string }) {
+  const [copied, setCopied] = useState(false)
+
+  const copy = async () => {
+    try {
+      await navigator.clipboard.writeText(bibtex)
+      setCopied(true)
+      setTimeout(() => setCopied(false), 1800)
+    } catch {
+      // clipboard unavailable — the text is still selectable in the <pre>.
+    }
+  }
+
+  return (
+    <div className="border border-[color:var(--border-soft)]">
+      <div className="flex items-center justify-between border-b border-[color:var(--border-soft)] bg-[color:var(--bg-warm)] px-4 py-2.5">
+        <span className="kicker">{label}</span>
+        <button
+          type="button"
+          onClick={copy}
+          className="inline-flex items-center gap-1.5 font-mono text-[11px] uppercase tracking-[0.12em] text-[color:var(--fg-muted)] transition-colors hover:text-[color:var(--fg)]"
+        >
+          {copied ? (
+            <>
+              <Check className="h-3.5 w-3.5 text-[color:var(--accent)]" aria-hidden />
+              Copied
+            </>
+          ) : (
+            <>
+              <Copy className="h-3.5 w-3.5" aria-hidden />
+              Copy
+            </>
+          )}
+        </button>
+      </div>
+      <pre className="m-0 overflow-x-auto p-4 font-mono text-[12px] leading-[1.6] text-[color:var(--fg)]">
+        <code>{bibtex}</code>
+      </pre>
+    </div>
+  )
+}

components/cite-section.tsx

@@ -0,0 +1,87 @@
+import Link from "next/link"
+
+import { CiteBlock } from "@/components/cite-block"
+import { cn } from "@/lib/utils"
+
+export const PAPER_URL = "https://arxiv.org/abs/2606.09809"
+export const PAPER_BIBTEX = `@article{ghosh2026evaluationcards,
+  title        = {Evaluation Cards: An Interpretive Layer for AI Evaluation Reporting},
+  author       = {Ghosh, Avijit and Reuel, Anka and Chim, Jenny and Kennedy, Wm. Matthew and Yadav, Srishti and Mickel, Jennifer and Long, Yanan and Tran, Andrew and Kornilova, Anastassia and Stachura, Damian and Klyman, Kevin and Friedrich, Felix and Sania, Jeba and Lamparth, Max and Batzner, Jan and Mishra, Anoop and Habba, Eliya and Hao, Yixiong and Heath, Nathan and Rismani, Shalaleh and Gohar, Usman and Loehr, Andrea and Manheim, David and Dhar, Ruchira and Nelaturu, Sree Harsha and Sinha, Aarush and Choshen, Leshem and Sharma, Drishti and Khire, Ishan and Saha, Amit and Sahoo, Subramanyam and Hardy, Michael and Riegler, Michael Alexander and Manghnani, Kabir and Lin, Michelle and Jiang, Yanan and Huang, Yilin and Yehudai, Asaf and Ji, Jessica and Hofmann, Aris and Akhtar, Mubashara and Moniz, Nuno and Jernite, Yacine and Biderman, Stella and Talat, Zeerak and Koyejo, Sanmi and Kochenderfer, Mykel and Solaiman, Irene},
+  journal      = {arXiv preprint arXiv:2606.09809},
+  year         = {2026},
+  url          = {https://arxiv.org/abs/2606.09809}
+}`
+
+export const EEE_BIBTEX = `@misc{evaleval2026everyevalever,
+  title   = {Every Eval Ever: Toward a Common Language for AI Eval Reporting},
+  author  = {Jan Batzner and Leshem Choshen and Avijit Ghosh and Sree Harsha Nelaturu and Anastassia Kornilova and Damian Stachura and Yifan Mai and Asaf Yehudai and Anka Reuel and Irene Solaiman and Stella Biderman},
+  year    = {2026},
+  month   = {February},
+  url     = {https://evalevalai.com/infrastructure/2026/02/17/everyevalever-launch/},
+  note    = {Blog Post, EvalEval Coalition}
+}`
+
+/**
+ * The "How to cite" body — share note, reference, copy-pasteable BibTeX. Shared
+ * by the About and Help pages so the citation stays in one place. Pass
+ * `showCorrection` to include the About page's correction card.
+ */
+export function CiteSection({ showCorrection = false }: { showCorrection?: boolean }) {
+  return (
+    <>
+      <p className="mb-5 max-w-[700px] text-[15px] leading-[1.7] text-[color:var(--fg-muted)]">
+        If you find this effort useful, please consider citing our paper and sharing our work on
+        socials.
+      </p>
+      <div className={cn("mb-5 grid gap-5", showCorrection && "lg:grid-cols-2")}>
+        <div className="border border-[color:var(--border-soft)] p-[22px]">
+          <div className="kicker mb-2.5">Reference</div>
+          <p className="m-0 text-[13.5px] leading-[1.7] text-[color:var(--fg)]">
+            Ghosh, A., Reuel, A., Chim, J., et al. (2026). Evaluation Cards: An Interpretive Layer
+            for AI Evaluation Reporting.{" "}
+            <a
+              href={PAPER_URL}
+              target="_blank"
+              rel="noreferrer"
+              className="underline underline-offset-2"
+            >
+              arXiv:2606.09809
+            </a>
+            .
+          </p>
+        </div>
+        {showCorrection && (
+          <div className="border border-[color:var(--border-soft)] p-[22px]">
+            <div className="kicker mb-2.5">Submit a correction</div>
+            <p className="m-0 text-[13.5px] leading-[1.65] text-[color:var(--fg-muted)]">
+              Spotted a wrong or missing number? Send it through our{" "}
+              <Link
+                href="/feedback"
+                className="text-[color:var(--fg)] underline underline-offset-2"
+              >
+                feedback form
+              </Link>{" "}
+              with a source, and we'll get it corrected. Coverage improves as developers and third
+              parties publish.
+            </p>
+          </div>
+        )}
+      </div>
+      <CiteBlock bibtex={PAPER_BIBTEX} label="BibTeX · Evaluation Cards" />
+
+      <p className="mt-6 mb-3 max-w-[700px] text-[14px] leading-[1.7] text-[color:var(--fg-muted)]">
+        <a
+          href="https://evalevalai.com/every_eval_ever/"
+          target="_blank"
+          rel="noreferrer"
+          className="text-[color:var(--fg)] underline underline-offset-2"
+        >
+          Every Eval Ever
+        </a>{" "}
+        (EEE) is a sister project and one of the data sources that powers Evaluation Cards — please
+        show it some love and cite it too. 💜
+      </p>
+      <CiteBlock bibtex={EEE_BIBTEX} label="BibTeX · Every Eval Ever" />
+    </>
+  )
+}

components/navigation.tsx

@@ -31,6 +31,11 @@ export function Navigation() {
       label: "Evaluations",
       isActive: pathname === "/evals" || pathname?.startsWith("/evals/"),
     },
+    {
+      href: "/help",
+      label: "Help",
+      isActive: pathname === "/help" || pathname?.startsWith("/help/"),
+    },
     {
       href: "/about",
       label: "About",

components/quick-start.tsx

@@ -0,0 +1,217 @@
+"use client"
+
+import { createContext, useContext, useEffect, useMemo, useState } from "react"
+import Link from "next/link"
+import {
+  ArrowRight,
+  BarChart3,
+  BookOpen,
+  Boxes,
+  FlaskConical,
+  Layers,
+  ShieldQuestion,
+} from "lucide-react"
+
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogTitle,
+} from "@/components/ui/dialog"
+import { cn } from "@/lib/utils"
+
+const STORAGE_KEY = "eval-cards-onboarding-seen"
+
+interface QuickStartContextValue {
+  /** Open the welcome tour (used by the footer + Help page "replay" links). */
+  open: () => void
+}
+
+const QuickStartContext = createContext<QuickStartContextValue | null>(null)
+
+interface Slide {
+  icon: React.ComponentType<{ className?: string }>
+  kicker: string
+  title: string
+  body: string
+}
+
+const SLIDES: Slide[] = [
+  {
+    icon: BookOpen,
+    kicker: "Welcome",
+    title: "What this is",
+    body: "Evaluation Cards collects how AI models have been tested across lots of benchmarks. A single score rarely tells you much on its own, so we give you everything you need to read one: the evaluation results, the benchmark's metadata, how the run was set up, and our interpretive signals. And unlike any other artefact out there, you can see those results reported side by side, which makes them easy to compare.",
+  },
+  {
+    icon: Layers,
+    kicker: "Reader modes",
+    title: "Two ways to read",
+    body: "Use the toggle in the top bar to switch views. Research shows the methodology: the settings, the configs, and what's missing. Summary keeps it plain. Either way you're looking at the same data.",
+  },
+  {
+    icon: BarChart3,
+    kicker: "Signals",
+    title: "Four things we check",
+    body: "Each result is scored on four things: whether it can be reproduced, how complete it is, where it came from, and whether it's fair to compare with other scores. Together they tell you how much to trust a number.",
+  },
+  {
+    icon: Boxes,
+    kicker: "Models",
+    title: "The Models tab",
+    body: "This is every model we track. Search or sort by developer, size, or release date, open one to see its full card, and pick up to four to compare.",
+  },
+  {
+    icon: FlaskConical,
+    kicker: "Evaluations",
+    title: "The Evaluations tab",
+    body: "Here you'll find the benchmarks, grouped from broad families down to single metrics. Filter by risk area or agentic tasks, and open any benchmark to see what it tests, where it falls short, and who's reported results on it.",
+  },
+  {
+    icon: ShieldQuestion,
+    kicker: "How we handle gaps",
+    title: "We don't fill in the blanks",
+    body: "If something wasn't reported, we leave it blank instead of guessing or estimating. A missing safety test tells you something too, so we'd rather show the gap than hide it.",
+  },
+]
+
+export function QuickStartProvider({ children }: { children: React.ReactNode }) {
+  const [open, setOpen] = useState(false)
+
+  // Auto-open on a visitor's first time, mirroring the audience-mode pattern.
+  useEffect(() => {
+    try {
+      if (!window.localStorage.getItem(STORAGE_KEY)) {
+        setOpen(true)
+      }
+    } catch {
+      // localStorage unavailable (e.g. privacy mode) — skip the tour silently.
+    }
+  }, [])
+
+  const markSeen = () => {
+    try {
+      window.localStorage.setItem(STORAGE_KEY, "1")
+    } catch {
+      // ignore
+    }
+  }
+
+  const handleOpenChange = (next: boolean) => {
+    setOpen(next)
+    if (!next) markSeen()
+  }
+
+  const value = useMemo<QuickStartContextValue>(() => ({ open: () => setOpen(true) }), [])
+
+  return (
+    <QuickStartContext.Provider value={value}>
+      {children}
+      <QuickStartDialog open={open} onOpenChange={handleOpenChange} />
+    </QuickStartContext.Provider>
+  )
+}
+
+export function useQuickStart(): QuickStartContextValue {
+  const context = useContext(QuickStartContext)
+  if (!context) {
+    throw new Error("useQuickStart must be used within a QuickStartProvider")
+  }
+  return context
+}
+
+function QuickStartDialog({
+  open,
+  onOpenChange,
+}: {
+  open: boolean
+  onOpenChange: (next: boolean) => void
+}) {
+  const [step, setStep] = useState(0)
+
+  // Reset to the first slide whenever the dialog is (re)opened.
+  useEffect(() => {
+    if (open) setStep(0)
+  }, [open])
+
+  const slide = SLIDES[step]
+  const Icon = slide.icon
+  const isLast = step === SLIDES.length - 1
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="gap-0 p-0 sm:max-w-[480px]">
+        <div className="p-7">
+          <div className="mb-5 flex h-11 w-11 items-center justify-center border border-[color:var(--border-soft)] bg-[color:var(--bg-warm)]">
+            <Icon className="h-5 w-5 text-[color:var(--accent)]" />
+          </div>
+          <div className="kicker mb-2">{slide.kicker}</div>
+          <DialogTitle className="text-[22px] font-semibold tracking-[-0.01em] text-[color:var(--fg)]">
+            {slide.title}
+          </DialogTitle>
+          <DialogDescription className="mt-2.5 text-[15px] leading-[1.65] text-[color:var(--fg-muted)]">
+            {slide.body}
+          </DialogDescription>
+
+          {isLast && (
+            <div className="mt-5 flex flex-wrap gap-2.5">
+              <Link href="/models" className="btn-ec" onClick={() => onOpenChange(false)}>
+                Explore models
+                <ArrowRight className="h-3.5 w-3.5" aria-hidden />
+              </Link>
+              <Link href="/help" className="btn-ec outline" onClick={() => onOpenChange(false)}>
+                Open the full guide
+              </Link>
+            </div>
+          )}
+        </div>
+
+        {/* Footer: progress dots + navigation */}
+        <div className="flex items-center justify-between border-t border-[color:var(--border-soft)] px-7 py-4">
+          <div className="flex items-center gap-1.5" aria-hidden>
+            {SLIDES.map((_, i) => (
+              <span
+                key={i}
+                className={cn(
+                  "h-1.5 w-1.5 rounded-full transition-colors",
+                  i === step ? "bg-[color:var(--fg)]" : "bg-[color:var(--border-strong)]"
+                )}
+              />
+            ))}
+          </div>
+
+          <div className="flex items-center gap-2">
+            {step > 0 ? (
+              <button
+                type="button"
+                className="btn-ec ghost"
+                onClick={() => setStep((s) => Math.max(0, s - 1))}
+              >
+                Back
+              </button>
+            ) : (
+              <button type="button" className="btn-ec ghost" onClick={() => onOpenChange(false)}>
+                Skip
+              </button>
+            )}
+
+            {isLast ? (
+              <button type="button" className="btn-ec" onClick={() => onOpenChange(false)}>
+                Get started
+              </button>
+            ) : (
+              <button
+                type="button"
+                className="btn-ec"
+                onClick={() => setStep((s) => Math.min(SLIDES.length - 1, s + 1))}
+              >
+                Next
+                <ArrowRight className="h-3.5 w-3.5" aria-hidden />
+              </button>
+            )}
+          </div>
+        </div>
+      </DialogContent>
+    </Dialog>
+  )
+}

components/replay-intro-button.tsx

@@ -0,0 +1,16 @@
+"use client"
+
+import { Play } from "lucide-react"
+
+import { useQuickStart } from "@/components/quick-start"
+import { cn } from "@/lib/utils"
+
+export function ReplayIntroButton({ className }: { className?: string }) {
+  const { open } = useQuickStart()
+  return (
+    <button type="button" onClick={open} className={cn("btn-ec outline", className)}>
+      <Play className="h-3.5 w-3.5" aria-hidden />
+      Replay the intro
+    </button>
+  )
+}

components/site-footer.tsx

@@ -0,0 +1,57 @@
+"use client"
+
+import Link from "next/link"
+
+import { useQuickStart } from "@/components/quick-start"
+
+export function SiteFooter() {
+  const { open } = useQuickStart()
+
+  return (
+    <footer className="border-t border-[color:var(--border-soft)] bg-[color:var(--bg-warm)]">
+      <div className="mx-auto flex w-full max-w-[96rem] flex-col gap-3 px-4 py-6 sm:flex-row sm:items-center sm:justify-between sm:px-8">
+        <span className="font-mono text-[11px] uppercase tracking-[0.12em] text-[color:var(--fg-subtle)]">
+          Evaluation Cards · EvalEval Coalition
+        </span>
+        <nav className="flex flex-wrap items-center gap-x-5 gap-y-2 font-mono text-[11px] uppercase tracking-[0.12em] text-[color:var(--fg-muted)]">
+          <Link href="/about" className="transition-colors hover:text-[color:var(--fg)]">
+            About
+          </Link>
+          <Link href="/help" className="transition-colors hover:text-[color:var(--fg)]">
+            Help
+          </Link>
+          <Link
+            href="/help#how-to-contribute"
+            className="transition-colors hover:text-[color:var(--fg)]"
+          >
+            How to contribute
+          </Link>
+          <Link
+            href="/about#how-to-cite"
+            className="transition-colors hover:text-[color:var(--fg)]"
+          >
+            How to cite
+          </Link>
+          <Link href="/feedback" className="transition-colors hover:text-[color:var(--fg)]">
+            Feedback
+          </Link>
+          <a
+            href="https://arxiv.org/abs/2606.09809"
+            target="_blank"
+            rel="noreferrer"
+            className="transition-colors hover:text-[color:var(--fg)]"
+          >
+            Paper
+          </a>
+          <button
+            type="button"
+            onClick={open}
+            className="uppercase tracking-[0.12em] transition-colors hover:text-[color:var(--fg)]"
+          >
+            Replay intro
+          </button>
+        </nav>
+      </div>
+    </footer>
+  )
+}

components/tutorial-markdown.tsx

@@ -0,0 +1,101 @@
+"use client"
+
+import Link from "next/link"
+import { ImageIcon } from "lucide-react"
+import ReactMarkdown, { defaultUrlTransform } from "react-markdown"
+import rehypeKatex from "rehype-katex"
+import remarkGfm from "remark-gfm"
+import remarkMath from "remark-math"
+
+import { cn } from "@/lib/utils"
+
+/**
+ * Renders a pre-processed tutorial markdown string (see lib/tutorials.ts) with
+ * the site's design tokens. Handles two source-specific concerns:
+ *  - relative `*.md` / `../about` links are rewritten to in-app routes;
+ *  - `placeholder:<file>` image sources render as styled "screenshot coming"
+ *    callouts instead of broken images.
+ */
+export function TutorialMarkdown({ source }: { source: string }) {
+  return (
+    <div className="tutorial-prose">
+      <ReactMarkdown
+        remarkPlugins={[remarkGfm, remarkMath]}
+        rehypePlugins={[rehypeKatex]}
+        // Preserve our internal `placeholder:` scheme for missing screenshots;
+        // react-markdown would otherwise sanitize the URL away.
+        urlTransform={(url) =>
+          url.startsWith("placeholder:") ? url : defaultUrlTransform(url)
+        }
+        components={{
+          a: ({ href, children }) => {
+            const target = resolveHref(String(href ?? ""))
+            if (target.external) {
+              return (
+                <a href={target.href} target="_blank" rel="noreferrer">
+                  {children}
+                </a>
+              )
+            }
+            return <Link href={target.href}>{children}</Link>
+          },
+          img: ({ src, alt }) => {
+            const value = String(src ?? "")
+            if (value.startsWith("placeholder:")) {
+              return <ScreenshotPlaceholder file={value.slice("placeholder:".length)} note={alt} />
+            }
+            return (
+              <figure className="tut-figure">
+                <span className="tut-figure-frame block">
+                  {/* eslint-disable-next-line @next/next/no-img-element */}
+                  <img src={value} alt={alt ?? ""} loading="lazy" />
+                </span>
+                {alt ? <figcaption>{alt}</figcaption> : null}
+              </figure>
+            )
+          },
+        }}
+      >
+        {source}
+      </ReactMarkdown>
+    </div>
+  )
+}
+
+function resolveHref(href: string): { href: string; external: boolean } {
+  if (/^https?:\/\//.test(href) || href.startsWith("mailto:")) {
+    return { href, external: true }
+  }
+  if (href.startsWith("#")) {
+    return { href, external: false }
+  }
+  // Relative links between guides, e.g. "quickstart.md" → "/help/quickstart".
+  if (href.endsWith(".md")) {
+    const base = href.replace(/^.*\//, "").replace(/\.md$/, "")
+    return { href: `/help/${base}`, external: false }
+  }
+  // Relative escapes to the app root, e.g. "../about" → "/about".
+  if (href.startsWith("../") || href.startsWith("./")) {
+    const cleaned = href.replace(/^(\.\.\/|\.\/)+/, "")
+    return { href: `/${cleaned}`, external: false }
+  }
+  return { href, external: false }
+}
+
+function ScreenshotPlaceholder({ file, note }: { file: string; note?: string }) {
+  return (
+    <div
+      className={cn(
+        "my-6 flex gap-3 border border-dashed border-[color:var(--border-strong)]",
+        "bg-[color:var(--bg-subtle)] p-4 text-[color:var(--fg-muted)]"
+      )}
+    >
+      <ImageIcon className="mt-0.5 h-4 w-4 shrink-0 text-[color:var(--fg-subtle)]" aria-hidden />
+      <div className="min-w-0">
+        <div className="kicker mb-1">Screenshot coming</div>
+        <code className="font-mono text-[12px] text-[color:var(--fg)]">{file}</code>
+        {note ? <p className="m-0 mt-1.5 text-[13px] leading-[1.6]">{note}</p> : null}
+      </div>
+    </div>
+  )
+}

content/tutorials/cross-post-to-hugging-face.md

@@ -0,0 +1,65 @@
+# Cross-post Every Eval Ever results to Hugging Face
+
+*Send an Every Eval Ever (EEE) record to Hugging Face Community Evals so your score shows up on the model page — with a backlink to the full structured record.*
+
+> **Audience:** contributors who already report evaluation results to [Every Eval Ever](https://github.com/evaleval/every_eval_ever). This is the more technical companion to the stakeholder guides.
+
+---
+
+## Why this exists
+
+Every Eval Ever (EEE) launched in February 2026 as a project of the EvalEval Coalition — a cross-institutional effort to fix how AI evaluation results get reported. Eval results matter for capability measurement, safety, and governance, yet they are scattered and hard to compare: they live in papers, leaderboards, blog posts, and harness logs, each in its own format, and the same model on the same benchmark often returns different numbers depending on who ran it and how.
+
+LLaMA 65B, for example, has been reported at both **63.7** and **48.8** on MMLU. That gap came down to the evaluation harness, not the model — and usually you can't even see a gap like that, because the metadata that would explain it isn't recorded.
+
+EEE is the fix for the reporting side: **one JSON schema** for an evaluation result that records who ran it, which model, how it was accessed, the generation settings, and what the metric actually means — with an optional companion file for per-sample outputs. It takes in results from any source, so harness logs, leaderboard scrapes, and paper numbers all end up in the same shape. Since launching, the datastore on Hugging Face has grown to around **229,000 evaluation results** across more than **22,000 models** and **2,200 benchmarks**, pulled from **31** different reporting formats. Reproducing those runs from scratch would cost somewhere in the hundreds of thousands of dollars — a reasonable argument for not letting the data scatter once someone has paid to generate it.
+
+## What cross-posting does
+
+You can now send your EEE results to **Hugging Face Community Evals** for official benchmarks. A converter takes an EEE record and writes the small YAML file Hugging Face expects, so you don't have to maintain the same result in two formats by hand.
+
+Once you share, two things happen:
+
+- Your score **appears on the Hugging Face model page** and is pulled into the benchmark's leaderboard.
+- It carries a **source badge that links back to the full EEE record** — where the generation config, harness version, reproducibility notes, and any instance-level data live.
+
+The two destinations do different jobs toward the same goal. Hugging Face puts your result where people look at models, with a link back to the source. EEE keeps the full structured record that makes the result interpretable — and powers Evaluation Cards on top of it. Send your data to both and the same evaluation ends up visible and legible at once, which is the point of reporting one at all.
+
+## How it works
+
+Hugging Face stores eval scores in the model repo, as a YAML file under `.eval_results/`. The required fields are just the benchmark dataset, the task, and the value. The `source` block is optional — and it's the part that creates the backlink to EEE.
+
+```yaml
+- dataset:
+    id: openai/gsm8k
+    task_id: gsm8k
+  value: 96.8
+  date: '2024-07-16'
+  notes: '8-shot CoT'
+  source:
+    url: https://huggingface.co/datasets/evaleval/EEE_datastore/blob/main/data/gsm8k/<dev>/<model>/<uuid>.json
+    name: EvalEval
+```
+
+The converter fills this in from your existing record. It maps:
+
+| EEE field | Hugging Face YAML field |
+|---|---|
+| `source_data.hf_repo` | `dataset.id` |
+| `evaluation_name` | `task_id` |
+| `score_details.score` | `value` |
+| `evaluation_timestamp` | `date` |
+
+…then drops in the `source` link to the per-record EEE JSON. It **skips any model repo that already has a YAML for the same dataset and task**, so re-running it won't open duplicate PRs.
+
+## Start here
+
+If you already contribute to EEE, this is one extra step and the converter handles most of it:
+
+1. Submit your full record to the EEE datastore the usual way — the [GitHub repo](https://github.com/evaleval/every_eval_ever) has the contributor guide and converters.
+2. Run the converter to generate the Hugging Face YAML.
+3. Open the PR on the model's **Community** tab.
+
+---
+
+*Adapted from "Cross-post your Every Eval Ever results onto Hugging Face model pages" — Netaluru Harsha, Nathan Habib, Avijit Ghosh.*

content/tutorials/evaluation-researchers.md

@@ -0,0 +1,106 @@
+# Evaluation Cards for Evaluation Researchers
+
+*How to use Evaluation Cards as a working tool for studying, auditing, and comparing model evaluations.*
+
+> **Prerequisite:** skim the [Quickstart](quickstart.md) first for the four signals and the five-level hierarchy.
+
+---
+
+## Why this matters for your work
+
+If you study evaluations, you already know the core problem: published benchmark numbers are rarely accompanied by the prompts, decoding settings, harness versions, seeds, or evaluator identity needed to interpret or reproduce them. Evaluation Cards canonicalizes heterogeneous reporting into a single structured corpus where the **absence** of those details is recorded explicitly rather than silently dropped.
+
+The design principles that matter most for research use:
+
+- **Every score is attributed to its source document.** Provenance is first-class.
+- **Missing values are never imputed.** A blank is "not reported," never a guessed number.
+- **Evaluator identity is preserved.** First-party and third-party results are kept distinct.
+- **Snapshot discipline.** No retroactive edits; corrections are versioned. Your analyses are reproducible against a dated snapshot.
+
+---
+
+## The Researcher View
+
+The model card has two modes, toggled top-right. **Summary View** is for orientation; **Researcher View** is where you work.
+
+> 🖼️ **Screenshot — `19-card-researcher-full.png`**
+> *What to capture:* A model card (e.g. `/models/anthropic/claude-opus-4.7`) after clicking **Researcher View** — show the expanded per-result detail.
+
+> 🖼️ **Screenshot — `20-card-researcher-top.png`**
+> *What to capture:* The top of the Researcher View (the view toggle + the documentation summary line).
+
+Researcher View exposes the per-result granularity behind the summary aggregates: setup variants, slices, metric paths, source harnesses, and the document each number came from.
+
+---
+
+## Working through a card, section by section
+
+A model Evaluation Card is organized into four numbered sections.
+
+### §1 Identification
+Model name, developer, release date, modalities (e.g. *image, text → text*), system ID, and last-updated. The stable identifier (`ec/models/<dev>/<model>`) is what you cite.
+
+> 🖼️ **Screenshot — `15-card-identification.png`**
+> *What to capture:* The §1 Identification block of a model card.
+
+### §2 Benchmark coverage
+A benchmark-first view grouped by category, surfacing **setup spread** and **slice-vs-setup** differences up front. Watch the "slice spread" note (e.g. *"2 benchmarks include multiple slices or setups"*) — these are exactly the cases where naïve aggregation hides variance.
+
+> 🖼️ **Screenshot — `16-card-coverage.png`**
+> *What to capture:* The §2 Benchmark coverage section.
+
+### §3 Who reports what
+A first-party / third-party split as a donut plus per-category bars. This is the provenance signal made concrete. In the captured example (*Claude Opus 4.7*, 39 results): **12 first-party (31%)** vs **27 third-party (69%)**, with per-category breakdowns (e.g. *Finance: 0 first-party · 3 third-party*; *Multimodal Input: 2 · 2*).
+
+> 🖼️ **Screenshot — `17-card-who-reports.png`**
+> *What to capture:* The §3 "Who reports what" section.
+
+For research: a category that is **entirely first-party** is a known blind spot — there is no independent corroboration of those numbers.
+
+### §4 Reported metrics
+Per-benchmark charts with controls to filter by **Source**, **Category**, and **Overlaps**, plus a family selector. Each chart marks direction ("higher is better"), the slices included, and the reporting org. This is where you read off the actual numbers and their setup context.
+
+> 🖼️ **Screenshot — `18-card-metrics.png`**
+> *What to capture:* The §4 Reported metrics section, ideally with a benchmark chart expanded.
+
+> 🖼️ **Screenshot — `21-card-researcher-metrics.png`**
+> *What to capture:* The §4 metrics area in **Researcher View**, showing the per-result detail (setup variants / slices).
+
+---
+
+## Reading the four signals rigorously
+
+| Signal | What to inspect | Research caution |
+|---|---|---|
+| **Reproducibility** | Disclosure of setup variants, prompts, decoding params, harness version, seeds, code availability. | "Reproducible in principle" ≠ "reproduced." Only ~3% of scores have complete setup documentation corpus-wide. |
+| **Completeness** | Coverage across capability / robustness / safety / fairness for the model class. | A complete *capability* record can still be silent on safety. Completeness is relative to expectations, not absolute. |
+| **Provenance & Risk** | First- vs third-party; mapping to **IBM Risk Atlas** risk domains. | First-party numbers are not wrong, but they are not independent. Check §3 before ranking. |
+| **Comparability** | Slice, metric variant, and unit differences within the same benchmark. | Two "MMLU" numbers may use different slices or metrics — flagged here. Do not rank across incomparable setups. |
+
+---
+
+## Comparing models and benchmarks
+
+- **Models index** (`/models`): filter by parameter range (`< 1B` … `> 500B`, presets at 8B/12B/32B/128B, plus an *Unknown size* option), and toggle **Models ↔ Developers**.
+
+  > 🖼️ **Screenshot — `10-models-controls.png`**
+  > *What to capture:* The Models index controls (parameter slider, Models/Developers toggle, "selected to compare" counter).
+
+- **Side-by-side compare:** select up to four models via the **Add to compare** buttons.
+  > ⚠️ *As of this writing the populated compare view is intermittently unavailable on the beta backend (cold-start errors). If it fails, retry after a few seconds.*
+
+- **Evaluations index** (`/evals`): families filterable by **interaction style** (agent / non-agent) and category. Drill into a family at `/evals?family=<slug>` to see its benchmarks → slices → metrics.
+
+  > 🖼️ **Screenshot — `08-evals-family-expanded.png`**
+  > *What to capture:* A benchmark family detail page (e.g. `/evals?family=artificial-analysis`) showing its benchmarks and slices.
+
+---
+
+## Methodological caveats to carry
+
+1. **Comparability is bounded by setup.** The site flags when two scores under the same benchmark are not directly comparable — respect those flags in any ranking or meta-analysis.
+2. **Coverage ≠ quality.** Many results with weak documentation can look like "good coverage." Weight by the signals.
+3. **The corpus reflects what was reported, not all that exists.** Undisclosed evaluations are absent by definition.
+4. **Pin a snapshot.** Cite `ec/models/...` identifiers plus the snapshot date so your analysis is reproducible.
+
+➡️ Related: [Policymakers](policymakers.md) (governance framing) · [Quickstart](quickstart.md).

content/tutorials/general-public.md

@@ -0,0 +1,97 @@
+# Evaluation Cards — A Guide for Everyone
+
+*Plain-language: what an AI "benchmark score" really means, and how to read these cards.*
+
+You don't need a technical background for this guide. If you've seen headlines like *"New AI model scores 90% on a reasoning test!"* and wondered what that actually means, you're in the right place.
+
+---
+
+## What is this website?
+
+**Evaluation Cards** is like a nutrition label for AI model test results.
+
+When companies build AI models, they run them through standardized tests called **benchmarks** (think: a standardized exam for AI). They then publish scores. But a score by itself — "92%" — leaves out a lot: Who gave the test? Under what conditions? Can anyone else get the same result? Were important topics even tested?
+
+Evaluation Cards collects these scores from across the industry and, crucially, shows you **what's missing** — so a polished number doesn't get mistaken for the full story.
+
+> 🖼️ **Screenshot — `01-home-overview.png`**
+> *What to capture:* The homepage showing the totals (thousands of models and results).
+
+---
+
+## Why a single score can be misleading
+
+Imagine a student says "I got 95% on the exam." Reasonable follow-ups:
+
+- *Which* exam? (An easy one or a hard one?)
+- Did they grade it **themselves**, or did an independent teacher?
+- Could someone else **re-take it under the same conditions** and get a similar result?
+- Did the exam even cover the topics you care about?
+
+These are exactly the questions Evaluation Cards helps you ask about AI models. A high score with no answers to these questions is just a number.
+
+---
+
+## The four things to check (the "signals")
+
+Every result is rated on four simple ideas. You don't need the math — just the gist.
+
+> 🖼️ **Screenshot — `03-home-signals.png`**
+> *What to capture:* The four signal cards on the homepage.
+
+| Signal | In plain words |
+|---|---|
+| 🔁 **Reproducibility** | Could someone else repeat this test and get the same result? If the details are secret, the answer is "we can't tell." |
+| 📋 **Completeness** | Did they test the things that matter — not just the flattering stuff, but also safety and fairness? |
+| 👤 **Provenance** | Who ran the test — the **company that made the model**, or an **independent group**? |
+| ⚖️ **Comparability** | Can you fairly compare this model's score to another model's? (Sometimes it's apples vs. oranges.) |
+
+**The big one for everyday readers: Provenance.** A company grading its own homework isn't *wrong*, but it isn't the same as an independent referee. The site always shows you which is which.
+
+---
+
+## How to read a model's "card"
+
+Let's walk through one.
+
+**Step 1 — Find a model.** Click **Models** in the menu and pick one you've heard of.
+
+> 🖼️ **Screenshot — `09-models-index.png`**
+> *What to capture:* The Models list page.
+
+**Step 2 — Open its card.** Each model gets an "Evaluation Card."
+
+> 🖼️ **Screenshot — `13-card-summary-full.png`**
+> *What to capture:* A full model card in **Summary View**.
+
+**Step 3 — Look for the "Documented" number.** Near the top you'll see something like **"36% documented."** Higher means more of the test details were shared. A low number isn't a scandal — it's just telling you *"take these scores with a grain of salt; a lot wasn't disclosed."*
+
+> 🖼️ **Screenshot — `14-card-summary-top.png`**
+> *What to capture:* The top of a model card with the DOCUMENTED percentage.
+
+**Step 4 — See who did the testing.** Scroll to **"Who reports what."** A simple chart splits results into the **company's own** results vs **independent** ones.
+
+> 🖼️ **Screenshot — `17-card-who-reports.png`**
+> *What to capture:* The "Who reports what" chart (company vs. independent).
+
+That's it. You can stop there and already read these results more wisely than most headlines do.
+
+---
+
+## What this site is *not*
+
+- ❌ It's **not** a "best AI" leaderboard. It won't crown a winner.
+- ❌ It **won't** tell you a model is "safe" — only how thoroughly (and by whom) it was tested.
+- ❌ Blanks are **not** zeros. A blank means "nobody reported this," not "the model failed."
+
+---
+
+## Three takeaways
+
+1. **A score is a claim, not a guarantee.** Always ask who measured it and how.
+2. **Independent results carry more weight** than a company testing its own product.
+3. **What's missing matters.** If safety was never tested, the absence is part of the story.
+
+That's the whole idea: not "which AI is best," but **"how much should we trust what we're being told about it?"**
+
+➡️ Curious for more? The [Quickstart](quickstart.md) goes a little deeper without getting technical.

content/tutorials/get-verified.md

@@ -0,0 +1,12 @@
+# Get a verified checkmark
+
+*How to have your evaluation results show up as verified on Evaluation Cards.*
+
+---
+
+Submit your evaluation data through a Hugging Face account associated with your organisation's HF org, and we'll mark your results with a **verified checkmark** — a signal to readers that the numbers come straight from the source.
+
+We're calling on **all model developers and evaluators** to send their data this way. The more results that arrive verified and in a common format, the more of the corpus can be compared apples to apples.
+
+> 🖼️ **Screenshot — `verified-checkmark.png`**
+> *What to capture:* A verified result on a model page showing the checkmark badge, with its tooltip open explaining that the data was submitted through the organisation's verified Hugging Face account.

content/tutorials/how-signals-are-computed.md

@@ -0,0 +1,145 @@
+# How the four signals are computed
+
+*The technical companion to the four interpretive signals. This formalizes how each one is calculated, the fields it depends on, and how it rolls up across the corpus. Adapted from Appendix H.1 of the paper.*
+
+> **See also:** the [About page](/about#four-interpretive-signals) explains what each signal means in plain language. This page is the precise definition behind it.
+
+---
+
+## The result triple
+
+Every signal is computed over a **result triple** $r = (m, b, \mu)$:
+
+- $m$ — a canonical model identifier,
+- $b$ — a metric-path through the rollout hierarchy (family → composite → benchmark → split),
+- $\mu$ — a metric.
+
+$R$ is the set of all such triples in the corpus, and $B$ the set of canonical benchmarks. For any field $f$ and triple $r$:
+
+$$
+\mathrm{pop}(f, r) =
+\begin{cases}
+1 & \text{if } f \text{ is populated in the record for } r, \\
+0 & \text{otherwise,}
+\end{cases}
+$$
+
+and $\mathrm{pop}(f, b)$ is defined analogously for a benchmark $b$ and its Auto-BenchmarkCards record.
+
+## Reproducibility
+
+**In plain terms.** For each result, we check whether the small set of fields needed to re-run the evaluation are present. If any are missing, we flag the result.
+
+The minimal reproducibility sub-schema is:
+
+$$
+F_{\mathrm{repro}} = \{\, \texttt{temperature},\ \texttt{max\_tokens} \,\}.
+$$
+
+For **agentic** evaluations, $F_{\mathrm{repro}}$ is extended with $\texttt{harness}$, $\texttt{eval\_plan}$, and $\texttt{eval\_limits}$.
+
+A result $r$ is flagged as a reproducibility gap if **any** required field is missing:
+
+$$
+G_{\mathrm{repro}}(r) = 1 - \prod_{f \in F_{\mathrm{repro}}} \mathrm{pop}(f, r).
+$$
+
+That is, $G_{\mathrm{repro}}(r) = 0$ only when every field in $F_{\mathrm{repro}}$ is populated. The interface lists the specific missing fields, $\{\, f \in F_{\mathrm{repro}} : \mathrm{pop}(f, r) = 0 \,\}$.
+
+Corpus-level reproducibility is the share of flagged triples, and per-field reporting uses the missingness rate:
+
+$$
+\bar{G}_{\mathrm{repro}} = \frac{1}{|R|} \sum_{r \in R} G_{\mathrm{repro}}(r),
+\qquad
+\bar{m}(f) = 1 - \frac{1}{|R|} \sum_{r \in R} \mathrm{pop}(f, r),\quad f \in F_{\mathrm{repro}}.
+$$
+
+## Reporting completeness
+
+**In plain terms.** For each benchmark, we count how many of the 28 schema fields are populated. Present-or-absent fields score 0 or 1; fields that contain sub-items score the fraction of sub-items populated. The completeness score is the average across all 28 fields.
+
+Let $F = \{ f_1, \dots, f_N \}$ be the operationalized schema with $N = 28$ fields, ingested from Auto-BenchmarkCards and EEE plus the reserved Evaluation Cards fields. Each field has a coverage type $\tau(f) \in \{ \text{full}, \text{reserved}, \text{partial} \}$, and the per-field score $s(f, b) \in [0, 1]$ is:
+
+$$
+s(f, b) =
+\begin{cases}
+\mathrm{pop}(f, b) & \text{if } \tau(f) \in \{ \text{full}, \text{reserved} \}, \\[1.2em]
+\dfrac{1}{|\mathrm{sub}(f)|} \displaystyle\sum_{f' \in \mathrm{sub}(f)} \mathrm{pop}(f', b) & \text{if } \tau(f) = \text{partial,}
+\end{cases}
+$$
+
+where $\mathrm{sub}(f)$ is the set of sub-items under a partial-coverage field. For example, a partial field with 4 sub-items, 2 of which are populated, scores $0.5$.
+
+The completeness score for a benchmark is the unweighted mean across fields:
+
+$$
+C(b) = \frac{1}{N} \sum_{f \in F} s(f, b) = \frac{1}{28} \sum_{f \in F} s(f, b).
+$$
+
+The interface surfaces $C(b)$ alongside the count of fully missing fields, $|\{\, f \in F : s(f, b) = 0 \,\}|$. Across the corpus we report the median per-benchmark completeness, $\mathrm{median}_{b \in B}\, C(b)$, and per-field population rates, $\bar{p}(f) = \frac{1}{|B|} \sum_{b \in B} s(f, b)$.
+
+Completeness and reproducibility are distinct: $F_{\mathrm{repro}} \subset F$, so a result with no reproducibility gap may still have low completeness.
+
+## Provenance
+
+**In plain terms.** For each reported score, we surface three things: who reported it (first-party, third-party, or collaborative), whether anyone else also reported the same score, and any risk categories associated with the benchmark.
+
+Let $\rho(r) \in \{ \texttt{first\_party}, \texttt{third\_party}, \texttt{collaborative} \}$ be the evaluator relationship for triple $r$. For a triple $(m, b, \mu)$, the set of records reporting it is $R(m, b, \mu) = \{ r \in R : r = (m, b, \mu) \}$.
+
+A score is **first-party-only** if every report comes from the model developer:
+
+$$
+\mathrm{FPO}(m, b, \mu) =
+\begin{cases}
+1 & \text{if } \rho(r) = \texttt{first\_party} \text{ for all } r \in R(m, b, \mu), \\
+0 & \text{otherwise.}
+\end{cases}
+$$
+
+The multi-party indicator is $\mathrm{MP}(m, b, \mu) = 1$ when $|R(m, b, \mu)| > 1$, and $0$ otherwise. Risk annotations are propagated from the Auto-BenchmarkCards risk-mapping component: each benchmark $b$ carries a set of risk categories $K(b)$. These are shown as attention cues in the interface and do **not** enter a numerical score.
+
+## Comparability
+
+**In plain terms.** For each $(m, b, \mu)$ triple with at least two reports, we check whether reported scores differ by more than 5% of the metric's range. We do this two ways — across setups for the same party (variant divergence) and across different parties (cross-party divergence). Either one triggers a flag.
+
+Let $[\mu_{\min}, \mu_{\max}]$ be the metric's native scale and $\theta = 0.05$ the divergence threshold.
+
+**Variant divergence.** For a triple with multiple reported setups (differing in fields such as $\texttt{max\_tokens}$, tool configuration, or agentic scaffolding), let $V(m, b, \mu)$ be the set of distinct variants and $\sigma(v)$ the score under variant $v$. It is flagged when the spread exceeds $\theta$:
+
+$$
+D_{\mathrm{var}}(m, b, \mu) =
+\begin{cases}
+1 & \text{if } \dfrac{\max_v \sigma(v) - \min_v \sigma(v)}{\mu_{\max} - \mu_{\min}} > \theta, \\[1.4em]
+0 & \text{otherwise.}
+\end{cases}
+$$
+
+The differing fields are surfaced as the comparability annotation.
+
+**Cross-party divergence.** Let $P(m, b, \mu) = \{ \rho(r) : r \in R(m, b, \mu) \}$ be the set of reporting parties and $\sigma(p)$ the score reported by party $p$ (averaged across variants within a party if needed). It is flagged when more than one party reports the triple and the spread exceeds $\theta$:
+
+$$
+D_{\mathrm{cp}}(m, b, \mu) =
+\begin{cases}
+1 & \text{if } |P(m, b, \mu)| > 1 \text{ and } \dfrac{\max_p \sigma(p) - \min_p \sigma(p)}{\mu_{\max} - \mu_{\min}} > \theta, \\[1.4em]
+0 & \text{otherwise.}
+\end{cases}
+$$
+
+The underlying setup differences across parties are rendered alongside the divergence.
+
+**Combined flag.** The overall comparability signal is the maximum of the two:
+
+$$
+D_{\mathrm{comp}}(m, b, \mu) = \max\big(\, D_{\mathrm{var}}(m, b, \mu),\ D_{\mathrm{cp}}(m, b, \mu) \,\big).
+$$
+
+The threshold $\theta = 0.05$ is applied uniformly across metrics; metric-specific thresholds are a candidate extension.
+
+---
+
+## One thing to keep in mind
+
+None of these signals is a grade. Evaluation Cards assigns no letter grades, pass/fail thresholds, or completeness rankings — when a field is omitted, it lowers the completeness score, may trip the reproducibility, provenance, or comparability signals, and is shown to readers directly. The intent is to make reporting choices visible, not to enforce a particular reporting standard.
+
+*Adapted from [Appendix H.1, "Computation of Interpretive Signals"](https://arxiv.org/abs/2606.09809) of the paper.*

content/tutorials/journalists.md

@@ -0,0 +1,91 @@
+# Evaluation Cards for Journalists
+
+*How to source AI benchmark claims accurately, cite them defensibly, and avoid the common overclaiming traps.*
+
+> **Prerequisite:** the [Quickstart](quickstart.md) (~10 min) covers the four signals and the snapshot model.
+
+---
+
+## Why this is a reporting tool, not just a database
+
+AI companies publish benchmark numbers constantly, often in launch posts engineered for headlines. Evaluation Cards lets you do three things fast:
+
+1. **Verify** whether a claimed score is independently corroborated or self-reported.
+2. **Contextualize** a number with how well-documented and comparable it actually is.
+3. **Cite** a stable, dated source instead of a marketing page.
+
+The project's framing is useful for reporters: a published score is a **claim**, and an undisclosed detail is **a claim deliberately not made**. Your job is to report which is which.
+
+> 🖼️ **Screenshot — `01-home-overview.png`**
+> *What to capture:* The homepage with the corpus snapshot.
+
+---
+
+## The 3-minute fact-check
+
+A company claims "Model X leads on benchmark Y." Before you repeat it:
+
+**1. Find the model card.** Models → search.
+
+> 🖼️ **Screenshot — `09-models-index.png`**
+> *What to capture:* The Models index.
+
+**2. Is the claim first-party or third-party?** Open **§3 "Who reports what."** If the impressive number is the company's *own* result with no independent corroboration, say so in your piece.
+
+> 🖼️ **Screenshot — `17-card-who-reports.png`**
+> *What to capture:* The §3 first-party vs third-party breakdown.
+
+**3. How documented is it?** The **`DOCUMENTED`** badge (e.g. "36% — 14/39 reported") tells you how much of the record is fully specified. A flashy score with weak documentation is a weak claim — worth a caveat.
+
+> 🖼️ **Screenshot — `14-card-summary-top.png`**
+> *What to capture:* The card header with the DOCUMENTED badge.
+
+**4. Is the comparison even valid?** The **Comparability** signal flags when two scores on the "same" benchmark used different slices, metrics, or units. "Beats the competition" headlines frequently fail this test.
+
+**5. Was the relevant area tested at all?** Check **§2 Benchmark coverage**. If a safety/robustness claim has no corresponding evaluation, the absence is your story.
+
+> 🖼️ **Screenshot — `16-card-coverage.png`**
+> *What to capture:* The §2 Benchmark coverage section.
+
+---
+
+## Finding who reported what (sourcing)
+
+Every score is attributed to its source document and reporting organization. Use the **Evaluations** page to explore a benchmark family and see which organizations reported results, and the model card's §4 to see the source harness behind each number.
+
+> 🖼️ **Screenshot — `05-evals-index.png`**
+> *What to capture:* The Evaluations index (families with categories, benchmark and result counts).
+
+> 🖼️ **Screenshot — `08-evals-family-expanded.png`**
+> *What to capture:* A single benchmark family page (e.g. `/evals?family=artificial-analysis`).
+
+This lets you write "according to [organization], reported in [source]" rather than "the company says."
+
+---
+
+## Citing it correctly
+
+- **Cite the snapshot.** Every page is dated; the corpus is versioned and not retroactively edited. Write: *"per Evaluation Cards, snapshot [date]."*
+- **Use the stable identifier.** Each model has an ID like `ec/models/anthropic/claude-opus-4.7`. Link the card directly.
+- **Attribute the evaluator,** not just the model: *"a third-party result reported by [org]"* vs *"the developer's own reported result."*
+- **Quote the number with its context** — the slice/metric and whether it's directly comparable.
+
+---
+
+## Overclaiming traps to avoid
+
+| Trap | Better framing |
+|---|---|
+| "Model X is the best/safest." | "Model X reports the highest *self-reported* score on [benchmark]; there are no independent results for this in the corpus." |
+| Reporting a blank as a failure. | A blank means *not reported*, not zero. Say "no evaluation was reported." |
+| "Model A beats Model B." | Check Comparability first — different setups can make the comparison invalid. |
+| Citing a launch blog as the source. | Cite the attributed evaluation + reporting organization + snapshot date. |
+| Treating one snapshot as permanent. | Numbers change; date your claim. |
+
+---
+
+## A note on independence
+
+The most defensible AI-performance reporting distinguishes the developer's own numbers from independent ones. The **§3 "Who reports what"** view makes that distinction in one glance — and a category that is *entirely first-party* is exactly where a careful reporter adds "self-reported, not independently verified."
+
+➡️ Related: [Policymakers](policymakers.md) (governance framing) · [General public](general-public.md) (plain-language explainer).

content/tutorials/model-developers.md

@@ -0,0 +1,127 @@
+# Evaluation Cards for Model Developers
+
+*How your model appears in the corpus, how to read what's documented vs. missing, and how to make your evaluation reporting stronger.*
+
+> **Prerequisite:** the [Quickstart](quickstart.md) (~10 min) covers the four signals, the five-level hierarchy, and the snapshot model.
+
+---
+
+## Why you should care how your model is carded
+
+Whatever you publish about your model's evaluations, Evaluation Cards re-presents it as a structured record alongside everyone else's — and, crucially, shows **what you did not disclose**. The project treats a published score as a **claim** and an undisclosed detail as **a claim deliberately not made** (not an error). That means your card is, in effect, a public read on how *legible* and *verifiable* your reporting is.
+
+A high benchmark number with weak signals reads as a weak claim. The good news: most of the gaps are cheap to close, and this guide is organized as a checklist for doing exactly that.
+
+> 🖼️ **Screenshot — `01-home-overview.png`**
+> *What to capture:* The homepage with the corpus snapshot and the four signals.
+
+---
+
+## Step 1 — Find your model (and your org)
+
+- **Models view** (`/models`): search for your model, filter by parameter range, and open its card.
+
+  > 🖼️ **Screenshot — `09-models-index.png`**
+  > *What to capture:* The Models index list.
+
+- **Developers view**: toggle **Models → Developers** on the same page to see your organization's footprint across all its models.
+
+  > 🖼️ **Screenshot — `22-developers-view.png`**
+  > *What to capture:* The `/models` page with the **Developers** toggle active.
+
+---
+
+## Step 2 — Read your card honestly
+
+Open your model's card in **Summary View**, then switch to **Researcher View** to see the per-result detail others will scrutinize.
+
+> 🖼️ **Screenshot — `13-card-summary-full.png`**
+> *What to capture:* A full model card in Summary View.
+
+> 🖼️ **Screenshot — `19-card-researcher-full.png`**
+> *What to capture:* The same card after clicking **Researcher View**.
+
+Three things to look at first:
+
+1. **The `DOCUMENTED` badge** (e.g. "36% — 14 / 39 reported"). This is the headline read on your reporting hygiene: how much of your reported record is fully specified. Treat a low number as a backlog, not a verdict.
+
+   > 🖼️ **Screenshot — `14-card-summary-top.png`**
+   > *What to capture:* The card header with the DOCUMENTED badge.
+
+2. **§1 Identification** — confirm the basics are right: model name, developer, release date, modalities, system ID. Errors here propagate everywhere.
+
+   > 🖼️ **Screenshot — `15-card-identification.png`**
+   > *What to capture:* The §1 Identification block.
+
+3. **§2 Benchmark coverage** — what categories are present, and where the **slice spread** is. Gaps here are visible to everyone reading your card.
+
+   > 🖼️ **Screenshot — `16-card-coverage.png`**
+   > *What to capture:* The §2 Benchmark coverage section.
+
+---
+
+## Step 3 — Work the four signals as a reporting checklist
+
+Each signal maps to concrete, mostly low-cost actions.
+
+### 🔁 Reproducibility — *make it re-runnable*
+Disclose, per result: **setup variants, prompts, decoding parameters, harness name + version, random seeds, and code/artifacts**. Corpus-wide only ~3% of scores have complete setup documentation — so even modest disclosure stands out.
+
+- ✅ Publish the exact harness + version (e.g. the eval framework and commit).
+- ✅ State decoding settings (temperature, top-p, max tokens) and seeds.
+- ✅ Link runnable code or a config, not just a number.
+
+### 📋 Completeness — *cover the categories that matter*
+Completeness is judged relative to expectations for your model class. A strong **capability** record that is silent on **safety**, **robustness**, or **fairness** reads as incomplete.
+
+- ✅ Report beyond the flattering capability benchmarks.
+- ✅ If a category is intentionally out of scope, the absence will still show — consider documenting why.
+
+### 👤 Provenance & Risk — *invite independent evaluation*
+Your card splits results into **first-party** (your own) vs **third-party** (independent), and maps results to **IBM Risk Atlas** risk domains. A category that is **entirely first-party** is a visible blind spot: impressive, but uncorroborated.
+
+> 🖼️ **Screenshot — `17-card-who-reports.png`**
+> *What to capture:* The §3 "Who reports what" first-party vs third-party breakdown.
+
+- ✅ Encourage / enable third-party evaluation, especially for safety-relevant claims.
+- ✅ Don't expect self-reported numbers alone to carry weight with careful readers.
+
+### ⚖️ Comparability — *report so your scores can be compared*
+The site flags when two scores on the same benchmark used different slices, metric variants, or units — which invalidates direct comparison.
+
+> 🖼️ **Screenshot — `18-card-metrics.png`**
+> *What to capture:* The §4 Reported metrics section with benchmark charts.
+
+- ✅ Use the standard slices and metric definitions for each benchmark.
+- ✅ State units explicitly; don't silently switch metric variants.
+- ✅ Use the **Evaluations** page to see how others report the same benchmark family.
+
+  > 🖼️ **Screenshot — `08-evals-family-expanded.png`**
+  > *What to capture:* A benchmark family detail page (e.g. `/evals?family=artificial-analysis`).
+
+---
+
+## Step 4 — Corrections and snapshots
+
+The corpus follows **snapshot discipline**: no retroactive edits, only versioned corrections. Practically:
+
+- A number you published is attributed to its source document and tied to a dated snapshot — it won't be silently rewritten.
+- If something is genuinely wrong or missing, the path is a **correction in a future snapshot**, not an edit-in-place. Keep your own source documents stable and clearly dated so they can be cited cleanly.
+- Because nothing is imputed, the fastest way to improve your card is simply to **report more, and report it precisely** — the corpus will reflect it on the next snapshot.
+
+---
+
+## A pre-launch checklist
+
+Before your next model announcement, check that each headline benchmark claim ships with:
+
+- [ ] Harness name + version, and a link to runnable code/config
+- [ ] Decoding settings and seeds
+- [ ] The exact slice and metric (with units), matching how the benchmark is normally reported
+- [ ] Coverage beyond capability — at least some safety / robustness / fairness results
+- [ ] At least one path to independent (third-party) evaluation for key claims
+- [ ] A stable, dated source document for every number
+
+Closing these is what moves your `DOCUMENTED` percentage — and turns marketing numbers into claims that hold up.
+
+➡️ Related: [Evaluation researchers](evaluation-researchers.md) (how researchers will scrutinize your card) · [Journalists](journalists.md) (how reporters will source your claims) · [Quickstart](quickstart.md).

content/tutorials/policymakers.md

@@ -0,0 +1,101 @@
+# Evaluation Cards for Policymakers
+
+*How to read AI evaluation evidence for governance decisions — what it supports, and what it does not.*
+
+> **Prerequisite:** the [Quickstart](quickstart.md) explains the four signals and the snapshot model in ~10 minutes.
+
+---
+
+## The one idea to take away
+
+When a company says "our model scored X% on a safety benchmark," that is a **claim**, not an audited fact. Evaluation Cards exists to show you the *quality of the evidence* behind such claims: who produced it, whether it can be reproduced, and whether it can be fairly compared to anyone else's number.
+
+For policy, the headline score is rarely the decision-relevant variable. **The documentation and independence behind the score are.**
+
+> 🖼️ **Screenshot — `01-home-overview.png`**
+> *What to capture:* The homepage with the corpus snapshot and the four signals.
+
+---
+
+## What the corpus does and does not tell you
+
+**It does:**
+- Aggregate how thousands of models have been evaluated, across many independent reporting organizations.
+- Make explicit *what was not disclosed* — treating undocumented setups as a measurable gap, not an oversight.
+- Distinguish a developer's own results from independent third-party evaluations.
+
+**It does not:**
+- Certify that any model is "safe," "compliant," or "best." There is no ranking or seal of approval.
+- Fill in missing data. A blank means "not reported," never an estimate.
+- Replace an audit. It tells you how *auditable* a claim currently is.
+
+---
+
+## Reading the four signals as a governance lens
+
+> 🖼️ **Screenshot — `04-about-full.png`**
+> *What to capture:* The About / methodology page describing the four signals.
+
+| Signal | Governance question | Why it matters for policy |
+|---|---|---|
+| **Reproducibility** | Could an independent party verify this claim? | A score that cannot be reproduced cannot be relied on for oversight. Corpus-wide, only ~3% of scores have complete setup documentation. |
+| **Completeness** | Were the relevant risk areas evaluated at all? | A strong capability record can be silent on safety, robustness, or fairness. Absence of a result is not evidence of safety. |
+| **Provenance & Risk** | Who ran the evaluation, and what real-world risk does it speak to? | Self-reported results lack independent corroboration. Results map to **IBM Risk Atlas** risk domains, connecting scores to recognized risk categories. |
+| **Comparability** | Can these two models actually be compared on this benchmark? | "Model A beats Model B" is often invalid if they used different setups. The site flags when a comparison is not legitimate. |
+
+---
+
+## First-party vs third-party: the independence check
+
+The single most useful view for governance is **§3 "Who reports what"** on any model card. It splits a model's results into:
+
+- **First-party** — produced by the model's own developer.
+- **Third-party** — produced independently.
+
+> 🖼️ **Screenshot — `17-card-who-reports.png`**
+> *What to capture:* The §3 "Who reports what" first-party vs third-party breakdown on a model card.
+
+In the captured example, a flagship model's record was **31% first-party / 69% third-party**, and some categories were *entirely* third-party or entirely first-party. A category with **no independent evaluations** is a place where policy should not lean on the numbers without seeking corroboration.
+
+---
+
+## A short workflow for a policy question
+
+Suppose you need to assess the evidence base for a specific model.
+
+1. **Open its card.** Models → search the model.
+   > 🖼️ **Screenshot — `09-models-index.png`**
+   > *What to capture:* The Models index list.
+
+2. **Read the `DOCUMENTED` badge** (e.g. "36% — 14 / 39 reported"). This is, at a glance, how much of the record is fully documented. Treat a low number as "claims that are hard to verify."
+
+   > 🖼️ **Screenshot — `14-card-summary-top.png`**
+   > *What to capture:* The top of a model card showing the DOCUMENTED badge and the summary paragraph.
+
+3. **Check §3 (Who reports what)** for independence, by category.
+
+4. **Check §2 (Benchmark coverage)** for *what risk areas were evaluated at all.*
+   > 🖼️ **Screenshot — `16-card-coverage.png`**
+   > *What to capture:* The §2 Benchmark coverage section.
+
+5. **Note the snapshot date.** The corpus is versioned; cite the date.
+
+---
+
+## What you can responsibly say
+
+✅ *"As of the [snapshot date] corpus, X% of this model's reported results are fully documented, and Y% come from independent evaluators."*
+
+✅ *"There are no reported [safety / robustness / fairness] evaluations for this model in the corpus."* (Absence is itself a finding.)
+
+❌ *"This model is the safest"* / *"This model ranks #1."* The corpus does not certify or rank.
+
+❌ Treating a missing value as a low score, or a high score with weak signals as a strong claim.
+
+---
+
+## Why the framing matters
+
+Evaluation Cards deliberately treats an undisclosed detail as **a claim intentionally not made** — not an error. For policy this is the useful posture: it shifts the question from *"what's the number?"* to *"how much can we trust and verify this number, and who stands behind it?"* — which is the question governance actually needs answered.
+
+➡️ Related: [Journalists](journalists.md) (sourcing claims responsibly) · [Evaluation researchers](evaluation-researchers.md) (deeper methodology).

content/tutorials/quickstart.md

@@ -0,0 +1,99 @@
+# Evaluation Cards — Quickstart
+
+*A stakeholder-agnostic guide to getting started. ~10 minutes.*
+
+> 🖼️ **Screenshot — `01-home-overview.png`**
+> *What to capture:* The full homepage at <https://evalcards.evalevalai.com> showing the headline, the **Corpus snapshot**, and the four interpretive signals.
+
+---
+
+## What Evaluation Cards is
+
+**Evaluation Cards** is a reporting layer over AI model evaluations, built by the [EvalEval Coalition](https://evalcards.evalevalai.com/about). It collects how AI models are evaluated across many benchmarks and reporting organizations, and — just as importantly — shows **what was left undocumented**.
+
+A benchmark score on its own ("Model X scores 87% on MMLU") tells you very little. Evaluation Cards puts each score in context: *who* ran the evaluation, *how* it was set up, *whether* it can be reproduced, and *whether* it can be fairly compared to another score. The project treats every published evaluation as a **claim**, and every undisclosed detail as **a claim deliberately not made** — neither is treated as an error.
+
+At a glance (snapshot of June 2026), the corpus tracks:
+
+| | |
+|---|---|
+| **5,816** models | **101,955** reported results |
+| **31** reporting organizations | **820** model developers |
+| **57** benchmark families | **638** single benchmarks |
+
+> The corpus is **versioned by snapshot**. Every page shows a snapshot date. Numbers above will drift as the corpus grows — always cite the snapshot you saw.
+
+---
+
+## The four interpretive signals
+
+Every record is assessed against four signals. These are the heart of the site — learn to read them and the rest follows.
+
+> 🖼️ **Screenshot — `03-home-signals.png`**
+> *What to capture:* The "Interpretive signals" section on the homepage (the four cards: Reproducibility, Completeness, Provenance, Comparability).
+
+| Signal | Question it answers | What a low score means |
+|---|---|---|
+| **R — Reproducibility** | Could a third party re-run this evaluation? | Prompts, decoding settings, harness version, seeds, or code are undisclosed. |
+| **C — Completeness** | Does the record meet normal reporting expectations for this kind of model? | Whole categories (e.g. safety, robustness, fairness) may be missing. |
+| **P — Provenance & Risk** | Who ran it, and what real-world property does it measure? | Distinguishes **first-party** (the developer) from **third-party** (independent) evaluators. |
+| **X — Comparability** | Can two scores on the same benchmark be put side by side? | Different slices, metric variants, or units make a direct ranking invalid. |
+
+A high benchmark score with weak signals is still a weak claim. The signals are how you tell a well-documented result from a number with no paper trail.
+
+---
+
+## The five-level hierarchy
+
+Scores resolve through an explicit pathway, so any headline number can be drilled down to the evidence behind it:
+
+```
+Family  →  Composite  →  Single Benchmark  →  Slice  →  Metric
+```
+
+For example: *MMLU (family) → MMLU-Pro (composite) → a single subject → a language/subset slice → accuracy (metric)*. When you see an aggregate claim, you can always click down to the specific metric supporting it.
+
+---
+
+## Getting around: the four pages
+
+> 🖼️ **Screenshot — `02-home-hero.png`**
+> *What to capture:* The top navigation bar (Overview · Models · Evaluations · About).
+
+1. **Overview** (`/`) — the corpus snapshot, the signals explained, and featured benchmark families. Start here.
+2. **Models** (`/models`) — every indexed model. Filter by parameter size, switch between **Models** and **Developers** views, and select up to four models to compare.
+3. **Evaluations** (`/evals`) — benchmarks grouped into **families**, filterable by interaction style (agent / non-agent) and ~17 categories (Mathematics, Safety, Software Engineering, …).
+4. **About** (`/about`) — the methodology: how the signals are computed and the principles behind the corpus.
+
+---
+
+## Your first 5 minutes
+
+1. **Open a model card.** Go to **Models**, click any model (e.g. *Claude Opus 4.7*). This is an *Evaluation Card*.
+
+   > 🖼️ **Screenshot — `13-card-summary-full.png`**
+   > *What to capture:* A full model Evaluation Card in **Summary View** (e.g. `/models/anthropic/claude-opus-4.7`).
+
+2. **Read the `DOCUMENTED` badge.** Near the top, a percentage (e.g. "36% — 14 / 39 reported") tells you how much of this model's reported record is fully documented. Low is common; that's the point.
+
+3. **Check "Who reports what" (§3).** A donut and per-category bars split results into **first-party** (the developer's own numbers) vs **third-party** (independent). This is your fastest read on how independent the evidence is.
+
+   > 🖼️ **Screenshot — `17-card-who-reports.png`**
+   > *What to capture:* The §3 "Who reports what" section of a model card (first-party vs third-party breakdown).
+
+4. **Toggle Summary View → Researcher View.** The top-right toggle exposes the underlying per-result detail. Summary is for orientation; Researcher is for digging in.
+
+   > 🖼️ **Screenshot — `19-card-researcher-full.png`**
+   > *What to capture:* The same model card after clicking **Researcher View**.
+
+5. **Note the snapshot date** before you cite anything.
+
+---
+
+## Three things to remember
+
+- **A score is a claim, not a fact.** Read the signals before trusting the number.
+- **First-party ≠ third-party.** Always check who produced a result.
+- **Cite the snapshot.** The corpus is versioned; numbers change.
+
+➡️ **Next:** pick the guide for your role — [Evaluation researchers](evaluation-researchers.md) · [Policymakers](policymakers.md) · [General public](general-public.md) · [Journalists](journalists.md).

lib/tutorials.ts

@@ -0,0 +1,183 @@
+import "server-only"
+
+import fs from "node:fs"
+import path from "node:path"
+
+const TUTORIALS_DIR = path.join(process.cwd(), "content", "tutorials")
+const SCREENSHOTS_DIR = path.join(process.cwd(), "public", "tutorials", "screenshots")
+
+export type TutorialCategory = "guide" | "doc"
+
+export interface TutorialMeta {
+  slug: string
+  title: string
+  category: TutorialCategory
+  /** Short "who it's for" (guides) or topic (docs) line. */
+  audience: string
+  /** One-sentence description of the focus. */
+  blurb: string
+}
+
+/**
+ * Ordered guide catalogue. Quickstart is stakeholder-agnostic and listed
+ * first; the rest are the per-stakeholder guides. Copy mirrors the table in
+ * the source tutorials README so the hub reads consistently with the guides.
+ */
+export const TUTORIALS: TutorialMeta[] = [
+  {
+    slug: "quickstart",
+    title: "Quickstart",
+    category: "guide",
+    audience: "Stakeholder-agnostic · ~10 min",
+    blurb:
+      "The four signals, the five-level hierarchy, and your first five minutes on the site.",
+  },
+  {
+    slug: "evaluation-researchers",
+    title: "Evaluation researchers",
+    category: "guide",
+    audience: "Researchers auditing or comparing evaluations",
+    blurb:
+      "Researcher View, a per-section card walkthrough, rigorous signal reading, and comparability caveats.",
+  },
+  {
+    slug: "policymakers",
+    title: "Policymakers",
+    category: "guide",
+    audience: "Governance & policy",
+    blurb:
+      "What the evidence supports versus what it doesn't, independence checks, and responsible claims.",
+  },
+  {
+    slug: "model-developers",
+    title: "Model developers",
+    category: "guide",
+    audience: "Teams publishing models",
+    blurb:
+      "How your model is carded, what's documented versus missing, and a checklist to raise your signals.",
+  },
+  {
+    slug: "general-public",
+    title: "General public",
+    category: "guide",
+    audience: "Everyone",
+    blurb: "Plain-language: what a benchmark score means and how to read a card.",
+  },
+  {
+    slug: "journalists",
+    title: "Journalists",
+    category: "guide",
+    audience: "Reporters",
+    blurb: "The three-minute fact-check, sourcing, citation, and overclaiming traps.",
+  },
+]
+
+/**
+ * Technical documentation — deeper than the stakeholder guides. Rendered from
+ * the same markdown pipeline and routed under /help/<slug>.
+ */
+export const DOCS: TutorialMeta[] = [
+  {
+    slug: "how-signals-are-computed",
+    title: "How the four signals are computed",
+    category: "doc",
+    audience: "Signal definitions",
+    blurb:
+      "The exact computation behind reproducibility, completeness, provenance, and comparability — fields, formulas, and corpus aggregation.",
+  },
+  {
+    slug: "cross-post-to-hugging-face",
+    title: "Cross-post EEE results to Hugging Face",
+    category: "doc",
+    audience: "Contributing evaluation data",
+    blurb:
+      "Send your Every Eval Ever results to Hugging Face Community Evals — the YAML schema, the converter, and the backlink to the full EEE record.",
+  },
+  {
+    slug: "get-verified",
+    title: "Get a verified checkmark",
+    category: "doc",
+    audience: "Verification",
+    blurb:
+      "Submit your data through your organisation's Hugging Face account to have your results show up verified — our call for apples-to-apples comparison.",
+  },
+]
+
+const ALL_ENTRIES = [...TUTORIALS, ...DOCS]
+
+export function getTutorialSlugs(): string[] {
+  return ALL_ENTRIES.map((t) => t.slug)
+}
+
+export function getTutorialMeta(slug: string): TutorialMeta | undefined {
+  return ALL_ENTRIES.find((t) => t.slug === slug)
+}
+
+function listExistingScreenshots(): Set<string> {
+  try {
+    return new Set(fs.readdirSync(SCREENSHOTS_DIR))
+  } catch {
+    return new Set()
+  }
+}
+
+/**
+ * Reads a tutorial markdown file and returns it ready for rendering:
+ * screenshot placeholder blocks are converted into image references. Where a
+ * matching PNG exists in public/tutorials/screenshots it becomes a real image;
+ * otherwise it becomes a `placeholder:<file>` reference the renderer styles as
+ * a "screenshot coming" callout. Returns null if the slug has no file.
+ */
+export function readTutorial(slug: string): string | null {
+  if (!getTutorialMeta(slug)) return null
+  const filePath = path.join(TUTORIALS_DIR, `${slug}.md`)
+  let raw: string
+  try {
+    raw = fs.readFileSync(filePath, "utf8")
+  } catch {
+    return null
+  }
+  return transformScreenshotBlocks(raw, listExistingScreenshots())
+}
+
+/**
+ * Rewrites the `> 🖼️ **Screenshot — \`file.png\`** / *What to capture:* …`
+ * blockquotes into markdown images. Real screenshots resolve to a public path;
+ * missing ones become `placeholder:` images so the renderer can style them.
+ */
+function transformScreenshotBlocks(raw: string, existing: Set<string>): string {
+  const lines = raw.split("\n")
+  const out: string[] = []
+
+  for (let i = 0; i < lines.length; i++) {
+    if (!/^>\s*🖼️/.test(lines[i])) {
+      out.push(lines[i])
+      continue
+    }
+
+    // Collect the contiguous blockquote that starts with the screenshot marker.
+    const block: string[] = []
+    while (i < lines.length && /^>/.test(lines[i])) {
+      block.push(lines[i])
+      i++
+    }
+    i-- // the outer loop will advance past the last consumed line
+
+    const inner = block.map((l) => l.replace(/^>\s?/, "")).join("\n")
+    const file = inner.match(/`([^`]+\.png)`/)?.[1]
+    if (!file) continue // malformed marker — drop it rather than render noise
+
+    const rawCaption = inner.match(/\*What to capture:\*\s*([\s\S]+)$/)?.[1] ?? ""
+    const caption = rawCaption
+      .replace(/[*`<>]/g, "") // strip markdown emphasis / autolink / code markers
+      .replace(/\s+/g, " ")
+      .replace(/[[\]()]/g, "") // keep markdown image alt syntax intact
+      .trim()
+    const alt = caption || `Screenshot: ${file}`
+    const src = existing.has(file) ? `/tutorials/screenshots/${file}` : `placeholder:${file}`
+
+    out.push("", `![${alt}](${src})`, "")
+  }
+
+  return out.join("\n")
+}

package.json

@@ -56,6 +56,7 @@
     "embla-carousel-react": "8.5.1",
     "geist": "^1.3.1",
     "input-otp": "1.4.1",
+    "katex": "^0.17.0",
     "lucide-react": "^0.454.0",
     "next": "15.2.8",
     "next-themes": "latest",
@@ -64,8 +65,12 @@
     "react-dom": "^19",
     "react-hook-form": "^7.60.0",
     "react-is": "^19.1.1",
+    "react-markdown": "^10.1.0",
     "react-resizable-panels": "^2.1.7",
     "recharts": "latest",
+    "rehype-katex": "^7.0.1",
+    "remark-gfm": "^4.0.1",
+    "remark-math": "^6.0.0",
     "server-only": "^0.0.1",
     "sonner": "^1.7.4",
     "tailwind-merge": "^2.5.5",

pnpm-lock.yaml

@@ -119,6 +119,9 @@ importers:
       input-otp:
         specifier: 1.4.1
         version: 1.4.1(react-dom@19.1.1(react@19.1.1))(react@19.1.1)
+      katex:
+        specifier: ^0.17.0
+        version: 0.17.0
       lucide-react:
         specifier: ^0.454.0
         version: 0.454.0(react@19.1.1)
@@ -143,12 +146,24 @@ importers:
       react-is:
         specifier: ^19.1.1
         version: 19.1.1
+      react-markdown:
+        specifier: ^10.1.0
+        version: 10.1.0(@types/react@19.1.10)(react@19.1.1)
       react-resizable-panels:
         specifier: ^2.1.7
         version: 2.1.9(react-dom@19.1.1(react@19.1.1))(react@19.1.1)
       recharts:
         specifier: latest
         version: 3.8.1(@types/react@19.1.10)(react-dom@19.1.1(react@19.1.1))(react-is@19.1.1)(react@19.1.1)(redux@5.0.1)
+      rehype-katex:
+        specifier: ^7.0.1
+        version: 7.0.1
+      remark-gfm:
+        specifier: ^4.0.1
+        version: 4.0.1
+      remark-math:
+        specifier: ^6.0.0
+        version: 6.0.0
       server-only:
         specifier: ^0.0.1
         version: 0.0.1
@@ -1670,9 +1685,27 @@ packages:
   '@types/d3-timer@3.0.2':
     resolution: {integrity: sha512-Ps3T8E8dZDam6fUyNiMkekK3XUsaUEik+idO9/YjPtfj2qruF8tFBXS7XhtE4iIXBLxhmLjP3SXpLhVf21I9Lw==}
 
+  '@types/debug@4.1.13':
+    resolution: {integrity: sha512-KSVgmQmzMwPlmtljOomayoR89W4FynCAi3E8PPs7vmDVPe84hT+vGPKkJfThkmXs0x0jAaa9U8uW8bbfyS2fWw==}
+
+  '@types/estree-jsx@1.0.5':
+    resolution: {integrity: sha512-52CcUVNFyfb1A2ALocQw/Dd1BQFNmSdkuC3BkZ6iqhdMfQz7JWOFRuJFloOzjk+6WijU56m9oKXFAXc7o3Towg==}
+
   '@types/estree@1.0.8':
     resolution: {integrity: sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==}
 
+  '@types/hast@3.0.4':
+    resolution: {integrity: sha512-WPs+bbQw5aCj+x6laNGWLH3wviHtoCv/P3+otBhbOhJgG8qtpdAMlTCxLtsTWA7LH1Oh/bFCHsBn0TPS5m30EQ==}
+
+  '@types/katex@0.16.8':
+    resolution: {integrity: sha512-trgaNyfU+Xh2Tc+ABIb44a5AYUpicB3uwirOioeOkNPPbmgRNtcWyDeeFRzjPZENO9Vq8gvVqfhaaXWLlevVwg==}
+
+  '@types/mdast@4.0.4':
+    resolution: {integrity: sha512-kGaNbPh1k7AFzgpud/gMdvIm5xuECykRR+JnWKQno9TAXVa6WIVCGTPvYGekIDL4uwCZQSYbUxNBSb1aUo79oA==}
+
+  '@types/ms@2.1.0':
+    resolution: {integrity: sha512-GsCCIZDE/p3i96vtEqx+7dBUGXrc7zeSK3wwPHIaRThS+9OhWIXRqzs4d6k1SVU8g91DrNRWxWUGhp5KXQb2VA==}
+
   '@types/node@22.17.2':
     resolution: {integrity: sha512-gL6z5N9Jm9mhY+U2KXZpteb+09zyffliRkZyZOHODGATyC5B1Jt/7TzuuiLkFsSUMLbS1OLmlj/E+/3KF4Q/4w==}
 
@@ -1684,12 +1717,21 @@ packages:
   '@types/react@19.1.10':
     resolution: {integrity: sha512-EhBeSYX0Y6ye8pNebpKrwFJq7BoQ8J5SO6NlvNwwHjSj6adXJViPQrKlsyPw7hLBLvckEMO1yxeGdR82YBBlDg==}
 
+  '@types/unist@2.0.11':
+    resolution: {integrity: sha512-CmBKiL6NNo/OqgmMn95Fk9Whlp2mtvIv+KNpQKN2F4SjvrEesubTRWGYSg+BnWZOnlCaSTU1sMpsBOzgbYhnsA==}
+
+  '@types/unist@3.0.3':
+    resolution: {integrity: sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==}
+
   '@types/use-sync-external-store@0.0.6':
     resolution: {integrity: sha512-zFDAD+tlpf2r4asuHEj0XH6pY6i0g5NeAHPn+15wk3BV6JA69eERFXC1gyGThDkVa1zCyKr5jox1+2LbV/AMLg==}
 
   '@types/yauzl@2.10.3':
     resolution: {integrity: sha512-oJoftv0LSuaDZE3Le4DbKX+KS9G36NzOeSap90UIK0yMA/NhKJhqlSGtNDORNRaIbQfzjXDrQa0ytJ6mNRGz/Q==}
 
+  '@ungap/structured-clone@1.3.1':
+    resolution: {integrity: sha512-mUFwbeTqrVgDQxFveS+df2yfap6iuP20NAKAsBt5jDEoOTDew+zwLAOilHCeQJOVSvmgCX4ogqIrA0mnyr08yQ==}
+
   '@vitest/expect@1.6.1':
     resolution: {integrity: sha512-jXL+9+ZNIJKruofqXuuTClf44eSpcHlgj3CiuNihUF3Ioujtmc0zIa3UJOW5RjDK1YLBJZnWBlPuqhYycLioog==}
 
@@ -1756,6 +1798,9 @@ packages:
       react-native-b4a:
         optional: true
 
+  bail@2.0.2:
+    resolution: {integrity: sha512-0xO6mYd7JB2YesxDKplafRpsiOzPt9V02ddPCLbY1xYGPOX24NTyN50qnUxgCPcSoYMhKpAuBTjQoRZCAkUDRw==}
+
   bare-events@2.8.2:
     resolution: {integrity: sha512-riJjyv1/mHLIPX4RwiK+oW9/4c3TEUeORHKefKAKnZ5kyslbN+HXowtbaVEqt4IMUB7OXlfixcs6gsFeo/jhiQ==}
     peerDependencies:
@@ -1820,10 +1865,25 @@ packages:
   caniuse-lite@1.0.30001735:
     resolution: {integrity: sha512-EV/laoX7Wq2J9TQlyIXRxTJqIw4sxfXS4OYgudGxBYRuTv0q7AM6yMEpU/Vo1I94thg9U6EZ2NfZx9GJq83u7w==}
 
+  ccount@2.0.1:
+    resolution: {integrity: sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg==}
+
   chai@4.5.0:
     resolution: {integrity: sha512-RITGBfijLkBddZvnn8jdqoTypxvqbOLYQkGGxXzeFjVHvudaPw0HNFD9x928/eUwYWd2dPCugVqspGALTZZQKw==}
     engines: {node: '>=4'}
 
+  character-entities-html4@2.1.0:
+    resolution: {integrity: sha512-1v7fgQRj6hnSwFpq1Eu0ynr/CDEw0rXo2B61qXrLNdHZmPKgb7fqS1a2JwF0rISo9q77jDI8VMEHoApn8qDoZA==}
+
+  character-entities-legacy@3.0.0:
+    resolution: {integrity: sha512-RpPp0asT/6ufRm//AJVwpViZbGM/MkjQFxJccQRHmISF/22NBtsHqAWmL+/pmkPWoIUJdWyeVleTl1wydHATVQ==}
+
+  character-entities@2.0.2:
+    resolution: {integrity: sha512-shx7oQ0Awen/BRIdkjkvz54PnEEI/EjwXDSIZp86/KKdbafHh1Df/RYGBhn4hbe2+uKC9FnT5UCEdyPz3ai9hQ==}
+
+  character-reference-invalid@2.0.1:
+    resolution: {integrity: sha512-iBZ4F4wRbyORVsu0jPV7gXkOsGYjGHPmAyv+HiHG8gi5PtC9KI2j1+v8/tlibRvjoWX027ypmG/n0HtO5t7unw==}
+
   check-error@1.0.3:
     resolution: {integrity: sha512-iKEoDYaRmd1mxM90a2OEfWhjsjPpYPuQ+lMYsoxB126+t8fw7ySEO48nmDg5COTjxDI65/Y2OWpeEHk3ZOe8zg==}
 
@@ -1870,6 +1930,13 @@ packages:
     resolution: {integrity: sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==}
     engines: {node: '>=12.5.0'}
 
+  comma-separated-tokens@2.0.3:
+    resolution: {integrity: sha512-Fu4hJdvzeylCfQPp9SGWidpzrMs7tTrlu6Vb8XGaRGck8QSNZJJp538Wrb60Lax4fPwR64ViY468OIUTbRlGZg==}
+
+  commander@8.3.0:
+    resolution: {integrity: sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==}
+    engines: {node: '>= 12'}
+
   confbox@0.1.8:
     resolution: {integrity: sha512-RMtmw0iFkeR4YV+fUOSucriAQNb9g8zFR52MWCtl+cCZOFRNL6zeB395vPzFhEjjn4fMxXudmELnl/KF/WrK6w==}
 
@@ -1955,6 +2022,9 @@ packages:
   decimal.js-light@2.5.1:
     resolution: {integrity: sha512-qIMFpTMZmny+MMIitAB6D7iVPEorVw6YQRWkvarTkT4tBeSLLiHzcwj6q0MmYSFCiVpiqPJTJEYIrpcPzVEIvg==}
 
+  decode-named-character-reference@1.3.0:
+    resolution: {integrity: sha512-GtpQYB283KrPp6nRw50q3U9/VfOutZOe103qlN7BPP6Ad27xYnOIWv4lPzo8HCAL+mMZofJ9KEy30fq6MfaK6Q==}
+
   deep-eql@4.1.4:
     resolution: {integrity: sha512-SUwdGfqdKOwxCPeVYjwSyRpJ7Z+fhpwIAtmCUdZIWZ/YP5R9WAsyuSgpLVDi9bjWoN2LXHNss/dk3urXtdQxGg==}
     engines: {node: '>=6'}
@@ -1963,6 +2033,10 @@ packages:
     resolution: {integrity: sha512-TllpMR/t0M5sqCXfj85i4XaAzxmS5tVA16dqvdkMwGmzI+dXLXnw3J+3Vdv7VKw+ThlTMboK6i9rnZ6Nntj5CQ==}
     engines: {node: '>= 14'}
 
+  dequal@2.0.3:
+    resolution: {integrity: sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==}
+    engines: {node: '>=6'}
+
   detect-libc@2.0.4:
     resolution: {integrity: sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==}
     engines: {node: '>=8'}
@@ -1974,6 +2048,9 @@ packages:
   detect-node-es@1.1.0:
     resolution: {integrity: sha512-ypdmJU/TbBby2Dxibuv7ZLW3Bs1QEmM7nHjEANfohJLvE0XVujisn1qPJcZxg+qDucsr+bP6fLD1rPS3AhJ7EQ==}
 
+  devlop@1.1.0:
+    resolution: {integrity: sha512-RWmIqhcFf1lRYBvNmr7qTNuyCt/7/ns2jbpp1+PalgE/rDQcBT0fioSMUpJ93irlUhC5hrg4cYqe6U+0ImW0rA==}
+
   devtools-protocol@0.0.1595872:
     resolution: {integrity: sha512-kRfgp8vWVjBu/fbYCiVFiOqsCk3CrMKEo3WbgGT2NXK2dG7vawWPBljixajVgGK9II8rDO9G0oD0zLt3I1daRg==}
 
@@ -2007,6 +2084,10 @@ packages:
     resolution: {integrity: sha512-d4lC8xfavMeBjzGr2vECC3fsGXziXZQyJxD868h2M/mBI3PwAuODxAkLkq5HYuvrPYcUtiLzsTo8U3PgX3Ocww==}
     engines: {node: '>=10.13.0'}
 
+  entities@6.0.1:
+    resolution: {integrity: sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g==}
+    engines: {node: '>=0.12'}
+
   es-toolkit@1.39.9:
     resolution: {integrity: sha512-9OtbkZmTA2Qc9groyA1PUNeb6knVTkvB2RSdr/LcJXDL8IdEakaxwXLHXa7VX/Wj0GmdMJPR3WhnPGhiP3E+qg==}
 
@@ -2024,6 +2105,10 @@ packages:
     resolution: {integrity: sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==}
     engines: {node: '>=6'}
 
+  escape-string-regexp@5.0.0:
+    resolution: {integrity: sha512-/veY75JbMK4j1yjvuUxuVsiS/hr/4iHs9FTT6cgTexxdE0Ly/glccBAkloH/DofkjRbZU3bnoj38mOmhkZ0lHw==}
+    engines: {node: '>=12'}
+
   escodegen@2.1.0:
     resolution: {integrity: sha512-2NlIDTwUWJN0mRPQOdtQBzbUHvdGY2P1VXSyU83Q3xKxM7WHX2Ql8dKq782Q9TgQUNOLEzEYu9bzLNj1q88I5w==}
     engines: {node: '>=6.0'}
@@ -2038,6 +2123,9 @@ packages:
     resolution: {integrity: sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==}
     engines: {node: '>=4.0'}
 
+  estree-util-is-identifier-name@3.0.0:
+    resolution: {integrity: sha512-hFtqIDZTIUZ9BXLb8y4pYGyk6+wekIivNVTcmvk8NoOh+VeRn5y6cEHzbURrWbfp1fIqdVipilzj+lfaadNZmg==}
+
   estree-walker@3.0.3:
     resolution: {integrity: sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==}
 
@@ -2055,6 +2143,9 @@ packages:
     resolution: {integrity: sha512-VyhnebXciFV2DESc+p6B+y0LjSm0krU4OgJN44qFAhBY0TJ+1V61tYD2+wHusZ6F9n5K+vl8k0sTy7PEfV4qpg==}
     engines: {node: '>=16.17'}
 
+  extend@3.0.2:
+    resolution: {integrity: sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==}
+
   extract-zip@2.0.1:
     resolution: {integrity: sha512-GDhU9ntwuKyGXdZBUgTIe+vXnWj0fppUEtMDL0+idd5Sta8TGpHssn/eusA9mrPr9qNDym6SxAYZjNvCn/9RBg==}
     engines: {node: '>= 10.17.0'}
@@ -2113,6 +2204,39 @@ packages:
   graceful-fs@4.2.11:
     resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==}
 
+  hast-util-from-dom@5.0.1:
+    resolution: {integrity: sha512-N+LqofjR2zuzTjCPzyDUdSshy4Ma6li7p/c3pA78uTwzFgENbgbUrm2ugwsOdcjI1muO+o6Dgzp9p8WHtn/39Q==}
+
+  hast-util-from-html-isomorphic@2.0.0:
+    resolution: {integrity: sha512-zJfpXq44yff2hmE0XmwEOzdWin5xwH+QIhMLOScpX91e/NSGPsAzNCvLQDIEPyO2TXi+lBmU6hjLIhV8MwP2kw==}
+
+  hast-util-from-html@2.0.3:
+    resolution: {integrity: sha512-CUSRHXyKjzHov8yKsQjGOElXy/3EKpyX56ELnkHH34vDVw1N1XSQ1ZcAvTyAPtGqLTuKP/uxM+aLkSPqF/EtMw==}
+
+  hast-util-from-parse5@8.0.3:
+    resolution: {integrity: sha512-3kxEVkEKt0zvcZ3hCRYI8rqrgwtlIOFMWkbclACvjlDw8Li9S2hk/d51OI0nr/gIpdMHNepwgOKqZ/sy0Clpyg==}
+
+  hast-util-is-element@3.0.0:
+    resolution: {integrity: sha512-Val9mnv2IWpLbNPqc/pUem+a7Ipj2aHacCwgNfTiK0vJKl0LF+4Ba4+v1oPHFpf3bLYmreq0/l3Gud9S5OH42g==}
+
+  hast-util-parse-selector@4.0.0:
+    resolution: {integrity: sha512-wkQCkSYoOGCRKERFWcxMVMOcYE2K1AaNLU8DXS9arxnLOUEWbOXKXiJUNzEpqZ3JOKpnha3jkFrumEjVliDe7A==}
+
+  hast-util-to-jsx-runtime@2.3.6:
+    resolution: {integrity: sha512-zl6s8LwNyo1P9uw+XJGvZtdFF1GdAkOg8ujOw+4Pyb76874fLps4ueHXDhXWdk6YHQ6OgUtinliG7RsYvCbbBg==}
+
+  hast-util-to-text@4.0.2:
+    resolution: {integrity: sha512-KK6y/BN8lbaq654j7JgBydev7wuNMcID54lkRav1P0CaE1e47P72AWWPiGKXTJU271ooYzcvTAn/Zt0REnvc7A==}
+
+  hast-util-whitespace@3.0.0:
+    resolution: {integrity: sha512-88JUN06ipLwsnv+dVn+OIYOvAuvBMy/Qoi6O7mQHxdPXpjy+Cd6xRkWwux7DKO+4sYILtLBRIKgsdpS2gQc7qw==}
+
+  hastscript@9.0.1:
+    resolution: {integrity: sha512-g7df9rMFX/SPi34tyGCyUBREQoKkapwdY/T04Qn9TDWfHhAYt4/I0gMVirzK5wEzeUqIjEB+LXC/ypb7Aqno5w==}
+
+  html-url-attributes@3.0.1:
+    resolution: {integrity: sha512-ol6UPyBWqsrO6EJySPz2O7ZSr856WDrEzM5zMqp+FJJLGMW35cLYmmZnl0vztAZxRUoNZJFTCohfjuIJ8I4QBQ==}
+
   http-proxy-agent@7.0.2:
     resolution: {integrity: sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==}
     engines: {node: '>= 14'}
@@ -2128,6 +2252,9 @@ packages:
   immer@10.1.1:
     resolution: {integrity: sha512-s2MPrmjovJcoMaHtx6K11Ra7oD05NT97w1IC5zpMkT6Atjr7H8LjaDd81iIxUYpMKSRRNMJE703M1Fhr/TctHw==}
 
+  inline-style-parser@0.2.7:
+    resolution: {integrity: sha512-Nb2ctOyNR8DqQoR0OwRG95uNWIC0C1lCgf5Naz5H6Ji72KZ8OcFZLz2P5sNgwlyoJ8Yif11oMuYs5pBQa86csA==}
+
   input-otp@1.4.1:
     resolution: {integrity: sha512-+yvpmKYKHi9jIGngxagY9oWiiblPB7+nEO75F2l2o4vs+6vpPZZmUl4tBNYuTCvQjhvEIbdNeJu70bhfYP2nbw==}
     peerDependencies:
@@ -2142,13 +2269,29 @@ packages:
     resolution: {integrity: sha512-/+S6j4E9AHvW9SWMSEY9Xfy66O5PWvVEJ08O0y5JGyEKQpojb0K0GKpz/v5HJ/G0vi3D2sjGK78119oXZeE0qA==}
     engines: {node: '>= 12'}
 
+  is-alphabetical@2.0.1:
+    resolution: {integrity: sha512-FWyyY60MeTNyeSRpkM2Iry0G9hpr7/9kD40mD/cGQEuilcZYS4okz8SN2Q6rLCJ8gbCt6fN+rC+6tMGS99LaxQ==}
+
+  is-alphanumerical@2.0.1:
+    resolution: {integrity: sha512-hmbYhX/9MUMF5uh7tOXyK/n0ZvWpad5caBA17GsC6vyuCqaWliRG5K1qS9inmUhEMaOBIW7/whAnSwveW/LtZw==}
+
   is-arrayish@0.3.2:
     resolution: {integrity: sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==}
 
+  is-decimal@2.0.1:
+    resolution: {integrity: sha512-AAB9hiomQs5DXWcRB1rqsxGUstbRroFOPPVAomNk/3XHR5JyEZChOyTWe2oayKnsSsr/kcGqF+z6yuH6HHpN0A==}
+
   is-fullwidth-code-point@3.0.0:
     resolution: {integrity: sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==}
     engines: {node: '>=8'}
 
+  is-hexadecimal@2.0.1:
+    resolution: {integrity: sha512-DgZQp241c8oO6cA1SbTEWiXeoxV42vlcJxgH+B3hi1AiqqKruZR3ZGF8In3fj4+/y/7rHvlOZLZtgJ/4ttYGZg==}
+
+  is-plain-obj@4.1.0:
+    resolution: {integrity: sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg==}
+    engines: {node: '>=12'}
+
   is-stream@3.0.0:
     resolution: {integrity: sha512-LnQR4bZ9IADDRSkvpqMGvt/tEJWclzklNgSw48V5EAaAeDd6qGvN8ei6k5p0tvxSR171VmGyHuTiAOfxAbr8kA==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
@@ -2163,6 +2306,14 @@ packages:
   js-tokens@9.0.1:
     resolution: {integrity: sha512-mxa9E9ITFOt0ban3j6L5MpjwegGz6lBQmM1IJkWeBZGcMxto50+eWdjC/52xDbS2vy0k7vIMK0Fe2wfL9OQSpQ==}
 
+  katex@0.16.47:
+    resolution: {integrity: sha512-Eeo8Ys1doU1z+x8AZsPpQu+p/QcZBI5PeOo7QGQdy2x2m0MU/hYagBbGOmXwr5KVbEfVuWv9LpnQWeehogurjg==}
+    hasBin: true
+
+  katex@0.17.0:
+    resolution: {integrity: sha512-Vdw0ATsQ9V+LuegM/BTwQqV/6cTl5lbGcIrU+BCgLxyf6bo38ybOr372tuSIxir3CN720flu1meYR6XzNMwQnw==}
+    hasBin: true
+
   lightningcss-darwin-arm64@1.30.1:
     resolution: {integrity: sha512-c8JK7hyE65X1MHMN+Viq9n11RRC7hgin3HhYKhrMyaXflk5GVplZ60IxyoVtzILeKr+xAJwg6zK6sjTBJ0FKYQ==}
     engines: {node: '>= 12.0.0'}
@@ -2231,6 +2382,9 @@ packages:
     resolution: {integrity: sha512-9rrA30MRRP3gBD3HTGnC6cDFpaE1kVDWxWgqWJUN0RvDNAo+Nz/9GxB+nHOH0ifbVFy0hSA1V6vFDvnx54lTEQ==}
     engines: {node: '>=14'}
 
+  longest-streak@3.1.0:
+    resolution: {integrity: sha512-9Ri+o0JYgehTaVBBDoMqIl8GXtbWg711O3srftcHhZ0dqnETqLaoIK0x17fUw9rFSlK/0NlsKe0Ahhyl5pXE2g==}
+
   loupe@2.3.7:
     resolution: {integrity: sha512-zSMINGVYkdpYSOBmLi0D1Uo7JU9nVdQKrHxC8eYlV+9YKK9WePqAlL7lSlorG/U2Fw1w0hTBmaa/jrQ3UbPHtA==}
 
@@ -2246,9 +2400,147 @@ packages:
   magic-string@0.30.17:
     resolution: {integrity: sha512-sNPKHvyjVf7gyjwS4xGTaW/mCnF8wnjtifKBEhxfZ7E/S8tQ0rssrwGNn6q8JH/ohItJfSQp9mBtQYuTlH5QnA==}
 
+  markdown-table@3.0.4:
+    resolution: {integrity: sha512-wiYz4+JrLyb/DqW2hkFJxP7Vd7JuTDm77fvbM8VfEQdmSMqcImWeeRbHwZjBjIFki/VaMK2BhFi7oUUZeM5bqw==}
+
+  mdast-util-find-and-replace@3.0.2:
+    resolution: {integrity: sha512-Tmd1Vg/m3Xz43afeNxDIhWRtFZgM2VLyaf4vSTYwudTyeuTneoL3qtWMA5jeLyz/O1vDJmmV4QuScFCA2tBPwg==}
+
+  mdast-util-from-markdown@2.0.3:
+    resolution: {integrity: sha512-W4mAWTvSlKvf8L6J+VN9yLSqQ9AOAAvHuoDAmPkz4dHf553m5gVj2ejadHJhoJmcmxEnOv6Pa8XJhpxE93kb8Q==}
+
+  mdast-util-gfm-autolink-literal@2.0.1:
+    resolution: {integrity: sha512-5HVP2MKaP6L+G6YaxPNjuL0BPrq9orG3TsrZ9YXbA3vDw/ACI4MEsnoDpn6ZNm7GnZgtAcONJyPhOP8tNJQavQ==}
+
+  mdast-util-gfm-footnote@2.1.0:
+    resolution: {integrity: sha512-sqpDWlsHn7Ac9GNZQMeUzPQSMzR6Wv0WKRNvQRg0KqHh02fpTz69Qc1QSseNX29bhz1ROIyNyxExfawVKTm1GQ==}
+
+  mdast-util-gfm-strikethrough@2.0.0:
+    resolution: {integrity: sha512-mKKb915TF+OC5ptj5bJ7WFRPdYtuHv0yTRxK2tJvi+BDqbkiG7h7u/9SI89nRAYcmap2xHQL9D+QG/6wSrTtXg==}
+
+  mdast-util-gfm-table@2.0.0:
+    resolution: {integrity: sha512-78UEvebzz/rJIxLvE7ZtDd/vIQ0RHv+3Mh5DR96p7cS7HsBhYIICDBCu8csTNWNO6tBWfqXPWekRuj2FNOGOZg==}
+
+  mdast-util-gfm-task-list-item@2.0.0:
+    resolution: {integrity: sha512-IrtvNvjxC1o06taBAVJznEnkiHxLFTzgonUdy8hzFVeDun0uTjxxrRGVaNFqkU1wJR3RBPEfsxmU6jDWPofrTQ==}
+
+  mdast-util-gfm@3.1.0:
+    resolution: {integrity: sha512-0ulfdQOM3ysHhCJ1p06l0b0VKlhU0wuQs3thxZQagjcjPrlFRqY215uZGHHJan9GEAXd9MbfPjFJz+qMkVR6zQ==}
+
+  mdast-util-math@3.0.0:
+    resolution: {integrity: sha512-Tl9GBNeG/AhJnQM221bJR2HPvLOSnLE/T9cJI9tlc6zwQk2nPk/4f0cHkOdEixQPC/j8UtKDdITswvLAy1OZ1w==}
+
+  mdast-util-mdx-expression@2.0.1:
+    resolution: {integrity: sha512-J6f+9hUp+ldTZqKRSg7Vw5V6MqjATc+3E4gf3CFNcuZNWD8XdyI6zQ8GqH7f8169MM6P7hMBRDVGnn7oHB9kXQ==}
+
+  mdast-util-mdx-jsx@3.2.0:
+    resolution: {integrity: sha512-lj/z8v0r6ZtsN/cGNNtemmmfoLAFZnjMbNyLzBafjzikOM+glrjNHPlf6lQDOTccj9n5b0PPihEBbhneMyGs1Q==}
+
+  mdast-util-mdxjs-esm@2.0.1:
+    resolution: {integrity: sha512-EcmOpxsZ96CvlP03NghtH1EsLtr0n9Tm4lPUJUBccV9RwUOneqSycg19n5HGzCf+10LozMRSObtVr3ee1WoHtg==}
+
+  mdast-util-phrasing@4.1.0:
+    resolution: {integrity: sha512-TqICwyvJJpBwvGAMZjj4J2n0X8QWp21b9l0o7eXyVJ25YNWYbJDVIyD1bZXE6WtV6RmKJVYmQAKWa0zWOABz2w==}
+
+  mdast-util-to-hast@13.2.1:
+    resolution: {integrity: sha512-cctsq2wp5vTsLIcaymblUriiTcZd0CwWtCbLvrOzYCDZoWyMNV8sZ7krj09FSnsiJi3WVsHLM4k6Dq/yaPyCXA==}
+
+  mdast-util-to-markdown@2.1.2:
+    resolution: {integrity: sha512-xj68wMTvGXVOKonmog6LwyJKrYXZPvlwabaryTjLh9LuvovB/KAH+kvi8Gjj+7rJjsFi23nkUxRQv1KqSroMqA==}
+
+  mdast-util-to-string@4.0.0:
+    resolution: {integrity: sha512-0H44vDimn51F0YwvxSJSm0eCDOJTRlmN0R1yBh4HLj9wiV1Dn0QoXGbvFAWj2hSItVTlCmBF1hqKlIyUBVFLPg==}
+
   merge-stream@2.0.0:
     resolution: {integrity: sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==}
 
+  micromark-core-commonmark@2.0.3:
+    resolution: {integrity: sha512-RDBrHEMSxVFLg6xvnXmb1Ayr2WzLAWjeSATAoxwKYJV94TeNavgoIdA0a9ytzDSVzBy2YKFK+emCPOEibLeCrg==}
+
+  micromark-extension-gfm-autolink-literal@2.1.0:
+    resolution: {integrity: sha512-oOg7knzhicgQ3t4QCjCWgTmfNhvQbDDnJeVu9v81r7NltNCVmhPy1fJRX27pISafdjL+SVc4d3l48Gb6pbRypw==}
+
+  micromark-extension-gfm-footnote@2.1.0:
+    resolution: {integrity: sha512-/yPhxI1ntnDNsiHtzLKYnE3vf9JZ6cAisqVDauhp4CEHxlb4uoOTxOCJ+9s51bIB8U1N1FJ1RXOKTIlD5B/gqw==}
+
+  micromark-extension-gfm-strikethrough@2.1.0:
+    resolution: {integrity: sha512-ADVjpOOkjz1hhkZLlBiYA9cR2Anf8F4HqZUO6e5eDcPQd0Txw5fxLzzxnEkSkfnD0wziSGiv7sYhk/ktvbf1uw==}
+
+  micromark-extension-gfm-table@2.1.1:
+    resolution: {integrity: sha512-t2OU/dXXioARrC6yWfJ4hqB7rct14e8f7m0cbI5hUmDyyIlwv5vEtooptH8INkbLzOatzKuVbQmAYcbWoyz6Dg==}
+
+  micromark-extension-gfm-tagfilter@2.0.0:
+    resolution: {integrity: sha512-xHlTOmuCSotIA8TW1mDIM6X2O1SiX5P9IuDtqGonFhEK0qgRI4yeC6vMxEV2dgyr2TiD+2PQ10o+cOhdVAcwfg==}
+
+  micromark-extension-gfm-task-list-item@2.1.0:
+    resolution: {integrity: sha512-qIBZhqxqI6fjLDYFTBIa4eivDMnP+OZqsNwmQ3xNLE4Cxwc+zfQEfbs6tzAo2Hjq+bh6q5F+Z8/cksrLFYWQQw==}
+
+  micromark-extension-gfm@3.0.0:
+    resolution: {integrity: sha512-vsKArQsicm7t0z2GugkCKtZehqUm31oeGBV/KVSorWSy8ZlNAv7ytjFhvaryUiCUJYqs+NoE6AFhpQvBTM6Q4w==}
+
+  micromark-extension-math@3.1.0:
+    resolution: {integrity: sha512-lvEqd+fHjATVs+2v/8kg9i5Q0AP2k85H0WUOwpIVvUML8BapsMvh1XAogmQjOCsLpoKRCVQqEkQBB3NhVBcsOg==}
+
+  micromark-factory-destination@2.0.1:
+    resolution: {integrity: sha512-Xe6rDdJlkmbFRExpTOmRj9N3MaWmbAgdpSrBQvCFqhezUn4AHqJHbaEnfbVYYiexVSs//tqOdY/DxhjdCiJnIA==}
+
+  micromark-factory-label@2.0.1:
+    resolution: {integrity: sha512-VFMekyQExqIW7xIChcXn4ok29YE3rnuyveW3wZQWWqF4Nv9Wk5rgJ99KzPvHjkmPXF93FXIbBp6YdW3t71/7Vg==}
+
+  micromark-factory-space@2.0.1:
+    resolution: {integrity: sha512-zRkxjtBxxLd2Sc0d+fbnEunsTj46SWXgXciZmHq0kDYGnck/ZSGj9/wULTV95uoeYiK5hRXP2mJ98Uo4cq/LQg==}
+
+  micromark-factory-title@2.0.1:
+    resolution: {integrity: sha512-5bZ+3CjhAd9eChYTHsjy6TGxpOFSKgKKJPJxr293jTbfry2KDoWkhBb6TcPVB4NmzaPhMs1Frm9AZH7OD4Cjzw==}
+
+  micromark-factory-whitespace@2.0.1:
+    resolution: {integrity: sha512-Ob0nuZ3PKt/n0hORHyvoD9uZhr+Za8sFoP+OnMcnWK5lngSzALgQYKMr9RJVOWLqQYuyn6ulqGWSXdwf6F80lQ==}
+
+  micromark-util-character@2.1.1:
+    resolution: {integrity: sha512-wv8tdUTJ3thSFFFJKtpYKOYiGP2+v96Hvk4Tu8KpCAsTMs6yi+nVmGh1syvSCsaxz45J6Jbw+9DD6g97+NV67Q==}
+
+  micromark-util-chunked@2.0.1:
+    resolution: {integrity: sha512-QUNFEOPELfmvv+4xiNg2sRYeS/P84pTW0TCgP5zc9FpXetHY0ab7SxKyAQCNCc1eK0459uoLI1y5oO5Vc1dbhA==}
+
+  micromark-util-classify-character@2.0.1:
+    resolution: {integrity: sha512-K0kHzM6afW/MbeWYWLjoHQv1sgg2Q9EccHEDzSkxiP/EaagNzCm7T/WMKZ3rjMbvIpvBiZgwR3dKMygtA4mG1Q==}
+
+  micromark-util-combine-extensions@2.0.1:
+    resolution: {integrity: sha512-OnAnH8Ujmy59JcyZw8JSbK9cGpdVY44NKgSM7E9Eh7DiLS2E9RNQf0dONaGDzEG9yjEl5hcqeIsj4hfRkLH/Bg==}
+
+  micromark-util-decode-numeric-character-reference@2.0.2:
+    resolution: {integrity: sha512-ccUbYk6CwVdkmCQMyr64dXz42EfHGkPQlBj5p7YVGzq8I7CtjXZJrubAYezf7Rp+bjPseiROqe7G6foFd+lEuw==}
+
+  micromark-util-decode-string@2.0.1:
+    resolution: {integrity: sha512-nDV/77Fj6eH1ynwscYTOsbK7rR//Uj0bZXBwJZRfaLEJ1iGBR6kIfNmlNqaqJf649EP0F3NWNdeJi03elllNUQ==}
+
+  micromark-util-encode@2.0.1:
+    resolution: {integrity: sha512-c3cVx2y4KqUnwopcO9b/SCdo2O67LwJJ/UyqGfbigahfegL9myoEFoDYZgkT7f36T0bLrM9hZTAaAyH+PCAXjw==}
+
+  micromark-util-html-tag-name@2.0.1:
+    resolution: {integrity: sha512-2cNEiYDhCWKI+Gs9T0Tiysk136SnR13hhO8yW6BGNyhOC4qYFnwF1nKfD3HFAIXA5c45RrIG1ub11GiXeYd1xA==}
+
+  micromark-util-normalize-identifier@2.0.1:
+    resolution: {integrity: sha512-sxPqmo70LyARJs0w2UclACPUUEqltCkJ6PhKdMIDuJ3gSf/Q+/GIe3WKl0Ijb/GyH9lOpUkRAO2wp0GVkLvS9Q==}
+
+  micromark-util-resolve-all@2.0.1:
+    resolution: {integrity: sha512-VdQyxFWFT2/FGJgwQnJYbe1jjQoNTS4RjglmSjTUlpUMa95Htx9NHeYW4rGDJzbjvCsl9eLjMQwGeElsqmzcHg==}
+
+  micromark-util-sanitize-uri@2.0.1:
+    resolution: {integrity: sha512-9N9IomZ/YuGGZZmQec1MbgxtlgougxTodVwDzzEouPKo3qFWvymFHWcnDi2vzV1ff6kas9ucW+o3yzJK9YB1AQ==}
+
+  micromark-util-subtokenize@2.1.0:
+    resolution: {integrity: sha512-XQLu552iSctvnEcgXw6+Sx75GflAPNED1qx7eBJ+wydBb2KCbRZe+NwvIEEMM83uml1+2WSXpBAcp9IUCgCYWA==}
+
+  micromark-util-symbol@2.0.1:
+    resolution: {integrity: sha512-vs5t8Apaud9N28kgCrRUdEed4UJ+wWNvicHLPxCa9ENlYuAY31M0ETy5y1vA33YoNPDFTghEbnh6efaE8h4x0Q==}
+
+  micromark-util-types@2.0.2:
+    resolution: {integrity: sha512-Yw0ECSpJoViF1qTU4DC6NwtC4aWGt1EkzaQB8KPPyCRR8z9TWeV0HbEFGTO+ZY1wB22zmxnJqhPyTpOVCpeHTA==}
+
+  micromark@4.0.2:
+    resolution: {integrity: sha512-zpe98Q6kvavpCr1NPVSCMebCKfD7CA2NqZ+rykeNhONIJBpc1tFKt9hucLGwha3jNTNI8lHpctWJWoimVF4PfA==}
+
   mimic-fn@4.0.0:
     resolution: {integrity: sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw==}
     engines: {node: '>=12'}
@@ -2341,6 +2633,12 @@ packages:
     resolution: {integrity: sha512-5NPgf87AT2STgwa2ntRMr45jTKrYBGkVU36yT0ig/n/GMAa3oPqhZfIQ2kMEimReg0+t9kZViDVZ83qfVUlckg==}
     engines: {node: '>= 14'}
 
+  parse-entities@4.0.2:
+    resolution: {integrity: sha512-GG2AQYWoLgL877gQIKeRPGO1xF9+eG1ujIb5soS5gPvLQ1y2o8FL90w2QWNdf9I361Mpp7726c+lj3U0qK1uGw==}
+
+  parse5@7.3.0:
+    resolution: {integrity: sha512-IInvU7fabl34qmi9gY8XOVxhYyMyuH2xUNpb2q8/Y+7552KlejkRvqvD19nMoUW/uQGGbqNpA6Tufu5FL5BZgw==}
+
   path-key@3.1.1:
     resolution: {integrity: sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==}
     engines: {node: '>=8'}
@@ -2396,6 +2694,9 @@ packages:
     resolution: {integrity: sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==}
     engines: {node: '>=0.4.0'}
 
+  property-information@7.2.0:
+    resolution: {integrity: sha512-IAtzIB6sUiWaJYrX9smp3V46pBGbBeLFRGdh25kg1334VcBlD8HzhPeNIWQH9zhGmo2itIe25EHt9dQP7G5hmg==}
+
   proxy-agent@6.5.0:
     resolution: {integrity: sha512-TmatMXdr2KlRiA2CyDu8GqR8EjahTG3aY3nXjdzFyoZbmB8hrBsTyMezhULIXKnC0jpfjlmiZ3+EaCzoInSu/A==}
     engines: {node: '>= 14'}
@@ -2433,6 +2734,12 @@ packages:
   react-is@19.1.1:
     resolution: {integrity: sha512-tr41fA15Vn8p4X9ntI+yCyeGSf1TlYaY5vlTZfQmeLBrFo3psOPX6HhTDnFNL9uj3EhP0KAQ80cugCl4b4BERA==}
 
+  react-markdown@10.1.0:
+    resolution: {integrity: sha512-qKxVopLT/TyA6BX3Ue5NwabOsAzm0Q7kAPwq6L+wWDwisYs7R8vZ0nRXqq6rkueboxpkjvLGU9fWifiX/ZZFxQ==}
+    peerDependencies:
+      '@types/react': '>=18'
+      react: '>=18'
+
   react-redux@9.2.0:
     resolution: {integrity: sha512-ROY9fvHhwOD9ySfrF0wmvu//bKCQ6AeZZq1nJNtbDC+kk5DuSuNX/n6YWYF/SYy7bSba4D4FSz8DJeKY/S/r+g==}
     peerDependencies:
@@ -2501,6 +2808,24 @@ packages:
   redux@5.0.1:
     resolution: {integrity: sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w==}
 
+  rehype-katex@7.0.1:
+    resolution: {integrity: sha512-OiM2wrZ/wuhKkigASodFoo8wimG3H12LWQaH8qSPVJn9apWKFSH3YOCtbKpBorTVw/eI7cuT21XBbvwEswbIOA==}
+
+  remark-gfm@4.0.1:
+    resolution: {integrity: sha512-1quofZ2RQ9EWdeN34S79+KExV1764+wCUGop5CPL1WGdD0ocPpu91lzPGbwWMECpEpd42kJGQwzRfyov9j4yNg==}
+
+  remark-math@6.0.0:
+    resolution: {integrity: sha512-MMqgnP74Igy+S3WwnhQ7kqGlEerTETXMvJhrUzDikVZ2/uogJCb+WHUg97hK9/jcfc0dkD73s3LN8zU49cTEtA==}
+
+  remark-parse@11.0.0:
+    resolution: {integrity: sha512-FCxlKLNGknS5ba/1lmpYijMUzX2esxW5xQqjWxw2eHFfS2MSdaHVINFmhjo+qN1WhZhNimq0dZATN9pH0IDrpA==}
+
+  remark-rehype@11.1.2:
+    resolution: {integrity: sha512-Dh7l57ianaEoIpzbp0PC9UKAdCSVklD8E5Rpw7ETfbTl3FqcOOgq5q2LVDhgGCkaBv7p24JXikPdvhhmHvKMsw==}
+
+  remark-stringify@11.0.0:
+    resolution: {integrity: sha512-1OSmLd3awB/t8qdoEOMazZkNsfVTeY4fTsgzcQFdXNq8ToTN4ZGwrMnlda4K6smTFKD+GRV6O48i6Z4iKgPPpw==}
+
   require-directory@2.1.1:
     resolution: {integrity: sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==}
     engines: {node: '>=0.10.0'}
@@ -2580,6 +2905,9 @@ packages:
     resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==}
     engines: {node: '>=0.10.0'}
 
+  space-separated-tokens@2.0.2:
+    resolution: {integrity: sha512-PEGlAwrG8yXGXRjW32fGbg66JAlOAwbObuqVoJpv/mRgoWDQfgH1wDPvtzWyUSNAXBGSk8h755YDbbcEy3SH2Q==}
+
   stackback@0.0.2:
     resolution: {integrity: sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==}
 
@@ -2597,6 +2925,9 @@ packages:
     resolution: {integrity: sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==}
     engines: {node: '>=8'}
 
+  stringify-entities@4.0.4:
+    resolution: {integrity: sha512-IwfBptatlO+QCJUo19AqvrPNqlVMpW9YEL2LIVY+Rpv2qsjCGxaDLNRgeGsQWJhfItebuJhsGSLjaBbNSQ+ieg==}
+
   strip-ansi@6.0.1:
     resolution: {integrity: sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==}
     engines: {node: '>=8'}
@@ -2608,6 +2939,12 @@ packages:
   strip-literal@2.1.1:
     resolution: {integrity: sha512-631UJ6O00eNGfMiWG78ck80dfBab8X6IVFB51jZK5Icd7XAs60Z5y7QdSd/wGIklnWvRbUNloVzhOKKmutxQ6Q==}
 
+  style-to-js@1.1.21:
+    resolution: {integrity: sha512-RjQetxJrrUJLQPHbLku6U/ocGtzyjbJMP9lCNK7Ag0CNh690nSH8woqWH9u16nMjYBAok+i7JO1NP2pOy8IsPQ==}
+
+  style-to-object@1.0.14:
+    resolution: {integrity: sha512-LIN7rULI0jBscWQYaSswptyderlarFkjQ+t79nzty8tcIAceVomEVlLzH5VP4Cmsv6MtKhs7qaAiwlcp+Mgaxw==}
+
   styled-jsx@5.1.6:
     resolution: {integrity: sha512-qSVyDTeMotdvQYoHWLNGwRFJHC+i+ZvdBRYosOFgC+Wg1vx4frN2/RG/NA7SYqqvKNLf39P2LSRA2pu6n0XYZA==}
     engines: {node: '>= 12.0.0'}
@@ -2667,6 +3004,12 @@ packages:
     resolution: {integrity: sha512-KYad6Vy5VDWV4GH3fjpseMQ/XU2BhIYP7Vzd0LG44qRWm/Yt2WCOTicFdvmgo6gWaqooMQCawTtILVQJupKu7A==}
     engines: {node: '>=14.0.0'}
 
+  trim-lines@3.0.1:
+    resolution: {integrity: sha512-kRj8B+YHZCc9kQYdWfJB2/oUl9rA99qbowYYBtr4ui4mZyAQ2JpvVBd/6U2YloATfqBhBTSMhTpgBHtU0Mf3Rg==}
+
+  trough@2.2.0:
+    resolution: {integrity: sha512-tmMpK00BjZiUyVyvrBK7knerNgmgvcV/KLVyuma/SC+TQN167GrMRciANTz09+k3zW8L8t60jWO1GpfkZdjTaw==}
+
   tslib@2.8.1:
     resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==}
 
@@ -2696,6 +3039,30 @@ packages:
   undici-types@6.21.0:
     resolution: {integrity: sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==}
 
+  unified@11.0.5:
+    resolution: {integrity: sha512-xKvGhPWw3k84Qjh8bI3ZeJjqnyadK+GEFtazSfZv/rKeTkTjOJho6mFqh2SM96iIcZokxiOpg78GazTSg8+KHA==}
+
+  unist-util-find-after@5.0.0:
+    resolution: {integrity: sha512-amQa0Ep2m6hE2g72AugUItjbuM8X8cGQnFoHk0pGfrFeT9GZhzN5SW8nRsiGKK7Aif4CrACPENkA6P/Lw6fHGQ==}
+
+  unist-util-is@6.0.1:
+    resolution: {integrity: sha512-LsiILbtBETkDz8I9p1dQ0uyRUWuaQzd/cuEeS1hoRSyW5E5XGmTzlwY1OrNzzakGowI9Dr/I8HVaw4hTtnxy8g==}
+
+  unist-util-position@5.0.0:
+    resolution: {integrity: sha512-fucsC7HjXvkB5R3kTCO7kUjRdrS0BJt3M/FPxmHMBOm8JQi2BsHAHFsy27E0EolP8rp0NzXsJ+jNPyDWvOJZPA==}
+
+  unist-util-remove-position@5.0.0:
+    resolution: {integrity: sha512-Hp5Kh3wLxv0PHj9m2yZhhLt58KzPtEYKQQ4yxfYFEO7EvHwzyDYnduhHnY1mDxoqr7VUwVuHXk9RXKIiYS1N8Q==}
+
+  unist-util-stringify-position@4.0.0:
+    resolution: {integrity: sha512-0ASV06AAoKCDkS2+xw5RXJywruurpbC4JZSm7nr7MOt1ojAzvyyaO+UxZf18j8FCF6kmzCZKcAgN/yu2gm2XgQ==}
+
+  unist-util-visit-parents@6.0.2:
+    resolution: {integrity: sha512-goh1s1TBrqSqukSc8wrjwWhL0hiJxgA8m4kFxGlQ+8FYQ3C/m11FcTs4YYem7V664AhHVvgoQLk890Ssdsr2IQ==}
+
+  unist-util-visit@5.1.0:
+    resolution: {integrity: sha512-m+vIdyeCOpdr/QeQCu2EzxX/ohgS8KbnPDgFni4dQsfSCtpz8UqDyY5GjRru8PDKuYn7Fq19j1CQ+nJSsGKOzg==}
+
   update-browserslist-db@1.1.3:
     resolution: {integrity: sha512-UxhIZQ+QInVdunkDAaiazvvT/+fXL5Osr0JZlJulepYu6Jd7qJtDZjlur0emRlT71EN3ScPoE7gvsuIKKNavKw==}
     hasBin: true
@@ -2733,6 +3100,15 @@ packages:
       react: ^16.8 || ^17.0 || ^18.0
       react-dom: ^16.8 || ^17.0 || ^18.0
 
+  vfile-location@5.0.3:
+    resolution: {integrity: sha512-5yXvWDEgqeiYiBe1lbxYF7UMAIm/IcopxMHrMQDq3nvKcjPKIhZklUKL+AE7J7uApI4kwe2snsK+eI6UTj9EHg==}
+
+  vfile-message@4.0.3:
+    resolution: {integrity: sha512-QTHzsGd1EhbZs4AsQ20JX1rC3cOlt/IWJruk893DfLRr57lcnOeMaWG4K0JrRta4mIJZKth2Au3mM3u03/JWKw==}
+
+  vfile@6.0.3:
+    resolution: {integrity: sha512-KzIbH/9tXat2u30jf+smMwFCsno4wHVdNmzFyL+T/L3UGqqk6JKfVqOFOZEpZSHADH1k40ab6NUIXZq422ov3Q==}
+
   victory-vendor@37.3.6:
     resolution: {integrity: sha512-SbPDPdDBYp+5MJHhBCAyI7wKM3d5ivekigc2Dk2s7pgbZ9wIgIBYGVw4zGHBml/qTFbexrofXW6Gu4noGxrOwQ==}
 
@@ -2797,6 +3173,9 @@ packages:
       jsdom:
         optional: true
 
+  web-namespaces@2.0.1:
+    resolution: {integrity: sha512-bKr1DkiNa2krS7qxNtdrtHAmzuYGFQLiQ13TsorsdT6ULTkPLKuu5+GsFpDlg6JFjUTwX2DyhMPG2be8uPrqsQ==}
+
   webdriver-bidi-protocol@0.4.1:
     resolution: {integrity: sha512-ARrjNjtWRRs2w4Tk7nqrf2gBI0QXWuOmMCx2hU+1jUt6d00MjMxURrhxhGbrsoiZKJrhTSTzbIrc554iKI10qw==}
 
@@ -2855,6 +3234,9 @@ packages:
   zod@3.25.67:
     resolution: {integrity: sha512-idA2YXwpCdqUSKRCACDE6ItZD9TZzy3OZMtpfLoh6oPR47lipysRrJfjzMqFxQ3uJuUPyUeWe1r9vLH33xO/Qw==}
 
+  zwitch@2.0.4:
+    resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
+
 snapshots:
 
   '@alloc/quick-lru@5.2.0': {}
@@ -4096,8 +4478,28 @@ snapshots:
 
   '@types/d3-timer@3.0.2': {}
 
+  '@types/debug@4.1.13':
+    dependencies:
+      '@types/ms': 2.1.0
+
+  '@types/estree-jsx@1.0.5':
+    dependencies:
+      '@types/estree': 1.0.8
+
   '@types/estree@1.0.8': {}
 
+  '@types/hast@3.0.4':
+    dependencies:
+      '@types/unist': 3.0.3
+
+  '@types/katex@0.16.8': {}
+
+  '@types/mdast@4.0.4':
+    dependencies:
+      '@types/unist': 3.0.3
+
+  '@types/ms@2.1.0': {}
+
   '@types/node@22.17.2':
     dependencies:
       undici-types: 6.21.0
@@ -4110,6 +4512,10 @@ snapshots:
     dependencies:
       csstype: 3.1.3
 
+  '@types/unist@2.0.11': {}
+
+  '@types/unist@3.0.3': {}
+
   '@types/use-sync-external-store@0.0.6': {}
 
   '@types/yauzl@2.10.3':
@@ -4117,6 +4523,8 @@ snapshots:
       '@types/node': 22.17.2
     optional: true
 
+  '@ungap/structured-clone@1.3.1': {}
+
   '@vitest/expect@1.6.1':
     dependencies:
       '@vitest/spy': 1.6.1
@@ -4184,6 +4592,8 @@ snapshots:
 
   b4a@1.8.1: {}
 
+  bail@2.0.2: {}
+
   bare-events@2.8.2: {}
 
   bare-fs@4.7.1:
@@ -4235,6 +4645,8 @@ snapshots:
 
   caniuse-lite@1.0.30001735: {}
 
+  ccount@2.0.1: {}
+
   chai@4.5.0:
     dependencies:
       assertion-error: 1.1.0
@@ -4245,6 +4657,14 @@ snapshots:
       pathval: 1.1.1
       type-detect: 4.1.0
 
+  character-entities-html4@2.1.0: {}
+
+  character-entities-legacy@3.0.0: {}
+
+  character-entities@2.0.2: {}
+
+  character-reference-invalid@2.0.1: {}
+
   check-error@1.0.3:
     dependencies:
       get-func-name: 2.0.2
@@ -4301,6 +4721,10 @@ snapshots:
       color-string: 1.9.1
     optional: true
 
+  comma-separated-tokens@2.0.3: {}
+
+  commander@8.3.0: {}
+
   confbox@0.1.8: {}
 
   cross-spawn@7.0.6:
@@ -4365,6 +4789,10 @@ snapshots:
 
   decimal.js-light@2.5.1: {}
 
+  decode-named-character-reference@1.3.0:
+    dependencies:
+      character-entities: 2.0.2
+
   deep-eql@4.1.4:
     dependencies:
       type-detect: 4.1.0
@@ -4375,12 +4803,18 @@ snapshots:
       escodegen: 2.1.0
       esprima: 4.0.1
 
+  dequal@2.0.3: {}
+
   detect-libc@2.0.4: {}
 
   detect-libc@2.1.2: {}
 
   detect-node-es@1.1.0: {}
 
+  devlop@1.1.0:
+    dependencies:
+      dequal: 2.0.3
+
   devtools-protocol@0.0.1595872: {}
 
   diff-sequences@29.6.3: {}
@@ -4410,6 +4844,8 @@ snapshots:
       graceful-fs: 4.2.11
       tapable: 2.2.2
 
+  entities@6.0.1: {}
+
   es-toolkit@1.39.9: {}
 
   esbuild@0.21.5:
@@ -4469,6 +4905,8 @@ snapshots:
 
   escalade@3.2.0: {}
 
+  escape-string-regexp@5.0.0: {}
+
   escodegen@2.1.0:
     dependencies:
       esprima: 4.0.1
@@ -4481,6 +4919,8 @@ snapshots:
 
   estraverse@5.3.0: {}
 
+  estree-util-is-identifier-name@3.0.0: {}
+
   estree-walker@3.0.3:
     dependencies:
       '@types/estree': 1.0.8
@@ -4507,6 +4947,8 @@ snapshots:
       signal-exit: 4.1.0
       strip-final-newline: 3.0.0
 
+  extend@3.0.2: {}
+
   extract-zip@2.0.1:
     dependencies:
       debug: 4.4.3
@@ -4561,6 +5003,88 @@ snapshots:
 
   graceful-fs@4.2.11: {}
 
+  hast-util-from-dom@5.0.1:
+    dependencies:
+      '@types/hast': 3.0.4
+      hastscript: 9.0.1
+      web-namespaces: 2.0.1
+
+  hast-util-from-html-isomorphic@2.0.0:
+    dependencies:
+      '@types/hast': 3.0.4
+      hast-util-from-dom: 5.0.1
+      hast-util-from-html: 2.0.3
+      unist-util-remove-position: 5.0.0
+
+  hast-util-from-html@2.0.3:
+    dependencies:
+      '@types/hast': 3.0.4
+      devlop: 1.1.0
+      hast-util-from-parse5: 8.0.3
+      parse5: 7.3.0
+      vfile: 6.0.3
+      vfile-message: 4.0.3
+
+  hast-util-from-parse5@8.0.3:
+    dependencies:
+      '@types/hast': 3.0.4
+      '@types/unist': 3.0.3
+      devlop: 1.1.0
+      hastscript: 9.0.1
+      property-information: 7.2.0
+      vfile: 6.0.3
+      vfile-location: 5.0.3
+      web-namespaces: 2.0.1
+
+  hast-util-is-element@3.0.0:
+    dependencies:
+      '@types/hast': 3.0.4
+
+  hast-util-parse-selector@4.0.0:
+    dependencies:
+      '@types/hast': 3.0.4
+
+  hast-util-to-jsx-runtime@2.3.6:
+    dependencies:
+      '@types/estree': 1.0.8
+      '@types/hast': 3.0.4
+      '@types/unist': 3.0.3
+      comma-separated-tokens: 2.0.3
+      devlop: 1.1.0
+      estree-util-is-identifier-name: 3.0.0
+      hast-util-whitespace: 3.0.0
+      mdast-util-mdx-expression: 2.0.1
+      mdast-util-mdx-jsx: 3.2.0
+      mdast-util-mdxjs-esm: 2.0.1
+      property-information: 7.2.0
+      space-separated-tokens: 2.0.2
+      style-to-js: 1.1.21
+      unist-util-position: 5.0.0
+      vfile-message: 4.0.3
+    transitivePeerDependencies:
+      - supports-color
+
+  hast-util-to-text@4.0.2:
+    dependencies:
+      '@types/hast': 3.0.4
+      '@types/unist': 3.0.3
+      hast-util-is-element: 3.0.0
+      unist-util-find-after: 5.0.0
+
+  hast-util-whitespace@3.0.0:
+    dependencies:
+      '@types/hast': 3.0.4
+
+  hastscript@9.0.1:
+    dependencies:
+      '@types/hast': 3.0.4
+      comma-separated-tokens: 2.0.3
+      hast-util-parse-selector: 4.0.0
+      property-information: 7.2.0
+      space-separated-tokens: 2.0.2
+
+  html-url-attributes@3.0.1: {}
+
   http-proxy-agent@7.0.2:
     dependencies:
       agent-base: 7.1.4
@@ -4579,6 +5103,8 @@ snapshots:
 
   immer@10.1.1: {}
 
+  inline-style-parser@0.2.7: {}
+
   input-otp@1.4.1(react-dom@19.1.1(react@19.1.1))(react@19.1.1):
     dependencies:
       react: 19.1.1
@@ -4588,11 +5114,24 @@ snapshots:
 
   ip-address@10.2.0: {}
 
+  is-alphabetical@2.0.1: {}
+
+  is-alphanumerical@2.0.1:
+    dependencies:
+      is-alphabetical: 2.0.1
+      is-decimal: 2.0.1
+
   is-arrayish@0.3.2:
     optional: true
 
+  is-decimal@2.0.1: {}
+
   is-fullwidth-code-point@3.0.0: {}
 
+  is-hexadecimal@2.0.1: {}
+
+  is-plain-obj@4.1.0: {}
+
   is-stream@3.0.0: {}
 
   isexe@2.0.0: {}
@@ -4601,6 +5140,14 @@ snapshots:
 
   js-tokens@9.0.1: {}
 
+  katex@0.16.47:
+    dependencies:
+      commander: 8.3.0
+
+  katex@0.17.0:
+    dependencies:
+      commander: 8.3.0
+
   lightningcss-darwin-arm64@1.30.1:
     optional: true
 
@@ -4651,6 +5198,8 @@ snapshots:
       mlly: 1.7.4
       pkg-types: 1.3.1
 
+  longest-streak@3.1.0: {}
+
   loupe@2.3.7:
     dependencies:
       get-func-name: 2.0.2
@@ -4665,8 +5214,376 @@ snapshots:
     dependencies:
       '@jridgewell/sourcemap-codec': 1.5.5
 
+  markdown-table@3.0.4: {}
+
+  mdast-util-find-and-replace@3.0.2:
+    dependencies:
+      '@types/mdast': 4.0.4
+      escape-string-regexp: 5.0.0
+      unist-util-is: 6.0.1
+      unist-util-visit-parents: 6.0.2
+
+  mdast-util-from-markdown@2.0.3:
+    dependencies:
+      '@types/mdast': 4.0.4
+      '@types/unist': 3.0.3
+      decode-named-character-reference: 1.3.0
+      devlop: 1.1.0
+      mdast-util-to-string: 4.0.0
+      micromark: 4.0.2
+      micromark-util-decode-numeric-character-reference: 2.0.2
+      micromark-util-decode-string: 2.0.1
+      micromark-util-normalize-identifier: 2.0.1
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+      unist-util-stringify-position: 4.0.0
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-gfm-autolink-literal@2.0.1:
+    dependencies:
+      '@types/mdast': 4.0.4
+      ccount: 2.0.1
+      devlop: 1.1.0
+      mdast-util-find-and-replace: 3.0.2
+      micromark-util-character: 2.1.1
+
+  mdast-util-gfm-footnote@2.1.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      devlop: 1.1.0
+      mdast-util-from-markdown: 2.0.3
+      mdast-util-to-markdown: 2.1.2
+      micromark-util-normalize-identifier: 2.0.1
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-gfm-strikethrough@2.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      mdast-util-from-markdown: 2.0.3
+      mdast-util-to-markdown: 2.1.2
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-gfm-table@2.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      devlop: 1.1.0
+      markdown-table: 3.0.4
+      mdast-util-from-markdown: 2.0.3
+      mdast-util-to-markdown: 2.1.2
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-gfm-task-list-item@2.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      devlop: 1.1.0
+      mdast-util-from-markdown: 2.0.3
+      mdast-util-to-markdown: 2.1.2
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-gfm@3.1.0:
+    dependencies:
+      mdast-util-from-markdown: 2.0.3
+      mdast-util-gfm-autolink-literal: 2.0.1
+      mdast-util-gfm-footnote: 2.1.0
+      mdast-util-gfm-strikethrough: 2.0.0
+      mdast-util-gfm-table: 2.0.0
+      mdast-util-gfm-task-list-item: 2.0.0
+      mdast-util-to-markdown: 2.1.2
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-math@3.0.0:
+    dependencies:
+      '@types/hast': 3.0.4
+      '@types/mdast': 4.0.4
+      devlop: 1.1.0
+      longest-streak: 3.1.0
+      mdast-util-from-markdown: 2.0.3
+      mdast-util-to-markdown: 2.1.2
+      unist-util-remove-position: 5.0.0
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-mdx-expression@2.0.1:
+    dependencies:
+      '@types/estree-jsx': 1.0.5
+      '@types/hast': 3.0.4
+      '@types/mdast': 4.0.4
+      devlop: 1.1.0
+      mdast-util-from-markdown: 2.0.3
+      mdast-util-to-markdown: 2.1.2
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-mdx-jsx@3.2.0:
+    dependencies:
+      '@types/estree-jsx': 1.0.5
+      '@types/hast': 3.0.4
+      '@types/mdast': 4.0.4
+      '@types/unist': 3.0.3
+      ccount: 2.0.1
+      devlop: 1.1.0
+      mdast-util-from-markdown: 2.0.3
+      mdast-util-to-markdown: 2.1.2
+      parse-entities: 4.0.2
+      stringify-entities: 4.0.4
+      unist-util-stringify-position: 4.0.0
+      vfile-message: 4.0.3
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-mdxjs-esm@2.0.1:
+    dependencies:
+      '@types/estree-jsx': 1.0.5
+      '@types/hast': 3.0.4
+      '@types/mdast': 4.0.4
+      devlop: 1.1.0
+      mdast-util-from-markdown: 2.0.3
+      mdast-util-to-markdown: 2.1.2
+    transitivePeerDependencies:
+      - supports-color
+
+  mdast-util-phrasing@4.1.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      unist-util-is: 6.0.1
+
+  mdast-util-to-hast@13.2.1:
+    dependencies:
+      '@types/hast': 3.0.4
+      '@types/mdast': 4.0.4
+      '@ungap/structured-clone': 1.3.1
+      devlop: 1.1.0
+      micromark-util-sanitize-uri: 2.0.1
+      trim-lines: 3.0.1
+      unist-util-position: 5.0.0
+      unist-util-visit: 5.1.0
+      vfile: 6.0.3
+
+  mdast-util-to-markdown@2.1.2:
+    dependencies:
+      '@types/mdast': 4.0.4
+      '@types/unist': 3.0.3
+      longest-streak: 3.1.0
+      mdast-util-phrasing: 4.1.0
+      mdast-util-to-string: 4.0.0
+      micromark-util-classify-character: 2.0.1
+      micromark-util-decode-string: 2.0.1
+      unist-util-visit: 5.1.0
+      zwitch: 2.0.4
+
+  mdast-util-to-string@4.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+
   merge-stream@2.0.0: {}
 
+  micromark-core-commonmark@2.0.3:
+    dependencies:
+      decode-named-character-reference: 1.3.0
+      devlop: 1.1.0
+      micromark-factory-destination: 2.0.1
+      micromark-factory-label: 2.0.1
+      micromark-factory-space: 2.0.1
+      micromark-factory-title: 2.0.1
+      micromark-factory-whitespace: 2.0.1
+      micromark-util-character: 2.1.1
+      micromark-util-chunked: 2.0.1
+      micromark-util-classify-character: 2.0.1
+      micromark-util-html-tag-name: 2.0.1
+      micromark-util-normalize-identifier: 2.0.1
+      micromark-util-resolve-all: 2.0.1
+      micromark-util-subtokenize: 2.1.0
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-extension-gfm-autolink-literal@2.1.0:
+    dependencies:
+      micromark-util-character: 2.1.1
+      micromark-util-sanitize-uri: 2.0.1
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-extension-gfm-footnote@2.1.0:
+    dependencies:
+      devlop: 1.1.0
+      micromark-core-commonmark: 2.0.3
+      micromark-factory-space: 2.0.1
+      micromark-util-character: 2.1.1
+      micromark-util-normalize-identifier: 2.0.1
+      micromark-util-sanitize-uri: 2.0.1
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-extension-gfm-strikethrough@2.1.0:
+    dependencies:
+      devlop: 1.1.0
+      micromark-util-chunked: 2.0.1
+      micromark-util-classify-character: 2.0.1
+      micromark-util-resolve-all: 2.0.1
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-extension-gfm-table@2.1.1:
+    dependencies:
+      devlop: 1.1.0
+      micromark-factory-space: 2.0.1
+      micromark-util-character: 2.1.1
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-extension-gfm-tagfilter@2.0.0:
+    dependencies:
+      micromark-util-types: 2.0.2
+
+  micromark-extension-gfm-task-list-item@2.1.0:
+    dependencies:
+      devlop: 1.1.0
+      micromark-factory-space: 2.0.1
+      micromark-util-character: 2.1.1
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-extension-gfm@3.0.0:
+    dependencies:
+      micromark-extension-gfm-autolink-literal: 2.1.0
+      micromark-extension-gfm-footnote: 2.1.0
+      micromark-extension-gfm-strikethrough: 2.1.0
+      micromark-extension-gfm-table: 2.1.1
+      micromark-extension-gfm-tagfilter: 2.0.0
+      micromark-extension-gfm-task-list-item: 2.1.0
+      micromark-util-combine-extensions: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-extension-math@3.1.0:
+    dependencies:
+      '@types/katex': 0.16.8
+      devlop: 1.1.0
+      katex: 0.16.47
+      micromark-factory-space: 2.0.1
+      micromark-util-character: 2.1.1
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-factory-destination@2.0.1:
+    dependencies:
+      micromark-util-character: 2.1.1
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-factory-label@2.0.1:
+    dependencies:
+      devlop: 1.1.0
+      micromark-util-character: 2.1.1
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-factory-space@2.0.1:
+    dependencies:
+      micromark-util-character: 2.1.1
+      micromark-util-types: 2.0.2
+
+  micromark-factory-title@2.0.1:
+    dependencies:
+      micromark-factory-space: 2.0.1
+      micromark-util-character: 2.1.1
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-factory-whitespace@2.0.1:
+    dependencies:
+      micromark-factory-space: 2.0.1
+      micromark-util-character: 2.1.1
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-util-character@2.1.1:
+    dependencies:
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-util-chunked@2.0.1:
+    dependencies:
+      micromark-util-symbol: 2.0.1
+
+  micromark-util-classify-character@2.0.1:
+    dependencies:
+      micromark-util-character: 2.1.1
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-util-combine-extensions@2.0.1:
+    dependencies:
+      micromark-util-chunked: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-util-decode-numeric-character-reference@2.0.2:
+    dependencies:
+      micromark-util-symbol: 2.0.1
+
+  micromark-util-decode-string@2.0.1:
+    dependencies:
+      decode-named-character-reference: 1.3.0
+      micromark-util-character: 2.1.1
+      micromark-util-decode-numeric-character-reference: 2.0.2
+      micromark-util-symbol: 2.0.1
+
+  micromark-util-encode@2.0.1: {}
+
+  micromark-util-html-tag-name@2.0.1: {}
+
+  micromark-util-normalize-identifier@2.0.1:
+    dependencies:
+      micromark-util-symbol: 2.0.1
+
+  micromark-util-resolve-all@2.0.1:
+    dependencies:
+      micromark-util-types: 2.0.2
+
+  micromark-util-sanitize-uri@2.0.1:
+    dependencies:
+      micromark-util-character: 2.1.1
+      micromark-util-encode: 2.0.1
+      micromark-util-symbol: 2.0.1
+
+  micromark-util-subtokenize@2.1.0:
+    dependencies:
+      devlop: 1.1.0
+      micromark-util-chunked: 2.0.1
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+
+  micromark-util-symbol@2.0.1: {}
+
+  micromark-util-types@2.0.2: {}
+
+  micromark@4.0.2:
+    dependencies:
+      '@types/debug': 4.1.13
+      debug: 4.4.3
+      decode-named-character-reference: 1.3.0
+      devlop: 1.1.0
+      micromark-core-commonmark: 2.0.3
+      micromark-factory-space: 2.0.1
+      micromark-util-character: 2.1.1
+      micromark-util-chunked: 2.0.1
+      micromark-util-combine-extensions: 2.0.1
+      micromark-util-decode-numeric-character-reference: 2.0.2
+      micromark-util-encode: 2.0.1
+      micromark-util-normalize-identifier: 2.0.1
+      micromark-util-resolve-all: 2.0.1
+      micromark-util-sanitize-uri: 2.0.1
+      micromark-util-subtokenize: 2.1.0
+      micromark-util-symbol: 2.0.1
+      micromark-util-types: 2.0.2
+    transitivePeerDependencies:
+      - supports-color
+
   mimic-fn@4.0.0: {}
 
   minipass@7.1.2: {}
@@ -4761,6 +5678,20 @@ snapshots:
       degenerator: 5.0.1
       netmask: 2.1.1
 
+  parse-entities@4.0.2:
+    dependencies:
+      '@types/unist': 2.0.11
+      character-entities-legacy: 3.0.0
+      character-reference-invalid: 2.0.1
+      decode-named-character-reference: 1.3.0
+      is-alphanumerical: 2.0.1
+      is-decimal: 2.0.1
+      is-hexadecimal: 2.0.1
+
+  parse5@7.3.0:
+    dependencies:
+      entities: 6.0.1
+
   path-key@3.1.1: {}
 
   path-key@4.0.0: {}
@@ -4811,6 +5742,8 @@ snapshots:
 
   progress@2.0.3: {}
 
+  property-information@7.2.0: {}
+
   proxy-agent@6.5.0:
     dependencies:
       agent-base: 7.1.4
@@ -4868,6 +5801,24 @@ snapshots:
 
   react-is@19.1.1: {}
 
+  react-markdown@10.1.0(@types/react@19.1.10)(react@19.1.1):
+    dependencies:
+      '@types/hast': 3.0.4
+      '@types/mdast': 4.0.4
+      '@types/react': 19.1.10
+      devlop: 1.1.0
+      hast-util-to-jsx-runtime: 2.3.6
+      html-url-attributes: 3.0.1
+      mdast-util-to-hast: 13.2.1
+      react: 19.1.1
+      remark-parse: 11.0.0
+      remark-rehype: 11.1.2
+      unified: 11.0.5
+      unist-util-visit: 5.1.0
+      vfile: 6.0.3
+    transitivePeerDependencies:
+      - supports-color
+
   react-redux@9.2.0(@types/react@19.1.10)(react@19.1.1)(redux@5.0.1):
     dependencies:
       '@types/use-sync-external-store': 0.0.6
@@ -4937,6 +5888,59 @@ snapshots:
 
   redux@5.0.1: {}
 
+  rehype-katex@7.0.1:
+    dependencies:
+      '@types/hast': 3.0.4
+      '@types/katex': 0.16.8
+      hast-util-from-html-isomorphic: 2.0.0
+      hast-util-to-text: 4.0.2
+      katex: 0.16.47
+      unist-util-visit-parents: 6.0.2
+      vfile: 6.0.3
+
+  remark-gfm@4.0.1:
+    dependencies:
+      '@types/mdast': 4.0.4
+      mdast-util-gfm: 3.1.0
+      micromark-extension-gfm: 3.0.0
+      remark-parse: 11.0.0
+      remark-stringify: 11.0.0
+      unified: 11.0.5
+    transitivePeerDependencies:
+      - supports-color
+
+  remark-math@6.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      mdast-util-math: 3.0.0
+      micromark-extension-math: 3.1.0
+      unified: 11.0.5
+    transitivePeerDependencies:
+      - supports-color
+
+  remark-parse@11.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      mdast-util-from-markdown: 2.0.3
+      micromark-util-types: 2.0.2
+      unified: 11.0.5
+    transitivePeerDependencies:
+      - supports-color
+
+  remark-rehype@11.1.2:
+    dependencies:
+      '@types/hast': 3.0.4
+      '@types/mdast': 4.0.4
+      mdast-util-to-hast: 13.2.1
+      unified: 11.0.5
+      vfile: 6.0.3
+
+  remark-stringify@11.0.0:
+    dependencies:
+      '@types/mdast': 4.0.4
+      mdast-util-to-markdown: 2.1.2
+      unified: 11.0.5
+
   require-directory@2.1.1: {}
 
   reselect@5.1.1: {}
@@ -5045,6 +6049,8 @@ snapshots:
   source-map@0.6.1:
     optional: true
 
+  space-separated-tokens@2.0.2: {}
+
   stackback@0.0.2: {}
 
   std-env@3.9.0: {}
@@ -5066,6 +6072,11 @@ snapshots:
       is-fullwidth-code-point: 3.0.0
       strip-ansi: 6.0.1
 
+  stringify-entities@4.0.4:
+    dependencies:
+      character-entities-html4: 2.1.0
+      character-entities-legacy: 3.0.0
+
   strip-ansi@6.0.1:
     dependencies:
       ansi-regex: 5.0.1
@@ -5076,6 +6087,14 @@ snapshots:
     dependencies:
       js-tokens: 9.0.1
 
+  style-to-js@1.1.21:
+    dependencies:
+      style-to-object: 1.0.14
+
+  style-to-object@1.0.14:
+    dependencies:
+      inline-style-parser: 0.2.7
+
   styled-jsx@5.1.6(react@19.1.1):
     dependencies:
       client-only: 0.0.1
@@ -5144,6 +6163,10 @@ snapshots:
 
   tinyspy@2.2.1: {}
 
+  trim-lines@3.0.1: {}
+
+  trough@2.2.0: {}
+
   tslib@2.8.1: {}
 
   tsx@4.21.0:
@@ -5165,6 +6188,49 @@ snapshots:
 
   undici-types@6.21.0: {}
 
+  unified@11.0.5:
+    dependencies:
+      '@types/unist': 3.0.3
+      bail: 2.0.2
+      devlop: 1.1.0
+      extend: 3.0.2
+      is-plain-obj: 4.1.0
+      trough: 2.2.0
+      vfile: 6.0.3
+
+  unist-util-find-after@5.0.0:
+    dependencies:
+      '@types/unist': 3.0.3
+      unist-util-is: 6.0.1
+
+  unist-util-is@6.0.1:
+    dependencies:
+      '@types/unist': 3.0.3
+
+  unist-util-position@5.0.0:
+    dependencies:
+      '@types/unist': 3.0.3
+
+  unist-util-remove-position@5.0.0:
+    dependencies:
+      '@types/unist': 3.0.3
+      unist-util-visit: 5.1.0
+
+  unist-util-stringify-position@4.0.0:
+    dependencies:
+      '@types/unist': 3.0.3
+
+  unist-util-visit-parents@6.0.2:
+    dependencies:
+      '@types/unist': 3.0.3
+      unist-util-is: 6.0.1
+
+  unist-util-visit@5.1.0:
+    dependencies:
+      '@types/unist': 3.0.3
+      unist-util-is: 6.0.1
+      unist-util-visit-parents: 6.0.2
+
   update-browserslist-db@1.1.3(browserslist@4.25.2):
     dependencies:
       browserslist: 4.25.2
@@ -5199,6 +6265,21 @@ snapshots:
       - '@types/react'
       - '@types/react-dom'
 
+  vfile-location@5.0.3:
+    dependencies:
+      '@types/unist': 3.0.3
+      vfile: 6.0.3
+
+  vfile-message@4.0.3:
+    dependencies:
+      '@types/unist': 3.0.3
+      unist-util-stringify-position: 4.0.0
+
+  vfile@6.0.3:
+    dependencies:
+      '@types/unist': 3.0.3
+      vfile-message: 4.0.3
+
   victory-vendor@37.3.6:
     dependencies:
       '@types/d3-array': 3.2.1
@@ -5278,6 +6359,8 @@ snapshots:
       - supports-color
       - terser
 
+  web-namespaces@2.0.1: {}
+
   webdriver-bidi-protocol@0.4.1: {}
 
   which@2.0.2:
@@ -5323,3 +6406,5 @@ snapshots:
   yocto-queue@1.2.1: {}
 
   zod@3.25.67: {}
+
+  zwitch@2.0.4: {}