colours.css

:root {
    --black: #000000;
    --white: #ffffff;

    /* 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;
    --fern-green: #65743a;
    --flax: #efdd8d;
    --mindaro: #f4fdaf;

    /* open colors: used for debugging */
    --red-5: #ff6b6b;
    --red-5-transparent: #ff6b6b3a;
    --red-8: #e03131;
    --green-5: #51cf66;
    --green-8: #2f9e44;
    --grey-0: #f8f9fa;
    --grey-2: #e9ecef;
    --grey-8: #343a40;
    --grey-9: #212529;

    --background: white;
    --background-dark: #121212;

    --foreground: black;
    --foreground-dark: white;

    --chip-background: var(--grey-0);

    color-scheme: light dark;
}

html {
    background: var(--background, white);
}

button, .button {
    background-color: #1f302b40;
    color: var(--white);
}

button.primary, .button.primary {
    color: var(--black-bean);
    background-color: var(--flax);
}

button.danger, .button.danger {
    color: var(--white);
    background-color: var(--red-5);
}

header {
    background-color: var(--flax);
    color: var(--dark-slate-gray);
}

header a {
    color: var(--dark-slate-gray);
}

input, textarea {
    all: unset;
    padding: 1em;
    text-align: start;