/* Tela 10 (Uso e limites): medidores. Neutro até 79%, âmbar a partir de 80%, bloqueio em 100%. */
.uso { max-width: 640px; margin: 0 auto; padding: 16px; }
.uso-grupo { margin-top: 24px; }
.medidores { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 16px; }
.medidor { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; padding: 12px 14px; border: 1px solid #E6E1DA; border-radius: 12px; background: #FFFFFF; }
.medidor-valor { font-variant-numeric: tabular-nums; font-weight: 600; }
.medidor-barra { grid-column: 1 / -1; height: 10px; border-radius: 999px; background: #EFECE6; overflow: hidden; }
.medidor-cheio { height: 100%; border-radius: 999px; background: var(--fabia-tinta); transition: width 0.4s ease; }
.medidor-atencao { border-color: var(--fabia-ambar); }
.medidor-atencao .medidor-cheio { background: var(--fabia-ambar); }
.medidor-bloqueado { border-color: var(--fabia-coral-texto); }
.medidor-bloqueado .medidor-cheio { background: var(--fabia-coral-texto); }
.medidor-aviso { grid-column: 1 / -1; margin: 0; color: var(--fabia-selo-texto); font-size: 0.875rem; }
@media (prefers-reduced-motion: reduce) { .medidor-cheio { transition: none; } }