/* A faixa de progresso da leitura em segundo plano.
 *
 * Este arquivo tinha PALETA PRÓPRIA: verde-esmaecido (#192326, #6f8b89,
 * #30413f), que não existe em lugar nenhum do resto do Valenor. Não era um
 * hexadecimal esquecido do tema claro, era um terceiro sistema de cor vivendo
 * junto — e é isso que faz uma interface parecer montada por pessoas que não
 * se falaram. Agora usa os mesmos tokens de todas as outras telas.
 */
.vl-progresso { --vl-fill:var(--vl-text-2); padding:var(--sp-5); margin:1rem 0; border:1px solid var(--vl-line); border-radius:var(--radius); background:var(--vl-surface); color:var(--vl-text-2); }
.vl-progresso[hidden] {display:none}
.vl-progresso h2 {font-size:1.1rem; margin:0 0 .8rem}
.vl-progresso__number {font-size:2.5rem; font-variant-numeric:tabular-nums; color:var(--vl-text)}
.vl-progresso progress {display:block; width:100%; height:6px; border:0; border-radius:var(--radius-small); background:var(--vl-surface-3); margin:.7rem 0; overflow:hidden; accent-color:var(--vl-fill)}
.vl-progresso progress::-webkit-progress-bar {background:var(--vl-surface-3)}
.vl-progresso progress::-webkit-progress-value {background:var(--vl-fill); transition:width 600ms cubic-bezier(.22,.61,.36,1)}
.vl-progresso progress::-moz-progress-bar {background:var(--vl-fill)}
.vl-progresso__phases {display:flex; gap:var(--sp-3); flex-wrap:wrap; padding:0; list-style:none; font-size:.85rem}
.vl-progresso__phases li {flex:1 1 100px; border-top:2px solid var(--vl-line-2); padding-top:.5rem; color:var(--vl-text-3)}
.vl-progresso__phases .is-complete {border-color:var(--vl-ok); color:var(--vl-text-2)}
.vl-progresso__phases .is-current {border-color:var(--vl-luz); color:var(--vl-text)}
.vl-progresso__files {list-style:none; padding:0}
.vl-progresso__files li {padding:var(--sp-3) 0; border-bottom:1px solid var(--vl-line); overflow-wrap:anywhere}
.vl-progresso__files button {margin:.4rem .5rem 0 0}
.vl-progresso__notice {border-left:3px solid var(--vl-luz); padding:var(--sp-3); background:var(--vl-surface-2)}
.vl-progresso__link {display:inline-block; padding:var(--sp-3) var(--sp-4); border:1px solid var(--vl-line-2); border-radius:var(--radius-small); background:var(--vl-surface-2); color:var(--vl-text)}
.vl-progresso button:focus-visible, .vl-progresso a:focus-visible {outline:2px solid var(--vl-line-3); outline-offset:3px}
.vl-progresso[aria-busy=true] .vl-progresso__number {animation:vl-varredura 2.5s ease-in-out infinite}
@keyframes vl-varredura {50% {opacity:.88}}
#vl-background-work {padding:var(--sp-2) var(--sp-4); border:1px solid var(--vl-line); border-radius:var(--radius-small); background:var(--vl-surface-2); margin:.6rem 0}
@media (max-width:480px) {.vl-progresso {padding:var(--sp-4)} .vl-progresso__number {font-size:2rem}}
@media (prefers-reduced-motion:reduce) {.vl-progresso *, .vl-progresso[aria-busy=true] .vl-progresso__number {animation:none!important; transition:none!important}}
