docs: enterprise refactor plan with ralph specs

frontend/src/components/SeverityBadge.tsx

@@ -0,0 +1,23 @@
+import type { Severity } from '../types';
+
+const STYLES: Record<Severity, string> = {
+  critical: 'bg-red-500 text-white',
+  high: 'bg-orange-500 text-white',
+  medium: 'bg-yellow-500 text-black',
+  low: 'bg-blue-500 text-white',
+};
+
+interface Props {
+  severity: Severity;
+  className?: string;
+}
+
+export function SeverityBadge({ severity, className = '' }: Props) {
+  return (
+    <span
+      className={`text-xs font-bold px-2 py-1 rounded ${STYLES[severity] ?? 'bg-gray-600 text-white'} ${className}`}
+    >
+      {severity.toUpperCase()}
+    </span>
+  );
+}