@layer components{[data-ui=button]{--svg-size:18px;height:var(--button-size);white-space:nowrap;width:fit-content;font:var(--font-body-md);cursor:pointer;transition:background-color var(--transition-expressive-fast-effects), border-color var(--transition-expressive-fast-effects), box-shadow var(--transition-expressive-fast-effects), color var(--transition-expressive-fast-effects), scale var(--transition-expressive-fast-effects);-webkit-user-select:none;user-select:none;border:1px solid;outline:none;flex-shrink:0;justify-content:center;align-items:center;text-decoration:none;display:inline-flex}[data-ui=button][data-size=lg]{--button-size:40px;--svg-as-icon-size:var(--spacing-24);font-size:var(--font-body-lg);border-radius:var(--radius-md);padding-inline:var(--spacing-16);gap:var(--spacing-16)}[data-ui=button][data-size=md]{--button-size:36px;--svg-as-icon-size:18px;padding-inline:var(--spacing-12);border-radius:var(--radius-md);gap:var(--spacing-12)}[data-ui=button][data-size=sm]{--button-size:28px;--svg-as-icon-size:var(--spacing-14);font:var(--font-body-sm);border-radius:var(--radius-sm);padding-inline:var(--spacing-8);gap:var(--spacing-8)}[data-ui=button][data-mode=filled]{background-color:var(--color-button);color:var(--color-on-button);border-color:#0000}@media (hover:hover) and (pointer:fine){[data-ui=button][data-mode=filled]:hover:not(:disabled,[aria-disabled=true]){background-color:color-mix(in srgb, var(--color-button), black 10%)}}[data-ui=button][data-mode=stroke]{border-color:var(--color-button-border);background-color:var(--color-on-button);color:var(--color-button)}@media (hover:hover) and (pointer:fine){[data-ui=button][data-mode=stroke]:hover:not(:disabled,[aria-disabled=true]){background-color:var(--color-button-container);border-color:#0000}}[data-ui=button][data-mode=lighter]{background-color:var(--color-button-container);color:var(--color-button);border-color:#0000}@media (hover:hover) and (pointer:fine){[data-ui=button][data-mode=lighter]:hover:not(:disabled,[aria-disabled=true]){border-color:var(--color-button-border);background-color:#0000}}[data-ui=button][data-mode=ghost]{color:var(--color-button);background-color:#0000;border-color:#0000}@media (hover:hover) and (pointer:fine){[data-ui=button][data-mode=ghost]:hover:not(:disabled,[aria-disabled=true]){background-color:var(--color-button-container)}}[data-ui=button][data-variant=primary]{--color-button:var(--color-primary);--color-on-button:var(--color-on-primary);--color-button-border:var(--color-primary);--color-button-container:var(--color-primary-container);--color-button-focus-ring:var(--color-primary)}[data-ui=button][data-variant=neutral]{--color-button:var(--color-on-surface);--color-on-button:var(--color-surface-container-lowest);--color-button-border:var(--color-surface-variant);--color-button-container:var(--color-surface-container-low);--color-button-focus-ring:var(--color-primary)}@media (hover:hover) and (pointer:fine){[data-ui=button][data-mode=filled][data-variant=neutral]:hover:not(:disabled,[aria-disabled=true]){background-color:color-mix(in srgb, var(--color-button), var(--color-on-button) 10%)}}[data-ui=button][data-variant=link]{--color-button:transparent;--color-on-button:var(--color-on-surface);--color-button-border:transparent;--color-button-container:transparent;--color-button-focus-ring:var(--color-primary);background:linear-gradient(currentColor 0 0) 0 100%,linear-gradient(currentColor 0 0) 0 100%,linear-gradient(currentColor 0 0) 100% 0,linear-gradient(currentColor 0 0) 100% 0;background-size:var(--d,0) 1px, 1px var(--d,0);background-repeat:no-repeat;border-radius:0}@media (hover:hover) and (pointer:fine){[data-ui=button][data-variant=link]:hover:not(:disabled,[aria-disabled=true]){--d:10px;background-color:#0000}}[data-ui=button][data-variant=error]{--color-button:var(--color-error);--color-on-button:var(--color-on-error);--color-button-border:var(--color-error);--color-button-container:var(--color-error-container);--color-button-focus-ring:var(--color-error)}[data-ui=button]:active{scale:.97}[data-ui=button]:focus-visible{box-shadow:0 0 0 3px color-mix(in oklab, var(--color-button-focus-ring) 35%, transparent)}[data-ui=button]:disabled,[data-ui=button][aria-disabled=true]{background-color:var(--color-surface-container);color:color-mix(in srgb, var(--color-on-surface) 38%, transparent);pointer-events:none;-webkit-user-select:none;user-select:none;border-color:#0000}[data-ui=button][data-as-icon=true]{width:var(--button-size)}[data-ui=button][data-as-icon=false] svg{margin-inline:calc(var(--spacing-4) * -1);width:var(--svg-size);height:var(--svg-size)}[data-ui=button][data-as-icon=true]{padding-inline:var(--spacing-4)}[data-ui=button][data-as-icon=true] svg{width:var(--svg-as-icon-size);height:var(--svg-as-icon-size)}}