/* Glitch Effects */
#glitch-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 1000;
}

#glitch-overlay.active {
    animation: glitch-overlay 0.3s linear;
}

@keyframes glitch-overlay {
    0% {
        background: transparent;
    }
    10% {
        background: rgba(51, 255, 51, 0.05);
        transform: translateX(-2px);
    }
    20% {
        background: transparent;
        transform: translateX(2px);
    }
    30% {
        background: rgba(255, 51, 51, 0.03);
        transform: translateY(-1px);
    }
    40% {
        background: transparent;
        transform: translateY(1px);
    }
    50% {
        background: rgba(51, 255, 51, 0.02);
    }
    100% {
        background: transparent;
        transform: translate(0);
    }
}

/* Text Glitch */
.glitch-text {
    animation: glitch-text 0.5s linear infinite;
}

@keyframes glitch-text {
    0% {
        text-shadow: 2px 0 red, -2px 0 cyan;
    }
    25% {
        text-shadow: -2px 0 red, 2px 0 cyan;
    }
    50% {
        text-shadow: 2px 2px red, -2px -2px cyan;
    }
    75% {
        text-shadow: -2px 2px red, 2px -2px cyan;
    }
    100% {
        text-shadow: 2px 0 red, -2px 0 cyan;
    }
}

/* Cursor Blink */
.cursor-blink {
    animation: blink 1s step-end infinite;
}

@keyframes blink {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
}

/* Scanlines */
.scanlines::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(
        0deg,
        rgba(0, 0, 0, 0.1),
        rgba(0, 0, 0, 0.1) 1px,
        transparent 1px,
        transparent 2px
    );
    pointer-events: none;
    z-index: 999;
}

/* CRT Effect */
.crt::after {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(
        ellipse at center,
        transparent 0%,
        rgba(0, 0, 0, 0.3) 100%
    );
    pointer-events: none;
    z-index: 998;
}

/* Flicker */
.flicker {
    animation: flicker 0.15s infinite;
}

@keyframes flicker {
    0% {
        opacity: 0.97;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0.98;
    }
}

/* Screen shake */
.shake {
    animation: shake 0.5s linear;
}

@keyframes shake {
    0%, 100% {
        transform: translateX(0);
    }
    10%, 30%, 50%, 70%, 90% {
        transform: translateX(-5px);
    }
    20%, 40%, 60%, 80% {
        transform: translateX(5px);
    }
}

/* Typing effect */
.typing {
    overflow: hidden;
    white-space: nowrap;
    animation: typing 2s steps(40, end);
}

@keyframes typing {
    from {
        width: 0;
    }
    to {
        width: 100%;
    }
}
