@layer components{.switch{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);cursor:pointer}.switch-label{font-size:var(--text-sm);color:var(--fg)}.switch-input{position:absolute;width:1px;height:1px;margin:0;opacity:0}.switch-track{position:relative;flex-shrink:0;width:2.5rem;height:1.5rem;border-radius:var(--radius-pill);background:var(--bg-active);transition:background var(--duration-fast)var(--easing-out)}.switch-thumb{position:absolute;top:.125rem;left:.125rem;width:1.25rem;height:1.25rem;border-radius:50%;background:var(--fg-on-accent);box-shadow:var(--shadow-sm);transition:transform var(--duration-fast)var(--easing-out)}.switch-input:checked+.switch-track{background:var(--accent)}.switch-input:checked+.switch-track .switch-thumb{transform:translateX(1rem)}.switch-input:focus-visible+.switch-track{outline:2px solid var(--accent);outline-offset:2px}.switch:has(.switch-input:disabled){cursor:not-allowed;color:var(--fg-muted)}.switch-input:disabled+.switch-track{opacity:.5}}