/* Planet overview: city-first control center. No full-screen hero artwork. */
.planet-overview-page { min-height: 0; }
.planet-overview-header {
  display: grid;
  grid-template-columns: minmax(330px, .78fr) minmax(620px, 1.22fr);
  gap: 14px;
  align-items: stretch;
  padding: 12px;
  border: 1px solid rgba(105,184,239,.2);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(8,20,35,.96), rgba(5,14,25,.95));
  box-shadow: var(--inner-glow);
}
.planet-header-identity { min-width:0; display:flex; align-items:center; gap:14px; }
.planet-header-art { width:92px; height:72px; flex:0 0 auto; overflow:hidden; border:1px solid rgba(105,184,239,.25); border-radius:11px; background:#06101d; }
.planet-header-art picture,.planet-header-art img { width:100%;height:100%;display:block;object-fit:cover;object-position:center; }
.planet-header-identity h1 { margin:4px 0 2px; font-size:28px; line-height:1; }
.planet-header-identity p { margin:0; color:#9eb1c1; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.planet-header-metrics { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; }
.planet-header-metrics > span { min-width:0; display:flex; flex-direction:column; justify-content:center; padding:9px 10px; border:1px solid rgba(105,184,239,.14); border-radius:10px; background:rgba(10,23,39,.76); }
.planet-header-metrics small { color:#7892a9; font-size:13px; text-transform:uppercase; letter-spacing:.06em; }
.planet-header-metrics strong { margin-top:4px; font-size:18px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.planet-overview-layout { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:10px; margin-top:10px; align-items:start; }
.planet-overview-main,.planet-overview-side { min-width:0; display:grid; gap:10px; }
.planet-city-list-panel,.planet-projects-panel,.planet-capacity-panel,.planet-side-panel {
  min-width:0;
  padding:12px;
  border:1px solid rgba(105,184,239,.18);
  border-radius:13px;
  background:linear-gradient(180deg,rgba(7,18,31,.94),rgba(5,14,25,.95));
  box-shadow:var(--inner-glow);
}
.planet-panel-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.planet-panel-head h2 { margin:3px 0 0; font-size:17px; }
.planet-city-list { display:grid; gap:8px; margin-top:10px; }
.planet-city-row {
  min-width:0;
  display:grid;
  grid-template-columns:150px minmax(0,1fr) 116px;
  gap:12px;
  align-items:stretch;
  padding:9px;
  border:1px solid rgba(107,180,234,.14);
  border-radius:11px;
  background:rgba(10,23,39,.78);
  transition:border-color .16s ease,background .16s ease,transform .16s ease;
}
.planet-city-row:hover { border-color:rgba(94,203,255,.35); background:rgba(12,29,48,.9); }
.planet-city-row.selected { border-color:rgba(94,203,255,.72); box-shadow:inset 3px 0 0 var(--cyan),0 0 24px rgba(94,203,255,.08); }
.planet-city-thumb { min-height:112px; overflow:hidden; border:1px solid rgba(105,184,239,.15); border-radius:9px; background:#06101c; }
.planet-city-thumb picture,.planet-city-thumb img { width:100%;height:100%;display:block;object-fit:cover;object-position:center; }
.planet-city-main { min-width:0; display:grid; align-content:start; gap:6px; }
.planet-city-title { display:flex; align-items:center; gap:7px; min-width:0; }
.planet-city-title > span { color:#7794aa; font-size:13px; }
.planet-city-title strong { min-width:0; font-size:17px; white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.planet-city-title em { margin-left:auto; padding:3px 7px; border:1px solid rgba(77,224,170,.22); border-radius:999px; color:var(--green); background:rgba(77,224,170,.06); font-size:13px; font-style:normal; }
.planet-city-main > p { margin:0; color:#8ea2b4; font-size:13px; }
.planet-city-stats { display:grid; grid-template-columns:repeat(4,minmax(86px,1fr)); gap:7px; }
.planet-city-stats > span { padding:7px 8px; border-radius:8px; background:rgba(5,15,27,.76); }
.planet-city-stats small,.planet-city-stats strong { display:block; }
.planet-city-stats small { color:#6f899f; font-size:13px; text-transform:uppercase; }
.planet-city-stats strong { margin-top:3px; font-size:13px; }
.planet-city-project { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:8px; align-items:center; padding-top:4px; border-top:1px solid rgba(105,184,239,.1); }
.planet-city-project span { color:#6f899f; font-size:13px; text-transform:uppercase; }
.planet-city-project strong { min-width:0; font-size:13px; white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.planet-city-project small { color:#90a4b5; font-size:13px; white-space:nowrap; }
.planet-city-project.idle strong { color:var(--green); }
.planet-city-actions { display:grid; align-content:center; gap:7px; }
.planet-city-actions button { width:100%; }
.planet-city-slot,.planet-city-capacity-full { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:12px; align-items:center; margin-top:9px; padding:11px 12px; border:1px dashed rgba(105,184,239,.24); border-radius:11px; background:rgba(7,18,31,.58); }
.planet-city-slot-icon { width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(94,203,255,.38);border-radius:50%;color:var(--cyan);font-size:25px;background:rgba(94,203,255,.06); }
.planet-city-slot strong,.planet-city-slot small,.planet-city-capacity-full strong,.planet-city-capacity-full small { display:block; }
.planet-city-slot strong,.planet-city-capacity-full strong { font-size:13px; }
.planet-city-slot small,.planet-city-capacity-full small { margin-top:3px;color:#8298aa;font-size:13px; }
.planet-city-capacity-full { grid-template-columns:1fr; }

.planet-overview-lower { display:grid; grid-template-columns:minmax(0,1fr) minmax(310px,.72fr); gap:10px; }
.planet-project-list { display:grid; gap:7px; margin-top:10px; }
.planet-project-list > div:not(.planet-empty-state) { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px 12px; padding:9px 10px; border:1px solid rgba(105,184,239,.12); border-radius:9px; background:rgba(10,23,39,.66); }
.planet-project-list span { font-size:13px; font-weight:700; }
.planet-project-list small { color:#8095a8; font-size:13px; }
.planet-capacity-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; margin-top:10px; }
.planet-capacity-metrics > span { padding:9px; border:1px solid rgba(105,184,239,.12); border-radius:9px; background:rgba(10,23,39,.7); }
.planet-capacity-metrics small,.planet-capacity-metrics strong { display:block; }
.planet-capacity-metrics small { color:#748da2;font-size:13px;text-transform:uppercase; }
.planet-capacity-metrics strong { margin-top:4px;font-size:18px; }
.planet-capacity-panel > p { margin:10px 0 0;color:#8ca0b2;font-size:13px;line-height:1.45; }

.planet-overview-side { align-content:start; }
.planet-selected-city-art { height:118px; margin-top:10px; overflow:hidden; border:1px solid rgba(105,184,239,.15); border-radius:9px; }
.planet-selected-city-art picture,.planet-selected-city-art img { width:100%;height:100%;display:block;object-fit:cover; }
.planet-selected-city-metrics { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:8px; }
.planet-selected-city-metrics > span { padding:8px;border-radius:8px;background:rgba(7,17,29,.8); }
.planet-selected-city-metrics small,.planet-selected-city-metrics strong { display:block; }
.planet-selected-city-metrics small { color:#728ba1;font-size:13px;text-transform:uppercase; }
.planet-selected-city-metrics strong { margin-top:3px;font-size:14px; }
.planet-side-title { margin:10px 0 6px;color:#75a9d4;font-size:13px;font-weight:760;letter-spacing:.12em;text-transform:uppercase; }
.planet-building-summary > div:not(.planet-side-title) { display:flex;justify-content:space-between;gap:10px;padding:6px 1px;border-bottom:1px solid rgba(105,184,239,.08);font-size:13px; }
.planet-building-summary > div strong { color:#c8d7e5; }
.planet-project-summary { margin:9px 0;padding:8px;border:1px solid rgba(105,184,239,.12);border-radius:8px;background:rgba(8,20,34,.74); }
.planet-project-summary span,.planet-project-summary strong,.planet-project-summary small { display:block; }
.planet-project-summary span { color:#75a9d4;font-size:13px;text-transform:uppercase; }
.planet-project-summary strong { margin-top:3px;font-size:13px; }
.planet-project-summary small { margin-top:2px;color:#8398aa;font-size:13px; }
.planet-summary-lines,.planet-supply-list,.planet-force-list { display:grid; gap:6px; margin-top:9px; }
.planet-summary-lines > div,.planet-supply-list > div,.planet-force-list > div { display:flex;justify-content:space-between;gap:12px;padding:7px 8px;border-radius:8px;background:rgba(8,20,34,.7);font-size:13px; }
.planet-summary-lines span,.planet-supply-list span,.planet-force-list span { color:#8ca0b2; }
.planet-summary-lines strong { max-width:190px;text-align:right; }
.planet-empty-state { padding:11px;border:1px dashed rgba(105,184,239,.18);border-radius:9px;background:rgba(6,16,28,.55); }
.planet-empty-state strong,.planet-empty-state small { display:block; }
.planet-empty-state strong { font-size:13px; }
.planet-empty-state small { margin-top:4px;color:#8297aa;font-size:13px;line-height:1.45; }
.planet-forces-panel button { margin-top:9px; }

@media(max-width:1500px){
  .planet-overview-layout{grid-template-columns:minmax(0,1fr) 310px}
  .planet-overview-header{grid-template-columns:minmax(290px,.7fr) minmax(550px,1.3fr)}
  .planet-city-row{grid-template-columns:118px minmax(0,1fr) 104px}
  .planet-city-stats{grid-template-columns:repeat(2,minmax(90px,1fr))}
  .planet-city-project{grid-template-columns:auto minmax(0,1fr)}
  .planet-city-project small{grid-column:2}
}
@media(max-width:1180px){
  .planet-overview-header{grid-template-columns:1fr}
  .planet-overview-layout{grid-template-columns:1fr}
  .planet-overview-side{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  .planet-selected-city{grid-row:span 2}
}
@media(max-width:780px){
  .planet-header-metrics{grid-template-columns:repeat(2,1fr)}
  .planet-city-row{grid-template-columns:96px minmax(0,1fr)}
  .planet-city-actions{grid-column:1/-1;grid-template-columns:1fr 1fr}
  .planet-city-stats{grid-template-columns:1fr 1fr}
  .planet-overview-lower,.planet-overview-side{grid-template-columns:1fr}
  .planet-capacity-metrics{grid-template-columns:1fr 1fr}
  .planet-city-slot{grid-template-columns:auto 1fr}
  .planet-city-slot button{grid-column:1/-1}
}


@media(max-height:820px) and (min-width:1181px){
  .planet-city-thumb{min-height:92px}
  .planet-selected-city-art{height:96px}
  .planet-city-row{padding:8px}
  .planet-city-list-panel,.planet-projects-panel,.planet-capacity-panel,.planet-side-panel{padding:10px}
}