.flash {
  inset-block-start: var(--block-space);
  inset-inline: 0;
  margin-inline: auto;
  max-inline-size: 40ch;
  padding-inline: 1rem;
  pointer-events: none;
  position: fixed;
  z-index: 50;
}

/* Rise-and-fade in, hold, fade out — timed to the 4s element-removal delay so
   the toast leaves gracefully instead of vanishing mid-screen. */
@media (prefers-reduced-motion: no-preference) {
  .flash {
    animation: appear-then-fade 4000ms ease both;
  }
}

.flash__inner {
  background-color: var(--color-ink);
  border-radius: 0.5em;
  box-shadow:
    0 4px 12px -2px oklch(var(--lch-always-black) / 0.18),
    0 2px 4px -2px oklch(var(--lch-always-black) / 0.12);
  color: var(--color-bg);
  padding: 0.7em 1em;
  pointer-events: auto;
}