:root {
    --bg-splash-dark: url("/static/websitedarker-large.png");
    @supports (image-format: webp) {
        --bg-splash-dark: url("/static/websitedarker-large.webp");
    }

    --bg-splash-light: url("/static/websitedifference-large.png");
    @supports (image-format: webp) {
        --bg-splash-light: url("/static/websitedifference-large.webp");
    }

    --bg-main-small: url("/static/background-small.png");
    @supports (image-format: webp) {
        --bg-main-small: url("/static/background-small.webp");
    }
    --bg-main-image: url("/static/background-large.png");
    @supports (image-format: webp) {
        --bg-main-image: url("/static/background-large.webp");
    }
}

body:has(.regular_page_marker) {
    background: #8a847dff;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-image: var(--bg-main-small);
    background-image: var(--bg-main-image);
}