.app-row{ flex:1; display:flex; min-height:0; }
.app-nav{
  width:64px; height:100%; flex-shrink:0;
  display:flex; flex-direction:column; align-items:center; gap:4px;
  background:var(--md-color-grey-white);
	padding-bottom: 16px;
}
.app-nav-divider{ width:32px; height:1px; background:var(--ui-border); margin:2px 0 8px; flex-shrink:0; }
.app-nav-divider + .app-nav-divider{ display:none; }
.app-nav-divider + #appNavAfterNotif + .app-nav-divider{ display:none; }
.app-nav-avatar, .personal-info-avatar-wrap span, .avatar-color-option, .share-modal-member-avatar, .presence-avatar{ color:#fff; }
img[src^="/assets/avatar-emoji/"][src*="#"]{ background-color:#0040DE; object-fit:cover; }
img[src^="/assets/avatar-emoji/"][src$="#E08A2E" i]{ background-color:#E08A2E; }
img[src^="/assets/avatar-emoji/"][src$="#1B9E6B" i]{ background-color:#1B9E6B; }
img[src^="/assets/avatar-emoji/"][src$="#C4396A" i]{ background-color:#C4396A; }
img[src^="/assets/avatar-emoji/"][src$="#7B5CE0" i]{ background-color:#7B5CE0; }
img[src^="/assets/avatar-emoji/"][src$="#2E9AC4" i]{ background-color:#2E9AC4; }
img[src^="/assets/avatar-emoji/"][src$="#2F353E" i]{ background-color:#2F353E; }
.app-nav-item{
  display:flex; flex-direction:column; align-items:center; gap:4px; width:52px; box-sizing:border-box;
  padding:1px 6px 10px; background:none; border:none; cursor:pointer; text-decoration:none; line-height:normal;
  font-family:var(--font-sans); font-size:var(--text-2xs); font-weight:var(--font-weight-light); color:var(--ui-muted);
}
.app-nav-icon{ position:relative; width:36px; height:36px; border-radius:10px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.app-nav-icon i{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:var(--text-2xl); color:var(--ui-muted); }
.app-nav-icon i.fa-solid{ opacity:0; }
.app-nav-item:hover .app-nav-icon{ background:var(--md-neutral-background-2-rest); }
.app-nav-item.active .app-nav-icon{ background:var(--ui-accent); }
.app-nav-item.active .app-nav-icon i.fa-regular{ opacity:0; }
.app-nav-item.active .app-nav-icon i.fa-solid{ opacity:1; color:var(--md-color-grey-white); }
.app-nav-item.active{ color:var(--ui-accent); }

.app-nav.saving .app-nav-item{ pointer-events:none; }
.app-nav-item.saving .app-nav-icon{ background:var(--ui-accent); }
.app-nav-item.saving .app-nav-icon i{ opacity:0; }
.app-nav-item.saving .app-nav-icon::after{
  content:''; position:absolute; inset:9px; border-radius:50%;
  border:2px solid rgba(255,255,255,0.4); border-top-color:var(--md-color-grey-white);
  animation:app-nav-spin .6s linear infinite;
}
@keyframes app-nav-spin{ to{ transform:rotate(360deg); } }

.app-nav-avatar-wrap{ position:relative; margin-top:auto; }
.app-nav-avatar{
  width:36px; height:36px; border-radius:50%; border:none; cursor:pointer;
  background:var(--ui-accent); color:#fff; font-family:var(--font-display);
  font-size:var(--text-lg); font-weight:400; display:flex; align-items:center; justify-content:center;
  overflow:hidden; padding:0;
}
.app-nav-avatar img{ width:100%; height:100%; border-radius:50%; object-fit:cover; display:block; }
.app-nav-avatar-wrap .split-menu.rail-avatar-menu{
  top:auto; right:auto; bottom:0; left:calc(100% + 8px); min-width:160px;
}


body.no-perm-create [data-perm="create"],
body.no-perm-comment [data-perm="comment"],
body.no-perm-delete [data-perm="delete"],
body.no-perm-export [data-perm="export"],
body.no-perm-ai [data-perm="ai"],
body.no-perm-publish [data-perm="publish"],
body.no-perm-sharePublic [data-perm="sharePublic"],
body.no-perm-moderate [data-perm="moderate"],
body.no-perm-inviteUsers [data-perm="inviteUsers"],
body.no-perm-manageTeams [data-perm="manageTeams"],
body.no-perm-manageCategories [data-perm="manageCategories"],
body.no-perm-animations [data-perm="animations"]{ display:none !important; }
body.not-deck-owner [data-owner-only]{ display:none !important; }

.app-nav-icon{ position:relative; }
.app-nav-warn-dot{
  position:absolute; top:-2px; right:-4px; width:8px; height:8px; border-radius:50%;
  background:var(--yellow-500); box-shadow:0 0 0 2px var(--md-color-grey-white);
}