/* Star Photo Lab — designer portal ambient background
   Loaded ONLY by the logged-in designer pages (studio, profile, proof,
   quality-check, status, submit-work) so the animation is scoped to this
   portal and never leaks into admin or photographer screens.

   The designer portal is a creative workspace — albums get graded under warm
   light. So the background is that warm light, breathing slowly: two soft POP
   orange glows drifting on different tempos for a gentle parallax. Disciplined
   on purpose — transform/opacity only (GPU, no reflow), low contrast so text
   legibility is untouched, pinned behind content (z-index:-1), and frozen for
   anyone who asked for reduced motion. Uber theme: near-black + ONE orange. */

body {
  min-height: 100vh;
  background: linear-gradient(180deg, #ffffff 0%, #f6f6f7 100%);
}

/* Layer 1 — the main warm glow, top-left to bottom-right. */
body::before {
  content: "";
  position: fixed;
  inset: -25%;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(40% 40% at 14% 12%, rgba(255, 90, 31, 0.13), transparent 62%),
    radial-gradient(34% 34% at 88% 78%, rgba(255, 90, 31, 0.07), transparent 60%);
  animation: dz-drift 24s ease-in-out infinite;
  will-change: transform;
}

/* Layer 2 — a larger, fainter glow drifting the OTHER way and slower, so the
   two layers slide past each other and the light feels alive, not looping. */
body::after {
  content: "";
  position: fixed;
  inset: -30%;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(46% 46% at 78% 18%, rgba(255, 90, 31, 0.06), transparent 64%),
    radial-gradient(40% 40% at 22% 88%, rgba(255, 90, 31, 0.05), transparent 62%);
  animation: dz-drift-2 33s ease-in-out infinite;
  will-change: transform;
}

@keyframes dz-drift {
  0%   { transform: translate3d(-7%, -5%, 0) scale(1.02); }
  50%  { transform: translate3d(6%, 4%, 0) scale(1.12); }
  100% { transform: translate3d(-7%, -5%, 0) scale(1.02); }
}
@keyframes dz-drift-2 {
  0%   { transform: translate3d(8%, 5%, 0) scale(1.1); }
  50%  { transform: translate3d(-8%, -6%, 0) scale(1.0); }
  100% { transform: translate3d(8%, 5%, 0) scale(1.1); }
}

@media (prefers-reduced-motion: reduce) {
  body::before,
  body::after { animation: none; }
}