.btn { --bs-btn-font-weight: 700; --bs-btn-border-radius: 12px; min-height: 44px; padding-inline: 17px; transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .1s ease; }
.btn:active { transform: scale(.98); }
.btn-primary { --bs-btn-bg: var(--brand); --bs-btn-border-color: var(--brand); --bs-btn-hover-bg: var(--brand-dark); --bs-btn-hover-border-color: var(--brand-dark); }
.btn-dark { --bs-btn-bg: var(--ink); --bs-btn-border-color: var(--ink); }
.btn-soft { background: var(--surface-2); color: var(--ink); border: 1px solid var(--line); }
.btn-soft:hover { background: #e4e9e1; }
.btn-icon-text { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.btn-icon-text svg { width: 17px; }

.icon-button { border: 0; width: 40px; height: 40px; border-radius: 12px; display: inline-grid; place-items: center; background: transparent; color: var(--ink-2); transition: .2s ease; }
.icon-button:hover { background: var(--surface-2); color: var(--ink); }
.icon-button:active { transform: scale(.96); }