/* Боковые уведомления: цветной акцент, иконка, полоса времени, пауза при наведении */
.toasts{position:fixed;right:20px;top:72px;z-index:100;display:flex;flex-direction:column;gap:10px;width:340px;max-width:calc(100vw - 24px);pointer-events:none}
.toast{pointer-events:auto;position:relative;display:flex;align-items:flex-start;gap:10px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--tc);border-radius:var(--r-l);box-shadow:var(--shadow);padding:12px 12px 14px;overflow:hidden;animation:toast-in .18s ease-out}
.toast--success{--tc:#2FB45A}.toast--error{--tc:#E0483E}.toast--warning{--tc:#E8943A}.toast--info{--tc:#3F5CE5}
.toast .i{color:var(--tc);margin-top:1px}
.toast__text{flex:1;line-height:1.4}
.toast__close{border:0;background:none;color:var(--muted);padding:0;width:22px;height:22px;display:grid;place-items:center;border-radius:4px}
.toast__close:hover{background:#F1F3F8;color:var(--text)}
.toast__bar{position:absolute;left:0;bottom:0;height:3px;background:var(--tc);opacity:.35;width:100%;transform-origin:left}
.toast.is-leaving{opacity:0;transform:translateX(12px);transition:opacity .2s,transform .2s}
@keyframes toast-in{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}
@media (max-width:600px){.toasts{right:12px;left:12px;width:auto;top:auto;bottom:16px}}