/* PORTÉ depuis site-final/src/css/produit.css par tools/site/porter-site-final.mjs : ne pas modifier à la main. */
/* Écrans du produit : exercice corrigé, aide aux devoirs, table des matières : extrait des composants de la maquette (produit.html). */

.pr-scene,.pr-icones{container-type:inline-size;font-family:Inter,system-ui,sans-serif;color:var(--texte);-webkit-font-smoothing:antialiased;text-align:left;line-height:1.4}
.pr-scene *,.pr-scene *::before,.pr-scene *::after,.pr-icones *{box-sizing:border-box}
.pr-scene p,.pr-icones p{margin:0}
.pr-mono{font-family:"IBM Plex Mono",ui-monospace,monospace;font-weight:500;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase}
.pr-svg-t{font-family:Inter,system-ui,sans-serif}
/* moteur d'étapes : pr-eN = « on a atteint l'étape N » (sans JS : toutes présentes = état final) */
.pr-fond{transition:opacity .4s ease}
.pr-fondu .pr-fond{opacity:0!important}
.pr-saut,.pr-saut *,.pr-saut *::before,.pr-saut *::after{transition:none!important}
.pr-pause *,.pr-pause *::before,.pr-pause *::after{animation-play-state:paused!important}
.pr-scene [data-pr-des]{transition:opacity .5s ease,transform .5s ease}
.pr-scene:not(.pr-e1) [data-pr-des="1"],.pr-scene:not(.pr-e2) [data-pr-des="2"],.pr-scene:not(.pr-e3) [data-pr-des="3"],.pr-scene:not(.pr-e4) [data-pr-des="4"],.pr-scene:not(.pr-e5) [data-pr-des="5"],.pr-scene:not(.pr-e6) [data-pr-des="6"],.pr-scene:not(.pr-e7) [data-pr-des="7"],.pr-scene:not(.pr-e8) [data-pr-des="8"],.pr-scene:not(.pr-e9) [data-pr-des="9"],.pr-scene:not(.pr-e10) [data-pr-des="10"]{opacity:0;transform:translateY(5px)}
.pr-scene [data-pr-ecrit]{clip-path:inset(-10px -10px -10px -10px);transition:clip-path 1s linear}
.pr-scene:not(.pr-e1) [data-pr-ecrit="1"],.pr-scene:not(.pr-e2) [data-pr-ecrit="2"],.pr-scene:not(.pr-e3) [data-pr-ecrit="3"],.pr-scene:not(.pr-e4) [data-pr-ecrit="4"],.pr-scene:not(.pr-e5) [data-pr-ecrit="5"],.pr-scene:not(.pr-e6) [data-pr-ecrit="6"],.pr-scene:not(.pr-e7) [data-pr-ecrit="7"],.pr-scene:not(.pr-e8) [data-pr-ecrit="8"],.pr-scene:not(.pr-e9) [data-pr-ecrit="9"],.pr-scene:not(.pr-e10) [data-pr-ecrit="10"]{clip-path:inset(-10px 100% -10px -10px)}
.pr-eti{display:flex;align-items:center;gap:7px;margin:0 0 9px 2px;color:var(--texte-3)}
.pr-eti::before{content:"";width:7px;height:7px;border-radius:50%;border:1.5px solid currentColor}
.pr-eti.pr-acc{color:var(--accent)}
.pr-eti.pr-acc::before{background:currentColor}
.pr-ok{flex:none;width:20px;height:20px;border-radius:50%;background:#097B99;color:#fff;display:grid;place-items:center}
.pr-ok svg{width:12px;height:12px}
.pr-arev{flex:none;display:inline-flex;align-items:center;gap:6px;font:600 11.5px/1 Inter,sans-serif;color:var(--texte-2);background:var(--bg-2);border:1px solid var(--bordure);border-radius:999px;padding:4px 9px 4px 8px;white-space:nowrap}
.pr-arev::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--erreur)}
.pr-faux{background:linear-gradient(var(--erreur),var(--erreur)) 0 100%/100% 2.5px no-repeat;padding-bottom:3px;transition:background-size .6s ease}
.pr-tient{display:inline-flex;align-items:center;gap:6px;font:600 13px/1 Inter,sans-serif;color:var(--accent);background:var(--teinte-bg);padding:6px 11px;border-radius:999px;white-space:nowrap}
.pr-tient::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ligne)}

/* 1 · probleme-recherche */
.pr-rech-in{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
@container (min-width:500px){.pr-rech-in{grid-template-columns:minmax(0,1.08fr) 22px minmax(0,1fr);align-items:stretch;gap:10px}}
.pr-rech-col{display:flex;flex-direction:column;min-width:0}
.pr-nav{position:relative;flex:1;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--bordure);border-radius:16px;overflow:hidden;box-shadow:var(--ombre)}
.pr-onglets{display:flex;align-items:flex-end;height:33px;padding:7px 8px 0;background:var(--bg-2);border-bottom:1px solid var(--bordure)}
.pr-og{display:flex;align-items:center;gap:5px;flex:1 1 0;min-width:0;max-width:130px;height:26px;padding:0 7px;margin-right:3px;border:1px solid var(--bordure);border-bottom:0;border-radius:7px 7px 0 0;background:var(--bg);font-size:10.5px;color:var(--texte-3);white-space:nowrap;overflow:hidden;transition:max-width .6s ease,flex-grow .6s ease,padding .6s ease,margin .6s ease,opacity .4s ease}
.pr-og span{overflow:hidden;text-overflow:ellipsis}
.pr-og i{flex:none;width:9px;height:9px;border-radius:2px;background:var(--texte-3);opacity:.45}
.pr-og i.pr-r{border-radius:50%}
.pr-og:last-child{background:var(--surface);color:var(--texte-2)}
.pr-rech:not(.pr-e1) .pr-og2,.pr-rech:not(.pr-e2) .pr-og3,.pr-rech:not(.pr-e3) .pr-og4,.pr-rech:not(.pr-e4) .pr-og5,.pr-rech:not(.pr-e5) .pr-og6{flex-grow:0;max-width:0;padding:0;margin:0;opacity:0;border-width:0}
.pr-adr{display:flex;align-items:center;gap:7px;height:28px;margin:8px 9px 0;padding:0 11px;border-radius:999px;background:var(--bg-2);font-size:11.5px;color:var(--texte-2);white-space:nowrap;overflow:hidden}
.pr-adr svg{flex:none;width:13px;height:13px;color:var(--texte-3)}
.pr-fil{position:relative;height:232px;overflow:hidden;margin-top:6px;-webkit-mask-image:linear-gradient(transparent,#000 9%,#000 80%,transparent);mask-image:linear-gradient(transparent,#000 9%,#000 80%,transparent)}
.pr-piste{padding:0 10px}
.pr-anim .pr-piste{animation:pr-defile 30s linear infinite}
@keyframes pr-defile{to{transform:translateY(-50%)}}
.pr-c{margin:8px 0 2px;background:var(--surface);border:1px solid var(--bordure);border-radius:11px;padding:8px;box-shadow:0 1px 2px rgba(10,58,69,.07),0 4px 12px rgba(10,58,69,.05);transform:rotate(-.7deg) translateX(-2px)}
.pr-c:nth-child(even){transform:rotate(.8deg) translateX(3px)}
.pr-vid{display:grid;grid-template-columns:92px minmax(0,1fr);gap:9px;align-items:start}
.pr-vign{position:relative;aspect-ratio:16/9;border-radius:6px;background:var(--bg-2);overflow:hidden;color:var(--texte-3)}
.pr-vign svg{position:absolute;inset:0;width:100%;height:100%}
.pr-duree{position:absolute;right:3px;bottom:3px;background:rgba(20,24,28,.8);color:#fff;font:500 9px/1.3 "IBM Plex Mono",monospace;padding:0 3px;border-radius:3px}
.pr-ct{font-size:11.8px;font-weight:600;line-height:1.3;color:var(--texte)}
.pr-cm{font-size:10.3px;line-height:1.35;color:var(--texte-3);margin-top:3px}
.pr-court{display:grid;grid-template-columns:40px minmax(0,1fr);gap:9px;align-items:center}
.pr-court-v{position:relative;height:62px;border-radius:6px;background:linear-gradient(165deg,#31506B,#1D1D1F);overflow:hidden}
.pr-court-v svg{position:absolute;inset:0;width:100%;height:100%}
.pr-forum .pr-ct{margin:2px 0 4px}
.pr-rep{display:grid;grid-template-columns:13px minmax(0,1fr) auto;gap:7px;align-items:center;font-size:11px;line-height:1.3;color:var(--texte-2);padding:4px 0 3px;border-top:1px solid var(--bordure)}
.pr-rep i{width:13px;height:13px;border-radius:50%;background:var(--bg-2);border:1px solid var(--bordure)}
.pr-vote{font:500 9.5px "IBM Plex Mono",monospace;color:var(--texte-3)}
.pr-minut{position:absolute;left:10px;bottom:10px;z-index:2;display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 8px;border-radius:999px;background:var(--surface);border:1px solid var(--bordure);box-shadow:var(--ombre);font-size:12px;color:var(--texte-3)}
.pr-minut svg{width:18px;height:18px;color:var(--texte-2)}
.pr-anim .pr-aig{animation:pr-tourne 3s linear infinite;transform-origin:9px 9.5px}
@keyframes pr-tourne{to{transform:rotate(360deg)}}
.pr-minut b{font:500 13.5px "IBM Plex Mono",monospace;color:var(--texte)}
.pr-m{display:none}
.pr-rech:not(.pr-e1) .pr-m0,.pr-e1:not(.pr-e2) .pr-m1,.pr-e2:not(.pr-e3) .pr-m2,.pr-e3:not(.pr-e4) .pr-m3,.pr-e4:not(.pr-e5) .pr-m4,.pr-e5 .pr-m5{display:inline}
.pr-fleche{display:grid;place-items:center;color:var(--texte-3);height:22px}
.pr-fleche svg{width:20px;height:20px;transform:rotate(90deg)}
@container (min-width:500px){.pr-fleche{height:auto;padding-top:26px}.pr-fleche svg{transform:none}}
.pr-pc{flex:1;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--bordure);border-radius:16px;box-shadow:var(--ombre);padding:13px 13px 12px;transition:box-shadow .8s ease}
.pr-e5 .pr-pc{box-shadow:0 0 0 4px var(--teinte-bg),var(--ombre)}
.pr-band{display:flex;justify-content:space-between;gap:8px;color:var(--accent);border-bottom:1px solid var(--bordure);padding-bottom:9px;margin-bottom:11px}
.pr-pc-haut{display:grid;grid-template-columns:minmax(0,1fr) 84px;gap:10px;align-items:center}
.pr-pc-t{font-size:22px;font-weight:800;letter-spacing:-.025em;line-height:1.1;color:var(--texte);margin-bottom:4px!important;white-space:nowrap}
.pr-pc-t span{font-weight:500;color:var(--texte-3);font-size:15px;letter-spacing:0}
.pr-pc-s{font-size:13.5px;line-height:1.4;color:var(--texte-2)}
.pr-tri{width:84px;height:auto;display:block;overflow:visible}
.pr-res{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:6px}
@container (min-width:500px){.pr-res{margin-top:auto;padding-top:12px}}
.pr-res li{display:grid;grid-template-columns:30px minmax(0,1fr) 10px;gap:10px;align-items:center;padding:7px 10px 7px 7px;border-radius:11px;background:var(--bg-2)}
.pr-res li>svg:last-child{width:10px;height:10px;color:var(--texte-3)}
.pr-tuile{width:30px;height:30px;border-radius:8px;background:var(--teinte-bg);color:var(--accent);display:grid;place-items:center}
.pr-tuile svg{width:17px;height:17px}
.pr-res b{display:block;font-size:14px;line-height:1.2;color:var(--texte)}
.pr-res small{display:block;font-size:11.5px;line-height:1.3;color:var(--texte-3)}

/* 2 · probleme-icones */
.pi-ic{width:40px;height:40px;display:block;flex:none}
.pr-icones{display:grid;gap:22px}
.pr-ic-liste{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
@container (min-width:460px){.pr-ic-liste{grid-template-columns:1fr 1fr}.pr-ic-liste>li:last-child:nth-child(odd){grid-column:1/-1}}
.pr-ic-item{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;align-items:center;padding:9px 12px 9px 9px;background:var(--surface);border:1px solid var(--bordure);border-radius:14px;font-size:14.5px;font-weight:600;line-height:1.3;color:var(--texte)}
.pr-ic-item [data-ic]{display:grid;place-items:center;width:52px;height:52px;border-radius:11px;background:var(--teinte-bg);color:var(--accent)}
.pr-ic-csq{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
@container (min-width:460px){.pr-ic-csq{grid-template-columns:1fr 1fr 1fr;gap:0}}
.pr-ic-csq li{display:grid;grid-template-columns:52px minmax(0,1fr);gap:12px;align-items:center;font-size:14.5px;font-weight:600;line-height:1.3;color:var(--texte);position:relative}
.pr-ic-csq [data-ic]{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;border:1px solid var(--bordure);background:var(--surface);color:var(--texte-2)}
@container (min-width:460px){
 .pr-ic-csq li{grid-template-columns:1fr;justify-items:center;text-align:center;gap:10px;padding:0 6px}
 .pr-ic-csq li+li::before{content:"";position:absolute;top:26px;left:calc(-50% + 34px);width:calc(100% - 68px);height:0;border-top:1.5px dashed var(--rail-fort)}
}

/* 3 · table-matieres */
.pr-tdm-carte{background:var(--surface);border:1px solid var(--bordure);border-radius:18px;box-shadow:var(--ombre);padding:14px 14px 16px;overflow:hidden}
.pr-tdm .pr-band{margin-bottom:10px}
.pr-ico{flex:none;width:13px;height:13px}
.pr-chap2{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:2px}
.pr-chap2>li{display:grid;grid-template-columns:16px minmax(0,1fr) 12px;gap:8px;align-items:center;padding:7px 10px;border-radius:9px;font-size:13.5px;line-height:1.3;color:var(--texte-2)}
.pr-chap2>li>i{font:500 10.5px "IBM Plex Mono",monospace;font-style:normal;color:var(--texte-3)}
.pr-chap2>li>svg{width:12px;height:12px;color:var(--texte-3)}
.pr-chap2>li.pr-act{background:var(--teinte-bg);color:var(--texte);font-weight:700}
.pr-chap2>li.pr-act>svg{color:var(--accent);transform:rotate(90deg)}
.pr-nlbl{display:block;color:var(--texte-3);margin:0 0 7px 2px}
.pr-tn{display:grid;gap:5px;padding:9px 11px;margin-bottom:6px;border:1px solid var(--bordure);border-radius:11px}
@container (min-width:500px){.pr-tn{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px}}
@container (max-width:499px){.pr-tns>.pr-tn:nth-child(3){display:none}}
.pr-tn b{font-size:13.5px;line-height:1.25;color:var(--texte)}
.pr-tn-a{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:12px;font-weight:600;color:var(--accent)}
.pr-tn-a span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.pr-rabat{margin-top:10px}
.pr-rb-tete{display:grid;grid-template-columns:20px minmax(0,1fr) auto 12px;gap:10px;align-items:center;padding:10px 12px;border-radius:12px;background:var(--bg-2);border:1px solid var(--bordure);font-size:13.5px;font-weight:700;line-height:1.25;color:var(--texte);transition:background-color .5s,border-radius .3s}
.pr-rb-tete small{font:500 10.5px "IBM Plex Mono",monospace;color:var(--texte-3);white-space:nowrap}
.pr-rb-tete>svg{width:12px;height:12px;color:var(--texte-3);transform:rotate(90deg);transition:transform .5s}
.pr-tdm:not(.pr-e2) .pr-rb-tete>svg{transform:none}
.pr-e1:not(.pr-e2) .pr-rb-tete{background:var(--teinte-bg)}
.pr-rb-st{position:relative;width:20px;height:20px;display:grid;place-items:center}
.pr-rb-st i{width:14px;height:14px;border-radius:50%;border:3px solid var(--ligne);background:var(--surface)}
.pr-anim.pr-e1:not(.pr-e2) .pr-rb-st::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--ligne);animation:pr-onde 1.2s ease-out infinite}
@keyframes pr-onde{0%{transform:scale(.5);opacity:.9}100%{transform:scale(1.9);opacity:0}}
.pr-rb-corps{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;padding:6px 0 0 13px}
@container (min-width:500px){.pr-rb-corps{grid-template-columns:minmax(0,1fr) 218px;align-items:start}}
.pr-aq{position:relative;list-style:none;margin:0;padding:0}
.pr-aq::before{content:"";position:absolute;left:9px;top:-21px;bottom:22px;width:2px;background:var(--bordure);transition:opacity .5s}
.pr-tdm:not(.pr-e2) .pr-aq::before{opacity:0}
.pr-aq-on{position:absolute;left:8.5px;top:-21px;width:3px;height:39px;border-radius:2px;background:var(--ligne);transform-origin:50% 0;transition:transform .7s cubic-bezier(.5,0,.2,1)}
.pr-tdm:not(.pr-e3) .pr-aq-on{transform:scaleY(0)}
.pr-aq>li{position:relative;padding:8px 0 8px 30px}
.pr-aq>li::before{content:"";position:absolute;left:4px;top:12px;width:12px;height:12px;border-radius:50%;border:2.5px solid var(--rail-fort);background:var(--surface);transition:border-color .4s .4s,background-color .4s .4s}
.pr-aq>li:nth-of-type(2){transition-delay:.12s}.pr-aq>li:nth-of-type(3){transition-delay:.24s}
.pr-aq-n{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;line-height:1.3;color:var(--texte-2);transition:color .4s}
.pr-aq-n svg{margin-left:auto;width:12px;height:12px;color:var(--texte-3)}
.pr-e3 .pr-aq>li:first-of-type::before{border-color:var(--ligne);background:var(--ligne)}
.pr-e3 .pr-aq>li:first-of-type .pr-aq-n{color:var(--texte);font-weight:700}
.pr-aq-bt{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
.pr-aq-bt span{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:8px;border:1px solid var(--bordure);background:var(--surface);font-size:12px;font-weight:600;line-height:1.2;color:var(--texte);white-space:nowrap;transition:background-color .4s,border-color .4s,color .4s}
.pr-aq-bt svg{color:var(--accent)}
.pr-e4 .pr-aq-bt .pr-la-fiche{background:var(--teinte-bg);border-color:var(--ligne);color:var(--accent)}
.pr-fp{min-width:0;padding:10px 12px 11px;border-radius:11px;border:1px solid var(--bordure);background:var(--surface);box-shadow:var(--ombre);transition:opacity .6s ease,transform .7s cubic-bezier(.3,.7,.2,1)}
.pr-tdm:not(.pr-e5) .pr-fp{opacity:0;transform:translateX(18px)}
.pr-fp-k{display:block;color:var(--accent);font-size:9.5px}
.pr-fp-t{font-size:14px;font-weight:800;letter-spacing:-.015em;line-height:1.2;margin:2px 0 8px!important;color:var(--texte)}
.pr-fp-l{display:block;color:var(--texte-3);font-size:9px;margin-bottom:2px}
.pr-fp p.pr-fp-x{font-size:12px;line-height:1.38;color:var(--texte-2);margin-bottom:8px}
.pr-fp-ex{position:relative;padding:4px 0 2px;margin-bottom:8px}
.pr-fp-ex{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.pr-fp-eq{font-size:17px;font-weight:700;color:var(--texte);white-space:nowrap}
.pr-fp-eq span{display:inline-block;padding:0 1px 3px;border-bottom:1.5px solid var(--ligne);border-radius:0 0 7px 7px}
.pr-fp-ex em{font:700 19px/1 Caveat,cursive;font-style:normal;color:var(--accent)}
@container (max-width:499px){.pr-tdm .pr-band span+span{display:none}}
.pr-fp-piege{border-left:2px solid var(--rail-fort);padding-left:8px}

/* 4 · aide-devoirs */
.pr-dv-scene{position:relative;background:var(--bg-2);border:1px solid var(--bordure);border-radius:18px;padding:14px 12px 18px;overflow:hidden}
@container (min-width:500px){.pr-dv-scene{padding:16px 22px 22px}}
.pr-dv-statut{display:flex;justify-content:center;margin-bottom:14px}
.pr-dv-pil{display:inline-grid;align-items:center;justify-items:center;padding:6px 13px 6px 11px;border-radius:999px;background:var(--surface);border:1px solid var(--bordure);box-shadow:0 1px 3px rgba(10,58,69,.08);font-size:12.5px;font-weight:600;color:var(--texte-2)}
.pr-dv-pil>span{grid-area:1/1;display:flex;align-items:center;gap:8px;white-space:nowrap;opacity:0;transition:opacity .35s}
.pr-dv-pil>span::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--rail-fort)}
.pr-dv-pil>span.pr-s3::before{background:var(--ligne)}
.pr-devoir:not(.pr-e2) .pr-s0,.pr-e2:not(.pr-e3) .pr-s1,.pr-e3:not(.pr-e4) .pr-s2,.pr-e4 .pr-s3{opacity:1}
.pr-anim.pr-e2:not(.pr-e3) .pr-s1::before{animation:pr-clign 1s ease-in-out infinite}
@keyframes pr-clign{50%{opacity:.25}}
.pr-dv-cadre{position:relative}
.pr-feuille{position:relative;display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"tete" "l1" "l2" "l3" "l4" "marge" "act";align-items:center;padding:14px 14px 16px 36px;border-radius:5px;background-color:var(--surface);background-image:linear-gradient(90deg,transparent 25px,var(--rail) 25px,var(--rail) 26.5px,transparent 26.5px),linear-gradient(var(--pr-q,rgba(11,143,178,.13)) 1px,transparent 1px),linear-gradient(90deg,var(--pr-q,rgba(11,143,178,.13)) 1px,transparent 1px);background-size:100% 100%,17px 17px,17px 17px;background-position:0 0,0 -1px,-1px 0;box-shadow:var(--ombre);transform:none;transition:transform 1.1s cubic-bezier(.3,.7,.2,1),box-shadow 1.1s}
@container (min-width:500px){.pr-feuille{grid-template-columns:minmax(0,1fr) 178px;column-gap:16px;grid-template-areas:"tete tete" "l1 ." "l2 marge" "l3 marge" "l4 marge" "act act";padding:16px 18px 18px 40px;background-image:linear-gradient(90deg,transparent 28px,var(--rail) 28px,var(--rail) 29.5px,transparent 29.5px),linear-gradient(var(--pr-q,rgba(11,143,178,.13)) 1px,transparent 1px),linear-gradient(90deg,var(--pr-q,rgba(11,143,178,.13)) 1px,transparent 1px)}}
.pr-devoir:not(.pr-e4) .pr-feuille{transform:rotate(-4deg) scale(.92);box-shadow:0 2px 4px rgba(10,58,69,.12),0 22px 40px rgba(10,58,69,.16)}
.pr-f-tete{grid-area:tete;margin-bottom:6px}
.pr-f-tete .pr-mono{display:block;color:var(--texte-3);font-size:10px}
.pr-f-tete p{font-size:15px;font-weight:700;margin-top:3px;color:var(--texte)}
.pr-dl{position:relative;display:flex;align-items:center;gap:10px;min-width:0;padding:1px 0}
.pr-dl1{grid-area:l1}.pr-dl2{grid-area:l2;flex-wrap:wrap;row-gap:4px}.pr-dl3{grid-area:l3}.pr-dl4{grid-area:l4}
.pr-main{font:700 27px/1.2 Caveat,cursive;color:var(--texte-2);white-space:nowrap}
.pr-dn{position:absolute;left:-24px;top:50%;margin-top:-8px;font:500 10.5px/16px "IBM Plex Mono",monospace;color:var(--texte-3);transition:opacity .5s}
.pr-devoir:not(.pr-e4) .pr-dn{opacity:0}
.pr-marge{transition:border-color .5s}
.pr-devoir:not(.pr-e4) .pr-marge{border-color:transparent}
.pr-dl::after{content:"";position:absolute;left:-6px;top:1px;bottom:1px;width:var(--pr-lw,150px);border:1.5px solid var(--ligne);border-radius:6px;background:rgba(24,180,214,.08);opacity:0;transition:opacity .3s}
.pr-e3:not(.pr-e4) .pr-dl::after{opacity:1}
.pr-dl2::after{transition-delay:.15s}.pr-dl3::after{transition-delay:.3s}.pr-dl4::after{transition-delay:.45s}
.pr-devoir:not(.pr-e6) .pr-faux{background-size:0 2.5px}
.pr-dl3,.pr-dl4{transition:opacity .6s}
.pr-e6 .pr-dl3,.pr-e6 .pr-dl4{opacity:.4}
.pr-frc{display:inline-flex;flex-direction:column;align-items:center;vertical-align:middle;line-height:.95;font-size:23px;margin-left:2px}
.pr-frc>span:first-child{border-bottom:2px solid currentColor;padding:0 3px 1px}
.pr-marge{grid-area:marge;align-self:start;margin:4px 0 8px;padding:2px 0 2px 12px;border-left:2px solid var(--ligne)}
@container (min-width:500px){.pr-marge{margin:6px 0 0;border-left:1.5px dashed var(--rail-fort);padding:0 0 0 14px}}
.pr-marge-n{display:block;font-size:9.5px;color:var(--texte-3);margin-bottom:2px}
@container (min-width:500px){.pr-marge-n{display:none}}
.pr-prof{font:700 22px/1.12 Caveat,cursive;color:var(--accent)}
.pr-cause{display:grid;grid-template-columns:18px minmax(0,1fr);gap:8px;align-items:center;margin-top:10px;padding:7px 10px 7px 8px;border-radius:10px;background:var(--surface);border:1px solid var(--bordure);box-shadow:0 1px 3px rgba(10,58,69,.07)}
.pr-cause i{width:14px;height:14px;margin-left:2px;border-radius:50%;border:3px solid var(--ligne);background:var(--surface)}
.pr-cause .pr-mono{display:block;font-size:9.5px;color:var(--texte-3)}
.pr-cause b{display:block;font-size:13px;line-height:1.25;color:var(--texte)}
.pr-cause b span{font:500 10.5px "IBM Plex Mono",monospace;color:var(--accent);margin-left:4px;white-space:nowrap}
.pr-actions{grid-area:act;display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.pr-bt{flex:1 1 auto;justify-content:center;display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:0 11px;border-radius:10px;font-size:14.5px;font-weight:600;background:#097B99;color:#fff;white-space:nowrap}
.pr-bt svg{width:15px;height:15px}
@container (min-width:500px){.pr-bt{flex:none;padding:0 15px}}
.pr-bt.pr-sec{background:var(--surface);color:var(--texte);box-shadow:inset 0 0 0 1.5px var(--rail-fort)}
.pr-viseur{position:absolute;inset:-8px -6px;pointer-events:none;color:var(--accent);opacity:0;transform:scale(1);transition:opacity .4s,transform .7s cubic-bezier(.3,.7,.2,1)}
.pr-viseur::before{content:"";position:absolute;inset:0;background:linear-gradient(currentColor,currentColor) 0 0/24px 2.5px,linear-gradient(currentColor,currentColor) 0 0/2.5px 24px,linear-gradient(currentColor,currentColor) 100% 0/24px 2.5px,linear-gradient(currentColor,currentColor) 100% 0/2.5px 24px,linear-gradient(currentColor,currentColor) 0 100%/24px 2.5px,linear-gradient(currentColor,currentColor) 0 100%/2.5px 24px,linear-gradient(currentColor,currentColor) 100% 100%/24px 2.5px,linear-gradient(currentColor,currentColor) 100% 100%/2.5px 24px;background-repeat:no-repeat}
.pr-devoir:not(.pr-e3) .pr-viseur{opacity:1}
.pr-devoir:not(.pr-e1) .pr-viseur{transform:scale(1.03)}
.pr-flash{position:absolute;inset:-20px;background:#fff;opacity:0;pointer-events:none}
.pr-anim.pr-e1:not(.pr-e2) .pr-flash{animation:pr-flash .7s ease-out}
@keyframes pr-flash{0%{opacity:0}12%{opacity:.75}100%{opacity:0}}
.pr-scan{position:absolute;left:4px;right:4px;top:100%;height:2px;border-radius:2px;background:var(--ligne);box-shadow:0 0 14px 3px rgba(24,180,214,.45);opacity:0;transition:top 1.5s linear,opacity .25s}
.pr-devoir:not(.pr-e2) .pr-scan{top:0}
.pr-e2:not(.pr-e3) .pr-scan{opacity:1}

/* 5 · exercice-demarche */
.pr-ex-carte{background:var(--surface);border:1px solid var(--bordure);border-radius:18px;box-shadow:var(--ombre);padding:15px 15px 16px}
.pr-ex .pr-band{margin-bottom:12px}
.pr-ex-cons{font-size:16.5px;font-weight:700;margin-bottom:6px;color:var(--texte)}
.pr-ex-cons span{font-weight:800;letter-spacing:.01em}
.pr-ex-l{display:flex;align-items:center;gap:10px;min-height:36px;padding:1px 0}
.pr-ex-l .pr-n{flex:none;width:12px;font:500 11px "IBM Plex Mono",monospace;color:var(--texte-3)}
.pr-ex-l .pr-main{font-size:clamp(23px,7.4cqi,27px);color:var(--texte)}
.pr-ex-l .pr-fin{margin-left:auto;display:flex;align-items:center;gap:8px}
.pr-ex:not(.pr-e2) .pr-faux{background-size:0 2.5px}
.pr-ex-err{margin:6px 0 10px 22px;border-left:3px solid var(--erreur);background:var(--erreur-bg);border-radius:0 10px 10px 0;padding:8px 12px 9px;font-size:14px;line-height:1.42;color:var(--texte)}
.pr-ex-err .pr-mono{display:block;color:var(--erreur);font-size:10px;margin-bottom:3px}
.pr-ex-err b{font-weight:700}
.pr-cap{margin:0 0 12px 22px;border-radius:14px;background:linear-gradient(135deg,#097B99 0%,#0A3A45 100%);color:#fff;padding:11px 12px 10px;overflow:hidden}
.pr-cap-tete{display:flex;align-items:center;gap:10px;font-size:14px;line-height:1.25;font-weight:600}
.pr-cap-tete small{display:block;font:500 10.5px "IBM Plex Mono",monospace;opacity:.8;font-weight:500}
.pr-cap-tri{flex:none;width:26px;height:26px;border-radius:50%;background:#fff;display:grid;place-items:center}
.pr-cap-tri svg{width:11px;height:11px;margin-left:2px}
.pr-cap-corps{display:grid;grid-template-columns:112px minmax(0,1fr);gap:14px;align-items:center;margin-top:10px}
.pr-cap-fig{width:112px;height:auto;display:block;overflow:visible}
.pr-cap-fig text{font-family:Inter,sans-serif;font-weight:600;fill:#fff}
.pr-cap-fig .pr-z{transition:fill .6s,opacity .6s}
.pr-ex:not(.pr-e5) .pr-z1,.pr-ex:not(.pr-e5) .pr-z4{opacity:0}
.pr-ex:not(.pr-e6) .pr-z2,.pr-ex:not(.pr-e6) .pr-z3{opacity:0}
.pr-cap-f{font-size:13.5px;line-height:1.5;font-weight:600}
.pr-cap-f em{font-style:normal;color:#18B4D6;font-weight:700}
.pr-cap-f div+div{margin-top:2px}
.pr-cap-pied{display:flex;align-items:center;gap:10px;margin-top:10px;font:500 10px "IBM Plex Mono",monospace;opacity:.85}
.pr-cap-barre{flex:1;height:3px;border-radius:2px;background:rgba(255,255,255,.22)}
.pr-cap-barre i{display:block;height:100%;width:62%;border-radius:2px;background:#18B4D6;transition:width 2.6s linear}
.pr-ex:not(.pr-e5) .pr-cap-barre i{width:6%}
.pr-ex:not(.pr-e6) .pr-cap-barre i{width:30%}
.pr-ex:not(.pr-e4) .pr-cap-barre i{width:0}
.pr-ex-rep{display:block;color:var(--texte-3);margin:2px 0 2px 22px;font-size:10px}
.pr-ex-l .pr-ok,.pr-ex-l .pr-tient{transition:opacity .4s,transform .4s}
@container (max-width:400px){.pr-ex-err,.pr-cap,.pr-ex-rep{margin-left:0}.pr-cap-corps{grid-template-columns:96px minmax(0,1fr);gap:12px}.pr-cap-fig{width:96px}}
@media (prefers-reduced-motion:reduce){.pr-scene *,.pr-scene *::before,.pr-scene *::after{transition:none!important;animation:none!important}}

/* Exercice de français (accueil, 23 octobre) : des phrases plutôt que des expressions, donc un corps plus petit */
.pr-ex-fr .pr-ex-cons span{font-weight:600}
.pr-ex-fr .pr-ex-l .pr-main{font-size:clamp(16px,4.4cqi,19px);line-height:1.35}
.pr-ex-fr .pr-ex-l{min-height:34px}
.pr-cap-corps-fr{grid-template-columns:150px minmax(0,1fr)!important}
.pr-cap-fig-fr{width:150px!important;height:auto}
.pr-cap-fig-fr text{fill:#fff}
@container (max-width:400px){.pr-cap-corps-fr{grid-template-columns:120px minmax(0,1fr)!important}.pr-cap-fig-fr{width:120px!important}}