Style the colour picker

src/css/exceptions/color-scheme-picker.css

@@ -0,0 +1,42 @@
+.color-scheme {
+	border: 0;
+	display: flex;
+	gap: var(--space-size-xs);
+
+	legend {
+		position:absolute;
+		clip:rect(0 0 0 0);
+	}
+
+	input[name="color-scheme"] {
+		position:absolute;
+		clip:rect(0 0 0 0);
+	}
+
+	label:has(:not(:checked)) {
+		color: var(--color-subtle);
+	}
+
+	label:has(:focus-visible) {
+		outline: 1px solid var(--color-primary);
+		outline-offset: 2px;
+	}
+
+	label:has([name="color-scheme"])::before {
+		font-family: "font awesome 6 free";
+        font-style: normal;
+        font-variant: normal;
+        text-rendering: auto;
+        font-weight: 900;
+        -webkit-font-smoothing: antialiased;
+        font-size: var(--text-size-s);
+	}
+
+	label:has([name="color-scheme"][value="dark"])::before {
+		content: "\f186";
+	}
+
+	label:has([name="color-scheme"][value="light"])::before {
+		content: "\f185";
+	}
+}