:root{--track-width:50px;--track-height:26px;--padding:1px}.toggle-container{border-radius:8px;justify-content:center;align-items:center;gap:6px;display:flex}.toggle-container:focus-within{outline-offset:3px;outline:2px solid #063}.toggle-label{-webkit-user-select:none;user-select:none;cursor:pointer;font-size:12px;transition:color .3s,font-weight .3s}.label-active{color:#063;font-weight:500}.label-inactive{color:#5d646a;font-weight:500}.toggle-track{width:var(--track-width);height:var(--track-height);cursor:pointer;padding:var(--padding);background-color:#adb5bd;border:none;border-radius:999px;flex-shrink:0;transition:background-color .3s;position:relative}.toggle-track:focus-visible{outline-offset:3px;outline:2px solid #063}.toggle-track:disabled{cursor:not-allowed;opacity:.6}.toggle-track.track-on{background-color:#063}.toggle-knob{top:var(--padding);left:var(--padding);background-color:#fff;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;transition:transform .3s cubic-bezier(.4,0,.2,1);display:flex;position:absolute;box-shadow:0 1px 3px #0003}.track-on .toggle-knob{transform:translate(24px)}.track-off .toggle-knob{transform:translate(0)}.knob-icon{object-fit:contain;-webkit-user-select:none;user-select:none;width:70%;height:70%}