/* TLMC Sparks */

.tlmcSp {
	pointer-events: none;
}
.tlmcSp[data-scope="viewport"] {
	position: fixed;
	inset: 0;
}
.tlmcSp[data-scope="selector"] {
	position: absolute;
	inset: 0;
	overflow: hidden;
}
.tlmcSp-host { position: relative; }

/* Two nested elements per spark: the outer wanders, the inner flickers.
   Separating them lets a long wandering path and a short brightness
   cycle run at different speeds without fighting each other. */
.tlmcSp span {
	position: absolute;
	will-change: transform;
	animation-name: tlmcSpWander;
	animation-timing-function: cubic-bezier(.45, .05, .55, .95);
	animation-iteration-count: infinite;
	animation-direction: alternate;
}

.tlmcSp span i {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	font-style: normal;
	will-change: opacity, transform;
	animation-name: tlmcSpFlicker;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
}

/* A wandering path: four waypoints, each spark given its own signed
   offsets, so some drift sideways, some sink, some loop back. */
@keyframes tlmcSpWander {
	0%   { transform: translate3d(0, 0, 0); }
	22%  { transform: translate3d(var(--sp-x1), var(--sp-y1), 0); }
	45%  { transform: translate3d(var(--sp-x2), var(--sp-y2), 0); }
	68%  { transform: translate3d(var(--sp-x3), var(--sp-y3), 0); }
	100% { transform: translate3d(var(--sp-x4), var(--sp-y4), 0); }
}

/* Brightness pulses on its own clock — never fully out, so there is no
   hard cut when the loop restarts. */
@keyframes tlmcSpFlicker {
	0%   { opacity: calc(var(--sp-o, .9) * .25); transform: scale(.9); }
	18%  { opacity: var(--sp-o, .9);             transform: scale(1); }
	42%  { opacity: calc(var(--sp-o, .9) * .38); transform: scale(.94); }
	61%  { opacity: calc(var(--sp-o, .9) * .95); transform: scale(1.04); }
	83%  { opacity: calc(var(--sp-o, .9) * .3);  transform: scale(.92); }
	100% { opacity: calc(var(--sp-o, .9) * .25); transform: scale(.9); }
}

@media (max-width: 767px) {
	.tlmcSp-nomobile { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.tlmcSp { display: none; }
}