@layer components{.grid>.mg-toggle{grid-column:1 / -1;justify-self:center}.mg-toggle{display:inline-flex;gap:.15rem;padding:.25rem;border-radius:999px;background:var(--mg-toggle-track, color-mix(in srgb, var(--txt-hue-copy, #000) 9%, transparent))}.mg-toggle-option:not(.is-active){--btn-bg: transparent;--btn-bg-h: var(--mg-toggle-hover, color-mix(in srgb, var(--txt-hue-copy, #000) 8%, transparent));--btn-color: var(--mg-toggle-fg, var(--txt-hue-copy, inherit));--btn-color-h: var(--mg-toggle-fg, var(--txt-hue-copy, inherit));--btn-border-width: 0}.mg-toggle.is-stacked{--mg-toggle-radius: 1.25rem;display:flex;flex-direction:column;inline-size:100%;border-radius:var(--mg-toggle-radius)}.grid>.mg-toggle.is-stacked{justify-self:stretch}.mg-toggle.is-stacked .mg-toggle-option{--btn-radius: calc(var(--mg-toggle-radius) - .25rem);justify-content:center}[data-group][hidden]{display:none!important}:root{--mg-toggle-vt-duration: .18s}.mg-toggle-option{view-transition-class:mg-toggle-pill}::view-transition-group(.mg-toggle-pill),::view-transition-old(.mg-toggle-pill),::view-transition-new(.mg-toggle-pill){animation-duration:var(--mg-toggle-vt-duration)}}
