:root {
    --color-primary: #cd041c !important; /* moderate contributions heatmap, primary email address label, Regenerate Scratch Token, and more (below) */
    --color-primary-dark-2: #ab0316 !important; /* greater contributions heatmap and more (below) */
    --color-primary-dark-4: #870312 !important; /* red buttons and greatest contributions heatmap */
    --color-primary-dark-6: #5f020d !important; /* red buttons hover */
    --color-primary-light-1: #d1152b !important; /* selection color */
    --color-primary-light-2: #ce2236 !important; /* fewer contributions heatmap */
    --color-primary-light-4: #d54455 !important; /* fewest contributions heatmap */
    --color-primary-hover: var(--color-primary-dark-2) !important; /* send account recovery email, save, search, clone buttons */
    /* no contributions heatmap is okay */
}

.home a {
    color: var(--color-primary) !important; /* link and link hover color on home page, other links use --color-primary */
}

.home .svg {
    color: var(--color-primary) !important; /* icons' color on home page */
}

.text.green {
    color: var(--color-primary) !important; /* ssh/gpg key icon color */
}

.ui.green.button {
    background-color: var(--color-primary) !important; /* "green" button color (e.g., Sign In, Verify), primary buttons use --color-primary */
}

.ui.green.button:hover {
    background-color: var(--color-primary-dark-2) !important; /* "green" button hover color, primary buttons use --color-primary-dark-2 */
}

.ui.basic.green.button {
    color: var(--color-primary) !important; /* reset color as in danger zone */
    border-color: var(--color-primary) !important; /* reset color as in danger zone */
    background-color: unset !important; /* reset color of reopen issue button as in danger zone */
}

.ui.basic.green.button:hover {
    color: var(--color-primary-dark-2) !important; /* reset color as in danger zone */
    border-color: var(--color-primary-dark-2) !important; /* reset color as in danger zone */
    background-color: unset !important; /* reset color of reopen issue button as in danger zone */
}

.ui.red.button {
    background-color: var(--color-primary-dark-4) !important; /* red button color (e.g., Confirm Deletion, Remove) */
}

.ui.red.button:hover {
    background-color: var(--color-primary-dark-6) !important; /* red button hover color */
}

.ui.basic.red.button {
    background-color: unset !important; /* reset color in danger zone */
}

details {
    background-color: var(--color-secondary-light-2); /* make collapsible elements easier to distinguish from main body */
    border-radius: 4px; /* same as code blocks */
    padding: .2em .4em; /* same as code blocks */
}