.toast-wrap{position:fixed;top:22px;left:50%;transform:translateX(-50%);z-index:9999;display:flex;flex-direction:column;gap:10px;pointer-events:none;width:min(390px,calc(100% - 28px));}
.toast{--toast-green:#2FBE73;--toast-forest:#0E3A2B;--toast-danger:#D2483A;--toast-line:#DCEBE2;--toast-white:#fff;pointer-events:auto;position:relative;display:flex;align-items:flex-start;gap:12px;background:var(--white,var(--toast-white));border:1px solid var(--line,var(--toast-line));border-radius:14px;padding:14px 16px 20px;box-shadow:0 16px 40px rgba(15,34,27,.18),0 2px 8px rgba(15,34,27,.08);opacity:0;transform:translateY(-14px) scale(.97);transition:opacity .25s ease,transform .25s ease;overflow:hidden;}
.toast.show{opacity:1;transform:translateY(0) scale(1)}.toast.leaving{opacity:0;transform:translateY(-10px) scale(.98)}
.toast-icon{flex:0 0 30px;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.86rem}.toast-success .toast-icon{background:#E4F7EC;color:#1E6349}.toast-error .toast-icon{background:#FDEDEA;color:var(--danger,var(--toast-danger))}
.toast-body{flex:1;min-width:0}.toast-title{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:.87rem;color:var(--ink-900,var(--toast-forest));margin:0 0 2px}.toast-message{font-family:'Inter',sans-serif;font-size:.8rem;line-height:1.45;color:var(--ink-600,#4C6459)}
.toast-close{flex:0 0 auto;border:0;background:transparent;color:#7C9088;font-size:1.08rem;line-height:1;cursor:pointer;padding:2px 4px;border-radius:6px}.toast-close:hover{background:#F6FBF8;color:#0F221B}
.toast-progress{position:absolute;left:14px;right:14px;bottom:6px;height:3px;border-radius:999px;background:var(--line,var(--toast-line));overflow:hidden}.toast-progress-fill{height:100%;width:100%;background:var(--toast-green);transform-origin:left;animation:toastCountdown linear forwards}.toast-error .toast-progress-fill{background:var(--danger,var(--toast-danger))}@keyframes toastCountdown{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@media (prefers-reduced-motion:reduce){.toast,.toast-progress-fill{transition:none;animation:none}}
/* Beta 18: keep notifications inside small screens even when legacy page CSS is present. */
.toast{width:100%;max-width:100%;}
@media(max-width:420px){.toast-wrap{top:12px;width:calc(100% - 20px)}.toast{padding:12px 13px 19px;gap:10px}.toast-message{font-size:.76rem}}