// The Researcher — main composition.
// Editorial "contact sheet" document: a Loom cover, the live instrument,
// the five states of the loop, three times of day, and multi-platform access.
// Tweaks drive theme, accent, density, type voice, and playback speed.
const { useState, useEffect } = React;
const TWEAK_DEFAULTS = {
theme: 'morning',
accent: 'punctuation',
density: 'comfortable',
typeVoice: 'serif',
speed: 'measured',
};
// scaled static window — fits a 1360×880 window into a smaller plate slot.
function StaticPlate({ theme, stage, density, scale = 0.46, label, caption, detail, onOpen }) {
const w = 1360, h = 880;
return (
{label}
{caption}
{detail && (
{detail}
)}
);
}
// fullscreen lightbox to inspect one state at full size
function Lightbox({ item, density, onClose }) {
useEffect(() => {
if (!item) return undefined;
const k = (e) => { if (e.key === 'Escape') onClose(); };
window.addEventListener('keydown', k);
return () => window.removeEventListener('keydown', k);
}, [item, onClose]);
if (!item) return null;
const [fit, setFit] = useState(1);
useEffect(() => {
const calc = () => setFit(Math.min((window.innerWidth - 120) / 1360, (window.innerHeight - 120) / 880, 1));
calc(); window.addEventListener('resize', calc);
return () => window.removeEventListener('resize', calc);
}, []);
return (
);
}
function PlatformSection({ sectionGap }) {
return (
{/* iOS — Praeceptor */}
iOS · Praeceptor
Briefs and plans — read in motion
{/* IDE — Claude Code in Cursor */}
IDE · Claude Code in Cursor
Engagement context available inline — as you write
{/* access note + CTA */}
The Researcher writes to the file system. Every surface reads the same files.
No sync layer. No cloud dependency. The operator's data stays on the operator's machine.
) : (
)}