.grid-line{--background:#fff;--color:#00000080;--dash-size:50%;--delay:0s;--duration:2s;--fade-stop:100%;--height:1px;--offset:0px;--left-offset:var(--offset);--right-offset:var(--offset);--top-offset:var(--offset);--bottom-offset:var(--offset);--width:8px;opacity:0;position:absolute}.grid-line:before,.grid-line:after{content:"";position:absolute;transform:scaleX(0)}.grid-line--horizontal{width:calc(100% + var(--left-offset) + var(--right-offset));height:var(--height);left:calc(var(--left-offset)*-1);background:linear-gradient(to right,var(--color),var(--color)var(--dash-size),transparent 0,transparent);background-size:var(--width)var(--height);-webkit-mask:linear-gradient(to left,var(--background)var(--fade-stop),transparent),linear-gradient(to right,var(--background)var(--fade-stop),transparent),linear-gradient(black,black);-webkit-mask-composite:xor;-webkit-mask-composite:xor;mask-composite:exclude}.grid-line--horizontal:before{content:"";transform:scaleX(0)}.grid-line--vertical{width:var(--height);height:calc(100% + var(--top-offset) + var(--bottom-offset));top:calc(var(--top-offset)*-1);background:linear-gradient(to bottom,var(--color),var(--color)var(--dash-size),transparent 0,transparent);background-size:var(--height)var(--width);-webkit-mask:linear-gradient(to top,var(--background)var(--fade-stop),transparent),linear-gradient(to bottom,var(--background)var(--fade-stop),transparent),linear-gradient(black,black);-webkit-mask-composite:xor;-webkit-mask-composite:xor;mask-composite:exclude}.grid-line--vertical:before{content:"";transform:scaleY(1)}@keyframes lineRevealHorizontal{0%{transform-origin:100%;transform:scaleX(1)}to{transform-origin:100%;transform:scaleX(0)}}@keyframes lineRevealVertical{0%{transform-origin:bottom;transform:scaleY(1)}to{transform-origin:bottom;transform:scaleY(0)}}.grid-line--revealed{opacity:1!important}.grid-line--revealed:before{content:"";background:var(--background);width:100%;height:100%;animation-duration:var(--duration);animation-delay:var(--delay);animation-timing-function:cubic-bezier(.5,.2,.4,1);animation-iteration-count:1;animation-fill-mode:forwards;position:absolute;top:0;left:0}.grid-line--horizontal.grid-line--revealed:before{animation-name:lineRevealHorizontal}.grid-line--vertical.grid-line--revealed:before{animation-name:lineRevealVertical}.corner-marker{z-index:140;pointer-events:none;width:var(--marker-size,10px);height:var(--marker-size,10px);background:var(--marker-color);transform:translate(calc(-50% - var(--marker-nudge-x,1px)),calc(-50% + var(--marker-nudge-y,1px)))rotate(var(--marker-rotation,0deg));position:absolute}.corner-marker--four-point{-webkit-mask:radial-gradient(circle at 0 0,transparent var(--marker-radius,calc(var(--marker-size,10px)/2)),black var(--marker-radius,calc(var(--marker-size,10px)/2))),radial-gradient(circle at 100% 0,transparent var(--marker-radius,calc(var(--marker-size,10px)/2)),black var(--marker-radius,calc(var(--marker-size,10px)/2))),radial-gradient(circle at 0 100%,transparent var(--marker-radius,calc(var(--marker-size,10px)/2)),black var(--marker-radius,calc(var(--marker-size,10px)/2))),radial-gradient(circle at 100% 100%,transparent var(--marker-radius,calc(var(--marker-size,10px)/2)),black var(--marker-radius,calc(var(--marker-size,10px)/2)));mask:radial-gradient(circle at 0 0,transparent var(--marker-radius,calc(var(--marker-size,10px)/2)),black var(--marker-radius,calc(var(--marker-size,10px)/2))),radial-gradient(circle at 100% 0,transparent var(--marker-radius,calc(var(--marker-size,10px)/2)),black var(--marker-radius,calc(var(--marker-size,10px)/2))),radial-gradient(circle at 0 100%,transparent var(--marker-radius,calc(var(--marker-size,10px)/2)),black var(--marker-radius,calc(var(--marker-size,10px)/2))),radial-gradient(circle at 100% 100%,transparent var(--marker-radius,calc(var(--marker-size,10px)/2)),black var(--marker-radius,calc(var(--marker-size,10px)/2)));-webkit-mask-composite:source-in,source-in,source-in,source-in;-webkit-mask-composite:source-in;mask-composite:intersect}.corner-marker--three-point{-webkit-mask:radial-gradient(circle at 0 0,transparent var(--marker-radius,calc(var(--marker-size,10px)/2)),black var(--marker-radius,calc(var(--marker-size,10px)/2))),radial-gradient(circle at 100% 0,transparent var(--marker-radius,calc(var(--marker-size,10px)/2)),black var(--marker-radius,calc(var(--marker-size,10px)/2))),radial-gradient(circle at 0 100%,transparent var(--marker-radius,calc(var(--marker-size,10px)/2)),black var(--marker-radius,calc(var(--marker-size,10px)/2))),linear-gradient(to bottom,black 0 50%,transparent 50% 100%);mask:radial-gradient(circle at 0 0,transparent var(--marker-radius,calc(var(--marker-size,10px)/2)),black var(--marker-radius,calc(var(--marker-size,10px)/2))),radial-gradient(circle at 100% 0,transparent var(--marker-radius,calc(var(--marker-size,10px)/2)),black var(--marker-radius,calc(var(--marker-size,10px)/2))),radial-gradient(circle at 0 100%,transparent var(--marker-radius,calc(var(--marker-size,10px)/2)),black var(--marker-radius,calc(var(--marker-size,10px)/2))),linear-gradient(to bottom,black 0 50%,transparent 50% 100%);-webkit-mask-composite:source-in,source-in,source-in;-webkit-mask-composite:source-in;mask-composite:intersect}.corner-marker--dot{background:var(--marker-color);border-radius:9999px}@keyframes cornerMarkerFadeIn{0%{opacity:0}to{opacity:1}}.corner-marker{opacity:0}.grid-line--revealed~.corner-marker{animation-name:cornerMarkerFadeIn;animation-duration:.3s;animation-timing-function:cubic-bezier(.5,.2,.4,1);animation-delay:2.15s;animation-fill-mode:forwards}.grid-line--no-anim~.corner-marker{opacity:1;animation:none}
/*# sourceMappingURL=ee55832166db163e.css.map*/