.online-user-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
	gap: .5rem;
	padding: 1rem;
}

.online-user-grid .gdt-link {
	display: block;
	padding: .5rem;
}

.online-user-popup {
	position: fixed;
	inset: 0;
	margin: auto;
	width: min(90vw, 70rem);
	height: min(90vh, 50rem);
	border: 0;
	border-radius: .5rem;
	padding: 2.5rem 1rem 1rem;
}

.online-user-popup::backdrop { background: rgb(0 0 0 / 60%); }
.online-user-popup-close { position: absolute; top: .5rem; right: .75rem; }

#online-map {
    width: 100%;
    min-height: 360px;
    height: min(75vh, 720px);
}

.online-map-avatar {
    width: 32px;
    height: 32px;
    margin-right: 8px;
    border-radius: 50%;
    object-fit: cover;
    vertical-align: middle;
}