.hide-notification{background:none;border:none;color:#adb5bd;cursor:pointer;flex-shrink:0;font-size:1.1rem;margin-left:auto;margin-top:-40px;padding:2px;transform:translateX(10px);transition:all .2s}.hide-notification:hover{color:#ff1493;transform:translateX(10px) scale(1.1)}.spinner{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.notifications-panel{background:#fff;border:1px solid rgba(0,0,0,.1);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.15);display:flex;flex-direction:column;max-height:70vh;max-width:95vw;overflow:hidden;position:absolute;right:0;top:40px;width:300px;z-index:1000}.panel-header{align-items:center;background:#f8f9fa;border-bottom:1px solid rgba(0,0,0,.05);display:flex;flex-shrink:0;justify-content:space-between;padding:16px 20px}.panel-header h6{font-size:1.1rem;font-weight:600;margin:0}.panel-actions{display:flex;gap:12px}.panel-actions button{background:none;border:none;color:#6c757d;cursor:pointer;font-size:1.1rem;padding:4px;transition:all .2s}.panel-actions button:hover{color:#ff1493;transform:scale(1.1)}.notifications-container{display:flex;flex-direction:column;flex-grow:1;overflow:hidden}.notifications-list{-webkit-overflow-scrolling:touch;flex-grow:1;overflow-y:auto;padding:0;scrollbar-color:#ff1493 #f8f9fa;scrollbar-width:thin}.notifications-list::-webkit-scrollbar{width:6px}.notifications-list::-webkit-scrollbar-track{background:#f8f9fa;border-radius:3px}.notifications-list::-webkit-scrollbar-thumb{background-color:#ff1493;border-radius:3px}.notifications-list::-webkit-scrollbar-thumb:hover{background-color:#d81159}.notification-item{align-items:flex-start;border-bottom:1px solid rgba(0,0,0,.03);cursor:pointer;display:flex;gap:14px;padding:16px 20px;touch-action:pan-y;transition:all .3s ease}.notification-item:hover{background:#f8f9fa}.notification-icon{align-items:center;border-radius:10px;display:flex;flex-shrink:0;font-size:1.2rem;height:40px;justify-content:center;margin-top:2px;width:40px}.notification-content{flex-grow:1;min-width:0;width:calc(100% - 54px)}.notification-meta{align-items:center;display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;margin-bottom:6px}.notification-time{align-items:center;color:#6c757d;display:flex;flex-shrink:0;font-size:.8rem}.notification-text{-webkit-line-clamp:3;-webkit-box-orient:vertical;word-wrap:break-word;color:#495057;display:-webkit-box;font-size:.95rem;line-height:1.5;margin:0;overflow:hidden;text-overflow:ellipsis;word-break:break-word}.delete-notification{background:none;border:none;color:#adb5bd;cursor:pointer;flex-shrink:0;font-size:1.1rem;margin-left:auto;margin-top:-40px;padding:2px;transform:translateX(10px);transition:all .2s}.delete-notification:hover{color:#ff1493;transform:scale(1.1)}.empty-state{color:#adb5bd;padding:40px 24px;text-align:center}.empty-state i{font-size:2.5rem;margin-bottom:12px}.empty-state p{font-size:1rem;margin:0}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}@keyframes pulse-ring{0%{opacity:.7;transform:scale(.8)}to{opacity:0;transform:scale(1.3)}}.pulse{animation:pulse 1.5s infinite}.pulse-ring{animation:pulse-ring 1.5s infinite;border:2px solid #ff1493;border-radius:50%;bottom:-2px;left:-2px;position:absolute;right:-2px;top:-2px}@media (max-width:480px){.notifications-panel{max-width:400px;right:50%;top:50px;transform:translateX(50%);width:95vw}.notification-item{gap:12px;padding:14px 16px}.notification-icon{font-size:1.1rem;height:36px;width:36px}.notification-content{width:calc(100% - 48px)}.notification-meta{align-items:flex-start;flex-direction:column;gap:4px}.notification-time{font-size:.75rem}}@media (max-width:360px){.notifications-panel{border-radius:0;max-height:100vh;max-width:100vw;right:0;top:0;transform:none;width:100vw}.notification-item,.panel-header{padding:12px 16px}}