/* Filled brand actions mark a page or form's main commitment. Repeated card
   actions, secondary buttons and utility controls use their lighter variants. */
:root :is(.button-primary, .button-accent, .pers-primary) {
  color: #fff;
  background: var(--cta);
  border-color: var(--cta);
  box-shadow: none;
}
:root :is(.button-primary, .button-accent, .pers-primary):hover:not(:disabled) {
  color: #fff;
  background: var(--cta-hover);
  border-color: var(--cta-hover);
}
:root :is(.button-primary, .button-accent, .pers-primary):active:not(:disabled) {
  background: var(--cta-active);
}
:root :is(.button-primary, .button-accent, .pers-primary):disabled {
  color: var(--muted);
  background: var(--surface-muted);
  border-color: var(--line);
  opacity: 1;
  box-shadow: none;
  cursor: not-allowed;
  transform: none;
}
:root :is(.button, .pers-button, .text-button, .icon-button, .avatar-rename,
  .inline-action, .copy-code, .ac-text-button, .ac-close, .ac-asset-integration,
  .ac-actions button, .ac-more-options button, .ac-card-actions button,
  .pers-more-actions > summary):focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
}