:root {
    --na-platform-pointer-x: 50vw;
    --na-platform-pointer-y: 28vh;
}

.na-shell::after,
.na-landing-shell::after,
.stream-layout-shell::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    pointer-events: none;
    background:
        radial-gradient(42rem circle at var(--na-platform-pointer-x) var(--na-platform-pointer-y), rgba(87, 191, 255, .13), transparent 61%),
        radial-gradient(34rem circle at calc(var(--na-platform-pointer-x) + 10vw) calc(var(--na-platform-pointer-y) + 8vh), rgba(214, 73, 255, .095), transparent 67%),
        radial-gradient(34rem circle at 6% 8%, rgba(15, 153, 255, .09), transparent 68%),
        radial-gradient(42rem circle at 92% 14%, rgba(111, 66, 193, .075), transparent 70%);
    opacity: .82;
    transition: opacity .32s ease;
}

/* Path Builder ya provee su propio campo de puntero más expresivo. */
.na-landing-shell:has(.na-public-shell.na-motion-mounted)::after {
    opacity: 0;
}

.stream-layout-shell .na-bg-grid,
.stream-layout-shell .na-bg-network {
    z-index: 0;
}

.stream-layout-shell::after {
    z-index: 0;
}

.stream-layout-shell > :not(.na-bg-grid):not(.na-bg-network) {
    position: relative;
    z-index: 1;
}

:root[data-theme="light"] .na-shell::after,
:root[data-theme="light"] .na-landing-shell::after,
:root[data-theme="light"] .stream-layout-shell::after,
html[data-na-theme="light"] .na-shell::after,
html[data-na-theme="light"] .na-landing-shell::after,
html[data-na-theme="light"] .stream-layout-shell::after {
    background:
        radial-gradient(42rem circle at var(--na-platform-pointer-x) var(--na-platform-pointer-y), rgba(65, 142, 222, .11), transparent 61%),
        radial-gradient(34rem circle at calc(var(--na-platform-pointer-x) + 10vw) calc(var(--na-platform-pointer-y) + 8vh), rgba(151, 87, 226, .075), transparent 67%),
        radial-gradient(34rem circle at 6% 8%, rgba(57, 122, 211, .07), transparent 68%);
    opacity: .58;
}

@media (prefers-reduced-motion: reduce), (hover: none), (pointer: coarse) {
    .na-shell::after,
    .na-landing-shell::after,
    .stream-layout-shell::after {
        opacity: .48;
        transition: none;
    }
}