/* =============================================================
   NIVEAUX.CSS — Mimba-Educ : la feuille claire du cours et de la série,
   avec le style de chaque niveau (choisi par niveaux.php).
   version 1.0 — 2026-10-20
     31/41 expérimental      .niv-exp       cahier de laboratoire
     32/42 technique         .niv-tech      dessin technique
     33/43 mathématiques     .niv-math      cahier quadrillé
     34/44 informatique      .niv-info      écran de code
     21    exp. + maths      .niv-expmath
     22    techno + info     .niv-techinfo
     11    général           .niv-gen
     71/81/91 collège        .niv-col .col7 / .col8 / .col9 (de plus en plus sobre)
   Les côtés de la page gardent le thème choisi par l'élève : seule la feuille (.feuille) change.
   ============================================================= */

/* ── 1. Couleurs de chaque famille ── */
html.niv{--n1:#1d4ed8;--n1-rgb:29,78,216;--n2:#7c3aed;--npale:#eff4ff;--ntf:'Segoe UI',system-ui,-apple-system,Roboto,sans-serif;--nrb:10px;--nrf:18px;--nfs:1.06rem;--ntitre:#0f172a}
html.niv-exp{--n1:#0f766e;--n1-rgb:15,118,110;--n2:#0284c7;--npale:#effcf8}
html.niv-tech{--n1:#1e40af;--n1-rgb:30,64,175;--n2:#ea580c;--npale:#f0f5ff;--nrb:3px;--nrf:8px;--ntf:Bahnschrift,'Arial Narrow','Segoe UI',sans-serif}
html.niv-math{--n1:#4338ca;--n1-rgb:67,56,202;--n2:#7c3aed;--npale:#f3f4ff;--ntf:Cambria,Georgia,'Times New Roman',serif}
html.niv-info{--n1:#047857;--n1-rgb:4,120,87;--n2:#0e7490;--npale:#effdf6;--ntf:Consolas,'Cascadia Code','Courier New',monospace}
html.niv-expmath{--n1:#0f766e;--n1-rgb:15,118,110;--n2:#4338ca;--npale:#f1fbf9}
html.niv-techinfo{--n1:#1e40af;--n1-rgb:30,64,175;--n2:#047857;--npale:#f0f6ff;--nrb:5px;--ntf:Bahnschrift,'Segoe UI',sans-serif}
html.niv-gen{--n1:#1d4ed8;--n1-rgb:29,78,216;--n2:#7c3aed;--npale:#eff4ff}
html.niv-col{--ntf:'Trebuchet MS','Segoe UI',sans-serif}
html.col7{--n1:#ea580c;--n1-rgb:234,88,12;--n2:#db2777;--n3:#0d9488;--npale:#fff7ed;--nrb:20px;--nrf:26px;--nfs:1.12rem;--ntitre:#9a3412}
html.col8{--n1:#ea580c;--n1-rgb:234,88,12;--n2:#7c3aed;--n3:#0284c7;--npale:#fff8f1;--nrb:15px;--nrf:22px;--nfs:1.09rem;--ntitre:#7c2d12}
html.col9{--n1:#0d9488;--n1-rgb:13,148,136;--n2:#2563eb;--n3:#d97706;--npale:#f0fdfa;--nrb:11px;--nrf:18px;--nfs:1.06rem}

/* ── 2. La feuille : couleurs claires pour tout ce qu'elle contient ── */
.feuille{
  --hi:var(--ntitre);--text:#273449;--text-sub:#273449;--muted:#64748b;
  --accent:var(--n1);--acc-rgb:var(--n1-rgb);--violet:var(--n2);--pink:var(--n2);
  --gold:#b45309;--green:#047857;--red:#b91c1c;--line:rgba(15,23,42,.12);--card:#ffffff;
  --bg-rgb:253,253,251;--bg2-rgb:255,255,255;--shadow:rgba(15,23,42,.22);
  --surface:var(--cadre-fond,#f4f7fb);--border:var(--cadre-bord,#d5dde8);
  background:var(--npapier,#fdfdfb)!important;color:#273449;border:none!important;border-radius:var(--nrf)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 30px 70px -30px rgba(0,0,0,.65),0 0 0 1px rgba(0,0,0,.06)!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  font-family:var(--npolice,Cambria,'Cambria Math',Georgia,'Times New Roman',serif);overflow:hidden;
}
.feuille h1,.feuille h2,.feuille h3,.feuille h4,.feuille th,.feuille .cb-remark-title{font-family:var(--ntf)}

/* ── 3. Le bandeau du haut (motif du niveau, matière, niveau, thème, chapitre) ── */
.nv-haut{position:relative;margin:0}
.nv-bande{position:relative;height:96px;padding:14px 40px 14px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;background:var(--npale)}
.nv-etiq{position:absolute;right:16px;top:12px;z-index:1;font:800 11.5px/1.4 var(--ntf);font-family:var(--ntf);background:#fff;color:var(--n1);
  border:1px solid rgba(var(--n1-rgb),.3);border-radius:999px;padding:3px 11px;max-width:calc(100% - 32px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nv-th{position:relative;z-index:1;font:700 13.5px/1.35 var(--ntf);font-family:var(--ntf);color:var(--n1);max-width:calc(100% - 150px)}
.nv-motif{position:absolute;right:16px;top:34px;width:128px;height:58px;color:var(--n1);opacity:.6;pointer-events:none}
.nv-titre{margin:0;padding:20px 40px 16px;border-bottom:3px solid var(--n1);font-family:var(--ntf);color:var(--ntitre);
  font-weight:800;font-size:clamp(1.5rem,3.8vw,2.15rem);line-height:1.18;letter-spacing:-.01em;text-wrap:balance}
@media(max-width:700px){
  .nv-bande{height:88px;padding:12px 18px}
  .nv-th{font-size:12.5px;max-width:calc(100% - 96px)}
  .nv-motif{width:86px;height:42px;right:10px;top:38px}
  .nv-titre{padding:16px 18px 13px;font-size:1.45rem}
}

/* motifs des bandeaux */
.niv-exp .nv-bande,.niv-expmath .nv-bande::before{background-color:#effcf8;background-image:linear-gradient(rgba(15,118,110,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(15,118,110,.13) 1px,transparent 1px);background-size:14px 14px}
.niv-tech .nv-bande,.niv-techinfo .nv-bande::before{background-color:#eaf1ff;background-image:linear-gradient(rgba(30,64,175,.22) 1px,transparent 1px),linear-gradient(90deg,rgba(30,64,175,.22) 1px,transparent 1px),linear-gradient(rgba(30,64,175,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(30,64,175,.08) 1px,transparent 1px);background-size:50px 50px,50px 50px,10px 10px,10px 10px}
.niv-math .nv-bande,.niv-expmath .nv-bande::after{background-color:#f6f7ff;background-image:linear-gradient(rgba(67,56,202,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(67,56,202,.15) 1px,transparent 1px);background-size:8px 8px}
.niv-info .nv-bande{background:#0b1f1a;background-image:repeating-linear-gradient(0deg,rgba(52,211,153,.07) 0 1px,transparent 1px 22px)}
.niv-info .nv-th{color:#6ee7b7}
.niv-info .nv-motif{color:#34d399;opacity:.75}
.niv-expmath .nv-bande::before,.niv-expmath .nv-bande::after,.niv-techinfo .nv-bande::before{content:"";position:absolute;top:0;bottom:0}
.niv-expmath .nv-bande::before{left:0;width:55%;-webkit-mask:linear-gradient(90deg,#000 70%,transparent);mask:linear-gradient(90deg,#000 70%,transparent)}
.niv-expmath .nv-bande::after{right:0;width:55%;-webkit-mask:linear-gradient(270deg,#000 70%,transparent);mask:linear-gradient(270deg,#000 70%,transparent)}
.niv-techinfo .nv-bande::before{left:0;right:0}
.niv-gen .nv-bande{background-image:radial-gradient(rgba(29,78,216,.16) 1.2px,transparent 1.3px),linear-gradient(110deg,#eef4ff,#f5f0ff);background-size:14px 14px,auto}
.niv-col .nv-bande{background-color:var(--npale);background-image:radial-gradient(circle at 58% 28%,rgba(var(--n1-rgb),.3) 0 7px,transparent 8px),radial-gradient(circle at 66% 78%,rgba(219,39,119,.22) 0 5px,transparent 6px),radial-gradient(circle at 74% 34%,rgba(13,148,136,.28) 0 6px,transparent 7px),radial-gradient(circle at 92% 82%,rgba(var(--n1-rgb),.22) 0 5px,transparent 6px),radial-gradient(circle at 50% 80%,rgba(234,179,8,.26) 0 4px,transparent 5px)}
.col9 .nv-bande{background-image:radial-gradient(circle at 66% 78%,rgba(var(--n1-rgb),.2) 0 5px,transparent 6px),radial-gradient(circle at 92% 82%,rgba(37,99,235,.16) 0 5px,transparent 6px)}
.niv-tech .nv-titre{font-weight:700;letter-spacing:.01em}
.niv-math .nv-titre{font-weight:700;letter-spacing:0}
.niv-info .nv-titre{font-weight:700;letter-spacing:-.02em}

/* ── 4. Animation des motifs : ils se dessinent, vivent quelques secondes, puis s'arrêtent ── */
.nv-t{stroke-dasharray:1;stroke-dashoffset:1;animation:nvT 1.3s cubic-bezier(.6,0,.3,1) var(--d,0s) forwards}
@keyframes nvT{to{stroke-dashoffset:0}}
.nv-bulle{opacity:0;animation:nvBulle 1.5s ease-out var(--d,1s) 3 both}
@keyframes nvBulle{0%{opacity:0;transform:translateY(0)}20%{opacity:.9}100%{opacity:0;transform:translateY(-34px)}}
.nv-onde{opacity:0;animation:nvApp .4s ease 1s both,nvOnde 1s ease-in-out 1.2s 4 alternate}
@keyframes nvOnde{to{transform:translateX(-4px)}}
.nv-flamme{transform-box:fill-box;transform-origin:50% 100%;animation:nvFlamme .45s ease-in-out 1.6s 8 alternate}
@keyframes nvFlamme{to{transform:scale(.9,1.1)}}
.nv-roue{animation:nvRoue 4.5s cubic-bezier(.2,.6,.3,1) .6s both}
@keyframes nvRoue{to{transform:rotate(160deg)}}
.nv-roue2{animation:nvRoue2 4.5s cubic-bezier(.2,.6,.3,1) .6s both}
@keyframes nvRoue2{to{transform:rotate(-270deg)}}
.nv-point{opacity:0;animation:nvApp .3s ease 1.8s both,nvSinus 2.2s linear 1.8s 2 both}
@keyframes nvSinus{0%{transform:translate(0,0)}12.5%{transform:translate(7.5px,-15.5px)}25%{transform:translate(15px,-21px)}37.5%{transform:translate(22.5px,-15.5px)}50%{transform:translate(30px,0)}62.5%{transform:translate(37.5px,15.5px)}75%{transform:translate(45px,21px)}87.5%{transform:translate(52.5px,15.5px)}100%{transform:translate(60px,0)}}
@keyframes nvApp{from{opacity:0}to{opacity:1}}
.nv-curseur{animation:nvClign .9s step-end 1.4s 5}
@keyframes nvClign{50%{opacity:0}}
.nv-bits{animation:nvBits 4s linear .8s both}
@keyframes nvBits{from{transform:translateX(0);opacity:.4}to{transform:translateX(-26px);opacity:1}}
.nv-pulse{transform-box:fill-box;transform-origin:center;animation:nvPulse .9s ease-out var(--d,1.4s) 4 both}
@keyframes nvPulse{50%{transform:scale(1.8);opacity:.35}}
.nv-etoile{animation:nvScint .7s ease-in-out 1s 4 alternate}
@keyframes nvScint{to{transform:scale(1.18) rotate(10deg)}}
.nv-flotte{animation:nvFlotte 1.1s ease-in-out 1.2s 4 alternate}
@keyframes nvFlotte{to{transform:translateY(-4px)}}
.col8 .nv-v{animation-iteration-count:2}
.col9 .nv-v{animation:none}
.col9 .nv-bulle,.col9 .nv-point{opacity:1}
@media (prefers-reduced-motion:reduce){
  .nv-motif .nv-t{animation:none;stroke-dashoffset:0}
  .nv-motif .nv-v{animation:none}
  .nv-motif .nv-bulle{opacity:0}
  .nv-motif .nv-onde,.nv-motif .nv-point{opacity:1}
}

/* ── 5. Les blocs du cours sur la feuille ── */
.feuille .cb-hero{display:none}
.feuille [id^="section"] + [id^="section"] > div{border-top:none}
.feuille .cb-section,.feuille .cb-step,.feuille .cb-conclusion,.feuille .cb-text,.feuille .cb-remark,.feuille .cb-iframe,.feuille .cb-list,.feuille .cb-table,.feuille .cb-quote,.feuille .cb-divider,.feuille .cb-footer,.feuille .cb-button{padding:12px 48px}
.feuille .cb-image,.feuille .cb-anim{padding:16px 48px}
.feuille .cb-section p,.feuille .cb-step-inner p,.feuille .cb-text p,.feuille .cb-remark-inner p,.feuille .cb-conc-box p{color:#273449;font-size:calc(var(--nfs) * var(--nk,1));line-height:var(--nlh,1.75)}
.feuille .cb-section h2,.feuille .cb-step h2,.feuille .cb-conclusion h2,.feuille .cb-list h2,.feuille .cb-table h2,.feuille .cb-iframe h2{font-size:1.16rem;color:var(--ntitre);margin:10px 0}
.feuille .cb-titre{padding:30px 48px 4px}
.feuille .cb-titre1 h2{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:var(--n1);font-size:clamp(1.3rem,3.4vw,1.55rem);padding-bottom:6px;border-bottom:1px solid rgba(var(--n1-rgb),.25)}
.feuille .cb-titre2{padding-left:48px;padding-top:20px}
.feuille .cb-titre2 h3{font-size:1.16rem;color:var(--ntitre)}
.feuille .cb-titre2 h3::before{content:"";display:inline-block;width:8px;height:8px;border-radius:2px;background:var(--n1);margin-right:10px;vertical-align:middle;transform:translateY(-2px)}
.feuille .cb-titre3{padding-left:66px}
.feuille .cb-titre3 h4{font-size:1.04rem;color:#334155;font-style:italic}
.feuille .cb-step-inner{border-left:3px solid var(--n1);background:var(--npale);border-radius:0 var(--nrb) var(--nrb) 0;padding:12px 18px}
.feuille .cb-step-inner h3{color:var(--n1)}
.feuille .cb-conc-box{background:var(--npale);border:1.5px solid var(--n1);border-radius:var(--nrb);padding:16px 20px}
.feuille .cb-conclusion h2{color:var(--n1)}
.feuille .cb-key-item{background:#fff;border:1px solid rgba(var(--n1-rgb),.25);border-radius:var(--nrb)}
.feuille .cb-key-item:hover{border-color:var(--n1)}
.feuille .cb-key-item b{color:var(--n1)}
.feuille .cb-key-item span{color:#334155}
.feuille .cb-remark-inner{border:none;border-left:4px solid var(--dc);border-radius:0 var(--nrb) var(--nrb) 0;padding:12px 18px}
.feuille .cb-remark-inner.type-remarque{background:#fff8eb}
.feuille .cb-remark-inner.type-avertissement{background:#fef2f2}
.feuille .cb-remark-inner.type-exemple{background:#ecfdf5}
.feuille .cb-remark-inner.type-question{background:#f5f3ff}
.feuille .cb-remark-inner.type-info{background:var(--npale)}
.feuille .cb-remark-title{font-size:.95rem}
.feuille .cb-img-frame,.feuille .cb-image img{border:1px solid rgba(15,23,42,.1);border-radius:var(--nrb);box-shadow:0 6px 18px -10px rgba(15,23,42,.35)}
.feuille .cb-anim > div,.feuille .cb-iframe > div{border-radius:var(--nrb)!important;background:#f4f7fb!important;box-shadow:0 0 0 1px rgba(15,23,42,.08),0 10px 26px -14px rgba(15,23,42,.45)}
.feuille .cb-list ul,.feuille .cb-list ol{color:#273449;font-size:calc(var(--nfs) * var(--nk,1));line-height:calc(var(--nlh,1.75) + .1)}
.feuille .cb-list li::marker{color:var(--n1)}
.feuille .cb-table table{border:1px solid rgba(15,23,42,.15);border-radius:var(--nrb);font-size:.98rem}
.feuille .cb-table th{background:rgba(var(--n1-rgb),.1);color:var(--ntitre)}
.feuille .cb-table td{color:#273449;border-top:1px solid rgba(15,23,42,.1)}
.feuille .cb-table tr:nth-child(even) td{background:#f8fafc}
.feuille .cb-quote-inner{background:#f5f3ff;border-left-color:var(--n2)}
.feuille .cb-quote-text{color:#1e293b}
.feuille .cb-divider hr{border-top:1px solid rgba(15,23,42,.15)}
.feuille .cb-footer{border-top:1px solid rgba(15,23,42,.1);margin-top:18px;padding:18px 48px 24px;color:#64748b;font-family:var(--ntf)}
.feuille .cb-audio-btn{background:var(--n1);box-shadow:0 6px 14px -8px rgba(var(--n1-rgb),.9);padding:8px 16px;font-size:13.5px}
.feuille .cb-audio-btn.playing{background:#be185d;box-shadow:0 6px 14px -8px rgba(190,24,93,.9)}
.feuille .cb-step p b,.feuille .cb-text p b,.feuille .cb-remark p b,.feuille .cb-conclusion p b,.feuille .cb-section p b{color:var(--n1)}
.feuille .cb-step p i,.feuille .cb-text p i,.feuille .cb-remark p i{color:#9a3412}
.feuille code{background:#eef2f7;color:#0f172a}
.feuille mark{background:#fef08a;color:#0f172a}
.feuille u{text-decoration-color:var(--n1)}
@media(max-width:700px){
  .feuille{border-radius:calc(var(--nrf) - 4px)!important}
  .feuille .cb-section,.feuille .cb-step,.feuille .cb-conclusion,.feuille .cb-text,.feuille .cb-remark,.feuille .cb-iframe,.feuille .cb-list,.feuille .cb-table,.feuille .cb-quote,.feuille .cb-divider,.feuille .cb-footer,.feuille .cb-button,.feuille .cb-image,.feuille .cb-anim{padding:10px 18px}
  .feuille .cb-titre{padding:24px 18px 2px}.feuille .cb-titre2{padding-left:18px}.feuille .cb-titre3{padding-left:30px}
  .feuille .cb-section p,.feuille .cb-step-inner p,.feuille .cb-text p,.feuille .cb-remark-inner p,.feuille .cb-conc-box p{font-size:calc(var(--nfs) - .04rem)}
}

/* ── 6. Décor propre à chaque famille ── */
/* expérimental : titres en étiquette de flacon */
.niv-exp .feuille .cb-titre1 h2{display:inline-block;background:rgba(var(--n1-rgb),.09);border:1.5px solid rgba(var(--n1-rgb),.4);border-radius:8px;padding:2px 14px 3px 16px;position:relative}
.niv-exp .feuille .cb-titre1 h2::before{content:"";position:absolute;left:-1.5px;top:50%;width:6px;height:60%;background:var(--n1);transform:translateY(-50%);border-radius:0 4px 4px 0}
.niv-exp .feuille .cb-remark-inner{border-left-style:dashed}
/* technique : capitales et trait de cotation, coins carrés */
.niv-tech .feuille .cb-titre1 h2{display:inline-block;text-transform:uppercase;font-size:1.16rem;letter-spacing:.06em;font-weight:700;border-bottom:none;padding-bottom:9px;position:relative}
.niv-tech .feuille .cb-titre1 h2::after{content:"";position:absolute;left:0;right:0;bottom:0;height:9px;border-left:1.5px solid var(--n2);border-right:1.5px solid var(--n2);background:linear-gradient(var(--n2),var(--n2)) 0 50%/100% 1.5px no-repeat}
.niv-tech .feuille .cb-titre2 h3::before{border-radius:0}
.niv-tech .feuille .cb-conc-box{position:relative}
.niv-tech .feuille .cb-conc-box::before,.niv-tech .feuille .cb-conc-box::after{content:"";position:absolute;width:12px;height:12px;border-color:var(--n2);border-style:solid}
.niv-tech .feuille .cb-conc-box::before{left:-5px;top:-5px;border-width:2px 0 0 2px}
.niv-tech .feuille .cb-conc-box::after{right:-5px;bottom:-5px;border-width:0 2px 2px 0}
/* maths : double trait, encadrés façon « Théorème » */
.niv-math .feuille .cb-titre1 h2{display:inline-block;font-weight:700;border-bottom:3px double rgba(var(--n1-rgb),.6);padding-bottom:4px}
.niv-math .feuille .cb-conc-box{border:none;border-left:5px solid var(--n1);border-radius:0 var(--nrb) var(--nrb) 0}
.niv-math .feuille .cb-conclusion h2,.niv-math .feuille .cb-remark-title{font-variant:small-caps;letter-spacing:.04em}
/* informatique : signes de code, fenêtre à trois points */
.niv-info .feuille .cb-titre1 h2{font-weight:700;border-bottom:none}
.niv-info .feuille .cb-titre1 h2::before{content:">";color:var(--n2);margin-right:.45em;font-weight:900}
.niv-info .feuille .cb-titre2 h3::before{width:auto;height:auto;background:none;border-radius:0;content:"$";color:var(--n2);opacity:.75;transform:none;margin-right:.45em}
.niv-info .feuille .cb-conc-box{background:#fff;border:1px solid #1f2937;padding:0;overflow:hidden}
.niv-info .feuille .cb-conc-box::before{content:"";display:block;height:28px;background:#111827 radial-gradient(circle at 18px 50%,#ef4444 0 5px,transparent 5.5px),radial-gradient(circle at 34px 50%,#f59e0b 0 5px,transparent 5.5px),radial-gradient(circle at 50px 50%,#22c55e 0 5px,transparent 5.5px);background-color:#111827}
.niv-info .feuille .cb-conc-box > p,.niv-info .feuille .cb-conc-box > .cb-key-grid{margin:12px 16px}
/* 21 : titres en dégradé labo + maths */
.niv-expmath .feuille .cb-titre1 h2{display:inline-block;background:linear-gradient(90deg,var(--n1),var(--n2));-webkit-background-clip:text;background-clip:text;color:transparent;border-bottom:2px solid rgba(67,56,202,.35)}
/* 22 : pastille de circuit, encadré en tirets */
.niv-techinfo .feuille .cb-titre1 h2{font-weight:700;letter-spacing:.02em}
.niv-techinfo .feuille .cb-titre1 h2::before{content:"";display:inline-block;width:.55em;height:.55em;border:2px solid var(--n2);border-radius:50%;margin-right:.5em;vertical-align:.05em}
.niv-techinfo .feuille .cb-conc-box{border-style:dashed}
/* collège : titres en pastilles colorées, ronds de couleur */
.niv-col .feuille .cb-titre1 h2{display:inline-block;color:#fff;background:linear-gradient(100deg,var(--n1),var(--n2));-webkit-background-clip:border-box;background-clip:border-box;border:none;border-radius:999px;padding:3px 18px 4px;font-size:1.22rem}
.niv-col .feuille .cb-titre2 h3{color:var(--n1)}
.niv-col .feuille .cb-titre2 h3::before{border-radius:50%;background:var(--n3);width:.6em;height:.6em}
.niv-col .feuille .cb-conc-box{border-width:2px}
.col9 .feuille .cb-titre1 h2{background:none;color:var(--n1);border-radius:0;padding:0 0 4px;border-bottom:3px solid rgba(var(--n1-rgb),.35)}

/* ── 7. La série sur la feuille ── */
.nv-serie{margin-top:16px}
.nv-serie #serieApp{margin:0;padding:18px 28px 26px}
/* le titre de la série est déjà dans le bandeau : la tête du moteur ne garde que ses puces */
.nv-serie .ms-tete{background:none;border:none;box-shadow:none;padding:0;margin:0 0 14px}
.nv-serie .ms-kicker,.nv-serie .ms-titre{display:none}
.nv-serie .ms-tete::before{display:none}
.nv-serie .ms-kicker{color:var(--n1)}
.nv-serie .ms-titre{background:none;-webkit-background-clip:border-box;background-clip:border-box;color:var(--ntitre);font-family:var(--ntf);-webkit-text-fill-color:currentColor}
.nv-serie .ms-exo{background:#fff;border:1px solid rgba(15,23,42,.1);box-shadow:0 14px 34px -24px rgba(15,23,42,.45);border-radius:var(--nrb)}
.nv-serie .ms-exo-tete{background:var(--npale)}
.nv-serie .ms-exo-titre{font-family:var(--ntf);color:var(--ntitre)}
.niv-info .nv-serie .ms-exo-titre::before{content:">";color:var(--n2);margin-right:.45em}
@media(max-width:700px){.nv-serie #serieApp{padding:12px 10px 18px}}

/* ── 8. Figures SVG dessinées pour un fond sombre : retournées en clair (classe posée par js/niveaux.js) ── */
.feuille svg.nv-inv{filter:invert(1) hue-rotate(180deg)}
.feuille svg.nv-inv image{filter:invert(1) hue-rotate(180deg)}

/* ── 9. Flèche dessinée (pages d'édition) ── */
.fleche{display:inline-block;position:relative;width:1.3em;height:.7em;vertical-align:.05em}
.fleche::before{content:"";position:absolute;left:.05em;right:.12em;top:50%;border-top:.09em solid currentColor;transform:translateY(-50%)}
.fleche::after{content:"";position:absolute;right:.06em;top:50%;width:.32em;height:.32em;border-top:.09em solid currentColor;border-right:.09em solid currentColor;transform:translateY(-50%) rotate(45deg)}

/* ── 10. Animations du texte (EDITION/edite-text-contenue.html) ; départ au survol, au clic, à l'écran : js/niveaux.js ── */
.an{display:inline-block;animation-duration:var(--an-d,1s);animation-delay:var(--an-r,0s);animation-iteration-count:var(--an-n,infinite);animation-fill-mode:both;animation-timing-function:ease-in-out}
.an-clignote{animation-name:an-clignote}
.an-pulse{animation-name:an-pulse}
.an-fondu{animation-name:an-fondu}
.an-machine{animation-name:an-machine;animation-timing-function:steps(var(--an-s,20),end)}
.an-surligne{display:inline;animation-name:an-surligne;background-image:linear-gradient(var(--an-c,rgba(253,224,71,.65)),var(--an-c,rgba(253,224,71,.65)));background-repeat:no-repeat;background-size:100% 100%;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.an-souligne{display:inline;animation-name:an-souligne;background-image:linear-gradient(var(--an-c,currentColor),var(--an-c,currentColor));background-repeat:no-repeat;background-position:0 100%;background-size:100% .12em;padding-bottom:.08em}
.an-vibre{animation-name:an-vibre;animation-timing-function:linear}
.an-flotte{animation-name:an-flotte}
.an-rebond{animation-name:an-rebond}
.an-couleurs{animation-name:an-couleurs;animation-timing-function:linear}
.an[data-dep]:not(.an-go){animation-name:none!important}
@keyframes an-clignote{50%{opacity:.15}}
@keyframes an-pulse{50%{transform:scale(1.12)}}
@keyframes an-fondu{from{opacity:0}to{opacity:1}}
@keyframes an-machine{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes an-surligne{from{background-size:0 100%}to{background-size:100% 100%}}
@keyframes an-souligne{from{background-size:0 .12em}to{background-size:100% .12em}}
@keyframes an-vibre{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-2px)}40%,80%{transform:translateX(2px)}}
@keyframes an-flotte{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes an-rebond{0%,50%,80%,100%{transform:translateY(0)}30%{transform:translateY(-9px)}65%{transform:translateY(-4px)}}
@keyframes an-couleurs{0%,100%{color:#dc2626}20%{color:#ea580c}40%{color:#16a34a}60%{color:#2563eb}80%{color:#7c3aed}}
@media (prefers-reduced-motion:reduce){.an{animation:none!important}}

/* ── 12. Dans les éditeurs (js/niveau-editeur.js) : motif immobile, bouton « Voir l'animation » ── */
.nv-fixe .nv-motif .nv-t{animation:none;stroke-dashoffset:0}
.nv-fixe .nv-motif .nv-v{animation:none}
.nv-fixe .nv-motif .nv-bulle{opacity:0}
.nv-fixe .nv-motif .nv-onde,.nv-fixe .nv-motif .nv-point{opacity:1}
.nv-rejouer{display:none}
.nv-ed .nv-rejouer{display:inline-flex;position:absolute;left:14px;top:10px;z-index:2;align-items:center;gap:5px;padding:3px 10px;border-radius:999px;cursor:pointer;
  font:800 11px 'Segoe UI',system-ui,sans-serif;color:var(--n1);background:rgba(255,255,255,.85);border:1px dashed rgba(var(--n1-rgb),.45)}
.nv-ed .nv-rejouer:hover{background:#fff;border-style:solid}
.nv-ed .nv-serie .nv-titre{font-size:1.35rem;padding:14px 20px 12px}
.nv-ed .nv-serie .nv-bande{padding-left:20px;padding-right:20px}
.nv-ed .nv-serie .ms-exo{margin:14px}

/* ── 11. Impression : feuille blanche, sans bandeau animé ── */
@media print{.feuille{box-shadow:none!important}.nv-motif{display:none}}

/* Fraction : le « / » caché ajouté par l'ancienne édition de texte ne s'affiche pas (2026-10-21) */
span.frac>span{display:none}

/* ── Propriétés du site (2026-10-21) : largeur de la feuille et motif du bandeau caché ── */
html[style*="--nlarg"] .wrap{max-width:var(--nlarg)!important}
.nv-sans-motif .nv-motif{display:none}
.nv-sans-motif .nv-th{max-width:none}
