/* ================================
   Animations & Effects
   ================================ */

/* Screen Flicker Effect */
@keyframes flicker {
    0% { opacity: 0.97; }
    5% { opacity: 0.9; }
    10% { opacity: 0.97; }
    15% { opacity: 0.92; }
    20% { opacity: 0.97; }
    100% { opacity: 0.97; }
}

.screen {
    animation: flicker 5s infinite;
}

/* CRT Turn On */
@keyframes crtOn {
    0% {
        transform: scaleY(0.01) scaleX(0);
        filter: brightness(30);
    }
    30% {
        transform: scaleY(0.01) scaleX(1);
        filter: brightness(5);
    }
    50% {
        transform: scaleY(0.5) scaleX(1);
        filter: brightness(2);
    }
    100% {
        transform: scaleY(1) scaleX(1);
        filter: brightness(1);
    }
}

.screen.turning-on {
    animation: crtOn 0.5s ease-out forwards;
}

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

.app-window.shake {
    animation: shake 0.5s ease-in-out;
}

/* Bounce In */
@keyframes bounceIn {
    0% {
        transform: scale(0.3);
        opacity: 0;
    }
    50% {
        transform: scale(1.05);
        opacity: 1;
    }
    70% {
        transform: scale(0.95);
    }
    100% {
        transform: scale(1);
    }
}

.bounce-in {
    animation: bounceIn 0.5s ease-out;
}

/* Fade Slide In */
@keyframes fadeSlideIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-slide-in {
    animation: fadeSlideIn 0.3s ease-out;
}

/* Key Press Visual Feedback */
.key.animate-press {
    animation: keyPress 0.15s ease-out;
}

@keyframes keyPress {
    0% {
        transform: translateY(0);
        box-shadow: 0 3px 0 #999, 0 4px 5px rgba(0,0,0,0.2);
    }
    50% {
        transform: translateY(3px);
        box-shadow: 0 0 0 #999, 0 1px 2px rgba(0,0,0,0.2);
    }
    100% {
        transform: translateY(0);
        box-shadow: 0 3px 0 #999, 0 4px 5px rgba(0,0,0,0.2);
    }
}

/* Glow Effect */
@keyframes glowPulse {
    0%, 100% {
        box-shadow: 0 0 5px currentColor, 0 0 10px currentColor;
    }
    50% {
        box-shadow: 0 0 10px currentColor, 0 0 20px currentColor, 0 0 30px currentColor;
    }
}

.glow {
    animation: glowPulse 2s ease-in-out infinite;
}

/* Typing Effect */
@keyframes typing {
    from { width: 0; }
    to { width: 100%; }
}

.typing-text {
    overflow: hidden;
    white-space: nowrap;
    animation: typing 2s steps(40) forwards;
}

/* Screen Scanline Move */
@keyframes scanline {
    0% { top: 0%; }
    100% { top: 100%; }
}

.crt-effect::before {
    animation: none;
}

/* Rainbow Animation for Special Elements */
@keyframes rainbow {
    0% { filter: hue-rotate(0deg); }
    100% { filter: hue-rotate(360deg); }
}

.rainbow-animate {
    animation: rainbow 5s linear infinite;
}

/* Pixel Fade */
@keyframes pixelFade {
    0% {
        opacity: 1;
        filter: blur(0);
    }
    50% {
        opacity: 0.5;
        filter: blur(2px);
    }
    100% {
        opacity: 0;
        filter: blur(5px);
    }
}

/* Float Animation */
@keyframes floatUp {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
}

.float {
    animation: floatUp 3s ease-in-out infinite;
}

/* Spin */
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.spin {
    animation: spin 2s linear infinite;
}

/* Retro TV Static */
@keyframes static {
    0% { background-position: 0 0; }
    100% { background-position: 100% 100%; }
}

.tv-static {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
    animation: static 0.5s steps(10) infinite;
    opacity: 0.05;
    pointer-events: none;
}

/* Window Minimize */
@keyframes windowMinimize {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(0) translateY(100px);
        opacity: 0;
    }
}

.minimizing {
    animation: windowMinimize 0.3s ease-in forwards;
}

/* Window Close */
@keyframes windowClose {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(0.8);
        opacity: 0;
    }
}

.closing {
    animation: windowClose 0.2s ease-in forwards;
}

/* Tooltip Appear */
@keyframes tooltipAppear {
    from {
        opacity: 0;
        transform: translateY(5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.tooltip {
    animation: tooltipAppear 0.2s ease-out;
}

/* Photo Flash */
@keyframes flash {
    0% { opacity: 0; }
    50% { opacity: 1; }
    100% { opacity: 0; }
}

.camera-flash {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;
    pointer-events: none;
    animation: flash 0.3s ease-out;
    z-index: 99999;
}

/* Button Hover Lift */
.btn-lift {
    transition: transform 0.2s, box-shadow 0.2s;
}

.btn-lift:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
}

/* Icon Bounce */
@keyframes iconBounce {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(-10px); }
    60% { transform: translateY(-5px); }
}

.icon-bounce:hover {
    animation: iconBounce 0.8s ease;
}

/* Progress Bar */
@keyframes progressStripe {
    0% { background-position: 0 0; }
    100% { background-position: 40px 0; }
}

.progress-striped {
    background-image: linear-gradient(
        45deg,
        rgba(255, 255, 255, 0.15) 25%,
        transparent 25%,
        transparent 50%,
        rgba(255, 255, 255, 0.15) 50%,
        rgba(255, 255, 255, 0.15) 75%,
        transparent 75%,
        transparent
    );
    background-size: 40px 40px;
    animation: progressStripe 1s linear infinite;
}
