@scope(.icon-toggle){:scope{--control-size:2.5rem;--visual-size:2rem;--icon-size:.875rem;--hit-inset:calc((var(--control-size) - var(--visual-size)) / 2);isolation:isolate;width:var(--visual-size);height:var(--visual-size);margin:var(--hit-inset);cursor:pointer;border-radius:var(--radius-2);color:var(--color-text-1);background:0 0;border:0;flex:none;justify-content:center;align-items:center;padding:0;line-height:0;display:inline-flex;position:relative}:scope[data-size=small]{--visual-size:1.75rem;--icon-size:.75rem}:scope[data-size=large]{--control-size:2.75rem;--visual-size:2.25rem;--icon-size:1rem;border-radius:var(--radius-3)}:scope:before{content:"";z-index:-1;border-radius:inherit;pointer-events:none;position:absolute;inset:0}:scope:after{content:"";inset:calc(0px - var(--hit-inset));position:absolute}:scope[data-variant=subtle]{color:var(--color-text-2)}:scope[data-variant=outline]:before{border:1px solid var(--color-border-1)}:scope span{justify-content:center;align-items:center;display:inline-flex}:scope svg{width:var(--icon-size);height:var(--icon-size)}:scope:hover:before{background-color:var(--color-surface-3)}:scope[data-variant=subtle]:hover{color:var(--color-text-1)}:scope[data-state=on]:before{background-color:var(--color-surface-3)}:scope:focus-visible{outline:2px solid var(--color-ring);outline-offset:2px}:scope[disabled]{opacity:.5;cursor:not-allowed}}