/* 系统监控页（workspace-monitor.js）的样式，全部限定在 .ops-board 内，不影响管理站其他页面；由 monitor.css 加前缀生成。 */
.ops-board{--bg:#f3f5f8;--ink:#1e293b;--muted:#64748b;--line:#e8edf3;--green:#16815d;--amber:#a96008;--red:#cc3745;--blue:#365bd7}
.ops-board,.ops-board *{box-sizing:border-box}
.ops-board{margin:0;background:var(--bg);color:var(--ink);font:14px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif}
.ops-board main{max-width:1360px;margin:auto;padding:32px 32px 24px}
.ops-board header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}
.ops-board .brand{color:var(--muted);font-size:12px;letter-spacing:2px}
.ops-board .title{font-size:26px;letter-spacing:-.8px;margin:3px 0 0;font-weight:650}
.ops-board .live{text-align:right;font-size:12px;color:var(--muted)}
.ops-board .live b{color:var(--ink);font-variant-numeric:tabular-nums;font-weight:600}
.ops-board button{font:inherit;background:white;color:var(--ink);border:1px solid #d6dee9;border-radius:8px;padding:7px 13px;cursor:pointer}
.ops-board button:hover{border-color:var(--blue)}
.ops-board .headtools{display:flex;align-items:center;gap:16px}
.ops-board .banner{border:1px solid #c5dfd4;background:#eaf5ef;border-radius:14px;padding:19px 24px;margin-bottom:20px;display:flex;justify-content:space-between;gap:20px;align-items:center}
.ops-board .banner.warn{border-color:#e9d8b5;background:#fff7e8}
.ops-board .banner.error,.ops-board .banner.offline{border-color:#ebbdc3;background:#fff0f1}
.ops-board .banner h2{font-size:20px;margin:0 0 2px;font-weight:650}
.ops-board .banner p{margin:0;color:#53665c;font-size:13px}
.ops-board .banner.warn p{color:#886021}
.ops-board .banner.error p,.ops-board .banner.offline p{color:#a83c46}
.ops-board .statusdot{width:9px;height:9px;border-radius:50%;display:inline-block;background:currentColor;margin-right:7px}
.ops-board .ok{color:var(--green)}
.ops-board .warn{color:var(--amber)}
.ops-board .error{color:var(--red)}
.ops-board .muted{color:var(--muted)}
.ops-board .badge{font-size:11px;padding:3px 9px;border-radius:6px;background:#f1f5f9;white-space:nowrap}
.ops-board .badge.ok{background:#eaf6ef}
.ops-board .badge.warn{background:#fff3dd}
.ops-board .badge.error{background:#ffebed}
.ops-board .grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}
.ops-board .card{border:1px solid var(--line);background:white;border-radius:14px;padding:22px;min-width:0}
.ops-board .span4{grid-column:span 4}
.ops-board .span6{grid-column:span 6}
.ops-board .span8{grid-column:span 8}
.ops-board .span12{grid-column:span 12}
.ops-board h3{font-size:14px;font-weight:600;margin:0 0 16px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.ops-board .big{font-size:54px;line-height:1.12;letter-spacing:-2px;font-weight:650;font-variant-numeric:tabular-nums}
.ops-board .big small{font-size:15px;color:var(--muted);letter-spacing:0;margin-left:7px;font-weight:400}
.ops-board .note{font-size:11px;color:var(--muted);margin-top:12px;line-height:1.7}
.ops-board .metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ops-board .metric{background:#f7f8fb;border-radius:10px;padding:14px}
.ops-board .metric .label{font-size:12px;color:var(--muted)}
.ops-board .metric .value{font-size:30px;line-height:1.4;font-weight:630;letter-spacing:-1px;font-variant-numeric:tabular-nums}
.ops-board .metric .value small{font-size:11px;font-weight:400;letter-spacing:0;color:var(--muted);margin-left:4px}
.ops-board .row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:10px 0;border-top:1px solid var(--line)}
.ops-board .row .r{font-variant-numeric:tabular-nums;font-weight:600;white-space:nowrap}
.ops-board .row small{color:var(--muted);font-size:11px;font-weight:400}
.ops-board .servicegrid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.ops-board .service{padding:13px 14px;border:1px solid var(--line);border-radius:9px}
.ops-board .service b{display:block;margin-bottom:5px;font-size:13px;font-weight:600}
.ops-board .service small{display:block;color:var(--muted);font-size:11px;margin-top:3px}
.ops-board .gauges{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.ops-board .gauge .value{font-size:29px;font-weight:600;margin:8px 0}
.ops-board .track{background:#edf1f7;height:6px;border-radius:5px;overflow:hidden}
.ops-board .fill{height:100%;background:currentColor;transition:width .4s}
.ops-board .gauge small{display:block;color:var(--muted);font-size:11px;margin-top:10px}
.ops-board .gauge label{color:var(--muted);font-size:12px}
.ops-board .bars{display:flex;align-items:flex-end;gap:15px;height:132px}
.ops-board .bar{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
.ops-board .bar i{display:block;background:#d6e0f6;width:min(36px,75%);border-radius:5px 5px 0 0;min-height:2px}
.ops-board .bar:last-child i{background:var(--blue)}
.ops-board .bar b{font-size:11px;color:var(--muted);font-weight:500}
.ops-board .bar small{font-size:10px;color:var(--muted);margin-top:6px}
.ops-board .alert{border-radius:8px;padding:11px 14px;margin:8px 0;background:#fff7e8;border-left:3px solid #d49639}
.ops-board .alert.error{background:#fff0f1;border-color:var(--red)}
.ops-board .alert small{display:block;font-size:11px;color:var(--muted);margin-top:2px}
.ops-board .history{max-height:230px;overflow:auto}
.ops-board .event{display:flex;gap:14px;padding:9px 0;border-top:1px solid var(--line);font-size:12px}
.ops-board .event time{color:var(--muted);min-width:84px;font-variant-numeric:tabular-nums}
.ops-board .event .badge{height:25px}
.ops-board .event p{margin:0}
.ops-board .alerthead{display:flex;align-items:center;justify-content:space-between}
.ops-board .alerthead h3{margin:0}
.ops-board .alerthead button{font-size:11px;padding:4px 9px}
.ops-board footer{text-align:center;font-size:11px;color:var(--muted);margin-top:22px}
.ops-board details{margin-top:10px;color:var(--muted);font-size:12px}
.ops-board summary{cursor:pointer}
.ops-board .empty{color:var(--muted);font-size:12px;padding:12px 0}
.ops-board .stale{border-color:#e9d8b5}
.ops-board .stale-note{font-size:12px;color:var(--amber);margin-bottom:10px}
.ops-board .toast{position:fixed;right:24px;bottom:24px;max-width:400px;z-index:10;border-radius:10px;box-shadow:0 8px 35px #23344c22;background:#243348;color:white;padding:15px 20px;display:none}
.ops-board .sources{display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:12px}
.ops-board .sources span{font-size:11px;color:var(--muted)}
@media(max-width:1000px){.ops-board .span4,.ops-board .span8{grid-column:span 6}
.ops-board .servicegrid{grid-template-columns:repeat(3,1fr)}
.ops-board .metrics{grid-template-columns:repeat(2,1fr)}
.ops-board .gauges{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.ops-board main{padding:20px 14px}
.ops-board .title{font-size:21px}
.ops-board header{align-items:flex-start}
.ops-board .headtools{flex-direction:column;gap:6px;align-items:flex-end}
.ops-board .live{font-size:10px}
.ops-board .headtools button{font-size:11px;padding:4px 8px}
.ops-board .banner{padding:15px;display:block}
.ops-board .banner h2{font-size:18px}
.ops-board .banner .badge{display:inline-block;margin-top:8px}
.ops-board .span4,.ops-board .span6,.ops-board .span8,.ops-board .span12{grid-column:span 12}
.ops-board .grid{gap:12px}
.ops-board .card{padding:18px}
.ops-board .servicegrid{grid-template-columns:repeat(2,1fr)}
.ops-board .service:last-child{grid-column:span 2}
.ops-board .toast{left:14px;right:14px;bottom:15px}
.ops-board .event{gap:8px}
.ops-board .event time{min-width:65px;font-size:10px}}
.ops-board .muted.subtle{font-size:11px;font-weight:400}
.ops-board .sources.centered{justify-content:center}
.ops-board .metrics.three{grid-template-columns:repeat(3,1fr)}
.ops-board .back{display:inline-block;margin-bottom:6px;color:var(--muted);font-size:13px;text-decoration:none}
.ops-board .back:hover{color:var(--ink);text-decoration:underline}
/* 嵌在管理站页面里：沿用管理站的页面底色和边距 */
.ops-board{background:transparent;margin:0}
.ops-board main{max-width:none;margin:0;padding:0}