.favorite-loader {
	&.bars1 {
		width: 90rpx;
		aspect-ratio: 1;
		--bars1: #000;
		background:
			no-repeat linear-gradient(var(--bars1) 0 0) 0% 50%,
			no-repeat linear-gradient(var(--bars1) 0 0) 50% 50%,
			no-repeat linear-gradient(var(--bars1) 0 0) 100% 50%;
		background-size: 20% 100%;
		animation: bars-l1 1s infinite linear;
	}

	@keyframes bars-l1 {
		0% {
			background-size: 20% 100%, 20% 100%, 20% 100%
		}

		33% {
			background-size: 20% 10%, 20% 100%, 20% 100%
		}

		50% {
			background-size: 20% 100%, 20% 10%, 20% 100%
		}

		66% {
			background-size: 20% 100%, 20% 100%, 20% 10%
		}

		100% {
			background-size: 20% 100%, 20% 100%, 20% 100%
		}
	}

	&.bars2 {
		width: 90rpx;
		aspect-ratio: 1;
		--bars2: #000;
		background:
			no-repeat linear-gradient(var(--bars2) 0 0) 0% 100%,
			no-repeat linear-gradient(var(--bars2) 0 0) 50% 100%,
			no-repeat linear-gradient(var(--bars2) 0 0) 100% 100%;
		animation: bars-l2 1s infinite linear;
	}

	@keyframes bars-l2 {
		0% {
			background-size: 20% 100%, 20% 100%, 20% 100%
		}

		20% {
			background-size: 20% 60%, 20% 100%, 20% 100%
		}

		40% {
			background-size: 20% 80%, 20% 60%, 20% 100%
		}

		60% {
			background-size: 20% 100%, 20% 80%, 20% 60%
		}

		80% {
			background-size: 20% 100%, 20% 100%, 20% 80%
		}

		100% {
			background-size: 20% 100%, 20% 100%, 20% 100%
		}
	}
}