:root {
    --cursor-size: 24px;
    --background: #f2f2f2;
}

[data-hover] {
    position: relative;

    [data-hover-bounds] {
        position: absolute;
        left: 0;
        top: 0;
        inset: 0;

        /* 		outline: 1px solid red; */
    }

    &:hover {
        [data-hover-bounds] {
            transform: scale(4);
        }
    }
}

.cursor {
    width: var(--cursor-size);
    height: var(--cursor-size);
    border-radius: 50%;

    position: fixed;
    left: 0;
    top: 0;
    transform: translate(-50%, -50%);

    background: var(--background);
    mix-blend-mode: difference;
    pointer-events: none;
}