/* Liquid Glass navigation */
.sidebar{
 isolation:isolate;
 overflow:hidden;
 background:
  radial-gradient(circle at 12% 8%,rgba(200,241,53,.13),transparent 22%),
  radial-gradient(circle at 92% 48%,rgba(114,137,255,.07),transparent 32%),
  linear-gradient(165deg,rgba(22,25,19,.92),rgba(8,10,8,.96));
 border-right:1px solid rgba(255,255,255,.08);
 box-shadow:inset -1px 0 rgba(255,255,255,.035),18px 0 60px rgba(10,12,8,.08);
 backdrop-filter:blur(30px) saturate(145%);
 -webkit-backdrop-filter:blur(30px) saturate(145%);
}
.sidebar:before{
 content:'';
 position:absolute;
 z-index:-1;
 width:210px;
 height:210px;
 left:-95px;
 top:26%;
 border-radius:50%;
 background:rgba(200,241,53,.075);
 filter:blur(55px);
 animation:liquidAmbientFloat 8s ease-in-out infinite alternate;
 pointer-events:none;
}
.sidebar .brand{position:relative;z-index:2}
.sidebar .brand-mark{
 position:relative;
 overflow:hidden;
 border:1px solid rgba(255,255,255,.3);
 background:linear-gradient(145deg,rgba(222,255,105,.98),rgba(174,220,20,.9));
 box-shadow:inset 0 1px 1px rgba(255,255,255,.72),0 10px 28px rgba(200,241,53,.18);
}
.sidebar .brand-mark:after{
 content:'';
 position:absolute;
 inset:1px 3px auto;
 height:42%;
 border-radius:8px 8px 50% 50%;
 background:linear-gradient(180deg,rgba(255,255,255,.62),rgba(255,255,255,0));
 pointer-events:none;
}
.sidebar nav{
 position:relative;
 isolation:isolate;
 gap:4px;
 padding:6px;
 border:1px solid rgba(255,255,255,.075);
 border-radius:18px;
 background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
 box-shadow:inset 0 1px rgba(255,255,255,.075),inset 0 -1px rgba(0,0,0,.2),0 14px 36px rgba(0,0,0,.12);
 backdrop-filter:blur(22px) saturate(150%);
 -webkit-backdrop-filter:blur(22px) saturate(150%);
}
.sidebar .nav-item{
 position:relative;
 z-index:2;
 overflow:hidden;
 width:100%;
 min-height:46px;
 padding:12px 13px;
 border:0;
 border-radius:13px;
 background:transparent!important;
 box-shadow:none!important;
 color:rgba(229,234,222,.67);
 transform:none!important;
 transition:color .32s cubic-bezier(.22,1,.36,1),letter-spacing .32s cubic-bezier(.22,1,.36,1)!important;
}
.sidebar .nav-item:after{
 content:'';
 position:absolute;
 inset:0;
 border-radius:inherit;
 background:linear-gradient(105deg,transparent 18%,rgba(255,255,255,.1) 45%,transparent 72%);
 opacity:0;
 transform:translateX(-75%);
 transition:opacity .28s ease,transform .55s cubic-bezier(.22,1,.36,1);
 pointer-events:none;
}
.sidebar .nav-item:hover,
.sidebar .nav-item:focus-visible,
.sidebar .nav-item.active{
 color:#fff;
 letter-spacing:.08px;
}
.sidebar .nav-item:hover:after,
.sidebar .nav-item:focus-visible:after{
 opacity:1;
 transform:translateX(75%);
}
.sidebar .nav-item span,
.sidebar .nav-item em{position:relative;z-index:2}
.sidebar .nav-item .la-icon{
 transition:color .3s ease,filter .3s ease,transform .4s cubic-bezier(.22,1,.36,1)!important;
}
.sidebar .nav-item:hover .la-icon,
.sidebar .nav-item:focus-visible .la-icon,
.sidebar .nav-item.active .la-icon{
 color:var(--v2-lime);
 filter:drop-shadow(0 0 8px rgba(200,241,53,.38));
 transform:scale(1.1) translateX(1px)!important;
}
.sidebar .nav-item em{
 border:1px solid rgba(255,255,255,.075);
 background:rgba(255,255,255,.08);
 box-shadow:inset 0 1px rgba(255,255,255,.08);
 color:rgba(239,244,232,.8);
}
.liquid-nav-indicator{
 position:absolute;
 z-index:1;
 left:0;
 top:0;
 display:block;
 border:1px solid rgba(255,255,255,.14);
 border-radius:13px;
 opacity:0;
 background:
  radial-gradient(circle at 16% 20%,rgba(220,255,101,.25),transparent 32%),
  linear-gradient(115deg,rgba(255,255,255,.12),rgba(200,241,53,.085) 52%,rgba(255,255,255,.055));
 box-shadow:
  inset 0 1px 1px rgba(255,255,255,.2),
  inset 0 -1px rgba(0,0,0,.15),
  0 8px 22px rgba(0,0,0,.16),
  0 0 24px rgba(200,241,53,.055);
 backdrop-filter:blur(15px) saturate(175%);
 -webkit-backdrop-filter:blur(15px) saturate(175%);
 pointer-events:none;
 will-change:transform,width,height;
 transition:transform .48s cubic-bezier(.2,.9,.2,1.12),width .42s cubic-bezier(.2,.9,.2,1.08),height .42s cubic-bezier(.2,.9,.2,1.08),opacity .2s ease,background .28s ease!important;
}
.liquid-nav-indicator:before{
 content:'';
 position:absolute;
 left:9%;
 right:9%;
 top:1px;
 height:45%;
 border-radius:12px 12px 55% 55%;
 background:linear-gradient(180deg,rgba(255,255,255,.19),transparent);
}
.liquid-nav-indicator.visible{opacity:1}
.liquid-preview .liquid-nav-indicator{
 background:
  radial-gradient(circle at 18% 18%,rgba(255,255,255,.2),transparent 34%),
  linear-gradient(115deg,rgba(255,255,255,.1),rgba(200,241,53,.055),rgba(255,255,255,.045));
}
.sidebar .help-card{
 border-color:rgba(255,255,255,.08);
 background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
 box-shadow:inset 0 1px rgba(255,255,255,.06),0 12px 30px rgba(0,0,0,.1);
 backdrop-filter:blur(18px);
 -webkit-backdrop-filter:blur(18px);
}
.sidebar .profile{border-color:rgba(255,255,255,.08)}

@keyframes liquidAmbientFloat{
 from{transform:translate3d(-8px,-12px,0) scale(.94)}
 to{transform:translate3d(28px,18px,0) scale(1.08)}
}

@media(max-width:760px){
 .sidebar{
  overflow-x:hidden;
  overflow-y:auto;
  background:
   radial-gradient(circle at 18% 8%,rgba(200,241,53,.15),transparent 24%),
   linear-gradient(155deg,rgba(19,22,17,.92),rgba(7,9,7,.96));
  backdrop-filter:blur(32px) saturate(155%);
  -webkit-backdrop-filter:blur(32px) saturate(155%);
 }
 .sidebar nav{flex:none}
 .mobile-bottom-nav{
  isolation:isolate;
  overflow:hidden;
  background:linear-gradient(145deg,rgba(25,28,22,.76),rgba(9,11,9,.82))!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:22px!important;
  box-shadow:inset 0 1px rgba(255,255,255,.14),0 20px 55px rgba(0,0,0,.32)!important;
  backdrop-filter:blur(26px) saturate(180%)!important;
  -webkit-backdrop-filter:blur(26px) saturate(180%)!important;
 }
 .mobile-bottom-nav:before{
  content:'';
  position:absolute;
  inset:0;
  z-index:0;
  border-radius:inherit;
  background:linear-gradient(112deg,rgba(255,255,255,.09),transparent 34%,rgba(200,241,53,.035) 68%,rgba(255,255,255,.04));
  pointer-events:none;
 }
 .mobile-bottom-nav .liquid-nav-indicator{
  z-index:1;
  border-radius:15px;
  background:
   radial-gradient(circle at 25% 18%,rgba(224,255,116,.23),transparent 38%),
   linear-gradient(145deg,rgba(255,255,255,.12),rgba(200,241,53,.075));
  box-shadow:inset 0 1px rgba(255,255,255,.2),0 7px 18px rgba(0,0,0,.2);
  transition:transform .46s cubic-bezier(.2,.9,.2,1.12),width .4s cubic-bezier(.2,.9,.2,1.08),height .4s cubic-bezier(.2,.9,.2,1.08),opacity .18s ease!important;
 }
 .mobile-nav-item,
 .mobile-nav-add{position:relative;z-index:2}
 .mobile-nav-item{
  background:transparent!important;
  color:rgba(226,232,218,.61);
  transition:color .3s ease,transform .36s cubic-bezier(.22,1,.36,1)!important;
 }
 .mobile-nav-item.active{
  color:var(--v2-lime);
  transform:translateY(-1px);
 }
 .mobile-nav-item .la-icon{
  transition:transform .38s cubic-bezier(.22,1,.36,1),filter .3s ease!important;
 }
 .mobile-nav-item.active .la-icon{
  transform:translateY(-1px) scale(1.08);
  filter:drop-shadow(0 0 7px rgba(200,241,53,.35));
 }
 .mobile-nav-add{
  border:1px solid rgba(255,255,255,.38);
  background:linear-gradient(145deg,#d7ff52,#a9d51a)!important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.75),0 10px 25px rgba(200,241,53,.24)!important;
 }
}