/* 홀덤펍 현황판 — chat.css 의 토큰·헤더를 그대로 쓰고 카드만 여기서 그린다. */
body.holdem { --live:#dc2626; --live-bg:#fef2f2; --open:#15803d; --open-bg:#ecfdf5; --buy:#b45309; --buy-bg:#fffbeb;
  --done:#6b7280; --done-bg:#f3f4f6; --hz:#0f766e; --fc:#6d28d9; --km:#1d4ed8; }
body.holdem .main { padding:10px 14px calc(24px + var(--safe-b)); }
body.holdem .hbtn { text-decoration:none; display:inline-flex; align-items:center; }

/* 헤더의 '갱신' 표시 */
.live { flex:none; display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:800; color:var(--mut);
  background:var(--field); border-radius:999px; padding:3px 9px 3px 7px; white-space:nowrap; }
.live i { width:7px; height:7px; border-radius:50%; background:var(--acc); box-shadow:0 0 0 0 rgba(22,163,74,.5); animation:pulse 2s infinite; }
.live.stale i { background:#d97706; animation:none; box-shadow:none; }
.live.dead i { background:var(--danger); animation:none; box-shadow:none; }
@keyframes pulse { 0%{ box-shadow:0 0 0 0 rgba(22,163,74,.45);} 70%{ box-shadow:0 0 0 6px rgba(22,163,74,0);} 100%{ box-shadow:0 0 0 0 rgba(22,163,74,0);} }


/* 필터 칩 두 줄: 지역(데이터에 있는 지역만) → 브랜드. 둘 다 같은 칩 디자인, 헤더 아래 고정 */
.filters { position:sticky; top:53px; z-index:3; background:var(--bg); border-bottom:1px solid var(--line); padding:4px 0 6px; }
.regions { display:flex; align-items:center; gap:8px; padding:4px 14px 0; }
.regions .flbl { flex:none; width:38px; font-size:12px; font-weight:800; color:var(--mut); }
.regions .chips { flex:1; min-width:0; display:flex; flex-wrap:nowrap; gap:6px; margin:0; overflow-x:auto; scrollbar-width:none;
  -webkit-overflow-scrolling:touch; padding:2px 0; }
.regions .chips::-webkit-scrollbar { display:none; }
.regions .chips:empty { display:none; }
.regions:has(.chips:empty) { display:none; }
.regions.areas .rchip.on { background:var(--acc-d); border-color:var(--acc-d); }   /* 동네는 지역보다 한 톤 진하게 */
.rchip.heart { display:inline-flex; align-items:center; gap:4px; }
.rchip.heart svg { color:#e11d48; }
.rchip.heart.on { background:#e11d48; border-color:#e11d48; color:#fff; }
.rchip.heart.on svg { color:#fff; }
.regions.brands .rchip.on { background:var(--fg); border-color:var(--fg); }   /* 브랜드는 진한 색으로 구분 */
.rchip { flex:none; white-space:nowrap; height:30px; padding:0 12px; border-radius:999px; border:1px solid var(--line);
  background:var(--card); color:var(--fg); font-size:13px; font-weight:700; cursor:pointer; line-height:1; }
.rchip.on { background:var(--acc); border-color:var(--acc); color:#fff; }
.rchip .n { margin-left:3px; font-size:11px; font-weight:700; opacity:.7; }
.shop .rg { font-size:11px; font-weight:800; color:var(--violet); background:#f3e8ff; border-radius:999px; padding:2px 7px; }

/* 수집 지연 띠 */
.stale { background:#fffbeb; border:1px solid #fde68a; color:#92400e; border-radius:10px; padding:8px 12px; font-size:12.5px; font-weight:700; margin-bottom:8px; }

/* 지금 요약 */
.now { display:flex; flex-wrap:wrap; gap:6px; margin:2px 0 10px; }
.now:empty { display:none; }
.now .pill { display:inline-flex; align-items:center; gap:6px; height:30px; padding:0 11px; border-radius:999px; font-size:12.5px; font-weight:800;
  background:var(--card); border:1px solid var(--line); color:var(--fg); white-space:nowrap; }
.now .pill.live { color:var(--live); border-color:#fecaca; background:var(--live-bg); }
.now .pill.live::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--live); animation:pulse-r 1.6s infinite; }
@keyframes pulse-r { 0%{ box-shadow:0 0 0 0 rgba(220,38,38,.45);} 70%{ box-shadow:0 0 0 6px rgba(220,38,38,0);} 100%{ box-shadow:0 0 0 0 rgba(220,38,38,0);} }
.now .pill.soon { color:var(--open); border-color:#a7f3d0; background:var(--open-bg); }
.now .pill small { font-weight:700; opacity:.75; }

/* 브랜드 구간 */
.bh { display:flex; align-items:baseline; gap:8px; margin:14px 2px 6px; font-size:15px; font-weight:900; letter-spacing:-.01em; }
.bh small { font-size:12px; font-weight:700; color:var(--mut); }
.bh .dot { width:9px; height:9px; border-radius:3px; background:var(--hz); transform:rotate(45deg); }
.bh.b-포카드 .dot { background:var(--fc); } .bh.b-파이널나인 .dot { background:#b45309; } .bh.b-KMGM .dot { background:var(--km); }

/* 즐겨찾기 하트(카드 오른쪽 위): 평소 회색 테두리, 선택하면 빨간색 */
.shop { position:relative; }
.shop .top { padding-right:34px; }
.shop .fav { position:absolute; top:6px; right:6px; width:38px; height:38px; border:0; background:transparent; padding:0;
  cursor:pointer; border-radius:10px; display:flex; align-items:center; justify-content:center; color:#c4c9d2; }
.shop .fav svg path { fill:transparent; transition:fill .15s, color .15s, transform .15s; }
.shop .fav.on { color:#e11d48; }
.shop .fav.on svg path { fill:currentColor; }
.shop .fav:active svg { transform:scale(.9); }

/* 지점 카드 */
.shop { background:var(--card); border:1px solid var(--line); border-radius:14px; padding:12px 12px 10px; margin-bottom:10px; }
.shop.quiet { opacity:.72; }
.shop .top { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.shop .nm { font-size:18px; font-weight:900; letter-spacing:-.02em; }
.shop .nm small { font-size:12px; font-weight:800; color:var(--mut); margin-right:4px; }
.shop .od { display:inline-flex; align-items:center; gap:5px; font-size:11.5px; font-weight:800; border-radius:6px; padding:2px 7px; background:var(--open-bg); color:var(--open); }
.shop .od.pre { background:var(--done-bg); color:var(--done); }
.shop .ago { margin-left:auto; font-size:11.5px; color:var(--mut); font-weight:700; white-space:nowrap; }
.shop .none { font-size:13px; color:var(--mut); padding:8px 0 2px; }

/* 게임 줄 */
.g { border-top:1px solid var(--line); padding:9px 0 8px; }
.g:first-of-type { border-top:0; margin-top:6px; }
.g .row { display:flex; align-items:center; gap:8px; }
.g .st { flex:none; font-size:11.5px; font-weight:900; border-radius:6px; padding:2px 7px; background:var(--done-bg); color:var(--done); white-space:nowrap; }
.g.s-live .st { background:var(--live-bg); color:var(--live); }
.g.s-live .st::before { content:""; display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--live); margin-right:5px; vertical-align:1px; animation:pulse-r 1.6s infinite; }
.g.s-open .st { background:var(--open-bg); color:var(--open); }
.g.s-buy .st { background:var(--buy-bg); color:var(--buy); }
.g.s-done .gn, .g.s-closed .gn { color:var(--mut); }
.g.s-done .gn { text-decoration:line-through; }
.g .gn { flex:1; min-width:0; font-size:16px; font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.g .tm { flex:none; font-size:13px; font-weight:800; color:var(--fg); white-space:nowrap; }
.g .tm.plan { color:var(--acc-d); }
.g .tm small { font-weight:700; color:var(--mut); margin-right:3px; font-size:11px; }
.g .meta { display:flex; flex-wrap:wrap; gap:4px 6px; margin-top:6px; font-size:12px; }
.g .tag { border-radius:6px; padding:2px 7px; font-weight:700; background:var(--field); color:var(--fg); white-space:nowrap; }
.g .tag b { font-weight:800; color:var(--mut); margin-right:3px; font-size:11px; }
.g .tag.blind { background:var(--live-bg); color:#991b1b; }
.g .seats { display:flex; align-items:center; gap:8px; margin-top:6px; }
.g .sn { font-size:13px; font-weight:800; color:var(--acc-d); }
.g .sn small { font-weight:700; color:var(--mut); margin-left:6px; }
.g .cue { margin-top:6px; font-size:12px; color:var(--mut); line-height:1.4; }
.g .cue q { quotes:"「" "」"; color:var(--fg); }
.g .cue small { margin-left:4px; }
.shop .old { margin-top:8px; font-size:11.5px; color:var(--mut); }

.empty { text-align:center; color:var(--mut); font-size:13.5px; padding:36px 10px; }
.ft { padding:6px 14px calc(18px + var(--safe-b)); font-size:11.5px; color:var(--mut); line-height:1.6; }
.ft a { color:var(--acc-d); }
.ft-src { font-weight:700; }
.biz-foot { margin-top:8px; padding-top:8px; border-top:1px solid #e2e5ea; font-size:11px; line-height:1.6; color:var(--mut); }
.biz-foot a { color:var(--mut); }

@media (max-width:380px) {
  .shop .nm { font-size:16px; }
  .g .gn { font-size:15px; }
}
@media (max-width:430px) {
  .live { font-size:11px; padding:3px 7px 3px 6px; }
}

/* ── 상단 탭(홀덤펍 현황 / 승률 계산) ── */
.tabs { display:flex; background:var(--card); border-bottom:1px solid var(--line); position:sticky; top:53px; z-index:4; }
.tab { flex:1; height:42px; border:0; background:transparent; font-size:13px; padding:0 2px; font-weight:800; color:var(--mut); cursor:pointer;
  border-bottom:2px solid transparent; font-family:inherit; }
.tab.on { color:var(--acc-d); border-bottom-color:var(--acc); }
body.holdem .filters { top:95px; }

/* ── 승률 계산 ── */
.calc { padding:12px 14px calc(24px + var(--safe-b)); }
.crow { display:flex; align-items:center; gap:8px; margin-bottom:10px; min-height:56px; }
.crow.top { align-items:flex-start; }
.clbl { flex:none; width:38px; font-size:12px; font-weight:800; color:var(--mut); padding-top:6px; }
.slotline { display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
.oppbox { display:flex; flex-direction:column; gap:6px; margin:0 0 4px 46px; }
.oppRow { display:flex; align-items:center; gap:6px; }
.oppNo { font-size:11.5px; font-weight:800; color:var(--mut); width:40px; flex:none; }
.oppRow .pc { min-width:36px; height:46px; font-size:13.5px; }
.oppTag { font-size:11px; font-weight:800; color:var(--mut); background:var(--field); border-radius:6px; padding:2px 7px; white-space:nowrap; }
.oppTag.known { background:#eaf6ee; color:var(--acc-d); }
.oppn { flex:none; display:flex; align-items:center; gap:6px; font-size:12.5px; font-weight:800; color:var(--fg); }
.stepb { width:28px; height:28px; border:1px solid var(--line); background:var(--card); border-radius:8px; font-size:15px;
  font-weight:800; color:var(--fg); cursor:pointer; line-height:1; font-family:inherit; }
.slot { display:inline-flex; border:0; background:transparent; padding:0; cursor:pointer; line-height:0; }
.slot.on .pc { outline:2px solid var(--acc); outline-offset:1px; }
.pc { display:inline-flex; align-items:center; justify-content:center; min-width:42px; height:54px; border-radius:8px; padding:0;
  border:1px solid var(--line); background:var(--card); font-size:15px; font-weight:900; letter-spacing:-.02em; margin:0; }
.pc.empty { color:#c4c9d2; background:var(--field); border-style:dashed; font-weight:700; }
.pc.s-h, .pc.s-d { color:#e11d48; }
.pc.s-s, .pc.s-c { color:#111827; }
.cnote { font-size:11.5px; color:var(--mut); line-height:1.5; margin:8px 0; }
.cnote2 { font-size:11.5px; color:var(--mut); margin-top:8px; }
.cbtns { display:flex; gap:8px; margin:12px 0 6px; }
.cwarn { font-size:13px; color:#b45309; background:#fffbeb; border:1px solid #fde68a; border-radius:10px; padding:8px 12px; }
.cres { margin-top:10px; }
.rrow { display:flex; align-items:center; gap:8px; margin:6px 0; }
.rlbl { width:22px; font-size:13px; font-weight:800; }
.rval { width:52px; text-align:right; font-size:14px; font-weight:900; }
.rbar { flex:1; height:12px; border-radius:999px; background:var(--field); overflow:hidden; }
.rbar i { display:block; height:100%; border-radius:999px; }
.win { color:var(--acc-d); } .rbar i.win { background:var(--acc); }
.tie { color:#6b7280; } .rbar i.tie { background:#9ca3af; }
.lose { color:#e11d48; } .rbar i.lose { background:#e11d48; }
.cprog { height:8px; border-radius:999px; background:var(--field); overflow:hidden; }
.cprog i { display:block; height:100%; width:0; background:var(--acc); transition:width .12s; }

/* 카드 고르기 */
.picker { position:fixed; inset:0; z-index:30; background:rgba(0,0,0,.45); display:flex; align-items:flex-end; justify-content:center; }
.pbox { background:var(--card); width:100%; max-width:640px; border-radius:16px 16px 0 0; padding:10px 10px calc(14px + var(--safe-b)); max-height:80vh; overflow:auto; }
.phead { display:flex; align-items:center; font-size:14px; font-weight:800; padding:4px 4px 10px; }
.pclose { margin-left:auto; border:0; background:transparent; font-size:24px; line-height:1; color:var(--mut); cursor:pointer; }
.prow { display:flex; gap:4px; margin-bottom:6px; overflow-x:auto; scrollbar-width:none; }
.prow::-webkit-scrollbar { display:none; }
.pcard { display:inline-flex; border:0; background:transparent; padding:0; cursor:pointer; line-height:0; }
.pcard .pc { min-width:38px; height:46px; font-size:13.5px; }
.pcard.used .pc { opacity:.25; }

/* ── AI 연습(1:1) ── */
.gm { padding:10px 14px calc(24px + var(--safe-b)); }
.ghead { display:flex; align-items:center; margin-bottom:8px; }
.gstreet { font-size:12px; font-weight:800; color:var(--mut); }
.grestart { margin-left:auto; border:1px solid var(--line); background:var(--card); border-radius:999px; padding:4px 10px;
  font-size:11.5px; font-weight:800; color:var(--mut); cursor:pointer; font-family:inherit; }
.gseat { display:flex; align-items:center; gap:8px; padding:6px 0; }
.gwho { font-size:11.5px; font-weight:900; color:var(--mut); width:58px; flex:none; white-space:nowrap; }
.gwho.me { color:var(--acc-d); }
.gchip { font-size:12.5px; font-weight:800; color:var(--fg); background:var(--field); border-radius:999px; padding:3px 9px; }
.ghand { display:flex; gap:5px; align-items:center; }
.ghand .pc { min-width:38px; height:50px; font-size:14px; }
.pc.back { background:repeating-linear-gradient(45deg,#cfd8e3,#cfd8e3 4px,#e6ecf3 4px,#e6ecf3 8px); border-color:#c2ccd9; }
.gbet { font-size:11.5px; font-weight:800; color:#b45309; background:#fffbeb; border:1px solid #fde68a; border-radius:999px; padding:2px 7px; margin-left:2px; }
.gmid { display:flex; align-items:center; gap:6px; flex-wrap:wrap; background:#f3f7f4; border:1px solid var(--line);
  border-radius:12px; padding:8px 10px; margin:4px 0; }
.gpotl { font-size:11.5px; font-weight:800; color:var(--mut); }
.gpot { font-size:14px; font-weight:900; color:var(--acc-d); margin-right:4px; }
.gboard { display:flex; gap:5px; margin-left:auto; }
.gboard .pc { min-width:34px; height:46px; font-size:13px; }
.geq { margin:10px 0 4px; min-height:38px; }
.eqbar { height:10px; border-radius:999px; background:var(--field); overflow:hidden; }
.eqbar i { display:block; height:100%; background:var(--acc); border-radius:999px; transition:width .2s; }
.eqtx { font-size:12px; color:var(--mut); margin-top:5px; line-height:1.5; }
.eqtx b { color:var(--fg); }
.eqtx b.good { color:var(--acc-d); } .eqtx b.bad { color:#e11d48; }
.gres { font-size:14px; font-weight:800; color:var(--fg); background:var(--field); border-radius:10px; padding:10px 12px; }
.gbtns { display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 4px; min-height:40px; }
.gb { flex:1 1 30%; min-height:40px; border:1px solid var(--line); background:var(--card); border-radius:10px;
  font-size:13px; font-weight:800; color:var(--fg); cursor:pointer; font-family:inherit; padding:0 6px; }
.gb.up { background:#eaf6ee; border-color:#bfe3cc; color:var(--acc-d); }
.gb.fold { color:var(--mut); }
.gthink { font-size:12.5px; color:var(--mut); padding:10px 2px; }
.glog { margin-top:8px; font-size:11.5px; color:var(--mut); line-height:1.7; }
.glvrow { display:flex; align-items:center; gap:8px; margin-bottom:4px; }
.glvrow .flbl { flex:none; width:38px; font-size:12px; font-weight:800; color:var(--mut); }
.glvrow .chips { display:flex; gap:6px; flex-wrap:wrap; }
.glvtip { font-size:11.5px; color:var(--mut); margin:0 0 8px 46px; line-height:1.5; }

/* ── 내 분석 ── */
.sthead { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:12.5px; color:var(--mut); margin-bottom:10px; line-height:1.5; }
.sthead a { color:var(--acc-d); font-weight:800; }
.sthead .sbtn { margin-left:auto; border:1px solid var(--line); background:var(--card); border-radius:999px; padding:4px 10px; font-size:11.5px; font-weight:800; color:var(--mut); cursor:pointer; font-family:inherit; }
.tiles { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; margin-bottom:10px; }
.tile { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:10px 12px; min-width:0; }
.tile .k { font-size:11.5px; color:var(--mut); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tile .v { font-size:20px; font-weight:900; margin-top:2px; letter-spacing:-.02em; white-space:nowrap; }
.tile .v .sm { font-size:15.5px; }
.tile .s { font-size:11.5px; color:var(--mut); margin-top:2px; }
.tile.good .v { color:var(--acc-d); } .tile.bad .v { color:#e11d48; }
.ssec { margin:14px 0 6px; }
.ssec h3 { font-size:14px; font-weight:900; margin:0 0 6px; display:flex; align-items:baseline; gap:6px; }
.ssec h3 small { font-size:11.5px; color:var(--mut); font-weight:700; }
.srow { display:flex; align-items:center; gap:8px; font-size:13px; padding:6px 0; border-bottom:1px solid var(--line); }
.srow .l { flex:1; } .srow .r { font-weight:800; white-space:nowrap; }
.srow .r.bad { color:#e11d48; } .srow .r.good { color:var(--acc-d); }
.sbar { height:8px; border-radius:999px; background:var(--field); overflow:hidden; width:90px; flex:none; }
.sbar i { display:block; height:100%; background:var(--acc); }
.sleak { background:#fff7ed; border:1px solid #fed7aa; border-radius:12px; padding:10px 12px; margin:8px 0; font-size:13px; line-height:1.5; }
.sleak b { color:#9a3412; }
.sex { font-size:12px; color:var(--mut); margin-top:4px; line-height:1.5; }
.sex .pc { min-width:22px; height:28px; font-size:11px; border-radius:5px; margin-right:1px; }
.sempty { text-align:center; color:var(--mut); font-size:13.5px; padding:30px 10px; line-height:1.6; }
