refactor(admin): split evidence, import, portfolio pages

Extract components and hooks from oversized pages into colocated
_components/ and _hooks/ subdirectories to enforce the 500-LOC hard cap.
page.tsx files reduced to 205, 121, and 136 LOC respectively.

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

admin-compliance/app/sdk/import/_components/GapAnalysisPreview.tsx

@@ -0,0 +1,77 @@
+'use client'
+
+import type { GapAnalysis, GapItem } from '@/lib/sdk/types'
+
+export function GapAnalysisPreview({ analysis }: { analysis: GapAnalysis }) {
+  return (
+    <div className="bg-white rounded-xl border border-gray-200 p-6">
+      <div className="flex items-center gap-3 mb-6">
+        <div className="w-12 h-12 bg-orange-100 rounded-xl flex items-center justify-center">
+          <span className="text-2xl">📊</span>
+        </div>
+        <div>
+          <h3 className="text-lg font-semibold text-gray-900">Gap-Analyse Ergebnis</h3>
+          <p className="text-sm text-gray-500">
+            {analysis.totalGaps} Luecken in {analysis.gaps.length} Kategorien gefunden
+          </p>
+        </div>
+      </div>
+
+      <div className="grid grid-cols-4 gap-4 mb-6">
+        <div className="text-center p-4 bg-red-50 rounded-xl">
+          <div className="text-3xl font-bold text-red-600">{analysis.criticalGaps}</div>
+          <div className="text-sm text-red-600 font-medium">Kritisch</div>
+        </div>
+        <div className="text-center p-4 bg-orange-50 rounded-xl">
+          <div className="text-3xl font-bold text-orange-600">{analysis.highGaps}</div>
+          <div className="text-sm text-orange-600 font-medium">Hoch</div>
+        </div>
+        <div className="text-center p-4 bg-yellow-50 rounded-xl">
+          <div className="text-3xl font-bold text-yellow-600">{analysis.mediumGaps}</div>
+          <div className="text-sm text-yellow-600 font-medium">Mittel</div>
+        </div>
+        <div className="text-center p-4 bg-green-50 rounded-xl">
+          <div className="text-3xl font-bold text-green-600">{analysis.lowGaps}</div>
+          <div className="text-sm text-green-600 font-medium">Niedrig</div>
+        </div>
+      </div>
+
+      <div className="space-y-3">
+        {analysis.gaps.slice(0, 5).map((gap: GapItem) => (
+          <div
+            key={gap.id}
+            className={`p-4 rounded-lg border-l-4 ${
+              gap.severity === 'CRITICAL' ? 'bg-red-50 border-red-500' :
+              gap.severity === 'HIGH' ? 'bg-orange-50 border-orange-500' :
+              gap.severity === 'MEDIUM' ? 'bg-yellow-50 border-yellow-500' :
+              'bg-green-50 border-green-500'
+            }`}
+          >
+            <div className="flex items-start justify-between">
+              <div>
+                <div className="font-medium text-gray-900">{gap.category}</div>
+                <p className="text-sm text-gray-600 mt-1">{gap.description}</p>
+              </div>
+              <span className={`px-2 py-1 text-xs font-medium rounded ${
+                gap.severity === 'CRITICAL' ? 'bg-red-100 text-red-700' :
+                gap.severity === 'HIGH' ? 'bg-orange-100 text-orange-700' :
+                gap.severity === 'MEDIUM' ? 'bg-yellow-100 text-yellow-700' :
+                'bg-green-100 text-green-700'
+              }`}>
+                {gap.severity}
+              </span>
+            </div>
+            <div className="mt-2 text-xs text-gray-500">
+              Regulierung: {gap.regulation} | Aktion: {gap.requiredAction}
+            </div>
+          </div>
+        ))}
+        {analysis.gaps.length > 5 && (
+          <p className="text-sm text-gray-500 text-center py-2">
+            + {analysis.gaps.length - 5} weitere Luecken
+          </p>
+        )}
+      </div>
+    </div>
+  )
+}