/* Compact personal avatar; loaded after site.css. */
.site-side .brand-symbol {
  display: block;
  flex: 0 0 48px;
  width: 48px;
  height: 56px;
  min-width: 48px;
  padding: 0;
  margin: 0;
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid rgba(164, 226, 211, 0.55);
  background: #16303b url("../images/profile-nav.jpg") center / cover no-repeat;
  box-shadow: 0 2px 9px rgba(0,0,0,.14);
  font-size: 0;
  line-height: 0;
  color: transparent;
  text-decoration: none;
}
.site-side .brand-symbol > span,
.site-side .brand-symbol::before,
.site-side .brand-symbol::after { display: none; }
.site-side .brand-symbol img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  border-radius: inherit;
}
.site-side .brand-symbol:focus-visible,
.mobile-header .mobile-brand:focus-visible {
  outline: 3px solid #a4e2d3;
  outline-offset: 3px;
}
/* Small-screen avatar; old pages with AS text also receive the photo via CSS. */
.mobile-header .mobile-brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 0;
  line-height: 1;
  text-decoration: none;
}
.mobile-header .mobile-brand > span { display: none; }
.mobile-header .mobile-brand > img,
.mobile-header .mobile-brand::before {
  width: 30px;
  height: 36px;
  flex: 0 0 30px;
  border-radius: 7px;
  border: 1px solid rgba(164, 226, 211, 0.55);
  object-fit: cover;
  object-position: center;
}
.mobile-header .mobile-brand > img { display: block; }
/* Fallback for unmodified pages whose mobile brand still contains 'AS'. */
.mobile-header .mobile-brand:not(:has(> img))::before {
  content: "";
  display: block;
  background: #16303b url("../images/profile-nav.jpg") center / cover no-repeat;
}
.mobile-header .mobile-brand > small {
  font-size: 0.72rem;
  line-height: 1.15;
}