:root {
    --color-light-neutral-translucent-1300: rgba(3, 3, 6, 0.88);
    --color-light-neutral-translucent-300: rgba(15, 25, 55, 0.1);
    --color-light-status-negative: #ff4837;
    --color-light-status-positive: #0cc44d;
}
:root {
    --border-radius-circle: 50%;
}
:root {
    --gap-0: 0px;
    --gap-6: 6px;
}
:root {
    --pass-code-dot-width: 12px;
    --pass-code-dot-height: 12px;
    --pass-code-dot-container-width: 14px;
    --pass-code-dot-container-height: 14px;
    --pass-code-progress-container-min-height: 14px;
}
@keyframes pass-code__dotFilled_13wjz {
    50% {
        width: var(--pass-code-dot-container-width);
        height: var(--pass-code-dot-container-height);
        animation-timing-function: ease-out;
    }
}
@keyframes pass-code__dotSuccessFilled_13wjz {
    50% {
        width: var(--pass-code-dot-container-width);
        height: var(--pass-code-dot-container-height);
        animation-timing-function: ease-out;
    }
}
.pass-code__component_13wjz {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: var(--pass-code-progress-container-min-height);
}
.pass-code__dotWrapper_13wjz {
    width: var(--pass-code-dot-container-width);
    height: var(--pass-code-dot-container-height);
    display: flex;
    justify-content: center;
    align-items: center;
    margin: var(--gap-0) 5px;
}
.pass-code__dotWrapper_13wjz .pass-code__dot_13wjz {
        margin: 0;
        margin: initial;
    }
.pass-code__dot_13wjz {
    margin: var(--gap-0) var(--gap-6);
    width: var(--pass-code-dot-width);
    height: var(--pass-code-dot-height);
    background: var(--color-light-neutral-translucent-300);
    border-radius: var(--border-radius-circle);
    flex-shrink: 0;
}
.pass-code__dot_13wjz.pass-code__filled_13wjz {
        background: var(--color-light-neutral-translucent-1300);
    }
.pass-code__dot_13wjz.pass-code__animatedFill_13wjz {
        background: var(--color-light-neutral-translucent-1300);
        animation: pass-code__dotFilled_13wjz 200ms ease-in forwards;
    }
.pass-code__dot_13wjz.pass-code__error_13wjz {
        background: var(--color-light-status-negative);
    }
.pass-code__dot_13wjz.pass-code__success_13wjz {
        background: var(--color-light-status-positive);
        animation: pass-code__dotSuccessFilled_13wjz 200ms ease-in forwards;
    }
.pass-code__dot_13wjz.pass-code__rawSuccess_13wjz {
        background: var(--color-light-status-positive);
    }