/* ==========================================================================
   clouds.css  -  the cloud layer between pages (see js/clouds.js, which
   paints the cloud pictures itself).
   The cloud pictures are painted by the script; the thin veil below only
   covers the instant between pages.
   Off for visitors who ask for reduced motion (the script does not run).
   ========================================================================== */

/* Thin veil used while the next page loads, so the clouds do not pop in. The
   page stays visible through it. The animation removes it by itself
   after 3s in case the script never runs. */
html.ny-cl-cover::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 99998;
  background: rgba(205, 214, 228, .22);
  pointer-events: none;
  animation: ny-cl-failsafe .6s ease 3s forwards;
}
@keyframes ny-cl-failsafe { to { opacity: 0; visibility: hidden; } }

.ny-clouds {
  position: fixed;
  inset: 0;
  z-index: 99999;
  overflow: hidden;
  pointer-events: none;
}
.ny-clouds.is-blocking { pointer-events: auto; cursor: progress; }

.ny-cl-puff {
  position: absolute;
  opacity: 0;
  will-change: transform, opacity;
}
/* The cloud layers inside a cloud (js/clouds.js turns and slides them). */
.ny-cl-in {
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
}

/* A page that arrives through the clouds shows its content straight away,
   instead of fading each block in after the scripts load (which would leave a
   blank field under the clouds). js/clouds.js removes ny-cl-show when they clear. */
html.ny-cl-show .ny-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }

/* An arriving page is drawn in full behind a midnight-blue veil (no half-drawn
   blocks, bands or dark boxes), and the veil then melts away under the thinning
   clouds so the whole page dissolves in at once. The animation removes the veil
   by itself after 3s if the script never runs. */
html.ny-cl-hold::after, html.ny-cl-fade::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 99997;
  background: linear-gradient(#0e4057 0%, #082331 38%, #061620 100%);
  pointer-events: none;
}
html.ny-cl-hold::after { opacity: 1; animation: ny-cl-holdfs .6s ease 3s forwards; }
html.ny-cl-fade::after { opacity: 0; transition: opacity 1.3s ease; }
html.ny-cl-hold main iframe, html.ny-cl-fade main iframe { visibility: hidden; }
@keyframes ny-cl-holdfs { to { opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
  html.ny-cl-cover::before, .ny-clouds { display: none; }
  html.ny-cl-hold::after { display: none; }
}