@layer components{.mg-guide-ring{border-radius:var(--mg-radius-xs);outline:3px solid var(--mg-accent);outline-offset:2px;box-shadow:0 0 0 2px hsl(var(--mg-surface-card-hsl) / .95), 0 0 0 7px hsl(var(--mg-accent-hsl) / .26);transition:outline-color var(--dur-fast) var(--ease-standard)}.mg-guide-ring:after{content:"";border-radius:calc(var(--mg-radius-xs) + 7px);box-shadow:0 0 0 6px hsl(var(--mg-accent-hsl) / .26);opacity:0;position:absolute;inset:-7px}button:hover>.mg-guide-ring{outline-color:var(--mg-accent-hover)}button:active>.mg-guide-ring{outline-color:var(--mg-accent-active)}@media (prefers-reduced-motion:no-preference){.mg-guide-ring:after{animation:mg-guide-ring 2s var(--ease-emphasized) infinite}}}@keyframes mg-guide-ring{50%{opacity:1}}