/* Jeux de révision libre (« Associer », « Choix multiple ») : moteur js/jeux.js, commun aux langues.
   Hébreu : onglet « Jeux » (js/hebreu-jeux.js). Affichage seulement. Chargé avant css/tactile-paysage.css. */

/* Choix du jeu, toujours visible (hors des Réglages repliés) */
.jx-mode{display:flex;gap:4px;padding:4px;margin:0 0 12px;background:#dde7ec;border-radius:14px;max-width:560px}
.jx-mode button{flex:1;min-width:0;min-height:44px;border:0;border-radius:10px;background:transparent;color:#4d5d6c;
  font-weight:700;padding:8px 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jx-mode button.on{background:#fff;color:#143d55;box-shadow:0 2px 8px #24324d18}

/* Réglages */
.jx-controls{grid-template-columns:repeat(4,minmax(0,1fr))}
.jx-controls select{width:100%;max-width:100%}
.jx-controls [hidden]{display:none!important}
@media(max-width:900px){.jx-controls{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.jx-controls{grid-template-columns:1fr}}

/* Zone de jeu */
.jx-zone{padding:18px 18px 20px;min-height:360px;display:block}
.jx-head{display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-weight:650;font-size:.9rem}
.jx-score{color:#107064}
.jx-he{font-family:"SBL Hebrew","Ezra SIL","Times New Roman",serif;font-weight:400;unicode-bidi:plaintext;color:#3b2a14}
.jx-zone [dir="auto"]{unicode-bidi:plaintext}

/* Écran de départ */
.jx-ready{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;min-height:320px;padding:10px}
.jx-ready-t{margin:0;font-size:1.35rem;font-weight:700;color:#143d55}
.jx-ready-s{margin:0;max-width:520px;color:var(--ink);line-height:1.45}
.jx-go{min-height:52px;min-width:220px;font-size:1.05rem;border-radius:14px;margin-top:6px}
.jx-note{margin:6px 0 0;font-size:.84rem;color:var(--muted);max-width:460px}

/* Choix multiple */
.jx-q{text-align:center;padding:22px 6px 20px;font-size:clamp(1.15rem,3.6vw,1.5rem);font-weight:700;line-height:1.4;overflow-wrap:anywhere}
.jx-q.jx-he{font-size:clamp(2.4rem,10vw,3.6rem);line-height:1.35}
.jx-opts{display:grid;gap:10px;max-width:640px;margin:0 auto}
.jx-opt{display:flex;align-items:center;gap:12px;min-height:58px;padding:10px 14px;text-align:left;border-radius:14px;
  font-weight:600;line-height:1.35;color:var(--ink);background:#fff}
.jx-opt:disabled{cursor:default;opacity:1;color:var(--ink)}
.jx-num{flex:0 0 auto;display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#eef3f6;color:#4d5d6c;font-size:.82rem}
.jx-txt{flex:1;min-width:0;overflow-wrap:anywhere}
.jx-txt.jx-he{font-size:1.75rem;line-height:1.35;text-align:right}
.jx-opt.ok{background:#e3f4ee;border-color:#107064;color:#0b4f46}
.jx-opt.ok .jx-num{background:#107064;color:#fff}
.jx-opt.ko{background:#fdecea;border-color:#c62828;color:#8e1c1c}
.jx-opt.ko .jx-num{background:#c62828;color:#fff}
.jx-fb{max-width:640px;margin:12px auto 0;min-height:1.4em;font-weight:650;line-height:1.45}
.jx-fb.is-ok{color:#0b5d52}
.jx-fb.is-ko{color:#9a2a1c}
.jx-info{display:block;margin-top:4px;font-weight:500;font-size:.86rem;color:var(--muted);overflow-wrap:anywhere}
.jx-next{display:block;width:100%;max-width:640px;min-height:50px;margin:12px auto 0;border-radius:14px}
.jx-next[hidden]{display:none}

/* Associer */
.jx-help{margin:6px 0 12px;font-size:.86rem;color:var(--muted)}
.jx-assoc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:10px}
.jx-col{display:flex;flex-direction:column;gap:8px;min-width:0}
.jx-tile{min-height:56px;padding:8px 10px;border-radius:14px;background:#fff;color:var(--ink);font-weight:600;
  line-height:1.3;text-align:center;overflow-wrap:anywhere;transition:background .15s,opacity .2s}
.jx-tile.jx-he{font-size:1.65rem;line-height:1.3}
.jx-tile.sel{background:#e5f0f4;border-color:var(--accent);box-shadow:inset 0 0 0 2px var(--accent)}
.jx-tile.ok{background:#e3f4ee;border-color:#9fd3c3;color:#0b4f46;opacity:.5;cursor:default}
.jx-tile.ok:disabled{opacity:.5}
.jx-tile.ko{background:#fdecea;border-color:#c62828;animation:jx-shake .3s}
@keyframes jx-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
@media (prefers-reduced-motion:reduce){.jx-tile.ko{animation:none}}

/* Fin de série */
.jx-end{max-width:640px;margin:0 auto;text-align:center;padding:10px 0}
.jx-end-t{margin:4px 0;font-size:1.4rem;font-weight:700;color:#143d55}
.jx-end-s{margin:0 0 12px;font-weight:650}
.jx-end-h{margin:14px 0 6px;text-align:left;font-weight:700;color:#8b4d08}
.jx-miss{list-style:none;margin:0;padding:0;text-align:left;display:grid;gap:6px}
.jx-miss li{padding:8px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;line-height:1.4;overflow-wrap:anywhere}
.jx-miss .jx-he{font-size:1.3rem}
.jx-miss-arrow{color:var(--muted)}
.jx-end-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:16px}
.jx-end-actions button{flex:1 1 40%;min-height:48px;border-radius:12px}
.jx-end-actions .primary{flex-basis:100%}

@media (max-width:480px){
  .jx-zone{padding:12px 10px 16px}
  .jx-assoc{gap:8px}
  .jx-tile{font-size:.9rem;padding:8px 6px}
  .jx-tile.jx-he{font-size:1.4rem}
  .jx-opt{padding:10px 10px;gap:10px}
}

