:root[data-color-scheme="light"] {
    --backgroundImage: none;
    --blendMode01: screen;

    --color01r: 255; --color01g: 255; --color01b: 255; --color01a: 1;
    --color02r: 0; --color02g: 0; --color02b: 0; --color02a: 1;

    --color03: #5fb2cc;
    --color04: #cc5f5f;

    --siteOverlayColor: rgba(255,255,255,.70);
}

:root[data-color-scheme="dark"] {
    --blendMode01: multiply;

    --color01r: 0; --color01g: 0; --color01b: 0; --color01a: 1;
    --color02r: 255; --color02g: 255; --color02b: 255; --color02a: 1;

    --color03: #5fb2cc;
    --color04: #cc5f5f;

    --siteOverlayColor: rgba(0,0,0,.70);
}

:root {
    color-scheme: light dark;
    --blur: 5px;
    --border-radius: 20px;
    --color01: rgba(var(--color01r), var(--color01g), var(--color01b), var(--color01a));
    --color02: rgba(var(--color02r), var(--color02g), var(--color02b), var(--color02a));
    --site-padding: min(17dvw, 232px);
    --margin-bottom: 30px;
    --margin-top: 20px;

    --gradBgColor01: hsla(14,66%,65%,1);
    --gradBgImg01: radial-gradient(at 0% 0%, #dd7770 0px, transparent 50%),
                      radial-gradient(at 0% 50%, #dd7770 0px, transparent 50%),
                      radial-gradient(at 0% 100%, #dd7770 0px, transparent 50%),
                      radial-gradient(at 100% 0%, #fd8956 0px, transparent 50%),
                      radial-gradient(at 100% 50%, #fd8956 0px, transparent 50%),
                      radial-gradient(at 100% 100%, #fd8956 0px, transparent 50%);

    --gradBgColor02: #b891bb;
    --gradBgImg02: radial-gradient(at 0% 0%, #fd8956 0px, transparent 50%),
                      radial-gradient(at 0% 50%, #fd8956 0px, transparent 50%),
                      radial-gradient(at 0% 100%, #fd8956 0px, transparent 50%),
                      radial-gradient(at 100% 0%, #5262a5 0px, transparent 50%),
                      radial-gradient(at 100% 50%, #5262a5 0px, transparent 50%),
                      radial-gradient(at 100% 100%, #5262a5 0px, transparent 50%);

    --gradBgColor03: hsla(237,31%,65%,1);
    --gradBgImg03:  radial-gradient(at 0% 0%, #6588ca 0px, transparent 50%),
                      radial-gradient(at 0% 25%, #6588ca 0px, transparent 50%),
                      radial-gradient(at 0% 100%, #6588ca 0px, transparent 50%),
                      radial-gradient(at 100% 0%, #b891bb 0px, transparent 50%),
                      radial-gradient(at 100% 50%, #b891bb 0px, transparent 50%),
                      radial-gradient(at 100% 100%, #b891bb 0px, transparent 100%);


    --gradBgColor04: hsla(237,31%,65%,1);
    --gradBgImg04:  radial-gradient(at 0% 0%, #b891bb 0px, transparent 50%),
                      radial-gradient(at 0% 25%, #b891bb 0px, transparent 50%),
                      radial-gradient(at 0% 100%, #b891bb 0px, transparent 50%),
                      radial-gradient(at 100% 0%, #6588ca 0px, transparent 50%),
                      radial-gradient(at 100% 50%, #6588ca 0px, transparent 50%),
                      radial-gradient(at 100% 100%, #6588ca 0px, transparent 100%);


    --gradBgColor05: hsla(237,31%,65%,1);
    --gradBgImg05:  radial-gradient(at 0% 0%, #b891bb 0px, transparent 50%),
                      radial-gradient(at 0% 50%, #b891bb 0px, transparent 50%),
                      radial-gradient(at 0% 100%, #b891bb 0px, transparent 50%),
                      radial-gradient(at 100% 0%, #733655 0px, transparent 50%),
                      radial-gradient(at 100% 25%, #733655 0px, transparent 100%),
                      radial-gradient(at 100% 100%, #733655 0px, transparent 100%);


    --gradBgColor06: hsla(237,31%,65%,1);
    --gradBgImg06:  radial-gradient(at 0% 0%, #733655 0px, transparent 50%),
                      radial-gradient(at 0% 25%, #733655 0px, transparent 100%),
                      radial-gradient(at 0% 100%, #733655 0px, transparent 100%),
                      radial-gradient(at 100% 0%, #b891bb 0px, transparent 50%),
                      radial-gradient(at 100% 50%, #b891bb 0px, transparent 50%),
                      radial-gradient(at 100% 100%, #b891bb 0px, transparent 50%);

    .bg-grad-01 { background-color: var(--gradBgColor01); background-image: var(--gradBgImg01); }
    .bg-grad-02 { background-color: var(--gradBgColor02); background-image: var(--gradBgImg02); }
    .bg-grad-03 { background-color: var(--gradBgColor03); background-image: var(--gradBgImg03); }
    .bg-grad-04 { background-color: var(--gradBgColor04); background-image: var(--gradBgImg04); }
    .bg-grad-05 { background-color: var(--gradBgColor05); background-image: var(--gradBgImg05); }
    .bg-grad-06 { background-color: var(--gradBgColor06); background-image: var(--gradBgImg06); }
}

    @media (max-width: 950px) {
        :root {
            --site-padding: calc(min(17dvw, 232px)/2);
        }
    }