/* Illustrated button plates; labels stay real, translatable text. */
.game-btn.green,
.game-btn.orange,
.game-btn.purple {
  isolation: isolate;
  background: transparent;
  border: 0;
  box-shadow: none;
  -webkit-text-stroke: 0.035em #185719;
  paint-order: stroke fill;
}
.game-btn.green {
  text-shadow:
    0 0.08em 0 #185519,
    0 0.12em 0.04em #0d430dcc;
}
.game-btn.green::before,
.game-btn.orange::before,
.game-btn.purple::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  border-radius: 0;
  transform: none;
  background: url('../assets/button-green-v3.png') center / 100% 100% no-repeat;
  pointer-events: none;
}
.game-btn.orange {
  color: #60230c;
  text-shadow: 0 0.035em #ffdf83;
  -webkit-text-stroke: 0.025em #ffd374;
}
.game-btn.orange::before {
  background-image: url('../assets/button-orange-v3.png');
}
.game-btn.purple {
  text-shadow:
    0 0.08em 0 #45105c,
    0 0.12em 0.04em #32053dcc;
  -webkit-text-stroke: 0.035em #45105c;
}
.game-btn.purple::before {
  background-image: url('../assets/button-orange-v3.png');
  filter: hue-rotate(210deg);
}
.home-buttons {
  gap: 2cqh;
}
.home-buttons .game-btn {
  width: 100%;
  aspect-ratio: 3 / 1;
  min-height: 0;
}
.home-buttons .orange {
  font-size: 5cqh;
}
.finish-actions .game-btn {
  height: auto;
  min-height: 0;
  flex: none;
  aspect-ratio: 3 / 1;
  font-size: 2.6cqh;
}
@media (orientation: portrait) {
  .home-buttons .orange {
    font-size: min(3.3cqh, 6cqw);
  }
  .finish-actions .game-btn {
    width: min(100%, 32cqh);
    align-self: center;
    font-size: clamp(15px, 2.4cqh, 22px);
  }
}
/* End of src/buttons.css */