/* Motion never changes the final layout or the fitted text transforms. */
.lp-motion-pending { opacity: 0; }
/* Remove offscreen animations entirely so WebKit can release their layers. */
.lp-loop-float { --lp-loop-animation: lp-float var(--motion-period, 7s) ease-in-out var(--motion-phase, 0s) infinite; }
.lp-loop-backdrop { --lp-loop-animation: lp-backdrop var(--motion-period, 9s) ease-in-out var(--motion-phase, 0s) infinite; }
.lp-loop-cta { --lp-loop-animation: lp-cta 3.8s ease-in-out infinite; }
.lp-loop-arrow { --lp-loop-animation: lp-arrow 2.6s ease-in-out infinite; }
.lp-loop-play { --lp-loop-animation: lp-play 3.5s ease-in-out infinite; }
.lp-motion-on:not(.lp-motion-paused):not(.lp-motion-printing) body:not(.modal-open) .lp-loop.lp-in-view { animation: var(--lp-loop-animation); }
.lp-motion-reduced .lp-loop { animation: none !important; }

/* Sweep only the chart surface so its labels stay upright and readable. */
.age-pie.lp-age-pie { background: transparent; box-shadow: none; }
.lp-age-pie .age-other { opacity: var(--lp-other-opacity, 1); }
.lp-age-surface {
  position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none;
}
.lp-age-main-path { fill: #74dacf; }
.lp-age-other-path { fill: #fff; }
.lp-age-outline-path { fill: none; stroke: #fff; stroke-width: 3; }
.age-main strong .lp-count-value { position: relative; display: inline-block; font: inherit; vertical-align: baseline; }
.age-main strong .lp-count-value > span { font: inherit; }
.lp-count-reserve { visibility: hidden; }
.lp-count-live { position: absolute; right: 0; top: 0; }

@keyframes lp-float {
  0%, 100% { translate: 0 0; rotate: -1deg; }
  50% { translate: 3px -7px; rotate: 2deg; }
}
@keyframes lp-backdrop {
  0%, 100% { translate: 0 0; scale: 1; }
  50% { translate: 5px -8px; scale: 1.008; }
}
@keyframes lp-cta {
  0%, 62%, 100% { box-shadow: 0 0 0 0 #fff0; }
  76% { box-shadow: 0 0 0 9px #ffffff32; }
  92% { box-shadow: 0 0 0 16px #fff0; }
}
@keyframes lp-arrow {
  0%, 35%, 100% { translate: 0 0; }
  55%, 75% { translate: 6px 0; }
}
@keyframes lp-play {
  0%, 100% { scale: 1; }
  50% { scale: 1.055; }
}

.action, .lineup-cta a, .faq-item, .media-list li { transition: box-shadow .22s ease, background-color .22s ease; }
.action:active { box-shadow: inset 0 0 0 3px #009f9c35; }
@media (hover: hover) and (pointer: fine) {
  .action:not(.faq-toggle):hover { box-shadow: 0 8px 22px #006c6d28; }
  .faq-item:hover { box-shadow: 0 8px 22px #006c6d12; }
  .lineup-cta a:hover { box-shadow: 0 8px 24px #00595b32; }
}
@media (prefers-reduced-motion: reduce), print {
  .lp-motion-pending { opacity: 1; }
  .lp-loop { animation: none !important; }
  .lp-age-pie .age-other { opacity: 1; }
  .action, .lineup-cta a, .faq-item, .media-list li { transition: none; }
}