.mb-login-btn{cursor:pointer;border:none;border-radius:50%;flex-shrink:0;justify-content:flex-start;align-items:center;width:44px;height:44px;transition:width .3s,border-radius .3s,background-color .3s;display:flex;position:relative;overflow:hidden;box-shadow:0 2px 8px #0000002e}.mb-login-btn--in{background-color:rgb(var(--status-success))}.mb-login-btn--out{background-color:rgb(var(--brand-accent))}.mb-login-sign{color:#fff;justify-content:center;align-items:center;width:100%;transition:width .3s,padding-left .3s;display:flex}.mb-login-text{opacity:0;color:#fff;white-space:nowrap;width:0%;font-size:.8em;font-weight:600;transition:opacity .3s,width .3s,padding-right .3s;position:absolute;right:0}.mb-login-btn:hover,.mb-login-btn:focus-visible{border-radius:22px;width:118px}.mb-login-btn:hover .mb-login-sign,.mb-login-btn:focus-visible .mb-login-sign{width:30%;padding-left:16px}.mb-login-btn:hover .mb-login-text,.mb-login-btn:focus-visible .mb-login-text{opacity:1;width:70%;padding-right:10px}.mb-login-btn:focus-visible{outline:2px solid rgb(var(--stone-950));outline-offset:2px}.mb-login-btn:active{transform:translate(1px,1px)}