/* The table is drawn in layers; avatars remain small vector assets. */
.game-main{background:radial-gradient(ellipse at 50% 42%,#203139,#121d24 75%);overflow:visible}
.table-stage{height:570px;margin:55px 42px 72px;isolation:isolate}
.felt{inset:60px 43px 35px;border:0;border-radius:50%;background:linear-gradient(155deg,#ffffff14,#00000018),var(--felt-color);box-shadow:inset 0 8px 13px #07132670,inset 0 -3px 7px #ffffff24,0 21px 23px #0008;overflow:visible}
.felt:before{content:'';position:absolute;inset:-23px;border-radius:50%;z-index:-1;background:linear-gradient(180deg,#797188 0%,#55455b 20%,#423344 65%,#291a1f 100%);box-shadow:inset 0 3px 3px #c7bccd88,inset 0 -6px 5px #1e1624,0 10px 0 #291a1f,0 13px 3px #141116,0 27px 36px #0009}
.felt:after{content:'';position:absolute;inset:-13px;border:1px dashed #b9a6bb48;border-radius:50%;pointer-events:none}
.felt-inside{inset:0;border:0;border-radius:50%;opacity:.22;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='6'%3E%3Cpath d='M0 1h6M1 0v6' stroke='%23fff' stroke-opacity='.2' stroke-width='.5'/%3E%3C/svg%3E");pointer-events:none}
.table-center{gap:9px;padding:50px 65px;color:#fff;text-shadow:0 1px 3px #00152b99}
.table-center .eyebrow{color:#f2f5ffd9;letter-spacing:1.5px}
.pot span,.pot small{color:#f1f5ffcf}.pot strong{font-size:32px;color:white}
.table-message{color:#fff;background:#0b16285c;border:1px solid #ffffff24;padding:5px 12px;border-radius:20px;max-width:95%;min-height:26px}
.community .card{box-shadow:0 4px 7px #0004;text-shadow:none}
.seat{width:112px;z-index:2;transform:translate(-50%,-50%)}
.seat.occupied{height:114px}
.player-figure{position:absolute;width:112px;height:130px;left:50%;top:50%;transform:translate(-50%,-50%) rotate(var(--facing));filter:drop-shadow(0 5px 3px #0005)}
.person{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.clothes{fill:var(--shirt)}
.sleeve{fill:none;stroke:var(--shirt);stroke-width:19;stroke-linecap:round;stroke-linejoin:round}
.sleeve-shade{fill:none;stroke:#000;stroke-opacity:.14;stroke-width:5;stroke-linecap:round;transform:translate(3px,1px)}
.moving-arm{transform-origin:86px 68px}
.player-caption{position:absolute;top:98px;left:50%;transform:translateX(-50%);width:112px;z-index:4;text-align:center;border-radius:8px;background:#121c25ed;box-shadow:0 3px 8px #0004;border:1px solid #526370}
.seat-body{background:none!important;border:0!important;box-shadow:none!important;min-height:0;padding:5px 7px;display:flex;justify-content:center;gap:3px}
.seat-body strong{max-width:98px;font-size:12px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.seat-body b{font-size:16px;line-height:1.1;display:block;color:#f3e0ad}
.seat-body em{font-size:8px;color:#adc4d9;font-style:normal}
.seat-body small{font-size:9px}.seat-meta{font-size:10px;line-height:1.2;min-height:15px;padding:0 4px 3px;color:#b7c6d0}
.seat.mine .player-caption{border-color:#dfc286}
.seat.slot-0 .player-caption,.seat.slot-1 .player-caption,.seat.slot-9 .player-caption{top:-40px}
.seat.turn .player-caption{border-color:#e9c277;box-shadow:0 0 0 2px #e9c27740,0 3px 14px #0005}
.seat.turn .person{filter:drop-shadow(0 0 4px #e9c27790)}
.seat-timer{height:3px;margin:0 5px 3px;background:#ffffff16;border-radius:3px;overflow:hidden}.seat-timer span{display:block;height:100%;background:#e9c277}
.dealer{position:absolute;right:-10px;top:-8px;width:21px;height:21px;border:2px solid #e6dac7;background:#f9f3e8;color:#303038;border-radius:50%;font-weight:800;line-height:17px;font-size:11px}
.seat-cards{position:absolute;left:50%;top:0;transform:translate(-50%,-45%);display:flex;height:auto;gap:3px;z-index:2}
.seat-cards .card{width:26px;height:37px;border-radius:3px;padding:3px;box-shadow:0 3px 4px #0005;text-shadow:none}
.seat-cards .card:first-child{transform:rotate(-9deg)}.seat-cards .card:last-child{transform:rotate(9deg)}
.seat-cards .card b{font-size:14px}.seat-cards .card i{font-size:15px}
.seat.mine .seat-cards .card{width:31px;height:43px}.seat.mine .seat-cards .card b{font-size:17px}
.seat-cards.folded{visibility:hidden;opacity:0}
.wager{position:absolute;left:79%;top:1px;display:flex;align-items:center;gap:4px;color:white;font-size:11px;text-shadow:0 1px 3px #000;transform:rotate(calc(-1 * var(--facing)))}
.chip-stack{display:inline-block;width:18px;height:10px;border:2px dashed #f5e0a4;border-radius:50%;background:#b6504d;box-shadow:0 3px 0 #702d33,0 5px 0 #dcc482,0 7px 0 #8b713d;flex-shrink:0}
.held-chips,.held-cards,.gesture-object{opacity:0;pointer-events:none}
.gesture-object{position:absolute;top:-5px;left:60%;display:flex;gap:1px}
.gesture-object .card{width:19px;height:28px;font-size:12px}
.gesture-check .moving-arm{animation:double-tap 1115.385ms both;animation-delay:var(--gesture-delay)}
.gesture-call .moving-arm,.gesture-raise .moving-arm,.gesture-fold .moving-arm{animation:reach 1450ms both;animation-delay:var(--gesture-delay)}
.gesture-call .held-chips,.gesture-raise .held-chips,.gesture-fold .held-cards{animation:carry 1450ms both;animation-delay:var(--gesture-delay)}
.gesture-call .gesture-object,.gesture-raise .gesture-object,.gesture-fold .gesture-object{animation:release 1450ms both;animation-delay:var(--gesture-delay)}
.gesture-call .moving-arm,.gesture-raise .moving-arm,.gesture-call .held-chips,.gesture-raise .held-chips,.gesture-call .gesture-object,.gesture-raise .gesture-object{animation-duration:1169.355ms}
@keyframes double-tap{0%,20%,44%,68%,100%{transform:translateY(0) rotate(0)}32%,56%{transform:translateY(5px) rotate(-5deg)}}
@keyframes reach{0%,100%{transform:translateY(0) rotate(0)}40%,57%{transform:translate(-8px,-28px) rotate(-12deg)}}
@keyframes carry{0%,54%{opacity:1}55%,100%{opacity:0}}
@keyframes release{0%,53%{opacity:0;transform:translate(0,-24px)}54%{opacity:1;transform:translate(0,-24px)}85%,100%{opacity:0;transform:translate(-14px,-85px)}}
.seat.empty{width:84px}.seat.empty button{border:1px dashed #87929e80;border-radius:50%;width:76px;height:58px;padding:5px;background:#12202cbb;color:#d2dce5;font-size:10px;display:grid;place-content:center;gap:1px}.seat.empty button span{font-size:22px;line-height:22px}
.appearance{padding:0!important;overflow:hidden}.appearance-toggle{display:flex;justify-content:space-between;align-items:center;width:100%;background:transparent;padding:18px;font-size:14px}
.appearance form{padding:0 18px 18px}.appearance label{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px}.appearance input[type=color]{width:54px;height:38px;padding:3px;cursor:pointer}.appearance .row-buttons{margin:15px 0 10px}.appearance .row-buttons button{padding:9px 12px}
.swatches{display:flex;gap:8px;flex-wrap:wrap;margin:-4px 0 18px}.swatches button{width:27px;height:27px;min-height:0;padding:0;border:2px solid #ffffff55;background:var(--swatch);border-radius:50%}.swatches button:hover{border-color:white}
@media(min-width:901px) and (max-height:850px){.table-stage{height:430px;margin:55px 42px 78px}.felt{inset:52px 40px 20px}.player-figure{width:94px;height:110px}.seat.occupied{height:100px}.player-caption{top:83px;width:100px}.table-center{padding:30px 60px;gap:6px}.pot strong{font-size:26px}}
@media(min-width:601px) and (max-width:1100px){.table-stage{height:360px;margin:45px 26px 80px}.felt{inset:42px 30px 8px}.seat,.player-caption{width:96px}.player-figure{width:94px;height:110px}.player-caption{top:86px}.seat-body strong{font-size:11px;max-width:86px}}
@media(max-width:600px){
 header{min-height:97px}.workspace{padding-top:15px}.page-heading{margin-bottom:14px}.page-heading h1{font-size:25px}
 .workspace:has(.game-layout) .page-heading>div:first-child{display:none}.workspace:has(.game-layout) .session-status{width:100%;flex-direction:row;justify-content:space-between;align-items:center;padding:0}.workspace:has(.game-layout) .page-heading{margin-bottom:8px}
 .table-stage{height:clamp(480px,calc(100svh - 350px),620px);margin:42px 14px 67px}
 .felt{inset:36px 22px 12px;border-radius:49%}.felt:before{inset:-14px;border-radius:49%;box-shadow:inset 0 2px 3px #c7bccd88,inset 0 -4px 4px #1e1624,0 6px 0 #291a1f,0 17px 24px #0008}.felt:after{inset:-8px;border-radius:49%}.felt-inside{border-radius:49%}
 .table-center{padding:70px 27px;gap:12px}.table-center .eyebrow{font-size:8px;letter-spacing:1px}.pot strong{font-size:27px}.community{gap:3px}.community .card{width:25px;height:38px;padding:3px}.community .card b{font-size:14px}.community .card i{font-size:15px}.table-message{font-size:10px;padding:5px 8px;max-width:100%}
 .seat{width:76px;left:clamp(28px,var(--x),calc(100% - 28px))}.seat.occupied{height:79px}.player-figure{width:77px;height:90px}.player-caption{top:65px;width:78px;border-radius:6px}.seat-body{padding:4px 3px}.seat-body strong{font-size:10px;max-width:70px}.seat-body b{font-size:13px}.seat-body em{font-size:7px}.seat-meta{font-size:8px;min-height:13px}.dealer{width:17px;height:17px;line-height:13px;font-size:9px;right:-7px;top:-5px}
 .seat-cards .card{width:20px;height:29px;padding:2px}.seat-cards .card b{font-size:11px}.seat-cards .card i{font-size:12px}.seat.mine .seat-cards .card{width:27px;height:38px}.seat.mine .seat-cards .card b{font-size:15px}.seat.mine .seat-cards .card i{font-size:17px}
 .wager{font-size:9px;left:80%}.chip-stack{width:14px;height:8px}.seat.empty{width:62px}.seat.empty button{width:58px;height:46px;font-size:9px}
 .seat.slot-0 .player-caption,.seat.slot-1 .player-caption,.seat.slot-9 .player-caption{top:-32px}
 .seat.slot-0{--x:50%!important;--y:3%!important}.seat.slot-1{--x:81%!important;--y:17%!important}.seat.slot-2{--x:91%!important;--y:36%!important}.seat.slot-3{--x:91%!important;--y:60%!important}.seat.slot-4{--x:81%!important;--y:80%!important}.seat.slot-5{--x:50%!important;--y:95%!important}.seat.slot-6{--x:19%!important;--y:80%!important}.seat.slot-7{--x:9%!important;--y:60%!important}.seat.slot-8{--x:9%!important;--y:36%!important}.seat.slot-9{--x:19%!important;--y:17%!important}
 .game-layout aside{display:flex;flex-direction:column}.appearance{order:-1}.action-dock{z-index:20;min-height:82px;padding:10px 12px max(10px,env(safe-area-inset-bottom));gap:8px}.action-dock button{min-height:44px;padding:8px}.raise-control{margin-top:6px}.raise-control label,.raise-control input{margin:0}.raise-control input{min-height:44px;max-width:110px}.your-hand small{font-size:10px}.your-hand strong{font-size:12px}
}
@media(prefers-reduced-motion:reduce){.moving-arm,.held-chips,.held-cards,.gesture-object{animation:none!important}}

/* Upright, chair-free players; card faces always face the viewer. */
.player-figure{width:106px;height:140px}
.moving-arm{transform-origin:87px 85px}
.open-palm{opacity:0}
.gesture-check .closed-fist{animation:open-fist 1115.385ms both;animation-delay:var(--gesture-delay)}
.gesture-check .open-palm{animation:show-palm 1115.385ms both;animation-delay:var(--gesture-delay)}
@keyframes open-fist{0%,9%,91%,100%{opacity:1}10%,90%{opacity:0}}
@keyframes show-palm{0%,9%,91%,100%{opacity:0}10%,90%{opacity:1}}
.seat-cards{left:calc(50% + var(--cards-x,0px));top:calc(50% + var(--cards-y,-90px));transform:translate(-50%,-50%);gap:4px;z-index:3;pointer-events:none}
.seat-cards .card,.seat.mine .seat-cards .card{width:37px;height:53px;padding:4px;background:#fffdf7;border:1px solid #d8d5ca;color:#17232b;border-radius:5px}
.seat-cards .card:first-child,.seat-cards .card:last-child{transform:none}
.seat-cards .card b,.seat.mine .seat-cards .card b{font-size:23px;font-weight:800;line-height:1}
.seat-cards .card i,.seat.mine .seat-cards .card i{font-size:23px;line-height:1}
.seat-cards .card.red{color:#b81f35}
.seat-cards .card.back{color:#dbe6f1;background:repeating-linear-gradient(45deg,#233e61 0 3px,#2e4e76 3px 5px);border:2px solid #edf1f1;font-size:24px}
.community{gap:7px;overflow:visible}
.community .card{width:51px;height:73px;padding:6px;background:#fffdf7;color:#17232b;border:1px solid #d8d5ca;border-radius:6px}
.community .card b{font-size:29px;font-weight:800;line-height:1}.community .card i{font-size:28px;line-height:1}
.community .card.red{color:#b81f35}.community .card.ghost{visibility:hidden}
.board-slot{display:block;perspective:600px}
.board-slot.dealing>.card{animation:deal-softly var(--deal-duration,1400ms) cubic-bezier(.19,.75,.29,1) both;animation-delay:var(--deal-delay)}
@keyframes deal-softly{0%{opacity:0;transform:translate(-18px,-48px) rotate(-9deg) scale(.94)}35%{opacity:1}80%{transform:translate(0,-3px) rotate(1deg)}100%{opacity:1;transform:translate(0,0) rotate(0) scale(1)}}
.table-dealer{right:auto;width:28px;height:28px;line-height:24px;font-size:14px;transform:translate(-50%,-50%);z-index:5;box-shadow:0 3px 0 #c1b5a2,0 5px 7px #0005;text-align:center;pointer-events:none}
.seat.turn .person{filter:none}
.seat.turn .player-caption{border-color:#526370;box-shadow:0 3px 8px #0004}
.seat-body strong{position:relative;overflow:visible;isolation:isolate}
.seat.turn .seat-body strong:after{content:'';position:absolute;inset:-5px -7px;border:4px solid var(--turn-color,#0fe51e);border-radius:7px;box-shadow:0 0 10px var(--turn-color,#0fe51e);animation:turn-pulse var(--pulse-period,1100ms) ease-in-out infinite;pointer-events:none}
.seat.turn .seat-body{padding-top:9px}.seat.turn .seat-body b{margin-top:6px}
.seat-timer span{background:var(--turn-color,#0fe51e)}
@keyframes turn-pulse{0%,100%{opacity:1}50%{opacity:.38}}
.sound-toggle{width:100%;margin-bottom:14px;min-height:44px;text-align:left}.sound-toggle[aria-pressed=true]{color:#c4e3ce;border-color:#557564}
.table-topline small{display:block;margin-left:0;font-size:10px;letter-spacing:.3px;margin-top:2px}
.table-center{display:block;padding:0}
.table-center .pot{position:absolute;top:calc(50% - 105px);left:0;width:100%;text-align:center}
.table-center .community{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
.table-center .table-message{position:absolute;top:calc(50% + 52px);left:50%;transform:translateX(-50%);width:max-content;max-width:90%}
@media(min-width:601px) and (max-width:1100px){.player-figure{width:89px;height:117px}.seat-cards .card,.seat.mine .seat-cards .card{width:31px;height:46px}.seat-cards .card b,.seat.mine .seat-cards .card b{font-size:20px}.seat-cards .card i,.seat.mine .seat-cards .card i{font-size:20px}.community .card{width:44px;height:63px}.community .card b{font-size:26px}.community .card i{font-size:24px}}
@media(max-width:600px){
 .player-figure{width:70px;height:93px}
 .table-stage{height:clamp(560px,calc(100svh - 250px),720px)}
 .seat.slot-2,.seat.slot-8{--y:31%!important}.seat.slot-3,.seat.slot-7{--y:67%!important}.seat.slot-4,.seat.slot-6{--y:85%!important}
 .seat-cards,.community{gap:3px}
 .seat-cards .card,.seat.mine .seat-cards .card{width:30px;height:43px;padding:3px;border-radius:4px}
 .seat-cards .card b,.seat.mine .seat-cards .card b{font-size:20px}.seat-cards .card i,.seat.mine .seat-cards .card i{font-size:19px}
 .community .card{width:34px;height:50px;padding:4px;border-radius:4px}.community .card b{font-size:23px}.community .card i{font-size:22px}
 .table-dealer{width:23px;height:23px;line-height:19px;font-size:12px}
 .table-center .pot{top:calc(50% - 90px)}.table-center .table-message{top:calc(50% + 37px)}
 .seat.turn .seat-body strong:after{inset:-4px -4px;border-width:3px}
 .sound-toggle{order:-2;margin:0}
 .your-hand .cards .card{width:37px;height:52px}.your-hand .cards .card b{font-size:22px}.your-hand .cards .card i{font-size:21px}
}
@media(prefers-reduced-motion:reduce){.board-slot.dealing>.card,.seat.turn .seat-body strong:after{animation:none!important}.gesture-check .closed-fist{animation:none;opacity:1}.gesture-check .open-palm{animation:none;opacity:0}}
@media(min-width:601px) and (max-width:1100px){.table-center .pot{top:calc(50% - 80px)}.pot span{font-size:10px;line-height:1.2}.pot strong{font-size:24px;line-height:1.2;margin:0}}

/* Each place has separate spaces for hands, cards, wager and dealer marker. */
.player-figure{transform:translate(-50%,-50%) rotate(var(--facing)) translateY(20px)}
.seat-cards{transform:translate(-50%,-50%) rotate(var(--facing));gap:5px}
.wager{left:calc(50% + var(--wager-x));top:calc(50% + var(--wager-y));transform:translate(-50%,-50%);padding:3px 5px;background:#122536b3;border-radius:10px;z-index:4;min-width:36px;justify-content:center;white-space:nowrap}
.wager:empty{display:none}
.gesture-object{left:115%}
@keyframes reach{0%,100%{transform:translateY(0)}40%,57%{transform:translateY(-14px)}}
.table-stage{height:620px;margin-top:65px;margin-bottom:95px}
@media(min-width:601px) and (max-width:1100px){.table-stage{height:480px;margin-top:65px;margin-bottom:95px}.player-figure{width:80px;height:106px}}
@media(max-width:600px){.table-stage{height:740px;margin-left:19px;margin-right:19px;margin-top:65px;margin-bottom:105px}.player-figure{width:64px;height:85px;transform:translate(-50%,-50%) rotate(var(--facing)) translateY(16px)}.seat-cards{gap:4px}.seat-cards .card,.seat.mine .seat-cards .card{width:29px;height:42px}.wager{font-size:10px;min-width:30px}}
@media(max-width:600px){.seat .player-caption{width:66px}.seat-body strong{font-size:11px}}
@media(max-width:600px){.table-center .pot{top:calc(50% - 140px);left:50%;width:max-content;transform:translateX(-50%)}.pot strong{font-size:26px;line-height:1.2;margin:0}.pot span{font-size:10px}}
@media(max-width:600px){.table-center .pot{top:calc(50% - 158px)}.seat.slot-2 .player-caption,.seat.slot-3 .player-caption,.seat.slot-7 .player-caption,.seat.slot-8 .player-caption{top:96px}.wager{padding:2px;min-width:24px;gap:2px}}

/* Larger players; readable cards remain nearest the rail, wagers further inward. */
.player-figure{width:190.8px;height:252px;transform:translate(-50%,-50%) rotate(var(--facing)) translateY(75px)}
.seat-cards{transform:translate(-50%,-50%)}
@media(min-width:601px) and (max-width:1100px){.player-figure{width:144px;height:190.8px;transform:translate(-50%,-50%) rotate(var(--facing)) translateY(58px)}}
@media(max-width:600px){.player-figure{width:115.2px;height:153px;transform:translate(-50%,-50%) rotate(var(--facing)) translateY(48px)}}
.player-figure{transform:translate(-50%,-50%) rotate(var(--facing)) translateY(30px)}
.seat.slot-0 .player-caption,.seat.slot-1 .player-caption,.seat.slot-9 .player-caption{top:-90px}
@media(max-width:600px){.player-figure{transform:translate(-50%,-50%) rotate(var(--facing)) translateY(15px)}.seat.slot-0 .player-caption,.seat.slot-1 .player-caption,.seat.slot-9 .player-caption{top:-70px}.table-stage{margin-top:105px}}
@media(max-width:600px){.table-stage{height:900px}}
.table-stage{height:720px}@media(min-width:601px) and (max-width:1100px){.table-stage{height:580px}}@media(max-width:600px){.table-stage{height:900px}}
@media(max-width:600px){.seat.slot-2 .player-caption,.seat.slot-3 .player-caption,.seat.slot-7 .player-caption,.seat.slot-8 .player-caption{top:126px}}

/* Card indices: classic narrow numerals and serif court letters from the reference. */
.card.suit-clubs{--ink:#37a809}.card.suit-hearts{--ink:#ff0000}.card.suit-diamonds{--ink:#1c00ff}.card.suit-spades{--ink:#000000}
#app .card[class*="suit-"] b,#app .card[class*="suit-"] i{color:var(--ink);font-weight:400;line-height:.85;transform:scale(1.15);transform-origin:center}
.card.number-rank b{font-family:"Arial Narrow",Arial,sans-serif;letter-spacing:-1px}
.card.court-rank b{font-family:"Times New Roman",serif;font-weight:400}
#app .card[class*="suit-"] i{font-family:"Times New Roman",serif;font-style:normal}

/* Tall, narrow card lettering and solid suit shapes, inspired by the second reference. */
#app .card.number-rank b{font-family:"Arial Narrow",Arial,sans-serif;font-weight:600;transform:scale(.92,1.15);letter-spacing:-1px}
#app .card.court-rank b svg{display:block;height:.92em;width:.552em;overflow:visible}
#app .card[class*="suit-"] i svg{display:block;width:.88em;height:.88em;overflow:visible}
/* Identical card dimensions at each viewport, with black ranks and outlined coloured suits. */
#app{--card-width:51px;--card-height:73px;--card-padding:6px;--rank-size:29px;--suit-size:28px}
#app .seat-cards .card,#app .your-hand .card,#app .community .card{width:var(--card-width);height:var(--card-height);padding:var(--card-padding);flex-shrink:0}
#app .seat-cards .card b,#app .your-hand .card b,#app .community .card b{font-size:var(--rank-size);color:#000}
#app .seat-cards .card i,#app .your-hand .card i,#app .community .card i{font-size:var(--suit-size)}
#app .card.suit-clubs i path,#app .card.suit-diamonds i path{stroke:#000;stroke-width:2.5;stroke-linejoin:round;paint-order:stroke fill}
@media(min-width:601px) and (max-width:1100px){#app{--card-width:44px;--card-height:63px;--rank-size:26px;--suit-size:24px}}
@media(max-width:600px){#app{--card-width:34px;--card-height:50px;--card-padding:4px;--rank-size:23px;--suit-size:22px}}

/* Cards sit beneath the hands and follow the seat orientation. */
.seat-cards{transform:translate(-50%,-50%) rotate(var(--facing));z-index:1}
.player-figure{z-index:2;pointer-events:none}
/* Keep card faces readable from the local player's bottom-of-table view. */
.seat-cards{transform:translate(-50%,-50%)}


#app .card.number-rank b,#app .card.court-rank b{font-family:'Times New Roman',serif;font-weight:400;font-synthesis:none}

/* Lovelo Black glyph outlines, bundled for identical offline rendering. */
#app .card b svg.photo-rank{display:block;height:.76em;overflow:visible}

/* Controls sit to the right of the local player's bottom seat. */
.table-stage{margin-bottom:265px}
.table-stage .action-dock{position:absolute;top:calc(100% - 5px);bottom:auto;left:calc(50% + 80px);right:auto;width:calc(50% - 85px);max-width:280px;min-height:0;display:flex;flex-direction:column;align-items:stretch;padding:12px;gap:12px;border:1px solid #42565f;border-radius:12px;box-shadow:0 5px 18px #0003;z-index:5}
.action-dock .your-hand{display:block}.action-dock .your-hand .eyebrow{display:none}
.action-dock .bet-buttons{display:flex;flex-wrap:wrap}.action-dock .bet-buttons button{min-width:0;flex:1;padding:10px 6px}
.action-dock .raise-control{display:flex;flex-wrap:wrap;justify-content:flex-start}.action-dock .raise-control label{width:100%}.action-dock .raise-control input{width:100%;max-width:none}.action-dock .raise-control button{width:100%}
@media(max-width:600px){.table-stage{margin-bottom:370px}.table-stage .action-dock{top:calc(100% + 10px);left:calc(50% + 46px);width:calc(50% - 38px);padding:8px;gap:8px}.action-dock .bet-buttons{flex-direction:column}.action-dock .bet-buttons button{width:100%;font-size:12px}.action-dock .your-hand small{display:none}.action-dock .your-hand strong{font-size:11px}}
/* Raised, larger action buttons with a physical pressed state. */
.action-dock .actions{width:100%;min-width:0}
.action-dock .bet-buttons{gap:10px;margin-bottom:7px}
.action-dock .bet-buttons button{--button-top:#efcc80;--button-bottom:#c79743;--button-edge:#805a24;min-height:58px;padding:14px 10px;font-size:16px;font-weight:800;line-height:1.2;border:1px solid #fff5;border-radius:12px;background:linear-gradient(180deg,var(--button-top),var(--button-bottom));color:#241908;text-shadow:0 1px #fff4;box-shadow:inset 0 2px 1px #ffffff70,inset 0 -2px 2px #0002,0 6px 0 var(--button-edge),0 10px 13px #0005;transition:transform .12s ease,box-shadow .12s ease,filter .12s ease;touch-action:manipulation;white-space:normal;overflow-wrap:anywhere}
.action-dock .bet-buttons .fold{--button-top:#ae555d;--button-bottom:#7b303a;--button-edge:#491a25;color:#fff3f3;text-shadow:0 1px 2px #0008}
.action-dock .bet-buttons .call{--button-top:#469a74;--button-bottom:#286c50;--button-edge:#16432f;color:#f3fff8;text-shadow:0 1px 2px #0007}
@media(hover:hover){.action-dock .bet-buttons button:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-1px)}}
.action-dock .bet-buttons button:active:not(:disabled){transform:translateY(5px);box-shadow:inset 0 2px 3px #0003,0 1px 0 var(--button-edge),0 3px 5px #0004}
.action-dock .bet-buttons button:focus-visible{outline:3px solid #f7f1cf;outline-offset:5px}
.action-dock .bet-buttons button:disabled{filter:saturate(.35);opacity:.6;transform:none;cursor:wait}
@media(max-width:600px){.table-stage{margin-bottom:430px}.action-dock .bet-buttons{gap:13px}.action-dock .bet-buttons button{min-height:58px;padding:14px 6px;font-size:16px}}
@media(prefers-reduced-motion:reduce){.action-dock .bet-buttons button{transition:none}}
.action-dock .actions{max-width:100%}
.action-dock .bet-buttons button{min-width:70px;overflow-wrap:normal;word-break:normal}
@media(max-width:600px){.action-dock .bet-buttons button{min-width:0}}
/* Reshape only the painted table layers; the layout anchors remain unchanged. */
.felt{--oval-x:1.08;--oval-y:.93;background:none;box-shadow:none}
.felt::before,.felt::after,.felt-inside{transform:scale(var(--oval-x),var(--oval-y));transform-origin:center;border-radius:50%;pointer-events:none}
.felt::before{background:linear-gradient(180deg,#898092 0%,#65566b 9%,#55455b 25%,#423344 70%,#291a1f 100%);box-shadow:inset 0 4px 4px #d5cbd785,inset 0 -7px 6px #1e1624,0 13px 0 #302132,0 17px 4px #141116,0 32px 40px #0009}
.felt-inside{z-index:0;opacity:1;background:linear-gradient(155deg,#ffffff14,#00000018),repeating-linear-gradient(0deg,#ffffff03 0 1px,transparent 1px 4px),var(--felt-color);box-shadow:inset 0 10px 18px #07132680,inset 0 -3px 7px #ffffff24;border-radius:50%}
.felt::after{z-index:0}.felt .table-center{z-index:1}
@media(min-width:601px) and (max-width:1100px){.felt{--oval-x:1.10;--oval-y:.93}}
@media(max-width:600px){.felt{--oval-x:.96;--oval-y:1.055}.felt::before{box-shadow:inset 0 3px 4px #d5cbd775,inset 0 -5px 5px #1e1624,0 9px 0 #302132,0 12px 3px #141116,0 23px 30px #0009}}
/* Enlarged cards, a persistent action panel, and physical pot chips. */
#app{--card-width:57.12px;--card-height:81.76px;--card-padding:6.72px;--rank-size:32.48px;--suit-size:31.36px}
@media(min-width:601px) and (max-width:1100px){#app{--card-width:49.28px;--card-height:70.56px;--rank-size:29.12px;--suit-size:26.88px}}
@media(max-width:600px){#app{--card-width:38.08px;--card-height:56px;--card-padding:4.48px;--rank-size:25.76px;--suit-size:24.64px}}
.action-controls{margin:0;padding:0;border:0;min-width:0}
.action-dock{transition:opacity .25s ease}.action-dock.inactive{opacity:.62}
.action-dock.inactive button:disabled{opacity:1;filter:none;cursor:default}.action-dock.inactive input{opacity:1}
.pot-chips{position:absolute;left:50%;top:-24px;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;gap:3px;width:max-content;max-width:220px;pointer-events:none}
.pot-contribution{display:inline-flex;padding-bottom:7px}.pot-chips .chip-stack{background:var(--chip-tone);width:16px;height:10px}
.gesture-loss .player-head{animation:loss-reaction 1400ms ease-in-out both;animation-delay:var(--gesture-delay);transform-box:view-box;transform-origin:60px 68px}
@keyframes loss-reaction{0%,100%{transform:rotate(0)}25%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}75%{transform:rotate(-4deg)}}
@media(prefers-reduced-motion:reduce){.gesture-loss .player-head{animation:none}.action-dock{transition:none}}
/* Requested action colours, retaining the raised edges. */
.action-dock .bet-buttons .fold{--button-top:#d8195d;--button-bottom:#d8195d;--button-edge:#85103a}
.action-dock .bet-buttons .call{--button-top:#137f09;--button-bottom:#137f09;--button-edge:#0b4905}
.action-dock .bet-buttons .primary{--button-top:#ff6909;--button-bottom:#ff6909;--button-edge:#a43d00;color:#211006;text-shadow:0 1px #fff3}
.action-dock [data-allin]{background:#47d30e;color:#102707;border:1px solid #c4ff9d;border-radius:10px;font-weight:800;min-height:46px;box-shadow:inset 0 2px 2px #ffffff65,0 4px 0 #287e07,0 7px 9px #0004;transition:transform .12s,box-shadow .12s}
.action-dock [data-allin]:active:not(:disabled){transform:translateY(3px);box-shadow:inset 0 2px 3px #0002,0 1px 0 #287e07}
.action-dock [data-allin]:focus-visible{outline:3px solid #f7f1cf;outline-offset:4px}

.action-dock .bet-buttons .fold{--button-top:#bc2b2b;--button-bottom:#bc2b2b;--button-edge:#751919}
.action-dock [data-allin]{background:#1284a8;color:#fff;border-color:#65c6e3;box-shadow:inset 0 2px 2px #ffffff65,0 4px 0 #09546c,0 7px 9px #0004}
.action-dock [data-allin]:active:not(:disabled){box-shadow:inset 0 2px 3px #0002,0 1px 0 #09546c}
.allin-confirm{width:min(360px,calc(100vw - 32px));padding:24px;border:1px solid #557080;border-radius:16px;background:#14232d;color:#fff;box-shadow:0 20px 65px #0009}
.allin-confirm::backdrop{background:#0009}.allin-confirm h2{margin:0 0 12px;font-size:22px}.allin-confirm p{line-height:1.5;margin:0 0 20px}
.confirm-buttons{display:flex;gap:12px}.confirm-buttons button{flex:1;min-height:48px;font-weight:800}.confirm-yes{background:#1284a8;color:#fff}.confirm-no{background:#34444e;color:#fff}.confirm-buttons button:focus-visible{outline:3px solid #fff;outline-offset:3px}

/* Compact pre-action replaces the betting controls between turns. */
.action-dock .bet-buttons .primary{color:#fff;text-shadow:0 1px 2px #0007}
.action-dock.inactive{opacity:1}
.action-dock.inactive .your-hand{display:none}
.action-dock .actions{position:relative}
.check-fold-toggle{width:100%;min-height:48px;padding:12px 8px;background:#263c45;color:#fff;border:1px solid #69848c;border-radius:10px;font-weight:700;animation:preaction-in .4s ease}
.check-fold-toggle[aria-pressed="true"]{background:#137f09;border-color:#7ee76e}
.check-fold-toggle span{font-size:21px;vertical-align:middle;margin-right:5px}
.check-fold-toggle:disabled{opacity:.45!important;cursor:default}
.departing-controls{position:absolute;inset:0 0 auto;pointer-events:none;background:#14232d;z-index:2}
@keyframes preaction-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.check-fold-toggle{animation:none}}

/* Per-player card palette; card size and shape remain unchanged. */
#app .card.suit-clubs{--ink:var(--clubsColor,#37a809)}
#app .card.suit-diamonds{--ink:var(--diamondsColor,#1c00ff)}
#app .card.suit-hearts{--ink:var(--heartsColor,#ff0000)}
#app .card.suit-spades{--ink:var(--spadesColor,#000000)}
#app .seat-cards .card b,#app .community .card b,#app .your-hand .card b{color:var(--rankColor,#000000)}
.card-color-options{border:1px solid #42565f;border-radius:8px;margin:14px 0;padding:12px;min-width:0}
.card-color-options legend{padding:0 6px;font-weight:700}
.card-color-options label{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:8px 0}
.card-color-options input[type=color]{width:58px;min-width:44px;height:40px;padding:3px;cursor:pointer}

/* Preserve the exact Check target between active and queued controls. */
.action-dock .bet-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.action-dock .bet-buttons button{min-width:0}
.action-dock.inactive .your-hand{display:block;visibility:hidden}
.action-dock.inactive{background:transparent;border-color:transparent;box-shadow:none}
.preaction-placeholder{visibility:hidden;pointer-events:none}
.action-dock .check-fold-toggle{position:fixed;position:absolute;min-height:38px;height:38px;padding:3px;font-size:11px;line-height:1.1;transform:translate(-50%,-50%);animation:none;z-index:3}
.action-dock .check-fold-toggle span{font-size:16px;margin-right:2px}
.action-dock.inactive .actions{position:static}
.my-countdown{position:absolute;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:none;font-size:34px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;z-index:5;pointer-events:none;transition:color .2s linear}
@media(max-width:600px){.action-dock .bet-buttons{grid-template-columns:1fr}.my-countdown{font-size:28px}}
.action-dock .your-hand{height:58px;min-height:58px;overflow:hidden}@media(max-width:600px){.action-dock .your-hand{height:32px;min-height:32px}}

.action-dock .check-fold-toggle{min-height:58px;border-radius:12px}
.my-countdown{width:67.2px;height:67.2px;font-size:40.8px;background:var(--felt-color,#387EE2)}
@media(max-width:600px){.my-countdown{font-size:33.6px}}

/* Raised dark-brown countdown rim and soft depth on dealt/revealed cards. */
.my-countdown{border:5px solid #392218;box-shadow:inset 0 2px 3px #efbc7e88,inset 0 -3px 4px #0007,0 4px 0 #21120d,0 7px 10px #0008;font-weight:900}
@keyframes deal-softly{0%{opacity:0;transform:perspective(650px) translate3d(-12px,-36px,22px) rotateX(28deg) rotateZ(-5deg) scale(.96);box-shadow:0 14px 18px #0005}35%{opacity:1}80%{transform:perspective(650px) translate3d(0,-2px,2px) rotateX(3deg)}100%{opacity:1;transform:perspective(650px) translate3d(0,0,0) rotateX(0);box-shadow:0 2px 4px #0004}}
.showdown-reveal>.card{animation:showdown-soft 900ms cubic-bezier(.2,.7,.3,1) both;animation-delay:var(--reveal-delay)}
.seat-cards.showdown-cards{animation:showdown-inward 900ms cubic-bezier(.2,.7,.3,1) both;animation-delay:var(--reveal-delay)}
@keyframes showdown-inward{from{transform:translate(-50%,-50%)}to{transform:translate(calc(-50% + var(--showdown-x,0px)),calc(-50% + var(--showdown-y,0px)))}}
@media(prefers-reduced-motion:reduce){.seat-cards.showdown-cards{animation:none;transform:translate(calc(-50% + var(--showdown-x,0px)),calc(-50% + var(--showdown-y,0px)))}}
@keyframes showdown-soft{from{opacity:1;transform:perspective(600px) rotateY(12deg) translateY(-3px)}to{opacity:1;transform:perspective(600px) rotateY(0) translateY(0)}}
@media(prefers-reduced-motion:reduce){.showdown-reveal>.card{animation:none}}

.my-countdown{border-color:#fff;color:#fff;box-shadow:inset 0 2px 3px #ffffff88,inset 0 -3px 4px #0007,0 4px 0 #a8a8a8,0 7px 10px #0008}

.payout-layer{position:absolute;inset:0;pointer-events:none;z-index:8}
.payout-chip.chip-stack{position:absolute;width:20px;height:13px;background:#bc914a;box-shadow:0 3px 0 #725025,0 5px 5px #0005;animation:payout-travel 1600ms cubic-bezier(.35,.05,.3,1) both}
@keyframes payout-travel{0%{opacity:0;transform:translate(0,0) scale(1)}8%{opacity:1}85%{opacity:1}100%{opacity:0;transform:translate(var(--travel-x),var(--travel-y)) scale(.75)}}
@media(prefers-reduced-motion:reduce){.payout-chip.chip-stack{animation-duration:1ms}}

.action-dock.actions-fade-in{animation:action-panel-appear 350ms ease-out both}
@keyframes action-panel-appear{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.action-dock.actions-fade-in{animation-duration:1ms}}

body{background:radial-gradient(ellipse at 35% 30%,#192930 0%,var(--bg) 65%)}
.table-stage{background:transparent;border-radius:20px}
.felt::before{background:linear-gradient(180deg,color-mix(in srgb,var(--railColor,#55455b),white 30%) 0%,color-mix(in srgb,var(--railColor,#55455b),white 10%) 9%,var(--railColor,#55455b) 25%,color-mix(in srgb,var(--railColor,#55455b),black 25%) 70%,color-mix(in srgb,var(--railColor,#55455b),black 55%) 100%)}

.collection-layer .collection-bet{position:absolute;transform:none;animation:collect-visible-stack 1600ms cubic-bezier(.35,.05,.3,1) both}
@keyframes collect-visible-stack{0%{opacity:1;transform:translate(0,0)}90%{opacity:1}100%{opacity:0;transform:translate(var(--travel-x),var(--travel-y))}}
@media(prefers-reduced-motion:reduce){.collection-layer .collection-bet{animation-duration:1ms}}

/* Continuous hand-to-wager transfer and uniformly larger chips. */
.chip-stack{scale:1.2}
.payout-chip.chip-stack{scale:1;translate:-50% -50%;width:24px;height:15.6px}
.held-chips{transform-box:fill-box;transform-origin:center;transform:scale(1.2)}
.gesture-call .gesture-object,.gesture-raise .gesture-object{display:none}
.bet-transfer{position:absolute;z-index:7;pointer-events:none;animation:hand-to-wager 524.194ms ease-out both}
@keyframes hand-to-wager{0%{opacity:1;transform:translate(-50%,-50%)}100%{opacity:1;transform:translate(calc(var(--travel-x) - 50%),calc(var(--travel-y) - 50%))}}
.bet-transfer{visibility:hidden}
@keyframes hand-to-wager{0%{visibility:visible;opacity:1;transform:translate(-50%,-50%)}100%{visibility:visible;opacity:1;transform:translate(calc(var(--travel-x) - 50%),calc(var(--travel-y) - 50%))}}
@media(prefers-reduced-motion:reduce){.bet-transfer{animation-duration:1ms}}
.bet-transfer{animation-fill-mode:forwards}

.table-center .pot{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:8px}
.table-center .pot>span,.table-center .pot>strong{display:inline-block;margin:0;white-space:nowrap}
@keyframes pot-stack-disappear{to{visibility:hidden}}

/* Shorter, gentler flop slide without a settling bounce. */
@keyframes deal-softly{0%{opacity:0;transform:perspective(650px) translate3d(-8px,-24px,10px) rotateX(16deg) rotateZ(-3deg) scale(.98);box-shadow:0 9px 14px #0004}25%{opacity:1}100%{opacity:1;transform:perspective(650px) translate3d(0,0,0) rotateX(0) rotateZ(0) scale(1);box-shadow:0 2px 4px #0004}}

/* Reference affects the painted oval only, never seat/layout coordinates. */
.felt{--oval-x:1.10;--oval-y:.94}
.felt::before,.felt::after,.felt-inside{border-radius:44% / 50%}
@media(min-width:601px) and (max-width:1100px){.felt{--oval-x:1.11;--oval-y:.94}}
@media(max-width:600px){.felt{--oval-x:.96;--oval-y:1.075}.felt::before,.felt::after,.felt-inside{border-radius:50% / 44%}}

/* The outside of the padded rail follows the requested screen ratio. */
.table-stage{height:auto;aspect-ratio:16 / 9}
.felt{inset:23px;--oval-x:1;--oval-y:1}
@media(max-width:600px){.table-stage{aspect-ratio:9 / 16}.felt{inset:14px}}
@media(min-width:1101px){.game-layout{grid-template-columns:minmax(0,1fr)}.game-layout>aside{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}.game-layout>aside>.panel{margin-bottom:0}}
@media(max-width:600px){.table-center .pot{top:calc(50% - 112px);gap:4px}.table-center .pot strong{font-size:20px}}

/* Ten percent smaller desktop table, centered and still 16:9. */
@media(min-width:601px){.table-stage{width:calc(68.85% - 57.834px);margin-inline:auto}}
@media(min-width:601px) and (max-width:1100px){.table-stage{width:calc(68.85% - 35.802px)}}

/* Game first; navigation, headings and table information follow below. */
.workspace:has(.table-info){padding-top:0}
.game-layout:has(.table-info){grid-template-columns:minmax(0,1fr)}
.game-layout:has(.table-info) .table-stage{margin-top:128px;margin-bottom:150px}
.table-info{min-width:0}
.table-info header{padding-inline:18px;border-radius:12px}
.table-info .page-heading{margin:20px 18px 0}
.table-info .table-topline{padding:16px 18px}
/* Bodies outside the table; resting fists stop on the padded rail. */
.leave-popup{position:fixed;right:18px;top:18px;z-index:100;width:300px;max-width:calc(100vw - 36px);padding:18px;background:#17232b;border:1px solid #e9c277;border-radius:12px;box-shadow:0 8px 30px #0008}
.notification-popups{position:fixed;right:18px;top:18px;z-index:100;display:flex;flex-direction:column;gap:12px;max-height:calc(100dvh - 36px);overflow-y:auto;padding:2px;max-width:calc(100vw - 36px)}
.notification-popups .leave-popup{position:relative;right:auto;top:auto;flex-shrink:0;max-width:100%;box-sizing:border-box}
.leave-popup strong{display:block;padding-right:22px}.leave-popup p{font-size:14px;margin:10px 0 14px;overflow-wrap:anywhere}.leave-popup-close{position:absolute;right:6px;top:4px;background:none;padding:4px 10px;font-size:23px}.leave-requests .request{flex-wrap:wrap}
.table-stage .seat .player-caption{left:calc(50% + var(--caption-x,0px));top:calc(50% + var(--caption-y,112px));transform:translate(-50%,-50%)}
.seat-pause{display:block;width:100%;min-height:30px;margin-top:6px;padding:5px 8px;border:1px solid #929292;border-radius:6px;background:#666;color:#fff;font-size:11px;line-height:1.25;white-space:normal}
.seat-pause[aria-pressed="true"]{background:#4c4c4c}
@media(max-width:600px){.seat-pause{min-height:44px;padding:5px 3px}}
@media(min-width:1101px){.game-layout:has(.table-info) .table-stage{margin-top:160px;margin-bottom:180px}}
.player-figure{width:133.56px;height:176.4px;transform:translate(-50%,-50%) rotate(var(--facing)) translateY(58px)}
@media(min-width:601px) and (max-width:1100px){.player-figure{width:100.8px;height:133.56px;transform:translate(-50%,-50%) rotate(var(--facing)) translateY(44px)}}
@media(max-width:600px){.player-figure{width:80.64px;height:107.1px;transform:translate(-50%,-50%) rotate(var(--facing)) translateY(36px)}}
@media(min-width:1101px){.table-center .pot{top:calc(50% - 85px)}.table-center .pot strong{font-size:26px}}
@media(max-width:600px){.game-layout:has(.table-info) .table-stage{margin-top:128px;margin-bottom:180px}.table-info header{padding-inline:12px}.table-info .page-heading{margin:16px 6px 0}}

/* Hidden cards occupy 75% of the face-up footprint; showdown restores full size. */
#app .seat-cards .card.back{width:calc(var(--card-width) * .6975);height:calc(var(--card-height) * .6975);padding:calc(var(--card-padding) * .6975);font-size:16.74px}
#app .card.number-rank b{transform:scale(1.15);letter-spacing:normal}
.my-countdown{background:#103141}
.my-countdown.urgent{-webkit-text-stroke:1px #fff;paint-order:stroke fill}
#app .action-dock .your-hand{display:none}
#app .action-dock .raise-control label[for="raise-to"]{display:none}
#app .table-center .community{display:grid;grid-template-columns:repeat(5,var(--card-width));grid-template-rows:var(--card-height);width:max-content;height:var(--card-height);gap:7px;align-items:start}
#app .community .board-slot{width:var(--card-width);height:var(--card-height);line-height:0}
#app .community .card{vertical-align:top}
@media(max-width:600px){#app .table-center .community{gap:3px}}
.time-cards{margin-top:12px}
.time-cards>span{display:block;font-size:11px;color:#cde7c5;margin-bottom:6px}
.time-cards>div{display:flex;gap:6px;flex-wrap:wrap}
.time-cards button{flex:1;min-width:80px;min-height:44px;padding:8px 6px;border:1px solid #b2e698;border-radius:8px;background:#28503a;color:#fff;font-size:12px;font-weight:700;cursor:pointer}
.time-cards button:disabled{opacity:.4;cursor:default}
@media(max-width:600px){.time-cards>div{flex-direction:column}.time-cards button{min-width:0;overflow-wrap:anywhere}}
.seat-body b{font-variant-numeric:tabular-nums}
.seat-body>div{display:flex;flex-direction:column;align-items:center;min-width:0;width:100%;text-align:center}
.seat-body strong,.seat-body b{width:100%;text-align:center}
.seat-pause{margin-left:auto;margin-right:auto;text-align:center}
.chip-request-row{display:flex;align-items:center;gap:8px;min-width:0}
.chip-request-row input{width:74px;min-width:48px;flex:1 1 74px;margin:0;padding:9px 7px}
.chip-request-row button{flex:0 0 auto;white-space:nowrap;padding:10px;font-size:12px}
button[data-do="leave"]{background:var(--gold);color:#222820;border-color:transparent}
.user-list>span{display:inline-flex;align-items:center;gap:8px}
.delete-user{font-size:11px;padding:3px 6px;background:#663434;color:#fff}
.replay-hand-label{display:flex;align-items:center;gap:10px;margin:0 0 10px}
.replay-hand-label select{width:auto;flex:1;margin:0;min-width:0}
.allin-odds{position:absolute;left:50%;top:calc(100% + 4px);transform:translateX(-50%);padding:2px 7px;border-radius:7px;border:1px solid #d5e8cf;background:#102e29;color:#b7ff9e;font:800 13px/1.3 'Segoe UI',sans-serif;white-space:nowrap;box-shadow:0 2px 5px #0008;z-index:5}
.allin-odds:empty{visibility:hidden}
.seat-cards:has(.allin-odds){overflow:visible}
.board-slot.slow-deal.dealing>.card{animation-name:deal-allin-slow;animation-timing-function:cubic-bezier(.4,0,.25,1)}
@keyframes deal-allin-slow{0%{opacity:0;transform:perspective(700px) translate3d(0,-28px,12px) rotateY(90deg)}45%{opacity:1;transform:perspective(700px) translate3d(0,-16px,8px) rotateY(90deg)}80%{opacity:1;transform:perspective(700px) translate3d(0,-3px,2px) rotateY(12deg);box-shadow:0 8px 12px #0005}100%{opacity:1;transform:perspective(700px) translate3d(0,0,0) rotateY(0);box-shadow:0 2px 4px #0004}}
@media(max-width:600px){.allin-odds{font-size:11px;padding:2px 5px}}
#app .table-center .pot{display:grid;grid-template-columns:var(--pot-pile-width,40%) max-content max-content;align-items:center;justify-content:start;gap:8px;transform:none;text-align:left}
#app .table-center .pot>span{grid-column:2;grid-row:1}
#app .table-center .pot>strong{grid-column:3;grid-row:1}
#app .pot-chips{position:relative;left:0;top:0;grid-column:1;grid-row:1;transform:translateX(12px);display:block;height:32px;width:100%;max-width:none;padding:0;--pyramid-step:5px}
#app .pot-contribution{display:contents}
#app .pot-contribution .chip-stack{position:absolute;left:calc(50% + var(--pyramid-x) * var(--pyramid-step));top:calc(100% - 12px - var(--pyramid-y) * 2.3px);transform:translateX(-50%);z-index:var(--pyramid-z);box-shadow:0 2px 0 #17232b99}
@media(max-width:600px){#app .table-center .pot{gap:4px}#app .pot-chips{--pyramid-step:2.7px}}
#app .seat-cards:has(> .card.back){gap:0;padding-bottom:calc(var(--card-height) * .06975)}
#app .seat-cards > .card.back + .card.back{margin-left:calc(var(--card-width) * -.174375);transform:translateY(calc(var(--card-height) * .06975))}
@keyframes showdown-soft{from{opacity:1;transform:perspective(600px) rotateY(12deg) scale(.6975)}to{opacity:1;transform:perspective(600px) rotateY(0) scale(1)}}
/* Last-hand replay is independent of live table controls. */
.table-topline{flex-wrap:wrap;gap:12px}.replay-open{margin-left:auto;padding:10px 16px;border:1px solid #70c7c4;border-radius:9px;background:#255557;color:#fff;font-weight:700;cursor:pointer}.replay-open:disabled{opacity:.45;cursor:default}
.hand-replay{width:min(860px,96vw);max-height:94dvh;overflow:auto;padding:18px;border:1px solid #68888d;border-radius:16px;background:#14242b;color:#fff;box-shadow:0 18px 70px #0009}.hand-replay::backdrop{background:#000a}.replay-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.replay-heading h2{font-size:20px;margin:0}.hand-replay button,.hand-replay select{background:#29444e;color:#fff;border:1px solid #607e88;border-radius:7px;padding:9px 12px;cursor:pointer}.hand-replay button:disabled{opacity:.35;cursor:default}.replay-live-note{font-size:12px;color:#c5d5da;margin:9px 0 14px}.replay-table{height:400px;position:relative;margin:0 18px}.replay-table:before{content:'';position:absolute;inset:35px 25px;border:12px solid var(--railColor,#55455b);border-radius:45%;background:var(--felt-color,#387ee2);box-shadow:inset 0 4px 15px #0005,0 5px 0 #0006}.replay-center{position:absolute;inset:38% 16% 30%;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}.replay-street{font-size:12px;text-transform:uppercase;letter-spacing:1px}.replay-board,.replay-hole{display:flex;justify-content:center;gap:3px}.hand-replay .card,.replay-empty-card{width:36px;height:51px;flex:none;box-sizing:border-box;padding:4px;border-radius:4px}.hand-replay .card{display:inline-flex;flex-direction:column;background:#fff;color:#000;line-height:1;text-shadow:none;box-shadow:0 2px 4px #0005}.hand-replay .card b{font-size:23px;font-weight:400;color:var(--rankColor,#000)}.hand-replay .photo-rank{height:.76em;display:block;overflow:visible}.hand-replay .card i{font-size:21px;line-height:1;font-style:normal}.hand-replay .card i svg{width:.88em;height:.88em}.hand-replay .suit-clubs i{color:var(--clubsColor,#37a809)}.hand-replay .suit-diamonds i{color:var(--diamondsColor,#1c00ff)}.hand-replay .suit-hearts i{color:var(--heartsColor,#ff0000)}.hand-replay .suit-spades i{color:var(--spadesColor,#000)}.hand-replay .card.back{background:repeating-linear-gradient(45deg,#233e61 0 3px,#2e4e76 3px 5px);color:#e6edf3;border:1px solid white;align-items:center;justify-content:center}.replay-player{position:absolute;transform:translate(-50%,-50%);width:82px;padding:5px 3px;border-radius:8px;background:#132932eb;border:2px solid transparent;text-align:center;z-index:1}.replay-player>strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.replay-player small,.replay-player>span{display:block;font-size:10px;line-height:1.2;margin-top:3px}.replay-hole{margin-top:4px}.replay-hole .card{width:24px;height:34px;padding:3px}.replay-hole .card b{font-size:15px}.replay-hole .card i{font-size:13px}.replay-acting{border-color:#0fe51e}.replay-winner{border-color:#ffd174}.replay-folded{opacity:.4}.replay-caption{min-height:24px;text-align:center;margin:12px 0 6px}.replay-seek{width:100%;accent-color:#83d6d0}.replay-controls{display:flex;gap:7px;align-items:center;justify-content:center;flex-wrap:wrap}.replay-controls label,.replay-step{font-size:12px}.replay-step{min-width:48px;text-align:right}
@media(max-width:600px){.replay-open{width:100%;margin:0}.hand-replay{padding:10px}.replay-table{height:440px;margin:0}.replay-table:before{inset:35px 12px}.replay-player{width:59px;padding:4px 1px}.replay-player>strong{font-size:9px}.replay-player small,.replay-player>span{font-size:9px}.replay-hole{gap:1px}.replay-hole .card{width:20px;height:29px;padding:2px}.replay-hole .card b{font-size:13px}.replay-hole .card i{font-size:12px}.replay-center{inset:40% 12% 35%;gap:7px}.replay-board .card,.replay-empty-card{width:29px;height:42px;padding:3px}.replay-board .card b{font-size:20px}.replay-board .card i{font-size:17px}}
.hand-replay{overflow-x:hidden}.replay-table{height:min(400px,52dvh)}.replay-controls label{margin:0}.hand-replay .replay-seek{box-sizing:border-box}@media(max-width:600px){.replay-table{height:min(440px,54dvh)}}

/* Phone-only framing: slightly narrower, shorter, with room for player labels. */
@media(max-width:600px){
 #app{--card-width:32px;--card-height:47.06px;--card-padding:3.76px;--rank-size:21.65px;--suit-size:20.70px}
 .game-layout:has(.table-info) .table-stage{height:clamp(320px,calc(100svh - 270px),460px);aspect-ratio:auto;margin:108px 25px 160px}
 .player-figure{width:52.9px;height:70.2578125px;transform:translate(-50%,-50%) rotate(var(--facing)) translateY(17px)}
 .table-stage .seat .player-caption{width:66px}
 .table-stage .seat-body strong{font-size:10px;max-width:60px}
 .table-stage .seat-body b{font-size:13px}
 #app .table-center .pot:not(:has(.pot-chips)){grid-template-columns:0 max-content max-content;justify-content:center}
}
@media(max-width:380px){
 #app{--card-width:28px;--card-height:41.18px;--card-padding:3.29px;--rank-size:18.95px;--suit-size:18.11px}
 #app .table-center .pot{gap:2px}
 #app .table-center .pot strong{font-size:16px}
 #app .table-center .pot>span{font-size:8px}
 #app .table-center .pot small{font-size:9px}
}

/* Larger face-up cards and legible wagers on phones only. Hidden cards keep their size. */
@media(max-width:600px){
 #app .table-stage .card:not(.back){width:calc(var(--card-width) * 1.2);height:calc(var(--card-height) * 1.2);padding:calc(var(--card-padding) * 1.2)}
 #app .table-stage .card:not(.back) b{font-size:calc(var(--rank-size) * 1.2)}
 #app .table-stage .card:not(.back) i{font-size:calc(var(--suit-size) * 1.2)}
 #app .table-center .community{grid-template-columns:repeat(5,calc(var(--card-width) * 1.2));grid-template-rows:calc(var(--card-height) * 1.2);height:calc(var(--card-height) * 1.2)}
 #app .community .board-slot{width:calc(var(--card-width) * 1.2);height:calc(var(--card-height) * 1.2)}
 #app .table-stage .wager b{font-size:20px;line-height:1.2}
}
@media(max-width:380px){#app .table-stage .wager b{font-size:16px}}
/* Avoid browser auto-zoom when entering a bet on a phone. */
@media(max-width:600px){#app .action-dock #raise-to{font-size:16px}.game-main{overflow-anchor:none}}
/* Desktop wager amounts match the total pot at each desktop breakpoint. */
@media(min-width:601px){#app .table-stage .wager b{font-size:26px;line-height:1.2;font-weight:700;color:#fff}}
@media(min-width:601px) and (max-width:1100px){#app .table-stage .wager b{font-size:24px}}
.table-message:empty{display:none}