id/styles/colours.css

:root {
    /* ByeCorps colour scheme. Use sparsely on this site. */
    --byecorps-blue: #1b5652;
    --byecorps-white: #e6feff;

    /* ByeCorps ID colour scheme. Use on this site. */
    --black-bean: #330f0a;
    --dark-slate-gray: #394f49;
    --dark-slate-gray-dim: #536E65;
    --fern-green: #65743a;
    --flax: #efdd8d;
    --flax-dim: #BFB26E;
    --mindaro: #f4fdaf;

    --white: #ffffff;
    --gray-0: #f8f9fa;
    --gray-1: #f1f3f5;
    --grey-5: #adb5bd;
    --gray-8: #343a40;
    --gray-9: #212529;

    --red-2: #ffc9c9;
    --red-3: #ffa8a8;
    --red-7: #f03e3e;
    --red-9: #c92a2a;

    --ff-bg-black: #1a1a1a;

    --page-bg: var(--white);

    --link-fg: var(--dark-slate-gray);
    --non-color-link-fg: var(--gray-9);

    --hover-bg: var(--gray-1);
    --selected-bg: var(--gray-0);

    --input-bg: var(--gray-1);

    --button-primary-bg: var(--flax);
    --button-primary-hover-bg: var(--flax-dim);

    --error-fg: var(--red-9);
}

@media screen and (prefers-color-scheme: dark) {
    :root {
        --page-bg: var(--ff-bg-black);
        --link-fg: var(--flax);
        --non-color-link-fg: var(--gray-0);
        --hover-bg: var(--gray-8);
        --selected-bg: var(--gray-9);
        --error-fg: var(--red-3);
        --input-bg: var(--gray-9);
        --button-primary-bg: var(--dark-slate-gray);
        --button-primary-hover-bg: var(--dark-slate-gray-dim);
    }
}

.error-fg {
    color: var(--error-fg);
}

a {
    color: var(--link-fg);
}