@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    src: url('inter.ttf') format('truetype');
}




body { padding: 0; margin: 0; min-width: 100vw; min-height: 100vh; display: flex; justify-content: center; align-items: center;background: linear-gradient(to bottom, #12153b, #0a0c22, #090a1d);
}
#unity-container { position: fixed; aspect-ratio: 105/150; max-height: 100%;}
.unity-mobile #unity-canvas { width: 100%; height: 100% }
#unity-loading-bar { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none; }
#unity-logo { width: 300px; height: 200px; background: url('mia-logo.png') no-repeat center;background-size:contain;margin-bottom:30px;}
#unity-progress-bar-empty { overflow: hidden; height: 25px; margin-top: 10px; border-radius:0;border:2px solid #62cce8;}
#unity-progress-bar-full { width: 8%; height: 100%;border-radius:0;background: linear-gradient(to right, #aafef7, #2d81c8);}
#unity-footer { position: relative }
.unity-mobile #unity-footer { display: none }
#unity-build-title { float: right; margin-right: 10px; line-height: 38px; font-family: arial; font-size: 18px }
#unity-fullscreen-button { cursor:pointer; float: right; width: 38px; height: 38px; background: url('fullscreen-button.png') no-repeat center }
#unity-warning { position: absolute; left: 50%; top: 5%; transform: translate(-50%); background: white; padding: 10px; display: none }
.mfm-logo {width: 120px; height: 89px; background: url('meme-fighter-ai-logo.png') no-repeat center;background-size:contain;position:absolute;top:20px;right:20px;}

.ape-play-button {
	color: #000;
	background: #63ea71;
	padding: 15px 50px 15px 50px;
	line-height:1.5rem;
	font-weight: bold;
	cursor: pointer;
	font-family:'Inter';
	font-size:1rem;
	border:2px solid #63ea71;
	border-radius:30px;
}

.ape-play-button:hover {background:black;color:#63ea71;}

#ape-play-button-desktop {padding-top:14px;}
#ape-play-button-desktop:hover {border:1px solid black;}

#ape-play-button-mobile-container {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 30px;
}


@media screen and (max-width: 500px) {
#unity-logo { width: 200px; height: 133px;}
.mfm-logo {width:80px;height:60px;}
#unity-progress-bar-empty {width: 160px; height: 25px; }
.ape-play-button {padding:12px 50px 12px 50px;}
}

body.has-error .error-overlay  {
	display: flex !important;
}

.error-overlay {
	font-family: Inter, sans-serif;
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	color: white;
	background-color: black;
	text-align: center;
}

.error-overlay #unity-logo {
	filter: grayscale(1);
}

.error-overlay .error-title {
	margin: 0 auto;
}

.error-overlay .error-message {
	margin-bottom: 0;
	color: #a3a3a3;
	font-weight: 500;
	padding-right: 5vw;
	padding-left: 5vw;
	margin-top: 0.5rem;
}