There is nothing wrong with your setup, only that currently the HTML design is built with the rules to discard any images that come out of it. So only the JavaScript and CSS files will be published to the broker, hence your images are not available.
If you want to change this behavior, you will need to modify the Gruntfile.js from the build-files.zip, and after that republish the HMTL design.
The part where the images are discarded is the following:
copy: {
dist: {
files: [{
expand: true,
dot: true,
cwd: '<%= config.src %>',
dest: '<%= config.dist %>',
src: [
// ignore all images (unless we really need some)
//'system/assets/images/**/*.{png,jpg,jpeg,gif,webp,svg}',
//'system/assets/less/**/*',
//'system/assets/scripts/theme-customiser.js',
'system/assets/scripts/PIE.htc',
'system/assets/fonts/*'
]
},
The reason why the images were discarded, is because it didn't make sense to publish all examples images from the whitelabel HTML design (since they are simply example content). But unfortunately that also means we currently don't have support for design images, something I have open on the backlog and will try to add in a future release.
Mind you the sprites story I follow, but background images, I would argue if they should actually be content or part of the HTML design. I guess it depends on what type of background image you are talking about exactly.
