dl.tags { display: flex}

dl.tags  {
    display: flex; flex-wrap: wrap; margin: 8px 0; align-items: center;
}
dl.tags :is(dt,dd) {
    font-size: 14px; line-height: 1; white-space: nowrap;
}
dl.tags dt {
    display: inline-block; font-size: 14px; color:  #1D1D1D;
    border: 1px solid transparent;
    padding: 0.5em 0;
    font-weight: 700; margin:8px 8px 8px 0;
}
dl.tags dd {margin:8px 8px 8px 0;  font-size: 14px; }
dl.tags dd a {
    padding: 0.5em; display: inline-block; color:  #1D1D1D;
    border: 1px solid #1D1D1D; border-radius: 300px; transition: all 0.2s ease;
}

dl.tags dd a:is(:hover,:focus-visible) {
    border-color: var(--blue-darkest) !important;
    background-color: var(--blue-darkest) !important;
    color: white !important;
}
dl.tags dd a:focus-visible {
    box-shadow: 0 0 0 1px var(--yellow-lighter), 0 0 0 4px var(--green);   }