.account-slot {
  position: relative;
  flex: 0 0 auto;
  max-width: 100px;
}

.account-chip {
  max-width: 100%;
  height: 34px;
  padding: 0 10px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
}

.account-chip span {
  display: block;
  max-width: 72px;
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-chip.admin {
  border-color: #c7ddf5;
  background: #eaf3ff;
  color: var(--blue-dark);
}

.account-chip.member {
  border-color: #cde8db;
  background: #edf7f2;
  color: var(--green);
}

.account-menu {
  width: 190px;
  padding: 12px;
  position: absolute;
  right: 0;
  top: 42px;
  z-index: 60;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(20, 38, 64, .2);
}

.account-menu strong {
  display: block;
  overflow-wrap: anywhere;
  font-size: 14px;
}

.account-menu small {
  display: block;
  margin: 5px 0 12px;
  color: var(--muted);
  font-size: 11px;
}

.account-menu button {
  width: 100%;
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--blue-dark);
  font-size: 12px;
  font-weight: 800;
}

.activity-photo-fallback {
  background-color: #0b315f;
  background-size: 76%;
  background-repeat: no-repeat;
}

.home-build {
  margin: 16px 0 0;
  color: #93a0b2;
  font-size: 10px;
  text-align: center;
}

.team-member-row .team-role {
  margin-left: auto;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

.team-member-row .team-role.admin {
  background: #eaf3ff;
  color: var(--blue-dark);
}

.team-member-row .team-role.member {
  background: #edf7f2;
  color: var(--green);
}

.bottom-nav.shared-member {
  grid-template-columns: repeat(5, 1fr);
}

.bottom-nav.shared-admin {
  grid-template-columns: repeat(5, 1fr);
}

.bottom-nav.shared-member [data-route="create"] {
  display: block;
}

.bottom-nav.shared-member [data-route="calendar"],
.bottom-nav.shared-admin [data-route="calendar"] {
  display: block;
}

.bottom-nav.shared-guest {
  display: none;
}

@media (max-width: 360px) {
  .app-header {
    padding-left: 9px;
    padding-right: 9px;
    gap: 8px;
  }

  .team-logo {
    width: 40px;
    height: 40px;
  }

  .app-header strong {
    font-size: 13px;
  }

  .account-slot {
    max-width: 82px;
  }

  .account-chip span {
    max-width: 54px;
  }
}