.page-light {
    position: fixed;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100lvh;
    overflow: hidden;
    background: var(--color-page);
    pointer-events: none;
}

/* Static rendition of the dawn mood: shown without WebGL, raised by the page light script. */
.page-light::before {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(
            ellipse 34% 46% at 90% 12%,
            color-mix(in srgb, var(--color-action) 42%, transparent),
            transparent
        ),
        radial-gradient(
            ellipse 32% 58% at 7% 74%,
            color-mix(in srgb, var(--color-turquoise) 44%, transparent),
            transparent
        );
    content: "";
    opacity: var(--page-light-rise, 1);
}

.page-light__canvas {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    visibility: hidden;
}

.page-light.is-live .page-light__canvas {
    visibility: visible;
}