feat: reporter clickable rows, CAPA owner action buttons, triage segmented severity

components/incidents/triage-form.tsx

@@ -94,16 +94,23 @@ export function TriageForm({ incidentId, currentSeverity }: Props) {
   return (
     <form onSubmit={handleSubmit} className="space-y-6">
       <div>
-        <label className="block text-sm font-medium text-gray-700 mb-1">
-          Severity — {SEVERITY_LABELS[severity]}
-        </label>
-        <input
-          type="range" min={1} max={5} value={severity}
-          onChange={e => setSeverity(Number(e.target.value))}
-          className="w-full accent-blue-600"
-        />
-        <div className="flex justify-between text-xs text-gray-400 mt-1">
-          <span>1 Minor</span><span>3 Moderate</span><span>5 Critical</span>
+        <label className="block text-sm font-medium text-gray-700 mb-2">Severity</label>
+        <div className="flex rounded-lg border border-gray-300 overflow-hidden divide-x divide-gray-300">
+          {([1, 2, 3, 4, 5] as const).map(v => (
+            <button
+              key={v}
+              type="button"
+              onClick={() => setSeverity(v)}
+              className={`flex-1 py-2 text-xs font-medium transition-colors ${
+                severity === v
+                  ? 'bg-blue-600 text-white border-blue-600'
+                  : 'bg-white text-gray-700 hover:bg-gray-50'
+              }`}
+            >
+              <span className="block font-bold">{v}</span>
+              <span className="block">{SEVERITY_LABELS[v].split(' / ')[0]}</span>
+            </button>
+          ))}
         </div>
       </div>