.scanner{--c:#ff8400;--w:260px;--h:8px;--bar:100%;--dur:5s;--pct:0;position:relative;width:var(--w);height:var(--h);margin:0 auto;border-radius:999px;overflow:hidden;background:rgba(100,100,100,0.7);box-shadow:inset 1px 1px 4px rgba(100,100,100,0.3)}.scanner:not(.determinate)::before{content:"";position:absolute;inset:0 auto 0 0;width:var(--bar);border-radius:inherit;background:radial-gradient(120% 100% at 20% 50%,rgba(255,255,255,.5),transparent 70%),linear-gradient(90deg,transparent 0,rgba(255,255,255,.25) 60%,transparent 100%),var(--c);mix-blend-mode:screen;box-shadow:0 0 10px var(--c),0 0 22px var(--c),0 0 36px color-mix(in srgb,var(--c) 35%,transparent);animation:scan var(--dur) ease-in-out infinite alternate,shimmer 1.15s linear infinite}.scanner::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,color-mix(in srgb,var(--c) 18%,transparent) 0,transparent 50%,color-mix(in srgb,var(--c) 18%,transparent) 100%);filter:blur(4px);pointer-events:none}.scanner.determinate::before{content:"";position:absolute;inset:0 auto 0 0;width:calc(var(--pct) * 1%);border-radius:inherit;background:radial-gradient(120% 100% at 12% 50%,rgba(255,255,255,.5),transparent 60%),linear-gradient(90deg,transparent 0,rgba(255,255,255,.25) 50%,transparent 100%),var(--c);mix-blend-mode:screen;box-shadow:0 0 10px var(--c),0 0 22px var(--c),0 0 36px color-mix(in srgb,var(--c) 70%,transparent);transition:width .25s ease}@keyframes scan{from{transform:translateX(0)}to{transform:translateX(calc(100% - var(--bar)))}}@keyframes shimmer{0{background-position:-160px 0,-160px 0,0 0}100%{background-position:160px 0,160px 0,0 0}}@media(prefers-reduced-motion:reduce){.scanner:not(.determinate)::before{animation:scan 6s ease-in-out infinite alternate}}.progress-label{margin:6px auto 0;width:var(--w);text-align:center;font:500 12px/1.2 system-ui,sans-serif;opacity:.8}