/* ===== Linkde 细节增强：加厚视觉层次，贴近主流交友 App ===== */

/* 1. 卡片内容排版优化：紧凑 */
.card { display:flex; flex-direction:column; }
.card-bar { width:4px; border-radius:4px; flex-shrink:0; margin:-14px 0; }
.card-main { flex:1; min-width:0; padding-left:13px; }
.c-ico { width:32px; height:32px; border-radius:10px; display:flex; align-items:center; justify-content:center; flex-shrink:0; color:#fff; }
.c-ico .ico { width:18px; height:18px; }
.l-head { display:flex; align-items:center; gap:9px; }
.l-head .c-ico { width:30px; height:30px; }
.l-head .ava { width:34px; height:34px; font-size:14px; }
.l-name { display:flex; flex-direction:column; min-width:0; flex:1; }
.l-name b { font-size:14.5px; font-weight:800; line-height:1.2; }
.l-name .l-sub { font-size:11px; color:var(--c-text-3); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }


/* 2. 头像更立体：加描边与内阴影，强化层次 */
.ava { box-shadow:0 2px 6px rgba(31,35,48,.12); border:1.5px solid #fff; }
.c-ava { box-shadow:0 2px 6px rgba(31,35,48,.12); border:1.5px solid #fff; }
.m-ava { box-shadow:0 2px 6px rgba(31,35,48,.12); border:1.5px solid #fff; }

/* 3. 顶部栏图标按钮：更精致，去灰、加渐变描边感 */
.icon-btn {
  background:#f2f3f6; color:var(--c-text); box-shadow:inset 0 0 0 1px rgba(255,255,255,.6);
}
.icon-btn:active { transform:scale(.92); background:#e8eaee; }

/* 4. chips 滑动指示器感：加滚动阴影与更圆润 */
.chips { gap:9px; padding:13px 14px; scrollbar-width:none; }
.chips::-webkit-scrollbar { display:none; }
.chip { box-shadow:var(--sh-1); border-width:1.5px; }
.chip.active { box-shadow:var(--sh-3); }

/* 5. 我的页封面：加装饰光斑层次 + 顶部安全渐变 */
.me-cover { overflow:hidden; }
.me-cover::before {
  content:''; position:absolute; width:220px; height:220px; right:-60px; top:-90px; border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.35),transparent 70%); pointer-events:none;
}
.me-cover::after { height:28px; border-radius:28px 28px 0 0; }
.me-cover .profile { padding:64px 18px 6px; }
.me-edit { box-shadow:0 4px 12px rgba(0,0,0,.18); }

/* 统计卡片强化：数字加色彩、卡片内间距与分隔 */
.stats { border:1px solid var(--c-line); }
.stats div { position:relative; }
.stats div + div::before { content:''; position:absolute; left:0; top:22%; bottom:22%; width:1px; background:var(--c-line); }
.stats b { font-size:20px; background:var(--c-gradient); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.stats span { margin-top:3px; }

/* verify-banner 加图标底色块，更醒目 */
.verify-banner .ico { background:rgba(255,106,94,.15); border-radius:10px; padding:6px; width:30px; height:30px; }

/* 6. 菜单项加细微分隔与 hover 色 */
.menu-item .ico { width:24px; height:24px; background:var(--c-gradient-soft); border-radius:10px; padding:5px; }

/* 7. 消息 / 对话列表加厚 */
.conv { border:1px solid var(--c-line); }
.conv-item .c-top b { font-weight:800; }
.conv-item.official { background:linear-gradient(135deg,#fff8f6,#fff); }
.c-last { margin-top:3px; }
.unread { box-shadow:0 3px 8px rgba(255,106,94,.35); }

/* 8. 会员页 / 评价增强 */
.plus-hero { position:relative; overflow:hidden; margin:0 14px; border-radius:var(--r-lg); box-shadow:var(--sh-2); }
.plus-hero::before {
  content:''; position:absolute; width:200px; height:200px; left:-50px; bottom:-80px; border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.4),transparent 70%);
}
.plus-crown .ico { width:40px; height:40px; color:var(--c-primary); filter:drop-shadow(0 4px 8px rgba(255,106,94,.3)); }
.pb .ico { width:26px; height:26px; background:var(--c-gradient-soft); border-radius:50%; padding:5px; flex-shrink:0; }

/* 9. 空白状态更友好 */
.empty { padding:56px 24px; }
.empty::before { content:'🌟'; display:block; font-size:40px; margin-bottom:12px; opacity:.7; }

/* 10. 气泡弹层：头部加圆形头像框，正文加软底色卡片 */
.b-head .ava { width:46px; height:46px; box-shadow:0 3px 10px rgba(255,106,94,.25); border:2px solid #fff; }
.b-text { background:#fafbfc; border-radius:14px; padding:12px 14px; border:1px solid var(--c-line); }
.sheet-actions .btn-primary { box-shadow:var(--sh-3); }

/* 11. 输入框聚焦微动效 */
.f-input:focus, .msg-input:focus { box-shadow:0 0 0 3px rgba(255,106,94,.12); }

/* 12. 商家页配图横幅 */
.merchant-hero {
  height:150px; margin:0 0 4px; border-radius:0 0 var(--r-lg) var(--r-lg);
  background:linear-gradient(135deg,#ff9a7a,#ff6a5e); display:flex; align-items:flex-end; padding:14px;
  position:relative; overflow:hidden; box-shadow:var(--sh-2);
}
.merchant-hero::after { content:''; position:absolute; right:-30px; top:-40px; width:160px; height:160px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.3),transparent 70%); }
.merchant-hero .mh-title { color:#fff; font-size:20px; font-weight:800; position:relative; z-index:1; text-shadow:0 1px 4px rgba(0,0,0,.15); }
.merchant-hero .mh-emoji { position:absolute; right:16px; bottom:10px; font-size:54px; opacity:.9; z-index:1; }

/* 13. 相册占位更有质感 */
.ph { box-shadow:inset 0 0 0 1px rgba(0,0,0,.03); font-weight:300; }
.ph:hover { background:#eef0f3; }
