.main.city-backdrop {
  background-position: center top;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: scroll;
}

.main.city-backdrop-inland {
  background-image:
    linear-gradient(
      180deg,
      rgba(5, 9, 7, 0.5),
      rgba(5, 9, 7, 0.7) 48%,
      rgba(5, 9, 7, 0.88)
    ),
    url("/assets/city-bg-inland.webp");
}

.main.city-backdrop-coastal {
  background-image:
    linear-gradient(
      180deg,
      rgba(5, 9, 7, 0.48),
      rgba(5, 9, 7, 0.68) 48%,
      rgba(5, 9, 7, 0.88)
    ),
    url("/assets/city-bg-coastal.webp");
}

.interior-bar,
.build-bar {
  gap: 6px;
}

.ib-up {
  padding-right: 12px;
  padding-left: 12px;
  white-space: nowrap;
}

.ib-up.ib-up-max {
  padding-right: 9px;
  padding-left: 9px;
  font-size: 12px;
}

.build-bar .d-btn {
  min-width: 0;
  padding-right: 12px;
  padding-left: 12px;
  white-space: nowrap;
}

.build-bar .d-btn.build-up-max {
  padding-right: 9px;
  padding-left: 9px;
  font-size: 12px;
}

.build-bar .d-btn.build-up-one {
  padding-right: 11px;
  padding-left: 11px;
}

@media (max-width: 370px) {
  .ib-title,
  .bb-info b {
    font-size: 15px;
  }

  .ib-up,
  .build-bar .d-btn {
    padding-right: 7px;
    padding-left: 7px;
    font-size: 12px;
  }

  .ib-up.ib-up-max,
  .build-bar .d-btn.build-up-max {
    padding-right: 6px;
    padding-left: 6px;
    font-size: 11px;
  }
}