.community-notifications { position: relative; }
.community-bell { position: relative; }
.community-bell.has-unread { color: #b77912; background: #fff7df; animation: notification-bell-pulse 1.2s ease-in-out infinite; }
.community-bell-count { position: absolute; top: -3px; right: -3px; min-width: 16px; height: 16px; padding: 0 3px; border: 2px solid #fff; border-radius: 10px; background: #d99116; color: #fff; font-size: 9px; font-weight: 850; line-height: 12px; }
.community-notification-menu { position: absolute; right: 0; top: calc(100% + 11px); z-index: 30; width: min(360px,calc(100vw - 24px)); max-height: 420px; overflow: auto; padding: 10px; border: 1px solid #dce6f2; border-radius: 14px; background: #fff; box-shadow: 0 18px 40px rgba(17,47,96,.18); }
.community-notification-menu > strong { display: block; padding: 4px 5px 9px; color: #1f3049; font-size: 13px; }
.community-notification-list { display: grid; gap: 5px; }
.community-notification-item { display: grid; grid-template-columns: 34px 1fr; gap: 9px; padding: 10px; border-radius: 10px; color: #55657a; font-size: 11px; line-height: 1.4; }
.community-notification-item > div { display: grid; gap: 3px; }.community-notification-avatar { display: grid; place-items: center; width: 34px; height: 34px; overflow: hidden; border-radius: 50%; background: #e4f1ff; color: #2a70c7; font-size: 10px; font-weight: 850; }.community-notification-avatar img { width: 100%; height: 100%; object-fit: cover; }
.community-notification-item.is-unread { background: #eef6ff; }.community-notification-item strong { color: #1e3553; font-size: 12px; }.community-notification-empty { margin: 4px; padding: 14px 8px; color: #718198; font-size: 12px; text-align: center; }
@keyframes notification-bell-pulse { 0%,100%{transform:rotate(0)} 20%{transform:rotate(-7deg)} 40%{transform:rotate(7deg)} 60%{transform:rotate(-4deg)} 80%{transform:rotate(4deg)} }
@media(prefers-reduced-motion:reduce){.community-bell.has-unread{animation:none}}
