body { display: flex; }
.last-update { font-size: 12px; color: var(--ink-3); }

.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 24px; }
.kpi { background: var(--bg-1); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; }
.kpi-value { font-size: 26px; font-weight: 700; color: var(--ink-0); line-height: 1; margin-bottom: 4px; font-variant-numeric: tabular-nums; }
.kpi-label { font-size: 11px; color: var(--ink-2); text-transform: uppercase; letter-spacing: 0.06em; }

.section-title { font-size: 12px; font-weight: 600; color: var(--ink-2); letter-spacing: 0.06em; text-transform: uppercase; margin-bottom: 12px; }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; margin-bottom: 8px; }

.ccard { background: var(--bg-1); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; display: flex; flex-direction: column; gap: 8px; }
.ccard.critical { border-left: 3px solid var(--red); }
.ccard.warning  { border-left: 3px solid var(--amber); }
.ccard.ok       { border-left: 3px solid var(--green); }
.ccard-header { display: flex; align-items: center; justify-content: space-between; }
.ccard-name { font-size: 14px; font-weight: 600; color: var(--ink-0); }
.ccard-meta { font-size: 12px; color: var(--ink-2); line-height: 1.6; }
.ccard-meta span { color: var(--ink-3); }
.ccard-actions { display: flex; gap: 6px; margin-top: 4px; }