.grid-background.svelte-133yxpb{position:relative;background-color:#fff;background-image:linear-gradient(0deg,#fff,#0032ff00 10%,#0032ff00 95%,#fff),linear-gradient(90deg,#fff,#0032ff00 10%,#0032ff00 90%,#fff),linear-gradient(to right,#f8f8f8 1px,transparent 1px),linear-gradient(to bottom,#f8f8f8 1px,transparent 1px);background-size:100% 100%,100% 100%,40px 40px,40px 40px;background-position:center center,center center,0 0,0 0;background-repeat:no-repeat,no-repeat,repeat,repeat}.dark .grid-background.svelte-133yxpb{background-color:#1a1a1a;background-image:radial-gradient(ellipse at center,transparent 0%,#1a1a1a 70%),linear-gradient(to right,#2a2a2a 1px,transparent 1px),linear-gradient(to bottom,#2a2a2a 1px,transparent 1px)}:root{--color: #5bc0eb}.svelte-1uju8kw{box-sizing:border-box}@keyframes svelte-1uju8kw-move-dot1{0%{transform:translate(-50%) translateY(-50%)}20%{transform:translate(-50%) translateY(30%)}to{transform:translate(-50%) translateY(30%)}}@keyframes svelte-1uju8kw-move-dot2{0%{transform:translate(-50%) translateY(-50%)}15%{transform:translate(-50%) translateY(-10%)}30%{transform:translate(-10%) translateY(-10%)}to{transform:translate(-10%) translateY(-10%)}}.animation-example.svelte-1uju8kw{position:relative;aspect-ratio:1 / 1;width:100%;margin:auto;display:flex;align-items:center;justify-content:center}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw){position:absolute;top:0;left:50%;height:50%;width:50%;transform:translate(-50%);transform-origin:50% 100%;pointer-events:none}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw):nth-child(2){transform:translate(-50%) rotate(90deg)}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw):nth-child(3){transform:translate(-50%) rotate(180deg)}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw):nth-child(4){transform:translate(-50%) rotate(270deg)}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw) .line:where(.svelte-1uju8kw){height:100%;width:calc(50% + 1px);border-right:2px dashed var(--color)}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw) .dot:where(.svelte-1uju8kw){position:absolute;left:50%;top:10%;transform:translate(-50%) translateY(-50%);height:100%;width:100%;animation:svelte-1uju8kw-move-dot1 5.5s linear infinite}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw) .dot:where(.svelte-1uju8kw):after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%) translateY(-50%);height:5%;width:5%;background:#fff;border:2px solid var(--color);border-radius:50%}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw) .circle:where(.svelte-1uju8kw){position:absolute;top:0;left:50%;transform:translate(-50%);height:20%;width:20%;border-radius:50%;background:var(--color)}.animation-example.svelte-1uju8kw .item.-type2:where(.svelte-1uju8kw){top:0;left:0;transform:none;transform-origin:100% 100%}.animation-example.svelte-1uju8kw .item.-type2:where(.svelte-1uju8kw):nth-child(5){transform:scaleX(-1)}.animation-example.svelte-1uju8kw .item.-type2:where(.svelte-1uju8kw):nth-child(6){transform:scaleX(-1) scaleY(-1)}.animation-example.svelte-1uju8kw .item.-type2:where(.svelte-1uju8kw):nth-child(7){transform:scaleY(-1)}.animation-example.svelte-1uju8kw .item.-type2:where(.svelte-1uju8kw) .line:where(.svelte-1uju8kw){position:absolute;top:30%;left:calc(30% - 1px);width:70%;height:40%;border-right:none;border-left:2px dashed var(--color);border-bottom:2px dashed var(--color)}.animation-example.svelte-1uju8kw .item.-type2:where(.svelte-1uju8kw) .dot:where(.svelte-1uju8kw){top:30%;left:30%;animation:svelte-1uju8kw-move-dot2 4s linear infinite}.animation-example.svelte-1uju8kw .item.-type2:where(.svelte-1uju8kw) .circle:where(.svelte-1uju8kw){top:30%;left:30%;transform:translate(-50%) translateY(-50%)}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw):nth-of-type(1) .dot:where(.svelte-1uju8kw){animation-delay:0}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw):nth-of-type(7) .dot:where(.svelte-1uju8kw){animation-delay:.5s}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw):nth-of-type(2) .dot:where(.svelte-1uju8kw){animation-delay:1s}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw):nth-of-type(6) .dot:where(.svelte-1uju8kw){animation-delay:1.5s}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw):nth-of-type(3) .dot:where(.svelte-1uju8kw){animation-delay:2s}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw):nth-of-type(5) .dot:where(.svelte-1uju8kw){animation-delay:2.5s}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw):nth-of-type(4) .dot:where(.svelte-1uju8kw){animation-delay:3s}.animation-example.svelte-1uju8kw .item:where(.svelte-1uju8kw):nth-of-type(8) .dot:where(.svelte-1uju8kw){animation-delay:3.5s}.animation-example.svelte-1uju8kw .center:where(.svelte-1uju8kw){position:absolute;top:50%;left:50%;transform:translate(-50%) translateY(-50%);height:50%;width:50%}.animation-example.svelte-1uju8kw .center:where(.svelte-1uju8kw) .circle:where(.svelte-1uju8kw){position:absolute;top:50%;left:50%;transform:translate(-50%) translateY(-50%);border-radius:50%}.animation-example.svelte-1uju8kw .center:where(.svelte-1uju8kw) .circle:where(.svelte-1uju8kw):nth-child(1){height:100%;width:100%;background:#fff;box-shadow:0 0 3vmin #0000001a}.animation-example.svelte-1uju8kw .center:where(.svelte-1uju8kw) .circle:where(.svelte-1uju8kw):nth-child(2){height:80%;width:80%;border:2px solid var(--color)}.animation-example.svelte-1uju8kw .center:where(.svelte-1uju8kw) .circle:where(.svelte-1uju8kw):nth-child(3){height:50%;width:50%;background:var(--color)}
