/* Table shell, felt, seats, cards, controls — Step 4 split from index.html */
:root {
  --bg: #0d3b2c;
  --gold: #d4af37;
  --text: #f5f5f5;
  --muted: rgba(255, 255, 255, 0.75);
  --red-suit: #e53935;
  --black-suit: #1a1a1a;
  --black-card-border: #000000;
  --card-back: #1e3a5f;
  --safe-bottom: max(12px, env(safe-area-inset-bottom));
  --safe-top: max(8px, env(safe-area-inset-top));
  --rail-w: 0px;
  --layout-rail-w: 0px;
  --table-edge-out: 0px;
  --table-body-lift-y: -1cm;
  --table-nudge-y: 3cm;
  --table-grow-w: 9cm;
  --table-grow-h: 4cm;
  /* 宽度实际上限：min(w按视口宽, avail-h×此系数)；常见屏后者更小，改 grow-w 往往无效 */
  --table-max-w-by-h: 1.72;
  --board-nudge-y: 1cm;
  --board-lift-y: -1cm;
  /* 公共牌区尺寸：改 grow-w 无效时，先看 --board-width-pct 是否更小 */
  --board-width-pct: 90%;
  --board-max-w: 680px;
  --board-grow-w: 4cm;
  --board-slots-nudge-x: 0.5cm;
  --board-slot-w-extra: calc(var(--board-grow-w) * 0.115);
  --board-slot-h-extra: calc(var(--board-slot-w-extra) * 1.367);
  --board-row-min-h: clamp(88px, 20cqw, calc(116px + var(--board-slot-h-extra)));
  --board-breathe-bottom: clamp(6px, 1cqw, 10px);
  --board-settle-lines: 3;
  --board-settle-font: clamp(13px, 2.75cqw, 17px);
  --board-settle-line-slot: clamp(20px, 4.25cqw, 26px);
  --board-settle-gap: clamp(4px, 0.55cqw, 7px);
  --board-settle-pad-block: clamp(3px, 0.5cqw, 5px);
  --board-settle-block-h: calc(
    var(--board-settle-pad-block) * 2 +
      var(--board-settle-lines) * var(--board-settle-line-slot) +
      (var(--board-settle-lines) - 1) * var(--board-settle-gap)
  );
  --hero-hole-ry: 47.5%;
  --hero-hole-nudge-x: -0.45cm;
  --hero-hole-nudge-y: 0.25cm;
  --hero-dock-felt-gap: 1cm;
  --layout-hero-dock-h: clamp(78px, 9.5vh, 96px);
  --hero-dock-main-h: clamp(78px, 9.5vh, 96px);
  --hero-dock-max-w: min(720px, 96vw);
  --hero-dock-act-btn-w: clamp(76px, 11.5vw, 92px);
  --hero-dock-act-gap: 6px;
  --hero-dock-allin-w: calc(var(--hero-dock-act-btn-w) * 3 + var(--hero-dock-act-gap) * 2);
  --hero-dock-btn-min-h: clamp(26px, 3.6vh, 30px);
  --hero-dock-allin-min-h: clamp(28px, 3.8vh, 32px);
  --hero-dock-btn-font: clamp(10px, 2.3vmin, 12px);
  --hero-dock-chip-size: clamp(36px, 4.4vmin, 44px);
  --hero-dock-chip-font: clamp(8px, 1.9vmin, 10px);
  --hero-dock-chip-amount-font: clamp(11px, 2.4vmin, 13px);
  --hero-dock-cancel-min-h: 24px;
  --hero-dock-cancel-font: 9px;
  --hero-dock-help-size: 18px;
  --hero-dock-help-font: 10px;
  --hero-info-card-w: 112px;
  --hero-dock-chip-panel-w: clamp(292px, 40vw, 336px);
  --hero-dock-amount-w: 7.8em;
  --hero-dock-amount-shift-x: -1cm;
}
* { box-sizing: border-box; }
html, body {
  height: 100%;
  margin: 0;
  overflow: hidden;
}
body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  background-color: #1a2438;
  background-image:
    radial-gradient(ellipse 110% 70% at 50% -8%, rgba(55, 75, 120, 0.38) 0%, transparent 58%),
    radial-gradient(ellipse 90% 55% at 50% 108%, rgba(0, 0, 0, 0.78) 0%, transparent 62%),
    radial-gradient(ellipse 52% 42% at 50% 46%, rgba(40, 62, 98, 0.14) 0%, transparent 74%),
    linear-gradient(180deg, #1e2d48 0%, #141e30 48%, #0c1220 100%);
  color: var(--text);
  min-height: 100dvh;
  width: 100vw;
}
.felt-outer:not(.felt-outer--duel) .oval-hub {
  display: none;
}
.felt-outer--duel .oval-hub {
  display: none !important;
}
.app-shell {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100dvh;
  max-height: 100dvh;
  padding: var(--safe-top) max(8px, env(safe-area-inset-right)) var(--safe-bottom)
    max(8px, env(safe-area-inset-left));
  gap: 6px;
  min-height: 0;
}
.table-stage {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  width: 100%;
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, transparent 18%),
    linear-gradient(180deg, #2a3854 0%, #1a2438 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
.oval-hub {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%, -32%);
  z-index: 8;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  width: min(92%, 420px);
  pointer-events: none;
}
.oval-hub .controls-top--hub {
  pointer-events: auto;
}
.oval-hub .dealer-stand {
  transform: translateY(0);
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.4));
}
.table-top-hub {
  display: none;
}
.dealer-stand {
  display: flex;
  flex-direction: column;
  align-items: center;
  pointer-events: none;
}
.dealer-stand__fig {
  position: relative;
  width: clamp(52px, 10.5vmin, 76px);
  height: clamp(74px, 14.5vmin, 108px);
  border-radius: 8px;
  background-color: transparent;
  background-image: url("../img/dealer-stand.png");
  background-size: contain;
  background-position: center bottom;
  background-repeat: no-repeat;
  box-shadow: none;
  overflow: visible;
  mix-blend-mode: screen;
  filter:
    drop-shadow(0 4px 12px rgba(0, 0, 0, 0.55))
    brightness(1.06)
    contrast(1.08)
    saturate(0.92);
}
.dealer-stand__fig::before,
.dealer-stand__fig::after {
  content: none;
  display: none;
}
.dealer-stand__lbl {
  margin-top: 2px;
  font-size: clamp(9px, 1.8vmin, 11px);
  font-weight: 800;
  color: rgba(255, 255, 255, 0.9);
  letter-spacing: 0.18em;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.85);
}
.controls-top--hub {
  width: auto;
  min-width: min(200px, 46vw);
  max-width: 92vw;
  margin: 0;
}
.controls-top--hub .btn--new {
  min-height: 40px;
  padding: 10px 20px;
  font-size: 14px;
  border-radius: 11px;
  box-shadow: 0 3px 0 rgba(0, 0, 0, 0.35);
}
.controls-top--hub .btn--bankrupt-reset {
  background: linear-gradient(180deg, #5a6578 0%, #3a4252 100%);
  color: #f0ead8;
  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.35);
}
/* LOCKED perspective baseline — do not change when tuning layout/UI (2026-06) */
.table-root {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  max-height: 100%;
  width: 100%;
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin-top: var(--table-nudge-y);
  overflow: visible;
  transform: rotateX(45deg);
  transform-origin: 50% 42%;
  transform-style: preserve-3d;
}
.table-scene {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  width: 100%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: 700px;
  perspective-origin: 50% 38%;
  transform-style: preserve-3d;
  padding: 4px 8px calc(var(--layout-hero-dock-h, 96px) + clamp(6px, 0.8vh, 10px));
  overflow: visible;
}
.table-scene::before,
.table-scene::after {
  display: none;
}
.seat-info-layer {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: var(--layout-hero-dock-h, 96px);
  pointer-events: none;
  z-index: 28;
  overflow: visible;
}
.seat-bubble-layer {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: var(--layout-hero-dock-h, 96px);
  pointer-events: none;
  z-index: 32;
  overflow: visible;
}
.seat-bubble-slot {
  position: absolute;
  left: 0;
  top: 0;
  max-width: min(196px, 42vw);
  pointer-events: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-start;
}
.seat-bubble-slot--left {
  align-items: flex-end;
}
.seat-bubble-slot--right {
  transform: translate(0, -50%);
}
.seat-bubble-slot--left {
  transform: translate(-100%, -50%);
}
.seat-speech-bubble {
  display: block;
  width: max-content;
  max-width: min(196px, 42vw);
  font-size: clamp(13px, 3.1vmin, 17px);
  font-weight: 700;
  line-height: 1.28;
  text-align: left;
  white-space: nowrap;
  padding: 8px 12px;
  border-radius: 11px;
  color: #1a1a1a;
  background: #fffde7;
  border: 1px solid rgba(0, 0, 0, 0.14);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.38);
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px);
  transition: opacity 0.28s ease, transform 0.28s ease, visibility 0.28s;
  pointer-events: none;
}
.seat-speech-bubble--action {
  color: #3e2723;
  background: #fff8e1;
  border-color: rgba(255, 193, 7, 0.45);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-weight: 800;
  letter-spacing: 0.01em;
}
.seat-speech-bubble--chat {
  color: #3d3830;
  background: #f5f2ea;
  border-color: rgba(0, 0, 0, 0.1);
  font-family: "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei UI", sans-serif;
  font-weight: 500;
  letter-spacing: 0.03em;
  white-space: normal;
  max-width: min(196px, 42vw);
  font-size: clamp(12px, 2.9vmin, 15px);
  line-height: 1.42;
  padding: 8px 12px;
  border-radius: 13px;
  box-shadow: 0 5px 16px rgba(0, 0, 0, 0.28);
}
.seat-bubble-slot--right .seat-speech-bubble--chat::before {
  content: "";
  position: absolute;
  left: -6px;
  top: 50%;
  width: 9px;
  height: 9px;
  margin-top: -4.5px;
  background: #f5f2ea;
  border-left: 1px solid rgba(0, 0, 0, 0.12);
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  transform: rotate(45deg);
  box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.06);
}
.seat-bubble-slot--left .seat-speech-bubble--chat::before {
  content: "";
  position: absolute;
  right: -6px;
  top: 50%;
  width: 9px;
  height: 9px;
  margin-top: -4.5px;
  background: #f5f2ea;
  border-right: 1px solid rgba(0, 0, 0, 0.12);
  border-top: 1px solid rgba(0, 0, 0, 0.12);
  transform: rotate(45deg);
  box-shadow: 2px -2px 4px rgba(0, 0, 0, 0.06);
}
.seat-bubble-slot--right .seat-speech-bubble--action::before {
  content: "";
  position: absolute;
  left: -6px;
  top: 50%;
  width: 9px;
  height: 9px;
  margin-top: -4.5px;
  background: #fff8e1;
  border-left: 1px solid rgba(255, 193, 7, 0.45);
  border-bottom: 1px solid rgba(255, 193, 7, 0.45);
  transform: rotate(45deg);
  box-shadow: -2px 2px 4px rgba(0, 0, 0, 0.08);
}
.seat-bubble-slot--left .seat-speech-bubble--action::before {
  content: "";
  position: absolute;
  right: -6px;
  top: 50%;
  width: 9px;
  height: 9px;
  margin-top: -4.5px;
  background: #fff8e1;
  border-right: 1px solid rgba(255, 193, 7, 0.45);
  border-top: 1px solid rgba(255, 193, 7, 0.45);
  transform: rotate(45deg);
  box-shadow: 2px -2px 4px rgba(0, 0, 0, 0.08);
}
.seat-speech-bubble {
  position: relative;
}
.seat-speech-bubble.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.seat-speech-bubble[hidden] {
  display: none !important;
}
.seat-info-panel {
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(-50%, -50%);
  pointer-events: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  max-width: min(172px, 28vw);
}
.seat-hole-panel {
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(-50%, -50%);
  pointer-events: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  max-width: min(172px, 28vw);
}
.seat-pos-panel {
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(-50%, -50%);
  pointer-events: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  max-width: min(172px, 28vw);
}
.seat-pos-panel .seat-role-tag {
  margin: 0;
}
.seat-info-panel .seat-info-layout {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(6px, 1.2vw, 10px);
  max-width: min(200px, 34vw);
}
.seat-info-panel .seat-info-layout--stack {
  flex-direction: column;
  align-items: center;
  gap: clamp(4px, 0.8vw, 6px);
  max-width: min(108px, 22vw);
}
.seat-info-panel .seat-info-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: clamp(3px, 0.6vw, 5px);
  width: 100%;
  min-width: min(88px, 20vw);
  padding: clamp(6px, 1.2vw, 8px) clamp(8px, 1.6vw, 10px) clamp(7px, 1.3vw, 9px);
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.52);
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.45);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.seat-info-panel .seat-info-card .seat-avatar-slot {
  flex: 0 0 auto;
}
.seat-info-panel .seat-info-card .seat-avatar {
  margin: 0 0 2px;
}
.seat-info-panel .seat-info-card .label,
.seat-info-panel .seat-info-card .seat-stack__name {
  width: 100%;
  text-align: center;
  color: rgba(255, 255, 255, 0.94);
}
.seat-info-panel .seat-info-card .chips--meta {
  width: 100%;
  text-align: center;
  color: var(--gold);
}
.seat-info-panel .seat-info-card .seat-stack__commit {
  width: 100%;
  text-align: center;
}
.seat-info-panel .seat-info-card .hero-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.seat-info-panel .seat-info-identity {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  flex: 0 0 auto;
}
.seat-info-panel .seat-info-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 2px;
  flex: 1 1 auto;
  min-width: 0;
  padding: 5px 9px 6px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.52);
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.45);
}
.seat-info-panel .seat-action-block {
  display: none !important;
}
.seat-info-panel .seat-role-tag {
  flex: 0 0 auto;
}

.felt-outer {
  position: relative;
  container-type: size;
  container-name: felt;
  --ring-rx: 42%;
  --ring-ry: 33%;
  --ring-cy: 44%;
  --layout-top-h: 48px;
  --layout-hero-dock-h: clamp(78px, 9.5vh, 96px);
  --layout-rail-w: 0px;
  --avail-h: calc(100dvh - var(--safe-top) - var(--safe-bottom) - var(--layout-top-h) - var(--layout-hero-dock-h) - 32px);
  --avail-w: calc(100vw - 20px);
  width: min(
    calc(var(--avail-w) * 0.84 + var(--table-grow-w) + 2 * var(--table-edge-out)),
    calc(var(--avail-h) * var(--table-max-w-by-h) + 2 * var(--table-edge-out))
  );
  height: min(
    calc(var(--avail-h) * 0.52 + var(--table-grow-h) + 2 * var(--table-edge-out)),
    calc(var(--avail-w) * 0.30 + var(--table-grow-h) + 2 * var(--table-edge-out))
  );
  max-width: var(--avail-w);
  max-height: var(--avail-h);
  min-width: 0;
  border-radius: 999px;
  padding: clamp(8px, 1.4vmin, 14px);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: stretch;
  overflow: visible;
  background:
    radial-gradient(circle at 8% 18%, rgba(255, 255, 255, 0.16) 0 3.5px, transparent 4px),
    radial-gradient(circle at 92% 18%, rgba(255, 255, 255, 0.16) 0 3.5px, transparent 4px),
    radial-gradient(circle at 5% 50%, rgba(255, 255, 255, 0.14) 0 3.5px, transparent 4px),
    radial-gradient(circle at 95% 50%, rgba(255, 255, 255, 0.14) 0 3.5px, transparent 4px),
    radial-gradient(circle at 12% 82%, rgba(255, 255, 255, 0.12) 0 3px, transparent 3.5px),
    radial-gradient(circle at 88% 82%, rgba(255, 255, 255, 0.12) 0 3px, transparent 3.5px),
    linear-gradient(180deg, #222 0%, #0c0c0c 42%, #050505 100%);
  border: 5px solid #080808;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.1),
    inset 0 3px 0 rgba(255, 255, 255, 0.07),
    inset 0 -4px 12px rgba(0, 0, 0, 0.75),
    0 18px 48px rgba(0, 0, 0, 0.72);
}
.felt-outer::before {
  content: "";
  position: absolute;
  inset: clamp(4px, 0.8vmin, 8px);
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  pointer-events: none;
  z-index: 0;
}
.felt-mat {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  width: 100%;
  height: 100%;
  border-radius: 999px;
  overflow: hidden;
  background:
    radial-gradient(ellipse 72% 58% at 50% 42%, rgba(255, 255, 255, 0.06) 0%, transparent 58%),
    radial-gradient(ellipse 100% 85% at 50% 100%, rgba(0, 0, 0, 0.28) 0%, transparent 48%),
    linear-gradient(168deg, #1f7a52 0%, #0f4d32 48%, #082a1b 100%);
  border: 1px solid rgba(0, 0, 0, 0.35);
  box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.2);
}
/* 桌沿位置标签 · 对准 lane · 字色同 turn-banner--player */
.felt-rim-positions {
  position: absolute;
  inset: 0;
  z-index: 10;
  pointer-events: none;
  overflow: visible;
  transform-style: preserve-3d;
}
.felt-rim-positions .seat-pos-panel--rim {
  --ring-cy: 44%;
  position: absolute;
  margin: 0;
  max-width: none;
  left: calc(50% + var(--rim-rx) * sin(var(--seat-deg) * 1deg));
  top: calc(var(--ring-cy) - var(--rim-ry) * cos(var(--seat-deg) * 1deg));
  transform:
    translate(-50%, -50%)
    translate(
      calc(sin(var(--seat-deg) * 1deg) * (var(--rim-out, 0cm) - var(--rim-in, 0cm))),
      calc(-1 * cos(var(--seat-deg) * 1deg) * (var(--rim-out, 0cm) - var(--rim-in, 0cm)))
    )
    translate(var(--pos-nudge-x, 0), var(--pos-nudge-y, 0))
    translateZ(var(--pos-z, 0))
    rotateZ(var(--pos-rotate, 0deg));
  transform-origin: 50% 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.felt-rim-positions .seat-role-tag--rim {
  display: inline-block;
  margin: 0;
  padding: 2px 10px;
  background: transparent;
  color: #a5d6a7;
  font-size: clamp(0.92rem, 2.65cqw, 1.15rem);
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0.02em;
  text-align: center;
  white-space: nowrap;
  border: none;
  border-radius: 0;
  text-shadow:
    0 0 1px rgba(0, 0, 0, 0.88),
    0 1px 3px rgba(0, 0, 0, 0.58);
  transform: scale(var(--rim-tag-scale, 1));
  transform-origin: 50% 50%;
}
.felt-rim-positions .seat-role-tag--rim:empty {
  display: none;
}
/* 腰弧 2/4、顶弧 5 · 整段标签以第 2 字为锚点追加旋转（transform-origin 由 JS 量取） */
.felt-rim-positions .seat-pos-panel--rim-2 .seat-role-tag--rim.seat-role-tag--pivot2 {
  transform: scale(var(--rim-tag-scale, 1)) rotateZ(-7deg);
}
.felt-rim-positions .seat-pos-panel--rim-4 .seat-role-tag--rim.seat-role-tag--pivot2 {
  transform: scale(var(--rim-tag-scale, 1)) rotateZ(7deg);
}
.felt-rim-positions .seat-pos-panel--rim-5 .seat-role-tag--rim.seat-role-tag--pivot2 {
  transform: scale(var(--rim-tag-scale, 1)) rotateZ(-2deg);
}
/* 顶弧 0/1/5 · 朝 Hero 正立（3D 桌下 180deg 会倒字） */
.felt-rim-positions .seat-pos-panel--rim-0 {
  --seat-deg: 0;
  --rim-rx: 46%;
  --rim-ry: 36%;
  --rim-out: 0.15cm;
  --pos-rotate: 0deg;
  --pos-nudge-y: 2.6cm;
  --rim-tag-scale: 1.32;
}
.felt-rim-positions .seat-pos-panel--rim-1 {
  --seat-deg: 60;
  --rim-rx: 44%;
  --rim-ry: 36%;
  --rim-out: 0.2cm;
  --rim-in: 2.3cm;
  --pos-rotate: 55deg;
  --rim-tag-scale: 1.14;
  --pos-z: 52px;
  z-index: 20;
}
.felt-rim-positions .seat-pos-panel--rim-5 {
  --seat-deg: 300;
  --rim-rx: 44%;
  --rim-ry: 36%;
  --rim-out: 0.2cm;
  --rim-in: 2.3cm;
  --pos-rotate: -55deg;
  --rim-tag-scale: 1.14;
  --pos-z: 52px;
  z-index: 20;
}
/* 腰弧 2/4 · 暂用正立字，先保证可见 */
.felt-rim-positions .seat-pos-panel--rim-2 {
  --seat-deg: 120;
  --rim-rx: 46%;
  --rim-ry: 37%;
  --rim-out: 0.25cm;
  --pos-rotate: -30deg;
  --rim-tag-scale: 0.94;
  --pos-nudge-x: -2.5cm;
  --pos-nudge-y: 0.7cm;
}
.felt-rim-positions .seat-pos-panel--rim-4 {
  --seat-deg: 240;
  --rim-rx: 46%;
  --rim-ry: 37%;
  --rim-out: 0.25cm;
  --pos-rotate: 30deg;
  --rim-tag-scale: 0.94;
  --pos-nudge-x: 2.5cm;
  --pos-nudge-y: 0.7cm;
}
/* Hero 3 · 底中棕沿，手牌与 dock 之间 */
.felt-rim-positions .seat-pos-panel--rim-3 {
  --seat-deg: 180;
  --rim-rx: 46%;
  --rim-ry: 36%;
  --rim-out: 0.2cm;
  --pos-rotate: 0deg;
  --pos-nudge-x: -0.4cm;
  --pos-nudge-y: -0.7cm;
  --rim-tag-scale: 1;
}
.felt-mat::before {
  display: none;
}
.felt-markings {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1;
  overflow: visible;
}
.felt-markings__inner,
.felt-markings__ray {
  fill: none;
  stroke: rgba(255, 255, 255, 0.24);
  stroke-width: 1.15;
  vector-effect: non-scaling-stroke;
}
.felt-outer--duel .felt-markings {
  display: none;
}
.felt-mat::after {
  display: none;
}
.showdown-tier-banner {
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%, calc(-50% - 6px));
  z-index: 35;
  padding: 10px 28px;
  border-radius: 8px;
  font-size: clamp(14px, 3.2cqw, 20px);
  font-weight: 800;
  letter-spacing: 0.14em;
  color: #fff8e1;
  background: linear-gradient(180deg, rgba(180, 40, 30, 0.92) 0%, rgba(100, 20, 15, 0.95) 100%);
  border: 1px solid rgba(255, 180, 100, 0.55);
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.5);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.35s ease, transform 0.35s ease;
  white-space: nowrap;
}
.showdown-tier-banner[hidden] {
  display: none !important;
}
.showdown-tier-banner.is-visible {
  opacity: 1;
  transform: translate(-50%, -50%);
}
/* 桌面 · 3 人决胜 banner 常驻 + 顶缘高光（MH 仍隐藏 banner） */
body:not([data-ui-tier="MH"]) .showdown-tier-banner.is-visible {
  position: absolute;
  overflow: hidden;
}
body:not([data-ui-tier="MH"]) .showdown-tier-banner.is-visible::before {
  content: "";
  position: absolute;
  left: 6%;
  right: 6%;
  top: 0;
  height: 52%;
  border-radius: 6px 6px 50% 50%;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.38) 0%,
    rgba(255, 220, 160, 0.12) 42%,
    rgba(255, 255, 255, 0) 100%
  );
  pointer-events: none;
}
body:not([data-ui-tier="MH"]) .felt-outer.felt-outer--showdown3 .felt-center .community-slots {
  border-radius: 10px;
  box-shadow:
    inset 0 1px 0 rgba(255, 210, 130, 0.32),
    inset 0 0 22px rgba(180, 50, 35, 0.16),
    0 0 14px rgba(180, 50, 35, 0.1);
}
.felt-outer--duel {
  border-color: rgba(220, 80, 60, 0.42);
  box-shadow:
    0 0 0 2px rgba(220, 80, 60, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 12px 32px rgba(0, 0, 0, 0.45);
}
.felt-outer--duel .felt-mat {
  background:
    radial-gradient(ellipse 72% 58% at 50% 42%, rgba(255, 120, 80, 0.08) 0%, transparent 58%),
    radial-gradient(ellipse 100% 85% at 50% 100%, rgba(0, 0, 0, 0.32) 0%, transparent 48%),
    linear-gradient(168deg, #1a6a48 0%, #0c3d28 48%, #061a12 100%);
}
.felt-outer--duel .ring-slot--duel-hidden {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}
/* HU：对手信息/底牌复用 seat0 顶中 lane（见 ai-felt-hole--duel-at-0）；勿再用 72%/28% 环位 */
.felt-outer--duel .ring-slot--duel-opponent {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}
.seat-info-panel--duel-hidden {
  display: none !important;
  visibility: hidden;
  pointer-events: none;
}
.ai-felt-hole--duel-hidden {
  display: none !important;
  visibility: hidden;
  pointer-events: none;
}
.board-round--duel {
  color: #ffd56a;
  font-weight: 700;
}
.felt-outer--duel .felt-center {
  max-width: min(90cqw, 580px);
}
/* HU：深色 .board 与六人桌一致；仅 X 轴平移侧标与底池 */
.duel-felt-flank {
  display: none;
  pointer-events: none;
}
.felt-outer--duel .center-hub {
  position: relative;
}
.felt-outer--duel .duel-felt-flank--left {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  left: 0;
  top: 50%;
  z-index: 2;
  transform: translate(calc(-100% - clamp(10px, 2cqw, 22px)), -50%);
}
.felt-outer--duel .duel-felt-flank--right {
  display: none;
}
.felt-outer--duel .duel-felt-flank__label {
  writing-mode: vertical-rl;
  text-orientation: upright;
  letter-spacing: 0.14em;
  font-size: clamp(22px, 5.8cqw, 34px);
  font-weight: 900;
  line-height: 1.05;
  color: rgba(255, 238, 200, 0.58);
  text-shadow:
    0 0 18px rgba(255, 160, 80, 0.22),
    0 2px 8px rgba(0, 0, 0, 0.65);
}
.felt-outer--duel .board-pot {
  transform: translateX(clamp(14px, 3cqw, 28px));
}
.felt-outer--duel .community-slots {
  transform: translateX(var(--duel-slots-x, 0px));
}
.felt-outer--duel .center-hub .action-feed {
  flex: 0 0 clamp(78px, 18cqw, 132px);
  width: clamp(78px, 18cqw, 132px);
  max-height: min(260px, 44cqh);
}
.felt-outer--duel .seat--hero .actions .btn--allin {
  min-height: clamp(32px, 7cqh, 42px);
  font-size: clamp(12px, 2.8cqw, 14px);
}
.final-showdown-overlay {
  position: fixed;
  inset: 0;
  z-index: 10001;
  background: radial-gradient(ellipse at center, rgba(48, 18, 12, 0.94) 0%, rgba(0, 0, 0, 0.9) 72%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.final-showdown-overlay[hidden] {
  display: none !important;
}
.final-showdown-card {
  width: min(100%, 440px);
  text-align: center;
  background: linear-gradient(165deg, #321818 0%, #141820 55%, #0f141c 100%);
  border: 2px solid rgba(255, 120, 80, 0.5);
  border-radius: 18px;
  padding: 32px 28px 28px;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.55), 0 0 40px rgba(255, 100, 60, 0.14);
  color: #f5e8d0;
}
.final-showdown-card__icon {
  font-size: 44px;
  line-height: 1;
  margin-bottom: 6px;
}
.final-showdown-card h2 {
  margin: 0 0 4px;
  font-size: 26px;
  font-weight: 800;
  letter-spacing: 0.14em;
  color: #ff9a6a;
  text-shadow: 0 2px 12px rgba(255, 100, 60, 0.35);
}
.final-showdown-card .final-showdown-sub {
  margin: 0 0 16px;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.2em;
  color: #ffd56a;
}
.final-showdown-card .final-showdown-vs {
  margin: 0 0 12px;
  font-size: 18px;
  font-weight: 700;
  color: #fff8e1;
}
.final-showdown-card .final-showdown-blinds {
  margin: 0 0 24px;
  font-size: 14px;
  line-height: 1.5;
  white-space: pre-line;
  color: rgba(245, 232, 208, 0.82);
}
.final-showdown-card .btn--final-continue {
  min-width: 200px;
  min-height: 48px;
  font-size: 16px;
  font-weight: 700;
}
.controls-top--hub .btn--bankrupt-reset.btn--relief-enter,
.controls-top--hub .btn--bankrupt-reset.btn--relief-restart {
  background: linear-gradient(180deg, #c9a227 0%, #8b6914 100%);
  color: #1a1204;
}
.controls-top--hub .btn--bankrupt-reset.btn--return-main {
  background: linear-gradient(180deg, #6ecf8a 0%, #2e8b57 100%);
  color: #0a1a10;
}
.felt-center {
  position: absolute;
  left: 50%;
  top: calc(46% + var(--board-nudge-y));
  transform: translate(-50%, calc(-50% + var(--board-lift-y, 0))) rotateX(-45deg);
  transform-origin: 50% 50%;
  transform-style: preserve-3d;
  width: min(var(--board-width-pct), calc(100cqw - 24px + var(--board-grow-w)));
  max-width: min(94cqw, calc(var(--board-max-w) + var(--board-grow-w)));
  min-width: 0;
  z-index: 6;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.center-hub {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 100%;
  min-width: 0;
}
.center-hub .board {
  flex: 0 1 auto;
  width: 100%;
  max-width: min(100%, calc(var(--board-max-w) + var(--board-grow-w)));
  min-width: 0;
}
.board-row {
  display: grid;
  grid-template-columns: auto minmax(clamp(52px, 11cqw, 84px), 1fr);
  align-items: center;
  column-gap: clamp(4px, 0.75cqw, 8px);
  width: 100%;
  box-sizing: border-box;
  min-height: var(--board-row-min-h);
  padding-top: clamp(6px, 1.1cqw, 10px);
  padding-bottom: var(--board-breathe-bottom);
  padding-inline: clamp(4px, 0.9cqw, 10px);
}
.board-main {
  grid-column: 1;
  min-width: 0;
  width: max-content;
  max-width: 100%;
  margin-top: 0;
  margin-left: 1.5cm;
}
.board-showdown.board-showdown--settle {
  flex: 0 0 auto;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: stretch;
  gap: var(--board-settle-gap);
  margin-top: clamp(4px, 0.65cqw, 7px);
  padding: var(--board-settle-pad-block) 4px;
  text-align: center;
  pointer-events: none;
  --board-showdown-font: var(--board-settle-font);
  --board-showdown-visible-lines: var(--board-settle-lines, 3);
  min-height: var(--board-settle-block-h);
  max-height: var(--board-settle-block-h);
  overflow: hidden;
}
.board-showdown.board-showdown--settle.is-hidden {
  visibility: hidden;
}
.board-showdown.board-showdown--settle:not(.is-hidden) {
  visibility: visible;
}
.board-showdown-spacer {
  display: none;
}
.board-hud-layer {
  display: none;
}
.board-showdown__line {
  flex: 0 0 auto;
  box-sizing: border-box;
  width: 100%;
  min-height: var(--board-settle-line-slot);
  line-height: var(--board-settle-line-slot);
  font-size: var(--board-showdown-font, var(--board-settle-font));
  font-weight: 600;
  letter-spacing: 0.02em;
  -webkit-font-smoothing: antialiased;
  color: #fff8e8;
  text-shadow:
    0 0 2px rgba(0, 0, 0, 0.95),
    0 1px 4px rgba(0, 0, 0, 0.72),
    0 0 12px rgba(0, 22, 12, 0.55);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.board-showdown__line--win {
  color: #fff8e8;
  font-weight: 600;
  text-shadow:
    0 0 2px rgba(0, 0, 0, 0.95),
    0 1px 4px rgba(0, 0, 0, 0.72),
    0 0 12px rgba(0, 22, 12, 0.55);
}
.board-pot {
  grid-column: 2;
  justify-self: center;
  align-self: center;
  flex: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(5px, 1.1cqw, 8px);
  min-width: clamp(52px, 10cqw, 68px);
  padding: 4px 6px;
  text-align: center;
}
.board-pot__label {
  font-size: clamp(16px, 3.85cqw, 22px);
  font-weight: 800;
  line-height: 1.2;
  color: rgba(255, 236, 179, 0.92);
  letter-spacing: 0.06em;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}
.board-pot__amount {
  font-size: clamp(24px, 6.2cqw, 34px);
  font-weight: 900;
  line-height: 1.15;
  color: #ffe082;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5), 0 0 12px rgba(255, 193, 7, 0.22);
}
.board-status {
  display: none !important;
}
.action-feed {
  flex: 0 0 clamp(92px, 24cqw, 168px);
  width: clamp(92px, 24cqw, 168px);
  max-height: min(320px, 52cqh);
  padding: 6px 7px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.52);
  border: 1px solid rgba(255, 255, 255, 0.14);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.action-feed__title {
  font-size: clamp(9px, 2cqw, 11px);
  font-weight: 800;
  color: rgba(255, 215, 120, 0.95);
  letter-spacing: 0.08em;
  text-align: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  padding-bottom: 4px;
}
.action-feed__list {
  list-style: none;
  margin: 0;
  padding: 0;
  flex: 1 1 auto;
  min-height: 0;
  max-height: min(280px, 48cqh);
  display: flex;
  flex-direction: column;
  gap: 5px;
  overflow-y: auto;
  font-size: clamp(9px, 2.1cqw, 11px);
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.9);
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.action-feed__list::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}
.action-feed__list li {
  padding: 4px 5px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.07);
  word-break: break-word;
  font-size: clamp(9px, 2.1cqw, 11px);
  line-height: 1.35;
  color: rgba(255, 255, 255, 0.92);
}
.action-feed__list li.action-feed__item--system {
  font-size: clamp(8px, 1.85cqw, 10px);
  line-height: 1.3;
  color: rgba(180, 198, 220, 0.78);
  background: rgba(255, 255, 255, 0.04);
  font-weight: 500;
}
.action-feed__list li.action-feed__item--action {
  font-weight: 600;
}
.ring-slot {
  position: absolute;
  z-index: 4;
  transform: translate(-50%, -50%);
  transform-style: preserve-3d;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  min-width: 0;
  max-width: clamp(88px, 20cqw, 132px);
  max-height: none;
  overflow: visible;
}
.ring-slot--0 {
  --seat-deg: 0;
  --card-rx: 0%;
  --card-ry: 38%;
  --card-out: clamp(10px, 1.8cqw, 16px);
  left: calc(50% + var(--card-rx) * sin(0deg));
  top: calc(var(--ring-cy) - var(--card-ry) * cos(0deg));
}
.ring-slot--1 {
  --seat-deg: 60;
  --card-rx: 44%;
  --card-ry: 30%;
  --card-out: clamp(14px, 2.6cqw, 22px);
  left: calc(50% + var(--card-rx) * sin(60deg));
  top: calc(var(--ring-cy) - var(--card-ry) * cos(60deg));
}
.ring-slot--2 {
  --seat-deg: 120;
  --card-rx: 44%;
  --card-ry: 30%;
  --card-out: clamp(12px, 2.2cqw, 18px);
  left: calc(50% + var(--card-rx) * sin(120deg));
  top: calc(var(--ring-cy) - var(--card-ry) * cos(120deg));
  z-index: 7;
}
.ring-slot--4 {
  --seat-deg: 240;
  --card-rx: 44%;
  --card-ry: 30%;
  --card-out: clamp(12px, 2.2cqw, 18px);
  left: calc(50% + var(--card-rx) * sin(240deg));
  top: calc(var(--ring-cy) - var(--card-ry) * cos(240deg));
  z-index: 7;
}
.ring-slot--3 {
  --seat-deg: 180;
  --card-rx: 0%;
  --card-ry: 30%;
  --card-out: clamp(6px, 1.2cqw, 10px);
  --card-peel: -44deg;
  --card-peel-scale: 1.08;
  left: calc(50% + var(--card-rx) * sin(180deg));
  top: calc(var(--ring-cy) - var(--card-ry) * cos(180deg));
  max-width: clamp(180px, 40cqw, 260px);
  z-index: 8;
  transform: translate(-50%, -58%);
}
.ring-slot--5 {
  --seat-deg: 300;
  --card-rx: 44%;
  --card-ry: 30%;
  --card-out: clamp(14px, 2.6cqw, 22px);
  left: calc(50% + var(--card-rx) * sin(300deg));
  top: calc(var(--ring-cy) - var(--card-ry) * cos(300deg));
}
.ring-slot--3 .seat--hero,
.ring-slot .seat--cards-only {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
}
.seat-info-layer .seat-info-cluster {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  width: max-content;
  max-width: min(172px, 28vw);
  padding: 5px 9px 6px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.52);
  border: 1px solid rgba(255, 255, 255, 0.18);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.45);
  transform: none;
}
.seat-info-layer .seat-info-cluster--hero {
  max-width: min(188px, 32vw);
}
.seat-info-layer .seat-action-block {
  flex: 0 0 auto;
  width: 100%;
  min-height: calc(var(--seat-action-h) + 1.15em + 2px);
  max-height: calc(var(--seat-action-h) + 1.15em + 2px);
  overflow: hidden;
  align-items: center;
  text-align: center;
  justify-content: flex-start;
  gap: 1px;
}
.seat-info-layer .seat-action-main {
  flex: 0 0 var(--seat-action-h);
  width: 100%;
  height: var(--seat-action-h);
  line-height: var(--seat-action-h);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: center;
  font-size: clamp(11px, 2.6vmin, 14px);
}
.seat-info-layer .seat-action-prev {
  flex: 0 0 1.15em;
  width: 100%;
  height: 1.15em;
  line-height: 1.15em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: center;
  font-size: clamp(9px, 2vmin, 11px);
}
/* AI 底牌：2D 手牌模块（与 seat-info-panel 分离，便于独立定位） */
.seat-hole-panel .seat-cards--ai-panel {
  display: flex;
  justify-content: center;
  width: 100%;
  margin: 0;
  pointer-events: none;
}
.seat-hole-panel .seat-cards--ai-panel:not(:has(.card)) {
  display: none;
}
.seat-hole-panel .seat-cards--ai-panel .row {
  display: flex;
  flex-wrap: nowrap;
  gap: clamp(3px, 0.8vw, 6px);
  justify-content: center;
  align-items: center;
  margin: 0;
  padding: 0;
}
.seat-hole-panel .seat-cards--ai-panel .card {
  width: clamp(34px, 7.5vw, 48px);
  height: clamp(48px, 10vw, 66px);
  font-size: clamp(48px, 10vw, 66px);
  border-width: 2px;
  border-radius: 6px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
  flex: 0 0 auto;
  transform: none;
}
.seat-hole-panel .seat-cards--ai-panel .card:first-child {
  transform: rotate(-4deg);
}
.seat-hole-panel .seat-cards--ai-panel .card:last-child {
  transform: rotate(4deg);
  margin-left: clamp(-6px, -1.2vw, -3px);
}
/* 座位 0 · 红字3 · 顶中 lane；锚点略靠内 + 下移进毡，rotateZ 180° */
.felt-mat .ai-felt-hole--0 {
  --seat-deg: 0;
  --lane-rx: 50%;
  --lane-ry: 32%;
  --ring-cy: 44%;
  position: absolute;
  z-index: 7;
  pointer-events: none;
  left: calc(50% + var(--lane-rx) * sin(var(--seat-deg) * 1deg));
  top: calc(var(--ring-cy) - var(--lane-ry) * cos(var(--seat-deg) * 1deg));
  width: clamp(100px, 18cqw, 140px);
  max-width: 28%;
  transform: translate(-50%, calc(-50% - 0.5cm));
  transform-style: preserve-3d;
  display: flex;
  justify-content: center;
  align-items: center;
}
.felt-mat .ai-felt-hole--0:not(:has(.card)) {
  display: none;
}
.felt-mat .ai-felt-hole--0 .seat-cards--ai-felt {
  --card-peel: -44deg;
  --card-peel-scale: 1.3;
  width: 100%;
  transform-origin: 50% 50%;
  transform-style: preserve-3d;
  transform:
    rotateZ(180deg)
    rotateX(var(--card-peel))
    scale(var(--card-peel-scale));
}
.felt-mat .ai-felt-hole--0 .seat-cards--ai-felt .row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: clamp(6px, 1.2cqw, 12px);
  justify-content: center;
  align-items: flex-end;
  margin: 0;
  padding: 0;
  transform: none;
}
.felt-mat .ai-felt-hole--0 .seat-cards--ai-felt .card {
  flex: 0 0 auto;
  width: clamp(56px, 11cqw, 72px);
  height: clamp(78px, 14.8cqw, 96px);
  font-size: clamp(78px, 14.8cqw, 96px);
  border-width: 2px;
  border-radius: 7px;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.42);
}
.felt-mat .ai-felt-hole--0 .seat-cards--ai-felt .card:first-child {
  transform: rotate(-7deg);
}
.felt-mat .ai-felt-hole--0 .seat-cards--ai-felt .card:last-child {
  transform: rotate(7deg);
  margin-left: clamp(-10px, -1.8cqw, -6px);
}
/* 座位 1 · 红字2 · 右上 lane；锚点略靠内 + 往毡内偏，避免右上裁切 */
.felt-mat .ai-felt-hole--1 {
  --seat-deg: 60;
  --lane-rx: 46%;
  --lane-ry: 32%;
  --ring-cy: 44%;
  position: absolute;
  z-index: 7;
  pointer-events: none;
  left: calc(50% + var(--lane-rx) * sin(var(--seat-deg) * 1deg));
  top: calc(var(--ring-cy) - var(--lane-ry) * cos(var(--seat-deg) * 1deg));
  width: clamp(100px, 18cqw, 140px);
  max-width: 28%;
  transform: translate(
    calc(-50% - 2cm + sin(60deg) * 1.5cm),
    calc(-50% - cos(60deg) * 1.5cm)
  );
  transform-style: preserve-3d;
  display: flex;
  justify-content: center;
  align-items: center;
}
.felt-mat .ai-felt-hole--1:not(:has(.card)) {
  display: none;
}
.felt-mat .ai-felt-hole--1 .seat-cards--ai-felt {
  --card-peel: -44deg;
  --card-peel-scale: 1.08;
  width: 100%;
  transform-origin: 50% 50%;
  transform-style: preserve-3d;
  transform:
    rotateZ(calc((var(--seat-deg) - 180) * 1deg - 5deg))
    rotateX(var(--card-peel))
    scale(var(--card-peel-scale));
}
.felt-mat .ai-felt-hole--1 .seat-cards--ai-felt .row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: clamp(6px, 1.2cqw, 12px);
  justify-content: center;
  align-items: flex-end;
  margin: 0;
  padding: 0;
  transform: none;
}
.felt-mat .ai-felt-hole--1 .seat-cards--ai-felt .card {
  flex: 0 0 auto;
  width: clamp(56px, 11cqw, 72px);
  height: clamp(78px, 14.8cqw, 96px);
  font-size: clamp(78px, 14.8cqw, 96px);
  border-width: 2px;
  border-radius: 7px;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.42);
}
.felt-mat .ai-felt-hole--1 .seat-cards--ai-felt .card:first-child {
  transform: rotate(-7deg);
}
.felt-mat .ai-felt-hole--1 .seat-cards--ai-felt .card:last-child {
  transform: rotate(7deg);
  margin-left: clamp(-10px, -1.8cqw, -6px);
}
/* 座位 5 · 红字4 · 左上 lane；与座位 1 左右对称 */
.felt-mat .ai-felt-hole--5 {
  --seat-deg: 300;
  --lane-rx: 46%;
  --lane-ry: 32%;
  --ring-cy: 44%;
  position: absolute;
  z-index: 7;
  pointer-events: none;
  left: calc(50% + var(--lane-rx) * sin(var(--seat-deg) * 1deg));
  top: calc(var(--ring-cy) - var(--lane-ry) * cos(var(--seat-deg) * 1deg));
  width: clamp(100px, 18cqw, 140px);
  max-width: 28%;
  transform: translate(
    calc(-50% + 2cm + sin(var(--seat-deg) * 1deg) * 1.5cm),
    calc(-50% - cos(var(--seat-deg) * 1deg) * 1.5cm)
  );
  transform-style: preserve-3d;
  display: flex;
  justify-content: center;
  align-items: center;
}
.felt-mat .ai-felt-hole--5:not(:has(.card)) {
  display: none;
}
.felt-mat .ai-felt-hole--5 .seat-cards--ai-felt {
  --card-peel: -44deg;
  --card-peel-scale: 1.08;
  width: 100%;
  transform-origin: 50% 50%;
  transform-style: preserve-3d;
  transform:
    rotateZ(calc((var(--seat-deg) - 180) * 1deg + 5deg))
    rotateX(var(--card-peel))
    scale(var(--card-peel-scale));
}
.felt-mat .ai-felt-hole--5 .seat-cards--ai-felt .row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: clamp(6px, 1.2cqw, 12px);
  justify-content: center;
  align-items: flex-end;
  margin: 0;
  padding: 0;
  transform: none;
}
.felt-mat .ai-felt-hole--5 .seat-cards--ai-felt .card {
  flex: 0 0 auto;
  width: clamp(56px, 11cqw, 72px);
  height: clamp(78px, 14.8cqw, 96px);
  font-size: clamp(78px, 14.8cqw, 96px);
  border-width: 2px;
  border-radius: 7px;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.42);
}
.felt-mat .ai-felt-hole--5 .seat-cards--ai-felt .card:first-child {
  transform: rotate(-7deg);
}
.felt-mat .ai-felt-hole--5 .seat-cards--ai-felt .card:last-child {
  transform: rotate(7deg);
  margin-left: clamp(-10px, -1.8cqw, -6px);
}
/* 座位 2 · 红字1 · lane 中心（--seat-deg 120°）并排贴毡，规则同 Hero */
.felt-mat .ai-felt-hole--2 {
  --seat-deg: 120;
  --lane-rx: 50%;
  --lane-ry: 41%;
  --ring-cy: 44%;
  position: absolute;
  z-index: 7;
  pointer-events: none;
  left: calc(50% + var(--lane-rx) * sin(var(--seat-deg) * 1deg));
  top: calc(var(--ring-cy) - var(--lane-ry) * cos(var(--seat-deg) * 1deg));
  width: clamp(100px, 18cqw, 140px);
  max-width: 28%;
  transform: translate(calc(-50% - 2cm), calc(-50% + 2cm));
  transform-style: preserve-3d;
  display: flex;
  justify-content: center;
  align-items: center;
}
.felt-mat .ai-felt-hole--2:not(:has(.card)) {
  display: none;
}
.felt-mat .ai-felt-hole--2 .seat-cards--ai-felt {
  --card-peel: -44deg;
  --card-peel-scale: 1.08;
  width: 100%;
  transform-origin: 50% 50%;
  transform-style: preserve-3d;
  transform:
    rotateZ(calc((var(--seat-deg) - 180) * 1deg + 25deg))
    rotateX(var(--card-peel))
    scale(var(--card-peel-scale));
}
.felt-mat .ai-felt-hole--2 .seat-cards--ai-felt .row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: clamp(6px, 1.2cqw, 12px);
  justify-content: center;
  align-items: flex-end;
  margin: 0;
  padding: 0;
  transform: none;
}
.felt-mat .ai-felt-hole--2 .seat-cards--ai-felt .card {
  flex: 0 0 auto;
  width: clamp(56px, 11cqw, 72px);
  height: calc(clamp(78px, 14.8cqw, 96px) + 0.3cm);
  font-size: calc(clamp(78px, 14.8cqw, 96px) + 0.3cm);
  border-width: 2px;
  border-radius: 7px;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.42);
}
.felt-mat .ai-felt-hole--2 .seat-cards--ai-felt .card:first-child {
  transform: rotate(-7deg);
}
.felt-mat .ai-felt-hole--2 .seat-cards--ai-felt .card:last-child {
  transform: rotate(7deg);
  margin-left: clamp(-10px, -1.8cqw, -6px);
}
/* 座位 4 · 红字5 · 与座位 2 左右对称 */
.felt-mat .ai-felt-hole--4 {
  --seat-deg: 240;
  --lane-rx: 50%;
  --lane-ry: 41%;
  --ring-cy: 44%;
  position: absolute;
  z-index: 7;
  pointer-events: none;
  left: calc(50% + var(--lane-rx) * sin(var(--seat-deg) * 1deg));
  top: calc(var(--ring-cy) - var(--lane-ry) * cos(var(--seat-deg) * 1deg));
  width: clamp(100px, 18cqw, 140px);
  max-width: 28%;
  transform: translate(calc(-50% + 2cm), calc(-50% + 2cm));
  transform-style: preserve-3d;
  display: flex;
  justify-content: center;
  align-items: center;
}
.felt-mat .ai-felt-hole--4:not(:has(.card)) {
  display: none;
}
.felt-mat .ai-felt-hole--4 .seat-cards--ai-felt {
  --card-peel: -44deg;
  --card-peel-scale: 1.08;
  width: 100%;
  transform-origin: 50% 50%;
  transform-style: preserve-3d;
  transform:
    rotateZ(calc((var(--seat-deg) - 180) * 1deg - 25deg))
    rotateX(var(--card-peel))
    scale(var(--card-peel-scale));
}
.felt-mat .ai-felt-hole--4 .seat-cards--ai-felt .row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: clamp(6px, 1.2cqw, 12px);
  justify-content: center;
  align-items: flex-end;
  margin: 0;
  padding: 0;
  transform: none;
}
.felt-mat .ai-felt-hole--4 .seat-cards--ai-felt .card {
  flex: 0 0 auto;
  width: clamp(56px, 11cqw, 72px);
  height: calc(clamp(78px, 14.8cqw, 96px) + 0.3cm);
  font-size: calc(clamp(78px, 14.8cqw, 96px) + 0.3cm);
  border-width: 2px;
  border-radius: 7px;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.42);
}
.felt-mat .ai-felt-hole--4 .seat-cards--ai-felt .card:first-child {
  transform: rotate(7deg);
}
.felt-mat .ai-felt-hole--4 .seat-cards--ai-felt .card:last-child {
  transform: rotate(-7deg);
  margin-left: clamp(-10px, -1.8cqw, -6px);
}
/* HU · 对手底牌移到 seat0 顶中 lane（覆盖各 slot 专属坐标） */
.felt-outer--duel .felt-mat .ai-felt-hole--duel-at-0 {
  --seat-deg: 0;
  --lane-rx: 50%;
  --lane-ry: 32%;
  --ring-cy: 44%;
  position: absolute;
  z-index: 7;
  pointer-events: none;
  left: calc(50% + var(--lane-rx) * sin(var(--seat-deg) * 1deg));
  top: calc(var(--ring-cy) - var(--lane-ry) * cos(var(--seat-deg) * 1deg));
  width: clamp(100px, 18cqw, 140px);
  max-width: 28%;
  transform: translate(-50%, calc(-50% - 0.5cm));
  transform-style: preserve-3d;
  display: flex;
  justify-content: center;
  align-items: center;
}
.felt-outer--duel .felt-mat .ai-felt-hole--duel-at-0:not(:has(.card)) {
  display: none;
}
.felt-outer--duel .felt-mat .ai-felt-hole--duel-at-0 .seat-cards--ai-felt {
  --card-peel: -44deg;
  --card-peel-scale: 1.3;
  width: 100%;
  transform:
    rotateZ(180deg)
    rotateX(var(--card-peel))
    scale(var(--card-peel-scale));
}
.felt-outer--duel .felt-mat .ai-felt-hole--duel-at-0 .seat-cards--ai-felt .row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: clamp(6px, 1.2cqw, 12px);
  justify-content: center;
  align-items: flex-end;
  margin: 0;
  padding: 0;
  transform: none;
}
.felt-outer--duel .felt-mat .ai-felt-hole--duel-at-0 .seat-cards--ai-felt .card {
  flex: 0 0 auto;
  width: clamp(56px, 11cqw, 72px);
  height: calc(clamp(78px, 14.8cqw, 96px) + 0.3cm);
  font-size: calc(clamp(78px, 14.8cqw, 96px) + 0.3cm);
  border-width: 2px;
  border-radius: 7px;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.42);
}
.felt-outer--duel .felt-mat .ai-felt-hole--duel-at-0 .seat-cards--ai-felt .card:first-child {
  transform: rotate(7deg);
}
.felt-outer--duel .felt-mat .ai-felt-hole--duel-at-0 .seat-cards--ai-felt .card:last-child {
  transform: rotate(-7deg);
  margin-left: clamp(-10px, -1.8cqw, -6px);
}
.ring-slot--3 .seat-cards--hero-hole,
.hero-felt-hole .seat-cards--hero-hole {
  position: relative;
  z-index: 5;
  margin: 0;
  padding: 0 clamp(8px, 1.6cqw, 14px) clamp(4px, 0.8cqw, 8px);
  background: transparent;
  border: none;
  min-width: 0;
  min-height: 0;
  overflow: visible;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.ring-slot--3 .seat-cards--hero-hole .row,
.hero-felt-hole .seat-cards--hero-hole .row {
  display: flex;
  gap: clamp(6px, 1.2cqw, 12px);
  justify-content: center;
  align-items: flex-end;
  transform: rotate(0deg);
}
.seat-cards--on-felt {
  --card-peel: -42deg;
  --card-peel-scale: 1.1;
  position: relative;
  z-index: 5;
  padding: 0;
  background: transparent;
  border: none;
  box-shadow: none;
  transform-origin: 50% 50%;
  transform-style: preserve-3d;
  transform:
    translate(
      calc(sin(var(--seat-deg) * 1deg) * var(--card-out, 0px)),
      calc(-1 * cos(var(--seat-deg) * 1deg) * var(--card-out, 0px))
    )
    rotateX(var(--card-peel))
    scale(var(--card-peel-scale));
}
/* AI 底牌：rotateZ 朝向桌心 + 负向 peel（与 Hero / felt-center 一致，贴毡可见） */
.ring-slot:not(.ring-slot--3) .seat-cards--on-felt {
  --card-peel: -42deg;
  transform:
    translate(
      calc(sin(var(--seat-deg) * 1deg) * var(--card-out, 0px)),
      calc(-1 * cos(var(--seat-deg) * 1deg) * var(--card-out, 0px))
    )
    rotateZ(calc((var(--seat-deg) + 180) * 1deg))
    rotateX(var(--card-peel))
    scale(var(--card-peel-scale));
}
.ring-slot--3 .seat-cards--hero-hole,
.hero-felt-hole .seat-cards--hero-hole {
  --card-peel: -44deg;
  --card-peel-scale: 1.08;
  transform-origin: 50% 88%;
  transform:
    translate(
      calc(sin(var(--seat-deg) * 1deg) * var(--card-out, 0px)),
      calc(-1 * cos(var(--seat-deg) * 1deg) * var(--card-out, 0px))
    )
    rotateX(var(--card-peel))
    scale(var(--card-peel-scale));
}
.ring-slot:not(.ring-slot--3) .seat-cards--on-felt .row {
  transform: none;
}
.hero-felt-hole .seat-cards--hero-hole .card {
  flex: 0 0 auto;
  width: clamp(60px, 11.8cqw, 78px);
  height: clamp(84px, 15.9cqw, 104px);
  font-size: clamp(84px, 15.9cqw, 104px);
  border-width: 2px;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.42);
}
.hero-felt-hole .seat-cards--hero-hole .card:first-child {
  transform: rotate(-7deg);
}
.hero-felt-hole .seat-cards--hero-hole .card:last-child {
  transform: rotate(7deg);
  margin-left: clamp(-10px, -1.8cqw, -6px);
}
.ring-slot--3 .seat-cards--hero-hole .card {
  flex: 0 0 auto;
  width: clamp(56px, 11cqw, 72px);
  height: clamp(78px, 14.8cqw, 96px);
  font-size: clamp(78px, 14.8cqw, 96px);
  border-width: 2px;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.42);
}
.ring-slot--3 .seat-cards--hero-hole .card:first-child {
  transform: rotate(-7deg);
}
.ring-slot--3 .seat-cards--hero-hole .card:last-child {
  transform: rotate(7deg);
  margin-left: clamp(-10px, -1.8cqw, -6px);
}
.seat-stack--hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  width: 100%;
}
.seat-stack--hero .seat-info-cluster {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.seat-role-tag {
  display: block;
  font-size: clamp(8px, 2cqw, 10px);
  font-weight: 800;
  color: #fff8e1;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.85);
  letter-spacing: 0.02em;
  line-height: 1.15;
  text-align: center;
  padding: 1px 4px;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.42);
  border: 1px solid rgba(255, 215, 120, 0.28);
  white-space: nowrap;
}
.ring-slot .seat--ai,
.ring-slot .seat--hero,
.ring-slot .seat--cards-only {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
}
.ring-slot .seat:not(.seat--ai):not(.seat--hero),
.ring-slot .seat--empty {
  position: relative;
  width: 100%;
  max-width: 100%;
  max-height: none;
  overflow: visible;
  margin: 0;
  background: rgba(0, 0, 0, 0.38);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 10px;
  padding: 4px 3px 5px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}
.ring-slot .seat--empty {
  opacity: 0.82;
}
.ring-slot .label {
  font-size: clamp(8px, 2cqw, 10px);
  margin: 0;
}
.ring-slot .seat--empty {
  background: rgba(0, 0, 0, 0.22);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 10px;
  padding: 5px 4px 6px;
  opacity: 0.88;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 4px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
.seat-empty__avatar {
  width: clamp(34px, 8.5cqw, 48px);
  height: clamp(34px, 8.5cqw, 48px);
  border-radius: 10px;
  border: 2px dashed rgba(255, 255, 255, 0.22);
  background: rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 0 12px rgba(0, 0, 0, 0.25);
}
.seat-empty__label {
  font-size: clamp(9px, 1.9vmin, 11px);
  color: rgba(255, 255, 255, 0.4);
  letter-spacing: 0.04em;
}
.ring-slot-body {
  width: 100%;
  min-height: 0;
  max-height: none;
  overflow: visible;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.ring-slot .seat-3col {
  flex-direction: column;
  align-items: center;
  gap: 3px;
  width: 100%;
}
.ring-slot .seat-meta {
  flex: 0 0 auto;
  max-width: 100%;
  min-width: 0;
  align-items: center;
  text-align: center;
}
.ring-slot .seat-meta .positions,
.ring-slot .seat-meta .chips--meta {
  text-align: center;
  font-size: clamp(8px, 2cqw, 10px);
}
.ring-slot .seat-cards {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: clamp(72px, 16cqw, 96px);
  min-height: clamp(54px, 11.5cqw, 74px);
}
.ring-slot .seat-cards--nudge .row {
  flex-wrap: nowrap;
  gap: clamp(2px, 0.5cqw, 6px);
  justify-content: center;
  margin: 0;
  padding: 0;
}
.ring-slot .seat-action-block {
  flex: 0 0 auto;
  max-width: 100%;
  align-items: center;
  text-align: center;
}
.ring-slot .seat-action-main {
  font-size: clamp(9px, 2.3cqw, 11px);
}
.seat--hero {
  gap: 3px;
  min-height: 0;
  overflow: visible;
  padding-bottom: 2px;
}
.seat--ai {
  min-height: 0;
  overflow: visible;
  align-items: center;
}
.ai-avatar-wrap {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: clamp(6px, 1.4cqw, 12px);
  width: 100%;
  margin: 0 auto 2px;
}
.ai-avatar-wrap .seat-avatar {
  margin: 0;
  flex-shrink: 0;
}
.seat--ai .seat-actions-ai {
  display: none;
}
.seat-avatar {
  position: relative;
  width: clamp(36px, 9cqw, 52px);
  height: clamp(36px, 9cqw, 52px);
  border-radius: 10px;
  margin: 0 auto 4px;
  border: 2px solid rgba(255, 255, 255, 0.25);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.15);
  background: linear-gradient(145deg, #5c6a75 0%, #37474f 100%);
}
.seat-avatar--ai {
  background:
    radial-gradient(circle at 35% 28%, rgba(255, 255, 255, 0.35) 0 12%, transparent 14%),
    linear-gradient(165deg, #78909c 0%, #455a64 55%, #263238 100%);
}
.seat-avatar--has-portrait {
  background-color: #37474f;
}

/* PC 主桌 · AI 头像 115:148，顶边锚定后仅向下延伸（MH 仍用上方正方形） */
body:not([data-ui-tier="MH"]) .seat-info-panel.seat-info-panel--anchor-top {
  transform: translate(-50%, 0);
}
body:not([data-ui-tier="MH"]) .seat-info-panel:not(.seat-info-panel--hero) .seat-avatar--ai {
  width: clamp(40px, 10cqw, 58px);
  height: auto;
  aspect-ratio: 115 / 148;
  border-radius: 8px;
}
body:not([data-ui-tier="MH"]) .seat-info-panel:not(.seat-info-panel--hero) .seat-avatar--ai.seat-avatar--has-portrait {
  background-color: #1a2228;
}
.seat-avatar--guest {
  background:
    radial-gradient(ellipse 55% 80% at 50% 38%, rgba(255, 255, 255, 0.14) 0%, transparent 62%),
    linear-gradient(180deg, #4a5560 0%, #2c343c 48%, #1e252b 100%);
  border-color: rgba(255, 255, 255, 0.14);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
.seat-avatar--guest::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 22%;
  width: 46%;
  height: 46%;
  transform: translateX(-50%);
  border-radius: 50% 50% 42% 42%;
  background: rgba(12, 16, 20, 0.72);
  box-shadow: 0 14px 0 -4px rgba(12, 16, 20, 0.72);
}
.seat-info-panel.is-acting .seat-info-card {
  border-color: rgba(165, 214, 167, 0.95);
  box-shadow:
    0 0 0 2px rgba(165, 214, 167, 0.95),
    0 0 14px rgba(129, 199, 132, 0.55),
    0 4px 16px rgba(0, 0, 0, 0.45);
  animation: seat-info-card-acting-glow 1.8s ease-in-out infinite;
}
@keyframes seat-info-card-acting-glow {
  0%,
  100% {
    border-color: rgba(165, 214, 167, 0.82);
    box-shadow:
      0 0 0 2px rgba(165, 214, 167, 0.82),
      0 0 10px rgba(129, 199, 132, 0.42),
      0 4px 16px rgba(0, 0, 0, 0.45);
  }
  50% {
    border-color: rgba(200, 230, 201, 0.98);
    box-shadow:
      0 0 0 3px rgba(200, 230, 201, 0.98),
      0 0 18px rgba(129, 199, 132, 0.72),
      0 4px 16px rgba(0, 0, 0, 0.45);
  }
}
.ring-slot .seat--hero .seat-3col {
  max-width: 100%;
}
.ring-slot .seat--hero .hero-chip-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: clamp(6px, 1.6cqw, 14px);
  width: 100%;
  min-width: 0;
}
.ring-slot .seat--hero .hero-chip-row .seat-cards {
  flex: 1 1 auto;
  min-width: 0;
  justify-content: flex-end;
}
.ring-slot .seat--hero .hero-chip-row .chip-dock {
  flex: 0 0 auto;
  width: auto;
  align-self: flex-end;
  display: flex;
  justify-content: center;
  align-items: flex-end;
}
.ring-slot .seat--hero .hero-chip-row .chip-rack--dock {
  max-width: clamp(104px, 28cqw, 168px);
}
.chip-dock {
  flex: 0 0 auto;
  align-self: stretch;
  display: flex;
  align-items: flex-end;
}
.chip-rack--dock {
  padding: 4px 5px 5px;
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.42);
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 4px 14px rgba(0, 0, 0, 0.35);
  max-width: clamp(104px, 25cqw, 150px);
}
.chip-rack--dock .chip-rack__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 6px 8px;
  padding: 3px 0;
  justify-items: center;
}
.chip-rack--dock .chip {
  width: clamp(32px, 7.5cqw, 42px);
  height: clamp(32px, 7.5cqw, 42px);
  font-size: clamp(9px, 2.2cqw, 11px);
}
.chip-rack--dock .chip-rack__head {
  min-height: 18px;
}
.chip-rack--dock .chip-help-btn {
  width: 22px;
  height: 22px;
  font-size: 12px;
}
.chip-rack--dock .chip-rack__amount {
  font-size: clamp(13px, 3.2cqw, 16px);
  font-weight: 900;
  color: #ffd54f;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.65);
  min-height: 1.4em;
}
.chip-rack__amount.is-active {
  color: #fff176;
  transform: scale(1.04);
}
.chip-rack--dock .btn-chip-cancel {
  min-height: 28px;
  font-size: 11px;
}
.seat--hero .actions {
  max-width: none;
  width: 100%;
  margin: 3px 0 0;
  gap: clamp(6px, 1.6cqw, 10px);
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto auto;
}
.seat--hero .actions .btn--allin {
  grid-column: 1 / -1;
  min-height: clamp(36px, 8.5cqh, 48px);
  font-size: clamp(13px, 3.2cqw, 16px);
  letter-spacing: 0.04em;
  background: linear-gradient(180deg, #ff7043 0%, #d84315 45%, #bf360c 100%);
  border-color: rgba(0, 0, 0, 0.5);
  box-shadow:
    0 4px 0 rgba(69, 17, 0, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
}
.seat--hero .actions .btn {
  min-height: clamp(38px, 9.5cqh, 52px);
  padding: 8px 6px;
  font-size: clamp(13px, 3.1cqw, 16px);
  font-weight: 800;
  border-radius: 11px;
  border: 1px solid rgba(0, 0, 0, 0.45);
  box-shadow:
    0 4px 0 rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
  background: linear-gradient(180deg, #7d6e5a 0%, #4a3f35 45%, #352d26 100%);
  color: #fff;
}
.seat--hero .actions .btn--fold {
  background: linear-gradient(180deg, #6d6d6d 0%, #424242 50%, #2e2e2e 100%);
}
.seat--hero .actions .btn--call {
  background: linear-gradient(180deg, #66bb6a 0%, #2e7d32 48%, #1b5e20 100%);
}
.seat--hero .actions .btn--raise,
.seat--hero .actions .btn--check {
  background: linear-gradient(180deg, #6a8caf 0%, #3d5a80 50%, #2c4358 100%);
}
.seat--hero .actions .btn--raise-wait {
  opacity: 0.58;
  filter: saturate(0.85);
}
.seat--hero .player-bridge {
  max-width: none;
  width: 100%;
  margin: 6px 0 0;
}
.seat--hero .player-bridge__actions {
  align-items: center;
  text-align: center;
}
.seat--hero .action-hint {
  max-width: none;
  margin: 2px 0 0;
  font-size: clamp(10px, 2.5cqw, 12px);
}
.felt-center .board {
  max-width: 100%;
  width: 100%;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  padding: clamp(8px, 1.4cqw, 12px) 12px clamp(8px, 1.2cqw, 12px);
  background: rgba(0, 18, 11, 0.48);
  backdrop-filter: blur(4px);
  border: 1px solid rgba(255, 248, 200, 0.22);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.28);
  border-radius: 12px;
}
.felt-mat .pot {
  font-size: clamp(14px, 3.6cqw, 19px);
  margin-bottom: 5px;
}
.felt-mat .board-round {
  font-size: clamp(12px, 3.1cqw, 15px);
  margin-bottom: 5px;
}
.felt-outer .seat-info-cluster .label,
.felt-outer .seat-info-layer .label,
.felt-outer .seat-stack__name {
  font-size: clamp(10px, 2.6cqw, 12px);
  font-weight: 700;
  color: rgba(255, 255, 255, 0.88);
}
.label { font-size: 13px; color: var(--muted); text-align: center; }
.positions {
  font-size: 12px;
  color: var(--gold);
  text-align: center;
  line-height: 1.35;
}
.seat-meta .positions {
  display: none;
}
.row { display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; }
.chips { font-size: 15px; font-weight: 600; color: var(--gold); text-align: center; }
.card {
  width: clamp(50px, 15vw, 70px);
  height: clamp(72px, 21vw, 100px);
  border-radius: 8px;
  border: 3px solid #333;
  background: #fff;
  display: block;
  font-weight: 800;
  user-select: none;
  box-shadow: 0 4px 10px rgba(0,0,0,0.35);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.card:not(.card--back) {
  position: relative;
  padding: 0;
  /* em 基准 = 牌高，子元素用 0.xem 随牌等比缩放（不依赖 cqh） */
  font-size: clamp(72px, 21vw, 100px);
}
.card__corner {
  position: absolute;
  top: 0.04em;
  left: 0.06em;
  display: block;
  line-height: 1;
  z-index: 1;
}
.card__corner .card__rank {
  display: block;
  font-size: 0.22em;
  font-weight: 900;
  line-height: 0.95;
  letter-spacing: -0.02em;
}
.card__rank,
.card__suit {
  display: block;
  line-height: 1;
  letter-spacing: -0.02em;
}
.card__suit--center {
  position: absolute;
  left: 50%;
  top: 52%;
  transform: translate(-50%, -50%);
  font-size: 0.42em;
  line-height: 0.88;
  z-index: 0;
}
.card__suit-svg {
  display: block;
  shape-rendering: geometricPrecision;
}
.card__suit-svg {
  display: block;
  shape-rendering: geometricPrecision;
}
.card__suit-svg path {
  stroke: currentColor;
  stroke-width: 0.55;
  stroke-linejoin: round;
  paint-order: stroke fill;
}
.card--suit-spade .card__suit-svg path {
  stroke-width: 0.45;
}
.card--suit-club .card__suit-svg path {
  stroke-width: 0.7;
}
.card__suit-svg--corner {
  width: clamp(12px, 2.8cqw, 16px);
  height: clamp(12px, 2.8cqw, 16px);
  margin-top: 1px;
}
.card__suit-svg--center {
  width: clamp(26px, 6.2cqw, 34px);
  height: clamp(26px, 6.2cqw, 34px);
}
.card__suit--corner {
  font-size: clamp(12px, 2.8cqw, 16px);
  line-height: 1;
}
.card--red { border-color: var(--red-suit); color: var(--red-suit); }
.card--black {
  border-color: var(--black-card-border);
  color: var(--black-suit);
  outline: 2px solid var(--black-card-border);
  outline-offset: -2px;
}
.card--black.card--suit-spade {
  color: #0f0f0f;
}
.card--black.card--suit-club {
  color: #0f0f0f;
}
/* 牌背多套 SVG：见 assets/css/card-backs.css */
.card--flip { animation: flipReveal 0.55s ease forwards; }
@keyframes flipReveal {
  0% { transform: rotateY(90deg); opacity: 0.6; }
  100% { transform: rotateY(0); opacity: 1; }
}
.board {
  background: rgba(0, 0, 0, 0.35);
  border-radius: 14px;
  padding: 8px 6px;
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
  border: 1px solid rgba(255,255,255,0.12);
}
.felt-mat .board {
  max-width: none;
}
.board #community {
  position: relative;
  z-index: 2;
  min-height: 0;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;
  gap: clamp(3px, 0.8cqw, 6px);
  overflow-x: visible;
  overflow-y: visible;
  width: 100%;
  max-width: 100%;
}
.board .community-slots {
  margin-left: 0;
}
.community-slots {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: stretch;
  gap: clamp(2px, 0.9cqw, 5px);
  margin-left: var(--board-slots-nudge-x);
  pointer-events: none;
  flex: 0 0 auto;
}
.community-slot {
  flex: 0 0 auto;
  box-sizing: border-box;
  width: clamp(62px, 13.8cqw, calc(86px + var(--board-slot-w-extra)));
  height: clamp(86px, 18.5cqw, calc(112px + var(--board-slot-h-extra)));
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.community-slot .card {
  pointer-events: auto;
}
.board #community .card {
  flex: 0 0 auto;
  position: relative;
  z-index: 1;
  width: clamp(62px, 13.8cqw, calc(86px + var(--board-slot-w-extra)));
  height: clamp(86px, 18.5cqw, calc(112px + var(--board-slot-h-extra)));
  font-size: clamp(86px, 18.5cqw, calc(112px + var(--board-slot-h-extra)));
  border-width: 2px;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.38);
}
.ring-slot .seat--ai .seat-cards .card,
.ring-slot .seat-cards--on-felt:not(.seat-cards--hero-hole) .card {
  width: clamp(38px, 8.5cqw, 54px);
  height: clamp(54px, 11.5cqw, 74px);
  font-size: clamp(54px, 11.5cqw, 74px);
  border-width: 2px;
  border-radius: 8px;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.42);
}
.felt-outer .seat-meta .positions {
  font-size: clamp(9px, 2.2cqw, 11px);
}
.felt-outer .seat-meta .chips--meta {
  font-size: clamp(10px, 2.5cqw, 13px);
}
.pot { text-align: center; font-size: 16px; font-weight: 700; color: var(--gold); margin-bottom: 6px; }
.board-round {
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.95);
  margin-bottom: 6px;
  letter-spacing: 0.02em;
  line-height: 1.35;
}
.board-note {
  text-align: center;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.4;
  padding: 0 6px;
  margin-bottom: 6px;
  white-space: pre-line;
  min-height: 0;
}
.board-note:not(:empty) { min-height: 1.3em; }
.board-note:empty { display: none; }
.seat-action-block {
  text-align: right;
  margin: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 2px;
}
.seat-action-main {
  font-size: clamp(1.05rem, 3.8vw, 1.4rem);
  font-weight: 800;
  color: #ffe082;
  letter-spacing: 0.04em;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.5);
  line-height: 1.25;
}
.seat-actions-you .seat-action-main { color: #fff9c4; }
.seat-action-prev {
  font-size: 11px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.4);
  line-height: 1.2;
  min-height: 1.1em;
}
.community-placeholder {
  display: none !important;
}
.community-placeholder.is-hidden {
  display: none !important;
}
.felt-outer--duel .felt-brand {
  display: none;
}
.felt-outer--duel .felt-mat::before,
.felt-outer--duel .felt-mat::after {
  display: none;
}
.card--deal-in {
  opacity: 0;
  transform: translateY(-8px) scale(0.96);
  animation: dealIn 0.35s ease forwards;
}
@keyframes dealIn { to { opacity: 1; transform: translateY(0) scale(1); } }
.controls-top { width: 100%; max-width: 420px; margin: 0 auto 2px; }
.btn--new {
  width: 100%;
  min-height: 48px;
  padding: 14px;
  font-size: 16px;
  font-weight: 700;
  border: none;
  border-radius: 12px;
  cursor: pointer;
  background: #6a1b9a;
  color: #fff;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.btn--new:disabled { opacity: 0.45; cursor: not-allowed; }
.actions {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
  width: 100%;
  max-width: 420px;
  margin: 4px auto 0;
}
.btn {
  min-height: 48px;
  padding: 12px 6px;
  font-size: 15px;
  font-weight: 700;
  border: none;
  border-radius: 12px;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.btn--fold { background: #424242; color: #fff; }
.btn--call { background: #2e7d32; color: #fff; }
.btn--raise { background: #1565c0; color: #fff; }
.btn--check { background: #37474f; color: #fff; }
.btn--allin { background: #d84315; color: #fff; }
.btn:active:not(:disabled) { transform: scale(0.98); opacity: 0.92; }
.btn:disabled { opacity: 0.45; cursor: not-allowed; }
.turn-banner {
  font-size: clamp(0.85rem, 2.8cqw, 1.05rem);
  font-weight: 800;
  text-align: center;
  padding: 10px 12px;
  border-radius: 12px;
  margin: 0 auto 8px;
  max-width: 420px;
  line-height: 1.4;
  min-height: 2.6em;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 6px;
  letter-spacing: 0.02em;
  white-space: pre-line;
}
.turn-banner--idle {
  background: rgba(0, 0, 0, 0.25);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--muted);
}
.turn-banner--player {
  background: rgba(46, 125, 50, 0.38);
  border: 1px solid rgba(165, 214, 167, 0.55);
  color: #e8f5e9;
}
.turn-banner--ai {
  background: rgba(25, 118, 210, 0.35);
  border: 1px solid rgba(144, 202, 249, 0.45);
  color: #e3f2fd;
}
.turn-banner--dealing {
  background: rgba(106, 27, 154, 0.35);
  border: 1px solid rgba(206, 147, 216, 0.45);
  color: #f3e5f5;
}
.turn-banner--showdown {
  background: rgba(245, 127, 23, 0.28);
  border: 1px solid rgba(255, 183, 77, 0.45);
  color: #fff3e0;
}
.action-hint {
  text-align: center;
  font-size: 13px;
  color: var(--muted);
  margin: 0 auto 6px;
  max-width: 420px;
  min-height: 1.2em;
}
.action-hint.is-visible { color: rgba(255, 255, 255, 0.55); }
.actions.actions--wait .btn:not(.btn--new) {
  opacity: 0.38;
  pointer-events: none;
}
.seat-3col {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
  flex-wrap: nowrap;
}
.seat-meta {
  flex: 0 0 26%;
  max-width: 46%;
  min-width: 5.5em;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 4px;
  text-align: left;
}
.seat-meta .positions {
  text-align: left;
  font-size: 11px;
}
.seat-meta .chips--meta {
  text-align: left;
  font-size: 14px;
}
.seat-cards {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.seat-cards--nudge .row {
  justify-content: flex-end;
  margin-left: auto;
  padding-left: 8px;
}
.seat-3col .seat-action-block {
  flex: 0 0 26%;
  max-width: 46%;
  min-width: 5.5em;
}
.seat-2col-player .seat-meta {
  flex: 0 0 26%;
}
.seat-2col-player .seat-cards {
  flex: 1 1 auto;
}
.player-bridge {
  width: 100%;
  max-width: 420px;
  margin: 4px auto 0;
  padding: 4px 8px;
  background: rgba(0, 0, 0, 0.28);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  display: none;
  flex-direction: column;
  gap: 2px;
  flex-shrink: 0;
  min-height: 0;
}
.player-bridge.is-visible { display: flex; }
.player-bridge__actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  text-align: right;
  gap: 1px;
  min-height: 1.5em;
}
.player-bridge__actions .seat-action-main {
  font-size: clamp(0.95rem, 3.2vw, 1.2rem);
}
.player-bridge__actions .seat-action-prev {
  font-size: 10px;
}
.chip-rack {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 3px;
  align-items: stretch;
}
.chip-rack__head {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-height: 20px;
}
.chip-help-btn {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.45);
  background: rgba(0, 0, 0, 0.35);
  color: var(--text);
  font-weight: 800;
  font-size: 11px;
  cursor: help;
  line-height: 1;
  padding: 0;
}
.chip-help-bubble {
  position: absolute;
  right: 0;
  top: 22px;
  z-index: 50;
  max-width: 260px;
  padding: 10px 12px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
  color: #1a1a1a;
  background: #fffde7;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  text-align: left;
}
.chip-rack--dock .chip-help-bubble {
  max-width: none;
  white-space: nowrap;
  padding: 6px 10px;
  font-size: 12px;
  line-height: 1.35;
}
.chip-help-bubble[hidden] { display: none !important; }
.chip-rack__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px 7px;
  justify-items: center;
  align-items: center;
  padding: 2px 2px;
}
.chip {
  position: relative;
  z-index: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: none;
  font-weight: 800;
  font-size: 10px;
  letter-spacing: -0.02em;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow:
    0 1px 0 rgba(0, 0, 0, 0.45),
    0 2px 4px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.35);
  user-select: none;
  color: #1a1a1a;
  padding: 0;
  transition: transform 0.08s ease, opacity 0.15s;
  text-shadow: 0 0 3px rgba(255, 255, 255, 0.9);
}
.chip:active:not(:disabled):not(.is-disabled) {
  transform: translateY(1px);
}
.chip--5 {
  color: #1b3d1f;
  font-size: 9px;
  text-shadow: 0 0 2px rgba(232, 245, 233, 0.95);
  background:
    radial-gradient(circle at 50% 50%, #e8f5e9 0%, #c8e6c9 47%, transparent 50%),
    conic-gradient(
      from -11deg,
      #2e7d32 0deg 90deg,
      #a5d6a7 90deg 180deg,
      #2e7d32 180deg 270deg,
      #a5d6a7 270deg 360deg
    );
}
.chip--10 {
  color: #0d3d56;
  font-size: 9px;
  text-shadow: 0 0 2px rgba(225, 245, 254, 0.95);
  background:
    radial-gradient(circle at 50% 50%, #e1f5fe 0%, #b3e5fc 47%, transparent 50%),
    conic-gradient(
      from -11deg,
      #0277bd 0deg 90deg,
      #81d4fa 90deg 180deg,
      #0277bd 180deg 270deg,
      #81d4fa 270deg 360deg
    );
}
.chip--50 {
  color: #4a148c;
  font-size: 9px;
  text-shadow: 0 0 2px rgba(243, 229, 255, 0.95);
  background:
    radial-gradient(circle at 50% 50%, #f3e5f5 0%, #e1bee7 47%, transparent 50%),
    conic-gradient(
      from -11deg,
      #6a1b9a 0deg 90deg,
      #ce93d8 90deg 180deg,
      #6a1b9a 180deg 270deg,
      #ce93d8 270deg 360deg
    );
}
.chip--100 {
  color: #222;
  text-shadow: 0 0 2px rgba(255, 255, 255, 0.95);
  background:
    radial-gradient(circle at 50% 50%, #fafafa 0%, #ececec 48%, transparent 50%),
    conic-gradient(
      from -11deg,
      #9e9e9e 0deg 22.5deg,
      #f5f5f5 22.5deg 45deg,
      #9e9e9e 45deg 67.5deg,
      #f5f5f5 67.5deg 90deg,
      #9e9e9e 90deg 112.5deg,
      #f5f5f5 112.5deg 135deg,
      #9e9e9e 135deg 157.5deg,
      #f5f5f5 157.5deg 180deg,
      #9e9e9e 180deg 202.5deg,
      #f5f5f5 202.5deg 225deg,
      #9e9e9e 225deg 247.5deg,
      #f5f5f5 247.5deg 270deg,
      #9e9e9e 270deg 292.5deg,
      #f5f5f5 292.5deg 315deg,
      #9e9e9e 315deg 337.5deg,
      #f5f5f5 337.5deg 360deg
    );
}
.chip--500 {
  color: #3e0000;
  text-shadow: 0 0 2px rgba(255, 235, 238, 0.95);
  background:
    radial-gradient(circle at 50% 50%, #ffebee 0%, #ffcdd2 47%, transparent 50%),
    conic-gradient(
      from -11deg,
      #8b0000 0deg 22.5deg,
      #ffcdd2 22.5deg 45deg,
      #8b0000 45deg 67.5deg,
      #ffcdd2 67.5deg 90deg,
      #8b0000 90deg 112.5deg,
      #ffcdd2 112.5deg 135deg,
      #8b0000 135deg 157.5deg,
      #ffcdd2 157.5deg 180deg,
      #8b0000 180deg 202.5deg,
      #ffcdd2 202.5deg 225deg,
      #8b0000 225deg 247.5deg,
      #ffcdd2 247.5deg 270deg,
      #8b0000 270deg 292.5deg,
      #ffcdd2 292.5deg 315deg,
      #8b0000 315deg 337.5deg,
      #ffcdd2 337.5deg 360deg
    );
}
.chip--1000 {
  color: #0d1b3a;
  text-shadow: 0 0 2px rgba(227, 242, 255, 0.95);
  background:
    radial-gradient(circle at 50% 50%, #e3f2fd 0%, #bbdefb 47%, transparent 50%),
    conic-gradient(
      from -11deg,
      #0d47a1 0deg 22.5deg,
      #e1f5fe 22.5deg 45deg,
      #0d47a1 45deg 67.5deg,
      #e1f5fe 67.5deg 90deg,
      #0d47a1 90deg 112.5deg,
      #e1f5fe 112.5deg 135deg,
      #0d47a1 135deg 157.5deg,
      #e1f5fe 157.5deg 180deg,
      #0d47a1 180deg 202.5deg,
      #e1f5fe 202.5deg 225deg,
      #0d47a1 225deg 247.5deg,
      #e1f5fe 247.5deg 270deg,
      #0d47a1 270deg 292.5deg,
      #e1f5fe 292.5deg 315deg,
      #0d47a1 315deg 337.5deg,
      #e1f5fe 337.5deg 360deg
    );
}
.chip--5000 {
  color: #4a148c;
  font-size: 9px;
  text-shadow: 0 0 2px rgba(243, 229, 255, 0.95);
  background:
    radial-gradient(circle at 50% 50%, #f3e5f5 0%, #e1bee7 46%, transparent 50%),
    conic-gradient(
      from -11deg,
      #6a1b9a 0deg 22.5deg,
      #ce93d8 22.5deg 45deg,
      #6a1b9a 45deg 67.5deg,
      #ce93d8 67.5deg 90deg,
      #6a1b9a 90deg 112.5deg,
      #ce93d8 112.5deg 135deg,
      #6a1b9a 135deg 157.5deg,
      #ce93d8 157.5deg 180deg,
      #6a1b9a 180deg 202.5deg,
      #ce93d8 202.5deg 225deg,
      #6a1b9a 225deg 247.5deg,
      #ce93d8 247.5deg 270deg,
      #6a1b9a 270deg 292.5deg,
      #ce93d8 292.5deg 315deg,
      #6a1b9a 315deg 337.5deg,
      #ce93d8 337.5deg 360deg
    );
}
.chip.is-disabled {
  opacity: 0.38;
  cursor: not-allowed;
}
.chip:disabled {
  opacity: 0.38;
  cursor: not-allowed;
  pointer-events: none;
}
.chip-rack__grid .chip--allin {
  grid-column: 1 / -1;
}
.chip--allin {
  width: 100%;
  max-width: 200px;
  height: 22px;
  border-radius: 5px;
  font-size: 10px;
  letter-spacing: 0.05em;
  color: #fff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55);
  border: 1px solid #5c0000;
  box-shadow:
    0 1px 0 rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  background:
    repeating-linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.14) 0 3px,
      transparent 3px 7px
    ),
    linear-gradient(180deg, #ef5350 0%, #b71c1c 55%, #7f0000 100%);
}
.chip-rack__amount {
  text-align: center;
  font-size: 12px;
  font-weight: 800;
  color: var(--gold);
}
.btn-chip-cancel {
  width: 100%;
  min-height: 26px;
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.08);
  color: var(--text);
  font-weight: 700;
  font-size: 11px;
  cursor: pointer;
  padding: 2px 4px;
}
.chip-rack--locked {
  opacity: 0.45;
  pointer-events: none;
}
@container felt (max-height: 480px) {
  .oval-hub {
    transform: translate(-50%, -26%);
  }
  .dealer-stand__fig {
    width: clamp(44px, 9.5cqh, 68px);
    height: clamp(62px, 12.5cqh, 92px);
  }
  .felt-outer:not(.felt-outer--duel) {
    --ring-ry: 29%;
    --ring-cy: 45%;
  }
  .felt-center {
    transform: translate(-50%, calc(-50% + var(--board-lift-y, 0))) rotateX(-45deg);
    width: min(var(--board-width-pct), calc(100cqw - 24px + var(--board-grow-w)));
    max-width: min(94cqw, calc(var(--board-max-w) + var(--board-grow-w)));
  }
  .board > .turn-banner {
    padding: 2px 4px 0;
    --board-turn-font: clamp(0.65rem, 1.85cqw, 0.82rem);
  }
  .board > .turn-banner:not(:empty) {
    --board-turn-font: clamp(0.88rem, 2.45cqw, 1.08rem);
  }
}
@container felt (max-height: 400px) {
  .felt-center {
    transform: translate(-50%, calc(-50% + var(--board-lift-y, 0))) rotateX(-45deg);
    width: min(var(--board-width-pct), calc(100cqw - 24px + var(--board-grow-w)));
    max-width: min(94cqw, calc(var(--board-max-w) + var(--board-grow-w)));
  }
  .felt-outer:not(.felt-outer--duel) {
    --ring-ry: 27%;
  }
  .controls-top--hub .btn--new {
    min-height: 34px;
    padding: 8px 14px;
    font-size: 12px;
  }
}
.hero-head {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex-wrap: wrap;
}
.tier-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
  color: #1a1408;
  background: linear-gradient(180deg, #e8d4a8 0%, #c9a962 100%);
  border: 1px solid rgba(255, 240, 200, 0.55);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.35);
  white-space: nowrap;
}
.tier-badge--inline {
  font-size: 10px;
  padding: 1px 6px;
  vertical-align: middle;
}
.tier-badge[hidden] {
  display: none !important;
}
.tier-badge__icon {
  font-size: 12px;
  line-height: 1;
}

/* --- UI batch A/B: table layout, seat stack, hero dock, tiers --- */
:root {
  --seat-avatar-h: clamp(36px, 8cqw, 48px);
  --seat-name-h: 1.15em;
  --seat-pos-h: 1em;
  --seat-chips-h: 1.2em;
  --seat-commit-h: 1.1em;
  --seat-action-h: clamp(22px, 5cqw, 30px);
}
.table-layout {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
  width: 100%;
  gap: 4px;
}
/* 已弃牌 · 桌面：名牌半透明 + 整组手牌变暗（不写进牌面） */
body:not([data-ui-tier="MH"]) .seat-info-panel.is-folded .seat-info-card,
body:not([data-ui-tier="MH"]) .seat-info-panel.is-folded .seat-info-meta {
  opacity: 0.48;
  transition: opacity 0.25s ease;
}

body:not([data-ui-tier="MH"]) .ai-felt-hole.is-folded .seat-cards,
body:not([data-ui-tier="MH"]) .hero-felt-hole.is-folded .seat-cards {
  opacity: 0.38;
  filter: saturate(0.58);
  transition: opacity 0.25s ease, filter 0.25s ease;
}

.table-top-bar {
  position: relative;
  z-index: 50;
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  padding: 4px 6px 2px;
  min-height: var(--layout-top-h, 48px);
}
.table-top-bar .auth-status-line,
.table-top-bar .btn--ghost {
  position: relative;
  z-index: 1;
}
.table-top-bar .auth-status-line {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  font-size: clamp(11px, 1.8vmin, 13px);
}
/* 桌面：二级按钮仍横排；MH 在 mobile-landscape.css 收成 ⋯ 菜单 */
.table-top-bar__more {
  display: contents;
}
.table-top-bar__more-toggle {
  display: none;
}
.table-top-bar__more-menu {
  display: contents;
}
.table-body {
  flex: 1 1 auto;
  min-height: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  width: 100%;
  overflow: visible;
  padding-bottom: 0;
  transform: translateY(var(--table-body-lift-y, -1cm));
}
.table-rail.action-feed {
  display: none !important;
}
.hero-dock {
  position: absolute;
  left: 50%;
  right: auto;
  bottom: max(4px, env(safe-area-inset-bottom));
  transform: translateX(-50%);
  flex: none;
  z-index: 40;
  width: min(var(--hero-dock-max-w), 94%);
  max-width: var(--hero-dock-max-w);
  margin: 0;
  min-height: var(--layout-hero-dock-h, 96px);
  padding: 0 8px;
  border: none;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  box-shadow: none;
}
.hero-dock__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  max-width: 100%;
  margin: 0 auto;
  min-height: var(--layout-hero-dock-h, 96px);
  position: relative;
}
.hero-dock__layout {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: clamp(8px, 1.2vw, 12px);
  width: 100%;
  min-height: calc(var(--layout-hero-dock-h, 96px) - 10px);
}
.hero-dock__chip-panel,
.hero-dock__act-panel {
  flex: 0 0 auto;
  padding: clamp(5px, 0.85vh, 7px) clamp(8px, 1.1vw, 10px);
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.42);
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 4px 14px rgba(0, 0, 0, 0.35);
  box-sizing: border-box;
}
.hero-dock__act-wrap {
  position: relative;
  flex: 0 0 auto;
  padding-top: calc(clamp(22px, 3vh, 26px) + clamp(4px, 0.55vh, 6px));
  box-sizing: border-box;
}
.hero-dock__act-cluster {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: clamp(8px, 1.2vw, 12px);
}
.hero-dock__deal {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 6px;
  min-width: clamp(72px, 10vw, 88px);
}
.hero-dock__deal .hero-dock__deal-btn,
.hero-dock__deal .btn--new {
  width: auto;
  min-width: clamp(72px, 10vw, 88px);
  min-height: var(--hero-dock-allin-min-h);
  padding: 6px 12px;
  font-size: var(--hero-dock-btn-font);
  font-weight: 700;
  border-radius: 10px;
  box-shadow: 0 3px 0 rgba(0, 0, 0, 0.35);
  white-space: nowrap;
}
.hero-dock__deal .btn--bankrupt-reset {
  min-height: var(--hero-dock-btn-min-h);
  font-size: clamp(9px, 2vmin, 11px);
  padding: 4px 8px;
}
.hero-dock__chip-panel {
  width: var(--hero-dock-chip-panel-w);
  min-width: var(--hero-dock-chip-panel-w);
  max-width: var(--hero-dock-chip-panel-w);
}
.hero-dock__chip-panel.chip-rack--dock {
  max-width: var(--hero-dock-chip-panel-w);
}
.hero-dock__act-panel {
  display: grid;
  grid-template-columns: repeat(3, var(--hero-dock-act-btn-w));
  column-gap: var(--hero-dock-act-gap);
  row-gap: clamp(4px, 0.65vh, 6px);
  width: max-content;
  align-content: start;
}
.hero-dock__row--chips {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: clamp(6px, 1vw, 10px);
  flex-wrap: nowrap;
  width: 100%;
}
.hero-dock__chip-help {
  position: relative;
  flex: 0 0 auto;
}
.hero-dock__chip-help .chip-help-bubble {
  left: 0;
  right: auto;
  top: calc(100% + 4px);
}
.hero-dock__chips {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: clamp(4px, 0.8vw, 7px);
  padding: 0 clamp(6px, 0.9vw, 10px) 0 0;
  flex: 0 1 auto;
  min-width: 0;
}
.hero-dock__chip-meta {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: clamp(5px, 0.75vw, 8px);
  flex: 0 0 auto;
  min-width: 0;
  margin-left: clamp(4px, 0.6vw, 8px);
}
.hero-dock__chip-meta .chip-rack__amount {
  flex: 0 0 var(--hero-dock-amount-w);
  width: var(--hero-dock-amount-w);
  min-width: var(--hero-dock-amount-w);
  max-width: var(--hero-dock-amount-w);
  white-space: nowrap;
  margin: 0;
  text-align: right;
  font-variant-numeric: tabular-nums;
  overflow: visible;
  transform: translateX(var(--hero-dock-amount-shift-x));
}
.hero-dock__chip-meta .btn-chip-cancel {
  flex: 0 0 auto;
  width: auto;
  min-width: 0;
  white-space: nowrap;
  padding: 2px 7px;
}
.hero-dock__bridge-off {
  display: none !important;
}
.hero-dock__hint {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 3px);
  transform: translateX(-50%);
  margin: 0;
  min-height: 0;
  max-height: none;
  overflow: visible;
  white-space: nowrap;
  pointer-events: none;
  z-index: 2;
}
.hero-dock__hint:empty {
  display: none;
}
.hero-dock__hint:not(:empty) {
  display: block;
  font-size: clamp(10px, 2vmin, 12px);
  line-height: 1.15;
  text-align: center;
  color: rgba(255, 248, 200, 0.88);
}
.hero-dock__row--acts {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, var(--hero-dock-act-btn-w));
  column-gap: var(--hero-dock-act-gap);
  align-items: stretch;
  justify-content: start;
  width: 100%;
  margin: 0;
}
.hero-dock__act-btn {
  flex: none;
  width: var(--hero-dock-act-btn-w);
  min-width: var(--hero-dock-act-btn-w);
  max-width: var(--hero-dock-act-btn-w);
  min-height: var(--hero-dock-btn-min-h);
  padding: 3px 5px;
  font-size: var(--hero-dock-btn-font);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  border: 1px solid transparent;
  border-radius: 9px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition:
    transform 0.14s ease,
    box-shadow 0.18s ease,
    filter 0.18s ease,
    border-color 0.18s ease;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
}
.hero-dock__act-btn.btn--fold:not(:disabled) {
  color: #f3f3f3;
  border-color: rgba(255, 255, 255, 0.14);
  background: linear-gradient(180deg, #6f6f6f 0%, #4a4a4a 44%, #323232 100%);
  box-shadow:
    0 2px 0 rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.12);
}
.hero-dock__act-btn.btn--call:not(:disabled) {
  color: #fff;
  border-color: rgba(165, 214, 167, 0.38);
  background: linear-gradient(180deg, #5fbf63 0%, #2e7d32 46%, #1b5e20 100%);
  box-shadow:
    0 2px 0 rgba(8, 40, 12, 0.55),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
}
.hero-dock__act-btn.btn--raise:not(:disabled),
.hero-dock__act-btn.btn--check:not(:disabled) {
  color: #fff;
  border-color: rgba(144, 202, 249, 0.42);
  background: linear-gradient(180deg, #5ca8ef 0%, #1565c0 48%, #0d47a1 100%);
  box-shadow:
    0 2px 0 rgba(7, 38, 78, 0.55),
    0 0 7px rgba(21, 101, 192, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
}
.hero-dock__act-btn.btn--raise-wait:not(:disabled) {
  opacity: 0.78;
  filter: saturate(0.9);
}
.hero-dock__act-btn:not(:disabled):hover {
  filter: brightness(1.06);
  transform: scale(1.02);
}
.hero-dock__act-btn.btn--fold:not(:disabled):hover {
  box-shadow:
    0 2px 0 rgba(0, 0, 0, 0.42),
    0 0 8px rgba(255, 255, 255, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.16);
}
.hero-dock__act-btn.btn--call:not(:disabled):hover {
  box-shadow:
    0 2px 0 rgba(8, 40, 12, 0.55),
    0 0 10px rgba(76, 175, 80, 0.26),
    inset 0 1px 0 rgba(255, 255, 255, 0.22);
}
.hero-dock__act-btn.btn--raise:not(:disabled):hover,
.hero-dock__act-btn.btn--check:not(:disabled):hover {
  box-shadow:
    0 2px 0 rgba(7, 38, 78, 0.55),
    0 0 12px rgba(33, 150, 243, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.26);
}
.hero-dock__act-btn:not(:disabled):active {
  transform: scale(0.98);
  filter: brightness(1.03);
  box-shadow:
    inset 0 2px 5px rgba(0, 0, 0, 0.32),
    0 1px 0 rgba(0, 0, 0, 0.28);
}
.hero-dock__act-btn:disabled {
  opacity: 0.45;
  filter: grayscale(0.35);
  cursor: not-allowed;
  box-shadow: none;
  text-shadow: none;
}
.hero-dock__row--allin {
  display: flex;
  grid-column: 1 / -1;
  justify-content: stretch;
  align-items: stretch;
  width: 100%;
  margin: 0;
}
.hero-dock__allin-btn {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  max-width: none;
  min-height: var(--hero-dock-allin-min-h);
  padding: 4px 8px;
  font-size: clamp(10px, 2.3vmin, 12px);
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 9px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  transition:
    transform 0.14s ease,
    box-shadow 0.18s ease,
    filter 0.18s ease,
    background 0.18s ease;
}
.hero-dock__allin-btn:not(:disabled) {
  color: #2a1200;
  border: 1px solid rgba(255, 224, 130, 0.75);
  background: linear-gradient(180deg, #ffe082 0%, #ff8f00 48%, #e65100 100%);
  box-shadow:
    0 0 10px rgba(255, 193, 7, 0.42),
    0 2px 0 rgba(90, 40, 0, 0.45),
    0 2px 8px rgba(0, 0, 0, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.35);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
}
.hero-dock__allin-btn:not(:disabled):hover {
  filter: brightness(1.06);
  box-shadow:
    0 0 18px rgba(255, 193, 7, 0.72),
    0 0 28px rgba(255, 87, 34, 0.35),
    0 2px 0 rgba(90, 40, 0, 0.5),
    0 3px 10px rgba(0, 0, 0, 0.5),
    inset 0 1px 0 rgba(255, 255, 255, 0.4);
  transform: scale(1.02);
}
.hero-dock__allin-btn:not(:disabled):active {
  transform: scale(0.98);
  filter: brightness(1.1);
  box-shadow:
    0 0 22px rgba(255, 193, 7, 0.85),
    0 0 32px rgba(255, 87, 34, 0.45),
    inset 0 2px 6px rgba(0, 0, 0, 0.25);
}
.hero-dock__allin-btn:disabled {
  opacity: 0.45;
  filter: grayscale(0.35);
}
.seat-info-panel--hero {
  width: var(--hero-info-card-w);
  min-width: var(--hero-info-card-w);
  max-width: var(--hero-info-card-w);
  transform: translate(calc(-50% - 5.6cm), -50%);
}
.seat-info-panel--hero .seat-info-layout--stack {
  width: 100%;
  max-width: 100%;
}
.seat-info-panel--hero .seat-info-card {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}
.seat-info-panel--hero .seat-stack__chips,
.seat-info-panel--hero .chips--meta {
  font-variant-numeric: tabular-nums;
  overflow: hidden;
  text-overflow: ellipsis;
}
.seat-info-panel--hero .seat-avatar-slot--hero {
  width: auto;
  height: auto;
  min-height: 0;
}
.seat-info-panel--hero .seat-avatar--hero {
  display: none;
}
.seat-info-panel--hero .seat-stack__commit {
  font-size: clamp(9px, 2vmin, 10px);
  line-height: 1.2;
  color: rgba(255, 255, 255, 0.72);
}
.hero-dock__cards {
  display: none !important;
}
.hero-felt-hole {
  --seat-deg: 180;
  --card-out: clamp(6px, 1.2cqw, 10px);
  position: absolute;
  left: calc(50% + var(--hero-hole-nudge-x));
  top: auto;
  bottom: clamp(8px, 1.4vmin, 14px);
  transform: translate(-50%, 0);
  transform-origin: 50% 88%;
  transform-style: preserve-3d;
  z-index: 8;
  width: clamp(168px, 38cqw, 252px);
  max-width: clamp(180px, 40cqw, 260px);
  display: flex;
  justify-content: center;
  align-items: flex-end;
  pointer-events: none;
}
.hero-felt-hole .seat-cards--hero-hole {
  width: 100%;
}
.hero-dock .chip-rack--dock {
  max-width: none;
  width: auto;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.hero-dock .chip-rack--dock .chip-rack__grid,
.hero-dock .chip-rack--dock .hero-dock__chips {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  grid-template-columns: unset;
  grid-template-rows: unset;
  gap: clamp(4px, 0.8vw, 7px);
  padding: 0;
  justify-items: unset;
}
.hero-dock .chip-rack--dock .chip {
  width: var(--hero-dock-chip-size);
  height: var(--hero-dock-chip-size);
  font-size: var(--hero-dock-chip-font);
  flex: 0 0 auto;
}
.hero-dock__chip-panel .chip-rack--dock,
.hero-dock__chip-panel.chip-rack--dock {
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  max-width: none;
}
.hero-dock .chip-rack--dock .chip-help-btn {
  width: var(--hero-dock-help-size);
  height: var(--hero-dock-help-size);
  font-size: var(--hero-dock-help-font);
}
.hero-dock .chip-rack--dock .chip-rack__amount {
  font-size: var(--hero-dock-chip-amount-font);
  min-height: 1.2em;
  line-height: 1.2;
  flex: 0 0 var(--hero-dock-amount-w);
  width: var(--hero-dock-amount-w);
  min-width: var(--hero-dock-amount-w);
  max-width: var(--hero-dock-amount-w);
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.hero-dock .chip-rack--dock .btn-chip-cancel {
  width: auto;
  min-height: var(--hero-dock-cancel-min-h);
  font-size: var(--hero-dock-cancel-font);
  padding: 2px 7px;
}
.hero-dock__row--acts.hero-dock__actions,
.hero-dock .hero-dock__row--acts.actions {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, var(--hero-dock-act-btn-w));
  column-gap: var(--hero-dock-act-gap);
  width: 100%;
  margin: 0;
  min-height: 0;
  align-items: stretch;
}
.seat-stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  gap: 2px;
}
.seat-stack__avatar {
  flex: 0 0 var(--seat-avatar-h);
  min-height: var(--seat-avatar-h);
  display: flex;
  align-items: center;
  justify-content: center;
}
.seat-stack__name {
  flex: 0 0 var(--seat-name-h);
  min-height: var(--seat-name-h);
  line-height: var(--seat-name-h);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
.seat-stack__pos {
  flex: 0 0 var(--seat-pos-h);
  min-height: var(--seat-pos-h);
  line-height: var(--seat-pos-h);
  font-size: clamp(9px, 2cqw, 11px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
.seat-stack__chips {
  flex: 0 0 var(--seat-chips-h);
  min-height: var(--seat-chips-h);
  line-height: var(--seat-chips-h);
  font-size: clamp(11px, 2.6cqw, 13px);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
.seat-stack__commit {
  flex: 0 0 var(--seat-commit-h);
  min-height: var(--seat-commit-h);
  line-height: var(--seat-commit-h);
  font-size: clamp(10px, 2.4cqw, 12px);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #ffd56a;
}
.seat-stack__action {
  flex: 0 0 var(--seat-action-h);
  min-height: var(--seat-action-h);
  max-height: var(--seat-action-h);
  width: 100%;
}
.seat-stack__cards {
  flex: 0 0 auto;
  margin-top: 2px;
}
.seat-avatar--hero {
  width: clamp(34px, 8cqw, 46px);
  height: clamp(34px, 8cqw, 46px);
  border-radius: 8px;
  background: linear-gradient(145deg, #5a6a7a 0%, #37474f 100%);
  border: 2px solid rgba(120, 200, 255, 0.35);
}
.seat--hero .hero-head {
  gap: 4px;
}
.board-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  min-height: 2.8em;
}
.board-head .pot,
.board-head .board-round {
  flex: 0 0 1.35em;
  min-height: 1.35em;
  line-height: 1.35em;
  margin: 0;
  width: 100%;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.felt-mat .pot {
  font-size: clamp(15px, 3.8cqw, 20px);
  font-weight: 800;
}
.ring-slot .seat--ai,
.ring-slot .seat--cards-only {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
}
.seat-info-layer .seat-info-cluster .chips--meta,
.seat-info-layer .seat-info-panel .seat-info-meta .chips--meta,
.seat-info-layer .seat-info-panel .seat-info-card .chips--meta {
  font-size: clamp(12px, 2.7vmin, 15px);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  min-height: var(--seat-chips-h);
  line-height: var(--seat-chips-h);
}
.seat-info-layer .seat-info-cluster .positions {
  min-height: var(--seat-pos-h);
  line-height: var(--seat-pos-h);
  font-size: clamp(9px, 2vmin, 11px);
}
.seat-info-layer .seat-info-cluster .label,
.seat-info-layer .seat-info-panel .seat-info-meta .label,
.seat-info-layer .seat-info-panel .seat-info-card .label,
.seat-info-layer .seat-stack__name {
  min-height: var(--seat-name-h);
  line-height: var(--seat-name-h);
  font-size: clamp(10px, 2.4vmin, 12px);
  font-weight: 700;
}
.seat-info-layer .ai-avatar-wrap {
  min-height: var(--seat-avatar-h);
  margin-bottom: 0;
}
.seat-info-layer .seat-meta {
  align-items: center;
  text-align: center;
}
.seat-info-layer .seat-stack__commit {
  font-size: clamp(9px, 2vmin, 11px);
  color: rgba(255, 255, 255, 0.72);
}
body[data-ui-tier="L"] {
  --layout-hero-dock-h: clamp(82px, 10vh, 100px);
  --hero-dock-max-w: min(760px, 96vw);
  --hero-dock-act-btn-w: clamp(84px, 12vw, 100px);
  --hero-dock-act-gap: 7px;
  --hero-dock-btn-min-h: clamp(28px, 3.8vh, 32px);
  --hero-dock-allin-min-h: clamp(30px, 4vh, 34px);
  --hero-dock-btn-font: clamp(11px, 2.5vmin, 13px);
  --hero-dock-chip-size: clamp(38px, 4.5vmin, 46px);
  --hero-dock-chip-font: clamp(9px, 2vmin, 11px);
  --hero-dock-chip-amount-font: clamp(12px, 2.6vmin, 15px);
  --hero-dock-cancel-min-h: clamp(24px, 3.2vh, 28px);
  --hero-dock-cancel-font: clamp(10px, 2.1vmin, 11px);
  --hero-dock-help-size: clamp(18px, 2.4vmin, 22px);
  --hero-dock-help-font: clamp(10px, 2.1vmin, 12px);
}
body[data-ui-tier="M"] {
  --layout-hero-dock-h: clamp(78px, 9.5vh, 96px);
  --hero-dock-max-w: min(680px, 94vw);
  --hero-dock-act-btn-w: clamp(76px, 11vw, 90px);
  --hero-dock-act-gap: 6px;
  --hero-dock-btn-min-h: clamp(26px, 3.6vh, 30px);
  --hero-dock-allin-min-h: clamp(28px, 3.8vh, 32px);
  --hero-dock-btn-font: clamp(10px, 2.2vmin, 12px);
  --hero-dock-chip-size: clamp(36px, 4.2vmin, 42px);
  --hero-dock-chip-font: clamp(8px, 1.85vmin, 10px);
  --hero-dock-chip-amount-font: clamp(10px, 2.2vmin, 12px);
  --hero-dock-cancel-min-h: clamp(20px, 2.8vh, 24px);
  --hero-dock-cancel-font: clamp(9px, 1.9vmin, 10px);
  --hero-dock-help-size: clamp(16px, 2.2vmin, 18px);
  --hero-dock-help-font: clamp(9px, 1.9vmin, 10px);
}
body[data-ui-tier="S"] {
  --layout-hero-dock-h: clamp(74px, 9vh, 90px);
  --hero-dock-max-w: min(640px, 92vw);
  --hero-dock-act-btn-w: clamp(70px, 18vw, 84px);
  --hero-dock-act-gap: 5px;
  --hero-dock-btn-min-h: clamp(24px, 3.4vh, 28px);
  --hero-dock-allin-min-h: clamp(26px, 3.6vh, 30px);
  --hero-dock-btn-font: clamp(9px, 2.1vmin, 11px);
  --hero-dock-chip-size: clamp(34px, 4vmin, 40px);
  --hero-dock-chip-font: clamp(8px, 1.75vmin, 9px);
  --hero-dock-chip-amount-font: clamp(10px, 2.1vmin, 12px);
  --hero-dock-cancel-min-h: clamp(18px, 2.6vh, 22px);
  --hero-dock-cancel-font: clamp(8px, 1.8vmin, 9px);
  --hero-dock-help-size: clamp(15px, 2vmin, 17px);
  --hero-dock-help-font: clamp(8px, 1.8vmin, 9px);
}
body[data-ui-tier="XS"] {
  --layout-hero-dock-h: clamp(72px, 8.5vh, 88px);
  --hero-dock-max-w: calc(100% - 12px);
  --hero-dock-act-btn-w: clamp(66px, 20vw, 80px);
  --hero-dock-act-gap: 5px;
  --hero-dock-btn-min-h: clamp(24px, 3.4vh, 28px);
  --hero-dock-allin-min-h: clamp(26px, 3.6vh, 30px);
  --hero-dock-btn-font: clamp(9px, 2.2vmin, 11px);
  --hero-dock-chip-size: clamp(32px, 7.5vmin, 38px);
  --hero-dock-chip-font: clamp(8px, 2vmin, 10px);
  --hero-dock-chip-amount-font: clamp(10px, 2.3vmin, 12px);
  --hero-dock-cancel-min-h: clamp(22px, 3vh, 28px);
  --hero-dock-cancel-font: clamp(9px, 2vmin, 10px);
  --hero-dock-help-size: clamp(16px, 2.2vmin, 18px);
  --hero-dock-help-font: clamp(9px, 2vmin, 10px);
}
body[data-ui-tier="XS"] .felt-outer {
  --avail-w: calc(100vw - 16px);
}
body[data-ui-tier="XS"] .hero-dock .chip-rack--dock .chip {
  touch-action: manipulation;
}
@media (max-width: 900px) {
  .table-scene {
    padding-bottom: calc(var(--layout-hero-dock-h, 96px) + clamp(6px, 0.8vh, 10px));
  }
  .hero-dock {
    width: calc(100% - 12px);
    max-width: none;
  }
}

/* ── 起手参考浮层（Hero 操作区） ── */
.hero-dock__ref-row {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
  width: max-content;
  max-width: calc(var(--hero-dock-allin-w) + 16px);
}
.hero-dock__ref-btn {
  min-height: clamp(22px, 3vh, 26px);
  padding: 2px 12px;
  border-radius: 999px;
  border: 1px solid rgba(201, 162, 39, 0.45);
  background: rgba(12, 14, 18, 0.72);
  color: rgba(255, 232, 190, 0.92);
  font-size: clamp(9px, 2vmin, 11px);
  font-weight: 600;
  letter-spacing: 0.04em;
  cursor: pointer;
}
.hero-dock__ref-btn:hover,
.hero-dock__ref-btn.is-open {
  border-color: rgba(255, 215, 140, 0.65);
  background: rgba(201, 162, 39, 0.16);
}
.preflop-ref-overlay {
  position: fixed;
  inset: 0;
  z-index: 85;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 12px 10px calc(var(--layout-hero-dock-h, 96px) + 16px + env(safe-area-inset-bottom));
  background: rgba(0, 0, 0, 0.52);
}
.preflop-ref-overlay[hidden] {
  display: none !important;
}
.preflop-ref-card {
  width: min(420px, 96vw);
  max-height: min(62vh, 520px);
  display: flex;
  flex-direction: column;
  border-radius: 14px;
  border: 1px solid rgba(201, 162, 39, 0.35);
  background: rgba(14, 16, 20, 0.97);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.55);
  overflow: hidden;
}
.preflop-ref-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px 10px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.preflop-ref-card__title-wrap h2 {
  margin: 0;
  font-size: clamp(15px, 3.6vw, 17px);
  color: #f5ead8;
}
.preflop-ref-card__pos {
  margin: 4px 0 0;
  font-size: clamp(11px, 2.6vw, 12px);
  color: rgba(201, 162, 39, 0.88);
}
.preflop-ref-card__close {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  border: none;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.06);
  color: rgba(236, 230, 218, 0.9);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}
.preflop-ref-card__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 10px 12px 8px;
}
.preflop-ref-card__foot {
  margin: 0;
  padding: 8px 14px 12px;
  font-size: clamp(10px, 2.4vw, 11px);
  line-height: 1.45;
  color: rgba(236, 230, 218, 0.55);
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.preflop-ref-block {
  margin-bottom: 10px;
  padding: 10px 11px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.preflop-ref-block--current {
  border-color: rgba(201, 162, 39, 0.42);
  background: rgba(201, 162, 39, 0.08);
}
.preflop-ref-block__title {
  margin: 0 0 6px;
  font-size: clamp(13px, 3.1vw, 14px);
  color: #f5ead8;
}
.preflop-ref-block__tag {
  font-size: 0.85em;
  font-weight: 600;
  color: rgba(255, 215, 140, 0.95);
}
.preflop-ref-block__tip {
  margin: 0 0 8px;
  font-size: clamp(11px, 2.6vw, 12px);
  line-height: 1.45;
  color: rgba(236, 230, 218, 0.72);
}
.preflop-ref-block__label {
  margin: 8px 0 2px;
  font-size: clamp(10px, 2.3vw, 11px);
  font-weight: 700;
  color: rgba(184, 228, 255, 0.82);
}
.preflop-ref-block__do {
  margin: 0;
  font-size: clamp(11px, 2.6vw, 12px);
  line-height: 1.5;
  color: rgba(236, 230, 218, 0.88);
}
.preflop-ref-block__skip {
  margin: 0;
  font-size: clamp(11px, 2.6vw, 12px);
  line-height: 1.5;
  color: rgba(236, 230, 218, 0.62);
}
.preflop-ref-empty {
  margin: 0 0 10px;
  font-size: clamp(11px, 2.6vw, 12px);
  line-height: 1.5;
  color: rgba(236, 230, 218, 0.68);
}
.preflop-ref-others {
  margin-top: 4px;
}
.preflop-ref-others summary {
  cursor: pointer;
  font-size: clamp(11px, 2.6vw, 12px);
  color: rgba(184, 228, 255, 0.85);
  padding: 6px 2px;
}
.preflop-ref-others__inner {
  padding-top: 4px;
}

/* ── BTN / SB / BB 桌沿圆牌标记 + 飞入动画层 ── */
.felt-rim-positions .seat-role-tag--rim.seat-marker--d {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 2.85em;
  height: 2.85em;
  min-width: 2.85em;
  padding: 0;
  border: none;
  border-radius: 50%;
  font-size: clamp(0.62rem, 1.5cqw, 0.82rem);
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
  white-space: nowrap;
  text-shadow: none;
  background: transparent;
  box-shadow: none;
  transform: scale(var(--rim-tag-scale, 1));
  transform-origin: 50% 50%;
  overflow: visible;
}

.felt-rim-positions .seat-role-tag--rim.seat-marker--sb,
.felt-rim-positions .seat-role-tag--rim.seat-marker--bb {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 2.85em;
  height: 2.85em;
  min-width: 2.85em;
  padding: 0;
  border: none;
  border-radius: 50%;
  font-size: clamp(0.62rem, 1.5cqw, 0.82rem);
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
  white-space: nowrap;
  text-shadow: none;
  background: transparent;
  box-shadow: none;
  transform: scale(var(--rim-tag-scale, 1));
  transform-origin: 50% 50%;
  overflow: visible;
}

.seat-marker-dealer {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  transform: translateY(-2px) rotateZ(calc(-1 * var(--pos-rotate, 0deg)));
  filter: drop-shadow(0 5px 4px rgba(0, 0, 0, 0.45));
}

/* 贴桌接触影 */
.seat-marker-dealer::before {
  content: "";
  position: absolute;
  left: 8%;
  right: 8%;
  bottom: -7px;
  height: 28%;
  border-radius: 50%;
  background: radial-gradient(
    ellipse at center,
    rgba(0, 0, 0, 0.52) 0%,
    rgba(0, 0, 0, 0.2) 42%,
    transparent 72%
  );
  z-index: 0;
  pointer-events: none;
}

.seat-marker-dealer__face {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

/* 厚度 · 内缘暗边 */
.seat-marker-dealer__face::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  box-shadow:
    inset 0 -4px 6px rgba(0, 0, 0, 0.38),
    inset 0 2px 5px rgba(255, 255, 255, 0.16);
  pointer-events: none;
}

/* 顶面高光 */
.seat-marker-dealer__face::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: linear-gradient(
    150deg,
    rgba(255, 255, 255, 0.32) 0%,
    rgba(255, 255, 255, 0.08) 24%,
    transparent 50%
  );
  pointer-events: none;
}

/* 盲注标记 · 复用 Hero 筹码区 .chip 尺寸，仅放大 SB/BB 字 */
.felt-rim-positions .rim-blind-chip.chip {
  width: 34px;
  height: 34px;
  min-width: 34px;
  min-height: 34px;
  font-size: 12px;
  letter-spacing: 0.02em;
  cursor: default;
  pointer-events: none;
}

.table-fx-blind-fly {
  position: fixed;
  z-index: 46;
  width: 34px;
  height: 34px;
  margin: 0;
  padding: 0;
  transform: translate(-50%, -50%);
  will-change: left, top, transform, opacity;
}

.table-fx-blind-fly .rim-blind-chip.chip {
  width: 34px;
  height: 34px;
  font-size: 12px;
}

.table-fx-layer {
  position: fixed;
  inset: 0;
  z-index: 45;
  pointer-events: none;
  overflow: hidden;
}

.table-fx-layer--celebrate {
  z-index: 10003;
}

.table-fx-confetti {
  position: fixed;
  z-index: 1;
  width: 8px;
  height: 12px;
  margin: 0;
  border-radius: 1px;
  opacity: 0.95;
  animation: tableFxConfetti 2.4s cubic-bezier(0.22, 0.72, 0.24, 1) forwards;
}

.table-fx-ribbon {
  position: fixed;
  z-index: 1;
  width: 5px;
  height: clamp(18px, 3.2vh, 32px);
  margin: 0;
  border-radius: 2px;
  opacity: 0.92;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  animation: tableFxRibbon 2.6s cubic-bezier(0.18, 0.68, 0.22, 1) forwards;
}

@keyframes tableFxConfetti {
  from {
    transform: translate(0, 0) rotate(0deg) scale(1);
    opacity: 1;
  }
  to {
    transform: translate(var(--fx-dx, 0px), var(--fx-dy, 160px)) rotate(var(--fx-rot, 180deg)) scale(0.85);
    opacity: 0;
  }
}

@keyframes tableFxRibbon {
  0% {
    transform: translate(0, 0) rotate(0deg) scaleY(1);
    opacity: 1;
  }
  35% {
    transform: translate(calc(var(--fx-dx, 0px) * 0.35), calc(var(--fx-dy, 160px) * 0.25))
      rotate(calc(var(--fx-rot, 180deg) * 0.35)) scaleY(1.08);
    opacity: 1;
  }
  100% {
    transform: translate(var(--fx-dx, 0px), var(--fx-dy, 220px)) rotate(var(--fx-rot, 180deg)) scaleY(0.92);
    opacity: 0;
  }
}
