#app-toasts {
    position: fixed;
    z-index: 2147483647;
    right: 1rem;
    bottom: 1rem;
    display: grid;
    gap: .65rem;
    width: min(24rem, calc(100vw - 2rem));
}

.app-toast {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: .35rem .8rem;
    padding: .9rem 1rem;
    color: #fff;
    border-radius: .65rem;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .25);
    font: 500 .9rem/1.4 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    animation: app-toast-in .2s ease-out;
}

.app-toast--success { background: #087f5b; }
.app-toast--warning { background: #a16207; }
.app-toast--error { background: #b42318; }
.app-toast--info { background: #1d4ed8; }
.app-toast__title { font-weight: 700; }
.app-toast__message { grid-column: 1; }
.app-toast__close { border: 0; padding: 0; color: inherit; background: transparent; font-size: 1.2rem; line-height: 1; cursor: pointer; }

@keyframes app-toast-in {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}