Skip to content

Commit 29f4448

Browse files
NAOR YUVALNAOR YUVAL
NAOR YUVAL
authored and
NAOR YUVAL
committed
landing: full title (MPCP), tagline, vertical flow, dive-in link to reference flow
Made-with: Cursor
1 parent 64770b7 commit 29f4448

1 file changed

Lines changed: 58 additions & 17 deletions

File tree

‎index.html‎

Lines changed: 58 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@
33
<head>
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6-
<title>MPCP — Machine Payment Control Protocol</title>
7-
<meta name="description" content="A protocol for verifiable machine-to-service payments. Bounded authorization, deterministic verification, settlement-agnostic.">
6+
<title>Machine Payment Control Protocol (MPCP)</title>
7+
<meta name="description" content="The authorization layer for machine commerce. Verifiable machine-to-service payments. Bounded authorization, deterministic verification, settlement-agnostic.">
88
<link rel="preconnect" href="https://fonts.googleapis.com">
99
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
1010
<link href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
@@ -99,10 +99,17 @@
9999
font-weight: 700;
100100
letter-spacing: -0.03em;
101101
line-height: 1.2;
102-
margin-bottom: 1rem;
102+
margin-bottom: 0.5rem;
103+
}
104+
header .tagline {
105+
font-size: 1.25rem;
106+
font-weight: 500;
107+
color: var(--accent);
108+
margin-bottom: 0.75rem;
109+
letter-spacing: -0.01em;
103110
}
104-
header p {
105-
font-size: 1.2rem;
111+
header .subtitle {
112+
font-size: 1rem;
106113
color: var(--text-muted);
107114
line-height: 1.6;
108115
}
@@ -130,18 +137,42 @@
130137
}
131138
section p:last-child { margin-bottom: 0; }
132139

133-
.chain {
140+
.chain-flow {
134141
background: var(--surface);
135142
border: 1px solid var(--border);
136143
border-radius: 8px;
137-
padding: 1rem 1.25rem;
138-
font-size: 0.875rem;
139-
overflow-x: auto;
144+
padding: 1.5rem 2rem;
140145
margin: 1rem 0;
146+
text-align: center;
147+
}
148+
.chain-flow .step {
149+
font-size: 1rem;
150+
font-weight: 500;
151+
color: var(--text);
152+
}
153+
.chain-flow .arrow {
154+
color: var(--accent-dim);
155+
font-size: 1.25rem;
156+
margin: 0.25rem 0;
157+
line-height: 1;
158+
}
159+
.dive-in {
160+
display: inline-flex;
161+
align-items: center;
162+
gap: 0.5rem;
163+
margin-top: 1rem;
164+
padding: 0.5rem 1rem;
165+
color: var(--accent);
166+
font-weight: 500;
167+
text-decoration: none;
168+
font-size: 0.95rem;
169+
border-radius: 6px;
170+
transition: color 0.2s, background 0.2s;
171+
}
172+
.dive-in:hover {
173+
color: var(--text);
174+
background: rgba(56, 139, 253, 0.12);
141175
}
142-
.chain span { color: var(--text-muted); }
143-
.chain .artifact { color: var(--accent); }
144-
.chain .arrow { color: var(--text-muted); margin: 0 0.35rem; }
145176

146177
.bullets {
147178
list-style: none;
@@ -215,8 +246,9 @@
215246

216247
<header>
217248
<span class="badge">Protocol v1.0</span>
218-
<h1>Machine Payment Control Protocol</h1>
219-
<p>Verifiable machine-to-service payments. Bounded authorization, deterministic verification, settlement-agnostic.</p>
249+
<h1>Machine Payment Control Protocol (MPCP)</h1>
250+
<p class="tagline">The authorization layer for machine commerce.</p>
251+
<p class="subtitle">Verifiable machine-to-service payments. Bounded authorization, deterministic verification, settlement-agnostic.</p>
220252
</header>
221253

222254
<main>
@@ -228,10 +260,19 @@ <h2>The problem</h2>
228260
<section>
229261
<h2>How MPCP works</h2>
230262
<p>A payment is accepted only if the recipient can verify a chain of signed artifacts. Each step narrows what the machine is allowed to do.</p>
231-
<div class="chain">
232-
<span class="artifact">Fleet Policy</span><span class="arrow">→</span><span class="artifact">PolicyGrant</span><span class="arrow">→</span><span class="artifact">SBA</span><span class="arrow">→</span><span class="artifact">SPA</span><span class="arrow">→</span><span class="artifact">SettlementIntent</span><span class="arrow">→</span><span>Settlement</span>
263+
<div class="chain-flow">
264+
<div class="step">Policy</div>
265+
<div class="arrow">↓</div>
266+
<div class="step">Budget Authorization</div>
267+
<div class="arrow">↓</div>
268+
<div class="step">Payment Authorization</div>
269+
<div class="arrow">↓</div>
270+
<div class="step">Settlement Intent</div>
271+
<div class="arrow">↓</div>
272+
<div class="step">Settlement</div>
233273
</div>
234-
<p>Machines get pre-authorized spending envelopes (budgets). They can execute payments autonomously—as long as they stay within policy and budget bounds.</p>
274+
<p>MPCP represents machine payments as a chain of signed authorization artifacts.</p>
275+
<a href="/spec/architecture/reference-flow/" class="dive-in">Dive in → Reference flow</a>
235276
</section>
236277

237278
<section>

0 commit comments

Comments
 (0)