/* v0.13.5A – planet overview readability uplift for full HD, QHD and 4K. */
.planet-selected-city-actions {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: 10px;
  margin-top: 10px;
}

.planet-selected-city-actions .ref-primary-button,
.planet-selected-city-actions .ref-secondary-button {
  min-height: 42px;
  font-size: 12px;
}

@media (min-width: 1101px) {
  .planet-overview-layout {
    grid-template-columns: minmax(0,1fr) 390px;
    gap: 12px;
  }

  .planet-side-panel,
  .planet-city-list-panel,
  .planet-projects-panel,
  .planet-capacity-panel {
    padding: 14px;
  }

  .planet-panel-head h2 {
    font-size: 19px;
  }

  .planet-selected-city-art {
    height: 136px;
  }

  .planet-selected-city-metrics {
    gap: 9px;
    margin-top: 10px;
  }

  .planet-selected-city-metrics > span {
    padding: 10px;
    border-radius: 9px;
  }

  .planet-selected-city-metrics small {
    font-size: 10px;
  }

  .planet-selected-city-metrics strong {
    font-size: 16px;
  }

  .planet-side-title {
    margin: 12px 0 7px;
    font-size: 10px;
  }

  .planet-building-summary > div:not(.planet-side-title) {
    padding: 8px 1px;
    font-size: 12px;
  }

  .planet-project-summary {
    margin: 11px 0;
    padding: 10px;
  }

  .planet-project-summary span { font-size: 10px; }
  .planet-project-summary strong { font-size: 14px; }
  .planet-project-summary small { font-size: 11px; }

  .planet-summary-lines,
  .planet-supply-list,
  .planet-force-list {
    gap: 7px;
    margin-top: 10px;
  }

  .planet-summary-lines > div,
  .planet-supply-list > div,
  .planet-force-list > div {
    padding: 9px 10px;
    font-size: 12px;
  }

  .planet-empty-state {
    padding: 12px;
  }

  .planet-empty-state strong { font-size: 13px; }
  .planet-empty-state small { font-size: 11px; }

  .planet-capacity-metrics > span {
    padding: 10px;
  }

  .planet-capacity-metrics small {
    font-size: 10px;
  }

  .planet-capacity-metrics strong {
    font-size: 20px;
  }

  .planet-capacity-panel > p {
    font-size: 11px;
  }

  .planet-selected-city-actions .ref-primary-button,
  .planet-selected-city-actions .ref-secondary-button {
    min-height: 46px;
    font-size: 13px;
  }
}

@media (min-width: 1600px) {
  .planet-overview-layout {
    grid-template-columns: minmax(0,1fr) 430px;
  }

  .planet-overview-header {
    padding: 14px;
    gap: 16px;
  }

  .planet-header-art {
    width: 104px;
    height: 82px;
  }

  .planet-header-identity h1 {
    font-size: 31px;
  }

  .planet-header-identity p {
    font-size: 13px;
  }

  .planet-header-metrics > span {
    padding: 10px 11px;
  }

  .planet-header-metrics small { font-size: 11px; }
  .planet-header-metrics strong { font-size: 20px; }

  .planet-selected-city-art {
    height: 152px;
  }

  .planet-selected-city-metrics strong {
    font-size: 17px;
  }

  .planet-building-summary > div:not(.planet-side-title) {
    font-size: 13px;
  }

  .planet-summary-lines > div,
  .planet-supply-list > div,
  .planet-force-list > div {
    font-size: 13px;
  }
}

@media (min-width: 2200px) and (min-height: 1200px) {
  .planet-overview-header {
    grid-template-columns: minmax(390px,.76fr) minmax(760px,1.24fr);
    gap: 18px;
    padding: 18px;
  }

  .planet-header-art {
    width: 122px;
    height: 96px;
    border-radius: 13px;
  }

  .planet-header-identity {
    gap: 18px;
  }

  .planet-header-identity h1 {
    font-size: 38px;
  }

  .planet-header-identity p {
    font-size: 15px;
  }

  .planet-header-metrics {
    gap: 10px;
  }

  .planet-header-metrics > span {
    padding: 13px 14px;
    border-radius: 12px;
  }

  .planet-header-metrics small { font-size: 12px; }
  .planet-header-metrics strong { font-size: 24px; }

  .planet-overview-layout {
    grid-template-columns: minmax(0,1fr) 520px;
    gap: 15px;
  }

  .planet-overview-main,
  .planet-overview-side,
  .planet-overview-lower {
    gap: 14px;
  }

  .planet-city-list-panel,
  .planet-projects-panel,
  .planet-capacity-panel,
  .planet-side-panel {
    padding: 18px;
    border-radius: 15px;
  }

  .planet-panel-head h2 {
    font-size: 22px;
  }

  .planet-selected-city-art {
    height: 184px;
    border-radius: 12px;
  }

  .planet-selected-city-metrics {
    gap: 10px;
  }

  .planet-selected-city-metrics > span {
    padding: 12px;
  }

  .planet-selected-city-metrics small { font-size: 11px; }
  .planet-selected-city-metrics strong { font-size: 20px; }

  .planet-side-title {
    font-size: 11px;
  }

  .planet-building-summary > div:not(.planet-side-title) {
    padding: 9px 1px;
    font-size: 14px;
  }

  .planet-project-summary {
    padding: 12px;
    border-radius: 10px;
  }

  .planet-project-summary span { font-size: 11px; }
  .planet-project-summary strong { font-size: 16px; }
  .planet-project-summary small { font-size: 12px; }

  .planet-summary-lines,
  .planet-supply-list,
  .planet-force-list {
    gap: 8px;
  }

  .planet-summary-lines > div,
  .planet-supply-list > div,
  .planet-force-list > div {
    padding: 10px 12px;
    font-size: 14px;
    border-radius: 9px;
  }

  .planet-empty-state {
    padding: 14px;
  }

  .planet-empty-state strong { font-size: 15px; }
  .planet-empty-state small { font-size: 12px; }

  .planet-capacity-metrics {
    gap: 9px;
  }

  .planet-capacity-metrics > span {
    padding: 12px;
    border-radius: 10px;
  }

  .planet-capacity-metrics small { font-size: 11px; }
  .planet-capacity-metrics strong { font-size: 24px; }
  .planet-capacity-panel > p { font-size: 12px; }

  .planet-selected-city-actions .ref-primary-button,
  .planet-selected-city-actions .ref-secondary-button {
    min-height: 50px;
    font-size: 14px;
  }
}

@media (min-width: 3000px) and (min-height: 1700px) {
  .planet-overview-header {
    grid-template-columns: minmax(500px,.78fr) minmax(980px,1.22fr);
    gap: 22px;
    padding: 22px;
  }

  .planet-header-art {
    width: 146px;
    height: 112px;
  }

  .planet-header-identity h1 {
    font-size: 46px;
  }

  .planet-header-identity p {
    font-size: 18px;
  }

  .planet-header-metrics > span {
    padding: 16px;
  }

  .planet-header-metrics small { font-size: 13px; }
  .planet-header-metrics strong { font-size: 30px; }

  .planet-overview-layout {
    grid-template-columns: minmax(0,1fr) 640px;
    gap: 18px;
  }

  .planet-overview-main,
  .planet-overview-side,
  .planet-overview-lower {
    gap: 16px;
  }

  .planet-city-list-panel,
  .planet-projects-panel,
  .planet-capacity-panel,
  .planet-side-panel {
    padding: 22px;
    border-radius: 18px;
  }

  .planet-panel-head h2 {
    font-size: 26px;
  }

  .planet-selected-city-art {
    height: 230px;
  }

  .planet-selected-city-metrics > span {
    padding: 14px;
  }

  .planet-selected-city-metrics small { font-size: 13px; }
  .planet-selected-city-metrics strong { font-size: 24px; }

  .planet-side-title { font-size: 12px; }

  .planet-building-summary > div:not(.planet-side-title) {
    padding: 11px 1px;
    font-size: 16px;
  }

  .planet-project-summary span { font-size: 12px; }
  .planet-project-summary strong { font-size: 18px; }
  .planet-project-summary small { font-size: 14px; }

  .planet-summary-lines > div,
  .planet-supply-list > div,
  .planet-force-list > div {
    padding: 12px 14px;
    font-size: 16px;
  }

  .planet-capacity-metrics > span {
    padding: 14px;
  }

  .planet-capacity-metrics small { font-size: 12px; }
  .planet-capacity-metrics strong { font-size: 30px; }
  .planet-capacity-panel > p { font-size: 14px; }

  .planet-selected-city-actions {
    gap: 12px;
  }

  .planet-selected-city-actions .ref-primary-button,
  .planet-selected-city-actions .ref-secondary-button {
    min-height: 58px;
    font-size: 16px;
  }
}

@media (max-width: 780px) {
  .planet-selected-city-actions {
    grid-template-columns: 1fr;
  }
}