/* Mobile table geometry only. Existing skins, cards, chips and game state remain authoritative. */
@media all {
  body.mobile-game-active #table-screen {height:100dvh;min-height:0;overflow-y:auto}
  body.mobile-game-active .table-header {flex-shrink:0;height:calc(48px + env(safe-area-inset-top));padding-inline:12px}
  body.mobile-game-active .table-area {min-height:440px;flex:1 1 auto;padding:0 0 8px;overflow:visible}
  body.mobile-game-active .table-rail {height:100%;min-height:440px;padding:64px 50px 46px;box-sizing:border-box;transform:none}
  body.mobile-game-active .poker-table {height:100%;min-height:330px;width:100%;border-radius:50%;outline:6px solid rgba(27,27,30,.85);box-shadow:0 0 0 9px #47434b,0 12px 32px #0007,inset 0 0 45px #0005;overflow:visible}
  body.mobile-game-active .poker-table::before {border-radius:inherit;inset:9px;border:1px solid #ffffff12}
  body.mobile-game-active .poker-table::after {font-size:2rem;opacity:.5}
  body.mobile-game-active .poker-table :is(.mobile-opp-strip,.mobile-me-strip,.mobile-extra-strip,.mobile-extra-mini) {
    position:absolute!important;left:var(--seat-x,50%)!important;top:var(--seat-y,0%)!important;right:auto!important;bottom:auto!important;
    translate:-50% -50%;transform:none;width:94px!important;height:48px!important;min-height:0!important;
    padding:0!important;margin:0!important;box-sizing:border-box;border:1px solid #ffffff30!important;
    border-radius:6px;background:var(--bg-card,#151923)!important;box-shadow:0 5px 14px #0006;
    backdrop-filter:none;z-index:12;transition:border-color .2s,box-shadow .2s,opacity .2s;
  }
  body.mobile-game-active .poker-table :is(.mobile-opp-strip,.mobile-me-strip,.mobile-extra-strip,.mobile-extra-mini).active-turn {border-color:var(--gold-light,#f4b97b)!important;box-shadow:0 0 0 2px #edbf6930,0 5px 14px #0006}
  /* Whoever's turn it is breathes gold, like the desktop plaques (desktop-lounge.css plaqueGlow; Shaun, 2026-10-15: "on
     mobile, add the pulsing active player highlighting too") */
  /* (a glow layer of its own: game-palette.css pins the plaque's box-shadow with !important, which an animation can't move) */
  body.mobile-game-active .poker-table :is(.mobile-opp-strip,.mobile-me-strip,.mobile-extra-strip,.mobile-extra-mini).active-turn::after {content:'';position:absolute;inset:-3px;border-radius:inherit;pointer-events:none;box-shadow:0 0 16px 2px #ffd34f99,0 0 34px 4px #ffd34f40;opacity:.35;animation:mtTurnGlow 2s ease-in-out infinite}
  @media (prefers-reduced-motion: reduce) { body.mobile-game-active .poker-table :is(.mobile-opp-strip,.mobile-me-strip,.mobile-extra-strip,.mobile-extra-mini).active-turn::after {animation:none;opacity:.7} }
  body.mobile-game-active .poker-table :is(.mobile-opp-strip,.mobile-me-strip,.mobile-extra-strip,.mobile-extra-mini).hidden {display:none!important}
  body.mobile-game-active .poker-table .mobile-extra-row:not(.hidden) {display:contents!important}
  body.mobile-game-active .poker-table .mobile-extra-row {background:none;border:0;backdrop-filter:none}
  body.mobile-game-active .mobile-opp-strip {--seat-x:50%;--seat-y:0%}
  body.mobile-game-active .poker-table .mobile-me-strip {--seat-x:50%;--seat-y:100%;width:126px!important}
  body.mobile-game-active .mobile-extra-strip--top {--seat-x:97.697%;--seat-y:35%}
  body.mobile-game-active .mobile-extra-strip--bot {--seat-x:2.303%;--seat-y:35%}
  body.mobile-game-active #mobile-extra-mini0-strip {--seat-x:93.301%;--seat-y:75%}
  body.mobile-game-active #mobile-extra-mini1-strip {--seat-x:93.301%;--seat-y:25%}
  body.mobile-game-active #mobile-extra-mini2-strip {--seat-x:6.699%;--seat-y:25%}
  body.mobile-game-active #mobile-extra-mini3-strip {--seat-x:6.699%;--seat-y:75%}
  body.mobile-game-active .poker-table :is(.mobile-opp-strip-left,.mobile-me-left,.mobile-extra-strip-inner) {display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;width:100%!important;height:100%!important;min-height:0!important;padding:11px 5px 5px!important;gap:0!important;box-shadow:none!important}
  body.mobile-game-active .poker-table .mobile-extra-mini {flex-direction:column;justify-content:center;padding:11px 5px 5px!important;gap:0}
  body.mobile-game-active .poker-table :is(.mobile-opp-info,.mobile-me-info,.mobile-extra-info,.mobile-extra-mini-info) {text-align:center;align-items:center;line-height:1.3;max-width:100%;gap:1px}
  body.mobile-game-active .poker-table :is(.mobile-opp-avatar,.mobile-me-avatar,.mobile-extra-avatar,.mobile-extra-mini-avatar) {position:absolute!important;top:-24px;left:50%;transform:translateX(-50%);width:36px!important;height:36px!important;object-fit:cover;margin:0!important;border:2px solid #77727b;box-sizing:border-box;z-index:2}
  body.mobile-game-active .poker-table .mob-av-wrap {position:static!important;width:0!important;height:0!important;margin:0!important;flex:none!important}
  body.mobile-game-active .poker-table :is(.mobile-opp-name,.mobile-me-name,.mobile-extra-name,.mobile-extra-mini-name) {font-size:11px;font-weight:650;max-width:82px;line-height:1.3}
  body.mobile-game-active .poker-table :is(.mobile-opp-stack,.mobile-me-stack,.mobile-extra-stack,.mobile-extra-mini-stack,.mobile-opp-action,.mobile-me-action,.mobile-extra-action) {font-size:11px;max-width:86px;overflow:hidden;text-overflow:ellipsis;line-height:1.3;letter-spacing:0}
  body.mobile-game-active .mobile-extra-mini-info:has(.mobile-extra-action[data-act]:not([data-act=""])) .mobile-extra-mini-stack {display:none}
  body.mobile-game-active .poker-table :is(.mobile-opp-cards,.mobile-extra-cards) {position:absolute;top:-19px;left:calc(50% + 10px);right:auto;bottom:auto;display:flex;gap:2px;padding:0!important;margin:0!important;min-width:0!important;z-index:1;transform:rotate(8deg)}
  body.mobile-game-active .poker-table :is(.mobile-opp-cards,.mobile-extra-cards) .card {width:21px!important;height:29px!important;border-radius:3px}
  body.mobile-game-active .poker-table .mobile-opp-cards {top:calc(100% + 4px);left:50%;transform:translateX(-50%)}
  body.mobile-game-active .poker-table .mobile-me-cards {position:absolute;top:-43px;left:50%;right:auto;bottom:auto;transform:translateX(-50%);display:flex;gap:4px;padding:0!important;margin:0!important;min-width:0!important;z-index:-1}
  body.mobile-game-active .poker-table .mobile-me-cards .card {width:43px!important;height:61px!important;border-radius:5px}
  body.mobile-game-active .poker-table .mobile-me-avatar {left:-1px;top:9px;width:32px!important;height:32px!important}
  body.mobile-game-active .poker-table .mobile-me-info {padding-left:8px}
  body.mobile-game-active .poker-table .mobile-strip-timer-wrap {left:8px!important;right:8px!important;bottom:3px!important;top:auto!important;width:auto!important;height:3px;border-radius:3px;overflow:hidden}
  body.mobile-game-active .poker-table :is(#m-d-me,#m-d-opp,.mobile-seat-dealer) {position:absolute!important;top:auto!important;left:auto!important;right:-8px!important;bottom:-7px!important;transform:none!important;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:#eee9dd;color:#24211d;border:1px solid #b7b3a9;font:bold 11px/1 sans-serif;z-index:15;box-shadow:0 2px 5px #0005}
  body.mobile-game-active .poker-table :is(#m-d-me,#m-d-opp,.mobile-seat-dealer).hidden {display:none!important}
  body.mobile-game-active .community-area {width:max-content;max-width:none;z-index:5}
  body.mobile-game-active .community-cards {gap:4px;padding:0}
  body.mobile-game-active .community-cards .card {width:clamp(34px,10vw,49px)!important;height:clamp(48px,14vw,69px)!important;border-radius:5px}
  body.mobile-game-active #table-screen .poker-table .bet-stack {z-index:8;align-items:center;min-width:30px;max-width:66px;transform:none;bottom:auto!important;height:auto!important}
  body.mobile-game-active .poker-table .chip-tower {gap:1px;max-width:60px}
  body.mobile-game-active .poker-table :is(.chip-disc,.chip-disc2) {width:13px;height:13px}
  body.mobile-game-active .poker-table .chip-col :is(.chip-disc,.chip-disc2):not(:last-child) {margin-bottom:-9px}
  body.mobile-game-active .poker-table .bet-stack-amount {font-size:10px;white-space:nowrap;padding:2px 4px}
  body.mobile-game-active .pot-chips-side {z-index:6;padding-bottom:8px}
  body.mobile-game-active .mobile-strip-winner-banner::before {font-size:11px;letter-spacing:.02em}
  body.mobile-game-active .bottom-zone {position:relative;flex-shrink:0;height:auto!important;min-height:150px;padding:4px 0 max(8px,env(safe-area-inset-bottom));margin:0;width:100%;box-sizing:border-box;border-top:1px solid #ffffff12}
  body.mobile-game-active .action-panel {min-height:0;width:100%}
  body.mobile-game-active .action-status-strip {min-height:23px;padding:3px 12px}
  body.mobile-game-active .action-btn-grid {gap:8px;padding:5px 10px}
  body.mobile-game-active .action-btn-grid .btn-action {height:var(--act-h,50px)!important;min-height:var(--act-h,50px);font-size:16px!important;border-radius:10px}
  body.mobile-game-active .sizing-row {height:auto;min-height:44px;padding:4px 10px;gap:5px}
  body.mobile-game-active .sizing-row .btn-quick {min-height:38px}
  body.mobile-game-active .btn-hamburger {align-items:center;justify-content:center;padding:0;line-height:1}
}
@media(max-width:360px) {
  body.mobile-game-active .poker-table :is(.mobile-opp-strip,.mobile-extra-strip,.mobile-extra-mini) {width:82px!important}
  body.mobile-game-active .poker-table :is(.mobile-opp-name,.mobile-extra-name,.mobile-extra-mini-name) {max-width:72px;font-size:10px}
  body.mobile-game-active .table-rail {padding-inline:46px}
}
/* Short screens retain usable cards and touch targets; scroll instead of shrinking them. */
@media(max-width:768px) and (max-height:680px) {
  body.mobile-game-active .table-area {min-height:440px}
  body.mobile-game-active .table-rail {min-height:470px;padding-block:64px 46px}
  body.mobile-game-active .poker-table {min-height:360px}
}

@media all {
 body.mobile-game-active :is(#mobile-extra-top-strip,#mobile-extra-mini0-strip,#mobile-extra-mini1-strip) .mobile-extra-cards {left:auto;right:calc(50% + 10px);transform:rotate(-8deg)}
}

@media all {
 body.mobile-game-active .poker-table :is(.mobile-opp-cards,.mobile-extra-cards):has(.card:not(.back):not(.empty)) {z-index:4;transform:none;top:-39px;left:50%;right:auto;translate:-50% 0}
 body.mobile-game-active .poker-table :is(.mobile-opp-cards,.mobile-extra-cards) .card:not(.back):not(.empty) {width:27px!important;height:38px!important}
 body.mobile-game-active .poker-table .mobile-opp-cards:has(.card:not(.back):not(.empty)) {top:calc(100% + 4px)}
 body.mobile-game-active .poker-table :is(.mobile-opp-cards,.mobile-extra-cards):has(.card:nth-child(4)) {gap:1px}
 body.mobile-game-active .poker-table :is(.mobile-opp-cards,.mobile-extra-cards):has(.card:nth-child(4)) .card {width:20px!important;height:29px!important}
}

@media all {
 body.mobile-game-active .poker-table .mobile-me-cards {z-index:-1}
 body.mobile-game-active .poker-table .mobile-me-left {position:relative;background:inherit;border-radius:inherit;z-index:1}
 body.mobile-game-active .poker-table .mobile-me-info {position:relative;z-index:5}
 body.mobile-game-active .poker-table .mobile-opp-cards {top:-40px;z-index:-1}
 body.mobile-game-active .poker-table .mobile-opp-avatar {left:0;top:8px;width:32px!important;height:32px!important}
 body.mobile-game-active .poker-table .mobile-opp-strip-left {position:relative;background:inherit;border-radius:inherit;z-index:1}
 body.mobile-game-active .poker-table .mobile-opp-cards:has(.card:not(.back):not(.empty)) {top:-40px}
 body.mobile-game-active .poker-table .bet-stack {gap:2px}
 body.mobile-game-active .poker-table :is(.chip-disc,.chip-disc2) {width:11px;height:11px}
 body.mobile-game-active .poker-table .chip-col :is(.chip-disc,.chip-disc2):not(:last-child) {margin-bottom:-9px}
}
@media all {
 body.mobile-game-active .poker-table :is(.mobile-me-left,.mobile-opp-strip-left)::after {content:'';position:absolute;inset:0;border-radius:inherit;background:var(--bg-card,#151923);z-index:0;pointer-events:none}
 body.mobile-game-active .poker-table :is(.mobile-me-info,.mobile-opp-info) {position:relative;z-index:1}
 body.mobile-game-active .poker-table .mobile-opp-cards {top:-21px}
 body.mobile-game-active .poker-table .mobile-opp-cards:has(.card:not(.back):not(.empty)) {top:-29px}
}

@media all {
 body.mobile-game-active .poker-table .bet-stack-amount {line-height:12px;padding:0 4px;margin:0}
 body.mobile-game-active .poker-table .bet-stack .chip-tower {margin:0}
}
@media all {
 body.mobile-game-active .poker-table .mobile-opp-avatar {left:-12px}
 body.mobile-game-active #table-screen[data-variant="omaha"] .mobile-me-cards {gap:2px;top:-36px}
 body.mobile-game-active #table-screen[data-variant="omaha"] .mobile-me-cards .card {width:clamp(30px,9vw,40px)!important;height:clamp(44px,13vw,58px)!important}
}

/* Touch tablets keep the same seat model above the phone breakpoint.
   The layout class is selected by Lobby, so mouse/trackpad desktops are unchanged. */
@media(min-width:600px) {
 body.mobile-game-active #table-screen {position:relative;width:100%;max-width:none;transform:none}
 body.mobile-game-active .table-header {position:relative;display:flex;align-items:center;justify-content:space-between;inset:auto;z-index:20}
 body.mobile-game-active .header-center {display:flex;flex:1;justify-content:center}
 body.mobile-game-active .header-right {display:flex;align-items:center;gap:8px}
 body.mobile-game-active .btn-hamburger {display:flex;width:44px;height:44px}
 body.mobile-game-active .header-nav {display:none;position:absolute;top:48px;right:16px;flex-direction:column;gap:6px;background:var(--bg-card);border:1px solid #ffffff25;border-radius:12px;padding:10px;z-index:200;min-width:200px}
 body.mobile-game-active .header-nav.open {display:flex}
 body.mobile-game-active .header-nav .btn-nav-mobile-only {display:flex;align-items:center;gap:8px;min-height:44px;padding:10px;border:0;background:transparent;color:var(--text-primary);font:inherit}
 body.mobile-game-active :is(.table-corner-btns,.acid-mode-badge,.mobile-opp-bar,.bottom-zone-log,.px-skills-bar,.action-hand-col,.action-status-col,.emote-trigger-btn) {display:none!important}
 body.mobile-game-active .table-area {align-items:stretch}
 body.mobile-game-active .table-rail {width:100%;max-width:820px;padding-inline:80px;background:none;border:0;box-shadow:none;border-radius:0}
 body.mobile-game-active .table-rail::before,body.mobile-game-active .table-rail::after {display:none}
 body.mobile-game-active .poker-table {aspect-ratio:auto}
 body.mobile-game-active .player-area {display:none!important}
 body.mobile-game-active .seat-slot {display:none!important}
 body.mobile-game-active .poker-table:is(.mobile-4p,.mobile-6p) .seat-slot {display:block!important;position:absolute!important;top:0!important;left:0!important;width:0;height:0;overflow:visible;pointer-events:none}
 body.mobile-game-active .seat-slot>.card-row {display:none!important}
 body.mobile-game-active .seat-slot>.plaque-row {display:block!important;position:static;width:0;height:0;overflow:visible}
 body.mobile-game-active .seat-slot>.plaque-row>:not(.bet-stack) {display:none!important}
 body.mobile-game-active .seat-slot .bet-stack {position:absolute;pointer-events:auto}
 body.mobile-game-active .poker-table :is(.mobile-opp-strip,.mobile-me-strip,.mobile-extra-strip,.mobile-extra-mini) {display:flex;flex-direction:column;width:116px!important;height:54px!important}
 body.mobile-game-active .poker-table .mobile-me-strip {width:144px!important}
 body.mobile-game-active .poker-table :is(.mobile-opp-info,.mobile-me-info,.mobile-extra-info,.mobile-extra-mini-info) {display:flex;flex-direction:column;min-width:0}
 body.mobile-game-active .poker-table :is(.mobile-opp-name,.mobile-me-name,.mobile-extra-name,.mobile-extra-mini-name) {font-size:13px;max-width:104px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 body.mobile-game-active .poker-table :is(.mobile-opp-stack,.mobile-me-stack,.mobile-extra-stack,.mobile-extra-mini-stack,.mobile-opp-action,.mobile-me-action,.mobile-extra-action) {font-size:13px;max-width:106px;color:var(--gold-light)}
 body.mobile-game-active :is(.mobile-opp-action,.mobile-me-action,.mobile-extra-action) {display:none}
 body.mobile-game-active :is(.mobile-opp-action,.mobile-me-action,.mobile-extra-action)[data-act]:not([data-act=""]):not([data-act="winner"]):not([data-act="split"]) {display:block}
 body.mobile-game-active .poker-table :is(.mobile-opp-info,.mobile-me-info,.mobile-extra-info,.mobile-extra-mini-info):has([data-act]:not([data-act=""]):not([data-act="winner"]):not([data-act="split"])) :is(.mobile-opp-stack,.mobile-me-stack,.mobile-extra-stack,.mobile-extra-mini-stack) {display:none}
 body.mobile-game-active .mobile-strip-timer-wrap {position:absolute;overflow:hidden;pointer-events:none;background:#0004;z-index:11}
 body.mobile-game-active .mobile-strip-timer-wrap.hidden {opacity:0}
 body.mobile-game-active .mobile-strip-timer-bar {height:100%;width:100%;background:linear-gradient(90deg,#0d4020,#1e7a34);transform-origin:left}
 body.mobile-game-active .mobile-strip-timer-wrap.warning .mobile-strip-timer-bar {background:#c0392b}
 body.mobile-game-active .mobile-strip-winner-banner {display:flex;flex-direction:column}
 body.mobile-game-active .mobile-strip-winner-banner.hidden {display:none}
 body.mobile-game-active .mobile-strip-winner-banner::before {content:attr(data-label);color:var(--gold-light);font-weight:800}
 body.mobile-game-active .poker-table :is(.mobile-opp-strip,.mobile-me-strip,.mobile-extra-strip,.mobile-extra-mini).is-folded {opacity:.45;filter:saturate(.3)}
 body.mobile-game-active .poker-table :is(.mobile-opp-strip,.mobile-me-strip,.mobile-extra-strip,.mobile-extra-mini).is-eliminated {opacity:.25;pointer-events:none}
 body.mobile-game-active .community-cards .card {width:58px!important;height:82px!important}
 body.mobile-game-active .bottom-zone {display:flex;flex-direction:column;align-items:center;min-height:150px}
 body.mobile-game-active .bottom-zone-main {display:flex;flex-direction:column;width:100%;max-width:680px;flex:1}
 body.mobile-game-active .action-main {flex-direction:column;min-height:0;padding:0}
 body.mobile-game-active .action-btns-col {width:100%}
 body.mobile-game-active .action-btn-grid {display:flex;flex:0 0 auto;border:0}
 body.mobile-game-active .action-btn-grid .btn-action {flex:1}
 body.mobile-game-active .sizing-row {width:100%;box-sizing:border-box;align-items:stretch;justify-content:center}
 body.mobile-game-active .sizing-row .quick-bets {display:flex;flex:3;gap:8px}
 body.mobile-game-active .sizing-row .btn-quick {flex:1;min-height:42px}
 body.mobile-game-active .sizing-row :is(.bet-slider,.bet-input) {display:none}
 body.mobile-game-active .pot-total {font-size:14px}
}
@media(min-width:600px) and (orientation:portrait) {
 body.mobile-game-active .table-rail {max-width:640px}
}
@media(min-width:600px) {
 body.mobile-game-active .community-area {position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);gap:6px}
 body.mobile-game-active .action-btns-col {max-width:none}
 body.mobile-game-active .action-status-strip {display:none}
 body.mobile-game-active .sizing-row .btn-bb-step {flex:0 0 44px;order:0}
 body.mobile-game-active #bet-inc {order:5}
 body.mobile-game-active .sizing-row .quick-bets {order:1}
 body.mobile-game-active .sizing-row #btn-allin {order:2;flex:1}
}
@media(min-width:600px) {
 body.mobile-game-active #sizing-row #bet-dec {order:0}
 body.mobile-game-active #sizing-row #quick-bets {order:1}
 body.mobile-game-active #sizing-row #btn-allin {order:2}
 body.mobile-game-active #sizing-row #bet-inc {order:3}
 body.mobile-game-active .action-panel :is(.btn-bet,.btn-check[data-action="call"]) {background:linear-gradient(135deg,var(--accent),var(--accent-dim));border-color:var(--accent-border);color:#fff;box-shadow:0 2px 10px #0003}
}

/* Keep the same visual scale across touch orientations. */
@media all {
 body.mobile-game-active .poker-table :is(.mobile-opp-strip-left,.mobile-me-left,.mobile-extra-strip-inner) {padding-top:7px!important}
 body.mobile-game-active .poker-table .mobile-extra-mini {padding-top:7px!important}
 body.mobile-game-active .poker-table :is(.chip-disc,.chip-disc2) {width:14px;height:14px}
 body.mobile-game-active .poker-table .chip-col :is(.chip-disc,.chip-disc2):not(:last-child) {margin-bottom:-10px}
 body.mobile-game-active .poker-table .mobile-me-avatar {top:7px}
 body.mobile-game-active .poker-table .mobile-opp-avatar {top:7px}
}
@media(min-width:600px) {
 body.mobile-game-active .table-area {flex:1;justify-content:center}
 body.mobile-game-active .table-rail {max-height:760px;align-self:center;padding-top:76px;padding-bottom:56px}
 body.mobile-game-active .poker-table :is(.mobile-opp-avatar,.mobile-me-avatar,.mobile-extra-avatar,.mobile-extra-mini-avatar) {width:44px!important;height:44px!important;top:-32px}
 body.mobile-game-active .poker-table :is(.mobile-me-avatar,.mobile-opp-avatar) {top:5px;left:-18px}
 body.mobile-game-active .poker-table .mobile-me-cards {top:-55px}
 body.mobile-game-active .poker-table .mobile-me-cards .card {width:54px!important;height:76px!important}
 body.mobile-game-active .poker-table :is(.mobile-opp-cards,.mobile-extra-cards) .card {width:27px!important;height:38px!important}
 body.mobile-game-active .poker-table :is(.chip-disc,.chip-disc2) {width:18px;height:18px}
 body.mobile-game-active .poker-table .chip-col :is(.chip-disc,.chip-disc2):not(:last-child) {margin-bottom:-13px}
 body.mobile-game-active .poker-table .bet-stack-amount {font-size:12px;line-height:16px}
}
@media all {
 body.mobile-game-active .poker-table .mobile-extra-cards {top:-27px}
}
@media(min-width:600px) {
 body.mobile-game-active .poker-table .mobile-extra-cards {top:-36px}
}
/* Landscape uses the available width while portrait keeps its vertical oval. */
@media(min-width:600px) and (orientation:landscape) {
 body.mobile-game-active .table-rail {max-width:1180px;width:calc(100% - 48px);padding-inline:80px}
}
/* Fit the visible browser viewport; never push actions below Safari's toolbar. */
body.mobile-game-active {overflow:hidden;overscroll-behavior:none}
body.mobile-game-active #table-screen {position:fixed;inset:0;width:100%;min-width:0;max-width:none;height:var(--game-visible-height,100dvh);min-height:0;max-height:none;transform:none;overflow:hidden;box-sizing:border-box}
body.mobile-game-active .table-header {padding-top:env(safe-area-inset-top);box-sizing:border-box}
body.mobile-game-active .table-area {min-height:0;min-width:0;overflow:visible}
body.mobile-game-active .table-rail {min-height:0;height:100%;max-height:760px;padding-block:54px 40px;background:none;border:0;box-shadow:none;border-radius:0}
body.mobile-game-active .table-rail::before,body.mobile-game-active .table-rail::after {display:none}
body.mobile-game-active .poker-table {min-height:0;outline:none;box-shadow:0 0 0 6px #20222a,0 0 0 9px #47434b,0 12px 32px #0007,inset 0 0 45px #0005}
body.mobile-game-active .bottom-zone {flex:0 0 auto;min-height:0;height:auto!important;padding:6px max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));background:var(--bg-card,#101726);z-index:25}
body.mobile-game-active .bottom-zone-main {position:static;width:100%;height:auto;transform:none}
body.mobile-game-active .action-main {height:auto;padding:0}
body.mobile-game-active .action-status-strip {display:none}
body.mobile-game-active .action-btn-grid {padding:0;gap:6px}
body.mobile-game-active .action-btn-grid .btn-action {flex:1;height:var(--act-h,48px)!important;min-height:var(--act-h,48px);font-size:16px!important}   /* was 12px: "waay too small" (Shaun, 2026-10-17) */
body.mobile-game-active .action-btn-grid .btn-action-sub {font-size:18px;line-height:1.15}
/* Every action button right of the settings button is the same width, however many there are (Shaun, 2026-10-17); style.css
   gives Fold / Check / Bet 0.7 / 1.4 / 1.1 shares by id, so this answers by id too */
body.mobile-game-active .action-btn-grid :is(#btn-fold,#btn-check,#btn-bet) {flex:1 1 0}   /* the bet / raise amount, a size up from its label */
body.mobile-game-active .sizing-row :is(#btn-allin,.btn-quick:not(.btn-bb-step)) {font-size:14px}   /* Pot, All In: were 10-11px */
body.mobile-game-active .btn-fold[style*="visibility: hidden"] {display:none!important}
body.mobile-game-active #sizing-row {height:44px;min-height:44px;padding:6px 0 0;gap:5px}
body.mobile-game-active #sizing-row .btn-quick {height:38px;min-height:38px;padding-inline:4px}
body.mobile-game-active #sizing-row :is(.bet-input,.bet-slider) {display:none}
body.mobile-game-active #sizing-row #bet-dec {order:0}
body.mobile-game-active #sizing-row #quick-bets {order:1;min-width:0;flex:3;gap:5px}
body.mobile-game-active #sizing-row #btn-allin {order:2;flex:1}
body.mobile-game-active #sizing-row #bet-inc {order:3}
body.mobile-game-active button {-webkit-tap-highlight-color:transparent}
@media(max-height:740px) and (orientation:portrait) {
 body.mobile-game-active .table-rail {padding-block:48px 36px}
 body.mobile-game-active .poker-table :is(.mobile-extra-cards,.mobile-opp-cards) .card {width:18px!important;height:25px!important}
 body.mobile-game-active .poker-table .mobile-extra-cards {top:-24px}
 body.mobile-game-active .poker-table .mobile-me-cards {top:-36px}
 body.mobile-game-active .poker-table .mobile-me-cards .card {width:36px!important;height:52px!important}
 body.mobile-game-active .community-cards .card {width:clamp(30px,9vw,36px)!important;height:clamp(43px,12.9vw,52px)!important}
}
/* Short landscape phones use a side action panel, leaving the table full-height. */
@media(max-height:520px) and (orientation:landscape) {
 body.mobile-game-active #table-screen {display:grid!important;grid-template-columns:minmax(0,1fr) 220px;grid-template-rows:calc(40px + env(safe-area-inset-top)) minmax(0,1fr)}
 body.mobile-game-active .table-header {grid-column:1 / -1;height:calc(40px + env(safe-area-inset-top));padding-inline:max(12px,env(safe-area-inset-left)) max(12px,env(safe-area-inset-right))}
 body.mobile-game-active .table-area {grid-column:1;grid-row:2;padding:0}
 body.mobile-game-active .table-rail {width:100%;padding:42px 60px 34px}
 body.mobile-game-active .bottom-zone {grid-column:2;grid-row:2;border-top:0;border-left:1px solid #ffffff14;display:flex;justify-content:center;padding:12px max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) 12px}
 body.mobile-game-active .bottom-zone-main {flex:0 0 auto}
 body.mobile-game-active .action-btn-grid {flex-direction:column;align-items:stretch}
 body.mobile-game-active .action-btn-grid .btn-action {flex:none;width:100%;height:var(--act-h,44px)!important;min-height:var(--act-h,44px)}
 body.mobile-game-active #sizing-row {display:flex;flex-wrap:wrap;height:auto;min-height:0}
 body.mobile-game-active #sizing-row #quick-bets {flex:1 0 55%}
 body.mobile-game-active #sizing-row :is(#bet-dec,#bet-inc) {flex:0 0 32px}
 body.mobile-game-active #sizing-row #btn-allin {flex:1}
 body.mobile-game-active .poker-table :is(.mobile-extra-cards,.mobile-opp-cards) {top:-22px}
 body.mobile-game-active .poker-table :is(.mobile-extra-cards,.mobile-opp-cards) .card {width:16px!important;height:22px!important}
 body.mobile-game-active .poker-table .mobile-me-cards {top:-28px}
 body.mobile-game-active .poker-table .mobile-me-cards .card {width:28px!important;height:40px!important}
 body.mobile-game-active .community-cards .card {width:28px!important;height:40px!important}
 body.mobile-game-active .poker-table :is(.chip-disc,.chip-disc2) {width:11px;height:11px}
 body.mobile-game-active .poker-table .chip-col :is(.chip-disc,.chip-disc2):not(:last-child) {margin-bottom:-8px}
 body.mobile-game-active .poker-table .bet-stack-amount {font-size:10px;line-height:12px}
}
body.mobile-game-active .bottom-zone {background:rgba(8,15,26,.97)}
body.mobile-game-active .action-panel .btn-check[data-action="call"] {background:#233b57;border-color:#46617c;color:#edf4fb;box-shadow:inset 0 1px 0 #ffffff0d}
body.mobile-game-active .action-panel .btn-bet {background:linear-gradient(180deg,#e1bc7f,#cea05d);border-color:#edcc94;color:#211b13}
/* Four-seat side plaques clear the board even with expanded browser toolbars. */
body.mobile-game-active .mobile-extra-strip--top {--seat-x:94.9%;--seat-y:28%}
body.mobile-game-active .mobile-extra-strip--bot {--seat-x:5.1%;--seat-y:28%}
@media(max-height:520px) and (orientation:landscape) {
 body.mobile-game-active #sizing-row {display:grid;grid-template-columns:32px 1fr 1fr 32px;gap:5px}
 body.mobile-game-active #sizing-row #quick-bets {display:contents}
 body.mobile-game-active #sizing-row #bet-dec {grid-column:1;grid-row:1}
 body.mobile-game-active #sizing-row #bet-inc {grid-column:4;grid-row:1}
 body.mobile-game-active #sizing-row #btn-allin {grid-column:1 / -1;grid-row:2}
}

/* Keep rail avatars clear of the first line of player text. */
body.mobile-game-active .poker-table :is(.mobile-extra-avatar,.mobile-extra-mini-avatar) {top:auto;bottom:calc(100% - 4px)}

/* Heads-up strips: the avatar sits inside the plaque as a square, flush left,
   like the desktop plaques, instead of a circle hanging off the edge (Shaun:
   the circle "breaks the style and highlighting and timer bar"). The
   !important is needed to beat the circle layout's own !important rules above. */
body.mobile-game-active .poker-table :is(.mobile-me-left,.mobile-opp-strip-left) {flex-direction:row!important;align-items:stretch!important;justify-content:flex-start!important;padding:0!important;gap:0!important;border-radius:5px}
body.mobile-game-active .poker-table :is(.mobile-me-left,.mobile-opp-strip-left) .mob-av-wrap {position:static!important;display:flex;align-self:stretch;width:auto!important;height:auto!important;flex:0 0 auto!important;margin:0!important}
body.mobile-game-active .poker-table :is(#mobile-me-avatar,#mobile-opp-avatar) {position:static!important;left:auto!important;top:auto!important;transform:none!important;width:52px!important;height:52px!important;border:0!important;border-right:1px solid #ffffff14!important;border-radius:5px 0 0 5px;object-fit:cover;display:block}
body.mobile-game-active .poker-table :is(.mobile-me-info,.mobile-opp-info) {flex:1 1 auto;align-items:flex-start!important;justify-content:center!important;padding:6px 14px 8px 10px!important;text-align:left}
/* Desktop plaque as the reference: fixed height, the avatar exactly fills it
   (height minus the 1px border), timer bar under the text, never over the photo. */
body.mobile-game-active .poker-table :is(#mobile-me-strip,#mobile-opp-strip) {width:188px!important;height:54px!important}
body.mobile-game-active .poker-table :is(#mobile-me-strip,#mobile-opp-strip) :is(.mobile-me-left,.mobile-opp-strip-left) {height:52px!important}
body.mobile-game-active .poker-table :is(#mobile-me-timer-wrap,#mobile-opp-timer-wrap) {left:62px!important;right:10px!important;bottom:4px!important}
body.mobile-game-active .poker-table :is(.mobile-extra-strip,.mobile-extra-mini) .mobile-strip-timer-wrap {left:54px!important;right:8px!important;bottom:3px!important}
body.mobile-game-active .poker-table :is(.mobile-opp-name,.mobile-me-name,.mobile-extra-name,.mobile-extra-mini-name) {max-width:118px}
/* Same square in-plaque avatar for the 4- and 6-seat mobile plaques. Their
   plaques are 48px tall, so the avatar is 46px (inside the 1px border), and
   they size to the screen so the side seats stay on a phone. */
body.mobile-game-active .poker-table .mobile-extra-strip-inner {display:flex!important;flex-direction:row!important;align-items:stretch!important;justify-content:flex-start!important;padding:0!important;gap:0!important;height:100%;width:100%}
body.mobile-game-active .poker-table .mobile-extra-mini {flex-direction:row!important;align-items:stretch!important;justify-content:flex-start!important;padding:0!important}
body.mobile-game-active .poker-table :is(.mobile-extra-avatar,.mobile-extra-mini-avatar) {position:static!important;left:auto!important;top:auto!important;bottom:auto!important;transform:none!important;flex:0 0 auto;width:46px!important;height:46px!important;border:0!important;border-right:1px solid #ffffff14!important;border-radius:5px 0 0 5px;object-fit:cover;display:block}
body.mobile-game-active .poker-table :is(.mobile-extra-info,.mobile-extra-mini-info) {flex:1 1 auto;align-items:flex-start!important;justify-content:center!important;padding:4px 8px 5px 7px!important;text-align:left;min-width:0}
body.mobile-game-active .poker-table :is(.mobile-extra-name,.mobile-extra-mini-name,.mobile-extra-stack,.mobile-extra-mini-stack) {line-height:1.3;max-width:100%}
body.mobile-game-active .poker-table :is(.mobile-extra-strip,.mobile-extra-mini) {width:clamp(112px,31vw,164px)!important}
/* 4- and 6-seat tables: the top seat matches every other opponent plaque
   (same width, height and avatar); a long name ends in an ellipsis. */
body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-strip {width:clamp(112px,31vw,164px)!important;height:48px!important}
body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-strip .mobile-opp-strip-left {height:46px!important}
body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-avatar {width:46px!important;height:46px!important}
body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-strip .mobile-opp-info {padding:4px 8px 5px 7px!important}
body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-strip :is(.mobile-opp-name,.mobile-opp-stack) {line-height:1.3;max-width:100%}
body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-timer-wrap {left:54px!important;right:8px!important;bottom:3px!important}

/* Phone plaques keep square avatars but reserve more room for names. */
@media(max-width:599px) {
 body.mobile-game-active .poker-table :is(.mobile-extra-avatar,.mobile-extra-mini-avatar),
 body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-avatar {width:36px!important;object-fit:cover}
 body.mobile-game-active .poker-table :is(.mobile-extra-info,.mobile-extra-mini-info),
 body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-strip .mobile-opp-info {padding-left:6px!important;padding-right:5px!important}
 body.mobile-game-active .poker-table :is(.mobile-extra-strip,.mobile-extra-mini) .mobile-strip-timer-wrap,
 body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-timer-wrap {left:42px!important}
}
@media(max-width:359px) {
 body.mobile-game-active #table-screen .community-cards .card {width:26px!important;height:38px!important}
 body.mobile-game-active #table-screen .poker-table .bet-stack {min-width:28px;max-width:28px}
 body.mobile-game-active .poker-table .bet-stack-amount {font-size:10px;padding-inline:3px}
 body.mobile-game-active .poker-table :is(.chip-disc,.chip-disc2) {width:12px;height:12px}
}
@media(max-width:359px) {
 body.mobile-game-active :is(#mobile-extra-mini1-strip,#mobile-extra-mini2-strip) {--seat-y:21%}
 body.mobile-game-active :is(#mobile-extra-mini0-strip,#mobile-extra-mini3-strip) {--seat-y:79%}
 body.mobile-game-active :is(.mobile-extra-strip--top,.mobile-extra-strip--bot) {--seat-y:22%}
}
/* Compact phone plaques use genuinely square portraits and a consistent text inset. */
@media(max-width:599px) {
 body.mobile-game-active .poker-table :is(.mobile-extra-strip,.mobile-extra-mini) {height:40px!important;min-height:40px!important}
 body.mobile-game-active .poker-table :is(.mobile-extra-avatar,.mobile-extra-mini-avatar),
 body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-avatar {width:38px!important;height:38px!important}
 body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-strip {height:40px!important}
 body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-strip .mobile-opp-strip-left {height:38px!important}
}
@media(max-width:599px) and (max-height:600px) {
 body.mobile-game-active #table-screen .community-cards .card {width:26px!important;height:38px!important}
 body.mobile-game-active #table-screen .poker-table .bet-stack {min-width:28px;max-width:28px}
 body.mobile-game-active .poker-table .bet-stack-amount {font-size:10px;padding-inline:3px}
 body.mobile-game-active .poker-table :is(.chip-disc,.chip-disc2) {width:12px;height:12px}
}
@media(max-height:520px) and (orientation:landscape) {
 body.mobile-game-active .poker-table :is(.mobile-extra-strip,.mobile-extra-mini),
 body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-strip {width:116px!important;height:40px!important;min-height:40px!important}
 body.mobile-game-active .poker-table :is(.mobile-extra-avatar,.mobile-extra-mini-avatar),
 body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-avatar {width:38px!important;height:38px!important}
 body.mobile-game-active .poker-table:not([data-count="2"]) #mobile-opp-strip .mobile-opp-strip-left {height:38px!important}
 body.mobile-game-active .poker-table :is(.mobile-extra-name,.mobile-extra-mini-name,.mobile-opp-name) {font-size:10px}
 body.mobile-game-active .poker-table :is(.mobile-extra-stack,.mobile-extra-mini-stack,.mobile-opp-stack) {font-size:11px}
 body.mobile-game-active .poker-table :is(.mobile-extra-info,.mobile-extra-mini-info) {padding-left:6px!important;padding-right:5px!important}
 body.mobile-game-active .poker-table :is(.mobile-extra-strip,.mobile-extra-mini) .mobile-strip-timer-wrap {left:44px!important}
}

/* The mobile rail is painted around the oval felt, never its rectangular wrapper.
   Explicitly reset every painted layer, including theme and Safari outlines. */
body.mobile-game-active #table-screen .table-rail {
 background:transparent!important;border:0!important;outline:0!important;box-shadow:none!important;
 padding-top:70px;
}
body.mobile-game-active #table-screen .table-rail::before,
body.mobile-game-active #table-screen .table-rail::after {content:none!important;display:none!important;box-shadow:none!important;border:0!important;background:none!important}
body.mobile-game-active #table-screen .poker-table {outline:none!important}

/* All hole-card pairs share the hero's scale and exposed height. */
body.mobile-game-active #table-screen {--hole-width:43px;--hole-height:61px;--hole-peek:43px}
body.mobile-game-active #table-screen .poker-table :is(.mobile-opp-cards,.mobile-extra-cards,.mobile-me-cards) {
 left:50%!important;right:auto!important;top:calc(-1 * var(--hole-peek))!important;bottom:auto!important;
 transform:translateX(-50%)!important;translate:none!important;rotate:none!important;
 gap:4px!important;z-index:-1;
}
body.mobile-game-active #table-screen .poker-table :is(.mobile-opp-cards,.mobile-extra-cards,.mobile-me-cards) .card {
 width:var(--hole-width)!important;height:var(--hole-height)!important;border-radius:5px;
}
body.mobile-game-active #table-screen .mobile-extra-strip-inner {position:relative;z-index:1;background:inherit;border-radius:inherit}
@media(min-width:600px) and (min-height:521px) {
 body.mobile-game-active #table-screen {--hole-width:54px;--hole-height:76px;--hole-peek:55px}
 body.mobile-game-active #table-screen .table-rail {padding-top:84px}
}
@media(max-width:599px) and (max-height:600px) {
 body.mobile-game-active #table-screen {--hole-width:36px;--hole-height:52px;--hole-peek:36px}
 body.mobile-game-active #table-screen .table-rail {padding-top:64px}
}
@media(max-height:520px) and (orientation:landscape) {
 body.mobile-game-active #table-screen {--hole-width:28px;--hole-height:40px;--hole-peek:28px}
 body.mobile-game-active #table-screen .table-rail {padding-top:58px}
}
body.mobile-game-active #table-screen[data-variant="omaha"] {--hole-width:30px;--hole-height:44px;--hole-peek:32px}
body.mobile-game-active #table-screen[data-variant="omaha"] .poker-table :is(.mobile-opp-cards,.mobile-extra-cards,.mobile-me-cards) {gap:2px!important}
body.mobile-game-active #table-screen .mobile-extra-mini::before {content:'';position:absolute;inset:0;z-index:0;background:inherit;border-radius:inherit;pointer-events:none}
body.mobile-game-active #table-screen .mobile-extra-mini :is(.mobile-extra-mini-avatar,.mobile-extra-mini-info) {position:relative!important;z-index:1}
/* Four-seat cards live inside this wrapper: cover their tucked portion while
   keeping the portrait, name and stack above the opaque plaque face. */
body.mobile-game-active #table-screen .mobile-extra-strip-inner::before {content:'';position:absolute;inset:0;background:inherit;border-radius:inherit;z-index:0;pointer-events:none}
body.mobile-game-active #table-screen .mobile-extra-strip-inner > :is(.mobile-extra-avatar,.mobile-extra-info) {position:relative!important;z-index:1}

/* Paint the plaque outline above tucked cards and the opaque face. */
body.mobile-game-active #table-screen .poker-table :is(.mobile-opp-strip,.mobile-me-strip,.mobile-extra-strip,.mobile-extra-mini)::after {
 content:'';position:absolute;inset:-1px;border:1px solid;border-color:inherit;
 border-radius:inherit;background:none;z-index:20;pointer-events:none;
}
/* Six seats need a quieter footprint on phones, without shrinking touch controls. */
@media(max-width:599px) {
 body.mobile-game-active #table-screen .poker-table[data-count="6"] {--hole-width:36px;--hole-height:52px;--hole-peek:36px}
 body.mobile-game-active #table-screen .poker-table[data-count="6"] :is(.mobile-extra-mini,#mobile-opp-strip) {width:clamp(104px,29vw,116px)!important;height:36px!important;min-height:36px!important}
 body.mobile-game-active #table-screen .poker-table[data-count="6"] .mobile-opp-strip-left {height:34px!important}
 body.mobile-game-active #table-screen .poker-table[data-count="6"] :is(.mobile-extra-mini-avatar,#mobile-opp-avatar) {width:34px!important;height:34px!important}
 body.mobile-game-active #table-screen .poker-table[data-count="6"] :is(.mobile-extra-mini-name,.mobile-opp-name) {font-size:10px}
 body.mobile-game-active #table-screen .poker-table[data-count="6"] :is(.mobile-extra-mini-info,.mobile-opp-info) {padding:3px 5px 5px 6px!important}
 body.mobile-game-active #table-screen .poker-table[data-count="6"] #mobile-me-strip {width:164px!important;height:46px!important}
 body.mobile-game-active #table-screen .poker-table[data-count="6"] .mobile-me-left {height:44px!important}
 body.mobile-game-active #table-screen .poker-table[data-count="6"] #mobile-me-avatar {width:44px!important;height:44px!important}
 body.mobile-game-active #table-screen .poker-table[data-count="6"] #mobile-me-timer-wrap {left:54px!important}
 body.mobile-game-active #table-screen .poker-table[data-count="6"] .community-cards .card {width:clamp(26px,9vw,36px)!important;height:clamp(38px,12.8vw,50px)!important}
}
/* Hide the tucked card pixels before the plaque edge, independently of Safari
   stacking contexts. The existing foreground outline remains uninterrupted. */
body.mobile-game-active #table-screen .poker-table :is(.mobile-opp-cards,.mobile-extra-cards,.mobile-me-cards) {
 clip-path:inset(-24px -24px calc(var(--hole-height) - var(--hole-peek) + 2px) -24px);
}
@media(max-width:599px) and (orientation:portrait) {
 body.mobile-game-active #table-screen .table-rail {padding-inline:56px;padding-bottom:30px}
 body.mobile-game-active #table-screen .poker-table #mobile-me-strip,
 body.mobile-game-active #table-screen .poker-table[data-count="2"] #mobile-opp-strip {width:156px!important;height:46px!important}
 body.mobile-game-active #table-screen .poker-table .mobile-me-left,
 body.mobile-game-active #table-screen .poker-table[data-count="2"] .mobile-opp-strip-left {height:44px!important}
 body.mobile-game-active #table-screen .poker-table #mobile-me-avatar,
 body.mobile-game-active #table-screen .poker-table[data-count="2"] #mobile-opp-avatar {width:44px!important;height:44px!important}
 body.mobile-game-active #table-screen .poker-table :is(.mobile-me-info,.mobile-opp-info) {padding-left:7px!important;padding-right:6px!important}
 body.mobile-game-active #table-screen .poker-table :is(#mobile-me-timer-wrap,#mobile-opp-timer-wrap) {left:51px!important}
 body.mobile-game-active #table-screen .poker-table[data-count="4"] :is(.mobile-extra-strip,#mobile-opp-strip) {width:clamp(102px,28vw,112px)!important;height:36px!important;min-height:36px!important}
 body.mobile-game-active #table-screen .poker-table[data-count="4"] .mobile-opp-strip-left {height:34px!important}
 body.mobile-game-active #table-screen .poker-table[data-count="4"] :is(.mobile-extra-avatar,#mobile-opp-avatar) {width:34px!important;height:34px!important}
 body.mobile-game-active #table-screen .poker-table[data-count="4"] :is(.mobile-extra-info,.mobile-opp-info) {padding:3px 5px 5px 6px!important}
}
@media(max-width:359px) and (orientation:portrait) {
 body.mobile-game-active #table-screen .table-rail {padding-inline:46px}
}

/* Installed iOS app uses its full dynamic viewport, with safe-area padding
   applied only by the header and action bar. No browser-toolbar reservation. */
@media(display-mode:standalone) {
 /* Not the lesson's table (body.larrys-table): it sits in its own row above Larry's strip, and at the app's full height
    your seat and the buttons went under the strip (Shaun, 2026-10-15) */
 body.mobile-game-active:not(.larrys-table) #table-screen {height:100dvh!important}
 body.mobile-game-active:not(.larrys-table) #table-screen .table-rail {max-height:none}
}

/* Full-bleed mobile felt. The play area is the sizing container, so browser
   chrome and the action dock cannot steal room from the seat layout. */
body.mobile-game-active #table-screen .table-area {
  container-type:size;flex:1 1 0;min-height:0;padding:0!important;
  background:radial-gradient(ellipse at 50% 42%,#215743,#103c2d 75%)!important;
}
body.mobile-game-active #table-screen .table-rail {
  position:absolute;inset:0;width:100%!important;max-width:none!important;
  height:100%!important;max-height:none!important;min-height:0;
  padding:0!important;margin:0!important;
}
body.mobile-game-active #table-screen .table-rail .poker-table {
  --seat-width:clamp(112px,32cqw,148px);
  --seat-height:48px;
  --hole-width:40px;--hole-height:58px;--hole-peek:40px;
  --seat-inset:calc(var(--seat-width) / 2 + max(12px,env(safe-area-inset-left)));
  width:100%!important;height:100%!important;min-height:0!important;max-height:none!important;
  aspect-ratio:auto!important;border:0!important;border-radius:0!important;
  background:transparent!important;outline:0!important;box-shadow:none!important;
}
body.mobile-game-active #table-screen .table-rail .poker-table::before,
body.mobile-game-active #table-screen .table-rail .poker-table::after {display:none!important}
body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-opp-strip,.mobile-opp-strip,.mobile-me-strip,.mobile-extra-strip,.mobile-extra-mini) {
  width:var(--seat-width)!important;height:var(--seat-height)!important;min-height:var(--seat-height)!important;
  border-radius:6px;background:#11291f!important;box-shadow:0 3px 10px #0003!important;
}
body.mobile-game-active #table-screen .table-rail .poker-table #mobile-me-strip {width:var(--plaque-w,156px)!important}
body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-opp-strip .mobile-opp-strip-left,.mobile-me-left,.mobile-extra-strip-inner) {height:calc(var(--seat-height) - 2px)!important;padding:0!important;border-radius:inherit}
body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-opp-avatar,.mobile-opp-avatar,.mobile-me-avatar,.mobile-extra-avatar,.mobile-extra-mini-avatar) {
  width:calc(var(--seat-height) - 2px)!important;height:calc(var(--seat-height) - 2px)!important;border-radius:5px 0 0 5px;
}
body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-opp-strip .mobile-opp-info,.mobile-me-info,.mobile-extra-info,.mobile-extra-mini-info) {
  padding:4px 7px 6px!important;gap:2px!important;min-width:0;
}
body.mobile-game-active #table-screen .table-rail .poker-table :is(.mobile-opp-name,.mobile-me-name,.mobile-extra-name,.mobile-extra-mini-name) {font-size:13px;line-height:1.15;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}   /* 13px (Shaun, 2026-10-30: phone text too small); 1.15 so two lines still fit the 38px plaque */
body.mobile-game-active #table-screen .table-rail .poker-table :is(.mobile-opp-stack,.mobile-me-stack,.mobile-extra-stack,.mobile-extra-mini-stack,.mobile-opp-action,.mobile-me-action,.mobile-extra-action) {font-size:13px;line-height:1.15;max-width:100%}
body.mobile-game-active #table-screen .table-rail .poker-table .mobile-strip-timer-wrap {left:calc(var(--seat-height) + 5px)!important;right:7px!important;bottom:3px!important}
body.mobile-game-active #table-screen .table-rail .poker-table #mobile-opp-strip {--seat-x:50%;--seat-y:calc(var(--hole-peek) + var(--seat-height) / 2 + 14px)}
body.mobile-game-active #table-screen .table-rail .poker-table #mobile-me-strip {--seat-x:50%;--seat-y:calc(100% - var(--seat-height) / 2 - 16px)}
body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-extra-top-strip,#mobile-extra-mini1-strip) {--seat-x:calc(100% - var(--seat-inset));--seat-y:33%}
body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-extra-bot-strip,#mobile-extra-mini2-strip) {--seat-x:var(--seat-inset);--seat-y:33%}
body.mobile-game-active #table-screen .table-rail .poker-table #mobile-extra-mini0-strip {--seat-x:calc(100% - var(--seat-inset));--seat-y:74%}
body.mobile-game-active #table-screen .table-rail .poker-table #mobile-extra-mini3-strip {--seat-x:var(--seat-inset);--seat-y:74%}
body.mobile-game-active #table-screen .table-rail .poker-table .community-cards {gap:5px!important}
body.mobile-game-active #table-screen .table-rail .poker-table .community-cards .card {width:clamp(40px,12.5cqw,60px)!important;height:clamp(58px,18cqw,86px)!important}
body.mobile-game-active #table-screen .table-rail .poker-table .bet-stack-amount {font-size:14px;line-height:18px;padding:3px 6px;background:#0a251dba;border-radius:5px}
body.mobile-game-active #table-screen .table-rail .poker-table .pot-total {font-size:13.5px}   /* 18 -> 13.5 (Shaun, 2026-10-26: "the pot could be a bit smaller ... we didnt tone that down size wise" / "pots still a bit big") */
body.mobile-game-active #table-screen .table-rail .poker-table .pot-chips-side {padding-bottom:12px}
body.mobile-game-active #table-screen[data-variant="omaha"] .poker-table {--hole-width:29px;--hole-height:43px;--hole-peek:29px}
/* Keep the same proportions on shorter phones; never hide the action dock. */
@container (max-height:520px) {
  body.mobile-game-active #table-screen .table-rail .poker-table {--seat-height:40px;--hole-width:32px;--hole-height:46px;--hole-peek:30px}
  body.mobile-game-active #table-screen .table-rail .poker-table .community-cards .card {width:40px!important;height:58px!important}
  body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-extra-mini0-strip,#mobile-extra-mini3-strip) {--seat-y:73%}
  body.mobile-game-active #table-screen .table-rail .poker-table .pot-chips-side {padding-bottom:6px}
}
/* Landscape phones keep the established side action dock. Put six seats
   in two even rows so the shallow felt still has an open central board. */
@media(max-height:520px) and (orientation:landscape) {
  body.mobile-game-active #table-screen .table-rail .poker-table {--seat-width:clamp(104px,23cqw,140px);--seat-height:40px;--hole-width:30px;--hole-height:44px;--hole-peek:28px}
  body.mobile-game-active #table-screen .table-rail .poker-table[data-count="6"] :is(#mobile-extra-mini1-strip,#mobile-extra-mini2-strip,#mobile-opp-strip) {--seat-y:68px}
  body.mobile-game-active #table-screen .table-rail .poker-table[data-count="6"] :is(#mobile-extra-mini0-strip,#mobile-extra-mini3-strip) {--seat-y:calc(100% - 36px)}
  body.mobile-game-active #table-screen .table-rail .poker-table .community-cards .card {width:40px!important;height:58px!important}
}
body.mobile-game-active #table-screen .table-rail .poker-table[data-count="4"] :is(#mobile-extra-top-strip,#mobile-extra-bot-strip) {--seat-y:40%}

/* Mobile controls float in the corners; player hands always stay above plaques. */
body.mobile-game-active #table-screen .table-header {position:absolute!important;inset:0 0 auto!important;height:calc(48px + env(safe-area-inset-top))!important;padding:env(safe-area-inset-top) max(8px,env(safe-area-inset-right)) 0 max(10px,env(safe-area-inset-left))!important;background:#101618!important;border:0!important;border-bottom:1px solid #ffffff0c!important;box-shadow:none!important;pointer-events:none;z-index:40}
body.mobile-game-active #table-screen .table-header :is(.header-left,.header-right,.header-nav) {pointer-events:auto}
body.mobile-game-active #table-screen .table-header .brand img {width:102px;height:auto;max-width:102px}   /* 10% bigger (Shaun, 2026-10-15), a hair more (2026-10-26: "can we make the logo a hair bigger too its a bit tiny and we have some room") */
body.mobile-game-active #table-screen .table-header .header-center {visibility:hidden;pointer-events:none}
body.mobile-game-active #table-screen .btn-hamburger {width:44px!important;height:44px!important;border-radius:10px;background:#0b2c2166!important}
body.mobile-game-active #table-screen .table-rail {container-type:size;top:env(safe-area-inset-top)!important;height:calc(100% - env(safe-area-inset-top))!important}
body.mobile-game-active #table-screen .table-rail .poker-table .mobile-me-cards {--hole-width:54px;--hole-height:78px;--hole-peek:58px;gap:5px!important}
body.mobile-game-active #table-screen[data-variant="omaha"] .table-rail .poker-table .mobile-me-cards {--hole-width:34px;--hole-height:50px;--hole-peek:40px;gap:2px!important}
body.mobile-game-active #table-screen .table-rail .poker-table :is(.chip-disc,.chip-disc2) {width:var(--chip-d,20px)!important;height:var(--chip-d,20px)!important}
body.mobile-game-active #table-screen .table-rail .poker-table .chip-col :is(.chip-disc,.chip-disc2):not(:last-child) {margin-bottom:var(--chip-mb,-14px)!important}
body.mobile-game-active #table-screen .table-rail .poker-table #mobile-opp-strip {--seat-y:calc(var(--hole-peek) + var(--seat-height) / 2 + 10px)}
body.mobile-game-active #table-screen .table-rail .poker-table #mobile-me-strip {--seat-y:calc(100% - var(--seat-height) / 2 - 10px)}
/* Edge-attached seats keep the middle of the felt open. */
body.mobile-game-active #table-screen .table-rail .poker-table {--seat-inset:calc(var(--seat-width) / 2)}
body.mobile-game-active #table-screen .table-rail .poker-table[data-count="6"] {--seat-width:clamp(100px,29cqw,132px)}
body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-extra-bot-strip,#mobile-extra-mini2-strip,#mobile-extra-mini3-strip) {border-radius:0 6px 6px 0}
body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-extra-top-strip,#mobile-extra-mini1-strip,#mobile-extra-mini0-strip) {border-radius:6px 0 0 6px}
body.mobile-game-active #table-screen .table-rail .poker-table #mobile-me-strip {--seat-y:calc(100% - var(--seat-height) / 2);border-radius:6px 6px 0 0}
body.mobile-game-active #table-screen .table-rail .poker-table .mobile-me-cards {--hole-width:58px;--hole-height:84px;--hole-peek:64px}
body.mobile-game-active #table-screen[data-variant="omaha"] .table-rail .poker-table .mobile-me-cards {--hole-width:46px;--hole-height:66px;--hole-peek:50px}
@container(max-height:560px) {
 body.mobile-game-active #table-screen .table-rail .poker-table {--seat-height:40px;--hole-width:30px;--hole-height:44px;--hole-peek:28px}
 body.mobile-game-active #table-screen .table-rail .poker-table .mobile-me-cards {--hole-width:54px;--hole-height:78px;--hole-peek:58px}
 body.mobile-game-active #table-screen .table-rail .poker-table .community-cards .card {width:clamp(40px,12.5cqw,50px)!important;height:clamp(58px,18cqw,72px)!important}
 body.mobile-game-active #table-screen .table-rail .poker-table .community-area {top:var(--slot-board,51%)}   /* where positionCommunity puts it, before the first deal too */
 body.mobile-game-active #table-screen .table-rail .poker-table .pot-chips-side {padding-bottom:6px}
}
@container(max-height:420px) {
 body.mobile-game-active #table-screen .table-rail .poker-table {--seat-height:36px;--hole-width:24px;--hole-height:34px;--hole-peek:20px}
 body.mobile-game-active #table-screen .table-rail .poker-table #mobile-opp-strip {--seat-y:calc(var(--hole-peek) + var(--seat-height) / 2 + 6px)}
 body.mobile-game-active #table-screen .table-rail .poker-table .mobile-me-cards {--hole-width:48px;--hole-height:68px;--hole-peek:50px}
 body.mobile-game-active #table-screen .table-rail .poker-table .community-area {top:var(--slot-board,53%)}
 body.mobile-game-active #table-screen[data-variant="omaha"] .table-rail .poker-table .mobile-me-cards {--hole-width:40px;--hole-height:58px;--hole-peek:44px}
 body.mobile-game-active #table-screen[data-variant="omaha"] .table-rail .poker-table :is(.mobile-extra-cards,.mobile-opp-cards) {--hole-width:19px;--hole-height:28px;--hole-peek:20px}
}
@media(max-height:520px) and (orientation:landscape) {
 body.mobile-game-active #table-screen {grid-template-rows:minmax(0,1fr)!important}
 body.mobile-game-active #table-screen :is(.table-area,.bottom-zone) {grid-row:1!important}
}
/* A compact chip-and-amount row reads as one bet, centered on its seat. */
body.mobile-game-active #table-screen .table-rail .poker-table .bet-stack {flex-direction:row!important;align-items:center!important;gap:4px!important;min-width:0!important;max-width:none!important}
body.mobile-game-active #table-screen .table-rail .poker-table .bet-stack-amount {padding:2px 4px;background:transparent}
@container(max-height:420px) {
 body.mobile-game-active #table-screen .table-rail .poker-table[data-count="6"] {--seat-width:88px}
}
body.mobile-game-active #table-screen .table-rail .poker-table[data-count="4"] :is(#mobile-extra-top-strip,#mobile-extra-bot-strip) {--seat-y:33%}
body.mobile-game-active #table-screen[data-variant="omaha"] .table-rail .poker-table :is(.mobile-extra-cards,.mobile-opp-cards) {--hole-width:24px;--hole-height:36px;--hole-peek:26px;gap:2px!important}
@container(max-height:420px) {
 body.mobile-game-active #table-screen[data-variant="omaha"] .table-rail .poker-table :is(.mobile-extra-cards,.mobile-opp-cards) {--hole-width:19px;--hole-height:28px;--hole-peek:20px}
}
body.mobile-game-active #table-screen .table-rail .poker-table .bet-stack {width:max-content!important;transform:none!important}
@media(max-height:520px) and (orientation:landscape) {
 body.mobile-game-active #table-screen .table-header {left:74%!important;width:26%!important}
 body.mobile-game-active #table-screen .table-header .brand img {width:70px!important;max-width:70px!important}
 body.mobile-game-active #table-screen .table-rail .poker-table[data-count="6"] {--seat-width:112px}
}

/* Frame the four-card hand with a ten-pixel plaque margin on either side. */
body.mobile-game-active #table-screen[data-variant="omaha"] .table-rail .poker-table #mobile-me-strip {width:210px!important}
@container(max-height:420px) {
 body.mobile-game-active #table-screen[data-variant="omaha"] .table-rail .poker-table #mobile-me-strip {width:186px!important}
}
/* Attached edges have no outline; the exposed edges retain turn emphasis. */
body.mobile-game-active #table-screen .table-rail .poker-table #mobile-me-strip {border-bottom-color:transparent!important}
body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-extra-bot-strip,#mobile-extra-mini2-strip,#mobile-extra-mini3-strip) {border-left-color:transparent!important}
body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-extra-top-strip,#mobile-extra-mini1-strip,#mobile-extra-mini0-strip) {border-right-color:transparent!important}
/* A bet's chips are as wide as their columns (Shaun, 2026-10-04: "that chips overlap"): capped at 60px, a four-colour
   all-in spilled past its own box, over the amount or off the screen edge, and the bet placement (positionBetStacks,
   which measures the box) couldn't see it. */
body.mobile-game-active #table-screen .poker-table .bet-stack .chip-tower {max-width:none;flex:none}
body.mobile-game-active #table-screen .poker-table .bet-stack .chip-col {flex:none}

/* ── Fixed slots (Shaun, 2026-10-04 mock: "distinct spots for everything so its consistent and nothing
   overlaps/moves"). Every seat, bet, the pot and the board has one place per table size; positionBetStacks()
   and positionCommunity() read the slot variables. Portrait (and tall landscape) only; short landscape phones keep
   their own rows above. The board's cards are the size of your own (--card-w/--card-h). */
@media (min-height:521px), (orientation:portrait) {
 body.mobile-game-active #table-screen .table-rail .poker-table {--card-w:58px;--card-h:84px;--slot-board:55%;--slot-pot:40%}
 /* With side seats the board sits under the pot row (side plaques at 36.5%, then their bets and the pot), 8px clear. */
 body.mobile-game-active #table-screen .table-rail .poker-table:is([data-count="4"],[data-count="6"]) {--slot-board:max(58.5%, calc(36.5% + var(--seat-height) / 2 + 52px + var(--card-h) / 2))}
 body.mobile-game-active #table-screen .table-rail .poker-table #mobile-opp-strip {--seat-y:max(17%, calc(var(--hole-peek) + var(--seat-height) / 2 + 10px))}
 body.mobile-game-active #table-screen .table-rail .poker-table:is([data-count="4"],[data-count="6"]) :is(#mobile-extra-top-strip,#mobile-extra-bot-strip,#mobile-extra-mini1-strip,#mobile-extra-mini2-strip) {--seat-y:36.5%}
 /* The lower side seats' cards stay 8px clear of the board. */
 body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-extra-mini0-strip,#mobile-extra-mini3-strip) {--seat-y:max(74.5%, calc(var(--slot-board) + var(--card-h) / 2 + 8px + var(--hole-peek) + var(--seat-height) / 2))}
 /* 6-max: the board halfway between the two side rows, as positionCommunity measures it, so it's there before the first
    deal and doesn't jump when the hand starts (Shaun, 2026-10-24: "the board is like jumping up and down") */
 body.mobile-game-active #table-screen .table-rail .poker-table[data-count="6"]:not(.dual-board-active) .community-area {top:calc((36.5% + max(74.5%, calc(var(--slot-board) + var(--card-h) / 2 + 8px + var(--hole-peek) + var(--seat-height) / 2))) / 2)}
 /* Heads-up: the opponent's plaque is the size of yours (--plaque-w: Larry's lesson narrows both, so bets fit beside them). */
 body.mobile-game-active #table-screen .table-rail .poker-table[data-count="2"] #mobile-opp-strip {width:var(--plaque-w,156px)!important}
 /* Your cards and the board are one size. */
 body.mobile-game-active #table-screen .table-rail .poker-table .mobile-me-cards {--hole-width:var(--card-w);--hole-height:var(--card-h);--hole-peek:calc(var(--card-h) * .76)}
 body.mobile-game-active #table-screen .table-rail .poker-table .community-cards {gap:6px!important}
 body.mobile-game-active #table-screen .table-rail .poker-table .community-cards .card {width:var(--card-w)!important;height:var(--card-h)!important}
 /* The turn timer runs along the bottom edge of the plaque, from the avatar to the end. */
 body.mobile-game-active #table-screen .table-rail .poker-table .mobile-strip-timer-wrap {left:calc(var(--seat-height) - 2px)!important;right:0!important;bottom:0!important;height:3px!important;border-radius:0 0 6px 0;overflow:hidden}
 body.mobile-game-active #table-screen .table-rail .poker-table #mobile-me-strip .mobile-strip-timer-wrap {border-radius:0!important}
 /* The dealer button sits just outside the plaque, on the felt side, level with it: never on the timer or cards. */
 body.mobile-game-active #table-screen .poker-table :is(#m-d-me,#m-d-opp,.mobile-seat-dealer) {top:var(--dealer-top,calc(50% - 10px))!important;bottom:auto!important;right:var(--dealer-x,-28px)!important;left:var(--dealer-left,auto)!important}
 body.mobile-game-active #table-screen .poker-table :is(#mobile-extra-top-strip,#mobile-extra-mini1-strip,#mobile-extra-mini0-strip) .mobile-seat-dealer {--dealer-x:auto;--dealer-left:-28px}
 /* The pot: one pill, sized with the bets around it. */
 body.mobile-game-active #table-screen .table-rail .poker-table .pot-chips-side {padding:0!important}
 body.mobile-game-active #table-screen .table-rail .poker-table .pot-total {font-size:13.5px}   /* 17 -> 13.5, with the smaller bets (2026-10-26) */
 @container (max-height:560px) {
  body.mobile-game-active #table-screen .table-rail .poker-table {--card-w:52px;--card-h:75px}
 }
 @container (max-height:480px) {
  body.mobile-game-active #table-screen .table-rail .poker-table {--card-w:46px;--card-h:66px;--hole-peek:22px}
 }
 @container (max-height:420px) {
  body.mobile-game-active #table-screen .table-rail .poker-table {--card-w:44px;--card-h:63px}
 }
}

/* Plaques that fit their text (Shaun, 2026-10-04 iPhone: names "cut off on the bottom", "Geo...", "$2....").
   Side seats are never narrower than 108px (the felt between them is free), the name and stack each get a full
   16px line that can't shrink, and a long name runs to the edge and fades instead of ending in dots. Cards round
   their corners in proportion to their size, so the small ones match yours. */
@media (min-height:521px), (orientation:portrait) {
 body.mobile-game-active #table-screen .table-rail .poker-table:is([data-count="2"],[data-count="4"],[data-count="6"]) {--seat-width:clamp(108px,33cqw,148px)}
 body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-opp-strip .mobile-opp-info,.mobile-me-info,.mobile-extra-info,.mobile-extra-mini-info) {padding:3px 6px 3px 7px!important;gap:0!important;justify-content:center!important}
 body.mobile-game-active #table-screen .table-rail .poker-table :is(.mobile-opp-name,.mobile-me-name,.mobile-extra-name,.mobile-extra-mini-name,.mobile-opp-stack,.mobile-me-stack,.mobile-extra-stack,.mobile-extra-mini-stack,.mobile-opp-action,.mobile-me-action,.mobile-extra-action) {flex:none!important;align-self:stretch;width:100%;font-size:13px;line-height:16px;height:16px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:clip!important}
 body.mobile-game-active #table-screen .table-rail .poker-table :is(.mobile-opp-name,.mobile-me-name,.mobile-extra-name,.mobile-extra-mini-name) {-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 8px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 8px),transparent)}
 body.mobile-game-active #table-screen .poker-table :is(.mobile-opp-cards,.mobile-extra-cards,.mobile-me-cards,.community-cards) .card {border-radius:calc(var(--hole-width, var(--card-w)) * .11)!important}
 body.mobile-game-active #table-screen .poker-table .community-cards .card {border-radius:calc(var(--card-w) * .11)!important}
 @container (max-height:420px) {
  body.mobile-game-active #table-screen .table-rail .poker-table:is([data-count="2"],[data-count="4"],[data-count="6"]) {--seat-width:clamp(108px,33cqw,148px);--seat-height:40px}
 }
 /* Very short tables (a zoomed iPhone): the side seats sit a little higher and the cards a size smaller, so the
    lower side seats' bets stay clear of your plaque. */
 @container (max-height:450px) {
  body.mobile-game-active #table-screen .table-rail .poker-table {--card-w:40px;--card-h:57px;--hole-peek:18px}
  body.mobile-game-active #table-screen .table-rail .poker-table:is([data-count="4"],[data-count="6"]) :is(#mobile-extra-top-strip,#mobile-extra-bot-strip,#mobile-extra-mini1-strip,#mobile-extra-mini2-strip) {--seat-y:33%}
  body.mobile-game-active #table-screen .table-rail .poker-table:is([data-count="4"],[data-count="6"]) {--slot-board:max(58.5%, calc(33% + var(--seat-height) / 2 + 52px + var(--card-h) / 2))}
  body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-extra-mini0-strip,#mobile-extra-mini3-strip) {--seat-y:max(74.5%, calc(var(--slot-board) + var(--card-h) / 2 + 3px + var(--hole-peek) + var(--seat-height) / 2))}
 }
}

/* One corner button on phones: your avatar opens the table menu (assets/table.js bindAvatarMenu). No hamburger, no
   separate fullscreen button (it's a menu item, Android only: it shows when the old button would), and no Hand
   History on the phone layout (Shaun, 2026-10-04). */
body.mobile-game-active #table-screen :is(#btn-hamburger,#btn-fullscreen,#avatar-menu-dropdown) {display:none!important}
body.mobile-game-active #table-screen .header-nav .btn-header-capped {display:none!important}
body.mobile-game-active #table-screen .header-right:has(#btn-fullscreen[style*="none"]) #btn-fullscreen-nav {display:none!important}
body:not(.mobile-game-active) #btn-fullscreen-nav {display:none!important}

/* iOS 15 and older Safari have no container queries or container units (Safari 16+), so the fixed slots above lost
   their seat widths and every short-table step, and the seats piled on each other (BrowserStack, iPhone SE 2022 on
   iOS 15, 2026-10-04). Same sizes from the window instead: the felt is the window less the ~110px action dock. */
@supports not (container-type: size) {
 /* Card faces size their rank and suit in container units too, so iOS 15 drew blank cards: the same proportions
    (rank 26% of the height, suit 40% of the width) from the card's known size. */
 .card .rank {font-size:25px} .card .suit {font-size:27px}
 .card.lg .rank {font-size:31px} .card.lg .suit {font-size:34px}
 .card.sm .rank {font-size:19px} .card.sm .suit {font-size:20px}
 body.mobile-game-active #table-screen .poker-table :is(.mobile-me-cards,.mobile-opp-cards,.mobile-extra-cards) .card .rank {font-size:calc(var(--hole-height) * .26)!important}
 body.mobile-game-active #table-screen .poker-table :is(.mobile-me-cards,.mobile-opp-cards,.mobile-extra-cards) .card .suit {font-size:calc(var(--hole-width) * .4)!important}
 body.mobile-game-active #table-screen .poker-table .community-cards .card .rank {font-size:calc(var(--card-h) * .26)!important}
 body.mobile-game-active #table-screen .poker-table .community-cards .card .suit {font-size:calc(var(--card-w) * .4)!important}
 @media (max-height:520px) and (orientation:landscape) {
  body.mobile-game-active #table-screen .table-rail .poker-table {--seat-width:clamp(104px,23vw,140px)}
 }
 @media (min-height:521px), (orientation:portrait) {
  body.mobile-game-active #table-screen .table-rail .poker-table,
  body.mobile-game-active #table-screen .table-rail .poker-table:is([data-count="2"],[data-count="4"],[data-count="6"]) {--seat-width:clamp(108px,33vw,148px)}
  @media (max-height:670px) {
   body.mobile-game-active #table-screen .table-rail .poker-table {--seat-height:40px;--hole-width:30px;--hole-height:44px;--hole-peek:28px;--card-w:52px;--card-h:75px}
  }
  @media (max-height:590px) {
   body.mobile-game-active #table-screen .table-rail .poker-table {--card-w:46px;--card-h:66px;--hole-peek:22px}
  }
  @media (max-height:560px) {
   body.mobile-game-active #table-screen .table-rail .poker-table {--card-w:40px;--card-h:57px;--hole-peek:18px}
   body.mobile-game-active #table-screen .table-rail .poker-table:is([data-count="4"],[data-count="6"]) :is(#mobile-extra-top-strip,#mobile-extra-bot-strip,#mobile-extra-mini1-strip,#mobile-extra-mini2-strip) {--seat-y:33%}
   body.mobile-game-active #table-screen .table-rail .poker-table:is([data-count="4"],[data-count="6"]) {--slot-board:max(58.5%, calc(33% + var(--seat-height) / 2 + 52px + var(--card-h) / 2))}
   body.mobile-game-active #table-screen .table-rail .poker-table :is(#mobile-extra-mini0-strip,#mobile-extra-mini3-strip) {--seat-y:max(74.5%, calc(var(--slot-board) + var(--card-h) / 2 + 3px + var(--hole-peek) + var(--seat-height) / 2))}
  }
 }
}

/* ── Phone header and opponents' cards (Shaun, 2026-10-06, on his zoomed iPhone) ───────────────────────────────────
   Portrait: the header is only the logo and your avatar, on a clear bar so the top player's cards show through it.
   The Short Deck / All-in or Fold badge, the blinds, the level clock and the tournament Lobby button live in the menu
   your avatar opens (assets/table.js _placeHeaderInfo). Opponents' cards are a little bigger and show most of the
   card above the plaque (only the very top showed). Landscape: the header is the bar across the top of the action
   column, and the buttons start below it (it sat on top of FOLD). */
body.mobile-game-active #table-screen .table-header {background:transparent!important;border-bottom:0!important}
body.mobile-game-active #table-screen .table-header :is(.brand,.avatar-menu) {filter:drop-shadow(0 2px 6px #000a)}
/* Your avatar (the options menu) at 40px, so it balances the logo; 28px read as a speck (Shaun, 2026-10-15) */
body.mobile-game-active #table-screen #btn-table-avatar {width:40px;height:40px;border-width:2px}
@media(max-width:599px) and (orientation:portrait) {
 body.mobile-game-active #table-screen .table-rail .poker-table :is(.mobile-extra-cards,.mobile-opp-cards) {--hole-width:34px;--hole-height:48px;--hole-peek:42px}
 body.mobile-game-active #table-screen[data-variant="omaha"] .table-rail .poker-table :is(.mobile-extra-cards,.mobile-opp-cards) {--hole-width:24px;--hole-height:36px;--hole-peek:32px}
 /* Heads-up, the one opponent's cards are your size on every phone, not only tall ones (Shaun, 2026-10-15, Challenge
    Larry: "why are his cards not the same size as mine?") */
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .mobile-opp-cards {--hole-width:40px;--hole-height:58px;--hole-peek:44px}
}
/* 6-max on a zoomed iPhone (339px wide, a table under 500px tall, so these 34x48 cards): everyone else's cards 7px
   further behind their plaques, so they stick up less (Shaun, 2026-10-24: "move opponent cards a bit further behind the
   plaque so they dont stick up as much ... thats only for the zoomed in versions of the 6 max"). A card turned up still
   shows its whole suit, 3px clear of the plaque. Only these cards' own peek: the seats are placed from the table's. */
/* Short 6-max tables (a zoomed iPhone): the lower side seats' button 8px higher, still level with the plaque, so it clears
   your cards; it was 2px from them, so dealing you in pushed it aside and folding let it back (Shaun, 2026-10-24: "the
   button still jumps a few px from the plaque when the players cards are dealt on mobile, then moves back when theyt fold") */
@media(max-width:599px) and (orientation:portrait) {@container (max-height:499px) {
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="6"] :is(#mobile-extra-mini0-strip,#mobile-extra-mini3-strip) .mobile-seat-dealer {--dealer-top:calc(50% - 18px)}
}}
@media(max-width:599px) and (orientation:portrait) {@container (max-width:370px) and (max-height:499px) {
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="6"] :is(.mobile-extra-cards,.mobile-opp-cards) {--hole-peek:35px}
}}
@media(max-height:520px) and (orientation:landscape) {
 body.mobile-game-active #table-screen .table-header {left:auto!important;right:0!important;width:220px!important;height:calc(44px + env(safe-area-inset-top))!important;background:rgba(8,15,26,.97)!important;border-left:1px solid #ffffff14!important;border-bottom:1px solid #ffffff14!important}
 body.mobile-game-active #table-screen .bottom-zone {padding-top:calc(52px + env(safe-area-inset-top))!important}
}
/* The header extras, inside the avatar menu on phones. */
body.mobile-game-active #table-screen .header-nav-info {display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid #ffffff14}
body.mobile-game-active #table-screen .header-nav-info:empty {display:none}
body.mobile-game-active #table-screen .header-nav-info > * {position:static!important;margin:0!important;transform:none!important}
body.mobile-game-active #table-screen .header-nav-info #btn-tournament-lobby {display:inline-flex!important;align-items:center;gap:6px;width:auto!important;height:32px!important;padding:0 12px!important}
body.mobile-game-active #table-screen .header-nav-info #btn-tournament-lobby[hidden] {display:none!important}
body.mobile-game-active #table-screen .header-nav-info #btn-tournament-lobby span:not(.material-symbols-rounded) {display:inline!important}
/* The game's name in the menu (table.js _HDR_INFO_IDS blind-info; it replaced the All-in or Fold and Short Deck badges,
   2026-10-10): only the label, not the card's blinds text (the level chip beside it has those). Short Deck: tap for rules. */
body.mobile-game-active #table-screen .header-nav-info #blind-info {display:inline-flex;align-items:center;height:32px;padding:0 12px;border:1px solid #ffffff22;border-radius:7px;background:#0b0f12;font-size:0;color:transparent}
body.mobile-game-active #table-screen .header-nav-info #blind-info::before {content:attr(data-format);color:#e4d4a5;font-size:13px;font-weight:650}
body.mobile-game-active #table-screen .header-nav-info #blind-info[role="button"] {cursor:pointer}
/* A tournament's menu: its mini lobby (assets/table.js _syncTourneyMini; Shaun, 2026-10-26, "needs to be more compact"): the
   level and blinds with the clock in gold on the first line, the four pairs (your position, the average stack, positions
   paid, the next level) under them, and the Lobby button last. */
body.mobile-game-active #table-screen .header-nav-info.has-tourney-mini {display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 10px;padding:2px 10px 8px}   /* tight under the line above (Shaun, 2026-10-26: "tighten up extra space above level/clock") */
body.mobile-game-active #table-screen .header-nav-info.has-tourney-mini #blind-level-badge {grid-row:1;grid-column:1;justify-self:start;padding:0;border:0;background:none;color:#e6eaed;font-family:inherit;font-size:13.5px;font-weight:700;letter-spacing:0}
body.mobile-game-active #table-screen .header-nav-info.has-tourney-mini #blind-level-timer {grid-row:1;grid-column:2;min-width:0;padding:0;border:0;background:none;color:#e4d4a5;font-family:inherit;font-size:18px;font-weight:750;line-height:20px;letter-spacing:0;text-align:right}
/* The level-up flash in the mini lobby: gold with room around the text (a ring, so nothing moves), then back to its own
   colors; the old pills' flash ends gray and stays that way */
/* a new level: the text lights up, no box (Shaun, 2026-10-28: "there is not padding so it bumps up against stuff. maybe change
   the text color instead of the label outline"); the level row under your picture (.mt-level-row) does the same */
body.mobile-game-active #table-screen :is(.header-nav-info.has-tourney-mini :is(#blind-level-badge,#blind-level-timer),.mt-level-row > span).level-up-flash {animation:mtLevelText 2.5s ease-in}
@keyframes mtLevelText {0%,55% {color:#f5c842;text-shadow:0 0 10px #f5c84299}}   /* no end frame: back to the text's own colors */
body.mobile-game-active #table-screen .header-nav-info.has-tourney-mini #tourney-mini {grid-row:2;grid-column:1/3;display:grid;grid-template-columns:1fr 1fr;gap:1px;overflow:hidden;border:1px solid #ffffff1c;border-radius:8px;background:#ffffff1c}
body.mobile-game-active #table-screen .header-nav-info.has-tourney-mini #tourney-mini[hidden] {display:none}
body.mobile-game-active #table-screen .header-nav-info.has-tourney-mini .tm-cell {display:flex;flex-direction:column;gap:0;min-width:0;padding:5px 9px;background:#0f1517}
body.mobile-game-active #table-screen .header-nav-info.has-tourney-mini .tm-cell span {color:#8f9aa1;font-size:10.5px;font-weight:600;line-height:14px}
body.mobile-game-active #table-screen .header-nav-info.has-tourney-mini .tm-cell b {overflow:hidden;color:#f2f4f5;font-size:13px;font-weight:700;line-height:17px;font-variant-numeric:tabular-nums;white-space:nowrap;text-overflow:ellipsis}
body.mobile-game-active #table-screen .header-nav-info.has-tourney-mini .tm-cell.is-in b {color:#7ee8a2}
/* no table name here (Shaun, 2026-10-26: "we dont need the table name"), except Short Deck's, which opens its rules */
body.mobile-game-active #table-screen .header-nav-info.has-tourney-mini #blind-info:not([role="button"]) {display:none}
body.mobile-game-active #table-screen .header-nav-info.has-tourney-mini #blind-info {grid-row:3;grid-column:1;justify-self:start;height:28px}
@media(max-height:520px) and (orientation:landscape) {
 body.mobile-game-active #table-screen .table-rail .poker-table {--hole-width:26px;--hole-height:37px;--hole-peek:28px}
}
/* Tall phones with room to spare (Shaun, 2026-10-06: "when theres lots of extra space things can be a bit bigger,
   opponent ... cards can be same size as mine"): heads-up, the opponent's cards match yours; at 4 and 6 seats they
   grow too. The table-level values move each seat to fit its bigger cards. Shorter screens keep the sizes above. */
@media(orientation:portrait) and (min-height:700px) and (min-width:360px) {
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"],
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .mobile-opp-cards {--hole-width:58px;--hole-height:84px;--hole-peek:64px}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]),
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) :is(.mobile-opp-cards,.mobile-extra-cards) {--hole-width:46px;--hole-height:66px;--hole-peek:52px}
}
@media(orientation:portrait) and (min-height:700px) and (min-width:400px) {
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:not([data-count="6"]) {--card-w:66px;--card-h:96px}   /* 6 seats: the bigger board pushed the lower side plaques into your cards (iPhone 15 Pro Max, BrowserStack) */
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:not([data-count="6"]) .mobile-me-cards,
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"],
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .mobile-opp-cards {--hole-width:66px;--hole-height:96px;--hole-peek:73px}
}
/* Phones sideways (Shaun, 2026-10-06: "the bottom of the names ... and the money" cut off): plaques a little taller
   and each line given room for Safari's taller font metrics, so names and stacks never clip. */
@media(max-height:520px) and (orientation:landscape) {
 body.mobile-game-active #table-screen .poker-table :is(#mobile-opp-strip,.mobile-extra-strip,.mobile-extra-mini,#mobile-me-strip) {height:42px!important;min-height:42px!important}
 body.mobile-game-active #table-screen .poker-table :is(.mobile-opp-info,.mobile-extra-info,.mobile-extra-mini-info,.mobile-me-info) {padding-top:2px!important;padding-bottom:2px!important;display:flex!important;flex-direction:column;justify-content:center;overflow:visible!important}
 body.mobile-game-active #table-screen .poker-table :is(.mobile-opp-name,.mobile-extra-name,.mobile-extra-mini-name,.mobile-me-name,.mobile-opp-stack,.mobile-extra-stack,.mobile-extra-mini-stack,.mobile-me-stack) {line-height:17px;padding-bottom:1px}
 /* landscape plaques are 34px: the names and stacks stay 12px here (13px clipped the stack; the portrait size is above) */
 body.mobile-game-active #table-screen .table-rail .poker-table :is(.mobile-opp-name,.mobile-me-name,.mobile-extra-name,.mobile-extra-mini-name,.mobile-opp-stack,.mobile-me-stack,.mobile-extra-stack,.mobile-extra-mini-stack,.mobile-opp-action,.mobile-me-action,.mobile-extra-action) {font-size:12px;line-height:1.25}
}
@media(max-height:520px) and (orientation:landscape) {
 /* The top seat's cards, face up at the end of a hand, were cut off by the top edge. */
 body.mobile-game-active #table-screen .table-rail .poker-table #mobile-opp-strip {--seat-y:calc(var(--hole-peek) + var(--seat-height) / 2 + 14px)}
}

/* The phone table menu matches the site's account menu and the desktop one (Shaun, 2026-10-06: "styled like our
   website"): same panel, grey items with muted icons that turn gold, Leave Table under a divider. */
body.mobile-game-active #table-screen .header-nav.open {gap:2px;padding:8px;min-width:212px;background:var(--muck-surface-1,#181f20);border:1px solid var(--muck-line,#354445);border-radius:12px;box-shadow:0 24px 80px #0009}
body.mobile-game-active #table-screen .header-nav > button.btn-header {display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:10px 12px;border:0;border-radius:8px;background:transparent;color:#bfc1c9;font:600 14px/1.2 var(--muck-font,Inter,system-ui,sans-serif);opacity:1;text-align:left;box-shadow:none}
body.mobile-game-active #table-screen .header-nav > button.btn-header[hidden] {display:none}
body.mobile-game-active #table-screen .header-nav > button.btn-header .material-symbols-rounded {font-size:20px;color:var(--muck-text-3,#8b9497)}
body.mobile-game-active #table-screen .header-nav > button.btn-header:is(:hover,:active,:focus-visible) {background:#292b31;color:#cdb47e;outline:none}
body.mobile-game-active #table-screen .header-nav > button.btn-header:is(:hover,:active,:focus-visible) .material-symbols-rounded {color:var(--muck-gold)}
body.mobile-game-active #table-screen .header-nav > button.btn-exit-nav {margin-top:5px;position:relative;color:#bfc1c9}
body.mobile-game-active #table-screen .header-nav > button.btn-exit-nav::before {content:'';position:absolute;left:6px;right:6px;top:-4px;height:1px;background:var(--muck-line,#354445)}
/* the info strip at the top of the menu only when something in it is showing */
body.mobile-game-active #table-screen .header-nav-info:not(:has(> :not(.hidden):not([hidden]):not([style*="display: none"]):not([style*="display:none"]))) {display:none}
/* ...and it grows out of your avatar as one piece (Shaun, 2026-10-06: "connected to that round icon"): the panel starts
   at the avatar's top, the avatar sits in its corner above it, your name beside it */
body.mobile-game-active #table-screen .header-nav.open {top:4px;right:2px}
body.mobile-game-active #table-screen .header-nav.open::before {content:attr(data-name);display:block;align-self:stretch;text-align:left;min-height:34px;margin:0 0 6px;padding:0 44px 6px 12px;border-bottom:1px solid var(--muck-line,#354445);color:var(--muck-text,#f4f1e9);font:700 14px/34px var(--muck-font,Inter,system-ui,sans-serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.mobile-game-active #table-screen .table-header:has(.header-nav.open) #avatar-menu {position:relative;z-index:201}
body.mobile-game-active #table-screen .table-header:has(.header-nav.open) #btn-table-avatar {box-shadow:0 0 0 2px var(--muck-gold-muted,#a8904f)}
@keyframes mtTurnGlow{0%,100%{opacity:.35}50%{opacity:1}}
/* Larry's Try it Free walkthrough on phones (table.js _tutBubble): a speech bubble in the empty felt under his plaque */
body.mobile-game-active #table-screen .mt-tut-bubble{position:absolute;left:50%;z-index:6;width:min(300px,calc(100% - 32px));transform:translate(-50%,4px);opacity:0;pointer-events:none;
 padding:var(--muck-space-3) var(--muck-space-4);border:1px solid var(--muck-line-strong);border-radius:var(--muck-radius-card);background:var(--muck-surface-1);color:var(--muck-text);
 font:500 14px/1.4 var(--muck-font);text-align:center;box-shadow:var(--muck-shadow-menu);transition:opacity var(--muck-dur) var(--muck-ease),transform var(--muck-dur) var(--muck-ease)}
body.mobile-game-active #table-screen .mt-tut-bubble.is-on{opacity:1;transform:translate(-50%,0)}
body.mobile-game-active #table-screen .mt-tut-bubble::before{content:'';position:absolute;left:50%;top:-6px;width:10px;height:10px;transform:translateX(-50%) rotate(45deg);background:inherit;border-left:1px solid var(--muck-line-strong);border-top:1px solid var(--muck-line-strong)}

/* Phones, heads-up: bands that can't overlap, top to bottom: the opponent's cards and plaque (bet beside it), the pot,
   the board, your cards and plaque (bet beside it). Built for Larry's lesson (2026-10-15: "make fucking sections where
   things cant overlap ... show a bit less of bills cards, move him up, make board same size as my cards") and now every
   heads-up table on a phone ("i want all mobile heads up games to have the cards and chips the same style as the
   explainer ... its MUCH easier to see"). Omaha keeps its own (four cards don't fit this way). Only numbers on the
   table's own slot system ("Fixed slots" above; table.js positionBetStacks puts the bets beside the plaques):
   --lt-c is the biggest card the felt's height and width hold with every band in it (8, 76% of the opponent's card,
   their plaque, 8, their bet row 34 (the pot shares it, at the right, above the river), 6, the board, 6, your bet row
   34, 8, 76% of your card, your plaque, 16, and 10 to spare: the opponent shows as much card as you do, "ideally same
   amount as mine ... dont cut off the pips"; the bets centred like desktop, "move the pot off to the right above the
   river ... chips always in the middle"); the board and
   both hands are that size; the pot sits just above the board (--slot-pot past the board, so table.js stops it 4px
   above); plaques are as wide as two cards and a margin; the dealer button 14px out. */
@media (orientation:portrait) and (max-width:700px){
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"]{
  --lt-c:clamp(44px,min(calc((100cqh - 130px - 2 * var(--seat-height)) / 2.52),calc((100cqw - 48px) / 3.45)),96px);
  --card-h:var(--lt-c);--card-w:calc(var(--lt-c) * .69);
  --slot-board:calc(50% + 28px);--slot-pot:100%;   /* = table.js's centring: halfway between their plaque (56px + card + plaque) and your cards, so the board never shifts on load */
  --plaque-w:max(124px,calc(var(--card-w) * 2 + 29px));--dealer-x:-38px}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] #mobile-opp-cards{--hole-width:var(--card-w);--hole-height:var(--card-h);--hole-peek:calc(var(--card-h) * .76)}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] #mobile-me-cards{--hole-width:var(--card-w);--hole-height:var(--card-h);--hole-peek:calc(var(--card-h) * .76)}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] #mobile-opp-strip{--seat-y:calc(8px + var(--card-h) * .76 + var(--seat-height) / 2)}
}

/* Phones, heads-up: a bet looks like the pot, the same 17px label on the same pill and 20px chips (not in Larry's lesson, which keeps its approved, smaller bets) (Shaun, 2026-10-15:
   "lets just make the chips bigger first ... same size label and chips as the pot", heads-up only). The pill's colours
   are the pot's (game-palette.css .pot-total). */
@media (orientation:portrait) and (max-width:700px){
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .bet-stack .chip-tower{transform:none}   /* style.css shrinks phone chip stacks to 80% */
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .bet-stack-amount{font-size:19px;line-height:24px;padding:2px 10px;border:1px solid #688272;border-radius:24px;background:#102820;color:#ead8ad;box-shadow:0 3px 9px #0004}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .bet-stack :is(.chip-disc,.chip-disc2){width:24px;height:24px}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .bet-stack .chip-col :is(.chip-disc,.chip-disc2):not(:last-child){margin-bottom:-18px}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .bet-stack{gap:6px}
}

/* Phones, heads-up (real tables, not Larry's lesson), from Shaun's mock (2026-10-15: "better alignment, spacing, sizing
   ... properly balanced"): both hands fan a little, like cards held (overlapping at the bottom, pivoting where they meet); the opponent's plaque, dealer button and bet sit
   lower: their cards start 56px down, below the header's logo and avatar ("i dont want larrys going up into the
   header"), and show exactly as much as yours ("show the same amount of his cards as mine"); --lt-c makes room for
   that 48px, so the bets and board keep their bands ("make sure the bets can never overlap anything"). The board is centred between the bet rows by table.js (positionCommunity).
   `rotate`, not transform, so the deal and flip animations keep theirs. */
@media (orientation:portrait) and (max-width:700px){
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] :is(#mobile-me-cards,#mobile-opp-cards){gap:0}
  body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] :is(#mobile-me-cards,#mobile-opp-cards) .card:first-child{rotate:-5deg;transform-origin:50% 100%;margin-right:calc(var(--hole-width) * -.22)}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] :is(#mobile-me-cards,#mobile-opp-cards) .card:last-child{rotate:5deg;transform-origin:50% 100%}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] #mobile-opp-cards{--hole-peek:calc(var(--card-h) * .76)}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] {--lt-c:clamp(44px,min(calc((100cqh - 190px - 2 * var(--seat-height)) / 2.52),calc((100cqw - 48px) / 3.45)),96px)}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] #mobile-opp-strip{--seat-y:calc(56px + var(--card-h) * .76 + var(--seat-height) / 2)}
}

/* Phones, 4- and 6-max, sized like the heads-up table (Shaun, 2026-10-15: "keep our side this size, the board as large
   as possible and fitting everyone around"; worked out on a mock-up with him, bets 10% smaller than heads-up). Bands,
   top to bottom. Only where the felt is 500px tall or more (most phones held upright; a short one, like a zoomed
   339x551 iPhone, keeps the compact layout above, which fits it):
     56   header (logo, avatar)
     top seat: cards (76% showing) + plaque; its bet under it
     upper side seats at the edges, a little lower; their bets under them
     the board, as large as the width allows and the room between the bet rows
     (6-max) lower side seats at the edges, below the board
     your bet, your cards (heads-up size, 76% showing), your plaque */
@media (orientation:portrait) and (max-width:700px){@container (min-height:500px){
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]){
  --oc:64px;                                           /* opponents' cards */
  --mc:clamp(64px,18cqh,101px);                        /* your cards: the heads-up size */
  --seat-height:40px;--seat-width:112px;--seat-inset:calc(var(--seat-width) / 2);
  --b-top:calc(56px + var(--oc) * .76 + var(--seat-height) + 80px + 46px);        /* under the upper side seats' bets */
  --b-bot:calc(100% - 10px - var(--seat-height) - var(--mc) * .76 - 51px);       /* above your bet */
  --card-h:clamp(48px,min(calc((100cqw - 40px) / 5 / .69),calc(100cqh - 10px - 40px - var(--mc) * .76 - 51px - (56px + var(--oc) * .76 + 40px + 126px) - 12px)),104px);
  --card-w:calc(var(--card-h) * .69);
  --slot-board:calc((var(--b-top) + var(--b-bot)) / 2)}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) .community-cards{gap:6px}
 /* you */
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) #mobile-me-cards{--hole-width:calc(var(--mc) * .69);--hole-height:var(--mc);--hole-peek:calc(var(--mc) * .76);gap:0}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) #mobile-me-strip{width:max(124px,calc(var(--mc) * .69 * 2 + 29px))}
 /* everyone else's cards, all one size */
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) :is(#mobile-opp-cards,.mobile-extra-cards){--hole-width:calc(var(--oc) * .69);--hole-height:var(--oc);--hole-peek:calc(var(--oc) * .76);gap:0}
 /* hands fan, like the heads-up table */
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) :is(#mobile-me-cards,#mobile-opp-cards,.mobile-extra-cards) .card:first-child{rotate:-5deg;transform-origin:50% 100%;margin-right:calc(var(--hole-width) * -.22)}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) :is(#mobile-me-cards,#mobile-opp-cards,.mobile-extra-cards) .card:last-child{rotate:5deg;transform-origin:50% 100%}
 /* seats */
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) #mobile-opp-strip{--seat-y:calc(56px + var(--oc) * .76 + var(--seat-height) / 2);width:124px}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) :is(#mobile-extra-top-strip,#mobile-extra-bot-strip,#mobile-extra-mini1-strip,#mobile-extra-mini2-strip){--seat-y:calc(56px + var(--oc) * .76 + var(--seat-height) / 2 + 80px)}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="6"] :is(#mobile-extra-mini0-strip,#mobile-extra-mini3-strip){--seat-y:calc(var(--b-bot) + 6px + var(--oc) * .76 + var(--seat-height) / 2)}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) :is(.mobile-extra-strip,.mobile-extra-mini,#mobile-opp-strip){height:var(--seat-height);min-height:var(--seat-height)}
 /* bets: the heads-up pill and chips */
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) .bet-stack .chip-tower{transform:none}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) .bet-stack-amount{font-size:15.5px;line-height:20px;padding:2px 8px;border:1px solid #688272;border-radius:24px;background:#102820;color:#ead8ad;box-shadow:0 3px 9px #0004}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) .bet-stack :is(.chip-disc,.chip-disc2){width:20px;height:20px}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) .bet-stack .chip-col :is(.chip-disc,.chip-disc2):not(:last-child){margin-bottom:-15px}
}}
/* 6-max: the board and your hand a little smaller ("on 6 i like this layout but lets make the board and our cards a tad
   smaller") */
@media (orientation:portrait) and (max-width:700px){@container (min-height:500px){
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="6"]{
  --mc:clamp(58px,16cqh,90px);
  --card-h:clamp(44px,min(calc((100cqw - 72px) / 5 / .69),calc(100cqh - 10px - 40px - var(--mc) * .76 - 51px - (56px + var(--oc) * .76 + 40px + 126px) - 12px)),94px)}
}}
/* Side seats: the dealer button on the plaque's inner top corner, clear of their bet (under the plaque, outer end), their
   cards and the top seat's bet. Bets show at most two chip stacks ("max 2 chips ... if that helps w spacing"). */
@media (orientation:portrait) and (max-width:700px){@container (min-height:500px){
 /* 18px out, not 10: the seat's fanned cards (the first tilts 5 degrees from its foot) reached the button, so every deal
    pushed it aside and every fold let it back (Shaun, 2026-10-24: "the button still jumps a few px from the plaque when the
    players cards are dealt on mobile, then moves back when theyt fold") */
 body.mobile-game-active #table-screen .table-rail .poker-table:is([data-count="4"],[data-count="6"]) :is(#mobile-extra-bot-strip,#mobile-extra-mini2-strip,#mobile-extra-mini3-strip) .mobile-seat-dealer{--dealer-top:-12px;--dealer-x:-18px;--dealer-left:auto}
 body.mobile-game-active #table-screen .table-rail .poker-table:is([data-count="4"],[data-count="6"]) :is(#mobile-extra-top-strip,#mobile-extra-mini1-strip,#mobile-extra-mini0-strip) .mobile-seat-dealer{--dealer-top:-12px;--dealer-x:auto;--dealer-left:-18px}
 body.mobile-game-active #table-screen .table-rail .poker-table:is([data-count="4"],[data-count="6"]) .bet-stack .chip-col:nth-child(n+3){display:none}
}}

/* Shaun, 2026-10-15: 6-max side bets out to the edges ("farther away from middle player"), your bet 6px up; 4-max the top three players 6px up */
@media (orientation:portrait) and (max-width:700px){@container (min-height:500px){
 body.mobile-game-active #table-screen .table-rail .poker-table[data-count="6"]{--left-bet-shift:-6px;--right-bet-shift:6px;--bet-edge-min:4px;--me-bet-up:6px}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="4"] #mobile-opp-strip{--seat-y:calc(50px + var(--oc) * .76 + var(--seat-height) / 2)}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="4"] :is(#mobile-extra-top-strip,#mobile-extra-bot-strip){--seat-y:calc(50px + var(--oc) * .76 + var(--seat-height) / 2 + 80px)}
}}

/* 6-max: the side players and the board 10px higher, their bets 2px in from the edges (Shaun, 2026-10-15: "shift the
   side players and the board up a bit, maybe like 10 px ... move the side players bets inward to the center maybe 2px").
   table.js centres the 6-max board between the side seats' rows, so it moves up with them. */
@media (orientation:portrait) and (max-width:700px){@container (min-height:500px){
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="6"] :is(#mobile-extra-mini1-strip,#mobile-extra-mini2-strip){--seat-y:calc(56px + var(--oc) * .76 + var(--seat-height) / 2 + 70px)}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="6"] :is(#mobile-extra-mini0-strip,#mobile-extra-mini3-strip){--seat-y:calc(var(--b-bot) - 4px + var(--oc) * .76 + var(--seat-height) / 2)}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="6"]{--slot-board:calc((var(--b-top) + var(--b-bot)) / 2 - 10px)}
}}
/* Phones, heads-up, short felt (a zoomed iPhone, under 520px of table): smaller bet pills and chips, the room they free
   given to bigger cards and plaques, the top player 12px higher (Shaun, 2026-10-15: "the chip labels should be smaller,
   the chips a bit smaller, and the cards/plaques a bit bigger. we can move the top player up a bit too"). Not Larry's
   lesson. */
@media (orientation:portrait) and (max-width:700px){@container (max-height:520px){
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"]{
  --seat-height:44px;--slot-board:calc(50% + 22px);   /* their cards start 44px down here */
  --lt-c:clamp(44px,min(calc((100cqh - 166px - 2 * var(--seat-height)) / 2.52),calc((100cqw - 48px) / 3.45)),96px)}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] #mobile-opp-strip{--seat-y:calc(44px + var(--card-h) * .76 + var(--seat-height) / 2)}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .bet-stack-amount{font-size:15px;line-height:19px;padding:1px 8px}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .bet-stack :is(.chip-disc,.chip-disc2){width:18px;height:18px}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .bet-stack .chip-col :is(.chip-disc,.chip-disc2):not(:last-child){margin-bottom:-14px}
}}

/* All-in or Fold on phones: no sizing row under the buttons, so the buttons take its height (Shaun, 2026-10-15: "in all
   in or fold on mobile we can make the buttons taller cause we dont have that botom row of ubttons") */
body.mobile-game-active .action-btns-col.aof-mode{--act-h:59px}
/* ...and the hidden sizing row gives back its 44px (style.css keeps a hidden one's height for other tables), so the
   table gets it (Shaun, 2026-10-15: "buttons reduce height 30%, shrink space they are in") */
body.mobile-game-active #table-screen.aof-table #sizing-row.hidden{height:0;min-height:0;padding:0;margin:0;border:0;overflow:hidden}

/* Phones, heads-up, short felt: wider plaques ("make plaques wider"); bets at most two stacks two chips high, here and at
   4/6-max ("limit chips to no more than 2 stacks of 2 high") */
@media (orientation:portrait) and (max-width:700px){@container (max-height:520px){
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"]{--plaque-w:max(150px,calc(var(--card-w) * 2 + 40px))}
}}
@media (orientation:portrait) and (max-width:700px){
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="2"],[data-count="4"],[data-count="6"]) .bet-stack .chip-col:nth-child(n+3){display:none}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="2"],[data-count="4"],[data-count="6"]) .bet-stack .chip-col :is(.chip-disc,.chip-disc2):nth-child(n+3){display:none}
 /* 4- and 6-max: at most two chips a bet beside its amount (Shaun, 2026-10-24: "on 6 max maybe dont show the chips at all
    on the bets or the pot, just the labels. or max 1 chip? ... to cut down on clutter" / "i think 2 is fine too for a
    raise"): the first stack's two, or one each from the first two stacks (a bet's chips split by colour, so 10 is two 5s in
    one stack and 70 one chip in each of two). The pot stays its amount and one chip (#pot-chips stays hidden, style.css). */
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) .bet-stack .chip-col:first-child:has(> :nth-child(2)) ~ .chip-col,
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) .bet-stack .chip-col:nth-child(2) > :nth-child(n+2){display:none}
}

/* A bet keeps one height whether it has one chip or two, so it doesn't jump when the second lands (Shaun, 2026-10-15:
   "when the chip stack goes from 1 to 2 ... it shifts down when i bet"): the label and chips centre in it */
@media (orientation:portrait) and (max-width:700px){
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="2"],[data-count="4"],[data-count="6"]) .bet-stack{min-height:34px}
}

/* Bet chips by variables (the rules above pin them with !important): heads-up 24px, short heads-up 18px, 4/6-max 20px,
   each overlapping by three quarters. With the two-high limit the hidden chips must not pull the second one up, so every
   column is the same height and the stacks line up (Shaun, 2026-10-15: "chips not vertically aligned") */
@media (orientation:portrait) and (max-width:700px){
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .bet-stack{--chip-d:24px;--chip-mb:-18px}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) .bet-stack{--chip-d:20px;--chip-mb:-15px}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="2"],[data-count="4"],[data-count="6"]) .bet-stack .chip-col > :nth-child(2){--chip-mb:0px}
}
@media (orientation:portrait) and (max-width:700px){@container (max-height:520px){
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .bet-stack{--chip-d:18px;--chip-mb:-14px}
}}

/* Bet sizing behind a button on phones (Shaun, 2026-10-15: "for the betting buttons, lets make the top row taller, then add
   a settings type icon to the left, and when u click that it brings up the bottom row so you can adjust that, then close
   that to make the bet"). The sizing row is a tray over the bottom of the table, so nothing below it moves; the buttons take
   the row's height, like All-in or Fold. Since 2026-10-28 it's open whenever it's your turn and the button is gone (Shaun:
   "remove that button on the left ... and then just make those options present when its the users turn"; table.js). */
@media (orientation:portrait){
 body.mobile-game-active .action-btns-col{--act-h:59px;position:relative}
 body.mobile-game-active #table-screen :is(.bottom-zone,.action-panel){overflow:visible}   /* the tray rises out of them */
 /* The buttons centred in the strip (Shaun, 2026-10-15: "have those mobile betting buttons vertically centered in that strip
    on the bottom"): an iPhone's home-bar inset (34px) was all under them; now it's shared, the bar keeps 20px, same height */
 body.mobile-game-active #table-screen .bottom-zone{--bz-pad:max(8px,calc(env(safe-area-inset-bottom,0px) - 14px));padding-top:calc(var(--bz-pad) - 1px);padding-bottom:var(--bz-pad)}
 body.mobile-game-active #table-screen .action-btns-col #sizing-row{position:absolute;left:0;right:0;bottom:calc(100% + 8px);z-index:3;height:auto;min-height:0;
  padding:8px;border:1px solid var(--muck-line-strong);border-radius:12px;background:rgba(8,15,26,.97);box-shadow:0 -8px 24px #0008;
  visibility:hidden;pointer-events:none;opacity:0;transform:translateY(6px);transition:opacity .15s ease,transform .15s ease,visibility 0s .15s}
 body.mobile-game-active #table-screen .action-btns-col.sizing-open #sizing-row:not(.hidden){visibility:visible;pointer-events:auto;opacity:1;transform:none;transition:opacity .15s ease,transform .15s ease}
 /* the strip as a row of buttons like the ones under it: edge to edge with Fold and Raise, their corners, no box around them,
    and one unit with them: the buttons' own 6px gap across and between the rows, the bar behind them 6px above
    them too, and the row 36px tall so that edge stays at your plaque's top and never covers more of your cards (Shaun, 2026-10-28: "make it full width" / "same border radius as main buttons" / "they all need to be aligned as one unit" / "its cutting them off" /
    "buttons dont have padding above them") */
 body.mobile-game-active #table-screen .action-btns-col #sizing-row{bottom:calc(100% + 6px);padding:0;border:0;border-radius:0;background:none;box-shadow:none;gap:6px}
 /* its columns over the buttons' columns: the arrows over Fold, Pot (and ½ Pot) over Call, All In over Raise */
 body.mobile-game-active #table-screen .action-btns-col.sizing-open #sizing-row:not(.hidden){display:grid;grid-template-columns:repeat(6,minmax(0,1fr))}
 body.mobile-game-active #table-screen .action-btns-col #sizing-row #bet-dec{grid-area:1/1;width:auto;min-width:0;max-width:none;justify-self:stretch}
 body.mobile-game-active #table-screen .action-btns-col #sizing-row #bet-inc{grid-area:1/2;width:auto;min-width:0;max-width:none;justify-self:stretch}
 body.mobile-game-active #table-screen .action-btns-col #sizing-row #quick-bets{grid-area:1/3/2/5;display:flex;gap:6px;min-width:0}
 body.mobile-game-active #table-screen .action-btns-col #sizing-row #quick-bets .btn-quick{flex:1 1 0;min-width:0}
 body.mobile-game-active #table-screen .action-btns-col #sizing-row #btn-allin{grid-area:1/5/2/7}
 body.mobile-game-active #table-screen .action-btns-col #sizing-row .btn-quick{height:36px;min-height:36px;border-radius:10px;box-shadow:none}
 /* behind it, the bottom bar carried up, edge to edge, so nothing on the table shows between the buttons (Shaun: "yes") */
 body.mobile-game-active #table-screen .action-btns-col #sizing-row::before{content:'';position:absolute;z-index:-1;top:-6px;bottom:-6px;
  left:calc(-1 * max(8px,env(safe-area-inset-left)));right:calc(-1 * max(8px,env(safe-area-inset-right)));background:rgba(8,15,26,.97)}
}

/* Phone chat (assets/table.js _mtChat*, local for now; Shaun, 2026-10-26: "as long as it showed above that stuff, and wasnt
   there for longer than needed to read a message comfortably, above is fine"). Bubbles: above the sender's plaque, over
   everything on the table, placed on the page by the script. */
.mt-chat-bubble{display:none}
body.mobile-game-active .mt-chat-bubble{position:fixed;z-index:60;display:block;box-sizing:border-box;max-width:min(230px,calc(100vw - 16px));padding:7px 11px;border:1px solid var(--muck-line-strong);border-radius:12px;background:var(--muck-surface-1);color:var(--muck-text);font:500 13px/1.35 var(--muck-font);overflow-wrap:anywhere;box-shadow:var(--muck-shadow-menu);opacity:0;transform:translateY(4px);pointer-events:none;transition:opacity var(--muck-dur) var(--muck-ease),transform var(--muck-dur) var(--muck-ease)}
body.mobile-game-active .mt-chat-bubble.is-on{opacity:1;transform:none}
body.mobile-game-active .mt-chat-bubble.is-me{border-color:var(--muck-gold-muted)}
body.mobile-game-active .mt-chat-bubble::after{content:'';position:absolute;left:var(--tail-x,50%);bottom:-6px;width:10px;height:10px;margin-left:-5px;transform:rotate(45deg);background:inherit;border-right:1px solid;border-bottom:1px solid;border-color:inherit}
body.mobile-game-active .mt-chat-bubble.is-below::after{top:-6px;bottom:auto;border:0;border-left:1px solid;border-top:1px solid;border-color:inherit}
/* The chat button, left of your picture; a gold dot when there's something you haven't seen */
body.mobile-game-active #table-screen .mt-chat-btn{position:relative;display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid var(--muck-line-strong);border-radius:50%;background:var(--muck-surface-1);color:var(--muck-text-2);cursor:pointer}
body.mobile-game-active #table-screen .mt-chat-btn[hidden]{display:none}
body.mobile-game-active #table-screen .mt-chat-btn .material-symbols-rounded{font-size:20px}
body.mobile-game-active #table-screen .mt-chat-btn .mt-chat-dot{position:absolute;top:2px;right:2px;display:none;width:10px;height:10px;border:2px solid var(--muck-bg);border-radius:50%;background:var(--muck-gold)}
body.mobile-game-active #table-screen .mt-chat-btn.has-new .mt-chat-dot{display:block}
body.mobile-game-active #table-screen .mt-chat-btn[aria-expanded="true"]{border-color:var(--muck-gold-muted);color:var(--muck-gold)}
/* ...and with your picture it's one piece, a pill (Shaun, 2026-10-26: "make chat bubble and icon one unit") */
body.mobile-game-active #table-screen .header-right:has(> .mt-chat-btn:not([hidden])){gap:2px;padding:2px 2px 2px 4px;border:1px solid var(--muck-line-strong);border-radius:6px;background:var(--muck-surface-1)}
body.mobile-game-active #table-screen .header-right > .mt-chat-btn{width:36px;height:36px;border:0;background:transparent}
body.mobile-game-active #table-screen .header-right:has(> .mt-chat-btn:not([hidden])) #btn-table-avatar{width:36px;height:36px}
/* the table menu open: it covers this corner, so no pill edge behind it, and no chat bubble over it */
body.mobile-game-active #table-screen .header-right:has(> .mt-chat-btn:not([hidden])):has(> .header-nav.open){border-color:transparent;background:transparent}
body.mobile-game-active:has(#header-nav.open) .mt-chat-bubble{visibility:hidden}
/* Tournaments: the level and its clock as a second row of that pill (table.js _mtLevelRow; Shaun, 2026-10-28: "add below the
   current top right chat/profile widget, the level and time in a short row beneath it, so its all one cohesive unit") */
.mt-level-row{display:none}
body.mobile-game-active #table-screen .header-right:has(> .mt-level-row:not([hidden])){display:grid;grid-template-columns:repeat(2,auto);justify-content:end;align-self:flex-start;margin-top:3px;justify-items:center;gap:2px;padding:2px 2px 0 4px;border:1px solid var(--muck-line-strong);border-radius:6px;background:var(--muck-surface-1)}
body.mobile-game-active #table-screen .header-right > .mt-level-row:not([hidden]){display:flex;grid-row:2;grid-column:1/-1;justify-self:stretch;align-items:center;justify-content:space-between;gap:8px;box-sizing:border-box;height:24px;margin:0 0 0 -2px;padding:0 8px 0 6px;border-top:1px solid var(--muck-line);font:600 11.5px/1 var(--muck-font);color:var(--muck-text-2);white-space:nowrap}
body.mobile-game-active #table-screen .mt-level-row .mtl-clock{color:var(--muck-gold);font-size:12.5px;font-weight:750;font-variant-numeric:tabular-nums}
body.mobile-game-active #table-screen .mt-level-row .mtl-clock:empty{display:none}
body.mobile-game-active #table-screen .mt-level-row.is-late .mtl-clock{color:var(--muck-text-3)}
/* the menu open covers the corner: the row goes with the pill */
body.mobile-game-active #table-screen .header-right:has(> .header-nav.open) > .mt-level-row{visibility:hidden}
body.mobile-game-active #table-screen .header-right:has(> .mt-level-row:not([hidden])):has(> .header-nav.open){border-color:transparent;background:transparent}
/* The sheet: over the bottom of the screen, on top of the keyboard when it's up, and over the sit-out window (z 200): you can
   still talk sitting out */
.mt-chat-sheet{display:none}
body.mobile-game-active .mt-chat-sheet:not([hidden]){position:fixed;left:0;right:0;bottom:0;z-index:210;display:flex;flex-direction:column;box-sizing:border-box;max-height:min(44vh,360px);padding:var(--muck-space-3) var(--muck-space-4) calc(var(--muck-space-3) + env(safe-area-inset-bottom));border:1px solid var(--muck-line-strong);border-bottom:0;border-radius:var(--muck-radius-lg) var(--muck-radius-lg) 0 0;background:var(--muck-surface-1);box-shadow:var(--muck-shadow-overlay)}
body.mobile-game-active .mt-chat-sheet .mtc-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--muck-space-2);color:var(--muck-text);font:700 15px/1.2 var(--muck-font)}
body.mobile-game-active .mt-chat-sheet .mtc-close{display:grid;place-items:center;width:36px;height:36px;margin-right:-8px;padding:0;border:0;background:none;color:var(--muck-text-2)}
body.mobile-game-active .mt-chat-sheet .mtc-list{flex:1 1 auto;min-height:0;overflow-y:auto;color:var(--muck-text);font:500 14px/1.4 var(--muck-font)}
body.mobile-game-active .mt-chat-sheet .mtc-line{padding:3px 0}
body.mobile-game-active .mt-chat-sheet .mtc-name{color:var(--muck-text-2);font-weight:700}
body.mobile-game-active .mt-chat-sheet .mtc-line.is-me .mtc-name{color:var(--muck-gold)}
body.mobile-game-active .mt-chat-sheet .mtc-empty{margin:var(--muck-space-2) 0;color:var(--muck-text-3)}
body.mobile-game-active .mt-chat-sheet .mtc-quick{display:flex;gap:var(--muck-space-2);margin:var(--muck-space-2) calc(-1 * var(--muck-space-4));padding:2px var(--muck-space-4);overflow-x:auto;scrollbar-width:none}
body.mobile-game-active .mt-chat-sheet .mtc-quick button{flex:0 0 auto;min-height:34px;padding:0 var(--muck-space-3);border:1px solid var(--muck-line-strong);border-radius:var(--muck-radius-pill);background:var(--muck-surface-2);color:var(--muck-text);font:600 13px/1 var(--muck-font);white-space:nowrap}
body.mobile-game-active .mt-chat-sheet .mtc-input .chat-input-row{display:flex;gap:var(--muck-space-2)}
body.mobile-game-active .mt-chat-sheet .mtc-input .chat-input{flex:1 1 auto;min-width:0;height:42px;padding:0 var(--muck-space-3);border:1px solid var(--muck-line-strong);border-radius:var(--muck-radius-field);background:var(--muck-bg);color:var(--muck-text);font:500 16px/1 var(--muck-font)}
body.mobile-game-active .mt-chat-sheet .mtc-input .chat-input:focus{outline:0;border-color:var(--muck-gold)}
body.mobile-game-active .mt-chat-sheet .mtc-input .chat-send-btn{display:grid;place-items:center;flex:0 0 42px;height:42px;padding:0;border:1px solid var(--muck-line-strong);border-radius:var(--muck-radius-field);background:var(--muck-surface-2);color:var(--muck-gold)}
body.mobile-game-active .mt-chat-sheet .mtc-input .chat-locked{display:flex;flex-wrap:wrap;align-items:center;gap:var(--muck-space-2);color:var(--muck-text-2);font:500 13px/1.35 var(--muck-font)}
body.mobile-game-active .mt-chat-sheet .mtc-input .chat-locked .chat-mute-input{flex:1 1 100%;min-width:0}   /* /mute without the unlock (table.js _chatCommand) */
body.mobile-game-active .mt-chat-sheet .mtc-input .hidden{display:none}
/* a long chat scrolls in its list; the title, the quick lines and the message box never get squeezed out of sight (Shaun,
   2026-10-26: "the quick reply buttons are pushed below the reply bar so you cant really see/click them") */
body.mobile-game-active .mt-chat-sheet :is(.mtc-head,.mtc-quick,.mtc-input){flex:0 0 auto}

/* 6-max on a phone, rebalanced (Shaun, 2026-10-26: "at this small size for 6 max it feels really cramped and the bottom
   espech" / "1 thats a big jump lets try less. and lets try the rest"): everyone else's card backs 12% smaller (64 -> 56),
   which lifts the lower side seats off the bottom band; bet pills and chips ~15% smaller, so they read as amounts, not
   headlines; your cards ~10% smaller; the board up into the empty strip under the upper bets. Bands as before: every
   piece still hangs off the same shared lines (--oc, --mc, --b-top, --b-bot, --slot-board). */
@media (orientation:portrait) and (max-width:700px){@container (min-height:500px){
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="6"]{
  --oc:56px;
  --mc:clamp(52px,14.4cqh,81px);
  --board-lift:18px;   /* table.js centres the board between the side rows, then lifts it this much */
  --slot-board:calc((var(--b-top) + var(--b-bot)) / 2 - 24px)}
 /* the smaller bets, the one chip a bet (white blinds, green bet, red raise) and the side seats' bets centred under their
    plaques reach 4-max and heads-up too, below ("did that work for 6max mobile translate to 4max?") */
}}
/* Every phone table held upright (Shaun, 2026-10-26): one chip a bet, its colour what the bet is (table.js _betChipKind;
   "could we use 1 chip max and just use colors to differentaite bet and raise?"); bet pills smaller, so they read as amounts,
   not headlines; chips ~10% smaller ("i think chips can be like 10% or so smaller": 20 -> 18, heads-up 24 -> 22, still three
   quarters overlapped); side seats' bets centred under their plaques (table.js positionBetStacks; "bets should be
   horizontally center under their plaque") */
@media (orientation:portrait) and (max-width:700px){
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="2"],[data-count="4"],[data-count="6"]){--bet-chip-kind:1}
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) .bet-stack-amount{font-size:13px;line-height:17px;padding:1px 7px}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .bet-stack-amount{font-size:16px;line-height:21px;padding:2px 9px}   /* heads-up has the room: 19 -> 16 */
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) .bet-stack{--chip-d:18px;--chip-mb:-13.5px}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .bet-stack{--chip-d:22px;--chip-mb:-16.5px}
 body.mobile-game-active #table-screen .table-rail .poker-table:is([data-count="4"],[data-count="6"]){--side-bet-center:1}
 /* the pot's pill the bets' size, a hair more ("pots still a bit big"): its chip icon and padding with the text */
 body.mobile-game-active #table-screen .table-rail .poker-table .pot-total{--chip-d:15px;padding:1px 8px;gap:4px}
 /* ...20% bigger than the bets around it ("like make it 20% bigger than the bets"): 13 -> 15.5 at 4/6-max, 16 -> 19 heads-up */
 body.mobile-game-active #table-screen:not([data-variant="omaha"]) .table-rail .poker-table:is([data-count="4"],[data-count="6"]) .pot-total{--chip-d:17px;font-size:15.5px;line-height:20px}
 body.mobile-game-active:not(.larrys-table) #table-screen:not([data-variant="omaha"]) .table-rail .poker-table[data-count="2"] .pot-total{--chip-d:21px;font-size:19px;line-height:25px;padding:1px 10px}
}

/* Prop game badges on phone plaques (table.js _mirrorPropBadges; the phone pass, 2026-10-26: phones showed no NIT buttons or
   Red or Black calls at all): the NIT button and the call circle on the avatar's bottom-left corner, as on desktop, small */
/* ...as circles, a size you can read (Shaun, 2026-10-29: "i cant really make out the marker theyt are sosmall. maybe on mobile a
   circle yellow w black triangle inside and the red/blackmarker both a tad bigger"): the NIT button a 20px gold coin with a
   black triangle, no word; a call the same size (12px: "the could be like half the size", "still reduce 15%"). The word "NIT" / "RED" stays for screen readers (title). */
body.mobile-game-active #table-screen .poker-table .m-badges{position:absolute;left:0;bottom:-6px;z-index:30;display:flex;align-items:center;gap:2px;pointer-events:none}
body.mobile-game-active #table-screen .poker-table .m-badges :is(.p-badge-nit,.p-badge-rb,.p-badge-rbdot){width:12px;height:12px;padding:0;border-radius:50%;justify-content:center;font-size:0;letter-spacing:0;gap:0;box-shadow:0 0 0 1.5px rgb(0 0 0 / .55),0 1px 3px rgb(0 0 0 / .5)}
/* Symbols stay in the coin background so fractional plaque positions cannot move them independently.
   Optical offsets balance the triangle's broad base and the suits' unequal top/bottom weight. */
body.mobile-game-active #table-screen .poker-table .m-badges .p-badge-nit{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 6'%3E%3Cpath fill='%231a1006' d='M4 0L8 6H0Z'/%3E%3C/svg%3E") center calc(50% - .75px)/8px 6px no-repeat,linear-gradient(135deg,#ffd45e 0%,#f0a82b 100%)}
body.mobile-game-active #table-screen .poker-table .m-badges :is(.p-badge-rbdot--red,.p-badge-rb--red){background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23fff' d='M8 14C3 10.2 1 7.7 1 5.3 1 3.4 2.5 2 4.3 2c1.5 0 2.8.9 3.7 2.2C8.9 2.9 10.2 2 11.7 2 13.5 2 15 3.4 15 5.3c0 2.4-2 4.9-7 8.7Z'/%3E%3C/svg%3E") center calc(50% - .15px)/8px 8px no-repeat,var(--muck-suit-h)}
body.mobile-game-active #table-screen .poker-table .m-badges :is(.p-badge-rbdot--black,.p-badge-rb--black){background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%230e0e0e' d='M8 1.5c2.5 3 7 5.5 7 8.5 0 1.9-1.4 3.2-3.1 3.2-1.2 0-2.1-.6-2.7-1.4L10 14.5H6l.8-2.7c-.6.8-1.5 1.4-2.7 1.4C2.4 13.2 1 11.9 1 10c0-3 4.5-5.5 7-8.5Z'/%3E%3C/svg%3E") center calc(50% + .5px)/8px 8px no-repeat,var(--muck-text-2)}
body.mobile-game-active #table-screen .poker-table .m-badges :is(.p-badge-tri,.p-badge-rbdot svg,.p-badge-suit){display:none}
/* ...your plaque sits on the table's bottom edge, which cut the badges off below it: yours go on the avatar's top corner */
body.mobile-game-active #table-screen .poker-table #mobile-me-strip > .m-badges{bottom:auto;top:-6px}   /* on your avatar like everyone's (Shaun: "why are mine ... to the left of my pfp vs where everyone else is ON their pfp"); at 12px clear of your cards */