@layer components{[data-ui=button]{justify-content:center;align-items:center;gap:var(--spacing-200);padding-inline:var(--spacing-300);padding-block:var(--spacing-200);border-radius:var(--radius-default);border:var(--stroke-width-default) solid transparent;color:var(--color-on-surface);font-family:var(--typography-button-font-family);font-size:var(--typography-button-font-size);font-weight:var(--typography-button-font-weight);letter-spacing:var(--typography-button-letter-spacing);line-height:var(--typography-button-line-height);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color var(--brand-duration-100) var(--brand-easing-standard), color var(--brand-duration-100) var(--brand-easing-standard), border-color var(--brand-duration-100) var(--brand-easing-standard), background-position var(--brand-duration-200) var(--brand-easing-standard), scale var(--brand-duration-100) var(--brand-easing-standard);background-color:#0000;outline:none;text-decoration:none;display:inline-flex}[data-ui=button][data-size=sm]{padding-inline:var(--spacing-200);padding-block:var(--spacing-100);position:relative}[data-ui=button][data-size=sm]:after{content:"";position:absolute;inset:-8px 0}[data-ui=button][data-size=lg]{padding-inline:var(--spacing-500);padding-block:var(--spacing-300)}[data-ui=button][data-icon-only]{padding-inline:var(--spacing-200);aspect-ratio:1}[data-ui=button][data-size=sm][data-icon-only]{padding-inline:var(--spacing-100)}[data-ui=button][data-size=lg][data-icon-only]{padding-inline:var(--spacing-300)}[data-ui=button-icon]{width:var(--spacing-450);height:var(--spacing-450);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}[data-ui=button][data-size=sm] [data-ui=button-icon],[data-ui=button][data-size=sm]>svg{width:var(--spacing-400);height:var(--spacing-400)}[data-ui=button][data-size=lg] [data-ui=button-icon],[data-ui=button][data-size=lg]>svg{width:var(--spacing-500);height:var(--spacing-500)}[data-ui=button][data-icon-only]>svg{width:var(--spacing-450);height:var(--spacing-450);flex-shrink:0}[data-ui=button][data-variant=primary][data-mode=filled]{background-color:var(--color-primary-brand);color:var(--color-primary-on-brand)}[data-ui=button][data-variant=primary][data-mode=stroke]{border:var(--stroke-width-selected) solid var(--color-primary-brand);color:var(--color-primary-brand)}[data-ui=button][data-variant=primary][data-mode=lighter]{background-color:var(--color-primary-container);color:var(--color-primary-on-container)}[data-ui=button][data-variant=primary][data-mode=ghost]{color:var(--color-primary-brand)}[data-ui=button][data-variant=neutral][data-mode=filled]{background-color:var(--theme-color-neutral-5);color:var(--theme-color-neutral-12)}[data-ui=button][data-variant=neutral][data-mode=stroke]{border:var(--stroke-width-selected) solid var(--theme-color-neutral-5);color:var(--theme-color-neutral-12)}[data-ui=button][data-variant=neutral][data-mode=lighter]{background-color:var(--theme-color-neutral-6);color:var(--theme-color-neutral-12)}[data-ui=button][data-variant=neutral][data-mode=ghost]{color:var(--theme-color-neutral-12)}[data-ui=button][data-variant=secondary][data-mode=filled]{background-color:var(--color-secondary-brand);color:var(--color-secondary-on-brand);border-color:var(--color-border-subtle)}[data-ui=button][data-variant=secondary][data-mode=stroke]{border:var(--stroke-width-selected) solid var(--color-secondary-brand);color:var(--color-secondary-brand)}[data-ui=button][data-variant=secondary][data-mode=lighter]{background-color:var(--color-secondary-container);color:var(--color-secondary-on-container)}[data-ui=button][data-variant=secondary][data-mode=ghost]{color:var(--color-secondary-brand)}[data-ui=button][data-variant=tertiary][data-mode=filled]{background-color:var(--color-tertiary-brand);color:var(--color-tertiary-on-brand)}[data-ui=button][data-variant=tertiary][data-mode=stroke]{border:var(--stroke-width-selected) solid var(--color-tertiary-brand);color:var(--color-tertiary-brand)}[data-ui=button][data-variant=tertiary][data-mode=lighter]{background-color:var(--color-tertiary-container);color:var(--color-tertiary-on-container)}[data-ui=button][data-variant=tertiary][data-mode=ghost]{color:var(--color-tertiary-brand)}[data-ui=button][data-variant=destructive][data-mode=filled]{background-color:var(--color-intent-error);color:var(--color-intent-on-error)}[data-ui=button][data-variant=destructive][data-mode=stroke]{border:var(--stroke-width-selected) solid var(--color-intent-error);color:var(--color-intent-error)}[data-ui=button][data-variant=destructive][data-mode=lighter]{background-color:var(--color-intent-error-container);color:var(--color-intent-on-error-container)}[data-ui=button][data-variant=destructive][data-mode=ghost]{color:var(--color-intent-error)}[data-ui=button][data-variant=inverse][data-mode=filled]{background-color:var(--color-primary-on-brand);color:var(--color-primary-brand)}[data-ui=button][data-variant=inverse][data-mode=stroke]{border:var(--stroke-width-selected) solid color-mix(in oklch, var(--color-primary-on-brand), transparent 55%);color:var(--color-primary-on-brand)}[data-ui=button][data-variant=inverse][data-mode=lighter]{background-color:color-mix(in oklch, var(--color-primary-on-brand), transparent 86%);color:var(--color-primary-on-brand)}[data-ui=button][data-variant=inverse][data-mode=ghost]{color:var(--color-primary-on-brand)}[data-ui=button][data-variant=featured]{color:var(--color-primary-on-brand);background-image:linear-gradient(120deg, var(--color-primary-brand), var(--color-tertiary-brand), var(--color-primary-brand));background-position:0 0;background-size:200% 100%;border-color:#0000}[data-ui=button][data-variant=featured][data-gradient=primary-secondary]{background-image:linear-gradient(120deg, var(--color-primary-brand), var(--color-secondary-brand), var(--color-primary-brand))}[data-ui=button][data-variant=featured][data-gradient=primary-deep]{background-image:linear-gradient(120deg, var(--color-primary-brand), var(--foundation-color-black-alpha-100), var(--color-primary-brand))}[data-finish=brand] [data-ui=button][data-variant][data-mode]{background-color:var(--color-primary-on-brand);color:var(--color-primary-brand);background-image:none;border-color:#0000}@media (hover:hover){[data-ui=button][data-variant=primary][data-mode=filled]:hover{background-color:var(--color-primary-brand-hover)}[data-ui=button][data-variant=primary][data-mode=stroke]:hover,[data-ui=button][data-variant=primary][data-mode=ghost]:hover{background-color:color-mix(in oklch, var(--color-primary-container) calc(var(--opacity-faint) * 100%), transparent)}[data-ui=button][data-variant=primary][data-mode=lighter]:hover{background-color:color-mix(in oklch, var(--color-primary-container), var(--color-primary-brand) calc(var(--opacity-faint) * 100%))}[data-ui=button][data-variant=neutral][data-mode=filled]:hover{background-color:var(--theme-color-neutral-6)}[data-ui=button][data-variant=neutral][data-mode=stroke]:hover,[data-ui=button][data-variant=neutral][data-mode=ghost]:hover{background-color:color-mix(in oklch, var(--theme-color-neutral-5) calc(var(--opacity-faint) * 100%), transparent)}[data-ui=button][data-variant=neutral][data-mode=lighter]:hover{background-color:var(--theme-color-neutral-7)}[data-ui=button][data-variant=secondary][data-mode=filled]:hover{background-color:var(--color-secondary-brand-hover)}[data-ui=button][data-variant=secondary][data-mode=stroke]:hover,[data-ui=button][data-variant=secondary][data-mode=ghost]:hover{background-color:color-mix(in oklch, var(--color-secondary-container) calc(var(--opacity-faint) * 100%), transparent)}[data-ui=button][data-variant=secondary][data-mode=lighter]:hover{background-color:color-mix(in oklch, var(--color-secondary-container), var(--color-secondary-brand) calc(var(--opacity-faint) * 100%))}[data-ui=button][data-variant=tertiary][data-mode=filled]:hover{background-color:var(--color-tertiary-brand-hover)}[data-ui=button][data-variant=tertiary][data-mode=stroke]:hover,[data-ui=button][data-variant=tertiary][data-mode=ghost]:hover{background-color:color-mix(in oklch, var(--color-tertiary-container) calc(var(--opacity-faint) * 100%), transparent)}[data-ui=button][data-variant=tertiary][data-mode=lighter]:hover{background-color:color-mix(in oklch, var(--color-tertiary-container), var(--color-tertiary-brand) calc(var(--opacity-faint) * 100%))}[data-ui=button][data-variant=destructive][data-mode=filled]:hover{background-color:var(--color-intent-error-hover)}[data-ui=button][data-variant=destructive][data-mode=stroke]:hover,[data-ui=button][data-variant=destructive][data-mode=ghost]:hover{background-color:color-mix(in oklch, var(--color-intent-error-container) calc(var(--opacity-faint) * 100%), transparent)}[data-ui=button][data-variant=destructive][data-mode=lighter]:hover{background-color:color-mix(in oklch, var(--color-intent-error-container), var(--color-intent-error) calc(var(--opacity-faint) * 100%))}[data-ui=button][data-variant=inverse][data-mode=filled]:hover{background-color:color-mix(in oklch, var(--color-primary-on-brand), var(--color-primary-brand) calc(var(--opacity-faint) * 100%))}[data-ui=button][data-variant=inverse][data-mode=stroke]:hover,[data-ui=button][data-variant=inverse][data-mode=ghost]:hover{background-color:color-mix(in oklch, var(--color-primary-on-brand) calc(var(--opacity-faint) * 100%), transparent)}[data-ui=button][data-variant=inverse][data-mode=lighter]:hover{background-color:color-mix(in oklch, var(--color-primary-on-brand), transparent 80%)}[data-ui=button][data-variant=featured]:hover{background-position:100% 0}[data-finish=brand] [data-ui=button][data-variant][data-mode]:hover{background-color:color-mix(in oklch, var(--color-primary-on-brand), var(--color-primary-brand) calc(var(--opacity-faint) * 100%))}}[data-ui=button]:active{scale:.96}[data-ui=button]:focus-visible{outline:var(--stroke-width-focused) solid var(--color-border-focus-outline);outline-offset:var(--spacing-050)}[data-ui=button][data-disabled],[data-ui=button]:disabled{opacity:var(--opacity-soft);pointer-events:none;cursor:not-allowed}@media (prefers-reduced-motion:reduce){[data-ui=button]{transition:none}[data-ui=button]:active{scale:1}}}
