/* Smooth layered image transitions, shared by splash page and inline elements. */
.kwi-player { position: relative; overflow: hidden; isolation: isolate; }
.kwi-player > .kwi-player-img {
    display: block; position: absolute; inset: 0; width: 100%; height: 100%;
    opacity: 0; z-index: 1; backface-visibility: hidden;
    transform: none; animation: none;
    will-change: opacity, transform, filter;
}
.kwi-player > .kwi-player-img.is-active { opacity: 1; z-index: 2; }
.kwi-player > .kwi-player-img.is-kwi-leave { z-index: 3; opacity: 1; }
.kwi-player > .kwi-player-img.is-kwi-enter { z-index: 4; opacity: 0; }
/* Equal-time cross-fade has no blank frame between slides. */
.kwi-player.kwi-transition-fade > .is-kwi-leave { animation: kwiFadeOut var(--kwi-transition-ms,650ms) ease-in-out both; }
.kwi-player.kwi-transition-fade > .is-kwi-enter { animation: kwiFadeIn var(--kwi-transition-ms,650ms) ease-in-out both; }
.kwi-player.kwi-transition-slide-left > .is-kwi-leave { animation: kwiMoveLeftOut var(--kwi-transition-ms,650ms) cubic-bezier(.25,.8,.25,1) both; }
.kwi-player.kwi-transition-slide-left > .is-kwi-enter { animation: kwiMoveLeftIn var(--kwi-transition-ms,650ms) cubic-bezier(.25,.8,.25,1) both; }
.kwi-player.kwi-transition-slide-up > .is-kwi-leave { animation: kwiMoveUpOut var(--kwi-transition-ms,650ms) cubic-bezier(.25,.8,.25,1) both; }
.kwi-player.kwi-transition-slide-up > .is-kwi-enter { animation: kwiMoveUpIn var(--kwi-transition-ms,650ms) cubic-bezier(.25,.8,.25,1) both; }
.kwi-player.kwi-transition-zoom > .is-kwi-leave { animation: kwiZoomOut var(--kwi-transition-ms,650ms) ease-in-out both; }
.kwi-player.kwi-transition-zoom > .is-kwi-enter { animation: kwiZoomIn var(--kwi-transition-ms,650ms) ease-in-out both; }
.kwi-player.kwi-transition-blur > .is-kwi-leave { animation: kwiBlurOut var(--kwi-transition-ms,650ms) ease-in-out both; }
.kwi-player.kwi-transition-blur > .is-kwi-enter { animation: kwiBlurIn var(--kwi-transition-ms,650ms) ease-in-out both; }
.kwi-player.kwi-transition-projector > .is-kwi-leave { animation: kwiSlideOut var(--kwi-transition-ms,650ms) ease-in-out both; }
.kwi-player.kwi-transition-projector > .is-kwi-enter { animation: kwiSlideIn var(--kwi-transition-ms,650ms) ease-in-out both; }
@keyframes kwiFadeOut { from { opacity:1; } to {opacity:0;} }
@keyframes kwiFadeIn { from { opacity:0; } to {opacity:1;} }
@keyframes kwiMoveLeftOut { from {transform:translateX(0);opacity:1;} to {transform:translateX(-12%);opacity:0;} }
@keyframes kwiMoveLeftIn { from {transform:translateX(12%);opacity:0;} to {transform:translateX(0);opacity:1;} }
@keyframes kwiMoveUpOut { from {transform:translateY(0);opacity:1;} to {transform:translateY(-12%);opacity:0;} }
@keyframes kwiMoveUpIn { from {transform:translateY(12%);opacity:0;} to {transform:translateY(0);opacity:1;} }
@keyframes kwiZoomOut { from {transform:scale(1);opacity:1;} to {transform:scale(1.06);opacity:0;} }
@keyframes kwiZoomIn { from {transform:scale(.96);opacity:0;} to {transform:scale(1);opacity:1;} }
@keyframes kwiBlurOut { from {filter:blur(0);opacity:1;} to {filter:blur(8px);opacity:0;} }
@keyframes kwiBlurIn { from {filter:blur(8px);opacity:0;} to {filter:blur(0);opacity:1;} }
.kwi-splash-sequence {
    width: min(var(--kwi-logo-width,70vw), var(--kwi-logo-max,1000px));
    max-width: 100%; aspect-ratio: 16/9;
}
.kwi-splash-sequence > .kwi-player-img { max-height: none; object-fit: var(--kwi-logo-fit,contain); }
@media (max-width:600px) { .kwi-splash-sequence { width: min(92vw, var(--kwi-logo-max,1000px)); } }
@media (prefers-reduced-motion: reduce) { .kwi-player > .kwi-player-img {animation:none !important;} }