/* Generated from the game renderer. Regenerate rather than edit. */
.eh-card-front { --paper: #f2eddf; }
.eh-card-front .face {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 4px;
  border: 2px solid #c7bea8;
  background: var(--paper);
  box-shadow: 3px 5px 0 #102b2788;
  color: #202943;
  pointer-events: none;
}
.eh-card-front .face[data-suit='H'],
.eh-card-front .face[data-suit='D'] {
  color: #bf274e;
}
.eh-card-front .corner {
  position: absolute;
  left: 3px;
  top: 3px;
  z-index: 4;
  width: 27px;
  display: flex;
  flex-direction: column;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.03;
  background: var(--paper);
}
.eh-card-front .corner .suit {
  font-size: 25px;
}
.eh-card-front .corner.bottom {
  left: auto;
  right: 3px;
  top: auto;
  bottom: 3px;
  transform: rotate(180deg);
}
.eh-card-front .pips {
  position: absolute;
  left: 34px;
  right: 10px;
  top: 17px;
  bottom: 19px;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 22px;
  font-weight: 700;
}
.eh-card-front .pip {
  position: absolute;
  transform: translate(-50%, -50%);
  font-style: normal;
  line-height: 1;
}
.eh-card-front .pip.flip {
  transform: translate(-50%, -50%) rotate(180deg);
}
.eh-card-front .pips.ace {
  font-size: 47px;
}
.eh-card-front .illustration {
  background-image: url('./pixel-court.webp');
  background-size: 400% 400%;
  image-rendering: pixelated;
}
.eh-card-front .illustration {
  position: absolute;
  left: 29px;
  right: 6px;
  top: 9px;
  bottom: 9px;
}
.eh-card-front .atlas-0 {
  background-position: 0% 0%;
}
.eh-card-front .atlas-1 {
  background-position: 33.333333% 0%;
}
.eh-card-front .atlas-2 {
  background-position: 66.666667% 0%;
}
.eh-card-front .atlas-3 {
  background-position: 100% 0%;
}
.eh-card-front .atlas-4 {
  background-position: 0% 33.333333%;
}
.eh-card-front .atlas-5 {
  background-position: 33.333333% 33.333333%;
}
.eh-card-front .atlas-6 {
  background-position: 66.666667% 33.333333%;
}
.eh-card-front .atlas-7 {
  background-position: 100% 33.333333%;
}
.eh-card-front .atlas-8 {
  background-position: 0% 66.666667%;
}
.eh-card-front .atlas-9 {
  background-position: 33.333333% 66.666667%;
}
.eh-card-front .atlas-10 {
  background-position: 66.666667% 66.666667%;
}
.eh-card-front .atlas-11 {
  background-position: 100% 66.666667%;
}
.eh-card-front .atlas-12 {
  background-position: 0% 100%;
}
.eh-card-front .atlas-13 {
  background-position: 33.333333% 100%;
}
.eh-card-front .atlas-14 {
  background-position: 66.666667% 100%;
}
.eh-card-front .atlas-15 {
  background-position: 100% 100%;
}
.eh-card-front .pips-1 .pip:nth-child(1) {
  left: 50%;
  top: 50%;
}
.eh-card-front .pips-8 .pip:nth-child(1) {
  left: 20%;
  top: 15%;
}
.eh-card-front .pips-8 .pip:nth-child(2) {
  left: 80%;
  top: 15%;
}
.eh-card-front .pips-8 .pip:nth-child(3) {
  left: 50%;
  top: 32%;
}
.eh-card-front .pips-8 .pip:nth-child(4) {
  left: 20%;
  top: 50%;
}
.eh-card-front .pips-8 .pip:nth-child(5) {
  left: 80%;
  top: 50%;
}
.eh-card-front .pips-8 .pip:nth-child(6) {
  left: 50%;
  top: 68%;
}
.eh-card-front .pips-8 .pip:nth-child(7) {
  left: 20%;
  top: 85%;
}
.eh-card-front .pips-8 .pip:nth-child(8) {
  left: 80%;
  top: 85%;
}
.eh-card-front .pips-10 .pip:nth-child(1) {
  left: 20%;
  top: 10%;
}
.eh-card-front .pips-10 .pip:nth-child(2) {
  left: 80%;
  top: 10%;
}
.eh-card-front .pips-10 .pip:nth-child(3) {
  left: 50%;
  top: 23%;
}
.eh-card-front .pips-10 .pip:nth-child(4) {
  left: 20%;
  top: 36%;
}
.eh-card-front .pips-10 .pip:nth-child(5) {
  left: 80%;
  top: 36%;
}
.eh-card-front .pips-10 .pip:nth-child(6) {
  left: 20%;
  top: 64%;
}
.eh-card-front .pips-10 .pip:nth-child(7) {
  left: 80%;
  top: 64%;
}
.eh-card-front .pips-10 .pip:nth-child(8) {
  left: 50%;
  top: 77%;
}
.eh-card-front .pips-10 .pip:nth-child(9) {
  left: 20%;
  top: 90%;
}
.eh-card-front .pips-10 .pip:nth-child(10) {
  left: 80%;
  top: 90%;
}
.eh-card-front .face {
  border-radius: 4px;
  border-color: #bfb69f;
}
.eh-card-front .face {
  container-type: inline-size;
}
.eh-card-front .corner {
  font-size: 21cqw;
  width: 23cqw;
  left: 3cqw;
  top: 3cqw;
  line-height: 1.03;
}
.eh-card-front .corner .suit {
  font-size: 19cqw;
}
.eh-card-front .corner.bottom {
  left: auto;
  right: 3cqw;
  top: auto;
  bottom: 3cqw;
}
.eh-card-front .illustration {
  left: 18cqw;
  right: auto;
  top: 50%;
  bottom: auto;
  width: 64cqw;
  height: 96cqw;
  transform: translateY(-50%);
  clip-path: inset(1%);
  filter: contrast(1.14) brightness(1.1);
  mix-blend-mode: multiply;
}
.eh-card-front .pips {
  left: 28cqw;
  right: 28cqw;
  top: 18cqw;
  bottom: 18cqw;
  font-size: 20cqw;
}
.eh-card-front .pips.ace {
  font-size: 47cqw;
}
.eh-card-front .rank-glyph {
  display: block;
  height: 0.86em;
  width: 100%;
  margin-bottom: 0.15em;
}
.eh-card-front .rank-glyph svg {
  display: block;
  height: 100%;
  width: auto;
  max-width: 100%;
}
.eh-card-front .suit-glyph {
  display: block;
  width: 0.8em;
  height: 0.85em;
}
.eh-card-front .suit-glyph svg {
  display: block;
  width: 100%;
  height: 100%;
}
.eh-card-front .pip svg {
  display: block;
  width: 0.8em;
  height: 0.88em;
}
.eh-card-front .face .corner {
  background: none;
}
.eh-card-front .pips.ace .pip svg {
  width: 0.95em;
  height: 1em;
}