/* Ajustements au thème reveal.js : thème unique 16:9, lisible depuis le fond de l'amphi. */

.reveal { font-size: 40px; }
.reveal h1 { font-size: 2em; }
.reveal h2 { font-size: 1.5em; }
.reveal ul, .reveal ol { display: block; margin-left: 1.2em; }
.reveal .notes { display: none; }

/* Sections « libres » : positionnement absolu dans la scène 1920×1080 (PowerPoint converti, éditeur). */
.reveal .slides section.libre { width: 1920px; height: 1080px; padding: 0; text-align: left; top: 0 !important; }
.reveal .slides section.libre > .el { position: absolute; margin: 0; box-sizing: border-box; overflow: hidden; }
.reveal .slides section.libre > .el.texte { overflow: visible; } /* PowerPoint laisse déborder le texte plutôt que de le couper */
.reveal .slides section.libre > .el.texte p, .reveal .slides section.libre > .el.texte ul, .reveal .slides section.libre > .el.texte ol { margin: 0 0 .3em; }
.reveal .slides section.libre > .el.texte ul, .reveal .slides section.libre > .el.texte ol { margin-left: 1.2em; }
.reveal .slides section.libre > .el.texte h1, .reveal .slides section.libre > .el.texte h2, .reveal .slides section.libre > .el.texte h3 { margin: 0; text-transform: none; }
.reveal .slides section.libre > img.el { max-width: none; max-height: none; object-fit: contain; }
.reveal .slides section.libre > .el.iframe, .reveal .slides section.libre > .el.video { border: 0; }
.reveal .slides section.libre > .el iframe { width: 100%; height: 100%; border: 0; }
.reveal .slides section.libre > .el.declencheur { pointer-events: none; background: transparent; } /* fragment invisible qui lance la cérémonie du classement */

/* Rôle obs : aucune animation d'aucune sorte, les deux rendus doivent être simultanés. */
html[data-role="obs"] .reveal .slides section,
html[data-role="obs"] .reveal .slides section .fragment { transition: none !important; }

/* Rôle remote : miniature dans la télécommande, pas de curseur ni de sélection. */
html[data-role="remote"], html[data-role="remote"] body { margin: 0; width: 100%; height: 100%; background: #000; overflow: hidden; }
html[data-role="remote"] .reveal { width: 100vw; height: 100vh; pointer-events: none; user-select: none; }

/* Diapositives de quiz standard */
.reveal section.quiz .quiz-grille { display: grid; grid-template-columns: 1fr 1.2fr; gap: 40px; align-items: start; text-align: left; height: 920px; }
.reveal section.quiz h2 { font-size: 1.2em; text-align: left; text-transform: none; }
.reveal section.quiz .quiz-options { font-size: .9em; list-style: upper-alpha; }
.reveal section.quiz .quiz-emojis { font-size: 2em; display: flex; flex-wrap: wrap; gap: .4em; }
.reveal section.quiz .quiz-aide { font-size: .8em; opacity: .7; }
.reveal .quiz-resultats { width: 100%; height: 100%; border: 0; background: transparent; }
.reveal .quiz-qr { display: flex; align-items: center; gap: 24px; margin-top: 30px; }
.reveal .quiz-qr img { width: 260px; height: 260px; image-rendering: pixelated; }
.reveal .quiz-url { font-family: ui-monospace, monospace; font-size: .8em; overflow-wrap: anywhere; }
.reveal section[data-qr] .quiz-qr { justify-content: center; }
.reveal .quiz-erreur { color: #b91c1c; font-size: .6em; }

/* QR code posé sur une section libre (première diapositive d'un PowerPoint converti) */
.reveal .el.qr-libre { background: rgba(255,255,255,.96); border-radius: 16px; padding: 14px; box-shadow: 0 4px 24px rgba(0,0,0,.25); }
.reveal .el.qr-libre .quiz-qr { margin: 0; flex-direction: column; gap: 6px; height: 100%; justify-content: center; }
.reveal .el.qr-libre .quiz-qr img { width: 220px; height: 220px; }
.reveal .el.qr-libre .quiz-url { font-size: 22px; color: #111; text-align: center; }

/* Éléments dynamiques */
.reveal .el[data-amphi="qr"] .quiz-qr { margin: 0; height: 100%; }
.reveal .el[data-amphi="qr"] .quiz-qr img { width: auto; height: 100%; max-height: 100%; aspect-ratio: 1; }
.reveal .minuteur { display: flex; align-items: center; justify-content: center; font-variant-numeric: tabular-nums; font-weight: 800; font-size: 120px; border-radius: 24px; background: #111827; color: #f9fafb; }
.reveal .minuteur.fini { background: #b91c1c; animation: clignote 1s steps(2) infinite; }
@keyframes clignote { to { opacity: .4; } }
.reveal .lottie svg { width: 100%; height: 100%; }
.reveal .minuteur.lie { background: #e5e7eb; color: #374151; transition: background .3s, color .3s; }
.reveal .minuteur.lie.actif { background: #111827; color: #f9fafb; }
.reveal .minuteur.lie.fini { background: #166534; color: #fff; animation: none; }

/* Séquence questions-réponses (docs/questions.md) : overlays posés sur <body>, hors de .reveal ; rôles scene et obs. */
.qr-bandeau { position: fixed; left: 3vw; right: 3vw; bottom: 4vh; z-index: 60; box-sizing: border-box; padding: 1.4vw 2.2vw 1.6vw;
  background: rgba(15, 23, 42, .92); color: #f8fafc; border-left: .7vw solid #3b82f6; border-radius: 1vw; box-shadow: 0 1vw 3vw rgba(0,0,0,.45);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; text-align: left; pointer-events: none; }
.qr-bandeau.qr-entree { animation: qr-entree .45s cubic-bezier(.2, .8, .2, 1); }
@keyframes qr-entree { from { transform: translateY(40%); opacity: 0; } to { transform: none; opacity: 1; } }
.qr-bandeau .qr-sur { display: flex; align-items: center; gap: 1em; font-size: max(22px, 1.3vw); letter-spacing: .04em; text-transform: uppercase; color: #93c5fd; font-weight: 600; margin-bottom: .5em; }
.qr-bandeau .qr-reste { margin-left: auto; text-transform: none; letter-spacing: 0; font-weight: 500; color: #cbd5e1; }
.qr-bandeau .qr-texte { font-size: max(40px, 2.6vw); line-height: 1.3; font-weight: 600; overflow-wrap: anywhere; }
.qr-indicateur { position: fixed; top: 2vh; right: 2vw; z-index: 60; display: flex; align-items: center; gap: .6em; padding: .5em 1em; border-radius: 2em;
  background: rgba(15, 23, 42, .85); color: #e2e8f0; font: 600 max(18px, 1.1vw) system-ui, sans-serif; box-shadow: 0 .4vw 1.6vw rgba(0,0,0,.35); pointer-events: none; }
.qr-indicateur b { color: #fff; }
.qr-indicateur .qr-point { width: .7em; height: .7em; border-radius: 50%; background: #3b82f6; animation: qr-pulse 1.6s ease-in-out infinite; }
@keyframes qr-pulse { 50% { opacity: .3; } }
html[data-role="remote"] .qr-bandeau, html[data-role="remote"] .qr-indicateur { display: none; }