/* Account monthly subscription: compact ~2x2-inch art and a single Stripe action. */
.account-page #planChooser {
  grid-template-columns: minmax(0, 560px);
  justify-content: start;
}
.account-page #planChooser .account-monthly-card {
  display: grid;
  grid-template-columns: 208px minmax(0, 1fr);
  align-items: center;
  min-height: 220px;
  max-width: 560px;
  gap: 0;
}
.account-page #planChooser .account-monthly-card .account-plan-image-button {
  width: 188px;
  height: 188px;
  display: block;
  box-sizing: border-box;
  margin: 12px 0 12px 12px;
  padding: 0;
  appearance: none;
  border-radius: 12px;
  border: 1px solid rgba(246, 200, 95, .30);
  overflow: hidden;
  background: #070c12;
  box-shadow: 0 8px 20px rgba(0, 0, 0, .32);
  cursor: pointer;
  line-height: 0;
}
.account-page #planChooser .account-monthly-card .account-plan-image-button:disabled {
  cursor: not-allowed;
  opacity: .68;
}
.account-page #planChooser .account-monthly-card .account-plan-image-button:not(:disabled):hover {
  border-color: #f2d48b;
  box-shadow: 0 10px 25px rgba(0, 0, 0, .45), 0 0 18px rgba(246, 200, 95, .16);
}
.account-page #planChooser .account-monthly-card .account-plan-image-button:focus-visible {
  outline: 3px solid #f5d58f;
  outline-offset: 3px;
}
.account-page #planChooser .account-monthly-card .account-plan-image-button img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  border: 0;
  border-radius: 0;
  cursor: inherit;
}
.account-page #planChooser .account-monthly-card .plan-body {
  min-width: 0;
  padding: 16px 18px 16px 7px;
}
.account-page #planChooser .account-monthly-card .plan-price {
  margin-top: 9px;
}
.account-page #planChooser .account-monthly-card .plan-body .btn {
  margin-top: 14px;
}
@media (max-width: 580px) {
  .account-page #planChooser {
    grid-template-columns: minmax(0, 1fr);
  }
  .account-page #planChooser .account-monthly-card {
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    min-height: 0;
  }
  .account-page #planChooser .account-monthly-card .account-plan-image-button {
    width: 170px;
    height: 170px;
    margin: 14px auto 0;
  }
  .account-page #planChooser .account-monthly-card .plan-body {
    width: 100%;
    box-sizing: border-box;
    padding: 13px 18px 18px;
    text-align: center;
  }
}