body {
    width: 100%;
    min-height: 100vh;
    margin: 0;
    background: #fdfffc;
    position: relative;
    overflow-x: hidden;
    isolation: isolate;
}

/* Grid */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -2;
    pointer-events: none;

    --color: #EBEEF6;

    background-image:
        linear-gradient(
            0deg,
            transparent 24%,
            var(--color) 25%,
            var(--color) 26%,
            transparent 27%,
            transparent 74%,
            var(--color) 75%,
            var(--color) 76%,
            transparent 77%,
            transparent
        ),
        linear-gradient(
            90deg,
            transparent 24%,
            var(--color) 25%,
            var(--color) 26%,
            transparent 27%,
            transparent 74%,
            var(--color) 75%,
            var(--color) 76%,
            transparent 77%,
            transparent
        );

    background-size: 55px 55px;
}

/* Fade edge */
body::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;

    background:
        radial-gradient(
            ellipse at center,
            transparent 35%,
            rgba(253,255,252,0.2) 60%,
            rgba(253,255,252,0.6) 80%,
            rgba(253,255,252,1) 100%
        );
}