/* URSY.PHOTOS — the aurora orb field + hue cycle.
   Copied from URSY.CLOUD / ursy-dev-aurora-effect.css. This is the estate's
   one piece of theatre and the "colour effect" the owner approved: four orb
   groups roaming on long paths, the whole field cycling hue over 90s.
   Markup (see parts/header.html — it sits at the top of the page):
     .ursy-field > .ursy-field__orbs (x2) + .ursy-field__vig
     .ursy-field__veil  .ursy-field__wash                                     */
.ursy-field{ position:fixed; inset:0; overflow:hidden; pointer-events:none; opacity:.45; z-index:0; }
.ursy-field__orbs{ position:absolute; inset:0; animation:hueCycle 90s linear infinite; }
.ursy-field__orbs--washes{ inset:-20%; mix-blend-mode:screen; }
.ursy-field__orbs i{ position:absolute; display:block; border-radius:50%; }
.ursy-field__orbs--washes i:nth-child(1){ left:-6%; top:-8%; width:74%; height:78%; opacity:.4; filter:blur(96px);
  background:radial-gradient(circle at 42% 40%, var(--o2) 0%, var(--o4) 44%, transparent 72%);
  animation:aurora1 38s ease-in-out infinite; }
.ursy-field__orbs--washes i:nth-child(2){ right:-8%; bottom:-10%; width:68%; height:72%; opacity:.34; filter:blur(104px);
  background:radial-gradient(circle at 58% 56%, var(--o1) 0%, var(--o3) 46%, transparent 74%);
  animation:aurora2 46s ease-in-out infinite; }
.ursy-orb{ position:absolute; }
.ursy-orb--1{ left:14%; top:6%; width:32vh; height:32vh; animation:roam1 70s ease-in-out infinite; }
.ursy-orb--2{ right:12%; top:24%; width:14vh; height:14vh; animation:roam2 84s ease-in-out infinite -7s; }
.ursy-orb--3{ left:52%; top:40%; width:20vh; height:20vh; animation:roam3 78s ease-in-out infinite -13s; }
.ursy-orb i{ position:absolute; display:block; border-radius:50%; }
.ursy-orb__bloom{ inset:-34%; opacity:.8; filter:blur(64px);
  background:radial-gradient(circle, var(--o2) 0%, var(--o4) 36%, transparent 68%);
  animation:bloom 5s ease-in-out infinite; }
.ursy-orb__body{ inset:0;
  background:radial-gradient(circle at 36% 30%, var(--o3) 0%, var(--o4) 28%, var(--o2) 58%, color-mix(in oklab, var(--o2) 32%, #000) 100%);
  box-shadow:0 0 160px -14px var(--o2), inset -22px -26px 52px -20px rgba(0,0,0,.6);
  animation:throb 3.4s ease-in-out infinite; }
.ursy-orb__core{ inset:20%; filter:blur(18px); mix-blend-mode:screen;
  background:radial-gradient(circle at 50% 55%, var(--o3) 0%, var(--o4) 36%, transparent 68%);
  animation:corePulse 3.6s ease-in-out infinite; }
.ursy-orb__spec{ left:20%; top:15%; width:26%; height:20%; filter:blur(5px); mix-blend-mode:screen;
  background:radial-gradient(circle at 40% 38%, var(--spec) 0%, rgba(255,255,255,.35) 42%, transparent 72%);
  animation:specDrift 7s ease-in-out infinite; }
.ursy-field__vig{ position:absolute; inset:0; background:var(--vig); }
/* the reading veil: blur over the field keeps every surface legible */
.ursy-field__veil{ position:fixed; inset:0; pointer-events:none; z-index:0; background:var(--scrim);
  backdrop-filter:blur(34px) saturate(126%); -webkit-backdrop-filter:blur(34px) saturate(126%); }
.ursy-field__wash{ position:fixed; inset:0; pointer-events:none; z-index:0; background:var(--bg); opacity:.38; }
@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 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 bloom{ 0%,100%{opacity:.62;transform:scale(.9)} 50%{opacity:1;transform:scale(1.22)} }
@keyframes throb{ 0%,100%{transform:scale(.86)} 35%{transform:scale(1.12)} 62%{transform:scale(.94)} }
@keyframes corePulse{ 0%,100%{opacity:.55;transform:scale(.92)} 50%{opacity:1;transform:scale(1.08)} }
@keyframes specDrift{ 0%,100%{transform:translate3d(0,0,0) scale(1);opacity:.95} 50%{transform:translate3d(22%,18%,0) scale(.74);opacity:.45} }
@keyframes roam1{ 0%{transform:translate3d(0,0,0) scale(1)} 20%{transform:translate3d(46%,28%,0) scale(1.14)} 42%{transform:translate3d(88%,-18%,0) scale(.86)} 66%{transform:translate3d(26%,-46%,0) scale(1.2)} 84%{transform:translate3d(-32%,-10%,0) scale(.94)} 100%{transform:translate3d(0,0,0) scale(1)} }
@keyframes roam2{ 0%{transform:translate3d(0,0,0) scale(1.06)} 24%{transform:translate3d(-72%,34%,0) scale(.88)} 48%{transform:translate3d(-30%,68%,0) scale(1.22)} 70%{transform:translate3d(34%,26%,0) scale(.92)} 100%{transform:translate3d(0,0,0) scale(1.06)} }
@keyframes roam3{ 0%{transform:translate3d(0,0,0) scale(.94)} 22%{transform:translate3d(58%,-44%,0) scale(1.18)} 46%{transform:translate3d(-24%,-72%,0) scale(.88)} 72%{transform:translate3d(-62%,-16%,0) scale(1.1)} 100%{transform:translate3d(0,0,0) scale(.94)} }
@keyframes rise{ from{opacity:0;transform:translate3d(0,14px,0)} to{opacity:1;transform:none} }
@keyframes livePulse{ 0%,100%{box-shadow:0 0 0 0 color-mix(in oklab, var(--ok) 40%, transparent)} 50%{box-shadow:0 0 0 5px color-mix(in oklab, var(--ok) 0%, transparent)} }
/* iOS/tablet compositor rule — DO NOT SKIP.
   Below 1024px iOS Safari cannot composite backdrop-filter over stacked fixed
   layers. Blur the FIELD directly instead; scale(1.14) hides the blurred edge. */
@media (max-width:1024px){
  .ursy-field__orbs{ animation:none; filter:blur(26px) saturate(126%); transform:scale(1.14); }
  .ursy-field__veil{ backdrop-filter:none; -webkit-backdrop-filter:none; }
}
