.button{justify-content:center;align-items:center;gap:var(--spacing-sm);min-height:var(--control-size-md);min-width:var(--tap-min);padding:var(--spacing-xs) var(--spacing-lg);border:var(--border-width-hairline) solid transparent;border-radius:var(--radius-md);color:var(--color-text);font-size:var(--font-size-body);font-weight:var(--font-weight-semibold);text-align:center;cursor:pointer;transition:background-color var(--duration-fast) var(--easing-out), border-color var(--duration-fast) var(--easing-out);background:0 0;text-decoration:none;display:inline-flex}.button[data-size=S]{min-height:var(--control-size-sm);padding-inline:var(--spacing-md)}.button[data-size=L]{min-height:var(--control-size-lg);padding-inline:var(--spacing-xl);font-size:var(--font-size-subtitle)}.button[data-full-width=true]{width:100%}.button[data-variant=primary]{background:var(--color-primary);color:var(--color-text-on-primary)}.button[data-variant=secondary]{border-color:var(--color-primary)}.button[data-variant=ghost]{padding-inline:var(--spacing-sm);color:var(--color-link)}@media (hover:hover){.button[data-variant=primary]:not(:disabled):hover{background:var(--color-primary-hover)}.button[data-variant=secondary]:not(:disabled):hover,.button[data-variant=ghost]:not(:disabled):hover{background:var(--color-surface-2)}}a.button:active{opacity:var(--opacity-pressed)}.button__icon{flex:none;display:flex}.button__icon>svg{width:var(--icon-size-md);height:var(--icon-size-md)}.button[data-size=S] .button__icon>svg{width:var(--icon-size-sm);height:var(--icon-size-sm)}