/* datacentres.html — UK Data Centres. Page-specific only; shared base + theme
   live in css/base.css (loaded first). */
.stat-row{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:12px}
/* maps (UK + world) */
.mapbox{position:relative;margin-top:12px}
.mapbox svg{width:100%;height:auto;display:block}
#ukMap svg{max-width:460px;margin:0 auto}
.map-tip{position:absolute;pointer-events:none;background:#0f1218;border:1px solid var(--line);border-radius:7px;
  padding:8px 10px;font-size:.76rem;line-height:1.45;color:var(--ink);opacity:0;max-width:260px;z-index:2;transition:opacity .12s}
.map-tip .dim,.map-legend .dim{color:var(--faint)}
.map-legend{display:flex;flex-wrap:wrap;gap:14px;font-size:.74rem;color:var(--muted);margin-top:10px}
.map-legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px;vertical-align:-1px}
.chartbox{margin-top:12px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:14px}
canvas{width:100%!important;max-height:360px}
.calc{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:12px}
.factor-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.out{display:flex;flex-direction:column;gap:10px}
.outrow{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--line);padding-bottom:8px}
.outrow .v{font-family:var(--mono);font-size:1.15rem}
.outrow .k{font-size:.82rem;color:var(--muted)}
.heat{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.heatrow{display:grid;grid-template-columns:200px 1fr 70px;gap:10px;align-items:center;font-size:.86rem}
.bar{height:18px;border-radius:5px;background:var(--panel2);overflow:hidden}
.bar>span{display:block;height:100%}
.heatrow .mw{font-family:var(--mono);text-align:right;color:var(--muted)}
.pill{font-size:.7rem;border:1px solid var(--line);border-radius:999px;padding:1px 7px;color:var(--muted)}
.note{font-size:.78rem;color:var(--faint);margin-top:8px}
@media(max-width:680px){
  .stat-row{grid-template-columns:1fr 1fr}
  .map-legend{gap:8px}
  .calc{grid-template-columns:1fr}
  .factor-grid{grid-template-columns:1fr}
  .heatrow{grid-template-columns:120px 1fr 56px}
  canvas{max-height:300px}
}
