/* Hero Wallet 1.0: balance header, activity and the top-up form side by side (page with [heco_recharge_form]). */

body.hw-page .site-main > article.ht-entry > .ht-wrap{max-width:var(--hl-col,1200px)}
.hw{--hw-ink:#141414;--hw-slate:#4A5056;--hw-muted:#5f656b;--hw-red:#D2122E;--hw-red-deep:#A50E24;--hw-ok:#0b8a5f;--hw-line:rgba(20,20,20,.08);
  max-width:1200px;margin:0 auto;padding:4px 0 32px;color:var(--hw-ink)}

/* head */
.hw-head{margin:0 0 20px}
.hw .hw-title{margin:0;font-family:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif!important;font-size:clamp(2rem,4.2vw,3rem);font-weight:800;line-height:1.02;letter-spacing:-.04em;color:var(--hw-ink)}
.hw-lede{margin:10px 0 0;max-width:52ch;font-size:16px;line-height:1.6;color:var(--hw-slate)}

/* balance */
.hw-balance{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:24px 40px;padding:28px 32px}
.hw-bal{display:flex;flex-direction:column;gap:6px;min-width:0}
.hw-label,.hw-stats dt{font:600 12px/1 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.04em;color:var(--hw-muted)}
.hw-amount{font-family:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;font-size:clamp(2.6rem,5.6vw,4rem);font-weight:800;line-height:1;letter-spacing:-.045em;color:var(--hw-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.hw-cur{font-size:.36em;font-weight:700;letter-spacing:0;color:var(--hw-slate);vertical-align:.95em;margin-inline-end:2px}
.hw-amount small{font-size:.42em;font-weight:700;color:var(--hw-slate);letter-spacing:-.02em}
.hw-valid{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;height:28px;padding:0 12px;border-radius:999px;background:rgba(11,138,95,.1);color:var(--hw-ok);font-size:12.5px;font-weight:600}
.hw-valid::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.hw-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0}
.hw-stats div{padding:4px 18px;border-inline-start:1px solid var(--hw-line);min-width:0}
.hw-stats dd{margin:8px 0 0;font-family:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;font-size:clamp(16px,1.6vw,20px);font-weight:700;letter-spacing:-.02em;color:var(--hw-ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.hw-actions{display:flex;flex-wrap:wrap;gap:10px}
.hw-btn{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 22px;border-radius:999px;font:600 15px/1 "Alexandria","Segoe UI",system-ui,sans-serif;text-decoration:none!important;cursor:pointer;transition:background-color .25s,border-color .25s,color .25s,transform .4s cubic-bezier(.32,.72,0,1);white-space:nowrap}
.hw-btn:active{transform:scale(.98)}
.hw-btn-red{background:var(--hw-red);border:0;color:#fff!important}
.hw-btn-red:hover{background:var(--hw-red-deep)}
.hw-btn-line{background:#fff;border:1px solid #d9dce0;color:var(--hw-ink)!important}
.hw-btn-line:hover{border-color:var(--hw-red);color:var(--hw-red-deep)!important}
.hw-btn:focus-visible,.hw-chips button:focus-visible,.hw-more:focus-visible{outline:2px solid var(--hw-red);outline-offset:2px}

/* activity + form */
.hw-grid{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:20px;align-items:start;margin-top:20px}
.hw-activity{padding:24px 26px}
.hw-act-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.hw .hw-act-head h2{margin:0;font-size:22px;font-weight:800;letter-spacing:-.025em}
.hw-chips{display:flex;gap:6px}
.hw-chips button{height:34px;padding:0 14px;border-radius:999px;border:1px solid #d9dce0;background:#fff;color:var(--hw-slate);font:600 13px/1 "Alexandria","Segoe UI",system-ui,sans-serif;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}
.hw-chips button:hover{border-color:var(--hw-ink);color:var(--hw-ink)}
.hw-chips button[aria-pressed="true"]{background:var(--hw-ink);border-color:var(--hw-ink);color:#fff}
.hw-list{list-style:none;margin:10px 0 0;padding:0}
.hw-month{padding:16px 0 8px;border-bottom:1px solid var(--hw-line);font:600 12px/1 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.04em;color:var(--hw-muted)}
.hw-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid rgba(20,20,20,.05)}
.hw-row[hidden],.hw-month[hidden],.hw-more[hidden]{display:none}
.hw-ic{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;font:700 18px/1 "Bricolage Grotesque",system-ui,sans-serif}
.hw-ic.is-in{background:rgba(11,138,95,.1);color:var(--hw-ok)}
.hw-ic.is-out{background:rgba(210,18,46,.08);color:var(--hw-red-deep)}
.hw-what{display:flex;flex-direction:column;gap:3px;min-width:0}
.hw-what b{font-size:15px;font-weight:600;color:var(--hw-ink)}
.hw-det{font-size:13px;line-height:1.5;color:var(--hw-slate);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;unicode-bidi:plaintext;text-align:start}
.hw-when{font:500 11.5px/1.4 "JetBrains Mono",ui-monospace,monospace;color:var(--hw-muted)}
.hw-amt{display:flex;flex-direction:column;align-items:flex-end;gap:3px;text-align:end}
.hw-amt b{font-family:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;font-size:16px;font-weight:700;letter-spacing:-.01em;white-space:nowrap;font-variant-numeric:tabular-nums}
.hw-amt b.is-in{color:var(--hw-ok)}
.hw-amt b.is-out{color:var(--hw-ink)}
.hw-amt span{font-size:12px;color:var(--hw-muted);white-space:nowrap}
.hw-more{display:block;width:100%;height:44px;margin-top:14px;border:1px dashed #c9ccd1;border-radius:14px;background:transparent;color:var(--hw-slate);font:600 14px/1 "Alexandria","Segoe UI",system-ui,sans-serif;cursor:pointer}
.hw-more:hover{border-color:var(--hw-ink);color:var(--hw-ink)}
.hw-empty{margin:18px 0 4px;color:var(--hw-slate);font-size:15px;line-height:1.6}

.hw-topup{position:sticky;top:var(--hl-sticky,110px);min-width:0}
.hw .heco-rf{max-width:none!important;width:100%!important;margin:0!important}
.hw .heco-rf-balance{display:none!important}
.hw-tip{margin:22px 0 0;text-align:center;font-size:13.5px;color:var(--hw-muted)}

/* guest */
.hw-signin{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;padding:32px}
.hw .hw-signin h2{margin:0 0 8px;font-size:24px;font-weight:800;letter-spacing:-.03em}
.hw-signin-copy p{margin:0 0 20px;color:var(--hw-slate);font-size:15px;line-height:1.6;max-width:44ch}
.hw-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.hw-steps li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;align-items:start}
.hw-step-n{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:rgba(210,18,46,.08);color:var(--hw-red-deep);font:700 14px/1 "Bricolage Grotesque",system-ui,sans-serif}
.hw-steps li > div b{display:block;font-size:15px;font-weight:600}
.hw-steps li > div span{display:block;margin-top:2px;font-size:13.5px;line-height:1.55;color:var(--hw-slate)}

@media (max-width:1060px){
  .hw-balance{grid-template-columns:auto minmax(0,1fr)}
  .hw-balance .hw-actions{grid-column:1/-1}
}
@media (max-width:900px){
  .hw-grid{grid-template-columns:minmax(0,1fr)}
  .hw-topup{position:static;order:-1}
  .hw-signin{grid-template-columns:minmax(0,1fr);padding:24px}
}
@media (max-width:640px){
  .hw-balance{grid-template-columns:minmax(0,1fr);padding:22px 20px;gap:18px}
  .hw-stats div{padding:2px 10px}
  .hw-stats div:first-child{padding-inline-start:0;border-inline-start:0}
  .hw-stats dd{font-size:16px}
  .hw-actions .hw-btn{flex:1 1 0}
  .hw-activity{padding:20px 18px}
  .hw-row{grid-template-columns:32px minmax(0,1fr) auto;gap:10px}
  .hw-ic{width:32px;height:32px;font-size:16px}
}
@media (prefers-reduced-motion:reduce){.hw-btn,.hw-chips button{transition:none}}
