.notif-bell-btn{cursor:pointer;width:40px;height:40px;color:inherit;background:0 0;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:background .15s;display:inline-flex;position:relative}.notif-bell-btn:hover,.notif-bell-btn:focus-visible{background:#ffffff14;outline:none}.notif-bell-btn svg{stroke:currentColor;fill:none;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}.notif-bell-badge{color:#fff;pointer-events:none;min-width:16px;height:16px;box-shadow:0 0 0 2px var(--notif-badge-ring,#020617);background:#ef4444;border-radius:8px;justify-content:center;align-items:center;padding:0 4px;font-family:inherit;font-size:10px;font-weight:700;line-height:1;display:flex;position:absolute;top:4px;right:4px}.notif-bell-badge[hidden]{display:none}.notif-panel-overlay{z-index:1100;justify-content:flex-end;align-items:flex-start;display:flex;position:fixed;inset:0}.notif-panel-overlay[hidden]{display:none}.notif-panel-backdrop{background:#00000059;position:absolute;inset:0}.notif-panel{z-index:1;color:#111;background:#fff;border-radius:14px;flex-direction:column;width:min(360px,96vw);max-height:80vh;margin-top:56px;margin-right:8px;animation:.18s notifPanelIn;display:flex;position:relative;overflow:hidden;box-shadow:0 8px 32px #00000038}@keyframes notifPanelIn{0%{opacity:0;transform:translateY(-8px)scale(.97)}to{opacity:1;transform:none}}.notif-panel-head{border-bottom:1px solid #f0f0f0;flex-shrink:0;justify-content:space-between;align-items:center;padding:14px 16px 10px;display:flex}.notif-panel-title{color:#111;margin:0;font-size:15px;font-weight:700}.notif-mark-all-btn{color:#6366f1;cursor:pointer;background:0 0;border:none;border-radius:6px;padding:4px 6px;font-size:12px;font-weight:600;transition:background .12s}.notif-mark-all-btn:hover{background:#f0f0ff}.notif-list{flex:1;padding:6px 0;overflow-y:auto}.notif-empty{text-align:center;color:#999;padding:32px 20px;font-size:14px}.notif-item{cursor:pointer;border-bottom:1px solid #f7f7f7;border-radius:0;gap:12px;padding:12px 16px;transition:background .12s;display:flex}.notif-item:last-child{border-bottom:none}.notif-item:hover{background:#f8f8f8}.notif-item.unread{background:#f0f7ff}.notif-item.unread:hover{background:#e8f0ff}.notif-item-icon{background:#dcfce7;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;margin-top:2px;display:flex}.notif-item-icon svg{stroke:#16a34a;fill:none;stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}.notif-item.unread .notif-item-icon{background:#dbeafe}.notif-item.unread .notif-item-icon svg{stroke:#2563eb}.notif-item-body{flex:1;min-width:0}.notif-item-msg{color:#111;margin:0 0 2px;font-size:13px;font-weight:600;line-height:1.4}.notif-item-sub{color:#555;white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:12px;overflow:hidden}.notif-item-time{color:#aaa;white-space:nowrap;flex-shrink:0;margin-top:2px;font-size:11px}.notif-detail-overlay{z-index:1200;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.notif-detail-overlay[hidden]{display:none}.notif-detail-backdrop{background:#00000073;position:absolute;inset:0}.notif-detail-sheet{z-index:1;color:#111;background:#fff;border-radius:18px 18px 0 0;width:min(420px,100vw);max-height:88vh;padding:0 0 24px;animation:.2s notifSheetIn;position:relative;overflow-y:auto;box-shadow:0 -4px 24px #0000002e}@keyframes notifSheetIn{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}.notif-detail-handle{background:#ddd;border-radius:2px;width:36px;height:4px;margin:12px auto 8px}.notif-detail-head{border-bottom:1px solid #f0f0f0;align-items:center;gap:10px;padding:8px 20px 12px;display:flex}.notif-detail-icon{background:#dcfce7;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.notif-detail-icon svg{stroke:#16a34a;fill:none;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:22px;height:22px}.notif-detail-title{flex:1;margin:0;font-size:15px;font-weight:700}.notif-detail-close{cursor:pointer;color:#666;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:6px;transition:background .12s;display:flex}.notif-detail-close:hover{background:#f5f5f5}.notif-detail-close svg{stroke:currentColor;fill:none;stroke-width:2px;stroke-linecap:round;width:18px;height:18px}.notif-detail-body{flex-direction:column;gap:10px;padding:16px 20px 0;display:flex}.notif-detail-row{border-bottom:1px solid #f5f5f5;justify-content:space-between;align-items:flex-start;gap:8px;padding:8px 0;display:flex}.notif-detail-row:last-child{border-bottom:none}.notif-detail-label{color:#888;flex-shrink:0;font-size:12px;font-weight:500}.notif-detail-value{color:#111;text-align:right;word-break:break-word;font-size:13px;font-weight:600}.notif-status-badge{color:#15803d;background:#dcfce7;border-radius:20px;padding:2px 10px;font-size:12px;font-weight:700;display:inline-block}.notif-remaining{color:#d97706}