/* Wartip public channel branding fix v2.
   This is loaded AFTER the other public stylesheets with a new URL to avoid stale cached CSS. */
body > .container > header.top a.logo,
body > .container > header.top a.logo:hover,
body > .container > header.top a.logo:focus-visible {
  background: none !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  transform: none !important;
}
body > .container > header.top a.logo::before,
body > .container > header.top a.logo::after { content: none !important; }
body > .container > header.top a.logo img {
  display: block !important;
  width: 78px !important;
  height: auto !important;
  max-height: 58px !important;
  object-fit: contain !important;
  object-position: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
}
/* The profile picture is an <img class="avatar">, not an image nested inside .avatar. */
body > .container > .cover .channel .avatar,
body > .container > .cover .channel img.avatar,
body > .container > .cover .channel div.avatar {
  display: grid !important;
  place-items: center !important;
  width: 76px !important;
  height: 76px !important;
  flex: 0 0 76px !important;
  padding: 0 !important;
  border: none !important;
  outline: none !important;
  border-radius: 50% !important;
  background-color: #21162d !important;
  box-shadow: none !important;
  overflow: hidden !important;
  object-fit: cover !important;
  object-position: center !important;
  clip-path: circle(50% at 50% 50%);
}
body > .container > .cover .channel .avatar img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border: none !important;
  border-radius: 50% !important;
  object-fit: cover !important;
}
@media (max-width: 620px) {
  body > .container > header.top a.logo img {
    width: 68px !important;
    max-height: 50px !important;
  }
  body > .container > .cover .channel .avatar,
  body > .container > .cover .channel img.avatar,
  body > .container > .cover .channel div.avatar {
    width: 62px !important;
    height: 62px !important;
    flex-basis: 62px !important;
  }
}