/*
 * SCIDaR splash — the mark drawn rather than shown.
 *
 * Ported from the SAPv2 project so both products animate identically. Each of
 * the five brackets opens from its corner on a stagger, the finished mark holds
 * while the frame drifts, then lifts away. 5.1s round trip.
 *
 * Parts are revealed with clip-path rather than scaled, so the chamfered bars
 * keep their true shape while being drawn instead of stretching into place.
 * Where clip-path is unsupported they render unclipped, which is simply the
 * static mark.
 */

#solina-splash {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity .45s ease, visibility .45s ease;
}

#solina-splash[hidden],
#solina-splash.is-done {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

#solina-splash .mk-mark {
    height: 5.5rem;
    width: auto;
    overflow: visible;
    animation: mk-exit 5.1s linear infinite both;
}

#solina-splash .mk-drift {
    animation: mk-drift 5.1s linear infinite both;
}


#solina-splash .mk {
    animation-duration: 5.1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-fill-mode: both;
}

@keyframes mk-a0 {
    0%,
    2.9412% {
        clip-path: inset(100% 0 0 0);
        animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    18.6275%,
    100% {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes mk-a1 {
    0%,
    2.9412% {
        clip-path: inset(0 100% 0 0);
        animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    7.4361%,
    100% {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes mk-a2 {
    0%,
    7.4361% {
        clip-path: inset(100% 0 0 0);
        animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    18.6275%,
    100% {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes mk-c0 {
    0%,
    9.2157% {
        clip-path: inset(0 0 100% 0);
        animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    24.902%,
    100% {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes mk-c1 {
    0%,
    9.2157% {
        clip-path: inset(0 100% 0 0);
        animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    24.902%,
    100% {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes mk-b0 {
    0%,
    15.4902% {
        clip-path: inset(100% 0 0 0);
        animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    31.1765%,
    100% {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes mk-b1 {
    0%,
    15.4902% {
        clip-path: inset(0 0 0 100%);
        animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    31.1765%,
    100% {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes mk-d0 {
    0%,
    21.7647% {
        clip-path: inset(100% 0 0 0);
        animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    37.451%,
    100% {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes mk-d1 {
    0%,
    21.7647% {
        clip-path: inset(0 0 0 100%);
        animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    37.451%,
    100% {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes mk-e0 {
    0%,
    28.0392% {
        clip-path: inset(100% 0 0 0);
        animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    43.7255%,
    100% {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes mk-e1 {
    0%,
    28.0392% {
        clip-path: inset(0 0 0 100%);
        animation-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
    }
    43.7255%,
    100% {
        clip-path: inset(0 0 0 0);
    }
}

@keyframes mk-drift {
    0% {
        transform: translateY(0.94%) scale(1);
        animation-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);
    }
    100% {
        transform: translateY(-0.94%) scale(1.035);
    }
}

@keyframes mk-exit {
    0%,
    86.2745% {
        opacity: 1;
        transform: translateY(0) scale(1);
        animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);
    }
    99.6078%,
    100% {
        opacity: 0;
        transform: translateY(-7.2%) scale(1.05);
    }
}

@media (prefers-reduced-motion: reduce) {
    .mk,
    .mk-mark,
    .mk-drift {
        animation: none;
        clip-path: none;
        opacity: 1;
        transform: none;
    }
}
