.app-notices {
  position: fixed; top: 5rem; right: 1.25rem; z-index: 1090;
  width: min(29rem, calc(100vw - 2rem)); max-height: calc(100vh - 6rem);
  overflow-y: auto; pointer-events: none;
}
.app-notice {
  display: flex; align-items: flex-start; gap: .8rem; margin: 0 0 .75rem;
  padding: 1rem; background: #fff; color: #1e293b; border: 1px solid #cbd5e1;
  border-left: 5px solid #2563eb; border-radius: .6rem;
  box-shadow: 0 .4rem 1.5rem #0f172a26; pointer-events: auto;
}
.app-notice[hidden] { display: none; }
.app-notice--success { border-left-color: #15803d; }
.app-notice--warning { border-left-color: #b45309; }
.app-notice--error { border-left-color: #b91c1c; }
.app-notice__text { flex: 1; line-height: 1.5; overflow-wrap: anywhere; }
.app-notice__close {
  flex: 0 0 1.5rem; background: none; border: 0; padding: 0;
  color: #475569; font-size: 1.5rem; line-height: 1; cursor: pointer;
}
.app-notice__close:focus-visible { outline: 2px solid #2563eb; outline-offset: 3px; }
@media (max-width: 575.98px) { .app-notices { right: 1rem; top: 4.5rem; } }