/* 同盟成员端 · 共享样式
 * 设计：蓝色品牌主调 + 卡片化 + 悬浮微动效 + 响应式，与门户视觉语言一致。
 * 配合 Tailwind CDN 使用，这里只放 Tailwind 不便表达的自定义部分。 */
:root {
  --blu: #0052D9;
  --blu2: #006EFF;
  --blu3: #2563EB;
  --t1: #1D2129;
  --t2: #4E5969;
  --t3: #86909C;
  --line: #E5E6EB;
  --bg: #F2F3F8;
  --ok: #00B42A;
  --warn: #FF7D00;
  --red: #F53F3F;
}

body { font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif; }

/* 进入淡入上浮 */
@keyframes fadeUp { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.fade-up { animation: fadeUp .5s cubic-bezier(.16,1,.3,1) both; }
.fade-up.d1 { animation-delay: .06s; }
.fade-up.d2 { animation-delay: .12s; }
.fade-up.d3 { animation-delay: .18s; }
.fade-up.d4 { animation-delay: .24s; }

/* 卡片悬浮微动效 */
.card-lift { transition: transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s ease, border-color .3s ease; }
.card-lift:hover { transform: translateY(-4px); box-shadow: 0 16px 44px -14px rgba(0,82,217,.22); border-color: #bfdbfe; }

/* 品牌渐变背景 */
.hero-grad { background: linear-gradient(135deg, #0052D9 0%, #006EFF 55%, #2f8bff 100%); }
.soft-grad { background: linear-gradient(135deg, #e8f1ff 0%, #f5f8ff 60%, #f2f3f8 100%); }

/* 等级环（conic-gradient 进度环） */
.level-ring {
  --pct: 0;
  width: 116px; height: 116px; border-radius: 50%;
  background: conic-gradient(var(--blu2) calc(var(--pct) * 1%), #e6efff 0);
  display: grid; place-items: center; position: relative;
}
.level-ring::before { content: ""; position: absolute; inset: 9px; background: #fff; border-radius: 50%; }
.level-ring > div { position: relative; z-index: 1; text-align: center; }

/* 成长流水时间线 */
.tl { position: relative; padding-left: 26px; }
.tl::before { content: ""; position: absolute; left: 8px; top: 4px; bottom: 4px; width: 2px; background: linear-gradient(#cfe0ff, #eef4ff); }
.tl-item { position: relative; padding: 0 0 18px 0; }
.tl-item::before {
  content: ""; position: absolute; left: -22px; top: 5px; width: 11px; height: 11px;
  border-radius: 50%; background: var(--blu2); box-shadow: 0 0 0 3px #e6efff;
}
.tl-item.offline::before { background: var(--warn); box-shadow: 0 0 0 3px #fff1e0; }

/* 等级徽章 */
.lv-badge { background: linear-gradient(135deg, #0052D9, #006EFF); color: #fff; }

/* 数据表 */
.mtable { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.mtable th { text-align: left; color: var(--t3); font-weight: 500; padding: 9px 12px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.mtable td { padding: 11px 12px; border-bottom: 1px solid #f2f3f5; color: var(--t1); }
.mtable tr:hover td { background: #f7faff; }

/* 滚动条美化 */
.scroll-y { max-height: 460px; overflow-y: auto; }
.scroll-y::-webkit-scrollbar { width: 8px; }
.scroll-y::-webkit-scrollbar-thumb { background: #d6dbe4; border-radius: 8px; }

/* 标签 chip */
.chip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 500; }
.chip-blue { background: #e8f1ff; color: var(--blu); }
.chip-green { background: #e7f8eb; color: var(--ok); }
.chip-orange { background: #fff2e6; color: var(--warn); }
.chip-gray { background: #f2f3f5; color: var(--t2); }

/* 空状态 */
.empty { text-align: center; color: var(--t3); padding: 40px 12px; font-size: 13.5px; }