.app-toast {
  position: fixed;
  inset: max(1rem, env(safe-area-inset-top)) auto auto 50%;
  translate: -50% 0;
  transform: none;
  z-index: 1000;
  width: max-content;
  min-width: 0;
  max-width: calc(100vw - 2rem);
  padding: 0;
  pointer-events: none;
}
.app-toast[hidden] { display: none; }
.app-toast > .alert {
  grid-template-columns: minmax(0, 1fr) auto;
  width: 100%;
  max-width: 36rem;
  gap: .75rem;
  padding: .75rem 1rem;
  border-radius: .75rem;
  text-align: left;
  white-space: normal;
  pointer-events: auto;
}
.app-toast [role="status"] { min-width: 0; overflow-wrap: anywhere; max-height: 40vh; overflow-y: auto; }