All source files · Workbench
src/pages/index.astro
---
import { getSampleData } from '../lib/sanity';
import '../styles/global.css';
// Static builds require no network or credentials. The browser resolves live content.
const data = getSampleData();
const initialData = JSON.stringify(data).replace(/</g, '\\u003c');
const projectId = import.meta.env.PUBLIC_SANITY_PROJECT_ID || '';
const dataset = import.meta.env.PUBLIC_SANITY_DATASET || 'production';
---
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<meta name="theme-color" content="#142b25" />
<title>Deadline Loom — a schedule with a memory</title>
<meta name="description" content="Weave a plan from sourced deadlines. See what changes when a source changes, then keep the reason for your decision." />
</head>
<body data-project={projectId} data-dataset={dataset}>
<div class="shell">
<header class="masthead">
<a class="wordmark" href="/" aria-label="Deadline Loom home"><span class="loom-mark" aria-hidden="true">↟</span> deadline loom</a>
<div class="header-meta"><span class="live-dot"></span><span id="connection">Loading content</span><span class="edition">EXPERIMENT 001 / OCTOBER 2026</span></div>
</header>
<main>
<section class="intro">
<div class="eyebrow">A SCHEDULE WITH A MEMORY</div>
<h1>Make room.<br /><em>Keep the proof.</em></h1>
<div class="intro-copy"><p>A date on a page is a claim. A plan is a decision.<br />Weave the two together, and see exactly which thread breaks when the date changes.</p><a href="#workbench" class="text-link">Open the workbench <span>↘</span></a></div>
<div class="orbit" aria-hidden="true"><div class="orbit-a"></div><div class="orbit-b"></div><span class="orbit-label">SOURCE → CLAIM → DECISION</span><span class="orbit-point one"></span><span class="orbit-point two"></span><span class="orbit-point three"></span></div>
</section>
<div class="mode-note" id="mode-note" role="status"></div>
<section id="workbench" class="workbench" aria-labelledby="workbench-title">
<div class="section-heading"><div><span class="eyebrow">01 / WEAVE A PLAN</span><h2 id="workbench-title">The workbench</h2></div><div class="toolbar"><button id="reset" class="quiet-button">Reset scenario</button><button id="export" class="solid-button">Export calendar <span>↗</span></button></div></div>
<div class="controls">
<label>Start from<input id="start-time" type="datetime-local" value="2026-10-02T13:00" /></label>
<label>Read every clock in<select id="timezone"><option value="America/Chicago">Chicago · CDT</option><option value="America/Los_Angeles">Los Angeles · PDT</option><option value="UTC">UTC</option><option value="Asia/Kolkata">Kolkata · IST</option></select></label>
<label class="capacity-control">Agent work per day <span><output id="capacity-value">12</output> hours</span><input id="capacity" type="range" min="4" max="24" step="1" value="12" /></label>
<div class="plan-stat"><span>PLAN FINISHES</span><strong id="finish-time">—</strong><small id="plan-health"></small></div>
</div>
<div class="planning-grid">
<div class="thread-list"><div class="column-heading"><span>THREADS</span><span>EST. WORK</span></div><div id="threads"></div><p class="tiny-note">Work estimates are editable planning assumptions. They are not promises of completion or prize odds.</p></div>
<div class="timeline-wrap"><div class="timeline-head"><span>EARLIEST DEADLINE FIRST</span><span class="legend"><i></i> Work <i class="deadline-key"></i> Deadline</span></div><div id="timeline"></div><div class="horizon-note">Drag your assumptions with the controls. The source dates stay intact.</div></div>
</div>
</section>
<section class="review" aria-labelledby="review-title">
<div class="section-heading"><div><span class="eyebrow">02 / PULL ONE THREAD</span><h2 id="review-title">What would change?</h2></div><span class="context-hint">A review is content, too.</span></div>
<div class="review-grid">
<div class="scenario-panel"><label>Explore a thread<select id="selected-thread"></select></label><p id="selected-summary"></p><div class="source-clock"><span>RECORDED DEADLINE</span><strong id="recorded-deadline"></strong><small id="recorded-source"></small></div><label>Schedule against this version<select id="source-version"></select></label><div class="prerequisites"><span class="eyebrow">PREREQUISITES TO CHECK</span><div id="prerequisites"></div></div><label class="scenario-toggle"><input id="counterfactual" type="checkbox" /><span>Rehearse an earlier deadline<small>Move the selected version forward 24 hours.</small></span></label><div class="scenario-outcome" id="scenario-outcome" aria-live="polite"></div><label>Why would you make this decision?<textarea id="decision-note" rows="3" placeholder="A short reason makes a decision reproducible."></textarea></label><div class="decision-buttons"><button id="approve" class="solid-button">Record decision <span>→</span></button><button id="clear-decision" class="quiet-button">Clear local record</button></div><p class="tiny-note" id="decision-status">Rehearsals stay in this browser. Published reviews are maintained in Sanity Studio.</p></div>
<div class="evidence-panel"><div class="evidence-title"><h3>The source trail</h3><span id="source-count"></span></div><div id="sources"></div><div class="review-history"><span class="eyebrow">DECISION MEMORY</span><div id="decision-history"></div></div></div>
</div>
</section>
<section class="how-it-works"><div><span class="eyebrow">03 / THE STRUCTURE MATTERS</span><h2>Less guesswork.<br />More traceable choices.</h2></div><ol><li><span>01</span><strong>Sources have versions.</strong><p>Each claim points to the page and evidence that support it. A conflicting date can coexist with the original.</p></li><li><span>02</span><strong>Assumptions stay separate.</strong><p>Build hours, daily capacity, and rehearsal changes belong to your plan. They never rewrite the evidence.</p></li><li><span>03</span><strong>Decisions have reasons.</strong><p>A review records the chosen interpretation, its status, and why. Future readers can follow the same thread.</p></li></ol></section>
</main>
<footer><span>DEADLINE LOOM / BUILT WITH ASTRO + SANITY</span><a href="/about">Build notes & data model ↗</a><span>Cash shown is unearned. A calendar entry is not a prize.</span></footer>
</div>
<div id="toast" class="toast" role="status" aria-live="polite"></div>
<script id="initial-data" type="application/json" set:html={initialData}></script>
<script>
import { initializeWorkbench } from '../scripts/workbench';
initializeWorkbench();
</script>
</body>
</html>