:root {
  /* ===== ULTRA PREMIUM THEME - DMWIN ENHANCED ===== */
  --main-color: #00D4FF;
  --main_gradient-color: linear-gradient(90deg, #00D4FF 0%, #0099CC 45%, #006699 100%);
  --main_gradient-color2: linear-gradient(135deg, #0A0E27 0%, #1A2347 50%, #0F1428 100%);
  --light-main_gradient-color: var(--main_gradient-color);
  --light-main-color: var(--main-color);

  /* ===== BACKGROUND COLORS ===== */
  --bg_color_L1: #0A0E27;
  --bg_color_L2: #0F1428;
  --bg_color_L3: #1A2347;
  --light-bg_white: #0F1428;
  --darkBg: var(--bg_color_L2);
  --sheet_nva_color: #1A2347;
  --sheet_detail_bg_color: #0F1428;

  /* ===== TEXT COLORS ===== */
  --text_white: #ffffff;
  --text_color_L1: #ffffff;
  --text_color_L2: #E8F4FF;
  --text_color_L3: #B8D4E8;
  --text_color_L4: #0A0E27;

  /* ===== STATUS / ACCENT ===== */
  --norm_red-color: #FF3366;
  --norm_green-color: #00D4FF;
  --norm_secondary-color: #FFD700;
  --norm_Purple-color: #9966FF;
  --norm_bule-color: #00D4FF;
  --Secondary_red-color: #FF6B9D;
  --Secondary_green-color: #00D4FF;
  --Secondary_moto_Color9: #0F1428;
  --Secondary_moto_Color8: #0A0E27;

  /* ===== EXTRA UI COLORS ===== */
  --norm_purple1_color: #9966FF;
  --norm_Orange_color: #FFD700;
  --norm_green_color: #00D4FF;
  --norm_blue_color: #00D4FF;
  --norm_purple2_color: #CC99FF;
  --norm_brown_color: #8B7355;
  --norm_blue2_color: #66CCFF;
  --norm_blue3_color: #33AAFF;
  --norm_Orange2_color: #FFAA00;

  /* ===== UI / BORDER / ICON ===== */
  --button_dis_color: #4A5568;
  --Dividing-line_color: rgba(0, 212, 255, 0.35);
  --icon1: rgba(0, 212, 255, 0.85);
  --icon2: rgba(0, 212, 255, 0.45);
  --iconSecondary: rgba(0, 212, 255, 0.32);

  /* ===== TABS ===== */
  --tab1: #0A0E27;
  --tab2: #1A2347;

  /* ===== GAME ACTIVE ===== */
  --game_active_gradient: linear-gradient(180deg, #1A2347 0%, #0F1428 52%, #0A0E27 100%);

  /* ===== POPUP BG ===== */
  --pop_bg-color: linear-gradient(180deg, #00D4FF 0%, #0099CC 52%, #006699 100%);
}

/* ===== Ultra Premium Effects Engine ===== */
:root {
  --lux-glow-1: 0 0 0.1rem rgba(0, 212, 255, 0.25);
  --lux-glow-2: 0 0 0.2rem rgba(0, 212, 255, 0.2);
  --lux-border: rgba(0, 212, 255, 0.25);
  --lux-heading-glow: 0 0 0.06rem rgba(0, 212, 255, 0.35);
  --lux-hover-scale: 1.015;
  --lux-float-distance: 0.04rem;
  --lux-pulse-opacity: 0.25;
}

/* Preset 1: Soft */
body.theme-soft,
#app.theme-soft {
  --lux-glow-1: 0 0 0.08rem rgba(0, 212, 255, 0.2);
  --lux-glow-2: 0 0 0.14rem rgba(0, 212, 255, 0.14);
  --lux-border: rgba(0, 212, 255, 0.2);
  --lux-heading-glow: 0 0 0.05rem rgba(0, 212, 255, 0.28);
  --lux-hover-scale: 1.01;
  --lux-float-distance: 0.03rem;
  --lux-pulse-opacity: 0.18;
}

/* Preset 2: Medium */
body.theme-medium,
#app.theme-medium {
  --lux-glow-1: 0 0 0.13rem rgba(0, 212, 255, 0.35);
  --lux-glow-2: 0 0 0.28rem rgba(0, 212, 255, 0.24);
  --lux-border: rgba(0, 212, 255, 0.32);
  --lux-heading-glow: 0 0 0.08rem rgba(0, 212, 255, 0.42);
  --lux-hover-scale: 1.02;
  --lux-float-distance: 0.045rem;
  --lux-pulse-opacity: 0.28;
}

/* Preset 3: High */
body.theme-high,
#app.theme-high {
  --lux-glow-1: 0 0 0.18rem rgba(0, 212, 255, 0.5);
  --lux-glow-2: 0 0 0.36rem rgba(0, 212, 255, 0.36);
  --lux-border: rgba(0, 212, 255, 0.45);
  --lux-heading-glow: 0 0 0.12rem rgba(0, 212, 255, 0.55);
  --lux-hover-scale: 1.03;
  --lux-float-distance: 0.06rem;
  --lux-pulse-opacity: 0.35;
}

/* Preset 4: Ultra Luxury (Enhanced DMWin VIP) */
body.theme-ultra-luxury,
#app.theme-ultra-luxury {
  --main-color: #00D4FF;
  --main_gradient-color: linear-gradient(90deg, #00D4FF 0%, #0099CC 45%, #006699 100%);
  --main_gradient-color2: linear-gradient(135deg, #0A0E27 0%, #1A2347 50%, #0F1428 100%);
  --bg_color_L1: #0A0E27;
  --bg_color_L2: #0F1428;
  --bg_color_L3: #1A2347;
  --light-bg_white: #0F1428;
  --sheet_nva_color: #1A2347;
  --sheet_detail_bg_color: #0F1428;
  --text_color_L1: #ffffff;
  --text_color_L2: #E8F4FF;
  --text_color_L3: #B8D4E8;
  --text_color_L4: #0A0E27;
  --norm_secondary-color: #00D4FF;
  --norm_Orange_color: #FFD700;
  --norm_Orange2_color: #FFAA00;
  --button_dis_color: #4A5568;
  --Dividing-line_color: rgba(0, 212, 255, 0.35);
  --icon1: rgba(0, 212, 255, 0.85);
  --icon2: rgba(0, 212, 255, 0.45);
  --iconSecondary: rgba(0, 212, 255, 0.28);
  --tab1: #0A0E27;
  --tab2: #1A2347;
  --game_active_gradient: linear-gradient(180deg, #1A2347 0%, #0F1428 52%, #0A0E27 100%);
  --pop_bg-color: linear-gradient(180deg, #00D4FF 0%, #0099CC 52%, #006699 100%);

  --lux-glow-1: 0 0 0.16rem rgba(0, 212, 255, 0.36);
  --lux-glow-2: 0 0 0.32rem rgba(0, 212, 255, 0.28);
  --lux-border: rgba(0, 212, 255, 0.38);
  --lux-heading-glow: 0 0 0.1rem rgba(0, 212, 255, 0.42);
  --lux-hover-scale: 1.018;
  --lux-float-distance: 0.05rem;
  --lux-pulse-opacity: 0.3;
}

/* fallback default (ultra premium) */
body:not(.theme-soft):not(.theme-medium):not(.theme-high),
#app:not(.theme-soft):not(.theme-medium):not(.theme-high) {
  --lux-glow-1: 0 0 0.18rem rgba(0, 212, 255, 0.38);
  --lux-glow-2: 0 0 0.34rem rgba(0, 212, 255, 0.28);
  --lux-border: rgba(0, 212, 255, 0.4);
  --lux-heading-glow: 0 0 0.11rem rgba(0, 212, 255, 0.5);
  --lux-hover-scale: 1.022;
  --lux-float-distance: 0.05rem;
  --lux-pulse-opacity: 0.31;
}

#app,
body {
  background: 
    radial-gradient(ellipse at 20% 10%, rgba(0, 212, 255, 0.08) 0%, transparent 45%),
    radial-gradient(ellipse at 80% 30%, rgba(0, 153, 204, 0.06) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 60%, rgba(0, 102, 153, 0.04) 0%, transparent 60%),
    linear-gradient(135deg, #0A0E27 0%, #0F1428 25%, #1A2347 50%, #0F1428 75%, #0A0E27 100%) !important;
  background-attachment: fixed !important;
  background-size: cover !important;
  position: relative !important;
}

#app::before,
body::before {
  content: '' !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: 
    radial-gradient(circle at 15% 20%, rgba(0, 212, 255, 0.03) 0%, transparent 40%),
    radial-gradient(circle at 85% 40%, rgba(0, 153, 204, 0.02) 0%, transparent 45%),
    radial-gradient(circle at 45% 70%, rgba(0, 102, 153, 0.015) 0%, transparent 50%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

#app > *,
body > * {
  position: relative !important;
  z-index: 1 !important;
}

/* All interactive elements use theme colors */
#app .van-button--default,
#app .van-button--primary,
#app .van-button--info,
#app .van-button--success,
#app button:not(.van-button),
#app .btn,
#app .action-btn,
#app .submit-btn,
#app .confirm-btn,
#app .login-btn,
#app .register-btn {
  background: linear-gradient(90deg, #00D4FF 0%, #0099CC 100%) !important;
  color: #ffffff !important;
  border: 1px solid #00D4FF !important;
}

/* Remove old purple/pink colors completely */
#app [class*="purple"],
#app [class*="pink"],
#app [class*="magenta"],
#app [class*="violet"] {
  background: linear-gradient(90deg, #00D4FF 0%, #0099CC 100%) !important;
  color: #ffffff !important;
  border-color: #00D4FF !important;
}

/* Premium Scrollable History Section */
#app .history-container,
#app .transaction-history,
#app .records-container,
#app .history-list,
#app .bet-history,
#app .game-history {
  background: linear-gradient(135deg, rgba(26, 35, 71, 0.95) 0%, rgba(15, 20, 40, 0.95) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.2) !important;
  border-radius: 12px !important;
  backdrop-filter: blur(10px) !important;
  box-shadow: 
    0 4px 20px rgba(0, 212, 255, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  overflow-y: auto !important;
  max-height: 400px !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(0, 212, 255, 0.3) transparent !important;
}

#app .history-container::-webkit-scrollbar,
#app .transaction-history::-webkit-scrollbar,
#app .records-container::-webkit-scrollbar,
#app .history-list::-webkit-scrollbar,
#app .bet-history::-webkit-scrollbar,
#app .game-history::-webkit-scrollbar {
  width: 6px !important;
}

#app .history-container::-webkit-scrollbar-track,
#app .transaction-history::-webkit-scrollbar-track,
#app .records-container::-webkit-scrollbar-track,
#app .history-list::-webkit-scrollbar-track,
#app .bet-history::-webkit-scrollbar-track,
#app .game-history::-webkit-scrollbar-track {
  background: rgba(0, 212, 255, 0.05) !important;
  border-radius: 3px !important;
}

#app .history-container::-webkit-scrollbar-thumb,
#app .transaction-history::-webkit-scrollbar-thumb,
#app .records-container::-webkit-scrollbar-thumb,
#app .history-list::-webkit-scrollbar-thumb,
#app .bet-history::-webkit-scrollbar-thumb,
#app .game-history::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(0, 212, 255, 0.4) 0%, rgba(0, 153, 204, 0.3) 100%) !important;
  border-radius: 3px !important;
  border: 1px solid rgba(0, 212, 255, 0.2) !important;
}

/* History Item Styling */
#app .history-item,
#app .transaction-item,
#app .record-item,
#app .history-row,
#app .bet-item {
  background: linear-gradient(135deg, rgba(15, 20, 40, 0.6) 0%, rgba(26, 35, 71, 0.4) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.15) !important;
  border-radius: 8px !important;
  margin: 8px !important;
  padding: 12px !important;
  backdrop-filter: blur(5px) !important;
  transition: all 0.3s ease !important;
}

#app .history-item:hover,
#app .transaction-item:hover,
#app .record-item:hover,
#app .history-row:hover,
#app .bet-item:hover {
  background: linear-gradient(135deg, rgba(15, 20, 40, 0.8) 0%, rgba(26, 35, 71, 0.6) 100%) !important;
  border-color: rgba(0, 212, 255, 0.3) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 15px rgba(0, 212, 255, 0.15) !important;
}

/* Date and Time Styling */
#app .history-date,
#app .transaction-date,
#app .record-date,
#app .date-time,
#app .time-stamp {
  color: #00D4FF !important;
  font-weight: 600 !important;
  font-size: 0.9rem !important;
  text-shadow: 0 0 8px rgba(0, 212, 255, 0.3) !important;
  background: linear-gradient(90deg, #00D4FF 0%, #0099CC 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

#app .history-time,
#app .transaction-time,
#app .record-time {
  color: #E8F4FF !important;
  font-size: 0.85rem !important;
  opacity: 0.9 !important;
}

/* Promotion Menu/Selector - Fixed Layout */
#app .promotion-menu,
#app .promo-selector,
#app .promotion-tabs,
#app .promo-nav,
#app .promotion-header {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  padding: 12px !important;
  background: linear-gradient(135deg, rgba(26, 35, 71, 0.6) 0%, rgba(15, 20, 40, 0.6) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.15) !important;
  border-radius: 8px !important;
  margin-bottom: 16px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  backdrop-filter: blur(6px) !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(0, 212, 255, 0.2) transparent !important;
}

#app .promotion-menu::-webkit-scrollbar,
#app .promo-selector::-webkit-scrollbar,
#app .promotion-tabs::-webkit-scrollbar,
#app .promo-nav::-webkit-scrollbar,
#app .promotion-header::-webkit-scrollbar {
  height: 4px !important;
}

#app .promotion-menu::-webkit-scrollbar-track,
#app .promo-selector::-webkit-scrollbar-track,
#app .promotion-tabs::-webkit-scrollbar-track,
#app .promo-nav::-webkit-scrollbar-track,
#app .promotion-header::-webkit-scrollbar-track {
  background: rgba(0, 212, 255, 0.05) !important;
  border-radius: 2px !important;
}

#app .promotion-menu::-webkit-scrollbar-thumb,
#app .promo-selector::-webkit-scrollbar-thumb,
#app .promotion-tabs::-webkit-scrollbar-thumb,
#app .promo-nav::-webkit-scrollbar-thumb,
#app .promotion-header::-webkit-scrollbar-thumb {
  background: rgba(0, 212, 255, 0.3) !important;
  border-radius: 2px !important;
}

#app .promo-tab,
#app .promotion-tab,
#app .promo-item,
#app .promo-nav-item {
  flex: 0 0 auto !important;
  min-width: 80px !important;
  padding: 8px 16px !important;
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.08) 0%, rgba(0, 153, 204, 0.06) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.2) !important;
  border-radius: 6px !important;
  color: #E8F4FF !important;
  font-weight: 500 !important;
  font-size: 0.9rem !important;
  text-align: center !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  white-space: nowrap !important;
}

#app .promo-tab:hover,
#app .promotion-tab:hover,
#app .promo-item:hover,
#app .promo-nav-item:hover {
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.12) 0%, rgba(0, 153, 204, 0.1) 100%) !important;
  border-color: rgba(0, 212, 255, 0.35) !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

#app .promo-tab.active,
#app .promotion-tab.active,
#app .promo-item.active,
#app .promo-nav-item.active {
  background: linear-gradient(90deg, #00D4FF 0%, #0099CC 100%) !important;
  border-color: #00D4FF !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 10px rgba(0, 212, 255, 0.3) !important;
}

/* Transaction Menu with Date - Fixed Layout */
#app .transaction-menu,
#app .transaction-header,
#app .transaction-filter,
#app .transaction-section,
#app .bet-transaction,
#app .game-transaction {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  padding: 16px !important;
  background: linear-gradient(135deg, rgba(26, 35, 71, 0.8) 0%, rgba(15, 20, 40, 0.8) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.2) !important;
  border-radius: 12px !important;
  margin: 16px 0 !important;
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
  backdrop-filter: blur(8px) !important;
  position: relative !important;
}

/* Transaction Tabs Row */
#app .transaction-tabs,
#app .transaction-nav,
#app .transaction-menu-tabs,
#app .bet-tabs,
#app .game-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  padding: 8px !important;
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.06) 0%, rgba(0, 153, 204, 0.04) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.15) !important;
  border-radius: 6px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(0, 212, 255, 0.2) transparent !important;
}

#app .transaction-tabs::-webkit-scrollbar,
#app .transaction-nav::-webkit-scrollbar,
#app .transaction-menu-tabs::-webkit-scrollbar,
#app .bet-tabs::-webkit-scrollbar,
#app .game-tabs::-webkit-scrollbar {
  height: 3px !important;
}

#app .transaction-tabs::-webkit-scrollbar-thumb,
#app .transaction-nav::-webkit-scrollbar-thumb,
#app .transaction-menu-tabs::-webkit-scrollbar-thumb,
#app .bet-tabs::-webkit-scrollbar-thumb,
#app .game-tabs::-webkit-scrollbar-thumb {
  background: rgba(0, 212, 255, 0.25) !important;
  border-radius: 2px !important;
}

#app .transaction-tab,
#app .transaction-nav-item,
#app .transaction-menu-tab,
#app .bet-tab,
#app .game-tab {
  flex: 0 0 auto !important;
  min-width: 70px !important;
  padding: 6px 12px !important;
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.08) 0%, rgba(0, 153, 204, 0.06) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.2) !important;
  border-radius: 4px !important;
  color: #E8F4FF !important;
  font-weight: 500 !important;
  font-size: 0.85rem !important;
  text-align: center !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  white-space: nowrap !important;
}

#app .transaction-tab:hover,
#app .transaction-nav-item:hover,
#app .transaction-menu-tab:hover,
#app .bet-tab:hover,
#app .game-tab:hover {
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.12) 0%, rgba(0, 153, 204, 0.1) 100%) !important;
  border-color: rgba(0, 212, 255, 0.35) !important;
  color: #ffffff !important;
}

#app .transaction-tab.active,
#app .transaction-nav-item.active,
#app .transaction-menu-tab.active,
#app .bet-tab.active,
#app .game-tab.active {
  background: linear-gradient(90deg, #00D4FF 0%, #0099CC 100%) !important;
  border-color: #00D4FF !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 8px rgba(0, 212, 255, 0.25) !important;
}

/* Date Picker Section */
#app .date-picker-container,
#app .transaction-date-picker,
#app .date-filter,
#app .date-selector,
#app .bet-date-picker,
#app .game-date-picker {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px !important;
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.04) 0%, rgba(0, 153, 204, 0.02) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.1) !important;
  border-radius: 6px !important;
  flex-wrap: wrap !important;
}

#app .date-input,
#app .transaction-date-input,
#app .date-filter-input,
#app .date-selector-input,
#app .bet-date-input,
#app .game-date-input {
  flex: 1 !important;
  min-width: 120px !important;
  padding: 8px 12px !important;
  background: rgba(15, 20, 40, 0.8) !important;
  border: 1px solid rgba(0, 212, 255, 0.2) !important;
  border-radius: 4px !important;
  color: #ffffff !important;
  font-size: 0.9rem !important;
  outline: none !important;
}

#app .date-input:focus,
#app .transaction-date-input:focus,
#app .date-filter-input:focus,
#app .date-selector-input:focus,
#app .bet-date-input:focus,
#app .game-date-input:focus {
  border-color: rgba(0, 212, 255, 0.4) !important;
  box-shadow: 0 0 8px rgba(0, 212, 255, 0.2) !important;
}

/* Choices Section */
#app .choices-container,
#app .transaction-choices,
#app .choice-filter,
#app .bet-choices,
#app .game-choices {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  padding: 10px !important;
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.03) 0%, rgba(0, 153, 204, 0.02) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.1) !important;
  border-radius: 6px !important;
}

#app .choice-item,
#app .transaction-choice,
#app .choice-filter-item,
#app .bet-choice,
#app .game-choice {
  flex: 1 1 calc(33.333% - 6px) !important;
  min-width: 80px !important;
  padding: 8px 10px !important;
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.08) 0%, rgba(0, 153, 204, 0.06) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.15) !important;
  border-radius: 4px !important;
  color: #E8F4FF !important;
  font-weight: 500 !important;
  font-size: 0.85rem !important;
  text-align: center !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

#app .choice-item:hover,
#app .transaction-choice:hover,
#app .choice-filter-item:hover,
#app .bet-choice:hover,
#app .game-choice:hover {
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.12) 0%, rgba(0, 153, 204, 0.1) 100%) !important;
  border-color: rgba(0, 212, 255, 0.3) !important;
  color: #ffffff !important;
  transform: translateY(-1px) !important;
}

#app .choice-item.active,
#app .transaction-choice.active,
#app .choice-filter-item.active,
#app .bet-choice.active,
#app .game-choice.active {
  background: linear-gradient(90deg, #00D4FF 0%, #0099CC 100%) !important;
  border-color: #00D4FF !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 6px rgba(0, 212, 255, 0.2) !important;
}

/* Subordinate Menu - Completely Frozen */
#app .subordinate-menu,
#app .subordinate-nav,
#app .subordinate-header,
#app .subordinate-section,
#app .subordinate-container {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  padding: 14px !important;
  background: linear-gradient(135deg, rgba(26, 35, 71, 0.9) 0%, rgba(15, 20, 40, 0.9) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.25) !important;
  border-radius: 10px !important;
  margin: 12px 0 !important;
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
  min-height: auto !important;
  position: relative !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  transition: none !important;
  backdrop-filter: blur(10px) !important;
  box-shadow: 0 4px 20px rgba(0, 212, 255, 0.1) !important;
}

/* Subordinate Tabs - Fixed No Movement */
#app .subordinate-tabs,
#app .subordinate-nav-tabs,
#app .subordinate-menu-tabs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  padding: 8px !important;
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.05) 0%, rgba(0, 153, 204, 0.03) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.12) !important;
  border-radius: 6px !important;
  overflow: visible !important;
  position: static !important;
}

#app .subordinate-tab,
#app .subordinate-nav-item,
#app .subordinate-menu-tab {
  flex: 0 0 auto !important;
  min-width: 70px !important;
  padding: 6px 12px !important;
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.08) 0%, rgba(0, 153, 204, 0.06) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.15) !important;
  border-radius: 4px !important;
  color: #E8F4FF !important;
  font-weight: 500 !important;
  font-size: 0.85rem !important;
  text-align: center !important;
  cursor: pointer !important;
  position: static !important;
  transform: none !important;
  transition: none !important;
  white-space: nowrap !important;
}

#app .subordinate-tab.active,
#app .subordinate-nav-item.active,
#app .subordinate-menu-tab.active {
  background: linear-gradient(90deg, #00D4FF 0%, #0099CC 100%) !important;
  border-color: #00D4FF !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 8px rgba(0, 212, 255, 0.25) !important;
}

/* All Data Sections - Frozen */
#app .data-section,
#app .data-container,
#app .data-list,
#app .data-grid,
#app .data-content,
#app .subordinate-data,
#app .transaction-data,
#app .promotion-data {
  display: block !important;
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
  position: static !important;
  transform: none !important;
  transition: none !important;
  top: auto !important;
  left: auto !important;
}

/* Home Promotion Icons - No Movement */
#app .home-promotion .promo-option,
#app .home-promotion .promotion-item,
#app .home-promotion .bonus-card,
#app .home-promotion .promo-box,
#app .promotion-section .promo-option,
#app .promotion-section .promotion-item,
#app .promotion-section .bonus-card,
#app .promotion-section .promo-box {
  position: static !important;
  transform: none !important;
  transition: background 0.3s ease, border-color 0.3s ease !important;
  animation: none !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
}

#app .home-promotion .promo-option:hover,
#app .home-promotion .promotion-item:hover,
#app .home-promotion .bonus-card:hover,
#app .home-promotion .promo-box:hover,
#app .promotion-section .promo-option:hover,
#app .promotion-section .promotion-item:hover,
#app .promotion-section .bonus-card:hover,
#app .promotion-section .promo-box:hover {
  transform: none !important;
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.15) 0%, rgba(0, 153, 204, 0.12) 100%) !important;
  border-color: rgba(0, 212, 255, 0.4) !important;
  box-shadow: 0 6px 20px rgba(0, 212, 255, 0.2) !important;
}

/* Icons inside promotion - No movement */
#app .promo-icon,
#app .promotion-icon,
#app .bonus-icon,
#app .promo-option i,
#app .promotion-item i,
#app .bonus-card i,
#app .promo-box i,
#app .promo-option svg,
#app .promotion-item svg,
#app .bonus-card svg,
#app .promo-box svg {
  position: static !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
}

/* Freeze all animations */
#app .subordinate *,
#app .data-section *,
#app .home-promotion *,
#app .promotion-section * {
  animation: none !important;
  transform: none !important;
  transition: background 0.3s ease, border-color 0.3s ease, color 0.3s ease !important;
}

/* Remove Black Backgrounds */
#app .black-bg,
#app [style*="background: #000"],
#app [style*="background: black"],
#app [style*="background-color: #000"],
#app [style*="background-color: black"],
#app .bg-black,
#app .dark-black {
  background: linear-gradient(135deg, #0A0E27 0%, #0F1428 100%) !important;
}

/* Subordinate Sections Fixed */
#app .subordinate,
#app .sub-section,
#app .subordinate-section,
#app .subordinate-container,
#app .subordinate-list {
  background: linear-gradient(135deg, rgba(26, 35, 71, 0.4) 0%, rgba(15, 20, 40, 0.4) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.15) !important;
  border-radius: 8px !important;
  padding: 12px !important;
  margin: 8px 0 !important;
  backdrop-filter: blur(4px) !important;
}

#app .subordinate-item,
#app .sub-item,
#app .subordinate-row {
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.05) 0%, rgba(0, 153, 204, 0.03) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.1) !important;
  border-radius: 6px !important;
  padding: 10px !important;
  margin: 6px 0 !important;
  transition: all 0.2s ease !important;
}

#app .subordinate-item:hover,
#app .sub-item:hover,
#app .subordinate-row:hover {
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.08) 0%, rgba(0, 153, 204, 0.06) 100%) !important;
  border-color: rgba(0, 212, 255, 0.2) !important;
}

/* Home Promotion Options - Fixed Layout */
#app .home-promotion,
#app .promotion-section,
#app .promo-options,
#app .home-bonus,
#app .promotion-banner {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  padding: 16px !important;
  background: linear-gradient(135deg, rgba(26, 35, 71, 0.8) 0%, rgba(15, 20, 40, 0.8) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.2) !important;
  border-radius: 12px !important;
  margin: 16px 0 !important;
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
  backdrop-filter: blur(8px) !important;
}

#app .promo-option,
#app .promotion-item,
#app .bonus-card,
#app .promo-box {
  flex: 1 1 calc(50% - 6px) !important;
  min-width: 140px !important;
  max-width: calc(50% - 6px) !important;
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.1) 0%, rgba(0, 153, 204, 0.08) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.25) !important;
  border-radius: 8px !important;
  padding: 12px !important;
  text-align: center !important;
  transition: all 0.3s ease !important;
  cursor: pointer !important;
  position: relative !important;
  overflow: hidden !important;
}

#app .promo-option:hover,
#app .promotion-item:hover,
#app .bonus-card:hover,
#app .promo-box:hover {
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.15) 0%, rgba(0, 153, 204, 0.12) 100%) !important;
  border-color: rgba(0, 212, 255, 0.4) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(0, 212, 255, 0.2) !important;
}

/* Promotion Title and Amount */
#app .promo-title,
#app .promo-name,
#app .bonus-title,
#app .promotion-title {
  color: #00D4FF !important;
  font-weight: 600 !important;
  font-size: 0.95rem !important;
  margin-bottom: 6px !important;
  text-shadow: 0 0 6px rgba(0, 212, 255, 0.3) !important;
}

#app .promo-amount,
#app .bonus-amount,
#app .promo-value,
#app .promotion-amount {
  color: #FFD700 !important;
  font-weight: 700 !important;
  font-size: 1.1rem !important;
  margin-bottom: 4px !important;
}

/* Date and Time in Promotions */
#app .promo-date,
#app .bonus-date,
#app .promotion-date,
#app .promo-time,
#app .bonus-time {
  color: #E8F4FF !important;
  font-size: 0.8rem !important;
  opacity: 0.9 !important;
  line-height: 1.3 !important;
}

/* Choice/Selection Styling */
#app .choice-container,
#app .selection-box,
#app .bet-choice,
#app .game-choice {
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.1) 0%, rgba(0, 153, 204, 0.08) 100%) !important;
  border: 1px solid rgba(0, 212, 255, 0.25) !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  color: #ffffff !important;
  font-weight: 500 !important;
  transition: all 0.2s ease !important;
}

#app .choice-container:hover,
#app .selection-box:hover,
#app .bet-choice:hover,
#app .game-choice:hover {
  background: linear-gradient(135deg, rgba(0, 212, 255, 0.15) 0%, rgba(0, 153, 204, 0.12) 100%) !important;
  border-color: rgba(0, 212, 255, 0.4) !important;
  box-shadow: 0 2px 8px rgba(0, 212, 255, 0.2) !important;
}

/* Tab bar and navigation buttons */
#app .tabbar,
#app .tabbar__container,
#app .tabbar__items,
#app .bottom-nav,
#app .nav-bar {
  background: linear-gradient(180deg, #0A0E27 0%, #0F1428 100%) !important;
  border-top: 1px solid rgba(0, 212, 255, 0.3) !important;
}

/* Active tab highlighting */
#app .tabbar__item.active,
#app .tabbar__item.van-tabbar-item--active,
#app .van-tabbar-item--active,
#app .nav-item.active {
  color: #00D4FF !important;
  background: transparent !important;
}

/* Game buttons and cards */
#app .game-btn,
#app .game-button,
#app .play-btn,
#app .bet-btn,
#app .lottery-btn {
  background: linear-gradient(90deg, #00D4FF 0%, #0099CC 100%) !important;
  color: #ffffff !important;
  border: 1px solid #00D4FF !important;
}

/* Remove any remaining old color styles */
#app .van-button[style*="background"],
#app button[style*="background"] {
  background: linear-gradient(90deg, #00D4FF 0%, #0099CC 100%) !important;
  color: #ffffff !important;
}

/* Home page specific buttons - prevent old colors */
#app .home-btn,
#app .nav-btn,
#app .menu-btn,
#app .category-btn,
#app .filter-btn,
#app .sort-btn,
#app .mini-games-btn,
#app .lottery-btn-home,
#app .popular-btn,
#app .slots-btn,
#app .casino-btn,
#app [class*="home"][class*="btn"],
#app [class*="nav"][class*="btn"] {
  background: linear-gradient(90deg, #00D4FF 0%, #0099CC 100%) !important;
  color: #ffffff !important;
  border: 1px solid #00D4FF !important;
  border-radius: 0.5rem !important;
}

/* Prevent any gradient or colorful backgrounds on buttons except theme colors */
#app button[class*="gradient"],
#app .van-button[class*="gradient"],
#app .btn[class*="gradient"] {
  background: linear-gradient(90deg, #00D4FF 0%, #0099CC 100%) !important;
}

/* Force all buttons to use theme color - highest specificity */
#app button,
#app .van-button,
#app button[type="button"],
#app button[type="submit"],
#app a.btn,
#app .van-button--normal,
#app .van-button--plain {
  background: linear-gradient(90deg, #00D4FF 0%, #0099CC 100%) !important;
  color: #ffffff !important;
  border-color: #00D4FF !important;
}

/* Tab buttons - Mini games, Lottery, Popular */
#app .tab-btn,
#app .category-tab,
#app .game-tab,
#app .lottery-tab,
#app .mini-games-tab,
#app .popular-tab,
#app .slots-tab,
#app .casino-tab,
#app [class*="tab"][class*="btn"],
#app [class*="mini"][class*="game"],
#app [class*="lottery"],
#app [class*="popular"] {
  background: linear-gradient(90deg, #00D4FF 0%, #0099CC 100%) !important;
  color: #ffffff !important;
  border: 1px solid #00D4FF !important;
}

/* Game provider buttons - PG, JDB, JILI, KOLBET, PLAYACE, Evo, CQ9, 9G, PP */
#app .provider-btn,
#app .game-provider,
#app .pg-btn,
#app .jdb-btn,
#app .jili-btn,
#app .kolbet-btn,
#app .playace-btn,
#app .evo-btn,
#app .cq9-btn,
#app .nineg-btn,
#app .pp-btn,
#app [class*="pg"],
#app [class*="jdb"],
#app [class*="jili"],
#app [class*="provider"] {
  background: linear-gradient(135deg, #1A2347 0%, #0F1428 100%) !important;
  color: #00D4FF !important;
  border: 1px solid #00D4FF !important;
}

/* Bottom navigation - Purple to Cyan theme */
#app .tabbar,
#app .tabbar__container,
#app .tabbar__items,
#app .bottom-nav,
#app .nav-bar,
#app .footer-nav,
#app [class*="bottom"][class*="nav"],
#app [class*="tabbar"] {
  background: linear-gradient(180deg, #0A0E27 0%, #0F1428 100%) !important;
  background-image: none !important;
  border-top: 1px solid rgba(0, 212, 255, 0.4) !important;
  box-shadow: 0 -0.1rem 0.3rem rgba(0, 212, 255, 0.2) !important;
}

/* Bottom nav items - Home, Activity, Promotion, Wallet, Account */
#app .tabbar__item,
#app .tabbar__items-tab,
#app .tabbar__container-item,
#app .nav-item,
#app .bottom-nav-item,
#app [class*="tabbar"][class*="item"],
#app [class*="nav"][class*="item"] {
  background: transparent !important;
  color: #8BA4C7 !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

/* Active bottom nav item */
#app .tabbar__item.active,
#app .tabbar__items-tab.active,
#app .tabbar__container-item.active,
#app .nav-item.active,
#app .bottom-nav-item.active,
#app .tabbar-item--active,
#app .van-tabbar-item--active {
  color: #00D4FF !important;
  background: transparent !important;
  border-top: 2px solid #00D4FF !important;
  text-shadow: 0 0 0.5rem rgba(0, 212, 255, 0.5) !important;
}

/* Bottom nav icons */
#app .tabbar__item .icon,
#app .tabbar__item svg,
#app .tabbar__item img,
#app .nav-item .icon,
#app .bottom-nav-item .icon {
  color: #8BA4C7 !important;
  fill: #8BA4C7 !important;
  filter: none !important;
}

/* Active bottom nav icons */
#app .tabbar__item.active .icon,
#app .tabbar__item.active svg,
#app .tabbar__item.active img,
#app .nav-item.active .icon,
#app .bottom-nav-item.active .icon {
  color: #00D4FF !important;
  fill: #00D4FF !important;
  filter: drop-shadow(0 0 0.3rem rgba(0, 212, 255, 0.6)) !important;
}

/* Promotion center button (diamond/V icon) */
#app .tabbar__item:nth-child(3),
#app .tabbar__item.center,
#app .tabbar__item.promotion,
#app [class*="promotion"][class*="btn"],
#app .center-btn {
  background: linear-gradient(135deg, #00D4FF 0%, #0099CC 100%) !important;
  border: 2px solid #00D4FF !important;
  box-shadow: 0 0 1rem rgba(0, 212, 255, 0.4) !important;
  color: #ffffff !important;
}

#app .tabbar__item:nth-child(3) .icon,
#app .tabbar__item.center .icon,
#app .tabbar__item.promotion .icon {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* Remove all purple gradients from bottom nav */
#app [class*="tabbar"][style*="background"],
#app [class*="bottom-nav"][style*="background"],
#app [class*="footer"][style*="background"] {
  background: linear-gradient(180deg, #0A0E27 0%, #0F1428 100%) !important;
  background-image: none !important;
}

/* Detail button and other UI buttons */
#app .detail-btn,
#app .info-btn,
#app .more-btn,
#app .view-btn {
  background: linear-gradient(90deg, #00D4FF 0%, #0099CC 100%) !important;
  color: #ffffff !important;
  border: 1px solid #00D4FF !important;
}

/* GLOBAL PURPLE/MAGENTA REMOVAL - Override everything */
#app,
#app div,
#app span,
#app a,
#app button,
#app nav,
#app footer,
#app header,
#app section,
#app article,
#app aside,
#app main,
#app [class*="purple"],
#app [class*="magenta"],
#app [class*="pink"],
#app [class*="violet"],
#app [class*="lavender"],
#app [class*="plum"],
#app [class*="orchid"] {
  background-color: transparent !important;
  background-image: none !important;
}

/* Force all backgrounds to use theme */
#app [style*="background-color: #b1835a"],
#app [style*="background-color: #e811fb"],
#app [style*="background-color: #e705fb"],
#app [style*="background-color: #ff00ff"],
#app [style*="background-color: #ff66ff"],
#app [style*="background-color: #ff99ff"],
#app [style*="background-color: #9932cc"],
#app [style*="background-color: #8a2be2"],
#app [style*="background-color: #9370db"],
#app [style*="background-color: #ba55d3"],
#app [style*="background-color: #da70d6"],
#app [style*="background: #b1835a"],
#app [style*="background: #e811fb"],
#app [style*="background: #e705fb"],
#app [style*="background: #ff00ff"],
#app [style*="background: #ff66ff"],
#app [style*="background: linear-gradient"],
#app [style*="background: purple"],
#app [style*="background: magenta"] {
  background: linear-gradient(135deg, #0A0E27 0%, #0F1428 100%) !important;
  background-image: none !important;
  background-color: #0F1428 !important;
}

/* All text to light colors */
#app,
#app *,
#app .text,
#app p,
#app span,
#app label,
#app h1,
#app h2,
#app h3,
#app h4,
#app h5,
#app h6,
#app .title,
#app .name,
#app .label {
  color: #E8F4FF !important;
}

/* Active/selected items */
#app .active *,
#app .selected *,
#app .current *,
#app [class*="active"] {
  color: #00D4FF !important;
}

/* Links */
#app a,
#app a:link,
#app a:visited,
#app a:hover,
#app a:active,
#app .link {
  color: #00D4FF !important;
  text-decoration: none !important;
}

/* All borders to cyan */
#app *,
#app .border,
#app [class*="border"] {
  border-color: rgba(0, 212, 255, 0.3) !important;
}

/* AGGRESSIVE HOME PAGE TOP POSITIONING */
html, body {
  scroll-behavior: auto !important;
  overflow-anchor: none !important;
  overscroll-behavior: none !important;
}

#app {
  position: relative !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: auto !important;
  min-height: 100vh !important;
  scroll-behavior: auto !important;
  overflow-anchor: none !important;
}

/* Prevent any element from scrolling to bottom */
#app * {
  scroll-behavior: auto !important;
}

/* Home container must be at top */
#home, 
.home, 
.home-container, 
.home-page,
#main,
.main-container,
.content-container {
  position: relative !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
  scroll-margin-top: 0 !important;
}

/* Prevent focus from scrolling */
*:focus {
  scroll-margin: 0 !important;
  scroll-padding: 0 !important;
}

/* Disable smooth scrolling everywhere */
html {
  scroll-behavior: auto !important;
}

/* Ensure body starts at top */
body {
  margin-top: 0 !important;
  padding-top: 0 !important;
  position: relative !important;
}

#app {
  scroll-behavior: auto !important;
  overflow-anchor: none !important;
  position: relative !important;
}

#home, .home, .home-container, .home-page {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
}

#app .van-button::after,
#app button::after,
#app .x-btn::after,
#app .cg-default.van-button::after {
  display: none;
}

/* Active/highlighted elements - no animations */
#app .tabbar__items-tab.active,
#app .tabbar__container-item.active,
#app .van-tab--active,
#app .active {
  color: #00D4FF !important;
}

/* Cards / panels: ultra premium gradient */
#app .navbar-fixed,
#app .GameList__C,
#app .Wallet__C-balance,
#app .van-popup,
#app .van-dialog,
#app .noticeBar__container,
#app [class*="card"],
#app [class*="Card"] {
  position: relative;
  background-image: linear-gradient(160deg, rgba(26, 35, 71, 0.92) 0%, rgba(15, 20, 40, 0.95) 55%, rgba(10, 14, 39, 0.98) 100%);
  border: 1px solid var(--lux-border) !important;
  box-shadow: inset 0 0.02rem 0.08rem rgba(255, 255, 255, 0.08), inset 0 0 0.08rem rgba(0, 212, 255, 0.1), 0 0.14rem 0.3rem rgba(0, 0, 0, 0.45);
}

/* Headings: ultra premium cyan color */
#app h1,
#app h2,
#app h3,
#app h4,
#app .title,
#app .header .title {
  color: #00D4FF !important;
}

/* Readability tuning: only UI/text colors */
#app,
#app .van-cell,
#app .van-dialog__message,
#app .van-field__control,
#app .navbar__content-center,
#app .navbar__content-left .van-icon {
  color: var(--text_color_L1);
}

#app .van-button,
#app .x-btn,
#app .cg-default.van-button {
  color: #ffffff !important;
}

#app .tabbar__items-tab,
#app .tabbar__container-item,
#app .van-tab,
#app .van-dialog__header,
#app .van-cell__title,
#app .van-cell__value {
  color: var(--text_color_L2) !important;
}

#app .van-popup,
#app .van-dialog,
#app .noticeBar__container,
#app .navbar-fixed {
  backdrop-filter: blur(4px);
}

body.theme-ultra-luxury #app,
#app.theme-ultra-luxury {
  background: linear-gradient(180deg, #0A0E27 0%, #0F1428 55%, #0A0E27 100%) !important;
}

/* Hover effects removed */
#app .van-button:hover,
#app button:hover,
#app .x-btn:hover,
#app .cg-default.van-button:hover,
#app .tabbar__items-tab:hover,
#app .tabbar__container-item:hover,
#app [class*="card"]:hover,
#app [class*="Card"]:hover {
  transform: none;
  box-shadow: inset 0 0.03rem 0.05rem rgba(255, 255, 255, 0.12), 0 0.1rem 0.24rem rgba(0, 0, 0, 0.4);
}

#app .van-button:hover::after,
#app button:hover::after,
#app .x-btn:hover::after,
#app .cg-default.van-button:hover::after {
  display: none;
}

/* Icon animations removed */
#app .svg-icon,
#app [class*="icon"] {
  transition: none;
}

#app .svg-icon:hover,
#app [class*="icon"]:hover {
  transform: none;
  filter: none;
}

/* Pulse animations removed */
#app .active,
#app .van-tab--active,
#app .tabbar__items-tab.active,
#app .tabbar__container-item.active {
  animation: none;
}

@keyframes luxPulse {
  display: none;
}