.operations{border-top:4px solid var(--accent);}.operations .metrics{margin-block:24px}.ops-chart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.ops-chart{padding:20px;border:1px solid var(--border);border-radius:14px;background:var(--panel)}.ops-chart h3{font-size:19px;margin:0 0 16px}.ops-chart svg{width:100%;height:auto;background:linear-gradient(var(--hover),transparent);border-bottom:1px solid var(--border);direction:ltr}.ops-chart p,.ops-chart small{font-size:15px;line-height:1.9}.operations select{min-width:180px}.operations>h3{margin-top:26px}@media(max-width:900px){.ops-chart-grid{grid-template-columns:1fr}}
.ops-traffic{margin-top:22px;padding:20px;border:1px solid var(--border);border-radius:14px;background:var(--panel)}.ops-traffic h3{margin:0 0 8px;font-size:19px}.ops-top-talkers{display:grid;gap:10px;margin:16px 0}.ops-talker{display:grid;grid-template-columns:minmax(150px,1fr) minmax(230px,1fr);gap:8px 18px;align-items:center;padding:12px 14px;border:1px solid var(--border);border-radius:10px;background:var(--hover)}.ops-talker-detail strong,.ops-talker-detail small{display:block}.ops-talker-detail small{margin-top:4px;color:var(--muted);direction:ltr;text-align:right}.ops-talker-sizes{display:flex;justify-content:flex-end;gap:14px;flex-wrap:wrap;font-size:13px}.ops-talker progress{grid-column:1/-1;width:100%;height:8px;accent-color:var(--accent)}.ops-traffic>button{margin-top:4px}@media(max-width:700px){.ops-talker{grid-template-columns:1fr}.ops-talker-sizes{justify-content:flex-start}.ops-talker progress{grid-column:auto}}
.ops-lines-panel{margin-top:22px;padding:20px;border:1px solid var(--border);border-radius:14px;background:var(--panel)}.ops-lines-panel h3{margin:0;font-size:19px}.ops-lines{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin-top:16px}.ops-line{--line-color:var(--accent);display:grid;grid-template-columns:1fr auto;gap:8px 12px;padding:16px;border:1px solid var(--border);border-inline-start:4px solid var(--line-color);border-radius:12px;background:var(--hover)}.ops-line>div{grid-column:1/-1;color:var(--line-color);font-size:18px;font-weight:700}.ops-line>strong{direction:ltr;text-align:left;font-size:16px}.ops-line>span{text-align:left;color:var(--muted)}.ops-line>small{color:var(--muted)}.ops-line>p{grid-column:1/-1;margin:4px 0 0;font-size:13px}
.operations{padding:clamp(18px,2.4vw,32px);overflow:hidden}.operations>.title{margin-bottom:12px}.ops-section-title{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:34px 0 14px;padding-bottom:12px;border-bottom:1px solid var(--border)}.ops-section-title h3{margin:0;font-size:18px}.ops-section-title p{margin:0;color:var(--muted);font-size:13px;max-width:650px}.ops-summary{display:flex;align-items:center;gap:10px;padding:10px 14px;border:1px solid var(--border);border-radius:10px;background:var(--hover)}.operations>.actions{align-items:center;flex-wrap:wrap}.operations>.actions select{min-width:160px;padding:10px 14px;border:1px solid var(--border);border-radius:9px;background:var(--panel);color:var(--text)}.ops-chart-grid{margin-top:10px}.ops-lines-panel{margin-top:28px}.ops-lines-panel>p{margin:6px 0 14px}.ops-lines-panel>button{margin-top:12px}.ops-line{min-height:160px;grid-template-columns:1fr auto;align-content:start;gap:6px 12px;padding:18px}.ops-line>div{font-size:17px}.ops-line>strong{font-size:18px}.ops-line>small{font-size:12px}.ops-line>span{padding:3px 9px;border-radius:99px;background:color-mix(in srgb,var(--line-color) 15%,transparent);color:var(--line-color);font-weight:600}.ops-line>p{padding-top:10px;border-top:1px solid var(--border);color:var(--muted)}.ops-traffic{margin-top:12px}.ops-alerts{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px}.ops-alert{display:flex;flex-direction:column;gap:5px;padding:14px 16px;border:1px solid var(--border);border-inline-start:4px solid var(--muted);border-radius:11px;background:var(--panel)}.ops-alert strong{font-size:14px}.ops-alert span{font-size:13px;color:var(--muted);line-height:1.7}.ops-alert.warning{border-inline-start-color:#e5a743}.ops-alert.warning strong{color:#e5a743}.ops-alert.danger{border-inline-start-color:#e76f7a}.ops-alert.danger strong{color:#e76f7a}.ops-alert.info{border-inline-start-color:#59a8e8}.ops-alert.info strong{color:#75baff}.ops-alert.good{border-inline-start-color:#47bb90}.ops-alert.good strong{color:#65d6a7}.ops-source-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--border)}.ops-source-row:last-of-type{border-bottom:0}.ops-status{font-size:12px;padding:5px 9px;border-radius:99px;background:var(--hover)}.ops-status.good{color:#49c28f}.ops-status.warning{color:#e5a743}.ops-status.offline{color:var(--muted)}.ops-dns-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--border)}.ops-dns-row strong{overflow-wrap:anywhere}.ops-dns-row span{font-size:12px;color:var(--muted)}.legacy-section{display:none!important}.operations .ops-availability>p{font-size:12px;color:var(--muted)}@media(max-width:760px){.ops-section-title{display:block;margin-top:26px}.ops-section-title p{margin-top:4px}.ops-talker{grid-template-columns:1fr}.ops-dns-row{grid-template-columns:1fr auto}.ops-dns-row strong{grid-column:1/-1}.ops-alerts{grid-template-columns:1fr}.ops-line{min-height:0}.operations .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(prefers-reduced-motion:reduce){.ops-alert,.ops-line{transition:none}}
.wan-live-panel{padding:clamp(10px,1vw,16px);overflow:hidden}.wan-live-panel>h2{font-size:clamp(22px,2vw,29px);margin:0 0 8px}.wan-live-panel>p{max-width:900px;color:var(--muted);line-height:1.8}.wan-live-controls{display:grid;grid-template-columns:minmax(180px,240px) auto minmax(0,1fr);gap:12px;align-items:center;margin:22px 0 20px}.wan-live-controls select{min-height:44px;padding:9px 14px;border:1px solid var(--border);border-radius:10px;background:var(--hover);color:var(--text)}.wan-live-controls button{min-height:44px;padding:9px 18px}.wan-live-info{min-width:0;margin:0;padding:10px 14px;border:1px solid var(--border);border-radius:10px;background:var(--hover);font-size:13px;line-height:1.6}.wan-live-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:stretch;width:100%;max-width:none;margin:0}.wan-live-card{--line-color:var(--accent);display:flex;min-width:0;flex-direction:column;min-height:360px;padding:16px 14px 14px;border:1px solid var(--border);border-top:3px solid var(--line-color);border-radius:16px;background:linear-gradient(145deg,var(--panel),color-mix(in srgb,var(--line-color) 7%,var(--panel)));box-shadow:0 8px 24px #00000012}.wan-live-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}.wan-24h-consumption{flex:1 0 100%;padding:7px 9px;border:1px solid color-mix(in srgb,var(--line-color) 35%,var(--border));border-radius:9px;background:color-mix(in srgb,var(--line-color) 9%,var(--panel));color:var(--text);font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;text-align:center;white-space:nowrap}.wan-live-heading>strong{font-size:19px;color:var(--line-color);direction:ltr}.wan-live-state{padding:5px 10px;border-radius:99px;background:color-mix(in srgb,#38c994 15%,transparent);color:#40d69c;font-size:12px;font-weight:700;white-space:nowrap}.wan-live-state.offline{background:color-mix(in srgb,#f06e7a 15%,transparent);color:#ff8790}.wan-live-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}.wan-live-stat{display:grid;min-width:0;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:3px 8px;min-height:88px;padding:11px;border:1px solid var(--border);border-radius:12px;background:var(--hover)}.wan-live-stat small{grid-column:1/-1;color:var(--muted);font-size:12px;line-height:1.5}.wan-live-stat strong{font-size:clamp(21px,1.35vw,28px);line-height:1.2;font-variant-numeric:tabular-nums;direction:ltr;text-align:left;white-space:nowrap}.wan-live-stat span{color:var(--muted);font-size:11px;white-space:nowrap}.wan-live-stat.receive strong{color:#55c9ed}.wan-live-stat.send strong{color:#48d6a0}.wan-live-chart{display:block;width:100%;height:auto;margin-top:12px;overflow:visible;direction:ltr}.wan-gridline{stroke:var(--border);stroke-width:1;stroke-dasharray:4 6}.wan-live-legend{display:flex;gap:14px;justify-content:center;margin:2px 0 10px;color:var(--muted);font-size:12px}.wan-live-legend span{display:flex;align-items:center;gap:7px}.wan-live-legend span:before{content:"";width:9px;height:9px;border-radius:50%;background:#55c9ed}.wan-live-legend span+span:before{background:#48d6a0}.wan-period-totals{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:auto;padding-top:10px;border-top:1px solid var(--border);color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}.wan-live-panel>button{margin-top:18px}
@media(min-width:1900px){.wan-live-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}@media(max-width:1400px){.wan-live-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:1050px){.wan-live-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.wan-live-card{min-height:0}}
@media(max-width:680px){.wan-live-panel{padding:10px}.wan-live-controls{grid-template-columns:1fr 1fr}.wan-live-info{grid-column:1/-1}.wan-live-grid{grid-template-columns:1fr;gap:10px}.wan-live-card{padding:14px}.wan-live-stats{gap:9px}.wan-live-stat{min-height:80px;padding:10px}.wan-live-stat strong{font-size:24px}.wan-live-stat small{font-size:12px}}

.switch-monitor{margin-block:24px;padding:clamp(14px,1.5vw,24px);border:1px solid var(--border);border-radius:16px;background:var(--panel)}.switch-monitor>h2{margin:0 0 8px}.switch-monitor-card{margin-top:18px;padding:clamp(14px,1.4vw,22px);border:1px solid var(--border);border-radius:14px;background:var(--surface,var(--hover))}.switch-monitor-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.switch-monitor-heading h3{margin:0}.switch-monitor .ops-chart{margin-top:12px;padding:12px}.switch-monitor .table-wrap{max-height:70vh;overflow:auto}.switch-monitor table{min-width:920px}.switch-monitor table th{position:sticky;top:0;z-index:1}

/* Compact operations overview while preserving chart labels and live values. */
.operations{width:min(calc(100% - 24px),1740px);margin:12px auto 24px;padding:clamp(14px,1.25vw,22px);border-top-width:3px;border-radius:14px}
.operations>h2{margin:0 0 10px;font-size:clamp(20px,1.35vw,25px)}
.operations>.actions{margin:8px 0;gap:8px}
.operations>.actions select,.operations>.actions button{min-height:38px;padding:7px 12px}
.operations>.ops-summary{margin:10px 0 12px;padding:8px 12px;font-size:12px;line-height:1.55}
.operations>.metrics{margin:12px 0 18px;gap:12px}
.operations>.metrics article{padding:14px 17px;border-radius:12px}
.operations>.metrics article strong{min-height:0;margin:8px 0;font-size:clamp(23px,1.55vw,30px)}
.operations>.metrics article small,.operations>.metrics article span{font-size:12px;line-height:1.55}
.operations .ops-section-title{margin:22px 0 10px;padding-bottom:8px}
.operations .ops-section-title h3{font-size:16px}
.operations .ops-section-title p{font-size:12px}
.operations .ops-chart-grid{gap:12px;margin-top:8px}
.operations .ops-chart{padding:14px;border-radius:12px}
.operations .ops-chart h3{margin-bottom:8px;font-size:16px}
.operations .ops-chart svg{height:clamp(150px,12vw,205px)}
.operations .ops-chart p{margin:8px 0 2px;font-size:12px;line-height:1.6}
.operations .ops-chart small{font-size:11px}
.operations .ops-lines-panel,.operations .ops-traffic{margin-top:14px;padding:16px;border-radius:12px}
.operations .ops-lines-panel h3,.operations .ops-traffic h3{font-size:16px}
.operations .ops-line{min-height:132px;padding:13px;gap:5px 10px}
.operations .ops-talker{padding:10px 12px}
@media(max-width:1100px){.operations{width:calc(100% - 16px);padding:14px}.operations>.metrics{gap:10px}.operations .ops-chart svg{height:180px}}
@media(max-width:760px){.operations{width:100%;margin:8px auto 16px;padding:12px}.operations>.metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.operations>.metrics article{padding:12px}.operations .ops-section-title{margin-top:20px}.operations .ops-chart{padding:12px}.operations .ops-chart svg{height:165px}}
.pbx-toolbar,.pbx-heading,.pbx-controls{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.65rem 1rem}
.pbx-toolbar{margin:.3rem 0 1.15rem}
.pbx-toolbar h2,.pbx-heading h3{margin:0}
.pbx-toolbar h2{font-size:1.2rem;line-height:1.45}
.pbx-controls{align-items:end}
.pbx-controls select{margin:0;width:auto;min-width:8rem;max-width:100%}
#pbx-notice:empty,#pbx-open-full{display:none}
.overview-embedded #pbx-open-full{display:inline-block}
.pbx-block{margin:0 0 1rem;padding:clamp(.8rem,2vw,1.3rem);border:1px solid var(--border);border-radius:14px}
.pbx-heading{margin-bottom:.8rem}
.pbx-heading small,.pbx-metric span{color:var(--muted)}
.pbx-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,9.5rem),1fr));gap:.65rem}
.pbx-metric{display:grid;align-content:space-between;gap:.3rem;padding:.65rem .85rem;border-radius:10px;background:var(--hover);border:1px solid var(--border)}
.pbx-metric strong{font-size:1.5rem;line-height:1.4;font-variant-numeric:tabular-nums}
.pbx-metric.pbx-good strong{color:var(--pbx-good)}
.pbx-metric.pbx-attention strong,.pbx-warning{color:var(--pbx-warning)}
:root[data-theme="dark"] #pbx-dashboard{--pbx-good:#55dcaf;--pbx-warning:#fbc272;--pbx-answered:#44c9a0;--pbx-other:#619cf4}
#pbx-dashboard{--pbx-good:#087557;--pbx-warning:#8e4c09;--pbx-answered:#139879;--pbx-other:#3779ca}
.pbx-live-layout{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:1rem}
.pbx-block h4{margin:1rem 0 .45rem;font-size:1rem}
.pbx-empty{margin:0;padding:.65rem .8rem;border:1px dashed var(--border);border-radius:8px}
.pbx-table table{min-width:0}
.pbx-table :is(td,th){padding:.45rem .6rem;white-space:nowrap}
.pbx-chart{padding:.2rem .65rem .65rem;border:1px solid var(--border);border-radius:10px}
.pbx-chart svg{display:block;width:100%;height:auto;max-height:210px;direction:ltr}
.pbx-chart text{fill:var(--muted);font-size:10px;font-family:inherit}
.pbx-gridline{stroke:var(--border);stroke-dasharray:4 3}
.pbx-bar-answered{fill:var(--pbx-answered)}
.pbx-bar-other{fill:var(--pbx-other)}
.pbx-legend{display:flex;justify-content:center;gap:1rem;font-size:.85rem}
.pbx-legend span::before{content:'';display:inline-block;width:.55rem;height:.55rem;border-radius:50%;margin-inline-end:.35rem;background:var(--pbx-answered)}
.pbx-legend span:nth-child(2)::before{background:var(--pbx-other)}
@media(max-width:1050px){.pbx-live-layout{grid-template-columns:minmax(0,1fr);gap:0}}

/* Common layout and status language across the monitoring pages. */
.device-card-grid,.device-metrics{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));
 gap:.65rem;
 min-width:0;
}
.device-card-grid{margin-block:1rem}
.device-card{
 display:flex;flex-direction:column;gap:.5rem;
 padding:clamp(.75rem,2vw,1.15rem);
 border:1px solid var(--border);border-radius:14px;
 background:var(--panel);min-width:0;overflow-wrap:anywhere;
}
.device-card :is(h3,p),.connection-section :is(h3,p){margin:0}
.device-card h3{font-size:1.05rem}
.device-card small{color:var(--muted)}
.device-card bdi{align-self:flex-start;font-variant-numeric:tabular-nums}
.device-card-top,.system-directory-states,.device-table-tools{
 display:flex;align-items:center;flex-wrap:wrap;gap:.45rem .7rem;
}
.device-card-top{justify-content:space-between}
.system-directory-card>button{align-self:flex-start;margin-block-start:auto;min-height:44px}
.system-directory-card>.system-directory-states:not(:empty){margin-block-end:.4rem}
.device-state{
 display:inline-block;border-radius:999px;padding:.12rem .6rem;
 background:var(--hover);color:var(--muted);
 font-size:.8rem;font-weight:700;line-height:1.9;white-space:nowrap;
}
.device-state--good{background:#e3f4eb;color:#165d40}
.device-state--bad{background:#fae9ec;color:#8b283c}
.device-state--wait{background:#fbf0d9;color:#754d14}
:root[data-theme="dark"] .device-state--good{background:#1d4238;color:#a0e7c9}
:root[data-theme="dark"] .device-state--bad{background:#532b37;color:#ffb6c4}
:root[data-theme="dark"] .device-state--wait{background:#4a3920;color:#ffdb97}
.device-metric{
 display:grid;gap:.15rem;padding:.5rem .75rem;min-width:0;
 border:1px solid var(--border);border-radius:10px;background:var(--hover);
}
.device-metric span{font-size:.82rem;color:var(--muted)}
.device-metric strong{font-size:1.12rem;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.device-metric [data-tone="good"]{color:var(--accent)}
.device-empty{
 grid-column:1/-1;padding:clamp(.8rem,2.5vw,1.4rem);
 border:1px dashed var(--border);border-radius:12px;background:var(--bg);
}
.device-empty p{margin:.2rem 0 0}
.device-table-tools{margin-block:.8rem .4rem}
.device-table-tools :is(input,select){width:auto;min-width:0;min-height:44px;margin:0}
.device-table-tools input{flex:1 1 14rem}
.device-table-tools small{margin-inline-start:auto;color:var(--muted)}
.device-table{margin-block-start:.5rem;max-width:100%}
.device-table td:nth-child(n+4){font-variant-numeric:tabular-nums;white-space:nowrap}
.switch-monitor{padding:0;border:0;margin-block:1.15rem}
.switch-monitor-card{margin-block-start:.75rem}
.switch-monitor-card>p{margin:.35rem 0 .65rem}
.switch-monitor-card .device-metrics{grid-template-columns:repeat(auto-fit,minmax(min(100%,9rem),1fr))}
.connection-section{margin-block:1.2rem;padding-block-start:1rem;border-top:1px solid var(--border)}
.connection-section .integration-guide{margin-block:.5rem;padding:.55rem .85rem}
.connection-section .integration-guide summary{font-size:1rem}
#mesh-setup-panel form{max-width:48rem;margin-block:.8rem}
#mesh-setup-panel label{display:block}
#mesh-setup-panel .actions input{max-width:20rem}
#agent-metrics,.mesh-device-metrics{margin-block:.75rem}
.pbx-controls :is(select,button),#pbx-call-filter{min-height:44px}
#pbx-call-filter{display:block;max-width:22rem}
@media(max-width:760px){
 .device-table-tools :is(input,select){flex:1 1 10rem;width:100%}
 .device-table-tools small{margin-inline-start:0}
 .device-card-grid,.device-metrics{gap:.45rem}
 .pbx-toolbar .pbx-controls{width:100%}
 .pbx-controls select{flex:1 1 9rem;min-width:0}
}
.monitoring-icon{width:1.15em;height:1.15em;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.overview-devices{border-block-start:3px solid var(--accent);padding-block:clamp(.85rem,1.4vw,1.25rem)}
.overview-devices>h2,.overview-devices>p{margin-block:.15rem .5rem}
.overview-devices>.device-metrics{margin-block:.7rem;gap:.5rem}
.overview-devices>.device-metrics>.device-metric{padding:.35rem .65rem;gap:.05rem;line-height:1.5}
.overview-system-cards{margin-block:.6rem;gap:.5rem}
.overview-system-cards>.device-card{padding:.6rem .75rem;gap:.3rem;line-height:1.55}
.overview-system-cards>.device-card small{line-height:1.45}
.overview-system-cards>.device-card button{padding:.3rem .7rem;margin-block-start:auto}
.instant-on-summary{margin-block:.65rem;padding:.8rem;border:1px solid var(--border);border-radius:.75rem}
.instant-on-head,.instant-on-actions,.instant-on-head h3,.instant-on-metrics .device-metric>span{
 display:flex;align-items:center;flex-wrap:wrap;gap:.45rem
}
.instant-on-head{justify-content:space-between;gap:.6rem}
.instant-on-head h3{margin:0;font-size:1rem}
.instant-on-head h3 small{color:var(--muted);font-weight:500}
.instant-on-head .monitoring-icon,.instant-on-metrics .monitoring-icon{color:var(--accent)}
.instant-on-actions button{padding:.25rem .65rem;min-height:36px}
.instant-on-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr));gap:.45rem;margin-block-start:.65rem}
.instant-on-metrics[hidden],.instant-on-note[hidden]{display:none}
.instant-on-metrics .device-metric{padding:.45rem .65rem;gap:.2rem;line-height:1.5}
.instant-on-metrics .device-metric>strong{font-size:1.25rem;font-variant-numeric:tabular-nums}
.instant-on-note{margin:.5rem 0 0;font-size:.82rem}
.smart-life-panel [hidden]{display:none}
.smart-life-head,.smart-life-head h2,.smart-life-panel .device-card-top h3{
 display:flex;align-items:center;gap:.55rem
}
.smart-life-head{justify-content:space-between;flex-wrap:wrap;margin-block-end:.65rem}
.smart-life-head h2{margin:0}
.smart-life-panel .monitoring-icon{color:var(--accent)}
.smart-life-panel details{margin-block:1rem}
.smart-life-panel details form{margin-block:.75rem}
.smart-life-channels{margin:0;padding:0;list-style:none}
.smart-life-channels li{
 display:flex;flex-wrap:wrap;align-items:center;gap:.45rem .65rem;
 min-height:2.8rem;border-block-start:1px solid var(--border);padding-block:.35rem
}
.smart-life-channels button{margin-inline-start:auto}
.agent-detail-dialog{width:min(1100px,94vw);max-height:90vh;overflow:auto}
.agent-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin-block:1rem}
.agent-alerts{display:flex;flex-wrap:wrap;gap:.4rem;margin-block:.7rem}
.agent-alerts p{margin:0;padding:.3rem .6rem;border:1px solid var(--border);border-radius:.5rem;font-size:.85rem}
#agents-table small,#agents-table td>span,#agent-jobs small{display:block}
#agent-jobs{padding-inline-start:1.2rem}
#agent-jobs li{margin-block:.5rem}
.agent-schedules{margin-block:1rem}
.agent-schedules[hidden]{display:none}
.agent-schedules form,.agent-schedules .device-card{margin-block:.6rem}
@media(max-width:700px){.agent-charts{grid-template-columns:minmax(0,1fr)}}
.overview-devices{
 --overview-connected-bg:#effaf4;
 --overview-connected-border:#3e9b72;
 --overview-connected-text:#176348;
}
:root[data-theme="dark"] .overview-devices{
 --overview-connected-bg:#182f2b;
 --overview-connected-border:#50b68a;
 --overview-connected-text:#a0e7c9;
}
.overview-devices .overview-connected{
 background:var(--overview-connected-bg);border-color:var(--overview-connected-border);
 box-shadow:inset 0 3px var(--overview-connected-border);
}
.overview-devices .overview-connected h3 .monitoring-icon{color:var(--overview-connected-text)}
.overview-card-statuses{display:flex;flex-wrap:wrap;gap:.35rem}
.overview-card-statuses .device-state{display:inline-flex;align-items:center;gap:.3rem}
.overview-detail-slot{min-width:0}
.overview-embedded :is(#unifi-status,#cisco-status,#aruba-status,#ruijie-status,#agent-status,#agent-metrics,#agent-job,#agent-jobs,#agent-job+ p){display:none}
.overview-embedded section:has(+ #unifi-status) .device-table-tools>select:first-child{display:none}
.overview-router-only :is(.ops-cross-system,.ops-dns-top,.ops-traffic:has(.ops-dns-top)){display:none}
.overview-tabs{
 display:flex;align-items:stretch;gap:.4rem;overflow:auto;
 padding:.3rem .25rem .55rem;margin-block:.7rem;scrollbar-width:thin;
}
.overview-tabs button{
 flex:0 0 auto;display:inline-flex;align-items:center;gap:.4rem;
 margin:0;min-height:44px;max-width:min(78vw,20rem);white-space:nowrap;
}
.overview-tabs button span{overflow:hidden;text-overflow:ellipsis}
.overview-tabs button[aria-selected="true"]{border-color:var(--accent);background:var(--active);color:var(--accent)}
.overview-tabs button small{padding:0 .38rem;border-radius:999px;background:var(--panel);font-variant-numeric:tabular-nums}
.overview-system-cards h3,.pbx-metric-label{display:flex;align-items:center;gap:.45rem}
.overview-system-cards .monitoring-icon,.pbx-metric-label .monitoring-icon{color:var(--accent)}
.overview-system-cards button{align-self:flex-start;min-height:44px}
.overview-group-content{display:grid;gap:.6rem;min-width:0}
.overview-group-content .overview-tabs{margin-block:0}
.overview-portal-links a{display:inline-flex;align-items:center;min-height:44px}
.pbx-metric-label .monitoring-icon{width:1.5rem;height:1.5rem;padding:.2rem;border-radius:.35rem;background:var(--panel)}
.pbx-metric.pbx-good .monitoring-icon{color:var(--pbx-good)}
.pbx-metric.pbx-attention .monitoring-icon{color:var(--pbx-warning)}
.pbx-block .pbx-chart{margin-block-start:.85rem}
.pbx-table :is(td,th){text-align:start}
.pbx-table bdi{font-variant-numeric:tabular-nums}
@media(max-width:600px){.overview-devices{padding:.75rem}.overview-devices>.device-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.overview-tabs button{min-height:44px}}

/* Shared spacing for the signed-in workspace. */
.signed-in{--workspace-gap:clamp(.55rem,1vw,.95rem);--panel-padding:clamp(.7rem,1.2vw,1.15rem)}
.signed-in .workspace{width:100%;max-width:none;margin:0;padding:var(--workspace-gap)}
.workspace>.title{gap:.45rem 1rem;margin:0 0 var(--workspace-gap);padding-bottom:.55rem;align-items:center}
.workspace>.title>div{
 display:flex;align-items:baseline;flex-wrap:wrap;gap:.2rem 1rem;
 padding-top:.8rem;min-width:0;
}
.workspace>.title h1{font-size:clamp(1.25rem,1.7vw,1.55rem);line-height:1.45}
.workspace>.title #updated{margin:0;font-size:.82rem;line-height:1.5}
.workspace :is(.panel,.operations){margin-block:0 var(--workspace-gap);padding:var(--panel-padding);border-radius:12px}
.workspace .operations{width:100%;max-width:none;margin-inline:0}
.workspace .panel>h2,.workspace .panel>.title h2{margin-block:0 .45rem;font-size:1.25rem;line-height:1.45}
.workspace .panel>p{margin-block:.4rem .65rem}
.workspace .panel>.title{margin-block-end:.65rem}
.workspace .panel>.title p{margin:0}
.workspace .panel hr{margin-block:.8rem}
.workspace :is(.system-grid,.metrics,.device-card-grid,.ops-chart-grid){gap:.55rem}
.workspace .system-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,11rem),1fr))}
.workspace :is(.system-card,.device-card,.switch-monitor-card,.pbx-block){padding:.65rem .8rem;border-radius:10px}
.workspace .metrics{margin-block:.6rem .8rem}
.workspace .metrics article{min-width:0;padding:.65rem .85rem}
.workspace .metrics strong{min-height:0;margin-block:.25rem;font-size:1.45rem;line-height:1.4}
.workspace .metrics :is(span,small){font-size:.83rem}
.workspace .form-grid{gap:.65rem .85rem;margin-block:.65rem}
.workspace .connection-section{margin-block:.75rem;padding-block-start:.65rem}
.workspace .table-wrap{margin-block-start:.6rem}
.workspace :is(td,th){padding:.4rem .65rem}
.workspace td{line-height:1.5}
.workspace .ops-section-title{margin-block:1rem .45rem}
.workspace .ops-chart{padding:.65rem .75rem}
.workspace .ops-chart svg{height:clamp(120px,10vw,175px)}
.workspace .pbx-toolbar{margin-block:0 .65rem;gap:.5rem 1rem}
.workspace .pbx-controls{justify-content:flex-start;gap:.45rem}
.workspace .pbx-controls :is(select,button){padding:.35rem .65rem}
.workspace .pbx-heading{margin-block-end:.45rem}
.workspace .pbx-metric{padding:.4rem .65rem;gap:.15rem}
.workspace .pbx-block h4{margin-block:.6rem .35rem}
.workspace .wan-live-controls{margin-block:.65rem;gap:.55rem}
.workspace .wan-live-card{min-height:0;padding:.65rem}
.workspace .wan-live-stat{min-height:4rem;padding:.45rem .5rem}
.workspace .wan-live-chart{max-height:125px;margin-block-start:.55rem}
.workspace .wan-24h-consumption{white-space:normal}

.overview-devices .overview-tabs{
 flex-wrap:wrap;gap:.3rem;padding:.15rem;margin-block:.45rem;
}
.overview-devices .overview-tabs button{min-height:36px;padding:.25rem .55rem}
.overview-devices{container-type:inline-size}
.overview-devices>.overview-tabs{
 display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-block:.45rem 0;
}
.overview-devices>.overview-tabs button{
 max-width:none;min-width:0;justify-content:flex-start;text-align:start;white-space:normal;line-height:1.4;
}
.overview-devices>.overview-tabs button span{overflow-wrap:anywhere}
.overview-devices>.overview-tabs button small{flex:none;margin-inline-start:auto}
@container (min-width:35rem){
 .overview-devices>.overview-tabs{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@container (min-width:56rem){
 .overview-devices>.overview-tabs{grid-template-columns:repeat(6,minmax(0,1fr))}
}
.overview-devices>.device-metrics{
 grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr));
 margin-block:.55rem;
}
.overview-devices .overview-system-cards{
 grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr));margin-block:.45rem;
}
.overview-group-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;min-width:0}
.overview-group-toolbar .overview-tabs{flex:1;min-width:0}
.overview-group-toolbar>button{margin-inline-start:auto}
.device-card-identity{display:flex;align-items:baseline;flex-wrap:wrap;gap:.15rem .75rem;min-width:0}
#overview-device-panel>.device-card{gap:.45rem}
#overview-device-panel>.device-card>button{justify-self:start;align-self:center;width:fit-content}
#overview-device-panel .device-metrics{grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr));gap:.35rem}
#overview-device-panel .device-metric{padding:.3rem .55rem}
#overview-device-panel .device-metric strong{font-size:1rem}
@media(min-width:1150px){
 #overview-device-panel>.device-card:has(>.device-metrics){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);align-items:center}
 #overview-device-panel>.device-card:has(>.device-metrics)>:not(.device-card-top,.device-metrics,button){grid-column:1/-1}
 #overview-device-panel>.device-card:has(>.device-metrics)>button{grid-column:1/-1;justify-self:end}
}
@media(min-width:781px){
 .signed-in #dashboard{grid-template-columns:clamp(205px,17vw,245px) minmax(0,1fr)}
 .signed-in .sidebar{padding:14px 10px}
 .sidebar .school-mark{padding-block-end:14px}
 .sidebar .sidebar-note{margin-block-start:.55rem;padding:.3rem}
 .sidebar nav{gap:4px}
 .sidebar .nav-group summary,.sidebar nav>button,.sidebar .nav-branches button{min-height:38px;padding:.38rem .6rem;font-size:.9rem}
}
@media(max-width:760px){
 .overview-devices>.device-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
 .overview-devices .overview-tabs button{min-height:44px}
 .overview-group-toolbar .overview-tabs{flex-basis:100%}
 .workspace .table-wrap{overflow-x:auto}
}
.mikro-summary{display:grid;gap:.85rem;margin-block-start:.85rem;padding:clamp(.85rem,2vw,1.35rem);border:1px solid var(--border);border-radius:14px;background:var(--panel)}
.mikro-summary-heading{display:flex;justify-content:space-between;align-items:center;gap:.75rem}
.mikro-summary-heading h3,.mikro-summary-heading p,.mikro-summary-status{margin:0}
.mikro-summary-heading p,.mikro-summary-status{color:var(--muted);font-size:.85rem}
.mikro-summary-metrics{grid-template-columns:repeat(auto-fit,minmax(min(100%,11rem),1fr))}
.mikro-summary-metrics .device-metric{min-width:0;border-inline-start:3px solid var(--summary-tone)}
.mikro-summary-metrics strong{font-variant-numeric:tabular-nums;unicode-bidi:isolate;direction:ltr}
.mikro-summary-metrics small{color:var(--muted);line-height:1.45}
.mikro-summary-clients{--summary-tone:#18a78e}
.mikro-summary-download{--summary-tone:#318bd9}
.mikro-summary-upload{--summary-tone:#9871de}
.mikro-summary-total{--summary-tone:#e0a343}
.mikro-summary-breakdown{display:flex;overflow:hidden;height:7px;border-radius:999px;background:var(--border)}
.mikro-summary-breakdown .download{background:#318bd9}
.mikro-summary-breakdown .upload{background:#9871de}
.android-command-form{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:14px 0}
.android-command-form>[role="status"]{grid-column:1/-1;margin:0}
.android-command-form textarea{min-height:76px}
@media(max-width:800px){.android-command-form{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.android-command-form{grid-template-columns:1fr}}
