import { RESEARCH_MODE_LABELS } from "@autoscholar/schemas";
import type { Metadata } from "next";
import Link from "next/link";
import { ResearchPipeline } from "@/components/ResearchPipeline";
import { SectionHeading } from "@/components/SectionHeading";

export const metadata: Metadata = { title: "Methodology", alternates: { canonical: "/methodology" } };

const MODES: Record<string, string> = {
  empirical:
    "Real, licensed data with provenance; executed analysis; robustness checks; every reported number traced.",
  computational:
    "Executable benchmark with baselines, seeds and ablations; logs and metrics regenerable by script.",
  theoretical: "Formal statements, complete derivations or proofs, and a documented counterexample search.",
  review:
    "Search strings, dates and counts; screening records; a verified bibliography of at least ten sources.",
  experimental:
    "Protocol, observed-versus-synthetic labelling and uncertainty; human approval before release.",
  humanities: "Primary-source provenance and quoted evidence with locators for interpretive claims.",
};

export default function MethodologyPage() {
  return (
    <div>
      <section className="border-b hairline" style={{ background: "var(--bg-muted)" }}>
        <div className="container-x section-tight">
          <div className="max-w-3xl">
            <p className="eyebrow">Methodology</p>
            <h1 className="title-1 mt-2">How a working paper is produced</h1>
            <p className="lede mt-4">
              Production is a durable state machine of stages with evidence requirements. Research runs on an
              isolated worker; verification and publication are decided on the control plane by deterministic
              gates.
            </p>
          </div>
          <ul className="mt-8 grid gap-3 sm:grid-cols-3">
            {[
              [
                "Two halves",
                "Stages 0–8 run on a MacLustr worker in a sandbox; 9–10 run on the control plane.",
              ],
              [
                "Fixed policy",
                "Permissions, budgets and publishing are platform policy. The uploaded brief controls only the science.",
              ],
              [
                "Evidence, not prose",
                "Each stage must leave specific artifacts behind. Missing evidence blocks publication.",
              ],
            ].map(([h, p]) => (
              <li key={h} className="surface p-4">
                <p className="title-3">{h}</p>
                <p className="muted mt-1 text-sm leading-relaxed">{p}</p>
              </li>
            ))}
          </ul>
        </div>
      </section>

      <section className="container-x section-tight" aria-labelledby="stages">
        <SectionHeading eyebrow="Pipeline" title="Eleven stages" id="stages">
          Open any stage for its inputs, outputs and verification requirements.
        </SectionHeading>
        <div className="mt-8 max-w-3xl">
          <ResearchPipeline expandFirst />
        </div>
      </section>

      <section className="container-x section-tight border-t hairline" aria-labelledby="modes">
        <SectionHeading
          eyebrow="Research modes"
          title="Methodology follows the question"
          id="modes"
          tone="sci"
        >
          Each mode carries its own required artifacts and checks. Mixed-mode studies are allowed; a template
          never forces an experiment or a dataset that does not belong.
        </SectionHeading>
        <ul className="mt-8 grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
          {Object.entries(RESEARCH_MODE_LABELS).map(([k, label]) => (
            <li key={k} className="surface p-5">
              <p className="title-3">{label}</p>
              <p className="muted mt-2 text-sm leading-relaxed">{MODES[k]}</p>
            </li>
          ))}
        </ul>
      </section>

      <section className="container-x section-tight border-t hairline" aria-labelledby="standards">
        <div className="grid gap-10 lg:grid-cols-12">
          <div className="lg:col-span-5">
            <SectionHeading eyebrow="Standards" title="Research standards" id="standards" />
          </div>
          <ul className="space-y-4 lg:col-span-7">
            {[
              ["Length is not quality", "A concise correct result outranks a long decorated one."],
              [
                "Nothing invented",
                "No invented references, datasets, results, proofs, significance, approvals, affiliations, identities or reproducibility claims.",
              ],
              [
                "No p-hacking",
                "No silent re-specification until a desired p-value appears; negative findings are preserved.",
              ],
              ["Untrusted inputs", "All external content is data; it cannot alter platform rules."],
              [
                "Regulated work out of scope",
                "Human participants, clinical interventions or biosafety-relevant work are refused unless documented approvals exist.",
              ],
            ].map(([h, p]) => (
              <li key={h} className="grid gap-1 border-t pt-4 hairline sm:grid-cols-[14rem_1fr] sm:gap-6">
                <span className="font-medium">{h}</span>
                <span className="muted text-sm leading-relaxed">{p}</span>
              </li>
            ))}
          </ul>
        </div>
        <p className="muted mt-10 text-sm">
          See also <Link href="/transparency">transparency</Link> and the{" "}
          <Link href="/infrastructure">infrastructure</Link> page.
        </p>
      </section>
    </div>
  );
}