.cursor-sparkle {
	position: fixed;
	top: 0;
	left: 0;
	color: var(--card);
	font-size: 1rem;
	pointer-events: none;
	opacity: 0;
	transition: opacity .2s ease;
	z-index: 9999;
	will-change: transform;
}

@media (pointer: coarse) {
	.cursor-sparkle {
		display: none;
	}
}

.jump-to-comments {
	display: none;
}

@media (max-width: 1024px) {
	.jump-to-comments {
		display: block;
		position: fixed;
		left: 50%;
		transform: translateX(-50%);
		bottom: calc(10px + env(safe-area-inset-bottom, 0px));
		z-index: 500;
		background: rgba(254, 252, 255, .74);
		-webkit-backdrop-filter: blur(12px);
		backdrop-filter: blur(12px);
		border: 2px solid var(--lavender);
		color: var(--rose);
		font-family: inherit;
		font-size: 14px;
		font-weight: 500;
		text-decoration: none;
		padding: 12px 36px;
		border-radius: 999px;
		opacity: 1;
		transition: opacity .2s ease, transform .2s ease, background-color .3s ease, color .3s ease;
		/* Mesmo fix do Safari usado em .lila-album-gallery-item: sem isto o
		   WebKit não recorta a camada do backdrop-filter pelo border-radius. */
		-webkit-mask-image: -webkit-radial-gradient(#fff, #000);
	}
	.jump-to-comments::before {
		content: '';
		position: absolute;
		inset: 0;
		border-radius: inherit;
		box-shadow: var(--shadow);
		z-index: -1;
	}
	.jump-to-comments.is-hidden {
		opacity: 0;
		transform: translateX(-50%) translateY(12px);
		pointer-events: none;
	}
	html.is-android .jump-to-comments {
		bottom: calc(32px + env(safe-area-inset-bottom, 0px));
	}
}

@media (max-width: 1024px) and (min-width: 769px) {
	.jump-to-comments {
		bottom: calc(32px + env(safe-area-inset-bottom, 0px));
	}
}