/* Xdniyam's server-backed Blackjack table, adapted from the supplied Nocturne table pack. */
.blackjack-controls {
  background: #171d1b;
  border-color: rgba(215, 187, 129, .25);
  box-shadow: 0 3px 0 rgba(0,0,0,.3);
}

.bj-table-wrap {
  position: relative;
  min-width: 0;
  padding-bottom: 16px;
}

.bj-nocturne-table {
  min-height: 620px;
  padding: 22px;
  overflow: hidden;
  border: 1px solid #74604b;
  border-radius: 22% 22% 36% 36% / 12% 12% 18% 18%;
  background: linear-gradient(165deg, #3f3532, #17171c 22%, #27262a 45%, #111217 80%, #50413a);
  box-shadow: 0 4px 0 #0b0c10;
}

.bj-nocturne-table::before,
.bj-nocturne-table::after {
  content: "";
  position: absolute;
  inset: 12px;
  border-radius: inherit;
  pointer-events: none;
}

.bj-nocturne-table::before {
  z-index: 0;
  border: 2px solid #9c8050;
  background: #164b46;
}

.bj-nocturne-table::after {
  z-index: 1;
  opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4'%3E%3Cpath d='M0 1h4M1 0v4' stroke='%23fff' stroke-width='.4'/%3E%3C/svg%3E");
}

.bj-table-line {
  position: absolute;
  z-index: 2;
  inset: 25px;
  border: 1px solid rgba(215,187,129,.2);
  border-radius: inherit;
  pointer-events: none;
}

.bj-nocturne-table .bj-shoe {
  position: absolute;
  z-index: 3;
  top: 11%;
  right: 12%;
  width: 62px;
  height: 87px;
  transform: rotate(22deg);
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.bj-nocturne-table .bj-shoe img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 1px solid #8d7950;
  border-radius: 6px;
  box-shadow: 0 4px 8px rgba(0,0,0,.45);
}

.bj-nocturne-table .bj-shoe img:nth-child(2) { transform: translate(3px,-3px); }
.bj-nocturne-table .bj-shoe img:nth-child(3) { transform: translate(6px,-6px); }

.bj-nocturne-table .bj-dealer-zone {
  position: absolute;
  z-index: 4;
  top: 5%;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}

.bj-nocturne-table .bj-label {
  color: #b4c8bf;
  font: 700 12px/1.4 var(--body);
  letter-spacing: 0;
}

.bj-nocturne-table .bj-label b {
  min-width: 26px;
  padding: 2px 7px;
  border: 1px solid rgba(215,187,129,.22);
  border-radius: 6px;
  background: rgba(10,36,35,.65);
  color: #f3dfb0;
  font: 700 12px var(--display);
}

.bj-nocturne-table .bj-felt-text {
  position: absolute;
  z-index: 2;
  top: 49%;
  left: 50%;
  transform: translate(-50%,-50%);
  display: grid;
  justify-items: center;
  gap: 5px;
  width: max-content;
  max-width: 78%;
  padding: 10px 18px;
  border: 0;
  color: rgba(196,177,131,.65);
  pointer-events: none;
}

.bj-felt-text span {
  font: 17px Georgia, serif;
  letter-spacing: .18em;
  white-space: nowrap;
}

.bj-felt-text small {
  font-size: 8px;
  letter-spacing: .2em;
}

.bj-nocturne-table .bj-hands {
  position: absolute;
  z-index: 4;
  right: 0;
  bottom: 4%;
  left: 0;
  width: 100%;
  padding: 0 5%;
  align-items: flex-end;
  box-sizing: border-box;
}

.bj-nocturne-table .bj-hand {
  background: rgba(0,0,0,.06);
  border-color: transparent;
}

.bj-nocturne-table .bj-hand.active {
  border-color: rgba(215,187,129,.68);
  background: rgba(215,187,129,.08);
}

.bj-nocturne-table .banner { z-index: 10; }

@media (max-width: 720px) {
  .bj-nocturne-table {
    min-height: 540px;
    padding: 14px;
    border-radius: 18% 18% 26% 26% / 9% 9% 13% 13%;
  }

  .bj-nocturne-table::before,
  .bj-nocturne-table::after { inset: 9px; }

  .bj-table-line { inset: 19px; }
  .bj-nocturne-table .bj-dealer-zone { top: 4%; }
  .bj-nocturne-table .bj-shoe { top: 12%; right: 8%; width: 46px; height: 65px; }
  .bj-nocturne-table .bj-felt-text { top: 49%; max-width: 80%; padding: 8px 10px; }
  .bj-felt-text span { font-size: 12px; letter-spacing: .12em; }
  .bj-felt-text small { font-size: 7px; letter-spacing: .13em; }
  .bj-nocturne-table .bj-hands { bottom: 3%; padding-inline: 1%; }
}

@media (max-width: 390px) {
  .bj-nocturne-table { min-height: 520px; }
  .bj-nocturne-table .bj-shoe { right: 6%; }
}