/* Performance Optimizations and Loading States */

/* Reduced motion for better performance */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Loading overlay improvements */
.loading-sequence {
    backdrop-filter: blur(5px);
}

.loading-sequence:hover .skip-text {
    color: #00ff41 !important;
    text-shadow: 0 0 10px #00ff41;
}

/* Performance mode indicators */
.performance-indicator {
    position: fixed;
    bottom: 20px;
    right: 20px;
    padding: 10px 15px;
    background: rgba(0, 0, 0, 0.8);
    border: 1px solid rgba(0, 255, 65, 0.3);
    border-radius: 5px;
    color: #00ff41;
    font-size: 0.8rem;
    z-index: 1000;
    opacity: 0.7;
}

/* Optimized animations for low-end devices */
.low-performance .matrix-char {
    animation-duration: 4s !important;
}

.low-performance .particle {
    animation-duration: 8s !important;
}

.low-performance .cyber-grid {
    animation: none !important;
}

/* Skip button styling */
.skip-loading {
    background: rgba(0, 255, 65, 0.1);
    border: 1px solid rgba(0, 255, 65, 0.3);
    border-radius: 5px;
    padding: 10px 20px;
    margin-top: 20px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.skip-loading:hover {
    background: rgba(0, 255, 65, 0.2);
    border-color: #00ff41;
    transform: scale(1.05);
}