.menu{--component-active-color-default: oklch(.68 .22 295);display:flex;align-items:center;justify-content:center;gap:.25rem;padding:.5rem;background-color:color-mix(in oklab,var(--background) 70%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border);border-radius:9999px;box-shadow:0 10px 40px -10px #0009}.menu__item{--lineWidth: 0px;position:relative;display:flex;align-items:center;gap:.5rem;padding:.625rem .875rem;background:transparent;border:none;border-radius:9999px;color:var(--muted-foreground);cursor:pointer;transition:color .3s ease,background-color .3s ease;font:inherit}.menu__item:hover{color:var(--foreground)}.menu__item.active{color:var(--component-active-color, var(--component-active-color-default));background-color:color-mix(in oklab,var(--component-active-color, var(--component-active-color-default)) 12%,transparent)}.menu__item.active:after{content:"";position:absolute;bottom:2px;left:50%;transform:translate(-50%);width:var(--lineWidth);height:2px;background-color:var( --component-active-color, var(--component-active-color-default) );border-radius:2px;transition:width .3s ease}.menu__icon{display:inline-flex;align-items:center;justify-content:center}.menu__icon .icon{width:1.125rem;height:1.125rem}.menu__text{font-size:.8125rem;font-weight:600;text-transform:capitalize;max-width:0;overflow:hidden;white-space:nowrap;opacity:0;transition:max-width .35s ease,opacity .25s ease}.menu__text.active{max-width:160px;opacity:1}