.notif-bell-wrap { position: relative; display: inline-block; }
.notif-bell { position: relative; background: none; border: none; cursor: pointer; color: #e6edf3; font-size: 1.15rem; padding: 4px; line-height: 1; }
.notif-badge {
    position: absolute; top: -4px; right: -4px; background: var(--red, #f85149); color: #fff;
    font-size: 0.62rem; font-weight: 700; min-width: 16px; height: 16px; border-radius: 8px;
    display: none; align-items: center; justify-content: center; padding: 0 4px;
}
.notif-badge.show { display: flex; }

.notif-panel {
    position: absolute; top: 32px; right: 0; width: 300px; max-height: 380px; overflow-y: auto;
    background: var(--card-bg, #161b22); border: 1px solid var(--card-line, #30363d); border-radius: 12px;
    box-shadow: 0 16px 40px rgba(0,0,0,.4); display: none; z-index: 200;
}
.notif-panel.open { display: block; }
.notif-panel-head { padding: 12px 14px; font-size: 0.8rem; font-weight: 700; border-bottom: 1px solid var(--card-line, #30363d); color: #e6edf3; }
.notif-item { display: block; width: 100%; text-align: left; padding: 12px 14px; border: none; background: none; border-bottom: 1px solid var(--card-line, #30363d); cursor: pointer; }
.notif-item:last-child { border-bottom: none; }
.notif-item:hover { background: rgba(255,255,255,.03); }
.notif-item.unread { background: rgba(240,165,0,.06); }
.notif-item .ni-title { font-size: 0.82rem; font-weight: 700; color: #e6edf3; display: flex; align-items: center; gap: 6px; }
.notif-item .ni-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--amber, #f0a500); flex: 0 0 auto; }
.notif-item .ni-snippet { font-size: 0.76rem; color: var(--muted, #8b949e); margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.notif-item .ni-time { font-size: 0.68rem; color: var(--muted, #8b949e); margin-top: 4px; }
.notif-empty { padding: 20px 14px; text-align: center; color: var(--muted, #8b949e); font-size: 0.82rem; }