.nav .nav-icon{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;color:currentColor;transition:background .18s ease,color .18s ease,box-shadow .18s ease;flex:0 0 auto}
.nav .nav-icon svg{width:19px;height:19px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.nav .nav-label{display:block;line-height:1.1}
.nav.active .nav-icon{color:var(--accent);background:transparent;box-shadow:none}

.fab{font-size:0!important}
.fab::before{content:none}

.icon-button{width:44px;height:44px;min-width:44px;min-height:44px;display:grid;place-items:center;padding:0;line-height:0;flex:0 0 44px}
.icon-button--edit::before,.icon-button--add::before,.icon-button--more::before{content:"";width:20px;height:20px;display:block;background:currentColor}
.icon-button--edit::before{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 20h9M16.5 3.5a2.1 2.1 0 0 1 3 3L8 18l-4 1 1-4Z'/%3E%3C/svg%3E") center/20px 20px no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 20h9M16.5 3.5a2.1 2.1 0 0 1 3 3L8 18l-4 1 1-4Z'/%3E%3C/svg%3E") center/20px 20px no-repeat}
.icon-button--add::before{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-width='2' d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/20px 20px no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-width='2' d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center/20px 20px no-repeat}
.icon-button--more::before{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='5' cy='12' r='1.7' fill='black'/%3E%3Ccircle cx='12' cy='12' r='1.7' fill='black'/%3E%3Ccircle cx='19' cy='12' r='1.7' fill='black'/%3E%3C/svg%3E") center/20px 20px no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='5' cy='12' r='1.7' fill='black'/%3E%3Ccircle cx='12' cy='12' r='1.7' fill='black'/%3E%3Ccircle cx='19' cy='12' r='1.7' fill='black'/%3E%3C/svg%3E") center/20px 20px no-repeat}


/* Bottom navigation refinement */
.bottom .nav-icon{
  width:32px;height:30px;border-radius:10px;color:currentColor;
  transition:background .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease
}
.bottom .nav-icon svg{width:18px;height:18px;stroke-width:1.7}
.bottom .nav.active .nav-icon{
  color:#8DE1B7;
  background:transparent;
  box-shadow:none
}
.bottom .nav:active .nav-icon{transform:translateY(1px)}


/* Premium icon refinement */
.bottom .nav-icon{
  width:34px;height:32px;border-radius:11px;
  background:transparent;
  box-shadow:none;
}
.bottom .nav-icon svg{
  width:19px;height:19px;stroke-width:1.8;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.018));
}
.bottom .nav.active .nav-icon{
  color:#78DDAA;
  background:transparent;
  box-shadow:none
}
.bottom .nav:not(.active) .nav-icon{color:#72808A}
.bottom .nav:active .nav-icon{transform:scale(.96)}

.ui-icon-button svg{
  shape-rendering:geometricPrecision;
  vector-effect:non-scaling-stroke;
}
