@import url("https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@400;500;600;700&display=swap");
/* UZH BCC — larger logo, just under testnet (~10px gap, no overlap) */

a[aria-label="Link to main page"] {
  width: 88px !important;
  height: 88px !important;
  max-width: 88px !important;
}

a[aria-label="Link to main page"] img {
  width: 88px !important;
  height: 88px !important;
  max-width: 88px !important;
  max-height: 88px !important;
  object-fit: contain !important;
  object-position: left center !important;
}

/*
 * Desktop sidebar:
 * - testnet badge absolute at top:6 (~14px tall → ends ~20px)
 * - content padding-top 58px → logo starts ~10–12px below badge
 */
.group:has(> img[src*="labels/testnet"]) {
  padding-top: 34px !important;
}

.group > img[src*="labels/testnet"] {
  display: none !important;
}

/* Keep logo below badge in stacking, not under it */
.group > header {
  position: relative;
  z-index: 1;
}

.chakra-drawer__body > img[src*="labels/testnet"] {
  margin-bottom: 0 !important;
  display: none !important;
}

.chakra-drawer__body > a[aria-label="Link to main page"] {
  margin-top: 0 !important;
}


/* Compact desktop endpoint: undo the older broad 88px rule on the 92px sidebar. */
@media screen and (min-width: 1000px) and (max-width: 1439px) {
  .group.css-gu4dv3:has(> img[src*="labels/testnet"]) > header > a[aria-label="Link to main page"] { width: 30px !important; height: 30px !important; max-width: 30px !important; }
}
@media screen and (min-width: 1000px) {
  .group.css-55musk:has(> img[src*="labels/testnet"]) > header > a[aria-label="Link to main page"] { width: 30px !important; height: 30px !important; max-width: 30px !important; }
}


/* Desktop seal: keep the identical logo asset as one continuous visual object. */
@media screen and (min-width: 1000px) {
  .group:has(> img[src*="labels/testnet"]) > header { position: static !important; }
  .group:has(> img[src*="labels/testnet"]) > header > a[aria-label="Link to main page"] { overflow: visible !important; }
  .group:has(> img[src*="labels/testnet"]) > header > a[aria-label="Link to main page"] > img[src^="/assets/configs/network_logo"] {
    display: block !important;
    position: absolute !important;
    left: 31px !important;
    top: 10px !important;
    width: 88px !important;
    height: 88px !important;
    max-width: 88px !important;
    max-height: 88px !important;
    object-fit: contain !important;
    transform-origin: center center !important;
    transform: translate3d(-29px, -10px, 0) scale(.340909) !important;
    transition: transform 240ms cubic-bezier(.22, 1, .36, 1) !important;
    will-change: transform;
    pointer-events: none;
  }
  .group:has(> img[src*="labels/testnet"]) > header > a[aria-label="Link to main page"] > img[src^="/assets/configs/network_icon"] { display: none !important; }
  .group.css-3x98l5:has(> img[src*="labels/testnet"]) > header > a[aria-label="Link to main page"] > img[src^="/assets/configs/network_logo"] {
    transform: translate3d(5px, 0, 0) scale(1) !important;
  }
}
@media screen and (min-width: 1440px) {
  .group.css-gu4dv3:has(> img[src*="labels/testnet"]) > header > a[aria-label="Link to main page"] > img[src^="/assets/configs/network_logo"] {
    transform: translate3d(5px, 0, 0) scale(1) !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .group:has(> img[src*="labels/testnet"]) > header > a[aria-label="Link to main page"] > img[src^="/assets/configs/network_logo"] {
    transition: none !important;
    will-change: auto;
  }
}

/* Keep the compact badge and click target at Blockscout's native positions. */
@media screen and (min-width: 1000px) {
  .group.css-55musk:has(> img[src*="labels/testnet"]) { padding-top: 24px !important; }
  .group.css-55musk:has(> img[src*="labels/testnet"]) > img[src*="labels/testnet"] { top: 34px !important; }
}
@media screen and (min-width: 1000px) and (max-width: 1439px) {
  .group.css-gu4dv3:has(> img[src*="labels/testnet"]) { padding-top: 24px !important; }
  .group.css-gu4dv3:has(> img[src*="labels/testnet"]) > img[src*="labels/testnet"] { top: 34px !important; }
}

/* Reduced motion also suppresses Blockscout's native sidebar resize. */
@media (prefers-reduced-motion: reduce) {
  .group:has(> img[src*="labels/testnet"]),
  .group:has(> img[src*="labels/testnet"]) > header { transition: none !important; }
}

/* Hide only the presentation badge, including the narrow drawer. */
.group:has(> img[src*="labels/testnet"]) > img[src*="labels/testnet"],
.chakra-drawer__body > img[src*="labels/testnet"] { display: none !important; }

/* A static coin highlight plus a 780ms idle shimmer every six seconds. */
@keyframes uzh-seal-idle-shimmer {
  0%, 85% { background-position: center center, 100% 50%; }
  98%, 100% { background-position: center center, 0% 50%; }
}

@media screen and (min-width: 1000px) {
  .group:has(> img[src*="labels/testnet"])::after {
    content: "";
    position: absolute;
    left: 31px;
    top: 10px;
    width: 88px;
    height: 88px;
    z-index: 3;
    pointer-events: none;
    clip-path: circle(50% at 50% 50%);
    background-image: radial-gradient(circle at 27% 22%, rgba(255,255,255,.25) 0%, rgba(255,255,255,.12) 18%, transparent 55%), linear-gradient(68deg, transparent 44%, rgba(255,255,255,.24) 50%, transparent 56%);
    background-size: 100% 100%, 300% 100%;
    background-position: center center, 100% 50%;
    background-repeat: no-repeat;
    opacity: 1;
    transform-origin: center center;
    transform: translate3d(-29px,-10px,0) scale(.340909);
    transition: transform 240ms cubic-bezier(.22,1,.36,1);
    animation: uzh-seal-idle-shimmer 6s linear infinite;
  }
  .group.css-3x98l5:has(> img[src*="labels/testnet"])::after {
    transform: translate3d(5px,0,0) scale(1);
  }
}
@media screen and (min-width: 1440px) {
  .group.css-gu4dv3:has(> img[src*="labels/testnet"])::after {
    transform: translate3d(5px,0,0) scale(1);
  }
}
@media (prefers-reduced-motion: reduce) {
  .group:has(> img[src*="labels/testnet"])::after { animation: none !important; opacity: 1 !important; background-position: center center, 100% 50% !important; transition: none !important; }
}

/* Source Sans 3 is limited to the home hero title. */
main > div > div.css-i9gxme > div:first-child > h1 { font-family: "Source Sans 3", sans-serif !important; text-transform: capitalize !important; }