.animate-character {
    background: linear-gradient(
            10deg,
            #cbcbdd,
            #0c857c,
            #f805ec,
            #fff800
    );
    background-size: 400% 400%;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: slowColorShift 12s ease-in-out infinite alternate;
}

/* Slowly drifting color gradient */
@keyframes slowColorShift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* --- STATIC NOISE LAYER --- */
.animate-character::after {
    position: absolute;
    inset: 0;
    background-image: repeating-linear-gradient(
            0deg,
            rgba(255, 255, 255, 0.05) 0px,
            rgba(255, 255, 255, 0.05) 1px,
            transparent 2px,
            transparent 3px
    ),
    repeating-linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.02) 0px,
            rgba(255, 255, 255, 0.02) 1px,
            transparent 3px,
            transparent 4px
    );
    background-size: 100% 100%;
    mix-blend-mode: overlay;
    opacity: 0.25;
    animation: noiseMove 0.3s steps(2, end) infinite;
    pointer-events: none;
}

/* Flickering static */
@keyframes noiseMove {
    0% { transform: translate(0, 0); }
    25% { transform: translate(-1px, 1px); }
    50% { transform: translate(1px, -1px); }
    75% { transform: translate(0, 1px); }
    100% { transform: translate(0, 0); }
}