.notification-bell{position:relative}.notification-bell>button{height:42px;min-width:46px;border:1px solid var(--border);border-radius:10px;background:#fff;cursor:pointer;position:relative}.notification-bell>button b{position:absolute;top:-6px;inset-inline-end:-6px;min-width:19px;height:19px;border-radius:10px;background:#676b72;color:#fff;font-size:10px;display:grid;place-items:center}.notification-bell.has-unread>button{background:#fff8df;border-color:#e0aa27}.notification-bell.has-unread>button b{background:#b3261e;animation:bellPulse 1.8s infinite}.notification-popover{display:none;position:absolute;top:50px;inset-inline-end:0;width:360px;max-height:430px;overflow:auto;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 20px 60px #0003;z-index:30}.notification-bell.open .notification-popover{display:block;animation:fadeSlide .2s ease}.notification-popover h4{margin:0;padding:15px 17px;background:#17191d;color:#fff;position:sticky;top:0}.notification-items article{display:grid;gap:3px;padding:13px 16px;border-bottom:1px solid #eee}.notification-items article:hover{background:#fffaf0}.notification-items span,.notification-items small{color:#676b72;font-size:11px}.notification-items p{padding:25px;text-align:center;color:#676b72}@keyframes bellPulse{50%{transform:scale(1.15)}}@media(max-width:520px){.notification-popover{position:fixed;top:76px;inset-inline:10px;width:auto;max-height:60vh}}