body.page-notif{--n-border:#e5e5e5;--n-sub:#606060;--n-text:#0f0f0f;--n-hover:#f2f2f2}body.page-notif .page-header{display:flex;justify-content:space-between;align-items:center;margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid var(--n-border)}body.page-notif .page-title{font-size:22px;font-weight:500;display:flex;align-items:center;gap:10px;color:var(--n-text);font-family:Roboto,Arial,sans-serif}body.page-notif .page-title i{display:none}body.page-notif .mark-all-btn{background:#f2f2f2;border:0;color:var(--n-text);padding:8px 16px;border-radius:18px;cursor:pointer;font-size:14px;font-weight:500;font-family:Roboto,Arial,sans-serif}body.page-notif .mark-all-btn:hover{background:#e5e5e5}body.page-notif .filter-tabs{display:flex;gap:8px;margin-bottom:16px;overflow-x:auto;padding-bottom:4px}body.page-notif .tab-btn{background:#f2f2f2;border:0;color:var(--n-text);padding:0 14px;height:32px;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;white-space:nowrap;font-family:Roboto,Arial,sans-serif}body.page-notif .tab-btn:hover{background:#e5e5e5}body.page-notif .tab-btn.active{background:#0f0f0f;color:#fff}body.page-notif .notif-item{display:flex;align-items:center;gap:14px;padding:12px 8px;border-radius:12px;margin-bottom:4px;cursor:pointer;border:0}body.page-notif .notif-item.unread{background:#f2f2f2}body.page-notif .notif-item:hover{background:var(--n-hover)}body.page-notif .n-avt{width:48px;height:48px;border-radius:50%;background-size:cover;background-color:#e5e5e5;flex-shrink:0;position:relative}body.page-notif .n-avt.is-letter{background-image:none!important;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:500;color:#606060}body.page-notif .n-avt-badge{position:absolute;bottom:-2px;right:-2px;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:9px;color:#fff;border:2px solid #fff}body.page-notif .badge-comment,body.page-notif .badge-follower{background:#0f0f0f}body.page-notif .badge-like{background:#cc0000}body.page-notif .n-body{flex:1 1;min-width:0}body.page-notif .n-text{font-size:14px;line-height:20px;margin-bottom:2px;color:var(--n-text)}body.page-notif .n-media{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:2px}body.page-notif .n-media,body.page-notif .n-time{font-size:12px;color:var(--n-sub)}body.page-notif .n-thumb{width:86px;height:48px;border-radius:8px;background-size:cover;background-color:#f2f2f2;flex-shrink:0}body.page-notif .n-unread-dot{width:8px;height:8px;background:#0f0f0f;border-radius:50%;flex-shrink:0}body.page-notif .empty-state{text-align:center;padding:80px 20px;color:var(--n-sub)}body.page-notif .empty-state i{display:none}body.page-notif .empty-state p{font-size:14px;margin:0}body.page-notif .loading{text-align:center;padding:40px;color:var(--n-sub)}body.page-notif .load-more-btn{width:100%;padding:10px;background:#f2f2f2;border:0;color:var(--n-text);border-radius:18px;cursor:pointer;font-size:14px;margin-top:10px;font-weight:500}body.page-notif .load-more-btn:hover{background:#e5e5e5}@media(max-width:600px){body.page-notif .n-thumb{display:none}}