/* =========================================================
   EDGEOVEREDGE // PERIODIC SPECULAR SWEEP
   Diffuse global broadcast-glass reflection for public pages.
   ========================================================= */
html::before,
html::after {
    content: "";
    position: fixed;
    top: -45vh;
    left: -55vw;
    height: 190vh;
    pointer-events: none;
    z-index: 18;
    opacity: 0;
    transform: translate3d(-45vw, 0, 0) rotate(17deg);
    transform-origin: 50% 50%;
    mix-blend-mode: screen;
    will-change: transform, opacity;
    animation: eoe-specular-sweep 18s cubic-bezier(.34,.02,.22,1) infinite;
}

/* Wide, soft reflected-light body */
html::before {
    width: 46vw;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255,23,78,0) 12%,
        rgba(255,23,78,.012) 27%,
        rgba(90,226,255,.022) 39%,
        rgba(215,248,255,.050) 47%,
        rgba(255,255,255,.070) 50%,
        rgba(180,244,255,.044) 54%,
        rgba(0,247,255,.020) 64%,
        rgba(255,23,78,.010) 74%,
        rgba(255,23,78,0) 88%,
        transparent 100%
    );
    filter: blur(8px);
}

/* Soft central glint, deliberately restrained */
html::after {
    width: 15vw;
    left: -41vw;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(0,247,255,.010) 24%,
        rgba(220,250,255,.050) 43%,
        rgba(255,255,255,.090) 50%,
        rgba(255,55,80,.022) 59%,
        transparent 100%
    );
    filter: blur(5px);
    animation-delay: .12s;
}

@keyframes eoe-specular-sweep {
    0%, 77% {
        transform: translate3d(-45vw, 0, 0) rotate(17deg);
        opacity: 0;
    }
    80% {
        opacity: 0;
    }
    83% {
        opacity: .42;
    }
    94% {
        transform: translate3d(195vw, 0, 0) rotate(17deg);
        opacity: .42;
    }
    97%, 100% {
        transform: translate3d(195vw, 0, 0) rotate(17deg);
        opacity: 0;
    }
}

@media (max-width: 767px) {
    html::before {
        width: 60vw;
    }
    html::after {
        width: 20vw;
    }
}

@media (prefers-reduced-motion: reduce) {
    html::before,
    html::after {
        animation: none !important;
        display: none !important;
    }
}