.l-btn{--btn-bg:transparent;--btn-fg:var(--l-text);--btn-border:transparent;--btn-shadow:none;justify-content:center;align-items:center;gap:var(--l-space-2);min-height:var(--l-tap-min);padding:0 var(--l-space-4);border:1px solid var(--btn-border);border-radius:var(--l-radius-lg);background:var(--btn-bg);color:var(--btn-fg);box-shadow:var(--btn-shadow);font:var(--l-type-body);white-space:nowrap;cursor:pointer;transition:transform var(--l-dur-fast) var(--l-ease-out), background-color var(--l-dur-base) var(--l-ease-out), border-color var(--l-dur-base) var(--l-ease-out), opacity var(--l-dur-base) var(--l-ease-out);font-weight:650;display:inline-flex;position:relative}.l-btn:after{content:"";inset:var(--l-tap-inset);position:absolute}.l-btn:active:not(:disabled){transform:scale(.97)}.l-btn:disabled{opacity:.45;cursor:not-allowed}.l-btn--primary{--btn-bg:var(--l-accent);--btn-fg:var(--l-text-on-accent);--btn-shadow:0 0 20px var(--l-accent-glow)}.l-btn--primary:hover:not(:disabled){--btn-bg:color-mix(in srgb, var(--l-accent) 88%, var(--l-text))}.l-btn--secondary{--btn-bg:var(--l-surface-2);--btn-border:var(--l-border)}.l-btn--secondary:hover:not(:disabled){--btn-border:var(--l-accent-border)}.l-btn--ghost{--btn-fg:var(--l-text-muted)}.l-btn--ghost:hover:not(:disabled){--btn-bg:var(--l-surface-sunken);--btn-fg:var(--l-text)}.l-btn--danger{--btn-bg:var(--l-danger-soft);--btn-fg:var(--l-danger);--btn-border:color-mix(in srgb, var(--l-danger) 45%, transparent)}.l-btn--text{--btn-bg:transparent;--btn-fg:var(--l-accent);gap:6px}.l-btn--text:hover:not(:disabled){--btn-bg:var(--l-accent-soft)}.l-btn--sm{min-height:36px;padding:0 var(--l-space-3);border-radius:var(--l-radius-md);font-size:13px}.l-btn--lg{min-height:48px;padding:0 var(--l-space-6);font-size:15px}.l-btn--block{width:100%}.l-btn__icon{place-items:center;display:grid}.l-btn__icon svg{width:18px;height:18px}.l-btn--text.l-btn--sm .l-btn__icon svg{width:16px;height:16px}.l-btn.is-loading .l-btn__label,.l-btn.is-loading .l-btn__icon{opacity:0}.l-btn__spinner{border:2px solid color-mix(in srgb, currentColor 30%, transparent);border-top-color:currentColor;border-radius:50%;width:18px;height:18px;animation:.7s linear infinite l-spin;position:absolute}@keyframes l-spin{to{transform:rotate(360deg)}}
