.tag {
  display: inline-flex;
  align-items: center;
  font-size: .67rem;
  font-weight: var(--weight-bold);
  padding: .15rem .5rem;
  border-radius: 999px;
  white-space: nowrap;
  letter-spacing: .03em;
}

.tag-cname    { background: var(--navy-light);  color: var(--navy-mid); }
.tag-a        { background: var(--teal-light);  color: #1a4a3e; }
.tag-mx       { background: var(--red-light);   color: #991b1b; }
.tag-active   { background: var(--green-light); color: var(--green); }
.tag-warn     { background: var(--amber-light); color: var(--amber); }
.tag-expiring { background: #fff7ed;            color: #c2410c; }
.tag-flagged  { background: var(--red-light);   color: var(--red); }