.switch{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 2px;border:0;background:none;color:var(--text);font-family:var(--display);font-weight:500;font-size:var(--t-small);cursor:pointer}.switch__track{position:relative;flex:none;width:40px;height:24px;border-radius:var(--r-pill);border:1.5px solid var(--muted);background:var(--ground);transition:background-color .15s,border-color .15s}.switch__thumb{position:absolute;top:3px;left:3px;width:15px;height:15px;border-radius:50%;background:var(--muted);transition:transform .15s,background-color .15s}.switch[aria-checked=true] .switch__track{background:var(--accent);border-color:var(--accent)}.switch[aria-checked=true] .switch__thumb{transform:translate(16px);background:var(--surface)}.switch__state{min-width:3ch;color:var(--muted)}.switch__state:after{content:"off"}.switch[aria-checked=true] .switch__state:after{content:"on"}.switch:hover .switch__track{border-color:var(--accent)}