/* ── rescore.it · Module Quiz ──────────────────────────────────────────────
   Intégré au design du site : consomme les tokens du thème (--rs-*) → match
   automatique clair/sombre, mêmes cartes (.rs-card), même CTA pilule rouge
   (.rs-btn--primary), même typo système, mêmes pictogrammes de sport. */

.rs-quiz{
  /* Mappe les tokens locaux du quiz sur le système de design du site. */
  --q-accent: var(--rs-f1, #e10600);
  --q-accent2: var(--rs-f1-dark, #b00000);
  --q-ok: var(--rs-rugby, #0a6644);
  --q-ko: var(--rs-f1, #e10600);
  --q-gold: #f5a524;
  --q-bg: var(--rs-bg, #15110e);
  --q-card: var(--rs-bg-card, #221d18);
  --q-card2: var(--rs-bg-2, #1e1a16);
  --q-tx: var(--rs-text, #f3efe8);
  --q-tx2: var(--rs-muted, #c0b9af);
  --q-line: var(--rs-border, rgba(0,0,0,.11));
  --q-radius: var(--rs-radius, 14px);
  --q-radius-sm: var(--rs-radius-sm, 8px);
  --q-shadow: 0 14px 40px rgba(0,0,0,.16);
  display:flex; justify-content:center; width:100%;
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
}
.rs-quiz *{box-sizing:border-box}

/* Carte/scène — calquée sur .rs-card */
.rs-quiz__stage{
  width:100%; max-width:540px; color:var(--q-tx);
  background:var(--q-card); border:1.5px solid var(--q-line);
  border-radius:var(--q-radius); box-shadow:var(--q-shadow); overflow:hidden;
}
.rs-quiz__loading{padding:40px;text-align:center;color:var(--q-tx2)}

.rs-quiz__top{display:flex;align-items:center;gap:12px;padding:15px 20px;
  border-bottom:1px solid var(--q-line);background:var(--q-card2)}
.rs-quiz__brand{font-weight:800;letter-spacing:-.01em;font-size:15px}
.rs-quiz__brand b{color:var(--q-accent);font-weight:800}
.rs-quiz__tag{margin-left:auto;font-size:12px;color:var(--q-tx2);font-weight:700;text-transform:uppercase;letter-spacing:.06em}

.rs-quiz__bar{height:4px;background:var(--q-line);position:relative}
.rs-quiz__bar>i{position:absolute;inset:0 auto 0 0;width:0;transition:width .3s;
  background:linear-gradient(90deg,var(--q-accent),var(--q-accent2))}

.rs-quiz__pad{padding:26px}
.rs-quiz__eyebrow{font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--q-tx2);font-weight:700}
.rs-quiz__h1{font-size:25px;margin:.3em 0 .1em;line-height:1.15;font-weight:800;color:var(--q-tx)}
.rs-quiz__sub{color:var(--q-tx2);font-size:14px;margin:0 0 16px;line-height:1.5}

.rs-quiz__field{margin:14px 0}
.rs-quiz__label{font-size:12px;color:var(--q-tx2);text-transform:uppercase;
  letter-spacing:.07em;font-weight:700;margin-bottom:8px}
.rs-quiz__seg{display:flex;gap:8px;flex-wrap:wrap}
.rs-quiz__seg button{flex:1;min-width:96px;display:inline-flex;align-items:center;
  justify-content:center;gap:.45em;background:var(--q-card2);
  border:1.5px solid var(--q-line);color:var(--q-tx);padding:11px 12px;
  border-radius:var(--q-radius);font-size:14px;font-weight:600;cursor:pointer;
  transition:border-color .15s,background .15s,color .15s}
.rs-quiz__seg button:disabled{opacity:.42;cursor:not-allowed}
.rs-quiz__seg button.is-on{border-color:var(--q-accent);color:var(--q-tx);
  background:color-mix(in srgb,var(--q-accent) 12%,var(--q-card2))}
/* Pictogrammes de sport (SVG currentColor du thème) */
.rs-quiz .rs-sport-ico{width:1.25em;height:1.25em;flex:0 0 auto;vertical-align:-.18em}

/* CTA — calqué sur .rs-btn--primary (pilule rouge) */
.rs-quiz__cta{width:100%;margin-top:20px;border:0;padding:14px 20px;border-radius:999px;
  font-size:16px;font-weight:700;cursor:pointer;color:#fff;
  background:var(--q-accent);box-shadow:0 4px 14px rgba(225,6,0,.25);
  transition:background .2s,transform .15s,box-shadow .2s}
.rs-quiz__cta:hover{background:var(--q-accent2);transform:translateY(-1px)}
.rs-quiz__cta:active{transform:translateY(0)}
.rs-quiz__ghost{width:100%;margin-top:9px;background:transparent;border:1.5px solid var(--q-line);
  color:var(--q-tx);padding:12px;border-radius:999px;font-weight:700;cursor:pointer;transition:border-color .2s}
.rs-quiz__ghost:hover:not(:disabled){border-color:var(--q-accent)}
.rs-quiz__ghost:disabled{opacity:.5;cursor:not-allowed}

.rs-quiz__select{width:100%;background:var(--q-card2);border:1.5px solid var(--q-line);
  color:var(--q-tx);padding:12px 14px;border-radius:var(--q-radius);font-size:15px;
  font-weight:600;cursor:pointer;-webkit-appearance:menulist}

.rs-quiz__count{display:grid;place-items:center;height:340px}
.rs-quiz__count b{font-size:118px;font-weight:900;color:var(--q-accent);animation:rsq-pop .8s ease}
@keyframes rsq-pop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}

.rs-quiz__qmeta{display:flex;align-items:center;justify-content:space-between;
  color:var(--q-tx2);font-size:13px;font-weight:600;margin-bottom:8px}
.rs-quiz__qhead{display:flex;gap:14px;align-items:center}
.rs-quiz__ring{--p:100;width:54px;height:54px;border-radius:50%;flex:0 0 auto;
  display:grid;place-items:center;
  background:conic-gradient(var(--q-accent) calc(var(--p)*1%),var(--q-line) 0)}
.rs-quiz__ring.is-warn{background:conic-gradient(var(--q-ko) calc(var(--p)*1%),var(--q-line) 0)}
.rs-quiz__ring>span{width:42px;height:42px;border-radius:50%;background:var(--q-card);
  display:grid;place-items:center;font-weight:800;font-size:18px}
.rs-quiz__qtext{font-size:21px;font-weight:750;line-height:1.25;margin:10px 0 18px;min-height:2.4em;color:var(--q-tx)}

.rs-quiz__opts{display:grid;gap:10px}
.rs-quiz__opt{display:flex;align-items:center;gap:13px;text-align:left;
  background:var(--q-card2);border:1.5px solid var(--q-line);color:var(--q-tx);
  padding:13px 15px;border-radius:var(--q-radius);font-size:16px;font-weight:600;
  cursor:pointer;transition:border-color .12s,background .12s}
.rs-quiz__opt:hover:not(:disabled){border-color:var(--q-tx2)}
.rs-quiz__opt:disabled{cursor:default}
.rs-quiz__opt .rs-quiz__flag{width:34px;height:23px;border-radius:4px;object-fit:cover;
  flex:0 0 auto;background:var(--q-line);box-shadow:0 1px 3px rgba(0,0,0,.25)}
.rs-quiz__opt .rs-quiz__num{min-width:30px;text-align:center;font-weight:800;color:var(--q-tx2)}
.rs-quiz__opt.is-correct{border-color:var(--q-ok);
  background:color-mix(in srgb,var(--q-ok) 16%,var(--q-card2))}
.rs-quiz__opt.is-wrong{border-color:var(--q-ko);
  background:color-mix(in srgb,var(--q-ko) 14%,var(--q-card2))}

.rs-quiz__explain{margin-top:16px;background:var(--q-card2);border:1px solid var(--q-line);
  border-left:3px solid var(--q-accent);border-radius:var(--q-radius-sm);padding:12px 14px;
  font-size:14px;color:var(--q-tx2);line-height:1.5;opacity:0;transform:translateY(6px);transition:.25s}
.rs-quiz__explain.is-show{opacity:1;transform:none}

.rs-quiz__score{text-align:center}
.rs-quiz__circle{--p:0;width:150px;height:150px;border-radius:50%;margin:8px auto 14px;
  display:grid;place-items:center;
  background:conic-gradient(var(--q-gold) calc(var(--p)*1%),var(--q-line) 0)}
.rs-quiz__circle>span{width:124px;height:124px;border-radius:50%;background:var(--q-card);
  display:grid;place-items:center;font-weight:900}
.rs-quiz__circle .rs-quiz__big{font-size:44px;line-height:1;color:var(--q-tx)}
.rs-quiz__circle .rs-quiz__den{font-size:13px;color:var(--q-tx2);font-weight:700}
.rs-quiz__pts{font-size:15px;margin:2px 0 6px;color:var(--q-tx)}
.rs-quiz__pts b{color:var(--q-gold)}
.rs-quiz__recap{margin:14px 0;display:grid;gap:7px;text-align:left}
.rs-quiz__rrow{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--q-tx2)}
.rs-quiz__dot{width:10px;height:10px;border-radius:50%;flex:0 0 auto}

/* défi : sélecteur d'amis + bannière + écran versus */
.rs-quiz__friends{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.rs-quiz__friend{background:var(--q-card2);border:1.5px solid var(--q-line);color:var(--q-tx);
  padding:9px 14px;border-radius:999px;font-weight:600;cursor:pointer;font-size:14px;transition:border-color .15s}
.rs-quiz__friend:hover{border-color:var(--q-accent)}
.rs-quiz__pendingwrap{display:grid;gap:8px}
.rs-quiz__pendingwrap:not(:empty){margin:4px 0 16px}
.rs-quiz__pending{width:100%;text-align:left;background:color-mix(in srgb,var(--q-accent) 10%,var(--q-card2));
  border:1.5px solid var(--q-accent);color:var(--q-tx);padding:12px 14px;border-radius:var(--q-radius);font-weight:600;cursor:pointer}
.rs-quiz__versus{display:flex;align-items:center;justify-content:center;gap:18px;margin:16px 0}
.rs-quiz__vside{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:96px}
.rs-quiz__vname{font-size:13px;color:var(--q-tx2);font-weight:700;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rs-quiz__vscore{font-size:40px;font-weight:900;line-height:1;color:var(--q-tx)}
.rs-quiz__vvs{font-size:22px;color:var(--q-tx2);font-weight:800}

.rs-quiz__foot{padding:12px 20px;border-top:1px solid var(--q-line);
  color:var(--q-tx2);font-size:11px;text-align:center;line-height:1.5}
.rs-quiz__hide{display:none!important}

/* Modale (quiz scopé ouvert depuis une page sport) — chrome via tokens du site */
.rs-quiz-modal{position:fixed;inset:0;z-index:100000;display:flex;align-items:flex-start;
  justify-content:center;padding:24px 16px;overflow-y:auto;background:rgba(0,0,0,.55);
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.rs-quiz-modal__dialog{position:relative;width:100%;max-width:560px;margin:auto}
.rs-quiz-modal__close{position:absolute;top:-8px;right:-8px;z-index:2;width:34px;height:34px;
  border-radius:50%;border:1px solid var(--rs-border,rgba(0,0,0,.11));background:var(--rs-bg-card,#fff);
  color:var(--rs-text,#1a1918);font-size:22px;line-height:1;cursor:pointer;display:grid;place-items:center;
  box-shadow:0 4px 14px rgba(0,0,0,.3)}
.rs-quiz-modal__close:hover{border-color:var(--rs-f1,#e10600);color:var(--rs-f1,#e10600)}
body.rs-quiz-modal-open{overflow:hidden}
/* Bouton lanceur dans le masthead (après « Duels ») : liseré accent pour le distinguer des onglets */
.rs-quiz-launch.rs-sport-tab{border-color:color-mix(in srgb,var(--rs-f1,#e10600) 50%,var(--rs-border,transparent))}