/* Rotating-light styling uses the Mexica progress palette and keyframes.
 * Existing progress paths,
 * masks, date updates, mobile artwork layers and input handlers remain owners. */
.sunnys-mexica-calendar .mexica-wheel__progress-trail-stop {
	stop-color: var(--mexica-progress-head);
}

.sunnys-mexica-calendar .mexica-wheel__progress-flow-trail {
	fill: none;
	pointer-events: none;
	vector-effect: non-scaling-stroke;
	stroke-width: 4.25;
	stroke-linecap: round;
	filter: drop-shadow(0 0 2px var(--mexica-progress-head)) drop-shadow(0 0 4px var(--mexica-progress-glow));
}

.sunnys-mexica-calendar .mexica-wheel__progress-flow-trail--mobile {
	display: none;
}

.sunnys-mexica-calendar .mexica-wheel__progress-flow-head-halo {
	fill: var(--mexica-progress-value);
	opacity: .38;
	filter: drop-shadow(0 0 4px var(--mexica-progress-glow));
}

.sunnys-mexica-calendar .mexica-wheel__progress-flow-head-core {
	fill: var(--mexica-progress-head);
	stroke: var(--mexica-progress-value);
	stroke-width: .8;
	vector-effect: non-scaling-stroke;
	filter: drop-shadow(0 0 3px var(--mexica-progress-glow));
}

@media (max-width: 760px) {
.sunnys-mexica-calendar .mexica-wheel__progress-flow-trail--desktop {
		display: none;
	}

	.sunnys-mexica-calendar .mexica-wheel__progress-flow-trail--mobile {
		display: block;
	}

	.sunnys-mexica-calendar .mexica-wheel__progress-flow-trail--mobile-glow {
		stroke-width: 10;
		opacity: .28;
		filter: drop-shadow(0 0 5px var(--mexica-progress-head)) drop-shadow(0 0 9px var(--mexica-progress-glow));
	}

	.sunnys-mexica-calendar .mexica-wheel__progress-flow-trail--mobile-core {
		stroke-width: 5.75;
		opacity: 1;
		filter: drop-shadow(0 0 3px var(--mexica-progress-head)) drop-shadow(0 0 6px var(--mexica-progress-glow));
	}

	.sunnys-mexica-calendar .mexica-wheel__progress-flow-head-halo {
		r: 10px;
		opacity: .52;
		filter: drop-shadow(0 0 6px var(--mexica-progress-glow));
	}

	.sunnys-mexica-calendar .mexica-wheel__progress-flow-head-core {
		r: 4.5px;
		stroke-width: 1.1;
		filter: drop-shadow(0 0 4px var(--mexica-progress-head)) drop-shadow(0 0 7px var(--mexica-progress-glow));
	}
}

/* The existing mobile adapter separates glyph artwork from the progress SVG.
 * Enable the same six-second orbit on that lightweight iOS surface, preserving
 * its existing play-state policy during input. */
@media (prefers-reduced-motion: no-preference) {
  .sunnys-mexica-calendar.is-ios-webkit.mexica-paint-ready .mexica-wheel__progress-flow-orbit {
    animation-name: mexica-progress-flow;
    animation-duration: 6s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
  }
  .sunnys-mexica-calendar.is-ios-webkit.mexica-paint-ready [data-mexica-progress-flow="haab"] .mexica-wheel__progress-flow-orbit {
    animation-direction: reverse;
  }
}

/* iOS/iPadOS WebKit: keep gradient paint and trail geometry in the same
 * coordinate space. Non-scaling strokes distort these rotating gradients.
 * This applies at every viewport width, including iPad with a trackpad. */
@supports (-webkit-touch-callout: none) {
	/* Keep the SVG progress mask: animated light belongs only to the filled arc. */
	.sunnys-mexica-calendar .mexica-wheel__progress-flow-trail {
		vector-effect: none;
		stroke-width: 5.7;
	}

	/* Existing halo circles and mobile glow paths provide the soft light. */
	.sunnys-mexica-calendar :is(
		.mexica-wheel__progress-flow-trail,
		.mexica-wheel__progress-flow-head-halo,
		.mexica-wheel__progress-flow-head-core
	) {
		filter: none !important;
	}

	@media (max-width: 760px) {
		/* SVG units compensate for the smaller stacked dials. */
		.sunnys-mexica-calendar .mexica-wheel__progress-flow-trail--mobile-glow {
			stroke-width: 17;
		}
		.sunnys-mexica-calendar .mexica-wheel__progress-flow-trail--mobile-core {
			stroke-width: 9.5;
		}
	}
}