.metric-card{
    position:relative;
    overflow:hidden;
    padding:20px;
    border-radius:24px;
    border:1px solid var(--stroke);
    background:
        linear-gradient(135deg, rgba(22,40,78,.42), rgba(16,28,54,.34) 55%, rgba(26,49,92,.22)),
        rgba(18,27,48,.38);
    box-shadow:var(--shadow-1);
}

.metric-card::before{
    content:"";
    position:absolute;
    inset:0 auto auto 0;
    width:100%;
    height:1px;
    background:linear-gradient(90deg, rgba(255,255,255,.28), transparent);
    pointer-events:none;
}

.metric-card.highlight{
    background:
        radial-gradient(320px 120px at 0% 0%, rgba(24,76,145,.18), transparent 58%),
        linear-gradient(135deg, rgba(52,120,199,.16), rgba(10,38,84,.18), rgba(255,255,255,.04));
    border-color:rgba(24,76,145,.18);
}

.metric-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:18px;
}

.metric-kicker{
    font-size:12px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:var(--text-soft);
}

.metric-card h3{
    margin:0 0 6px;
    font-size:clamp(28px, 2.2vw, 34px);
    line-height:1;
    letter-spacing:-.03em;
}

.metric-card p{
    margin:0;
    color:var(--text-soft);
    font-size:14px;
}

.panel{
    min-width:0;
    border:1px solid var(--stroke);
    border-radius:24px;
    background:
        linear-gradient(135deg, rgba(22,40,78,.42), rgba(16,28,54,.34) 55%, rgba(26,49,92,.22)),
        rgba(18,27,48,.38);
    box-shadow:var(--shadow-1);
    overflow:hidden;
}

.panel-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    padding:20px 20px 16px;
    border-bottom:1px solid rgba(255,255,255,.06);
}

.panel-head h2{ margin:0 0 4px; font-size:18px; line-height:1.1; letter-spacing:-.02em; }
.panel-head p{ margin:0; color:var(--text-soft); font-size:13px; }

.panel-actions,
.table-filters{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
}

.panel-head--center,
.pastores-panel-head,
.templos-panel-head,
.casos-panel-head,
.atenciones-panel-head,
.cierres-panel-head{ align-items:center; }

.mini-progress{
    margin-top:16px;
    height:10px;
    border-radius:999px;
    background:rgba(255,255,255,.08);
    overflow:hidden;
}

.mini-progress span{
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg, var(--brand-pink), var(--blue-2), var(--green-1));
}