*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;background:#f6f7fb;color:#333}
body{max-width:480px;margin:0 auto;min-height:100vh}

/* ========== 导航栏 ========== */
.navbar{display:flex;align-items:center;padding:12px 14px;gap:10px;background:linear-gradient(180deg,#667eea,#764ba2)}
.navbar.plain{background:#fff;border-bottom:1px solid #f0f0f0}
.navbar .back-btn{width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:24px;color:#fff;cursor:pointer;text-decoration:none;border-radius:50%}
.navbar.plain .back-btn{color:#333}
.navbar .title{flex:1;text-align:center;font-size:17px;font-weight:600;color:#333}
.navbar .city{color:#fff;font-size:14px;font-weight:500;white-space:nowrap}
.navbar .search{flex:1;background:rgba(255,255,255,.95);border-radius:22px;padding:8px 16px;font-size:13px;color:#999}
.capsule{background:rgba(255,255,255,.25);border-radius:18px;padding:5px 12px;display:flex;align-items:center;gap:6px;color:#fff;font-size:14px;text-decoration:none;backdrop-filter:blur(10px)}
.capsule.gray{background:#f0f0f0;color:#666}
.capsule .dot{width:1px;height:14px;background:rgba(255,255,255,.5)}

/* ========== Banner ========== */
.banner{margin:8px 14px 0;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:16px;height:150px;position:relative;overflow:hidden;box-shadow:0 4px 16px rgba(102,126,234,.3)}
.banner-text{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;z-index:2}
.banner-text p{font-size:20px;font-weight:800;line-height:1.5;letter-spacing:2px}
.banner-text .r{color:#ff6b6b}.banner-text .b{color:#fff}
.banner-dots{position:absolute;bottom:10px;left:0;right:0;display:flex;justify-content:center;gap:6px;z-index:3}
.banner-dots span{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.5)}
.banner-dots span.on{background:#fff;width:18px;border-radius:3px}
.fig{position:absolute;bottom:20px;width:24px;height:55px;opacity:.9}
.fig::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:16px;height:16px;border-radius:50%;background:#ffd4a3}
.fig::after{content:'';position:absolute;top:16px;left:50%;transform:translateX(-50%);width:22px;height:38px;border-radius:10px}
.f1{left:18px}.f1::after{background:rgba(255,255,255,.3)}
.f2{left:46px;bottom:24px}.f2::after{background:rgba(255,255,255,.25)}
.f3{left:74px;bottom:28px}.f3::after{background:rgba(255,255,255,.2)}
.f4{right:18px}.f4::after{background:rgba(255,255,255,.3)}
.f5{right:48px;bottom:24px}.f5::after{background:rgba(255,255,255,.25)}
.tag-sign{position:absolute;font-size:10px;font-weight:700;padding:4px 8px;border-radius:6px;color:#fff;z-index:3;backdrop-filter:blur(4px)}
.ts1{top:20px;right:38px;background:rgba(239,83,80,.9)}
.ts2{top:42px;right:8px;background:rgba(66,165,245,.9)}

/* ========== 宫格 ========== */
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:16px 14px 0}
.gcard{background:#fff;border-radius:16px;padding:20px 10px 16px;text-align:center;box-shadow:0 2px 12px rgba(0,0,0,.04);cursor:pointer;text-decoration:none;display:block;transition:transform .2s}
.gcard:active{transform:scale(.97)}
.gicon{width:72px;height:72px;margin:0 auto 8px;display:flex;align-items:center;justify-content:center;font-size:48px;border-radius:20px}
.glabel{font-size:15px;font-weight:600;color:#333}

/* ========== 悬浮客服 ========== */
.fab{position:fixed;right:18px;bottom:90px;width:52px;height:52px;border-radius:50%;background:#667eea;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(102,126,234,.4);z-index:50;text-decoration:none;font-size:20px}
.fab span{font-size:10px;margin-top:1px}

/* ========== 空状态 ========== */
.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px}
.empty-icon{width:110px;height:110px;margin-bottom:16px}
.empty-title{font-size:16px;color:#999;margin-top:12px}
.empty-desc{font-size:14px;color:#999;margin-top:6px}
.empty-desc a{color:#667eea}

/* ========== TabBar ========== */
.tabbar{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;height:62px;background:#fff;display:flex;align-items:center;border-top:1px solid #f0f0f0;z-index:100;box-shadow:0 -2px 12px rgba(0,0,0,.04)}
.tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#999;text-decoration:none;cursor:pointer}
.tab.on{color:#667eea;font-weight:600}
.tab span{font-size:11px}
.tab.center{flex:0.7}
.pub-btn{width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;margin-top:-22px;box-shadow:0 6px 16px rgba(102,126,234,.4);border:3px solid #fff;color:#fff;font-size:28px}

/* ========== 分类宫格 ========== */
.cat-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:16px 14px}
.cat-card{height:130px;border-radius:16px;padding:18px;position:relative;overflow:hidden;cursor:pointer;box-shadow:0 4px 16px rgba(0,0,0,.08);text-decoration:none;display:block;transition:transform .2s}
.cat-card:active{transform:scale(.97)}
.cat-card .en{font-size:10px;color:rgba(255,255,255,.85);font-weight:600;letter-spacing:.5px}
.cat-card .cn{font-size:22px;font-weight:800;color:#fff;margin-top:8px;text-shadow:0 2px 4px rgba(0,0,0,.1)}
.cat-deco{position:absolute;right:-10px;bottom:-10px;font-size:60px;opacity:.25}
.sort-bar{display:flex;align-items:center;padding:14px 16px;font-size:14px;color:#333}

/* ========== 人员列表 ========== */
.peer-list{padding:14px;display:flex;flex-direction:column;gap:12px}
.peer-card{background:#fff;border-radius:16px;padding:14px;display:flex;gap:12px;box-shadow:0 2px 12px rgba(0,0,0,.04);cursor:pointer;text-decoration:none;transition:transform .2s}
.peer-card:active{transform:scale(.98)}
.peer-avatar{width:72px;height:72px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:36px;flex-shrink:0;background:linear-gradient(135deg,#FFE0B2,#FFCCBC)}
.peer-info{flex:1;min-width:0}
.peer-name{font-size:16px;font-weight:700;display:flex;align-items:center;gap:6px;color:#333}
.peer-online{font-size:10px;color:#4CAF50;background:#E8F5E9;padding:2px 8px;border-radius:10px;font-weight:400}
.peer-meta{font-size:12px;color:#999;margin:6px 0}
.peer-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.peer-tag{font-size:11px;background:#f5f5f5;color:#666;padding:3px 10px;border-radius:12px}
.peer-price{text-align:right;flex-shrink:0;display:flex;flex-direction:column;justify-content:center}
.peer-price .p{color:#ff6b6b;font-size:18px;font-weight:800}
.peer-price .u{font-size:11px;color:#999}

/* ========== 人员详情 ========== */
.detail-head{height:280px;background:linear-gradient(135deg,#667eea,#764ba2);position:relative;display:flex;align-items:center;justify-content:center}
.detail-avatar{width:110px;height:110px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-size:56px;box-shadow:0 8px 32px rgba(0,0,0,.2);border:4px solid rgba(255,255,255,.3)}
.detail-back{position:absolute;top:14px;left:14px;width:34px;height:34px;background:rgba(0,0,0,.25);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;cursor:pointer;z-index:5;text-decoration:none}
.detail-body{background:#fff;border-radius:20px 20px 0 0;margin-top:-20px;flex:1;padding:20px;position:relative;z-index:2;padding-bottom:80px}
.d-name{font-size:22px;font-weight:800;display:flex;align-items:center;gap:8px}
.d-online{font-size:11px;color:#4CAF50;background:#E8F5E9;padding:3px 10px;border-radius:12px;font-weight:400}
.d-meta{font-size:13px;color:#999;margin:10px 0}
.d-tags{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.d-tag{font-size:12px;background:#E3F2FD;color:#1565C0;padding:5px 14px;border-radius:16px}
.d-section{margin-top:20px}
.d-section h4{font-size:15px;font-weight:700;margin-bottom:10px;color:#333}
.d-section p{font-size:14px;color:#666;line-height:1.7}
.d-price-box{margin-top:24px;background:linear-gradient(135deg,#FFF3E0,#FFE0B2);border-radius:14px;padding:16px;display:flex;align-items:center;justify-content:space-between}
.d-price-box .p{color:#ff6b6b;font-size:26px;font-weight:800}
.d-price-box .u{font-size:12px;color:#999}
.d-order-btn{margin-top:24px;width:100%;padding:15px;background:linear-gradient(90deg,#667eea,#764ba2);color:#fff;border:none;border-radius:28px;font-size:16px;font-weight:600;cursor:pointer;box-shadow:0 4px 16px rgba(102,126,234,.4)}

/* ========== 消息页 ========== */
.msg-head{background:linear-gradient(180deg,#667eea,#764ba2);padding:14px 0 16px;text-align:center}
.msg-head h2{font-size:17px;font-weight:600;color:#fff}
.msg-cats{display:flex;justify-content:space-around;background:#fff;padding:16px 0 20px;border-bottom:1px solid #f0f0f0;border-radius:0 0 20px 20px}
.mcat{display:flex;flex-direction:column;align-items:center;gap:8px}
.mcat-icon{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:24px;box-shadow:0 4px 12px rgba(0,0,0,.1)}
.c-blue{background:linear-gradient(135deg,#42A5F5,#1E88E5)}
.c-red{background:linear-gradient(135deg,#EF5350,#E53935)}
.c-yellow{background:linear-gradient(135deg,#FFB300,#FF8F00)}
.mcat p{font-size:13px;color:#333}

/* ========== 我的页 ========== */
.mine-head{background:linear-gradient(180deg,#667eea,#764ba2)}
.mine-top{display:flex;align-items:center;padding:14px}
.mine-top .menu{width:32px;color:#fff;font-size:20px}
.mine-top h2{flex:1;text-align:center;font-size:17px;font-weight:600;color:#fff}
.mine-capsule{background:rgba(255,255,255,.25);border-radius:18px;padding:5px 12px;display:flex;align-items:center;gap:6px;color:#fff;text-decoration:none;backdrop-filter:blur(10px)}
.user-card{display:flex;justify-content:space-between;padding:8px 16px 16px;align-items:flex-start}
.user-left{display:flex;gap:14px}
.avatar{width:64px;height:64px;border-radius:50%;background:rgba(255,255,255,.3);border:2px solid rgba(255,255,255,.5);display:flex;align-items:center;justify-content:center;font-size:30px;color:#fff}
.uno{display:flex;flex-direction:column;gap:4px}
.uname-row{display:flex;align-items:center;gap:6px}
.uname{font-size:18px;font-weight:700;color:#fff}
.utag{background:#4CAF50;color:#fff;font-size:11px;padding:2px 8px;border-radius:6px}
.uid{font-size:12px;color:rgba(255,255,255,.85)}
.ubio{font-size:12px;color:rgba(255,255,255,.8)}
.user-right{display:flex;flex-direction:column;gap:8px}
.ubtn{background:rgba(255,255,255,.25);color:#fff;border:none;border-radius:8px;padding:7px 14px;font-size:12px;white-space:nowrap;backdrop-filter:blur(10px)}
.utags{display:flex;gap:8px;padding:0 16px 14px}
.utag-item{background:rgba(255,255,255,.25);color:#fff;font-size:12px;padding:5px 14px;border-radius:16px}
.ustats{display:flex;gap:10px;padding:0 16px 18px}
.ustat{flex:1;background:rgba(255,255,255,.2);border-radius:12px;padding:14px 8px;text-align:center;color:#fff;backdrop-filter:blur(10px)}
.ustat .t1{font-size:15px;font-weight:700;margin-bottom:4px}
.ustat .t2{font-size:11px;opacity:.85}
.mine-body{background:#f6f7fb;border-radius:20px 20px 0 0;margin-top:-10px;padding-bottom:80px}
.mine-tabs{display:flex;align-items:center;padding:16px 16px 12px;border-bottom:1px solid #f0f0f0;background:#fff}
.mtab{font-size:15px;color:#999;margin-right:24px;padding-bottom:6px;position:relative;cursor:pointer}
.mtab.on{color:#333;font-weight:700}
.mtab.on::after{content:'';position:absolute;left:0;bottom:0;width:24px;height:3px;background:#667eea;border-radius:2px}
.mpub{margin-left:auto;font-size:14px;color:#666;cursor:pointer}

.peer-cat-bg{background:linear-gradient(180deg,#667eea 0%,#764ba2 50%,#f6f7fb 100%)}
.moments-bg{background:linear-gradient(180deg,#667eea,#764ba2 40%,#f6f7fb 100%)}
.float-pub{position:fixed;right:18px;bottom:90px;display:flex;align-items:center;gap:5px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:28px;padding:14px 22px;font-size:15px;font-weight:600;box-shadow:0 6px 20px rgba(102,126,234,.4);z-index:50;text-decoration:none}