/* Subtle animated wash for app / auth / legal pages — not login or home.
   Keep z-index negative so fixed chrome (menu backdrop, banners) still
   stacks against page content instead of against a trapped .app context. */

body:has(.page-atmosphere) {
  background: transparent;
}

html:has(.page-atmosphere) {
  background: var(--page-atmosphere-html-bg, #eef3f6);
}

.page-atmosphere {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  background: var(--page-atmosphere-bg, linear-gradient(165deg, #f4f7f9 0%, #eef3f6 45%, #e8eef2 100%));
  animation: soft-fade 0.9s var(--ease) both;
}

.page-atmosphere__wash {
  position: absolute;
  width: 82vmax;
  height: 82vmax;
  border-radius: 50%;
  pointer-events: none;
}

.page-atmosphere__wash--sea {
  left: -34%;
  top: -38%;
  background: radial-gradient(
    circle,
    rgba(47, 111, 126, 0.28) 0%,
    rgba(215, 232, 236, 0.35) 38%,
    transparent 68%
  );
  animation: page-wash-drift 22s ease-in-out infinite alternate;
}

.page-atmosphere__wash--warm {
  right: -36%;
  bottom: -40%;
  background: radial-gradient(
    circle,
    rgba(196, 92, 38, 0.16) 0%,
    rgba(240, 228, 216, 0.4) 36%,
    transparent 70%
  );
  animation: page-wash-drift-alt 28s ease-in-out infinite alternate;
}

.page-atmosphere__wash--mist {
  left: 18%;
  top: 22%;
  width: 56vmax;
  height: 56vmax;
  background: radial-gradient(
    circle,
    rgba(247, 249, 251, 0.85) 0%,
    rgba(232, 238, 244, 0.35) 45%,
    transparent 72%
  );
  animation: page-wash-mist 18s ease-in-out infinite alternate;
}

@keyframes page-wash-drift {
  from {
    transform: translate3d(0, 0, 0) scale(1);
  }
  to {
    transform: translate3d(10%, 8%, 0) scale(1.08);
  }
}

@keyframes page-wash-drift-alt {
  from {
    transform: translate3d(0, 0, 0) scale(1);
  }
  to {
    transform: translate3d(-9%, -7%, 0) scale(1.1);
  }
}

@keyframes page-wash-mist {
  from {
    transform: translate3d(0, 0, 0);
    opacity: 0.7;
  }
  to {
    transform: translate3d(-6%, 5%, 0);
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-atmosphere,
  .page-atmosphere__wash--sea,
  .page-atmosphere__wash--warm,
  .page-atmosphere__wash--mist {
    animation: none;
  }

  .page-atmosphere__wash--mist {
    opacity: 0.85;
  }
}