/* Cuatro fondos independientes, composición de la referencia del usuario. */
main>.metrics{gap:12px}
main>.metrics>.metric{--metric-accent:#79c9ed;--metric-image:url('assets/clientes-activos-v198.png');position:relative;min-height:164px;aspect-ratio:2.1;padding:20px;border:1px solid #5289ba;border-radius:12px;background:linear-gradient(90deg,#06132738,#06132708),var(--metric-image) center/cover no-repeat;box-shadow:inset 0 1px #b6deff22,0 3px 14px #0003}
main>.metrics>.metric.debt{--metric-accent:#e9c55f;--metric-image:url('assets/clientes-deuda-v198.png');border-color:#81744b;background-position:center}
main>.metrics>.metric.subscriber{--metric-accent:#ab79ee;--metric-image:url('assets/clientes-abonados-v198.png');border-color:#7656ba;background-position:center}
main>.metrics>.metric.favor{--metric-accent:#98dfa3;--metric-image:url('assets/clientes-favor-v198.png');border-color:#527e70;background-position:center}
main>.metrics>.metric::before{display:none}
main>.metrics .metric-top{display:block;padding-top:10px}
main>.metrics .metric-top i{position:absolute;left:20px;top:20px;width:60px;height:60px;border:1.5px solid color-mix(in srgb,var(--metric-accent) 70%,#283956);background:radial-gradient(circle at 30% 20%,color-mix(in srgb,var(--metric-accent) 22%,#172942),#101e3288);color:var(--metric-accent);box-shadow:inset 0 1px #edffff19}
main>.metrics .metric-top i svg{width:29px;height:29px}
main>.metrics .metric-top span{display:block;margin-left:82px;font-size:13px;font-weight:650;line-height:18px;color:#f0f4fb}
main>.metrics .metric b{margin:7px 0 0 82px;font:700 43px/1 Inter,system-ui,sans-serif;letter-spacing:-1px;color:var(--metric-accent)}
main>.metrics .metric.cyan b{color:#f5f7fc}
main>.metrics .metric-link{margin:13px 0 0 82px;font-size:12px;font-weight:650;color:#9ae5b3}
main>.metrics .metric-link::after{right:13px;bottom:13px;width:32px;height:32px;border-color:color-mix(in srgb,var(--metric-accent) 35%,#243843);background:#19283c70;color:#e0e9f5;font-size:27px;box-shadow:inset 0 1px #e4f6ff10}
@media(min-width:1550px){main>.metrics>.metric{padding:25px;min-height:184px}main>.metrics .metric-top{padding-top:11px}main>.metrics .metric-top i{left:25px;top:23px;width:67px;height:67px}main>.metrics .metric-top span,main>.metrics .metric b,main>.metrics .metric-link{margin-left:90px}main>.metrics .metric-top span{font-size:14px}main>.metrics .metric b{font-size:48px}main>.metrics .metric-link{font-size:13px;margin-top:17px}}
@media(max-width:1250px){main>.metrics>.metric{padding:16px;min-height:149px}main>.metrics .metric-top i{left:15px;top:19px;width:47px;height:47px}main>.metrics .metric-top span,main>.metrics .metric b,main>.metrics .metric-link{margin-left:58px}main>.metrics .metric-top span{font-size:12px}main>.metrics .metric b{font-size:36px}main>.metrics .metric-link{font-size:11px}}
@media(max-width:430px){main>.metrics>.metric{min-height:159px}main>.metrics .metric-top span{font-size:13px}}