/*----------------------------------------------------------------------------*/
/* Color tokens */

:root {

    --brand: #27187e;
    --brand-dark: #C6BEF3;

    --light-100: #CEC0B3;
    --light-90:  #bfad9c;

    --dark-90:   #525252;
    --dark-100:  #0D0D0D;

}

/*----------------------------------------------------------------------------*/
/* Light-theme */

:root {

    --background: var(--light-100);
    --background-dim: var(--light-90);

    --foreground: var(--dark-100);
    --foreground-dim: var(--dark-90);

    --accent: var(--brand);

}


/*----------------------------------------------------------------------------*/
/* Dark-theme */

@media (prefers-color-scheme: dark) {
    :root {

        --background: var(--dark-100);
        --background-dim: var(--dark-90);

        --foreground: var(--light-100);
        --foreground-dim: var(--light-90);

        --accent: var(--brand-dark);

    }
}