.dot {
	position: absolute;
	top: var(--dot-top, -2px);
	right: var(--dot-right, -2px);
	width: 8px;
	height: 8px;
	background-color: var(--color-text-accent);
	border-radius: 100%;
	outline: 2px solid var(--color-bg);
	pointer-events: none;
}

.pulse {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background-color: var(--color-text-accent);
	box-shadow: 0 0 0 var(--color-text-accent);
	animation: pulse 2s infinite;
}

@keyframes pulse {
	from {
		box-shadow: 0 0 0 0 var(--color-text-accent);
	}
	70% {
		box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
	}
	to {
		box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
	}
}