Firefox Checkboxes Broken by Webkit Styles

Firefox is not displaying checkboxes as ticked or unticked.

I have located the problem in load-styles.php

input[type="checkbox"], input[type="radio"] { border: 1px solid #8c8f94; border-radius: 4px; background: #fff; color: #50575e; clear: none; cursor: pointer; display: inline-block; line-height: 0; height: 1rem; margin: -.25rem .25rem 0 0; outline: 0; padding: 0 !important; text-align: center; vertical-align: middle; width: 1rem; min-width: 1rem; -webkit-appearance: none; box-shadow: inset 0 1px 2px rgba(0,0,0,.1); transition: .05s border-color ease-in-out; }

Removing -webkit-appearance: none; fixes the issue and checkboxes work as intended.

Please stop messing with basic browser functionality. It is unnecessary.

Thanks