@layer components{.status-svg{width:96px;height:96px;overflow:visible}.status-svg--success{color:var(--color-foreground-success)}.status-svg--error{color:var(--color-foreground-error)}.status-circle{fill:none;stroke:currentColor;stroke-width:6;opacity:.25}.status-fill{fill:currentColor;opacity:.12;transform-origin:60px 60px;transform:scale(0);animation:status-fill 3s ease-out forwards}.status-fill--success{color:var(--color-foreground-success)}.status-fill--error{color:var(--color-foreground-error)}.status-mark{fill:none;stroke:currentColor;stroke-width:8;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:120;stroke-dashoffset:120;animation:status-draw .7s ease-out forwards}.status-mark--success{color:var(--color-foreground-success)}.status-mark--error{color:var(--color-foreground-error);stroke-dasharray:160;stroke-dashoffset:160;animation-duration:.6s}@keyframes status-draw{to{stroke-dashoffset:0}}@keyframes status-fill{0%{transform:scale(0);opacity:.12}40%{transform:scale(.9);opacity:.2}to{transform:scale(1);opacity:.28}}}