:root{--Button-const-size:48px;--Button-const-padding-h:24px;--Button-const-icon-size:24px;--Button-const-icon-spacing:16px}@media (width<=780px){:root{--Button-const-size:40px;--Button-const-padding-h:20px;--Button-const-icon-size:20px;--Button-const-icon-spacing:12px}}@media (width<=540px){:root{--Button-const-size:32px;--Button-const-padding-h:16px;--Button-const-icon-size:16px;--Button-const-icon-spacing:10px}}:where(.Button){--Button-api-size:var(--Button-const-size);--Button-api-padding-h:var(--Button-const-padding-h);--Button-api-icon-size:var(--Button-const-icon-size);--Button-api-icon-spacing:var(--Button-const-icon-spacing);--Button-api-icon-left-shim:0;--Button-api-icon-right-shim:0;--Button-api-color-bg:transparent;--Button-api-color-bg-hover:var(--Button-api-color-bg);--Button-api-color-bg-active:var(--Button-api-color-bg);--Button-api-color-bg-disabled:var(--color-base-bg-2);--Button-api-color-bg-working:var(--Button-api-color-bg-disabled);--Button-api-color-bgTint-hover:hsl(var(--color-hsl-white)/10%);--Button-api-color-bgTint-active:hsl(var(--color-hsl-black)/5%);--Button-api-color-fg:var(--color-base-fg-1);--Button-api-color-fg-hover:var(--Button-api-color-fg);--Button-api-color-fg-active:var(--Button-api-color-fg);--Button-api-color-fg-disabled:var(--color-base-fg-2);--Button-api-color-fg-working:var(--Button-api-color-fg-disabled);--Button-api-color-border:transparent;--Button-api-color-border-hover:var(--Button-api-color-border);--Button-api-color-border-active:var(--Button-api-color-border);--Button-api-color-border-disabled:var(--Button-api-color-border);--Button-api-color-border-working:var(--Button-api-color-border-disabled);--Button-api-font:var(--font-base);--Button-api-font-weight:var(--fontWeight-bold);--Button-api-hover-scale:1.02;--Button-api-active-scale:.97}@property --Button-private-bg{syntax:"<color>";inherits:true;initial-value:#0000}@property --Button-private-bgTint{syntax:"<color>";inherits:true;initial-value:#0000}@property --Button-private-fg{syntax:"<color>";inherits:true;initial-value:#0000}@property --Button-private-borderColor{syntax:"<color>";inherits:true;initial-value:#0000}:where(.Button){display:inline-flex}.Button{--Button-private-bg:var(--Button-api-color-bg);--Button-private-bgTint:transparent;--Button-private-fg:var(--Button-api-color-fg);--Button-private-borderColor:var(--Button-api-color-border);box-sizing:border-box;-webkit-appearance:none;min-width:var(--Button-api-size,0);height:var(--Button-api-size);padding:0 var(--Button-api-padding-h);justify-content:center;align-items:center;gap:var(--Button-api-icon-spacing);transform-origin:50%;border-radius:calc(var(--Button-api-size)/2);background-color:var(--Button-private-bg);box-shadow:var(--hairline-fakeBorder)var(--Button-private-borderColor);color:var(--Button-private-fg);font:var(--Button-api-font);font-weight:var(--Button-api-font-weight);line-height:var(--Button-api-size);cursor:pointer;transition:all .1s linear,var(--focus-transition),transform .1s var(--anim-ease-inOutQuad);-webkit-user-select:none;user-select:none;border:none;-webkit-text-decoration:none;text-decoration:none}@media (hover:hover){.Button:hover{--Button-private-bg:var(--Button-api-color-bg-hover);--Button-private-bgTint:var(--Button-api-color-bgTint-hover);--Button-private-fg:var(--Button-api-color-fg-hover);--Button-private-borderColor:var(--Button-api-color-border-hover);transform:scale(var(--Button-api-hover-scale));-webkit-text-decoration:none;text-decoration:none}}.Button:active{--Button-private-bg:var(--Button-api-color-bg-active);--Button-private-bgTint:var(--Button-api-color-bgTint-active);--Button-private-fg:var(--Button-api-color-fg-active);--Button-private-borderColor:var(--Button-api-color-border-active);transform:scale(var(--Button-api-active-scale))}.Button:focus-visible{box-shadow:var(--focus-glow)}.Button[disabled],.Button[disabled]:hover,.Button[disabled]:active,.Button[disabled]:focus{--Button-private-bg:var(--Button-api-color-bg-disabled);--Button-private-bgTint:transparent;--Button-private-fg:var(--Button-api-color-fg-disabled);--Button-private-borderColor:var(--Button-api-color-border-disabled);cursor:default;pointer-events:none;transform:none}.Button-iconRight,.Button-iconLeft{width:var(--Button-api-icon-size);height:var(--Button-api-icon-size);flex:none;grid-template:"content"100%/100%;place-items:center;display:grid}.Button-iconRight>.Icon,.Button-iconLeft>.Icon{--Icon-api-size:var(--Button-api-icon-size);grid-area:content}.Button-iconRight{margin-right:var(--Button-api-icon-right-shim)}.Button-iconLeft{margin-left:var(--Button-api-icon-left-shim)}.Button-label{text-overflow:ellipsis;white-space:nowrap;flex:none;overflow:hidden}.Button:has(.Button-iconRight:only-child),.Button:has(.Button-iconLeft:only-child){--Button-api-padding-h:0;--Button-api-icon-left-shim:0;--Button-api-icon-right-shim:0}.Button[data-flavor=dark],.Button[data-flavor=light]{--Button-api-color-bg:var(--color-base-bg-1)}.Button[data-flavor=teal],.Button[data-flavor=corncob]{--Button-api-color-bg:var(--color-base-bg-1);--Button-api-color-fg:var(--color-base-fg-1)}.Button[data-flavor=base]:where([data-color-base=dark]:not(:has([data-color-base]) .Button[data-flavor=base]) .Button[data-flavor=base]),.Button[data-flavor=base]:where([data-color-base=teal]:not(:has([data-color-base]) .Button[data-flavor=base]) .Button[data-flavor=base]){--Button-api-color-bg:var(--color-forLightBases-bg-1);--Button-api-color-fg:var(--color-forLightBases-fg-1)}.Button[data-flavor=base]:where([data-color-base=light]:not(:has([data-color-base])) .Button[data-flavor=base]),.Button[data-flavor=base]:where([data-color-base=sand]:not(:has([data-color-base])) .Button[data-flavor=base]),.Button[data-flavor=base]:where([data-color-base=sky]:not(:has([data-color-base])) .Button[data-flavor=base]),.Button[data-flavor=base]:where([data-color-base=smoke]:not(:has([data-color-base])) .Button[data-flavor=base]),.Button[data-flavor=base]:where([data-color-base=corncob]:not(:has([data-color-base])) .Button[data-flavor=base]){--Button-api-color-bg:var(--color-forDarkBases-bg-1);--Button-api-color-fg:var(--color-forDarkBases-fg-1)}.Button[data-flavor=border]{--Button-api-color-bg:transparent;--Button-api-color-border:var(--color-base-chrome-1);--Button-api-color-border-disabled:var(--color-base-chrome-2)}.Button[data-flavor=frameless]{--Button-api-padding-h:8px;--Button-api-color-bg:transparent}