0d6b501fde
Animated educational explainer for ages 12+ explaining: - AI Agent communication & delegation - QC double-agent principle (60% trigger, score 1-10) - Causal Dilation Clock / Eigenzeit (proper time) - Live interactive demo with flying message animations Languages: Deutsch · English · 中文 · Русский · हिन्दी index.html as language picker entry point Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
34 lines
2.2 KiB
HTML
34 lines
2.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Time Dilation in LLM Agent Systems — Explainers</title>
|
|
<style>
|
|
*{box-sizing:border-box;margin:0;padding:0}
|
|
body{font-family:'Segoe UI',system-ui,sans-serif;background:#1a1a2e;color:#fff;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;text-align:center}
|
|
h1{font-size:clamp(1.6rem,4vw,2.8rem);font-weight:900;margin-bottom:12px;line-height:1.2}
|
|
h1 span{color:#FFD93D}
|
|
p{color:#ffffffaa;font-size:16px;max-width:500px;line-height:1.6;margin-bottom:48px}
|
|
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;max-width:900px;width:100%}
|
|
a{display:flex;flex-direction:column;align-items:center;gap:10px;background:#ffffff0d;border:1px solid #ffffff20;border-radius:16px;padding:28px 20px;text-decoration:none;color:#fff;font-weight:700;font-size:15px;transition:border-color .2s,transform .15s}
|
|
a:hover{border-color:#FFD93D55;transform:translateY(-4px)}
|
|
.flag{font-size:40px}
|
|
.lang{font-size:13px;color:#ffffffaa;font-weight:400}
|
|
.paper-link{margin-top:32px;color:#FFD93D;font-size:14px;text-decoration:none;opacity:0.8}
|
|
.paper-link:hover{opacity:1}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Time Dilation in<br><span>LLM Agent Systems</span></h1>
|
|
<p>An interactive explainer for ages 12+ — how AI agents communicate, delegate, and experience time differently.</p>
|
|
<div class="grid">
|
|
<a href="explainer-de.html"><span class="flag">🇩🇪</span>Deutsch<span class="lang">German</span></a>
|
|
<a href="explainer-en.html"><span class="flag">🇬🇧</span>English<span class="lang">English</span></a>
|
|
<a href="explainer-zh.html"><span class="flag">🇨🇳</span>中文<span class="lang">Chinese</span></a>
|
|
<a href="explainer-ru.html"><span class="flag">🇷🇺</span>Русский<span class="lang">Russian</span></a>
|
|
<a href="explainer-hi.html"><span class="flag">🇮🇳</span>हिन्दी<span class="lang">Hindi</span></a>
|
|
</div>
|
|
<a class="paper-link" href="README.md">📄 Read the Research Paper →</a>
|
|
</body>
|
|
</html>
|