/* Confort tactile — chargé par toutes les pages.
   Écrans tactiles : zones cliquables d'au moins 36 px (les doigts ne sont pas des curseurs).
   Petites largeurs : texte jamais sous 11 px. Rien ne change sur un ordinateur à souris et grand écran. */

@media (pointer: coarse) {
  button,
  select,
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="file"]),
  summary,
  [role="button"] {
    min-height: 36px;
  }

  /* Croix de fermeture : une cible de 13 px est quasi impossible à toucher. */
  #recruit-close, #quest-close, .modal-close, .popup-close, [class*="close-btn"], button[aria-label="Fermer"] {
    min-width: 40px;
    min-height: 40px;
  }

  /* Liens en ligne dans les textes (bâtiments cités dans les recherches, etc.) : zone élargie sans changer la mise en page. */
  a.b-link {
    display: inline-block;
    padding: 9px 4px;
    margin: -9px -4px;
  }

  /* Cases à cocher et boutons radio : zone d'appui élargie par leur libellé. */
  label { min-height: 28px; }
}

@media (max-width: 768px) {
  /* Étiquettes et compteurs qui descendaient à 10 px. */
  .unit-type-badge,
  .doctrine-branch,
  .tech-civ,
  #weather-countdown,
  .b-lv,
  .resource .cap,
  .resource .rate {
    font-size: 11px;
  }
}

/* Petits écrans : les boutons flottants (aide « ? », chat, son) couvraient les boutons d'action des fenêtres
   (« Annuler », « Recruter »…). Tant qu'une fenêtre est ouverte, ils s'effacent. */
@media (max-width: 768px) {
  body:has(.modal-backdrop.show) #hp-btn,
  body:has(.modal-backdrop.show) #chat-toggle,
  body:has(.modal-backdrop.show) #chat-panel,
  body:has(.modal-backdrop.show) #imp-audio-widget {
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s;
  }
}