/* LES OPTIONS D'UNE RÉPONSE D'IA — le « … », son menu, et la fenêtre du signalement (voir `options-reponse.js`).
   Chargée par `layouts/jeu`, où vivent les trois surfaces : l'accueil de l'Enfant, la pastille des guides, le fil du
   mentor. Le « … » prend la couleur de la bulle (`currentColor`), discret jusqu'au survol ou au focus ; sa cible de
   toucher fait 44 px, rattrapés par des marges négatives pour ne pas agrandir la bulle. Menu et fenêtre sont clairs. */
.pz-options-reponse{position:relative;display:flex;justify-content:flex-end;margin-top:2px}
.pz-options-reponse-bouton{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;margin:-10px -12px -14px 0;padding:0;border:0;border-radius:50%;background:transparent;color:inherit;opacity:.55;font:inherit;line-height:1;cursor:pointer}
/* ⚠️ LA TAILLE EST SUR LE GLYPHE, pas sur le bouton : l'accueil de l'Enfant dessine tout bouton par un identifiant
   (`#pz-immateria-home button`, 16 px), qui l'emporte sur une classe. Le `span` du « … », lui, n'y est pas visé. */
.pz-options-reponse-bouton>span{font-size:20px;font-weight:700;letter-spacing:.04em}
.pz-options-reponse-bouton:hover,.pz-options-reponse-bouton[aria-expanded="true"]{opacity:1}
.pz-options-reponse-bouton:focus-visible{opacity:1;outline:2px solid #9d2877;outline-offset:-4px}
.pz-options-reponse-menu{position:absolute;right:0;top:100%;z-index:60;width:max-content;min-width:210px;max-width:min(290px,80vw);margin-top:2px;padding:6px;border:1px solid #e3d6de;border-radius:12px;background:#fff;color:#2a1d26;box-shadow:0 10px 30px rgba(36,18,28,.18);text-align:left;font-size:15px;font-weight:400;line-height:1.4;letter-spacing:normal;text-transform:none}
.pz-options-reponse-menu[hidden]{display:none}
.pz-options-reponse-item{display:block;width:100%;min-height:44px;padding:10px 12px;border:0;border-radius:8px;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.pz-options-reponse-item:hover{background:#f6eef4}
.pz-options-reponse-item:focus-visible{outline:2px solid #9d2877;outline-offset:-2px}
/* (0,3,1) : la pastille des guides dessine `.pz-guide-panel .message p` (0,2,1), chargée APRÈS cette feuille. */
.pz-options-reponse .pz-options-reponse-menu p.pz-options-reponse-note{margin:0;padding:10px 12px;color:#5c4f58;font-size:14px}

/* La fenêtre du signalement : un `<dialog>` modal, au-dessus de tout (aucun fil qui défile ne la rogne). Sous 560 px,
   une feuille qui monte du bas, comme les fenêtres d'Échanges. */
.pz-signalement-ia{box-sizing:border-box;width:min(420px,calc(100vw - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:22px 22px 18px;border:0;border-radius:18px;background:#fff;color:#2a1d26;box-shadow:0 18px 50px rgba(36,18,28,.28);font:15px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif;text-align:left}
.pz-signalement-ia::backdrop{background:rgba(36,18,28,.45)}
.pz-signalement-ia-titre{margin:0 0 8px;font-size:19px;font-weight:700;line-height:1.25}
.pz-signalement-ia-info{margin:0 0 14px;color:#5c4f58;font-size:14px}
.pz-signalement-ia-info a{color:#84216c;text-decoration:underline}
.pz-signalement-ia-motifs{margin:0 0 6px;padding:0;border:0;min-width:0}
.pz-signalement-ia-motifs legend{padding:0 0 4px;font-size:14px;font-weight:600}
.pz-signalement-ia-motif{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 8px;border-radius:10px;cursor:pointer}
.pz-signalement-ia-motif:hover{background:#f6eef4}
.pz-signalement-ia-motif input{width:20px;height:20px;margin:0;flex:none;accent-color:#84216c}
.pz-signalement-ia-etat{min-height:1.45em;margin:4px 0 10px;color:#5c4f58;font-size:14px}
.pz-signalement-ia-etat:empty{margin:0;min-height:0}
.pz-signalement-ia-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.pz-signalement-ia-actions button{min-height:44px;padding:0 18px;border-radius:99px;font:inherit;font-weight:600;cursor:pointer}
.pz-signalement-ia-annuler{border:1px solid #d1becb;background:#fff;color:#84216c}
.pz-signalement-ia-envoi{border:1px solid #84216c;background:#84216c;color:#fff}
.pz-signalement-ia-envoi:disabled{border-color:#d9cdd4;background:#e9e1e6;color:#8d7f88;cursor:default}
.pz-signalement-ia-envoi[hidden]{display:none}
.pz-signalement-ia-actions button:focus-visible,.pz-signalement-ia-motif input:focus-visible,.pz-signalement-ia-info a:focus-visible{outline:2px solid #9d2877;outline-offset:2px}
@media(max-width:560px){
  .pz-signalement-ia{width:100%;max-width:100%;margin:auto 0 0;border-radius:18px 18px 0 0;padding-bottom:calc(18px + env(safe-area-inset-bottom,0px))}
  .pz-signalement-ia-actions button{flex:1 1 auto}
}
