/* ============================================================
   信鸽俱乐部 · 移动端 WebApp 公共样式 v2
   设计语言：清爽蓝白 + 金色点缀 / 大圆角卡片 / 毛玻璃导航 / SVG 图标
   ============================================================ */
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
:root{
  --primary:#3d7bff;
  --primary-dark:#2f63e6;
  --primary-soft:#eaf1ff;
  --primary-grad:linear-gradient(135deg,#5a8dff 0%,#3d6ef0 100%);
  --gold-grad:linear-gradient(135deg,#ffc86b,#ff9d4d);
  --gold:#f59e0b;
  --bg:#f2f4f9;
  --card:#ffffff;
  --text:#171c26;
  --text-2:#5c6470;
  --text-3:#98a0ad;
  --line:#edf0f5;
  --success:#18a058;
  --danger:#e5484d;
  --radius:18px;
  --shadow:0 6px 24px rgba(23,43,99,.07);
  --shadow-sm:0 2px 10px rgba(23,43,99,.05);
}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:hidden}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Helvetica Neue","Microsoft YaHei",sans-serif;
  background:var(--bg);
  background-image:linear-gradient(180deg,#e8efff 0%,rgba(232,239,255,0) 220px);
  background-repeat:no-repeat;
  color:var(--text);
  font-size:15px;
  line-height:1.6;
  padding-bottom:118px;               /* 给悬浮底栏留空间 */
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
  overflow-x:hidden;                  /* 兜底：任何意外元素都不允许撑出横向滚动 */
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
button{font-family:inherit}
::selection{background:rgba(61,123,255,.18)}

/* SVG 图标对齐辅助 */
svg{flex-shrink:0}
.ico-mid svg{vertical-align:-4px}

/* ---------------- 顶部导航条 ---------------- */
.top-bar{
  background:rgba(255,255,255,.86);
  -webkit-backdrop-filter:saturate(1.6) blur(14px);
  backdrop-filter:saturate(1.6) blur(14px);
  padding:10px 14px;
  padding-top:calc(10px + env(safe-area-inset-top));
  display:flex;align-items:center;gap:10px;
  position:sticky;top:0;z-index:20;
  border-bottom:1px solid rgba(23,43,99,.06);
}
.top-bar .back{
  width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:var(--text);background:#fff;
  border:1px solid var(--line);box-shadow:var(--shadow-sm);
  transition:transform .15s;
}
.top-bar .back:active{transform:scale(.9)}
.top-bar h1{font-size:17px;font-weight:600;flex:1;text-align:center;letter-spacing:.5px}
.top-bar .right{width:34px;font-size:14px;color:var(--primary);text-align:right;display:flex;justify-content:flex-end;align-items:center}

/* ---------------- 卡片 ---------------- */
.card{
  background:var(--card);
  border:1px solid rgba(23,43,99,.05);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  margin:12px 14px;overflow:hidden;
}
.card-pad{padding:18px}
.sec-title{
  padding:20px 18px 10px;font-size:16px;font-weight:700;color:var(--text);
  display:flex;align-items:center;justify-content:space-between;letter-spacing:.3px;
}
.sec-title .more{font-size:13px;color:var(--text-3);font-weight:400;display:flex;align-items:center;gap:2px}

/* ---------------- 按钮 ---------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  border:none;border-radius:14px;font-size:15px;font-weight:600;cursor:pointer;
  text-align:center;padding:12px 22px;line-height:1.2;
  transition:transform .15s,box-shadow .2s,opacity .2s;
}
.btn:active{transform:scale(.96)}
.btn-primary{background:var(--primary-grad);color:#fff;box-shadow:0 6px 16px rgba(61,110,240,.32)}
.btn-gold{background:var(--gold-grad);color:#fff;box-shadow:0 6px 16px rgba(255,157,77,.32)}
.btn-block{display:flex;width:100%}
.btn-sm{padding:8px 16px;font-size:13px;border-radius:11px}
.btn-mini{padding:6px 13px;font-size:12.5px;border-radius:10px;font-weight:600}
.btn-outline{background:#fff;color:var(--primary);border:1.5px solid var(--primary)}
.btn-gray{background:#eef1f6;color:var(--text-2)}
.btn-danger{background:#fdecec;color:var(--danger)}
.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}

/* ---------------- 表单 ---------------- */
.form-row{display:flex;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line)}
.form-row:last-child{border-bottom:none}
.form-row label{width:88px;flex-shrink:0;font-size:15px;color:var(--text-2)}
.form-row input,.form-row select,.form-row textarea{
  flex:1;border:none;font-size:15px;outline:none;background:transparent;color:var(--text);font-family:inherit;width:100%}
.input-box{
  width:100%;height:50px;padding:0 15px;
  border:1.5px solid #e7ebf2;border-radius:14px;font-size:15px;
  background:#f6f8fc;font-family:inherit;transition:.2s;
}
.input-box::placeholder{color:#aab2bf}
.input-box:focus{outline:none;border-color:var(--primary);background:#fff;box-shadow:0 0 0 3.5px rgba(61,123,255,.13)}
textarea.input-box{height:auto;padding:13px 15px;line-height:1.6;resize:vertical}

/* ---------------- 提示 ---------------- */
.msg{margin:12px 14px;padding:13px 15px;border-radius:13px;font-size:14px;text-align:center;font-weight:500}
.msg-success{background:#e6f8ee;color:var(--success)}
.msg-error{background:#fdebec;color:var(--danger)}

.empty{text-align:center;padding:60px 24px;color:var(--text-3)}
.empty .ei{
  width:84px;height:84px;margin:0 auto 14px;border-radius:50%;
  background:#fff;display:flex;align-items:center;justify-content:center;
  color:#c4cbd8;box-shadow:var(--shadow-sm);font-size:34px;
}
.empty p{font-size:14px}

/* ---------------- 头像 ---------------- */
.avatar{border-radius:50%;background:#e7ecf6;object-fit:cover;flex-shrink:0}
.avatar-fallback{
  display:flex;align-items:center;justify-content:center;
  background:var(--primary-grad);color:#fff;font-weight:600;
  border-radius:50%;flex-shrink:0;box-shadow:0 4px 10px rgba(61,110,240,.25);
}

/* ---------------- 标签/徽章 ---------------- */
.badge{display:inline-block;padding:2.5px 9px;border-radius:20px;font-size:11px;font-weight:600;line-height:1.6}
.badge-vip{background:var(--gold-grad);color:#fff;box-shadow:0 2px 6px rgba(255,157,77,.35)}
.badge-buy{background:#e8f0ff;color:#3d7bff}
.badge-sell{background:#fdecec;color:var(--danger)}
.badge-top{background:#fff3e0;color:#f08c00}
.badge-gray{background:#eef1f6;color:var(--text-3)}
.badge-green{background:#e6f8ee;color:var(--success)}

.hs-tag{display:inline-block;padding:1.5px 8px;border-radius:10px;font-size:11px;font-weight:500;line-height:1.7}
.hs-normal{background:#e6f8ee;color:var(--success)}
.hs-sick{background:#fdebec;color:var(--danger)}

/* ---------------- 底部导航（悬浮 Dock） ---------------- */
.bottom-nav{
  position:fixed;left:12px;right:12px;
  bottom:calc(10px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:saturate(1.8) blur(18px);
  backdrop-filter:saturate(1.8) blur(18px);
  border:1px solid rgba(23,43,99,.06);
  border-radius:24px;
  display:flex;
  box-shadow:0 10px 32px rgba(23,43,99,.16);
  z-index:100;
  padding:6px 4px;
}
.bottom-nav .nav-item{
  flex:1;text-align:center;padding:7px 0 5px;color:var(--text-3);
  border-radius:18px;transition:color .2s,background .2s;
}
.bottom-nav .nav-item:active{background:#f2f5fb}
.bottom-nav .nav-item.active{color:var(--primary);font-weight:600}
.bottom-nav .nav-icon{display:flex;align-items:center;justify-content:center;height:26px}
.bottom-nav .nav-icon svg{transition:transform .2s}
.bottom-nav .nav-item.active .nav-icon svg{transform:translateY(-1px) scale(1.06)}
.bottom-nav .nav-label{font-size:10.5px;margin-top:2px;letter-spacing:.3px}

/* ---------------- 悬浮发布按钮 ---------------- */
.fab{
  position:fixed;right:18px;bottom:112px;width:56px;height:56px;border-radius:50%;
  background:var(--primary-grad);color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 24px rgba(61,110,240,.42);z-index:90;
  transition:transform .15s;
}
.fab:active{transform:scale(.92)}

/* ---------------- 轮播图 ---------------- */
.swiper{margin:14px;border-radius:18px;overflow:hidden;position:relative;box-shadow:var(--shadow);background:#e7ecf6}
.swiper-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.swiper-track::-webkit-scrollbar{display:none}
.swiper-slide{flex:0 0 100%;scroll-snap-align:center;position:relative}
.swiper-slide img{width:100%;height:170px;object-fit:cover}
.swiper-dots{position:absolute;bottom:10px;left:0;right:0;display:flex;justify-content:center;gap:6px}
.swiper-dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.55);transition:.25s}
.swiper-dots i.on{background:#fff;width:16px;border-radius:3px}

/* ---------------- 图片九宫格 ---------------- */
.img-grid{display:grid;gap:6px;margin-top:10px}
.img-grid.c1{grid-template-columns:1fr;max-width:72%}
.img-grid.c2{grid-template-columns:repeat(2,1fr)}
.img-grid.c3{grid-template-columns:repeat(3,1fr)}
.img-grid img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:10px;background:#f0f2f6}
.img-grid.c1 img{aspect-ratio:auto;max-height:280px;border-radius:12px}

/* ---------------- 功能宫格（首页） ---------------- */
.func-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:4px;
  background:#fff;border:1px solid rgba(23,43,99,.05);
  padding:18px 10px 16px;margin:12px 14px;border-radius:var(--radius);box-shadow:var(--shadow);
}
.func-grid a{display:flex;flex-direction:column;align-items:center;gap:7px;padding:8px 2px;border-radius:14px;transition:.15s}
.func-grid a:active{background:#f2f5fb;transform:scale(.95)}
.func-grid .ti{
  width:46px;height:46px;border-radius:15px;
  display:flex;align-items:center;justify-content:center;color:#fff;
}
.func-grid .tl{font-size:12.5px;color:var(--text-2);font-weight:500}
/* 宫格图标底色 */
.t-blue  {background:linear-gradient(135deg,#6da2ff,#3d6ef0);box-shadow:0 5px 12px rgba(61,110,240,.28)}
.t-orange{background:linear-gradient(135deg,#ffb35c,#ff7d2e);box-shadow:0 5px 12px rgba(255,125,46,.28)}
.t-green {background:linear-gradient(135deg,#4fd182,#22a45d);box-shadow:0 5px 12px rgba(34,164,93,.28)}
.t-purple{background:linear-gradient(135deg,#a78bfa,#7c5cf0);box-shadow:0 5px 12px rgba(124,92,240,.28)}
.t-cyan  {background:linear-gradient(135deg,#4dd0e1,#26a9c4);box-shadow:0 5px 12px rgba(38,169,196,.28)}
.t-gold  {background:var(--gold-grad);box-shadow:0 5px 12px rgba(255,157,77,.3)}
.t-pink  {background:linear-gradient(135deg,#f78fb3,#ef5d92);box-shadow:0 5px 12px rgba(239,93,146,.28)}
.t-slate {background:linear-gradient(135deg,#8fa3c4,#64748b);box-shadow:0 5px 12px rgba(100,116,139,.28)}

/* ---------------- 列表菜单（个人中心） ---------------- */
.menu{
  background:#fff;border:1px solid rgba(23,43,99,.05);
  border-radius:var(--radius);margin:12px 14px;overflow:hidden;box-shadow:var(--shadow);
}
.menu a{display:flex;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid var(--line);color:var(--text);font-size:15px;transition:background .15s}
.menu a:last-child{border-bottom:none}
.menu a:active{background:#f6f8fc}
.menu .mi{
  width:36px;height:36px;border-radius:11px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:var(--primary-soft);color:var(--primary);
}
.menu .arrow{margin-left:auto;color:#c0c7d2;display:flex}
.menu .mtag{margin-left:auto;font-size:12px;color:var(--text-3)}
.menu .mtag.v{color:var(--success)}
.menu .mtag.p{color:var(--gold)}
.menu .mtag.r{color:var(--danger)}
.menu a + a .mtag, .menu a + a .arrow{margin-left:auto}

/* ---------------- 通用行 ---------------- */
.row{display:flex;align-items:center;gap:10px}
.grow{flex:1}
.muted{color:var(--text-3);font-size:13px}
.hide{display:none!important}
