@keyframes i6e6fxk { 
  0% { stroke-dashoffset: -50px; }
  100% { stroke-dashoffset: 0px; }
}
.i6e6fx6 { --i6e6fx0: calc((var(--x-typography-size-default) * 40) / 14); --i6e6fx1: calc((var(--x-typography-size-default) * 24) / 14); --i6e6fx2: calc((var(--x-typography-size-default) * 14) / 14); --i6e6fx3: calc((var(--x-typography-size-default) * 20) / 14); width: var(--i6e6fx0); height: var(--i6e6fx1); }
.i6e6fx8:focus { outline: none; }
.i6e6fxf { inset: 0px; background-color: var(--x-default-color-background); }
.i6e6fxf::before { content: ""; position: absolute; height: var(--i6e6fx2); width: var(--i6e6fx2); bottom: 50%; transform: translateY(50%); left: calc((var(--x-typography-size-default) * 4) / 14); border-radius: 50%; background-color: var(--x-default-color-text-subdued); transition: var(--x-duration-fast); }
.i6e6fx8:checked + .i6e6fxf { background-color: var(--x-default-color-accent); border-color: var(--x-default-color-accent); }
.i6e6fx8:focus-visible + .i6e6fxf, .i6e6fx8:active:focus-visible + .i6e6fxf { outline: 1px solid var(--x-default-color-accent); outline-offset: 1px; }
.i6e6fx8:checked + .i6e6fxf::before { background-color: var(--x-default-color-accent-contrast); left: calc((var(--i6e6fx0) - var(--i6e6fx3)) - ((var(--x-typography-size-default) * 3) / 14)); height: var(--i6e6fx3); width: var(--i6e6fx3); }
.i6e6fxh { min-width: calc(var(--x-typography-size-default) * .7142857142857143); min-height: calc(var(--x-typography-size-default) * .7142857142857143); width: calc(var(--x-typography-size-default) * .7142857142857143); height: calc(var(--x-typography-size-default) * .7142857142857143); left: calc(50% + ((var(--x-typography-size-default) * 8) / 14)); transform: translate(-50%, -50%); transform-origin: center center; color: var(--x-default-color-accent); }
.i6e6fx8:checked ~ .i6e6fxh { opacity: 1; }
.i6e6fxm { vector-effect: non-scaling-stroke; stroke-width: calc((var(--x-typography-size-default) * 1.4) / 14); stroke-dasharray: 50px; stroke-dashoffset: 0px; }
.i6e6fx8:checked ~ .i6e6fxh > .i6e6fxj > .i6e6fxm { stroke: var(--x-default-color-accent); }
.i6e6fx8:checked:not(:disabled) ~ .i6e6fxh > .i6e6fxj > .i6e6fxm { animation: i6e6fxk var(--x-duration-slow) linear 5ms backwards; }
.i6e6fx8:checked:disabled ~ .i6e6fxh > .i6e6fxj > .i6e6fxm { animation: auto ease 0s 1 normal none running none; stroke-dashoffset: 0px; }
.i6e6fxo { padding-top: calc((var(--x-typography-size-default) * 1.5) / 14); }
@media screen and (forced-colors: active) {
  .i6e6fxf { background-color: canvas; border-color: buttontext; }
  .i6e6fxf::before { background-color: buttontext; }
  .i6e6fx8:checked + .i6e6fxf { background-color: highlight; border-color: highlight; }
  .i6e6fx8:checked + .i6e6fxf::before { background-color: highlighttext; }
  .i6e6fx8:checked ~ .i6e6fxh > .i6e6fxj > .i6e6fxm { stroke: highlight; }
}