/* ===========================================================
   HISTORY V2 — Frenzy96 player transaction history (2026-05-30)
   Card-stats design. Mounts into #modal-history. Vanilla, English-only, $.
   =========================================================== */
.hs-v2 .modal, .hs-v2 .auth-card { background:transparent !important; box-shadow:none !important; border:0 !important; padding:0 !important; margin:0 !important; max-width:100% !important; width:100% !important; box-sizing:border-box; }
#modal-history.hs-v2 { align-items:flex-end !important; padding:0 !important; }

.hsw {
  --hs-bg:#0b0c10; --hs-surface:#141620; --hs-surface2:#0f1117; --hs-border:#1e2028; --hs-border2:#1a1c24;
  --hs-green:#2dc98a; --hs-green-bg:#0d1a10; --hs-red:#e84040; --hs-red-bg:#200f0f;
  --hs-gold:#e8a124; --hs-gold-bg:#1f1a0d; --hs-blue:#4a8ee8; --hs-blue-bg:#0d1520;
  --hs-purple:#9070e8; --hs-purple-bg:#130e22;
  --hs-text:#eee; --hs-text2:#aaa; --hs-text3:#555; --hs-text4:#3a3e4d;
  background:var(--hs-bg); color:var(--hs-text); width:100%; max-width:100%; box-sizing:border-box;
  border-radius:18px 18px 0 0; overflow:hidden; display:flex; flex-direction:column; max-height:92vh;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}
.hs-mono { font-family:"JetBrains Mono",ui-monospace,monospace; font-variant-numeric:tabular-nums; }

/* header */
.hs-hd { display:flex; align-items:center; gap:10px; padding:14px 16px 12px; border-bottom:1px solid var(--hs-border2); flex:0 0 auto; }
.hs-back { width:28px; height:28px; flex:0 0 28px; border-radius:8px; border:1px solid var(--hs-border); background:#151720; color:var(--hs-text); display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0; }
.hs-back svg { width:18px; height:18px; }
.hs-title { font-size:14px; font-weight:600; flex:1; }

/* stats 3-cell */
.hs-stats { display:grid; grid-template-columns:1fr 1fr 1fr; border-bottom:1px solid var(--hs-border2); flex:0 0 auto; }
.hs-stat { padding:11px 6px; text-align:center; border-right:1px solid var(--hs-border2); }
.hs-stat:last-child { border-right:0; }
.hs-stat__v { font-size:12px; font-weight:700; }
.hs-stat__l { font-size:8px; color:var(--hs-text3); text-transform:uppercase; letter-spacing:.4px; margin-top:3px; }

/* filter row */
.hs-filter { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; padding:10px 14px; border-bottom:1px solid var(--hs-border2); flex:0 0 auto; }
.hs-fbtn { padding:7px 4px; border-radius:7px; border:1px solid var(--hs-border); background:var(--hs-surface); color:#666; font-size:10px; font-weight:600; cursor:pointer; text-align:center; }
.hs-fbtn.on-all { border-color:var(--hs-gold); background:var(--hs-gold-bg); color:var(--hs-gold); }
.hs-fbtn.on-deposit { border-color:var(--hs-green); background:var(--hs-green-bg); color:var(--hs-green); }
.hs-fbtn.on-withdraw { border-color:var(--hs-red); background:var(--hs-red-bg); color:var(--hs-red); }
.hs-fbtn.on-bonus { border-color:var(--hs-purple); background:var(--hs-purple-bg); color:var(--hs-purple); }

/* list */
.hs-list { flex:1 1 auto; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:10px 14px calc(14px + env(safe-area-inset-bottom)); }
.hs-card { display:flex; align-items:center; gap:12px; background:var(--hs-surface); border:1px solid var(--hs-border); border-radius:11px; padding:12px; margin-bottom:7px; cursor:pointer; }
.hs-card:active { transform:scale(.995); }
.hs-ic { width:38px; height:38px; flex:0 0 38px; border-radius:11px; display:flex; align-items:center; justify-content:center; }
.hs-ic svg { width:20px; height:20px; }
.hs-mid { flex:1; min-width:0; }
.hs-mid__t { font-size:12px; font-weight:600; color:var(--hs-text); }
.hs-mid__s { font-size:10px; color:var(--hs-text4); margin-top:3px; }
.hs-right { text-align:right; flex:0 0 auto; }
.hs-amt { font-size:14px; font-weight:700; }
.hs-amt.pos { color:var(--hs-green); }
.hs-amt.neg { color:var(--hs-red); }
.hs-badge { display:inline-block; margin-top:4px; padding:2px 8px; border-radius:20px; font-size:8px; font-weight:700; }
.hs-badge.completed { background:var(--hs-green-bg); color:var(--hs-green); }
.hs-badge.rejected { background:var(--hs-red-bg); color:var(--hs-red); }
.hs-badge.pending { background:var(--hs-gold-bg); color:var(--hs-gold); }
.hs-badge.processing { background:var(--hs-blue-bg); color:var(--hs-blue); }

/* empty / load-more / skeleton */
.hs-empty { text-align:center; padding:50px 16px; }
.hs-empty svg { width:32px; height:32px; color:var(--hs-text4); }
.hs-empty__t { font-size:12px; color:var(--hs-text3); margin-top:10px; }
.hs-more { width:100%; padding:11px; border:1px solid var(--hs-border); background:transparent; color:#888; border-radius:8px; font-size:12px; font-weight:600; cursor:pointer; margin-top:4px; }
.hs-allloaded { text-align:center; font-size:10px; color:var(--hs-text4); padding:10px 0; }
.hs-sk { height:62px; border-radius:11px; margin-bottom:7px; background:linear-gradient(90deg,#141620 25%,#1c1f2a 37%,#141620 63%); background-size:400% 100%; animation:hs-shim 1.4s ease infinite; }
@keyframes hs-shim { 0%{background-position:100% 0;} 100%{background-position:0 0;} }
.hs-retry { text-align:center; padding:40px 16px; }
.hs-retry button { margin-top:12px; background:var(--hs-gold); color:#0b0c10; border:0; border-radius:9px; padding:10px 20px; font-size:13px; font-weight:700; cursor:pointer; }

/* detail sheet */
.hs-sov { position:fixed; inset:0; z-index:100000; background:rgba(0,0,0,.6); opacity:0; transition:opacity .2s; display:flex; align-items:flex-end; }
.hs-sov.on { opacity:1; }
.hs-sheet { width:100%; max-width:560px; margin:0 auto; background:#111318; border-top:1px solid var(--hs-border); border-radius:18px 18px 0 0; transform:translateY(100%); transition:transform .3s ease-out; max-height:88vh; display:flex; flex-direction:column; box-sizing:border-box; }
.hs-sov.on .hs-sheet { transform:translateY(0); }
.hs-grab { width:32px; height:3px; border-radius:3px; background:#2a2d38; margin:8px auto 12px; flex:0 0 auto; }
.hs-sh-head { display:flex; align-items:center; gap:10px; padding:0 18px 12px; flex:0 0 auto; }
.hs-sh-title { font-size:13px; font-weight:600; flex:1; }
.hs-sh-x { width:28px; height:28px; border-radius:8px; border:0; background:#151720; color:var(--hs-text2); display:flex; align-items:center; justify-content:center; cursor:pointer; }
.hs-sh-x svg { width:16px; height:16px; }
.hs-sh-body { flex:1 1 auto; overflow-y:auto; padding:0 18px; }
.hs-drow { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid var(--hs-border2); font-size:12px; }
.hs-drow:last-child { border-bottom:0; }
.hs-drow .k { color:var(--hs-text3); font-size:10px; flex:0 0 auto; }
.hs-drow .v { color:var(--hs-text); font-weight:600; text-align:right; word-break:break-word; }
.hs-copy { background:none; border:0; color:var(--hs-text3); cursor:pointer; padding:2px; display:inline-flex; }
.hs-copy svg { width:14px; height:14px; }
.hs-sh-foot { flex:0 0 auto; padding:12px 18px calc(16px + env(safe-area-inset-bottom)); border-top:1px solid var(--hs-border); }
.hs-close-btn { width:100%; padding:13px; border-radius:11px; border:1px solid var(--hs-border); background:var(--hs-surface); color:var(--hs-text); font-size:13px; font-weight:600; cursor:pointer; }

.hs-toast { position:fixed; left:50%; transform:translateX(-50%); bottom:96px; z-index:100001; color:#fff; padding:11px 18px; border-radius:10px; font-size:13px; font-weight:600; box-shadow:0 8px 28px rgba(0,0,0,.4); }

/* Hide legacy modal-history content (old loadHistory UI) — only the new .hsw shows */
#modal-history .modal > *:not(.hsw) { display:none !important; }