.pro-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.pro-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;box-shadow:var(--shadow)}
.pro-card h3{margin:0 0 10px}
.pro-actions{display:flex;gap:8px;flex-wrap:wrap}
.pro-pills{display:flex;gap:8px;flex-wrap:wrap}
.pro-pill{padding:6px 10px;border-radius:999px;background:#eef4fb;font-size:11px;font-weight:800;color:#345}
.pro-pill.ok{background:#eaf9f3;color:var(--ok)} .pro-pill.warn{background:#fff5df;color:#9a6200}.pro-pill.bad{background:#fff0f2;color:var(--bad)}
.pro-two{display:grid;grid-template-columns:1.2fr .8fr;gap:14px}
.pro-three{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.pro-form{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.pro-span2{grid-column:span 2}
.pro-note{font-size:12px;color:var(--muted);line-height:1.5}
.pro-table-wrap{overflow:auto}
.pro-table{min-width:760px}
.pro-section{margin-top:18px}
.pro-titleline{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:10px}
.pro-titleline h3{margin:0}
.pro-alert{padding:11px 13px;border-radius:10px;background:#eef6ff;color:#155aa5;font-size:12px}
.pro-danger{background:#fff1f2;color:#b33}
.pro-success{background:#ebfaf4;color:#087a53}
.pro-mutedbox{background:#f7f9fc;border:1px dashed var(--line);padding:14px;border-radius:12px}
.pro-total{font-weight:900;font-size:18px}
.pro-select-sm{padding:8px 10px;border:1px solid var(--line);border-radius:9px;background:white}
.pro-user{display:flex;align-items:center;gap:10px}
.pro-avatar{width:34px;height:34px;border-radius:50%;background:#eaf2fb;display:grid;place-items:center;font-weight:900;color:#2369b0}
.pro-notif{position:relative}.pro-dot{position:absolute;right:3px;top:3px;width:8px;height:8px;border-radius:50%;background:#e54}
.pro-metric small{display:block;color:var(--muted);font-size:11px;font-weight:700}.pro-metric strong{display:block;font-size:22px;margin-top:4px}
.pro-login-note{margin-top:16px;font-size:12px;color:var(--muted);line-height:1.5}
@media(max-width:1100px){.pro-kpis{grid-template-columns:repeat(2,1fr)}.pro-two,.pro-three{grid-template-columns:1fr}}
@media(max-width:650px){.pro-kpis,.pro-form{grid-template-columns:1fr}.pro-span2{grid-column:auto}}