.notifications-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:38px;min-width:38px;height:38px;padding:8px;border:1px solid var(--border);border-radius:9px;background:white;color:var(--brand-500)}
.notifications-trigger:hover{background:var(--surface-muted)}
.notifications-trigger .ui-icon{width:18px;height:18px}
.notifications-badge{position:absolute;top:-5px;right:-6px;display:grid;place-items:center;min-width:19px;height:19px;padding:0 4px;border:2px solid white;border-radius:12px;background:var(--teal);color:var(--on-accent,white);font-size:9px;font-weight:700;line-height:1}
.notifications-badge[hidden]{display:none}
.sidebar-profile .notifications-trigger{width:32px;min-width:32px;height:34px;border-color:transparent;background:transparent;padding:6px}
.sidebar-profile .notifications-trigger:hover{background:var(--surface-muted)}
.sidebar-profile .notifications-badge{top:-2px;right:-4px}
#notificationsDialog{position:fixed;inset:16px 16px auto auto;margin:0;width:min(440px,calc(100vw - 32px));max-width:440px;max-height:calc(100dvh - 32px);padding:0;border:1px solid var(--border-strong,var(--border));border-radius:18px;background:#fafbfa;color:var(--brand-700);box-shadow:var(--shadow-dialog);overflow:hidden}
#notificationsDialog[open]{display:flex;flex-direction:column}
#notificationsDialog::backdrop{background:rgb(17 33 45 / .23)}
.notifications-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-shrink:0;padding:23px 22px 18px;background:white}
.notifications-header h2{margin:0 0 5px;font-size:19px;letter-spacing:-.5px}
.notifications-header p{margin:0;color:var(--brand-500);font-size:12px;line-height:1.5}
.notifications-close{display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;padding:6px;border:1px solid var(--border);border-radius:8px;background:white;color:var(--brand-500)}
.notifications-close:hover{background:var(--surface-muted)}
.notifications-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0;padding:0 22px 15px;background:white;border-bottom:1px solid var(--border)}
.notifications-filters{display:flex;padding:3px;gap:3px;border:1px solid var(--border);border-radius:8px;background:#f4f6f5}
.notifications-filters button{padding:7px 10px;border-radius:5px;background:transparent;color:var(--brand-500);font-size:11px}
.notifications-filters button[aria-pressed="true"]{background:white;color:var(--brand-700);box-shadow:var(--shadow-xs)}
.notifications-mark-all,.notifications-mark-one,.notifications-footer button,.notifications-error button{background:transparent;color:var(--accent-ink,var(--brand-500));font-size:11px;line-height:1.5;padding:4px 0}
.notifications-mark-all:disabled,.notifications-footer button:disabled{opacity:.45;cursor:default}
.notifications-meta{display:flex;justify-content:space-between;gap:12px;flex-shrink:0;padding:12px 22px;color:var(--brand-500);font-size:10px;line-height:1.5}
#notificationsScope{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#notificationsStatus{flex-shrink:0}
.notifications-items{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;padding:0 10px 10px;scrollbar-width:thin;scrollbar-color:var(--brand-300) transparent}
.notifications-list{margin:0;padding:0;list-style:none}
.notifications-item{display:flex;align-items:flex-start;gap:11px;padding:15px 12px;border:1px solid transparent;border-bottom-color:var(--border);border-radius:10px;background:transparent}
.notifications-item:last-child{border-bottom-color:transparent}
.notifications-item.is-unread{background:white;border-color:var(--border);box-shadow:var(--shadow-xs);margin-bottom:7px}
.notifications-kind{display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;border:1px solid var(--border);border-radius:9px;background:var(--surface-subtle,#f4f6f5);color:var(--brand-500)}
.notifications-kind .ui-icon{width:16px;height:16px}
.notifications-item.needs-attention .notifications-kind{background:#fcf3e7;color:#805a26;border-color:#ead7b9}
.notifications-item-body{flex:1;min-width:0}
.notifications-open-item{display:block;width:100%;padding:0;text-align:left;background:transparent;color:inherit}
.notifications-item-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.notifications-item-top strong{font-size:12px;font-weight:650;line-height:1.55;overflow-wrap:anywhere}
.notifications-unread-dot{flex-shrink:0;display:block;width:6px;height:6px;border-radius:50%;background:var(--teal);margin-top:6px}
.notifications-description{display:block;margin-top:4px;color:var(--brand-500);font-size:11px;line-height:1.65;overflow-wrap:anywhere}
.notifications-item-meta{display:block;margin-top:7px;color:var(--brand-500);font-size:10px;line-height:1.5;overflow-wrap:anywhere}
.notifications-mark-one{margin-top:7px;font-size:10px}
.notifications-open-item:hover strong,.notifications-mark-one:hover,.notifications-mark-all:hover:not(:disabled),.notifications-footer button:hover:not(:disabled){text-decoration:underline;text-underline-offset:3px}
.notifications-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;min-height:230px;padding:30px 24px;text-align:center;color:var(--brand-500);font-size:12px;line-height:1.7}
.notifications-empty strong{color:var(--brand-700);font-size:13px;font-weight:600}
.notifications-empty p{margin:0;max-width:280px}
.notifications-empty-icon{display:grid;place-items:center;width:44px;height:44px;margin-bottom:4px;border:1px solid var(--border);border-radius:13px;background:white;color:var(--brand-500)}
.notifications-empty-icon .ui-icon{width:21px;height:21px}
.notifications-error{padding:14px;margin:3px 2px 10px;border:1px solid #e7cfcb;border-radius:10px;background:#fdf3f1;color:#8a4439;font-size:12px;line-height:1.6}
.notifications-error p{margin:0 0 6px}
.notifications-limit{padding:9px 14px;margin:0;color:var(--brand-500);font-size:10px;line-height:1.6}
.notifications-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0;padding:13px 22px;border-top:1px solid var(--border);background:white;color:var(--brand-500);font-size:10px;line-height:1.6}
.notifications-footer button{flex-shrink:0}
@media(max-width:600px){#notificationsDialog{inset:max(10px,env(safe-area-inset-top)) 10px auto 10px;width:calc(100vw - 20px);max-width:none;max-height:calc(100dvh - max(20px,env(safe-area-inset-top)) - env(safe-area-inset-bottom));border-radius:14px}.notifications-header{padding:20px 17px 15px}.notifications-toolbar{padding:0 17px 13px;gap:9px}.notifications-meta{padding:11px 17px}.notifications-filters button{padding:7px 9px;font-size:10px}.notifications-mark-all{font-size:10px}.notifications-footer{padding:12px 17px}.notifications-item{padding:13px 10px;gap:9px}.notifications-header h2{font-size:18px}}