.notifications-page { max-width: 820px; padding: var(--space-7) 0 var(--space-8); }
.notification-list { display: grid; gap: var(--space-3); margin: var(--space-5) 0 0; padding: 0; list-style: none; }
.notification-card { padding: var(--space-4); border: var(--line-width) solid var(--border); background: var(--surface); overflow-wrap: anywhere; }
.notification-card.is-unread { border-inline-start: var(--line-width-strong) solid var(--interactive); }
.notification-card__heading { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); color: var(--text-subtle); font-size: var(--text-xs); }
.notification-card h2 { margin: var(--space-2) 0; font-size: var(--text-lg); }
.notification-card > p { margin: 0 0 var(--space-3); white-space: normal; }
.notification-card time { direction: ltr; unicode-bidi: isolate; }
.notification-card form { margin: 0; }
.text-action { padding: 0; border: 0; background: transparent; color: var(--interactive); font: inherit; font-size: var(--text-sm); text-decoration: underline; text-underline-offset: .2em; cursor: pointer; }
.text-action:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 3px; }
.empty-state { margin-top: var(--space-5); padding: var(--space-4); border: var(--line-width) dashed var(--border-strong); color: var(--text-secondary); }