@layer components {
  .flash {
    --padding-block: 0.7em;
    --padding-inline: 1.3em;

    animation: slide-up-then-down 4s 300ms both;
    background-color: var(--tint-ink-80);
    border-radius: 5em;
    color: var(--color-ink-inverted);
    display: inline-flex;
    inset-block-end: 0;
    inset-inline-start: 50%;
    margin: var(--block-space) auto;
    padding: var(--padding-block) var(--padding-inline);
    position: fixed;
    translate: -50% 0;
    white-space: nowrap;
    z-index: 10;
  }
}
