.chromatic {

	background: linear-gradient(90deg, red, orange, yellow, green, cyan, blue, indigo, violet);

	background-clip: text;

	color: transparent;

}

.chromatic-animated {

	background: linear-gradient(
		90deg,
		red, orange, yellow, green, cyan, indigo, violet,
		red, orange, yellow, green, cyan, indigo, violet,
		red, orange, yellow, green, cyan, indigo, violet
	);
	background-size: 200% 100%;

	background-clip: text;
	
	color: transparent;

	animation: shift 15s alternate infinite;

}

.slate-animated {

	background: linear-gradient(90deg, slateblue, darkslateblue, mediumslateblue, indigo, orange);
	background: linear-gradient(90deg, slateblue, rgb(63, 105, 198), mediumslateblue, indigo, orange);
	background-size: 200% 100%;

	background-clip: text;
	
	color: transparent;

	animation: shift 15s alternate infinite;

}

.slate-animated-bg {

	background: linear-gradient(90deg, slateblue, darkslateblue, mediumslateblue, indigo, orange);
	background-size: 200% 100%;

	color: white;

	animation: shift 15s alternate infinite;

}

@keyframes shift {
	
	from { background-position: 0% 0; }
	to { background-position: 100% 0; }
	
}

#rw label,
#nm label,
#prompts button,
.badge {
	
	border: 1px solid #ddd;
	
}

#output ul,
#output ol {
	
	margin-bottom: 1rem;
	
}

#output h1,
#output h2,
#output h3,
#output h4,
#output h5,
#output h6 {
	
	font-size: 1rem !important;
	
}

#output h1::before { content: '# '; }
#output h2::before { content: '## '; }
#output h3::before { content: '### '; }
#output h4::before { content: '#### '; }
#output h5::before { content: '##### '; }
#output h6::before { content: '###### '; }

#output td {
	
	vertical-align: top;
	
}

#output table {
	
	width: 100%;
	
}