:root {
  color-scheme: dark;
  --ink: #f5f7f1;
  --muted: #a9b8ab;
  --line: rgba(224, 248, 227, .13);
  --paper: rgba(10, 22, 16, .84);
  --gold: #f4c855;
  --gold-deep: #c28a24;
  --mint: #87e7b0;
  --danger: #ef6b71;
  --felt: #0f6b46;
  --felt-deep: #063d2a;
  --shadow: 0 26px 80px rgba(0, 0, 0, .44);
}
* { box-sizing: border-box; }
html { min-height: 100%; background: #07140f; }
body { min-height: 100vh; margin: 0; color: var(--ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: radial-gradient(circle at 18% 7%, rgba(69, 135, 83, .18), transparent 32%), radial-gradient(circle at 84% 20%, rgba(212, 166, 51, .11), transparent 30%), linear-gradient(145deg, #07140f, #0a2015 50%, #06100c); }
button, input { font: inherit; }
button { cursor: pointer; }
.poker-shell { width: min(1260px, 100%); margin: 0 auto; padding: 34px 20px; }
.poker-card { position: relative; overflow: hidden; border: 1px solid var(--line); border-radius: 32px; padding: clamp(20px, 3vw, 34px); background: linear-gradient(135deg, rgba(17, 36, 25, .94), rgba(5, 17, 11, .92)); box-shadow: var(--shadow); }
.poker-card::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .34; background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.02) 1px, transparent 1px); background-size: 22px 22px; mask-image: linear-gradient(to bottom, black, transparent 70%); }
.poker-header, .game-bottom, .poker-footer { position: relative; z-index: 1; }
.poker-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; padding-bottom: 24px; }
.header-copy-block { max-width: 660px; }
.nav-link { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 16px; color: #c3e8ce; font-size: .84rem; font-weight: 750; text-decoration: none; }
.nav-link:hover { color: #fff4bf; }
.eyebrow { margin: 0 0 6px; color: #92caa3; font-size: .69rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
h1, h2, p { margin-top: 0; }
h1 { margin-bottom: 8px; font-size: clamp(2rem, 5vw, 3.65rem); line-height: .94; letter-spacing: -.065em; }
h1 span { color: var(--gold); }
.header-copy { max-width: 590px; margin-bottom: 0; color: var(--muted); line-height: 1.55; }
.header-stats { display: grid; grid-template-columns: repeat(3, minmax(108px, 1fr)); gap: 9px; min-width: min(100%, 402px); }
.stat-card, .bankroll { padding: 12px 14px; border: 1px solid rgba(224, 248, 227, .12); border-radius: 15px; background: rgba(255,255,255,.045); }
.stat-card span, .bankroll span { display: block; color: #9eb9a5; font-size: .65rem; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.stat-card strong, .bankroll strong { display: block; margin-top: 4px; color: #ffffff; font-size: 1.07rem; letter-spacing: -.03em; }
.bankroll { border-color: rgba(244, 200, 85, .35); background: linear-gradient(135deg, rgba(244,200,85,.13), rgba(244,200,85,.035)); }
.bankroll strong { color: #fff1ba; font-size: 1.32rem; }
.table-stage { position: relative; min-height: 610px; isolation: isolate; overflow: hidden; border: 1px solid rgba(231, 255, 234, .15); border-radius: 28px; background: linear-gradient(125deg, rgba(80, 105, 73, .18), rgba(4, 17, 11, .65)); box-shadow: inset 0 1px rgba(255,255,255,.08); }
.table-ambient { position: absolute; z-index: -1; width: 420px; height: 420px; border-radius: 50%; filter: blur(22px); opacity: .18; }
.ambient-one { top: -220px; left: -170px; background: #63c794; }
.ambient-two { right: -160px; bottom: -260px; background: #f1ba40; }
.felt { position: absolute; inset: 112px 12% 124px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 15px solid #a07429; border-radius: 49%; background: radial-gradient(ellipse at 50% 28%, #27865a, #0f5f3f 42%, #083d2a 100%); box-shadow: inset 0 0 0 2px rgba(255, 239, 175, .42), inset 0 -26px 44px rgba(0,0,0,.25), 0 24px 36px rgba(0,0,0,.28); }
.felt::before { content: ""; position: absolute; inset: 14px; border: 1px dashed rgba(244, 219, 135, .43); border-radius: inherit; pointer-events: none; }
.felt-line { position: absolute; width: 57%; height: 51%; border: 1px solid rgba(255, 241, 183, .45); border-radius: 50%; opacity: .6; }
.deck-stack { position: absolute; z-index: 6; top: 50%; left: 21%; width: 50px; height: 70px; transform: translateY(-50%) rotate(-7deg); filter: drop-shadow(0 7px 7px rgba(0,0,0,.32)); }
.deck-stack i { position: absolute; inset: 0; border: 2px solid #e9d7a5; border-radius: 8px; background: repeating-linear-gradient(45deg, #912f3d 0 5px, #f5ddc0 5px 8px); }
.deck-stack i:nth-child(1) { transform: translate(-7px, 7px); opacity: .5; }.deck-stack i:nth-child(2) { transform: translate(-3px, 3px); opacity: .78; }.deck-stack i:nth-child(3) { box-shadow: inset 0 0 0 4px #7b1d2e; }
.deck-stack span { position: absolute; z-index: 1; left: 50%; top: 50%; transform: translate(-50%, -50%); color: rgba(255,255,255,.86); font-size: .55rem; font-weight: 950; letter-spacing: .11em; }
.deck-stack.dealing { animation: deckDeal .28s ease-out; }
@keyframes deckDeal { 0% { transform: translateY(-50%) rotate(-7deg); } 55% { transform: translateY(-50%) translateX(24px) rotate(2deg) scale(1.04); } 100% { transform: translateY(-50%) rotate(-7deg); } }
.street-tracker { position: absolute; z-index: 7; top: 18px; left: 50%; display: flex; align-items: center; gap: 6px; transform: translateX(-50%); padding: 7px; border: 1px solid rgba(255,255,255,.09); border-radius: 999px; background: rgba(4, 17, 11, .62); backdrop-filter: blur(8px); }
.street-step { display: inline-flex; align-items: center; min-height: 26px; padding: 0 8px; border-radius: 999px; color: rgba(223, 240, 224, .58); font-size: .62rem; font-weight: 850; white-space: nowrap; }
.street-step.is-current { color: #0d2419; background: var(--gold); box-shadow: 0 5px 13px rgba(244,200,85,.24); }.street-step.is-complete { color: #d9f5dd; }
.pot-wrap { position: absolute; z-index: 2; top: 19%; left: 50%; transform: translateX(-50%); padding: 8px 16px 9px; border: 1px solid rgba(255, 238, 169, .34); border-radius: 14px; color: #fff5ca; text-align: center; background: rgba(4, 26, 16, .66); box-shadow: 0 10px 20px rgba(0,0,0,.18); }
.pot-wrap span, .pot-wrap small { display: block; font-size: .59rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }.pot-wrap span { color: #b7d9bd; }.pot-wrap strong { display: block; margin: 2px 0; color: #fff0b8; font-size: 1.25rem; letter-spacing: -.04em; }.pot-wrap small { color: rgba(223,241,224,.56); font-size: .48rem; }
.street-pill { position: absolute; z-index: 2; top: 42%; left: 50%; transform: translateX(-50%); padding: 5px 11px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; color: #d9f1dd; font-size: .66rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; background: rgba(3, 31, 18, .48); }
.board { position: relative; z-index: 3; display: flex; gap: 9px; margin-top: 40px; }
.card-face, .card-back, .card-placeholder { position: relative; display: grid; width: 56px; height: 78px; overflow: hidden; flex: 0 0 auto; place-items: center; border-radius: 9px; box-shadow: 0 8px 13px rgba(0,0,0,.24); }
.card-face { color: #11151a; border: 1px solid #e5e1d8; background: linear-gradient(145deg, #ffffff, #e8eee9); font-family: Georgia, "Times New Roman", serif; font-weight: 900; }.card-face.red { color: #c42337; }.card-face .rank { position: absolute; top: 7px; left: 7px; font-size: 1.2rem; line-height: .9; }.card-face .suit { font-size: 1.92rem; line-height: 1; }.card-face .corner { top: auto; right: 7px; bottom: 7px; left: auto; transform: rotate(180deg); }.card-back { border: 2px solid #f3dca3; background: repeating-linear-gradient(45deg, #9b2f41 0 5px, #f5e0bb 5px 8px); box-shadow: inset 0 0 0 4px #6e1d2f, 0 8px 13px rgba(0,0,0,.24); }.card-placeholder { border: 1px dashed rgba(229,247,231,.3); background: rgba(4, 38, 23, .22); box-shadow: none; }
.card-face.dealt, .card-back.dealt { animation: cardDeal .4s cubic-bezier(.22,.93,.35,1.08) both; }.card-face.reveal { animation: cardReveal .46s ease both; }
@keyframes cardDeal { 0% { opacity: 0; transform: translate(-160px, -70px) rotate(-15deg) scale(.55); } 100% { opacity: 1; transform: translate(0) rotate(0) scale(1); } }
@keyframes cardReveal { 0% { transform: perspective(380px) rotateY(90deg); opacity: .2; } 100% { transform: perspective(380px) rotateY(0); opacity: 1; } }
.table-note { position: absolute; z-index: 3; bottom: 15%; left: 50%; width: min(78%, 500px); transform: translateX(-50%); color: rgba(236, 255, 238, .82); font-size: .8rem; line-height: 1.4; text-align: center; }
.turn-queue { position: absolute; z-index: 4; bottom: 6%; left: 50%; display: flex; justify-content: center; gap: 5px; width: min(83%, 530px); transform: translateX(-50%); }.queue-pill { padding: 4px 7px; border: 1px solid rgba(226,245,229,.14); border-radius: 999px; color: rgba(235,251,237,.65); font-size: .57rem; font-weight: 850; background: rgba(3,30,18,.3); }.queue-pill.current { color: #0a2115; border-color: transparent; background: #d6f2bd; }.queue-pill.folded { opacity: .36; text-decoration: line-through; }
.table-flash { position: absolute; inset: 0; z-index: 8; border-radius: inherit; pointer-events: none; opacity: 0; }.table-flash.chips { animation: tableFlashGold .55s ease-out; }.table-flash.fold { animation: tableFlashRed .5s ease-out; }.table-flash.win { animation: tableFlashWin .8s ease-out; }.table-flash.lose { animation: tableFlashRed .7s ease-out; }
@keyframes tableFlashGold { 0% { opacity: .45; box-shadow: inset 0 0 0 3px rgba(255, 224, 130, .8); } 100% { opacity: 0; box-shadow: inset 0 0 70px rgba(255, 224, 130, 0); } }
@keyframes tableFlashRed { 0% { opacity: .42; box-shadow: inset 0 0 0 3px rgba(240, 85, 89, .8); } 100% { opacity: 0; } }
@keyframes tableFlashWin { 0% { opacity: .75; background: radial-gradient(circle at 50% 50%, rgba(255,234,147,.46), transparent 48%); } 100% { opacity: 0; } }
.seat { position: absolute; z-index: 5; display: flex; align-items: center; gap: 9px; min-width: 174px; padding: 10px 12px; border: 1px solid rgba(255,255,255,.12); border-radius: 17px; background: rgba(2, 15, 9, .73); box-shadow: 0 12px 23px rgba(0,0,0,.22); transition: transform .2s ease, opacity .2s ease, border-color .2s ease, box-shadow .2s ease; }
.seat-top { top: 58px; left: 50%; transform: translateX(-50%); }.seat-left { top: 48%; left: 18px; transform: translateY(-50%); }.seat-right { top: 48%; right: 18px; transform: translateY(-50%); }
.seat.folded { opacity: .38; filter: grayscale(.9); }.seat.active { border-color: rgba(255, 215, 105, .9); box-shadow: 0 0 0 4px rgba(255,215,105,.12), 0 13px 26px rgba(0,0,0,.25); }.seat.thinking { animation: thinker 1.1s ease-in-out infinite; }.seat.all-in { border-color: rgba(135, 231, 176, .8); }
@keyframes thinker { 0%,100% { transform: translateY(-50%); } 50% { transform: translateY(calc(-50% - 3px)); } }.seat-top.thinking { animation-name: thinkerTop; }@keyframes thinkerTop {0%,100% { transform: translateX(-50%); } 50% { transform: translateX(-50%) translateY(-3px); } }
.avatar { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 50%; color: #102319; font-size: .88rem; font-weight: 950; }.avatar-mara { background: linear-gradient(135deg, #f1c8dc, #bdeacd); }.avatar-kai { background: linear-gradient(135deg, #bde1ff, #e4f0bf); }.avatar-nori { background: linear-gradient(135deg, #ffd8a8, #f1b3c8); }.avatar.you { color: #402903; background: linear-gradient(135deg, #ffeaa5, #d9a431); }
.seat-copy strong, .seat-copy small { display: block; }.seat-copy strong { font-size: .86rem; }.seat-copy small { margin-top: 2px; color: var(--muted); font-size: .68rem; }.status-dot { width: 8px; height: 8px; margin-left: auto; border-radius: 50%; background: #69e09a; box-shadow: 0 0 0 4px rgba(105,224,154,.12); }.seat.folded .status-dot { background: #7f8d82; box-shadow: none; }
.seat-action { position: absolute; top: calc(100% + 7px); left: 50%; max-width: 164px; overflow: hidden; transform: translateX(-50%); padding: 4px 8px; border: 1px solid rgba(255,255,255,.11); border-radius: 999px; color: #cfe8d4; font-size: .58rem; font-weight: 900; text-align: center; text-overflow: ellipsis; white-space: nowrap; background: rgba(3,22,13,.9); }.seat-action.is-fold { color: #ffb2b5; border-color: rgba(239,107,113,.32); }.seat-action.is-bet { color: #ffecb4; border-color: rgba(244,200,85,.36); }.seat-action.is-call { color: #bff4d1; border-color: rgba(135,231,176,.32); }
.seat-marker { position: absolute; top: -10px; left: 11px; display: none; padding: 3px 5px; border-radius: 5px; color: #1d1807; font-size: .54rem; font-weight: 950; background: var(--gold); box-shadow: 0 4px 8px rgba(0,0,0,.22); }.seat-marker.is-visible { display: inline-flex; }
.seat-cards { position: absolute; right: 9px; bottom: calc(100% + 9px); display: flex; gap: 4px; }.seat-cards .card-face, .seat-cards .card-back, .seat-cards .card-placeholder { width: 28px; height: 39px; border-radius: 5px; }.seat-cards .card-face .rank { top: 3px; left: 4px; font-size: .54rem; }.seat-cards .card-face .suit { font-size: .92rem; }.seat-cards .card-face .corner { top: auto; right: 4px; bottom: 3px; left: auto; }
.hero-seat { position: absolute; z-index: 6; bottom: 17px; left: 50%; display: flex; align-items: center; justify-content: space-between; gap: 15px; width: min(570px, calc(100% - 34px)); transform: translateX(-50%); padding: 12px 14px; border: 1px solid rgba(255,211,106,.48); border-radius: 19px; background: rgba(2, 13, 8, .83); box-shadow: 0 14px 25px rgba(0,0,0,.25); }.hero-seat.active { box-shadow: 0 0 0 4px rgba(255,215,105,.13), 0 14px 25px rgba(0,0,0,.25); }.hero-name { display: flex; align-items: center; gap: 9px; }.hero-name strong, .hero-name small { display: block; }.hero-name strong { font-size: .92rem; }.hero-name small { margin-top: 2px; color: var(--muted); font-size: .7rem; }.hero-action { top: auto; right: auto; bottom: calc(100% + 7px); left: 50%; }.hole-cards { display: flex; gap: 8px; }
.game-bottom { display: grid; grid-template-columns: minmax(0, 1.22fr) minmax(300px, .78fr); gap: 18px; padding-top: 20px; }.control-panel, .hand-log { min-height: 268px; padding: 20px; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.045); }.control-topline { display: flex; gap: 18px; justify-content: space-between; }.action-copy { max-width: 520px; }h2 { margin-bottom: 8px; font-size: 1.36rem; letter-spacing: -.035em; }.action-copy p:last-child { margin-bottom: 16px; color: var(--muted); line-height: 1.45; }
.timer-card { display: flex; align-items: center; gap: 10px; min-width: 152px; padding: 8px; border: 1px solid rgba(222,245,225,.12); border-radius: 16px; background: rgba(3,25,15,.36); }.timer-card b, .timer-card small { display: block; }.timer-card b { color: #dff2e1; font-size: .7rem; }.timer-card small { margin-top: 3px; color: #90a996; font-size: .61rem; }.timer-ring { --progress: 0; position: relative; display: grid; width: 42px; height: 42px; flex: 0 0 auto; place-items: center; border-radius: 50%; color: #e0f4e4; background: conic-gradient(var(--mint) calc(var(--progress) * 1%), rgba(255,255,255,.09) 0); }.timer-ring::before { content: ""; position: absolute; width: 34px; height: 34px; border-radius: inherit; background: #10251a; }.timer-ring strong { position: relative; font-size: .74rem; }.timer-card.is-live { border-color: rgba(135,231,176,.32); }.timer-card.is-warning { border-color: rgba(239,107,113,.62); }.timer-card.is-warning .timer-ring { background: conic-gradient(var(--danger) calc(var(--progress) * 1%), rgba(255,255,255,.09) 0); }
.raise-tray { display: grid; grid-template-columns: auto minmax(180px, 1fr); align-items: center; gap: 16px; margin: 8px 0 14px; padding: 10px 11px; border: 1px solid rgba(230,247,232,.11); border-radius: 15px; background: rgba(3,28,17,.36); transition: opacity .15s ease; }.raise-tray.is-disabled { opacity: .45; }.raise-presets { display: flex; flex-wrap: wrap; gap: 6px; }.chip-preset { min-width: 54px; padding: 7px 9px; border: 1px solid rgba(244,200,85,.33); border-radius: 999px; color: #fff0ba; font-size: .69rem; font-weight: 900; background: rgba(244,200,85,.1); }.chip-preset:hover:not(:disabled) { background: rgba(244,200,85,.2); }.range-row label { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 5px; color: #bcd6c0; font-size: .68rem; font-weight: 800; }.range-row output { color: #ffe8a0; }.range-row input { width: 100%; accent-color: var(--gold); }
.action-buttons { display: flex; flex-wrap: wrap; gap: 9px; }button { border: 0; transition: transform .15s ease, filter .15s ease, opacity .15s ease, background .15s ease; }button:hover:not(:disabled) { transform: translateY(-1px); filter: brightness(1.07); }button:disabled { cursor: not-allowed; opacity: .42; }.primary, .secondary, .danger { min-height: 44px; padding: 0 15px; border-radius: 12px; font-weight: 900; }.primary { color: #211804; background: var(--gold); }.secondary { color: #eaf5ec; border: 1px solid rgba(232,255,236,.18); background: rgba(232,255,236,.12); }.secondary.raised { color: #101a11; border-color: transparent; background: var(--mint); }.danger { color: #ffcbcd; border: 1px solid rgba(239,107,113,.48); background: rgba(152, 43, 50, .13); }.reset-link { margin-top: 14px; padding: 0; color: #9ec9ab; font-size: .78rem; background: transparent; text-decoration: underline; }
.hand-log { display: flex; flex-direction: column; }.log-heading { display: flex; align-items: baseline; gap: 9px; }.log-heading h2 { margin-bottom: 0; }.log-heading .eyebrow { margin-bottom: 0; }.live-status { margin-left: auto; padding: 4px 6px; border: 1px solid rgba(102,222,149,.3); border-radius: 999px; color: #bff5d0; font-size: .52rem; font-weight: 950; letter-spacing: .08em; background: rgba(102,222,149,.09); }.live-status.is-idle { color: #b6c6b9; border-color: rgba(255,255,255,.12); background: rgba(255,255,255,.04); }.hand-log ol { flex: 1; margin: 12px 0 0; padding-left: 20px; overflow: auto; color: #c7d8c9; font-size: .81rem; line-height: 1.45; }.hand-log li + li { margin-top: 7px; }.hand-log li.emphasis { color: #fff0b6; font-weight: 800; }
.poker-footer { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; padding-top: 22px; color: #9eafa1; font-size: .76rem; }
@media (max-width: 960px) { .header-stats { min-width: 0; }.felt { inset-inline: 8%; }.deck-stack { left: 16%; }.game-bottom { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .poker-shell { padding: 0; }.poker-card { min-height: 100vh; border-radius: 0; }.poker-header { flex-direction: column; }.header-stats { width: 100%; grid-template-columns: repeat(3, 1fr); }.table-stage { min-height: 655px; }.felt { inset: 148px 3% 130px; border-width: 10px; }.street-tracker { top: 17px; max-width: calc(100% - 20px); overflow-x: auto; }.street-step { padding: 0 7px; font-size: .56rem; }.deck-stack { top: 53%; left: 7%; transform: translateY(-50%) scale(.82); }.seat { min-width: 0; padding: 8px 9px; }.seat-copy small { display: none; }.seat-top { top: 75px; }.seat-left { top: 38%; left: 8px; transform: none; }.seat-right { top: 38%; right: 8px; transform: none; }.seat-left.thinking, .seat-right.thinking { animation-name: thinkerMobile; }@keyframes thinkerMobile {0%,100% {transform:none;}50% {transform:translateY(-3px);}}.seat-copy strong { font-size: .73rem; }.avatar { width: 29px; height: 29px; }.seat-cards { right: auto; bottom: calc(100% + 6px); left: 0; }.pot-wrap { top: 18%; }.street-pill { top: 43%; }.board { gap: 5px; margin-top: 38px; }.card-face, .card-back, .card-placeholder { width: 43px; height: 61px; border-radius: 7px; }.card-face .rank { top: 5px; left: 5px; font-size: .85rem; }.card-face .suit { font-size: 1.38rem; }.card-face .corner { top: auto; right: 5px; bottom: 5px; left: auto; }.table-note { bottom: 15%; font-size: .7rem; }.turn-queue { bottom: 6%; }.hero-seat { bottom: 12px; padding: 9px 10px; }.hero-name small { display: none; }.control-topline { flex-direction: column; }.timer-card { align-self: flex-start; }.raise-tray { grid-template-columns: 1fr; gap: 10px; }.action-buttons { display: grid; grid-template-columns: 1fr 1fr; }.primary { grid-column: span 2; } }
@media (max-width: 430px) { .header-stats { gap: 5px; }.stat-card, .bankroll { padding: 10px 9px; }.stat-card strong, .bankroll strong { font-size: .92rem; }.felt { inset-inline: 1.5%; }.street-step:nth-child(4) { display: none; }.seat-action { max-width: 102px; font-size: .51rem; }.turn-queue { gap: 3px; }.queue-pill { padding: 4px 5px; font-size: .51rem; }.board { gap: 3px; }.card-face, .card-back, .card-placeholder { width: 38px; height: 54px; }.hole-cards { gap: 5px; }.hero-seat { width: calc(100% - 18px); }.table-stage { min-height: 635px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } }


/* Payout animation + chip stacks (V3) */
.bankroll strong { display: inline-flex; align-items: center; gap: 8px; }
.bankroll strong b { font: inherit; }
.tiny-chip-stack, .seat-copy small::before, .hero-name small::before {
  position: relative;
  display: inline-block;
  width: 16px;
  height: 6px;
  flex: 0 0 auto;
  border: 1px solid rgba(255,248,218,.92);
  border-radius: 50%;
  background: repeating-conic-gradient(from 0deg, #d9a531 0 24deg, #fff1a9 24deg 40deg, #d9a531 40deg 64deg);
  box-shadow: 0 4px 0 -1px #3779b8, 0 4px 0 0 rgba(255,255,255,.55), 0 8px 0 -1px #c84f50, 0 8px 0 0 rgba(255,255,255,.48), 0 1px 7px rgba(0,0,0,.24);
}
.seat-copy small, .hero-name small { display: inline-flex; align-items: center; gap: 6px; }
.pot-wrap { min-width: 112px; }
.pot-stack { position: relative; display: block; width: 88px; height: 42px; margin: 1px auto -4px; opacity: 1; transform: scale(1); transform-origin: center bottom; transition: opacity .24s ease, transform .24s ease; }
.pot-stack.is-empty { opacity: .22; transform: scale(.72); }
.table-chip { position: absolute; left: 50%; width: 28px; height: 9px; border: 1px solid rgba(255,255,255,.8); border-radius: 50%; transform: translateX(-50%); box-shadow: inset 0 1px rgba(255,255,255,.55), 0 3px 0 rgba(0,0,0,.22); }
.table-chip::after { content: ""; position: absolute; inset: 2px 5px; border: 1px dashed rgba(255,255,255,.72); border-radius: inherit; }
.table-chip.chip-red { background: #ca5055; }
.table-chip.chip-blue { background: #3c7fbc; }
.table-chip.chip-gold { background: #d9a531; }
.pot-stack .table-chip:nth-child(1) { bottom: 0; margin-left: -22px; }
.pot-stack .table-chip:nth-child(2) { bottom: 4px; margin-left: 6px; }
.pot-stack .table-chip:nth-child(3) { bottom: 8px; margin-left: -7px; }
.pot-stack .table-chip:nth-child(4) { bottom: 12px; margin-left: 21px; }
.pot-stack .table-chip:nth-child(5) { bottom: 16px; margin-left: -24px; }
.pot-stack .table-chip:nth-child(6) { bottom: 20px; margin-left: 4px; }
.pot-stack .table-chip:nth-child(7) { bottom: 24px; margin-left: -10px; }
.pot-stack .table-chip:nth-child(8) { bottom: 28px; margin-left: 17px; }
.pot-stack .table-chip:nth-child(9) { bottom: 32px; margin-left: -2px; }
.chip-fx-layer { position: absolute; z-index: 12; inset: 0; overflow: hidden; pointer-events: none; }
.flying-chip { position: absolute; width: 24px; height: 24px; border: 2px dashed rgba(255,255,255,.84); border-radius: 50%; background: repeating-conic-gradient(from 0deg, #d9a531 0 24deg, #ffe89e 24deg 42deg, #d9a531 42deg 66deg); box-shadow: inset 0 0 0 4px rgba(78,41,4,.32), 0 3px 7px rgba(0,0,0,.34); animation: pokerChipFly 1.05s cubic-bezier(.2,.76,.19,1) forwards; will-change: transform, opacity; }
.flying-chip.is-blue { background: repeating-conic-gradient(from 0deg, #397fbb 0 24deg, #bde8ff 24deg 42deg, #397fbb 42deg 66deg); }
.flying-chip.is-red { background: repeating-conic-gradient(from 0deg, #c95358 0 24deg, #ffbfc1 24deg 42deg, #c95358 42deg 66deg); }
@keyframes pokerChipFly { 0% { opacity: 0; transform: translate(0, 0) scale(.45) rotate(var(--rot)); } 15% { opacity: 1; } 68% { opacity: 1; transform: translate(calc(var(--tx) * .78), calc(var(--ty) * .72 - 18px)) scale(1.08) rotate(calc(var(--rot) + 165deg)); } 100% { opacity: 0; transform: translate(var(--tx), var(--ty)) scale(.72) rotate(calc(var(--rot) + 290deg)); } }
.pot-wrap.is-paying .pot-stack { animation: potLift .44s ease-in-out alternate 2; }
@keyframes potLift { to { transform: translateY(-5px) scale(1.05); } }
.next-hand-card { display: flex; align-items: center; gap: 10px; min-width: 152px; padding: 8px; border: 1px solid rgba(244,200,85,.38); border-radius: 16px; color: #fdf5cf; background: rgba(75,56,8,.2); }
.next-hand-card[hidden] { display: none; }
.next-hand-number { display: grid; width: 42px; height: 42px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(255,239,165,.7); border-radius: 50%; color: #2e2207; font-size: .94rem; font-weight: 950; background: #f4c855; box-shadow: 0 0 0 4px rgba(244,200,85,.11); }
.next-hand-card b, .next-hand-card small { display: block; }
.next-hand-card b { color: #fff1b0; font-size: .7rem; }
.next-hand-card small { margin-top: 3px; color: #e4d8a4; font-size: .61rem; }
.next-hand-card.is-last-call .next-hand-number { animation: nextPulse .72s ease-in-out infinite; }
@keyframes nextPulse { 50% { transform: scale(1.12); box-shadow: 0 0 0 8px rgba(244,200,85,.08); } }
.seat.is-payout-target, .hero-seat.is-payout-target { animation: winnerGlow 1.2s ease-in-out 2; }
@keyframes winnerGlow { 50% { box-shadow: 0 0 0 5px rgba(244,200,85,.18), 0 0 28px rgba(244,200,85,.3); } }
@media (max-width: 760px) { .next-hand-card { align-self: flex-start; } .pot-stack { transform: scale(.82); margin-top: -3px; } .seat-copy small::before, .hero-name small::before { width: 13px; } }


/* V4 — shadowed showdown table, full pot pile, and central next-hand countdown */
.table-stage { isolation: isolate; }
.felt { overflow: hidden; box-shadow: inset 0 0 0 1px rgba(255,255,255,.04), inset 0 0 74px rgba(0,0,0,.5), 0 22px 42px rgba(0,0,0,.42); }
.felt::before { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0; opacity: .55; background: radial-gradient(ellipse at 50% 48%, transparent 27%, rgba(0,0,0,.28) 69%, rgba(0,0,0,.58) 100%); }
.felt > :not(.table-shadow):not(.showdown-overlay):not(.chip-fx-layer) { position: relative; z-index: 1; }
.table-shadow { position: absolute; z-index: 16; inset: 0; opacity: 0; pointer-events: none; background: radial-gradient(circle at 50% 48%, rgba(2,12,8,.06) 0 14%, rgba(2,9,6,.64) 58%, rgba(0,0,0,.82) 100%); backdrop-filter: blur(1.5px) saturate(.72); transition: opacity .34s ease; }
.table-stage.is-showdown .table-shadow { opacity: 1; }
.table-stage.is-showdown .seat, .table-stage.is-showdown .hero-seat, .table-stage.is-showdown .deck-stack, .table-stage.is-showdown .street-tracker { filter: brightness(.62) saturate(.68); transition: filter .3s ease; }
.table-stage.is-showdown .felt { box-shadow: inset 0 0 100px rgba(0,0,0,.85), 0 22px 42px rgba(0,0,0,.54); }

.pot-wrap { z-index: 4 !important; min-width: 142px; transform: translateY(-2px); }
.pot-cluster { position: relative; width: 130px; height: 68px; margin: 1px auto -8px; transform-style: preserve-3d; perspective: 300px; transition: opacity .28s ease, transform .28s ease, filter .28s ease; }
.pot-cluster.is-empty { opacity: .18; transform: translateY(6px) scale(.68); filter: grayscale(.85); }
.pot-cluster.is-paying { animation: potClusterRattle .46s ease-in-out both; }
.pot-chip { position: absolute; left: 50%; bottom: calc(1px + var(--lift, 0px)); width: 34px; height: 13px; border: 1px solid rgba(255,255,255,.78); border-radius: 50%; transform: translateX(calc(-50% + var(--x, 0px))) rotateX(58deg) rotateZ(var(--spin, 0deg)); background: var(--chip-color, repeating-conic-gradient(from 0deg, #c64e54 0 24deg, #ffd0cd 24deg 41deg, #c64e54 41deg 66deg)); box-shadow: inset 0 1px 1px rgba(255,255,255,.68), inset 0 -3px 2px rgba(0,0,0,.18), 0 4px 0 rgba(0,0,0,.26), 0 8px 10px rgba(0,0,0,.24); will-change: transform, opacity; }
.pot-chip::before { content: ""; position: absolute; inset: 2px 6px; border: 1px dashed rgba(255,255,255,.74); border-radius: inherit; opacity: .96; }
.pot-chip::after { content: ""; position: absolute; left: 2px; right: 2px; bottom: -3px; height: 4px; border-radius: 0 0 50% 50%; background: rgba(0,0,0,.26); filter: blur(.35px); }
.pot-chip.chip-red { --chip-color: repeating-conic-gradient(from 0deg, #bf454f 0 23deg, #ffd7d3 23deg 41deg, #bf454f 41deg 66deg); }
.pot-chip.chip-blue { --chip-color: repeating-conic-gradient(from 0deg, #286da6 0 23deg, #c7ecff 23deg 41deg, #286da6 41deg 66deg); }
.pot-chip.chip-gold { --chip-color: repeating-conic-gradient(from 0deg, #c79628 0 23deg, #fff0aa 23deg 41deg, #c79628 41deg 66deg); }
.pot-chip.chip-black { --chip-color: repeating-conic-gradient(from 0deg, #151a22 0 23deg, #d7dee6 23deg 41deg, #151a22 41deg 66deg); }
.pot-cluster.is-paying .pot-chip { animation: potChipJitter .34s ease-in-out infinite alternate; animation-delay: calc(var(--i, 0) * -23ms); }
@keyframes potClusterRattle { 0% { transform: translateY(-2px) scale(1); } 26% { transform: translateY(-7px) rotate(-1.2deg) scale(1.08); } 54% { transform: translateY(-3px) rotate(1.4deg) scale(1.03); } 100% { transform: translateY(-2px) scale(1); } }
@keyframes potChipJitter { to { transform: translateX(calc(-50% + var(--x, 0px))) translateY(-4px) rotateX(58deg) rotateZ(calc(var(--spin, 0deg) + 9deg)); } }

.flying-chip.payout-chip { width: 31px; height: 31px; border: 2px dashed rgba(255,255,255,.92); background: var(--pay-color, repeating-conic-gradient(from 0deg, #c79628 0 23deg, #fff0aa 23deg 41deg, #c79628 41deg 66deg)); box-shadow: inset 0 0 0 5px rgba(51,31,2,.28), inset 0 1px 1px rgba(255,255,255,.68), 0 7px 10px rgba(0,0,0,.36); animation: potChipSling 1.34s cubic-bezier(.17,.83,.19,1) forwards; }
.flying-chip.payout-chip::after { content: ""; position: absolute; inset: 6px; border: 1px dashed rgba(255,255,255,.74); border-radius: inherit; }
@keyframes potChipSling { 0% { opacity: 0; transform: translate(0,0) scale(.38) rotate(var(--rot)); } 11% { opacity: 1; transform: translate(calc(var(--arc-x) * .08), calc(var(--arc-y) * -.22)) scale(.98) rotate(calc(var(--rot) + 48deg)); } 56% { opacity: 1; transform: translate(calc(var(--tx) * .56), calc(var(--ty) * .30 - var(--arc-y))) scale(1.14) rotate(calc(var(--rot) + 192deg)); } 88% { opacity: 1; transform: translate(calc(var(--tx) * .93), calc(var(--ty) * .90 - 4px)) scale(.94) rotate(calc(var(--rot) + 325deg)); } 100% { opacity: 0; transform: translate(var(--tx), var(--ty)) scale(.62) rotate(calc(var(--rot) + 420deg)); } }

.showdown-overlay { position: absolute; z-index: 18; inset: 0; display: grid; align-content: center; justify-items: center; gap: 3px; overflow: hidden; padding: 26px; text-align: center; color: #fff8dc; pointer-events: none; background: radial-gradient(circle at 50% 46%, rgba(30,75,45,.20), rgba(0,0,0,.04) 26%, transparent 60%); }
.showdown-overlay[hidden] { display: none; }
.showdown-overlay::before { content: ""; position: absolute; width: clamp(180px, 40vw, 300px); aspect-ratio: 1; border: 1px solid rgba(255,236,152,.32); border-radius: 50%; box-shadow: 0 0 0 18px rgba(244,200,85,.035), 0 0 58px rgba(244,200,85,.15); animation: countdownHalo 2.1s ease-in-out infinite; }
.showdown-overlay p, .showdown-overlay strong, .showdown-overlay b, .showdown-overlay small, .showdown-divider { position: relative; z-index: 1; }
.showdown-overlay p { margin: 0 0 2px; color: #d9cfaa; font-size: .63rem; font-weight: 850; letter-spacing: .18em; text-transform: uppercase; }
.showdown-overlay strong { display: grid; width: clamp(116px, 22vw, 176px); aspect-ratio: 1; place-items: center; margin: 1px 0 -3px; border: 1px solid rgba(255,238,168,.9); border-radius: 50%; color: #fff7c9; font-size: clamp(4.8rem, 11vw, 8rem); font-weight: 950; line-height: 1; text-shadow: 0 3px 0 #5c3d09, 0 0 24px rgba(255,221,111,.45); background: radial-gradient(circle at 35% 28%, #ffe99a, #e0a82e 44%, #70420b 100%); box-shadow: inset 0 1px rgba(255,255,255,.78), inset 0 -11px 20px rgba(59,32,1,.46), 0 0 0 8px rgba(244,200,85,.08), 0 18px 35px rgba(0,0,0,.38); animation: countdownNumberIn .5s cubic-bezier(.17,.89,.26,1.27) both; }
.showdown-overlay b { color: #fff8df; font-size: clamp(.84rem, 2vw, 1.08rem); letter-spacing: .04em; }
.showdown-overlay small { margin-top: 2px; color: #cfc6a3; font-size: .67rem; }
.showdown-divider { width: 90px; height: 1px; margin: 7px 0 1px; background: linear-gradient(90deg, transparent, rgba(255,232,148,.94), transparent); }
.showdown-overlay.is-last-call strong { animation: countdownUrgent .62s ease-in-out infinite alternate; }
.showdown-orbit { position: absolute; z-index: 0; width: clamp(208px, 43vw, 344px); aspect-ratio: 1; border: 1px dashed rgba(255,237,160,.28); border-radius: 50%; animation: orbitSpin 10s linear infinite; }
.showdown-orbit::after { content: ""; position: absolute; left: 50%; top: -5px; width: 10px; height: 10px; border-radius: 50%; background: #f4c855; box-shadow: 0 0 14px #f4c855; }
.showdown-orbit.orbit-two { width: clamp(160px, 34vw, 262px); border-style: dotted; animation-duration: 7s; animation-direction: reverse; }
@keyframes countdownHalo { 50% { transform: scale(1.06); box-shadow: 0 0 0 28px rgba(244,200,85,.018), 0 0 78px rgba(244,200,85,.24); } }
@keyframes countdownNumberIn { from { opacity: .35; transform: translateY(10px) scale(.76); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes countdownUrgent { to { transform: scale(1.08); box-shadow: inset 0 1px rgba(255,255,255,.78), inset 0 -11px 20px rgba(59,32,1,.46), 0 0 0 13px rgba(244,200,85,.12), 0 20px 44px rgba(0,0,0,.48); } }
@keyframes orbitSpin { to { transform: rotate(360deg); } }
.card-back.is-mucked { opacity: .48; transform: rotate(-5deg) translateY(5px) scale(.92); filter: saturate(.32) brightness(.66); }
.seat.folded .seat-cards::after { content: "MUCKED"; position: absolute; left: 50%; top: calc(100% + 4px); transform: translateX(-50%); color: rgba(235,220,178,.8); font-size: .53rem; font-weight: 900; letter-spacing: .12em; }

@media (max-width: 760px) {
  .pot-cluster { width: 106px; height: 56px; transform: scale(.84); margin-top: -5px; }
  .showdown-overlay strong { width: 128px; }
  .showdown-overlay small { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .pot-cluster.is-paying .pot-chip, .flying-chip.payout-chip, .showdown-overlay::before, .showdown-orbit, .showdown-overlay strong { animation: none !important; }
}


/* V5 — reliable centre-table pot, card flights, rotating table faces, and stronger seat layering */
.table-stage {
  min-height: 684px;
  overflow: hidden;
  isolation: isolate;
}
.felt {
  z-index: 1;
  inset: 118px 11% 150px;
}
.felt > .table-core {
  position: absolute;
  z-index: 7;
}
.table-logo {
  position: absolute;
  z-index: 0;
  top: 50%;
  left: 50%;
  display: grid;
  place-items: center;
  transform: translate(-50%, -52%) rotate(-8deg);
  color: rgba(255, 236, 164, .16);
  text-align: center;
  pointer-events: none;
  user-select: none;
}
.table-logo::before {
  content: "";
  position: absolute;
  width: 172px;
  height: 172px;
  border: 2px solid rgba(255, 236, 164, .11);
  border-radius: 50%;
  box-shadow: 0 0 0 12px rgba(255, 236, 164, .018), 0 0 36px rgba(255, 236, 164, .06);
}
.table-logo span,
.table-logo small { position: relative; z-index: 1; }
.table-logo span {
  font-size: clamp(3.6rem, 9vw, 7.4rem);
  font-weight: 1000;
  letter-spacing: -.13em;
  line-height: .72;
  text-shadow: 0 2px rgba(0,0,0,.14);
}
.table-logo small {
  margin-top: 12px;
  padding-left: .35em;
  font-size: .51rem;
  font-weight: 950;
  letter-spacing: .35em;
}
.table-core {
  top: 50%;
  left: 50%;
  display: grid;
  width: min(94%, 590px);
  justify-items: center;
  gap: 6px;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.table-core .pot-wrap {
  position: relative;
  top: auto;
  left: auto;
  z-index: 10 !important;
  min-width: 160px;
  margin: 0;
  transform: none;
  padding: 7px 15px 9px;
  border-color: rgba(255, 232, 142, .62);
  background: linear-gradient(180deg, rgba(7,38,24,.92), rgba(3,23,14,.82));
  box-shadow: 0 12px 25px rgba(0,0,0,.31), 0 0 0 5px rgba(244,200,85,.04);
}
.table-core .pot-wrap::before {
  content: "";
  position: absolute;
  inset: -7px;
  border: 1px solid rgba(244,200,85,.19);
  border-radius: 18px;
  pointer-events: none;
}
.table-core .pot-cluster {
  width: 148px;
  height: 74px;
  margin: 2px auto -9px;
}
.table-core .street-pill {
  position: relative;
  top: auto;
  left: auto;
  z-index: 8;
  margin-top: 2px;
  transform: none;
}
.table-core .board {
  z-index: 8;
  min-width: 246px;
  min-height: 76px;
  margin: 0;
  justify-content: center;
}
.table-note { z-index: 8; bottom: 8%; }
.turn-queue { z-index: 9; bottom: 2.5%; }

/* Visual hierarchy: the felt stays under every seat and the hero never sinks beneath it. */
.deck-stack { z-index: 16; }
.street-tracker { z-index: 17; }
.seat { z-index: 18; }
.seat-top { top: 60px; }
.seat-left, .seat-right { top: 49%; }
.hero-seat {
  z-index: 21;
  bottom: 18px;
  box-shadow: 0 0 0 1px rgba(255,234,145,.16), 0 18px 32px rgba(0,0,0,.42);
}
.hero-seat.active {
  box-shadow: 0 0 0 5px rgba(255,215,105,.18), 0 0 38px rgba(255,215,105,.18), 0 18px 32px rgba(0,0,0,.42);
}
.hero-seat .hero-action { z-index: 24; }
.seat.receiving-card, .hero-seat.receiving-card {
  border-color: rgba(155,239,191,.94);
  box-shadow: 0 0 0 4px rgba(135,231,176,.14), 0 0 24px rgba(135,231,176,.24), 0 14px 25px rgba(0,0,0,.25);
}

/* Actual cards travel from the deck to each seat before the card is revealed in that hand. */
.deal-fx-layer {
  position: absolute;
  z-index: 30;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}
.deal-flight {
  position: absolute;
  width: 31px;
  height: 44px;
  border: 2px solid #ead8a5;
  border-radius: 7px;
  opacity: 0;
  background: repeating-linear-gradient(45deg, #8e2e3d 0 5px, #f7e1c3 5px 8px);
  box-shadow: inset 0 0 0 4px #721d2d, 0 7px 11px rgba(0,0,0,.42);
  transform-origin: center;
  animation: cardFlight .48s cubic-bezier(.17,.82,.18,1) forwards;
  will-change: transform, opacity;
}
.deal-flight::after {
  content: "";
  position: absolute;
  inset: 6px;
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 3px;
}
.deal-flight.to-board { width: 38px; height: 54px; }
@keyframes cardFlight {
  0% { opacity: 0; transform: translate3d(0,0,0) rotate(-8deg) scale(.72); }
  12% { opacity: 1; transform: translate3d(calc(var(--fly-x) * .10), calc(var(--fly-y) * -.15), 0) rotate(5deg) scale(1.02); }
  72% { opacity: 1; transform: translate3d(calc(var(--fly-x) * .78), calc(var(--fly-y) * .70 - 25px), 0) rotate(calc(var(--fly-r) * .72)) scale(.95); }
  100% { opacity: .98; transform: translate3d(var(--fly-x), var(--fly-y), 0) rotate(var(--fly-r)) scale(.86); }
}

/* The pot is unmistakable while chips are in play. */
.table-core .pot-wrap:not(:has(.pot-cluster.is-empty)) { animation: potBreath 2.5s ease-in-out infinite; }
@keyframes potBreath { 50% { box-shadow: 0 14px 30px rgba(0,0,0,.35), 0 0 0 7px rgba(244,200,85,.075), 0 0 28px rgba(244,200,85,.10); } }

@media (max-width: 760px) {
  .table-stage { min-height: 760px; }
  .felt { inset: 144px 2.2% 170px; border-width: 10px; }
  .seat-top { top: 73px; }
  .seat-left, .seat-right { top: 40%; }
  .hero-seat { z-index: 25; bottom: 15px; width: calc(100% - 22px); }
  .table-core { width: 96%; gap: 4px; transform: translate(-50%, -47%); }
  .table-core .pot-wrap { min-width: 145px; transform: scale(.93); transform-origin: center bottom; }
  .table-core .pot-cluster { width: 126px; height: 66px; }
  .table-core .board { min-width: 220px; min-height: 66px; }
  .table-logo { transform: translate(-50%, -47%) rotate(-8deg) scale(.74); }
  .table-note { bottom: 7%; width: 84%; font-size: .66rem; }
  .turn-queue { bottom: 1.4%; }
  .deal-flight { width: 26px; height: 37px; }
  .deal-flight.to-board { width: 33px; height: 47px; }
}
@media (max-width: 430px) {
  .table-stage { min-height: 740px; }
  .felt { inset: 136px 1.2% 166px; }
  .table-core .pot-wrap { transform: scale(.86); margin-bottom: -6px; }
  .table-core .board { min-width: 198px; }
  .table-logo { opacity: .82; }
  .seat-top { top: 71px; }
  .hero-seat { bottom: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .deal-flight, .table-core .pot-wrap:not(:has(.pot-cluster.is-empty)) { animation: none !important; }
}

/* V6 — fixed centre alignment and clear top-seat spacing
   This final block intentionally overrides older table coordinates. */
.table-stage {
  min-height: 748px !important;
  overflow: hidden !important;
  isolation: isolate;
}

/* The felt is a real centered ellipse, independent of surrounding seats. */
.felt {
  position: absolute !important;
  inset: auto !important;
  top: 52% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  width: min(80%, 1030px) !important;
  height: 430px !important;
  transform: translate(-50%, -50%) !important;
  z-index: 1 !important;
}

/* Keep the brand watermark and every central table element on the exact felt centre. */
.table-logo {
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translate(-50%, -50%) rotate(-8deg) !important;
  z-index: 0 !important;
}
.felt > .table-core,
.table-core {
  position: absolute !important;
  inset: auto !important;
  top: 53% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  width: min(82%, 560px) !important;
  margin: 0 !important;
  transform: translate(-50%, -50%) !important;
  z-index: 12 !important;
}
.table-core .pot-wrap {
  position: relative !important;
  inset: auto !important;
  justify-self: center !important;
  align-self: center !important;
  margin: 0 !important;
}
.table-core .board {
  justify-self: center !important;
  margin: 0 !important;
}

/* The progress bar has its own safe strip above the dealer seat. */
.street-tracker {
  top: 20px !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  z-index: 60 !important;
}

/* Top opponent is moved down and its cards/action are placed below it.
   Nothing can overlap the street tracker anymore. */
.seat-top {
  top: 88px !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  z-index: 50 !important;
}
.seat-top .seat-cards {
  top: calc(100% + 9px) !important;
  right: auto !important;
  bottom: auto !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}
.seat-top .seat-action {
  top: calc(100% + 63px) !important;
  bottom: auto !important;
}

/* Seats sit around—not inside—the exact ellipse boundary. */
.seat-left {
  top: 52% !important;
  left: 22px !important;
  right: auto !important;
  transform: translateY(-50%) !important;
  z-index: 50 !important;
}
.seat-right {
  top: 52% !important;
  right: 22px !important;
  left: auto !important;
  transform: translateY(-50%) !important;
  z-index: 50 !important;
}
.deck-stack {
  top: 53% !important;
  left: 21% !important;
  right: auto !important;
  z-index: 35 !important;
}
.hero-seat {
  z-index: 55 !important;
  bottom: 18px !important;
}

/* Keep secondary labels inside the felt without touching the player seat. */
.table-note { bottom: 8% !important; z-index: 18 !important; }
.turn-queue { bottom: 2.5% !important; z-index: 19 !important; }
.showdown-overlay { z-index: 80 !important; }
.deal-fx-layer { z-index: 90 !important; }

@media (max-width: 760px) {
  .table-stage { min-height: 800px !important; }
  .felt {
    top: 54% !important;
    width: 97% !important;
    height: 420px !important;
  }
  .street-tracker { top: 17px !important; }
  .seat-top { top: 86px !important; }
  .seat-top .seat-action { top: calc(100% + 57px) !important; }
  .seat-left { top: 50% !important; left: 8px !important; transform: none !important; }
  .seat-right { top: 50% !important; right: 8px !important; transform: none !important; }
  .deck-stack { top: 54% !important; left: 8% !important; }
  .felt > .table-core,
  .table-core { top: 54% !important; width: 94% !important; }
  .hero-seat { bottom: 14px !important; }
  .table-note { bottom: 7% !important; }
}

@media (max-width: 430px) {
  .table-stage { min-height: 780px !important; }
  .felt { height: 405px !important; }
  .seat-top { top: 82px !important; }
  .seat-top .seat-action { top: calc(100% + 54px) !important; }
}

/* VA poker mobile landscape gate — portrait phones show a rotate screen. */
.mobile-orientation-gate {
  display: none;
  position: fixed;
  z-index: 2147483000;
  inset: 0;
  place-items: center;
  padding: 24px;
  color: #f8f6ea;
  text-align: center;
  background:
    radial-gradient(circle at 50% 22%, rgba(33, 141, 83, .30), transparent 34%),
    radial-gradient(circle at 76% 84%, rgba(244, 200, 85, .14), transparent 32%),
    linear-gradient(145deg, #05140d, #081f14 56%, #040d09);
}
.orientation-gate-card {
  width: min(100%, 360px);
  padding: 28px 26px 24px;
  border: 1px solid rgba(244, 200, 85, .40);
  border-radius: 26px;
  background: linear-gradient(145deg, rgba(20, 50, 34, .96), rgba(4, 22, 13, .97));
  box-shadow: 0 22px 60px rgba(0, 0, 0, .48), inset 0 1px 0 rgba(255,255,255,.05);
}
.orientation-gate-card h2 {
  margin: 8px 0 8px;
  font-size: clamp(1.35rem, 6vw, 1.8rem);
  letter-spacing: -.03em;
}
.orientation-gate-card > p:not(.orientation-eyebrow) {
  margin: 0 auto;
  max-width: 25ch;
  color: rgba(240, 248, 239, .78);
  line-height: 1.5;
}
.orientation-gate-card small {
  display: block;
  margin-top: 18px;
  color: #a9b8ab;
  font-size: .78rem;
}
.orientation-eyebrow {
  margin: 14px 0 0;
  color: #f4c855;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.orientation-phone {
  position: relative;
  width: 70px;
  height: 112px;
  margin: 0 auto 6px;
  border: 4px solid #f4c855;
  border-radius: 16px;
  box-shadow: 0 0 0 7px rgba(244,200,85,.08), 0 10px 28px rgba(0,0,0,.26);
  transform: rotate(0deg);
  animation: vaRotatePhone 2.2s ease-in-out infinite;
}
.orientation-phone::before {
  content: "";
  position: absolute;
  top: 8px;
  left: 50%;
  width: 20px;
  height: 3px;
  border-radius: 9px;
  background: #f4c855;
  transform: translateX(-50%);
}
.orientation-phone::after {
  content: "";
  position: absolute;
  inset: 14px 7px 8px;
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(64,189,116,.86), rgba(9,59,34,.95));
}
.orientation-phone span {
  position: absolute;
  z-index: 1;
  right: -18px;
  bottom: 9px;
  width: 20px;
  height: 20px;
  border-top: 3px solid #f4c855;
  border-right: 3px solid #f4c855;
  transform: rotate(45deg);
}
@keyframes vaRotatePhone {
  0%, 18% { transform: rotate(0deg) scale(1); }
  50%, 78% { transform: rotate(90deg) scale(1.03); }
  100% { transform: rotate(0deg) scale(1); }
}

@media (max-width: 900px) and (hover: none) and (orientation: portrait) {
  html, body { width: 100%; height: 100%; overflow: hidden !important; overscroll-behavior: none; }
  .mobile-orientation-gate { display: grid; }
  .poker-shell { visibility: hidden !important; pointer-events: none !important; }
}
body.needs-landscape { overflow: hidden !important; }
body.needs-landscape .mobile-orientation-gate { display: grid; }
body.needs-landscape .poker-shell { visibility: hidden !important; pointer-events: none !important; }
@media (prefers-reduced-motion: reduce) {
  .orientation-phone { animation: none; transform: rotate(90deg); }
}