.lead-notifications {
    position: fixed;
    right: max(20px, env(safe-area-inset-right));
    bottom: calc(20px + env(safe-area-inset-bottom));
    z-index: 11000;
    width: 360px;
    max-width: calc(100% - 40px);
    pointer-events: none;
    font-family: 'Onest', sans-serif;
    letter-spacing: 0;
}

.lead-notification {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 16px;
    border: 1px solid #cbd5df;
    border-radius: 8px;
    background: #dde4eb;
    color: #323940;
    box-shadow: 0 8px 28px rgba(24, 34, 44, .14);
    pointer-events: auto;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .18s ease, transform .18s ease;
}

.lead-notification.is-visible { opacity: 1; transform: translateY(0); }
.lead-notification__icon { display: grid; place-items: center; flex: 0 0 28px; width: 28px; height: 28px; border-radius: 4px; background: rgba(10, 207, 151, .18); color: #087655; }
.lead-notification--error .lead-notification__icon { background: rgba(180, 35, 24, .12); color: #b42318; }
.lead-notification__icon svg { width: 18px; height: 18px; }
.lead-notification__body { flex: 1; min-width: 0; }
.lead-notification .lead-notification__title { margin: 0 0 6px; color: #596775; font-size: 12px; line-height: 16px; font-weight: 400; }
.lead-notification .lead-notification__message { margin: 0; color: #323940; font-size: 14px; line-height: 21px; font-weight: 500; overflow-wrap: anywhere; }
.lead-notification__close { display: grid; place-items: center; flex: 0 0 28px; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 4px; background: transparent; color: #596775; cursor: pointer; transition: background-color .18s; }
.lead-notification__close svg { width: 18px; height: 18px; pointer-events: none; }
.lead-notification__close:hover { background: rgba(50, 57, 64, .08); }
.lead-notification__close:focus-visible { outline: 2px solid #323940; outline-offset: 2px; }

@media (max-width: 575px) {
    .lead-notifications { right: max(12px, env(safe-area-inset-right)); bottom: calc(12px + env(safe-area-inset-bottom)); max-width: calc(100% - 24px); }
}

@media (prefers-reduced-motion: reduce) {
    .lead-notification { transition: none; transform: none; }
}
