/* Approved card faces. Dimensions, transforms and card-state filters belong to
   the table layouts; this file changes only the front paint and its contents. */
.card-face-corner, .card-face-pips, .card-face-court { display: none; }
/* Populate legacy variable-based surfaces (history cards, etc.) consistently. */
body:is([data-card-front-skin="ggindex"],[data-card-front-skin="starsclassic"],[data-card-front-skin="partycolor"]),
.deck-preview-card:is([data-preview-front="ggindex"],[data-preview-front="starsclassic"],[data-preview-front="partycolor"]) {
  --deck-front-bg: #fffefb;
  --deck-front-border: 1px solid #c8c9c6;
  --deck-front-shadow: inset 0 1px 0 #fff, 0 2px 4px #0008;
  --deck-spade-color: #20262b;
  --deck-spade-rank-color: #20262b;
  --deck-spade-suit-color: #20262b;
  --deck-heart-color: #c02e38;
  --deck-heart-rank-color: #c02e38;
  --deck-heart-suit-color: #c02e38;
  --deck-diamond-color: #2462a2;
  --deck-diamond-rank-color: #2462a2;
  --deck-diamond-suit-color: #2462a2;
  --deck-club-color: #27714f;
  --deck-club-rank-color: #27714f;
  --deck-club-suit-color: #27714f;
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) {
  --face-ink:#20262b;
  --face-fill:#303944;
  --face-rank-size:18px;
  --face-corner-size:10px;
  --face-pips-display:none;
  --face-court-display:none;
  display:block!important;
  overflow:hidden!important;
  padding:0!important;
  box-sizing:border-box!important;
  border:1px solid #c8c9c6!important;
  border-radius:4px!important;
  background:linear-gradient(145deg,#fff,#f3f3ed)!important;
  box-shadow:inset 0 1px 0 #fff,0 2px 4px #0008!important;
  text-shadow:none!important;
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
).heart {
  --face-ink:#c02e38;
  --face-fill:#c2444c;
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
).diamond {
  --face-ink:#2462a2;
  --face-fill:#296aaa;
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
).club {
  --face-ink:#27714f;
  --face-fill:#2f815b;
}

body[data-four-color="off"] :is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
).diamond {
  --face-ink:#c02e38;
  --face-fill:#c2444c;
}

body[data-four-color="off"] :is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
).club {
  --face-ink:#20262b;
  --face-fill:#303944;
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) .rank {
  position:absolute!important;
  left:6%!important;
  top:4%!important;
  right:auto!important;
  bottom:auto!important;
  display:block!important;
  width:auto!important;
  max-width:92%!important;
  height:auto!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  transform:scaleX(.8)!important;
  transform-origin:0 0!important;
  translate:none!important;
  rotate:none!important;
  font-family:Impact,"Arial Narrow",Arial,sans-serif!important;
  font-size:var(--face-rank-size)!important;
  font-weight:700!important;
  line-height:1!important;
  letter-spacing:-.5px!important;
  color:var(--face-ink)!important;
  text-shadow:none!important;
  text-align:left!important;
  z-index:2!important;
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) :is(.suit,.card-face-corner) {
  position:absolute!important;
  right:auto!important;
  bottom:auto!important;
  display:block!important;
  margin:0!important;
  padding:0!important;
  translate:none!important;
  rotate:none!important;
  line-height:1!important;
  color:var(--face-ink)!important;
  text-shadow:none!important;
  z-index:1!important;
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) .suit {
  left:66%!important;
  top:74%!important;
  width:59%!important;
  height:41%!important;
  transform:translate(-50%,-50%)!important;
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) .card-face-corner {
  left:7%!important;
  top:45%!important;
  width:var(--face-corner-size)!important;
  height:var(--face-corner-size)!important;
  transform:none!important;
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) :is(.suit,.card-face-corner,.card-face-pip) .hd-suit-text {
  display:none!important;
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) :is(.suit,.card-face-corner,.card-face-pip) svg {
  position:static!important;
  inset:auto!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  fill:currentColor!important;
  overflow:visible!important;
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) .card-face-pips {
  display:var(--face-pips-display)!important;
  position:absolute;
  left:34%;
  top:14%;
  width:60%;
  height:79%;
  color:var(--face-ink);
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) .card-face-pip {
  position:absolute;
  width:31%;
  height:16%;
  transform:translate(-50%,-50%);
  display:block;
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) .card-face-court {
  display:var(--face-court-display)!important;
  position:absolute;
  left:33%;
  top:8%;
  width:61%;
  height:87%;
  color:var(--face-ink);
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) .card-face-court svg {
  display:block;
  width:100%;
  height:100%;
  overflow:hidden;
}

:is(
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"]
) {
  --face-rank-size:16px;
  --face-corner-size:9px;
  --face-pips-display:block;
  --face-court-display:block;
  background:#fffef8!important;
  border-color:#a5a8a6!important;
}

:is(
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"]
) .rank {
  left:5%!important;
  top:5%!important;
  transform:scaleX(.82)!important;
  font-family:"Arial Narrow",Impact,Arial,sans-serif!important;
  font-weight:900!important;
}

:is(
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"]
) .card-face-corner {
  left:6%!important;
  top:39%!important;
}

:is(
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"]
) .suit {
  left:64%!important;
  top:69%!important;
  width:63%!important;
  height:49%!important;
}

:is(
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"]
):has(> :is(.card-face-pips,.card-face-court)) .suit {
  display:none!important;
}

:is(
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) {
  --face-rank-size:22px;
  --face-corner-size:10px;
  background:var(--face-fill)!important;
  border-color:#e6e1d66b!important;
  box-shadow:inset 0 1px 0 #fff5,0 2px 4px #0008!important;
}

:is(
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) .rank {
  left:8%!important;
  top:6%!important;
  color:#fffef7!important;
  font-family:Arial,sans-serif!important;
  font-weight:800!important;
  letter-spacing:-1px!important;
  transform:scaleX(.9)!important;
}

:is(
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) .suit {
  left:60%!important;
  top:74%!important;
  width:65%!important;
  height:43%!important;
  color:#fffef7!important;
}

:is(
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) .card-face-corner {
  display:none!important;
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
).hl-made {
  box-shadow:0 0 0 2px #fcc419,0 0 14px #fcc419d9!important;
}

#hero .holes :is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) {
  --face-rank-size:35px;
  --face-corner-size:15px;
}

#hero .holes :is(
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"]
) {
  --face-rank-size:29px;
  --face-corner-size:13px;
}

#hero .holes :is(
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) {
  --face-rank-size:38px;
  --face-corner-size:15px;
}

:is(#seats,#seatGhosts) :is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) {
  --face-rank-size:11px;
  --face-corner-size:6px;
  border-radius:3px!important;
}

:is(#seats,#seatGhosts) :is(
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"]
) {
  --face-rank-size:10px;
  --face-corner-size:5px;
  border-radius:3px!important;
}

:is(#seats,#seatGhosts) :is(
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
) {
  --face-rank-size:12px;
  --face-corner-size:6px;
  border-radius:3px!important;
}

:is(
  body[data-card-front-skin="ggindex"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="ggindex"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"],
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
).card-deck-main-preview-card {
  --face-rank-size:24px;
  --face-corner-size:12px;
}

:is(
  body[data-card-front-skin="starsclassic"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="starsclassic"]
).card-deck-main-preview-card {
  --face-rank-size:21px;
  --face-corner-size:10px;
}

:is(
  body[data-card-front-skin="partycolor"] #app .card-face:not(.deck-preview-card),
  #app #cardDeckSettingsModal :is(#cardFrontSkinOptions,#cardDeckPreview) .card-face[data-preview-front="partycolor"]
).card-deck-main-preview-card {
  --face-rank-size:26px;
  --face-corner-size:12px;
}

/* Seven front choices retain the existing scroll area and fixed action row. */
#cardDeckSettingsModal .card-skin-grid-front { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (min-width: 700px) {
  #cardDeckSettingsModal .card-skin-grid-front { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}