-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
653 lines (610 loc) · 33.9 KB
/
index.html
File metadata and controls
653 lines (610 loc) · 33.9 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>The AI Verification Protocol — vprotocol.21no.de</title>
<meta name="description" content="Diagnose, repair, and measure verification debt in AI-generated code. A multi-agent pipeline that derives η from signals, tracks Ci/Cv ratios, and produces machine-readable certificates." />
<meta name="keywords" content="AI verification protocol, verification debt, AI code review, automated verification, multi-agent pipeline, η derivation, ρ correlation, Ci/Cv ratio, in-toto attestation, SLSA, code provenance, software verification" />
<meta name="author" content="21no.de" />
<meta name="theme-color" content="#0a0a0b" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://vprotocol.21no.de" />
<meta property="og:title" content="The AI Verification Protocol" />
<meta property="og:description" content="Diagnose, repair, and measure — the operational answer to AI verification debt." />
<meta property="og:image" content="https://vprotocol.21no.de/og.svg" />
<meta property="og:site_name" content="vprotocol.21no.de" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image:alt" content="The AI Verification Protocol — diagnose, repair, and measure" />
<meta property="og:locale" content="en_US" />
<meta name="twitter:card" content="summary_large_image" />
<link rel="canonical" href="https://vprotocol.21no.de" />
<link rel="icon" type="image/svg+xml" href="og.svg" />
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; style-src 'self' 'unsafe-inline' https://assets.21no.de; font-src 'self' https://assets.21no.de; img-src 'self' data:; connect-src 'self'; base-uri 'self'; form-action 'self'" />
<link rel="stylesheet" href="https://assets.21no.de/fonts/fonts.css" />
<link rel="stylesheet" href="https://assets.21no.de/css/tokens.css" />
<link rel="stylesheet" href="https://assets.21no.de/css/base.css" />
<link rel="stylesheet" href="https://assets.21no.de/css/nav.css" />
<link rel="stylesheet" href="https://assets.21no.de/css/hero.css" />
<link rel="stylesheet" href="https://assets.21no.de/css/buttons.css" />
<link rel="stylesheet" href="https://assets.21no.de/css/cards.css" />
<link rel="stylesheet" href="https://assets.21no.de/css/footer.css" />
<style>
:root {
--bg-primary: #0a0a0b;
--bg-card: #16161a;
--border-subtle: rgba(255,255,255,0.06);
--border-card: rgba(255,255,255,0.08);
--text-primary: #ededef;
--text-secondary: #9b9ba3;
--text-tertiary: #6b6b75;
--accent: #38bdf8;
--accent-glow: rgba(56,189,248,0.12);
--accent-subtle: rgba(56,189,248,0.08);
--green: #3dd68c;
--green-subtle: rgba(61,214,140,0.1);
--red: #f87171;
--yellow: #f5d90a;
--radius-sm: 6px;
--radius-md: 8px;
--radius-lg: 12px;
--font-sans: 'Outfit', system-ui, -apple-system, sans-serif;
--font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
--max-width: 1100px;
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
font-family: var(--font-sans);
background: var(--bg-primary);
color: var(--text-primary);
line-height: 1.7;
-webkit-font-smoothing: antialiased;
}
/* === Hero === */
.hero { padding: 120px 24px 100px; text-align: center; position: relative; overflow: hidden; }
.hero::before {
content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%;
background: radial-gradient(ellipse at 50% 30%, rgba(56,189,248,0.04) 0%, transparent 60%);
pointer-events: none;
}
.hero-badge {
display: inline-flex; align-items: center; gap: 8px;
background: var(--accent-subtle);
border: 1px solid rgba(56,189,248,0.2);
color: var(--accent);
padding: 6px 16px; border-radius: 999px;
font-size: 13px; font-weight: 500; margin-bottom: 28px;
position: relative;
}
.hero-badge .dot { width: 6px; height: 6px; background: var(--accent); border-radius: 50%; animation: pulse 2s infinite; }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }
.hero h1 {
font-size: clamp(40px, 6vw, 64px); font-weight: 700;
color: #fff; letter-spacing: -2px; line-height: 1.05;
margin-bottom: 20px; position: relative;
}
.hero h1 span { color: var(--accent); }
.hero .subtitle {
font-size: clamp(16px, 2vw, 20px); font-weight: 300;
color: var(--text-secondary); max-width: 640px;
margin: 0 auto 40px; line-height: 1.5; position: relative;
}
.hero-actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; position: relative; }
.btn {
display: inline-flex; align-items: center; gap: 8px;
padding: 12px 28px; border-radius: var(--radius-md);
font-size: 15px; font-weight: 500; text-decoration: none;
transition: all 0.2s; cursor: pointer; border: none;
}
.btn-primary { background: var(--accent); color: #000; }
.btn-primary:hover { background: #7dd3fc; transform: translateY(-1px); box-shadow: 0 4px 20px rgba(56,189,248,0.25); }
.btn-secondary { background: var(--bg-card); color: var(--text-primary); border: 1px solid var(--border-card); }
.btn-secondary:hover { border-color: var(--accent); color: #fff; }
/* === Stats === */
.stats { display: flex; gap: 40px; justify-content: center; flex-wrap: wrap; padding: 0 24px 80px; }
.stat { text-align: center; }
.stat-value { font-size: 36px; font-weight: 700; color: #fff; letter-spacing: -0.5px; }
.stat-label { font-size: 13px; color: var(--text-tertiary); margin-top: 4px; text-transform: uppercase; letter-spacing: 1px; }
/* === Sections === */
section { padding: 80px 24px; }
.section-inner { max-width: var(--max-width); margin: 0 auto; }
.section-label {
font-family: var(--font-mono); font-size: 12px; font-weight: 500;
color: var(--accent); text-transform: uppercase; letter-spacing: 0.8px;
margin-bottom: 12px;
}
.section-title {
font-size: clamp(28px, 3.5vw, 40px); font-weight: 700;
color: #fff; letter-spacing: -1px; line-height: 1.15; margin-bottom: 16px;
}
.section-desc {
font-size: 16px; color: var(--text-secondary); max-width: 640px;
line-height: 1.6; margin-bottom: 48px;
}
/* === Pipeline overview === */
.pipeline-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; }
.pipeline-step {
background: var(--bg-card); border: 1px solid var(--border-card);
border-radius: var(--radius-md); padding: 24px; text-align: center;
transition: border-color 0.2s;
}
.pipeline-step:hover { border-color: var(--accent); }
.pipeline-step .emoji { font-size: 28px; margin-bottom: 12px; }
.pipeline-step h4 { font-size: 15px; font-weight: 600; color: #fff; margin-bottom: 6px; }
.pipeline-step p { font-size: 13px; color: var(--text-tertiary); line-height: 1.5; }
/* === Five Whys === */
.why-item { margin-bottom: 48px; position: relative; }
.why-num {
font-family: var(--font-mono); font-size: 48px; font-weight: 700;
color: var(--accent); opacity: 0.15; line-height: 1; margin-bottom: -20px;
}
.why-item h3 { font-size: 20px; font-weight: 600; color: #fff; margin-bottom: 12px; letter-spacing: -0.3px; }
.why-item p { font-size: 15px; color: var(--text-secondary); line-height: 1.65; max-width: 680px; }
.why-item .cite {
margin-top: 12px; padding: 12px 16px;
background: var(--bg-card); border-left: 3px solid var(--accent);
border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
font-size: 13px; color: var(--text-tertiary); font-style: italic; max-width: 680px;
}
.why-item .cite strong { color: var(--accent); font-style: normal; }
/* === Two columns === */
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }
@media (max-width: 768px) { .two-col { grid-template-columns: 1fr; } }
/* === Feature cards === */
.feature-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.feature-card {
background: var(--bg-card); border: 1px solid var(--border-card);
border-radius: var(--radius-md); padding: 28px;
}
.feature-card h4 { font-size: 16px; font-weight: 600; color: #fff; margin-bottom: 8px; }
.feature-card p { font-size: 14px; color: var(--text-secondary); line-height: 1.6; }
.feature-card code {
font-family: var(--font-mono); font-size: 13px;
background: rgba(56,189,248,0.1); color: var(--accent);
padding: 2px 6px; border-radius: 4px;
}
/* === Formula highlight === */
.formula-block {
background: var(--bg-card); border: 1px solid var(--border-card);
border-radius: var(--radius-md); padding: 24px 28px;
text-align: center; margin: 32px 0;
}
.formula-block code {
font-family: var(--font-mono); font-size: 18px;
color: var(--accent); background: none;
}
/* === CTA section === */
.cta-section {
text-align: center; padding: 100px 24px 120px;
background: radial-gradient(ellipse at 50% 50%, rgba(56,189,248,0.05) 0%, transparent 70%);
}
.cta-section .section-title { margin-bottom: 12px; }
.cta-section .subtitle { font-size: 16px; color: var(--text-secondary); margin-bottom: 32px; }
.cta-section a.btn { font-size: 16px; padding: 14px 36px; }
/* === Footer === */
footer {
border-top: 1px solid var(--border-subtle); padding: 40px 24px;
text-align: center; color: var(--text-tertiary); font-size: 13px;
}
footer a { color: var(--text-secondary); text-decoration: none; }
footer a:hover { color: var(--text-primary); }
/* === Certificate Carousel === */
.cert-carousel {
max-width: 880px; margin: 48px auto 0; position: relative;
}
.cert-slides { overflow: hidden; border-radius: var(--radius-lg); }
.cert-slide {
display: none; grid-template-columns: auto 1fr;
gap: 28px; align-items: start;
background: var(--bg-card); border: 1px solid var(--border-card);
border-radius: var(--radius-lg); padding: 28px 32px;
animation: certFadeIn 0.4s ease;
}
.cert-slide.active { display: grid; }
@keyframes certFadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.cert-verdict {
display: flex; flex-direction: column; align-items: center; gap: 8px;
padding: 16px 20px; border-radius: var(--radius-md);
font-family: var(--font-mono); font-size: 12px; text-align: center;
min-width: 120px;
}
.cert-verdict.green { background: var(--green-subtle); border: 1px solid rgba(61,214,140,0.2); }
.cert-verdict.yellow { background: rgba(245,217,10,0.08); border: 1px solid rgba(245,217,10,0.2); }
.cert-verdict.red { background: rgba(248,113,113,0.08); border: 1px solid rgba(248,113,113,0.2); }
.cert-verdict .v-badge {
font-size: 11px; font-weight: 600; text-transform: uppercase;
letter-spacing: 0.6px; padding: 4px 10px; border-radius: 999px;
}
.cert-verdict.green .v-badge { background: var(--green); color: #000; }
.cert-verdict.yellow .v-badge { background: var(--yellow); color: #000; }
.cert-verdict.red .v-badge { background: var(--red); color: #000; }
.cert-verdict .v-icon { font-size: 24px; }
.cert-verdict .v-desc { font-size: 11px; color: var(--text-tertiary); line-height: 1.4; }
.cert-body { min-width: 0; }
.cert-body .cert-pr {
font-family: var(--font-mono); font-size: 13px; color: var(--text-secondary);
margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--border-subtle);
}
.cert-body .cert-pr strong { color: #fff; }
.cert-metrics {
display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
gap: 10px; margin-bottom: 12px;
}
.cert-metric {
background: rgba(255,255,255,0.03); border-radius: var(--radius-sm);
padding: 10px 12px; text-align: center;
}
.cert-metric .m-val { font-family: var(--font-mono); font-size: 18px; font-weight: 600; color: #fff; }
.cert-metric .m-label { font-size: 10px; color: var(--text-tertiary); text-transform: uppercase; letter-spacing: 0.5px; margin-top: 2px; }
.cert-body .cert-reason {
font-size: 13px; color: var(--text-secondary); line-height: 1.5;
padding: 10px 14px; background: rgba(255,255,255,0.02);
border-radius: var(--radius-sm); border-left: 3px solid var(--accent);
}
.cert-body .cert-reason strong { color: var(--accent); }
.carousel-controls {
display: flex; align-items: center; justify-content: center;
gap: 12px; margin-top: 16px;
}
.carousel-dot {
width: 8px; height: 8px; border-radius: 50%;
background: var(--border-card); border: none; cursor: pointer;
transition: all 0.2s; padding: 0;
}
.carousel-dot.active { background: var(--accent); box-shadow: 0 0 8px var(--accent-glow); }
.carousel-dot:hover { background: var(--text-tertiary); }
.carousel-label {
font-family: var(--font-mono); font-size: 11px; color: var(--text-tertiary);
margin-left: 8px; letter-spacing: 0.5px;
}
/* === Responsive === */
@media (max-width: 640px) {
.hero { padding: 80px 16px 60px; }
.stats { gap: 20px; }
.stat-value { font-size: 28px; }
section { padding: 48px 16px; }
.cert-slide { grid-template-columns: 1fr; gap: 16px; padding: 20px; }
.cert-verdict { flex-direction: row; min-width: auto; justify-content: center; gap: 16px; }
.cert-metrics { grid-template-columns: repeat(2, 1fr); }
}
</style>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@graph": [
{
"@type": "Organization",
"name": "The AI Verification Protocol",
"url": "https://vprotocol.21no.de",
"description": "A multi-agent pipeline that diagnoses verification debt, repairs what it can, and produces machine-readable certificates.",
"sameAs": ["https://github.com/BackendStack21/ai-verification-protocol"]
},
{
"@type": "WebSite",
"name": "The AI Verification Protocol",
"url": "https://vprotocol.21no.de",
"description": "A multi-agent pipeline that diagnoses verification debt, repairs what it can, and produces machine-readable certificates."
}
]
}
</script>
</head>
<body>
<nav class="nav">
<div class="nav-inner">
<a href="https://21no.de" class="nav-logo">
<svg width="28" height="28" viewBox="0 0 28 28" fill="none">
<rect width="28" height="28" rx="6" fill="#38bdf8"/>
<text x="14" y="20" text-anchor="middle" fill="#0a0a0b" font-family="system-ui" font-weight="700" font-size="16">21</text>
</svg>
21no.de
</a>
<div class="nav-links">
<a href="https://21no.de">Home</a>
<a href="https://github.com/BackendStack21/ai-verification-protocol" target="_blank" rel="noopener">GitHub</a>
<a href="./ai-verification-protocol.md">Protocol →</a>
</div>
</div>
</nav>
<!-- Hero -->
<section class="hero">
<div class="hero-badge"><span class="dot"></span> v5.2.6 · Open Source</div>
<h1>The AI <span>Verification</span> Protocol</h1>
<p class="subtitle">
A multi-agent pipeline that diagnoses verification debt, repairs what it can, and produces machine-readable certificates — so humans audit the certificate, not the code.
</p>
<div class="hero-actions">
<a href="./ai-verification-protocol.md" class="btn btn-primary">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/></svg>
Read the Protocol
</a>
<a href="https://github.com/BackendStack21/ai-verification-protocol" class="btn btn-secondary" target="_blank" rel="noopener">
<svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/></svg>
GitHub
</a>
</div>
<!-- Certificate Carousel -->
<div class="cert-carousel">
<div class="cert-slides">
<div class="cert-slide active" data-verdict="approve">
<div class="cert-verdict green">
<div class="v-icon">✅</div>
<div class="v-badge">AutoApprove</div>
<div class="v-desc">Merge proceeds<br/>no human needed</div>
</div>
<div class="cert-body">
<div class="cert-pr">PR <strong>#142</strong> · fix: race condition in connection pool · <strong>+48 −12</strong> LOC</div>
<div class="cert-metrics">
<div class="cert-metric"><div class="m-val">0.97</div><div class="m-label">η (efficiency)</div></div>
<div class="cert-metric"><div class="m-val">0.03</div><div class="m-label">ρ (correlation)</div></div>
<div class="cert-metric"><div class="m-val">12:1</div><div class="m-label">Cv / Ci</div></div>
<div class="cert-metric"><div class="m-val">0.6h</div><div class="m-label">Δ Debt</div></div>
</div>
<div class="cert-reason"><strong>Why:</strong> mutation kill rate 97%, 100% branch coverage on changed lines, provider families: Anthropic (gen) vs DeepSeek (verify) — pipeline diversity avoids shared blind spots.</div>
</div>
</div>
<div class="cert-slide" data-verdict="recommend">
<div class="cert-verdict yellow">
<div class="v-icon">⚠️</div>
<div class="v-badge">Human Review<br/>Recommended</div>
<div class="v-desc">Merge allowed<br/>review suggested</div>
</div>
<div class="cert-body">
<div class="cert-pr">PR <strong>#287</strong> · feat: add WebSocket upgrade handler · <strong>+312 −89</strong> LOC</div>
<div class="cert-metrics">
<div class="cert-metric"><div class="m-val">0.82</div><div class="m-label">η (efficiency)</div></div>
<div class="cert-metric"><div class="m-val">0.08</div><div class="m-label">ρ (correlation)</div></div>
<div class="cert-metric"><div class="m-val">180:1</div><div class="m-label">Cv / Ci</div></div>
<div class="cert-metric"><div class="m-val">2.4h</div><div class="m-label">Δ Debt</div></div>
</div>
<div class="cert-reason"><strong>Why:</strong> axis 2.5 (behavioral exploration) flagged ⚠️ — sandbox revealed 3 edge-case timeouts under concurrent close. All 3 auto-remediated. Human should verify the fix doesn't mask a deeper ordering bug.</div>
</div>
</div>
<div class="cert-slide" data-verdict="required">
<div class="cert-verdict red">
<div class="v-icon">🔴</div>
<div class="v-badge">Human Review<br/>Required</div>
<div class="v-desc">Merge blocked<br/>must inspect</div>
</div>
<div class="cert-body">
<div class="cert-pr">PR <strong>#391</strong> · feat: OAuth2 token refresh with encrypted storage · <strong>+647 −23</strong> LOC</div>
<div class="cert-metrics">
<div class="cert-metric"><div class="m-val">0.71</div><div class="m-label">η (efficiency)</div></div>
<div class="cert-metric"><div class="m-val">0.12</div><div class="m-label">ρ (correlation)</div></div>
<div class="cert-metric"><div class="m-val">890:1</div><div class="m-label">Cv / Ci</div></div>
<div class="cert-metric"><div class="m-val">4.1h</div><div class="m-label">Δ Debt</div></div>
</div>
<div class="cert-reason"><strong>Why:</strong> axis 2.3 (security surface) 🔴 — new crypto code with 3 SAST-high findings. PR size cap triggered (647 LOC in security path). Certificate identifies exact files and lines for human auditor to inspect.</div>
</div>
</div>
<div class="cert-slide" data-verdict="cannot">
<div class="cert-verdict red" style="border-color:rgba(248,113,113,0.35);">
<div class="v-icon">🛑</div>
<div class="v-badge">Cannot<br/>Verify</div>
<div class="v-desc">Pipeline abort<br/>return to author</div>
</div>
<div class="cert-body">
<div class="cert-pr">PR <strong>#503</strong> · feat: speculative decoding cache with custom allocator · <strong>+1,892 −0</strong> LOC</div>
<div class="cert-metrics">
<div class="cert-metric"><div class="m-val">—</div><div class="m-label">η (efficiency)</div></div>
<div class="cert-metric"><div class="m-val">0.38</div><div class="m-label">ρ (correlation)</div></div>
<div class="cert-metric"><div class="m-val">∞</div><div class="m-label">Cv / Ci</div></div>
<div class="cert-metric"><div class="m-val">—</div><div class="m-label">Δ Debt</div></div>
</div>
<div class="cert-reason"><strong>Why:</strong> ρ exceeds 0.30 cap — agent A and agent D share OpenAI o4-mini; AST similarity 0.82. PR must be re-verified with a different verifier family.</div>
</div>
</div>
</div>
<div class="carousel-controls">
<button class="carousel-dot active" data-index="0" aria-label="AutoApprove"></button>
<button class="carousel-dot" data-index="1" aria-label="HumanReviewRecommended"></button>
<button class="carousel-dot" data-index="2" aria-label="HumanReviewRequired"></button>
<button class="carousel-dot" data-index="3" aria-label="CannotVerify"></button>
<span class="carousel-label">certificate previews</span>
</div>
</div>
</section>
<!-- The Problem -->
<section>
<div class="section-inner">
<div class="section-label">The Problem</div>
<h2 class="section-title">AI generates code 16,000× cheaper than we can verify it</h2>
<p class="section-desc">
In 2023, generating a 200-line PR cost $0.30 and verifying it cost ~$50. Today, the same PR costs $0.015 to generate — but verification still costs ~$50. The ratio has exploded from 33:1 to over 3,300:1, and it's degrading exponentially.
</p>
<div class="formula-block">
<code>Cv / Ci → ∞</code>
<p style="margin-top:10px;font-size:14px;color:var(--text-tertiary)">
Cost-to-Verify ÷ Cost-to-Implement — the ratio that matters, tracked per PR, per module
</p>
</div>
<div class="pipeline-steps">
<div class="pipeline-step">
<div class="emoji">📥</div>
<h4>PR Arrives</h4>
<p>Agent A submits code. The pipeline classifies it — KnownGroundTruth, NovelBehavior, GeneratedCode, or GeneratedTests.</p>
</div>
<div class="pipeline-step">
<div class="emoji">🔍</div>
<h4>9 Axes Scanned</h4>
<p>Semantic correctness, behavioral contract, security surface, structural integrity, adversarial surface, documentation coverage, and more.</p>
</div>
<div class="pipeline-step">
<div class="emoji">🎲</div>
<h4>Sandbox + Fuzz</h4>
<p>10,000 scenarios replayed in a deterministic sandbox. Behavioral contracts extracted from the spec — never from the implementation.</p>
</div>
<div class="pipeline-step">
<div class="emoji">📊</div>
<h4>Certificate Signed</h4>
<p>Agent E derives η from signals, tracks Cv/Ci, computes verification debt, and signs an in-toto attestation.</p>
</div>
<div class="pipeline-step">
<div class="emoji">👤</div>
<h4>Human Audits</h4>
<p>The human reviews the certificate — not the code. Auto-Approve, Human Review Recommended, or Human Review Required.</p>
</div>
</div>
</div>
</section>
<!-- Five Whys -->
<section style="background: rgba(255,255,255,0.01);">
<div class="section-inner">
<div class="section-label">The Five Whys</div>
<h2 class="section-title">Why is AI verification debt the defining problem of the next decade?</h2>
<p class="section-desc">
Root-cause analysis, cited from <a href="https://21no.de/viewer.html?file=publications/the-verification-trap.md&label=Whitepaper" style="color:var(--accent)">The AI Verification Debt</a> whitepaper.
</p>
<div class="why-item">
<div class="why-num">01</div>
<h3>Generation costs collapsed 100–150×. Verification costs haven't budged.</h3>
<p>
In March 2023, GPT-4 cost $30/$60 per 1M tokens. By May 2026, DeepSeek V4-Flash costs $0.14/$0.28 — two orders of magnitude cheaper. But human review is still capped at ~200 lines of code per hour, the same sustainable rate documented by SmartBear and Cisco since 2006. The bottleneck shifted from generation to verification overnight.
</p>
<div class="cite">
<strong>The AI Verification Debt</strong> — "The industry is celebrating the collapse of generation cost. That is half of the story. [...] Google's engineering practices recommend changes under 200–400 LOC for thorough review. The SmartBear/Cisco study found that reviewing 200–400 LOC/hour is the sustainable human rate for detecting meaningful defects."
</div>
</div>
<div class="why-item">
<div class="why-num">02</div>
<h3>Automated tests inherit the same blind spots as the code they verify.</h3>
<p>
If the same model generates both the implementation and its tests, an error mode the model systematically reproduces passes through both layers undetected. The automated filtering efficiency η is not an independent variable — it degrades dynamically as the shared generation loop introduces correlated failures. The protocol detects this via the correlation penalty ρ and enforces provider-family diversity across pipeline agents.
</p>
<div class="cite">
<strong>The AI Verification Debt</strong> — "If the same model generates both the implementation and the filters that verify it, η is not an independent variable. An error mode that the model systematically reproduces will pass through both layers undetected — the automated filter inherits the same blind spot as the code it is validating."
</div>
</div>
<div class="why-item">
<div class="why-num">03</div>
<h3>Unverified code compounds — each module adds uncertainty to the entire dependency graph.</h3>
<p>
Every AI-generated feature shipped without a corresponding verification investment degrades your ability to autonomously ship the next feature. The agent generating the next PR cannot self-evaluate its impact on unverified code — it has no ground truth about what the unverified module actually does. The protocol tracks this as <em>verification debt</em> per module, with interest rates for hot paths.
</p>
<div class="cite">
<strong>The AI Verification Debt</strong> — "Verification debt is the accumulated gap between the volume of generated code and the volume of verified behavior. [...] This is a compounding liability, not a fixed cost. Each unverified module adds uncertainty to the entire dependency graph."
</div>
</div>
<div class="why-item">
<div class="why-num">04</div>
<h3>The components exist — they're just not wired together.</h3>
<p>
Property-based testing (QuickCheck), fuzzing, SAST, deterministic replay sandboxes, behavioral contract differencing, SLSA/in-toto attestation — all exist as isolated tools. What's missing is an orchestration and provenance layer that connects them into a coherent verification pipeline. The protocol is that layer: a unified spec that coordinates five agents across these tools and produces a single auditable certificate.
</p>
<div class="cite">
<strong>The AI Verification Debt</strong> — "The industry built the accelerator. It also built most of the brake components. Nobody has connected them into a braking system that a driver can use at highway speed."
</div>
</div>
<div class="why-item">
<div class="why-num">05</div>
<h3>The Cv/Ci ratio is already ~3,300:1 and degrading exponentially.</h3>
<p>
Projecting forward: if the price war between US and Chinese labs continues and inference costs drop another 10×, the ratio hits ~16,700:1. The team that invests in verification infrastructure can safely ship 10× more code than the team that invests in better generation alone. The team that does not — will drown in verification debt within this decade.
</p>
<div class="cite">
<strong>The AI Verification Debt</strong> — "The trap is not that the code is bad. The trap is that <em>nobody knows how bad it is</em> until the verification debt compounds. [...] The team that invests in verification infrastructure can safely ship 10× more code than the team that invests in better generation alone."
</div>
</div>
</div>
</section>
<!-- How It Works -->
<section>
<div class="section-inner">
<div class="section-label">Technical Depth</div>
<h2 class="section-title">How the protocol works</h2>
<p class="section-desc">
The protocol is both a specification and a system prompt — it can be loaded into any capable AI model playing a pipeline role, or read as a standalone guide for building verification infrastructure.
</p>
<div class="feature-grid">
<div class="feature-card">
<h4>η Derivation from Signals</h4>
<p>
Automated filtering efficiency is computed mechanically from seven observable signals: <code>m</code> (mutation kill rate), <code>o</code> (oracle agreement), <code>b</code> (branch coverage), <code>f</code> (fuzz survival), <code>s</code> (SAST clean rate), <code>t</code> (static depth), and <code>d</code> (doc coverage).
</p>
</div>
<div class="feature-card">
<h4>ρ Correlation Penalty</h4>
<p>
Quantifies how dependent verification artifacts are on the generator — family overlap, version overlap, AST similarity, and shared mutation survival patterns. ρ > 0.30 triggers <code>CannotVerify</code> regardless of η.
</p>
</div>
<div class="feature-card">
<h4>Spec Independence Check</h4>
<p>
Detects when the same author wrote the spec and the code within 7 days — a form of correlator-break laundering. Flagged in the certificate for human audit, priced into ρ.
</p>
</div>
<div class="feature-card">
<h4>Auto-Repair with Guardrails</h4>
<p>
Documentation gaps, missing tests, and type mismatches are auto-remediated. Behavior-changing fixes are human-only. Five-gate repair verification prevents regressions.
</p>
</div>
<div class="feature-card">
<h4>Machine-Readable Certificates</h4>
<p>
JSON certificates with in-toto attestation. Downstream CI gates, deploy pipelines, and audit dashboards consume them. Markdown rendering for human auditors.
</p>
</div>
<div class="feature-card">
<h4>Meta-Audit Loop</h4>
<p>
5% of certificates sampled monthly for ground-truth comparison. Brier scoring detects calibration drift. Weights auto-recalibrate against observed defect outcomes.
</p>
</div>
</div>
</div>
</section>
<!-- CTA -->
<section class="cta-section">
<h2 class="section-title">Ready to measure what matters?</h2>
<p class="subtitle">
Read the full protocol — 14 sections, 2 appendices, and 7 critical pitfalls with 35+ rule-level safeguards. Version 5.2.5.
</p>
<a href="./ai-verification-protocol.md" class="btn btn-primary" style="font-size:16px;padding:14px 36px;">
Read the Protocol →
</a>
<p style="margin-top:24px;font-size:14px;color:var(--text-tertiary)">
Or <a href="https://github.com/BackendStack21/ai-verification-protocol" style="color:var(--accent)">clone the repo</a> to integrate it into your CI/CD pipeline.
</p>
</section>
<footer>
<p>
<a href="https://21no.de">21no.de</a> — AI-native infrastructure and systems engineering research lab.
<br>
Companion to <a href="https://21no.de/viewer.html?file=publications/the-verification-trap.md&label=Whitepaper">The AI Verification Debt</a> whitepaper.
</p>
</footer>
<script>
(function(){
var slides = document.querySelectorAll('.cert-slide');
var dots = document.querySelectorAll('.carousel-dot');
var current = 0;
var interval = 6000;
var timer;
function show(idx) {
slides[current].classList.remove('active');
dots[current].classList.remove('active');
current = (idx + slides.length) % slides.length;
slides[current].classList.add('active');
dots[current].classList.add('active');
}
function next() { show(current + 1); }
dots.forEach(function(dot) {
dot.addEventListener('click', function() {
show(parseInt(this.dataset.index));
clearInterval(timer);
timer = setInterval(next, interval);
});
});
timer = setInterval(next, interval);
// Pause on hover
var carousel = document.querySelector('.cert-carousel');
carousel.addEventListener('mouseenter', function(){ clearInterval(timer); });
carousel.addEventListener('mouseleave', function(){ timer = setInterval(next, interval); });
})();
</script>
</body>
</html>