.notif-bell{display:inline-flex;position:relative}.notif-bell__btn{width:34px;height:34px;color:var(--text-muted);cursor:pointer;background:0 0;border:0;border-radius:50%;justify-content:center;align-items:center;transition:background .15s ease-out,color .15s ease-out,transform .1s ease-out;display:inline-flex;position:relative}.notif-bell__btn:hover{background:color-mix(in srgb, var(--text) 8%, transparent);color:var(--text)}.notif-bell__btn:active{transform:scale(.92)}.notif-bell__btn:focus-visible{outline:3px solid color-mix(in srgb, var(--accent-blue) 35%, transparent);outline-offset:2px}.notif-bell__dot{width:7px;height:7px;box-shadow:0 0 0 2px var(--bg);background:#dc2626;border-radius:999px;position:absolute;top:6px;right:6px}.notif-pop{z-index:60;border:1px solid var(--line);background:var(--bg-soft);transform-origin:100% 0;border-radius:14px;flex-direction:column;width:min(92vw,360px);animation:.17s cubic-bezier(.22,1,.36,1) notif-pop-in;display:flex;position:absolute;top:calc(100% + 8px);right:0;overflow:hidden;box-shadow:0 24px 48px -24px #00000073}@keyframes notif-pop-in{0%{opacity:0;transform:scale(.96)translateY(-4px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.notif-pop{animation:none}}.notif-pop__head{border-bottom:1px solid var(--line);color:var(--text);justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;font-size:13.5px;display:flex}.notif-pop__allread,.notif-page__allread{color:var(--accent-blue);cursor:pointer;white-space:nowrap;background:0 0;border:none;align-items:center;gap:5px;padding:0;font-family:inherit;font-size:12px;font-weight:600;display:inline-flex}.notif-pop__list{max-height:min(60vh,420px);overflow-y:auto}.notif-pop__all{text-align:center;border-top:1px solid var(--line);color:var(--text-muted);padding:11px;font-size:12.5px;font-weight:600;text-decoration:none;display:block}.notif-pop__all:hover{color:var(--text)}.notif-row{border:none;border-bottom:1px solid color-mix(in srgb, var(--line) 60%, transparent);text-align:left;cursor:pointer;background:0 0;grid-template-columns:30px minmax(0,1fr) auto;align-items:start;gap:10px;width:100%;padding:11px 14px;font-family:inherit;transition:background .15s;display:grid}.notif-row:last-child{border-bottom:none}.notif-row:hover{background:color-mix(in srgb, var(--line) 30%, transparent)}.notif-row[data-unread]{background:color-mix(in srgb, var(--accent-blue) 7%, transparent);box-shadow:inset 2px 0 0 var(--accent-blue)}.notif-row__icon{background:color-mix(in srgb, currentColor 12%, transparent);border-radius:9px;flex-shrink:0;place-items:center;width:30px;height:30px;display:grid}.notif-row__text{flex-direction:column;gap:2px;min-width:0;display:flex}.notif-row__title{color:var(--text);font-size:13px;font-weight:500;line-height:1.45}.notif-row__body{color:var(--text-muted);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:12px;line-height:1.45;display:-webkit-box;overflow:hidden}.notif-row__time{font-family:var(--font-mono);color:var(--text-faint);white-space:nowrap;padding-top:2px;font-size:10.5px}.notif-empty{text-align:center;color:var(--text-faint);margin:0;padding:28px 14px;font-size:12.5px}.notif-page{flex-direction:column;gap:16px;display:flex}.notif-page__head{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.notif-page__title{font-family:var(--font-heading);letter-spacing:-.015em;color:var(--text);margin:0;font-size:18px;font-weight:600}.notif-page__sub{color:var(--text-muted);margin:2px 0 0;font-size:12.5px}.notif-filters{scrollbar-width:none;gap:6px;padding-bottom:2px;display:flex;overflow-x:auto}.notif-chip{border:1px solid var(--line);background:var(--bg-soft);color:var(--text-muted);cursor:pointer;white-space:nowrap;border-radius:999px;flex:none;align-items:center;gap:6px;padding:7px 12px;font-family:inherit;font-size:12px;font-weight:500;transition:border-color .15s,color .15s,background .15s;display:inline-flex}.notif-chip:hover{border-color:var(--line-strong);color:var(--text)}.notif-chip[aria-pressed=true]{background:var(--text);border-color:var(--text);color:var(--bg);font-weight:600}.notif-chip--toggle{margin-left:auto}.notif-list{border:1px solid var(--line);background:var(--bg-soft);border-radius:14px;overflow:hidden}.notif-row--page{padding:13px 16px}.notif-error{color:#dc2626;background:#dc26261a;border-radius:10px;padding:10px 14px;font-size:12.5px}.notif-more{border:1px solid var(--line);background:var(--bg-soft);color:var(--text-muted);cursor:pointer;border-radius:10px;align-self:center;padding:9px 20px;font-family:inherit;font-size:12.5px;font-weight:600}.notif-more:hover:not(:disabled){border-color:var(--line-strong);color:var(--text)}.notif-more:disabled{opacity:.6;cursor:default}@media (max-width:560px){.notif-chip--toggle{margin-left:0}}.notif-optin{border:1px solid var(--line);background:color-mix(in srgb, var(--accent-blue) 6%, var(--bg-soft));border-radius:14px;align-items:flex-start;gap:12px;padding:14px 16px;display:flex}.notif-optin__badge{width:32px;height:32px;color:var(--accent-blue);background:color-mix(in srgb, var(--accent-blue) 14%, transparent);border-radius:10px;flex-shrink:0;place-items:center;display:grid}.notif-optin__text{flex-direction:column;gap:3px;min-width:0;display:flex}.notif-optin__title{color:var(--text);font-size:13.5px;font-weight:600}.notif-optin__body{color:var(--text-muted);font-size:12.5px;line-height:1.5}.notif-optin__actions{flex-shrink:0;align-items:center;gap:8px;margin-left:auto;display:flex}.notif-optin__enable,.notif-optin__later,.notif-optin__go{cursor:pointer;white-space:nowrap;border:1px solid #0000;border-radius:10px;padding:8px 16px;font-family:inherit;font-size:12.5px;font-weight:600}.notif-optin__enable,.notif-optin__go{background:var(--text);color:var(--bg)}.notif-optin__enable:hover,.notif-optin__go:hover{opacity:.88}.notif-optin__later{border-color:var(--line);color:var(--text-muted);background:0 0}.notif-optin__later:hover{border-color:var(--line-strong);color:var(--text)}.notif-optin--inline{border:none;border-bottom:1px solid var(--line);border-radius:0;align-items:center;gap:8px;padding:9px 14px}.notif-optin__icon{color:var(--accent-blue);flex-shrink:0}.notif-optin__line{color:var(--text);text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:12.5px;overflow:hidden}.notif-optin--inline .notif-optin__go{margin-left:auto;padding:5px 12px;font-size:12px}.notif-optin__x{width:24px;height:24px;color:var(--text-faint);cursor:pointer;background:0 0;border:none;border-radius:8px;flex-shrink:0;place-items:center;display:grid}.notif-optin__x:hover{color:var(--text);background:color-mix(in srgb, var(--line) 40%, transparent)}@media (max-width:560px){.notif-optin{flex-wrap:wrap}.notif-optin__actions{width:100%;margin-left:0}.notif-optin__enable{flex:1}}.notif-optin--on{background:var(--bg-soft)}.notif-optin--on .notif-optin__badge{color:var(--accent-teal);background:color-mix(in srgb, var(--accent-teal) 14%, transparent)}.notif-optin--on .notif-optin__later{align-items:center;gap:6px;display:inline-flex}.notif-optin--muted{background:var(--bg-soft)}.notif-optin--muted .notif-optin__badge{color:var(--text-muted);background:color-mix(in srgb, var(--line) 45%, transparent)}.notif-optin--on .notif-optin__later:disabled{opacity:.6;cursor:default}
