.notif-bell{position:relative;min-width:38px;height:38px;border:1px solid #4a6286;border-radius:10px;background:transparent;color:#fff;font-size:22px;cursor:pointer}.notif-count{position:absolute;top:-5px;inset-inline-end:-5px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:#c0392b;color:#fff;font-size:11px;font-weight:700;line-height:18px}.notif-backdrop{position:fixed;inset:0;z-index:100;background:rgba(22,45,76,.5);display:flex;justify-content:flex-end}.notif-panel{width:min(480px,100%);height:100%;overflow:auto;background:#fff;padding:calc(14px + env(safe-area-inset-top)) 16px calc(16px + env(safe-area-inset-bottom));box-shadow:var(--sh3)}.notif-panel header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.notif-panel h2{font-size:22px}.notif-panel header small{color:var(--mut)}.notif-actions{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}.notif-list{display:grid;gap:8px}.notif-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px;border:1px solid var(--line);border-inline-start:4px solid var(--sand);border-radius:12px}.notif-item.read{opacity:.68;border-inline-start-color:var(--line)}.notif-item b{font-size:14px}.notif-item p{margin:3px 0 0;color:var(--mut);font-size:13px}.notif-foot{font-size:12px;color:var(--mut);margin-top:14px}