.ecg-loader {
    --ecg-loader-size: 64px;
    --ecg-loader-cycle-duration: 3.66s;
    --ecg-loader-pulse-color: #fff;
    --ecg-loader-blue: #129be8;
    --ecg-loader-cyan: #21b8c9;
    --ecg-loader-green: #72d930;

    display: inline-block;
    height: var(--ecg-loader-size);
    line-height: 0;
    overflow: visible;
    width: var(--ecg-loader-size);
}

.ecg-loader__svg {
    display: block;
    height: 100%;
    overflow: visible;
    width: 100%;
}

.ecg-loader__trace,
.ecg-loader__pulse,
.ecg-loader__pulse-core {
    fill: none;
}

.ecg-loader__trace {
    opacity: .96;
}

.ecg-loader__pulse,
.ecg-loader__pulse-core {
    animation-duration: var(--ecg-loader-cycle-duration);
    animation-iteration-count: infinite;
    animation-name: ecg-loader-pulse;
    animation-timing-function: linear;
    stroke-dasharray: .95 100;
    stroke-dashoffset: 0;
}

.ecg-loader__pulse {
    --ecg-loader-pulse-opacity: .98;
}

.ecg-loader__pulse-core {
    --ecg-loader-pulse-opacity: .86;
    stroke: var(--ecg-loader-pulse-color);
}

.login-panel {
    isolation: isolate;
    position: relative;
}

.login-panel > .h4 {
    padding-right: 6rem;
}

.login-ecg-loader-corner {
    align-items: center;
    display: flex;
    justify-content: center;
    pointer-events: none;
    position: absolute;
    right: .25rem;
    top: -1.15rem;
    z-index: 2;
}

@keyframes ecg-loader-pulse {
    0% {
        opacity: 0;
        stroke-dashoffset: 0;
    }

    1.6667% {
        opacity: var(--ecg-loader-pulse-opacity);
    }

    59.0164% {
        opacity: var(--ecg-loader-pulse-opacity);
        stroke-dashoffset: -100;
    }

    59.0264% {
        opacity: 0;
        stroke-dashoffset: -100;
    }

    100% {
        opacity: 0;
        stroke-dashoffset: -100;
    }
}

@media (prefers-reduced-motion: reduce) {
    .ecg-loader__pulse,
    .ecg-loader__pulse-core {
        animation: none;
        display: none;
    }
}
