:where(svg.arrow-circle-bottom) {
  height: calc(var(--custom-rem, 1rem) * 1.8);
  width: calc(var(--custom-rem, 1rem) * 1.8);
  overflow: visible;
  --arrow-dasharray: 54;
  --arrow-dasharray-inverse: -54;
  --circle-icon-color-default: #0065BD;
  --circle-icon-color-active: #0065BD;
  --circle-color-default: #DFE2E5;
  --circle-color-active: #0065BD
}

.arrow-circle-bottom.svelte-v1841p.svelte-v1841p {
  overflow: visible
}

.circle.svelte-v1841p.svelte-v1841p {
  transition: stroke 1s ease;
  stroke: var(--circle-color-default)
}

@media (hover: hover) and (pointer: fine) {
  svg.animated.svelte-v1841p:hover>.circle.svelte-v1841p, svg.animated[data-active=true].svelte-v1841p>.circle.svelte-v1841p, .icon-circle-container:hover svg.arrow-circle-bottom>.circle {
    stroke: var(--circle-color-active, var(--circle-color-default))
  }
}

.arrow.svelte-v1841p.svelte-v1841p {
  transition: stroke 1s ease;
  stroke: var(--circle-icon-color-default)
}

@media (hover: hover) and (pointer: fine) {
  svg.animated.svelte-v1841p:hover>.arrow.svelte-v1841p, svg.animated[data-active=true].svelte-v1841p>.arrow.svelte-v1841p, .icon-circle-container:hover svg.arrow-circle-bottom>.arrow {
    stroke: var(--circle-icon-color-active, var(--circle-color-default))
  }
}