:where(.Icon){--Icon-api-fill:currentColor}.Icon{width:var(--Icon-api-size,var(--Icon-private-fallbackSize));height:var(--Icon-api-size,var(--Icon-private-fallbackSize));fill:var(--Icon-api-fill)}.Icon>use{width:100%;height:100%}
: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-nav);--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-const-size:48px;--Button-const-padding-h:24px;--Button-const-icon-size:24px;--Button-const-icon-spacing:16px}@media (max-width:780px){.Button{--Button-const-size:40px;--Button-const-padding-h:20px;--Button-const-icon-size:20px;--Button-const-icon-spacing:12px}}@media (max-width:540px){.Button{--Button-const-size:32px;--Button-const-padding-h:16px;--Button-const-icon-size:16px;--Button-const-icon-spacing:10px}}.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(--font-nav);letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .1s linear,var(--focus-transition),transform .1s var(--anim-ease-inOutQuad);user-select:none;border: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));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}:is(.Button-iconRight,.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.flavor-dark,.Button.flavor-light{--Button-api-color-bg:var(--color-base-bg-1)}.Button.flavor-emerald,.Button.flavor-dark-sky,.Button.flavor-yellow{--Button-api-color-bg:var(--color-base-bg-1);--Button-api-color-fg:var(--color-base-fg-1)}.Button.flavor-base:where(.color-base-dark:not(:has([class*=color-base-])) .Button.flavor-base),.Button.flavor-base:where(.color-base-emerald:not(:has([class*=color-base-])) .Button.flavor-base),.Button.flavor-base:where(.color-base-dark-sky:not(:has([class*=color-base-])) .Button.flavor-base){--Button-api-color-bg:var(--color-forLightBases-bg-1);--Button-api-color-fg:var(--color-forLightBases-fg-1)}.Button.flavor-base:where(.color-base-light:not(:has([class*=color-base-])) .Button.flavor-base),.Button.flavor-base:where(.color-base-sand:not(:has([class*=color-base-])) .Button.flavor-base),.Button.flavor-base:where(.color-base-sky:not(:has([class*=color-base-])) .Button.flavor-base),.Button.flavor-base:where(.color-base-sage:not(:has([class*=color-base-])) .Button.flavor-base),.Button.flavor-base:where(.color-base-yellow:not(:has([class*=color-base-])) .Button.flavor-base){--Button-api-color-bg:var(--color-forDarkBases-bg-1);--Button-api-color-fg:var(--color-forDarkBases-fg-1)}.Button.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.flavor-frameless{--Button-api-padding-h:8px;--Button-api-color-bg:transparent}
