/* Início do portal: números e gráficos do mês. */
.cmp-an { margin:26px 0 8px; }
.cmp-an-head { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.cmp-an-head h2 { font-size:clamp(22px,3vw,30px); letter-spacing:-.04em; margin:0; }
.cmp-an-select { min-height:44px; border:1.5px solid var(--line); border-radius:12px; padding:8px 14px; background:#fff; font:inherit; font-weight:600; color:var(--ink); }
.cmp-an-body { display:grid; gap:18px; }
.cmp-an-card { margin:0 !important; display:block !important; }
.cmp-an-card h2 { font-size:19px; letter-spacing:-.03em; }
.cmp-an-empty { color:var(--muted); font-size:15px; padding:6px 0; }
.cmp-an-note { margin:10px 0 0; font-size:14px; color:var(--muted); }
.cmp-an-two { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.cmp-an-three { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }

/* Indicadores */
.cmp-an-kpis { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.cmp-an-kpi { background:#fff; border:1px solid var(--line); border-radius:18px; padding:18px 20px; display:grid; gap:4px; opacity:0; transform:translateY(14px); animation:cmp-an-up .55s cubic-bezier(.2,.8,.2,1) forwards; animation-delay:calc(var(--i) * .08s); position:relative; overflow:hidden; }
.cmp-an-kpi:first-child { background:var(--o); border-color:var(--o); color:#fff; }
.cmp-an-kpi:first-child span, .cmp-an-kpi:first-child .cmp-an-delta { color:#fff; }
.cmp-an-kpi span { font-size:13px; color:var(--muted); font-weight:600; }
.cmp-an-kpi strong { font-size:clamp(24px,3vw,34px); letter-spacing:-.05em; line-height:1.1; font-variant-numeric:tabular-nums; }
.cmp-an-delta { font-style:normal; font-size:12.5px; font-weight:700; }
.cmp-an-delta.is-up { color:#1F7A4D; } .cmp-an-delta.is-down { color:#B3261E; } .cmp-an-delta.is-flat { color:var(--muted); }
.cmp-an-kpi:first-child .cmp-an-delta.is-up, .cmp-an-kpi:first-child .cmp-an-delta.is-down { color:#fff; }
@keyframes cmp-an-up { to { opacity:1; transform:none; } }

/* Barras */
.cmp-an-svg { width:100%; height:auto; display:block; overflow:visible; }
.cmp-an-grid { stroke:var(--line); stroke-width:1; stroke-dasharray:3 5; }
.cmp-an-axis { fill:var(--muted); font-size:12px; font-family:inherit; }
.cmp-an-bar { fill:#F2B9A4; transform-box:fill-box; transform-origin:bottom; transform:scaleY(0); transition:transform .7s cubic-bezier(.2,.8,.2,1), fill .2s; transition-delay:calc(var(--i) * 28ms); cursor:pointer; }
.is-in .cmp-an-bar { transform:scaleY(1); }
.cmp-an-bar:hover { fill:var(--od,#C83A0C); }
.cmp-an-bar.is-peak { fill:var(--o); }
.cmp-an-bar.is-hot { fill:var(--ink); }

/* Rosca */
.cmp-an-donut-box { display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.cmp-an-donut { position:relative; width:150px; height:150px; flex:none; }
.cmp-an-donut-svg { width:100%; height:100%; }
.cmp-an-ring { stroke:var(--line); }
.cmp-an-donut-mid { position:absolute; inset:0; display:grid; place-content:center; text-align:center; }
.cmp-an-donut-mid strong { font-size:28px; letter-spacing:-.05em; line-height:1; }
.cmp-an-donut-mid span { font-size:12px; color:var(--muted); }
.cmp-an-legend { list-style:none; margin:0; padding:0; display:grid; gap:8px; flex:1; min-width:120px; }
.cmp-an-legend li { display:grid; grid-template-columns:12px 1fr auto; align-items:center; gap:8px; font-size:14px; }
.cmp-an-legend i { width:12px; height:12px; border-radius:4px; display:block; }
.cmp-an-legend b { font-variant-numeric:tabular-nums; }

/* Listas de ranking */
.cmp-an-rank { list-style:none; margin:6px 0 0; padding:0; display:grid; gap:12px; }
.cmp-an-rank li { display:grid; gap:5px; opacity:0; transform:translateX(-12px); transition:opacity .5s ease, transform .5s cubic-bezier(.2,.8,.2,1); transition-delay:calc(var(--i) * 60ms); position:relative; }
.is-in .cmp-an-rank li { opacity:1; transform:none; }
.cmp-an-rank-top { display:flex; align-items:center; gap:10px; }
.cmp-an-rank-name { flex:1; min-width:0; font-weight:650; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cmp-an-rank-top strong { font-size:14px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.cmp-an-pos { width:26px; height:26px; border-radius:50%; display:grid; place-items:center; font-size:12px; font-weight:800; background:var(--cream); color:var(--muted); flex:none; }
.cmp-an-pos.is-top { background:var(--o); color:#fff; }
.cmp-an-meter { height:8px; border-radius:99px; background:var(--cream); overflow:hidden; }
.cmp-an-meter i { display:block; height:100%; width:0; border-radius:99px; background:linear-gradient(90deg,#ED501F,#F39A78); transition:width .9s cubic-bezier(.2,.8,.2,1); transition-delay:calc(var(--i) * 60ms + .15s); }
.cmp-an-rank li:nth-child(n) .cmp-an-meter i { transition-delay:inherit; }
.is-in .cmp-an-meter i { width:var(--w); }
.cmp-an-rank small { color:var(--muted); font-size:12.5px; padding-left:36px; }
.cmp-an-av { width:34px; height:34px; border-radius:23%; background:var(--moss,#6C7563); color:#fff; display:grid; place-items:center; font-weight:800; flex:none; }
.cmp-an-rank.is-people li { padding-bottom:10px; border-bottom:1px solid var(--line); }
.cmp-an-rank.is-people li:last-child { border-bottom:0; }
.cmp-an-badge { justify-self:start; margin-left:36px; font-style:normal; font-size:11px; font-weight:800; letter-spacing:.04em; color:#fff; background:var(--o); border-radius:99px; padding:3px 10px; }
@media (max-width:980px) { .cmp-an-kpis { grid-template-columns:1fr 1fr; } .cmp-an-two { grid-template-columns:1fr; } .cmp-an-three { grid-template-columns:1fr; } }
@media (max-width:520px) { .cmp-an-kpis { gap:10px; } .cmp-an-kpi { padding:14px; } .cmp-an-donut { width:128px; height:128px; } }
@media (prefers-reduced-motion:reduce) { .cmp-an-kpi,.cmp-an-bar,.cmp-an-rank li,.cmp-an-meter i { animation:none !important; transition:none !important; opacity:1 !important; transform:none !important; } .cmp-an-meter i { width:var(--w) !important; } }
.cmp-an-card .cmm-mkt-sub { margin:4px 0 16px; }
.cmp-an-rank { margin-top:14px; }