
@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg)
    }
}

@keyframes gradient {
    0% {
        background: linear-gradient(99deg, #fff400, #ff5194, #d25dff, #23d5ab);
        background-size: 400% 400%;
        background-position: 0% 50%;
    }

    50% {
        background: linear-gradient(99deg, #fff400, #ff5194, #d25dff, #23d5ab);
        background-size: 400% 400%;
        background-position: 100% 50%;
    }

    100% {
        background: linear-gradient(99deg, #fff400, #ff5194, #d25dff, #23d5ab);
        background-size: 400% 400%;
        background-position: 0% 50%;
    }
}

@keyframes breathe {
    0% {
        opacity: 0.7;
        transform: translateY(3px);
    }

    50% {
        opacity: 1;
        transform: translateY(0);
    }

    100% {
        opacity: 0.7;
        transform: translateY(3px);
    }
}

@keyframes subtle-pulse {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(200, 200, 200, 0.4);
    }

    70% {
        transform: scale(1.05);
        box-shadow: 0 0 10px 15px rgba(200, 200, 200, 0);
    }

    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(200, 200, 200, 0);
    }
}

@keyframes subtle-pulse-ai {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.2);
    }

    70% {
        transform: scale(1.05);
        box-shadow: 0 0 10px 15px rgba(255, 255, 255, 0);
    }

    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
}


@keyframes pulse-final-node {
    0% {
        box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.05);
    }

    50% {
        box-shadow: 0 0 0 8px rgba(0, 0, 0, 0.1);
    }

    100% {
        box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.05);
    }
}



@keyframes pulse-final-node-2 {
    0% {
        box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.01);
    }

    50% {
        box-shadow: 0 0 0 8px rgba(0, 0, 0, 0.2);
    }

    100% {
        box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.01);
    }
}


@keyframes spin {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

@keyframes shine {
	100% {
		background-position: 200%;
		opacity: 0;
	}
}



@keyframes scroll-indicator-anim {
	0% {
		transform: scaleY(0);
		transform-origin: top;
	}

	50% {
		transform: scaleY(1);
		transform-origin: top;
	}

	51% {
		transform: scaleY(1);
		transform-origin: bottom;
	}

	100% {
		transform: scaleY(0);
		transform-origin: bottom;
	}
}


@keyframes opacity{
	0%{
		opacity:0;
	}
	90%{
		opacity:0;
	}
	100%{
		opacity:1;
	}
}