
.wbd-r,.wbd-r *{box-sizing:border-box}
.wbd-r{
 --blue:#22adff;--blue2:#1f64d5;--border:#147df5;--bg:#07162e;--panel:#092142;--muted:#bed2f2;
 container-type:inline-size;
 width:100%; display:grid; grid-template-columns:minmax(230px,32%) minmax(0,68%);
 gap:20px; padding:24px; overflow:hidden;
 border:2px solid var(--border); border-radius:26px;
 background:linear-gradient(135deg,#061329,#08203f);
 color:#fff;font-family:Montserrat,Poppins,Arial,sans-serif
}
.wbd-r-welcome{
 min-width:0; min-height:300px; border-radius:22px; padding:36px;
 display:flex; flex-direction:column; justify-content:center;
 background:linear-gradient(145deg,#081a36,#07162d)
}
.wbd-r-welcome-text{font-size:clamp(22px,2.2vw,38px);font-weight:300;line-height:1.15}
.wbd-r-name{margin-top:12px;font-size:clamp(30px,3vw,50px);font-weight:700;line-height:1.1;overflow-wrap:anywhere}
.wbd-r-line{width:100px;height:5px;margin-top:26px;border-radius:10px;background:linear-gradient(90deg,var(--blue),#397bff)}

.wbd-r-balance{
 min-width:0; min-height:300px; padding:34px;
 border:2px solid var(--border);border-radius:24px;
 background:linear-gradient(145deg,#071a36,#092448);
 display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,230px);
 gap:28px;align-items:center
}
.wbd-r-info{min-width:0;display:grid;grid-template-columns:118px minmax(0,1fr);gap:26px;align-items:center}
.wbd-r-icon{
 width:118px;height:118px;border-radius:20px;position:relative;
 display:grid;place-items:center;background:linear-gradient(145deg,#0c4088,#092c60);
 box-shadow:inset 0 0 22px #207bdb33
}
.wbd-r-stack{font-size:35px;line-height:.48;text-align:center;color:#fff;text-shadow:0 0 9px #58a8ff}
.wbd-r-icon b{
 position:absolute;right:17px;bottom:17px;width:38px;height:38px;border:4px solid #fff;border-radius:50%;
 display:grid;place-items:center;background:#2d7ef0;font-size:20px
}
.wbd-r-copy{min-width:0}
.wbd-r-label{font-size:clamp(19px,1.8vw,30px);font-weight:300;color:var(--muted);white-space:nowrap}
.wbd-r-amount{margin-top:8px;font-size:clamp(32px,3.2vw,55px);line-height:1;font-weight:700;letter-spacing:-1px;white-space:nowrap}
.wbd-r-target{margin-top:22px;font-size:clamp(19px,1.7vw,29px);font-weight:300;color:var(--muted);white-space:nowrap}
.wbd-r-target strong{color:#fff;font-weight:700}

.wbd-r-ring{
 width:210px;max-width:100%;aspect-ratio:1;border-radius:50%;padding:24px;margin:auto;
 background:conic-gradient(var(--blue) 0 var(--p),#17498b var(--p) 360deg)
}
.wbd-r-ring-in{
 width:100%;height:100%;border-radius:50%;background:#081a34;
 display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:12px;overflow:hidden
}
.wbd-r-ring-in strong{
 display:block;width:100%;font-size:clamp(30px,3vw,46px);line-height:1;font-weight:700;white-space:nowrap
}
.wbd-r-ring-in span{
 display:block;width:100%;margin-top:9px;font-size:clamp(15px,1.5vw,22px);line-height:1.1;color:var(--muted);white-space:nowrap
}

/* Narrow Divi columns / tablets: stack the welcome card above the balance card. */
@container (max-width:900px){
 .wbd-r{grid-template-columns:1fr;padding:18px}
 .wbd-r-welcome{min-height:auto;padding:28px}
 .wbd-r-balance{grid-template-columns:minmax(0,1fr) 190px;min-height:260px;padding:28px}
 .wbd-r-ring{width:185px;padding:21px}
}

/* Narrow balance card: keep every label horizontal, then place ring below. */
@container (max-width:620px){
 .wbd-r{padding:13px;gap:14px;border-radius:20px}
 .wbd-r-welcome{text-align:center;padding:25px 18px}
 .wbd-r-line{margin:20px auto 0}
 .wbd-r-balance{grid-template-columns:1fr;padding:24px 16px;gap:24px;text-align:center}
 .wbd-r-info{grid-template-columns:1fr;gap:16px}
 .wbd-r-icon{width:92px;height:92px;margin:auto}
 .wbd-r-stack{font-size:29px}
 .wbd-r-icon b{width:31px;height:31px;right:12px;bottom:12px;font-size:16px;border-width:3px}
 .wbd-r-label{font-size:20px;white-space:normal}
 .wbd-r-amount{font-size:clamp(30px,10cqw,43px);white-space:nowrap}
 .wbd-r-target{font-size:18px;white-space:normal}
 .wbd-r-ring{width:180px;padding:20px}
 .wbd-r-ring-in strong{font-size:34px}
 .wbd-r-ring-in span{font-size:16px}
}

/* Very small phones. */
@container (max-width:390px){
 .wbd-r-welcome-text{font-size:21px}
 .wbd-r-name{font-size:29px}
 .wbd-r-amount{font-size:29px}
 .wbd-r-target{font-size:16px}
 .wbd-r-ring{width:165px;padding:18px}
 .wbd-r-ring-in strong{font-size:30px}
 .wbd-r-ring-in span{font-size:14px}
}


/* v1.2 — User-approved typography */
.wbd-r-welcome-text{font-size:26px!important}
.wbd-r-name{font-size:36px!important}
.wbd-r-label{font-size:20px!important}
.wbd-r-amount{font-size:40px!important}
.wbd-r-target{font-size:20px!important}
.wbd-r-target strong{font-size:20px!important}
.wbd-r-ring-in strong{font-size:36px!important}
.wbd-r-ring-in span{font-size:16px!important}

/* Preserve the requested typography while preventing overflow on very narrow phones. */
@container (max-width:390px){
  .wbd-r-name{font-size:32px!important}
  .wbd-r-amount{font-size:34px!important}
  .wbd-r-target,.wbd-r-target strong{font-size:18px!important}
  .wbd-r-ring-in strong{font-size:32px!important}
  .wbd-r-ring-in span{font-size:15px!important}
}


/* v1.3 — approved borderless layout, icon removed */
.wbd-r{
  grid-template-columns:minmax(250px,34%) minmax(0,66%)!important;
  border:0!important;
  padding:24px!important;
  gap:24px!important;
}
.wbd-r-welcome{
  border:0!important;
  background:transparent!important;
  border-radius:22px!important;
}
.wbd-r-balance{
  border:0!important;
  background:transparent!important;
  grid-template-columns:minmax(0,1fr) minmax(180px,230px)!important;
  padding:34px!important;
}
.wbd-r-info{
  display:block!important;
  min-width:0!important;
}
.wbd-r-icon{display:none!important}
.wbd-r-copy{min-width:0!important}
.wbd-r-label{font-size:20px!important;white-space:nowrap!important}
.wbd-r-amount{font-size:40px!important;white-space:nowrap!important}
.wbd-r-target,.wbd-r-target strong{font-size:20px!important}
.wbd-r-ring-in strong{font-size:36px!important}
.wbd-r-ring-in span{font-size:16px!important}

/* Tablet / narrow Divi column */
@container (max-width:900px){
  .wbd-r{grid-template-columns:1fr!important}
  .wbd-r-welcome{text-align:left!important;padding:26px!important}
  .wbd-r-balance{
    grid-template-columns:minmax(0,1fr) 185px!important;
    padding:26px!important;
  }
}

/* Mobile */
@container (max-width:620px){
  .wbd-r{padding:14px!important}
  .wbd-r-welcome{text-align:center!important;padding:24px 16px!important}
  .wbd-r-balance{
    grid-template-columns:1fr!important;
    text-align:center!important;
    padding:22px 14px!important;
  }
  .wbd-r-target{white-space:normal!important}
  .wbd-r-ring{width:180px!important}
}
@container (max-width:390px){
  .wbd-r-welcome-text{font-size:24px!important}
  .wbd-r-name{font-size:32px!important}
  .wbd-r-amount{font-size:34px!important}
  .wbd-r-target,.wbd-r-target strong{font-size:18px!important}
  .wbd-r-ring-in strong{font-size:32px!important}
  .wbd-r-ring-in span{font-size:15px!important}
}


/* v1.4 — exact requested responsive name/title sizes */
.wbd-r-name{font-size:30px!important}

@container (max-width:900px){
  .wbd-r-name{font-size:24px!important}
}

@container (max-width:620px){
  .wbd-r-name{font-size:20px!important}
}

@container (max-width:390px){
  .wbd-r-name{font-size:20px!important}
}

/* v1.5 */
.wbd-r-label{font-size:18px!important}


/* v1.6 — Main balance amount reduced by 10% */
.wbd-r-amount{font-size:36px!important}

@container (max-width:620px){
  .wbd-r-amount{font-size:32px!important}
}

@container (max-width:390px){
  .wbd-r-amount{font-size:28px!important}
}


/* v1.7 — Main Total Balance amount set to 28px */
.wbd-r-amount{font-size:28px!important}

@container (max-width:620px){
  .wbd-r-amount{font-size:26px!important}
}

@container (max-width:390px){
  .wbd-r-amount{font-size:24px!important}
}


/* v2.0 — Welcome + Name restored, improved mobile responsiveness */

/* Desktop */
.wbd-r{
  grid-template-columns:minmax(220px,32%) minmax(0,68%)!important;
  gap:20px!important;
}
.wbd-r-welcome{
  display:flex!important;
  min-width:0!important;
}
.wbd-r-name{
  font-size:30px!important;
  overflow-wrap:anywhere!important;
  word-break:normal!important;
}
.wbd-r-amount{
  font-size:28px!important;
}
.wbd-r-label{
  font-size:18px!important;
}
.wbd-r-target,
.wbd-r-target strong{
  font-size:20px!important;
}
.wbd-r-ring-in strong{
  font-size:36px!important;
}
.wbd-r-ring-in span{
  font-size:16px!important;
}

/* Tablet */
@container (max-width:900px){
  .wbd-r{
    grid-template-columns:1fr!important;
    gap:16px!important;
  }
  .wbd-r-welcome{
    min-height:auto!important;
    padding:26px 22px!important;
  }
  .wbd-r-name{
    font-size:24px!important;
  }
  .wbd-r-balance{
    grid-template-columns:minmax(0,1fr) 180px!important;
    padding:26px 22px!important;
    gap:22px!important;
  }
  .wbd-r-amount{
    font-size:26px!important;
  }
  .wbd-r-ring{
    width:175px!important;
  }
}

/* Mobile */
@container (max-width:620px){
  .wbd-r{
    padding:14px!important;
    gap:14px!important;
  }
  .wbd-r-welcome{
    text-align:center!important;
    padding:24px 16px!important;
    align-items:center!important;
  }
  .wbd-r-welcome-text{
    font-size:22px!important;
  }
  .wbd-r-name{
    font-size:20px!important;
    line-height:1.2!important;
    text-align:center!important;
  }
  .wbd-r-line{
    margin:18px auto 0!important;
  }

  .wbd-r-balance{
    grid-template-columns:1fr!important;
    text-align:center!important;
    padding:22px 14px!important;
    gap:22px!important;
  }
  .wbd-r-info{
    width:100%!important;
  }
  .wbd-r-label{
    font-size:18px!important;
    white-space:normal!important;
  }
  .wbd-r-amount{
    font-size:24px!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  .wbd-r-target,
  .wbd-r-target strong{
    font-size:18px!important;
    white-space:normal!important;
  }
  .wbd-r-ring{
    width:170px!important;
    padding:18px!important;
  }
  .wbd-r-ring-in strong{
    font-size:32px!important;
  }
  .wbd-r-ring-in span{
    font-size:15px!important;
  }
}

/* Very small mobile */
@container (max-width:390px){
  .wbd-r-welcome-text{
    font-size:20px!important;
  }
  .wbd-r-name{
    font-size:20px!important;
  }
  .wbd-r-amount{
    font-size:22px!important;
  }
  .wbd-r-target,
  .wbd-r-target strong{
    font-size:16px!important;
  }
  .wbd-r-ring{
    width:155px!important;
    padding:17px!important;
  }
  .wbd-r-ring-in strong{
    font-size:30px!important;
  }
  .wbd-r-ring-in span{
    font-size:14px!important;
  }
}


/* v2.1 — Final approved desktop + mobile layout */

/* Desktop: all content in one clean row */
.wbd-r{
  grid-template-columns:minmax(220px,30%) minmax(0,70%)!important;
  gap:18px!important;
  padding:24px!important;
}
.wbd-r-welcome{
  min-height:280px!important;
  padding:30px!important;
}
.wbd-r-welcome-text{font-size:26px!important}
.wbd-r-name{font-size:30px!important}
.wbd-r-balance{
  min-height:280px!important;
  grid-template-columns:minmax(0,1fr) 200px!important;
  gap:26px!important;
  padding:30px!important;
}
.wbd-r-label{font-size:18px!important}
.wbd-r-amount{font-size:28px!important}
.wbd-r-target,.wbd-r-target strong{font-size:20px!important}
.wbd-r-ring{width:190px!important;padding:21px!important}
.wbd-r-ring-in strong{font-size:36px!important}
.wbd-r-ring-in span{font-size:16px!important}

/* Tablet */
@container (max-width:900px){
  .wbd-r{
    grid-template-columns:1fr!important;
    gap:14px!important;
  }
  .wbd-r-welcome{
    min-height:auto!important;
    padding:24px!important;
  }
  .wbd-r-name{font-size:24px!important}
  .wbd-r-balance{
    min-height:auto!important;
    grid-template-columns:minmax(0,1fr) 175px!important;
    padding:24px!important;
  }
  .wbd-r-ring{width:170px!important}
}

/* Mobile: stack greeting, financial values, then centered ring */
@container (max-width:620px){
  .wbd-r{
    display:block!important;
    padding:14px!important;
  }
  .wbd-r-welcome{
    display:flex!important;
    text-align:left!important;
    align-items:flex-start!important;
    padding:22px 18px!important;
    margin:0 0 8px!important;
    background:transparent!important;
  }
  .wbd-r-welcome-text{
    font-size:22px!important;
    text-align:left!important;
  }
  .wbd-r-name{
    font-size:20px!important;
    text-align:left!important;
    width:100%!important;
  }
  .wbd-r-line{
    margin:16px 0 0!important;
    width:95px!important;
  }
  .wbd-r-balance{
    display:grid!important;
    grid-template-columns:1fr!important;
    text-align:left!important;
    padding:22px 18px 28px!important;
    gap:24px!important;
    background:transparent!important;
  }
  .wbd-r-info{text-align:left!important}
  .wbd-r-label{
    font-size:18px!important;
    white-space:normal!important;
  }
  .wbd-r-amount{
    font-size:24px!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  .wbd-r-target,
  .wbd-r-target strong{
    font-size:18px!important;
    white-space:normal!important;
  }
  .wbd-r-ring{
    width:175px!important;
    padding:19px!important;
    justify-self:center!important;
  }
  .wbd-r-ring-in strong{font-size:32px!important}
  .wbd-r-ring-in span{font-size:15px!important}
}

/* Very small mobile */
@container (max-width:390px){
  .wbd-r{padding:10px!important}
  .wbd-r-welcome{padding:20px 14px!important}
  .wbd-r-welcome-text{font-size:20px!important}
  .wbd-r-name{font-size:20px!important}
  .wbd-r-balance{padding:20px 14px 24px!important}
  .wbd-r-amount{font-size:22px!important}
  .wbd-r-target,.wbd-r-target strong{font-size:16px!important}
  .wbd-r-ring{width:160px!important;padding:17px!important}
  .wbd-r-ring-in strong{font-size:30px!important}
  .wbd-r-ring-in span{font-size:14px!important}
}


/* v2.2 — Mobile overlap/clipping fix */

/* Keep the entire widget inside narrow mobile columns */
@container (max-width:620px){
  .wbd-r{
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
    padding:12px!important;
  }

  .wbd-r-welcome{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:20px 16px!important;
  }

  .wbd-r-welcome-text{
    max-width:100%!important;
    font-size:20px!important;
    line-height:1.25!important;
    white-space:normal!important;
  }

  .wbd-r-name{
    max-width:100%!important;
    font-size:20px!important;
    line-height:1.2!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }

  .wbd-r-balance{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    grid-template-columns:minmax(0,1fr)!important;
    padding:20px 16px 26px!important;
    gap:22px!important;
    overflow:hidden!important;
  }

  .wbd-r-info,
  .wbd-r-copy{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  .wbd-r-label{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    font-size:18px!important;
    line-height:1.25!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  .wbd-r-amount{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    font-size:24px!important;
    line-height:1.2!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }

  .wbd-r-target{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    font-size:18px!important;
    line-height:1.35!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  .wbd-r-target strong{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin-top:5px!important;
    font-size:18px!important;
    line-height:1.25!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }

  .wbd-r-ring-wrap{
    width:100%!important;
    max-width:100%!important;
    display:flex!important;
    justify-content:center!important;
    overflow:visible!important;
  }

  .wbd-r-ring{
    width:160px!important;
    min-width:160px!important;
    max-width:160px!important;
    padding:18px!important;
    margin:0 auto!important;
    justify-self:center!important;
    flex:none!important;
  }

  .wbd-r-ring-inner,
  .wbd-r-ring-in{
    overflow:hidden!important;
  }

  .wbd-r-ring-in strong{
    font-size:30px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  .wbd-r-ring-in span{
    font-size:14px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
  }
}

/* Very narrow phones */
@container (max-width:390px){
  .wbd-r{padding:10px!important}
  .wbd-r-welcome{padding:18px 12px!important}
  .wbd-r-balance{padding:18px 12px 22px!important}

  .wbd-r-welcome-text{font-size:19px!important}
  .wbd-r-name{font-size:19px!important}
  .wbd-r-label{font-size:17px!important}
  .wbd-r-amount{font-size:22px!important}
  .wbd-r-target,
  .wbd-r-target strong{font-size:16px!important}

  .wbd-r-ring{
    width:145px!important;
    min-width:145px!important;
    max-width:145px!important;
    padding:16px!important;
  }
  .wbd-r-ring-in strong{font-size:28px!important}
  .wbd-r-ring-in span{font-size:13px!important}
}


/* v2.3 — TRUE container-responsive fix
   The outer wrapper is the query container. This allows .wbd-r itself
   to switch layouts based on its actual Divi/column width. */
.wbd-r-wrap{
  width:100%!important;
  max-width:100%!important;
  container-type:inline-size!important;
  container-name:wbd-card!important;
  overflow:hidden!important;
}

/* Remove self-container behavior; queries now use the wrapper. */
.wbd-r{
  container-type:normal!important;
  width:100%!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}

/* Tablet / narrow Divi column */
@container wbd-card (max-width:900px){
  .wbd-r{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }

  .wbd-r-welcome{
    width:100%!important;
    min-width:0!important;
    min-height:auto!important;
    padding:24px 20px!important;
  }

  .wbd-r-balance{
    width:100%!important;
    min-width:0!important;
    min-height:auto!important;
    grid-template-columns:minmax(0,1fr) 165px!important;
    padding:24px 20px!important;
    gap:20px!important;
  }

  .wbd-r-name{font-size:24px!important}
  .wbd-r-amount{
    font-size:26px!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  .wbd-r-ring{
    width:160px!important;
    min-width:160px!important;
    max-width:160px!important;
  }
}

/* Mobile — force a single vertical flow */
@container wbd-card (max-width:620px){
  .wbd-r{
    display:block!important;
    padding:12px!important;
    overflow:hidden!important;
  }

  .wbd-r-welcome{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    padding:20px 14px 16px!important;
    margin:0!important;
    text-align:left!important;
  }

  .wbd-r-welcome-text{
    font-size:20px!important;
    line-height:1.25!important;
    text-align:left!important;
    white-space:normal!important;
  }

  .wbd-r-name{
    width:100%!important;
    max-width:100%!important;
    margin-top:10px!important;
    font-size:20px!important;
    line-height:1.2!important;
    text-align:left!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  .wbd-r-line{
    width:96px!important;
    margin:16px 0 0!important;
  }

  .wbd-r-balance{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:18px 14px 24px!important;
    gap:22px!important;
    overflow:hidden!important;
    text-align:left!important;
  }

  .wbd-r-info,
  .wbd-r-copy{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  .wbd-r-label{
    display:block!important;
    width:100%!important;
    font-size:18px!important;
    line-height:1.25!important;
    white-space:normal!important;
  }

  .wbd-r-amount{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin-top:8px!important;
    font-size:24px!important;
    line-height:1.15!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }

  .wbd-r-target{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin-top:20px!important;
    font-size:18px!important;
    line-height:1.3!important;
    white-space:normal!important;
  }

  .wbd-r-target strong{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin-top:5px!important;
    font-size:18px!important;
    line-height:1.2!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  .wbd-r-ring-wrap{
    display:flex!important;
    width:100%!important;
    justify-content:center!important;
    align-items:center!important;
    overflow:visible!important;
  }

  .wbd-r-ring{
    width:150px!important;
    min-width:150px!important;
    max-width:150px!important;
    height:150px!important;
    margin:0 auto!important;
    padding:16px!important;
    flex:0 0 150px!important;
  }

  .wbd-r-ring-in strong{
    font-size:28px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  .wbd-r-ring-in span{
    font-size:13px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
  }
}

/* Very small mobile */
@container wbd-card (max-width:390px){
  .wbd-r{padding:8px!important}
  .wbd-r-welcome{padding:18px 12px 14px!important}
  .wbd-r-balance{padding:16px 12px 22px!important}
  .wbd-r-welcome-text{font-size:19px!important}
  .wbd-r-name{font-size:19px!important}
  .wbd-r-label{font-size:17px!important}
  .wbd-r-amount{font-size:22px!important}
  .wbd-r-target,.wbd-r-target strong{font-size:16px!important}
  .wbd-r-ring{
    width:140px!important;
    min-width:140px!important;
    max-width:140px!important;
    height:140px!important;
    flex-basis:140px!important;
    padding:15px!important;
  }
  .wbd-r-ring-in strong{font-size:27px!important}
  .wbd-r-ring-in span{font-size:12px!important}
}

/* Fallback for browsers/themes where container queries are disabled */
@media (max-width:767px){
  .wbd-r-wrap .wbd-r{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
  }
  .wbd-r-wrap .wbd-r-welcome{
    width:100%!important;
    min-height:auto!important;
  }
  .wbd-r-wrap .wbd-r-balance{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    min-width:0!important;
  }
  .wbd-r-wrap .wbd-r-ring{
    align-self:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
}
