@keyframes bounceIn{0%{transform:scale(1)}20%{transform:scale(1.6)}40%{transform:scale(1.2)}60%{transform:scale(1.5)}80%{transform:scale(1.55)}to{transform:scale(1.457)}}@keyframes bounceOut{0%{transform:scale(1.457)}30%{transform:scale(1)}60%{transform:scale(1.2)}90%{transform:scale(1.05)}to{transform:scale(1)}}.navbarBtn,.navbar__btn,.navbar__btn-active,.navbar__heart{border-radius:var(--radius-10);width:var(--navbar-width);height:var(--navbar-height);display:flex;justify-content:center;align-items:center;position:relative;z-index:0;cursor:pointer}.navbarBtn [class^=fa-],.navbar__btn [class^=fa-],.navbar__btn-active [class^=fa-],.navbar__heart [class^=fa-]{font-size:calc(var(--text-25) + 1px);transition:all .2s ease-in}.navbarBtn svg,.navbar__btn svg,.navbar__btn-active svg,.navbar__heart svg{width:auto!important;height:calc(var(--text-25) + 1px);transition:all .2s ease-in}.navbarBtn svg path,.navbar__btn svg path,.navbar__btn-active svg path,.navbar__heart svg path{fill:var(--color-gray-300)}.navbarBtn-hover [class^=fa-],.navbar__btn-active:hover [class^=fa-],.navbar__btn:hover [class^=fa-]{color:var(--color-white)}.navbarBtn-hover svg path,.navbar__btn-active:hover svg path,.navbar__btn:hover svg path{fill:var(--color-white)}.navbarBtn-hover .navbar__title,.navbar__btn-active:hover .navbar__title,.navbar__btn:hover .navbar__title{padding-left:var(--navbar-width);opacity:1;width:auto}.navbar__heart img{transition:transform .3s ease}.navbar__heart:hover img{animation:bounceIn .5s ease-out forwards;transform:scale(1.45)}.navbar__heart:not(:hover) img{animation:bounceOut .4s ease-out forwards;transform:scale(1)}.navbar__btn{color:var(--color-gray-300)}.navbar__btn-active{color:var(--color-white)}.navbar__btn-active:before{content:"";display:block;width:100%;height:100%;position:absolute;left:0;top:0;background:linear-gradient(var(--color-gray-600),var(--color-gray-600)) padding-box,var(--color-brand-gradient) border-box;border:var(--size-2) solid rgba(0,0,0,0);border-radius:var(--radius-10);transition:all .15s ease-in;z-index:-1}.navbar__btn-active:hover:before{opacity:0}.navbar__btn-active svg path{fill:var(--color-white)}.navbar__title{border-radius:var(--radius-10);color:var(--color-white);font-size:var(--text-sm);font-weight:700;display:inline-flex;align-items:center;background:var(--color-brand-gradient);height:100%;width:var(--navbar-width);opacity:0;padding-inline:calc(var(--navbar-width)/2) var(--size-24);overflow:hidden;position:absolute;left:0;top:0;z-index:-1;transition:all .15s ease-in}