/* cursor-glow.css — zachte lichtcirkel die de cursor volgt. Uiterlijk verschilt
 * per thema (cursor-glow.js zet altijd `.is-active`; reduced-motion/touch = uit):
 *   - licht thema : warme tint via `multiply` → zichtbaar op wit
 *   - dim/donker  : warm licht via `screen`   → gloeit op tegen donker
 *
 * Positie via --gx/--gy (px, JS). Kleur/blend per thema via tokens hieronder;
 * overschrijfbaar via --cursor-glow-color / --cursor-glow-color-light / -size.
 */
.mm-cursor-glow {
    position: fixed;
    inset: 0;
    z-index: 9990;
    pointer-events: none;
    opacity: 0;
    transition: opacity .45s var(--ease-out, ease);
    background: radial-gradient(
        var(--cursor-glow-size, 240px) var(--cursor-glow-size, 240px)
        at var(--gx, 50%) var(--gy, 50%),
        var(--cursor-glow-tint, rgba(214, 158, 80, .075)) 0%,
        transparent 70%);
    mix-blend-mode: var(--cursor-glow-blend, multiply);
}
.mm-cursor-glow.is-active {
    opacity: 1;
}

/* Licht thema (default): warme tint die op wit zichtbaar wordt via multiply. */
:root {
    --cursor-glow-blend: multiply;
    --cursor-glow-tint:  var(--cursor-glow-color-light, rgba(214, 158, 80, .075));
}
/* Dim/donker: warm licht dat optelt via screen. */
@media (prefers-color-scheme: dark) {
    :root {
        --cursor-glow-blend: screen;
        --cursor-glow-tint:  var(--cursor-glow-color, rgba(255, 214, 130, .16));
    }
}
:root[data-color-scheme="light"] {
    --cursor-glow-blend: multiply;
    --cursor-glow-tint:  var(--cursor-glow-color-light, rgba(214, 158, 80, .075));
}
:root[data-color-scheme="dark"] {
    --cursor-glow-blend: screen;
    --cursor-glow-tint:  var(--cursor-glow-color, rgba(255, 214, 130, .16));
}

@media (prefers-reduced-motion: reduce) {
    .mm-cursor-glow { display: none; }
}
