/* Only the monitoring page: shared navigation, home and other modules stay unchanged. */
.module-page[data-module="monitoring"] .monitoring-hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); align-items: center; gap: 24px; margin-bottom: 20px; }
.module-page[data-module="monitoring"] .monitoring-hero-copy { min-width: 0; }
.module-page[data-module="monitoring"] .monitoring-hero h1 { max-width: none; font-family: var(--result-font); font-weight: 800; line-height: 1.3; letter-spacing: -.03em; }
.module-page[data-module="monitoring"] .monitoring-overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-self: stretch; gap: 10px; }
.module-page[data-module="monitoring"] .monitoring-overview-stat { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 17px 12px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); }
.module-page[data-module="monitoring"] .monitoring-overview-stat strong { font-family: var(--result-font); color: var(--ink); font-size: 25px; font-weight: 800; line-height: 1.35; overflow-wrap: anywhere; }
.module-page[data-module="monitoring"] .monitoring-overview-stat span { margin-top: 4px; color: var(--muted); font-size: 11px; }
.module-page[data-module="monitoring"] .monitoring-local-notice strong { display: block; margin-bottom: 3px; }
.module-page[data-module="monitoring"] .monitoring-availability,
.module-page[data-module="monitoring"] .monitoring-ip-history { margin-top: 16px; }
.module-page[data-module="monitoring"] .monitoring-availability .module-kicker { margin: 0 0 7px; }
.module-page[data-module="monitoring"] .monitoring-availability h2,
.module-page[data-module="monitoring"] .monitoring-ip-history h2 { font-family: var(--result-font); font-size: 18px; font-weight: 800; }
.module-page[data-module="monitoring"] .monitoring-probe-options { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; padding: 12px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.module-page[data-module="monitoring"] .monitoring-probe-options label { display: inline-flex; align-items: center; color: var(--muted); font-size: 12px; }
.module-page[data-module="monitoring"] .monitoring-record-count { margin-left: auto; color: var(--muted); font-family: var(--result-font); font-size: 12px; font-weight: 700; }
.module-page[data-module="monitoring"] .monitoring-empty-state { display: flex; flex-direction: column; align-items: center; padding: 30px 16px; text-align: center; }
.module-page[data-module="monitoring"] .monitoring-empty-mark { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 12px; border-radius: 50%; background: var(--surface-soft); color: var(--accent); font-size: 24px; line-height: 1; }
.module-page[data-module="monitoring"] .monitoring-empty-state h3 { margin: 0; font-family: var(--result-font); font-size: 15px; font-weight: 700; }
.module-page[data-module="monitoring"] .monitoring-empty-state p { max-width: 650px; margin: 9px 0 0; color: var(--muted); font-size: 12px; font-weight: 400; overflow-wrap: anywhere; }
.module-page[data-module="monitoring"] .monitoring-empty-state .module-button { margin-top: 18px; }
.module-page[data-module="monitoring"] .monitoring-history-tools { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 16px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.module-page[data-module="monitoring"] .monitoring-history-tools .field { max-width: 440px; }
.module-page[data-module="monitoring"] .monitoring-history-tools input:disabled { color: var(--muted); background: var(--surface-soft); cursor: not-allowed; opacity: .75; }
.module-page[data-module="monitoring"] .monitoring-history-heading { margin-top: 18px; margin-bottom: 0; }
.module-page[data-module="monitoring"] .monitoring-heading-count { display: inline-block; min-width: 26px; margin-left: 5px; padding: 1px 7px; border-radius: 7px; background: var(--surface-soft); color: var(--accent); font-size: 12px; text-align: center; vertical-align: middle; }
.module-page[data-module="monitoring"] .monitoring-selection-count { color: var(--muted); font-family: var(--result-font); font-size: 12px; font-weight: 700; }
.module-page[data-module="monitoring"] .monitoring-service-note strong { display: block; margin-bottom: 3px; }
.module-page[data-module="monitoring"] .monitoring-legacy { margin-top: 18px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.module-page[data-module="monitoring"] .monitoring-legacy > summary { padding: 17px 20px; color: var(--ink); cursor: pointer; overflow-wrap: anywhere; }
.module-page[data-module="monitoring"] .monitoring-legacy > summary::marker { color: var(--accent); }
.module-page[data-module="monitoring"] .monitoring-legacy > summary strong { font-family: var(--result-font); font-size: 14px; font-weight: 700; }
.module-page[data-module="monitoring"] .monitoring-legacy > summary span { display: inline-block; margin-left: 12px; color: var(--muted); font-size: 12px; font-weight: 400; }
.module-page[data-module="monitoring"] .monitoring-legacy[open] > summary { border-bottom: 1px solid var(--line); }
.module-page[data-module="monitoring"] .monitoring-legacy-content { padding: 20px; }
.module-page[data-module="monitoring"] .monitoring-legacy .module-intro h2 { margin: 0; font-family: var(--result-font); font-size: 19px; font-weight: 800; line-height: 1.3; }
@media (max-width: 960px) {
  .module-page[data-module="monitoring"] .monitoring-hero { grid-template-columns: minmax(0, 1fr); gap: 16px; }
}
@media (max-width: 620px) {
  .module-page[data-module="monitoring"] .monitoring-overview { gap: 7px; }
  .module-page[data-module="monitoring"] .monitoring-overview-stat { padding: 13px 10px; }
  .module-page[data-module="monitoring"] .monitoring-overview-stat strong { font-size: 22px; }
  .module-page[data-module="monitoring"] .monitoring-history-tools { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .module-page[data-module="monitoring"] .monitoring-history-tools .field { max-width: none; }
  .module-page[data-module="monitoring"] .monitoring-record-count { margin-left: 0; }
  .module-page[data-module="monitoring"] .monitoring-empty-state { padding: 26px 0; }
  .module-page[data-module="monitoring"] .monitoring-legacy > summary { padding: 15px; }
  .module-page[data-module="monitoring"] .monitoring-legacy > summary span { display: block; margin: 4px 0 0 16px; }
  .module-page[data-module="monitoring"] .monitoring-legacy-content { padding: 15px; }
}