/* ===== PvP ===== */
.pvp-disc{display:flex;align-items:center;justify-content:center;font-size:26px}
.pvp-modal{position:fixed;inset:0;z-index:130;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;padding:12px}
.pvp-modal.pvp-sub{z-index:135}
.pvp-panel{position:relative;width:100%;max-width:520px;max-height:calc(100vh - 24px);overflow-y:auto;background:linear-gradient(180deg,#1a1426,#0e0b16);border:1px solid rgba(245,201,106,.45);border-radius:18px;color:#fde68a;padding:14px}
.pvp-x{position:absolute;right:10px;top:8px;font-size:18px;color:#a1a1aa}
.pvp-h{font-weight:900;font-size:18px;margin:0 0 10px}.pvp-h small{font-size:12px;color:#a1a1aa;margin-left:6px;font-weight:700}
.pvp-tabs{display:flex;gap:6px;align-items:center;margin-bottom:10px}.pvp-tabs button{padding:5px 12px;border-radius:999px;background:#27272a;font-size:13px;font-weight:800;color:#d4d4d8}
.pvp-tabs button.on{background:#f5c96a;color:#111}.pvp-sep{flex:1}
.pvp-stat{display:flex;gap:12px;justify-content:space-between;font-size:13px;color:#e4e4e7;background:rgba(255,255,255,.05);border-radius:12px;padding:8px 10px;margin-bottom:10px}.pvp-stat b{color:#fde68a;font-size:16px}
.pvp-decks{display:flex;flex-direction:column;gap:8px}
.pvp-deck{display:flex;align-items:center;gap:8px;padding:8px;border-radius:14px;background:#17131f;border:1px solid rgba(245,201,106,.25);text-align:left;position:relative}
.pvp-deck:hover{border-color:#f5c96a}.pvp-deck.empty{opacity:.7}
.pvp-deck-no{width:22px;text-align:center;font-weight:900}
.pvp-deck-row{display:flex;gap:4px;flex:1;min-height:60px;align-items:center}
.pvp-plus{font-size:26px;color:#71717a;margin:auto}
.pvp-cost{position:absolute;right:8px;bottom:4px;font-size:10px;color:#a1a1aa}
.pvp-th{position:relative;width:46px;aspect-ratio:3/4;border-radius:8px;overflow:hidden;background:#000;border:2px solid #52525b;flex:none}
.pvp-th img{width:100%;height:100%;object-fit:cover}.pvp-th i{position:absolute;left:0;right:0;bottom:0;font-size:9px;font-style:normal;text-align:center;background:rgba(0,0,0,.65);color:#fff}
/* 등급 색 (전 화면 공통): MR·LR 붉은색 · UR 금색 · SR 보라 · HR 파랑 · R 녹색 · N 회색 */
.g-N{--gc:#9ca3af}.g-R{--gc:#84cc16}.g-HR{--gc:#3b82f6}.g-SR{--gc:#a855f7}.g-UR{--gc:#eab308}.g-MR,.g-LR{--gc:#ef4444}
.pvp-th[class*="g-"]{border-color:var(--gc)}.pvp-th[class*="g-"] i{background:color-mix(in srgb,var(--gc) 70%,#000)}
.pvp-pick button[class*="g-"],.pvp-slot[class*="g-"]{background:color-mix(in srgb,var(--gc) 28%,transparent);padding:3px}
.pvp-fire{position:absolute;top:1px;right:1px;font-size:12px;line-height:1;filter:drop-shadow(0 0 2px #000)}
.pvp-th .pvp-n{z-index:2}
.pvp-deckbar{position:sticky;top:-1px;z-index:6;margin:6px -4px 8px;padding:8px;border-radius:12px;background:rgba(9,9,11,.96);border:1px solid #3f3f46;box-shadow:0 6px 14px rgba(0,0,0,.5)}
.pvp-slots{display:flex;gap:4px}.pvp-slot{position:relative;flex:1;min-width:0;border-radius:9px}.pvp-slot .pvp-th{width:100%}
.pvp-slot.empty{display:flex;align-items:center;justify-content:center;aspect-ratio:3/4;border:2px dashed #52525b;color:#71717a;font-weight:900}
.pvp-dstat{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:6px}
.pvp-pw{font-size:20px;font-weight:900;color:#fbbf24}.pvp-cst{font-size:18px;font-weight:900;color:#a7f3d0}.pvp-cst.over{color:#f87171}
.pvp-dstat [data-auto]{margin-left:auto;padding:6px 10px;font-size:12px}.pvp-dstat [data-ok]{padding:8px 12px;font-size:13px}
.pvp-train{color:#86efac}
.pvp-n{position:absolute;top:2px;right:2px;background:#10b981;color:#000;border-radius:999px;font-size:10px;width:16px;height:16px;display:flex;align-items:center;justify-content:center}
.pvp-acts{display:flex;gap:8px;margin-top:12px}
.pvp-go{flex:1;padding:12px;border-radius:14px;background:linear-gradient(180deg,#fbbf24,#f59e0b);color:#111;font-weight:900;font-size:15px}.pvp-go:disabled{opacity:.4}
.pvp-rank,.pvp-ghost{width:52px;border-radius:14px;background:#27272a;font-size:20px}
.pvp-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}.pvp-chips button{padding:4px 10px;border-radius:999px;background:#27272a;font-size:12px;color:#e4e4e7}
.pvp-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:10px}
.pvp-pick button{padding:0;border-radius:10px}.pvp-pick button .pvp-th{width:100%}.pvp-pick button.on .pvp-th{box-shadow:0 0 0 2px #10b981}.pvp-pick button:disabled{opacity:.3}
.pvp-res{text-align:center;font:900 44px/1 Cinzel,serif;letter-spacing:.08em;margin:6px 0}.pvp-res.win{color:#6ee7b7}.pvp-res.lose{color:#f87171}
.pvp-vs{text-align:center;margin-bottom:8px}.pvp-vs small{color:#a1a1aa;margin-left:6px}
.pvp-round{display:flex;align-items:center;gap:6px;padding:6px;border-radius:12px;background:rgba(255,255,255,.04);margin-bottom:6px}
.pvp-round b{font-size:18px;width:20px;text-align:center}.pvp-round.win b{color:#6ee7b7}.pvp-round.lose b{color:#f87171}
.pvp-side{display:flex;gap:3px;flex:1}.pvp-side.foe{justify-content:flex-end}.pvp-side .pvp-th{flex:1 1 0;width:auto;min-width:0}
.pvp-delta{text-align:center;font-size:16px;margin-top:6px}.pvp-delta.up b{color:#6ee7b7}.pvp-delta.down b{color:#f87171}
.pvp-rk{display:flex;flex-direction:column;gap:4px}
.pvp-rk-row{display:grid;grid-template-columns:34px 1fr auto 52px;gap:6px;align-items:center;padding:6px 8px;border-radius:10px;background:rgba(255,255,255,.04);font-size:13px;color:#e4e4e7}
.pvp-rk-row.me{background:rgba(245,201,106,.18)}.pvp-rk-row em{font-style:normal;font-weight:900;color:#fde68a;text-align:right}.pvp-rk-row small{color:#a1a1aa}
.pvp-empty{text-align:center;color:#a1a1aa;padding:24px 0}
.pvp-toast{position:fixed;left:50%;bottom:80px;transform:translateX(-50%);z-index:200;background:#18181b;border:1px solid #f5c96a;color:#fde68a;padding:8px 14px;border-radius:999px;font-size:13px}
@media (max-width:480px){.pvp-th{width:40px}.pvp-stat{font-size:12px;gap:6px}}
/* 카드 정보 · 저장 확인 · 전투 재생 */
.pvp-modal.pvp-top{z-index:140}
.pvp-ci{width:62%;max-width:240px;margin:4px auto 8px;border-radius:12px;overflow:hidden;aspect-ratio:3/4}
.pvp-ci img{width:100%;height:100%;object-fit:cover;display:block}
.pvp-ci-name{text-align:center;font-weight:800}.pvp-ci-name small{opacity:.7;font-weight:400}
.pvp-ci-st{display:flex;justify-content:center;gap:14px;margin:6px 0;font-size:14px}
.pvp-ci-sk{font-size:12px;max-height:30vh;overflow:auto;color:#f5f5f4}
#pvp-ask .pvp-panel{max-width:280px;text-align:center}
.pvp-pb-top{display:flex;align-items:center;gap:8px;margin-bottom:8px}.pvp-pb-top span{flex:1;font-weight:700}
.pvp-skip{background:#f5c96a;color:#1a1426;border-radius:999px;padding:4px 12px;font-weight:800}
.pvp-pb-side{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.pvp-pb-u{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:3/4;transition:transform .15s,filter .3s;border:2px solid transparent}
.pvp-pb-u img{width:100%;height:100%;object-fit:cover;display:block}
.pvp-pb-u i{position:absolute;left:3px;right:3px;bottom:3px;height:5px;background:rgba(0,0,0,.6);border-radius:3px}
.pvp-pb-u b{display:block;height:100%;background:#4ade80;border-radius:3px;transition:width .3s}
.pvp-pb-side.foe .pvp-pb-u b{background:#f87171}
.pvp-pb-u.act{border-color:#fde68a;transform:scale(1.08)}
.pvp-pb-u.hit{border-color:#ef4444;animation:pvpHit .3s}
.pvp-pb-u.dead{filter:grayscale(1) brightness(.4)}
@keyframes pvpHit{0%,100%{transform:translateX(0)}30%{transform:translateX(-4px)}60%{transform:translateX(4px)}}
.pvp-pb-fx{height:44px;display:flex;align-items:center;justify-content:center;font-weight:800;color:#fde68a}
.pvp-pb-fx.big{font-size:28px}.pvp-pb-fx.win{color:#4ade80}.pvp-pb-fx.lose{color:#f87171}
/* ===== 티어 · 내 랭크 카드 · 연승 · VS (엠블럼은 img/ui/tier/<티어>.webp 가 오면 그림, 없으면 CSS+이모지) ===== */
.pvp-emb{--tc:#a16207;position:relative;display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;flex:none;border-radius:50%;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--tc) 70%,#fff),var(--tc) 55%,#0b0b0f);box-shadow:0 0 0 1px rgba(255,255,255,.25),0 0 8px color-mix(in srgb,var(--tc) 60%,transparent);font-size:14px}
.pvp-emb i{font-style:normal;filter:drop-shadow(0 1px 1px #000)}.pvp-emb img{position:absolute;inset:-12%;width:124%;height:124%;object-fit:contain}
.pvp-emb.sm{width:20px;height:20px;font-size:11px}.pvp-emb.big{width:58px;height:58px;font-size:30px}.pvp-emb.huge{width:110px;height:110px;font-size:58px}
.t-bronze{--tc:#b45309}.t-silver{--tc:#94a3b8}.t-gold{--tc:#eab308}.t-platinum{--tc:#2dd4bf}.t-diamond{--tc:#60a5fa}.t-abyss{--tc:#c026d3}
.pvp-emb.t-abyss,.pvp-me.t-abyss,.pvp-claim.t-abyss{background-image:linear-gradient(90deg,#f87171,#fbbf24,#a3e635,#22d3ee,#818cf8,#e879f9,#f87171);background-size:300% 100%;animation:pvpRain 6s linear infinite}
@keyframes pvpRain{to{background-position:300% 0}}
.pvp-me{display:flex;gap:12px;align-items:center;width:100%;text-align:left;padding:10px 12px;margin-bottom:10px;border-radius:16px;border:1px solid color-mix(in srgb,var(--tc) 60%,transparent);background:linear-gradient(120deg,color-mix(in srgb,var(--tc) 28%,#120e1a),#120e1a 70%);box-shadow:inset 0 0 24px color-mix(in srgb,var(--tc) 18%,transparent)}
.pvp-me.t-abyss{position:relative;border-color:transparent;isolation:isolate}.pvp-me.t-abyss::after{content:'';position:absolute;inset:2px;border-radius:14px;background:rgba(12,8,20,.82);z-index:-1}
.pvp-me-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.pvp-me-top{display:flex;align-items:baseline;gap:8px}.pvp-me-tier{font-weight:900;font-size:16px;color:color-mix(in srgb,var(--tc) 55%,#fff)}.pvp-me-rt{font:900 22px/1 Cinzel,serif;color:#fde68a}
.pvp-bar{height:7px;border-radius:999px;background:rgba(255,255,255,.1);overflow:hidden}.pvp-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--tc),color-mix(in srgb,var(--tc) 40%,#fff))}
.pvp-me-sub{display:flex;gap:10px;font-size:11px;color:#d4d4d8;flex-wrap:wrap}.pvp-dd{margin-left:auto;color:#a1a1aa}
.pvp-streak{display:inline-flex;align-items:center;padding:1px 8px;border-radius:999px;background:linear-gradient(180deg,#f97316,#b91c1c);color:#fff;font-weight:900;font-size:12px;box-shadow:0 0 10px rgba(249,115,22,.6);animation:pvpFire 1.2s ease-in-out infinite alternate}
.pvp-streak.big{font-size:18px;padding:3px 14px}@keyframes pvpFire{to{box-shadow:0 0 18px rgba(249,115,22,.9)}}
.pvp-res-streak{display:flex;gap:8px;align-items:center;justify-content:center;margin:4px 0 8px}
.pvp-rw{display:flex;gap:8px;flex-wrap:wrap;font-weight:800;font-size:13px}.pvp-rw.big{justify-content:center;font-size:18px;margin-top:10px}.pvp-ttl{color:#f0abfc}
.pvp-tt{display:flex;flex-direction:column;gap:5px}.pvp-tt-row{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:10px;background:rgba(255,255,255,.04)}
.pvp-tt-row b{width:62px}.pvp-tt-row small{width:44px;color:#a1a1aa}.pvp-tt-row .pvp-rw{margin-left:auto}.pvp-tt-row.on{box-shadow:0 0 0 1px var(--tc);background:color-mix(in srgb,var(--tc) 18%,transparent)}.pvp-tt-row.got{opacity:.55}
.pvp-h2{margin-top:12px}
.pvp-rk-row .pvp-emb{margin-right:2px}.pvp-abyss-name{background:linear-gradient(90deg,#f87171,#fbbf24,#a3e635,#22d3ee,#818cf8,#e879f9,#f87171) 0 0/300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:pvpRain 6s linear infinite;font-weight:900}
.pvp-claim{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px;border-radius:16px}.pvp-claim-t{font-weight:900;font-size:22px}
.pvp-vs{display:flex;align-items:center;justify-content:center;gap:6px}
.pvp-vsx{position:fixed;inset:0;z-index:140;background:#07050b;overflow:hidden;cursor:pointer}
.pvp-vsx-side{position:absolute;top:0;bottom:0;width:62%;overflow:hidden}
.pvp-vsx-side img{width:100%;height:100%;object-fit:cover;object-position:top;filter:saturate(1.1)}
.pvp-vsx-side.me{left:0;clip-path:polygon(0 0,100% 0,62% 100%,0 100%);animation:vsL .35s cubic-bezier(.2,.9,.2,1) both}
.pvp-vsx-side.op{right:0;clip-path:polygon(38% 0,100% 0,100% 100%,0 100%);animation:vsR .35s cubic-bezier(.2,.9,.2,1) both}
.pvp-vsx-side.me::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(59,130,246,.35),transparent 60%)}
.pvp-vsx-side.op::after{content:'';position:absolute;inset:0;background:linear-gradient(270deg,rgba(239,68,68,.4),transparent 60%)}
.pvp-vsx-tag{position:absolute;bottom:9%;z-index:2;display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:12px;background:rgba(0,0,0,.65);color:#fff}
.pvp-vsx-side.me .pvp-vsx-tag{left:5%}.pvp-vsx-side.op .pvp-vsx-tag{right:5%}.pvp-vsx-tag b{font-weight:900}.pvp-vsx-tag small{color:#fde68a;font-weight:800}
.pvp-vsx-vs{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font:900 clamp(56px,14vw,140px)/1 Cinzel,serif;color:#fff;text-shadow:0 0 24px #f59e0b,0 0 4px #000,0 4px 0 #7c2d12;animation:vsPop .45s .2s cubic-bezier(.2,1.6,.4,1) both;z-index:3}
.pvp-vsx.out{opacity:0;transition:opacity .18s}
@keyframes vsL{from{transform:translateX(-100%)}}@keyframes vsR{from{transform:translateX(100%)}}@keyframes vsPop{from{transform:translate(-50%,-50%) scale(2.6);opacity:0}}
@media (prefers-reduced-motion:reduce){.pvp-emb.t-abyss,.pvp-me.t-abyss,.pvp-claim.t-abyss,.pvp-abyss-name,.pvp-streak{animation:none}}
.pvp-rk-nm{display:flex;align-items:center;gap:6px;min-width:0}.pvp-rk-nm>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 티어 엠블럼 그림 (img/ui/tier/*.webp, 그림순이): 그림이 있으면 원형 대체 배경·이모지 숨김 */
.pvp-emb:has(img){background:none!important;box-shadow:none;animation:none}
.pvp-emb:has(img) i{display:none}
.pvp-emb img{inset:-8%;width:116%;height:116%;object-fit:contain;filter:drop-shadow(0 2px 3px rgba(0,0,0,.7))}
.pvp-emb.t-abyss img{filter:drop-shadow(0 0 6px rgba(232,121,249,.7)) drop-shadow(0 2px 3px rgba(0,0,0,.7))}
.pvp-acts.yn>button{flex:1;width:auto;padding:12px;font-size:16px;font-weight:900}

/* 랭커 정보 팝업 */
.pvp-rk-row.tap{cursor:pointer}.pvp-rk-row.tap:active{filter:brightness(1.3)}
.pvp-who-top{display:flex;gap:12px;align-items:center;margin:4px 0 12px}
.pvp-who-face{width:72px;height:72px;border-radius:50%;overflow:hidden;border:3px solid #f5c96a;flex:none;background:#222;display:grid;place-items:center;font-size:30px}
.pvp-who-face img{width:100%;height:100%;object-fit:cover;object-position:top}
.pvp-who-m{display:flex;flex-direction:column;gap:3px;min-width:0}.pvp-who-m b{font-size:18px;color:#fff}.pvp-who-m small{color:#fde68a;font-weight:700}
.pvp-who-g{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:#e4e4e7;background:rgba(255,255,255,.07);padding:3px 9px 3px 4px;border-radius:999px;width:max-content}
.pvp-who-g img{width:22px;height:22px;border-radius:50%}.pvp-who-g.none{color:#a1a1aa;padding:3px 9px}
.pvp-who-h{font-size:13px;font-weight:800;color:#d4d4d8;margin:6px 0}
.pvp-who-deck{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:6px}
.pvp-sort button{border:1px solid transparent;cursor:pointer;font-size:11px;padding:3px 9px}.pvp-sort button.on{background:#065f46;border-color:#34d399;color:#fff}

/* 보스리그 덱: 리더 → 멤버 → 확인 */
.pvp-steps{display:flex;gap:6px;margin:6px 0}.pvp-steps button{flex:1;padding:6px;border-radius:10px;background:rgba(255,255,255,.06);font-weight:800;font-size:12px}
.pvp-steps .on{background:#f5c96a;color:#111}.pvp-steps button:disabled{opacity:.4}
.pvp-sec{margin:10px 0 4px;font-size:12px;font-weight:800;opacity:.8}.pvp-lead{justify-content:center}
.pvp-empty{padding:16px;opacity:.6;font-size:13px;text-align:center}
.pvp-panel .pvp-ghost{width:auto;min-width:52px;padding:0 12px;white-space:nowrap;font-size:14px;font-weight:800}.pvp-panel .pvp-ghost[data-del]{font-size:20px;padding:0}
.pvp-dstat [data-auto]{white-space:nowrap;min-height:36px}

/* 전투 화면 SKIP (PvP·구역 전쟁·토벌) */
#vb-skip{position:fixed;left:10px;right:auto;top:calc(env(safe-area-inset-top) + 14px);bottom:auto;transform:none;margin:0;z-index:70;padding:6px 12px;border-radius:999px;background:rgba(24,24,27,.85);border:1.5px solid #fbbf24;color:#fde68a;font-weight:900;font-size:13px;box-shadow:0 2px 8px rgba(0,0,0,.5)}
#vb-skip:disabled{opacity:.7}
/* SKIP: 오른쪽 위 AUTO 왼쪽에 나란히 (#top-bar 안) */
#top-bar > #vb-skip{position:static;top:auto;left:auto;transform:none;flex-shrink:0;height:40px;padding:0 12px;z-index:auto;white-space:nowrap}

/* Feedback: controls belong with matchmaking, not the saved deck. */
.pvp-bmode{margin-top:24px;padding-top:8px}.pvp-bmode + .pvp-acts{margin-top:8px}
.pvp-filters{display:flex;align-items:center;gap:10px;margin:12px 0;flex-wrap:wrap}
.pvp-filters input{min-width:0;background:#27272a;color:#fff;border:1px solid #52525b;border-radius:10px;padding:9px 10px;font-size:14px}
.pvp-filters input[type="search"]{flex:1 1 150px;width:150px}.pvp-filters label{display:flex;align-items:center;gap:6px;font-size:14px}.pvp-filters input[type="number"]{width:76px}
.pvp-card-cost,.pvp-card-name{display:block;font-size:13px;line-height:1.4;color:#fef3c7;text-align:center;padding-top:3px}
.pvp-card-name{color:#e4e4e7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pvp-pick>button{min-width:0}.pvp-pick .pvp-th i{font-size:12px}.pvp-sort button{font-size:13px;padding:6px 10px}
.pvp-round-boss{display:flex;flex-direction:column;align-items:stretch;gap:16px;padding:12px}
.pvp-result-side{min-width:0}.pvp-result-side strong{display:block;font-size:15px;margin-bottom:6px}
.pvp-round-boss .pvp-side{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}
.pvp-round-boss .pvp-side .pvp-th{width:100%}