@layer components{.specular-button{isolation:isolate;border-radius:var(--specular-radius);min-height:44px;color:var(--specular-text);background:linear-gradient(145deg, color-mix(in oklab, var(--specular-base) 20%, transparent), transparent 46%), color-mix(in srgb, var(--specular-tint) calc(var(--specular-tint-opacity) * 100%), transparent);-webkit-backdrop-filter:blur(var(--specular-blur)) saturate(1.08);backdrop-filter:blur(var(--specular-blur)) saturate(1.08);font-family:var(--font-sans);letter-spacing:.015em;cursor:pointer;border:0;justify-content:center;align-items:center;font-size:.875rem;font-weight:600;line-height:1;text-decoration:none;transition:transform .22s,box-shadow .22s,opacity .22s;display:inline-flex;position:relative;overflow:hidden;transform:translateY(0)scale(1);box-shadow:inset 0 1px oklch(100% 0 0/.16),inset 0 -1px oklch(0% 0 0/.18),0 10px 24px oklch(18% .02 250/.16)}.specular-button:before{content:"";z-index:0;border-radius:inherit;pointer-events:none;border:1px solid oklch(100% 0 0/.2);position:absolute;inset:0}.specular-button--sm{padding:.7rem 1.2rem}.specular-button--md{padding:.8rem 1.5rem}.specular-button--lg{min-height:48px;padding:.9rem 1.75rem;font-size:.9375rem}.specular-button__canvas-host,.specular-button__canvas{border-radius:inherit;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.specular-button__canvas-host{z-index:1;overflow:hidden}.specular-button__canvas{display:block}.specular-button__label{z-index:2;position:relative}.specular-button:focus-visible{outline:2px solid var(--lekker-botanical);outline-offset:3px}.specular-button:disabled{cursor:not-allowed;opacity:.52}@media (hover:hover) and (pointer:fine){.specular-button:not(:disabled):hover{transform:translateY(-1px);box-shadow:inset 0 1px oklch(100% 0 0/.2),inset 0 -1px oklch(0% 0 0/.18),0 12px 26px oklch(18% .02 250/.18)}}.specular-button:not(:disabled):active{transform:scale(.98)}@media (prefers-reduced-motion:reduce),(pointer:coarse){.specular-button{transition:none}.specular-button:not(:disabled):hover{transform:none}}@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){.specular-button{background:var(--specular-tint)}}}