@layer components {
    .sign-in-gate {
        display: flex;
        flex-direction: column;
        gap: var(--space-3);
    }

    .sign-in-gate__status {
        margin: 0;
        color: var(--color-neutral-700);
        font-size: var(--text-s);

        &:empty {
            display: none;
        }
    }

    .sign-in-gate[aria-busy='true'] .sign-in-gate__status {
        color: var(--color-text);
    }
}