/* Orb formation is isolated to index2. SVG and photo share the same centered cover mapping. */
.orb-scene { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; pointer-events: none; --orb-cycle: 12s; }
.orb-scene[hidden] { display: none; }
.orb-clean-state { animation: orbEmptyState var(--orb-cycle) linear infinite; }
.orb-ignite { transform-box: fill-box; transform-origin: center; animation: orbIgnite var(--orb-cycle) ease-in-out infinite; }
.orb-formed { animation: orbFormed var(--orb-cycle) ease-in-out infinite; }
.orb-orbit-spin, .orb-orbit-return { transform-box: fill-box; transform-origin: center; }
.orb-orbit-spin { animation: orbOrbit 7s linear infinite; }
.orb-orbit-return { animation: orbOrbit 9s linear infinite reverse; }
.orb-meridian { animation: orbFlow 5s linear infinite; }
.orb-particles { animation: orbTwinkle 2.8s ease-in-out infinite alternate; }
@keyframes orbEmptyState { 0%,10% {opacity:1} 32%,73% {opacity:0} 94%,100% {opacity:1} }
@keyframes orbIgnite { 0%,8%,94%,100% {opacity:0;transform:scale(.1)} 18% {opacity:.8;transform:scale(.5)} 32% {opacity:1;transform:scale(1.1)} 48%,65% {opacity:.6;transform:scale(.8)} 74% {opacity:.9;transform:scale(1)} }
@keyframes orbFormed { 0%,20%,94%,100% {opacity:0} 36%,73% {opacity:.85} }
@keyframes orbOrbit { from {transform:rotate(-16deg)} to {transform:rotate(344deg)} }
@keyframes orbFlow { to {stroke-dashoffset:-120} }
@keyframes orbTwinkle { from {opacity:.25} to {opacity:1} }
.gateway.is-motion-paused .gateway-art *,
.gateway.is-motion-backgrounded .gateway-art * { animation-play-state: paused !important; }
.gateway-motion-toggle {
  display: flex; align-items: center; gap: 8px; margin-top: 16px;
  min-height: 44px; padding: 8px 14px; border: 1px solid var(--line); border-radius: 999px;
  color: var(--muted); background: var(--glass); font: inherit; font-size: 14px; cursor: pointer;
}
.gateway-motion-toggle[hidden] { display: none; }
.gateway-motion-toggle:focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
  .orb-scene, .gateway-motion-toggle { display: none !important; }
  .gateway-art * { animation: none !important; }
}


/* Seer's eyes: full red halo, bloom and light streaks, synchronized with the existing 12s orb cycle. */
.orb-scene { --seer-eye-red: #f0182d; --seer-eye-core: #ff4c59; --seer-eye-deep: #b90018; }
.seer-eye-power { animation: seerEyesAwaken var(--orb-cycle) ease-in-out infinite; }
.seer-eye-shimmer { animation: seerEyesShimmer 2.4s ease-in-out infinite alternate; }
@keyframes seerEyesAwaken {
  0%,8%,94%,100% { opacity: 0; }
  18% { opacity: .55; }
  32%,48% { opacity: 1; }
  70% { opacity: .85; }
  82% { opacity: .4; }
}
@keyframes seerEyesShimmer { from { opacity: .78; } to { opacity: 1; } }