.gh-memory__board{
	display:grid;
	grid-template-columns:repeat(4,72px);
	gap:10px;
	justify-content:center;
	perspective:700px
}
.gh-memory__levels{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:8px;
	margin-bottom:16px
}
.gh-memory__levels button{
	padding:10px 6px;
	border:1px solid #ddd9ff;
	border-radius:13px;
	background:#faf9ff;
	color:#5547d7;
	font:inherit;
	font-weight:700;
	cursor:pointer
}
.gh-memory__levels button small{display:block;margin-top:3px;color:#777;font-weight:400}
.gh-memory__levels button.is-active{border-color:#6d5dfc;background:#6d5dfc;color:#fff}
.gh-memory__levels button.is-active small{color:#e8e5ff}
.gh-memory__board[data-cards="16"]{grid-template-columns:repeat(4,68px)}
.gh-memory__card{
	position:relative;
	display:grid;
	place-items:center;
	width:72px;
	height:72px;
	padding:0;
	overflow:hidden;
	border:0;
	border-radius:15px;
	background:linear-gradient(145deg,#7669ec,#5144c8);
	box-shadow:0 7px 16px rgba(64,52,164,.2);
	color:#222;
	cursor:pointer;
	-webkit-tap-highlight-color:transparent;
	transition:transform .2s,background .2s,opacity .2s
}
.gh-memory__card::before{
	content:"؟";
	font-size:25px;
	font-weight:800;
	color:#fff;
	transition:opacity .15s
}
.gh-memory__symbol{
	position:absolute;
	inset:0;
	display:grid;
	place-items:center;
	font-size:29px;
	opacity:0;
	transform:scale(.55) rotateY(90deg);
	transition:opacity .15s,transform .2s
}
.gh-memory__card.is-open,.gh-memory__card.is-done{
	background:#f0eeff;
	transform:rotateY(0)
}
.gh-memory__card.is-open::before,.gh-memory__card.is-done::before{opacity:0}
.gh-memory__card.is-open .gh-memory__symbol,.gh-memory__card.is-done .gh-memory__symbol{
	opacity:1;
	transform:scale(1) rotateY(0)
}
.gh-memory__card.is-done{opacity:.6;cursor:default}
.gh-memory__card:focus-visible{outline:3px solid #ffca57;outline-offset:3px}
@media(max-width:390px){
	.gh-memory__board{grid-template-columns:repeat(4,60px);gap:8px}
	.gh-memory__card{width:60px;height:60px}
	.gh-memory__board[data-cards="16"]{grid-template-columns:repeat(4,56px)}
	.gh-memory__board[data-cards="16"] .gh-memory__card{width:56px;height:56px}
}