.mention { color: var(--primary, #245eac); background: #eaf1fb; border-radius: .25rem; padding: .05rem .15rem; font-weight: 600; }
.mention-picker { position: relative; margin-top: .35rem; border: 1px solid var(--border, #dce1e7); background: white; border-radius: .6rem; box-shadow: 0 5px 16px #14243c12; max-height: 14rem; overflow-y: auto; }
.mention-picker[hidden] { display: none; }
.mention-option { width: 100%; display: flex; gap: .6rem; padding: .65rem .85rem; text-align: left; border: 0; background: transparent; color: inherit; cursor: pointer; }
.mention-option span { color: #617084; }
.mention-option[aria-selected="true"], .mention-option:hover { background: #eaf1fb; }
.mention-option:focus-visible { outline: 2px solid #245eac; outline-offset: -2px; }
.notification-list { display: grid; gap: 1rem; }
.notification { padding: 1.4rem; }
.notification-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.notification-heading p { min-width: 0; overflow-wrap: anywhere; }
.notification .notification-status { flex-shrink: 0; gap: 6px; padding: 5px 10px; border-radius: 999px; background: var(--navy); color: white; font-size: 11px; font-weight: 700; }
.notification-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex-shrink: 0; }
.notification h2 { font-size: 1.15rem; margin: .5rem 0; }
.notification-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: 1rem; }
.notification-excerpt { overflow-wrap: anywhere; }
.notification-badge { display: inline-flex; min-width: 1.4rem; justify-content: center; border-radius: 1rem; padding: .05rem .3rem; background: #245eac; color: white; font-size: .75rem; }
.notification-bell { display: inline-flex; align-items: center; gap: .4rem; white-space: nowrap; }
.notification-bell svg { flex-shrink: 0; }
.comment:target { outline: 2px solid #245eac; outline-offset: .5rem; scroll-margin-top: 2rem; }
@media (max-width: 600px) { .notification-bell > span:not(.count) { display: none; } }
