.mley-action-feedback { position:relative; }
.mley-action-feedback__mark { display:inline-flex; width:1em; height:1em; margin-inline-start:.4em; vertical-align:-.125em; color:inherit; pointer-events:none; }
.mley-action-feedback__mark svg { width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:2.25; stroke-linecap:round; stroke-linejoin:round; }
.mley-action-feedback__mark circle { stroke-dasharray:42 15; transform-origin:center; animation:mley-action-spin .8s linear infinite; }
.mley-action-feedback__mark path { opacity:0; }
[data-feedback-state="success"] > .mley-action-feedback__mark circle { animation:none; opacity:0; }
[data-feedback-state="success"] > .mley-action-feedback__mark path { opacity:1; stroke-dasharray:24; animation:mley-action-check .18s ease-out; }
.mley-action-feedback--icon > :is(svg, i, .mley-icon) { opacity:0; }
.mley-action-feedback--icon > .mley-action-feedback__mark { position:absolute; inset:0; margin:auto; width:1.15em; height:1.15em; }
.mley-action-feedback__status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
[data-feedback-state="changed"] { animation:mley-action-change .24s ease-out; }
@keyframes mley-action-change { 50% { transform:scale(.9); } }
@keyframes mley-action-spin { to { transform:rotate(360deg); } }
@keyframes mley-action-check { from { stroke-dashoffset:24; } to { stroke-dashoffset:0; } }
@media (prefers-reduced-motion:reduce) {
  .mley-action-feedback__mark circle, [data-feedback-state="success"] > .mley-action-feedback__mark path, [data-feedback-state="changed"] { animation:none; }
}