@layer m3-components{.m3-prog{--_h:4px;--_gap:4px;--_loop:1.6s;--_wave-h:10px;--_wave-len:40px;width:100%;height:var(--_h);align-items:center;min-width:0;display:flex}.m3-prog[data-thick]{--_h:8px}.m3-prog[data-wavy]{height:var(--_wave-h)}.m3-prog__active{min-width:0;height:var(--_h);border-radius:calc(var(--_h) / 2);background:var(--md-sys-color-primary);transition:flex-grow var(--md-sys-motion-dur-medium) var(--md-sys-motion-effects),margin-inline-end var(--md-sys-motion-dur-medium) var(--md-sys-motion-effects);flex:1 1 0;margin-inline-end:var(--_gap);position:relative;overflow:hidden}.m3-prog[data-edge] .m3-prog__active{margin-inline-end:0}.m3-prog__track{min-width:0;height:var(--_h);border-radius:calc(var(--_h) / 2);background:var(--md-sys-color-secondary-container);transition:flex-grow var(--md-sys-motion-dur-medium) var(--md-sys-motion-effects);flex:1 1 0;position:relative}.m3-prog__track:after{content:"";background:var(--md-sys-color-primary);opacity:0;width:4px;height:4px;transition:opacity var(--md-sys-motion-t-fx-small);border-radius:50%;margin-top:-2px;position:absolute;inset-block:50% auto;inset-inline-end:calc(.5 * (-4px + var(--_h)))}.m3-prog__track[data-dot]:after{opacity:1}.m3-prog[data-wavy] .m3-prog__active,.m3-prog[data-wavy] .m3-prog__bar{height:var(--_wave-h);background:0 0;border-radius:0}.m3-prog[data-wavy] .m3-prog__track{height:var(--_h)}.m3-prog[data-wavy] .m3-prog__active:before,.m3-prog[data-wavy] .m3-prog__bar:before{content:"";width:calc(100% + var(--_wave-len));background:var(--md-sys-color-primary);animation:m3-wave var(--_loop) linear infinite;position:absolute;inset-block:0;inset-inline-start:calc(-1 * var(--_wave-len));-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 10'><path d='M0 5Q10 -1 20 5T40 5' fill='none' stroke='black' stroke-width='4' stroke-linecap='round'/></svg>") 0 0/40px 10px repeat-x;mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 10'><path d='M0 5Q10 -1 20 5T40 5' fill='none' stroke='black' stroke-width='4' stroke-linecap='round'/></svg>") 0 0/40px 10px repeat-x}@keyframes m3-wave{to{translate:var(--_wave-len) 0}}.m3-prog__bar,.m3-prog__track--indeterminate{overflow:hidden}.m3-prog[data-wavy] .m3-prog__track--indeterminate{height:var(--_wave-h);background:0 0}.m3-prog[data-wavy] .m3-prog__track--indeterminate:before{content:"";inset-inline:0;height:var(--_h);margin-top:calc(var(--_h) / -2);border-radius:calc(var(--_h) / 2);background:var(--md-sys-color-secondary-container);position:absolute;top:50%}.m3-prog[data-wavy] .m3-prog__track--indeterminate:after,.m3-prog__track--indeterminate:after{display:none}.m3-prog__bar{border-radius:calc(var(--_h) / 2);background:var(--md-sys-color-primary);animation:m3-sweep calc(var(--_loop) * 1.25) var(--md-sys-motion-ease-standard) infinite;position:absolute;inset-block:0}@keyframes m3-sweep{0%{width:30%;inset-inline-start:-30%}55%{width:55%;inset-inline-start:35%}to{width:20%;inset-inline-start:100%}}.m3-prog-c{--_loop:1.4s;width:var(--_s);height:var(--_s);flex:none;display:inline-block}.m3-prog-c svg{width:100%;height:100%;overflow:visible;transform:rotate(-90deg)}.m3-prog-c circle{fill:none;stroke-width:var(--_w);stroke-linecap:round}.m3-prog-c__track{stroke:var(--md-sys-color-secondary-container)}.m3-prog-c__active,.m3-prog-c__track{transition:stroke-dasharray var(--md-sys-motion-dur-large) var(--md-sys-motion-enter),stroke-dashoffset var(--md-sys-motion-dur-large) var(--md-sys-motion-enter)}.m3-prog-c__active,.m3-prog-c__spin{stroke:var(--md-sys-color-primary)}.m3-prog-c[data-indeterminate] svg{animation:m3-prog-spin var(--_loop) linear infinite}.m3-prog-c__spin{stroke-dasharray:20 100;animation:m3-prog-arc var(--_loop) var(--md-sys-motion-ease-standard) infinite}@keyframes m3-prog-spin{to{transform:rotate(270deg)}}@keyframes m3-prog-arc{0%{stroke-dasharray:6 100;stroke-dashoffset:0}50%{stroke-dasharray:62 100;stroke-dashoffset:-14px}to{stroke-dasharray:6 100;stroke-dashoffset:-94px}}@keyframes m3-prog-pulse{0%{opacity:.45}to{opacity:1}}:root[data-motion=reduce] .m3-prog :is(.m3-prog__active,.m3-prog__bar):before{animation:none;translate:0}:root[data-motion=reduce] .m3-prog__bar{animation:m3-prog-pulse var(--_loop) ease-in-out infinite alternate;width:45%;inset-inline-start:0}:root[data-motion=reduce] .m3-prog-c[data-indeterminate] svg{animation:none}:root[data-motion=reduce] .m3-prog-c__spin{animation:m3-prog-pulse var(--_loop) ease-in-out infinite alternate;stroke-dasharray:62 100}@media (prefers-reduced-motion:reduce){:root:not([data-motion=expressive]) .m3-prog :is(.m3-prog__active,.m3-prog__bar):before{animation:none;translate:0}:root:not([data-motion=expressive]) .m3-prog__bar{animation:m3-prog-pulse var(--_loop) ease-in-out infinite alternate;width:45%;inset-inline-start:0}:root:not([data-motion=expressive]) .m3-prog-c[data-indeterminate] svg{animation:none}:root:not([data-motion=expressive]) .m3-prog-c__spin{animation:m3-prog-pulse var(--_loop) ease-in-out infinite alternate;stroke-dasharray:62 100}}@media (forced-colors:active){.m3-prog__track{background:graytext}.m3-prog__active,.m3-prog__bar{background:highlight}.m3-prog-c__track{stroke:graytext}.m3-prog-c__active,.m3-prog-c__spin{stroke:highlight}}}
