.revuelta-time {
  --label-width: 12rem;
  --value-width: 4.8rem;
  --row-gap: 1rem;
  max-width: 760px;
  margin: 2rem auto 0;
  padding: 1rem 0 0;
  border-top: 2px solid var(--navy);
}

.revuelta-time figcaption {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 700;
}

.revuelta-time__scale {
  display: flex;
  justify-content: space-between;
  margin: 1rem var(--value-width) .25rem calc(var(--label-width) + var(--row-gap));
  color: var(--muted);
  font-size: .76rem;
}

.revuelta-time__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.revuelta-time__row {
  display: grid;
  grid-template-columns: var(--label-width) minmax(0, 1fr);
  align-items: center;
  gap: var(--row-gap);
  min-height: 3.9rem;
  border-top: 1px solid var(--line);
}

.revuelta-time__label {
  display: grid;
  gap: .15rem;
  font-variant-numeric: tabular-nums;
}

.revuelta-time__label span {
  color: var(--muted);
  font-size: .82rem;
}

.revuelta-time__bar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--value-width);
  align-items: center;
}

.revuelta-time__bar b {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.revuelta-time__track {
  height: 1rem;
  background: #e9edf1;
}

.revuelta-time__track::before {
  display: block;
  width: var(--share);
  height: 100%;
  background: var(--party);
  content: "";
}

.revuelta-clouds {
  --cloud-gap: 1.5rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--cloud-gap);
  margin: 1.75rem 0 0;
}

.revuelta-clouds figure {
  margin: 0;
  border-top: 1px solid var(--line);
}

.revuelta-clouds figure:last-child {
  grid-column: 1 / -1;
  justify-self: center;
  width: calc((100% - var(--cloud-gap)) / 2);
}

.revuelta-clouds figcaption {
  margin: .65rem 0 .4rem;
  color: var(--navy);
  font-weight: 700;
}

.revuelta-clouds img {
  display: block;
  width: 100%;
  height: auto;
}

.revuelta-report .revuelta-sources {
  margin-top: 2.25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font: .9rem/1.55 Arial, sans-serif;
}

@media (max-width: 580px) {
  .revuelta-time__scale {
    margin-left: 0;
  }

  .revuelta-time__row {
    grid-template-columns: minmax(0, 1fr);
    gap: .5rem;
    padding: .65rem 0;
  }

  .revuelta-time__label {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: baseline;
    gap: .5rem;
  }

  .revuelta-clouds {
    grid-template-columns: minmax(0, 1fr);
  }

  .revuelta-clouds figure:last-child {
    width: 100%;
  }
}
