/* V25 — compact connection status and simplified indicator detail */

.side-user {
  min-height: 132px !important;
}

.side-user > div > strong::after {
  content: none !important;
  display: none !important;
}

.side-sync-status {
  width: 18px !important;
  height: 18px !important;
  margin-top: 9px !important;
  display: grid !important;
  place-items: center !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

.side-sync-status > i {
  width: 12px !important;
  height: 12px !important;
}

.side-build-version {
  width: max-content;
  margin-top: 5px;
  display: block;
  color: #d7aaa8 !important;
  direction: ltr;
  font: 800 12px/1.2 Tahoma, Arial, sans-serif !important;
}

.overview-hero .hero-copy {
  justify-self: start !important;
  place-items: center start !important;
  text-align: right !important;
  transform: translateX(20px);
}

.overview-hero .hero-copy .section-kicker {
  min-height: 50px !important;
  padding: 11px 22px !important;
  font-size: 23px !important;
}

.detail-head {
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 30px !important;
}

.detail-head > div:first-child h2 {
  margin: 0 !important;
  text-align: right !important;
}

.detail-targets {
  justify-self: end !important;
}

.detail-targets > div {
  min-width: 190px !important;
  padding: 18px 20px !important;
  text-align: center !important;
}

.detail-targets span {
  font-size: 24px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
}

.detail-targets strong {
  margin-top: 9px !important;
  font-size: 25px !important;
}

@media (max-width: 1180px) {
  .overview-hero .hero-copy {
    transform: none;
  }
}

@media (max-width: 840px) {
  .detail-head {
    grid-template-columns: 1fr !important;
  }

  .detail-head > div:first-child h2 {
    text-align: center !important;
  }

  .detail-targets {
    width: 100% !important;
    justify-self: stretch !important;
  }

  .detail-targets > div {
    min-width: 0 !important;
  }
}
