/* Styles moved from inline <style> in osu-recent/index.html */
.hero{padding:3rem 1rem;text-align:center}
.hero h1{font-size:2.25rem;margin:0 0 .25rem}
.cta-row{display:flex;gap:1rem;justify-content:center;margin-top:1.5rem;flex-wrap:wrap}
/* Make .btn visually consistent and interactive like the site's .site-link */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.4rem;padding:.8rem 1.2rem;border-radius:10px;border:1px solid rgba(255,255,255,0.06);background:transparent;color:var(--text);text-decoration:none;transition:color .18s ease, background .18s ease, box-shadow .18s ease, transform .08s ease}
.btn:focus{outline:none}
.btn:hover,.btn: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.35)}
.btn.primary{background:linear-gradient(180deg, rgba(159,209,255,0.06), rgba(159,209,255,0.02));border-color:rgba(159,209,255,0.12)}
.meta{margin-top:1rem;color:rgba(255,255,255,0.78)}
.user-row{position:absolute;right:1rem;top:1rem}
.small-card{display:inline-block;padding:.5rem .75rem;border-radius:8px;background:var(--card-bg);border:1px solid rgba(255,255,255,0.04);color:var(--muted)}

/* Ensure .btn.site-link consistency when both classes are present */
.btn.site-link{display:inline-flex !important;align-items:center;justify-content:center;padding:.8rem 1.2rem !important;border-radius:10px !important;border:1px solid rgba(255,255,255,0.06) !important;background:transparent !important;color:var(--text) !important;text-decoration:none !important}

/* Stronger per-site hover for the track link to override .btn:hover */
.btn.site-link.site-track:hover,
.btn.site-link.site-track:focus{
	color: #FF66AA !important; /* match main site's pink hover */
}