/* ══════════════════════════════════════════════════════════════
   HospiPlay — Confort de lecture
   ──────────────────────────────────────────────────────────────
   N'agit que sur les blocs de texte long. Les boutons, titres et
   étiquettes gardent leur taille : agrandir toute l'interface
   déformerait la mise en page et les cartes des modules.
══════════════════════════════════════════════════════════════ */

:root{ --hp-txt:1; --hp-esp:normal; --hp-lh:inherit; }

html[data-hp-taille="grand"]      { --hp-txt:1.15; }
html[data-hp-taille="tres-grand"] { --hp-txt:1.32; }
html[data-hp-espace="aere"]       { --hp-esp:.05em; }
html[data-hp-lignes="aere"]       { --hp-lh:2.1; }

/* ── Blocs de lecture : modules immersifs ──────────────────── */
html[data-hp-taille] .ham-narration-text  { font-size:calc(clamp(14px,2.8vw,16px) * var(--hp-txt)); }
html[data-hp-taille] .ham-result-body     { font-size:calc(13px * var(--hp-txt)); }
html[data-hp-taille] .ham-has-text        { font-size:calc(12px * var(--hp-txt)); }
html[data-hp-taille] .ham-dilemma         { font-size:calc(14px * var(--hp-txt)); }
html[data-hp-taille] .ham-patient-thought { font-size:calc(14px * var(--hp-txt)); }
html[data-hp-taille] .ham-has-attendu-item{ font-size:calc(12px * var(--hp-txt)); }
html[data-hp-taille] .ham-lecon-body      { font-size:calc(13px * var(--hp-txt)); }
html[data-hp-taille] .ham-choice-text     { font-size:calc(13px * var(--hp-txt)); }

/* ── Blocs de lecture : quiz du jour ───────────────────────── */
html[data-hp-taille] .q-text              { font-size:calc(17px * var(--hp-txt)); }
html[data-hp-taille] .expl-text           { font-size:calc(13px * var(--hp-txt)); }
html[data-hp-taille] .preuve-text         { font-size:calc(13px * var(--hp-txt)); }

/* ── Espacement des lettres et des lignes ──────────────────── */
html[data-hp-espace] .ham-narration-text,
html[data-hp-espace] .ham-result-body,
html[data-hp-espace] .ham-has-text,
html[data-hp-espace] .ham-dilemma,
html[data-hp-espace] .ham-patient-thought,
html[data-hp-espace] .ham-lecon-body,
html[data-hp-espace] .ham-choice-text,
html[data-hp-espace] .q-text,
html[data-hp-espace] .expl-text,
html[data-hp-espace] .preuve-text { letter-spacing:var(--hp-esp); word-spacing:.12em; }

html[data-hp-lignes] .ham-narration-text,
html[data-hp-lignes] .ham-result-body,
html[data-hp-lignes] .ham-has-text,
html[data-hp-lignes] .ham-lecon-body,
html[data-hp-lignes] .q-text,
html[data-hp-lignes] .expl-text,
html[data-hp-lignes] .preuve-text { line-height:var(--hp-lh); }

/* ── Bouton et panneau ─────────────────────────────────────── */
.hp-lect-wrap{position:fixed;right:14px;bottom:14px;z-index:900;
  display:flex;flex-direction:column;align-items:flex-end;gap:8px;}
.hp-lect-btn{width:48px;height:48px;border-radius:50%;cursor:pointer;
  border:1px solid rgba(255,255,255,.25);background:rgba(12,20,32,.94);color:#fff;
  font-family:'Outfit',sans-serif;font-size:17px;font-weight:800;
  box-shadow:0 6px 20px rgba(0,0,0,.35);}
.hp-lect-btn:hover{background:rgba(24,38,58,.96);}
.hp-lect-btn:focus-visible{outline:3px solid #63B3ED;outline-offset:2px;}

.hp-lect-panel{order:-1;width:min(280px,calc(100vw - 28px));padding:16px;
  border-radius:14px;border:1px solid rgba(255,255,255,.16);
  background:rgba(10,16,26,.98);box-shadow:0 12px 34px rgba(0,0,0,.45);
  font-family:'Outfit',sans-serif;color:#EAF2FF;}
.hp-lect-panel[hidden]{display:none;}
.hp-lect-groupe{margin-bottom:14px;}
.hp-lect-titre{display:block;font-size:11px;font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;color:#8FA6C4;margin-bottom:7px;}
.hp-lect-choix{display:flex;flex-wrap:wrap;gap:6px;}
.hp-lect-opt{min-height:40px;padding:8px 12px;border-radius:9px;cursor:pointer;
  border:1px solid rgba(255,255,255,.18);background:transparent;color:#EAF2FF;
  font-size:13px;font-weight:700;font-family:inherit;}
.hp-lect-opt[aria-pressed="true"]{background:rgba(0,229,160,.16);
  border-color:rgba(0,229,160,.5);color:#00E5A0;}
.hp-lect-opt:focus-visible{outline:3px solid #63B3ED;outline-offset:2px;}
.hp-lect-raz{width:100%;min-height:40px;margin-top:2px;border-radius:9px;cursor:pointer;
  border:1px solid rgba(255,255,255,.12);background:transparent;color:#8FA6C4;
  font-size:12px;font-weight:700;font-family:inherit;}
.hp-lect-raz:hover{color:#EAF2FF;}

/* Le réglage n'a pas de sens à l'impression ni en projection figée. */
@media print{ .hp-lect-wrap{display:none;} }
