/* 暗夜水晶 — 星星吉祥物光晕 */
html.dark .cute-star,
html.dark .cute-star-small {
	filter: drop-shadow(0 0 8px rgba(99, 102, 241, 0.5));
}

html.dark .cute-star:hover,
html.dark .cute-star-small:hover {
	filter: drop-shadow(0 0 14px rgba(139, 92, 246, 0.6));
}

/* Cute Star Logo Animations */
.cute-star {
	cursor: pointer;
	transition: transform 0.3s ease;
	transform-origin: center bottom;
}

.cute-star:hover {
	transform: scale(1.08);
}

.cute-star:hover .star-eyes ellipse {
	animation: blink 0.3s ease-in-out 2;
}

.cute-star.clicked {
	animation: starPop 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

@keyframes starPop {
	0% {
		transform: scale(1) rotate(0deg);
	}
	40% {
		transform: scale(0.85) rotate(-8deg);
	}
	70% {
		transform: scale(1.15) rotate(5deg);
	}
	100% {
		transform: scale(1) rotate(0deg);
	}
}

.star-float {
	animation: gentleFloat 4s ease-in-out infinite;
	transform-origin: center bottom;
}

@keyframes gentleFloat {
	0%,
	100% {
		transform: translateY(0) rotate(0deg);
	}
	25% {
		transform: translateY(-8px) rotate(-1deg);
	}
	50% {
		transform: translateY(-12px) rotate(0deg);
	}
	75% {
		transform: translateY(-8px) rotate(1deg);
	}
}

.mini-star {
	animation: sparkle 2s ease-in-out infinite;
}

.mini-star.left {
	animation-delay: 0s;
}

.mini-star.right {
	animation-delay: 1s;
}

@keyframes sparkle {
	0%,
	100% {
		transform: scale(1) rotate(0deg);
		opacity: 0.6;
	}
	50% {
		transform: scale(1.4) rotate(20deg);
		opacity: 1;
	}
}

.star-eyes ellipse {
	animation: autoBlink 5s ease-in-out infinite;
	transform-origin: center;
}

@keyframes autoBlink {
	0%,
	45%,
	55%,
	100% {
		transform: scaleY(1);
	}
	50% {
		transform: scaleY(0.1);
	}
}

.cute-star:hover .star-eyes ellipse {
	animation: happyBlink 0.4s ease-in-out 2;
}

@keyframes happyBlink {
	0%,
	100% {
		transform: scaleY(1);
	}
	50% {
		transform: scaleY(0.15);
	}
}

.cute-star-small {
	cursor: pointer;
	transition: transform 0.2s ease;
}

.cute-star-small:hover {
	transform: scale(1.1);
}

.cute-star-small.clicked {
	animation: starPopSmall 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

@keyframes starPopSmall {
	0% {
		transform: scale(1) rotate(0deg);
	}
	40% {
		transform: scale(0.9) rotate(-10deg);
	}
	70% {
		transform: scale(1.1) rotate(8deg);
	}
	100% {
		transform: scale(1) rotate(0deg);
	}
}

.star-float-small {
	animation: gentleFloatSmall 3s ease-in-out infinite;
	transform-origin: center;
}

@keyframes gentleFloatSmall {
	0%,
	100% {
		transform: translateY(0) rotate(0deg);
	}
	50% {
		transform: translateY(-3px) rotate(2deg);
	}
}