.service-runtime-status {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 0.75rem;
  align-items: center;
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
  padding: 0.9rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 1rem;
  background: rgba(255, 255, 255, 0.055);
}

.service-runtime-dot {
  width: 0.72rem;
  height: 0.72rem;
  border-radius: 50%;
  background: #85806f;
  box-shadow: 0 0 0 0.35rem rgba(133, 128, 111, 0.12);
}

.service-runtime-status[data-service-state="connected"] .service-runtime-dot {
  background: #7fc8a9;
  box-shadow: 0 0 0 0.35rem rgba(127, 200, 169, 0.12);
}

.service-runtime-status[data-service-state="static"] .service-runtime-dot {
  background: #f6b13c;
  box-shadow: 0 0 0 0.35rem rgba(246, 177, 60, 0.12);
}

.service-runtime-status strong,
.service-runtime-status span {
  display: block;
}

.service-runtime-status strong {
  color: #fffaf1;
  font-size: 0.78rem;
}

.service-runtime-status div > span {
  margin-top: 0.2rem;
  color: #9bb8af;
  font-size: 0.68rem;
  line-height: 1.35;
}

.service-runtime-status small {
  padding: 0.28rem 0.48rem;
  border: 1px solid rgba(246, 177, 60, 0.3);
  border-radius: 999px;
  color: #f6b13c;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

@media (max-width: 620px) {
  .service-runtime-status {
    margin-bottom: 4.5rem;
  }
}

/* catalog-parity-status */
.service-runtime-parity {
  display: block;
  margin-top: 0.2rem;
  color: var(--ink-muted, #5d665e);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.service-runtime-parity[hidden] {
  display: none;
}

.service-runtime-status.is-parity-degraded .service-runtime-dot {
  background: #d45c3f;
  box-shadow: 0 0 0 0.25rem rgba(212, 92, 63, 0.15);
}

.service-runtime-status.is-parity-degraded .service-runtime-parity {
  color: #9f3f2b;
}

/* coverage-api-status */
.coverage-api-status {
  display: grid;
  grid-template-columns: 0.75rem minmax(0, 1fr);
  gap: 0.7rem;
  align-items: start;
  margin: 0.85rem 0 1rem;
  padding: 0.9rem 1rem;
  border: 1px solid rgba(16, 87, 75, 0.18);
  border-radius: 1rem;
  background: rgba(246, 241, 227, 0.72);
  color: var(--ink, #143f38);
}

.coverage-api-status__indicator {
  width: 0.7rem;
  height: 0.7rem;
  margin-top: 0.22rem;
  border-radius: 50%;
  background: #d6a53a;
  box-shadow: 0 0 0 0.22rem rgba(214, 165, 58, 0.14);
}

.coverage-api-status__copy {
  display: grid;
  min-width: 0;
  gap: 0.18rem;
}

.coverage-api-status__copy strong,
.coverage-api-status__copy span {
  overflow-wrap: anywhere;
}

.coverage-api-status__copy strong {
  font-size: 0.82rem;
  line-height: 1.3;
}

.coverage-api-status__copy span {
  color: var(--ink-muted, #5d665e);
  font-size: 0.74rem;
  line-height: 1.45;
}

.coverage-api-status[data-state="verified"] .coverage-api-status__indicator {
  background: #39a78e;
  box-shadow: 0 0 0 0.22rem rgba(57, 167, 142, 0.14);
}

.coverage-api-status[data-state="inconsistent"] .coverage-api-status__indicator,
.coverage-api-status[data-state="unavailable"] .coverage-api-status__indicator {
  background: #d45c3f;
  box-shadow: 0 0 0 0.22rem rgba(212, 92, 63, 0.14);
}

@media (max-width: 640px) {
  .coverage-api-status {
    padding: 0.8rem 0.85rem;
  }
}