input要素でマウスホバー状態とチェック状態の両方で背景色と文字色を変更したい。

結論（コード）

input {
  color: #333;
  background-color: white;

  :where( &:hover, &:checked ) {
    background-color: #333;
    color: white;
  }
}