/* WIN + RED ENVELOPE PREMIUM V12 — visual layer only */

/* Win family tabs: remove the surrounding box and give each tab its own accent. */
.win[data-v-b74b9dc6] .main .main_nav{
  margin:8px 14px 2px!important;
  width:calc(100% - 28px)!important;
  padding:0!important;
  gap:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.win[data-v-b74b9dc6] .main .main_nav li{
  position:relative;
  height:52px!important;
  line-height:52px!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  border:0!important;
  font-size:14px!important;
  font-weight:850!important;
  opacity:1!important;
  transition:color .2s ease,transform .2s ease;
}
.win[data-v-b74b9dc6] .main .main_nav li:nth-child(1){color:#008f72!important}
.win[data-v-b74b9dc6] .main .main_nav li:nth-child(2){color:#7352b9!important}
.win[data-v-b74b9dc6] .main .main_nav li:nth-child(3){color:#b98516!important}
.win[data-v-b74b9dc6] .main .main_nav li:nth-child(4){color:#d04d5b!important}
.win[data-v-b74b9dc6] .main .main_nav li.active{background:transparent!important;box-shadow:none!important;border:0!important}
.win[data-v-b74b9dc6] .main .main_nav li::after{
  content:"";
  position:absolute;
  left:22%;right:22%;bottom:2px;height:3px;
  border-radius:999px;
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .22s ease,opacity .22s ease;
  opacity:0;
}
.win[data-v-b74b9dc6] .main .main_nav li:nth-child(1)::after{background:#00a98f}
.win[data-v-b74b9dc6] .main .main_nav li:nth-child(2)::after{background:#8a63d2}
.win[data-v-b74b9dc6] .main .main_nav li:nth-child(3)::after{background:#d29a22}
.win[data-v-b74b9dc6] .main .main_nav li:nth-child(4)::after{background:#e25b68}
.win[data-v-b74b9dc6] .main .main_nav li.active::after{transform:scaleX(1);opacity:1}
.win[data-v-b74b9dc6] .main .main_nav li:active{transform:translateY(1px)}

/* RedEnvelope list page: premium, spacious, mobile-first presentation. */
.recharge[data-v-a6ff3118]{
  min-height:100vh!important;
  padding-bottom:86px!important;
  background:
    radial-gradient(circle at 90% 8%,rgba(255,204,102,.12),transparent 24%),
    radial-gradient(circle at 8% 26%,rgba(0,169,149,.08),transparent 25%),
    linear-gradient(180deg,#f8fcfb 0%,#f3f8f7 54%,#eef5f3 100%)!important;
  color:#193a37!important;
}
.recharge[data-v-a6ff3118] .top_nav{
  position:sticky!important;top:0;z-index:20;
  height:60px!important;
  padding:0 16px!important;
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  background:linear-gradient(135deg,#006f65,#00a58f 58%,#00b19b)!important;
  box-shadow:0 7px 20px rgba(0,112,100,.18)!important;
}
.recharge[data-v-a6ff3118] .top_nav .left,
.recharge[data-v-a6ff3118] .top_nav .right{
  height:42px!important;min-width:42px!important;
  display:flex!important;align-items:center!important;
  cursor:pointer;border-radius:50%;
  transition:transform .18s ease,background .18s ease;
}
.recharge[data-v-a6ff3118] .top_nav .left{gap:8px!important;padding-right:8px;border-radius:14px}
.recharge[data-v-a6ff3118] .top_nav .right{justify-content:center;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2)}
.recharge[data-v-a6ff3118] .top_nav .left:active,
.recharge[data-v-a6ff3118] .top_nav .right:active{transform:scale(.95)}
.recharge[data-v-a6ff3118] .top_nav img{width:24px!important;height:24px!important;filter:brightness(0) invert(1);opacity:.96}
.recharge[data-v-a6ff3118] .top_nav span{font-size:18px!important;font-weight:850!important;letter-spacing:.01em;color:#fff!important}
.recharge[data-v-a6ff3118] .recharge_box{
  margin:16px 14px 0!important;
  padding:24px 14px 20px!important;
  min-height:250px;
  border:1px solid #deebe8!important;
  border-radius:22px!important;
  background:rgba(255,255,255,.9)!important;
  box-shadow:0 12px 30px rgba(28,70,65,.08),inset 0 1px 0 #fff!important;
  position:relative;overflow:hidden;
}
.recharge[data-v-a6ff3118] .recharge_box::before{
  content:"";position:absolute;inset:0 0 auto;height:4px;
  background:linear-gradient(90deg,#00a58f,#d39b27,#00a58f);
  opacity:.9;
}
.recharge[data-v-a6ff3118] .null_data{
  margin:22px 0 28px!important;
  min-height:92px;
  display:flex!important;align-items:center;justify-content:center;
  border-radius:18px;
  background:linear-gradient(145deg,#fbfefd,#f3f9f7)!important;
  border:1px dashed #d8e8e3!important;
  color:#61736e!important;
  font-size:15px!important;font-weight:750!important;
  letter-spacing:.01em;
}
.recharge[data-v-a6ff3118] .pagination{
  margin:0!important;padding:4px 2px!important;
}
.recharge[data-v-a6ff3118] .page_box{
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  list-style:none!important;margin:0!important;padding:0!important;
}
.recharge[data-v-a6ff3118] .page_box .page{
  color:#6b7d78!important;font-size:13px!important;font-weight:750!important;
}
.recharge[data-v-a6ff3118] .page_btn{display:flex!important;gap:8px!important}
.recharge[data-v-a6ff3118] .page_btn i{
  width:38px!important;height:38px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  border-radius:12px!important;
  background:#f1f8f6!important;color:#00a18c!important;
  border:1px solid #dcebe7!important;
  box-shadow:0 5px 12px rgba(28,75,68,.06)!important;
}
.recharge[data-v-a6ff3118] .choose_page{
  margin-top:12px!important;padding:0 2px!important;
}
.recharge[data-v-a6ff3118] .choose_page_par{
  display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:10px!important;
  color:#73817e!important;font-size:12px!important;font-weight:650!important;
}
.recharge[data-v-a6ff3118] .page_box_two{
  min-width:58px!important;border-bottom:2px solid #b9ccc7!important;
}
.recharge[data-v-a6ff3118] .van-dropdown-menu__bar{height:38px!important;background:transparent!important;box-shadow:none!important}
.recharge[data-v-a6ff3118] .van-dropdown-menu__title{font-size:14px!important;color:#374f4a!important;font-weight:800!important}
@media(max-width:420px){
  .recharge[data-v-a6ff3118] .recharge_box{margin-left:12px!important;margin-right:12px!important;padding-left:12px!important;padding-right:12px!important}
  .recharge[data-v-a6ff3118] .top_nav span{font-size:17px!important}
}
@media(prefers-reduced-motion:reduce){
  .recharge[data-v-a6ff3118] .top_nav .left,
  .recharge[data-v-a6ff3118] .top_nav .right,
  .win[data-v-b74b9dc6] .main .main_nav li{transition:none!important}
}
