.header-user-tools { position:relative; display:flex; align-items:center; gap:12px; margin-left:auto; flex:0 1 auto; min-width:0; }
.header-user-tools .header-account { margin-left:0; }
.header-notifications { flex:0 0 auto; }
.notification-toggle { position:relative; display:grid; place-items:center; width:44px; height:44px; padding:10px; border:1px solid var(--workspace-line,#deded7); border-radius:50%; color:var(--workspace-ink,#263e32); background:#fff; }
.notification-toggle:hover,.notification-toggle[aria-expanded=true] { background:var(--workspace-tint,#eef1e7); border-color:var(--workspace-line-strong,#b9c9b0); }
.notification-toggle>svg { width:21px; height:21px; }
.notification-count { position:absolute; right:-5px; top:-5px; display:grid; place-items:center; min-width:20px; height:20px; padding:0 4px; border:2px solid #fffefa; border-radius:12px; background:#b44538; color:white; font-size:11px; font-weight:750; }
.notification-panel { position:absolute; top:calc(100% + 12px); right:0; width:390px; max-width:calc(100vw - 32px); z-index:100; padding:8px; border:1px solid var(--workspace-line,#deded7); border-radius:18px; background:#fff; box-shadow:0 16px 50px #263e3226; }
.notification-panel>header { display:flex; align-items:center; justify-content:space-between; padding:10px 10px 4px; }
.notification-panel h2 { margin:0; font-size:17px; color:var(--workspace-ink,#263e32); }
.notification-panel header button,.notification-pagination button { display:grid; place-items:center; width:36px; height:36px; padding:8px; border:0; border-radius:10px; background:transparent; }
.notification-panel header button:hover,.notification-pagination button:hover { background:#f1f4eb; }
.notification-panel header svg,.notification-pagination svg { width:18px; height:18px; }
.notification-toolbar { padding:0 10px; }
.notification-toolbar:has(button:not([hidden])) { padding-bottom:8px; }
.notification-toolbar button { padding:7px 0; border:0; background:transparent; color:#49613d; font-size:13px; }
.notification-content { max-height:min(490px,calc(100dvh - 230px)); overflow:auto; overscroll-behavior:contain; }
.notification-state { padding:26px 18px; text-align:center; color:#63705f; font-size:14px; line-height:1.6; }
.notification-state>svg { width:26px; height:26px; margin:auto; }
.notification-state button { margin-top:10px; }
.notification-loading { display:grid; gap:12px; }
.notification-loading .ms-skeleton { height:55px; border-radius:12px; background:#eff1eb; }
.notification-list { list-style:none; padding:0; margin:0; display:grid; gap:4px; }
.notification-list li>button { display:flex; align-items:flex-start; gap:11px; width:100%; padding:15px 12px; border:0; border-radius:12px; background:transparent; color:#263e32; text-align:left; }
.notification-list li.is-unread>button { background:#f3f6ec; }
.notification-list li>button:hover,.notification-list li>button:focus-visible { background:#eaf0df; }
.notification-item-icon { flex:0 0 34px; display:grid; place-items:center; height:34px; background:#e5ecd9; border-radius:10px; color:#4d6540; }
.notification-item-icon svg { width:17px; height:17px; }
.notification-item-copy { display:grid; gap:5px; flex:1; min-width:0; line-height:1.45; font-size:14px; overflow-wrap:anywhere; }
.notification-item-copy strong { font-size:14px; font-weight:700; }
.notification-item-copy small { color:#67735f; font-size:12px; }
.notification-item-copy .notification-item-action { font-size:12px; font-weight:650; color:#49613d; }
.notification-unread-dot { flex:0 0 7px; height:7px; border-radius:50%; background:#617d48; margin-top:5px; }
.notification-pagination { display:flex; align-items:center; justify-content:space-between; padding:8px 10px 0; color:#67735f; font-size:12px; }
.notification-panel [hidden],.notification-count[hidden] { display:none; }
.notification-panel button:disabled { opacity:.5; cursor:default; }
@media(max-width:650px) {
 .header-user-tools { order:2; gap:8px; max-width:calc(100% - 88px); }
 .header-user-tools .header-account { max-width:calc(100% - 52px); }
 .header-user-tools .header-account-email { max-width:120px; }
 .notification-panel { max-width:calc(100vw - 32px); }
}
@media(max-width:380px) { .header-user-tools .header-account-email { max-width:70px; } }