css.css

.outline {
  stroke: black;
  stroke-width: 0.03;
  fill: white;
}

/* Number symbol */
.symbol {
  stroke: black;
  stroke-width: 0.05;
}
text {
  font: 0.08em sans-serif;
  fill: black;
  text-anchor: middle;
}

@media screen {
	svg.page {
		border: 1px solid black;
		max-height: 800px;
		max-width: 800px;
	}
}

@media print {
	svg.page {
		width: 840mm;
		height: 1050mm;
	}
	#options {
		display: none;
	}
}

#loading {
	display: none;
}
body.loading #loading {
	display: block;
}
body.loading #everything {
	display: none;
}

section ~ section {
	margin-top: 2em;
}

#tool {
	display: grid;
	grid-template-columns: max-content 1fr;
	grid-gap: 1em;
}
@media screen and (max-width: 1150px) {
	#tool {
		grid-template-columns: 1fr;
	}
}

#options {
	max-width: 20em;
	margin-bottom: 3em;
	padding-left: 1em;
}

#options label {
	display: block;
	margin: 1em 0;
}
#options .input {
	font-size: 1em;
	padding: 0;
	width: 6em;
	text-align: right;
	float: right;
	margin-left: 3em;
}
#options .warning {
	float: right;
}
#options button {
	width: 100%;
	display: block;
	margin: 2em 0;
	font-size: 1.2em;
}

.explanation {
	font-style: italic;
}

@page {
	size: a0;
}

svg.page {
	display: inherit;
}
#cards {
	display: none;
}