@layer components{.dashboard-toolbar{justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.range-tabs{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);gap:2px;padding:3px;display:inline-flex}.range-tab{font-size:var(--fs-base);color:var(--text3);border-radius:4px;padding:6px 14px;font-weight:500;transition:all .12s}.range-tab:hover{color:var(--text)}.range-tab.active{background:var(--surface);color:var(--text);box-shadow:0 1px 2px #0000000d}.dashboard-actions{align-items:center;gap:6px;display:flex}.live-toggle{font-size:var(--fs-base);color:var(--text3);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);align-items:center;gap:6px;padding:7px 14px;font-weight:500;transition:all .12s;display:inline-flex}.live-toggle:hover{color:var(--text)}.live-toggle.on{color:var(--green);border-color:var(--green-bg);background:var(--green-bg)}.live-dot{background:var(--text3);border-radius:50%;width:6px;height:6px}.live-toggle.on .live-dot{background:var(--green);animation:1.5s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.3)}}.kpi-grid{grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:12px;display:grid}.kpi-grid .stat-card{flex-direction:column;gap:11px;padding:14px 16px;display:flex}.stat-head{justify-content:space-between;align-items:center;display:flex}.stat-title{font-size:var(--fs-base);color:var(--text3);text-transform:uppercase;letter-spacing:.5px;align-items:center;gap:7px;font-weight:600;display:flex}.stat-dot{border-radius:50%;width:6px;height:6px}.stat-dot.stat-info,.stat-info{background:var(--blue)}.stat-dot.stat-ok,.stat-ok{background:var(--green)}.stat-dot.stat-accent,.stat-accent{background:var(--accent)}.stat-dot.stat-warn,.stat-warn{background:#f59e0b}.stat-dot.stat-err,.stat-err{background:var(--red)}.stat-dot.stat-neutral,.stat-neutral{background:var(--text3)}.stat-body{flex-direction:column;gap:4px;display:flex}.num-xl{letter-spacing:-.5px;font-variant-numeric:tabular-nums;font-size:30px;font-weight:600;line-height:1}.stat-main-label{font-size:var(--fs-base);color:var(--text3)}.stat-progress{flex-direction:column;gap:8px;display:flex}.stat-progress-track{background:var(--surface2);border-radius:3px;height:3px;display:flex;overflow:hidden}.stat-progress-seg{height:100%;transition:width .4s cubic-bezier(.4,.8,.3,1)}.stat-progress-seg.stat-ok{background:var(--green)}.stat-progress-seg.stat-info{background:var(--blue)}.stat-progress-seg.stat-accent{background:var(--accent)}.stat-progress-seg.stat-warn{background:#f59e0b}.stat-progress-seg.stat-err{background:var(--red)}.stat-progress-seg.stat-neutral{background:var(--text3);opacity:.5}.stat-progress-legend{grid-template-columns:1fr 1fr;gap:4px 10px;display:grid}.stat-progress-leg{font-size:var(--fs-base);align-items:center;gap:5px;display:flex}.stat-progress-leg-label{color:var(--text3);flex:1}.stat-progress-leg-val{color:var(--text);font-variant-numeric:tabular-nums;font-weight:500}.stat-part-dot{border-radius:50%;flex-shrink:0;width:6px;height:6px}.charts-grid{grid-template-columns:2fr 3fr;gap:10px;margin-bottom:10px;display:grid}.chart-card{padding:14px 16px}.card-head{justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:10px;display:flex}.card-title{font-size:var(--fs-md);color:var(--text);align-items:center;gap:7px;font-weight:500;display:flex}.card-sub{font-size:var(--fs-base);color:var(--text3);margin-top:2px}.donut-wrap{flex-direction:row;justify-content:center;align-items:center;gap:18px;display:flex}.donut-wrap>:first-child{flex-shrink:0}.conn-legend{flex-direction:column;flex:1;gap:7px;min-width:0;max-width:240px;padding:0;display:flex}.conn-legend-row{font-size:var(--fs-base);grid-template-columns:8px 1fr auto auto;align-items:center;gap:10px;display:grid}.conn-legend-dot{border-radius:50%;width:8px;height:8px}.conn-legend-label{color:var(--text2)}.conn-legend-val{color:var(--text);font-variant-numeric:tabular-nums;font-weight:500}.conn-legend-pct{color:var(--text3);font-size:var(--fs-base);text-align:right;min-width:40px}.page-content:has(.act-card){flex-direction:column;display:flex}.act-card{flex-direction:column;flex:1;min-height:280px;padding:14px 16px;display:flex}.act-list{flex-direction:column;flex:1;min-height:0;display:flex;overflow-y:auto}.act-row{font-size:var(--fs-md);border-bottom:1px solid var(--border);cursor:pointer;grid-template-columns:8px 150px 150px 1fr 50px;align-items:center;gap:12px;padding:10px 0;transition:background .1s;display:grid}.act-row:hover{background:var(--surface2)}.act-row:last-child{border-bottom:none}.act-row.is-clickable{cursor:pointer;transition:background .1s}.act-row.is-clickable:hover{background:var(--accent-bg)}.act-sev{border-radius:50%;flex-shrink:0;width:7px;height:7px}.act-sev.sev-info{background:var(--blue)}.act-sev.sev-ok{background:var(--green)}.act-sev.sev-warn{background:#f59e0b}.act-sev.sev-err{background:var(--red)}.act-code{font-size:var(--fs-base);color:var(--text);white-space:nowrap;text-overflow:ellipsis;font-weight:500;overflow:hidden}.act-cp{font-family:var(--font-ibm-plex-mono,monospace);font-size:var(--fs-base);color:var(--text3);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.act-msg{color:var(--text2);white-space:nowrap;text-overflow:ellipsis;font-size:var(--fs-base);overflow:hidden}.act-ago{font-size:var(--fs-base);color:var(--text3);text-align:right;font-variant-numeric:tabular-nums}.live-badge{font-size:var(--fs-base);background:var(--surface2);color:var(--text3);text-transform:uppercase;letter-spacing:.5px;border-radius:99px;align-items:center;gap:5px;margin-left:8px;padding:2px 9px;font-weight:600;display:inline-flex}.live-badge.live-on{background:var(--green-bg);color:var(--green)}.live-pulse{background:currentColor;border-radius:50%;width:5px;height:5px}.live-badge.live-on .live-pulse{animation:1.5s ease-in-out infinite pulse}@media (max-width:1100px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.charts-grid{grid-template-columns:1fr}}@media (max-width:700px){.kpi-grid,.stat-progress-legend{grid-template-columns:1fr}}.chart-line-wrap{position:relative}.chart-line-overlay{background:color-mix(in srgb, var(--surface) 70%, transparent);-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);border-radius:var(--radius);justify-content:center;align-items:center;animation:.12s fade-in;display:flex;position:absolute;inset:0}@keyframes fade-in{0%{opacity:0}to{opacity:1}}}
