/* The existing NERO mascot, shared with the site's favicon and reader mark. */
.nero-loader {
  --nero-mark-size: 92px;
  position: relative;
  display: block;
  width: calc(var(--nero-mark-size) + 32px);
  height: calc(var(--nero-mark-size) + 38px);
  margin: 0 auto 18px;
  direction: ltr;
  isolation: isolate;
}
.nero-loader::before {
  content: "";
  position: absolute;
  inset: -20px -22px 12px;
  z-index: -1;
  background: radial-gradient(ellipse, rgba(243, 80, 80, .12), transparent 68%);
  animation: nero-loader-glow 2.8s ease-in-out infinite;
}
.nero-loader::after {
  content: "";
  position: absolute;
  left: 26%;
  right: 26%;
  bottom: 22px;
  height: 6px;
  border-radius: 50%;
  background: rgba(0, 0, 0, .24);
  filter: blur(3px);
  animation: nero-loader-shadow 2.8s ease-in-out infinite;
}
.nero-loader__mascot {
  position: absolute;
  top: 3px;
  left: 16px;
  width: var(--nero-mark-size);
  height: var(--nero-mark-size);
  perspective: 220px;
  animation: nero-loader-read 2.8s ease-in-out infinite;
}
.nero-loader__mascot > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 7px 12px rgba(0, 0, 0, .12));
}
.nero-loader__page {
  position: absolute;
  left: 50%;
  top: 68%;
  width: 31%;
  height: 29%;
  overflow: visible;
  transform-origin: 0 70%;
  opacity: 0;
  animation: nero-loader-turn 2.8s ease-in-out infinite;
}
.nero-loader__dots {
  position: absolute;
  bottom: 1px;
  inset-inline: 0;
  display: flex;
  justify-content: center;
  gap: 7px;
}
.nero-loader__dots > i {
  display: block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--accent, #f35050);
  opacity: .3;
  animation: nero-loader-dot 1.4s ease-in-out infinite;
}
.nero-loader__dots > i:nth-child(2) { animation-delay: .16s; }
.nero-loader__dots > i:nth-child(3) { animation-delay: .32s; }
.nero-loading-caption { display: block; }
@keyframes nero-loader-read {
  0%, 100% { transform: translateY(0) rotate(-1deg); }
  50% { transform: translateY(-5px) rotate(1deg); }
}
@keyframes nero-loader-turn {
  0%, 22% { opacity: 0; transform: rotateY(0deg); }
  30% { opacity: 1; transform: rotateY(-10deg); }
  65% { opacity: 1; transform: rotateY(-160deg); }
  73%, 100% { opacity: 0; transform: rotateY(-175deg); }
}
@keyframes nero-loader-glow {
  0%, 100% { opacity: .55; transform: scale(.94); }
  50% { opacity: 1; transform: scale(1.04); }
}
@keyframes nero-loader-shadow {
  0%, 100% { transform: scaleX(1); opacity: .7; }
  50% { transform: scaleX(.82); opacity: .4; }
}
@keyframes nero-loader-dot {
  0%, 65%, 100% { opacity: .3; transform: translateY(0); }
  30% { opacity: 1; transform: translateY(-3px); }
}
@media (max-width: 600px) {
  .nero-loader { --nero-mark-size: 80px; }
}
@media (prefers-reduced-motion: reduce) {
  .nero-loader::before,
  .nero-loader::after,
  .nero-loader__mascot,
  .nero-loader__page,
  .nero-loader__dots > i { animation: none; }
  .nero-loader__page { display: none; }
  .nero-loader__dots > i { opacity: .75; }
}
