/* Public capability-tab icons. The wider experimental interaction styles stay review-only. */
.cap-icon { display: inline-block; flex: 0 0 auto; width: 1.5em; height: 1.5em; line-height: 0; }
.cap-icon svg { display: block; width: 100%; height: 100%; overflow: visible; }

@media (min-width: 721px) {
  .capability-tab:has(> .cap-icon) { position: relative; padding-right: calc(18px + 2.2em); }
  .capability-tab > .cap-icon {
    position: absolute; right: 14px; bottom: calc(30px - .42em);
    width: 2.1em; height: 2.1em;
  }
  .capability-tab[aria-selected="true"] > .cap-icon { bottom: calc(16px - .42em); }
}

@media (max-width: 720px) {
  .capability-tab:has(> .cap-icon) { gap: .5em; }
  .capability-tab > .cap-icon { width: 1.4em; height: 1.4em; margin: -.1em 0; }
}
