@charset "utf-8";
/* CSS Document */


  #jeu-container {
    width: 50em;
    margin: 0 auto;
    padding: 1em;
    background: #f7f3f3;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
	
	 text-align: left; /* force l'alignement à gauche pour le contenu */
  }
  #jeu .mot { margin:1em 0; }
  #jeu .clue { margin-bottom:0.5em; font-weight:bold; }
  #jeu .grille { display:flex; gap:0.2em; flex-wrap:wrap; margin-bottom:0.5em; align-items:center; }

  /* Carrés lettres et articles */
  #jeu .lettre {
    width:2em; height:2em;
    text-align:center;
    font-size:1.2em;
    text-transform:uppercase;
    border:2px solid black;
    border-radius:4px;
    font-weight:bold;
    background:white;
  }
  #jeu .lettre.correct { background:#c2f0c2; }
  #jeu .lettre.wrong { background:#f8d0d0; }
  #jeu .lettre.article { background:#add8e6; }

  /* Espace vide si pas d'article ou entre article et mot */
  #jeu .vide { width:2em; height:2em; }

  #jeu-container button {
    margin-top:0.5em;
    padding:0.5em 1em;
    font-size:1em;
    background:#b23c3c;
    color:white;
    border:none;
    border-radius:6px;
    cursor:pointer;
  }
  #jeu-container button:hover { background:#921e1e; }

  #solutions ul { padding-left: 1.2em; }

  @media (max-width: 600px) {
    #jeu-container { width: 95%; padding:0.5em; text-align:left; }
    #jeu .lettre, #jeu .vide { width:1.8em; height:1.8em; font-size:1em; }
  }