Refactored the CSS a bit.

low-contrast.css

@@ -8,11 +8,11 @@
 	--disabled-bg-color: #666666;
 	--control-disabled: #000000;
 
-	/* --border-style: var(--default-border-thickness) outset pink; */
 	--border-style: var(--default-border-thickness) solid var(--alt-bg-color);
 	--border-focus-style: var(--default-border-thickness) solid var(--main-font-color);
 	--border-disabled-style: var(--default-border-thickness) solid var(--control-disabled);
 }
+
 body {
 	background-color: var(--main-bg-color);
 	color: var(--main-font-color);
@@ -23,10 +23,14 @@ textarea, input {
 	color: var(--main-font-color);
 }
 
-input[type=checkbox] {
+input[type="radio"], input[type="checkbox"] {
 	border: var(--border-style);
 }
 
+input[type="radio"]:focus, input[type="checkbox"]:focus {
+	border: var(--border-focus-style);
+}
+
 /* Color the check mark in the checkbox */
 input[type=checkbox]::before {
 	/* Using shadow-box instead of background-color will enable the state of the radio button to be visible when printed. */
@@ -35,23 +39,11 @@ input[type=checkbox]::before {
 	box-shadow: inset 1em 1em var(--main-font-color);
 }
 
-input[type="checkbox"]:focus, input[type="radio"]:focus {
-	border: var(--border-focus-style);
-}
-
-input[type="radio"] {
-	border: var(--border-style);
-}
-
 /* Inner circle to indicate a checked radio button */
 input[type="radio"]::before {
 	box-shadow: inset 1rem 1rem var(--main-font-color);
 }
 
-input[type="button"] {
-	border: var(--border-style);
-}
-
 /*On button press / hold*/
 input[type="button"]:active {
 	border: 3px solid var(--alt-bg-color);