Super simple image-free screen-reader-friendly low-markup loading animation

dabblet.css

/**
 * Super simple image-free screen-reader-friendly low-markup loading animation
 */

html {
	font: 100%/1.5 Helvetica Neue, Helvetica, Arial, sans-serif;
	min-height: 100%;
	-webkit-font-smoothing: antialiased;
}

.loading {
	width: 12px;
	height: 12px;
	border: 3px dashed;
	animation: loading 1s linear infinite;
	overflow: hidden;
	text-indent: 100%;
	whitespace: no-wrap;
	border-radius: 100%;
	margin: 50px auto;
}

@keyframes loading {
	to { transform: rotate(360deg); }
}

dabblet.html

<div class=loading>Loading...</div>

settings.json

{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}