.kz-twi {
  display: inline-flex;
  justify-content: flex-start;
  color: inherit;
  line-height: var(--line-height-relaxed);

  svg {
    flex-shrink: 0;
    margin-inline-end: var(--space-2xs);
    transform: translateY(calc(calc(0.5ex - 0.5cap) * -1));
  }
}
.kz-twi--right svg {
  order: 1;
  margin-inline-start: var(--space-2xs);
  margin-inline-end: 0;
}

.kz-twi:is(a) {
  color: var(--color-klezmer-life);
  text-decoration: none;

  &:hover,
  &:focus {
    text-decoration: underline;
  }
}

.kz-twi:is(button) {
  background: none;
  border: none;
  color: var(--color-klezmer-life);
  cursor: pointer;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  padding: 0;

  &:hover,
  &:focus {
    text-decoration: underline;
  }
}

.kz-twi[data-size='-1'] {
  font-size: var(--step--1);
}