/* The body sits behind the painted rim, while the forearms overlap it. */
.avatar-wrap .body-layer{position:absolute;inset:0}
.avatar-wrap .arm-layer{position:absolute;inset:0;mask-image:none}
/* Keep the original transparent outer silhouette, including elbows and paws.
   Only the torso between the forearms is hidden behind the table. */
.seat-left .arm-layer{clip-path:polygon(0 55%,100% 55%,100% 100%,73% 100%,66% 96%,59% 91%,54% 86%,51% 82%,47% 82%,44% 85%,36% 89%,29% 94%,24% 100%,0 100%)}
.seat-top .arm-layer{clip-path:polygon(0 55%,100% 55%,100% 100%,71% 100%,65% 97%,59% 90%,55% 83%,52% 79%,48% 79%,44% 85%,39% 92%,31% 100%,0 100%)}
.seat-right .arm-layer{clip-path:polygon(0 55%,100% 55%,100% 100%,69% 100%,63% 96%,59% 92%,56% 87%,52% 85%,48% 89%,44% 94%,38% 100%,0 100%)}
.avatar-wrap .portrait{mask-image:none}
.table-stage:has(.table-welcome:not([hidden])) .table-badge{visibility:hidden}

/* A stable button contains a moving visual. Pointer events never land on the
   lifted face, preventing enter/leave oscillation near overlapping card edges. */
.hand .playing-card{background:transparent;border:0;box-shadow:none;overflow:visible;filter:none}
.hand .playing-card .card-face{position:absolute;inset:0;display:block;border:1px solid #d9d9cd;border-radius:inherit;background:#fffdf6;box-shadow:0 2px 3px #273c3425,0 7px 12px #223a2613;overflow:hidden;pointer-events:none;transition:transform .25s cubic-bezier(.2,.75,.2,1),box-shadow .25s,filter .2s;transform-origin:50% 100%}
.hand .playing-card .card-face *{pointer-events:none}
.hand .playing-card.rank-Q .card-face{background:#fffbf5;border-top:3px solid #b997bc}
.hand .playing-card.rank-J .card-face{background:#fffdf5;border-top:3px solid #7e9a70}
.hand .playing-card.rank-K .card-face{background:#fffcf4;border-top:3px solid #c5a05b}
.hand .playing-card:hover:not(:disabled),.hand .playing-card:focus-visible:not(:disabled){transform:translateX(var(--x)) translateY(var(--y)) rotate(var(--rot));box-shadow:none}
.hand .playing-card:hover:not(:disabled) .card-face,.hand .playing-card:focus-visible:not(:disabled) .card-face{transform:translateY(-19px) rotate(calc(-1 * var(--rot)));box-shadow:0 7px 15px #183e332d,0 0 0 2px #cfb47e}
.hand .playing-card.illegal{filter:none}.hand .playing-card.illegal .card-face{filter:brightness(.87) saturate(.55)}
.hand .playing-card.playable:after{display:none}
.hand .playing-card.playable .card-face:after{content:'';position:absolute;bottom:3px;width:16px;height:2px;background:#608267;border-radius:4px;left:calc(50% - 8px)}

/* Registered expression images are limited to the face, so clothing and hands
   never jump between generated frames. Both layers move with the base portrait. */
.body-layer .portrait{position:relative}
.expression-layer,.blink-layer{position:absolute;inset:0;display:block;background-size:300% 100%;background-position:inherit;background-repeat:no-repeat;pointer-events:none;opacity:0}
.expression-layer{transition:opacity .18s ease;mask-image:radial-gradient(ellipse 38% 30% at 52% 43%,#000 78%,transparent 100%)}
.seat-top .expression-layer{mask-image:radial-gradient(ellipse 42% 30% at 50% 44%,#000 78%,transparent 100%)}
.seat-right .expression-layer{mask-image:radial-gradient(ellipse 40% 32% at 57% 43%,#000 78%,transparent 100%)}
.seat[data-mood="happy"] .expression-layer{background-image:url('/assets/seated-happy.png');opacity:1}
.seat[data-mood="thinking"] .expression-layer,.seat[data-mood="disappointed"] .expression-layer{background-image:url('/assets/seated-thoughtful.png');opacity:1}
.blink-layer{background-image:url('/assets/seated-blink.png');transition:opacity .045s ease;mask-image:radial-gradient(ellipse 15% 12% at 40% 36%,#000 75%,transparent 100%),radial-gradient(ellipse 15% 12% at 67% 43%,#000 75%,transparent 100%)}
.seat-top .blink-layer{mask-image:radial-gradient(ellipse 19% 16% at 40% 38%,#000 75%,transparent 100%),radial-gradient(ellipse 19% 16% at 64% 39%,#000 75%,transparent 100%)}
.seat-right .blink-layer{mask-image:radial-gradient(ellipse 17% 12% at 42% 44%,#000 75%,transparent 100%),radial-gradient(ellipse 17% 12% at 69% 35%,#000 75%,transparent 100%)}
.seat.blinking .blink-layer,.seat.winking .blink-layer{opacity:1}
.seat-left.winking .blink-layer{mask-image:radial-gradient(ellipse 15% 12% at 40% 36%,#000 75%,transparent 100%)}
.seat-top.winking .blink-layer{mask-image:radial-gradient(ellipse 19% 16% at 40% 38%,#000 75%,transparent 100%)}
.seat-right.winking .blink-layer{mask-image:radial-gradient(ellipse 17% 12% at 42% 44%,#000 75%,transparent 100%)}
.seat .speech-bubble{top:45%;left:73%;width:max-content;max-width:170px;min-width:85px;white-space:normal;font-weight:500;font-size:11px;line-height:1.5;border:1px solid #e4d6b6;background:#fbf4e3;box-shadow:0 5px 17px #16332333;padding:9px 12px;text-align:left;z-index:10}
.seat-right .speech-bubble{left:auto;right:73%}.speech-bubble[data-kind="call"]{font-size:14px;font-weight:750;min-width:auto}
.seat:has(.speech-bubble.visible){z-index:6}
@media(max-width:760px){.seat .speech-bubble{max-width:130px;min-width:85px;font-size:10px;padding:7px 9px;top:40%;left:65%}.seat-right .speech-bubble{left:auto;right:65%}}
@media(max-width:480px){.seat .speech-bubble{max-width:105px;min-width:78px;font-size:9px;padding:6px 8px}.seat-top .speech-bubble{left:45%;top:90%}.speech-bubble[data-kind="call"]{font-size:12px;min-width:auto}}
.reduced-motion .blink-layer{display:none}
@media(prefers-reduced-motion:reduce){.blink-layer{display:none}}