/* Varejo: um único gráfico, alternância visual compacta. Sem efeito em outras rotas. */
.vr-page .vr-chart-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:12px 0}
.vr-page .vr-chart-switch{display:inline-flex;align-items:center;gap:2px;padding:3px;border:1px solid var(--border,#444);border-radius:12px;background:var(--surface-2,rgba(127,127,127,.08))}
.vr-page .vr-chart-choice{appearance:none;border:0;border-radius:9px;background:transparent;color:var(--text-2,#aaa);padding:8px 13px;font:inherit;font-size:12px;font-weight:650;line-height:1.2;cursor:pointer;min-height:34px}
.vr-page .vr-chart-choice.is-active{color:var(--text,#fff);background:var(--surface,#333);box-shadow:0 1px 4px rgba(0,0,0,.12)}
.vr-page .vr-chart-choice:focus-visible{outline:2px solid var(--vr-visual-accent,#c13c58);outline-offset:2px}
.vr-page .vr-chart-value{font-size:14px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--text,#eee)}
@media(max-width:380px){.vr-page .vr-chart-toolbar{gap:8px}.vr-page .vr-chart-choice{padding:7px 10px}.vr-page .vr-chart-value{font-size:13px}}