/* The original emoji remains in textContent and in the accessibility tree.
   Only a successfully loaded local image makes the glyph transparent. */
span.sagace-emoji-3d {
  display: inline-block !important;
  position: relative !important;
  inset: auto !important;
  box-sizing: content-box !important;
  width: var(--sagace-emoji-size, 1.3em) !important;
  height: var(--sagace-emoji-size, 1.3em) !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  float: none !important;
  flex: none !important;
  vertical-align: -.24em !important;
  font-size: inherit !important;
  font-style: normal !important;
  font-weight: inherit !important;
  line-height: 1.3 !important;
  letter-spacing: normal !important;
  color: initial !important;
  -webkit-text-fill-color: currentColor !important;
  text-align: center !important;
  text-indent: 0 !important;
  text-shadow: none !important;
  white-space: nowrap !important;
  /* A custom property lets loaded artwork coexist with strict resets and
     allows print/high contrast styles to remove it without inline priority. */
  background-image: var(--sagace-emoji-image, none) !important;
  background-color: transparent !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
  background-origin: padding-box !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
  animation: none !important;
  transition: none !important;
  pointer-events: none !important;
}

span.sagace-emoji-3d::before,
span.sagace-emoji-3d::after {
  content: none !important;
  display: none !important;
}

span.sagace-emoji-3d.is-ready {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
}

img.sagace-emoji-3d-image {
  object-fit: contain !important;
  object-position: center !important;
}

/* Authored icon-only slots: fill the existing tile with readable artwork.
   A 22–26px glyph becomes a 50px image; the tile itself remains about 52px.
   Inline text, nav buttons, language flags and generated messages stay small. */
.sagace-icon-slot {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  min-height: 52px !important;
  padding: 0 !important;
  flex: 0 0 52px !important;
  overflow: visible !important;
}
.sagace-icon-slot > span.sagace-emoji-3d,
.sagace-icon-slot > img.sagace-emoji-3d-image {
  width: 50px !important;
  height: 50px !important;
  max-width: none !important;
  max-height: none !important;
  vertical-align: middle !important;
}

/* Keep each SVG node, original vector children and accessible naming intact.
   Only successfully loaded artwork hides the original illustration. */
svg.sagace-vector-3d {
  display: inline-block !important;
  width: 28px !important;
  height: 28px !important;
  min-width: 0 !important;
  flex-shrink: 0 !important;
  overflow: visible !important;
  vertical-align: middle !important;
}
svg.sagace-vector-3d > image.sagace-vector-art {
  display: block !important;
  opacity: 1 !important;
  filter: none !important;
  pointer-events: none !important;
}
svg.sagace-vector-3d.is-ready > :not(image):not(title):not(desc) {
  visibility: hidden !important;
}
svg.sagace-vector-3d.sagace-vector-control {
  width: 19px !important;
  height: 19px !important;
}
#sagace-presentation .sgp-discovery > summary > svg.sagace-vector-control {
  width: 15px !important;
  height: 15px !important;
}
/* Reserve known illustration slots before JavaScript loads the artwork.
   These authored containers contain pictograms, never charts or brand logos. */
.sgp-chip > svg,
.sgp-tab > svg,
.sgp-mini-top > svg,
.sgp-super-row > svg,
.sgp-vr-value-title > svg,
.sgp-launch-journey-icon > svg,
.sgp-file > svg,
#sagace-discovery .sd-benefit-icon > svg,
#sagace-discovery .sd-limits-icon > svg,
#sagace-discovery .sd-result-symbol > svg,
#sagace-discovery .sd-related-icon > svg {
  flex-shrink: 0 !important;
  vertical-align: middle !important;
}
.sgp-chip > svg,
.sgp-chip > svg.sagace-vector-3d,
.sgp-tab > svg,
.sgp-tab > svg.sagace-vector-3d,
.sgp-mini-top > svg,
.sgp-mini-top > svg.sagace-vector-3d {
  width: 34px !important;
  height: 34px !important;
}
.sgp-super-row > svg,
.sgp-super-row > svg.sagace-vector-3d {
  width: 54px !important;
  height: 54px !important;
}
#sagace-presentation .sgp-super-row {
  grid-template-columns: 54px minmax(0, 1fr) !important;
}
.sgp-vr-value-title > svg,
.sgp-vr-value-title > svg.sagace-vector-3d {
  width: 44px !important;
  height: 44px !important;
}
.sgp-launch-journey-icon {
  overflow: visible !important;
}
#sagace-presentation .sgp-launch-journey-icon {
  width: 52px !important;
  height: 52px !important;
}
.sgp-launch-journey-icon > svg,
.sgp-launch-journey-icon > svg.sagace-vector-3d {
  width: 54px !important;
  height: 54px !important;
}
.sgp-file > svg,
.sgp-file > svg.sagace-vector-3d {
  width: 38px !important;
  height: 42px !important;
}
#sagace-discovery .sd-benefit-icon,
#sagace-discovery .sd-result-symbol,
#sagace-discovery .sd-related-icon,
#sagace-discovery .sd-limits-icon {
  overflow: visible !important;
}
#sagace-discovery .sd-benefit-icon > svg,
#sagace-discovery .sd-benefit-icon > svg.sagace-vector-3d,
#sagace-discovery .sd-limits-icon > svg,
#sagace-discovery .sd-limits-icon > svg.sagace-vector-3d {
  width: 40px !important;
  height: 40px !important;
}
#sagace-discovery .sd-result-symbol > svg,
#sagace-discovery .sd-result-symbol > svg.sagace-vector-3d {
  width: 44px !important;
  height: 44px !important;
}
#sagace-discovery .sd-related-icon > svg,
#sagace-discovery .sd-related-icon > svg.sagace-vector-3d {
  width: 46px !important;
  height: 46px !important;
}
@media (max-width: 1000px) {
  #sgp-examples .sgp-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 780px) {
  /* Keep the header's existing compact layout when its arrow is converted. */
  #sagace-presentation .sgp-login > svg.sagace-vector-3d {
    display: none !important;
  }
}
@media (max-width: 600px) {
  #sgp-examples .sgp-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #sagace-discovery .sd-result-symbol > svg,
  #sagace-discovery .sd-result-symbol > svg.sagace-vector-3d {
    width: 36px !important;
    height: 36px !important;
  }
  #sagace-discovery .sd-limits-icon > svg,
  #sagace-discovery .sd-limits-icon > svg.sagace-vector-3d {
    width: 30px !important;
    height: 30px !important;
  }
}
span.sagace-emoji-3d.sagace-emoji-arrow-ne.is-ready {
  transform: rotate(-45deg) !important;
}

/* Keep printable/high contrast pages readable without background images. */
@media print, (forced-colors: active) {
  span.sagace-emoji-3d.is-ready {
    color: inherit !important;
    -webkit-text-fill-color: currentColor !important;
    background-image: none !important;
  }
  span.sagace-emoji-3d.sagace-emoji-arrow-ne.is-ready {
    transform: none !important;
  }
  svg.sagace-vector-3d.is-ready > :not(image):not(title):not(desc) {
    visibility: visible !important;
  }
  svg.sagace-vector-3d > image.sagace-vector-art {
    display: none !important;
  }
}
