.loadbar{--loadbar-lit:color-mix(in srgb, var(--color-accent-fill) 70%, var(--color-accent));--loadbar-empty:color-mix(in srgb, var(--color-text) 12%, transparent);align-items:center;gap:var(--loadbar-gap);width:100%;display:flex}.loadbar--sm{--loadbar-h:3px;--loadbar-gap:2px}.loadbar--md{--loadbar-h:4px;--loadbar-gap:3px}.loadbar-seg{height:var(--loadbar-h);background:var(--loadbar-empty);flex:1;position:relative;overflow:hidden}.loadbar-seg:after{content:"";background:var(--loadbar-lit);transform-origin:0;transition:background-color var(--dur-slab) ease-out;position:absolute;inset:0;transform:scaleX(0)}.loadbar-seg--on:after{transform:none}.loadbar-seg--in:after{animation:loadbar-plate-load .28s var(--ease-settle) backwards;animation-delay:calc(var(--seg-i,0) * 55ms)}.loadbar-seg--out:after{animation:loadbar-plate-unload .22s var(--ease-settle) backwards;animation-delay:calc(var(--seg-i,0) * 45ms)}@keyframes loadbar-plate-load{0%{transform:scaleX(0)}to{transform:none}}@keyframes loadbar-plate-unload{0%{transform:none}to{transform:scaleX(0)}}.loadbar-track{height:var(--loadbar-h);background:var(--loadbar-empty);flex:1;overflow:hidden}.loadbar-fill{background:var(--loadbar-lit);width:100%;height:100%;transform:scaleX(var(--loadbar-p,0));transform-origin:0;transition:transform var(--dur-slab) var(--ease-slab), background-color var(--dur-slab) ease-out;animation:loadbar-fill-run var(--dur-arrive) var(--ease-settle) backwards;display:block}@keyframes loadbar-fill-run{0%{transform:scaleX(0)}}.loadbar--success{--loadbar-lit:var(--color-success)}.loadbar--schedule{--loadbar-lit:var(--color-schedule)}.loadbar--warning{--loadbar-lit:var(--color-warning)}.loadbar--danger{--loadbar-lit:var(--color-danger)}.loadbar--ink{--loadbar-lit:var(--color-text)}.loadbar--athlete{--loadbar-h:10px;--loadbar-gap:var(--ath-space-1);--loadbar-lit:var(--ath-accent-lit);--loadbar-empty:var(--ath-line)}.loadbar--athlete.loadbar--success{--loadbar-lit:var(--ath-success)}.loadbar--athlete.loadbar--warning{--loadbar-lit:var(--ath-warning)}.loadbar--athlete.loadbar--danger{--loadbar-lit:var(--ath-danger)}.loadbar--athlete .loadbar-seg,.loadbar--athlete .loadbar-track,.loadbar--athlete .loadbar-fill{border-radius:var(--ath-radius-pill)}.loadbar--athlete .loadbar-fill{width:calc(var(--loadbar-p,0) * 100%);transition:width var(--ath-dur-calm) ease-out, background-color var(--ath-dur-calm) ease-out;animation:none;transform:none}