/* 포커·고스톱 «1인칭 시점» (body.pov) — 홀덤 1인칭(povview.js)과 같은 무대: 라운지 조명 · 관중 · 건너편에 상반신 캐릭터 · 원근 펠트
   DOM 화면(kpoker · gostop)은 자리 명패(.seat / .opp) 위에 캐릭터(.pvAva)를 세우고, 판 전체를 #pvZoom 으로 감싸 카메라 줌을 준다 (povdom.js) */

/* ── 무대 배경 (판이 열린 동안) ── */
body.pov.pkPlaying #table,body.pov.gsPlaying #table{background:
  radial-gradient(ellipse 60% 45% at 22% -6%, rgba(255,214,138,.22), rgba(255,120,80,.05) 45%, transparent 70%),
  radial-gradient(ellipse 60% 45% at 78% -6%, rgba(255,214,138,.22), rgba(255,120,80,.05) 45%, transparent 70%),
  linear-gradient(180deg,#07060A 0%,#160D12 45%,#09070B 100%)}
body.pov.pkPlaying #table::before,body.pov.gsPlaying #table::before{display:none}
.pvCrowd{position:absolute!important;left:0;right:0;top:0;z-index:0!important;pointer-events:none;z-index:0;overflow:hidden;opacity:.95}
.pvCrowd i{position:absolute;bottom:0;width:44px;height:74px;background:
  radial-gradient(circle at 50% 22%, rgba(22,16,22,.95) 0 15px, transparent 16px),
  radial-gradient(ellipse 50% 40% at 50% 100%, rgba(22,16,22,.95) 0 100%, transparent 101%);
  animation:pvSway 3.2s ease-in-out infinite alternate;transform-origin:50% 100%}
.pvCrowd i.b{width:36px;height:60px;opacity:.75;bottom:22px;background:
  radial-gradient(circle at 50% 22%, rgba(14,10,16,.95) 0 12px, transparent 13px),
  radial-gradient(ellipse 50% 40% at 50% 100%, rgba(14,10,16,.95) 0 100%, transparent 101%)}
.pvCrowd.cheer i{animation:pvJump .32s ease-in-out infinite alternate}
@keyframes pvSway{from{transform:translateX(-3px) rotate(-1.5deg)}to{transform:translateX(3px) rotate(1.5deg)}}
@keyframes pvJump{from{transform:translateY(0)}to{transform:translateY(-14px)}}
.pvLamp{position:absolute;top:0;width:52px;height:10px;border-radius:0 0 26px 26px;background:#F3DFA6;box-shadow:0 0 30px 14px rgba(255,214,138,.35);pointer-events:none;z-index:0}
.pvLamp.l{left:22%} .pvLamp.r{left:78%}

/* ── 카메라 줌 · 순서(자리 줄이 맨 위, 그 아래 제목·옵션·팟) ── */
#pvZoom{transform-origin:50% 40%;transition:transform .9s cubic-bezier(.2,.8,.2,1);will-change:transform}
body.pov #pvZoom{display:flex;flex-direction:column;position:relative;z-index:1}
body.pov #pvZoom > *{width:100%}
body.pov.pkPlaying .pkStage,body.pov.gsPlaying #opps{order:-1}
body.pov.pkPlaying #tableTitle,body.pov.gsPlaying #tableTitle{display:none}
.pvCrowd{height:calc(58px + var(--pvw,150px) * 0.92)}

/* 위에서 보기(body.pov 없음)로 바꾸면 남아 있던 캐릭터·관중·조명은 숨긴다 */
body:not(.pov) .pvAva,body:not(.pov) .pvCrowd,body:not(.pov) .pvLamp,body:not(.pov) .pvTaunt{display:none!important}

/* ── 자리 위 캐릭터 ── */
.pvAva{position:absolute;left:50%;bottom:calc(100% - 6px);transform:translateX(-50%);width:var(--pvw,150px);height:calc(var(--pvw,150px) * 1.12);pointer-events:none;z-index:0;
  -webkit-mask-image:radial-gradient(ellipse 48% 62% at 50% 46%, #000 58%, transparent 100%);mask-image:radial-gradient(ellipse 48% 62% at 50% 46%, #000 58%, transparent 100%);
  filter:drop-shadow(0 10px 16px rgba(0,0,0,.6));transition:transform .35s cubic-bezier(.2,.8,.2,1),filter .35s;animation:pvBreathe 3.4s ease-in-out infinite}
.pvAva img{width:100%;height:auto;display:block;object-fit:cover;object-position:top}
@keyframes pvBreathe{0%,100%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.012)}}
body.pov .seat.folded .pvAva,body.pov .opp.out .pvAva{filter:grayscale(.7) brightness(.55) drop-shadow(0 10px 16px rgba(0,0,0,.6));transform:translateX(-50%) translateY(8px) rotate(2deg);animation:none}
body.pov .seat.turn .pvAva::after,body.pov .opp.turn .pvAva::after{content:'';position:absolute;inset:-10% -20% 20% -20%;background:radial-gradient(ellipse 50% 60% at 50% 45%, rgba(255,200,90,.35), transparent 70%);z-index:-1}
/* 리액션 */
.pvAva.react-raise{animation:pvLean .9s ease-out 1} .pvAva.react-allin{animation:pvSlam 1.1s ease-out 1}
.pvAva.react-fold{animation:pvDroop 1s ease-out 1} .pvAva.react-win{animation:pvWin 1.2s ease-in-out 2} .pvAva.react-ouch{animation:pvShiver .6s ease-in-out 1}
@keyframes pvLean{0%{transform:translateX(-50%) scale(1)}35%{transform:translateX(-50%) translateY(10px) scale(1.1)}100%{transform:translateX(-50%) scale(1)}}
@keyframes pvSlam{0%{transform:translateX(-50%) scale(1)}20%{transform:translateX(-50%) translateY(-18px) scale(1.14)}45%{transform:translateX(-50%) translateY(14px) scale(1.1)}100%{transform:translateX(-50%) scale(1)}}
@keyframes pvDroop{0%{transform:translateX(-50%)}100%{transform:translateX(-50%) translateY(8px) rotate(2deg)}}
@keyframes pvWin{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-22px) scale(1.06)}}
@keyframes pvShiver{0%,100%{transform:translateX(-50%)}25%{transform:translateX(calc(-50% - 6px)) rotate(-2deg)}75%{transform:translateX(calc(-50% + 6px)) rotate(2deg)}}

/* ── 포커: 자리 줄이 테이블 건너편이 된다 ── */
body.pov.pkPlaying .pkStage{perspective:none;margin:calc(var(--pvw,150px) * 0.92) auto 12px}
body.pov.pkPlaying #seats{transform:none;align-items:flex-end;gap:10px 12px;padding:14px 16px 20px;min-height:0;border-radius:0 0 60px 60px / 0 0 40px 40px;border-width:0 6px 8px;border-color:#221A1E;
  background:linear-gradient(180deg,#242433 0%,#17171F 60%,#0F0F15 100%);box-shadow:0 0 0 2px rgba(216,179,106,.45),0 30px 50px rgba(0,0,0,.6),inset 0 12px 40px rgba(0,0,0,.4)}
body.pov.pkPlaying #seats::before{content:'';position:absolute;left:-6px;right:-6px;top:-8px;height:8px;border-radius:4px;background:linear-gradient(180deg,#2A2226,#0B0A0D);box-shadow:0 -1px 0 rgba(255,42,60,.9),0 -4px 22px rgba(255,42,60,.55);color:transparent;letter-spacing:0;font-size:0}
body.pov.pkPlaying #seats::after{display:none}
body.pov.pkPlaying #pkDeck{display:none}
body.pov.pkPlaying .seat{flex:0 1 200px;transform:none;overflow:visible}
body.pov.pkPlaying .seat.turn{transform:none}
body.pov.pkPlaying .seat.me{flex:0 0 auto;align-self:flex-end;font-size:12px;padding:6px 10px;opacity:.9;order:99}
body.pov.pkPlaying .seat.me .pvAva{display:none}
body.pov.pkPlaying #myBox{background:rgba(12,10,16,.9)}
@media (max-width:640px){
  body.pov.pkPlaying .pkStage{margin-top:calc(var(--pvw,90px) * 0.92)}
  body.pov.pkPlaying #seats{gap:6px;padding:10px 6px 12px;flex-wrap:nowrap;overflow:visible}
  body.pov.pkPlaying .seat{flex:1 1 0;min-width:0;padding:5px 6px}
  body.pov.pkPlaying .seat .sh{font-size:11px;gap:2px 4px} body.pov.pkPlaying .seat .sh b{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  body.pov.pkPlaying .seat .mn{margin-left:0;font-size:11px}
  body.pov.pkPlaying .seat .cards{gap:2px} body.pov.pkPlaying .pc.sm{width:22px;height:32px;padding:2px 2px} body.pov.pkPlaying .pc.sm .r,body.pov.pkPlaying .pc.sm .s{font-size:10px}
  body.pov.pkPlaying .seat .oh{display:none}
  body.pov.pkPlaying .seat.me{order:99;flex:0 0 auto;opacity:1;max-width:38%}
  body.pov.pkPlaying .seat.me .cards{display:none}   /* 내 카드는 아래 큰 부채꼴에 있다 */
}

/* ── 고스톱: 상대 명패 위에 캐릭터, 바닥 판은 그 아래 ── */
body.pov.gsPlaying #opps{margin-top:calc(var(--pvw,150px) * 0.92);align-items:flex-end;justify-content:center}
body.pov.gsPlaying .opp{overflow:visible;flex:0 1 260px}
body.pov.gsPlaying .opp.me{flex:0 0 auto;order:99;opacity:.9;font-size:12px}
body.pov.gsPlaying .opp.me .pvAva{display:none}
body.pov.gsPlaying #board{border-radius:26px}
@media (max-width:640px){
  body.pov.gsPlaying #opps{margin-top:calc(var(--pvw,90px) * 0.92);flex-wrap:nowrap;gap:6px}
  body.pov.gsPlaying .opp{flex:1 1 0;min-width:0;padding:5px 6px}
  body.pov.gsPlaying .opp.me{order:99;flex:0 0 auto;opacity:1;max-width:42%}
  body.pov.gsPlaying .opp.me .oh > .muted{display:none}
  body.pov.gsPlaying .opp .oh{font-size:11px;gap:2px 4px} body.pov.gsPlaying .opp .oh b{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  body.pov.gsPlaying .opp .oh > .muted{font-size:10.5px;letter-spacing:-.02em}   /* 점수·손패 장수는 남긴다 — 고박 판단에 필요 */
}

/* ── 도발 말풍선 ── */
.pvTaunt{position:fixed;z-index:83;pointer-events:none;transform:translate(-50%,-100%);background:rgba(30,24,32,.96);color:#F3DFA6;border:1px solid rgba(216,179,106,.6);border-radius:14px;padding:7px 12px;font:800 13px/1.2 inherit;white-space:nowrap;box-shadow:0 8px 18px rgba(0,0,0,.5);animation:pvTaunt 2.1s ease-out forwards}
.pvTaunt::after{content:'';position:absolute;left:50%;bottom:-6px;width:10px;height:10px;background:inherit;border-right:1px solid rgba(216,179,106,.6);border-bottom:1px solid rgba(216,179,106,.6);transform:translateX(-50%) rotate(45deg)}
@keyframes pvTaunt{0%{opacity:0;transform:translate(-50%,-90%) scale(.8)}15%{opacity:1;transform:translate(-50%,-100%) scale(1)}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-115%)}}
body.pov #table{overflow-x:hidden}

/* ── 시점 단추 (옵션 줄, 스피커 옆) ── */
.pvOptBtn{margin-left:auto;min-height:34px;border-radius:999px;border:1px solid rgba(216,179,106,.45);background:rgba(20,26,36,.6);color:#F2E8D2;font:800 12px/1 inherit;padding:0 10px;cursor:pointer;white-space:nowrap}
.pvOptBtn:hover{background:rgba(216,179,106,.18)}
@media (max-width:640px){.pvOptBtn{min-height:30px;font-size:11px;padding:0 8px}}
#povBtn{position:fixed;right:10px;top:calc(100px + env(safe-area-inset-top));z-index:70;min-height:40px;border-radius:999px;border:1px solid rgba(216,179,106,.45);background:rgba(20,26,36,.85);color:#F2E8D2;font:800 12.5px/1 inherit;cursor:pointer;padding:0 12px;box-shadow:0 6px 18px rgba(0,0,0,.4);display:none;align-items:center;gap:6px}
body.pkPlaying #povBtn,body.gsPlaying #povBtn{display:inline-flex}
@media (max-width:640px){#povBtn{right:8px;top:calc(56px + env(safe-area-inset-top));font-size:12px;padding:0 10px}}
/* 가로로 눕힌 휴대폰(높이 520 미만): 캐릭터·관중이 화면 60% 를 먹지 않게 */
@media (max-height:520px){
  .pvCrowd{height:calc(24px + var(--pvw,80px) * 0.6)} .pvCrowd i{height:44px;width:28px} .pvCrowd i.b{display:none} .pvLamp{display:none}
  .pvAva{height:calc(var(--pvw,80px) * 0.95)}
  body.pov.pkPlaying .pkStage,body.pov.gsPlaying #opps{margin-top:calc(var(--pvw,80px) * 0.55)}
}
@media (prefers-reduced-motion:reduce){.pvAva,.pvCrowd i{animation:none!important} #pvZoom{transition:none!important}}