/* Desktop felt fills the shared room pane; every seat owns its card row. */
@media(min-width:851px) and (pointer:fine){
 :where(html:not(.mobile-layout)) body.poker-active #room>.panel.grow{display:flex;flex-direction:column;height:calc(100dvh - 20px);min-height:520px;box-sizing:border-box}
 :where(html:not(.mobile-layout)) body.poker-active #game{display:flex;flex:1;min-height:0;flex-direction:column}
 :where(html:not(.mobile-layout)) body.poker-active #game>.game-head{flex:0 0 auto;gap:12px}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area{display:grid;flex:1;min-height:0;width:100%;max-width:none;grid-template-columns:minmax(0,1fr) 172px;gap:12px;align-items:stretch;padding:8px 0 0;container:poker-stage / inline-size}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-table{display:grid;width:100%;height:100%;min-height:0;max-height:none;box-sizing:border-box;padding:18px 20px;grid-template-rows:auto auto minmax(0,1fr) auto auto auto auto auto;gap:10px;border-radius:30px;overflow:hidden;animation:none;box-shadow:inset 0 0 0 6px #101c17,inset 0 0 0 8px #b98d3866,0 8px 24px #0005;background:radial-gradient(ellipse at 50% 40%,#286044,#123b2d 65%,#102b23)}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-table::before{content:"TEXAS HOLD’EM";top:47%;font-size:clamp(20px,3vw,42px);color:#e6d7a012;letter-spacing:.14em}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-table[data-seven="true"]::before{content:"SEVEN POKER"}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-table::after{inset:10px;border-width:1px;box-shadow:none}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-table-head{grid-row:1;display:grid;width:100%;min-height:34px;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:8px;padding:0;margin:0}
 :where(html:not(.mobile-layout)) body.poker-active #poker-mode{max-width:100%;font-size:10px;white-space:nowrap}
 :where(html:not(.mobile-layout)) body.poker-active #poker-round-hud{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:4px}
 :where(html:not(.mobile-layout)) body.poker-active #poker-blinds,:where(html:not(.mobile-layout)) body.poker-active #poker-street{font-size:10px;white-space:nowrap}
 :where(html:not(.mobile-layout)) body.poker-active #poker-community{grid-row:2;min-height:0;margin:0;gap:7px}
 :where(html:not(.mobile-layout)) body.poker-active #poker-community:empty{display:none}
 :where(html:not(.mobile-layout)) body.poker-active #poker-players{grid-row:3;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(135px,1fr);align-content:stretch;gap:12px;width:100%;max-width:none;min-height:0;margin:0;padding:7px 3px;overflow:auto;scrollbar-width:thin;overscroll-behavior:contain}
 :where(html:not(.mobile-layout)) body.poker-active #poker-players[data-seven="true"]{grid-template-columns:repeat(3,minmax(0,1fr))}
 :where(html:not(.mobile-layout)) body.poker-active #poker-players:is([data-count="1"],[data-count="2"]){grid-template-columns:repeat(2,minmax(0,1fr))}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-player{display:grid;min-width:0;min-height:0;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(42px,1fr) auto;align-content:center;align-items:center;gap:6px;padding:12px;box-sizing:border-box;border-radius:14px;overflow:visible}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-player>b{grid-column:1;grid-row:1;min-width:0;font-size:12px}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-player>span{grid-column:1;grid-row:2;font-size:11px;line-height:1.4;overflow-wrap:anywhere}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-mini-cards{grid-row:3;grid-column:1;display:grid;grid-template-columns:repeat(var(--poker-card-count,2),minmax(0,1fr));justify-self:center;align-self:center;gap:3px;width:min(100%,calc(var(--poker-card-count,2)*40px));min-width:0;margin:0}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-mini-cards .poker-card{width:100%;min-width:0;max-width:40px;height:auto;min-height:0;aspect-ratio:2/3;margin:0;font-size:clamp(10px,1.2vw,14px);box-sizing:border-box;border-radius:5px;padding:2px;flex:none}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-showdown-hand{grid-column:1;grid-row:4;width:100%;min-width:0;margin:0;white-space:normal;overflow-wrap:anywhere;line-height:1.4;font-size:10px}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-hand{grid-row:4;margin:0;min-width:0;justify-content:center;gap:10px}
 :where(html:not(.mobile-layout)) body.poker-active #poker-hole-cards{margin:0;gap:5px;flex-wrap:wrap;justify-content:center}
 :where(html:not(.mobile-layout)) body.poker-active #poker-hole-cards .poker-card,:where(html:not(.mobile-layout)) body.poker-active #poker-community .poker-card{width:38px;height:53px;min-width:0;font-size:16px;margin:0}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-action-info{grid-row:5;min-height:18px;margin:0;font-size:12px;line-height:1.4;text-align:center}
 :where(html:not(.mobile-layout)) body.poker-active #poker-actions{grid-row:6;margin:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));width:min(570px,100%);justify-self:center;gap:7px}
 :where(html:not(.mobile-layout)) body.poker-active #poker-actions button{min-width:0;min-height:38px;padding:7px 5px;font-size:12px;white-space:normal;overflow-wrap:anywhere}
 :where(html:not(.mobile-layout)) body.poker-active #poker-raise-row{grid-row:7;margin:0;justify-content:center}
 :where(html:not(.mobile-layout)) body.poker-active #poker-open-results{grid-row:8;justify-self:center;margin:0;min-height:38px}
 :where(html:not(.mobile-layout)) body.poker-active #poker-hand-guide{grid-column:2;min-height:0;max-height:100%;overflow:auto;align-self:stretch;border-radius:18px;padding:14px 10px;background:#12251edd;box-sizing:border-box}
 :where(html:not(.mobile-layout)) body.poker-active #poker-hand-guide li{font-size:10px}
 @container poker-stage (max-width:850px){
  :where(html:not(.mobile-layout)) body.poker-active #poker-hand-guide{padding:10px 7px}
  :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-table{padding:15px 13px}
 }
 @container poker-stage (max-width:600px){
  :where(html:not(.mobile-layout)) body.poker-active #poker-players,:where(html:not(.mobile-layout)) body.poker-active #poker-players[data-seven="true"]{grid-template-columns:repeat(2,minmax(0,1fr))}
  :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-table-head{grid-template-columns:minmax(0,1fr) auto}
  :where(html:not(.mobile-layout)) body.poker-active #poker-round-hud{grid-column:1/-1;justify-content:center}
 }
}

@media(orientation:landscape) and (max-height:550px) and (min-width:600px){
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-table{height:calc(100dvh - 95px);min-height:270px;grid-template-columns:minmax(0,1fr) 230px;grid-template-rows:auto auto auto auto auto auto auto;gap:5px 12px;padding:11px}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-table-head{grid-column:1/-1;grid-row:1}
 :where(html:not(.mobile-layout)) body.poker-active #poker-players{grid-column:1;grid-row:2/8;height:100%;grid-template-columns:repeat(2,minmax(0,1fr))}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-hand{grid-column:2;grid-row:2}
 :where(html:not(.mobile-layout)) body.poker-active #poker-community{grid-column:2;grid-row:3}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-action-info{grid-column:2;grid-row:4}
 :where(html:not(.mobile-layout)) body.poker-active #poker-actions{grid-column:2;grid-row:5;grid-template-columns:repeat(3,minmax(0,1fr))}
 :where(html:not(.mobile-layout)) body.poker-active #poker-actions button{min-height:36px}
 :where(html:not(.mobile-layout)) body.poker-active #poker-raise-row{grid-column:2;grid-row:6}
 :where(html:not(.mobile-layout)) body.poker-active #poker-open-results{grid-column:2;grid-row:7;min-height:34px}
}

/* A seat does not grow just because the table has fewer players or an effect runs. */

@media(min-width:851px) and (pointer:fine){
 :where(html:not(.mobile-layout)) body.poker-active #poker-players{grid-auto-rows:minmax(145px,190px);align-content:center}
 :where(html:not(.mobile-layout)) body.poker-active #poker-players:is([data-count="1"],[data-count="2"]){grid-template-columns:repeat(2,minmax(0,360px));justify-content:space-evenly;grid-auto-rows:210px;gap:20px}
 :where(html:not(.mobile-layout)) body.poker-active #poker-players:is([data-count="1"],[data-count="2"]) .poker-player{grid-template-rows:auto auto minmax(72px,1fr) auto;padding:16px}
 :where(html:not(.mobile-layout)) body.poker-active #poker-players:is([data-count="1"],[data-count="2"]) .poker-mini-cards{width:min(100%,calc(var(--poker-card-count,2)*54px));gap:5px}
 :where(html:not(.mobile-layout)) body.poker-active #poker-players:is([data-count="1"],[data-count="2"]) .poker-mini-cards .poker-card{max-width:54px;font-size:18px}
 :where(html:not(.mobile-layout)) body.poker-active #poker-hand-guide{min-width:0;overflow-x:hidden;overflow-y:auto}
 :where(html:not(.mobile-layout)) body.poker-active #poker-hand-guide li{min-width:0;overflow-wrap:anywhere}
}
body.poker-active #poker-play-area .poker-player.all-in{animation:poker-seat-flash .6s ease-out both;transform:none}
body.poker-active #poker-play-area .poker-table.allin-active{animation:poker-seat-flash .5s ease-out both;transform:none}
body.poker-active #poker-play-area .poker-card-deal,body.poker-active #poker-play-area .poker-card-reveal{animation:poker-card-soft-reveal .35s ease-out both;animation-delay:var(--deal-delay,0ms)}
@keyframes poker-seat-flash{0%{filter:brightness(1.45)}100%{filter:brightness(1)}}
@keyframes poker-card-soft-reveal{from{opacity:0;filter:brightness(1.35)}to{opacity:1;filter:brightness(1)}}
/* Rank highlights stay inside the guide, including their invisible final frame. */
body.poker-active #poker-hand-guide{min-width:0;overflow-x:hidden}
body.poker-active #poker-hand-guide li{padding-right:22px}
body.poker-active #poker-hand-guide li::before{flex:0 0 14px;white-space:nowrap}
body.poker-active #poker-hand-guide.rank-up::after{inset:0;transform:none;animation:poker-guide-flash 1.02s ease-out both}
body.poker-active #poker-hand-guide li.active.rank-up,
body.poker-active #poker-hand-guide li.active.rank-up::after,
body.poker-active #poker-hand-guide.rank-up .poker-guide-head strong{transform:none;animation:poker-seat-flash 1.02s ease-out both}
@keyframes poker-guide-flash{0%,100%{opacity:0}28%{opacity:.75}}
body.poker-active #poker-open-results{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:min(100%,360px);min-height:52px;padding:9px 20px;font-weight:800;border:1px solid #c3b6ff;background:linear-gradient(135deg,#8067ff,#5840dc);box-shadow:0 0 0 3px #a88bff22,0 5px 20px #0005;cursor:pointer}
body.poker-active #poker-open-results:focus-visible{outline:3px solid #ffe194;outline-offset:3px}
body.poker-active .poker-table[data-phase="ended"] #poker-actions{display:none}
@media(orientation:landscape) and (max-height:550px) and (min-width:600px){
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-table{min-height:310px;grid-template-rows:minmax(30px,auto) minmax(43px,auto) auto auto auto auto minmax(52px,auto)}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-table[data-phase="ended"]{min-height:250px;height:calc(100dvh - 125px)}
 :where(html:not(.mobile-layout)) body.poker-active #poker-players{height:auto;align-self:stretch}
 :where(html:not(.mobile-layout)) body.poker-active #poker-play-area .poker-hand>span{display:none}
 :where(html:not(.mobile-layout)) body.poker-active #poker-hole-cards .poker-card{width:27px;height:39px}
}
@media(prefers-reduced-motion:reduce){body.poker-active #poker-hand-guide.rank-up::after,body.poker-active #poker-hand-guide li.active.rank-up,body.poker-active #poker-hand-guide li.active.rank-up::after,body.poker-active #poker-hand-guide.rank-up .poker-guide-head strong{animation:none}}
@media(prefers-reduced-motion:reduce){body.poker-active #poker-play-area .poker-player.all-in,body.poker-active #poker-play-area .poker-table.allin-active,body.poker-active #poker-play-area .poker-card-deal,body.poker-active #poker-play-area .poker-card-reveal{animation:none}}
/* 모바일 전용 요소(차례 시계 · 남은 시간 막대 · 족보 버튼 · 레이즈 빠른 금액 · 빈 카드 자리 · 획득 표시)는 game-shell.css의 poker 구역에서만 보인다. */
.poker-status,.poker-turn-bar,.poker-hand-chip,.poker-raise-presets,.poker-raise-step,.poker-guide-close,.poker-turn-pill,.poker-seat-win,.poker-card.poker-card-slot,.poker-fit-probe{display:none}