/* ====== 全局重置 ====== */
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'PingFang SC','Microsoft YaHei',sans-serif;font-size:16px;color:#333;background:#f5f6fa;overflow:hidden;}
input,button,textarea{font-family:inherit;font-size:inherit;outline:none;border:none;}

:root{
  --primary:#FF6A00;
  --primary-light:#FF8C00;
  --primary-bg:rgba(255,106,0,0.08);
  --bg:#f5f6fa;
  --card:#ffffff;
  --text:#333;
  --text-secondary:#999;
  --border:#eee;
  --shadow:0 2px 12px rgba(0,0,0,0.06);
  --radius:12px;
  --radius-sm:8px;
  --header-h:52px;
  --input-h:56px;
}

/* ====== 顶部导航 ====== */
#app-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  height:var(--header-h);background:var(--primary);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 16px;color:#fff;
  box-shadow:0 2px 8px rgba(255,106,0,0.3);
}
.header-left,.header-right{display:flex;align-items:center;gap:12px;cursor:pointer;}
.menu-icon{font-size:22px;}
.user-icon{font-size:20px;}
.header-title{font-size:17px;font-weight:600;}
.mode-switch{font-size:18px;padding:4px 8px;border-radius:20px;background:rgba(255,255,255,0.2);cursor:pointer;transition:0.2s;}
.mode-switch:active{background:rgba(255,255,255,0.35);}

/* ====== 侧边菜单 ====== */
.side-menu{position:fixed;top:0;left:0;right:0;bottom:0;z-index:200;display:none;}
.side-menu.active{display:block;}
.menu-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.45);}
.menu-content{position:absolute;top:0;left:0;bottom:0;width:280px;background:#fff;display:flex;flex-direction:column;animation:slideIn 0.25s ease;}
@keyframes slideIn{from{transform:translateX(-100%)}to{transform:translateX(0)}}
.menu-header{padding:20px;background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;display:flex;align-items:center;gap:12px;}
.menu-avatar{width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,0.25);display:flex;align-items:center;justify-content:center;font-size:24px;}
.menu-user-name{font-size:16px;font-weight:600;}
.menu-user-phone{font-size:13px;opacity:0.85;margin-top:2px;cursor:pointer;}
.menu-list{flex:1;overflow-y:auto;padding:8px 0;}
.menu-item{display:flex;align-items:center;gap:14px;padding:14px 20px;color:#555;font-size:15px;cursor:pointer;transition:0.15s;}
.menu-item:active{background:#f5f5f5;}
.menu-item-icon{font-size:18px;width:24px;text-align:center;}
.menu-divider{height:1px;background:#eee;margin:6px 16px;}
.menu-footer{padding:16px 20px;border-top:1px solid #eee;color:var(--primary);font-size:15px;font-weight:500;cursor:pointer;text-align:center;}
.menu-footer:active{background:#fff5eb;}

/* ====== 主内容 ====== */
#main-content{position:fixed;top:var(--header-h);left:0;right:0;bottom:var(--input-h);overflow-y:auto;-webkit-overflow-scrolling:touch;}
.page{display:none;height:100%;overflow-y:auto;}
.page.active{display:block;}

/* ====== 快捷入口 ====== */
.quick-actions{display:flex;gap:8px;padding:12px 16px;background:var(--card);border-bottom:1px solid var(--border);}
.quick-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;padding:6px 0;}
.quick-btn:active{opacity:0.7;}
.qb-icon{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;}
.qb-taobao{background:#FF4400;}
.qb-pdd{background:#C91523;}
.qb-jd{background:#E2231A;}
.qb-dy{background:#000;}
.qb-vip{background:#E1251B;}
.qb-label{font-size:11px;color:#666;}

/* ====== 聊天消息 ====== */
.chat-messages{padding:12px 16px 8px;}
.msg{margin-bottom:12px;}
.msg-bubble{display:inline-block;max-width:85%;padding:12px 16px;border-radius:16px;font-size:14px;line-height:1.7;word-break:break-word;}
.system-bubble{background:#fff;border:1px solid #eee;border-radius:12px;box-shadow:0 1px 4px rgba(0,0,0,0.04);}
.user-bubble{background:var(--primary);color:#fff;border-radius:12px;float:right;}
.demo-link{color:var(--primary);text-decoration:underline;cursor:pointer;font-weight:500;}

/* ====== 商品结果卡片(聊天内) ====== */
.product-card{display:flex;gap:12px;padding:12px;background:#fff;border-radius:12px;margin-bottom:10px;box-shadow:0 1px 6px rgba(0,0,0,0.05);cursor:pointer;}
.product-card:active{background:#fafafa;}
.pc-img{width:90px;height:90px;border-radius:8px;background:#f0f0f0;flex-shrink:0;overflow:hidden;}
.pc-img img{width:100%;height:100%;object-fit:cover;}
.pc-info{flex:1;min-width:0;}
.pc-title{font-size:13px;color:#333;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.pc-price{display:flex;align-items:baseline;gap:6px;margin-top:6px;}
.pc-current{font-size:18px;font-weight:700;color:#E74C3C;}
.pc-original{font-size:12px;color:#bbb;text-decoration:line-through;}
.pc-coupon{display:inline-block;background:linear-gradient(135deg,#FF6A00,#FF8C00);color:#fff;font-size:11px;padding:2px 8px;border-radius:10px;margin-top:4px;}
.pc-rebate{font-size:12px;color:var(--primary);margin-top:2px;font-weight:500;}
.pc-platform{font-size:11px;color:#999;margin-top:2px;}

/* ====== 热门推荐标签 ====== */
.recommend-bar{padding:8px 16px 12px;background:#fff;border-top:1px solid #f0f0f0;}
.rec-title{font-size:12px;color:#999;display:block;margin-bottom:8px;}
.rec-tags{display:flex;flex-wrap:wrap;gap:8px;}
.rec-tag{padding:5px 14px;background:#f5f5f5;border-radius:16px;font-size:12px;color:#666;cursor:pointer;}
.rec-tag:active{background:#eee;}

/* ====== 页面标题栏 ====== */
.page-title-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#fff;border-bottom:1px solid #eee;position:sticky;top:0;z-index:10;}
.back-btn{font-size:26px;color:var(--primary);cursor:pointer;line-height:1;padding:0 4px;}
.clear-btn,.share-btn{font-size:13px;color:var(--primary);cursor:pointer;}

/* ====== 空状态 ====== */
.empty-state{text-align:center;padding:60px 20px;}
.empty-icon{font-size:48px;margin-bottom:12px;}
.empty-text{font-size:15px;color:#999;}
.empty-hint{font-size:13px;color:#ccc;margin-top:4px;}

/* ====== 订单页 v2.0 ====== */
.order-summary{padding:8px 16px;font-size:12px;color:#999;background:#fafafa;border-bottom:1px solid #f0f0f0;}
.order-tabs{display:flex;margin:0 16px 8px;gap:0;background:#f0f0f0;border-radius:10px;padding:3px;}
.order-tab{flex:1;text-align:center;padding:8px 0;font-size:13px;color:#999;cursor:pointer;border-radius:8px;transition:all 0.2s;}
.order-tab.active{background:#fff;color:var(--primary);font-weight:600;box-shadow:0 1px 3px rgba(0,0,0,0.08);}

/* ====== 钱包 v2.0 ====== */
.wallet-card{background:linear-gradient(135deg,var(--primary),var(--primary-light));margin:16px;border-radius:16px;padding:24px 20px 20px;color:#fff;text-align:center;position:relative;overflow:hidden;}
.wallet-card::after{content:'';position:absolute;top:-30px;right:-30px;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,0.08);pointer-events:none;}
.wallet-balance-label{font-size:13px;opacity:0.85;display:flex;align-items:center;justify-content:center;gap:6px;}
.balance-eye{font-size:16px;cursor:pointer;opacity:0.7;transition:opacity 0.2s;}
.balance-eye:active{opacity:1;}
.wallet-balance{font-size:42px;font-weight:700;margin:8px 0 16px;transition:all 0.2s;min-height:50px;display:flex;align-items:center;justify-content:center;}
.wallet-actions{display:flex;gap:12px;justify-content:center;}
.wallet-btn{padding:10px 32px;border-radius:24px;font-size:14px;border:none;cursor:pointer;background:#fff;color:var(--primary);font-weight:600;}
.wallet-btn:active{opacity:0.85;}
.wallet-btn-secondary{background:rgba(255,255,255,0.2);color:#fff;}

/* 收益概览网格 */
.earnings-overview{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:0 16px 12px;}
.eo-item{background:#fff;border-radius:12px;padding:12px 8px;text-align:center;cursor:pointer;transition:transform 0.15s,box-shadow 0.15s;box-shadow:0 1px 4px rgba(0,0,0,0.04);}
.eo-item:active{transform:scale(0.96);box-shadow:0 2px 8px rgba(0,0,0,0.08);}
.eo-icon{font-size:20px;margin-bottom:4px;}
.eo-value{font-size:16px;font-weight:700;color:#333;white-space:nowrap;}
.eo-label{font-size:11px;color:#999;margin-top:2px;}
.eo-today .eo-value{color:#4CAF50;}
.eo-month .eo-value{color:#2196F3;}
.eo-total .eo-value{color:var(--primary);}
.eo-pending .eo-value{color:#FF9800;}

/* 已提现栏 */
.wallet-withdrawn-bar{display:flex;justify-content:space-between;align-items:center;margin:0 16px 12px;padding:10px 16px;background:#fff;border-radius:10px;font-size:13px;box-shadow:0 1px 4px rgba(0,0,0,0.04);}
.wwb-label{color:#666;display:flex;align-items:center;gap:4px;}
.wwb-value{font-weight:600;color:#4CAF50;}

/* Tab 切换 */
.wallet-tabs{display:flex;margin:0 16px;border-radius:10px;overflow:hidden;background:#f0f0f0;}
.wt-item{flex:1;text-align:center;padding:10px 0;font-size:13px;color:#999;cursor:pointer;transition:all 0.2s;position:relative;}
.wt-item.active{background:#fff;color:var(--primary);font-weight:600;border-radius:10px;box-shadow:0 2px 6px rgba(0,0,0,0.06);}

/* Tab 内容区 */
.wallet-tab-content{margin:12px 16px;}
.wallet-tab-content .txn-item{display:flex;align-items:center;gap:10px;padding:12px;background:#fff;border-radius:10px;margin-bottom:8px;box-shadow:0 1px 4px rgba(0,0,0,0.04);}
.txn-icon{font-size:24px;flex-shrink:0;}
.txn-info{flex:1;min-width:0;}
.txn-title{font-size:14px;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.txn-time{font-size:11px;color:#999;margin-top:2px;}
.txn-amount{font-size:14px;font-weight:600;flex-shrink:0;}
.txn-amount.positive{color:#4CAF50;}
.txn-amount.negative{color:#E74C3C;}
.withdraw-status{font-size:12px;font-weight:500;flex-shrink:0;padding:2px 8px;border-radius:10px;background:#f5f5f5;}

/* 空状态 */
.empty-wallet{text-align:center;padding:30px 15px;color:#bbb;font-size:14px;}

/* ====== 推广 ====== */
.promo-card{margin:16px;background:#fff;border-radius:16px;padding:20px;text-align:center;}
.promo-title{font-size:18px;font-weight:700;color:#333;}
.promo-desc{font-size:13px;color:#999;margin:8px 0 16px;line-height:1.6;}
.promo-stats{display:flex;gap:16px;justify-content:center;margin-bottom:16px;}
.ps-item{text-align:center;}
.ps-value{font-size:20px;font-weight:700;color:var(--primary);}
.ps-label{font-size:12px;color:#999;}
.promo-btn{background:var(--primary);color:#fff;border:none;padding:12px 40px;border-radius:24px;font-size:15px;cursor:pointer;}

/* ====== 帮助 ====== */
.help-list{margin:16px;background:#fff;border-radius:12px;overflow:hidden;}
.help-item{display:flex;justify-content:space-between;align-items:center;padding:16px;font-size:14px;cursor:pointer;border-bottom:1px solid #f5f5f5;}
.help-item:last-child{border-bottom:none;}
.help-item:active{background:#fafafa;}
.help-arrow{font-size:18px;color:#ccc;}

/* ====== 底部输入栏 ====== */
.chat-input-bar{position:fixed;bottom:0;left:0;right:0;z-index:99;background:#fff;border-top:1px solid #eee;padding:8px 12px;height:var(--input-h);}
.input-wrapper{display:flex;align-items:center;gap:8px;background:#f5f5f5;border-radius:24px;padding:2px 2px 2px 16px;}
.chat-input{flex:1;background:transparent;font-size:14px;height:40px;color:#333;min-width:0;}
.chat-input::placeholder{color:#bbb;}
.send-btn{background:var(--primary);color:#fff;padding:8px 18px;border-radius:20px;font-size:14px;cursor:pointer;white-space:nowrap;}
.send-btn:active{opacity:0.85;}


/* 热门搜索标签 */
.hot-search-tags{display:flex;flex-wrap:wrap;gap:6px;padding:8px 16px 2px;align-items:center;}
.hst-label{font-size:13px;margin-right:4px;}
.hst-tag{font-size:11px;padding:4px 10px;border-radius:14px;cursor:pointer;white-space:nowrap;transition:opacity 0.15s;}
.hst-tag:active{opacity:0.7;}

/* 分类导航 7平台 */
.mc-ks{background:linear-gradient(135deg,#FF5722,#FF9800);}
.mc-mt{background:linear-gradient(135deg,#FFC107,#FF9800);}

/* 骨架屏 */
.skeleton-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:0 16px;}
.skeleton-card{border-radius:12px;overflow:hidden;background:#fff;}
.skeleton-block{height:140px;border-radius:12px 12px 0 0;background:linear-gradient(90deg,#f0f0f0 25%,#e8e8e8 50%,#f0f0f0 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;}
.skeleton-line{height:12px;margin:8px 10px;border-radius:6px;background:linear-gradient(90deg,#f0f0f0 25%,#e8e8e8 50%,#f0f0f0 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;}
.skeleton-line.w60{width:60%;}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}


/* ====== 推广赚钱 v2.0 ====== */
.promo-hero{background:linear-gradient(135deg,#FF6A00,#FF8C00);margin:16px;border-radius:16px;padding:28px 20px;color:#fff;text-align:center;position:relative;overflow:hidden}
.promo-hero::after{content:'';position:absolute;top:-40px;right:-40px;width:150px;height:150px;border-radius:50%;background:rgba(255,255,255,0.08)}
.promo-hero-title{font-size:22px;font-weight:700;margin-bottom:6px}
.promo-hero-desc{font-size:13px;opacity:0.9;margin-bottom:16px}
.promo-hero-stats{display:flex;justify-content:center;align-items:center;gap:0}
.phs-item{flex:1;text-align:center}
.phs-val{font-size:28px;font-weight:700}
.phs-lbl{font-size:12px;opacity:0.8;margin-top:2px}
.phs-divider{width:1px;height:40px;background:rgba(255,255,255,0.3)}

.promo-invite-section{margin:12px 16px}
.promo-invite-label{font-size:13px;color:#666;margin-bottom:8px}
.promo-invite-box{display:flex;align-items:center;background:#f5f5f5;border-radius:10px;padding:10px 14px}
.promo-invite-link{flex:1;font-size:12px;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:monospace}
.promo-copy-btn{background:var(--primary);color:#fff;padding:6px 16px;border-radius:16px;font-size:12px;cursor:pointer;flex-shrink:0;margin-left:8px}
.promo-copy-btn:active{opacity:0.8}

.promo-share-options{display:flex;justify-content:space-around;margin:16px;gap:8px}
.pso-item{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;color:#666;cursor:pointer}
.pso-icon{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px;color:#fff}
.pso-item:active .pso-icon{opacity:0.8}

.promo-tips{background:#fff;margin:0 16px 20px;border-radius:12px;padding:16px;box-shadow:0 1px 4px rgba(0,0,0,0.04)}
.promo-tips h4{font-size:14px;color:#333;margin:0 0 8px}
.promo-tips p{font-size:12px;color:#999;margin:4px 0;line-height:1.6}

/* ====== 浏览历史 v2.0 ====== */
.history-count{font-size:12px;color:#999;padding:8px 16px;background:#fafafa;border-bottom:1px solid #f0f0f0}
.history-item{display:flex;gap:12px;padding:12px 16px;background:#fff;border-bottom:1px solid #f5f5f5;cursor:pointer;align-items:center}
.history-item:active{background:#fafafa}
.hi-img{width:70px;height:70px;border-radius:8px;overflow:hidden;flex-shrink:0;background:#f0f0f0}
.hi-img img{width:100%;height:100%;object-fit:cover}
.hi-img.no-img{display:flex;align-items:center;justify-content:center;color:#ccc;font-size:20px}
.hi-img.no-img::after{content:'📷'}
.hi-info{flex:1;min-width:0}
.hi-title{font-size:14px;color:#333;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.3}
.hi-price-row{display:flex;align-items:baseline;gap:6px;margin-top:6px}
.hi-price{font-size:15px;font-weight:700;color:#E74C3C}
.hi-old{font-size:11px;color:#bbb;text-decoration:line-through}

/* ====== 电商首页 ====== */
.mall-search-bar{padding:12px 16px;background:var(--primary);}
.mall-search-box{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,0.95);border-radius:24px;padding:10px 16px;cursor:pointer;}
.mall-search-icon{font-size:16px;}
.mall-search-placeholder{font-size:14px;color:#bbb;}

.mall-banner{position:relative;overflow:hidden;height:160px;}
.banner-slider{display:flex;height:100%;transition:transform 0.4s ease;}
.banner-slide{min-width:100%;display:flex;align-items:center;justify-content:center;position:relative;padding:20px;}
.banner-text{text-align:center;color:#fff;}
.banner-title{font-size:24px;font-weight:700;display:block;}
.banner-sub{font-size:14px;margin-top:6px;opacity:0.9;display:block;}
.banner-dots{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:6px;}
.dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,0.5);}
.dot.active{background:#fff;width:16px;border-radius:3px;}

.mall-categories{display:flex;background:#fff;padding:16px;gap:8px;}
.mc-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px;color:#666;cursor:pointer;}
.mc-icon{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#fff;}
.mc-tb{background:#FF4400;}
.mc-pdd{background:#C91523;}
.mc-jd{background:#E2231A;}
.mc-dy{background:#000;}
.mc-vip{background:#E1251B;}

.mall-section{margin:12px 16px;}
.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.section-header span:first-child{font-size:16px;font-weight:600;color:#333;}
.section-more{font-size:13px;color:var(--primary);cursor:pointer;}

/* ====== 限时抢购/秒杀网格 ====== */
.flash-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}

/* ====== 榜单横向滑动 ====== */
.ranking-scroll{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:4px 0 8px;}
.ranking-scroll::-webkit-scrollbar{display:none;}
.ranking-card{min-width:140px;width:140px;background:#fff;border-radius:12px;overflow:hidden;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,0.06);scroll-snap-align:start;position:relative;flex-shrink:0;}
.ranking-card:active{opacity:0.85;}
.rc-img{width:140px;height:140px;background:#f0f0f0;position:relative;}
.rc-img img{width:100%;height:100%;object-fit:cover;}
.rc-rank{position:absolute;top:4px;left:4px;width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#FF6A00,#FF8C00);color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;}
.rc-rank-1{background:linear-gradient(135deg,#FF4444,#FF6A00);}
.rc-rank-2{background:linear-gradient(135deg,#FF8C00,#FFB347);}
.rc-rank-3{background:linear-gradient(135deg,#FFB347,#FFD700);}
.rc-body{padding:8px;}
.rc-title{font-size:12px;color:#333;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.3;height:30px;}
.rc-price{font-size:14px;font-weight:700;color:#E74C3C;margin-top:4px;}
.rc-commission{font-size:10px;color:var(--primary);margin-top:2px;}
.rc-sales{font-size:10px;color:#999;margin-top:2px;}

/* ====== 秒杀卡片 ====== */
.flash-card{background:#fff;border-radius:12px;overflow:hidden;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,0.04);position:relative;}
.flash-card:active{opacity:0.85;}
.fc-img{width:100%;height:160px;background:#f0f0f0;position:relative;}
.fc-img img{width:100%;height:100%;object-fit:cover;}
.fc-tag{position:absolute;top:6px;left:6px;background:linear-gradient(135deg,#E74C3C,#FF6A00);color:#fff;font-size:10px;padding:2px 8px;border-radius:10px;font-weight:600;}
.fc-body{padding:10px;}
.fc-title{font-size:13px;color:#333;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.4;height:34px;}
.fc-price-row{display:flex;align-items:baseline;gap:6px;margin-top:6px;}
.fc-price{font-size:16px;font-weight:700;color:#E74C3C;}
.fc-old-price{font-size:11px;color:#bbb;text-decoration:line-through;}
.fc-sales{font-size:11px;color:#999;margin-top:3px;}

/* ====== 每日爆品/商品网格卡片 ====== */
.product-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}
.mall-product-card{background:#fff;border-radius:12px;overflow:hidden;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,0.04);}
.mall-product-card:active{opacity:0.85;}
.mpc-img{width:100%;height:160px;background:#f0f0f0;position:relative;}
.mpc-img img{width:100%;height:100%;object-fit:cover;}
.mpc-commission-badge{position:absolute;top:4px;right:4px;background:linear-gradient(135deg,#FF6A00,#FF8C00);color:#fff;font-size:10px;padding:2px 6px;border-radius:8px;font-weight:600;}
.mpc-body{padding:10px;}
.mpc-title{font-size:13px;color:#333;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.4;height:34px;}
.mpc-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:6px;}
.mpc-price{font-size:16px;font-weight:700;color:#E74C3C;}
.mpc-coupon{font-size:10px;background:linear-gradient(135deg,#FF6A00,#FF8C00);color:#fff;padding:2px 8px;border-radius:10px;}
.mpc-sales{font-size:11px;color:#999;margin-top:3px;display:flex;align-items:center;gap:4px;}

/* ====== 底部卡片 ====== */
.mall-bottom{padding:12px 16px 20px;display:flex;flex-direction:column;gap:10px;}
.push-card{display:flex;align-items:center;gap:12px;background:#fff;border-radius:12px;padding:14px 16px;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,0.04);}
.push-card:active{background:#fafafa;}
.push-icon{font-size:24px;}
.push-title{font-size:14px;font-weight:500;color:#333;}
.push-desc{font-size:12px;color:#999;margin-top:2px;}
.push-arrow{font-size:20px;color:#ccc;margin-left:auto;}

/* ====== 骨架屏/加载 ====== */
.skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:skeleton-loading 1.5s infinite;}
@keyframes skeleton-loading{0%{background-position:200% 0}100%{background-position:-200% 0}}
.skeleton-block{height:200px;border-radius:12px;margin-bottom:12px;}
.skeleton-line{height:14px;border-radius:8px;margin-bottom:8px;width:70%;}
.skeleton-line.w60{width:60%;}
.skeleton-line.w40{width:40%;}
.skeleton-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}
.skeleton-card{border-radius:12px;overflow:hidden;}
.skeleton-card .sk-img{height:160px;background:#f0f0f0;}
.skeleton-card .sk-body{padding:10px;background:#fff;}
.skeleton-card .sk-body .sk-line{height:12px;border-radius:6px;background:#f0f0f0;margin-bottom:6px;}
.skeleton-card .sk-body .sk-line:last-child{margin-bottom:0;}

/* ====== 加载更多 ====== */
.load-more-btn{text-align:center;padding:14px;font-size:13px;color:var(--primary);cursor:pointer;background:#fff;margin:0 16px 12px;border-radius:12px;}
.load-more-btn:active{background:#f5f5f5;}
.load-more-btn .loading-text{color:#999;}
.load-more-btn.loading{pointer-events:none;}
.loading-spinner{display:inline-block;width:16px;height:16px;border:2px solid #eee;border-top-color:var(--primary);border-radius:50%;animation:spin 0.8s linear infinite;vertical-align:middle;margin-right:6px;}
@keyframes spin{to{transform:rotate(360deg)}}


/* ====== 搜索 v2.0 ====== */
/* 搜索骨架屏 */
.search-loading{padding:12px 16px;}
.search-skel-card{display:flex;gap:12px;padding:12px;margin-bottom:10px;background:#fff;border-radius:12px;}
.search-skel-img{width:100px;height:100px;border-radius:8px;flex-shrink:0;background:linear-gradient(90deg,#f0f0f0 25%,#e8e8e8 50%,#f0f0f0 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;}
.search-skel-info{flex:1;display:flex;flex-direction:column;gap:8px;padding-top:4px;}
.search-skel-line{height:14px;border-radius:6px;background:linear-gradient(90deg,#f0f0f0 25%,#e8e8e8 50%,#f0f0f0 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;}
.search-skel-line.short{width:60%;}
.search-skel-line.shorter{width:35%;}

/* 搜索结果卡片增强 */
.prc-img{position:relative;overflow:hidden;}
.prc-coupon-badge{position:absolute;top:6px;left:6px;background:linear-gradient(135deg,#E74C3C,#FF6A00);color:#fff;font-size:10px;padding:2px 8px;border-radius:8px;font-weight:600;z-index:2;}
.prc-save-badge{position:absolute;bottom:6px;right:6px;background:rgba(0,0,0,0.65);color:#fff;font-size:10px;padding:2px 6px;border-radius:6px;z-index:2;}
.prc-pf-tag{font-size:10px;color:#999;margin-left:auto;background:#f5f5f5;padding:1px 6px;border-radius:6px;flex-shrink:0;}
.prc-meta{display:flex;align-items:center;gap:8px;margin-top:4px;font-size:11px;color:#999;}
.prc-rebate-tag{color:#FF5722;font-weight:500;}
.prc-sales{color:#bbb;}
.prc-shop{color:#bbb;max-width:70px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.prc-img.no-img{background:#f5f5f5;display:flex;align-items:center;justify-content:center;color:#ccc;font-size:24px;min-height:100px;}
.prc-img.no-img::after{content:'📷';}

/* 商品详情 v2.0 */
.pd-rebate-box{background:linear-gradient(135deg,#FFF8E1,#FFF3E0);border-radius:12px;padding:12px 14px;margin:10px 0;}
.pd-rebate-row{display:flex;justify-content:space-between;align-items:center;padding:4px 0;font-size:13px;color:#666;}
.pd-rebate-val{font-weight:700;color:#333;}
.pd-rebate-val.coupon{color:#E74C3C;}
.pd-rebate-val.save{color:#FF6A00;}
.pd-activate-hint{text-align:center;font-size:12px;color:#999;padding:6px 0;}

/* 粘性购买底栏 */
.pd-sticky-bar{position:fixed;bottom:0;left:0;right:0;background:#fff;padding:10px 16px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 -2px 10px rgba(0,0,0,0.08);z-index:100;border-radius:16px 16px 0 0;}
.pd-sticky-price{font-size:18px;font-weight:700;color:#E74C3C;}
.pd-sticky-rebate{font-size:11px;color:#FF5722;font-weight:500;margin-left:4px;background:#FFF3E0;padding:2px 8px;border-radius:8px;}
.pd-buy-btn{background:linear-gradient(135deg,#FF6A00,#FF8C00);color:#fff;border:none;padding:12px 28px;border-radius:24px;font-size:15px;font-weight:600;cursor:pointer;white-space:nowrap;}
.pd-buy-btn:active{opacity:0.85;}

/* ====== 平台搜索页 ====== */
.platform-search-box{flex:1;display:flex;align-items:center;background:#f5f5f5;border-radius:20px;padding:2px;margin:0 8px;}
.platform-input{flex:1;background:transparent;font-size:13px;padding:6px 12px;color:#333;}
.platform-search-btn{padding:6px 12px;cursor:pointer;}
.platform-results{padding:12px 16px;}
.platform-result-card{display:flex;gap:12px;padding:12px;background:#fff;border-radius:12px;margin-bottom:10px;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,0.04);}
.platform-result-card:active{background:#fafafa;}
.prc-img{width:100px;height:100px;border-radius:8px;background:#f0f0f0;flex-shrink:0;overflow:hidden;}
.prc-img img{width:100%;height:100%;object-fit:cover;}
.prc-info{flex:1;min-width:0;}
.prc-title{font-size:14px;color:#333;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.prc-price-row{display:flex;align-items:baseline;gap:6px;margin-top:6px;}
.prc-curr{font-size:20px;font-weight:700;color:#E74C3C;}
.prc-old{font-size:12px;color:#bbb;text-decoration:line-through;}
.prc-tags{margin-top:4px;display:flex;gap:6px;flex-wrap:wrap;}
.prc-tag{font-size:11px;background:linear-gradient(135deg,#FF6A00,#FF8C00);color:#fff;padding:2px 8px;border-radius:10px;}
.prc-rebate{font-size:12px;color:var(--primary);margin-top:2px;font-weight:500;}
.prc-platform{font-size:11px;color:#999;margin-top:2px;}

/* ====== 商品详情 ====== */
#productDetail{padding:0 0 20px;}
.pd-images{background:#fff;}
.pd-main-img{width:100%;height:300px;background:#f0f0f0;display:flex;align-items:center;justify-content:center;font-size:64px;}
.pd-main-img img{width:100%;height:100%;object-fit:cover;}
.pd-body{padding:16px;}
.pd-title{font-size:16px;font-weight:500;line-height:1.5;}
.pd-price-row{display:flex;align-items:baseline;gap:8px;margin:12px 0;padding:12px 0;border-bottom:1px solid #f0f0f0;}
.pd-curr{font-size:28px;font-weight:700;color:#E74C3C;}
.pd-old{font-size:14px;color:#bbb;text-decoration:line-through;}
.pd-rebate{display:flex;align-items:center;gap:8px;background:var(--primary-bg);padding:10px 16px;border-radius:12px;margin-bottom:12px;}
.pd-rebate-icon{font-size:18px;}
.pd-rebate-text{font-size:14px;color:var(--primary);font-weight:500;}
.pd-rebate-amount{font-size:18px;font-weight:700;color:var(--primary);}
.pd-activate-hint{text-align:center;color:#999;font-size:13px;padding:20px;background:#f9f9f9;border-radius:12px;margin-top:12px;}
.pd-activate-hint span{color:var(--primary);font-weight:500;cursor:pointer;}
.pd-buy-btn{display:block;text-align:center;background:var(--primary);color:#fff;padding:14px;border-radius:24px;font-size:16px;font-weight:600;margin:16px;cursor:pointer;}
.pd-buy-btn:active{opacity:0.85;}
.pd-info-section{padding:16px;margin:12px 16px;background:#fff;border-radius:12px;}
.pd-info-title{font-size:14px;font-weight:600;margin-bottom:8px;color:#333;}
.pd-info-text{font-size:13px;color:#999;line-height:1.8;}

/* ====== 弹窗 ====== */
.modal{position:fixed;top:0;left:0;right:0;bottom:0;z-index:300;background:rgba(0,0,0,0.5);display:none;align-items:center;justify-content:center;padding:20px;}
.modal.active{display:flex;}
.modal-content{background:#fff;border-radius:20px;padding:32px 24px 24px;width:100%;max-width:360px;position:relative;animation:fadeUp 0.3s ease;}
@keyframes fadeUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
.modal-close{position:absolute;top:12px;right:16px;font-size:18px;color:#ccc;cursor:pointer;}
.modal-icon{font-size:40px;text-align:center;margin-bottom:8px;}
.modal-title{font-size:18px;font-weight:700;text-align:center;color:#333;margin-bottom:8px;}
.modal-desc{font-size:13px;color:#999;text-align:center;line-height:1.6;margin-bottom:20px;}
.modal-input-group{display:flex;align-items:center;background:#f5f5f5;border-radius:12px;padding:4px;margin-bottom:16px;}
.phone-prefix{padding:10px 12px;font-size:15px;color:#333;font-weight:500;border-right:1px solid #ddd;white-space:nowrap;}
.modal-input{flex:1;background:transparent;padding:12px;font-size:16px;color:#333;}
.code-input-group{text-align:center;margin-bottom:16px;}
.code-input{width:200px;padding:12px 16px;font-size:20px;text-align:center;background:#f5f5f5;border-radius:12px;color:#333;letter-spacing:8px;}
.modal-btn{width:100%;padding:14px;background:var(--primary);color:#fff;border:none;border-radius:24px;font-size:16px;font-weight:600;cursor:pointer;}
.modal-btn:active{opacity:0.85;}
.modal-btn:disabled{opacity:0.5;cursor:not-allowed;}
.modal-skip{text-align:center;margin-top:12px;font-size:13px;color:#bbb;cursor:pointer;}
.resend-code{text-align:center;margin-top:12px;font-size:13px;color:var(--primary);cursor:pointer;}

/* ====== Toast ====== */
.toast{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:999;background:rgba(0,0,0,0.75);color:#fff;padding:12px 24px;border-radius:12px;font-size:14px;display:none;pointer-events:none;text-align:center;max-width:80%;}
.toast.show{display:block;animation:toastIn 0.25s ease;}
@keyframes toastIn{from{opacity:0;transform:translate(-50%,-50%) scale(0.85)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}

/* ====== 消息加载动画 ====== */
.typing-dots{display:flex;gap:4px;padding:4px 0;}
.typing-dots span{width:6px;height:6px;background:#bbb;border-radius:50%;animation:typing 1.2s infinite;}
.typing-dots span:nth-child(2){animation-delay:0.2s;}
.typing-dots span:nth-child(3){animation-delay:0.4s;}
@keyframes typing{0%,60%,100%{opacity:0.3}30%{opacity:1}}


/* ============================================================
   📱 响应式断点 — 平板 + 桌面端适配
   ============================================================ */

/* ─── 平板 (≥768px) — 更宽布局，双列商品 ─── */
@media (min-width: 768px) {
  .container { max-width: 720px; margin: 0 auto; }
  .header { padding: 0 20px; }
  .header-title { font-size: 18px; }
  
  /* 商品双列网格 */
  .product-grid { 
    display: grid; 
    grid-template-columns: repeat(2, 1fr); 
    gap: 12px; 
    padding: 12px 16px; 
  }
  .product-card { margin-bottom: 0; }
  
  /* 更大弹窗 */
  .modal-content { max-width: 440px; padding: 36px 32px 28px; }
  .modal-title { font-size: 20px; }
  .modal-desc { font-size: 14px; }
  
  /* 聊天区域更宽 */
  .chat-messages { padding: 12px 40px; }
  .chat-input-area { padding: 10px 40px; }
  
  /* 侧边栏更宽 */
  .side-menu { width: 300px; }
  
  /* 搜索栏更大 */
  .search-bar { max-width: 600px; margin: 0 auto; }
  
  /* Toast 适中 */
  .toast { max-width: 400px; font-size: 15px; }
}

/* ─── 桌面 (≥1024px) — 居中布局，三列商品 ─── */
@media (min-width: 1024px) {
  .container { max-width: 960px; }
  
  /* 三列商品网格 */
  .product-grid { 
    grid-template-columns: repeat(3, 1fr); 
    gap: 16px; 
    padding: 16px 0;
  }
  
  /* 桌面端去掉固定头部的全屏感 */
  .header { 
    position: relative; 
    max-width: 960px; 
    margin: 0 auto; 
    border-radius: 0;
  }
  
  /* 内容区域上部间距 */
  .content { padding-top: 8px; }
  .content.has-header { padding-top: 8px; }
  
  /* 更大的聊天区 */
  .chat-messages { 
    max-width: 800px; 
    margin: 0 auto; 
    padding: 16px 60px; 
  }
  .chat-input-area { 
    max-width: 800px; 
    margin: 0 auto; 
    padding: 12px 60px; 
    border-radius: 24px 24px 0 0; 
  }
  
  /* 产品详情更大 */
  .product-detail { max-width: 800px; margin: 0 auto; }
  .product-detail .product-image { max-height: 400px; }

  /* 弹窗更大 */
  .modal-content { max-width: 480px; }
  
  /* 侧边栏 + 主内容并排（如果支持的话） */
  .side-menu { width: 320px; }
  
  /* 商城首页大 banner */
  .banner { max-width: 960px; margin: 0 auto; border-radius: 16px; }
  
  /* 分类网格更大 */
  .category-grid { 
    max-width: 960px; 
    margin: 0 auto; 
    grid-template-columns: repeat(5, 1fr); 
  }
  
  /* 排行榜条目增大间距 */
  .ranking-item { padding: 14px 16px; }
}

/* ─── 大屏 (≥1440px) — 更宽松 ─── */
@media (min-width: 1440px) {
  .container { max-width: 1200px; }
  .product-grid { grid-template-columns: repeat(4, 1fr); gap: 20px; }
  .chat-messages { max-width: 900px; }
  .chat-input-area { max-width: 900px; }
  .modal-content { max-width: 520px; }
}

/* ─── 横屏手机 — 特殊处理 ─── */
@media (max-height: 480px) and (orientation: landscape) {
  .header { height: 44px; }
  .header-title { font-size: 15px; }
  .content.has-header { padding-top: 44px; }
  .chat-input-area { padding: 6px 16px; }
  .product-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ─── 暗色模式（系统偏好） ─── */
@media (prefers-color-scheme: dark) {
  /* 仅做基础适配，不影响品牌色 */
  .page { background: #1a1a2e; }
  .header { background: #16213e; }
  .chat-bubble.bot { background: #2a2a4a; color: #e0e0e0; }
  .chat-bubble.user { background: var(--primary); }
  .product-card { background: #252540; }
  .product-card .title { color: #e0e0e0; }
  .product-card .price { color: #ff6b6b; }
  .product-card .desc { color: #aaa; }
  .search-bar input { background: #2a2a4a; color: #e0e0e0; }
  .modal-content { background: #252540; }
  .modal-title { color: #e0e0e0; }
  .modal-desc { color: #aaa; }
  .modal-input, .code-input { background: #333; color: #e0e0e0; }
  .side-menu { background: #16213e; }
  .side-menu-item { color: #ccc; }
  .ranking-item { border-bottom-color: #333; }
  .toast { background: rgba(255,255,255,0.15); }
}

/* ====== 订单卡片 v2.0 ====== */
.order-card{background:#fff;margin:10px 16px;border-radius:12px;padding:14px;box-shadow:0 1px 4px rgba(0,0,0,0.04);cursor:pointer;transition:transform 0.15s;}
.order-card:active{transform:scale(0.98);}
.order-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.order-pf{font-size:13px;font-weight:500;color:#666;display:flex;align-items:center;gap:4px;}
.order-status-badge{font-size:11px;padding:3px 10px;border-radius:12px;font-weight:500;}
.order-status-badge.settled{background:#E8F5E9;color:#2E7D32;}
.order-status-badge.paid{background:#E3F2FD;color:#1565C0;}
.order-status-badge.pending{background:#FFF3E0;color:#E65100;}
.order-status-badge.received{background:#F3E5F5;color:#7B1FA2;}
.order-status-badge.refunded{background:#FFEBEE;color:#C62828;}
.order-body{margin-bottom:8px;}
.order-goods-name{font-size:14px;color:#333;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.order-shop{font-size:11px;color:#999;margin-top:4px;}
.order-footer{display:flex;justify-content:space-between;align-items:center;}
.order-footer-left{display:flex;align-items:baseline;gap:6px;}
.order-price{font-size:15px;font-weight:700;color:#E74C3C;}
.order-coupon{font-size:11px;color:#FF6A00;background:#FFF3E0;padding:1px 6px;border-radius:8px;}
.order-footer-right{display:flex;flex-direction:column;align-items:flex-end;gap:2px;}
.order-commission{font-size:13px;font-weight:500;color:var(--primary);}
.order-settle-pending{font-size:10px;color:#FF9800;background:#FFF8E1;padding:1px 6px;border-radius:6px;}

/* 订单详情弹窗 */
.detail-header{background:linear-gradient(135deg,var(--primary),var(--primary-light));padding:20px;text-align:center;color:#fff;position:relative;border-radius:12px 12px 0 0;}
.detail-close{position:absolute;top:10px;right:14px;font-size:18px;cursor:pointer;opacity:0.8;}
.detail-status-big{font-size:16px;font-weight:600;}
.detail-body{padding:16px;}
.detail-goods{display:flex;gap:12px;margin-bottom:16px;align-items:center;}
.detail-goods-img{width:60px;height:60px;border-radius:8px;object-fit:cover;background:#f0f0f0;flex-shrink:0;}
.detail-goods-info{flex:1;min-width:0;}
.detail-goods-name{font-size:14px;color:#333;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.detail-shop{font-size:11px;color:#999;margin-top:4px;}
.detail-section{margin-bottom:12px;background:#fafafa;border-radius:10px;padding:12px;}
.detail-section-title{font-size:13px;font-weight:600;color:#666;margin-bottom:10px;}
.detail-section.highlight{background:#F3F0FF;}
.detail-row{display:flex;justify-content:space-between;align-items:center;padding:4px 0;font-size:13px;}
.detail-row.big{font-size:15px;font-weight:600;}
.detail-row .dl{color:#888;flex-shrink:0;}
.detail-row .dr{text-align:right;color:#333;font-weight:500;}
.detail-row .dr.price{color:#E74C3C;font-size:17px;}
.detail-row .dr.commission{color:var(--primary);}
.detail-row .dr.muted{color:#bbb;text-decoration:line-through;font-size:12px;}
.detail-row .dr.mono{font-family:monospace;font-size:11px;color:#999;}
.detail-row.green .dr{color:#2E7D32;}

/* 时间线 */
.timeline-item{display:flex;gap:10px;padding-bottom:12px;position:relative;}
.timeline-item:not(.last)::after{content:'';position:absolute;left:11px;top:24px;bottom:0;width:2px;background:#e0e0e0;}
.timeline-dot{width:24px;height:24px;border-radius:50%;background:#fff;border:2px solid var(--primary);display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0;z-index:1;}
.timeline-item.last .timeline-dot{background:var(--primary);border-color:var(--primary);}
.timeline-body{flex:1;min-width:0;padding-top:2px;}
.timeline-label{font-size:13px;color:#333;font-weight:500;}
.timeline-time{font-size:11px;color:#999;margin-top:2px;}
.detail-loading{text-align:center;padding:30px;color:#999;font-size:14px;}

@media(min-width:500px){.order-card{margin:10px auto;max-width:500px;}}

.load-more {
  text-align: center; padding: 12px; color: #999; font-size: 13px; cursor: pointer;
}
.load-more:hover { color: var(--primary); }

/* ====== H5 UX Upgrade: Page Transitions ====== */
.page {
  display: none;
  opacity: 0;
  transform: translateX(20px);
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.page.active {
  display: block;
  opacity: 1;
  transform: translateX(0);
}
.page.slide-out-left {
  opacity: 0;
  transform: translateX(-20px);
}
.page.slide-in-right {
  display: block;
  opacity: 0;
  transform: translateX(20px);
  animation: slideInRight 0.3s ease forwards;
}
@keyframes slideInRight {
  to { opacity: 1; transform: translateX(0); }
}
@keyframes slideOutLeft {
  to { opacity: 0; transform: translateX(-20px); }
}

/* ====== Pull-to-Refresh ====== */
.ptr-container { position: relative; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.ptr-indicator {
  position: absolute; top: 0; left: 0; right: 0;
  height: 0; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  transition: height 0.2s ease;
  z-index: 10;
}
.ptr-indicator.show { height: 50px; }
.ptr-indicator .ptr-icon {
  font-size: 18px; color: var(--primary);
  transition: transform 0.2s ease;
}
.ptr-indicator.flip .ptr-icon { transform: rotate(180deg); }
.ptr-indicator.refreshing .ptr-icon { animation: ptrSpin 0.8s linear infinite; }
@keyframes ptrSpin { to { transform: rotate(360deg); } }
.ptr-content { transition: transform 0.2s ease; }
.ptr-content.pulled { transform: translateY(50px); }

/* ====== Wallet Transactions (v2.0 merged into wallet) ====== */
.txn-item .txn-info { flex: 1; }
.txn-item .txn-title { font-size: 14px; color: #333; }
.txn-item .txn-time { font-size: 11px; color: #999; margin-top: 2px; }
.txn-item .txn-amount { font-size: 16px; font-weight: 600; }
.txn-item .txn-amount.positive { color: #00c853; }
.txn-item .txn-amount.negative { color: #ff5252; }

/* ====== 通知中心 ====== */
.notif-bell{position:relative;font-size:20px;padding:4px 6px;cursor:pointer;transition:0.2s;}
.notif-bell:active{transform:scale(0.9);}
.notif-badge{position:absolute;top:-2px;right:-2px;background:#FF4757;color:#fff;font-size:10px;min-width:16px;height:16px;line-height:16px;text-align:center;border-radius:8px;padding:0 4px;font-weight:700;border:1.5px solid #fff;}
.menu-badge{display:inline-block;background:#FF4757;color:#fff;font-size:10px;min-width:16px;height:16px;line-height:16px;text-align:center;border-radius:8px;padding:0 4px;margin-left:auto;font-weight:700;}
.notif-mark-all{font-size:12px;color:#409EFF;cursor:pointer;padding:2px 8px;}
.notif-mark-all:active{opacity:0.7;}
.notif-list{padding:0;}
.notif-item{display:flex;align-items:flex-start;padding:14px 16px;background:#fff;border-bottom:1px solid #f0f0f0;cursor:pointer;transition:0.15s;gap:12px;}
.notif-item:active{background:#f5f7fa;}
.notif-item.unread{background:#f0f7ff;}
.notif-item.unread::before{content:'';position:absolute;left:6px;top:50%;transform:translateY(-50%);width:6px;height:6px;background:#409EFF;border-radius:50%;}
.notif-item{position:relative;padding-left:22px;}
.notif-icon{font-size:24px;flex-shrink:0;width:32px;text-align:center;}
.notif-body{flex:1;min-width:0;}
.notif-title{font-size:14px;font-weight:600;color:#333;margin-bottom:4px;}
.notif-content{font-size:12px;color:#888;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.notif-time{font-size:11px;color:#bbb;margin-top:6px;}