/* metricas.css — panel de Métricas (solo admin). Mobile-first, branding Imagilang. */
.mt-wrap{width:100%;margin:12px auto 32px;display:grid;grid-template-columns:minmax(0,1fr);gap:14px;padding-inline:4px;align-items:start}
/* escritorio: usa todo el ancho entre el menú y el rail (que sigue visible) */
main>#v-metricas{max-width:1180px;container:mt/inline-size}
.mt-nota{color:var(--text2);font-weight:600;font-size:.86rem;text-align:center}
.mt-card{background:var(--surface);border-radius:20px;padding:18px 16px;box-shadow:var(--shadow);min-width:0;container:mtc/inline-size}
.mt-card h2{font-size:1.05rem;color:var(--deep);margin-bottom:12px}
.mt-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:10px}
.mt-ancha .mt-kpis{grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
.mt-kpi{background:var(--bg);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:2px}
.mt-kpi b{font-size:1.6rem;color:var(--deep);line-height:1.1}
.mt-kpi small{font-size:.8rem;font-weight:700;color:var(--text)}
.mt-kpi em{font-style:normal;font-size:.75rem;font-weight:600;color:var(--text2)}
.mt-embudo{list-style:none;display:flex;flex-direction:column;gap:10px}
.mt-embudo li{display:grid;grid-template-columns:1fr auto;grid-template-areas:"et n" "barra barra" "sub sub";gap:4px 10px;align-items:center}
.mt-et{grid-area:et;font-weight:700;color:var(--text);font-size:.9rem}
.mt-embudo b{grid-area:n;color:var(--deep);font-size:1.1rem}
.mt-barra{grid-area:barra;height:12px;border-radius:99px;background:#EDE9FE;overflow:hidden}
.mt-barra i{display:block;height:100%;background:var(--purple);border-radius:99px}
.mt-embudo small{grid-area:sub;font-size:.75rem;font-weight:600;color:var(--text2)}
.mt-tabla{overflow-x:auto;-webkit-overflow-scrolling:touch}
.mt-tabla table{width:100%;border-collapse:collapse;font-size:.88rem;min-width:420px}
.mt-tabla th{text-align:left;color:var(--text2);font-weight:800;font-size:.76rem;text-transform:uppercase;letter-spacing:.04em;padding:8px 6px;border-bottom:1px solid var(--border)}
.mt-tabla td{padding:9px 6px;border-bottom:1px solid var(--border);color:var(--text)}
.mt-btn{margin:0 auto;justify-self:center}
@container mtc (min-width:460px){ .mt-embudo li{grid-template-columns:minmax(120px,190px) 1fr 50px;grid-template-areas:"et barra n" ". sub sub"} }
.mt-trafico{text-decoration:none;width:auto;max-width:100%;padding-inline:22px;text-align:center}
@container mt (min-width:420px){ .mt-trafico{white-space:nowrap} }
/* Altas recientes (correos) — móvil: tarjetas apiladas; ≥768px: tabla en rejilla */
.mt-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;margin-bottom:12px}
.mt-head h2{margin:0}
.mt-copiar{min-height:44px;margin:0;width:auto;display:inline-flex;font-size:.88rem;padding:8px 16px;white-space:nowrap}
.mt-altas,.mt-sinalta{list-style:none;display:flex;flex-direction:column;gap:10px}
.mt-alta{background:var(--bg);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:6px;font-size:.88rem;color:var(--text);min-width:0}
.mt-alta>span{display:flex;justify-content:space-between;gap:10px;min-width:0}
.mt-alta>span::before{content:attr(data-l);color:var(--text2);font-weight:700;font-size:.76rem;flex-shrink:0}
.mt-a-email{font-weight:700}
.mt-alta a{min-width:0;text-align:right}
.mt-alta a,.mt-sinalta a{color:var(--purple);font-weight:700;overflow-wrap:anywhere;min-height:44px;display:inline-flex;align-items:center}
.mt-alta a:focus-visible,.mt-sinalta a:focus-visible,.mt-copiar:focus-visible{outline:3px solid var(--purple-light);outline-offset:2px;border-radius:6px}
.mt-cab{display:none}
.mt-sin{color:var(--text2);font-style:italic}
.mt-chip{font-style:normal;font-weight:800;font-size:.75rem;padding:3px 10px;border-radius:99px;white-space:nowrap}
.mt-chip.e0{background:var(--border);color:var(--text)}
.mt-chip.e1{background:#EDE9FE;color:var(--deep)}
.mt-chip.e2{background:var(--amber-bg);color:var(--amber)}
.mt-chip.e3{background:#FDECEC;color:#B91C1C}
.mt-chip.e4{background:var(--green-bg);color:var(--green)}
.mt-h3{font-size:.95rem;color:var(--deep);margin:18px 0 8px}
.mt-sinalta li{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:4px 10px;padding:4px 12px;background:var(--bg);border-radius:12px;min-width:0}
.mt-sinalta small{color:var(--text2);font-weight:600;font-size:.78rem}
/* ≥700px de columna real: tabla en rejilla, correo en una línea (elipsis + title) */
@container mt (min-width:700px){
  .mt-altas{gap:0}
  .mt-alta{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(58px,.6fr) minmax(132px,1.2fr) minmax(108px,1fr) minmax(36px,.5fr);align-items:center;gap:10px;background:none;border-radius:0;border-bottom:1px solid var(--border);padding:4px 6px}
  .mt-alta>span{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mt-alta>span::before{content:none}
  .mt-alta a{display:block;min-height:44px;line-height:44px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;overflow-wrap:normal;text-align:left}
  .mt-a-fecha{font-variant-numeric:tabular-nums}
  .mt-cab{display:grid;color:var(--text2);font-weight:800;font-size:.76rem;text-transform:uppercase;letter-spacing:.04em;padding:8px 6px}
}
/* columna ancha: secciones de KPIs por parejas (Embudo+Japonés, Actividad+Suscripciones) */
@container mt (min-width:780px){
  .mt-wrap{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mt-wrap>.mt-ancha,.mt-wrap>.mt-btn,.mt-wrap>.mt-nota{grid-column:1/-1}
  .mt-wrap>.mt-card{height:100%}
}