.notification-wrapper,.notification-trigger{position:relative}.notification-trigger-badge{background:var(--primary);color:#fff;border-radius:var(--radius-full);border:2px solid #fff;justify-content:center;align-items:center;min-width:18px;height:18px;font-size:.625rem;font-weight:700;display:flex;position:absolute;top:-4px;right:-4px}.notification-dropdown{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-xl);width:380px;max-height:480px;box-shadow:var(--shadow-overlay);z-index:1000;animation:alertSlide .2s var(--ease-out) forwards;position:absolute;top:calc(100% + 8px);right:0;overflow-y:auto}.notification-header{border-bottom:1px solid var(--divider);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.notification-header-title{color:var(--text-primary);font-size:.9375rem;font-weight:700}.notification-mark-all{color:var(--primary);cursor:pointer;background:0 0;border:none;font-size:.75rem;font-weight:600}.notification-empty{text-align:center;color:var(--text-tertiary);padding:48px 20px;font-size:.875rem}.notification-empty-icon{color:var(--gray-300);margin-bottom:12px}.notification-empty p{margin:0}.notification-list{flex-direction:column;display:flex}.notification-row{border:none;border-bottom:1px solid var(--divider);text-align:left;width:100%;font:inherit;cursor:pointer;transition:background var(--duration-fast) var(--ease);background:0 0;align-items:flex-start;gap:12px;padding:14px 20px;display:flex}.notification-row.unread{background:var(--primary-glow)}.notification-row:hover,.notification-row.unread:hover{background:var(--bg-inset)}.notification-icon-tile{border-radius:var(--radius-md);background:var(--bg-inset);flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;margin-top:2px;display:flex}.notification-body{flex:1;min-width:0}.notification-message{color:var(--text-secondary);margin:0;font-size:.8125rem;font-weight:400;line-height:1.45}.notification-message.unread{color:var(--text-primary);font-weight:500}.notification-timestamp{color:var(--text-tertiary);margin-top:4px;font-size:.6875rem;display:block}.notification-unread-dot{background:var(--primary);border-radius:50%;flex-shrink:0;width:7px;height:7px;margin-top:6px}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@media (max-width:1024px){.notification-dropdown{border-radius:var(--radius-xl) var(--radius-xl) 0 0;z-index:10000;border-bottom:none;width:100vw;max-height:85vh;animation:.3s cubic-bezier(.16,1,.3,1) forwards slideUp;position:fixed;inset:auto auto 0 0;box-shadow:0 -10px 40px #00000026}}
