.notification-bell{position:relative;display:grid;place-items:center;width:46px;height:46px;min-width:46px;padding:0;border:1px solid #ffffff55;border-radius:12px;background:#ffffff12;color:#fff}.notification-bell svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.notification-bell:hover{background:#ffffff22}.notification-count{position:absolute;right:-5px;top:-5px;display:grid;place-items:center;min-width:21px;height:21px;padding:0 5px;border:2px solid #3478f6;border-radius:999px;background:#ef4444;color:#fff;font-size:11px;font-weight:900}.notification-count:empty,.notification-count[data-count="0"]{display:none}
.notification-drawer{position:fixed;inset:0;z-index:220;display:flex;justify-content:flex-end;background:#0b172566}.notification-drawer.hidden{display:none!important}.notification-panel{width:min(560px,100vw);height:100dvh;overflow:auto;background:var(--card);color:var(--txt);box-shadow:-18px 0 45px #0004;padding:22px}.notification-head,.notification-toolbar,.notification-actions{display:flex;align-items:center;gap:9px}.notification-head{justify-content:space-between}.notification-head h2{margin:0}.notification-toolbar{position:sticky;top:-22px;z-index:2;flex-wrap:wrap;margin:18px -4px 10px;padding:12px 4px;background:var(--card)}.notification-toolbar select{min-height:42px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--txt)}.notification-list{display:grid;gap:9px}.notification-item{display:grid;grid-template-columns:11px minmax(0,1fr);gap:12px;padding:15px;border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--txt);text-align:left}.notification-item:hover{border-color:#7cb5ee;box-shadow:0 7px 20px #235b8418}.notification-item.read{opacity:.7}.notification-dot{width:10px;height:10px;margin-top:5px;border-radius:50%;background:#1683ff}.notification-item.read .notification-dot{background:#94a3b8}.notification-item header{display:flex;justify-content:space-between;gap:10px}.notification-item b{overflow-wrap:anywhere}.notification-item p{margin:6px 0;color:var(--muted);line-height:1.4}.notification-item small{color:var(--muted)}.notification-category{display:inline-block;margin-top:7px;padding:4px 8px;border-radius:999px;background:#eaf3fc;color:#235b84;font-size:11px;font-weight:800}.notification-empty{padding:40px 18px;text-align:center;color:var(--muted)}
.notification-settings{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}.notification-preference-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.notification-preference-grid label{display:flex;align-items:center;gap:8px;padding:10px;border:1px solid var(--line);border-radius:10px}.notification-preference-grid input{width:18px;height:18px}
body.ui-dark .notification-panel,body.ui-dark .notification-toolbar,body.ui-dark .notification-item{background:#111c2d!important;color:#e8f1ff!important;border-color:#30435c!important}body.ui-dark .notification-category{background:#214e78;color:#dceaff}
@media(max-width:700px){.notification-panel{padding:16px}.notification-toolbar{top:-16px;margin-inline:-2px}.notification-actions{width:100%}.notification-actions button{flex:1;padding-inline:8px}.notification-preference-grid{grid-template-columns:1fr}.notification-head h2{font-size:24px}.notification-bell{flex:0 0 46px}}