/**
 * Divider (Figma "Divider" 25:6195, Menu 25:6512): a 32 high band of the 32 x 32 "AN NAM/Tile"
 * repeated across the screen from the left edge (45 tiles at 1440; 834 and 390 show as many as
 * fit). The tile (PLAN.md B4 Q5a): cream, a quarter circle r 9 in each corner and a diamond in
 * the middle, in ink. The ink shape is assets/images/divider-tile.svg used as a mask, so both
 * colours follow the palette controls; an uploaded tile image replaces it.
 */

.an-divider {
	position: relative;
	height: var(--an-divider-h, 32px);
	overflow: hidden;
	background-color: var(--an-bg);
}

.an-divider:not(.an-divider--image)::before {
	content: "";
	position: absolute;
	inset: 0;
	background-color: var(--an-divider-ink, var(--an-c-ink));
	-webkit-mask: url(../../images/divider-tile.svg) repeat-x 0 0 / var(--an-divider-h, 32px) var(--an-divider-h, 32px);
	mask: url(../../images/divider-tile.svg) repeat-x 0 0 / var(--an-divider-h, 32px) var(--an-divider-h, 32px);
}

.an-divider--image {
	background-image: var(--an-divider-tile);
	background-repeat: repeat-x;
	background-position: left top;
	background-size: auto 100%;
}