/* ============================================================
   用户主页（user.php）
   ============================================================ */

body.pg-user { background: #fff; }

/* 手机版返回栏 */
.us-bar {
  position: sticky; top: 0; z-index: 30; height: 48px;
  display: flex; align-items: center; padding: 0 6px;
  background: #fff; border-bottom: 1px solid #F2F3F5;
}
.us-back {
  width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;
  color: #1A1A1E; font-size: 22px; text-decoration: none;
}
.us-bar-t { flex: 1; text-align: center; font-size: 15px; font-weight: 700; }
.us-bar-r { width: 40px; }

.us-wrap { max-width: 720px; margin: 0 auto; padding: 18px 16px 90px; }

/* 头部 */
.us-head {
  display: flex; align-items: center; gap: 14px;
  padding: 18px 16px; border-radius: 16px;
  background: linear-gradient(135deg, #FFF7F9 0%, #FBFBFD 100%);
  border: 1px solid #F5E7EB;
}
.us-av {
  width: 62px; height: 62px; border-radius: 50%; overflow: hidden; flex: none;
  background: #FDECEF; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 0 0 3px #fff;
}
.us-av img { width: 100%; height: 100%; object-fit: cover; display: block; }
.us-av i { font-style: normal; font-size: 22px; font-weight: 700; color: #C41E3A; }

.us-id { flex: 1; min-width: 0; }
.us-name { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.us-name b { font-size: 19px; font-weight: 700; color: #16181B; letter-spacing: -.3px; }
.us-ok, .us-plan, .us-ban {
  font-style: normal; font-size: 10.5px; font-weight: 600; padding: 2px 7px; border-radius: 5px;
}
.us-ok { background: #F0F8F3; color: #2F7D52; }
.us-plan { background: #FFF4DC; color: #9A6B12; }
.us-ban { background: #FDECEA; color: #C0271F; }
.us-sub { margin-top: 6px; display: flex; gap: 10px; font-size: 12px; color: #8E8E93; flex-wrap: wrap; }

.us-self {
  flex: none; padding: 8px 14px; border-radius: 9px; text-decoration: none;
  background: #fff; color: #5A5F66; font-size: 12.5px; border: 1px solid #EDEEF1;
}
.us-self:hover { border-color: #DADCE0; }

/* 数字 */
.us-stats {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 12px;
}
.us-stat {
  padding: 14px 12px; border-radius: 12px; background: #F7F8FA; text-align: center;
}
.us-stat b {
  display: block; font-size: 20px; font-weight: 700; color: #16181B;
  font-variant-numeric: tabular-nums;
}
.us-stat span { display: block; margin-top: 3px; font-size: 11.5px; color: #8E8E93; }

/* 区块 */
.us-sec { margin-top: 26px; }
.us-sec-h {
  display: flex; align-items: center; gap: 8px;
  font-size: 14px; font-weight: 700; color: #16181B; margin-bottom: 10px;
}
.us-sec-h span {
  font-size: 10.5px; font-weight: 600; color: #C41E3A;
  background: #FFF0F3; padding: 1px 7px; border-radius: 5px;
}

/* 项目列表 */
.us-posts { display: flex; flex-direction: column; gap: 8px; }
.us-post {
  display: block; padding: 13px 14px; border-radius: 12px;
  border: 1px solid #EDEEF1; background: #fff; text-decoration: none;
  transition: border-color .15s, box-shadow .15s;
}
.us-post:hover { border-color: #E0E2E6; box-shadow: 0 6px 18px rgba(17,24,39,.06); }
.us-post-t {
  display: block; font-size: 14.5px; line-height: 1.5; font-weight: 600; color: #16181B;
}
.us-post-m { display: flex; align-items: center; gap: 10px; margin-top: 7px; font-size: 11px; color: #9AA0A6; }
.us-post-m em {
  font-style: normal; padding: 1px 7px; border-radius: 5px;
  background: #FFF0F3; color: #B4233F;
}

/* 观察列表 */
.us-arts { display: flex; flex-direction: column; }
.us-art {
  display: block; padding: 13px 2px; text-decoration: none;
  border-bottom: 1px solid #F5F6F8;
}
.us-art:last-child { border-bottom: 0; }
.us-art b { display: block; font-size: 14.5px; font-weight: 600; color: #16181B; line-height: 1.5; }
.us-art span {
  display: block; margin-top: 5px; font-size: 12.5px; line-height: 1.7; color: #7A7F87;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.us-art em { display: block; margin-top: 6px; font-style: normal; font-size: 11px; color: #B0B4BA; }

.us-empty {
  padding: 22px 12px; border-radius: 12px; background: #F7F8FA;
  text-align: center; font-size: 12.5px; color: #B0B4BA;
}
.us-end { margin-top: 26px; text-align: center; font-size: 11.5px; color: #C0C4CA; }

/* ============================================================
   PC 右栏
   ============================================================ */
body.pane-user { background: #fff; }
body.pane-user .us-wrap { max-width: 800px; padding: 28px clamp(24px, 3vw, 44px) 56px; }

body.pane-user .us-head { padding: 22px 24px; border-radius: 18px; }
body.pane-user .us-av { width: 72px; height: 72px; }
body.pane-user .us-name b { font-size: 22px; }

body.pane-user .us-stats { gap: 12px; margin-top: 14px; }
body.pane-user .us-stat { padding: 18px 14px; }
body.pane-user .us-stat b { font-size: 24px; }

body.pane-user .us-sec { margin-top: 30px; }
body.pane-user .us-post { padding: 15px 18px; }
body.pane-user .us-post-t { font-size: 15px; }

body.pane-user .tabbar { display: none !important; }

/* 头部「对接 TA」按钮 */
.us-cta {
  flex: none; padding: 9px 18px; border-radius: 10px; text-decoration: none;
  background: #C41E3A; color: #fff; font-size: 13px; font-weight: 600;
  box-shadow: 0 6px 14px rgba(196,30,58,.22);
}
.us-cta:hover { background: #A9182F; }

/* 底部推荐位（复用观察页 at-rc 三列） */
.us-rec { margin-top: 30px; padding-top: 20px; border-top: 1px solid #F2F3F5; }
.us-rec .at-sec-h { margin-top: 0; }

/* ===== App 同款名片 ===== */
/* 头部卡片：白底、圆角 20、细边框，不用渐变（App 是白的） */
.us-head{
  display:flex; align-items:center; gap:13px;
  padding:16px; border-radius:20px;
  background:#fff; border:1px solid #EEF0F3;
  box-shadow:0 6px 18px rgba(16,18,22,.04);
}
.us-av{
  width:52px; height:52px; border-radius:50%; overflow:hidden; flex:none;
  background:#FDECEF; display:flex; align-items:center; justify-content:center;
  box-shadow:0 0 0 1.4px #E9EBEF;
  border:2px solid #fff;
}
.us-av img{ width:100%; height:100%; object-fit:cover; display:block; }
.us-av i{ font-style:normal; font-size:20px; font-weight:700; color:#C41E3A; }

.us-name b{ font-size:18px; font-weight:800; letter-spacing:-.3px; color:#16181B; }
.us-ok{ background:#E8F7F0; color:#0E7A46; font-weight:700; }
.us-plan{ background:#FFF0F3; color:#C41E3A; font-weight:700; }
.us-sub{ margin-top:5px; font-size:11.5px; color:#8E8E93; }

/* 数据：一条分隔线下面两格，中间一条竖线，跟 App 一样 */
.us-stats{
  display:grid; grid-template-columns:repeat(2,1fr); gap:0; margin-top:0;
  background:#fff; border:1px solid #EEF0F3; border-top:0;
  border-radius:0 0 20px 20px; padding:11px 8px 15px;
}
.us-stat{
  padding:0; border-radius:0; background:none; text-align:center; position:relative;
}
.us-stat + .us-stat:before{
  content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:1px; height:26px; background:#EEF0F3;
}
.us-stat b{ font-size:19px; font-weight:800; color:#16181B; }
.us-stat span{ margin-top:3px; font-size:11.5px; color:#8E8E93; }

/* 名字卡和数据区视觉上是一张卡：把中间那条缝合上 */
.us-head{ border-radius:20px 20px 0 0; border-bottom:0; }
.us-head + .us-stats{ margin-top:0; }

/* 区块标题：跟 App 的「TA 的项目」一致 */
.us-sec-h{ font-size:15px; font-weight:800; }

/* 窄屏：头像/名字/按钮放不下就换行，别把按钮挤出屏幕 */
.us-head{flex-wrap:wrap}
.us-id{flex:1 1 140px}
.us-cta,.us-self{flex:none}

/* ===== App PostCard ===== */
/* 名片 + 数据合成一张卡（上圆角名片、下圆角数据） */
.us-card{
  background:#fff; border-radius:20px; border:1px solid #EEF0F3;
  box-shadow:0 6px 18px rgba(16,18,22,.04); overflow:hidden;
}
.us-card .us-head{
  display:flex; align-items:center; gap:13px; padding:16px;
  background:none; border:0; border-radius:0; box-shadow:none;
}
.us-card .us-stats{
  display:grid; grid-template-columns:repeat(2,1fr); gap:0;
  margin:0; padding:11px 8px 15px;
  background:none; border:0; border-top:1px solid #F1F2F4; border-radius:0;
}
.us-card .us-stat{ padding:0; background:none; border-radius:0; }
.us-card .us-stat + .us-stat:before{
  content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:1px; height:26px; background:#F1F2F4;
}
.us-card .us-stat b{ font-size:17px; font-weight:800; letter-spacing:-.6px; line-height:1.1; }
.us-card .us-stat span{ margin-top:5px; font-size:9.5px; letter-spacing:.6px; color:#9AA0AA; }

/* 名字行的小标签 */
.us-job{ background:#FFF0F3; color:#C41E3A; }
.us-plan.sm, .us-ok.sm{ font-size:9.5px; padding:1px 5px; border-radius:4px; }
.us-dot{
  width:7px; height:7px; border-radius:50%; background:#E0455F;
  display:inline-block; margin-right:2px;
}

/* 项目卡 */
.us-posts{ display:flex; flex-direction:column; gap:10px; }
.pc{
  display:block; text-decoration:none; background:#fff;
  border-radius:18px; box-shadow:0 2px 10px rgba(16,18,22,.05);
  padding:16px 16px 0;
}
.pc-hd{ display:flex; align-items:flex-start; gap:10px; }
.pc-t{
  flex:1; min-width:0; font-size:18px; font-weight:600; line-height:1.45;
  letter-spacing:-.3px; color:#16181B;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.pc-top{
  flex:none; font-size:11px; font-weight:600; color:#E03A4E;
  background:#FFF0F3; border-radius:7px; padding:3px 9px;
}
.pc-tags{ display:flex; flex-wrap:wrap; gap:7px; margin-top:12px; }
.pc-cat{
  font-size:11.5px; font-weight:600; color:#C41E3A;
  background:#FFF0F3; border-radius:7px; padding:3px 9px;
}
.pc-kw{
  font-size:11.5px; color:#8E8E93;
  background:#F5F6F8; border-radius:7px; padding:3px 9px;
}
.pc-ft{
  display:flex; align-items:center; gap:6px;
  margin-top:14px; padding:12px 0;
  border-top:1px solid #F1F2F4;
}
.pc-av{
  width:26px; height:26px; border-radius:50%; overflow:hidden; flex:none;
  background:#FDECEF; display:flex; align-items:center; justify-content:center;
}
.pc-av img{ width:100%; height:100%; object-fit:cover; display:block; }
.pc-av i{ font-style:normal; font-size:12.5px; font-weight:600; color:#C41E3A; }
.pc-nick{
  font-size:13px; color:#3A3F45; max-width:120px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.pc-sp{ flex:1; }
.pc-eye{ font-size:12px; color:#A0A5AB; font-variant-numeric:tabular-nums; }

/* 底部固定操作条（跟 App 的 bottomNavigationBar 那个按钮一致） */
.us-actbar{
  position:fixed; left:0; right:0; bottom:0; z-index:60;
  background:#fff; border-top:1px solid #EEF0F3;
  padding:10px 14px calc(10px + env(safe-area-inset-bottom, 0px));
}
.us-act{
  display:flex; align-items:center; justify-content:center;
  height:46px; border-radius:13px; text-decoration:none;
  background:#C41E3A; color:#fff; font-size:15px; font-weight:800;
}
.us-wrap{ padding-bottom:96px; }

/* 会员徽章：跟 App 的 TierBadge 一样是小红盾，不是一个圆点 */
.us-badge{ width:14px; height:14px; flex:none; margin-top:1px; }
.us-sub{ display:flex; align-items:center; gap:5px; }