/*
 * The scaffold's paint.
 *
 * The scaffold is background paint on the `img` element that stands while the
 * image's file loads. `includes/scaffold.php` writes the marks this file keys
 * on. An opaque image carries `lvi-scaffold`, so it paints from the moment the
 * tag exists, and the loaded file covers the paint. A transparent image
 * carries `lvi-scaffold-alpha`, and it paints only while `scaffold.js` holds
 * `lvi-loading` on it, because a standing background would show through it
 * after load.
 *
 * The paint is the site's dark ground leaning toward the image's average
 * colour, not a colour block. The gradient runs from the tint at low strength
 * down to the ground at almost none.
 *
 * The ground stands as its own `background-color` declaration. A browser
 * without `color-mix()` drops the gradient declaration alone and still paints
 * the ground.
 */
img.lvi-scaffold,
img.lvi-scaffold-alpha.lvi-loading {
	background-color: var(--lvi-scaffold-ground, #101010);
	background-image: linear-gradient(
		160deg,
		color-mix(in srgb, var(--lvi-tint) 24%, var(--lvi-scaffold-ground, #101010)),
		color-mix(in srgb, var(--lvi-tint) 6%, var(--lvi-scaffold-ground, #101010))
	);
}
