:root {
  --pacer-article-entry-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --pacer-article-entry-step: 84ms;
}

@keyframes pacer-article-entry-slide {
  from {
    opacity: 0;
    transform: translate3d(0, 10px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes pacer-article-entry-hero {
  from {
    opacity: 0;
    filter: blur(8px) saturate(0.96);
    transform: translate3d(0, 18px, 0) scale(0.978);
  }

  58% {
    filter: blur(0) saturate(1);
  }

  to {
    opacity: 1;
    filter: none;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

.pacer-article-entry-progress {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 2147483647;
  width: 100%;
  height: 2px;
  pointer-events: none;
  background: rgba(136, 136, 136, 0.78);
  opacity: 0;
  transform: scaleX(0);
  transform-origin: left center;
}

.pacer-article-entry-progress.is-active {
  opacity: 0.75;
  transform: scaleX(0.8);
  transition:
    opacity 120ms ease,
    transform 420ms var(--pacer-article-entry-ease);
}

.pacer-article-entry-progress.is-done {
  opacity: 0;
  transform: scaleX(1);
  transition:
    transform 180ms ease-out,
    opacity 260ms ease 140ms;
}

html.has-article-entry-top body.single-post:not(.is-short-photo-post) .wp-block-post-title,
html.has-article-entry-top body.single-post:not(.is-short-photo-post) .entry-meta:not(.post-views),
html.has-article-entry-top body.single-post:not(.is-short-photo-post) .liuyt-toc,
html.has-article-entry-top body.single-post:not(.is-short-photo-post) .wp-block-post-content > :not(.liuyt-toc),
html.has-article-entry-scroll body.single-post:not(.is-short-photo-post) .wp-block-post-content > :not(.liuyt-toc) {
  opacity: 0;
  transform: translate3d(0, 10px, 0);
}

html.has-article-entry-hero body.single-post:not(.is-short-photo-post) .wp-block-post-content > figure.wp-block-image:first-of-type {
  opacity: 0;
  filter: blur(8px) saturate(0.96);
  transform: translate3d(0, 18px, 0) scale(0.978);
}

body.is-article-entry-preparing.single-post:not(.is-short-photo-post) [data-article-entry-item] {
  opacity: 0;
  transform: translate3d(0, 10px, 0);
  will-change: opacity, transform;
}

body.is-article-entry-preparing.is-article-entry-active.single-post:not(.is-short-photo-post) [data-article-entry-item] {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  animation: pacer-article-entry-slide 1000ms var(--pacer-article-entry-ease) both;
  animation-delay: calc(var(--pacer-article-entry-index, 0) * var(--pacer-article-entry-step));
}

body.is-article-hero-preparing.single-post:not(.is-short-photo-post) [data-article-entry-hero] {
  opacity: 0;
  filter: blur(8px) saturate(0.96);
  transform: translate3d(0, 18px, 0) scale(0.978);
  transform-origin: center 58%;
  will-change: opacity, transform, filter;
}

body.is-article-hero-preparing.is-article-hero-active.single-post:not(.is-short-photo-post) [data-article-entry-hero] {
  opacity: 1;
  filter: none;
  transform: translate3d(0, 0, 0) scale(1);
  animation: pacer-article-entry-hero 1280ms var(--pacer-article-entry-ease) both;
  animation-delay: var(--pacer-article-hero-delay, calc(var(--pacer-article-entry-index, 0) * var(--pacer-article-entry-step)));
}

@media (prefers-reduced-motion: reduce) {
  .pacer-article-entry-progress,
  .pacer-article-entry-progress.is-active,
  .pacer-article-entry-progress.is-done {
    opacity: 0;
    transform: none;
    transition: none;
  }

  html.has-article-entry-top body.single-post:not(.is-short-photo-post) .wp-block-post-title,
  html.has-article-entry-top body.single-post:not(.is-short-photo-post) .entry-meta:not(.post-views),
  html.has-article-entry-top body.single-post:not(.is-short-photo-post) .liuyt-toc,
  html.has-article-entry-top body.single-post:not(.is-short-photo-post) .wp-block-post-content > :not(.liuyt-toc),
  html.has-article-entry-scroll body.single-post:not(.is-short-photo-post) .wp-block-post-content > :not(.liuyt-toc),
  html.has-article-entry-hero body.single-post:not(.is-short-photo-post) .wp-block-post-content > figure.wp-block-image:first-of-type,
  body.is-article-entry-preparing.single-post:not(.is-short-photo-post) [data-article-entry-item],
  body.is-article-entry-preparing.is-article-entry-active.single-post:not(.is-short-photo-post) [data-article-entry-item],
  body.is-article-hero-preparing.single-post:not(.is-short-photo-post) [data-article-entry-hero],
  body.is-article-hero-preparing.is-article-hero-active.single-post:not(.is-short-photo-post) [data-article-entry-hero] {
    opacity: 1;
    filter: none;
    transform: none;
    animation: none;
    transition: none;
  }
}
