.notification-bell{min-width:40px;min-height:40px;color:var(--text-primary);border:1px solid var(--surface-border);background:0 0;border-radius:8px;flex-shrink:0;place-items:center;display:grid;position:relative}.notification-count{color:#fff;background:#405d4c;border-radius:12px;min-width:18px;padding:2px 4px;font-size:10px;position:absolute;top:-7px;right:-8px}.notification-dialog,.notification-toast{background:var(--surface-card,#fff);color:var(--text-primary,#23332b);border:1px solid var(--surface-border,#70867b);border-radius:16px;padding:24px;font-size:14px;box-shadow:0 16px 64px #0005}.notification-dialog{width:min(600px,100vw - 32px);max-height:85dvh;margin:auto;overflow:auto}.notification-dialog::backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#071a1480}.notification-dialog header,.notification-dialog footer{justify-content:space-between;align-items:center;gap:16px;display:flex}.notification-dialog article{border-bottom:1px solid var(--surface-border,#70867b);padding:18px 0}.notification-dialog h2,.notification-toast h2{margin:8px 0;font-size:20px}.notification-dialog h3{margin:8px 0;font-size:16px}.notification-dialog p,.notification-toast p{white-space:pre-wrap;overflow-wrap:anywhere;margin:12px 0}.notification-dialog button,.notification-toast button{border:1px solid var(--surface-border,#70867b);background:var(--surface-base,#eef2ef);min-height:40px;color:inherit;border-radius:8px;padding:8px 12px}.notification-dialog button:disabled,.notification-toast button:disabled{opacity:.5}.notification-dialog footer{margin-top:20px}.notification-unread h3:before{content:"● ";color:var(--brand-accent,#749782)}.notification-toast{z-index:150;width:min(420px,100vw - 48px);max-height:65dvh;position:fixed;bottom:24px;left:24px;overflow:auto}.notification-toast>div{flex-wrap:wrap;gap:8px;display:flex}.notification-close{float:right}.notification-toast small{letter-spacing:.1em;font-size:10px}@media (max-width:1199px){.app-header>.notification-bell{position:absolute;top:12px;right:76px}}@media (prefers-reduced-motion:no-preference){.notification-toast{animation:.2s ease-out notification-appear}@keyframes notification-appear{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}}@media (max-width:639px){.notification-toast{max-height:60dvh;bottom:88px}}
