.notification-container{position:fixed;top:20px;right:20px;z-index:9999;pointer-events:none;max-width:400px;width:100%}@media(max-width:768px){.notification-container{top:10px;right:10px;left:10px;max-width:none}}.notification-item{background:rgba(30,30,35,.98);border-radius:12px;box-shadow:0 4px 16px rgba(0,0,0,.2);border:1px solid hsla(0,0%,100%,.08);margin-bottom:12px;overflow:hidden;pointer-events:auto;position:relative;transform:translateX(100%);animation:slideIn .3s cubic-bezier(.2,.8,.2,1) forwards;transition:all .2s ease}.notification-item:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.25);border-color:hsla(0,0%,100%,.12)}.notification-item:last-child{margin-bottom:0}@keyframes slideIn{to{transform:translateX(0)}}@keyframes slideOut{to{transform:translateX(100%);opacity:0}}.notification-item.notification-removing{animation:slideOut .3s ease-in forwards}.notification-item .notification-content{display:flex;align-items:center;padding:16px 18px;gap:12px;min-height:56px}.notification-item .notification-icon{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:24px;height:24px;transition:transform .2s ease}.notification-item .notification-icon svg{width:20px;height:20px}.notification-item .notification-message{flex:1;font-size:14px;font-weight:500;line-height:1.5;color:hsla(0,0%,100%,.95)}.notification-item .notification-close{flex-shrink:0;background:rgba(0,0,0,0);border:none;cursor:pointer;padding:6px;border-radius:6px;color:hsla(0,0%,100%,.5);transition:all .2s ease;display:flex;align-items:center;justify-content:center}.notification-item .notification-close:hover{background:hsla(0,0%,100%,.1);color:hsla(0,0%,100%,.85)}.notification-item .notification-close:active{transform:scale(.95)}.notification-item .notification-progress{position:absolute;bottom:0;left:0;right:0;height:3px;background:hsla(0,0%,100%,.08);overflow:hidden}.notification-item .notification-progress-bar{height:100%;width:100%;background:currentColor;transform-origin:left;animation:progressBar linear forwards;opacity:.9}@keyframes progressBar{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.notification-item.notification-success{border-left:3px solid #10b981;background:rgba(16,185,129,.08)}.notification-item.notification-success .notification-icon{color:#10b981}.notification-item.notification-success .notification-progress-bar{background:#10b981}.notification-item.notification-error{border-left:3px solid #ef4444;background:rgba(239,68,68,.08)}.notification-item.notification-error .notification-icon{color:#ef4444}.notification-item.notification-error .notification-progress-bar{background:#ef4444}.notification-item.notification-warning{border-left:3px solid #f59e0b;background:rgba(245,158,11,.08)}.notification-item.notification-warning .notification-icon{color:#f59e0b}.notification-item.notification-warning .notification-progress-bar{background:#f59e0b}.notification-item.notification-info{border-left:3px solid #3b82f6;background:rgba(59,130,246,.08)}.notification-item.notification-info .notification-icon{color:#3b82f6}.notification-item.notification-info .notification-progress-bar{background:#3b82f6}@media(prefers-color-scheme:light){.notification-item{background:hsla(0,0%,100%,.98);border-color:rgba(0,0,0,.08);box-shadow:0 4px 16px rgba(0,0,0,.08)}.notification-item:hover{box-shadow:0 6px 20px rgba(0,0,0,.12)}.notification-message{color:rgba(0,0,0,.85)}.notification-close{color:rgba(0,0,0,.5)}.notification-close:hover{color:rgba(0,0,0,.75)}.notification-close:hover,.notification-progress{background:rgba(0,0,0,.06)}}@media(max-width:768px){.notification-container{bottom:16px;top:auto;right:12px;left:12px;max-width:none;display:flex;flex-direction:column-reverse}.notification-item{background:rgba(30,30,35,.96);border-radius:10px;margin-bottom:8px;box-shadow:0 3px 12px rgba(0,0,0,.15);border:1px solid hsla(0,0%,100%,.06);transform:translateY(100%);animation:slideUpMobile .25s ease-out forwards}.notification-item:hover{transform:translateY(0)}.notification-item.notification-removing{animation:slideDownMobile .25s ease-in forwards}.notification-item:last-child{margin-bottom:8px}.notification-item:first-child{margin-top:0}.notification-item .notification-content{padding:12px 14px;gap:10px;min-height:auto;align-items:center}.notification-item .notification-message{font-size:13px;font-weight:500;line-height:1.4;color:hsla(0,0%,100%,.95);flex:1}.notification-item .notification-icon{width:20px;height:20px}.notification-item .notification-icon svg{width:18px;height:18px}.notification-item .notification-close{width:24px;height:24px;padding:4px;border-radius:6px;background:rgba(0,0,0,0)}.notification-item .notification-close svg{width:14px;height:14px}.notification-item .notification-close:hover{background:hsla(0,0%,100%,.08)}.notification-item .notification-progress{height:2px}.notification-item.notification-success{border-left:3px solid #10b981;background:rgba(16,185,129,.06)}.notification-item.notification-success .notification-icon{color:#10b981}.notification-item.notification-error{border-left:3px solid #ef4444;background:rgba(239,68,68,.06)}.notification-item.notification-error .notification-icon{color:#ef4444}.notification-item.notification-warning{border-left:3px solid #f59e0b;background:rgba(245,158,11,.06)}.notification-item.notification-warning .notification-icon{color:#f59e0b}.notification-item.notification-info{border-left:3px solid #3b82f6;background:rgba(59,130,246,.06)}.notification-item.notification-info .notification-icon{color:#3b82f6}@keyframes slideUpMobile{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideDownMobile{0%{transform:translateY(0);opacity:1}to{transform:translateY(100%);opacity:0}}}@media(prefers-reduced-motion:reduce){.notification-item{transform:none!important}.notification-item,.notification-progress-bar{animation:none!important}.notification-close{transition:none!important}.notification-close:active,.notification-close:hover{transform:none!important}}.notification-item:focus-within{outline:2px solid #4299e1;outline-offset:2px}