mastodon-hicontrast-visibility-buttons.css

:root {
  --visibility-global: #1976d2;
  --visibility-unlisted: #388e3c;
  --visibility-follower: #ffa000;
  --visibility-private: #d32f2f;
}

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-globe) button[type=submit],
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M480-80q-83"]) {
    background-color: var(--visibility-global);
}

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-unlock) button[type=submit],
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M524-40q-84"]) {
    background-color: var(--visibility-unlisted);
}

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-lock) button[type=submit],
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M240-80q-33"]) {
    background-color: oklab(from var(--visibility-follower) calc(l * 0.8) a b);
}

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-at) button[type=submit],
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M160-160q-33"]) {
    background-color: var(--visibility-private);
}

/* Hover */

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-globe) button[type=submit]:hover,
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M480-80q-83"]):hover,

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-globe) button[type=submit]:active,
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M480-80q-83"]):active,

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-globe) button[type=submit]:focus,
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M480-80q-83"]):focus {
    background-color: oklab(from var(--visibility-global) calc(l * 0.8) a b);
}

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-unlock) button[type=submit]:hover,
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M524-40q-84"]):hover,

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-unlock) button[type=submit]:active,
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M524-40q-84"]):active,

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-unlock) button[type=submit]:focus,
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M524-40q-84"]):focus {
    background-color: oklab(from var(--visibility-unlisted) calc(l * 0.8) a b);
}

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-lock) button[type=submit]:hover,
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M240-80q-33"]):hover,

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-lock) button[type=submit]:active,
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M240-80q-33"]):active,

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-lock) button[type=submit]:focus,
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M240-80q-33"]):focus {
    background-color: oklab(from var(--visibility-follower) calc(l * 0.7) a b);
}

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-at) button[type=submit]:hover,
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M160-160q-33"]):hover,

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-at) button[type=submit]:active,
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M160-160q-33"]):active,

.hicolor-privacy-icons .compose-form:has(.compose-form__dropdowns .dropdown-button .icon-at) button[type=submit]:focus,
.hicolor-privacy-icons .secondary-post-button:has(svg path[d^="M160-160q-33"]):focus {
    background-color: oklab(from var(--visibility-private) calc(l * 0.7) a b);
}