/* Rapporteur interactif — styles autonomes (17/10/2026).
 * Chargé en même temps que rapporteur.js, sans dépendance à aucune autre
 * feuille de style du projet — EXPORTABLE vers la refonte à l'identique.
 * Couleurs neutres (ambre/bois), cohérentes avec les pages de devoir, mais
 * sans variable partagée : une page qui inclut ce fichier seul doit
 * s'afficher correctement.
 */
.rapporteur-conteneur {
  width: 100%;
  max-width: 420px;
  margin: 10px auto;
  touch-action: none;
  -webkit-tap-highlight-color: transparent;
}
/* Figure réduite sur petit téléphone (30/10/2026, correctif Wilson,
   Bilan de Toussaint 5-3 — voir moteur-devoir-note.js, renderQuestionExpression,
   aUnRapporteurAManipuler) : le SVG garde son ratio (viewBox 320×360,
   width:100%/height:auto), donc réduire la largeur max réduit aussi la
   hauteur — moins de défilement nécessaire pour atteindre le champ de
   réponse et le clavier maison sur un écran bas (ex. iPhone SE, 667px de
   haut). Sans effet sur un écran plus large/haut : la règle ci-dessus
   garde la main. */
@media (max-height: 700px) {
  .rapporteur-conteneur {
    max-width: 300px;
  }
}
.rapporteur-svg {
  width: 100%;
  height: auto;
  display: block;
  background: #fffdf6;
  border-radius: 14px;
  box-shadow: 0 2px 0 rgba(92, 61, 46, 0.12);
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}

/* Figure fixe */
.rapporteur-rayon-fixe {
  stroke: #5c3d2e;
  stroke-width: 2.5;
  stroke-linecap: round;
}
.rapporteur-rayon-construite {
  stroke: #2e8a98;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-dasharray: 1 0;
}
.rapporteur-sommet {
  /* Petite croix fine (18/10/2026, convention papier d'une extrémité de
     segment/d'un sommet) : deux tirets, jamais un disque plein — voir
     rapporteur.js, rendreFigure(). */
  stroke: #5c3d2e;
  stroke-width: 1.6;
  stroke-linecap: round;
}

/* Disque du rapporteur */
.rapporteur-corps {
  fill: rgba(79, 163, 209, 0.22);
  stroke: #2f7ba8;
  stroke-width: 1.5;
}
.rapporteur-zone-corps {
  fill: rgba(0, 0, 0, 0);
  stroke: none;
  cursor: grab;
  touch-action: none;
}
.rapporteur-base {
  stroke: #2f7ba8;
  stroke-width: 1.5;
}
.rapporteur-centre {
  fill: #e0a41e;
  stroke: #5c3d2e;
  stroke-width: 1;
  pointer-events: none;
}
.rapporteur-poignee {
  fill: #ffc93c;
  stroke: #5c3d2e;
  stroke-width: 1.5;
  cursor: grab;
  touch-action: none;
  pointer-events: none; /* la cible tactile réelle est .rapporteur-poignee-touche, juste dessous */
}
.rapporteur-poignee-touche {
  /* Cible tactile invisible, plus large que le disque visible (voir
     RAYON_POIGNEE_TOUCHE dans rapporteur.js — calibrée pour un diamètre
     ≥ 44 px même sur un écran étroit, 360 px, demande de Chafik 17/10/2026). */
  fill: rgba(0, 0, 0, 0);
  touch-action: none;
  cursor: grab;
}

.rapporteur-tick {
  stroke: #2f7ba8;
  stroke-width: 1;
  pointer-events: none;
}
.rapporteur-tick-majeure {
  stroke-width: 1.6;
  stroke: #1f5c78;
}
.rapporteur-label {
  /* Réduit le 18/10/2026 (test de Chafik : nombres trop gros, se
     chevauchent entre deux graduations voisines). */
  font-family: "Fredoka", system-ui, sans-serif;
  font-size: 6.5px;
  font-weight: 700;
  fill: #1f5c78;
  text-anchor: middle;
  dominant-baseline: middle;
  pointer-events: none;
}
.rapporteur-label-exterieure {
  fill: #a35a2e;
}

/* Bulle de choix (lecture intérieure / extérieure) */
.rapporteur-callout-fond {
  fill: #5c3d2e;
  opacity: 0.94;
}
.rapporteur-callout-choix {
  fill: #fffdf6;
  cursor: pointer;
  touch-action: none;
}
.rapporteur-callout-choix:active {
  fill: #ffe6bc;
}
.rapporteur-callout-texte {
  font-family: "Fredoka", system-ui, sans-serif;
  font-size: 13px;
  font-weight: 700;
  fill: #5c3d2e;
  text-anchor: middle;
  dominant-baseline: middle;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .rapporteur-conteneur * {
    transition: none !important;
  }
}