/* Preserve the sentence typography and spacing; only the pointed-at word lights up. */
.has-word-meanings .hint-sentence-word {
  appearance: none;
  display: inline;
  width: auto;
  min-width: 0;
  min-height: 0;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 4px;
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  color: inherit;
  background: transparent;
  box-shadow: none;
  text-align: inherit;
  vertical-align: baseline;
  cursor: help;
  text-decoration: underline dotted rgba(152, 221, 209, .4);
  text-underline-offset: .18em;
  text-decoration-thickness: 1px;
  transform: none;
}
.has-word-meanings .hint-sentence-word:hover,
.has-word-meanings .hint-sentence-word.is-word-active,
.has-word-meanings .hint-sentence-word:focus-visible {
  color: #9ff1df;
  background: rgba(88, 215, 198, .13);
  text-decoration-color: currentColor;
}
.has-word-meanings .hint-sentence-word:focus-visible {
  outline: 2px solid #58d7c6;
  outline-offset: 3px;
}
.stage.is-light-mode .has-word-meanings .hint-sentence-word,
body.ds-practicing:not(.ds-lights-off) .has-word-meanings .hint-sentence-word {
  text-decoration-color: rgba(0, 126, 115, .4);
}
.stage.is-light-mode .has-word-meanings .hint-sentence-word:is(:hover, .is-word-active, :focus-visible),
body.ds-practicing:not(.ds-lights-off) .has-word-meanings .hint-sentence-word:is(:hover, .is-word-active, :focus-visible) {
  color: #087e73;
  background: rgba(0, 155, 139, .1);
}
.hint-word-meaning-tooltip {
  position: fixed;
  z-index: 10000;
  box-sizing: border-box;
  width: max-content;
  max-width: min(260px, calc(100vw - 24px));
  padding: 10px 14px;
  border: 1px solid rgba(124, 215, 197, .5);
  border-radius: 12px;
  color: #f5fffc;
  background: #1c3635;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .28);
  font: 600 15px/1.55 "Microsoft YaHei", "PingFang SC", sans-serif;
  overflow-wrap: anywhere;
  pointer-events: auto;
}
.hint-word-meaning-tooltip.is-light {
  color: #143b38;
  background: #f3fffb;
  border-color: #9fd9cc;
  box-shadow: 0 8px 24px rgba(17, 72, 62, .16);
}
