div.scroll {
	width: 100%;
	overflow-x: auto;
}

.grid td {
	height: 6.75vh;
	min-width: 3.8vw;
	background-color: var(--bs-dark-bg-subtle);
}

.grid {
	border-collapse: collapse;
	border: 2px solid var(--bs-body-bg);
	margin: 0 auto;
}

.grid td {
	border-collapse: collapse;
	border: 2px solid var(--bs-body-bg);
}

.grid th {
	border-collapse: collapse;
	border: 2px solid var(--bs-body-bg);
}

.range {
	min-width: 0 !important;
	background-color: var(--bs-black) !important;
}

.profile-pic2 {
	object-fit: cover;
	height: min(7vh, 3.8vh);
	width: min(7vh, 3.8vh);
	border-radius: var(--bs-border-radius-pill);
}

.br {
	display: block;
}

.whitelist {
	background-color: #0099ff !important;
}

.friend {
	background-color: #27ae50 !important;
}

.close_friend {
	background-color: #8e44ad !important;
	filter: drop-shadow(0 0 0.75rem #8e44ad) !important;
}

.admin {
	animation: admin 4.2s infinite;
}

.focus {
	background-color: #e33d94 !important;
	filter: drop-shadow(0 0 0.75rem #e33d94) !important;
}

.me {
	background-color: #2980b9 !important;
	filter: drop-shadow(0 0 0.75rem #2980b9) !important;
}

/* small */
@media screen and (max-width: 800px) {
	.small-colors {
		background-color: #2c2f33 !important;
	}
}

@media screen and (max-width: 700px) {
	.sm-t {
		font-size: 0.5em;
	}

	.m-t {
		font-size: 0.7em;
	}

	.grid {
		border-collapse: collapse;
		border: 4px solid var(--bs-body-bg);
		margin: 0 auto;
	}

	.grid td {
		border-collapse: collapse;
		border: 4px solid var(--bs-body-bg);
	}

	.grid th {
		border-collapse: collapse;
		border: 4px solid var(--bs-body-bg);
	}
}

.case {
	cursor: pointer;
}

.dead {
	color: #ff1744;
}

.attention {
	color: #ffd54f;
}

.pooled {
	background-color: #d35400 !important;
}

.tutor {
	background-color: #ff9000 !important;
	color: white !important;
}

.tutor-shield {
	color: #ff9900 !important;
}

.tutor-spot {
	background-color: #ffee00 !important;
	color: black !important;
}

.wrong-cluster {
	background-color: #f00000 !important;
}

.no-shadow {
	filter: none !important;
}

.zindex9999 {
	z-index: 9999;
}

@keyframes admin {
	0%   { background: oklch(50% 0.3 0); }    /* Red */
	16%  { background: oklch(50% 0.3 60); }   /* Orange */
	33%  { background: oklch(50% 0.3 120); }  /* Yellow-Green */
	50%  { background: oklch(50% 0.3 180); }  /* Cyan */
	66%  { background: oklch(50% 0.3 240); }  /* Blue */
	83%  { background: oklch(50% 0.3 300); }  /* Purple */
	100% { background: oklch(50% 0.3 360); }  /* Back to Red */{
}