/* WordPress channel adapter: retain Velora primitives, give each channel its clock. */
[data-skif-motion-channels] {
    --skif-scroll-range: var(--vl-scroll-range, entry 5% cover 42%);
    animation-name: var(--vl-enter-name, none), var(--vl-scroll-name, none), var(--vl-exit-name, none), var(--vl-loop-name, none);
    animation-duration: var(--vl-enter-duration, var(--vl-motion-duration, 600ms)), 1ms, 1ms, var(--skif-loop-duration, var(--vl-loop-duration, 4s));
    animation-delay: var(--vl-enter-delay, var(--vl-motion-delay, 0s)), 0s, 0s, var(--skif-loop-delay, calc(var(--vl-enter-delay, var(--vl-motion-delay, 0s)) + var(--vl-enter-duration, var(--vl-motion-duration, 600ms))));
    animation-timing-function: var(--vl-enter-ease, var(--vl-motion-ease, ease)), linear, var(--vl-exit-ease, var(--vl-ease-out-soft, ease-out)), var(--vl-loop-ease, ease-in-out);
    animation-iteration-count: 1, 1, 1, infinite;
    animation-direction: normal, var(--vl-scroll-direction, normal), normal, var(--vl-loop-direction, normal);
    animation-fill-mode: backwards, both, forwards, none;
    animation-timeline: auto, var(--vl-scroll-timeline, view(block)), view(block 0px), auto;
    animation-range: normal, var(--skif-scroll-range), exit var(--skif-exit-start, 0%) exit 100%, normal;
    animation-composition: replace, add, replace, add;
    animation-play-state: running;
}
[data-skif-motion-channels][vl-range="entry"] { --skif-scroll-range: entry 0% entry 100%; }
[data-skif-motion-channels][vl-range="entry-short"] { --skif-scroll-range: entry 15% cover 35%; }
[data-skif-motion-channels][vl-range="entry-long"] { --skif-scroll-range: entry 0% cover 70%; }
[data-skif-motion-channels][vl-range="cover"] { --skif-scroll-range: cover 0% cover 100%; }
[data-skif-motion-channels][vl-range="contain"] { --skif-scroll-range: contain 0% contain 100%; }
[data-skif-motion-channels][vl-range="custom"] { --skif-scroll-range: var(--vl-range, entry 5% cover 42%); }
[data-skif-motion-channels][vl-range="scene-soft"] { --skif-scroll-range: entry 0% cover 82%; }
[data-skif-motion-channels][vl-range="scene-focus"] { --skif-scroll-range: entry 20% cover 65%; }
/* Opacity scrubs replace rather than add opacity to the entry channel. */
[vl-in-view] [data-skif-motion-channels][vl-enter] {
    /* The entry releases its fill to allow hover. Restore the host's base opacity. */
    opacity: 1;
    visibility: visible;
}
[data-skif-motion-channels]:is([vl-scroll="crossfade"], [vl-scroll="reveal"], [vl-scroll="depth-drift"]) { animation-composition: replace, replace, replace, add; }
@supports not (animation-timeline: view()) {
    [data-skif-motion-channels] { animation-name: var(--vl-enter-name, none), none, none, var(--vl-loop-name, none); }
}
@media(prefers-reduced-motion: reduce) {
    [data-skif-motion-channels] { animation: none !important; opacity: 1 !important; transform: none !important; filter: none !important; clip-path: none !important; }
}
@supports(animation-timeline: view()) {
 @media(prefers-reduced-motion: no-preference) {
  @container vl-in-view style(--vl-in-view-state: 0) {
   [vl-in-view] [data-skif-motion-channels][vl-loop]:not(.vl-editor-host, .vl-editor-host *) { animation-play-state: running, running, running, paused; }
   [vl-in-view] [data-skif-motion-channels][vl-enter]:not(.vl-editor-host, .vl-editor-host *) {
    opacity: 0;
    visibility: hidden;
    animation-name: none, var(--vl-scroll-name, none), var(--vl-exit-name, none), var(--vl-loop-name, none);
   }
  }
 }
}
/* Complete presets exposed by the WordPress catalog. */
[data-skif-motion-channels][vl-enter="focus"] { --vl-enter-name: vl-blur-in; }
@keyframes vl-depth-push {
 from { transform: perspective(var(--vl-depth-perspective, 1000px)) translateZ(var(--vl-depth-z-from, 80px)) scale(var(--vl-depth-scale-from, 1.08)); opacity: var(--vl-opacity-from, .3); }
 to { transform: perspective(var(--vl-depth-perspective, 1000px)) translateZ(var(--vl-depth-z-to, 0px)) scale(var(--vl-depth-scale-to, 1)); opacity: var(--vl-opacity-to, 1); }
}
[data-skif-motion-channels][vl-scroll="depth-push"] { --vl-scroll-name: vl-depth-push; --vl-scroll-range: entry 0% entry 100%; animation-composition: replace, replace, replace, add; }
[data-skif-motion-channels][vl-scroll="path"] { --vl-scroll-name: vl-path-travel; --vl-path: path("M0 0 L80 0"); offset-path: var(--vl-path); }
[data-skif-path="rise"] { --vl-path: path("M0 0 L60 -60"); }
[data-skif-path="arc"] { --vl-path: path("M0 0 Q60 -80 120 0"); }

/* Names belong to their node; inherited parent presets must not add channels. */
[data-skif-motion-channels]:not([vl-enter]) { --vl-enter-name: none; }
[data-skif-motion-channels]:not([vl-scroll]) { --vl-scroll-name: none; }
[data-skif-motion-channels]:not([vl-exit]) { --vl-exit-name: none; }
[data-skif-motion-channels]:not([vl-loop]) { --vl-loop-name: none; }

/* Preserve elapsed entry time on touch screens instead of replaying on every return. */
@supports(animation-timeline: view()) {
 @media(prefers-reduced-motion: no-preference) {
  @media(max-width:782px), (hover:none) and (pointer:coarse) {
   @container vl-in-view style(--vl-in-view-state: 0) {
    [vl-in-view] [data-skif-motion-channels][vl-enter]:not(.vl-editor-host, .vl-editor-host *) {
     animation-name: var(--vl-enter-name, none), var(--vl-scroll-name, none), var(--vl-exit-name, none), var(--vl-loop-name, none);
     animation-play-state: paused, running, running, paused;
    }
   }
  }
 }
}