:root {
  --ease-out-ui: cubic-bezier(.23,1,.32,1);
  --ease-in-out-ui: cubic-bezier(.77,0,.175,1);
}
button,
.button,
.choice-grid > button,
.question-editor,
.choice-action,
.check-row,
input,
textarea,
select {
  transition:
    transform 140ms var(--ease-out-ui),
    border-color 160ms ease,
    box-shadow 160ms ease,
    background-color 160ms ease,
    opacity 160ms ease;
}
button:active,
.button:active,
.choice-grid > button:active,
.choice-action:active {
  transform: scale(.97);
}
button:disabled,
.button:disabled {
  cursor: wait;
  opacity: .65;
}
button[aria-busy="true"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
:where(button,a,input,textarea,select,summary):focus-visible {
  outline: 3px solid rgba(49,94,244,.28);
  outline-offset: 2px;
}
input:focus,
textarea:focus,
select:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(49,94,244,.1);
}
.spinner {
  width: 13px;
  height: 13px;
  flex: 0 0 13px;
  border: 2px solid rgba(255,255,255,.42);
  border-top-color: currentColor;
  border-radius: 50%;
  animation: portly-spin 550ms linear infinite;
}
.google .spinner,
.text-button .spinner {
  border-color: rgba(23,23,20,.22);
  border-top-color: var(--ink);
}
@keyframes portly-spin { to { transform: rotate(360deg); } }
.save-feedback {
  min-width: 62px;
  color: var(--green);
  font-size: 11px;
  text-align: right;
  transition: opacity 140ms ease, filter 140ms ease;
}
.save-feedback.saving {
  color: var(--muted);
  filter: blur(.35px);
  opacity: .72;
}
.toast {
  min-width: min(360px,calc(100vw - 32px));
  max-width: 520px;
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 10px 30px rgba(23,23,20,.2);
  text-align: center;
  pointer-events: none;
  transition:
    transform 220ms var(--ease-out-ui),
    opacity 160ms ease !important;
}
.toast[data-tone="error"] {
  background: #8f3029;
}
.modal-backdrop {
  opacity: 1;
  transition: opacity 180ms ease;
  @starting-style { opacity: 0; }
}
.resolver-modal {
  opacity: 1;
  transform: translateY(0) scale(1);
  transition:
    transform 220ms var(--ease-out-ui),
    opacity 160ms ease;
  @starting-style {
    opacity: 0;
    transform: translateY(10px) scale(.98);
  }
}
.signer-card {
  opacity: 1;
  transform: translateY(0);
  transition:
    transform 200ms var(--ease-out-ui),
    opacity 160ms ease;
  @starting-style {
    opacity: 0;
    transform: translateY(7px);
  }
}
.stepper span,
.stepper b {
  transition:
    color 160ms ease,
    background-color 160ms ease,
    border-color 160ms ease,
    transform 160ms var(--ease-out-ui);
}
.stepper .current:last-of-type b {
  transform: scale(1.06);
}
.check {
  animation: portly-complete 280ms var(--ease-out-ui) both;
}
@keyframes portly-complete {
  from { opacity: 0; transform: scale(.9); }
  to { opacity: 1; transform: scale(1); }
}
.validation-strip,
.ready-strip,
.all-clear {
  transition:
    background-color 180ms ease,
    color 180ms ease,
    opacity 180ms ease;
}
@media (hover:hover) and (pointer:fine) {
  .button:hover { transform: translateY(-1px); }
  .question-editor:hover,
  .check-row:hover { border-color: #c6c1b6; }
  .choice-action:hover { box-shadow: 2px 2px 0 #dfe5ff; }
  .question-tools button:hover { color: var(--ink); }
}
@media (prefers-reduced-motion:reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  button:active,
  .button:active,
  .choice-grid > button:active,
  .choice-action:active {
    transform: none;
  }
}