#network-health{display:block;min-height:0;padding:18px;margin-top:0;color:#173e50;min-width:0}
.monitor-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.monitor-header h2{margin:0;font-size:1.25rem;line-height:1.3}.monitor-header .secondary{font-size:.8rem;padding:8px 12px;min-height:36px;white-space:normal;flex:none}
.monitor-source{color:#506c7c;font-size:.78rem;margin:8px 0 14px;overflow-wrap:anywhere;line-height:1.5}
.monitor-infrastructure{margin:0 0 20px;padding:0;border:0}
.monitor-totals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 14px}.monitor-totals>div{display:flex;align-items:center;gap:9px;padding:7px 10px;min-width:0;border:1px solid #e1eaf0;border-radius:10px;background:#f8fbfc}.monitor-totals strong{font-size:1.25rem;line-height:1.3;flex:none}.monitor-totals span{font-size:.8rem;line-height:1.35;white-space:nowrap}
.monitor-sites{display:grid;grid-template-columns:repeat(var(--monitor-site-columns,6),minmax(0,1fr));gap:10px;width:100%;margin:0}
.monitor-site,.monitor-problem{display:flex;flex-direction:column;align-items:flex-start;gap:5px;text-align:left;padding:13px 12px;border:1px solid #cee0ea;border-radius:11px;background:#fff;color:#173e50;line-height:1.4;min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere;font-size:.85rem;box-sizing:border-box;transition:box-shadow .15s ease,filter .15s ease}
.monitor-site{width:100%;height:100%;margin:0}.monitor-site strong{font-size:.95rem;line-height:1.35}.monitor-site small,.monitor-problem small{color:inherit;opacity:.85;font-size:.75rem}.monitor-site:hover{filter:brightness(.97);box-shadow:0 3px 10px #173e5014}.monitor-site:focus-visible,.monitor-problem:focus-visible{outline:3px solid #2a8daf;outline-offset:3px}
.monitor-site[data-state=available]{background:#d9f2e4;border-color:#8ec6a6;color:#155839}.monitor-site[data-state=down],.monitor-site[data-state=unavailable]{background:#fbdedc;border-color:#e3a3a0;color:#842e2a}.monitor-site[data-state=stale],.monitor-site[data-state=unknown],.monitor-site[data-state=degraded]{background:#fff0cc;border-color:#dfc17c;color:#795015}
.monitor-problems{margin:20px 0 14px}.monitor-problems h3,.monitor-graph-group>h3{margin:0 0 10px;font-size:1rem;line-height:1.4}.monitor-problem-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:10px}.monitor-problem:hover{background:#f4f9fc}.monitor-warning{border:1px solid #e2c47f;background:#fff9e9;padding:10px;border-radius:10px;font-size:.85rem;line-height:1.5}
.monitor-graph-group{margin-top:18px}.monitor-graphs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.monitor-graphs figure{display:flex;flex-direction:column;margin:0;border:1px solid #d4e3eb;border-radius:12px;padding:12px;min-width:0;overflow:hidden;background:#fff}.monitor-graphs figcaption{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;font-size:.95rem;font-weight:600;line-height:1.4;margin-bottom:8px;overflow-wrap:anywhere}.monitor-graphs img{display:block;width:100%;height:auto;min-width:0}.monitor-graph-note{display:block;text-align:right;margin-top:6px;font-size:.72rem;line-height:1.4;color:#567483}.monitor-graphs figure>p{font-size:.85rem;margin:8px 0;line-height:1.5}
.monitor-coverage{margin:18px 0 0;font-size:.85rem;color:#173e50}.monitor-coverage>summary,.monitor-previous-alerts>summary{font-size:.85rem;font-weight:600;color:#173e50;cursor:pointer}.monitor-coverage p{line-height:1.6}.monitor-previous-alerts{margin-top:14px}
.monitor-detail-nodes{display:grid;gap:10px}.monitor-node{padding:12px;border:1px solid #d4e3eb;border-radius:12px;min-width:0;overflow-wrap:anywhere;background:#fff}.monitor-node h3{margin:0 0 6px;font-size:1rem}.monitor-node p{margin:6px 0;line-height:1.5}.monitor-node .actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.monitor-node .actions>*{white-space:normal;max-width:100%}.monitor-node[data-in-service=false]{opacity:.8}.monitor-clients p{overflow-wrap:anywhere}
.monitor-inline-panel{box-sizing:border-box;width:100%;grid-column:1/-1;padding:16px;border:1px solid #c7dce7;border-radius:14px;color:#173e50;background:#fff}.monitor-inline-panel header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.monitor-inline-panel h2{margin:0;font-size:1.2rem;overflow-wrap:anywhere}.monitor-inline-panel header button{flex:none}.monitor-inline-panel .fields{grid-template-columns:minmax(0,1fr)}
.monitor-wans>h3,.monitor-links>h3{font-size:1rem;margin:0 0 10px}.monitor-wan-icon{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.5;flex:none;color:#00749a}.monitor-graphs .monitor-graph-wan{background:#f5fbff;border-color:#b9d7e6;padding:12px}.monitor-graph-wan figcaption{font-size:1rem;min-height:28px;margin-bottom:10px}.monitor-link-arrow{color:#00749a;font-size:1.25em;line-height:1;flex:none}.monitor-links{margin-top:24px}.monitor-backup{font-size:.7rem;line-height:1.5;font-weight:500;background:#edf3fa;color:#456178;border-radius:20px;padding:2px 8px}
@media(max-width:1000px){.monitor-totals{grid-template-columns:repeat(2,minmax(0,1fr))}.monitor-sites{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){#network-health{padding:16px 12px}.monitor-header{gap:8px}.monitor-header h2{font-size:1.15rem}.monitor-header .secondary{max-width:130px;padding:7px 10px;font-size:.73rem;line-height:1.3}.monitor-totals{gap:8px}.monitor-totals>div{padding:7px 9px}.monitor-totals strong{font-size:1.15rem}.monitor-totals span{font-size:.75rem}.monitor-graphs,.monitor-problem-list{grid-template-columns:minmax(0,1fr)}.monitor-sites{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.monitor-site{padding:12px 10px}.monitor-site strong{font-size:.9rem}.monitor-graphs figure,.monitor-graphs .monitor-graph-wan{padding:10px}.monitor-graphs figcaption{font-size:.88rem}.monitor-graph-wan figcaption{font-size:.94rem}.monitor-links{margin-top:20px}}
@media(max-width:420px){.monitor-totals{grid-template-columns:minmax(0,1fr);gap:6px}.monitor-totals>div{padding:5px 10px}.monitor-totals strong{font-size:1.1rem}.monitor-totals span{font-size:.8rem}}
@media(prefers-reduced-motion:reduce){.monitor-site,.monitor-problem{transition:none}}
