.spinner{z-index:2}.spinner .circle,.spinner .tick{stroke-width:5px;stroke:#9c1c1c;transition:all .2s}.spinner .circle{transform-origin:3.125rem 3.125rem 0;stroke-dasharray:500}.spinner .cross-line{stroke-width:5px;stroke-dasharray:100;stroke-dashoffset:100px;stroke:var(--color-error);transition:all .2s}.spinner .cross-line.cross-line--2{transition-delay:.1s}.spinner.loading .cross-line,.spinner.loading .tick{opacity:0}.spinner.loading .circle{stroke:var(--ui-primary);stroke-dasharray:314;stroke-dashoffset:1000px;stroke-linejoin:circle;animation:2.1s linear infinite spin}.spinner.success .tick{stroke-dasharray:1000;stroke-dashoffset:1000px;stroke:var(--color-success);animation:8s ease-out forwards draw}.spinner.success .cross-line{opacity:0}.spinner.success .circle{stroke-dashoffset:66px;stroke:var(--color-success)}.spinner.error .tick{opacity:0}.spinner.error .cross-line{stroke-dashoffset:0}.spinner.error .circle{stroke-dashoffset:66px;stroke:var(--color-error)}.spinner.alt .circle,.spinner.alt .tick{stroke:#fff}@keyframes spin{0%{stroke-dashoffset:66px;transform:rotate(0)}50%{stroke-dashoffset:314px;transform:rotate(540deg)}to{stroke-dashoffset:66px;transform:rotate(3turn)}}@keyframes draw{to{stroke-dashoffset:0}}.spinner--attachments.loading .spinner .circle,.spinner--attachments.loading .spinner .tick,.spinner--attachments.success .spinner .circle,.spinner--attachments.success .spinner .tick{stroke-width:8px;stroke:var(--color-grey-900)}
