feat: add compliance modules 2-5 (dashboard, security templates, process manager, evidence collector)

Module 2: Extended Compliance Dashboard with roadmap, module-status, next-actions, snapshots, score-history
Module 3: 7 German security document templates (IT-Sicherheitskonzept, Datenschutz, Backup, Logging, Incident-Response, Zugriff, Risikomanagement)
Module 4: Compliance Process Manager with CRUD, complete/skip/seed, ~50 seed tasks, 3-tab UI
Module 5: Evidence Collector Extended with automated checks, control-mapping, coverage report, 4-tab UI

Also includes: canonical control library enhancements (verification method, categories, dedup), control generator improvements, RAG client extensions

52 tests pass, frontend builds clean.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

admin-compliance/app/sdk/control-library/components/ControlDetail.tsx

@@ -8,7 +8,7 @@ import {
 } from 'lucide-react'
 import {
   CanonicalControl, EFFORT_LABELS, BACKEND_URL,
-  SeverityBadge, StateBadge, LicenseRuleBadge, VerificationMethodBadge, CategoryBadge,
+  SeverityBadge, StateBadge, LicenseRuleBadge, VerificationMethodBadge, CategoryBadge, TargetAudienceBadge,
   VERIFICATION_METHODS, CATEGORY_OPTIONS,
 } from './helpers'
 
@@ -124,6 +124,7 @@ export function ControlDetail({
               <LicenseRuleBadge rule={ctrl.license_rule} />
               <VerificationMethodBadge method={ctrl.verification_method} />
               <CategoryBadge category={ctrl.category} />
+              <TargetAudienceBadge audience={ctrl.target_audience} />
             </div>
             <h2 className="text-lg font-semibold text-gray-900 mt-1">{ctrl.title}</h2>
           </div>
@@ -163,22 +164,46 @@ export function ControlDetail({
           <p className="text-sm text-gray-700 leading-relaxed">{ctrl.rationale}</p>
         </section>
 
-        {/* Source Info (Rule 1 + 2) */}
+        {/* Gesetzliche Grundlage (Rule 1 + 2) */}
         {ctrl.source_citation && (
           <section className="bg-blue-50 border border-blue-200 rounded-lg p-4">
-            <div className="flex items-center gap-2 mb-2">
+            <div className="flex items-center gap-2 mb-3">
               <Scale className="w-4 h-4 text-blue-600" />
-              <h3 className="text-sm font-semibold text-blue-900">Quellenangabe</h3>
+              <h3 className="text-sm font-semibold text-blue-900">Gesetzliche Grundlage</h3>
+              {ctrl.license_rule === 1 && (
+                <span className="text-xs bg-blue-100 text-blue-700 px-2 py-0.5 rounded-full">Direkte gesetzliche Pflicht</span>
+              )}
+              {ctrl.license_rule === 2 && (
+                <span className="text-xs bg-teal-100 text-teal-700 px-2 py-0.5 rounded-full">Standard mit Zitationspflicht</span>
+              )}
             </div>
-            <div className="text-xs text-blue-700 space-y-1">
-              {Object.entries(ctrl.source_citation).map(([k, v]) => (
-                <p key={k}><span className="font-medium">{k}:</span> {v}</p>
-              ))}
+            <div className="flex items-start gap-3">
+              <div className="flex-1">
+                {ctrl.source_citation.source && (
+                  <p className="text-sm font-medium text-blue-900 mb-1">{ctrl.source_citation.source}</p>
+                )}
+                {ctrl.source_citation.license && (
+                  <p className="text-xs text-blue-600">Lizenz: {ctrl.source_citation.license}</p>
+                )}
+                {ctrl.source_citation.license_notice && (
+                  <p className="text-xs text-blue-600 mt-0.5">{ctrl.source_citation.license_notice}</p>
+                )}
+              </div>
+              {ctrl.source_citation.url && (
+                <a
+                  href={ctrl.source_citation.url}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="flex items-center gap-1 text-xs text-blue-600 hover:text-blue-800 whitespace-nowrap"
+                >
+                  <ExternalLink className="w-3.5 h-3.5" />Quelle
+                </a>
+              )}
             </div>
             {ctrl.source_original_text && (
               <details className="mt-3">
                 <summary className="text-xs text-blue-600 cursor-pointer hover:text-blue-800">Originaltext anzeigen</summary>
-                <p className="text-xs text-gray-600 mt-2 p-2 bg-white rounded border border-blue-100 leading-relaxed max-h-40 overflow-y-auto">
+                <p className="text-xs text-gray-600 mt-2 p-2 bg-white rounded border border-blue-100 leading-relaxed max-h-40 overflow-y-auto whitespace-pre-wrap">
                   {ctrl.source_original_text}
                 </p>
               </details>
@@ -186,6 +211,19 @@ export function ControlDetail({
           </section>
         )}
 
+        {/* Impliziter Gesetzesbezug (Rule 3 — kein Originaltext, aber ggf. Gesetzesbezug ueber Anchors) */}
+        {!ctrl.source_citation && ctrl.open_anchors.length > 0 && (
+          <section className="bg-amber-50 border border-amber-200 rounded-lg p-3">
+            <div className="flex items-center gap-2">
+              <Scale className="w-4 h-4 text-amber-600" />
+              <p className="text-xs text-amber-700">
+                Dieser Control setzt implizit gesetzliche Anforderungen um (z.B. DSGVO Art. 32, NIS2 Art. 21).
+                Die konkreten Massnahmen leiten sich aus den Open-Source-Referenzen unten ab.
+              </p>
+            </div>
+          </section>
+        )}
+
         {/* Scope */}
         {(ctrl.scope.platforms?.length || ctrl.scope.components?.length || ctrl.scope.data_classes?.length) ? (
           <section>

admin-compliance/app/sdk/control-library/components/ControlForm.tsx

@@ -2,7 +2,7 @@
 
 import { useState } from 'react'
 import { BookOpen, Trash2, Save, X } from 'lucide-react'
-import { EMPTY_CONTROL, VERIFICATION_METHODS, CATEGORY_OPTIONS } from './helpers'
+import { EMPTY_CONTROL, VERIFICATION_METHODS, CATEGORY_OPTIONS, TARGET_AUDIENCE_OPTIONS } from './helpers'
 
 export function ControlForm({
   initial,
@@ -268,8 +268,8 @@ export function ControlForm({
         </div>
       </div>
 
-      {/* Verification Method & Category */}
-      <div className="grid grid-cols-2 gap-4">
+      {/* Verification Method, Category & Target Audience */}
+      <div className="grid grid-cols-3 gap-4">
         <div>
           <label className="block text-xs font-medium text-gray-600 mb-1">Nachweismethode</label>
           <select
@@ -297,6 +297,20 @@ export function ControlForm({
             ))}
           </select>
         </div>
+        <div>
+          <label className="block text-xs font-medium text-gray-600 mb-1">Zielgruppe</label>
+          <select
+            value={form.target_audience || ''}
+            onChange={e => setForm({ ...form, target_audience: e.target.value || null })}
+            className="w-full px-3 py-2 text-sm border border-gray-300 rounded-lg"
+          >
+            <option value="">— Nicht zugewiesen —</option>
+            {Object.entries(TARGET_AUDIENCE_OPTIONS).map(([k, v]) => (
+              <option key={k} value={k}>{v.label}</option>
+            ))}
+          </select>
+          <p className="text-xs text-gray-400 mt-1">Fuer wen ist dieses Control relevant?</p>
+        </div>
       </div>
     </div>
   )

admin-compliance/app/sdk/control-library/components/helpers.tsx

@@ -44,6 +44,7 @@ export interface CanonicalControl {
   customer_visible?: boolean
   verification_method: string | null
   category: string | null
+  target_audience: string | null
   generation_metadata?: Record<string, unknown> | null
   created_at: string
   updated_at: string
@@ -96,6 +97,7 @@ export const EMPTY_CONTROL = {
   tags: [] as string[],
   verification_method: null as string | null,
   category: null as string | null,
+  target_audience: null as string | null,
 }
 
 export const DOMAIN_OPTIONS = [
@@ -138,6 +140,13 @@ export const CATEGORY_OPTIONS = [
   { value: 'identity', label: 'Identitaetsmanagement' },
 ]
 
+export const TARGET_AUDIENCE_OPTIONS: Record<string, { bg: string; label: string }> = {
+  enterprise: { bg: 'bg-cyan-100 text-cyan-700', label: 'Unternehmen' },
+  authority: { bg: 'bg-rose-100 text-rose-700', label: 'Behoerden' },
+  provider: { bg: 'bg-violet-100 text-violet-700', label: 'Anbieter' },
+  all: { bg: 'bg-gray-100 text-gray-700', label: 'Alle' },
+}
+
 export const COLLECTION_OPTIONS = [
   { value: 'bp_compliance_ce', label: 'CE (OWASP, ENISA, BSI)' },
   { value: 'bp_compliance_gesetze', label: 'Gesetze (EU, DE, BSI)' },
@@ -213,6 +222,13 @@ export function CategoryBadge({ category }: { category: string | null }) {
   )
 }
 
+export function TargetAudienceBadge({ audience }: { audience: string | null }) {
+  if (!audience) return null
+  const config = TARGET_AUDIENCE_OPTIONS[audience]
+  if (!config) return null
+  return <span className={`inline-flex items-center px-2 py-0.5 rounded text-xs font-medium ${config.bg}`}>{config.label}</span>
+}
+
 export function getDomain(controlId: string): string {
   return controlId.split('-')[0] || ''
 }