body { word-break: break-word; overflow-wrap: break-word; }
a { margin-right: 1em; }
div.floated { border: 1px outset honeydew; float: left; height: 20em; line-height: 1; margin: 0 0 .5em 0; padding: .5em; }
div.floated, div.block { background-color: honeydew; }
div.floated a, div.block a { display: block; margin-right: 0; text-decoration: none; white-space: nowrap; }
div.floated a:hover, div.block a:hover { background-color: cyan; }
div.floated a:active, div.block a:active { background-color: gold; }
div.right { clear: left; text-align: right; position: sticky; bottom: 0; background-color: lavender; border: 1px outset lavender; }
div.right a { margin-right: 0; }
div.right a.js { background-color: dimgray; border: 1px outset dimgray; color: palegreen; text-decoration: none; }
a.sc { background-color: lemonchiffon; }

@media (pointer: coarse), /* deprecated */ screen and (max-device-width: 640px) {
	html { font-size: 60%; }
	small { font-size: inherit; line-height: 2.5; }
	div.floated small { line-height: 1; }
	#trad>a { color: black; border: 1px solid; border-radius: 1em; margin: .25em 0; padding: .25em; text-decoration: none;
		clear: left; float: left; display: block; line-height: normal; }
	#trad>a:not(.sc) { background-color: rgba(0,0,0,.1); }
	#trad>a:active { border-color: red; background-color: pink; }
}

@media (hover: none) {
	[title][tabindex] { position: relative; }
	[title][tabindex]:focus::after { content: attr(title); position: absolute; left: 0; top: 1.5em; color: black; background-color: white; border: 1px solid; opacity: .95; font-size: 1rem; white-space: nowrap; }
	ins, form[target]>div { z-index: 1; }
}