/* animations.css — all @keyframes */

@keyframes crt-flicker {
    0%   { opacity: 0.27; }  5%  { opacity: 0.34; }
    10%  { opacity: 0.27; }  15% { opacity: 0.34; }
    20%  { opacity: 0.30; }  25% { opacity: 0.34; }
    30%  { opacity: 0.27; }  35% { opacity: 0.34; }
    40%  { opacity: 0.30; }  45% { opacity: 0.27; }
    50%  { opacity: 0.34; }  55% { opacity: 0.30; }
    60%  { opacity: 0.27; }  65% { opacity: 0.34; }
    70%  { opacity: 0.30; }  75% { opacity: 0.34; }
    80%  { opacity: 0.27; }  85% { opacity: 0.30; }
    90%  { opacity: 0.34; }  95% { opacity: 0.27; }
    100% { opacity: 0.30; }
}

@keyframes blink {
    50% { opacity: 0; }
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

@keyframes fade-up {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes logo-glow {
    from { text-shadow: 0 0 20px var(--green-glow); }
    to   { text-shadow: 0 0 40px var(--green-glow), 0 0 60px var(--green-glow); }
}

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

@keyframes glitch {
    0%   { transform: translate(0);      filter: hue-rotate(0deg); }
    10%  { transform: translate(-2px,2px); filter: hue-rotate(90deg); }
    20%  { transform: translate(2px,-2px); filter: hue-rotate(180deg); }
    30%  { transform: translate(-2px,-2px); filter: hue-rotate(270deg); }
    40%  { transform: translate(2px,2px); filter: hue-rotate(360deg); }
    50%  { transform: translate(-2px,2px); filter: hue-rotate(90deg); }
    60%  { transform: translate(2px,-2px); filter: hue-rotate(0deg); }
    70%  { transform: translate(-2px,-2px); }
    80%  { transform: translate(2px,2px); }
    90%  { transform: translate(-2px,2px); }
    100% { transform: translate(0); }
}
.glitch { animation: glitch 0.5s linear; }

@keyframes glitch-icon {
    0%,100% { opacity: 1; transform: translate(0); }
    10%     { opacity: 0.8; transform: translate(-2px,1px); }
    20%     { opacity: 1;   transform: translate(1px,-1px); }
    30%     { opacity: 0.9; transform: translate(-1px,2px); }
    40%     { opacity: 1;   transform: translate(0); }
    90%     { opacity: 1;   transform: translate(0); }
    92%     { opacity: 0.8; transform: translate(2px,1px); }
    94%     { opacity: 1;   transform: translate(-1px,-1px); }
    96%     { opacity: 0.9; transform: translate(1px,0); }
    98%     { opacity: 1;   transform: translate(0); }
}
