@layer reset,tokens,base,components,utilities;@layer components{.button{--button-bg: var(--color-accent);--button-fg: var(--color-accent-foreground);--button-border: transparent;--button-bg-hover: var(--color-accent-hover);--button-bg-active: var(--color-accent-active);--button-radius: var(--radius-md);--button-px: var(--space-5);--button-py: var(--space-3);--button-font: var(--font-size-md);--button-min-h: 2.75rem;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-block-size:var(--button-min-h);padding-inline:var(--button-px);padding-block:var(--button-py);border-radius:var(--button-radius);border:1px solid var(--button-border);background:var(--button-bg);color:var(--button-fg);font:inherit;font-size:var(--button-font);font-weight:var(--font-weight-medium);line-height:1;text-decoration:none;cursor:pointer;user-select:none;transition:background-color var(--duration-fast) var(--easing-standard),transform var(--duration-fast) var(--easing-standard),box-shadow var(--duration-fast) var(--easing-standard)}.button:hover{background:var(--button-bg-hover)}.button:active{background:var(--button-bg-active);transform:translateY(1px)}.button:disabled,.button[aria-disabled=true]{background:var(--color-button-disabled-bg);color:var(--color-button-disabled-fg);border-color:transparent;cursor:not-allowed;pointer-events:none}.button[data-variant=secondary]{--button-bg: var(--color-secondary);--button-fg: var(--color-secondary-foreground);--button-bg-hover: var(--color-secondary-hover);--button-bg-active: color-mix(in oklab, var(--color-secondary) 75%, #000)}.button[data-variant=ghost]{--button-bg: transparent;--button-fg: var(--color-text-default);--button-border: transparent;--button-bg-hover: var(--color-button-ghost-hover-overlay);--button-bg-active: var(--color-button-ghost-active-overlay)}.button[data-variant=outline]{--button-bg: transparent;--button-fg: var(--color-text-brand);--button-border: var(--color-accent);--button-bg-hover: var(--color-accent-soft);--button-bg-active: color-mix(in oklab, var(--color-accent) 18%, transparent)}.button[data-variant=outline]:hover{color:var(--color-accent-hover);border-color:var(--color-accent-hover)}.button[data-variant=outline]:active{color:var(--color-accent-active)}.section[data-tone=inverse] .button[data-variant=outline],.cta-block[data-variant=inverse] .button[data-variant=outline]{--button-fg: var(--color-text-inverse);--button-border: color-mix(in oklab, var(--color-text-inverse) 60%, transparent);--button-bg-hover: color-mix(in oklab, var(--color-text-inverse) 10%, transparent)}.button[data-variant=gradient]{--button-bg: var(--gradient-brand);--button-fg: #fff;--button-border: transparent;background-image:var(--button-bg);background-size:200% 100%;background-position:0% 0%;transition:background-position var(--duration-normal) var(--easing-standard),transform var(--duration-fast) var(--easing-standard),box-shadow var(--duration-fast) var(--easing-standard)}.button[data-variant=gradient]:hover{background-position:100% 0%}.button[data-variant=gradient]:active{transform:translateY(1px);filter:brightness(.95)}.button[data-variant=gradient]:focus-visible{box-shadow:0 0 0 2px var(--color-bg-default),0 0 0 5px color-mix(in oklab,var(--color-accent) 55%,transparent)}.button[data-size=sm]{--button-px: var(--space-4);--button-py: var(--space-2);--button-font: var(--font-size-sm);--button-min-h: 2.25rem;--button-radius: var(--radius-sm)}.button[data-size=lg]{--button-px: var(--space-6);--button-py: var(--space-4);--button-font: var(--font-size-lg);--button-min-h: 3.25rem}.button--full{inline-size:100%}.button[data-variant=primary]:focus-visible,.button[data-variant=secondary]:focus-visible{box-shadow:0 0 0 2px var(--button-bg),0 0 0 5px color-mix(in oklab,var(--button-bg) 35%,#fff)}.button[data-loading]{pointer-events:none;cursor:progress}.button[data-loading] .button__label{opacity:.6}.button__spinner{inline-size:1em;block-size:1em;border-radius:50%;border:2px solid currentColor;border-inline-start-color:transparent;animation:button-spin .7s linear infinite}@keyframes button-spin{to{transform:rotate(1turn)}}@media(prefers-reduced-motion:reduce){.button__spinner{animation-duration:1.6s}}}