.notifications-bell {
    position: relative;
    display: inline-grid;
    width: 40px;
    height: 40px;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid rgba(0, 103, 146, .18);
    border-radius: 50%;
    background: #fff;
    color: var(--brand-medium, #006792);
    font-size: 1.15rem;
    text-decoration: none;
    transition: background-color .15s ease, transform .15s ease;
}

.notifications-bell:hover,
.notifications-bell:focus-visible {
    background: #eef8fa;
    color: var(--brand-dark, #044e68);
    transform: translateY(-1px);
}

.notifications-bell:focus-visible { outline: 3px solid rgba(0, 153, 171, .24); outline-offset: 2px; }

.notifications-bell__count {
    position: absolute;
    top: -6px;
    right: -8px;
    min-width: 19px;
    height: 19px;
    box-sizing: border-box;
    display: grid;
    place-items: center;
    padding: 0 4px;
    border: 2px solid #fff;
    border-radius: 999px;
    background: #d92d20;
    color: #fff;
    font-family: system-ui, sans-serif;
    font-size: .65rem;
    font-weight: 800;
    line-height: 1;
}

.notifications-page { max-width: none !important; }
.notifications-page .v3-page-stat { box-shadow: none; }
.notifications-page__heading { margin-bottom: 1.65rem; }
.notifications-page__eyebrow { margin: 0 0 .3rem; color: var(--brand-light, #0099ab); font-size: .74rem; font-weight: 850; letter-spacing: .13em; }
.notifications-feed { display: grid; gap: .8rem; }
.notification-card { position: relative; display: flex; gap: .85rem; padding: 1.3rem 1.4rem; border: 1px solid #e1e8ee; border-radius: 13px; background: #fff; box-shadow: 0 10px 28px rgba(15, 23, 42, .04); }
.notification-card.is-unread { border-color: rgba(0, 153, 171, .32); background: #f1fbfc; }
.notification-card__marker { width: 8px; height: 8px; flex: 0 0 auto; margin-top: .44rem; border-radius: 50%; background: transparent; }
.notification-card.is-unread .notification-card__marker { background: var(--brand-light, #0099ab); box-shadow: 0 0 0 4px rgba(0, 153, 171, .12); }
.notification-card__content { min-width: 0; }
.notification-card__meta { display: flex; align-items: center; gap: .65rem; color: #64748b; font-size: .78rem; font-weight: 700; }
.notification-card__meta span { border-radius: 999px; padding: .18rem .5rem; background: #dff5f6; color: #006792; font-size: .68rem; font-weight: 850; text-transform: uppercase; letter-spacing: .04em; }
.notification-card h2 { margin: .42rem 0 .5rem; color: #172033; font-size: clamp(1.08rem, 2.5vw, 1.3rem); font-weight: 820; letter-spacing: -.015em; }
.notification-card p { margin: 0; color: #526277; font-size: .96rem; line-height: 1.62; white-space: pre-line; }
.notifications-empty { padding: 3.4rem 1.5rem; border: 1px dashed #cbd5e1; border-radius: 13px; background: #f8fafc; color: #64748b; text-align: center; }
.notifications-empty > i { display: inline-grid; width: 48px; height: 48px; place-items: center; border-radius: 50%; background: #e1f4f5; color: #006792; font-size: 1.35rem; }
.notifications-empty h2 { margin: 1rem 0 .35rem; color: #172033; font-size: 1.1rem; font-weight: 850; }
.notifications-empty p { margin: 0; font-size: .92rem; }

@media (max-width: 575.98px) {
    .notification-card { gap: .65rem; padding: 1.05rem; }
    .notification-card__meta { flex-wrap: wrap; gap: .45rem; }
}