.switch{display:flex;align-items:flex-start;gap:12px;min-height:44px;padding-block:10px;cursor:pointer;line-height:1.5}.switch>input[type=checkbox]{appearance:none;flex:none;display:grid;align-items:center;justify-items:start;width:44px;height:24px;min-height:0;font-size:inherit;margin:calc(.75em - 12px) 0 0;padding:2px;border:2px solid var(--muted);border-radius:999px;background:var(--surface);cursor:inherit}.switch>input::before{content:"";width:16px;height:16px;border-radius:50%;background:var(--muted);transform:translateX(0)}.switch>input:checked{border-color:var(--accent);background:var(--accent)}.switch>input:checked::before{background:var(--on-accent);transform:translateX(20px)}.switch>input:dir(rtl):checked::before{transform:translateX(-20px)}.switch>input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.switch:has(>input:disabled){opacity:.55;cursor:not-allowed}.switch>span{min-width:0;overflow-wrap:anywhere}@media(prefers-reduced-motion:no-preference){.switch>input{transition:background-color var(--motion-normal) var(--motion-ease),border-color var(--motion-normal) var(--motion-ease)}.switch>input::before{transition:transform var(--motion-normal) var(--motion-ease),background-color var(--motion-normal) var(--motion-ease)}}@media(forced-colors:active){.switch>input[type=checkbox]{appearance:auto}.switch>input::before{display:none}}