/* ════════════════════════════════════════════════════════════════
   WINR v29 — Wallet & Payouts hub styles
   Frosted card on the profile (main tab) + Connect / Withdraw modals.
   Accent: white (--orange maps to #fff here); money = --neon-green.
   Additive; remove the v29 link tag to revert.
   ════════════════════════════════════════════════════════════════ */

/* ── Wallet card ── */
.v29-wallet{
  margin-top: 20px;
  padding: 22px 22px 18px;
  border-radius: var(--radius-lg);
  background: var(--bg-card);
  border: 1px solid var(--border-card);
  backdrop-filter: blur(20px) saturate(130%);
  -webkit-backdrop-filter: blur(20px) saturate(130%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 12px 40px rgba(0,0,0,0.4);
  animation: v29FadeIn .45s cubic-bezier(0.16,1,0.3,1) both;
}
@keyframes v29FadeIn{ from{ opacity:0; transform:translateY(10px) } to{ opacity:1; transform:none } }

.v29-wallet-head{ display:flex; align-items:flex-start; gap:14px; }
.v29-wallet-icon{
  flex:0 0 44px; width:44px; height:44px; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(255,255,255,0.05);
  border:1px solid var(--border-card);
  color: var(--text-mid);
}
.v29-wallet-icon.connected{ color: var(--neon-green); border-color: rgba(57,255,20,0.25); background: rgba(57,255,20,0.06); }
.v29-wallet-headtext{ flex:1; min-width:0; }
.v29-wallet-title{ font-size:16px; font-weight:800; color:var(--text-hi); letter-spacing:-0.2px; display:flex; align-items:center; gap:8px; }
.v29-wallet-sub{ font-size:12.5px; color:var(--text-mid); line-height:1.5; margin-top:4px; max-width:520px; }

.v29-connected-chip{
  font-size:9.5px; font-weight:800; letter-spacing:0.6px; text-transform:uppercase;
  color:var(--neon-green); background:rgba(57,255,20,0.10);
  border:1px solid rgba(57,255,20,0.25); border-radius:var(--radius-pill);
  padding:2px 8px;
}

/* ── Balance row ── */
.v29-wallet-balance-row{
  display:flex; gap:28px; flex-wrap:wrap;
  margin:18px 0 16px; padding:16px 18px;
  background: rgba(0,0,0,0.22); border:1px solid var(--border-card);
  border-radius: var(--radius-md);
}
.v29-balance-block{ display:flex; flex-direction:column; gap:5px; }
.v29-balance-label{ font-size:10.5px; font-weight:700; letter-spacing:0.8px; text-transform:uppercase; color:var(--text-lo); }
.v29-balance-amount{ font-size:30px; font-weight:900; letter-spacing:-1px; color:var(--neon-green); line-height:1; font-variant-numeric:tabular-nums; }
.v29-balance-amount.small{ font-size:18px; color:var(--text-hi); font-weight:800; }
.v29-balance-amount.muted{ color:var(--text-lo); }

/* ── Actions ── */
.v29-wallet-actions{ display:flex; gap:10px; }
.v29-wallet-foot{ margin-top:12px; font-size:11px; color:var(--text-lo); text-align:center; }

/* ── Buttons ── */
.v29-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  height:46px; padding:0 22px; border-radius:var(--radius-pill);
  font-size:14px; font-weight:700; cursor:pointer; border:1px solid transparent;
  transition: transform .15s ease, background .2s ease, opacity .2s ease, border-color .2s ease;
  white-space:nowrap;
}
.v29-btn-primary{ background:#fff; color:#0b0b0e; }
.v29-btn-primary:hover{ transform:translateY(-1px); background:var(--orange-hot); }
.v29-btn-primary:active{ transform:none; }
.v29-btn-ghost{ background:transparent; color:var(--text-mid); border-color:var(--border-card); }
.v29-btn-ghost:hover{ color:var(--text-hi); border-color:rgba(255,255,255,0.2); }
.v29-btn-block{ width:100%; }
.v29-btn.disabled, .v29-btn:disabled{ opacity:.4; cursor:not-allowed; transform:none; }
.v29-wallet-empty .v29-btn-primary{ width:100%; }

/* ── Overlay + modal ── */
.v29-overlay{
  position:fixed; inset:0; z-index:1200;
  display:flex; align-items:center; justify-content:center; padding:20px;
  background:rgba(0,0,0,0.62); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  opacity:0; transition:opacity .22s ease;
}
.v29-overlay.open{ opacity:1; }
.v29-modal{
  position:relative; width:100%; max-width:440px;
  max-height:calc(100vh - 40px); overflow-y:auto;
  padding:30px 26px 24px; border-radius:var(--radius-lg);
  background:rgba(14,15,19,0.96); border:1px solid rgba(255,255,255,0.10);
  box-shadow:0 32px 80px rgba(0,0,0,0.7), inset 0 1px 0 rgba(255,255,255,0.06);
  transform:translateY(12px) scale(.98); transition:transform .26s cubic-bezier(0.16,1,0.3,1);
}
.v29-overlay.open .v29-modal{ transform:none; }
.v29-modal-close{
  position:absolute; top:14px; right:14px; width:34px; height:34px;
  display:flex; align-items:center; justify-content:center; border-radius:50%;
  background:rgba(255,255,255,0.04); border:1px solid var(--border-card);
  color:var(--text-mid); cursor:pointer; transition:all .18s ease;
}
.v29-modal-close:hover{ color:var(--text-hi); background:rgba(255,255,255,0.08); }

.v29-modal-head{ text-align:center; margin-bottom:18px; }
.v29-modal-badge{
  width:54px; height:54px; margin:0 auto 14px; border-radius:16px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(57,255,20,0.07); border:1px solid rgba(57,255,20,0.22); color:var(--neon-green);
}
.v29-modal-title{ font-size:21px; font-weight:900; letter-spacing:-0.4px; color:var(--text-hi); }
.v29-modal-sub{ font-size:13px; color:var(--text-mid); line-height:1.55; margin-top:7px; }

/* ── Feature list (connect modal) ── */
.v29-feature-list{ list-style:none; padding:0; margin:0 0 20px; display:flex; flex-direction:column; gap:12px; }
.v29-feature{ display:flex; align-items:flex-start; gap:11px; font-size:13px; color:var(--text-mid); line-height:1.45; }
.v29-feature strong{ color:var(--text-hi); font-weight:700; }
.v29-feature-check{
  flex:0 0 20px; width:20px; height:20px; margin-top:1px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(57,255,20,0.12); color:var(--neon-green);
}
.v29-modal-foot{ margin-top:13px; font-size:11px; color:var(--text-lo); text-align:center; line-height:1.5; }

/* ── Withdraw modal ── */
.v29-withdraw-balance{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 16px; margin-bottom:18px; border-radius:var(--radius-md);
  background:rgba(57,255,20,0.05); border:1px solid rgba(57,255,20,0.18);
}
.v29-withdraw-avail{ font-size:20px; font-weight:900; color:var(--neon-green); letter-spacing:-0.5px; font-variant-numeric:tabular-nums; }
.v29-field-label{ display:block; font-size:11px; font-weight:700; letter-spacing:0.6px; text-transform:uppercase; color:var(--text-lo); margin-bottom:8px; }
.v29-amount-wrap{
  display:flex; align-items:center; gap:6px; padding:0 10px 0 16px;
  height:56px; border-radius:var(--radius-md);
  background:var(--bg-input); border:1px solid var(--border-card);
  transition:border-color .18s ease, box-shadow .18s ease;
}
.v29-amount-wrap:focus-within{ border-color:rgba(255,255,255,0.28); box-shadow:0 0 0 3px rgba(255,255,255,0.06); }
.v29-amount-cur{ font-size:24px; font-weight:800; color:var(--text-mid); }
.v29-amount-input{
  flex:1; min-width:0; height:100%; border:0; outline:0; background:transparent;
  font-size:26px; font-weight:800; color:var(--text-hi); letter-spacing:-0.5px; font-variant-numeric:tabular-nums;
}
.v29-amount-input::placeholder{ color:var(--text-lo); }
.v29-amount-max{
  flex:0 0 auto; height:32px; padding:0 12px; border-radius:var(--radius-pill);
  background:rgba(255,255,255,0.06); border:1px solid var(--border-card);
  color:var(--text-hi); font-size:11px; font-weight:800; letter-spacing:0.5px; cursor:pointer;
  transition:background .18s ease;
}
.v29-amount-max:hover{ background:rgba(255,255,255,0.12); }
.v29-amount-err{ min-height:16px; margin:8px 2px 14px; font-size:12px; color:#ff5a5a; }

/* ── Mobile ── */
@media (max-width:720px){
  .v29-wallet-balance-row{ gap:18px; }
  .v29-balance-amount{ font-size:26px; }
  .v29-wallet-actions{ flex-direction:column; }
  .v29-wallet-actions .v29-btn{ width:100%; }
}

/* ════════════════════════════════════════════════════════════════
   v29 UPGRADE (2026-05-30) — states, ledger, withdraw summary
   ════════════════════════════════════════════════════════════════ */

/* status chips in the wallet title */
.v29-chip{
  display:inline-flex; align-items:center; gap:5px;
  font-size:9.5px; font-weight:800; letter-spacing:.6px; text-transform:uppercase;
  border-radius:var(--radius-pill); padding:2px 9px; border:1px solid transparent;
}
.v29-chip.ok{ color:var(--neon-green); background:rgba(57,255,20,0.10); border-color:rgba(57,255,20,0.25); }
.v29-chip.pending{ color:#fbbf24; background:rgba(251,191,36,0.10); border-color:rgba(251,191,36,0.28); }
.v29-chip.warn{ color:#ff9f43; background:rgba(255,159,67,0.10); border-color:rgba(255,159,67,0.3); }
.v29-chip-spin{ width:9px; height:9px; border-radius:50%; border:1.5px solid rgba(251,191,36,0.35); border-top-color:#fbbf24; animation:v29spin .7s linear infinite; }
@keyframes v29spin{ to{ transform:rotate(360deg); } }

.v29-wallet-icon.pending{ color:#fbbf24; border-color:rgba(251,191,36,0.25); background:rgba(251,191,36,0.06); }
.v29-wallet-icon.restricted{ color:#ff9f43; border-color:rgba(255,159,67,0.25); background:rgba(255,159,67,0.06); }

.v29-btn-sm{ height:38px; padding:0 16px; font-size:13px; }
.v29-btn-spin{ width:13px; height:13px; border-radius:50%; border:2px solid rgba(0,0,0,0.25); border-top-color:#0b0b0e; animation:v29spin .7s linear infinite; margin-right:8px; }
.v29-min-note{ margin-top:10px; font-size:11px; color:var(--text-lo); text-align:center; }

/* requirements-due banner (restricted state) */
.v29-req-banner{
  margin:16px 0 4px; padding:14px 16px; border-radius:var(--radius-md);
  background:rgba(255,159,67,0.07); border:1px solid rgba(255,159,67,0.22);
}
.v29-req-banner-title{ font-size:13px; font-weight:800; color:#ffb877; margin-bottom:8px; }
.v29-reqs{ list-style:none; margin:0 0 12px; padding:0; display:flex; flex-direction:column; gap:6px; }
.v29-reqs li{ position:relative; padding-left:18px; font-size:12.5px; color:var(--text-mid); }
.v29-reqs li::before{ content:'!'; position:absolute; left:0; top:0; width:14px; height:14px; border-radius:50%; background:rgba(255,159,67,0.18); color:#ffb877; font-size:10px; font-weight:800; display:flex; align-items:center; justify-content:center; }

/* transaction ledger */
.v29-ledger{ margin-top:18px; padding-top:16px; border-top:1px solid var(--border-card); }
.v29-ledger-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.v29-ledger-title{ font-size:11px; font-weight:800; letter-spacing:.7px; text-transform:uppercase; color:var(--text-lo); }
.v29-ledger-all{ background:transparent; border:0; color:var(--text-mid); font-size:11.5px; font-weight:700; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.v29-ledger-all:hover{ color:#fff; }
.v29-ledger-empty{ font-size:12.5px; color:var(--text-lo); line-height:1.5; padding:6px 0; }
.v29-ledger-list{ display:flex; flex-direction:column; }

.v29-txn{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:10px 0; border-bottom:1px solid rgba(255,255,255,0.04); }
.v29-txn:last-child{ border-bottom:0; }
.v29-txn-label{ font-size:13px; font-weight:600; color:var(--text-hi); }
.v29-txn-sub{ font-size:11px; color:var(--text-lo); margin-top:2px; }
.v29-txn-amts{ text-align:right; white-space:nowrap; }
.v29-txn-net{ font-size:14px; font-weight:800; font-variant-numeric:tabular-nums; }
.v29-txn-net.pos{ color:var(--neon-green); }
.v29-txn-net.neg{ color:var(--text-mid); }
.v29-txn-fees{ font-size:10.5px; color:var(--text-lo); margin-top:2px; }

/* withdraw summary rows */
.v29-withdraw-rows{ margin:14px 0 4px; padding:12px 14px; border-radius:var(--radius-md); background:rgba(0,0,0,0.22); border:1px solid var(--border-card); }
.v29-wd-row{ display:flex; align-items:center; justify-content:space-between; font-size:12.5px; color:var(--text-mid); padding:5px 0; }
.v29-wd-val{ color:var(--text-hi); font-weight:600; }
.v29-wd-row.total{ margin-top:4px; padding-top:10px; border-top:1px solid var(--border-card); font-size:14px; }
.v29-wd-row.total .v29-wd-val{ color:var(--neon-green); font-weight:800; font-variant-numeric:tabular-nums; }

/* transactions modal */
.v29-modal.wide{ max-width:520px; }
.v29-txns-scroll{ max-height:60vh; overflow-y:auto; margin-top:4px; }
.v29-txns-scroll .v29-txn{ padding:12px 2px; }