/**
 * VIK AUTO TRADING - Visual Effects
 *
 * - 금색 파티클
 * - 커서 글로우
 * - 페이지 전환
 */

/* ==========================================
   PARTICLES
========================================== */

.particles {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: calc(var(--z-content) - 1);
    overflow: hidden;
}

.particles__item {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    will-change: transform, opacity;
}

/* ==========================================
   CURSOR GLOW
========================================== */

.cursor-glow {
    position: fixed;
    width: 300px;
    height: 300px;
    background: radial-gradient(
        circle,
        var(--color-gold-faint) 0%,
        transparent 70%
    );
    border-radius: 50%;
    pointer-events: none;
    z-index: var(--z-cursor);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0;
    -webkit-transition: opacity var(--duration-fast) var(--ease-out);
    -o-transition: opacity var(--duration-fast) var(--ease-out);
    transition: opacity var(--duration-fast) var(--ease-out);
    will-change: left, top;
}

.cursor-glow.is-visible {
    opacity: 1;
}

/* Hide on touch devices */
@media (hover: none) {
    .cursor-glow {
        display: none;
    }
}


/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {
    .particles__item,
    .cursor-glow {
        -webkit-animation: none !important;
        animation: none !important;
        -webkit-transition: none !important;
        -o-transition: none !important;
        transition: none !important;
    }
}