*,
*::before,
*::after {
	box-sizing: border-box;
}

html,
body {
	height: 100%;
	margin: 0;
}

body {
	position: relative;
	font-family: Arial, Helvetica, sans-serif;
	background-color: #131b46;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.stars-bg {
	position: fixed;
	inset: 0;
	z-index: 0;
	display: block;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

body::after {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background: linear-gradient(
		to bottom,
		rgba(0, 0, 0, 0.55) 0%,
		rgba(0, 0, 0, 0.18) 18%,
		transparent 38%,
		transparent 62%,
		rgba(0, 0, 0, 0.18) 82%,
		rgba(0, 0, 0, 0.55) 100%
	);
}

.icon-link {
	position: relative;
	z-index: 1;
	display: block;
	line-height: 0;
	text-decoration: none;
	outline-offset: 8px;
}

.app-icon {
	display: block;
	width: min(72vmin, 420px);
	height: auto;
	border-radius: 22%;
	transition: transform 0.22s ease;
}

.icon-link:hover .app-icon,
.icon-link:focus-visible .app-icon {
	transform: scale(1.08);
}