h1:has(>span.quip){
	display: flex;
	flex-direction: column;
	align-items: center;
	align-content:center;
	text-align: center;
}

main:has(h1 > span.quip){
	align-content: center;
	align-items: center;
}

.quip{
	font-family: OxygenMono;
}

.quip.selected{
	color: white;
	background-color: #1be4f8;
}

@keyframes blink {
	from {opacity: 1;} 
	to {opacity: 0;} 
}

.quip::after{
	content: '|';
	animation: none;

	margin-left: -0.2em;
	position: relative;
	top: -0.1em;
}

.quip.idle::after{
	animation: blink 1s steps(2) infinite;
}

.quip.selected::after{
  content: '';
}

.quip > img {
  height: 1em;
}