.notification-root,.notification-trigger{position:relative}.notification-count{background:var(--lime);min-width:17px;color:var(--ink);border-radius:12px;padding:0 4px;font-size:11px;font-weight:800;line-height:17px;position:absolute;top:0;right:-2px}.notification-popover{border:1px solid var(--line);z-index:50;background:#fff;border-radius:18px;width:380px;max-height:70vh;padding:18px;position:absolute;top:calc(100% + 14px);right:-10px;overflow:auto;box-shadow:0 12px 40px #0002}.notification-heading{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.notification-heading h2{font-size:22px}.notification-heading button{color:var(--muted);font-size:14px}.notification-items{margin-top:12px}.notification-item{text-align:left;border-radius:10px;gap:10px;width:100%;margin:4px 0;padding:14px 12px;display:flex}.notification-item.unread{background:var(--lime-soft)}.notification-item>i{background:0 0;border-radius:50%;flex-shrink:0;width:7px;height:7px;margin-top:8px}.notification-item.unread>i{background:var(--ink)}.notification-item>span{gap:6px;display:grid}.notification-item b{font-size:16px}.notification-item span span{color:var(--ink-3);font-size:15px;line-height:1.5}.notification-item small{color:var(--muted);font-size:12px}.notification-empty{color:var(--muted);text-align:center;padding:24px 10px;font-size:16px}@media (max-width:720px){.notification-popover{width:auto;position:fixed;top:74px;left:12px;right:12px}}
