#notifications{position:fixed;top:170px;right:16px;width:min(400px,calc(100vw - 32px));z-index:20;display:flex;flex-direction:column;gap:10px;overflow:auto;pointer-events:none;max-height:calc(100dvh - 180px)}
.notification{position:relative;flex:none;pointer-events:auto;background:#252236;color:#f0f0f5;border:1px solid #8e83b5;border-left-width:4px;border-radius:8px;padding:14px 48px 14px 16px;box-shadow:0 8px 30px #0006;overflow-wrap:anywhere;white-space:pre-wrap}
.notification[hidden],.notification-close[hidden]{display:none}
.notification[data-kind=error]{background:#38212b;border-color:#ef8e9f}
.notification[data-kind=warning]{background:#342b1d;border-color:#e7bd6b}
.notification[data-kind=success]{background:#19342d;border-color:#7bd1b3}
.notification[data-kind=info]{background:#202e40;border-color:#87bcef}
#notifications #loadStatus,#notifications #loadError,#notifications #toast{position:static;transform:none;margin:0!important;padding:0;max-height:none;overflow:visible;background:none;border:0;box-shadow:none;color:inherit;font:inherit;border-radius:0}
#notifications #loadStatus:empty,#notifications #loadError[hidden]{display:none}
.notification-close{position:absolute;right:6px;top:6px;width:36px;height:36px;padding:0;font-size:22px;background:transparent;border:0}
@media(max-width:600px){#notifications{right:8px;width:calc(100vw - 16px)}}

#notifications #loadError:not([hidden]) + #loadStatus:not(:empty){margin-top:8px!important}
