.noti-container{background:var(--white);min-height:100vh;font-family:var(--font);color:var(--text);flex-direction:column;max-width:480px;margin:0 auto;padding-bottom:70px;display:flex}.noti-header{background:var(--white);z-index:100;border-bottom:1px solid var(--border);align-items:center;height:56px;padding:0 16px;display:flex;position:sticky;top:0}.noti-header .back-btn{color:var(--primary);margin-right:12px;font-size:24px;text-decoration:none}.noti-header h1{color:var(--title);font-size:18px;font-family:var(--font_m);text-align:center;flex:1}.noti-header-actions{align-items:center;gap:16px;display:flex}.noti-header-actions .icon-btn{color:var(--text);font-size:22px;position:relative}.noti-badge{background:var(--red);color:var(--white);font-size:10px;font-family:var(--font_b);border-radius:10px;padding:2px 5px;position:absolute;top:0;right:-5px}.noti-section-title{justify-content:space-between;align-items:center;padding:16px 16px 12px;display:flex}.noti-section-title h2{font-size:14px;font-family:var(--font_m);color:var(--title)}.noti-tabs-wrapper{white-space:nowrap;border-bottom:1px solid var(--border);padding:0 8px 12px;display:flex;overflow-x:auto}.noti-tabs-wrapper::-webkit-scrollbar{display:none}.noti-tab{cursor:pointer;min-width:90px;color:var(--text-sub);flex-direction:column;align-items:center;gap:6px;padding:5px 10px;display:flex;position:relative}.noti-tab-icon{font-size:16px}.noti-tab-text{white-space:normal;text-align:center;height:24px;font-size:12px;line-height:1.3}.noti-tab.active{color:var(--primary);font-family:var(--font_b)}.noti-tab.active:after{content:"";background:var(--primary);width:50%;height:3px;position:absolute;bottom:-12px;left:50%;transform:translate(-50%)}.noti-list{flex-direction:column;display:flex}.noti-item{border-bottom:1px solid var(--border);background:var(--white);gap:12px;padding:16px;text-decoration:none;display:flex}.noti-item.unread{background:#fdf5f5}.noti-item-img{object-fit:cover;border:1px solid #eee;border-radius:8px;flex-shrink:0;width:48px;height:48px}.noti-item-content{flex:1}.noti-item-title{font-size:14px;font-family:var(--font_m);color:var(--title);margin-bottom:4px;line-height:1.4}.noti-item-desc{color:var(--text);margin-bottom:6px;font-size:13px;line-height:1.5}.noti-item-time{color:var(--text-sub);font-size:11px}