.notif-bell{align-items:center;display:inline-flex;position:relative}.notif-bell__button{width:var(--control-h);height:var(--control-h);border-radius:var(--radius-full);color:var(--text);background:var(--surface-hover);transition:var(--transition);justify-content:center;align-items:center;display:inline-flex;position:relative}.notif-bell__button:hover{background:var(--border)}.notif-bell__badge{border:2px solid var(--surface);border-radius:var(--radius-full);background:var(--error);min-width:20px;height:20px;color:var(--bg);justify-content:center;align-items:center;padding:0 5px;font-size:11px;font-weight:700;line-height:1;display:inline-flex;position:absolute;top:-2px;right:-2px}.notif-panel{top:calc(var(--topbar) + var(--s-8));right:var(--s-16);width:min(340px, calc(100vw - var(--s-32)));max-height:calc(100dvh - var(--topbar) - var(--s-16));background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-l);box-shadow:var(--shadow-2);z-index:var(--z-popover);position:fixed;overflow:hidden}.notif-panel__head{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.notif-panel__title{font-size:15px;font-weight:700}.notif-panel__mark{color:var(--text-muted);transition:var(--transition);font-size:13px;font-weight:600}.notif-panel__mark:hover{color:var(--text)}.notif-panel__list{max-height:min(380px, calc(100dvh - var(--topbar) - 84px));overflow-y:auto}.notif-count-warning{padding:var(--s-8) var(--s-16);border-bottom:1px solid var(--border);color:var(--warning);background:var(--warning-bg);font-size:var(--t-12)}@media (max-width:420px){.notif-panel{right:var(--s-8);width:calc(100vw - var(--s-16))}}.notif-empty{text-align:center;color:var(--text-muted);font-size:var(--t-14);padding:28px 16px}.notif-item{text-align:left;border-bottom:1px solid var(--border);width:100%;transition:var(--transition);flex-direction:column;gap:2px;padding:12px 16px;display:flex}.notif-item:hover{background:var(--surface-hover)}.notif-item--unread{background:var(--accent-soft)}.notif-item--unread:hover{background:var(--surface-hover)}.notif-item__title{font-weight:700;font-size:var(--t-14);color:var(--text)}.notif-item__body{color:var(--text);text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:13px;display:-webkit-box;overflow:hidden}.notif-item__time{font-size:var(--t-12);color:var(--text-muted);margin-top:2px}