.impact-inline {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .8rem;
  color: #42526e;
  font-size: .78rem;
  white-space: nowrap;
}

.impact-inline strong { color: #102a43; }

.performance-panel {
  margin-top: 1.2rem;
  overflow: hidden;
}

.performance-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  background: #e5edf5;
}

.performance-grid article {
  min-height: 100px;
  padding: 1rem;
  background: #fff;
}

.performance-grid article span,
.performance-detail span {
  display: block;
  color: #66788a;
  font-size: .72rem;
  line-height: 1.35;
}

.performance-grid article strong {
  display: block;
  margin-top: .35rem;
  color: #0a66c2;
  font-size: 1.5rem;
}

.performance-detail {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid #e5edf5;
}

.performance-detail div { padding: .9rem 1rem; }
.performance-detail div + div { border-left: 1px solid #e5edf5; }
.performance-detail b { display: block; margin-top: .2rem; color: #102a43; }
.performance-notes { padding: 1rem; border-top: 1px solid #e5edf5; }

.metrics-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .8rem 1rem;
  margin-top: 1rem;
}

.metrics-form .field:last-of-type,
.metrics-form button { grid-column: 1 / -1; }
.metrics-form input,
.metrics-form textarea { width: 100%; }

@media (max-width: 980px) {
  .performance-grid { grid-template-columns: repeat(2, 1fr); }
  .metrics-form { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  .performance-grid article { min-height: 88px; padding: .8rem; }
  .performance-detail { grid-template-columns: 1fr; }
  .performance-detail div + div { border-left: 0; border-top: 1px solid #e5edf5; }
  .metrics-form { grid-template-columns: 1fr; }
  .metrics-form .field:last-of-type,
  .metrics-form button { grid-column: 1; }
  .impact-inline { gap: .25rem .55rem; white-space: normal; }
}