.notif-bell{width:34px;height:34px;color:var(--ink-soft);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:8px;justify-content:center;align-items:center;transition:color .15s,background .15s;display:inline-flex;position:relative}.notif-bell:hover{color:var(--ink);background:var(--paper-2)}.notif-bell svg{width:18px;height:18px}.notif-bell__badge{color:#fff;min-width:14px;height:14px;font-family:var(--f-sans);text-align:center;letter-spacing:0;background:#d24a4a;border-radius:999px;padding:0 4px;font-size:9px;font-weight:600;line-height:14px;position:absolute;top:4px;right:4px}.notif-dialog{border:none;border-left:1px solid var(--rule-soft);background:var(--paper);width:340px;max-width:100vw;height:100dvh;max-height:100dvh;color:var(--ink);margin:0 0 0 auto;padding:0;animation:.18s ease-out notif-slide-in;box-shadow:-8px 0 24px #00000014}.notif-dialog::backdrop{background:#0000002e;animation:.18s ease-out notif-fade-in}@keyframes notif-slide-in{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes notif-fade-in{0%{opacity:0}to{opacity:1}}.notif-panel{flex-direction:column;height:100%;display:flex}.notif-panel__header{border-bottom:1px solid var(--rule-soft);justify-content:space-between;align-items:center;padding:16px 20px 12px;display:flex}.notif-panel__title{font-family:var(--f-sans);color:var(--ink);margin:0;font-size:15px;font-weight:600}.notif-panel__action{font-family:var(--f-sans);color:var(--ink-soft);cursor:pointer;background:0 0;border:none;padding:4px;font-size:12px}.notif-panel__action:hover{color:var(--ink)}.notif-panel__action:disabled{opacity:.4;cursor:not-allowed}.notif-panel__close{color:var(--ink-soft);cursor:pointer;background:0 0;border:none;margin-left:8px;padding:4px 8px;font-size:20px;line-height:1}.notif-panel__close:hover{color:var(--ink)}.notif-panel__tabs{border-bottom:1px solid var(--rule-soft);gap:4px;padding:8px 16px;display:flex}.notif-tab{font-family:var(--f-sans);color:var(--ink-soft);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:6px 10px;font-size:12px;font-weight:500}.notif-tab.is-active{background:var(--paper-2);color:var(--ink)}.notif-panel__body{flex:1;padding:8px 0;overflow-y:auto}.notif-row{border-bottom:1px solid var(--rule-soft);color:inherit;cursor:pointer;flex-direction:column;gap:4px;padding:12px 20px;text-decoration:none;transition:background .12s;display:flex;position:relative}.notif-row.is-unread{background:color-mix(in srgb, var(--ink) 3%, transparent)}.notif-row:hover{background:var(--paper-2)}.notif-row__head{align-items:center;gap:8px;display:flex}.notif-row__title{font-family:var(--f-sans);color:var(--ink);margin:4px 0 0;font-size:13px}.notif-row.is-unread .notif-row__title{font-weight:500}.notif-row.is-read .notif-row__title{color:var(--ink-soft);font-weight:400}.notif-row__excerpt{font-family:var(--f-sans);color:var(--ink-soft);-webkit-line-clamp:1;-webkit-box-orient:vertical;margin:0;font-size:12px;line-height:1.45;display:-webkit-box;overflow:hidden}.notif-row__time{font-family:var(--f-mono);color:var(--ink-soft);letter-spacing:.04em;margin-top:2px;font-size:10px}.notif-row__dot{background:#4a90e2;border-radius:999px;width:8px;height:8px;position:absolute;top:18px;right:16px}.notif-empty{text-align:center;font-family:var(--f-sans);color:var(--ink-soft);padding:32px 24px;font-size:13px}@media (max-width:640px){.notif-dialog{width:100vw}}