/* Shared 2–5 player table. No single-card play areas or turn indicators. */
.biji-table {
  position: relative;
  height: calc(100dvh - var(--header-h));
  max-width: 1800px;
  margin: auto;
  isolation: isolate;
  color: #f4e8c8;
}
.biji-table-ring {
  position: absolute;
  inset: 9% 11% 23%;
  border: 1px solid #d9c99125;
  border-radius: 48%;
  background: radial-gradient(ellipse, #39694e0f, #0a382333);
  box-shadow: inset 0 0 0 5px #b4c39307;
  z-index: -1;
}
.biji-table-center { position: absolute; left: 50%; top: 42%; transform: translate(-50%,-50%); display: grid; justify-items: center; gap: 7px; white-space: nowrap; }
.biji-table-center > strong { font: 46px/1.1 'KaiTi','STKaiti',serif; letter-spacing: 12px; margin-left: 12px; color: #ddd2a177; }
.biji-table-center > span { color: #e6dbb1a6; font-size: 13px; letter-spacing: 3px; }
.biji-table-center > small { color: #b7c9ac; font-size: 11px; }
.biji-seat { position: absolute; width: 172px; display: grid; justify-items: center; gap: 10px; }
.biji-seat--north { left: 50%; top: 3%; transform: translateX(-50%); }
.biji-seat--north-west { left: 32%; top: 3%; transform: translateX(-50%); }
.biji-seat--north-east { left: 68%; top: 3%; transform: translateX(-50%); }
.biji-seat--west { left: 3.5%; top: 33%; }
.biji-seat--east { right: 3.5%; top: 33%; }
.biji-seat-person { display: flex; align-items: center; gap: 9px; min-width: 0; max-width: 100%; }
.biji-seat-person .avatar { width: 47px; height: 47px; border-width: 2px; }
.biji-seat-person > div { display: grid; gap: 4px; min-width: 0; }
.biji-seat-person strong { display: flex; align-items: center; gap: 5px; max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 500; }
.biji-seat-person em { border: 1px solid #d9c58080; color: #e7cf91; border-radius: 3px; font: 9px/1.3 sans-serif; padding: 1px 3px; flex-shrink: 0; }
.biji-seat-status { font-size: 10px; color: #d5d9bc; white-space: nowrap; }
.biji-seat-status.is-locked,.biji-seat-status.is-ready { color: #f3d48a; }
.biji-seat-status.is-locked:before,.biji-seat-status.is-ready:before { content: '✓ '; }
.biji-seat-status.is-offline { color: #b6baa9; }
.biji-seat-person small { font-size: 10px; color: #bbccb1; }
.biji-seat-person small b { font-size: 12px; font-weight: 500; color: #f1e0af; }
.biji-hidden-lanes { display: grid; gap: 4px; padding: 7px 10px; border-radius: 8px; border: 1px solid #a5b68a30; background: #0b362b80; }
.biji-hidden-lanes > div { display: flex; gap: 4px; align-items: center; }
.biji-hidden-lanes span { font-size: 9px; color: #b9c7a8; margin-right: 4px; }
.biji-hidden-lanes i { width: 17px; height: 24px; border: 1px solid #c5cfa78c; border-radius: 3px; background: repeating-linear-gradient(45deg,#315e4844 0 2px,#60816b33 2px 3px),#174a38; box-shadow: inset 0 0 0 2px #153f3099; }
.biji-seat--empty { gap: 7px; color: #d0d2b3; }
.biji-empty-avatar { width: 47px; height: 47px; border: 1px dashed #c5cba477; border-radius: 50%; display: grid; place-items: center; font-size: 24px; color: #ced5b8aa; background: #174a3955; }
.biji-seat--empty strong { font-size: 12px; font-weight: 400; }
.biji-seat--empty small { font-size: 10px; color: #a8bca0; }
.biji-self-seat { position: absolute; left: max(var(--safe-x),4%); right: max(var(--safe-x),4%); bottom: 5%; display: grid; grid-template-columns: minmax(105px,1fr) auto minmax(130px,1fr); align-items: center; gap: 22px; padding: 15px 20px; border: 1px solid #d3c07a66; border-radius: 13px; background: linear-gradient(100deg,#0b332ddd,#174d3ee6,#0b332ddd); box-shadow: 0 7px 20px #001e2150,inset 0 0 0 3px #d4c69108; }
.biji-own-cards { min-width: 0; }
.biji-hand-caption { display: flex; justify-content: space-between; align-items: center; gap: 15px; margin-bottom: 7px; font-size: 11px; }
.biji-hand-caption b { font-weight: 500; color: #f3e1ad; }
.biji-hand-caption > span { font-size: 9px; color: #c5d0b2; }
.biji-hand-groups { display: flex; gap: 13px; justify-content: center; }
.biji-hand-group { position: relative; }
.biji-hand-group > span { display: block; margin: 0 0 4px; text-align: center; font-size: 10px; color: #cbd3b3; }
.biji-hand-group .cards { --card-w: clamp(44px,4.65vw,76px); gap: 4px; }
.biji-seat-actions { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.biji-seat-actions .btn { min-height: 48px; min-width: 125px; padding: 10px 17px; font-size: 19px; font-family: 'KaiTi','STKaiti',serif; letter-spacing: 2px; }
.biji-table-tip { position: absolute; bottom: 1.3%; width: 100%; text-align: center; font-size: 10px; color: #c3cdaf; }

.seat-waiting-room { grid-template-rows: minmax(0,1fr); align-items: stretch; min-height: 0; padding-top: 16px; padding-bottom: 16px; }
.seat-waiting-room .room-summary { min-height: 0; max-height: 100%; overflow-y: auto; }
.seat-waiting-room .biji-table { width: 100%; height: 100%; min-height: 0; }
.biji-table--waiting { background: radial-gradient(ellipse at 50% 45%,#28654f,#0b3a2d); border: 1px solid #c9b27355; border-radius: 18px; box-shadow: 0 6px 20px #092f2555; }
.biji-table--waiting .biji-table-ring { inset: 11% 8% 12%; border: 3px double #ceb46e77; background: radial-gradient(ellipse,#28644e88,#113d2f99); }
.biji-table--waiting .biji-seat--west { left: 1%; }
.biji-table--waiting .biji-seat--east { right: 1%; }
.biji-table--waiting .biji-self-seat { grid-template-columns: 1fr 1fr; left: 15%; right: 15%; bottom: 4%; }
.biji-table--waiting .biji-seat-actions { flex-direction: row; justify-content: end; }
.biji-table--waiting .biji-seat-actions .btn { min-width: 85px; font-size: 16px; }

@media (max-width:1100px) {
  .biji-self-seat { gap: 12px; padding: 12px; grid-template-columns: minmax(90px,1fr) auto minmax(100px,1fr); }
  .biji-seat { width: 140px; }
  .biji-seat-person { gap: 6px; }
  .biji-seat-person .avatar { width: 39px; height: 39px; }
  .biji-seat-person strong { font-size: 11px; max-width: 95px; }
  .biji-seat-actions .btn { min-width: 98px; font-size: 16px; padding: 8px 12px; }
  .biji-hand-groups { gap: 9px; }
  .biji-hand-group .cards { --card-w: 43px; gap: 3px; }
  .biji-table--waiting .biji-seat { width: 118px; }
  .biji-table--waiting .biji-self-seat { left: 7%; right: 7%; }
}
@media (orientation:landscape) and (max-height:600px) {
  .biji-table-ring { inset: 8% 12% 30%; }
  .biji-seat { width: 135px; gap: 4px; }
  .biji-seat--north,.biji-seat--north-west,.biji-seat--north-east { top: 2%; }
  .biji-seat--west,.biji-seat--east { top: 31%; }
  .biji-seat-person .avatar { width: 32px; height: 32px; }
  .biji-seat-person > div { gap: 2px; }
  .biji-seat-person strong { font-size: 10px; max-width: 91px; }
  .biji-seat-status,.biji-seat-person small { font-size: 8px; }
  .biji-seat-person small b { font-size: 9px; }
  .biji-hidden-lanes { gap: 2px; padding: 4px 7px; }
  .biji-hidden-lanes > div { gap: 3px; }
  .biji-hidden-lanes span { font-size: 7px; margin-right: 2px; }
  .biji-hidden-lanes i { width: 10px; height: 14px; border-radius: 2px; }
  .biji-table-center { top: 40%; gap: 4px; }
  .biji-table-center > strong { font-size: 31px; letter-spacing: 7px; margin-left: 7px; }
  .biji-table-center > span { font-size: 10px; letter-spacing: 2px; }
  .biji-table-center > small { font-size: 8px; }
  .biji-self-seat { bottom: 6%; gap: 11px; padding: 8px 12px; }
  .biji-hand-caption { font-size: 9px; margin-bottom: 5px; }
  .biji-hand-caption > span { font-size: 8px; }
  .biji-hand-group .cards { --card-w: clamp(34px,4.9vw,48px); gap: 3px; }
  .biji-hand-group > span { font-size: 8px; margin-bottom: 3px; }
  .biji-hand-groups { gap: 9px; }
  .biji-seat-actions .btn { min-height: 44px; min-width: 96px; font-size: 16px; }
  .biji-table-tip { font-size: 8px; bottom: 1%; }
  .biji-empty-avatar { width: 32px; height: 32px; font-size: 19px; }
  .biji-seat--empty { gap: 3px; }
  .biji-seat--empty strong { font-size: 10px; }
  .biji-table--waiting .biji-table-center { top: 40%; }
  .biji-table--waiting .biji-self-seat { bottom: 3%; }
  .biji-table--waiting .biji-seat-actions { flex-wrap: wrap; gap: 4px; }
  .biji-table--waiting .biji-seat-actions .btn { min-width: 80px; padding: 6px 9px; font-size: 13px; }
  .seat-waiting-room .room-summary { padding: 10px 12px; gap: 5px; }
  .seat-waiting-room .room-summary dl { gap: 5px; }
  .seat-waiting-room .room-summary h2 { padding-bottom: 5px; }
}
@media (orientation:portrait) and (max-width:700px) {
  .biji-table { min-height: 0; }
  .biji-seat { width: 132px; gap: 7px; }
  .biji-seat--north-west { left: 26%; top: 5%; }
  .biji-seat--north-east { left: 74%; top: 5%; }
  .biji-seat--north { top: 5%; }
  .biji-seat--west { left: 2%; top: 33%; }
  .biji-seat--east { right: 2%; top: 33%; }
  .biji-table-center { top: 51%; gap: 6px; }
  .biji-table-center > strong { font-size: 35px; }
  .biji-table-center > span { font-size: 10px; letter-spacing: 2px; }
  .biji-table-center > small { font-size: 9px; }
  .biji-self-seat { grid-template-columns: 1fr auto; left: 12px; right: 12px; gap: 12px; bottom: 5%; padding: 13px 10px; }
  .biji-own-cards { grid-column: 1/-1; grid-row: 1; }
  .biji-hand-group .cards { --card-w: clamp(25px,7.6vw,43px); gap: 2px; }
  .biji-hand-groups { gap: 7px; }
  .biji-seat-actions { align-items: end; }
  .biji-table-tip { font-size: 9px; bottom: 1.2%; }
  #app:has(.seat-waiting-room) { overflow-y: auto; }
  .seat-waiting-room { display: grid; grid-template-columns: 1fr; grid-template-rows: 350px auto; height: auto; padding: 15px 14px 25px; gap: 12px; }
  .seat-waiting-room .room-summary { max-height: none; overflow: visible; }
  .seat-waiting-room .biji-table { height: 350px; min-height: 350px; }
  .biji-table--waiting .biji-table-center { top: 46%; }
  .biji-table--waiting .biji-seat--west,.biji-table--waiting .biji-seat--east { top: 32%; }
  .biji-table--waiting .biji-self-seat { bottom: 1%; left: 3%; right: 3%; padding: 10px; }
  .biji-table--waiting .biji-seat-person strong { max-width: 80px; }
  .biji-table--waiting .biji-seat-actions .btn { min-width: 76px; font-size: 13px; padding: 7px 8px; }
}
