/* Texas Hold'em — long rounded table (stadium), site red. Mobile first. */
.games .game.poker .g-art, .game.poker.live .g-art { background: radial-gradient(circle at 50% 45%, #a8344b, #5a1220 70%, #2a0710); }
.game.poker.live .g-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 35%, rgba(255,255,255,.18) 50%, transparent 65%); transform: translateX(-100%); animation: shine 3.2s ease-in-out infinite; }
.game.poker.live:hover { transform: translateY(-3px); }

/* lobby */
.thr-felt { margin: 10px 0 8px; height: 70px; position: relative; }
.thr-oval { position: absolute; inset: 6px 10px; border-radius: 999px; background: radial-gradient(ellipse at 50% 40%, #a3304a, #5a1220 80%); box-shadow: 0 0 0 4px #2a0c12, 0 0 0 5px rgba(243,196,107,.55), inset 0 0 12px rgba(0,0,0,.4); display: flex; align-items: center; justify-content: center; }
.thr-oval span { font-size: 11px; font-weight: 800; color: rgba(255,255,255,.75); letter-spacing: .5px; }
.thr-oval i { position: absolute; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; border: 2px solid rgba(255,255,255,.45); background: #2a0c12; }
.thr-oval i.on { background: var(--gold); border-color: var(--gold); box-shadow: 0 0 6px var(--gold); }

/* table */
.th-table { position: relative; flex: 1; min-height: 360px; overflow: hidden; color: #fff; -webkit-user-select: none; user-select: none;
  background: radial-gradient(ellipse at 50% 45%, #3a0d17 0%, #1f070d 60%, #120408 100%); }
.th-felt { position: absolute; border-radius: 9999px; background: radial-gradient(ellipse at 50% 42%, #b13a52 0%, #8e2338 38%, #5f1424 78%, #4a0f1a 100%);
  box-shadow: 0 0 0 9px #2b0b12, 0 0 0 10px rgba(243,196,107,.7), 0 0 0 13px #1a0609, 0 14px 30px rgba(0,0,0,.6), inset 0 0 40px rgba(0,0,0,.35); }
.th-felt-in { position: absolute; inset: 14px; border-radius: 9999px; border: 1.5px solid rgba(243,196,107,.28); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; pointer-events: none; }
.th-logo { font-size: 13px; font-weight: 900; letter-spacing: 3px; color: rgba(255,255,255,.1); margin-top: 38%; }
.th-logo2 { font-size: 10px; font-weight: 700; color: rgba(255,255,255,.12); letter-spacing: 1px; }
.th-center { position: absolute; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; gap: 6px; z-index: 2; pointer-events: none; width: 250px; }
.th-pot { background: rgba(0,0,0,.45); border: 1px solid rgba(243,196,107,.4); border-radius: 999px; padding: 2px 12px; font-size: 12px; font-weight: 700; }
.th-pot b { color: var(--gold); font-variant-numeric: tabular-nums; }
.th-side { display: flex; gap: 4px; flex-wrap: wrap; justify-content: center; }
.th-side span { font-size: 10px; background: rgba(0,0,0,.35); border-radius: 999px; padding: 0 7px; }
.th-board { display: flex; gap: 4px; align-items: center; position: relative; }
.th-board .pcard.mid { width: 40px; height: 56px; }
.th-slot { width: 40px; height: 56px; border-radius: 6px; border: 1.5px dashed rgba(255,255,255,.14); }
.pcard.dim { filter: brightness(.55); }
.pcard.hl { box-shadow: 0 0 0 2px var(--gold), 0 0 12px rgba(243,196,107,.8); transform: translateY(-3px); }
.pcard.rabbit { opacity: .55; filter: grayscale(.4); outline: 1.5px dashed rgba(255,255,255,.7); }
.th-rabbit-tag { font-size: 10px; opacity: .8; }
.th-runs { display: flex; flex-direction: column; gap: 3px; }
.th-runs .th-board.run .pcard.mid, .th-runs .th-slot { width: 32px; height: 45px; }
.th-runs.n3 .th-board.run .pcard.mid, .th-runs.n3 .th-slot { width: 28px; height: 39px; }
.run-no { font-size: 10px; width: 14px; text-align: center; color: var(--gold); }
.th-win { display: flex; flex-direction: column; align-items: center; background: linear-gradient(135deg, rgba(243,196,107,.95), rgba(201,146,39,.95)); color: #3b2200; border-radius: 12px; padding: 4px 14px; animation: pop .35s var(--ease); box-shadow: 0 6px 18px rgba(0,0,0,.4); }
.th-win b { font-size: 15px; font-weight: 900; }
.th-win span { font-size: 11.5px; font-weight: 700; }
.th-timer { font-size: 22px; font-weight: 900; height: 26px; text-shadow: 0 2px 8px rgba(0,0,0,.5); font-variant-numeric: tabular-nums; }
.th-timer.urgent { color: #ffb3bf; animation: tick 1s infinite; }
.th-wait { font-size: 12px; font-weight: 700; opacity: .8; }
.th-dealer { position: absolute; transform: translate(-50%, -50%); width: 22px; height: 22px; border-radius: 50%; background: #fffaf2; color: #151214; font-size: 11px; font-weight: 900; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 6px rgba(0,0,0,.5), inset 0 0 0 2px #d9a441; z-index: 3; transition: left .4s var(--ease), top .4s var(--ease); }
.th-bet { position: absolute; transform: translate(-50%, -50%); display: flex; align-items: center; gap: 3px; z-index: 3; animation: pop .25s var(--ease); }
.th-bet b { font-size: 11px; font-weight: 800; background: rgba(0,0,0,.6); border-radius: 999px; padding: 0 6px; font-variant-numeric: tabular-nums; }
.th-bet.ghost { pointer-events: none; animation: none; }
.th-chips { position: relative; width: 16px; height: 18px; display: inline-block; }
.th-chips .cc { position: absolute; left: 0; bottom: calc(var(--k) * 3px); width: 16px; height: 6px; border-radius: 50%; border: 1px dashed rgba(255,255,255,.8); box-shadow: 0 1px 2px rgba(0,0,0,.5); }
.th-recent { position: absolute; top: 8px; right: 8px; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; z-index: 4; pointer-events: none; max-width: 42%; }
.th-recent span { font-size: 9.5px; background: rgba(0,0,0,.35); border-radius: 5px; padding: 0 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; opacity: .75; }
.th-recent span.latest { opacity: 1; outline: 1px solid rgba(243,196,107,.6); }

/* seats */
.th-seat { position: absolute; transform: translate(-50%, -50%); width: 72px; display: flex; flex-direction: column; align-items: center; z-index: 5; transition: opacity .3s; }
.th-seat.empty { width: 56px; }
.th-seat.empty .th-sn { font-size: 10px; opacity: .65; margin-top: 2px; }
.th-av { position: relative; width: 44px; height: 44px; }
.th-av .av.sm { width: 44px; height: 44px; border: 2px solid rgba(255,255,255,.65); font-size: 15px; }
.th-seat.me .th-av .av.sm { border-color: var(--gold); }
.th-ring { position: absolute; inset: -5px; width: 54px; height: 54px; transform: rotate(-90deg); pointer-events: none; display: none; }
.th-ring circle { fill: none; stroke: var(--gold); stroke-width: 3; stroke-dasharray: 103.7; stroke-dashoffset: 0; stroke-linecap: round; transition: stroke-dashoffset .2s linear, stroke .3s; filter: drop-shadow(0 0 4px rgba(243,196,107,.9)); }
.th-ring.low circle { stroke: #ff5a6e; filter: drop-shadow(0 0 4px rgba(255,90,110,.9)); }
.th-seat.turn .th-ring { display: block; }
.th-seat.turn .th-box { border-color: var(--gold); box-shadow: 0 0 10px rgba(243,196,107,.6); }
.th-box { margin-top: -6px; position: relative; z-index: 2; min-width: 64px; max-width: 78px; background: rgba(16,4,8,.88); border: 1px solid rgba(243,196,107,.35); border-radius: 8px; padding: 1px 6px; text-align: center; line-height: 1.25; }
.th-nm { font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: .9; }
.th-stack { font-size: 11.5px; font-weight: 800; color: var(--gold); font-variant-numeric: tabular-nums; }
.th-stack em { font-style: normal; font-size: 10px; color: #ffd9df; font-weight: 700; }
.th-pos { position: absolute; top: -6px; left: -14px; font-size: 8.5px; font-weight: 900; padding: 1px 4px; border-radius: 4px; background: #2b2b2b; color: #fff; border: 1px solid rgba(255,255,255,.35); z-index: 3; white-space: nowrap; letter-spacing: .2px; font-style: normal; }
.th-pos.btn { background: #fffaf2; color: #151214; border-color: #d9a441; }
.th-pos.sb { background: #1d4ed8; }
.th-pos.bb { background: #c0283c; }
.th-pos.mid { background: rgba(60,20,28,.95); }
.th-act { position: absolute; top: -20px; left: 50%; transform: translateX(-50%); font-size: 10px; font-weight: 800; padding: 1px 7px; border-radius: 999px; background: rgba(0,0,0,.75); white-space: nowrap; animation: pop .25s var(--ease); z-index: 4; }
.th-act.a-raise, .th-act.a-bet { background: #b42333; }
.th-act.a-call, .th-act.a-check { background: #1f7a4d; }
.th-act.a-allin { background: var(--gold); color: #3b2200; }
.th-act.a-fold { background: #4b4b4b; }
.th-act.a-straddle, .th-act.a-post { background: #6d28d9; }
.th-allin { position: absolute; bottom: -2px; right: -16px; font-size: 8px; font-weight: 900; padding: 0 4px; border-radius: 4px; background: var(--gold); color: #3b2200; z-index: 3; }
.th-hole { position: absolute; top: -6px; left: 50%; display: flex; z-index: 1; transform: translateX(-2px); }
.th-hole .pcard.mini { width: 20px; height: 28px; }
.th-hole .pcard + .pcard { margin-left: -9px; transform: rotate(10deg) translateY(1px); }
.th-hole .pcard:first-child { transform: rotate(-6deg); }
.th-hole.up { top: auto; bottom: 22px; left: 50%; transform: translateX(-50%); z-index: 6; }
.th-hole.up .pcard + .pcard { margin-left: -12px; }
.th-hole.folded { opacity: .35; }
.pcard.small { width: 30px; height: 42px; border-radius: 5px; padding: 2px 3px; }
.pcard.small b { font-size: 11px; } .pcard.small i { font-size: 9px; } .pcard.small u { font-size: 13px; right: 2px; bottom: 1px; }
.th-seat.folded .th-av, .th-seat.folded .th-box { opacity: .45; }
.th-seat.away .th-av { opacity: .5; filter: grayscale(.6); }
.th-seat.win .th-av .av.sm { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(243,196,107,.5), 0 0 18px rgba(243,196,107,.9); animation: glow 1.2s ease-in-out infinite; }
.th-best { margin-top: 2px; font-size: 9.5px; font-weight: 800; background: rgba(0,0,0,.7); border-radius: 5px; padding: 0 5px; white-space: nowrap; }
.th-best.w { background: var(--gold); color: #3b2200; }
.th-seat .snet { position: absolute; top: -26px; left: 50%; transform: translate(-50%, 0); bottom: auto; font-weight: 900; font-size: 12px; padding: 0 6px; border-radius: 6px; animation: thRise 2.6s var(--ease) forwards; z-index: 8; white-space: nowrap; }
@keyframes thRise { 0% { opacity: 0; transform: translate(-50%, 10px); } 15% { opacity: 1; transform: translate(-50%, -6px); } 85% { opacity: 1; } 100% { opacity: .9; transform: translate(-50%, -12px); } }
.th-seat .sit-btn { width: 40px; height: 40px; }
.th-seat .bot-add { top: -10px; right: 0; }
.th-seat .bot-del { top: -6px; right: -12px; }
.th-seat .vbadge { right: -8px; bottom: 6px; }

/* my cards */
.th-mine { position: absolute; transform: translate(0, -50%); z-index: 7; display: flex; flex-direction: column; align-items: flex-start; pointer-events: none; }
.th-mc { display: flex; }
.th-mc .pcard.big { width: 46px; height: 64px; box-shadow: 0 4px 12px rgba(0,0,0,.5); }
.th-mc .pcard + .pcard { margin-left: -12px; transform: rotate(7deg) translateY(2px); }
.th-mc .pcard:first-child { transform: rotate(-5deg); }
.th-mine.folded .th-mc { opacity: .4; filter: grayscale(.5); }
.th-mh { margin-top: 3px; font-size: 10.5px; font-weight: 800; background: rgba(0,0,0,.7); border: 1px solid rgba(243,196,107,.45); color: var(--gold); border-radius: 6px; padding: 0 6px; white-space: nowrap; }

/* controls: the table keeps one size; the panel under it has a fixed height */
.bj.th { --bj-bottom: 192px; }
@media (min-height: 860px) { .bj.th { --bj-bottom: 206px; } }
.bj.th .th-ctl { flex: 1 1 0; min-height: 0; overflow-y: auto; }
.th-ctl { flex: none; background: var(--surface); padding: 8px 10px calc(8px); border-top: 1px solid var(--line); }
.th-acts { display: grid; grid-template-columns: 1fr 1.25fr 1.25fr; gap: 8px; }
.th-acts .btn { padding: 13px 4px; font-size: 15px; font-weight: 800; border-radius: 12px; }
.th-acts .btn b { font-variant-numeric: tabular-nums; }
.th-fold { background: #3b3236; color: #fff; }
.th-fold[data-soft] { opacity: .75; }
.th-call { background: #1f7a4d; color: #fff; }
.th-raise:disabled { opacity: .3; }
.th-sub { margin-top: 6px; }
.th-pre { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.th-pre label { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 4px; border-radius: 12px; border: 1.5px solid var(--line); background: var(--surface-2); font-size: 13px; font-weight: 700; cursor: pointer; text-align: center; }
.th-pre label.on { border-color: var(--gold); background: rgba(243,196,107,.16); }
.th-pre input { width: 16px; height: 16px; accent-color: #c99227; margin: 0; }
.th-size .th-presets { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-bottom: 6px; }
.th-size .th-presets .btn { padding: 4px 1px; font-size: 12px; display: flex; flex-direction: column; align-items: center; line-height: 1.15; min-width: 0; }
.th-size .th-presets .btn small { font-size: 9.5px; opacity: .7; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.th-size .th-presets .btn.allin { background: rgba(180,35,51,.14); color: var(--err); }
.th-size .th-presets .btn.on { background: var(--gold); color: #3b2200; }
.th-slide { display: flex; align-items: center; gap: 6px; margin-bottom: 6px; }
.th-amt { display: flex; align-items: center; gap: 3px; flex: none; }
.th-amt .input { width: 72px; padding: 6px 6px; text-align: right; font-weight: 800; font-variant-numeric: tabular-nums; }
.th-amt .input.bad { border-color: var(--err); }
.th-amt span { font-size: 11px; font-weight: 700; color: var(--muted); }
.th-lim { font-size: 11px; color: var(--muted); text-align: center; margin-top: 4px; }
.th-slide input { flex: 1; accent-color: #c99227; height: 28px; }
.th-slide .btn { width: 34px; font-size: 18px; padding: 3px 0; flex: none; }
.th-size .th-acts .btn { padding: 11px 4px; }
.th-size .th-acts { grid-template-columns: 1fr 2fr; }
.th-tools { flex-wrap: wrap; row-gap: 6px; margin-top: 6px; }
.th-tools .btn { padding: 5px 9px; font-size: 12px; }
.th-me-stack b { color: var(--text); font-variant-numeric: tabular-nums; }

/* run it more than once */
.th-rit { position: absolute; inset: 0; z-index: 30; display: flex; align-items: center; justify-content: center; background: rgba(10,2,5,.35); pointer-events: none; }
.th-rit-box { pointer-events: auto; width: min(330px, 90%); background: rgba(24,6,11,.96); border: 1.5px solid var(--gold); border-radius: 16px; padding: 14px; color: #fff; text-align: center; box-shadow: 0 16px 40px rgba(0,0,0,.6); animation: zin .25s var(--ease); }
.th-rit-t { font-size: 18px; font-weight: 900; color: var(--gold); }
.th-rit-s { font-size: 11.5px; opacity: .8; margin: 4px 0 10px; }
.th-rit-b { display: flex; gap: 8px; }
.th-rit-b .btn { flex: 1; padding: 12px 0; font-size: 15px; font-weight: 800; }
.th-rit-done { font-size: 13px; padding: 10px 0; }
.th-rit-who { display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; margin-top: 10px; }
.th-rit-who span { font-size: 11px; background: rgba(255,255,255,.08); border-radius: 999px; padding: 1px 8px; }
.th-rit-who span.ok { background: rgba(31,122,77,.6); }
.th-rit-timer { font-size: 11px; opacity: .7; margin-top: 8px; }
.th-banner { top: 32%; font-size: 22px; }

/* buy-in */
.th-buy-amt { text-align: center; margin: 12px 0 4px; }
.th-buy-amt b { font-size: 30px; font-weight: 900; font-variant-numeric: tabular-nums; }
.th-buy-amt span { display: block; font-size: 12px; color: var(--muted); }
.th-buy input[type=range] { width: 100%; accent-color: #c99227; height: 30px; }
.th-buy-q { display: flex; gap: 6px; margin: 6px 0 4px; }
.th-buy-q .btn { flex: 1; }

/* history */
.th-hist { border: 1px solid var(--line); border-radius: 12px; padding: 8px 10px; margin-bottom: 8px; background: var(--surface-2); }
.th-hist summary { display: flex; align-items: center; gap: 6px; cursor: pointer; list-style: none; }
.th-hist summary::-webkit-details-marker { display: none; }
.th-hist .red { color: #c0283c; }
.th-hrow { margin-top: 3px; }
.th-hrow .th-pos { position: static; display: inline-block; margin-right: 3px; }
.th-log { margin-top: 6px; font-size: 11.5px; color: var(--muted); display: flex; flex-direction: column; gap: 2px; }
.th-log b { color: var(--text); margin-right: 4px; }

/* 3D labels */
.th3d-mine { position: absolute; left: 10px; bottom: 84px; z-index: 6; pointer-events: none; display: flex; flex-direction: column; align-items: flex-start; }
.th3d-mine .th-mc.folded { opacity: .45; }
.th .l3 .th-pos { position: static; display: inline-block; margin-right: 4px; vertical-align: 1px; }
.th .l3.ntag .stk { font-size: 11px; color: var(--gold); background: rgba(20,6,10,.78); border-radius: 999px; padding: 0 7px; }
.th .l3 .act { font-style: normal; font-size: 10px; font-weight: 800; background: rgba(0,0,0,.75); border-radius: 999px; padding: 0 7px; }
.th .l3 .act.a-raise, .th .l3 .act.a-bet { background: #b42333; } .th .l3 .act.a-call, .th .l3 .act.a-check { background: #1f7a4d; } .th .l3 .act.a-allin { background: var(--gold); color: #3b2200; }
.th .l3.pot { font-size: 12px; font-weight: 800; background: rgba(0,0,0,.55); border: 1px solid rgba(243,196,107,.5); border-radius: 999px; padding: 1px 10px; }
.th .l3.bet { font-size: 11px; font-weight: 800; background: rgba(0,0,0,.6); border-radius: 999px; padding: 0 6px; }
.th .l3.dbtn { width: 20px; height: 20px; border-radius: 50%; background: #fffaf2; color: #151214; font-size: 11px; font-weight: 900; display: flex; align-items: center; justify-content: center; box-shadow: inset 0 0 0 2px #d9a441; transform-origin: center; }

@media (max-width: 380px) {
  .th-seat { width: 64px; }
  .th-av, .th-av .av.sm { width: 38px; height: 38px; }
  .th-ring { width: 48px; height: 48px; }
  .th-board .pcard.mid, .th-slot { width: 34px; height: 48px; }
  .th-mc .pcard.big { width: 40px; height: 56px; }
  .th-acts .btn { font-size: 14px; padding: 12px 2px; }
}
@media (min-width: 720px) {
  .th-board .pcard.mid, .th-slot { width: 48px; height: 67px; }
  .th-center { width: 320px; }
}
.th .bj-chat:not(.open) { max-width: 44%; }
.th .th-recent { max-width: 36%; }
.mode3d.th-unit { bottom: 44px; }
.th3d-stack { margin-top: 4px; font-size: 11px; background: rgba(16,4,8,.85); border: 1px solid rgba(243,196,107,.4); border-radius: 999px; padding: 1px 8px; color: #fff; }
.th3d-stack b { color: var(--gold); }
.th3d-stack .th-pos { position: static; display: inline-block; margin-right: 4px; }
.th .l3.bet { color: #fff; border: 1px solid rgba(243,196,107,.55); }
#thSub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }