.notification-menu { position:relative; flex-shrink:0; color:var(--color-ink,#171d2b); font-family:inherit; }
.notification-menu [hidden] { display:none!important; }
.notification-menu-trigger { position:relative; width:44px; height:44px; display:grid; place-items:center; border:1px solid var(--color-rule,#dce3ee); border-radius:50%; background:var(--color-surface,#fff); color:inherit; cursor:pointer; }
.notification-menu-trigger:hover,.notification-menu-trigger[aria-expanded=true] { background:var(--color-selection,#eef3ff); color:var(--color-accent,#0738c8); }
.notification-menu-badge { position:absolute; top:-5px; right:-6px; min-width:19px; height:19px; padding:0 4px; border-radius:12px; background:#0738c8; color:white; border:2px solid white; font-size:10px; line-height:15px; font-weight:700; }
.notification-menu-panel { position:absolute; z-index:150; right:0; top:calc(100% + 12px); width:min(390px,calc(100vw - 32px)); background:var(--color-surface,#fff); border:1px solid var(--color-rule,#dce3ee); border-radius:18px; box-shadow:0 14px 42px #172b4d26; overflow:hidden; text-align:left; }
.notification-menu-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:20px 20px 12px; }
.notification-menu-heading h2 { font-size:18px!important; line-height:1.3; letter-spacing:-.3px!important; margin:0!important; color:inherit; }
.notification-menu-heading p { margin:5px 0 0; font-size:12px; color:var(--color-muted,#626d80); }
.notification-menu-close { border:0; background:none; color:inherit; width:36px; height:36px; font-size:24px; cursor:pointer; }
.notification-menu-status { font-size:12px; line-height:1.5; color:var(--color-muted,#626d80); margin:0; padding:0 20px 16px; }
.notification-menu-list { max-height:min(440px,60vh); overflow-y:auto; overscroll-behavior:contain; }
.notification-menu-item { position:relative; display:flex; flex-direction:column; gap:6px; width:100%; padding:17px 20px 17px 28px; border:0; border-top:1px solid var(--color-rule,#e7ecf3); background:transparent; text-align:left; font:inherit; color:inherit; cursor:pointer; }
.notification-menu-item:hover { background:var(--color-selection,#f4f7ff); }
.notification-menu-item.is-unread { background:#f5f8ff; }
.notification-menu-item.is-unread:before { content:""; position:absolute; top:23px; left:12px; width:6px; height:6px; border-radius:50%; background:#0738c8; }
.notification-menu-item strong { font-size:14px; font-weight:600; }
.notification-menu-item span { font-size:12px; line-height:1.6; color:var(--color-muted,#626d80); }
.notification-menu-item time { font-size:11px; color:var(--color-muted,#626d80); }
.notification-menu-more { width:100%; border:0; border-top:1px solid var(--color-rule,#dce3ee); padding:14px; color:#0738c8; background:white; font:inherit; font-size:13px; cursor:pointer; }
.notification-menu button:focus-visible { outline:3px solid #a8c6ff; outline-offset:-3px; }
@media(max-width:600px) { .notification-menu-panel { position:fixed; top:84px; right:16px; left:16px; width:auto; } }
