.game-card {
  position: relative;
  width: 5.2em;
  height: 7.5em;
  background: var(--c-card-face);
  color: var(--c-card-ink);
  border: var(--bw) solid var(--c-card-border);
  border-radius: 0.5em;
  overflow: hidden;
}

.gc-name {
  position: absolute;
  top: 3.5%;
  left: 5.5%;
  z-index: 4;
  max-width: 74%;
  font-size: 0.58em;
  font-weight: 700;
  background: var(--c-card-name);
  border-radius: 0.3em;
  padding: 0.08em 0.35em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gc-marks {
  position: absolute;
  top: 17%;
  left: 5.5%;
  z-index: 4;
  display: flex;
  flex-direction: column;
  gap: 0.18em;
}

.gc-mark {
  width: 0.82em;
  height: 0.82em;
  border-radius: 0.18em;
  border: 0.05em solid rgb(0 0 0 / 0.35);
}

.gc-mark--red {
  background: var(--c-intel-red);
}

.gc-mark--blue {
  background: var(--c-intel-blue);
}

.gc-mark--black {
  background: var(--c-intel-black);
  border-color: var(--c-intel-black-edge);
}

.gc-mark--none {
  background: transparent;
  border: 0.05em dashed rgb(0 0 0 / 0.55);
}

.gc-mark--route {
  width: 1.64em;
  height: 1.64em;
  border-radius: 0.36em;
  display: grid;
  place-items: center;
  background: #3b3325;
  color: #ede5d2;
  font-size: 0.5em;
  border: 0.1em solid rgb(0 0 0 / 0.35);
}

.gc-aux {
  position: absolute;
  left: 4.5%;
  bottom: 33%;
  max-width: 60%;
  z-index: 4;
  font-size: 0.42em;
  background: rgb(43 37 26 / 0.85);
  color: #efe6cf;
  border-radius: 0.5em;
  padding: 0.1em 0.45em;
  white-space: nowrap;
  overflow: hidden;
}

.gc-art {
  position: absolute;
  top: 16.5%;
  left: 24%;
  right: 5.5%;
  bottom: 36.5%;
  z-index: 2;
  background: var(--c-card-art);
  border: var(--bw) solid var(--c-card-border);
  display: grid;
  place-items: center;
}

.gc-art-svg {
  width: 62%;
  height: 62%;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  color: var(--c-card-ink-soft);
  opacity: 0.9;
}

.gc-art-hint {
  font-size: 0.55em;
  color: var(--c-card-ink-soft);
}

.gc-effect {
  position: absolute;
  left: 5.5%;
  right: 5.5%;
  bottom: 4%;
  height: 31%;
  z-index: 1;
  background: var(--c-card-effect);
  border-radius: 0.3em;
  padding: 0.25em 0.3em;
  overflow: hidden;
}

.gc-effect-text {
  display: block;
  font-size: 0.5em;
  line-height: 1.3;
  color: var(--c-card-ink-soft);
  text-align: left;
}

.game-card--mini {
  font-size: 0.68rem;
}

.game-card--mini .gc-effect {
  display: none;
}

.game-card--mini .gc-aux {
  display: none;
}

.game-card--mini .gc-art {
  bottom: 10%;
}

.game-card--preview {
  font-size: 1.7rem;
  justify-self: center;
}

.game-card--peek {
  font-size: 2.1rem;
  box-shadow: var(--shadow-pop);
}

/* 放大版：效果區維持原位；全文過長時自主緩慢下捲至字串末端（距離/時長由 activateEffectAutoScroll 注入），滑出重滑入即重新開始 */
@keyframes effect-autoscroll {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(calc(-1 * var(--effect-scroll-distance, 0rem)));
  }
}

.gc-effect-text--scroll {
  animation: effect-autoscroll var(--effect-scroll-duration, 6s) linear var(--effect-scroll-delay, 1.5s) forwards;
}

.game-card--id {
  font-size: 0.57rem;
}

.game-card--identity {
  --c-card-face: #d2c5a3;
  --c-card-name: #bfae83;
  --c-card-art: #c7b890;
  --c-card-effect: #c5b68e;
}

/* 僅自己可見＝反向斜紋（左上至右下，與牌背相反）鋪於卡面最下層 */
.game-card--self-only {
  background: var(--selfmark-pattern), var(--c-card-face);
}

/* 指定期間（本回合）獲得的手牌：亮紅外框取代預設灰黑框線 */
.game-card--fresh {
  border-color: var(--c-card-fresh);
}