.button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:.375rem;font-weight:600!important;transition-property:color,background-color,border-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.25s;text-shadow:0 0 .1875rem rgba(0,0,0,.85);&:focus-visible{outline:none}&:disabled{pointer-events:none;opacity:.5}&.primary{background-color:var(--colors-cool-blue);color:var(--colors-mono-11);&:hover{background-color:rgba(var(--colors-cool-blue-rgb),.8)}}&.secondary{background-color:var(--color-gray-200);color:var(--color-gray-900);&:hover{background-color:var(--color-gray-300)}}&.outline{border:1px solid var(--color-gray-300);background-color:transparent;&:hover{background-color:var(--color-gray-50)}}&.ghost{&:hover{--blur-strength: .5rem;-webkit-backdrop-filter:blur(var(--blur-strength)) saturate(180%);backdrop-filter:blur(var(--blur-strength)) saturate(180%);background-color:rgba(var(--colors-mono-11-rgb),.05)}}&.danger{background-color:var(--color-red-600);color:#fff;&:hover{background-color:var(--color-red-700)}}&.xs{height:1.5rem;padding-left:.5rem;padding-right:.5rem;font-size:.75rem;line-height:1rem}&.sm{height:2rem;padding-left:.75rem;padding-right:.75rem;font-size:.875rem;line-height:1.25rem}&.md{height:2.5rem;padding-left:1rem;padding-right:1rem}&.lg{height:3rem;padding-left:1.5rem;padding-right:1.5rem;font-size:1.125rem;line-height:1.75rem}}
