* , *::before, *::after{box-sizing:border-box}
html,body{height:100%;overflow:hidden}
:root{--bg:#202124;--text:#ffffff;--link:#9fd1ff;--link-hover:#1e90ff}
body{
	margin:0;
	background:var(--bg);
	color:var(--text);
	font-family:Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
	-webkit-font-smoothing:antialiased;
	display:flex;
	align-items:center;
	justify-content:center;
	text-align:center;
	padding:2rem;
}

.container, .footer{position:relative;z-index:1}

.container{max-width:720px}
h1{font-size:2.25rem;margin:0 0 0.5rem}
p{margin:0 0 1.5rem;color:rgba(255,255,255,0.85)}
.links{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
a.site-link{
	display:inline-block;
	padding:0.6rem 1rem;
	color:var(--text);
	text-decoration:none;
	border:1px solid rgba(255,255,255,0.06);
	border-radius:8px;
	transition:color .18s ease, background .18s ease, box-shadow .18s ease, transform .08s ease;
}
a.site-link:hover, a.site-link:focus{
	color:var(--link-hover);
	background:rgba(255,255,255,0.02);
	transform:translateY(-2px);
	box-shadow:0 6px 18px rgba(0,0,0,0.45);
	outline: none;
}

/* Per-site hover overrides: specific colors for osu-recent and osu-track links */
a.site-link.site-recent:hover,
a.site-link.site-recent:focus{
  color: #00FFD1; /* lime/cyan */
}

a.site-link.site-track:hover,
a.site-link.site-track:focus{
  color: #FF66AA; /* requested track hover */
}
.small{font-size:0.9rem;color:rgba(255,255,255,0.7);margin-top:1rem}
@media (max-width:420px){h1{font-size:1.5rem}}

/* Footer */
.footer{
	position:fixed;
	left:0;
	right:0;
	bottom:12px;
	text-align:center;
	font-size:0.9rem;
	color:rgba(255,255,255,0.65);
}
.footer a{color:inherit;text-decoration:none}
.footer a:hover{color:var(--link-hover)}