/* PHV Replayer & Stats Pro — UI refresh v1.6.0 */
:root{
  --bg0:#070a14;
  --bg1:#0b1020;
  --panel:#0e1634;
  --panel2:#0c1431;
  --stroke:#22325f;
  --stroke2:#2a3f7a;
  --txt:#eaf1ff;
  --muted:#9fb4ff;
  --accent:#78a6ff;
  --good:#2dd39e;
  --warn:#ffd166;
  --bad:#ef476f;
  --chip:#141b2f;
  --shadow:0 10px 30px rgba(0,0,0,.35);
  --r12:12px;
  --r16:16px;
}

.phv{color:var(--txt);font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;line-height:1.35}
.phv *{box-sizing:border-box}
.phv a{color:inherit}
.phv .muted{color:var(--muted)}
.phv .mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.phv .sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.phv .btn{appearance:none;border:1px solid #3650a0;background:#24356e;color:var(--txt);border-radius:10px;padding:10px 12px;cursor:pointer}
.phv .btn.secondary{background:#0f224d;border-color:#2c4ca0}
.phv .btn.ghost{background:transparent;border-color:var(--stroke2)}
.phv .btn:disabled{opacity:.55;cursor:not-allowed}
.phv .btn:focus,.phv input:focus,.phv textarea:focus,.phv select:focus{outline:2px solid var(--accent);outline-offset:2px}
.phv input,.phv select{background:var(--panel2);color:var(--txt);border:1px solid var(--stroke2);border-radius:10px;padding:8px 10px}
.phv textarea{width:100%;min-height:220px;background:var(--panel);color:var(--txt);border:1px solid var(--stroke2);border-radius:14px;padding:12px;resize:vertical}

.phv .shell{background:var(--bg0)}
.phv .topbar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:linear-gradient(180deg,#0e1634 0%, #0b1020 100%);
  border:1px solid var(--stroke);border-radius:16px;padding:12px 12px;box-shadow:var(--shadow)
}
.phv .brand{display:flex;flex-direction:column;gap:2px}
.phv .brand .title{font-size:18px;font-weight:800;letter-spacing:.2px}
.phv .brand .sub{font-size:12px;color:var(--muted)}
.phv .actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.phv .chips{display:flex;gap:8px;flex-wrap:wrap}
.phv .chip{display:inline-flex;align-items:center;gap:8px;background:var(--chip);border:1px solid var(--stroke);border-radius:999px;padding:6px 10px}
.phv .dot{width:8px;height:8px;border-radius:50%}
.phv .dot.good{background:var(--good)}
.phv .dot.warn{background:var(--warn)}
.phv .dot.bad{background:var(--bad)}

.phv .grid2{display:grid;grid-template-columns:1.15fr .85fr;gap:12px;margin-top:12px}
.phv .card{
  background:linear-gradient(180deg,#101a3d 0%, #0b1329 100%);
  border:1px solid var(--stroke);border-radius:16px;padding:12px;box-shadow:var(--shadow)
}
.phv .card h3{margin:0 0 10px;font-size:14px;letter-spacing:.2px}
.phv .row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.phv .spacer{flex:1}
.phv .hint{font-size:12px;color:var(--muted)}

.phv details{background:#0c1431;border:1px solid var(--stroke);border-radius:14px;padding:10px}
.phv summary{cursor:pointer;font-weight:700}
.phv .filters{
  display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:10px;margin-top:10px
}
.phv .fgrp{background:#0a1126;border:1px solid #1c2a53;border-radius:14px;padding:10px}
.phv .fgrp label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}
.phv .fgrp .inline{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

.phv .tabs{display:flex;gap:8px;align-items:center;margin-bottom:10px}
.phv .tab{background:#0c1431;border:1px solid var(--stroke);border-radius:999px;padding:8px 12px;cursor:pointer}
.phv .tab[aria-selected="true"]{background:#1a2b5a;border-color:#3650a0}
.phv .pane{display:none}
.phv .pane.active{display:block}

.phv .list{display:flex;flex-direction:column;gap:10px}
.phv .hand{
  display:flex;align-items:flex-start;justify-content:space-between;gap:10px;
  background:#0c1431;border:1px solid #1c2a53;border-radius:14px;padding:10px;cursor:pointer
}
.phv .hand:hover{border-color:#3650a0}
.phv .hand .meta{display:flex;flex-direction:column;gap:4px}
.phv .hand .meta .id{font-weight:800}
.phv .hand .kvs{display:flex;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:12px}
.phv .hand .tag{background:#0f224d;border:1px solid #2c4ca0;border-radius:999px;padding:4px 8px;font-size:12px;color:#cfe1ff}

.phv table{width:100%;border-collapse:separate;border-spacing:0}
.phv th,.phv td{padding:10px;border-bottom:1px solid #1c2a53;text-align:left;font-size:13px}
.phv th{position:sticky;top:0;background:#0c1431;z-index:2;cursor:pointer;user-select:none}
.phv th.sort-asc::after{content:" ▲";color:var(--muted)}
.phv th.sort-desc::after{content:" ▼";color:var(--muted)}
.phv .tblwrap{max-height:420px;overflow:auto;border:1px solid #1c2a53;border-radius:14px}
.phv .empty{padding:10px;color:var(--muted)}

/* Replayer modal — PokerStars-ish */
.phv-rep{position:fixed;inset:0;background:rgba(7,11,22,.85);display:none;align-items:center;justify-content:center;z-index:2147483646}
.phv-rep .dlg{background:#061a0e;border:1px solid #1f5c33;border-radius:16px;max-width:1040px;width:min(1040px,96vw);max-height:92vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.phv-rep header{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid #1f5c33;background:#0a2e18;border-radius:16px 16px 0 0;color:#eafff0}
.phv-rep .title{font-weight:900}
.phv-rep .close{background:transparent;border:0;color:#eafff0;font-size:22px;cursor:pointer}
.phv-rep .tablewrap{position:relative;background:#0d2a17;border-bottom:1px solid #1f5c33;padding:18px}
.phv-rep .table{height:460px;position:relative;border-radius:999px;background:
  radial-gradient(ellipse at center, #1a6e36 0%, #145b2c 45%, #0d4722 75%, #093617 100%);
  box-shadow:inset 0 0 70px rgba(0,0,0,.65), inset 0 0 12px rgba(255,255,255,.07);
  border:12px solid #3e2a12;
}
.phv-rep .seat{position:absolute;min-width:140px;max-width:190px;padding:8px 10px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.16);border-radius:14px;text-align:center;color:#eafff0;backdrop-filter:blur(2px)}
.phv-rep .seat.folded{opacity:.55}
.phv-rep .seat .name{font-weight:900}
.phv-rep .seat .stack{color:#ccefd8;font-size:13px}
.phv-rep .board{position:absolute;left:50%;top:56%;transform:translateX(-50%);display:flex;gap:8px}
.phv-rep .pot{position:absolute;left:50%;top:38%;transform:translate(-50%,-50%);color:#eafff0;padding:6px 10px;border-radius:12px;font-weight:900;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.22)}
.phv-rep .overlay{position:absolute;left:50%;top:72%;transform:translateX(-50%);background:rgba(0,0,0,.58);
  border:1px solid rgba(255,255,255,.22);border-radius:12px;padding:7px 10px;display:none;color:#eafff0;max-width:86%;text-align:center}
.phv-rep .controls{display:flex;gap:8px;align-items:center;padding:10px 12px;background:#0a2e18;border-radius:0 0 16px 16px}
.phv-rep .controls .btn{background:#1b7941;border-color:#0b5c29}
.phv-rep .seek{flex:1;display:flex;gap:10px;align-items:center}
.phv-rep input[type=range]{width:100%}
.phv-rep .mini{font-size:12px;color:#d7ffe5;opacity:.85}
.phv-rep .seg{display:flex;gap:8px;align-items:center;flex-wrap:wrap}

/* cards */
.phv .pcard{display:inline-flex;align-items:center;justify-content:center;border-radius:8px;border:1px solid rgba(0,0,0,.25);
  background:#10325c;color:#fff;padding:6px 8px;font-weight:900;font-family:ui-monospace,Menlo,Consolas,monospace;min-width:34px}
.phv .pcard.s{background:#10325c}.phv .pcard.h{background:#5c1023}.phv .pcard.d{background:#1a5c10}.phv .pcard.c{background:#5c5210}

@media (max-width: 980px){
  .phv .grid2{grid-template-columns:1fr}
  .phv .filters{grid-template-columns:1fr}
  .phv-rep .table{height:380px}
}


/* --- Keys modal --- */
.phv-modal{position:fixed;inset:0;background:rgba(7,11,22,.85);display:none;align-items:center;justify-content:center;z-index:2147483647}
.phv-modal .dlg{background:linear-gradient(180deg,#101a3d 0%, #0b1329 100%);border:1px solid var(--stroke);border-radius:16px;
  width:min(820px,96vw);max-height:90vh;overflow:auto;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.phv-modal header{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid #1c2a53}
.phv-modal header .title{font-weight:900}
.phv-modal .body{padding:12px 14px}
.phv-modal .grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.phv-modal .field{background:#0c1431;border:1px solid #1c2a53;border-radius:14px;padding:10px}
.phv-modal .field label{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}
.phv-modal .field input{width:100%}
.phv-modal .foot{display:flex;gap:10px;align-items:center;justify-content:flex-end;padding:12px 14px;border-top:1px solid #1c2a53}
@media (max-width:720px){ .phv-modal .grid{grid-template-columns:1fr} }

/* --- Replayer extras: dealer button, chip stacks, action log --- */
.phv-rep .dealer{
  position:absolute;width:28px;height:28px;border-radius:999px;
  background:radial-gradient(circle at 30% 30%, #fff, #e7e7e7 45%, #bdbdbd);
  border:2px solid rgba(0,0,0,.35);
  display:flex;align-items:center;justify-content:center;
  color:#111;font-weight:900;font-size:12px;
  box-shadow:0 6px 16px rgba(0,0,0,.35);
}
.phv-rep .chips{
  position:absolute;display:flex;flex-direction:column;gap:3px;align-items:center;
}
.phv-rep .chip{
  width:18px;height:18px;border-radius:50%;
  background:radial-gradient(circle at 30% 30%, #fff, #d33 45%, #9b1010);
  border:2px solid rgba(255,255,255,.8);
  box-shadow:0 4px 10px rgba(0,0,0,.35);
}
.phv-rep .chip.green{
  background:radial-gradient(circle at 30% 30%, #fff, #2dd39e 45%, #0d7a57);
  border-color:rgba(255,255,255,.75);
}
.phv-rep .chip.move{
  position:absolute;left:0;top:0;transform:translate(-50%,-50%);
  transition:transform .55s ease, opacity .55s ease;
  z-index:100;
}

/* Action log panel */
.phv-rep .logwrap{display:grid;grid-template-columns:1fr 320px;gap:12px}
.phv-rep .tablewrap{padding:18px}
.phv-rep .log{
  background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.16);
  border-radius:14px;padding:10px;max-height:460px;overflow:auto
}
.phv-rep .log h4{margin:0 0 8px;font-size:12px;letter-spacing:.2px;color:#eafff0;opacity:.9}
.phv-rep .log .item{padding:8px 10px;border-radius:10px;font-size:12px;color:#eafff0;border:1px solid transparent}
.phv-rep .log .item + .item{margin-top:6px}
.phv-rep .log .item.cur{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2)}
.phv-rep .log .item .who{font-weight:900}
.phv-rep .log .item .meta{opacity:.9}
@media (max-width:980px){
  .phv-rep .logwrap{grid-template-columns:1fr}
  .phv-rep .log{max-height:200px}
}


/* --- PokerStars-like polish v1.6.2 --- */
.phv-rep .seat{
  background:linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.18) 100%);
  border:1px solid rgba(255,255,255,.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 22px rgba(0,0,0,.35);
}
.phv-rep .seat .name{display:flex;gap:8px;align-items:center;justify-content:center}
.phv-rep .avatar{
  width:28px;height:28px;border-radius:999px;
  background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.35), rgba(255,255,255,.08) 55%, rgba(0,0,0,.15));
  border:1px solid rgba(255,255,255,.22);
}
.phv-rep .seat .cards{margin-top:8px;display:flex;gap:8px;justify-content:center;align-items:center}
.phv-rep .pcard{min-width:40px;padding:7px 9px;border-radius:10px}
.phv-rep .pcard.back{
  background:linear-gradient(145deg,#1e3573,#0f224d);
  border:1px solid rgba(255,255,255,.18);
  color:rgba(255,255,255,.55);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 18px rgba(0,0,0,.35);
}
.phv-rep .pcard.back::after{content:"★";font-weight:900;opacity:.55}

/* Bigger chip stacks */
.phv-rep .chip{width:28px;height:28px;border-width:2px}
.phv-rep .chips{filter:drop-shadow(0 10px 18px rgba(0,0,0,.45))}
.phv-rep .chips .chip{margin-top:-10px}
.phv-rep .chips .chip:first-child{margin-top:0}

/* Pot chip pile */
.phv-rep .potpile{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);display:flex;gap:8px;align-items:center;justify-content:center;pointer-events:none}
.phv-rep .potpile .chip{width:32px;height:32px}
.phv-rep .potpile .chip:nth-child(2){transform:translate(-6px,6px)}
.phv-rep .potpile .chip:nth-child(3){transform:translate(7px,10px)}
.phv-rep .potpile .chip:nth-child(4){transform:translate(2px,-6px)}

/* Improve table depth */
.phv-rep .table{
  box-shadow: inset 0 0 90px rgba(0,0,0,.72), inset 0 0 14px rgba(255,255,255,.07), 0 18px 50px rgba(0,0,0,.5);
}

/* Action log readability */
.phv-rep .log .item{background:rgba(0,0,0,.16)}
.phv-rep .log .item.cur{background:rgba(255,255,255,.10)}


/* v1.7.0: select inside chip */
.phv .chip .chip-select{
  margin-left:8px;
  padding:6px 8px;
  border-radius:10px;
  background:transparent;
  border:1px solid rgba(255,255,255,.16);
  color:var(--txt);
}
.phv .chip .chip-select:focus{
  outline:2px solid var(--accent);
  outline-offset:2px;
}


/* =========================
   PokerStars Theme v1.7.3
   ========================= */

.phv-rep .dlg{
  background: radial-gradient(circle at 20% 0%, rgba(60,70,120,.35), rgba(10,12,18,.95) 55%),
              linear-gradient(180deg,#0b0d12 0%, #07080d 100%);
  border:1px solid rgba(255,255,255,.08);
}
.phv-rep header{
  background:linear-gradient(180deg,#151922 0%, #0d1017 100%);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.phv-rep .tablewrap{
  background:
    radial-gradient(circle at 50% 35%, rgba(255,255,255,.10), rgba(0,0,0,.0) 55%),
    radial-gradient(circle at 50% 50%, rgba(0,0,0,.7), rgba(0,0,0,.95) 75%);
  border-bottom:1px solid rgba(255,255,255,.08);
}

.phv-rep .table{
  border:14px solid #1b1b1b;
  box-shadow:
    inset 0 0 110px rgba(0,0,0,.80),
    inset 0 0 14px rgba(255,255,255,.08),
    0 22px 60px rgba(0,0,0,.65);
  background:
    radial-gradient(ellipse at center, #1f8a46 0%, #16703a 45%, #0d552a 78%, #073f1c 100%);
}

/* center labels */
.phv-rep .pot{
  background:rgba(0,0,0,.45);
  border:1px solid rgba(255,255,255,.16);
  padding:6px 12px;
  border-radius:999px;
  font-weight:800;
  letter-spacing:.2px;
}
.phv-rep .potpile{
  top:50%;
  left:50%;
  transform:translate(-50%,-10%);
}
.phv-rep .game{
  position:absolute;
  left:50%;
  top:63%;
  transform:translateX(-50%);
  color:rgba(255,255,255,.55);
  font-size:12px;
  letter-spacing:.4px;
}

/* Seats as pokerstars pills */
.phv-rep .seat{
  transform:translate(-50%,-50%);
  min-width:190px;
  max-width:220px;
  padding:10px 14px 22px;
  border-radius:999px;
  text-align:left;
  background:linear-gradient(180deg, rgba(10,12,18,.90) 0%, rgba(5,6,10,.88) 100%);
  border:1px solid rgba(255,255,255,.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 14px 26px rgba(0,0,0,.45);
}
.phv-rep .seat.active{
  border-color:rgba(255,255,255,.75);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 18px 34px rgba(0,0,0,.55);
}
.phv-rep .seat .seat-top{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:rgba(255,255,255,.70)}
.phv-rep .seat .seat-stack{font-size:16px;font-weight:900;color:#fff;margin-top:2px}
.phv-rep .seat .seat-name{font-size:12px;color:rgba(255,255,255,.72);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.phv-rep .seat .pos{opacity:.75}
.phv-rep .seat .avatar{
  position:absolute;right:-14px;top:50%;
  transform:translateY(-50%);
  width:46px;height:46px;border-radius:999px;
  background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.18), rgba(255,255,255,.04) 55%, rgba(0,0,0,.35));
  border:2px solid rgba(255,255,255,.10);
  display:flex;align-items:center;justify-content:center;
}
.phv-rep .seat .avatar .star{font-weight:900;opacity:.35}
.phv-rep .dealer{
  position:absolute;
  left:-10px;
  top:-10px;
  width:28px;height:28px;
  border-radius:999px;
  background:radial-gradient(circle at 30% 30%, #fff, #e7e7e7 45%, #bdbdbd);
  border:2px solid rgba(0,0,0,.35);
  display:flex;align-items:center;justify-content:center;
  color:#111;font-weight:900;font-size:12px;
  box-shadow:0 6px 16px rgba(0,0,0,.35);
}

/* hole cards in front of seat */
.phv-rep .seat .cards{
  position:absolute;
  left:50%;
  top:100%;
  transform:translate(-50%, 10px);
  display:flex;gap:10px;
}

/* Bet label like pokerstars */
.phv-rep .seat .betlabel{
  position:absolute;
  left:50%;
  top:100%;
  transform:translate(-50%, 54px);
  padding:6px 10px;
  border-radius:999px;
  background:rgba(0,0,0,.55);
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
  font-weight:900;
  font-size:12px;
  box-shadow:0 10px 18px rgba(0,0,0,.35);
}

/* Chips stronger */
.phv-rep .chips{
  position:absolute;
  transform:translate(-50%,-50%);
  display:flex;flex-direction:column;gap:0;
  pointer-events:none;
  filter:drop-shadow(0 16px 20px rgba(0,0,0,.55));
}
.phv-rep .chip{
  width:30px;height:30px;border-radius:50%;
  border:2px solid rgba(255,255,255,.85);
  background:
    radial-gradient(circle at 30% 30%, #fff, rgba(255,255,255,.05) 38%, rgba(0,0,0,.2) 65%),
    conic-gradient(from 0deg, #e74c3c 0 18%, #f1c40f 18% 36%, #2ecc71 36% 54%, #3498db 54% 72%, #9b59b6 72% 90%, #e74c3c 90% 100%);
  box-shadow: inset 0 2px 3px rgba(255,255,255,.35), 0 10px 18px rgba(0,0,0,.55);
  margin-top:-12px;
}
.phv-rep .chip:first-child{margin-top:0}

/* Moving chip */
.phv-rep .chip.move{
  position:absolute;
  left:0;top:0;
  transform:translate(-50%,-50%);
  transition:transform .55s ease, opacity .55s ease;
  z-index:999;
  margin-top:0;
}

/* Board cards like PokerStars */
.phv-rep .board{top:50%}
.phv-rep .pscard{
  width:54px;height:74px;
  border-radius:10px;
  background:linear-gradient(180deg,#ffffff 0%, #f3f4f6 100%);
  border:1px solid rgba(0,0,0,.18);
  box-shadow:0 10px 18px rgba(0,0,0,.35);
  display:inline-flex;flex-direction:column;align-items:center;justify-content:center;
  font-family: ui-monospace, Menlo, Consolas, monospace;
  font-weight:900;
}
.phv-rep .pscard .r{font-size:22px;line-height:1}
.phv-rep .pscard .s{font-size:22px;line-height:1;margin-top:2px}
.phv-rep .pscard.h, .phv-rep .pscard.d{color:#c1121f}
.phv-rep .pscard.s, .phv-rep .pscard.c{color:#0b0d12}
.phv-rep .pscard.back{
  background:linear-gradient(145deg,#1e3573,#0f224d);
  border:1px solid rgba(255,255,255,.18);
  color:rgba(255,255,255,.55);
}

/* Controls + streetbar */
.phv-rep .controls{
  background:linear-gradient(180deg,#0f121a 0%, #0a0c12 100%);
  border-top:1px solid rgba(255,255,255,.08);
}
.phv-rep .controls .btn{
  background:#151a22;
  border-color:rgba(255,255,255,.12);
}
.phv-rep .controls .btn:hover{border-color:rgba(255,255,255,.25)}
.phv-rep .streetbar{
  display:flex;gap:8px;align-items:center;flex-wrap:wrap;
  padding:6px 8px;
  background:rgba(0,0,0,.25);
  border:1px solid rgba(255,255,255,.10);
  border-radius:12px;
}
.phv-rep .streetbar .street{
  appearance:none;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(0,0,0,.18);
  color:rgba(255,255,255,.80);
  border-radius:10px;
  padding:7px 10px;
  cursor:pointer;
  font-weight:800;
  font-size:12px;
}
.phv-rep .streetbar .street.active{
  background:#b00020;
  border-color:rgba(255,255,255,.35);
  color:#fff;
}

@media (max-width:980px){
  .phv-rep .logwrap{grid-template-columns:1fr}
  .phv-rep .table{height:380px}
  .phv-rep .seat{min-width:170px;max-width:200px}
  .phv-rep .pscard{width:46px;height:64px}
}


.phv-rep .seat.hero{border-color:rgba(255,255,255,.55);}