#flag-counter {
	text-align: center;
	font-weight: bold;
	font-size: 2.3rem;
	color: red;
	font-family: monospace;
}

#game-area {
	--grid-size: 9;

	display: grid;
	justify-content: center;
	margin: 1rem 0;

	grid-template-columns: repeat(var(--grid-size), 2.3rem);
	grid-template-rows: repeat(var(--grid-size), 2.3rem);

	@media (max-width: 426px) {
		grid-template-columns: repeat(var(--grid-size), calc(19rem / var(--grid-size)));
		grid-template-rows: repeat(var(--grid-size), calc(19rem / var(--grid-size)));
	}

	>* {
		background-color: lightgrey;
		border: 0.1rem solid black;
		color: black;
		font-weight: bold;
		font-size: 1.23rem;
		display: flex;
		align-items: center;
		justify-content: center;
	}
}