/* ==========================================================================
   URSY.HOSTING — THE FIELD. Copied from URSY.CLOUD assets/css/aurora.css.
   WASHES ONLY, behind a veil, spanning the WHOLE page. Cloud's rule is
   explicit: never orb spheres behind working content. If you can see distinct
   spheres, the implementation is wrong.
   blur(110px) + wrapper opacity .45 is what makes this read as light in the
   room rather than as graphics. hueCycle on the wrapper is "the colour effect";
   theme.js profiles rewrite --o1…--o4 underneath it.
   ========================================================================== */
.ursy-field{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.ursy-field__washes{ position:absolute; inset:-25%; filter:blur(110px) saturate(110%); opacity:.45;
  animation:hueCycle 90s linear infinite; }
.ursy-field__washes i{ position:absolute; display:block; border-radius:50%; }
.ursy-field__washes i:nth-child(1){ inset-inline-start:-5%; top:-8%; width:64%; height:46%; opacity:.5;
  background:radial-gradient(circle at 45% 40%, var(--o1) 0%, var(--o2) 52%, transparent 74%);
  animation:aurora1 46s ease-in-out infinite; }
.ursy-field__washes i:nth-child(2){ inset-inline-end:-8%; top:12%; width:58%; height:40%; opacity:.4;
  background:radial-gradient(circle at 55% 55%, var(--o2) 0%, var(--o1) 50%, transparent 72%);
  animation:aurora2 54s ease-in-out infinite; }
.ursy-field__washes i:nth-child(3){ inset-inline-start:20%; top:52%; width:60%; height:34%; opacity:.3;
  background:radial-gradient(circle at 50% 50%, var(--o3) 0%, var(--o4) 48%, transparent 74%);
  animation:aurora1 68s ease-in-out infinite reverse; }
.ursy-field__washes i:nth-child(4){ inset-inline-end:2%; bottom:-6%; width:54%; height:30%; opacity:.26;
  background:radial-gradient(circle at 45% 50%, var(--o4) 0%, var(--o2) 52%, transparent 74%);
  animation:aurora2 76s ease-in-out infinite; }
.ursy-field__veil{ position:absolute; inset:0; background:var(--scrim); }  /* plain tint */
.ursy-field__vig{ position:absolute; inset:0; background:var(--vig); }

@keyframes hueCycle{ 0%{filter:hue-rotate(0deg) saturate(1.15)} 25%{filter:hue-rotate(90deg) saturate(1.35)}
  50%{filter:hue-rotate(180deg) saturate(1.15)} 75%{filter:hue-rotate(270deg) saturate(1.35)} 100%{filter:hue-rotate(360deg) saturate(1.15)} }
@keyframes hueDrift{ 0%,100%{filter:hue-rotate(-16deg) saturate(1.1)} 50%{filter:hue-rotate(16deg) saturate(1.3)} }
@keyframes hueStill{ 0%,100%{filter:saturate(1.05)} 50%{filter:saturate(1.25)} }
@keyframes aurora1{ 0%,100%{transform:translate3d(-14%,-10%,0) scale(1.1) rotate(0deg)} 50%{transform:translate3d(16%,12%,0) scale(1.38) rotate(14deg)} }
@keyframes aurora2{ 0%,100%{transform:translate3d(12%,14%,0) scale(1.28) rotate(0deg)} 50%{transform:translate3d(-16%,-12%,0) scale(1.04) rotate(-16deg)} }
@keyframes livePulse{ 0%,100%{box-shadow:0 0 0 0 var(--ok)} 70%{box-shadow:0 0 0 5px transparent} }
