/* ==========================================================================
   THE FIELD — washes only, behind a veil, whole page. Never orb spheres.
   Hue animation lives on a PARENT of the blurred wrapper so the keyframed
   filter never replaces the blur (the classic mistake).
   On a holding page the field IS the content, so opacity runs hotter
   (--field-op .7/.6) than behind working content (.45).
   ========================================================================== */
.ucs-field{ position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.ucs-field__hue{ position:absolute; inset:0; animation:var(--hue-anim) 90s linear infinite; }
.ucs-field__washes{ position:absolute; inset:-25%; filter:blur(110px) saturate(110%); opacity:var(--field-op); }
.ucs-field__washes i{ position:absolute; display:block; border-radius:50%; }
.ucs-field__washes i:nth-child(1){ inset-inline-start:-5%; top:-8%; width:64%; height:46%; opacity:.6;
  background:radial-gradient(circle at 45% 40%, var(--o1) 0%, var(--o2) 52%, transparent 74%);
  animation:aurora1 46s ease-in-out infinite; }
.ucs-field__washes i:nth-child(2){ inset-inline-end:-8%; top:12%; width:58%; height:40%; opacity:.5;
  background:radial-gradient(circle at 55% 55%, var(--o2) 0%, var(--o1) 50%, transparent 72%);
  animation:aurora2 54s ease-in-out infinite; }
.ucs-field__washes i:nth-child(3){ inset-inline-start:20%; top:52%; width:60%; height:34%; opacity:.42;
  background:radial-gradient(circle at 50% 50%, var(--o3) 0%, var(--o4) 48%, transparent 74%);
  animation:aurora1 68s ease-in-out infinite reverse; }
.ucs-field__washes i:nth-child(4){ inset-inline-end:2%; bottom:-6%; width:54%; height:30%; opacity:.4;
  background:radial-gradient(circle at 45% 50%, var(--o4) 0%, var(--o2) 52%, transparent 74%);
  animation:aurora2 76s ease-in-out infinite; }
.ucs-field__veil{ position:absolute; inset:0; background:var(--scrim); }
.ucs-field__vig{ position:absolute; inset:0; background:var(--vig); }
.ucs-field__grain{ position:absolute; inset:-4%; opacity:.04; mix-blend-mode:overlay;
  animation:ucsGrain 7s steps(4) infinite;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='160'%20height='160'%3E%3Cfilter%20id='n'%3E%3CfeTurbulence%20type='fractalNoise'%20baseFrequency='0.82'%20numOctaves='3'%20stitchTiles='stitch'/%3E%3C/filter%3E%3Crect%20width='160'%20height='160'%20filter='url(%23n)'/%3E%3C/svg%3E"); }

@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(--neon)} 70%{box-shadow:0 0 0 6px transparent} }
@keyframes ucsSheen{ 0%{background-position:0% 50%} 100%{background-position:100% 50%} }
@keyframes ucsRise{ from{opacity:0; transform:translateY(16px)} to{opacity:1; transform:none} }
@keyframes ucsGrain{ 0%{transform:translate(0,0)} 25%{transform:translate(-2%,1%)} 50%{transform:translate(1%,-2%)} 75%{transform:translate(2%,2%)} 100%{transform:translate(0,0)} }