Files
whetstone_RSA/presentations/visual_rsa_pipeline.html

101 lines
4.8 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>RSA Pipeline</title>
<style>
* { box-sizing: border-box; margin: 0; padding: 0; }
body { background: #0f1117; font-family: 'Segoe UI', system-ui, sans-serif; display: flex; align-items: center; justify-content: center; min-height: 100vh; }
.slide { width: 960px; padding: 60px 80px; }
h2 { color: #e2e8f0; font-size: 1.5rem; font-weight: 400; letter-spacing: 0.05em; text-transform: uppercase; margin-bottom: 56px; text-align: center; }
.pipeline { display: flex; align-items: center; gap: 0; }
.box { flex: 1; border-radius: 10px; padding: 28px 18px; text-align: center; }
.box.fuzzy { background: #1e2433; border: 1.5px solid #4a5568; }
.box.gate { background: #1a2744; border: 1.5px solid #3b82f6; }
.box.contract { background: #12293a; border: 1.5px solid #06b6d4; }
.box.det { background: #12291e; border: 1.5px solid #22c55e; }
.box-label { font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 10px; font-weight: 600; }
.fuzzy .box-label { color: #9ca3af; }
.gate .box-label { color: #60a5fa; }
.contract .box-label { color: #22d3ee; }
.det .box-label { color: #4ade80; }
.box-main { font-size: 1.05rem; color: #e2e8f0; font-weight: 500; line-height: 1.4; min-height: 48px; display: flex; align-items: center; justify-content: center; }
.box-sub { font-size: 0.78rem; color: #6b7280; margin-top: 10px; line-height: 1.5; }
.arrow { flex: 0 0 40px; display: flex; align-items: center; justify-content: center; }
.arrow svg { display: block; }
.examples { margin-top: 52px; display: flex; gap: 24px; }
.ex { flex: 1; background: #161b27; border-radius: 8px; padding: 20px 22px; }
.ex-label { font-size: 0.65rem; letter-spacing: 0.1em; text-transform: uppercase; color: #6b7280; margin-bottom: 10px; }
.ex-text { font-size: 0.88rem; color: #94a3b8; line-height: 1.6; font-family: 'Courier New', monospace; }
.ex-text .hl { color: #22d3ee; }
</style>
</head>
<body>
<div class="slide">
<h2>The RSA Pattern</h2>
<div class="pipeline">
<div class="box fuzzy">
<div class="box-label">Input</div>
<div class="box-main">Fuzzy natural language</div>
<div class="box-sub">Varied phrasing<br>Partial information<br>Ambiguous intent</div>
</div>
<div class="arrow">
<svg width="40" height="24"><path d="M4 12 L30 12 M22 5 L30 12 L22 19" stroke="#4a5568" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg>
</div>
<div class="box gate">
<div class="box-label">RSA Gate</div>
<div class="box-main">Tiny transformer specialist</div>
<div class="box-sub">Bounded output space<br>Confidence + abstain<br>~213K params / ~800KB</div>
</div>
<div class="arrow">
<svg width="40" height="24"><path d="M4 12 L30 12 M22 5 L30 12 L22 19" stroke="#4a5568" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg>
</div>
<div class="box contract">
<div class="box-label">Contract</div>
<div class="box-main">Typed structured decision</div>
<div class="box-sub">action + slots<br>confidence score<br>escalation flag</div>
</div>
<div class="arrow">
<svg width="40" height="24"><path d="M4 12 L30 12 M22 5 L30 12 L22 19" stroke="#4a5568" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg>
</div>
<div class="box det">
<div class="box-label">Execution</div>
<div class="box-main">Deterministic software</div>
<div class="box-sub">No model past this point<br>Ordinary code<br>Auditable + fast</div>
</div>
</div>
<div class="examples">
<div class="ex">
<div class="ex-label">Example — developer tools</div>
<div class="ex-text">
"show me the failed builds from yesterday"<br><br>
<span class="hl">action:</span> search_builds<br>
<span class="hl">status:</span> failed<br>
<span class="hl">date:</span> yesterday<br>
<span class="hl">confidence:</span> 0.93
</div>
</div>
<div class="ex">
<div class="ex-label">Example — whetstone_DSL gate</div>
<div class="ex-text">
taskitem: "Integrate auth middleware into API layer"<br><br>
<span class="hl">needs_architect_review:</span> true<br>
<span class="hl">needs_resolve_deps:</span> true<br>
<span class="hl">confidence:</span> 0.87
</div>
</div>
<div class="ex">
<div class="ex-label">The design rule</div>
<div class="ex-text">
Learned behavior lives only<br>
where deterministic tooling<br>
is not yet enough.<br><br>
Everything after a bounded decision<br>
is ordinary software.
</div>
</div>
</div>
</div>
</body>
</html>