.dot-arrow{--dot-size:2px;--dot-gap:2px;--dot-pitch:calc(var(--dot-size) + var(--dot-gap));--dot-arrow-duration:1.85s;color:inherit;justify-content:center;align-items:center;line-height:0;display:inline-flex}.dot-arrow-stage{width:calc(8 * var(--dot-pitch) - var(--dot-gap));height:calc(5 * var(--dot-pitch) - var(--dot-gap));position:relative}.dot-arrow-down{width:calc(5 * var(--dot-pitch) - var(--dot-gap));height:calc(8 * var(--dot-pitch) - var(--dot-gap));position:relative}.dot-arrow-down .dot-arrow-stage{transform-origin:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(90deg)}.dot-arrow-dot{width:var(--dot-size);height:var(--dot-size);border-radius:var(--radius-full,9999px);left:calc(var(--dot-x) * var(--dot-pitch));top:calc((var(--dot-y) + var(--max-y)) * var(--dot-pitch));opacity:0;animation-duration:var(--dot-arrow-duration);background:currentColor;animation-timing-function:linear;animation-iteration-count:infinite;position:absolute;transform:scale(.3)}.dot-arrow-col-0{animation-name:dot-arrow-col-0}.dot-arrow-col-1{animation-name:dot-arrow-col-1}.dot-arrow-col-2{animation-name:dot-arrow-col-2}.dot-arrow-col-3{animation-name:dot-arrow-col-3}.dot-arrow-col-4{animation-name:dot-arrow-col-4}.dot-arrow-col-5{animation-name:dot-arrow-col-5}.dot-arrow-col-6{animation-name:dot-arrow-col-6}.dot-arrow-col-7{animation-name:dot-arrow-col-7}@keyframes dot-arrow-col-0{0%{opacity:0;transform:scale(.3)}3%{opacity:1;transform:scale(1)}30%{opacity:1;transform:scale(1)}35%{opacity:0;transform:scale(.3)}35.01%,to{opacity:0;transform:scale(.3)}}@keyframes dot-arrow-col-1{0%,1%{opacity:0;transform:scale(.3)}4%{opacity:1;transform:scale(1)}34%{opacity:1;transform:scale(1)}39%{opacity:0;transform:scale(.3)}39.01%,to{opacity:0;transform:scale(.3)}}@keyframes dot-arrow-col-2{0%,2%{opacity:0;transform:scale(.3)}6%{opacity:1;transform:scale(1)}39%{opacity:1;transform:scale(1)}44%{opacity:0;transform:scale(.3)}44.01%,to{opacity:0;transform:scale(.3)}}@keyframes dot-arrow-col-3{0%,4%{opacity:0;transform:scale(.3)}8%{opacity:1;transform:scale(1)}43%{opacity:1;transform:scale(1)}49%{opacity:0;transform:scale(.3)}49.01%,to{opacity:0;transform:scale(.3)}}@keyframes dot-arrow-col-4{0%,6%{opacity:0;transform:scale(.3)}10%{opacity:1;transform:scale(1)}48%{opacity:1;transform:scale(1)}54%{opacity:0;transform:scale(.3)}54.01%,to{opacity:0;transform:scale(.3)}}@keyframes dot-arrow-col-5{0%,8%{opacity:0;transform:scale(.3)}12%{opacity:1;transform:scale(1)}52%{opacity:1;transform:scale(1)}58%{opacity:0;transform:scale(.3)}58.01%,to{opacity:0;transform:scale(.3)}}@keyframes dot-arrow-col-6{0%,11%{opacity:0;transform:scale(.3)}14%{opacity:1;transform:scale(1)}57%{opacity:1;transform:scale(1)}63%{opacity:0;transform:scale(.3)}63.01%,to{opacity:0;transform:scale(.3)}}@keyframes dot-arrow-col-7{0%,13%{opacity:0;transform:scale(.3)}16%{opacity:1;transform:scale(1)}61%{opacity:1;transform:scale(1)}67%{opacity:0;transform:scale(.3)}67.01%,to{opacity:0;transform:scale(.3)}}@media (prefers-reduced-motion:reduce){.dot-arrow-dot{opacity:.85;transform:scale(1);animation:none!important}}
