@scope (:root[data-theme="base"]) {
    :scope {
        --theme-primary: var(--color-1);
        --theme-primary-desaturated: var(--color-1-desaturated);
        --theme-body-bg: var(--yellow-desaturated);
        --theme-header-bg: black;
        --theme-header-color: white;
        --theme-header-popover-bg: black;
        --theme-header-popover-color: white;
        --theme-logo-color-main: white;
        --theme-logo-color-alt: var(--color-1);
        --theme-scrollbar-color: var(--color-1);

        scrollbar-width: thin;
        scrollbar-color: black var(--theme-body-bg);
    }

    body {
        background: var(--theme-body-bg);

        > header { background-color: var(--theme-header-bg); }
    }
}
