481 lines
32 KiB
HTML
481 lines
32 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Governance Architecture | Tractatus AI Safety Framework</title>
|
|
<meta name="description" content="Defence in depth for AI governance: behavioral training, structural enforcement through Guardian Agents, and human oversight. Five architectural principles adapted from Christopher Alexander's living systems.">
|
|
|
|
<!-- Open Graph / Facebook -->
|
|
<meta property="og:type" content="website">
|
|
<meta property="og:url" content="https://agenticgovernance.digital/architecture.html">
|
|
<meta property="og:title" content="Governance Architecture | Tractatus">
|
|
<meta property="og:description" content="Defence in depth: behavioral training, structural enforcement through Guardian Agents, and human oversight. Five architectural principles from living systems.">
|
|
<meta property="og:image" content="https://agenticgovernance.digital/images/social-preview.png">
|
|
<meta property="og:image:width" content="1200">
|
|
<meta property="og:image:height" content="630">
|
|
<meta property="og:site_name" content="Tractatus Framework">
|
|
<meta property="og:see_also" content="https://www.facebook.com/agenticgovernance">
|
|
|
|
<!-- Twitter -->
|
|
<meta name="twitter:card" content="summary_large_image">
|
|
<meta name="twitter:url" content="https://agenticgovernance.digital/architecture.html">
|
|
<meta name="twitter:title" content="Governance Architecture | Tractatus">
|
|
<meta name="twitter:description" content="Defence in depth: behavioral training, structural enforcement through Guardian Agents, and human oversight. Five architectural principles from living systems.">
|
|
<meta name="twitter:image" content="https://agenticgovernance.digital/images/social-preview.png">
|
|
|
|
<link rel="icon" type="image/svg+xml" href="/favicon-new.svg">
|
|
<link rel="stylesheet" href="/css/fonts.css?v=0.1.2.1774503360480">
|
|
<link rel="stylesheet" href="/css/tailwind.css?v=0.1.2.1774503360480">
|
|
<link rel="stylesheet" href="/css/tractatus-theme.min.css?v=0.1.2.1774503360480">
|
|
<style>
|
|
.skip-link { position: absolute; left: -9999px; }
|
|
.skip-link:focus { left: 0; z-index: 100; background: white; padding: 1rem; }
|
|
a:focus, button:focus, input:focus, select:focus, textarea:focus {
|
|
outline: 3px solid #3b82f6;
|
|
outline-offset: 2px;
|
|
}
|
|
a:focus:not(:focus-visible) { outline: none; }
|
|
a:focus-visible { outline: 3px solid #3b82f6; outline-offset: 2px; }
|
|
</style>
|
|
</head>
|
|
<body class="bg-gray-50">
|
|
|
|
<!-- Skip Link for Keyboard Navigation -->
|
|
<a href="#main-content" class="skip-link">Skip to main content</a>
|
|
|
|
<!-- Navigation (injected by navbar.js) -->
|
|
<div id="navbar-placeholder" class="min-h-16"></div>
|
|
<script src="/js/components/navbar.js?v=0.1.2.1774503360480"></script>
|
|
|
|
<!-- Breadcrumb Navigation -->
|
|
<nav class="bg-gray-50 border-b border-gray-200 py-3" aria-label="Breadcrumb">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<ol class="flex items-center space-x-2 text-sm">
|
|
<li><a href="/" class="text-tractatus-link hover:underline transition-colors" data-i18n="breadcrumb.home"></a></li>
|
|
<li class="text-gray-400">/</li>
|
|
<li class="text-gray-900 font-medium" aria-current="page" data-i18n="breadcrumb.current"></li>
|
|
</ol>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Hero Section -->
|
|
<header role="banner">
|
|
<section class="text-white bg-gradient-tractatus">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pt-14 pb-20">
|
|
<div class="text-center">
|
|
<h1 class="text-4xl md:text-5xl font-bold mb-4 tracking-tight text-shadow-md" data-i18n="hero.title">
|
|
Governance Architecture
|
|
</h1>
|
|
<p class="text-xl md:text-2xl mb-8 max-w-3xl mx-auto leading-relaxed text-shadow-sm" data-i18n-html="hero.subtitle">
|
|
No single layer of AI safety is sufficient. Tractatus uses <strong>defence in depth</strong> — three layers, each honest about its limitations.
|
|
</p>
|
|
<div class="flex flex-col sm:flex-row gap-4 justify-center">
|
|
<a href="#defence-in-depth" class="inline-block bg-white text-blue-700 px-8 py-3 rounded-lg font-semibold hover:bg-blue-50 transition" data-i18n="hero.cta_layers">
|
|
Three Layers
|
|
</a>
|
|
<a href="#five-principles" class="inline-block bg-blue-800/50 text-white px-8 py-3 rounded-lg font-semibold hover:bg-blue-800/70 transition border border-white/30" data-i18n="hero.cta_principles">
|
|
Five Principles
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</header>
|
|
|
|
<!-- Main Content -->
|
|
<main id="main-content" role="main">
|
|
|
|
<!-- Defence in Depth: Three Layers of Governance -->
|
|
<section id="defence-in-depth" class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
|
<h2 class="text-4xl font-bold text-gray-900 mb-4 text-center" data-i18n="defence_in_depth.heading">Defence in Depth</h2>
|
|
<p class="text-xl text-gray-600 text-center mb-10 max-w-3xl mx-auto" data-i18n="defence_in_depth.intro">
|
|
Behavioral training shapes tendency. Structural enforcement constrains capability. Human oversight provides cultural context. Three layers, complementary, each compensating for the others' weaknesses.
|
|
</p>
|
|
|
|
<div class="space-y-6 mb-12">
|
|
|
|
<!-- Layer 1: Behavioral Training -->
|
|
<div class="bg-blue-50 rounded-xl p-6 md:p-8 border border-blue-200">
|
|
<div class="flex items-start mb-4">
|
|
<div class="flex-shrink-0 w-12 h-12 bg-gradient-to-br from-blue-500 to-blue-600 rounded-xl flex items-center justify-center text-white text-lg font-bold mr-4">1</div>
|
|
<div>
|
|
<h3 class="text-2xl font-bold text-blue-900" data-i18n="defence_in_depth.layer1_title">Behavioral Training</h3>
|
|
<p class="text-blue-700 italic mt-1" data-i18n="defence_in_depth.layer1_role">Shapes model tendency toward governed behavior</p>
|
|
</div>
|
|
</div>
|
|
<p class="text-gray-700 mb-3" data-i18n="defence_in_depth.layer1_desc">
|
|
Training reduces boundary violations at source, before runtime enforcement is needed. The model cooperates with governance rather than fighting it. But training alone can be bypassed by adversarial prompts and degrades under context pressure.
|
|
</p>
|
|
<div class="flex items-center justify-between">
|
|
<div class="flex items-start">
|
|
<svg class="w-5 h-5 text-amber-500 mr-2 mt-0.5 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd"/></svg>
|
|
<span class="text-gray-600 text-sm" data-i18n="defence_in_depth.layer1_limitation">Can be bypassed by adversarial prompts; degrades under context pressure</span>
|
|
</div>
|
|
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-blue-100 text-blue-800 whitespace-nowrap" data-i18n="defence_in_depth.layer1_status">Planned</span>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Layer 2: Structural Enforcement -->
|
|
<div class="bg-emerald-50 rounded-xl p-6 md:p-8 border border-emerald-200">
|
|
<div class="flex items-start mb-4">
|
|
<div class="flex-shrink-0 w-12 h-12 bg-gradient-to-br from-emerald-500 to-emerald-600 rounded-xl flex items-center justify-center text-white text-lg font-bold mr-4">2</div>
|
|
<div>
|
|
<h3 class="text-2xl font-bold text-emerald-900" data-i18n="defence_in_depth.layer2_title">Structural Enforcement</h3>
|
|
<p class="text-emerald-700 italic mt-1" data-i18n="defence_in_depth.layer2_role">External constraints that cannot be bypassed by prompting</p>
|
|
</div>
|
|
</div>
|
|
<p class="text-gray-700 mb-3" data-i18n="defence_in_depth.layer2_desc">
|
|
Six governance services operate outside the AI runtime, plus Guardian Agents verifying every response through mathematical similarity rather than generative checking. Immutable audit trails stored independently. Catches what training misses.
|
|
</p>
|
|
<div class="flex items-center justify-between">
|
|
<div class="flex items-start">
|
|
<svg class="w-5 h-5 text-amber-500 mr-2 mt-0.5 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd"/></svg>
|
|
<span class="text-gray-600 text-sm" data-i18n="defence_in_depth.layer2_limitation">Cannot prevent all failure modes; adds runtime overhead</span>
|
|
</div>
|
|
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-emerald-100 text-emerald-800 whitespace-nowrap" data-i18n="defence_in_depth.layer2_status">In Production</span>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Layer 3: Human Oversight -->
|
|
<div class="bg-purple-50 rounded-xl p-6 md:p-8 border border-purple-200">
|
|
<div class="flex items-start mb-4">
|
|
<div class="flex-shrink-0 w-12 h-12 bg-gradient-to-br from-purple-500 to-purple-600 rounded-xl flex items-center justify-center text-white text-lg font-bold mr-4">3</div>
|
|
<div>
|
|
<h3 class="text-2xl font-bold text-purple-900" data-i18n="defence_in_depth.layer3_title">Human Oversight & Tenant Governance</h3>
|
|
<p class="text-purple-700 italic mt-1" data-i18n="defence_in_depth.layer3_role">Constitutional rules, cultural traditions, and human escalation</p>
|
|
</div>
|
|
</div>
|
|
<p class="text-gray-700 mb-3" data-i18n="defence_in_depth.layer3_desc">
|
|
Communities set their own governance rules through Tractatus traditions. Context-aware and culturally appropriate. Humans hold final authority on values decisions. AI facilitates, never decides.
|
|
</p>
|
|
<div class="flex items-center justify-between">
|
|
<div class="flex items-start">
|
|
<svg class="w-5 h-5 text-amber-500 mr-2 mt-0.5 flex-shrink-0" fill="currentColor" viewBox="0 0 20 20"><path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd"/></svg>
|
|
<span class="text-gray-600 text-sm" data-i18n="defence_in_depth.layer3_limitation">Cannot scale to every interaction; depends on human engagement</span>
|
|
</div>
|
|
<span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-purple-100 text-purple-800 whitespace-nowrap" data-i18n="defence_in_depth.layer3_status">Framework Complete</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Key Insight -->
|
|
<div class="bg-gradient-to-r from-blue-50 to-purple-50 rounded-xl p-8 border border-blue-200">
|
|
<blockquote class="text-xl text-gray-800 italic text-center max-w-3xl mx-auto mb-3">
|
|
"<span data-i18n="defence_in_depth.insight_quote">Training can make a model likely to behave well; only architecture can make it structurally harder to behave badly.</span>"
|
|
</blockquote>
|
|
<p class="text-sm text-gray-500 text-center" data-i18n="defence_in_depth.insight_attribution">Governance During Training, Tractatus Research</p>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Guardian Agents -->
|
|
<section id="guardian-agents" class="bg-gradient-to-br from-teal-50 to-emerald-50 py-16 border-y border-teal-200">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center mb-10">
|
|
<span class="inline-block bg-teal-600 text-white px-4 py-2 rounded-lg font-semibold mb-4 text-sm" data-i18n="guardian.badge">DEPLOYED — MARCH 2026</span>
|
|
<h2 class="text-4xl font-bold text-gray-900 mb-4" data-i18n="guardian.heading">Guardian Agents</h2>
|
|
<p class="text-xl text-gray-600 max-w-3xl mx-auto" data-i18n="guardian.subtitle">
|
|
Verification without common-mode failure. The watcher is not another speaker — it is a measuring instrument.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="max-w-4xl mx-auto">
|
|
<p class="text-gray-700 mb-6 text-lg" data-i18n-html="guardian.intro">
|
|
The fundamental problem with using one AI to verify another: both systems share the same epistemic domain. A generative model checking a generative model is susceptible to the <strong>same categories of failure</strong>. Guardian Agents resolve this by operating in a fundamentally different domain.
|
|
</p>
|
|
|
|
<!-- Four-Phase Verification -->
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-8">
|
|
<div class="bg-white rounded-lg p-5 border border-teal-200">
|
|
<div class="flex items-center mb-2">
|
|
<div class="w-8 h-8 bg-teal-100 rounded-lg flex items-center justify-center mr-3">
|
|
<span class="text-teal-700 font-bold text-sm">1</span>
|
|
</div>
|
|
<h3 class="font-bold text-gray-900" data-i18n="guardian.phase1_title">Source Analysis</h3>
|
|
</div>
|
|
<p class="text-gray-600 text-sm" data-i18n="guardian.phase1_desc">Identify factual claims in the AI response and locate candidate source material from the community's own content.</p>
|
|
</div>
|
|
<div class="bg-white rounded-lg p-5 border border-teal-200">
|
|
<div class="flex items-center mb-2">
|
|
<div class="w-8 h-8 bg-teal-100 rounded-lg flex items-center justify-center mr-3">
|
|
<span class="text-teal-700 font-bold text-sm">2</span>
|
|
</div>
|
|
<h3 class="font-bold text-gray-900" data-i18n="guardian.phase2_title">Embedding Similarity</h3>
|
|
</div>
|
|
<p class="text-gray-600 text-sm" data-i18n="guardian.phase2_desc">Cosine similarity between claim embeddings and source embeddings. Mathematical measurement, not interpretation. Not susceptible to hallucination.</p>
|
|
</div>
|
|
<div class="bg-white rounded-lg p-5 border border-teal-200">
|
|
<div class="flex items-center mb-2">
|
|
<div class="w-8 h-8 bg-teal-100 rounded-lg flex items-center justify-center mr-3">
|
|
<span class="text-teal-700 font-bold text-sm">3</span>
|
|
</div>
|
|
<h3 class="font-bold text-gray-900" data-i18n="guardian.phase3_title">Confidence Scoring</h3>
|
|
</div>
|
|
<p class="text-gray-600 text-sm" data-i18n="guardian.phase3_desc">Each claim receives a confidence badge (high, medium, low, unverified) visible to the user. Transparency by default.</p>
|
|
</div>
|
|
<div class="bg-white rounded-lg p-5 border border-teal-200">
|
|
<div class="flex items-center mb-2">
|
|
<div class="w-8 h-8 bg-teal-100 rounded-lg flex items-center justify-center mr-3">
|
|
<span class="text-teal-700 font-bold text-sm">4</span>
|
|
</div>
|
|
<h3 class="font-bold text-gray-900" data-i18n="guardian.phase4_title">Adaptive Learning</h3>
|
|
</div>
|
|
<p class="text-gray-600 text-sm" data-i18n="guardian.phase4_desc">Moderator corrections feed back into verification thresholds. The system learns from the community's own quality judgments.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Philosophical Foundations -->
|
|
<div class="bg-white rounded-xl p-6 border border-teal-200 mb-6">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-3" data-i18n="guardian.foundations_heading">Philosophical Foundations</h3>
|
|
<p class="text-gray-700 mb-4 text-sm" data-i18n="guardian.foundations_intro">
|
|
These architectural choices are philosophical commitments that demanded specific engineering responses.
|
|
</p>
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-3">
|
|
<div class="bg-gray-50 rounded-lg p-4">
|
|
<p class="font-semibold text-gray-900 text-sm" data-i18n="guardian.foundation1_name">Wittgenstein</p>
|
|
<p class="text-gray-600 text-sm" data-i18n="guardian.foundation1_desc">Language games require external criteria. AI cannot verify its own meaning.</p>
|
|
</div>
|
|
<div class="bg-gray-50 rounded-lg p-4">
|
|
<p class="font-semibold text-gray-900 text-sm" data-i18n="guardian.foundation2_name">Isaiah Berlin</p>
|
|
<p class="text-gray-600 text-sm" data-i18n="guardian.foundation2_desc">Value pluralism. No single optimisation function captures what communities value.</p>
|
|
</div>
|
|
<div class="bg-gray-50 rounded-lg p-4">
|
|
<p class="font-semibold text-gray-900 text-sm" data-i18n="guardian.foundation3_name">Elinor Ostrom</p>
|
|
<p class="text-gray-600 text-sm" data-i18n="guardian.foundation3_desc">Polycentric governance. Communities govern their own commons effectively.</p>
|
|
</div>
|
|
<div class="bg-gray-50 rounded-lg p-4">
|
|
<p class="font-semibold text-gray-900 text-sm" data-i18n="guardian.foundation4_name">Te Ao Māori</p>
|
|
<p class="text-gray-600 text-sm" data-i18n="guardian.foundation4_desc">Kaitiakitanga. Guardianship implies obligation to the governed, not authority over them.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-center">
|
|
<a href="/blog-post.html?slug=guardian-agents-philosophy-of-ai-accountability" class="inline-block bg-teal-600 text-white px-6 py-3 rounded-lg font-semibold hover:bg-teal-700 transition text-sm" data-i18n="guardian.cta_paper">
|
|
Read the Research Paper
|
|
</a>
|
|
<a href="/village-ai.html#guardian-agents" class="inline-block ml-3 text-teal-700 font-semibold hover:text-teal-900 transition text-sm" data-i18n="guardian.cta_production">
|
|
See Production Architecture
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Five Principles Section -->
|
|
<section id="five-principles" class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
|
<div class="text-center mb-12">
|
|
<h2 class="text-4xl font-bold text-gray-900 mb-4" data-i18n="principles.heading">Five Architectural Principles</h2>
|
|
<p class="text-xl text-gray-600 max-w-3xl mx-auto" data-i18n-html="principles.subtitle">
|
|
Adapted from Christopher Alexander's work on living systems. These are <strong>design criteria</strong> enforced architecturally, not documentation.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Principle 1 -->
|
|
<div class="mb-10">
|
|
<div class="flex items-start mb-4">
|
|
<div class="flex-shrink-0 w-12 h-12 bg-gradient-to-br from-emerald-500 to-emerald-600 rounded-xl flex items-center justify-center text-white text-lg font-bold mr-4">1</div>
|
|
<div>
|
|
<h3 class="text-2xl font-bold text-gray-900" data-i18n="principles.p1_title">Not-Separateness</h3>
|
|
<p class="text-emerald-700 italic" data-i18n="principles.p1_principle">Governance in the critical path, not bolted on</p>
|
|
</div>
|
|
</div>
|
|
<p class="text-gray-700 ml-16" data-i18n-html="principles.p1_desc">
|
|
Every action passes through validation <strong>before</strong> executing. This is architectural enforcement — governance services intercept in the critical execution path, not as after-the-fact monitoring. Bypass requires explicit override flags, and every override is logged.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Principle 2 -->
|
|
<div class="mb-10">
|
|
<div class="flex items-start mb-4">
|
|
<div class="flex-shrink-0 w-12 h-12 bg-gradient-to-br from-indigo-500 to-indigo-600 rounded-xl flex items-center justify-center text-white text-lg font-bold mr-4">2</div>
|
|
<div>
|
|
<h3 class="text-2xl font-bold text-gray-900" data-i18n="principles.p2_title">Deep Interlock</h3>
|
|
<p class="text-indigo-700 italic" data-i18n="principles.p2_principle">Services reinforce each other</p>
|
|
</div>
|
|
</div>
|
|
<p class="text-gray-700 ml-16" data-i18n-html="principles.p2_desc">
|
|
Governance services coordinate through mutual validation. High context pressure intensifies boundary checking. Instruction persistence affects cross-reference validation. Compromising one service does not compromise governance — an attacker would need to circumvent <strong>multiple coordinated services simultaneously</strong>.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Principle 3 -->
|
|
<div class="mb-10">
|
|
<div class="flex items-start mb-4">
|
|
<div class="flex-shrink-0 w-12 h-12 bg-gradient-to-br from-amber-500 to-amber-600 rounded-xl flex items-center justify-center text-white text-lg font-bold mr-4">3</div>
|
|
<div>
|
|
<h3 class="text-2xl font-bold text-gray-900" data-i18n="principles.p3_title">Gradients Not Binary</h3>
|
|
<p class="text-amber-700 italic" data-i18n="principles.p3_principle">Intensity levels, not yes/no switches</p>
|
|
</div>
|
|
</div>
|
|
<p class="text-gray-700 ml-16" data-i18n="principles.p3_desc">
|
|
Governance operates on gradients: NORMAL, ELEVATED, HIGH, CRITICAL. Context pressure, security impact, and validation rigor all scale with intensity. Graduated response prevents both alert fatigue and catastrophic failures. Living systems adapt gradually; mechanical systems snap.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Principle 4 -->
|
|
<div class="mb-10">
|
|
<div class="flex items-start mb-4">
|
|
<div class="flex-shrink-0 w-12 h-12 bg-gradient-to-br from-purple-500 to-purple-600 rounded-xl flex items-center justify-center text-white text-lg font-bold mr-4">4</div>
|
|
<div>
|
|
<h3 class="text-2xl font-bold text-gray-900" data-i18n="principles.p4_title">Structure-Preserving</h3>
|
|
<p class="text-purple-700 italic" data-i18n="principles.p4_principle">Changes enhance without breaking</p>
|
|
</div>
|
|
</div>
|
|
<p class="text-gray-700 ml-16" data-i18n-html="principles.p4_desc">
|
|
Framework changes must preserve wholeness. Audit logs remain interpretable across versions. Historical decisions stay valid. New capabilities are added without invalidating existing governance records. <strong>Regulatory advantage:</strong> stable audit trails without re-interpreting old decisions every version.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Principle 5 -->
|
|
<div class="mb-10">
|
|
<div class="flex items-start mb-4">
|
|
<div class="flex-shrink-0 w-12 h-12 bg-gradient-to-br from-rose-500 to-rose-600 rounded-xl flex items-center justify-center text-white text-lg font-bold mr-4">5</div>
|
|
<div>
|
|
<h3 class="text-2xl font-bold text-gray-900" data-i18n="principles.p5_title">Living Process</h3>
|
|
<p class="text-rose-700 italic" data-i18n="principles.p5_principle">Grows from real failures, not theory</p>
|
|
</div>
|
|
</div>
|
|
<p class="text-gray-700 ml-16" data-i18n="principles.p5_desc">
|
|
Framework changes emerge from observed reality, not predetermined plans. When services went unused, fade detection was added. When verification created noise, selective mode evolved from real trigger patterns. Evidence drives evolution, not guesswork.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- How They Work Together -->
|
|
<div class="bg-gradient-to-r from-blue-50 to-purple-50 rounded-xl p-8 border border-blue-200">
|
|
<h3 class="text-2xl font-bold text-gray-900 mb-4 text-center" data-i18n="principles.together_title">How the Five Principles Work Together</h3>
|
|
<div class="max-w-2xl mx-auto">
|
|
<div class="bg-white rounded-lg p-6 font-mono text-sm text-gray-700 text-center">
|
|
<p data-i18n="principles.flow_1">Not-Separateness (governance in critical path)</p>
|
|
<p class="text-blue-600">↓ requires</p>
|
|
<p data-i18n="principles.flow_2">Deep Interlock (services coordinate)</p>
|
|
<p class="text-blue-600">↓ enables</p>
|
|
<p data-i18n="principles.flow_3">Gradients (nuanced responses)</p>
|
|
<p class="text-blue-600">↓ guided by</p>
|
|
<p data-i18n="principles.flow_4">Living Process (evidence-based evolution)</p>
|
|
<p class="text-blue-600">↓ constrained by</p>
|
|
<p data-i18n="principles.flow_5">Structure-Preserving (audit continuity)</p>
|
|
<p class="text-blue-600 mt-2">↓</p>
|
|
<p class="font-bold" data-i18n="principles.flow_result">System Wholeness</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Architecture Diagram -->
|
|
<section id="architecture-diagram" class="bg-white py-16">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center mb-8">
|
|
<h2 class="text-4xl font-bold text-gray-900 mb-4" data-i18n="diagram.title">Runtime-Agnostic Architecture</h2>
|
|
<p class="text-xl text-gray-600 max-w-3xl mx-auto" data-i18n-html="diagram.subtitle">
|
|
Tractatus works with <strong>any agentic AI system</strong>. The governance layer sits between your agent and its actions.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="bg-gray-50 rounded-xl p-8 border border-gray-300">
|
|
<img
|
|
src="/images/architecture-diagram-generic.svg"
|
|
alt="Tractatus Runtime-Agnostic Architecture Diagram showing Agent Runtime Layer, Tractatus Governance Layer with six services, Persistent Storage Layer, and Human Approval Workflows"
|
|
class="w-full"
|
|
loading="lazy"
|
|
/>
|
|
</div>
|
|
|
|
<div class="mt-8 grid grid-cols-1 md:grid-cols-3 gap-6">
|
|
<div class="bg-blue-50 rounded-lg p-6 border border-blue-200">
|
|
<h3 class="text-lg font-bold text-blue-900 mb-2" data-i18n="diagram.layer1_title">1. Agent Runtime</h3>
|
|
<p class="text-blue-800 text-sm" data-i18n="diagram.layer1_desc">Your AI agent (any platform). Planning, reasoning, tool use. Tractatus is agnostic to implementation.</p>
|
|
</div>
|
|
<div class="bg-green-50 rounded-lg p-6 border border-green-200">
|
|
<h3 class="text-lg font-bold text-green-900 mb-2" data-i18n="diagram.layer2_title">2. Governance Layer</h3>
|
|
<p class="text-green-800 text-sm" data-i18n-html="diagram.layer2_desc">Six services enforce boundaries, validate actions, monitor pressure. Guardian Agents verify every response. <strong>Architecturally harder for AI to bypass.</strong></p>
|
|
</div>
|
|
<div class="bg-yellow-50 rounded-lg p-6 border border-yellow-200">
|
|
<h3 class="text-lg font-bold text-yellow-900 mb-2" data-i18n="diagram.layer3_title">3. Persistent Storage</h3>
|
|
<p class="text-yellow-800 text-sm" data-i18n="diagram.layer3_desc">Immutable audit logs, governance rules, instruction history. Independent of AI runtime — cannot be altered by prompts.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Limitations and Reality Check -->
|
|
<section class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
|
<div class="bg-amber-50 border-l-4 border-amber-500 p-8 rounded-r-lg">
|
|
<h2 class="text-3xl font-bold text-amber-900 mb-6" data-i18n="limitations.heading">Limitations and Reality Check</h2>
|
|
|
|
<div class="space-y-4 text-amber-800">
|
|
<p class="text-lg" data-i18n-html="limitations.intro">
|
|
<strong>This is early-stage work.</strong> Promising results in production, but Tractatus has not been subjected to rigorous adversarial testing or red-team evaluation.
|
|
</p>
|
|
|
|
<div class="bg-white rounded-lg p-6 my-6 border border-amber-200">
|
|
<p class="text-gray-700 italic text-lg mb-2" data-i18n="limitations.quote">We have real promise but this is still in early development stage. We have a long way to go and it will require a mammoth effort by developers in every part of the industry to tame AI effectively. This is just a start.</p>
|
|
<p class="text-gray-600 text-sm" data-i18n="limitations.quote_attribution">Project Lead, Tractatus Framework</p>
|
|
</div>
|
|
|
|
<h3 class="text-xl font-bold text-amber-900 mt-6 mb-3" data-i18n="limitations.known_heading">Known Limitations:</h3>
|
|
<ul class="space-y-2 ml-6">
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span data-i18n-html="limitations.limitation1"><strong>No dedicated red-team testing.</strong> We don't know how well these boundaries hold up against determined adversarial attacks.</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span data-i18n-html="limitations.limitation2"><strong>Small-scale validation.</strong> Production use on a single project. Needs multi-organisation replication.</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span data-i18n-html="limitations.limitation3"><strong>Integration challenges.</strong> Retrofitting governance into existing systems requires significant engineering effort.</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span data-i18n-html="limitations.limitation4"><strong>Performance at scale unknown.</strong> Multi-agent coordination untested.</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span data-i18n-html="limitations.limitation5"><strong>Evolving threat landscape.</strong> As AI capabilities grow, new failure modes will emerge that current architecture may not address.</span>
|
|
</li>
|
|
</ul>
|
|
|
|
<h3 class="text-xl font-bold text-amber-900 mt-6 mb-3" data-i18n="limitations.needs_heading">What We Need:</h3>
|
|
<ul class="space-y-2 ml-6">
|
|
<li class="flex items-start"><span class="mr-2">•</span><span data-i18n="limitations.need1">Independent researchers to validate (or refute) our findings</span></li>
|
|
<li class="flex items-start"><span class="mr-2">•</span><span data-i18n="limitations.need2">Red-team evaluation to find weaknesses and bypass techniques</span></li>
|
|
<li class="flex items-start"><span class="mr-2">•</span><span data-i18n="limitations.need3">Multi-organisation pilot deployments across different domains</span></li>
|
|
<li class="flex items-start"><span class="mr-2">•</span><span data-i18n="limitations.need4">Industry-wide collaboration on governance standards</span></li>
|
|
</ul>
|
|
|
|
<p class="text-lg mt-6 font-semibold" data-i18n="limitations.conclusion">This framework is a starting point, not a finished solution. Taming AI will require sustained effort from the entire industry.</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CTA Section -->
|
|
<section class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
|
<div class="bg-gradient-to-r from-blue-600 to-purple-600 rounded-2xl p-12 text-center text-white">
|
|
<h2 class="text-4xl font-bold mb-4" data-i18n="cta.heading">Explore the Architecture</h2>
|
|
<p class="text-xl mb-8 opacity-90 max-w-3xl mx-auto" data-i18n="cta.subtitle">From Guardian Agents in production to the five principles drawn from living systems.</p>
|
|
<div class="flex flex-col sm:flex-row justify-center gap-4">
|
|
<a href="/village-ai.html" class="inline-block bg-white text-blue-600 px-8 py-3 rounded-lg font-semibold hover:bg-gray-100 transition" data-i18n="cta.btn_village">Village AI</a>
|
|
<a href="/researcher.html" class="inline-block bg-blue-700 text-white px-8 py-3 rounded-lg font-semibold hover:bg-blue-800 transition border-2 border-white" data-i18n="cta.btn_research">View Research</a>
|
|
<a href="/docs.html" class="inline-block bg-purple-700 text-white px-8 py-3 rounded-lg font-semibold hover:bg-purple-800 transition border-2 border-white" data-i18n="cta.btn_docs">Documentation</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
</main>
|
|
|
|
<!-- Internationalization -->
|
|
<script src="/js/i18n-simple.js?v=0.1.2.1774503360480" defer></script>
|
|
<script src="/js/components/language-selector.js?v=0.1.2.1774503360480" defer></script>
|
|
|
|
<!-- Scroll Animations -->
|
|
<script src="/js/scroll-animations.js?v=0.1.2.1774503360480"></script>
|
|
<!-- Page Transitions -->
|
|
<script src="/js/page-transitions.js?v=0.1.2.1774503360480"></script>
|
|
|
|
<!-- Footer Component -->
|
|
<script src="/js/components/footer.js?v=0.1.2.1774503360480"></script>
|
|
|
|
</body>
|
|
</html>
|