#notificationBell { position: relative; }
#notifDot:not([hidden]) { display:flex; position:absolute; right:-5px; top:-5px; min-width:18px; height:18px; padding:0 4px; align-items:center; justify-content:center; border-radius:10px; background:#c6283d; color:#fff; font:700 10px/1 sans-serif; border:2px solid #151919; }
#notifPanel { width:min(380px,calc(100vw - 24px)); }
#notifList { max-height:min(440px,65vh); overflow-y:auto; }
#notifPanel .popover-header { flex-wrap:wrap; gap:8px; }
#notifPanel .popover-header button { border:0; background:transparent; color:#c6d0cc; font:inherit; font-size:11px; cursor:pointer; padding:6px; }
#notifPanel .notif-item { width:100%; text-align:left; border:0; background:transparent; color:#f2f5f3; font:inherit; }
#notifPanel .notif-item:hover { background:rgba(255,255,255,.06); }
#notifPanel button:focus-visible,#notificationBell:focus-visible { outline:2px solid #75ddb7; outline-offset:-2px; }
#notifPanel .notif-copy { display:grid; gap:5px; }
#notifPanel .notif-body { color:#c2c9c6; font-size:12px; line-height:1.5; }
#notifPanel .ni-time { color:#a9b3ae; }
#notificationAnnouncement { position:fixed; bottom:24px; left:50%; transform:translateX(-50%); z-index:12000; max-width:min(440px,90vw); padding:14px 20px; background:#17231e; border:1px solid #3f6353; border-radius:12px; color:#fff; box-shadow:0 8px 28px #0006; pointer-events:none; }
#notificationAnnouncement:empty { display:none; }