Fiber Checker: page, checker, free judge weights and pictures

.gitattributes

@@ -33,3 +33,6 @@ saved_model/**/* filter=lfs diff=lfs merge=lfs -text
 *.zip filter=lfs diff=lfs merge=lfs -text
 *.zst filter=lfs diff=lfs merge=lfs -text
 *tfevents* filter=lfs diff=lfs merge=lfs -text
+assets/hero.webp filter=lfs diff=lfs merge=lfs -text
+assets/howto-check.gif filter=lfs diff=lfs merge=lfs -text
+assets/howto-game.gif filter=lfs diff=lfs merge=lfs -text

app.py

@@ -37,6 +37,7 @@ OUT = Path(tempfile.gettempdir()) / "fiber-checker-out"
 CT_CACHE = C.CACHE / "ct"
 CT_KEEP = int(8e9)                  # CT chunks kept between runs; the oldest go first
 GAME = HERE / "assets" / "game.npz"
+GUIDE = HERE / "guide" / "index.html"
 CONNECT_HTML = HERE / "connect.html"
 PATCHES = [("Quick: 60 patches, about 2 minutes", 60), ("Thorough: 150 patches, about 5 minutes", 150),
            ("Whole segment: up to 400 patches, about 15 minutes", 400)]
@@ -243,6 +244,34 @@ def compare_results(a_json, b_json):
 
 # ---------------------------------------------------------------- what the page shows
 
+def compare_html(res):
+    """compare_results' answer as two columns, with the better side of each row marked."""
+    def name(v):
+        if isinstance(v, dict):
+            v = " · ".join(str(v[k]) for k in ("sample", "name", "volume") if v.get(k))
+        v = str(v or "?").rstrip("/").rsplit("/", 1)[-1]     # a mesh path: its folder name, not where it was cached
+        return html.escape(v.rsplit("_mesh_", 1)[-1])
+    rows = [("Patches checked", "patches", lambda v: f"{v}", None),
+            ("Fibers show on", "share_fibers_visible", pct, 1),
+            ("Median fiber evidence", "median_evidence", lambda v: f"{v:.2f}", 1),
+            ("Unsure", "share_unsure", pct, -1)]
+    body = []
+    for label, k, fmt, better in rows:
+        a, b = res["summary"][k]
+        cells = [fmt(v) if v is not None else "n/a" for v in (a, b)]
+        if better and a is not None and b is not None and abs(a - b) > 0.02:
+            win = 0 if (a - b) * better > 0 else 1
+            cells[win] = f"<b>{cells[win]}</b> ◀"
+        body.append(f"<tr><td>{label}</td><td>{cells[0]}</td><td>{cells[1]}</td></tr>")
+    pr = res.get("paired_same_grid")
+    paired = (f"<p class='fc-meta'>Same mesh grid, {pr['patches']} patches in both: A clearly better on "
+              f"{pct(pr['a_better'])}, B on {pct(pr['b_better'])}, mean difference {pr['mean_diff']:+.3f} (A minus B)."
+              "</p>" if pr else "<p class='fc-meta'>Different mesh grids, so the summaries are compared, not patch "
+              "by patch.</p>")
+    return (f"<table class='fc-cmp'><thead><tr><th></th><th>A<span>{name(res.get('a'))}</span></th>"
+            f"<th>B<span>{name(res.get('b'))}</span></th></tr></thead><tbody>{''.join(body)}</tbody></table>{paired}")
+
+
 def pct(v):
     return "n/a" if v is None or v != v else f"{v:.0%}"
 
@@ -277,7 +306,7 @@ def summary_html(rec):
  · {setting} · judge: {'free local model' if rec['judge'] == 'local' else 'Claude, your key'}{cost}</p>
 <details class="fc-untested"><summary>Untested hints ({jumps} possible jumps)</summary>
 <p>These have not passed a test of their own yet, so read them as ideas, not results.
-<b>Jump hints</b>: {jumps} patches with low evidence where every neighbour is clear, which can mark a sheet jump or a
+<b>Jump hints</b>: {jumps} patches with low evidence where every neighbor is clear, which can mark a sheet jump or a
 stretch off the sheet. <b>Fiber direction</b>: {pct(s['direction_share_horizontal'])} of patches have strands
 running along the mesh's columns (horizontal in the map), the rest along its rows. <b>Best depth</b>: the median
 patch looks most fibrous {s['depth_offset_median']:+g} voxels from the traced surface.</p></details>
@@ -289,6 +318,40 @@ def tiles_of(out):
     return [(str(f), f"{f.stem.split('-')[-1]} {f.stem.split('-')[1]}") for f in files]
 
 
+def with_figures(text):
+    """Fill the guides' [[fig NAME | caption]] slots with the pictures in assets/ (tools/build_media.py); a slot whose
+    picture this copy lacks is dropped, so the guides read the same without them."""
+    out, rest = [], text
+    while "[[fig " in rest:
+        head, _, tail = rest.partition("[[fig ")
+        spec, _, rest = tail.partition("]]")
+        name, _, caption = (x.strip() for x in spec.partition("|"))
+        out.append(head)
+        if (HERE / "assets" / name).is_file():
+            alt = html.escape(" ".join(caption.split()), quote=True)
+            out.append(f'<figure><img src="/gradio_api/file=assets/{name}" alt="{alt}" loading="lazy">'
+                       f'<figcaption>{html.escape(" ".join(caption.split()))} Recorded on public scrolls on no prize '
+                       'list.</figcaption></figure>')
+    return "".join(out) + rest
+
+
+def guide_html():
+    """The welcome page, its pictures read from this Space's assets/ folder (tools/build_media.py)."""
+    if not GUIDE.is_file():
+        return "<p>The welcome page is missing from this copy.</p>"
+    page = GUIDE.read_text()
+    # its pictures point at Gradio's file route (a <base> cannot do it); in-page anchors scroll inside the frame,
+    # ?tab= links switch the Space's tabs, other links open a new tab (as Lasagna Fields does)
+    page = page.replace("'assets/", "'/gradio_api/file=assets/").replace('"assets/', '"/gradio_api/file=assets/')
+    fix = ('<script>document.addEventListener("click",function(e){var a=e.target.closest&&e.target.closest("a");'
+           'if(!a)return;var h=a.getAttribute("href")||"";if(h.charAt(0)==="#"){e.preventDefault();'
+           'var t=document.getElementById(h.slice(1));if(t)t.scrollIntoView({behavior:"smooth"});}'
+           'else if(h.indexOf("?tab=")===0){e.preventDefault();window.parent.postMessage({fcTab:h.slice(5)},"*");}'
+           'else if(/^https?:/.test(h)){a.target="_blank";a.rel="noopener";}},true);</script>')
+    page = page.replace("<head>", "<head>" + fix, 1)
+    return f'<iframe title="Fiber Checker" srcdoc="{html.escape(page, quote=True)}"></iframe>'
+
+
 def report_frame(out):
     page = (Path(out) / "report.html").read_text()
     return f'<iframe class="fc-report" title="Report" srcdoc="{html.escape(page, quote=True)}"></iframe>'
@@ -442,6 +505,10 @@ texture: it never reads or finds text.
    judges them on the CPU.
 3. The map, the summary and the download appear on the right. Try the **Fiber or not?** tab while you wait.
 
+[[fig howto-check.gif | A check from start to finish, sped up: pick an example, press Check fibers, read the map.]]
+
+[[fig howto-game.gif | Fiber or not?: say which render shows fibers, then see what the free judge said.]]
+
 <h3 id="read">2. Read the result</h3>
 
 - **The map** is the segment as traced, flattened on its own mesh grid. Yellow and green: clear fibers. Purple: weak.
@@ -452,18 +519,25 @@ texture: it never reads or finds text.
 - **Unsure**: the judge's answer changed when the patch was turned by a quarter turn.
 - **Clearest and weakest patches** are the renders themselves, so you can see what the judge saw.
 
+[[fig howto-result.webp | A finished check: the map, the summary with its self-check, and the download.]]
+
 <h3 id="own">3. Check your own trace</h3>
 
 Zip your tifxyz folder (x.tif, y.tif and z.tif; VC3D and villa write these) and upload it on **Check a segment**,
 under **Your own mesh**, with the 14-digit id of the scan its coordinates are in (level-0 voxels). The Space reads the
 CT of that scan from the open data. Meshes on 2.2 to 2.4 um scans are checked in the tested setting.
 
+[[fig howto-upload.webp | Your own mesh: the zip goes in the box, the scan id below it.]]
+
 <h3 id="ab">4. Compare two traces</h3>
 
 Check both (two segments, or your trace before and after an edit), download each zip, and give the two
 `fiber.json` files to **Compare**. When both are meshes of the same grid, it compares them patch by patch: the share
 of patches where each is clearly better, and the mean difference.
 
+[[fig howto-compare.gif | Two fiber.json files in, a side-by-side table out. These two are checks of the same segment on
+two scans, whose meshes have different grids, so the summaries are compared.]]
+
 <h3 id="prize">5. For prize entries</h3>
 
 `report.html` in the download is a one-page summary in the prize's words: the map, the self-check, the clearest and
@@ -507,7 +581,7 @@ the segment in tools that read tifxyz channels. `--judge claude` uses `ANTHROPIC
 - **Outside the tested setting** (other voxel sizes, your own meshes at other spacings): it still runs, and says so.
 - **Untested hints**: jump hints, fiber direction and best depth are ideas until a test of their own passes.
 - **Which sheet**: each patch is rendered at the brightest depth within 5 voxels of the trace (the tested rule), and
-  papyrus sheets lie close together, so a trace a few voxels off, or on the neighbouring sheet, can still show fibers.
+  papyrus sheets lie close together, so a trace a few voxels off, or on the neighboring sheet, can still show fibers.
   A clear map says fibers show on and near your surface; it does not prove the trace stayed on one sheet.
 
 <h3 id="wrong">When something goes wrong</h3>
@@ -569,6 +643,19 @@ CSS = """
 .fc-legend { font-size:12.5px; color: var(--body-text-color-subdued); }
 .fc-legend i { display:inline-block; width:11px; height:11px; border-radius:3px; margin:0 4px -1px 10px; }
 .fc-report { width:100%; height:80vh; border:0; border-radius:12px; }
+.fc-guide iframe { width:100%; height:calc(100vh - 150px); min-height:640px; border:0; border-radius:12px;
+  background:#f6f1e7; }
+.fc-howto img { border-radius:10px; border:1px solid var(--border-color-primary); max-width:min(100%, 820px);
+  display:block; margin:10px 0 4px; }
+.fc-howto figure { margin:10px 0 18px; } .fc-howto figcaption { font-size:13px; color: var(--body-text-color-subdued); }
+.fc-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; max-width:820px; margin:10px 0; }
+.fc-strip img { width:100%; margin:0; aspect-ratio:1; object-fit:cover; }
+.fc-strip span { display:block; font-size:12.5px; color: var(--body-text-color-subdued); margin-top:4px; }
+.fc-drop .wrap { padding:14px 10px !important; gap:4px !important; line-height:1.35 !important; }
+.fc-cmp { width:100%; max-width:820px; border-collapse:collapse; font-size:15px; margin-top:6px; }
+.fc-cmp th, .fc-cmp td { text-align:left; padding:9px 12px; border-bottom:1px solid var(--border-color-primary); }
+.fc-cmp th span { display:block; font-weight:400; font-size:12.5px; color: var(--body-text-color-subdued); }
+.fc-cmp td:not(:first-child) { font-variant-numeric: tabular-nums; }
 .fc-howto { max-width: 1000px; margin: 0 auto !important; }
 .fc-howto h3 { scroll-margin-top: 16px; margin-top: 1.6em !important; }
 .fc-toc { font-size: 14px; line-height: 1.9; padding: 10px 14px; border-radius: 10px;
@@ -582,6 +669,8 @@ CSS = """
   .fc-head h1 { font-size:24px; }
   .fc-head span { display:none; }
   #fc-tabs .tab-container button { padding:6px 6px !important; font-size:12.5px !important; }
+  .fc-guide iframe { height:calc(100vh - 120px); min-height:520px; }
+  .fc-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
 }
 """
 
@@ -602,10 +691,14 @@ model or by Claude with your own key. Model output, not a reading.">
 TAB_JS = """
 () => {
   const pick = (name) => {
-    const ids = {check: 0, game: 1, compare: 2, howto: 3, agents: 4};
-    const btns = document.querySelectorAll('#fc-tabs button[role="tab"]');
-    if (name in ids && btns[ids[name]]) btns[ids[name]].click();
+    // by label: on a phone the later tabs sit in Gradio's overflow menu, as buttons without role="tab"
+    const labels = {home: 'Welcome', check: 'Check a segment', game: 'Fiber or not?', compare: 'Compare',
+                    howto: 'How-to guides', agents: 'Agents and API'};
+    const btns = [...document.querySelectorAll('#fc-tabs button')].filter((b) => b.textContent.trim() === labels[name]);
+    const btn = btns.find((b) => b.getAttribute('role') === 'tab') || btns[btns.length - 1];
+    if (btn) btn.click();
   };
+  window.addEventListener('message', (e) => { if (e.data && e.data.fcTab) pick(e.data.fcTab); });
   const q = new URLSearchParams(window.location.search).get('tab');
   if (q) setTimeout(() => pick(q), 300);
 }
@@ -721,6 +814,8 @@ def build_demo():
         gr.HTML('<div class="fc-head"><div class="weave"></div><h1>Fiber Checker</h1><span>Are papyrus fibers '
                 'visible on a traced scroll surface? A free fiber map of any segment, patch by patch.</span></div>')
         with gr.Tabs(elem_id="fc-tabs"):
+            with gr.Tab("Welcome", id="home"):
+                gr.HTML(guide_html(), elem_classes="fc-guide")
             with gr.Tab("Check a segment", id="check"):
                 gr.Markdown(INTRO)
                 with gr.Row(equal_height=False):
@@ -738,7 +833,7 @@ def build_demo():
                                 go = gr.Button("Check fibers", variant="primary", size="lg")
                             with gr.Tab("Your own mesh"):
                                 upload = gr.File(label="Zip of your tifxyz folder (x.tif, y.tif, z.tif)",
-                                                 file_types=[".zip"], type="filepath", height=100)
+                                                 file_types=[".zip"], type="filepath")
                                 up_vol = gr.Textbox(label="14-digit scan id its coordinates are in (level-0 voxels)",
                                                     placeholder="20250526151718")
                                 go_up = gr.Button("Check my mesh", variant="primary", size="lg")
@@ -785,12 +880,14 @@ def build_demo():
                 gr.Markdown("Give two `fiber.json` files (from the downloads, or the command line tool): two "
                             "segments, two tracers, or one trace before and after an edit.")
                 with gr.Row():
-                    ca = gr.File(label="A: fiber.json", file_types=[".json"], type="filepath", height=100)
-                    cb = gr.File(label="B: fiber.json", file_types=[".json"], type="filepath", height=100)
+                    ca = gr.File(label="A: fiber.json", file_types=[".json"], type="filepath", elem_classes="fc-drop")
+                    cb = gr.File(label="B: fiber.json", file_types=[".json"], type="filepath", elem_classes="fc-drop")
                 cgo = gr.Button("Compare", variant="primary")
-                cout = gr.JSON(label="Side by side")
+                cside = gr.HTML()
+                with gr.Accordion("Record (JSON)", open=False):
+                    cout = gr.JSON(label="Side by side")
             with gr.Tab("How-to guides", id="howto"):
-                gr.Markdown(HOW_TO, elem_classes="fc-howto")
+                gr.Markdown(with_figures(HOW_TO), elem_classes="fc-howto")
             with gr.Tab("Agents and API", id="agents"):
                 gr.Markdown(AGENTS.format(host=host))
                 with gr.Accordion("Connect your tool: the scans and meshes by URL", open=True):
@@ -826,7 +923,10 @@ def build_demo():
         game_tab.select(guard(first_pair), st, [img_a, img_b, reveal, score_md, st], **hidden)
         pick_a.click(lambda s: answer("A", s), st, [reveal, score_md, st], **hidden)
         pick_b.click(lambda s: answer("B", s), st, [reveal, score_md, st], **hidden)
-        cgo.click(guard(compare_results), [ca, cb], cout, **hidden)
+        def on_compare(a, b):
+            res = compare_results(a, b)
+            return compare_html(res), res
+        cgo.click(guard(on_compare), [ca, cb], [cside, cout], **hidden)
 
         def api_check(sample_, segment_, volume_, patches_, request: gr.Request, progress=gr.Progress()):
             return check_segment(sample_, segment_, volume_, int(patches_ or 60), request=request, progress=progress)
@@ -861,6 +961,10 @@ def fix_mcp_multiple_outputs():
 
 
 def launch_kwargs():
+    import gradio as gr
+    if (HERE / "assets").is_dir():
+        gr.set_static_paths(paths=[str(HERE / "assets")])
+    os.chdir(HERE)                     # the welcome page's assets/... resolve against the Space's folder
     return dict(theme=theme(), css=CSS, head=HEAD, footer_links=["api", "gradio"], mcp_server=True,
                 max_file_size="200mb", allowed_paths=[str(OUT)])
 

assets/map-summary.json

@@ -0,0 +1 @@
+{"patches": 60, "median_evidence": 0.988, "share_fibers_visible": 1.0, "share_unsure": 0.0, "self_check": {"against": {"noise": 1.0, "blur": 1.0, "scramble": 1.0}, "passed": true}, "depth_offset_median": 0.0, "direction_share_horizontal": 0.517}

assets/media.json

@@ -0,0 +1,61 @@
+{
+ "note": "Renders of the Vesuvius Challenge open data (CC BY-NC 4.0) along open-data meshes of public scrolls on no prize list, made by fibercheck's renderer. Not model output except map.png.",
+ "pictures": {
+  "hero.webp": [
+   "PHerc0500P2 \u00b7 scan 20250526151718 \u00b7 segment 20250611171318 \u00b7 patch r252 c252 (judge 0.99)",
+   "PHerc0814 \u00b7 scan 20260309142202 \u00b7 segment 20250925161630 \u00b7 patch r168 c672 (judge 1.00)",
+   "PHerc0343P \u00b7 scan 20260304131111 \u00b7 segment 20250902170447 \u00b7 patch r196 c252 (judge 0.99)",
+   "PHerc0139 \u00b7 scan 20260102150214 \u00b7 segment 20250108000005 \u00b7 patch r868 c392 (judge 0.96)",
+   "PHerc0814 \u00b7 scan 20260309142202 \u00b7 segment 20250925161630 \u00b7 patch r336 c420 (judge 1.00)",
+   "PHerc0500P2 \u00b7 scan 20250526151718 \u00b7 segment 20250611171318 \u00b7 patch r28 c196 (judge 0.99)",
+   "PHerc0343P \u00b7 scan 20260304131111 \u00b7 segment 20250902170447 \u00b7 patch r448 c336 (judge 0.95)",
+   "PHerc0009B \u00b7 scan 20250820154339 \u00b7 segment 20250919064353 \u00b7 patch r868 c532 (judge 1.00)",
+   "PHerc0500P2 \u00b7 scan 20250526151718 \u00b7 segment 20250611171318 \u00b7 patch r364 c308 (judge 0.99)",
+   "PHerc0814 \u00b7 scan 20260309142202 \u00b7 segment 20250925161630 \u00b7 patch r616 c1008 (judge 1.00)",
+   "PHerc0343P \u00b7 scan 20260304131111 \u00b7 segment 20250902170447 \u00b7 patch r28 c112 (judge 0.99)",
+   "PHerc0139 \u00b7 scan 20260102150214 \u00b7 segment 20250108000005 \u00b7 patch r980 c896 (judge 0.99)",
+   "PHerc0500P2 \u00b7 scan 20250526151718 \u00b7 segment 20250611171318 \u00b7 patch r364 c140 (judge 1.00)",
+   "PHerc0814 \u00b7 scan 20260309142202 \u00b7 segment 20250925161630 \u00b7 patch r336 c2772 (judge 1.00)",
+   "PHerc0343P \u00b7 scan 20260304131111 \u00b7 segment 20250902170447 \u00b7 patch r532 c420 (judge 0.97)",
+   "PHerc0009B \u00b7 scan 20250820154339 \u00b7 segment 20250919064353 \u00b7 patch r784 c924 (judge 1.00)",
+   "PHerc0500P2 \u00b7 scan 20250526151718 \u00b7 segment 20250611171318 \u00b7 patch r420 c308 (judge 0.96)",
+   "PHerc0814 \u00b7 scan 20260309142202 \u00b7 segment 20250925161630 \u00b7 patch r308 c3136 (judge 0.89)",
+   "PHerc0343P \u00b7 scan 20260304131111 \u00b7 segment 20250902170447 \u00b7 patch r84 c196 (judge 1.00)",
+   "PHerc0139 \u00b7 scan 20260102150214 \u00b7 segment 20250108000005 \u00b7 patch r700 c504 (judge 0.99)",
+   "PHerc0500P2 \u00b7 scan 20250526151718 \u00b7 segment 20250611171318 \u00b7 patch r84 c252 (judge 0.99)",
+   "PHerc0814 \u00b7 scan 20260309142202 \u00b7 segment 20250925161630 \u00b7 patch r700 c2268 (judge 0.98)",
+   "PHerc0343P \u00b7 scan 20260304131111 \u00b7 segment 20250902170447 \u00b7 patch r336 c140 (judge 0.98)",
+   "PHerc0009B \u00b7 scan 20250820154339 \u00b7 segment 20250919064353 \u00b7 patch r1092 c840 (judge 1.00)"
+  ],
+  "pair-0-*.webp": "PHerc0500P2 \u00b7 scan 20250526151718 \u00b7 segment 20250611171318 \u00b7 patch r252 c252",
+  "pair-1-*.webp": "PHerc0343P \u00b7 scan 20260304131111 \u00b7 segment 20250902170447 \u00b7 patch r532 c420",
+  "pair-2-*.webp": "PHerc0139 \u00b7 scan 20260102150214 \u00b7 segment 20250108000005 \u00b7 patch r868 c392",
+  "map.png": {
+   "model_output": true,
+   "segment": "/tmp/fiber-checker/meshes/vesuvius-challenge-open-data.s3.us-east-1.amazonaws.com_PHerc0139_segments_20250108000005-w030_2025010818_mesh_20250108000005-on-20260102150214-2.399um.tifxyz",
+   "ct": "https://vesuvius-challenge-open-data.s3.us-east-1.amazonaws.com/PHerc0139/volumes/20260102150214-2.399um-0.2m-78keV-masked.zarr/",
+   "summary": {
+    "patches": 60,
+    "median_evidence": 0.988,
+    "share_fibers_visible": 1.0,
+    "share_unsure": 0.0,
+    "self_check": {
+     "against": {
+      "noise": 1.0,
+      "blur": 1.0,
+      "scramble": 1.0
+     },
+     "passed": true
+    },
+    "depth_offset_median": 0.0,
+    "direction_share_horizontal": 0.517
+   }
+  },
+  "ui.webp": "interface screenshot of the Check tab with a finished check (PHerc0139 w030)",
+  "howto-check.gif": "interface recording of the check guide at 1100 px (public scrolls on no prize list)",
+  "howto-game.gif": "interface recording of the game guide at 1100 px (public scrolls on no prize list)",
+  "howto-compare.gif": "interface recording of the compare guide at 1100 px (public scrolls on no prize list)",
+  "howto-result.webp": "interface screenshot (result, PHerc0139 w030)",
+  "howto-upload.webp": "interface screenshot (upload, PHerc0139 w030)"
+ }
+}

guide/index.html

@@ -0,0 +1,204 @@
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>Fiber Checker</title>
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link href="https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600;9..144,650&family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
+<style>
+:root{--bg:#f6f1e7;--card:#fffdf8;--ink:#2a2118;--ink2:#5e5144;--ink3:#857767;--line:#e3d7c3;--accent:#9a5b1f;--accent2:#6b3b16;--shadow:0 1px 2px rgba(60,40,20,.06),0 6px 20px rgba(60,40,20,.06)}
+@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#14120f;--card:#1f1c18;--ink:#f1e9dc;--ink2:#c9bba8;--ink3:#9c8f7e;--line:#332e28;--accent:#d89a52;--accent2:#e8b273;--shadow:0 1px 2px rgba(0,0,0,.3)}}
+:root[data-theme="dark"]{--bg:#14120f;--card:#1f1c18;--ink:#f1e9dc;--ink2:#c9bba8;--ink3:#9c8f7e;--line:#332e28;--accent:#d89a52;--accent2:#e8b273;--shadow:0 1px 2px rgba(0,0,0,.3)}
+*{box-sizing:border-box}
+html{scroll-behavior:smooth}
+body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 Inter,system-ui,sans-serif}
+a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
+h1,h2,h3{font-family:Fraunces,Georgia,serif;font-weight:650;letter-spacing:-.01em;line-height:1.15}
+h2{font-size:clamp(28px,3.4vw,38px);margin:0 0 10px}
+h3{font-size:20px;margin:0 0 6px}
+.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
+nav{position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
+nav .wrap{display:flex;align-items:center;gap:18px;height:52px}
+.brand{font-family:Fraunces,serif;font-weight:650;font-size:18px;color:var(--ink);white-space:nowrap}
+.navlinks{display:flex;gap:18px;overflow-x:auto;scrollbar-width:none;flex:1}
+.navlinks a{color:var(--ink2);font-size:14px;white-space:nowrap}
+header.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line);min-height:560px}
+.hero .photos{position:absolute;top:0;right:0;bottom:0;width:62%;background:url('assets/hero.webp') center/cover no-repeat;filter:sepia(.35) saturate(1.1)}
+.hero:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,var(--bg) 0,var(--bg) 40%,color-mix(in srgb,var(--bg) 82%,transparent) 54%,color-mix(in srgb,var(--bg) 25%,transparent) 76%,transparent 100%)}
+.hero .wrap{position:relative;z-index:2;padding-top:72px;padding-bottom:64px}
+.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:600;color:var(--accent)}
+.hero h1{font-size:clamp(36px,5.6vw,64px);max-width:700px;margin:12px 0 18px}
+.lede{font-size:19px;max-width:600px;margin:0}
+.by{margin-top:18px;color:var(--ink2);font-size:15px}.by b{color:var(--ink)}
+.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:36px;max-width:720px}
+.stat{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px;box-shadow:var(--shadow)}
+.stat b{display:block;font-family:Fraunces,serif;font-size:28px;font-weight:650;line-height:1.1}
+.stat span{font-size:13px;color:var(--ink3)}
+.cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
+.btn{display:inline-flex;align-items:center;gap:8px;border-radius:10px;padding:10px 16px;font-weight:600;font-size:15px;border:1px solid var(--line);background:var(--card);color:var(--ink)}
+.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
+.btn:hover{text-decoration:none;filter:brightness(1.05)}
+section{padding:72px 0;border-bottom:1px solid var(--line)}
+.sub{color:var(--ink2);max-width:760px;margin:0 0 28px;font-size:17px}
+.pairs{display:grid;gap:22px}
+.pair{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;box-shadow:var(--shadow)}
+.pair figure{margin:0}
+.pair img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;display:block}
+figcaption{font-size:13px;color:var(--ink3);margin-top:6px;line-height:1.4}
+figcaption b{color:var(--ink);font-weight:600}
+.tag{display:inline-block;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:99px;margin-bottom:4px}
+.yes{background:#e3f1e7;color:#1f6b45}.no{background:#f5e3df;color:#9a2e20}
+@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .yes{background:#1d3427;color:#7fd8a6}:root:not([data-theme="light"]) .no{background:#3a221d;color:#ff9e8f}}
+.pairsrc{grid-column:1/-1;font-size:12.5px;color:var(--ink3);margin:0}
+.mapgrid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:24px;align-items:start}
+.mapbox{background:#18181c;border-radius:16px;padding:14px;text-align:center;box-shadow:var(--shadow)}
+.mapbox img{max-width:100%;max-height:560px;image-rendering:pixelated}
+.legend{font-size:13px;color:var(--ink3);margin-top:10px}
+.legend i{display:inline-block;width:11px;height:11px;border-radius:3px;margin:0 4px -1px 10px}
+.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}
+.tiles img{width:100%;border-radius:10px;display:block}
+.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
+.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow)}
+.card p{margin:0;color:var(--ink2);font-size:15px}
+.card .k{font-size:26px;margin-bottom:6px}
+.shot{width:100%;border-radius:14px;border:1px solid var(--line);box-shadow:var(--shadow);display:block}
+table{border-collapse:collapse;width:100%;font-size:15px;background:var(--card);border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
+th,td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line)}
+th{font-weight:600;color:var(--ink2);font-size:13px;text-transform:uppercase;letter-spacing:.05em}
+td.n{font-variant-numeric:tabular-nums;font-weight:600}
+.note{font-size:14px;color:var(--ink3);margin-top:14px;max-width:820px}
+.limits li{margin-bottom:8px}
+footer{padding:36px 0 48px;color:var(--ink3);font-size:14px;text-align:center}
+@media (max-width:860px){
+ .hero .photos{width:100%;opacity:.35}
+ .hero:after{background:color-mix(in srgb,var(--bg) 70%,transparent)}
+ .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
+ .pair{grid-template-columns:repeat(2,minmax(0,1fr))}
+ .mapgrid{grid-template-columns:1fr}
+ .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
+}
+@media (max-width:520px){
+ .wrap{padding:0 16px}
+ header.hero{min-height:0}
+ .hero .wrap{padding-top:40px;padding-bottom:40px}
+ .lede{font-size:17px}
+ .cards{grid-template-columns:1fr}
+ section{padding:48px 0}
+ th,td{padding:8px 10px;font-size:14px}
+}
+</style>
+</head>
+<body>
+<nav><div class="wrap">
+  <span class="brand">Fiber Checker</span>
+  <div class="navlinks">
+    <a href="#see">What it sees</a><a href="#map">A fiber map</a><a href="#who">Who it is for</a>
+    <a href="#tested">How it was tested</a><a href="#limits">Limits</a><a href="?tab=check">Check a segment</a>
+  </div>
+</div></nav>
+
+<header class="hero" id="top">
+  <div class="photos" role="img" aria-label="A mosaic of CT renders along traced surfaces of public scrolls, each showing papyrus fibers"></div>
+  <div class="wrap">
+    <div class="eyebrow">Vesuvius Challenge open data · free, no key</div>
+    <h1>Are papyrus fibers visible on your traced surface?</h1>
+    <p class="lede">Pick any traced segment of the open data, or upload your own mesh. Fiber Checker renders the CT along the surface patch by patch and tells you where long, thin papyrus strands show, with a check of itself on every run.</p>
+    <p class="by">Made and shared by <b>Chase Hendrick</b>, October 2026. Scans and meshes: Vesuvius Challenge open data.</p>
+    <div class="stats">
+      <div class="stat"><b>1.00</b><span>sheet vs the gap beside it, on two scrolls it never saw</span></div>
+      <div class="stat"><b>92 to 98%</b><span>sheet vs a tile shuffle (pixel measure 53 to 57%)</span></div>
+      <div class="stat"><b>0 USD</b><span>the free judge runs on this page's CPU</span></div>
+      <div class="stat"><b>~80 s</b><span>for a 60-patch check of a segment</span></div>
+    </div>
+    <div class="cta">
+      <a class="btn primary" href="?tab=check">Check a segment</a>
+      <a class="btn primary" href="?tab=game">Play Fiber or not?</a>
+      <a class="btn" href="#see">What the judge sees</a>
+      <a class="btn" href="?tab=howto">How-to guides</a>
+      <a class="btn" href="?tab=agents">For agents and code</a>
+    </div>
+  </div>
+</header>
+
+<section id="see"><div class="wrap">
+  <h2>What the judge sees</h2>
+  <p class="sub">Each patch is the CT rendered on the traced surface. The judge has to prefer it over copies that keep its brightness and texture but lose the strands. On a surface that sits on papyrus, it does, by a wide margin.</p>
+  <div class="pairs" id="pairs"></div>
+</div></section>
+
+<section id="map"><div class="wrap">
+  <h2>A fiber map</h2>
+  <p class="sub">The result of a check: every patch colored by its fiber evidence, on the segment's own mesh grid, so it lines up with the trace. Below the map, the clearest patches the judge saw.</p>
+  <div class="mapgrid">
+    <div>
+      <div class="mapbox"><img src="assets/map.png" alt="A fiber map of PHerc0139 segment w030"></div>
+      <div class="legend"><i style="background:#fde725"></i>clear fibers<i style="background:#21918c"></i>some<i style="background:#440154"></i>weak<i style="background:#6e6e6e"></i>no sign<i style="background:#343640"></i>not scored</div>
+    </div>
+    <div>
+      <h3 id="mapnums">PHerc0139, segment w030</h3>
+      <p class="sub" style="margin-bottom:8px" id="mapline">A public scroll on no prize list, the 2.4 um scan of 2 January 2026 at level 2. This winding was one the free judge trained on, so it shows the output, not evidence of how well it works.</p>
+      <div class="tiles">
+        <img src="assets/tile-0.webp" alt="clearest patch 1"><img src="assets/tile-1.webp" alt="clearest patch 2"><img src="assets/tile-2.webp" alt="clearest patch 3">
+        <img src="assets/tile-3.webp" alt="clearest patch 4"><img src="assets/tile-4.webp" alt="clearest patch 5"><img src="assets/tile-5.webp" alt="clearest patch 6">
+      </div>
+      <p class="note">Model output about texture, never a reading of text.</p>
+    </div>
+  </div>
+</div></section>
+
+<section id="page"><div class="wrap">
+  <h2>The page</h2>
+  <p class="sub">Choose a scroll, a segment and a scan, press Check fibers, and the map, the numbers, the clearest and weakest patches and a download appear beside it. The download holds <code>fiber.json</code>, <code>fiber.tif</code>, the map and a one-page report.</p>
+  <img class="shot" src="assets/ui.webp" alt="The Check a segment tab with a finished check">
+</div></section>
+
+<section id="who"><div class="wrap">
+  <h2>Who it is for</h2>
+  <p class="sub">One check, read four ways.</p>
+  <div class="cards">
+    <div class="card"><div class="k">🌱</div><h3>Beginners</h3><p>See what papyrus fibers look like in CT, play Fiber or not? against the model, and check an example in two minutes.</p></div>
+    <div class="card"><div class="k">🏆</div><h3>Prize entrants</h3><p>The Progress Prize asks you to show fibers on your output surface. Attach the one-page report, and say which judge you used.</p></div>
+    <div class="card"><div class="k">🔬</div><h3>Researchers</h3><p>Preregistered, tested once on held-out scrolls against built controls, with the failed first round on record. Compare two tracers patch by patch.</p></div>
+    <div class="card"><div class="k">🧭</div><h3>Tracers and tool builders</h3><p>Upload a tifxyz, read <code>fiber.tif</code> on your own mesh grid, or call the API or MCP server from a script or an agent.</p></div>
+  </div>
+</div></section>
+
+<section id="tested"><div class="wrap">
+  <h2>How it was tested</h2>
+  <p class="sub">The free judge is a small network trained on Claude's answers about renders of four public scrolls. Its test was written down before any test image existed, then run once on two scrolls it never saw.</p>
+  <table>
+    <thead><tr><th>Pair the judge had to get right</th><th>PHerc0500P2</th><th>PHerc0343P</th><th>Pixel measure</th></tr></thead>
+    <tbody>
+      <tr><td>Sheet vs the gap beside it</td><td class="n">1.00</td><td class="n">1.00</td><td class="n">0.79, 0.76</td></tr>
+      <tr><td>Sheet vs a 14-pixel tile shuffle, a size never trained on</td><td class="n">0.98</td><td class="n">0.92</td><td class="n">0.53, 0.57</td></tr>
+      <tr><td>Sheet vs 3 voxels off</td><td class="n">0.87</td><td class="n">0.68</td><td class="n"></td></tr>
+    </tbody>
+  </table>
+  <p class="note">120 and 62 patches; the pixel measure is structure-tensor coherence. A first round failed (it preferred tile-shuffled renders, because it rewarded the edges a shuffle adds) and stays on record; the second added shuffles of other sizes to training. All of it is model output.</p>
+</div></section>
+
+<section id="limits"><div class="wrap">
+  <h2>Limits</h2>
+  <ul class="limits">
+    <li><b>It does not tell which sheet.</b> Each patch is rendered at the brightest depth within 5 voxels of the trace, and sheets lie close together, so a trace on the neighboring sheet can still show fibers.</li>
+    <li><b>Tested setting:</b> open-data meshes on 2.2 to 2.4 um scans at level 2. Other scans still run, and the page says so.</li>
+    <li><b>Untested hints:</b> jump hints, fiber direction and best depth are ideas until a test of their own passes.</li>
+    <li><b>Built controls, not real faulty traces,</b> were what it was tested against.</li>
+  </ul>
+</div></section>
+
+<footer><div class="wrap">Fiber Checker · code and weights Apache 2.0 · scans and meshes: <a href="https://scrollprize.org/data">Vesuvius Challenge open data</a>, CC BY-NC 4.0, read live and never copied · model output, not a reading</div></footer>
+
+<script>
+const PAIRS=[0,1,2].map(n=>({n}));
+const KIND=[["on","yes","On the traced surface","the CT as it is: strands run across the patch"],
+            ["scramble","no","Scrambled","same brightness and texture, strands gone"],
+            ["shuffle","no","Tile shuffled","cut into 14-pixel tiles, turned and shuffled"],
+            ["off","no","Off the surface","the CT 5 voxels from the trace"]];
+const SRC=["PHerc0139","PHerc0500P2","PHerc0343P"];
+document.getElementById('pairs').innerHTML=PAIRS.map(p=>'<div class="pair">'+KIND.map(k=>'<figure><img loading="lazy" src="assets/pair-'+p.n+'-'+k[0]+'.webp" alt="'+k[2]+'"><figcaption><span class="tag '+k[1]+'">'+(k[1]==='yes'?'fibers':'control')+'</span><br><b>'+k[2]+'</b>: '+k[3]+'</figcaption></figure>').join('')+'<p class="pairsrc" data-n="'+p.n+'"></p></div>').join('');
+fetch('assets/media.json').then(r=>r.json()).then(m=>{document.querySelectorAll('.pairsrc').forEach(el=>{const s=m.pictures['pair-'+el.dataset.n+'-*.webp'];if(s)el.textContent='From '+s+'. Public scroll on no prize list.'})}).catch(()=>{});
+</script>
+</body>
+</html>