a5b8f90e88
- Remove inline styles from category rendering (CSP violation) - Apply collapsed state via JavaScript after DOM insertion - Update cache version to v=0.1.0.1760254264664 across all HTML files - Categories now properly collapsed on page load (Research, Advanced, Case Studies, Business, Archives)
393 lines
20 KiB
HTML
393 lines
20 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>For Researchers | Tractatus AI Safety Framework</title>
|
|
<meta name="description" content="Tractatus framework research: architectural constraints, theoretical foundations, and empirical validation of AI safety through structural guarantees.">
|
|
<link rel="stylesheet" href="/css/tailwind.css?v=0.1.0.1760254264664">
|
|
<style>
|
|
/* Accessibility: Skip link */
|
|
.skip-link { position: absolute; left: -9999px; top: 0; }
|
|
.skip-link:focus { left: 0; z-index: 100; background: white; padding: 1rem; border: 2px solid #3b82f6; }
|
|
|
|
/* Accessibility: Focus indicators (WCAG 2.4.7) */
|
|
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) -->
|
|
<script src="/js/components/navbar.js?v=0.1.0.1760254264664"></script>
|
|
|
|
<!-- Hero Section -->
|
|
<div class="bg-gradient-to-br from-purple-50 to-blue-50 py-20">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="text-center">
|
|
<h1 class="text-5xl font-bold text-gray-900 mb-6">
|
|
AI Safety Through<br>Architectural Constraints
|
|
</h1>
|
|
<p class="text-xl text-gray-600 max-w-3xl mx-auto mb-8">
|
|
Exploring the theoretical foundations and empirical validation of structural AI safety—preserving human agency through formal guarantees, not aspirational goals.
|
|
</p>
|
|
<div class="flex justify-center space-x-4">
|
|
<a href="/docs.html" class="bg-purple-600 text-white px-6 py-3 rounded-lg font-semibold hover:bg-purple-700 transition">
|
|
Browse Documentation
|
|
</a>
|
|
<a href="#case-studies" class="bg-white text-purple-600 px-6 py-3 rounded-lg font-semibold border-2 border-purple-600 hover:bg-purple-50 transition">
|
|
View Case Studies
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Research Focus Areas -->
|
|
<div id="main-content" class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-12 text-center">Research Focus Areas</h2>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
|
<!-- Theoretical Foundations -->
|
|
<div class="bg-white rounded-lg shadow-lg p-8">
|
|
<div class="w-12 h-12 bg-purple-100 rounded-lg flex items-center justify-center mb-4">
|
|
<svg aria-hidden="true" class="w-6 h-6 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-bold text-gray-900 mb-3">Theoretical Foundations</h3>
|
|
<p class="text-gray-600 mb-4">
|
|
Formal specification of the Tractatus boundary: where systematization ends and human judgment begins. Rooted in Wittgenstein's linguistic philosophy.
|
|
</p>
|
|
<ul class="space-y-2 text-sm text-gray-600">
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>Boundary delineation principles</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>Values irreducibility proofs</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>Agency preservation guarantees</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Architectural Analysis -->
|
|
<div class="bg-white rounded-lg shadow-lg p-8">
|
|
<div class="w-12 h-12 bg-blue-100 rounded-lg flex items-center justify-center mb-4">
|
|
<svg aria-hidden="true" class="w-6 h-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"/>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-bold text-gray-900 mb-3">Architectural Analysis</h3>
|
|
<p class="text-gray-600 mb-4">
|
|
Six-component framework architecture: classification, validation, boundary enforcement, pressure monitoring, metacognitive verification, pluralistic deliberation.
|
|
</p>
|
|
<ul class="space-y-2 text-sm text-gray-600">
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>InstructionPersistenceClassifier</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>CrossReferenceValidator</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>BoundaryEnforcer</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>ContextPressureMonitor</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>MetacognitiveVerifier</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>PluralisticDeliberationOrchestrator</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Empirical Validation -->
|
|
<div class="bg-white rounded-lg shadow-lg p-8">
|
|
<div class="w-12 h-12 bg-green-100 rounded-lg flex items-center justify-center mb-4">
|
|
<svg aria-hidden="true" class="w-6 h-6 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"/>
|
|
</svg>
|
|
</div>
|
|
<h3 class="text-xl font-bold text-gray-900 mb-3">Empirical Validation</h3>
|
|
<p class="text-gray-600 mb-4">
|
|
Real-world failure case analysis and prevention validation. Documented incidents where traditional AI safety approaches failed.
|
|
</p>
|
|
<ul class="space-y-2 text-sm text-gray-600">
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>The 27027 Incident (pattern recognition bias override)</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>Privacy creep detection</span>
|
|
</li>
|
|
<li class="flex items-start">
|
|
<span class="mr-2">•</span>
|
|
<span>Silent degradation prevention</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Interactive Demonstrations -->
|
|
<div class="bg-white py-16">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-12 text-center">Interactive Demonstrations</h2>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
|
<a href="/demos/classification-demo.html" class="block bg-gray-50 rounded-lg p-6 hover:shadow-lg transition group">
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-2 group-hover:text-purple-600">Classification Demo</h3>
|
|
<p class="text-gray-600 mb-4">
|
|
Explore how the InstructionPersistenceClassifier categorizes instructions across five quadrants with persistence levels.
|
|
</p>
|
|
<div class="text-purple-600 font-medium">Try the demo →</div>
|
|
</a>
|
|
|
|
<a href="/demos/27027-demo.html" class="block bg-gray-50 rounded-lg p-6 hover:shadow-lg transition group">
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-2 group-hover:text-purple-600">27027 Incident Analysis</h3>
|
|
<p class="text-gray-600 mb-4">
|
|
Step through a real failure case where AI contradicted explicit instructions, and see how Tractatus prevents it.
|
|
</p>
|
|
<div class="text-purple-600 font-medium">View timeline →</div>
|
|
</a>
|
|
|
|
<a href="/demos/boundary-demo.html" class="block bg-gray-50 rounded-lg p-6 hover:shadow-lg transition group">
|
|
<h3 class="text-lg font-semibold text-gray-900 mb-2 group-hover:text-purple-600">Boundary Simulator</h3>
|
|
<p class="text-gray-600 mb-4">
|
|
Test decisions against the Tractatus boundary to see which can be automated and which require human judgment.
|
|
</p>
|
|
<div class="text-purple-600 font-medium">Run scenarios →</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Case Studies -->
|
|
<div id="case-studies" class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-12 text-center">Documented Failure Cases</h2>
|
|
|
|
<div class="space-y-6">
|
|
<div class="bg-white rounded-lg shadow-md p-6 border-l-4 border-red-500">
|
|
<div class="flex items-start justify-between">
|
|
<div>
|
|
<h3 class="text-xl font-bold text-gray-900 mb-2">The 27027 Incident</h3>
|
|
<p class="text-gray-600 mb-3">
|
|
User instructed "Check port 27027" but AI immediately used 27017 instead—pattern recognition bias overrode explicit instruction. Not forgetting; immediate autocorrection by training patterns. <strong>Prevented by InstructionPersistenceClassifier + CrossReferenceValidator.</strong>
|
|
</p>
|
|
<div class="flex space-x-4 text-sm">
|
|
<span class="text-gray-500">Failure Type: Pattern Recognition Bias</span>
|
|
<span class="text-gray-500">Prevention: Explicit instruction storage + validation</span>
|
|
</div>
|
|
</div>
|
|
<a href="/demos/27027-demo.html" class="text-purple-600 hover:text-purple-700 font-medium">Interactive demo →</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="bg-white rounded-lg shadow-md p-6 border-l-4 border-orange-500">
|
|
<div class="flex items-start justify-between">
|
|
<div>
|
|
<h3 class="text-xl font-bold text-gray-900 mb-2">Privacy Creep Detection</h3>
|
|
<p class="text-gray-600 mb-3">
|
|
AI suggested analytics that violated privacy-first principle. Gradual values drift over 40-message conversation. <strong>Prevented by BoundaryEnforcer.</strong>
|
|
</p>
|
|
<div class="flex space-x-4 text-sm">
|
|
<span class="text-gray-500">Failure Type: Values Drift</span>
|
|
<span class="text-gray-500">Prevention: STRATEGIC boundary check</span>
|
|
</div>
|
|
</div>
|
|
<a href="/downloads/case-studies-real-world-llm-failure-modes.pdf" target="_blank" rel="noopener noreferrer" class="text-purple-600 hover:text-purple-700 font-medium inline-flex items-center gap-1">
|
|
See case studies doc
|
|
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
|
|
</svg>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="bg-white rounded-lg shadow-md p-6 border-l-4 border-yellow-500">
|
|
<div class="flex items-start justify-between">
|
|
<div>
|
|
<h3 class="text-xl font-bold text-gray-900 mb-2">Silent Quality Degradation</h3>
|
|
<p class="text-gray-600 mb-3">
|
|
Context pressure at 82% caused AI to skip error handling silently. No warning to user. <strong>Prevented by ContextPressureMonitor.</strong>
|
|
</p>
|
|
<div class="flex space-x-4 text-sm">
|
|
<span class="text-gray-500">Failure Type: Silent Degradation</span>
|
|
<span class="text-gray-500">Prevention: CRITICAL pressure detection</span>
|
|
</div>
|
|
</div>
|
|
<a href="/downloads/case-studies-real-world-llm-failure-modes.pdf" target="_blank" rel="noopener noreferrer" class="text-purple-600 hover:text-purple-700 font-medium inline-flex items-center gap-1">
|
|
See case studies doc
|
|
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
|
|
</svg>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Research Resources -->
|
|
<div class="bg-purple-50 py-16">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<h2 class="text-3xl font-bold text-gray-900 mb-12 text-center">Research Resources</h2>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
|
<div class="bg-white rounded-lg p-6">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-4">Research Documentation</h3>
|
|
<ul class="space-y-3">
|
|
<li class="flex items-center justify-between">
|
|
<a href="https://github.com/tractatus-framework/tractatus/blob/main/docs/BENCHMARK-SUITE-RESULTS.md"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
class="text-purple-600 hover:text-purple-700 font-medium">
|
|
→ Benchmark Suite Results (610 Tests)
|
|
</a>
|
|
<span class="text-xs bg-green-100 text-green-800 px-2 py-1 rounded-full font-medium">NEW</span>
|
|
</li>
|
|
<li class="flex items-center justify-between">
|
|
<a href="https://github.com/tractatus-framework/tractatus/blob/main/docs/GOVERNANCE-RULE-LIBRARY.md"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
class="text-purple-600 hover:text-purple-700 font-medium">
|
|
→ Governance Rule Library (10 Examples)
|
|
</a>
|
|
<span class="text-xs bg-green-100 text-green-800 px-2 py-1 rounded-full font-medium">NEW</span>
|
|
</li>
|
|
<li class="flex items-center justify-between">
|
|
<a href="/docs.html" class="text-purple-600 hover:text-purple-700 font-medium">
|
|
→ Research Foundations & Scholarly Context
|
|
</a>
|
|
<a href="/downloads/research-foundations-scholarly-review-and-context.pdf"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
class="text-purple-600 hover:text-purple-700 ml-2"
|
|
title="Download PDF">
|
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
|
|
</svg>
|
|
</a>
|
|
</li>
|
|
<li class="flex items-center justify-between">
|
|
<a href="/docs.html" class="text-purple-600 hover:text-purple-700 font-medium">
|
|
→ Case Studies: Real-World Failures
|
|
</a>
|
|
<a href="/downloads/case-studies-real-world-llm-failure-modes.pdf"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
class="text-purple-600 hover:text-purple-700 ml-2"
|
|
title="Download PDF">
|
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
|
|
</svg>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="/docs.html" class="text-purple-600 hover:text-purple-700 font-medium">
|
|
→ Framework Overview & Core Concepts
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="bg-white rounded-lg p-6">
|
|
<h3 class="text-xl font-bold text-gray-900 mb-4">Contribute to Research</h3>
|
|
<p class="text-gray-600 mb-4">
|
|
This framework is open for academic collaboration and empirical validation studies.
|
|
</p>
|
|
<ul class="space-y-2 text-sm text-gray-600 mb-4">
|
|
<li>• Submit failure cases for analysis</li>
|
|
<li>• Propose theoretical extensions</li>
|
|
<li>• Validate architectural constraints</li>
|
|
<li>• Explore boundary formalization</li>
|
|
</ul>
|
|
<a href="/case-submission.html" class="inline-block bg-purple-600 text-white px-4 py-2 rounded text-sm font-semibold hover:bg-purple-700 transition">
|
|
Submit Case Study →
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- CTA Section -->
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-16">
|
|
<div class="bg-gradient-to-r from-purple-600 to-blue-600 rounded-2xl p-12 text-center text-white">
|
|
<h2 class="text-3xl font-bold mb-4">Join the Research Community</h2>
|
|
<p class="text-xl mb-8 opacity-90">
|
|
Help advance AI safety through empirical validation and theoretical exploration.
|
|
</p>
|
|
<div class="flex justify-center space-x-4">
|
|
<a href="/docs.html" class="bg-white text-purple-600 px-8 py-3 rounded-lg font-semibold hover:bg-gray-100 transition">
|
|
Read Documentation
|
|
</a>
|
|
<a href="/implementer.html" class="bg-purple-700 text-white px-8 py-3 rounded-lg font-semibold hover:bg-purple-800 transition border-2 border-white">
|
|
Implementation Guide →
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Footer -->
|
|
<footer class="bg-gray-900 text-gray-400 py-12">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
|
|
<div>
|
|
<h3 class="text-white font-bold mb-4">Tractatus Framework</h3>
|
|
<p class="text-sm">
|
|
Preserving human agency through architectural constraints, not aspirational goals.
|
|
</p>
|
|
</div>
|
|
<div>
|
|
<h3 class="text-white font-bold mb-4">Audience Paths</h3>
|
|
<ul class="space-y-2 text-sm">
|
|
<li><a href="/researcher.html" class="hover:text-white">Researchers</a></li>
|
|
<li><a href="/implementer.html" class="hover:text-white">Implementers</a></li>
|
|
<li><a href="/leader.html" class="hover:text-white">Leaders</a></li>
|
|
</ul>
|
|
</div>
|
|
<div>
|
|
<h3 class="text-white font-bold mb-4">Resources</h3>
|
|
<ul class="space-y-2 text-sm">
|
|
<li><a href="/docs.html" class="hover:text-white">Documentation</a></li>
|
|
<li><a href="/demos/classification-demo.html" class="hover:text-white">Interactive Demos</a></li>
|
|
<li><a href="/" class="hover:text-white">Home</a></li>
|
|
</ul>
|
|
</div>
|
|
<div>
|
|
<h3 class="text-white font-bold mb-4">Community</h3>
|
|
<ul class="space-y-2 text-sm">
|
|
<li><a href="/media-inquiry.html" class="hover:text-white">Media Inquiries</a></li>
|
|
<li><a href="/case-submission.html" class="hover:text-white">Submit Case Study</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="mt-8 pt-8 border-t border-gray-800 text-center text-sm space-y-2">
|
|
<p class="text-gray-300">Safety Through Structure, Not Aspiration | Built with <a href="https://claude.ai/claude-code" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Claude Code</a></p>
|
|
<p>© 2025 Tractatus AI Safety Framework. Licensed under <a href="https://www.apache.org/licenses/LICENSE-2.0" class="text-blue-400 hover:text-blue-300 transition" target="_blank" rel="noopener">Apache License 2.0</a>.</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
</body>
|
|
</html>
|