@skyhook-io/k8s-ui 1.8.15 → 1.9.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skyhook-io/k8s-ui",
-  "version": "1.8.15",
+  "version": "1.9.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/skyhook-io/radar",

package/src/components/applications/ApplicationDetail.test.tsx

@@ -278,6 +278,34 @@ describe("ApplicationDetail shell", () => {
     expect(html).not.toContain('Recording coverage is incomplete')
   })
 
+  it('reports ring truncation with its own copy, only in retained mode', () => {
+    const base = {
+      selectedView: 'history' as const,
+      onSelectView: () => {},
+      selectedWorkloadKey: null,
+      onSelectWorkload: () => {},
+      historyRange: '7d' as const,
+      historyRangeOptions: [{ value: '7d' as const, label: '7 days' }],
+      historyRingTruncated: true,
+      historyItems: [{
+        id: 'ring-change',
+        category: 'change' as const,
+        title: 'Deployment updated',
+        timestamp: '2026-07-13T09:00:00.000Z',
+      }],
+    }
+    const retained = renderDetail({ ...base, historyMode: 'retained' })
+    expect(retained).toContain('the retained window exceeded')
+    // Distinct cause, distinct copy — not the per-query 10k note.
+    expect(retained).not.toContain('Showing the 10,000 most recent events')
+
+    const local = renderDetail({ ...base, historyMode: 'local' })
+    expect(local).not.toContain('the retained window exceeded')
+    // Local can be ring-truncated too (the binary's 10k ring) - same warning,
+    // source-appropriate copy.
+    expect(local).toContain('ring is full, so the oldest activity is not loaded')
+  })
+
   it('shows a single honest error state when runtime history fails without source history', () => {
     const html = renderDetail({
       selectedView: 'history',

package/src/components/applications/ApplicationDetail.tsx

@@ -238,6 +238,9 @@ export type ApplicationDetailProps = {
   }>;
   historyCoverageRecordCount?: number;
   historyRuntimeLimited?: boolean;
+  // The retained ring itself was row-capped: the OLDEST part of the retention
+  // window is not loaded, independent of the per-query event limit.
+  historyRingTruncated?: boolean;
   onHistoryRangeChange?: (range: ApplicationHistoryRange) => void;
   onOpenTimeline?: (timestamp?: string) => void;
   onOpenSource?: (source: AppSourceRef) => void;
@@ -330,6 +333,7 @@ export function ApplicationDetail({
   historyRangeOptions,
   historyCoverageRecordCount,
   historyRuntimeLimited,
+  historyRingTruncated,
   onHistoryRangeChange,
   onOpenTimeline,
   onOpenSource,
@@ -750,6 +754,7 @@ export function ApplicationDetail({
             historyRangeOptions={historyRangeOptions}
             historyCoverageRecordCount={historyCoverageRecordCount}
             historyRuntimeLimited={historyRuntimeLimited}
+            historyRingTruncated={historyRingTruncated}
             onHistoryRangeChange={onHistoryRangeChange}
             onOpenTimeline={onOpenTimeline}
             onOpenSource={onOpenSource}
@@ -797,6 +802,7 @@ function ApplicationWorkspace({
   historyRangeOptions,
   historyCoverageRecordCount,
   historyRuntimeLimited,
+  historyRingTruncated,
   onHistoryRangeChange,
   onOpenTimeline,
   onOpenSource,
@@ -848,6 +854,7 @@ function ApplicationWorkspace({
   }>;
   historyCoverageRecordCount?: number;
   historyRuntimeLimited?: boolean;
+  historyRingTruncated?: boolean;
   onHistoryRangeChange?: (range: ApplicationHistoryRange) => void;
   onOpenTimeline?: (timestamp?: string) => void;
   onOpenSource?: (source: AppSourceRef) => void;
@@ -916,6 +923,7 @@ function ApplicationWorkspace({
           rangeOptions={historyRangeOptions}
           coverageRecordCount={historyCoverageRecordCount}
           runtimeLimited={historyRuntimeLimited}
+          ringTruncated={historyRingTruncated}
           workloads={workloads}
           onSelectWorkload={onSelectWorkload}
           onNavigateToResource={onNavigateToResource}
@@ -2146,6 +2154,7 @@ function ApplicationHistoryView({
   rangeOptions,
   coverageRecordCount,
   runtimeLimited,
+  ringTruncated,
   workloads,
   onSelectWorkload,
   onNavigateToResource,
@@ -2163,6 +2172,7 @@ function ApplicationHistoryView({
   rangeOptions?: Array<{ value: ApplicationHistoryRange; label: string }>;
   coverageRecordCount?: number;
   runtimeLimited?: boolean;
+  ringTruncated?: boolean;
   workloads: AppWorkload[];
   onSelectWorkload: (workload: AppWorkload) => void;
   onNavigateToResource?: (resource: ResourceRef) => void;
@@ -2372,6 +2382,13 @@ function ApplicationHistoryView({
                 application activity in this range may not be included.
               </div>
             )}
+            {ringTruncated && (
+              <div>
+                {mode === "retained"
+                  ? "Event history may be incomplete: the retained window exceeded its size limit, so the oldest activity is not loaded."
+                  : "Event history may be incomplete: the event store's ring is full, so the oldest activity is not loaded."}
+              </div>
+            )}
           </div>
         </section>
       </div>

package/src/components/audit/AuditAlerts.tsx

@@ -1,7 +1,8 @@
 import { useState } from 'react'
 import { ClipboardCheck, ChevronRight, ShieldAlert, AlertTriangle, ArrowRight } from 'lucide-react'
 import { clsx } from 'clsx'
-import { SEVERITY_TEXT, BP_CATEGORY_BADGE, DEFAULT_BADGE_COLOR } from '../../utils/badge-colors'
+import { BP_CATEGORY_BADGE, DEFAULT_BADGE_COLOR } from '../../utils/badge-colors'
+import { SEVERITY_TEXT_CLASS } from '../checks/severity'
 
 export interface AuditFinding {
   kind: string
@@ -13,6 +14,7 @@ export interface AuditFinding {
   name: string
   checkID: string
   category: string
+  /** Raw detector compatibility value: danger renders as High, warning as Medium. */
   severity: string
   message: string
   /** Cluster context — set when findings come from multiple clusters
@@ -37,8 +39,8 @@ export function AuditAlerts({ findings, onViewAll }: AuditAlertsProps) {
 
   if (findings.length === 0) return null
 
-  const dangers = findings.filter(f => f.severity === 'danger').length
-  const warnings = findings.filter(f => f.severity === 'warning').length
+  const highCount = findings.filter(f => f.severity === 'danger').length
+  const mediumCount = findings.filter(f => f.severity === 'warning').length
 
   return (
     <section className="rounded-lg border border-theme-border bg-theme-surface p-4 shadow-theme-sm">
@@ -51,11 +53,11 @@ export function AuditAlerts({ findings, onViewAll }: AuditAlertsProps) {
         <ClipboardCheck className="w-4 h-4 text-theme-text-secondary" />
         <span className="text-sm font-semibold text-theme-text-primary">Audit Findings</span>
         <div className="flex items-center gap-2 ml-1">
-          {dangers > 0 && (
-            <span className={clsx('text-xs font-medium tabular-nums', SEVERITY_TEXT.error)}>{dangers} critical</span>
+          {highCount > 0 && (
+            <span className={clsx('text-xs font-medium tabular-nums', SEVERITY_TEXT_CLASS.high)}>{highCount} high</span>
           )}
-          {warnings > 0 && (
-            <span className={clsx('text-xs font-medium tabular-nums', SEVERITY_TEXT.warning)}>{warnings} warning</span>
+          {mediumCount > 0 && (
+            <span className={clsx('text-xs font-medium tabular-nums', SEVERITY_TEXT_CLASS.medium)}>{mediumCount} medium</span>
           )}
         </div>
       </button>
@@ -67,13 +69,13 @@ export function AuditAlerts({ findings, onViewAll }: AuditAlertsProps) {
         <div className="overflow-hidden">
           <div className="flex flex-col gap-0.5 pt-3">
             {findings.map((f, i) => {
-              const isDanger = f.severity === 'danger'
+              const isHigh = f.severity === 'danger'
               return (
                 <div key={`${f.checkID}-${i}`} className="flex items-start gap-2 py-1">
-                  {isDanger ? (
-                    <ShieldAlert className={clsx('w-3.5 h-3.5 shrink-0 mt-0.5', SEVERITY_TEXT.error)} />
+                  {isHigh ? (
+                    <ShieldAlert className={clsx('w-3.5 h-3.5 shrink-0 mt-0.5', SEVERITY_TEXT_CLASS.high)} />
                   ) : (
-                    <AlertTriangle className={clsx('w-3.5 h-3.5 shrink-0 mt-0.5', SEVERITY_TEXT.warning)} />
+                    <AlertTriangle className={clsx('w-3.5 h-3.5 shrink-0 mt-0.5', SEVERITY_TEXT_CLASS.medium)} />
                   )}
                   <div className="flex min-w-0 flex-1 flex-wrap items-center gap-x-2 gap-y-1">
                     <span className="text-xs text-theme-text-secondary">{f.message}</span>

package/src/components/audit/AuditBadgeTooltip.test.tsx

@@ -23,6 +23,12 @@ describe('AuditBadgeTooltip', () => {
     expect(html).not.toContain('A fourth finding')
   })
 
+  it('sorts High first before applying the cap', () => {
+    const html = renderToString(<AuditBadgeTooltip messages={msgs} max={1} />)
+    expect(html).toContain('Ingress references missing Service')
+    expect(html).not.toContain('Service selector matches no pods')
+  })
+
   it('shows the click hint by default and omits it when disabled', () => {
     expect(renderToString(<AuditBadgeTooltip messages={msgs.slice(0, 1)} />)).toContain('Click to open')
     expect(renderToString(<AuditBadgeTooltip messages={msgs.slice(0, 1)} clickHint={false} />)).not.toContain('Click to open')

package/src/components/audit/AuditBadgeTooltip.tsx

@@ -1,8 +1,9 @@
 import { ShieldAlert, AlertTriangle } from 'lucide-react'
 import { clsx } from 'clsx'
-import { SEVERITY_TEXT } from '../../utils/badge-colors'
+import { SEVERITY_TEXT_CLASS } from '../checks/severity'
 
 export interface AuditBadgeMessage {
+  /** Raw detector compatibility value: danger renders as High, warning as Medium. */
   severity: string
   message: string
 }
@@ -17,21 +18,23 @@ interface AuditBadgeTooltipProps {
 
 /**
  * Inline tooltip body for an audit badge: lists the actual finding messages
- * (danger-first) so the operator reads WHAT is wrong on hover, instead of a
+ * (High-first) so the operator reads WHAT is wrong on hover, instead of a
  * content-free "N findings". Shared by the resource-list and topology-node
  * badges so the two can't drift.
  */
 export function AuditBadgeTooltip({ messages, max = 3, clickHint = true }: AuditBadgeTooltipProps) {
-  const shown = messages.slice(0, max)
+  const shown = [...messages]
+    .sort((a, b) => Number(b.severity === 'danger') - Number(a.severity === 'danger'))
+    .slice(0, max)
   const overflow = messages.length - shown.length
   return (
     <div className="flex flex-col gap-1 text-left">
       {shown.map((m, i) => {
-        const isDanger = m.severity === 'danger'
-        const Icon = isDanger ? ShieldAlert : AlertTriangle
+        const isHigh = m.severity === 'danger'
+        const Icon = isHigh ? ShieldAlert : AlertTriangle
         return (
           <div key={i} className="flex items-start gap-1.5">
-            <Icon className={clsx('w-3 h-3 shrink-0 mt-0.5', isDanger ? SEVERITY_TEXT.error : SEVERITY_TEXT.warning)} />
+            <Icon className={clsx('w-3 h-3 shrink-0 mt-0.5', isHigh ? SEVERITY_TEXT_CLASS.high : SEVERITY_TEXT_CLASS.medium)} />
             <span>{m.message}</span>
           </div>
         )

package/src/components/audit/AuditCard.tsx

@@ -1,11 +1,14 @@
 import { ClipboardCheck, ArrowRight, Check } from 'lucide-react'
 import { clsx } from 'clsx'
 import { SEVERITY_TEXT, SEVERITY_DOT } from '../../utils/badge-colors'
+import { SEVERITY_FILL_CLASS, SEVERITY_TEXT_CLASS } from '../checks/severity'
 
 export interface AuditCardData {
   passing: number
+  /** Raw compatibility counts; warning renders as Medium and danger as High. */
   warning: number
   danger: number
+  /** Nested warning/danger counts follow the same Medium/High mapping. */
   categories: Record<string, { passing: number; warning: number; danger: number }>
 }
 
@@ -14,20 +17,19 @@ interface AuditCardProps {
   onNavigate: () => void
 }
 
-type SeverityLevel = 'success' | 'warning' | 'error'
+type SeverityLevel = 'success' | 'high' | 'medium'
 
 function getSeverityLevel(data: AuditCardData): SeverityLevel {
   if (data.warning + data.danger === 0) return 'success'
-  const dangerRatio = data.danger / (data.warning + data.danger)
-  if (dangerRatio > 0.2) return 'error'
-  return 'warning'
+  const highRatio = data.danger / (data.warning + data.danger)
+  if (highRatio > 0.2) return 'high'
+  return 'medium'
 }
 
-// Card-specific accent backgrounds (light opacity variants, work in both themes)
 const ACCENT_BG: Record<SeverityLevel, string> = {
   success: 'bg-green-500/10',
-  warning: 'bg-yellow-500/10',
-  error: 'bg-red-500/10',
+  high: 'bg-orange-500/10',
+  medium: 'bg-yellow-500/10',
 }
 
 export function AuditCard({ data, onNavigate }: AuditCardProps) {
@@ -35,7 +37,7 @@ export function AuditCard({ data, onNavigate }: AuditCardProps) {
   const issueCount = data.warning + data.danger
   const allPassing = issueCount === 0
   const level = getSeverityLevel(data)
-  const accentColor = SEVERITY_TEXT[level]
+  const accentColor = level === 'success' ? SEVERITY_TEXT.success : SEVERITY_TEXT_CLASS[level]
   const accentBg = ACCENT_BG[level]
 
   return (
@@ -77,10 +79,10 @@ export function AuditCard({ data, onNavigate }: AuditCardProps) {
                   <div className="flex-1 h-3 rounded-full overflow-hidden bg-theme-hover flex">
                     <div className={clsx('h-full', SEVERITY_DOT.success)} style={{ width: `${(data.passing / total) * 100}%` }} />
                     {data.warning > 0 && (
-                      <div className={clsx('h-full', SEVERITY_DOT.warning)} style={{ width: `${(data.warning / total) * 100}%` }} />
+                      <div className={clsx('h-full', SEVERITY_FILL_CLASS.medium)} style={{ width: `${(data.warning / total) * 100}%` }} />
                     )}
                     {data.danger > 0 && (
-                      <div className={clsx('h-full', SEVERITY_DOT.error)} style={{ width: `${(data.danger / total) * 100}%` }} />
+                      <div className={clsx('h-full', SEVERITY_FILL_CLASS.high)} style={{ width: `${(data.danger / total) * 100}%` }} />
                     )}
                   </div>
                 </div>
@@ -90,7 +92,7 @@ export function AuditCard({ data, onNavigate }: AuditCardProps) {
               <div className="grid grid-cols-1 gap-y-2 mt-4 w-full">
                 {Object.entries(data.categories).map(([category, counts]) => {
                   const catIssues = counts.warning + counts.danger
-                  const dotColor = counts.danger > 0 ? SEVERITY_DOT.error : counts.warning > 0 ? SEVERITY_DOT.warning : SEVERITY_DOT.success
+                  const dotColor = counts.danger > 0 ? SEVERITY_FILL_CLASS.high : counts.warning > 0 ? SEVERITY_FILL_CLASS.medium : SEVERITY_DOT.success
                   return (
                     <div key={category} className="flex items-center gap-2">
                       <span className={clsx('w-2 h-2 rounded-full shrink-0', dotColor)} />
@@ -98,10 +100,10 @@ export function AuditCard({ data, onNavigate }: AuditCardProps) {
                       {catIssues > 0 ? (
                         <div className="flex items-center gap-2">
                           {counts.danger > 0 && (
-                            <span className={clsx('text-xs font-semibold tabular-nums', SEVERITY_TEXT.error)}>{counts.danger} critical</span>
+                            <span className={clsx('text-xs font-semibold tabular-nums', SEVERITY_TEXT_CLASS.high)}>{counts.danger} high</span>
                           )}
                           {counts.warning > 0 && (
-                            <span className={clsx('text-xs font-semibold tabular-nums', SEVERITY_TEXT.warning)}>{counts.warning} warning</span>
+                            <span className={clsx('text-xs font-semibold tabular-nums', SEVERITY_TEXT_CLASS.medium)}>{counts.warning} medium</span>
                           )}
                         </div>
                       ) : (

package/src/components/audit/AuditFindingsTable.tsx

@@ -2,19 +2,21 @@ import { useState, useMemo, useRef, useEffect, type Dispatch, type SetStateActio
 import { ShieldAlert, AlertTriangle, ChevronRight, CheckCircle2, ExternalLink, MoreHorizontal, EyeOff, Layers } from 'lucide-react'
 import { clsx } from 'clsx'
 import type { AuditFinding } from './AuditAlerts'
-import { SEVERITY_TEXT, BP_CATEGORY_BADGE, DEFAULT_BADGE_COLOR } from '../../utils/badge-colors'
+import { BP_CATEGORY_BADGE, DEFAULT_BADGE_COLOR } from '../../utils/badge-colors'
 import { EmptyState } from '../ui/EmptyState'
 import { SearchBox } from '../ui/SearchBox'
 import { FilterPill } from '../ui/FilterPill'
 import { pluralize } from '../../utils/pluralize'
+import { SEVERITY_TEXT_CLASS } from '../checks/severity'
 
 const CATEGORIES = ['Security', 'Reliability', 'Efficiency'] as const
-const SEVERITIES = ['danger', 'warning'] as const
+const RAW_SEVERITIES = ['danger', 'warning'] as const
 
 export interface ResourceGroup {
   kind: string
   namespace: string
   name: string
+  /** Raw compatibility counts; warning renders as Medium and danger as High. */
   warning: number
   danger: number
   findings: AuditFinding[]
@@ -94,8 +96,8 @@ export function AuditFindingsTable({ groups, findings, checks, onResourceClick,
     return findings ?? []
   }, [groups, findings])
 
-  const totalDangerCount = allFindings.filter(f => f.severity === 'danger').length
-  const totalWarningCount = allFindings.filter(f => f.severity === 'warning').length
+  const totalHighCount = allFindings.filter(f => f.severity === 'danger').length
+  const totalMediumCount = allFindings.filter(f => f.severity === 'warning').length
 
   // Derive available frameworks from checks metadata
   const frameworks = useMemo(() => {
@@ -166,8 +168,8 @@ export function AuditFindingsTable({ groups, findings, checks, onResourceClick,
   const filteredAllFindings = filteredGroups
     ? filteredGroups.flatMap(g => g.findings)
     : filteredFindings ?? []
-  const dangerCount = hasActiveFilters ? filteredAllFindings.filter(f => f.severity === 'danger').length : totalDangerCount
-  const warningCount = hasActiveFilters ? filteredAllFindings.filter(f => f.severity === 'warning').length : totalWarningCount
+  const highCount = hasActiveFilters ? filteredAllFindings.filter(f => f.severity === 'danger').length : totalHighCount
+  const mediumCount = hasActiveFilters ? filteredAllFindings.filter(f => f.severity === 'warning').length : totalMediumCount
 
   // Group resources by namespace when enabled
   const namespacedGroups = useMemo(() => {
@@ -181,9 +183,9 @@ export function AuditFindingsTable({ groups, findings, checks, onResourceClick,
     }
     // Sort namespaces: most severe first
     return Array.from(nsMap.entries()).sort((a, b) => {
-      const aDanger = a[1].reduce((n, g) => n + g.danger, 0)
-      const bDanger = b[1].reduce((n, g) => n + g.danger, 0)
-      if (aDanger !== bDanger) return bDanger - aDanger
+      const aHigh = a[1].reduce((n, g) => n + g.danger, 0)
+      const bHigh = b[1].reduce((n, g) => n + g.danger, 0)
+      if (aHigh !== bHigh) return bHigh - aHigh
       return a[0].localeCompare(b[0])
     })
   }, [groupByNS, filteredGroups])
@@ -231,8 +233,8 @@ export function AuditFindingsTable({ groups, findings, checks, onResourceClick,
       <div className="flex flex-col gap-2 px-4 py-3 border-b border-theme-border bg-theme-base rounded-xl shrink-0">
         {/* Row 1: Counts + Search + View toggle */}
         <div className="flex items-center gap-4">
-          <SummaryBadge label="Critical" count={dangerCount} color={SEVERITY_TEXT.error} />
-          <SummaryBadge label="Warning" count={warningCount} color={SEVERITY_TEXT.warning} />
+          <SummaryBadge label="High" count={highCount} color={SEVERITY_TEXT_CLASS.high} />
+          <SummaryBadge label="Medium" count={mediumCount} color={SEVERITY_TEXT_CLASS.medium} />
 
           <SearchBox value={searchTerm} onChange={setSearchTerm} scope="audit" shortcutId="audit-search" className="w-64" />
 
@@ -264,12 +266,12 @@ export function AuditFindingsTable({ groups, findings, checks, onResourceClick,
             <FilterPill key={cat} label={cat} active={categoryFilter.has(cat)} onClick={() => toggleInSet(setCategoryFilter, cat)} />
           ))}
           <span className="w-px h-5 bg-theme-border mx-2" />
-          {SEVERITIES.map(sev => (
+          {RAW_SEVERITIES.map(sev => (
             <FilterPill
               key={sev}
-              label={sev === 'danger' ? 'Critical' : 'Warning'}
+              label={sev === 'danger' ? 'High' : 'Medium'}
               active={severityFilter.has(sev)}
-              tone={sev === 'danger' ? 'danger' : 'warn'}
+              tone={sev === 'danger' ? 'high' : 'medium'}
               onClick={() => toggleInSet(setSeverityFilter, sev)}
             />
           ))}
@@ -318,8 +320,8 @@ export function AuditFindingsTable({ groups, findings, checks, onResourceClick,
         <div className="flex flex-col gap-1">
           {namespacedGroups.map(([ns, nsGroups]) => {
             const nsExpanded = expandedNS.has(ns)
-            const nsDanger = nsGroups.reduce((n, g) => n + g.danger, 0)
-            const nsWarning = nsGroups.reduce((n, g) => n + g.warning, 0)
+            const nsHigh = nsGroups.reduce((n, g) => n + g.danger, 0)
+            const nsMedium = nsGroups.reduce((n, g) => n + g.warning, 0)
             return (
               <div key={ns}>
                 <div
@@ -338,8 +340,8 @@ export function AuditFindingsTable({ groups, findings, checks, onResourceClick,
                   <span className="text-xs text-theme-text-tertiary">{pluralize(nsGroups.length, 'resource')}</span>
                   <span className="flex-1" />
                   <div className="flex items-center gap-3 shrink-0">
-                    {nsDanger > 0 && <span className={clsx('text-xs font-semibold tabular-nums', SEVERITY_TEXT.error)}>{nsDanger} critical</span>}
-                    {nsWarning > 0 && <span className={clsx('text-xs font-semibold tabular-nums', SEVERITY_TEXT.warning)}>{nsWarning} warning</span>}
+                    {nsHigh > 0 && <span className={clsx('text-xs font-semibold tabular-nums', SEVERITY_TEXT_CLASS.high)}>{nsHigh} high</span>}
+                    {nsMedium > 0 && <span className={clsx('text-xs font-semibold tabular-nums', SEVERITY_TEXT_CLASS.medium)}>{nsMedium} medium</span>}
                   </div>
                   {onHideNamespace && ns !== '(cluster-scoped)' && (
                     <ContextMenu items={[{ label: `Hide ${ns} namespace`, onClick: () => onHideNamespace(ns) }]} />
@@ -392,7 +394,7 @@ function FindingDetail({ finding, meta, onHideCheck, onHideCategory }: {
   onHideCheck?: (checkID: string, title: string) => void
   onHideCategory?: (category: string) => void
 }) {
-  const isDanger = finding.severity === 'danger'
+  const isHigh = finding.severity === 'danger'
   const menuItems: ContextMenuItem[] = []
   if (onHideCheck) {
     menuItems.push({ label: `Hide "${meta?.title || finding.checkID}" check`, onClick: () => onHideCheck(finding.checkID, meta?.title || finding.checkID) })
@@ -404,10 +406,10 @@ function FindingDetail({ finding, meta, onHideCheck, onHideCategory }: {
   return (
     <div className="flex flex-col gap-0.5 px-3 py-2 rounded group/finding">
       <div className="flex items-center gap-3">
-        {isDanger ? (
-          <ShieldAlert className={clsx('w-4 h-4 shrink-0', SEVERITY_TEXT.error)} />
+        {isHigh ? (
+          <ShieldAlert className={clsx('w-4 h-4 shrink-0', SEVERITY_TEXT_CLASS.high)} />
         ) : (
-          <AlertTriangle className={clsx('w-4 h-4 shrink-0', SEVERITY_TEXT.warning)} />
+          <AlertTriangle className={clsx('w-4 h-4 shrink-0', SEVERITY_TEXT_CLASS.medium)} />
         )}
         <span className="text-sm text-theme-text-primary flex-1 min-w-0">{finding.message}</span>
         <span className={clsx('badge-sm text-[10px]', BP_CATEGORY_BADGE[finding.category] || DEFAULT_BADGE_COLOR)}>
@@ -438,7 +440,7 @@ function ResourceGroupRow({ group: g, checks, expanded, onToggle, onResourceClic
 }) {
   const key = `${g.kind}/${g.namespace}/${g.name}`
   const isExpanded = expanded.has(key)
-  const hasDanger = g.danger > 0
+  const hasHigh = g.danger > 0
 
   return (
     <div>
@@ -454,10 +456,10 @@ function ResourceGroupRow({ group: g, checks, expanded, onToggle, onResourceClic
         className="group flex items-center gap-3 w-full px-4 py-2.5 rounded-lg hover:bg-theme-hover/50 transition-colors text-left cursor-pointer focus-visible:ring-2 focus-visible:ring-theme-text-primary/20 focus-visible:outline-none"
       >
         <ChevronRight className={clsx('w-3.5 h-3.5 text-theme-text-tertiary shrink-0 transition-transform duration-200', isExpanded && 'rotate-90')} />
-        {hasDanger ? (
-          <ShieldAlert className={clsx('w-4 h-4 shrink-0', SEVERITY_TEXT.error)} />
+        {hasHigh ? (
+          <ShieldAlert className={clsx('w-4 h-4 shrink-0', SEVERITY_TEXT_CLASS.high)} />
         ) : (
-          <AlertTriangle className={clsx('w-4 h-4 shrink-0', SEVERITY_TEXT.warning)} />
+          <AlertTriangle className={clsx('w-4 h-4 shrink-0', SEVERITY_TEXT_CLASS.medium)} />
         )}
         <span className="text-xs text-theme-text-tertiary shrink-0">{g.kind}</span>
         {onResourceClick ? (
@@ -476,8 +478,8 @@ function ResourceGroupRow({ group: g, checks, expanded, onToggle, onResourceClic
         )}
         <span className="flex-1" />
         <div className="flex items-center gap-3 shrink-0">
-          {g.danger > 0 && <span className={clsx('text-xs font-semibold tabular-nums', SEVERITY_TEXT.error)}>{g.danger} critical</span>}
-          {g.warning > 0 && <span className={clsx('text-xs font-semibold tabular-nums', SEVERITY_TEXT.warning)}>{g.warning} warning</span>}
+          {g.danger > 0 && <span className={clsx('text-xs font-semibold tabular-nums', SEVERITY_TEXT_CLASS.high)}>{g.danger} high</span>}
+          {g.warning > 0 && <span className={clsx('text-xs font-semibold tabular-nums', SEVERITY_TEXT_CLASS.medium)}>{g.warning} medium</span>}
         </div>
         {showNamespace && onHideNamespace && g.namespace && (
           <ContextMenu items={[{ label: `Hide ${g.namespace} namespace`, onClick: () => onHideNamespace(g.namespace) }]} />
@@ -500,12 +502,12 @@ function ResourceGroupRow({ group: g, checks, expanded, onToggle, onResourceClic
 }
 
 function FlatFindingRow({ finding, onResourceClick, showCluster, onClusterClick }: { finding: AuditFinding; onResourceClick?: (kind: string, namespace: string, name: string) => void; showCluster?: boolean; onClusterClick?: (clusterId: string) => void }) {
-  const isDanger = finding.severity === 'danger'
-  const severityColor = isDanger ? SEVERITY_TEXT.error : SEVERITY_TEXT.warning
+  const isHigh = finding.severity === 'danger'
+  const severityColor = isHigh ? SEVERITY_TEXT_CLASS.high : SEVERITY_TEXT_CLASS.medium
 
   return (
     <div className="flex items-center gap-3 px-4 py-2.5 rounded-lg hover:bg-theme-hover/50 transition-colors">
-      {isDanger ? (
+      {isHigh ? (
         <ShieldAlert className={clsx('w-4 h-4 shrink-0', severityColor)} />
       ) : (
         <AlertTriangle className={clsx('w-4 h-4 shrink-0', severityColor)} />

package/src/components/audit/AuditSeverityPresentation.test.tsx

@@ -0,0 +1,64 @@
+import { describe, expect, it } from 'vitest'
+import { renderToString } from 'react-dom/server'
+import { AuditAlerts, type AuditFinding } from './AuditAlerts'
+import { AuditCard } from './AuditCard'
+import { AuditFindingsTable } from './AuditFindingsTable'
+
+const findings: AuditFinding[] = [
+  {
+    kind: 'Deployment',
+    namespace: 'prod',
+    name: 'api',
+    checkID: 'privileged',
+    category: 'Security',
+    severity: 'danger',
+    message: 'Container is privileged',
+  },
+  {
+    kind: 'Deployment',
+    namespace: 'prod',
+    name: 'api',
+    checkID: 'cpuRequestMissing',
+    category: 'Efficiency',
+    severity: 'warning',
+    message: 'CPU request is missing',
+  },
+]
+
+describe('legacy audit severity presentation', () => {
+  it('labels raw summary counts as High and Medium', () => {
+    const html = renderToString(
+      <AuditCard
+        data={{
+          passing: 3,
+          danger: 1,
+          warning: 2,
+          categories: {
+            Security: { passing: 1, danger: 1, warning: 0 },
+            Efficiency: { passing: 2, danger: 0, warning: 2 },
+          },
+        }}
+        onNavigate={() => {}}
+      />,
+    )
+    expect(html).toMatch(/1(?:<!-- -->)? high/)
+    expect(html).toMatch(/2(?:<!-- -->)? medium/)
+    expect(html).toContain('bg-orange-500/10')
+    expect(html).not.toContain('critical')
+  })
+
+  it('uses High and Medium in resource audit summaries', () => {
+    const html = renderToString(<AuditAlerts findings={findings} />)
+    expect(html).toMatch(/1(?:<!-- -->)? high/)
+    expect(html).toMatch(/1(?:<!-- -->)? medium/)
+    expect(html).not.toContain('critical')
+  })
+
+  it('uses High and Medium in audit totals and filters', () => {
+    const html = renderToString(<AuditFindingsTable findings={findings} />)
+    expect(html).toContain('High')
+    expect(html).toContain('Medium')
+    expect(html).not.toContain('Critical')
+    expect(html).not.toContain('Warning')
+  })
+})

package/src/components/checks/types.ts

@@ -7,12 +7,12 @@
 //
 // Mirrors Radar OSS's resource-key convention (radar/pkg/audit.ResourceKey).
 
-/** Canonical Checks severity ladder — distinct from the raw detector severity
- *  (danger/warning) so operational criticality and compliance risk stay
- *  separate axes. */
+/** Canonical user-facing Checks severity ladder. Live issues remain a separate
+ *  operational-health axis even where the same severity word appears. */
 export type CheckSeverity = 'critical' | 'high' | 'medium' | 'low';
 
-/** Raw detector severity Radar emits. */
+/** Raw detector values retained by existing audit transport/public-prop
+ *  compatibility contracts. Checks presentation maps them before display. */
 export type RadarSeverity = 'danger' | 'warning';
 
 /** Ordered worst→least, for rendering severity filters/sorts consistently. */

package/src/components/issues/types.ts

@@ -128,6 +128,10 @@ export interface IssueRecentChange {
   timestamp: string;
   change_category?: 'spec_config' | 'lifecycle' | 'runtime_status' | string;
   rank_reason?: string;
+  /** Ranking hint for workload runtime configuration (including the image) or directly consumed ConfigMap data; not a causal claim. */
+  application_configuration_change?: boolean;
+  /** Set only on top-level recent_changes in an eligible, unfiltered issues response with complete linkage evidence. */
+  not_linked_to_returned_issues?: boolean;
   fields?: IssueRecentChangeField[];
   /** Workloads that mount/reference this ConfigMap directly ("Deployment/flagd").
    *  Direct spec references only — runtime consumers via an intermediary

package/src/components/resources/ResourcesView.tsx

@@ -133,13 +133,14 @@ import {
   podMatchesProblemCategory,
   SEVERITY_DOT_COLOR,
 } from './resource-utils'
-import { SEVERITY_BADGE, EVENT_TYPE_COLORS, SEVERITY_TEXT } from '../../utils/badge-colors'
+import { SEVERITY_BADGE, EVENT_TYPE_COLORS } from '../../utils/badge-colors'
 import { pluralize } from '../../utils/pluralize'
 import { getPodGpuCount, getNodeGpuCount } from '../../utils/extended-resources'
 import { type CustomColumnDef, type CustomColumnSource, customColumnKey, readCustomColumnValue, sanitizeCustomColumnDefs } from '../../utils/custom-columns'
 import { FreshnessControl, type FreshnessConnection } from '../ui/FreshnessControl'
 import { Tooltip } from '../ui/Tooltip'
 import { AuditBadgeTooltip, type AuditBadgeMessage } from '../audit/AuditBadgeTooltip'
+import { SEVERITY_TEXT_CLASS } from '../checks/severity'
 // CRD-specific cell components (extracted)
 import { GitRepositoryCell, OCIRepositoryCell, HelmRepositoryCell, KustomizationCell, FluxHelmReleaseCell, FluxAlertCell } from './renderers/flux-cells'
 import { ArgoApplicationCell, ArgoApplicationSetCell, ArgoAppProjectCell } from './renderers/argo-cells'
@@ -1829,8 +1830,8 @@ interface ResourcesViewData {
   onNavigate?: (path: string, options?: { replace?: boolean }) => void
   certExpiry?: Record<string, { expired?: boolean; daysLeft: number }>
   certExpiryError?: boolean
-  // Cluster Audit findings for the listed kind, keyed by "namespace/name" (the
-  // list shows one kind at a time, so ns/name is unambiguous). Host-injected.
+  /** Cluster Audit findings keyed by "namespace/name". Raw compatibility
+   *  counts render danger as High and warning as Medium. */
   auditBadges?: Record<string, { danger: number; warning: number; messages?: AuditBadgeMessage[] }>
   onOpenLogs?: (params: { namespace: string; podName: string; containers: string[]; containerName?: string }) => void
   onOpenWorkloadLogs?: (params: { namespace: string; workloadKind: string; workloadName: string }) => void
@@ -1889,7 +1890,8 @@ interface ResourcesViewProps {
   topNodeMetrics?: TopNodeMetrics[]
   certExpiry?: Record<string, { expired?: boolean; daysLeft: number }>
   certExpiryError?: boolean
-  // Cluster Audit findings for the selected kind, keyed by "namespace/name".
+  /** Cluster Audit findings keyed by "namespace/name". Raw compatibility
+   *  counts render danger as High and warning as Medium. */
   auditBadges?: Record<string, { danger: number; warning: number; messages?: AuditBadgeMessage[] }>
   // Pinned kinds
   pinned?: Array<{ name: string; kind: string; group: string }>
@@ -5381,8 +5383,8 @@ function CellContent({ resource, kind, column, group, majorityNodeMinorVersion,
         {auditTotal > 0 && audit && (
           <Tooltip content={audit.messages && audit.messages.length > 0
             ? <AuditBadgeTooltip messages={audit.messages} />
-            : `${auditTotal} audit ${auditTotal === 1 ? 'finding' : 'findings'}${audit.danger > 0 ? ` · ${audit.danger} danger` : ''}`}>
-            <span className={clsx('shrink-0 inline-flex items-center gap-0.5 text-[10px] font-medium cursor-help', audit.danger > 0 ? SEVERITY_TEXT.error : SEVERITY_TEXT.warning)}>
+            : `${auditTotal} audit ${auditTotal === 1 ? 'finding' : 'findings'}${audit.danger > 0 ? ` · ${audit.danger} high` : ''}${audit.warning > 0 ? ` · ${audit.warning} medium` : ''}`}>
+            <span className={clsx('shrink-0 inline-flex items-center gap-0.5 text-[10px] font-medium cursor-help', audit.danger > 0 ? SEVERITY_TEXT_CLASS.high : SEVERITY_TEXT_CLASS.medium)}>
               <AlertTriangle className="w-3 h-3" />
               {auditTotal}
             </span>
@@ -6265,7 +6267,7 @@ function ServiceCell({ resource, column }: { resource: any; column: string }) {
       const flagged = auditBadges?.[`${meta.namespace || ''}/${meta.name}`]
       if (flagged && flagged.danger + flagged.warning > 0) {
         return (
-          <span className={clsx('badge', flagged.danger > 0 ? 'status-unhealthy' : 'status-degraded')}>
+          <span className={clsx('badge', flagged.danger > 0 ? 'status-alert' : 'status-degraded')}>
             No endpoints
           </span>
         )

package/src/components/timeline/TimelineSwimlanes.tsx

@@ -1077,16 +1077,29 @@ export function TimelineSwimlanes({ events, isLoading, onResourceClick, viewMode
     return { start, end, windowMs, now: effectiveNow }
   }, [zoom, panOffset, effectiveNow, viewWindow])
 
+  // The visible window WITHOUT the live-`now` field. Keyed on the primitive
+  // bounds so its identity changes only when the window actually moves — a live
+  // `now` tick (30s) advances `visibleTimeRange.now` for the now-line but must
+  // NOT invalidate the lane-ordering / window-clip memos below, which only care
+  // about [start,end]. This stops the heavy build from re-running on each tick
+  // while the window is static — the controlled retained lens or a paused view.
+  // (In uncontrolled live mode start/end track `effectiveNow`, so they advance
+  // every tick regardless; the win is for the static-window cases this targets.)
+  const visibleWindow = useMemo(
+    () => ({ start: visibleTimeRange.start, end: visibleTimeRange.end, windowMs: visibleTimeRange.windowMs }),
+    [visibleTimeRange.start, visibleTimeRange.end, visibleTimeRange.windowMs],
+  )
+
   // Apply the chosen ordering to the top-level lanes. 'recent' needs the visible
   // window (newest-in-view first), so this lives after visibleTimeRange. The
   // pinned section is ordered separately (strict pin order) and never flows here.
   const orderedLanes = useMemo(
     () => sortTimelineLanes(lanes, sort, {
-      windowStart: visibleTimeRange.start,
-      windowEnd: visibleTimeRange.end,
+      windowStart: visibleWindow.start,
+      windowEnd: visibleWindow.end,
       scoreOf: (lane) => lane.scoreBreakdown?.total ?? calculateInterestingness(lane),
     }),
-    [lanes, sort, visibleTimeRange],
+    [lanes, sort, visibleWindow],
   )
 
   // Live-mode order hysteresis. The importance rank recomputes every poll (recency
@@ -1147,17 +1160,17 @@ export function TimelineSwimlanes({ events, isLoading, onResourceClick, viewMode
   // "events" count so it's view-scoped like "resources" — a lens sitting in a
   // recording gap reads "0 resources · 0 events", not "0 resources · N events".
   const eventsInWindow = useMemo(() => {
-    const { start, end } = visibleTimeRange
+    const { start, end } = visibleWindow
     return filteredEvents.filter((e) => {
       const t = new Date(e.timestamp).getTime()
       return t >= start && t <= end
     })
-  }, [filteredEvents, visibleTimeRange])
+  }, [filteredEvents, visibleWindow])
 
   // Recording gaps clipped to the visible window, for the hatched lane bands.
   const visibleGaps = useMemo(() => {
     if (!gaps || gaps.length === 0) return []
-    const { start, end } = visibleTimeRange
+    const { start, end } = visibleWindow
     const out: TimeWindow[] = []
     for (const g of gaps) {
       const fromMs = Math.max(g.fromMs, start)
@@ -1165,7 +1178,7 @@ export function TimelineSwimlanes({ events, isLoading, onResourceClick, viewMode
       if (toMs > fromMs) out.push({ fromMs, toMs })
     }
     return out
-  }, [gaps, visibleTimeRange])
+  }, [gaps, visibleWindow])
 
   // Pin MOVES a row: pinned lanes (and pinned children inside groups) leave
   // the regular list entirely — the pinned section is their only home.
@@ -1181,7 +1194,7 @@ export function TimelineSwimlanes({ events, isLoading, onResourceClick, viewMode
 
   // Filter out lanes with no events in the visible time window
   const visibleLanes = useMemo(() => {
-    const { start, end } = visibleTimeRange
+    const { start, end } = visibleWindow
     return unpinnedLanes.filter(lane => {
       const allLaneEvents = lane.allEventsSorted || []
       return allLaneEvents.some(e => {
@@ -1189,7 +1202,7 @@ export function TimelineSwimlanes({ events, isLoading, onResourceClick, viewMode
         return t >= start && t <= end
       })
     })
-  }, [unpinnedLanes, visibleTimeRange])
+  }, [unpinnedLanes, visibleWindow])
 
   // Pinned rows: resolved from the FULL lane list (pre-window-filter, any
   // grouping) so they stay put while the lens moves and even when they have no
@@ -1203,7 +1216,7 @@ export function TimelineSwimlanes({ events, isLoading, onResourceClick, viewMode
   // Honest counts while filtered to pins: only pinned rows' in-window events.
   const pinnedEventsInWindow = useMemo(() => {
     if (pinnedLaneRows.length === 0) return 0
-    const { start, end } = visibleTimeRange
+    const { start, end } = visibleWindow
     let n = 0
     for (const lane of pinnedLaneRows) {
       for (const e of lane.allEventsSorted || []) {
@@ -1212,7 +1225,7 @@ export function TimelineSwimlanes({ events, isLoading, onResourceClick, viewMode
       }
     }
     return n
-  }, [pinnedLaneRows, visibleTimeRange])
+  }, [pinnedLaneRows, visibleWindow])
 
   const pinnedIdSet = useMemo(() => new Set((pinnedLanes ?? []).map((p) => p.id)), [pinnedLanes])
   // A pin button for a lane, or null when the host wired no pin handler. A pinned
@@ -1236,7 +1249,7 @@ export function TimelineSwimlanes({ events, isLoading, onResourceClick, viewMode
 
   // Generate time axis ticks
   const axisTicks = useMemo(() => {
-    const { start, end } = visibleTimeRange
+    const { start, end } = visibleWindow
     const ticks: { time: number; label: string }[] = []
     const span = end - start
     if (span <= 0) return ticks
@@ -1262,18 +1275,18 @@ export function TimelineSwimlanes({ events, isLoading, onResourceClick, viewMode
     }
 
     return ticks
-  }, [visibleTimeRange])
+  }, [visibleWindow])
 
   // Convert timestamp to X position (0-100%)
   const timeToX = useCallback(
     (timestamp: number): number => {
-      const { start, windowMs } = visibleTimeRange
+      const { start, windowMs } = visibleWindow
       // A zero-width window (host bounds with fromMs === toMs) would divide by
       // zero and emit NaN into `left:` CSS — pin everything to the left edge.
       if (windowMs <= 0) return 0
       return ((timestamp - start) / windowMs) * 100
     },
-    [visibleTimeRange]
+    [visibleWindow]
   )
 
   // Vertical grid line positions (x-percent) shared by every lane backdrop.

package/src/components/timeline/index.ts

@@ -20,8 +20,6 @@ export {
   advanceLatchedLens,
   deriveLiveSelection,
   isLensLatched,
-  quantizeBaseWindow,
   LIVE_TICK_MS,
-  BASE_QUANTIZE_STEP_MS,
   type TimelineLiveState,
 } from './timeline-live'

package/src/components/timeline/timeline-live.test.ts

@@ -1,12 +1,10 @@
 import { describe, expect, it } from 'vitest'
 import {
-  BASE_QUANTIZE_STEP_MS,
   LENS_LATCH_EPSILON_MS,
   STALE_AMBER_AFTER_MS,
   advanceLatchedLens,
   deriveLiveSelection,
   isLensLatched,
-  quantizeBaseWindow,
 } from './timeline-live'
 import { clampSelection, type ScrubberRange } from './scrubber-math'
 
@@ -20,41 +18,6 @@ describe('deriveLiveSelection', () => {
   })
 })
 
-describe('quantizeBaseWindow', () => {
-  it('floors both edges to the step', () => {
-    const step = BASE_QUANTIZE_STEP_MS
-    const q = quantizeBaseWindow(step * 3 + 12_345, step * 10 + 4_000, step)
-    expect(q).toEqual({ fromMs: step * 3, toMs: step * 10 })
-  })
-
-  it('is stable across two ticks inside the same step', () => {
-    const step = BASE_QUANTIZE_STEP_MS
-    const base = step * 100
-    // Two "now" values 30s apart but inside the same 5-minute step.
-    const a = quantizeBaseWindow(base - HOUR + 10_000, base + 10_000, step)
-    const b = quantizeBaseWindow(base - HOUR + 40_000, base + 40_000, step)
-    expect(a).toEqual(b)
-  })
-
-  it('advances once the edge crosses a step boundary', () => {
-    const step = BASE_QUANTIZE_STEP_MS
-    const before = quantizeBaseWindow(0, step - 1, step)
-    const after = quantizeBaseWindow(0, step + 1, step)
-    expect(before.toMs).toBe(0)
-    expect(after.toMs).toBe(step)
-  })
-
-  it('trailing seam never exceeds one step (covered by the 10-min live poll)', () => {
-    const step = BASE_QUANTIZE_STEP_MS
-    const now = step * 42 + 137_000
-    const q = quantizeBaseWindow(now - HOUR, now, step)
-    // Gap between the quantized right edge and now is < one step, and one step
-    // (5min) is well inside the 10-min live poll window ⇒ no data hole.
-    expect(now - q.toMs).toBeLessThan(step)
-    expect(step).toBeLessThan(10 * MIN)
-  })
-})
-
 describe('isLensLatched', () => {
   const sel: ScrubberRange = { fromMs: 0, toMs: 100 * HOUR }
 

package/src/components/timeline/timeline-live.ts

@@ -18,8 +18,8 @@ export type TimelineLiveState =
   | { kind: 'frozen'; asOfMs: number; newEventCount?: number }
 
 // Cadence the host slides a live selection at. Coarse on purpose: the precise
-// [from,to] is re-derived every tick, but the base fetch is quantized so the
-// query key only churns every QUANTIZE step (see quantizeBaseWindow).
+// [from,to] is re-derived every tick without refetching — data arrives via the
+// source's own delta polling, so the tick only moves the visible window.
 export const LIVE_TICK_MS = 30_000
 
 // A frozen selection older than this reads as stale — the chip turns amber.
@@ -30,33 +30,11 @@ export const STALE_AMBER_AFTER_MS = 15 * 60_000
 // LIVE_TICK_MS so a lens that just slid with the tick still reads as latched.
 export const LENS_LATCH_EPSILON_MS = 60_000
 
-// Base-fetch quantization step. The react-query key is keyed on the quantized
-// window, so it only changes when the live edge crosses a 5-minute boundary —
-// the seam between the quantized edge and now is covered by the 10-minute live
-// poll (5min quantization lag < 10min poll window ⇒ no hole).
-export const BASE_QUANTIZE_STEP_MS = 5 * 60_000
-
 /** LIVE selection: a width pinned to now. */
 export function deriveLiveSelection(widthMs: number, nowMs: number): ScrubberRange {
   return { fromMs: nowMs - widthMs, toMs: nowMs }
 }
 
-/**
- * Quantize a sliding [from,to] down to fixed steps so the value is stable across
- * ticks within one step (identical output ⇒ stable react-query key). Both edges
- * floor to the step; the trailing seam to `now` is filled by the live poll.
- */
-export function quantizeBaseWindow(
-  fromMs: number,
-  toMs: number,
-  stepMs: number = BASE_QUANTIZE_STEP_MS,
-): ScrubberRange {
-  return {
-    fromMs: Math.floor(fromMs / stepMs) * stepMs,
-    toMs: Math.floor(toMs / stepMs) * stepMs,
-  }
-}
-
 /**
  * True when the lens rides the selection's live edge (so it should slide with
  * the tick). A lens the user dragged into the past sits further than epsilon

package/src/components/topology/K8sResourceNode.tsx

@@ -10,13 +10,14 @@ import {
 import { clsx } from 'clsx'
 import type { NodeKind, HealthStatus, PodSummary } from '../../types'
 import { displayKind } from '../../types'
-import { healthToSeverity, SEVERITY_DOT, SEVERITY_TEXT } from '../../utils/badge-colors'
+import { healthToSeverity, SEVERITY_DOT } from '../../utils/badge-colors'
 import { workloadHue } from '../../utils/workload-colors'
 import { ownershipOf } from '../../utils/topology-neighborhood'
 import { midTruncate } from '../../utils/format'
 import { getTopologyIcon } from '../../utils/resource-icons'
 import { Tooltip } from '../ui/Tooltip'
 import { AuditBadgeTooltip, type AuditBadgeMessage } from '../audit/AuditBadgeTooltip'
+import { SEVERITY_TEXT_CLASS } from '../checks/severity'
 import argoCdLogo from '../../assets/gitops/argocd.png'
 import fluxLogo from '../../assets/gitops/flux.svg'
 
@@ -464,12 +465,13 @@ export const K8sResourceNode = memo(function K8sResourceNode({
   // node's data by auditKey). The host only counts "badge-worthy" findings —
   // reference-integrity / lifecycle, "this resource is actually broken" — not the
   // posture/best-practice nags that fire near-universally, so the indicator stays
-  // a signal. Colored by worst severity (danger red, else warning amber).
-  const auditDanger =
+  // a signal. The counters retain the raw transport names, but presentation
+  // follows the canonical Checks severity ladder (High, then Medium).
+  const auditHigh =
     typeof nodeData.auditDanger === "number" ? nodeData.auditDanger : 0;
-  const auditWarning =
+  const auditMedium =
     typeof nodeData.auditWarning === "number" ? nodeData.auditWarning : 0;
-  const auditTotal = auditDanger + auditWarning;
+  const auditTotal = auditHigh + auditMedium;
   const auditMessages = Array.isArray(nodeData.auditMessages)
     ? (nodeData.auditMessages as AuditBadgeMessage[])
     : [];
@@ -652,7 +654,7 @@ export const K8sResourceNode = memo(function K8sResourceNode({
                         clickHint={false}
                       />
                     ) : (
-                      `${auditTotal} audit ${auditTotal === 1 ? "finding" : "findings"}${auditDanger > 0 ? ` · ${auditDanger} danger` : ""}`
+                      `${auditTotal} audit ${auditTotal === 1 ? "finding" : "findings"}${auditHigh > 0 ? ` · ${auditHigh} high` : ""}${auditMedium > 0 ? ` · ${auditMedium} medium` : ""}`
                     )
                   }
                   position="right"
@@ -660,9 +662,9 @@ export const K8sResourceNode = memo(function K8sResourceNode({
                   <TriangleAlert
                     className={clsx(
                       "w-3 h-3 cursor-help",
-                      auditDanger > 0
-                        ? SEVERITY_TEXT.error
-                        : SEVERITY_TEXT.warning,
+                      auditHigh > 0
+                        ? SEVERITY_TEXT_CLASS.high
+                        : SEVERITY_TEXT_CLASS.medium,
                     )}
                   />
                 </Tooltip>

package/src/components/ui/FilterPill.tsx

@@ -22,7 +22,7 @@ import { Tooltip } from './Tooltip'
 // screen readers announce pressed/unpressed correctly. Optional tooltip
 // describes the toggle action ("Click to stop filtering by danger").
 
-export type FilterPillTone = 'neutral' | 'danger' | 'warn' | 'ok' | 'brand'
+export type FilterPillTone = 'neutral' | 'danger' | 'warn' | 'high' | 'medium' | 'ok' | 'brand'
 
 interface Props {
   label: ReactNode
@@ -49,6 +49,8 @@ const TONE_ACTIVE: Record<FilterPillTone, string> = {
   neutral: 'bg-theme-text-primary/10 border-theme-text-primary/25 text-theme-text-primary',
   danger:  'bg-red-500/15 border-red-500/40 text-red-700 dark:text-red-300',
   warn:    'bg-amber-500/15 border-amber-500/40 text-amber-800 dark:text-amber-300',
+  high:    'bg-orange-500/15 border-orange-500/40 text-orange-800 dark:text-orange-300',
+  medium:  'bg-yellow-500/15 border-yellow-500/40 text-yellow-800 dark:text-yellow-300',
   ok:      'bg-emerald-500/15 border-emerald-500/40 text-emerald-700 dark:text-emerald-300',
   brand:   'bg-[var(--color-brand-50)] border-[var(--color-radar-accent)] text-theme-text-primary dark:bg-[var(--color-brand-950)]',
 }