@layer components{.icon-toggle{width:3rem;height:3rem;color:var(--muted-foreground);cursor:pointer;transition:color var(--control-duration) var(--control-ease), background-color var(--control-duration) var(--control-ease), transform var(--control-duration) var(--control-ease), var(--focus-transition);background:0 0;border:0;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.icon-toggle:hover,.icon-toggle:focus-visible,.icon-toggle[aria-expanded=true]{color:var(--foreground);background:color-mix(in oklch, var(--foreground) 4%, transparent)}.icon-toggle:focus-visible{outline:var(--focus-width) solid var(--ring);outline-offset:calc(var(--focus-width) * -1)}.icon-toggle:active{transform:scale(.96)}@media (prefers-reduced-motion:reduce){.icon-toggle:active{transform:none}}}
