/* ========================================
   DUAL CURSOR SYSTEM
======================================== */

.cursor-frame-square {
    position: fixed;
    width: 300px;
    height: 300px;
    border: 2px solid #FFFFFF;
    pointer-events: none;
    z-index: 9998;
    mix-blend-mode: difference;
    display: none;
}

.cursor-cross {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.cursor-cross::before, .cursor-cross::after {
    content: '';
    position: absolute;
    background: #FFFFFF;
}

.cursor-cross::before {
    width: 24px;
    height: 2px;
    top: -1px;
    left: -12px;
}

.cursor-cross::after {
    width: 2px;
    height: 24px;
    top: -12px;
    left: -1px;
}

.cursor-circle {
    position: fixed;
    width: 40px;
    height: 40px;
    border: 2px solid var(--accent);
    border-radius: 50%;
    pointer-events: none;
    z-index: 9999;
    transition: all 0.15s ease;
}

.cursor-dot {
    position: fixed;
    width: 8px;
    height: 8px;
    background: var(--accent);
    border-radius: 50%;
    pointer-events: none;
    z-index: 10000;
    transition: all 0.1s ease;
}