/* =====================================================================
   BUTTONS
   ===================================================================== */
.btn{
  padding: 10px 16px;
  border: 1px solid transparent;
  border-radius: var(--r-md);
  background: var(--accent);
  color: var(--accent-ink);
  font-weight: 700;
  font-size: 13.5px;
  cursor: pointer;
  transition: transform var(--dur-fast) var(--ease-out), filter var(--dur-fast), background var(--dur-fast);
}
.btn:hover{ filter: brightness(1.08); }
.btn:active{ transform: scale(.97); }
.btn:disabled{ opacity: .55; cursor: not-allowed; transform: none; }
.btn:focus-visible{ outline: 2px solid var(--accent); outline-offset: 2px; }

.btn-outline{
  background: transparent;
  color: var(--ink);
  border-color: var(--border-strong);
}
.btn-outline:hover{ filter: none; background: var(--surface-raised); }

.btn-danger{
  background: var(--danger-wash);
  color: var(--danger);
}
.btn-danger:hover{ filter: none; background: rgba(255,93,98,.2); }

.btn-sm{ padding: 6px 11px; font-size: 12px; border-radius: var(--r-sm); }