.notification-center{position:fixed;z-index:1200;top:22px;right:24px}.notification-bell{position:relative;width:44px;height:44px;display:grid;place-items:center;border:1px solid #e4e0ee;border-radius:14px;background:#fff;color:#423b55;box-shadow:0 10px 28px rgba(46,38,84,.12)}.notification-bell svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.notification-bell:hover{background:#f8f6ff;color:#6250df}.notification-bell span{position:absolute;top:-5px;right:-5px;min-width:20px;height:20px;padding:0 5px;display:grid;place-items:center;border:2px solid #fff;border-radius:999px;background:#6b55ee;color:#fff;font-size:10px;font-weight:900}.notification-panel{position:absolute;top:52px;right:0;width:min(390px,calc(100vw - 24px));max-height:min(620px,calc(100vh - 88px));overflow:auto;border:1px solid #e4e0ee;border-radius:18px;background:#fff;box-shadow:0 22px 60px rgba(37,30,70,.18)}.notification-panel>header{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:17px 18px;border-bottom:1px solid #ece9f2;background:rgba(255,255,255,.97)}.notification-panel header div{display:grid;gap:2px}.notification-panel header b{font-size:15px}.notification-panel header span{font-size:11px;color:#797482}.notification-panel header button{padding:5px;background:none;color:#6250df;font-size:11px;font-weight:800}.notification-item{width:100%;display:grid;grid-template-columns:9px 1fr;gap:11px;padding:15px 18px;border:0;border-bottom:1px solid #f0edf4;background:#fff;text-align:left}.notification-item:hover{background:#faf9ff}.notification-item .notification-dot{width:8px;height:8px;margin-top:6px;border-radius:50%;background:transparent}.notification-item.unread{background:#faf9ff}.notification-item.unread .notification-dot{background:#6b55ee}.notification-copy{display:grid;gap:4px}.notification-copy b{font-size:12px;color:#2d2934}.notification-copy span{font-size:12px;line-height:1.45;color:#706b78}.notification-copy time{font-size:10px;color:#9b96a3}.notification-empty{padding:34px 24px;text-align:center;color:#797482}.notification-empty b{display:block;margin-bottom:4px;color:#3a3542}
@media(max-width:1120px){.notification-center{top:13px;right:76px}.notification-bell{width:40px;height:40px;border-radius:12px}}
@media(max-width:560px){.notification-center{right:67px}.notification-panel{position:fixed;top:64px;right:10px;left:10px;width:auto;max-height:calc(100vh - 78px)}}