/* Стили для иконок Font Awesome */
.fa, .fas, .far, .fal, .fab {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
}

/* Дополнительная иконка для сетевых графов */
.fa-chart-network:before {
    content: "\f78a"; /* Используем иконку network-wired */
}

/* Стили для частиц */
.particle {
    position: absolute;
    background: linear-gradient(90deg, var(--color-accent-blue), var(--color-accent-purple));
    border-radius: 50%;
    opacity: 0.5;
    animation: float infinite linear;
    box-shadow: 0 0 10px rgba(0, 194, 255, 0.5);
}

/* Анимация для частиц */
@keyframes float {
    0% {
        transform: translate(0, 0) scale(1);
        opacity: 0;
    }
    25% {
        opacity: 0.5;
        transform: translate(50px, -50px) scale(1.2);
    }
    75% {
        opacity: 0.5;
        transform: translate(100px, -80px) scale(0.8);
    }
    100% {
        transform: translate(150px, -100px) scale(1);
        opacity: 0;
    }
}

/* Стили для эффекта свечения */
.glow-effect {
    position: relative;
}

.glow-effect::before {
    content: '';
    position: absolute;
    top: -5px;
    left: -5px;
    right: -5px;
    bottom: -5px;
    background: linear-gradient(45deg, var(--color-accent-blue), var(--color-accent-purple));
    z-index: -1;
    filter: blur(15px);
    opacity: 0;
    transition: opacity 0.3s ease;
    border-radius: inherit;
}

.glow-effect:hover::before {
    opacity: 0.7;
}

/* Стили для фона с "звездами" */
.star {
    position: fixed;
    width: 2px;
    height: 2px;
    background: white;
    border-radius: 50%;
    opacity: 0.5;
    animation: twinkle var(--twinkle-duration) infinite ease-in-out;
    animation-delay: var(--twinkle-delay);
}

@keyframes twinkle {
    0%, 100% { opacity: 0.2; }
    50% { opacity: 0.8; }
}