.notification-container{z-index:9999;pointer-events:none;width:100%;max-width:400px;position:fixed;top:20px;right:20px}@media (max-width:768px){.notification-container{max-width:none;top:10px;left:10px;right:10px}}.notification-item{pointer-events:auto;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:linear-gradient(135deg,#14141cfa,#1e1e28fa);border:2px solid #ffffff26;border-radius:14px;margin-bottom:12px;transition:all .25s;animation:.4s cubic-bezier(.2,.8,.2,1) forwards slideIn;position:relative;overflow:hidden;transform:translate(100%);box-shadow:0 8px 32px #0006,0 4px 16px #0000004d,inset 0 1px #ffffff1a}.notification-item:hover{border-color:#ffffff40;transform:translateY(-4px)scale(1.02);box-shadow:0 12px 40px #00000080,0 6px 20px #00000059,inset 0 1px #ffffff26}.notification-item:last-child{margin-bottom:0}@keyframes slideIn{to{transform:translate(0)}}@keyframes slideOut{to{opacity:0;transform:translate(100%)}}.notification-item.notification-removing{animation:.3s ease-in forwards slideOut}.notification-item .notification-content{align-items:center;gap:12px;min-height:56px;padding:16px 18px;display:flex}.notification-item .notification-icon{background:#ffffff1a;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;transition:all .25s;display:flex}.notification-item .notification-icon svg{width:20px;height:20px}.notification-item .notification-message{color:#fff;text-shadow:0 1px 2px #0000004d;flex:1;font-size:14px;font-weight:600;line-height:1.5}.notification-item .notification-close{cursor:pointer;color:#ffffff80;background:0 0;border:none;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;padding:6px;transition:all .2s;display:flex}.notification-item .notification-close:hover{color:#ffffffd9;background:#ffffff1a}.notification-item .notification-close:active{transform:scale(.95)}.notification-item .notification-progress{background:#ffffff1a;height:4px;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.notification-item .notification-progress-bar{transform-origin:0;background:currentColor;width:100%;height:100%;animation:linear forwards progressBar;box-shadow:0 0 10px}@keyframes progressBar{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.notification-item.notification-success{background:linear-gradient(135deg,#10b98133,#14141cf2);border-color:#22c55e66;border-left-style:solid;border-left-width:4px;box-shadow:0 8px 32px #22c55e40,0 4px 16px #0000004d,inset 0 1px #22c55e33}.notification-item.notification-success .notification-icon{color:#22c55e;filter:drop-shadow(0 0 8px #22c55e99)}.notification-item.notification-success .notification-progress-bar{background:linear-gradient(90deg,#22c55e,#4ade80)}.notification-item.notification-success:hover{border-color:#22c55e99;box-shadow:0 12px 40px #22c55e59,0 6px 20px #00000059}.notification-item.notification-error{background:linear-gradient(135deg,#ef444433,#14141cf2);border-color:#ef444466;border-left-style:solid;border-left-width:4px;box-shadow:0 8px 32px #ef444440,0 4px 16px #0000004d,inset 0 1px #ef444433}.notification-item.notification-error .notification-icon{color:#ef4444;filter:drop-shadow(0 0 8px #ef444499)}.notification-item.notification-error .notification-progress-bar{background:linear-gradient(90deg,#ef4444,#f87171)}.notification-item.notification-error:hover{border-color:#ef444499;box-shadow:0 12px 40px #ef444459,0 6px 20px #00000059}.notification-item.notification-warning{background:linear-gradient(135deg,#f59e0b33,#14141cf2);border-color:#f59e0b66;border-left-style:solid;border-left-width:4px;box-shadow:0 8px 32px #f59e0b40,0 4px 16px #0000004d,inset 0 1px #f59e0b33}.notification-item.notification-warning .notification-icon{color:#f59e0b;filter:drop-shadow(0 0 8px #f59e0b99)}.notification-item.notification-warning .notification-progress-bar{background:linear-gradient(90deg,#f59e0b,#fbbf24)}.notification-item.notification-warning:hover{border-color:#f59e0b99;box-shadow:0 12px 40px #f59e0b59,0 6px 20px #00000059}.notification-item.notification-info{background:linear-gradient(135deg,#a855f733,#14141cf2);border-color:#a855f766;border-left-style:solid;border-left-width:4px;box-shadow:0 8px 32px #a855f740,0 4px 16px #0000004d,inset 0 1px #a855f733}.notification-item.notification-info .notification-icon{color:#a855f7;filter:drop-shadow(0 0 8px #a855f799)}.notification-item.notification-info .notification-progress-bar{background:linear-gradient(90deg,#a855f7,#c084fc)}.notification-item.notification-info:hover{border-color:#a855f799;box-shadow:0 12px 40px #a855f759,0 6px 20px #00000059}@media (max-width:768px){.notification-container{flex-direction:column-reverse;max-width:none;display:flex;inset:auto 12px 16px}.notification-item{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:linear-gradient(135deg,#14141cfa,#1e1e28fa);border:2px solid #ffffff26;border-radius:12px;margin-bottom:8px;animation:.3s ease-out forwards slideUpMobile;transform:translateY(100%);box-shadow:0 6px 24px #0006,0 3px 12px #0000004d}.notification-item:hover{transform:translateY(0)}.notification-item.notification-removing{animation:.25s ease-in forwards slideDownMobile}.notification-item:last-child{margin-bottom:8px}.notification-item:first-child{margin-top:0}.notification-item .notification-content{align-items:center;gap:12px;min-height:auto;padding:14px 16px}.notification-item .notification-message{color:#fff;text-shadow:0 1px 2px #0000004d;flex:1;font-size:14px;font-weight:600;line-height:1.4}.notification-item .notification-icon{background:#ffffff1a;border-radius:6px;justify-content:center;align-items:center;width:28px;height:28px;display:flex}.notification-item .notification-icon svg{width:18px;height:18px}.notification-item .notification-close{background:#ffffff1a;border-radius:6px;width:28px;height:28px;padding:4px}.notification-item .notification-close svg{width:16px;height:16px}.notification-item .notification-close:hover{background:#fff3}.notification-item .notification-progress{height:3px}.notification-item.notification-success{background:linear-gradient(135deg,#22c55e40,#14141cf2);border-color:#22c55e80;border-left-style:solid;border-left-width:4px;box-shadow:0 6px 24px #22c55e4d}.notification-item.notification-success .notification-icon{color:#22c55e;filter:drop-shadow(0 0 6px #22c55e99)}.notification-item.notification-error{background:linear-gradient(135deg,#ef444440,#14141cf2);border-color:#ef444480;border-left-style:solid;border-left-width:4px;box-shadow:0 6px 24px #ef44444d}.notification-item.notification-error .notification-icon{color:#ef4444;filter:drop-shadow(0 0 6px #ef444499)}.notification-item.notification-warning{background:linear-gradient(135deg,#f59e0b40,#14141cf2);border-color:#f59e0b80;border-left-style:solid;border-left-width:4px;box-shadow:0 6px 24px #f59e0b4d}.notification-item.notification-warning .notification-icon{color:#f59e0b;filter:drop-shadow(0 0 6px #f59e0b99)}.notification-item.notification-info{background:linear-gradient(135deg,#a855f740,#14141cf2);border-color:#a855f780;border-left-style:solid;border-left-width:4px;box-shadow:0 6px 24px #a855f74d}.notification-item.notification-info .notification-icon{color:#a855f7;filter:drop-shadow(0 0 6px #a855f799)}@keyframes slideUpMobile{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes slideDownMobile{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100%)}}}@media (prefers-reduced-motion:reduce){.notification-item{animation:none!important;transform:none!important}.notification-progress-bar{animation:none!important}.notification-close{transition:none!important}.notification-close:hover,.notification-close:active{transform:none!important}}.notification-item:focus-within{outline-offset:2px;outline:2px solid #4299e1}
