{prefix && {prefix}}
{children}
{caret && }
);
}
// A whole terminal window with MOTD header describing the agent.
function Terminal({ motd, agentColor, lines, style, width, height, startAt = 0 }) {
return (
{motd?.host}
{motd.name}
{motd.sub}
{motd.ip} · {motd.gpu} · QVAC runtime · PLUR memory
{lines.map((ln, i) => (
;
}
// Video-inset picture-in-picture — shows real recording alongside mock terminals.
// Controlled by parent (we forward currentTime) so it stays in sync with the scrubber.
function VideoInset({ src, x, y, w, h, startSec = 0, muted = true, label = 'ORIGINAL RECORDING', color, parentLocalTime, sceneStart, watchUrl }) {
const ref = React.useRef(null);
const [hover, setHover] = React.useState(false);
const [ready, setReady] = React.useState(false);
// Seek + arm on metadata load — if the video isn't fully loaded yet, the
// initial `currentTime = startSec` jump is ignored and we get a black frame.
React.useEffect(() => {
const v = ref.current;
if (!v) return;
const onReady = () => {
setReady(true);
const target = startSec + Math.max(0, parentLocalTime);
try { v.currentTime = Math.min(target, (v.duration || 1e6) - 0.1); } catch {}
v.play && v.play().catch(() => {});
};
if (v.readyState >= 1) onReady();
v.addEventListener('loadedmetadata', onReady);
v.addEventListener('canplay', onReady);
return () => {
v.removeEventListener('loadedmetadata', onReady);
v.removeEventListener('canplay', onReady);
};
}, []);
// Keep video in sync with the stage scrubber.
React.useEffect(() => {
const v = ref.current;
if (!v || !ready) return;
const target = startSec + Math.max(0, parentLocalTime);
// Only correct if drift > 0.25s; otherwise let it play naturally.
if (Math.abs((v.currentTime || 0) - target) > 0.25) {
try { v.currentTime = target; } catch {}
}
v.play && v.play().catch(() => {});
}, [parentLocalTime, startSec, ready]);
const content = (
watchUrl && setHover(true)}
onMouseLeave={() => setHover(false)}
>
{/* REC chip */}
);
if (watchUrl) {
return (
{content}
);
}
return content;
}
function formatTc(sec) {
const m = Math.floor(sec / 60);
const s = Math.floor(sec % 60);
return `${String(m).padStart(2,'0')}:${String(s).padStart(2,'0')}`;
}
// Small brand lockup used on intro/outro.
function BrandLockup({ tech, color, size = 13 }) {
return (
REC · {label}
{/* Timecode */}
{formatTc(startSec + Math.max(0, parentLocalTime))}
{/* Watch-on-Loom affordance */}
{watchUrl && (
▶ Watch full · Loom ↗
)}
{tech.map((t, i) => (
{t}
{i < tech.length - 1 && /}
))}
);
}
// ─── Scene 1: Intro ─────────────────────────────────────────────────────────
function IntroScene({ start, end, config }) {
return (
{/* Grid */}
{/* Two agent glows */}
plur.ai ↗
LIVE ON SEPOLIA
);
}}
Sovereign minds.
Sovereign rails.
Sovereign rails.
{(config.introSubtitle || '').split('\n').map((line, i) => (
{i > 0 &&
} {line}
))}
} {line}
Two agents. Two machines.
Both running 32B models locally.
Both running 32B models locally.
Different owner. Different session. No shared memory.
ENGRAM
A unit of learned memory.{' '}
Portable. Installable. Tradeable.
{ip} · {gpu}
{name}
{role}
"{quote}"
{trait}
{/* Chapter marker band — top */}
) : null
))}
{videoSrc && (() => {
// Sit the video inset over the IDLE terminal (opposite of activeSide)
// so it never occludes the agent currently typing.
// activeSide='right' (Quark typing) → inset goes LEFT (over Data's idle)
// activeSide='left' (Data typing) → inset goes RIGHT (over Quark's idle)
const insetW = 480, insetH = 270;
const insetY = 1080 - insetH - 170;
const insetX = activeSide === 'right'
? 70 // left
: 1920 - insetW - 70; // right (default)
return (
)}
);
}}
BEAT {step}
{title}
{subtitle}
{/* Two terminals */}
Verify on-chain ↗
{evidence.map((e, i) => (
{e.label}
))}
);
}
function VerifyBar({ evidence, config, showAt = 3 }) {
const { localTime } = useSprite();
const o = clamp((localTime - showAt) / 0.5, 0, 1);
if (o <= 0) return null;
return (
Verify ↗
{evidence.map((e, i) => (
{e.label}
))}
);
}
function CalloutBox({ showAt, hideAt, x, y, w = 420, label, note, side = 'right', color, parentLocalTime, config }) {
const local = parentLocalTime - showAt;
const total = (hideAt ?? (showAt + 2.5)) - showAt;
const entryDur = 0.35;
const exitDur = 0.3;
const exitStart = total - exitDur;
let o = 1, dx = 0;
if (local < entryDur) {
const t = Easing.easeOutBack(clamp(local / entryDur, 0, 1));
o = clamp(local / entryDur, 0, 1);
dx = (1 - t) * (side === 'right' ? -16 : 16);
} else if (local > exitStart) {
const t = clamp((local - exitStart) / exitDur, 0, 1);
o = 1 - t;
dx = t * (side === 'right' ? 12 : -12);
}
if (local < 0 || local > total) return null;
const c = color || config.gold;
return (
{label}
{note}
{/* Scan lines */}
Commit · reveal · anti-frontrun
{/* Progress bar */}
);
}}
{Array.from({ length: 14 }).map((_, i) => {
const offset = (localTime * 260 + i * 140) % 1800;
return (
);
})}
Skipping the
blockchain wait
blockchain wait
DataEscrow runs a commit → reveal handshake over {skippedLabel},
so no one can frontrun the key. The agents just wait — you don't have to.
so no one can frontrun the key. The agents just wait — you don't have to.
{skippedLabel} real · compressed to {Math.round(duration * 10)/10}s
{/* Transfer arc visualization */}
✓ No cloud APIs
✓ No middleman
✓ On-chain settlement
✓ Encrypted transport
);
}}
Knowledge,
transferred.
transferred.
Six months of training. Six seconds of transfer.
{/* Top mark */}
What you just watched
{/* Big recap sentence — the learning network thesis */}
{/* Compact protocol strip — horizontal, one line each */}
{/* Works-with row */}
{/* Bottom links — pinned to bottom of 1080 canvas */}
proof of concept · {new Date().getFullYear()}
);
}}
Agents can learn from each other.
Your knowledge has value.
Your knowledge has value.
A learning network. No gatekeeper. No middleman. Settle in{' '}
USDT, not goodwill.
{stack.map((s, i) => (
{s.label}
{s.sub}
by {s.by}
))}
Works with
{['OpenClaw', 'Hermes Agent', 'Claude Code'].map((name) => (
{name}
))}
Open source · no lock-in