/* Guardian Insights — read-only dashboard strip on Blacklist page */
.gi-panel {
  margin-bottom: 20px;
  padding: 16px 18px;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06), rgba(16, 185, 129, 0.04));
}
.gi-panel.gi-loading { opacity: 0.65; pointer-events: none; }
.gi-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.gi-header h3 {
  font-size: 0.95rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}
.gi-badge {
  font-size: 0.65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 4px 8px;
  border-radius: 999px;
  color: var(--text-muted);
  background: rgba(148, 163, 184, 0.15);
  border: 1px solid var(--border);
}
.gi-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
}
.gi-reasons {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}
.gi-reasons-title {
  font-size: 0.78rem;
  font-weight: 700;
  margin: 0 0 6px;
  color: var(--text-muted);
}
.gi-reasons ul {
  margin: 0;
  padding-left: 18px;
  font-size: 0.78rem;
  color: var(--text-muted);
}
.gi-reasons li { margin-bottom: 4px; }
.gi-card {
  text-align: center;
  padding: 12px 10px;
  border-radius: 12px;
  background: var(--surface-overlay);
  border: 1px solid var(--border);
}
.gi-card.gi-wide { grid-column: span 1; }
.gi-value {
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1.1;
}
.gi-value-sm { font-size: 0.82rem; font-weight: 700; }
.gi-label {
  font-size: 0.72rem;
  color: var(--text-muted);
  font-weight: 600;
  margin-top: 4px;
}
.gi-score.good .gi-value { color: var(--success); }
.gi-score.warn .gi-value { color: #d97706; }
.gi-score.bad .gi-value { color: var(--danger); }
.gi-score.good { border-color: rgba(16, 185, 129, 0.35); }
.gi-score.warn { border-color: rgba(245, 158, 11, 0.35); }
.gi-score.bad { border-color: rgba(244, 63, 94, 0.35); }
@media (max-width: 768px) {
  .gi-grid { grid-template-columns: repeat(2, 1fr); }
  .gi-card.gi-wide { grid-column: span 2; }
}