/* quiz-player.css — Quiz Player A+ (isolé du player lecture)
   Tokens neutres dark carbone + light. Charger après player.css. */

:root{
  --qp-bg: linear-gradient(145deg,#1a1a1a,#111111);
  --qp-bg-solid: #1a1a1a;
  --qp-elevated: #222;
  --qp-stroke: rgba(255,255,255,.12);
  --qp-stroke-strong: rgba(255,255,255,.18);
  --qp-text: #e8e8e8;
  --qp-text-2: #d2d2d2;
  --qp-text-3: #9c9c9c;
  --qp-accent: #a78bfa;
  --qp-accent-soft: rgba(124,58,237,.16);
  --qp-ok: #4ade80;
  --qp-ko: #f87171;
  --qp-warn: #fbbf24;
  --qp-choice-bg: rgba(255,255,255,.04);
  --qp-radius: 16px;
  --qp-focus: #a78bfa;
}
:root[data-theme="light"]{
  --qp-bg: linear-gradient(145deg,#faf9f7,#f3f1ee);
  --qp-bg-solid: #faf9f7;
  --qp-elevated: #ffffff;
  --qp-stroke: rgba(39,39,39,.12);
  --qp-stroke-strong: rgba(39,39,39,.18);
  --qp-text: #1a1a1a;
  --qp-text-2: #434343;
  --qp-text-3: #777777;
  --qp-accent: #6d28d9;
  --qp-accent-soft: rgba(124,58,237,.1);
  --qp-ok: #15803d;
  --qp-ko: #b91c1c;
  --qp-warn: #b45309;
  --qp-choice-bg: rgba(39,39,39,.03);
  --qp-focus: #7c3aed;
}

/* Layout hors mesure lecture étroite */
.fp-quiz-section{
  width:100%;
  max-width:min(52rem,100%);
  margin:2.25rem 0 0;
  padding:0;
}
.fp-quiz-section,
#fp-quiz-player,
.fp-quiz{max-width:100%;overflow-x:auto}

/* ── Teaser ── */
.fp-quiz-teaser{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:16px 18px;border-radius:var(--qp-radius);
  background:var(--qp-bg);border:1px solid var(--qp-stroke);
  box-shadow:0 1px 0 rgba(255,255,255,.04) inset;
}
.fp-quiz-teaser__icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:12px;flex-shrink:0;
  background:var(--qp-accent-soft);color:var(--qp-accent);
}
.fp-quiz-teaser__body{flex:1;min-width:12rem}
.fp-quiz-teaser__title{
  margin:0;font-size:1rem;font-weight:700;color:var(--qp-text);line-height:1.3;
}
.fp-quiz-teaser__sub{
  margin:.25rem 0 0;font-size:.8rem;color:var(--qp-text-3);line-height:1.4;
}
.fp-quiz-teaser__cta{min-height:44px;flex-shrink:0}
.fp-quiz-teaser__cta:focus-visible{
  outline:2px solid var(--qp-focus);outline-offset:2px;
}

/* ── Player stage ── */
.fp-quiz,
.fp-quiz-player{
  background:var(--qp-bg);
  border:1px solid var(--qp-stroke-strong);
  border-radius:var(--qp-radius);
  padding:22px;
  margin-top:0;
  color:var(--qp-text-2);
  font-family:var(--fp-font,inherit);
}
.fp-quiz__header{
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
  margin-bottom:14px;
}
.fp-quiz__brand{display:flex;align-items:flex-start;gap:10px;min-width:0}
.fp-quiz__brand-ico{
  display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:8px;flex-shrink:0;
  background:var(--qp-accent-soft);color:var(--qp-accent);
}
.fp-quiz__eyebrow{
  margin:0;font-size:.65rem;font-weight:800;letter-spacing:.06em;
  text-transform:uppercase;color:var(--qp-accent);
}
.fp-quiz__heading{
  margin:.1rem 0 0;font-size:.9375rem;font-weight:700;color:var(--qp-text);
}
.fp-quiz__meta{margin:.2rem 0 0;font-size:.75rem;color:var(--qp-text-3)}
.fp-quiz__meta--ok{color:var(--qp-ok)}
.fp-quiz__meta--rev{color:var(--qp-accent)}
.fp-quiz__live{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.fp-quiz__score-live{font-size:.78rem;font-weight:700;color:var(--qp-accent)}
.fp-quiz__timer-toggle{
  font-size:.72rem;font-weight:700;padding:6px 10px;min-height:36px;border-radius:999px;
  border:1px solid var(--qp-stroke);background:rgba(255,255,255,.05);
  color:var(--qp-text);cursor:pointer;font-family:inherit;
}
:root[data-theme="light"] .fp-quiz__timer-toggle{background:rgba(39,39,39,.04)}
.fp-quiz__timer-toggle[aria-pressed="true"]{
  background:rgba(245,158,11,.2);border-color:rgba(245,158,11,.45);color:var(--qp-warn);
}
.fp-quiz__timer-toggle:focus-visible,
.fp-quiz__collapse:focus-visible,
.fp-quiz__close:focus-visible{
  outline:2px solid var(--qp-focus);outline-offset:2px;
}
.fp-quiz__collapse,
.fp-quiz__close{
  font-size:.72rem;font-weight:700;padding:6px 10px;min-height:36px;min-width:36px;border-radius:8px;
  border:1px solid var(--qp-stroke);background:transparent;color:var(--qp-text-3);
  cursor:pointer;font-family:inherit;
  display:inline-flex;align-items:center;justify-content:center;
}
.fp-quiz__collapse:hover,
.fp-quiz__close:hover{color:var(--qp-text);border-color:var(--qp-stroke-strong);background:rgba(255,255,255,.06)}
:root[data-theme="light"] .fp-quiz__close:hover{background:rgba(39,39,39,.06)}

.fp-quiz__progress{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.fp-quiz__progress-track{flex:1;height:6px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}
:root[data-theme="light"] .fp-quiz__progress-track{background:rgba(39,39,39,.08)}
.fp-quiz__progress-fill{height:100%;background:linear-gradient(90deg,#7c3aed,#22c55e);border-radius:99px;transition:width .25s}
.fp-quiz__progress-label{font-size:.72rem;font-weight:700;color:var(--qp-text-3);min-width:2.5em;text-align:right}

.fp-quiz__dots{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:14px}
.fp-quiz__dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.12);transition:all .2s}
:root[data-theme="light"] .fp-quiz__dot{background:rgba(39,39,39,.15)}
.fp-quiz__dot.is-done{background:var(--qp-ok);transform:scale(.8)}
.fp-quiz__dot.is-filled{background:#7c3aed;transform:scale(1.1)}
.fp-quiz__dot.is-ok{background:var(--qp-ok)}
.fp-quiz__dot.is-ko{background:var(--qp-ko)}

.fp-quiz__qtext{
  font-size:1rem;font-weight:600;color:var(--qp-text);line-height:1.55;margin:0 0 8px;
  font-family:var(--fp-font,inherit);
}
.fp-quiz__hint{font-size:.75rem;color:var(--qp-text-3);margin:0 0 10px}
.fp-quiz__keys{font-size:.68rem;color:var(--qp-text-3);margin:0 0 10px;letter-spacing:.01em}

.fp-quiz__choices{display:flex;flex-direction:column;gap:8px}
.fp-quiz__choice{
  display:flex;align-items:center;gap:10px;width:100%;
  padding:11px 14px;border-radius:10px;min-height:48px;
  background:var(--qp-choice-bg);border:1.5px solid var(--qp-stroke);
  color:var(--qp-text-2);font-size:.875rem;text-align:left;cursor:pointer;
  transition:background .15s,border-color .15s,transform .12s,opacity .15s;
  font-family:inherit;word-break:break-word;overflow-wrap:anywhere;
}
.fp-quiz__choice:hover:not(:disabled){
  background:rgba(124,58,237,.1);border-color:rgba(124,58,237,.35);color:var(--qp-text);
}
.fp-quiz__choice:focus-visible{outline:2px solid var(--qp-focus);outline-offset:2px}
.fp-quiz__choice:active:not(:disabled){transform:scale(.992)}
.fp-quiz__choice:disabled{cursor:default;opacity:.92}
.fp-quiz__choice.is-locked,
.fp-quiz__choice:disabled{cursor:default}
.fp-quiz__choice.is-correct{background:rgba(34,197,94,.1);border-color:rgba(34,197,94,.4);color:var(--qp-ok)}
.fp-quiz__choice.is-wrong{background:rgba(239,68,68,.1);border-color:rgba(239,68,68,.35);color:var(--qp-ko)}
.fp-quiz__choice.is-picked{border-color:rgba(167,139,250,.55);background:rgba(124,58,237,.12)}
.fp-quiz__choice.is-neutral:disabled{opacity:.45}
.fp-quiz__choice:disabled.is-correct,
.fp-quiz__choice:disabled.is-wrong,
.fp-quiz__choice:disabled.is-picked{opacity:1}

.fp-quiz__letter{
  width:28px;height:28px;border-radius:8px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:.72rem;font-weight:800;
  background:rgba(255,255,255,.07);color:var(--qp-text-3);transition:all .15s;
}
:root[data-theme="light"] .fp-quiz__letter{background:rgba(39,39,39,.07)}
.fp-quiz__choice:hover:not(:disabled) .fp-quiz__letter{background:var(--qp-accent-soft);color:var(--qp-accent)}
.fp-quiz__letter.is-correct{background:rgba(34,197,94,.2);color:var(--qp-ok)}
.fp-quiz__letter.is-wrong{background:rgba(239,68,68,.2);color:var(--qp-ko)}
.fp-quiz__choice-text{flex:1}
.fp-quiz__mark-ico{width:18px;height:18px;flex-shrink:0}
.fp-quiz__mark-ico--ok{color:#22c55e}
.fp-quiz__mark-ico--ko{color:#ef4444}

.fp-quiz__layer{margin-top:12px;padding:12px 16px;border-radius:10px}
.fp-quiz__layer.is-ok{background:rgba(34,197,94,.08);border:1px solid rgba(34,197,94,.22);color:var(--qp-ok)}
.fp-quiz__layer.is-ko{background:rgba(239,68,68,.07);border:1px solid rgba(239,68,68,.2);color:var(--qp-ko)}
.fp-quiz__layer strong{display:block;margin-bottom:5px;font-size:.85rem}
.fp-quiz__layer p{font-size:.82rem;color:var(--qp-text-3);margin:0}
.fp-quiz__exp{font-size:.85rem!important;color:var(--qp-text-2)!important;margin-top:6px!important;line-height:1.5}

.fp-quiz__nav,
.fp-quiz__footer{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:1rem;
}
.fp-quiz__nav-spacer{flex:1;min-width:8px}
.fp-quiz__nav .fp-btn{min-height:44px}
.fp-quiz__multi-actions{display:flex;justify-content:flex-end;margin-top:12px}
.fp-quiz__multi-actions .fp-btn{min-height:44px}

.fp-quiz__score{display:flex;flex-direction:column;align-items:center;padding:16px 0;text-align:center}
.fp-quiz__ring-wrap{position:relative;display:inline-flex;align-items:center;justify-content:center;margin-bottom:1rem}
.fp-quiz__ring{width:88px;height:88px;transform:rotate(-90deg)}
.fp-quiz__ring-track{stroke:#2a2a2a}
:root[data-theme="light"] .fp-quiz__ring-track{stroke:#e2e8f0}
.fp-quiz__ring-label{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;
}
.fp-quiz__ring-pct{font-size:1.125rem;font-weight:800;color:var(--qp-text);line-height:1}
.fp-quiz__ring-frac{font-size:.7rem;color:var(--qp-text-3);margin-top:2px}
.fp-quiz__score-title{font-size:1.1rem;font-weight:800;color:var(--qp-text);margin:0 0 6px}
.fp-quiz__score-sub{font-size:.875rem;color:var(--qp-text-3);margin:0 0 4px}
.fp-quiz__best{font-size:.8rem;color:var(--qp-text-3);margin:0 0 12px}
.fp-quiz__score-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:4px}

.fp-quiz__recap{list-style:none;margin:0 0 18px;padding:0;width:100%;max-width:420px;text-align:left}
.fp-quiz__recap-item{
  display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border-radius:8px;
  margin-bottom:4px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);
  font-size:.8rem;color:var(--qp-text-2);
}
:root[data-theme="light"] .fp-quiz__recap-item{background:rgba(0,0,0,.03);border-color:rgba(0,0,0,.08);color:#334155}
.fp-quiz__recap-n{
  flex-shrink:0;width:22px;height:22px;border-radius:6px;display:inline-flex;
  align-items:center;justify-content:center;font-size:.68rem;font-weight:800;
  background:rgba(255,255,255,.08);color:var(--qp-text-3);
}
:root[data-theme="light"] .fp-quiz__recap-n{background:rgba(0,0,0,.06)}
.fp-quiz__recap-q{flex:1;min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.35}
.fp-quiz__recap-mark{flex-shrink:0;font-weight:800}
.fp-quiz__recap-item.is-ok{border-color:rgba(34,197,94,.28);background:rgba(34,197,94,.07)}
.fp-quiz__recap-item.is-ok .fp-quiz__recap-mark,
.fp-quiz__recap-item.is-ok .fp-quiz__recap-n{color:var(--qp-ok)}
.fp-quiz__recap-item.is-ko{border-color:rgba(239,68,68,.28);background:rgba(239,68,68,.07)}
.fp-quiz__recap-item.is-ko .fp-quiz__recap-mark,
.fp-quiz__recap-item.is-ko .fp-quiz__recap-n{color:var(--qp-ko)}
.fp-quiz__recap-item.is-skip{opacity:.65}

.fp-quiz__review{margin-top:12px}
.fp-quiz__review-pos{font-size:.8rem;color:var(--qp-text-3)}
.fp-quiz__empty{font-size:.85rem;color:var(--qp-text-3);padding:12px 0}
.fp-quiz-fade{transition:opacity .2s ease}
.fp-quiz-fade--in{opacity:0}
.fp-quiz-fade--out{opacity:1}
@keyframes fpQuizRing{from{stroke-dashoffset:213.6}}
.score-ring-animated{animation:fpQuizRing .7s ease-out}

.fp-quiz-anchor{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}

/* ── Modal shell ── */
html.fp-quiz-modal-open,
html.fp-quiz-modal-open body{overflow:hidden!important}
.fp-quiz-modal{
  position:fixed;inset:0;z-index:1200;
  display:flex;align-items:center;justify-content:center;
  padding:max(16px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom));
  box-sizing:border-box;
}
.fp-quiz-modal__backdrop{
  position:absolute;inset:0;
  background:rgba(8,8,10,.62);
  backdrop-filter:blur(10px) saturate(1.1);
  -webkit-backdrop-filter:blur(10px) saturate(1.1);
  cursor:pointer;
}
.fp-quiz-modal__dialog{
  position:relative;z-index:1;
  width:min(40rem,100%);
  max-height:min(88vh,880px);
  overflow-y:auto;overflow-x:hidden;
  margin:0;
  border-radius:18px;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.06),
    0 24px 64px rgba(0,0,0,.55),
    0 2px 0 rgba(255,255,255,.04) inset;
  outline:none;
  animation:fpQuizModalIn .22s ease-out;
}
:root[data-theme="light"] .fp-quiz-modal__backdrop{
  background:rgba(15,23,42,.45);
}
:root[data-theme="light"] .fp-quiz-modal__dialog{
  box-shadow:
    0 0 0 1px rgba(15,23,42,.08),
    0 24px 56px rgba(15,23,42,.22);
}
.fp-quiz-modal-fade{transition:opacity .18s ease}
.fp-quiz-modal-fade--in{opacity:0}
.fp-quiz-modal-fade--out{opacity:1}
@keyframes fpQuizModalIn{
  from{opacity:0;transform:translateY(10px) scale(.985)}
  to{opacity:1;transform:none}
}

.fp-auto-bar{height:3px;background:rgba(255,255,255,.08);border-radius:2px;overflow:hidden;margin-top:10px}
.fp-auto-fill{height:100%;width:0;background:linear-gradient(90deg,#7c3aed,#22d3ee);transition:width 1.3s linear}

/* Carbon / WinUI shell — neutre, pas de glow violet excessif */
.fp-app.fp-app--winui .fp-quiz,
.fp-app.fp-app--winui .fp-quiz-teaser{
  background:linear-gradient(145deg,var(--fp-elevated,#222),#1a1a1a)!important;
  border:1px solid var(--fp-fluent-stroke-strong,rgba(255,255,255,.14))!important;
  box-shadow:none!important;
}
.fp-app.fp-app--winui .fp-quiz__qtext,
.fp-app.fp-app--winui .fp-quiz__heading,
.fp-app.fp-app--winui .fp-quiz-teaser__title{color:var(--fp-fluent-text,var(--qp-text))!important}
.fp-app.fp-app--winui .fp-quiz__choice{
  background:rgba(255,255,255,.04)!important;
  border-color:var(--fp-fluent-stroke,rgba(255,255,255,.1))!important;
  color:var(--fp-fluent-text-2,var(--qp-text-2))!important;
}
.fp-app.fp-app--winui .fp-quiz__choice:hover:not(:disabled){
  background:rgba(139,92,246,.12)!important;
  border-color:rgba(167,139,250,.35)!important;
  color:var(--fp-fluent-text,var(--qp-text))!important;
}
:root[data-theme="light"] .fp-app.fp-app--winui .fp-quiz,
:root[data-theme="light"] .fp-app.fp-app--winui .fp-quiz-teaser{
  background:linear-gradient(145deg,#fff,#f8fafc)!important;
  border-color:rgba(39,39,39,.12)!important;
  color:var(--qp-text-2)!important;
}
:root[data-theme="light"] .fp-app.fp-app--winui .fp-quiz__qtext,
:root[data-theme="light"] .fp-app.fp-app--winui .fp-quiz__heading,
:root[data-theme="light"] .fp-app.fp-app--winui .fp-quiz-teaser__title{
  color:var(--qp-text)!important;
}
:root[data-theme="light"] .fp-app.fp-app--winui .fp-quiz__choice{
  background:rgba(39,39,39,.03)!important;
  border-color:rgba(39,39,39,.12)!important;
  color:var(--qp-text-2)!important;
}
:root[data-theme="light"] .fp-app.fp-app--winui .fp-quiz__choice:hover:not(:disabled){
  background:rgba(124,58,237,.08)!important;
  border-color:rgba(124,58,237,.3)!important;
  color:var(--qp-text)!important;
}

/* A11y vision mode hooks (kept local to quiz) */
html.fp-a11y-vision .fp-quiz__qtext{color:#ffff00!important;letter-spacing:.06em;line-height:2!important}
html.fp-a11y-vision .fp-quiz__choice{outline:2px solid #fff}
html.fp-a11y-vision .fp-quiz__choice.is-correct{outline:3px solid #0f0!important}
html.fp-a11y-vision .fp-quiz__choice.is-wrong{outline:3px solid #f00!important}

@media(max-width:640px){
  .fp-quiz-modal{
    align-items:flex-end;justify-content:stretch;
    padding:0;
  }
  .fp-quiz-modal__dialog{
    width:100%;
    max-width:100%;
    max-height:min(96dvh,96vh);
    border-radius:16px 16px 0 0;
    padding:16px 14px calc(16px + env(safe-area-inset-bottom));
    animation:fpQuizSheetIn .24s ease-out;
  }
  @keyframes fpQuizSheetIn{
    from{opacity:.6;transform:translateY(24px)}
    to{opacity:1;transform:none}
  }
  .fp-quiz,.fp-quiz-player{padding:16px 14px;border-radius:14px}
  .fp-quiz__header{flex-direction:column;align-items:flex-start;gap:10px}
  .fp-quiz__live{width:100%;justify-content:flex-start}
  .fp-quiz__choice{min-height:52px;padding:14px;font-size:.92rem}
  .fp-quiz__letter{width:32px;height:32px}
  .fp-quiz__qtext{font-size:.95rem}
  .fp-quiz__score-actions{width:100%;flex-direction:column}
  .fp-quiz__score-actions .fp-btn{width:100%;justify-content:center;min-height:44px}
  .fp-quiz__keys{display:none}
  .fp-quiz__nav{gap:6px}
  .fp-quiz__nav .fp-btn{flex:1;justify-content:center;min-height:48px}
  .fp-quiz__nav-spacer{display:none}
  .fp-quiz__recap{max-width:100%}
  .fp-quiz-teaser{padding:14px}
  .fp-quiz-teaser__cta{width:100%;justify-content:center}
}