.ytv-entry-effect {
	--origin-x: 50vw;
	--origin-y: 24vh;
	position: fixed;
	inset: 0;
	z-index: 999999;
	overflow: hidden;
	pointer-events: none;
	opacity: 0;
	visibility: hidden;
}

.ytv-entry-effect.is-active {
	opacity: 1;
	visibility: visible;
}

.ytv-entry-effect__line {
	position: absolute;
	left: 8vw;
	top: var(--origin-y);
	width: 84vw;
	height: 4px;
	border-radius: 999px;
	background: linear-gradient(90deg, transparent, #e00078 30%, #ff5cbd 50%, #e00078 70%, transparent);
	box-shadow: 0 0 20px rgba(224, 0, 120, .85);
	opacity: 0;
	transform: scaleX(.05);
	transform-origin: center;
}

.ytv-entry-effect.is-active .ytv-entry-effect__line {
	animation: ytv-line-flash 1.35s cubic-bezier(.22, 1, .36, 1) both;
}

.ytv-entry-effect__halo {
	position: absolute;
	left: var(--origin-x);
	top: var(--origin-y);
	width: 32px;
	height: 32px;
	border: 3px solid rgba(255, 69, 180, .9);
	border-radius: 50%;
	box-shadow: 0 0 28px rgba(224, 0, 120, .95), inset 0 0 18px rgba(255, 255, 255, .8);
	opacity: 0;
	transform: translate(-50%, -50%) scale(.2);
}

.ytv-entry-effect.is-active .ytv-entry-effect__halo {
	animation: ytv-halo-pulse 1.45s cubic-bezier(.22, 1, .36, 1) both;
}

.ytv-entry-effect__star {
	position: absolute;
	left: var(--origin-x);
	top: var(--origin-y);
	width: var(--size);
	height: var(--size);
	background: linear-gradient(135deg, #fff 0 12%, #ff75c5 32%, #e00078 72%, #9e0057 100%);
	clip-path: polygon(50% 0%, 61% 34%, 98% 35%, 68% 56%, 79% 94%, 50% 72%, 21% 94%, 32% 56%, 2% 35%, 39% 34%);
	filter: drop-shadow(0 0 7px rgba(255, 64, 174, 1));
	opacity: 0;
	transform: translate(-50%, -50%) scale(.08) rotate(0deg);
}

.ytv-entry-effect__star:nth-of-type(3n) {
	background: linear-gradient(135deg, #fff 0 18%, #ffb4df 40%, #e00078 100%);
}

.ytv-entry-effect__star:nth-of-type(4n) {
	filter: drop-shadow(0 0 10px rgba(224, 0, 120, 1));
}

.ytv-entry-effect.is-active .ytv-entry-effect__star {
	animation: ytv-star-burst 1.65s cubic-bezier(.18, .89, .32, 1.18) var(--delay) both;
}

.ytv-reveal {
	opacity: 0;
	transform: translateY(22px);
	transition: opacity .65s ease, transform .65s cubic-bezier(.22, 1, .36, 1);
	will-change: opacity, transform;
}

.ytv-reveal.ytv-reveal--visible {
	opacity: 1;
	transform: translateY(0);
}

@keyframes ytv-line-flash {
	0% { opacity: 0; transform: scaleX(.04); }
	28% { opacity: 1; }
	72% { opacity: .85; transform: scaleX(1); }
	100% { opacity: 0; transform: scaleX(1.08); }
}

@keyframes ytv-star-burst {
	0% { opacity: 0; transform: translate(-50%, -50%) scale(.08) rotate(0deg); }
	16% { opacity: 1; }
	70% { opacity: 1; }
	100% { opacity: 0; transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(1.25) rotate(160deg); }
}

@keyframes ytv-halo-pulse {
	0% { opacity: 0; transform: translate(-50%, -50%) scale(.15); }
	24% { opacity: 1; }
	100% { opacity: 0; transform: translate(-50%, -50%) scale(8.5); }
}

@media (max-width: 767px) {
	.ytv-entry-effect {
		--origin-y: 19vh;
	}

	.ytv-entry-effect__line {
		left: 4vw;
		width: 92vw;
	}

	.ytv-reveal {
		transform: translateY(14px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.ytv-entry-effect {
		display: none !important;
	}

	.ytv-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}
}
