.loader{position:relative;display:inline-flex;height:60px;width:60px}.loader-spinner{position:absolute}@keyframes spin{to{transform:rotate(360deg)}}.loader-spinner{animation:spin 1s linear infinite;display:inline-block;height:100%;width:100%;border-radius:100vw;background-size:100% 100%;background-position:0px 0px;background-image:conic-gradient(from 0deg at 50% 50%,var(--app-primary-600) 0%,rgb(229,231,235,.8) 90deg,rgb(229,231,235,.8) 270deg,var(--app-primary-600) 360deg);-webkit-mask-composite:destination-out;-webkit-mask:radial-gradient(farthest-side,#000 98%,#0000) center/85% 85% no-repeat,linear-gradient(#000 0 0);mask:radial-gradient(farthest-side,#000 98%,#0000) center/85% 85% no-repeat,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.loader-image{position:absolute;top:50%;left:50%;height:40%;width:40%;--tw-translate-x: -50%;--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.dark .loader-spinner{background-image:conic-gradient(from 0deg at 50% 50%,var(--app-primary-500) 0%,rgb(229,231,235,.2) 90deg,rgb(229,231,235,.2) 270deg,var(--app-primary-500) 360deg)}