/* CJK layer: loaded after the shared stylesheets by Chinese and Japanese.

   The shared stylesheets (core/styles) are written for Latin-script languages.
   Chinese and Japanese differ in a few deliberate ways, all collected here:

   1. Sans-serif for dictionary word content. Neither serif webfont (Source
      Serif 4, Noto Serif) carries kanji/kana/hanzi, so "serif" there only
      chose the browser's fallback CJK serif (Mincho/Ming) over its sans
      (Gothic): a real and less legible difference for CJK text, unlike for
      Latin scripts. This covers .sentence, .english-sentence, .definition-text,
      .word-gender, .word-list-english, .word-text-block, the Word Game prompt
      and the story-quiz source sentence.
   2. Adjacent clickable words get a 1px inline margin: CJK text has no spaces,
      so neighboring underlines would otherwise touch.
   3. The Word Game answer row has one column fewer (no letter-hint control).
   4. Inflection tables are a grid of <span> label/value pairs (see
      renderInflectionRows in scripts.js), not a <table>: the verb table runs
      to ~21 rows of short values, so four equal columns (two under 640px)
      avoid a long scroll. Equal-fr columns keep a long label from stretching
      wider than its value. The shared .inflections-table th/td rules simply do
      not match here.

   Generated from the previous per-language files: every declaration below is
   one whose value differed from the shared stylesheet. */

.clickable-definition-word {
  margin-inline: 1px;
}
.english-sentence {
  font-family: "Source Sans 3", "Noto Sans", sans-serif;
}
.game-cefr-spacer p {
  font-family: "Source Sans 3", "Noto Sans", sans-serif;
}
.game-teaching-sentence {
  font-family: "Source Sans 3", "Noto Sans", sans-serif;
}
.game-pronunciation {
  font-family: "Source Sans 3", "Noto Sans", sans-serif;
}
.game-typed-answer-row {
  grid-template-columns: minmax(0, 1fr) auto;
}
.game-word h2 {
  font-family: "Source Sans 3", "Noto Sans", sans-serif;
}

.sentence {
  font-family: "Source Sans 3", "Noto Sans", sans-serif;
}
.definition-text {
  font-family: "Source Sans 3", "Noto Sans", sans-serif;
}
.inflections-table {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  /* The shared stylesheet makes this a collapsed-border table; here it is a
     grid of spans, so restore the default. */
  border-collapse: separate;
}
.inflections-label, .inflections-value, .inflections-message {
  border: 1px solid var(--color-border);
  padding: 8px 10px;
  overflow-wrap: break-word;
}
.inflections-message {
  grid-column: 1 / -1;
}
.inflections-label {
  background-color: var(--color-surface-subtle);
  color: var(--color-text-faint);
  font-family: "Source Sans 3", "Noto Sans", sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.inflections-value {
  font-family: "Source Sans 3", "Noto Sans", sans-serif;
}
.story-quiz-feedback-source {
  font-family: "Source Sans 3", "Noto Sans", sans-serif;
}

@media (max-width: 640px) {
  .inflections-table {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.word-gender {
  font-family: "Source Sans 3", "Noto Sans", sans-serif;
}
.word-list-english {
  font-family: "Source Sans 3", "Noto Sans", sans-serif;
}
.word-text-block {
  font-family: "Source Sans 3", "Noto Sans", sans-serif;
}