Interactive results, working priority, fine-tuning mode, honest custom + model lookup

app.py

@@ -27,6 +27,7 @@ from fastapi.staticfiles import StaticFiles
 from pydantic import BaseModel
 
 from engine.real_advisor import advise_real, min_specs
+from engine.finetune import advise_finetune
 from engine.ui_adapter import spec_from_payload
 from model_brick import ask as model_ask
 
@@ -45,12 +46,17 @@ class AdviseIn(BaseModel):
     usecase: str = "chat"
     custom: str = ""
     priority: str = "balanced"
+    focus: str = ""   # a specific model the user clicked — show ITS breakdown
+    mode: str = "run"  # "run" = inference advice; "finetune" = training advice
 
 
 @app.post("/api/advise")
 def api_advise(payload: AdviseIn):
     p = payload.model_dump()
-    return advise_real(p, spec_from_payload(p))
+    spec = spec_from_payload(p)
+    if p.get("mode") == "finetune":
+        return advise_finetune(p, spec)
+    return advise_real(p, spec)
 
 
 class MinSpecsIn(BaseModel):

engine/finetune.py

@@ -0,0 +1,388 @@
+"""
+Fine-tuning mode: "what can I TRAIN on this machine?" — the mirror of the
+inference advisor. Running a model and fine-tuning it have wildly different
+memory costs (a 7B chats in ~5 GB but QLoRA-trains in ~12 GB, LoRA in ~21 GB,
+full fine-tune in ~130 GB), so the honest answer is a different one.
+
+The memory model is deterministic and conservative, mirroring the inference
+engine's philosophy. Per-parameter byte constants and the calibration are
+sourced (see FINETUNE-RESEARCH below); FitCheck deliberately lands at or above
+Unsloth's published VRAM minimums, because most users run the vanilla
+PEFT/TRL/bitsandbytes stack, not Unsloth's memory-optimised kernels.
+
+Sources:
+  - Full FT = 16 bytes/trainable-param (fp16 weight+grad + fp32 master/mom/var):
+    EleutherAI Transformer Math; Google Cloud GPU-memory guide.
+  - QLoRA 4-bit NF4+double-quant base ~= 4.5 bits/param; paged-8bit optimiser on
+    the <1% trainable adapter: Dettmers et al. 2023 (arXiv:2305.14314).
+  - Activation term + gradient-checkpointing divisor calibrated so QLoRA totals
+    sit above Unsloth's requirements table.
+"""
+
+from .hardware import HardwareSpec
+from .real_advisor import (
+    USE_CASES, _SAFETY_FILL, catalogue, _by_use_case, catalogue_date,
+    _C_MODEL, _C_WORK, _VERDICT_WORD,
+)
+
+# Per-parameter core cost (weights + gradients + optimiser state), bytes/param.
+_CORE_BYTES = {"full": 16.0, "lora": 2.0 + 0.16, "qlora": 0.5625 + 0.16}
+_METHOD_PLAIN = {
+    "qlora": "QLoRA (4-bit base + adapters)",
+    "lora": "LoRA (16-bit base + adapters)",
+    "full": "Full fine-tune (all weights)",
+}
+
+
+def estimate_finetune_vram(params_b: float, method: str = "qlora",
+                           seq_len: int = 2048, batch_size: int = 1,
+                           grad_checkpointing: bool = True) -> float:
+    """Conservative PEAK fine-tuning VRAM in GB. Deterministic; depends only on
+    parameter count + a few training knobs. Constants sourced above."""
+    p = max(params_b, 0.0)
+    core_gb = _CORE_BYTES[method] * p       # weights + gradients + optimiser state
+    # Activations scale with model size and tokens (batch x seq), independent of
+    # the PEFT method. 0.6 GB/B at seq=2048, batch=1 WITH gradient checkpointing
+    # is calibrated so QLoRA/LoRA/full totals match the researched anchors and
+    # sit at or above Unsloth's published minimums.
+    act_gb = 0.6 * p * (batch_size * seq_len / 2048.0)
+    if not grad_checkpointing:
+        act_gb *= 4.0                       # checkpointing saves ~5x; baseline assumes it on
+    subtotal = core_gb + act_gb + 0.75      # +0.75 GB framework / CUDA overhead
+    return round(subtotal * 1.20, 1)        # +20% safety buffer (under-promise)
+
+
+# --------------------------------------------------------------------------
+# Non-LLM categories: family-level fine-tune feasibility (researched).
+# These families don't share the LLM QLoRA formula; each has its own tooling
+# and memory floor. Numbers are conservative consumer-hardware minimums.
+# --------------------------------------------------------------------------
+_CATEGORY_FT = {
+    "vision": {
+        "method": "Transfer learning (no LoRA — freeze the backbone)",
+        "min_vram": 8.0,
+        "tools": [
+            {"name": "Ultralytics YOLO", "what": "Fine-tune a pretrained checkpoint on your own images. Use freeze=N to cut memory.",
+             "install": "pip install ultralytics", "tag": "Start here"},
+            {"name": "PyTorch / timm", "what": "Full control for custom vision training.",
+             "install": "pytorch.org", "tag": "Advanced"},
+        ],
+        "commands": [{"label": "Fine-tune YOLO on your dataset",
+                      "code": "yolo detect train model=yolo11n.pt data=mydata.yaml epochs=100 imgsz=640"}],
+        "note": ("Vision models fine-tune by transfer learning from a pretrained checkpoint — "
+                 "there is no LoRA here. The memory lever is <b>freeze=N</b> (freeze the backbone) "
+                 "and a smaller <b>batch</b>. The n/s sizes train on ~8 GB; m/l want 12-16 GB."),
+        "pointer": "https://docs.ultralytics.com/modes/train",
+    },
+    "imagegen": {
+        "method": "LoRA / DreamBooth (the dominant method for diffusion)",
+        "min_vram": 8.0,
+        "tools": [
+            {"name": "kohya_ss", "what": "The community standard GUI/scripts for SD, SDXL and Flux LoRA training.",
+             "install": "github.com/bmaltais/kohya_ss", "tag": "Start here"},
+            {"name": "diffusers", "what": "Hugging Face's training scripts (train_dreambooth_lora_*).",
+             "install": "pip install diffusers", "tag": "Scriptable"},
+            {"name": "OneTrainer", "what": "All-in-one desktop trainer for diffusion models.",
+             "install": "github.com/Nerogar/OneTrainer", "tag": "GUI"},
+        ],
+        "commands": [],
+        "note": ("Diffusion fine-tuning is LoRA-first. <b>SD 1.5</b> LoRA trains from ~6-8 GB, "
+                 "<b>SDXL</b> LoRA wants ~10-12 GB (16-24 comfortable), and <b>Flux</b> needs "
+                 "QLoRA/NF4 to fit ~9-16 GB (full FP16 wants 24 GB). A <i>full</i> fine-tune of "
+                 "SDXL/Flux is datacentre-only (40 GB+)."),
+        "pointer": "https://huggingface.co/docs/diffusers/en/training/lora",
+    },
+    "audio": {
+        "method": "LoRA / PEFT (STT) or full fine-tune (small TTS)",
+        "min_vram": 8.0,
+        "tools": [
+            {"name": "HF Transformers", "what": "Fine-tune Whisper with Seq2SeqTrainer + PEFT (int8 + LoRA).",
+             "install": "pip install transformers peft bitsandbytes", "tag": "Start here"},
+            {"name": "Coqui XTTS", "what": "Voice-cloning / TTS fine-tuning with a Gradio pipeline.",
+             "install": "github.com/idiap/coqui-ai-TTS", "tag": "TTS"},
+        ],
+        "commands": [],
+        "note": ("Whisper fine-tunes with int8 + LoRA in under 8 GB (even large-v2 on a free "
+                 "Colab T4); tiny/base/small train comfortably on consumer GPUs. TTS "
+                 "(SpeechT5, XTTS v2) wants ~12-16 GB."),
+        "pointer": "https://huggingface.co/blog/fine-tune-whisper",
+    },
+    "embed": {
+        "method": "Full fine-tune (these models are small)",
+        "min_vram": 6.0,
+        "tools": [
+            {"name": "sentence-transformers", "what": "Fine-tune embeddings with a few lines (MultipleNegativesRankingLoss).",
+             "install": "pip install sentence-transformers", "tag": "Start here"},
+        ],
+        "commands": [],
+        "note": ("Embedding models are small — most fine-tune fully on ~6 GB. No quantisation "
+                 "or LoRA needed for typical sizes."),
+        "pointer": "https://www.sbert.net/docs/training/overview.html",
+    },
+    "data": {
+        "method": "Full fine-tune / retrain (small models)",
+        "min_vram": 4.0,
+        "tools": [
+            {"name": "Python + the model's library", "what": "Forecasting/tabular models retrain from a small script.",
+             "install": "pip install (see the model card)", "tag": "Start here"},
+        ],
+        "commands": [],
+        "note": "Time-series and tabular models are small and retrain on a CPU or a modest GPU.",
+        "pointer": "",
+    },
+}
+
+
+# --------------------------------------------------------------------------
+# Cloud fallback: when local hardware can't train the model they want.
+# (Prices/limits drift — labelled as guidance, confirmed live at the links.)
+# --------------------------------------------------------------------------
+_CLOUD = [
+    {"name": "Google Colab (free)", "what": "Free T4 (16 GB). Comfortable for 7-9B QLoRA. Open an Unsloth notebook and Run all.",
+     "cost": "Free", "link": "https://unsloth.ai/docs/get-started/unsloth-notebooks"},
+    {"name": "Kaggle (free)", "what": "Free 2x T4 (32 GB total), ~30 GPU-hours/week — more VRAM than Colab free.",
+     "cost": "Free", "link": "https://www.kaggle.com/code"},
+    {"name": "Modal", "what": "Serverless GPUs from a Python script (gpu=\"A100-80GB\"). Per-second billing.",
+     "cost": "~$30/mo free credit", "link": "https://modal.com/docs/examples"},
+    {"name": "RunPod", "what": "Cheapest raw GPU-hours: rent an A100/H100 for a few dollars for a one-off run.",
+     "cost": "From ~$0.34/hr", "link": "https://www.runpod.io/pricing"},
+]
+
+
+def _qlora_command(repo_id: str) -> list[dict]:
+    """The minimal real Unsloth QLoRA recipe + the GGUF export step, so the
+    fine-tuned model can then be run in Ollama / LM Studio."""
+    model = repo_id or "unsloth/Qwen2.5-7B-Instruct"
+    code = (
+        "from unsloth import FastLanguageModel\n"
+        "from trl import SFTTrainer, SFTConfig\n"
+        "from datasets import load_dataset\n\n"
+        f'model, tok = FastLanguageModel.from_pretrained(\n'
+        f'    "{model}", max_seq_length=2048, load_in_4bit=True)   # 4-bit = QLoRA\n'
+        "model = FastLanguageModel.get_peft_model(\n"
+        '    model, r=16, lora_alpha=16, use_gradient_checkpointing="unsloth",\n'
+        '    target_modules=["q_proj","k_proj","v_proj","o_proj",\n'
+        '                    "gate_proj","up_proj","down_proj"])\n'
+        'ds = load_dataset("your/dataset", split="train")   # chat/messages JSONL\n'
+        "SFTTrainer(model=model, tokenizer=tok, train_dataset=ds,\n"
+        "    args=SFTConfig(per_device_train_batch_size=2, gradient_accumulation_steps=8,\n"
+        '        num_train_epochs=1, learning_rate=2e-4, optim="adamw_8bit",\n'
+        '        bf16=True, output_dir="out")).train()'
+    )
+    export = ('model.save_pretrained_gguf("model", tok, quantization_method="q4_k_m")\n'
+              "# then:  ollama create my-model -f Modelfile   (FROM ./model-Q4_K_M.gguf)")
+    return [
+        {"label": "QLoRA fine-tune with Unsloth (lowest VRAM)", "code": code},
+        {"label": "Export to GGUF to run it in Ollama / LM Studio", "code": export},
+    ]
+
+
+def _llm_method_for(params_b: float, spec: HardwareSpec) -> dict:
+    """Pick the lightest fine-tune method that fits, with a verdict."""
+    fast = spec.fast_budget_gb
+    total = spec.total_budget_gb
+    qlora = estimate_finetune_vram(params_b, "qlora")
+    lora = estimate_finetune_vram(params_b, "lora")
+    full = estimate_finetune_vram(params_b, "full")
+    if fast and qlora <= fast * _SAFETY_FILL:
+        # On the GPU. If LoRA also fits, mention it as the higher-quality option.
+        method = "lora" if lora <= fast * _SAFETY_FILL else "qlora"
+        return {"verdict": "great", "method": method, "need": qlora,
+                "qlora": qlora, "lora": lora, "full": full}
+    if qlora <= total * _SAFETY_FILL:
+        # Spills into system RAM via a paged optimiser — works, but slow.
+        return {"verdict": "tight", "method": "qlora", "need": qlora,
+                "qlora": qlora, "lora": lora, "full": full}
+    return {"verdict": "no", "method": "qlora", "need": qlora,
+            "qlora": qlora, "lora": lora, "full": full}
+
+
+def _ft_option(entry: dict, m: dict) -> dict:
+    feel = {"great": "Fits your GPU", "tight": "Works via system RAM — slow",
+            "no": "Too big locally — use the cloud"}[m["verdict"]]
+    return {
+        "verdict": m["verdict"],
+        "model": entry["name"],
+        "desc": entry.get("good_for", ""),
+        "setting": _METHOD_PLAIN[m["method"]],
+        "memory": "Too big" if m["verdict"] == "no" else f"{m['need']:g} GB",
+        "feel": feel,
+        "params_b": entry.get("params_b"),
+        "active_params_b": entry.get("active_params_b"),
+        "url": (entry.get("links") or {}).get("hf") or (entry.get("links") or {}).get("home", ""),
+        "license": entry.get("license", ""),
+        "license_note": entry.get("license_note", ""),
+        "gated": entry.get("gated", False),
+        "run": {}, "provenance": "estimated", "stale": entry.get("stale", False),
+    }
+
+
+def _llm_finetune(uc, candidates, spec, focus) -> dict:
+    fast, total = spec.fast_budget_gb, spec.total_budget_gb
+    evald = [(e, _llm_method_for(e.get("params_b", 1.0), spec)) for e in candidates]
+
+    # Headline = the LARGEST model you can QLoRA locally (great); else largest
+    # that works tight; else the smallest (so we can show the cloud path).
+    great = [(e, m) for e, m in evald if m["verdict"] == "great"]
+    tight = [(e, m) for e, m in evald if m["verdict"] == "tight"]
+
+    def by_params(pair):
+        return pair[0].get("params_b", 0)
+
+    if focus:
+        hit = next((pair for pair in evald
+                    if pair[0]["name"] == focus
+                    or str(pair[0].get("repo_id", "")).lower() == focus.lower()), None)
+        chosen = hit or (max(great, key=by_params) if great else None)
+    else:
+        chosen = (max(great, key=by_params) if great else
+                  max(tight, key=by_params) if tight else
+                  min(evald, key=lambda pr: pr[1]["need"]) if evald else None)
+
+    options = [_ft_option(e, m) for e, m in evald]
+    repo = ""
+    if chosen:
+        e, m = chosen
+        repo = e.get("repo_id", "")
+        hv, need = m["verdict"], m["need"]
+        if hv == "great":
+            head = f"Yes — you can fine-tune {e['name']} on your machine."
+            detail = (
+                f"The honest pick for training is <b>{e['name']}</b> with "
+                f"<b>{_METHOD_PLAIN[m['method']]}</b>. It needs about <b>{need:g} GB</b> of GPU "
+                f"memory (you have ~<b>{fast:g} GB</b> on the fast path). For reference the same "
+                f"model is ~{m['lora']:g} GB with 16-bit LoRA and ~{m['full']:g} GB for a full "
+                f"fine-tune — which is why QLoRA is the consumer answer."
+            )
+        elif hv == "tight":
+            head = f"Sort of — {e['name']} will fine-tune, but it spills into system RAM."
+            detail = (
+                f"<b>{e['name']}</b> needs about <b>{need:g} GB</b> for QLoRA, more than your "
+                f"~<b>{fast:g} GB</b> of GPU memory. A paged optimiser can borrow ordinary RAM "
+                f"(you have ~{total:g} GB total) so it runs, but slowly. A bigger GPU — or a free "
+                f"cloud notebook — would make this comfortable."
+            )
+        else:
+            head = f"Training is a stretch on this machine — here's the honest path."
+            biggest_local = max((p for p in evald if p[1]["verdict"] != "no"),
+                                key=by_params, default=None)
+            local_line = (f"Locally you can comfortably QLoRA up to <b>{biggest_local[0]['name']}</b>. "
+                          if biggest_local else "This machine has no GPU fast path for training. ")
+            detail = (
+                f"{e['name']} needs about <b>{need:g} GB</b> to QLoRA, beyond what this machine "
+                f"offers. {local_line}For anything bigger, a rented or free cloud GPU is the cheapest "
+                f"path — see the options below."
+            )
+        scale = max(fast or total, need, 1) * 1.05
+        gauge = {
+            "need_gb": f"{need:g} GB needed to train",
+            "fast_gb": f"{fast:g} GB", "total_gb": f"{total:g} GB",
+            "fill_pct": round(min(need / scale, 1.0) * 100, 1),
+            "mark_pct": round(min((fast or total) / scale, 1.0) * 100, 1),
+            "breakdown": [
+                {"label": f"4-bit base {round(e.get('params_b',1)*0.5625,1):g} GB", "color": _C_MODEL},
+                {"label": f"Adapters, optimiser & activations {round(need - e.get('params_b',1)*0.5625,1):g} GB", "color": _C_WORK},
+            ],
+        }
+        commands = {"intro": "A real QLoRA recipe for the pick above, then the step to run your "
+                             "fine-tuned model locally.",
+                    "items": _qlora_command(repo)}
+        provenance = ("Training memory is a conservative estimate (16 bytes/parameter for full "
+                      "fine-tuning; ~4.5-bit base for QLoRA) sized to land at or above Unsloth's "
+                      "published minimums — most setups use the vanilla PEFT/bitsandbytes stack.")
+    else:
+        hv = "no"
+        head = "Nothing in the catalogue fits training on this machine yet."
+        detail = "Try a smaller model, or use one of the free cloud notebooks below."
+        gauge, commands, provenance = {}, {"intro": "", "items": []}, ""
+
+    tools = [
+        {"name": "Unsloth", "what": "Fastest single-GPU QLoRA, lowest VRAM, built-in GGUF export. Beginner default.",
+         "install": "pip install unsloth", "tag": "Start here"},
+        {"name": "Hugging Face TRL + PEFT", "what": "The reference stack: SFTTrainer + LoRA/QLoRA, maximum compatibility.",
+         "install": "pip install trl peft bitsandbytes", "tag": "Reference"},
+        {"name": "Axolotl", "what": "One YAML config; best when you move to multi-GPU or long context.",
+         "install": "github.com/axolotl-ai-cloud/axolotl", "tag": "Scale up"},
+    ]
+    return {
+        "verdict": hv, "verdict_word": _FT_VERDICT_WORD.get(hv, _VERDICT_WORD[hv]),
+        "headline": head, "detail": detail, "gauge": gauge, "options": options,
+        "tools": tools, "commands": commands, "provenance": provenance,
+        "cloud": _CLOUD, "speed": None,
+        "headline_model": chosen[0]["name"] if chosen else "",
+        "focus": focus or "",
+    }
+
+
+def _category_finetune(uc, candidates, spec) -> dict:
+    fam = uc.family
+    info = _CATEGORY_FT.get(fam)
+    fast = spec.fast_budget_gb
+    if not info:
+        return {"verdict": "tight", "verdict_word": "Depends on the model",
+                "headline": f"Fine-tuning {uc.plain_name.lower()} depends on the specific model.",
+                "detail": "Paste a specific model id in the box above to check it.",
+                "gauge": {}, "options": [], "tools": [], "commands": {"intro": "", "items": []},
+                "provenance": "", "cloud": _CLOUD, "speed": None, "headline_model": "", "focus": ""}
+    min_vram = info["min_vram"]
+    fits = fast >= min_vram
+    hv = "great" if fits else "no"
+    head = (f"Yes — you can fine-tune {uc.plain_name.lower()} on this machine."
+            if fits else
+            f"Fine-tuning {uc.plain_name.lower()} needs about {min_vram:g} GB of GPU memory — more than this machine has.")
+    detail = info["note"] + (f' <a href="{info["pointer"]}" target="_blank" rel="noopener">How to start.</a>'
+                             if info.get("pointer") else "")
+    options = []
+    for e in candidates[:12]:
+        options.append({
+            "verdict": "great" if fits else "no",
+            "model": e["name"], "desc": e.get("good_for", ""),
+            "setting": info["method"],
+            "memory": f"~{min_vram:g} GB to train" if fits else "Use the cloud",
+            "feel": "Fits your GPU" if fits else "Too big locally",
+            "params_b": e.get("params_b"), "active_params_b": e.get("active_params_b"),
+            "url": (e.get("links") or {}).get("hf") or (e.get("links") or {}).get("home", ""),
+            "license": e.get("license", ""), "license_note": e.get("license_note", ""),
+            "gated": e.get("gated", False), "run": {}, "provenance": "estimated",
+            "stale": e.get("stale", False),
+        })
+    return {
+        "verdict": hv, "verdict_word": _FT_VERDICT_WORD.get(hv, _VERDICT_WORD[hv]),
+        "headline": head, "detail": detail, "gauge": {}, "options": options,
+        "tools": info["tools"], "commands": {"intro": "", "items": info.get("commands", [])},
+        "provenance": ("These are conservative family-level minimums; the exact figure varies "
+                       "with model size, resolution and batch."),
+        "cloud": _CLOUD, "speed": None, "headline_model": "", "focus": "",
+    }
+
+
+_FT_VERDICT_WORD = {"great": "You can train this", "tight": "Trainable, but tight",
+                    "no": "Train in the cloud"}
+
+
+def advise_finetune(payload: dict, spec: HardwareSpec) -> dict:
+    """Mirror of advise_real for fine-tuning. Same result shape so the same
+    renderer draws it; adds a `cloud` section and omits the speed chart."""
+    uc = USE_CASES.get(payload.get("usecase", "chat"), USE_CASES["chat"])
+    candidates = _by_use_case().get(uc.key, [])
+    focus = (payload.get("focus") or "").strip()
+
+    if not candidates:
+        base = {"verdict": "tight", "verdict_word": "Not covered yet",
+                "headline": "Our catalogue doesn't cover this goal yet.",
+                "detail": "Paste a specific Hugging Face model id above to check it for training.",
+                "gauge": {}, "options": [], "tools": [], "commands": {"intro": "", "items": []},
+                "provenance": "", "cloud": _CLOUD, "speed": None, "headline_model": "", "focus": ""}
+    elif uc.family in ("llm", "vlm"):
+        base = _llm_finetune(uc, candidates, spec, focus)
+    else:
+        base = _category_finetune(uc, candidates, spec)
+
+    base.update({
+        "mode": "finetune",
+        "catalogue_version": catalogue_date(),
+        "use_case": uc.plain_name, "usecase": uc.key,
+        "meets_goal": base["verdict"] in ("great", "tight"),
+        "note": "",
+    })
+    return base

engine/hub_lookup.py

@@ -118,8 +118,13 @@ def lookup(repo_input: str, payload: dict, spec: HardwareSpec) -> dict:
                 explain += " Add roughly 0.1–0.5 GB for the adapter file."
         else:
             explain += f"is <b>{entry['name']}</b> in our catalogue."
+        # The use case to re-render the full breakdown under (cross-family aware).
+        fam = entry.get("family")
+        uc_key = ("vlm" if fam == "vlm" else "chat" if fam == "llm"
+                  else (entry.get("use_cases") or [None])[0])
         return {"found": True, "match": "catalogue", "chain": chain,
-                "explain": explain, "option": opt, "live": via is not None or info is not None}
+                "explain": explain, "option": opt, "live": via is not None or info is not None,
+                "focus_name": entry["name"], "uc_key": uc_key}
 
     # 3) Raw math from parameter count — clearly labelled estimate.
     st = getattr(info, "safetensors", None)

engine/real_advisor.py

@@ -97,8 +97,11 @@ USE_CASES = {u.key: u for u in [
 ]}
 
 # Use cases answered by the whole LLM family (entries don't list these).
+# "custom" is deliberately NOT here: we can't honestly map free-text goals to
+# the catalogue, so it returns guidance (paste a model id) rather than a
+# misleading generic LLM answer.
 _TEXT_UCS = {"chat", "writing", "coding", "agents", "rag", "translate",
-             "finetune", "custom"}
+             "finetune"}
 
 _TOOLS = {
     "llm": [
@@ -338,24 +341,45 @@ def _option_json(r: dict, spec: HardwareSpec, bw: float | None = None) -> dict:
     }
 
 
-def _pick_headline(results: list[dict], uc: UC) -> tuple[dict | None, bool]:
+def _pick_headline(results: list[dict], uc: UC,
+                   priority: str = "balanced") -> tuple[dict | None, bool]:
     great = [r for r in results if r["verdict"] == "great"]
     tight = [r for r in results if r["verdict"] == "tight"]
 
     def params(r):
         return r["entry"].get("params_b", 0)
 
+    def active(r):
+        return r["entry"].get("active_params_b") or params(r)
+
+    def ungated(r):
+        return not r["entry"].get("gated", False)
+
     great_ok = [r for r in great if params(r) >= uc.min_b]
     tight_ok = [r for r in tight if params(r) >= uc.min_b]
+
+    # "Fully open": prefer ungated, fully-open models when any exist — but never
+    # leave the user with nothing, so only filter when it doesn't empty the set.
+    if priority == "open":
+        if any(ungated(r) for r in great_ok):
+            great_ok = [r for r in great_ok if ungated(r)]
+        if any(ungated(r) for r in tight_ok):
+            tight_ok = [r for r in tight_ok if ungated(r)]
+
     if great_ok:
-        # Fast-and-capable is the best answer: biggest model that runs great.
+        if priority == "speed":
+            # Fastest = fewest active params, among the still-capable picks.
+            capable = [r for r in great_ok if params(r) >= uc.good_b] or great_ok
+            return min(capable, key=active), True
+        # Quality and balanced both want the biggest model that runs great.
         return max(great_ok, key=params), True
     if tight_ok:
-        if uc.good_b > 0:
+        if uc.good_b > 0 and priority != "quality":
             # LLMs: close to the ideal size, not needlessly oversized-and-slow.
+            # "Best quality" overrides this and takes the biggest that still fits.
             below = [r for r in tight_ok if params(r) <= uc.good_b * 1.5]
             return (max(below, key=params) if below else min(tight_ok, key=params)), True
-        # Non-LLM families: the biggest model that fits is simply the best one.
+        # Non-LLM families (and quality mode): the biggest that fits is best.
         return max(tight_ok, key=params), True
     if great:
         return max(great, key=params), False
@@ -390,25 +414,54 @@ def advise_real(payload: dict, spec: HardwareSpec) -> dict:
     # Honest gap, not a fake answer: if the catalogue doesn't cover a goal yet,
     # say so and point at the live lookup instead of inventing options.
     if not candidates:
+        is_custom = uc.key == "custom"
+        typed = (payload.get("custom") or "").strip()
+        if is_custom:
+            head = "Tell us the exact model and we'll check it."
+            detail = (
+                (f"You described <b>“{typed}”</b>. " if typed else "")
+                + "FitCheck answers from verified model data, so it won't guess which model "
+                "your description means. Paste the exact Hugging Face model id (e.g. "
+                "<b>lerobot/smolvla_base</b>) in the <b>'Have a specific model in mind?'</b> box "
+                "below and we'll check that model against your machine — or pick one of the "
+                "categories above for a curated recommendation."
+            )
+            word = "Name the model"
+        else:
+            head = "Our catalogue doesn't cover this goal yet."
+            detail = ("FitCheck only answers from verified model data, and nothing in the "
+                      "current catalogue serves this goal — so rather than guess, we'd "
+                      "rather say so. If you know a specific model for it, paste its "
+                      "Hugging Face id in the <b>'Have a specific model in mind?'</b> box "
+                      "and we'll check that exact model against your machine.")
+            word = "Not covered yet"
         return {
             "catalogue_version": catalogue_date(),
-            "verdict": "tight", "verdict_word": "Not covered yet",
-            "headline": "Our catalogue doesn't cover this goal yet.",
-            "detail": ("FitCheck only answers from verified model data, and nothing in the "
-                       "current catalogue serves this goal — so rather than guess, we'd "
-                       "rather say so. If you know a specific model for it, paste its "
-                       "Hugging Face id in the <b>'Have a specific model in mind?'</b> box "
-                       "and we'll check that exact model against your machine."),
-            "note": "The catalogue grows every night; niche goals are next in line.",
-            "gauge": {}, "options": [], "tools": _TOOLS.get(uc.family, []),
+            "verdict": "tight", "verdict_word": word,
+            "headline": head, "detail": detail,
+            "note": "" if is_custom else "The catalogue grows every night; niche goals are next in line.",
+            "gauge": {}, "options": [], "tools": [],
             "commands": {"intro": "", "items": []}, "provenance": "",
-            "meets_goal": False, "use_case": uc.plain_name,
+            "meets_goal": False, "use_case": uc.plain_name, "usecase": uc.key,
+            "focus": "", "headline_model": "",
         }
 
     results = [_evaluate(e, spec, uc) for e in candidates]
 
     fast, total = spec.fast_budget_gb, spec.total_budget_gb
-    headline, meets_goal = _pick_headline(results, uc)
+    headline, meets_goal = _pick_headline(results, uc, payload.get("priority", "balanced"))
+
+    # A specific model the user clicked / asked to focus on. We still show the
+    # honest verdict for THAT model — including "won't fit" — instead of the
+    # engine's own best pick. The whole breakdown below flows from `headline`.
+    focus = (payload.get("focus") or "").strip()
+    if focus:
+        fr = next((r for r in results
+                   if r["entry"]["name"] == focus
+                   or str(r["entry"].get("repo_id", "")).lower() == focus.lower()), None)
+        if fr:
+            headline = fr
+            meets_goal = fr["entry"].get("params_b", 0) >= uc.min_b
 
     bw, bw_src = bandwidth_for_spec(spec)
     options = [_option_json(r, spec, bw) for r in results]
@@ -422,8 +475,10 @@ def advise_real(payload: dict, spec: HardwareSpec) -> dict:
                  "using your computer's memory" if hv == "tight" else "")
         if hv == "great":
             head_text = f"Yes, you can run {e['name']} {where}, today."
-        else:
+        elif hv == "tight":
             head_text = f"Sort of. {e['name']} will run {where}, with trade-offs."
+        else:
+            head_text = f"{e['name']} won't fit on this machine."
         if e.get("quants"):
             detail = (
                 f"For this goal, the honest pick is <b>{e['name']}</b> at the "
@@ -520,6 +575,8 @@ def advise_real(payload: dict, spec: HardwareSpec) -> dict:
         "speed": speed,
         "meets_goal": meets_goal,
         "use_case": uc.plain_name,
+        "usecase": uc.key,
+        "focus": focus or "",
         "headline_model": headline["entry"]["name"] if headline else "",
     }
 

static/app.js

@@ -49,10 +49,6 @@ const USE_CASES = [
     { id: "forecast", icon: "forecast", label: "Time-series forecasting" },
     { id: "tabular",  icon: "tabular",  label: "Predict from spreadsheets" },
   ]},
-  { icon: "cat-train", name: "Train your own", items: [
-    { id: "finetune",     icon: "finetune",     label: "Fine-tune an LLM (LoRA)" },
-    { id: "train-vision", icon: "train-vision", label: "Train a vision model" },
-  ]},
   { icon: "cat-custom", name: "Something else", items: [
     { id: "custom", icon: "custom", label: "Custom: describe it" },
   ]},
@@ -74,7 +70,7 @@ const GPUS = {
 };
 
 const $ = (s) => document.querySelector(s);
-const state = { mode: "have", computer: "Windows laptop", provider: "none", priority: "balanced", usecases: ["chat"], checked: false };
+const state = { mode: "have", task: "run", computer: "Windows laptop", provider: "none", priority: "balanced", usecases: ["chat"], checked: false };
 let lastAdvice = null;   // the most recent /api/advise result — facts the model explains
 let multiCache = null;   // {ucs, results} when several goals are checked at once
 
@@ -85,37 +81,17 @@ function applyMode() {
     const el = $(s); if (el) el.style.display = buy ? "none" : "";
   });
   const repo = $("#repo-field"); if (repo) repo.style.display = buy ? "none" : "";
+  const tog = $("#task-toggle"); if (tog) tog.style.display = buy ? "none" : "";
+  if (buy && state.task !== "run") {        // buy advice is inference-only
+    state.task = "run";
+    tog.classList.remove("train");
+    tog.querySelectorAll(".tt-opt").forEach(x => x.classList.toggle("active", x.dataset.task === "run"));
+  }
   $("#check-btn").innerHTML = (buy ? "What should I get? " : "Check my setup ")
     + '<span class="ic" data-ic="arrow"></span>';
   hydrate($("#check-btn"));
 }
 
-// ---- Best-effort hardware hints from the browser (honest: vendor + floor) --
-async function detectHardware() {
-  const bits = [];
-  try {
-    if (navigator.gpu) {
-      const ad = await navigator.gpu.requestAdapter();
-      const v = ((ad && ad.info && (ad.info.vendor || ad.info.description)) || "").toLowerCase();
-      for (const vendor of ["nvidia", "amd", "apple", "intel"]) {
-        if (v.includes(vendor)) {
-          state.provider = vendor;
-          setActive("#provider-seg", vendor);
-          fillGpu();
-          bits.push(`a ${vendor.toUpperCase().replace("APPLE","Apple")} GPU`);
-          break;
-        }
-      }
-    }
-  } catch (e) { /* detection is best-effort only */ }
-  if (navigator.deviceMemory) bits.push(`at least ${navigator.deviceMemory} GB of RAM`);
-  if (bits.length) {
-    const h = $("#detect-hint");
-    h.style.display = "";
-    h.textContent = `Your browser reports ${bits.join(" and ")} — browsers can't see exact specs, so please confirm below.`;
-  }
-}
-
 // ---- Build the use-case picker -------------------------------------------
 function buildPicker() {
   const wrap = $("#usecase-picker");
@@ -160,6 +136,18 @@ function setActive(id, val) {
   $(id).querySelectorAll(".seg-btn").forEach(b => b.classList.toggle("active", b.dataset.val === val));
 }
 
+// Run vs Train sliding switch — recomputes the recommendations for training.
+function wireTaskToggle() {
+  const tog = $("#task-toggle");
+  if (!tog) return;
+  tog.querySelectorAll(".tt-opt").forEach(b => b.addEventListener("click", () => {
+    state.task = b.dataset.task;
+    tog.querySelectorAll(".tt-opt").forEach(x => x.classList.toggle("active", x === b));
+    tog.classList.toggle("train", state.task === "finetune");
+    maybeLiveUpdate();
+  }));
+}
+
 // ---- GPU select depends on provider --------------------------------------
 function fillGpu() {
   const list = GPUS[state.provider] || [];
@@ -227,6 +215,7 @@ function gather() {
     usecases: state.usecases.slice(),
     custom: $("#custom-uc").value.trim(),
     priority: state.priority,
+    mode: state.task,            // "run" (inference) or "finetune" (training)
     repo: $("#repo-check") ? $("#repo-check").value.trim() : "",
   };
 }
@@ -250,6 +239,9 @@ async function check() {
       renderBuy(await res.json());
       return;
     }
+    // A specific model named in the box takes over: we check THAT model and
+    // remake the whole answer for it, rather than show the goal list.
+    if (payload.repo) { multiCache = null; await lookupRepo(payload); return; }
     if (state.usecases.length > 1) {
       const results = await Promise.all(state.usecases.map(u =>
         fetch("/api/advise", {
@@ -258,7 +250,6 @@ async function check() {
         }).then(r => r.json())));
       multiCache = { ucs: state.usecases.slice(), results };
       renderMulti(results);
-      if (payload.repo) lookupRepo(payload);
       return;
     }
     multiCache = null;
@@ -267,7 +258,6 @@ async function check() {
       body: JSON.stringify(payload),
     });
     render(await res.json());
-    if (payload.repo) lookupRepo(payload);   // optional live check, appended on top
   } catch (e) {
     $("#results").innerHTML = `<div class="empty-state"><div class="big"><span class="ic" data-ic="monitor"></span></div>
       <p>Couldn't reach the advisor: ${e && e.message ? e.message : e}</p></div>`;
@@ -276,43 +266,63 @@ async function check() {
 }
 
 // ---- Live single-model lookup (the one online feature, labelled as such) ---
+// Naming a model remakes the whole answer for it: a catalogue match (or a
+// finetune that walks to a catalogue base) re-renders the full breakdown; a
+// model we don't know falls back to clearly-labelled raw parameter math.
 async function lookupRepo(payload) {
-  const holder = $("#lookup-result");
-  if (!holder) return;
-  holder.innerHTML = `<div class="ans-loading"><span class="spinner"></span>Looking up ${payload.repo} on Hugging Face…</div>`;
+  $("#results").innerHTML = `<div class="reveal"><div class="ans-loading"><span class="spinner"></span> Looking up ${payload.repo} on Hugging Face…</div></div>`;
+  let d;
   try {
     const res = await fetch("/api/lookup", {
       method: "POST", headers: { "Content-Type": "application/json" },
       body: JSON.stringify(payload),
     });
-    const d = await res.json();
-    if (d.error) {
-      holder.innerHTML = `<div class="ans-card ans-error"><h3>Couldn't check that model</h3><p>${d.error}</p></div>`;
-      return;
+    d = await res.json();
+  } catch (e) {
+    $("#results").innerHTML = `<div class="ans-card ans-error"><h3>Lookup failed</h3><p>${e && e.message ? e.message : e}</p></div>`;
+    hydrate($("#results")); return;
+  }
+  if (d.error) {
+    $("#results").innerHTML = `<div class="ans-card ans-error"><h3>Couldn't check that model</h3><p>${d.error}</p></div>`;
+    hydrate($("#results")); return;
+  }
+  // Catalogue match (directly, or via the finetune -> base walk): remake the
+  // full breakdown for the resolved model, then explain the link on top.
+  if (d.match === "catalogue" && d.focus_name) {
+    const uc = d.uc_key || (lastAdvice && lastAdvice.usecase) || state.usecases[0];
+    const res = await fetch("/api/advise", {
+      method: "POST", headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ ...payload, usecase: uc, focus: d.focus_name }),
+    });
+    render(await res.json());
+    const wrap = $("#results").firstElementChild;
+    if (wrap) {
+      const banner = document.createElement("div");
+      banner.className = "lookup-banner";
+      banner.innerHTML = `<span class="live-tag">Live Hugging Face lookup</span><p>${d.explain || ""}</p>`;
+      wrap.prepend(banner);
     }
-    const o = d.option || {};
-    const v = VMAP[o.verdict] || VMAP.tight;
-    holder.innerHTML = `
-      <div class="lookup-card reveal" style="--status:${v.cls};--status-soft:${v.soft}">
-        <div class="lookup-head">
-          <span class="badge"><span class="dot"></span>${v.word}</span>
-          <span class="live-tag">Live Hugging Face lookup</span>
-        </div>
-        <p class="lookup-explain">${d.explain || ""}</p>
+    return;
+  }
+  // We don't know this model: honest raw-parameter estimate, clearly labelled.
+  const o = d.option || {};
+  const v = VMAP[o.verdict] || VMAP.tight;
+  $("#results").innerHTML = `
+    <div class="reveal">
+      <div class="verdict" style="--status:${v.cls};--status-soft:${v.soft}">
+        <span class="badge"><span class="dot"></span>${v.word}</span>
+        <span class="live-tag">Live Hugging Face lookup</span>
+        <h2>${o.model || payload.repo}</h2>
+        <p>${d.explain || ""}</p>
+      </div>
+      <div class="lookup-card" style="--status:${v.cls};--status-soft:${v.soft}">
         <div class="lookup-meta">
           ${o.memory && o.memory !== "Too big" ? `<span><b>${o.memory}</b> needed (${o.setting})</span>` : `<span><b>Too big</b> for this machine</span>`}
           ${o.url ? `<a href="${o.url}" target="_blank" rel="noopener">View on Hugging Face</a>` : ""}
         </div>
-        ${o.run && o.run.ollama ? `<div class="cmd-box" style="margin-top:10px"><div class="cmd-label">Run it<button class="copy-btn" data-code="${encodeURIComponent(o.run.ollama)}">Copy</button></div><pre><code>${o.run.ollama}</code></pre></div>` : ""}
-      </div>`;
-    holder.querySelectorAll(".copy-btn").forEach(b => b.addEventListener("click", () => {
-      navigator.clipboard.writeText(decodeURIComponent(b.dataset.code));
-      b.textContent = "Copied ✓";
-      setTimeout(() => { b.textContent = "Copy"; }, 1500);
-    }));
-  } catch (e) {
-    holder.innerHTML = `<div class="ans-card ans-error"><h3>Lookup failed</h3><p>${e && e.message ? e.message : e}</p></div>`;
-  }
+      </div>
+    </div>`;
+  hydrate($("#results"));
 }
 
 // ---- Multi-goal overview (several goals checked at once) -------------------
@@ -404,11 +414,13 @@ function render(d) {
     return `<span class="lic${warn ? " warn" : ""}" title="${o.license_note || o.license}">${label}</span>`
          + (o.gated ? `<span class="lic gatechip" title="Accept the terms on Hugging Face once before downloading">gated</span>` : "");
   };
+  const current = d.focus || d.headline_model;
   const opts = (d.options || []).map(o => {
     const ov = VMAP[o.verdict] || VMAP.tight;
     const name = o.url
       ? `<a href="${o.url}" target="_blank" rel="noopener">${o.model}</a>` : o.model;
-    return `<div class="opt" style="--status:${ov.cls};--status-soft:${ov.soft}">
+    const cur = o.model === current ? " opt-current" : "";
+    return `<div class="opt${cur}" data-model="${o.model.replace(/"/g, "&quot;")}" style="--status:${ov.cls};--status-soft:${ov.soft}">
       <div class="vdot">${ov.em}</div>
       <div><div class="name">${name}${licChip(o)}</div><div class="desc">${o.desc}</div></div>
       <div class="meta"><b>${o.memory}</b><div class="feel">${o.setting}${o.feel && o.feel !== "—" ? " · " + o.feel : ""}</div></div>
@@ -429,6 +441,18 @@ function render(d) {
       <pre><code>${c.code}</code></pre>
     </div>`).join("");
 
+  const isFT = d.mode === "finetune";
+  const cloud = isFT && (d.cloud || []).length ? `
+    <div class="section-title">Train it in the cloud <span class="sub">when your machine is too small, or you'd rather not tie it up</span></div>
+    <div class="tool-grid">
+      ${d.cloud.map(c => `
+        <div class="tool">
+          <div class="tool-head"><span class="tname">${c.name}</span><span class="tag mid">${c.cost}</span></div>
+          <div class="twhat">${c.what}</div>
+          <div class="tinstall"><a href="${c.link}" target="_blank" rel="noopener"><span class="ic" data-ic="arrow"></span>Open</a></div>
+        </div>`).join("")}
+    </div>` : "";
+
   $("#results").innerHTML = `
     <div class="reveal">
       <div id="lookup-result"></div>
@@ -473,12 +497,14 @@ function render(d) {
         </div>
       </details>` : ""}
 
-      ${opts ? `<div class="section-title">What you can run <span class="sub">real models, biggest to smallest — names link to Hugging Face</span></div>
+      ${opts ? `<div class="section-title">${isFT ? "What you can fine-tune" : "What you can run"} <span class="sub">biggest to smallest — click any model for its full breakdown; names link to Hugging Face</span></div>
       <div class="opt-grid">${opts}</div>` : ""}
 
-      ${tools ? `<div class="section-title">How to actually run it</div>
+      ${tools ? `<div class="section-title">${isFT ? "How to fine-tune it" : "How to actually run it"}</div>
       <div class="tool-grid">${tools}</div>` : ""}
 
+      ${cloud}
+
       ${cmds ? `<div class="section-title">Copy-paste to get started</div>
       <p class="cmd-intro">${d.commands.intro || ""}</p>
       <div class="cmd">${cmds}</div>` : ""}
@@ -513,9 +539,30 @@ function render(d) {
     b.textContent = "Copied ✓"; b.classList.add("done");
     setTimeout(() => { b.textContent = "Copy"; b.classList.remove("done"); }, 1500);
   }));
+  // Click any option card to re-render the whole breakdown for THAT model.
+  $("#results").querySelectorAll(".opt[data-model]").forEach(card =>
+    card.addEventListener("click", (ev) => {
+      if (ev.target.closest("a")) return;   // let the Hugging Face link open
+      focusModel(card.dataset.model);
+    }));
   wireAsk();
 }
 
+// Re-run the engine focused on one specific model and scroll the answer up.
+async function focusModel(model) {
+  const uc = (lastAdvice && lastAdvice.usecase) || state.usecases[0];
+  try {
+    const res = await fetch("/api/advise", {
+      method: "POST", headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ ...gather(), usecase: uc, focus: model }),
+    });
+    render(await res.json());
+    $("#results").scrollIntoView({ behavior: "smooth", block: "start" });
+  } catch (e) {
+    /* leave the current view in place on a transient failure */
+  }
+}
+
 // ---- "Why this speed?" roofline scatter (real LocalScore runs) ------------
 let _rooflinePts = null;
 async function getRooflinePoints() {
@@ -754,13 +801,13 @@ function init() {
   wireSegmented("#computer-seg", "computer", () => { syncProviderForComputer(); $("#find-specs-body").innerHTML = findSpecsText(); });
   wireSegmented("#provider-seg", "provider", fillGpu);
   wireSegmented("#priority-seg", "priority");
+  wireTaskToggle();
   ["#ram","#gpu","#vram","#custom-uc","#repo-check"].forEach(s => { const el = $(s); if (el) el.addEventListener("change", maybeLiveUpdate); });
   $("#paste").addEventListener("input", maybeLiveUpdate);
   $("#check-btn").addEventListener("click", check);
   const pb = $("#parse-btn"); if (pb) pb.addEventListener("click", parsePaste);
   syncProviderForComputer();
   $("#find-specs-body").innerHTML = findSpecsText();
-  detectHardware();
   // Pre-filled share/preview links: ?go renders immediately; optional
   // ?gpu=NVIDIA|RTX 3060 (12 GB)&ram=16&uc=chat pre-select a profile.
   const q = new URLSearchParams(location.search);

static/index.html

@@ -43,7 +43,6 @@
         <!-- Step 1: machine -->
         <div class="step" id="machine-step">
           <div class="step-head"><span class="step-num">1</span><h2>Your computer</h2></div>
-          <div class="hint" id="detect-hint" style="display:none; margin-bottom:var(--s-3)"></div>
 
           <div class="field">
             <span class="label">Describe it in your own words <span class="optional">(fastest)</span></span>
@@ -101,6 +100,12 @@
         <!-- Step 2: goal -->
         <div class="step">
           <div class="step-head"><span class="step-num">2</span><h2>What do you want to do? <span class="optional">(pick one or several)</span></h2></div>
+          <div class="task-toggle" id="task-toggle" role="tablist"
+               data-tip="Running a model and fine-tuning it need very different memory. Switch this and the recommendations below recompute for training.">
+            <button class="tt-opt active" data-task="run" role="tab"><span class="ic" data-ic="chat"></span>Run a model</button>
+            <button class="tt-opt" data-task="finetune" role="tab"><span class="ic" data-ic="finetune"></span>Train / fine-tune</button>
+            <span class="tt-slider" aria-hidden="true"></span>
+          </div>
           <div id="usecase-picker"><!-- rendered by app.js --></div>
           <div class="field" id="custom-uc-field" style="display:none; margin-top:var(--s-3)">
             <span class="label">Describe what you want to build</span>
@@ -118,10 +123,10 @@
           <div class="step-head"><span class="step-num">3</span><h2>What matters most? <span class="optional">(optional)</span></h2></div>
           <div class="field" style="margin-bottom:0">
             <div class="segmented" id="priority-seg">
-              <button class="seg-btn active" data-val="balanced"><span class="ic" data-ic="balanced"></span>Balanced</button>
-              <button class="seg-btn" data-val="quality"><span class="ic" data-ic="quality"></span>Best quality</button>
-              <button class="seg-btn" data-val="speed"><span class="ic" data-ic="speed"></span>Fastest</button>
-              <button class="seg-btn" data-val="offline"><span class="ic" data-ic="offline"></span>Fully offline</button>
+              <button class="seg-btn active" data-val="balanced" data-tip="Our default: the best mix of quality and speed your machine can comfortably handle."><span class="ic" data-ic="balanced"></span>Balanced</button>
+              <button class="seg-btn" data-val="quality" data-tip="Pick the most capable model that runs, even if it's slower or tight on memory."><span class="ic" data-ic="quality"></span>Best quality</button>
+              <button class="seg-btn" data-val="speed" data-tip="Prefer the snappiest model (smaller, or mixture-of-experts) for instant replies."><span class="ic" data-ic="speed"></span>Fastest</button>
+              <button class="seg-btn" data-val="open" data-tip="Only fully-open, ungated models: no Hugging Face sign-in or licence to accept. (Every pick already runs 100% offline on your machine once downloaded.)"><span class="ic" data-ic="offline"></span>Fully open</button>
             </div>
           </div>
         </div>

static/style.css

@@ -176,6 +176,18 @@ button { font-family: inherit; cursor: pointer; }
 .seg-btn.active .ic.brand { color: var(--segc, var(--text-primary)); }
 .seg-btn.disabled { opacity: .3; pointer-events: none; }
 
+/* Hover tooltip: explains a control on hover/focus (priority row, etc.). */
+[data-tip] { position: relative; }
+[data-tip]:hover::after, [data-tip]:focus-visible::after {
+  content: attr(data-tip);
+  position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%);
+  width: max-content; max-width: 240px; z-index: 30;
+  background: var(--bg-raised); color: var(--text-secondary);
+  border: 1px solid var(--border-hi); border-radius: var(--r-sm);
+  padding: 8px 10px; font-size: 12px; font-weight: 500; line-height: 1.45; text-align: left;
+  box-shadow: var(--shadow-lg); pointer-events: none; white-space: normal;
+}
+
 /* Each position gets its own accent when selected — coloured boundaries,
    line icons stay line icons. */
 .segmented .seg-btn:nth-child(1) { --segc: #60A5FA; }
@@ -211,6 +223,32 @@ select {
 textarea { resize: vertical; min-height: 70px; line-height: 1.5; }
 .field-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-3); }
 
+/* Run vs Train toggle: a sliding two-way switch above the use-case picker. */
+.task-toggle {
+  position: relative; display: grid; grid-template-columns: 1fr 1fr;
+  gap: 0; background: var(--bg-inset); border: 1px solid var(--border);
+  border-radius: var(--r-pill); padding: 3px; margin-bottom: var(--s-4);
+}
+.tt-opt {
+  position: relative; z-index: 2; background: transparent; border: 0;
+  color: var(--text-secondary); font-size: 13.5px; font-weight: 600;
+  padding: 8px 12px; border-radius: var(--r-pill); cursor: pointer;
+  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
+  transition: color .2s;
+}
+.tt-opt .ic { font-size: 16px; }
+.tt-opt.active { color: #fff; }
+.tt-slider {
+  position: absolute; z-index: 1; top: 3px; bottom: 3px; left: 3px;
+  width: calc(50% - 3px); border-radius: var(--r-pill);
+  background: linear-gradient(135deg, var(--accent), #7C9CF6);
+  box-shadow: var(--shadow-sm); transition: transform .25s cubic-bezier(.4,0,.2,1);
+}
+.task-toggle.train .tt-slider { transform: translateX(100%); }
+.task-toggle.train .tt-slider {
+  background: linear-gradient(135deg, #F472B6, #FB923C);
+}
+
 /* Use-case picker */
 .uc-group { margin-bottom: var(--s-4); }
 .uc-cat {
@@ -385,6 +423,13 @@ details.disc > summary:hover { color: var(--text-primary); }
 .opt .meta { text-align: right; font-size: 13px; color: var(--text-secondary); white-space: nowrap; }
 .opt .meta b { color: var(--text-primary); font-family: var(--font-head); }
 .opt .feel { font-size: 12.5px; color: var(--text-muted); margin-top: 2px; }
+/* Every option card is clickable: re-renders the full breakdown for that model. */
+.opt[data-model] { cursor: pointer; }
+.opt[data-model]:hover { border-color: var(--border-hi); }
+.opt-current {
+  border-color: var(--status) !important;
+  box-shadow: inset 0 0 0 1px var(--status), var(--shadow-lg);
+}
 
 /* Tool cards */
 .tool-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: var(--s-3); }
@@ -491,6 +536,13 @@ details.disc > summary:hover { color: var(--text-primary); }
 }
 .lookup-explain { color: var(--text-secondary); font-size: 14.5px; }
 .lookup-meta { display: flex; gap: var(--s-4); margin-top: var(--s-2); font-size: 13.5px; color: var(--text-secondary); }
+/* Banner above a remade breakdown when the answer came from a live lookup. */
+.lookup-banner {
+  display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap;
+  background: var(--accent-soft); border: 1px solid var(--accent);
+  border-radius: var(--r-md); padding: var(--s-3) var(--s-4); margin-bottom: var(--s-4);
+}
+.lookup-banner p { color: var(--text-secondary); font-size: 13.5px; margin: 0; }
 
 /* Ask a follow-up (the model brick) */
 .ask-row { display: flex; gap: var(--s-2); }