/* 
 * Video Effects Stylesheet
 * Contains specific artistic effects for video playback (Hallucinations, Glitches, etc.)
 */

.hallucination-effect {
    /* Performance Optimization: Hint browser to use GPU */
    will-change: transform, filter;
    /* Wavy, breathing distortion */
    animation: wavy-hallucination 4s infinite ease-in-out, vignette-pulse 4s infinite ease-in-out;
    filter: contrast(1.2) saturate(1.4);
}

@keyframes wavy-hallucination {
    0%, 100% {
        transform: scale(1) skew(0deg);
        filter: contrast(1.2) saturate(1.4) hue-rotate(0deg);
    }
    25% {
        transform: scale(1.02) skew(2deg) rotate(1deg);
        filter: contrast(1.3) saturate(1.6) hue-rotate(15deg);
    }
    50% {
        transform: scale(1.01) skew(-2deg) rotate(-1deg);
        filter: contrast(1.2) saturate(1.4) hue-rotate(0deg);
    }
    75% {
        transform: scale(1.03) skew(1deg);
        filter: contrast(1.3) saturate(1.6) hue-rotate(-15deg);
    }
}

/* Intense Hallucination (Second Event) */
.hallucination-effect-intense {
    will-change: transform, filter;
    /* Fast, disorienting jitter (Double Vision simulation via rapid movement) */
    animation: intense-trip 0.15s infinite steps(2), vignette-pulse 1.5s infinite ease-in-out; /* steps(2) reduces interpolation cost */
    filter: contrast(1.5) saturate(2.0);
}

@keyframes intense-trip {
    0% {
        transform: translate(2px, 1px) scale(1.05);
        filter: hue-rotate(0deg) invert(0);
    }
    25% {
        transform: translate(-2px, -1px) scale(1.1) skew(3deg);
        filter: hue-rotate(90deg) invert(0.1);
    }
    50% {
        transform: translate(1px, 2px) scale(1.05) skew(-3deg);
        filter: hue-rotate(180deg) invert(0);
    }
    75% {
        transform: translate(-1px, -2px) scale(1.1);
        filter: hue-rotate(270deg) invert(0.1);
    }
    100% {
        transform: translate(0, 0) scale(1.05);
        filter: hue-rotate(0deg);
    }
}

@keyframes vignette-pulse {
    0%, 100% {
        box-shadow: inset 0 0 150px 75px rgba(0,0,0,0.6);
    }
    50% {
        box-shadow: inset 0 0 250px 125px rgba(0,0,0,0.9);
    }
}