/* ============================================================
   SYMMETRA brand badge — transparent PNG of the orb + wordmark.
   Background was pre-stripped, so the image drops onto any
   sidebar surface (light or dark) with zero edge artifacts.
   ============================================================ */

html body .sidebar .brand.brand-image-only {
  display: block !important;
  padding: 0 !important;
  margin: -2px 0 10px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-align: center !important;
}

html body .sidebar .brand-image-only .brand-logo-combined {
  display: block !important;
  width: 92% !important;
  max-width: 180px !important;
  height: auto !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  object-fit: contain !important;
  filter: none !important;
  /* CRITICAL: override the office-shell rule that pins .brand-logo to
     image-rendering: -webkit-optimize-contrast. That setting forces
     nearest-neighbor scaling, which destroys photographic gradients and
     makes the orb look pixelated/blurry. "auto" = browser-default bicubic
     resampling, which is correct for this kind of rendered 3D mark. */
  image-rendering: auto !important;
  -ms-interpolation-mode: bicubic !important;
}

/* Hide any stale brand text emitted by other renderer paths */
html body .sidebar .brand.brand-image-only .brand-copy,
html body .sidebar .brand.brand-image-only .brand-name,
html body .sidebar .brand.brand-image-only .brand-sub,
html body .sidebar .brand.brand-image-only .brand-byline {
  display: none !important;
}