#foo:checked::before, input(type="checkbox") ( position:absolute; clip: rect(0,0,0,0); clip: rect(0 0 0 0); ) #foo:checked, input(type="checkbox") + label::before ( content: url('checkbox.png.webp'); ) input(type="checkbox"):checked + label::before ( content: url('checkbox-checked.png.webp'); )#foo no hace referencia a ningún elemento en particular, está ahí simplemente para evitar que los navegadores implementen los selectores posteriores si no lo entiende (ya que la mayoría de los navegadores descartarán el selector completo si alguna parte falla).