.french-game-shell {
      background: #f2f4f8;
      padding: 1px 12px 20px;
      border-radius: 12px;
    }

    #fr-vocab-game {
      max-width: 520px;
      margin: 20px auto;
      font-family: system-ui, sans-serif;
    }

    #fr-vocab-game h2 {
      text-align: center;
      margin-bottom: 0.2rem;
    }
    #fr-vocab-game > p {
      text-align: center;
      margin-top: 0;
      color: #555;
    }

    .switcher {
      display: flex;
      justify-content: center;
      margin-bottom: 15px;
      gap: 8px;
      flex-wrap: wrap;
    }

    .switcher button {
      padding: 6px 10px;
      border-radius: 8px;
      border: 1px solid #aaa;
      cursor: pointer;
      background: #fff;
      font-size: 0.9rem;
    }

    .switcher .active {
      background: #007bff;
      color: white;
      border-color: #007bff;
    }

    .game-card {
      border-radius: 16px;
      padding: 16px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.08);
      background: #fff;
    }

    #question-area {
      text-align: center;
      margin-bottom: 12px;
    }
    #word-type {
      font-size: 0.9rem;
      color: #777;
      margin-bottom: 4px;
    }
    #question-word {
      font-size: 1.3rem;
      font-weight: 600;
      margin-bottom: 4px;
    }
    #sentence-built {
      min-height: 24px;
      font-size: 1.05rem;
      margin-bottom: 4px;
    }
    #question-count {
      font-size: 0.9rem;
      color: #777;
      margin-bottom: 8px;
    }

    #answers-container {
      display: grid;
      grid-template-columns: 1fr;
      gap: 8px;
      margin-bottom: 10px;
    }

    #answers-container button {
      padding: 8px 10px;
      border-radius: 999px;
      border: 1px solid #ccc;
      background: #f8f8f8;
      cursor: pointer;
      font-size: 0.95rem;
      text-align: left;
    }

    #answers-container button.correct {
      background: #d4edda;
      border-color: #28a745;
    }
    #answers-container button.wrong {
      background: #f8d7da;
      border-color: #dc3545;
    }
    #answers-container button.used {
      opacity: 0.6;
    }

    #reset-sentence-button {
      display: none;
      margin-bottom: 8px;
      width: 100%;
      border-radius: 999px;
      border: 1px solid #ccc;
      background: #eee;
      padding: 8px;
      font-size: 0.9rem;
      cursor: pointer;
    }

    #feedback {
      min-height: 22px;
      text-align: center;
      font-weight: 500;
      margin-bottom: 6px;
    }

    #next-button {
      width: 100%;
      padding: 10px;
      border-radius: 999px;
      border: none;
      font-size: 1rem;
      cursor: pointer;
      background: #007bff;
      color: #fff;
    }

    #next-button[disabled] {
      opacity: 0.4;
      cursor: default;
    }

    #score-area {
      text-align: center;
      margin-top: 8px;
      color: #333;
      font-size: 0.9rem;
    }

    @media (min-width: 600px) {
      #answers-container {
        grid-template-columns: 1fr 1fr;
      }
    }
  

/* WordPress plugin v2: force readable colours inside the French trainer */
#french-game,
#french-game *,
.french-game,
.french-game * {
  box-sizing: border-box;
}

#french-game,
.french-game {
  color: #1f2937 !important;
}

#french-game h1,
#french-game h2,
#french-game h3,
#french-game h4,
#french-game p,
#french-game div,
#french-game span,
#french-game label,
.french-game h1,
.french-game h2,
.french-game h3,
.french-game h4,
.french-game p,
.french-game div,
.french-game span,
.french-game label {
  color: #1f2937;
}

#french-game .subtitle,
#french-game .hint,
#french-game .type,
#french-game .counter,
#french-game .score,
.french-game .subtitle,
.french-game .hint,
.french-game .type,
.french-game .counter,
.french-game .score {
  color: #5f6368 !important;
}

/* Answer choices: dark text on white/light background */
#french-game button:not(.active),
.french-game button:not(.active) {
  color: #1f2937 !important;
}

/* Blue active mode / primary buttons keep white text */
#french-game button.active,
#french-game .active,
#french-game .primary,
#french-game .next-btn,
.french-game button.active,
.french-game .active,
.french-game .primary,
.french-game .next-btn {
  color: #ffffff !important;
}

/* Game heading should be dark, not inherited white from the site theme */
#french-game .title,
#french-game h1,
#french-game h2,
.french-game .title,
.french-game h1,
.french-game h2 {
  color: #202938 !important;
}

/* Correct/wrong states stay readable */
#french-game .correct,
.french-game .correct { color: #166534 !important; }
#french-game .wrong,
.french-game .wrong { color: #991b1b !important; }


/* V3: selectors match the ACTUAL plugin markup (#fr-vocab-game).
   Force colours against aggressive dark-theme button/text rules. */
.french-game-shell,
.french-game-shell #fr-vocab-game {
  color:#202938 !important;
}
.french-game-shell #fr-vocab-game h2 {
  color:#202938 !important;
}
.french-game-shell #fr-vocab-game > p {
  color:#555f6d !important;
}
.french-game-shell #word-type,
.french-game-shell #question-count {
  color:#667085 !important;
}
.french-game-shell #question-word,
.french-game-shell #sentence-built,
.french-game-shell #feedback,
.french-game-shell #score-area,
.french-game-shell #score-text {
  color:#202938 !important;
}
.french-game-shell #answers-container button {
  color:#202938 !important;
  -webkit-text-fill-color:#202938 !important;
  opacity:1 !important;
  background:#f8f8f8 !important;
}
.french-game-shell #answers-container button.correct {
  color:#14532d !important;
  -webkit-text-fill-color:#14532d !important;
  background:#d4edda !important;
}
.french-game-shell #answers-container button.wrong {
  color:#7f1d1d !important;
  -webkit-text-fill-color:#7f1d1d !important;
  background:#f8d7da !important;
}
.french-game-shell .switcher button {
  color:#202938 !important;
  -webkit-text-fill-color:#202938 !important;
  opacity:1 !important;
}
.french-game-shell .switcher button.active {
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  background:#007bff !important;
}
.french-game-shell #next-button {
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}
.french-game-shell #next-button[disabled] {
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  opacity:.4 !important;
}

/* V5 - protect trainer from RobsDrops dark theme */
.french-game-shell #fr-vocab-game{background:#f1f4f9!important;color:#1f2937!important}
.french-game-shell #fr-vocab-game .quiz-card{background:#fff!important;color:#1f2937!important;border-color:#e1e6ee!important}
.french-game-shell #word-type,.french-game-shell #question-word,.french-game-shell #question-count,.french-game-shell #score-area,.french-game-shell #score-text,.french-game-shell #feedback{color:#1f2937!important;-webkit-text-fill-color:#1f2937!important}
.french-game-shell #word-type,.french-game-shell #question-count{color:#667085!important;-webkit-text-fill-color:#667085!important}
.french-game-shell #answers-container button{background:#f8fafc!important;color:#172033!important;-webkit-text-fill-color:#172033!important;border:1px solid #cfd6e1!important;opacity:1!important}
.french-game-shell #next-button{background:#2383ee!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
.french-game-shell #next-button:disabled{background:#8fc3f8!important;color:#fff!important;-webkit-text-fill-color:#fff!important;opacity:1!important}


/* V6 — remove RobsDrops theme's decorative giant tick from quiz feedback */
.french-game-shell #fr-vocab-game .game-card::before,
.french-game-shell #fr-vocab-game .game-card::after,
.french-game-shell #fr-vocab-game .quiz-card::before,
.french-game-shell #fr-vocab-game .quiz-card::after,
.french-game-shell #feedback::before,
.french-game-shell #feedback::after,
.french-game-shell #feedback.correct::before,
.french-game-shell #feedback.correct::after,
.french-game-shell .correct:not(button)::before,
.french-game-shell .correct:not(button)::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Ensure feedback itself remains a simple text line */
.french-game-shell #feedback {
    min-height: 24px !important;
    height: auto !important;
    padding: 6px 0 !important;
    margin: 0 !important;
    background: transparent !important;
    font-size: 1rem !important;
    line-height: 1.35 !important;
    text-align: center !important;
    transform: none !important;
}


/* V6.1 readability + theme isolation */
.french-game-shell,
.french-game-shell #fr-vocab-game,
.french-game-shell #fr-vocab-game * {
    text-shadow: none !important;
}

.french-game-shell > h1,
.french-game-shell > h2,
.french-game-shell .french-game-title,
.french-game-shell #fr-vocab-game h1,
.french-game-shell #fr-vocab-game h2,
.french-game-shell #fr-vocab-game h3 {
    color: #172033 !important;
    -webkit-text-fill-color: #172033 !important;
    opacity: 1 !important;
}

.french-game-shell #fr-vocab-game {
    background: #eef2f7 !important;
    color: #172033 !important;
}

.french-game-shell #fr-vocab-game .game-card,
.french-game-shell #fr-vocab-game .quiz-card {
    background: #ffffff !important;
    color: #172033 !important;
    opacity: 1 !important;
}

.french-game-shell #question-word {
    color: #111827 !important;
    -webkit-text-fill-color: #111827 !important;
    opacity: 1 !important;
}

.french-game-shell #word-type,
.french-game-shell #question-count,
.french-game-shell #score-text,
.french-game-shell #score-area,
.french-game-shell #feedback {
    opacity: 1 !important;
}

.french-game-shell #feedback {
    color: #344054 !important;
    -webkit-text-fill-color: #344054 !important;
}

/* Absolutely suppress decorative pseudo-elements injected by the theme. */
.french-game-shell #fr-vocab-game [class*="correct"]:not(button)::before,
.french-game-shell #fr-vocab-game [class*="correct"]:not(button)::after,
.french-game-shell #fr-vocab-game [class*="success"]:not(button)::before,
.french-game-shell #fr-vocab-game [class*="success"]:not(button)::after {
    content: none !important;
    display: none !important;
}