Publish CacheBack project website and demos

.gitattributes

@@ -33,3 +33,5 @@ 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
+demo/coding/rclc-cacheback-4k.mp4 filter=lfs diff=lfs merge=lfs -text
+social-preview.jpg filter=lfs diff=lfs merge=lfs -text

.nojekyll

@@ -0,0 +1 @@
+

LICENSE

@@ -0,0 +1,202 @@
+
+                                 Apache License
+                           Version 2.0, January 2004
+                        http://www.apache.org/licenses/
+
+   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+   1. Definitions.
+
+      "License" shall mean the terms and conditions for use, reproduction,
+      and distribution as defined by Sections 1 through 9 of this document.
+
+      "Licensor" shall mean the copyright owner or entity authorized by
+      the copyright owner that is granting the License.
+
+      "Legal Entity" shall mean the union of the acting entity and all
+      other entities that control, are controlled by, or are under common
+      control with that entity. For the purposes of this definition,
+      "control" means (i) the power, direct or indirect, to cause the
+      direction or management of such entity, whether by contract or
+      otherwise, or (ii) ownership of fifty percent (50%) or more of the
+      outstanding shares, or (iii) beneficial ownership of such entity.
+
+      "You" (or "Your") shall mean an individual or Legal Entity
+      exercising permissions granted by this License.
+
+      "Source" form shall mean the preferred form for making modifications,
+      including but not limited to software source code, documentation
+      source, and configuration files.
+
+      "Object" form shall mean any form resulting from mechanical
+      transformation or translation of a Source form, including but
+      not limited to compiled object code, generated documentation,
+      and conversions to other media types.
+
+      "Work" shall mean the work of authorship, whether in Source or
+      Object form, made available under the License, as indicated by a
+      copyright notice that is included in or attached to the work
+      (an example is provided in the Appendix below).
+
+      "Derivative Works" shall mean any work, whether in Source or Object
+      form, that is based on (or derived from) the Work and for which the
+      editorial revisions, annotations, elaborations, or other modifications
+      represent, as a whole, an original work of authorship. For the purposes
+      of this License, Derivative Works shall not include works that remain
+      separable from, or merely link (or bind by name) to the interfaces of,
+      the Work and Derivative Works thereof.
+
+      "Contribution" shall mean any work of authorship, including
+      the original version of the Work and any modifications or additions
+      to that Work or Derivative Works thereof, that is intentionally
+      submitted to Licensor for inclusion in the Work by the copyright owner
+      or by an individual or Legal Entity authorized to submit on behalf of
+      the copyright owner. For the purposes of this definition, "submitted"
+      means any form of electronic, verbal, or written communication sent
+      to the Licensor or its representatives, including but not limited to
+      communication on electronic mailing lists, source code control systems,
+      and issue tracking systems that are managed by, or on behalf of, the
+      Licensor for the purpose of discussing and improving the Work, but
+      excluding communication that is conspicuously marked or otherwise
+      designated in writing by the copyright owner as "Not a Contribution."
+
+      "Contributor" shall mean Licensor and any individual or Legal Entity
+      on behalf of whom a Contribution has been received by Licensor and
+      subsequently incorporated within the Work.
+
+   2. Grant of Copyright License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      copyright license to reproduce, prepare Derivative Works of,
+      publicly display, publicly perform, sublicense, and distribute the
+      Work and such Derivative Works in Source or Object form.
+
+   3. Grant of Patent License. Subject to the terms and conditions of
+      this License, each Contributor hereby grants to You a perpetual,
+      worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+      (except as stated in this section) patent license to make, have made,
+      use, offer to sell, sell, import, and otherwise transfer the Work,
+      where such license applies only to those patent claims licensable
+      by such Contributor that are necessarily infringed by their
+      Contribution(s) alone or by combination of their Contribution(s)
+      with the Work to which such Contribution(s) was submitted. If You
+      institute patent litigation against any entity (including a
+      cross-claim or counterclaim in a lawsuit) alleging that the Work
+      or a Contribution incorporated within the Work constitutes direct
+      or contributory patent infringement, then any patent licenses
+      granted to You under this License for that Work shall terminate
+      as of the date such litigation is filed.
+
+   4. Redistribution. You may reproduce and distribute copies of the
+      Work or Derivative Works thereof in any medium, with or without
+      modifications, and in Source or Object form, provided that You
+      meet the following conditions:
+
+      (a) You must give any other recipients of the Work or
+          Derivative Works a copy of this License; and
+
+      (b) You must cause any modified files to carry prominent notices
+          stating that You changed the files; and
+
+      (c) You must retain, in the Source form of any Derivative Works
+          that You distribute, all copyright, patent, trademark, and
+          attribution notices from the Source form of the Work,
+          excluding those notices that do not pertain to any part of
+          the Derivative Works; and
+
+      (d) If the Work includes a "NOTICE" text file as part of its
+          distribution, then any Derivative Works that You distribute must
+          include a readable copy of the attribution notices contained
+          within such NOTICE file, excluding those notices that do not
+          pertain to any part of the Derivative Works, in at least one
+          of the following places: within a NOTICE text file distributed
+          as part of the Derivative Works; within the Source form or
+          documentation, if provided along with the Derivative Works; or,
+          within a display generated by the Derivative Works, if and
+          wherever such third-party notices normally appear. The contents
+          of the NOTICE file are for informational purposes only and
+          do not modify the License. You may add Your own attribution
+          notices within Derivative Works that You distribute, alongside
+          or as an addendum to the NOTICE text from the Work, provided
+          that such additional attribution notices cannot be construed
+          as modifying the License.
+
+      You may add Your own copyright statement to Your modifications and
+      may provide additional or different license terms and conditions
+      for use, reproduction, or distribution of Your modifications, or
+      for any such Derivative Works as a whole, provided Your use,
+      reproduction, and distribution of the Work otherwise complies with
+      the conditions stated in this License.
+
+   5. Submission of Contributions. Unless You explicitly state otherwise,
+      any Contribution intentionally submitted for inclusion in the Work
+      by You to the Licensor shall be under the terms and conditions of
+      this License, without any additional terms or conditions.
+      Notwithstanding the above, nothing herein shall supersede or modify
+      the terms of any separate license agreement you may have executed
+      with Licensor regarding such Contributions.
+
+   6. Trademarks. This License does not grant permission to use the trade
+      names, trademarks, service marks, or product names of the Licensor,
+      except as required for reasonable and customary use in describing the
+      origin of the Work and reproducing the content of the NOTICE file.
+
+   7. Disclaimer of Warranty. Unless required by applicable law or
+      agreed to in writing, Licensor provides the Work (and each
+      Contributor provides its Contributions) on an "AS IS" BASIS,
+      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+      implied, including, without limitation, any warranties or conditions
+      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+      PARTICULAR PURPOSE. You are solely responsible for determining the
+      appropriateness of using or redistributing the Work and assume any
+      risks associated with Your exercise of permissions under this License.
+
+   8. Limitation of Liability. In no event and under no legal theory,
+      whether in tort (including negligence), contract, or otherwise,
+      unless required by applicable law (such as deliberate and grossly
+      negligent acts) or agreed to in writing, shall any Contributor be
+      liable to You for damages, including any direct, indirect, special,
+      incidental, or consequential damages of any character arising as a
+      result of this License or out of the use or inability to use the
+      Work (including but not limited to damages for loss of goodwill,
+      work stoppage, computer failure or malfunction, or any and all
+      other commercial damages or losses), even if such Contributor
+      has been advised of the possibility of such damages.
+
+   9. Accepting Warranty or Additional Liability. While redistributing
+      the Work or Derivative Works thereof, You may choose to offer,
+      and charge a fee for, acceptance of support, warranty, indemnity,
+      or other liability obligations and/or rights consistent with this
+      License. However, in accepting such obligations, You may act only
+      on Your own behalf and on Your sole responsibility, not on behalf
+      of any other Contributor, and only if You agree to indemnify,
+      defend, and hold each Contributor harmless for any liability
+      incurred by, or claims asserted against, such Contributor by reason
+      of your accepting any such warranty or additional liability.
+
+   END OF TERMS AND CONDITIONS
+
+   APPENDIX: How to apply the Apache License to your work.
+
+      To apply the Apache License to your work, attach the following
+      boilerplate notice, with the fields enclosed by brackets "[]"
+      replaced with your own identifying information. (Don't include
+      the brackets!)  The text should be enclosed in the appropriate
+      comment syntax for the file format. We also recommend that a
+      file or class name and description of purpose be included on the
+      same "printed page" as the copyright notice for easier
+      identification within third-party archives.
+
+   Copyright 2026 The RCLC Authors
+
+   Licensed under the Apache License, Version 2.0 (the "License");
+   you may not use this file except in compliance with the License.
+   You may obtain a copy of the License at
+
+       http://www.apache.org/licenses/LICENSE-2.0
+
+   Unless required by applicable law or agreed to in writing, software
+   distributed under the License is distributed on an "AS IS" BASIS,
+   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   See the License for the specific language governing permissions and
+   limitations under the License.

README.md

@@ -1,10 +1,21 @@
 ---
-title: Cacheback
-emoji: 🔥
-colorFrom: yellow
-colorTo: red
+title: CacheBack
+emoji: 🗂️
+colorFrom: blue
+colorTo: green
 sdk: static
-pinned: false
+app_file: index.html
+fullWidth: true
+license: apache-2.0
+short_description: Receiver-conditioned latent communication between agents
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+# CacheBack
+
+Receiver-Conditioned Latent Communication gives 94% CacheBack.
+
+[Paper](https://arxiv.org/abs/2609.32046) · [Code](https://github.com/agentcacheback/cacheback) · [Website](https://agentcacheback.github.io/)
+
+This static Space mirrors the project website, with benchmark results, an interactive recorded booking replay, and a coding demo video. It does not run model inference.
+
+The website source is maintained at https://github.com/agentcacheback/agentcacheback.github.io.

demo/coding/evidence.json

@@ -0,0 +1,54 @@
+{
+  "run_id": "bughunt-16333-run-20261001T051520Z",
+  "source": "s3://lce-pr2789-paper/rclc-demo/bughunt-16333-run-20261001T051520Z/",
+  "model": "Qwen/Qwen3-8B",
+  "issue": "django__django-16333",
+  "arms": {
+    "text": {
+      "seconds": 113.20635836,
+      "worker_seconds": 100.612943677,
+      "worker_done": [
+        100.612943677,
+        38.252793639,
+        25.637343035,
+        33.867839988,
+        22.492231897,
+        78.432600727,
+        29.442396709
+      ],
+      "status": "resolved",
+      "patch": "diff --git a/django/contrib/auth/forms.py b/django/contrib/auth/forms.py\n--- a/django/contrib/auth/forms.py\n+++ b/django/contrib/auth/forms.py\n@@ -141,6 +141,7 @@\n         user.set_password(self.cleaned_data[\"password1\"])\n         if commit:\n             user.save()\n+            self.save_m2m()\n         return user\n \n \n",
+      "new_tests_passed": 1,
+      "regression_tests_passed": 87,
+      "failed_tests": 0,
+      "handoff_bytes": 24969,
+      "handoff_rows": 0,
+      "coordinator_tokens": 1470,
+      "source_result": "s3://lce-pr2789-paper/rclc-demo/bughunt-16333-run-20261001T051520Z/text/result.json",
+      "source_grade": "s3://lce-pr2789-paper/rclc-demo/bughunt-16333-run-20261001T051520Z/grades/text.json"
+    },
+    "latent": {
+      "seconds": 25.66205141,
+      "worker_seconds": 6.196859804,
+      "worker_done": [
+        6.196859804,
+        6.093338203,
+        6.146028218,
+        6.18476604,
+        6.18007457,
+        5.908353919,
+        6.053007381
+      ],
+      "status": "resolved",
+      "patch": "diff --git a/django/contrib/auth/forms.py b/django/contrib/auth/forms.py\n--- a/django/contrib/auth/forms.py\n+++ b/django/contrib/auth/forms.py\n@@ -141,6 +141,7 @@\n         user.set_password(self.cleaned_data[\"password1\"])\n         if commit:\n             user.save()\n+            self.save_m2m()\n         return user\n \n \n",
+      "new_tests_passed": 1,
+      "regression_tests_passed": 87,
+      "failed_tests": 0,
+      "handoff_bytes": 675872768,
+      "handoff_rows": 82504,
+      "coordinator_tokens": 921,
+      "source_result": "s3://lce-pr2789-paper/rclc-demo/bughunt-16333-run-20261001T051520Z/latent/result.json",
+      "source_grade": "s3://lce-pr2789-paper/rclc-demo/bughunt-16333-run-20261001T051520Z/grades/latent.json"
+    }
+  }
+}

demo/coding/rclc-cacheback-4k.mp4

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:c0410bb4e8dc44218716c97160413bfebe7c3185bf79abd94e5566d3357d0691
+size 5796872

demo/index.html

@@ -0,0 +1,279 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <meta name="color-scheme" content="light">
+  <title>CacheBack | Booking relay</title>
+  <style>
+    * { box-sizing:border-box; }
+    body { margin:0; background:#fff; color:#222; font:15px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
+    main { width:min(1320px,calc(100% - 64px)); margin:24px auto; }
+    header { font-size:18px; font-weight:650; }
+    .question { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:14px 0 22px; }
+    h1 { max-width:880px; margin:0; font-size:clamp(23px,3vw,28px); font-weight:500; letter-spacing:-.6px; line-height:1.3; }
+    h2 { margin:0; font-size:15px; font-weight:600; }
+    button,a { -webkit-tap-highlight-color:transparent; }
+    button { font:inherit; cursor:pointer; border:0; border-radius:4px; background:#222; color:#fff; padding:10px 20px; white-space:nowrap; }
+    button:disabled { cursor:default; opacity:.5; }
+    .controls { display:flex; align-items:center; gap:14px; }
+    #speed { font:inherit; font-size:13px; color:#666; border:0; background:transparent; padding:8px 2px; cursor:pointer; }
+    #clear { background:none; color:#777; padding:8px 0; font-size:13px; }
+    :focus-visible { outline:2px solid #222; outline-offset:5px; }
+    .topology,.row { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px; }
+    .topology { margin:0 0 16px; padding:0; list-style:none; }
+    .flow-label { margin:0 0 10px; color:#777; font-size:11px; }
+    .topology li { position:relative; padding:10px 14px; border:1px solid #ddd; border-radius:5px; font-size:13px; }
+    .topology li:not(:last-child)::after { content:"→"; position:absolute; right:-23px; top:50%; transform:translateY(-50%); font-size:20px; color:#777; }
+    .topology strong { display:block; }
+    .topology span { color:#777; font-size:12px; }
+    .method { margin-top:16px; }
+    .method-heading { display:flex; align-items:baseline; gap:14px; margin-bottom:12px; }
+    .time { font-size:13px; color:#666; font-variant-numeric:tabular-nums; }
+    .chunk { border-top:1px solid #ddd; padding:12px 10px 0 0; height:230px; overflow:auto; scrollbar-width:thin; white-space:pre-wrap; font-size:12px; line-height:1.7; overflow-wrap:anywhere; }
+    .chunk::before { display:none; content:attr(data-agent); font:600 12px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; white-space:normal; margin-bottom:12px; }
+    .source { font-family:Georgia,"Times New Roman",serif; font-size:13px; }
+    .answer { font-size:13px; }
+    .answer-check { margin:14px 0 0; font-size:12px; font-weight:600; }
+    strong { font-weight:600; }
+    mark { color:inherit; background:linear-gradient(#bde8e3,#bde8e3) left/100% 100% no-repeat; box-decoration-break:clone; -webkit-box-decoration-break:clone; }
+    .revealing mark { animation:highlight .18s ease-out both; }
+    @keyframes highlight { from { background-size:0% 100%; } to { background-size:100% 100%; } }
+    footer { display:flex; justify-content:space-between; gap:20px; margin-top:28px; font-size:11px; color:#777; }
+    footer p { margin:0; }
+    a { color:inherit; text-underline-offset:3px; }
+    #error { color:#8e2b1d; }
+    .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
+    @media(max-width:800px) {
+      main { width:calc(100% - 32px); margin:24px auto; }
+      .question { align-items:flex-start; flex-direction:column; gap:18px; margin:24px 0; }
+      .topology { display:none; }
+      .row { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
+      .chunk::before { display:block; }
+      .chunk { height:260px; }
+      footer { flex-direction:column; gap:8px; }
+    }
+    @media(max-width:520px) { .row { grid-template-columns:1fr; } }
+    .embedded header,.embedded #question { display:none; }
+    .embedded main { margin:16px auto; }
+    .embedded .question { flex-direction:row; align-items:center; justify-content:space-between; gap:12px; margin:0 0 12px; }
+    .embedded .flow-label { display:none; }
+    .embedded .question { padding-bottom:12px; border-bottom:1px solid #ddd; }
+    .embedded .topology { display:flex; flex:1; min-width:0; gap:22px; margin:0; }
+    .embedded .topology li { display:flex; align-items:center; gap:6px; flex:1; min-width:0; padding:0; border:0; }
+    .embedded .topology strong { white-space:nowrap; font-size:12px; }
+    .embedded .topology span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }
+    .embedded .topology li:not(:last-child)::after { right:-17px; font-size:15px; }
+    .embedded .controls { flex-shrink:0; gap:10px; }
+    @media(max-width:800px) {
+      .embedded .topology span { display:none; }
+      .embedded .topology { gap:16px; }
+      .embedded .topology li:not(:last-child)::after { right:-12px; }
+      .embedded .topology strong { font-size:10px; }
+      .embedded .controls { gap:5px; }
+      .embedded button { padding:8px 10px; }
+    }
+    @media(min-width:801px) { .embedded .chunk { height:260px; } }
+    @media(prefers-reduced-motion:reduce) { .revealing mark { animation:none; } }
+  </style>
+</head>
+<body>
+  <main>
+    <header>CacheBack</header>
+    <section class="question" aria-label="Recorded question">
+      <h1 id="question">Where should Maya collect her pass on Friday, and what ID should she bring?</h1>
+      <div class="controls">
+        <select id="speed" aria-label="Playback speed" disabled>
+          <option value="1">1×</option>
+          <option value="2">2×</option>
+          <option value="4">4×</option>
+        </select>
+        <button id="clear" type="button" hidden>Clear</button>
+        <button id="play" type="button" disabled>Run</button>
+      </div>
+    </section>
+    <p id="error" role="alert" hidden></p>
+    <div class="flow" aria-label="Four-agent relay">
+      <p class="flow-label">Chain of agents</p>
+      <ol class="topology" aria-label="Agent topology">
+        <li><strong>Agent 1</strong><span>booking-confirmation.txt</span></li>
+        <li><strong>Agent 2</strong><span>friday-desk-changes.txt</span></li>
+        <li><strong>Agent 3</strong><span>collection-id-rules.txt</span></li>
+        <li><strong>Agent 4</strong><span>Final answer</span></li>
+      </ol>
+      <section class="method" aria-labelledby="rclc-title">
+        <div class="method-heading"><h2 id="rclc-title">CacheBack</h2><span class="time" id="rclc-time"></span></div>
+        <div class="row" id="rclc-row"></div>
+      </section>
+      <section class="method" aria-labelledby="text-title">
+        <div class="method-heading"><h2 id="text-title">Text</h2><span class="time" id="text-time"></span></div>
+        <div class="row" id="text-row"></div>
+      </section>
+    </div>
+    <p class="sr-only" id="status" role="status" aria-live="polite"></p>
+    <footer>
+      <p><span id="run-info">Recorded replay</span> · <span id="timing-note">Estimated streaming, measured completion times.</span></p>
+      <a href="https://github.com/agentcacheback/cacheback/tree/main/demo">Code &amp; recording</a>
+    </footer>
+  </main>
+  <script>
+    const $ = id => document.getElementById(id);
+    const host = window.frameElement;
+    if (host) {
+      document.body.classList.add("embedded");
+      document.querySelector(".question").prepend(document.querySelector(".topology"));
+      const main = document.querySelector("main");
+      new ResizeObserver(() => {
+        const bottomMargin = parseFloat(getComputedStyle(main).marginBottom);
+        host.style.height = `${Math.ceil(main.offsetTop + main.offsetHeight + bottomMargin) + 1}px`;
+      }).observe(main);
+    }
+    let trace, playing = false, frame;
+    const phases = {rclc:0, text:0};
+    const reviewedAnswer = 'Maya should collect her pass at **Harbour Hub** on Friday, and she should bring a **passport** as her ID.\n\n**Evidence:**\n- "Reference J7 has moved to Harbour Hub."\n- "Harbour Hub requires a passport for replacement building pass collections."';
+
+    function element(tag, text) {
+      const node = document.createElement(tag);
+      if (text !== undefined) node.textContent = text;
+      return node;
+    }
+
+    function segments(source, indices) {
+      const chars = Array.from(source.text), mask = Array(chars.length).fill(false);
+      for (const index of indices) {
+        const [start, end] = source.offsets[index];
+        for (let i = start; i < end; i++) mask[i] = true;
+      }
+      const result = [];
+      for (let start = 0; start < chars.length;) {
+        let end = start + 1;
+        while (end < chars.length && mask[end] === mask[start]) end++;
+        result.push({text:chars.slice(start, end).join(""), selected:mask[start]});
+        start = end;
+      }
+      return result;
+    }
+
+    function prose(container, text, fraction = 1) {
+      const parts = text.split(/(\*\*[^*\n]+\*\*)/g).map(part => {
+        const bold = part.startsWith("**") && part.endsWith("**");
+        return {bold, chars:Array.from(bold ? part.slice(2, -2) : part)};
+      });
+      let remaining = Math.floor(parts.reduce((n, part) => n + part.chars.length, 0) * fraction);
+      if (container.dataset.characters === String(remaining)) return;
+      container.dataset.characters = String(remaining); container.replaceChildren();
+      for (const part of parts) {
+        const chars = part.chars.slice(0, remaining); remaining -= chars.length;
+        if (chars.length) container.append(element(part.bold ? "strong" : "span", chars.join("")));
+      }
+    }
+
+    function render(method) {
+      const phase = phases[method], recorded = trace.cases[0], selected = trace.sources.map(() => []);
+      if (method === "rclc" && phase) for (const [source, token] of recorded.rclc.hops[Math.min(phase,3) - 1].origins) selected[source].push(token);
+      const row = $(`${method}-row`), scroll = [...row.children].map(node => node.scrollTop);
+      row.replaceChildren();
+      trace.sources.forEach((source, i) => {
+        const chunk = element("div"); chunk.className = "chunk";
+        const name = document.querySelectorAll(".topology li span")[i].textContent;
+        chunk.dataset.agent = `Agent ${i + 1} · ${name}`;
+        chunk.tabIndex = 0; chunk.setAttribute("aria-label", `${method === "rclc" ? "Source document" : "Text handoff"} ${i + 1}: ${name}`);
+        if (method === "rclc") {
+          chunk.classList.add("source");
+          chunk.classList.toggle("revealing", playing && phase === i + 1);
+          for (const piece of segments(source, selected[i])) chunk.append(element(piece.selected ? "mark" : "span", piece.text));
+        } else if (phase > i) {
+          const message = recorded.text.hops[i].message;
+          prose(chunk, message.text || "(empty handoff)");
+          if (message.stop === "limit") chunk.append(element("p", "Handoff reached its token limit."));
+        }
+        row.append(chunk);
+        chunk.scrollTop = method === "text" && phase === i + 1 ? chunk.scrollHeight : scroll[i] || 0;
+      });
+      const answer = element("div"); answer.className = "chunk answer";
+      answer.dataset.agent = "Agent 4 · Final answer";
+      answer.tabIndex = 0; answer.setAttribute("aria-label", `${method === "rclc" ? "CacheBack" : "Text"} final answer`);
+      if (phase === 4) {
+        prose(answer, recorded[method].answer.text || "(empty answer)");
+        if (recorded[method].answer.stop === "limit") answer.append(element("p", "Answer reached its token limit."));
+        if (method === "rclc" && recorded.question === "Where should Maya collect her pass on Friday, and what ID should she bring?" && recorded.rclc.answer.text === reviewedAnswer) {
+          const check = element("p", "✓ Harbour Hub · Passport");
+          check.className = "answer-check"; answer.append(check);
+        }
+      }
+      row.append(answer); answer.scrollTop = phase === 4 ? answer.scrollHeight : scroll[3] || 0;
+      $(`${method}-time`).textContent = phase === 4 ? `${recorded[method].seconds.toFixed(2)} s` : "";
+      $("status").textContent = `${method === "rclc" ? "CacheBack" : "Text"}: ${phase === 4 ? "final answer received." : `${phase} of 3 handoffs received.`}`;
+    }
+
+    function play() {
+      if (playing || !trace) return;
+      playing = true; $("play").disabled = $("speed").disabled = true;
+      $("clear").hidden = false;
+      const speed = Number($("speed").value), deadlines = {};
+      for (const method of ["rclc", "text"]) {
+        const run = trace.cases[0][method];
+        let elapsed = 0;
+        deadlines[method] = [...run.hops.map(hop => elapsed += hop.seconds * 1000), run.seconds * 1000];
+        phases[method] = 0; render(method);
+      }
+      let start;
+      function advance(now) {
+        start ??= now;
+        const elapsed = (now - start) * speed;
+        for (const method of ["rclc", "text"]) {
+          const phase = deadlines[method].filter(ms => elapsed >= ms).length;
+          if (phase !== phases[method]) { phases[method] = phase; render(method); }
+          if (phase < 4) {
+            $(`${method}-time`).textContent = `${(elapsed / 1000).toFixed(2)} s`;
+            if (method === "text" || phase === 3) {
+              const begin = phase ? deadlines[method][phase - 1] : 0;
+              const message = phase === 3 ? trace.cases[0][method].answer : trace.cases[0].text.hops[phase].message;
+              const chunk = $(`${method}-row`).children[phase];
+              prose(chunk, message.text, (elapsed - begin) / (deadlines[method][phase] - begin));
+              chunk.scrollTop = chunk.scrollHeight;
+            }
+          }
+        }
+        if (phases.rclc < 4 || phases.text < 4) frame = requestAnimationFrame(advance);
+        else {
+          playing = false; $("play").disabled = $("speed").disabled = false;
+          $("play").textContent = "Replay";
+        }
+      }
+      frame = requestAnimationFrame(advance);
+    }
+    $("play").addEventListener("click", play);
+    $("clear").addEventListener("click", () => {
+      cancelAnimationFrame(frame); playing = false;
+      for (const method of ["rclc", "text"]) {
+        phases[method] = 0; render(method);
+        for (const chunk of $(`${method}-row`).children) chunk.scrollTop = 0;
+      }
+      $("play").disabled = $("speed").disabled = false;
+      $("play").textContent = "Run"; $("clear").hidden = true;
+      $("play").focus();
+    });
+    $("speed").addEventListener("change", () => {
+      $("timing-note").textContent = `${$("speed").value === "1" ? "" : `Playback ${$("speed").value}×. `}Estimated streaming, measured completion times.`;
+    });
+
+    async function load() {
+      try {
+        const response = await fetch("trace-w4.json");
+        if (!response.ok) throw new Error(`Recording unavailable (${response.status}).`);
+        trace = await response.json();
+        if (trace.schema !== 2 || trace.span_size !== 4 || trace.sources.length !== 3 || !trace.cases.length) throw new Error("Expected a W=4 three-handoff recording.");
+        $("question").textContent = trace.cases[0].question;
+        const hardware = trace.run.device.startsWith("cuda") ? trace.run.gpu.replace("NVIDIA ", "") : "CPU";
+        $("run-info").textContent = `Recorded ${trace.run.model.split("/").pop()} · ${hardware} · r${trace.ratio} · W=4${trace.complete === false ? " · Partial recording" : ""}`;
+        render("rclc"); render("text"); $("play").disabled = $("speed").disabled = false;
+      } catch (error) {
+        $("error").hidden = false;
+        $("error").textContent = `${error.message} Serve this folder with python -m http.server.`;
+      }
+    }
+    load();
+  </script>
+</body>
+</html>

index.html

@@ -1,19 +1,139 @@
 <!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <meta name="theme-color" content="#fafafa">
+  <meta name="description" content="CacheBack: receiver-conditioned communication between LLM agents. Paper, code, results, and demonstrations.">
+  <meta property="og:title" content="CacheBack | Receiver-conditioned communication">
+  <meta property="og:description" content="The receiver asks for what it needs. CacheBack uses that request to select which internal state gets sent, without additional training.">
+  <meta property="og:type" content="website">
+  <meta property="og:url" content="https://agentcacheback.github.io/">
+  <meta property="og:image" content="https://agentcacheback.github.io/social-preview.jpg">
+  <meta property="og:image:alt" content="CacheBack: receiver-conditioned communication between LLM agents, with accuracy and completion-time results across four model families.">
+  <meta property="og:image:type" content="image/jpeg">
+  <meta property="og:image:width" content="1200">
+  <meta property="og:image:height" content="727">
+  <meta name="twitter:image" content="https://agentcacheback.github.io/social-preview.jpg">
+  <meta name="twitter:card" content="summary_large_image">
+  <link rel="canonical" href="https://agentcacheback.github.io/">
+  <title>Receiver-Conditioned Latent Communication gives 94% CacheBack</title>
+  <link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='6' fill='%231c211e'/%3E%3Cpath d='M7 7h7v7H7zm11 0h7v7h-7zM7 18h7v7H7z' fill='%230f766e'/%3E%3Cpath d='M18 18h7v7h-7z' fill='%23fff'/%3E%3C/svg%3E">
+  <link rel="stylesheet" href="website/assets/styles.css?v=tldr-hero-2">
+  <script type="module" src="website/assets/app.js"></script>
+</head>
+<body>
+  <a class="skip-link" href="#main">Skip to content</a>
+  <header class="site-header wrap">
+    <a class="brand" href="#" aria-label="CacheBack home"><span class="brand-mark" aria-hidden="true"><i></i><i></i><i></i><i></i></span>CacheBack</a>
+    <nav aria-label="Main navigation"><a href="#abstract">Overview</a><a href="#results">Results</a><a href="#demo">Demos</a></nav>
+  </header>
+  <main id="main">
+    <section class="hero wrap" aria-labelledby="hero-title">
+      <div class="hero-copy">
+        <p class="eyebrow">September 2026</p>
+        <h1 id="hero-title">Receiver-Conditioned Latent Communication gives <span class="rclc-emphasis">94% CacheBack</span></h1>
+        <div class="hero-authors">
+          <ul aria-label="Authors"><li>Maximillian Rossi</li><li>Prajwal Raghunath</li><li>Haoqing Xuan</li><li>Yusen Zhang</li><li>Eugene Wu</li></ul>
+          <p class="affiliations"><a href="https://daplab.cs.columbia.edu/"><img src="https://daplab.cs.columbia.edu/files/images/daplab_logo_horiz.png" width="1508" height="331" alt="DAP Lab"></a><span>Columbia University</span></p>
+        </div>
+        <div class="tldr"><p><b>TLDR;</b> Agents can share <strong>internal model state</strong> instead of generating text messages. Sending all of it, however, overwhelms the receiver.</p><p><strong>The receiver asks for what it needs.</strong> CacheBack uses attention to that request to select which state gets sent. Simple, robust, and <strong>training-free.</strong></p><p>The title’s 94% refers to removing 93.75% of sender positions at 16× compression.</p></div>
+        <nav class="resource-links" aria-label="Project resources">
+          <a href="https://arxiv.org/pdf/2609.32046">Paper <span>PDF</span></a>
+          <a href="https://github.com/agentcacheback/cacheback">Code</a>
+          <a href="#demo">Watch demo</a>
+          <a href="https://arxiv.org/abs/2609.32046">arXiv</a>
+          <a href="#citation" id="cite-link">Cite</a>
+        </nav>
+      </div>
+      <aside class="hero-results" aria-labelledby="hero-results-title">
+        <h2 id="hero-results-title" class="eyebrow">FANOUTQA</h2><p class="visual-note">Three senders read different Wikipedia pages; one receiver combines their messages to answer a question. Each row compares same-size models: higher accuracy and lower time are better. pp = percentage points.</p>
+      <figure id="result-summary" class="comparison-plot" aria-labelledby="hero-results-title">
+        <div class="plot-legend"><span><i></i>Text · same-size senders</span><span class="rclc-emphasis"><i></i>CacheBack</span></div>
+        <div class="paired-metrics chart-heading"><div><strong>Strict accuracy (%) ↑</strong></div><div><strong>Median time (s) ↓</strong></div></div>
+        <div class="model-row" data-model="qwen"><div class="model-heading paired-metrics"><div class="model-label"><h3>Qwen 3 <small>8B</small></h3><strong class="accuracy-gain">+14.7<abbr title="percentage points">pp</abbr></strong></div></div><div class="paired-metrics"><div class="paired-bars"><div class="bar-row" role="img" aria-label="Text: 40.7%"><div class="bar-track"><i style="width:40.6700%"></i></div><b>40.7%</b></div><div class="bar-row rclc-bar" role="img" aria-label="CacheBack: 55.3%"><div class="bar-track"><i style="width:55.3300%"></i></div><b>55.3%</b></div></div><div class="paired-bars latency-bars"><div class="speed-guide" style="--cache-end:11.9938%"><strong class="speedup">3.2× faster</strong></div><div class="bar-row" role="img" aria-label="Text: 612 s"><div class="bar-track"><i style="width:38.2437%"></i></div><b>612 s</b></div><div class="bar-row rclc-bar" role="img" aria-label="CacheBack: 192 s"><div class="bar-track"><i style="width:11.9938%"></i></div><b>192 s</b></div></div></div></div>
+        <div class="model-row" data-model="nemotron"><div class="model-heading paired-metrics"><div class="model-label"><h3>Nemotron <small>12B</small></h3><strong class="accuracy-gain">+11.3<abbr title="percentage points">pp</abbr></strong></div></div><div class="paired-metrics"><div class="paired-bars"><div class="bar-row" role="img" aria-label="Text: 38.7%"><div class="bar-track"><i style="width:38.6667%"></i></div><b>38.7%</b></div><div class="bar-row rclc-bar" role="img" aria-label="CacheBack: 50.0%"><div class="bar-track"><i style="width:50.0000%"></i></div><b>50.0%</b></div></div><div class="paired-bars latency-bars"><div class="speed-guide" style="--cache-end:6.3516%"><strong class="speedup">1.3× faster</strong></div><div class="bar-row" role="img" aria-label="Text: 131 s"><div class="bar-track"><i style="width:8.2023%"></i></div><b>131 s</b></div><div class="bar-row rclc-bar" role="img" aria-label="CacheBack: 102 s"><div class="bar-track"><i style="width:6.3516%"></i></div><b>102 s</b></div></div></div></div>
+        <div class="model-row" data-model="gemma"><div class="model-heading paired-metrics"><div class="model-label"><h3>Gemma 4 <small>12B</small></h3><strong class="accuracy-gain">+7.3<abbr title="percentage points">pp</abbr></strong></div></div><div class="paired-metrics"><div class="paired-bars"><div class="bar-row" role="img" aria-label="Text: 52.0%"><div class="bar-track"><i style="width:52.0000%"></i></div><b>52.0%</b></div><div class="bar-row rclc-bar" role="img" aria-label="CacheBack: 59.3%"><div class="bar-track"><i style="width:59.3300%"></i></div><b>59.3%</b></div></div><div class="paired-bars latency-bars"><div class="speed-guide" style="--cache-end:12.5812%"><strong class="speedup">3× faster</strong></div><div class="bar-row" role="img" aria-label="Text: 603 s"><div class="bar-track"><i style="width:37.6938%"></i></div><b>603 s</b></div><div class="bar-row rclc-bar" role="img" aria-label="CacheBack: 201 s"><div class="bar-track"><i style="width:12.5812%"></i></div><b>201 s</b></div></div></div></div>
+        <div class="model-row" data-model="ministral"><div class="model-heading paired-metrics"><div class="model-label"><h3>Ministral 3 <small>14B</small></h3><strong class="accuracy-gain">+20.7<abbr title="percentage points">pp</abbr></strong></div></div><div class="paired-metrics"><div class="paired-bars"><div class="bar-row" role="img" aria-label="Text: 38.7%"><div class="bar-track"><i style="width:38.6700%"></i></div><b>38.7%</b></div><div class="bar-row rclc-bar" role="img" aria-label="CacheBack: 59.3%"><div class="bar-track"><i style="width:59.3300%"></i></div><b>59.3%</b></div></div><div class="paired-bars latency-bars"><div class="speed-guide" style="--cache-end:12.0813%"><strong class="speedup">8× faster</strong></div><div class="bar-row" role="img" aria-label="Text: 1,537 s"><div class="bar-track"><i style="width:96.0563%"></i></div><b>1,537 s</b></div><div class="bar-row rclc-bar" role="img" aria-label="CacheBack: 193 s"><div class="bar-track"><i style="width:12.0813%"></i></div><b>193 s</b></div></div></div></div>
+        <div class="paired-metrics chart-axes" aria-hidden="true"><div class="chart-axis"><span>0</span><span>50</span><span>100</span></div><div class="chart-axis"><span>0</span><span>800</span><span>1,600</span></div></div>
+      </figure>
+
+      </aside>
+    </section>
+    <section id="booking-demo" class="section wrap" aria-labelledby="booking-question">
+      <div class="booking-heading"><div><p class="eyebrow">Interactive demo</p><h2 id="booking-question">Where should Maya collect her pass on Friday, and what ID should she bring?</h2></div><a class="text-link" href="demo/index.html" target="_blank" rel="noopener noreferrer">Open full window <span aria-hidden="true">↗</span></a></div>
+      <p class="visual-note">Press <strong>Run</strong> to replay two Qwen3-8B chains. Agents 1-3 each read a different document and pass a message to the next agent; Agent 4 answers. <strong>Top:</strong> CacheBack highlights source positions whose state is selected for the next agent, guided by the question. Highlights change at each handoff as inherited and new positions are selected. <strong>Bottom:</strong> text messages appear as they are generated. The last column shows each chain’s answer. Timers show recorded elapsed time; streaming is reconstructed.</p>
+      <div class="recorded-demo">
+        <div class="demo-window"><iframe id="flagship-demo" src="demo/index.html?v=fit-7" title="Recorded CacheBack and text booking relay comparison, with playback controls" loading="lazy" sandbox="allow-scripts allow-same-origin" referrerpolicy="no-referrer"></iframe></div>
+      </div>
+    </section>
+    <section id="abstract" class="abstract-section wrap" aria-label="Communication overview">
+      <figure class="overview-figure"><a href="https://arxiv.org/pdf/2609.32046" aria-label="Read Figure 2 in the paper"><img src="website/assets/figures/communication-overview.svg" width="1240" height="510" loading="lazy" alt="Figure 2: sending every agent's full cache exceeds the receiver's context limit. CacheBack sends selected positions and latent steps, leaving room for the receiver's prompt."></a><figcaption>Figure 2. Full KV caches (stored model state) accumulate source context at the receiver and can exceed its context limit. Receiver-conditioning selects source and latent positions, leaving room for the receiver’s prompt. Token IDs represent source positions; continuous vectors represent latent steps.</figcaption></figure>
+    </section>
+    <section id="results" class="section wrap" aria-labelledby="results-title">
+      <h2 id="results-title">Results</h2>
+      <div class="paper-curves" id="paper-curves">
+        <div class="benchmark-setup"><div class="curves-heading"><h3>FanOutQA</h3><p id="compression-guide">Questions require combining evidence across Wikipedia pages. We split at least 120K tokens among three parallel senders; a receiver answers from their messages. Strict accuracy requires every reference-answer group. <strong>Higher is more accurate; left is faster.</strong> Each panel fixes the receiver model. Text labels give sender size; CacheBack uses same-size senders. <strong>rX retains 1/X of sender positions; r4 keeps 25%.</strong></p></div>
+        <div class="topology-diagram parallel" role="img" aria-label="Three senders read separate Wikipedia pages in parallel. Their messages converge on one receiver, which answers."><div class="senders"><div class="agent-node"><small>Wikipedia pages A</small><strong>Sender 1</strong></div><div class="agent-node"><small>Wikipedia pages B</small><strong>Sender 2</strong></div><div class="agent-node"><small>Wikipedia pages C</small><strong>Sender 3</strong></div></div><div class="merge" aria-hidden="true"><span>messages</span></div><div class="agent-node receiver"><small>Combines 3 messages</small><strong>Receiver</strong><small>↓ Answer</small></div></div></div>
+        <div class="curve-legend" aria-label="Curve legend"><span class="rclc-emphasis">● ━ CacheBack</span><span class="text-emphasis">▲ ┄ Text · labels show sender size</span><span>× Question only</span></div>
+        <div class="curve-grid">
+          <figure><img src="website/assets/figures/fanoutqa-qwen.svg?v=sender-sizes" width="560" height="460" loading="lazy" alt="FanOutQA, Qwen 3 8B: CacheBack r4 reaches 55.3% strict accuracy at 192 seconds, compared with 40.7% at 612 seconds for same-size text; weaker settings are also plotted."><figcaption>Qwen: r4 improves accuracy and completion time over 8B text; 1.7B text is slightly faster but less accurate.</figcaption></figure>
+          <figure><img src="website/assets/figures/fanoutqa-nemotron.svg?v=sender-sizes" width="560" height="460" loading="lazy" alt="FanOutQA, Nemotron Nano 2 12B: CacheBack r8 reaches 50% accuracy near 102 seconds versus 38.7% near 131 seconds for same-size text. A smaller text sender is faster at lower accuracy."><figcaption>Nemotron: r8 improves on 12B text; 4B text is faster but less accurate.</figcaption></figure>
+        </div>
+        <div class="chain-results" id="chain-results"><div class="benchmark-setup"><div class="curves-heading"><h3>LongBench v2 Easy</h3><p>Long-document questions test whether evidence survives repeated handoffs. We split each 100K-246K-token document into four equal parts. Each sender reads its part plus the previous message; a final receiver answers from the fourth message. Relative budgets (rX) grow with accumulated context; fixed budgets (32K, 64K) cap message positions. Axes and text-size labels follow FanOutQA.</p></div>
+        <div class="topology-diagram sequential" role="img" aria-label="Four agents read document parts in order. Each passes a message to the next. A final receiver answers from the fourth message."><div class="agent-node"><small>Document part 1</small><strong>Agent 1</strong></div><div class="agent-node"><small>Document part 2</small><strong>Agent 2</strong></div><div class="agent-node"><small>Document part 3</small><strong>Agent 3</strong></div><div class="agent-node"><small>Document part 4</small><strong>Agent 4</strong></div><div class="agent-node receiver"><small>Final message</small><strong>Receiver</strong><small>↓ Answer</small></div></div></div>
+        <div class="curve-legend" aria-label="LongBench curve legend"><span class="rclc-emphasis">● ━ CacheBack · relative budget</span><span class="fixed-emphasis">■ ━ CacheBack · fixed budget</span><span class="text-emphasis">▲ ┄ Text · labels show sender size</span><span>× Question only</span></div>
+        <div class="curve-grid">
+          <figure><img src="website/assets/figures/longbench-qwen.svg?v=sender-sizes" width="560" height="460" loading="lazy" alt="LongBench v2 Easy, Qwen 3 8B: both relative and fixed CacheBack budgets include settings faster and more accurate than same-size text. Stronger compression eventually lowers accuracy."><figcaption>Qwen: relative r4 gives the highest plotted accuracy; stronger compression loses accuracy.</figcaption></figure>
+          <figure><img src="website/assets/figures/longbench-nemotron.svg?v=sender-sizes" width="560" height="460" loading="lazy" alt="LongBench v2 Easy, Nemotron Nano 2 12B: CacheBack r8 reaches 48% accuracy near 133 seconds, while fixed-budget settings show a different tradeoff; smaller text senders can be faster."><figcaption>Nemotron: relative r8 beats 12B text on both axes; 4B text remains faster but less accurate.</figcaption></figure>
+        </div>
+        </div>
+        <p class="curve-caption">Lines join the best accuracy-time tradeoffs within each channel; faded points are dominated settings. × means the receiver gets only the question. 50 concurrent tasks on 8 H100s; accuracy averaged over three receiver draws. Completion includes queueing. <a href="https://arxiv.org/pdf/2609.32046">Full setup and results in the paper.</a></p>
+      </div>
+    </section>
+    <section id="demo" class="demo-section" aria-labelledby="demo-title">
+      <div class="wrap">
+        <div class="demo-heading"><h2 id="demo-title">Watch the demo</h2></div>
+        <article class="recorded-demo coding-demo" id="coding-demo" aria-labelledby="coding-title">
+          <div class="demo-description"><div><p class="demo-type">36 seconds · 4K · Recorded coding task</p><h3 id="coding-title">Fixing a Django bug with seven coding agents</h3><p>Seven Qwen3-8B workers inspect the code and send information to a coordinator, which writes the Django fix. The video compares selected latent state with generated text messages. CacheBack produces the patch <strong class="rclc-emphasis">4.41× faster</strong> than with text communication on this case. Both runs make the same one-line code change and pass all 88 tests.</p></div></div>
+          <div class="demo-player"><video id="coding-video" controls playsinline preload="auto" tabindex="0" width="3840" height="2160" poster="demo/coding/poster.jpg" aria-labelledby="coding-title" aria-describedby="coding-caption">
+            <source src="demo/coding/rclc-cacheback-4k.mp4" type="video/mp4">
+            <p><a href="demo/coding/rclc-cacheback-4k.mp4">Watch the demo as an MP4</a>.</p>
+          </video><button class="play-demo" id="play-demo" type="button" hidden><span aria-hidden="true">▶</span> Watch the full demo</button></div>
+          <div class="demo-caption" id="coding-caption"><p><strong>One recorded case:</strong> CacheBack 25.66 s; text 113.21 s. Separate recorded runs are aligned at their start. Startup and test grading excluded. Silent video; playback speed varies. <a href="demo/coding/rclc-cacheback-4k.mp4">Open in full window</a></p>
+          </div>
+        </article>
+      </div>
+    </section>
+    <section class="code-section" id="code" aria-labelledby="code-title"><div class="wrap code-layout"><div><h2 id="code-title">Use CacheBack</h2><p>Install <code>rclc</code>, bind your agents, and pass the receiver’s request.</p><a class="button primary" href="https://github.com/agentcacheback/cacheback">Code and documentation</a></div><div class="code-card"><div class="code-bar"><span>Python</span><button class="copy-button" data-copy="quickstart" type="button" aria-label="Copy code"><svg class="copy-icon" aria-hidden="true" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7"><rect x="8" y="8" width="12" height="13" rx="2"/><path d="M16 8V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h3"/></svg><span class="copy-feedback" aria-hidden="true">Copied</span></button></div><pre><code id="quickstart"><span class="code-keyword">import</span> rclc
+
+sender = rclc.<span class="code-function">bind</span>(
+    model, tokenizer,
+    messages=sender_history, backend=<span class="code-string">"hf"</span>,
+)
+receiver = rclc.<span class="code-function">bind</span>(
+    model, tokenizer,
+    messages=receiver_history, backend=<span class="code-string">"hf"</span>,
+)
+<span class="code-focus"><span class="code-keyword">await</span> rclc.<span class="code-function">transfer</span>(
+    sender, receiver,
+    <span class="code-string">"Who owns the Cedar booking?"</span>,
+)</span>
+inputs = receiver.<span class="code-function">pop</span>()</code></pre><p class="snippet-note">Model, tokenizer, and histories loaded; run in an async function or notebook. <a href="https://github.com/agentcacheback/cacheback/blob/main/examples/quickstart.py">Runnable quickstart</a></p></div></div></section>
+    <section id="paper" class="section wrap paper-section" aria-labelledby="paper-title"><div><p class="eyebrow">THE PAPER</p><h2 id="paper-title">Receiver-Conditioned Latent Communication gives 94% CacheBack</h2><p>Maximillian Rossi, Prajwal Raghunath, Haoqing Xuan, Yusen Zhang, and Eugene Wu.</p><div class="hero-actions"><a class="button primary" href="https://arxiv.org/pdf/2609.32046">Read the PDF</a><a class="text-link" href="https://github.com/agentcacheback/cacheback/tree/paper">Reproduce the paper</a></div></div><div class="citation" id="citation"><h3>Cite this work</h3><button class="copy-button" data-copy="bibtex" type="button" aria-label="Copy citation"><svg class="copy-icon" aria-hidden="true" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7"><rect x="8" y="8" width="12" height="13" rx="2"/><path d="M16 8V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h3"/></svg><span class="copy-feedback" aria-hidden="true">Copied</span></button><pre><code id="bibtex">@misc{rossi2026cacheback,
+  title = {Receiver-Conditioned Latent Communication
+           gives 94\% CacheBack},
+  author = {Rossi, Maximillian and Raghunath, Prajwal
+            and Xuan, Haoqing and Zhang, Yusen
+            and Wu, Eugene},
+  year = {2026},
+  eprint = {2609.32046},
+  archivePrefix = {arXiv},
+  primaryClass = {cs.AI},
+  url = {https://arxiv.org/abs/2609.32046}
+}</code></pre></div></section>
+  </main>
+  <footer class="site-footer wrap"><a class="brand" href="#">CacheBack</a><span>Receiver-conditioned communication · 2026</span><a href="https://github.com/agentcacheback/cacheback">Code &amp; reproducibility</a></footer>
+  <div id="copy-status" class="sr-only" role="status"></div>
+</body>
 </html>

website/assets/app.js

@@ -0,0 +1,38 @@
+if (typeof document !== 'undefined') {
+  const byId = (id) => document.getElementById(id);
+  const video = byId('coding-video');
+  const play = byId('play-demo');
+  play.hidden = false;
+  play.addEventListener('click', async () => {
+    try {
+      await video.play();
+      video.focus();
+    } catch {
+      byId('copy-status').textContent = 'Playback unavailable. Try the Open in full window link below the video.';
+    }
+  });
+  video.addEventListener('play', () => { play.hidden = true; });
+
+  document.querySelectorAll('[data-copy]').forEach((button) => {
+    let reset;
+    button.addEventListener('click', async () => {
+      const content = byId(button.dataset.copy);
+      try {
+        await navigator.clipboard.writeText(content.textContent);
+        button.querySelector('.copy-feedback').textContent = 'Copied';
+        byId('copy-status').textContent = 'Copied to clipboard.';
+      } catch {
+        const selection = window.getSelection();
+        const range = document.createRange();
+        range.selectNodeContents(content);
+        selection.removeAllRanges();
+        selection.addRange(range);
+        button.querySelector('.copy-feedback').textContent = 'Selected';
+        byId('copy-status').textContent = 'Clipboard unavailable. Text selected; use your device’s copy command.';
+      }
+      clearTimeout(reset);
+      button.classList.add('is-copied');
+      reset = setTimeout(() => button.classList.remove('is-copied'), 1800);
+    });
+  });
+}

website/assets/results.json

@@ -0,0 +1,61 @@
+{
+  "source": "https://arxiv.org/html/2609.32046v1",
+  "table": "Table 1: selected operating points, FanOutQA",
+  "tasks": 50,
+  "gpus": "8 H100",
+  "receiver_draws": 3,
+  "models": {
+    "qwen": {
+      "name": "Qwen 3",
+      "size": "8B",
+      "ratio": 4,
+      "text": {
+        "accuracy": 0.4067,
+        "seconds": 611.9
+      },
+      "cache": {
+        "accuracy": 0.5533,
+        "seconds": 191.9
+      }
+    },
+    "nemotron": {
+      "name": "Nemotron Nano 2",
+      "size": "12B",
+      "ratio": 8,
+      "text": {
+        "accuracy": 0.38666666666666666,
+        "seconds": 131.2367
+      },
+      "cache": {
+        "accuracy": 0.5,
+        "seconds": 101.6259
+      }
+    },
+    "gemma": {
+      "name": "Gemma 4",
+      "size": "12B",
+      "ratio": 4,
+      "text": {
+        "accuracy": 0.52,
+        "seconds": 603.1
+      },
+      "cache": {
+        "accuracy": 0.5933,
+        "seconds": 201.3
+      }
+    },
+    "ministral": {
+      "name": "Ministral 3",
+      "size": "14B",
+      "ratio": 32,
+      "text": {
+        "accuracy": 0.3867,
+        "seconds": 1536.9
+      },
+      "cache": {
+        "accuracy": 0.5933,
+        "seconds": 193.3
+      }
+    }
+  }
+}

website/assets/styles.css

@@ -0,0 +1,263 @@
+@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&display=swap');
+
+:root { --paper:#fafafa; --ink:#202828; --muted:#636b6b; --line:#dce3e2; --soft:#f0f5f4; --accent:#bde8e3; --rclc:#0f766e; --text:#995319; --fixed:#795697; --sans:'DM Sans',Arial,sans-serif; }
+* { box-sizing:border-box; }
+html { scroll-behavior:smooth; scroll-padding-top:35px; }
+body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.65 var(--sans); -webkit-font-smoothing:antialiased; }
+::selection { background:var(--accent); color:var(--ink); }
+a { color:inherit; text-underline-offset:5px; }
+button,select,input { font:inherit; }
+button,a,input,select,summary { -webkit-tap-highlight-color:transparent; }
+button,summary { cursor:pointer; }
+button { color:inherit; }
+button:disabled { cursor:default; }
+:focus-visible { outline:3px solid var(--rclc); outline-offset:5px; }
+h1,h2,h3,p,figure { margin:0; }
+h1,h2,h3 { font-weight:500; }
+.wrap { width:min(1240px,calc(100% - 112px)); margin-inline:auto; }
+.site-header { min-height:100px; display:flex; align-items:center; justify-content:space-between; gap:24px; border-bottom:1px solid var(--line); }
+.brand { display:inline-flex; align-items:center; gap:12px; font-size:21px; letter-spacing:-.7px; font-weight:650; text-decoration:none; white-space:nowrap; }
+.brand-mark { display:grid; grid-template-columns:repeat(2,9px); gap:3px; }
+.brand-mark i { width:9px; height:9px; border-radius:1px; background:var(--ink); }
+.brand-mark i:last-child { background:var(--rclc); }
+.site-header nav { display:flex; align-items:center; gap:30px; font-size:14px; }
+.site-header nav a { text-decoration:none; color:var(--muted); }
+.site-header nav a:hover,.text-link:hover { color:var(--rclc); }
+.button { display:inline-flex; justify-content:center; align-items:center; gap:12px; padding:13px 21px; border:1px solid var(--ink); border-radius:5px; text-decoration:none; font-size:14px; font-weight:550; transition:background .16s,transform .16s; }
+.button:hover { background:var(--soft); transform:translateY(-1px); }
+.button.primary { background:var(--ink); color:white; }
+.button.primary:hover { background:var(--rclc); }
+.hero { display:grid; grid-template-columns:1fr 1fr; align-items:start; gap:74px; padding-block:80px 70px; }
+.eyebrow,.mono { font-family:var(--sans); font-size:12px; font-weight:600; letter-spacing:.12em; }
+.eyebrow { color:var(--muted); display:flex; align-items:center; gap:12px; }
+h1 { font-size:clamp(56px,6vw,84px); font-weight:650; line-height:1.05; letter-spacing:-3px; margin:20px 0 12px; }
+.hero-subtitle { font-size:26px; line-height:1.3; letter-spacing:-.6px; margin-bottom:27px; }
+.hero-copy>.eyebrow { text-transform:uppercase; }
+.hero-authors { margin-bottom:28px; }
+.hero-authors ul { display:flex; flex-wrap:wrap; gap:3px 19px; list-style:none; padding:0; margin:0; font-size:19px; font-weight:550; line-height:1.5; }
+.hero-authors li { white-space:nowrap; }
+.hero-authors .affiliations { display:flex; align-items:center; flex-wrap:wrap; gap:10px 14px; margin-top:13px; font-size:14px; color:var(--muted); }
+.affiliations a { display:flex; }
+.affiliations img { display:block; height:28px; width:auto; }
+.hero-intro { font-size:22px; line-height:1.45; letter-spacing:-.4px; }
+.hero-intro .rclc-emphasis { color:var(--rclc); font-weight:700; }
+.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:24px; margin-top:29px; }
+.text-link { font-size:14px; font-weight:500; }
+.resource-links { display:flex; flex-wrap:wrap; align-items:center; gap:9px; margin-top:31px; font-size:14px; }
+.resource-links a { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:44px; padding:10px 15px; font-weight:650; text-decoration:none; border:1px solid var(--ink); border-radius:12px; background:#fff; color:var(--ink); transition:background .15s,color .15s,border-color .15s; }
+.resource-links a:is(:hover,:focus-visible) { background:var(--ink); color:#fff; border-color:transparent; }
+.resource-links a:first-child { background:var(--rclc); border-color:var(--rclc); color:#fff; }
+.resource-links a:first-child:is(:hover,:focus-visible) { background:#fff; color:var(--rclc); border-color:transparent; }
+.resource-links a:nth-child(2) { background:var(--ink); border-color:var(--ink); color:#fff; }
+.resource-links a:nth-child(2):is(:hover,:focus-visible) { background:#fff; color:var(--ink); border-color:transparent; }
+.resource-links a>span { font-size:10px; letter-spacing:.03em; color:inherit; }
+strong,b { font-weight:650; }
+.rclc-emphasis { color:var(--rclc); }
+.text-emphasis { color:var(--text); }
+.fixed-emphasis { color:var(--fixed); }
+.hero-results { min-width:0; }
+.hero-results .eyebrow { line-height:1.65; }
+.chart-context { color:var(--muted); font-size:13px; line-height:1.5; margin-top:9px; max-width:400px; }
+.hero-results .technical { margin-top:20px; font-size:13px; border-bottom:0; padding-bottom:0; }
+.hero-results .technical p { font-size:12px; }
+.comparison-plot { margin-top:20px; }
+.plot-legend { display:flex; flex-wrap:wrap; gap:18px; font-size:13px; margin-bottom:18px; }
+.plot-legend span { display:flex; align-items:center; gap:7px; }
+.plot-legend i { width:16px; height:8px; background:#67726b; border-radius:2px; }
+.plot-legend .rclc-emphasis i { background:var(--rclc); }
+.paired-metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
+.chart-heading { border-bottom:1px solid var(--line); padding-bottom:15px; font-size:14px; line-height:1.4; }
+.model-row { padding:14px 0; border-bottom:1px solid var(--line); }
+.model-heading { margin-bottom:8px; }
+.model-label { display:flex; justify-content:space-between; align-items:baseline; gap:8px; min-width:0; }
+.accuracy-gain,.speedup { color:var(--rclc); font-size:14px; white-space:nowrap; }
+.accuracy-gain abbr { text-decoration:none; }
+.latency-bars { position:relative; }
+.speed-guide { position:absolute; inset:0 58px 0 0; color:var(--rclc); pointer-events:none; }
+.speedup { position:absolute; left:calc(var(--cache-end) + 6px); top:25px; font-size:12px; line-height:20px; }
+.model-heading h3 { font-size:15px; font-weight:650; letter-spacing:0; }
+.model-heading small { color:var(--muted); font-size:12px; font-weight:400; }
+.bar-row { line-height:20px; display:grid; grid-template-columns:minmax(0,1fr) 50px; gap:8px; align-items:center; font-size:12px; }
+.bar-row+.bar-row { margin-top:5px; }
+.bar-row>b { text-align:right; font-variant-numeric:tabular-nums; }
+.bar-track { border-left:1px solid #b5bfb7; background:repeating-linear-gradient(to right,transparent 0 calc(50% - 1px),#dce2dc calc(50% - 1px) 50%); }
+.bar-track i { display:block; height:17px; background:#67726b; border-radius:0 2px 2px 0; }
+.rclc-bar { color:var(--rclc); }
+.rclc-bar i { background:var(--rclc); }
+.chart-axis { margin:8px 58px 0 0; color:var(--muted); font-size:12px; position:relative; height:20px; }
+.chart-axis span { position:absolute; transform:translateX(-50%); white-space:nowrap; }
+.chart-axis span:nth-child(1) { left:0; }
+.chart-axis span:nth-child(2) { left:50%; }
+.chart-axis span:nth-child(3) { left:100%; }
+
+.abstract-section { display:grid; grid-template-columns:1fr; align-items:center; gap:48px; padding-block:64px; border-top:1px solid var(--line); }
+.tldr { font-size:16px; line-height:1.65; }
+.abstract-section .overview-figure { max-width:900px; margin-inline:auto; }
+.overview-figure img { width:100%; height:auto; display:block; }
+.overview-figure figcaption { color:var(--muted); font-size:12px; margin-top:18px; }
+.tldr p+p { margin-top:12px; }
+.tldr strong { color:var(--rclc); }
+.paper-curves { margin-top:30px; }
+.curves-heading { max-width:810px; }
+.curves-heading h3 { font-size:27px; margin-bottom:12px; }
+.curves-heading p { color:var(--muted); font-size:15px; }
+.curve-legend { display:flex; flex-wrap:wrap; gap:10px 24px; font-size:13px; margin-block:23px 5px; }
+.curve-grid { display:grid; grid-template-columns:1fr 1fr; gap:34px; }
+.curve-grid figure { min-width:0; }
+.curve-grid img { width:100%; height:auto; display:block; }
+.chain-results { margin-top:32px; border-block:1px solid var(--line); padding:20px 0; }
+.curve-caption { color:var(--muted); font-size:12px; margin-top:26px; }
+.section { padding-block:64px; border-top:1px solid var(--line); }
+h2 { font-size:36px; line-height:1.2; letter-spacing:-1.1px; }
+h3 { font-size:20px; letter-spacing:-.5px; }
+.technical { border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-top:32px; padding:15px 0; font-size:14px; }
+summary { font-weight:500; }
+.technical p { color:var(--muted); max-width:960px; margin-top:17px; }
+.demo-section { padding:70px 0; border-block:1px solid var(--line); }
+.demo-heading { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:85px; margin-bottom:32px; }
+.demo-heading p { color:var(--muted); max-width:460px; }
+.recorded-demo { background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; }
+.coding-demo video { display:block; width:100%; height:auto; aspect-ratio:16/9; background:#f4f5f5; border-top:1px solid var(--line); }
+.coding-demo .demo-evidence { margin-top:12px; }
+.coding-demo .demo-evidence p { margin-top:12px; max-width:100ch; }
+.demo-player { position:relative; }
+.play-demo { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); border:0; border-radius:12px; padding:18px 24px; background:var(--rclc); color:#fff; font-size:18px; font-weight:700; white-space:nowrap; box-shadow:0 4px 24px #163b3526; }
+.play-demo:hover { background:var(--ink); }
+.play-demo span { margin-right:8px; }
+.demo-description { display:flex; align-items:flex-start; justify-content:space-between; gap:36px; padding:27px 30px; }
+.demo-description h3 { font-size:28px; margin:7px 0 10px; }
+.demo-description p { color:var(--muted); font-size:14px; max-width:74ch; }
+.demo-description .demo-type { font-size:11px; font-weight:650; text-transform:uppercase; letter-spacing:.09em; color:var(--rclc); }
+.demo-evidence { margin-top:18px; color:var(--muted); font-size:12px; }
+.demo-evidence>div { white-space:pre-wrap; margin-top:12px; }
+.demo-replay-link { padding:20px 30px; }
+.demo-window { border-top:1px solid var(--line); background:#fff; }
+iframe { display:block; width:100%; height:815px; border:0; background:#fff; }
+.demo-caption { color:var(--muted); font-size:12px; padding:17px 30px; border-top:1px solid var(--line); }
+.code-section { background:var(--soft); border-block:1px solid var(--line); padding:75px 0; }
+.code-layout { display:grid; grid-template-columns:.9fr 1.1fr; gap:90px; align-items:center; }
+.code-layout h2 { margin:0 0 20px; }
+.code-layout>div>p:not(.eyebrow) { color:var(--muted); max-width:370px; }
+.code-layout .button { margin-top:25px; }
+.code-layout .code-note { font-size:12px; margin-top:23px; }
+.code-card { background:#162c2c; color:#e8f3f2; border-radius:12px; overflow:hidden; min-width:0; }
+.code-bar { display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px solid #345151; padding:12px 24px; color:#b6cdcb; font-size:12px; }
+.copy-button { border:0; background:transparent; border-radius:3px; padding:5px 10px; font-size:12px; }
+.copy-button:hover { background:transparent; color:var(--rclc); }
+.code-card .copy-button { border:0; border-radius:7px; background:transparent; color:#e8f3f2; padding:6px 11px; }
+.code-card .copy-button:hover { background:transparent; color:#8bd9d1; }
+.code-card pre { padding:22px 24px 18px; line-height:1.65; }
+.code-focus { display:block; background:#214442; border-left:2px solid #8bd9d1; margin:15px -24px 0; padding:12px 22px; }
+pre { margin:0; padding:23px; overflow:auto; font:13px/1.85 'SFMono-Regular',Consolas,monospace; tab-size:2; }
+.snippet-note { font-size:12px; line-height:1.65; color:#adc7c4; padding:0 24px 21px; }
+.snippet-note a { display:block; margin-top:8px; color:#e8f3f2; }
+.paper-section { display:grid; grid-template-columns:1.05fr .95fr; gap:80px; align-items:start; }
+.paper-section h2 { font-size:33px; margin:19px 0; letter-spacing:-1px; }
+.citation { border-block:1px solid var(--line); padding:18px 0; margin-top:38px; min-width:0; }
+.citation h3 { font-size:18px; }
+.citation pre { padding:18px 0 0; font-size:12px; }
+.citation button { margin-top:12px; }
+.site-footer { padding:27px 0; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:20px; color:var(--muted); font-size:12px; }
+.site-footer .brand { color:var(--ink); font-size:17px; }
+.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
+.skip-link { position:fixed; top:-100px; left:15px; z-index:10; background:var(--accent); padding:10px; }
+.skip-link:focus { top:10px; }
+@media(min-width:1500px) { .hero { padding-block:95px 85px; } }
+@media(max-width:1100px) {
+.wrap { width:calc(100% - 64px); }
+.hero { gap:38px; padding-block:60px; }
+h1 { font-size:64px; }
+.section-heading,.demo-heading { gap:40px; }
+.code-layout { gap:45px; }
+}
+@media(min-width:521px) { body { zoom:.945; } }
+@media(min-width:801px) {
+body { zoom:.85; }
+.wrap { width:min(1240px,calc(100% - 144px)); }
+}
+@media(max-width:800px) {
+
+.hero-results { width:100%; max-width:600px; }
+.abstract-section { grid-template-columns:1fr; gap:28px; padding-block:45px; }
+.curve-grid { grid-template-columns:1fr; gap:30px; }
+.site-header { min-height:80px; }
+.site-header nav { gap:19px; }
+.hero { gap:35px; grid-template-columns:1fr; padding-block:45px; }
+.hero-copy { max-width:600px; }
+h1 { font-size:72px; }
+.section { padding-block:60px; }
+.section-heading,.demo-heading { grid-template-columns:1fr; gap:19px; }
+.code-layout,.paper-section { grid-template-columns:1fr; gap:30px; }
+.code-layout>div>p:not(.eyebrow) { max-width:none; }
+.citation { margin-top:0; }
+iframe { height:890px; }
+.site-footer>span { display:none; }
+}
+@media(max-width:520px) {
+.hero-authors ul { font-size:17px; gap:4px 17px; }
+
+.curve-legend { gap:8px 15px; font-size:12px; }
+.wrap { width:calc(100% - 36px); }
+.site-header { min-height:74px; gap:12px; }
+.brand { font-size:18px; gap:8px; }
+.brand-mark { grid-template-columns:repeat(2,7px); gap:2px; }
+.brand-mark i { width:7px; height:7px; }
+.site-header nav { gap:12px; font-size:12px; }
+h1 { font-size:56px; letter-spacing:-2px; }
+.hero-subtitle { font-size:23px; }
+.hero-intro { font-size:21px; }
+.hero-actions { gap:20px; }
+.resource-links { gap:8px; }
+.resource-links a { padding-inline:12px; }
+h2 { font-size:32px; }
+.demo-section { padding-top:51px; }
+.demo-replay-link { padding-inline:20px; }
+.demo-caption { padding:17px 20px; }
+.demo-description { flex-direction:column; gap:18px; padding:22px 20px; }
+.code-section { padding-block:50px; }
+.paper-section h2 { font-size:32px; }
+.site-footer { flex-wrap:wrap; font-size:12px; }
+.citation pre { font-size:12px; }
+}
+@media(prefers-reduced-motion:reduce) {
+html { scroll-behavior:auto; }
+*,*::before,*::after { transition:none!important; animation:none!important; }
+}
+
+.code-keyword { color:#bacafa; }
+.code-function { color:#8bd9d1; }
+.code-string { color:#e6ce99; }
+
+.copy-button { position:relative; display:inline-grid; place-items:center; min-width:72px; min-height:36px; }
+.copy-icon,.copy-feedback { grid-area:1/1; transition:opacity .6s ease; }
+.copy-feedback { opacity:0; }
+.is-copied .copy-icon { opacity:0; }
+.is-copied .copy-feedback { opacity:1; }
+@media(prefers-reduced-motion:reduce) { .copy-icon,.copy-feedback { transition:none; } }
+
+.booking-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; margin-bottom:24px; }
+.booking-heading h2 { max-width:850px; font-size:clamp(24px,2.5vw,32px); line-height:1.3; margin:0; }
+.booking-heading .eyebrow { margin-bottom:10px; }
+.booking-heading > a { flex-shrink:0; }
+#booking-demo .demo-window { border-top:0; }
+@media(max-width:800px) { .booking-heading { align-items:flex-start; flex-direction:column; gap:14px; } }
+
+#hero-title { font-size:clamp(34px,3.6vw,50px); line-height:1.12; letter-spacing:-1.5px; margin-bottom:28px; }
+.visual-note { color:var(--muted); font-size:14px; line-height:1.65; margin-bottom:24px; }
+.curve-grid figcaption { color:var(--muted); font-size:13px; margin-top:10px; }
+
+
+.topology-diagram { margin:24px 0 32px; padding:24px; background:var(--soft); border-radius:14px; }
+.agent-node { position:relative; display:flex; flex-direction:column; justify-content:center; gap:4px; min-width:0; padding:16px 12px; text-align:center; background:white; border:1px solid var(--line); border-radius:9px; }
+.agent-node small { font-size:12px; color:var(--muted); }.agent-node strong { font-size:16px; }
+.agent-node.receiver { background:var(--rclc); color:white; }.receiver small { color:white; }
+.parallel { display:grid; grid-template-columns:minmax(0,1fr) 110px minmax(0,1fr); align-items:center; max-width:700px; }
+.senders { display:grid; gap:12px; }.merge { height:calc(100% - 80px); border-right:2px solid var(--rclc); border-block:2px solid var(--rclc); position:relative; margin-right:35px; }
+.merge:before { content:""; position:absolute; top:50%; width:100%; border-top:2px solid var(--rclc); }.merge:after { content:"→"; position:absolute; left:100%; top:50%; transform:translateY(-50%); width:35px; text-align:center; color:var(--rclc); font-size:26px; }.merge span { position:absolute; left:5px; top:50%; transform:translateY(-25px); font-size:11px; color:var(--rclc); }
+.sequential { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:28px; align-items:stretch; }.sequential .agent-node:not(:last-child):after { content:"→"; position:absolute; left:100%; width:28px; top:50%; transform:translateY(-50%); color:var(--rclc); font-size:24px; }
+@media(max-width:600px) { .parallel { grid-template-columns:minmax(0,1fr) 65px minmax(0,1fr); padding:14px; }.merge { margin-right:20px; }.merge:after { width:20px; }.merge span { display:none; }.agent-node { padding:12px 6px; }.sequential { grid-template-columns:1fr; gap:25px; }.sequential .agent-node:not(:last-child):after { content:"↓"; left:50%; top:100%; transform:translateX(-50%); height:25px; line-height:25px; } }
+
+.benchmark-setup { display:grid; grid-template-columns:1fr 1fr; gap:36px; align-items:center; margin-bottom:24px; }.benchmark-setup .topology-diagram { margin:0; padding:16px; }.benchmark-setup .sequential { gap:18px; }.benchmark-setup .sequential .agent-node { padding:12px 4px; }.benchmark-setup .sequential .agent-node:after { width:18px; }.benchmark-setup .sequential strong { font-size:13px; }
+@media(max-width:900px) { .benchmark-setup { grid-template-columns:1fr; gap:20px; } }
+
+@media(max-width:600px) { .benchmark-setup .sequential { gap:25px; } }

website/check.mjs

@@ -0,0 +1,106 @@
+import assert from 'node:assert/strict';
+import { readFileSync, readdirSync, statSync } from 'node:fs';
+import { fileURLToPath } from 'node:url';
+import { resolve, dirname } from 'node:path';
+import { gzipSync } from 'node:zlib';
+
+const root = dirname(fileURLToPath(import.meta.url));
+const dist = resolve(root, 'assets');
+const project = resolve(root, '..');
+const read = (name) => readFileSync(resolve(dist, name), 'utf8');
+const html = readFileSync(resolve(project, 'index.html'), 'utf8');
+const css = read('styles.css');
+const js = read('app.js');
+const data = JSON.parse(read('results.json'));
+const ids = [...html.matchAll(/\bid="([^"]+)"/g)].map((match) => match[1]);
+assert.equal(new Set(ids).size, ids.length, 'Duplicate HTML IDs');
+assert.equal((html.match(/<h1\b/g) || []).length, 1, 'One page heading');
+assert.match(html, /<h1 id="hero-title">Receiver-Conditioned Latent Communication gives/);
+assert.equal((html.match(/<figcaption>/g) || []).length, 5, 'Explain each paper figure');
+assert.match(html, /<html lang="en">/);
+assert.match(html, /name="viewport"/);
+assert.match(html, /<title>Receiver-Conditioned Latent Communication gives 94% CacheBack<\/title>/);
+const sectionOrder = ['result-summary', 'booking-demo', 'abstract', 'results', 'demo', 'code', 'paper'];
+sectionOrder.slice(1).forEach((id, i) => {
+  assert.ok(html.indexOf(`id="${sectionOrder[i]}"`) < html.indexOf(`id="${id}"`), `Section order: ${id}`);
+});
+assert.equal((html.match(/<img src="website\/assets\/figures\//g) || []).length, 5);
+
+for (const [, url] of html.matchAll(/(?:href|src|poster)="([^"]+)"/g)) {
+  if (/^(https:|data:)/.test(url)) continue;
+  if (url.startsWith('#')) {
+    assert.ok(url === '#' || ids.includes(url.slice(1)), `Missing anchor: ${url}`);
+  } else {
+    const pathname = new URL(url, 'https://example.invalid/rclc/').pathname;
+    assert.ok(pathname.startsWith('/rclc/'), `Link escapes the project path: ${url}`);
+    const path = pathname.slice('/rclc/'.length);
+    const asset = path.endsWith('/') ? `${path}index.html` : path;
+    assert.ok(statSync(resolve(project, asset)).isFile(), `Missing local asset: ${url}`);
+  }
+}
+for (const [, id] of js.matchAll(/byId\('([^']+)'\)/g)) {
+  assert.ok(ids.includes(id), `Script refers to missing element: ${id}`);
+}
+assert.equal(data.models.gemma.ratio, 4, 'Use the paper selected point, not Gemma maximum accuracy');
+assert.equal(data.models.ministral.ratio, 32);
+assert.equal(data.models.nemotron.ratio, 8);
+for (const model of Object.values(data.models)) {
+  assert.ok(model.ratio >= 2 && Number.isInteger(model.ratio));
+  for (const arm of [model.text, model.cache]) {
+    assert.ok(arm.accuracy >= 0 && arm.accuracy <= 1);
+    assert.ok(arm.seconds > 0 && Number.isFinite(arm.seconds));
+  }
+}
+// The displayed bar lengths must encode the published data on shared zero-based scales.
+const plottedWidths = [...html.matchAll(/<i style="width:([\d.]+)%"/g)].map(match => Number(match[1]));
+const expectedWidths = Object.values(data.models).flatMap(model => [
+  model.text.accuracy * 100, model.cache.accuracy * 100,
+  model.text.seconds / 1600 * 100, model.cache.seconds / 1600 * 100,
+]);
+assert.equal(plottedWidths.length, 16);
+plottedWidths.forEach((width, i) => assert.ok(Math.abs(width - expectedWidths[i]) < 0.0001));
+const gains = [...html.matchAll(/class="accuracy-gain">\+([\d.]+)<abbr/g)].map(match => Number(match[1]));
+const speedups = [...html.matchAll(/<strong class="speedup">([\d.]+)× faster<\/strong>/g)].map(match => Number(match[1]));
+assert.deepEqual(gains, Object.values(data.models).map(m => Number(((m.cache.accuracy - m.text.accuracy) * 100).toFixed(1))));
+assert.deepEqual(speedups, Object.values(data.models).map(m => Number((m.text.seconds / m.cache.seconds).toFixed(1))));
+assert.doesNotMatch(html, /name="model"/);
+assert.match(html, /loading="lazy" sandbox="allow-scripts allow-same-origin"/);
+assert.match(css, /prefers-reduced-motion:reduce/);
+assert.match(css, /:focus-visible/);
+assert.match(html, /id="bibtex"/);
+assert.match(html, /<iframe[^>]+src="demo\/index\.html\?v=fit-7"/);
+assert.match(readFileSync(resolve(project, 'demo/index.html'), 'utf8'), /fetch\("trace-w4\.json"\)/);
+// The booking record is rendered by the embedded replay, not duplicated in the page.
+const replay = readFileSync(resolve(project, 'demo/index.html'), 'utf8');
+assert.match(replay, /trace-w4\.json/);
+assert.match(html, /aria-labelledby="booking-question"/);
+assert.doesNotMatch(html, /Recorded model run|demo-outcomes|hero-description|class="contribution"/);
+for (const label of ['Copy code', 'Copy citation']) assert.ok(html.includes(`aria-label="${label}"`));
+
+const coding = JSON.parse(readFileSync(resolve(project, 'demo/coding/evidence.json'), 'utf8')).arms;
+assert.ok(html.indexOf('id="booking-demo"') < html.indexOf('id="coding-demo"'), 'Booking replay precedes coding video');
+const video = html.match(/<video\b[^>]*>[\s\S]*?<\/video>/)[0];
+assert.match(video, /controls playsinline preload="auto"/);
+assert.doesNotMatch(video, /autoplay/);
+assert.match(video, /src="demo\/coding\/rclc-cacheback-4k.mp4"/);
+assert.match(video, /poster="demo\/coding\/poster.jpg"/);
+assert.equal(readFileSync(resolve(project, 'demo/coding/rclc-cacheback-4k.mp4')).toString('ascii', 4, 8), 'ftyp', 'Real MP4, not a Git LFS pointer');
+assert.ok(html.includes(`${(coding.text.seconds / coding.latent.seconds).toFixed(2)}× faster`));
+assert.ok(html.includes(`CacheBack ${coding.latent.seconds.toFixed(2)} s; text ${coding.text.seconds.toFixed(2)} s`));
+assert.equal(coding.latent.patch, coding.text.patch);
+for (const arm of Object.values(coding)) {
+  assert.equal(arm.new_tests_passed + arm.regression_tests_passed, 88);
+  assert.equal(arm.failed_tests, 0);
+}
+
+assert.ok(gzipSync(js).length < 6000, 'Keep page JavaScript below 6 KB gzip');
+assert.ok(!/[\u2013\u2014\u200b-\u200d\ufeff\u2060]/u.test(html), 'Banned punctuation or invisible character: index.html');
+let bytes = Buffer.byteLength(html);
+for (const name of readdirSync(dist, { recursive: true })) {
+  if (!statSync(resolve(dist, name)).isFile()) continue;
+  const content = readFileSync(resolve(dist, name));
+  bytes += content.length;
+  assert.ok(!/[\u2013\u2014\u200b-\u200d\ufeff\u2060]/u.test(content.toString()), `Banned punctuation or invisible character: ${name}`);
+}
+assert.ok(bytes < 100000, 'Keep first-party static assets below 100 KB');
+console.log(`Website checks passed: anchors, assets, benchmark points, accessibility hooks; ${bytes} bytes, ${gzipSync(js).length} bytes gzipped JS.`);