/* Campaign */
.campaign-section { margin: 1.5rem 0; }
.progress-container { background: rgba(0,0,0,0.08); border-radius: 8px; overflow: hidden; }
.progress-bar { height: 14px; line-height: 14px; font-size: 12px; text-align: center; background: linear-gradient(90deg,#2196F3,#64B5F6); color: #fff; transition: width 0.2s linear; }
.campaign-complete.show { display: block !important; }

/* Metrics */
.tmd-metrics { margin: 2rem 0; }
.tmd-headline { margin-bottom: 1rem; font-weight: 700; }
.tmd-title, .tmd-subtitle { margin: 0.25rem 0 0.5rem; font-weight: 600; }
.tmd-text { margin: 0 0 0.75rem; }
.tmd-section { margin-bottom: 1.25rem; }
.tmd-flex { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: start; }
@media (max-width: 760px){ .tmd-flex { grid-template-columns: 1fr; } }
.tmd-label-row { display:flex; justify-content:space-between; align-items:center; margin-bottom:0.25rem; }
.tmd-label { font-weight: 500; }
.tmd-value { font-variant-numeric: tabular-nums; font-weight: 600; }
.tmd-bar { position: relative; width: 100%; height: 10px; background: rgba(0,0,0,0.08); border-radius: 6px; overflow: hidden; }
.tmd-bar--long { height: 12px; }
.tmd-bar-fill { position:absolute; left:0; top:0; bottom:0; width:0%; background: linear-gradient(90deg, #4CAF50, #66BB6A); transition: width 120ms linear; }
.tmd-bar-fill--danger { background: linear-gradient(90deg, #E53935, #EF5350); }
.tmd-duration { display:block; margin-top:0.35rem; opacity:0.7; font-size:0.9em; }
.tmd-stats-grid { display:grid; grid-template-columns: 3fr 2fr; gap: 1rem; }
@media (max-width: 760px){ .tmd-stats-grid { grid-template-columns: 1fr; } }
.tmd-card { background: rgba(0,0,0,0.04); border-radius: 8px; padding: 0.75rem; }
.tmd-caption {
  font-size: 0.85em;
  opacity: 0.75;
  margin-top: 0.5rem;
}

/* Server Metrics Table */
.server-metrics-section { margin: 2rem 0; }
.server-metrics {
  width: 100%;
  border-collapse: collapse;
  margin-top: 1rem;
}
.server-metrics th,
.server-metrics td {
  border: 1px solid #ccc;
  padding: 8px;
  text-align: left;
}
.server-metrics th {
  background: rgba(0,0,0,0.05);
  font-weight: 600;
}
.server-icon {
  width: 24px;
  height: 24px;
  vertical-align: middle;
  margin-right: 6px;
}
.server-value {
  font-weight: bold;
  color: #2a6;
}