@layer theme,base;@layer components{.sound-mark{--sound-mark-ink:var(--ink-ui,currentColor);--sound-mark-accent:var(--accent,var(--color-meower-primary));flex-shrink:0;display:inline-flex}.sound-mark .doodle-stroke{transform-box:fill-box;transform-origin:0%;stroke:var(--sound-mark-accent)}.sound-mark .doodle-stroke:nth-of-type(-n+2){stroke:var(--sound-mark-ink)}.sound-mark[data-on=false] .doodle-stroke{transform-origin:50%}@media (prefers-reduced-motion:no-preference){:hover>.sound-mark[data-on=true] .doodle-stroke:nth-of-type(n+3){animation:sound-mark-ripple .62s var(--ease-settle,ease-out)}:hover>.sound-mark[data-on=false] .doodle-stroke:nth-of-type(n+3){animation:sound-mark-bob .9s var(--ease-settle,ease-out)}:hover>.sound-mark .doodle-stroke:nth-of-type(4){animation-delay:70ms}:hover>.sound-mark .doodle-stroke:nth-of-type(5){animation-delay:.14s}:hover>.sound-mark .doodle-stroke:nth-of-type(6){animation-delay:.21s}}@keyframes sound-mark-ripple{40%{opacity:.7;transform:scale(1.14)}}@keyframes sound-mark-bob{45%{transform:translateY(-3px)rotate(-8deg)}}}@layer utilities;