.notification-list { display: grid; gap: 12px; }
.notification-card { display: flex; gap: 16px; align-items: center; justify-content: space-between; padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.notification-card.unread { border-inline-start: 4px solid var(--forest); background: var(--surface-alt); }
.notification-card p { margin: 0 0 8px; }
.notification-card time { font-size: .85rem; color: var(--muted); }
.notification-card .response-actions { margin: 0; flex-shrink: 0; }
.notification-button { min-height: 44px; margin-inline-end: 8px; }
.notification-button b { background: var(--sage); color: var(--sage-ink); border-radius: 20px; padding: 2px 7px; margin-inline-start: 5px; }
.account-entry { margin-bottom: 24px; padding: 24px; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; }
.account-entry h2 { margin-top: 0; }
@media (max-width: 600px) {
  .notification-card { align-items: stretch; flex-direction: column; padding: 16px; }
  .notification-card button { min-height: 44px; }
  .topbar > div { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; }
  .notification-button { margin: 0; padding-inline: 10px; }
}