/* ==========================================================================
   preloader.css — .global_preloader, the full-screen "blue wall with hearts"

   Every declaration below is verbatim from the site's own 35240.css
   (Vue scope data-v-65dabdc7). Nothing here is estimated.
   ========================================================================== */

.global_preloader {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 8888;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-content: center;
  align-items: center;
  background: rgba(0, 175, 240, .5);
  transition: opacity .2s ease;
  opacity: 0;
  pointer-events: none;
}

.global_preloader.active {
  opacity: 1;
  pointer-events: auto;
}

.loader-hearts {
  display: flex;
  max-width: 252px;      /* 6 hearts x (36 + 3 + 3) */
  pointer-events: none;
}

.loader-hearts svg {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  fill: #fff;
  margin-left: 3px;
  margin-right: 3px;
  animation: hearts 1s linear infinite;
}

/* Staggered by 0.13s so the white flash runs left-to-right along the row. */
.loader-hearts svg:first-child    { animation-delay: 0s; }
.loader-hearts svg:nth-child(2)   { animation-delay: .13s; }
.loader-hearts svg:nth-child(3)   { animation-delay: .26s; }
.loader-hearts svg:nth-child(4)   { animation-delay: .39s; }
.loader-hearts svg:nth-child(5)   { animation-delay: .52s; }
.loader-hearts svg:nth-child(6)   { animation-delay: .65s; }

/* Not a pulse or a scale — the heart's FILL snaps from white to brand blue at 1%
   and holds until the cycle restarts. That is the whole animation. */
@keyframes hearts {
  0%  { fill: #fff; }
  1%  { fill: #00aff0; }
}

@media (prefers-reduced-motion: reduce) {
  .loader-hearts svg { animation: none; fill: #fff; }
}

/* A subscribe reloads the visitor page into creator.html; the wall live
   keeps up across its in-place re-render is kept up across our reload: the
   head script raises html.m-sub-wall before first paint (opaque at once, no
   fade in), js/creator.js drops it once the first posts are drawn and the
   base .2s transition fades it out. */
html.m-sub-wall .global_preloader { opacity: 1; pointer-events: auto; transition: none; }
/* the same blue over the frames before the wall element at the end of body exists */
html.m-sub-wall::before { content: ""; position: fixed; inset: 0; z-index: 8887; background: rgba(0, 175, 240, .5); }