@media (pointer: fine) {
    .cursor-box {
        height: 20px;
        width: 20px;
        border: 2px solid #333;
        opacity: 1;

        z-index: 9999;
        pointer-events: none;

        position: fixed;
        top: 0;
        left: 0;

        transform-style: preserve-3d;
    }

    .cursor-border {
        position: fixed;
        /*clip-path: polygon(0px 0px, 100px 0px, 100px 100px, 0px 100px);*/
        /*background-color: green;*/
        /*border: 2px solid yellow;*/
        pointer-events: none;
    }

    .cursor-follower {
        height: 10px;
        width: 10px;
        background-color: #46eadb;
        border: 2px solid rgba(185, 21, 36, 0);
        opacity: 1;
        mix-blend-mode: difference;

        z-index: 9998;
        pointer-events: none;

        position: fixed;
        top: 0;
        left: 0;
    }

}

@media (pointer: coarse) {
    .cursor-follower,
    .cursor-border, .cursor-box {
        display: none
    }
}

@media (hover: none) {
    .cursor-follower,
    .cursor-border, .cursor-box {
        display: none
    }
}