:root {
  --abg-glass-card: rgba(24, 26, 32, 0.76);
  --abg-glass-card-strong: rgba(17, 19, 25, 0.88);
  --abg-glass-card-border: rgba(198, 165, 104, 0.18);
  --abg-glass-card-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  --abg-glass-blur: 12px;
}

#app .gameNav-container > .gameNav-item:nth-child(7) {
  display: none !important;
}

#app .gameNav-container {
  display: flex !important;
  flex-direction: column !important;
}

#app .gameNav-container > .gameNav-item {
  flex: 0 0 auto;
  color: #d9c398 !important;
  order: 0;
}

#app .gameNav-container > .gameNav-item:nth-child(3) { order: 1; }
#app .gameNav-container > .gameNav-item:nth-child(4) { order: 2; }
#app .gameNav-container > .gameNav-item:nth-child(5) { order: 3; }
#app .gameNav-container > .gameNav-item:nth-child(6) { order: 4; }
#app .gameNav-container > .gameNav-item:nth-child(2) { order: 5; }

#app .gameNav-container > .gameNav-item.active,
#app .gameNav-container > .gameNav-item.active * {
  color: #e3c587 !important;
}

#app .userPanel-nav .userPanel-nav-items {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

#app .userPanel-nav .userPanel-nav-items::before,
#app .userPanel-nav .userPanel-nav-items::after {
  display: none !important;
}

#app .main:has(.gameNav-item:nth-child(4).active) .gameNavCover-cover,
#app .main:has(.gameNav-item:nth-child(5).active) .gameNavCover-cover {
  background-color: #08090C !important;
  background-image: none !important;
  border: 1px solid rgba(198, 165, 104, 0.32) !important;
  border-radius: 10px !important;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45) !important;
}

#app .main:has(.gameNav-item:nth-child(4).active) .gameNavCover-cover .game-img,
#app .main:has(.gameNav-item:nth-child(5).active) .gameNavCover-cover .game-img {
  background: #08090C !important;
}

#app .main:has(.gameNav-item:nth-child(4).active) .gameNavCover-cover .van-image__img,
#app .main:has(.gameNav-item:nth-child(5).active) .gameNavCover-cover .van-image__img {
  filter: none !important;
  mix-blend-mode: normal !important;
}

#app .main:has(.gameNav-item:nth-child(4).active) .gameNavCover-name,
#app .main:has(.gameNav-item:nth-child(5).active) .gameNavCover-name {
  color: #F4F1E8 !important;
  font-weight: 600;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.85);
}

#app .main:has(.gameNav-item:nth-child(4).active) .gameNav-container > .gameNav-item:nth-child(4).active,
#app .main:has(.gameNav-item:nth-child(5).active) .gameNav-container > .gameNav-item:nth-child(5).active {
  background: linear-gradient(135deg, #242630, #111319) !important;
  border-color: rgba(198, 165, 104, 0.45) !important;
  color: #D5AD58 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
}

#app .main:has(.gameNav-item:nth-child(4).active) .gameNav-container > .gameNav-item:nth-child(4).active *,
#app .main:has(.gameNav-item:nth-child(5).active) .gameNav-container > .gameNav-item:nth-child(5).active * {
  background: transparent !important;
  color: #D5AD58 !important;
}

#app .main:has(.gameNav-item:nth-child(4).active) .gameNavCover-tag,
#app .main:has(.gameNav-item:nth-child(5).active) .gameNavCover-tag {
  z-index: 2;
  background-color: rgba(8, 9, 12, 0.96) !important;
  border: 1px solid rgba(198, 165, 104, 0.32);
  color: #D5AD58 !important;
}

#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-cover {
  background-color: #08090C !important;
  background-image: none !important;
  border: 1px solid rgba(198, 165, 104, 0.32) !important;
  border-radius: 10px !important;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45) !important;
}

#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-cover .game-img {
  background: #08090C !important;
}

#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-cover .van-image__img {
  filter: none !important;
  mix-blend-mode: normal !important;
}

#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-name {
  color: #F4F1E8 !important;
  font-weight: 600;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.85);
}

#app .main:has(.gameNav-item:nth-child(1).active) .gameNav-container > .gameNav-item:nth-child(1).active {
  background: linear-gradient(135deg, #242630, #111319) !important;
  border-color: rgba(198, 165, 104, 0.45) !important;
  color: #D5AD58 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
}

#app .main:has(.gameNav-item:nth-child(1).active) .gameNav-container > .gameNav-item:nth-child(1).active * {
  background: transparent !important;
  color: #D5AD58 !important;
}

#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-tag {
  z-index: 2;
  background-color: rgba(8, 9, 12, 0.96) !important;
  border: 1px solid rgba(198, 165, 104, 0.32);
  color: #D5AD58 !important;
}

#app .payment,
#app .payment .paymentType,
#app .payment .paymentType .cube-scroll-nav-bar,
#app .payment .paymentMethod,
#app .payment .moneyTransferBox,
#app .payment .bankInfoBox {
  background-color: var(--card-bg-deep) !important;
  color: var(--gold-light) !important;
}

#app .pageBox:has(.payment) {
  background-color: var(--bg-primary) !important;
}

#app .payment .methodContent,
#app .payment .moneyTransferBox .row,
#app .payment .paymentMethod .row,
#app .payment .bankInfoBox .row,
#app .payment .tips {
  background-color: var(--card-bg) !important;
}

#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1648780690_L4KaEvXjFy.png"]),
#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1648567649_YRtHmCwGhL.png"]),
#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1647580166_iTdTOpWtP3.png"]),
#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1648555344_i81rjGDfRK.png"]),
#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1647789838_8JVFNPPIlH.png"]),
#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1647744993_hKvQ2p8wDO.png"]),
#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1647594351_bi5xQaaD7I.png"]),
#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1647595442_aLpf5aTgPG.png"]),
#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1647792158_pKMT7R3009.png"]),
#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1647791559_407r30dVrA.png"]) {
  display: none !important;
}

#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1648555966_GwwBcVGki5.png"]),
#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1647585290_V7jO7N1tRZ.png"]),
#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1647584776_d34sBPBNGu.png"]),
#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1647831070_djDxYu8OP5.png"]),
#app .main:has(.gameNav-item:nth-child(1).active) .gameNavCover-items:has(img[data-src*="api_game_1647824633_7IyaKn5FQS.png"]) {
  display: none !important;
}

#app .main:has(.gameNav-item:nth-child(2).active) .gameNavCover-items:not(:has(img[data-src*="api_game_1648795799_GUIJf9ZP2o.png"])):not(:has(img[data-src*="api_game_1647776752_6YyZUQs9hs.png"])):not(:has(img[data-src*="api_game_1652103267_Ke0mwBuwvV.png"])):not(:has(img[data-src*="api_game_1648784586_gztNwdry08.png"])) {
  display: none !important;
}

#app #red-bag .rainBox {
  min-height: 100vh;
  min-height: 100dvh;
  background:
    radial-gradient(ellipse at 50% 28%, rgba(130, 94, 49, 0.16), transparent 52%),
    linear-gradient(160deg, #261d13 0%, #17120c 56%, #0c0a08 100%) !important;
}

#app #red-bag .game-btn-area {
  position: fixed;
  right: 0;
  bottom: max(18px, env(safe-area-inset-bottom));
  left: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 18px 24px;
  box-sizing: border-box;
  background: linear-gradient(180deg, transparent, rgba(12, 10, 8, 0.72));
}

#app #red-bag .game-btn-area .btn {
  width: min(100%, 320px);
  min-height: 48px;
  margin: 0;
  border: 1px solid rgba(220, 185, 119, 0.38);
  border-radius: 12px;
  color: #ead6aa !important;
  font-weight: 600;
  letter-spacing: 0.04em;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
}

#app #red-bag .game-btn-area .btn.btn-default {
  border-color: rgba(220, 185, 119, 0.55) !important;
  background: linear-gradient(135deg, #715329, #49351e) !important;
  color: #f1dfb7 !important;
}

#app #red-bag .game-btn-area .btn.btn-primary {
  border-color: rgba(220, 185, 119, 0.3) !important;
  background: linear-gradient(135deg, #30251a, #211910) !important;
  color: #d9c398 !important;
}

body:has(#red-bag) .van-dialog {
  overflow: hidden;
  border: 1px solid rgba(220, 185, 119, 0.45) !important;
  border-radius: 16px !important;
  background: linear-gradient(145deg, #30251a, #1b150e) !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.58) !important;
  color: #ead6aa !important;
}

body:has(#red-bag) .van-dialog__content,
body:has(#red-bag) .van-dialog__message {
  background: transparent !important;
  color: #ead6aa !important;
}

body:has(#red-bag) .van-dialog__footer {
  border-color: rgba(220, 185, 119, 0.22) !important;
  background: transparent !important;
}

body:has(#red-bag) .van-dialog .van-dialog__confirm,
body:has(#red-bag) .van-dialog .van-dialog__confirm .van-button__text {
  border-color: rgba(220, 185, 119, 0.3) !important;
  background: linear-gradient(135deg, #49371f, #302315) !important;
  color: #e3c587 !important;
}

#app .payment h5,
#app .payment .cube-scroll-nav-bar-item p,
#app .payment .moneyTransferBox .inputMoney p,
#app .payment .moneyTransferBox .row,
#app .payment .moneyTransferBox .row span,
#app .payment .paymentMethod .row label,
#app .payment .paymentMethod .row,
#app .payment .paymentMethod .row .info,
#app .payment .bankInfoBox .row,
#app .payment .bankInfoBox .row span,
#app .payment .tips p {
  color: var(--gold-light) !important;
}

#app .payment h5 {
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.5;
}

#app .payment .paymentType .cube-scroll-nav-bar-item,
#app .payment .paymentMethod .cube-scroll-nav-bar-item {
  background-color: var(--card-bg) !important;
  border-color: var(--border-subtle) !important;
  color: var(--gold-light) !important;
}

#app .payment .paymentType .cube-scroll-nav-bar-item_active,
#app .payment .paymentMethod .cube-scroll-nav-bar-item_active {
  background: linear-gradient(135deg, #49371f, #302315) !important;
  border-color: var(--gold-primary) !important;
  color: var(--gold-highlight) !important;
}

#app .payment .paymentType .check,
#app .payment .paymentMethod .check,
#app .payment .row a {
  color: var(--gold-highlight) !important;
}

#app .payment .moneyTransferBox .row,
#app .payment .paymentMethod .row,
#app .payment .bankInfoBox .row {
  border-color: var(--border-subtle) !important;
}

#app .payment input,
#app .payment select,
#app .payment textarea {
  color: var(--gold-highlight) !important;
  background-color: var(--card-bg-deep) !important;
  border: 1px solid var(--border-subtle) !important;
  border-radius: 6px;
  font-size: 16px !important;
}

#app .payment input::placeholder,
#app .payment textarea::placeholder {
  color: #B39A70 !important;
  opacity: 1;
}

#app .payment .moneyTransferBox .row .required,
#app .payment .moneyTransferBox .row .el-form-item__error,
#app .payment .moneyTransferBox .row .van-field__error-message {
  color: var(--gold-primary) !important;
}

#app .payment .confirm {
  background: linear-gradient(135deg, var(--gold-highlight), var(--gold-primary)) !important;
  border: 1px solid var(--gold-highlight) !important;
  color: var(--text-dark) !important;
  box-shadow: 0 4px 14px rgba(200, 166, 106, 0.2) !important;
}

#app .payment .tips p {
  color: var(--gold-light) !important;
  font-size: 13px !important;
  line-height: 1.7;
}

#app :is(
  .el-card,
  .activityBox,
  .box-item,
  .home-bulletins-container,
  .list-warp,
  .notice-sidebar-box,
  .van-cell-group,
  .loginVersion3-form-container,
  .loginVersion3-form-group,
  .personalNav > *,
  .cell,
  .cellItem,
  .content-top > .item,
  .gameCard-footer
) {
  border: 1px solid var(--abg-glass-card-border) !important;
  border-radius: 12px;
  background: linear-gradient(
    145deg,
    rgba(55, 42, 27, 0.76),
    var(--abg-glass-card)
  ) !important;
  box-shadow: var(--abg-glass-card-shadow);
  -webkit-backdrop-filter: blur(var(--abg-glass-blur));
  backdrop-filter: blur(var(--abg-glass-blur));
}

#app :is(.el-card__body, .home-bulletins-container > *, .gameCard-footer > *) {
  background-color: transparent !important;
}

#app :is(.van-popup, .van-dialog, .el-dialog, .el-message-box, .el-dropdown-menu) {
  border: 1px solid var(--abg-glass-card-border) !important;
  background: rgba(23, 18, 13, 0.88) !important;
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  box-shadow: 0 14px 38px rgba(0, 0, 0, 0.38) !important;
}

#app .userPanel-nav .userPanel-nav-items img {
  width: 44px !important;
  height: 44px !important;
  flex: none !important;
  margin: -9.5px 0 !important;
  object-fit: contain !important;
  filter: brightness(1.2) contrast(1.05) drop-shadow(0 1px 2px rgba(0, 0, 0, 0.5)) !important;
}

#app .userPanel-nav .userPanel-nav-items img[src*="home1"] { content: url("/static/img/abg-home-deposit.webp") !important; }
#app .userPanel-nav .userPanel-nav-items img[src*="home2"] { content: url("/static/img/abg-home-withdraw.webp") !important; }
#app .userPanel-nav .userPanel-nav-items img[src*="home3"] { content: url("/static/img/abg-home-vip.webp") !important; }

#app .userPanel-nav .userPanel-nav-items p {
  font-size: 11px !important;
}

#app .userPanel-nav .userPanel-nav-items img {
  transition: transform 0.18s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}

#app .userPanel-nav .userPanel-nav-items:active img {
  animation: abg-nav-icon-tap 0.45s ease-out;
  transform: translateY(-3px) scale(1.18) rotate(-6deg) !important;
}

@keyframes abg-nav-icon-tap {
  0% { transform: translateY(0) scale(1) rotate(0); }
  30% { transform: translateY(-5px) scale(1.22) rotate(-9deg); }
  60% { transform: translateY(-2px) scale(1.14) rotate(7deg); }
  100% { transform: translateY(-3px) scale(1.18) rotate(-6deg); }
}

/* 底部导航：统一金色线条图标，选中态为奶油金填充 + 顶部指示线 */
#app .navBar-item {
  position: relative !important;
}

#app .navBar-item img {
  width: 24px !important;
  height: 24px !important;
  object-fit: contain !important;
  filter: none !important;
  opacity: 1 !important;
}

#app .navBar-item:nth-child(1) img { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A28D75' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 11 12 3.8l8.5 7.2'/%3E%3Cpath d='M5.5 9.8V20h13V9.8'/%3E%3Cpath d='M10 20v-5.5h4V20'/%3E%3C/svg%3E") !important; }
#app .navBar-item:nth-child(2) img { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A28D75' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='8.5' width='17' height='4'/%3E%3Cpath d='M5 12.5V20h14v-7.5'/%3E%3Cpath d='M12 8.5V20'/%3E%3Cpath d='M12 8.5C9.6 8.5 7.4 7.8 7.4 6a2 2 0 0 1 3.6-1.3L12 8.5Zm0 0c2.4 0 4.6-.7 4.6-2.5A2 2 0 0 0 13 4.7L12 8.5Z'/%3E%3C/svg%3E") !important; }
#app .navBar-item:nth-child(3) img { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A28D75' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 14v-2.5a7.5 7.5 0 0 1 15 0V14'/%3E%3Cpath d='M4.5 13H7v5H5.5a1 1 0 0 1-1-1v-4Z'/%3E%3Cpath d='M17 13h2.5v4a1 1 0 0 1-1 1H17v-5Z'/%3E%3Cpath d='M19.5 18c0 1.7-2 2.7-5 2.7'/%3E%3C/svg%3E") !important; }
#app .navBar-item:nth-child(4) img { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A28D75' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8.5' r='3.7'/%3E%3Cpath d='M4.8 20c.6-3.7 3.5-5.6 7.2-5.6s6.6 1.9 7.2 5.6'/%3E%3C/svg%3E") !important; }

#app .navBar-item:nth-child(1) img[src*="_h."] { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23E9D1A4' fill-opacity='.3' stroke='%23F2DEB5' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 11 12 3.8l8.5 7.2'/%3E%3Cpath d='M5.5 9.8V20h13V9.8'/%3E%3Cpath d='M10 20v-5.5h4V20' fill='none'/%3E%3C/svg%3E") !important; }
#app .navBar-item:nth-child(2) img[src*="_h."] { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23E9D1A4' fill-opacity='.3' stroke='%23F2DEB5' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='8.5' width='17' height='4'/%3E%3Cpath d='M5 12.5V20h14v-7.5'/%3E%3Cpath d='M12 8.5V20' fill='none'/%3E%3Cpath d='M12 8.5C9.6 8.5 7.4 7.8 7.4 6a2 2 0 0 1 3.6-1.3L12 8.5Zm0 0c2.4 0 4.6-.7 4.6-2.5A2 2 0 0 0 13 4.7L12 8.5Z' fill='none'/%3E%3C/svg%3E") !important; }
#app .navBar-item:nth-child(3) img[src*="_h."] { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23E9D1A4' fill-opacity='.3' stroke='%23F2DEB5' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 14v-2.5a7.5 7.5 0 0 1 15 0V14' fill='none'/%3E%3Cpath d='M4.5 13H7v5H5.5a1 1 0 0 1-1-1v-4Z'/%3E%3Cpath d='M17 13h2.5v4a1 1 0 0 1-1 1H17v-5Z'/%3E%3Cpath d='M19.5 18c0 1.7-2 2.7-5 2.7' fill='none'/%3E%3C/svg%3E") !important; }
#app .navBar-item:nth-child(4) img[src*="_h."] { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23E9D1A4' fill-opacity='.3' stroke='%23F2DEB5' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8.5' r='3.7'/%3E%3Cpath d='M4.8 20c.6-3.7 3.5-5.6 7.2-5.6s6.6 1.9 7.2 5.6'/%3E%3C/svg%3E") !important; }

#app .navBar-item:has(img[src*="_h."])::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 50%;
  width: 22px;
  height: 2px;
  margin-left: -11px;
  border-radius: 2px;
  background: #c8a66a;
}

#app .navBar-item:has(img[src*="_h."]),
#app .navBar-item:has(img[src*="_h."]) p {
  color: #f8e7c3 !important;
}

/* 分类卡片对齐：名称单行省略，各语言行高一致，卡片顶部对齐 */
#app .gameNavCover-items {
  vertical-align: top !important;
}

#app .gameNavCover-items > p {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* 左侧分类选中态统一为暗金（体育、真人、捕鱼与热门/电子/棋牌一致） */
#app .gameNav-container > .gameNav-item:nth-child(2).active,
#app .gameNav-container > .gameNav-item:nth-child(3).active,
#app .gameNav-container > .gameNav-item:nth-child(6).active {
  background: linear-gradient(135deg, #50391f, #342316) !important;
  border-color: rgba(210, 175, 111, 0.55) !important;
  color: #e3c587 !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.24) !important;
}

#app .gameNav-container > .gameNav-item:nth-child(2).active *,
#app .gameNav-container > .gameNav-item:nth-child(3).active *,
#app .gameNav-container > .gameNav-item:nth-child(6).active * {
  background: transparent !important;
  color: #e3c587 !important;
}