.wood-swatch {
  display:block;
  background-image:url("assets/wood-swatches-v1/atlas.webp");
  background-repeat:no-repeat;
  background-size:509.77% 254.89%;
  background-position:var(--swatch-x,4.07%) var(--swatch-y,10.76%);
}
.wood-swatch[data-wood="white-oak"] { --swatch-x:4.07%; --swatch-y:10.76%; }
.wood-swatch[data-wood="red-oak"] { --swatch-x:34.78%; --swatch-y:10.76%; }
.wood-swatch[data-wood="alder"] { --swatch-x:65.36%; --swatch-y:10.76%; }
.wood-swatch[data-wood="maple"] { --swatch-x:95.93%; --swatch-y:10.76%; }
.wood-swatch[data-wood="white-oak-rift"] { --swatch-x:4.07%; --swatch-y:87.20%; }
.wood-swatch[data-wood="knotty-alder"] { --swatch-x:34.78%; --swatch-y:87.20%; }
.wood-swatch[data-wood="mahogany"] { --swatch-x:65.36%; --swatch-y:87.20%; }
.wood-swatch[data-wood="walnut"] { --swatch-x:95.93%; --swatch-y:87.20%; }