/* Keep the final figures readable while adding optional number feedback. */
.network-metrics .network-metric{container-type:inline-size;transition:background-color .25s,box-shadow .25s}
.network-metric-trigger{display:block;width:100%;min-height:44px;padding:0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
.network-metric-trigger strong{display:inline-flex;align-items:baseline;gap:1px;transform-origin:left center;transition:transform .25s,color .25s}
.network-metrics strong .network-metric-value{display:inline-block;min-width:2ch;font-size:inherit;letter-spacing:inherit;font-variant-numeric:tabular-nums;text-align:left}
.network-metric[data-metric="team"] .network-metric-value{min-width:3ch}
.network-metrics strong .network-metric-unit{white-space:nowrap}
.network-metric-trigger:focus-visible{outline:2px solid #1974ba;outline-offset:4px;border-radius:3px}
.network-metric.is-counting strong,.network-metric-trigger:focus-visible strong{transform:translateY(-2px);color:#0874bf}
.network-metric:focus-within{box-shadow:inset 0 0 0 1px #79b8e2;background:#fff}
html[lang="en"] .network-metric[data-metric="area"] strong{flex-wrap:wrap;gap:2px 4px;font-size:clamp(17px,19cqw,26px);letter-spacing:-.6px}
html[lang="en"] .network-metric[data-metric="area"] .network-metric-value{min-width:7ch}
html[lang="en"] .network-metric[data-metric="area"] .network-metric-unit{font-size:11px}
@media(hover:hover) and (pointer:fine){
  .network-metric:hover{background:#fff;box-shadow:inset 0 0 0 1px #b5d6ed}
  .network-metric:hover strong{transform:translateY(-2px);color:#0874bf}
}
@media(prefers-reduced-motion:reduce){
  .network-metrics .network-metric,.network-metric-trigger strong{transition:none}
  .network-metric.is-counting strong,.network-metric:hover strong,.network-metric-trigger:focus-visible strong{transform:none}
}
