:root{font-family:"DM Sans","Noto Sans SC",sans-serif;color:#243148;background:#f7f9fc}
body{margin:0;min-width:360px}
.global-header{position:sticky;top:0;z-index:10}
.global-nav-item:first-child{color:#526078;border-color:transparent;font-weight:400}
.global-nav-item.active{color:#2861e8;border-color:#3471f5;font-weight:600}
.global-logout{border:0;background:transparent;color:#7c8798;cursor:pointer;font:11px "Noto Sans SC",sans-serif;margin-left:12px}
.monitor-page{display:flex;flex-direction:column;width:100%;max-width:none;min-height:calc(100vh - 62px);margin:0;padding:12px 12px 12px}
.monitor-page>#monitorContent{display:flex;flex:1;flex-direction:column;min-height:0}
.monitor-section:has(.monitor-grid){display:flex;flex:1;flex-direction:column;min-height:0}
.monitor-grid{flex:1;align-content:stretch;grid-auto-rows:minmax(170px,1fr)}
.monitor-eyebrow{display:flex;align-items:center;gap:12px;color:#60779d;font-size:11px;font-weight:600;letter-spacing:.08em}
.monitor-eyebrow .pulse{width:8px;height:8px;background:#39ae87;border-radius:50%;box-shadow:0 0 0 4px #dff5eb}
.eyebrow-separator{color:#bdc7d7;margin:0 12px}
.monitor-heading{display:flex;justify-content:space-between;align-items:end;gap:12px;margin:12px 0 12px}
.monitor-heading h1{margin:0 0 12px;font-size:29px;letter-spacing:-.03em;font-weight:650}
.monitor-heading p{margin:0;color:#8290a4;font-size:12px}
.monitor-refresh{height:38px;padding:0 12px;background:#fff;color:#4164a5;border:1px solid #dce5f2;border-radius:9px;font:600 11px "Noto Sans SC",sans-serif;cursor:pointer;white-space:nowrap}
.monitor-refresh:disabled{opacity:.55;cursor:wait}
.monitor-loading,.monitor-error{padding:12px;background:#fff;border:1px solid #e4eaf2;border-radius:12px;color:#7d899a;font-size:12px}
.monitor-error{color:#bb625a}
.monitor-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:12px}
.monitor-metric{background:#fff;border:1px solid #e5eaf2;border-radius:13px;padding:12px 12px;min-height:108px}
.monitor-metric small{display:block;color:#8793a4;font-size:11px}
.monitor-metric b{display:block;font-size:28px;margin-top:12px;font-weight:650;line-height:1}
.monitor-metric em{font-style:normal;font-size:11px;color:#90a0b3;margin-left:12px;font-weight:400}
.monitor-metric.good b{color:#24a477}.monitor-metric.bad b{color:#d47568}
.monitor-section{margin-top:12px}
.monitor-section-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px}
.monitor-section-heading h2{margin:0;font-size:15px;font-weight:650}
.monitor-section-heading span{font-size:11px;color:#98a4b3}
.monitor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.monitor-project{background:#fff;border:1px solid #e5eaf2;border-radius:13px;padding:12px 12px;min-width:0}
.monitor-project-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.monitor-project-head a{font-size:13px;font-weight:650;color:#273a5a;text-decoration:none}
.monitor-project-head a:hover{color:#376ee6}
.monitor-badge{border-radius:100px;padding:12px 12px;font-size:10px;white-space:nowrap;background:#f1f3f7;color:#778398}
.monitor-badge.ok{color:#168b65;background:#e7f6ee}
.monitor-badge.down{color:#c56559;background:#fff0ed}
.monitor-service{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 0;border-top:1px solid #f0f2f6}
.monitor-service-name{font-size:11px;color:#3b4b64;font-weight:600;display:flex;align-items:center;gap:12px}
.monitor-dot{width:7px;height:7px;border-radius:50%;background:#a9b4c2;flex:0 0 7px}
.monitor-dot.ok{background:#2bb781}.monitor-dot.down{background:#e27b6d}
.monitor-service-url{display:block;margin:12px 0 0 12px;color:#a3aebd;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.monitor-service-right{text-align:right;font-size:11px;color:#5e6c82;white-space:nowrap}
.monitor-service-right small{display:block;color:#a3adba;font-size:10px;margin-top:12px}
.monitor-empty{padding:12px 0 12px;color:#9aa6b7;font-size:11px;line-height:1.7}
.monitor-events{background:#fff;border:1px solid #e5eaf2;border-radius:13px;overflow:hidden}
.monitor-event{display:flex;align-items:center;gap:12px;padding:12px 12px;border-bottom:1px solid #eef1f5;font-size:11px;color:#4e5c72}
.monitor-event:last-child{border-bottom:0}
.monitor-event b{font-weight:600;color:#293b57}
.monitor-event time{margin-left:auto;color:#9ca8b7;white-space:nowrap}
.monitor-footnote{color:#9aa6b6;font-size:10px;line-height:1.7;margin-top:12px}
@media(max-width:800px){.monitor-page{padding:12px 12px 12px}.monitor-summary,.monitor-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.global-brand{min-width:0}.global-brand small{display:none}}
@media(max-width:560px){.monitor-summary,.monitor-grid{grid-template-columns:1fr}.monitor-heading{align-items:start;flex-direction:column}.monitor-refresh{width:100%}.monitor-event{flex-wrap:wrap}.monitor-event time{margin-left:12px}.header-user [data-global-admin-name]{display:none}}