/* ============================================================
   打手端 · 黑金电竞主题（Black & Gold Esports）
   - 真实电竞馆图片背景（后台「端样式设置」可上传覆盖）
   - 主色金色 #3B9EFF，文字深棕黑，全站无蓝色系
   - 由 sub/common.php 自动注入到所有 /booster/ 页面
   ============================================================ */

:root{
  --gold:#3B9EFF;
  --gold-deep:#1E7BE0;
  --gold-soft:#FBF5E6;
  --gold-line:rgba(212,175,55,.24);
  --ink:#22304d;
  --muted:#8a93a6;
}

html,body{
  background:linear-gradient(180deg,rgba(20,17,10,.88) 0%,rgba(32,26,14,.82) 30%,rgba(244,240,230,.96) 62%,#FFFFFF 100%) fixed !important;
  background-attachment:fixed !important;
  color:var(--ink) !important;
  max-width:480px;
  margin:0 auto;
}
body{padding-bottom:76px}
a{color:inherit}
img{max-width:100%}

/* 顶部 / 底部导航 / 各类页头：白金毛玻璃 */
/* 底部菜单栏：背景色由后台「端样式设置」控制 */
.top-bar,.tabbar,.nav-bar{
  background:var(--tabbar-bg,#FFFFFF) !important;
  color:var(--ink) !important;
  border-color:rgba(212,175,55,.22) !important;
  box-shadow:0 -4px 20px rgba(120,90,20,.10) !important;
}
/* 各类页头：暗金到白 */
.b-header,.w-header,.vip-header,.invite-header,.deposit-header,.h-top{
  background:linear-gradient(180deg,#2A2210 0%,#FFFFFF 130%) !important;
  color:var(--ink) !important;
  border-color:rgba(212,175,55,.22) !important;
  box-shadow:0 6px 20px rgba(120,90,20,.10) !important;
}
.top-bar a,.tabbar a,.nav-bar a{color:var(--tabbar-text,var(--muted)) !important}
.tabbar a.active,.nav-bar a.active{color:var(--tabbar-active,var(--gold-deep)) !important;font-weight:700}

/* 卡片 / 列表项 / 面板：纯白金边柔和阴影 */
.card,.stat-card,.menu-item,.list-item,.pay-item,.pay-opt,.stat-box,.code-box,
.vip-card,.sub-item,.order-item,.panel,.box,.order-card{
  background:#fff !important;
  border:1px solid rgba(212,175,55,.18) !important;
  box-shadow:0 6px 22px rgba(120,90,20,.08) !important;
  color:var(--ink) !important;
  border-radius:16px !important;
}
.menu-item:active,.stat-card:active,.list-item:active,.order-card:active{background:#FBF5E6 !important}

/* 文本层级 */
.card h3,.stat-card .num,.order-item .name,.vip-card .name,.sub-item .name,
.list-item .text,.card h4,.panel h3,.order-card .name,.b-header .name{
  color:var(--ink) !important;
}
.card h3 .more,.stat-card .lbl,.order-item .sub,.tabs a,.text-muted,.muted,.sub,.desc,
.order-card .meta,.b-header .meta{color:var(--muted) !important}
.tabs a.active{color:var(--gold-deep) !important;border-color:var(--gold-deep) !important}

/* 图标色块：浅金 */
.menu-item .ico,.ico,.list-item .ico,.menu-item img.icon,.list-item img.icon{
  background:linear-gradient(135deg,#FBF5E6,#F3E6C4) !important;
  color:var(--gold-deep) !important;
}

/* 按钮：确认/主操作统一金色 */
.btn,.btn-pay,.btn-confirm,.btn-online,.btn-copy,.btn-vip,.btn-primary,.btn-block,
.btn-grab,.submit-btn,.pay-btn{
  background:linear-gradient(135deg,#5AB0FF 0%,#3B9EFF 55%,#1E7BE0 100%) !important;
  color:#fff !important;
  border:none !important;
  box-shadow:0 6px 18px rgba(59,158,255,.38) !important;
  border-radius:20px !important;
  transition:transform .22s ease,box-shadow .28s ease !important;
}
.btn:active,.btn-primary:active,.btn-grab:active,.btn-confirm:active{transform:scale(.96)}
.btn:hover,.btn-primary:hover,.btn-grab:hover,.btn-confirm:hover{box-shadow:0 8px 24px rgba(59,158,255,.5) !important}
.btn-balance,.btn-deposit,.btn-default,.btn-line{
  background:#fff !important;
  color:var(--gold-deep) !important;
  border:1px solid rgba(212,175,55,.45) !important;
  box-shadow:0 4px 14px rgba(59,158,255,.14) !important;
}

/* 表单控件 */
input,textarea,select{
  background:#F0F6FF !important;
  color:var(--ink) !important;
  border:1px solid rgba(212,175,55,.28) !important;
  border-radius:12px !important;
}
input::placeholder,textarea::placeholder{color:#b3a37e !important}
input:focus,textarea:focus,select:focus{border-color:rgba(185,134,46,.65) !important;background:#fff !important}

/* 分割线 / 边框 */
.card,.order-item,.list-item{border-color:rgba(212,175,55,.16) !important}

/* 数字 / 金额：金色强调 */
.price,.amount,.money{color:var(--gold-deep) !important}
.text-danger{color:#C0392B !important}

/* 状态标签 */
.status-tag,.tag,.badge{background:rgba(212,175,55,.14) !important;color:#1E7BE0 !important;border-color:rgba(212,175,55,.30) !important}

/* 呼吸光 */
@keyframes softBreath{0%,100%{box-shadow:0 6px 18px rgba(59,158,255,.24)}50%{box-shadow:0 8px 26px rgba(59,158,255,.42)}}
.btn-primary{animation:softBreath 3.6s ease-in-out infinite}

/* ================= 光标滑动特效（金色柔光 + 拖尾） ================= */
#goldCursor{
  position:fixed;top:0;left:0;width:26px;height:26px;margin:-13px 0 0 -13px;
  border-radius:50%;pointer-events:none;z-index:99999;
  background:radial-gradient(circle,rgba(59,158,255,.85),rgba(59,158,255,.16) 58%,transparent 72%);
  box-shadow:0 0 18px rgba(59,158,255,.55);
  transition:transform .08s linear,width .2s,height .2s;
  will-change:transform;
}
.gold-trail{
  position:fixed;top:0;left:0;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;
  border-radius:50%;pointer-events:none;z-index:99998;
  background:radial-gradient(circle,rgba(59,158,255,.72),transparent 70%);
  box-shadow:0 0 8px rgba(59,158,255,.45);
  will-change:transform;
}
@media (hover:none){#goldCursor,.gold-trail{display:none}}

/* 点击波纹（柔和） */
.ripple-ink{position:fixed;border-radius:50%;pointer-events:none;z-index:99997;
  background:radial-gradient(circle,rgba(59,158,255,.32),rgba(59,158,255,0) 70%);
  transform:scale(0);animation:rippleOut .52s ease-out forwards}
@keyframes rippleOut{to{transform:scale(1);opacity:0}}