1243 lines · 53.8 KB · Text
RawDownload
---import Layout from "../layouts/Layout.astro";import { GITHUB_REPOSITORY_URL, MARKETING_STATS } from "../lib/site";import { tweets } from "../lib/tweets"; const desktopEndorsementRows = [  tweets.filter((_, index) => index % 2 === 0),  tweets.filter((_, index) => index % 2 === 1),]; const mobileEndorsementRows = [  tweets.filter((_, index) => index % 3 === 0),  tweets.filter((_, index) => index % 3 === 1),  tweets.filter((_, index) => index % 3 === 2),];--- <Layout>  <!-- ── Hero ──────────────────────────────────────────────────── -->  <section class="hero">    <div class="hero-grid" aria-hidden="true"></div>     <div class="hero-float" aria-hidden="true">      <span class="hero-float-mark hf-claude" title="Claude Code">        <img src="/harnesses/claude-ai-icon.svg" alt="" />      </span>      <span class="hero-float-mark hf-codex" title="Codex">        <img src="/harnesses/openai_dark.svg" alt="" />      </span>      <span class="hero-float-mark hf-opencode" title="OpenCode">        <img src="/harnesses/opencode-dark.svg" alt="" />      </span>      <span class="hero-float-mark hf-cursor" title="Cursor">        <img src="/harnesses/cursor_light.svg" alt="" />      </span>    </div>     <div class="container hero-inner">      <h1 class="hero-title display">        The open-source<br />control plane<br />for coding agents.      </h1>       <p class="hero-sub">        Orchestrate Claude Code, Codex, OpenCode and Cursor from one surface.        Bring your own subscription. Fork the whole thing.      </p>       <div class="hero-actions">        <a          id="download-btn"          href="https://github.com/pingdotgg/t3code/releases"          class="btn btn-primary btn-lg"        >          <svg class="dl-icon dl-icon--apple" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 814 1000" aria-hidden="true"><path fill="currentColor" d="M788.1 340.9c-5.8 4.5-108.2 62.2-108.2 190.5 0 148.4 130.3 200.9 134.2 202.2-.6 3.2-20.7 71.9-68.7 141.9-42.8 61.6-87.5 123.1-155.5 123.1s-85.5-39.5-164-39.5c-76.5 0-103.7 40.8-165.9 40.8s-105.6-57-155.5-127C46.7 790.7 0 663 0 541.8c0-194.4 126.4-297.5 250.8-297.5 66.1 0 121.2 43.4 162.7 43.4 39.5 0 101.1-46 176.3-46 28.5 0 130.9 2.6 198.3 99.2zm-234-181.5c31.1-36.9 53.1-88.1 53.1-139.3 0-7.1-.6-14.3-1.9-20.1-50.6 1.9-110.8 33.7-147.1 75.8-28.5 32.4-55.1 83.6-55.1 135.5 0 7.8 1.3 15.6 1.9 18.1 3.2.6 8.4 1.3 13.6 1.3 45.4 0 102.5-30.4 135.5-71.3z"/></svg>          <svg class="dl-icon dl-icon--windows" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 88 88" aria-hidden="true"><path fill="currentColor" d="m0 12.402 35.687-4.86.016 34.423-35.67.203zm35.67 33.529.028 34.453L.028 75.48.026 45.7zm4.326-39.025L87.314 0v41.527l-47.318.376zm47.329 39.349-.011 41.34-47.318-6.678-.066-34.739z"/></svg>          <svg class="dl-icon dl-icon--linux" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M12.504 0c-.155 0-.315.008-.48.021-4.226.333-3.105 4.807-3.17 6.298-.076 1.092-.3 1.953-1.05 3.02-.885 1.051-2.127 2.75-2.716 4.521-.278.832-.41 1.684-.287 2.489a.424.424 0 00-.11.135c-.26.268-.45.6-.663.839-.199.199-.485.267-.797.4-.313.136-.658.269-.864.68-.09.189-.136.394-.132.602 0 .199.027.4.055.536.058.399.116.728.04.97-.249.68-.28 1.145-.106 1.484.174.334.535.47.94.601.81.2 1.91.135 2.774.6.926.466 1.866.67 2.616.47.526-.116.97-.464 1.208-.946.587-.003 1.23-.269 2.26-.334.699-.058 1.574.267 2.577.2.025.134.063.198.114.333l.003.003c.391.778 1.113 1.132 1.884 1.071.771-.06 1.592-.536 2.257-1.306.631-.765 1.683-1.084 2.378-1.503.348-.199.629-.469.649-.853.023-.4-.2-.811-.714-1.376v-.097l-.003-.003c-.17-.2-.25-.535-.338-.926-.085-.401-.182-.786-.492-1.046h-.003c-.059-.054-.123-.067-.188-.135a.357.357 0 00-.19-.064c.431-1.278.264-2.55-.173-3.694-.533-1.41-1.465-2.638-2.175-3.483-.796-1.005-1.576-1.957-1.56-3.368.026-2.152.236-6.133-3.544-6.139zm.529 3.405h.013c.213 0 .396.062.584.198.19.135.33.332.438.533.105.259.158.459.166.724 0-.02.006-.04.006-.06v.105a.086.086 0 01-.004-.021l-.004-.024a1.807 1.807 0 01-.15.706.953.953 0 01-.213.335.71.71 0 00-.088-.042c-.104-.045-.198-.064-.284-.133a1.312 1.312 0 00-.22-.066c.05-.06.146-.133.183-.198.053-.128.082-.264.088-.402v-.02a1.21 1.21 0 00-.061-.4c-.045-.134-.101-.2-.183-.333-.084-.066-.167-.132-.267-.132h-.016c-.093 0-.176.03-.262.132a.8.8 0 00-.205.334 1.18 1.18 0 00-.09.4v.019c.002.089.008.179.02.267-.193-.067-.438-.135-.607-.202a1.635 1.635 0 01-.018-.2v-.02a1.772 1.772 0 01.15-.768c.082-.22.232-.406.43-.533a.985.985 0 01.594-.2zm-2.962.059h.036c.142 0 .27.048.399.135.146.129.264.288.344.465.09.199.14.4.153.667v.004c.007.134.006.2-.002.266v.08c-.03.007-.056.018-.083.024-.152.055-.274.135-.393.2.012-.09.013-.18.003-.267v-.015c-.012-.133-.04-.2-.082-.333a.613.613 0 00-.166-.267.248.248 0 00-.183-.064h-.021c-.071.006-.13.04-.186.132a.552.552 0 00-.12.27.944.944 0 00-.023.33v.015c.012.135.037.2.08.334.046.134.098.2.166.268.01.009.02.018.034.024-.07.057-.117.07-.176.136a.304.304 0 01-.131.068 2.62 2.62 0 01-.275-.402 1.772 1.772 0 01-.155-.667 1.759 1.759 0 01.08-.668 1.43 1.43 0 01.283-.535c.128-.133.26-.2.418-.2zm1.37 1.706c.332 0 .733.065 1.216.399.293.2.523.269 1.052.468h.003c.255.136.405.266.478.399v-.131a.571.571 0 01.016.47c-.123.31-.516.643-1.063.842v.002c-.268.135-.501.333-.775.465-.276.135-.588.292-1.012.267a1.139 1.139 0 01-.448-.067 3.566 3.566 0 01-.322-.198c-.195-.135-.363-.332-.612-.465v-.005h-.005c-.4-.246-.616-.512-.686-.71-.07-.268-.005-.47.193-.6.224-.135.38-.271.483-.336.104-.074.143-.102.176-.131h.002v-.003c.169-.202.436-.47.839-.601.139-.036.294-.065.466-.065zm2.8 2.142c.358 1.417 1.196 3.475 1.735 4.473.286.534.855 1.659 1.102 3.024.156-.005.33.018.513.064.646-1.671-.546-3.467-1.089-3.966-.22-.2-.232-.335-.123-.335.59.534 1.365 1.572 1.646 2.757.13.535.16 1.104.021 1.67.067.028.135.06.205.067 1.032.534 1.413.938 1.23 1.537v-.043c-.06-.003-.12 0-.18 0h-.016c.151-.467-.182-.825-1.065-1.224-.915-.4-1.646-.336-1.77.465-.008.043-.013.066-.018.135-.068.023-.139.053-.209.064-.43.268-.662.669-.793 1.187-.13.533-.17 1.156-.205 1.869v.003c-.02.334-.17.838-.319 1.35-1.5 1.072-3.58 1.538-5.348.334a2.645 2.645 0 00-.402-.533 1.45 1.45 0 00-.275-.333c.182 0 .338-.03.465-.067a.615.615 0 00.314-.334c.108-.267 0-.697-.345-1.163-.345-.467-.931-.995-1.788-1.521-.63-.4-.986-.87-1.15-1.396-.165-.534-.143-1.085-.015-1.645.245-1.07.873-2.11 1.274-2.763.107-.065.037.135-.408.974-.396.751-1.14 2.497-.122 3.854a8.123 8.123 0 01.647-2.876c.564-1.278 1.743-3.504 1.836-5.268.048.036.217.135.289.202.218.133.38.333.59.465.21.201.477.335.876.335.039.003.075.006.11.006.412 0 .73-.134.997-.268.29-.134.52-.334.74-.4h.005c.467-.135.835-.402 1.044-.7zm2.185 8.958c.037.6.343 1.245.882 1.377.588.134 1.434-.333 1.791-.765l.211-.01c.315-.007.577.01.847.268l.003.003c.208.199.305.53.391.876.085.4.154.78.409 1.066.486.527.645.906.636 1.14l.003-.007v.018l-.003-.012c-.015.262-.185.396-.498.595-.63.401-1.746.712-2.457 1.57-.618.737-1.37 1.14-2.036 1.191-.664.053-1.237-.2-1.574-.898l-.005-.003c-.21-.4-.12-1.025.056-1.69.176-.668.428-1.344.463-1.897.037-.714.076-1.335.195-1.814.12-.465.308-.797.641-.984l.045-.022zm-10.814.049h.01c.053 0 .105.005.157.014.376.055.706.333 1.023.752l.91 1.664.003.003c.243.533.754 1.064 1.189 1.637.434.598.77 1.131.729 1.57v.006c-.057.744-.48 1.148-1.125 1.294-.645.135-1.52.002-2.395-.464-.968-.536-2.118-.469-2.857-.602-.369-.066-.61-.2-.723-.4-.11-.2-.113-.602.123-1.23v-.004l.002-.003c.117-.334.03-.752-.027-1.118-.055-.401-.083-.71.043-.94.16-.334.396-.4.69-.533.294-.135.64-.202.915-.47h.002v-.002c.256-.268.445-.601.668-.838.19-.201.38-.336.663-.336zm7.159-9.074c-.435.201-.945.535-1.488.535-.542 0-.97-.267-1.28-.466-.154-.134-.28-.268-.373-.335-.164-.134-.144-.333-.074-.333.109.016.129.134.199.2.096.066.215.2.36.333.292.2.68.467 1.167.467.485 0 1.053-.267 1.398-.466.195-.135.445-.334.648-.467.156-.136.149-.267.279-.267.128.016.034.134-.147.332a8.097 8.097 0 01-.69.468zm-1.082-1.583V5.64c-.006-.02.013-.042.029-.05.074-.043.18-.027.26.004.063 0 .16.067.15.135-.006.049-.085.066-.135.066-.055 0-.092-.043-.141-.068-.052-.018-.146-.008-.163-.065zm-.551 0c-.02.058-.113.049-.166.066-.047.025-.086.068-.14.068-.05 0-.13-.02-.136-.068-.01-.066.088-.133.15-.133.08-.031.184-.047.259-.005.019.009.036.03.03.05v.02h.003z"/></svg>          <span id="download-label">Download for macOS</span>        </a>        <a class="hero-source-link" href={GITHUB_REPOSITORY_URL} target="_blank" rel="noopener noreferrer">          <svg class="hero-source-mark" width="15" height="15" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">            <path d="M12 .5C5.65.5.5 5.65.5 12a11.5 11.5 0 007.86 10.93c.58.1.79-.25.79-.56v-2c-3.2.69-3.88-1.37-3.88-1.37-.52-1.33-1.27-1.69-1.27-1.69-1.04-.71.08-.7.08-.7 1.15.08 1.76 1.18 1.76 1.18 1.02 1.76 2.68 1.25 3.33.96.1-.75.4-1.25.72-1.54-2.55-.29-5.24-1.27-5.24-5.67 0-1.25.45-2.28 1.18-3.08-.12-.29-.51-1.45.11-3.02 0 0 .96-.31 3.15 1.18a10.96 10.96 0 015.74 0c2.19-1.49 3.15-1.18 3.15-1.18.62 1.57.23 2.73.11 3.02.74.8 1.18 1.83 1.18 3.08 0 4.41-2.7 5.38-5.27 5.66.41.36.78 1.06.78 2.13v3.16c0 .31.21.67.8.56A11.5 11.5 0 0023.5 12C23.5 5.65 18.35.5 12 .5z"/>          </svg>          <span>Steal our code (legally)</span>          <svg class="hero-source-arrow" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 17L17 7M8 7h9v9"/></svg>        </a>      </div>       <div class="hero-preview">        <figure class="hero-screenshot-frame">          <img            src="/updated-screenshot.webp"            alt="T3 Code app showing multiple coding agent threads in one workspace"            width="2508"            height="1682"            loading="eager"            decoding="async"          />        </figure>      </div>    </div>  </section>   <!-- ── Endorsements ─────────────────────────────────────────── -->  <section id="endorsements" class="sec-endorsements" aria-labelledby="endorsements-title">    <div class="container">      <div class="endorsements-head">        <h2 id="endorsements-title">Tolerated by over <span class="endorsements-count">{MARKETING_STATS.users}</span> devs</h2>        <p>Some of them even tweeted about it.</p>      </div>    </div>     <div class="endorsement-carousel endorsement-carousel--desktop" aria-label="Developer endorsements">        {          desktopEndorsementRows.map((row, rowIndex) => (            <div class:list={["endorsement-row", rowIndex === 1 && "is-reverse"]}>              <div class="endorsement-track">                {[0, 1].map((groupIndex) => (                  <div class="endorsement-track-group" aria-hidden={groupIndex === 1 ? "true" : undefined}>                    {row.map((tweet) => (                      <a                        class="endorsement-card"                        href={tweet.link}                        target="_blank"                        rel="noopener noreferrer"                        aria-label={`Read ${tweet.handle}'s post on X`}                        tabindex={groupIndex === 1 ? "-1" : undefined}                      >                        <div class="endorsement-author">                          <img                            src={`/pfps/${tweet.handle}.webp`}                            alt=""                            width="28"                            height="28"                            loading="lazy"                            decoding="async"                          />                          <div class="endorsement-handle">@{tweet.handle}</div>                        </div>                        <p>{tweet.excerpt ?? tweet.content}</p>                      </a>                    ))}                  </div>                ))}              </div>            </div>          ))        }    </div>     <div class="endorsement-carousel endorsement-carousel--mobile" aria-label="Developer endorsements">        {          mobileEndorsementRows.map((row, rowIndex) => (            <div class:list={["endorsement-row", rowIndex === 1 && "is-reverse"]}>              <div class="endorsement-track">                {[0, 1].map((groupIndex) => (                  <div class="endorsement-track-group" aria-hidden={groupIndex === 1 ? "true" : undefined}>                    {row.map((tweet) => (                      <a                        class="endorsement-card"                        href={tweet.link}                        target="_blank"                        rel="noopener noreferrer"                        aria-label={`Read ${tweet.handle}'s post on X`}                        tabindex={groupIndex === 1 ? "-1" : undefined}                      >                        <div class="endorsement-author">                          <img                            src={`/pfps/${tweet.handle}.webp`}                            alt=""                            width="28"                            height="28"                            loading="lazy"                            decoding="async"                          />                          <div class="endorsement-handle">@{tweet.handle}</div>                        </div>                        <p>{tweet.excerpt ?? tweet.content}</p>                      </a>                    ))}                  </div>                ))}              </div>            </div>          ))        }    </div>  </section>   <!-- ── Harnesses ─────────────────────────────────────────────── -->  <section id="harnesses" class="sec-harness">    <div class="container">      <div class="section-head">        <h2>Bring your own sub</h2>        <p>          T3 Code doesn't resell tokens. Plug in Claude Code, Codex, OpenCode,          or Cursor with the credentials you already have — we orchestrate          them, you keep your plan.        </p>      </div>       <div class="harness-grid">        <div class="harness">          <div class="harness-mark"><img src="/harnesses/claude-ai-icon.svg" alt="" /></div>          <div class="harness-meta">            <div class="harness-name">Claude Code</div>            <div class="harness-tag">claude auth login</div>          </div>        </div>        <div class="harness">          <div class="harness-mark"><img src="/harnesses/openai_dark.svg" alt="" /></div>          <div class="harness-meta">            <div class="harness-name">Codex CLI</div>            <div class="harness-tag">codex login</div>          </div>        </div>        <div class="harness">          <div class="harness-mark"><img src="/harnesses/opencode-dark.svg" alt="" /></div>          <div class="harness-meta">            <div class="harness-name">OpenCode</div>            <div class="harness-tag">opencode auth</div>          </div>        </div>        <div class="harness">          <div class="harness-mark"><img src="/harnesses/cursor_light.svg" alt="" /></div>          <div class="harness-meta">            <div class="harness-name">Cursor</div>            <div class="harness-tag">cursor-agent</div>          </div>        </div>      </div>       <div class="harness-footer">        <div class="harness-footer-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12l5 5L20 6"/></svg> No keys resold. No quota caps.</div>        <div class="harness-footer-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12l5 5L20 6"/></svg> Switch models mid-thread.</div>        <div class="harness-footer-item"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12l5 5L20 6"/></svg> More harnesses shipping weekly.</div>      </div>    </div>  </section>   <!-- ── Git ──────────────────────────────────────────────────── -->  <section id="git" class="sec-git">    <div class="container git-inner">      <div class="git-visual">        <div class="pr-card tile">          <div class="pr-head">            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="6" cy="6" r="2.2"/><circle cx="6" cy="18" r="2.2"/><circle cx="18" cy="6" r="2.2"/><path d="M6 8v8M18 8v5a3 3 0 01-3 3h-3M13 13l-2 3 2 3"/></svg>            <span class="pr-title">Add marketing hero animation</span>            <span class="pr-status">Ready</span>          </div>          <div class="pr-meta">            <span><svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><circle cx="6" cy="6" r="2.2"/><circle cx="6" cy="18" r="2.2"/><circle cx="18" cy="6" r="2.2"/><path d="M6 8v8M6 12a6 6 0 006-6h6"/></svg> feat/marketing-hero → main</span>            <span>+142 −38</span>            <span>3 commits</span>          </div>          <div class="pr-files">            <div><code>apps/marketing/src/pages/index.astro</code> <span>+14 −2</span></div>            <div><code>apps/marketing/src/layouts/Layout.astro</code> <span>+8 −0</span></div>            <div><code>apps/marketing/public/hero.css</code> <span>+120 −36</span></div>          </div>          <div class="pr-foot">            <button class="btn btn-ghost" style="font-size:12px;padding:6px 10px">View diff</button>            <button class="btn btn-primary" style="font-size:12px;padding:6px 12px">              <svg width="12" height="12" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 .5C5.65.5.5 5.65.5 12a11.5 11.5 0 007.86 10.93c.58.1.79-.25.79-.56v-2c-3.2.69-3.88-1.37-3.88-1.37-.52-1.33-1.27-1.69-1.27-1.69-1.04-.71.08-.7.08-.7 1.15.08 1.76 1.18 1.76 1.18 1.02 1.76 2.68 1.25 3.33.96.1-.75.4-1.25.72-1.54-2.55-.29-5.24-1.27-5.24-5.67 0-1.25.45-2.28 1.18-3.08-.12-.29-.51-1.45.11-3.02 0 0 .96-.31 3.15 1.18a10.96 10.96 0 015.74 0c2.19-1.49 3.15-1.18 3.15-1.18.62 1.57.23 2.73.11 3.02.74.8 1.18 1.83 1.18 3.08 0 4.41-2.7 5.38-5.27 5.66.41.36.78 1.06.78 2.13v3.16c0 .31.21.67.8.56A11.5 11.5 0 0023.5 12C23.5 5.65 18.35.5 12 .5z"/></svg>              Open pull request            </button>          </div>        </div>        <div class="pr-trail">          <div class="pr-trail-dot"></div>          <div class="pr-trail-line"></div>          <div class="pr-trail-dot"></div>        </div>        <div class="pr-button-shell">          <button class="pr-button">            <svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"><circle cx="6" cy="6" r="2.2"/><circle cx="6" cy="18" r="2.2"/><circle cx="18" cy="6" r="2.2"/><path d="M6 8v8M18 8v5a3 3 0 01-3 3h-3M13 13l-2 3 2 3"/></svg>            Commit &amp; push            <span class="pr-button-kbd">⌘⏎</span>          </button>        </div>      </div>       <div class="git-copy">        <div class="section-head" style="margin-bottom:0">          <h2>One button to commit, push, and make a PR.</h2>          <p>            Every agent thread writes to its own branch. When it's good, one            button opens the PR on GitHub with a generated title, body and            changelog. No terminal dance required.          </p>          <ul class="checklist" style="margin-top:24px">            <li><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12l5 5L20 6"/></svg> Auto-generated PR titles &amp; bodies</li>            <li><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12l5 5L20 6"/></svg> Inline diff review before you push</li>            <li><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12l5 5L20 6"/></svg> Draft PRs, stack PRs, amend PRs</li>            <li><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M4 12l5 5L20 6"/></svg> Works with your existing GitHub auth</li>          </ul>        </div>      </div>    </div>  </section>   <!-- ── Open source ───────────────────────────────────────────── -->  <section id="open" class="sec-open">    <div class="container">      <div class="section-head open-head">        <div class="eyebrow">Open source</div>        <h2>If you don't like something, fork it.</h2>      </div>       <div class="open-grid">        <div class="tile open-term">          <div class="open-term-head">            <span></span><span></span><span></span>            <span class="open-term-title">~/code</span>          </div>          <div class="open-term-body">            <div><span class="prompt">$</span> gh repo fork pingdotgg/t3code --clone</div>            <div class="dim">✓ Cloned t3code into ./t3code</div>            <div><span class="prompt">$</span> cd t3code &amp;&amp; vp install</div>            <div class="dim">✓ 1 284 packages installed in 4.2s</div>            <div><span class="prompt">$</span> vp run dev</div>            <div class="dim">▲ T3 Code dev server → <span class="accent">http://localhost:4001</span></div>            <div class="cursor"><span class="prompt">$</span><span class="caret"></span></div>          </div>        </div>         <div class="tile open-pitch">          <div class="open-pitch-copy">            <ul class="open-pitch-list">              <li>                <span class="open-pitch-mark" aria-hidden="true"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg></span>                <span><strong>Change the UI.</strong> Restyle every surface to match your taste.</span>              </li>              <li>                <span class="open-pitch-mark" aria-hidden="true"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg></span>                <span><strong>Add an agent.</strong> Wire in your own tools, models, and flows.</span>              </li>              <li>                <span class="open-pitch-mark" aria-hidden="true"><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg></span>                <span><strong>Ship your own build.</strong> Self-host it or distribute it as your own.</span>              </li>            </ul>          </div>           <div class="open-pitch-footer">            <div class="open-pitch-meta">              <span>MIT licensed</span>              <span aria-hidden="true">·</span>              <span>{MARKETING_STATS.githubStars} stars</span>            </div>             <div class="open-pitch-actions">              <a class="btn btn-primary" href="https://github.com/pingdotgg/t3code/fork" target="_blank" rel="noopener noreferrer">                <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="6" cy="5" r="2.2"/><circle cx="18" cy="5" r="2.2"/><circle cx="12" cy="19" r="2.2"/><path d="M6 7.2v2A3 3 0 009 12.2h6A3 3 0 0018 9.2v-2M12 14v2.8"/></svg>                Fork on GitHub              </a>              <a class="open-source-link" href={GITHUB_REPOSITORY_URL} target="_blank" rel="noopener noreferrer">                Browse source                <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M7 17L17 7M8 7h9v9"/></svg>              </a>            </div>          </div>        </div>      </div>    </div>  </section>   <!-- ── Final CTA ─────────────────────────────────────────────── -->  <section id="download" class="sec-cta">    <div class="container cta-inner">      <h2 class="display cta-title">        Your agents deserve better than a terminal.      </h2>      <p class="cta-sub">        T3 Code is free, open source and fast. Install it, plug in the harness        you already pay for, and let your agents get to work.      </p>      <div class="cta-actions">        <a id="cta-download-btn" class="btn btn-primary btn-lg" href="https://github.com/pingdotgg/t3code/releases">          <svg class="dl-icon dl-icon--apple" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 814 1000" aria-hidden="true"><path fill="currentColor" d="M788.1 340.9c-5.8 4.5-108.2 62.2-108.2 190.5 0 148.4 130.3 200.9 134.2 202.2-.6 3.2-20.7 71.9-68.7 141.9-42.8 61.6-87.5 123.1-155.5 123.1s-85.5-39.5-164-39.5c-76.5 0-103.7 40.8-165.9 40.8s-105.6-57-155.5-127C46.7 790.7 0 663 0 541.8c0-194.4 126.4-297.5 250.8-297.5 66.1 0 121.2 43.4 162.7 43.4 39.5 0 101.1-46 176.3-46 28.5 0 130.9 2.6 198.3 99.2zm-234-181.5c31.1-36.9 53.1-88.1 53.1-139.3 0-7.1-.6-14.3-1.9-20.1-50.6 1.9-110.8 33.7-147.1 75.8-28.5 32.4-55.1 83.6-55.1 135.5 0 7.8 1.3 15.6 1.9 18.1 3.2.6 8.4 1.3 13.6 1.3 45.4 0 102.5-30.4 135.5-71.3z"/></svg>          <svg class="dl-icon dl-icon--windows" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 88 88" aria-hidden="true"><path fill="currentColor" d="m0 12.402 35.687-4.86.016 34.423-35.67.203zm35.67 33.529.028 34.453L.028 75.48.026 45.7zm4.326-39.025L87.314 0v41.527l-47.318.376zm47.329 39.349-.011 41.34-47.318-6.678-.066-34.739z"/></svg>          <svg class="dl-icon dl-icon--linux" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M12.504 0c-.155 0-.315.008-.48.021-4.226.333-3.105 4.807-3.17 6.298-.076 1.092-.3 1.953-1.05 3.02-.885 1.051-2.127 2.75-2.716 4.521-.278.832-.41 1.684-.287 2.489a.424.424 0 00-.11.135c-.26.268-.45.6-.663.839-.199.199-.485.267-.797.4-.313.136-.658.269-.864.68-.09.189-.136.394-.132.602 0 .199.027.4.055.536.058.399.116.728.04.97-.249.68-.28 1.145-.106 1.484.174.334.535.47.94.601.81.2 1.91.135 2.774.6.926.466 1.866.67 2.616.47.526-.116.97-.464 1.208-.946.587-.003 1.23-.269 2.26-.334.699-.058 1.574.267 2.577.2.025.134.063.198.114.333l.003.003c.391.778 1.113 1.132 1.884 1.071.771-.06 1.592-.536 2.257-1.306.631-.765 1.683-1.084 2.378-1.503.348-.199.629-.469.649-.853.023-.4-.2-.811-.714-1.376v-.097l-.003-.003c-.17-.2-.25-.535-.338-.926-.085-.401-.182-.786-.492-1.046h-.003c-.059-.054-.123-.067-.188-.135a.357.357 0 00-.19-.064c.431-1.278.264-2.55-.173-3.694-.533-1.41-1.465-2.638-2.175-3.483-.796-1.005-1.576-1.957-1.56-3.368.026-2.152.236-6.133-3.544-6.139zm.529 3.405h.013c.213 0 .396.062.584.198.19.135.33.332.438.533.105.259.158.459.166.724 0-.02.006-.04.006-.06v.105a.086.086 0 01-.004-.021l-.004-.024a1.807 1.807 0 01-.15.706.953.953 0 01-.213.335.71.71 0 00-.088-.042c-.104-.045-.198-.064-.284-.133a1.312 1.312 0 00-.22-.066c.05-.06.146-.133.183-.198.053-.128.082-.264.088-.402v-.02a1.21 1.21 0 00-.061-.4c-.045-.134-.101-.2-.183-.333-.084-.066-.167-.132-.267-.132h-.016c-.093 0-.176.03-.262.132a.8.8 0 00-.205.334 1.18 1.18 0 00-.09.4v.019c.002.089.008.179.02.267-.193-.067-.438-.135-.607-.202a1.635 1.635 0 01-.018-.2v-.02a1.772 1.772 0 01.15-.768c.082-.22.232-.406.43-.533a.985.985 0 01.594-.2zm-2.962.059h.036c.142 0 .27.048.399.135.146.129.264.288.344.465.09.199.14.4.153.667v.004c.007.134.006.2-.002.266v.08c-.03.007-.056.018-.083.024-.152.055-.274.135-.393.2.012-.09.013-.18.003-.267v-.015c-.012-.133-.04-.2-.082-.333a.613.613 0 00-.166-.267.248.248 0 00-.183-.064h-.021c-.071.006-.13.04-.186.132a.552.552 0 00-.12.27.944.944 0 00-.023.33v.015c.012.135.037.2.08.334.046.134.098.2.166.268.01.009.02.018.034.024-.07.057-.117.07-.176.136a.304.304 0 01-.131.068 2.62 2.62 0 01-.275-.402 1.772 1.772 0 01-.155-.667 1.759 1.759 0 01.08-.668 1.43 1.43 0 01.283-.535c.128-.133.26-.2.418-.2zm1.37 1.706c.332 0 .733.065 1.216.399.293.2.523.269 1.052.468h.003c.255.136.405.266.478.399v-.131a.571.571 0 01.016.47c-.123.31-.516.643-1.063.842v.002c-.268.135-.501.333-.775.465-.276.135-.588.292-1.012.267a1.139 1.139 0 01-.448-.067 3.566 3.566 0 01-.322-.198c-.195-.135-.363-.332-.612-.465v-.005h-.005c-.4-.246-.616-.512-.686-.71-.07-.268-.005-.47.193-.6.224-.135.38-.271.483-.336.104-.074.143-.102.176-.131h.002v-.003c.169-.202.436-.47.839-.601.139-.036.294-.065.466-.065zm2.8 2.142c.358 1.417 1.196 3.475 1.735 4.473.286.534.855 1.659 1.102 3.024.156-.005.33.018.513.064.646-1.671-.546-3.467-1.089-3.966-.22-.2-.232-.335-.123-.335.59.534 1.365 1.572 1.646 2.757.13.535.16 1.104.021 1.67.067.028.135.06.205.067 1.032.534 1.413.938 1.23 1.537v-.043c-.06-.003-.12 0-.18 0h-.016c.151-.467-.182-.825-1.065-1.224-.915-.4-1.646-.336-1.77.465-.008.043-.013.066-.018.135-.068.023-.139.053-.209.064-.43.268-.662.669-.793 1.187-.13.533-.17 1.156-.205 1.869v.003c-.02.334-.17.838-.319 1.35-1.5 1.072-3.58 1.538-5.348.334a2.645 2.645 0 00-.402-.533 1.45 1.45 0 00-.275-.333c.182 0 .338-.03.465-.067a.615.615 0 00.314-.334c.108-.267 0-.697-.345-1.163-.345-.467-.931-.995-1.788-1.521-.63-.4-.986-.87-1.15-1.396-.165-.534-.143-1.085-.015-1.645.245-1.07.873-2.11 1.274-2.763.107-.065.037.135-.408.974-.396.751-1.14 2.497-.122 3.854a8.123 8.123 0 01.647-2.876c.564-1.278 1.743-3.504 1.836-5.268.048.036.217.135.289.202.218.133.38.333.59.465.21.201.477.335.876.335.039.003.075.006.11.006.412 0 .73-.134.997-.268.29-.134.52-.334.74-.4h.005c.467-.135.835-.402 1.044-.7zm2.185 8.958c.037.6.343 1.245.882 1.377.588.134 1.434-.333 1.791-.765l.211-.01c.315-.007.577.01.847.268l.003.003c.208.199.305.53.391.876.085.4.154.78.409 1.066.486.527.645.906.636 1.14l.003-.007v.018l-.003-.012c-.015.262-.185.396-.498.595-.63.401-1.746.712-2.457 1.57-.618.737-1.37 1.14-2.036 1.191-.664.053-1.237-.2-1.574-.898l-.005-.003c-.21-.4-.12-1.025.056-1.69.176-.668.428-1.344.463-1.897.037-.714.076-1.335.195-1.814.12-.465.308-.797.641-.984l.045-.022zm-10.814.049h.01c.053 0 .105.005.157.014.376.055.706.333 1.023.752l.91 1.664.003.003c.243.533.754 1.064 1.189 1.637.434.598.77 1.131.729 1.57v.006c-.057.744-.48 1.148-1.125 1.294-.645.135-1.52.002-2.395-.464-.968-.536-2.118-.469-2.857-.602-.369-.066-.61-.2-.723-.4-.11-.2-.113-.602.123-1.23v-.004l.002-.003c.117-.334.03-.752-.027-1.118-.055-.401-.083-.71.043-.94.16-.334.396-.4.69-.533.294-.135.64-.202.915-.47h.002v-.002c.256-.268.445-.601.668-.838.19-.201.38-.336.663-.336zm7.159-9.074c-.435.201-.945.535-1.488.535-.542 0-.97-.267-1.28-.466-.154-.134-.28-.268-.373-.335-.164-.134-.144-.333-.074-.333.109.016.129.134.199.2.096.066.215.2.36.333.292.2.68.467 1.167.467.485 0 1.053-.267 1.398-.466.195-.135.445-.334.648-.467.156-.136.149-.267.279-.267.128.016.034.134-.147.332a8.097 8.097 0 01-.69.468zm-1.082-1.583V5.64c-.006-.02.013-.042.029-.05.074-.043.18-.027.26.004.063 0 .16.067.15.135-.006.049-.085.066-.135.066-.055 0-.092-.043-.141-.068-.052-.018-.146-.008-.163-.065zm-.551 0c-.02.058-.113.049-.166.066-.047.025-.086.068-.14.068-.05 0-.13-.02-.136-.068-.01-.066.088-.133.15-.133.08-.031.184-.047.259-.005.019.009.036.03.03.05v.02h.003z"/></svg>           <span id="cta-download-label">Download for macOS</span>        </a>        <a class="btn btn-ghost btn-lg" href="/download">Windows · Linux · other</a>      </div>    </div>  </section></Layout> <script>  import { fetchLatestRelease, RELEASES_URL, type ReleaseAsset } from "../lib/releases";   type Platform = { os: "mac" | "win" | "linux"; label: string; arch?: string };   function detectPlatform(): Platform | null {    const ua = navigator.userAgent;    if (/Win/i.test(ua)) return { os: "win", label: "Download for Windows" };    if (/Mac/i.test(ua)) {      return { os: "mac", label: "Download for macOS", arch: "arm64" };    }    if (/Linux/i.test(ua)) return { os: "linux", label: "Download for Linux" };    return null;  }   function pickAsset(assets: ReleaseAsset[], platform: Platform): string | null {    if (platform.os === "win") {      return assets.find((a) => a.name.endsWith("-x64.exe"))?.browser_download_url ?? null;    }    if (platform.os === "mac") {      const preferred = assets.find((a) => a.name.endsWith(`-${platform.arch}.dmg`));      const fallback = assets.find((a) => a.name.endsWith(".dmg"));      return (preferred ?? fallback)?.browser_download_url ?? null;    }    if (platform.os === "linux") {      return assets.find((a) => a.name.endsWith(".AppImage"))?.browser_download_url ?? null;    }    return null;  }   async function init() {    const btn = document.getElementById("download-btn") as HTMLAnchorElement | null;    const label = document.getElementById("download-label");    const ctaBtn = document.getElementById("cta-download-btn") as HTMLAnchorElement | null;    const ctaLabel = document.getElementById("cta-download-label");     const platform = detectPlatform();    if (!platform) return;    document.documentElement.dataset.platform = platform.os;    if (label) label.textContent = platform.label;    if (ctaLabel) ctaLabel.textContent = platform.label;     try {      const release = await fetchLatestRelease();      const url = pickAsset(release.assets ?? [], platform);      if (url) {        if (btn) {          btn.href = url;          btn.removeAttribute("target");          btn.removeAttribute("rel");        }        if (ctaBtn) {          ctaBtn.href = url;          ctaBtn.removeAttribute("target");          ctaBtn.removeAttribute("rel");        }      }    } catch {      if (btn) btn.href = RELEASES_URL;      if (ctaBtn) ctaBtn.href = RELEASES_URL;    }  }   init();</script> <style>  /* ── Section base ─────────────────────────────────────────── */  section {    position: relative;    padding: 96px 0;    border-top: 1px solid var(--border);  }   .section-head {    margin-bottom: 56px;    max-width: 720px;  }   .section-head .eyebrow {    margin-bottom: 14px;    display: block;  }   .section-head h2 {    font-size: clamp(32px, 4vw, 48px);    font-weight: 500;    letter-spacing: -0.035em;    line-height: 1.05;    margin-bottom: 18px;  }   .section-head p {    color: var(--fg-muted);    font-size: 18px;    max-width: 620px;    letter-spacing: -0.005em;  }   .checklist {    list-style: none;    display: flex;    flex-direction: column;    gap: 12px;  }   .checklist li {    display: flex;    align-items: center;    gap: 10px;    color: var(--fg-muted);    font-size: 15px;  }   .checklist li svg {    color: var(--ok);    flex-shrink: 0;  }   /* ── Hero ─────────────────────────────────────────────────── */  .hero {    padding: 72px 0 60px;    position: relative;    overflow: hidden;    border-top: 0;  }   .hero-grid {    position: absolute;    inset: 0;

Lines 1–500 of 1243.