/* Readable mobile type. Keep the round, vocabulary and saved progress unchanged. */
@media (max-width:760px), (pointer:coarse) and (max-height:500px) {
  .compact-settings select,
  .compact-language { font-size:16px; }
  #settingsBtn { font-size:15px; }
  #settingsSummary { max-height:40px; line-height:1.25; }
  .mobile-round { font-size:16px; }
  .goal b { font-size:13px; }
  .scorebar small { font-size:11px; }
  .scorebar strong { font-size:24px; }
  .scorebar .time strong { font-size:25px; }
  .scorebar .time { min-width:64px!important; }

  .board .tile { color:#354f3e; gap:4px; padding:5px 3px; }
  .board .tile.t1 { color:#66511d; }
  .board .tile.t2 { color:#5f4875; }
  .board .tile.t3 { color:#7d4837; }
  .board .tile.t4 { color:#3a626e; }
  .board .tile.t5 { color:#556326; }
  .board .tile .ko,
  .board .tile.bilingual .ko { font-size:clamp(24px,7.2vw,30px); line-height:1.15; flex-shrink:0; }
  .board .tile[data-word-length="3"] .ko { font-size:clamp(20px,6.4vw,26px); }
  .board .tile[data-word-length="4"] .ko,
  .board .tile[data-word-length="5"] .ko,
  .board .tile .ko.long { font-size:clamp(18px,5.9vw,24px); line-height:1.12; }
  .board .tile .zh,
  .board .tile .zh.long,
  .board .tile .zh:lang(zh-Hans) { font-size:17px; line-height:1.3; -webkit-line-clamp:4; overflow-wrap:anywhere; }
  .board .tile .tile-translation,
  .board .tile .tile-translation:lang(zh-Hans) {
    font-size:16px; line-height:1.25; max-height:40px; -webkit-line-clamp:2;
    opacity:1; color:inherit; letter-spacing:0; overflow-wrap:anywhere;
  }
  .board .tile .affix-example { font-size:14px; line-height:1.2; opacity:1; letter-spacing:0; }
  .board .tile[data-word-length="4"] .tile-translation,
  .board .tile[data-word-length="5"] .tile-translation,
  .board .tile[data-word-length="6"] .tile-translation { -webkit-line-clamp:1; max-height:20px; }
  .board .tile .speaker { width:32px; height:32px; }
  .board-actions { grid-template-columns:1.2fr 1fr 1fr 1fr; }
  .board-actions button { font-size:15px; line-height:1.2; padding:3px 2px; }
  .board-actions small { font-size:12px; }
  #hintBtn { position:relative; padding-right:18px; }
  #hintBtn small { position:absolute; right:3px; top:50%; transform:translateY(-50%); margin:0; }
  .word-ribbon strong,
  .word-ribbon strong.learned { font-size:18px; }
  .word-ribbon p,
  .word-ribbon p:lang(zh-Hans) { font-size:15px; color:#56694d; }
  .word-ribbon:not(.has-word) strong { font-size:14px; color:#687a5b; }

  .start-card p { font-size:16px; line-height:1.5; color:#5e7053; }
  .start-card .primary-button { font-size:18px; }
  .start-card>small { font-size:14px; color:#5e7053; }
  .settings-dialog .setting-label { font-size:16px; color:#5e7053; }
  .settings-dialog .edition-switch button,
  .settings-dialog .edition-switch button b,
  .settings-dialog .mode-switch button,
  .settings-dialog .settings-links button { font-size:16px; }
  .settings-dialog .settings-note { font-size:15px; line-height:1.5; color:#5e7053; }
  .settings-dialog #doneSettings,
  .pause-dialog #continueGameBtn { font-size:18px; }
  .settings-dialog .level-progress-strip span,
  .settings-dialog #levelMapBtn,
  .settings-dialog .supplement-controls button { font-size:15px; color:#536c48; }
  .pause-dialog p { font-size:16px; line-height:1.6; color:#5e7053; }
  .dialog-copy,.word-detail,.word-entry p,.result-dialog p { font-size:16px; }
  .word-entry b { font-size:24px; }
  .word-entry small,.word-count { font-size:14px; }
  .word-search { font-size:16px; }
  .toast { font-size:15px; }

  /* Small or landscape cards keep a readable word and one line of meaning.
     The existing word ribbon opens the full meaning without shrinking it. */
  @container (max-height:84px) {
    .board .tile .tile-translation,.board .tile .tile-translation:lang(zh-Hans) { -webkit-line-clamp:1; max-height:20px; }
    .board .tile .zh,.board .tile .zh.long,.board .tile .zh:lang(zh-Hans) { -webkit-line-clamp:3; font-size:16px; }
    .board .tile .affix-example { display:none; }
  }
  @container (max-height:66px) {
    .board .tile .ko,.board .tile.bilingual .ko { font-size:24px; line-height:1.05; }
    .board .tile[data-word-length="3"] .ko { font-size:20px; }
    .board .tile[data-word-length="4"] .ko,.board .tile[data-word-length="5"] .ko,.board .tile .ko.long { font-size:18px; line-height:1.05; }
    .board .tile .tile-translation,.board .tile .tile-translation:lang(zh-Hans) { font-size:14px; line-height:1.2; max-height:17px; }
    .board .tile .zh,.board .tile .zh.long,.board .tile .zh:lang(zh-Hans) { font-size:15px; line-height:1.15; -webkit-line-clamp:3; }
  }
}
@media (max-width:350px), (pointer:coarse) and (max-height:500px) {
  .board .tile,.board.affix-board .tile { padding:1px 3px; gap:1px; border-bottom-width:3px; }
  .board,.board.affix-board { gap:6px; }
  .board-actions button { font-size:14px; }
  .scorebar { gap:5px; }
  .goal b { font-size:12px; }
  .scorebar small { font-size:10px; }
  .scorebar strong { font-size:22px; }
  .scorebar .time strong { font-size:23px; }
  .compact-settings label { padding:0 4px; }
  #settingsBtn { gap:4px; padding-left:4px; padding-right:4px; }
  #settingsBtn svg { width:16px; }
}
