/* =====================================================
   Jiguang JGX 节点系统 - V1.2 极简黑洞视觉
   黑底白字 · 蓝色点缀 · 大空间感 · 钱包数字风
   ===================================================== */
* { -webkit-tap-highlight-color: transparent; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', system-ui, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
  background: #000000;
  color: #FFFFFF;
}

/* ---------- 黑洞背景：径向深邃蓝光晕 ---------- */
.bh-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(900px 600px at 50% -8%, rgba(24,175,255,0.10), transparent 60%),
    radial-gradient(700px 500px at 85% 12%, rgba(37,99,235,0.07), transparent 55%),
    radial-gradient(800px 600px at 10% 90%, rgba(24,175,255,0.05), transparent 60%),
    #000000;
}

/* ---------- 品牌字标 ---------- */
.brand-jgx { color: #18AFFF; }
.brand-glow { text-shadow: 0 0 28px rgba(24,175,255,0.35); }

/* ---------- 卡片 ---------- */
.card-bh {
  background: linear-gradient(160deg, rgba(7,17,31,0.92), rgba(5,8,22,0.92));
  border: 1px solid rgba(24,175,255,0.22);
  border-radius: 18px;
  transition: border-color .3s, box-shadow .3s, transform .3s;
}
.card-bh:hover {
  border-color: rgba(24,175,255,0.45);
  box-shadow: 0 0 40px rgba(24,175,255,0.10);
}

/* 重点卡片（JGX-16000 / 推荐） */
.card-feature {
  background: linear-gradient(160deg, rgba(11,18,32,0.96), rgba(5,8,22,0.96));
  border: 1px solid rgba(24,175,255,0.55);
  border-radius: 18px;
  box-shadow: 0 0 50px rgba(24,175,255,0.14);
}

/* ---------- 数字风（钱包资产） ---------- */
.num {
  font-family: 'Inter', 'DIN', 'Roboto Condensed', system-ui, sans-serif;
  font-feature-settings: 'tnum' 1, 'lnum' 1;
  letter-spacing: -0.01em;
}
.amount-xl { font-size: clamp(38px, 7vw, 64px); font-weight: 800; line-height: 1.02; }
.amount-lg { font-size: clamp(32px, 5vw, 48px); font-weight: 800; line-height: 1.05; }
.amount-md { font-size: clamp(28px, 4vw, 40px); font-weight: 700; }

/* ---------- 按钮 ---------- */
.btn-primary {
  background: #18AFFF;
  color: #fff;
  border-radius: 10px;
  font-weight: 600;
  transition: all .2s;
  box-shadow: 0 0 0 rgba(24,175,255,0);
}
.btn-primary:hover { filter: brightness(1.08); box-shadow: 0 0 24px rgba(24,175,255,0.35); transform: translateY(-1px); }
.btn-primary:disabled { opacity: .4; cursor: not-allowed; transform: none; box-shadow: none; }

.btn-ghost {
  background: transparent;
  color: #38BDF8;
  border: 1px solid rgba(24,175,255,0.45);
  border-radius: 10px;
  font-weight: 600;
  transition: all .2s;
}
.btn-ghost:hover { border-color: #18AFFF; background: rgba(24,175,255,0.06); }

/* ---------- 徽标 / 标签 ---------- */
.chip {
  background: rgba(24,175,255,0.08);
  border: 1px solid rgba(24,175,255,0.30);
  color: #38BDF8;
}
.chip-soft { background: rgba(148,163,184,0.10); border: 1px solid rgba(148,163,184,0.18); color: #94A3B8; }

/* ---------- 图标圆框 ---------- */
.icon-box {
  background: rgba(24,175,255,0.07);
  border: 1px solid rgba(24,175,255,0.25);
  color: #38BDF8;
}

/* ---------- 顶部导航 ---------- */
.nav-bar {
  background: rgba(0,0,0,0.78);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(24,175,255,0.12);
}
.nav-link { color: #94A3B8; transition: color .2s; }
.nav-link:hover { color: #E5E7EB; }
.nav-link.active { color: #18AFFF; }

/* J 形 LOGO */
.logo-j {
  background: #fff;
  color: #000;
  border-radius: 10px;
  box-shadow: 0 0 22px rgba(24,175,255,0.25);
  font-weight: 900;
}

/* ---------- 动效 ---------- */
.fade-in { animation: fadeIn .5s ease both; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.rise { animation: rise .6s cubic-bezier(.22,1,.36,1) both; }
@keyframes rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
.rise-1 { animation-delay: .05s; }
.rise-2 { animation-delay: .12s; }
.rise-3 { animation-delay: .2s; }
.num-pop { animation: numPop .6s cubic-bezier(.22,1,.36,1) both; }
@keyframes numPop { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }

/* 蓝色边框呼吸（重点卡片） */
.breathe { animation: breathe 4s ease-in-out infinite; }
@keyframes breathe {
  0%,100% { box-shadow: 0 0 30px rgba(24,175,255,0.10); }
  50% { box-shadow: 0 0 55px rgba(24,175,255,0.22); }
}

/* QR 容器居中 */
#qrcode img, #qrcode canvas { margin: 0 auto; }

/* 滚动条 */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #000; }
::-webkit-scrollbar-thumb { background: rgba(24,175,255,0.25); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: rgba(24,175,255,0.4); }

/* 选择/输入聚焦 */
input:focus, select:focus { border-color: #18AFFF !important; box-shadow: 0 0 0 1px rgba(24,175,255,0.4); }
select option { background: #07111F; color: #fff; }