body.mock-v3 #gameTable.backbone-table {
  --backbone-gap: clamp(6px, 0.72vw, 12px);
  --card-w: clamp(58px, calc((100vw - 180px) / 12), 112px);
  --card-h: calc(var(--card-w) * 1.42);
  --backbone-foundation-w: var(--card-w);
  display: grid;
  grid-template-areas:
    "top"
    "play";
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-content: start;
  gap: clamp(18px, 2.6vh, 30px);
  width: 100%;
  min-height: clamp(620px, calc(100vh - 178px), 900px);
  overflow: visible;
}

body.mock-v3 #gameTable.backbone-table .top-piles {
  grid-area: top;
  position: relative;
  z-index: 5;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: clamp(12px, 1.5vw, 22px);
  align-items: start;
  min-width: 0;
}

body.mock-v3 #gameTable.backbone-table .stock-waste,
body.mock-v3 #gameTable.backbone-table .foundations,
body.mock-v3 #gameTable.backbone-table .tableau-piles {
  grid-area: auto;
  position: relative;
  inset: auto;
  margin: 0;
  transform: none !important;
}

body.mock-v3 #gameTable.backbone-table .stock-waste {
  display: flex;
  justify-self: start;
  align-self: start;
  gap: clamp(6px, 0.8vw, 10px);
  width: auto;
}

body.mock-v3 #gameTable.backbone-table .stock-waste .pile {
  width: var(--card-w);
  min-width: var(--card-w);
  height: var(--card-h);
  min-height: var(--card-h);
  overflow: visible;
}

body.mock-v3 #gameTable.backbone-table .foundations {
  --card-w: var(--backbone-foundation-w);
  display: grid;
  grid-template-columns: repeat(8, var(--backbone-foundation-w));
  justify-self: end;
  align-self: start;
  gap: clamp(4px, 0.52vw, 8px);
  width: auto;
}

body.mock-v3 #gameTable.backbone-table .foundations .pile,
body.mock-v3 #gameTable.backbone-table .foundations .playing-card,
body.mock-v3 #gameTable.backbone-table .foundations .card-placeholder {
  width: var(--backbone-foundation-w);
  height: calc(var(--backbone-foundation-w) * 1.42);
  min-height: calc(var(--backbone-foundation-w) * 1.42);
}

body.mock-v3 #gameTable.backbone-table .foundations .playing-card__corner {
  left: clamp(5px, 0.62vw, 8px);
  top: clamp(5px, 0.62vw, 8px);
  min-width: clamp(13px, 1.55vw, 22px);
  gap: 0.03rem;
}

body.mock-v3 #gameTable.backbone-table .foundations .playing-card__corner--bottom {
  left: auto;
  top: auto;
  right: clamp(5px, 0.62vw, 8px);
  bottom: clamp(5px, 0.62vw, 8px);
}

body.mock-v3 #gameTable.backbone-table .foundations .playing-card__rank {
  font-size: clamp(0.86rem, 1.72vw, 1.08rem);
  line-height: 1;
}

body.mock-v3 #gameTable.backbone-table .foundations .playing-card__suit {
  font-size: clamp(0.94rem, 1.9vw, 1.22rem);
  line-height: 1;
}

body.mock-v3 #gameTable.backbone-table .foundations .playing-card__center {
  inset: 16% 12% 14%;
  font-size: clamp(1.5rem, 3.6vw, 2.08rem);
}

body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips,
body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--4,
body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--5,
body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--6,
body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--7,
body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--8,
body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--9,
body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--10 {
  --pip-size: clamp(0.92rem, calc(var(--card-w) * 0.18), 1.18rem);
}

body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--1 .playing-card__pip {
  font-size: var(--pip-size);
}

body.mock-v3 #gameTable.backbone-table .foundations .playing-card__face-art {
  inset: 15% 10% 12%;
  font-size: clamp(2rem, 4.8vw, 3.4rem);
}

body.mock-v3 #gameTable.backbone-table .foundations .playing-card__face-image {
  max-width: 80%;
  max-height: 100%;
  object-position: center bottom;
}

body.mock-v3 #gameTable.backbone-table .backbone-play-area {
  grid-area: play;
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns:
    minmax(0, calc(var(--card-w) * 4 + var(--backbone-gap) * 3))
    minmax(calc(var(--card-w) * 2 + 18px), auto)
    minmax(0, calc(var(--card-w) * 4 + var(--backbone-gap) * 3));
  justify-content: center;
  align-items: start;
  gap: clamp(16px, 2.3vw, 34px);
  width: 100%;
  min-width: 0;
  overflow: visible;
}

body.mock-v3 #gameTable.backbone-table .tableau-piles {
  display: grid;
  grid-template-columns: repeat(4, var(--card-w));
  justify-content: center;
  align-items: start;
  gap: var(--backbone-gap);
  width: auto;
  min-width: 0;
  height: auto;
  min-height: 0;
  overflow: visible;
}

body.mock-v3 #gameTable.backbone-table .pile--tableau,
body.mock-v3 #gameTable.backbone-table .pile--backbone,
body.mock-v3 #gameTable.backbone-table .pile--coccyx {
  width: var(--card-w);
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

body.mock-v3 #gameTable.backbone-table .pile--tableau .card-placeholder,
body.mock-v3 #gameTable.backbone-table .pile--backbone .card-placeholder,
body.mock-v3 #gameTable.backbone-table .pile--coccyx .card-placeholder {
  border: 2px dashed rgba(211, 235, 224, 0.3);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.018);
  color: rgba(211, 235, 224, 0.42);
}

body.mock-v3 #gameTable.backbone-table .stock-waste .card-placeholder {
  border: 0;
  background: transparent;
}

body.mock-v3 #gameTable.backbone-table .backbone-piles {
  position: relative;
  display: grid;
  grid-template-columns: var(--card-w) var(--card-w);
  justify-content: center;
  justify-self: center;
  gap: clamp(10px, 1.2vw, 18px);
  min-width: calc(var(--card-w) * 2 + 18px);
  padding-top: 26px;
  overflow: visible;
}

body.mock-v3 #gameTable.backbone-table .backbone-label {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 1;
  width: min(220px, 100%);
  display: flex;
  justify-content: space-between;
  gap: 8px;
  color: rgba(231, 246, 239, 0.82);
  font-size: 0.74rem;
  line-height: 1;
  transform: translateX(-50%);
}

body.mock-v3 #gameTable.backbone-table .backbone-label strong {
  color: #d6f8df;
  font-size: 0.7rem;
  font-weight: 800;
  text-align: right;
}

body.mock-v3 #gameTable.backbone-table .pile--coccyx {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  z-index: 38;
}

body.mock-v3 #gameTable.backbone-table .pile.is-highlight {
  border-radius: 14px;
}

body.mock-v3 #gameTable.backbone-table .playing-card[data-source-type] {
  cursor: grab;
  touch-action: none;
}

body.mock-v3 #gameTable.backbone-table .backbone-stock-count {
  z-index: 12;
}

@media (max-height: 760px) and (min-width: 900px) {
  body.mock-v3 #gameTable.backbone-table {
    --card-w: clamp(52px, calc((100vw - 180px) / 13), 90px);
    min-height: clamp(520px, calc(100vh - 122px), 680px);
    gap: 16px;
  }
}

@media (max-width: 900px) {
  body.mock-v3 #gameTable.backbone-table {
    --card-w: clamp(46px, 13.6vw, 64px);
    --backbone-foundation-w: var(--card-w);
    min-height: auto;
    gap: clamp(14px, 3.5vw, 20px);
  }

  body.mock-v3 #gameTable.backbone-table .top-piles {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  body.mock-v3 #gameTable.backbone-table .stock-waste,
  body.mock-v3 #gameTable.backbone-table .foundations {
    justify-self: center;
  }

  body.mock-v3 #gameTable.backbone-table .foundations {
    grid-template-columns: repeat(4, var(--backbone-foundation-w));
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__corner {
    left: 4px;
    top: 3px;
    gap: 0;
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__corner--bottom {
    left: auto;
    right: 4px;
    top: auto;
    bottom: 3px;
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__rank {
    font-size: 0.74rem;
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__suit {
    font-size: 0.58rem;
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__center {
    inset: 19% 15% 17%;
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips {
    --pip-size: clamp(0.64rem, 1.9vw, 0.86rem);
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--4,
  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--5 {
    --pip-size: clamp(0.66rem, 1.95vw, 0.86rem);
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--6 {
    --pip-size: clamp(0.6rem, 1.75vw, 0.78rem);
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--7,
  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--8 {
    --pip-size: clamp(0.54rem, 1.58vw, 0.7rem);
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--9,
  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips--10 {
    --pip-size: clamp(0.48rem, 1.36vw, 0.62rem);
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__face-art {
    inset: 18% 10% 17%;
  }

  body.mock-v3 #gameTable.backbone-table .backbone-play-area {
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    gap: 18px;
  }

  body.mock-v3 #gameTable.backbone-table .backbone-piles {
    order: -1;
  }

  body.mock-v3 #gameTable.backbone-table .tableau-piles {
    grid-template-columns: repeat(4, var(--card-w));
  }
}

@media (max-width: 420px) {
  body.mock-v3 #gameTable.backbone-table {
    --card-w: clamp(40px, 13vw, 52px);
  }

  body.mock-v3 #gameTable.backbone-table .backbone-label {
    width: 100%;
    font-size: 0.68rem;
  }
}

@media (max-width: 900px) {
  body.mock-v3 .mock-v3-first-screen {
    min-height: 100svh;
    max-height: 100svh;
    overflow: hidden;
  }

  body.mock-v3 .mock-v3-first-screen .container {
    width: 100%;
    max-width: none;
  }

  body.mock-v3 .mock-v3-shell {
    height: 100svh;
    min-height: 0;
    padding: clamp(4px, 1.2svh, 10px) clamp(4px, 1.4vw, 10px);
  }

  body.mock-v3 .mock-v3-table-wrap {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: clamp(4px, 0.9svh, 8px);
    padding: 0;
    overflow: visible;
  }

  body.mock-v3 .mock-v3-top-panel {
    width: 100%;
    max-width: none;
    gap: clamp(3px, 0.75svh, 6px);
  }

  body.mock-v3 .mock-v3-toolbar-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(3px, 0.75svh, 6px);
  }

  body.mock-v3 .mock-v3-toolbar-utils {
    display: none;
  }

  body.mock-v3 .toolbar-actions,
  body.mock-v3.mock-v3-compact-top .toolbar-actions {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: clamp(3px, 0.75vw, 6px);
    width: 100%;
  }

  body.mock-v3 .toolbar-actions [data-game-action="auto-complete"],
  body.mock-v3.mock-v3-compact-top .toolbar-actions [data-game-action="auto-complete"] {
    grid-column: auto;
  }

  body.mock-v3 .toolbar-actions .btn,
  body.mock-v3.mock-v3-compact-top .toolbar-actions .btn {
    width: 100%;
    min-width: 0;
    min-height: clamp(28px, 4.5svh, 36px);
    padding: 0 3px;
    border-radius: 8px;
    font-size: clamp(0.5rem, 1.92vw, 0.72rem);
    line-height: 1.04;
    white-space: normal;
  }

  body.mock-v3.mock-v3-compact-top .mock-v3-hud {
    min-height: 0;
    padding: 0;
    border-top: 0;
  }

  body.mock-v3 .game-stats--four,
  body.mock-v3.mock-v3-compact-top .game-stats--four {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(3px, 0.75vw, 6px);
    width: 100%;
  }

  body.mock-v3 .game-stat,
  body.mock-v3.mock-v3-compact-top .game-stat {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-items: center;
    column-gap: 3px;
    row-gap: 1px;
    min-width: 0;
    min-height: clamp(28px, 4.8svh, 38px);
    padding: 3px 4px;
    border-radius: 7px;
    white-space: normal;
  }

  body.mock-v3.mock-v3-compact-top .game-stat::before {
    grid-row: 1 / span 2;
    width: clamp(10px, 3vw, 15px);
    height: clamp(10px, 3vw, 15px);
    font-size: clamp(0.58rem, 2.3vw, 0.82rem);
  }

  body.mock-v3 .game-stat span,
  body.mock-v3.mock-v3-compact-top .game-stat span {
    display: block;
    min-width: 0;
    font-size: clamp(0.48rem, 1.62vw, 0.62rem);
    line-height: 1;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
  }

  body.mock-v3 .game-stat strong,
  body.mock-v3.mock-v3-compact-top .game-stat strong {
    display: block;
    min-width: 0;
    font-size: clamp(0.62rem, 2.2vw, 0.86rem);
    line-height: 1.05;
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
  }

  body.mock-v3 #gameTable.backbone-table {
    --card-w: clamp(28px, min(calc((100vw - 46px) / 8.75), calc((100svh - 154px) / 11.4)), 62px);
    --card-h: calc(var(--card-w) * 1.42);
    --backbone-gap: clamp(3px, calc(var(--card-w) * 0.1), 6px);
    --backbone-foundation-w: var(--card-w);
    height: auto;
    min-height: 0;
    max-height: none;
    grid-template-rows: auto minmax(0, 1fr);
    align-content: start;
    gap: clamp(4px, 0.9svh, 8px);
    overflow: visible;
  }

  body.mock-v3 #gameTable.backbone-table .top-piles {
    grid-template-columns: repeat(8, var(--card-w));
    justify-content: center;
    justify-items: stretch;
    align-items: start;
    gap: clamp(4px, 1.2vw, 8px) var(--backbone-gap);
    min-height: 0;
    width: calc(var(--card-w) * 8 + var(--backbone-gap) * 7);
    max-width: 100vw;
    justify-self: center;
  }

  body.mock-v3 #gameTable.backbone-table .stock-waste {
    grid-column: 1 / span 2;
    justify-self: start;
    gap: var(--backbone-gap);
  }

  body.mock-v3 #gameTable.backbone-table .foundations {
    grid-column: 5 / span 4;
    justify-self: end;
    gap: var(--backbone-gap);
  }

  body.mock-v3 #gameTable.backbone-table .stock-waste .pile {
    width: var(--card-w);
    min-width: var(--card-w);
    height: var(--card-h);
    min-height: var(--card-h);
  }

  body.mock-v3 #gameTable.backbone-table .foundations {
    grid-template-columns: repeat(4, var(--backbone-foundation-w));
  }

  body.mock-v3 #gameTable.backbone-table .backbone-play-area {
    grid-template-columns: repeat(8, var(--card-w));
    grid-template-areas:
      ". . spine spine spine spine . ."
      "left left left left right right right right";
    justify-content: center;
    justify-items: stretch;
    align-items: start;
    align-content: start;
    gap: clamp(4px, 0.95svh, 8px) var(--backbone-gap);
    min-height: 0;
    overflow: visible;
  }

  body.mock-v3 #gameTable.backbone-table .tableau-piles--left {
    grid-area: left;
  }

  body.mock-v3 #gameTable.backbone-table .tableau-piles--right {
    grid-area: right;
  }

  body.mock-v3 #gameTable.backbone-table .tableau-piles {
    grid-template-columns: repeat(4, var(--card-w));
    gap: var(--backbone-gap);
  }

  body.mock-v3 #gameTable.backbone-table .backbone-piles {
    grid-area: spine;
    order: 0;
    grid-template-columns: repeat(2, var(--card-w));
    gap: clamp(4px, calc(var(--card-w) * 0.12), 8px);
    min-width: 0;
    padding-top: clamp(14px, 2.35svh, 22px);
  }

  body.mock-v3 #gameTable.backbone-table .backbone-label {
    width: min(100%, calc(var(--card-w) * 2 + 18px));
    gap: 4px;
    font-size: clamp(0.48rem, 1.6vw, 0.68rem);
  }

  body.mock-v3 #gameTable.backbone-table .backbone-label strong {
    font-size: clamp(0.48rem, 1.58vw, 0.66rem);
  }

  body.mock-v3 #gameTable.backbone-table .pile--tableau,
  body.mock-v3 #gameTable.backbone-table .pile--backbone,
  body.mock-v3 #gameTable.backbone-table .pile--coccyx {
    width: var(--card-w);
  }

  body.mock-v3 #gameTable.backbone-table .pile--tableau .card-placeholder,
  body.mock-v3 #gameTable.backbone-table .pile--backbone .card-placeholder,
  body.mock-v3 #gameTable.backbone-table .pile--coccyx .card-placeholder {
    border-width: 1px;
    border-radius: clamp(7px, calc(var(--card-w) * 0.18), 12px);
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__corner,
  body.mock-v3 #gameTable.backbone-table .playing-card__corner {
    left: clamp(2px, calc(var(--card-w) * 0.08), 4px);
    top: clamp(2px, calc(var(--card-w) * 0.07), 4px);
    min-width: 0;
    gap: 0;
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__corner--bottom,
  body.mock-v3 #gameTable.backbone-table .playing-card__corner--bottom {
    left: auto;
    top: auto;
    right: clamp(2px, calc(var(--card-w) * 0.08), 4px);
    bottom: clamp(2px, calc(var(--card-w) * 0.07), 4px);
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__rank,
  body.mock-v3 #gameTable.backbone-table .playing-card__rank {
    font-size: clamp(0.54rem, calc(var(--card-w) * 0.18), 0.82rem);
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__suit,
  body.mock-v3 #gameTable.backbone-table .playing-card__suit {
    font-size: clamp(0.46rem, calc(var(--card-w) * 0.16), 0.72rem);
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__center,
  body.mock-v3 #gameTable.backbone-table .playing-card__center {
    inset: 19% 15% 17%;
    font-size: clamp(0.98rem, calc(var(--card-w) * 0.42), 1.5rem);
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__pips,
  body.mock-v3 #gameTable.backbone-table .playing-card__pips {
    --pip-size: clamp(0.45rem, calc(var(--card-w) * 0.17), 0.72rem);
  }

  body.mock-v3 #gameTable.backbone-table .foundations .playing-card__face-art,
  body.mock-v3 #gameTable.backbone-table .playing-card__face-art {
    inset: 18% 10% 17%;
    font-size: clamp(1.25rem, calc(var(--card-w) * 0.58), 2.15rem);
  }
}

@media (max-width: 900px) and (max-height: 620px) {
  body.mock-v3 .mock-v3-shell {
    padding: 2px 4px;
  }

  body.mock-v3 .mock-v3-table-wrap {
    gap: 3px;
  }

  body.mock-v3 .toolbar-actions .btn,
  body.mock-v3.mock-v3-compact-top .toolbar-actions .btn {
    min-height: clamp(22px, 5.8svh, 28px);
    border-radius: 6px;
    font-size: clamp(0.42rem, 1.45vw, 0.58rem);
  }

  body.mock-v3 .game-stat,
  body.mock-v3.mock-v3-compact-top .game-stat {
    min-height: clamp(22px, 5.7svh, 28px);
    padding: 2px 3px;
  }

  body.mock-v3 .game-stat span,
  body.mock-v3.mock-v3-compact-top .game-stat span {
    font-size: clamp(0.42rem, 1.25vw, 0.54rem);
  }

  body.mock-v3 .game-stat strong,
  body.mock-v3.mock-v3-compact-top .game-stat strong {
    font-size: clamp(0.52rem, 1.6vw, 0.7rem);
  }

  body.mock-v3 #gameTable.backbone-table {
    --card-w: clamp(22px, min(calc((100vw - 36px) / 8.75), calc((100svh - 104px) / 10.8)), 46px);
    --backbone-gap: clamp(2px, calc(var(--card-w) * 0.095), 5px);
    gap: 3px;
  }

  body.mock-v3 #gameTable.backbone-table .top-piles,
  body.mock-v3 #gameTable.backbone-table .backbone-play-area {
    gap: 3px var(--backbone-gap);
  }

  body.mock-v3 #gameTable.backbone-table .backbone-piles {
    padding-top: clamp(10px, 3svh, 16px);
  }
}

@media (max-width: 520px) and (min-height: 700px) and (orientation: portrait) {
  body.mock-v3 .mock-v3-shell {
    padding: 10px 8px 18px;
  }

  body.mock-v3 .mock-v3-table-wrap {
    gap: 8px;
  }

  body.mock-v3 .mock-v3-top-panel,
  body.mock-v3 .mock-v3-toolbar-row {
    gap: 8px;
  }

  body.mock-v3 .toolbar-actions,
  body.mock-v3.mock-v3-compact-top .toolbar-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  body.mock-v3 .toolbar-actions [data-game-action="auto-complete"],
  body.mock-v3.mock-v3-compact-top .toolbar-actions [data-game-action="auto-complete"] {
    grid-column: 1 / -1;
  }

  body.mock-v3 .toolbar-actions .btn,
  body.mock-v3.mock-v3-compact-top .toolbar-actions .btn {
    min-height: 38px;
    padding: 0.42rem 0.42rem;
    border-radius: 10px;
    font-size: clamp(0.68rem, 3.3vw, 0.78rem);
    line-height: 1.08;
    white-space: nowrap;
  }

  body.mock-v3.mock-v3-compact-top .mock-v3-hud {
    min-height: 48px;
    padding: 10px 0 0;
    border-top: 1px solid rgba(218, 250, 236, 0.18);
  }

  body.mock-v3 .game-stats--four,
  body.mock-v3.mock-v3-compact-top .game-stats--four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 12px;
  }

  body.mock-v3 .game-stat,
  body.mock-v3.mock-v3-compact-top .game-stat {
    display: inline-flex;
    min-height: 36px;
    column-gap: 0;
    gap: 7px;
    padding: 0;
    white-space: nowrap;
  }

  body.mock-v3.mock-v3-compact-top .game-stat::before {
    width: 22px;
    height: 22px;
    font-size: 1.08rem;
  }

  body.mock-v3 .game-stat span,
  body.mock-v3.mock-v3-compact-top .game-stat span {
    display: inline;
    font-size: 0.86rem;
    font-weight: 800;
  }

  body.mock-v3 .game-stat strong,
  body.mock-v3.mock-v3-compact-top .game-stat strong {
    display: inline;
    font-size: 0.86rem;
    font-weight: 900;
  }

  body.mock-v3 #gameTable.backbone-table {
    --card-w: clamp(36px, min(calc((100vw - 48px) / 8), calc((100svh - 255px) / 8.6)), 62px);
    --backbone-gap: clamp(4px, calc(var(--card-w) * 0.105), 7px);
    gap: clamp(8px, 1.2svh, 12px);
  }

  body.mock-v3 #gameTable.backbone-table .top-piles,
  body.mock-v3 #gameTable.backbone-table .backbone-play-area {
    gap: clamp(7px, 1.15svh, 10px) var(--backbone-gap);
  }

  body.mock-v3 #gameTable.backbone-table .backbone-piles {
    padding-top: clamp(18px, 2.8svh, 24px);
  }

  body.mock-v3 #gameTable.backbone-table .backbone-label {
    font-size: clamp(0.58rem, 2.3vw, 0.75rem);
  }

  body.mock-v3 #gameTable.backbone-table .backbone-label strong {
    font-size: clamp(0.58rem, 2.25vw, 0.74rem);
  }
}

body.mock-v3 #gameTable.backbone-table .pile--tableau.is-dense-stack .playing-card:not(:last-child) .playing-card__center,
body.mock-v3 #gameTable.backbone-table .pile--tableau.is-dense-stack .playing-card:not(:last-child) .playing-card__corner--bottom,
body.mock-v3 #gameTable.backbone-table .pile--backbone.is-dense-stack .playing-card:not(:last-child) .playing-card__center,
body.mock-v3 #gameTable.backbone-table .pile--backbone.is-dense-stack .playing-card:not(:last-child) .playing-card__corner--bottom {
  opacity: 0;
}

body.mock-v3 #gameTable.backbone-table .pile--tableau.is-dense-stack .playing-card:not(:last-child) .playing-card__corner:not(.playing-card__corner--bottom),
body.mock-v3 #gameTable.backbone-table .pile--backbone.is-dense-stack .playing-card:not(:last-child) .playing-card__corner:not(.playing-card__corner--bottom) {
  top: 0;
  left: clamp(4px, calc(var(--card-w) * 0.04), 7px);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: clamp(1px, calc(var(--card-w) * 0.01), 2px);
  min-width: 0;
  padding: 0 clamp(1px, calc(var(--card-w) * 0.012), 3px);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 1px 3px rgba(7, 23, 17, 0.08);
}

body.mock-v3 #gameTable.backbone-table .pile--tableau.is-dense-stack .playing-card:not(:last-child) .playing-card__rank,
body.mock-v3 #gameTable.backbone-table .pile--backbone.is-dense-stack .playing-card:not(:last-child) .playing-card__rank {
  font-size: clamp(0.66rem, calc(var(--card-w) * 0.094), 1.03rem);
  line-height: 1;
}

body.mock-v3 #gameTable.backbone-table .pile--tableau.is-dense-stack .playing-card:not(:last-child) .playing-card__suit,
body.mock-v3 #gameTable.backbone-table .pile--backbone.is-dense-stack .playing-card:not(:last-child) .playing-card__suit {
  font-size: clamp(0.6rem, calc(var(--card-w) * 0.079), 0.92rem);
  line-height: 1;
}

body.mock-v3 #gameTable.backbone-table .pile--tableau.is-ultra-dense-stack .playing-card:not(:last-child) .playing-card__corner:not(.playing-card__corner--bottom),
body.mock-v3 #gameTable.backbone-table .pile--backbone.is-ultra-dense-stack .playing-card:not(:last-child) .playing-card__corner:not(.playing-card__corner--bottom) {
  top: 1px;
  gap: 1px;
  padding-inline: 1px;
}

body.mock-v3 #gameTable.backbone-table .pile--tableau.is-ultra-dense-stack .playing-card:not(:last-child) .playing-card__rank,
body.mock-v3 #gameTable.backbone-table .pile--backbone.is-ultra-dense-stack .playing-card:not(:last-child) .playing-card__rank {
  font-size: clamp(0.6rem, calc(var(--card-w) * 0.079), 0.89rem);
}

body.mock-v3 #gameTable.backbone-table .pile--tableau.is-ultra-dense-stack .playing-card:not(:last-child) .playing-card__suit,
body.mock-v3 #gameTable.backbone-table .pile--backbone.is-ultra-dense-stack .playing-card:not(:last-child) .playing-card__suit {
  font-size: clamp(0.55rem, calc(var(--card-w) * 0.067), 0.8rem);
}

body.mock-v3 #gameTable.backbone-table .backbone-label {
  display: none;
}

body.mock-v3 #gameTable.backbone-table .backbone-piles {
  padding-top: 0;
}
