/* Graphic arrows keep the same appearance on platforms with emoji fonts. */
.haven-arrow {
  display: inline-block;
  position: relative;
  flex: none;
  width: 1em;
  height: 1em;
  vertical-align: middle;
  font-style: normal;
  line-height: 1;
}
.haven-arrow::before {
  content: '';
  position: absolute;
  width: 1.1em;
  height: .09em;
  top: .45em;
  left: -.02em;
  background: currentColor;
  transform: rotate(-45deg);
}
.haven-arrow::after {
  content: '';
  position: absolute;
  box-sizing: border-box;
  width: .56em;
  height: .56em;
  top: .1em;
  right: .1em;
  border-top: .09em solid currentColor;
  border-right: .09em solid currentColor;
}