.m3-icon-btn{--icon-btn-size:2.5rem;--icon-btn-touch-size:3rem;--icon-btn-icon-size:1.5rem;--icon-btn-background:transparent;--icon-btn-color:var(--color-text);--icon-btn-box-shadow:none;--icon-btn-border-width:0;--icon-btn-border-color:transparent;--icon-btn-border-style:solid;--icon-btn-border-radius:var(--radius-full);--icon-btn-outline:none;--icon-btn-outline-offset:0;--icon-btn-state-layer-color:var(--color-text);--icon-btn-state-hover-opacity:0.08;--icon-btn-state-focus-opacity:0.12;--icon-btn-state-pressed-opacity:0.12;-webkit-tap-highlight-color:transparent;align-items:center;background-color:var(--icon-btn-background);background-image:none;border-color:var(--icon-btn-border-color);border-radius:var(--icon-btn-border-radius);border-style:var(--icon-btn-border-style);border-width:var(--icon-btn-border-width);box-shadow:var(--icon-btn-box-shadow);box-sizing:border-box;color:var(--icon-btn-color);cursor:pointer;display:inline-flex;height:var(--icon-btn-size);justify-content:center;min-height:var(--icon-btn-touch-size);min-width:var(--icon-btn-touch-size);outline:var(--icon-btn-outline);outline-offset:var(--icon-btn-outline-offset);overflow:hidden;padding:0;position:relative;transition:background-color var(--duration-normal) var(--ease-in-out),box-shadow var(--duration-normal) var(--ease-in-out),border-color var(--duration-normal) var(--ease-in-out);width:var(--icon-btn-size)}.m3-icon-btn .m3-icon,.m3-icon-btn [class*=material-symbols]{font-size:var(--icon-btn-icon-size);height:var(--icon-btn-icon-size);width:var(--icon-btn-icon-size)}.m3-icon-btn.icon-btn-state\:hover,.m3-icon-btn:hover{background-image:linear-gradient(color-mix(in srgb,var(--icon-btn-state-layer-color) calc(var(--icon-btn-state-hover-opacity)*100%),transparent),color-mix(in srgb,var(--icon-btn-state-layer-color) calc(var(--icon-btn-state-hover-opacity)*100%),transparent))}.m3-icon-btn.icon-btn-state\:focus,.m3-icon-btn:focus-visible{--icon-btn-outline:var(--border-width-2) solid var(--color-focus-ring);--icon-btn-outline-offset:var(--space-1);background-image:linear-gradient(color-mix(in srgb,var(--icon-btn-state-layer-color) calc(var(--icon-btn-state-focus-opacity)*100%),transparent),color-mix(in srgb,var(--icon-btn-state-layer-color) calc(var(--icon-btn-state-focus-opacity)*100%),transparent))}.m3-icon-btn.icon-btn-state\:active,.m3-icon-btn:active{background-image:linear-gradient(color-mix(in srgb,var(--icon-btn-state-layer-color) calc(var(--icon-btn-state-pressed-opacity)*100%),transparent),color-mix(in srgb,var(--icon-btn-state-layer-color) calc(var(--icon-btn-state-pressed-opacity)*100%),transparent))}.m3-icon-btn.icon-btn-state\:disabled,.m3-icon-btn:disabled{--icon-btn-background:transparent;--icon-btn-color:color-mix(in srgb,var(--color-text) 38%,transparent);--icon-btn-box-shadow:none;--icon-btn-border-color:color-mix(in srgb,var(--color-text) 12%,transparent);--icon-btn-outline:none;cursor:not-allowed;pointer-events:none}.m3-icon-btn.icon-btn-size\:xs{--icon-btn-size:1.75rem;--icon-btn-touch-size:1.75rem;--icon-btn-icon-size:1.125rem}.m3-icon-btn.icon-btn-size\:sm{--icon-btn-size:2rem;--icon-btn-touch-size:2rem;--icon-btn-icon-size:1.25rem}.m3-icon-btn.icon-btn-size\:md{--icon-btn-size:2.5rem;--icon-btn-touch-size:3rem;--icon-btn-icon-size:1.5rem}.m3-icon-btn.icon-btn-size\:lg{--icon-btn-size:3rem;--icon-btn-touch-size:3rem;--icon-btn-icon-size:1.75rem}.m3-icon-btn.icon-btn\:filled{--icon-btn-background:var(--color-primary);--icon-btn-color:var(--color-on-primary);--icon-btn-state-layer-color:var(--color-on-primary);&.icon-btn-state\:disabled,&:disabled{--icon-btn-background:color-mix(in srgb,var(--color-text) 12%,transparent);--icon-btn-color:color-mix(in srgb,var(--color-text) 38%,transparent)}}.m3-icon-btn.icon-btn\:tonal{--icon-btn-background:var(--color-secondary-subtle);--icon-btn-color:var(--color-secondary);--icon-btn-state-layer-color:var(--color-secondary);&.icon-btn-state\:disabled,&:disabled{--icon-btn-background:color-mix(in srgb,var(--color-text) 12%,transparent);--icon-btn-color:color-mix(in srgb,var(--color-text) 38%,transparent)}}.m3-icon-btn.icon-btn\:outlined{--icon-btn-background:transparent;--icon-btn-color:var(--color-text);--icon-btn-border-width:0.0625rem;--icon-btn-border-color:var(--color-border);--icon-btn-state-layer-color:var(--color-text);&.icon-btn-state\:disabled,&:disabled{--icon-btn-background:transparent;--icon-btn-color:color-mix(in srgb,var(--color-text) 38%,transparent);--icon-btn-border-color:color-mix(in srgb,var(--color-text) 12%,transparent)}}.m3-icon-btn.icon-btn-toggle\:unselected{--icon-btn-background:transparent;--icon-btn-color:var(--color-text);--icon-btn-state-layer-color:var(--color-text)}.m3-icon-btn.icon-btn-toggle\:selected{--icon-btn-background:transparent;--icon-btn-color:var(--color-primary);--icon-btn-state-layer-color:var(--color-primary)}.m3-icon-btn.icon-btn\:filled.icon-btn-toggle\:selected{--icon-btn-background:var(--color-primary);--icon-btn-color:var(--color-on-primary);--icon-btn-state-layer-color:var(--color-on-primary)}.m3-icon-btn.icon-btn\:filled.icon-btn-toggle\:unselected{--icon-btn-background:var(--color-surface-2);--icon-btn-color:var(--color-primary);--icon-btn-state-layer-color:var(--color-primary)}.m3-icon-btn.icon-btn\:tonal.icon-btn-toggle\:selected{--icon-btn-background:var(--color-secondary-subtle);--icon-btn-color:var(--color-secondary);--icon-btn-state-layer-color:var(--color-secondary)}.m3-icon-btn.icon-btn\:tonal.icon-btn-toggle\:unselected{--icon-btn-background:var(--color-surface-2);--icon-btn-color:var(--color-text);--icon-btn-state-layer-color:var(--color-text)}.m3-icon-btn.icon-btn\:outlined.icon-btn-toggle\:selected{--icon-btn-background:var(--color-surface-inverse);--icon-btn-color:var(--color-text-inverse);--icon-btn-border-width:0;--icon-btn-state-layer-color:var(--color-text-inverse)}.m3-icon-btn.icon-btn\:outlined.icon-btn-toggle\:unselected{--icon-btn-background:transparent;--icon-btn-color:var(--color-text);--icon-btn-border-width:0.0625rem;--icon-btn-border-color:var(--color-border);--icon-btn-state-layer-color:var(--color-text)}.m3-icon-btn:has(>.m3-badge){overflow:visible}.m3-icon-btn>.m3-badge{--badge-top:calc(50% - var(--icon-btn-icon-size)/2 - var(--badge-height)/2);--badge-right:calc(50% - var(--icon-btn-icon-size)/2 - var(--badge-min-width)/2)}