:root {
    --logo: url("/images/all.png");
    --background-image: url("/images/bg.png");
    --subdomain-color: var(--bright-indigo);
    background-repeat: repeat;
    background-size: 25em;
    font-family: serif;
}

:not(:root).sysmem-jaime {
    color: var(--jaime-color);
}

:not(:root).sysmem-lucy {
    color: var(--lucy-color);
}

:not(:root).sysmem-alice {
    color: var(--alice-color);
}

:not(:root).sysmem-daisy {
    color: var(--daisy-color);
}

:not(:root).sysmem-singer {
    color: var(--singer-color);
}

:not(:root).sysmem-sophie {
    color: var(--sophie-color);
}

:not(:root).sysmem-lorna {
    color: var(--lorna-color);
}

:not(:root).sysmem-bernard {
    color: var(--bernard-color);
}

:root.plural-bio {
    background: var(--bg-color);
    header nav li:nth-child(2) a {
        color: var(--jaime-color) !important;
    }
    header nav li:nth-child(3) a {
        color: var(--lucy-color) !important;
    }
    header nav li:nth-child(4) a {
        color: var(--alice-color) !important;
    }
    header nav li:nth-child(5) a {
        color: var(--daisy-color) !important;
    }
    header nav li:nth-child(6) a {
        color: var(--singer-color) !important;
    }
    header nav li:nth-child(7) a {
        color: var(--sophie-color) !important;
    }
    header nav li:nth-child(8) a {
        color: var(--lorna-color) !important;
    }
    header nav li:nth-child(9) a {
        color: var(--bernard-color) !important;
    }
    .sysmem-pfp {
        float: left;
        margin: 0.5em 1em 0 0;
        border-radius: 1.5em;
        width: min(30vw, 16em);
    }
}

:root.sysmem-jaime {
    --logo: url("/images/blujai831-ava-round.png");
    --bg-color: color-mix(in hsl, var(--black) 75%, var(--jaime-color) 25%);
    --subdomain-color: var(--jaime-color);
    h2 {
        color: var(--jaime-color);
    }
}

:root.sysmem-lucy {
    --logo: url("/images/lucy-ava-round.png");
    --bg-color: color-mix(in hsl, var(--black) 75%, var(--lucy-color) 25%);
    --subdomain-color: var(--lucy-color);
    h2 {
        color: var(--lucy-color);
    }
}

:root.sysmem-alice {
    --logo: url("/images/alice-ava-round.png");
    --bg-color: color-mix(in hsl, var(--black) 75%, var(--alice-color) 25%);
    --subdomain-color: var(--alice-color);
    h2 {
        color: var(--alice-color);
    }
}

:root.sysmem-daisy {
    --logo: url("/images/daisy-ava-round.png");
    --bg-color: color-mix(in hsl, var(--black) 75%, var(--daisy-color) 25%);
    --subdomain-color: var(--daisy-color);
    h2 {
        color: var(--daisy-color);
    }
}

:root.sysmem-singer {
    --logo: url("/images/singer-ava-round.png");
    --bg-color: color-mix(in hsl, var(--black) 75%, var(--singer-color) 25%);
    --subdomain-color: var(--singer-color);
    h2 {
        color: var(--singer-color);
    }
}

:root.sysmem-sophie {
    --logo: url("/images/sophie-ava-round.png");
    --bg-color: color-mix(in hsl, var(--black) 75%, var(--sophie-color) 25%);
    --subdomain-color: var(--sophie-color);
    h2 {
        color: var(--sophie-color);
    }
}

:root.sysmem-lorna {
    --logo: url("/images/lorna-ava-round.png");
    --bg-color: color-mix(in hsl, var(--black) 75%, var(--lorna-color) 25%);
    --subdomain-color: var(--lorna-color);
    h2 {
        color: var(--lorna-color);
    }
}

:root.sysmem-bernard {
    --logo: url("/images/bernard-ava-round.png");
    --bg-color: color-mix(in hsl, var(--black) 75%, var(--bernard-color) 25%);
    --subdomain-color: var(--bernard-color);
    h2 {
        color: var(--bernard-color);
    }
}