/* Public section descriptions share one quiet, readable style. */
body.mvc .memoryz-section-heading--has-hint {
  margin-bottom: 0.25rem !important;
}

body.mvc .memoryz-section-hint--public {
  box-sizing: border-box;
  display: block;
  width: min(calc(100% - 2rem), 58ch);
  margin: 0.1rem auto 0.9rem !important;
  padding: 0 !important;
  color: #555 !important;
  font-family: inherit !important;
  font-size: 0.98rem !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  text-align: center !important;
}

/* The candle area uses a video background, so give its caption reliable contrast. */
body.mvc .memoryz-section-hint--candles {
  width: fit-content;
  max-width: min(58ch, calc(100% - 2rem));
  margin: 0.1rem auto 0.9rem !important;
  padding: 0.35rem 0.75rem !important;
  border-radius: 3px;
  background: rgb(0 0 0 / 38%);
  color: #fff !important;
  text-shadow: 0 1px 2px rgb(0 0 0 / 55%);
}

body.mvc .memoryz-section-hint--editor {
  margin: 0.35rem 0 0.7rem;
  padding: 0 1rem;
  color: #666;
  font-size: 0.94rem;
  font-weight: 400;
  line-height: 1.55;
  text-align: left;
}

@media (max-width: 700px) {
  body.mvc .memoryz-section-hint--public {
    width: min(calc(100% - 1.5rem), 58ch);
    margin-bottom: 0.75rem !important;
    font-size: 0.94rem !important;
    line-height: 1.45 !important;
  }

  body.mvc .memoryz-section-hint--candles {
    width: fit-content;
    max-width: calc(100% - 1.5rem);
    padding: 0.3rem 0.6rem !important;
  }

  body.mvc .memoryz-section-hint--editor {
    padding-left: 0.8rem;
    padding-right: 0.8rem;
  }
}
