.severity-grid-five {
  grid-template-columns: repeat(5, 1fr);
}
.severity-grid-five > div { padding-inline: 10px; }
.sev.info { background: #77766e; }
.finding-preview {
  min-height: 118px;
  transition: opacity .18s ease, transform .18s ease, border-color .18s ease;
  border: 1px solid transparent;
}
.finding-preview.is-changing {
  opacity: 0;
  transform: translateY(5px);
}
.finding-preview[data-active-severity="urgent"] { border-color: rgba(189, 30, 50, .55); }
.finding-preview[data-active-severity="high"] { border-color: rgba(227, 91, 49, .45); }
.finding-preview[data-active-severity="medium"] { border-color: rgba(246, 184, 26, .35); }
.finding-preview[data-active-severity="low"] { border-color: rgba(93, 169, 214, .35); }
.finding-preview[data-active-severity="informational"] { border-color: rgba(153, 151, 142, .25); }
.badge.urgent-bg { color: #fff; background: #bd1e32; }
.badge.high-bg { color: #fff; background: var(--rust); }
.badge.medium-bg { color: #1a1300; background: var(--amber); }
.badge.low-bg { color: #07131a; background: #5da9d6; }
.badge.informational-bg { color: #fff; background: #66645d; }
@media (max-width: 420px) {
  .severity-grid-five > div { padding-inline: 6px; }
  .severity-grid-five small { font-size: 7px; }
}
@media (prefers-reduced-motion: reduce) {
  .finding-preview { transition: none; }
}