/* recul-v1 — l'écran « Prendre du recul » et son lecteur (sans ombres portées, sans flash) */
#ec-recul .rc-tete .retour{margin-bottom:10px}
#ec-recul .rc-onglets{display:flex;flex-wrap:nowrap;gap:8px;margin:2px 0 0;padding:2px 0 4px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;min-width:0;max-width:100%}
#ec-recul .rc-onglets::-webkit-scrollbar{display:none}
/* la barre défile : un léger fondu sur le bord où il reste des onglets à voir */
#ec-recul .rc-onglets.plus-droite{-webkit-mask-image:linear-gradient(to right,#000 82%,transparent);mask-image:linear-gradient(to right,#000 82%,transparent)}
#ec-recul .rc-onglets.plus-gauche{-webkit-mask-image:linear-gradient(to left,#000 82%,transparent);mask-image:linear-gradient(to left,#000 82%,transparent)}
#ec-recul .rc-onglets.plus-gauche.plus-droite{-webkit-mask-image:linear-gradient(to right,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(to right,transparent,#000 14%,#000 86%,transparent)}
[dir=rtl] #ec-recul .rc-onglets.plus-droite:not(.plus-gauche){-webkit-mask-image:linear-gradient(to left,#000 82%,transparent);mask-image:linear-gradient(to left,#000 82%,transparent)}
[dir=rtl] #ec-recul .rc-onglets.plus-gauche:not(.plus-droite){-webkit-mask-image:linear-gradient(to right,#000 82%,transparent);mask-image:linear-gradient(to right,#000 82%,transparent)}
#ec-recul .rc-onglet{flex:0 0 auto;white-space:nowrap;min-height:44px;padding:0 15px;border-radius:999px;border:1px solid var(--trait,rgba(255,255,255,.16));background:transparent;color:inherit;font:inherit;font-weight:600;cursor:pointer}
#ec-recul .rc-onglet.actif{background:#F2C94C;color:#2A2233;border-color:#F2C94C}
#ec-recul .rc-fiche h2{margin:0 0 10px;font-size:1.2rem;line-height:1.25}
#ec-recul .rc-fiche-etiquette{margin:0 0 2px;font-size:.74rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;opacity:.7}
#ec-recul .rc-fiche-sens{margin:0 0 12px;line-height:1.5}
#ec-recul .rc-fiche-exemple{margin:0;padding:10px 12px;border-radius:14px;border-inline-start:3px solid #A9C4F5;background:rgba(169,196,245,.10);line-height:1.5;font-style:italic;color:var(--encre-douce,#C4CFBC)}
#ec-recul .rc-vide{margin:12px 4px;text-align:center;opacity:.75;line-height:1.5}
#ec-recul .rc-grille{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
#ec-recul .rc-carte{position:relative;display:flex;flex-direction:column;gap:4px;text-align:start;min-width:0;min-height:96px;padding:12px 12px 12px 14px;border-radius:16px;border:1px solid var(--trait,rgba(255,255,255,.14));background:rgba(255,255,255,.05);color:inherit;font:inherit;cursor:pointer}
#ec-recul .rc-carte b{font-size:1rem;line-height:1.25;padding-inline-end:20px;overflow-wrap:anywhere}
#ec-recul .rc-carte span{font-size:.8rem;line-height:1.35;color:var(--encre-douce,#C4CFBC)}
#ec-recul .rc-carte small{font-size:.72rem;opacity:.65}
#ec-recul .rc-pied{display:flex;flex-wrap:wrap;gap:5px;margin-top:auto;padding-top:4px}
#ec-recul .rc-genre,#ec-recul .rc-libre{font-style:normal;font-size:.68rem;padding:2px 7px;border-radius:999px;line-height:1.4}
#ec-recul .rc-genre-jeu{background:rgba(169,139,239,.20);color:#CDB9FA}
#ec-recul .rc-genre-exo{background:rgba(169,196,245,.18);color:#BFD3FA}
#ec-recul .rc-libre{background:rgba(111,207,151,.18);color:#9EE2BA}
#ec-recul .rc-cadenas{position:absolute;top:10px;inset-inline-end:10px;width:14px;height:16px;opacity:.75;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 16'%3E%3Crect x='1' y='7' width='12' height='9' rx='2' fill='%23C9C2D8'/%3E%3Cpath d='M3.5 7V5a3.5 3.5 0 0 1 7 0v2' fill='none' stroke='%23C9C2D8' stroke-width='1.6'/%3E%3C/svg%3E")}
html.theme-clair #ec-recul .rc-carte{background:rgba(0,0,0,.03)}
html.theme-clair #ec-recul .rc-fiche-exemple{background:rgba(70,110,190,.08);border-inline-start-color:#6F8FD0}
html.theme-clair #ec-recul .rc-genre-jeu{background:rgba(120,90,200,.12);color:#5B3FA8}
html.theme-clair #ec-recul .rc-genre-exo{background:rgba(70,110,190,.12);color:#2F5394}
html.theme-clair #ec-recul .rc-libre{background:rgba(40,150,90,.12);color:#1F7A48}
@media (max-width:340px){#ec-recul .rc-grille{grid-template-columns:1fr}}

/* le lecteur plein écran */
html.rc-ouvert,html.rc-ouvert body{overflow:hidden}
.rc-lecteur{position:fixed;inset:0;z-index:80;display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top) + 10px) 16px calc(env(safe-area-inset-bottom) + 14px);background:var(--brume,#130E20);color:var(--encre,#F1ECF7)}
.rc-lecteur[hidden]{display:none}
html.theme-clair .rc-lecteur{background:#F7F5FB;color:#2A2433}
.rc-barre{display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:8px;min-height:44px;width:100%;max-width:560px;margin:0 auto}
.rc-fermer{width:44px;height:44px;border-radius:50%;border:1px solid var(--trait,rgba(255,255,255,.16));background:transparent;color:inherit;font-size:18px;cursor:pointer}
html.theme-clair .rc-fermer{border-color:rgba(0,0,0,.18)}
.rc-titre{font-weight:700;font-size:1.05rem;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rc-info{font-size:.85rem;opacity:.75}
.rc-consigne{margin:6px auto 8px;max-width:560px;min-height:1.4em;font-size:1rem;line-height:1.4;text-align:center;opacity:.9}
.rc-zone{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;justify-content:safe center;gap:12px;overflow:auto;-webkit-overflow-scrolling:touch;touch-action:manipulation}
.rc-zone button{font:inherit}
/* les boutons « bouton » des contenus (comme sur le banc d'essai) : l'application n'a pas de style global pour cette classe */
.rc-lecteur .bouton{-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border:0;border-radius:999px;background:#F2C94C;color:#2A2233;font:inherit;font-weight:700;cursor:pointer;touch-action:manipulation}
.rc-lecteur .bouton.secondaire{background:transparent;color:inherit;border:1px solid var(--trait,rgba(255,255,255,.22))}
html.theme-clair .rc-lecteur .bouton.secondaire{border-color:rgba(0,0,0,.2)}
.rc-lecteur .bouton:disabled{opacity:.45;cursor:default}
.rc-fin{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(19,14,32,.82);z-index:5}
html.theme-clair .rc-fin{background:rgba(247,245,251,.88)}
.rc-fin-boite{max-width:420px;width:100%;text-align:center;padding:22px 18px;border-radius:22px;border:1px solid var(--trait,rgba(255,255,255,.16));background:var(--brume,#1B1430)}
html.theme-clair .rc-fin-boite{background:#fff}
.rc-fin-boite h3{margin:0 0 8px;font-size:1.3rem}
.rc-fin-boite p{margin:0 0 16px;line-height:1.5;opacity:.9}
.rc-fin-boutons{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rc-fin-boutons .bouton{min-height:48px}
.rc-erreur{opacity:.8;text-align:center}
