@keyframes copy-bounce {
  0% { transform: scale(1); }
  40% { transform: scale(0.88); }
  70% { transform: scale(1.1); }
  100% { transform: scale(1); }
}

.button {
  border: none;
  border-radius: var(--radius);
  font-family: "DM Sans", sans-serif;
  font-weight: 500;
  cursor: pointer;
  transition: background-color var(--transition), opacity var(--transition), transform var(--transition);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-shrink: 0;
}

.button:active {
  transform: scale(0.97);
}

.primary-button {
  background: var(--accent);
  color: var(--accent-text);
  padding: 13px 20px;
  font-size: 0.875rem;
  width: 100%;
}

.primary-button:hover {
  opacity: 0.8;
}

.copy-button {
  background: transparent;
  color: var(--fg);
  border: 1px solid var(--panel-border);
  padding: 8px 16px;
  font-size: 0.8rem;
  transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.copy-button:hover {
  border-color: var(--fg);
}

.copy-button.copied {
  background: var(--success);
  color: var(--success-text);
  border-color: var(--success);
  animation: copy-bounce 0.35s ease forwards;
}