.member-notifications{position:relative}
.member-notifications>summary{position:relative;display:grid;width:46px;height:46px;place-items:center;border:1px solid #dedbe2;border-radius:15px;background:#fff;color:var(--ink);cursor:pointer;list-style:none;transition:border-color .15s,box-shadow .15s,transform .15s}
.member-notifications>summary::-webkit-details-marker{display:none}
.member-notifications>summary:hover,.member-notifications[open]>summary{border-color:#ff9db5;box-shadow:0 0 0 4px var(--brand-soft);transform:translateY(-1px)}
.member-notifications>summary:focus-visible{outline:3px solid rgba(255,40,91,.24);outline-offset:3px}
.member-notifications>summary svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.member-notifications>summary strong{position:absolute;top:-7px;right:-7px;display:grid;min-width:22px;height:22px;padding:0 5px;place-items:center;border:2px solid #fff;border-radius:999px;background:var(--brand);color:#fff;font-size:10px;font-weight:900;line-height:1}
.member-notification-popover{position:absolute;top:calc(100% + 14px);right:0;width:min(390px,calc(100vw - 28px));overflow:hidden;border:1px solid #e1dce5;border-radius:20px;background:#fff;box-shadow:0 22px 60px rgba(35,28,43,.18);color:var(--ink)}
.member-notification-popover>header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 22px 16px;border-bottom:1px solid var(--line)}
.member-notification-popover>header span{color:var(--brand);font-size:.68rem;font-weight:900;letter-spacing:.15em}
.member-notification-popover>header h2{margin:4px 0 0;font-size:1.18rem}
.member-notification-popover>header b{display:grid;min-width:30px;height:30px;padding:0 8px;place-items:center;border-radius:999px;background:var(--brand-soft);color:var(--brand-dark);font-size:.78rem}
.member-notification-list{max-height:min(430px,calc(100vh - 210px));overflow-y:auto}
.member-notification-item{display:grid;grid-template-columns:9px minmax(0,1fr);gap:11px;padding:16px 22px;border-bottom:1px solid var(--line);color:inherit;text-decoration:none}
.member-notification-item:hover,.member-notification-item.is-unread{background:#fff8fa}
.member-notification-dot{width:8px;height:8px;margin-top:6px;border-radius:50%;background:transparent}
.member-notification-item.is-unread .member-notification-dot{background:var(--brand);box-shadow:0 0 0 4px var(--brand-soft)}
.member-notification-copy{display:grid;min-width:0;gap:4px}
.member-notification-copy strong{color:var(--ink);font-size:.88rem}
.member-notification-copy>span{overflow:hidden;color:#5f5968;font-size:.78rem;font-weight:750;text-overflow:ellipsis;white-space:nowrap}
.member-notification-copy small{display:-webkit-box;overflow:hidden;color:var(--muted);font-size:.77rem;line-height:1.4;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.member-notification-copy time{color:#a09aa8;font-size:.68rem}
.member-notification-all{display:block;padding:15px 22px;color:var(--brand-dark);font-size:.82rem;font-weight:900;text-align:center;text-decoration:none}
.member-notification-all:hover{background:var(--brand-soft)}
.member-notification-empty{display:grid;justify-items:center;padding:30px 22px;text-align:center}
.member-notification-empty>span{display:grid;width:42px;height:42px;margin-bottom:11px;place-items:center;border-radius:14px;background:#e2f8ef;color:#14835c;font-weight:900}
.member-notification-empty strong{color:var(--ink)}
.member-notification-empty p{margin:5px 0 0;color:var(--muted);font-size:.8rem}
.member-notifications-page{display:grid;gap:20px;max-width:920px;margin:0 auto}
.member-notifications-page>header h1{margin:7px 0 8px}.member-notifications-page>header p{margin:0;color:var(--muted)}
.member-notifications-panel{overflow:hidden;padding:0}
.member-notifications-panel .member-notification-item{padding:20px 24px}
@media(max-width:720px){.topbar-user{gap:9px}.member-notifications>summary{width:42px;height:42px;border-radius:13px}.member-notification-popover{position:fixed;top:62px;right:14px;left:14px;width:auto;max-height:calc(100dvh - 76px);border-radius:17px}.member-notification-popover>header{padding:17px 18px 14px}.member-notification-list{max-height:calc(100dvh - 245px)}.member-notification-item{padding:14px 18px}}

