/* why: panel hangs below the bar off .mast .wrap; under 640 it spans .mast edge to edge */
/* trap: .member-bell and .mast-actions stay static so the panel anchors to .wrap or .mast */
.mast .wrap{position:relative}
.member-bell__n{position:absolute;top:0;right:-2px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--neg);color:var(--on-accent);font:600 var(--t-12)/16px var(--sans);text-align:center;font-variant-numeric:tabular-nums;pointer-events:none}
.member-bell__n[hidden]{display:none}
.member-bell__panel{position:absolute;top:calc(100% + var(--s-8));right:var(--s-48);z-index:3;width:min(24rem,calc(100vw - 2*var(--s-16)));max-height:calc(100vh - 140px);overflow-y:auto;background:var(--bg);border:1px solid var(--line-strong);border-radius:var(--r-container)}
.member-bell__panel[hidden]{display:none}
.member-bell__empty{margin:0;padding:var(--s-24) var(--s-16);font-size:var(--t-14);color:var(--ink-2)}
.member-bell__list{list-style:none;margin:0;padding:0}
.member-note{padding:var(--s-16)}
.member-note+.member-note{border-top:1px solid var(--line)}
.member-note__t{margin:0 0 var(--s-4);font-size:var(--t-16);font-weight:600;line-height:1.35;color:var(--ink)}
.member-note__d{margin:0 0 var(--s-16);font-size:var(--t-14);line-height:1.5;color:var(--ink-2);white-space:pre-line}
.member-note__go{width:100%;height:44px;font-size:var(--t-16)}
@media(max-width:760px){.member-bell__panel{right:var(--s-16)}}
@media(max-width:640px){
.mast .wrap{position:static}
.member-ic{width:32px;height:32px}
.member-bell__panel{left:0;right:0;top:calc(100% + 1px);width:auto;max-height:calc(100vh - var(--mast-h));max-height:calc(100dvh - var(--mast-h));border-width:0 0 1px;border-radius:0}
}
