html {
    background-color: #000;
}

.mhk-cursor-glow-zone {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}

.mhk-cursor-glow-zone > .mhk-cursor-zone-content-layer {
    position: relative;
    z-index: 2;
}

.mhk-cursor-zone-glow {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
    border-radius: inherit;
    opacity: 0;
    transition: opacity .22s ease;
    will-change: opacity;
}

/* Großer, weicher Premium-Halo. */
.mhk-cursor-zone-glow::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background:
        radial-gradient(
            circle calc(var(--mhk-cursor-glow-size, 360px) * .78)
            at var(--mhk-zone-glow-x, -9999px) var(--mhk-zone-glow-y, -9999px),
            rgba(255, 235, 168, calc(var(--mhk-cursor-glow-opacity, .18) * .42)) 0%,
            rgba(var(--mhk-cursor-glow-rgb, 214, 182, 84), var(--mhk-cursor-glow-opacity, .18)) 14%,
            rgba(161, 113, 34, calc(var(--mhk-cursor-glow-opacity, .18) * .48)) 38%,
            rgba(var(--mhk-cursor-glow-rgb, 214, 182, 84), 0) var(--mhk-cursor-glow-softness, 70%)
        );
    filter: saturate(1.08);
}

/* Kleiner Lichtkern für einen edleren, tieferen Effekt. */
.mhk-cursor-zone-glow::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background:
        radial-gradient(
            circle calc(var(--mhk-cursor-glow-size, 360px) * .27)
            at var(--mhk-zone-glow-x, -9999px) var(--mhk-zone-glow-y, -9999px),
            rgba(255, 247, 210, calc(var(--mhk-cursor-glow-opacity, .18) * .50)) 0%,
            rgba(232, 198, 99, calc(var(--mhk-cursor-glow-opacity, .18) * .30)) 24%,
            rgba(214, 182, 84, 0) 72%
        );
    filter: blur(5px);
    opacity: .82;
}

.mhk-cursor-glow-zone.is-glow-active > .mhk-cursor-zone-glow {
    opacity: 1;
}

/* Der Inhalt bleibt immer klar über dem Licht. */
.mhk-cursor-glow-zone :where(h1,h2,h3,h4,h5,h6,p,li,a,button,input,textarea,select,label,img,svg,iframe,video) {
    position: relative;
    z-index: 2;
}

@media (hover: none), (pointer: coarse) {
    .mhk-cursor-zone-glow {
        display: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mhk-cursor-zone-glow {
        display: none !important;
    }
}