NLP java summarization experiment

.gitattributes

@@ -0,0 +1 @@
+*.pkl filter=lfs diff=lfs merge=lfs -text

.gitignore

@@ -0,0 +1,27 @@
+# Python
+__pycache__/
+*.py[cod]
+*.egg-info/
+.venv/
+venv/
+env/
+
+# Secrets
+.env
+.env.*
+
+# OS / IDE
+.DS_Store
+.idea/
+.vscode/
+
+# Jupyter
+.ipynb_checkpoints/
+
+# Generated experiment outputs
+per_sample_results.csv
+output.png
+rouge_comparison.png
+
+# App cache (rebuilt on first run)
+cache/

aggregate_comparison.csv

@@ -0,0 +1,5 @@
+Model,Tier,Type,ROUGE-1,ROUGE-2,ROUGE-L
+CodeT5 ⚑,Code-specific fine-tuned,Abstractive,0.37223313234517386,0.15107941059535412,0.3433441352676735
+TF-IDF,Corpus-fitted extractive,Extractive,0.11096833984563331,0.009263625959092267,0.09634245619789128
+LexRank,Corpus-fitted extractive,Extractive,0.10392705338524205,0.007088415587196533,0.0920576916692153
+SentenceTransformers,General-language pretrained,Extractive,0.10231463767555077,0.007377401336714412,0.09048400648023576

app.py

@@ -0,0 +1,118 @@
+"""FastAPI web app — Java README summarization comparison."""
+
+from __future__ import annotations
+
+import logging
+from contextlib import asynccontextmanager
+from fastapi import FastAPI, File, HTTPException, Request, UploadFile
+from fastapi.responses import HTMLResponse, JSONResponse
+from fastapi.staticfiles import StaticFiles
+from fastapi.templating import Jinja2Templates
+
+from engine.pipeline import MODEL_CATALOG, SummarizationPipeline
+
+logging.basicConfig(level=logging.INFO, format="%(levelname)s %(name)s: %(message)s")
+logger = logging.getLogger(__name__)
+
+pipeline = SummarizationPipeline(top_n=5)
+templates = Jinja2Templates(directory="templates")
+
+
+@asynccontextmanager
+async def lifespan(_: FastAPI):
+    logger.info("Starting model load (first run may download datasets and weights) ...")
+    try:
+        pipeline.load()
+    except Exception as exc:
+        logger.error("Startup load failed: %s", exc)
+    yield
+
+
+app = FastAPI(
+    title="Auto-README Java Summarizer",
+    description="Compare four summarization models on Java source files.",
+    lifespan=lifespan,
+)
+app.mount("/static", StaticFiles(directory="static"), name="static")
+
+
+@app.get("/", response_class=HTMLResponse)
+async def index(request: Request):
+    return templates.TemplateResponse(
+        request=request,
+        name="index.html",
+        context={
+            "models": MODEL_CATALOG,
+            "ready": pipeline.ready,
+            "loading": pipeline.loading,
+            "error": pipeline.error,
+        },
+    )
+
+
+@app.get("/api/health")
+async def health():
+    return {
+        "ready": pipeline.ready,
+        "loading": pipeline.loading,
+        "error": pipeline.error,
+        "models": MODEL_CATALOG,
+    }
+
+
+@app.post("/api/summarize")
+async def summarize(file: UploadFile = File(...)):
+    if not pipeline.ready:
+        if pipeline.loading:
+            raise HTTPException(status_code=503, detail="Models are still loading. Try again shortly.")
+        raise HTTPException(
+            status_code=503,
+            detail=pipeline.error or "Models failed to load. Check server logs.",
+        )
+
+    filename = file.filename or "upload.java"
+    if not filename.lower().endswith(".java"):
+        raise HTTPException(status_code=400, detail="Please upload a .java file.")
+
+    raw = await file.read()
+    try:
+        java_source = raw.decode("utf-8")
+    except UnicodeDecodeError as exc:
+        raise HTTPException(status_code=400, detail="File must be UTF-8 encoded text.") from exc
+
+    if not java_source.strip():
+        raise HTTPException(status_code=400, detail="File is empty.")
+
+    try:
+        result = pipeline.compare(java_source, filename=filename)
+    except ValueError as exc:
+        raise HTTPException(status_code=400, detail=str(exc)) from exc
+    except Exception as exc:
+        logger.exception("Summarization failed")
+        raise HTTPException(status_code=500, detail="Summarization failed.") from exc
+
+    return JSONResponse({
+        "filename": result.filename,
+        "char_count": result.char_count,
+        "token_count": result.token_count,
+        "statement_count": result.statement_count,
+        "method_count": result.method_count,
+        "top_n": result.top_n,
+        "total_elapsed_ms": round(result.total_elapsed_ms, 1),
+        "summaries": [
+            {
+                "model_id": s.model_id,
+                "model": s.model,
+                "tier": s.tier,
+                "approach": s.approach,
+                "accent": s.accent,
+                "summary": s.summary,
+                "elapsed_ms": round(s.elapsed_ms, 1),
+                "methods": [
+                    {"name": m.name, "summary": m.summary}
+                    for m in s.methods
+                ],
+            }
+            for s in result.summaries
+        ],
+    })

engine/__init__.py

@@ -0,0 +1 @@
+

engine/models.py

@@ -0,0 +1,195 @@
+"""Summarization models — ported from readme_summarization_experiment.ipynb."""
+
+from __future__ import annotations
+
+import math
+import re
+from collections import Counter, defaultdict
+
+import numpy as np
+import torch
+from huggingface_hub import hf_hub_download
+from sentence_transformers import SentenceTransformer
+from tokenizers import ByteLevelBPETokenizer
+from transformers import AutoModelForSeq2SeqLM
+
+from engine.preprocessing import tokenize
+
+
+class TFIDFModel:
+    """Extractive summarizer using TF-IDF sentence scoring."""
+
+    def __init__(self) -> None:
+        self.idf: dict[str, float] = {}
+        self.N = 0
+
+    def fit(self, corpus: list[str]) -> TFIDFModel:
+        n = len(corpus)
+        df: dict[str, int] = defaultdict(int)
+        for sent in corpus:
+            for term in set(tokenize(sent)):
+                df[term] += 1
+        self.idf = {
+            term: math.log((n + 1) / (freq + 1)) + 1
+            for term, freq in df.items()
+        }
+        self.N = n
+        return self
+
+    def load_idf(self, idf: dict[str, float], n: int) -> TFIDFModel:
+        self.idf = idf
+        self.N = n
+        return self
+
+    def _score(self, sentence: str) -> float:
+        tokens = tokenize(sentence)
+        if not tokens:
+            return 0.0
+        tf = Counter(tokens)
+        return sum(tf[t] / len(tokens) * self.idf.get(t, 1.0) for t in tf)
+
+    def summarize(self, sentences: list[str], top_n: int = 1) -> list[str]:
+        if not sentences:
+            return [""]
+        scored = sorted(sentences, key=self._score, reverse=True)
+        return scored[:top_n]
+
+
+class LexRankModel:
+    """Graph-based extractive summarizer (LexRank)."""
+
+    THRESHOLD = 0.1
+    DAMPING = 0.85
+    MAX_ITER = 100
+    TOL = 1e-6
+
+    def __init__(self) -> None:
+        self.idf: dict[str, float] = {}
+
+    def fit(self, corpus: list[str]) -> LexRankModel:
+        n = len(corpus)
+        df: dict[str, int] = defaultdict(int)
+        for sent in corpus:
+            for term in set(tokenize(sent)):
+                df[term] += 1
+        self.idf = {
+            term: math.log((n + 1) / (freq + 1)) + 1
+            for term, freq in df.items()
+        }
+        return self
+
+    def load_idf(self, idf: dict[str, float]) -> LexRankModel:
+        self.idf = idf
+        return self
+
+    def _tfidf_vec(self, sentence: str) -> dict[str, float]:
+        tokens = tokenize(sentence)
+        if not tokens:
+            return {}
+        tf = Counter(tokens)
+        return {t: (tf[t] / len(tokens)) * self.idf.get(t, 1.0) for t in tf}
+
+    @staticmethod
+    def _cosine(a: dict[str, float], b: dict[str, float]) -> float:
+        common = set(a) & set(b)
+        if not common:
+            return 0.0
+        dot = sum(a[t] * b[t] for t in common)
+        norm_a = math.sqrt(sum(v ** 2 for v in a.values()))
+        norm_b = math.sqrt(sum(v ** 2 for v in b.values()))
+        if norm_a == 0 or norm_b == 0:
+            return 0.0
+        return dot / (norm_a * norm_b)
+
+    def _pagerank(self, matrix: np.ndarray) -> np.ndarray:
+        n = len(matrix)
+        row_sums = matrix.sum(axis=1, keepdims=True)
+        row_sums[row_sums == 0] = 1
+        p = matrix / row_sums
+        scores = np.ones(n) / n
+        for _ in range(self.MAX_ITER):
+            new_scores = (1 - self.DAMPING) / n + self.DAMPING * p.T @ scores
+            if np.abs(new_scores - scores).sum() < self.TOL:
+                break
+            scores = new_scores
+        return scores
+
+    def summarize(self, sentences: list[str], top_n: int = 1) -> list[str]:
+        if len(sentences) == 1:
+            return sentences[:top_n]
+        vecs = [self._tfidf_vec(s) for s in sentences]
+        n = len(sentences)
+        sim = np.zeros((n, n))
+        for i in range(n):
+            for j in range(i + 1, n):
+                c = self._cosine(vecs[i], vecs[j])
+                if c >= self.THRESHOLD:
+                    sim[i, j] = sim[j, i] = c
+        if sim.sum() == 0:
+            scored = sorted(range(n), key=lambda i: sum(vecs[i].values()), reverse=True)
+            return [sentences[i] for i in scored[:top_n]]
+        scores = self._pagerank(sim)
+        ranked = np.argsort(scores)[::-1]
+        return [sentences[i] for i in ranked[:top_n]]
+
+
+class SentenceTransformerModel:
+    """Extractive summarizer using frozen sentence embeddings."""
+
+    def __init__(self, model_name: str = "all-MiniLM-L6-v2") -> None:
+        self.model = SentenceTransformer(model_name)
+
+    def summarize(self, sentences: list[str], top_n: int = 1) -> list[str]:
+        if not sentences:
+            return [""]
+        embeddings = self.model.encode(sentences, convert_to_numpy=True)
+        centroid = embeddings.mean(axis=0)
+        norms = np.linalg.norm(embeddings, axis=1, keepdims=True)
+        norms[norms == 0] = 1
+        sims = (embeddings / norms) @ (centroid / (np.linalg.norm(centroid) + 1e-9))
+        ranked = np.argsort(sims)[::-1]
+        return [sentences[i] for i in ranked[:top_n]]
+
+
+class CodeT5Model:
+    """Abstractive summarizer using CodeT5 fine-tuned on Java."""
+
+    MODEL_NAME = "Salesforce/codet5-base-codexglue-sum-java"
+    VOCAB_REPO = "Salesforce/codet5-base"
+    _SPECIAL_TOKENS = ("<pad>", "<s>", "</s>", "<unk>", "<mask>")
+
+    def __init__(self) -> None:
+        vocab_file = hf_hub_download(self.VOCAB_REPO, "vocab.json")
+        merges_file = hf_hub_download(self.VOCAB_REPO, "merges.txt")
+        self.tokenizer = ByteLevelBPETokenizer(vocab_file, merges_file)
+        self.model = AutoModelForSeq2SeqLM.from_pretrained(self.MODEL_NAME)
+        self.device = "cuda" if torch.cuda.is_available() else "cpu"
+        self.model.to(self.device)
+        self.model.eval()
+
+    def _clean(self, text: str) -> str:
+        for tok in self._SPECIAL_TOKENS:
+            text = text.replace(tok, " ")
+        text = re.sub(r"<extra_id_\d+>", " ", text)
+        return re.sub(r"\s+", " ", text).strip()
+
+    def summarize(self, raw_code: str) -> str:
+        if not raw_code or not raw_code.strip():
+            return ""
+
+        ids = self.tokenizer.encode(raw_code).ids[:256]
+        input_ids = torch.tensor([ids], device=self.device)
+        attention = torch.ones_like(input_ids)
+
+        with torch.no_grad():
+            output_ids = self.model.generate(
+                input_ids=input_ids,
+                attention_mask=attention,
+                max_new_tokens=48,
+                num_beams=4,
+                early_stopping=True,
+                no_repeat_ngram_size=3,
+            )
+
+        decoded = self.tokenizer.decode(output_ids[0].tolist(), skip_special_tokens=False)
+        return self._clean(decoded)

engine/pipeline.py

@@ -0,0 +1,278 @@
+"""Load models once and run four-way Java summarization comparisons."""
+
+from __future__ import annotations
+
+import logging
+import pickle
+import time
+from dataclasses import dataclass
+from pathlib import Path
+
+from datasets import concatenate_datasets, load_dataset
+
+from engine.models import CodeT5Model, LexRankModel, SentenceTransformerModel, TFIDFModel
+from engine.preprocessing import split_code_statements, split_java_methods
+
+logger = logging.getLogger(__name__)
+
+CACHE_DIR = Path(__file__).resolve().parent.parent / "cache"
+IDF_CACHE = CACHE_DIR / "idf_weights_train_val.pkl"
+DATASET = "google/code_x_glue_ct_code_to_text"
+FIT_SPLITS = ("train", "validation")
+
+
+@dataclass
+class MethodSummary:
+    name: str
+    summary: str
+
+
+@dataclass
+class ModelSummary:
+    model_id: str
+    model: str
+    tier: str
+    approach: str
+    accent: str
+    summary: str
+    elapsed_ms: float
+    methods: list[MethodSummary]
+
+
+@dataclass
+class ComparisonResult:
+    filename: str
+    char_count: int
+    token_count: int
+    statement_count: int
+    method_count: int
+    top_n: int
+    summaries: list[ModelSummary]
+    total_elapsed_ms: float
+
+
+MODEL_CATALOG = [
+    {
+        "id": "tfidf",
+        "name": "TF-IDF",
+        "glyph": "TF",
+        "accent": "#2dd4bf",
+        "family": "Statistical · Bag-of-words",
+        "tier": "Corpus-fitted extractive",
+        "approach": "Extractive",
+        "input": "Statement fragments",
+        "checkpoint": None,
+        "description": "Scores each code statement by TF-IDF using IDF weights fitted on the CodeXGLUE Java train + validation corpus.",
+        "tagline": "Picks statements packed with rare, high-signal terms.",
+        "steps": [
+            "Fit inverse-document-frequency (IDF) weights over the Java train + validation corpus.",
+            "Tokenize each statement: split identifiers, lowercase, drop stopwords.",
+            "Score every statement as the sum of term-frequency x IDF.",
+            "Return the top-N highest-scoring statements as the summary.",
+        ],
+        "strengths": ["Fast and fully offline", "Interpretable scores", "No GPU required"],
+        "limitations": ["Output is code-like, not prose", "Ignores word order and context"],
+        "speed": "Instant",
+    },
+    {
+        "id": "lexrank",
+        "name": "LexRank",
+        "glyph": "LR",
+        "accent": "#38bdf8",
+        "family": "Graph · Centrality",
+        "tier": "Corpus-fitted extractive",
+        "approach": "Extractive",
+        "input": "Statement fragments",
+        "checkpoint": None,
+        "description": "Builds a similarity graph over statements and runs PageRank to pick the most central fragments.",
+        "tagline": "Selects statements most representative of the whole file.",
+        "steps": [
+            "Build a TF-IDF vector for each statement using shared corpus IDF.",
+            "Compute pairwise cosine similarity to form a statement graph.",
+            "Threshold weak edges, then run PageRank over the graph.",
+            "Return the most central (highest-ranked) statements.",
+        ],
+        "strengths": ["Captures redundancy / centrality", "Offline and interpretable", "Robust on longer files"],
+        "limitations": ["Needs several statements to rank", "Still extractive, not generative"],
+        "speed": "Fast",
+    },
+    {
+        "id": "sentence_transformers",
+        "name": "SentenceTransformers",
+        "glyph": "ST",
+        "accent": "#a78bfa",
+        "family": "Neural · Sentence embeddings",
+        "tier": "General-language pretrained",
+        "approach": "Extractive",
+        "input": "Statement fragments",
+        "checkpoint": "sentence-transformers/all-MiniLM-L6-v2",
+        "description": "Encodes statements with all-MiniLM-L6-v2 and selects those closest to the centroid embedding.",
+        "tagline": "Uses semantic meaning to find the most central statements.",
+        "steps": [
+            "Embed each statement with the all-MiniLM-L6-v2 transformer.",
+            "Average the embeddings into a single centroid vector.",
+            "Rank statements by cosine similarity to the centroid.",
+            "Return the statements closest to the semantic center.",
+        ],
+        "strengths": ["Understands English semantics", "Order-aware encoder", "No corpus fitting needed"],
+        "limitations": ["Pretrained on prose, not code", "Heavier than TF-IDF/LexRank"],
+        "speed": "Moderate",
+    },
+    {
+        "id": "codet5",
+        "name": "CodeT5",
+        "glyph": "T5",
+        "accent": "#f59e0b",
+        "family": "Transformer · Seq2seq",
+        "tier": "Code-specific fine-tuned",
+        "approach": "Abstractive",
+        "input": "Per-method Java source (256-token window each)",
+        "checkpoint": "Salesforce/codet5-base-codexglue-sum-java",
+        "description": "Generates natural-language summaries from raw Java source using a CodeT5 checkpoint fine-tuned on CodeXGLUE.",
+        "tagline": "Writes a fresh English sentence describing the code.",
+        "steps": [
+            "Split the file into individual Java methods.",
+            "Byte-level BPE tokenize each method (first 256 tokens).",
+            "Decode with beam search — one English sentence per method, same as evaluation.",
+            "Show each method summary separately in the results view.",
+        ],
+        "strengths": ["True natural-language output", "Fine-tuned on Java code-comment pairs", "Best quality summaries"],
+        "limitations": ["Slow on CPU", "256-token input limit", "Can hallucinate details"],
+        "speed": "Slowest",
+    },
+]
+
+
+class SummarizationPipeline:
+    def __init__(self, top_n: int = 5) -> None:
+        self.top_n = top_n
+        self.ready = False
+        self.loading = False
+        self.error: str | None = None
+        self.tfidf: TFIDFModel | None = None
+        self.lexrank: LexRankModel | None = None
+        self.st_model: SentenceTransformerModel | None = None
+        self.codet5: CodeT5Model | None = None
+
+    def load(self) -> None:
+        if self.ready or self.loading:
+            return
+        self.loading = True
+        self.error = None
+        try:
+            idf, n = self._load_or_build_idf()
+            logger.info("Fitting TF-IDF and LexRank from cached IDF (%d terms)", len(idf))
+            self.tfidf = TFIDFModel().load_idf(idf, n)
+            self.lexrank = LexRankModel().load_idf(idf)
+
+            logger.info("Loading SentenceTransformers ...")
+            self.st_model = SentenceTransformerModel()
+
+            logger.info("Loading CodeT5 ...")
+            self.codet5 = CodeT5Model()
+
+            self.ready = True
+            logger.info("Pipeline ready.")
+        except Exception as exc:
+            self.error = str(exc)
+            logger.exception("Failed to load summarization pipeline")
+            raise
+        finally:
+            self.loading = False
+
+    def _load_or_build_idf(self) -> tuple[dict[str, float], int]:
+        CACHE_DIR.mkdir(parents=True, exist_ok=True)
+        if IDF_CACHE.exists():
+            logger.info("Loading IDF cache from %s", IDF_CACHE)
+            with IDF_CACHE.open("rb") as f:
+                payload = pickle.load(f)
+            return payload["idf"], payload["N"]
+
+        logger.info("Building IDF from %s (%s) ...", DATASET, " + ".join(FIT_SPLITS))
+        dataset = load_dataset(DATASET, "java")
+        fit_data = concatenate_datasets([dataset[split] for split in FIT_SPLITS])
+        fit_corpus: list[str] = []
+        for row in fit_data:
+            fit_corpus.extend(split_code_statements(row["code"]))
+
+        tfidf = TFIDFModel().fit(fit_corpus)
+        with IDF_CACHE.open("wb") as f:
+            pickle.dump({"idf": tfidf.idf, "N": tfidf.N}, f)
+        logger.info(
+            "Cached IDF weights (%d terms, %d statements from %d methods)",
+            len(tfidf.idf),
+            len(fit_corpus),
+            len(fit_data),
+        )
+        return tfidf.idf, tfidf.N
+
+    def compare(self, java_source: str, filename: str = "upload.java") -> ComparisonResult:
+        if not self.ready:
+            raise RuntimeError("Pipeline is not ready. Call load() first.")
+
+        source = java_source.strip()
+        if not source:
+            raise ValueError("Java source is empty.")
+
+        statements = split_code_statements(source)
+        java_methods = split_java_methods(source)
+        summaries: list[ModelSummary] = []
+        t_total = time.perf_counter()
+        catalog_by_id = {m["id"]: m for m in MODEL_CATALOG}
+
+        extractive_runners = [
+            ("tfidf", lambda: " ".join(self.tfidf.summarize(statements, self.top_n))),
+            ("lexrank", lambda: " ".join(self.lexrank.summarize(statements, self.top_n))),
+            (
+                "sentence_transformers",
+                lambda: " ".join(self.st_model.summarize(statements, self.top_n)),
+            ),
+        ]
+
+        for model_id, run in extractive_runners:
+            meta = catalog_by_id[model_id]
+            t0 = time.perf_counter()
+            text = run()
+            summaries.append(ModelSummary(
+                model_id=model_id,
+                model=meta["name"],
+                tier=meta["tier"],
+                approach=meta["approach"],
+                accent=meta["accent"],
+                summary=text,
+                elapsed_ms=(time.perf_counter() - t0) * 1000,
+                methods=[],
+            ))
+
+        codet5_meta = catalog_by_id["codet5"]
+        t0 = time.perf_counter()
+        codet5_methods: list[MethodSummary] = []
+        for method in java_methods:
+            codet5_methods.append(MethodSummary(
+                name=method["name"],
+                summary=self.codet5.summarize(method["code"]),
+            ))
+        codet5_combined = "\n".join(
+            m.summary.strip() for m in codet5_methods if m.summary.strip()
+        )
+        summaries.append(ModelSummary(
+            model_id="codet5",
+            model=codet5_meta["name"],
+            tier=codet5_meta["tier"],
+            approach=codet5_meta["approach"],
+            accent=codet5_meta["accent"],
+            summary=codet5_combined,
+            elapsed_ms=(time.perf_counter() - t0) * 1000,
+            methods=codet5_methods,
+        ))
+
+        return ComparisonResult(
+            filename=filename,
+            char_count=len(source),
+            token_count=len(source.split()),
+            statement_count=len(statements),
+            method_count=len(java_methods),
+            top_n=self.top_n,
+            summaries=summaries,
+            total_elapsed_ms=(time.perf_counter() - t_total) * 1000,
+        )

engine/preprocessing.py

@@ -0,0 +1,134 @@
+from __future__ import annotations
+
+import re
+
+MIN_FRAGMENT_TOKENS = 3
+
+STOPWORDS = {
+    "public", "private", "protected", "void", "new", "null", "int", "string",
+    "static", "final", "return", "class", "this", "super", "true", "false",
+    "boolean", "long", "double", "float", "byte", "char", "short", "object",
+    "list", "map", "set", "if", "else", "for", "while", "do", "try", "catch",
+    "finally", "throw", "throws", "import", "package", "extends", "implements",
+    "instanceof", "interface", "abstract", "synchronized", "volatile",
+    "a", "an", "the", "and", "or", "but", "in", "on", "at", "to", "of",
+    "is", "are", "was", "were", "be", "been", "being", "have", "has", "had",
+    "do", "does", "did", "will", "would", "could", "should", "may", "might",
+    "it", "its", "with", "for", "not", "by", "from", "as", "that", "this",
+    "which", "who", "when", "where", "how", "all", "each", "both", "more",
+    "s", "e",
+}
+
+_SUBWORD_RE = re.compile(r"[A-Z]+(?=[A-Z][a-z])|[A-Z]?[a-z]+|[A-Z]+|\d+")
+
+
+def split_identifier(token: str) -> list[str]:
+    out: list[str] = []
+    for part in re.split(r"[_\s]+", token):
+        out.extend(_SUBWORD_RE.findall(part))
+    return [w.lower() for w in out if w]
+
+
+def tokenize(text: str) -> list[str]:
+    """Sub-tokenize identifiers, lowercase, and drop stopwords."""
+    toks: list[str] = []
+    for raw in text.split():
+        for sub in split_identifier(raw):
+            if sub and sub not in STOPWORDS:
+                toks.append(sub)
+    return toks
+
+
+_METHOD_HEAD = re.compile(
+    r"(?m)^[ \t]*"
+    r"(?:@(?:\w+\.)*\w+(?:\([^)]*\))?\s+)*"
+    r"(?:(?:public|private|protected)\s+)?"
+    r"(?:static\s+)?(?:final\s+)?(?:synchronized\s+)?"
+    r"(?:<[^>]+>\s+)?"
+    r"[\w\[\]<>,.\s?]+\s+"
+    r"(\w+)\s*"
+    r"\(",
+)
+
+_NON_METHOD_NAMES = frozenset({
+    "if", "for", "while", "switch", "catch", "do", "try", "else", "return", "new",
+})
+
+
+def split_java_methods(code: str) -> list[dict[str, str]]:
+    source = code.strip()
+    if not source:
+        return []
+
+    spans: list[tuple[int, int, str]] = []
+
+    for match in _METHOD_HEAD.finditer(source):
+        name = match.group(1)
+        if name in _NON_METHOD_NAMES:
+            continue
+
+        start = match.start()
+        brace_start = source.find("{", match.end())
+        if brace_start == -1:
+            continue
+
+        header = source[match.end():brace_start]
+        if ";" in header.split("//", 1)[0]:
+            continue
+
+        depth = 0
+        end = brace_start
+        for idx in range(brace_start, len(source)):
+            ch = source[idx]
+            if ch == "{":
+                depth += 1
+            elif ch == "}":
+                depth -= 1
+                if depth == 0:
+                    end = idx + 1
+                    break
+        else:
+            continue
+
+        if any(start < existing_end and end > existing_start for existing_start, existing_end, _ in spans):
+            continue
+
+        spans.append((start, end, name))
+
+    spans.sort(key=lambda item: item[0])
+
+    methods = [
+        {"name": name, "code": source[start:end].strip()}
+        for start, end, name in spans
+    ]
+
+    if methods:
+        return methods
+
+    return [{"name": "(entire file)", "code": source}]
+
+
+def format_method_summaries(parts: list[tuple[str, str]]) -> str:
+    lines: list[str] = []
+    for name, text in parts:
+        cleaned = text.strip()
+        if cleaned:
+            lines.append(f"• {name}: {cleaned}")
+        else:
+            lines.append(f"• {name}: (no output)")
+    return "\n".join(lines)
+
+
+def split_code_statements(code: str) -> list[str]:
+    parts = re.split(r"[;{}\n]", code)
+    frags = [re.sub(r"\s+", " ", p).strip() for p in parts]
+    frags = [f for f in frags if f]
+
+    merged: list[str] = []
+    for frag in frags:
+        if len(frag.split()) < MIN_FRAGMENT_TOKENS and merged:
+            merged[-1] += " " + frag
+        else:
+            merged.append(frag)
+
+    return merged if merged else [re.sub(r"\s+", " ", code).strip()]

requirements.txt

@@ -0,0 +1,11 @@
+fastapi>=0.110.0
+uvicorn[standard]>=0.27.0
+python-multipart>=0.0.9
+jinja2>=3.1.0
+datasets>=2.18.0
+sentence-transformers>=2.6.0
+transformers>=4.38.0
+torch>=2.1.0
+numpy>=1.24.0
+huggingface-hub>=0.21.0
+tokenizers>=0.15.0

samples/UserService.java

@@ -0,0 +1,45 @@
+package com.example.service;
+
+import java.util.HashMap;
+import java.util.Map;
+import java.util.Optional;
+
+/**
+ * Manages user accounts: lookup, registration, and password updates.
+ */
+public class UserService {
+
+    private final Map<String, String> usersByEmail = new HashMap<>();
+
+    public Optional<String> findUserIdByEmail(String email) {
+        if (email == null || email.isBlank()) {
+            return Optional.empty();
+        }
+        String normalized = email.trim().toLowerCase();
+        return Optional.ofNullable(usersByEmail.get(normalized));
+    }
+
+    public boolean registerUser(String email, String userId) {
+        if (email == null || userId == null || email.isBlank() || userId.isBlank()) {
+            return false;
+        }
+        String normalized = email.trim().toLowerCase();
+        if (usersByEmail.containsKey(normalized)) {
+            return false;
+        }
+        usersByEmail.put(normalized, userId);
+        return true;
+    }
+
+    public boolean updatePassword(String email, String newPasswordHash) {
+        if (email == null || newPasswordHash == null || newPasswordHash.isBlank()) {
+            return false;
+        }
+        String normalized = email.trim().toLowerCase();
+        if (!usersByEmail.containsKey(normalized)) {
+            return false;
+        }
+        // In a real app this would persist to a credential store.
+        return true;
+    }
+}

static/css/style.css

@@ -0,0 +1,825 @@
+:root {
+  --bg: #07090f;
+  --bg-2: #0c1018;
+  --surface: rgba(20, 27, 41, 0.72);
+  --surface-solid: #141b29;
+  --surface-2: rgba(33, 43, 64, 0.6);
+  --border: rgba(120, 140, 180, 0.16);
+  --border-strong: rgba(120, 140, 180, 0.32);
+  --text: #eef3fb;
+  --muted: #93a4c2;
+  --faint: #64748b;
+  --accent: #5b9cff;
+  --accent-2: #8b5cff;
+  --extractive: #2dd4bf;
+  --abstractive: #f59e0b;
+  --good: #34d399;
+  --warn: #fbbf24;
+  --error: #f87171;
+  --radius: 16px;
+  --radius-sm: 10px;
+  --shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
+  --shadow-sm: 0 8px 24px rgba(0, 0, 0, 0.3);
+  --font: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
+  --mono: "JetBrains Mono", ui-monospace, "SF Mono", monospace;
+}
+
+* { box-sizing: border-box; }
+
+html { scroll-behavior: smooth; scroll-padding-top: 90px; }
+
+body {
+  margin: 0;
+  font-family: var(--font);
+  background: var(--bg);
+  color: var(--text);
+  line-height: 1.65;
+  overflow-x: hidden;
+  -webkit-font-smoothing: antialiased;
+}
+
+a { color: inherit; }
+
+code {
+  font-family: var(--mono);
+  font-size: 0.85em;
+  background: rgba(120, 140, 180, 0.14);
+  padding: 0.12em 0.4em;
+  border-radius: 5px;
+  border: 1px solid var(--border);
+}
+
+.container { width: min(1180px, 92vw); margin: 0 auto; }
+
+/* ---------- Animated background ---------- */
+.bg-aurora {
+  position: fixed;
+  inset: 0;
+  z-index: -1;
+  overflow: hidden;
+  background: radial-gradient(120% 80% at 50% -10%, #11182b 0%, var(--bg) 60%);
+}
+
+.blob {
+  position: absolute;
+  border-radius: 50%;
+  filter: blur(80px);
+  opacity: 0.5;
+  animation: drift 22s ease-in-out infinite;
+}
+
+.blob-1 { width: 460px; height: 460px; background: #2b5cff; top: -120px; left: -80px; }
+.blob-2 { width: 520px; height: 520px; background: #7c3aed; top: 10%; right: -160px; animation-delay: -6s; }
+.blob-3 { width: 420px; height: 420px; background: #0ea5a4; bottom: -160px; left: 30%; animation-delay: -12s; }
+
+@keyframes drift {
+  0%, 100% { transform: translate(0, 0) scale(1); }
+  33% { transform: translate(40px, 50px) scale(1.08); }
+  66% { transform: translate(-30px, 20px) scale(0.95); }
+}
+
+.grid-overlay {
+  position: absolute;
+  inset: 0;
+  background-image:
+    linear-gradient(rgba(120, 140, 180, 0.05) 1px, transparent 1px),
+    linear-gradient(90deg, rgba(120, 140, 180, 0.05) 1px, transparent 1px);
+  background-size: 46px 46px;
+  mask-image: radial-gradient(circle at 50% 30%, black, transparent 80%);
+}
+
+/* ---------- Header ---------- */
+.site-header {
+  position: sticky;
+  top: 0;
+  z-index: 50;
+  border-bottom: 1px solid transparent;
+  transition: background 0.3s, border-color 0.3s, backdrop-filter 0.3s;
+}
+
+.site-header.scrolled {
+  background: rgba(7, 9, 15, 0.78);
+  backdrop-filter: blur(16px);
+  border-bottom-color: var(--border);
+}
+
+.header-inner {
+  display: flex;
+  align-items: center;
+  gap: 1.5rem;
+  padding: 0.9rem 0;
+}
+
+.brand {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+  flex: 1;
+  text-decoration: none;
+}
+
+.brand-icon {
+  display: grid;
+  place-items: center;
+  width: 42px;
+  height: 42px;
+  border-radius: 11px;
+  font-family: var(--mono);
+  font-weight: 700;
+  font-size: 0.85rem;
+  color: white;
+  background: linear-gradient(135deg, var(--accent), var(--accent-2));
+  box-shadow: 0 6px 20px rgba(91, 156, 255, 0.4);
+}
+
+.brand h1 { margin: 0; font-size: 1.1rem; letter-spacing: -0.01em; }
+.brand p { margin: 0; color: var(--muted); font-size: 0.8rem; }
+
+.nav { display: flex; gap: 0.4rem; }
+
+.nav-link {
+  position: relative;
+  color: var(--muted);
+  text-decoration: none;
+  font-size: 0.9rem;
+  font-weight: 500;
+  padding: 0.4rem 0.85rem;
+  border-radius: 8px;
+  transition: color 0.2s, background 0.2s;
+}
+
+.nav-link:hover { color: var(--text); background: var(--surface-2); }
+.nav-link.active { color: var(--text); }
+.nav-link.active::after {
+  content: "";
+  position: absolute;
+  left: 0.85rem;
+  right: 0.85rem;
+  bottom: 0.1rem;
+  height: 2px;
+  border-radius: 2px;
+  background: linear-gradient(90deg, var(--accent), var(--accent-2));
+}
+
+.status-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.5rem;
+  font-size: 0.8rem;
+  font-weight: 500;
+  padding: 0.4rem 0.8rem;
+  border-radius: 999px;
+  border: 1px solid var(--border);
+  color: var(--muted);
+  background: var(--surface);
+}
+
+.status-dot {
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background: var(--faint);
+}
+
+.status-badge.ready { color: var(--good); border-color: rgba(52, 211, 153, 0.4); }
+.status-badge.ready .status-dot { background: var(--good); box-shadow: 0 0 10px var(--good); }
+.status-badge.loading { color: var(--abstractive); border-color: rgba(245, 158, 11, 0.4); }
+.status-badge.loading .status-dot { background: var(--abstractive); animation: pulse 1.2s ease-in-out infinite; }
+.status-badge.error { color: var(--error); border-color: rgba(248, 113, 113, 0.4); }
+.status-badge.error .status-dot { background: var(--error); }
+
+@keyframes pulse {
+  0%, 100% { opacity: 1; transform: scale(1); }
+  50% { opacity: 0.4; transform: scale(0.7); }
+}
+
+/* ---------- Hero ---------- */
+.hero { padding: 5rem 0 3rem; }
+
+.hero-content { max-width: 760px; }
+
+.eyebrow {
+  display: inline-block;
+  font-size: 0.72rem;
+  letter-spacing: 0.22em;
+  font-weight: 600;
+  color: var(--accent);
+  padding: 0.35rem 0.8rem;
+  border: 1px solid var(--border-strong);
+  border-radius: 999px;
+  background: var(--surface);
+  margin-bottom: 1.5rem;
+}
+
+.hero-title {
+  margin: 0 0 1.25rem;
+  font-size: clamp(2.3rem, 6vw, 4rem);
+  line-height: 1.05;
+  letter-spacing: -0.03em;
+  font-weight: 800;
+}
+
+.gradient-text {
+  display: block;
+  background: linear-gradient(110deg, #5b9cff, #8b5cff 45%, #2dd4bf);
+  -webkit-background-clip: text;
+  background-clip: text;
+  color: transparent;
+}
+
+.hero-sub {
+  font-size: 1.1rem;
+  color: var(--muted);
+  max-width: 60ch;
+  margin: 0 0 2rem;
+}
+
+.hero-actions { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: 2.75rem; }
+
+.hero-stats { display: flex; gap: 2.5rem; }
+
+.stat { display: flex; flex-direction: column; }
+.stat-num {
+  font-size: 1.8rem;
+  font-weight: 800;
+  background: linear-gradient(135deg, var(--text), var(--muted));
+  -webkit-background-clip: text;
+  background-clip: text;
+  color: transparent;
+}
+.stat-label { font-size: 0.82rem; color: var(--faint); text-transform: uppercase; letter-spacing: 0.1em; }
+
+/* ---------- Buttons ---------- */
+.btn {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.5rem;
+  padding: 0.75rem 1.5rem;
+  border-radius: 10px;
+  border: 1px solid transparent;
+  font-size: 0.95rem;
+  font-weight: 600;
+  font-family: inherit;
+  cursor: pointer;
+  text-decoration: none;
+  transition: transform 0.18s, box-shadow 0.18s, background 0.18s, border-color 0.18s;
+}
+
+.btn.primary {
+  background: linear-gradient(135deg, var(--accent), var(--accent-2));
+  color: white;
+  box-shadow: 0 10px 30px rgba(91, 156, 255, 0.35);
+}
+.btn.primary:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 16px 40px rgba(91, 156, 255, 0.5); }
+.btn.primary:disabled { opacity: 0.45; cursor: not-allowed; box-shadow: none; }
+
+.btn.ghost {
+  background: var(--surface);
+  border-color: var(--border-strong);
+  color: var(--text);
+}
+.btn.ghost:hover { background: var(--surface-2); transform: translateY(-2px); }
+
+/* ---------- Sections ---------- */
+.section { padding: 4rem 0; }
+
+.section-head { max-width: 720px; margin-bottom: 2.75rem; }
+
+.section-kicker {
+  font-size: 0.78rem;
+  font-weight: 600;
+  letter-spacing: 0.16em;
+  color: var(--accent);
+  text-transform: uppercase;
+}
+
+.section-head h2 {
+  margin: 0.6rem 0 0.75rem;
+  font-size: clamp(1.7rem, 3.5vw, 2.4rem);
+  letter-spacing: -0.02em;
+  font-weight: 700;
+}
+
+.section-lead { color: var(--muted); font-size: 1.05rem; margin: 0; }
+
+/* ---------- Pipeline diagram ---------- */
+.pipeline {
+  display: flex;
+  align-items: stretch;
+  gap: 0.5rem;
+  padding: 2rem 1.5rem;
+  margin-bottom: 2.5rem;
+  background: var(--surface);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  box-shadow: var(--shadow-sm);
+  backdrop-filter: blur(12px);
+  overflow-x: auto;
+}
+
+.pipe-stage { display: flex; align-items: center; justify-content: center; }
+.pipe-stage.models-fan { flex-direction: column; gap: 0.6rem; }
+
+.pipe-node {
+  position: relative;
+  text-align: center;
+  padding: 1rem 1.1rem;
+  border-radius: var(--radius-sm);
+  border: 1px solid var(--border-strong);
+  background: var(--surface-solid);
+  min-width: 130px;
+  transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
+}
+.pipe-node:hover { transform: translateY(-4px); box-shadow: var(--shadow-sm); }
+.pipe-node h4 { margin: 0.5rem 0 0.2rem; font-size: 0.95rem; }
+.pipe-node p { margin: 0; font-size: 0.78rem; color: var(--muted); }
+.pipe-icon { font-size: 1.4rem; }
+
+.pipe-node.input { border-color: rgba(91, 156, 255, 0.5); }
+.pipe-node.process { border-color: rgba(147, 164, 194, 0.5); }
+.pipe-node.output { border-color: rgba(52, 211, 153, 0.5); }
+
+.pipe-node.model {
+  display: flex;
+  align-items: center;
+  gap: 0.7rem;
+  text-align: left;
+  padding: 0.6rem 0.9rem;
+  min-width: 200px;
+}
+.pipe-node.model h4 { margin: 0; }
+.pipe-node.model.extractive { border-left: 3px solid var(--extractive); }
+.pipe-node.model.abstractive { border-left: 3px solid var(--abstractive); }
+
+.model-glyph {
+  display: grid;
+  place-items: center;
+  width: 34px;
+  height: 34px;
+  border-radius: 9px;
+  font-family: var(--mono);
+  font-weight: 700;
+  font-size: 0.8rem;
+  color: var(--c, var(--accent));
+  background: color-mix(in srgb, var(--c, var(--accent)) 16%, transparent);
+  border: 1px solid color-mix(in srgb, var(--c, var(--accent)) 40%, transparent);
+  flex-shrink: 0;
+}
+
+.pipe-connector {
+  display: flex;
+  align-items: center;
+  min-width: 36px;
+  flex-shrink: 0;
+}
+.pipe-connector span {
+  flex: 1;
+  height: 2px;
+  background: linear-gradient(90deg, transparent, var(--border-strong), transparent);
+  position: relative;
+}
+.pipe-connector span::after {
+  content: "›";
+  position: absolute;
+  right: -2px;
+  top: 50%;
+  transform: translateY(-50%);
+  color: var(--muted);
+  font-size: 1.1rem;
+}
+
+/* ---------- Arch cards ---------- */
+.arch-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+  gap: 1.2rem;
+}
+
+.arch-card {
+  position: relative;
+  background: var(--surface);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  padding: 1.6rem;
+  backdrop-filter: blur(12px);
+  transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
+}
+.arch-card:hover { transform: translateY(-4px); border-color: var(--border-strong); box-shadow: var(--shadow-sm); }
+
+.arch-card-icon {
+  display: grid;
+  place-items: center;
+  width: 40px;
+  height: 40px;
+  border-radius: 10px;
+  font-size: 1.1rem;
+  font-weight: 700;
+  margin-bottom: 1rem;
+  color: var(--accent);
+  background: rgba(91, 156, 255, 0.12);
+  border: 1px solid rgba(91, 156, 255, 0.3);
+}
+
+.arch-card h3 { margin: 0 0 0.75rem; font-size: 1.1rem; }
+.arch-card ul { margin: 0; padding-left: 1.1rem; color: var(--muted); font-size: 0.92rem; }
+.arch-card li { margin-bottom: 0.4rem; }
+
+/* ---------- Model cards ---------- */
+.model-cards {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
+  gap: 1.4rem;
+}
+
+.model-card {
+  position: relative;
+  background: var(--surface);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  padding: 1.5rem;
+  backdrop-filter: blur(12px);
+  overflow: hidden;
+  transition: transform 0.2s, border-color 0.2s, box-shadow 0.2s;
+}
+.model-card::before {
+  content: "";
+  position: absolute;
+  inset: 0 0 auto 0;
+  height: 3px;
+  background: var(--accent);
+}
+.model-card:hover {
+  transform: translateY(-5px);
+  border-color: color-mix(in srgb, var(--accent) 45%, transparent);
+  box-shadow: 0 20px 50px color-mix(in srgb, var(--accent) 18%, transparent);
+}
+.model-card.open { border-color: color-mix(in srgb, var(--accent) 50%, transparent); }
+
+.model-card-head {
+  display: flex;
+  align-items: center;
+  gap: 0.9rem;
+  width: 100%;
+  background: none;
+  border: none;
+  padding: 0;
+  cursor: pointer;
+  color: inherit;
+  font-family: inherit;
+  text-align: left;
+}
+
+.model-card-head .model-glyph { width: 46px; height: 46px; font-size: 1rem; }
+.model-card-titles { flex: 1; }
+.model-card-titles h3 { margin: 0; font-size: 1.25rem; letter-spacing: -0.01em; }
+.model-family { font-size: 0.8rem; color: var(--faint); }
+
+.model-chevron {
+  font-size: 1.3rem;
+  color: var(--muted);
+  transition: transform 0.3s;
+  line-height: 1;
+}
+.model-card.open .model-chevron { transform: rotate(180deg); }
+
+.model-card-meta { display: flex; flex-wrap: wrap; gap: 0.45rem; margin: 1rem 0 0.85rem; }
+
+.model-tagline { margin: 0; color: var(--text); font-size: 0.95rem; font-weight: 500; }
+
+.tag {
+  display: inline-flex;
+  align-items: center;
+  font-size: 0.72rem;
+  font-weight: 600;
+  padding: 0.25rem 0.6rem;
+  border-radius: 999px;
+  border: 1px solid var(--border);
+  background: var(--surface-2);
+  color: var(--muted);
+  white-space: nowrap;
+}
+.tag-extractive { color: var(--extractive); border-color: rgba(45, 212, 191, 0.4); background: rgba(45, 212, 191, 0.08); }
+.tag-abstractive { color: var(--abstractive); border-color: rgba(245, 158, 11, 0.4); background: rgba(245, 158, 11, 0.08); }
+
+/* expandable body */
+.model-card-body {
+  display: grid;
+  grid-template-rows: 0fr;
+  transition: grid-template-rows 0.35s ease, opacity 0.3s, margin 0.3s;
+  opacity: 0;
+  margin-top: 0;
+}
+.model-card-body > * { overflow: hidden; min-height: 0; }
+.model-card.open .model-card-body {
+  grid-template-rows: 1fr;
+  opacity: 1;
+  margin-top: 1.25rem;
+}
+
+.model-desc { margin: 0 0 1.2rem; color: var(--muted); font-size: 0.92rem; }
+
+.model-section { margin-bottom: 1.2rem; }
+.model-section h4 {
+  margin: 0 0 0.7rem;
+  font-size: 0.78rem;
+  letter-spacing: 0.08em;
+  text-transform: uppercase;
+  color: var(--muted);
+}
+.model-section h4.good { color: var(--good); }
+.model-section h4.warn { color: var(--warn); }
+
+.model-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.6rem; }
+.model-steps li { display: flex; gap: 0.7rem; align-items: flex-start; font-size: 0.9rem; color: var(--text); }
+.step-num {
+  display: grid;
+  place-items: center;
+  width: 22px;
+  height: 22px;
+  flex-shrink: 0;
+  border-radius: 6px;
+  font-size: 0.72rem;
+  font-weight: 700;
+  font-family: var(--mono);
+  color: var(--accent);
+  background: color-mix(in srgb, var(--accent) 14%, transparent);
+  border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
+}
+
+.model-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
+
+.pill-list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.4rem; }
+.pill {
+  font-size: 0.78rem;
+  padding: 0.28rem 0.6rem;
+  border-radius: 7px;
+  border: 1px solid var(--border);
+  background: var(--surface-2);
+  color: var(--muted);
+}
+.pill.good { border-color: rgba(52, 211, 153, 0.3); }
+.pill.warn { border-color: rgba(251, 191, 36, 0.3); }
+
+.model-facts {
+  margin: 1.2rem 0 0;
+  padding-top: 1.1rem;
+  border-top: 1px solid var(--border);
+  display: flex;
+  flex-direction: column;
+  gap: 0.6rem;
+}
+.model-facts > div { display: flex; gap: 0.75rem; align-items: baseline; }
+.model-facts dt { font-size: 0.78rem; color: var(--faint); min-width: 84px; text-transform: uppercase; letter-spacing: 0.06em; }
+.model-facts dd { margin: 0; font-size: 0.88rem; color: var(--text); word-break: break-word; }
+
+/* ---------- Try-it ---------- */
+.try-panel {
+  background: var(--surface);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  padding: 1.75rem;
+  backdrop-filter: blur(12px);
+  box-shadow: var(--shadow-sm);
+}
+
+.upload-zone { display: flex; flex-direction: column; gap: 1.1rem; }
+
+.upload-inner {
+  border: 2px dashed var(--border-strong);
+  border-radius: var(--radius);
+  padding: 3rem 1.5rem;
+  text-align: center;
+  cursor: pointer;
+  transition: border-color 0.2s, background 0.2s, transform 0.2s;
+}
+.upload-inner:hover, .upload-inner.dragover {
+  border-color: var(--accent);
+  background: rgba(91, 156, 255, 0.06);
+}
+.upload-inner.dragover { transform: scale(1.01); }
+
+.upload-icon {
+  display: inline-grid;
+  place-items: center;
+  width: 56px;
+  height: 56px;
+  margin-bottom: 0.75rem;
+  font-size: 1.6rem;
+  border-radius: 50%;
+  color: var(--accent);
+  background: rgba(91, 156, 255, 0.1);
+  border: 1px solid rgba(91, 156, 255, 0.3);
+}
+.upload-title { margin: 0 0 0.3rem; font-size: 1.05rem; font-weight: 600; }
+
+.upload-bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
+
+.file-meta {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.5rem;
+  padding: 0.55rem 0.9rem;
+  background: var(--surface-2);
+  border: 1px solid var(--border);
+  border-radius: 9px;
+  font-size: 0.88rem;
+  font-family: var(--mono);
+}
+.file-meta::before { content: "📄"; }
+
+/* loader */
+.loading { margin-top: 1.5rem; color: var(--muted); text-align: center; }
+.loader-track {
+  height: 4px;
+  width: 100%;
+  border-radius: 4px;
+  background: var(--surface-2);
+  overflow: hidden;
+  margin-bottom: 0.85rem;
+}
+.loader-bar {
+  height: 100%;
+  width: 40%;
+  border-radius: 4px;
+  background: linear-gradient(90deg, var(--accent), var(--accent-2));
+  animation: indeterminate 1.3s ease-in-out infinite;
+}
+@keyframes indeterminate {
+  0% { margin-left: -40%; }
+  100% { margin-left: 100%; }
+}
+
+.alert { padding: 0.9rem 1.1rem; border-radius: 10px; margin-top: 1.25rem; font-size: 0.92rem; }
+.alert.error { background: rgba(248, 113, 113, 0.12); border: 1px solid rgba(248, 113, 113, 0.4); color: var(--error); }
+
+/* results */
+.results { margin-top: 1.75rem; }
+.results-meta {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.6rem;
+  margin-bottom: 1.25rem;
+}
+.results-meta .chip {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.4rem;
+  padding: 0.45rem 0.85rem;
+  background: var(--surface-2);
+  border: 1px solid var(--border);
+  border-radius: 9px;
+  font-size: 0.85rem;
+}
+.results-meta .chip strong { color: var(--muted); font-weight: 600; }
+
+.results-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
+  gap: 1.2rem;
+}
+
+.result-card {
+  position: relative;
+  background: var(--surface-solid);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  padding: 1.35rem;
+  display: flex;
+  flex-direction: column;
+  gap: 0.9rem;
+  transition: transform 0.2s, box-shadow 0.2s;
+  animation: cardIn 0.45s ease both;
+}
+.result-card::before {
+  content: "";
+  position: absolute;
+  inset: 0 0 auto 0;
+  height: 3px;
+  border-radius: var(--radius) var(--radius) 0 0;
+  background: var(--accent, var(--accent));
+}
+.result-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-sm); }
+
+@keyframes cardIn {
+  from { opacity: 0; transform: translateY(14px); }
+  to { opacity: 1; transform: translateY(0); }
+}
+
+.result-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 0.5rem; }
+.result-header-left { display: flex; align-items: center; gap: 0.7rem; }
+.result-header h3 { margin: 0; font-size: 1.05rem; }
+.result-tier { font-size: 0.75rem; color: var(--faint); }
+
+.result-body {
+  font-size: 0.92rem;
+  line-height: 1.6;
+  white-space: pre-wrap;
+  word-break: break-word;
+  flex: 1;
+  color: var(--text);
+  font-family: var(--mono);
+  background: var(--bg-2);
+  border: 1px solid var(--border);
+  border-radius: var(--radius-sm);
+  padding: 0.85rem;
+  max-height: 240px;
+  overflow-y: auto;
+}
+.result-body.empty { color: var(--faint); font-style: italic; }
+.result-body.method-list {
+  font-family: var(--font);
+  display: flex;
+  flex-direction: column;
+  gap: 0.65rem;
+  max-height: 320px;
+}
+.method-summary {
+  border-left: 2px solid var(--accent, var(--border));
+  padding-left: 0.65rem;
+}
+.method-summary.empty-method .method-text {
+  color: var(--faint);
+  font-style: italic;
+}
+.method-name {
+  font-size: 0.78rem;
+  font-weight: 600;
+  color: var(--accent, var(--muted));
+  font-family: var(--mono);
+  margin-bottom: 0.2rem;
+}
+.method-text {
+  font-size: 0.88rem;
+  line-height: 1.5;
+  color: var(--text);
+}
+
+.result-footer { display: flex; justify-content: space-between; align-items: center; }
+.result-latency {
+  font-size: 0.78rem;
+  color: var(--muted);
+  font-family: var(--mono);
+  display: inline-flex;
+  align-items: center;
+  gap: 0.35rem;
+}
+.result-badge {
+  font-size: 0.7rem;
+  font-weight: 600;
+  padding: 0.2rem 0.55rem;
+  border-radius: 999px;
+}
+.result-badge.fastest { color: var(--good); background: rgba(52, 211, 153, 0.12); border: 1px solid rgba(52, 211, 153, 0.35); }
+.result-badge.longest { color: var(--accent); background: rgba(91, 156, 255, 0.12); border: 1px solid rgba(91, 156, 255, 0.35); }
+
+.copy-btn {
+  background: var(--surface-2);
+  border: 1px solid var(--border);
+  color: var(--muted);
+  font-size: 0.75rem;
+  padding: 0.3rem 0.6rem;
+  border-radius: 7px;
+  cursor: pointer;
+  transition: color 0.2s, border-color 0.2s;
+  font-family: inherit;
+}
+.copy-btn:hover { color: var(--text); border-color: var(--border-strong); }
+.copy-btn.copied { color: var(--good); border-color: rgba(52, 211, 153, 0.4); }
+
+/* ---------- Footer ---------- */
+.site-footer {
+  margin-top: 3rem;
+  padding: 2.5rem 0;
+  text-align: center;
+  color: var(--faint);
+  font-size: 0.85rem;
+  border-top: 1px solid var(--border);
+}
+
+/* ---------- Reveal animation ---------- */
+.reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.6s ease, transform 0.6s ease; }
+.reveal.in { opacity: 1; transform: translateY(0); }
+
+.hidden { display: none !important; }
+
+/* ---------- Responsive ---------- */
+@media (max-width: 860px) {
+  .nav { display: none; }
+  .pipeline { flex-direction: column; align-items: stretch; }
+  .pipe-connector { min-height: 28px; justify-content: center; }
+  .pipe-connector span { width: 2px; height: auto; min-height: 24px; background: linear-gradient(180deg, transparent, var(--border-strong), transparent); }
+  .pipe-connector span::after { content: "⌄"; right: 50%; transform: translateX(50%); top: auto; bottom: -4px; }
+  .pipe-stage.models-fan { flex-direction: column; }
+}
+
+@media (max-width: 560px) {
+  .hero-stats { gap: 1.5rem; }
+  .model-cols { grid-template-columns: 1fr; }
+  .upload-bar { flex-direction: column; align-items: stretch; }
+  .btn.primary { justify-content: center; }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after { animation-duration: 0.001s !important; transition-duration: 0.001s !important; }
+  .reveal { opacity: 1; transform: none; }
+}

static/js/app.js

@@ -0,0 +1,286 @@
+const docBody = document.body;
+window.APP_STATE = {
+  ready: docBody.dataset.appReady === "true",
+  loading: docBody.dataset.appLoading === "true",
+  error: docBody.dataset.appError || null,
+};
+
+const form = document.getElementById("upload-form");
+const fileInput = document.getElementById("file-input");
+const dropZone = document.getElementById("drop-zone");
+const fileMeta = document.getElementById("file-meta");
+const submitBtn = document.getElementById("submit-btn");
+const loadingEl = document.getElementById("loading");
+const errorEl = document.getElementById("error");
+const resultsEl = document.getElementById("results");
+const resultsMeta = document.getElementById("results-meta");
+const resultsGrid = document.getElementById("results-grid");
+const statusBadge = document.getElementById("status-badge");
+const header = document.querySelector(".site-header");
+
+let selectedFile = null;
+
+/* ---------- Header shadow on scroll ---------- */
+function onScroll() {
+  if (window.scrollY > 10) header.classList.add("scrolled");
+  else header.classList.remove("scrolled");
+}
+window.addEventListener("scroll", onScroll, { passive: true });
+onScroll();
+
+/* ---------- Scroll reveal ---------- */
+const revealObserver = new IntersectionObserver(
+  (entries) => {
+    entries.forEach((entry) => {
+      if (entry.isIntersecting) {
+        entry.target.classList.add("in");
+        revealObserver.unobserve(entry.target);
+      }
+    });
+  },
+  { threshold: 0.12 }
+);
+document.querySelectorAll(".reveal").forEach((el) => revealObserver.observe(el));
+
+/* ---------- Active nav link on scroll ---------- */
+const navLinks = Array.from(document.querySelectorAll(".nav-link"));
+const sections = navLinks
+  .map((link) => document.querySelector(link.getAttribute("href")))
+  .filter(Boolean);
+
+const navObserver = new IntersectionObserver(
+  (entries) => {
+    entries.forEach((entry) => {
+      if (entry.isIntersecting) {
+        const id = entry.target.getAttribute("id");
+        navLinks.forEach((l) =>
+          l.classList.toggle("active", l.getAttribute("href") === `#${id}`)
+        );
+      }
+    });
+  },
+  { rootMargin: "-45% 0px -50% 0px" }
+);
+sections.forEach((s) => navObserver.observe(s));
+
+/* ---------- Expandable model cards ---------- */
+document.querySelectorAll(".model-card-head").forEach((head) => {
+  head.addEventListener("click", () => {
+    const card = head.closest(".model-card");
+    const open = card.classList.toggle("open");
+    head.setAttribute("aria-expanded", String(open));
+  });
+});
+
+/* ---------- Upload helpers ---------- */
+function setError(message) {
+  if (!message) {
+    errorEl.classList.add("hidden");
+    errorEl.textContent = "";
+    return;
+  }
+  errorEl.textContent = message;
+  errorEl.classList.remove("hidden");
+}
+
+function updateFileMeta(file) {
+  selectedFile = file;
+  fileMeta.textContent = `${file.name} · ${(file.size / 1024).toFixed(1)} KB`;
+  fileMeta.classList.remove("hidden");
+  submitBtn.disabled = !window.APP_STATE.ready;
+}
+
+dropZone.addEventListener("click", () => fileInput.click());
+
+dropZone.addEventListener("dragover", (e) => {
+  e.preventDefault();
+  dropZone.classList.add("dragover");
+});
+dropZone.addEventListener("dragleave", () => dropZone.classList.remove("dragover"));
+dropZone.addEventListener("drop", (e) => {
+  e.preventDefault();
+  dropZone.classList.remove("dragover");
+  const file = e.dataTransfer.files[0];
+  if (file) updateFileMeta(file);
+});
+
+fileInput.addEventListener("change", () => {
+  if (fileInput.files[0]) updateFileMeta(fileInput.files[0]);
+});
+
+/* ---------- Submit ---------- */
+form.addEventListener("submit", async (e) => {
+  e.preventDefault();
+  if (!selectedFile) return;
+
+  if (!window.APP_STATE.ready) {
+    setError("Models are not ready yet. Please wait for startup to finish.");
+    return;
+  }
+
+  setError("");
+  resultsEl.classList.add("hidden");
+  loadingEl.classList.remove("hidden");
+  submitBtn.disabled = true;
+
+  const payload = new FormData();
+  payload.append("file", selectedFile);
+
+  try {
+    const res = await fetch("/api/summarize", { method: "POST", body: payload });
+    const data = await res.json();
+    if (!res.ok) throw new Error(data.detail || "Summarization failed.");
+    renderResults(data);
+    resultsEl.classList.remove("hidden");
+    resultsEl.scrollIntoView({ behavior: "smooth", block: "nearest" });
+  } catch (err) {
+    setError(err.message);
+  } finally {
+    loadingEl.classList.add("hidden");
+    submitBtn.disabled = !window.APP_STATE.ready;
+  }
+});
+
+/* ---------- Render results ---------- */
+function renderResults(data) {
+  resultsMeta.innerHTML = [
+    ["File", data.filename],
+    ["Methods", data.method_count],
+    ["Statements", data.statement_count],
+    ["Tokens", data.token_count],
+    ["Total time", `${data.total_elapsed_ms} ms`],
+  ]
+    .map(([k, v]) => `<span class="chip"><strong>${k}:</strong> ${escapeHtml(String(v))}</span>`)
+    .join("");
+
+  const summaries = data.summaries;
+  const withText = summaries.filter((s) => s.summary && s.summary.trim());
+  const fastest = summaries.reduce((a, b) => (b.elapsed_ms < a.elapsed_ms ? b : a));
+  const longest = withText.reduce(
+    (a, b) => (b.summary.length > (a ? a.summary.length : -1) ? b : a),
+    null
+  );
+
+  resultsGrid.innerHTML = summaries
+    .map((s, i) => {
+      const accent = s.accent || "#5b9cff";
+      const isEmpty = !s.summary || !s.summary.trim();
+      const badges = [];
+      if (s === fastest) badges.push(`<span class="result-badge fastest">⚡ Fastest</span>`);
+      if (longest && s === longest) badges.push(`<span class="result-badge longest">Most detail</span>`);
+
+      const isCodet5 = s.model_id === "codet5" && s.methods && s.methods.length > 0;
+      const bodyHtml = isEmpty
+        ? "(no output produced)"
+        : isCodet5
+          ? renderMethodSummaries(s.methods)
+          : escapeHtml(s.summary);
+      const bodyClass = isEmpty ? "empty" : isCodet5 ? "method-list" : "";
+
+      return `
+        <article class="result-card" style="--accent:${accent}; animation-delay:${i * 70}ms">
+          <div class="result-header">
+            <div class="result-header-left">
+              <span class="model-glyph" style="--c:${accent}">${escapeHtml(glyphFor(s.model_id, s.model))}</span>
+              <div>
+                <h3>${escapeHtml(s.model)}</h3>
+                <div class="result-tier">${escapeHtml(s.tier)}</div>
+              </div>
+            </div>
+            <span class="tag tag-${s.approach.toLowerCase()}">${escapeHtml(s.approach)}</span>
+          </div>
+          <div class="result-body ${bodyClass}">${bodyHtml}</div>
+          <div class="result-footer">
+            <span class="result-latency">⏱ ${s.elapsed_ms} ms ${badges.join(" ")}</span>
+            <button class="copy-btn" type="button" ${isEmpty ? "disabled" : ""}>Copy</button>
+          </div>
+        </article>
+      `;
+    })
+    .join("");
+
+  resultsGrid.querySelectorAll(".copy-btn").forEach((btn, idx) => {
+    btn.addEventListener("click", () => {
+      const text = summaries[idx].summary || "";
+      navigator.clipboard.writeText(text).then(() => {
+        btn.textContent = "Copied";
+        btn.classList.add("copied");
+        setTimeout(() => {
+          btn.textContent = "Copy";
+          btn.classList.remove("copied");
+        }, 1600);
+      });
+    });
+  });
+}
+
+function renderMethodSummaries(methods) {
+  if (!methods.length) return "";
+  return methods
+    .map((m) => {
+      const text = (m.summary || "").trim();
+      const summaryText = text || "(no output)";
+      const emptyClass = text ? "" : " empty-method";
+      return `
+        <div class="method-summary${emptyClass}">
+          <div class="method-name">${escapeHtml(m.name)}</div>
+          <div class="method-text">${escapeHtml(summaryText)}</div>
+        </div>
+      `;
+    })
+    .join("");
+}
+
+function glyphFor(id, name) {
+  const map = {
+    tfidf: "TF",
+    lexrank: "LR",
+    sentence_transformers: "ST",
+    codet5: "T5",
+  };
+  return map[id] || (name || "?").slice(0, 2).toUpperCase();
+}
+
+function escapeHtml(text) {
+  return text
+    .replace(/&/g, "&amp;")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/"/g, "&quot;");
+}
+
+/* ---------- Health polling ---------- */
+function setStatus(state, text) {
+  statusBadge.className = `status-badge ${state}`;
+  statusBadge.querySelector(".status-text").textContent = text;
+}
+
+async function pollHealth() {
+  try {
+    const res = await fetch("/api/health");
+    const data = await res.json();
+    window.APP_STATE.ready = data.ready;
+    window.APP_STATE.loading = data.loading;
+    window.APP_STATE.error = data.error;
+
+    if (data.ready) {
+      setStatus("ready", "Models ready");
+      if (selectedFile) submitBtn.disabled = false;
+    } else if (data.loading) {
+      setStatus("loading", "Loading models…");
+    } else {
+      setStatus("error", data.error ? "Load failed" : "Not ready");
+      if (data.error) setError(data.error);
+    }
+
+    if (!data.ready && !data.error) setTimeout(pollHealth, 3000);
+  } catch {
+    setTimeout(pollHealth, 5000);
+  }
+}
+
+if (!window.APP_STATE.ready) {
+  pollHealth();
+} else if (selectedFile) {
+  submitBtn.disabled = false;
+}

templates/index.html

@@ -0,0 +1,281 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>Auto-README — Java Summarizer</title>
+  <link rel="preconnect" href="https://fonts.googleapis.com" />
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />
+  <link rel="stylesheet" href="/static/css/style.css" />
+</head>
+<body
+  data-app-ready="{{ 'true' if ready else 'false' }}"
+  data-app-loading="{{ 'true' if loading else 'false' }}"
+  data-app-error="{{ error|e if error else '' }}"
+>
+  <div class="bg-aurora" aria-hidden="true">
+    <span class="blob blob-1"></span>
+    <span class="blob blob-2"></span>
+    <span class="blob blob-3"></span>
+    <span class="grid-overlay"></span>
+  </div>
+
+  <header class="site-header">
+    <div class="container header-inner">
+      <a class="brand" href="#top">
+        <span class="brand-icon">&lt;/&gt;</span>
+        <div>
+          <h1>Code Summarization</h1>
+          <p>Java code summarization comparison</p>
+        </div>
+      </a>
+      <nav class="nav" id="primary-nav">
+        <a href="#architecture" class="nav-link">Architecture</a>
+        <a href="#models" class="nav-link">Models</a>
+        <a href="#try-it" class="nav-link">Try it</a>
+      </nav>
+      <div id="status-badge" class="status-badge {% if ready %}ready{% elif loading %}loading{% else %}error{% endif %}">
+        <span class="status-dot"></span>
+        <span class="status-text">{% if ready %}Models ready{% elif loading %}Loading models…{% else %}Not ready{% endif %}</span>
+      </div>
+    </div>
+  </header>
+
+  <main id="top">
+    <section class="hero container">
+      <div class="hero-content reveal">
+        <span class="eyebrow">NLP · CODE SUMMARIZATION</span>
+        <h2 class="hero-title">
+          Four ways to summarize
+          <span class="gradient-text">Java source code</span>
+        </h2>
+        <p class="hero-sub">
+          Upload a <code>.java</code> file and watch corpus-fitted extractive baselines,
+          a semantic embedding model, and a fine-tuned transformer each generate a
+          java code summary, compared live side by side.
+        </p>
+        <div class="hero-actions">
+          <a href="#try-it" class="btn primary">Try it now</a>
+          <a href="#architecture" class="btn ghost">See how it works</a>
+        </div>
+        <div class="hero-stats">
+          <div class="stat"><span class="stat-num">4</span><span class="stat-label">models</span></div>
+          <div class="stat"><span class="stat-num">live</span><span class="stat-label">inference</span></div>
+        </div>
+      </div>
+    </section>
+
+    <section id="architecture" class="container section">
+      <div class="section-head reveal">
+        <span class="section-kicker">01 — Architecture</span>
+        <h2>How a file becomes four summaries</h2>
+        <p class="section-lead">
+          Extractive models summarize the whole file from split statements. CodeT5 runs
+          once per Java method, the same setup used in the CodeXGLUE evaluation.
+        </p>
+      </div>
+
+      <div class="pipeline reveal">
+        <div class="pipe-stage" data-stage="1">
+          <div class="pipe-node input">
+            <span class="pipe-icon">{ }</span>
+            <h4>Java upload</h4>
+            <p>A single <code>.java</code> file</p>
+          </div>
+        </div>
+
+        <div class="pipe-connector"><span></span></div>
+
+        <div class="pipe-stage" data-stage="2">
+          <div class="pipe-node process">
+            <span class="pipe-icon">⛓</span>
+            <h4>Preprocess</h4>
+            <p>Split statements; CodeT5 splits by method</p>
+          </div>
+        </div>
+
+        <div class="pipe-connector fan"><span></span></div>
+
+        <div class="pipe-stage models-fan" data-stage="3">
+          <div class="pipe-node model extractive">
+            <span class="model-glyph" style="--c:#2dd4bf">TF</span>
+            <h4>TF-IDF</h4>
+            <p>Term scoring</p>
+          </div>
+          <div class="pipe-node model extractive">
+            <span class="model-glyph" style="--c:#38bdf8">LR</span>
+            <h4>LexRank</h4>
+            <p>Graph centrality</p>
+          </div>
+          <div class="pipe-node model extractive">
+            <span class="model-glyph" style="--c:#a78bfa">ST</span>
+            <h4>Sentence-T</h4>
+            <p>Embeddings</p>
+          </div>
+          <div class="pipe-node model abstractive">
+            <span class="model-glyph" style="--c:#f59e0b">T5</span>
+            <h4>CodeT5</h4>
+            <p>Generation</p>
+          </div>
+        </div>
+
+        <div class="pipe-connector fan-in"><span></span></div>
+
+        <div class="pipe-stage" data-stage="4">
+          <div class="pipe-node output">
+            <span class="pipe-icon">▦</span>
+            <h4>Summary</h4>
+            <p>Four summaries</p>
+          </div>
+        </div>
+      </div>
+
+      <div class="arch-grid">
+        <article class="arch-card reveal">
+          <div class="arch-card-icon">①</div>
+          <h3>Preprocessing</h3>
+          <ul>
+            <li>Split on <code>;</code> <code>{</code> <code>}</code> and newlines</li>
+            <li>Merge tiny fragments (&lt; 3 tokens)</li>
+            <li>CamelCase / snake_case identifier splitting</li>
+            <li>Java keyword + English stopword filtering</li>
+          </ul>
+        </article>
+        <article class="arch-card reveal">
+          <div class="arch-card-icon">②</div>
+          <h3>Corpus fitting</h3>
+          <ul>
+            <li>TF-IDF &amp; LexRank IDF from CodeXGLUE Java train + validation</li>
+            <li>Weights cached to <code>cache/idf_weights_train_val.pkl</code></li>
+            <li>Neural models use frozen pretrained checkpoints</li>
+            <li>One-time load, then served from memory</li>
+          </ul>
+        </article>
+        <article class="arch-card reveal">
+          <div class="arch-card-icon">③</div>
+          <h3>Output</h3>
+          <ul>
+            <li>Extractive models return top-N statements from the whole file</li>
+            <li>CodeT5 generates one English sentence per method (evaluation setup)</li>
+            <li>Per-model latency tracked for each run</li>
+            <li>Results compared in a single view</li>
+          </ul>
+        </article>
+      </div>
+    </section>
+
+    <section id="models" class="container section">
+      <div class="section-head reveal">
+        <span class="section-kicker">02 — Models</span>
+        <h2>The four summarizers</h2>
+        <p class="section-lead">
+          Each model represents a different tier of prior knowledge. Click a card to expand
+          its step-by-step algorithm, strengths, and limitations.
+        </p>
+      </div>
+
+      <div class="model-cards">
+        {% for m in models %}
+        <article class="model-card reveal {{ m.approach|lower }}" style="--accent: {{ m.accent }}" data-model="{{ m.id }}">
+          <button class="model-card-head" aria-expanded="false">
+            <span class="model-glyph" style="--c: {{ m.accent }}">{{ m.glyph }}</span>
+            <div class="model-card-titles">
+              <h3>{{ m.name }}</h3>
+              <span class="model-family">{{ m.family }}</span>
+            </div>
+            <span class="model-chevron" aria-hidden="true">⌄</span>
+          </button>
+
+          <div class="model-card-meta">
+            <span class="tag tag-{{ m.approach|lower }}">{{ m.approach }}</span>
+            <span class="tag tag-tier">{{ m.tier }}</span>
+            <span class="tag tag-speed">{{ m.speed }}</span>
+          </div>
+
+          <p class="model-tagline">{{ m.tagline }}</p>
+
+          <div class="model-card-body">
+            <p class="model-desc">{{ m.description }}</p>
+
+            <div class="model-section">
+              <h4>How it works</h4>
+              <ol class="model-steps">
+                {% for step in m.steps %}
+                <li><span class="step-num">{{ loop.index }}</span><span>{{ step }}</span></li>
+                {% endfor %}
+              </ol>
+            </div>
+
+            <div class="model-cols">
+              <div class="model-section">
+                <h4 class="good">Strengths</h4>
+                <ul class="pill-list">
+                  {% for s in m.strengths %}<li class="pill good">{{ s }}</li>{% endfor %}
+                </ul>
+              </div>
+              <div class="model-section">
+                <h4 class="warn">Limitations</h4>
+                <ul class="pill-list">
+                  {% for l in m.limitations %}<li class="pill warn">{{ l }}</li>{% endfor %}
+                </ul>
+              </div>
+            </div>
+
+            <dl class="model-facts">
+              <div><dt>Input</dt><dd>{{ m.input }}</dd></div>
+
+            </dl>
+          </div>
+        </article>
+        {% endfor %}
+      </div>
+    </section>
+
+    <section id="try-it" class="container section">
+      <div class="section-head reveal">
+        <span class="section-kicker">03 — Try it</span>
+        <h2>Summarize your Java file</h2>
+        <p class="section-lead">Upload a <code>.java</code> file. Extractive models use the whole file; CodeT5 summarizes each method separately.</p>
+      </div>
+
+      <div class="try-panel reveal">
+        <form id="upload-form" class="upload-zone" enctype="multipart/form-data">
+          <input type="file" id="file-input" name="file" accept=".java" hidden />
+          <div class="upload-inner" id="drop-zone">
+            <div class="upload-icon">↑</div>
+            <p class="upload-title">Drop a <code>.java</code> file here</p>
+            <p class="muted">or click to browse · UTF-8 text · multi-method classes supported</p>
+          </div>
+          <div class="upload-bar">
+            <div id="file-meta" class="file-meta hidden"></div>
+            <button type="submit" id="submit-btn" class="btn primary" disabled>
+              <span class="btn-label">Generate summaries</span>
+            </button>
+          </div>
+        </form>
+
+        <div id="loading" class="loading hidden">
+          <div class="loader-track">
+            <div class="loader-bar"></div>
+          </div>
+          <p>Running all four models… CodeT5 runs once per method and may take longer on CPU.</p>
+        </div>
+
+        <div id="error" class="alert error hidden"></div>
+
+        <div id="results" class="results hidden">
+          <div class="results-meta" id="results-meta"></div>
+          <div class="results-grid" id="results-grid"></div>
+        </div>
+      </div>
+    </section>
+  </main>
+
+  <footer class="site-footer">
+
+  </footer>
+
+  <script src="/static/js/app.js"></script>
+</body>
+</html>