/* ===== VIP / wallet UI enhance (injected) ===== */
.vip-chip{display:inline-flex;align-items:center;gap:3px;margin-left:6px;padding:2px 8px;border-radius:999px;font-size:10px;font-weight:800;line-height:1.55;vertical-align:middle;letter-spacing:.2px;white-space:nowrap;color:#1b1206;background:linear-gradient(135deg,#f7d78a,#d4a574);box-shadow:0 2px 10px rgba(212,165,116,.35)}
.vip-chip .vip-ico{font-size:11px;line-height:1}
.vip-chip-m1{background:linear-gradient(135deg,#e2b28a,#b5764a);color:#241408;box-shadow:0 2px 10px rgba(181,118,74,.35)}
.vip-chip-m3{background:linear-gradient(135deg,#eef3f8,#a9b8c9);color:#1c2634;box-shadow:0 2px 10px rgba(169,184,201,.35)}
.vip-chip-m6{background:linear-gradient(135deg,#ffe79a,#e0a93c);color:#2a1b03;box-shadow:0 2px 12px rgba(224,169,60,.45)}
.vip-chip-m12{background:linear-gradient(135deg,#c9b9ff,#66e0ff 55%,#9ff5d4);color:#101a2e;box-shadow:0 2px 14px rgba(120,180,255,.5)}
.vip-chip-none{background:transparent;color:#c8b08c;border:1px dashed rgba(212,165,116,.55);box-shadow:none;font-weight:600}
.vip-expire{display:block;color:#c8a97e;font-size:10.5px;margin-top:2px;letter-spacing:.2px}
.vip-expire b{color:#f2d7a8;font-weight:700}
.coin-grid.vip-grid{gap:12px}
.vip-card{position:relative;display:flex;flex-direction:column;gap:3px;min-height:128px;padding:14px 12px 12px;border-radius:14px;border:1px solid #2a2a2a;background:linear-gradient(160deg,#1a1a1a,#101010);color:#fff;text-align:left;overflow:hidden;transition:transform .18s,box-shadow .18s,border-color .18s}
.vip-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(130px 90px at 100% 0,rgba(255,255,255,.10),transparent 70%)}
.vip-card:hover{transform:translateY(-2px)}
.vip-card .vip-tier{font-size:11px;font-weight:700;letter-spacing:.5px;opacity:.95}
.vip-card .vip-months{font-size:20px;font-weight:800;line-height:1.05;margin-top:2px}
.vip-card .vip-price{font-size:19px;font-weight:800;color:#f7d78a;line-height:1.15}
.vip-card .vip-note{font-size:10px;color:#8f8f8f;margin-top:auto}
.vip-card .vip-corner{position:absolute;top:9px;right:-27px;transform:rotate(38deg);background:linear-gradient(135deg,#ffd873,#e0a93c);color:#2a1b03;font-size:9px;font-weight:800;padding:2px 28px;display:none}
.vip-card-m1{border-color:rgba(181,118,74,.55)}
.vip-card-m1 .vip-tier{color:#e2b28a}
.vip-card-m3{border-color:rgba(169,184,201,.55)}
.vip-card-m3 .vip-tier{color:#dbe6f2}
.vip-card-m6{border-color:rgba(224,169,60,.7);box-shadow:0 6px 22px rgba(224,169,60,.16)}
.vip-card-m6 .vip-tier{color:#ffd873}
.vip-card-m12{border-color:rgba(120,180,255,.65);background:linear-gradient(160deg,#191a2b,#0e1018);box-shadow:0 6px 24px rgba(120,160,255,.18)}
.vip-card-m12 .vip-tier{color:#a9c6ff}
.vip-card-m12 .vip-price{color:#9ff5d4}
.vip-card-m6 .vip-corner,.vip-card-m12 .vip-corner{display:block}
.vip-card.selected{outline:2px solid #d4a574;outline-offset:1px;border-color:transparent}
.vip-card-m3.selected{outline-color:#cddae8}
.vip-card-m6.selected{outline-color:#ffd873}
.vip-card-m12.selected{outline-color:#8fb8ff}
.wallet-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:22px;border-radius:18px;border:1px solid rgba(212,165,116,.32);background:radial-gradient(420px 180px at 100% 0,rgba(212,165,116,.20),transparent 65%),linear-gradient(135deg,#1c1710,#111 60%,#0d0d0d);box-shadow:0 10px 30px rgba(0,0,0,.45)}
.wallet-hero .wallet-label{display:block;color:#c8b08c;font-size:12px;letter-spacing:1px}
.wallet-hero .wallet-amount{display:flex;align-items:baseline;gap:4px;margin:6px 0 4px}
.wallet-hero .wallet-amount .cur{color:#d4a574;font-size:20px;font-weight:700}
.wallet-hero .wallet-amount b{font-size:44px;line-height:1;font-weight:800;color:#fff;letter-spacing:.5px;font-variant-numeric:tabular-nums}
.wallet-hero .wallet-sub{color:#8f8f8f;font-size:11.5px}
.wallet-hero .wallet-side{display:flex;flex-direction:column;gap:8px;min-width:120px}
.wallet-hero .ghost-button{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 16px;border-radius:999px;border:1px solid rgba(212,165,116,.5);color:#e8cfa8;font-size:13px;background:transparent}
.wallet-hero .primary-button{height:38px}
@media (max-width:640px){
  .wallet-hero{padding:18px}
  .wallet-hero .wallet-amount b{font-size:36px}
  .wallet-hero .wallet-side{flex-direction:row;width:100%}
  .wallet-hero .wallet-side>*{flex:1}
  .coin-grid.vip-grid{gap:10px}
  .vip-card{min-height:118px;padding:12px 10px}
  .vip-card .vip-months{font-size:18px}
  .vip-card .vip-price{font-size:17px}
}

.coin-grid.vip-grid{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.coin-grid.vip-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:360px){.coin-grid.vip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ===== 金币充值档位 ===== */
.coin-promo{display:flex;align-items:center;gap:8px;margin:14px 0 0;padding:11px 14px;border-radius:12px;border:1px solid rgba(212,165,116,.45);background:linear-gradient(90deg,rgba(212,165,116,.18),rgba(212,165,116,.04));color:#f0d3a6;font-size:12px;letter-spacing:.3px}
.coin-promo b{color:#ffd873}
.coin-promo .coin-promo-days{margin-left:auto;color:#ffd873;font-weight:700;white-space:nowrap}
.coin-promo.is-off{filter:grayscale(1);opacity:.75}
.coin-grid.coin-grid-tiers{grid-template-columns:repeat(3,1fr);gap:12px}
.coin-grid button.coin-card{position:relative;display:flex;flex-direction:column;gap:2px;min-height:132px;padding:14px 12px 12px;border-radius:14px;border:1px solid #2a2a2a;background:linear-gradient(160deg,#171717,#0f0f0f);color:#fff;text-align:left;overflow:hidden;transition:transform .18s,box-shadow .18s;align-content:initial}
.coin-grid button.coin-card:hover{transform:translateY(-2px)}
.coin-grid button.coin-card .coin-tier-label{font-size:11px;font-weight:700;color:#9aa4b2}
.coin-grid button.coin-card .coin-yuan{display:flex;align-items:baseline;gap:2px;margin-top:2px}
.coin-grid button.coin-card .coin-yuan b{font-size:23px;font-weight:800;color:#fff;line-height:1.1}
.coin-grid button.coin-card .coin-yuan i{font-style:normal;font-size:12px;color:#bbb}
.coin-grid button.coin-card .coin-get{font-size:11px;color:#9fb0c0;margin-top:auto}
.coin-grid button.coin-card .coin-get b{color:#fff;font-size:13px}
.coin-grid button.coin-card .coin-badge{position:absolute;top:9px;right:-28px;transform:rotate(38deg);padding:2px 30px;font-size:9px;font-weight:800;color:#101418;display:none}
.coin-grid button.coin-card.selected{outline:2px solid #d4a574;outline-offset:1px;border-color:transparent}
.coin-grid button.coin-t1{border-color:rgba(124,138,160,.5)}
.coin-grid button.coin-t1 .coin-tier-label{color:#9fb0c8}
.coin-grid button.coin-t2{border-color:rgba(62,198,168,.55)}
.coin-grid button.coin-t2 .coin-tier-label{color:#5fe0c2}
.coin-grid button.coin-t2 .coin-badge{display:block;background:linear-gradient(135deg,#7ff0d5,#2fb99a)}
.coin-grid button.coin-t3{border-color:rgba(91,140,255,.55);box-shadow:0 6px 20px rgba(91,140,255,.12)}
.coin-grid button.coin-t3 .coin-tier-label{color:#8fb0ff}
.coin-grid button.coin-t3 .coin-badge{display:block;background:linear-gradient(135deg,#a9c6ff,#5b8cff)}
.coin-grid button.coin-t4{border-color:rgba(169,123,255,.6);box-shadow:0 6px 22px rgba(169,123,255,.16)}
.coin-grid button.coin-t4 .coin-tier-label{color:#c3a3ff}
.coin-grid button.coin-t4 .coin-badge{display:block;background:linear-gradient(135deg,#d9c2ff,#a97bff)}
.coin-grid button.coin-t5{border-color:rgba(255,157,77,.6);box-shadow:0 6px 22px rgba(255,157,77,.16)}
.coin-grid button.coin-t5 .coin-tier-label{color:#ffbe86}
.coin-grid button.coin-t5 .coin-badge{display:block;background:linear-gradient(135deg,#ffd0a3,#ff9d4d)}
.coin-grid button.coin-t6{border-color:rgba(255,209,102,.7);background:linear-gradient(160deg,#221a0c,#12100a);box-shadow:0 6px 24px rgba(255,209,102,.2)}
.coin-grid button.coin-t6 .coin-tier-label{color:#ffd873}
.coin-grid button.coin-t6 .coin-badge{display:block;background:linear-gradient(135deg,#fff0b8,#ffd166)}
@media (max-width:640px){
  .coin-grid.coin-grid-tiers{grid-template-columns:repeat(2,1fr)}
  .coin-grid button.coin-card{min-height:120px;padding:12px 10px}
  .coin-grid button.coin-card .coin-yuan b{font-size:20px}
}

.coin-grid button.coin-card:not(.has-bonus) .coin-badge{display:none!important}

/* flash-guard: 未美化的原按钮先隐藏，避免点击时闪回旧UI */
.coin-grid button[data-action="pick-coin"],.coin-grid button[data-action="pick-vip"]{transition:opacity .12s ease}
.coin-grid button[data-action="pick-coin"]:not([data-coin]),.coin-grid button[data-action="pick-vip"]:not([data-vip]){opacity:0!important}
