:root {
  --felt: #1d4de4;
  --felt-light: #3a84ff;
  --rail: #160d4c;
  --rail-glow: #27e7ff;
  --gold: #ffe45c;
  --green: #58ff9b;
  --pink: #ff42ef;
  --text: #f7fbff;
  --muted: #b7c7ff;
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 14% 18%, rgba(255, 66, 239, 0.36), transparent 24rem),
    radial-gradient(circle at 82% 14%, rgba(39, 231, 255, 0.32), transparent 26rem),
    linear-gradient(135deg, #12072b, #101d54 48%, #1a0538);
  color: var(--text);
}
body:not(.in-lobby) {
  min-height: 100dvh;
  overflow-x: hidden;
}
body:not(.in-lobby) {
  padding-bottom: 7.8rem;
}
.rotate-phone-message {
  display: none;
}
.table-debug-status {
  background: rgba(2, 6, 23, .92);
  border: 1px solid rgba(125, 249, 255, .5);
  border-radius: 8px 8px 0 0;
  bottom: 0;
  color: #eaffff;
  display: none;
  font-size: 12px;
  font-weight: 800;
  left: 50%;
  line-height: 1.35;
  max-width: min(100vw, 34rem);
  padding: .45rem .7rem max(.45rem, env(safe-area-inset-bottom, 0px));
  pointer-events: none;
  position: fixed;
  text-align: center;
  transform: translateX(-50%);
  width: 100%;
  z-index: 1000002;
}
body.theme-ocean { --felt:#0879c9; --felt-light:#31d8ff; --rail:#06365f; --rail-glow:#7df9ff; --pink:#50b7ff; background:linear-gradient(135deg,#041627,#073d68,#041d3d); }
body.theme-emerald { --felt:#087b50; --felt-light:#46ffb1; --rail:#082f2d; --rail-glow:#58ff9b; --pink:#ffe45c; background:linear-gradient(135deg,#041e22,#07543c,#08192e); }
body.theme-ember { --felt:#8b2242; --felt-light:#ff6f7f; --rail:#4a102b; --rail-glow:#ff9f43; --pink:#ff4d6d; background:linear-gradient(135deg,#240714,#641f33,#190b22); }
body.in-lobby {
  background:
    radial-gradient(circle at 18% 16%, rgba(39,231,255,.24), transparent 25rem),
    radial-gradient(circle at 82% 18%, rgba(70,255,177,.18), transparent 26rem),
    linear-gradient(135deg, #02040c, #041e22 48%, #08192e) !important;
}
body.high-contrast { --text:#fff; --muted:#fff; --gold:#fff16b; }
body.large-text { font-size: 115%; }
button, input, select { font: inherit; }
button {
  border: 0;
  border-radius: 8px;
  color: var(--text);
  cursor: pointer;
  font-weight: 900;
  min-height: 2.6rem;
  padding: .55rem .75rem;
  text-transform: uppercase;
}
.lobby-screen {
  display: grid;
  gap: .9rem;
  margin: 0 auto;
  max-width: 1240px;
  min-height: 100vh;
  padding: 1rem;
}
body:not(.in-lobby) .lobby-screen {
  display: none;
}
body.in-lobby .game-shell {
  display: none;
}
.lobby-top,
.lobby-panel,
.featured-table {
  background:
    linear-gradient(145deg, rgba(255,255,255,.1), rgba(255,255,255,0) 32%),
    linear-gradient(135deg, rgba(13,25,64,.94), rgba(35,14,82,.9));
  border: 1px solid rgba(39,231,255,.3);
  border-radius: 8px;
  box-shadow: 0 20px 50px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.12);
}
.lobby-top {
  align-items: center;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  min-height: 0;
  padding: .12rem 1rem;
  position: relative;
  z-index: 2;
}
.lobby-brand {
  align-items: center;
  column-gap: .5rem;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  min-width: 0;
}
.lobby-logo-row {
  display: contents;
}
.lobby-logo {
  display: block;
  flex: 0 0 auto;
  grid-column: 1;
  grid-row: 1 / 3;
  height: clamp(2.875rem, 4vw, 3.125rem);
  image-rendering: auto;
  max-height: 3.125rem;
  object-fit: contain;
  width: auto;
}
.lobby-logo-row .eyebrow {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
}
.lobby-brand h1 {
  grid-column: 2;
  grid-row: 2;
  font-size: clamp(1.08rem, 1.75vw, 1.42rem);
  line-height: 1;
}
.lobby-stats {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
  justify-content: center;
}
.lobby-stats span {
  background: rgba(5,12,27,.52);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  color: var(--muted);
  font-size: .78rem;
  padding: .32rem .55rem;
}
.lobby-stats b {
  color: var(--gold);
}
.lobby-account-controls {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  gap: .4rem;
  justify-content: flex-end;
}
.lobby-account-controls button {
  background: linear-gradient(180deg, rgba(87,70,188,.94), rgba(48,31,124,.94));
  border: 1px solid rgba(39,231,255,.32);
  border-radius: 7px;
  color: var(--text);
  font-size: .76rem;
  font-weight: 950;
  min-height: 2.1rem;
  padding: .36rem .6rem;
}
.lobby-account-controls button:hover,
.lobby-account-controls button:focus-visible {
  background: linear-gradient(180deg, rgba(102,88,210,.96), rgba(55,37,139,.96));
  border-color: rgba(39,231,255,.62);
}
.lobby-account-controls .account-primary-button {
  background: linear-gradient(180deg, var(--gold), #ff9f43);
  border-color: rgba(255,228,92,.72);
  color: #20120a;
  text-transform: uppercase;
}
.lobby-account-controls .account-primary-button:hover,
.lobby-account-controls .account-primary-button:focus-visible {
  background: linear-gradient(180deg, #fff07a, #ffad4e);
  border-color: rgba(255,244,156,.9);
}
.lobby-private-username {
  background: rgba(5,12,27,.52);
  border: 1px solid rgba(39,231,255,.26);
  border-radius: 999px;
  color: var(--gold);
  font-size: .76rem;
  font-weight: 950;
  max-width: 12rem;
  overflow: hidden;
  padding: .32rem .55rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.lobby-header-actions {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: .55rem;
  justify-content: flex-end;
  min-width: max-content;
}
.lobby-header-actions #quickSeatButton {
  flex: 0 0 auto;
}
.lobby-stats .header-chip-balance,
.score-strip .header-chip-balance {
  background: linear-gradient(180deg, rgba(255,228,92,.24), rgba(255,159,28,.14));
  border-color: rgba(255,228,92,.45);
  color: var(--gold);
  font-weight: 950;
}
.header-chip-balance.low {
  animation: lowChipPulse 1.4s ease-in-out infinite;
  background: linear-gradient(180deg, rgba(255,82,82,.28), rgba(255,159,28,.16));
  border-color: rgba(255,112,112,.58);
  color: #ffd7d7;
}
@keyframes lowChipPulse {
  50% { box-shadow: 0 0 18px rgba(255,82,82,.4); filter: brightness(1.18); }
}
.featured-table {
  align-items: center;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, .9fr) minmax(18rem, .7fr);
  min-height: 13rem;
  overflow: hidden;
  padding: 1rem;
  position: relative;
}
.featured-table::before {
  background:
    radial-gradient(circle at 30% 30%, rgba(255,228,92,.28), transparent 13rem),
    radial-gradient(circle at 78% 36%, rgba(39,231,255,.36), transparent 15rem);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}
.featured-copy {
  position: relative;
  z-index: 1;
}
.featured-copy h2 {
  font-size: clamp(2rem, 5vw, 4.4rem);
  line-height: .95;
  margin: 0;
}
.featured-copy p:not(.eyebrow) {
  color: var(--muted);
  font-size: 1rem;
  margin: .45rem 0 1rem;
}
.featured-copy button {
  background: linear-gradient(180deg, var(--gold), #ff9f43);
  color: #20120a;
}
.featured-visual {
  min-height: 11rem;
  position: relative;
  z-index: 1;
}
.mini-table {
  background: radial-gradient(ellipse at center, var(--felt-light), var(--felt) 58%, var(--rail));
  border: 1rem solid rgba(12,8,60,.88);
  border-radius: 999px;
  box-shadow: inset 0 0 28px rgba(0,0,0,.34), 0 0 34px var(--rail-glow);
  height: 9.6rem;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%) rotate(-4deg);
  width: min(25rem, 100%);
}
.mini-table i {
  background: #fff;
  border: 1px solid rgba(8,13,30,.72);
  border-radius: 4px;
  box-shadow: 0 8px 14px rgba(0,0,0,.36);
  height: 3.4rem;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2.3rem;
}
.mini-table i:nth-child(1) { left: 29%; }
.mini-table i:nth-child(2) { left: 39%; }
.mini-table i:nth-child(3) { left: 49%; }
.mini-table i:nth-child(4) { left: 59%; }
.mini-table i:nth-child(5) { left: 69%; }
.mini-table i::before {
  color: #d1162c;
  content: "A";
  font-size: .9rem;
  font-weight: 950;
  left: .18rem;
  position: absolute;
  top: .12rem;
}
.mini-table span {
  background: linear-gradient(135deg, var(--gold), var(--pink));
  border-radius: 999px;
  bottom: -.7rem;
  color: #17071f;
  font-size: .72rem;
  font-weight: 950;
  left: 50%;
  padding: .28rem .65rem;
  position: absolute;
  text-transform: uppercase;
  transform: translateX(-50%);
}
.lobby-grid {
  align-items: start;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, .42fr);
}
.lobby-panel {
  display: grid;
  gap: .75rem;
  padding: 1rem;
}
.lobby-section-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.lobby-section-head strong,
.create-table-panel strong {
  color: var(--gold);
  font-size: .82rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.lobby-section-head span {
  color: var(--muted);
  font-size: .82rem;
}
.table-card {
  align-items: center;
  background:
    linear-gradient(135deg, rgba(255,255,255,.11), rgba(255,255,255,.04)),
    rgba(5,12,27,.36);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 8px;
  display: grid;
  gap: .7rem;
  grid-template-columns: 4.3rem minmax(10rem, 1fr) minmax(0, 1.2fr) auto;
  min-height: 5.7rem;
  padding: .8rem;
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}
.table-card:hover {
  border-color: rgba(39,231,255,.58);
  box-shadow: 0 14px 28px rgba(0,0,0,.28), inset 0 0 24px rgba(39,231,255,.08);
  transform: translateY(-2px);
}
.table-card.in-progress {
  border-color: rgba(255,228,92,.38);
  box-shadow: inset 0 0 22px rgba(255,228,92,.06);
}
.table-icon {
  background: linear-gradient(160deg, #215cff, #07184f);
  border: .36rem solid rgba(12,8,60,.9);
  border-radius: 999px;
  box-shadow: 0 0 18px rgba(39,231,255,.34);
  height: 3rem;
  position: relative;
  width: 4rem;
}
.table-icon.hot {
  background: linear-gradient(160deg, #25c9ff, #2940b8 60%, #6a1fb4);
}
.table-icon.purple {
  background: linear-gradient(160deg, #9948ff, #1d327c);
}
.table-icon span,
.table-icon::before,
.table-icon::after {
  background: #fff;
  border-radius: 3px;
  content: "";
  height: 1.05rem;
  position: absolute;
  top: .62rem;
  width: .72rem;
}
.table-icon span { left: 1.08rem; }
.table-icon::before { left: 1.62rem; transform: rotate(4deg); }
.table-icon::after { left: 2.16rem; transform: rotate(8deg); }
.table-card b,
.table-card span {
  display: block;
}
.table-card b {
  color: var(--text);
  font-size: 1.08rem;
}
.status-dot {
  background: var(--gold);
  border-radius: 50%;
  display: inline-block;
  height: .48rem;
  margin-right: .32rem;
  vertical-align: middle;
  width: .48rem;
}
.status-dot.live {
  animation: pulseLive 1.4s ease infinite;
  background: var(--green);
  box-shadow: 0 0 12px rgba(88,255,155,.72);
}
@keyframes pulseLive {
  50% { transform: scale(1.25); opacity: .72; }
}
.table-card span,
.table-meta span {
  color: var(--muted);
  font-size: .78rem;
}
.table-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}
.table-meta span {
  background: rgba(5,12,27,.52);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 999px;
  padding: .25rem .45rem;
}
.table-card button,
.create-table-panel button {
  background: linear-gradient(180deg,#20d5ff,#1741a8);
  border: 1px solid rgba(177,246,255,.42);
}
.create-table-panel {
  position: sticky;
  top: 1rem;
}
.create-table-head {
  display: grid;
  gap: .2rem;
}
.create-table-head span {
  color: var(--muted);
  font-size: .8rem;
}
.create-table-panel label {
  color: var(--muted);
  display: grid;
  font-size: .84rem;
  gap: .42rem;
}
.create-table-panel input,
.create-table-panel select {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 7px;
  color: var(--text);
  min-height: 2.35rem;
  padding: .45rem .55rem;
}
.create-perks {
  display: flex;
  flex-wrap: wrap;
  gap: .36rem;
}
.create-perks span {
  background: rgba(255,228,92,.11);
  border: 1px solid rgba(255,228,92,.22);
  border-radius: 999px;
  color: var(--gold);
  font-size: .72rem;
  font-weight: 850;
  padding: .24rem .42rem;
}
.game-shell {
  display: grid;
  gap: 1rem;
  grid-template-areas: "top" "table";
  grid-template-columns: minmax(0, 1fr);
  margin: 0 auto;
  max-width: 1500px;
  min-height: 100vh;
  padding: 1rem 1rem 2rem;
}
.top-bar, .action-panel {
  background: linear-gradient(135deg, rgba(20,31,72,.94), rgba(33,14,78,.88));
  border: 1px solid rgba(39,231,255,.3);
  border-radius: 8px;
  box-shadow: 0 20px 50px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.12);
}
.top-bar {
  align-items: center;
  display: flex;
  grid-area: top;
  justify-content: space-between;
  padding: .85rem 1rem;
  position: relative;
}
.eyebrow { color: var(--gold); font-size: .78rem; font-weight: 950; letter-spacing: .08em; margin: 0 0 .2rem; text-transform: uppercase; }
h1 { font-size: clamp(1.4rem,2.2vw,2.4rem); margin: 0; }
.score-strip { display:flex; flex-wrap:wrap; gap:.5rem; justify-content:flex-end; }
.score-strip span, .score-strip button {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 999px;
  color: var(--muted);
  min-height: 2.35rem;
  padding: .5rem .75rem;
}
.gold-button { background: linear-gradient(180deg, var(--gold), #ff9f43) !important; color:#20120a !important; }
.flyout {
  background: linear-gradient(145deg, rgba(10,16,43,.98), rgba(36,18,79,.96));
  border: 1px solid rgba(39,231,255,.34);
  border-radius: 8px;
  box-shadow: 0 24px 54px rgba(0,0,0,.48);
  display: none;
  gap: .75rem;
  max-height: 78vh;
  overflow: auto;
  padding: .9rem;
  position: absolute;
  right: 1rem;
  top: calc(100% + .55rem);
  width: min(23rem, calc(100vw - 2rem));
  z-index: 20050;
}
.flyout.open { display: grid; }
.menu-panel {
  width: min(27rem, calc(100vw - 2rem));
}
.menu-panel.open {
  grid-template-columns: minmax(0, 1fr);
}
.menu-panel .privacy-notice,
.menu-panel .legal-notice {
  display: none;
}
.flyout section, .flyout label { display:grid; gap:.45rem; }
.flyout strong { color: var(--gold); font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; }
.flyout p, .flyout small, .flyout label { color: var(--muted); font-size:.84rem; }
.flyout input, .flyout select {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 7px;
  color: var(--text);
  min-height: 2.25rem;
  padding: .45rem .55rem;
}
.flyout label:has(input[type="checkbox"]) {
  align-items: center;
  display: flex;
  font-size: .74rem;
  gap: .35rem;
  min-height: 1.25rem;
}
.flyout input[type="checkbox"] {
  accent-color: var(--gold);
  height: .9rem;
  min-height: 0;
  padding: 0;
  width: .9rem;
}
.register-modal {
  display: none;
  padding-top: .35rem;
}
.register-modal.show { display: block; }
.register-modal.first-visit,
.register-modal.manual-open {
  background: rgba(2,6,18,.74);
  display: grid;
  inset: 0;
  padding: 1rem;
  place-items: center;
  position: fixed;
  z-index: 220;
}
.nickname-modal {
  background: rgba(2,6,18,.76);
  display: none;
  inset: 0;
  padding: 1rem;
  place-items: center;
  position: fixed;
  z-index: 230;
}
.nickname-modal.show {
  display: grid;
}
.profile-modal,
.password-reset-modal {
  background: rgba(2,6,18,.78);
  display: none;
  inset: 0;
  padding: 1rem;
  place-items: center;
  position: fixed;
  z-index: 240;
}
.profile-modal.show,
.password-reset-modal.show {
  display: grid;
}
.nickname-card {
  background:
    radial-gradient(circle at 50% 0%, rgba(39,231,255,.18), transparent 12rem),
    linear-gradient(145deg, rgba(10,16,43,.98), rgba(36,18,79,.97));
  border: 1px solid rgba(255,228,92,.38);
  border-radius: 8px;
  box-shadow: 0 28px 70px rgba(0,0,0,.62), 0 0 36px rgba(39,231,255,.18);
  display: grid;
  gap: .75rem;
  max-width: min(24rem, calc(100vw - 2rem));
  padding: 1rem;
  width: 100%;
}
.profile-card,
.password-reset-card {
  background:
    radial-gradient(circle at 50% 0%, rgba(39,231,255,.14), transparent 13rem),
    linear-gradient(145deg, rgba(10,16,43,.98), rgba(36,18,79,.97));
  border: 1px solid rgba(255,228,92,.38);
  border-radius: 8px;
  box-shadow: 0 28px 70px rgba(0,0,0,.62), 0 0 36px rgba(39,231,255,.18);
  display: grid;
  gap: .75rem;
  max-height: min(84vh, 44rem);
  max-width: min(40rem, calc(100vw - 2rem));
  overflow: auto;
  padding: 1rem;
  width: 100%;
}
.password-reset-card {
  max-width: min(28rem, calc(100vw - 2rem));
}
.password-reset-card p {
  color: var(--muted);
  margin: 0;
}
.profile-card > strong,
.password-reset-card > strong,
.nickname-card strong {
  color: var(--gold);
  font-size: 1.2rem;
}
.nickname-card p {
  color: var(--muted);
  margin: 0;
}
.nickname-card label {
  color: var(--muted);
  display: grid;
  font-size: .78rem;
  gap: .34rem;
}
.nickname-card input {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 7px;
  color: var(--text);
  min-height: 2.35rem;
  padding: .4rem .5rem;
}
.password-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .35rem;
}
.password-field input {
  min-width: 0;
}
.masked-password {
  -webkit-text-security: disc;
  text-security: disc;
}
.masked-password.password-visible {
  -webkit-text-security: none;
  text-security: none;
}
.password-toggle {
  align-self: stretch;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,228,92,.32);
  border-radius: 7px;
  color: var(--gold);
  cursor: pointer;
  min-height: 2.1rem;
  min-width: 2.45rem;
  padding: .32rem .46rem;
  position: relative;
}
.password-toggle svg {
  display: block;
  fill: none;
  height: 1.08rem;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  width: 1.08rem;
}
.password-toggle.visible::after {
  background: currentColor;
  content: "";
  height: 2px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%) rotate(-42deg);
  width: 1.38rem;
}
.forgot-password-link {
  background: transparent;
  border: 0;
  color: var(--gold);
  cursor: pointer;
  font-size: .82rem;
  font-weight: 900;
  justify-self: start;
  padding: 0;
  text-decoration: underline;
}
.account-modal-close {
  justify-self: end;
  min-height: 2rem;
  padding: .35rem .7rem;
}
.profile-detail-grid {
  display: grid;
  gap: .45rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.profile-detail-grid div {
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 7px;
  display: grid;
  gap: .18rem;
  min-width: 0;
  padding: .5rem .6rem;
}
.profile-detail-grid span {
  color: var(--muted);
  font-size: .72rem;
  font-weight: 850;
  text-transform: uppercase;
}
.profile-detail-grid b {
  color: var(--text);
  font-size: .9rem;
  overflow-wrap: anywhere;
}
.welcome-bonus-modal {
  background: rgba(2,6,18,.78);
  display: none;
  inset: 0;
  padding: 1rem;
  place-items: center;
  position: fixed;
  z-index: 250;
}
.welcome-bonus-modal.show {
  display: grid;
}
.welcome-bonus-card {
  background:
    radial-gradient(circle at 50% 0%, rgba(255,228,92,.22), transparent 12rem),
    linear-gradient(145deg, rgba(10,16,43,.98), rgba(36,18,79,.97));
  border: 1px solid rgba(255,228,92,.42);
  border-radius: 8px;
  box-shadow: 0 28px 70px rgba(0,0,0,.62), 0 0 36px rgba(39,231,255,.18);
  display: grid;
  gap: .75rem;
  max-width: min(28rem, calc(100vw - 2rem));
  padding: 1rem;
  text-align: center;
  width: 100%;
}
.welcome-bonus-card strong {
  color: var(--gold);
  font-size: 1.35rem;
}
.welcome-bonus-card p {
  color: var(--text);
  font-weight: 850;
  margin: 0;
}
.welcome-bonus-card ul {
  color: var(--text);
  display: grid;
  gap: .35rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.welcome-bonus-card li {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 8px;
  padding: .5rem;
}
.welcome-bonus-card .bonus-total {
  color: var(--gold);
  font-size: 1.05rem;
}
.legal-modal {
  background: rgba(2,6,18,.82);
  display: none;
  inset: 0;
  padding: 1rem;
  place-items: center;
  position: fixed;
  z-index: 260;
}
.legal-modal.show {
  display: grid;
}
.legal-card {
  background: linear-gradient(145deg, rgba(10,16,43,.98), rgba(36,18,79,.97));
  border: 1px solid rgba(255,228,92,.38);
  border-radius: 8px;
  box-shadow: 0 28px 70px rgba(0,0,0,.62), 0 0 36px rgba(39,231,255,.18);
  display: grid;
  gap: .7rem;
  max-height: min(78vh, 42rem);
  max-width: min(38rem, calc(100vw - 2rem));
  overflow: hidden;
  padding: .85rem;
  width: 100%;
}
.legal-close {
  justify-self: end;
  min-height: 2rem;
  padding: .35rem .7rem;
}
.legal-modal-content {
  overflow: auto;
  padding: .2rem .15rem .4rem;
}
.legal-modal-content ol {
  color: var(--muted);
  display: grid;
  font-size: .82rem;
  gap: .55rem;
  margin: .55rem 0 0;
  padding-left: 1.15rem;
}
.legal-modal-content strong {
  color: var(--text);
  display: block;
  font-size: 1.05rem;
}
.legal-modal-content small {
  color: var(--gold);
  display: block;
  margin-top: .2rem;
}
.register-card {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(39,231,255,.38);
  border-radius: 8px;
  display: grid;
  gap: .65rem;
  padding: .65rem;
}
.register-modal.first-visit .register-card,
.register-modal.manual-open .register-card {
  background: linear-gradient(145deg, rgba(10,16,43,.98), rgba(36,18,79,.97));
  box-shadow: 0 28px 70px rgba(0,0,0,.62), 0 0 36px rgba(39,231,255,.22);
  max-width: min(32rem, calc(100vw - 2rem));
  padding: 1rem;
  width: 100%;
}
.register-grid {
  display: grid;
  gap: .5rem;
  grid-template-columns: 1fr;
}
.register-card label {
  color: var(--muted);
  display: grid;
  font-size: .74rem;
  gap: .3rem;
}
.register-card input,
.register-card select {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 7px;
  color: var(--text);
  min-height: 2.1rem;
  padding: .35rem .45rem;
}
.register-card .legal-check {
  align-items: center;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 7px;
  display: flex;
  font-size: .78rem;
  gap: .45rem;
  padding: .42rem .5rem;
}
.register-card .legal-check input {
  accent-color: var(--gold);
  height: 1rem;
  min-height: 0;
  width: 1rem;
}
.legal-link {
  background: transparent;
  border: 0;
  color: var(--gold);
  cursor: pointer;
  font: inherit;
  font-weight: 900;
  padding: 0;
  text-decoration: underline;
}
.form-note { color: var(--muted); font-size: .82rem; margin: 0; }
.form-error { color: var(--gold); font-size: .84rem; font-weight: 900; min-height: 1.1rem; }
.username-availability {
  font-size: .8rem;
  font-weight: 900;
  min-height: 1rem;
  white-space: pre-line;
}
.username-availability.available {
  color: #74ffac;
}
.username-availability.unavailable {
  color: #ffd36e;
  line-height: 1.3;
}
.form-error.name-taken {
  background: rgba(255,228,92,.1);
  border: 1px solid rgba(255,228,92,.32);
  border-radius: 8px;
  padding: .45rem .55rem;
}
.low-chip-notice {
  background: rgba(255,228,92,.08);
  border: 1px solid rgba(255,228,92,.22);
  border-radius: 8px;
  color: var(--gold);
  display: none;
  font-size: .78rem;
  line-height: 1.35;
  margin: 0;
  padding: .45rem .55rem;
}
.low-chip-notice.show {
  display: block;
}
.button-row, .theme-grid, .tags { display:flex; flex-wrap:wrap; gap:.4rem; }
.menu-actions {
  display: grid;
  gap: .45rem;
}
.menu-actions > button {
  min-height: 2.35rem;
}
.menu-actions > strong {
  margin-top: .15rem;
}
.player-profile {
  background: rgba(5,12,27,.34);
  border: 1px solid rgba(39,231,255,.18);
  border-radius: 8px;
  display: grid;
  gap: .5rem;
  padding: .65rem;
}
.player-profile.locked {
  opacity: .74;
}
.profile-row {
  align-items: center;
  display: flex;
  gap: .7rem;
  justify-content: space-between;
}
.profile-row span,
.profile-stats span {
  color: var(--muted);
  font-size: .72rem;
}
.profile-row strong,
.profile-stats strong {
  color: var(--text);
  font-size: .82rem;
  text-align: right;
}
.player-profile .profile-row {
  min-height: 1.35rem;
}
.profile-actions {
  display: grid;
  gap: .42rem;
  grid-template-columns: 1fr;
}
.profile-actions button {
  min-height: 2.1rem;
}
.profile-stats {
  display: grid;
  gap: .45rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.profile-stats div {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 7px;
  display: grid;
  gap: .18rem;
  padding: .48rem;
}
.profile-stats strong {
  text-align: left;
}
.profile-links {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  justify-content: center;
}
.privacy-notice,
.legal-notice {
  background: rgba(5,12,27,.38);
  border: 1px solid rgba(255,228,92,.18);
  border-radius: 8px;
  max-height: 16rem;
  overflow: auto;
  padding: .65rem;
}
.privacy-notice ol,
.legal-notice ol {
  color: var(--muted);
  display: grid;
  font-size: .74rem;
  gap: .48rem;
  margin: 0;
  padding-left: 1.05rem;
}
.privacy-notice li,
.legal-notice li {
  padding-left: .1rem;
}
.privacy-notice b,
.legal-notice b {
  color: var(--text);
}
.privacy-notice small,
.legal-notice small {
  color: var(--gold);
}
.reload-modal {
  display: none;
  inset: 0;
  place-items: center;
  pointer-events: none;
  position: fixed;
  z-index: 160;
}
.reload-modal.show {
  display: grid;
}
.compact-modal {
  z-index: 76000;
}
.reload-card {
  background: linear-gradient(145deg, rgba(10,16,43,.98), rgba(36,18,79,.96));
  border: 1px solid rgba(255,228,92,.46);
  border-radius: 8px;
  box-shadow: 0 24px 60px rgba(0,0,0,.58), 0 0 34px rgba(255,228,92,.2);
  display: grid;
  gap: .65rem;
  max-width: min(24rem, calc(100vw - 2rem));
  padding: 1rem;
  pointer-events: auto;
}
.compact-modal .reload-card {
  max-height: min(78dvh, 30rem);
  overflow-y: auto;
}
.compact-modal label {
  align-items: center;
  color: var(--muted);
  display: flex;
  font-size: .86rem;
  gap: .55rem;
}
.reload-card strong {
  color: var(--gold);
  font-size: 1.05rem;
}
.reload-card p,
.reload-card small {
  color: var(--muted);
  margin: 0;
}
.reload-card button {
  background: linear-gradient(180deg,#20d5ff,#1741a8);
  border: 1px solid rgba(177,246,255,.42);
  flex: 1;
}
.reload-card .free-chip-button,
.free-chip-button {
  background: linear-gradient(180deg, #ffe66c, #ff9f1c);
  border: 1px solid rgba(255,246,178,.82);
  box-shadow: 0 0 18px rgba(255,194,41,.24);
  color: #201004;
}
.reload-card .buy-chip-button,
.buy-chip-button {
  background: linear-gradient(180deg, #24d9ff, #1855c8);
  border: 1px solid rgba(177,246,255,.56);
}
.reload-card button:disabled {
  cursor: not-allowed;
  filter: grayscale(.65);
  opacity: .52;
}
.chip-store {
  display: grid;
  gap: .42rem;
  grid-template-columns: 1fr;
}
.chip-package {
  align-items: center;
  background: linear-gradient(180deg, rgba(20,216,255,.18), rgba(255,228,92,.1));
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 8px;
  color: var(--text);
  display: flex;
  justify-content: space-between;
  min-height: 2.2rem;
  padding: .45rem .55rem;
}
.chip-package strong {
  color: var(--gold);
  font-size: .9rem;
}
.chip-package span {
  color: var(--text);
  font-size: .78rem;
  font-weight: 900;
}
.chip-package small {
  color: var(--muted);
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
}
.daily-card {
  text-align: center;
}
.wide { width:100%; }
.swatch { border:2px solid rgba(255,255,255,.25); min-height:2.4rem; min-width:3rem; padding:0; }
.neon { background:linear-gradient(135deg,#27e7ff,#ff42ef); }
.ocean { background:linear-gradient(135deg,#31d8ff,#073d68); }
.emerald { background:linear-gradient(135deg,#58ff9b,#07543c); }
.ember { background:linear-gradient(135deg,#ff9f43,#8b2242); }
.tags span, .history {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 7px;
  color: var(--muted);
  font-size: .75rem;
  padding: .3rem .45rem;
}
.history { max-height: 7rem; overflow:auto; }
.table-scene {
  aspect-ratio: 16 / 9;
  background:
    radial-gradient(circle at 50% 42%, rgba(39,231,255,.16), transparent 28rem),
    linear-gradient(60deg, rgba(255,66,239,.12) 25%, transparent 25% 75%, rgba(39,231,255,.11) 75%),
    #12104a;
  background-size: 42px 72px;
  border: 1px solid rgba(39,231,255,.36);
  border-radius: 8px;
  grid-area: table;
  min-height: 610px;
  overflow: hidden;
  position: relative;
}
.table-scene::after {
  background: rgba(1, 4, 18, .34);
  content: "";
  inset: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  transition: opacity 220ms ease;
  z-index: 50;
}
.table-scene.reveal-active::after {
  opacity: 1;
}
.table-scene.reveal-active .seat:has(.reveal-choice) {
  z-index: 90;
}
.table-scene.reveal-active .reveal-choice {
  pointer-events: auto;
  z-index: 91;
}
.poker-table { height:52%; left:50%; position:absolute; top:49%; transform:translate(-50%,-50%); width:76%; z-index:2; }
.rail, .felt { border-radius:999px; position:absolute; }
.rail {
  background: linear-gradient(160deg, var(--felt-light), var(--rail) 46%, #09092f);
  box-shadow: inset 0 0 0 10px rgba(39,231,255,.28), inset 0 0 0 22px rgba(18,8,74,.7), 0 0 44px var(--rail-glow);
  inset:0;
}
.felt {
  align-items:center;
  background: radial-gradient(ellipse at center, var(--felt-light), var(--felt) 52%, var(--rail));
  box-shadow: inset 0 0 42px rgba(0,0,0,.32);
  display:flex;
  inset:13%;
  justify-content:center;
}
.community { display:flex; gap:.88rem; min-height:11.9rem; transform:translateY(-1.8rem); z-index:12; }
.community:empty::before {
  background: rgba(5,12,27,.32);
  border: 1px dashed rgba(255,255,255,.18);
  border-radius: 999px;
  color: rgba(247,251,255,.58);
  content: "Awaiting flop";
  font-size: .74rem;
  font-weight: 950;
  letter-spacing: .08em;
  padding: .32rem .7rem;
  text-transform: uppercase;
}
.card {
  background:
    linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,255,255,0) 35%),
    linear-gradient(180deg,#ffffff 0%,#fffdfa 58%,#e3eaf6 100%);
  border: 1px solid #2b3345;
  border-radius:5px;
  box-shadow:
    inset 0 0 0 1px #ffffff,
    inset 0 0 0 2px rgba(44,56,83,.16),
    inset 0 -5px 9px rgba(23,36,67,.14),
    0 1px 0 rgba(255,255,255,.88),
    0 9px 16px rgba(0,0,0,.48);
  color:#0e1422;
  display:block;
  font-family: Arial, Helvetica, sans-serif;
  font-size:2.44rem;
  font-weight:950;
  height:14rem;
  line-height:1;
  padding:.24rem;
  position: relative;
  width:9.72rem;
}
button.card {
  appearance: none;
  min-height: 0;
  padding: .24rem;
  text-transform: none;
}
.card::before {
  background: linear-gradient(115deg, rgba(255,255,255,.82), rgba(255,255,255,0) 52%);
  border-radius: 3px 3px 999px 3px;
  content: "";
  height: 36%;
  left: .12rem;
  opacity: .8;
  pointer-events: none;
  position: absolute;
  top: .12rem;
  width: 52%;
  z-index: 3;
}
.card::after {
  border: 1px solid rgba(11,20,36,.12);
  border-radius: 3px;
  content: "";
  inset: .2rem;
  pointer-events: none;
  position: absolute;
  z-index: 2;
}
.card .corner {
  display: grid;
  font-family: Arial Black, Arial, Helvetica, sans-serif;
  font-size: 2.51rem;
  font-weight: 950;
  gap: .02rem;
  letter-spacing: 0;
  line-height: .7;
  position: absolute;
  text-align: center;
  z-index: 4;
}
.card .corner small {
  font-size: 1.91rem;
  line-height: .86;
}
.card .corner.top {
  left: .18rem;
  top: .2rem;
}
.card .corner.bottom {
  bottom: .2rem;
  right: .18rem;
  transform: rotate(180deg);
}
.card .face {
  bottom: 1.51rem;
  left: 1.15rem;
  position: absolute;
  right: 1.15rem;
  top: 1.51rem;
  z-index: 1;
}
.card .pips {
  display: grid;
  font-size: 3.09rem;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(4, 1fr);
  line-height: 1;
  place-items: center;
}
.card .pips i {
  display: grid;
  font-style: normal;
  place-items: center;
  text-shadow: 0 1px rgba(255,255,255,.72);
}
.card .pips-1 i:nth-child(1) { grid-column: 2; grid-row: 2 / span 2; font-size: 5.31rem; }
.card .pips-2 i:nth-child(1) { grid-column: 2; grid-row: 1; }
.card .pips-2 i:nth-child(2) { grid-column: 2; grid-row: 4; transform: rotate(180deg); }
.card .pips-3 i:nth-child(1) { grid-column: 2; grid-row: 1; }
.card .pips-3 i:nth-child(2) { grid-column: 2; grid-row: 2 / span 2; }
.card .pips-3 i:nth-child(3) { grid-column: 2; grid-row: 4; transform: rotate(180deg); }
.card .pips-4 i:nth-child(1) { grid-column: 1; grid-row: 1; }
.card .pips-4 i:nth-child(2) { grid-column: 3; grid-row: 1; }
.card .pips-4 i:nth-child(3) { grid-column: 1; grid-row: 4; transform: rotate(180deg); }
.card .pips-4 i:nth-child(4) { grid-column: 3; grid-row: 4; transform: rotate(180deg); }
.card .pips-5 i:nth-child(1) { grid-column: 1; grid-row: 1; }
.card .pips-5 i:nth-child(2) { grid-column: 3; grid-row: 1; }
.card .pips-5 i:nth-child(3) { grid-column: 2; grid-row: 2 / span 2; }
.card .pips-5 i:nth-child(4) { grid-column: 1; grid-row: 4; transform: rotate(180deg); }
.card .pips-5 i:nth-child(5) { grid-column: 3; grid-row: 4; transform: rotate(180deg); }
.card .pips-6 i:nth-child(1) { grid-column: 1; grid-row: 1; }
.card .pips-6 i:nth-child(2) { grid-column: 3; grid-row: 1; }
.card .pips-6 i:nth-child(3) { grid-column: 1; grid-row: 2 / span 2; }
.card .pips-6 i:nth-child(4) { grid-column: 3; grid-row: 2 / span 2; }
.card .pips-6 i:nth-child(5) { grid-column: 1; grid-row: 4; transform: rotate(180deg); }
.card .pips-6 i:nth-child(6) { grid-column: 3; grid-row: 4; transform: rotate(180deg); }
.card .pips-7 i:nth-child(1) { grid-column: 1; grid-row: 1; }
.card .pips-7 i:nth-child(2) { grid-column: 3; grid-row: 1; }
.card .pips-7 i:nth-child(3) { grid-column: 2; grid-row: 1 / span 2; }
.card .pips-7 i:nth-child(4) { grid-column: 1; grid-row: 2 / span 2; }
.card .pips-7 i:nth-child(5) { grid-column: 3; grid-row: 2 / span 2; }
.card .pips-7 i:nth-child(6) { grid-column: 1; grid-row: 4; transform: rotate(180deg); }
.card .pips-7 i:nth-child(7) { grid-column: 3; grid-row: 4; transform: rotate(180deg); }
.card .pips-8 i:nth-child(1) { grid-column: 1; grid-row: 1; }
.card .pips-8 i:nth-child(2) { grid-column: 3; grid-row: 1; }
.card .pips-8 i:nth-child(3) { grid-column: 2; grid-row: 1 / span 2; }
.card .pips-8 i:nth-child(4) { grid-column: 1; grid-row: 2 / span 2; }
.card .pips-8 i:nth-child(5) { grid-column: 3; grid-row: 2 / span 2; }
.card .pips-8 i:nth-child(6) { grid-column: 2; grid-row: 3 / span 2; transform: rotate(180deg); }
.card .pips-8 i:nth-child(7) { grid-column: 1; grid-row: 4; transform: rotate(180deg); }
.card .pips-8 i:nth-child(8) { grid-column: 3; grid-row: 4; transform: rotate(180deg); }
.card .pips-9 i:nth-child(1) { grid-column: 1; grid-row: 1; }
.card .pips-9 i:nth-child(2) { grid-column: 2; grid-row: 1; }
.card .pips-9 i:nth-child(3) { grid-column: 3; grid-row: 1; }
.card .pips-9 i:nth-child(4) { grid-column: 1; grid-row: 2; }
.card .pips-9 i:nth-child(5) { grid-column: 3; grid-row: 2; }
.card .pips-9 i:nth-child(6) { grid-column: 1; grid-row: 3; transform: rotate(180deg); }
.card .pips-9 i:nth-child(7) { grid-column: 3; grid-row: 3; transform: rotate(180deg); }
.card .pips-9 i:nth-child(8) { grid-column: 1; grid-row: 4; transform: rotate(180deg); }
.card .pips-9 i:nth-child(9) { grid-column: 3; grid-row: 4; transform: rotate(180deg); }
.card .pips-10 { font-size: 2.3rem; }
.card .pips-10 i:nth-child(1) { grid-column: 1; grid-row: 1; }
.card .pips-10 i:nth-child(2) { grid-column: 2; grid-row: 1; }
.card .pips-10 i:nth-child(3) { grid-column: 3; grid-row: 1; }
.card .pips-10 i:nth-child(4) { grid-column: 1; grid-row: 2; }
.card .pips-10 i:nth-child(5) { grid-column: 3; grid-row: 2; }
.card .pips-10 i:nth-child(6) { grid-column: 1; grid-row: 3; transform: rotate(180deg); }
.card .pips-10 i:nth-child(7) { grid-column: 3; grid-row: 3; transform: rotate(180deg); }
.card .pips-10 i:nth-child(8) { grid-column: 1; grid-row: 4; transform: rotate(180deg); }
.card .pips-10 i:nth-child(9) { grid-column: 2; grid-row: 4; transform: rotate(180deg); }
.card .pips-10 i:nth-child(10) { grid-column: 3; grid-row: 4; transform: rotate(180deg); }
.card .face-card {
  align-items: center;
  background:
    linear-gradient(180deg, rgba(255,255,255,.78), rgba(255,255,255,0) 31%),
    linear-gradient(145deg, rgba(255,218,91,.32), rgba(46,119,231,.24) 45%, rgba(198,53,119,.24));
  border: 1px solid rgba(10,20,42,.22);
  border-radius: 3px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.55);
  display: grid;
  justify-items: center;
  overflow: hidden;
}
.card .royalty {
  background:
    linear-gradient(180deg, rgba(255,255,255,.48), transparent 35%),
    linear-gradient(90deg, rgba(255,255,255,.35), transparent 18% 82%, rgba(0,0,0,.08));
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 3px;
  box-shadow: inset 0 0 0 1px rgba(12,20,36,.12);
  display: block;
  height: 84%;
  overflow: hidden;
  position: relative;
  width: 76%;
}
.card .royalty::before,
.card .royalty::after {
  content: "";
  position: absolute;
}
.card .royalty::before {
  background: currentColor;
  bottom: 9%;
  height: 31%;
  left: 18%;
  opacity: .24;
  transform: skewX(-15deg);
  width: 28%;
}
.card .royalty::after {
  background: currentColor;
  bottom: 9%;
  height: 31%;
  opacity: .18;
  right: 18%;
  transform: skewX(15deg);
  width: 28%;
}
.card .royalty i {
  display: block;
  font-style: normal;
  position: absolute;
}
.card .crown {
  background:
    linear-gradient(135deg, transparent 0 22%, #f8d557 23% 42%, transparent 43%),
    linear-gradient(225deg, transparent 0 22%, #f8d557 23% 42%, transparent 43%),
    linear-gradient(180deg, #ffe785, #d59b2b);
  clip-path: polygon(0 100%, 8% 42%, 26% 72%, 50% 20%, 74% 72%, 92% 42%, 100% 100%);
  height: 21%;
  left: 21%;
  top: 7%;
  width: 58%;
  z-index: 5;
}
.card .hair {
  background: #4b281a;
  border-radius: 48% 48% 38% 38%;
  height: 32%;
  left: 24%;
  top: 18%;
  width: 52%;
  z-index: 3;
}
.card .head {
  background:
    radial-gradient(circle at 36% 42%, #3d1f16 0 5%, transparent 6%),
    radial-gradient(circle at 64% 42%, #3d1f16 0 5%, transparent 6%),
    radial-gradient(ellipse at 50% 66%, rgba(183,69,72,.65) 0 9%, transparent 10%),
    linear-gradient(180deg,#ffd29d,#e9a56c);
  border: 1px solid rgba(84,42,25,.28);
  border-radius: 48% 48% 45% 45%;
  height: 31%;
  left: 31%;
  top: 24%;
  width: 38%;
  z-index: 4;
}
.card .robe {
  background:
    linear-gradient(135deg, transparent 0 18%, rgba(255,255,255,.5) 19% 24%, transparent 25%),
    linear-gradient(225deg, transparent 0 18%, rgba(255,255,255,.5) 19% 24%, transparent 25%),
    linear-gradient(180deg, #315bd9, #842fae);
  border: 1px solid rgba(20,28,52,.2);
  border-radius: 46% 46% 14% 14%;
  bottom: 9%;
  height: 46%;
  left: 17%;
  width: 66%;
  z-index: 2;
}
.card .royalty b,
.card .royalty small {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 950;
  line-height: 1;
  position: absolute;
  text-shadow: 0 1px rgba(255,255,255,.58);
  z-index: 6;
}
.card .royalty b {
  bottom: 7%;
  font-size: 1.05rem;
  left: 10%;
}
.card .royalty small {
  bottom: 7%;
  font-size: .86rem;
  right: 10%;
}
.card .rank-q .hair {
  background: #8b4a28;
  border-radius: 46% 46% 42% 42%;
  height: 35%;
  left: 21%;
  width: 58%;
}
.card .rank-q .robe {
  background:
    linear-gradient(135deg, transparent 0 18%, rgba(255,255,255,.55) 19% 24%, transparent 25%),
    linear-gradient(225deg, transparent 0 18%, rgba(255,255,255,.55) 19% 24%, transparent 25%),
    linear-gradient(180deg, #d64b8f, #5d4de0);
}
.card .rank-k .hair {
  background: #2f2520;
}
.card .rank-k .robe {
  background:
    linear-gradient(135deg, transparent 0 18%, rgba(255,255,255,.5) 19% 24%, transparent 25%),
    linear-gradient(225deg, transparent 0 18%, rgba(255,255,255,.5) 19% 24%, transparent 25%),
    linear-gradient(180deg, #bf2f3c, #283cb8);
}
.card .rank-j .crown {
  clip-path: polygon(0 100%, 10% 56%, 50% 26%, 90% 56%, 100% 100%);
}
.card.red { color:#d1162c; }
.card.back {
  background:
    radial-gradient(circle at center, rgba(255,255,255,.26) 0 10%, transparent 11%),
    repeating-linear-gradient(45deg,rgba(255,255,255,.16) 0 3px,transparent 3px 7px),
    linear-gradient(145deg,#25165f,#1c91d2 52%,#7330b8);
  background-size: auto, 10px 10px, auto;
  border-color: rgba(255,255,255,.5);
  color:transparent;
}
.card.back::before { display:none; }
.card.revealed { animation: revealFlip 620ms ease; box-shadow:0 0 0 3px var(--gold),0 0 24px rgba(255,216,79,.7),0 0 42px rgba(39,231,255,.42); }
@keyframes revealFlip { 0% { transform:rotateY(90deg) scale(.88); filter:brightness(.8); } 65% { transform:rotateY(-8deg) scale(1.08); filter:brightness(1.25); } 100% { transform:rotateY(0) scale(1); filter:brightness(1); } }


.reveal-choice {
  cursor:pointer;
  position:relative;
  box-shadow:
    inset 0 0 0 1px #ffffff,
    inset 0 0 0 2px rgba(44,56,83,.16),
    inset 0 -5px 9px rgba(23,36,67,.14),
    0 0 0 2px var(--gold),
    0 0 18px rgba(255,228,92,.58),
    0 9px 16px rgba(0,0,0,.48);
}
.reveal-choice::after {
  border: 1px solid rgba(11,20,36,.12);
  border-radius: 3px;
  content: "";
  inset: .2rem;
  pointer-events: none;
  position: absolute;
  z-index: 2;
}
.result-banner, .winner-banner {
  border-radius:8px;
  font-weight:950;
  left:50%;
  padding:.4rem .75rem;
  position:absolute;
  text-align:center;
  text-transform:uppercase;
  transform:translateX(-50%);
  white-space:nowrap;
  z-index:15;
}
.result-banner { background:rgba(5,12,27,.58); bottom:7%; color:var(--green); font-size:clamp(.72rem,1.55vw,1.2rem); padding:.24rem .55rem; }
.result-banner.hide { opacity:0; }
.winner-banner {
  background: linear-gradient(135deg, var(--gold), var(--pink));
  box-shadow: 0 18px 42px rgba(0,0,0,.45), 0 0 32px rgba(255,228,92,.34);
  color:#150b25;
  display:none;
  font-size: clamp(1rem, 2.2vw, 1.55rem);
  gap: .18rem;
  line-height: 1.15;
  min-width:min(26rem,82%);
  padding:.65rem 1rem;
  top:31%;
  z-index:220;
}
.winner-banner strong {
  font-size: 1.15em;
}
.winner-banner span {
  font-size: .82em;
}
.winner-banner.show { display:grid; }
.pot-stack { align-items:center; bottom:22%; cursor:help; display:flex; flex-direction:row; font-weight:950; gap:.5rem; left:50%; position:absolute; transform:translateX(-50%); z-index:13; }
.chips { background:radial-gradient(circle,#fff 0 22%,transparent 23%),conic-gradient(#58ff9b 0 12%,#fff 12% 20%,#58ff9b 20% 38%,#fff 38% 46%,#58ff9b 46% 64%,#fff 64% 72%,#58ff9b 72%); border:2px solid #fff; border-radius:50%; box-shadow:0 0 18px rgba(88,255,155,.62); height:2.35rem; width:2.35rem; }
.pot-stack span {
  opacity: 1;
  background: rgba(4,8,20,.9);
  border: 1px solid rgba(255,228,92,.44);
  border-radius: 999px;
  box-shadow: 0 10px 24px rgba(0,0,0,.38), 0 0 22px rgba(255,228,92,.18);
  color: var(--gold);
  font-size: clamp(1.25rem, 2.8vw, 2.15rem);
  margin-top: 0;
  padding: .3rem .9rem;
  text-shadow: 0 0 14px rgba(255,228,92,.42);
}
.betting-chips,
.player-chip-piles {
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 5;
}
.player-chip-piles {
  z-index: 3;
  pointer-events: auto;
}
.player-bet-stack {
  align-items: center;
  display: grid;
  gap: .15rem;
  justify-items: center;
  position: absolute;
  transform: translate(-50%, -50%);
  transition: opacity 180ms ease, transform 180ms ease;
  z-index: 7;
}
.player-bet-stack.collecting {
  animation: collectBetStack 680ms ease forwards;
  z-index: 28;
}
@keyframes collectBetStack {
  0% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
  72% { opacity: 1; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(1.12); }
  100% { opacity: 0; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(.62); }
}
.bankroll-stack {
  align-items: center;
  display: grid;
  gap: .18rem;
  justify-items: center;
  pointer-events: auto;
  position: absolute;
  transform: translate(-50%, -50%) scale(1.08);
}
.bankroll-stack::before {
  content: "";
  inset: -.75rem -.9rem;
  position: absolute;
}
.bankroll-stack span {
  background: rgba(7,12,26,.92);
  border: 1px solid rgba(255,228,92,.55);
  border-radius: 999px;
  box-shadow: 0 8px 20px rgba(0,0,0,.42), 0 0 18px rgba(255,228,92,.24);
  color: var(--gold);
  font-size: .82rem;
  font-weight: 950;
  opacity: 1;
  padding: .24rem .58rem;
  transition: opacity 140ms ease, transform 140ms ease;
  transform: translateY(0) scale(1);
  white-space: nowrap;
  z-index: 8;
}
.bankroll-stack:hover span {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.player-bet-stack span {
  background: rgba(7,12,26,.78);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  color: var(--gold);
  font-size: .62rem;
  font-weight: 950;
  padding: .1rem .36rem;
}
.chip-stack {
  height: 1.45rem;
  position: relative;
  width: 2.6rem;
}
.chip-stack.bankroll {
  height: 3.2rem;
  width: 4.35rem;
}
.chip-stack.bankroll .bet-chip {
  height: 1.35rem;
  left: calc(.05rem + (var(--i) % 7) * .41rem);
  top: calc(1.55rem - (var(--i) / 7) * .2rem);
  width: 1.35rem;
}
.bet-chip {
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 50%;
  box-shadow: 0 2px 4px rgba(0,0,0,.36);
  display: block;
  height: 1.15rem;
  left: calc(.14rem + (var(--i) % 4) * .42rem);
  position: absolute;
  top: calc(.26rem - (var(--i) / 4) * .12rem);
  width: 1.15rem;
}
.chip-5 { background: radial-gradient(circle,#fff 0 20%,transparent 21%), conic-gradient(#d9263a 0 12%,#fff 12% 20%,#d9263a 20% 38%,#fff 38% 46%,#d9263a 46% 64%,#fff 64% 72%,#d9263a 72%); }
.chip-10 { background: radial-gradient(circle,#fff 0 20%,transparent 21%), conic-gradient(#1f8cff 0 12%,#fff 12% 20%,#1f8cff 20% 38%,#fff 38% 46%,#1f8cff 46% 64%,#fff 64% 72%,#1f8cff 72%); }
.chip-25 { background: radial-gradient(circle,#fff 0 20%,transparent 21%), conic-gradient(#19a85b 0 12%,#fff 12% 20%,#19a85b 20% 38%,#fff 38% 46%,#19a85b 46% 64%,#fff 64% 72%,#19a85b 72%); }
.chip-100 { background: radial-gradient(circle,#fff 0 20%,transparent 21%), conic-gradient(#111 0 12%,#fff 12% 20%,#111 20% 38%,#fff 38% 46%,#111 46% 64%,#fff 64% 72%,#111 72%); }
.reveal-overlay {
  background:linear-gradient(135deg,var(--gold),var(--pink));
  border-radius:8px;
  box-shadow: 0 0 0 1px rgba(255,255,255,.32), 0 0 42px rgba(255,228,92,.58);
  color:#17071f;
  font-size:clamp(.78rem,1.6vw,1.28rem);
  font-weight:950;
  left:50%;
  letter-spacing:.05em;
  opacity:0;
  padding:.2rem .55rem;
  pointer-events:none;
  position:absolute;
  text-transform:uppercase;
  top:22%;
  transform:translate(-50%,-50%) scale(.86);
  transition:opacity 220ms ease, transform 220ms ease;
  z-index:60;
}
.reveal-overlay span {
  display: block;
  font-size: .58em;
  letter-spacing: 0;
  margin-top: .06rem;
  text-transform: none;
}
.reveal-overlay.show { opacity:1; transform:translate(-50%,-50%) scale(1); }
.chip-flight {
  animation: none;
  background:radial-gradient(circle,#fff 0 20%,transparent 21%),conic-gradient(var(--gold) 0 12%,#fff 12% 20%,var(--gold) 20% 38%,#fff 38% 46%,var(--gold) 46% 64%,#fff 64% 72%,var(--gold) 72%);
  border:2px solid #fff;
  border-radius:50%;
  color:#20120a;
  display:grid;
  font-size:.64rem;
  font-weight:950;
  height:2.25rem;
  opacity:0;
  place-items:center;
  pointer-events:none;
  position:absolute;
  width:2.25rem;
  z-index:58;
}
.chip-flight.show { animation:flyChip 720ms ease forwards; left:var(--from-x,50%); top:var(--from-y,50%); }
@keyframes flyChip { 0%{left:var(--from-x);top:var(--from-y);opacity:0;transform:translate(-50%,-50%) scale(.8)} 20%{opacity:1} 100%{left:50%;top:50%;opacity:1;transform:translate(-50%,-50%) scale(1)} }
.seat { align-items:center; display:grid; gap:.22rem; justify-items:center; min-width:8.2rem; position:absolute; text-align:center; z-index:7; }
.seat.folded { opacity:1; }
.seat.folded .hole-cards {
  visibility: hidden;
}
.seat.folded .player-nameplate {
  border-color: rgba(255,228,92,.34);
  box-shadow: 0 0 0 2px rgba(255,228,92,.1);
}
.seat.folded .status-pill {
  background: rgba(255,228,92,.18);
  border-color: rgba(255,228,92,.5);
  color: var(--gold);
}
.seat-open {
  opacity: 1;
  z-index: 24;
}
.seat-select-button {
  background:
    radial-gradient(circle at 50% 12%, rgba(255,255,255,.2), transparent 2.2rem),
    linear-gradient(180deg, rgba(39,231,255,.96), rgba(17,56,156,.96));
  border: 1px solid rgba(177,246,255,.72);
  border-radius: 999px;
  box-shadow: 0 0 0 4px rgba(39,231,255,.14), 0 12px 28px rgba(0,0,0,.42), 0 0 24px rgba(39,231,255,.36);
  color: #f7fbff;
  display: grid;
  gap: .1rem;
  min-height: 3.9rem;
  min-width: 8.2rem;
  padding: .55rem .9rem;
  text-shadow: 0 2px 4px rgba(0,0,0,.42);
  transform: translateY(0);
  transition: transform 150ms ease, box-shadow 150ms ease, filter 150ms ease;
}
.seat-select-button span {
  color: var(--gold);
  font-size: .68rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.seat-select-button strong {
  font-size: 1.05rem;
}
.seat-select-button:hover,
.seat-select-button:focus-visible {
  box-shadow: 0 0 0 4px rgba(255,228,92,.24), 0 16px 34px rgba(0,0,0,.48), 0 0 34px rgba(255,228,92,.38);
  filter: brightness(1.08);
  transform: translateY(-.18rem);
}
.seat.acting .player-nameplate { box-shadow:0 0 0 3px rgba(255,228,92,.28),0 0 24px rgba(255,228,92,.5); }
.seat.turn-spotlight::before {
  background: radial-gradient(circle, rgba(255,228,92,.36), rgba(39,231,255,.16) 42%, transparent 68%);
  border-radius: 50%;
  content: "";
  height: 15.5rem;
  left: 50%;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 15.5rem;
  z-index: -1;
}
.seat.turn-spotlight .player-nameplate {
  border-color: rgba(255,228,92,.72);
  box-shadow: 0 0 0 3px rgba(255,228,92,.22), 0 0 28px rgba(255,228,92,.7), 0 0 48px rgba(39,231,255,.28);
}
.seat.turn-spotlight .status-pill {
  background: rgba(255,228,92,.94);
  color: #20120a;
}
.turn-timer {
  background:
    radial-gradient(circle, rgba(5,12,27,.08) 0 47%, transparent 48%),
    conic-gradient(from 90deg, var(--gold) var(--timer-progress, 0%), rgba(255,255,255,.16) 0);
  box-shadow: 0 0 0 4px rgba(255,228,92,.22), 0 0 36px rgba(255,228,92,.44), inset 0 0 18px rgba(255,228,92,.2);
  border-radius: 50%;
  display: none;
  height: 15.25rem;
  left: 50%;
  opacity: .96;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 15.25rem;
  z-index: 1;
}
.turn-timer::before {
  background: radial-gradient(circle, transparent 0 46%, rgba(5,12,27,.48) 47% 58%, transparent 59%);
  border-radius: 50%;
  content: "";
  inset: .18rem;
  position: absolute;
}
.turn-timer span {
  background: rgba(7,12,26,.94);
  border: 1px solid rgba(255,228,92,.58);
  border-radius: 999px;
  box-shadow: 0 0 18px rgba(255,228,92,.34);
  color: var(--gold);
  display: grid;
  font-size: 1.25rem;
  font-weight: 950;
  height: 2.45rem;
  left: 50%;
  place-items: center;
  position: absolute;
  top: -1rem;
  transform: translateX(-50%);
  width: 2.45rem;
}
.seat.turn-spotlight .turn-timer {
  display: block;
}
.seat .hole-cards,
.seat .player-nameplate,
.seat .seat-bankroll-row,
.seat .hand-readout,
.seat .status-pill,
.seat .action-pop {
  position: relative;
  z-index: 3;
}
.seat.timer-expired .turn-timer {
  animation: timerPulse 760ms ease infinite;
  background:
    radial-gradient(circle, rgba(5,12,27,.08) 0 47%, transparent 48%),
    conic-gradient(from 90deg, #ff4d6d 100%, rgba(255,255,255,.12) 0);
}
@keyframes timerPulse {
  50% { filter: brightness(1.45); transform: translate(-50%, -50%) scale(1.06); }
}
.player-nameplate { background:linear-gradient(180deg,rgba(22,43,105,.94),rgba(25,12,72,.94)); border:1px solid rgba(39,231,255,.22); border-radius:7px; min-width:6.25rem; padding:.28rem .46rem; }
.player-nameplate strong, .player-nameplate span { display:block; }
.player-nameplate strong { font-size:.88rem; line-height:1.05; }
.player-nameplate span { color:var(--muted); font-size:.78rem; }
.hole-cards { display:flex; gap:.54rem; justify-content:center; min-height:9.37rem; }
.hole-cards .card { font-size:2.47rem; height:9.05rem; width:6.06rem; }
.hole-cards .card .corner {
  font-size: 1.84rem;
}
.hole-cards .card .corner small {
  font-size: 1.37rem;
}
.hole-cards .card .face {
  bottom: .98rem;
  left: .74rem;
  right: .74rem;
  top: .98rem;
}
.hole-cards .card .pips {
  font-size: 2.09rem;
}
.hole-cards .card .pips-1 i:nth-child(1) {
  font-size: 3.89rem;
}
.hole-cards .card .pips-10 {
  font-size: 1.61rem;
}
.hole-cards .card .royalty b {
  font-size: 1.93rem;
}
.hole-cards .card .royalty small {
  font-size: 1.37rem;
}
.hole-cards .card {
  transition: transform 160ms ease, box-shadow 160ms ease;
  transform-origin: center center;
}
.seat-bottom .hole-cards .card {
  height:9.91rem;
  transform-origin: bottom center;
  width:6.67rem;
}
.seat .hole-cards .card:hover,
.seat .hole-cards .card:focus-visible {
  box-shadow: 0 18px 34px rgba(0,0,0,.48), 0 0 0 3px var(--gold), 0 0 32px rgba(255,228,92,.62);
  position: relative;
  transform: translateY(var(--card-zoom-y, -2.2rem)) translateX(var(--card-zoom-x, 0)) scale(var(--card-zoom-scale, 1.95));
  z-index: 80;
}
.seat-bottom,
.seat-bottom-left,
.seat-bottom-right {
  --card-zoom-y: -3.2rem;
  --card-zoom-scale: 2.15;
}
.seat-top,
.seat-top-left,
.seat-top-right {
  --card-zoom-y: 2.4rem;
  --card-zoom-scale: 2;
}
.seat-left-lower,
.seat-left-upper {
  --card-zoom-x: 3.4rem;
  --card-zoom-y: .2rem;
  --card-zoom-scale: 1.95;
}
.seat-right-lower,
.seat-right-upper {
  --card-zoom-x: -3.4rem;
  --card-zoom-y: .2rem;
  --card-zoom-scale: 1.95;
}
.seat-bottom .hole-cards .card.reveal-choice:hover,
.seat-bottom .hole-cards .card.reveal-choice:focus-visible {
  box-shadow:
    inset 0 0 0 1px #ffffff,
    inset 0 0 0 2px rgba(44,56,83,.16),
    inset 0 -5px 9px rgba(23,36,67,.14),
    0 0 0 2px var(--gold),
    0 0 18px rgba(255,228,92,.58),
    0 9px 16px rgba(0,0,0,.48);
  z-index: 80;
}
.community .card {
  font-size:1.86rem;
  height:10.71rem;
  transition: transform 160ms ease, box-shadow 160ms ease;
  transform-origin: center center;
  width:7.43rem;
}
.community .card .corner {
  font-size: 2.07rem;
}
.community .card .pips {
  font-size: 2.48rem;
}
.community .card .pips-1 i:nth-child(1) {
  font-size: 4.31rem;
}
.community .card .royalty b {
  font-size: 2.37rem;
}
.community .card .royalty small {
  font-size: 1.63rem;
}
.community .card:hover,
.community .card:focus-visible {
  box-shadow: 0 18px 34px rgba(0,0,0,.48), 0 0 0 3px var(--gold), 0 0 32px rgba(255,228,92,.62);
  position: relative;
  transform: translateY(-1.2rem) scale(1.65);
  z-index: 90;
}
.action-pop, .hand-readout, .status-pill { border-radius:999px; font-size:.65rem; font-weight:950; padding:.16rem .42rem; text-transform:uppercase; }
.action-pop {
  background: linear-gradient(180deg, var(--gold), #ff9f43);
  box-shadow: 0 10px 20px rgba(0,0,0,.36), 0 0 20px rgba(255,228,92,.38);
  color:#17110a;
  min-height: 1.25rem;
  opacity:0;
  position: relative;
  transform: translateY(.3rem) scale(.92);
  transition: opacity 150ms ease, transform 150ms ease;
  white-space: nowrap;
  z-index: 12;
}
.action-pop::after {
  border-left: .28rem solid transparent;
  border-right: .28rem solid transparent;
  border-top: .32rem solid #ff9f43;
  bottom: -.28rem;
  content: "";
  left: 50%;
  position: absolute;
  transform: translateX(-50%);
}
.action-pop:not(:empty),
.seat.acting .action-pop:not(:empty) {
  opacity:1;
  transform: translateY(0) scale(1);
}
.hand-readout { background:rgba(9,8,28,.78); border:1px solid rgba(255,228,92,.28); color:var(--gold); opacity:0; }
.hand-readout:not(:empty) { opacity:1; }
.status-pill { background:rgba(255,216,79,.13); border:1px solid rgba(255,216,79,.34); color:var(--gold); }
.seat.sitting-out .status-pill {
  background: rgba(255,228,92,.26);
  border-color: rgba(255,228,92,.82);
  color: #ffe875;
  opacity: 1;
}
.seat-bottom { bottom:8%; left:50%; transform:translateX(-50%); }
.seat-left-lower { left:1%; top:58%; transform:translateY(-50%); }
.seat-left-upper { left:1%; top:30%; transform:translateY(-50%); }
.seat-top-left { left:25%; top:3%; transform:translateX(-50%); }
.seat-top { left:50%; top:-1%; transform:translateX(-50%); }
.seat-top-right { right:25%; top:3%; transform:translateX(50%); }
.seat-right-upper { right:1%; top:30%; transform:translateY(-50%); }
.seat-right-lower { right:1%; top:58%; transform:translateY(-50%); }
.seat-bottom-right { right:19%; bottom:3%; }
.seat-bottom-left { left:19%; bottom:3%; }
.dealer-chip,
.blind-chip {
  border-radius: 50%;
  display: grid;
  font-weight: 950;
  height: 1.45rem;
  place-items: center;
  position: absolute;
  transform: translate(-50%, -50%);
  width: 1.45rem;
  z-index: 4;
}
.dealer-chip { background:#fff; color:#17203a; }
.blind-chip {
  border: 1px solid rgba(255,255,255,.82);
  box-shadow: 0 0 10px rgba(0,0,0,.42);
  color: #160d12;
  font-size: .56rem;
}
.small-blind { background: #ffe45c; }
.big-blind { background: #dfe7ff; }
.action-panel {
  background: linear-gradient(180deg, rgba(3,8,26,0), rgba(3,8,26,.9) 28%, rgba(3,8,26,.98));
  border: 0;
  border-radius: 0;
  bottom: 0;
  box-shadow: 0 -18px 44px rgba(0,0,0,.42);
  display: grid;
  gap: .55rem;
  grid-area: actions;
  left: 0;
  padding: .7rem max(1rem, env(safe-area-inset-left)) max(.85rem, env(safe-area-inset-bottom));
  pointer-events: none;
  position: fixed;
  right: 0;
  top: auto;
  z-index: 130;
}
.controls {
  display: grid;
  gap: clamp(.55rem, 2vw, 1rem);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0 auto;
  max-width: 820px;
  pointer-events: auto;
  position: relative;
  width: min(100%, 820px);
}
.controls.seat-pending {
  grid-template-columns: minmax(0, 1fr);
  max-width: min(18rem, calc(100vw - 2rem));
}
.controls.seat-pending button:not(.utility-action) {
  display: none;
}
.controls.seat-pending .utility-action {
  display: block;
  font-size: clamp(.9rem, 2vw, 1.1rem) !important;
  min-height: 3rem !important;
  opacity: 1;
  pointer-events: none;
  position: static;
  width: 100%;
}
.controls.status-only {
  filter: grayscale(.2);
  grid-template-columns: minmax(0, 1fr);
  max-width: min(26rem, calc(100vw - 2rem));
  opacity: .9;
}
.controls.status-only button:not(.utility-action) {
  display: none;
}
.controls.status-only .utility-action {
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: none !important;
  color: var(--muted) !important;
  display: block;
  font-size: clamp(.9rem, 2vw, 1.1rem) !important;
  min-height: 3rem !important;
  opacity: 1;
  pointer-events: none;
  position: static;
  text-shadow: none;
  width: 100%;
}
.quick-chat, .reaction-row { display:grid; gap:.42rem; }
.controls button, .quick-chat button, .reaction-row button, .chat-form button { background:linear-gradient(180deg,#20d5ff,#1741a8); border:1px solid rgba(177,246,255,.42); }
.controls button {
  border-radius: 999px;
  box-shadow: inset 0 1px rgba(255,255,255,.38), inset 0 -14px 22px rgba(0,0,0,.32), 0 14px 30px rgba(0,0,0,.42), 0 0 20px rgba(32,213,255,.26);
  font-size: clamp(1rem, 2.3vw, 1.45rem);
  min-height: clamp(3.4rem, 8vh, 4.6rem);
  padding: .6rem 1rem;
  text-shadow: 0 2px 4px rgba(0,0,0,.42);
}
.controls #foldButton { background: linear-gradient(180deg,#2b8dff,#071e62); }
.controls #callButton { background: linear-gradient(180deg,#1fc5ff,#123b95); }
.controls #raiseButton { background: linear-gradient(180deg,#ffe45c,#b97800); border-color: rgba(255,244,164,.72); color: #211304; }
.controls .secondary { background:linear-gradient(180deg,#8b5cff,#23156d); }
.hidden-action { display: none !important; }
.utility-action {
  font-size: .72rem !important;
  min-height: 2.2rem !important;
  opacity: .82;
  padding: .28rem .6rem !important;
  position: absolute;
  right: 0;
  top: -2.7rem;
  width: auto;
}
.controls button.queued {
  background: linear-gradient(180deg, var(--gold), #ff9f43);
  box-shadow: 0 0 0 3px rgba(255,228,92,.24), 0 0 22px rgba(255,228,92,.52);
  color: #20120a;
}
.bet-sizing {
  background:
    radial-gradient(circle at 74% 15%, rgba(255,228,92,.2), transparent 8rem),
    linear-gradient(180deg, rgba(39,231,255,.18), rgba(39,91,255,.06)),
    linear-gradient(180deg, rgba(9,31,113,.99), rgba(13,11,76,.99));
  border: 1px solid rgba(64,180,255,.62);
  border-radius: 18px;
  bottom: 5.85rem;
  box-shadow: 0 24px 60px rgba(0,0,0,.58), inset 0 1px rgba(255,255,255,.18), 0 0 28px rgba(32,213,255,.32);
  display: none;
  gap: .8rem;
  justify-self: center;
  max-width: min(25rem, calc(100vw - 1.5rem));
  padding: 1.05rem;
  pointer-events: auto;
  position: absolute;
  right: max(1rem, calc((100vw - 1320px) / 2 + 1rem));
  width: min(25rem, calc(100vw - 1.5rem));
}
.bet-sizing.show {
  animation: betSheetIn 170ms ease both;
  display: grid;
}
@keyframes betSheetIn {
  from { opacity: 0; transform: translateY(1rem) scale(.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
.bet-sheet-head {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.bet-sheet-head span {
  color: var(--muted);
  font-size: .78rem;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.bet-sizing label {
  color: var(--muted);
  display: grid;
  font-size: .74rem;
  gap: .38rem;
}
.bet-sizing strong {
  color: var(--gold);
  font-size: clamp(1.65rem, 5vw, 2.4rem);
  line-height: 1;
  text-shadow: 0 0 18px rgba(255,228,92,.42);
}
.bet-sizing input[type="range"] {
  accent-color: var(--gold);
  cursor: pointer;
  min-height: 2.7rem;
  width: 100%;
}
.quick-bet-row,
.bet-confirm-row {
  display: grid;
  gap: .55rem;
}
.quick-bet-row {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.bet-confirm-row {
  grid-template-columns: .85fr 1.15fr;
}
.bet-sizing button {
  background: linear-gradient(180deg, var(--gold), #ff9f43);
  border: 1px solid rgba(255,255,255,.24);
  color: #20120a;
  border-radius: 999px;
  min-height: 3.05rem;
  padding: .45rem .55rem;
  text-shadow: 0 1px rgba(255,255,255,.24);
}
.quick-bet-row button {
  background: linear-gradient(180deg,#24a9ff,#0d3d96);
  box-shadow: inset 0 1px rgba(255,255,255,.28), 0 8px 18px rgba(0,0,0,.28);
  color: #f7fbff;
  text-shadow: 0 2px 4px rgba(0,0,0,.42);
}
#cancelBetButton {
  background: linear-gradient(180deg,#5b6b94,#172140);
  color: #f7fbff;
}
#confirmBetButton {
  box-shadow: 0 0 22px rgba(255,228,92,.3);
}
.bet-sizing button:disabled {
  cursor: not-allowed;
  filter: grayscale(.65);
  opacity: .5;
}
.chat-panel { display:none; }
.odds-panel {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,228,92,.24);
  border-radius: 8px;
  display: grid;
  gap: .5rem;
  left: max(1rem, calc((100vw - 1320px) / 2 + 1rem));
  max-width: min(18rem, calc(100vw - 2rem));
  padding: .55rem;
  pointer-events: auto;
  position: absolute;
  bottom: 5.85rem;
}
.odds-list {
  display: grid;
  gap: .3rem;
}
.odds-list div {
  align-items: center;
  background: rgba(5,12,27,.48);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 7px;
  color: var(--muted);
  display: flex;
  font-size: .72rem;
  justify-content: space-between;
  padding: .26rem .4rem;
}
.odds-list b {
  color: var(--text);
}
.odds-list span {
  color: var(--gold);
  font-weight: 950;
}
.chat-header { align-items:center; display:flex; justify-content:space-between; }
.chat-header strong { color:var(--gold); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; }
.chat-header span { color:var(--muted); font-size:.64rem; }
.chat-tools {
  display: grid;
  gap: .35rem;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1fr) minmax(0, 1.15fr);
}
.chat-tools label {
  align-items: center;
  color: var(--muted);
  display: flex;
  font-size: .68rem;
  gap: .3rem;
}
.chat-tools button {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 7px;
  color: var(--text);
  font-size: .62rem;
  min-height: 1.8rem;
  padding: .2rem .3rem;
  text-transform: none;
}
.chat-feed { color:var(--muted); display:grid; font-size:.74rem; gap:.3rem; max-height:13rem; min-height:9rem; overflow:auto; }
.chat-feed div { background:rgba(5,12,27,.45); border-radius:7px; display:flex; gap:.35rem; padding:.28rem .4rem; }
.chat-feed b { color:var(--text); }
.chat-form { display:grid; gap:.35rem; grid-template-columns:minmax(0,1fr) auto; }
.chat-form input { background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); border-radius:7px; color:var(--text); min-width:0; padding:.35rem .45rem; }
.chat-warning { color:var(--gold); font-size:.68rem; min-height:.9rem; }
.reaction-row { grid-template-columns:repeat(4,1fr); }
.quick-chat button, .reaction-row button { font-size:.64rem; min-height:1.55rem; padding:.16rem .24rem; text-transform:none; }
.reaction-row button { font-size:.82rem; }
.message-log {
  background: rgba(5,12,27,.72);
  border: 1px solid rgba(39,231,255,.22);
  border-radius: 8px;
  bottom: 5.85rem;
  color: var(--muted);
  display: none;
  font-size: .82rem;
  left: max(1rem, calc((100vw - 1320px) / 2 + 1rem));
  max-height: 7rem;
  max-width: min(21rem, calc(100vw - 2rem));
  overflow: auto;
  padding: .55rem;
  pointer-events: auto;
  position: absolute;
}
body.large-cards .card { font-size:3.3rem; height:14.84rem; width:10.33rem; }
body.large-cards .hole-cards .card { font-size:2.67rem; height:9.75rem; width:6.58rem; }
body.large-cards .community .card { font-size:2.52rem; height:11.35rem; width:7.9rem; }
@media (max-width: 820px) {
  .lobby-top {
    align-items: stretch;
    flex-direction: column;
  }
  .lobby-stats {
    justify-content: flex-start;
  }
  .featured-table,
  .lobby-grid {
    grid-template-columns: 1fr;
  }
  .featured-table {
    min-height: 23rem;
  }
  .featured-visual {
    min-height: 10rem;
  }
  .table-card {
    grid-template-columns: 4rem minmax(0, 1fr);
  }
  .table-card .table-meta,
  .table-card button {
    grid-column: 1 / -1;
  }
  .create-table-panel {
    position: static;
  }
  body:not(.in-lobby) { padding-bottom: 7.4rem; }
  .game-shell { grid-template-columns:minmax(0,1fr); grid-template-areas:"top" "table"; padding:.6rem .6rem 1.5rem; }
  .top-bar { align-items:stretch; flex-direction:column; }
  .table-scene { min-height:690px; }
  .poker-table { height:38%; top:48%; width:96%; }
  .seat { min-width:6.4rem; }
  .player-nameplate { min-width:5.15rem; padding:.24rem .3rem; }
  .seat-bottom { bottom:10%; }
  .seat.turn-spotlight::before {
    height: 12.6rem;
    width: 12.6rem;
  }
  .turn-timer {
    height: 12.25rem;
    width: 12.25rem;
  }
  .turn-timer span {
    font-size: 1.05rem;
    height: 2.1rem;
    top: -.8rem;
    width: 2.1rem;
  }
  .hole-cards .card { font-size:1.87rem; height:7.22rem; width:4.84rem; }
  .seat-bottom .hole-cards .card { height:8.1rem; width:5.43rem; }
  .community { gap:.41rem; transform:translateY(-1.05rem) scale(.89); }
  .pot-stack { bottom:25%; }
  .pot-stack span { font-size:1.1rem; padding:.22rem .62rem; }
  .chips { height:1.75rem; width:1.75rem; }
  .controls { gap:.42rem; }
  .controls button { font-size:.95rem; min-height:3.25rem; padding:.45rem .35rem; }
  .utility-action { display:none; }
  .bet-sizing { bottom:5.4rem; left:.75rem; right:.75rem; max-width:none; width:auto; }
  .odds-panel {
    bottom: 5.4rem;
    display: grid;
    left: .75rem;
    max-width: min(14rem, calc(100vw - 1.5rem));
    opacity: .94;
    padding: .45rem;
  }
  .bet-sizing.show ~ .odds-panel { display:none; }
  .odds-list div { font-size:.66rem; padding:.2rem .32rem; }
  .message-log { display:none; }
}

@media (max-width: 767px) and (orientation: portrait) {
  html,
  body {
    min-height: 100dvh;
    overflow: hidden;
  }

  body:not(.in-lobby) .rotate-phone-message {
    align-items: center;
    background:
      radial-gradient(circle at 50% 24%, rgba(39,231,255,.22), transparent 15rem),
      linear-gradient(145deg, rgba(6,13,42,.98), rgba(32,10,70,.98));
    color: var(--text);
    display: grid;
    font-size: clamp(1.4rem, 7vw, 2.2rem);
    font-weight: 950;
    inset: 0;
    justify-items: center;
    line-height: 1.18;
    padding: 2rem;
    position: fixed;
    text-align: center;
    text-shadow: 0 3px 14px rgba(0,0,0,.5);
    z-index: 9999;
  }

  .rotate-phone-message::before {
    border: .28rem solid rgba(255,228,92,.9);
    border-left-color: transparent;
    border-radius: 50%;
    content: "";
    display: block;
    height: 4.5rem;
    margin-bottom: 1rem;
    width: 4.5rem;
  }
}

@media (max-width: 767px), (max-height: 520px) and (orientation: landscape) {
  .lobby-screen {
    gap: .55rem;
    padding: .55rem;
  }

  .lobby-top,
  .featured-table,
  .lobby-panel {
    padding: .65rem;
  }

  .lobby-top {
    gap: .45rem;
  }

  .lobby-stats {
    gap: .28rem;
  }

  .lobby-stats span,
  .score-strip span,
  .score-strip button {
    font-size: .66rem;
    min-height: 1.75rem;
    padding: .26rem .42rem;
  }

  .featured-table {
    grid-template-columns: 1fr;
    min-height: 0;
  }
}

@media (orientation: landscape) and (max-height: 520px) {
  html,
  body {
    height: 100dvh;
    min-height: 100dvh;
    overflow: hidden;
  }

  body:not(.in-lobby) {
    padding-bottom: clamp(4.65rem, 14dvh, 5.65rem);
  }

  body:not(.in-lobby) .game-shell {
    gap: .25rem;
    grid-template-rows: auto minmax(0, 1fr);
    height: 100dvh;
    max-width: none;
    min-height: 0;
    overflow: hidden;
    padding: .28rem .35rem .2rem;
  }

  body:not(.in-lobby) .top-bar {
    align-items: center;
    border-radius: 6px;
    flex-direction: row;
    gap: .4rem;
    min-height: 0;
    padding: .28rem .45rem;
  }

  body:not(.in-lobby) .top-bar h1 {
    font-size: clamp(.92rem, 2.3vw, 1.25rem);
    line-height: 1;
  }

  body:not(.in-lobby) .top-bar .eyebrow {
    font-size: .54rem;
    margin: 0 0 .08rem;
  }

  body:not(.in-lobby) .score-strip {
    align-items: center;
    gap: .22rem;
  }

  body:not(.in-lobby) .score-strip span,
  body:not(.in-lobby) .score-strip button {
    font-size: clamp(.52rem, 1.45vw, .66rem);
    min-height: 1.55rem;
    padding: .18rem .34rem;
  }

  body:not(.in-lobby) .flyout {
    max-height: calc(100dvh - 3.2rem);
    right: .35rem;
    top: calc(100% + .25rem);
  }

  body:not(.in-lobby) .table-scene {
    aspect-ratio: auto;
    border-radius: 6px;
    height: calc(100dvh - clamp(7.25rem, 21dvh, 8.9rem));
    min-height: 0;
    width: 100%;
  }

  body:not(.in-lobby) .poker-table {
    height: 49%;
    top: 50%;
    width: 86%;
  }

  body:not(.in-lobby) .rail {
    box-shadow: inset 0 0 0 5px rgba(39,231,255,.28), inset 0 0 0 12px rgba(18,8,74,.7), 0 0 24px var(--rail-glow);
  }

  body:not(.in-lobby) .felt {
    inset: 12%;
  }

  body:not(.in-lobby) .community {
    gap: .2rem;
    min-height: 4.5rem;
    transform: translateY(-.55rem);
  }

  body:not(.in-lobby) .community .card,
  body:not(.in-lobby) .card {
    border-radius: 4px;
    font-size: .9rem;
    height: 4.55rem;
    padding: .1rem;
    width: 3.05rem;
  }

  body:not(.in-lobby) .card::after {
    inset: .1rem;
  }

  body:not(.in-lobby) .card .corner {
    font-size: .62rem;
  }

  body:not(.in-lobby) .card .pips,
  body:not(.in-lobby) .community .card .pips {
    font-size: 1rem;
  }

  body:not(.in-lobby) .card .pips-1 i:nth-child(1),
  body:not(.in-lobby) .community .card .pips-1 i:nth-child(1) {
    font-size: 1.8rem;
  }

  body:not(.in-lobby) .card .pips-10 {
    font-size: .72rem;
  }

  body:not(.in-lobby) .card .royalty b,
  body:not(.in-lobby) .community .card .royalty b {
    font-size: 1.08rem;
  }

  body:not(.in-lobby) .card .royalty small,
  body:not(.in-lobby) .community .card .royalty small {
    font-size: .7rem;
  }

  body:not(.in-lobby) .hole-cards {
    gap: .13rem;
    min-height: 2.7rem;
  }

  body:not(.in-lobby) .hole-cards .card {
    font-size: .72rem;
    height: 2.85rem;
    width: 1.9rem;
  }

  body:not(.in-lobby) .seat-bottom .hole-cards .card {
    height: 3.55rem;
    width: 2.35rem;
  }

  body:not(.in-lobby) .hole-cards .card .corner {
    font-size: .5rem;
  }

  body:not(.in-lobby) .hole-cards .card .pips {
    font-size: .82rem;
  }

  body:not(.in-lobby) .hole-cards .card .pips-1 i:nth-child(1) {
    font-size: 1.35rem;
  }

  body:not(.in-lobby) .seat {
    gap: .08rem;
    min-width: 4.1rem;
  }

  body:not(.in-lobby) .seat-bottom {
    bottom: 6.6%;
  }

  body:not(.in-lobby) .seat-left-lower,
  body:not(.in-lobby) .seat-right-lower {
    top: 60%;
  }

  body:not(.in-lobby) .seat-left-upper,
  body:not(.in-lobby) .seat-right-upper {
    top: 30%;
  }

  body:not(.in-lobby) .seat-top {
    top: 1%;
  }

  body:not(.in-lobby) .seat-top-left,
  body:not(.in-lobby) .seat-top-right {
    top: 2%;
  }

  body:not(.in-lobby) .seat-bottom-left,
  body:not(.in-lobby) .seat-bottom-right {
    bottom: 3.5%;
  }

  body:not(.in-lobby) .player-nameplate {
    border-radius: 5px;
    gap: .02rem;
    min-width: 3.55rem;
    padding: .1rem .22rem;
  }

  body:not(.in-lobby) .player-nameplate strong {
    font-size: .54rem;
  }

  body:not(.in-lobby) .player-nameplate span {
    font-size: .48rem;
  }

  body:not(.in-lobby) .action-pop,
  body:not(.in-lobby) .hand-readout,
  body:not(.in-lobby) .status-pill {
    border-radius: 5px;
    font-size: .45rem;
    padding: .08rem .2rem;
  }

  body:not(.in-lobby) .seat.turn-spotlight::before {
    height: 5.25rem;
    width: 5.25rem;
  }

  body:not(.in-lobby) .turn-timer {
    height: 5.35rem;
    width: 5.35rem;
  }

  body:not(.in-lobby) .turn-timer span {
    font-size: .62rem;
    height: 1.25rem;
    top: -.36rem;
    width: 1.25rem;
  }

  body:not(.in-lobby) .pot-stack {
    bottom: 25.5%;
    gap: .15rem;
    transform: translateX(-50%) scale(.76);
  }

  body:not(.in-lobby) .pot-stack span {
    font-size: .88rem;
    padding: .14rem .42rem;
  }

  body:not(.in-lobby) .chips {
    height: 1.12rem;
    width: 1.12rem;
  }

  body:not(.in-lobby) .bankroll-stack {
    transform: translate(-50%, -50%) scale(.56);
  }

  body:not(.in-lobby) .player-bet-stack {
    transform: translate(-50%, -50%) scale(.68);
  }

  body:not(.in-lobby) .dealer-chip,
  body:not(.in-lobby) .blind-chip {
    font-size: .42rem;
    height: 1rem;
    width: 1rem;
  }

  body:not(.in-lobby) .reveal-overlay,
  body:not(.in-lobby) .winner-banner {
    font-size: clamp(.85rem, 3vw, 1.25rem);
    padding: .35rem .65rem;
  }

  body:not(.in-lobby) .reveal-overlay {
    border-radius: 6px;
    box-shadow: 0 0 0 1px rgba(255,255,255,.28), 0 0 22px rgba(255,228,92,.46);
    font-size: clamp(.66rem, 2.4vw, .92rem);
    line-height: 1;
    max-width: min(12rem, 44vw);
    padding: .18rem .42rem;
    top: 14%;
    white-space: nowrap;
  }

  body:not(.in-lobby) .reveal-overlay span {
    font-size: .48em;
    margin-top: .03rem;
  }

  body:not(.in-lobby) .odds-panel {
    bottom: 4.25rem;
    left: .4rem;
    max-width: 11.5rem;
    padding: .32rem;
  }

  body:not(.in-lobby) .odds-list {
    gap: .16rem;
  }

  body:not(.in-lobby) .odds-list div {
    font-size: .52rem;
    padding: .14rem .24rem;
  }

  body:not(.in-lobby) .action-panel {
    gap: .22rem;
    padding: .34rem max(.42rem, env(safe-area-inset-left)) max(.42rem, env(safe-area-inset-bottom));
  }

  body:not(.in-lobby) .controls {
    gap: .28rem;
    max-width: 100%;
    width: 100%;
  }

  body:not(.in-lobby) .controls button {
    font-size: clamp(.7rem, 2.7vw, .9rem);
    min-height: clamp(2.3rem, 11dvh, 3rem);
    padding: .25rem .3rem;
  }

  body:not(.in-lobby) .bet-sizing {
    bottom: 3.45rem;
    gap: .35rem;
    left: auto;
    max-height: calc(100dvh - 4rem);
    max-width: min(20rem, calc(100vw - .8rem));
    overflow: auto;
    padding: .5rem;
    right: .4rem;
    width: min(20rem, calc(100vw - .8rem));
  }

  body:not(.in-lobby) .bet-sizing strong {
    font-size: 1.35rem;
  }

  body:not(.in-lobby) .bet-sizing input[type="range"] {
    min-height: 1.8rem;
  }

  body:not(.in-lobby) .bet-sizing button {
    font-size: .65rem;
    min-height: 2rem;
    padding: .25rem .32rem;
  }

  body:not(.in-lobby) .message-log,
  body:not(.in-lobby) .chat-panel {
    display: none;
  }
}

@media (orientation: landscape) and (max-height: 430px) {
  body:not(.in-lobby) .reveal-overlay {
    font-size: clamp(.58rem, 2.05vw, .78rem);
    left: 50%;
    max-width: min(10rem, 38vw);
    padding: .14rem .34rem;
    top: 11.5%;
    transform: translate(-50%, -50%) scale(.82);
  }

  body:not(.in-lobby) .reveal-overlay.show {
    transform: translate(-50%, -50%) scale(.92);
  }

  body:not(.in-lobby) .winner-banner {
    font-size: clamp(.72rem, 2.4vw, .96rem);
    padding: .24rem .5rem;
  }
}

/* Dedicated phone layout system. Keep after all previous responsive rules. */
@media (orientation: portrait) and (max-width: 760px) {
  body:not(.in-lobby) {
    height: 100svh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
    padding: 0 !important;
    width: 100dvw !important;
  }

  body:not(.in-lobby) .game-viewport,
  body:not(.in-lobby) .app-viewport,
  body:not(.in-lobby) .game-stage {
    display: none !important;
  }

  body:not(.in-lobby) .rotate-phone-message {
    align-items: center !important;
    background:
      radial-gradient(circle at 50% 18%, rgba(39, 231, 255, .18), transparent 34%),
      linear-gradient(145deg, #070d24, #130825 58%, #050813);
    color: #ffffff !important;
    display: flex !important;
    font-size: clamp(1.05rem, 4.6vw, 1.55rem) !important;
    font-weight: 950 !important;
    inset: 0 !important;
    justify-content: center !important;
    line-height: 1.25 !important;
    padding:
      max(1.5rem, env(safe-area-inset-top, 0px))
      max(1.5rem, env(safe-area-inset-right, 0px))
      max(1.5rem, env(safe-area-inset-bottom, 0px))
      max(1.5rem, env(safe-area-inset-left, 0px)) !important;
    position: fixed !important;
    text-align: center !important;
    z-index: 99999 !important;
  }
}

@media (orientation: landscape) and (max-height: 540px) and (max-width: 1000px) {
  html,
  body:not(.in-lobby) {
    height: 100svh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
    overscroll-behavior: none !important;
    padding: 0 !important;
    width: 100dvw !important;
  }

  body:not(.in-lobby) .rotate-phone-message {
    display: none !important;
  }

  body:not(.in-lobby) .game-viewport,
  body:not(.in-lobby) .app-viewport,
  body:not(.in-lobby) .game-stage {
    box-sizing: border-box !important;
    display: block !important;
    height: 100svh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 0 !important;
    overflow: hidden !important;
    width: 100dvw !important;
  }

  body:not(.in-lobby) .game-viewport {
    --phone-safe-top: env(safe-area-inset-top, 0px);
    --phone-safe-right: env(safe-area-inset-right, 0px);
    --phone-safe-bottom: env(safe-area-inset-bottom, 0px);
    --phone-safe-left: env(safe-area-inset-left, 0px);
    --phone-pad-x: max(4px, var(--phone-safe-left), var(--phone-safe-right));
    --phone-top-h: clamp(28px, 7.8dvh, 38px);
    --phone-action-h: clamp(42px, 11.6dvh, 54px);
    --phone-gap: clamp(2px, .8dvh, 5px);
    --phone-scene-h: calc(100dvh - var(--phone-top-h) - var(--phone-action-h) - var(--phone-safe-top) - var(--phone-safe-bottom) - (var(--phone-gap) * 2));
    --phone-card-w: clamp(18px, 4.9dvh, 26px);
    --phone-card-h: calc(var(--phone-card-w) * 1.42);
    --phone-user-card-w: calc(var(--phone-card-w) * 1.2);
    --phone-user-card-h: calc(var(--phone-card-h) * 1.2);
    --phone-seat-w: clamp(44px, 9.8dvw, 76px);
    --phone-name-w: clamp(42px, 9.4dvw, 74px);
  }

  body:not(.in-lobby) .game-shell,
  body:not(.in-lobby) .game-stage .game-shell {
    box-sizing: border-box !important;
    display: grid !important;
    gap: var(--phone-gap) !important;
    grid-template-areas: "top" "table" "actions" !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: var(--phone-top-h) minmax(0, 1fr) var(--phone-action-h) !important;
    height: 100svh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding:
      max(1px, var(--phone-safe-top))
      max(4px, var(--phone-safe-right))
      max(2px, var(--phone-safe-bottom))
      max(4px, var(--phone-safe-left)) !important;
    width: 100dvw !important;
  }

  body:not(.in-lobby) .top-bar,
  body:not(.in-lobby) .game-stage .top-bar {
    align-items: center !important;
    box-sizing: border-box !important;
    display: grid !important;
    gap: 3px !important;
    grid-area: top !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    height: var(--phone-top-h) !important;
    max-height: var(--phone-top-h) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 1px 3px !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .top-bar h1,
  body:not(.in-lobby) .top-bar .eyebrow,
  body:not(.in-lobby) .score-strip > span {
    display: none !important;
  }

  body:not(.in-lobby) .score-strip,
  body:not(.in-lobby) .game-stage .score-strip {
    align-items: center !important;
    display: grid !important;
    gap: 3px !important;
    grid-template-columns: repeat(4, minmax(0, auto)) !important;
    justify-content: end !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  body:not(.in-lobby) .score-strip button,
  body:not(.in-lobby) .game-stage .score-strip button {
    border-radius: 999px !important;
    font-size: clamp(8px, 2dvh, 11px) !important;
    line-height: 1 !important;
    min-height: clamp(22px, 5.7dvh, 28px) !important;
    min-width: 0 !important;
    padding: 0 clamp(4px, 1.2dvw, 8px) !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .table-scene,
  body:not(.in-lobby) .game-stage .table-scene {
    box-sizing: border-box !important;
    grid-area: table !important;
    height: 100% !important;
    max-height: var(--phone-scene-h) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    position: relative !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .poker-table,
  body:not(.in-lobby) .game-stage .poker-table {
    height: min(72%, calc(100% - (var(--phone-user-card-h) * 1.15))) !important;
    left: 50% !important;
    max-height: 72% !important;
    max-width: 82% !important;
    min-height: 0 !important;
    position: absolute !important;
    top: 52% !important;
    transform: translate(-50%, -50%) !important;
    width: min(82%, calc(100% - (var(--phone-seat-w) * 1.45))) !important;
    z-index: 2 !important;
  }

  body:not(.in-lobby) .community,
  body:not(.in-lobby) .game-stage .community {
    gap: clamp(2px, .65dvw, 5px) !important;
    transform: translateY(-3px) !important;
  }

  body:not(.in-lobby) .card,
  body:not(.in-lobby) .community .card,
  body:not(.in-lobby) .hole-cards .card {
    border-radius: 4px !important;
    height: var(--phone-card-h) !important;
    width: var(--phone-card-w) !important;
  }

  body:not(.in-lobby) .seat-bottom .hole-cards .card {
    height: var(--phone-user-card-h) !important;
    width: var(--phone-user-card-w) !important;
  }

  body:not(.in-lobby) .hole-cards {
    gap: 2px !important;
    min-height: calc(var(--phone-card-h) + 2px) !important;
  }

  body:not(.in-lobby) .seat-bottom .hole-cards {
    min-height: calc(var(--phone-user-card-h) + 2px) !important;
  }

  body:not(.in-lobby) .card .corner {
    font-size: clamp(6px, 1.45dvh, 9px) !important;
  }

  body:not(.in-lobby) .card .face {
    font-size: clamp(10px, 3dvh, 17px) !important;
  }

  body:not(.in-lobby) .card .pips {
    font-size: clamp(8px, 2.3dvh, 13px) !important;
    gap: 0 !important;
  }

  body:not(.in-lobby) .seat,
  body:not(.in-lobby) .game-stage .seat {
    align-items: center !important;
    box-sizing: border-box !important;
    display: grid !important;
    gap: 1px !important;
    justify-items: center !important;
    max-width: var(--phone-seat-w) !important;
    min-width: 0 !important;
    position: absolute !important;
    width: var(--phone-seat-w) !important;
    z-index: 30 !important;
  }

  body:not(.in-lobby) .seat-top { left: 50% !important; right: auto !important; top: 1% !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-top-left { left: 31% !important; right: auto !important; top: 4% !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-top-right { left: 69% !important; right: auto !important; top: 4% !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-left-upper { left: 3% !important; right: auto !important; top: 29% !important; transform: translateY(-50%) !important; }
  body:not(.in-lobby) .seat-left-lower { left: 3% !important; right: auto !important; top: 63% !important; transform: translateY(-50%) !important; }
  body:not(.in-lobby) .seat-right-upper { left: 97% !important; right: auto !important; top: 29% !important; transform: translate(-100%, -50%) !important; }
  body:not(.in-lobby) .seat-right-lower { left: 97% !important; right: auto !important; top: 63% !important; transform: translate(-100%, -50%) !important; }
  body:not(.in-lobby) .seat-bottom { bottom: 0 !important; left: 50% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-bottom-left { bottom: 1% !important; left: 28% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-bottom-right { bottom: 1% !important; left: 72% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }

  body:not(.in-lobby) .player-nameplate {
    border-radius: 4px !important;
    box-sizing: border-box !important;
    max-width: var(--phone-name-w) !important;
    min-width: 0 !important;
    padding: 1px 3px !important;
    width: var(--phone-name-w) !important;
  }

  body:not(.in-lobby) .player-nameplate strong {
    font-size: clamp(6px, 1.55dvh, 9px) !important;
    line-height: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .player-nameplate span,
  body:not(.in-lobby) .status-pill,
  body:not(.in-lobby) .hand-readout,
  body:not(.in-lobby) .action-pop {
    font-size: clamp(5px, 1.2dvh, 7px) !important;
    line-height: 1 !important;
    max-width: var(--phone-name-w) !important;
    overflow: hidden !important;
    padding: 1px 3px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .player-avatar,
  body:not(.in-lobby) .seat-timer {
    display: none !important;
  }

  body:not(.in-lobby) .pot-stack {
    bottom: 20% !important;
    gap: 3px !important;
  }

  body:not(.in-lobby) .chips {
    height: clamp(15px, 4dvh, 22px) !important;
    width: clamp(15px, 4dvh, 22px) !important;
  }

  body:not(.in-lobby) .pot-stack span {
    font-size: clamp(8px, 2.2dvh, 12px) !important;
    padding: 2px 6px !important;
  }

  body:not(.in-lobby) .result-banner {
    bottom: 4% !important;
    font-size: clamp(7px, 1.55dvh, 9px) !important;
    max-width: 34dvw !important;
    overflow: hidden !important;
    padding: 2px 6px !important;
    text-overflow: ellipsis !important;
  }

  body:not(.in-lobby) .winner-banner,
  body:not(.in-lobby) .reveal-overlay {
    font-size: clamp(10px, 2.8dvh, 16px) !important;
    max-width: 52dvw !important;
    padding: 4px 8px !important;
  }

  body:not(.in-lobby) .turn-callout,
  body:not(.in-lobby) .chat-ticker {
    max-width: 42dvw !important;
    pointer-events: none !important;
  }

  body:not(.in-lobby) .odds-panel,
  body:not(.in-lobby) .message-log {
    display: none !important;
  }

  body:not(.in-lobby) .action-panel,
  body:not(.in-lobby) .game-stage .action-panel {
    align-items: center !important;
    background: transparent !important;
    bottom: auto !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    display: flex !important;
    grid-area: actions !important;
    height: var(--phone-action-h) !important;
    justify-content: center !important;
    left: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 1px 0 0 !important;
    position: relative !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    width: 100% !important;
    z-index: 80 !important;
  }

  body:not(.in-lobby) .controls,
  body:not(.in-lobby) .game-stage .controls {
    align-items: stretch !important;
    background: rgba(4, 10, 18, .86) !important;
    border: 1px solid rgba(255, 255, 255, .12) !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
    display: flex !important;
    gap: clamp(2px, .65dvw, 5px) !important;
    height: calc(var(--phone-action-h) - 3px) !important;
    justify-content: center !important;
    max-height: calc(var(--phone-action-h) - 3px) !important;
    max-width: min(94dvw, 620px) !important;
    min-height: 0 !important;
    padding: 2px !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .controls button,
  body:not(.in-lobby) .game-stage .controls button {
    border-radius: 6px !important;
    flex: 1 1 0 !important;
    font-size: clamp(8px, 2.2dvh, 12px) !important;
    height: auto !important;
    line-height: 1 !important;
    max-height: 100% !important;
    min-height: 0 !important;
    min-width: 0 !important;
    overflow: hidden !important;
    padding: 0 4px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .controls.status-only,
  body:not(.in-lobby) .controls.seat-pending {
    max-width: min(54dvw, 280px) !important;
  }

  body:not(.in-lobby) .controls.status-only .utility-action,
  body:not(.in-lobby) .controls.seat-pending .utility-action {
    font-size: clamp(7px, 1.65dvh, 10px) !important;
    min-height: 0 !important;
    padding: 0 8px !important;
  }

  body:not(.in-lobby) .bet-sizing,
  body:not(.in-lobby) .bet-sizing.show {
    bottom: calc(var(--phone-action-h) + var(--phone-safe-bottom) + 4px) !important;
    left: 50% !important;
    max-height: min(48dvh, 170px) !important;
    max-width: min(92dvw, 360px) !important;
    overflow: auto !important;
    right: auto !important;
    top: auto !important;
    transform: translateX(-50%) !important;
    width: min(92dvw, 360px) !important;
  }

  body:not(.in-lobby) .chat-panel,
  body:not(.in-lobby) .chat-panel.open {
    bottom: calc(var(--phone-action-h) + var(--phone-safe-bottom) + 5px) !important;
    left: auto !important;
    max-height: calc(100dvh - var(--phone-top-h) - var(--phone-action-h) - var(--phone-safe-top) - var(--phone-safe-bottom) - 12px) !important;
    right: max(5px, var(--phone-safe-right)) !important;
    top: auto !important;
    width: min(48dvw, 280px) !important;
  }
}

@media (orientation: landscape) and (max-height: 380px) and (max-width: 760px) {
  body:not(.in-lobby) .game-viewport {
    --phone-top-h: clamp(24px, 7dvh, 30px);
    --phone-action-h: clamp(36px, 10.8dvh, 44px);
    --phone-card-w: clamp(16px, 4.5dvh, 22px);
    --phone-seat-w: clamp(38px, 9dvw, 58px);
    --phone-name-w: clamp(36px, 8.5dvw, 56px);
  }

  body:not(.in-lobby) .poker-table,
  body:not(.in-lobby) .game-stage .poker-table {
    height: min(68%, calc(100% - (var(--phone-user-card-h) * 1.1))) !important;
    width: min(78%, calc(100% - (var(--phone-seat-w) * 1.55))) !important;
  }

  body:not(.in-lobby) .seat-top-left { left: 33% !important; }
  body:not(.in-lobby) .seat-top-right { left: 67% !important; }
  body:not(.in-lobby) .seat-bottom-left { left: 30% !important; }
  body:not(.in-lobby) .seat-bottom-right { left: 70% !important; }
}

/* Final playable phone landscape override: readability over full-table miniaturization. */
@media (orientation: landscape) and (max-height: 540px) and (max-width: 1000px) {
  body:not(.in-lobby) .game-viewport {
    --phone-top-h: clamp(32px, 8.8dvh, 44px);
    --phone-action-h: clamp(54px, 14.5dvh, 70px);
    --phone-card-w: clamp(32px, 5.25dvw, 48px);
    --phone-card-h: calc(var(--phone-card-w) * 1.42);
    --phone-user-card-w: calc(var(--phone-card-w) * 1.2);
    --phone-user-card-h: calc(var(--phone-card-h) * 1.2);
    --phone-seat-w: clamp(76px, 14dvw, 120px);
    --phone-name-w: clamp(72px, 13dvw, 112px);
  }

  body:not(.in-lobby) .game-stage .game-shell {
    grid-template-rows: var(--phone-top-h) minmax(0, 1fr) var(--phone-action-h) !important;
  }

  body:not(.in-lobby) .game-stage .table-scene {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-x: contain !important;
    scrollbar-width: thin !important;
    touch-action: pan-x !important;
  }

  body:not(.in-lobby) .game-stage .poker-table {
    height: min(60%, calc(100% - (var(--phone-user-card-h) * 1.05))) !important;
    max-height: 60% !important;
    max-width: none !important;
    min-width: min(112dvw, 1040px) !important;
    width: min(112dvw, 1040px) !important;
  }

  body:not(.in-lobby) .game-stage .card,
  body:not(.in-lobby) .game-stage .community .card,
  body:not(.in-lobby) .game-stage .hole-cards .card {
    height: var(--phone-card-h) !important;
    width: var(--phone-card-w) !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card {
    height: var(--phone-user-card-h) !important;
    width: var(--phone-user-card-w) !important;
  }

  body:not(.in-lobby) .game-stage .hole-cards {
    gap: clamp(3px, .75dvw, 7px) !important;
    min-height: calc(var(--phone-card-h) + 4px) !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom .hole-cards {
    min-height: calc(var(--phone-user-card-h) + 4px) !important;
  }

  body:not(.in-lobby) .game-stage .card .corner {
    font-size: clamp(9px, 2.35dvh, 14px) !important;
  }

  body:not(.in-lobby) .game-stage .card .face {
    font-size: clamp(17px, 4.8dvh, 28px) !important;
  }

  body:not(.in-lobby) .game-stage .card .pips {
    font-size: clamp(13px, 3.5dvh, 22px) !important;
    gap: 1px !important;
  }

  body:not(.in-lobby) .game-stage .player-nameplate {
    max-width: var(--phone-name-w) !important;
    min-width: var(--phone-name-w) !important;
    padding: 3px 5px !important;
    width: var(--phone-name-w) !important;
  }

  body:not(.in-lobby) .game-stage .player-nameplate strong {
    font-size: clamp(10px, 2.65dvh, 15px) !important;
    line-height: 1.05 !important;
  }

  body:not(.in-lobby) .game-stage .player-nameplate span,
  body:not(.in-lobby) .game-stage .status-pill,
  body:not(.in-lobby) .game-stage .hand-readout,
  body:not(.in-lobby) .game-stage .action-pop {
    font-size: clamp(8px, 2.1dvh, 12px) !important;
    line-height: 1.05 !important;
    max-width: var(--phone-name-w) !important;
    padding: 2px 5px !important;
  }

  body:not(.in-lobby) .game-stage .score-strip button {
    font-size: clamp(10px, 2.65dvh, 14px) !important;
    min-height: clamp(28px, 7dvh, 36px) !important;
    padding: 0 clamp(7px, 1.7dvw, 13px) !important;
  }

  body:not(.in-lobby) .game-stage .pot-stack span {
    font-size: clamp(11px, 2.9dvh, 16px) !important;
    padding: 3px 8px !important;
  }

  body:not(.in-lobby) .game-stage .result-banner {
    font-size: clamp(10px, 2.4dvh, 14px) !important;
    max-width: 52dvw !important;
    padding: 4px 9px !important;
  }

  body:not(.in-lobby) .game-stage .controls {
    height: calc(var(--phone-action-h) - 4px) !important;
    max-height: calc(var(--phone-action-h) - 4px) !important;
    max-width: min(96dvw, 740px) !important;
    padding: 4px !important;
  }

  body:not(.in-lobby) .game-stage .controls button {
    font-size: clamp(11px, 3dvh, 17px) !important;
    min-height: 0 !important;
    padding: 0 8px !important;
  }

  body:not(.in-lobby) .game-stage .controls.status-only,
  body:not(.in-lobby) .game-stage .controls.seat-pending {
    max-width: min(72dvw, 460px) !important;
  }

  body:not(.in-lobby) .game-stage .controls.status-only .utility-action,
  body:not(.in-lobby) .game-stage .controls.seat-pending .utility-action {
    font-size: clamp(10px, 2.55dvh, 15px) !important;
    padding: 0 12px !important;
  }
}

@media (orientation: landscape) and (max-height: 380px) and (max-width: 760px) {
  body:not(.in-lobby) .game-viewport {
    --phone-top-h: clamp(30px, 8.2dvh, 36px);
    --phone-action-h: clamp(50px, 14dvh, 60px);
    --phone-card-w: clamp(30px, 5.1dvw, 42px);
    --phone-seat-w: clamp(70px, 13.5dvw, 98px);
    --phone-name-w: clamp(66px, 12.5dvw, 92px);
  }

  body:not(.in-lobby) .game-stage .poker-table {
    min-width: min(118dvw, 980px) !important;
    width: min(118dvw, 980px) !important;
  }
}

/* Playable phone landscape pass: prioritize readable cards, labels, and controls. */
@media (orientation: landscape) and (max-height: 540px) and (max-width: 1000px) {
  body:not(.in-lobby),
  body:not(.in-lobby) .game-viewport,
  body:not(.in-lobby) .app-viewport,
  body:not(.in-lobby) .game-stage {
    height: 100svh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
  }

  body:not(.in-lobby) .game-viewport {
    --phone-top-h: clamp(32px, 8.8dvh, 44px);
    --phone-action-h: clamp(54px, 14.5dvh, 70px);
    --phone-gap: clamp(2px, .8dvh, 5px);
    --phone-card-w: clamp(32px, 5.25dvw, 48px);
    --phone-card-h: calc(var(--phone-card-w) * 1.42);
    --phone-user-card-w: calc(var(--phone-card-w) * 1.18);
    --phone-user-card-h: calc(var(--phone-card-h) * 1.18);
    --phone-seat-w: clamp(76px, 14dvw, 120px);
    --phone-name-w: clamp(72px, 13dvw, 112px);
  }

  body:not(.in-lobby) .game-shell,
  body:not(.in-lobby) .game-stage .game-shell {
    grid-template-rows: var(--phone-top-h) minmax(0, 1fr) var(--phone-action-h) !important;
  }

  body:not(.in-lobby) .table-scene,
  body:not(.in-lobby) .game-stage .table-scene {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    overscroll-behavior-x: contain !important;
    scrollbar-width: thin !important;
    touch-action: pan-x !important;
  }

  body:not(.in-lobby) .poker-table,
  body:not(.in-lobby) .game-stage .poker-table {
    height: min(60%, calc(100% - (var(--phone-user-card-h) * 1.05))) !important;
    max-height: 60% !important;
    max-width: none !important;
    min-width: min(112dvw, 1040px) !important;
    width: min(112dvw, 1040px) !important;
  }

  body:not(.in-lobby) .seat-top { top: 0 !important; }
  body:not(.in-lobby) .seat-top-left { left: 28% !important; top: 2% !important; }
  body:not(.in-lobby) .seat-top-right { left: 72% !important; top: 2% !important; }
  body:not(.in-lobby) .seat-left-upper { left: 0 !important; top: 30% !important; transform: translateY(-50%) !important; }
  body:not(.in-lobby) .seat-left-lower { left: 0 !important; top: 62% !important; transform: translateY(-50%) !important; }
  body:not(.in-lobby) .seat-right-upper { left: 100% !important; top: 30% !important; transform: translate(-100%, -50%) !important; }
  body:not(.in-lobby) .seat-right-lower { left: 100% !important; top: 62% !important; transform: translate(-100%, -50%) !important; }
  body:not(.in-lobby) .seat-bottom { bottom: 0 !important; }
  body:not(.in-lobby) .seat-bottom-left { bottom: 0 !important; left: 27% !important; }
  body:not(.in-lobby) .seat-bottom-right { bottom: 0 !important; left: 73% !important; }

  body:not(.in-lobby) .card,
  body:not(.in-lobby) .community .card,
  body:not(.in-lobby) .hole-cards .card {
    height: var(--phone-card-h) !important;
    width: var(--phone-card-w) !important;
  }

  body:not(.in-lobby) .seat-bottom .hole-cards .card {
    height: var(--phone-user-card-h) !important;
    width: var(--phone-user-card-w) !important;
  }

  body:not(.in-lobby) .hole-cards {
    gap: clamp(3px, .75dvw, 7px) !important;
    min-height: calc(var(--phone-card-h) + 4px) !important;
  }

  body:not(.in-lobby) .seat-bottom .hole-cards {
    min-height: calc(var(--phone-user-card-h) + 4px) !important;
  }

  body:not(.in-lobby) .card .corner {
    font-size: clamp(9px, 2.35dvh, 14px) !important;
  }

  body:not(.in-lobby) .card .face {
    font-size: clamp(17px, 4.8dvh, 28px) !important;
  }

  body:not(.in-lobby) .card .pips {
    font-size: clamp(13px, 3.5dvh, 22px) !important;
    gap: 1px !important;
  }

  body:not(.in-lobby) .player-nameplate {
    max-width: var(--phone-name-w) !important;
    min-width: var(--phone-name-w) !important;
    padding: 3px 5px !important;
    width: var(--phone-name-w) !important;
  }

  body:not(.in-lobby) .player-nameplate strong {
    font-size: clamp(10px, 2.65dvh, 15px) !important;
    line-height: 1.05 !important;
  }

  body:not(.in-lobby) .player-nameplate span,
  body:not(.in-lobby) .status-pill,
  body:not(.in-lobby) .hand-readout,
  body:not(.in-lobby) .action-pop {
    font-size: clamp(8px, 2.1dvh, 12px) !important;
    line-height: 1.05 !important;
    max-width: var(--phone-name-w) !important;
    padding: 2px 5px !important;
  }

  body:not(.in-lobby) .score-strip button {
    font-size: clamp(10px, 2.65dvh, 14px) !important;
    min-height: clamp(28px, 7dvh, 36px) !important;
    padding: 0 clamp(7px, 1.7dvw, 13px) !important;
  }

  body:not(.in-lobby) .pot-stack span {
    font-size: clamp(11px, 2.9dvh, 16px) !important;
    padding: 3px 8px !important;
  }

  body:not(.in-lobby) .result-banner {
    font-size: clamp(10px, 2.4dvh, 14px) !important;
    max-width: 52dvw !important;
    padding: 4px 9px !important;
  }

  body:not(.in-lobby) .controls,
  body:not(.in-lobby) .game-stage .controls {
    height: calc(var(--phone-action-h) - 4px) !important;
    max-height: calc(var(--phone-action-h) - 4px) !important;
    max-width: min(96dvw, 740px) !important;
    padding: 4px !important;
  }

  body:not(.in-lobby) .controls button,
  body:not(.in-lobby) .game-stage .controls button {
    font-size: clamp(11px, 3dvh, 17px) !important;
    min-height: 0 !important;
    padding: 0 8px !important;
  }

  body:not(.in-lobby) .controls.status-only,
  body:not(.in-lobby) .controls.seat-pending {
    max-width: min(72dvw, 460px) !important;
  }

  body:not(.in-lobby) .controls.status-only .utility-action,
  body:not(.in-lobby) .controls.seat-pending .utility-action {
    font-size: clamp(10px, 2.55dvh, 15px) !important;
    padding: 0 12px !important;
  }
}

@media (orientation: landscape) and (max-height: 380px) and (max-width: 760px) {
  body:not(.in-lobby) .game-viewport {
    --phone-top-h: clamp(30px, 8.2dvh, 36px);
    --phone-action-h: clamp(50px, 14dvh, 60px);
    --phone-card-w: clamp(30px, 5.1dvw, 42px);
    --phone-seat-w: clamp(70px, 13.5dvw, 98px);
    --phone-name-w: clamp(66px, 12.5dvw, 92px);
  }

  body:not(.in-lobby) .poker-table,
  body:not(.in-lobby) .game-stage .poker-table {
    min-width: min(118dvw, 980px) !important;
    width: min(118dvw, 980px) !important;
  }
}

/* Definitive phone layout override. This must remain the final responsive block. */
@media (orientation: portrait) and (max-width: 760px) {
  body:not(.in-lobby) {
    height: 100svh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
    padding: 0 !important;
    width: 100dvw !important;
  }

  body:not(.in-lobby) .game-viewport,
  body:not(.in-lobby) .app-viewport,
  body:not(.in-lobby) .game-stage {
    display: none !important;
  }

  body:not(.in-lobby) .rotate-phone-message {
    align-items: center !important;
    background: linear-gradient(145deg, #070d24, #130825 58%, #050813) !important;
    color: #fff !important;
    display: flex !important;
    font-size: clamp(1.05rem, 4.6vw, 1.55rem) !important;
    font-weight: 950 !important;
    inset: 0 !important;
    justify-content: center !important;
    line-height: 1.25 !important;
    padding:
      max(1.5rem, env(safe-area-inset-top, 0px))
      max(1.5rem, env(safe-area-inset-right, 0px))
      max(1.5rem, env(safe-area-inset-bottom, 0px))
      max(1.5rem, env(safe-area-inset-left, 0px)) !important;
    position: fixed !important;
    text-align: center !important;
    z-index: 99999 !important;
  }
}

@media (orientation: landscape) and (max-height: 540px) and (max-width: 1000px) {
  html,
  body:not(.in-lobby) {
    height: 100svh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
    overscroll-behavior: none !important;
    padding: 0 !important;
    width: 100dvw !important;
  }

  body:not(.in-lobby) .game-viewport {
    --safe-top: env(safe-area-inset-top, 0px);
    --safe-right: env(safe-area-inset-right, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);
    --safe-left: env(safe-area-inset-left, 0px);
    --phone-top-h: clamp(28px, 7.8dvh, 38px);
    --phone-action-h: clamp(42px, 11.5dvh, 54px);
    --phone-gap: clamp(2px, .8dvh, 5px);
    --phone-card-w: clamp(18px, 4.8dvh, 26px);
    --phone-card-h: calc(var(--phone-card-w) * 1.42);
    --phone-user-card-w: calc(var(--phone-card-w) * 1.2);
    --phone-user-card-h: calc(var(--phone-card-h) * 1.2);
    --phone-seat-w: clamp(44px, 9.8dvw, 76px);
    --phone-name-w: clamp(42px, 9.4dvw, 74px);
  }

  body:not(.in-lobby) .rotate-phone-message {
    display: none !important;
  }

  body:not(.in-lobby) .game-viewport,
  body:not(.in-lobby) .app-viewport,
  body:not(.in-lobby) .game-stage {
    display: block !important;
    height: 100svh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 0 !important;
    overflow: hidden !important;
    width: 100dvw !important;
  }

  body:not(.in-lobby) .game-shell,
  body:not(.in-lobby) .game-stage .game-shell {
    box-sizing: border-box !important;
    display: grid !important;
    gap: var(--phone-gap) !important;
    grid-template-areas: "top" "table" "actions" !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: var(--phone-top-h) minmax(0, 1fr) var(--phone-action-h) !important;
    height: 100svh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding:
      max(1px, var(--safe-top))
      max(4px, var(--safe-right))
      max(2px, var(--safe-bottom))
      max(4px, var(--safe-left)) !important;
    width: 100dvw !important;
  }

  body:not(.in-lobby) .top-bar,
  body:not(.in-lobby) .game-stage .top-bar {
    align-items: center !important;
    box-sizing: border-box !important;
    display: grid !important;
    gap: 3px !important;
    grid-area: top !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    height: var(--phone-top-h) !important;
    max-height: var(--phone-top-h) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 1px 3px !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .top-bar h1,
  body:not(.in-lobby) .top-bar .eyebrow,
  body:not(.in-lobby) .score-strip > span {
    display: none !important;
  }

  body:not(.in-lobby) .score-strip,
  body:not(.in-lobby) .game-stage .score-strip {
    display: grid !important;
    gap: 3px !important;
    grid-template-columns: repeat(4, minmax(0, auto)) !important;
    justify-content: end !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  body:not(.in-lobby) .score-strip button,
  body:not(.in-lobby) .game-stage .score-strip button {
    border-radius: 999px !important;
    font-size: clamp(8px, 2dvh, 11px) !important;
    line-height: 1 !important;
    min-height: clamp(22px, 5.7dvh, 28px) !important;
    min-width: 0 !important;
    padding: 0 clamp(4px, 1.2dvw, 8px) !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .table-scene,
  body:not(.in-lobby) .game-stage .table-scene {
    box-sizing: border-box !important;
    display: block !important;
    grid-area: table !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    position: relative !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .poker-table,
  body:not(.in-lobby) .game-stage .poker-table {
    height: min(70%, calc(100% - (var(--phone-user-card-h) * 1.15))) !important;
    left: 50% !important;
    max-height: 70% !important;
    max-width: 82% !important;
    position: absolute !important;
    top: 52% !important;
    transform: translate(-50%, -50%) !important;
    width: min(82%, calc(100% - (var(--phone-seat-w) * 1.45))) !important;
    z-index: 2 !important;
  }

  body:not(.in-lobby) .card,
  body:not(.in-lobby) .community .card,
  body:not(.in-lobby) .hole-cards .card {
    border-radius: 4px !important;
    height: var(--phone-card-h) !important;
    width: var(--phone-card-w) !important;
  }

  body:not(.in-lobby) .seat-bottom .hole-cards .card {
    height: var(--phone-user-card-h) !important;
    width: var(--phone-user-card-w) !important;
  }

  body:not(.in-lobby) .community {
    gap: clamp(2px, .65dvw, 5px) !important;
    transform: translateY(-3px) !important;
  }

  body:not(.in-lobby) .hole-cards {
    gap: 2px !important;
    min-height: calc(var(--phone-card-h) + 2px) !important;
  }

  body:not(.in-lobby) .seat-bottom .hole-cards {
    min-height: calc(var(--phone-user-card-h) + 2px) !important;
  }

  body:not(.in-lobby) .card .corner { font-size: clamp(6px, 1.45dvh, 9px) !important; }
  body:not(.in-lobby) .card .face { font-size: clamp(10px, 3dvh, 17px) !important; }
  body:not(.in-lobby) .card .pips {
    font-size: clamp(8px, 2.3dvh, 13px) !important;
    gap: 0 !important;
  }

  body:not(.in-lobby) .seat,
  body:not(.in-lobby) .game-stage .seat {
    align-items: center !important;
    box-sizing: border-box !important;
    display: grid !important;
    gap: 1px !important;
    justify-items: center !important;
    max-width: var(--phone-seat-w) !important;
    min-width: 0 !important;
    position: absolute !important;
    width: var(--phone-seat-w) !important;
    z-index: 30 !important;
  }

  body:not(.in-lobby) .seat-top { left: 50% !important; right: auto !important; top: 1% !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-top-left { left: 31% !important; right: auto !important; top: 4% !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-top-right { left: 69% !important; right: auto !important; top: 4% !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-left-upper { left: 3% !important; right: auto !important; top: 29% !important; transform: translateY(-50%) !important; }
  body:not(.in-lobby) .seat-left-lower { left: 3% !important; right: auto !important; top: 63% !important; transform: translateY(-50%) !important; }
  body:not(.in-lobby) .seat-right-upper { left: 97% !important; right: auto !important; top: 29% !important; transform: translate(-100%, -50%) !important; }
  body:not(.in-lobby) .seat-right-lower { left: 97% !important; right: auto !important; top: 63% !important; transform: translate(-100%, -50%) !important; }
  body:not(.in-lobby) .seat-bottom { bottom: 0 !important; left: 50% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-bottom-left { bottom: 1% !important; left: 28% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-bottom-right { bottom: 1% !important; left: 72% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }

  body:not(.in-lobby) .player-nameplate {
    border-radius: 4px !important;
    box-sizing: border-box !important;
    max-width: var(--phone-name-w) !important;
    min-width: 0 !important;
    padding: 1px 3px !important;
    width: var(--phone-name-w) !important;
  }

  body:not(.in-lobby) .player-nameplate strong {
    font-size: clamp(6px, 1.55dvh, 9px) !important;
    line-height: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .player-nameplate span,
  body:not(.in-lobby) .status-pill,
  body:not(.in-lobby) .hand-readout,
  body:not(.in-lobby) .action-pop {
    font-size: clamp(5px, 1.2dvh, 7px) !important;
    line-height: 1 !important;
    max-width: var(--phone-name-w) !important;
    overflow: hidden !important;
    padding: 1px 3px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .player-avatar,
  body:not(.in-lobby) .seat-timer,
  body:not(.in-lobby) .odds-panel,
  body:not(.in-lobby) .message-log {
    display: none !important;
  }

  body:not(.in-lobby) .pot-stack { bottom: 20% !important; gap: 3px !important; }
  body:not(.in-lobby) .chips {
    height: clamp(15px, 4dvh, 22px) !important;
    width: clamp(15px, 4dvh, 22px) !important;
  }
  body:not(.in-lobby) .pot-stack span {
    font-size: clamp(8px, 2.2dvh, 12px) !important;
    padding: 2px 6px !important;
  }

  body:not(.in-lobby) .result-banner {
    bottom: 4% !important;
    font-size: clamp(7px, 1.55dvh, 9px) !important;
    max-width: 34dvw !important;
    overflow: hidden !important;
    padding: 2px 6px !important;
    text-overflow: ellipsis !important;
  }

  body:not(.in-lobby) .winner-banner,
  body:not(.in-lobby) .reveal-overlay {
    font-size: clamp(10px, 2.8dvh, 16px) !important;
    max-width: 52dvw !important;
    padding: 4px 8px !important;
  }

  body:not(.in-lobby) .action-panel,
  body:not(.in-lobby) .game-stage .action-panel {
    align-items: center !important;
    background: transparent !important;
    bottom: auto !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    display: flex !important;
    grid-area: actions !important;
    height: var(--phone-action-h) !important;
    justify-content: center !important;
    left: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 1px 0 0 !important;
    position: relative !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    width: 100% !important;
    z-index: 80 !important;
  }

  body:not(.in-lobby) .controls,
  body:not(.in-lobby) .game-stage .controls {
    align-items: stretch !important;
    background: rgba(4, 10, 18, .86) !important;
    border: 1px solid rgba(255, 255, 255, .12) !important;
    border-radius: 8px !important;
    box-sizing: border-box !important;
    display: flex !important;
    gap: clamp(2px, .65dvw, 5px) !important;
    height: calc(var(--phone-action-h) - 3px) !important;
    justify-content: center !important;
    max-height: calc(var(--phone-action-h) - 3px) !important;
    max-width: min(94dvw, 620px) !important;
    min-height: 0 !important;
    padding: 2px !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .controls button,
  body:not(.in-lobby) .game-stage .controls button {
    border-radius: 6px !important;
    flex: 1 1 0 !important;
    font-size: clamp(8px, 2.2dvh, 12px) !important;
    height: auto !important;
    line-height: 1 !important;
    max-height: 100% !important;
    min-height: 0 !important;
    min-width: 0 !important;
    overflow: hidden !important;
    padding: 0 4px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .controls.status-only,
  body:not(.in-lobby) .controls.seat-pending {
    max-width: min(54dvw, 280px) !important;
  }

  body:not(.in-lobby) .controls.status-only .utility-action,
  body:not(.in-lobby) .controls.seat-pending .utility-action {
    font-size: clamp(7px, 1.65dvh, 10px) !important;
    min-height: 0 !important;
    padding: 0 8px !important;
  }

  body:not(.in-lobby) .bet-sizing,
  body:not(.in-lobby) .bet-sizing.show {
    bottom: calc(var(--phone-action-h) + var(--safe-bottom) + 4px) !important;
    left: 50% !important;
    max-height: min(48dvh, 170px) !important;
    max-width: min(92dvw, 360px) !important;
    overflow: auto !important;
    right: auto !important;
    top: auto !important;
    transform: translateX(-50%) !important;
    width: min(92dvw, 360px) !important;
  }

  body:not(.in-lobby) .chat-panel,
  body:not(.in-lobby) .chat-panel.open {
    bottom: calc(var(--phone-action-h) + var(--safe-bottom) + 5px) !important;
    left: auto !important;
    max-height: calc(100dvh - var(--phone-top-h) - var(--phone-action-h) - var(--safe-top) - var(--safe-bottom) - 12px) !important;
    right: max(5px, var(--safe-right)) !important;
    top: auto !important;
    width: min(48dvw, 280px) !important;
  }
}

@media (orientation: landscape) and (max-height: 380px) and (max-width: 760px) {
  body:not(.in-lobby) .game-viewport {
    --phone-top-h: clamp(24px, 7dvh, 30px);
    --phone-action-h: clamp(36px, 10.8dvh, 44px);
    --phone-card-w: clamp(16px, 4.5dvh, 22px);
    --phone-seat-w: clamp(38px, 9dvw, 58px);
    --phone-name-w: clamp(36px, 8.5dvw, 56px);
  }

  body:not(.in-lobby) .poker-table,
  body:not(.in-lobby) .game-stage .poker-table {
    height: min(66%, calc(100% - (var(--phone-user-card-h) * 1.1))) !important;
    width: min(78%, calc(100% - (var(--phone-seat-w) * 1.55))) !important;
  }

  body:not(.in-lobby) .seat-top-left { left: 33% !important; }
  body:not(.in-lobby) .seat-top-right { left: 67% !important; }
  body:not(.in-lobby) .seat-bottom-left { left: 30% !important; }
  body:not(.in-lobby) .seat-bottom-right { left: 70% !important; }
}

@media (max-width: 430px) {
  html,
  body {
    max-width: 100vw;
    overflow-x: hidden;
    width: 100vw;
  }

  .rotate-phone-message {
    padding-left: max(1.25rem, env(safe-area-inset-left));
    padding-right: max(1.25rem, env(safe-area-inset-right));
  }
}

@media (orientation: landscape) and (max-height: 430px) {
  :root {
    --phone-topbar-h: clamp(2.15rem, 8svh, 2.85rem);
    --phone-actions-h: clamp(2.55rem, 11.5svh, 3.45rem);
    --phone-edge-x: max(.28rem, env(safe-area-inset-left), env(safe-area-inset-right));
  }

  html,
  body {
    height: 100svh;
    max-height: 100svh;
    max-width: 100vw;
    overflow: hidden;
    overscroll-behavior: none;
    width: 100vw;
  }

  body:not(.in-lobby) {
    padding-bottom: calc(var(--phone-actions-h) + env(safe-area-inset-bottom));
  }

  body:not(.in-lobby) .game-shell {
    gap: .18rem;
    grid-template-rows: var(--phone-topbar-h) minmax(0, 1fr);
    height: 100svh;
    max-height: 100svh;
    overflow: hidden;
    padding:
      max(.18rem, env(safe-area-inset-top))
      var(--phone-edge-x)
      0
      var(--phone-edge-x);
    width: 100vw;
  }

  body:not(.in-lobby) .top-bar {
    border-radius: 5px;
    height: var(--phone-topbar-h);
    min-height: 0;
    overflow: visible;
    padding: .16rem .32rem;
  }

  body:not(.in-lobby) .top-bar h1 {
    font-size: clamp(.72rem, 2.35svh, 1rem);
  }

  body:not(.in-lobby) .top-bar .eyebrow {
    font-size: clamp(.42rem, 1.45svh, .56rem);
  }

  body:not(.in-lobby) .score-strip {
    flex-wrap: nowrap;
    gap: .16rem;
    max-width: 70vw;
    overflow: hidden;
  }

  body:not(.in-lobby) .score-strip span,
  body:not(.in-lobby) .score-strip button {
    border-radius: 999px;
    font-size: clamp(.46rem, 1.6svh, .6rem);
    min-height: clamp(1.2rem, 4.4svh, 1.55rem);
    padding: .12rem .26rem;
    white-space: nowrap;
  }

  body:not(.in-lobby) .table-scene {
    height: calc(100svh - var(--phone-topbar-h) - var(--phone-actions-h) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - .46rem);
    max-height: calc(100svh - var(--phone-topbar-h) - var(--phone-actions-h) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - .46rem);
    min-height: 0;
    overflow: hidden;
    width: calc(100vw - (var(--phone-edge-x) * 2));
  }

  body:not(.in-lobby) .poker-table {
    height: min(45svh, 54%);
    top: 49.5%;
    width: min(88vw, 86%);
  }

  body:not(.in-lobby) .community {
    gap: min(.24rem, .75vw);
    min-height: min(13svh, 4.15rem);
    transform: translateY(-1.7svh);
  }

  body:not(.in-lobby) .community .card,
  body:not(.in-lobby) .card {
    border-radius: 4px;
    font-size: min(2.2vw, .78rem);
    height: min(12.2svh, 4.15rem);
    padding: min(.12rem, .32vw);
    width: min(7.4vw, 2.85rem);
  }

  body:not(.in-lobby) .card .corner {
    font-size: min(1.55vw, .56rem);
  }

  body:not(.in-lobby) .card .pips,
  body:not(.in-lobby) .community .card .pips {
    font-size: min(2.55vw, .92rem);
  }

  body:not(.in-lobby) .card .pips-1 i:nth-child(1),
  body:not(.in-lobby) .community .card .pips-1 i:nth-child(1) {
    font-size: min(4.2vw, 1.55rem);
  }

  body:not(.in-lobby) .card .royalty b,
  body:not(.in-lobby) .community .card .royalty b {
    font-size: min(2.65vw, .95rem);
  }

  body:not(.in-lobby) .card .royalty small,
  body:not(.in-lobby) .community .card .royalty small {
    font-size: min(1.75vw, .62rem);
  }

  body:not(.in-lobby) .hole-cards {
    gap: min(.14rem, .42vw);
    min-height: min(8svh, 2.7rem);
  }

  body:not(.in-lobby) .hole-cards .card {
    font-size: min(1.75vw, .62rem);
    height: min(8.2svh, 2.62rem);
    width: min(4.8vw, 1.75rem);
  }

  body:not(.in-lobby) .seat-bottom .hole-cards .card {
    height: min(9.9svh, 3.05rem);
    width: min(5.6vw, 2.05rem);
  }

  body:not(.in-lobby) .hole-cards .card .corner {
    font-size: min(1.15vw, .42rem);
  }

  body:not(.in-lobby) .hole-cards .card .pips {
    font-size: min(1.9vw, .7rem);
  }

  body:not(.in-lobby) .hole-cards .card .pips-1 i:nth-child(1) {
    font-size: min(3vw, 1.05rem);
  }

  body:not(.in-lobby) .seat {
    gap: min(.08rem, .25vw);
    min-width: min(13vw, 3.85rem);
  }

  body:not(.in-lobby) .seat-bottom {
    bottom: 5.8%;
    left: 50%;
  }

  body:not(.in-lobby) .seat-bottom-left {
    bottom: 4%;
    left: 22%;
  }

  body:not(.in-lobby) .seat-bottom-right {
    bottom: 4%;
    right: 22%;
  }

  body:not(.in-lobby) .seat-left-lower {
    left: .25%;
    top: 58%;
  }

  body:not(.in-lobby) .seat-left-upper {
    left: .25%;
    top: 29%;
  }

  body:not(.in-lobby) .seat-right-lower {
    right: .25%;
    top: 58%;
  }

  body:not(.in-lobby) .seat-right-upper {
    right: .25%;
    top: 29%;
  }

  body:not(.in-lobby) .seat-top-left {
    left: 28%;
    top: 1.5%;
  }

  body:not(.in-lobby) .seat-top {
    top: .8%;
  }

  body:not(.in-lobby) .seat-top-right {
    right: 28%;
    top: 1.5%;
  }

  body:not(.in-lobby) .player-nameplate {
    border-radius: 4px;
    min-width: min(12vw, 3.5rem);
    padding: min(.11rem, .35svh) min(.22rem, .7vw);
  }

  body:not(.in-lobby) .player-nameplate strong {
    font-size: min(1.55vw, .5rem);
  }

  body:not(.in-lobby) .player-nameplate span {
    font-size: min(1.35vw, .45rem);
  }

  body:not(.in-lobby) .status-pill,
  body:not(.in-lobby) .hand-readout,
  body:not(.in-lobby) .action-pop {
    font-size: min(1.3vw, .42rem);
    padding: .06rem .16rem;
  }

  body:not(.in-lobby) .turn-timer,
  body:not(.in-lobby) .seat.turn-spotlight::before {
    height: min(14.5svh, 4.5rem);
    width: min(14.5svh, 4.5rem);
  }

  body:not(.in-lobby) .turn-timer span {
    font-size: min(1.75vw, .56rem);
    height: min(3.6svh, 1.08rem);
    top: -.28rem;
    width: min(3.6svh, 1.08rem);
  }

  body:not(.in-lobby) .pot-stack {
    bottom: 24%;
    gap: .12rem;
    transform: translateX(-50%) scale(.68);
  }

  body:not(.in-lobby) .pot-stack span {
    font-size: min(2.45vw, .8rem);
    padding: .12rem .34rem;
  }

  body:not(.in-lobby) .chips {
    height: min(3.7svh, 1rem);
    width: min(3.7svh, 1rem);
  }

  body:not(.in-lobby) .bankroll-stack {
    transform: translate(-50%, -50%) scale(.48);
  }

  body:not(.in-lobby) .player-bet-stack {
    transform: translate(-50%, -50%) scale(.55);
  }

  body:not(.in-lobby) .dealer-chip,
  body:not(.in-lobby) .blind-chip {
    font-size: min(1.05vw, .36rem);
    height: min(3.2svh, .86rem);
    width: min(3.2svh, .86rem);
  }

  body:not(.in-lobby) .reveal-overlay {
    border-radius: 5px;
    box-shadow: 0 0 0 100vmax rgba(1,4,18,.38), 0 0 18px rgba(255,228,92,.42);
    font-size: min(2.1vw, .7rem);
    line-height: 1;
    max-width: 36vw;
    padding: .12rem .3rem;
    top: 13%;
    white-space: nowrap;
    z-index: 80;
  }

  body:not(.in-lobby) .reveal-overlay.show {
    transform: translate(-50%, -50%) scale(.9);
  }

  body:not(.in-lobby) .winner-banner {
    box-shadow: 0 0 0 100vmax rgba(1,4,18,.42), 0 14px 32px rgba(0,0,0,.45), 0 0 22px rgba(255,228,92,.28);
    font-size: min(2.35vw, .82rem);
    max-width: 58vw;
    padding: .18rem .42rem;
    top: 66%;
    z-index: 82;
  }

  body:not(.in-lobby) .odds-panel {
    bottom: calc(var(--phone-actions-h) + env(safe-area-inset-bottom) + .22rem);
    left: max(.3rem, env(safe-area-inset-left));
    max-height: 17svh;
    max-width: 31vw;
    overflow: auto;
    padding: .22rem;
    position: fixed;
    z-index: 135;
  }

  body:not(.in-lobby) .odds-list div {
    font-size: min(1.35vw, .46rem);
    padding: .1rem .18rem;
  }

  body:not(.in-lobby) .action-panel {
    min-height: var(--phone-actions-h);
    padding:
      .22rem
      max(.34rem, env(safe-area-inset-right))
      max(.24rem, env(safe-area-inset-bottom))
      max(.34rem, env(safe-area-inset-left));
  }

  body:not(.in-lobby) .controls {
    gap: .22rem;
  }

  body:not(.in-lobby) .controls button {
    border-radius: 999px;
    font-size: min(2.45vw, .78rem);
    min-height: clamp(2rem, 9.5svh, 2.55rem);
    padding: .2rem .24rem;
  }

  body:not(.in-lobby) .bet-sizing {
    bottom: auto;
    box-shadow: 0 0 0 100vmax rgba(1,4,18,.56), 0 18px 42px rgba(0,0,0,.55), 0 0 24px rgba(32,213,255,.25);
    left: 50%;
    max-height: 74svh;
    max-width: min(78vw, 21rem);
    padding: .45rem;
    right: auto;
    top: 48%;
    transform: translate(-50%, -50%);
    width: min(78vw, 21rem);
    z-index: 180;
  }

  body:not(.in-lobby) .bet-sizing.show {
    animation: none;
    transform: translate(-50%, -50%);
  }

  body:not(.in-lobby) .bet-sheet-head span,
  body:not(.in-lobby) .bet-sizing label {
    font-size: min(1.7vw, .58rem);
  }

  body:not(.in-lobby) .bet-sizing strong {
    font-size: min(4.4vw, 1.35rem);
  }

  body:not(.in-lobby) .bet-sizing input[type="range"] {
    min-height: 1.6rem;
  }

  body:not(.in-lobby) .bet-sizing button {
    font-size: min(1.65vw, .56rem);
    min-height: 1.85rem;
    padding: .2rem .26rem;
  }

  .nickname-modal,
  .welcome-bonus-modal,
  .reload-modal,
  .legal-modal,
  .register-modal.first-visit,
  .register-modal.manual-open {
    background: rgba(1,4,18,.82);
    padding:
      max(.45rem, env(safe-area-inset-top))
      max(.55rem, env(safe-area-inset-right))
      max(.45rem, env(safe-area-inset-bottom))
      max(.55rem, env(safe-area-inset-left));
  }

  .nickname-card,
  .welcome-bonus-card,
  .reload-card,
  .legal-card,
  .register-modal.first-visit .register-card,
.register-modal.manual-open .register-card {
    max-height: calc(100svh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 1rem);
    max-width: min(82vw, 25rem);
    overflow: auto;
    padding: .65rem;
  }
}
.register-card > button[type="submit"] {
  background: linear-gradient(180deg, var(--gold), #ff9f43);
  border-color: rgba(255,228,92,.72);
  color: #20120a;
  min-height: 2.75rem;
  text-transform: uppercase;
}

@media (orientation: landscape) and (max-height: 400px) {
  :root {
    --phone-topbar-h: clamp(1.85rem, 7.2dvh, 2.45rem);
    --phone-actions-h: clamp(2.25rem, 10dvh, 3rem);
  }

  html,
  body {
    height: 100dvh;
    max-height: 100dvh;
    overflow: hidden;
  }

  body:not(.in-lobby) .game-shell {
    height: 100dvh;
    max-height: 100dvh;
    padding-top: max(.12rem, env(safe-area-inset-top));
  }

  body:not(.in-lobby) .top-bar {
    height: var(--phone-topbar-h);
    padding: .12rem .26rem;
  }

  body:not(.in-lobby) .top-bar h1 {
    font-size: clamp(.66rem, 2.15dvh, .92rem);
  }

  body:not(.in-lobby) .top-bar .eyebrow {
    font-size: clamp(.38rem, 1.25dvh, .5rem);
  }

  body:not(.in-lobby) .score-strip span,
  body:not(.in-lobby) .score-strip button {
    font-size: clamp(.42rem, 1.38dvh, .54rem);
    min-height: clamp(1.05rem, 3.8dvh, 1.35rem);
    padding: .08rem .22rem;
  }

  body:not(.in-lobby) .table-scene {
    height: calc(100dvh - var(--phone-topbar-h) - var(--phone-actions-h) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - .34rem);
    max-height: calc(100dvh - var(--phone-topbar-h) - var(--phone-actions-h) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - .34rem);
  }

  body:not(.in-lobby) .action-panel {
    min-height: var(--phone-actions-h);
    padding:
      .16rem
      max(.3rem, env(safe-area-inset-right))
      max(.18rem, env(safe-area-inset-bottom))
      max(.3rem, env(safe-area-inset-left));
  }

  body:not(.in-lobby) .controls {
    gap: .18rem;
  }

  body:not(.in-lobby) .controls button {
    font-size: min(2.2vw, .68rem);
    min-height: clamp(1.85rem, 8.6dvh, 2.3rem);
    padding: .16rem .2rem;
  }

  body:not(.in-lobby) .winner-banner {
    align-items: center;
    background: linear-gradient(135deg, var(--gold), var(--pink));
    border-radius: 8px;
    box-shadow: 0 0 0 100vmax rgba(1,4,18,.66), 0 18px 44px rgba(0,0,0,.55), 0 0 26px rgba(255,228,92,.35);
    font-size: clamp(.64rem, 2.2vw, .82rem);
    inset: 0;
    justify-content: center;
    left: 0;
    margin:
      max(.55rem, env(safe-area-inset-top))
      max(.7rem, env(safe-area-inset-right))
      calc(var(--phone-actions-h) + env(safe-area-inset-bottom) + .45rem)
      max(.7rem, env(safe-area-inset-left));
    max-height: calc(100dvh - 120px);
    max-width: none;
    min-height: 0;
    overflow-y: auto;
    padding: .4rem .55rem;
    position: fixed;
    right: 0;
    text-align: center;
    top: 0;
    transform: none;
    width: auto;
    z-index: 9999;
  }

  body:not(.in-lobby) .winner-banner.show {
    display: flex;
  }

  body:not(.in-lobby) .winner-banner strong {
    font-size: 1.05em;
  }

  body:not(.in-lobby) .winner-banner span {
    font-size: .76em;
  }
}

@media (max-width: 400px), (orientation: landscape) and (max-height: 400px) {
  body:not(.in-lobby) .bet-sizing {
    animation: none;
    border-radius: 14px 14px 0 0;
    bottom: max(.18rem, env(safe-area-inset-bottom));
    box-shadow: 0 -16px 38px rgba(0,0,0,.58), 0 0 0 100vmax rgba(1,4,18,.18), inset 0 1px rgba(255,255,255,.18);
    gap: .28rem;
    height: auto;
    left: 50%;
    max-height: 40dvh;
    max-width: 90vw;
    min-height: 25dvh;
    overflow-y: auto;
    padding: .36rem .48rem .42rem;
    position: fixed;
    right: auto;
    top: auto;
    transform: translate(-50%, 112%);
    width: 90vw;
    z-index: 9998;
  }

  body:not(.in-lobby) .bet-sizing.show {
    animation: mobileBetSheetIn 180ms ease both;
    display: grid;
    transform: translate(-50%, 0);
  }

  body:not(.in-lobby) .bet-sheet-head {
    gap: .35rem;
  }

  body:not(.in-lobby) .bet-sheet-head span,
  body:not(.in-lobby) .bet-sizing label {
    font-size: 12px;
  }

  body:not(.in-lobby) .bet-sizing strong {
    font-size: clamp(1rem, 4.8vw, 1.3rem);
  }

  body:not(.in-lobby) .bet-sizing input[type="range"] {
    min-height: 1.25rem;
  }

  body:not(.in-lobby) .quick-bet-row,
  body:not(.in-lobby) .bet-confirm-row {
    gap: .28rem;
  }

  body:not(.in-lobby) .bet-sizing button {
    font-size: 14px;
    min-height: 1.48rem;
    padding: .16rem .24rem;
  }
}

@keyframes mobileBetSheetIn {
  from { opacity: .88; transform: translate(-50%, 112%); }
  to { opacity: 1; transform: translate(-50%, 0); }
}

@media (orientation: landscape) and (max-height: 620px) {
  html,
  body {
    box-sizing: border-box;
    height: 100dvh;
    max-height: 100dvh;
    max-width: 100vw;
    overflow: hidden;
    width: 100vw;
  }

  body:not(.in-lobby) {
    --mobile-topbar: clamp(2rem, 8dvh, 3.15rem);
    --mobile-actions: clamp(2.55rem, 10dvh, 4rem);
    padding:
      max(.18rem, env(safe-area-inset-top))
      max(.28rem, env(safe-area-inset-right))
      calc(var(--mobile-actions) + env(safe-area-inset-bottom))
      max(.28rem, env(safe-area-inset-left));
  }

  body:not(.in-lobby) .game-shell {
    gap: clamp(.12rem, .6dvh, .32rem);
    grid-template-rows: var(--mobile-topbar) minmax(0, 1fr);
    height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    max-height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    max-width: none;
    min-height: 0;
    overflow: hidden;
    padding: 0;
    width: calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right) - .56rem);
  }

  body:not(.in-lobby) .top-bar {
    align-items: center;
    border-radius: 6px;
    flex-direction: row;
    gap: clamp(.18rem, .7vw, .55rem);
    height: var(--mobile-topbar);
    min-height: 0;
    overflow: hidden;
    padding: clamp(.1rem, .7dvh, .32rem) clamp(.24rem, .9vw, .62rem);
  }

  body:not(.in-lobby) .top-bar h1 {
    font-size: clamp(.72rem, 2.6dvh, 1.22rem);
    line-height: 1;
  }

  body:not(.in-lobby) .top-bar .eyebrow {
    font-size: clamp(.38rem, 1.45dvh, .62rem);
    margin: 0;
  }

  body:not(.in-lobby) .score-strip {
    flex-wrap: nowrap;
    gap: clamp(.12rem, .45vw, .36rem);
    justify-content: flex-end;
    max-width: 68vw;
    overflow: hidden;
  }

  body:not(.in-lobby) .score-strip span,
  body:not(.in-lobby) .score-strip button {
    font-size: clamp(.46rem, 1.55dvh, .72rem);
    min-height: clamp(1.12rem, 4.2dvh, 1.8rem);
    padding: clamp(.08rem, .35dvh, .24rem) clamp(.22rem, .8vw, .5rem);
    white-space: nowrap;
  }

  body:not(.in-lobby) .table-scene {
    aspect-ratio: auto;
    border-radius: 6px;
    height: calc(100dvh - var(--mobile-topbar) - var(--mobile-actions) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - clamp(.5rem, 1.2dvh, .9rem));
    max-height: calc(100dvh - var(--mobile-topbar) - var(--mobile-actions) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - clamp(.5rem, 1.2dvh, .9rem));
    min-height: 0;
    overflow: hidden;
    width: 100%;
  }

  body:not(.in-lobby) .poker-table {
    height: clamp(36%, 44dvh, 52%);
    top: 50%;
    width: clamp(76%, 84vw, 92%);
  }

  body:not(.in-lobby) .seat {
    gap: clamp(.04rem, .2dvh, .12rem);
    min-width: clamp(3.2rem, 11vw, 5.8rem);
  }

  body:not(.in-lobby) .player-nameplate {
    border-radius: 5px;
    min-width: clamp(3rem, 10vw, 5rem);
    padding: clamp(.05rem, .25dvh, .16rem) clamp(.16rem, .6vw, .34rem);
  }

  body:not(.in-lobby) .player-nameplate strong {
    font-size: clamp(.44rem, 1.35dvh, .72rem);
  }

  body:not(.in-lobby) .player-nameplate span,
  body:not(.in-lobby) .status-pill,
  body:not(.in-lobby) .hand-readout,
  body:not(.in-lobby) .action-pop {
    font-size: clamp(.38rem, 1.1dvh, .58rem);
  }

  body:not(.in-lobby) .community {
    gap: clamp(.16rem, .55vw, .5rem);
    min-height: clamp(3.2rem, 13dvh, 6rem);
    transform: translateY(clamp(-1rem, -2dvh, -.35rem));
  }

  body:not(.in-lobby) .community .card {
    font-size: clamp(.76rem, 2.4dvh, 1.55rem);
    height: clamp(3.55rem, 13.5dvh, 6.8rem);
    width: clamp(2.35rem, 8.6dvh, 4.7rem);
  }

  body:not(.in-lobby) .hole-cards .card {
    height: clamp(2.2rem, 8.5dvh, 4.8rem);
    width: clamp(1.5rem, 5.7dvh, 3.2rem);
  }

  body:not(.in-lobby) .seat-bottom .hole-cards .card {
    height: clamp(2.6rem, 10dvh, 5.25rem);
    width: clamp(1.8rem, 6.7dvh, 3.55rem);
  }

  body:not(.in-lobby) .pot-stack {
    bottom: clamp(22%, 25dvh, 31%);
    transform: translateX(-50%) scale(clamp(.58, 1.55dvh, .9));
  }

  body:not(.in-lobby) .winner-banner {
    font-size: clamp(.76rem, 2.7dvh, 1.35rem);
    left: 50%;
    max-width: min(72vw, 30rem);
    min-width: min(18rem, 68vw);
    padding: clamp(.35rem, 1.2dvh, .8rem) clamp(.55rem, 1.6vw, 1.05rem);
    position: absolute;
    top: clamp(14%, 20dvh, 26%);
    transform: translateX(-50%);
    z-index: 9999;
  }

  body:not(.in-lobby) .action-panel {
    min-height: var(--mobile-actions);
    padding:
      clamp(.16rem, .7dvh, .38rem)
      max(.34rem, env(safe-area-inset-right))
      max(.18rem, env(safe-area-inset-bottom))
      max(.34rem, env(safe-area-inset-left));
  }

  body:not(.in-lobby) .controls {
    gap: clamp(.16rem, .7vw, .55rem);
    max-width: min(100%, 52rem);
  }

  body:not(.in-lobby) .controls button {
    font-size: clamp(.68rem, 2.2dvh, 1.05rem);
    min-height: clamp(1.9rem, 7.5dvh, 3rem);
    padding: clamp(.14rem, .5dvh, .42rem) clamp(.22rem, .8vw, .62rem);
  }
}

@media (orientation: landscape) and (max-height: 430px) {
  :root {
    --phone-topbar-h: clamp(1.95rem, 7.1dvh, 2.55rem);
    --phone-actions-h: clamp(2.3rem, 9.4dvh, 3.05rem);
  }

  body:not(.in-lobby) .game-shell {
    gap: .12rem;
    padding-top: max(.12rem, env(safe-area-inset-top));
  }

  body:not(.in-lobby) .top-bar {
    box-shadow: 0 8px 22px rgba(0,0,0,.28), inset 0 1px rgba(255,255,255,.1);
    gap: .24rem;
    height: var(--phone-topbar-h);
    padding: .1rem .28rem;
  }

  body:not(.in-lobby) .top-bar h1 {
    font-size: clamp(.66rem, 2dvh, .92rem);
  }

  body:not(.in-lobby) .top-bar .eyebrow {
    font-size: clamp(.36rem, 1.2dvh, .48rem);
    margin: 0;
  }

  body:not(.in-lobby) .score-strip {
    gap: .12rem;
    max-width: 67vw;
  }

  body:not(.in-lobby) .score-strip span,
  body:not(.in-lobby) .score-strip button {
    font-size: clamp(.4rem, 1.25dvh, .54rem);
    min-height: clamp(.98rem, 3.5dvh, 1.28rem);
    padding: .07rem .2rem;
  }

  body:not(.in-lobby) .table-scene {
    height: calc(100dvh - var(--phone-topbar-h) - var(--phone-actions-h) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - .22rem);
    max-height: calc(100dvh - var(--phone-topbar-h) - var(--phone-actions-h) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - .22rem);
  }

  body:not(.in-lobby) .poker-table {
    height: min(43dvh, 51%);
    top: 50.5%;
    width: min(84vw, 84%);
  }

  body:not(.in-lobby) .seat,
  body:not(.in-lobby) .seat-open {
    gap: .05rem;
    min-width: min(11.2vw, 3.25rem);
  }

  body:not(.in-lobby) .seat-select-button {
    box-shadow: 0 0 0 2px rgba(39,231,255,.12), 0 8px 18px rgba(0,0,0,.34), 0 0 16px rgba(39,231,255,.24);
    gap: .04rem;
    min-height: min(9dvh, 3.3rem);
    min-width: min(17.2vw, 7.1rem);
    padding: .36rem .64rem;
    transform: scale(.88);
  }

  body:not(.in-lobby) .seat-select-button span {
    font-size: min(1.35vw, .58rem);
  }

  body:not(.in-lobby) .seat-select-button strong {
    font-size: min(2.15vw, .9rem);
  }

  body:not(.in-lobby) .player-nameplate {
    min-width: min(10.4vw, 3.15rem);
    padding: .06rem .16rem;
  }

  body:not(.in-lobby) .player-nameplate strong {
    font-size: min(1.35vw, .46rem);
  }

  body:not(.in-lobby) .player-nameplate span {
    font-size: min(1.18vw, .4rem);
  }

  body:not(.in-lobby) .status-pill,
  body:not(.in-lobby) .hand-readout,
  body:not(.in-lobby) .action-pop {
    font-size: min(1.15vw, .38rem);
    padding: .045rem .14rem;
  }

  body:not(.in-lobby) .result-banner {
    bottom: 16%;
    font-size: min(1.85vw, .62rem);
    max-width: 34vw;
    padding: .12rem .3rem;
    z-index: 40;
  }

  body:not(.in-lobby) .reveal-overlay {
    font-size: min(1.8vw, .62rem);
    max-width: 32vw;
    padding: .1rem .26rem;
    top: 10%;
  }

  body:not(.in-lobby) .pot-stack {
    bottom: 27%;
    transform: translateX(-50%) scale(.6);
  }

  body:not(.in-lobby) .action-panel {
    min-height: var(--phone-actions-h);
    padding:
      .13rem
      max(.28rem, env(safe-area-inset-right))
      max(.16rem, env(safe-area-inset-bottom))
      max(.28rem, env(safe-area-inset-left));
  }

  body:not(.in-lobby) .controls {
    gap: .16rem;
  }

  body:not(.in-lobby) .controls button {
    font-size: min(2.05vw, .64rem);
    min-height: clamp(1.7rem, 7.6dvh, 2.1rem);
    padding: .12rem .18rem;
  }
}

@media (orientation: landscape) and (max-height: 620px) {
  body:not(.in-lobby) {
    --mobile-topbar: clamp(2rem, 8dvh, 3.15rem);
    --mobile-actions: clamp(2.55rem, 10dvh, 4rem);
  }

  body:not(.in-lobby) .game-shell {
    box-sizing: border-box;
    height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    max-height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    width: calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right) - .56rem);
  }

  body:not(.in-lobby) .table-scene {
    height: calc(100dvh - var(--mobile-topbar) - var(--mobile-actions) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - clamp(.5rem, 1.2dvh, .9rem));
    max-height: calc(100dvh - var(--mobile-topbar) - var(--mobile-actions) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - clamp(.5rem, 1.2dvh, .9rem));
  }

  body:not(.in-lobby) .winner-banner {
    display: none;
    font-size: clamp(.76rem, 2.7dvh, 1.35rem);
    left: 50%;
    max-width: min(72vw, 30rem);
    min-width: min(18rem, 68vw);
    padding: clamp(.35rem, 1.2dvh, .8rem) clamp(.55rem, 1.6vw, 1.05rem);
    position: absolute;
    top: clamp(12%, 18dvh, 24%);
    transform: translateX(-50%);
    z-index: 9999;
  }

  body:not(.in-lobby) .winner-banner.show {
    display: grid;
  }

  body:not(.in-lobby) .action-panel {
    min-height: var(--mobile-actions);
  }

  body:not(.in-lobby) .controls button {
    font-size: clamp(.68rem, 2.2dvh, 1.05rem);
    min-height: clamp(1.9rem, 7.5dvh, 3rem);
  }
}

@media (max-width: 900px), ((max-height: 620px) and (pointer: coarse)) {
  html,
  body {
    box-sizing: border-box;
    max-width: 100vw;
    min-height: 100dvh;
    overflow-x: hidden;
    width: 100vw;
  }

  *,
  *::before,
  *::after {
    box-sizing: inherit;
  }

  body.in-lobby {
    min-height: 100dvh;
    overflow: hidden;
  }

  .lobby-screen {
    --lobby-gap: clamp(.35rem, 1.4dvh, .75rem);
    gap: var(--lobby-gap);
    height: 100dvh;
    max-height: 100dvh;
    max-width: 100vw;
    overflow: auto;
    padding:
      max(.45rem, env(safe-area-inset-top))
      max(.45rem, env(safe-area-inset-right))
      max(.45rem, env(safe-area-inset-bottom))
      max(.45rem, env(safe-area-inset-left));
    width: 100vw;
  }

  .lobby-top {
    align-items: center;
    border-radius: 7px;
    display: grid;
    gap: clamp(.28rem, 1dvh, .6rem);
    grid-template-columns: minmax(0, 1fr) auto;
    padding: clamp(.42rem, 1.2dvh, .75rem);
  }

  .lobby-top h1 {
    font-size: clamp(1rem, 4.4vw, 1.7rem);
    line-height: 1.02;
  }

  .lobby-top .eyebrow,
  .featured-copy .eyebrow {
    font-size: clamp(.48rem, 1.65vw, .72rem);
    margin-bottom: .08rem;
  }

  .lobby-stats {
    gap: clamp(.16rem, .7vw, .36rem);
    grid-column: 1 / -1;
    justify-content: flex-start;
  }

  .lobby-stats span {
    font-size: clamp(.54rem, 1.75vw, .7rem);
    padding: clamp(.16rem, .45dvh, .28rem) clamp(.28rem, .9vw, .5rem);
  }

  .lobby-top > .gold-button {
    font-size: clamp(.62rem, 1.9vw, .8rem);
    min-height: clamp(1.85rem, 5.8dvh, 2.55rem);
    padding: .28rem .55rem;
  }

  .featured-table {
    border-radius: 7px;
    gap: clamp(.4rem, 1.1dvh, .8rem);
    grid-template-columns: minmax(0, 1fr) minmax(8rem, .45fr);
    min-height: 0;
    padding: clamp(.48rem, 1.35dvh, .8rem);
  }

  .featured-copy h2 {
    font-size: clamp(.9rem, 3.3vw, 1.35rem);
    line-height: 1.05;
    margin: .08rem 0;
  }

  .featured-copy p:not(.eyebrow) {
    font-size: clamp(.58rem, 1.75vw, .78rem);
    margin: .18rem 0 .35rem;
  }

  .featured-copy button,
  .table-card button,
  .create-table-panel button {
    font-size: clamp(.62rem, 1.8vw, .78rem);
    min-height: clamp(1.85rem, 5.4dvh, 2.45rem);
    padding: .28rem .5rem;
  }

  .featured-visual {
    min-height: clamp(5rem, 20dvh, 8rem);
  }

  .mini-table {
    border-width: clamp(.42rem, 1.7vw, .75rem);
    height: min(100%, 24dvh);
    min-height: 4.5rem;
    width: 100%;
  }

  .mini-table i {
    height: clamp(1.35rem, 6dvh, 2.4rem);
    width: clamp(.9rem, 4dvh, 1.55rem);
  }

  .mini-table span {
    bottom: -.5rem;
    font-size: clamp(.52rem, 1.65vw, .72rem);
    padding: .18rem .38rem;
  }

  .lobby-grid {
    gap: var(--lobby-gap);
    grid-template-columns: minmax(0, 1fr);
  }

  .lobby-panel {
    border-radius: 7px;
    gap: clamp(.35rem, .9dvh, .62rem);
    padding: clamp(.48rem, 1.25dvh, .75rem);
  }

  .lobby-section-head strong,
  .create-table-panel strong {
    font-size: clamp(.62rem, 1.8vw, .78rem);
  }

  .lobby-section-head span,
  .create-table-head span {
    font-size: clamp(.52rem, 1.55vw, .68rem);
  }

  .table-card {
    border-radius: 7px;
    gap: clamp(.32rem, .9vw, .58rem);
    grid-template-columns: clamp(2.4rem, 8vw, 3.4rem) minmax(0, 1fr) auto;
    min-height: 0;
    padding: clamp(.38rem, 1dvh, .62rem);
  }

  .table-icon {
    height: clamp(2.35rem, 8dvh, 3.25rem);
    width: clamp(2.35rem, 8dvh, 3.25rem);
  }

  .table-card b {
    font-size: clamp(.72rem, 2.35vw, .95rem);
    line-height: 1.08;
  }

  .table-card span,
  .table-meta span {
    font-size: clamp(.5rem, 1.55vw, .68rem);
  }

  .table-meta {
    gap: .22rem;
  }

  .create-table-panel {
    position: static;
  }

  .create-table-panel label {
    font-size: clamp(.58rem, 1.65vw, .74rem);
    gap: .22rem;
  }

  .create-table-panel input,
  .create-table-panel select {
    min-height: clamp(1.8rem, 5.4dvh, 2.35rem);
    padding: .28rem .42rem;
  }

  .create-perks {
    gap: .22rem;
  }

  .create-perks span {
    font-size: clamp(.48rem, 1.45vw, .64rem);
    padding: .16rem .3rem;
  }
}

@media (orientation: portrait) and (max-width: 600px) {
  .lobby-screen {
    align-content: start;
  }

  .featured-table {
    grid-template-columns: minmax(0, 1fr);
  }

  .featured-visual {
    min-height: clamp(4.8rem, 16dvh, 7rem);
  }

  .table-card {
    grid-template-columns: clamp(2.25rem, 10vw, 3rem) minmax(0, 1fr);
  }

  .table-card .table-meta,
  .table-card button {
    grid-column: 1 / -1;
  }
}

@media (orientation: landscape) and (max-height: 520px) {
  body.in-lobby {
    overflow: hidden;
  }

  .lobby-screen {
    align-content: start;
    grid-template-rows: auto auto minmax(0, 1fr);
    overflow: hidden;
  }

  .lobby-top {
    grid-template-columns: minmax(8rem, 1fr) minmax(0, 1.45fr) auto;
  }

  .lobby-stats {
    grid-column: auto;
    justify-content: center;
  }

  .featured-table {
    grid-template-columns: minmax(0, 1fr) minmax(7rem, .34fr);
  }

  .featured-visual {
    min-height: clamp(4.2rem, 18dvh, 6.6rem);
  }

  .lobby-grid {
    min-height: 0;
    overflow: hidden;
  }

  .table-browser {
    min-height: 0;
    overflow: auto;
  }

  .create-table-panel {
    display: none;
  }
}

@media (orientation: landscape) and (max-height: 430px) {
  .featured-copy p:not(.eyebrow),
  .featured-visual,
  .table-meta span:nth-child(3) {
    display: none;
  }

  .lobby-top h1 {
    font-size: clamp(.82rem, 3.2dvh, 1.15rem);
  }

  .lobby-stats span {
    font-size: clamp(.46rem, 1.55dvh, .58rem);
  }

  .featured-table,
  .lobby-panel {
    padding: clamp(.34rem, 1dvh, .55rem);
  }

  .table-card {
    padding: clamp(.28rem, .8dvh, .45rem);
  }
}

/* Universal layout split:
   - Lobby remains a normal responsive page.
   - Game table uses one fixed design canvas scaled by app.js to the visible viewport. */
html,
body {
  height: 100%;
  width: 100%;
}

body {
  overflow-x: hidden;
}

body.in-lobby {
  min-height: 100dvh;
  overflow-y: auto;
}

body:not(.in-lobby) {
  height: 100dvh;
  overflow: hidden;
  padding: 0;
}

body.in-lobby .app-viewport {
  display: none;
  pointer-events: none !important;
}

body:not(.in-lobby) .app-viewport {
  display: block;
}

.app-viewport {
  background: #050b18;
  height: 100dvh;
  inset: 0;
  overflow: hidden;
  padding:
    env(safe-area-inset-top)
    env(safe-area-inset-right)
    env(safe-area-inset-bottom)
    env(safe-area-inset-left);
  position: fixed;
  width: 100vw;
  z-index: 1;
}

.game-stage {
  height: 900px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%) scale(1);
  transform-origin: center center;
  width: 1600px;
}

body:not(.in-lobby) .game-stage .game-shell {
  box-sizing: border-box;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 70px minmax(0, 1fr);
  grid-template-areas:
    "top"
    "table";
  height: 900px;
  max-height: none;
  min-height: 0;
  overflow: hidden;
  padding: 16px 16px 112px;
  width: 1600px;
}

body:not(.in-lobby) .game-stage .top-bar {
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: 1rem;
  grid-area: top;
  height: 70px;
  justify-content: space-between;
  min-height: 0;
  overflow: visible;
  padding: .85rem 1rem;
}

body:not(.in-lobby) .game-stage .top-bar h1 {
  font-size: 2.15rem;
  line-height: 1;
}

body:not(.in-lobby) .game-stage .top-bar .eyebrow {
  font-size: .78rem;
  margin: 0 0 .2rem;
}

body:not(.in-lobby) .game-stage .score-strip {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  justify-content: flex-end;
  max-width: 1020px;
}

body:not(.in-lobby) .game-stage .score-strip span,
body:not(.in-lobby) .game-stage .score-strip button {
  font-size: .92rem;
  min-height: 2.35rem;
  padding: .5rem .75rem;
}

body:not(.in-lobby) .game-stage .table-scene {
  aspect-ratio: auto;
  grid-area: table;
  height: 702px;
  max-height: none;
  min-height: 0;
  overflow: hidden;
  position: relative;
  transform: none;
  width: 100%;
}

body:not(.in-lobby) .game-stage .poker-table {
  height: 52%;
  left: 50%;
  max-height: none;
  max-width: none;
  min-height: 0;
  position: absolute;
  top: 49%;
  transform: translate(-50%, -50%);
  width: 76%;
}

body:not(.in-lobby) .game-stage .community {
  gap: .88rem;
  left: 50%;
  min-height: 11.9rem;
  position: absolute;
  top: 44%;
  transform: translate(-50%, -50%);
}

body:not(.in-lobby) .game-stage .community .card {
  font-size: 1.86rem;
  height: 10.71rem;
  width: 7.43rem;
}

body:not(.in-lobby) .game-stage .hole-cards .card {
  font-size: 2.47rem;
  height: 9.05rem;
  width: 6.06rem;
}

body:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card {
  height: 9.91rem;
  width: 6.67rem;
}

body:not(.in-lobby) .game-stage .seat {
  gap: .22rem;
  min-width: 8.2rem;
  position: absolute;
}

body:not(.in-lobby) .game-stage .seat-bottom {
  bottom: 8%;
  left: 50%;
  transform: translateX(-50%);
}

body:not(.in-lobby) .game-stage .seat-left-lower {
  left: 1%;
  top: 58%;
  transform: translateY(-50%);
}

body:not(.in-lobby) .game-stage .seat-left-upper {
  left: 1%;
  top: 30%;
  transform: translateY(-50%);
}

body:not(.in-lobby) .game-stage .seat-top-left {
  left: 25%;
  top: 3%;
  transform: translateX(-50%);
}

body:not(.in-lobby) .game-stage .seat-top {
  left: 50%;
  top: 1%;
  transform: translateX(-50%);
}

body:not(.in-lobby) .game-stage .seat-top-right {
  right: 25%;
  top: 3%;
  transform: translateX(50%);
}

body:not(.in-lobby) .game-stage .seat-right-upper {
  right: 1%;
  top: 30%;
  transform: translateY(-50%);
}

body:not(.in-lobby) .game-stage .seat-right-lower {
  right: 1%;
  top: 58%;
  transform: translateY(-50%);
}

body:not(.in-lobby) .game-stage .seat-bottom-right {
  bottom: 3%;
  right: 19%;
  transform: none;
}

body:not(.in-lobby) .game-stage .seat-bottom-left {
  bottom: 3%;
  left: 19%;
  transform: none;
}

body:not(.in-lobby) .game-stage .player-nameplate {
  min-width: 5.15rem;
  padding: .24rem .3rem;
}

body:not(.in-lobby) .game-stage .player-avatar {
  height: 3.15rem;
  width: 3.15rem;
}

body:not(.in-lobby) .game-stage .seat-timer {
  height: 4.1rem;
  width: 4.1rem;
}

body:not(.in-lobby) .game-stage .pot-display {
  font-size: 1.25rem;
  left: 50%;
  top: 55%;
  transform: translate(-50%, -50%);
}

body:not(.in-lobby) .game-stage .winner-banner {
  left: 50%;
  max-height: 520px;
  max-width: 540px;
  overflow-y: auto;
  position: absolute;
  top: 30%;
  transform: translate(-50%, -50%);
  z-index: 9999;
}

body:not(.in-lobby) .game-stage .reveal-banner {
  left: 50%;
  max-width: 420px;
  padding: .9rem 1.2rem;
  position: absolute;
  top: 24%;
  transform: translate(-50%, -50%);
  z-index: 9998;
}

body:not(.in-lobby) .game-stage .odds-panel {
  bottom: 5.85rem;
  left: 1rem;
  max-height: none;
  max-width: 18rem;
  position: absolute;
  transform: none;
  z-index: 14;
}

body:not(.in-lobby) .game-stage .action-panel {
  bottom: 0;
  display: flex;
  left: 0;
  min-height: 96px;
  padding: .7rem 1rem .85rem;
  position: absolute;
  right: 0;
  top: auto;
  z-index: 30;
}

body:not(.in-lobby) .game-stage .controls {
  gap: 1rem;
  max-width: 820px;
  width: 820px;
}

body:not(.in-lobby) .game-stage .controls button {
  font-size: 1.28rem;
  min-height: 4rem;
  padding: .6rem 1rem;
}

body:not(.in-lobby) .game-stage .bet-sheet {
  bottom: 6.3rem;
  left: 50%;
  max-height: 21rem;
  max-width: 30rem;
  position: absolute;
  right: auto;
  top: auto;
  transform: translateX(-50%);
  width: 30rem;
  z-index: 40;
}

body:not(.in-lobby) .game-stage .message-log {
  max-height: 6.2rem;
}

@media (orientation: portrait) and (max-width: 767px) {
  body:not(.in-lobby) .rotate-phone-message {
    display: grid;
  }
}

/* Final game-screen lock: lobby can scroll, poker table cannot pan or drift. */
html {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}

body:not(.in-lobby) {
  height: 100%;
  inset: 0;
  margin: 0;
  overflow: hidden;
  overscroll-behavior: none;
  padding: 0;
  position: fixed;
  touch-action: none;
  width: 100%;
}

body:not(.in-lobby) .game-viewport,
body:not(.in-lobby) .app-viewport {
  background: #050b18;
  height: 100dvh;
  inset: 0;
  overflow: hidden;
  padding: 0;
  position: fixed;
  touch-action: none;
  width: 100vw;
}

body:not(.in-lobby) .game-stage {
  height: 900px;
  left: 50%;
  max-height: none;
  max-width: none;
  overflow: visible;
  position: fixed;
  top: 50%;
  transform-origin: center center;
  width: 1600px;
  will-change: transform;
}

body.in-lobby {
  position: static;
  touch-action: auto;
}

/* Responsive table-screen rebuild: no full-page canvas scaling. */
html,
body {
  margin: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}

body.in-lobby {
  height: auto;
  min-height: 100dvh;
  overflow-y: auto;
  position: static;
  touch-action: auto;
}

body:not(.in-lobby) {
  inset: 0;
  overflow: hidden;
  position: fixed;
  touch-action: none;
}

body:not(.in-lobby) .game-viewport,
body:not(.in-lobby) .app-viewport {
  background: #050b18;
  display: block;
  height: 100dvh;
  inset: 0;
  overflow: hidden;
  padding: 0;
  position: fixed;
  touch-action: manipulation;
  width: 100vw;
}

body:not(.in-lobby) .game-stage {
  height: 100%;
  inset: 0;
  left: auto;
  overflow: hidden;
  position: absolute;
  top: auto;
  transform: none !important;
  width: 100%;
  will-change: auto;
}

body:not(.in-lobby) .game-stage .game-shell {
  display: grid;
  gap: clamp(4px, .8dvh, 10px);
  grid-template-areas:
    "top"
    "table";
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: clamp(44px, 9dvh, 64px) minmax(0, 1fr);
  height: 100dvh;
  max-height: 100dvh;
  overflow: hidden;
  padding:
    max(4px, env(safe-area-inset-top))
    max(8px, env(safe-area-inset-right))
    calc(clamp(58px, 14dvh, 86px) + max(6px, env(safe-area-inset-bottom)))
    max(8px, env(safe-area-inset-left));
  width: 100vw;
}

body:not(.in-lobby) .game-stage .top-bar {
  align-items: center;
  display: flex;
  flex-direction: row;
  gap: clamp(6px, 1vw, 14px);
  grid-area: top;
  height: clamp(44px, 9dvh, 64px);
  justify-content: space-between;
  min-height: 0;
  overflow: visible;
  padding: clamp(4px, 1dvh, 8px) clamp(8px, 1.2vw, 14px);
}

body:not(.in-lobby) .game-stage .top-bar h1 {
  font-size: clamp(16px, 2.6vw, 28px);
  line-height: 1;
}

body:not(.in-lobby) .game-stage .top-bar .eyebrow {
  font-size: clamp(8px, 1.2vw, 12px);
  margin: 0 0 2px;
}

body:not(.in-lobby) .game-stage .score-strip {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  gap: clamp(4px, .7vw, 9px);
  justify-content: flex-end;
  max-width: 72vw;
  overflow: visible;
}

body:not(.in-lobby) .game-stage .score-strip span,
body:not(.in-lobby) .game-stage .score-strip button {
  font-size: clamp(9px, 1.35vw, 14px);
  min-height: clamp(26px, 5.8dvh, 38px);
  padding: clamp(3px, .7dvh, 7px) clamp(6px, .9vw, 11px);
  white-space: nowrap;
  z-index: 60000;
}

body.flyout-open:not(.in-lobby) .game-stage .top-bar {
  overflow: visible;
}

body:not(.in-lobby) .game-stage .score-strip button {
  pointer-events: auto;
  position: relative;
  touch-action: manipulation;
  z-index: 60010;
}

body:not(.in-lobby) .game-stage .flyout {
  pointer-events: auto;
  touch-action: pan-y;
  z-index: 60020;
}

body:not(.in-lobby) .game-stage .table-scene,
body:not(.in-lobby) .game-stage .poker-table {
  overscroll-behavior: none;
  touch-action: manipulation;
}

body:not(.in-lobby) .game-stage .table-scene {
  aspect-ratio: auto;
  grid-area: table;
  height: 100%;
  max-height: none;
  min-height: 0;
  overflow: hidden;
  position: relative;
  transform: none;
  width: 100%;
}

body:not(.in-lobby) .game-stage .poker-table {
  height: min(52dvh, 360px);
  left: 50%;
  max-height: none;
  max-width: none;
  min-height: 0;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(92vw, 1300px);
}

body:not(.in-lobby) .game-stage .community {
  gap: clamp(4px, .8vw, 12px);
  left: 50%;
  min-height: clamp(56px, 19dvh, 118px);
  position: absolute;
  top: 43%;
  transform: translate(-50%, -50%);
}

body:not(.in-lobby) .game-stage .community .card {
  font-size: clamp(18px, 3.2vw, 36px);
  height: clamp(76px, 22dvh, 136px);
  width: clamp(52px, 7.6vw, 94px);
}

body:not(.in-lobby) .game-stage .hole-cards {
  gap: clamp(2px, .45vw, 8px);
  min-height: clamp(42px, 14dvh, 96px);
}

body:not(.in-lobby) .game-stage .hole-cards .card {
  font-size: clamp(14px, 2.2vw, 28px);
  height: clamp(48px, 14.5dvh, 100px);
  width: clamp(34px, 5vw, 68px);
}

body:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card {
  height: clamp(58px, 16dvh, 112px);
  width: clamp(40px, 5.8vw, 76px);
}

body:not(.in-lobby) .game-stage .card .corner {
  font-size: clamp(11px, 1.6vw, 20px);
}

body:not(.in-lobby) .game-stage .card .corner small {
  font-size: .78em;
}

body:not(.in-lobby) .game-stage .card .pips {
  font-size: clamp(16px, 2.5vw, 32px);
}

body:not(.in-lobby) .game-stage .card .pips-1 i:nth-child(1) {
  font-size: clamp(26px, 4vw, 52px);
}

body:not(.in-lobby) .game-stage .community .card .corner {
  font-size: clamp(14px, 2vw, 25px);
}

body:not(.in-lobby) .game-stage .community .card .pips {
  font-size: clamp(22px, 3.4vw, 42px);
}

body:not(.in-lobby) .game-stage .seat {
  gap: clamp(1px, .25dvh, 4px);
  min-width: clamp(70px, 9vw, 120px);
  position: absolute;
}

body:not(.in-lobby) .game-stage .seat-bottom {
  bottom: 7%;
  left: 50%;
  transform: translateX(-50%);
}

body:not(.in-lobby) .game-stage .seat-left-lower {
  left: 1.2%;
  top: 58%;
  transform: translateY(-50%);
}

body:not(.in-lobby) .game-stage .seat-left-upper {
  left: 1.2%;
  top: 29%;
  transform: translateY(-50%);
}

body:not(.in-lobby) .game-stage .seat-top-left {
  left: 25%;
  top: 2%;
  transform: translateX(-50%);
}

body:not(.in-lobby) .game-stage .seat-top {
  left: 50%;
  top: 0;
  transform: translateX(-50%);
}

body:not(.in-lobby) .game-stage .seat-top-right {
  right: 25%;
  top: 2%;
  transform: translateX(50%);
}

body:not(.in-lobby) .game-stage .seat-right-upper {
  right: 1.2%;
  top: 29%;
  transform: translateY(-50%);
}

body:not(.in-lobby) .game-stage .seat-right-lower {
  right: 1.2%;
  top: 58%;
  transform: translateY(-50%);
}

body:not(.in-lobby) .game-stage .seat-bottom-right {
  bottom: 2.5%;
  right: 18%;
  transform: none;
}

body:not(.in-lobby) .game-stage .seat-bottom-left {
  bottom: 2.5%;
  left: 18%;
  transform: none;
}

body:not(.in-lobby) .game-stage .player-nameplate {
  border-radius: 6px;
  min-width: clamp(62px, 8vw, 108px);
  padding: clamp(2px, .45dvh, 5px) clamp(4px, .55vw, 8px);
}

body:not(.in-lobby) .game-stage .player-nameplate strong {
  font-size: clamp(10px, 1.4vw, 16px);
}

body:not(.in-lobby) .game-stage .player-nameplate span,
body:not(.in-lobby) .game-stage .status-pill,
body:not(.in-lobby) .game-stage .hand-readout,
body:not(.in-lobby) .game-stage .action-pop {
  font-size: clamp(8px, 1.1vw, 13px);
}

body:not(.in-lobby) .game-stage .player-avatar {
  height: clamp(32px, 6dvh, 58px);
  width: clamp(32px, 6dvh, 58px);
}

body:not(.in-lobby) .game-stage .turn-timer,
body:not(.in-lobby) .game-stage .seat-timer {
  height: clamp(54px, 12dvh, 98px);
  width: clamp(54px, 12dvh, 98px);
}

body:not(.in-lobby) .game-stage .pot-stack {
  bottom: 25%;
}

body:not(.in-lobby) .game-stage .pot-stack span,
body:not(.in-lobby) .game-stage .pot-display {
  font-size: clamp(15px, 2.4vw, 28px);
}

body:not(.in-lobby) .game-stage .odds-panel {
  bottom: clamp(64px, 15dvh, 96px);
  left: max(8px, env(safe-area-inset-left));
  max-height: min(42dvh, 220px);
  max-width: clamp(150px, 24vw, 260px);
  overflow: hidden;
  position: absolute;
  transform: none;
}

body:not(.in-lobby) .game-stage .action-panel {
  bottom: 0;
  display: grid;
  gap: 0;
  height: clamp(58px, 14dvh, 86px);
  left: 0;
  min-height: 0;
  padding:
    6px
    max(10px, env(safe-area-inset-right))
    max(6px, env(safe-area-inset-bottom))
    max(10px, env(safe-area-inset-left));
  position: fixed;
  right: 0;
  top: auto;
  z-index: 60;
}

body:not(.in-lobby) .game-stage .controls {
  display: grid;
  gap: clamp(8px, 1vw, 16px);
  grid-template-columns: 1fr 1fr 1fr;
  margin: 0 auto;
  max-width: min(980px, 78vw);
  width: 100%;
}

body:not(.in-lobby) .game-stage .controls button {
  font-size: clamp(18px, 2.5vw, 30px);
  height: 100%;
  min-height: 0;
  padding: 0 clamp(8px, 1vw, 16px);
}

body:not(.in-lobby) .game-stage .controls .utility-action {
  display: none;
}

body:not(.in-lobby) .game-stage .bet-sheet,
body:not(.in-lobby) .game-stage .bet-sizing {
  bottom: calc(clamp(58px, 14dvh, 86px) + max(6px, env(safe-area-inset-bottom)));
  left: 50%;
  max-height: min(42dvh, 260px);
  max-width: min(90vw, 520px);
  overflow-y: auto;
  position: fixed;
  right: auto;
  top: auto;
  transform: translateX(-50%);
  width: min(90vw, 520px);
}

body:not(.in-lobby) .game-stage .winner-banner {
  left: 50%;
  max-height: min(72dvh, 420px);
  max-width: min(86vw, 560px);
  overflow-y: auto;
  position: absolute;
  top: 26%;
  transform: translate(-50%, -50%);
  z-index: 9999;
}

body:not(.in-lobby) .game-stage .reveal-overlay {
  left: 50%;
  max-width: min(72vw, 430px);
  padding: clamp(6px, 1.2dvh, 14px) clamp(10px, 1.4vw, 18px);
  position: absolute;
  top: 21%;
  transform: translate(-50%, -50%);
  z-index: 9998;
}

/* Turn visibility and readable action feedback. */
body:not(.in-lobby) .game-stage .turn-callout {
  align-items: center;
  background: linear-gradient(180deg, rgba(255,228,92,.98), rgba(255,159,43,.96));
  border: 1px solid rgba(255,255,255,.86);
  border-radius: 999px;
  box-shadow: 0 10px 26px rgba(0,0,0,.46), 0 0 26px rgba(255,228,92,.52);
  color: #140f08;
  display: none;
  gap: clamp(6px, .85vw, 11px);
  left: 50%;
  line-height: 1;
  padding: clamp(5px, .95dvh, 10px) clamp(10px, 1.45vw, 19px);
  position: absolute;
  text-align: center;
  text-transform: uppercase;
  top: clamp(92px, 20dvh, 150px);
  transform: translateX(-50%);
  white-space: nowrap;
  z-index: 10020;
}

body:not(.in-lobby) .game-stage .turn-callout.show {
  display: inline-flex;
}

body:not(.in-lobby) .game-stage .turn-callout strong {
  font-size: clamp(13px, 1.85vw, 23px);
  font-weight: 1000;
}

body:not(.in-lobby) .game-stage .turn-callout span {
  align-items: center;
  background: rgba(11,15,31,.92);
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  font-size: clamp(14px, 2vw, 25px);
  font-weight: 1000;
  height: clamp(24px, 4.2dvh, 38px);
  justify-content: center;
  min-width: clamp(24px, 4.2dvh, 38px);
  padding: 0 .35em;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight {
  z-index: 95;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight::before {
  animation: activeSeatPulse 1s ease-in-out infinite;
  background:
    radial-gradient(circle, rgba(255,228,92,.34), rgba(39,231,255,.2) 45%, transparent 72%);
  border: 3px solid rgba(255,228,92,.72);
  box-shadow: 0 0 30px rgba(255,228,92,.75), 0 0 48px rgba(39,231,255,.42);
  height: clamp(86px, 18dvh, 150px);
  left: 50%;
  opacity: 1;
  pointer-events: none;
  top: 50%;
  transform: translate(-50%, -50%);
  width: clamp(86px, 18dvh, 150px);
  z-index: 0;
}

@keyframes activeSeatPulse {
  50% { filter: brightness(1.25); transform: translate(-50%, -50%) scale(1.06); }
}

body:not(.in-lobby) .game-stage .turn-label {
  background: linear-gradient(180deg, #fff16b, #ffb13d);
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 999px;
  box-shadow: 0 8px 22px rgba(0,0,0,.38), 0 0 22px rgba(255,228,92,.54);
  color: #1b1207;
  display: none;
  font-size: clamp(10px, 1.45vw, 17px);
  font-weight: 1000;
  left: 50%;
  letter-spacing: 0;
  padding: clamp(3px, .6dvh, 7px) clamp(8px, 1vw, 12px);
  position: absolute;
  text-align: center;
  text-transform: uppercase;
  top: calc(-1 * clamp(20px, 4dvh, 34px));
  transform: translateX(-50%);
  white-space: nowrap;
  z-index: 125;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight .turn-label {
  display: block;
}

body:not(.in-lobby) .game-stage .turn-timer {
  background:
    radial-gradient(circle, rgba(5,12,27,.92) 0 45%, transparent 46%),
    conic-gradient(from 90deg, #ffe45c var(--timer-progress, 0%), rgba(255,255,255,.16) 0);
  box-shadow: 0 0 0 3px rgba(255,228,92,.28), 0 0 30px rgba(255,228,92,.58), inset 0 0 18px rgba(255,228,92,.18);
  display: none;
  height: clamp(58px, 13dvh, 104px);
  left: 50%;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: clamp(58px, 13dvh, 104px);
  z-index: 115;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight .turn-timer {
  display: block;
}

body:not(.in-lobby) .game-stage .turn-timer span {
  align-items: center;
  background: #07101f;
  border: 2px solid rgba(255,228,92,.78);
  border-radius: 999px;
  color: #fff;
  display: flex;
  font-size: clamp(14px, 2.2vw, 26px);
  font-weight: 1000;
  height: clamp(26px, 5dvh, 44px);
  justify-content: center;
  left: 50%;
  position: absolute;
  top: calc(-1 * clamp(8px, 1.4dvh, 14px));
  transform: translateX(-50%);
  width: clamp(26px, 5dvh, 44px);
  z-index: 2;
}

body:not(.in-lobby) .game-stage .seat.timer-expired .turn-timer {
  animation: timerPulse 650ms ease-in-out infinite;
  background:
    radial-gradient(circle, rgba(5,12,27,.92) 0 45%, transparent 46%),
    conic-gradient(from 90deg, #ff4d6d 100%, rgba(255,255,255,.12) 0);
}

body:not(.in-lobby) .game-stage .action-pop {
  background: linear-gradient(180deg, #fff16b, #ff9f2f);
  border: 2px solid rgba(255,255,255,.86);
  border-radius: 999px;
  box-shadow: 0 14px 30px rgba(0,0,0,.52), 0 0 30px rgba(255,228,92,.64);
  color: #160f08;
  font-size: clamp(16px, 2.4vw, 30px);
  font-weight: 1000;
  left: 50%;
  line-height: 1;
  min-height: 0;
  opacity: 0;
  padding: clamp(6px, 1dvh, 11px) clamp(12px, 1.7vw, 24px);
  pointer-events: none;
  position: absolute;
  text-align: center;
  text-transform: uppercase;
  top: calc(-1 * clamp(48px, 9dvh, 78px));
  transform: translate(-50%, 8px) scale(.92);
  transition: opacity 140ms ease, transform 140ms ease;
  white-space: nowrap;
  z-index: 10030;
}

body:not(.in-lobby) .game-stage .action-pop:not(:empty) {
  opacity: 1;
  transform: translate(-50%, 0) scale(1);
}

body:not(.in-lobby) .game-stage .action-pop::after {
  border-left: clamp(5px, .7vw, 8px) solid transparent;
  border-right: clamp(5px, .7vw, 8px) solid transparent;
  border-top: clamp(6px, .8vw, 10px) solid #ff9f2f;
  bottom: calc(-1 * clamp(5px, .7vw, 8px));
}

/* Focus the table on large action popups, active highlight, and timer only. */
body:not(.in-lobby) .game-stage .status-pill {
  display: none !important;
}

body:not(.in-lobby) .game-stage .turn-callout {
  top: clamp(92px, 20dvh, 150px);
}

body:not(.in-lobby) .game-stage .reveal-overlay {
  top: 29%;
}

body:not(.in-lobby) .game-stage .winner-banner {
  top: 22%;
  z-index: 10040;
}

body:not(.in-lobby) .game-stage .hole-cards:has(.revealed) {
  gap: clamp(8px, 1vw, 16px);
}

body:not(.in-lobby) .game-stage .hole-cards .card.revealed {
  animation: none;
  transform: none !important;
  z-index: 8;
}

body:not(.in-lobby) .game-stage .hole-cards .card.back {
  z-index: 7;
}

/* Keep turn/action popups inside the visible table area. */
body:not(.in-lobby) .game-stage .seat-top-left .action-pop,
body:not(.in-lobby) .game-stage .seat-top .action-pop,
body:not(.in-lobby) .game-stage .seat-top-right .action-pop,
body:not(.in-lobby) .game-stage .seat-left-upper .action-pop,
body:not(.in-lobby) .game-stage .seat-right-upper .action-pop {
  bottom: calc(-1 * clamp(50px, 10dvh, 84px));
  top: auto;
}

body:not(.in-lobby) .game-stage .seat-top-left .action-pop::after,
body:not(.in-lobby) .game-stage .seat-top .action-pop::after,
body:not(.in-lobby) .game-stage .seat-top-right .action-pop::after,
body:not(.in-lobby) .game-stage .seat-left-upper .action-pop::after,
body:not(.in-lobby) .game-stage .seat-right-upper .action-pop::after {
  border-bottom: clamp(6px, .8vw, 10px) solid #fff16b;
  border-top: 0;
  bottom: auto;
  top: calc(-1 * clamp(5px, .7vw, 8px));
}

body:not(.in-lobby) .game-stage .seat-top-left .turn-label,
body:not(.in-lobby) .game-stage .seat-top .turn-label,
body:not(.in-lobby) .game-stage .seat-top-right .turn-label,
body:not(.in-lobby) .game-stage .seat-left-upper .turn-label,
body:not(.in-lobby) .game-stage .seat-right-upper .turn-label {
  bottom: calc(-1 * clamp(22px, 4.5dvh, 38px));
  top: auto;
}

body:not(.in-lobby) .game-stage .seat-left-lower .action-pop,
body:not(.in-lobby) .game-stage .seat-left-upper .action-pop,
body:not(.in-lobby) .game-stage .seat-left-lower .turn-label,
body:not(.in-lobby) .game-stage .seat-left-upper .turn-label {
  left: 0;
  transform: translate(0, 8px) scale(.92);
}

body:not(.in-lobby) .game-stage .seat-left-lower .action-pop:not(:empty),
body:not(.in-lobby) .game-stage .seat-left-upper .action-pop:not(:empty) {
  transform: translate(0, 0) scale(1);
}

body:not(.in-lobby) .game-stage .seat-right-lower .action-pop,
body:not(.in-lobby) .game-stage .seat-right-upper .action-pop,
body:not(.in-lobby) .game-stage .seat-right-lower .turn-label,
body:not(.in-lobby) .game-stage .seat-right-upper .turn-label {
  left: auto;
  right: 0;
  transform: translate(0, 8px) scale(.92);
}

body:not(.in-lobby) .game-stage .seat-right-lower .action-pop:not(:empty),
body:not(.in-lobby) .game-stage .seat-right-upper .action-pop:not(:empty) {
  transform: translate(0, 0) scale(1);
}

body:not(.in-lobby) .game-stage .seat-left-lower .turn-label,
body:not(.in-lobby) .game-stage .seat-left-upper .turn-label,
body:not(.in-lobby) .game-stage .seat-right-lower .turn-label,
body:not(.in-lobby) .game-stage .seat-right-upper .turn-label {
  max-width: min(38vw, 260px);
}

/* Clip all card artwork inside card borders. */
.card,
.playing-card,
.card-face,
.card .face,
.card .pips,
.card .face-card {
  overflow: hidden;
}

.card {
  contain: paint;
  overflow: hidden !important;
}

.card *,
.playing-card *,
.card-face * {
  max-height: 100%;
  max-width: 100%;
}

.card .face {
  inset: 18% 13% 14%;
}

.card .pips {
  align-items: center;
  font-size: clamp(1rem, 28%, 2.65rem);
  gap: 0;
  grid-template-rows: repeat(4, minmax(0, 1fr));
  justify-items: center;
  line-height: .82;
}

.card .pips i {
  line-height: .82;
  max-height: 1em;
  overflow: hidden;
}

.card .pips-1 i:nth-child(1) {
  font-size: 1.7em;
}

.card .pips-9,
.card .pips-10 {
  font-size: clamp(.78rem, 22%, 1.92rem);
}

body:not(.in-lobby) .game-stage .community .card .pips {
  font-size: clamp(18px, 2.7vw, 34px);
}

body:not(.in-lobby) .game-stage .community .card .pips-9,
body:not(.in-lobby) .game-stage .community .card .pips-10 {
  font-size: clamp(14px, 2.15vw, 26px);
}

body:not(.in-lobby) .game-stage .hole-cards .card .pips {
  font-size: clamp(13px, 2vw, 25px);
}

body:not(.in-lobby) .game-stage .hole-cards .card .pips-9,
body:not(.in-lobby) .game-stage .hole-cards .card .pips-10 {
  font-size: clamp(11px, 1.6vw, 20px);
}

/* Mobile-friendly bet slider touch target. */
.bet-sizing input[type="range"],
body:not(.in-lobby) .game-stage .bet-sizing input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  background: transparent;
  cursor: pointer;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0;
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  width: 100%;
}

.bet-sizing input[type="range"]::-webkit-slider-runnable-track,
body:not(.in-lobby) .game-stage .bet-sizing input[type="range"]::-webkit-slider-runnable-track {
  background: linear-gradient(90deg, var(--gold), var(--felt-light));
  border-radius: 999px;
  height: 10px;
}

.bet-sizing input[type="range"]::-webkit-slider-thumb,
body:not(.in-lobby) .game-stage .bet-sizing input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  background:
    radial-gradient(circle at 35% 28%, #fff 0 13%, transparent 14%),
    linear-gradient(180deg, #fff16b, #ff9f2f);
  border: 3px solid #fff;
  border-radius: 50%;
  box-shadow: 0 6px 18px rgba(0,0,0,.45), 0 0 0 8px rgba(255,228,92,.2);
  cursor: pointer;
  height: 44px;
  margin-top: -17px;
  width: 44px;
}

.bet-sizing input[type="range"]::-moz-range-track,
body:not(.in-lobby) .game-stage .bet-sizing input[type="range"]::-moz-range-track {
  background: linear-gradient(90deg, var(--gold), var(--felt-light));
  border: 0;
  border-radius: 999px;
  height: 10px;
}

.bet-sizing input[type="range"]::-moz-range-thumb,
body:not(.in-lobby) .game-stage .bet-sizing input[type="range"]::-moz-range-thumb {
  background: linear-gradient(180deg, #fff16b, #ff9f2f);
  border: 3px solid #fff;
  border-radius: 50%;
  box-shadow: 0 6px 18px rgba(0,0,0,.45), 0 0 0 8px rgba(255,228,92,.2);
  cursor: pointer;
  height: 44px;
  width: 44px;
}

.bet-sizing,
body:not(.in-lobby) .game-stage .bet-sizing {
  touch-action: none;
}

/* Keep the countdown badge off cards and player nameplates. */
body:not(.in-lobby) .game-stage .seat-left-lower .turn-timer,
body:not(.in-lobby) .game-stage .seat-left-upper .turn-timer {
  left: 100%;
  top: 50%;
  transform: translate(10px, -50%);
}

body:not(.in-lobby) .game-stage .seat-right-lower .turn-timer,
body:not(.in-lobby) .game-stage .seat-right-upper .turn-timer {
  left: auto;
  right: 100%;
  top: 50%;
  transform: translate(-10px, -50%);
}

body:not(.in-lobby) .game-stage .seat-top-left .turn-timer,
body:not(.in-lobby) .game-stage .seat-top .turn-timer,
body:not(.in-lobby) .game-stage .seat-top-right .turn-timer {
  left: 50%;
  top: 100%;
  transform: translate(-50%, 8px);
}

body:not(.in-lobby) .game-stage .seat-bottom-left .turn-timer,
body:not(.in-lobby) .game-stage .seat-bottom .turn-timer,
body:not(.in-lobby) .game-stage .seat-bottom-right .turn-timer {
  left: 50%;
  top: auto;
  bottom: 100%;
  transform: translate(-50%, -8px);
}

body:not(.in-lobby) .game-stage .seat-left-lower .turn-timer span,
body:not(.in-lobby) .game-stage .seat-left-upper .turn-timer span,
body:not(.in-lobby) .game-stage .seat-right-lower .turn-timer span,
body:not(.in-lobby) .game-stage .seat-right-upper .turn-timer span {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

/* Universal responsive table system.
   Final override layer: one viewport-driven table layout, no device-specific scaling. */
html,
body {
  max-width: 100%;
  overscroll-behavior: none;
  width: 100%;
}

body:not(.in-lobby),
body:not(.in-lobby) .app-viewport,
body:not(.in-lobby) .game-viewport {
  height: 100dvh;
  inset: 0;
  max-height: 100dvh;
  overflow: hidden !important;
  position: fixed;
  touch-action: none;
  width: 100vw;
}

body:not(.in-lobby) .game-viewport {
  --actions-h: clamp(48px, 12dvh, 86px);
  --safe-bottom: env(safe-area-inset-bottom);
  --safe-left: env(safe-area-inset-left);
  --safe-right: env(safe-area-inset-right);
  --safe-top: env(safe-area-inset-top);
  --topbar-h: clamp(36px, 8dvh, 64px);
  padding: var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);
}

body:not(.in-lobby) .game-stage {
  height: 100%;
  inset: 0;
  left: auto;
  max-height: 100%;
  max-width: 100%;
  overflow: hidden;
  position: relative;
  top: auto;
  transform: none !important;
  transform-origin: center;
  width: 100%;
}

body:not(.in-lobby) .game-stage .game-shell {
  display: grid;
  gap: clamp(3px, .7dvh, 10px);
  grid-template-areas:
    "top"
    "table"
    "actions";
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: var(--topbar-h) minmax(0, 1fr) var(--actions-h);
  height: 100%;
  max-height: 100%;
  min-height: 0;
  overflow: hidden;
  padding: clamp(3px, .7dvh, 8px) clamp(5px, .9vw, 14px);
  width: 100%;
}

body:not(.in-lobby) .game-stage .top-bar {
  align-items: center;
  display: grid;
  gap: clamp(3px, .7vw, 10px);
  grid-area: top;
  grid-template-columns: minmax(78px, .45fr) minmax(0, 1fr);
  height: 100%;
  min-height: 0;
  overflow: hidden;
  padding: clamp(2px, .45dvh, 7px) clamp(5px, .8vw, 12px);
  white-space: nowrap;
}

body:not(.in-lobby) .game-stage .top-bar > div:first-child {
  min-width: 0;
  overflow: hidden;
}

body:not(.in-lobby) .game-stage .top-bar .eyebrow,
body:not(.in-lobby) .game-stage .top-bar h1 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body:not(.in-lobby) .game-stage .top-bar .eyebrow {
  font-size: clamp(7px, 1.1vw, 12px);
  line-height: 1;
  margin: 0 0 clamp(1px, .2dvh, 3px);
}

body:not(.in-lobby) .game-stage .top-bar h1 {
  font-size: clamp(10px, 2vw, 27px);
  line-height: 1;
}

body:not(.in-lobby) .game-stage .score-strip {
  align-items: center;
  display: flex;
  flex-wrap: nowrap;
  gap: clamp(2px, .45vw, 8px);
  justify-content: flex-end;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}

body:not(.in-lobby) .game-stage .score-strip span,
body:not(.in-lobby) .game-stage .score-strip button {
  border-radius: clamp(4px, .8vw, 8px);
  flex: 0 1 auto;
  font-size: clamp(7px, 1.25vw, 14px);
  line-height: 1;
  min-height: clamp(22px, 4.8dvh, 38px);
  min-width: 0;
  overflow: hidden;
  padding: clamp(2px, .5dvh, 7px) clamp(3px, .65vw, 10px);
  text-overflow: ellipsis;
  white-space: nowrap;
}

body:not(.in-lobby) .game-stage .table-scene {
  grid-area: table;
  height: 100%;
  max-height: 100%;
  min-height: 0;
  overflow: hidden;
  position: relative;
  width: 100%;
}

body:not(.in-lobby) .game-stage .poker-table {
  height: clamp(150px, 58dvh, 500px);
  left: 50%;
  max-height: 72%;
  max-width: 94%;
  min-height: 0;
  position: absolute;
  top: 51%;
  transform: translate(-50%, -50%);
  width: clamp(250px, 78vw, 1320px);
}

body:not(.in-lobby) .game-stage .community {
  gap: clamp(2px, .65vw, 12px);
  left: 50%;
  min-height: 0;
  position: absolute;
  top: 43%;
  transform: translate(-50%, -50%);
}

body:not(.in-lobby) .game-stage .community .card {
  font-size: clamp(15px, 3.1vw, 38px);
  height: clamp(54px, 17dvh, 142px);
  width: clamp(38px, 6.1vw, 98px);
}

body:not(.in-lobby) .game-stage .hole-cards {
  gap: clamp(1px, .35vw, 7px);
  min-height: 0;
}

body:not(.in-lobby) .game-stage .hole-cards .card {
  font-size: clamp(12px, 2.25vw, 30px);
  height: clamp(38px, 13dvh, 104px);
  width: clamp(27px, 4.7vw, 72px);
}

body:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card {
  font-size: clamp(15px, 2.7vw, 34px);
  height: clamp(46px, 15dvh, 118px);
  width: clamp(32px, 5.35vw, 82px);
}

body:not(.in-lobby) .game-stage .card .corner {
  font-size: clamp(9px, 1.65vw, 21px);
}

body:not(.in-lobby) .game-stage .community .card .corner {
  font-size: clamp(11px, 2vw, 26px);
}

body:not(.in-lobby) .game-stage .card .pips {
  font-size: clamp(13px, 2.7vw, 34px);
}

body:not(.in-lobby) .game-stage .community .card .pips {
  font-size: clamp(16px, 3.35vw, 44px);
}

body:not(.in-lobby) .game-stage .seat {
  gap: clamp(1px, .22dvh, 4px);
  max-width: clamp(62px, 12vw, 150px);
  min-width: clamp(48px, 9vw, 122px);
}

body:not(.in-lobby) .game-stage .seat-bottom {
  bottom: clamp(1%, 2.2dvh, 7%);
  left: 50%;
  transform: translateX(-50%);
}

body:not(.in-lobby) .game-stage .seat-left-lower {
  left: clamp(0px, .7vw, 12px);
  top: 61%;
  transform: translateY(-50%);
}

body:not(.in-lobby) .game-stage .seat-left-upper {
  left: clamp(0px, .7vw, 12px);
  top: 31%;
  transform: translateY(-50%);
}

body:not(.in-lobby) .game-stage .seat-top-left {
  left: 25%;
  top: clamp(0px, .5dvh, 8px);
  transform: translateX(-50%);
}

body:not(.in-lobby) .game-stage .seat-top {
  left: 50%;
  top: clamp(0px, .25dvh, 5px);
  transform: translateX(-50%);
}

body:not(.in-lobby) .game-stage .seat-top-right {
  right: 25%;
  top: clamp(0px, .5dvh, 8px);
  transform: translateX(50%);
}

body:not(.in-lobby) .game-stage .seat-right-upper {
  right: clamp(0px, .7vw, 12px);
  top: 31%;
  transform: translateY(-50%);
}

body:not(.in-lobby) .game-stage .seat-right-lower {
  right: clamp(0px, .7vw, 12px);
  top: 61%;
  transform: translateY(-50%);
}

body:not(.in-lobby) .game-stage .seat-bottom-left {
  bottom: clamp(0px, 1dvh, 12px);
  left: 18%;
  transform: none;
}

body:not(.in-lobby) .game-stage .seat-bottom-right {
  bottom: clamp(0px, 1dvh, 12px);
  right: 18%;
  transform: none;
}

body:not(.in-lobby) .game-stage .player-nameplate {
  border-radius: clamp(4px, .7vw, 7px);
  max-width: 100%;
  min-width: clamp(45px, 8.5vw, 110px);
  padding: clamp(1px, .35dvh, 5px) clamp(3px, .55vw, 8px);
}

body:not(.in-lobby) .game-stage .player-nameplate strong {
  font-size: clamp(8px, 1.35vw, 16px);
}

body:not(.in-lobby) .game-stage .player-nameplate span,
body:not(.in-lobby) .game-stage .hand-readout {
  font-size: clamp(7px, 1.05vw, 13px);
}

body:not(.in-lobby) .game-stage .turn-timer,
body:not(.in-lobby) .game-stage .seat-timer {
  height: clamp(34px, 9dvh, 96px);
  width: clamp(34px, 9dvh, 96px);
}

body:not(.in-lobby) .game-stage .turn-label,
body:not(.in-lobby) .game-stage .action-pop {
  font-size: clamp(9px, 1.45vw, 18px);
  max-width: min(42vw, 260px);
  padding: clamp(4px, .75dvh, 9px) clamp(7px, 1vw, 14px);
}

body:not(.in-lobby) .game-stage .pot-stack {
  bottom: 24%;
}

body:not(.in-lobby) .game-stage .pot-stack span,
body:not(.in-lobby) .game-stage .pot-display,
body:not(.in-lobby) .game-stage #potCenter {
  font-size: clamp(13px, 2.4vw, 30px);
  white-space: nowrap;
}

body:not(.in-lobby) .game-stage .odds-panel {
  bottom: calc(var(--actions-h) + clamp(2px, .6dvh, 8px));
  left: clamp(4px, 1vw, 12px);
  max-height: min(34dvh, 210px);
  max-width: clamp(108px, 22vw, 260px);
  overflow: hidden;
  position: absolute;
  transform: none;
  width: clamp(108px, 22vw, 260px);
}

body:not(.in-lobby) .game-stage .odds-panel .chat-header,
body:not(.in-lobby) .game-stage .odds-list {
  font-size: clamp(7px, 1.05vw, 13px);
}

body:not(.in-lobby) .game-stage .action-panel {
  align-items: stretch;
  bottom: auto;
  display: grid;
  grid-area: actions;
  grid-template-columns: minmax(0, 1fr);
  height: 100%;
  left: auto;
  min-height: 0;
  overflow: visible;
  padding: 0;
  position: relative;
  right: auto;
  top: auto;
  z-index: 80;
}

body:not(.in-lobby) .game-stage .controls {
  display: flex;
  flex-wrap: nowrap;
  gap: clamp(4px, .9vw, 14px);
  height: 100%;
  margin: 0 auto;
  max-width: min(980px, 96vw);
  min-width: 0;
  width: 100%;
}

body:not(.in-lobby) .game-stage .controls button {
  flex: 1 1 0;
  font-size: clamp(12px, 2.4vw, 30px);
  height: 100%;
  min-height: 0;
  min-width: 0;
  overflow: hidden;
  padding: 0 clamp(5px, .9vw, 16px);
  text-overflow: ellipsis;
  white-space: nowrap;
}

body:not(.in-lobby) .game-stage .controls .utility-action {
  display: none;
}

body:not(.in-lobby) .game-stage .bet-sizing {
  bottom: calc(var(--actions-h) + var(--safe-bottom) + clamp(4px, .8dvh, 10px));
  left: 50%;
  max-height: min(40dvh, 260px);
  max-width: min(92vw, 560px);
  overflow-y: auto;
  position: fixed;
  right: auto;
  top: auto;
  transform: translateX(-50%);
  width: min(92vw, 560px);
  z-index: 9998;
}

body:not(.in-lobby) .game-stage .winner-banner {
  left: 50%;
  max-height: calc(100dvh - var(--topbar-h) - var(--actions-h) - 24px);
  max-width: min(86vw, 560px);
  overflow-y: auto;
  position: absolute;
  top: 24%;
  transform: translate(-50%, -50%);
  z-index: 9999;
}

body:not(.in-lobby) .game-stage .reveal-overlay {
  left: 50%;
  max-width: min(70vw, 420px);
  padding: clamp(4px, .9dvh, 12px) clamp(8px, 1.2vw, 18px);
  top: 20%;
}

body:not(.in-lobby) .game-stage .turn-callout {
  border-width: 1px;
  gap: clamp(4px, .65vw, 9px);
  padding: clamp(4px, .75dvh, 8px) clamp(8px, 1.1vw, 16px);
  top: clamp(54px, 17dvh, 140px);
}

body:not(.in-lobby) .game-stage .turn-callout strong {
  font-size: clamp(11px, 1.55vw, 20px);
}

body:not(.in-lobby) .game-stage .turn-callout span {
  font-size: clamp(12px, 1.7vw, 22px);
  height: clamp(22px, 3.7dvh, 34px);
  min-width: clamp(22px, 3.7dvh, 34px);
}

@media (max-width: 620px) {
  body:not(.in-lobby) .game-stage .top-bar {
    grid-template-columns: minmax(48px, .28fr) minmax(0, 1fr);
  }

  body:not(.in-lobby) .game-stage .top-bar h1 {
    display: none;
  }

  body:not(.in-lobby) .game-stage .score-strip span:nth-of-type(3),
  body:not(.in-lobby) .game-stage .score-strip span:nth-of-type(5) {
    display: none;
  }
}

@media (max-width: 430px) {
  body:not(.in-lobby) .game-viewport {
    --actions-h: clamp(44px, 10dvh, 64px);
    --topbar-h: clamp(32px, 7dvh, 48px);
  }

  body:not(.in-lobby) .game-stage .score-strip span:nth-of-type(2),
  body:not(.in-lobby) .game-stage .score-strip #howButton {
    display: none;
  }

  body:not(.in-lobby) .game-stage .poker-table {
    height: clamp(130px, 54dvh, 360px);
    width: 88vw;
  }

  body:not(.in-lobby) .game-stage .seat-top-left {
    left: 22%;
  }

  body:not(.in-lobby) .game-stage .seat-top-right {
    right: 22%;
  }

  body:not(.in-lobby) .game-stage .seat-bottom-left {
    left: 13%;
  }

  body:not(.in-lobby) .game-stage .seat-bottom-right {
    right: 13%;
  }
}

@media (max-height: 420px) {
  body:not(.in-lobby) .game-viewport {
    --actions-h: clamp(42px, 11dvh, 58px);
    --topbar-h: clamp(30px, 8dvh, 42px);
  }

  body:not(.in-lobby) .game-stage .game-shell {
    gap: 2px;
    padding-block: 2px;
  }

  body:not(.in-lobby) .game-stage .top-bar h1 {
    display: none;
  }

  body:not(.in-lobby) .game-stage .score-strip span:nth-of-type(2),
  body:not(.in-lobby) .game-stage .score-strip span:nth-of-type(5) {
    display: none;
  }

  body:not(.in-lobby) .game-stage .poker-table {
    height: 55dvh;
    top: 51%;
  }

  body:not(.in-lobby) .game-stage .seat-top,
  body:not(.in-lobby) .game-stage .seat-top-left,
  body:not(.in-lobby) .game-stage .seat-top-right {
    top: 0;
  }

  body:not(.in-lobby) .game-stage .odds-panel {
    display: none;
  }
}

@media (min-width: 1000px) and (min-height: 680px) {
  body:not(.in-lobby) .game-viewport {
    --actions-h: clamp(68px, 10dvh, 96px);
    --topbar-h: clamp(54px, 7dvh, 76px);
  }

  body:not(.in-lobby) .game-stage .poker-table {
    height: min(58dvh, 520px);
    width: min(86vw, 1320px);
  }
}

/* Targeted mobile fixes: keep transient text readable without resizing the table. */
body:not(.in-lobby) .game-stage .winner-banner {
  box-sizing: border-box;
  left: 50%;
  max-width: min(72vw, 440px);
  overflow-wrap: anywhere;
  padding: clamp(6px, 1.1dvh, 12px) clamp(8px, 1.3vw, 16px);
  top: clamp(42px, 17dvh, 96px);
  transform: translate(-50%, 0);
  white-space: normal;
  word-break: normal;
}

body:not(.in-lobby) .game-stage .winner-banner strong,
body:not(.in-lobby) .game-stage .winner-banner span {
  line-height: 1.15;
  white-space: normal;
}

body:not(.in-lobby) .game-stage .action-pop,
body:not(.in-lobby) .game-stage .turn-label {
  font-size: clamp(7px, 1.05vw, 13px);
  line-height: 1;
  max-width: min(26vw, 150px);
  padding: clamp(2px, .45dvh, 5px) clamp(5px, .75vw, 9px);
  pointer-events: none;
  white-space: nowrap;
  z-index: 140;
}

body:not(.in-lobby) .game-stage .seat-top-left .action-pop,
body:not(.in-lobby) .game-stage .seat-top .action-pop,
body:not(.in-lobby) .game-stage .seat-top-right .action-pop,
body:not(.in-lobby) .game-stage .seat-left-upper .action-pop,
body:not(.in-lobby) .game-stage .seat-right-upper .action-pop {
  bottom: auto;
  top: 100%;
  transform: translate(-50%, 5px);
}

body:not(.in-lobby) .game-stage .seat-left-lower .action-pop,
body:not(.in-lobby) .game-stage .seat-left-upper .action-pop {
  left: 100%;
  right: auto;
  top: 50%;
  transform: translate(6px, -50%);
}

body:not(.in-lobby) .game-stage .seat-right-lower .action-pop,
body:not(.in-lobby) .game-stage .seat-right-upper .action-pop {
  left: auto;
  right: 100%;
  top: 50%;
  transform: translate(-6px, -50%);
}

body:not(.in-lobby) .game-stage .seat-bottom .action-pop,
body:not(.in-lobby) .game-stage .seat-bottom-left .action-pop,
body:not(.in-lobby) .game-stage .seat-bottom-right .action-pop {
  bottom: 100%;
  top: auto;
  transform: translate(-50%, -5px);
}

@media (orientation: landscape) and (max-height: 430px) {
  body:not(.in-lobby) .game-stage .winner-banner {
    max-width: min(66vw, 360px);
    top: clamp(34px, 13dvh, 58px);
  }

  body:not(.in-lobby) .game-stage .winner-banner strong {
    font-size: clamp(12px, 2.4vw, 18px);
  }

  body:not(.in-lobby) .game-stage .winner-banner span {
    font-size: clamp(9px, 1.8vw, 13px);
  }

  body:not(.in-lobby) .game-stage .action-pop,
  body:not(.in-lobby) .game-stage .turn-label {
    font-size: clamp(7px, 1.45vw, 11px);
    max-width: min(22vw, 118px);
    padding: 2px 6px;
  }

  body:not(.in-lobby) .game-stage .bet-sizing {
    animation: none !important;
    bottom: auto !important;
    box-sizing: border-box;
    gap: clamp(4px, 1dvh, 8px);
    left: 50%;
    max-height: min(38dvh, 148px);
    max-width: 85vw;
    overflow-y: auto;
    padding: clamp(6px, 1.2dvh, 10px);
    position: fixed !important;
    right: auto;
    top: clamp(72px, 22dvh, 96px) !important;
    transform: translateX(-50%) !important;
    width: min(85vw, 390px);
    z-index: 10020;
  }

  body:not(.in-lobby) .game-stage .bet-sizing label {
    gap: clamp(2px, .6dvh, 5px);
  }

  body:not(.in-lobby) .game-stage .bet-sizing label span,
  body:not(.in-lobby) .game-stage .bet-sizing small {
    font-size: clamp(9px, 1.8vw, 12px);
    line-height: 1.05;
  }

  body:not(.in-lobby) .game-stage .bet-sizing strong {
    font-size: clamp(14px, 3vw, 20px);
    line-height: 1;
  }

  body:not(.in-lobby) .game-stage .bet-sizing input[type="range"] {
    height: clamp(28px, 7dvh, 40px);
    margin: 0;
    touch-action: none;
  }

  body:not(.in-lobby) .game-stage .bet-sizing button {
    border-radius: 7px;
    font-size: clamp(10px, 2vw, 13px);
    min-height: clamp(28px, 7.4dvh, 36px);
    padding: clamp(4px, 1dvh, 7px) clamp(6px, 1.4vw, 10px);
  }

  body:not(.in-lobby) .game-stage .quick-bet-row,
  body:not(.in-lobby) .game-stage .bet-confirm-row {
    gap: clamp(4px, .8vw, 8px);
  }
}

/* Targeted overlay fixes: iPad bet sheet, iPhone top space, and scrollable menu. */
body:not(.in-lobby) .game-stage .bet-sizing,
body:not(.in-lobby) .game-stage .bet-sizing.show {
  z-index: 30000;
}

body:not(.in-lobby) .game-stage .bet-sizing input[type="range"] {
  position: relative;
  z-index: 30001;
}

body:not(.in-lobby) .game-stage .menu-panel,
body:not(.in-lobby) .game-stage .menu-panel.open {
  max-height: 80dvh;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  z-index: 60030;
}

body:not(.in-lobby) .game-stage .menu-panel.open {
  bottom: auto;
  left: auto;
  max-height: min(80dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 16px));
  position: fixed;
  right: max(8px, env(safe-area-inset-right, 0px));
  top: max(8px, env(safe-area-inset-top, 0px));
  width: min(34rem, calc(100dvw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px) - 16px));
}

@media (orientation: landscape) and (min-width: 900px) and (min-height: 600px) {
  body:not(.in-lobby) .game-stage .bet-sizing,
  body:not(.in-lobby) .game-stage .bet-sizing.show {
    bottom: clamp(82px, 13dvh, 116px);
    box-sizing: border-box;
    left: 50%;
    max-height: min(48dvh, 340px);
    max-width: min(85vw, 460px);
    overflow-y: auto;
    padding: clamp(10px, 1.4dvh, 16px);
    position: fixed;
    right: auto;
    top: auto;
    transform: translateX(-50%);
    width: min(85vw, 460px);
  }

  body:not(.in-lobby) .game-stage .bet-sizing input[type="range"] {
    height: 54px !important;
    min-height: 54px !important;
  }

  body:not(.in-lobby) .game-stage .bet-sizing input[type="range"]::-webkit-slider-thumb {
    height: 44px;
    width: 44px;
  }

  body:not(.in-lobby) .game-stage .bet-sizing input[type="range"]::-moz-range-thumb {
    height: 44px;
    width: 44px;
  }

  body:not(.in-lobby) .game-stage .menu-panel,
  body:not(.in-lobby) .game-stage .menu-panel.open {
    max-height: min(80dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 12px));
    width: min(34rem, calc(100dvw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px) - 1rem));
  }
}

@media (orientation: landscape) and (max-height: 480px) {
  body:not(.in-lobby) .app-viewport,
  body:not(.in-lobby) .game-viewport {
    padding-top: max(0px, calc(env(safe-area-inset-top, 0px) - 10px));
  }

  body:not(.in-lobby) .game-stage .game-shell {
    padding-top: clamp(1px, .25dvh, 4px);
  }

  body:not(.in-lobby) .game-stage .top-bar {
    padding-top: clamp(1px, .22dvh, 3px);
  }

  body:not(.in-lobby) .game-stage .menu-panel,
  body:not(.in-lobby) .game-stage .menu-panel.open {
    max-height: 80dvh;
    overflow-y: auto;
  }
}

/* iPad/tablet menu restore: make Menu a simple fixed scroll panel. */
body:not(.in-lobby) #menuPanel.menu-panel.open {
  bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important;
  display: block !important;
  height: auto !important;
  left: auto !important;
  max-height: none !important;
  overflow-x: hidden !important;
  overflow-y: scroll !important;
  overscroll-behavior: contain;
  padding-bottom: max(16px, env(safe-area-inset-bottom, 0px)) !important;
  position: fixed !important;
  right: max(8px, env(safe-area-inset-right, 0px)) !important;
  top: max(8px, env(safe-area-inset-top, 0px)) !important;
  touch-action: pan-y !important;
  width: min(27rem, calc(100dvw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px) - 16px)) !important;
  -webkit-overflow-scrolling: touch;
  z-index: 70000 !important;
}

body:not(.in-lobby) #menuPanel.menu-panel.open section {
  margin-bottom: .75rem;
}

/* Table chat restore: visible activity without crowding the table. */
body:not(.in-lobby) .game-stage .chat-toggle {
  align-items: center;
  display: inline-flex;
  gap: .35rem;
  justify-content: center;
  pointer-events: auto;
  position: relative;
  touch-action: manipulation;
  z-index: 60015 !important;
}

body:not(.in-lobby) .game-stage .chat-toggle.chat-open {
  box-shadow: 0 0 0 2px rgba(39,231,255,.32), 0 0 18px rgba(39,231,255,.18);
}

.chat-badge {
  align-items: center;
  background: #ff3864;
  border: 1px solid rgba(255,255,255,.7);
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  font-size: .66em;
  font-weight: 950;
  height: 1.25em;
  justify-content: center;
  min-width: 1.25em;
  padding: 0 .3em;
}

.chat-ticker {
  background: rgba(5,12,27,.86);
  border: 1px solid rgba(39,231,255,.38);
  border-radius: 7px;
  box-shadow: 0 10px 24px rgba(0,0,0,.28);
  color: var(--text);
  font-size: clamp(10px, 1.35vw, 14px);
  left: 50%;
  line-height: 1.25;
  max-width: min(34vw, 24rem);
  opacity: 0;
  overflow: hidden;
  padding: .38rem .6rem;
  pointer-events: none;
  position: absolute;
  text-overflow: ellipsis;
  top: 11%;
  transform: translate(-50%, -8px);
  transition: opacity .18s ease, transform .18s ease;
  white-space: nowrap;
  z-index: 180;
}

.chat-ticker.show {
  opacity: 1;
  transform: translate(-50%, 0);
}

.chat-ticker strong {
  color: var(--gold);
}

body:not(.in-lobby) .game-stage .chat-panel {
  background: linear-gradient(145deg, rgba(10,16,43,.98), rgba(36,18,79,.96));
  border: 1px solid rgba(39,231,255,.38);
  border-radius: 8px;
  bottom: max(76px, calc(env(safe-area-inset-bottom, 0px) + 72px));
  box-shadow: 0 18px 44px rgba(0,0,0,.4);
  display: none;
  gap: .55rem;
  max-height: min(64dvh, 28rem);
  overflow-y: auto;
  padding: .75rem;
  position: fixed;
  right: max(.75rem, env(safe-area-inset-right, 0px));
  touch-action: pan-y;
  width: min(21rem, calc(100dvw - 1.5rem));
  -webkit-overflow-scrolling: touch;
  pointer-events: auto;
  z-index: 72000;
}

body:not(.in-lobby) .game-stage .chat-panel.open {
  display: grid;
}

body:not(.in-lobby) .game-stage .chat-close {
  align-items: center;
  aspect-ratio: 1;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  color: var(--text);
  display: inline-flex;
  font-size: .75rem;
  font-weight: 950;
  justify-content: center;
  min-height: 1.65rem;
  padding: 0;
  touch-action: manipulation;
  width: 1.65rem;
}

body:not(.in-lobby) .game-stage .chat-panel .chat-feed {
  max-height: min(31dvh, 12rem);
  min-height: 5.25rem;
}

body:not(.in-lobby) .game-stage .chat-panel .quick-chat {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body:not(.in-lobby) .game-stage .chat-panel .quick-chat button {
  min-height: 2rem;
  white-space: normal;
}

@media (orientation: landscape) and (max-height: 430px) {
  .chat-ticker {
    font-size: clamp(9px, 1.2vw, 12px);
    max-width: min(42vw, 20rem);
    padding: .28rem .5rem;
    top: 9%;
  }

  body:not(.in-lobby) .game-stage .chat-panel {
    bottom: max(52px, calc(env(safe-area-inset-bottom, 0px) + 50px));
    max-height: min(70dvh, 19rem);
    padding: .55rem;
    width: min(19rem, calc(100dvw - 1rem));
  }

  body:not(.in-lobby) .game-stage .chat-panel .chat-feed {
    max-height: 7rem;
    min-height: 4rem;
  }

  body:not(.in-lobby) #menuPanel.menu-panel.open {
    bottom: max(6px, env(safe-area-inset-bottom, 0px)) !important;
    padding: .65rem !important;
    top: max(6px, env(safe-area-inset-top, 0px)) !important;
    width: min(25rem, calc(100dvw - 12px)) !important;
  }

  body:not(.in-lobby) #menuPanel .player-profile {
    gap: .35rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: .5rem;
  }

  body:not(.in-lobby) #menuPanel .profile-row {
    align-items: start;
    display: grid;
    gap: .12rem;
    min-height: 0;
  }

  body:not(.in-lobby) #menuPanel .profile-row span,
  body:not(.in-lobby) #menuPanel .profile-row strong {
    font-size: .66rem;
    text-align: left;
  }

  body:not(.in-lobby) #menuPanel .menu-actions {
    gap: .35rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body:not(.in-lobby) #menuPanel .menu-actions > strong,
  body:not(.in-lobby) #menuPanel .theme-grid {
    grid-column: 1 / -1;
  }

  body:not(.in-lobby) #menuPanel .menu-actions > button {
    min-height: 2rem;
    padding: .3rem .4rem;
  }

  .chat-tools {
    grid-template-columns: 1fr;
  }
}

body:not(.in-lobby) .game-stage .controls.seat-pending {
  grid-template-columns: minmax(0, 1fr) !important;
  max-width: min(18rem, calc(100vw - 2rem)) !important;
}

body:not(.in-lobby) .game-stage .controls.seat-pending button:not(.utility-action) {
  display: none !important;
}

body:not(.in-lobby) .game-stage .controls.seat-pending .utility-action {
  display: block !important;
  min-height: 3rem !important;
  opacity: 1 !important;
  pointer-events: none;
  position: static !important;
  width: 100% !important;
}

body:not(.in-lobby) .game-stage .controls.status-only {
  grid-template-columns: minmax(0, 1fr) !important;
  max-width: min(26rem, calc(100vw - 2rem)) !important;
}

body:not(.in-lobby) .game-stage .controls.status-only button:not(.utility-action) {
  display: none !important;
}

body:not(.in-lobby) .game-stage .controls.status-only .utility-action {
  display: block !important;
  min-height: 3rem !important;
  opacity: 1 !important;
  pointer-events: none;
  position: static !important;
  width: 100% !important;
}

/* Final responsive gameplay pass: phone/tablet landscape without device-specific hardcoding. */
body:not(.in-lobby) {
  height: 100dvh;
  overflow: hidden;
  overscroll-behavior: none;
  touch-action: manipulation;
  width: 100vw;
}

body:not(.in-lobby) .game-viewport,
body:not(.in-lobby) .app-viewport {
  height: 100dvh;
  max-height: 100dvh;
  overflow: hidden;
  width: 100vw;
}

@media (orientation: landscape) and (max-height: 620px) {
  body:not(.in-lobby) {
    padding: 0;
  }

  body:not(.in-lobby) .game-viewport {
    --safe-top: env(safe-area-inset-top, 0px);
    --safe-right: env(safe-area-inset-right, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);
    --safe-left: env(safe-area-inset-left, 0px);
    --topbar-h: clamp(34px, 10dvh, 54px);
    --actions-h: clamp(48px, 13dvh, 72px);
    --seat-scale: 1;
    --card-w: clamp(24px, 5.2dvh, 44px);
    --card-h: calc(var(--card-w) * 1.42);
    --table-w: min(calc(100vw - var(--safe-left) - var(--safe-right) - 10px), 980px);
    --table-h: calc(100dvh - var(--topbar-h) - var(--actions-h) - var(--safe-top) - var(--safe-bottom) - 8px);
  }

  body:not(.in-lobby) .game-shell {
    display: grid !important;
    gap: 3px !important;
    grid-template-areas: "top" "table" "actions" !important;
    grid-template-rows: var(--topbar-h) minmax(0, 1fr) var(--actions-h) !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: max(2px, var(--safe-top)) max(5px, var(--safe-right)) max(2px, var(--safe-bottom)) max(5px, var(--safe-left)) !important;
    width: 100vw !important;
  }

  body:not(.in-lobby) .top-bar,
  body:not(.in-lobby) .game-stage .top-bar {
    align-items: center !important;
    display: grid !important;
    gap: 4px !important;
    grid-area: top !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    height: var(--topbar-h) !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 3px 5px !important;
  }

  body:not(.in-lobby) .top-bar h1,
  body:not(.in-lobby) .top-bar .eyebrow {
    display: none !important;
  }

  body:not(.in-lobby) .score-strip,
  body:not(.in-lobby) .game-stage .score-strip {
    align-items: center !important;
    display: grid !important;
    gap: 4px !important;
    grid-template-columns: repeat(4, minmax(42px, auto)) !important;
    justify-content: end !important;
    min-width: 0 !important;
  }

  body:not(.in-lobby) .score-strip > span {
    display: none !important;
  }

  body:not(.in-lobby) .score-strip button {
    border-radius: 999px !important;
    font-size: clamp(10px, 2.1dvh, 13px) !important;
    line-height: 1 !important;
    min-height: clamp(28px, 7dvh, 38px) !important;
    min-width: 0 !important;
    padding: 0 clamp(7px, 1.8vw, 13px) !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .table-scene,
  body:not(.in-lobby) .game-stage .table-scene {
    grid-area: table !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    position: relative !important;
  }

  body:not(.in-lobby) .poker-table,
  body:not(.in-lobby) .game-stage .poker-table {
    height: min(var(--table-h), 56dvh) !important;
    left: 50% !important;
    max-height: 100% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: var(--table-w) !important;
  }

  body:not(.in-lobby) .community,
  body:not(.in-lobby) .game-stage .community {
    gap: clamp(3px, .8vw, 8px) !important;
    min-height: 0 !important;
    transform: translateY(clamp(-8px, -1.8dvh, -2px)) !important;
  }

  body:not(.in-lobby) .card {
    border-radius: clamp(3px, .7dvh, 7px) !important;
    height: var(--card-h) !important;
    width: var(--card-w) !important;
  }

  body:not(.in-lobby) .community .card,
  body:not(.in-lobby) .hole-cards .card {
    height: var(--card-h) !important;
    width: var(--card-w) !important;
  }

  body:not(.in-lobby) .card .corner,
  body:not(.in-lobby) .hole-cards .card .corner,
  body:not(.in-lobby) .community .card .corner {
    font-size: clamp(7px, 1.6dvh, 11px) !important;
  }

  body:not(.in-lobby) .card .face,
  body:not(.in-lobby) .hole-cards .card .face,
  body:not(.in-lobby) .community .card .face {
    font-size: clamp(13px, 3.8dvh, 25px) !important;
  }

  body:not(.in-lobby) .card .pips,
  body:not(.in-lobby) .hole-cards .card .pips,
  body:not(.in-lobby) .community .card .pips {
    font-size: clamp(10px, 2.7dvh, 18px) !important;
    gap: 1px !important;
  }

  body:not(.in-lobby) .seat,
  body:not(.in-lobby) .game-stage .seat {
    gap: 1px !important;
    min-width: clamp(46px, 11vw, 112px) !important;
    transform-origin: center !important;
    z-index: 30 !important;
  }

  body:not(.in-lobby) .hole-cards {
    gap: clamp(2px, .45vw, 6px) !important;
    min-height: calc(var(--card-h) + 2px) !important;
  }

  body:not(.in-lobby) .player-nameplate {
    border-radius: 5px !important;
    max-width: clamp(52px, 12vw, 126px) !important;
    min-width: clamp(48px, 9vw, 96px) !important;
    padding: 2px 4px !important;
  }

  body:not(.in-lobby) .player-nameplate strong {
    font-size: clamp(8px, 1.8dvh, 12px) !important;
    line-height: 1 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .player-nameplate span,
  body:not(.in-lobby) .status-pill,
  body:not(.in-lobby) .hand-readout {
    font-size: clamp(7px, 1.45dvh, 10px) !important;
    line-height: 1 !important;
    max-width: clamp(52px, 12vw, 126px) !important;
    overflow: hidden !important;
    padding: 2px 4px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .seat-top { top: 1% !important; }
  body:not(.in-lobby) .seat-top-left { left: 27% !important; top: 2% !important; }
  body:not(.in-lobby) .seat-top-right { right: 27% !important; top: 2% !important; }
  body:not(.in-lobby) .seat-left-upper { left: 1% !important; top: 28% !important; }
  body:not(.in-lobby) .seat-left-lower { left: 1% !important; top: 62% !important; }
  body:not(.in-lobby) .seat-right-upper { right: 1% !important; top: 28% !important; }
  body:not(.in-lobby) .seat-right-lower { right: 1% !important; top: 62% !important; }
  body:not(.in-lobby) .seat-bottom { bottom: 2% !important; }
  body:not(.in-lobby) .seat-bottom-left { bottom: 2% !important; left: 18% !important; }
  body:not(.in-lobby) .seat-bottom-right { bottom: 2% !important; right: 18% !important; }

  body:not(.in-lobby) .result-banner {
    bottom: clamp(4px, 1dvh, 10px) !important;
    font-size: clamp(9px, 1.9dvh, 13px) !important;
    max-width: min(48vw, 260px) !important;
    opacity: .86 !important;
    padding: 3px 8px !important;
    pointer-events: none !important;
  }

  body:not(.in-lobby) .winner-banner {
    font-size: clamp(10px, 2dvh, 14px) !important;
    max-width: min(58vw, 360px) !important;
    padding: 5px 9px !important;
  }

  body:not(.in-lobby) .reveal-overlay {
    font-size: clamp(15px, 3.4dvh, 24px) !important;
    max-width: min(58vw, 360px) !important;
    padding: 5px 10px !important;
    top: 18% !important;
  }

  body:not(.in-lobby) .reveal-overlay span {
    font-size: clamp(9px, 1.9dvh, 13px) !important;
  }

  body:not(.in-lobby) .turn-callout,
  body:not(.in-lobby) .chat-ticker {
    max-width: min(44vw, 280px) !important;
    pointer-events: none !important;
  }

  body:not(.in-lobby) .odds-panel {
    display: none !important;
  }

  body:not(.in-lobby) .action-panel,
  body:not(.in-lobby) .game-stage .action-panel {
    grid-area: actions !important;
    height: var(--actions-h) !important;
    min-height: 0 !important;
    padding: 2px 0 !important;
    position: relative !important;
  }

  body:not(.in-lobby) .controls,
  body:not(.in-lobby) .game-stage .controls {
    display: flex !important;
    gap: clamp(4px, 1vw, 9px) !important;
    height: 100% !important;
    max-width: min(96vw, 760px) !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .controls button,
  body:not(.in-lobby) .game-stage .controls button {
    font-size: clamp(11px, 2.7dvh, 17px) !important;
    min-height: 0 !important;
    padding: 0 7px !important;
  }

  body:not(.in-lobby) .controls.status-only,
  body:not(.in-lobby) .game-stage .controls.status-only {
    max-width: min(70vw, 420px) !important;
  }

  body:not(.in-lobby) .controls.status-only .utility-action {
    font-size: clamp(10px, 2.2dvh, 15px) !important;
    min-height: clamp(32px, 8dvh, 48px) !important;
  }

  body:not(.in-lobby) .bet-sizing.show {
    max-height: min(42dvh, 190px) !important;
    top: calc(var(--topbar-h) + var(--safe-top) + 8px) !important;
  }
}

@media (orientation: landscape) and (max-height: 430px) {
  body:not(.in-lobby) .game-viewport {
    --topbar-h: clamp(30px, 9dvh, 42px);
    --actions-h: clamp(42px, 12dvh, 58px);
    --card-w: clamp(20px, 4.8dvh, 32px);
    --table-w: min(calc(100vw - var(--safe-left) - var(--safe-right) - 8px), 760px);
  }

  body:not(.in-lobby) .seat {
    min-width: clamp(42px, 10vw, 86px) !important;
  }

  body:not(.in-lobby) .player-nameplate {
    max-width: clamp(46px, 11vw, 92px) !important;
    min-width: clamp(42px, 8vw, 78px) !important;
  }

  body:not(.in-lobby) .player-nameplate span,
  body:not(.in-lobby) .status-pill,
  body:not(.in-lobby) .hand-readout {
    max-width: clamp(46px, 11vw, 92px) !important;
  }

  body:not(.in-lobby) .seat-bottom-left { left: 14% !important; }
  body:not(.in-lobby) .seat-bottom-right { right: 14% !important; }

  body:not(.in-lobby) .result-banner {
    display: none !important;
  }

  body:not(.in-lobby) .chat-panel.open {
    bottom: calc(var(--actions-h) + var(--safe-bottom) + 4px) !important;
    max-height: calc(100dvh - var(--topbar-h) - var(--actions-h) - 14px) !important;
    width: min(18rem, calc(100dvw - 10px)) !important;
  }
}

@media (orientation: landscape) and (min-height: 431px) and (max-height: 520px) {
  body:not(.in-lobby) .game-viewport {
    --topbar-h: clamp(36px, 9dvh, 50px);
    --actions-h: clamp(52px, 12dvh, 68px);
    --card-w: clamp(26px, 5.1dvh, 40px);
  }
}

@media (orientation: landscape) and (min-height: 521px) and (max-height: 760px) {
  body:not(.in-lobby) .game-viewport {
    --topbar-h: clamp(44px, 8dvh, 62px);
    --actions-h: clamp(60px, 10dvh, 82px);
    --card-w: clamp(34px, 5.6dvh, 52px);
    --table-w: min(calc(100vw - var(--safe-left) - var(--safe-right) - 18px), 1180px);
  }
}

@media (orientation: landscape) and (min-height: 761px) {
  body:not(.in-lobby) .game-viewport {
    --topbar-h: clamp(54px, 7dvh, 76px);
    --actions-h: clamp(70px, 9dvh, 96px);
    --card-w: clamp(42px, 5.4dvh, 64px);
  }
}

/* Phone landscape viewport correction: keep play, seats, and actions inside the visible screen. */
body:not(.in-lobby) {
  min-height: 100svh;
  height: 100dvh;
  max-height: 100dvh;
}

body:not(.in-lobby) .game-viewport,
body:not(.in-lobby) .app-viewport {
  min-height: 100svh;
  height: 100dvh;
  max-height: 100dvh;
}

@media (orientation: landscape) and (max-height: 620px) {
  body:not(.in-lobby) .game-viewport {
    --safe-top: env(safe-area-inset-top, 0px);
    --safe-right: env(safe-area-inset-right, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);
    --safe-left: env(safe-area-inset-left, 0px);
    --topbar-h: clamp(30px, 8.6dvh, 46px);
    --actions-h: clamp(42px, 11dvh, 62px);
    --card-w: clamp(22px, 5.1dvh, 38px);
    --card-h: calc(var(--card-w) * 1.42);
    --table-w: min(calc(95dvw - var(--safe-left) - var(--safe-right)), 980px);
    --table-h: calc(100dvh - var(--topbar-h) - var(--actions-h) - var(--safe-top) - var(--safe-bottom) - 8px);
  }

  body:not(.in-lobby) .game-shell,
  body:not(.in-lobby) .game-stage .game-shell {
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-areas: "top" "table" "actions" !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: var(--topbar-h) minmax(0, 1fr) var(--actions-h) !important;
    min-height: 100svh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
    padding:
      max(2px, var(--safe-top))
      max(5px, var(--safe-right))
      max(3px, var(--safe-bottom))
      max(5px, var(--safe-left)) !important;
    width: 100dvw !important;
  }

  body:not(.in-lobby) .top-bar,
  body:not(.in-lobby) .game-stage .top-bar {
    height: var(--topbar-h) !important;
    max-height: var(--topbar-h) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 2px 4px !important;
  }

  body:not(.in-lobby) .score-strip,
  body:not(.in-lobby) .game-stage .score-strip {
    gap: 3px !important;
    grid-template-columns: repeat(4, minmax(0, auto)) !important;
    max-width: 100% !important;
  }

  body:not(.in-lobby) .score-strip button {
    font-size: clamp(9px, 2dvh, 12px) !important;
    min-height: clamp(24px, 6.2dvh, 32px) !important;
    padding: 0 clamp(5px, 1.3vw, 10px) !important;
  }

  body:not(.in-lobby) .table-scene,
  body:not(.in-lobby) .game-stage .table-scene {
    align-items: center !important;
    display: flex !important;
    grid-area: table !important;
    height: 100% !important;
    justify-content: center !important;
    min-height: 0 !important;
    overflow: hidden !important;
    position: relative !important;
  }

  body:not(.in-lobby) .poker-table,
  body:not(.in-lobby) .game-stage .poker-table {
    height: min(100%, var(--table-h)) !important;
    left: auto !important;
    max-height: 100% !important;
    max-width: var(--table-w) !important;
    position: relative !important;
    top: auto !important;
    transform: none !important;
    width: var(--table-w) !important;
  }

  body:not(.in-lobby) .action-panel,
  body:not(.in-lobby) .game-stage .action-panel {
    align-items: center !important;
    bottom: auto !important;
    box-sizing: border-box !important;
    display: flex !important;
    grid-area: actions !important;
    height: var(--actions-h) !important;
    justify-content: center !important;
    left: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 3px max(6px, var(--safe-right)) max(3px, var(--safe-bottom)) max(6px, var(--safe-left)) !important;
    position: relative !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    width: 100% !important;
    z-index: 80 !important;
  }

  body:not(.in-lobby) .controls,
  body:not(.in-lobby) .game-stage .controls {
    align-items: stretch !important;
    background: rgba(4, 10, 18, .72) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-radius: 10px !important;
    box-sizing: border-box !important;
    display: flex !important;
    gap: clamp(3px, .8dvw, 8px) !important;
    height: calc(var(--actions-h) - 8px) !important;
    justify-content: center !important;
    max-width: min(92dvw, 680px) !important;
    min-height: 0 !important;
    padding: 3px !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .controls button,
  body:not(.in-lobby) .game-stage .controls button {
    border-radius: 8px !important;
    flex: 1 1 0 !important;
    font-size: clamp(10px, 2.45dvh, 15px) !important;
    line-height: 1 !important;
    min-height: 0 !important;
    min-width: 0 !important;
    padding: 0 5px !important;
  }

  body:not(.in-lobby) .controls.status-only,
  body:not(.in-lobby) .controls.seat-pending,
  body:not(.in-lobby) .game-stage .controls.status-only {
    max-width: min(50dvw, 300px) !important;
  }

  body:not(.in-lobby) .controls.status-only .utility-action,
  body:not(.in-lobby) .controls.seat-pending .utility-action,
  body:not(.in-lobby) .game-stage .controls.status-only .utility-action {
    font-size: clamp(8px, 1.7dvh, 11px) !important;
    height: auto !important;
    min-height: clamp(18px, 4.6dvh, 26px) !important;
    padding: 0 8px !important;
  }

  body:not(.in-lobby) .seat-bottom .hole-cards .card,
  body:not(.in-lobby) .seat-bottom-left .hole-cards .card,
  body:not(.in-lobby) .seat-bottom-right .hole-cards .card {
    height: calc(var(--card-h) * 1.22) !important;
    width: calc(var(--card-w) * 1.22) !important;
  }

  body:not(.in-lobby) .seat-bottom .hole-cards,
  body:not(.in-lobby) .seat-bottom-left .hole-cards,
  body:not(.in-lobby) .seat-bottom-right .hole-cards {
    min-height: calc(var(--card-h) * 1.22 + 2px) !important;
  }
}

@media (orientation: landscape) and (max-height: 430px) {
  body:not(.in-lobby) .game-viewport {
    --topbar-h: clamp(26px, 7.6dvh, 34px);
    --actions-h: clamp(36px, 10.2dvh, 48px);
    --card-w: clamp(19px, 4.9dvh, 30px);
    --table-w: min(calc(95dvw - var(--safe-left) - var(--safe-right)), 880px);
  }

  body:not(.in-lobby) .score-strip button {
    font-size: clamp(8px, 1.9dvh, 10px) !important;
    min-height: clamp(22px, 5.8dvh, 28px) !important;
    padding: 0 clamp(4px, 1dvw, 8px) !important;
  }

  body:not(.in-lobby) .seat {
    min-width: clamp(40px, 9.5dvw, 82px) !important;
  }

  body:not(.in-lobby) .player-nameplate {
    max-width: clamp(42px, 10dvw, 86px) !important;
    min-width: clamp(38px, 7.5dvw, 70px) !important;
    padding: 1px 3px !important;
  }

  body:not(.in-lobby) .player-nameplate strong {
    font-size: clamp(7px, 1.65dvh, 10px) !important;
  }

  body:not(.in-lobby) .player-nameplate span,
  body:not(.in-lobby) .status-pill,
  body:not(.in-lobby) .hand-readout {
    font-size: clamp(6px, 1.35dvh, 8px) !important;
    max-width: clamp(42px, 10dvw, 86px) !important;
    padding: 1px 3px !important;
  }

  body:not(.in-lobby) .community {
    transform: translateY(clamp(-10px, -2.4dvh, -4px)) !important;
  }

  body:not(.in-lobby) .controls.status-only,
  body:not(.in-lobby) .controls.seat-pending,
  body:not(.in-lobby) .game-stage .controls.status-only {
    max-width: min(46dvw, 260px) !important;
  }

  body:not(.in-lobby) .controls.status-only .utility-action,
  body:not(.in-lobby) .controls.seat-pending .utility-action,
  body:not(.in-lobby) .game-stage .controls.status-only .utility-action {
    min-height: clamp(16px, 4.2dvh, 22px) !important;
  }
}

/* True end-of-file phone system override. */
@media (orientation: portrait) and (max-width: 760px) {
  body:not(.in-lobby) {
    height: 100svh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
    padding: 0 !important;
    width: 100dvw !important;
  }

  body:not(.in-lobby) .game-viewport,
  body:not(.in-lobby) .app-viewport,
  body:not(.in-lobby) .game-stage {
    display: none !important;
  }

  body:not(.in-lobby) .rotate-phone-message {
    align-items: center !important;
    background: linear-gradient(145deg, #070d24, #130825 58%, #050813) !important;
    color: #fff !important;
    display: flex !important;
    font-size: clamp(1.05rem, 4.6vw, 1.55rem) !important;
    font-weight: 950 !important;
    inset: 0 !important;
    justify-content: center !important;
    line-height: 1.25 !important;
    padding: max(1.5rem, env(safe-area-inset-top, 0px)) max(1.5rem, env(safe-area-inset-right, 0px)) max(1.5rem, env(safe-area-inset-bottom, 0px)) max(1.5rem, env(safe-area-inset-left, 0px)) !important;
    position: fixed !important;
    text-align: center !important;
    z-index: 99999 !important;
  }
}

@media (orientation: landscape) and (max-height: 540px) and (max-width: 1000px) {
  html,
  body:not(.in-lobby),
  body:not(.in-lobby) .game-viewport,
  body:not(.in-lobby) .app-viewport,
  body:not(.in-lobby) .game-stage {
    height: 100svh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    width: 100dvw !important;
  }

  body:not(.in-lobby) .game-viewport {
    --safe-top: env(safe-area-inset-top, 0px);
    --safe-right: env(safe-area-inset-right, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);
    --safe-left: env(safe-area-inset-left, 0px);
    --phone-top-h: clamp(28px, 7.8dvh, 38px);
    --phone-action-h: clamp(42px, 11.5dvh, 54px);
    --phone-gap: clamp(2px, .8dvh, 5px);
    --phone-card-w: clamp(18px, 4.8dvh, 26px);
    --phone-card-h: calc(var(--phone-card-w) * 1.42);
    --phone-user-card-w: calc(var(--phone-card-w) * 1.2);
    --phone-user-card-h: calc(var(--phone-card-h) * 1.2);
    --phone-seat-w: clamp(44px, 9.8dvw, 76px);
    --phone-name-w: clamp(42px, 9.4dvw, 74px);
  }

  body:not(.in-lobby) .game-shell,
  body:not(.in-lobby) .game-stage .game-shell {
    box-sizing: border-box !important;
    display: grid !important;
    gap: var(--phone-gap) !important;
    grid-template-areas: "top" "table" "actions" !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: var(--phone-top-h) minmax(0, 1fr) var(--phone-action-h) !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: max(1px, var(--safe-top)) max(4px, var(--safe-right)) max(2px, var(--safe-bottom)) max(4px, var(--safe-left)) !important;
    width: 100dvw !important;
  }

  body:not(.in-lobby) .top-bar,
  body:not(.in-lobby) .game-stage .top-bar {
    grid-area: top !important;
    height: var(--phone-top-h) !important;
    max-height: var(--phone-top-h) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 1px 3px !important;
  }

  body:not(.in-lobby) .top-bar h1,
  body:not(.in-lobby) .top-bar .eyebrow,
  body:not(.in-lobby) .score-strip > span {
    display: none !important;
  }

  body:not(.in-lobby) .score-strip {
    display: grid !important;
    gap: 3px !important;
    grid-template-columns: repeat(4, minmax(0, auto)) !important;
    justify-content: end !important;
  }

  body:not(.in-lobby) .score-strip button {
    font-size: clamp(8px, 2dvh, 11px) !important;
    min-height: clamp(22px, 5.7dvh, 28px) !important;
    padding: 0 clamp(4px, 1.2dvw, 8px) !important;
  }

  body:not(.in-lobby) .table-scene,
  body:not(.in-lobby) .game-stage .table-scene {
    display: block !important;
    grid-area: table !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    position: relative !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .poker-table,
  body:not(.in-lobby) .game-stage .poker-table {
    height: min(70%, calc(100% - (var(--phone-user-card-h) * 1.15))) !important;
    left: 50% !important;
    max-height: 70% !important;
    max-width: 82% !important;
    position: absolute !important;
    top: 52% !important;
    transform: translate(-50%, -50%) !important;
    width: min(82%, calc(100% - (var(--phone-seat-w) * 1.45))) !important;
  }

  body:not(.in-lobby) .seat,
  body:not(.in-lobby) .game-stage .seat {
    max-width: var(--phone-seat-w) !important;
    min-width: 0 !important;
    position: absolute !important;
    width: var(--phone-seat-w) !important;
    z-index: 30 !important;
  }

  body:not(.in-lobby) .seat-top { left: 50% !important; right: auto !important; top: 1% !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-top-left { left: 31% !important; right: auto !important; top: 4% !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-top-right { left: 69% !important; right: auto !important; top: 4% !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-left-upper { left: 3% !important; right: auto !important; top: 29% !important; transform: translateY(-50%) !important; }
  body:not(.in-lobby) .seat-left-lower { left: 3% !important; right: auto !important; top: 63% !important; transform: translateY(-50%) !important; }
  body:not(.in-lobby) .seat-right-upper { left: 97% !important; right: auto !important; top: 29% !important; transform: translate(-100%, -50%) !important; }
  body:not(.in-lobby) .seat-right-lower { left: 97% !important; right: auto !important; top: 63% !important; transform: translate(-100%, -50%) !important; }
  body:not(.in-lobby) .seat-bottom { bottom: 0 !important; left: 50% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-bottom-left { bottom: 1% !important; left: 28% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }
  body:not(.in-lobby) .seat-bottom-right { bottom: 1% !important; left: 72% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }

  body:not(.in-lobby) .card,
  body:not(.in-lobby) .community .card,
  body:not(.in-lobby) .hole-cards .card {
    height: var(--phone-card-h) !important;
    width: var(--phone-card-w) !important;
  }

  body:not(.in-lobby) .seat-bottom .hole-cards .card {
    height: var(--phone-user-card-h) !important;
    width: var(--phone-user-card-w) !important;
  }

  body:not(.in-lobby) .hole-cards {
    gap: 2px !important;
    min-height: calc(var(--phone-card-h) + 2px) !important;
  }

  body:not(.in-lobby) .player-nameplate {
    max-width: var(--phone-name-w) !important;
    min-width: 0 !important;
    padding: 1px 3px !important;
    width: var(--phone-name-w) !important;
  }

  body:not(.in-lobby) .player-nameplate strong {
    font-size: clamp(6px, 1.55dvh, 9px) !important;
    line-height: 1 !important;
  }

  body:not(.in-lobby) .player-nameplate span,
  body:not(.in-lobby) .status-pill,
  body:not(.in-lobby) .hand-readout,
  body:not(.in-lobby) .action-pop {
    font-size: clamp(5px, 1.2dvh, 7px) !important;
    max-width: var(--phone-name-w) !important;
    padding: 1px 3px !important;
  }

  body:not(.in-lobby) .player-avatar,
  body:not(.in-lobby) .seat-timer,
  body:not(.in-lobby) .odds-panel,
  body:not(.in-lobby) .message-log {
    display: none !important;
  }

  body:not(.in-lobby) .pot-stack { bottom: 20% !important; gap: 3px !important; }
  body:not(.in-lobby) .chips { height: clamp(15px, 4dvh, 22px) !important; width: clamp(15px, 4dvh, 22px) !important; }
  body:not(.in-lobby) .pot-stack span { font-size: clamp(8px, 2.2dvh, 12px) !important; padding: 2px 6px !important; }
  body:not(.in-lobby) .result-banner { bottom: 4% !important; font-size: clamp(7px, 1.55dvh, 9px) !important; max-width: 34dvw !important; padding: 2px 6px !important; }

  body:not(.in-lobby) .action-panel,
  body:not(.in-lobby) .game-stage .action-panel {
    align-items: center !important;
    background: transparent !important;
    bottom: auto !important;
    box-shadow: none !important;
    display: flex !important;
    grid-area: actions !important;
    height: var(--phone-action-h) !important;
    justify-content: center !important;
    left: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 1px 0 0 !important;
    position: relative !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .controls,
  body:not(.in-lobby) .game-stage .controls {
    height: calc(var(--phone-action-h) - 3px) !important;
    max-height: calc(var(--phone-action-h) - 3px) !important;
    max-width: min(94dvw, 620px) !important;
    min-height: 0 !important;
    padding: 2px !important;
  }

  body:not(.in-lobby) .controls button,
  body:not(.in-lobby) .game-stage .controls button {
    font-size: clamp(8px, 2.2dvh, 12px) !important;
    height: auto !important;
    max-height: 100% !important;
    min-height: 0 !important;
    padding: 0 4px !important;
  }

  body:not(.in-lobby) .controls.status-only,
  body:not(.in-lobby) .controls.seat-pending {
    max-width: min(54dvw, 280px) !important;
  }

  body:not(.in-lobby) .controls.status-only .utility-action,
  body:not(.in-lobby) .controls.seat-pending .utility-action {
    font-size: clamp(7px, 1.65dvh, 10px) !important;
    min-height: 0 !important;
    padding: 0 8px !important;
  }
}

@media (orientation: landscape) and (max-height: 380px) and (max-width: 760px) {
  body:not(.in-lobby) .game-viewport {
    --phone-top-h: clamp(24px, 7dvh, 30px);
    --phone-action-h: clamp(36px, 10.8dvh, 44px);
    --phone-card-w: clamp(16px, 4.5dvh, 22px);
    --phone-seat-w: clamp(38px, 9dvw, 58px);
    --phone-name-w: clamp(36px, 8.5dvw, 56px);
  }

  body:not(.in-lobby) .poker-table,
  body:not(.in-lobby) .game-stage .poker-table {
    height: min(66%, calc(100% - (var(--phone-user-card-h) * 1.1))) !important;
    width: min(78%, calc(100% - (var(--phone-seat-w) * 1.55))) !important;
  }

  body:not(.in-lobby) .seat-top-left { left: 33% !important; }
  body:not(.in-lobby) .seat-top-right { left: 67% !important; }
  body:not(.in-lobby) .seat-bottom-left { left: 30% !important; }
  body:not(.in-lobby) .seat-bottom-right { left: 70% !important; }
}

/* Final appended readable phone landscape override. */
@media (orientation: landscape) and (max-height: 540px) and (max-width: 1000px) {
  body:not(.in-lobby) .game-viewport {
    --phone-top-h: clamp(32px, 8.8dvh, 44px);
    --phone-action-h: clamp(54px, 14.5dvh, 70px);
    --phone-card-w: clamp(32px, 5.25dvw, 48px);
    --phone-card-h: calc(var(--phone-card-w) * 1.42);
    --phone-user-card-w: calc(var(--phone-card-w) * 1.2);
    --phone-user-card-h: calc(var(--phone-card-h) * 1.2);
    --phone-seat-w: clamp(76px, 14dvw, 120px);
    --phone-name-w: clamp(72px, 13dvw, 112px);
  }
  body:not(.in-lobby) .game-stage .game-shell { grid-template-rows: var(--phone-top-h) minmax(0, 1fr) var(--phone-action-h) !important; }
  body:not(.in-lobby) .game-stage .table-scene { overflow-x: auto !important; overflow-y: hidden !important; overscroll-behavior-x: contain !important; scrollbar-width: thin !important; touch-action: pan-x !important; }
  body:not(.in-lobby) .game-stage .poker-table { height: min(60%, calc(100% - (var(--phone-user-card-h) * 1.05))) !important; max-height: 60% !important; max-width: none !important; min-width: min(112dvw, 1040px) !important; width: min(112dvw, 1040px) !important; }
  body:not(.in-lobby) .game-stage .card,
  body:not(.in-lobby) .game-stage .community .card,
  body:not(.in-lobby) .game-stage .hole-cards .card { height: var(--phone-card-h) !important; width: var(--phone-card-w) !important; }
  body:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card { height: var(--phone-user-card-h) !important; width: var(--phone-user-card-w) !important; }
  body:not(.in-lobby) .game-stage .hole-cards { gap: clamp(3px, .75dvw, 7px) !important; min-height: calc(var(--phone-card-h) + 4px) !important; }
  body:not(.in-lobby) .game-stage .seat-bottom .hole-cards { min-height: calc(var(--phone-user-card-h) + 4px) !important; }
  body:not(.in-lobby) .game-stage .card .corner { font-size: clamp(9px, 2.35dvh, 14px) !important; }
  body:not(.in-lobby) .game-stage .card .face { font-size: clamp(17px, 4.8dvh, 28px) !important; }
  body:not(.in-lobby) .game-stage .card .pips { font-size: clamp(13px, 3.5dvh, 22px) !important; gap: 1px !important; }
  body:not(.in-lobby) .game-stage .player-nameplate { max-width: var(--phone-name-w) !important; min-width: var(--phone-name-w) !important; padding: 3px 5px !important; width: var(--phone-name-w) !important; }
  body:not(.in-lobby) .game-stage .player-nameplate strong { font-size: clamp(10px, 2.65dvh, 15px) !important; line-height: 1.05 !important; }
  body:not(.in-lobby) .game-stage .player-nameplate span,
  body:not(.in-lobby) .game-stage .status-pill,
  body:not(.in-lobby) .game-stage .hand-readout,
  body:not(.in-lobby) .game-stage .action-pop { font-size: clamp(8px, 2.1dvh, 12px) !important; line-height: 1.05 !important; max-width: var(--phone-name-w) !important; padding: 2px 5px !important; }
  body:not(.in-lobby) .game-stage .score-strip button { font-size: clamp(10px, 2.65dvh, 14px) !important; min-height: clamp(28px, 7dvh, 36px) !important; padding: 0 clamp(7px, 1.7dvw, 13px) !important; }
  body:not(.in-lobby) .game-stage .pot-stack span { font-size: clamp(11px, 2.9dvh, 16px) !important; padding: 3px 8px !important; }
  body:not(.in-lobby) .game-stage .result-banner { font-size: clamp(10px, 2.4dvh, 14px) !important; max-width: 52dvw !important; padding: 4px 9px !important; }
  body:not(.in-lobby) .game-stage .controls { height: calc(var(--phone-action-h) - 4px) !important; max-height: calc(var(--phone-action-h) - 4px) !important; max-width: min(96dvw, 740px) !important; padding: 4px !important; }
  body:not(.in-lobby) .game-stage .controls button { font-size: clamp(11px, 3dvh, 17px) !important; min-height: 0 !important; padding: 0 8px !important; }
  body:not(.in-lobby) .game-stage .controls.status-only,
  body:not(.in-lobby) .game-stage .controls.seat-pending { max-width: min(72dvw, 460px) !important; }
  body:not(.in-lobby) .game-stage .controls.status-only .utility-action,
  body:not(.in-lobby) .game-stage .controls.seat-pending .utility-action { font-size: clamp(10px, 2.55dvh, 15px) !important; padding: 0 12px !important; }
}

@media (orientation: landscape) and (max-height: 380px) and (max-width: 760px) {
  body:not(.in-lobby) .game-viewport { --phone-top-h: clamp(30px, 8.2dvh, 36px); --phone-action-h: clamp(50px, 14dvh, 60px); --phone-card-w: clamp(30px, 5.1dvw, 42px); --phone-seat-w: clamp(70px, 13.5dvw, 98px); --phone-name-w: clamp(66px, 12.5dvw, 92px); }
  body:not(.in-lobby) .game-stage .poker-table { min-width: min(118dvw, 980px) !important; width: min(118dvw, 980px) !important; }
}

/* Mobile poker-app focus mode: gameplay first, decorative overhead table second. */
@media (orientation: landscape) and (max-height: 540px) and (max-width: 1000px) {
  body:not(.in-lobby) .game-viewport {
    --phone-top-h: clamp(30px, 8dvh, 40px);
    --phone-action-h: clamp(60px, 16dvh, 78px);
    --phone-card-w: clamp(40px, 6.4dvw, 58px);
    --phone-card-h: calc(var(--phone-card-w) * 1.42);
    --phone-user-card-w: calc(var(--phone-card-w) * 1.42);
    --phone-user-card-h: calc(var(--phone-card-h) * 1.42);
    --phone-seat-w: clamp(68px, 11dvw, 104px);
    --phone-name-w: clamp(66px, 10.5dvw, 100px);
    --phone-mini-seat-w: clamp(42px, 7dvw, 66px);
    --phone-mini-name-w: clamp(40px, 6.5dvw, 62px);
  }

  body:not(.in-lobby) .game-stage .game-shell {
    grid-template-rows: var(--phone-top-h) minmax(0, 1fr) var(--phone-action-h) !important;
  }

  body:not(.in-lobby) .game-stage .table-scene {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-padding-inline: 14dvw !important;
  }

  body:not(.in-lobby) .game-stage .poker-table {
    height: clamp(112px, 42dvh, 190px) !important;
    max-height: 52% !important;
    opacity: .78 !important;
    top: 48% !important;
    width: min(126dvw, 1080px) !important;
    min-width: min(126dvw, 1080px) !important;
  }

  body:not(.in-lobby) .game-stage .poker-table .rail {
    opacity: .45 !important;
  }

  body:not(.in-lobby) .game-stage .felt {
    box-shadow: inset 0 0 24px rgba(0, 0, 0, .28) !important;
  }

  body:not(.in-lobby) .game-stage .seat {
    gap: 1px !important;
    max-width: var(--phone-seat-w) !important;
    width: var(--phone-seat-w) !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom {
    bottom: 0 !important;
    left: 50% !important;
    z-index: 55 !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom-left,
  body:not(.in-lobby) .game-stage .seat-bottom-right,
  body:not(.in-lobby) .game-stage .seat-left-lower,
  body:not(.in-lobby) .game-stage .seat-right-lower {
    max-width: var(--phone-seat-w) !important;
    width: var(--phone-seat-w) !important;
    z-index: 44 !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom-left { bottom: 2% !important; left: 20% !important; }
  body:not(.in-lobby) .game-stage .seat-bottom-right { bottom: 2% !important; left: 80% !important; }
  body:not(.in-lobby) .game-stage .seat-left-lower { left: 0 !important; top: 60% !important; }
  body:not(.in-lobby) .game-stage .seat-right-lower { left: 100% !important; top: 60% !important; transform: translate(-100%, -50%) !important; }

  body:not(.in-lobby) .game-stage .seat-top,
  body:not(.in-lobby) .game-stage .seat-top-left,
  body:not(.in-lobby) .game-stage .seat-top-right,
  body:not(.in-lobby) .game-stage .seat-left-upper,
  body:not(.in-lobby) .game-stage .seat-right-upper {
    max-width: var(--phone-mini-seat-w) !important;
    opacity: .82 !important;
    width: var(--phone-mini-seat-w) !important;
    z-index: 28 !important;
  }

  body:not(.in-lobby) .game-stage .seat-top { left: 50% !important; top: 0 !important; }
  body:not(.in-lobby) .game-stage .seat-top-left { left: 34% !important; top: 1% !important; }
  body:not(.in-lobby) .game-stage .seat-top-right { left: 66% !important; top: 1% !important; }
  body:not(.in-lobby) .game-stage .seat-left-upper { left: 0 !important; top: 27% !important; }
  body:not(.in-lobby) .game-stage .seat-right-upper { left: 100% !important; top: 27% !important; transform: translate(-100%, -50%) !important; }

  body:not(.in-lobby) .game-stage .seat-top .hole-cards,
  body:not(.in-lobby) .game-stage .seat-top-left .hole-cards,
  body:not(.in-lobby) .game-stage .seat-top-right .hole-cards,
  body:not(.in-lobby) .game-stage .seat-left-upper .hole-cards,
  body:not(.in-lobby) .game-stage .seat-right-upper .hole-cards {
    transform: scale(.62) !important;
    transform-origin: center top !important;
    min-height: calc(var(--phone-card-h) * .66) !important;
  }

  body:not(.in-lobby) .game-stage .seat-top .player-nameplate,
  body:not(.in-lobby) .game-stage .seat-top-left .player-nameplate,
  body:not(.in-lobby) .game-stage .seat-top-right .player-nameplate,
  body:not(.in-lobby) .game-stage .seat-left-upper .player-nameplate,
  body:not(.in-lobby) .game-stage .seat-right-upper .player-nameplate {
    max-width: var(--phone-mini-name-w) !important;
    min-width: var(--phone-mini-name-w) !important;
    padding: 1px 3px !important;
    width: var(--phone-mini-name-w) !important;
  }

  body:not(.in-lobby) .game-stage .seat-top .player-nameplate strong,
  body:not(.in-lobby) .game-stage .seat-top-left .player-nameplate strong,
  body:not(.in-lobby) .game-stage .seat-top-right .player-nameplate strong,
  body:not(.in-lobby) .game-stage .seat-left-upper .player-nameplate strong,
  body:not(.in-lobby) .game-stage .seat-right-upper .player-nameplate strong {
    font-size: clamp(7px, 1.65dvh, 10px) !important;
  }

  body:not(.in-lobby) .game-stage .seat-top .player-nameplate span,
  body:not(.in-lobby) .game-stage .seat-top-left .player-nameplate span,
  body:not(.in-lobby) .game-stage .seat-top-right .player-nameplate span,
  body:not(.in-lobby) .game-stage .seat-left-upper .player-nameplate span,
  body:not(.in-lobby) .game-stage .seat-right-upper .player-nameplate span {
    font-size: clamp(6px, 1.4dvh, 8px) !important;
  }

  body:not(.in-lobby) .game-stage .card,
  body:not(.in-lobby) .game-stage .community .card,
  body:not(.in-lobby) .game-stage .hole-cards .card {
    width: var(--phone-card-w) !important;
    height: var(--phone-card-h) !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card {
    width: var(--phone-user-card-w) !important;
    height: var(--phone-user-card-h) !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom .hole-cards {
    gap: clamp(6px, 1.1dvw, 12px) !important;
    min-height: calc(var(--phone-user-card-h) + 6px) !important;
  }

  body:not(.in-lobby) .game-stage .player-nameplate {
    border-radius: 4px !important;
    max-width: var(--phone-name-w) !important;
    min-width: var(--phone-name-w) !important;
    padding: 2px 4px !important;
    width: var(--phone-name-w) !important;
  }

  body:not(.in-lobby) .game-stage .player-nameplate strong {
    font-size: clamp(10px, 2.7dvh, 15px) !important;
  }

  body:not(.in-lobby) .game-stage .player-nameplate span {
    font-size: clamp(8px, 2.05dvh, 12px) !important;
  }

  body:not(.in-lobby) .game-stage .community {
    top: 42% !important;
    gap: clamp(4px, .8dvw, 9px) !important;
  }

  body:not(.in-lobby) .game-stage .pot-stack {
    bottom: 17% !important;
  }

  body:not(.in-lobby) .game-stage .controls,
  body:not(.in-lobby) .game-stage .controls.status-only,
  body:not(.in-lobby) .game-stage .controls.seat-pending {
    max-width: min(96dvw, 760px) !important;
  }

  body:not(.in-lobby) .game-stage .controls button,
  body:not(.in-lobby) .game-stage .controls .utility-action {
    font-size: clamp(12px, 3.1dvh, 18px) !important;
  }
}

@media (orientation: landscape) and (max-height: 380px) and (max-width: 760px) {
  body:not(.in-lobby) .game-viewport {
    --phone-card-w: clamp(38px, 6.2dvw, 52px);
    --phone-user-card-w: calc(var(--phone-card-w) * 1.38);
    --phone-user-card-h: calc(var(--phone-card-h) * 1.38);
    --phone-seat-w: clamp(62px, 12.8dvw, 92px);
    --phone-name-w: clamp(60px, 12dvw, 88px);
  }

  body:not(.in-lobby) .game-stage .seat-top,
  body:not(.in-lobby) .game-stage .seat-top-left,
  body:not(.in-lobby) .game-stage .seat-top-right {
    top: -1% !important;
  }
}

/* Dedicated phone landscape layout.
   This replaces the prior oversized/pannable phone table with a contained canvas
   that is measured from the visible mobile viewport, including Safari browser bars. */
@media (orientation: landscape) and (max-width: 900px), (orientation: landscape) and (max-height: 500px) {
  html,
  body {
    height: 100%;
    min-height: 100svh;
    overflow: hidden !important;
    overscroll-behavior: none;
    width: 100%;
  }

  body:not(.in-lobby) {
    --phone-safe-top: env(safe-area-inset-top, 0px);
    --phone-safe-right: env(safe-area-inset-right, 0px);
    --phone-safe-bottom: env(safe-area-inset-bottom, 0px);
    --phone-safe-left: env(safe-area-inset-left, 0px);
    --phone-vw: min(100dvw, var(--visible-vw, 100dvw));
    --phone-vh: min(100dvh, var(--visible-vh, 100dvh));
    --phone-top-h: clamp(28px, 8.1dvh, 38px);
    --phone-action-h: clamp(42px, 11.2dvh, 56px);
    --phone-gap: clamp(2px, .8dvh, 6px);
    --phone-stage-w: calc(var(--phone-vw) - var(--phone-safe-left) - var(--phone-safe-right));
    --phone-stage-h: calc(var(--phone-vh) - var(--phone-safe-top) - var(--phone-safe-bottom));
    --phone-table-h: calc(var(--phone-stage-h) - var(--phone-top-h) - var(--phone-action-h) - (var(--phone-gap) * 2));
    --phone-seat-w: clamp(58px, 12.1dvw, 88px);
    --phone-seat-mini-w: clamp(48px, 9.6dvw, 72px);
    --phone-card-w: clamp(20px, min(4.15dvw, 7.4dvh), 31px);
    --phone-card-h: calc(var(--phone-card-w) * 1.42);
    --phone-hero-card-w: clamp(28px, min(5.25dvw, 9.2dvh), 40px);
    --phone-hero-card-h: calc(var(--phone-hero-card-w) * 1.42);
    --phone-font-xs: clamp(6px, 1.55dvh, 8px);
    --phone-font-sm: clamp(7px, 1.9dvh, 10px);
    --phone-font-md: clamp(9px, 2.35dvh, 12px);
    height: var(--phone-vh) !important;
    min-height: 100svh;
    padding: 0 !important;
    position: fixed;
    width: 100dvw !important;
  }

  body:not(.in-lobby) .rotate-phone-message {
    display: none !important;
  }

  body:not(.in-lobby) .app-viewport,
  body:not(.in-lobby) .game-viewport {
    box-sizing: border-box;
    height: var(--phone-vh) !important;
    inset: 0 !important;
    max-height: var(--phone-vh) !important;
    max-width: 100dvw !important;
    min-height: 100svh;
    overflow: hidden !important;
    padding:
      var(--phone-safe-top)
      var(--phone-safe-right)
      var(--phone-safe-bottom)
      var(--phone-safe-left) !important;
    position: fixed !important;
    width: 100dvw !important;
  }

  body:not(.in-lobby) .game-stage {
    height: var(--phone-stage-h) !important;
    left: var(--phone-safe-left) !important;
    max-height: var(--phone-stage-h) !important;
    max-width: var(--phone-stage-w) !important;
    overflow: hidden !important;
    position: fixed !important;
    top: var(--phone-safe-top) !important;
    transform: none !important;
    transform-origin: top left !important;
    width: var(--phone-stage-w) !important;
  }

  body:not(.in-lobby) .game-stage .game-shell {
    box-sizing: border-box;
    display: grid !important;
    gap: var(--phone-gap) !important;
    grid-template-areas: "top" "table" "actions" !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: var(--phone-top-h) minmax(0, var(--phone-table-h)) var(--phone-action-h) !important;
    height: var(--phone-stage-h) !important;
    max-height: var(--phone-stage-h) !important;
    overflow: hidden !important;
    padding: 0 !important;
    width: var(--phone-stage-w) !important;
  }

  body:not(.in-lobby) .game-stage .top-bar {
    align-items: center !important;
    border-radius: 0 !important;
    display: grid !important;
    gap: 4px !important;
    grid-area: top !important;
    grid-template-columns: minmax(72px, .55fr) minmax(0, 1.45fr) !important;
    height: var(--phone-top-h) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 2px 4px !important;
  }

  body:not(.in-lobby) .game-stage .top-bar h1 {
    font-size: clamp(10px, 2.7dvh, 14px) !important;
    line-height: 1 !important;
    margin: 0 !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .game-stage .top-bar .eyebrow {
    display: none !important;
  }

  body:not(.in-lobby) .game-stage .score-strip {
    align-items: center !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 3px !important;
    justify-content: flex-end !important;
    max-width: none !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  body:not(.in-lobby) .game-stage .score-strip span {
    display: none !important;
  }

  body:not(.in-lobby) .game-stage .score-strip #topHeaderChips,
  body:not(.in-lobby) .game-stage .score-strip #stageLabel,
  body:not(.in-lobby) .game-stage .score-strip span:nth-of-type(3) {
    display: inline-flex !important;
  }

  body:not(.in-lobby) .game-stage .score-strip span,
  body:not(.in-lobby) .game-stage .score-strip button {
    border-radius: 999px !important;
    flex: 0 1 auto !important;
    font-size: clamp(7px, 1.9dvh, 10px) !important;
    line-height: 1 !important;
    min-height: clamp(22px, 6dvh, 30px) !important;
    min-width: 0 !important;
    padding: 0 6px !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .game-stage #howButton {
    max-width: 42px !important;
  }

  body:not(.in-lobby) .game-stage .table-scene {
    box-sizing: border-box !important;
    grid-area: table !important;
    height: var(--phone-table-h) !important;
    max-height: var(--phone-table-h) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    position: relative !important;
    touch-action: none !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .game-stage .poker-table {
    height: min(56%, calc(var(--phone-table-h) - 82px)) !important;
    left: 50% !important;
    max-height: 58% !important;
    max-width: calc(100% - (var(--phone-seat-w) * 1.25)) !important;
    min-height: 112px !important;
    min-width: 0 !important;
    opacity: .84 !important;
    top: 49% !important;
    transform: translate(-50%, -50%) !important;
    width: min(72%, calc(100% - (var(--phone-seat-w) * 1.35))) !important;
  }

  body:not(.in-lobby) .game-stage .poker-table .rail {
    opacity: .55 !important;
  }

  body:not(.in-lobby) .game-stage .felt {
    box-shadow: inset 0 0 18px rgba(0, 0, 0, .26) !important;
  }

  body:not(.in-lobby) .game-stage .community {
    gap: clamp(2px, .55dvw, 5px) !important;
    left: 50% !important;
    min-height: var(--phone-card-h) !important;
    top: 43% !important;
    transform: translate(-50%, -50%) !important;
  }

  body:not(.in-lobby) .game-stage .card,
  body:not(.in-lobby) .game-stage .community .card,
  body:not(.in-lobby) .game-stage .hole-cards .card {
    height: var(--phone-card-h) !important;
    width: var(--phone-card-w) !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card {
    height: var(--phone-hero-card-h) !important;
    width: var(--phone-hero-card-w) !important;
  }

  body:not(.in-lobby) .game-stage .card .corner {
    font-size: clamp(6px, 1.65dvh, 9px) !important;
    line-height: 1 !important;
  }

  body:not(.in-lobby) .game-stage .card .corner small {
    font-size: .72em !important;
  }

  body:not(.in-lobby) .game-stage .card .face,
  body:not(.in-lobby) .game-stage .card .pips,
  body:not(.in-lobby) .game-stage .community .card .pips {
    font-size: clamp(11px, 3.1dvh, 18px) !important;
  }

  body:not(.in-lobby) .game-stage .hole-cards {
    gap: clamp(2px, .55dvw, 5px) !important;
    min-height: var(--phone-card-h) !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom .hole-cards {
    gap: clamp(4px, .85dvw, 8px) !important;
    min-height: var(--phone-hero-card-h) !important;
  }

  body:not(.in-lobby) .game-stage .seat {
    box-sizing: border-box !important;
    gap: 1px !important;
    max-width: var(--phone-seat-w) !important;
    min-width: 0 !important;
    overflow: visible !important;
    position: absolute !important;
    width: var(--phone-seat-w) !important;
  }

  body:not(.in-lobby) .game-stage .seat-top,
  body:not(.in-lobby) .game-stage .seat-top-left,
  body:not(.in-lobby) .game-stage .seat-top-right,
  body:not(.in-lobby) .game-stage .seat-left-upper,
  body:not(.in-lobby) .game-stage .seat-right-upper {
    max-width: var(--phone-seat-mini-w) !important;
    width: var(--phone-seat-mini-w) !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom {
    bottom: 1.5% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 36 !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom-left {
    bottom: 5.5% !important;
    left: 22% !important;
    transform: translateX(-50%) !important;
    z-index: 28 !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom-right {
    bottom: 5.5% !important;
    left: 78% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    z-index: 28 !important;
  }

  body:not(.in-lobby) .game-stage .seat-left-lower {
    left: 2.5% !important;
    top: 63% !important;
    transform: translateY(-50%) !important;
    z-index: 24 !important;
  }

  body:not(.in-lobby) .game-stage .seat-right-lower {
    left: auto !important;
    right: 2.5% !important;
    top: 63% !important;
    transform: translateY(-50%) !important;
    z-index: 24 !important;
  }

  body:not(.in-lobby) .game-stage .seat-left-upper {
    left: 3% !important;
    top: 32% !important;
    transform: translateY(-50%) !important;
    z-index: 20 !important;
  }

  body:not(.in-lobby) .game-stage .seat-right-upper {
    left: auto !important;
    right: 3% !important;
    top: 32% !important;
    transform: translateY(-50%) !important;
    z-index: 20 !important;
  }

  body:not(.in-lobby) .game-stage .seat-top-left {
    left: 31% !important;
    top: 2% !important;
    transform: translateX(-50%) !important;
    z-index: 22 !important;
  }

  body:not(.in-lobby) .game-stage .seat-top {
    left: 50% !important;
    top: 1% !important;
    transform: translateX(-50%) !important;
    z-index: 22 !important;
  }

  body:not(.in-lobby) .game-stage .seat-top-right {
    left: 69% !important;
    right: auto !important;
    top: 2% !important;
    transform: translateX(-50%) !important;
    z-index: 22 !important;
  }

  body:not(.in-lobby) .game-stage .player-nameplate {
    border-radius: 4px !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    padding: 2px 3px !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .game-stage .player-nameplate strong {
    display: block !important;
    font-size: var(--phone-font-sm) !important;
    line-height: 1.05 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .game-stage .player-nameplate span,
  body:not(.in-lobby) .game-stage .status-pill,
  body:not(.in-lobby) .game-stage .hand-readout,
  body:not(.in-lobby) .game-stage .action-pop,
  body:not(.in-lobby) .game-stage .turn-label {
    font-size: var(--phone-font-xs) !important;
    line-height: 1.05 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    padding: 1px 3px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .game-stage .player-avatar,
  body:not(.in-lobby) .game-stage .seat-timer,
  body:not(.in-lobby) .game-stage .turn-timer {
    display: none !important;
  }

  body:not(.in-lobby) .game-stage .action-pop::after {
    display: none !important;
  }

  body:not(.in-lobby) .game-stage .turn-spotlight::before {
    display: none !important;
  }

  body:not(.in-lobby) .game-stage .pot-stack {
    bottom: 18% !important;
  }

  body:not(.in-lobby) .game-stage .pot-stack span,
  body:not(.in-lobby) .game-stage #potCenter {
    font-size: var(--phone-font-md) !important;
    padding: 2px 7px !important;
  }

  body:not(.in-lobby) .game-stage .result-banner {
    font-size: var(--phone-font-sm) !important;
    left: 50% !important;
    max-width: 44dvw !important;
    padding: 2px 7px !important;
    top: 65% !important;
    transform: translateX(-50%) !important;
  }

  body:not(.in-lobby) .game-stage .winner-banner {
    max-height: calc(var(--phone-table-h) - 20px) !important;
    max-width: min(72dvw, 420px) !important;
    padding: 8px !important;
    top: 39% !important;
  }

  body:not(.in-lobby) .game-stage .reveal-overlay,
  body:not(.in-lobby) .game-stage .turn-callout {
    font-size: clamp(12px, 3.6dvh, 20px) !important;
    max-width: 58dvw !important;
    padding: 6px 10px !important;
  }

  body:not(.in-lobby) .game-stage .odds-panel,
  body:not(.in-lobby) .game-stage .message-log {
    display: none !important;
  }

  body:not(.in-lobby) .game-stage .action-panel {
    align-items: center !important;
    background: linear-gradient(180deg, rgba(3,8,26,.88), rgba(3,8,26,.98)) !important;
    box-sizing: border-box !important;
    display: flex !important;
    grid-area: actions !important;
    height: var(--phone-action-h) !important;
    left: 0 !important;
    max-height: var(--phone-action-h) !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 3px 6px !important;
    position: relative !important;
    right: auto !important;
    top: auto !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .game-stage .controls {
    align-items: center !important;
    display: grid !important;
    gap: clamp(3px, .8dvw, 6px) !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    height: calc(var(--phone-action-h) - 6px) !important;
    margin: 0 auto !important;
    max-height: calc(var(--phone-action-h) - 6px) !important;
    max-width: min(100%, 620px) !important;
    padding: 0 !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .game-stage .controls button {
    border-radius: 999px !important;
    font-size: clamp(10px, 2.7dvh, 14px) !important;
    height: calc(var(--phone-action-h) - 10px) !important;
    line-height: 1 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 6px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body:not(.in-lobby) .game-stage .controls.status-only,
  body:not(.in-lobby) .game-stage .controls.seat-pending {
    grid-template-columns: minmax(0, 1fr) !important;
    max-width: min(72dvw, 360px) !important;
  }

  body:not(.in-lobby) .game-stage .controls.status-only .utility-action,
  body:not(.in-lobby) .game-stage .controls.seat-pending .utility-action {
    display: block !important;
    font-size: clamp(10px, 2.65dvh, 14px) !important;
    height: calc(var(--phone-action-h) - 10px) !important;
    min-height: 0 !important;
    padding: 0 10px !important;
    position: static !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .game-stage .bet-sizing,
  body:not(.in-lobby) .game-stage .bet-sizing.show {
    bottom: calc(var(--phone-action-h) + 4px) !important;
    box-sizing: border-box !important;
    left: 50% !important;
    max-height: calc(var(--phone-table-h) - 14px) !important;
    max-width: min(92dvw, 420px) !important;
    overflow-y: auto !important;
    padding: 8px !important;
    position: fixed !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    width: min(92dvw, 420px) !important;
    z-index: 70010 !important;
  }

  body:not(.in-lobby) .game-stage .bet-sizing button {
    min-height: 34px !important;
  }

  body:not(.in-lobby) .game-stage .chat-panel {
    bottom: calc(var(--phone-action-h) + var(--phone-safe-bottom) + 4px) !important;
    max-height: calc(var(--phone-stage-h) - var(--phone-top-h) - var(--phone-action-h) - 8px) !important;
    right: max(4px, var(--phone-safe-right)) !important;
    width: min(300px, calc(100dvw - var(--phone-safe-left) - var(--phone-safe-right) - 10px)) !important;
  }
}

@media (orientation: landscape) and (max-width: 740px), (orientation: landscape) and (max-height: 390px) {
  body:not(.in-lobby) {
    --phone-top-h: clamp(25px, 7.5dvh, 32px);
    --phone-action-h: clamp(38px, 10.6dvh, 48px);
    --phone-seat-w: clamp(50px, 11.6dvw, 72px);
    --phone-seat-mini-w: clamp(42px, 9.1dvw, 60px);
    --phone-card-w: clamp(18px, min(3.8dvw, 6.6dvh), 27px);
    --phone-hero-card-w: clamp(24px, min(4.9dvw, 8.2dvh), 34px);
  }

  body:not(.in-lobby) .game-stage .top-bar {
    grid-template-columns: 0 minmax(0, 1fr) !important;
    padding-inline: 3px !important;
  }

  body:not(.in-lobby) .game-stage .top-bar > div:first-child {
    display: none !important;
  }

  body:not(.in-lobby) .game-stage .score-strip #topHeaderChips {
    display: none !important;
  }

  body:not(.in-lobby) .game-stage .score-strip {
    justify-content: center !important;
  }

  body:not(.in-lobby) .game-stage #chatButton,
  body:not(.in-lobby) .game-stage #lobbyButton,
  body:not(.in-lobby) .game-stage #howButton,
  body:not(.in-lobby) .game-stage #menuButton {
    max-width: 46px !important;
    padding-inline: 5px !important;
  }

  body:not(.in-lobby) .game-stage .poker-table {
    height: min(52%, calc(var(--phone-table-h) - 72px)) !important;
    min-height: 96px !important;
    width: min(66%, calc(100% - (var(--phone-seat-w) * 1.4))) !important;
  }

  body:not(.in-lobby) .game-stage .seat-top-left {
    left: 30% !important;
  }

  body:not(.in-lobby) .game-stage .seat-top-right {
    left: 70% !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom-left {
    left: 21% !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom-right {
    left: 79% !important;
  }
}

@media (orientation: landscape) and (max-width: 900px), (orientation: landscape) and (max-height: 500px) {
  body:not(.in-lobby) .app-viewport,
  body:not(.in-lobby) .game-viewport {
    --phone-safe-top: env(safe-area-inset-top, 0px);
    --phone-safe-right: env(safe-area-inset-right, 0px);
    --phone-safe-bottom: env(safe-area-inset-bottom, 0px);
    --phone-safe-left: env(safe-area-inset-left, 0px);
    --phone-vw: min(100dvw, var(--visible-vw, 100dvw));
    --phone-vh: min(100dvh, var(--visible-vh, 100dvh));
    --phone-top-h: clamp(28px, 8.1dvh, 38px);
    --phone-action-h: clamp(42px, 11.2dvh, 56px);
    --phone-gap: clamp(2px, .8dvh, 6px);
    --phone-stage-w: calc(var(--phone-vw) - var(--phone-safe-left) - var(--phone-safe-right));
    --phone-stage-h: calc(var(--phone-vh) - var(--phone-safe-top) - var(--phone-safe-bottom));
    --phone-table-h: calc(var(--phone-stage-h) - var(--phone-top-h) - var(--phone-action-h) - (var(--phone-gap) * 2));
    --phone-seat-w: clamp(58px, 12.1dvw, 88px);
    --phone-seat-mini-w: clamp(48px, 9.6dvw, 72px);
    --phone-card-w: clamp(20px, min(4.15dvw, 7.4dvh), 31px);
    --phone-card-h: calc(var(--phone-card-w) * 1.42);
    --phone-hero-card-w: clamp(28px, min(5.25dvw, 9.2dvh), 40px);
    --phone-hero-card-h: calc(var(--phone-hero-card-w) * 1.42);
    --phone-font-xs: clamp(6px, 1.55dvh, 8px);
    --phone-font-sm: clamp(7px, 1.9dvh, 10px);
    --phone-font-md: clamp(9px, 2.35dvh, 12px);
  }

  body:not(.in-lobby) .game-stage .score-strip button,
  body:not(.in-lobby) .game-stage .chat-toggle {
    bottom: auto !important;
    left: auto !important;
    position: static !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    width: auto !important;
  }

  body:not(.in-lobby) .game-stage .score-strip {
    padding-left: 0 !important;
  }
}

@media (orientation: landscape) and (max-width: 740px), (orientation: landscape) and (max-height: 390px) {
  body:not(.in-lobby) .app-viewport,
  body:not(.in-lobby) .game-viewport {
    --phone-top-h: clamp(25px, 7.5dvh, 32px);
    --phone-action-h: clamp(38px, 10.6dvh, 48px);
    --phone-seat-w: clamp(50px, 11.6dvw, 72px);
    --phone-seat-mini-w: clamp(42px, 9.1dvw, 60px);
    --phone-card-w: clamp(18px, min(3.8dvw, 6.6dvh), 27px);
    --phone-card-h: calc(var(--phone-card-w) * 1.42);
    --phone-hero-card-w: clamp(24px, min(4.9dvw, 8.2dvh), 34px);
    --phone-hero-card-h: calc(var(--phone-hero-card-w) * 1.42);
  }
}

:root {
  --safe-top-js: env(safe-area-inset-top, 0px);
  --safe-right-js: env(safe-area-inset-right, 0px);
  --safe-bottom-js: env(safe-area-inset-bottom, 0px);
  --safe-left-js: env(safe-area-inset-left, 0px);
  --mobile-board-scale: 1;
  --mobile-board-left: 0px;
  --mobile-board-top: 0px;
}

/* Separate phone-landscape board. The app uses JS to scale this 900x430 board
   against the actual visible Safari/Android viewport. */
body.phone-landscape:not(.in-lobby) {
  background: #050b18 !important;
  height: 100svh !important;
  height: 100dvh !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: fixed !important;
  width: 100dvw !important;
}

body.phone-landscape:not(.in-lobby) .app-viewport,
body.phone-landscape:not(.in-lobby) .game-viewport {
  height: 100svh !important;
  height: 100dvh !important;
  inset: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: fixed !important;
  width: 100dvw !important;
}

body.phone-landscape:not(.in-lobby) .game-stage {
  background:
    radial-gradient(circle at 50% 46%, rgba(39, 231, 255, .08), transparent 38%),
    linear-gradient(180deg, rgba(5, 11, 24, .98), rgba(3, 8, 20, 1));
  box-sizing: border-box !important;
  height: 430px !important;
  left: var(--mobile-board-left) !important;
  overflow: hidden !important;
  position: fixed !important;
  top: var(--mobile-board-top) !important;
  transform: scale(var(--mobile-board-scale)) !important;
  transform-origin: top left !important;
  width: 900px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .game-shell {
  box-sizing: border-box !important;
  display: grid !important;
  gap: 4px !important;
  grid-template-areas: "top" "table" "actions" !important;
  grid-template-columns: 900px !important;
  grid-template-rows: 34px 330px 58px !important;
  height: 430px !important;
  max-height: 430px !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  width: 900px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .top-bar {
  align-items: center !important;
  background: rgba(5, 12, 27, .96) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: grid !important;
  gap: 6px !important;
  grid-area: top !important;
  grid-template-columns: 185px minmax(0, 1fr) !important;
  height: 34px !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 3px 6px !important;
  width: 900px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .top-bar .eyebrow {
  display: none !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .top-bar h1 {
  display: block !important;
  font-size: 13px !important;
  line-height: 1 !important;
  margin: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .score-strip {
  align-items: center !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 5px !important;
  height: 28px !important;
  justify-content: flex-end !important;
  min-width: 0 !important;
  overflow: hidden !important;
  width: 100% !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .score-strip span {
  display: none !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .score-strip #stageLabel,
body.phone-landscape:not(.in-lobby) .game-stage .score-strip span:nth-of-type(3) {
  align-items: center !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  font-size: 10px !important;
  height: 26px !important;
  line-height: 1 !important;
  padding: 0 8px !important;
  white-space: nowrap !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .score-strip button,
body.phone-landscape:not(.in-lobby) .game-stage #chatButton,
body.phone-landscape:not(.in-lobby) .game-stage #lobbyButton,
body.phone-landscape:not(.in-lobby) .game-stage #howButton,
body.phone-landscape:not(.in-lobby) .game-stage #menuButton {
  align-items: center !important;
  align-self: center !important;
  border-radius: 999px !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  flex: 0 0 72px !important;
  font-size: 11px !important;
  height: 26px !important;
  justify-content: center !important;
  line-height: 1 !important;
  margin: 0 !important;
  max-width: 72px !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding: 0 7px !important;
  position: static !important;
  text-overflow: ellipsis !important;
  transform: none !important;
  white-space: nowrap !important;
  width: 72px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage #chatUnreadBadge {
  display: none !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .table-scene {
  background:
    radial-gradient(ellipse at center, rgba(14, 100, 77, .16), transparent 52%),
    linear-gradient(180deg, rgba(4, 11, 26, .2), rgba(4, 11, 26, .58));
  box-sizing: border-box !important;
  grid-area: table !important;
  height: 330px !important;
  max-height: 330px !important;
  min-height: 0 !important;
  overflow: hidden !important;
  position: relative !important;
  touch-action: none !important;
  width: 900px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .poker-table {
  height: 212px !important;
  left: 50% !important;
  max-height: none !important;
  max-width: none !important;
  min-height: 0 !important;
  min-width: 0 !important;
  opacity: .9 !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 560px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .poker-table .rail {
  opacity: .58 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .community {
  gap: 7px !important;
  left: 50% !important;
  min-height: 62px !important;
  top: 44% !important;
  transform: translate(-50%, -50%) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .card,
body.phone-landscape:not(.in-lobby) .game-stage .community .card,
body.phone-landscape:not(.in-lobby) .game-stage .hole-cards .card {
  border-radius: 5px !important;
  font-size: 18px !important;
  height: 55px !important;
  width: 38px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card {
  height: 74px !important;
  width: 52px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .card .corner {
  font-size: 9px !important;
  line-height: 1 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .card .face,
body.phone-landscape:not(.in-lobby) .game-stage .card .pips,
body.phone-landscape:not(.in-lobby) .game-stage .community .card .pips {
  font-size: 19px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .hole-cards {
  gap: 5px !important;
  min-height: 56px !important;
  transform: none !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom .hole-cards {
  gap: 8px !important;
  min-height: 76px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat {
  box-sizing: border-box !important;
  gap: 2px !important;
  max-width: 104px !important;
  min-width: 0 !important;
  overflow: visible !important;
  position: absolute !important;
  width: 104px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-top,
body.phone-landscape:not(.in-lobby) .game-stage .seat-top-left,
body.phone-landscape:not(.in-lobby) .game-stage .seat-top-right,
body.phone-landscape:not(.in-lobby) .game-stage .seat-left-upper,
body.phone-landscape:not(.in-lobby) .game-stage .seat-right-upper {
  max-width: 92px !important;
  width: 92px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-top .hole-cards,
body.phone-landscape:not(.in-lobby) .game-stage .seat-top-left .hole-cards,
body.phone-landscape:not(.in-lobby) .game-stage .seat-top-right .hole-cards,
body.phone-landscape:not(.in-lobby) .game-stage .seat-left-upper .hole-cards,
body.phone-landscape:not(.in-lobby) .game-stage .seat-right-upper .hole-cards {
  transform: none !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom {
  bottom: 4px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  z-index: 44 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom-left {
  bottom: 24px !important;
  left: 210px !important;
  transform: translateX(-50%) !important;
  z-index: 34 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom-right {
  bottom: 24px !important;
  left: 690px !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  z-index: 34 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-left-lower {
  left: 18px !important;
  top: 214px !important;
  transform: translateY(-50%) !important;
  z-index: 30 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-right-lower {
  left: auto !important;
  right: 18px !important;
  top: 214px !important;
  transform: translateY(-50%) !important;
  z-index: 30 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-left-upper {
  left: 28px !important;
  top: 98px !important;
  transform: translateY(-50%) !important;
  z-index: 24 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-right-upper {
  left: auto !important;
  right: 28px !important;
  top: 98px !important;
  transform: translateY(-50%) !important;
  z-index: 24 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-top-left {
  left: 300px !important;
  top: 6px !important;
  transform: translateX(-50%) !important;
  z-index: 28 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-top {
  left: 450px !important;
  top: 2px !important;
  transform: translateX(-50%) !important;
  z-index: 28 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-top-right {
  left: 600px !important;
  right: auto !important;
  top: 6px !important;
  transform: translateX(-50%) !important;
  z-index: 28 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .player-nameplate {
  border-radius: 5px !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding: 3px 4px !important;
  width: 100% !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .player-nameplate strong {
  display: block !important;
  font-size: 12px !important;
  line-height: 1.05 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .player-nameplate span,
body.phone-landscape:not(.in-lobby) .game-stage .status-pill,
body.phone-landscape:not(.in-lobby) .game-stage .hand-readout,
body.phone-landscape:not(.in-lobby) .game-stage .action-pop,
body.phone-landscape:not(.in-lobby) .game-stage .turn-label {
  font-size: 9px !important;
  line-height: 1.05 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  padding: 2px 4px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .player-avatar,
body.phone-landscape:not(.in-lobby) .game-stage .seat-timer,
body.phone-landscape:not(.in-lobby) .game-stage .turn-timer,
body.phone-landscape:not(.in-lobby) .game-stage .turn-spotlight::before,
body.phone-landscape:not(.in-lobby) .game-stage .action-pop::after {
  display: none !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .pot-stack {
  bottom: 19% !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .pot-stack span,
body.phone-landscape:not(.in-lobby) .game-stage #potCenter {
  font-size: 13px !important;
  padding: 3px 10px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .result-banner {
  font-size: 10px !important;
  left: 50% !important;
  max-width: 260px !important;
  padding: 3px 8px !important;
  top: 65% !important;
  transform: translateX(-50%) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .odds-panel,
body.phone-landscape:not(.in-lobby) .game-stage .message-log {
  display: none !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .action-panel {
  align-items: center !important;
  background: linear-gradient(180deg, rgba(3, 8, 26, .92), rgba(3, 8, 26, 1)) !important;
  box-sizing: border-box !important;
  display: flex !important;
  grid-area: actions !important;
  height: 58px !important;
  left: 0 !important;
  max-height: 58px !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 5px 10px !important;
  pointer-events: none !important;
  position: relative !important;
  right: auto !important;
  top: auto !important;
  width: 900px !important;
  z-index: 80 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .controls {
  align-items: stretch !important;
  display: grid !important;
  gap: 8px !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  height: 48px !important;
  margin: 0 auto !important;
  max-height: 48px !important;
  max-width: 560px !important;
  padding: 0 !important;
  pointer-events: auto !important;
  width: 560px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .controls button {
  border-radius: 999px !important;
  font-size: 14px !important;
  height: 48px !important;
  line-height: 1 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 0 10px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .controls.status-only,
body.phone-landscape:not(.in-lobby) .game-stage .controls.seat-pending {
  grid-template-columns: minmax(0, 1fr) !important;
  max-width: 420px !important;
  width: 420px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .controls.status-only .utility-action,
body.phone-landscape:not(.in-lobby) .game-stage .controls.seat-pending .utility-action {
  display: block !important;
  font-size: 14px !important;
  height: 48px !important;
  min-height: 0 !important;
  padding: 0 12px !important;
  position: static !important;
  width: 100% !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .bet-sizing,
body.phone-landscape:not(.in-lobby) .game-stage .bet-sizing.show {
  bottom: 62px !important;
  box-sizing: border-box !important;
  left: 50% !important;
  max-height: 260px !important;
  max-width: 430px !important;
  overflow-y: auto !important;
  padding: 10px !important;
  position: fixed !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  width: 430px !important;
  z-index: 70010 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .chat-panel {
  bottom: 64px !important;
  max-height: 300px !important;
  right: 8px !important;
  width: 300px !important;
}

body.mobile-debug:not(.in-lobby) .app-viewport,
body.mobile-debug:not(.in-lobby) .game-stage,
body.mobile-debug:not(.in-lobby) .game-shell,
body.mobile-debug:not(.in-lobby) .top-bar,
body.mobile-debug:not(.in-lobby) .table-scene,
body.mobile-debug:not(.in-lobby) .poker-table,
body.mobile-debug:not(.in-lobby) .action-panel,
body.mobile-debug:not(.in-lobby) .seat {
  outline: 2px solid rgba(255, 51, 102, .75) !important;
  outline-offset: -2px !important;
}

body.mobile-debug:not(.in-lobby) .table-scene {
  background-image:
    linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px) !important;
  background-size: 40px 40px !important;
}

/* Reveal/action prompt safety layer: prompts must never sit behind seats,
   nameplates, cards, chips, or mobile board overlays. */
body:not(.in-lobby) .game-stage .reveal-overlay,
body:not(.in-lobby) .game-stage .turn-callout {
  pointer-events: none !important;
  z-index: 90000 !important;
}

body:not(.in-lobby) .game-stage .reveal-overlay.show {
  left: 50% !important;
  max-width: min(78vw, 34rem) !important;
  top: max(76px, 18%) !important;
  transform: translate(-50%, 0) !important;
}

body:not(.in-lobby) .game-stage .turn-callout.show {
  background: linear-gradient(180deg, rgba(255,228,92,.98), rgba(255,159,67,.98)) !important;
  border: 2px solid rgba(255,255,255,.82) !important;
  box-shadow: 0 16px 34px rgba(0,0,0,.48), 0 0 0 4px rgba(255,228,92,.2) !important;
  color: #160d12 !important;
  margin: 0 auto !important;
  max-width: min(72vw, 22rem) !important;
  min-width: 10rem !important;
  padding: .48rem .85rem !important;
}

body:not(.in-lobby) .game-stage .seat,
body:not(.in-lobby) .game-stage .player-nameplate,
body:not(.in-lobby) .game-stage .hole-cards,
body:not(.in-lobby) .game-stage .bankroll-stack,
body:not(.in-lobby) .game-stage .player-bet-stack {
  z-index: auto;
}

body.phone-landscape:not(.in-lobby) .game-stage .reveal-overlay.show {
  top: 34px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .turn-callout.show {
  font-size: 12px !important;
  left: 50% !important;
  max-width: 280px !important;
  min-width: 150px !important;
  padding: 5px 10px !important;
  top: 36px !important;
  transform: translateX(-50%) !important;
}

.reload-card .legal-close {
  justify-self: end;
}

#reloadNotNowButton {
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.2);
  color: var(--text);
}

/* Final scaled-board takeover.
   One viewport wrapper, one board, one transform scale. This intentionally wins
   over all earlier mobile/tablet overrides. */
body.scaled-game-board:not(.in-lobby),
body.scaled-game-board:not(.in-lobby) .app-viewport,
body.scaled-game-board:not(.in-lobby) .game-viewport {
  height: 100svh !important;
  height: 100dvh !important;
  inset: 0 !important;
  max-height: 100dvh !important;
  max-width: 100dvw !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: fixed !important;
  width: 100dvw !important;
}

body.phone-landscape:not(.in-lobby) .game-stage {
  height: 344px !important;
  width: 820px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .game-shell {
  display: grid !important;
  gap: 4px !important;
  grid-template-areas: "top" "table" "actions" !important;
  grid-template-columns: 820px !important;
  grid-template-rows: 28px 258px 50px !important;
  height: 344px !important;
  max-height: 344px !important;
  overflow: hidden !important;
  padding: 0 !important;
  width: 820px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .top-bar {
  display: grid !important;
  gap: 5px !important;
  grid-area: top !important;
  grid-template-columns: 150px minmax(0, 1fr) !important;
  height: 28px !important;
  overflow: hidden !important;
  padding: 3px 6px !important;
  width: 820px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .top-bar h1 {
  display: block !important;
  font-size: 11px !important;
  line-height: 1 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .top-bar .eyebrow {
  display: none !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .score-strip {
  align-items: center !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 4px !important;
  height: 22px !important;
  justify-content: flex-end !important;
  overflow: hidden !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .score-strip span {
  display: none !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .score-strip #stageLabel,
body.phone-landscape:not(.in-lobby) .game-stage .score-strip span:nth-of-type(3) {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  font-size: 9px !important;
  height: 20px !important;
  padding: 0 7px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .score-strip button,
body.phone-landscape:not(.in-lobby) .game-stage #chatButton,
body.phone-landscape:not(.in-lobby) .game-stage #lobbyButton,
body.phone-landscape:not(.in-lobby) .game-stage #howButton,
body.phone-landscape:not(.in-lobby) .game-stage #menuButton {
  display: inline-flex !important;
  flex: 0 0 64px !important;
  font-size: 10px !important;
  height: 20px !important;
  line-height: 1 !important;
  margin: 0 !important;
  max-width: 64px !important;
  min-height: 0 !important;
  padding: 0 5px !important;
  position: static !important;
  transform: none !important;
  width: 64px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .table-scene {
  grid-area: table !important;
  height: 258px !important;
  max-height: 258px !important;
  overflow: hidden !important;
  width: 820px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .poker-table {
  height: 168px !important;
  left: 50% !important;
  top: 47% !important;
  transform: translate(-50%, -50%) !important;
  width: 520px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .community {
  gap: 7px !important;
  top: 42% !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .card,
body.phone-landscape:not(.in-lobby) .game-stage .community .card,
body.phone-landscape:not(.in-lobby) .game-stage .hole-cards .card {
  height: 56px !important;
  width: 39px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card {
  height: 78px !important;
  width: 55px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat {
  gap: 1px !important;
  max-width: 98px !important;
  width: 98px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-top,
body.phone-landscape:not(.in-lobby) .game-stage .seat-top-left,
body.phone-landscape:not(.in-lobby) .game-stage .seat-top-right,
body.phone-landscape:not(.in-lobby) .game-stage .seat-left-upper,
body.phone-landscape:not(.in-lobby) .game-stage .seat-right-upper {
  max-width: 86px !important;
  width: 86px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom { bottom: 4px !important; left: 50% !important; transform: translateX(-50%) !important; }
body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom-left { bottom: 18px !important; left: 188px !important; transform: translateX(-50%) !important; }
body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom-right { bottom: 18px !important; left: 632px !important; right: auto !important; transform: translateX(-50%) !important; }
body.phone-landscape:not(.in-lobby) .game-stage .seat-left-lower { left: 14px !important; top: 166px !important; transform: translateY(-50%) !important; }
body.phone-landscape:not(.in-lobby) .game-stage .seat-right-lower { left: auto !important; right: 14px !important; top: 166px !important; transform: translateY(-50%) !important; }
body.phone-landscape:not(.in-lobby) .game-stage .seat-left-upper { left: 22px !important; top: 72px !important; transform: translateY(-50%) !important; }
body.phone-landscape:not(.in-lobby) .game-stage .seat-right-upper { left: auto !important; right: 22px !important; top: 72px !important; transform: translateY(-50%) !important; }
body.phone-landscape:not(.in-lobby) .game-stage .seat-top-left { left: 272px !important; top: 4px !important; transform: translateX(-50%) !important; }
body.phone-landscape:not(.in-lobby) .game-stage .seat-top { left: 410px !important; top: 1px !important; transform: translateX(-50%) !important; }
body.phone-landscape:not(.in-lobby) .game-stage .seat-top-right { left: 548px !important; right: auto !important; top: 4px !important; transform: translateX(-50%) !important; }

body.phone-landscape:not(.in-lobby) .game-stage .player-nameplate strong {
  font-size: 11px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .player-nameplate span,
body.phone-landscape:not(.in-lobby) .game-stage .status-pill,
body.phone-landscape:not(.in-lobby) .game-stage .hand-readout,
body.phone-landscape:not(.in-lobby) .game-stage .action-pop,
body.phone-landscape:not(.in-lobby) .game-stage .turn-label {
  font-size: 8.5px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .action-panel {
  grid-area: actions !important;
  height: 50px !important;
  max-height: 50px !important;
  padding: 5px 10px !important;
  position: relative !important;
  width: 820px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .controls {
  gap: 7px !important;
  height: 38px !important;
  max-height: 38px !important;
  max-width: 520px !important;
  width: 520px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .controls button {
  font-size: 13px !important;
  height: 38px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .controls.status-only,
body.phone-landscape:not(.in-lobby) .game-stage .controls.seat-pending {
  max-width: 390px !important;
  width: 390px !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage {
  height: 690px !important;
  width: 1180px !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .game-shell {
  grid-template-columns: 1180px !important;
  grid-template-rows: 58px 548px 76px !important;
  height: 690px !important;
  max-height: 690px !important;
  padding: 0 !important;
  width: 1180px !important;
}

@media (orientation: landscape) and (max-width: 900px), (orientation: landscape) and (max-height: 500px) {
  body:not(.in-lobby) .game-stage .top-bar {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body:not(.in-lobby) .game-stage .top-bar > div:first-child {
    display: none !important;
  }

  body:not(.in-lobby) .game-stage .score-strip {
    align-items: stretch !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    grid-column: 1 / -1 !important;
    height: 100% !important;
    justify-content: stretch !important;
    overflow: hidden !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .game-stage .score-strip span {
    display: none !important;
  }

  body:not(.in-lobby) .game-stage .score-strip button,
  body:not(.in-lobby) .game-stage #chatButton,
  body:not(.in-lobby) .game-stage #lobbyButton,
  body:not(.in-lobby) .game-stage #howButton,
  body:not(.in-lobby) .game-stage #menuButton {
    align-self: center !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    flex: 1 1 0 !important;
    grid-row: auto !important;
    height: calc(var(--phone-top-h) - 6px) !important;
    justify-content: center !important;
    line-height: 1 !important;
    margin: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    min-width: 0 !important;
    overflow: hidden !important;
    padding: 0 4px !important;
    text-overflow: ellipsis !important;
    vertical-align: middle !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .game-stage #chatUnreadBadge {
    display: none !important;
  }
}

/* Mobile/table seat visibility master override. Keep the table artwork behind
   gameplay UI and reserve clear space for local cards/actions. */
body:not(.in-lobby) .game-stage,
body:not(.in-lobby) .game-stage .game-shell {
  box-sizing: border-box !important;
}

body:not(.in-lobby) .game-stage .table-scene {
  isolation: isolate !important;
  overflow: visible !important;
  position: relative !important;
}

body:not(.in-lobby) .game-stage .poker-table,
body:not(.in-lobby) .game-stage .poker-table .felt,
body:not(.in-lobby) .game-stage .poker-table .rail,
body:not(.in-lobby) .game-stage .table-felt,
body:not(.in-lobby) .game-stage .table-graphic {
  position: absolute !important;
  z-index: 1 !important;
}

body:not(.in-lobby) .game-stage .community,
body:not(.in-lobby) .game-stage .pot-stack,
body:not(.in-lobby) .game-stage .bankroll-stack,
body:not(.in-lobby) .game-stage .player-bet-stack,
body:not(.in-lobby) .game-stage .dealer-chip,
body:not(.in-lobby) .game-stage .blind-chip {
  z-index: 70 !important;
}

body:not(.in-lobby) .game-stage .seat,
body:not(.in-lobby) .game-stage .player-seat,
body:not(.in-lobby) .game-stage .seat-badge {
  overflow: visible !important;
  pointer-events: auto !important;
  position: absolute !important;
  z-index: 120 !important;
}

body:not(.in-lobby) .game-stage .seat *,
body:not(.in-lobby) .game-stage .player-seat * {
  position: relative;
  z-index: 121;
}

body:not(.in-lobby) .game-stage .player-nameplate,
body:not(.in-lobby) .game-stage .player-info,
body:not(.in-lobby) .game-stage .player-stack,
body:not(.in-lobby) .game-stage .hole-cards,
body:not(.in-lobby) .game-stage .status-pill,
body:not(.in-lobby) .game-stage .hand-readout {
  overflow: visible !important;
  z-index: 135 !important;
}

body:not(.in-lobby) .game-stage .seat-bottom,
body:not(.in-lobby) .game-stage .seat-bottom-left,
body:not(.in-lobby) .game-stage .seat-bottom-right {
  z-index: 160 !important;
}

body:not(.in-lobby) .game-stage .seat-bottom .hole-cards,
body:not(.in-lobby) .game-stage .seat-bottom-left .hole-cards,
body:not(.in-lobby) .game-stage .seat-bottom-right .hole-cards,
body:not(.in-lobby) .game-stage .seat-bottom .player-nameplate,
body:not(.in-lobby) .game-stage .seat-bottom-left .player-nameplate,
body:not(.in-lobby) .game-stage .seat-bottom-right .player-nameplate {
  z-index: 165 !important;
}

body:not(.in-lobby) .game-stage .reveal-overlay,
body:not(.in-lobby) .game-stage .turn-reveal-modal,
body:not(.in-lobby) .game-stage .turn-callout,
body:not(.in-lobby) .game-stage .action-banner {
  z-index: 90000 !important;
}

@media (min-width: 901px) and (pointer: fine) {
  body:not(.in-lobby) .game-stage .seat-left-lower,
  body:not(.in-lobby) .game-stage .seat-left-upper {
    left: clamp(0px, .4vw, 8px) !important;
  }

  body:not(.in-lobby) .game-stage .seat-right-lower,
  body:not(.in-lobby) .game-stage .seat-right-upper {
    right: clamp(0px, .4vw, 8px) !important;
  }
}

body.phone-landscape:not(.in-lobby) .app-viewport,
body.phone-landscape:not(.in-lobby) .game-viewport {
  height: 100svh !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  padding:
    max(2px, env(safe-area-inset-top))
    max(3px, env(safe-area-inset-right))
    max(2px, env(safe-area-inset-bottom))
    max(3px, env(safe-area-inset-left)) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage {
  height: 344px !important;
  max-height: 344px !important;
  transform: scale(var(--mobile-board-scale)) !important;
  transform-origin: center center !important;
  width: 820px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .game-shell {
  display: grid !important;
  gap: 3px !important;
  grid-template-areas: "top" "table" "actions" !important;
  grid-template-columns: 820px !important;
  grid-template-rows: 26px 263px 49px !important;
  height: 344px !important;
  max-height: 344px !important;
  overflow: hidden !important;
  padding: 0 !important;
  width: 820px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .top-bar {
  height: 26px !important;
  min-height: 26px !important;
  padding: 2px 5px !important;
  width: 820px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .score-strip {
  gap: 3px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .score-strip button,
body.phone-landscape:not(.in-lobby) .game-stage #chatButton,
body.phone-landscape:not(.in-lobby) .game-stage #lobbyButton,
body.phone-landscape:not(.in-lobby) .game-stage #howButton,
body.phone-landscape:not(.in-lobby) .game-stage #menuButton {
  font-size: 9px !important;
  height: 20px !important;
  min-width: 0 !important;
  padding: 0 3px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .table-scene {
  grid-area: table !important;
  height: 263px !important;
  max-height: 263px !important;
  min-height: 0 !important;
  overflow: visible !important;
  width: 820px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .poker-table {
  height: 126px !important;
  left: 50% !important;
  max-height: 126px !important;
  top: 34% !important;
  transform: translate(-50%, -50%) !important;
  width: 474px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .community {
  gap: 6px !important;
  top: 35% !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .card,
body.phone-landscape:not(.in-lobby) .game-stage .community .card,
body.phone-landscape:not(.in-lobby) .game-stage .hole-cards .card {
  height: 54px !important;
  width: 38px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card {
  height: 76px !important;
  width: 54px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat {
  gap: 1px !important;
  max-width: 96px !important;
  width: 96px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-top,
body.phone-landscape:not(.in-lobby) .game-stage .seat-top-left,
body.phone-landscape:not(.in-lobby) .game-stage .seat-top-right,
body.phone-landscape:not(.in-lobby) .game-stage .seat-left-upper,
body.phone-landscape:not(.in-lobby) .game-stage .seat-right-upper {
  max-width: 84px !important;
  width: 84px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom {
  bottom: 7px !important;
  left: 50% !important;
  right: auto !important;
  top: auto !important;
  transform: translateX(-50%) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom-left {
  bottom: 27px !important;
  left: 188px !important;
  right: auto !important;
  top: auto !important;
  transform: translateX(-50%) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom-right {
  bottom: 27px !important;
  left: 632px !important;
  right: auto !important;
  top: auto !important;
  transform: translateX(-50%) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-left-lower {
  left: 8px !important;
  right: auto !important;
  top: 166px !important;
  transform: translateY(-50%) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-right-lower {
  left: auto !important;
  right: 8px !important;
  top: 166px !important;
  transform: translateY(-50%) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-left-upper {
  left: 12px !important;
  right: auto !important;
  top: 69px !important;
  transform: translateY(-50%) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-right-upper {
  left: auto !important;
  right: 12px !important;
  top: 69px !important;
  transform: translateY(-50%) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-top-left {
  left: 274px !important;
  top: 4px !important;
  transform: translateX(-50%) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-top {
  left: 410px !important;
  top: 1px !important;
  transform: translateX(-50%) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-top-right {
  left: 546px !important;
  right: auto !important;
  top: 4px !important;
  transform: translateX(-50%) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .player-nameplate {
  padding: 3px 6px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .player-nameplate strong {
  font-size: 10.5px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .player-nameplate span,
body.phone-landscape:not(.in-lobby) .game-stage .status-pill,
body.phone-landscape:not(.in-lobby) .game-stage .hand-readout,
body.phone-landscape:not(.in-lobby) .game-stage .action-pop,
body.phone-landscape:not(.in-lobby) .game-stage .turn-label {
  font-size: 8px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .action-panel {
  grid-area: actions !important;
  height: 49px !important;
  max-height: 49px !important;
  min-height: 0 !important;
  padding: 4px 8px !important;
  position: relative !important;
  width: 820px !important;
  z-index: 400 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .controls {
  gap: 6px !important;
  height: 38px !important;
  max-height: 38px !important;
  max-width: 520px !important;
  min-height: 0 !important;
  width: 520px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .controls button {
  font-size: 12px !important;
  height: 38px !important;
  min-height: 0 !important;
  padding: 0 8px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .controls.status-only,
body.phone-landscape:not(.in-lobby) .game-stage .controls.seat-pending {
  height: 38px !important;
  max-height: 38px !important;
  max-width: 370px !important;
  width: 370px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .controls.status-only .utility-action,
body.phone-landscape:not(.in-lobby) .game-stage .controls.seat-pending .utility-action {
  height: 38px !important;
  max-height: 38px !important;
  min-height: 0 !important;
  padding-bottom: 0 !important;
  padding-top: 0 !important;
}

@media (orientation: portrait) and (max-width: 900px) {
  body:not(.in-lobby) .game-viewport {
    height: 100svh !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
  }
}

/* Mobile/table fullscreen layer. The whole board is refit by app.js so it can
   grow without clipping seats, cards, menus, or action controls. */
:root {
  --table-zoom-scale: 1;
}

body:not(.in-lobby) .game-stage .table-scene {
  transform: none !important;
}

body.table-zoom-active:not(.in-lobby) .game-stage .table-scene {
  cursor: default;
  z-index: 120 !important;
}

body:not(.table-zoom-active):not(.in-lobby) .game-stage .table-scene {
  cursor: default;
}

body:not(.in-lobby) .game-stage .top-bar {
  position: relative;
  z-index: 520 !important;
}

body:not(.in-lobby) .game-stage .action-panel {
  position: relative !important;
  z-index: 620 !important;
}

body.table-zoom-active.phone-landscape:not(.in-lobby) .game-stage .top-bar {
  z-index: 720 !important;
}

body.table-zoom-active.phone-landscape:not(.in-lobby) .game-stage .game-shell {
  grid-template-rows: 26px minmax(0, 1fr) 49px !important;
  height: 100% !important;
  max-height: none !important;
}

body.table-zoom-active.phone-landscape:not(.in-lobby) .game-stage .table-scene {
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
}

body.table-zoom-active.phone-landscape:not(.in-lobby) .game-stage .action-panel,
body.table-zoom-active.phone-landscape:not(.in-lobby) .game-stage .controls,
body.table-zoom-active.phone-landscape:not(.in-lobby) .game-stage .controls button {
  position: relative !important;
  z-index: 760 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .fullscreen-toggle {
  flex: 1 1 0 !important;
  min-width: 0 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage #fullscreenButton.fullscreen-toggle {
  flex: 0 0 112px !important;
  max-width: 112px !important;
  width: 112px !important;
}

body:not(.in-lobby) .game-stage .chat-panel,
body:not(.in-lobby) .game-stage .menu-panel,
body:not(.in-lobby) .game-stage .flyout,
body:not(.in-lobby) .modal,
body:not(.in-lobby) .reload-modal {
  transform: none !important;
}

@media (pointer: coarse) {
  body:not(.in-lobby) .game-stage .table-scene {
    touch-action: none;
  }

  body:not(.in-lobby) .game-stage .action-panel,
  body:not(.in-lobby) .game-stage .chat-panel,
  body:not(.in-lobby) .game-stage .menu-panel,
  body:not(.in-lobby) .game-stage .flyout {
    touch-action: manipulation;
  }
}

/* Final mobile fit guardrail: never let browser/page zoom or stale mobile
   overrides push the transformed board outside the visible viewport. */
html,
body {
  background: #050817;
  height: 100dvh;
  margin: 0;
  max-width: 100vw;
  overflow-x: hidden;
  padding: 0;
  width: 100%;
}

#root {
  background: #050817;
  height: 100dvh;
  margin: 0;
  overflow: hidden;
  padding: 0;
  width: 100%;
}

body.scaled-game-board:not(.in-lobby) {
  height: 100svh !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  max-width: 100dvw !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
  position: fixed !important;
  touch-action: none !important;
  width: 100dvw !important;
}

body.scaled-game-board:not(.in-lobby) .app-viewport,
body.scaled-game-board:not(.in-lobby) .game-viewport {
  box-sizing: border-box !important;
  height: 100svh !important;
  height: 100dvh !important;
  inset: 0 !important;
  max-height: 100dvh !important;
  max-width: 100dvw !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding:
    env(safe-area-inset-top, 0px)
    env(safe-area-inset-right, 0px)
    env(safe-area-inset-bottom, 0px)
    env(safe-area-inset-left, 0px) !important;
  position: fixed !important;
  touch-action: none !important;
  width: 100dvw !important;
}

html:has(body.mobile-table-mode),
html:has(body.mobile-table-mode) body,
body.mobile-table-mode {
  background: #050914 !important;
  height: 100svh !important;
  height: 100dvh !important;
  margin: 0 !important;
  max-height: 100dvh !important;
  max-width: 100dvw !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: fixed !important;
  width: 100vw !important;
}

body.mobile-table-mode:not(.in-lobby) .app-viewport,
body.mobile-table-mode:not(.in-lobby) .game-viewport {
  align-items: center !important;
  background: #050914 !important;
  box-sizing: border-box !important;
  display: flex !important;
  height: 100svh !important;
  height: 100dvh !important;
  inset: 0 !important;
  justify-content: center !important;
  max-height: 100dvh !important;
  max-width: 100dvw !important;
  min-height: 100svh !important;
  overflow: hidden !important;
  padding:
    env(safe-area-inset-top, 0px)
    env(safe-area-inset-right, 0px)
    env(safe-area-inset-bottom, 0px)
    env(safe-area-inset-left, 0px) !important;
  position: fixed !important;
  width: 100vw !important;
}

body.mobile-table-mode:not(.in-lobby) .game-fullscreen-shell {
  background: #050817 !important;
  box-sizing: border-box !important;
  height: 100svh !important;
  height: 100dvh !important;
  inset: 0 !important;
  max-height: 100dvh !important;
  max-width: 100vw !important;
  min-height: 100svh !important;
  overflow: hidden !important;
  padding:
    env(safe-area-inset-top, 0px)
    env(safe-area-inset-right, 0px)
    env(safe-area-inset-bottom, 0px)
    env(safe-area-inset-left, 0px) !important;
  position: fixed !important;
  width: 100vw !important;
  z-index: 999999 !important;
}

body.mobile-table-mode:not(.in-lobby) .poker-table-wrapper {
  align-items: center !important;
  display: flex !important;
  height: 100% !important;
  justify-content: center !important;
  overflow: hidden !important;
  width: 100% !important;
}

body.mobile-table-mode:not(.in-lobby) .poker-table-stage {
  max-height: 100dvh !important;
  max-width: 100vw !important;
}

body.mobile-table-mode:not(.in-lobby) .top-bar,
body.mobile-table-mode:not(.in-lobby) .score-strip,
body.mobile-table-mode:not(.in-lobby) .page-header,
body.mobile-table-mode:not(.in-lobby) .top-tabs,
body.mobile-table-mode:not(.in-lobby) .ad-bar,
body.mobile-table-mode:not(.in-lobby) .browser-spacer,
body.mobile-table-mode:not(.in-lobby) .lobby-screen,
body.mobile-table-mode:not(.in-lobby) .ad-slot,
body.mobile-table-mode:not(.in-lobby) .promo-bar,
body.mobile-table-mode:not(.in-lobby) .site-header,
body.mobile-table-mode:not(.in-lobby) .page-nav {
  display: none !important;
}

body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .game-shell {
  display: grid !important;
  gap: 0 !important;
  grid-template-areas: "table" "actions" !important;
  grid-template-columns: 820px !important;
  grid-template-rows: minmax(0, 1fr) 50px !important;
  height: 100% !important;
  max-height: none !important;
  overflow: hidden !important;
  padding: 0 !important;
  width: 820px !important;
}

body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .table-scene {
  grid-area: table !important;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: visible !important;
  width: 820px !important;
}

body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .action-panel {
  grid-area: actions !important;
  height: 50px !important;
  max-height: 50px !important;
  min-height: 0 !important;
  width: 820px !important;
}

body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .poker-table {
  height: 178px !important;
  top: 45% !important;
  width: 540px !important;
}

body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .community {
  top: 40% !important;
}

body.scaled-game-board:not(.in-lobby) .game-stage {
  box-sizing: border-box !important;
  margin: 0 !important;
  max-width: none !important;
  min-width: 0 !important;
  overflow: visible !important;
  transform-origin: top left !important;
  will-change: transform, left, top !important;
}

body.scaled-game-board:not(.in-lobby) .game-stage .game-shell {
  box-sizing: border-box !important;
  overflow: hidden !important;
}

body.scaled-game-board:not(.in-lobby) .game-stage .table-scene {
  box-sizing: border-box !important;
  touch-action: none !important;
}

body.scaled-game-board:not(.in-lobby) .game-stage .top-bar,
body.scaled-game-board:not(.in-lobby) .game-stage .action-panel,
body.scaled-game-board:not(.in-lobby) .game-stage .controls,
body.scaled-game-board:not(.in-lobby) .game-stage button,
body.scaled-game-board:not(.in-lobby) .game-stage input,
body.scaled-game-board:not(.in-lobby) .game-stage .flyout,
body.scaled-game-board:not(.in-lobby) .game-stage .chat-panel,
body.scaled-game-board:not(.in-lobby) .game-stage .menu-panel {
  touch-action: manipulation !important;
}

body.phone-landscape:not(.in-lobby) .game-stage {
  height: var(--mobile-board-h, 344px) !important;
  left: var(--mobile-board-left, 0px) !important;
  position: fixed !important;
  top: var(--mobile-board-top, 0px) !important;
  transform: scale(var(--mobile-board-scale, 1)) !important;
  transform-origin: top left !important;
  width: 820px !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage {
  height: var(--mobile-board-h, 690px) !important;
  left: var(--mobile-board-left, 0px) !important;
  position: fixed !important;
  top: var(--mobile-board-top, 0px) !important;
  transform: scale(var(--mobile-board-scale, 1)) !important;
  transform-origin: top left !important;
  width: 1180px !important;
}

/* TRUE mobile/tablet table mode: the game stage is the viewport. No miniature
   canvas, no transform fitting, no browser-page layout. */
body.mobile-table-mode:not(.in-lobby),
body.mobile-table-mode:not(.in-lobby) html {
  background: #020617 !important;
  height: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  width: 100% !important;
}

body.mobile-table-mode:not(.in-lobby) .game-table-screen,
body.mobile-table-mode:not(.in-lobby) .game-fullscreen-shell {
  background: #020617 !important;
  box-sizing: border-box !important;
  height: 100svh !important;
  height: 100dvh !important;
  inset: 0 !important;
  max-height: 100dvh !important;
  max-width: 100vw !important;
  min-height: 100svh !important;
  overflow: hidden !important;
  padding:
    env(safe-area-inset-top, 0px)
    env(safe-area-inset-right, 0px)
    env(safe-area-inset-bottom, 0px)
    env(safe-area-inset-left, 0px) !important;
  position: fixed !important;
  width: 100vw !important;
  z-index: 999999 !important;
}

body.mobile-table-mode:not(.in-lobby) .poker-table-stage,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage,
body.mobile-table-mode.tablet-landscape:not(.in-lobby) .game-stage {
  height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  left: env(safe-area-inset-left, 0px) !important;
  max-height: 100dvh !important;
  max-width: 100vw !important;
  min-height: 0 !important;
  overflow: hidden !important;
  position: fixed !important;
  top: env(safe-area-inset-top, 0px) !important;
  transform: none !important;
  transform-origin: center center !important;
  width: calc(100vw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px)) !important;
  zoom: 1 !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .game-shell {
  display: grid !important;
  gap: 0 !important;
  grid-template-areas: "table" "actions" !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) clamp(48px, 13dvh, 66px) !important;
  height: 100% !important;
  max-height: 100% !important;
  overflow: hidden !important;
  padding: 0 !important;
  width: 100% !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .top-bar,
body.mobile-table-mode:not(.in-lobby) .game-stage .score-strip,
body.mobile-table-mode:not(.in-lobby) .game-stage #howPanel,
body.mobile-table-mode:not(.in-lobby) .game-stage #menuPanel {
  display: none !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .table-scene {
  grid-area: table !important;
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: hidden !important;
  position: relative !important;
  width: 100% !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .poker-table {
  height: min(52dvh, 72%) !important;
  left: 50% !important;
  max-height: none !important;
  max-width: 82vw !important;
  top: 49% !important;
  transform: translate(-50%, -50%) !important;
  width: min(78vw, 720px) !important;
  z-index: 1 !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .community {
  gap: clamp(5px, 1.1vw, 10px) !important;
  left: 50% !important;
  top: 44% !important;
  transform: translate(-50%, -50%) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .card,
body.mobile-table-mode:not(.in-lobby) .game-stage .community .card,
body.mobile-table-mode:not(.in-lobby) .game-stage .hole-cards .card {
  height: clamp(48px, 14dvh, 70px) !important;
  width: clamp(34px, 9.8dvh, 50px) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card {
  height: clamp(66px, 19dvh, 94px) !important;
  width: clamp(47px, 13.4dvh, 67px) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .seat {
  gap: 1px !important;
  max-width: clamp(76px, 15vw, 118px) !important;
  overflow: visible !important;
  width: clamp(76px, 15vw, 118px) !important;
  z-index: 120 !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .seat-top-left { left: 34% !important; top: 3% !important; transform: translateX(-50%) !important; }
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-top { left: 50% !important; top: 2% !important; transform: translateX(-50%) !important; }
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-top-right { left: 66% !important; right: auto !important; top: 3% !important; transform: translateX(-50%) !important; }
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-left-upper { left: 1.5% !important; top: 25% !important; transform: none !important; }
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-left-lower { left: 1.5% !important; top: 57% !important; transform: none !important; }
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-right-upper { left: auto !important; right: 1.5% !important; top: 25% !important; transform: none !important; }
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-right-lower { left: auto !important; right: 1.5% !important; top: 57% !important; transform: none !important; }
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom-left { bottom: 2% !important; left: 25% !important; top: auto !important; transform: translateX(-50%) !important; }
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom { bottom: 0.5% !important; left: 50% !important; top: auto !important; transform: translateX(-50%) !important; }
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom-right { bottom: 2% !important; left: 75% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }

body.mobile-table-mode:not(.in-lobby) .game-stage .player-nameplate {
  padding: 3px 6px !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .player-nameplate strong {
  font-size: clamp(10px, 2.8dvh, 14px) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .player-nameplate span,
body.mobile-table-mode:not(.in-lobby) .game-stage .status-pill,
body.mobile-table-mode:not(.in-lobby) .game-stage .hand-readout,
body.mobile-table-mode:not(.in-lobby) .game-stage .action-pop,
body.mobile-table-mode:not(.in-lobby) .game-stage .turn-label {
  font-size: clamp(8px, 2.2dvh, 11px) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .action-panel {
  align-items: center !important;
  grid-area: actions !important;
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  padding: clamp(4px, 1.1dvh, 8px) clamp(6px, 2vw, 14px) !important;
  position: relative !important;
  width: 100% !important;
  z-index: 500 !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .controls {
  gap: clamp(5px, 1.4vw, 10px) !important;
  height: clamp(38px, 10dvh, 52px) !important;
  max-height: 100% !important;
  max-width: min(96vw, 640px) !important;
  width: min(96vw, 640px) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .controls button {
  font-size: clamp(12px, 3dvh, 16px) !important;
  height: clamp(38px, 10dvh, 52px) !important;
  min-height: 0 !important;
  padding: 0 clamp(8px, 2vw, 14px) !important;
}

/* Blank-screen guard: portrait and loading states must show feedback above
   every fullscreen/table shell, especially on iPhone Safari. */
body.table-loading:not(.in-lobby) .table-debug-status {
  display: block !important;
}

body.phone-portrait:not(.in-lobby) .rotate-phone-message {
  align-items: center !important;
  background:
    radial-gradient(circle at 50% 35%, rgba(39,231,255,.18), transparent 16rem),
    #020617 !important;
  color: #fff !important;
  display: flex !important;
  font-size: clamp(1.35rem, 6vw, 2.4rem) !important;
  font-weight: 950 !important;
  inset: 0 !important;
  justify-content: center !important;
  line-height: 1.15 !important;
  padding: 2rem !important;
  position: fixed !important;
  text-align: center !important;
  z-index: 1000001 !important;
}

body.phone-portrait.mobile-table-mode:not(.in-lobby) .game-fullscreen-shell,
body.phone-portrait.mobile-table-mode:not(.in-lobby) .game-table-screen,
body.phone-portrait.mobile-table-mode:not(.in-lobby) .poker-table-wrapper {
  background: #020617 !important;
  z-index: 999998 !important;
}

body.phone-portrait:not(.in-lobby) .game-stage {
  opacity: 0 !important;
  pointer-events: none !important;
}

body.phone-landscape:not(.in-lobby) .rotate-phone-message,
body.tablet-landscape:not(.in-lobby) .rotate-phone-message,
body.in-lobby .table-debug-status {
  display: none !important;
}

body:not(.table-loading) .table-debug-status {
  display: none !important;
}

html,
body,
body:not(.in-lobby),
body:not(.in-lobby) .app-viewport,
body:not(.in-lobby) .game-viewport,
body:not(.in-lobby) .game-stage,
body:not(.in-lobby) .table-scene,
body:not(.in-lobby) .poker-table {
  touch-action: auto !important;
}

body:not(.in-lobby) button,
body:not(.in-lobby) input,
body:not(.in-lobby) select,
body:not(.in-lobby) textarea,
body:not(.in-lobby) .action-panel,
body:not(.in-lobby) .controls,
body:not(.in-lobby) .flyout,
body:not(.in-lobby) .chat-panel,
body:not(.in-lobby) .menu-panel {
  touch-action: manipulation !important;
}

body.mobile-table-mode:not(.in-lobby),
body.mobile-table-mode:not(.in-lobby) .game-fullscreen-shell,
body.mobile-table-mode:not(.in-lobby) .game-table-screen,
body.mobile-table-mode:not(.in-lobby) .poker-table-wrapper,
body.mobile-table-mode:not(.in-lobby) .poker-table-stage,
body.mobile-table-mode:not(.in-lobby) .game-stage,
body.mobile-table-mode:not(.in-lobby) .game-stage .game-shell,
body.mobile-table-mode:not(.in-lobby) .game-stage .table-scene,
body.mobile-table-mode:not(.in-lobby) .game-stage .poker-table,
body.scaled-game-board:not(.in-lobby) .game-stage,
body.scaled-game-board:not(.in-lobby) .game-stage .table-scene,
body.table-zoom-active:not(.in-lobby) .game-stage .table-scene {
  touch-action: auto !important;
}

/* Zoom/sound cleanup overrides: keep the layout, but let Safari zoom and pan. */
html,
body {
  overflow: auto !important;
  touch-action: auto !important;
}

body.mobile-table-mode:not(.in-lobby),
body.mobile-table-mode:not(.in-lobby) .game-fullscreen-shell,
body.mobile-table-mode:not(.in-lobby) .game-table-screen,
body.mobile-table-mode:not(.in-lobby) .poker-table-wrapper {
  overflow: auto !important;
  overscroll-behavior: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

body.mobile-table-mode:not(.in-lobby) .poker-table-stage,
body.mobile-table-mode:not(.in-lobby) .game-stage,
body.mobile-table-mode:not(.in-lobby) .game-stage .game-shell,
body.mobile-table-mode:not(.in-lobby) .game-stage .table-scene {
  overflow: visible !important;
  touch-action: auto !important;
}

body:not(.table-loading) .table-debug-status,
body.mobile-table-mode:not(.in-lobby):not(.table-loading) .table-debug-status,
body.phone-landscape:not(.in-lobby) .table-debug-status,
body.tablet-landscape:not(.in-lobby) .table-debug-status {
  display: none !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .result-banner {
  bottom: auto !important;
  left: 50% !important;
  max-width: min(58vw, 24rem) !important;
  min-height: 0 !important;
  padding: 3px 8px !important;
  pointer-events: none !important;
  top: max(8px, env(safe-area-inset-top, 0px)) !important;
  transform: translateX(-50%) !important;
  width: auto !important;
  z-index: 180 !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .turn-callout,
body.mobile-table-mode:not(.in-lobby) .game-stage .turn-callout.show {
  bottom: auto !important;
  font-size: clamp(9px, 2.4dvh, 13px) !important;
  left: 50% !important;
  max-width: min(52vw, 20rem) !important;
  min-height: 0 !important;
  padding: 4px 8px !important;
  pointer-events: none !important;
  top: max(30px, calc(env(safe-area-inset-top, 0px) + 28px)) !important;
  transform: translateX(-50%) !important;
  width: auto !important;
  z-index: 190 !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .turn-callout strong {
  font-size: clamp(10px, 2.6dvh, 14px) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .turn-callout span {
  font-size: clamp(9px, 2.3dvh, 12px) !important;
}

/* Turn banner-only fix: smaller and parked high enough to avoid cards/nameplates. */
body:not(.in-lobby) .game-stage .turn-callout,
body:not(.in-lobby) .game-stage .turn-callout.show,
body.mobile-table-mode:not(.in-lobby) .game-stage .turn-callout,
body.mobile-table-mode:not(.in-lobby) .game-stage .turn-callout.show {
  bottom: auto !important;
  gap: 4px !important;
  left: 50% !important;
  max-height: 26px !important;
  max-width: min(46vw, 15rem) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 3px 7px !important;
  pointer-events: none !important;
  top: max(6px, env(safe-area-inset-top, 0px)) !important;
  transform: translateX(-50%) !important;
  width: auto !important;
  z-index: 10020 !important;
}

body:not(.in-lobby) .game-stage .turn-callout strong,
body.mobile-table-mode:not(.in-lobby) .game-stage .turn-callout strong {
  font-size: clamp(9px, 2.1dvh, 12px) !important;
  line-height: 1 !important;
}

body:not(.in-lobby) .game-stage .turn-callout span,
body.mobile-table-mode:not(.in-lobby) .game-stage .turn-callout span {
  font-size: clamp(8px, 1.9dvh, 11px) !important;
  height: 18px !important;
  min-width: 18px !important;
  padding: 0 5px !important;
}

/* Active-turn badge layer fix only: keep seats/table unchanged, but render the
   yellow "whose turn" badge above cards, names, and seat panels. */
body:not(.in-lobby) .game-stage .seat.turn-spotlight {
  overflow: visible !important;
  z-index: 100050 !important;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight .turn-label,
body.phone-landscape:not(.in-lobby) .game-stage .seat.turn-spotlight .turn-label,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat.turn-spotlight .turn-label {
  display: block !important;
  left: 50% !important;
  max-width: min(44vw, 12rem) !important;
  overflow: visible !important;
  pointer-events: none !important;
  position: absolute !important;
  top: calc(-1 * clamp(22px, 4.4dvh, 36px)) !important;
  transform: translateX(-50%) !important;
  white-space: nowrap !important;
  z-index: 100060 !important;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight .hole-cards,
body:not(.in-lobby) .game-stage .seat.turn-spotlight .player-nameplate,
body:not(.in-lobby) .game-stage .seat.turn-spotlight .status-pill,
body:not(.in-lobby) .game-stage .seat.turn-spotlight .hand-readout {
  position: relative !important;
  z-index: 100010 !important;
}

body:not(.in-lobby) .game-stage .turn-callout,
body:not(.in-lobby) .game-stage .turn-callout.show,
body.mobile-table-mode:not(.in-lobby) .game-stage .turn-callout,
body.mobile-table-mode:not(.in-lobby) .game-stage .turn-callout.show {
  z-index: 100070 !important;
}

/* Regression fix: keep the active-turn badge compact and restore the table
   header controls without changing table, seat, card, zoom, or sound sizing. */
body:not(.in-lobby) .game-stage .top-bar,
body.mobile-table-mode:not(.in-lobby) .game-stage .top-bar {
  align-items: center !important;
  display: flex !important;
  left: max(6px, env(safe-area-inset-left, 0px)) !important;
  min-height: 0 !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  position: fixed !important;
  right: max(6px, env(safe-area-inset-right, 0px)) !important;
  top: max(4px, env(safe-area-inset-top, 0px)) !important;
  visibility: visible !important;
  z-index: 5000 !important;
}

body:not(.in-lobby) .game-stage .score-strip,
body.mobile-table-mode:not(.in-lobby) .game-stage .score-strip {
  display: flex !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  visibility: visible !important;
  z-index: 5001 !important;
}

body:not(.in-lobby) .game-stage .score-strip #chatButton,
body:not(.in-lobby) .game-stage .score-strip #lobbyButton,
body:not(.in-lobby) .game-stage .score-strip #howButton,
body:not(.in-lobby) .game-stage .score-strip #menuButton,
body:not(.in-lobby) .game-stage .score-strip #fullscreenButton,
body:not(.in-lobby) .game-stage .score-strip > span,
body.mobile-table-mode:not(.in-lobby) .game-stage .score-strip #chatButton,
body.mobile-table-mode:not(.in-lobby) .game-stage .score-strip #lobbyButton,
body.mobile-table-mode:not(.in-lobby) .game-stage .score-strip #howButton,
body.mobile-table-mode:not(.in-lobby) .game-stage .score-strip #menuButton,
body.mobile-table-mode:not(.in-lobby) .game-stage .score-strip #fullscreenButton,
body.mobile-table-mode:not(.in-lobby) .game-stage .score-strip > span {
  display: inline-flex !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  visibility: visible !important;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight {
  overflow: visible !important;
  z-index: 220 !important;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight .turn-label,
body.phone-landscape:not(.in-lobby) .game-stage .seat.turn-spotlight .turn-label,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat.turn-spotlight .turn-label {
  border-width: 1px !important;
  display: block !important;
  font-size: clamp(7px, .68em, 11px) !important;
  line-height: 1 !important;
  left: 50% !important;
  max-width: min(70%, 120px) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: .22em .58em !important;
  pointer-events: none !important;
  position: absolute !important;
  text-overflow: ellipsis !important;
  top: -.95em !important;
  transform: translateX(-50%) !important;
  white-space: nowrap !important;
  width: max-content !important;
  z-index: 5200 !important;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight .hole-cards,
body:not(.in-lobby) .game-stage .seat.turn-spotlight .player-nameplate,
body:not(.in-lobby) .game-stage .seat.turn-spotlight .status-pill,
body:not(.in-lobby) .game-stage .seat.turn-spotlight .hand-readout {
  position: relative !important;
  z-index: 230 !important;
}

/* iPad/tablet landscape Reveal Time fix only: keep private cards tappable above
   the Reveal Odds panel without changing table/card/seat sizing or positions. */
body.tablet-landscape:not(.in-lobby) .game-stage .table-scene.reveal-active .seat-bottom,
body.tablet-landscape:not(.in-lobby) .game-stage .table-scene.reveal-active .seat-bottom .hole-cards,
body.tablet-landscape:not(.in-lobby) .game-stage .table-scene.reveal-active .seat-bottom .player-nameplate {
  pointer-events: auto !important;
  position: relative !important;
  z-index: 6200 !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .table-scene.reveal-active .seat-bottom {
  position: absolute !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .table-scene.reveal-active .seat-bottom .hole-cards,
body.tablet-landscape:not(.in-lobby) .game-stage .table-scene.reveal-active .seat-bottom .hole-cards .card,
body.tablet-landscape:not(.in-lobby) .game-stage .table-scene.reveal-active .seat-bottom .hole-cards .reveal-choice {
  pointer-events: auto !important;
  z-index: 6210 !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .table-scene.reveal-active .odds-panel {
  bottom: max(4px, env(safe-area-inset-bottom, 0px)) !important;
  left: max(4px, env(safe-area-inset-left, 0px)) !important;
  max-height: min(24dvh, 136px) !important;
  max-width: min(15rem, 18vw) !important;
  opacity: .86 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  transform: none !important;
  width: min(15rem, 18vw) !important;
  z-index: 120 !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .table-scene.reveal-active .odds-panel * {
  pointer-events: none !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .table-scene.reveal-active .odds-panel .chat-header {
  gap: .25rem !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .table-scene.reveal-active .odds-panel .chat-header strong,
body.tablet-landscape:not(.in-lobby) .game-stage .table-scene.reveal-active .odds-panel .chat-header span,
body.tablet-landscape:not(.in-lobby) .game-stage .table-scene.reveal-active .odds-list div {
  font-size: clamp(7px, 1.05dvh, 10px) !important;
}

/* Urgent HUD safe-area fix only: in landscape mobile/tablet, the top controls
   reserve their own row so they do not cover top seats, cards, or labels. */
body.phone-landscape:not(.in-lobby) .game-stage,
body.tablet-landscape:not(.in-lobby) .game-stage,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage,
body.mobile-table-mode.tablet-landscape:not(.in-lobby) .game-stage {
  --hud-safe-row: clamp(32px, 7dvh, 52px);
}

body.phone-landscape:not(.in-lobby) .game-stage .game-shell,
body.tablet-landscape:not(.in-lobby) .game-stage .game-shell,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .game-shell,
body.mobile-table-mode.tablet-landscape:not(.in-lobby) .game-stage .game-shell {
  grid-template-areas: "top" "table" "actions" !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: var(--hud-safe-row) minmax(0, 1fr) clamp(48px, 13dvh, 66px) !important;
  padding-top: 0 !important;
}

body.phone-landscape:not(.mobile-table-mode):not(.in-lobby) .game-stage .game-shell {
  grid-template-rows: var(--hud-safe-row) minmax(0, 1fr) 49px !important;
}

body.tablet-landscape:not(.mobile-table-mode):not(.in-lobby) .game-stage .game-shell {
  grid-template-rows: var(--hud-safe-row) minmax(0, 1fr) 76px !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .top-bar,
body.tablet-landscape:not(.in-lobby) .game-stage .top-bar,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .top-bar,
body.mobile-table-mode.tablet-landscape:not(.in-lobby) .game-stage .top-bar {
  bottom: auto !important;
  grid-area: top !important;
  height: var(--hud-safe-row) !important;
  left: auto !important;
  max-height: var(--hud-safe-row) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding:
    max(2px, env(safe-area-inset-top, 0px))
    max(5px, env(safe-area-inset-right, 0px))
    3px
    max(5px, env(safe-area-inset-left, 0px)) !important;
  position: relative !important;
  right: auto !important;
  top: auto !important;
  width: 100% !important;
  z-index: 5000 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .table-scene,
body.tablet-landscape:not(.in-lobby) .game-stage .table-scene,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .table-scene,
body.mobile-table-mode.tablet-landscape:not(.in-lobby) .game-stage .table-scene {
  grid-area: table !important;
  margin-top: 0 !important;
  position: relative !important;
  z-index: 100 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .action-panel,
body.tablet-landscape:not(.in-lobby) .game-stage .action-panel,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .action-panel,
body.mobile-table-mode.tablet-landscape:not(.in-lobby) .game-stage .action-panel {
  grid-area: actions !important;
}

@media (orientation: landscape) and (pointer: coarse) {
  body:not(.in-lobby) .game-stage {
    --hud-safe-row: clamp(34px, 7dvh, 54px);
  }

  body:not(.in-lobby) .game-stage .game-shell {
    grid-template-areas: "top" "table" "actions" !important;
    grid-template-rows: var(--hud-safe-row) minmax(0, 1fr) clamp(48px, 13dvh, 66px) !important;
  }

  body.phone-landscape:not(.mobile-table-mode):not(.in-lobby) .game-stage .game-shell {
    grid-template-rows: var(--hud-safe-row) minmax(0, 1fr) 49px !important;
  }

  body.tablet-landscape:not(.mobile-table-mode):not(.in-lobby) .game-stage .game-shell {
    grid-template-rows: var(--hud-safe-row) minmax(0, 1fr) 76px !important;
  }

  body:not(.in-lobby) .game-stage .top-bar {
    grid-area: top !important;
    height: var(--hud-safe-row) !important;
    left: auto !important;
    max-height: var(--hud-safe-row) !important;
    min-height: 0 !important;
    position: relative !important;
    right: auto !important;
    top: auto !important;
    width: 100% !important;
    z-index: 5000 !important;
  }

  body:not(.in-lobby) .game-stage .table-scene {
    grid-area: table !important;
    top: auto !important;
  }
}

/* Mobile/iPad landscape table safety fix only: remove the large active-seat
   spotlight and keep bottom cards/actions inside the visible Safari viewport. */
body.phone-landscape:not(.in-lobby) .game-table-screen,
body.phone-landscape:not(.in-lobby) .game-fullscreen-shell,
body.phone-landscape:not(.in-lobby) .poker-table-wrapper,
body.phone-landscape:not(.in-lobby) .poker-table-stage,
body.tablet-landscape:not(.in-lobby) .game-table-screen,
body.tablet-landscape:not(.in-lobby) .game-fullscreen-shell,
body.tablet-landscape:not(.in-lobby) .poker-table-wrapper,
body.tablet-landscape:not(.in-lobby) .poker-table-stage,
body.mobile-table-mode:not(.in-lobby) .game-table-screen,
body.mobile-table-mode:not(.in-lobby) .game-fullscreen-shell,
body.mobile-table-mode:not(.in-lobby) .poker-table-wrapper,
body.mobile-table-mode:not(.in-lobby) .poker-table-stage {
  box-sizing: border-box !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  padding-bottom: env(safe-area-inset-bottom, 0px) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat.turn-spotlight::before,
body.tablet-landscape:not(.in-lobby) .game-stage .seat.turn-spotlight::before,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat.turn-spotlight::before {
  animation: none !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  content: none !important;
  display: none !important;
  height: 0 !important;
  opacity: 0 !important;
  width: 0 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .turn-label,
body.tablet-landscape:not(.in-lobby) .game-stage .turn-label,
body.mobile-table-mode:not(.in-lobby) .game-stage .turn-label {
  display: none !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .turn-callout,
body.phone-landscape:not(.in-lobby) .game-stage .turn-callout.show,
body.tablet-landscape:not(.in-lobby) .game-stage .turn-callout,
body.tablet-landscape:not(.in-lobby) .game-stage .turn-callout.show,
body.mobile-table-mode:not(.in-lobby) .game-stage .turn-callout,
body.mobile-table-mode:not(.in-lobby) .game-stage .turn-callout.show {
  bottom: auto !important;
  left: 50% !important;
  max-height: 24px !important;
  max-width: min(46vw, 15rem) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 3px 7px !important;
  pointer-events: none !important;
  top: calc(env(safe-area-inset-top, 0px) + var(--hud-safe-row, 34px) + 3px) !important;
  transform: translateX(-50%) !important;
  width: auto !important;
  z-index: 5200 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .action-panel,
body.tablet-landscape:not(.in-lobby) .game-stage .action-panel,
body.mobile-table-mode:not(.in-lobby) .game-stage .action-panel {
  bottom: calc(env(safe-area-inset-bottom, 0px) + 8px) !important;
  box-sizing: border-box !important;
  left: env(safe-area-inset-left, 0px) !important;
  max-height: clamp(42px, 12dvh, 76px) !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding-bottom: 0 !important;
  position: absolute !important;
  right: env(safe-area-inset-right, 0px) !important;
  top: auto !important;
  z-index: 900 !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom,
body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom-left,
body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom-right,
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom,
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom-left,
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom-right,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom-left,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom-right {
  bottom: calc(clamp(48px, 13dvh, 76px) + env(safe-area-inset-bottom, 0px) + 8px) !important;
}

@media (orientation: landscape) and (max-height: 600px) {
  body:not(.in-lobby) .game-table-screen,
  body:not(.in-lobby) .game-fullscreen-shell,
  body:not(.in-lobby) .poker-table-wrapper,
  body:not(.in-lobby) .poker-table-stage {
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
    padding-bottom: env(safe-area-inset-bottom, 0px) !important;
  }

  body:not(.in-lobby) .game-stage {
    --hud-safe-row: clamp(30px, 6.5dvh, 44px);
  }

  body:not(.in-lobby) .game-stage .seat.turn-spotlight::before,
  body:not(.in-lobby) .game-stage .turn-label {
    display: none !important;
  }

  body:not(.in-lobby) .game-stage .turn-callout,
  body:not(.in-lobby) .game-stage .turn-callout.show {
    max-height: 22px !important;
    padding: 2px 6px !important;
    top: calc(env(safe-area-inset-top, 0px) + var(--hud-safe-row, 32px) + 2px) !important;
  }

  body:not(.in-lobby) .game-stage .action-panel {
    bottom: calc(env(safe-area-inset-bottom, 0px) + 8px) !important;
    max-height: clamp(40px, 12dvh, 58px) !important;
    position: absolute !important;
  }

  body:not(.in-lobby) .game-stage .seat-bottom,
  body:not(.in-lobby) .game-stage .seat-bottom-left,
  body:not(.in-lobby) .game-stage .seat-bottom-right {
    bottom: calc(clamp(44px, 12dvh, 62px) + env(safe-area-inset-bottom, 0px) + 8px) !important;
  }
}

/* Final turn-indicator cleanup: remove legacy vertical/circular turn UI and
   allow exactly one compact horizontal badge on the current active seat. */
body:not(.in-lobby) .game-stage .seat.turn-spotlight::before,
body:not(.in-lobby) .game-stage .turn-timer,
body:not(.in-lobby) .game-stage .turn-timer span {
  animation: none !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  content: none !important;
  display: none !important;
  height: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 0 !important;
}

body:not(.in-lobby) .game-stage .turn-callout,
body:not(.in-lobby) .game-stage .turn-callout.show {
  display: none !important;
}

body:not(.in-lobby) .game-stage .seat:not(.turn-spotlight) .turn-label {
  display: none !important;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight .turn-label,
body.phone-landscape:not(.in-lobby) .game-stage .seat.turn-spotlight .turn-label,
body.tablet-landscape:not(.in-lobby) .game-stage .seat.turn-spotlight .turn-label,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat.turn-spotlight .turn-label {
  background: linear-gradient(180deg, #fff16b, #ffb13d) !important;
  border: 1px solid rgba(255,255,255,.82) !important;
  border-radius: 999px !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.34), 0 0 12px rgba(255,228,92,.36) !important;
  color: #1b1207 !important;
  display: block !important;
  font-size: clamp(8px, .72em, 12px) !important;
  font-weight: 1000 !important;
  left: 50% !important;
  line-height: 1 !important;
  max-width: min(78%, 128px) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: .22em .62em !important;
  pointer-events: none !important;
  position: absolute !important;
  right: auto !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  text-transform: uppercase !important;
  top: calc(-1 * clamp(13px, 1.05em, 18px)) !important;
  transform: translateX(-50%) !important;
  white-space: nowrap !important;
  width: max-content !important;
  z-index: 6200 !important;
}

body:not(.in-lobby) .game-stage .seat-top-left.turn-spotlight .turn-label,
body:not(.in-lobby) .game-stage .seat-top.turn-spotlight .turn-label,
body:not(.in-lobby) .game-stage .seat-top-right.turn-spotlight .turn-label,
body:not(.in-lobby) .game-stage .seat-left-upper.turn-spotlight .turn-label,
body:not(.in-lobby) .game-stage .seat-right-upper.turn-spotlight .turn-label {
  bottom: auto !important;
  top: calc(100% + 3px) !important;
}

body:not(.in-lobby) .game-stage .seat-left-lower.turn-spotlight .turn-label,
body:not(.in-lobby) .game-stage .seat-left-upper.turn-spotlight .turn-label,
body:not(.in-lobby) .game-stage .seat-right-lower.turn-spotlight .turn-label,
body:not(.in-lobby) .game-stage .seat-right-upper.turn-spotlight .turn-label {
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
}

@media (orientation: landscape) and (max-height: 600px) {
  body:not(.in-lobby) .game-stage .seat.turn-spotlight .turn-label {
    font-size: clamp(7px, .68em, 10px) !important;
    max-width: min(72%, 112px) !important;
    padding: .18em .52em !important;
  }
}

/* UI fix package: card glyph alignment, odds-in-menu, and non-blocking turn
   highlight. These rules intentionally do not change card/table/seat sizes. */
.card .corner,
body:not(.in-lobby) .game-stage .card .corner,
body:not(.in-lobby) .game-stage .community .card .corner,
body:not(.in-lobby) .hole-cards .card .corner {
  align-items: center !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  justify-content: center !important;
  line-height: 1 !important;
  min-width: 1.45em !important;
  text-align: center !important;
  width: 1.45em !important;
}

.card .card-rank,
.card .card-suit,
.card .corner small.card-suit {
  display: block !important;
  line-height: 1 !important;
  text-align: center !important;
  width: 100% !important;
}

.card .card-rank {
  font-variant-numeric: tabular-nums !important;
  letter-spacing: 0 !important;
}

.card .corner small.card-suit {
  margin-top: .04em !important;
}

#revealOddsPanel.odds-modal {
  background: rgba(2, 6, 23, .42);
  pointer-events: auto;
  z-index: 76000;
}

#revealOddsPanel.odds-modal:not(.show) {
  display: none !important;
}

#revealOddsPanel .odds-card {
  max-width: min(20rem, calc(100vw - 2rem));
}

#revealOddsPanel .odds-list {
  max-height: min(52dvh, 18rem);
  overflow: auto;
}

body:not(.in-lobby) .game-stage .score-strip #oddsButton,
body.mobile-table-mode:not(.in-lobby) .game-stage .score-strip #oddsButton,
body.phone-landscape:not(.in-lobby) .game-stage #oddsButton {
  display: inline-flex !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  visibility: visible !important;
}

body:not(.in-lobby) .game-stage .turn-callout,
body:not(.in-lobby) .game-stage .turn-callout.show,
body:not(.in-lobby) .game-stage .turn-label,
body:not(.in-lobby) .game-stage .seat.turn-spotlight .turn-label,
body:not(.in-lobby) .game-stage .turn-timer,
body:not(.in-lobby) .game-stage .turn-timer span,
body:not(.in-lobby) .game-stage .seat.turn-spotlight::before {
  animation: none !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  content: none !important;
  display: none !important;
  height: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 0 !important;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight {
  filter: none !important;
  outline: 0 !important;
  overflow: visible !important;
  z-index: 220 !important;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight .player-nameplate {
  animation: activeNameplatePulse 1.15s ease-in-out infinite !important;
  border-color: rgba(255,228,92,.86) !important;
  box-shadow:
    0 0 0 2px rgba(255,228,92,.56),
    0 0 16px rgba(255,228,92,.46),
    inset 0 1px rgba(255,255,255,.22) !important;
  position: relative !important;
  z-index: 230 !important;
}

@keyframes activeNameplatePulse {
  50% {
    box-shadow:
      0 0 0 2px rgba(255,228,92,.9),
      0 0 22px rgba(255,228,92,.62),
      inset 0 1px rgba(255,255,255,.25);
  }
}

/* Card corner alignment regression fix: one shared centered component for every
   rank/suit, including 4-diamond and all 10s, in both card corners. */
.card .card-corner,
body:not(.in-lobby) .game-stage .card .card-corner,
body:not(.in-lobby) .game-stage .community .card .card-corner,
body:not(.in-lobby) .hole-cards .card .card-corner {
  align-items: center !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  justify-content: center !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  padding: 0 !important;
  text-align: center !important;
  width: 1.55em !important;
}

.card .card-corner .card-rank,
.card .card-corner .card-suit {
  align-items: center !important;
  align-self: stretch !important;
  display: flex !important;
  justify-content: center !important;
  left: auto !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
  right: auto !important;
  text-align: center !important;
  transform: none !important;
  white-space: nowrap !important;
  width: 100% !important;
}

.card .card-corner .card-rank {
  font-family: Arial Black, Arial, Helvetica, sans-serif !important;
  font-variant-numeric: tabular-nums !important;
}

.card .card-corner .card-suit {
  font-family: "Segoe UI Symbol", "Apple Symbols", "Noto Sans Symbols", Arial, Helvetica, sans-serif !important;
  font-size: .76em !important;
  margin-top: .08em !important;
}

/* iPad/table bug fix package: readable pot/status, centered card artwork,
   neutral dealt-card scale, and non-blocking Reveal Time banner. */
body:not(.in-lobby) .game-stage .pot-stack {
  bottom: auto !important;
  left: clamp(14%, 24vw, 30%) !important;
  max-width: min(24vw, 15rem) !important;
  pointer-events: none !important;
  top: 42% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 75 !important;
}

body:not(.in-lobby) .game-stage .pot-stack span,
body:not(.in-lobby) .game-stage #potCenter {
  font-size: clamp(10px, 1.8vw, 18px) !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body:not(.in-lobby) .game-stage .result-banner {
  bottom: auto !important;
  left: clamp(14%, 24vw, 30%) !important;
  max-width: min(24vw, 15rem) !important;
  pointer-events: none !important;
  top: 54% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 76 !important;
}

.card,
button.card,
body:not(.in-lobby) .game-stage .card {
  align-items: center !important;
  justify-items: center !important;
  transform: none !important;
  transform-origin: center center !important;
}

.card .face,
body:not(.in-lobby) .game-stage .card .face,
body:not(.in-lobby) .hole-cards .card .face,
body:not(.in-lobby) .community .card .face {
  align-items: center !important;
  display: grid !important;
  justify-items: center !important;
  place-items: center !important;
  text-align: center !important;
}

.card .pips,
body:not(.in-lobby) .game-stage .card .pips {
  align-items: center !important;
  height: 100% !important;
  justify-items: center !important;
  place-items: center !important;
  width: 100% !important;
}

.card.back,
body:not(.in-lobby) .game-stage .card.back {
  background-position: center center, center center, center center !important;
  transform: none !important;
}

.card.revealed,
body:not(.in-lobby) .game-stage .card.revealed,
.reveal-choice,
body:not(.in-lobby) .game-stage .reveal-choice {
  transform: none !important;
}

.seat .hole-cards .card:hover,
.seat .hole-cards .card:focus-visible,
.community .card:hover,
.community .card:focus-visible {
  transform: none !important;
}

@media (hover: hover) and (pointer: fine) {
  .seat .hole-cards .card:hover {
    transform: translateY(var(--card-zoom-y, -2.2rem)) translateX(var(--card-zoom-x, 0)) scale(var(--card-zoom-scale, 1.35)) !important;
  }

  .community .card:hover {
    transform: translateY(-.75rem) scale(1.22) !important;
  }
}

.seat .hole-cards .card:active,
.community .card:active {
  transform: translateY(-.35rem) scale(1.08) !important;
}

body:not(.in-lobby) .game-stage .reveal-overlay,
body:not(.in-lobby) .game-stage .reveal-overlay.show {
  left: 50% !important;
  max-width: min(50vw, 24rem) !important;
  padding: clamp(4px, .8dvh, 9px) clamp(8px, 1.1vw, 14px) !important;
  pointer-events: none !important;
  top: clamp(58px, 23%, 148px) !important;
  transform: translate(-50%, -50%) !important;
  z-index: 9998 !important;
}

/* Follow-up iPad table bug hardening: keep status readable in open felt,
   make every card glyph optically centered, and prevent sticky enlargement. */
body:not(.in-lobby) .game-stage .pot-stack {
  left: clamp(18%, 25vw, 29%) !important;
  max-width: min(20vw, 12rem) !important;
  top: 38% !important;
  z-index: 650 !important;
}

body:not(.in-lobby) .game-stage .result-banner {
  left: clamp(18%, 25vw, 29%) !important;
  max-width: min(20vw, 12rem) !important;
  top: 50% !important;
  z-index: 651 !important;
}

.card .face,
body:not(.in-lobby) .game-stage .card .face,
body:not(.in-lobby) .hole-cards .card .face,
body:not(.in-lobby) .community .card .face {
  inset: 16% 13% !important;
  margin: 0 !important;
  transform: none !important;
}

.card .pips,
body:not(.in-lobby) .game-stage .card .pips {
  display: grid !important;
  font-family: "Segoe UI Symbol", "Apple Symbols", "Noto Sans Symbols", Arial, Helvetica, sans-serif !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

.card .pips i,
body:not(.in-lobby) .game-stage .card .pips i {
  align-items: center !important;
  display: flex !important;
  font-family: inherit !important;
  height: 100% !important;
  justify-content: center !important;
  line-height: 1 !important;
  margin: 0 !important;
  max-height: none !important;
  padding: 0 !important;
  text-align: center !important;
  width: 100% !important;
}

.seat .hole-cards .card,
.community .card,
body:not(.in-lobby) .game-stage .hole-cards .card,
body:not(.in-lobby) .game-stage .community .card {
  transform: none !important;
}

.seat .hole-cards .card:focus,
.seat .hole-cards .card:focus-visible,
.community .card:focus,
.community .card:focus-visible {
  transform: none !important;
}

@media (hover: none), (pointer: coarse) {
  .seat .hole-cards .card:hover,
  .seat .hole-cards .card:focus,
  .seat .hole-cards .card:focus-visible,
  .community .card:hover,
  .community .card:focus,
  .community .card:focus-visible {
    transform: none !important;
  }
}

@media (orientation: landscape) and (max-height: 760px) {
  body:not(.in-lobby) .game-stage .reveal-overlay,
  body:not(.in-lobby) .game-stage .reveal-overlay.show {
    max-width: min(44vw, 20rem) !important;
    padding: 4px 10px !important;
    top: clamp(52px, 20%, 118px) !important;
  }
}

/* === STABILIZATION LAYER ==================================================
   This final layer is intentionally broad: previous mobile/table patches left
   multiple competing rules in the cascade. Keep table geometry as-is, but make
   stacking, card rendering, controls, and mobile viewport behavior predictable. */

:root {
  --layer-felt: 10;
  --layer-seat: 120;
  --layer-card: 145;
  --layer-table-status: 210;
  --layer-action: 420;
  --layer-nav: 5200;
  --layer-overlay: 9000;
  --layer-modal: 10000;
}

html,
body,
#root {
  box-sizing: border-box;
}

body:not(.in-lobby) {
  min-height: 100dvh;
  overflow: hidden;
}

.game-table-screen,
.game-fullscreen-shell,
.poker-table-wrapper,
.app-viewport,
.game-viewport,
.game-stage,
.table-scene {
  box-sizing: border-box !important;
}

body:not(.in-lobby) .app-viewport,
body:not(.in-lobby) .game-viewport,
body:not(.in-lobby) .game-table-screen,
body:not(.in-lobby) .game-fullscreen-shell {
  max-height: 100dvh !important;
  min-height: 100svh;
  overflow: hidden !important;
}

body:not(.in-lobby) .game-stage,
body:not(.in-lobby) .table-scene,
body:not(.in-lobby) .poker-table-wrapper {
  overflow: visible !important;
}

body:not(.in-lobby) .poker-table,
body:not(.in-lobby) .table-felt,
body:not(.in-lobby) .table-graphic,
body:not(.in-lobby) .felt {
  position: relative !important;
  z-index: var(--layer-felt) !important;
}

body:not(.in-lobby) .seat,
body:not(.in-lobby) .player-seat,
body:not(.in-lobby) .seat-badge,
body:not(.in-lobby) .player-info,
body:not(.in-lobby) .player-nameplate,
body:not(.in-lobby) .player-stack {
  position: absolute;
  overflow: visible !important;
  pointer-events: auto;
  z-index: var(--layer-seat) !important;
}

body:not(.in-lobby) .seat *,
body:not(.in-lobby) .player-seat * {
  z-index: auto;
}

body:not(.in-lobby) .hole-cards,
body:not(.in-lobby) .player-cards,
body:not(.in-lobby) .community,
body:not(.in-lobby) .card,
body:not(.in-lobby) button.card {
  z-index: var(--layer-card) !important;
}

body:not(.in-lobby) .seat.local,
body:not(.in-lobby) .seat.local .hole-cards,
body:not(.in-lobby) .seat.local .card {
  z-index: calc(var(--layer-card) + 10) !important;
}

body:not(.in-lobby) .top-bar,
body:not(.in-lobby) .top-navigation,
body:not(.in-lobby) .score-strip {
  display: flex !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  position: relative;
  visibility: visible !important;
  z-index: var(--layer-nav) !important;
}

body:not(.in-lobby) .action-panel,
body:not(.in-lobby) .controls,
body:not(.in-lobby) .bet-sizing-panel {
  pointer-events: auto !important;
  z-index: var(--layer-action) !important;
}

body:not(.in-lobby) .controls.status-only .primary-action,
body:not(.in-lobby) .controls.status-only .secondary-action,
body:not(.in-lobby) .controls.status-only .utility-action {
  display: none !important;
}

body:not(.in-lobby) .controls.status-only #newHand {
  display: inline-flex !important;
}

body:not(.in-lobby) .pot-stack,
body:not(.in-lobby) .result-banner {
  bottom: auto !important;
  left: clamp(17%, 24vw, 29%) !important;
  max-width: min(22vw, 13rem) !important;
  pointer-events: none !important;
  position: absolute !important;
  right: auto !important;
  transform: translate(-50%, -50%) !important;
  z-index: var(--layer-table-status) !important;
}

body:not(.in-lobby) .pot-stack {
  top: 38% !important;
}

body:not(.in-lobby) .result-banner {
  top: 51% !important;
}

body:not(.in-lobby) .reveal-popup,
body:not(.in-lobby) .turn-reveal-modal,
body:not(.in-lobby) .reveal-overlay,
body:not(.in-lobby) .reveal-overlay.show,
body:not(.in-lobby) .action-banner {
  pointer-events: none !important;
  z-index: var(--layer-overlay) !important;
}

body:not(.in-lobby) .modal,
body:not(.in-lobby) .reload-modal,
body:not(.in-lobby) .odds-modal {
  z-index: var(--layer-modal) !important;
}

/* Retire every legacy turn bubble/oval. Active turn is nameplate highlight only. */
body:not(.in-lobby) .turn-callout,
body:not(.in-lobby) .turn-callout.show,
body:not(.in-lobby) .turn-label,
body:not(.in-lobby) .turn-timer,
body:not(.in-lobby) .turn-timer span,
body:not(.in-lobby) .seat.turn-spotlight::before,
body:not(.in-lobby) .seat.turn-spotlight::after {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

body:not(.in-lobby) .seat.turn-spotlight .player-nameplate {
  animation: activeNameplatePulse 1.15s ease-in-out infinite !important;
  border-color: rgba(255,228,92,.88) !important;
  box-shadow:
    0 0 0 2px rgba(255,228,92,.58),
    0 0 16px rgba(255,228,92,.44),
    inset 0 1px rgba(255,255,255,.22) !important;
}

.card,
button.card,
body:not(.in-lobby) .card,
body:not(.in-lobby) button.card {
  align-items: center !important;
  box-sizing: border-box !important;
  display: inline-grid !important;
  justify-items: center !important;
  overflow: hidden !important;
  transform: none !important;
  transform-origin: center center !important;
}

.card .card-corner,
body:not(.in-lobby) .card .card-corner {
  align-items: center !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  justify-content: center !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  padding: 0 !important;
  text-align: center !important;
  width: 1.55em !important;
}

.card .card-corner .card-rank,
.card .card-corner .card-suit,
body:not(.in-lobby) .card .card-corner .card-rank,
body:not(.in-lobby) .card .card-corner .card-suit {
  align-items: center !important;
  display: flex !important;
  justify-content: center !important;
  left: auto !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
  right: auto !important;
  text-align: center !important;
  transform: none !important;
  width: 100% !important;
}

.card .face,
body:not(.in-lobby) .card .face {
  align-items: center !important;
  display: grid !important;
  inset: 16% 13% !important;
  justify-items: center !important;
  margin: 0 !important;
  place-items: center !important;
  text-align: center !important;
  transform: none !important;
}

.card .pips,
.card .pips i,
body:not(.in-lobby) .card .pips,
body:not(.in-lobby) .card .pips i {
  align-items: center !important;
  display: grid !important;
  justify-items: center !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  place-items: center !important;
  text-align: center !important;
  transform: none !important;
}

.card.revealed,
.card.selected,
.card.touch-active,
.card.card-large,
.reveal-choice,
body:not(.in-lobby) .card.revealed,
body:not(.in-lobby) .card.selected,
body:not(.in-lobby) .card.touch-active,
body:not(.in-lobby) .card.card-large,
body:not(.in-lobby) .reveal-choice {
  transform: none !important;
}

@media (hover: none), (pointer: coarse) {
  .card:hover,
  .card:active,
  .card:focus,
  .card:focus-visible,
  button.card:hover,
  button.card:active,
  button.card:focus,
  button.card:focus-visible {
    transform: none !important;
  }
}

body:not(.table-loading) .table-debug-status,
body:not(.in-lobby):not(.table-loading) .table-debug-status {
  display: none !important;
  pointer-events: none !important;
}

@media (orientation: landscape) and (max-height: 760px) {
  body:not(.in-lobby) {
    height: 100dvh;
    max-height: 100dvh;
  }

  body:not(.in-lobby) .game-table-screen,
  body:not(.in-lobby) .game-fullscreen-shell {
    padding-top: env(safe-area-inset-top);
    padding-right: env(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
  }

  body:not(.in-lobby) .top-bar {
    min-height: clamp(30px, 8dvh, 46px) !important;
  }

  body:not(.in-lobby) .score-strip button {
    min-height: 28px !important;
    padding: 4px 7px !important;
  }

  body:not(.in-lobby) .action-panel {
    bottom: calc(env(safe-area-inset-bottom) + 4px) !important;
  }

  body:not(.in-lobby) .pot-stack,
  body:not(.in-lobby) .result-banner {
    font-size: clamp(9px, 1.7dvh, 13px) !important;
    max-width: min(26vw, 11rem) !important;
  }
}

@media (orientation: landscape) and (max-width: 900px),
       (orientation: landscape) and (max-height: 500px) {
  body:not(.in-lobby) .reveal-overlay,
  body:not(.in-lobby) .reveal-overlay.show {
    max-width: min(42vw, 18rem) !important;
    top: clamp(48px, 18%, 106px) !important;
  }

  body:not(.in-lobby) .pot-stack {
    left: clamp(16%, 23vw, 28%) !important;
    top: 36% !important;
  }

  body:not(.in-lobby) .result-banner {
    left: clamp(16%, 23vw, 28%) !important;
    top: 49% !important;
  }
}

/* Urgent final bug fix layer: no table resize, only card art, betting flow
   visibility, bottom-edge card offsets, and non-blocking center messages. */
.card .face,
body:not(.in-lobby) .card .face,
body:not(.in-lobby) .hole-cards .card .face,
body:not(.in-lobby) .community .card .face,
body:not(.in-lobby) .reveal-choice .face {
  align-items: center !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: 1fr !important;
  inset: 17% 15% !important;
  justify-items: center !important;
  overflow: hidden !important;
  place-items: center !important;
  text-align: center !important;
}

.card .pips,
body:not(.in-lobby) .card .pips {
  align-items: center !important;
  column-gap: .08em !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(5, minmax(0, 1fr)) !important;
  height: 100% !important;
  justify-items: center !important;
  margin: 0 !important;
  max-height: 100% !important;
  max-width: 100% !important;
  overflow: hidden !important;
  padding: 0 !important;
  place-items: center !important;
  row-gap: 0 !important;
  width: 100% !important;
}

.card .pips i,
body:not(.in-lobby) .card .pips i {
  align-items: center !important;
  display: flex !important;
  font-size: min(1em, 120%) !important;
  height: 100% !important;
  justify-content: center !important;
  line-height: 1 !important;
  margin: 0 !important;
  max-height: 100% !important;
  max-width: 100% !important;
  min-height: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  position: static !important;
  text-align: center !important;
  transform: none !important;
  width: 100% !important;
}

.card .pips-1,
body:not(.in-lobby) .card .pips-1 {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.card .pips-1 i,
body:not(.in-lobby) .card .pips-1 i {
  font-size: 1.7em !important;
  width: auto !important;
}

.card .pips-2 i:nth-child(1),
.card .pips-3 i:nth-child(1),
.card .pips-4 i:nth-child(1),
.card .pips-5 i:nth-child(1),
.card .pips-6 i:nth-child(1),
.card .pips-7 i:nth-child(1),
.card .pips-8 i:nth-child(1),
.card .pips-9 i:nth-child(1),
.card .pips-10 i:nth-child(1) { grid-column: 1; grid-row: 1; }
.card .pips-2 i:nth-child(2),
.card .pips-3 i:nth-child(2),
.card .pips-4 i:nth-child(2),
.card .pips-5 i:nth-child(2),
.card .pips-6 i:nth-child(2),
.card .pips-7 i:nth-child(2),
.card .pips-8 i:nth-child(2),
.card .pips-9 i:nth-child(2),
.card .pips-10 i:nth-child(2) { grid-column: 2; grid-row: 5; }
.card .pips-3 i:nth-child(3),
.card .pips-5 i:nth-child(5),
.card .pips-9 i:nth-child(9) { grid-column: 1 / -1; grid-row: 3; }
.card .pips-4 i:nth-child(3),
.card .pips-5 i:nth-child(3),
.card .pips-6 i:nth-child(3),
.card .pips-7 i:nth-child(3),
.card .pips-8 i:nth-child(3),
.card .pips-9 i:nth-child(3),
.card .pips-10 i:nth-child(3) { grid-column: 2; grid-row: 1; }
.card .pips-4 i:nth-child(4),
.card .pips-5 i:nth-child(4),
.card .pips-6 i:nth-child(4),
.card .pips-7 i:nth-child(4),
.card .pips-8 i:nth-child(4),
.card .pips-9 i:nth-child(4),
.card .pips-10 i:nth-child(4) { grid-column: 1; grid-row: 5; }
.card .pips-6 i:nth-child(5),
.card .pips-7 i:nth-child(5),
.card .pips-8 i:nth-child(5),
.card .pips-9 i:nth-child(5),
.card .pips-10 i:nth-child(5) { grid-column: 1; grid-row: 3; }
.card .pips-6 i:nth-child(6),
.card .pips-7 i:nth-child(6),
.card .pips-8 i:nth-child(6),
.card .pips-9 i:nth-child(6),
.card .pips-10 i:nth-child(6) { grid-column: 2; grid-row: 3; }
.card .pips-7 i:nth-child(7),
.card .pips-8 i:nth-child(7),
.card .pips-9 i:nth-child(7),
.card .pips-10 i:nth-child(7) { grid-column: 1 / -1; grid-row: 2; }
.card .pips-8 i:nth-child(8),
.card .pips-9 i:nth-child(8),
.card .pips-10 i:nth-child(8) { grid-column: 1 / -1; grid-row: 4; }
.card .pips-10 i:nth-child(9) { grid-column: 1; grid-row: 2; }
.card .pips-10 i:nth-child(10) { grid-column: 2; grid-row: 4; }

.card .royalty,
body:not(.in-lobby) .card .royalty {
  align-items: center !important;
  display: grid !important;
  height: 100% !important;
  justify-items: center !important;
  line-height: 1 !important;
  place-items: center !important;
  text-align: center !important;
  width: 100% !important;
}

.card .royalty b,
.card .royalty small,
body:not(.in-lobby) .card .royalty b,
body:not(.in-lobby) .card .royalty small {
  line-height: 1 !important;
  margin: 0 !important;
  text-align: center !important;
  transform: none !important;
}

body:not(.in-lobby) .game-stage .seat-bottom-left .hole-cards {
  transform: translate(-10%, 8%) !important;
}

body:not(.in-lobby) .game-stage .seat-left-lower .hole-cards {
  transform: translate(-8%, 5%) !important;
}

body:not(.in-lobby) .game-stage .seat-bottom .hole-cards {
  transform: translateY(7%) !important;
}

body:not(.in-lobby) .game-stage .seat-bottom-right .hole-cards {
  transform: translate(10%, 8%) !important;
}

body:not(.in-lobby) .game-stage .reveal-overlay,
body:not(.in-lobby) .game-stage .reveal-overlay.show {
  left: 50% !important;
  max-width: min(38vw, 20rem) !important;
  min-width: 0 !important;
  padding: clamp(3px, .7dvh, 8px) clamp(8px, 1vw, 13px) !important;
  top: clamp(52px, 18%, 124px) !important;
  transform: translate(-50%, -50%) !important;
}

body:not(.in-lobby) .game-stage .result-banner {
  left: clamp(16%, 23vw, 28%) !important;
  max-width: min(19vw, 11rem) !important;
  top: 45% !important;
}

@media (orientation: landscape) and (max-height: 760px) {
  body:not(.in-lobby) .game-stage .reveal-overlay,
  body:not(.in-lobby) .game-stage .reveal-overlay.show {
    max-width: min(36vw, 16rem) !important;
    top: clamp(44px, 16%, 92px) !important;
  }

  body:not(.in-lobby) .game-stage .result-banner {
    top: 43% !important;
  }
}

/* === MOBILE LAYOUT REBUILD ===============================================
   Single mobile/tablet architecture. This supersedes earlier mobile seat,
   z-index, viewport, fullscreen, and safe-area workarounds.

   Layer order:
   1 felt/table graphic
   2 community cards
   3 player cards
   4 player names/chips
   5 pot/status
   6 action controls
   7 navigation
   8 modal windows
*/

:root {
  --mobile-felt-layer: 10;
  --mobile-community-layer: 20;
  --mobile-player-card-layer: 30;
  --mobile-player-name-layer: 40;
  --mobile-pot-layer: 50;
  --mobile-action-layer: 60;
  --mobile-navigation-layer: 70;
  --mobile-modal-layer: 100;
}

@media (pointer: coarse) {
body.mobile-table-mode:not(.in-lobby),
body.phone-landscape:not(.in-lobby),
body.tablet-landscape:not(.in-lobby) {
  background: #050914 !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  overscroll-behavior: none !important;
  touch-action: manipulation !important;
  width: 100vw !important;
}

body.mobile-table-mode:not(.in-lobby) .game-table-screen,
body.mobile-table-mode:not(.in-lobby) .game-fullscreen-shell,
body.mobile-table-mode:not(.in-lobby) .poker-table-wrapper,
body.phone-landscape:not(.in-lobby) .game-table-screen,
body.phone-landscape:not(.in-lobby) .game-fullscreen-shell,
body.phone-landscape:not(.in-lobby) .poker-table-wrapper,
body.tablet-landscape:not(.in-lobby) .game-table-screen,
body.tablet-landscape:not(.in-lobby) .game-fullscreen-shell,
body.tablet-landscape:not(.in-lobby) .poker-table-wrapper {
  background: #050914 !important;
  box-sizing: border-box !important;
  height: 100dvh !important;
  left: 0 !important;
  margin: 0 !important;
  max-height: 100dvh !important;
  min-height: 100svh !important;
  overflow: hidden !important;
  padding: env(safe-area-inset-top, 0px) env(safe-area-inset-right, 0px) env(safe-area-inset-bottom, 0px) env(safe-area-inset-left, 0px) !important;
  position: fixed !important;
  right: auto !important;
  top: 0 !important;
  transform: none !important;
  width: 100vw !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage,
body.phone-landscape:not(.in-lobby) .game-stage,
body.tablet-landscape:not(.in-lobby) .game-stage {
  --mobile-nav-h: clamp(26px, 6.2dvh, 42px);
  --mobile-action-h: clamp(40px, 10.5dvh, 66px);
  --mobile-scene-top: calc(var(--mobile-nav-h) + clamp(1px, .3dvh, 3px));
  --mobile-scene-bottom: calc(var(--mobile-action-h) + clamp(2px, .6dvh, 5px));
  --mobile-seat-w: clamp(54px, 9.5vw, 118px);
  --mobile-name-font: clamp(8px, 1.18vw, 14px);
  --mobile-stack-font: clamp(7px, 1vw, 12px);
  --mobile-card-w: clamp(20px, 3.7vw, 50px);
  --mobile-card-h: calc(var(--mobile-card-w) * 1.42);
  --mobile-local-card-w: clamp(28px, 5.2vw, 68px);
  --mobile-local-card-h: calc(var(--mobile-local-card-w) * 1.42);
  --mobile-table-w: 100%;
  background: #050914 !important;
  box-sizing: border-box !important;
  height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  left: env(safe-area-inset-left, 0px) !important;
  margin: 0 !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  position: fixed !important;
  right: auto !important;
  top: env(safe-area-inset-top, 0px) !important;
  transform: none !important;
  width: calc(100vw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px)) !important;
  z-index: 0 !important;
}

body.mobile-table-mode:not(.in-lobby) .game-shell,
body.phone-landscape:not(.in-lobby) .game-shell,
body.tablet-landscape:not(.in-lobby) .game-shell {
  background: transparent !important;
  display: block !important;
  height: 100% !important;
  margin: 0 !important;
  max-height: 100% !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: relative !important;
  width: 100% !important;
}

body.mobile-table-mode:not(.in-lobby) .top-bar,
body.phone-landscape:not(.in-lobby) .top-bar,
body.tablet-landscape:not(.in-lobby) .top-bar {
  align-items: center !important;
  background: rgba(5, 9, 20, .94) !important;
  border-bottom: 1px solid rgba(255,255,255,.12) !important;
  box-sizing: border-box !important;
  display: flex !important;
  gap: 6px !important;
  height: var(--mobile-nav-h) !important;
  justify-content: flex-end !important;
  left: 0 !important;
  margin: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 2px 6px !important;
  position: absolute !important;
  right: 0 !important;
  top: 0 !important;
  visibility: visible !important;
  z-index: var(--mobile-navigation-layer) !important;
}

body.mobile-table-mode:not(.in-lobby) .top-bar > div:first-child,
body.phone-landscape:not(.in-lobby) .top-bar > div:first-child,
body.tablet-landscape:not(.in-lobby) .top-bar > div:first-child {
  display: none !important;
}

body.mobile-table-mode:not(.in-lobby) .score-strip,
body.phone-landscape:not(.in-lobby) .score-strip,
body.tablet-landscape:not(.in-lobby) .score-strip {
  align-items: center !important;
  display: flex !important;
  flex: 1 1 auto !important;
  gap: clamp(2px, .48vw, 7px) !important;
  justify-content: flex-end !important;
  min-width: 0 !important;
  overflow: hidden !important;
  width: 100% !important;
}

body.mobile-table-mode:not(.in-lobby) .score-strip > span,
body.phone-landscape:not(.in-lobby) .score-strip > span,
body.tablet-landscape:not(.in-lobby) .score-strip > span {
  font-size: clamp(7px, .95vw, 12px) !important;
  line-height: 1 !important;
  min-width: 0 !important;
  padding: 1px 3px !important;
  white-space: nowrap !important;
}

body.mobile-table-mode:not(.in-lobby) .score-strip button,
body.phone-landscape:not(.in-lobby) .score-strip button,
body.tablet-landscape:not(.in-lobby) .score-strip button {
  border-radius: 6px !important;
  flex: 0 0 auto !important;
  font-size: clamp(7px, .95vw, 12px) !important;
  line-height: 1 !important;
  min-height: clamp(22px, 4.8dvh, 32px) !important;
  padding: 2px 5px !important;
  white-space: nowrap !important;
}

body.mobile-table-mode:not(.in-lobby) .table-scene,
body.phone-landscape:not(.in-lobby) .table-scene,
body.tablet-landscape:not(.in-lobby) .table-scene {
  background:
    radial-gradient(circle at 50% 44%, rgba(39,231,255,.08), transparent 46%),
    #050914 !important;
  bottom: var(--mobile-scene-bottom) !important;
  box-sizing: border-box !important;
  height: auto !important;
  left: 0 !important;
  margin: 0 !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  right: 0 !important;
  top: var(--mobile-scene-top) !important;
  transform: none !important;
  width: 100% !important;
  z-index: 1 !important;
}

body.mobile-table-mode:not(.in-lobby) .poker-table,
body.phone-landscape:not(.in-lobby) .poker-table,
body.tablet-landscape:not(.in-lobby) .poker-table {
  border-radius: 999px !important;
  height: min(68%, calc(100vw * .43)) !important;
  left: 50% !important;
  margin: 0 !important;
  min-width: 95% !important;
  overflow: visible !important;
  position: absolute !important;
  top: 48% !important;
  transform: translate(-50%, -50%) !important;
  width: var(--mobile-table-w) !important;
  z-index: var(--mobile-felt-layer) !important;
}

body.mobile-table-mode:not(.in-lobby) .felt,
body.phone-landscape:not(.in-lobby) .felt,
body.tablet-landscape:not(.in-lobby) .felt {
  inset: 0 !important;
  overflow: visible !important;
  position: absolute !important;
  z-index: var(--mobile-felt-layer) !important;
}

body.mobile-table-mode:not(.in-lobby) .community,
body.phone-landscape:not(.in-lobby) .community,
body.tablet-landscape:not(.in-lobby) .community {
  display: flex !important;
  gap: clamp(3px, .7vw, 10px) !important;
  left: 50% !important;
  max-width: 52% !important;
  position: absolute !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: var(--mobile-community-layer) !important;
}

body.mobile-table-mode:not(.in-lobby) .community .card,
body.phone-landscape:not(.in-lobby) .community .card,
body.tablet-landscape:not(.in-lobby) .community .card {
  height: clamp(42px, 13.8dvh, 108px) !important;
  width: clamp(30px, 9.8dvh, 76px) !important;
}

body.mobile-table-mode:not(.in-lobby) .seat,
body.phone-landscape:not(.in-lobby) .seat,
body.tablet-landscape:not(.in-lobby) .seat {
  align-items: center !important;
  display: grid !important;
  gap: 0 !important;
  grid-template-rows: auto auto auto auto auto !important;
  justify-items: center !important;
  margin: 0 !important;
  max-width: var(--mobile-seat-w) !important;
  min-width: 0 !important;
  overflow: visible !important;
  padding: 0 !important;
  position: absolute !important;
  width: var(--mobile-seat-w) !important;
  z-index: var(--mobile-player-name-layer) !important;
}

body.mobile-table-mode:not(.in-lobby) .seat-bottom { bottom: 0 !important; left: 50% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }
body.mobile-table-mode:not(.in-lobby) .seat-bottom-left { bottom: 5% !important; left: 23% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }
body.mobile-table-mode:not(.in-lobby) .seat-left-lower { left: 0.5% !important; right: auto !important; top: 70% !important; transform: translateY(-50%) !important; }
body.mobile-table-mode:not(.in-lobby) .seat-left-upper { left: 0.5% !important; right: auto !important; top: 27% !important; transform: translateY(-50%) !important; }
body.mobile-table-mode:not(.in-lobby) .seat-top-left { left: 24% !important; right: auto !important; top: 2% !important; transform: translateX(-50%) !important; }
body.mobile-table-mode:not(.in-lobby) .seat-top { left: 50% !important; right: auto !important; top: 0 !important; transform: translateX(-50%) !important; }
body.mobile-table-mode:not(.in-lobby) .seat-top-right { left: 76% !important; right: auto !important; top: 2% !important; transform: translateX(-50%) !important; }
body.mobile-table-mode:not(.in-lobby) .seat-right-upper { left: auto !important; right: 0.5% !important; top: 27% !important; transform: translateY(-50%) !important; }
body.mobile-table-mode:not(.in-lobby) .seat-right-lower { left: auto !important; right: 0.5% !important; top: 70% !important; transform: translateY(-50%) !important; }
body.mobile-table-mode:not(.in-lobby) .seat-bottom-right { bottom: 5% !important; left: 77% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }

body.phone-landscape:not(.in-lobby) .seat-bottom { bottom: 0 !important; left: 50% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }
body.phone-landscape:not(.in-lobby) .seat-bottom-left { bottom: 5% !important; left: 23% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }
body.phone-landscape:not(.in-lobby) .seat-left-lower { left: 0.5% !important; right: auto !important; top: 70% !important; transform: translateY(-50%) !important; }
body.phone-landscape:not(.in-lobby) .seat-left-upper { left: 0.5% !important; right: auto !important; top: 27% !important; transform: translateY(-50%) !important; }
body.phone-landscape:not(.in-lobby) .seat-top-left { left: 24% !important; right: auto !important; top: 2% !important; transform: translateX(-50%) !important; }
body.phone-landscape:not(.in-lobby) .seat-top { left: 50% !important; right: auto !important; top: 0 !important; transform: translateX(-50%) !important; }
body.phone-landscape:not(.in-lobby) .seat-top-right { left: 76% !important; right: auto !important; top: 2% !important; transform: translateX(-50%) !important; }
body.phone-landscape:not(.in-lobby) .seat-right-upper { left: auto !important; right: 0.5% !important; top: 27% !important; transform: translateY(-50%) !important; }
body.phone-landscape:not(.in-lobby) .seat-right-lower { left: auto !important; right: 0.5% !important; top: 70% !important; transform: translateY(-50%) !important; }
body.phone-landscape:not(.in-lobby) .seat-bottom-right { bottom: 5% !important; left: 77% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }

body.tablet-landscape:not(.in-lobby) .seat-bottom { bottom: 0 !important; left: 50% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }
body.tablet-landscape:not(.in-lobby) .seat-bottom-left { bottom: 4% !important; left: 25% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }
body.tablet-landscape:not(.in-lobby) .seat-left-lower { left: 1% !important; right: auto !important; top: 68% !important; transform: translateY(-50%) !important; }
body.tablet-landscape:not(.in-lobby) .seat-left-upper { left: 1% !important; right: auto !important; top: 29% !important; transform: translateY(-50%) !important; }
body.tablet-landscape:not(.in-lobby) .seat-top-left { left: 26% !important; right: auto !important; top: 3% !important; transform: translateX(-50%) !important; }
body.tablet-landscape:not(.in-lobby) .seat-top { left: 50% !important; right: auto !important; top: 0 !important; transform: translateX(-50%) !important; }
body.tablet-landscape:not(.in-lobby) .seat-top-right { left: 74% !important; right: auto !important; top: 3% !important; transform: translateX(-50%) !important; }
body.tablet-landscape:not(.in-lobby) .seat-right-upper { left: auto !important; right: 1% !important; top: 29% !important; transform: translateY(-50%) !important; }
body.tablet-landscape:not(.in-lobby) .seat-right-lower { left: auto !important; right: 1% !important; top: 68% !important; transform: translateY(-50%) !important; }
body.tablet-landscape:not(.in-lobby) .seat-bottom-right { bottom: 4% !important; left: 75% !important; right: auto !important; top: auto !important; transform: translateX(-50%) !important; }

body.mobile-table-mode:not(.in-lobby) .hole-cards,
body.phone-landscape:not(.in-lobby) .hole-cards,
body.tablet-landscape:not(.in-lobby) .hole-cards {
  display: flex !important;
  gap: clamp(2px, .35vw, 6px) !important;
  justify-content: center !important;
  min-height: calc(var(--mobile-card-h) + 2px) !important;
  overflow: visible !important;
  transform: none !important;
  z-index: var(--mobile-player-card-layer) !important;
}

body.mobile-table-mode:not(.in-lobby) .hole-cards .card,
body.phone-landscape:not(.in-lobby) .hole-cards .card,
body.tablet-landscape:not(.in-lobby) .hole-cards .card {
  font-size: calc(var(--mobile-card-w) * .34) !important;
  height: var(--mobile-card-h) !important;
  transform: none !important;
  width: var(--mobile-card-w) !important;
}

body.mobile-table-mode:not(.in-lobby) .seat-bottom .hole-cards .card,
body.phone-landscape:not(.in-lobby) .seat-bottom .hole-cards .card,
body.tablet-landscape:not(.in-lobby) .seat-bottom .hole-cards .card {
  font-size: calc(var(--mobile-local-card-w) * .34) !important;
  height: var(--mobile-local-card-h) !important;
  width: var(--mobile-local-card-w) !important;
}

body.mobile-table-mode:not(.in-lobby) .player-nameplate,
body.phone-landscape:not(.in-lobby) .player-nameplate,
body.tablet-landscape:not(.in-lobby) .player-nameplate {
  border-radius: 6px !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
  padding: 2px 5px !important;
  position: relative !important;
  width: min(100%, var(--mobile-seat-w)) !important;
  z-index: var(--mobile-player-name-layer) !important;
}

body.mobile-table-mode:not(.in-lobby) .player-nameplate strong,
body.phone-landscape:not(.in-lobby) .player-nameplate strong,
body.tablet-landscape:not(.in-lobby) .player-nameplate strong {
  font-size: var(--mobile-name-font) !important;
  line-height: 1.02 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.mobile-table-mode:not(.in-lobby) .player-nameplate span,
body.phone-landscape:not(.in-lobby) .player-nameplate span,
body.tablet-landscape:not(.in-lobby) .player-nameplate span,
body.mobile-table-mode:not(.in-lobby) .status-pill,
body.phone-landscape:not(.in-lobby) .status-pill,
body.tablet-landscape:not(.in-lobby) .status-pill,
body.mobile-table-mode:not(.in-lobby) .hand-readout,
body.phone-landscape:not(.in-lobby) .hand-readout,
body.tablet-landscape:not(.in-lobby) .hand-readout {
  font-size: var(--mobile-stack-font) !important;
  line-height: 1 !important;
  max-width: var(--mobile-seat-w) !important;
  overflow: hidden !important;
  padding: 2px 5px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.mobile-table-mode:not(.in-lobby) .pot-stack,
body.phone-landscape:not(.in-lobby) .pot-stack,
body.tablet-landscape:not(.in-lobby) .pot-stack {
  bottom: auto !important;
  left: 50% !important;
  pointer-events: none !important;
  position: absolute !important;
  top: 34% !important;
  transform: translate(-50%, -50%) !important;
  z-index: var(--mobile-pot-layer) !important;
}

body.mobile-table-mode:not(.in-lobby) .result-banner,
body.phone-landscape:not(.in-lobby) .result-banner,
body.tablet-landscape:not(.in-lobby) .result-banner,
body.mobile-table-mode:not(.in-lobby) .reveal-overlay,
body.mobile-table-mode:not(.in-lobby) .reveal-overlay.show,
body.phone-landscape:not(.in-lobby) .reveal-overlay,
body.phone-landscape:not(.in-lobby) .reveal-overlay.show,
body.tablet-landscape:not(.in-lobby) .reveal-overlay,
body.tablet-landscape:not(.in-lobby) .reveal-overlay.show {
  bottom: auto !important;
  left: 50% !important;
  max-width: min(38vw, 18rem) !important;
  pointer-events: none !important;
  position: absolute !important;
  right: auto !important;
  top: 22% !important;
  transform: translate(-50%, -50%) !important;
  z-index: var(--mobile-pot-layer) !important;
}

body.mobile-table-mode:not(.in-lobby) .action-panel,
body.phone-landscape:not(.in-lobby) .action-panel,
body.tablet-landscape:not(.in-lobby) .action-panel {
  background: linear-gradient(180deg, rgba(3,8,26,0), rgba(3,8,26,.95) 24%, rgba(3,8,26,.99)) !important;
  bottom: 0 !important;
  box-sizing: border-box !important;
  height: var(--mobile-action-h) !important;
  left: 0 !important;
  margin: 0 !important;
  max-height: var(--mobile-action-h) !important;
  overflow: visible !important;
  padding: clamp(2px, .6dvh, 5px) clamp(6px, 1vw, 12px) !important;
  position: absolute !important;
  right: 0 !important;
  top: auto !important;
  z-index: var(--mobile-action-layer) !important;
}

body.mobile-table-mode:not(.in-lobby) .controls,
body.phone-landscape:not(.in-lobby) .controls,
body.tablet-landscape:not(.in-lobby) .controls {
  align-items: center !important;
  display: grid !important;
  gap: 6px !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  height: 100% !important;
  margin: 0 auto !important;
  max-width: min(760px, 100%) !important;
  width: 100% !important;
}

body.mobile-table-mode:not(.in-lobby) .controls button,
body.phone-landscape:not(.in-lobby) .controls button,
body.tablet-landscape:not(.in-lobby) .controls button {
  border-radius: 7px !important;
  font-size: clamp(9px, 1.65vw, 15px) !important;
  min-height: clamp(30px, 7dvh, 48px) !important;
  padding: 3px 8px !important;
}

body.mobile-table-mode:not(.in-lobby) .controls.seat-pending,
body.phone-landscape:not(.in-lobby) .controls.seat-pending,
body.tablet-landscape:not(.in-lobby) .controls.seat-pending,
body.mobile-table-mode:not(.in-lobby) .controls.status-only,
body.phone-landscape:not(.in-lobby) .controls.status-only,
body.tablet-landscape:not(.in-lobby) .controls.status-only {
  display: flex !important;
  justify-content: center !important;
  max-width: min(460px, 82vw) !important;
}

body.mobile-table-mode:not(.in-lobby) .controls.seat-pending #newHand,
body.phone-landscape:not(.in-lobby) .controls.seat-pending #newHand,
body.tablet-landscape:not(.in-lobby) .controls.seat-pending #newHand,
body.mobile-table-mode:not(.in-lobby) .controls.status-only #newHand,
body.phone-landscape:not(.in-lobby) .controls.status-only #newHand,
body.tablet-landscape:not(.in-lobby) .controls.status-only #newHand {
  border-radius: 999px !important;
  display: inline-flex !important;
  flex: 0 1 auto !important;
  font-size: clamp(10px, 1.8vw, 15px) !important;
  min-height: clamp(28px, 6dvh, 42px) !important;
  padding: 3px 14px !important;
  width: auto !important;
}

body.mobile-table-mode:not(.in-lobby) .modal,
body.mobile-table-mode:not(.in-lobby) .reload-modal,
body.mobile-table-mode:not(.in-lobby) .odds-modal,
body.phone-landscape:not(.in-lobby) .modal,
body.phone-landscape:not(.in-lobby) .reload-modal,
body.phone-landscape:not(.in-lobby) .odds-modal,
body.tablet-landscape:not(.in-lobby) .modal,
body.tablet-landscape:not(.in-lobby) .reload-modal,
body.tablet-landscape:not(.in-lobby) .odds-modal {
  z-index: var(--mobile-modal-layer) !important;
}

body.mobile-table-mode:not(.in-lobby) .turn-callout,
body.mobile-table-mode:not(.in-lobby) .turn-label,
body.mobile-table-mode:not(.in-lobby) .turn-timer,
body.phone-landscape:not(.in-lobby) .turn-callout,
body.phone-landscape:not(.in-lobby) .turn-label,
body.phone-landscape:not(.in-lobby) .turn-timer,
body.tablet-landscape:not(.in-lobby) .turn-callout,
body.tablet-landscape:not(.in-lobby) .turn-label,
body.tablet-landscape:not(.in-lobby) .turn-timer {
  display: none !important;
}
}

/* Small phones: iPhone SE / older compact Android landscape. */
@media (orientation: landscape) and (max-width: 740px), (orientation: landscape) and (max-height: 380px) {
  body.mobile-table-mode:not(.in-lobby) .game-stage,
  body.phone-landscape:not(.in-lobby) .game-stage {
    --mobile-nav-h: clamp(24px, 6.8dvh, 30px);
    --mobile-action-h: clamp(36px, 10.5dvh, 46px);
    --mobile-seat-w: clamp(46px, 8.4vw, 64px);
    --mobile-name-font: clamp(7px, 1.08vw, 9px);
    --mobile-stack-font: clamp(6px, .95vw, 8px);
    --mobile-card-w: clamp(17px, 3.25vw, 24px);
    --mobile-local-card-w: clamp(23px, 4.35vw, 34px);
  }

  body.phone-landscape:not(.in-lobby) .score-strip #topHeaderChips,
  body.phone-landscape:not(.in-lobby) .score-strip #stageLabel,
  body.phone-landscape:not(.in-lobby) .score-strip span:nth-of-type(2),
  body.phone-landscape:not(.in-lobby) .score-strip span:nth-of-type(3),
  body.phone-landscape:not(.in-lobby) .score-strip span:nth-of-type(4) {
    display: none !important;
  }

  body.phone-landscape:not(.in-lobby) .score-strip {
    justify-content: center !important;
  }

  body.phone-landscape:not(.in-lobby) .score-strip button {
    font-size: clamp(7px, 1.35vw, 9px) !important;
    min-height: 22px !important;
    padding: 2px 4px !important;
  }

  body.phone-landscape:not(.in-lobby) .poker-table {
    height: min(64%, calc(100vw * .39)) !important;
    top: 47% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-bottom-left { left: 21% !important; bottom: 5% !important; }
  body.phone-landscape:not(.in-lobby) .seat-bottom-right { left: 79% !important; bottom: 5% !important; }
  body.phone-landscape:not(.in-lobby) .seat-top-left { left: 22% !important; top: 2% !important; }
  body.phone-landscape:not(.in-lobby) .seat-top-right { left: 78% !important; top: 2% !important; }
}

/* Modern large phones: iPhone/Pixel/Galaxy Pro and Pro Max landscape. */
@media (orientation: landscape) and (min-width: 741px) and (max-width: 980px) and (max-height: 520px) {
  body.mobile-table-mode:not(.in-lobby) .game-stage,
  body.phone-landscape:not(.in-lobby) .game-stage {
    --mobile-nav-h: clamp(26px, 6dvh, 34px);
    --mobile-action-h: clamp(40px, 10dvh, 54px);
    --mobile-seat-w: clamp(58px, 9.1vw, 86px);
    --mobile-name-font: clamp(8px, 1.05vw, 11px);
    --mobile-stack-font: clamp(7px, .92vw, 10px);
    --mobile-card-w: clamp(20px, 3.45vw, 34px);
    --mobile-local-card-w: clamp(30px, 4.75vw, 46px);
  }

  body.phone-landscape:not(.in-lobby) .score-strip #topHeaderChips,
  body.phone-landscape:not(.in-lobby) .score-strip span:nth-of-type(3),
  body.phone-landscape:not(.in-lobby) .score-strip span:nth-of-type(4) {
    display: none !important;
  }

  body.phone-landscape:not(.in-lobby) .poker-table {
    height: min(67%, calc(100vw * .41)) !important;
    top: 47.5% !important;
  }
}

/* Tablets/iPads get larger readable controls while preserving the same layout. */
@media (orientation: landscape) and (min-width: 981px) {
  body.mobile-table-mode:not(.in-lobby) .game-stage,
  body.tablet-landscape:not(.in-lobby) .game-stage {
    --mobile-nav-h: clamp(34px, 5.5dvh, 52px);
    --mobile-action-h: clamp(56px, 9dvh, 86px);
    --mobile-seat-w: clamp(92px, 10vw, 138px);
    --mobile-name-font: clamp(12px, 1.1vw, 16px);
    --mobile-stack-font: clamp(10px, .92vw, 14px);
    --mobile-card-w: clamp(34px, 3.9vw, 58px);
    --mobile-local-card-w: clamp(48px, 5vw, 76px);
  }

  body.tablet-landscape:not(.in-lobby) .poker-table {
    height: min(70%, calc(100vw * .42)) !important;
    top: 49% !important;
  }
}

/* Phone landscape stabilization: visible-viewport budget for Safari bars.
   This is the phone-only owner for toolbar/table/action placement. */
@media (orientation: landscape) and (max-width: 980px), (orientation: landscape) and (max-height: 560px) {
  body.phone-landscape:not(.in-lobby),
  body.phone-landscape:not(.in-lobby) .game-table-screen,
  body.phone-landscape:not(.in-lobby) .game-fullscreen-shell,
  body.phone-landscape:not(.in-lobby) .poker-table-wrapper {
    height: min(100dvh, var(--visible-vh, 100dvh)) !important;
    max-height: min(100dvh, var(--visible-vh, 100dvh)) !important;
    min-height: min(100svh, var(--visible-vh, 100svh)) !important;
    overflow: hidden !important;
  }

  body.phone-landscape:not(.in-lobby) .game-stage {
    --phone-visible-h: min(100dvh, var(--visible-vh, 100dvh));
    --phone-visible-w: min(100vw, var(--visible-vw, 100vw));
    --mobile-nav-h: clamp(24px, calc(var(--phone-visible-h) * .075), 32px);
    --mobile-action-h: clamp(36px, calc(var(--phone-visible-h) * .115), 52px);
    --mobile-scene-top: calc(var(--mobile-nav-h) + 1px);
    --mobile-scene-bottom: calc(var(--mobile-action-h) + 1px);
    --mobile-seat-w: clamp(46px, calc(var(--phone-visible-w) * .082), 78px);
    --mobile-name-font: clamp(7px, calc(var(--phone-visible-w) * .0105), 10px);
    --mobile-stack-font: clamp(6px, calc(var(--phone-visible-w) * .009), 9px);
    --mobile-card-w: clamp(17px, calc(var(--phone-visible-h) * .075), 31px);
    --mobile-local-card-w: clamp(24px, calc(var(--phone-visible-h) * .11), 44px);
    height: calc(var(--phone-visible-h) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
    max-height: calc(var(--phone-visible-h) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  }

  body.phone-landscape:not(.in-lobby) .top-bar {
    height: var(--mobile-nav-h) !important;
    padding: 1px max(4px, env(safe-area-inset-right, 0px)) 1px max(4px, env(safe-area-inset-left, 0px)) !important;
  }

  body.phone-landscape:not(.in-lobby) .score-strip {
    gap: 2px !important;
    justify-content: center !important;
  }

  body.phone-landscape:not(.in-lobby) .score-strip #topHeaderChips,
  body.phone-landscape:not(.in-lobby) .score-strip #stageLabel,
  body.phone-landscape:not(.in-lobby) .score-strip span:nth-of-type(3),
  body.phone-landscape:not(.in-lobby) .score-strip span:nth-of-type(4) {
    display: none !important;
  }

  body.phone-landscape:not(.in-lobby) .score-strip > span {
    font-size: clamp(7px, 1.05vw, 10px) !important;
    padding: 1px 2px !important;
  }

  body.phone-landscape:not(.in-lobby) .score-strip button {
    border-radius: 5px !important;
    font-size: clamp(7px, 1.12vw, 10px) !important;
    min-height: clamp(21px, calc(var(--phone-visible-h) * .058), 28px) !important;
    padding: 1px 4px !important;
  }

  body.phone-landscape:not(.in-lobby) .table-scene {
    bottom: var(--mobile-scene-bottom) !important;
    top: var(--mobile-scene-top) !important;
  }

  body.phone-landscape:not(.in-lobby) .poker-table {
    height: min(64%, calc(var(--phone-visible-w) * .38), calc((var(--phone-visible-h) - var(--mobile-nav-h) - var(--mobile-action-h)) * .82)) !important;
    min-width: 95% !important;
    top: 45% !important;
    width: 100% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat,
  body.phone-landscape:not(.in-lobby) .seat-open {
    max-width: var(--mobile-seat-w) !important;
    width: var(--mobile-seat-w) !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-select-button,
  body.phone-landscape:not(.in-lobby) .inactive-seat {
    border-radius: 7px !important;
    box-sizing: border-box !important;
    min-height: clamp(24px, calc(var(--phone-visible-h) * .075), 34px) !important;
    padding: 2px 4px !important;
    width: 100% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-select-button span,
  body.phone-landscape:not(.in-lobby) .inactive-seat span {
    display: none !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-select-button strong,
  body.phone-landscape:not(.in-lobby) .inactive-seat strong {
    font-size: clamp(8px, 1.25vw, 11px) !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-bottom { bottom: 0 !important; left: 50% !important; }
  body.phone-landscape:not(.in-lobby) .seat-bottom-left { bottom: 5.5% !important; left: 20% !important; }
  body.phone-landscape:not(.in-lobby) .seat-bottom-right { bottom: 5.5% !important; left: 80% !important; }
  body.phone-landscape:not(.in-lobby) .seat-left-lower { left: 0 !important; top: 73% !important; }
  body.phone-landscape:not(.in-lobby) .seat-left-upper { left: 0 !important; top: 25% !important; }
  body.phone-landscape:not(.in-lobby) .seat-top-left { left: 22% !important; top: 1% !important; }
  body.phone-landscape:not(.in-lobby) .seat-top { left: 50% !important; top: 0 !important; }
  body.phone-landscape:not(.in-lobby) .seat-top-right { left: 78% !important; top: 1% !important; }
  body.phone-landscape:not(.in-lobby) .seat-right-upper { right: 0 !important; top: 25% !important; }
  body.phone-landscape:not(.in-lobby) .seat-right-lower { right: 0 !important; top: 73% !important; }

  body.phone-landscape:not(.in-lobby) .player-nameplate {
    padding: 1px 4px !important;
  }

  body.phone-landscape:not(.in-lobby) .status-pill,
  body.phone-landscape:not(.in-lobby) .hand-readout,
  body.phone-landscape:not(.in-lobby) .action-pop {
    display: none !important;
  }

  body.phone-landscape:not(.in-lobby) .action-panel {
    height: var(--mobile-action-h) !important;
    max-height: var(--mobile-action-h) !important;
    padding: 2px max(6px, env(safe-area-inset-right, 0px)) max(2px, env(safe-area-inset-bottom, 0px)) max(6px, env(safe-area-inset-left, 0px)) !important;
  }

  body.phone-landscape:not(.in-lobby) .controls {
    gap: 4px !important;
  }

  body.phone-landscape:not(.in-lobby) .controls button {
    font-size: clamp(9px, 1.45vw, 13px) !important;
    min-height: clamp(28px, calc(var(--phone-visible-h) * .078), 40px) !important;
    padding: 2px 7px !important;
  }

  body.phone-landscape:not(.in-lobby) .controls.seat-pending,
  body.phone-landscape:not(.in-lobby) .controls.status-only {
    height: 100% !important;
    max-width: min(340px, 68vw) !important;
  }

  body.phone-landscape:not(.in-lobby) .controls.seat-pending #newHand,
  body.phone-landscape:not(.in-lobby) .controls.status-only #newHand {
    box-shadow: 0 6px 16px rgba(0,0,0,.28) !important;
    font-size: clamp(9px, 1.45vw, 12px) !important;
    min-height: clamp(26px, calc(var(--phone-visible-h) * .07), 36px) !important;
    padding: 2px 12px !important;
    pointer-events: none !important;
  }

  body.phone-landscape:not(.in-lobby) .result-banner,
  body.phone-landscape:not(.in-lobby) .reveal-overlay,
  body.phone-landscape:not(.in-lobby) .reveal-overlay.show {
    font-size: clamp(9px, 1.35vw, 12px) !important;
    max-width: min(34vw, 15rem) !important;
    padding: 3px 8px !important;
    top: 18% !important;
  }
}

/* === MOBILE LANDSCAPE SCREEN REBUILD V2 ==================================
   Phone/Safari-visible viewport layout:
   row 1 compact toolbar, row 2 scalable table scene, row 3 action/status.
   The scene is sized from visualViewport-backed variables written by app.js. */
@media (orientation: landscape) and (max-width: 980px),
       (orientation: landscape) and (max-height: 560px) {
  body.phone-landscape:not(.in-lobby),
  body.phone-landscape:not(.in-lobby) .game-table-screen,
  body.phone-landscape:not(.in-lobby) .game-fullscreen-shell,
  body.phone-landscape:not(.in-lobby) .poker-table-wrapper {
    box-sizing: border-box !important;
    height: min(100dvh, var(--visible-vh, 100dvh)) !important;
    max-height: min(100dvh, var(--visible-vh, 100dvh)) !important;
    min-height: min(100svh, var(--visible-vh, 100svh)) !important;
    overflow: hidden !important;
    padding: 0 !important;
    width: 100vw !important;
  }

  body.phone-landscape:not(.in-lobby) .game-stage {
    --screen-w: min(100vw, var(--visible-vw, 100vw));
    --screen-h: min(100dvh, var(--visible-vh, 100dvh));
    --safe-t: env(safe-area-inset-top, 0px);
    --safe-r: env(safe-area-inset-right, 0px);
    --safe-b: env(safe-area-inset-bottom, 0px);
    --safe-l: env(safe-area-inset-left, 0px);
    --toolbar-h: clamp(22px, calc(var(--screen-h) * .068), 30px);
    --actions-h: clamp(34px, calc(var(--screen-h) * .105), 48px);
    --scene-h: calc(var(--screen-h) - var(--safe-t) - var(--safe-b) - var(--toolbar-h) - var(--actions-h));
    --seat-w: clamp(42px, calc(var(--screen-w) * .078), 74px);
    --seat-font: clamp(7px, calc(var(--screen-w) * .0102), 10px);
    --stack-font: clamp(6px, calc(var(--screen-w) * .0087), 9px);
    --opp-card-w: clamp(16px, calc(var(--scene-h) * .072), 30px);
    --hero-card-w: clamp(24px, calc(var(--scene-h) * .108), 44px);
    background: #050914 !important;
    box-sizing: border-box !important;
    display: grid !important;
    grid-template-rows: var(--toolbar-h) minmax(0, 1fr) var(--actions-h) !important;
    height: calc(var(--screen-h) - var(--safe-t) - var(--safe-b)) !important;
    left: var(--safe-l) !important;
    max-height: calc(var(--screen-h) - var(--safe-t) - var(--safe-b)) !important;
    overflow: hidden !important;
    position: fixed !important;
    right: auto !important;
    top: var(--safe-t) !important;
    transform: none !important;
    width: calc(var(--screen-w) - var(--safe-l) - var(--safe-r)) !important;
  }

  body.phone-landscape:not(.in-lobby) .game-shell {
    display: grid !important;
    grid-template-rows: var(--toolbar-h) minmax(0, 1fr) var(--actions-h) !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: relative !important;
    width: 100% !important;
  }

  body.phone-landscape:not(.in-lobby) .top-bar {
    align-items: center !important;
    display: flex !important;
    grid-row: 1 !important;
    height: var(--toolbar-h) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 1px 4px !important;
    position: relative !important;
    top: auto !important;
    width: 100% !important;
    z-index: 70 !important;
  }

  body.phone-landscape:not(.in-lobby) .score-strip {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 2px !important;
    justify-content: center !important;
    min-width: 0 !important;
    overflow: hidden !important;
    width: 100% !important;
  }

  body.phone-landscape:not(.in-lobby) .score-strip #topHeaderChips,
  body.phone-landscape:not(.in-lobby) .score-strip #stageLabel,
  body.phone-landscape:not(.in-lobby) .score-strip span:nth-of-type(3),
  body.phone-landscape:not(.in-lobby) .score-strip span:nth-of-type(4) {
    display: none !important;
  }

  body.phone-landscape:not(.in-lobby) .score-strip > span {
    flex: 0 1 auto !important;
    font-size: clamp(7px, 1vw, 10px) !important;
    padding: 0 2px !important;
  }

  body.phone-landscape:not(.in-lobby) .score-strip button {
    border-radius: 5px !important;
    flex: 0 0 auto !important;
    font-size: clamp(7px, 1.05vw, 10px) !important;
    line-height: 1 !important;
    min-height: calc(var(--toolbar-h) - 4px) !important;
    padding: 1px 4px !important;
    white-space: nowrap !important;
  }

  body.phone-landscape:not(.in-lobby) .table-scene {
    background:
      radial-gradient(circle at 50% 50%, rgba(39,231,255,.08), transparent 47%),
      #050914 !important;
    bottom: auto !important;
    box-sizing: border-box !important;
    grid-row: 2 !important;
    height: 100% !important;
    left: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: relative !important;
    right: auto !important;
    top: auto !important;
    width: 100% !important;
  }

  body.phone-landscape:not(.in-lobby) .poker-table {
    aspect-ratio: 2.28 / 1 !important;
    border-radius: 999px !important;
    height: min(72%, calc(100vw * .39), calc(var(--scene-h) * .78)) !important;
    left: 50% !important;
    min-width: 95% !important;
    overflow: visible !important;
    position: absolute !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: min(100%, calc(var(--scene-h) * 2.28)) !important;
    z-index: 10 !important;
  }

  body.phone-landscape:not(.in-lobby) .felt {
    inset: 0 !important;
    position: absolute !important;
  }

  body.phone-landscape:not(.in-lobby) .community {
    display: flex !important;
    gap: clamp(2px, .5vw, 7px) !important;
    left: 50% !important;
    max-width: 54% !important;
    position: absolute !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 20 !important;
  }

  body.phone-landscape:not(.in-lobby) .community .card {
    height: clamp(38px, calc(var(--scene-h) * .31), 92px) !important;
    width: clamp(27px, calc(var(--scene-h) * .22), 64px) !important;
  }

  body.phone-landscape:not(.in-lobby) .seat {
    display: grid !important;
    gap: 0 !important;
    justify-items: center !important;
    max-width: var(--seat-w) !important;
    min-width: 0 !important;
    overflow: visible !important;
    padding: 0 !important;
    position: absolute !important;
    width: var(--seat-w) !important;
    z-index: 40 !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-bottom { bottom: 0 !important; left: 50% !important; transform: translateX(-50%) !important; }
  body.phone-landscape:not(.in-lobby) .seat-bottom-left { bottom: 6% !important; left: 19% !important; transform: translateX(-50%) !important; }
  body.phone-landscape:not(.in-lobby) .seat-bottom-right { bottom: 6% !important; left: 81% !important; transform: translateX(-50%) !important; }
  body.phone-landscape:not(.in-lobby) .seat-left-lower { left: 0 !important; top: 74% !important; transform: translateY(-50%) !important; }
  body.phone-landscape:not(.in-lobby) .seat-left-upper { left: 0 !important; top: 25% !important; transform: translateY(-50%) !important; }
  body.phone-landscape:not(.in-lobby) .seat-top-left { left: 21% !important; top: 0 !important; transform: translateX(-50%) !important; }
  body.phone-landscape:not(.in-lobby) .seat-top { left: 50% !important; top: 0 !important; transform: translateX(-50%) !important; }
  body.phone-landscape:not(.in-lobby) .seat-top-right { left: 79% !important; top: 0 !important; transform: translateX(-50%) !important; }
  body.phone-landscape:not(.in-lobby) .seat-right-upper { right: 0 !important; top: 25% !important; transform: translateY(-50%) !important; }
  body.phone-landscape:not(.in-lobby) .seat-right-lower { right: 0 !important; top: 74% !important; transform: translateY(-50%) !important; }

  body.phone-landscape:not(.in-lobby) .seat-select-button,
  body.phone-landscape:not(.in-lobby) .inactive-seat {
    border-radius: 6px !important;
    min-height: clamp(22px, calc(var(--scene-h) * .112), 32px) !important;
    padding: 1px 3px !important;
    width: 100% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-select-button span,
  body.phone-landscape:not(.in-lobby) .inactive-seat span {
    display: none !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-select-button strong,
  body.phone-landscape:not(.in-lobby) .inactive-seat strong {
    font-size: clamp(8px, 1.18vw, 10px) !important;
    line-height: 1 !important;
  }

  body.phone-landscape:not(.in-lobby) .hole-cards {
    gap: 2px !important;
    min-height: calc(var(--opp-card-w) * 1.42 + 1px) !important;
    transform: none !important;
  }

  body.phone-landscape:not(.in-lobby) .hole-cards .card {
    font-size: calc(var(--opp-card-w) * .35) !important;
    height: calc(var(--opp-card-w) * 1.42) !important;
    width: var(--opp-card-w) !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-bottom .hole-cards .card {
    font-size: calc(var(--hero-card-w) * .35) !important;
    height: calc(var(--hero-card-w) * 1.42) !important;
    width: var(--hero-card-w) !important;
  }

  body.phone-landscape:not(.in-lobby) .player-nameplate {
    border-radius: 5px !important;
    min-width: 0 !important;
    padding: 1px 3px !important;
    width: 100% !important;
  }

  body.phone-landscape:not(.in-lobby) .player-nameplate strong {
    font-size: var(--seat-font) !important;
    line-height: 1 !important;
  }

  body.phone-landscape:not(.in-lobby) .player-nameplate span {
    font-size: var(--stack-font) !important;
    line-height: 1 !important;
  }

  body.phone-landscape:not(.in-lobby) .status-pill,
  body.phone-landscape:not(.in-lobby) .hand-readout,
  body.phone-landscape:not(.in-lobby) .action-pop {
    display: none !important;
  }

  body.phone-landscape:not(.in-lobby) .pot-stack {
    left: 50% !important;
    top: 32% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 50 !important;
  }

  body.phone-landscape:not(.in-lobby) .result-banner,
  body.phone-landscape:not(.in-lobby) .reveal-overlay,
  body.phone-landscape:not(.in-lobby) .reveal-overlay.show {
    font-size: clamp(8px, 1.25vw, 11px) !important;
    left: 50% !important;
    max-width: min(32vw, 13rem) !important;
    padding: 2px 7px !important;
    pointer-events: none !important;
    top: 17% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 55 !important;
  }

  body.phone-landscape:not(.in-lobby) .action-panel {
    background: linear-gradient(180deg, rgba(3,8,26,.04), rgba(3,8,26,.96) 34%, rgba(3,8,26,1)) !important;
    bottom: auto !important;
    box-sizing: border-box !important;
    grid-row: 3 !important;
    height: var(--actions-h) !important;
    max-height: var(--actions-h) !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 2px 6px !important;
    position: relative !important;
    top: auto !important;
    z-index: 60 !important;
  }

  body.phone-landscape:not(.in-lobby) .controls {
    align-items: center !important;
    display: grid !important;
    gap: 4px !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    height: 100% !important;
    max-width: min(620px, 96vw) !important;
  }

  body.phone-landscape:not(.in-lobby) .controls button {
    border-radius: 6px !important;
    font-size: clamp(9px, 1.45vw, 12px) !important;
    min-height: clamp(26px, calc(var(--actions-h) - 8px), 38px) !important;
    padding: 2px 7px !important;
  }

  body.phone-landscape:not(.in-lobby) .controls.seat-pending,
  body.phone-landscape:not(.in-lobby) .controls.status-only {
    display: flex !important;
    justify-content: center !important;
    max-width: min(320px, 66vw) !important;
  }

  body.phone-landscape:not(.in-lobby) .controls.seat-pending #newHand,
  body.phone-landscape:not(.in-lobby) .controls.status-only #newHand {
    border-radius: 999px !important;
    font-size: clamp(9px, 1.35vw, 12px) !important;
    min-height: clamp(24px, calc(var(--actions-h) - 10px), 34px) !important;
    padding: 2px 12px !important;
    pointer-events: none !important;
    width: auto !important;
  }
}

/* === EMERGENCY TABLE VISIBILITY ROLLBACK =================================
   Safety layer after the failed V2 grid experiment. Restore visible table
   rendering first: no zero-height grid collapse, no offscreen table scene,
   and top controls remain clickable above the table. */
body.phone-landscape:not(.in-lobby) .game-stage,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage {
  background: #050914 !important;
  display: block !important;
  height: calc(min(100dvh, var(--visible-vh, 100dvh)) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  left: env(safe-area-inset-left, 0px) !important;
  max-height: calc(min(100dvh, var(--visible-vh, 100dvh)) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  min-height: calc(min(100svh, var(--visible-vh, 100svh)) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  opacity: 1 !important;
  overflow: hidden !important;
  pointer-events: auto !important;
  position: fixed !important;
  right: auto !important;
  top: env(safe-area-inset-top, 0px) !important;
  transform: none !important;
  visibility: visible !important;
  width: calc(100vw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px)) !important;
  z-index: 0 !important;
}

body.phone-landscape:not(.in-lobby) .game-shell,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-shell {
  display: block !important;
  height: 100% !important;
  max-height: 100% !important;
  min-height: 100% !important;
  opacity: 1 !important;
  overflow: hidden !important;
  padding: 0 !important;
  pointer-events: auto !important;
  position: relative !important;
  visibility: visible !important;
  width: 100% !important;
}

body.phone-landscape:not(.in-lobby) .top-bar,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .top-bar {
  display: flex !important;
  height: clamp(26px, 7dvh, 36px) !important;
  left: 0 !important;
  min-height: clamp(26px, 7dvh, 36px) !important;
  opacity: 1 !important;
  overflow: hidden !important;
  pointer-events: auto !important;
  position: absolute !important;
  right: 0 !important;
  top: 0 !important;
  visibility: visible !important;
  z-index: 7000 !important;
}

body.phone-landscape:not(.in-lobby) .top-bar button,
body.phone-landscape:not(.in-lobby) .score-strip button,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .top-bar button,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .score-strip button {
  pointer-events: auto !important;
  position: relative !important;
  z-index: 7001 !important;
}

body.phone-landscape:not(.in-lobby) .table-scene,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .table-scene {
  bottom: clamp(42px, 12dvh, 64px) !important;
  display: block !important;
  height: auto !important;
  left: 0 !important;
  max-height: none !important;
  min-height: calc(min(100dvh, var(--visible-vh, 100dvh)) - clamp(26px, 7dvh, 36px) - clamp(42px, 12dvh, 64px) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  opacity: 1 !important;
  overflow: visible !important;
  pointer-events: auto !important;
  position: absolute !important;
  right: 0 !important;
  top: clamp(28px, 7.6dvh, 40px) !important;
  transform: none !important;
  visibility: visible !important;
  width: 100% !important;
  z-index: 1 !important;
}

body.phone-landscape:not(.in-lobby) .poker-table,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .poker-table {
  display: block !important;
  height: min(72%, calc(100vw * .42)) !important;
  left: 50% !important;
  max-height: 100% !important;
  min-height: clamp(150px, 42dvh, 320px) !important;
  min-width: 95% !important;
  opacity: 1 !important;
  overflow: visible !important;
  pointer-events: auto !important;
  position: absolute !important;
  top: 48% !important;
  transform: translate(-50%, -50%) !important;
  visibility: visible !important;
  width: 100% !important;
  z-index: 10 !important;
}

body.phone-landscape:not(.in-lobby) .felt,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .felt {
  display: block !important;
  inset: 0 !important;
  opacity: 1 !important;
  position: absolute !important;
  visibility: visible !important;
}

body.phone-landscape:not(.in-lobby) .action-panel,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .action-panel {
  bottom: 0 !important;
  display: grid !important;
  height: clamp(42px, 12dvh, 64px) !important;
  left: 0 !important;
  opacity: 1 !important;
  overflow: visible !important;
  pointer-events: auto !important;
  position: absolute !important;
  right: 0 !important;
  top: auto !important;
  visibility: visible !important;
  z-index: 6000 !important;
}

body.phone-landscape:not(.in-lobby) .controls,
body.phone-landscape:not(.in-lobby) .controls button,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .controls,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .controls button {
  pointer-events: auto !important;
}

/* === MOBILE LANDSCAPE PLAYABILITY TUNING =================================
   CSS-only refinement after visibility rollback. Keep table visible, use more
   of the phone viewport, compact the select-seat/status strip, and keep pot
   away from Seat 1 / local cards. */
@media (orientation: landscape) and (max-width: 980px),
       (orientation: landscape) and (max-height: 560px) {
  body.phone-landscape:not(.in-lobby) .game-stage,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage {
    --play-nav-h: clamp(24px, 6.4dvh, 34px);
    --play-actions-h: clamp(32px, 9.2dvh, 50px);
    --play-scene-top: calc(var(--play-nav-h) + 2px);
    --play-scene-bottom: calc(var(--play-actions-h) + 2px);
    --play-seat-w: clamp(44px, 7.4vw, 70px);
    --play-seat-font: clamp(7px, 1vw, 10px);
    --play-stack-font: clamp(6px, .88vw, 9px);
    --play-card-w: clamp(17px, 6.8dvh, 31px);
    --play-hero-card-w: clamp(25px, 10.3dvh, 46px);
  }

  body.phone-landscape:not(.in-lobby) .top-bar,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .top-bar {
    height: var(--play-nav-h) !important;
    min-height: var(--play-nav-h) !important;
    padding: 1px 4px !important;
  }

  body.phone-landscape:not(.in-lobby) .score-strip,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .score-strip {
    gap: 2px !important;
  }

  body.phone-landscape:not(.in-lobby) .score-strip button,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .score-strip button {
    font-size: clamp(7px, 1vw, 10px) !important;
    min-height: calc(var(--play-nav-h) - 4px) !important;
    padding: 1px 4px !important;
  }

  body.phone-landscape:not(.in-lobby) .table-scene,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .table-scene {
    bottom: var(--play-scene-bottom) !important;
    min-height: calc(min(100dvh, var(--visible-vh, 100dvh)) - var(--play-nav-h) - var(--play-actions-h) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 4px) !important;
    top: var(--play-scene-top) !important;
  }

  body.phone-landscape:not(.in-lobby) .poker-table,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .poker-table {
    height: min(84%, calc(100vw * .48)) !important;
    min-height: clamp(190px, 54dvh, 360px) !important;
    top: 49% !important;
    width: 100% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat {
    max-width: var(--play-seat-w) !important;
    width: var(--play-seat-w) !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-select-button,
  body.phone-landscape:not(.in-lobby) .inactive-seat,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-select-button,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .inactive-seat {
    min-height: clamp(21px, 6.4dvh, 30px) !important;
    padding: 1px 3px !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-select-button strong,
  body.phone-landscape:not(.in-lobby) .inactive-seat strong,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-select-button strong,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .inactive-seat strong {
    font-size: var(--play-seat-font) !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-bottom,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-bottom {
    bottom: 0 !important;
    left: 50% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-bottom-left,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-bottom-left {
    bottom: 4% !important;
    left: 18% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-bottom-right,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-bottom-right {
    bottom: 4% !important;
    left: 82% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-left-lower,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-left-lower {
    left: 0 !important;
    top: 73% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-left-upper,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-left-upper {
    left: 0 !important;
    top: 24% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-right-lower,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-right-lower {
    right: 0 !important;
    top: 73% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-right-upper,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-right-upper {
    right: 0 !important;
    top: 24% !important;
  }

  body.phone-landscape:not(.in-lobby) .player-nameplate strong,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .player-nameplate strong {
    font-size: var(--play-seat-font) !important;
  }

  body.phone-landscape:not(.in-lobby) .player-nameplate span,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .player-nameplate span {
    font-size: var(--play-stack-font) !important;
  }

  body.phone-landscape:not(.in-lobby) .hole-cards .card,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .hole-cards .card {
    font-size: calc(var(--play-card-w) * .35) !important;
    height: calc(var(--play-card-w) * 1.42) !important;
    width: var(--play-card-w) !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-bottom .hole-cards .card,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-bottom .hole-cards .card {
    font-size: calc(var(--play-hero-card-w) * .35) !important;
    height: calc(var(--play-hero-card-w) * 1.42) !important;
    width: var(--play-hero-card-w) !important;
  }

  body.phone-landscape:not(.in-lobby) .community .card,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .community .card {
    height: clamp(42px, 15dvh, 100px) !important;
    width: clamp(30px, 10.6dvh, 70px) !important;
  }

  body.phone-landscape:not(.in-lobby) .pot-stack,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .pot-stack {
    left: 50% !important;
    top: 27% !important;
    z-index: 50 !important;
  }

  body.phone-landscape:not(.in-lobby) .pot-stack span,
  body.phone-landscape:not(.in-lobby) #potCenter,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .pot-stack span,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) #potCenter {
    font-size: clamp(8px, 1.4vw, 12px) !important;
    padding: 2px 6px !important;
  }

  body.phone-landscape:not(.in-lobby) .action-panel,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .action-panel {
    height: var(--play-actions-h) !important;
    max-height: var(--play-actions-h) !important;
    padding: 2px 6px max(2px, env(safe-area-inset-bottom, 0px)) 6px !important;
  }

  body.phone-landscape:not(.in-lobby) .controls.seat-pending,
  body.phone-landscape:not(.in-lobby) .controls.status-only,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .controls.seat-pending,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .controls.status-only {
    max-width: min(300px, 58vw) !important;
  }

  body.phone-landscape:not(.in-lobby) .controls.seat-pending #newHand,
  body.phone-landscape:not(.in-lobby) .controls.status-only #newHand,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .controls.seat-pending #newHand,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .controls.status-only #newHand {
    font-size: clamp(8px, 1.35vw, 11px) !important;
    min-height: clamp(22px, 5.6dvh, 32px) !important;
    padding: 1px 10px !important;
  }
}

/* === CARD + ACTIVE TURN SPOTLIGHT RESTORE ================================
   Card rendering only: clean centered face, tidy backs, slightly larger
   responsive sizes, local-player-only temporary enlargement, and seat glow.
   No table/seat/toolbar/action/pot layout positioning is changed here. */
body:not(.in-lobby) .game-stage .card,
body:not(.in-lobby) .game-stage button.card {
  background:
    linear-gradient(145deg, rgba(255,255,255,.96), rgba(238,236,224,.98)) !important;
  border: 1px solid rgba(32,38,58,.28) !important;
  border-radius: .18em !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.8),
    inset 0 -3px 8px rgba(22,32,54,.08),
    0 6px 14px rgba(0,0,0,.24) !important;
  box-sizing: border-box !important;
  color: #171b29 !important;
  display: inline-block !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  overflow: hidden !important;
  position: relative !important;
  text-align: center !important;
  transform: none !important;
  transform-origin: center center !important;
  transition: transform 130ms ease, box-shadow 130ms ease, filter 130ms ease !important;
}

body:not(.in-lobby) .game-stage .card.red {
  color: #c01834 !important;
}

body:not(.in-lobby) .game-stage .card.back {
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.22) 0 11%, transparent 12%),
    repeating-linear-gradient(45deg, rgba(255,255,255,.13) 0 4px, transparent 4px 8px),
    linear-gradient(145deg, #2742a2, #0a1744) !important;
  border-color: rgba(255,255,255,.42) !important;
  color: transparent !important;
}

body:not(.in-lobby) .game-stage .card.back span {
  display: none !important;
}

body:not(.in-lobby) .game-stage .card .card-corner,
body:not(.in-lobby) .game-stage .card .corner {
  align-items: center !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  justify-content: center !important;
  letter-spacing: 0 !important;
  line-height: .92 !important;
  margin: 0 !important;
  padding: 0 !important;
  position: absolute !important;
  text-align: center !important;
  transform: none !important;
  width: 1.16em !important;
  z-index: 2 !important;
}

body:not(.in-lobby) .game-stage .card .card-corner.top,
body:not(.in-lobby) .game-stage .card .corner.top {
  left: .16em !important;
  top: .16em !important;
}

body:not(.in-lobby) .game-stage .card .card-corner.bottom,
body:not(.in-lobby) .game-stage .card .corner.bottom {
  bottom: .16em !important;
  right: .16em !important;
  transform: rotate(180deg) !important;
}

body:not(.in-lobby) .game-stage .card .card-rank,
body:not(.in-lobby) .game-stage .card .card-suit,
body:not(.in-lobby) .game-stage .card .corner small {
  align-items: center !important;
  display: flex !important;
  justify-content: center !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
  text-align: center !important;
  transform: none !important;
  width: 100% !important;
}

body:not(.in-lobby) .game-stage .card .card-rank {
  font-size: .46em !important;
}

body:not(.in-lobby) .game-stage .card .card-suit {
  font-family: "Segoe UI Symbol", "Apple Symbols", "Noto Sans Symbols", Arial, sans-serif !important;
  font-size: .42em !important;
  margin-top: .03em !important;
}

body:not(.in-lobby) .game-stage .card .clean-card-face,
body:not(.in-lobby) .game-stage .card .face {
  align-items: center !important;
  bottom: auto !important;
  display: grid !important;
  gap: .04em !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto auto !important;
  inset: 20% 16% !important;
  justify-items: center !important;
  left: 16% !important;
  margin: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  place-content: center !important;
  position: absolute !important;
  right: 16% !important;
  text-align: center !important;
  top: 20% !important;
  transform: none !important;
  z-index: 1 !important;
}

body:not(.in-lobby) .game-stage .card .clean-card-face b {
  display: block !important;
  font-size: .92em !important;
  line-height: .92 !important;
  margin: 0 !important;
  text-align: center !important;
}

body:not(.in-lobby) .game-stage .card .clean-card-face small {
  display: block !important;
  font-family: "Segoe UI Symbol", "Apple Symbols", "Noto Sans Symbols", Arial, sans-serif !important;
  font-size: .82em !important;
  line-height: .9 !important;
  margin: 0 !important;
  text-align: center !important;
}

body:not(.in-lobby) .game-stage .card .pips,
body:not(.in-lobby) .game-stage .card .royalty,
body:not(.in-lobby) .game-stage .card .pips i,
body:not(.in-lobby) .game-stage .card .royalty i {
  transform: none !important;
}

body:not(.in-lobby) .game-stage .hole-cards .card {
  height: clamp(3.2rem, 10.1vw, 9.72rem) !important;
  width: clamp(2.24rem, 7.1vw, 6.82rem) !important;
}

body:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card {
  height: clamp(3.58rem, 10.9vw, 10.35rem) !important;
  width: clamp(2.52rem, 7.65vw, 7.26rem) !important;
}

body:not(.in-lobby) .game-stage .community .card {
  height: clamp(4.12rem, 10.6vw, 11.26rem) !important;
  width: clamp(2.9rem, 7.45vw, 7.92rem) !important;
}

@media (orientation: landscape) and (max-width: 980px),
       (orientation: landscape) and (max-height: 560px) {
  body.phone-landscape:not(.in-lobby) .game-stage .hole-cards .card,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .hole-cards .card {
    height: calc(var(--play-card-w, 28px) * 1.52) !important;
    width: calc(var(--play-card-w, 28px) * 1.07) !important;
  }

  body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card {
    height: calc(var(--play-hero-card-w, 42px) * 1.52) !important;
    width: calc(var(--play-hero-card-w, 42px) * 1.07) !important;
  }

  body.phone-landscape:not(.in-lobby) .game-stage .community .card,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .community .card {
    height: clamp(44px, 15.8dvh, 104px) !important;
    width: clamp(31px, 11.1dvh, 73px) !important;
  }
}

body:not(.in-lobby) .game-stage .seat.local .hole-cards .card:hover,
body:not(.in-lobby) .game-stage .seat.local .hole-cards .card:active,
body:not(.in-lobby) .game-stage .seat.local .hole-cards .card:focus-visible,
body:not(.in-lobby) .game-stage .seat.local .hole-cards .card.touch-active {
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.95),
    0 12px 28px rgba(0,0,0,.46),
    0 0 0 3px rgba(255,228,92,.95),
    0 0 22px rgba(255,228,92,.72) !important;
  position: relative !important;
  transform: translateY(-.38rem) scale(1.22) !important;
  z-index: 500 !important;
}

body:not(.in-lobby) .game-stage .seat:not(.local) .hole-cards .card:hover,
body:not(.in-lobby) .game-stage .seat:not(.local) .hole-cards .card:active,
body:not(.in-lobby) .game-stage .seat:not(.local) .hole-cards .card:focus-visible {
  transform: none !important;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight::before,
body:not(.in-lobby) .game-stage .seat.turn-spotlight::after,
body:not(.in-lobby) .game-stage .turn-callout,
body:not(.in-lobby) .game-stage .turn-label,
body:not(.in-lobby) .game-stage .turn-timer {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight {
  filter: drop-shadow(0 0 10px rgba(255,228,92,.55)) !important;
  z-index: 240 !important;
}

body:not(.in-lobby) .game-stage .seat.turn-spotlight .player-nameplate,
body:not(.in-lobby) .game-stage .seat.turn-spotlight .hole-cards {
  animation: activeSeatGlow 1.1s ease-in-out infinite !important;
  border-color: rgba(255,228,92,.92) !important;
  box-shadow:
    0 0 0 2px rgba(255,228,92,.66),
    0 0 18px rgba(255,228,92,.58),
    inset 0 1px rgba(255,255,255,.25) !important;
}

@keyframes activeSeatGlow {
  50% {
    box-shadow:
      0 0 0 2px rgba(255,228,92,.95),
      0 0 26px rgba(255,228,92,.72),
      inset 0 1px rgba(255,255,255,.28);
  }
}

/* === URGENT STABILIZATION SAFETY PASS ====================================
   Final non-geometry layer: keep top controls tappable, make passive banners
   non-blocking, compact hand-end results, and protect open-seat selection. */
body:not(.in-lobby) .top-bar,
body:not(.in-lobby) .game-stage .top-bar,
body:not(.in-lobby) .score-strip,
body:not(.in-lobby) .game-stage .score-strip {
  pointer-events: auto !important;
  position: relative !important;
  touch-action: manipulation !important;
  z-index: 2147483646 !important;
}

body:not(.in-lobby) .top-bar button,
body:not(.in-lobby) .game-stage .top-bar button,
body:not(.in-lobby) .score-strip button,
body:not(.in-lobby) .game-stage .score-strip button,
body:not(.in-lobby) #menuButton,
body:not(.in-lobby) #lobbyButton,
body:not(.in-lobby) #chatButton,
body:not(.in-lobby) #oddsButton,
body:not(.in-lobby) #howButton,
body:not(.in-lobby) #fullscreenButton {
  pointer-events: auto !important;
  position: relative !important;
  touch-action: manipulation !important;
  z-index: 2147483647 !important;
}

body:not(.in-lobby) .winner-banner,
body:not(.in-lobby) .result-banner,
body:not(.in-lobby) .reveal-banner,
body:not(.in-lobby) .turn-callout,
body:not(.in-lobby) .chat-ticker,
body:not(.in-lobby) .table-debug-status,
body:not(.in-lobby) .action-banner {
  pointer-events: none !important;
}

body:not(.in-lobby) #menuPanel.open,
body:not(.in-lobby) #howPanel.open,
body:not(.in-lobby) .menu-panel.open,
body:not(.in-lobby) .chat-panel.open,
body:not(.in-lobby) #revealOddsPanel.show,
body:not(.in-lobby) .odds-modal.show,
body:not(.in-lobby) .modal.show,
body:not(.in-lobby) .reload-modal.show {
  pointer-events: none !important;
  z-index: 92000 !important;
}

body:not(.in-lobby) #menuPanel.open,
body:not(.in-lobby) #howPanel.open,
body:not(.in-lobby) .menu-panel.open *,
body:not(.in-lobby) .chat-panel.open,
body:not(.in-lobby) .chat-panel.open *,
body:not(.in-lobby) #revealOddsPanel.show .reload-card,
body:not(.in-lobby) .odds-modal.show .reload-card,
body:not(.in-lobby) .modal.show > *,
body:not(.in-lobby) .reload-modal.show .reload-card {
  pointer-events: auto !important;
}

body:not(.in-lobby) .winner-banner.show,
body:not(.in-lobby) .game-stage .winner-banner.show {
  align-items: center !important;
  bottom: auto !important;
  display: grid !important;
  gap: .12rem !important;
  justify-items: center !important;
  left: 50% !important;
  max-height: min(4.3rem, 14dvh) !important;
  max-width: min(28rem, 42vw) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: clamp(.24rem, .8dvh, .44rem) clamp(.5rem, 1.4vw, .85rem) !important;
  position: absolute !important;
  right: auto !important;
  top: calc(env(safe-area-inset-top, 0px) + clamp(42px, 9dvh, 86px)) !important;
  transform: translateX(-50%) !important;
  width: auto !important;
  z-index: 820 !important;
}

body:not(.in-lobby) .winner-banner.show strong,
body:not(.in-lobby) .game-stage .winner-banner.show strong {
  display: block !important;
  font-size: clamp(.76rem, 1.55vw, 1.12rem) !important;
  line-height: 1.05 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body:not(.in-lobby) .winner-banner.show span,
body:not(.in-lobby) .game-stage .winner-banner.show span {
  display: block !important;
  font-size: clamp(.58rem, 1.1vw, .82rem) !important;
  line-height: 1.1 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-align: center !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body:not(.in-lobby) .winner-banner.show .expose-cards-button,
body:not(.in-lobby) .game-stage .winner-banner.show .expose-cards-button {
  background: linear-gradient(180deg, var(--gold), #ff9f43) !important;
  border-radius: 999px !important;
  color: #20120a !important;
  display: inline-flex !important;
  font-size: clamp(.55rem, 1vw, .75rem) !important;
  font-weight: 950 !important;
  justify-content: center !important;
  line-height: 1 !important;
  margin-top: .15rem !important;
  min-height: clamp(1.35rem, 3.2dvh, 1.85rem) !important;
  padding: .28rem .7rem !important;
  pointer-events: auto !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

body:not(.in-lobby) .winner-banner.show:has(.expose-cards-button),
body:not(.in-lobby) .game-stage .winner-banner.show:has(.expose-cards-button) {
  max-height: min(6.2rem, 18dvh) !important;
}

body:not(.in-lobby) .seat-open,
body:not(.in-lobby) .seat-open .seat-select-button,
body:not(.in-lobby) .seat-select-button {
  pointer-events: auto !important;
  touch-action: manipulation !important;
  z-index: 360 !important;
}

/* Toolbar button polish only: center labels without changing table geometry. */
body:not(.in-lobby) .score-strip button,
body:not(.in-lobby) .game-stage .score-strip button,
body:not(.in-lobby) #chatButton,
body:not(.in-lobby) #lobbyButton,
body:not(.in-lobby) #oddsButton,
body:not(.in-lobby) #howButton,
body:not(.in-lobby) #fullscreenButton,
body:not(.in-lobby) #menuButton {
  align-items: center !important;
  display: inline-flex !important;
  justify-content: center !important;
  line-height: 1 !important;
  min-height: clamp(2rem, 5.4dvh, 2.35rem) !important;
  padding-block: 0 !important;
  text-align: center !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}

body.phone-landscape:not(.in-lobby) .score-strip button,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .score-strip button,
body.tablet-landscape:not(.in-lobby) .score-strip button {
  min-height: var(--play-nav-h, clamp(24px, 6.4dvh, 34px)) !important;
  padding-bottom: 0 !important;
  padding-top: 0 !important;
}

body:not(.in-lobby) .toolbar-panel-close {
  align-items: center !important;
  aspect-ratio: 1 !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  justify-content: center !important;
  justify-self: end !important;
  min-height: 1.8rem !important;
  padding: 0 !important;
  pointer-events: auto !important;
  width: 1.8rem !important;
}

body.table-focus-mode:not(.in-lobby) .app-viewport {
  inset: 0 !important;
  position: fixed !important;
  z-index: 89999 !important;
}

body:not(.in-lobby) .controls.seat-pending,
body:not(.in-lobby) .game-stage .controls.seat-pending {
  pointer-events: none !important;
  z-index: 6100 !important;
}

body:not(.in-lobby) .controls.seat-pending #newHand,
body:not(.in-lobby) .game-stage .controls.seat-pending #newHand {
  max-width: min(26rem, 70vw) !important;
  min-height: clamp(1.65rem, 5dvh, 2.35rem) !important;
  padding: .2rem .85rem !important;
  white-space: nowrap !important;
}

@media (orientation: landscape) and (max-width: 980px),
       (orientation: landscape) and (max-height: 560px) {
  body:not(.in-lobby) .winner-banner.show,
  body:not(.in-lobby) .game-stage .winner-banner.show {
    max-height: min(2.8rem, 13dvh) !important;
    max-width: min(20rem, 48vw) !important;
    padding: .18rem .52rem !important;
    top: calc(env(safe-area-inset-top, 0px) + var(--play-nav-h, clamp(24px, 6.4dvh, 34px)) + 2px) !important;
  }

  body:not(.in-lobby) .winner-banner.show strong,
  body:not(.in-lobby) .game-stage .winner-banner.show strong {
    font-size: clamp(.58rem, 2.2dvh, .86rem) !important;
  }

  body:not(.in-lobby) .winner-banner.show span,
  body:not(.in-lobby) .game-stage .winner-banner.show span {
    font-size: clamp(.48rem, 1.65dvh, .66rem) !important;
  }

  body:not(.in-lobby) .controls.seat-pending #newHand,
  body:not(.in-lobby) .game-stage .controls.seat-pending #newHand {
    max-width: min(18rem, 58vw) !important;
    min-height: clamp(1.25rem, 5.4dvh, 1.9rem) !important;
    padding: .08rem .58rem !important;
  }
}

/* Restored clean card style and local-only press/hover behavior.
   Card appearance/sizing only: no toolbar, table, seat, overlay, or game logic changes. */
body:not(.in-lobby) .game-stage .card,
body:not(.in-lobby) .game-stage button.card {
  align-items: center !important;
  aspect-ratio: 5 / 7 !important;
  background:
    linear-gradient(145deg, #ffffff 0%, #f7f5ed 72%, #ece8dc 100%) !important;
  border: 1px solid rgba(22, 27, 42, .32) !important;
  border-radius: clamp(4px, .42vw, 8px) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.92),
    inset 0 -4px 9px rgba(24,32,48,.08),
    0 7px 16px rgba(0,0,0,.24) !important;
  box-sizing: border-box !important;
  color: #151923 !important;
  display: inline-grid !important;
  flex: 0 0 auto !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: 900 !important;
  justify-items: center !important;
  line-height: 1 !important;
  overflow: hidden !important;
  padding: 0 !important;
  place-items: center !important;
  position: relative !important;
  text-align: center !important;
  transform: none !important;
  transform-origin: center center !important;
  transition: transform 130ms ease, box-shadow 130ms ease, filter 130ms ease !important;
}

body:not(.in-lobby) .game-stage .card.red {
  color: #c41731 !important;
}

body:not(.in-lobby) .game-stage .card.back {
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.24) 0 10%, transparent 11%),
    repeating-linear-gradient(45deg, rgba(255,255,255,.13) 0 5px, transparent 5px 10px),
    linear-gradient(145deg, #2861c9 0%, #142d87 54%, #07194d 100%) !important;
  border-color: rgba(255,255,255,.48) !important;
  color: transparent !important;
}

body:not(.in-lobby) .game-stage .card.back::after {
  border: 1px solid rgba(255,255,255,.38) !important;
  border-radius: inherit !important;
  content: "" !important;
  inset: 14% !important;
  position: absolute !important;
}

body:not(.in-lobby) .game-stage .card.back span {
  display: none !important;
}

body:not(.in-lobby) .game-stage .card .card-corner,
body:not(.in-lobby) .game-stage .card .corner {
  align-items: center !important;
  display: flex !important;
  flex-direction: column !important;
  gap: .02em !important;
  height: 1.34em !important;
  justify-content: center !important;
  letter-spacing: 0 !important;
  line-height: .9 !important;
  margin: 0 !important;
  padding: 0 !important;
  position: absolute !important;
  text-align: center !important;
  transform: none !important;
  width: 1.16em !important;
  z-index: 2 !important;
}

body:not(.in-lobby) .game-stage .card .card-corner.top,
body:not(.in-lobby) .game-stage .card .corner.top {
  left: .18em !important;
  top: .18em !important;
}

body:not(.in-lobby) .game-stage .card .card-corner.bottom,
body:not(.in-lobby) .game-stage .card .corner.bottom {
  bottom: .18em !important;
  right: .18em !important;
  transform: rotate(180deg) !important;
}

body:not(.in-lobby) .game-stage .card .card-rank,
body:not(.in-lobby) .game-stage .card .card-suit {
  display: block !important;
  line-height: .92 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  width: 100% !important;
}

body:not(.in-lobby) .game-stage .card .card-rank {
  font-size: .5em !important;
  font-weight: 950 !important;
}

body:not(.in-lobby) .game-stage .card .card-suit {
  font-family: "Segoe UI Symbol", "Apple Symbols", "Noto Sans Symbols", Arial, sans-serif !important;
  font-size: .45em !important;
}

body:not(.in-lobby) .game-stage .card .clean-card-face,
body:not(.in-lobby) .game-stage .card .face {
  align-items: center !important;
  bottom: auto !important;
  display: grid !important;
  gap: .06em !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto auto !important;
  inset: 21% 17% !important;
  justify-items: center !important;
  left: 17% !important;
  margin: 0 !important;
  overflow: visible !important;
  padding: 0 !important;
  place-content: center !important;
  position: absolute !important;
  right: 17% !important;
  text-align: center !important;
  top: 21% !important;
  transform: none !important;
  z-index: 1 !important;
}

body:not(.in-lobby) .game-stage .card .clean-card-face b {
  display: block !important;
  font-size: .9em !important;
  font-weight: 950 !important;
  line-height: .9 !important;
  margin: 0 !important;
  text-align: center !important;
}

body:not(.in-lobby) .game-stage .card .clean-card-face small {
  display: block !important;
  font-family: "Segoe UI Symbol", "Apple Symbols", "Noto Sans Symbols", Arial, sans-serif !important;
  font-size: 1.12em !important;
  line-height: .9 !important;
  margin: 0 !important;
  text-align: center !important;
}

body:not(.in-lobby) .game-stage .hole-cards .card {
  font-size: clamp(1.27rem, 3.08vw, 3.08rem) !important;
  height: clamp(4.4rem, 12.54vw, 11.5rem) !important;
  width: clamp(3.15rem, 8.97vw, 8.21rem) !important;
}

body:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card {
  font-size: clamp(1.49rem, 3.47vw, 3.37rem) !important;
  height: clamp(4.95rem, 13.59vw, 12.32rem) !important;
  width: clamp(3.54rem, 9.7vw, 8.8rem) !important;
}

body:not(.in-lobby) .game-stage .community .card {
  font-size: clamp(1.43rem, 3.3vw, 3.3rem) !important;
  height: clamp(5.12rem, 13.15vw, 12.82rem) !important;
  width: clamp(3.65rem, 9.39vw, 9.15rem) !important;
}

@media (orientation: landscape) and (max-width: 980px),
       (orientation: landscape) and (max-height: 560px) {
  body.phone-landscape:not(.in-lobby) .game-stage .hole-cards .card,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .hole-cards .card {
    font-size: clamp(15px, 5.1dvh, 26px) !important;
    height: clamp(53px, 18.7dvh, 90px) !important;
    width: clamp(37px, 13.3dvh, 65px) !important;
  }

  body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card {
    font-size: clamp(18px, 5.9dvh, 31px) !important;
    height: clamp(62px, 22dvh, 106px) !important;
    width: clamp(44px, 15.7dvh, 76px) !important;
  }

  body.phone-landscape:not(.in-lobby) .game-stage .community .card,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .community .card {
    font-size: clamp(18px, 5.6dvh, 31px) !important;
    height: clamp(59px, 20.7dvh, 106px) !important;
    width: clamp(43px, 14.7dvh, 76px) !important;
  }
}

body:not(.in-lobby) .game-stage .seat:not(.local) .hole-cards .card:hover,
body:not(.in-lobby) .game-stage .seat:not(.local) .hole-cards .card:active,
body:not(.in-lobby) .game-stage .seat:not(.local) .hole-cards .card:focus,
body:not(.in-lobby) .game-stage .seat:not(.local) .hole-cards .card:focus-visible,
body:not(.in-lobby) .game-stage .seat:not(.local) .hole-cards .card.touch-active {
  transform: none !important;
  z-index: auto !important;
}

body:not(.in-lobby) .game-stage .community .card,
body:not(.in-lobby) .game-stage .seat.local .hole-cards .card {
  transform: none !important;
  transform-origin: center center !important;
  transition: transform 130ms ease, box-shadow 130ms ease, filter 130ms ease !important;
}

body:not(.in-lobby) .game-stage .community .card:hover,
body:not(.in-lobby) .game-stage .community .card:active,
body:not(.in-lobby) .game-stage .community .card:focus-visible,
body:not(.in-lobby) .game-stage .community .card.touch-active,
body:not(.in-lobby) .game-stage .seat.local .hole-cards .card:hover,
body:not(.in-lobby) .game-stage .seat.local .hole-cards .card:active,
body:not(.in-lobby) .game-stage .seat.local .hole-cards .card:focus-visible,
body:not(.in-lobby) .game-stage .seat.local .hole-cards .card.touch-active {
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.95),
    0 12px 28px rgba(0,0,0,.46),
    0 0 0 3px rgba(255,228,92,.95),
    0 0 22px rgba(255,228,92,.72) !important;
  position: relative !important;
  transform: translateY(-.38rem) scale(1.22) !important;
  z-index: 500 !important;
}

@media (hover: none), (pointer: coarse) {
  body:not(.in-lobby) .game-stage .community .card:hover,
  body:not(.in-lobby) .game-stage .community .card:focus,
  body:not(.in-lobby) .game-stage .community .card:focus-visible,
  body:not(.in-lobby) .game-stage .seat.local .hole-cards .card:hover,
  body:not(.in-lobby) .game-stage .seat.local .hole-cards .card:focus,
  body:not(.in-lobby) .game-stage .seat.local .hole-cards .card:focus-visible {
    transform: none !important;
    z-index: auto !important;
  }

  body:not(.in-lobby) .game-stage .community .card:active,
  body:not(.in-lobby) .game-stage .community .card.touch-active,
  body:not(.in-lobby) .game-stage .seat.local .hole-cards .card:active,
  body:not(.in-lobby) .game-stage .seat.local .hole-cards .card.touch-active {
    transform: translateY(-.38rem) scale(1.22) !important;
    z-index: 500 !important;
  }
}

/* Mobile Safari chat keyboard safety.
   Chat-only: keep the chat panel visible above the iOS keyboard without
   refitting the whole game viewport while the input is focused. */
body.chat-keyboard-open:not(.in-lobby) {
  overflow: hidden !important;
}

body.chat-keyboard-open:not(.in-lobby) .app-viewport,
body.chat-keyboard-open:not(.in-lobby) .game-viewport,
body.chat-keyboard-open:not(.in-lobby) .game-stage {
  min-height: max(100svh, 320px) !important;
}

body.chat-keyboard-open:not(.in-lobby) .game-stage .chat-panel.open {
  bottom: calc(var(--chat-keyboard-offset, 0px) + max(8px, env(safe-area-inset-bottom, 0px))) !important;
  box-sizing: border-box !important;
  display: grid !important;
  left: auto !important;
  max-height: min(18rem, calc(var(--chat-visible-height, 100dvh) - env(safe-area-inset-top, 0px) - 16px)) !important;
  max-width: calc(100dvw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px) - 1rem) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: .65rem !important;
  position: fixed !important;
  right: max(.5rem, env(safe-area-inset-right, 0px)) !important;
  top: auto !important;
  transform: none !important;
  width: min(21rem, calc(100dvw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px) - 1rem)) !important;
  -webkit-overflow-scrolling: touch !important;
  z-index: 2147483600 !important;
}

body.chat-keyboard-open:not(.in-lobby) .game-stage .chat-panel .chat-feed {
  max-height: min(8.5rem, calc(var(--chat-visible-height, 100dvh) * .28)) !important;
  min-height: 3.5rem !important;
}

body.chat-keyboard-open:not(.in-lobby) .game-stage .chat-form {
  align-items: center !important;
  display: grid !important;
  gap: .4rem !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
}

body.chat-keyboard-open:not(.in-lobby) .game-stage #chatInput {
  font-size: 16px !important;
  min-height: 2.25rem !important;
}

/* Restored Menu / How flyouts. These original panels sit above the game as
   fixed dropdowns and do not depend on the abandoned embedded toolbar panels. */
html body #howPanel.flyout.open,
html body #menuPanel.flyout.open {
  background: linear-gradient(145deg, rgba(10,16,43,.98), rgba(36,18,79,.96)) !important;
  border: 1px solid rgba(39,231,255,.38) !important;
  border-radius: 8px !important;
  box-shadow: 0 24px 54px rgba(0,0,0,.5) !important;
  color: var(--text) !important;
  display: grid !important;
  gap: .75rem !important;
  max-height: min(78dvh, 34rem) !important;
  opacity: 1 !important;
  overflow: auto !important;
  padding: .9rem !important;
  pointer-events: auto !important;
  position: fixed !important;
  visibility: visible !important;
  width: min(27rem, calc(100dvw - 1rem)) !important;
  z-index: 2147483647 !important;
}

html body #howPanel.flyout.open {
  box-sizing: border-box !important;
  left: auto !important;
  max-height: min(78dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 1rem)) !important;
  max-width: calc(100dvw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px) - 1rem) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: clamp(.85rem, 2.2dvw, 1.1rem) !important;
  right: max(.5rem, env(safe-area-inset-right, 0px)) !important;
  width: min(23rem, calc(100dvw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px) - 1rem)) !important;
  -webkit-overflow-scrolling: touch !important;
}

html body #howPanel.flyout.open,
html body #howPanel.flyout.open * {
  overflow-wrap: anywhere !important;
  white-space: normal !important;
  word-break: normal !important;
}

html body #howPanel.flyout.open ol {
  margin-right: 0 !important;
  padding-right: .2rem !important;
}

html body #howPanel.flyout.open li {
  padding-right: .15rem !important;
}

html body #howButton.gold-button,
html body #menuButton.gold-button {
  align-items: center !important;
  background: linear-gradient(180deg, var(--gold), #ff9f43) !important;
  border-radius: 999px !important;
  color: #20120a !important;
  cursor: pointer !important;
  display: inline-flex !important;
  font-weight: 900 !important;
  justify-content: center !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  position: relative !important;
  touch-action: manipulation !important;
  visibility: visible !important;
  z-index: 2147483647 !important;
}

/* Last-resort no-JS flyout fallback.
   If JavaScript is blocked, cached, or fails during startup, Menu/How still
   open from plain hover/focus/touch focus on the actual toolbar buttons. */
html body:has(#menuButton:is(:hover, :focus, :focus-visible, :active)) #menuPanel.flyout,
html body:has(#menuPanel:is(:hover, :focus-within)) #menuPanel.flyout,
html body:has(#howButton:is(:hover, :focus, :focus-visible, :active)) #howPanel.flyout,
html body:has(#howPanel:is(:hover, :focus-within)) #howPanel.flyout {
  background: linear-gradient(145deg, rgba(10,16,43,.98), rgba(36,18,79,.96)) !important;
  border: 1px solid rgba(39,231,255,.38) !important;
  border-radius: 8px !important;
  box-shadow: 0 24px 54px rgba(0,0,0,.5) !important;
  color: var(--text) !important;
  display: grid !important;
  gap: .75rem !important;
  max-height: min(78dvh, 34rem) !important;
  opacity: 1 !important;
  overflow: auto !important;
  padding: .9rem !important;
  pointer-events: auto !important;
  position: fixed !important;
  right: max(.5rem, env(safe-area-inset-right, 0px)) !important;
  top: max(3.25rem, calc(env(safe-area-inset-top, 0px) + 3.25rem)) !important;
  visibility: visible !important;
  width: min(27rem, calc(100dvw - 1rem)) !important;
  z-index: 2147483647 !important;
}

html body:has(#howButton:is(:hover, :focus, :focus-visible, :active)) #howPanel.flyout,
html body:has(#howPanel:is(:hover, :focus-within)) #howPanel.flyout {
  box-sizing: border-box !important;
  left: auto !important;
  max-height: min(78dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 1rem)) !important;
  max-width: calc(100dvw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px) - 1rem) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: clamp(.85rem, 2.2dvw, 1.1rem) !important;
  right: max(.5rem, env(safe-area-inset-right, 0px)) !important;
  width: min(23rem, calc(100dvw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px) - 1rem)) !important;
  -webkit-overflow-scrolling: touch !important;
}

/* Desktop web centering only.
   Fine-pointer laptop/desktop browsers keep the 1600px game board centered
   horizontally without changing iPad, phone, cards, toolbar, chat, or seats. */
@media (hover: hover) and (pointer: fine) and (min-width: 1024px) and (min-height: 640px) {
  body:not(.in-lobby) .app-viewport,
  body:not(.in-lobby) .game-viewport {
    align-items: center !important;
    display: flex !important;
    justify-content: center !important;
  }

  body:not(.in-lobby) .game-stage {
    left: 50% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    right: auto !important;
    transform: translate(-50%, -50%) scale(1) !important;
  }

  body:not(.in-lobby) .game-stage .game-shell {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* Scoped iOS interruption/pot/reveal cleanup.
   Keep the active table stable through transient system viewport changes and
   keep table labels away from cards without touching toolbar or gameplay UI. */
body.viewport-transient:not(.in-lobby) .app-viewport,
body.viewport-transient:not(.in-lobby) .game-viewport,
body.viewport-transient:not(.in-lobby) .game-stage {
  min-height: var(--visible-vh, 100dvh) !important;
}

body:not(.in-lobby) .game-stage .pot-stack {
  bottom: auto !important;
  gap: 0 !important;
  left: 50% !important;
  max-width: min(18vw, 11rem) !important;
  pointer-events: none !important;
  top: clamp(52px, 26%, 154px) !important;
  transform: translate(-50%, -50%) !important;
  z-index: 58 !important;
}

body:not(.in-lobby) .game-stage .pot-stack > .chips {
  display: none !important;
}

body:not(.in-lobby) .game-stage .pot-stack span,
body:not(.in-lobby) .game-stage #potCenter {
  box-shadow: 0 8px 18px rgba(0,0,0,.34) !important;
  font-size: clamp(10px, 1.45vw, 16px) !important;
  line-height: 1 !important;
  padding: clamp(2px, .45dvh, 5px) clamp(7px, .9vw, 12px) !important;
  white-space: nowrap !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .pot-stack,
body.tablet-landscape:not(.in-lobby) .game-stage .pot-stack,
body.mobile-table-mode:not(.in-lobby) .game-stage .pot-stack {
  top: clamp(42px, 23%, 120px) !important;
}

body:not(.in-lobby) .game-stage .action-pop.reveal-action-pop {
  max-width: min(9rem, 136%) !important;
  z-index: 10060 !important;
}

body:not(.in-lobby) .game-stage .seat-top-left .action-pop.reveal-action-pop,
body:not(.in-lobby) .game-stage .seat-top .action-pop.reveal-action-pop,
body:not(.in-lobby) .game-stage .seat-top-right .action-pop.reveal-action-pop,
body:not(.in-lobby) .game-stage .seat-left-upper .action-pop.reveal-action-pop,
body:not(.in-lobby) .game-stage .seat-right-upper .action-pop.reveal-action-pop {
  bottom: auto !important;
  top: calc(100% + clamp(4px, .8dvh, 9px)) !important;
}

body:not(.in-lobby) .game-stage .seat-bottom-left .action-pop.reveal-action-pop,
body:not(.in-lobby) .game-stage .seat-bottom .action-pop.reveal-action-pop,
body:not(.in-lobby) .game-stage .seat-bottom-right .action-pop.reveal-action-pop,
body:not(.in-lobby) .game-stage .seat-left-lower .action-pop.reveal-action-pop,
body:not(.in-lobby) .game-stage .seat-right-lower .action-pop.reveal-action-pop {
  bottom: calc(100% + clamp(4px, .8dvh, 9px)) !important;
  top: auto !important;
}

body:not(.in-lobby) .game-stage .seat-left-lower .action-pop.reveal-action-pop,
body:not(.in-lobby) .game-stage .seat-left-upper .action-pop.reveal-action-pop {
  left: clamp(2px, .5vw, 8px) !important;
  right: auto !important;
  transform: translate(0, 8px) scale(.92) !important;
}

body:not(.in-lobby) .game-stage .seat-left-lower .action-pop.reveal-action-pop:not(:empty),
body:not(.in-lobby) .game-stage .seat-left-upper .action-pop.reveal-action-pop:not(:empty) {
  transform: translate(0, 0) scale(1) !important;
}

body:not(.in-lobby) .game-stage .seat-right-lower .action-pop.reveal-action-pop,
body:not(.in-lobby) .game-stage .seat-right-upper .action-pop.reveal-action-pop {
  left: auto !important;
  right: clamp(2px, .5vw, 8px) !important;
  transform: translate(0, 8px) scale(.92) !important;
}

body:not(.in-lobby) .game-stage .seat-right-lower .action-pop.reveal-action-pop:not(:empty),
body:not(.in-lobby) .game-stage .seat-right-upper .action-pop.reveal-action-pop:not(:empty) {
  transform: translate(0, 0) scale(1) !important;
}

/* Four-item focused cleanup: readable reveal text, board-card clearance,
   premium card finish, and Win% detail popup. */
body:not(.in-lobby) .game-stage .reveal-overlay,
body:not(.in-lobby) .game-stage .reveal-overlay.show {
  background: linear-gradient(180deg, rgba(13, 22, 51, .96), rgba(7, 13, 34, .94)) !important;
  border: 1px solid rgba(255, 228, 92, .92) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.48), 0 0 18px rgba(255,228,92,.26) !important;
  color: #ffe875 !important;
  max-width: min(26rem, 42vw) !important;
  padding: clamp(5px, .8dvh, 10px) clamp(10px, 1.4vw, 17px) !important;
  pointer-events: none !important;
  text-align: center !important;
  z-index: 9998 !important;
}

body:not(.in-lobby) .game-stage .reveal-overlay span {
  color: #eaffd1 !important;
  display: block !important;
  font-size: .62em !important;
  line-height: 1.12 !important;
  margin-top: .18rem !important;
  white-space: normal !important;
}

body:not(.in-lobby) .game-stage .reveal-overlay.safe-compact,
body:not(.in-lobby) .game-stage .reveal-overlay.show.safe-compact {
  max-width: min(18rem, 32vw) !important;
  padding: clamp(4px, .68dvh, 8px) clamp(8px, 1vw, 13px) !important;
}

body:not(.in-lobby) .game-stage .community {
  box-sizing: content-box !important;
  overflow: visible !important;
  padding-top: clamp(8px, 1.2vw, 18px) !important;
}

body.mobile-table-mode:not(.in-lobby) .community,
body.phone-landscape:not(.in-lobby) .community,
body.tablet-landscape:not(.in-lobby) .community {
  padding-top: clamp(6px, 1.8dvh, 14px) !important;
}

body:not(.in-lobby) .game-stage .pot-stack {
  top: clamp(42px, 21%, 132px) !important;
}

body:not(.in-lobby) .game-stage .card,
body:not(.in-lobby) .game-stage button.card {
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,.95), rgba(255,255,255,0) 28%),
    linear-gradient(145deg, #ffffff 0%, #faf8f0 60%, #ece6d6 100%) !important;
  border: 1px solid rgba(16, 21, 35, .42) !important;
  border-radius: clamp(5px, .5vw, 10px) !important;
  box-shadow:
    inset 0 0 0 2px rgba(255,255,255,.88),
    inset 0 0 0 4px rgba(212,178,86,.12),
    inset 0 -5px 10px rgba(20,27,43,.08),
    0 9px 18px rgba(0,0,0,.28) !important;
}

body:not(.in-lobby) .game-stage .card::before {
  border: 1px solid rgba(203, 165, 74, .34) !important;
  border-radius: calc(clamp(5px, .5vw, 10px) - 1px) !important;
  content: "" !important;
  inset: 6% !important;
  pointer-events: none !important;
  position: absolute !important;
  z-index: 0 !important;
}

body:not(.in-lobby) .game-stage .card .card-corner,
body:not(.in-lobby) .game-stage .card .corner,
body:not(.in-lobby) .game-stage .card .clean-card-face,
body:not(.in-lobby) .game-stage .card .face {
  z-index: 2 !important;
}

body:not(.in-lobby) .game-stage .card .card-rank,
body:not(.in-lobby) .game-stage .card .clean-card-face b {
  font-family: "Arial Black", Arial, Helvetica, sans-serif !important;
  letter-spacing: 0 !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.72) !important;
}

body:not(.in-lobby) .game-stage .card .card-suit,
body:not(.in-lobby) .game-stage .card .clean-card-face small {
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.66)) !important;
}

body:not(.in-lobby) .game-stage .card.back {
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.3) 0 9%, transparent 10%),
    repeating-linear-gradient(45deg, rgba(255,255,255,.15) 0 5px, transparent 5px 10px),
    linear-gradient(145deg, #2b6df2 0%, #1537a3 55%, #081a58 100%) !important;
  border-color: rgba(255,255,255,.58) !important;
}

.win-stat-button {
  align-items: center !important;
  cursor: pointer !important;
  display: inline-flex !important;
  gap: .25rem !important;
  justify-content: center !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

.win-stat-button:focus-visible {
  outline: 2px solid rgba(255,228,92,.9) !important;
  outline-offset: 2px !important;
}

.win-percent-popup {
  background: linear-gradient(145deg, rgba(7,13,34,.98), rgba(22,20,64,.96)) !important;
  border: 1px solid rgba(39,231,255,.38) !important;
  border-radius: 8px !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.5) !important;
  color: var(--text) !important;
  display: grid !important;
  gap: .5rem !important;
  max-width: calc(100dvw - 1rem) !important;
  padding: .75rem !important;
  pointer-events: auto !important;
  position: fixed !important;
  width: min(18rem, calc(100dvw - 1rem)) !important;
  z-index: 2147483600 !important;
}

.win-percent-popup strong {
  color: var(--gold) !important;
  font-size: .95rem !important;
  text-transform: uppercase !important;
}

.win-percent-popup p {
  margin: 0 !important;
}

.win-percent-popup ul {
  display: grid !important;
  gap: .32rem !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.win-percent-popup li {
  align-items: center !important;
  display: flex !important;
  gap: .75rem !important;
  justify-content: space-between !important;
}

.win-popup-close {
  align-self: start !important;
  background: rgba(255,255,255,.12) !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  border-radius: 999px !important;
  color: var(--text) !important;
  cursor: pointer !important;
  justify-self: end !important;
  min-height: 1.7rem !important;
  min-width: 1.7rem !important;
  padding: 0 !important;
}

/* Board-card container clipping fix only. */
body:not(.in-lobby) .game-stage .community,
body:not(.in-lobby) .poker-table .felt .community {
  align-items: center !important;
  box-sizing: content-box !important;
  height: auto !important;
  min-height: clamp(6.25rem, 15.5vw, 15rem) !important;
  overflow: visible !important;
  padding-top: clamp(12px, 2vw, 28px) !important;
  padding-bottom: clamp(8px, 1.2vw, 18px) !important;
}

body.mobile-table-mode:not(.in-lobby) .community,
body.phone-landscape:not(.in-lobby) .community,
body.tablet-landscape:not(.in-lobby) .community {
  height: auto !important;
  min-height: clamp(64px, 19dvh, 136px) !important;
  overflow: visible !important;
  padding-top: clamp(8px, 2.3dvh, 18px) !important;
  padding-bottom: clamp(4px, 1.2dvh, 10px) !important;
}

/* Screenshot follow-up: the board strip itself must never crop card tops,
   and the reveal instruction pill sits in open felt below top nameplates. */
body:not(.in-lobby) .game-stage .felt,
body:not(.in-lobby) .game-stage .community {
  overflow: visible !important;
}

body:not(.in-lobby) .game-stage .community {
  align-items: center !important;
  min-height: max(clamp(7.4rem, 17.5vw, 16rem), calc(var(--card-h, 7rem) + 2.4rem)) !important;
  padding-top: clamp(18px, 2.6vw, 36px) !important;
  padding-bottom: clamp(10px, 1.5vw, 22px) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .community,
body.phone-landscape:not(.in-lobby) .game-stage .community,
body.tablet-landscape:not(.in-lobby) .game-stage .community {
  min-height: max(clamp(78px, 22dvh, 154px), calc(var(--card-h, 72px) + 22px)) !important;
  padding-top: clamp(12px, 3dvh, 24px) !important;
  padding-bottom: clamp(6px, 1.6dvh, 14px) !important;
}

body:not(.in-lobby) .game-stage .result-banner {
  bottom: auto !important;
  left: 50% !important;
  max-width: min(19rem, 36vw) !important;
  pointer-events: none !important;
  top: 36% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 92 !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .result-banner,
body.phone-landscape:not(.in-lobby) .game-stage .result-banner,
body.tablet-landscape:not(.in-lobby) .game-stage .result-banner {
  max-width: min(16rem, 34vw) !important;
  top: 35% !important;
}

/* Reference-image adjustment only: larger community cards and lower Reveal
   Time placement above the board. */
body:not(.in-lobby) .game-stage .community {
  align-items: center !important;
  min-height: max(clamp(9.5rem, 21.3vw, 19.4rem), calc(var(--card-h, 7rem) + 4rem)) !important;
  overflow: visible !important;
  padding-top: clamp(28px, 3.4vw, 46px) !important;
  padding-bottom: clamp(16px, 2.2vw, 32px) !important;
}

body:not(.in-lobby) .game-stage .community .card {
  font-size: clamp(1.76rem, 3.98vw, 3.98rem) !important;
  height: clamp(6.34rem, 15.98vw, 15.46rem) !important;
  width: clamp(4.53rem, 11.42vw, 11.04rem) !important;
}

body:not(.in-lobby) .game-stage .reveal-overlay,
body:not(.in-lobby) .game-stage .reveal-overlay.show {
  left: 50% !important;
  top: 31% !important;
  transform: translate(-50%, -50%) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .community,
body.phone-landscape:not(.in-lobby) .game-stage .community,
body.tablet-landscape:not(.in-lobby) .game-stage .community {
  min-height: max(clamp(104px, 27.4dvh, 196px), calc(var(--card-h, 78px) + 38px)) !important;
  padding-top: clamp(18px, 3.6dvh, 32px) !important;
  padding-bottom: clamp(11px, 2.2dvh, 20px) !important;
}

body.phone-landscape:not(.in-lobby) .game-stage .community .card,
body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage .community .card {
  font-size: clamp(23px, 6.9dvh, 38px) !important;
  height: clamp(73px, 25.5dvh, 130px) !important;
  width: clamp(52px, 18.1dvh, 93px) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .reveal-overlay,
body.mobile-table-mode:not(.in-lobby) .game-stage .reveal-overlay.show,
body.phone-landscape:not(.in-lobby) .game-stage .reveal-overlay,
body.phone-landscape:not(.in-lobby) .game-stage .reveal-overlay.show,
body.tablet-landscape:not(.in-lobby) .game-stage .reveal-overlay,
body.tablet-landscape:not(.in-lobby) .game-stage .reveal-overlay.show {
  top: 31% !important;
}

/* Final target-layout adjustment: keep the reveal prompts clear of the board
   and make the community-card strip tall enough that card tops never clip. */
body:not(.in-lobby) .game-stage .community,
body:not(.in-lobby) .poker-table .felt .community {
  align-items: center !important;
  box-sizing: content-box !important;
  clip-path: none !important;
  height: auto !important;
  min-height: max(clamp(10.5rem, 22.5vw, 20.5rem), calc(var(--card-h, 7rem) + 5rem)) !important;
  overflow: visible !important;
  padding-top: clamp(36px, 4vw, 58px) !important;
  padding-bottom: clamp(20px, 2.6vw, 38px) !important;
}

body:not(.in-lobby) .game-stage .reveal-overlay,
body:not(.in-lobby) .game-stage .reveal-overlay.show {
  left: 50% !important;
  top: 30% !important;
  transform: translate(-50%, -50%) !important;
}

body:not(.in-lobby) .game-stage .result-banner {
  bottom: auto !important;
  left: 50% !important;
  max-width: min(22rem, 44vw) !important;
  pointer-events: none !important;
  top: 56% !important;
  transform: translate(-50%, -50%) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .community,
body.phone-landscape:not(.in-lobby) .game-stage .community,
body.tablet-landscape:not(.in-lobby) .game-stage .community {
  min-height: max(clamp(118px, 29dvh, 210px), calc(var(--card-h, 78px) + 46px)) !important;
  padding-top: clamp(22px, 4.2dvh, 36px) !important;
  padding-bottom: clamp(13px, 2.5dvh, 22px) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .reveal-overlay,
body.mobile-table-mode:not(.in-lobby) .game-stage .reveal-overlay.show,
body.phone-landscape:not(.in-lobby) .game-stage .reveal-overlay,
body.phone-landscape:not(.in-lobby) .game-stage .reveal-overlay.show,
body.tablet-landscape:not(.in-lobby) .game-stage .reveal-overlay,
body.tablet-landscape:not(.in-lobby) .game-stage .reveal-overlay.show {
  top: 30% !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .result-banner,
body.phone-landscape:not(.in-lobby) .game-stage .result-banner,
body.tablet-landscape:not(.in-lobby) .game-stage .result-banner {
  max-width: min(20rem, 42vw) !important;
  top: 56% !important;
}

/* Targeted 2026-06-14 fixes: community cards and desktop fullscreen only. */
body:not(.in-lobby) #communityCards.community,
body:not(.in-lobby) .game-stage #communityCards.community {
  align-items: center !important;
  box-sizing: content-box !important;
  clip-path: none !important;
  display: flex !important;
  justify-content: center !important;
  min-height: max(clamp(74px, 13dvh, 132px), calc(clamp(54px, 8.5dvh, 86px) + 34px)) !important;
  overflow: visible !important;
  padding-top: clamp(16px, 2.8dvh, 30px) !important;
  padding-bottom: clamp(12px, 2dvh, 22px) !important;
}

body:not(.in-lobby) #communityCards.community .card,
body:not(.in-lobby) .game-stage #communityCards.community .card {
  align-items: center !important;
  aspect-ratio: 2.5 / 3.5 !important;
  box-sizing: border-box !important;
  display: inline-grid !important;
  flex: 0 0 auto !important;
  height: clamp(54px, 8.5dvh, 86px) !important;
  max-height: none !important;
  min-height: 54px !important;
  overflow: visible !important;
  transform-origin: center center !important;
  width: auto !important;
}

body:not(.in-lobby) #communityCards.community .card *,
body:not(.in-lobby) #communityCards.community .card::before,
body:not(.in-lobby) #communityCards.community .card::after,
body:not(.in-lobby) .game-stage #communityCards.community .card *,
body:not(.in-lobby) .game-stage #communityCards.community .card::before,
body:not(.in-lobby) .game-stage #communityCards.community .card::after {
  max-height: none !important;
  overflow: visible !important;
}

body.fullscreen-active:not(.in-lobby),
body.fullscreen-active:not(.in-lobby) .game-viewport.game-fullscreen,
body.fullscreen-active:not(.in-lobby) .app-viewport.game-fullscreen {
  background: #050711 !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  width: 100vw !important;
}

body.fullscreen-active:not(.in-lobby) .game-viewport.game-fullscreen,
body.fullscreen-active:not(.in-lobby) .app-viewport.game-fullscreen {
  box-sizing: border-box !important;
  display: block !important;
  inset: 0 !important;
  max-width: 100vw !important;
  min-height: 100svh !important;
  padding: env(safe-area-inset-top, 0px) env(safe-area-inset-right, 0px) env(safe-area-inset-bottom, 0px) env(safe-area-inset-left, 0px) !important;
  position: fixed !important;
  z-index: 999999 !important;
}

body.fullscreen-active:not(.in-lobby) .game-stage {
  box-sizing: border-box !important;
  height: 100% !important;
  margin: 0 !important;
  max-height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: relative !important;
  transform: none !important;
  width: 100% !important;
}

body.fullscreen-active:not(.in-lobby) .game-shell {
  box-sizing: border-box !important;
  display: grid !important;
  gap: 8px !important;
  grid-template-areas:
    "top"
    "table"
    "actions" !important;
  grid-template-rows: auto minmax(0, 1fr) auto !important;
  height: 100% !important;
  margin: 0 auto !important;
  max-height: 100dvh !important;
  max-width: 1500px !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 8px !important;
  width: 100% !important;
}

body.fullscreen-active:not(.in-lobby) .table-scene {
  grid-area: table !important;
  height: 100% !important;
  margin: 0 !important;
  max-height: 100% !important;
  min-height: 0 !important;
  overflow: visible !important;
  position: relative !important;
  transform: none !important;
}

body.fullscreen-active:not(.in-lobby) .action-panel {
  grid-area: actions !important;
}

body.fullscreen-active:not(.in-lobby) .poker-table {
  bottom: auto !important;
  height: 52% !important;
  left: 50% !important;
  margin: auto !important;
  max-height: 100% !important;
  max-width: 100% !important;
  top: 49% !important;
  transform: translate(-50%, -50%) !important;
  width: 76% !important;
}

/* Urgent regression fix: desktop fullscreen must remain desktop/landscape,
   and the table surface must use the normal arrow cursor. */
body:not(.in-lobby),
body:not(.in-lobby) .game-container,
body:not(.in-lobby) .table-container,
body:not(.in-lobby) .game-stage,
body:not(.in-lobby) .table-scene,
body:not(.in-lobby) .poker-table,
body:not(.in-lobby) canvas {
  cursor: default !important;
}

body:not(.in-lobby) button,
body:not(.in-lobby) [role="button"],
body:not(.in-lobby) .gold-button,
body:not(.in-lobby) .seat-select-button,
body:not(.in-lobby) .inactive-seat,
body:not(.in-lobby) .card.reveal-choice {
  cursor: pointer !important;
}

@media (min-width: 901px) and (pointer: fine) {
  body.fullscreen-active:not(.in-lobby) {
    --layout-mode: desktop;
    background: #050711 !important;
    height: 100vh !important;
    max-height: none !important;
    overflow: hidden !important;
    width: 100vw !important;
  }

  body.fullscreen-active:not(.in-lobby) .game-viewport,
  body.fullscreen-active:not(.in-lobby) .app-viewport {
    background: #050711 !important;
    box-sizing: border-box !important;
    display: block !important;
    height: 100vh !important;
    max-height: none !important;
    max-width: none !important;
    min-height: 100vh !important;
    overflow: auto !important;
    padding: 0 !important;
    position: static !important;
    transform: none !important;
    width: 100vw !important;
  }

  body.fullscreen-active:not(.in-lobby) .game-stage {
    height: auto !important;
    max-height: none !important;
    min-height: 100vh !important;
    overflow: visible !important;
    position: static !important;
    transform: none !important;
    width: 100% !important;
  }

  body.fullscreen-active:not(.in-lobby) .game-shell {
    display: grid !important;
    gap: 1rem !important;
    grid-template-areas: "top" "table" "actions" !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto minmax(610px, 1fr) auto !important;
    margin: 0 auto !important;
    max-height: none !important;
    max-width: 1500px !important;
    min-height: 100vh !important;
    overflow: visible !important;
    padding: 1rem 1rem 2rem !important;
    width: 100% !important;
  }

  body.fullscreen-active:not(.in-lobby) .table-scene {
    aspect-ratio: 16 / 9 !important;
    grid-area: table !important;
    height: auto !important;
    margin: 0 !important;
    max-height: none !important;
    min-height: 610px !important;
    overflow: hidden !important;
    position: relative !important;
    transform: none !important;
    width: 100% !important;
  }

  body.fullscreen-active:not(.in-lobby) .poker-table {
    bottom: auto !important;
    height: 52% !important;
    left: 50% !important;
    max-height: none !important;
    max-width: none !important;
    position: absolute !important;
    top: 49% !important;
    transform: translate(-50%, -50%) !important;
    width: 76% !important;
  }

  body.fullscreen-active:not(.in-lobby).phone-landscape,
  body.fullscreen-active:not(.in-lobby).mobile-table-mode,
  body.fullscreen-active:not(.in-lobby).tablet-landscape {
    --layout-mode: desktop;
  }
}

/* Final fullscreen sizing fix: request fullscreen on the full game shell and
   let the desktop table scene fill the available monitor space. */
@media (min-width: 901px) and (pointer: fine) {
  body.fullscreen-active:not(.in-lobby),
  html:has(body.fullscreen-active:not(.in-lobby)) {
    background: #02040c !important;
    height: 100vh !important;
    margin: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    width: 100vw !important;
  }

  body.fullscreen-active:not(.in-lobby) .game-shell.game-fullscreen,
  body.fullscreen-active:not(.in-lobby) .game-shell {
    background: #02040c !important;
    box-sizing: border-box !important;
    display: grid !important;
    gap: 8px !important;
    grid-template-areas:
      "top"
      "table"
      "actions" !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    height: 100vh !important;
    inset: 0 !important;
    margin: 0 !important;
    max-height: none !important;
    max-width: none !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 4px !important;
    position: fixed !important;
    transform: none !important;
    width: 100vw !important;
    zoom: 1 !important;
    z-index: 999999 !important;
  }

  body.fullscreen-active:not(.in-lobby) .top-bar {
    flex-shrink: 0 !important;
    grid-area: top !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  body.fullscreen-active:not(.in-lobby) .table-scene {
    align-self: center !important;
    aspect-ratio: 16 / 9 !important;
    grid-area: table !important;
    height: 100% !important;
    justify-self: center !important;
    margin: 0 auto !important;
    max-height: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    position: relative !important;
    transform: none !important;
    width: auto !important;
    zoom: 1 !important;
  }

  body.fullscreen-active:not(.in-lobby) .action-panel {
    flex-shrink: 0 !important;
    grid-area: actions !important;
    margin: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  body.fullscreen-active:not(.in-lobby) .poker-table {
    bottom: auto !important;
    height: 52% !important;
    left: 50% !important;
    margin: 0 !important;
    max-height: none !important;
    max-width: none !important;
    position: absolute !important;
    right: auto !important;
    top: 49% !important;
    transform: translate(-50%, -50%) !important;
    width: 76% !important;
    zoom: 1 !important;
  }

  body.fullscreen-active:not(.in-lobby),
  body.fullscreen-active:not(.in-lobby) .game-shell,
  body.fullscreen-active:not(.in-lobby) .table-scene,
  body.fullscreen-active:not(.in-lobby) .poker-table {
    cursor: default !important;
  }

  body.fullscreen-active:not(.in-lobby) button,
  body.fullscreen-active:not(.in-lobby) [role="button"] {
    cursor: pointer !important;
  }

  body.fullscreen-active:not(.in-lobby) .game-stage .reveal-overlay,
  body.fullscreen-active:not(.in-lobby) .game-stage .reveal-overlay.show {
    font-size: clamp(7px, .62vw, 10px) !important;
    line-height: 1 !important;
    max-width: min(7rem, 11vw) !important;
    padding: 1px 5px !important;
    z-index: 150 !important;
  }

  body.fullscreen-active:not(.in-lobby) .game-stage .reveal-overlay span {
    font-size: .48em !important;
    line-height: 1 !important;
    margin-top: 0 !important;
  }
}

/* Phone landscape fit only: keep the full table, seats, toolbar, and action
   area inside the visible Safari/Chrome viewport without affecting desktop,
   laptop, Firefox, Edge, or iPad/tablet layouts. */
@media (pointer: coarse) and (max-width: 932px) and (orientation: landscape) {
  html,
  body:not(.in-lobby) {
    height: 100dvh !important;
    margin: 0 !important;
    max-height: 100dvh !important;
    min-height: 100svh !important;
    overflow: hidden !important;
    width: 100vw !important;
  }

  body:not(.in-lobby) .app-viewport,
  body:not(.in-lobby) .game-viewport,
  body.phone-landscape:not(.in-lobby) .poker-table-wrapper,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .poker-table-wrapper {
    box-sizing: border-box !important;
    height: 100dvh !important;
    inset: 0 !important;
    max-height: 100dvh !important;
    min-height: 100svh !important;
    overflow: hidden !important;
    padding:
      max(4px, env(safe-area-inset-top, 0px))
      max(6px, env(safe-area-inset-right, 0px))
      max(4px, env(safe-area-inset-bottom, 0px))
      max(6px, env(safe-area-inset-left, 0px)) !important;
    position: fixed !important;
    width: 100vw !important;
  }

  body.phone-landscape:not(.in-lobby) .game-stage,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage {
    --mobile-nav-h: 34px;
    --mobile-action-h: 42px;
    box-sizing: border-box !important;
    height: 100% !important;
    inset: 0 !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: relative !important;
    transform: none !important;
    width: 100% !important;
  }

  body.phone-landscape:not(.in-lobby) .game-shell,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-shell {
    box-sizing: border-box !important;
    display: grid !important;
    gap: 2px !important;
    grid-template-areas: "top" "table" "actions" !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: var(--mobile-nav-h) minmax(0, 1fr) var(--mobile-action-h) !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    width: 100% !important;
  }

  body.phone-landscape:not(.in-lobby) .top-bar,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .top-bar {
    align-items: center !important;
    box-sizing: border-box !important;
    display: flex !important;
    gap: 4px !important;
    grid-area: top !important;
    height: 34px !important;
    left: auto !important;
    max-height: 34px !important;
    min-height: 34px !important;
    overflow: hidden !important;
    padding: 2px 4px !important;
    position: relative !important;
    right: auto !important;
    top: auto !important;
    width: 100% !important;
  }

  body.phone-landscape:not(.in-lobby) .top-bar button,
  body.phone-landscape:not(.in-lobby) .score-strip button,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .top-bar button,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .score-strip button,
  body.phone-landscape:not(.in-lobby) .score-strip > span,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .score-strip > span {
    font-size: 10px !important;
    line-height: 1 !important;
    min-height: 26px !important;
    padding: 3px 8px !important;
  }

  body.phone-landscape:not(.in-lobby) .table-scene,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .table-scene {
    align-items: center !important;
    bottom: auto !important;
    box-sizing: border-box !important;
    display: block !important;
    grid-area: table !important;
    height: 100% !important;
    justify-content: center !important;
    left: auto !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    position: relative !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    width: 100% !important;
  }

  body.phone-landscape:not(.in-lobby) .poker-table,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .poker-table {
    height: min(100%, calc(96vw / 2.15)) !important;
    left: 50% !important;
    margin: 0 auto !important;
    max-height: 100% !important;
    max-width: 96vw !important;
    min-height: 0 !important;
    min-width: 0 !important;
    overflow: visible !important;
    position: absolute !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 96vw !important;
  }

  body.phone-landscape:not(.in-lobby) .seat,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat {
    max-width: 72px !important;
    min-width: 0 !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-select-button,
  body.phone-landscape:not(.in-lobby) .inactive-seat,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-select-button,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .inactive-seat {
    min-height: 26px !important;
    padding: 3px 8px !important;
  }

  body.phone-landscape:not(.in-lobby) .player-nameplate,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .player-nameplate {
    padding: 2px 5px !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-bottom,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-bottom {
    bottom: 1% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-bottom-left,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-bottom-left {
    bottom: 5% !important;
    left: 22% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-bottom-right,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-bottom-right {
    bottom: 5% !important;
    left: 78% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-left-lower,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-left-lower {
    left: 1% !important;
    top: 70% !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-right-lower,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-right-lower {
    right: 1% !important;
    top: 70% !important;
  }

  body.phone-landscape:not(.in-lobby) .action-panel,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .action-panel {
    bottom: auto !important;
    box-sizing: border-box !important;
    grid-area: actions !important;
    height: var(--mobile-action-h) !important;
    left: auto !important;
    max-height: var(--mobile-action-h) !important;
    min-height: 0 !important;
    padding: 2px 4px !important;
    position: relative !important;
    right: auto !important;
    width: 100% !important;
  }

  body.phone-landscape:not(.in-lobby) .controls,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .controls {
    gap: 6px !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
  }

  body.phone-landscape:not(.in-lobby) .controls button,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .controls button {
    font-size: 12px !important;
    min-height: 30px !important;
    padding: 3px 10px !important;
  }

  body.phone-landscape:not(.in-lobby) .controls.seat-pending,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .controls.seat-pending,
  body.phone-landscape:not(.in-lobby) .controls.status-only,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .controls.status-only {
    align-items: center !important;
    justify-content: center !important;
  }

  body.phone-landscape:not(.in-lobby) .controls.seat-pending #newHand,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .controls.seat-pending #newHand,
  body.phone-landscape:not(.in-lobby) .controls.status-only #newHand,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .controls.status-only #newHand {
    max-width: 300px !important;
    min-height: 30px !important;
    transform: scale(.72) !important;
    transform-origin: center center !important;
    z-index: 60 !important;
  }
}

@media (pointer: coarse) and (max-width: 780px) and (orientation: landscape) {
  body.phone-landscape:not(.in-lobby) .poker-table,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .poker-table {
    height: min(100%, calc(94vw / 2.2)) !important;
    max-width: 94vw !important;
    width: 94vw !important;
  }

  body.phone-landscape:not(.in-lobby) .seat,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat {
    max-width: 64px !important;
  }

  body.phone-landscape:not(.in-lobby) .seat-select-button,
  body.phone-landscape:not(.in-lobby) .inactive-seat,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .seat-select-button,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .inactive-seat {
    min-height: 24px !important;
    padding: 2px 6px !important;
  }

  body.phone-landscape:not(.in-lobby) .controls.seat-pending #newHand,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .controls.seat-pending #newHand,
  body.phone-landscape:not(.in-lobby) .controls.status-only #newHand,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .controls.status-only #newHand {
    transform: scale(.62) !important;
  }
}

/* General phone landscape fit rule.
   Fit the table to the visible viewport first, then scale seats, cards, and
   banners so they cannot force the board wider/taller than the screen. */
@media (pointer: coarse) and (max-width: 900px) and (orientation: landscape) {
  body:not(.in-lobby) .game-stage,
  body.phone-landscape:not(.in-lobby) .game-stage,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .game-stage {
    overflow: hidden !important;
  }

  body:not(.in-lobby) .table-scene,
  body.phone-landscape:not(.in-lobby) .table-scene,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .table-scene {
    overflow: hidden !important;
  }

  body:not(.in-lobby) .poker-table,
  body:not(.in-lobby) .table-wrapper,
  body:not(.in-lobby) .table-felt,
  body.phone-landscape:not(.in-lobby) .poker-table,
  body.mobile-table-mode.phone-landscape:not(.in-lobby) .poker-table {
    aspect-ratio: 2.15 / 1 !important;
    height: min(calc(92vw / 2.15), calc(100dvh - 42px)) !important;
    max-height: calc(100dvh - 42px) !important;
    max-width: 92vw !important;
    min-height: 0 !important;
    min-width: 0 !important;
    width: 92vw !important;
  }

  body:not(.in-lobby) .seat,
  body:not(.in-lobby) .seat-button,
  body:not(.in-lobby) .open-seat,
  body:not(.in-lobby) .player-seat,
  body:not(.in-lobby) .seat-select-button,
  body:not(.in-lobby) .inactive-seat {
    transform-origin: center center !important;
  }

  body:not(.in-lobby) .seat-select-button,
  body:not(.in-lobby) .inactive-seat,
  body:not(.in-lobby) .player-nameplate {
    max-width: 74px !important;
  }

  body:not(.in-lobby) .card,
  body:not(.in-lobby) .playing-card,
  body:not(.in-lobby) .hole-card,
  body:not(.in-lobby) .community-card {
    transform: scale(.70) !important;
    transform-origin: center center !important;
  }

  body:not(.in-lobby) .community,
  body:not(.in-lobby) .community-cards {
    transform: translate(-50%, -50%) scale(.72) !important;
    transform-origin: center center !important;
  }

  body:not(.in-lobby) .waiting-banner,
  body:not(.in-lobby) .status-banner,
  body:not(.in-lobby) .result-banner,
  body:not(.in-lobby) .winner-banner,
  body:not(.in-lobby) .action-banner,
  body:not(.in-lobby) .controls.status-only #newHand,
  body:not(.in-lobby) .controls.seat-pending #newHand {
    max-width: 260px !important;
    min-height: 30px !important;
    transform: translateX(-50%) scale(.65) !important;
    transform-origin: center center !important;
  }
}

/* Phone table-fit mode is enabled only after a user tap on table entry.
   It keeps side seats/cards inside the visible browser viewport and prevents
   banners/cards from covering the board. */
@media (max-width: 932px) and (orientation: landscape) and (pointer: coarse) {
  html.phone-table-fit,
  body.phone-table-fit {
    background: #02040c !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 100svh !important;
    overflow: hidden !important;
    width: 100vw !important;
  }

  html.phone-table-fit body:not(.in-lobby) .app-viewport,
  body.phone-table-fit:not(.in-lobby) .app-viewport,
  body.phone-table-fit:not(.in-lobby) .game-viewport {
    box-sizing: border-box !important;
    height: 100dvh !important;
    inset: 0 !important;
    max-height: 100dvh !important;
    min-height: 100svh !important;
    overflow: hidden !important;
    padding:
      max(2px, env(safe-area-inset-top, 0px))
      max(4px, env(safe-area-inset-right, 0px))
      max(2px, env(safe-area-inset-bottom, 0px))
      max(4px, env(safe-area-inset-left, 0px)) !important;
    position: fixed !important;
    width: 100vw !important;
  }

  body.phone-table-fit:not(.in-lobby) .game-stage {
    --mobile-nav-h: 26px;
    --mobile-action-h: 34px;
    box-sizing: border-box !important;
    height: 100% !important;
    inset: 0 !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: relative !important;
    transform: none !important;
    width: 100% !important;
  }

  body.phone-table-fit:not(.in-lobby) .game-shell {
    display: grid !important;
    gap: 1px !important;
    grid-template-areas: "top" "table" "actions" !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: var(--mobile-nav-h) minmax(0, 1fr) var(--mobile-action-h) !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    width: 100% !important;
  }

  body.phone-table-fit:not(.in-lobby) .top-bar {
    align-items: center !important;
    display: flex !important;
    grid-area: top !important;
    height: 26px !important;
    max-height: 26px !important;
    min-height: 26px !important;
    overflow: hidden !important;
    padding: 1px 4px !important;
    position: relative !important;
    width: 100% !important;
  }

  body.phone-table-fit:not(.in-lobby) .score-strip {
    gap: 3px !important;
    justify-content: flex-end !important;
    overflow: hidden !important;
  }

  body.phone-table-fit:not(.in-lobby) .top-bar button,
  body.phone-table-fit:not(.in-lobby) .score-strip button,
  body.phone-table-fit:not(.in-lobby) .score-strip > span {
    font-size: 8px !important;
    line-height: 1 !important;
    min-height: 22px !important;
    padding: 2px 5px !important;
  }

  body.phone-table-fit:not(.in-lobby) #fullscreenButton {
    display: none !important;
  }

  body.phone-table-fit:not(.in-lobby) .table-scene {
    box-sizing: border-box !important;
    grid-area: table !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    position: relative !important;
    transform: none !important;
    width: 100% !important;
  }

  body.phone-table-fit:not(.in-lobby) .poker-table {
    height: min(calc(100dvh - 64px), calc(86vw / 2.15)) !important;
    left: 50% !important;
    margin: 0 auto !important;
    max-height: calc(100dvh - 64px) !important;
    max-width: 86vw !important;
    min-height: 0 !important;
    min-width: 0 !important;
    overflow: visible !important;
    position: absolute !important;
    top: 49% !important;
    transform: translate(-50%, -50%) !important;
    width: 86vw !important;
  }

  body.phone-table-fit:not(.in-lobby) .seat {
    max-width: 58px !important;
    min-width: 0 !important;
    z-index: 42 !important;
  }

  body.phone-table-fit:not(.in-lobby) .seat-select-button,
  body.phone-table-fit:not(.in-lobby) .inactive-seat,
  body.phone-table-fit:not(.in-lobby) .player-nameplate {
    max-width: 58px !important;
    min-height: 20px !important;
    padding: 2px 4px !important;
  }

  body.phone-table-fit:not(.in-lobby) .player-nameplate strong,
  body.phone-table-fit:not(.in-lobby) .seat-select-button strong,
  body.phone-table-fit:not(.in-lobby) .inactive-seat strong {
    font-size: 8px !important;
  }

  body.phone-table-fit:not(.in-lobby) .player-nameplate span,
  body.phone-table-fit:not(.in-lobby) .seat-select-button span,
  body.phone-table-fit:not(.in-lobby) .inactive-seat span {
    font-size: 7px !important;
  }

  body.phone-table-fit:not(.in-lobby) .hole-cards,
  body.phone-table-fit:not(.in-lobby) .player-cards {
    gap: 1px !important;
    min-height: 0 !important;
    overflow: visible !important;
    transform: scale(.62) !important;
    transform-origin: center center !important;
  }

  body.phone-table-fit:not(.in-lobby) .hole-cards .card,
  body.phone-table-fit:not(.in-lobby) .card,
  body.phone-table-fit:not(.in-lobby) .playing-card {
    aspect-ratio: 2.5 / 3.5 !important;
    overflow: visible !important;
  }

  body.phone-table-fit:not(.in-lobby) .community {
    left: 50% !important;
    min-height: 0 !important;
    overflow: visible !important;
    top: 43% !important;
    transform: translate(-50%, -50%) scale(.68) !important;
    transform-origin: center center !important;
    z-index: 80 !important;
  }

  body.phone-table-fit:not(.in-lobby) .community .card {
    aspect-ratio: 2.5 / 3.5 !important;
    overflow: visible !important;
  }

  body.phone-table-fit:not(.in-lobby) .seat-left-lower,
  body.phone-table-fit:not(.in-lobby) .seat-left-upper {
    left: 4% !important;
  }

  body.phone-table-fit:not(.in-lobby) .seat-right-lower,
  body.phone-table-fit:not(.in-lobby) .seat-right-upper {
    right: 4% !important;
  }

  body.phone-table-fit:not(.in-lobby) .seat-bottom {
    bottom: 3% !important;
  }

  body.phone-table-fit:not(.in-lobby) .seat-bottom-left {
    bottom: 6% !important;
    left: 24% !important;
  }

  body.phone-table-fit:not(.in-lobby) .seat-bottom-right {
    bottom: 6% !important;
    left: 76% !important;
  }

  body.phone-table-fit:not(.in-lobby) .seat-top,
  body.phone-table-fit:not(.in-lobby) .seat-top-left,
  body.phone-table-fit:not(.in-lobby) .seat-top-right {
    top: 3% !important;
  }

  body.phone-table-fit:not(.in-lobby) .action-panel {
    bottom: auto !important;
    grid-area: actions !important;
    height: var(--mobile-action-h) !important;
    max-height: var(--mobile-action-h) !important;
    min-height: 0 !important;
    padding: 1px 4px !important;
    position: relative !important;
    width: 100% !important;
  }

  body.phone-table-fit:not(.in-lobby) .controls {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
  }

  body.phone-table-fit:not(.in-lobby) .controls button {
    font-size: 10px !important;
    min-height: 26px !important;
    padding: 2px 8px !important;
  }

  body.phone-table-fit:not(.in-lobby) .waiting-banner,
  body.phone-table-fit:not(.in-lobby) .status-banner,
  body.phone-table-fit:not(.in-lobby) .result-banner,
  body.phone-table-fit:not(.in-lobby) .select-seat-banner,
  body.phone-table-fit:not(.in-lobby) .controls.status-only #newHand,
  body.phone-table-fit:not(.in-lobby) .controls.seat-pending #newHand {
    bottom: 0 !important;
    max-width: 260px !important;
    min-height: 24px !important;
    pointer-events: none !important;
    transform: translateX(-50%) scale(.55) !important;
    transform-origin: center center !important;
    z-index: 40 !important;
  }
}

#iosFullscreenNotice {
  position: fixed;
  left: 50%;
  bottom: 12px;
  transform: translateX(-50%);
  z-index: 99999;
  background: rgba(0, 0, 0, 0.88);
  color: #fff;
  border: 1px solid #f6c343;
  border-radius: 12px;
  padding: 10px 14px;
  font-size: 13px;
  line-height: 1.3;
  text-align: center;
  max-width: 88vw;
  pointer-events: none;
}

@media (display-mode: fullscreen), (display-mode: standalone) {
  html,
  body,
  #app,
  .app,
  .app-root,
  .game-shell,
  #gameShell,
  .table-screen,
  #tableScreen {
    width: 100vw !important;
    height: 100dvh !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #iosFullscreenNotice {
    display: none !important;
  }
}

/* Release blocker stabilization only: interaction, overlay, and panel safety.
   This block intentionally avoids table sizing, seat positioning, card art,
   betting rules, and gameplay geometry. */
body:not(.in-lobby) .game-stage,
body:not(.in-lobby) .game-viewport,
body:not(.in-lobby) .table-scene,
body:not(.in-lobby) .poker-table,
body:not(.in-lobby) .felt,
body:not(.in-lobby) .community,
body:not(.in-lobby) .seat,
body:not(.in-lobby) .card {
  touch-action: manipulation !important;
}

body:not(.in-lobby) .seat-select-button,
body:not(.in-lobby) [data-seat-index],
body:not(.in-lobby) .seat-open {
  pointer-events: auto !important;
  touch-action: manipulation !important;
  z-index: 2140 !important;
}

body:not(.in-lobby) .controls:not(.seat-pending) #callButton,
body:not(.in-lobby) .controls:not(.seat-pending) #raiseButton {
  text-transform: uppercase !important;
}

body:not(.in-lobby) .controls:not(.seat-pending) #callButton::after,
body:not(.in-lobby) .controls:not(.seat-pending) #raiseButton::after {
  content: "" !important;
}

body:not(.in-lobby) .winner-banner.show,
body:not(.in-lobby) .game-stage .winner-banner.show {
  max-height: min(5.6rem, 15dvh) !important;
  max-width: min(24rem, 38vw) !important;
  overflow: visible !important;
  padding: clamp(.22rem, .7dvh, .38rem) clamp(.48rem, 1.2vw, .78rem) !important;
  top: calc(env(safe-area-inset-top, 0px) + clamp(38px, 8dvh, 74px)) !important;
  z-index: 860 !important;
}

body:not(.in-lobby) .winner-banner.show strong,
body:not(.in-lobby) .game-stage .winner-banner.show strong {
  font-size: clamp(.7rem, 1.35vw, 1rem) !important;
}

body:not(.in-lobby) .winner-banner.show span,
body:not(.in-lobby) .game-stage .winner-banner.show span {
  font-size: clamp(.54rem, 1vw, .74rem) !important;
}

body:not(.in-lobby) .winner-choice-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .32rem !important;
  justify-content: center !important;
  pointer-events: auto !important;
}

body:not(.in-lobby) .winner-banner.show .expose-cards-button,
body:not(.in-lobby) .winner-banner.show .muck-cards-button,
body:not(.in-lobby) .game-stage .winner-banner.show .expose-cards-button,
body:not(.in-lobby) .game-stage .winner-banner.show .muck-cards-button {
  border-radius: 999px !important;
  display: inline-flex !important;
  font-size: clamp(.5rem, .9vw, .68rem) !important;
  justify-content: center !important;
  min-height: clamp(1.18rem, 2.6dvh, 1.55rem) !important;
  padding: .22rem .55rem !important;
  pointer-events: auto !important;
  white-space: nowrap !important;
}

body:not(.in-lobby) .winner-banner.show .muck-cards-button,
body:not(.in-lobby) .game-stage .winner-banner.show .muck-cards-button {
  background: linear-gradient(180deg, #2f3b63, #111a36) !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  color: #eef3ff !important;
}

body:not(.in-lobby) .reveal-overlay,
body:not(.in-lobby) .reveal-overlay.show,
body:not(.in-lobby) .result-banner,
body:not(.in-lobby) .turn-callout,
body:not(.in-lobby) .turn-label,
body:not(.in-lobby) .action-banner {
  max-width: min(20rem, 34vw) !important;
  pointer-events: none !important;
  z-index: 780 !important;
}

body:not(.in-lobby) .reveal-overlay,
body:not(.in-lobby) .reveal-overlay.show {
  top: 27% !important;
}

body:not(.in-lobby) .result-banner {
  top: 61% !important;
}

body:not(.in-lobby) .chat-panel.open,
body:not(.in-lobby) .game-stage .chat-panel.open {
  bottom: auto !important;
  box-sizing: border-box !important;
  left: auto !important;
  max-height: min(48dvh, 18rem) !important;
  max-width: min(18rem, calc(100dvw - 1rem)) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  position: fixed !important;
  right: max(.5rem, env(safe-area-inset-right, 0px)) !important;
  top: max(3.1rem, calc(env(safe-area-inset-top, 0px) + 2.8rem)) !important;
  transform: none !important;
  width: min(18rem, calc(100dvw - 1rem)) !important;
  z-index: 72000 !important;
}

body:not(.in-lobby) #menuPanel.open,
body:not(.in-lobby) #howPanel.open,
body:not(.in-lobby) .menu-panel.open,
body:not(.in-lobby) .flyout.open {
  max-width: calc(100dvw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px) - 1rem) !important;
  overflow-x: hidden !important;
  overscroll-behavior-x: none !important;
  touch-action: pan-y !important;
}

body:not(.in-lobby) #menuPanel.open *,
body:not(.in-lobby) #howPanel.open *,
body:not(.in-lobby) .menu-panel.open *,
body:not(.in-lobby) .flyout.open * {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}

body:not(.in-lobby) .chip-flight {
  color: transparent !important;
  font-size: 0 !important;
  text-shadow: none !important;
}

/* Small stability fix: preserve card sizes/rendering, but keep top edges from
   being clipped by their holders. */
body:not(.in-lobby) .community,
body:not(.in-lobby) .hole-cards,
body:not(.in-lobby) .player-cards,
body:not(.in-lobby) .seat,
body:not(.in-lobby) .table-scene,
body:not(.in-lobby) .felt {
  overflow: visible !important;
}

body:not(.in-lobby) .community,
body:not(.in-lobby) .hole-cards {
  padding-top: max(4px, .25rem) !important;
}

body:not(.in-lobby) .community .card,
body:not(.in-lobby) .hole-cards .card {
  overflow: visible !important;
}

body:not(.in-lobby) .chip-flight.show {
  animation: flyChipToTarget 880ms ease forwards !important;
  left: var(--from-x, 50%) !important;
  top: var(--from-y, 50%) !important;
}

@keyframes flyChipToTarget {
  0% {
    left: var(--from-x, 50%);
    opacity: 0;
    top: var(--from-y, 50%);
    transform: translate(-50%, -50%) scale(.78);
  }
  18% { opacity: 1; }
  100% {
    left: var(--to-x, 50%);
    opacity: 1;
    top: var(--to-y, 50%);
    transform: translate(-50%, -50%) scale(1);
  }
}

#soundRestorePrompt {
  background: rgba(5, 12, 27, .94);
  border: 1px solid #f6c343;
  border-radius: 999px;
  bottom: max(12px, env(safe-area-inset-bottom, 0px));
  box-shadow: 0 10px 28px rgba(0,0,0,.45);
  color: #fff5b8;
  cursor: pointer;
  font-size: 13px;
  font-weight: 900;
  left: 50%;
  min-height: 34px;
  padding: 7px 14px;
  position: fixed;
  transform: translateX(-50%);
  z-index: 2147483601;
}

/* Small stability polish: keep the existing toolbar on one clean row without
   changing table size, toolbar structure, or button behavior. */
body:not(.in-lobby) .top-bar,
body:not(.in-lobby) .game-stage .top-bar {
  align-items: center !important;
  gap: clamp(.18rem, .45vw, .45rem) !important;
  overflow: visible !important;
}

body:not(.in-lobby) .score-strip,
body:not(.in-lobby) .game-stage .score-strip {
  align-items: center !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: clamp(.12rem, .35vw, .35rem) !important;
  justify-content: flex-end !important;
  min-width: 0 !important;
  overflow: visible !important;
}

body:not(.in-lobby) .score-strip span,
body:not(.in-lobby) .score-strip button,
body:not(.in-lobby) .game-stage .score-strip span,
body:not(.in-lobby) .game-stage .score-strip button {
  align-items: center !important;
  display: inline-flex !important;
  flex: 0 1 auto !important;
  font-size: clamp(.58rem, .92vw, .86rem) !important;
  justify-content: center !important;
  line-height: 1 !important;
  min-height: clamp(1.55rem, 3.5dvh, 2.1rem) !important;
  padding: clamp(.18rem, .45dvh, .34rem) clamp(.42rem, .7vw, .74rem) !important;
  text-align: center !important;
  white-space: nowrap !important;
}

body:not(.in-lobby) .score-strip #fullscreenButton,
body:not(.in-lobby) .game-stage .score-strip #fullscreenButton {
  max-width: min(10rem, 18vw) !important;
}

@media (orientation: landscape) and (max-width: 900px), (orientation: landscape) and (max-height: 520px) {
  body:not(.in-lobby) .score-strip,
  body:not(.in-lobby) .game-stage .score-strip {
    gap: 3px !important;
  }

  body:not(.in-lobby) .score-strip span,
  body:not(.in-lobby) .score-strip button,
  body:not(.in-lobby) .game-stage .score-strip span,
  body:not(.in-lobby) .game-stage .score-strip button {
    font-size: clamp(8px, 2dvh, 11px) !important;
    min-height: clamp(22px, 5.8dvh, 28px) !important;
    padding: 2px 6px !important;
  }
}

/* Final small clipping guard: card holder only, no card renderer or sizing. */
body:not(.in-lobby) #communityCards,
body:not(.in-lobby) .community,
body:not(.in-lobby) .hole-cards,
body:not(.in-lobby) .player-cards {
  box-sizing: content-box !important;
  min-height: calc(var(--card-h, 7rem) + 12px) !important;
  overflow: visible !important;
  padding-top: 8px !important;
}

body:not(.in-lobby) .seat .hole-cards,
body:not(.in-lobby) .seat .player-cards {
  margin-top: -4px !important;
}

body:not(.in-lobby) #communityCards .card,
body:not(.in-lobby) .community .card,
body:not(.in-lobby) .hole-cards .card,
body:not(.in-lobby) .player-cards .card {
  overflow: visible !important;
}

/* Final table polish: separate board-card and player-card sizing.
   Player hole cards must stay within each seat zone; community cards keep
   their larger readable board size. */
body:not(.in-lobby) .game-stage {
  --final-board-card-w: clamp(2.85rem, 7.32vw, 7.14rem);
  --final-board-card-h: clamp(4rem, 10.26vw, 10rem);
  --final-board-card-font: clamp(1.12rem, 2.57vw, 2.57rem);
  --final-player-card-w: clamp(1.9rem, 3.95vw, 3.7rem);
  --final-player-card-h: calc(var(--final-player-card-w) * 1.48);
  --final-player-card-font: clamp(1.05rem, 2.1vw, 2.3rem);
}

body:not(.in-lobby) #communityCards,
body:not(.in-lobby) .game-stage .community {
  box-sizing: content-box !important;
  min-height: calc(var(--final-board-card-h) + 18px) !important;
  overflow: visible !important;
  padding-top: 10px !important;
}

body:not(.in-lobby) .game-stage .hole-cards,
body:not(.in-lobby) .game-stage .player-cards {
  box-sizing: content-box !important;
  min-height: calc(var(--final-player-card-h) + 8px) !important;
  overflow: visible !important;
  padding-top: 4px !important;
}

body:not(.in-lobby) .game-stage .hole-cards .card,
body:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card,
body:not(.in-lobby) .game-stage .seat-bottom-left .hole-cards .card,
body:not(.in-lobby) .game-stage .seat-bottom-right .hole-cards .card,
body:not(.in-lobby) .game-stage .player-cards .card {
  aspect-ratio: auto !important;
  box-sizing: border-box !important;
  flex: 0 0 var(--final-player-card-w) !important;
  font-size: var(--final-player-card-font) !important;
  height: var(--final-player-card-h) !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: visible !important;
  transform: none !important;
  width: var(--final-player-card-w) !important;
}

body:not(.in-lobby) .game-stage #communityCards.community .card,
body:not(.in-lobby) .game-stage .community .card {
  aspect-ratio: auto !important;
  box-sizing: border-box !important;
  flex: 0 0 var(--final-board-card-w) !important;
  font-size: var(--final-board-card-font) !important;
  height: var(--final-board-card-h) !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: visible !important;
  width: var(--final-board-card-w) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage #communityCards.community .card,
body.mobile-table-mode:not(.in-lobby) .game-stage .community .card,
body.phone-landscape:not(.in-lobby) .game-stage #communityCards.community .card,
body.phone-landscape:not(.in-lobby) .game-stage .community .card,
body.tablet-landscape:not(.in-lobby) .game-stage #communityCards.community .card,
body.tablet-landscape:not(.in-lobby) .game-stage .community .card {
  flex-basis: var(--final-board-card-w) !important;
  font-size: var(--final-board-card-font) !important;
  height: var(--final-board-card-h) !important;
  max-height: none !important;
  min-height: 0 !important;
  width: var(--final-board-card-w) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .hole-cards .card,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom-left .hole-cards .card,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom-right .hole-cards .card,
body.mobile-table-mode:not(.in-lobby) .game-stage .player-cards .card,
body.phone-landscape:not(.in-lobby) .game-stage .hole-cards .card,
body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card,
body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom-left .hole-cards .card,
body.phone-landscape:not(.in-lobby) .game-stage .seat-bottom-right .hole-cards .card,
body.phone-landscape:not(.in-lobby) .game-stage .player-cards .card,
body.tablet-landscape:not(.in-lobby) .game-stage .hole-cards .card,
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom .hole-cards .card,
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom-left .hole-cards .card,
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom-right .hole-cards .card,
body.tablet-landscape:not(.in-lobby) .game-stage .player-cards .card {
  flex-basis: var(--final-player-card-w) !important;
  font-size: var(--final-player-card-font) !important;
  height: var(--final-player-card-h) !important;
  max-height: none !important;
  min-height: 0 !important;
  transform: none !important;
  width: var(--final-player-card-w) !important;
}

body:not(.in-lobby) .game-stage .seat:not(.local) .hole-cards .card:hover,
body:not(.in-lobby) .game-stage .seat:not(.local) .hole-cards .card:active,
body:not(.in-lobby) .game-stage .seat:not(.local) .hole-cards .card:focus,
body:not(.in-lobby) .game-stage .seat:not(.local) .hole-cards .card:focus-visible,
body:not(.in-lobby) .game-stage .seat:not(.local) .hole-cards .card.touch-active {
  box-shadow:
    inset 0 0 0 1px #ffffff,
    inset 0 0 0 2px rgba(44,56,83,.16),
    inset 0 -5px 9px rgba(23,36,67,.14),
    0 1px 0 rgba(255,255,255,.88),
    0 9px 16px rgba(0,0,0,.48) !important;
  position: relative !important;
  transform: none !important;
  z-index: auto !important;
}

body:not(.in-lobby) .game-stage .seat.local .hole-cards .card:hover,
body:not(.in-lobby) .game-stage .seat.local .hole-cards .card:focus-visible,
body:not(.in-lobby) .game-stage .seat.local .hole-cards .card.touch-active {
  transform: translateY(-.16rem) scale(1.03) !important;
  z-index: 80 !important;
}

body:not(.in-lobby) .game-stage .seat-bottom .hole-cards,
body:not(.in-lobby) .game-stage .seat-bottom-left .hole-cards {
  transform: translateY(-.5rem) !important;
}

body:not(.in-lobby) .game-stage .seat-bottom-left .hole-cards,
body:not(.in-lobby) .game-stage .seat-bottom-right .hole-cards {
  transform: translate(-.45rem, -.5rem) !important;
}

@media (orientation: landscape) and (max-width: 980px),
       (orientation: landscape) and (max-height: 560px) {
  body:not(.in-lobby) .game-stage {
    --final-board-card-w: clamp(34px, 11.5dvh, 59px);
    --final-board-card-h: clamp(46px, 16.1dvh, 83px);
    --final-board-card-font: clamp(14px, 4.4dvh, 24px);
    --final-player-card-w: clamp(24px, 7.2dvh, 40px);
    --final-player-card-h: calc(var(--final-player-card-w) * 1.48);
    --final-player-card-font: clamp(11px, 3.2dvh, 18px);
  }
}

@media (min-width: 768px) and (max-width: 1180px) and (orientation: landscape) {
  body:not(.in-lobby) .game-stage {
    --final-player-card-w: clamp(32px, 4.05vw, 44px);
    --final-player-card-h: calc(var(--final-player-card-w) * 1.48);
    --final-player-card-font: clamp(14px, 2vw, 21px);
  }
}

body.mobile-table-mode:not(.in-lobby) .game-stage .bankroll-stack,
body.phone-landscape:not(.in-lobby) .game-stage .bankroll-stack,
body.tablet-landscape:not(.in-lobby) .game-stage .bankroll-stack {
  pointer-events: none !important;
  transform: translate(-50%, -50%) scale(.82) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .chip-stack.bankroll,
body.phone-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll,
body.tablet-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll {
  height: 2.3rem !important;
  width: 3.1rem !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip,
body.phone-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip,
body.tablet-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip {
  height: .86rem !important;
  left: calc(.04rem + (var(--i) % 7) * .29rem) !important;
  top: calc(1.08rem - (var(--i) / 7) * .14rem) !important;
  width: .86rem !important;
}

/* Final table polish pass: exposed-card cleanup, visible stacks, readable
   bankrolls, and a clean pot-to-winner chip flight. */
body:not(.in-lobby) .game-stage .hole-cards .card:not(.back)::before,
body:not(.in-lobby) .game-stage .hole-cards button.card:not(.back)::before {
  content: none !important;
  display: none !important;
}

body:not(.in-lobby) .game-stage .player-chip-piles,
body:not(.in-lobby) .game-stage .bankroll-stack,
body:not(.in-lobby) .game-stage .chip-stack.bankroll,
body:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip {
  opacity: 1 !important;
  visibility: visible !important;
}

body:not(.in-lobby) .game-stage .bankroll-stack {
  pointer-events: none !important;
  z-index: 125 !important;
}

body:not(.in-lobby) .game-stage .chip-stack.bankroll {
  height: 4.15rem !important;
  width: 5.6rem !important;
}

body:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip {
  height: 1.82rem !important;
  left: calc(.06rem + (var(--i) % 7) * .56rem) !important;
  top: calc(2rem - (var(--i) / 7) * .27rem) !important;
  width: 1.82rem !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .chip-stack.bankroll,
body.phone-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll,
body.tablet-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll {
  height: 3.2rem !important;
  width: 4.3rem !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip,
body.phone-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip,
body.tablet-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip {
  height: 1.2rem !important;
  left: calc(.05rem + (var(--i) % 7) * .41rem) !important;
  top: calc(1.5rem - (var(--i) / 7) * .2rem) !important;
  width: 1.2rem !important;
}

body:not(.in-lobby) .game-stage .bankroll-stack span {
  background: rgba(2, 7, 18, .98) !important;
  border: 2px solid rgba(255,228,92,.82) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.56), 0 0 18px rgba(255,228,92,.34) !important;
  color: #ffe96d !important;
  display: block !important;
  font-size: 1.03rem !important;
  line-height: 1 !important;
  opacity: 1 !important;
  padding: .3rem .72rem !important;
  text-shadow: 0 0 10px rgba(255,228,92,.42) !important;
  transform: translateY(0) scale(1) !important;
  visibility: visible !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .bankroll-stack span,
body.phone-landscape:not(.in-lobby) .game-stage .bankroll-stack span,
body.tablet-landscape:not(.in-lobby) .game-stage .bankroll-stack span {
  font-size: .86rem !important;
  padding: .24rem .6rem !important;
}

body:not(.in-lobby) .chip-flight {
  z-index: 240 !important;
}

body:not(.in-lobby) .chip-flight.show {
  animation: flyChipToTarget 680ms ease-out forwards !important;
}

/* Final seat polish: attach bankroll chips to each seat in a consistent
   Cards / Name / Bankroll order without changing card or seat geometry. */
body:not(.in-lobby) .game-stage .seat {
  align-items: center !important;
  gap: clamp(2px, .28rem, 5px) !important;
}

body:not(.in-lobby) .game-stage .seat .player-nameplate {
  margin-top: clamp(3px, .34rem, 6px) !important;
  position: relative !important;
  z-index: 4 !important;
}

body:not(.in-lobby) .game-stage .seat-bankroll-row {
  align-items: center !important;
  display: grid !important;
  gap: clamp(3px, .26rem, 6px) !important;
  grid-template-columns: auto auto !important;
  justify-content: center !important;
  margin-top: 0 !important;
  max-width: min(11.4rem, 100%) !important;
  min-height: 2.35rem !important;
  pointer-events: none !important;
  position: relative !important;
  transform: none !important;
  white-space: nowrap !important;
  z-index: 4 !important;
}

body:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll {
  flex: 0 0 auto !important;
  height: 2.35rem !important;
  margin: 0 !important;
  pointer-events: none !important;
  position: relative !important;
  transform: none !important;
  width: 3.45rem !important;
}

body:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip {
  height: 1.04rem !important;
  left: calc(.04rem + (var(--i) % 7) * .33rem) !important;
  top: calc(1.08rem - (var(--i) / 7) * .15rem) !important;
  width: 1.04rem !important;
}

body:not(.in-lobby) .game-stage .seat-bankroll-bubble {
  background: rgba(2, 7, 18, .98) !important;
  border: 2px solid rgba(255,228,92,.86) !important;
  border-radius: 999px !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.52), 0 0 14px rgba(255,228,92,.28) !important;
  color: #ffec75 !important;
  display: inline-flex !important;
  flex: 0 0 auto !important;
  font-size: 1.02rem !important;
  font-weight: 950 !important;
  justify-content: center !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  min-width: 4.6rem !important;
  padding: .32rem .7rem !important;
  text-shadow: 0 0 9px rgba(255,228,92,.45) !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .seat-bankroll-row,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bankroll-row,
body.phone-landscape:not(.in-lobby) .game-stage .seat-bankroll-row {
  gap: 3px !important;
  max-width: min(8.9rem, 100%) !important;
  min-height: 1.85rem !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll,
body.phone-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll {
  height: 1.85rem !important;
  width: 2.72rem !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip,
body.phone-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip {
  height: .82rem !important;
  left: calc(.03rem + (var(--i) % 7) * .26rem) !important;
  top: calc(.86rem - (var(--i) / 7) * .12rem) !important;
  width: .82rem !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .seat-bankroll-bubble,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bankroll-bubble,
body.phone-landscape:not(.in-lobby) .game-stage .seat-bankroll-bubble {
  font-size: .82rem !important;
  min-width: 3.65rem !important;
  padding: .24rem .52rem !important;
}

/* Correction: bankroll chips are compact table stacks, not full chip-count
   towers. Top row is nudged outward to mirror bottom-seat spacing. */
body:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(n + 8) {
  display: none !important;
}

body:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip {
  height: 1.05rem !important;
  width: 1.05rem !important;
}

body:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(1) { left: .16rem !important; top: .92rem !important; }
body:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(2) { left: .86rem !important; top: .92rem !important; }
body:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(3) { left: 1.56rem !important; top: .92rem !important; }
body:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(4) { left: .5rem !important; top: .58rem !important; }
body:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(5) { left: 1.2rem !important; top: .58rem !important; }
body:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(6) { left: .84rem !important; top: .24rem !important; }
body:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(7) { left: 1.54rem !important; top: .24rem !important; }

body.tablet-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip,
body.phone-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip {
  height: .86rem !important;
  width: .86rem !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(1),
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(1),
body.phone-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(1) { left: .12rem !important; top: .72rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(2),
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(2),
body.phone-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(2) { left: .68rem !important; top: .72rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(3),
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(3),
body.phone-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(3) { left: 1.24rem !important; top: .72rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(4),
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(4),
body.phone-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(4) { left: .4rem !important; top: .46rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(5),
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(5),
body.phone-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(5) { left: .96rem !important; top: .46rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(6),
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(6),
body.phone-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(6) { left: .68rem !important; top: .2rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(7),
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(7),
body.phone-landscape:not(.in-lobby) .game-stage .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(7) { left: 1.24rem !important; top: .2rem !important; }

body:not(.in-lobby) .game-stage .seat-top-left {
  left: 30% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
}

body:not(.in-lobby) .game-stage .seat-top {
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
}

body:not(.in-lobby) .game-stage .seat-top-right {
  left: 70% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
}

body:not(.in-lobby) .game-stage .seat-top-left .player-nameplate,
body:not(.in-lobby) .game-stage .seat-top .player-nameplate,
body:not(.in-lobby) .game-stage .seat-top-right .player-nameplate {
  margin-top: clamp(7px, .6rem, 10px) !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .seat-top-left,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-top-left {
  left: 29% !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .seat-top,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-top {
  left: 50% !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .seat-top-right,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat-top-right {
  left: 71% !important;
  right: auto !important;
}

body:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip {
  height: 1.05rem !important;
  position: absolute !important;
  width: 1.05rem !important;
}

body:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(1) { left: .16rem !important; top: .92rem !important; }
body:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(2) { left: .86rem !important; top: .92rem !important; }
body:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(3) { left: 1.56rem !important; top: .92rem !important; }
body:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(4) { left: .5rem !important; top: .58rem !important; }
body:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(5) { left: 1.2rem !important; top: .58rem !important; }
body:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(6) { left: .84rem !important; top: .24rem !important; }
body:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(7) { left: 1.54rem !important; top: .24rem !important; }

body.tablet-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip,
body.mobile-table-mode:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip,
body.phone-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip {
  height: .86rem !important;
  width: .86rem !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(1),
body.mobile-table-mode:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(1),
body.phone-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(1) { left: .12rem !important; top: .72rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(2),
body.mobile-table-mode:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(2),
body.phone-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(2) { left: .68rem !important; top: .72rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(3),
body.mobile-table-mode:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(3),
body.phone-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(3) { left: 1.24rem !important; top: .72rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(4),
body.mobile-table-mode:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(4),
body.phone-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(4) { left: .4rem !important; top: .46rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(5),
body.mobile-table-mode:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(5),
body.phone-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(5) { left: .96rem !important; top: .46rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(6),
body.mobile-table-mode:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(6),
body.phone-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(6) { left: .68rem !important; top: .2rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(7),
body.mobile-table-mode:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(7),
body.phone-landscape:not(.in-lobby) .game-stage .seat .seat-bankroll-row .chip-stack.bankroll .bet-chip:nth-child(7) { left: 1.24rem !important; top: .2rem !important; }

/* Desktop/laptop fit only.
   Keep the successful mobile/tablet table modes frozen, but let fine-pointer
   browser windows center the full table inside the visible play area. */
@media (hover: hover) and (pointer: fine) and (min-width: 901px) {
  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-viewport,
  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .app-viewport {
    align-items: stretch !important;
    display: block !important;
    height: var(--visible-vh, 100dvh) !important;
    max-height: var(--visible-vh, 100dvh) !important;
    overflow: hidden !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage {
    height: var(--visible-vh, 100dvh) !important;
    inset: 0 !important;
    left: auto !important;
    max-height: var(--visible-vh, 100dvh) !important;
    overflow: hidden !important;
    position: relative !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    width: 100% !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .game-shell {
    --desktop-table-min-h: min(560px, calc(var(--visible-vh, 100dvh) - var(--topbar-h, 64px) - var(--actions-h, 86px) - 18px));
    gap: clamp(5px, .8dvh, 10px) !important;
    grid-template-rows: var(--topbar-h, 64px) minmax(0, 1fr) var(--actions-h, 86px) !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: clamp(5px, .8dvh, 9px) clamp(8px, 1vw, 16px) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .table-scene {
    align-self: center !important;
    height: min(100%, calc(var(--visible-vh, 100dvh) - var(--topbar-h, 64px) - var(--actions-h, 86px) - 18px)) !important;
    justify-self: center !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: visible !important;
    width: min(100%, calc((var(--visible-vh, 100dvh) - var(--topbar-h, 64px) - var(--actions-h, 86px) - 18px) * 1.92)) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .poker-table {
    height: min(52%, calc(100% - 210px)) !important;
    left: 50% !important;
    max-height: calc(100% - 210px) !important;
    max-width: 94% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: min(76%, calc((100% - 210px) * 2.55)) !important;
  }
}

/* Lobby branding only: replace the test marker with a compact logo lockup. */
body.in-lobby .lobby-top {
  box-sizing: border-box !important;
  height: 60px !important;
  min-height: 60px !important;
  overflow: visible !important;
  padding: 2px 1rem !important;
}

body.in-lobby .lobby-brand {
  align-items: center !important;
  column-gap: .75rem !important;
  display: grid !important;
  grid-template-columns: 70px minmax(0, 1fr) !important;
  min-width: 0 !important;
  overflow: visible !important;
}

body.in-lobby .lobby-logo-row {
  display: contents !important;
}

body.in-lobby .lobby-logo {
  display: block !important;
  grid-column: 1 !important;
  grid-row: 1 / 3 !important;
  height: 64px !important;
  max-height: 64px !important;
  object-fit: contain !important;
  overflow: visible !important;
  width: auto !important;
  z-index: 3 !important;
}

body.in-lobby .lobby-logo-row .eyebrow {
  grid-column: 2 !important;
  grid-row: 2 !important;
  line-height: 1 !important;
  margin: 0 !important;
}

body.in-lobby .lobby-brand h1 {
  grid-column: 2 !important;
  grid-row: 1 !important;
  font-size: clamp(1rem, 1.6vw, 1.32rem) !important;
  line-height: 1 !important;
  margin: 0 !important;
}

/* Single UI polish pass: fixed table-button visibility and top-toolbar consistency. */
body:not(.in-lobby) .game-stage .dealer-chip,
body:not(.in-lobby) .game-stage .blind-chip {
  align-items: center !important;
  box-sizing: border-box !important;
  display: grid !important;
  height: clamp(18px, 2.55dvh, 28px) !important;
  justify-items: center !important;
  line-height: 1 !important;
  pointer-events: none !important;
  transform: translate(-50%, -50%) !important;
  width: clamp(18px, 2.55dvh, 28px) !important;
  z-index: 95 !important;
}

body:not(.in-lobby) .game-stage .dealer-chip {
  border: 1px solid rgba(20, 28, 48, .28) !important;
  box-shadow: 0 8px 18px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.72) inset !important;
  font-size: clamp(9px, 1.35dvh, 13px) !important;
}

body:not(.in-lobby) .game-stage .blind-chip {
  box-shadow: 0 8px 18px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.56) inset !important;
  font-size: clamp(7px, 1.05dvh, 10px) !important;
}

body:not(.in-lobby) .game-stage .score-strip {
  align-items: center !important;
}

body:not(.in-lobby) .game-stage .score-strip #chatButton,
body:not(.in-lobby) .game-stage .score-strip #lobbyButton,
body:not(.in-lobby) .game-stage .score-strip #oddsButton,
body:not(.in-lobby) .game-stage .score-strip #howButton,
body:not(.in-lobby) .game-stage .score-strip #fullscreenButton,
body:not(.in-lobby) .game-stage .score-strip #sitOutButton,
body:not(.in-lobby) .game-stage .score-strip #standUpButton,
body:not(.in-lobby) .game-stage .score-strip #menuButton,
body:not(.in-lobby) .game-stage .score-strip #handHistoryButton {
  align-items: center !important;
  appearance: none !important;
  border-radius: 8px !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  font-size: clamp(10px, 1.05vw, 14px) !important;
  font-weight: 850 !important;
  height: clamp(28px, 4.2dvh, 36px) !important;
  justify-content: center !important;
  line-height: 1 !important;
  margin: 0 !important;
  min-height: clamp(28px, 4.2dvh, 36px) !important;
  padding: 0 clamp(9px, 1vw, 14px) !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}

body:not(.in-lobby) .game-stage .score-strip #chatButton .chat-badge {
  margin-left: .35rem !important;
}

body:not(.in-lobby) .game-stage .message-log.history-focus {
  box-shadow: 0 0 0 2px rgba(255,228,92,.72), 0 0 22px rgba(255,228,92,.38) !important;
}

.hand-history-modal {
  background: rgba(2, 6, 23, .56) !important;
  pointer-events: auto !important;
  z-index: 76000 !important;
}

.hand-history-modal:not(.show) {
  display: none !important;
}

.hand-history-card {
  max-width: min(26rem, calc(100vw - 2rem)) !important;
}

.hand-history-list {
  display: grid !important;
  gap: .35rem !important;
  max-height: min(56dvh, 24rem) !important;
  overflow: auto !important;
  text-align: left !important;
}

.hand-history-list div {
  background: rgba(5, 12, 27, .72) !important;
  border: 1px solid rgba(255, 228, 92, .2) !important;
  border-radius: 8px !important;
  color: #f7fbff !important;
  font-size: clamp(.78rem, 1.45dvh, .95rem) !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  padding: .42rem .55rem !important;
}

body:not(.in-lobby) .game-stage .card .card-corner,
body:not(.in-lobby) .game-stage .card .corner {
  align-items: start !important;
  display: flex !important;
  flex-direction: column !important;
  gap: .05em !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto auto !important;
  height: auto !important;
  justify-content: flex-start !important;
  justify-items: start !important;
  line-height: .72 !important;
  min-height: 0 !important;
  place-content: start start !important;
  width: 1.02em !important;
}

body:not(.in-lobby) .game-stage .card .card-corner.top,
body:not(.in-lobby) .game-stage .card .corner.top {
  left: .14em !important;
  top: .12em !important;
}

body:not(.in-lobby) .game-stage .card .card-corner.bottom,
body:not(.in-lobby) .game-stage .card .corner.bottom {
  bottom: .12em !important;
  right: .14em !important;
  transform: rotate(180deg) !important;
}

body:not(.in-lobby) .game-stage .card .card-corner .card-rank,
body:not(.in-lobby) .game-stage .card .card-corner .card-suit,
body:not(.in-lobby) .game-stage .card .corner .card-rank,
body:not(.in-lobby) .game-stage .card .corner .card-suit {
  display: block !important;
  flex: 0 0 auto !important;
  line-height: .72 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: center !important;
  width: 100% !important;
}

body:not(.in-lobby) .game-stage .card .card-corner .card-rank,
body:not(.in-lobby) .game-stage .card .corner .card-rank {
  font-size: .46em !important;
}

body:not(.in-lobby) .game-stage .card .card-corner .card-suit,
body:not(.in-lobby) .game-stage .card .corner .card-suit {
  font-size: .38em !important;
}

body:not(.in-lobby) .game-stage .card .clean-card-face,
body:not(.in-lobby) .game-stage .card .face {
  inset: 32% 17% 14% !important;
  top: 32% !important;
}

body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage {
  --final-board-card-w: clamp(2.36rem, 6vw, 5.84rem);
  --final-board-card-h: clamp(3.3rem, 8.4vw, 8.18rem);
  --final-board-card-font: clamp(.93rem, 2.11vw, 2.12rem);
}

body:not(.in-lobby) .game-stage .result-banner {
  top: 53% !important;
}

@media (orientation: landscape) and (max-height: 760px) {
  body:not(.in-lobby) .game-stage .result-banner {
    top: 51% !important;
  }
}

body.tablet-landscape:not(.in-lobby) .game-stage #communityCards.community .card:not(.back)::before,
body.tablet-landscape:not(.in-lobby) .game-stage #communityCards.community .card:not(.back)::after,
body.tablet-landscape:not(.in-lobby) .game-stage .community .card:not(.back)::before,
body.tablet-landscape:not(.in-lobby) .game-stage .community .card:not(.back)::after {
  display: none !important;
}

@media (hover: hover) and (pointer: fine) and (min-width: 901px) {
  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .game-shell {
    padding-left: clamp(3px, .45vw, 8px) !important;
    padding-right: clamp(3px, .45vw, 8px) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .table-scene {
    width: min(100%, calc((var(--visible-vh, 100dvh) - var(--topbar-h, 64px) - var(--actions-h, 86px) - 18px) * 2.08)) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .poker-table {
    max-width: 98% !important;
    width: min(84%, calc((100% - 190px) * 2.72)) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-left-lower,
  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-left-upper {
    left: 4% !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-right-lower,
  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-right-upper {
    right: 4% !important;
  }
}

/* Seat-owned table markers: D/SB/BB move with the real player seat DOM. */
body:not(.in-lobby) .game-stage .seat {
  overflow: visible !important;
}

body:not(.in-lobby) .game-stage .seat-marker-slot {
  align-items: center !important;
  display: inline-flex !important;
  gap: 3px !important;
  justify-content: center !important;
  min-height: clamp(18px, 2.55dvh, 28px) !important;
  min-width: clamp(18px, 2.55dvh, 28px) !important;
  pointer-events: none !important;
  position: absolute !important;
  z-index: 280 !important;
}

body:not(.in-lobby) .game-stage .seat-bottom .seat-marker-slot {
  left: 50% !important;
  top: -10px !important;
  transform: translate(-50%, -100%) !important;
}

body:not(.in-lobby) .game-stage .seat-bottom-left .seat-marker-slot {
  right: -14px !important;
  top: 10px !important;
  transform: translate(100%, -50%) !important;
}

body:not(.in-lobby) .game-stage .seat-bottom-right .seat-marker-slot {
  left: -14px !important;
  top: 10px !important;
  transform: translate(-100%, -50%) !important;
}

body:not(.in-lobby) .game-stage .seat-left-lower .seat-marker-slot,
body:not(.in-lobby) .game-stage .seat-left-upper .seat-marker-slot {
  right: -14px !important;
  top: 50% !important;
  transform: translate(100%, -50%) !important;
}

body:not(.in-lobby) .game-stage .seat-right-lower .seat-marker-slot,
body:not(.in-lobby) .game-stage .seat-right-upper .seat-marker-slot {
  left: -14px !important;
  top: 50% !important;
  transform: translate(-100%, -50%) !important;
}

body:not(.in-lobby) .game-stage .seat-top .seat-marker-slot {
  bottom: -10px !important;
  left: 50% !important;
  transform: translate(-50%, 100%) !important;
}

body:not(.in-lobby) .game-stage .seat-top-left .seat-marker-slot {
  bottom: -10px !important;
  right: 2px !important;
  transform: translate(100%, 100%) !important;
}

body:not(.in-lobby) .game-stage .seat-top-right .seat-marker-slot {
  bottom: -10px !important;
  left: 2px !important;
  transform: translate(-100%, 100%) !important;
}

body:not(.in-lobby) .game-stage .seat-marker-slot .dealer-chip,
body:not(.in-lobby) .game-stage .seat-marker-slot .blind-chip {
  flex: 0 0 auto !important;
  height: clamp(18px, 2.55dvh, 28px) !important;
  left: auto !important;
  position: static !important;
  top: auto !important;
  transform: none !important;
  width: clamp(18px, 2.55dvh, 28px) !important;
  z-index: 281 !important;
}

body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-top .seat-marker-slot .big-blind,
body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-top-left .seat-marker-slot .big-blind,
body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-top-right .seat-marker-slot .big-blind {
  transform: translateY(10px) !important;
}

body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-bottom .seat-marker-slot .big-blind,
body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-bottom-left .seat-marker-slot .big-blind,
body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-bottom-right .seat-marker-slot .big-blind {
  transform: translateY(-6px) !important;
}

body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-left-lower .seat-marker-slot .big-blind,
body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-left-upper .seat-marker-slot .big-blind {
  transform: translateX(8px) !important;
}

body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-right-lower .seat-marker-slot .big-blind,
body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-right-upper .seat-marker-slot .big-blind {
  transform: translateX(-8px) !important;
}

body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-marker-slot .small-blind,
body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-marker-slot .big-blind {
  transform: none !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom .seat-marker-slot .big-blind { transform: translateY(6px) !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom-left .seat-marker-slot .big-blind { transform: translate(-4px, 5px) !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom-right .seat-marker-slot .big-blind { transform: translate(4px, 5px) !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-left-lower .seat-marker-slot .big-blind,
body.tablet-landscape:not(.in-lobby) .game-stage .seat-left-upper .seat-marker-slot .big-blind { transform: translateX(-6px) !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-right-lower .seat-marker-slot .big-blind,
body.tablet-landscape:not(.in-lobby) .game-stage .seat-right-upper .seat-marker-slot .big-blind { transform: translateX(6px) !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-top .seat-marker-slot .big-blind { transform: translateY(-6px) !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-top-left .seat-marker-slot .big-blind { transform: translate(-4px, -5px) !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-top-right .seat-marker-slot .big-blind { transform: translate(4px, -5px) !important; }

body.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom .seat-marker-slot .small-blind { transform: translateY(6px) !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom-left .seat-marker-slot .small-blind { transform: translate(-4px, 5px) !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom-right .seat-marker-slot .small-blind { transform: translate(4px, 5px) !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-left-lower .seat-marker-slot .small-blind,
body.tablet-landscape:not(.in-lobby) .game-stage .seat-left-upper .seat-marker-slot .small-blind { transform: translateX(-6px) !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-right-lower .seat-marker-slot .small-blind,
body.tablet-landscape:not(.in-lobby) .game-stage .seat-right-upper .seat-marker-slot .small-blind { transform: translateX(6px) !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-top .seat-marker-slot .small-blind { transform: translateY(-6px) !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-top-left .seat-marker-slot .small-blind { transform: translate(-4px, -5px) !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .seat-top-right .seat-marker-slot .small-blind { transform: translate(4px, -5px) !important; }

@media (orientation: landscape) and (max-height: 520px), (max-width: 760px) {
  body:not(.in-lobby) .game-stage .score-strip #chatButton,
  body:not(.in-lobby) .game-stage .score-strip #lobbyButton,
  body:not(.in-lobby) .game-stage .score-strip #oddsButton,
  body:not(.in-lobby) .game-stage .score-strip #howButton,
  body:not(.in-lobby) .game-stage .score-strip #fullscreenButton,
  body:not(.in-lobby) .game-stage .score-strip #sitOutButton,
  body:not(.in-lobby) .game-stage .score-strip #standUpButton,
  body:not(.in-lobby) .game-stage .score-strip #menuButton,
  body:not(.in-lobby) .game-stage .score-strip #handHistoryButton {
    border-radius: 7px !important;
    font-size: clamp(8px, 2dvh, 11px) !important;
    height: clamp(24px, 5.8dvh, 30px) !important;
    min-height: clamp(24px, 5.8dvh, 30px) !important;
    padding: 0 clamp(6px, 1.4dvw, 10px) !important;
  }
}

/* Final card polish: standard poker-card corner indexes and clear street label. */
body:not(.in-lobby) .game-stage .card .card-corner,
body:not(.in-lobby) .game-stage .card .corner {
  align-items: center !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  gap: .015em !important;
  height: auto !important;
  justify-content: flex-start !important;
  line-height: 1 !important;
  min-width: .72em !important;
  pointer-events: none !important;
  position: absolute !important;
  text-align: center !important;
  width: auto !important;
  z-index: 3 !important;
}

body:not(.in-lobby) .game-stage .card .card-corner.top,
body:not(.in-lobby) .game-stage .card .corner.top {
  left: .10em !important;
  top: .08em !important;
  transform: none !important;
}

body:not(.in-lobby) .game-stage .card .card-corner.bottom,
body:not(.in-lobby) .game-stage .card .corner.bottom {
  bottom: .08em !important;
  right: .10em !important;
  transform: rotate(180deg) !important;
  transform-origin: center center !important;
}

body:not(.in-lobby) .game-stage .card .card-corner .card-rank,
body:not(.in-lobby) .game-stage .card .corner .card-rank,
body:not(.in-lobby) .game-stage .card .card-corner .card-suit,
body:not(.in-lobby) .game-stage .card .corner .card-suit {
  display: block !important;
  flex: 0 0 auto !important;
  line-height: .9 !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
  text-align: center !important;
  width: 100% !important;
}

body:not(.in-lobby) .game-stage .card .card-corner .card-rank,
body:not(.in-lobby) .game-stage .card .corner .card-rank {
  font-size: .46em !important;
}

body:not(.in-lobby) .game-stage .card .card-corner .card-suit,
body:not(.in-lobby) .game-stage .card .corner .card-suit {
  font-size: .36em !important;
}

body:not(.in-lobby) .game-stage .result-banner {
  bottom: auto !important;
  left: 50% !important;
  top: calc(43% + (var(--final-board-card-h, 7rem) / 2) + clamp(12px, 1.6vw, 22px)) !important;
  transform: translate(-50%, 0) !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .result-banner,
body.phone-landscape:not(.in-lobby) .game-stage .result-banner,
body.tablet-landscape:not(.in-lobby) .game-stage .result-banner {
  top: calc(50% + (var(--final-board-card-h, 72px) / 2) + 8px) !important;
  transform: translate(-50%, 0) !important;
}

/* Firefox-safe chip positions: avoid newer calc() modulo/division syntax. */
body:not(.in-lobby) .game-stage .chip-stack:not(.bankroll) .bet-chip:nth-child(1) { left: .14rem !important; top: .26rem !important; }
body:not(.in-lobby) .game-stage .chip-stack:not(.bankroll) .bet-chip:nth-child(2) { left: .56rem !important; top: .26rem !important; }
body:not(.in-lobby) .game-stage .chip-stack:not(.bankroll) .bet-chip:nth-child(3) { left: .98rem !important; top: .26rem !important; }
body:not(.in-lobby) .game-stage .chip-stack:not(.bankroll) .bet-chip:nth-child(4) { left: 1.40rem !important; top: .26rem !important; }
body:not(.in-lobby) .game-stage .chip-stack:not(.bankroll) .bet-chip:nth-child(5) { left: .14rem !important; top: .14rem !important; }
body:not(.in-lobby) .game-stage .chip-stack:not(.bankroll) .bet-chip:nth-child(6) { left: .56rem !important; top: .14rem !important; }
body:not(.in-lobby) .game-stage .chip-stack:not(.bankroll) .bet-chip:nth-child(7) { left: .98rem !important; top: .14rem !important; }
body:not(.in-lobby) .game-stage .chip-stack:not(.bankroll) .bet-chip:nth-child(8) { left: 1.40rem !important; top: .14rem !important; }

body:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(1) { left: .16rem !important; top: .92rem !important; }
body:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(2) { left: .86rem !important; top: .92rem !important; }
body:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(3) { left: 1.56rem !important; top: .92rem !important; }
body:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(4) { left: .50rem !important; top: .58rem !important; }
body:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(5) { left: 1.20rem !important; top: .58rem !important; }
body:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(6) { left: .84rem !important; top: .24rem !important; }
body:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(7) { left: 1.54rem !important; top: .24rem !important; }

body.tablet-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(1),
body.mobile-table-mode:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(1),
body.phone-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(1) { left: .12rem !important; top: .72rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(2),
body.mobile-table-mode:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(2),
body.phone-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(2) { left: .68rem !important; top: .72rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(3),
body.mobile-table-mode:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(3),
body.phone-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(3) { left: 1.24rem !important; top: .72rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(4),
body.mobile-table-mode:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(4),
body.phone-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(4) { left: .40rem !important; top: .46rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(5),
body.mobile-table-mode:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(5),
body.phone-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(5) { left: .96rem !important; top: .46rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(6),
body.mobile-table-mode:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(6),
body.phone-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(6) { left: .68rem !important; top: .20rem !important; }
body.tablet-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(7),
body.mobile-table-mode:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(7),
body.phone-landscape:not(.in-lobby) .game-stage .chip-stack.bankroll .bet-chip:nth-child(7) { left: 1.24rem !important; top: .20rem !important; }

/* Firefox viewport-width normalization only. Firefox was preserving a narrow
   app wrapper while the browser viewport continued to the right. */
@-moz-document url-prefix() {
  html,
  body {
    max-width: none !important;
    min-width: 100% !important;
    width: 100% !important;
  }

  body.in-lobby {
    overflow-x: hidden !important;
  }

  body.in-lobby .lobby-screen {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: none !important;
    width: 100vw !important;
  }

  body:not(.in-lobby) .app-viewport,
  body:not(.in-lobby) .game-viewport,
  body:not(.in-lobby) .game-table-screen,
  body:not(.in-lobby) .game-fullscreen-shell,
  body:not(.in-lobby) .poker-table-wrapper,
  body:not(.in-lobby) .game-stage {
    box-sizing: border-box !important;
    left: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: none !important;
    min-width: 100vw !important;
    right: auto !important;
    width: 100vw !important;
  }

  body:not(.in-lobby) .game-shell {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: none !important;
    width: 100% !important;
  }

  body:not(.in-lobby) .table-scene {
    justify-self: stretch !important;
    max-width: none !important;
    width: 100% !important;
  }
}

/* Firefox full-width layout guard. If Firefox reports a narrow visual viewport
   in a wide desktop window, JS adds this class so the app uses the real window
   width without entering the mobile/tablet table layouts. */
body.firefox-fullwidth,
body.firefox-fullwidth .app-viewport,
body.firefox-fullwidth .game-viewport {
  box-sizing: border-box !important;
  left: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: none !important;
  min-width: var(--firefox-layout-w, 100vw) !important;
  right: auto !important;
  width: var(--firefox-layout-w, 100vw) !important;
}

body.firefox-fullwidth {
  overflow-x: hidden !important;
}

body.firefox-fullwidth.in-lobby .lobby-screen {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: none !important;
  min-width: 0 !important;
  width: var(--firefox-layout-w, 100vw) !important;
}

body.firefox-fullwidth:not(.in-lobby) .app-viewport,
body.firefox-fullwidth:not(.in-lobby) .game-viewport {
  align-items: stretch !important;
  display: block !important;
  height: var(--visible-vh, 100dvh) !important;
  justify-content: normal !important;
  max-height: var(--visible-vh, 100dvh) !important;
  overflow: hidden !important;
  position: fixed !important;
}

body.firefox-fullwidth:not(.in-lobby) .game-table-screen,
body.firefox-fullwidth:not(.in-lobby) .game-fullscreen-shell,
body.firefox-fullwidth:not(.in-lobby) .poker-table-wrapper,
body.firefox-fullwidth:not(.in-lobby) .game-stage {
  box-sizing: border-box !important;
  height: var(--visible-vh, 100dvh) !important;
  inset: 0 !important;
  left: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-height: var(--visible-vh, 100dvh) !important;
  max-width: none !important;
  min-width: 0 !important;
  overflow: hidden !important;
  position: relative !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  width: 100% !important;
}

body.firefox-fullwidth:not(.in-lobby) .game-stage .game-shell {
  grid-template-columns: minmax(0, 1fr) !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: none !important;
  min-width: 0 !important;
  width: 100% !important;
}

body.firefox-fullwidth:not(.in-lobby) .game-stage .table-scene,
body.firefox-fullwidth:not(.in-lobby) .game-stage .top-bar,
body.firefox-fullwidth:not(.in-lobby) .game-stage .score-strip {
  max-width: none !important;
  min-width: 0 !important;
  width: 100% !important;
}

body.firefox-fullwidth.mobile-table-mode:not(.in-lobby) .game-stage .game-shell,
body.firefox-fullwidth.phone-landscape:not(.in-lobby) .game-stage .game-shell,
body.firefox-fullwidth.tablet-landscape:not(.in-lobby) .game-stage .game-shell {
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
}

/* Final iPad/lobby polish only. Keep these scoped away from laptop table mode. */
body.in-lobby .mini-table {
  background:
    radial-gradient(ellipse at 50% 48%, var(--felt-light), var(--felt) 50%, var(--rail) 72%),
    linear-gradient(135deg, rgba(13,25,64,.94), rgba(35,14,82,.9)) !important;
  border-color: rgba(194, 181, 146, .88) !important;
  box-shadow: inset 0 0 0 6px rgba(9, 12, 39, .82), inset 0 0 30px rgba(0,0,0,.36), 0 0 34px rgba(39,231,255,.36) !important;
}

body.in-lobby .mini-table::before {
  background: radial-gradient(ellipse at 50% 50%, var(--felt-light), rgba(8,24,38,.16) 58%, rgba(5,8,21,.42) 100%) !important;
  opacity: .34 !important;
  border: 1px solid rgba(255,235,150,.18) !important;
  border-radius: 999px !important;
  content: "" !important;
  inset: .85rem 1.25rem !important;
  position: absolute !important;
}

body.in-lobby .mini-table i {
  background: linear-gradient(145deg, #ffffff 0%, #f8f5eb 72%, #ebe5d6 100%) !important;
  border: 1px solid rgba(22, 27, 42, .42) !important;
  border-radius: 5px !important;
  box-shadow: 0 9px 16px rgba(0,0,0,.42), inset 0 0 0 1px rgba(255,255,255,.72) !important;
  color: #151923 !important;
  display: block !important;
  height: 3.75rem !important;
  position: absolute !important;
  top: 47% !important;
  transform: translateY(-50%) !important;
  width: 2.58rem !important;
  z-index: 2 !important;
}

body.in-lobby .mini-table i::before {
  color: inherit !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: 950 !important;
}

body.in-lobby .mini-table i::after {
  font-family: "Segoe UI Symbol", "Apple Symbols", "Noto Sans Symbols", Arial, sans-serif !important;
  font-size: .8rem !important;
  font-weight: 900 !important;
  left: .2rem !important;
  line-height: 1 !important;
  position: absolute !important;
  top: .96rem !important;
}

body.in-lobby .mini-table i:nth-child(1)::before { content: "A" !important; }
body.in-lobby .mini-table i:nth-child(1)::after { color: #c41731 !important; content: "\2665" !important; }
body.in-lobby .mini-table i:nth-child(2)::before { content: "K" !important; }
body.in-lobby .mini-table i:nth-child(2)::after { content: "\2660" !important; }
body.in-lobby .mini-table i:nth-child(3)::before { color: #c41731 !important; content: "Q" !important; }
body.in-lobby .mini-table i:nth-child(3)::after { color: #c41731 !important; content: "\2666" !important; }
body.in-lobby .mini-table i:nth-child(4)::before { content: "J" !important; }
body.in-lobby .mini-table i:nth-child(4)::after { content: "\2663" !important; }
body.in-lobby .mini-table i:nth-child(5)::before { color: #c41731 !important; content: "10" !important; }
body.in-lobby .mini-table i:nth-child(5)::after { color: #c41731 !important; content: "\2665" !important; }

body.in-lobby .table-icon {
  background:
    radial-gradient(ellipse at 50% 50%, rgba(69,255,177,.9), rgba(8,123,80,.96) 56%, rgba(8,47,45,.98) 76%),
    linear-gradient(160deg, #215cff, #07184f) !important;
  border-color: rgba(18,13,76,.92) !important;
  box-shadow: inset 0 0 15px rgba(0,0,0,.38), 0 0 18px rgba(39,231,255,.32) !important;
}

body.in-lobby .table-icon span,
body.in-lobby .table-icon::before,
body.in-lobby .table-icon::after {
  background: rgba(5,12,27,.88) !important;
  border: 1px solid rgba(255,228,92,.24) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  height: .38rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: .38rem !important;
}

body.in-lobby .table-icon span { left: 1.34rem !important; }
body.in-lobby .table-icon::before { left: 1.82rem !important; }
body.in-lobby .table-icon::after { left: 2.30rem !important; }

body.mobile-table-mode:not(.in-lobby) .game-stage .result-banner,
body.phone-landscape:not(.in-lobby) .game-stage .result-banner,
body.tablet-landscape:not(.in-lobby) .game-stage .result-banner,
body.mobile-table-mode:not(.in-lobby) .game-stage .reveal-overlay,
body.mobile-table-mode:not(.in-lobby) .game-stage .reveal-overlay.show,
body.phone-landscape:not(.in-lobby) .game-stage .reveal-overlay,
body.phone-landscape:not(.in-lobby) .game-stage .reveal-overlay.show,
body.tablet-landscape:not(.in-lobby) .game-stage .reveal-overlay,
body.tablet-landscape:not(.in-lobby) .game-stage .reveal-overlay.show {
  bottom: calc(var(--mobile-action-h, 54px) + var(--mobile-local-card-h, 76px) + clamp(10px, 1.8dvh, 18px)) !important;
  left: 50% !important;
  max-width: min(26rem, 62vw) !important;
  pointer-events: none !important;
  right: auto !important;
  top: auto !important;
  transform: translate(-50%, 0) !important;
  white-space: normal !important;
  z-index: 190 !important;
}

body.mobile-table-mode:not(.in-lobby) .game-stage .turn-callout,
body.phone-landscape:not(.in-lobby) .game-stage .turn-callout,
body.tablet-landscape:not(.in-lobby) .game-stage .turn-callout {
  bottom: calc(var(--mobile-action-h, 54px) + var(--mobile-local-card-h, 76px) + clamp(10px, 1.8dvh, 18px)) !important;
  left: 50% !important;
  max-width: min(26rem, 62vw) !important;
  pointer-events: none !important;
  top: auto !important;
  transform: translate(-50%, 0) !important;
  white-space: normal !important;
  z-index: 190 !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .score-strip,
body.mobile-table-mode.tablet-landscape:not(.in-lobby) .game-stage .score-strip {
  gap: clamp(4px, .7vw, 8px) !important;
}

body.tablet-landscape:not(.in-lobby) .game-stage .score-strip span,
body.tablet-landscape:not(.in-lobby) .game-stage .score-strip button,
body.mobile-table-mode.tablet-landscape:not(.in-lobby) .game-stage .score-strip span,
body.mobile-table-mode.tablet-landscape:not(.in-lobby) .game-stage .score-strip button {
  font-size: clamp(9px, 1.25vw, 13px) !important;
  min-height: clamp(24px, 3.8dvh, 34px) !important;
  padding-left: clamp(5px, .8vw, 10px) !important;
  padding-right: clamp(5px, .8vw, 10px) !important;
}

body.firefox-fullwidth.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom,
body.firefox-fullwidth.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom {
  bottom: 2% !important;
}

body.firefox-fullwidth.tablet-landscape:not(.in-lobby) .game-stage .status-pill,
body.firefox-fullwidth.mobile-table-mode:not(.in-lobby) .game-stage .status-pill,
body.firefox-fullwidth.tablet-landscape:not(.in-lobby) .game-stage .hand-readout,
body.firefox-fullwidth.mobile-table-mode:not(.in-lobby) .game-stage .hand-readout {
  margin-top: 2px !important;
}

body.ios-firefox.tablet-landscape:not(.in-lobby) .game-stage .score-strip,
body.ios-firefox.mobile-table-mode:not(.in-lobby) .game-stage .score-strip {
  gap: clamp(4px, .7vw, 8px) !important;
}

body.ios-firefox.tablet-landscape:not(.in-lobby) .game-stage .score-strip span,
body.ios-firefox.tablet-landscape:not(.in-lobby) .game-stage .score-strip button,
body.ios-firefox.mobile-table-mode:not(.in-lobby) .game-stage .score-strip span,
body.ios-firefox.mobile-table-mode:not(.in-lobby) .game-stage .score-strip button {
  font-size: clamp(9px, 1.25vw, 13px) !important;
  min-height: clamp(24px, 3.8dvh, 34px) !important;
  padding-left: clamp(5px, .8vw, 10px) !important;
  padding-right: clamp(5px, .8vw, 10px) !important;
}

body.ios-firefox.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom,
body.ios-firefox.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom {
  bottom: 2% !important;
}

body.ios-firefox.tablet-landscape:not(.in-lobby) .game-stage .status-pill,
body.ios-firefox.mobile-table-mode:not(.in-lobby) .game-stage .status-pill,
body.ios-firefox.tablet-landscape:not(.in-lobby) .game-stage .hand-readout,
body.ios-firefox.mobile-table-mode:not(.in-lobby) .game-stage .hand-readout {
  margin-top: 2px !important;
}

/* Laptop restoration only: avoid mobile/tablet modes and restore the taller
   oval proportions from the approved desktop layout. */
@media (hover: hover) and (pointer: fine) and (min-width: 901px) {
  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .table-scene {
    width: min(100%, calc((var(--visible-vh, 100dvh) - var(--topbar-h, 64px) - var(--actions-h, 86px) - 18px) * 1.98)) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .poker-table {
    height: min(61%, calc(100% - 178px)) !important;
    left: 50% !important;
    max-height: calc(100% - 178px) !important;
    max-width: 92% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: min(78%, calc((100% - 178px) * 2.16)) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-left-lower,
  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-left-upper {
    left: 3% !important;
    right: auto !important;
    transform: translateY(-50%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-right-lower,
  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-right-upper {
    left: auto !important;
    right: 3% !important;
    transform: translateY(-50%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-top-left {
    left: 30% !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-top-right {
    left: 70% !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-bottom-left {
    bottom: 0 !important;
    left: 27% !important;
    right: auto !important;
    top: auto !important;
    transform: translateX(-50%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-bottom-right {
    bottom: 0 !important;
    left: 73% !important;
    right: auto !important;
    top: auto !important;
    transform: translateX(-50%) !important;
  }
}

body.in-lobby .lobby-featured-art {
  display: block !important;
  filter: drop-shadow(0 18px 30px rgba(0,0,0,.34)) !important;
  height: auto !important;
  margin: 0 auto !important;
  max-height: 13.5rem !important;
  object-fit: contain !important;
  width: min(30rem, 100%) !important;
}

body.in-lobby .mini-table .lobby-preview-card {
  background: #f9f6ee !important;
  border: 1px solid rgba(8,13,30,.55) !important;
  border-radius: 4px !important;
  box-shadow: 0 7px 12px rgba(0,0,0,.38), inset 0 0 0 1px rgba(255,255,255,.72) !important;
  color: #151923 !important;
  display: block !important;
  height: 3.25rem !important;
  overflow: hidden !important;
  position: absolute !important;
  top: 46% !important;
  transform: translateY(-50%) !important;
  width: 2.08rem !important;
  z-index: 2 !important;
}

body.in-lobby .mini-table .lobby-preview-card b,
body.in-lobby .mini-table .lobby-preview-card em {
  display: block !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-style: normal !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  position: absolute !important;
  text-align: center !important;
  text-shadow: none !important;
}

body.in-lobby .mini-table .lobby-preview-card b {
  font-size: .95rem !important;
  left: 0 !important;
  top: .22rem !important;
  width: 100% !important;
}

body.in-lobby .mini-table .lobby-preview-card em {
  font-family: "Segoe UI Symbol", "Apple Symbols", "Noto Sans Symbols", Arial, sans-serif !important;
  font-size: 1.12rem !important;
  left: 0 !important;
  top: 1.55rem !important;
  width: 100% !important;
}

body.in-lobby .mini-table .lobby-preview-card.red b,
body.in-lobby .mini-table .lobby-preview-card.red em {
  color: #c41731 !important;
}

body.in-lobby .mini-table .lobby-preview-card:nth-child(1) { left: 31% !important; transform: translateY(-50%) rotate(-4deg) !important; }
body.in-lobby .mini-table .lobby-preview-card:nth-child(2) { left: 40% !important; transform: translateY(-50%) rotate(-2deg) !important; }
body.in-lobby .mini-table .lobby-preview-card:nth-child(3) { left: 49% !important; transform: translateY(-50%) !important; }
body.in-lobby .mini-table .lobby-preview-card:nth-child(4) { left: 58% !important; transform: translateY(-50%) rotate(2deg) !important; }
body.in-lobby .mini-table .lobby-preview-card:nth-child(5) { left: 67% !important; transform: translateY(-50%) rotate(4deg) !important; }

body.in-lobby .mini-table i {
  display: block !important;
}

body.in-lobby .table-icon {
  background:
    radial-gradient(ellipse at 50% 48%, rgba(80,255,185,.95), rgba(12,132,86,.98) 54%, rgba(7,53,49,.98) 70%, rgba(6,12,31,.98) 72%),
    linear-gradient(140deg, rgba(255,220,88,.86), rgba(30,22,78,.9)) !important;
  border-color: rgba(216,190,118,.72) !important;
  box-shadow: inset 0 0 0 5px rgba(198,185,151,.92), inset 0 0 18px rgba(0,0,0,.42), 0 0 18px rgba(39,231,255,.25) !important;
  display: block !important;
  object-fit: contain !important;
}

body.in-lobby .table-icon span,
body.in-lobby .table-icon::before,
body.in-lobby .table-icon::after {
  background: rgba(5,12,27,.88) !important;
  border: 1px solid rgba(255,228,92,.24) !important;
  border-radius: 999px !important;
  height: .36rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: .36rem !important;
}

@media (hover: hover) and (pointer: fine) and (min-width: 901px) {
  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-left-upper {
    left: 3% !important;
    right: auto !important;
    top: 30% !important;
    transform: translateY(-50%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-left-lower {
    left: 3% !important;
    right: auto !important;
    top: 62% !important;
    transform: translateY(-50%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-right-upper {
    left: auto !important;
    right: 3% !important;
    top: 30% !important;
    transform: translateY(-50%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-right-lower {
    left: auto !important;
    right: 3% !important;
    top: 62% !important;
    transform: translateY(-50%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-bottom {
    bottom: 0 !important;
    left: 50% !important;
    right: auto !important;
    top: auto !important;
    transform: translateX(-50%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-bottom-left {
    bottom: 0 !important;
    left: 27% !important;
    right: auto !important;
    top: auto !important;
    transform: translateX(-50%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-bottom-right {
    bottom: 0 !important;
    left: 73% !important;
    right: auto !important;
    top: auto !important;
    transform: translateX(-50%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .player-bet-stack {
    filter: drop-shadow(0 4px 7px rgba(0,0,0,.46)) !important;
    z-index: 132 !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .player-bet-stack span {
    background: rgba(7,12,26,.94) !important;
    border-color: rgba(255,228,92,.46) !important;
    box-shadow: 0 5px 12px rgba(0,0,0,.36) !important;
    font-size: .68rem !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-bottom .seat-marker-slot {
    left: 50% !important;
    top: 2px !important;
    transform: translate(-50%, -100%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-bottom-left .seat-marker-slot,
  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-top-left .seat-marker-slot {
    right: 2px !important;
    top: 50% !important;
    transform: translate(82%, -50%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-bottom-right .seat-marker-slot,
  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-top-right .seat-marker-slot {
    left: 2px !important;
    top: 50% !important;
    transform: translate(-82%, -50%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-left-lower .seat-marker-slot,
  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-left-upper .seat-marker-slot {
    right: 2px !important;
    top: 50% !important;
    transform: translate(82%, -50%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-right-lower .seat-marker-slot,
  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-right-upper .seat-marker-slot {
    left: 2px !important;
    top: 50% !important;
    transform: translate(-82%, -50%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-top .seat-marker-slot {
    bottom: 2px !important;
    left: 50% !important;
    transform: translate(-50%, 100%) !important;
  }

  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-top-left .seat-marker-slot,
  body:not(.in-lobby):not(.mobile-table-mode):not(.phone-landscape):not(.tablet-landscape) .game-stage .seat-top-right .seat-marker-slot {
    bottom: auto !important;
  }
}

/* Laptop in-app fullscreen only: enlarge the table without native browser fullscreen. */
@media (min-width: 901px) and (pointer: fine) {
  body.fullscreen-active:not(.in-lobby):not(.phone-landscape):not(.tablet-landscape) {
    --laptop-fullscreen-table-scale: 1.12;
  }

  body.fullscreen-active:not(.in-lobby):not(.phone-landscape):not(.tablet-landscape) .game-stage {
    height: 100vh !important;
    overflow: visible !important;
    width: 100vw !important;
  }

  body.fullscreen-active:not(.in-lobby):not(.phone-landscape):not(.tablet-landscape) .game-shell {
    gap: 4px !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    overflow: visible !important;
    padding: 2px !important;
  }

  body.fullscreen-active:not(.in-lobby):not(.phone-landscape):not(.tablet-landscape) .table-scene {
    align-self: center !important;
    aspect-ratio: 16 / 9 !important;
    height: auto !important;
    justify-self: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-height: calc(100vh - 132px) !important;
    max-width: min(78vw, 124vh) !important;
    min-height: 0 !important;
    overflow: visible !important;
    transform: scale(var(--laptop-fullscreen-table-scale)) !important;
    transform-origin: center center !important;
    width: min(78vw, 124vh) !important;
    z-index: 1 !important;
  }

  body.fullscreen-active:not(.in-lobby):not(.phone-landscape):not(.tablet-landscape) .top-bar,
  body.fullscreen-active:not(.in-lobby):not(.phone-landscape):not(.tablet-landscape) .action-panel {
    position: relative !important;
    z-index: 2 !important;
  }

  body.fullscreen-active:not(.in-lobby):not(.phone-landscape):not(.tablet-landscape) .poker-table {
    height: 52% !important;
    left: 50% !important;
    top: 49% !important;
    transform: translate(-50%, -50%) !important;
    width: 76% !important;
  }
}

/* iPad UI fix pass: preserve lobby structure, shrink Reveal Time, and keep
   table icons as real artwork instead of broken-image placeholders. */
body.in-lobby img.table-icon {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: block !important;
  object-fit: contain !important;
}

@media (pointer: coarse) and (min-width: 768px) and (max-width: 1366px) {
  body:not(.in-lobby) .game-stage .reveal-overlay,
  body:not(.in-lobby) .game-stage .reveal-overlay.show,
  body.mobile-table-mode:not(.in-lobby) .game-stage .reveal-overlay,
  body.mobile-table-mode:not(.in-lobby) .game-stage .reveal-overlay.show,
  body.tablet-landscape:not(.in-lobby) .game-stage .reveal-overlay,
  body.tablet-landscape:not(.in-lobby) .game-stage .reveal-overlay.show {
    bottom: auto !important;
    font-size: clamp(11px, 1.25vw, 16px) !important;
    left: 50% !important;
    line-height: 1.02 !important;
    max-width: min(18rem, 30vw) !important;
    padding: clamp(3px, .5dvh, 6px) clamp(7px, .9vw, 12px) !important;
    right: auto !important;
    top: clamp(70px, 18%, 118px) !important;
    transform: translate(-50%, -50%) !important;
    white-space: normal !important;
  }

  body:not(.in-lobby) .game-stage .reveal-overlay span,
  body.mobile-table-mode:not(.in-lobby) .game-stage .reveal-overlay span,
  body.tablet-landscape:not(.in-lobby) .game-stage .reveal-overlay span {
    font-size: .58em !important;
    line-height: 1.05 !important;
    margin-top: 1px !important;
  }
}

/* Edge tablet polish pass: visual-only readability and asset cleanup. */
#quickSeatButton.gold-button,
.featured-copy button,
.table-card button,
#chatButton.gold-button,
#lobbyButton.gold-button,
#oddsButton.gold-button,
#howButton.gold-button,
#fullscreenButton.gold-button,
#sitOutButton.gold-button,
#standUpButton.gold-button,
#menuButton.gold-button,
#handHistoryButton.gold-button,
body:not(.in-lobby) .game-stage #chatButton.gold-button,
body:not(.in-lobby) .game-stage #lobbyButton.gold-button,
body:not(.in-lobby) .game-stage #oddsButton.gold-button,
body:not(.in-lobby) .game-stage #howButton.gold-button,
body:not(.in-lobby) .game-stage #fullscreenButton.gold-button,
body:not(.in-lobby) .game-stage #sitOutButton.gold-button,
body:not(.in-lobby) .game-stage #standUpButton.gold-button,
body:not(.in-lobby) .game-stage #menuButton.gold-button,
body:not(.in-lobby) .game-stage #handHistoryButton.gold-button,
body.phone-landscape:not(.in-lobby) .game-stage .score-strip button.gold-button,
body.tablet-landscape:not(.in-lobby) .game-stage .score-strip button.gold-button,
body.mobile-table-mode:not(.in-lobby) .game-stage .score-strip button.gold-button {
  color: #171006 !important;
  text-shadow: none !important;
}

#chatButton .chat-badge {
  color: #ffffff !important;
}

body.in-lobby img.table-icon,
body.in-lobby img.table-icon.hot,
body.in-lobby img.table-icon.purple {
  aspect-ratio: 128 / 92 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: block !important;
  height: 3.2rem !important;
  object-fit: contain !important;
  width: 4.45rem !important;
}

body.in-lobby img.table-icon::before,
body.in-lobby img.table-icon::after {
  content: none !important;
  display: none !important;
}

.card:not(.back),
button.card:not(.back),
body:not(.in-lobby) .game-stage .card:not(.back),
body:not(.in-lobby) .game-stage button.card:not(.back),
body:not(.in-lobby) .game-stage .community .card:not(.back),
body:not(.in-lobby) .game-stage .hole-cards .card:not(.back) {
  background:
    linear-gradient(145deg, rgba(255,255,255,.98), rgba(255,255,255,0) 36%),
    linear-gradient(180deg, #ffffff 0%, #fffdfa 58%, #e8edf7 100%) !important;
  border-color: #243047 !important;
  color: #0d1422 !important;
}

.card.red:not(.back),
body:not(.in-lobby) .game-stage .card.red:not(.back) {
  color: #d1162c !important;
}




.chips,
.bet-chip {
  border-color: #ffffff !important;
  box-shadow: 0 2px 5px rgba(0,0,0,.38), inset 0 0 0 1px rgba(255,255,255,.48) !important;
}

.chips {
  background:
    radial-gradient(circle, #ffffff 0 20%, #f5f7fb 21% 33%, transparent 34%),
    conic-gradient(#18a85c 0 12%, #ffffff 12% 20%, #18a85c 20% 38%, #ffffff 38% 46%, #18a85c 46% 64%, #ffffff 64% 72%, #18a85c 72%) !important;
}

.chip-5 {
  background:
    radial-gradient(circle, #ffffff 0 20%, #f5f7fb 21% 33%, transparent 34%),
    conic-gradient(#d6263b 0 12%, #ffffff 12% 20%, #d6263b 20% 38%, #ffffff 38% 46%, #d6263b 46% 64%, #ffffff 64% 72%, #d6263b 72%) !important;
}

.chip-10 {
  background:
    radial-gradient(circle, #ffffff 0 20%, #f5f7fb 21% 33%, transparent 34%),
    conic-gradient(#1f82f2 0 12%, #ffffff 12% 20%, #1f82f2 20% 38%, #ffffff 38% 46%, #1f82f2 46% 64%, #ffffff 64% 72%, #1f82f2 72%) !important;
}

.chip-25 {
  background:
    radial-gradient(circle, #ffffff 0 20%, #f5f7fb 21% 33%, transparent 34%),
    conic-gradient(#18a85c 0 12%, #ffffff 12% 20%, #18a85c 20% 38%, #ffffff 38% 46%, #18a85c 46% 64%, #ffffff 64% 72%, #18a85c 72%) !important;
}

.chip-100 {
  background:
    radial-gradient(circle, #ffffff 0 20%, #f5f7fb 21% 33%, transparent 34%),
    conic-gradient(#171b25 0 12%, #ffffff 12% 20%, #171b25 20% 38%, #ffffff 38% 46%, #171b25 46% 64%, #ffffff 64% 72%, #171b25 72%) !important;
}

.dealer-chip,
.blind-chip,
body:not(.in-lobby) .game-stage .dealer-chip,
body:not(.in-lobby) .game-stage .blind-chip {
  border: 2px solid rgba(255,255,255,.92) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.45), 0 0 0 1px rgba(7,12,28,.28) !important;
  text-shadow: none !important;
}

.dealer-chip,
body:not(.in-lobby) .game-stage .dealer-chip {
  background: #ffffff !important;
  color: #111827 !important;
}

.small-blind,
body:not(.in-lobby) .game-stage .small-blind {
  background: #ffe45c !important;
  color: #171006 !important;
}

.big-blind,
body:not(.in-lobby) .game-stage .big-blind {
  background: #e7edff !important;
  color: #111827 !important;
}

/* Surface Edge 100% zoom responsive fix.
   JS applies this only on Windows Edge touch devices, keeping iPad Safari and
   iPad Firefox on their existing tablet rules. */
html.surface-edge-responsive,
body.surface-edge-responsive {
  max-width: 100vw !important;
  overflow-x: hidden !important;
}

body.surface-edge-responsive.in-lobby {
  min-height: 100dvh !important;
}

body.surface-edge-responsive.in-lobby .lobby-screen {
  box-sizing: border-box !important;
  gap: clamp(.45rem, .75vw, .7rem) !important;
  margin: 0 auto !important;
  max-width: min(1180px, 100vw) !important;
  min-height: 100dvh !important;
  overflow-x: hidden !important;
  padding: clamp(.45rem, .8vw, .8rem) !important;
  width: 100% !important;
}

body.surface-edge-responsive.in-lobby .lobby-top,
body.surface-edge-responsive.in-lobby .featured-table,
body.surface-edge-responsive.in-lobby .lobby-panel {
  padding: clamp(.55rem, .85vw, .8rem) !important;
}

body.surface-edge-responsive.in-lobby .lobby-top {
  flex-wrap: wrap !important;
  gap: clamp(.45rem, .75vw, .75rem) !important;
  min-width: 0 !important;
}

body.surface-edge-responsive.in-lobby .lobby-brand {
  flex: 1 1 18rem !important;
}

body.surface-edge-responsive.in-lobby .lobby-stats {
  flex: 1 1 22rem !important;
}

body.surface-edge-responsive.in-lobby .lobby-logo {
  height: clamp(2.3rem, 4.8vw, 3.4rem) !important;
  width: clamp(2.3rem, 4.8vw, 3.4rem) !important;
}

body.surface-edge-responsive.in-lobby .lobby-brand h1 {
  font-size: clamp(1.25rem, 2.6vw, 2.15rem) !important;
  line-height: .95 !important;
}

body.surface-edge-responsive.in-lobby .lobby-stats {
  gap: clamp(.25rem, .45vw, .45rem) !important;
  min-width: 0 !important;
}

body.surface-edge-responsive.in-lobby .lobby-stats span {
  font-size: clamp(.62rem, .92vw, .78rem) !important;
  min-height: clamp(1.65rem, 3dvh, 2rem) !important;
  padding: .28rem .48rem !important;
}

body.surface-edge-responsive.in-lobby #quickSeatButton {
  flex: 0 0 auto !important;
  font-size: clamp(.72rem, 1vw, .88rem) !important;
  min-height: clamp(2rem, 3.8dvh, 2.35rem) !important;
  padding: .4rem .72rem !important;
  white-space: nowrap !important;
  width: auto !important;
}

body.surface-edge-responsive.in-lobby .featured-table {
  grid-template-columns: minmax(0, 1fr) minmax(16rem, .42fr) !important;
  min-height: clamp(9.5rem, 18dvh, 12rem) !important;
}

body.surface-edge-responsive.in-lobby .featured-copy h2 {
  font-size: clamp(1.8rem, 4vw, 3.25rem) !important;
}

body.surface-edge-responsive.in-lobby .featured-copy p:not(.eyebrow) {
  font-size: clamp(.78rem, 1.15vw, .94rem) !important;
  margin-bottom: .65rem !important;
}

body.surface-edge-responsive.in-lobby .featured-copy button {
  font-size: clamp(.72rem, 1vw, .88rem) !important;
  min-height: 2.2rem !important;
  padding: .42rem .8rem !important;
  width: auto !important;
}

body.surface-edge-responsive.in-lobby .featured-visual {
  min-height: 8rem !important;
}

body.surface-edge-responsive.in-lobby .mini-table {
  height: clamp(6.8rem, 13dvh, 8.25rem) !important;
  width: min(19.5rem, 100%) !important;
}

body.surface-edge-responsive.in-lobby .lobby-grid {
  gap: clamp(.55rem, .8vw, .8rem) !important;
  grid-template-columns: minmax(0, 1fr) minmax(14.5rem, .32fr) !important;
  min-width: 0 !important;
}

body.surface-edge-responsive.in-lobby .table-card {
  gap: clamp(.38rem, .58vw, .6rem) !important;
  grid-template-columns: minmax(10rem, .92fr) minmax(10rem, 1fr) max-content !important;
  min-height: 3.85rem !important;
  padding: .45rem .58rem !important;
}

body.surface-edge-responsive.in-lobby .table-card img.table-icon {
  display: none !important;
  height: 0 !important;
  width: 0 !important;
}

body.surface-edge-responsive.in-lobby .table-card b {
  font-size: clamp(.88rem, 1.2vw, 1rem) !important;
}

body.surface-edge-responsive.in-lobby .table-card span,
body.surface-edge-responsive.in-lobby .table-meta span {
  font-size: clamp(.64rem, .85vw, .74rem) !important;
}

body.surface-edge-responsive.in-lobby .table-meta {
  gap: .28rem !important;
}

body.surface-edge-responsive.in-lobby .table-meta span {
  padding: .18rem .34rem !important;
}

body.surface-edge-responsive.in-lobby .table-card button {
  box-sizing: border-box !important;
  font-size: clamp(.66rem, .9vw, .78rem) !important;
  justify-self: end !important;
  min-height: 1.92rem !important;
  min-width: 6.6rem !important;
  max-width: 8.4rem !important;
  padding: .34rem .58rem !important;
  white-space: nowrap !important;
  width: auto !important;
}

body.surface-edge-responsive.in-lobby .create-table-panel {
  gap: .55rem !important;
  min-width: 0 !important;
}

body.surface-edge-responsive.in-lobby .create-table-panel label,
body.surface-edge-responsive.in-lobby .create-table-head span {
  font-size: .74rem !important;
}

body.surface-edge-responsive.in-lobby .create-table-panel input,
body.surface-edge-responsive.in-lobby .create-table-panel select {
  min-height: 2.05rem !important;
  padding: .34rem .45rem !important;
}

body.surface-edge-responsive.in-lobby #lobbyCreateRoomButton {
  min-height: 2.15rem !important;
}

@media (max-width: 1040px) {
  body.surface-edge-responsive.in-lobby .lobby-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.surface-edge-responsive.in-lobby .create-table-panel {
    position: static !important;
  }
}

@media (max-width: 920px) {
  body.surface-edge-responsive.in-lobby .featured-table {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.surface-edge-responsive.in-lobby .featured-visual {
    display: none !important;
  }

  body.surface-edge-responsive.in-lobby .table-card {
    grid-template-columns: minmax(0, 1fr) max-content !important;
  }

  body.surface-edge-responsive.in-lobby .table-card .table-meta {
    grid-column: 1 / 2 !important;
  }

  body.surface-edge-responsive.in-lobby .table-card button {
    grid-column: 2 / 3 !important;
  }
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage {
  --mobile-nav-h: clamp(58px, 9dvh, 72px);
  --mobile-action-h: clamp(38px, 6.2dvh, 48px);
  --mobile-scene-top: calc(var(--mobile-nav-h) + 2px);
  --mobile-scene-bottom: calc(var(--mobile-action-h) + 2px);
  --mobile-seat-w: clamp(52px, 5.7vw, 74px);
  --mobile-name-font: clamp(7px, .7vw, 9px);
  --mobile-stack-font: clamp(6px, .64vw, 8px);
  --mobile-card-w: clamp(16px, 1.95vw, 26px);
  --mobile-card-h: calc(var(--mobile-card-w) * 1.42);
  --mobile-local-card-w: clamp(22px, 2.65vw, 34px);
  --mobile-local-card-h: calc(var(--mobile-local-card-w) * 1.42);
  --mobile-table-w: min(70%, calc((var(--visible-vh, 100dvh) - var(--mobile-nav-h) - var(--mobile-action-h)) * 1.34));
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage,
body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-shell,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-shell,
body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .table-scene,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .table-scene {
  max-width: 100vw !important;
  overflow: hidden !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .top-bar,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .top-bar {
  height: var(--mobile-nav-h) !important;
  padding: 2px 5px !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .score-strip,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .score-strip {
  align-content: center !important;
  display: grid !important;
  gap: 3px !important;
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(2, minmax(22px, 1fr)) !important;
  height: 100% !important;
  justify-content: stretch !important;
  overflow: hidden !important;
  width: 100% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .score-strip span,
body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .score-strip button,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .score-strip span,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .score-strip button {
  border-radius: 6px !important;
  box-sizing: border-box !important;
  font-size: clamp(7px, .68vw, 9px) !important;
  height: 100% !important;
  justify-self: stretch !important;
  line-height: 1 !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding: 2px 3px !important;
  text-overflow: ellipsis !important;
  width: 100% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .score-strip #fullscreenButton,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .score-strip #fullscreenButton {
  max-width: none !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .table-scene,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .table-scene {
  bottom: var(--mobile-scene-bottom) !important;
  top: var(--mobile-scene-top) !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .poker-table,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .poker-table {
  height: min(46%, calc((var(--visible-vh, 100dvh) - var(--mobile-nav-h) - var(--mobile-action-h)) * .42)) !important;
  min-width: 0 !important;
  top: 49% !important;
  width: var(--mobile-table-w) !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .community,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .community {
  gap: clamp(2px, .42vw, 7px) !important;
  max-width: 34% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .community .card,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .community .card {
  height: clamp(34px, 7.2dvh, 60px) !important;
  width: clamp(24px, 5.15dvh, 42px) !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .seat-bottom,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .seat-bottom {
  bottom: 10% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .seat-bottom-left,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .seat-bottom-left {
  bottom: 13% !important;
  left: 28% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .seat-bottom-right,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .seat-bottom-right {
  bottom: 13% !important;
  left: 72% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .seat-left-lower,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .seat-left-lower {
  left: 7% !important;
  top: 64% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .seat-left-upper,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .seat-left-upper {
  left: 7% !important;
  top: 34% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .seat-right-lower,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .seat-right-lower {
  right: 7% !important;
  top: 64% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .seat-right-upper,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .seat-right-upper {
  right: 7% !important;
  top: 34% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .seat-top,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .seat-top {
  top: 4% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .seat-top-left,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .seat-top-left {
  left: 29% !important;
  top: 7% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .seat-top-right,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .seat-top-right {
  left: 71% !important;
  top: 7% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .player-nameplate,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .player-nameplate {
  padding: 2px 4px !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .seat-bankroll-row,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .seat-bankroll-row,
body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .chip-stack.bankroll,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .chip-stack.bankroll {
  transform: scale(.78) !important;
  transform-origin: center top !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .status-pill,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .status-pill,
body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .hand-readout,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .hand-readout {
  max-width: var(--mobile-seat-w) !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .action-panel,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .action-panel {
  height: var(--mobile-action-h) !important;
  max-height: var(--mobile-action-h) !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .controls,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .controls {
  max-width: min(660px, 92vw) !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .controls button,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .controls button {
  font-size: clamp(9px, 1.25vw, 13px) !important;
  min-height: clamp(30px, 5.4dvh, 42px) !important;
  padding: 3px 7px !important;
}

/* Surface Edge hard fit: scale the full viewport surfaces instead of making
   piecemeal child tweaks. This class is only applied on Windows Edge touch. */
body.surface-edge-responsive {
  --surface-game-scale: .76;
  --surface-lobby-scale: .88;
}

body.surface-edge-responsive.in-lobby {
  overflow-x: hidden !important;
}

body.surface-edge-responsive.in-lobby .lobby-screen {
  max-width: none !important;
  min-height: calc(100dvh / var(--surface-lobby-scale)) !important;
  transform: scale(var(--surface-lobby-scale)) !important;
  transform-origin: top left !important;
  width: calc(100% / var(--surface-lobby-scale)) !important;
}

body.surface-edge-responsive.in-lobby .featured-table {
  grid-template-columns: minmax(0, 1fr) !important;
  min-height: 0 !important;
}

body.surface-edge-responsive.in-lobby .featured-visual,
body.surface-edge-responsive.in-lobby .mini-table {
  display: none !important;
}

body.surface-edge-responsive.in-lobby .lobby-grid {
  grid-template-columns: minmax(0, 1fr) minmax(13rem, .26fr) !important;
}

body.surface-edge-responsive.in-lobby .table-card {
  align-items: center !important;
  grid-template-columns: minmax(9rem, .9fr) minmax(10rem, 1fr) max-content !important;
  min-height: 3.2rem !important;
}

body.surface-edge-responsive.in-lobby .table-card img.table-icon,
body.surface-edge-responsive.in-lobby .table-card picture,
body.surface-edge-responsive.in-lobby .table-card .table-icon,
body.surface-edge-responsive.in-lobby .table-card .mini-table {
  display: none !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby),
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) {
  overflow: hidden !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage {
  height: 100dvh !important;
  max-height: 100dvh !important;
  max-width: 100vw !important;
  overflow: hidden !important;
  width: 100vw !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .game-shell,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .game-shell {
  height: calc(100% / var(--surface-game-scale)) !important;
  max-height: none !important;
  max-width: none !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  transform: scale(var(--surface-game-scale)) !important;
  transform-origin: top left !important;
  width: calc(100% / var(--surface-game-scale)) !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .top-bar,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .top-bar {
  height: clamp(64px, 9dvh, 78px) !important;
  padding: 3px 6px !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .score-strip,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .score-strip {
  display: grid !important;
  gap: 3px !important;
  grid-auto-flow: row !important;
  grid-template-columns: repeat(7, minmax(52px, 1fr)) !important;
  grid-template-rows: repeat(2, minmax(24px, 1fr)) !important;
  overflow: hidden !important;
  width: 100% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .score-strip span,
body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .score-strip button,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .score-strip span,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .score-strip button {
  font-size: 9px !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding-left: 3px !important;
  padding-right: 3px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .table-scene,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .table-scene {
  bottom: clamp(48px, 7dvh, 60px) !important;
  left: 0 !important;
  right: 0 !important;
  top: clamp(66px, 9.5dvh, 82px) !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .action-panel,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .action-panel {
  height: clamp(44px, 6.8dvh, 58px) !important;
  max-height: clamp(44px, 6.8dvh, 58px) !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .poker-table,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .poker-table {
  width: min(64%, 760px) !important;
}

@media (max-width: 1180px) {
  body.surface-edge-responsive {
    --surface-game-scale: .72;
    --surface-lobby-scale: .84;
  }

  body.surface-edge-responsive.in-lobby .lobby-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Surface Edge medium-tablet landscape final fit.
   Keep this block last so it wins over the older tablet/mobile rules above. */
body.surface-edge-responsive {
  --surface-scene-scale: .72;
}

body.surface-edge-responsive.in-lobby .lobby-screen {
  display: flex !important;
  gap: .45rem !important;
  max-width: 100vw !important;
  min-height: 100dvh !important;
  padding: .45rem !important;
  transform: none !important;
  width: 100vw !important;
}

body.surface-edge-responsive.in-lobby .lobby-top,
body.surface-edge-responsive.in-lobby .featured-table,
body.surface-edge-responsive.in-lobby .lobby-panel {
  border-radius: 8px !important;
  padding: .5rem !important;
}

body.surface-edge-responsive.in-lobby .lobby-top {
  flex: 0 0 auto !important;
}

body.surface-edge-responsive.in-lobby .featured-table {
  flex: 0 0 auto !important;
}

body.surface-edge-responsive.in-lobby .featured-visual,
body.surface-edge-responsive.in-lobby .mini-table,
body.surface-edge-responsive.in-lobby .table-card img.table-icon,
body.surface-edge-responsive.in-lobby .table-card .table-icon {
  display: none !important;
  flex: 0 0 0 !important;
  height: 0 !important;
  margin: 0 !important;
  min-height: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  width: 0 !important;
}

body.surface-edge-responsive.in-lobby .lobby-grid {
  align-items: start !important;
  display: grid !important;
  flex: 1 1 auto !important;
  gap: .5rem !important;
  grid-template-columns: minmax(0, 1fr) minmax(13rem, 18rem) !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.surface-edge-responsive.in-lobby .table-browser {
  min-width: 0 !important;
}

body.surface-edge-responsive.in-lobby .table-card {
  display: grid !important;
  gap: .42rem !important;
  grid-template-columns: minmax(12rem, 1fr) minmax(16rem, 1.1fr) max-content !important;
  min-height: 2.85rem !important;
  padding: .34rem .45rem !important;
}

body.surface-edge-responsive.in-lobby .table-meta {
  align-items: center !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: .22rem !important;
}

body.surface-edge-responsive.in-lobby .table-card button {
  align-self: center !important;
  box-sizing: border-box !important;
  flex: 0 0 auto !important;
  justify-self: end !important;
  max-width: 8rem !important;
  min-height: 1.9rem !important;
  min-width: 6.6rem !important;
  padding: .28rem .52rem !important;
  width: auto !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .game-shell,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .game-shell {
  height: 100% !important;
  transform: none !important;
  width: 100% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .table-scene,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .table-scene {
  bottom: clamp(62px, 8.2dvh, 78px) !important;
  left: 0 !important;
  overflow: visible !important;
  right: 0 !important;
  top: clamp(72px, 9.5dvh, 88px) !important;
  transform: scale(var(--surface-scene-scale)) !important;
  transform-origin: center center !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .poker-table,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .poker-table {
  height: min(42%, 270px) !important;
  top: 48% !important;
  width: min(58%, 700px) !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .seat-left-lower,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .seat-left-lower {
  left: 9% !important;
  top: 63% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .seat-left-upper,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .seat-left-upper {
  left: 9% !important;
  top: 35% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .seat-right-lower,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .seat-right-lower {
  right: 9% !important;
  top: 63% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .seat-right-upper,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .seat-right-upper {
  right: 9% !important;
  top: 35% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom {
  bottom: 15% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom-left,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom-left {
  bottom: 18% !important;
  left: 31% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .seat-bottom-right,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .seat-bottom-right {
  bottom: 18% !important;
  left: 69% !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .game-stage .action-panel,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .game-stage .action-panel {
  height: clamp(42px, 6.4dvh, 54px) !important;
  max-height: clamp(42px, 6.4dvh, 54px) !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .hand-history-modal.show,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .hand-history-modal.show {
  align-items: flex-end !important;
  display: flex !important;
  justify-content: center !important;
  padding: clamp(70px, 10dvh, 90px) 1rem clamp(62px, 8.5dvh, 82px) !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .hand-history-card,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .hand-history-card {
  max-height: min(42dvh, 18rem) !important;
  max-width: min(34rem, 74vw) !important;
  width: min(34rem, 74vw) !important;
}

body.surface-edge-responsive.tablet-landscape:not(.in-lobby) .hand-history-list,
body.surface-edge-responsive.mobile-table-mode:not(.in-lobby) .hand-history-list {
  max-height: min(25dvh, 10rem) !important;
  overflow: auto !important;
}

@media (max-width: 1180px) {
  body.surface-edge-responsive {
    --surface-scene-scale: .66;
  }

  body.surface-edge-responsive.in-lobby .lobby-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Safe UI polish pass. These rules intentionally avoid Surface Edge layout. */
body.in-lobby:not(.surface-edge-responsive) .table-card {
  grid-template-columns: minmax(12rem, 1fr) minmax(12rem, 1.1fr) max-content !important;
  min-height: 4.35rem !important;
}

body.in-lobby:not(.surface-edge-responsive) .table-card img.table-icon,
body.in-lobby:not(.surface-edge-responsive) .table-card .table-icon {
  display: none !important;
}

body.in-lobby:not(.surface-edge-responsive) .table-card button {
  align-self: center !important;
  justify-self: end !important;
  min-width: 7.4rem !important;
  width: auto !important;
}

.lobby-footer-links {
  align-items: center;
  color: rgba(214, 226, 255, .72);
  display: flex;
  flex-wrap: wrap;
  font-size: .76rem;
  gap: .45rem;
  justify-content: center;
  letter-spacing: .02em;
  padding: .15rem 0 .35rem;
}

body:not(.in-lobby) .lobby-footer-links {
  display: none !important;
}

.lobby-footer-links a,
.lobby-footer-links button {
  background: transparent;
  border: 0;
  color: rgba(255, 228, 92, .9);
  cursor: pointer;
  font: inherit;
  font-weight: 800;
  padding: 0;
  text-decoration: none;
}

.lobby-footer-links a:hover,
.lobby-footer-links a:focus-visible,
.lobby-footer-links button:hover,
.lobby-footer-links button:focus-visible {
  color: #fff4a8;
  outline: none;
  text-decoration: underline;
}

body:not(.surface-edge-responsive):not(.in-lobby) .game-stage .score-strip .gold-button {
  align-items: center !important;
  appearance: none !important;
  background: linear-gradient(180deg, #ffe45c 0%, #f6be3d 100%) !important;
  border: 1px solid rgba(73, 46, 10, .42) !important;
  border-radius: 7px !important;
  box-shadow: 0 2px 0 rgba(82, 49, 4, .36), inset 0 1px 0 rgba(255, 255, 255, .42) !important;
  color: #1f1608 !important;
  display: inline-flex !important;
  font-family: inherit !important;
  font-size: clamp(.68rem, .72vw, .82rem) !important;
  font-weight: 900 !important;
  justify-content: center !important;
  line-height: 1 !important;
  min-height: 2.25rem !important;
  padding: 0 .78rem !important;
  text-align: center !important;
  text-transform: none !important;
  transform: none !important;
  vertical-align: middle !important;
  white-space: nowrap !important;
}

body:not(.surface-edge-responsive):not(.in-lobby) .game-stage .score-strip .gold-button:hover,
body:not(.surface-edge-responsive):not(.in-lobby) .game-stage .score-strip .gold-button:focus-visible {
  filter: brightness(1.04) !important;
  transform: none !important;
}

body:not(.surface-edge-responsive):not(.in-lobby) .hand-history-modal.show {
  align-items: center !important;
  display: flex !important;
  justify-content: center !important;
  padding: clamp(4.5rem, 10dvh, 6rem) 1rem clamp(5.25rem, 12dvh, 7rem) !important;
}

body:not(.surface-edge-responsive):not(.in-lobby) .hand-history-card {
  max-height: min(48dvh, 20rem) !important;
  max-width: min(32rem, calc(100vw - 2rem)) !important;
  width: min(32rem, calc(100vw - 2rem)) !important;
}

body:not(.surface-edge-responsive):not(.in-lobby) .hand-history-list {
  max-height: min(30dvh, 12rem) !important;
  overflow: auto !important;
}
/* Account UI final polish: lobby-only alignment and modal responsiveness. */
body.in-lobby .lobby-top {
  display: grid;
  grid-template-columns: minmax(14rem, 1fr) auto minmax(15rem, auto);
}
body.in-lobby .lobby-brand {
  justify-self: start;
}
body.in-lobby .lobby-stats {
  justify-self: center;
}
body.in-lobby .lobby-header-actions {
  align-self: center;
  justify-self: end;
}
body.in-lobby .lobby-account-controls {
  max-width: min(31rem, 42vw);
}
body.in-lobby .lobby-account-controls button,
body.in-lobby .lobby-header-actions #quickSeatButton {
  white-space: nowrap;
}
@media (max-width: 1180px) {
  body.in-lobby .lobby-top {
    display: grid;
    grid-template-columns: minmax(13rem, 1fr) minmax(14rem, auto);
    row-gap: .45rem;
  }
  body.in-lobby .lobby-brand {
    grid-column: 1;
  }
  body.in-lobby .lobby-stats {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-content: flex-start;
  }
  body.in-lobby .lobby-header-actions {
    grid-column: 2;
    grid-row: 1;
  }
  body.in-lobby .lobby-account-controls {
    max-width: none;
  }
}
@media (max-width: 760px) {
  body.in-lobby .lobby-top {
    grid-template-columns: 1fr;
  }
  body.in-lobby .lobby-brand,
  body.in-lobby .lobby-stats,
  body.in-lobby .lobby-header-actions {
    grid-column: 1;
  }
  body.in-lobby .lobby-header-actions {
    flex-wrap: wrap;
    justify-content: flex-start;
    min-width: 0;
    width: 100%;
  }
  body.in-lobby .lobby-account-controls {
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .profile-detail-grid {
    grid-template-columns: 1fr;
  }
}

/* Targeted lobby auth UI polish. */
body.in-lobby .lobby-header-actions #lobbyCreateAccountButton,
body.in-lobby .lobby-header-actions #lobbySignInButton,
body.in-lobby .lobby-header-actions #quickSeatButton {
  align-items: center;
  background: linear-gradient(180deg, var(--gold), #ff9f43) !important;
  border: 1px solid rgba(255,228,92,.72) !important;
  color: #20120a !important;
  display: inline-flex;
  font-size: .78rem;
  font-weight: 900;
  justify-content: center;
  letter-spacing: 0;
  min-height: 2.35rem;
  padding: .48rem .78rem;
  text-transform: uppercase;
  text-shadow: none;
}
body.in-lobby .lobby-header-actions #lobbySignInButton {
  box-shadow: 0 0 0 1px rgba(32,18,10,.18), 0 0 18px rgba(255,228,92,.2);
}
body.in-lobby .lobby-header-actions #lobbyCreateAccountButton:hover,
body.in-lobby .lobby-header-actions #lobbyCreateAccountButton:focus-visible,
body.in-lobby .lobby-header-actions #lobbySignInButton:hover,
body.in-lobby .lobby-header-actions #lobbySignInButton:focus-visible,
body.in-lobby .lobby-header-actions #quickSeatButton:hover,
body.in-lobby .lobby-header-actions #quickSeatButton:focus-visible {
  background: linear-gradient(180deg, #fff07a, #ffad4e) !important;
  border-color: rgba(255,244,156,.9) !important;
}
.email-verified-actions {
  display: grid;
  gap: .55rem;
}
.email-verified-actions .account-secondary-button {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 7px;
  color: var(--text);
  font-weight: 800;
  min-height: 2.35rem;
}