@media (prefers-reduced-motion: no-preference){
  :root{
    --zyl-coa-origin-x: 50%;
    --zyl-coa-origin-y: 50%;
    --zyl-coa-leave-duration: 380ms;
    --zyl-coa-enter-duration: 760ms;
    --zyl-coa-enter-delay: 24ms;
  }

  body.zyl-coa-route-entering,
  body.zyl-coa-route-leaving{
    transform-origin: var(--zyl-coa-origin-x) var(--zyl-coa-origin-y);
  }

  body::before,
  body::after{
    content:"";
    position:fixed;
    pointer-events:none;
    opacity:0;
    z-index:9999;
  }

  body::before{
    inset:0;
    background:rgba(255,255,255,0);
    backdrop-filter:blur(0px);
    transition:
      opacity 220ms ease,
      backdrop-filter 380ms ease,
      background-color 380ms ease;
  }

  body::after{
    top:var(--zyl-coa-origin-y);
    left:var(--zyl-coa-origin-x);
    width:26rem;
    height:26rem;
    border-radius:999px;
    transform:translate(-50%, -50%) scale(0.18);
    background:
      radial-gradient(circle,
        rgba(255,255,255,0.98) 0%,
        rgba(255,255,255,0.92) 16%,
        rgba(255,255,255,0.44) 42%,
        rgba(255,255,255,0) 74%);
    filter:blur(0px);
    transition:
      opacity 160ms ease,
      transform 520ms cubic-bezier(0.18, 0.89, 0.32, 1.08),
      filter 520ms cubic-bezier(0.18, 0.89, 0.32, 1.08);
  }

  body.zyl-coa-route-leaving{
    pointer-events:none;
    animation:zylCoaLeaveRoot var(--zyl-coa-leave-duration) cubic-bezier(0.2, 0.84, 0.28, 1) both;
  }

  body.zyl-coa-route-leaving::before{
    opacity:1;
    background:rgba(255,255,255,0.82);
    backdrop-filter:blur(12px);
  }

  body.zyl-coa-route-leaving::after{
    opacity:1;
    transform:translate(-50%, -50%) scale(2.7);
    filter:blur(6px);
  }

  body.zyl-coa-route-entering{
    animation:zylCoaEnterRoot var(--zyl-coa-enter-duration) cubic-bezier(0.18, 0.82, 0.28, 1) both;
  }

  body.zyl-coa-route-entering::before{
    opacity:1;
    background:rgba(255,255,255,0.64);
    backdrop-filter:blur(6px);
    animation:zylCoaEnterVeil calc(var(--zyl-coa-enter-duration) - 120ms) ease forwards;
  }

  body.zyl-coa-route-entering::after{
    opacity:1;
    animation:zylCoaEnterBloom calc(var(--zyl-coa-enter-duration) - 80ms) cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }

  .spotlightSection.is-direct-entry{
    scroll-margin-top:28px;
  }

  .spotlightSection.is-direct-entry .spotlightLayout{
    animation:zylCoaSpotlightDirect 820ms cubic-bezier(0.18, 0.82, 0.28, 1) both;
  }

  .spotlightSection.is-direct-entry .spotlightAction{
    animation:zylCoaActionPulse 880ms cubic-bezier(0.16, 1, 0.3, 1) 120ms both;
  }

  @keyframes zylCoaLeaveRoot{
    from{
      opacity:1;
      transform:scale(1);
      filter:blur(0px) saturate(1);
    }
    to{
      opacity:0;
      transform:scale(0.86);
      filter:blur(12px) saturate(0.92);
    }
  }

  @keyframes zylCoaEnterRoot{
    0%{
      opacity:0;
      transform:scale(1.065);
      filter:blur(14px) saturate(1.08);
    }
    56%{
      opacity:1;
    }
    100%{
      opacity:1;
      transform:scale(1);
      filter:blur(0px) saturate(1);
    }
  }

  @keyframes zylCoaEnterVeil{
    from{
      opacity:1;
      backdrop-filter:blur(6px);
      background:rgba(255,255,255,0.64);
    }
    to{
      opacity:0;
      backdrop-filter:blur(0px);
      background:rgba(255,255,255,0);
    }
  }

  @keyframes zylCoaEnterBloom{
    0%{
      opacity:0.92;
      transform:translate(-50%, -50%) scale(2.3);
      filter:blur(10px);
    }
    100%{
      opacity:0;
      transform:translate(-50%, -50%) scale(0.42);
      filter:blur(0px);
    }
  }

  @keyframes zylCoaSpotlightDirect{
    0%{
      opacity:0;
      transform:translateY(34px) scale(0.972);
      filter:blur(18px);
    }
    55%{
      opacity:1;
    }
    100%{
      opacity:1;
      transform:translateY(0) scale(1);
      filter:blur(0px);
    }
  }

  @keyframes zylCoaActionPulse{
    0%{
      box-shadow:0 0 0 rgba(10,13,16,0);
      transform:translateY(16px);
      opacity:0;
    }
    60%{
      opacity:1;
    }
    100%{
      box-shadow:0 18px 34px rgba(10,13,16,0.14);
      transform:translateY(0);
      opacity:1;
    }
  }
}