.d-toast { --toast-ms: 5s; }
/* Server flashes and asynchronous actions use the same design toast.
   Metadata, persistent errors, two messages and focus/hover pauses are
   application behavior beyond the prototype's single temporary pill. */
.d-toasts { position: fixed; left: 50%; bottom: 1.5rem; transform: translateX(-50%); z-index: 70; display: grid; justify-items: center; gap: .5rem; width: max-content; max-width: calc(100vw - 2rem); }
body .d-toasts > .d-toast { position: relative; left: auto; bottom: auto; transform: none; max-width: 100%; animation-name: d-message-in; }
.d-toasts .d-toast.is-leaving { animation-name: d-message-out; }
.d-toast__body { display: grid; min-width: 0; }
.d-toast__meta { display: block; font: 400 var(--t-data-s) var(--font-data); opacity: .8; font-variant-ligatures: none; }
.d-toast__undo { margin: 0; }
.d-toast__action { border: 0; background: color-mix(in srgb, var(--ground) 16%, transparent); color: var(--ground); padding: .25rem .75rem; border-radius: var(--r-pill); font-weight: 600; text-decoration: none; }
.d-toast.is-paused::after { animation-play-state: paused; }
@keyframes d-message-in { from { opacity: 0; transform: translateY(1rem) scale(.96); } }
@keyframes d-message-out { to { opacity: 0; transform: translateY(.5rem) scale(.98); } }
body:has(.d-savebar:not([hidden])) .d-toasts { bottom: 6.5rem; }
@media (max-width: 56.25em) {
  /* POST forms do not introduce boxes inside the phone action bar. */
  [data-actbar] form { display: contents; }
  .d-toasts { bottom: calc(3.75rem + env(safe-area-inset-bottom) + .75rem); }
  .d-toasts .d-toast { white-space: normal; }
  .has-actbar .d-toasts { bottom: calc(3.75rem + env(safe-area-inset-bottom) + var(--tap) + 1.75rem); }
}

/* Account actions before workspace setup use the sign-in card without a shell. */
.au-account-action .d-dialog { width: 100%; max-width: none; margin: 0; border: 0; border-radius: 0; box-shadow: none; }
.au-account-action .d-dialog__head { position: static; padding: 0 0 .875rem; background: none; }
.au-account-action .d-dialog__body { padding: 0; }
.au-account-action .d-dialog__foot { position: static; padding: .875rem 0 0; margin-top: .875rem; background: none; }
