.live-dot{width:8px;height:8px;background:#b91c1c;border-radius:50%;position:relative;display:inline-block;box-shadow:0 0 0 2px #fff,0 0 6px rgba(127,29,29,.8);vertical-align:middle}
.live-dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:rgba(127,29,29,.5);animation:pulseLive 1.5s infinite}
@keyframes pulseLive{0%{transform:scale(1);opacity:.85}70%{transform:scale(2.2);opacity:0}100%{opacity:0}}
.live-count{color:#b91c1c;font-weight:700;margin-left:6px;vertical-align:middle}

.notification-center{position:relative;display:inline-flex;align-items:center}
.notification-trigger{cursor:pointer}
.notification-popover{display:none;position:absolute;top:calc(100% + 10px);right:0;width:min(360px,92vw);max-height:420px;overflow:auto;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:18px;padding:14px;box-shadow:0 16px 40px rgba(0,0,0,.12);z-index:60}
.notification-center.is-open .notification-popover{display:block}
.notification-list{display:grid;gap:10px;margin-top:10px}
.notification-item{display:block;padding:10px 12px;border-radius:14px;text-decoration:none;color:inherit;background:rgba(0,0,0,.025)}
.notification-item.warn{background:rgba(255,193,7,.12)}
.notification-item.danger{background:rgba(220,53,69,.10)}
.live-pulse-dot{display:inline-block;width:8px;height:8px;border-radius:999px;background:#16a34a;margin-left:6px;opacity:.25;vertical-align:middle}
.live-pulse-dot.is-live{opacity:1;box-shadow:0 0 0 0 rgba(22,163,74,.45);animation:lbPulse 1.5s infinite}
@keyframes lbPulse{0%{box-shadow:0 0 0 0 rgba(22,163,74,.45)}70%{box-shadow:0 0 0 10px rgba(22,163,74,0)}100%{box-shadow:0 0 0 0 rgba(22,163,74,0)}}