.notification-bell{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:42px;height:42px;color:var(--text);border-radius:9px}
.notification-bell svg{width:22px;height:22px}.notification-bell:hover{background:var(--panel)}
.notification-bell i{position:absolute;top:7px;right:7px;width:7px;height:7px;border-radius:50%;background:#e7475c}
.notification-bell i[hidden]{display:none}
#notification-inbox{height:min(70dvh,620px)}
.inbox-intro{color:var(--muted);font-size:12px;margin:3px 0 12px}
.inbox-list{display:flex;flex-direction:column}.inbox-item{border-bottom:1px solid var(--line);padding:15px 2px}.inbox-item button{display:block;text-align:left;width:100%;padding:0;color:var(--text)}
.inbox-title{display:flex;justify-content:space-between;gap:12px;align-items:baseline}.inbox-title strong{font-size:14px}.inbox-title time{flex:none;color:var(--muted);font-size:11px}
.inbox-item p{margin:5px 0 0;color:var(--muted);font-size:13px;line-height:1.5}.inbox-item.unread strong:before{content:'●';color:#e7475c;font-size:8px;margin-right:6px}
.inbox-links{display:flex;flex-direction:column;gap:8px;margin:12px 0 0 10px}.inbox-links button{color:var(--accent);font-size:13px}.inbox-empty{padding:35px 0;color:var(--muted);font-size:13px;text-align:center}

.notification-mode{border:0;padding:0;margin:14px 0;display:grid;gap:8px}.notification-mode legend{font-weight:600;margin-bottom:8px}.notification-mode label{display:flex;align-items:center;gap:8px}.notification-mode small{color:var(--muted)}