@layer components{.button{--button-background:var(--color-primary);--button-border:var(--color-primary);--button-foreground:var(--color-on-primary);--button-focus-ring:color-mix(in srgb, var(--button-border) 35%, transparent);--button-shadow:#4f46e53d;isolation:isolate;min-width:0;max-width:100%;min-height:var(--button-height);border:1px solid var(--button-border);height:auto;padding:0 var(--button-padding);appearance:none;background:var(--button-background);box-shadow:inset 0 1px #ffffff29, 0 8px 18px -12px var(--button-shadow);color:var(--button-foreground);cursor:pointer;font:inherit;font-size:var(--button-font-size);border-radius:.625rem;justify-content:center;align-items:center;gap:.375rem;font-weight:700;line-height:1;transition:background-color .16s,border-color .16s,box-shadow .16s,transform .16s;display:inline-flex;position:relative;overflow:hidden}.button:before{z-index:1;background:linear-gradient(110deg, transparent, color-mix(in srgb, var(--button-foreground) 46%, transparent) 46%, transparent);content:"";pointer-events:none;transition:opacity .16s,transform .46s cubic-bezier(.22,1,.36,1);position:absolute;inset:-35% -65%;transform:translate(-54%)skew(-18deg)}.button[data-size=sm]{--button-height:2.25rem;--button-padding:.75rem;--button-font-size:.8125rem}.button[data-size=md]{--button-height:2.5rem;--button-padding:1rem;--button-font-size:.875rem}.button[data-size=lg]{--button-height:3.25rem;--button-padding:1.25rem;--button-font-size:.9375rem}.button[data-variant=secondary]{--button-background:var(--color-canvas);--button-border:color-mix(in srgb, var(--color-text-muted) 18%, var(--color-border));--button-focus-ring:color-mix(in srgb, var(--color-primary) 35%, transparent);--button-foreground:var(--color-text);--button-shadow:#1822301a}.button[data-variant=accent]{--button-foreground:var(--color-on-accent);--button-background:var(--color-accent);--button-border:var(--color-accent);--button-shadow:#0d948842}.button[data-variant=danger]{--button-foreground:var(--color-on-danger);--button-background:var(--color-danger);--button-border:var(--color-danger);--button-shadow:#dc262640}.button[data-variant=ghost]{--button-background:transparent;--button-border:transparent;--button-focus-ring:color-mix(in srgb, var(--color-primary) 35%, transparent);--button-foreground:var(--color-text-muted);--button-shadow:transparent;box-shadow:none}.button[data-variant=ghost]:before{opacity:0}.button:hover:not(:disabled){background:color-mix(in srgb, var(--button-background) 90%, var(--color-text));border-color:color-mix(in srgb, var(--button-border) 86%, var(--color-text));box-shadow:0 13px 26px -14px var(--button-shadow)}.button:hover:not(:disabled):before,.button:focus-visible:before{transform:translate(54%)skew(-18deg)}.button[data-variant=secondary]:hover:not(:disabled){background:color-mix(in srgb, var(--color-primary) 4%, var(--color-canvas));border-color:color-mix(in srgb, var(--color-primary) 28%, var(--color-border))}.button[data-variant=ghost]:hover:not(:disabled){box-shadow:none;background:0 0;border-color:#0000}.button[data-variant=ghost] .button__label:after{content:"";opacity:0;transform-origin:50%;background:#9ca3af;height:1px;transition:opacity .18s,transform .18s;position:absolute;bottom:-.25rem;left:0;right:0;transform:scaleX(.6)}.button[data-variant=ghost]:hover:not(:disabled) .button__label:after{opacity:1;transform:scaleX(1)}.button:focus-visible{box-shadow:0 0 0 3px var(--button-focus-ring), 0 8px 18px -12px var(--button-shadow);outline:none}.button:active:not(:disabled){box-shadow:0 5px 12px -10px var(--button-shadow);transform:translateY(0)scale(.98)}.button:disabled{box-shadow:none;cursor:not-allowed;opacity:.52}.button--icon-only{width:var(--button-height);height:var(--button-height);min-width:0;padding:0}.button__icon{z-index:2;flex:none;display:inline-flex;position:relative}.button__icon>svg{width:1.3em;height:1.3em}.button__spinner{border:2px solid;border-right-color:#0000;border-radius:999px;width:1em;height:1em;animation:.65s linear infinite button-spin;display:inline-block}.button__label{z-index:2;overflow-wrap:break-word;text-align:center;min-width:0;line-height:1.25;position:relative}@keyframes button-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.button,.button__spinner{transition:none;animation:none}.button:before{display:none}}}