@keyframes ripple{to{opacity:0;transform:translate(-50%,-50%)scale(10)}}.nav{justify-content:center;align-items:center;padding:.25rem;display:flex;position:relative}.nav .nav__lists{justify-content:space-between;align-items:center;gap:clamp(.25rem,1vw,.5rem);height:100%;display:flex}.nav .nav__lists .nav__item{justify-content:center;align-items:center;display:flex}.nav .nav__lists .nav__item .nav__link{color:var(--gray-600);border-radius:2rem;justify-content:center;align-items:center;padding:clamp(.25rem,1vw,.5rem) clamp(.5rem,1vw,.75rem);transition:all .3s ease-in-out;display:flex;overflow:hidden}@media (max-width:778px){.nav .nav__lists .nav__item .nav__link{flex-direction:column;align-items:center;width:70px;display:flex}}.nav .nav__lists .nav__item .nav__link .nav__icon--wrapper{width:fit-content;height:20px;display:none}.nav .nav__lists .nav__item .nav__link .nav__icon--wrapper svg{color:inherit;font-size:1rem}@media (max-width:778px){.nav .nav__lists .nav__item .nav__link .nav__icon--wrapper{display:block}}.nav .nav__lists .nav__item .nav__link .nav__label{color:inherit;padding:.25rem .5rem;font-size:1rem;font-weight:500}@media (max-width:778px){.nav .nav__lists .nav__item .nav__link .nav__label{padding:0;font-size:.875rem}}@media (hover:hover){.nav .nav__lists .nav__item .nav__link:not(.active):hover{color:var(--gray-700);background-color:color-mix(in srgb,var(--gray-200)30%,transparent)}}.nav .nav__lists .nav__item .nav__link:active:not(.active),.nav .nav__lists .nav__item .nav__link:focus-visible:not(.active){color:var(--gray-900);background-color:color-mix(in srgb,var(--gray-300)40%,transparent)}.nav .nav__lists .nav__item .nav__link.active{color:var(--gray-900);background-color:color-mix(in srgb,var(--gray-300)40%,transparent);transition:all .2s ease-in-out}.nav .nav__lists .nav__item .nav__link.active:active{transform:scale(.95)}.nav .nav__lists .nav__item .nav__link.active .nav__label{font-weight:700}@media (max-width:778px){.nav .nav__lists .nav__item .nav__link.active{color:var(--gray-900);background-color:color-mix(in srgb,var(--gray-400)40%,transparent)}}.nav .nav__lists .nav__item .nav__link.active .nav__icon--wrapper svg{fill:var(--gray-900);stroke:var(--gray-300);scale:1.4}@media (max-width:778px){.nav .nav__lists .nav__item:nth-child(3) .nav__link .nav__label{letter-spacing:-.5px}.nav .nav__lists .nav__item:nth-child(2) .nav__link.active .nav__icon--wrapper svg{fill:var(--gray-900);stroke:var(--gray-900);stroke-width:1px}}