.toggle-button{--toggle-width:44px;--toggle-height:24px;--toggle-gap:3px;--toggle-thumb-size:calc(var(--toggle-height) - (var(--toggle-gap) * 2));--toggle-travel:calc(var(--toggle-width) - var(--toggle-thumb-size) - (var(--toggle-gap) * 2));--toggle-bg:var(--neutral-300);--toggle-thumb:var(--neutral-0);position:relative;flex:0 0 auto;display:inline-flex;align-items:center;width:var(--toggle-width);height:var(--toggle-height);padding:var(--toggle-gap);border:none;border-radius:calc(var(--toggle-height)/2);background:var(--toggle-bg);cursor:pointer;transition:background .24s ease}.toggle-button.toggle-button--on{--toggle-bg:var(--blue-300)}.toggle-button:focus-visible{outline:2px solid var(--blue-200);outline-offset:2px}.toggle-button:disabled{cursor:not-allowed;opacity:.55}.toggle-button .toggle-button__thumb{display:block;width:var(--toggle-thumb-size);height:var(--toggle-thumb-size);border-radius:50%;background:var(--toggle-thumb);box-shadow:0 1px 2px rgba(33,38,44,.3);transition:transform .24s ease}.toggle-button.toggle-button--on .toggle-button__thumb{transform:translateX(var(--toggle-travel))}@media(prefers-reduced-motion:reduce){.toggle-button,.toggle-button .toggle-button__thumb{transition:none}}