/* Render the supplied logo unchanged, with its surrounding whitespace clipped. */
.brand-logo {
  display: block;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  overflow: hidden;
  border-radius: 10px;
  background: #fff;
}

.brand .brand-logo {
  width: 44px;
  height: 44px;
  border: 0;
}

.brand-logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: scale(1.8);
}

.mobile-brand-logo { display: none; }

@media (max-width: 900px) {
  .mobile-brand-logo {
    display: block;
    flex-basis: 32px;
    width: 32px;
    height: 32px;
    border-radius: 8px;
  }

  .app > main > header > div:first-child { min-width: 0; }
  #freshness { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}