/* ==================
   BASE ELEMENT LAYER
   ================== */

/* the page ground and body voice, everything else is component css.
   tokens come from theme-light.css / theme-dark.css */

body {
	margin: 0;
	background: var(--canvas);
	color: var(--ink);
	font: 400 18px/1.65 var(--serif);
	font-optical-sizing: auto;
	-webkit-font-smoothing: antialiased;
}

a {
	color: var(--accent);
}

a:hover {
	color: var(--accent-hover);
}

img {
	max-width: 100%;
	height: auto;
}

::selection {
	background: var(--accent);
	color: #FFFFFF;
}

@media (prefers-reduced-motion: reduce) {
	* {
		transition: none !important;
		animation: none !important;
	}
}