:root {
  --felt: #8b1220;
  --felt-dark: #3d060e;
  --felt-light: #b82030;
  --felt-center: #a01828;
  --rail: #0f0c0a;
  --rail-mid: #1a1410;
  --rail-pad: #2a1f16;
  --rail-highlight: #4a3d30;
  --rail-shadow: #080604;
  --gold: #c9a227;
  --gold-trim: #d4af37;
  --gold-dark: #9a7820;
  --gold-light: #e8c868;
  --table-noise: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
  --felt-noise: url("data:image/svg+xml,%3Csvg viewBox='0 0 128 128' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)' opacity='0.5'/%3E%3C/svg%3E");
  --cream: #f5f2eb;
  --primary: #2d2a26;
  --muted: #6b6560;
  --card-bg: #fffdf8;
  --line: #ddd5c8;
  --ok: #166534;
  --err: #991b1b;
  --frodo-purple: #5b21b6;
  --frodo-purple-dark: #4c1d95;
  --frodo-purple-bright: #7c3aed;
}

* { box-sizing: border-box; }
html, body { max-width: 100%; overflow-x: hidden; }
body {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  background: var(--cream);
  color: var(--primary);
  min-height: 100vh;
}
body.playing-table {
  overflow-x: hidden;
  background: #000;
  color: #f5f2eb;
  font-family: Arial, Helvetica, sans-serif;
}
body.playing-table .site-header {
  display: none;
}
body.playing-table .site-header h1 { color: var(--gold-light); }
body.playing-table .tagline { color: rgba(255,255,255,0.55); }
body.playing-table .btn-nav {
  background: rgba(255,255,255,0.08);
  border-color: rgba(212,175,55,0.35);
  color: #f5f2eb;
}

.hidden { display: none !important; }
#view-home:not(.hidden),
#view-lobby:not(.hidden),
#view-table:not(.hidden) {
  display: block;
}
body.playing-table #view-table:not(.hidden) {
  min-height: 1px;
}
.dev-only { display: none !important; }
body.dev-mode .dev-only { display: block !important; }
body.dev-mode .header-row.dev-only { display: block !important; }
body.dev-mode .footer-note.dev-only { display: block !important; }
body.dev-mode .table-turn-debug.dev-only:not(.hidden) { display: block !important; }
.muted { color: var(--muted); font-family: Arial, sans-serif; }
.small { font-size: 0.85rem; }

#lock-screen {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: linear-gradient(160deg, #2d1f14, #5c0000 55%, #2d2a26);
  color: #fff;
}
.lock-box {
  width: min(420px, 100%);
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 18px;
  padding: 24px;
  backdrop-filter: blur(6px);
}
.lock-box h1 { margin: 0 0 8px; font-size: 1.5rem; color: var(--gold); }
.lock-box p { font-family: Arial, sans-serif; font-size: 0.92rem; opacity: 0.88; }
.lock-box input {
  width: 100%;
  margin: 8px 0;
  padding: 12px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.2);
  background: rgba(0,0,0,0.25);
  color: #fff;
  font-size: 16px;
}
.lock-box button {
  width: 100%;
  margin-top: 8px;
  min-height: 44px;
  border: 0;
  border-radius: 999px;
  background: var(--gold);
  color: #2d2a26;
  font-weight: 800;
  cursor: pointer;
}

.site-header {
  padding: 16px 16px 0;
  max-width: 920px;
  margin: 0 auto;
}
.lab-badge {
  display: inline-block;
  font-family: Arial, sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: #fde68a;
  color: #78350f;
  padding: 4px 10px;
  border-radius: 999px;
}
.site-header h1 { margin: 8px 0 4px; color: var(--felt); }
.tagline { margin: 0 0 12px; font-family: Arial, sans-serif; color: var(--muted); }
.top-nav { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.btn-nav {
  min-height: 44px;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--primary);
  text-decoration: none;
  font-family: Arial, sans-serif;
  font-weight: 700;
  font-size: 0.85rem;
  cursor: pointer;
}

#app-shell {
  max-width: 960px;
  margin: 0 auto;
  padding: 12px 16px 28px;
}
body.playing-table #app-shell {
  max-width: min(1720px, 98vw);
  padding: 10px 16px calc(16px + env(safe-area-inset-bottom, 0px));
}
body.playing-table .table-sidebar {
  padding-top: 2px;
}
#setup-status {
  font-family: Arial, sans-serif;
  font-size: 0.9rem;
  padding: 10px 12px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid var(--line);
  margin-bottom: 12px;
}
#setup-status.error { border-color: #fecaca; background: #fef2f2; color: var(--err); font-weight: 600; }
#setup-status.ok { border-color: #bbf7d0; background: #f0fdf4; color: var(--ok); }

.panel {
  background: var(--card-bg);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 16px;
  margin-bottom: 12px;
  box-shadow: 0 8px 24px rgba(45,42,38,0.06);
}
.panel h2, .panel h3 { margin-top: 0; }
.hero-panel { border-color: rgba(212,175,55,0.45); }
.home-actions { margin-top: 14px; }
.defaults-list {
  margin: 0;
  padding-left: 1.1rem;
  font-family: Arial, sans-serif;
  line-height: 1.55;
}
.invite-banner {
  background: rgba(212, 175, 55, 0.12);
  border: 1px solid rgba(212, 175, 55, 0.35);
  border-radius: 8px;
  padding: 0.65rem 0.85rem;
  margin: 0.75rem 0;
  font-family: Arial, sans-serif;
}

.family-beta-notice {
  background: rgba(212, 175, 55, 0.12);
  border: 1px solid rgba(212, 175, 55, 0.35);
  border-radius: 8px;
  padding: 0.65rem 0.85rem;
  margin: 0.75rem 0 0;
  font-family: Arial, sans-serif;
  font-size: 0.88rem;
  line-height: 1.4;
}
.family-beta-notice p { margin: 0.35rem 0 0; }
.family-beta-notice strong { color: var(--felt); }

.invite-lock-hint {
  font-size: 0.9rem;
  color: #f0e6c8;
  background: rgba(212, 175, 55, 0.15);
  border: 1px solid rgba(212, 175, 55, 0.35);
  border-radius: 6px;
  padding: 0.5rem 0.65rem;
  margin: 0.5rem 0 0;
  line-height: 1.35;
}

.invite-lock-hint.hidden {
  display: none;
}

.invite-host-help {
  margin: 0 0 0.65rem;
  line-height: 1.4;
}

.btn {
  min-height: 44px;
  border: 0;
  border-radius: 12px;
  padding: 10px 14px;
  font-family: Arial, sans-serif;
  font-weight: 800;
  cursor: pointer;
}
.btn-primary { background: var(--felt); color: #fff; }
.btn-gold { background: var(--gold); color: #2d2a26; }
.btn-ghost { background: #fff; border: 1px solid var(--line); color: var(--primary); }
.wide { width: 100%; }

.lobby-head { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; }
#lobby-status,
.status-pill {
  font-family: Arial, sans-serif;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 5px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.1);
  color: rgba(255,255,255,0.75);
  border: 1px solid rgba(255,255,255,0.12);
}
#lobby-status[data-status="running"],
.status-pill[data-status="running"] {
  background: #166534;
  color: #ecfdf5;
  border-color: #22c55e;
}
#lobby-status[data-status="seating"],
.status-pill[data-status="seating"] { background: #78350f; color: #fef3c7; border-color: #d97706; }
#lobby-status[data-status="lobby"],
.status-pill[data-status="lobby"] { background: #312e81; color: #e0e7ff; border-color: #6366f1; }
#lobby-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  font-family: Arial, sans-serif;
  font-size: 0.88rem;
  margin: 10px 0 14px;
}
.roster-row, .payment-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
  font-family: Arial, sans-serif;
}
.roster-row .dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #22c55e;
}
.roster-row.offline .dot { background: #94a3b8; }
.roster-name { flex: 1; font-weight: 700; }
.roster-badge {
  font-family: Arial, sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 999px;
}
.roster-badge.ready { background: #dcfce7; color: #166534; }
.roster-badge.pending { background: #fef3c7; color: #92400e; }
.pay-toggle {
  font-family: Arial, sans-serif;
  font-size: 0.75rem;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #fff;
  cursor: pointer;
}
.pay-toggle.paid { background: #dcfce7; border-color: #86efac; color: #166534; font-weight: 700; }
.readiness-banner {
  font-family: Arial, sans-serif;
  font-size: 0.88rem;
  background: #fff;
  border: 1px dashed var(--line);
  border-radius: 12px;
  padding: 10px 12px;
  margin: 10px 0;
}
.readiness-banner ul { margin: 8px 0 0; padding-left: 1.1rem; }
.ready-ok { color: var(--ok); font-weight: 700; }
.gameplay-status {
  font-family: Arial, sans-serif;
  font-size: 0.85rem;
  margin: 0 0 12px;
  padding: 8px 10px;
  border-radius: 10px;
  background: #f8fafc;
}
.gameplay-status.ready { background: #dcfce7; color: #166534; font-weight: 700; }
.host-control-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.host-control-grid-primary {
  margin-top: 10px;
}
.host-control-secondary {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.btn-start-tournament {
  min-height: 52px;
  font-size: 1.05rem;
  letter-spacing: 0.03em;
  box-shadow: 0 4px 18px rgba(212, 175, 55, 0.35);
}
.gate-panel { border: 2px solid rgba(212,175,55,0.55); }
.gate-rules-list {
  font-family: Arial, sans-serif;
  line-height: 1.5;
  padding-left: 1.1rem;
  max-height: 34vh;
  overflow: auto;
}
.accept-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 14px 0;
  font-family: Arial, sans-serif;
  font-size: 0.92rem;
}
.accept-row input { width: 20px; height: 20px; margin-top: 2px; }
.btn:disabled { opacity: 0.45; cursor: not-allowed; }
.pay-pill {
  font-size: 0.75rem;
  padding: 4px 8px;
  border-radius: 999px;
  background: #f1f5f9;
  color: #64748b;
}
.pay-pill.paid { background: #dcfce7; color: #166534; }

.host-tools { margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--line); }
.invite-field {
  width: 100%;
  margin: 8px 0;
  padding: 10px;
  border-radius: 10px;
  border: 1px solid var(--line);
  font-size: 0.85rem;
}
.host-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.host-row input { flex: 1; min-width: 140px; padding: 10px; border-radius: 10px; border: 1px solid var(--line); font-size: 16px; }

.lobby-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }

/* Table page — three-panel desktop layout */
.table-page {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.table-layout {
  display: grid;
  /* Desktop: fixed sidebars (~280px each), center column dominates (~70% table feel) */
  grid-template-columns: minmax(260px, 280px) minmax(0, 1fr) minmax(260px, 280px);
  gap: 14px;
  align-items: start;
  max-width: min(1720px, 98vw);
  margin: 0 auto;
  width: 100%;
}

.table-sidebar {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}

.sidebar-panel {
  background: rgba(0,0,0,0.42);
  border: 1px solid rgba(212, 175, 55, 0.28);
  border-radius: 14px;
  padding: 12px;
}
.sidebar-panel-grow {
  flex: 1;
  min-height: 120px;
  display: flex;
  flex-direction: column;
}
.sidebar-title {
  margin: 0 0 8px;
  font-size: 0.82rem;
  font-family: Arial, sans-serif;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--gold);
}
.sidebar-line {
  margin: 0 0 6px;
  font-family: Arial, sans-serif;
  font-size: 0.82rem;
  line-height: 1.4;
  color: rgba(255,255,255,0.88);
}
.sidebar-roster-row {
  display: grid;
  grid-template-columns: 12px 1fr auto;
  gap: 2px 8px;
  align-items: center;
  padding: 7px 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  font-family: Arial, sans-serif;
  font-size: 0.8rem;
}
.sidebar-roster-icon {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #22c55e;
}
.sidebar-roster-icon.offline { background: #64748b; }
.sidebar-roster-row:last-child { border-bottom: 0; }
.sidebar-roster-name { font-weight: 700; color: #fff; }
.sidebar-roster-stack { font-weight: 800; color: var(--gold-light); text-align: right; }
.sidebar-roster-flags { grid-column: 1 / -1; }
.sidebar-roster-row.eliminated { opacity: 0.5; }
.sidebar-payment-row {
  flex-wrap: wrap;
  font-size: 0.78rem;
}
.sidebar-pay-name {
  flex: 1 1 100%;
  font-weight: 700;
  margin-bottom: 4px;
}
.sidebar-host-mount .host-tools {
  margin: 10px 0 0;
  padding: 0;
  border: 0;
}
.sidebar-host-mount .host-control-grid-primary {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.sidebar-host-mount .btn-start-tournament {
  width: 100%;
}
.sidebar-host-mount .btn {
  font-size: 0.78rem;
  min-height: 40px;
  padding: 8px 10px;
}
.sidebar-game-info .sidebar-line strong { color: var(--gold-light); }

.hand-history-list {
  flex: 1;
  overflow-y: auto;
  max-height: 320px;
  font-family: Arial, sans-serif;
  font-size: 0.78rem;
}
.hand-history-ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.hand-history-item {
  padding: 8px 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.82);
  line-height: 1.35;
}
.hand-history-item:last-child { border-bottom: 0; }
.hand-history-num {
  display: inline-block;
  font-weight: 800;
  color: var(--gold);
  margin-right: 6px;
}
.hand-history-live {
  color: #93c5fd;
  font-weight: 700;
}

.table-center-column {
  display: flex;
  flex-direction: column;
  gap: 14px;
  min-width: 0;
}

/* Table stage — approved artwork base + overlay layer (mockup coordinates) */
.table-felt-wrap {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  max-width: 100%;
  padding: 0;
  border: none;
  background: transparent;
  overflow: visible;
}

.poker-table-stage {
  position: relative;
  width: 100%;
  max-width: 100%;
}

/* Art layer — .poker-table-art (new shell) and .poker-table-oval (legacy prod DOM) */
.poker-table-art,
.poker-table-oval {
  position: relative;
  z-index: 1;
  width: 100%;
  aspect-ratio: 1000 / 633;
  max-height: min(580px, 52vh);
  margin: 0 auto;
  background-color: transparent;
  background-image: url("/holdem-lab/assets/poker-table-bg.png");
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  border: none;
  border-radius: 0;
  box-shadow: 0 28px 56px rgba(0, 0, 0, 0.72);
}

/* Legacy prod: seat-ring and oval are siblings inside felt-wrap — stack on same grid cell */
.table-felt-wrap > .poker-table-oval {
  grid-area: 1 / 1;
}

.table-felt-wrap > .seat-ring {
  grid-area: 1 / 1;
}

.poker-table-overlays {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
}

.poker-table-overlays .seat-ring,
.poker-table-overlays .pot-display,
.poker-table-overlays .community-board,
.poker-table-overlays .felt-winner-banner,
.poker-table-overlays .felt-action-banner {
  pointer-events: auto;
}

.table-status-banner {
  font-family: Arial, sans-serif;
  text-align: center;
  padding: 10px 14px;
  border-radius: 12px;
  font-size: 0.95rem;
  font-weight: 700;
}
.table-status-banner.is-action {
  background: rgba(0,0,0,0.42);
  border: 1px solid rgba(255,255,255,0.18);
  color: #e2e8f0;
}
.table-status-banner.is-winner {
  background: linear-gradient(135deg, rgba(212,175,55,0.35), rgba(212,175,55,0.12));
  border: 2px solid var(--gold);
  color: var(--gold-light);
  font-size: 1.05rem;
  text-shadow: 0 1px 8px rgba(0,0,0,0.45);
}

.table-back-btn {
  align-self: center;
  min-width: 200px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(212,175,55,0.35);
  color: #f5f2eb;
}

/* Legacy table-shell — kept for compat, unused */
.table-shell {
  display: none;
}

.tournament-header-bar {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px 12px;
  font-family: Arial, sans-serif;
  font-size: 0.78rem;
  background: rgba(0,0,0,0.72);
  border: 1px solid rgba(212, 175, 55, 0.45);
  border-radius: 12px;
  padding: 11px 16px;
  max-width: min(1720px, 98vw);
  margin: 0 auto;
  width: 100%;
}
.th-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.th-label {
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
}
.th-value {
  font-size: 0.92rem;
  font-weight: 800;
  color: var(--gold-light);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.th-next-blinds,
.break-status {
  grid-column: 1 / -1;
  font-size: 0.72rem;
  color: rgba(255,255,255,0.72);
}
.break-status:not(.hidden) {
  color: #fde68a;
  font-weight: 700;
}

.action-banner,
.winner-banner {
  font-family: Arial, sans-serif;
  text-align: center;
  padding: 10px 14px;
  border-radius: 12px;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}
.action-banner {
  background: rgba(0,0,0,0.42);
  border: 1px solid rgba(255,255,255,0.18);
  color: #e2e8f0;
}
.winner-banner {
  background: linear-gradient(135deg, rgba(212,175,55,0.35), rgba(212,175,55,0.15));
  border: 2px solid var(--gold);
  color: var(--gold-light);
  font-size: 1.05rem;
  text-shadow: 0 1px 8px rgba(0,0,0,0.45);
}

.table-center {
  flex: 1;
  display: grid;
  place-items: center;
  position: relative;
  min-height: 0;
  padding: 0;
}

.poker-table-overlays .pot-display,
.poker-table-overlays .community-board,
.poker-table-overlays .felt-winner-banner,
.poker-table-overlays .felt-action-banner {
  z-index: 3;
}
.seat-ring {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 6;
}
.felt-winner-banner,
.felt-action-banner {
  position: absolute;
  left: 50%;
  top: 64%;
  transform: translate(-50%, -50%);
  z-index: 4;
  max-width: 82%;
  text-align: center;
  font-family: Arial, sans-serif;
  font-weight: 800;
  font-size: 0.78rem;
  line-height: 1.3;
  padding: 6px 11px;
  border-radius: 8px;
  pointer-events: none;
}
.felt-winner-banner {
  background: linear-gradient(135deg, rgba(212,175,55,0.55), rgba(212,175,55,0.2));
  border: 1.5px solid var(--gold);
  color: var(--gold-light);
  text-shadow: 0 1px 8px rgba(0,0,0,0.5);
  top: 60%;
}
.felt-action-banner {
  background: rgba(0,0,0,0.55);
  border: 1px solid rgba(255,255,255,0.2);
  color: #e2e8f0;
  top: 64%;
  font-size: 0.7rem;
}
.seat-hole-cards {
  display: flex;
  gap: 3px;
  justify-content: center;
  margin-top: 8px;
}
.seat-hole-cards .card-slot {
  width: 32px;
  height: 44px;
  border-radius: 5px;
}
.seat-pos-1 .seat-hole-cards { margin-top: 4px; }

.seat-node {
  position: absolute;
  transform: translate(-50%, -50%);
  text-align: center;
  min-width: 74px;
  max-width: 94px;
  z-index: 3;
}

.seat-avatar-wrap {
  position: relative;
  display: flex;
  justify-content: center;
  margin-bottom: 6px;
}
.seat-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 2px solid var(--gold-trim);
  background: rgba(0, 0, 0, 0.55);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
}
.seat-avatar.open {
  background: radial-gradient(circle at 35% 30%, rgba(212, 175, 55, 0.35), rgba(0, 0, 0, 0.65));
  color: var(--gold-light);
  font-size: 1.15rem;
}
.seat-avatar.occupied {
  background: radial-gradient(circle at 35% 30%, #57534e, #1c1917);
  color: rgba(255, 255, 255, 0.82);
  font-size: 1.05rem;
}
.seat-avatar.occupied::before {
  content: "";
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.72);
  mask: radial-gradient(circle at 50% 35%, #000 42%, transparent 43%);
  -webkit-mask: radial-gradient(circle at 50% 35%, #000 42%, transparent 43%);
}
.seat-avatar.open::before {
  content: "🪑";
  font-size: 1rem;
  line-height: 1;
}
.dealer-button {
  position: absolute;
  top: -3px;
  right: -5px;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: linear-gradient(180deg, var(--gold-light), var(--gold));
  color: #2d2a26;
  font-family: Arial, sans-serif;
  font-size: 0.52rem;
  font-weight: 900;
  display: grid;
  place-items: center;
  border: 1px solid var(--gold-dark);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.45);
  z-index: 2;
}

/* 10-seat oval layout (position = seatIndex + 1) — approved mockup % coords */
/* Pull seat labels slightly inward from rail artwork */
.seat-pos-1  .seat-card { transform: translateY(-6px); }
.seat-pos-2  .seat-card { transform: translate(-5px, -5px); }
.seat-pos-9  .seat-card { transform: translate(5px, -5px); }
.seat-pos-3  .seat-card { transform: translateX(-6px); }
.seat-pos-4  .seat-card { transform: translateX(-6px); }
.seat-pos-8  .seat-card { transform: translateX(6px); }
.seat-pos-10 .seat-card { transform: translateX(6px); }
.seat-pos-5  .seat-card { transform: translateY(5px); }
.seat-pos-6  .seat-card { transform: translateY(6px); }
.seat-pos-7  .seat-card { transform: translateY(5px); }

.seat-pos-1  { left: 50%;  top: 94%; }
.seat-pos-2  { left: 80%;  top: 88%; }
.seat-pos-3  { left: 93%;  top: 38%; }
.seat-pos-4  { left: 94%;  top: 54%; }
.seat-pos-5  { left: 70%;  top: 8%;  }
.seat-pos-6  { left: 50%;  top: 5%;  }
.seat-pos-7  { left: 30%;  top: 8%;  }
.seat-pos-8  { left: 7%;   top: 38%; }
.seat-pos-9  { left: 20%;  top: 88%; }
.seat-pos-10 { left: 6%;   top: 54%; }

.seat-felt-chips {
  position: relative;
  z-index: 2;
  margin: 4px auto 0;
  pointer-events: none;
}
.seat-pos-1 .seat-felt-chips { transform: translate(0, -26px); }
.seat-pos-2 .seat-felt-chips { transform: translate(-18px, -20px); }
.seat-pos-3 .seat-felt-chips { transform: translate(-24px, -4px); }
.seat-pos-4 .seat-felt-chips { transform: translate(-24px, 4px); }
.seat-pos-5 .seat-felt-chips { transform: translate(-18px, 20px); }
.seat-pos-6 .seat-felt-chips { transform: translate(0, 26px); }
.seat-pos-7 .seat-felt-chips { transform: translate(18px, 20px); }
.seat-pos-8 .seat-felt-chips { transform: translate(24px, 4px); }
.seat-pos-9 .seat-felt-chips { transform: translate(24px, -4px); }
.seat-pos-10 .seat-felt-chips { transform: translate(18px, -20px); }

.seat-card {
  background: rgba(0,0,0,0.62);
  border: 1px solid rgba(212, 175, 55, 0.35);
  border-radius: 8px;
  padding: 6px 8px;
  backdrop-filter: blur(4px);
}
.seat-name {
  font-family: Arial, sans-serif;
  font-size: 0.66rem;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.seat-stack {
  font-family: Arial, sans-serif;
  font-size: 0.62rem;
  font-weight: 700;
  color: #4ade80;
  margin-top: 2px;
}
.seat-open-label {
  display: block;
  font-size: 0.58rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.72);
}
.seat-node.empty .seat-name {
  color: var(--gold-light);
  font-weight: 700;
  font-size: 0.61rem;
  white-space: normal;
  line-height: 1.25;
}
.seat-node.hero .seat-card {
  outline: 2px solid var(--gold);
  box-shadow: 0 0 12px rgba(212, 175, 55, 0.45);
}
.seat-node.turn .seat-card {
  outline: 3px solid #38bdf8;
  box-shadow: 0 0 14px rgba(56, 189, 248, 0.55);
}
.seat-node.folded .seat-card { opacity: 0.5; }
.seat-flags {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  justify-content: center;
  margin-top: 4px;
}
.seat-flag {
  display: inline-block;
  font-family: Arial, sans-serif;
  font-size: 0.48rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  border-radius: 3px;
  padding: 1px 4px;
}
.seat-flag.dealer { background: var(--gold); color: #2d2a26; }
.seat-flag.allin { background: #6366f1; color: #fff; }
.seat-flag.folded-flag { background: #78716c; color: #fff; }
.seat-flag.disconnected { background: #57534e; color: #fff; }
.seat-flag.sitting-out { background: #44403c; color: #fff; }
.seat-flag.eliminated { background: #292524; color: #fff; }

/* Chip stack visuals */
.chip-stack {
  position: relative;
  height: 28px;
  margin: 4px auto 0;
  width: 32px;
  filter: drop-shadow(0 3px 5px rgba(0, 0, 0, 0.45));
  transform: scale(0.88);
  transform-origin: center bottom;
}
.chip-stack.stack-xs { height: 23px; }
.chip-stack.stack-sm { height: 33px; }
.chip-stack.stack-md { height: 40px; }
.chip-stack.stack-lg { height: 47px; }
.chip.disc {
  position: absolute;
  left: 50%;
  bottom: calc(var(--chip-i) * 4px);
  transform: translateX(-50%);
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 2px dashed rgba(255,255,255,0.65);
  box-shadow:
    0 3px 6px rgba(0,0,0,0.55),
    inset 0 2px 4px rgba(255,255,255,0.25),
    inset 0 -2px 4px rgba(0,0,0,0.35);
  display: grid;
  place-items: center;
}
.chip-face {
  font-family: Arial, sans-serif;
  font-size: 0.42rem;
  font-weight: 900;
  color: #fff;
  text-shadow: 0 1px 1px rgba(0,0,0,0.6);
}
.chip-green { background: radial-gradient(circle at 35% 30%, #6ee7a0, #16a34a); }
.chip-red { background: radial-gradient(circle at 35% 30%, #fb7185, #dc2626); }
.chip-black { background: radial-gradient(circle at 35% 30%, #78716c, #292524); }
.chip-blue { background: radial-gradient(circle at 35% 30%, #7dd3fc, #2563eb); }
.chip-gold { background: radial-gradient(circle at 35% 30%, #fef08a, #ca8a04); border-color: #fef9c3; }
.chip-purple { background: radial-gradient(circle at 35% 30%, #ddd6fe, #7c3aed); border-color: #fef08a; }

.pot-display {
  position: absolute;
  left: 50%;
  top: 24%;
  transform: translate(-50%, -50%);
  text-align: center;
  z-index: 3;
  width: 82%;
}
.community-board {
  position: absolute;
  left: 50%;
  top: 47%;
  transform: translate(-50%, -50%);
  z-index: 3;
  display: flex;
  gap: 9px;
  justify-content: center;
  flex-wrap: wrap;
  padding: 4px 0;
}
.pot-label {
  display: block;
  font-family: Arial, sans-serif;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: var(--gold);
  margin-bottom: 1px;
}
.pot-amount,
.pot-display strong {
  display: block;
  font-size: clamp(1.35rem, 4.2vw, 1.85rem);
  font-weight: 900;
  color: var(--gold-light);
  text-shadow: 0 2px 12px rgba(0,0,0,0.5);
  line-height: 1.05;
}
.pot-breakdown {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 8px;
}
.pot-breakdown.hidden { display: none; }
.pot-side-row {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 8px;
}
.pot-side-label {
  font-family: Arial, sans-serif;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.82);
}
.table-controls-row {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(180px, 0.75fr);
  gap: 12px;
  align-items: end;
}
.table-controls-left {
  text-align: left;
}
.table-controls-right {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
}
.your-seat-box {
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(212, 175, 55, 0.28);
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 10px;
}
.your-seat-box .dock-title {
  text-align: left;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 4px;
}
.your-seat-box .hero-stack-line {
  text-align: left;
  margin: 0;
  font-weight: 700;
}
.btn-start-next-hand {
  min-height: 52px;
  min-width: 180px;
  font-size: 1rem;
}
.table-bottom-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: space-between;
  padding: 10px 12px;
  background: rgba(0,0,0,0.55);
  border: 1px solid rgba(212, 175, 55, 0.28);
  border-radius: 12px;
}
.table-nav-btn {
  flex: 1 1 auto;
  min-width: 120px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(212, 175, 55, 0.3);
  color: #f5f2eb;
  font-family: Arial, sans-serif;
  font-size: 0.82rem;
  font-weight: 700;
}
.table-nav-btn.table-nav-leave,
#leave-table-btn {
  color: #fca5a5;
}
.table-nav-btn.is-off {
  opacity: 0.55;
  text-decoration: line-through;
}
.sidebar-brand,
.lobby-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.brand-logo {
  border-radius: 10px;
  border: 2px solid var(--gold);
  object-fit: cover;
  background: var(--frodo-purple-dark);
}
.brand-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
  color: var(--gold-light);
  line-height: 1.2;
}
.brand-subtitle {
  margin: 2px 0 0;
  font-family: Arial, sans-serif;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: rgba(255,255,255,0.55);
  text-transform: uppercase;
}
.sidebar-signed-in {
  margin: 0 0 10px;
  font-family: Arial, sans-serif;
  font-size: 0.82rem;
  color: rgba(255,255,255,0.78);
}
.sidebar-role {
  color: var(--gold);
  font-weight: 700;
}
.sidebar-status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.sidebar-label {
  font-family: Arial, sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.55);
}
.sidebar-clock {
  margin-bottom: 10px;
}
.sidebar-readiness-bar {
  font-family: Arial, sans-serif;
  font-size: 0.82rem;
  font-weight: 700;
  padding: 10px 12px;
  border-radius: 10px;
  margin-bottom: 12px;
  line-height: 1.35;
}
.sidebar-readiness-bar.is-ready {
  background: #166534;
  color: #ecfdf5;
  border: 1px solid #22c55e;
}
.sidebar-readiness-bar.is-waiting {
  background: rgba(255,255,255,0.06);
  color: rgba(255,255,255,0.72);
  border: 1px dashed rgba(255,255,255,0.18);
}
.sidebar-readiness-bar.is-active {
  background: rgba(212, 175, 55, 0.15);
  color: var(--gold-light);
  border: 1px solid rgba(212, 175, 55, 0.4);
}
.sidebar-footer-links {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,0.1);
}
.sidebar-link {
  background: transparent;
  border: 0;
  color: rgba(255,255,255,0.65);
  font-family: Arial, sans-serif;
  font-size: 0.78rem;
  font-weight: 700;
  text-align: left;
  padding: 6px 0;
  cursor: pointer;
}
.sidebar-link:hover:not(:disabled) { color: var(--gold-light); }
.sidebar-link:disabled { opacity: 0.45; cursor: not-allowed; }
.game-info-list {
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: Arial, sans-serif;
  font-size: 0.8rem;
}
.game-info-list li {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 7px 0;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.72);
}
.game-info-list li:last-child { border-bottom: 0; }
.game-info-list li strong {
  color: var(--gold-light);
  font-weight: 800;
  text-align: right;
}
.lobby-panel #lobby-status[data-status="running"] {
  background: #dcfce7;
  color: #166534;
  border-color: #86efac;
}
body.playing-table .table-sidebar #table-status-pill[data-status="running"],
body.playing-table .table-sidebar .status-pill[data-status="running"] {
  background: #166534;
  color: #ecfdf5;
  border: 1px solid #22c55e;
  font-weight: 800;
}
.lobby-panel #lobby-status[data-status="lobby"] {
  background: #ede9fe;
  color: #5b21b6;
  border-color: #c4b5fd;
}
.lobby-panel #lobby-status[data-status="seating"] {
  background: #fef3c7;
  color: #92400e;
  border-color: #fcd34d;
}
.lobby-panel .status-pill,
.lobby-panel #lobby-status {
  color: inherit;
}
.pot-side-amount {
  font-size: 0.95rem;
  font-weight: 900;
  color: #fff;
}

.community-cards, .hero-cards {
  display: flex;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
}
.pot-display .community-cards {
  margin-top: 0;
}
.community-board .card-slot {
  width: 42px;
  height: 58px;
  border-radius: 6px;
}
.card-slot {
  width: 44px;
  height: 62px;
  border-radius: 7px;
  background: linear-gradient(180deg, #fff, #eef2f7);
  color: #111;
  display: grid;
  place-items: center;
  font-weight: 900;
  border: 1px solid rgba(255,255,255,0.35);
  box-shadow: 0 6px 16px rgba(0,0,0,0.25);
}
.card-slot.red { color: #b91c1c; }
.card-slot.empty { opacity: 0.35; background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.5); }

/* FrOdo branded card backs — frodo-logo.png at site root /assets/ */
.card-back {
  background-image: url('/assets/frodo-logo.png');
  background-color: var(--frodo-purple-bright);
  background-size: 72%;
  background-position: center;
  background-repeat: no-repeat;
  color: transparent;
  border: 2px solid var(--gold-trim);
  box-shadow:
    0 4px 12px rgba(0, 0, 0, 0.38),
    0 0 14px rgba(212, 175, 55, 0.32),
    inset 0 0 0 2px rgba(212, 175, 55, 0.5),
    inset 0 0 16px rgba(212, 175, 55, 0.12);
  filter: brightness(1.14) contrast(1.1) saturate(1.08);
  overflow: hidden;
}
.seat-hole-cards .card-back {
  background-size: 76%;
}

.hero-dock,
.table-controls-dock {
  background: rgba(0,0,0,0.45);
  border: 1px solid rgba(212, 175, 55, 0.32);
  border-radius: 16px;
  padding: 14px;
}
.table-controls-dock {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.hero-hand-block { text-align: center; }
.dock-title,
.table-controls-dock h3 {
  margin: 0 0 6px;
  font-size: 0.9rem;
  color: var(--gold-light);
  text-align: center;
}
.bet-input-label {
  font-family: Arial, sans-serif;
  font-size: 0.82rem;
  font-weight: 700;
  color: rgba(255,255,255,0.75);
}
.hero-dock h3 { margin: 0 0 6px; font-size: 0.95rem; color: var(--gold-light); }
.hero-stack-line {
  margin: 0 0 8px;
  font-family: Arial, sans-serif;
  font-size: 0.88rem;
  color: rgba(255,255,255,0.88);
}
.action-timer-display {
  margin: 0 0 8px;
  font-family: Arial, sans-serif;
  font-size: 0.85rem;
  font-weight: 700;
  color: rgba(255,255,255,0.75);
  text-align: center;
}
.action-timer-display.timer-urgent {
  color: #fecaca;
}
.action-bar {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
.btn-action {
  min-height: 52px;
  font-size: 1rem;
  border-radius: 14px;
  font-family: Arial, sans-serif;
  font-weight: 800;
  cursor: pointer;
  border: 0;
}
.btn-check-call {
  background: #5b21b6;
  color: #fff;
  border: 1px solid #8b5cf6;
}
.btn-bet-raise {
  background: linear-gradient(180deg, var(--gold-light), var(--gold));
  color: #2d2a26;
}
.btn-raise-alt {
  background: linear-gradient(180deg, #d4a574, #8b6914);
  color: #fff;
  border: 1px solid rgba(212, 175, 55, 0.45);
}
.btn-fold {
  background: var(--felt);
  border: 1px solid rgba(212, 175, 55, 0.35);
  color: #f9fafb;
}
.table-controls-dock {
  background: rgba(0,0,0,0.45);
  border: 1px solid rgba(212, 175, 55, 0.32);
  border-radius: 16px;
  padding: 14px;
}
.table-controls-dock .bet-input-row {
  margin: 0 0 10px;
}
.table-controls-dock .action-bar {
  margin: 0;
}
.table-host-between-hands {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  align-items: stretch;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(212, 175, 55, 0.28);
  border-radius: 14px;
  padding: 12px;
}
.table-host-between-hands.hidden {
  display: none;
}
.table-host-between-hands .muted.small {
  margin: 0;
  text-align: center;
}

.timer-host-field { display: block; margin-top: 10px; }
#action-timer-input {
  width: 5rem;
  padding: 8px;
  border-radius: 8px;
  border: 1px solid var(--line);
  margin-right: 8px;
}

.seat-node.disconnected .seat-card { opacity: 0.75; }
.seat-node.sitting-out { opacity: 0.55; }
.seat-node.eliminated { opacity: 0.45; }
body.playing-table .final-two-status {
  background: rgba(212, 175, 55, 0.12);
  border-color: rgba(212, 175, 55, 0.45);
  color: #fde68a;
  font-size: 0.78rem;
  margin-top: 8px;
  padding: 8px 10px;
}
body.playing-table .turn-indicator {
  display: block;
  margin-top: 6px;
  font-family: Arial, sans-serif;
  font-size: 0.82rem;
  color: #93c5fd;
}
.hand-summary, .showdown-banner, .table-turn-debug {
  font-family: Arial, sans-serif;
  font-size: 0.82rem;
  text-align: center;
  margin: 0;
  padding: 6px;
}
.bet-input-row {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin: 8px 0;
  font-family: Arial, sans-serif;
}
.bet-input-row input {
  width: 100%;
  padding: 10px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,0.25);
  background: rgba(0,0,0,0.2);
  color: #fff;
  font-size: 16px;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  z-index: 9000;
}
.modal-panel {
  width: min(520px, 100%);
  max-height: 85vh;
  overflow: auto;
  background: var(--card-bg);
  border-radius: 16px;
  padding: 18px;
}
.rules-body ul {
  font-family: Arial, sans-serif;
  line-height: 1.55;
  padding-left: 1.1rem;
}
.footer-note {
  text-align: center;
  font-family: Arial, sans-serif;
  font-size: 0.78rem;
  color: var(--muted);
}

@media (max-width: 900px) {
  .table-layout {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .table-sidebar-left {
    order: 4;
  }
  .table-center-column {
    order: 2;
  }
  .table-sidebar-right {
    order: 5;
  }
  .table-page > .tournament-header-bar {
    order: 1;
  }
  .table-page {
    display: flex;
    flex-direction: column;
  }
  .hand-history-list {
    max-height: 200px;
  }
  .sidebar-host-mount .host-control-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  body.playing-table #app-shell {
    padding: 8px 10px calc(12px + env(safe-area-inset-bottom, 0px));
    overflow-x: hidden;
  }
  body.playing-table #view-table {
    min-width: 0;
  }
  .tournament-header-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    font-size: 0.72rem;
    padding: 8px 10px;
  }
  .th-timer-item { grid-column: 1 / -1; }
  .th-value { font-size: 0.82rem; }
  .table-felt-wrap {
    padding: 0;
  }
  .poker-table-art,
  .poker-table-oval {
    max-height: 220px;
  }
  .seat-node {
    min-width: 72px;
    max-width: 88px;
  }
  .seat-name { font-size: 0.68rem; }
  .seat-stack { font-size: 0.62rem; }
  .chip.disc { width: 24px; height: 24px; }
  .chip-face { font-size: 0.42rem; }
  .card-slot { width: 40px; height: 56px; font-size: 0.85rem; }
  .pot-amount, .pot-display strong { font-size: 1.35rem; }
  .table-status-banner.is-winner { font-size: 0.92rem; }
  .action-bar {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .btn-action { width: 100%; min-height: 52px; font-size: 1.05rem; }
.table-controls-row {
    grid-template-columns: 1fr;
  }
  .table-controls-right {
    justify-content: stretch;
  }
  .btn-start-next-hand {
    width: 100%;
  }
  .table-bottom-nav {
    flex-direction: column;
  }
  .table-nav-btn {
    width: 100%;
  }
}

@media (max-width: 720px) and (orientation: landscape) {
  .table-layout {
    grid-template-columns: 1fr minmax(200px, 260px);
    grid-template-rows: auto auto;
  }
  .table-sidebar-left { display: none; }
  .table-center-column { grid-column: 1; }
  .table-sidebar-right {
    grid-column: 2;
    grid-row: 1 / 3;
  }
  .poker-table-art,
  .poker-table-oval {
    max-height: 180px;
    width: min(100%, 300px);
  }
}

.tournament-clock-panel,
.break-banner,
.bounty-toast,
.final-two-status {
  font-family: Arial, sans-serif;
  font-size: 0.9rem;
  margin: 8px 0;
  padding: 10px 12px;
  border-radius: 10px;
  background: #fff;
  border: 1px solid var(--line);
}

.break-banner {
  background: #fef3c7;
  border-color: #f59e0b;
  color: #92400e;
}

.bounty-toast {
  background: #ecfdf5;
  border-color: #10b981;
  color: #065f46;
}

.final-two-status {
  background: rgba(212, 175, 55, 0.15);
  border-color: var(--gold);
}

.blind-timer.timer-paused { opacity: 0.65; }
.blind-timer.timer-urgent { color: var(--err); font-weight: 700; }

.final-two-choices {
  display: grid;
  gap: 8px;
  margin: 12px 0;
}

.summary-panel { max-width: min(520px, 96vw); }
.summary-panel ul { padding-left: 1.2rem; }
.summary-badge {
  display: inline-block;
  margin: 2px 4px 2px 0;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(212, 175, 55, 0.2);
  font-size: 0.78rem;
  font-family: Arial, sans-serif;
}

.seat-node.eliminated { opacity: 0.45; }
.seat-flag.eliminated { background: #444; color: #fff; }

.roster-row.eliminated .roster-name { text-decoration: line-through; opacity: 0.7; }

/* Sprint 7 — mobile tournament UX */
.modal-backdrop {
  padding: max(16px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px))
    max(16px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
}
#tournament-summary-modal { z-index: 9100; }
#final-two-modal { z-index: 9050; }
#winner-modal { z-index: 9000; }

@media (max-width: 720px) {
  .host-control-grid {
    grid-template-columns: 1fr;
  }
  .th-next-blinds,
  #table-break-status,
  #final-two-status {
    grid-column: 1 / -1;
    font-size: 0.68rem;
    line-height: 1.35;
  }
  .final-two-choices .btn {
    min-height: 48px;
  }
  .summary-panel {
    max-height: min(78vh, 100%);
  }
  .tournament-clock-panel,
  .break-banner,
  .bounty-toast {
    font-size: 0.82rem;
    padding: 8px 10px;
  }
}

@media (max-width: 390px) {
  .seat-node {
    min-width: 64px;
    max-width: 78px;
  }
  .tournament-header-bar {
    font-size: 0.66rem;
  }
  .card-slot { width: 36px; height: 50px; font-size: 0.78rem; }
  .poker-table-art,
  .poker-table-oval { max-height: 190px; width: min(100%, 300px); }
}
