/* LoliMeow interaction and rendering refinements. */

html {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
}

a {
  transition-property: color, background-color, border-color, opacity, transform;
  transition-duration: 180ms;
  transition-timing-function: ease-out;
}

.post-list {
  content-visibility: auto;
  contain-intrinsic-size: auto 360px;
}

.post-list-img img,
.zoom-img img {
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

img {
  max-width: 100%;
}

img.lazy {
  will-change: opacity;
}

.boxmoe_header .navbar,
.mobile-user-panel,
.toast {
  backface-visibility: hidden;
  transform: translateZ(0);
}

.boxmoe_header .navbar.scrolled {
  animation-duration: 260ms;
}

@media (hover: hover) and (pointer: fine) {
  .zoom-img img {
    transition: transform 260ms cubic-bezier(.2,.7,.2,1);
  }

  .zoom-img:hover img {
    transform: scale(1.025);
  }
}

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }

  .preloader,
  #sakura,
  .boxmoe_header_banner_waves {
    display: none !important;
  }
}