/* BIGWINNER — 입금 방식 선택 시트 (bw_deposit) 20260820
   모놀리식 본문에 인라인 금지. index.html / app.html 은 <link> 한 줄로만 연결한다. */

.bwdep-ov{position:fixed; inset:0; z-index:9998;
  background:rgba(6,8,12,.62);
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
  opacity:0; pointer-events:none; transition:opacity .24s ease}
.bwdep-ov.on{opacity:1; pointer-events:auto}

.bwdep-sheet{position:fixed; z-index:9999; top:0; left:0; right:0; margin:0 auto;
  width:100%; max-width:520px; padding:0 12px;
  opacity:0; transform:translateY(-18px); pointer-events:none;
  transition:opacity .26s ease, transform .26s cubic-bezier(.22,.9,.28,1)}
.bwdep-sheet.on{opacity:1; transform:translateY(0); pointer-events:auto}

.bwdep-panel{position:relative; overflow:hidden;
  border-radius:16px; padding:13px 14px 14px;
  background:linear-gradient(160deg,#15171F,#101218 72%);
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 0 0 1px rgba(201,162,78,.10), 0 18px 44px rgba(0,0,0,.62);
  font-family:'Pretendard',-apple-system,BlinkMacSystemFont,sans-serif;
  color:#E8EAF0}
.bwdep-panel::before{content:''; position:absolute; left:0; right:0; top:0; height:2px;
  background:linear-gradient(90deg,transparent,#C9A24E,transparent); opacity:.85}

/* ── 머리줄 ── */
.bwdep-hd{display:flex; align-items:center; justify-content:space-between; gap:10px}
.bwdep-hd .ttl{display:flex; align-items:center; gap:8px; min-width:0}
.bwdep-hd .ttl i{flex:none; width:24px; height:24px; border-radius:8px; font-style:normal;
  display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:800; color:#F3B24A;
  background:linear-gradient(160deg,rgba(201,162,78,.20),rgba(201,162,78,.06));
  border:1px solid rgba(201,162,78,.32)}
.bwdep-hd .ttl b{font-size:14px; font-weight:800; letter-spacing:.01em; white-space:nowrap}
.bwdep-x{flex:none; width:28px; height:28px; border:1px solid rgba(255,255,255,.10);
  border-radius:9px; cursor:pointer; color:#8B92A0;
  background:rgba(255,255,255,.04);
  display:flex; align-items:center; justify-content:center;
  transition:color .18s, border-color .18s, background .18s}
.bwdep-x svg{width:14px; height:14px}
.bwdep-x:hover{color:#E8EAF0; border-color:rgba(255,255,255,.2)}
.bwdep-x:active{transform:scale(.94)}

.bwdep-lead{margin:11px 0 9px; font-size:11px; font-weight:600; color:#7A808C; letter-spacing:.01em}

/* ── 선택 버튼 두 개 ── */
.bwdep-opt{display:flex; align-items:center; gap:11px; width:100%;
  padding:12px 12px; margin-bottom:9px; cursor:pointer; text-align:left;
  border-radius:13px; border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(160deg,#1D2129,#12151B); color:#E8EAF0;
  box-shadow:0 5px 14px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.05);
  transition:transform .18s, border-color .2s, box-shadow .2s}
.bwdep-opt:last-child{margin-bottom:0}
.bwdep-opt:active{transform:scale(.985)}
.bwdep-opt .ic{flex:none; width:38px; height:38px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(160deg,#20242D,#14171E)}
.bwdep-opt .ic svg{width:18px; height:18px}
.bwdep-opt .tx{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px}
.bwdep-opt .tx b{font-size:13.5px; font-weight:800; letter-spacing:.01em}
.bwdep-opt .tx span{font-size:10.5px; color:#7A808C; font-weight:600;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.bwdep-opt .ar{flex:none; color:#5F6674; display:flex}
.bwdep-opt .ar svg{width:15px; height:15px}

.bwdep-opt.bank{border-color:rgba(201,162,78,.42)}
.bwdep-opt.bank .ic{border-color:rgba(201,162,78,.5)}
.bwdep-opt.bank .ic svg{stroke:#C9A24E}
.bwdep-opt.bank:hover{border-color:rgba(243,178,74,.7); box-shadow:0 6px 18px rgba(0,0,0,.45), 0 0 0 1px rgba(201,162,78,.16)}

.bwdep-opt.coin{border-color:rgba(61,214,140,.5)}
.bwdep-opt.coin .ic{border-color:rgba(61,214,140,.5)}
.bwdep-opt.coin .ic svg{stroke:#3DD68C}
.bwdep-opt.coin:hover{border-color:rgba(61,214,140,.78); box-shadow:0 6px 18px rgba(0,0,0,.45), 0 0 0 1px rgba(61,214,140,.14)}

/* ── 은행 안내 ── */
.bwdep-note{margin-top:11px; padding:14px 13px; border-radius:12px;
  border:1px dashed rgba(201,162,78,.38); background:rgba(201,162,78,.05);
  font-size:12px; font-weight:700; line-height:1.65; color:#B8A87E; text-align:center}
.bwdep-note small{display:block; margin-top:5px; font-size:10.5px; font-weight:600; color:#7A808C}

.bwdep-kv{margin-top:11px; border-radius:12px; overflow:hidden;
  border:1px solid rgba(255,255,255,.07); background:rgba(255,255,255,.02)}
.bwdep-kv .row{display:flex; align-items:center; gap:10px; padding:11px 12px;
  border-bottom:1px solid rgba(255,255,255,.05)}
.bwdep-kv .row:last-child{border-bottom:0}
.bwdep-kv .k{flex:none; width:62px; font-size:10.5px; font-weight:700; color:#7A808C}
.bwdep-kv .v{flex:1; min-width:0; font-size:13px; font-weight:800; letter-spacing:.01em;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.bwdep-kv .v.mono{font-family:ui-monospace,Menlo,Consolas,monospace; color:#F3B24A}
.bwdep-cp{flex:none; height:26px; padding:0 9px; cursor:pointer;
  display:flex; align-items:center; gap:5px;
  border-radius:8px; border:1px solid rgba(201,162,78,.4);
  background:rgba(201,162,78,.10); color:#C9A24E;
  font-size:10.5px; font-weight:800; font-family:inherit}
.bwdep-cp svg{width:11px; height:11px}
.bwdep-cp:active{transform:scale(.95)}

.bwdep-memo{margin-top:9px; padding:10px 12px; border-radius:11px;
  border:1px solid rgba(255,255,255,.06); background:rgba(255,255,255,.02);
  font-size:11px; font-weight:600; line-height:1.6; color:#9AA1AE}

.bwdep-msg{min-height:15px; margin-top:8px; text-align:center;
  font-size:11px; font-weight:700; color:#3DD68C;
  opacity:0; transition:opacity .18s ease}
.bwdep-msg.on{opacity:1}

.bwdep-back{display:flex; align-items:center; justify-content:center; gap:6px;
  width:100%; margin-top:10px; padding:10px; cursor:pointer;
  border-radius:11px; border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.03); color:#8B92A0;
  font-size:11.5px; font-weight:800; font-family:inherit;
  transition:color .18s, border-color .18s}
.bwdep-back svg{width:13px; height:13px}
.bwdep-back:hover{color:#E8EAF0; border-color:rgba(255,255,255,.18)}
.bwdep-back:active{transform:scale(.985)}

@media (max-width:360px){
  .bwdep-opt .tx b{font-size:12.5px}
  .bwdep-kv .v{font-size:12px}
}
@media (prefers-reduced-motion:reduce){
  .bwdep-ov, .bwdep-sheet{transition:none}
}