/* arbre-autocontrole-v2 — l'écran « Pensée en arborescence et autocontrôle » et son lecteur (sans ombres portées, sans flash) */
#ec-arbre .ar-tete .retour{margin-bottom:10px}
/* l'interrupteur Adulte / Enfant */
#ec-arbre .ar-modes{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;margin:0 0 12px;border-radius:999px;border:1px solid var(--trait,rgba(255,255,255,.16))}
#ec-arbre .ar-mode{min-height:48px;border:0;border-radius:999px;background:transparent;color:inherit;font:inherit;font-weight:700;font-size:1rem;cursor:pointer}
#ec-arbre .ar-mode.actif{background:#8FD19E;color:#1C2A21}
#ec-arbre.ar-mode-enfant .ar-mode.actif{background:#FFD66B;color:#3A2A12}
#ec-arbre .ar-mode:focus-visible,#ec-arbre .ar-onglet:focus-visible,#ec-arbre .ar-carte:focus-visible{outline:2px solid currentColor;outline-offset:2px}
/* la phrase d'accueil et les bulles dessinées */
#ec-arbre .ar-intro{display:flex;align-items:center;gap:12px;margin:0 0 12px;padding:10px 12px;border-radius:16px;border:1px solid rgba(143,209,158,.22);background:linear-gradient(135deg,rgba(143,209,158,.10),rgba(242,201,76,.06))}
#ec-arbre .ar-ornement{flex:0 0 72px;width:72px;height:54px;display:block;color:inherit}
#ec-arbre .ar-ornement svg{display:block;width:100%;height:100%}
/* les bulles montent lentement (2 à 3 px sur 8 s), chacune à son rythme ; immobiles si l'animation est réduite */
#ec-arbre .ar-ornement .ar-b,#ec-arbre .paysage .ar-pb{animation:ar-monte 8s ease-in-out infinite}
#ec-arbre .ar-ornement .ar-b:nth-child(2),#ec-arbre .paysage .ar-pb:nth-child(2){animation-delay:-2.2s}
#ec-arbre .ar-ornement .ar-b:nth-child(3),#ec-arbre .paysage .ar-pb:nth-child(3){animation-delay:-4.6s}
#ec-arbre .ar-ornement .ar-b:nth-child(4),#ec-arbre .paysage .ar-pb:nth-child(4){animation-delay:-1.3s;animation-duration:9s}
#ec-arbre .ar-ornement .ar-b:nth-child(5),#ec-arbre .paysage .ar-pb:nth-child(5){animation-delay:-6.1s}
#ec-arbre .ar-ornement .ar-b:nth-child(6),#ec-arbre .paysage .ar-pb:nth-child(6){animation-delay:-3.4s;animation-duration:7s}
#ec-arbre .ar-ornement .ar-b:nth-child(7),#ec-arbre .paysage .ar-pb:nth-child(7){animation-delay:-5.2s}
#ec-arbre .ar-ornement .ar-b:nth-child(8),#ec-arbre .paysage .ar-pb:nth-child(8){animation-delay:-.8s;animation-duration:9s}
@keyframes ar-monte{0%,100%{transform:translateY(0)}50%{transform:translateY(-2.5px)}}
@media (prefers-reduced-motion:reduce){#ec-arbre .ar-ornement .ar-b,#ec-arbre .paysage .ar-pb{animation:none}}
/* la tuile d'Explorer : son icône est un SVG en ligne (bulles reliées et coche), avec le fond des autres icônes */
#rf-x-arbre .rf-ic.ar-ic{--ar-ic-a:#5F5667;--ar-ic-b:#4D4154;background:none;border:0;border-radius:0}
html.theme-clair #rf-x-arbre .rf-ic.ar-ic{--ar-ic-a:#EEF0FF;--ar-ic-b:#DCE1FA}
#rf-x-arbre .rf-ic.ar-ic svg{display:block;width:100%;height:100%}
#rf-x-arbre .rf-ic.ar-ic .ar-ic-bulle{fill:#fff;fill-opacity:.2;stroke:#fff;stroke-opacity:.75}
#rf-x-arbre .rf-ic.ar-ic .ar-ic-fil{stroke:#fff;stroke-opacity:.55}
html.theme-clair #rf-x-arbre .rf-ic.ar-ic .ar-ic-bulle{fill:#8C7BD6;fill-opacity:.22;stroke:#6B5BC4;stroke-opacity:.8}
html.theme-clair #rf-x-arbre .rf-ic.ar-ic .ar-ic-fil{stroke:#6B5BC4;stroke-opacity:.55}
#ec-arbre .ar-intro p{margin:0;line-height:1.45;font-size:.95rem}
html.theme-clair #ec-arbre .ar-intro{border-color:rgba(50,130,70,.18);background:linear-gradient(135deg,rgba(50,130,70,.07),rgba(200,150,30,.06))}
/* le mode Enfant : plus chaud, plus grand */
#ec-arbre.ar-mode-enfant .ar-intro{border-color:rgba(255,214,107,.30);background:linear-gradient(135deg,rgba(255,214,107,.12),rgba(255,160,120,.08))}
#ec-arbre.ar-mode-enfant .ar-intro p{font-size:1.02rem}
#ec-arbre.ar-mode-enfant .ar-onglet{min-height:52px;font-size:1.02rem}
#ec-arbre.ar-mode-enfant .ar-onglet.actif{background:#FFD66B;color:#3A2A12;border-color:#FFD66B}
#ec-arbre.ar-mode-enfant .ar-fiche-exemple{border-inline-start-color:#FFD66B;background:rgba(255,214,107,.10)}
#ec-arbre.ar-mode-enfant .ar-carte{min-height:124px;border-radius:20px;padding:14px 14px 14px 16px;background:rgba(255,214,107,.07);border-color:rgba(255,214,107,.26)}
#ec-arbre.ar-mode-enfant .ar-carte b{font-size:1.14rem}
#ec-arbre.ar-mode-enfant .ar-carte span{font-size:.92rem;line-height:1.4}
html.theme-clair #ec-arbre.ar-mode-enfant .ar-carte{background:rgba(255,190,60,.10);border-color:rgba(200,140,30,.28)}
html.theme-clair #ec-arbre.ar-mode-enfant .ar-intro{border-color:rgba(200,140,30,.25);background:linear-gradient(135deg,rgba(255,190,60,.12),rgba(255,140,100,.07))}
#ec-arbre .ar-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-arbre .ar-onglets::-webkit-scrollbar{display:none}
/* la barre défile : un léger fondu sur le bord où il reste des onglets à voir */
#ec-arbre .ar-onglets.plus-droite{-webkit-mask-image:linear-gradient(to right,#000 82%,transparent);mask-image:linear-gradient(to right,#000 82%,transparent)}
#ec-arbre .ar-onglets.plus-gauche{-webkit-mask-image:linear-gradient(to left,#000 82%,transparent);mask-image:linear-gradient(to left,#000 82%,transparent)}
#ec-arbre .ar-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-arbre .ar-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-arbre .ar-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-arbre .ar-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-arbre .ar-onglet.actif{background:#8FD19E;color:#1C2A21;border-color:#8FD19E}
#ec-arbre .ar-fiche h2{margin:0 0 10px;font-size:1.2rem;line-height:1.25}
#ec-arbre .ar-fiche-etiquette{margin:0 0 2px;font-size:.74rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;opacity:.7}
#ec-arbre .ar-fiche-sens{margin:0 0 12px;line-height:1.5}
#ec-arbre .ar-fiche-exemple{margin:0;padding:10px 12px;border-radius:14px;border-inline-start:3px solid #8FD19E;background:rgba(143,209,158,.10);line-height:1.5;font-style:italic;color:var(--encre-douce,#C4CFBC)}
#ec-arbre .ar-vide{margin:12px 4px;text-align:center;opacity:.75;line-height:1.5}
#ec-arbre .ar-grille{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
#ec-arbre .ar-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-arbre .ar-carte b{font-size:1rem;line-height:1.25;padding-inline-end:20px;overflow-wrap:anywhere}
#ec-arbre .ar-carte span{font-size:.8rem;line-height:1.35;color:var(--encre-douce,#C4CFBC)}
#ec-arbre .ar-carte small{font-size:.72rem;opacity:.65}
#ec-arbre .ar-pied{display:flex;flex-wrap:wrap;gap:5px;margin-top:auto;padding-top:4px}
#ec-arbre .ar-genre,#ec-arbre .ar-libre{font-style:normal;font-size:.68rem;padding:2px 7px;border-radius:999px;line-height:1.4}
#ec-arbre .ar-genre-jeu{background:rgba(232,184,107,.20);color:#F3D29C}
#ec-arbre .ar-genre-exo{background:rgba(143,209,158,.18);color:#B3E6BF}
#ec-arbre .ar-libre{background:rgba(111,207,151,.18);color:#9EE2BA}
#ec-arbre .ar-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-arbre .ar-carte{background:rgba(0,0,0,.03)}
html.theme-clair #ec-arbre .ar-fiche-exemple{background:rgba(50,130,70,.08);border-inline-start-color:#4E9A62}
html.theme-clair #ec-arbre .ar-genre-jeu{background:rgba(170,110,30,.12);color:#7A4E12}
html.theme-clair #ec-arbre .ar-genre-exo{background:rgba(50,130,70,.12);color:#24663A}
html.theme-clair #ec-arbre .ar-libre{background:rgba(40,150,90,.12);color:#1F7A48}
@media (max-width:340px){#ec-arbre .ar-grille{grid-template-columns:1fr}}

/* le lecteur plein écran */
html.ar-ouvert,html.ar-ouvert body{overflow:hidden}
.ar-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)}
.ar-lecteur[hidden]{display:none}
html.theme-clair .ar-lecteur{background:#F7F5FB;color:#2A2433}
.ar-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}
.ar-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 .ar-fermer{border-color:rgba(0,0,0,.18)}
.ar-titre{font-weight:700;font-size:1.05rem;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ar-info{font-size:.85rem;opacity:.75}
.ar-consigne{margin:6px auto 8px;max-width:560px;min-height:1.4em;font-size:1rem;line-height:1.4;text-align:center;opacity:.9}
.ar-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}
.ar-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 */
.ar-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:#8FD19E;color:#2A2233;font:inherit;font-weight:700;cursor:pointer;touch-action:manipulation}
.ar-lecteur .bouton.secondaire{background:transparent;color:inherit;border:1px solid var(--trait,rgba(255,255,255,.22))}
html.theme-clair .ar-lecteur .bouton.secondaire{border-color:rgba(0,0,0,.2)}
.ar-lecteur .bouton:disabled{opacity:.45;cursor:default}
.ar-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 .ar-fin{background:rgba(247,245,251,.88)}
.ar-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 .ar-fin-boite{background:#fff}
.ar-fin-boite h3{margin:0 0 8px;font-size:1.3rem}
.ar-fin-boite p{margin:0 0 16px;line-height:1.5;opacity:.9}
.ar-fin-boutons{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ar-fin-boutons .bouton{min-height:48px;min-width:0}
.ar-erreur{opacity:.8;text-align:center}

/* le lecteur en mode Enfant : texte plus grand, boutons plus larges, couleur chaude */
.ar-lecteur.ar-lecteur-enfant .ar-consigne{font-size:1.12rem}
.ar-lecteur.ar-lecteur-enfant .ar-titre{font-size:1.15rem}
.ar-lecteur.ar-lecteur-enfant .bouton{min-height:56px;padding:0 22px;font-size:1.05rem;background:#FFD66B;color:#3A2A12}
.ar-lecteur.ar-lecteur-enfant .bouton.secondaire{background:transparent;color:inherit}
.ar-lecteur.ar-lecteur-enfant .ar-fermer{width:52px;height:52px}
.ar-lecteur.ar-lecteur-enfant .ar-barre{grid-template-columns:52px 1fr auto}
.ar-lecteur.ar-lecteur-enfant .ar-fin-boutons .bouton{min-height:56px;min-width:0;padding:4px 10px;white-space:normal;overflow-wrap:anywhere;line-height:1.2}

/* « Le coin des enfants » : l'entrée « Les bulles d'idées » (même style que les autres groupes, icône en SVG en ligne) */
.menu-enfants .section-e.ar-enf{background:#E3EEF8}
.menu-enfants .section-e.ar-enf .ico svg{display:block;width:1.5em;height:1.5em;color:#20403F}