kurt-compliance-auditor/www/index.html
Qognio Bot Extract e679eedcc6 init: extract kurt-compliance-auditor from qognio-bot-widget-template@d2c816f
Source files (src/) and rendered bundle (www/) extracted on 2026-04-29T01:35:47+02:00.
Adds nginx:alpine Dockerfile + docker-compose.yml (Caddy-labels) so the bot
runs stand-alone or as a per-customer template clone.

Parent monorepo commit: d2c816f3edbc9760802a11b29ff4151c7aad4b46
Bot version: 2026-04-25
2026-04-29 01:35:47 +02:00

125 lines
6.1 KiB
HTML

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<title>KURT · Dein DSGVO+AI-Act Kombi-Auditor</title>
<meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover">
<meta name="theme-color" content="#0a0a0f">
<meta name="description" content="KURT — der integrierte Compliance-Auditor für DSGVO + EU AI Act. Crosswalk DSFA ↔ RMS, Art. 22 ↔ AI-Act Art. 13/14. Im deutschen Bunker.">
<link rel="stylesheet" href="styles.css">
<script>window.__KURT_KEY__ = 'qb_ea1d0b1e8bbe';</script>
</head>
<body>
<div class="app" role="application" aria-label="KURT DSGVO+AI-Act Kombi-Auditor">
<header class="topbar">
<div class="brand">
<span class="brand-icon" aria-hidden="true">K</span>
<span>KURT <small>Kombi-Auditor</small></span>
</div>
<div class="spacer"></div>
<span class="status" role="status" aria-live="polite">Online</span>
</header>
<nav class="tabbar" role="tablist" aria-label="Modi">
<button class="tab" role="tab" aria-selected="true" aria-controls="view-chat" data-mode="chat">
Chat
<span class="tab-kbd">⌃1</span>
</button>
<button class="tab" role="tab" aria-selected="false" aria-controls="view-quiz" data-mode="quiz">
Quiz
<span class="tab-kbd">⌃2</span>
</button>
<button class="tab" role="tab" aria-selected="false" aria-controls="view-flash" data-mode="flash">
Karten
<span class="tab-kbd">⌃3</span>
</button>
<button class="tab" role="tab" aria-selected="false" aria-controls="view-progress" data-mode="progress">
Fortschritt
<span class="tab-kbd">⌃4</span>
</button>
<button class="tab" role="tab" aria-selected="false" aria-controls="view-curriculum" data-mode="curriculum">
Module
<span class="tab-kbd">⌃5</span>
</button>
</nav>
<main class="main">
<!-- CHAT -->
<section id="view-chat" class="view" role="tabpanel" aria-labelledby="tab-chat" data-active="true">
<div id="welcome-screen" class="welcome hidden" aria-hidden="true">
<h2>Hi, ich bin KURT.</h2>
<p>Ich nehm dir die Doppelarbeit zwischen <strong>DSGVO</strong> und <strong>EU AI Act</strong> ab — Crosswalk statt Excel-Hölle. Beide Regimes parallel, ohne dass du dieselbe Risiko-Bewertung zweimal schreibst. Sag mir: was treibt dich gerade — DSFA-Update, AI-System-Klassifikation, Audit-Vorbereitung? Erstmal die grobe Lage, dann gehen wir tief.</p>
<div class="mode-grid">
<button class="mode-card" data-goto="chat">
<strong>Chat</strong>
<span>Frag mich alles zu DSGVO + AI Act Schnittstellen.</span>
</button>
<button class="mode-card" data-goto="quiz">
<strong>Quiz</strong>
<span>Audit-Szenarien aus dem Compliance-Alltag, mit XP.</span>
</button>
<button class="mode-card" data-goto="flash">
<strong>Flashcards</strong>
<span>Artikel, Crosswalks, Risiko-Klassen — mit Spaced-Repetition.</span>
</button>
<button class="mode-card" data-goto="progress">
<strong>Fortschritt</strong>
<span>XP, Streaks, Badges, Level.</span>
</button>
<button class="mode-card" data-goto="curriculum">
<strong>Module</strong>
<span>5 Curricula / 25 Module: Integration · DSGVO-Essenz · AI-Act-Essenz · Hotspots · Risikoregister.</span>
</button>
<button class="mode-card" data-prompt="AUDIT_REQUEST: Mein KI-System ist [Use-Case]. Klassifiziere DSGVO + AI-Act + erforderliche Artefakte.">
<strong>Audit-Klassifikation</strong>
<span><code>AUDIT_REQUEST</code> + Use-Case → DSGVO + AI-Act-Klassifikation mit Artefakt-Liste als Karte.</span>
</button>
</div>
<p style="font-size:.82rem;color:var(--text-mute)">Drei Sätze: Klassifizier dein AI-System (DSGVO + AI Act parallel) → Lass dir Crosswalk-Mapping erklären → Verstehe wo Doppelarbeit vermeidbar ist. KURT ist der Brückenbauer — DSGVO-tief? Ruf Cora. AI-Act-Audit-Tiefe? Ruf VESTIGIA.</p>
</div>
<div id="chat-box" class="chat-box" aria-live="polite" aria-label="Gespräch"></div>
</section>
<!-- QUIZ -->
<section id="view-quiz" class="view" role="tabpanel" aria-labelledby="tab-quiz">
<div id="quiz-host"></div>
</section>
<!-- FLASHCARDS -->
<section id="view-flash" class="view" role="tabpanel" aria-labelledby="tab-flash">
<div id="flash-host"></div>
</section>
<!-- PROGRESS -->
<section id="view-progress" class="view" role="tabpanel" aria-labelledby="tab-progress">
<div id="progress-host"></div>
</section>
<!-- CURRICULUM -->
<section id="view-curriculum" class="view" role="tabpanel" aria-labelledby="tab-curr">
<div id="curr-host"></div>
</section>
</main>
<form id="composer-form" class="composer" aria-label="Nachricht verfassen">
<div id="attach-strip" class="attach-strip" aria-live="polite"></div>
<div class="composer-row">
<button type="button" class="btn-attach" id="composer-attach" aria-label="Datei anhängen" title="Datei anhängen (PDF, Bild, Text — max 5 Dateien, 8 MB)">📎</button>
<input type="file" id="composer-file" multiple accept=".pdf,.txt,.md,.csv,.json,.xml,.yaml,.yml,.log,.png,.jpg,.jpeg,.webp,.gif" hidden>
<textarea id="composer" rows="1" placeholder="Frag KURT — Enter zum Senden, Shift+Enter für Zeilenumbruch" aria-label="Nachricht"></textarea>
<button type="submit" class="btn-primary" id="composer-send">Senden</button>
</div>
</form>
<footer class="footer">
Sovereign AI · Deutscher Bunker · <a href="https://qognio.com">Qognio</a> &nbsp;·&nbsp; DSGVO-konform · Keine externen Fonts · Keine Cookies
</footer>
</div>
<div id="toast-stack" class="toast-stack" aria-live="polite"></div>
<script src="app.js"></script>
</body>
</html>