/* Battle.net wallet: account region, verified denomination, confirmation. */
.bnw {
  --bnw-accent: var(--accent, #0878d1);
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  margin: 24px auto;
  padding: clamp(16px, 3vw, 32px);
  border: 1px solid var(--border, rgba(0, 0, 0, .12));
  border-radius: 24px;
  background: var(--surface, #fff);
  color: var(--text, #1d1d1f);
}
.bnw *, .bnw *::before, .bnw *::after { box-sizing: border-box; }
.bnw-intro { max-width: 760px; }
.bnw-intro h2 { margin: 0 0 12px; font-size: clamp(24px, 4vw, 36px); line-height: 1.16; letter-spacing: -.025em; }
.bnw-intro p { margin: 0; color: var(--muted, #6e6e73); line-height: 1.6; }
.bnw-intro img, .bnw-intro svg { display: block; max-width: 100%; height: auto; }
.bnw-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  list-style: none;
  margin: 22px 0 28px;
  padding: 0;
  color: var(--muted, #6e6e73);
  font-size: 13px;
  line-height: 1.4;
  counter-reset: bnw-step;
}
.bnw-steps > * { display: flex; align-items: center; gap: 8px; min-height: 32px; }
.bnw-steps > *::before {
  display: inline-flex;
  flex: 0 0 28px;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: 1px solid var(--border, rgba(0, 0, 0, .12));
  border-radius: 50%;
  background: var(--surface-2, #f6f6f8);
  color: var(--text, #1d1d1f);
  font-weight: 700;
  content: counter(bnw-step);
  counter-increment: bnw-step;
}
.bnw-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 320px);
  align-items: start;
  gap: clamp(20px, 3vw, 36px);
}
.bnw-main, .bnw-summary, .bnw-main > *, .bnw-summary > * { min-width: 0; }
.bnw-main h3, .bnw-summary h3 { margin: 0 0 12px; font-size: 18px; line-height: 1.35; }
.bnw-main fieldset { min-width: 0; margin: 0 0 24px; padding: 0; border: 0; }
.bnw-main legend { max-width: 100%; margin-bottom: 12px; padding: 0; font-weight: 700; line-height: 1.4; }
.bnw-regions { display: flex; flex-wrap: wrap; gap: 8px; }
.bnw-regions button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 44px;
  min-height: 44px;
  max-width: 100%;
  padding: 10px 14px;
  border: 1px solid var(--control-border, #8a8a8f);
  border-radius: 12px;
  background: var(--surface, #fff);
  color: var(--text, #1d1d1f);
  font: inherit;
  font-size: 14px;
  line-height: 1.4;
  text-align: center;
  overflow-wrap: anywhere;
  cursor: pointer;
  touch-action: manipulation;
}
.bnw-regions button small { font-size: 11px; line-height: 1.4; }
.bnw-regions button[aria-pressed="true"] { border-color: var(--bnw-accent); background: var(--bnw-accent); color: #fff; }
.bnw-region-note { margin: 12px 0 22px; color: var(--muted, #6e6e73); font-size: 14px; line-height: 1.6; }
.bnw-region-note a, .bnw-help a, .bnw-regional-links a { text-decoration: underline; text-underline-offset: 3px; }
.bnw-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.bnw-den {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  min-width: 0;
  min-height: 128px;
  padding: 16px;
  border: 1px solid var(--control-border, #8a8a8f);
  border-radius: 16px;
  background: var(--surface, #fff);
  color: var(--text, #1d1d1f);
  font: inherit;
  line-height: 1.35;
  text-align: left;
  overflow-wrap: anywhere;
  cursor: pointer;
  touch-action: manipulation;
}
.bnw-den[aria-pressed="true"] { border: 2px solid var(--bnw-accent); padding: 15px; box-shadow: 0 0 0 2px var(--surface, #fff); }
.bnw-face { font-size: clamp(20px, 2.5vw, 26px); font-weight: 750; line-height: 1.2; letter-spacing: -.025em; }
.bnw-price { color: var(--bnw-accent); font-size: 16px; font-weight: 700; white-space: normal; }
.bnw-unit { color: var(--muted, #6e6e73); font-size: 12px; line-height: 1.5; white-space: normal; }
.bnw-value-note { display: block; margin-top: auto; font-size: 12px; line-height: 1.45; color: var(--muted, #6e6e73); }
.bnw-den:disabled, .bnw-regions button:disabled { cursor: default; opacity: .58; }
.bnw button:focus-visible, .bnw a:focus-visible, .bnw input:focus-visible { outline: 3px solid var(--bnw-accent); outline-offset: 3px; }
@media (hover: hover) {
  .bnw-regions button:not(:disabled):not([aria-pressed="true"]):hover,
  .bnw-den:not(:disabled):not([aria-pressed="true"]):hover { border-color: var(--bnw-accent); background: var(--surface-2, #f6f6f8); }
}
.bnw-summary {
  position: sticky;
  top: 88px;
  padding: 22px;
  border: 1px solid var(--border, rgba(0, 0, 0, .12));
  border-radius: 18px;
  background: var(--surface-2, #f6f6f8);
  overflow-wrap: anywhere;
}
.bnw-total { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px 12px; margin: 16px 0 20px; }
.bnw-total > div { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px; padding: 8px 0; }
.bnw-total dt { min-width: 0; color: var(--muted, #6e6e73); font-size: 13px; line-height: 1.5; }
.bnw-total dd { max-width: 100%; margin: 0; font-weight: 700; text-align: right; line-height: 1.5; }
.bnw-total > dt:nth-last-child(2), .bnw-total > dd:last-child { margin-top: 6px; padding-top: 14px; border-top: 1px solid var(--border, rgba(0, 0, 0, .12)); }
.bnw-total > dd:last-child { font-size: 22px; line-height: 1.25; }
.bnw-total > div:last-child { margin-top: 8px; padding-top: 16px; border-top: 1px solid var(--border, rgba(0, 0, 0, .12)); }
.bnw-total > div:last-child dd { font-size: 22px; line-height: 1.25; }
.bnw-summary > p { color: var(--muted, #6e6e73); font-size: 13px; line-height: 1.65; }
.bnw-check { display: flex; align-items: flex-start; gap: 10px; min-height: 44px; margin: 16px 0; padding: 4px 0; font-size: 13px; line-height: 1.6; cursor: pointer; }
.bnw-check label { display: flex; align-items: flex-start; gap: 10px; min-height: 44px; max-width: 100%; padding: 4px 0; cursor: pointer; }
.bnw-check input { flex: 0 0 20px; width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--bnw-accent); }
.bnw-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.bnw-actions .btn, .bnw-actions button, .bnw-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 44px;
  min-height: 48px;
  padding: 12px 16px;
  line-height: 1.4;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
  touch-action: manipulation;
}
.bnw-actions button:disabled { cursor: default; }
.bnw-error { margin: 12px 0 0; color: var(--text, #1d1d1f); border-left: 3px solid #c54b38; padding: 4px 0 4px 10px; font-size: 13px; line-height: 1.6; }
.bnw-empty, .bnw-status {
  margin: 16px 0;
  padding: 16px;
  border: 1px solid var(--border, rgba(0, 0, 0, .12));
  border-radius: 12px;
  background: var(--surface-2, #f6f6f8);
  color: var(--text, #1d1d1f);
  font-size: 14px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
.bnw-empty p, .bnw-status p { margin: 0 0 10px; }
.bnw-empty p:last-child, .bnw-status p:last-child { margin-bottom: 0; }
.bnw-help { margin: 18px 0 0; color: var(--muted, #6e6e73); font-size: 13px; line-height: 1.65; overflow-wrap: anywhere; }
.bnw-empty .bnw-help { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.bnw-empty .bnw-help a { display: inline-flex; align-items: center; min-height: 44px; max-width: 100%; padding-block: 4px; }
.bnw-proof { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 24px 0 0; padding-top: 20px; border-top: 1px solid var(--border, rgba(0, 0, 0, .12)); font-size: 13px; color: var(--muted, #6e6e73); line-height: 1.6; }
.bnw-proof > * { min-width: 0; }
.bnw-regional-links { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 18px; font-size: 13px; line-height: 1.6; }
.bnw-regional-links a { display: inline-flex; align-items: center; min-height: 44px; padding: 4px 0; }
.bnw [hidden] { display: none !important; }
.bnw-legacy { margin: 20px 0; border: 1px solid var(--border, rgba(0, 0, 0, .12)); border-radius: 14px; background: var(--surface, #fff); }
.bnw-legacy > summary { min-height: 44px; padding: 14px 16px; color: var(--text, #1d1d1f); font-size: 14px; font-weight: 650; line-height: 1.5; cursor: pointer; }
.bnw-legacy > summary:focus-visible { outline: 3px solid var(--accent, #0878d1); outline-offset: 3px; }
.bnw-legacy[open] > summary { border-bottom: 1px solid var(--border, rgba(0, 0, 0, .12)); }
.bnw-legacy > :not(summary) { margin: 16px; }
.bnm-methods { display:flex; flex-wrap:wrap; gap:8px; max-width:1180px; margin:20px auto 0; }
.bnm-methods button { flex:1 1 240px; min-height:48px; padding:12px 18px; border:1px solid var(--control-border,#8a8a8f); border-radius:12px; background:var(--surface,#fff); color:var(--text,#1d1d1f); font:inherit; line-height:1.4; cursor:pointer; }
.bnm-methods button[aria-selected="true"] { background:#0878d1; border-color:#0878d1; color:#fff; }
.bnm-methods button:focus-visible { outline:3px solid #0878d1; outline-offset:3px; }
.bnm-amount { display:block; margin:16px 0 0; font-weight:700; line-height:1.4; }
.bnm-input { display:flex; align-items:center; gap:12px; margin-top:12px; padding:14px 16px; border:1px solid var(--control-border,#8a8a8f); border-radius:14px; background:var(--surface,#fff); }
.bnm-input:focus-within { outline:3px solid var(--bnw-accent); outline-offset:2px; }
.bnm-input input { min-width:0; width:100%; border:0; outline:none; background:transparent; color:var(--text,#1d1d1f); font:inherit; font-size:clamp(24px,5vw,34px); font-weight:750; }
.bnm-input b { flex:0 0 auto; color:var(--muted,#6e6e73); font-size:16px; }
.bnm-tiers { margin-top:20px; font-size:14px; line-height:1.6; }
.bnm-tiers summary { min-height:44px; cursor:pointer; }
.bnm .bnw-actions a[aria-disabled="true"] { opacity:.55; cursor:default; }
@media (max-width: 980px) {
  .bnw-layout { grid-template-columns: minmax(0, 1fr); }
  .bnw-summary { position: static; top: auto; padding: 20px; }
  .bnw-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 540px) {
  .bnw { margin: 16px auto; padding: 16px; border-radius: 18px; }
  .bnw-steps { margin: 18px 0 22px; gap: 8px 12px; }
  .bnw-steps > * { font-size: 12px; }
  .bnw-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .bnw-den { min-height: 126px; padding: 12px; border-radius: 12px; }
  .bnw-den[aria-pressed="true"] { padding: 11px; }
  .bnw-face { font-size: 21px; }
  .bnw-price { font-size: 15px; }
  .bnw-summary { padding: 16px; border-radius: 14px; }
  .bnw-regions button { flex: 1 1 auto; padding-inline: 10px; }
}
@media (max-width: 359px) { .bnw-grid { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) { .bnw *, .bnw *::before, .bnw *::after { scroll-behavior: auto; transition: none; animation: none; } }
@media (forced-colors: active) {
  .bnw-den[aria-pressed="true"], .bnw-regions button[aria-pressed="true"] { outline: 2px solid Highlight; outline-offset: -4px; }
  .bnw-den:disabled, .bnw-regions button:disabled { color: GrayText; opacity: 1; }
}

/* Customer purchase flow: one price, clear choices, a quiet receipt. */
.bns-topup.bns-topup--wallet,#bnetTopupBody .bns-topup.bns-topup--wallet,#bnetCatalogBody .bns-topup.bns-topup--wallet { padding:0; border:0; background:transparent; box-shadow:none; }
.bns-topup--wallet .bnm-hint,.bns-topup--wallet .bnw-region-help,
#bnetTopupBody .bns-topup--wallet .bnm-hint,#bnetTopupBody .bns-topup--wallet .bnw-region-help,
#bnetCatalogBody .bns-topup--wallet .bnm-hint,#bnetCatalogBody .bns-topup--wallet .bnw-region-help { margin:8px 0; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
.bnw { --bnw-accent:var(--accent,#0878d1); max-width:1180px; padding:clamp(20px,3vw,36px); border-radius:24px; }
.bnw-intro h2 { font-size:clamp(24px,3vw,30px); margin:6px 0 8px; letter-spacing:-.035em; }
.bnw-intro p { font-size:15px; line-height:1.6; max-width:620px; }
.bnw-kicker { display:block; color:var(--bnw-accent); font-size:12px; font-weight:750; line-height:1.5; letter-spacing:.06em; }
.bnw-layout { margin-top:30px; gap:clamp(24px,4vw,48px); grid-template-columns:minmax(0,1fr) minmax(280px,340px); }
.bnw-field { margin-bottom:26px; }
.bnw-main h3,.bnm-amount { font-size:15px; font-weight:700; line-height:1.5; }
.bnm-amount { margin:0; }
.bnw-regions button { border-color:var(--border,rgba(0,0,0,.13)); border-radius:12px; font-size:13px; }
.bnm-currencies { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.bnm-currencies .bnm-currency { display:flex; justify-content:flex-start; gap:12px; min-height:76px; padding:14px 16px; text-align:left; }
.bnm-currency strong { display:block; font-size:15px; line-height:1.35; }
.bnm-currency small { display:block; margin-top:3px; color:var(--muted,#6e6e73); }
.bnm-symbol { display:flex; flex:0 0 36px; width:36px; height:36px; align-items:center; justify-content:center; border-radius:10px; background:var(--surface-2,#f5f6f8); color:var(--bnw-accent); font-size:24px; font-weight:650; }
.bnw-choice-dot { display:block; flex:0 0 14px; width:14px; height:14px; margin-left:auto; border:1px solid var(--control-border,#8a8a8f); border-radius:50%; }
.bnm-currencies .bnm-currency[aria-pressed="true"] { color:var(--text,#1d1d1f); background:var(--surface-2,#f5f8fc); border-color:var(--bnw-accent); box-shadow:inset 0 0 0 1px var(--bnw-accent); }
.bnm-currency[aria-pressed="true"] .bnw-choice-dot { border:4px solid var(--bnw-accent); background:var(--surface,#fff); }
.bnm-input { min-height:76px; padding:14px 18px; border-color:var(--border,rgba(0,0,0,.16)); background:var(--surface-2,#fafbfc); border-radius:14px; }
.bnm-input input { min-height:44px; font-size:clamp(28px,5vw,38px); letter-spacing:-.025em; }
.bnm-input b { font-size:13px; font-weight:650; }
.bnm-input-hint { margin:10px 0 16px; font-size:13px; color:var(--muted,#6e6e73); line-height:1.5; }
.bnm-presets { gap:8px; }
.bnm-presets button { flex:1 1 100px; min-height:44px; padding:10px 8px; background:var(--surface,#fff); font-size:13px; }
.bnw-region-help { margin-top:6px; font-size:13px; color:var(--muted,#6e6e73); line-height:1.65; }
.bnw-region-help summary { display:list-item; width:fit-content; max-width:100%; min-height:44px; padding:11px 0; cursor:pointer; }
.bnw-region-help p { margin:0 0 8px; max-width:640px; }
.bnw-region-help a { display:inline-flex; align-items:center; min-height:44px; text-decoration:underline; text-underline-offset:3px; }
.bnw-summary { padding:24px; border:1px solid var(--border,rgba(0,0,0,.09)); border-radius:20px; background:var(--surface-2,#f6f8fb); box-shadow:0 8px 30px rgba(20,35,65,.045); }
.bnw-summary h3 { margin:0; font-size:16px; }
.bnw-receipt-head { display:flex; align-items:center; gap:12px; margin-bottom:24px; }
.bnw-receipt-icon { display:block; width:28px; height:28px; flex:0 0 28px; color:var(--bnw-accent); }
.bnw-total { grid-template-columns:minmax(0,1fr) minmax(0,1.4fr); align-items:baseline; margin:24px 0; gap:12px 8px; }
.bnw-total dd { font-size:16px; font-weight:750; }
.bnw-total .bnw-total-price { font-size:clamp(26px,3vw,32px); letter-spacing:-.035em; line-height:1.25; }
.bnw-summary .bnw-delivery { display:flex; align-items:baseline; gap:8px; font-size:13px; color:var(--text,#1d1d1f); }
.bnw-delivery p { margin:0; line-height:1.6; }
.bnw-delivery-dot { flex:0 0 6px; width:6px; height:6px; border-radius:50%; background:var(--bnw-accent); }
.bnw-summary .bnw-service-note { font-size:12px; line-height:1.65; margin:8px 0 14px; }
.bnw-check { margin:14px 0 18px; font-size:13px; line-height:1.55; }
.bnw-check input { width:18px; height:18px; flex-basis:18px; margin-top:1px; }
.bnw-actions>.btn { min-height:52px; border-radius:12px; background:var(--bnw-accent); border:1px solid var(--bnw-accent); color:#fff; font-size:15px; font-weight:700; text-decoration:none; box-shadow:0 4px 12px rgba(8,120,209,.12); }
.bnw-actions>.btn.btn-soft { background:transparent; color:var(--bnw-accent); border-color:var(--border,rgba(0,0,0,.12)); box-shadow:none; }
.bnw-actions>.btn[aria-disabled="true"],.bnw-actions>button:disabled { opacity:1; background:var(--surface,#fff); color:var(--muted,#6e6e73); border-color:var(--border,rgba(0,0,0,.12)); box-shadow:none; cursor:default; }
.bnw-support-link { display:flex; align-items:center; justify-content:center; min-height:44px; margin-top:8px; color:var(--muted,#6e6e73); font-size:13px; text-decoration:underline; text-underline-offset:3px; }
.bnw-status { margin:8px 0; padding:0; border:0; background:transparent; font-size:13px; color:var(--muted,#6e6e73); }
.bnw-stock-line { margin:16px 0 0; font-size:12px; line-height:1.6; color:var(--muted,#6e6e73); }
.bnw-refresh { display:inline-flex; align-items:center; min-height:44px; margin-top:4px; padding:10px 0; background:transparent; color:var(--bnw-accent); border:0; font:inherit; font-size:13px; cursor:pointer; }
.bnw-den { min-height:110px; border-color:var(--border,rgba(0,0,0,.14)); gap:12px; justify-content:center; padding:18px 14px; }
.bnw-den[aria-pressed="true"] { padding:17px 13px; background:var(--surface-2,#f5f8fc); box-shadow:inset 0 0 0 1px var(--bnw-accent); }
.bnw-price { font-size:15px; }
.bnw-proof { display:block; margin:18px 0 0; padding-top:16px; font-size:12px; line-height:1.65; }
.bnw-summary-empty { min-height:44px; font-size:13px; }
.bnm-methods { padding:6px; gap:6px; border-radius:18px; border:1px solid var(--border,rgba(0,0,0,.08)); background:var(--surface-2,#f6f6f8); }
.bnm-methods button { flex:1 1 220px; border:0; padding:13px 18px; border-radius:12px; background:transparent; color:var(--muted,#6e6e73); font-weight:650; text-align:left; }
.bnm-methods button strong { display:block; font-size:15px; line-height:1.4; }
.bnm-methods button small { display:block; margin-top:3px; font-size:12px; font-weight:400; line-height:1.5; }
.bnm-methods button[aria-selected="true"] { background:var(--surface,#fff); color:var(--bnw-accent); box-shadow:0 2px 8px rgba(20,35,65,.08); }
@media(max-width:980px) { .bnw-layout { grid-template-columns:minmax(0,1fr); margin-top:26px; gap:20px; } .bnw-summary { position:static; top:auto; } }
@media(max-width:540px) {
 .bnw { padding:20px 16px; border-radius:20px; margin-top:16px; }
 .bnw-intro p { font-size:14px; }
 .bnm-methods { gap:4px; padding:4px; }
 .bnm-methods button { flex:1 1 0; min-width:0; padding:10px; }
 .bnm-methods button strong { font-size:13px; }
 .bnm-methods button small { font-size:11px; }
 .bnm-currencies { gap:8px; }
 .bnm-currencies .bnm-currency { padding:12px 8px; gap:6px; }
 .bnm-symbol { flex-basis:28px; width:28px; height:32px; font-size:22px; }
 .bnm-currency strong { font-size:13px; white-space:nowrap; }
 .bnm-currency .bnw-choice-dot { display:none; }
 .bnw-choice-dot { flex-basis:12px; width:12px; height:12px; }
 .bnw-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .bnw-den { min-height:100px; padding:14px 10px; }
 .bnw-den[aria-pressed="true"] { padding:13px 9px; }
 .bnw-face { font-size:20px; }
 .bnw-summary { padding:20px; border-radius:16px; }
 .bnw-field { margin-bottom:22px; }
}