.btn {
  min-height: var(--touch); padding: 0 20px; border-radius: 999px; border: 1px solid var(--line);
  background: var(--surface); color: var(--text); font-weight: 700; font-size: .9375rem;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; text-decoration: none;
  transition: transform .15s var(--ease), background .2s, border-color .2s;
}
.btn:active { transform: scale(.97); }
.btn:hover { border-color: var(--hover-line); }
.btn-primary { background: var(--primary-fill); color: var(--on-primary-fill); border-color: transparent; }
.btn-primary:hover { border-color: transparent; filter: brightness(1.08); }
.btn-ghost { background: transparent; border-color: transparent; }
.btn-danger { color: var(--danger-fg); }
.btn-block { width: 100%; }
.btn-row { display: flex; gap: 8px; flex-wrap: wrap; }