/* ============================================================
   FluxToken 充值页皮肤  /fx/recharge.css
   只改外观：不碰按钮、不碰表单、不碰事件、不碰接口。

   注入方式：nginx 在 </head> 前加一条 <link>（外加 /fx/recharge.js）。
   充值页 CSP 的 script-src 和 style-src 都带 'self'，
   同源脚本与样式不加 nonce 也能执行。

   作用范围：这条 <link> 加在 SPA 外壳上，会出现在全站每个页面，
   所以每条规则都要求 body 里存在 [data-testid="payment-method-grid"]
   （只有结算/充值页有），再把内容规则锁进最内层的 .mx-auto.max-w-4xl
   ——也就是充值视图自己的容器；页面别处的卡片、按钮一律不受影响。
   自定义属性一律 --fx- 前缀，不会和站点已有的撞车。

   布局目标：整套档位卡片要矮到「不用滚动就能看到底部确认支付」。
   为此：固定 4 列（宽屏 4×2、平板 4×2、手机 2×4，档位只有 8 个），
   卡片里只留「标签 / 价格+到账 / 立即充值」三层。
   ============================================================ */

html.dark{
  --fx-bg:#0b0c0e; --fx-ink:#f2f3ee; --fx-muted:#989b9d; --fx-line:#292c2e;
  --fx-green:#d2f993; --fx-lime:#cfef00; --fx-lime-hover:#c4e201;
  --fx-surface:#101213; --fx-surface-2:#141617; --fx-surface-3:#1a1c1c;
  /* 全站统一字体：档位卡片里的数字、标签、标签行原本走等宽字体，
     和站点其它地方看着像两套东西，这里统一回同一套系统字体。 */
  --fx-mono:"Inter","Segoe UI","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;
  --fx-sans:"Inter","Segoe UI","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;
}

html.dark body:has([data-testid="payment-method-grid"]){
  background:var(--fx-bg); color:var(--fx-ink); font-family:var(--fx-sans);
  -webkit-font-smoothing:antialiased;
}

/* 充值视图容器：既要求里面有支付方式网格，又要求它自己不是外层套壳 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:has([data-testid="payment-method-grid"]):not(:has(.mx-auto.max-w-4xl)){
  width:min(1120px,100%);
  max-width:none;
}

/* 块间距从 24px 收到 16px：这点余量加起来就是一整屏 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:has([data-testid="payment-method-grid"]):not(:has(.mx-auto.max-w-4xl)) > * + *{
  margin-top:0.75rem;
}

/* ============================================================
   纵向瘦身：把这一屏压到不用滚动就能看见底部「确认支付」。
   都是收 padding / margin，不动结构、不动字号层级。
   ============================================================ */

/* 充值/订阅切换条 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) > .flex.rounded-lg.bg-gray-100 > button{
  padding-top:.3rem;padding-bottom:.3rem;
}

/* 原生卡片：p-5 / p-6 一律收到 10/14 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .card.p-5{
  padding:10px 16px;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .card.p-5 .mt-1{
  margin-top:2px;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .card.p-5 .mt-0\.5{
  margin-top:2px;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .card.p-6{
  padding:10px 14px;
}
/* 金额面板内部的 space-y-6 / space-y-4 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .card.p-6.space-y-6 > * + *{
  margin-top:10px;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .space-y-4 > * + *{
  margin-top:8px;
}
/* 三个分区小标题「快捷金额 / 自定义金额 / 支付方式」 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) label.mb-2,
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .mb-2.block{
  margin-bottom:5px;font-size:12px;
}
/* 自定义金额输入框收矮一点 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .input.py-3{
  padding-top:.45rem;padding-bottom:.45rem;
}
/* 支付方式按钮：收上下内边距 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) [data-testid="payment-method-grid"] > button{
  padding-top:.4rem;padding-bottom:.4rem;
}
/* 汇总卡里的三行 + 提交按钮上边距 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .card.p-6 > .space-y-2 > * + *{
  margin-top:3px;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .btn.w-full.mt-4{
  margin-top:8px;
}

/* ---------------- 1:1 比例说明（置顶） ---------------- */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:has([data-testid="payment-method-grid"]):not(:has(.mx-auto.max-w-4xl))::before{
  content:"充值比例 1:1 — 充 ¥1 到账 $1 额度，无手续费、无汇率损耗，最低 1 元";
  display:block;
  margin-bottom:8px;
  border:1px solid #3b4a2c;
  border-left:3px solid var(--fx-lime);
  background:#141a11;
  border-radius:6px;
  padding:11px 14px;
  font:14px/1.55 var(--fx-sans);
  font-weight:500;
  letter-spacing:.2px;
  color:#dbe8ca;
}

/* ---------------- 原生卡片（账户 / 金额 / 汇总） ---------------- */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .card{
  background:var(--fx-surface);
  border:1px solid var(--fx-line);
  border-radius:8px;
  box-shadow:none;
  transition:border-color .2s,background .2s;
}

/* 账户卡：标题 / 账号 / 余额 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .card .text-xs.font-medium{
  font:10px/1.6 var(--fx-mono);letter-spacing:.06em;color:#687171;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .card .mt-1.text-base.font-semibold{
  font:15px var(--fx-mono);color:var(--fx-ink);
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .card .text-green-600{
  color:var(--fx-green);font-family:var(--fx-mono);font-weight:600;
}

/* ============================================================
   固定档位卡片（由 /fx/recharge.js 生成）
   原生九宫格被整块隐藏，这里是一套同尺寸的替身；
   每张卡片的「立即充值」去点它对应的原生按钮，选中态从原生
   按钮的 class 反读。原生 DOM 一个字节都不动。
   ============================================================ */

/* 双保险：即使 JS 没跑到，也不让原生九宫格露出来 */
html.dark body:has(.fx-tiers-wrap) .fx-native{display:none!important}

/* 小标题行：档位标题 · 两条全局权益 · 编号 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-sec-head{
  display:flex;align-items:center;gap:14px;
  margin-bottom:11px;flex-wrap:wrap;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-sec-head h2{
  font-size:13px;font-weight:600;margin:0;color:var(--fx-ink);
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-sec-note{
  margin-left:auto;font:10px var(--fx-mono);color:#687171;
}

/* 九张卡片共用的两条权益，放在小标题行里，卡片里就不用各印一遍 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-perks{
  list-style:none;margin:0;padding:0;
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-perks li{
  display:flex;align-items:center;gap:5px;font-size:11px;color:#8a9089;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-perks svg{
  width:12px;height:12px;color:#8fae66;stroke-width:2.4;flex-shrink:0;display:block;
}

/* 固定 4 列：八张卡片排成 4 × 2，一行看全，不用横向找 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tiers{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
}

html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tier{
  position:relative;display:flex;flex-direction:column;
  background:var(--fx-surface);border:1px solid var(--fx-line);border-radius:8px;
  padding:8px 10px 9px;
  cursor:pointer;
  transition:border-color .2s,background .2s,transform .2s;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tier:hover{
  border-color:#40484a;background:#131617;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tier.is-rec{
  border-color:#97b76a;background:#171e15;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tier.is-rec:hover{
  border-color:#b0d182;background:#1a2218;
}
/* 选中态：跟随原生按钮 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tier.is-sel{
  border-color:#8fb35c;background:#1a2416;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tier.is-sel .fx-num{
  color:var(--fx-green);
}

/* 第一层：档位标签（说明挂在 title 上，悬停可见，不占行高） */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tag-row{
  display:flex;align-items:center;justify-content:space-between;
  gap:8px;margin-bottom:9px;min-height:18px;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tag{
  font:10px/1 var(--fx-mono);color:#b9c0bb;border:1px solid var(--fx-line);
  background:var(--fx-surface-2);border-radius:3px;padding:4px 7px;white-space:nowrap;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tier.is-rec .fx-tag{
  border-color:#4d6b3a;background:#1e2917;color:var(--fx-green);
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-pick{
  font:9.5px/1 var(--fx-mono);color:#15200c;background:var(--fx-green);
  border-radius:3px;padding:4px 7px;white-space:nowrap;font-weight:700;
}
/* 悬停时才出现的箭头：整张卡片可点，不用去瞄按钮 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-go{
  display:flex;align-items:center;color:#6d7a6a;opacity:0;
  transform:translateX(-4px);transition:opacity .2s,transform .2s;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-go svg{
  width:13px;height:13px;display:block;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tier:hover .fx-go{
  opacity:1;transform:translateX(0);
}

/* 第二层：价格 + 到账额度，同一行，窄了自动折行 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-price{
  display:flex;align-items:baseline;flex-wrap:wrap;
  gap:2px 9px;margin-bottom:11px;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-glyph{
  font-size:15px;color:#c3c9c4;font-weight:500;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-num{
  font:28px/1.05 var(--fx-mono);font-weight:700;letter-spacing:-.02em;color:var(--fx-ink);
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tier.is-rec .fx-num{
  color:var(--fx-green);
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-credit{
  display:inline-flex;align-items:center;gap:6px;
  font:10.5px var(--fx-mono);color:#c9d3bd;background:#171d14;
  border:1px solid #303a29;border-radius:3px;padding:3px 7px;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-credit b{
  color:var(--fx-green);font-weight:700;
}

/* 第三层：立即充值 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-buy{
  margin-top:auto;display:flex;align-items:center;justify-content:center;gap:7px;
  min-height:34px;padding:0 12px;border-radius:5px;font-size:12.5px;font-weight:550;
  background:var(--fx-surface-2);border:1px solid #444849;color:var(--fx-ink);
  cursor:pointer;transition:background .2s,border-color .2s,color .2s,transform .2s;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-buy:hover{
  background:#25292a;border-color:#5a6062;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-buy:active{
  transform:scale(.98);
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-buy svg{
  width:15px;height:15px;transition:transform .3s ease-in-out;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-buy:hover svg{
  transform:translateX(4px);
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-buy.primary{
  background:var(--fx-lime);border-color:var(--fx-lime);color:#15200c;
  border-radius:100px;font-weight:700;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-buy.primary:hover{
  background:var(--fx-lime-hover);border-color:var(--fx-lime-hover);
}

/* ---------------- 自定义金额输入 ---------------- */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .input{
  background:var(--fx-bg);
  border:1px solid #3a4143;
  border-radius:5px;
  color:var(--fx-ink);
  font:16px var(--fx-mono);
  transition:border-color .2s;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .input:focus{
  border-color:#7d9a5c;box-shadow:none;outline:none;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .input::placeholder{
  color:#6b7374;font-family:var(--fx-sans);font-size:13px;
}
/* 金额前面那个 "$" 前缀 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .relative > span.absolute{
  font-family:var(--fx-mono);
}

/* ---------------- 支付方式 ----------------
   只改圆角和间距，不动背景色和边框色：
   支付宝/微信的选中态靠品牌色区分，覆盖掉就看不出选没选了。 */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) [data-testid="payment-method-grid"]{
  gap:10px;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) [data-testid="payment-method-grid"] > button{
  border-radius:6px;
}

/* ---------------- 汇总金额 + 提交按钮 ---------------- */
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .card .text-lg.font-bold.text-primary-600{
  color:var(--fx-green);font-family:var(--fx-mono);
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .space-y-2 .font-medium{
  font-family:var(--fx-mono);
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .btn.w-full{
  min-height:46px;
  border-radius:100px;
  background:var(--fx-lime);
  border:1px solid var(--fx-lime);
  color:#15200c;
  font-size:15px;
  font-weight:700;
  transition:background .2s,transform .15s;
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .btn.w-full:hover:not(:disabled){
  background:var(--fx-lime-hover);border-color:var(--fx-lime-hover);
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .btn.w-full:active:not(:disabled){
  transform:scale(.95);
}
/* 点「立即充值」选中档位后，给底部确认按钮一下提示 */
@keyframes fx-flash{
  0%{box-shadow:0 0 0 0 rgba(207,239,0,.55)}
  100%{box-shadow:0 0 0 14px rgba(207,239,0,0)}
}
html.dark body:has([data-testid="payment-method-grid"])
  .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .btn.w-full.fx-flash{
  animation:fx-flash 1s ease-out 1;
}

/* ---------------- 窄屏 ---------------- */
@media(max-width:1000px){
  html.dark body:has([data-testid="payment-method-grid"])
    .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tiers{
    grid-template-columns:repeat(4,1fr);gap:8px;
  }
}
@media(max-width:760px){
  html.dark body:has([data-testid="payment-method-grid"])
    .mx-auto.max-w-4xl:has([data-testid="payment-method-grid"]):not(:has(.mx-auto.max-w-4xl)){
    width:100%;
  }
  html.dark body:has([data-testid="payment-method-grid"])
    .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tiers{
    grid-template-columns:repeat(2,1fr);gap:8px;
  }
  html.dark body:has([data-testid="payment-method-grid"])
    .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tier{padding:11px 12px 12px}
  html.dark body:has([data-testid="payment-method-grid"])
    .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-num{font-size:24px}
  html.dark body:has([data-testid="payment-method-grid"])
    .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-glyph{font-size:13px}
  html.dark body:has([data-testid="payment-method-grid"])
    .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tag-row{margin-bottom:8px;gap:6px}
  html.dark body:has([data-testid="payment-method-grid"])
    .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-tag,
  html.dark body:has([data-testid="payment-method-grid"])
    .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-pick{font-size:9px;padding:3px 6px}
  html.dark body:has([data-testid="payment-method-grid"])
    .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-price{margin-bottom:9px;gap:2px 7px}
  html.dark body:has([data-testid="payment-method-grid"])
    .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-credit{font-size:10px;padding:2px 6px}
  html.dark body:has([data-testid="payment-method-grid"])
    .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-buy{min-height:32px;font-size:12px}
  /* 小标题行的权益和编号在手机上让位给标题，省一行 */
  html.dark body:has([data-testid="payment-method-grid"])
    .mx-auto.max-w-4xl:not(:has(.mx-auto.max-w-4xl)) .fx-sec-note{display:none}
  html.dark body:has([data-testid="payment-method-grid"])
    .mx-auto.max-w-4xl:has([data-testid="payment-method-grid"]):not(:has(.mx-auto.max-w-4xl))::before{
    font-size:13px;padding:10px 12px;margin-bottom:1rem;
  }
}