deploy 412dabf8

Dockerfile

@@ -0,0 +1,9 @@
+FROM python:3.12-slim
+RUN useradd -m -u 1000 user
+WORKDIR /app
+COPY requirements.txt .
+RUN pip install --no-cache-dir -r requirements.txt
+COPY --chown=user app/ /app/
+USER user
+EXPOSE 7860
+CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "7860", "--proxy-headers", "--forwarded-allow-ips", "*"]

README.md

@@ -1,10 +1,23 @@
 ---
 title: Data Experiments
-emoji: 😻
-colorFrom: indigo
-colorTo: gray
+emoji: 🧪
+colorFrom: blue
+colorTo: indigo
 sdk: docker
+app_port: 7860
+hf_oauth: true
+hf_oauth_scopes:
+  - email
 pinned: false
+short_description: Extrian's catalog of data experiments (sign-in required)
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+# Data Experiments
+
+The Extrian team's catalog of data projects: what each one is, where it stands, the pilot to listen to, and how to get
+the data. Open it at **https://extrian-data-experiments.hf.space** (signing in doesn't work inside the embedded view on
+huggingface.co).
+
+Access needs "Sign in with Hugging Face" and a place on the allow list. This repository holds only the page and the
+server code: no data and no secrets. The project records live in private storage and are served only to signed-in,
+allow-listed viewers.

app/main.py

@@ -0,0 +1,396 @@
+"""Data Experiments dashboard, served from a Hugging Face Space.
+
+The page is a static shell (static/index.html + static/app.js) that holds no data. Everything it shows comes from
+/api/*, and every /api route needs a signed-in, allow-listed viewer:
+
+  sign-in   "Sign in with Hugging Face" (the Space's OAuth app: hf_oauth in README.md). Server-side authorization-code
+            flow with PKCE and a signed, 10-minute state cookie; the callback trades the code for a token and reads
+            /oauth/userinfo server to server. The viewer then gets a signed HttpOnly session cookie (24 h).
+  allow     experiments/_access.json in R2 (edited with `python dataops/experiments_db.py access ...`), re-read at most
+            every ACCESS_TTL seconds, checked on EVERY request, so a removal takes effect within a minute:
+            an allowed HF username, membership of an allowed HF org, an allowed email, or an email in an allowed
+            domain. Emails only count when Hugging Face reports them verified.
+  data      JSON records under experiments/ (projects/, docs/, sft/, _access.json), the same ones sessions write with
+            dataops/experiments_db.py. SFT marks are written here, recording who marked them. Two interchangeable
+            stores, picked by DATA_BACKEND:
+              r2  (default) bucket ops-dash; R2_ACCOUNT_ID / R2_ACCESS_KEY_ID / R2_SECRET_ACCESS_KEY
+              hf  a private Hugging Face dataset repo, same paths; DATA_REPO (default Extrian/data-experiments-db)
+                  and HF_DATA_TOKEN (read + write on that one repo)
+
+Settings come from the environment: OAUTH_CLIENT_ID / OAUTH_CLIENT_SECRET / OAUTH_SCOPES / SPACE_HOST are set by the
+Space; the store's credentials are Space secrets. SESSION_SECRET (signs the cookies) is optional: without it a random one
+is made at startup, so everyone is signed out whenever the Space restarts. The R2 key only ever touches
+ops-dash/experiments/ (every key is checked), so a key limited to bucket ops-dash is enough.
+"""
+import base64, hashlib, html, json, os, re, secrets, threading, time
+from concurrent.futures import ThreadPoolExecutor
+from datetime import datetime, timezone
+from pathlib import Path
+from urllib.parse import urlencode
+
+import boto3, botocore, httpx
+from fastapi import FastAPI, Request
+from fastapi.responses import FileResponse, HTMLResponse, JSONResponse, RedirectResponse
+from itsdangerous import BadSignature, SignatureExpired, URLSafeTimedSerializer
+
+HF = "https://huggingface.co"
+BUCKET, PREFIX = "ops-dash", "experiments/"
+ACCESS_KEY = PREFIX + "_access.json"
+ID_RE = re.compile(r"^[a-z0-9][a-z0-9._-]{0,99}$")
+SESSION_COOKIE, STATE_COOKIE = "dx_session", "dx_oauth"
+SESSION_TTL, STATE_TTL, ACCESS_TTL, ACCESS_STALE_MAX = 24 * 3600, 600, 60, 600
+STATIC = Path(__file__).resolve().parent / "static"
+
+CSP = ("default-src 'self'; script-src 'self' https://cdnjs.cloudflare.com; "
+       "style-src 'self' 'unsafe-inline' https://fonts.googleapis.com; font-src https://fonts.gstatic.com; "
+       "img-src 'self' data:; connect-src 'self'; frame-ancestors https://huggingface.co; base-uri 'none'; "
+       "form-action 'self' https://huggingface.co")
+
+
+def env(name, default=None):
+    v = os.environ.get(name, default)
+    if not v:
+        raise RuntimeError(f"{name} is not set")
+    return v
+
+
+def public_origin():
+    return "https://" + env("SPACE_HOST").strip().rstrip("/")
+
+
+_SESSION_SECRET = os.environ.get("SESSION_SECRET") or ""
+if not _SESSION_SECRET:
+    _SESSION_SECRET = secrets.token_urlsafe(48)
+    print("SESSION_SECRET is not set: using a random one for this run, so sign-ins reset whenever the Space restarts",
+          flush=True)
+
+
+def signer(purpose):
+    return URLSafeTimedSerializer(_SESSION_SECRET, salt="dx-" + purpose)
+
+
+def inside(key):
+    """Every store access stays under experiments/ (a narrow R2 key may not reach anything else)."""
+    if not key.startswith(PREFIX) or ".." in key:
+        raise ValueError(f"refusing to touch {key!r}: only {PREFIX} is used")
+    return key
+
+
+def now():
+    return datetime.now(timezone.utc).strftime("%Y-%m-%dT%H:%M:%SZ")
+
+
+# ------------------------------------------------------------------------------------------------ stores
+class R2Store:
+    def __init__(self):
+        self.c = boto3.client("s3", endpoint_url=f"https://{env('R2_ACCOUNT_ID')}.r2.cloudflarestorage.com",
+                              aws_access_key_id=env("R2_ACCESS_KEY_ID"), aws_secret_access_key=env("R2_SECRET_ACCESS_KEY"),
+                              region_name="auto", config=botocore.config.Config(retries={"max_attempts": 3},
+                                                                                 connect_timeout=5, read_timeout=15))
+
+    def get(self, key):
+        try:
+            return json.loads(self.c.get_object(Bucket=BUCKET, Key=inside(key))["Body"].read())
+        except botocore.exceptions.ClientError as e:
+            if e.response["Error"]["Code"] in ("NoSuchKey", "404"):
+                return None
+            raise
+
+    def keys(self, prefix):
+        out, kw = [], {"Bucket": BUCKET, "Prefix": inside(prefix)}
+        while True:
+            r = self.c.list_objects_v2(**kw)
+            out += [o["Key"] for o in r.get("Contents", [])]
+            if not r.get("IsTruncated"):
+                return out
+            kw["ContinuationToken"] = r["NextContinuationToken"]
+
+    def put(self, key, obj, note):
+        self.c.put_object(Bucket=BUCKET, Key=inside(key), Body=json.dumps(obj).encode(), ContentType="application/json; charset=utf-8")
+
+
+class HFStore:
+    """A private Hugging Face dataset repo holding the same paths. Reads go to resolve/main with the token (fresh, no
+    local cache); every write is one commit."""
+
+    def __init__(self):
+        from huggingface_hub import HfApi
+        self.repo, self.token = env("DATA_REPO", "Extrian/data-experiments-db"), env("HF_DATA_TOKEN")
+        self.api = HfApi(token=self.token)
+        self.http = httpx.Client(timeout=15, headers={"Authorization": "Bearer " + self.token}, follow_redirects=True)
+
+    def get(self, key):
+        r = self.http.get(f"{HF}/datasets/{self.repo}/resolve/main/{inside(key)}")
+        if r.status_code == 404:
+            return None
+        r.raise_for_status()
+        return r.json()
+
+    def keys(self, prefix):
+        from huggingface_hub.errors import EntryNotFoundError
+        try:
+            items = self.api.list_repo_tree(self.repo, path_in_repo=inside(prefix).rstrip("/"), repo_type="dataset")
+            return [i.path for i in items if getattr(i, "size", None) is not None]
+        except EntryNotFoundError:
+            return []
+
+    def put(self, key, obj, note):
+        self.api.upload_file(path_or_fileobj=json.dumps(obj).encode(), path_in_repo=inside(key), repo_id=self.repo,
+                             repo_type="dataset", commit_message=note)
+
+
+_store = None
+
+
+def store():
+    global _store
+    if _store is None:
+        kind = os.environ.get("DATA_BACKEND", "r2").strip().lower()
+        if kind not in ("r2", "hf"):
+            raise RuntimeError(f"DATA_BACKEND must be r2 or hf, got {kind!r}")
+        _store = R2Store() if kind == "r2" else HFStore()
+    return _store
+
+
+def r2_get(key):  # kept under this name: the tests patch it
+    return store().get(key)
+
+
+def r2_read_all(coll):
+    prefix = f"{PREFIX}{coll}/"
+    keys = [k for k in store().keys(prefix) if k.endswith(".json") and "/" not in k[len(prefix):]]
+    with ThreadPoolExecutor(16) as ex:
+        vals = list(ex.map(r2_get, keys))
+    return {k[len(prefix):-5]: v for k, v in zip(keys, vals) if v is not None}
+
+
+# ------------------------------------------------------------------------------------------------ access list
+_acl = {"data": None, "at": 0.0}
+_acl_lock = threading.Lock()
+
+
+def access_list():
+    """The allow list, re-read at most every ACCESS_TTL s. If R2 is unreachable the last good copy is used for up to
+    ACCESS_STALE_MAX s; past that, or with no copy at all, nobody gets in (fail closed)."""
+    with _acl_lock:
+        if _acl["data"] is not None and time.time() - _acl["at"] < ACCESS_TTL:
+            return _acl["data"]
+        try:
+            _acl["data"], _acl["at"] = r2_get(ACCESS_KEY) or {}, time.time()
+        except Exception:  # noqa: BLE001
+            if _acl["data"] is None or time.time() - _acl["at"] > ACCESS_STALE_MAX:
+                raise
+        return _acl["data"]
+
+
+def allowed(ident, acl):
+    """Why this viewer may see the page ("hf_user", "hf_org", "email", "domain"), or None."""
+    low = lambda xs: {str(x).strip().lower().lstrip("@") for x in xs or []}
+    user = str(ident.get("u") or "").lower()
+    if user and user in low(acl.get("hf_users")):
+        return "hf_user"
+    if low(ident.get("orgs")) & low(acl.get("hf_orgs")):
+        return "hf_org"
+    email = str(ident.get("e") or "").strip().lower()
+    if email and ident.get("ev") is True and email.count("@") == 1:
+        if email in low(acl.get("emails")):
+            return "email"
+        if email.split("@")[1] in low(acl.get("domains")):
+            return "domain"
+    return None
+
+
+def identity_from_userinfo(info):
+    orgs = [o.get("preferred_username") or o.get("name") for o in info.get("orgs") or [] if isinstance(o, dict)]
+    return {"u": info.get("preferred_username") or "", "sub": str(info.get("sub") or ""),
+            "e": (info.get("email") or "").strip().lower(), "ev": info.get("email_verified") is True,
+            "orgs": [o for o in orgs if o], "iat": int(time.time())}
+
+
+def viewer(request):
+    """(identity, None) for an allowed viewer, else (None, response)."""
+    raw = request.cookies.get(SESSION_COOKIE)
+    if not raw:
+        return None, JSONResponse({"error": "sign in", "login": "/login"}, 401)
+    try:
+        ident = signer("session").loads(raw, max_age=SESSION_TTL)
+    except SignatureExpired:
+        return None, JSONResponse({"error": "your sign-in expired", "login": "/login"}, 401)
+    except BadSignature:
+        return None, JSONResponse({"error": "sign in", "login": "/login"}, 401)
+    try:
+        why = allowed(ident, access_list())
+    except Exception:  # noqa: BLE001
+        return None, JSONResponse({"error": "could not check the access list; try again shortly"}, 503)
+    if not why:
+        return None, JSONResponse({"error": "not on the access list", "who": label(ident)}, 403)
+    return ident, None
+
+
+def label(ident):
+    return ident.get("e") if ident.get("ev") and ident.get("e") else "@" + (ident.get("u") or "?")
+
+
+# ------------------------------------------------------------------------------------------------ app
+app = FastAPI(docs_url=None, redoc_url=None, openapi_url=None)
+
+
+@app.middleware("http")
+async def headers(request, call_next):
+    resp = await call_next(request)
+    resp.headers.setdefault("Cache-Control", "no-store")
+    resp.headers["X-Content-Type-Options"] = "nosniff"
+    resp.headers["Referrer-Policy"] = "no-referrer"
+    resp.headers["Content-Security-Policy"] = CSP
+    return resp
+
+
+def cookie(resp, name, value, max_age, path="/"):
+    resp.set_cookie(name, value, max_age=max_age, path=path, secure=True, httponly=True, samesite="lax")
+
+
+@app.get("/")
+def index():
+    return FileResponse(STATIC / "index.html", media_type="text/html; charset=utf-8")
+
+
+@app.get("/app.js")
+def app_js():
+    return FileResponse(STATIC / "app.js", media_type="text/javascript; charset=utf-8")
+
+
+@app.get("/login")
+def login():
+    state, verifier = secrets.token_urlsafe(24), secrets.token_urlsafe(48)
+    challenge = base64.urlsafe_b64encode(hashlib.sha256(verifier.encode()).digest()).rstrip(b"=").decode()
+    scopes = " ".join(dict.fromkeys(["openid", "profile", "email"] + os.environ.get("OAUTH_SCOPES", "").split()))
+    q = {"client_id": env("OAUTH_CLIENT_ID"), "redirect_uri": public_origin() + "/login/callback",
+         "response_type": "code", "scope": scopes, "state": state,
+         "code_challenge": challenge, "code_challenge_method": "S256"}
+    resp = RedirectResponse(f"{HF}/oauth/authorize?{urlencode(q)}", 302)
+    cookie(resp, STATE_COOKIE, signer("state").dumps({"s": state, "v": verifier}), STATE_TTL, path="/login")
+    return resp
+
+
+def page(title, body, status=200):
+    return HTMLResponse(f"""<!doctype html><html><head><meta charset="utf-8"><meta name="viewport"
+content="width=device-width,initial-scale=1"><title>{html.escape(title)}</title><style>body{{font:15px/1.55 system-ui,
+sans-serif;margin:0;padding:48px 16px;background:#f3f5f8;color:#16202c}}main{{max-width:560px;margin:0 auto;
+background:#fff;border:1px solid #dde2ea;border-radius:12px;padding:24px}}a{{color:#2a5bd7}}code{{background:#eef1f5;
+padding:1px 5px;border-radius:4px}}@media (prefers-color-scheme:dark){{body{{background:#0f141b;color:#e4e9f1}}
+main{{background:#161d27;border-color:#283241}}a{{color:#7ea6ff}}code{{background:#1d2633}}}}</style></head>
+<body><main>{body}</main></body></html>""", status)
+
+
+@app.get("/login/callback")
+def callback(request: Request, code: str = "", state: str = "", error: str = ""):
+    raw = request.cookies.get(STATE_COOKIE)
+    try:
+        st = signer("state").loads(raw or "", max_age=STATE_TTL)
+    except (BadSignature, SignatureExpired):
+        st = None
+    if error or not st or not code or not state or not secrets.compare_digest(str(st.get("s")), state):
+        resp = page("Sign-in failed", "<h1>Sign-in didn't complete</h1><p>The sign-in link expired or came from "
+                    "somewhere else. <a href='/login'>Try again</a>.</p>", 400)
+        resp.delete_cookie(STATE_COOKIE, path="/login")
+        return resp
+    try:
+        with httpx.Client(timeout=15) as h:
+            tok = h.post(f"{HF}/oauth/token", auth=(env("OAUTH_CLIENT_ID"), env("OAUTH_CLIENT_SECRET")),
+                         data={"grant_type": "authorization_code", "code": code, "code_verifier": st["v"],
+                               "redirect_uri": public_origin() + "/login/callback"})
+            tok.raise_for_status()
+            info = h.get(f"{HF}/oauth/userinfo", headers={"Authorization": "Bearer " + tok.json()["access_token"]})
+            info.raise_for_status()
+            info = info.json()
+    except Exception:  # noqa: BLE001
+        return page("Sign-in failed", "<h1>Couldn't reach Hugging Face</h1><p><a href='/login'>Try again</a>.</p>", 502)
+    ident = identity_from_userinfo(info)
+    try:
+        why = allowed(ident, access_list())
+    except Exception:  # noqa: BLE001
+        return page("Try again", "<h1>Couldn't check the access list</h1><p><a href='/login'>Try again</a> in a minute.</p>", 503)
+    if not why:
+        who = html.escape(label(ident))
+        mail = "" if ident.get("ev") or not ident.get("e") else (
+            "<p>Your Hugging Face email isn't verified, so it can't be used to let you in. Verify it in your Hugging Face "
+            "settings, or ask for your username to be added.</p>")
+        resp = page("No access yet", f"<h1>You're signed in, but not on the access list</h1><p>Signed in as "
+                    f"<code>{who}</code> (Hugging Face user <code>{html.escape(ident.get('u') or '?')}</code>).</p>{mail}"
+                    "<p>Ask the dashboard owner to add your email or Hugging Face username, then "
+                    "<a href='/login'>sign in again</a>.</p>", 403)
+        resp.delete_cookie(STATE_COOKIE, path="/login")
+        return resp
+    resp = RedirectResponse("/", 302)
+    resp.delete_cookie(STATE_COOKIE, path="/login")
+    cookie(resp, SESSION_COOKIE, signer("session").dumps(ident), SESSION_TTL)
+    return resp
+
+
+@app.get("/logout")
+def logout():
+    resp = RedirectResponse("/", 302)
+    resp.delete_cookie(SESSION_COOKIE, path="/")
+    return resp
+
+
+@app.get("/api/me")
+def me(request: Request):
+    ident, err = viewer(request)
+    return err or {"me": label(ident), "user": ident.get("u")}
+
+
+@app.get("/api/data")
+def data(request: Request):
+    ident, err = viewer(request)
+    if err:
+        return err
+    with ThreadPoolExecutor(3) as ex:
+        projects, docs, sft = ex.map(r2_read_all, ("projects", "docs", "sft"))
+    index = {i: {"title": d.get("title"), "path": d.get("path"), "has_markdown": bool(d.get("markdown")),
+                 "updated_at": d.get("updated_at")} for i, d in docs.items()}
+    return {"projects": projects, "docs": index, "sft": sft, "me": label(ident)}
+
+
+@app.get("/api/doc/{doc_id}")
+def doc(doc_id: str, request: Request):
+    ident, err = viewer(request)
+    if err:
+        return err
+    if not ID_RE.match(doc_id):
+        return JSONResponse({"error": "bad doc id"}, 400)
+    d = r2_get(f"{PREFIX}docs/{doc_id}.json")
+    return d if d is not None else JSONResponse({"error": "no such guide"}, 404)
+
+
+async def sft_write(slug, request, done):
+    ident, err = viewer(request)
+    if err:
+        return err
+    # Writes must come from this page: same Origin and a custom header a cross-site form can't send.
+    if request.headers.get("origin") != public_origin() or request.headers.get("x-dashboard") != "1":
+        return JSONResponse({"error": "writes must come from the dashboard page"}, 403)
+    if not ID_RE.match(slug):
+        return JSONResponse({"error": "bad project id"}, 400)
+    if r2_get(f"{PREFIX}projects/{slug}.json") is None:
+        return JSONResponse({"error": "no such project"}, 404)
+    note = ""
+    if done:
+        try:
+            body = await request.json()
+        except Exception:  # noqa: BLE001
+            return JSONResponse({"error": "send a JSON body"}, 400)
+        note = str((body or {}).get("note") or "")[:300]
+    mark = {"done": done, "by": label(ident), "by_hf": ident.get("u"), "at": now(), "note": note}
+    store().put(f"{PREFIX}sft/{slug}.json", mark, f"SFT {'mark' if done else 'undo'} {slug} by {mark['by']}")
+    return mark
+
+
+@app.post("/api/sft/{slug}")
+async def sft_mark(slug: str, request: Request):
+    return await sft_write(slug, request, True)
+
+
+@app.delete("/api/sft/{slug}")
+async def sft_undo(slug: str, request: Request):
+    return await sft_write(slug, request, False)

app/static/app.js

@@ -0,0 +1,226 @@
+// Data Experiments page: rows, guides and SFT marks come from /api/* (the Space's server reading R2; every route needs
+// a signed-in, allow-listed viewer). The page polls every 60 s and on focus, so session writes show up within a minute.
+"use strict";
+const STATUSES = [
+  ["prod_running", "Prod running"], ["prod_paused", "Prod paused"], ["pilot_ready", "Pilot ready"], ["building", "Building"],
+  ["prod_done", "Prod done"]];
+const LABEL = Object.fromEntries(STATUSES);
+const HINT = {
+  prod_running: "Full-size generation is running now.",
+  prod_paused: "Stopped before reaching its target; what it made so far is usable.",
+  pilot_ready: "A small sample is ready to listen to and judge before scaling up.",
+  building: "Code or scripts are being written; nothing to review yet.",
+  prod_done: "Finished; the final data is ready to use.",
+  sft: "Someone has marked it as already used in a training run." };
+const $ = (id) => document.getElementById(id);
+const el = (tag, cls, text) => { const e = document.createElement(tag); if (cls) e.className = cls; if (text != null) e.textContent = text; return e; };
+let projects = [], docs = {}, sft = {}, me = null, filter = null, query = "";
+let sftEditing = null, sftDraft = "", sftFocus = false, sftError = {}, loadedOnce = false;
+const docCache = {};
+try { filter = localStorage.getItem("dx-filter") || null; } catch (e) {}
+
+function ago(iso) {
+  const t = Date.parse(iso); if (!t) return "";
+  const m = Math.round((Date.now() - t) / 60000);
+  if (m < 60) return m <= 1 ? "just now" : m + " min ago";
+  const h = Math.round(m / 60); if (h < 48) return h + " h ago";
+  return Math.round(h / 24) + " days ago";
+}
+const num = (x) => typeof x === "number" ? x.toLocaleString("en-US", { maximumFractionDigits: 1 }) : String(x ?? "");
+
+function copyBtn(text) {
+  const b = el("button", null, "Copy"); b.type = "button";
+  b.addEventListener("click", async () => {
+    try { await navigator.clipboard.writeText(text); b.textContent = "Copied"; }
+    catch (e) { const r = document.createRange(); r.selectNodeContents(b.previousSibling); const s = getSelection(); s.removeAllRanges(); s.addRange(r); b.textContent = "Selected"; }
+    setTimeout(() => (b.textContent = "Copy"), 1400);
+  });
+  return b;
+}
+
+// Guides are written by sessions, so their markdown is untrusted: raw HTML in it is shown as text (never
+// parsed), and the rendered result still goes through DOMPurify.
+const escapeHtml = (s) => String(s).replace(/[&<>"']/g, (c) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" }[c]));
+if (window.marked) marked.use({ renderer: { html: (html) => escapeHtml(typeof html === "string" ? html : (html && html.text) || "") } });
+
+function renderMarkdown(body, md) {
+  if (window.marked && window.DOMPurify) {
+    body.innerHTML = DOMPurify.sanitize(marked.parse(String(md)), { FORBID_TAGS: ["style", "form", "input", "iframe"] });
+    body.querySelectorAll("a[href]").forEach((a) => {
+      if (!/^https?:\/\//i.test(a.getAttribute("href") || "")) { a.removeAttribute("href"); return; }
+      a.target = "_blank"; a.rel = "noopener noreferrer";
+    });
+  } else { const pre = el("pre"); pre.textContent = String(md); body.append(pre); }
+}
+
+async function openDoc(id) {
+  const meta = docs[id];
+  $("rtitle").textContent = meta ? (meta.title || id) : id;
+  $("rpath").textContent = meta && meta.path ? meta.path : "";
+  const body = $("rbody"); body.textContent = "";
+  $("reader").hidden = false; body.scrollTop = 0; $("rclose").focus();
+  if (!meta) { body.append(el("p", null, "This guide hasn't been added to the page yet.")); return; }
+  if (!meta.has_markdown) { body.append(el("p", null, "Only the file path is recorded for this guide. Open it in the repo: " + (meta.path || ""))); return; }
+  body.append(el("p", "lede", "Loading…"));
+  try {
+    let d = docCache[id];
+    if (!d || d.updated_at !== meta.updated_at) {
+      const r = await fetch("/api/doc/" + encodeURIComponent(id), { credentials: "same-origin", cache: "no-store" });
+      if (!r.ok) throw new Error(r.status);
+      d = docCache[id] = await r.json();
+    }
+    body.textContent = ""; renderMarkdown(body, d.markdown || "");
+  } catch (e) { body.textContent = ""; body.append(el("p", null, "Couldn't load this guide. Reload the page (your sign-in may have expired).")); }
+}
+$("rclose").addEventListener("click", () => ($("reader").hidden = true));
+$("reader").addEventListener("click", (e) => { if (e.target === $("reader")) $("reader").hidden = true; });
+document.addEventListener("keydown", (e) => { if (e.key === "Escape") $("reader").hidden = true; });
+
+async function saveSft(id, done, note) {
+  sftError[id] = "";
+  try {
+    const r = await fetch("/api/sft/" + encodeURIComponent(id), {
+      method: done ? "POST" : "DELETE", credentials: "same-origin", cache: "no-store",
+      headers: { "Content-Type": "application/json", "X-Dashboard": "1" },
+      body: done ? JSON.stringify({ note: note.slice(0, 300) }) : undefined });
+    if (!r.ok) throw new Error(r.status);
+    sft[id] = await r.json();
+    sftEditing = null; sftDraft = "";
+  } catch (e) { sftError[id] = "Couldn't save the mark. Reload the page (your sign-in may have expired) and try again."; }
+  render();
+}
+function sftRow(p) {
+  const m = sft[p.id]; const row = el("div", "sftrow");
+  const editable = !!me;
+  if (m && m.done) {
+    row.append(el("span", "sftbadge", "SFT done"));
+    const who = [m.by || "", m.at ? ago(m.at) : ""].filter(Boolean).join(" · ");
+    if (who) row.append(el("span", "who", who));
+    if (editable) { const u = el("button", null, "Undo"); u.type = "button"; u.setAttribute("aria-label", "Undo SFT done for " + (p.title || p.id)); u.addEventListener("click", () => saveSft(p.id, false, "")); row.append(u); }
+    if (m.note) row.append(el("span", "sftnote", m.note));
+  } else if (editable && sftEditing === p.id) {
+    const inp = el("input"); inp.id = "sft-note-" + p.id; inp.placeholder = "Note (optional): run name or result"; inp.maxLength = 300; inp.value = sftDraft;
+    inp.setAttribute("aria-label", "SFT note for " + (p.title || p.id));
+    inp.addEventListener("input", (e) => { sftDraft = e.target.value; });
+    const ok = el("button", null, "Save"); ok.type = "button"; ok.addEventListener("click", () => saveSft(p.id, true, inp.value.trim()));
+    const no = el("button", null, "Cancel"); no.type = "button"; no.addEventListener("click", () => { sftEditing = null; sftDraft = ""; render(); });
+    inp.addEventListener("keydown", (e) => { if (e.key === "Enter") ok.click(); if (e.key === "Escape") no.click(); });
+    row.append(inp, ok, no);
+    if (sftFocus) { sftFocus = false; setTimeout(() => inp.focus(), 0); }
+  } else if (editable) {
+    const b = el("button", null, "Mark SFT done"); b.type = "button"; b.setAttribute("aria-label", "Mark SFT done for " + (p.title || p.id));
+    b.addEventListener("click", () => { sftEditing = p.id; sftDraft = ""; sftFocus = true; render(); }); row.append(b);
+  }
+  if (sftError[p.id]) row.append(el("span", "err", sftError[p.id]));
+  return row.childNodes.length ? row : null;
+}
+
+function card(p) {
+  const c = el("article", "card"); c.id = "p-" + p.id;
+  const top = el("div", "top");
+  top.append(el("h3", null, p.title || p.id));
+  const pill = el("span", "pill " + (p.status || "")); pill.append(el("span", "dot"), document.createTextNode(LABEL[p.status] || p.status || "Unknown"));
+  top.append(pill); c.append(top);
+  if (p.description) c.append(el("p", "desc", p.description));
+  if (p.data_type) c.append(el("p", "type", p.data_type));
+  if (p.progress && p.progress.target) {
+    const pr = el("div", "prog"); const tr = el("div", "track"); const f = el("div", "fill");
+    f.style.width = Math.max(0, Math.min(100, 100 * (p.progress.done || 0) / p.progress.target)) + "%"; tr.append(f);
+    pr.append(tr, el("span", "lbl", `${num(p.progress.done)} / ${num(p.progress.target)} ${p.progress.unit || ""}`.trim()));
+    c.append(pr);
+  }
+  if (p.size) c.append(el("div", "size", p.size));
+  if (p.summary) c.append(el("p", null, p.summary));
+  const links = el("div", "links");
+  for (const l of p.links || []) {
+    if (!l || !l.url || !/^https:\/\//.test(l.url)) continue;
+    const a = el("a", null, l.label || "Open"); a.href = l.url; a.target = "_blank"; a.rel = "noopener noreferrer"; links.append(a);
+  }
+  for (const id of p.docs || []) {
+    const b = el("button", null, (docs[id] && docs[id].title) ? docs[id].title : id); b.type = "button";
+    b.addEventListener("click", () => openDoc(id)); links.append(b);
+  }
+  if (links.childNodes.length) c.append(links);
+  if (p.data_location) { const loc = el("div", "loc"); loc.append(el("code", null, p.data_location), copyBtn(p.data_location)); c.append(loc); }
+  const kv = el("dl", "kv");
+  for (const [k, v] of [["Next", p.next_step], ["Code", p.code]]) { if (v) { kv.append(el("dt", null, k), el("dd", null, v)); } }
+  if (kv.childNodes.length) c.append(kv);
+  const sr = sftRow(p); if (sr) c.append(sr);
+  const foot = [p.updated_at ? "Updated " + ago(p.updated_at) : "", p.updated_by ? "by " + p.updated_by : ""].filter(Boolean).join(" ");
+  if (foot) c.append(el("div", "foot", foot));
+  return c;
+}
+
+function render() {
+  const counts = Object.fromEntries(STATUSES.map(([k]) => [k, 0]));
+  projects.forEach((p) => { if (p.status in counts) counts[p.status]++; });
+  const strip = $("strip"); strip.textContent = "";
+  for (const [k, label] of STATUSES) {
+    const b = el("button", "stat " + k); b.type = "button"; b.setAttribute("aria-pressed", String(filter === k));
+    b.append(el("b", null, String(counts[k])), el("span", null, label), el("small", null, HINT[k]));
+    b.addEventListener("click", () => { filter = filter === k ? null : k; try { filter ? localStorage.setItem("dx-filter", filter) : localStorage.removeItem("dx-filter"); } catch (e) {} render(); });
+    strip.append(b);
+  }
+  const nSft = projects.filter((p) => sft[p.id] && sft[p.id].done).length;
+  const sb = el("button", "stat sft"); sb.type = "button"; sb.setAttribute("aria-pressed", String(filter === "sft"));
+  sb.append(el("b", null, String(nSft)), el("span", null, "SFT done"), el("small", null, HINT.sft));
+  sb.addEventListener("click", () => { filter = filter === "sft" ? null : "sft"; try { filter ? localStorage.setItem("dx-filter", filter) : localStorage.removeItem("dx-filter"); } catch (e) {} render(); });
+  strip.append(sb);
+  const q = query.trim().toLowerCase();
+  const inFilter = (p) => !filter || (filter === "sft" ? !!(sft[p.id] && sft[p.id].done) : p.status === filter);
+  const match = (p) => inFilter(p) && (!q || [p.title, p.description, p.data_type, p.summary, p.data_location, p.size, p.group]
+    .filter(Boolean).join(" ").toLowerCase().includes(q));
+  const host = $("sections"); host.textContent = "";
+  let shown = 0;
+  for (const [k, label] of STATUSES) {
+    const rows = projects.filter((p) => p.status === k && match(p)).sort((a, b) => (b.updated_at || "").localeCompare(a.updated_at || ""));
+    if (!rows.length) continue;
+    shown += rows.length;
+    const s = el("section"); const h = el("h2"); const pill = el("span", "pill " + k); pill.append(el("span", "dot"), document.createTextNode(label));
+    h.append(pill, el("span", "count", rows.length + (rows.length === 1 ? " project" : " projects"))); s.append(h);
+    const g = el("div", "grid"); rows.forEach((p) => g.append(card(p))); s.append(g); host.append(s);
+  }
+  const other = projects.filter((p) => !(p.status in counts) && match(p));
+  if (other.length) { const s = el("section"); s.append(el("h2", null, "Other")); const g = el("div", "grid"); other.forEach((p) => g.append(card(p))); s.append(g); host.append(s); shown += other.length; }
+  if (!shown) host.append(el("div", "empty", projects.length ? (filter === "sft" ? "No project is marked SFT done yet." : "No project matches this filter.") : (loadedOnce ? "No projects yet. Each session adds its own row; see the instructions below." : "Loading…")));
+}
+
+$("q").addEventListener("input", (e) => { query = e.target.value; render(); });
+
+// Signed out (401) or not on the access list (403): show the sign-in card instead of the projects. Inside the
+// huggingface.co iframe the browser blocks the sign-in cookie, so the button opens the dashboard in its own tab.
+const framed = (() => { try { return window.top !== window.self; } catch (e) { return true; } })();
+function showGate(status, body) {
+  $("gate").hidden = false; $("strip").hidden = true; $("sections").hidden = true;
+  document.querySelector(".bar").hidden = true;
+  const a = $("signin");
+  if (framed) { a.href = location.origin + "/"; a.target = "_blank"; a.rel = "noopener"; a.textContent = "Open the dashboard in its own tab";
+                $("gtext").textContent = "Signing in doesn't work inside this embedded view. Open the dashboard in its own tab, then sign in with Hugging Face."; }
+  if (status === 403) {
+    $("gtitle").textContent = "You're signed in, but not on the access list";
+    $("gtext").textContent = "Signed in as " + ((body && body.who) || "an unlisted account") + ". Ask the dashboard owner to add your email or Hugging Face username, then sign in again.";
+    $("signout").hidden = false;
+  }
+}
+
+async function load() {
+  try {
+    const r = await fetch("/api/data", { credentials: "same-origin", cache: "no-store" });
+    if (r.status === 401 || r.status === 403) { showGate(r.status, await r.json().catch(() => null)); return; }
+    if (!r.ok) throw new Error(r.status);
+    const d = await r.json();
+    projects = Object.entries(d.projects || {}).map(([id, p]) => Object.assign({ id }, p));
+    docs = d.docs || {}; sft = d.sft || {}; me = d.me || null; loadedOnce = true;
+    $("me").textContent = me ? "Signed in as " + me : ""; $("signout").hidden = !me;
+    $("gate").hidden = true; $("strip").hidden = false; $("sections").hidden = false; document.querySelector(".bar").hidden = false;
+    $("status").textContent = projects.length + " projects · refreshed " + new Date().toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
+  } catch (e) {
+    $("status").textContent = loadedOnce ? "Couldn't refresh. Reload the page if this persists (your sign-in may have expired)."
+                                         : "Couldn't load projects. Reload the page to sign in again.";
+  }
+  if (!sftEditing) render();
+}
+load();
+setInterval(() => { if (!document.hidden) load(); }, 60000);
+document.addEventListener("visibilitychange", () => { if (!document.hidden) load(); });
+render();

app/static/index.html

@@ -0,0 +1,166 @@
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
+<title>Data Experiments</title>
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap">
+<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/12.0.2/marked.min.js" integrity="sha384-/TQbtLCAerC3jgaim+N78RZSDYV7ryeoBCVqTuzRrFec2akfBkHS7ACQ3PQhvMVi" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/dompurify/3.1.6/purify.min.js" integrity="sha384-+VfUPEb0PdtChMwmBcBmykRMDd+v6D/oFmB3rZM/puCMDYcIvF968OimRh4KQY9a" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<style>
+/* Layout: a status strip, a filter bar, then one section per status with a grid of project cards; access guides open in a side reader. */
+:root {
+  --bg: #f3f5f8; --panel: #ffffff; --ink: #16202c; --muted: #5d6a7b; --rule: #dde2ea; --accent: #2a5bd7;
+  --bld: #8a5a00; --bld-bg: #fff2d1; --plt: #6a3fc4; --plt-bg: #f0e9fd; --run: #1d64d8; --run-bg: #e3edff;
+  --don: #18794b; --don-bg: #e2f5ea; --code-bg: #eef1f5; --pau: #8b4a3c; --pau-bg: #fbe9e4;
+  --sft: #0b6e74; --sft-bg: #ddf3f2;
+  --sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
+  --mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
+}
+@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
+  --bg: #0f141b; --panel: #161d27; --ink: #e4e9f1; --muted: #98a4b6; --rule: #283241; --accent: #7ea6ff;
+  --bld: #f0c35a; --bld-bg: #2d2412; --plt: #b99cf7; --plt-bg: #241b38; --run: #7fb0ff; --run-bg: #14233d;
+  --don: #6fd39d; --don-bg: #11281d; --code-bg: #1d2633; --pau: #f0a08c; --pau-bg: #2e1a15;
+  --sft: #5fd4d0; --sft-bg: #0f2a2a; color-scheme: dark } }
+:root[data-theme="dark"] {
+  --bg: #0f141b; --panel: #161d27; --ink: #e4e9f1; --muted: #98a4b6; --rule: #283241; --accent: #7ea6ff;
+  --bld: #f0c35a; --bld-bg: #2d2412; --plt: #b99cf7; --plt-bg: #241b38; --run: #7fb0ff; --run-bg: #14233d;
+  --don: #6fd39d; --don-bg: #11281d; --code-bg: #1d2633; --pau: #f0a08c; --pau-bg: #2e1a15;
+  --sft: #5fd4d0; --sft-bg: #0f2a2a; color-scheme: dark }
+body { background: var(--bg); color: var(--ink); font: 15px/1.5 var(--sans);
+  padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); padding-block: 26px 56px; }
+main { max-width: 1180px; margin: 0 auto; display: flex; flex-direction: column; gap: 26px; }
+h1, h2, h3 { margin: 0; text-wrap: balance; font-weight: 600; }
+h1 { font-size: 1.85rem; line-height: 1.15; letter-spacing: -0.01em; }
+h2 { font-size: 1.05rem; display: flex; align-items: center; gap: 10px; }
+h3 { font-size: 1.02rem; line-height: 1.3; }
+p { margin: 0; max-width: 72ch; }
+.lede { color: var(--muted); }
+.strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); gap: 10px; }
+.stat { background: var(--panel); border: 1px solid var(--rule); border-radius: 10px; padding: 12px 14px; display: flex; flex-direction: column; gap: 2px;
+  cursor: pointer; text-align: left; font: inherit; color: inherit; }
+.stat b { font: 600 1.6rem/1.1 var(--mono); font-variant-numeric: tabular-nums; }
+.stat span { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
+.stat small { font-size: .78rem; line-height: 1.35; color: var(--muted); margin-top: 4px; }
+.stat[aria-pressed="true"] { outline: 2px solid var(--accent); outline-offset: -1px; }
+.stat.building b { color: var(--bld); } .stat.pilot_ready b { color: var(--plt); } .stat.prod_running b { color: var(--run); } .stat.prod_done b { color: var(--don); }
+.stat.prod_paused b { color: var(--pau); } .stat.sft b { color: var(--sft); }
+.bar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
+.bar input { font: inherit; color: var(--ink); background: var(--panel); border: 1px solid var(--rule); border-radius: 8px; padding: 7px 10px; min-width: 0; flex: 1 1 220px; max-width: 360px; }
+.bar .note { color: var(--muted); font-size: .85rem; }
+button:focus-visible, input:focus-visible, a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
+section { display: flex; flex-direction: column; gap: 12px; }
+.count { font: 500 .8rem var(--mono); color: var(--muted); }
+.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 14px; }
+.card { background: var(--panel); border: 1px solid var(--rule); border-radius: 12px; padding: 16px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
+.top { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
+.pill { flex: none; font: 600 .72rem var(--sans); text-transform: uppercase; letter-spacing: .06em; padding: 3px 9px; border-radius: 999px; white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; }
+.pill.building { background: var(--bld-bg); color: var(--bld); } .pill.pilot_ready { background: var(--plt-bg); color: var(--plt); }
+.pill.prod_running { background: var(--run-bg); color: var(--run); } .pill.prod_done { background: var(--don-bg); color: var(--don); }
+.pill.prod_paused { background: var(--pau-bg); color: var(--pau); }
+.sftrow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: .84rem; }
+.sftbadge { font: 600 .74rem var(--sans); text-transform: uppercase; letter-spacing: .06em; padding: 3px 9px; border-radius: 999px; background: var(--sft-bg); color: var(--sft); }
+.sftrow .who { color: var(--muted); }
+.sftrow .sftnote { flex-basis: 100%; color: var(--ink); overflow-wrap: anywhere; }
+.sftrow button { font: 500 .8rem var(--sans); color: var(--sft); background: transparent; border: 1px solid var(--rule); border-radius: 999px; padding: 3px 10px; cursor: pointer; }
+.sftrow button:hover { border-color: var(--sft); }
+.sftrow input { font: inherit; font-size: .85rem; color: var(--ink); background: var(--bg); border: 1px solid var(--rule); border-radius: 8px; padding: 5px 8px; flex: 1 1 200px; min-width: 0; }
+.sftrow .err { flex-basis: 100%; color: var(--pau); }
+.dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
+.pill.prod_running .dot { animation: pulse 1.6s ease-in-out infinite; }
+@keyframes pulse { 50% { opacity: .25; } }
+@media (prefers-reduced-motion: reduce) { .pill.prod_running .dot { animation: none; } }
+.desc { font-size: .95rem; line-height: 1.45; }
+.type { color: var(--muted); font-size: .86rem; }
+.size { font: 500 .9rem var(--mono); font-variant-numeric: tabular-nums; }
+.prog { display: flex; flex-direction: column; gap: 4px; }
+.track { height: 8px; background: var(--code-bg); border-radius: 999px; overflow: hidden; }
+.fill { height: 100%; background: var(--run); border-radius: 999px; }
+.prog .lbl { font: .8rem var(--mono); color: var(--muted); font-variant-numeric: tabular-nums; }
+.links { display: flex; flex-wrap: wrap; gap: 8px; }
+.links a, .links button { font: 500 .82rem var(--sans); color: var(--accent); background: transparent; border: 1px solid var(--rule); border-radius: 999px; padding: 4px 11px; text-decoration: none; cursor: pointer; }
+.links a:hover, .links button:hover { border-color: var(--accent); }
+.loc { display: flex; gap: 8px; align-items: center; min-width: 0; }
+.loc code { font: .78rem var(--mono); background: var(--code-bg); padding: 3px 7px; border-radius: 6px; overflow-wrap: anywhere; min-width: 0; }
+.loc button { flex: none; font: .75rem var(--sans); color: var(--muted); background: transparent; border: 1px solid var(--rule); border-radius: 6px; padding: 2px 8px; cursor: pointer; }
+.kv { display: grid; grid-template-columns: auto 1fr; gap: 3px 10px; font-size: .86rem; }
+.kv dt { color: var(--muted); } .kv dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
+.foot { font-size: .78rem; color: var(--muted); border-top: 1px solid var(--rule); padding-top: 8px; }
+.empty { background: var(--panel); border: 1px dashed var(--rule); border-radius: 12px; padding: 22px; color: var(--muted); }
+.howto { background: var(--panel); border: 1px solid var(--rule); border-radius: 12px; padding: 16px; display: flex; flex-direction: column; gap: 8px; }
+.howto code { font: .82rem var(--mono); background: var(--code-bg); padding: 1px 5px; border-radius: 4px; }
+.reader { position: fixed; inset: 0; background: color-mix(in srgb, var(--ink) 35%, transparent); display: flex; justify-content: flex-end; z-index: 20; }
+.reader[hidden] { display: none !important; }
+.sheet { background: var(--panel); width: min(860px, 100%); height: 100%; display: flex; flex-direction: column; border-left: 1px solid var(--rule);
+  padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); padding-right: env(safe-area-inset-right, 0px); }
+.sheet header { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--rule); }
+.sheet header .path { font: .78rem var(--mono); color: var(--muted); overflow-wrap: anywhere; }
+.sheet header button { font: 500 .85rem var(--sans); color: var(--ink); background: var(--bg); border: 1px solid var(--rule); border-radius: 8px; padding: 6px 12px; cursor: pointer; flex: none; }
+.md { overflow: auto; padding: 18px 22px 40px; line-height: 1.6; }
+.md h1 { font-size: 1.4rem; margin: .2em 0 .6em; } .md h2 { font-size: 1.15rem; margin: 1.3em 0 .5em; display: block; } .md h3 { font-size: 1rem; margin: 1.1em 0 .4em; }
+.md p, .md ul, .md ol { margin: .5em 0; max-width: 78ch; }
+.md table { border-collapse: collapse; font-size: .88rem; display: block; overflow-x: auto; max-width: 100%; margin: .7em 0; }
+.md th, .md td { border: 1px solid var(--rule); padding: 5px 9px; text-align: left; vertical-align: top; }
+.md th { background: var(--code-bg); font-weight: 600; }
+.md code { font: .85em var(--mono); background: var(--code-bg); padding: 1px 5px; border-radius: 4px; }
+.md pre { background: var(--code-bg); padding: 12px 14px; border-radius: 8px; overflow-x: auto; }
+.md pre code { background: none; padding: 0; }
+.md a { color: var(--accent); }
+.md blockquote { border-left: 3px solid var(--rule); margin: .6em 0; padding: .1em 0 .1em 12px; color: var(--muted); }
+
+.who-am-i { color: var(--muted); font-size: .82rem; }
+.who-am-i a { color: var(--accent); margin-left: 6px; }
+.gate { border: 1px solid var(--rule); border-radius: 12px; background: var(--panel); padding: 20px 22px; display: flex; flex-direction: column; gap: 8px; max-width: 640px; }
+.gate h2 { margin: 0; font-size: 1.15rem; }
+.gate p { margin: 0; }
+.gate a.signin { display: inline-block; font-weight: 600; color: var(--panel); background: var(--accent); text-decoration: none; padding: 8px 14px; border-radius: 9px; }
+.build { font: .72rem var(--mono); color: var(--muted); }
+</style>
+</head>
+<body>
+<main>
+  <header style="display:flex;flex-direction:column;gap:8px">
+    <h1>Data Experiments</h1>
+    <p class="lede">Every data type we are building, piloting or producing: what it is, where it stands, the pilot to listen to, and how to get the production data. Sessions keep their own rows up to date.</p>
+    <span class="who-am-i"><span id="me"></span> <a id="signout" href="/logout" hidden>Sign out</a></span>
+  </header>
+
+  <div class="gate" id="gate" hidden>
+    <h2 id="gtitle">Sign in to see the projects</h2>
+    <p id="gtext">This dashboard is for the Extrian team and invited collaborators. Sign in with your Hugging Face account; a free one works.</p>
+    <p><a class="signin" id="signin" href="/login">Sign in with Hugging Face</a></p>
+    <p class="note" id="gnote">No access after signing in? Ask the dashboard owner to add your email or Hugging Face username.</p>
+  </div>
+
+  <div class="strip" id="strip"></div>
+
+  <div class="bar">
+    <input id="q" type="search" placeholder="Search titles, data types, locations" aria-label="Search projects">
+    <span class="note" id="status">Loading projects…</span>
+  </div>
+
+  <div id="sections" style="display:flex;flex-direction:column;gap:26px">
+    <div class="empty" id="empty">Projects will appear here as each session adds its row. Nothing has loaded yet.</div>
+  </div>
+
+  <div class="howto">
+    <h2>Add or update a project</h2>
+    <p>Each project is one JSON record under <code>projects/&lt;slug&gt;</code>, with access guides under <code>docs/&lt;id&gt;</code>. A session updates its own record with <code>python dataops/experiments_db.py</code>, and this page picks it up within a minute. Full instructions, fields and examples are in <code>DATA_EXPERIMENTS_DASHBOARD.md</code> at the root of the data-processing-tts repo.</p>
+    <p>Trained on a dataset? Press <b>Mark SFT done</b> on its card and add a note (the run name or result). Anyone signed in can mark or undo it; everyone sees who marked it and when.</p>
+    <span class="build">build 412dabf8</span>
+  </div>
+</main>
+
+<div class="reader" id="reader" hidden>
+  <div class="sheet" role="dialog" aria-modal="true" aria-labelledby="rtitle">
+    <header>
+      <div style="display:flex;flex-direction:column;gap:2px;min-width:0"><b id="rtitle"></b><span class="path" id="rpath"></span></div>
+      <button type="button" id="rclose">Close</button>
+    </header>
+    <div class="md" id="rbody"></div>
+  </div>
+</div>
+<script src="/app.js"></script>
+</body>
+</html>

requirements.txt

@@ -0,0 +1,6 @@
+fastapi==0.115.6
+uvicorn==0.32.1
+boto3==1.35.90
+itsdangerous==2.2.0
+httpx==0.28.1
+huggingface_hub==0.34.4