.monitoring-settings { color: var(--ink); max-width: 1500px; }
.monitoring-intro { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.monitoring-intro strong { font-size: 18px; }
.monitoring-intro p, .monitoring-note { color: var(--muted); font-size: 13px; line-height: 1.6; }
.monitoring-status { padding: 12px 16px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); font-weight: 600; }
.monitoring-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin-top: 18px; }
.monitoring-card { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.monitoring-card h2 { margin: 0 0 16px; font-size: 16px; }
.monitoring-card dl { margin: 0; }
.monitoring-card dl > div { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 13px; line-height: 1.5; }
.monitoring-card dt { color: var(--muted); }
.monitoring-card dd { margin: 0; font-weight: 500; overflow-wrap: anywhere; }
.monitoring-card .monitoring-note { margin-bottom: 0; }
.monitoring-settings button:focus-visible { outline: 3px solid var(--primary); outline-offset: 3px; }
@media (max-width: 1100px) { .monitoring-grid { grid-template-columns: minmax(0,1fr); } }
@media (max-width: 600px) {
  .monitoring-intro { align-items: stretch; flex-direction: column; }
  .monitoring-card { padding: 15px; }
  .monitoring-card dl > div { gap: 10px; }
}
