:root {
  --p:#c2185b; --p2:#e91e63; --gold:#c9a227;
  --bg:#faf7f8; --card:#ffffff; --t:#2b2024; --sub:#9a8791; --line:#f0e2e8;
  --shadow:0 6px 24px rgba(194,24,91,.08); --shadow-h:0 10px 32px rgba(194,24,91,.16);
}
* { margin:0; padding:0; box-sizing:border-box; font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif; -webkit-tap-highlight-color:transparent; }
body { background:var(--bg); color:var(--t); min-height:100vh; padding-bottom:100px; }
/* 顶栏 */
.navbar { background:linear-gradient(120deg,#8e0e45,#c2185b 55%,#e91e63); color:#fff; padding:14px 18px; display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:9; box-shadow:0 4px 18px rgba(142,14,69,.3); }
.navbar h1 { font-size:17px; font-weight:700; letter-spacing:1px; }
.navbar a { color:#fff; font-size:12px; text-decoration:none; background:rgba(255,255,255,.16); backdrop-filter:blur(4px); padding:6px 14px; border-radius:20px; border:1px solid rgba(255,255,255,.25); }
.nav-l { display:flex; align-items:center; gap:9px; min-width:0; }
.nav-l h1 { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.navbar a.nav-back { width:29px; height:29px; padding:0; display:flex; align-items:center; justify-content:center; font-size:21px; line-height:1; border-radius:50%; flex:0 0 auto; }
.navbar a.nav-back:active { background:rgba(255,255,255,.32); }
/* 后台分区导航 */
.subnav { position:sticky; top:52px; z-index:8; display:flex; gap:8px; overflow-x:auto; padding:10px 4px; margin:0 -4px 10px; background:linear-gradient(180deg,var(--bg) 70%,rgba(250,247,248,0)); scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.subnav::-webkit-scrollbar { display:none; }
.subnav a { flex:0 0 auto; font-size:12px; color:var(--p); background:#fff; border:1px solid var(--line); border-radius:20px; padding:6px 13px; text-decoration:none; box-shadow:0 2px 8px rgba(194,24,91,.06); white-space:nowrap; }
.subnav a:active { background:#fdeef4; }
h2.sec { scroll-margin-top:104px; }
.wrap { max-width:560px; margin:0 auto; padding:16px; }
/* 卡片 */
.card { background:var(--card); border-radius:18px; padding:20px 18px; margin-bottom:14px; box-shadow:var(--shadow); border:1px solid rgba(240,226,232,.6); transition:transform .2s ease, box-shadow .2s ease; animation:rise .35s ease both; }
.card:hover { box-shadow:var(--shadow-h); }
@keyframes rise { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:none} }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.grid3 { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.town { background:var(--card); border-radius:16px; padding:18px 6px; text-align:center; text-decoration:none; color:var(--t); box-shadow:var(--shadow); border:1px solid var(--line); transition:transform .2s, box-shadow .2s; position:relative; overflow:hidden; }
.town:hover { transform:translateY(-3px); box-shadow:var(--shadow-h); }
.town .n { font-size:14px; font-weight:700; letter-spacing:.5px; }
.town .c { font-size:11px; color:var(--sub); margin-top:5px; }
/* 按钮 */
.btn { display:block; width:100%; background:linear-gradient(120deg,#c2185b,#e91e63); color:#fff; border:none; border-radius:28px; padding:14px; font-size:15px; font-weight:600; letter-spacing:1px; cursor:pointer; text-align:center; text-decoration:none; box-shadow:0 6px 18px rgba(194,24,91,.3); transition:transform .15s, box-shadow .15s; }
.btn:hover { box-shadow:0 8px 24px rgba(194,24,91,.4); }
.btn:active { transform:scale(.97); }
.btn.sub { background:#fff; color:var(--p); border:1.5px solid #f3c6d8; box-shadow:none; }
.btn.sm { padding:8px 16px; font-size:12px; width:auto; display:inline-block; border-radius:20px; }
/* 表单 */
label { display:block; font-size:12px; color:var(--sub); margin:14px 0 6px; letter-spacing:.5px; }
input,select,textarea { width:100%; border:1.5px solid var(--line); border-radius:12px; padding:12px 14px; font-size:15px; background:#fdfbfc; color:var(--t); transition:border-color .15s, box-shadow .15s; }
textarea { min-height:84px; resize:vertical; }
input:focus,select:focus,textarea:focus { outline:none; border-color:var(--p2); box-shadow:0 0 0 3px rgba(233,30,99,.1); }
/* 会员卡 */
.mcard { display:flex; gap:13px; align-items:center; background:var(--card); border-radius:16px; padding:14px; margin-bottom:10px; box-shadow:var(--shadow); border:1px solid var(--line); text-decoration:none; color:var(--t); transition:transform .2s, box-shadow .2s; }
.mcard:hover { transform:translateY(-2px); box-shadow:var(--shadow-h); }
.avatar { width:60px; height:60px; border-radius:14px; object-fit:cover; flex-shrink:0; background:linear-gradient(135deg,#fbe4ee,#f6d0e0); display:flex; align-items:center; justify-content:center; font-size:26px; }
.info { flex:1; min-width:0; }
.info .nm { font-weight:700; font-size:15px; }
.info .meta { font-size:12px; color:var(--sub); margin-top:3px; }
.blur { filter:blur(6px); user-select:none; }
.locked { text-align:center; padding:28px 18px; }
.locked p { color:var(--sub); font-size:13px; margin:10px 0 18px; line-height:1.9; }
.score { background:linear-gradient(120deg,#c2185b,#e91e63); color:#fff; border-radius:20px; padding:3px 11px; font-size:12px; font-weight:700; }
.tag { display:inline-block; background:#fceef4; color:var(--p); font-size:10.5px; border-radius:12px; padding:3px 9px; margin:3px 4px 0 0; font-weight:500; }
/* 标签页 */
.tabs { display:flex; gap:8px; margin-bottom:14px; background:#fff; padding:5px; border-radius:16px; box-shadow:var(--shadow); }
.tabs button { flex:1; border:none; background:transparent; color:var(--sub); border-radius:12px; padding:10px 4px; font-size:13px; cursor:pointer; font-weight:600; transition:all .2s; }
.tabs button.on { background:linear-gradient(120deg,#c2185b,#e91e63); color:#fff; box-shadow:0 4px 12px rgba(194,24,91,.3); }
/* 提示 */
.msg { padding:12px 16px; border-radius:12px; font-size:14px; margin-bottom:12px; display:none; }
.msg.ok { display:block; background:#e8f8ef; color:#0a8f4d; border:1px solid #c8ecd8; }
.msg.err { display:block; background:#fdecec; color:#c0392b; border:1px solid #f5cfcf; }
.toast { position:fixed; bottom:96px; left:50%; transform:translateX(-50%); background:rgba(43,32,36,.9); color:#fff; padding:11px 22px; border-radius:24px; font-size:13px; z-index:99; display:none; backdrop-filter:blur(6px); }
/* 底栏（高端化：毛玻璃 + 渐变激活点） */
.tabbar { position:fixed; bottom:0; left:0; right:0; background:rgba(255,255,255,.88); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-top:1px solid rgba(240,226,232,.8); display:flex; z-index:10; padding:4px 0 max(6px, env(safe-area-inset-bottom)); }
.tabbar a { flex:1; text-align:center; padding:6px 0 4px; font-size:10.5px; color:#b3a0aa; text-decoration:none; position:relative; transition:color .2s; }
.tabbar a span { display:block; font-size:21px; margin-bottom:2px; filter:grayscale(1); opacity:.65; transition:all .2s; }
.tabbar a.on { color:var(--p); font-weight:700; }
.tabbar a.on span { filter:none; opacity:1; transform:translateY(-1px) scale(1.12); }
.tabbar a.on::before { content:''; position:absolute; top:0; left:50%; transform:translateX(-50%); width:22px; height:3px; border-radius:3px; background:linear-gradient(90deg,#c2185b,#e91e63); }
h2.sec { font-size:15px; margin:20px 0 12px; letter-spacing:1px; color:#5c4750; }
.field { font-size:14px; line-height:2; }
.field b { color:var(--sub); font-weight:400; margin-right:4px; }
.price { text-align:center; }
.price .amount { font-size:46px; font-weight:800; color:var(--p); letter-spacing:-1px; }
.price .amount small { font-size:16px; }
.qr { width:180px; height:180px; margin:16px auto; background:linear-gradient(135deg,#fbe4ee,#f6d0e0); border-radius:18px; display:flex; align-items:center; justify-content:center; color:var(--sub); font-size:13px; text-align:center; }
table { width:100%; border-collapse:collapse; font-size:12px; }
th,td { border-bottom:1px solid var(--line); padding:9px 5px; text-align:left; }
th { color:var(--sub); font-weight:500; }
a { color:var(--p); }
/* 悬浮客服按钮 */
a[href="/chat.html"] { transition:transform .2s; }
a[href="/chat.html"]:hover { transform:scale(1.08); }
/* 悬浮窗（找对象 / 在线客服）：可拖动 */
.fbtn { position:fixed; right:14px; z-index:11; width:52px; height:52px; border-radius:50%; color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:9px; font-weight:700; text-decoration:none; box-shadow:0 4px 14px rgba(0,0,0,.18); touch-action:none; user-select:none; -webkit-user-select:none; will-change:transform; transition:box-shadow .2s, transform .2s; }
.fbtn-gold { background:linear-gradient(135deg,#c9a227,#e0b83d); box-shadow:0 4px 14px rgba(201,162,39,.45); }
.fbtn-pink { background:linear-gradient(135deg,#c2185b,#e91e63); font-size:24px; box-shadow:0 4px 14px rgba(194,24,91,.45); }
.fbtn-pink span { font-size:24px; }
.fbtn.fb-drag { transform:scale(1.12); box-shadow:0 10px 28px rgba(0,0,0,.3); opacity:.94; cursor:grabbing; transition:none; }
.fbtn:active { transform:scale(.94); }

/* ---- 微信端加固 ---- */
html { -webkit-text-size-adjust: 100%; }
body { -webkit-font-smoothing: antialiased; -webkit-overflow-scrolling: touch; overscroll-behavior-y: contain; }
input, select, textarea { font-size: 16px !important; } /* 防 iOS 聚焦缩放 */
.btn, .town, .mcard, .tabbar a { min-height: 44px; }
.btn { scroll-margin-bottom: 84px; }
.tabbar { padding-bottom: max(8px, env(safe-area-inset-bottom)); }
.wrap { padding-bottom: max(20px, env(safe-area-inset-bottom)); }
/* 小屏保持三列一行（会员/审核/红娘统计） */

/* ---- 轮播图 ---- */
.swiper { position:relative; border-radius:20px; overflow:hidden; box-shadow:0 12px 32px rgba(142,14,69,.22); margin-bottom:14px; }
.slides { display:flex; width:100%; transition:transform .45s cubic-bezier(.22,.61,.36,1); }
.slide { flex:0 0 100%; position:relative; min-height:186px; padding:22px 20px; color:#fff; overflow:hidden; display:flex; align-items:center; }
.s1 { background:linear-gradient(125deg,#8e0e45,#c2185b 55%,#e91e63); }
.s2 { background:linear-gradient(125deg,#7b0f4a,#b0185c 50%,#d94f8a); }
.s3 { background:linear-gradient(125deg,#8a1546,#c2185b 45%,#f06292); }
.s4 { background:linear-gradient(125deg,#6d0a35,#a3123f 40%,#e0336e 80%,#ff6b9d); }
.slide-pills { display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; max-width:100%; }
.slide-pills span { font-size:11px; background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.32); padding:3px 10px; border-radius:14px; white-space:nowrap; }
.slide::before, .slide::after { content:''; position:absolute; border-radius:50%; background:rgba(255,255,255,.09); }
.slide::before { width:190px; height:190px; right:-60px; top:-70px; }
.slide::after { width:120px; height:120px; right:60px; bottom:-60px; background:rgba(255,255,255,.06); }
.slide-inner { position:relative; z-index:2; max-width:78%; }
.slide-tag { display:inline-block; font-size:11px; letter-spacing:1px; background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.3); padding:4px 10px; border-radius:20px; margin-bottom:10px; }
.slide h2 { font-size:21px; line-height:1.45; letter-spacing:1px; font-weight:800; }
.slide p { font-size:12.5px; opacity:.9; margin-top:8px; }
.slide-btn { display:inline-block; margin-top:14px; background:#fff; color:var(--p); font-size:13px; font-weight:700; padding:9px 20px; border-radius:22px; text-decoration:none; box-shadow:0 4px 12px rgba(0,0,0,.12); }
.deco { position:absolute; font-size:64px; opacity:.9; z-index:1; }
.d1 { right:18px; top:26px; transform:rotate(-12deg); }
.d2 { right:70px; bottom:10px; font-size:44px; transform:rotate(10deg); opacity:.75; }
.dots { position:absolute; bottom:12px; left:20px; display:flex; gap:6px; z-index:3; }
.dots i { width:6px; height:6px; border-radius:6px; background:rgba(255,255,255,.45); display:block; transition:all .25s; cursor:pointer; }
.dots i.on { width:18px; background:#fff; }

/* ---- 女会员展示卡（左照片 右资料） ---- */
.mcard-photo { width:96px; height:110px; border-radius:14px; flex-shrink:0; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.mcard-photo span { font-size:42px; filter:drop-shadow(0 2px 4px rgba(0,0,0,.08)); }
.mcard-photo em { position:absolute; left:6px; bottom:6px; font-style:normal; font-size:9px; background:rgba(255,255,255,.82); color:var(--p); padding:2px 6px; border-radius:8px; }
.mcard .info .nm .age { font-size:11px; color:var(--p); background:#fceef4; padding:2px 8px; border-radius:10px; margin-left:4px; font-weight:500; }
.mcard .info .quote { color:#b39aa5; font-style:italic; overflow:hidden; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }

/* ---- PC / 平板 自适应 ---- */
@media (min-width: 768px) {
  body { padding-bottom: 90px; }
  .wrap { max-width: 1080px; padding: 22px 24px; }
  .navbar { padding: 16px 28px; }
  .navbar h1 { font-size: 20px; }
  .grid3 { grid-template-columns: repeat(4, 1fr); gap: 14px; }
  .slide { min-height: 300px; padding: 34px 40px; }
  .slide h2 { font-size: 34px; }
  .slide p { font-size: 15px; }
  .slide-btn { padding: 12px 26px; font-size: 14px; }
  .deco { font-size: 96px; }
  .d1 { right: 60px; top: 60px; }
  .d2 { right: 160px; bottom: 30px; font-size: 64px; }
  .mcard-photo { width: 120px; height: 132px; }
  .mcard { padding: 16px; }
  .mcard .info .nm { font-size: 17px; }
  .card { padding: 24px 22px; }
  .tabbar { max-width: 560px; margin: 0 auto; border-radius: 22px 22px 0 0; box-shadow: 0 -4px 20px rgba(0,0,0,.06); }
  #showcase { display:grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items:start; }
  #showcase > .btn { grid-column: 1 / -1; }
}
@media (min-width: 1200px) {
  .wrap { max-width: 1180px; }
  .grid3 { grid-template-columns: repeat(6, 1fr); }
  #showcase { grid-template-columns: 1fr 1fr 1fr; }
}

/* ---- 横向滑动卡片（会员推荐 / 红娘团队） ---- */
.hscroll {
  display: flex !important;
  grid-template-columns: none !important;
  gap: 12px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding: 2px 2px 10px;
  scrollbar-width: none;
}
.hscroll::-webkit-scrollbar { display: none; }
.hscroll > .mcard { flex: 0 0 82%; scroll-snap-align: start; margin: 0; }
@media (min-width: 768px) {
  .hscroll > .mcard { flex: 0 0 calc((100% - 24px) / 3); }
}
/* 红娘团队卡 */
.hk-card { flex: 0 0 62%; scroll-snap-align: start; display: flex; gap: 10px; align-items: center; background: linear-gradient(135deg, #fff5f9, #fde8f1); border: 1px solid #f4c9da; border-radius: 14px; padding: 10px 12px; }
.hk-av { width: 40px; height: 40px; border-radius: 50%; background: linear-gradient(135deg, #c2185b, #e91e63); display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; }
.hk-info { min-width: 0; }
.hk-name { font-size: 13.5px; font-weight: 700; color: var(--t); }
.hk-tag { font-size: 11px; color: var(--p); margin-top: 1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hk-meta { font-size: 10.5px; color: var(--sub); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (min-width: 768px) { .hk-card { flex: 0 0 calc((100% - 36px) / 4); } }
/* 成功案例纵向滚动 */
.vscroll { max-height: 118px; overflow-y: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
.vscroll::-webkit-scrollbar { display: none; }
.story { font-size: 12.5px; line-height: 1.6; padding: 7px 0; border-bottom: 1px dashed var(--line); }
.story:last-child { border-bottom: none; }
.story-t { color: var(--p); }
.story-s { display: block; color: var(--sub); font-size: 11px; margin-top: 1px; }

/* ---- AI 头像与骨架屏 ---- */
.mcard-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.mcard-photo { box-shadow:inset 0 0 0 1px rgba(255,255,255,.5); }
.mcard-photo::after { content:''; position:absolute; inset:0; border-radius:14px; box-shadow:inset 0 -30px 30px -20px rgba(142,14,69,.28); pointer-events:none; }
.skeleton { background:linear-gradient(90deg,#f4eef1 25%,#faf7f8 37%,#f4eef1 63%); background-size:400% 100%; animation:shimmer 1.3s ease infinite; border-radius:12px; }
@keyframes shimmer { 0%{background-position:100% 0} 100%{background-position:0 0} }
.sk-card { display:flex; gap:13px; background:#fff; border-radius:16px; padding:14px; margin-bottom:10px; box-shadow:var(--shadow); }
.sk-photo { width:96px; height:110px; border-radius:14px; flex-shrink:0; }
.sk-line { height:12px; margin-bottom:9px; }
/* 详情页相册 */
.gallery { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.gallery img { width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:12px; }
@media (min-width:768px){ .gallery { grid-template-columns:repeat(3,1fr); } }

/* ---- 首页统计行：始终三列一行 ---- */
.stats-row { display:grid; grid-template-columns:repeat(3,1fr) !important; gap:8px; margin-bottom:14px; }
.stats-row .stat { background:#fff; border-radius:14px; padding:14px 4px; text-align:center; box-shadow:var(--shadow); border:1px solid var(--line); }
.stats-row .stat .n { font-size:19px; font-weight:800; color:var(--p); letter-spacing:-0.5px; }
.stats-row .stat .c { font-size:10.5px; color:var(--sub); margin-top:3px; }
/* 实时运营数据条：牵线成功 / 本月新增 */
.live-row { display:flex; align-items:center; justify-content:space-around; padding:12px 10px; margin-bottom:14px; font-size:12.5px; color:var(--sub); }
.live-row b { color:var(--p); font-size:16px; font-weight:800; margin:0 2px; }
.live-row i { width:1px; height:18px; background:var(--line); }

/* ---- 刘海屏 / 安全面适配 ---- */
.navbar { padding-top: max(14px, env(safe-area-inset-top)); }
body { padding-top: env(safe-area-inset-top); }

/* ---- 桌面交互增强（悬停反馈 / 键盘焦点） ---- */
.btn:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, .tabs button:focus-visible { outline: 2.5px solid var(--p2); outline-offset: 2px; }
.mcard, .town { will-change: transform; }
/* 桌面后台表格可读性 */
@media (min-width: 768px) {
  table { font-size: 13px; }
  th, td { padding: 10px 8px; }
  .toast { font-size: 14px; }
}
/* 平板中屏：区县 3 列保持、卡片内边距加大 */
@media (min-width: 600px) and (max-width: 767px) {
  .wrap { max-width: 720px; padding: 20px 22px; }
  .grid3 { grid-template-columns: repeat(4, 1fr); }
}

/* ---- 小屏手机（≤360px）紧凑布局 ---- */
@media (max-width: 360px) {
  .wrap { padding: 12px 12px; }
  .card { padding: 16px 13px; border-radius: 15px; }
  .navbar { padding-left: 12px; padding-right: 12px; }
  .navbar h1 { font-size: 15px; }
  .navbar a { font-size: 11px; padding: 5px 10px; }
  .slide { min-height: 160px; padding: 16px 14px; }
  .slide h2 { font-size: 17px; }
  .slide p { font-size: 11.5px; }
  .mcard { padding: 11px; gap: 10px; }
  .mcard-photo { width: 78px; height: 92px; }
  .mcard-photo span { font-size: 34px; }
  .info .nm { font-size: 14px; }
  .price .amount { font-size: 38px; }
  .tabs button { font-size: 12px; padding: 9px 2px; }
  .btn { padding: 12px; font-size: 14px; }
  .stats-row .stat .n { font-size: 16px; }
  .fbtn { width: 46px; height: 46px; }
}

/* ---- 大屏（≥1440px）内容收拢、区县 8 列 ---- */
@media (min-width: 1440px) {
  .wrap { max-width: 1280px; }
  .grid3 { grid-template-columns: repeat(8, 1fr); gap: 12px; }
}

/* ---- 横屏矮屏（手机横放） ---- */
@media (max-height: 480px) and (orientation: landscape) {
  body { padding-bottom: 72px; }
  .slide { min-height: 200px; }
  .tabbar a { padding: 3px 0 2px; }
  .tabbar a span { font-size: 17px; }
  .toast { bottom: 60px; }
}

/* ---- 尊重系统"减弱动态效果" ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .card { animation: none; }
  html { scroll-behavior: auto; }
}
html { scroll-behavior: smooth; }

/* 后台会员表操作列：按钮一行展示 */
#mt td[data-l="操作"] { white-space:nowrap; }
#mt td[data-l="操作"] .btn.sm { padding:5px 9px; font-size:11px; border-radius:14px; margin:1px; }

/* 固定底部标签栏遮挡：滚动定位时给输入/按钮留出安全距离 */
input, button, select, textarea, a.btn { scroll-margin-bottom: 96px; }
/* 合伙人统计：区间按钮选中态 */
.btn.ref-range.on { background:linear-gradient(120deg,#c2185b,#e91e63); color:#fff; border-color:transparent; box-shadow:0 4px 12px rgba(194,24,91,.28); }
