.notification-trigger{position:relative}
.notification-trigger>span{position:absolute;right:-5px;top:-6px;min-width:18px;height:18px;padding:0 5px;border:2px solid #07100e;border-radius:10px;background:var(--coral);color:#fff;font:800 9px/14px Manrope;text-align:center}
.user-notification-panel{position:fixed;z-index:65;top:0;right:-430px;width:min(420px,100vw);height:100vh;padding:20px;background:#0b1714;border-left:1px solid var(--line2);box-shadow:-24px 0 70px rgba(0,0,0,.55);transition:right .28s ease}
.user-notification-panel.show{right:0}
.user-notification-panel header{display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:17px;border-bottom:1px solid var(--line)}
.user-notification-panel h2{margin:6px 0 0;font:700 22px Manrope}
.user-notification-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;color:var(--muted);font-size:10px}
.user-notification-list{height:calc(100vh - 120px);overflow:auto}
.user-notification-item{display:grid;grid-template-columns:10px 1fr;gap:11px;width:100%;padding:15px 8px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text);text-align:left;cursor:pointer}
.user-notification-item:hover{background:#10201b}
.user-notification-item .notice-dot{width:8px;height:8px;margin-top:5px;border-radius:50%;background:#475a52}
.user-notification-item.unread .notice-dot{background:var(--mint);box-shadow:0 0 0 4px rgba(117,227,173,.1)}
.user-notification-item b,.user-notification-item span,.user-notification-item time{display:block}
.user-notification-item b{font:700 12px Manrope}
.user-notification-item span{margin-top:5px;color:#a6b8b0;font-size:10px;line-height:1.45}
.user-notification-item time{margin-top:7px;color:#62766d;font-size:8px}
.user-notification-empty{padding:42px 18px;text-align:center;color:var(--muted);font-size:11px}
.user-notification-popup{position:fixed;z-index:75;right:24px;bottom:24px;display:grid;grid-template-columns:42px 1fr;gap:14px;width:min(480px,calc(100vw - 30px));padding:20px;border:1px solid #3b6e58;border-radius:16px;background:linear-gradient(145deg,#132a22,#0d1916);box-shadow:0 25px 70px rgba(0,0,0,.55);opacity:0;transform:translateY(24px);pointer-events:none;transition:.25s}
.user-notification-popup.show{opacity:1;transform:none;pointer-events:auto}
.notification-popup-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#203f33;color:var(--mint);font-size:18px}
.notification-popup-content{min-width:0}
.user-notification-popup small{color:var(--mint);font-size:8px;letter-spacing:1.2px;font-weight:800}
.notification-popup-type{display:inline-flex;margin-top:10px;padding:5px 8px;border:1px solid rgba(117,227,173,.32);border-radius:999px;background:rgba(117,227,173,.1);color:#a8f0cb;font:800 9px Manrope;letter-spacing:.45px;text-transform:uppercase}
.user-notification-popup .notification-popup-project{margin:10px 0 4px;color:#fff;font:800 22px/1.18 Manrope;letter-spacing:-.35px;overflow-wrap:anywhere}
.user-notification-popup h3{margin:8px 0 4px;color:#dbe9e3;font:700 13px Manrope}
.user-notification-popup p{margin:0;color:#a9bbb3;font-size:10px;line-height:1.5}
.user-notification-popup .notification-popup-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:15px}
@media(max-width:600px){.user-notification-popup{right:15px;bottom:15px;grid-template-columns:36px 1fr;padding:16px}.notification-popup-icon{width:36px;height:36px}.user-notification-popup .notification-popup-project{font-size:19px}.user-notification-panel{width:100vw}}