/* Arrow artwork follows the existing 24px SVG, not an operating-system glyph. */
.ka-icon-arrow {
  position: relative;
  display: inline-block;
  flex: 0 0 auto;
  width: 1em;
  height: 1em;
  vertical-align: -.12em;
  font-weight: inherit;
  line-height: 1;
  pointer-events: none;
}
.ka-icon-arrow::before {
  content: '';
  position: absolute;
  inset: 0;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 19 19 5M5 5h14v14' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 19 19 5M5 5h14v14' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ka-icon-arrow--down::before { transform: rotate(135deg); }
.ka-icon-arrow--left::before { transform: rotate(225deg); }
.ka-icon-arrow--right::before { transform: rotate(45deg); }